@import url('https://fonts.googleapis.com/css2?family=Arsenal:ital,wght@0,400;0,700;1,400&family=Tinos:ital,wght@0,400;0,700;1,400&display=swap');

body { font-family: 'Arsenal', sans-serif; margin: 0px; padding:0px; font-size:17px; line-height:21px; text-align:left; color:#111; overflow-x:hidden; /*overflow-y:hidden;*/ background:rgba(255,255,255,0.85);}

a { text-decoration:none; color:#111;}
hr { display:block; width:100%; margin:20px 0; height:1px; background-color:#ddd !important; border:0; float:none; clear:both;}
hr.small {margin:10px 0;}

.fix { clear: both; height:0px; line-height:0px; margin:0px; overflow: hidden;}
.fix5 { clear: both; height:5px; line-height:5px; margin:0px; overflow: hidden; }
.fix10 { clear: both; height:10px; line-height:10px; margin:0px; overflow: hidden; }
.fix15 { clear: both; height:15px; line-height:15px; margin:0px; overflow: hidden; }
.fix20 { clear: both; height:20px; line-height:20px; margin:0px; overflow: hidden; }
.fix30 { clear: both; height:30px; line-height:30px; margin:0px; overflow: hidden; }
.fix40 { clear: both; height:40px; line-height:40px; margin:0px; overflow: hidden; }
.fix50 { clear: both; height:50px; line-height:50px; margin:0px; overflow: hidden; }

h1 { margin:0px; padding:0px 0 20px 0; color:#111; font-size:24px; line-height:25px; font-weight:normal; font-style:normal; text-align:left;  text-transform:uppercase; } 
h2 { margin:0px; padding:0px 0px 3px 0px; color:#111; font-size:30px; line-height:30px; font-weight:normal; font-style:normal; text-align:center; text-transform:uppercase; font-family: 'Tinos', sans-serif;} 
h3 { font-size: 18px; padding: 0 5%; } 
h4 { margin:0px; padding:0px 0px 20px 0px; color:#fff; font-size:30px; line-height:30px; font-weight:bold; font-style:normal; text-align:left; text-transform:uppercase;} 
h5 { margin:0px; padding:0px 0 20px 0; color:#222; font-size:16px; line-height:20px;  font-weight:normal; font-style:normal;  text-align:left;   }

.showDesktop { visibility:visible !important; display:inline-block !important;}
.showDesktopB { visibility:visible !important; display:block !important;}
.showDesktopTablet { visibility:visible !important; display:inline-block !important;}
.showDesktopTabletB { visibility:visible !important; display:block !important;}
.showMobileTablet { visibility:hidden !important; display:none !important;}
.showMobileTabletB, .showMobileTabletIB { visibility:hidden !important; display:none !important;}
.showMobile { visibility:hidden !important; display:none !important;}
.hideTablet {}

.floatLeft { float:left;}
.floatRight { float:right;}

.pg1 { position:absolute; top:0; left:0; width:100%; height:100%; }
.pg2 { height:100%;/*height:92%;*/ width:100%; display:table; text-align:center;}
.pg3 { vertical-align: middle; height:100%;/*height: 90%;*/ width: 100%; display: table-cell; padding: 0%;      position: relative;}	 

body.dark {background:rgba(0,0,0,0.85); color:#fff;}
body.home {background-image: linear-gradient(0deg, #fff 0%, #f5f5f5 100%); height: 100vh;}

.librariaLogo { width:100%; padding:4% 0 5px; text-align:center; position: absolute;top: 0;}
	.relinfo .librariaLogo { padding:20px 0 40px; position:relative; }
.librariaLogo img { display:inline; margin:0 30px;}
.infoBody { padding:0 2%;}
.opikLogo { width: calc(100% - 20px); padding: 10px 10px 0; margin-top:30px; background:#fff; text-align:center; position: absolute; bottom: 0; box-shadow: 0px -5px 5px rgba(0,0,0,0.1);}
	.relinfo .opikLogo { position:relative; padding: 30px 10px 0; }
.opikLogo img { max-width:100%;}

a.contBtn { width: auto; padding: 10px 20px; background: #4bb8e2; color: #fff !important; text-transform: uppercase; display:inline-block; border-radius:10px; text-decoration:none;}
a.contBtn:hover { background:#42c897;}
		
.blue {color: #42a2c8;}		
		
.textContainer { display:block;  position:relative;   width:60%; padding:0px 20%; font-size:16px; text-align:left;}	
.textContainerCol { position:relative; display:block; width:50%; padding:0; float:left;}
.textContainerCol3 { position:relative; display:block; width:33%; padding:0; float:left; text-align:center;}
.textContainerCol3.rb { border-right:1px solid #ddd;}

.textContainer .text { position:relative;  margin:50px 0 0 0;  }
.textContainer .text .textLeft { position:relative;width:calc(100% - 320px); min-height:190px; margin:0 0 200px 0 !important; /*padding:0 0 0 20px; border:1px solid #eaeaea;*/ background:url(images/bracketServices.png) no-repeat 0 0;    float:left;}
	.textContainer .text .textLeft .pg1 { padding-left:30px; width:calc(100% - 30px);            padding:0 12% 0 8%; width:80%; }
			.textContainer .text.longText .textLeft .pg1 { padding:0 5% 0 5%; width:90%; }

			.textContainer .text.midText .textLeft .pg1 { padding:0 7% 0 7%; width:86%; }
	.textContainer .text .textLeft .pg2 { height:100%; }
.textContainer .text .textLeft h4 { color:#111; padding:0; font-size:29px; line-height:29px;}
.textContainer .text .textLeft hr { margin:15px 0 15px 0; background-color:#eee !important;  }
.textContainer .text .textLeft h5 { font-size:17px; line-height:21px; padding:0; font-weight:normal; }
	.textContainer .text.longText .textLeft h5 { font-size:16px; line-height:19px;}
.textContainer .text .textLeft h5 span { font-size:19px; line-height:22px; font-weight:bold; text-transform:uppercase; }
.textContainer .text .textLeft h5 strong { text-transform:uppercase; }
.textContainer .text .textLeft br { line-height:10px;}
.textContainer .text .textRight { position:relative; width:300px; float:right;}
.textContainer .text .textRight a, a.sqLink, .sqLink { display:block; width:280px;  height:50px; line-height:50px; padding:0 20px 0 0; margin:0 0 20px 0; border:0;  background:url(images/IncludesRightBtn.png) no-repeat center center; text-align:center; float:right; text-transform:uppercase;}
		a.sqLink { margin-top:10px; background:url(images/IncludesRightBtn.png) no-repeat center center #fff; font-style:italic; float:none; clear:both;  }
	.textContainer .text .textRight a:hover, .sqLink a:hover {background:url(images/IncludesRightBtnOn.png) no-repeat center center;}
.textContainer .text .textRight br { float:none; clear:both;}
.textTitlesContainer {position:absolute; top:-193px;left:0; right:0; width:100%; text-align:center; margin:0 auto;}
.textTitles { position:relative; display:inline-block; width:90%;width:630px; padding:0 5%;padding:0 30px 0 30px; margin:0; background: rgba(0,0,0, 0.9); text-align:center;}
		.textTitles.long {width:66%; padding:0 5%;}
	.textTitles h3 { display:inline-block;  padding:25px 0px 1px 0px; color:#fff; text-transform:uppercase; } 
	.textTitles h4 { display:inline-block;  padding:2px 0px 20px 0px; color:#fff; text-align:center; } 
.textTitles hr, .pImgDescContainer hr, .benefits .pImgDescContainer hr, .double hr { display:block; width:100%; min-width:350px; margin:12px 0; height:1px; background-color:#ccc !important; border:0; opacity:0.15; text-align:center;}
	.double hr { background-color:#000 !important; min-width:inherit;}
	.pImgDescContainer hr { margin:9px 0;}
	.benefits .pImgDescContainer hr { margin:12px 0;}
.shadow-div { position:absolute; top:-50px; left:0; width:90%; height:50px; margin:0 5%; background:url(images/shadow_div.png) no-repeat center top; background-size:contain; }
.bracketR { position:absolute; right:0px; top:0; width:6px; height:190px; background:url(images/bracketServices2.png) no-repeat 0 0;}
 
/* port */
a.arrowsLink { padding:2px 29px 0 0; margin:0px 35px 0px 0; font-size:20px; line-height:26px; font-weight:bold; background:url(images/arrowsBtn.png) no-repeat right center; text-transform:uppercase; float:right;  position:absolute; right:0; bottom:0;
opacity:1;filter:alpha(opacity=0);-webkit-transition:opacity 0.15s linear;-moz-transition:opacity 0.15s linear;-o-transition:opacity 0.15s linear;transition:opacity 0.15s linear; }
a.arrowsLink:hover { opacity:0.7;filter:alpha(opacity=70);-webkit-transition:opacity 0.15s linear;-moz-transition:opacity 0.15s linear;-o-transition:opacity 0.15s linear;transition:opacity 0.15s linear;}

	.arrowsLinkOnImgCont { position:absolute; top:0; left:0; display:block; width:100%; height:100%; background: rgba(0,0,0,0); text-align:center; vertical-align:middle; 
	opacity:0;filter:alpha(opacity=0);-webkit-transition:opacity 0.15s linear;-moz-transition:opacity 0.15s linear;-o-transition:opacity 0.15s linear;transition:opacity 0.15s linear; }
	.arrowsLinkOnImgCont:hover { background: rgba(0,0,0,0.95); 
	opacity:1;filter:alpha(opacity=100);-webkit-transition:opacity 0.25s linear;-moz-transition:opacity 0.25s linear;-o-transition:opacity 0.25s linear;transition:opacity 0.25s linear;}	
		.arrowsLinkOnImg { position:relative; top:0; left:0; display:block; width:100%; height:100%; overflow:hidden;  }
			.arrowsLinkOnImg a.arrowsLink { position:absolute;    left:calc(50% - 45px); top:calc(50% - 13px); background:url(images/arrowsBtn.png) no-repeat right center; width: 90px; height: 26px; margin:0px; padding:2px 0 0 0; display:block !important;  color:#fff;  float:none; text-align:left; vertical-align:middle;  opacity:1; }
			.arrowsLinkOnImg a.arrowsLink:hover {  opacity:0.7; }

.H4arrowsLink { width:75%; width:calc(100% - 120px); margin-top:9px;}
.H4arrowsLink a { display:inline-block; padding:1px 15px 0 0; margin:4px 15px 0px 0; font-size:12px; line-height:17px; background:url(images/arrowsBtnSmall.png) no-repeat right center; text-transform:uppercase; font-weight:normal;     float:left; 
opacity:1;filter:alpha(opacity=0);-webkit-transition:opacity 0.15s linear;-moz-transition:opacity 0.15s linear;-o-transition:opacity 0.15s linear;transition:opacity 0.15s linear;  }
.H4arrowsLink a:hover { opacity:0.7;filter:alpha(opacity=70);-webkit-transition:opacity 0.15s linear;-moz-transition:opacity 0.15s linear;-o-transition:opacity 0.15s linear;transition:opacity 0.15s linear;}
.H4arrowsLink br {}
.H4arrowsLink .usl { padding:1px 5px 5px 0; font-weight:normal; font-size:20px; float:left; }
 
.playBtn, .playBtnM { width:84px; height:84px; background:url(images/play_btn3.png) no-repeat center center #111; background-size:cover;   position:absolute; left:45%;left:calc(50% - 42px); top:45%;top:calc(50% - 42px); border-radius:50%; z-index:9;}
	
/* Owl */
#owl_ifr  { width:100% !important; overflow:visible; padding:0; margin:0;  } 
#owl_ifr .item { position:relative; width:100% !important; height:auto; padding:0; margin:0;   text-align:center; font-size:13px; line-height:21px; color:#fff; overflow:visible; }
#owl_ifr .item img { position:relative; display:block; top:0px; width:100% !important; height:auto;  padding:0; margin:0; }
	
#owl_ifr .owl-controls { position:absolute; top:45%;top:calc(50% - 28px); left:0px; width:100%;  			display:none !important;}
#owl_ifr .owl-prev, #owl_ifr .owl-next  { position: absolute; top:0px; left: -56px; background:url(images/prev_btn3.png) no-repeat left center; width: 38px; height: 49px;
opacity: 0.9; filter: alpha(opacity=90); -webkit-transition: opacity 0.15s linear; -moz-transition: opacity 0.15s linear; -o-transition: opacity 0.15s linear; transition: opacity 0.15s linear;} 
	#owl_ifr .owl-next { background:url(images/next_btn3.png) no-repeat right center; left:auto; right: -54px;  }
#owl_ifr .owl-prev:hover, #owl_ifr .owl-next:hover {/*opacity: 1; filter: alpha(opacity=100); -webkit-transition: opacity 0.15s linear; -moz-transition: opacity 0.15s linear; -o-transition: opacity 0.15s linear; transition: opacity 0.15s linear;*/}
/* Owl */ 
 
 
/**/ 
#map { background: rgba(0, 0, 0, 0.2); width: 100%; height: 150px; display: block;} 
.nicescroll-rails { z-index:8888888;}
.nicescroll-cursors { border:0 !important;}
#ascrail2000-hr { display:none !important;}
a.rfhl { cursor: pointer;}	

.klrAreaCloseBtnClone {display: block; position: fixed; width: 29px; height: 29px; background: rgba(0, 0, 0, 0) url("../indexdata/graphics/description/close_btn33b.png") no-repeat scroll 0% 0% / contain; overflow: hidden; text-indent: -9999px; cursor: pointer; background-position: top; right: 13px; top: 13px;}
@media only screen and (max-width: 1199px) { .klrAreaCloseBtnClone {background-color: #fff !important; top: 9px !important; right: 8px !important; width: 25px !important; height: 25px !important; border: 5px solid #fff !important;}}

#chooseOpenBtn { position:absolute; right:0; bottom:0; width:200px; height:70px; background:#111; z-index:9999; opacity:0;
-webkit-transition: opacity 0.20s; -moz-transition: opacity 0.20s; -o-transition: opacity 0.20s; transition: opacity 0.20s;}
#chooseOpenBtn:hover { opacity:1; -webkit-transition: opacity 0.20s; -moz-transition: opacity 0.20s; -o-transition: opacity 0.20s; transition: opacity 0.20s;}
#chooseOpenBtn a.arrowsLink { /*opacity:1;*/}
#chooseOpenBtn a:nth-child(1) { bottom:40px;}
/**/ 


 
			 
			@media only screen and (min-height: 685px) {  
					.infoBody { padding:0 5%;}
			}
			
					@media only screen and (max-width: 1199px) {
		 
					  
						.showDesktop, .showDesktop * { visibility:hidden !important; display:none !important;}
						.showDesktopB, .showDesktopB * { visibility:hidden !important; display:none !important;}
						.showDesktopTablet { visibility:visible !important; display:inline-block !important;}
						.showDesktopTabletB { visibility:visible !important; display:block !important;}
						.showMobileTablet {visibility:visible !important; display:inline !important;}
						.showMobileTabletB {visibility:visible !important; display:block !important;}
						.showMobileTabletIB {visibility:visible !important; display:inline-block !important;}
						.showMobile { visibility:hidden !important; display:none !important;}
						.hideTablet {visibility:hidden !important; display:none !important;}
							 
									
						
						
						.pg1 { position:relative !important; height:auto !important;}
						.pg2 { height:100%;height:auto !important; display:block !important; }
						.pg3 { display:block !important;height:auto !important;}	
						
						.librariaLogo { position: relative; padding-top:30px; text-align: center;}
						.infoBody { padding:0 2%;}
						.opikLogo { position: relative;}
						.librariaLogo img { display:block; margin:0 auto; max-width:100%;}
						
						
						
					}
				 
							@media only screen and (max-width: 770px) {     
								
								body { }
								
								.showDesktop, .showDesktop * { visibility:hidden !important; display:none !important;}
								.showDesktopB, .showDesktopB * { visibility:hidden !important; display:none !important;}
								.showDesktopTablet, .showDesktopTablet * { visibility:hidden !important; display:none !important;}
								.showDesktopTabletB, .showDesktopTabletB * { visibility:hidden !important; display:none !important;}
								.showMobileTablet {visibility:visible !important; display:inline !important;}
								.showMobileTabletB {visibility:visible !important; display:block !important;}
								.showMobile { visibility:visible !important; display:block !important;}
								.hideTablet, .hideTablet * {visibility:hidden !important; display:none !important;}
		 
								
							}
				 
													@media only screen and (max-height: 700px) {    
															.librariaLogo { padding:10px 0 5px; }
													}
													@media only screen and (max-height: 600px) {     
															body { line-height: 20px;}
															hr { margin:15px 0; }
													}
													@media only screen and (max-height: 540px) {     
															body { line-height: 19px;}
															hr { margin:10px 0; }
													}
				 
		 
		 
 
 
 
 
 
 
 
 
 