/* 악센트 텍스트*/
.Overview thumnail small {
    text-decoration-line: overline;
    box-shadow: 0px 0px 20px -11px rgba(0, 0, 0, 0.8);
	float: left;
    margin: 0%;
    padding: 10%;
    letter-spacing: -1px;

}
	u {
  text-decoration-line: underline;
  text-decoration-style: dotted;
  text-underline-offset:5px; 

  }
/* 메뉴 드롭다운 준비중 */
#button_menu {
	width: 800px;
    background-color: transparent;
}

.dropbtn {
  background-color: #4CAF50;
  color: white;
  padding: 16px;
  font-size: 16px;
  border: none;
  cursor: pointer;
}


.dropdown {
  display: initial;
}

.dropdown-content {
  display: inline;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {background-color: #fff}

.dropdown:hover .dropdown-content {
  display: block;
}

.dropdown:hover .dropbtn {
  background-color: #3e8e41;
}


/* 메뉴 드롭다운 끝 */


/* 디코이 페이지 시작 */
.decoy_001 a{
	margin: 0.1px;
	padding: 0;
    text-decoration-style: dotted;
    background-color: #336ff0;

}
/*decoy000 시작 */
#decoy000_title{
	background-color: #e9e9e9;
	width: 100%;
	height:auto;
	float: left;
    padding: 10px;
    margin: 0px;
    letter-spacing: -0.5px;

}


#decoy000_photo {
	background-color: #e9e9e9;
	width: 74.95%;
	height: 100%;
	float: right;
    margin: 4px 0px 0px 0px;
    padding: 16px;

}


#decoy000_ending {
	background-color: #fcfcfc;
    width: 100%;
	height: 100%;
    box-shadow: 0px 0px 20px -11px rgba(0, 0, 0, 0.8);
	float: left;
    margin: 0%;
    padding: 10%;
        letter-spacing: -0.5px;

    

}
#decoy000_article {
	background-color: #e9e9e9;
	width: 24.8%;
	height: 100%;
	float: left;
    margin: 4px 0px 0px 0px;
    padding: 16px;
        letter-spacing: -0.5px;

}

/* decoy000 페이지 끝*/


#decoy_title{
	background-color: #f6f5f8;
	width: 100%;
	height:auto;
	float: left;
    padding: 10px;
    margin: 0px;
    letter-spacing: -0.5px;

}
#decoy_subtitle{
	background-color: #f6f5f8;
	width: 100%;
	height:650px;
	float: left;
    padding: 10px;
    margin: 0px;
    letter-spacing: -0.5px;

}

#decoy_photo {
	background-color: #f6f6f6;
	width: 74.95%;
	height: 100%;
	float: right;
    margin: 4px 0px 0px 0px;
    padding: 16px;

}
#decoy_text {
	background-color: #fff;
	height: 100%;
	float: left;
    box-shadow: 0px 0px 16px 32px rgba(255, 255, 255, 0.9);
    margin: 3% 2% 2% 25%;;
    padding: 0% 13% 2% 8.5%;
    letter-spacing: -0.5px;
}

#decoy_ending {
	background-color: #fcfcfc;
    width: 100%;
	height: 100%;
    box-shadow: 0px 0px 20px -11px rgba(0, 0, 0, 0.8);
	float: left;
    margin: 0%;
    padding: 10%;
    letter-spacing: -0.5px;

}
#decoy_article {
	background-color: #fbfbfb;
	width: 24.8%;
	height: 100%;
	float: left;
    margin: 4px 0px 0px 0px;
    padding: 16px;
    letter-spacing: 0;
    letter-spacing: -0.5px;
}

/* 디코이 페이지 끝*/
/* Decoy002 페이지 시작*/
#decoy002_title{
    box-shadow: inset 0px 0px 0px 1px rgba(93, 93, 93, 0.8);
	width: 100%;
	height:70px;
	float: left;
    padding: 10px;
    margin: 0px;
    letter-spacing: -0.5px;

}
#decoy002_subtitle{
	background-color: #cecece;
	width: 100%;
	height:650px;
	float: left;
    padding: 10px;
    margin: 0px;
    letter-spacing: -0.5px;

}

#decoy002_photo {
	background-color: #fff;
	width: 74.94%;
	height: 100%;
    box-shadow: inset 0px 0px 0px 1px rgba(93, 93, 93, 0.8);
	float: right;
    margin: 4px 0px 0px 0px;
    padding: 16px;
    letter-spacing: -0.5px;

}


#decoy002_ending {
	background-color: #fff;
    width: 100%;
	height: 100%;
    box-shadow: inset 0px 0px 27px 1px rgba(0, 0, 0, 0.28);
	float: left;
    margin: 0%;
    padding: 10%;
    letter-spacing: -0.5px;

}
#decoy002_article {
	background-color: #fff;
    box-shadow: 0px 0px 0px 1px rgba(93, 93, 93, 0.8);
	width: 24.82%;
	height: 100%;
	float: left;
    margin: 5px 0px 0px 0px;
    padding: 16px;
    letter-spacing: -0.5px;
}
/* Decoy002 페이지 끝*/

/* Decoy003 페이지 시작*/
#decoy003_title{
    background-color: #c0c4be;
    box-shadow: inset 0px 0px 0px 0px rgba(93, 93, 93, 0.8);
	width: 100%;
	height:auto;
	float: left;
    padding: 10px;
    margin: 0px;
    letter-spacing: -0.5px;


}
#decoy003_subtitle{
	background-color: #cecece;
	width: 100%;
	height:auto;
	float: left;
    padding: 10px;
    margin: 0px;
    letter-spacing: -0.5px;

}

#decoy003_photo {
	background-color: #c0c4be;
	width: 74.92%;
	height: 100%;
    box-shadow: inset 0px 0px 0px 1px rgba(214, 219, 212, 1);
	float: right;
    margin: 0.25% 0px 0.175% -0px;
    padding: 16px;

}
#decoy003_text {
	background-color: #d6dbd4;
	height: 100%;
	float: left;
    box-shadow: 0px 0px 16px 32px rgba(214, 219, 212, 1);
    margin: 3% 2% 4% 25%;;
    padding: 6% 29.5% 6% 8.5%;
    line-height: 22pt;
    letter-spacing: -0.5px;
}

#decoy003_ending {
	background-color: #fff;
    width: 97%;
	height: 100%;
    box-shadow: inset 0px 0px 27px 1px rgba(214, 219, 212, 1);
	float: left;
    margin: 0%;
    padding: 10%;
    letter-spacing: -0.5px;

}
#decoy003_article {
	background-color: #c0c4be;
    box-shadow: 0px 0px 0px 0px rgba(93, 93, 93, 0.8);
	width: 24.84%;
	height: 100%;
	float: left;
    margin: 0.25% 0px 0.175% 0px;
    padding: 16px;
    letter-spacing: -1px;

}
/* Decoy003 페이지 끝*/
/* Decoy004 페이지 시작*/
#decoy004_title{
    background-color: #f0eea1;
    box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 240, 0.8);
	width: 100%;
	height:82px;
	float: left;
    padding: 10px;
    margin: -5px 0px 0px;
    letter-spacing: -0.5px;

}
#decoy004_subtitle{
	background-color: #f0eea1;
	width: 100%;
	height:auto;
	float: left;
    padding: 10px;
    margin: 0px;
    letter-spacing: -0.5px;

}

#decoy004_photo {
	background-color: #f0eea1;
	width: 74.92%;
	height: 100%;
    box-shadow: inset 0px 0px 0px 1px rgba(228, 223, 227, 1);
	float: right;
    margin: 0.25% 0px 0.175% -0px;
    padding: 16px;

}
#decoy004_text {
	background-color: #fff;
	height: 100%;
	float: left;
    box-shadow: 0px 0px 16px 16px rgba(246, 255, 194, 1);
    margin: 3% 2% 4% 25%;;
    padding: 4% 29.5% 4% 8.5%;
    line-height: 22pt;
    letter-spacing: -0.5px;
}

#decoy004_ending {
	background-color: #fff;
    width: 100%;
	height: 100%;
    align-content: center;
    box-shadow: inset 0px 0px 27px 1px rgba(228, 223, 227, 1);
	float: center;
    margin: 0%;
    padding: 10%;
    line-height: 2.1;
    letter-spacing: -0.5px;

}
#decoy004_article {
	background-color: #f0eea1;
    box-shadow: 0px 0px 0px 0px rgba(93, 93, 93, 0.8);
	width: 24.84%;
	height: 100%;
	float: left;
    margin: 0.25% 0px 0.175% 0px;
    padding: 16px;
    font-size: 12pt;
        letter-spacing: -0.8px;

}
#decoy004_credit {
	background-color: #222;
	height: 100%;
	float: left;
    box-shadow: 0px 0px 4px 8px rgba(56, 56, 56, 1);
    margin: 3% 2% 4% 62.0%;;
    padding: 1% 6% 1% 5%;
    line-height: 12pt;

}
/* Decoy004 페이지 끝*/

/* Decoy005 페이지 시작*/
#decoy005_title{
    background-color: #77a0ab;
    box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 1);
	width: 100%;
	height:86px;
	float: left;
    padding: 10px;
    margin: -5px 0px 0px;
    letter-spacing: -0.5px;

}
#decoy005_subtitle{
	background-color: #77a0ab;
    box-shadow: inset 0px 0px 4px 4px rgba(142, 231, 255, 1);
	width: 100%;
	height:auto;
	float: left;
    padding: 10px;
    margin: 0px;
    letter-spacing: -0.5px;

}
#decoy005_article {
	background-color: #77a0ab;
    box-shadow: inset 0px 0px 4px 4px rgba(142, 231, 255, 1);
	width: 24.84%;
	height: 100%;
	float: left;
    margin: 0.25% 0px 0.175% 0px;
    padding: 16px;
    font-size: 12pt;
    letter-spacing: -0.8px;}
    
#decoy005_photo {
	background-color: #77a0ab;
    
	width: 74.92%;
	height: 100%;
    box-shadow: inset 0px 0px 0px 1px rgba(228, 223, 227, 1);
	float: right;
    margin: 0.25% 0px 0.175% -0px;
    padding: 16px;

}
#decoy005_text {
	background-color: #dee9e9;
	height: 100%;
	float: left;
    box-shadow: 0px 0px 4px 11px  rgba(222, 233, 233, 1);
    margin: 3% 2% 4% 25%;
    padding: 4% 29.8% 4% 8.5%;
    line-height: 24pt;
    letter-spacing: -0.5px;
}

#decoy005_ending {
	background-color: #fff;
    width: 100%;
	height: 100%;
    align-content: center;
    box-shadow: inset 0px 0px 27px 1px rgba(218, 202, 184, 1);
	float: center;
    margin: 0%;
    padding: 10%;
    line-height: 2.1;
    letter-spacing: -0.5px;

}


#decoy005_credit {
	background-color: #8ee7ff;
	height: 100%;
	float: left;
    box-shadow: 0px 0px 4px 8px rgba(142, 231, 255, 1);
    margin: 3% 2% 4% 62.0%;;
    padding: 1% 6% 1% 5%;
    line-height: 12pt;

}
/* Decoy005 페이지 끝*/

#footer {
    width: 100%;
    max-height: 0px;
    font-size: 10pt;
    text-align: left;
    margin: 0% 0% 9% 0%;
    line-height: 1.4;}


    #open_menu_page{
        width:100%;
        display: center;
        position: absolute;
        top:1%;
        max-width:93%;
        padding:0%
           
}
.open_menu {
	position: center;
    margin-left:1%;
    padding-right: 0%;
    padding-top: 0.0%;
    display: inline-flex;
}

.open_menu :hover {
	color: #e69e86;}

.hover_menu{
    max-height:360px;
    max-width:90%;
    padding-top: 10px;
    scale: 0.5;
    position: fixed;  
    text-align: center;
    display: none ;
   
}
.open_menu:hover>.hover_menu{
    position: fixed;
    display: block;
    top:320px;
    bottom:78%;
    width:109px;
    height:100px;
    margin-left: 0px;
    margin-bottom: 20px;
    padding: 0%;
}


#two_hand {
    position: flex;
	z-index: -100;
    padding-left: auto;
    transform-origin: center;
    mix-blend-mode: exclusion;
}





#click_text{color: #7eb7e6;
	mix-blend-mode: exclusion;
}
#sound_button{
        background-color: rgba(255, 255, 255, 0);
                mix-blend-mode: exclusion;
    line-height: 0;
        padding-top: 0px;
        padding-left: 25px;
            rotate: 22deg;
    transform-origin: center;
animation: rotate_image 15s linear infinite;
        letter-spacing: 1px;}

	

.get rusty bodycopy {
    position: absolute;
    top: 0px;
    left: 0px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.92);
	box-shadow: 0px 0px 21px -4px rgba(147, 147, 147, 0.6);
    width: 100% ;
    height: 100%;
    display: none
        !important;
    justify-content: center;
    align-items: center;
    
}

/*books-cous-web*/
.books-cous {
	display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 16px;
}

.books-cous img {
	width: 100% !important;
    height: calc(100%+ 2px) !important;
    object-fit: cover;
}




.books-cous a {
	position: relative;
    height: 30vw;
}


.books-cous bodycopy {
	position: absolute;
    bottom: 50%;
    left: 0%;
    padding: 0px;
    background: rgba(255, 255, 255, 0.92);
	box-shadow: 0px 0px 21px -4px rgba(0, 0, 0, 0.6);
    width: 100% ;
    height: 110%;
    display: none
        !important;
    justify-content: center;
    align-items: center;
    
   
}


.books-cous a:hover > bodycopy {
    display: flex !important;
    
}



/*decoy-main-web*/

.decoy_main img {
	width: 100% !important;
    height: calc(100%+ 2px) !important;
    object-fit: cover;
}




.decoy_main a {
	position: relative;
    height: 62vw;
}


.decoy_main bodycopy {
	position: absolute;
    bottom: 0%;
    left: 0%;
    padding: 0px;
    background: rgba(69, 69, 69, 0.92);
	box-shadow: 0px 0px 21px -4px rgba(0, 0, 0, 0.6);
    width: 100% ;
    height: 100%;
    display: none
        !important;
    justify-content: center;
    align-items: center;
    
   
}


.decoy_main a:hover > bodycopy {
    display: flex !important;
}

#decoy_container {
	display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 16px;
}















/* Media Screen - Mobie */
@media screen and (max-width: 770px){	
    .entry-content p { /*모바일 본문 폰트 수정*/
        margin-bottom: 24px;
        font-size: 1.206em;
        line-height: 1.6;
        color:#141414
    }
   
    
    
    #books_cous_title{
    position:flex;
    }
    #sound_button{
        rotate: 0deg;
        scale: 2.8;
        padding-top: 3px;
        padding-left: -33px;
		position: flex;
        transform-origin: initial;
        align-items: center;
        mix-blend-mode: exclusion;
}
    
    /* 디코이 페이지 시작 */

.decoy_001 a{
	margin: 0.1px;
	padding: 0;
    background-color: #336ff0;

}
/*decoy000 시작 */
#decoy000_title{
	background-color: #e9e9e9;
	width: 100%;
	height:auto;
	float: left;
    padding: 10px;
    margin: 0px;

}
#decoy_subtitle{
	background-color: #f6f5f8;
	width: 100%;
	height:650px;
	float: left;
    padding: 10px;
    margin: 0px;

}
        #decoy_text {
	height: 100%;
	float: left;
        font-size: 1.5em;
      	line-height: 1.70em;;
    	letter-spacing: -0.01em;;
    margin: 20px 10px 30px 10px;
    padding: 4% 8.5% 4% 8.5%;
}

#decoy000_photo {
	background-color: #e9e9e9;
	width: 100%;
	height: 100%;
	float: right;
    margin: 4px 0px 4px 0px;
    padding: 16px;

}


#decoy000_ending {
	background-color: #fcfcfc;
    width: 100%;
	height: 100%;
    box-shadow: 0px 0px 20px -11px rgba(0, 0, 0, 0.8);
	float: left;
    margin: 0%;
    padding: 10%;

}
#decoy000_article {
	background-color: #e9e9e9;
	width: 100%;
	height: 100%;
	float: left;
    margin: 4px 0px 4px 0px;
    padding: 16px;
}

/* decoy000 페이지 끝*/
    /*decoy001 시작*/
#decoy_photo {
	background-color: #f6f6f6;
	width: 100%;
	height: 100%;
	float: right;
    margin: 4px 0px 0px 0px;
    padding: 16px;

}
#decoy_text {
	background-color: #fff;
	height: 100%;
	float: left;
    box-shadow: 0px 0px 9px 14px rgba(255, 255, 255, 0.9);
    margin: 20px 10px 30px 10px;
    padding: 2% 8.5% 7% 8.5%;
}
#decoy_ending {
	background-color: #f9f9f9;
    width: 100%;
	height: 100%;
	float: left;
    margin: 0%;
    padding: 10%;

}
#decoy_article {
	background-color: #fbfbfb;
	width: 100.0%;
	height: 100%;
	float: left;
    margin: 4px 0px 0px 0px;
    padding: 16px;
}
        /*decoy001 끝*/
    
        /*decoy002 시작*/
#decoy002_title{
    box-shadow: inset 0px 0px 0px 1px rgba(93, 93, 93, 0.8);
	width: 100%;
	height: auto;
	float: left;
    padding: 10px;
    margin-bottom: 1px;

}


#decoy002_photo {
	background-color: #fff;
	width: 100%;
	height: 100%;
    box-shadow: inset 0px 0px 0px 1px rgba(93, 93, 93, 0.8);
	float: right;
    margin: 5px 0px 5px 0px;
    padding: 16px;

}


#decoy002_ending {
	background-color: #fff;
    width: 100%;
	height: 100%;
    box-shadow: inset 0px 0px 27px 1px rgba(0, 0, 0, 0.28);
	float: left;
    margin: 0%;
    padding: 10%;

}
#decoy002_article {
	background-color: #fff;
    box-shadow: 0px 0px 0px 1px rgba(93, 93, 93, 0.8);
	width: 100%;
	height: 100%;
	float: left;
    margin: 5px 0px 5px 0px;
    padding: 16px;
}
    
#decoy002_text {
	background-color: #d6dbd4;
	height: 100%;
	float: left;
        font-size: 1.2em;
    box-shadow: 0px 0px 9px 14px rgba(214, 219, 212, 1);
    margin: 20px 10px 30px 10px;
    padding: 4% 8.5% 7% 8.5%;
}
/*decoy_002 끝*/
/*decoy003 시작*/
#decoy003_title{
    box-shadow: inset 0px 0px 0px 1px rgba(93, 93, 93, 0.8);
	width: 100%;
	height: auto;
	float: left;
    padding: 10px;
    margin-bottom: 1px;

}


#decoy003_photo {
	background-color: #c0c4be;;
	width: 100%;
	height: 100%;
    box-shadow: inset 0px 0px 0px 1px rgba(93, 93, 93, 0.8);
	float: right;
    margin: 5px 0px 5px 0px;
    padding: 16px;

}


#decoy003_ending {
	background-color: #fff;
    width: 100%;
	height: 100%;
    box-shadow: inset 0px 0px 27px 1px rgba(214, 219, 212, 1);
	text-align: center;
    float: left;
    margin: 0%;
    padding: 5%;

}
#decoy003_article {
	background-color: #c0c4be;;
    box-shadow: 0px 0px 0px 1px rgba(93, 93, 93, 0.8);
	width: 100%;
	height: 100%;
	float: left;
    margin: 5px 0px 5px 0px;
    padding: 16px;
}
    #decoy003_text {
	background-color: #d6dbd4;
	height: 100%;
	float: left;
        font-size: 1.5em;
      	line-height: 1.70em;;
    	letter-spacing: -0.01em;;
    box-shadow: 0px 0px 9px 14px rgba(214, 219, 212, 1);
    margin: 20px 10px 30px 10px;
    padding: 4% 8.5% 7% 8.5%;
}
    
    /*decoy003끝*/
#decoy004_title{
    background-color: #f0eea1;
 	box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.8);
	width: 100%;
	height: auto;
	float: left;
    padding: 40px 0px 20px 0px;
    margin-bottom: 0px;
    letter-spacing: -0.5px;
                font-size: 1.3em;
      	line-height: 1.08em;;
    	letter-spacing: -0.03em;;

}
#decoy004_subtitle{
	background-color: #f0eea1;
	width: 100%;
	height:100%;
	float: left;
    padding: 10px 2px 10px 2px;
    margin: 0px;

}

#decoy004_photo {

    	background-color: #f0eea1;
	width: 100%;
	height: 100%;
    box-shadow: inset 0px 0px 0px 1px transparent;
	float: right;
    margin: 5px 0px 5px 0px;
    padding: 16px;


}
#decoy004_text {
	
	background-color: #fff;
	height: 100%;
	float: left;
        font-size: 1.7em;
      	line-height: 1.74em;;
    	letter-spacing: -0.024em;;
    box-shadow: 0px 0px 9px 14px rgba(246, 255, 194, 1);
    margin: 20px 10px 30px 10px;
    padding: 4% 8.5% 7% 8.5%;

}

#decoy004_ending {

}
#decoy004_article {
	background-color: #f0eea1;
    box-shadow: 0px 0px 0px 0px transparent;
	width: 100%;
	height: 100%;
	float: left;
    margin: 3px 0px 3px 0px;
    padding: 16px;
        font-size: 1.6em;
      	line-height: 1.78em;;
    	letter-spacing: -0.02em;;
}
    #decoy004_credit {
	background-color: #222;
	height: 100%;
	float: left;
    box-shadow: 0px 0px 4px 8px rgba(56, 56, 56, 1);
    margin: 8% 2% 6% 23.3%;;
    padding: 1% 3% 1% 3%;
    font-size: 0.9em;
    line-height: 1.5em;
}
/* Decoy004 페이지 끝*/
    
#decoy005_title{
    background-color: #77a0ab;
 	box-shadow: inset 0px 0px 0px 4px rgba(142, 231, 255, 1);
	width: 100%;
	height: auto;
	float: left;
    padding: 60px 0px 10px 0px;
    margin-bottom: 0px;
    letter-spacing: -0.5px;
                font-size: 1.3em;
      	line-height: 1.08em;;
    	letter-spacing: -0.03em;;

}
#decoy005_subtitle{
	background-color: #77a0ab;
     	box-shadow: inset 0px 0px 0px 4px rgba(142, 231, 255, 1);
	width: 100%;
	height:100%;
	float: left;
    padding: 10px 8px 10px 8px;
    margin: 0px;

}
    
    #decoy005_article {
	background-color: #77a0ab;
 	box-shadow: inset 0px 0px 0px 4px rgba(142, 231, 255, 1);
	width: 100%;
	height: 100%;
	float: left;
    margin: 5px 0px 3px 0px;
    padding: 49px;
        font-size: 1.4em;
      	line-height: 1.78em;;
    	letter-spacing: -0.02em;;
}

#decoy005_photo {

    	background-color: #77a0ab;
	width: 100%;
	height: 100%;
    box-shadow: inset 0px 0px 0px 1px transparent;
	float: right;
    margin: 5px 0px 5px 0px;
    padding: 16px;


}
#decoy005_text {
	background-color: #dee9e9;
	height: 100%;
	float: left;
        font-size: 1.7em;
      	line-height: 1.74em;;
    	letter-spacing: -0.024em;;
    box-shadow: 0px 0px 9px 14px rgba(222, 233, 233, 1);
    margin: 20px 10px 30px 10px;
    padding: 7% 8.5% 7% 8.5%;

}

#decoy005_ending {

}

    #decoy005_credit {
	background-color: #59c1de;
	height: 100%;
	float: left;
    box-shadow: 0px 0px 4px 8px rgba(89, 193, 222, 1);
    margin: 8% 2% 6% 23.3%;;
    padding: 1% 3% 1% 3%;
    font-size: 0.9em;
    line-height: 1.5em;
}
/* Decoy005 페이지 끝*/


#open_menu_page{
    width: 100%;
    max-width:60%;
    margin: 2%;
    margin-top:13%;
    padding-top: 0px;
	text-align: left;
    line-height: 10px;
    position: absolute;
    display: inline-block;
    left: 0px;}
   
    
   .open_menu{
    width: 100%;
    position: initial;
    margin-top: -1.9%;
    margin-left: 0%;
    text-align: left;}
    
    .hover_menu{
        max-height: 0px;
	position: flex;
        scale:0.7;
    align-content: center;
    z-index:  -999;
    display: none;
}
    
    .open_menu:hover>.hover_menu{
    position: initial;
    bottom:78%;
    width:0px;
    height:100px;
    margin-left: 41%;
    padding: 1%;
}

     .books-cous {
         grid-template-columns: 1fr;
     gap: 16px;
         padding-top: 80px;
         padding-bottom: 24px;
}

	.books-cous a {
    height: 136vw;
        
}

    .books-cous bodycopy {
	position: absolute;
    bottom: 0%;
    left: 0px;
    padding: 32px;
    background: rgba(255, 255, 255, 0.9);
	box-shadow: 0px 0px 10px -4px rgba(0, 0, 0, 0.8);
    width: 100% ;
    height: 100%;
    display: none
        !important;
    justify-content: center;
    align-items: center;
    
}
}
   
   /**
 * Content
 */

body::before {
	color: #000;
  text-align: center;
    background-color: #fff;
    position: absolute;
    opacity: 0.45;
  
}

a:active {
	opacity: 0.7;
}

.page a.active {
	opacity: .4;
}

i,
em {
	font-style: italic;
}

b,
strong {
    margin-top: 6%;
    margin-bottom: 6%;
	font-weight: bolder;
    text-align: center;
}

sub,
sup {
	position: relative;
	vertical-align: baseline;
}

sub {
	top: 0.3em;
}

sup {
	top: -0.2em;
}

s {
	text-decoration: none ;
}

img {
	border: 0;
	padding: 8;
}

ul,
ol {
	margin: 0;
	padding: 0 0 0 1em;
}

blockquote {
	margin: 0;
	padding: 0 0 0 2em;
}

hr {
	background: rgba(127, 127, 127, 0.2);
	border: 0;
	height: 1px;
	display: block;
}

.content img {
	float: inherit;
	margin-bottom: 0.2em;
}

.gallery_image_caption {
    margin-top: 0.4rem;
    margin-bottom: 0.5rem;
    font-size: 0.7rem;
	font-weight: 550;
	color: rgba(0, 0, 0, 0.35);
	font-family: "Neue Haas Grotesk", Icons;
	font-style: medium;
	line-height: 1.5;	
}

/**
 * Loading Animation
 */

.loading[data-loading] {
	position: fixed;
	bottom: 8px; 
    left: 8px;
}

/**
 * Editor styles
 */

[data-predefined-style="true"] bodycopy {
	font-size: 0.8rem;
	font-weight: 300;
	color: rgba(44, 44, 44, 0.94);
	font-family: "Social Variable", Icons;
	font-style: normal;
	line-height: 1.6;
    
	font-variation-settings: 'wdth' 100, 'slnt' 0;
}
[data-predefined-style="true"] bodycopy a {
    border-bottom: 0;
	color: #000;
	padding-bottom: 1em;
    margin-bottom: 24px;
	text-decoration: none;
}

[data-predefined-style="true"] bodycopy a:hover {

}

bodycopy a.image-link,
bodycopy a.icon-link,
bodycopy a.image-link:hover,
bodycopy a.icon-link:hover {
	border-bottom: 0;
	padding-bottom: 0;
}

[data-predefined-style="true"] h1 {
	font-family: "Monument Grotesk Variable", Icons;
	font-style: normal;
	font-weight: 700;
	padding: 2px;
	margin: 0;
	font-size: 1.8rem;
	line-height: 1.2;
	color: rgba(0, 0, 0, 0.85);
	font-variation-settings: 'slnt' 0, 'MONO' 0;
	}

[data-predefined-style="true"] h1 a {
    border: 0;
	color: transparent;
}

[data-predefined-style="true"] h2 {
	font-family: "Work Sans", Icons;
	font-style: normal;
	font-weight: 400;
	padding: 2px;
    letter-spacing: -0.5px;
	margin: 0;
	color: rgba(0, 0, 0, 0.85);
	font-size: 1.6rem;
	line-height: 0.9;
	}

[data-predefined-style="true"] h2 a {
    border: 0;
	color: rgba(0, 0, 0, 1);
}

[data-predefined-style="true"] small {
	display: inline-block;
	line-height: 1.4;
	font-family: Ortica, Icons;
	color: rgba(0, 0, 0, 0.85);
    letter-spacing: 0.05em;
	font-style: normal;
	font-weight: 300;
}

[data-predefined-style="true"] small a {
    border: 0;
    font-size: 1.6rem;
	color: rgb(0, 0, 0);
}

/**
 * Breakpoints
 */


[data-css-preset] .page {
    background-color: initial /*!page_bgcolor*/;
}

.mobile .page,
[data-css-preset].mobile .page {
	position: relative;
	min-height: 10px;
	max-width: 100%;
	width: 100%;
	background-color: transparent /*!page_bgcolor*/;
}

[data-css-preset] .container {
	margin-left: auto /*!content_center*/;
	margin-right: auto /*!content_center*/;
    margin-bottom: 0rem;
    position: flex;
	text-align: left /*!text_left*/;
}

[data-css-preset] body {
	background-color: transparent/*!body_bgcolor*/;
}

[data-css-preset] .container_width {
	width: 100%/*!content_center*/;
}

[data-css-preset] .content_padding {
	padding-top: 0rem /*!main_margin*/;
	padding-bottom: 2rem /*!main_margin*/;
	padding-left: 0rem /*!main_margin*/;
	padding-right: 0rem /*!main_margin*/;
    
}

[data-css-preset] text-limit {
	display: inline-block /*!text_width*/;
	max-width: 66rem/*!text_width*/;
}

/**
 * Thumbnails
 */

div[thumbnails] {
	justify-content: flex-start;
}

[data-css-preset] .thumbnails {
   	background-color: transparent/*!thumbnails_bgcolor*/;   
}

[data-css-preset] .thumbnails_width {
    width: 100%/*!thumbnails_width*/;
}

[data-css-preset] [thumbnails-pad] {
    padding: 0rem/*!thumbnails_padding*/;
}

[data-css-preset] [thumbnails-gutter] {
    margin: 0rem/*!thumbnails_padding*/;
}

[data-css-preset] [responsive-layout] [thumbnails-pad] {
    padding: 0.5rem/*!responsive_thumbnails_padding*/; 
}

[data-css-preset] [responsive-layout] [thumbnails-gutter] {
    margin: -1rem/*!responsive_thumbnails_padding*/; 
}

.thumbnails .thumb_image {
	outline: 0px solid rgba(0,0,0,.12);
    outline-offset: -1px;
}

.thumbnails .title {
    margin-top: 1.2rem;
    margin-bottom: .3rem;
    font-size: 1.1rem;
	font-weight: 400;
	color: rgba(0, 0, 0, 0.85);
	font-family: "Neue Haas Grotesk", Icons;
	font-style: normal;
	line-height: 1.1;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.thumbnails .tags {
    margin-top: 1.2rem;
    margin-bottom: 0.5rem;
    font-size: 1.6rem;
	font-weight: 400;
	color: rgba(0, 0, 0, 0.35);
	font-family: "Freight Text", Icons;
	font-style: normal;
	line-height: 1.2;
}

.thumbnails .tags a {
	border-bottom: 0;
    color: rgba(0, 0, 0, 0.35);
    text-decoration: none;
}

.thumbnails .has_title .tags {
	margin-top: 0rem;
}

/**
 * Site Menu
 */

[data-css-preset] #site_menu_button {
    color: rgba(0, 0, 0, 1);
    mix-blend-mode: multiply;
    line-height: 1;
    font-size: 28px /*!site_menu_button*/;
    padding: 6px;
    line-height: 1;
    background: rgba(147, 141, 227, 0);
    position: fixed;
	top: 1rem /*!site_menu_button*/;
	right: 1rem /*!site_menu_button*/;
}

body.mobile #site_menu_button {
    scale: 0.9;
	margin: 0px;
}

#site_menu_button.custom_icon {
	width: 1.6em;
    height: auto;
        animation: rotate_image 6s linear infinite;transform-origin: 50% 50%;}

@keyframes rotate_image{
    100% {
        transform: rotate(360deg);
}
}
#site_menu_button.active {
	display: none;
    
}

/**
 * Site Menu
 */



#site_menu {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Sans Serif", Icons;
	background: rgba(56, 83, 163);
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	padding: 20px 30px 90px 30px;
	max-width: 400px;
	min-width: 300px;
	text-align: left;
	display: flex;
	justify-content: flex-start;
}

body.mobile #site_menu {
	width: 70%;
}

#site_menu .page-link a {
	color: rgba(255, 255, 255, 1);
}

#site_menu .set-link > a {
	color: rgba(255, 255, 255, 1);
	font-weight: bold;
}

#site_menu a:active {
	opacity: 0;
}


#site_menu .close {
	display: inline-block;
	color: rgba(255, 255, 255, 0.4);
	line-height: .85em;
	font-size: 45px;
}

body.mobile #site_menu .close {
	display: a;
	font-size: 50px;
	line-height: 1em;
}

#site_menu .break {
	height: 28px;
}

#site_menu .indent {
	margin-left: 28px;
}

/*
 * Shop Button
 */

[data-css-preset] #shop_button {
	color: rgba(0, 0, 0, 0.85);
    background: transparent;
	font-size: 32px;
    font-style: normal;
	font-weight: 400;
    line-height: 1;
    position: fixed;
	padding: 6px;
	top: 2rem /*!shop_button*/;
	right: 2rem /*!shop_button*/;
}

#shop_button.text {
    font-family: "Neue Haas Grotesk", Icons;
	font-size: 2rem;
    padding: 0;
	font-weight: 400;
	color: rgba(0, 0, 0, 0.85);
	font-style: normal;
}

#shop_button.custom_icon {
	width: 40px;
    height: auto;
}

body.mobile #shop_button:not(.text) {
	margin: -6px;
    font-size: 36px;
}

/*
 * Shop Product Wid
 */

.shop_product {
    width: 100%;
	max-width: 22rem;
    position: relative;
    display: block;
}

.shop_product .price {
	font-family: "Neue Haas Grotesk", Icons;
	font-size: 2rem;
	line-height: 1;
	color: rgba(0, 0, 0, 0.85);
    display: block;
    margin-bottom: 1rem;
	font-style: normal;
	font-weight: 400;
}

.shop_product .dropdown {
    font-family: "Neue Haas Grotesk", Icons;
    font-size: 1.4rem;
    display: inline-block;
	width: 100%;
    border: 1px solid rgba(0,0,0,.2);
    background:  white url(https://static.cargo.site/assets/images/select-arrows.svg) no-repeat right;
    margin-bottom: 1rem;
    line-height: 1.2;
    padding: .7rem 1rem;
	font-style: normal;
	font-weight: 400;
}

.shop_product .button {
    font-family: "Neue Haas Grotesk", Icons;
	font-size: 1.4rem;
    background: rgba(0, 0, 0, 0.7);
    color: rgba(255,255,255,1);
    flex: 0 0 50%;
    text-align: left;
    display: inline-block;
	line-height: 1;
    padding: .8rem 1rem .9rem;
	font-style: normal;
	font-weight: 400;
}

/*
 * Image Zoom
 */

.content img.image-zoom:active {
  opacity: .7;
}

/**
 * Quick View
 */

[data-css-preset] .quick-view {
    padding-top: 1.5rem /*!quick_view_padding*/;
    padding-bottom: 1.5rem /*!quick_view_padding*/;
    padding-left: 1.5rem /*!quick_view_padding*/;
    padding-right: 1.5rem /*!quick_view_padding*/;
    height: 100% /*!quick_view_height*/;
    width: 100% /*!quick_view_width*/;
}

body.mobile .quick-view {
    width: 100%;
    height: 100%;
    margin: 0;
}


[data-css-preset] .quick-view-background {
	background: initial /*!quick_view_bgcolor*/;
}

.quick-view-caption {
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;
    transition: 100ms opacity ease-in-out;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 2rem 0;
    text-align: center;
    font-size: 1.8rem;
}

.quick-view-caption span {
    padding: 0.5rem 1rem;
    display: inline-block;
    background: rgba(0,0,0,0.4);
    color: white;
}


/**
 * Quick View Navigation 
 */

.quick-view-navigation .left-arrow {
    left: 10px;
}

.quick-view-navigation .right-arrow {
    right: 10px;
}

.quick-view-navigation .left-arrow,
.quick-view-navigation .right-arrow {
    /* Change height/width together to scale */
    height: 36px;
    width: 36px;
}

.quick-view-navigation .left-arrow .inner-color,
.quick-view-navigation .right-arrow .inner-color {
    stroke: #fff;
    stroke-width: 1.5px;
}

.quick-view-navigation .left-arrow .outer-color,
.quick-view-navigation .right-arrow .outer-color {
    stroke: #000;
    stroke-width: 2.5px;
    opacity: 0.6;
}

.quick-view-navigation .close-button {  
    top: 10px;
    right: 10px;
    /* Change height/width together to scale */
    width: 36px;
    height: 36px;
}

.quick-view-navigation .close-button .inner-color {
    stroke: #fff;
    stroke-width: 1.5px;
}

.quick-view-navigation .close-button .outer-color {
    stroke: #000;
    stroke-width: 2.5px;
    opacity: 0.6;
}

/** 
 * Image Gallery Navigation Arrows 
 */
 
.image-gallery-navigation .left-arrow,
.image-gallery-navigation .right-arrow {
    /* Change height/width together to scale */
    height: 36px;
    width: 36px;
}

.image-gallery-navigation .left-arrow .inner-color,
.image-gallery-navigation .right-arrow .inner-color {
    stroke: #fff;
    stroke-width: 1.5px;
}

.image-gallery-navigation .left-arrow .outer-color,
.image-gallery-navigation .right-arrow .outer-color {
    stroke: #000;
    stroke-width: 2.5px;
    opacity: 0.6;
}

/**
 * Wallpaper Backdrop Navigation Arrows 
 */

.wallpaper-navigation .left-arrow,
.wallpaper-navigation .right-arrow {
   /* Change height/width together to scale */
   width: 36px;
   height: 36px;
}

.wallpaper-navigation .left-arrow .inner-color,
.wallpaper-navigation .right-arrow .inner-color {
   stroke: #fff;
    stroke-width: 1.5px;
}

.wallpaper-navigation .left-arrow .outer-color,
.wallpaper-navigation .right-arrow .outer-color {
    stroke: #000;
    stroke-width: 2.5px;
    opacity: 0.6;
}


/**
 * Feed
 */

.feed .content_container .page {
    border-top: 0px dashed rgba(0, 0, 0, 0.2);
}

.feed .content_container .page_container:first-child .page {
	border-top: 0;
}



/*
 * Audio Player
 */

.audio-player {
    max-width: 36rem;
    height: 3.3rem;
    outline: 1px solid rgba(0,0,0,0.15);
    color: rgba(0, 0, 0, 0.6);
    background: #fff;
    font-size: 1.2rem;
    line-height: 1.3;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Sans Serif", Icons;
    font-style: normal;
    font-weight: 400;
    text-align: left;
    margin: 1px 1px 1em 1px;
}

body.mobile .audio-player {
    max-width: 100%;
}

.audio-player .separator {
    width: 1px;
    background-color: rgba(0,0,0,0.15);
}

.audio-player .button {
    background: transparent;
    cursor: pointer;
    fill: rgba(0, 0, 0, 0.85);
}

.audio-player .icon {
    fill: rgba(0, 0, 0, 0.85);
    padding: 30%;
    width: 100%;
    margin: auto;
}

.audio-player .buffer {
    background: rgba(0,0,0,0.03);
}

.audio-player .progress {
    background: rgba(0,0,0,0.1);
}

.audio-player .progress-indicator {
    border: 1px solid rgba(0, 0, 0, 0.7);
    width: 1px;
    height: 100%;
    right: 0;
    position: absolute;
    cursor: ew-resize;
}

.audio-player .note-icon {
    height: 100%;
    width: 3.8rem;
    padding: 1rem;
    fill: rgba(0, 0, 0, 0.5);
}

.audio-player .current-time {
    padding-left: 1rem;
}

.audio-player .total-time {
    padding-right: 1rem;
}