@import url('reset.css');
@import url('static.css');
@import url('elements.css');
@import url('preloader.css');


#fb5-ajax{
   position:relative;
}


#fb5-ajax a {
	-webkit-transition: none;
	-moz-transition:    none;
	-ms-transition:     none;
	-o-transition:      none;
	transition:         none;	
}

#fb5-ajax.margin_bottom{
   margin-bottom:30px;
}


#fb5-ajax.fb5-fullbrowser{
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0; 
	
	z-index:99999 !important;	
}

#fb5-ajax.fullScreen,#fb5-ajax[data-template="true"] {
     
}


#fb5-ajax .fb5-bcg-book{
	opacity:1;
	position:absolute;
	top:0;
	left:0;
    background: none no-repeat center center;
	background-size:cover;
	-moz-background-size:cover;
	-webkit-background-size:cover;
    width:100%;
	height:100%;
}


#fb5{
   font-family:Arial,sans-serif;	
   font-size:14px;	
   -webkit-text-size-adjust:none;
   position:absolute;
   overflow:hidden;
   top:0;
   left:0;
   display:block;
   width:100%;
   height:100%;
   opacity:0;
   
}

/* begin lightbox /*/
#fb5-ajax.fb5-lightbox {  
   z-index:99999 !important;
}

#fb5-ajax #fb5-close-lightbox{
	display:none;
}


#fb5-ajax.fb5-lightbox #fb5-close-lightbox{
	display:block;
	position:absolute;
	top:0px;
	right:1%;
	font-size:40px;
	color:white;
	cursor:pointer;
	opacity:1;
	z-index:10;
	font-family:"Arial";
	font-weight:900;
	
}

#fb5-ajax.fb5-lightbox #fb5-close-lightbox:after {
   content: '\2715';
  
}

/* end lightbox /*/



/* =  Gradient ( for right page )
--------------------------*/

.fb5-gradient-page{

width:100%;
height:100%;
position:absolute;	
top:0;
left:0;

	
}



/* =  Gradient ( for left page )
--------------------------*/

#fb5 .turn-page.odd .fb5-cont-page-book > .fb5-gradient-page {
	

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+97,cccccc+100&0+97,0.22+100 */
background: -moz-linear-gradient(left, rgba(255,255,255,0) 97%, rgba(204,204,204,0.22) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(255,255,255,0) 97%,rgba(204,204,204,0.22) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(255,255,255,0) 97%,rgba(204,204,204,0.22) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#38cccccc',GradientType=1 ); /* IE6-9 */
}




#fb5 .turn-page.even .fb5-cont-page-book > .fb5-gradient-page {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#cccccc+0,ffffff+10&0.41+0,0+9 */
background: -moz-linear-gradient(left, rgba(204,204,204,0.41) 0%, rgba(250,250,250,0) 9%, rgba(255,255,255,0) 10%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(204,204,204,0.41) 0%,rgba(250,250,250,0) 9%,rgba(255,255,255,0) 10%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(204,204,204,0.41) 0%,rgba(250,250,250,0) 9%,rgba(255,255,255,0) 10%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#69cccccc', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
}






#fb5 #fb5-container-book {
	position: absolute;
	z-index: 5;
	display: none;
	/* Fallback only - Book_v5.book_area() in onload.js sets the real width/height
	   on load and on every resize/orientation change based on the viewport. */
	width: 90vw; height: 60vh;
	max-width: 1100px; max-height: 715px;
}

.remove_scroll{
  overflow: hidden;	
}


#fb5 fieldset{
	
	
}


#fb5 #fb5-deeplinking{
  display:none;	
}



#test{
   margin:0 auto;
   width:100%;
}

#fb5 #page.mobile {
		width: 550px; height: 358px;
		margin: -210px 0 0 -275px;
	}
	
#fb5 #page .padding { /*padding: 0 34px;*/ }



#fb5 .cursor-grab {
	cursor: -webkit-grab;
	cursor: -moz-grab;
}


#fb5 .fb5-overlay {
	position: absolute; left: -10000px; top: 0; z-index: 20;
	
	/*background: url(../img/bg-overlay.png);/*/
	background:rgba(0,0,0,0);
	
	width: 100%; height: 100%;
	display:none;
}

#fb5 .fb5-overlay.active { left: 0; display:block; }


/* = Back button
-------------------------------------------------------------- */
   #fb5 #fb5-button-back{
	color:#FFFFFF;
	position:absolute;
	left:-5px;
	top:45px;
	background-color:#64C8D3;
	border-radius: 4px 4px 4px 4px;
	padding:5px;
	padding-left:15px;
	padding-right:10px;
	font-size:12px;
	font-weight:bold;
	margin-top:-45px;
  }
  #fb5 #fb5-button-back:hover{
	color:#64C8D3;  
	background-color:#FFFFFF
  }


/* = About
-------------------------------------------------------------- */

	#fb5 #fb5-about {
		position: absolute; z-index: 5;
		width: 45%; display: none;
		/*padding-top: 6%;/*/
	}

	#fb5 #fb5-about h1,
	#fb5 #fb5-about h2,
	#fb5 #fb5-about h3,
	#fb5 #fb5-about h4,
	#fb5 #fb5-about h5,
	#fb5 #fb5-about h6 {
		margin: 0 0 .7em 0;
		padding:0px;
		font-size: 1.375em;
		color: #64c8d3;
		-webkit-font-smoothing: antialiased;
		text-transform:none;
	}
	
	#fb5 #fb5-about h6 {
		margin: 0 0 4em 0;
		
	}
	
	#fb5 #fb5-about h1 {
		font-weight:1;	
	}
	
	#fb5 #fb5-about h1 strong {
		font-weight:900;	
	}
			
	
	#fb5 #fb5-about h3{
		background: url(../img/arrow-right.png) no-repeat 0 50%;	
		padding: 0 0 0 25px;	
	}
	
	#fb5 #fb5-about ul,#fb5-about ol {
		list-style:disc;
		margin: 0;
		padding-left:10px;
		padding-top:0%;
		padding-bottom:2%;
	}
	
	#fb5 #fb5-about li {
		color: #cfeaee;
		margin-bottom:4px;
	}
		
	
	#fb5 #fb5-about p {
		/*font-size: 0.688em;/*/
		color: #cfeaee;
		margin-bottom:4%;
	}
	
	#fb5 #fb5-about p.book {
		padding-left:100px;
		background: url(../img/icon_book.png) no-repeat 0 50%;
	}
	
	#fb5 #fb5-about p.notes {
		padding-left:100px;
		background: url(../img/icon_book2.png) no-repeat 0 50%;
	}
	
	#fb5 #fb5-about p.user {
		padding-left:100px;
		background: url(../img/icon_user.png) no-repeat 0 50%;
	}
	
	#fb5 #fb5-about a {
		color:#ffffff;	
		
		font-weight:900;
	}
	
	#fb5 #fb5-about a:hover {
		/*color:#ffffff;/*/	
		text-decoration:underline;
	}



/* = Book
-------------------------------------------------------------- */

#fb5 #fb5-book {
	position: relative; z-index: 10;
	width: 100%; height:100%;
}

#fb5 #fb5-book .turn-page {
	background-color:#FFF;
	background-size: 100% 100%;
}

#fb5 .fb5-double {
	background-size: 200% 100% !important;
}

#fb5 .fb5-double.fb5-first {
	background-position: 0% 0%;
}

#fb5 .fb5-double.fb5-second {
	background-position: -100% 0%;
}







	/* = Nav Arrows
	---------------------------------------- */
	
	#fb5 .fb5-nav-arrow {
		position: absolute; top: 50%; z-index: 15;
		background: url(../img/arrow-navpage.png);
		width: 64px; height: 68px;
		margin-top: -34px;
	}
		
	#fb5 .fb5-nav-arrow.next			{ right: -64px; background-position: 0 0; }
	#fb5 .fb5-nav-arrow.next:hover	{ background-position: 0 -72px; }
	
	#fb5 .fb5-nav-arrow.prev			{ left: -64px; background-position:0 -146px; display: none; }
	#fb5 .fb5-nav-arrow.prev:hover	{ background-position: 0 -215px; } 
	
	#fb5 .fb5-nav-arrow.next{
		transform-origin:0 center;
		-ms-transform-origin:0 center;
		-webkit-transform-origin:0 center;		 
    }
	
	#fb5 .fb5-nav-arrow.prev{
		transform-origin:right center;
		-ms-transform-origin:right center;
		-webkit-transform-origin:right center;		 
    }
	
		/*#page.mobile .fb5-nav-arrow.next { right: -24px; }*/



	/* = Cover
	---------------------------------------- */

	#fb5 #fb5-logo-cover {
		position: absolute; right: 10px; bottom: 10px; z-index: 5;
	}	

	#fb5 #fb5-cover ul {
		position:absolute;
		top:50%;
		-webkit-transform: translate(0,-50%);
        -ms-transform: translate(0,-50%);
		-moz-transform: translate(0,-50%);
		-o-transform: translate(0,-50%);
        transform: translate(0,-50%);
		clear: both;
		width: 100%;
		list-style: none;
		padding: 20px 0;
		border-top: 1px solid #e2e2e2;
		border-bottom: 1px solid #e2e2e2;
	}
	
	#fb5 #fb5-cover ul:after { clear: both; content: ''; display: block; }
	
	#fb5 #fb5-cover li {
		float: left;
		width: 28.3%;
		margin: 0 2.5%;
		list-style:none;
	}
		
	#fb5 #fb5-cover li,
	#fb5 #fb5-cover img {
		-moz-user-select: -moz-none;
		-khtml-user-select: none;
		-webkit-user-select: none;
		user-select: none;
		box-shadow:none;
	}
		
	#fb5 #fb5-cover li:last-child {
		margin-right: 0;
	}

	#fb5 #fb5-cover li img {
		float: left;
		width: 100%;
	}
	
	#fb5 a img {		
	     -moz-transition-duration: .5s;	
		 -webkit-transition-duration: .5s;
		 -ms-transition-duration: .5s;	
		 background-color: rgba(255,255,255,.01);	
	}
			
	#fb5 a img:hover {
		opacity: 0.5;		
	}
			


	/* = End
	---------------------------------------- */

	#fb5 #end { text-align: center; }
	
	#fb5 #end p { padding-top: 60%; }



	/* = Meta data
	---------------------------------------- */

	#fb5 #fb5-book .fb5-meta {
		position: absolute; bottom: 3%;
	}

	#fb5 .fb5-meta .fb5-num {
			font-weight: bold;
			font-size: 14px;
			color: #666;
			font-family:PT Sans,sans-serif;
	}
		
	#fb5 .fb5-meta .fb5-description {
			font-size: 13px;
			color: #666;
	        font-family:PT Sans,sans-serif;
	}

	#fb5 .fb5-meta.fb5-left { 
			left:10%;
	}
	
	#fb5 .fb5-meta.fb5-left .fb5-num {
		    padding-right: 10px;
	}
		
	#fb5 .fb5-meta.fb5-right {
			right:10%;
			text-align: right;
	}
		
	#fb5 .fb5-meta.fb5-right .fb5-num {
				padding-left: 10px;
	}
			
			
			
			
	/*= Video in lightbox
	----------------------------*/

	#v5_lightbox {
		width:100%;
		height:100%;
		z-index:555789;
		position:fixed;	
		display:block;	
		top:0px;
	}

	#v5_lightbox .bcg{
		width:100%;
		height:100%;
		background-color:#000;
		opacity:.7;	
		position:absolute;	
		cursor:pointer;
	}
    
	
	/* --------------------------*/
	
	.fb5-cont-page-book{
		position:absolute;		
	}
	
	#fb5 .fb5-page-book {
		
		position:relative;
	    -webkit-hyphens:none;
        -moz-hyphens:none;
        -ms-hyphens:none;
        hyphens:none;	
		overflow:hidden;
		
		padding:9%;
		box-sizing: border-box;
		
		z-index:1000;
	}
	
	
	#fb5 .fb5-page-book .center {
		/*text-align:center;
		padding-top:65%;/*/
	}
	
	#fb5 .fb5-page-book img {
		border:none;
		padding:0;
	}
	
	#fb5 .fb5-page-book p {
		margin-bottom:20px;
		line-height:1.5;
		text-align:justify;
	}
	
	#fb5 .fb5-page-book a {
		
		color:#64C8D3;
		font-weight:bold;
	}
	
	#fb5 .fb5-page-book p a:hover {
		text-decoration:underline;
	}
	
	#fb5 .fb5-page-book h1,
	#fb5 .fb5-page-book h2,
	#fb5 .fb5-page-book h3,
	#fb5 .fb5-page-book h4,
	#fb5 .fb5-page-book h5,
	#fb5 .fb5-page-book h6 {
	   font-family:Arial,sans-serif;
	   text-transform:none;
	   margin:0px;
	   
	}	
	
	#fb5 .fb5-page-book ul {
	    list-style: disc inside;
		margin-bottom:3% !important;
	}
	
	#fb5 .fb5-page-book ul li {
	   margin-bottom:2px;
	   list-style: disc inside;
	}
	
	#fb5 .fb5-page-book ol{		 
		margin-bottom:3% !important;	
	}
	
	#fb5 .fb5-page-book ol li {
	    list-style: decimal inside;
	}
	
	
	#fb5 .fb5-page-book ul li a, #fb5 .fb5-page-book ol li a {
	   color:#77797F;
	   font-weight:normal;	
	   text-decoration:none;
	}
	
	#fb5 .fb5-page-book ul li a:hover, #fb5 .fb5-page-book ol li a:hover {
	   text-decoration:underline;
	}
	
	#fb5 .fb5-page-book a:hover img {
      /* opacity:0.8;  /*/	  
	}
	
	
	/* =WordPress Core
-------------------------------------------------------------- */
#fb5 .fb5-page-book .alignnone,.#fb5-about .alignnone {
    margin: 5px 20px 20px 0;
}

#fb5 .fb5-page-book.aligncenter,.fb5-page-book div.aligncenter,#fb5-about.aligncenter,#fb5-about div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

#fb5 .fb5-page-book .alignright,#fb5-about .alignright {
    float:right;
    margin: 5px 0 20px 20px;
}

#fb5 .fb5-page-book .alignleft,#fb5-about .alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

#fb5 .fb5-page-book .aligncenter,#fb5-about .aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

#fb5 .fb5-page-book a img.alignright,#fb5-about a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

#fb5 #fb5 .fb5-page-book a img.alignnone,#fb5-about a img.alignnone {
    margin: 5px 20px 20px 0;
}

#fb5 .fb5-page-book a img.alignleft,#fb5-about a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

#fb5 .fb5-page-book a img.aligncenter,#fb5-about a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

#fb5 .fb5-page-book .wp-caption,#fb5-about .wp-caption {
    background: #fff;
    border: 1px solid #f0f0f0;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px 3px 10px;
    text-align: center;
}

#fb5 .fb5-page-book .wp-caption.alignnone,#fb5-about .wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

#fb5 .fb5-page-book .wp-caption.alignleft,#fb5-about .wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

#fb5 .fb5-page-book .wp-caption.alignright,#fb5-about .wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.fb5-page-book .wp-caption img,#fb5-about .wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

#fb5 .fb5-page-book .wp-caption p.wp-caption-text,#fb5-about .wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}


/* -----CAROUSEL-------
/*/

#fb5 #carousel_container {
	
}

#fb5 #carousel {
	border:0px solid #FF0000;
	position:absolute;
	top:50%;
	
	transform: translate(0,-50%);
	-webkit-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
    -moz-transform: translate(0,-50%);
	-o-transform: translate(0,-50%);
   

}

#carousel {
	cursor:pointer;	
}

#carousel img {
 	
}




/* = Media queries
-------------------------------------------------------------- */

@media screen and (max-width: 768px) { 

	/* Nothing here forced horizontal scroll before, but nothing prevented it
	   either - #fb5-container-book now gets its real size from Book_v5.book_area()
	   in onload.js, this is just a safety net. */
	#fb5, #fb5-ajax, #fb5-container-book {
		max-width: 100vw;
	}

	/* Footer toolbar: give icons real touch-target size and breathing room
	   instead of the desktop-density spacing. */
	#fb5 #fb5-footer .fb5-menu li a {
		min-width: 44px;
		min-height: 44px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	#fb5 #fb5-logo img {
		max-height: 32px;
	}

	/* The "About" panel used the desktop two-column proportions - give it
	   the full width on a narrow screen instead. */
	#fb5-about {
		width: 90% !important;
	}

	/* Product hotspots are positioned as percentages of the page image, so on
	   a small single-page layout they can shrink to just a few px - give them
	   a floor so they stay tappable regardless of the underlying product
	   region size. Desktop sizing (set inline per-hotspot) is untouched. */
	#fb5 .hotspot {
		min-width: 44px;
		min-height: 44px;
	}

	/* Go-to-page input/button matched desktop mouse-precision sizing (28px
	   wide input, 15px-tall button) - too small to tap/read reliably. */
	#fb5 .fb5-menu li.fb5-goto input[type='text'] {
		width: 40px;
		height: 32px;
		font-size: 14px;
	}
	#fb5 .fb5-menu li.fb5-goto button {
		height: 28px;
		top: 8px;
		font-size: 12px;
		padding: 0 6px;
	}
}

@media screen and (max-width: 480px) {
	/* On a phone-width screen, don't reserve space for the desktop-style
	   left/right nav arrows even before Book_v5.isMobile() removes them -
	   swipe is the primary navigation gesture here (turn.js handles
	   touchstart/touchmove/touchend natively). */
	#fb5 .fb5-nav-arrow {
		width: 44px;
		height: 48px;
	}

	/* Contact modal was a fixed 300px box centered with negative margins -
	   clipped on the left edge of phones narrower than ~340px (e.g. iPhone
	   SE at 320px). */
	#fb5 #fb5-contact form {
		width: 85vw;
		max-width: 300px;
		margin: 0;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
	}
}






/* =  Product quickview popup (Fancybox)
--------------------------*/

/* The Beaver Builder theme skin styles every button on the site for :focus and
   :active - red background, 1px border, and `position: relative`. That selector
   (`button:focus`, specificity 0,1,1) outranks Fancybox's own
   `.fancybox-close-small` (0,1,0), so the instant the popup's close button was
   clicked it lost `position: absolute`, dropped into normal document flow and
   landed somewhere else on the page, red. That is the whole "the X jumps from
   the right edge to the left instead of closing" bug - it was always one button
   being restyled, never two buttons.
   The theme declares these without !important, so restoring Fancybox's own
   values here is enough. Only the properties the theme breaks are touched;
   top/right still come from Fancybox and stay correct per slide type. */
.fancybox-container .fancybox-close-small:hover,
.fancybox-container .fancybox-close-small:focus,
.fancybox-container .fancybox-close-small:active {
	position: absolute !important;
	background-color: transparent !important;
	border: 0 !important;
	color: #ccc !important;
}
.fancybox-slide--iframe .fancybox-content {
	width: 790px !important;
	max-width: calc(100% - 40px) !important;
}