<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">body{background:#fafafa;}

.ani_fade1{
    animation-name:ani_fade1; 
    animation-duration:  0.6s;
    animation-iteration-count:1;/* infinite;*/
    animation-direction: reverse;
    animation-timing-function :ease-in-out;
	animation-delay: 0.2s;
	animation-fill-mode:forwards;
	animation-timing-function :ease-in-out;
	opacity:0;

	}

@keyframes ani_fade1 {
    from {margin-right:0px; opacity:1;}
	 to { margin-right:-20px;  }
}
.ani_fade2{
    animation-name:ani_fade2; 
    animation-duration:  0.6s;
    animation-iteration-count:1;/* infinite;*/
    animation-direction: reverse;
    animation-timing-function :ease-in-out;
	animation-delay: 0.4s;
	animation-fill-mode:forwards;
	animation-timing-function :ease-in-out;
	opacity:0;

	}

@keyframes ani_fade2 {
    from {margin-right:0px; opacity:1; }
	 to { margin-right:-20px;  }
}
.ani_fade3{
    animation-name:ani_fade3; 
    animation-duration:  0.6s;
    animation-iteration-count:1;/* infinite;*/
    animation-direction: reverse;
    animation-timing-function :ease-in-out;
	animation-delay: 0.0s;
	animation-fill-mode:forwards;
	animation-timing-function :ease-in-out;
	opacity:0;

	}

@keyframes ani_fade3 {
    from {margin-top:0px; opacity:1; }
	 to { margin-top:-20px;  }
}

.ani_fade4{
    animation-name:ani_fade4; 
    animation-duration:  0.6s;
    animation-iteration-count:1;/* infinite;*/
    animation-direction: reverse;
    animation-timing-function :ease-in-out;
	animation-delay: 0.2s;
	animation-fill-mode:forwards;
	animation-timing-function :ease-in-out;
	opacity:1;

	}

@keyframes ani_fade4 {
    from {margin-top:0px; opacity:1; }
	 to { margin-top:-10px;  }
}

.ani_fade5{
    animation-name:ani_fade5; 
    animation-duration:  0.6s;
    animation-iteration-count:1;/* infinite;*/
    animation-direction: reverse;
    animation-timing-function :ease-in-out;
	animation-delay: 0.2s;
	animation-fill-mode:forwards;
	animation-timing-function :ease-in-out;
	opacity:1;

	}

@keyframes ani_fade5 {
    from {margin-left:0px; opacity:1; }
	 to { margin-left:-10px;  }
}
#box_inter{max-width:100%!important; position:relative; margin:0 auto; font-size:16px;
 -webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;  }
#bk_lines{
	background:#fff;
	border:1px solid #f1f1f1;	
 width:100%; height:70px;  position:relative;  
 overflow-x:auto; overflow-y:hidden;  text-align:center; -webkit-overflow-scrolling :touch;overflow-scrolling :touch;}
 #bk_lines a{line-height:70px; font-size:16px;}
.sch_class{ min-width:400px !important; position: absolute; right:20px; top:20px; z-index:10;}
@media (max-width: 1380px) {
#bk_lines{
background:#fff;
border:1px solid #f1f1f1;	
width:100%; height:50px;  position:relative;  
overflow-x:auto; overflow-y:hidden;  text-align:center; -webkit-overflow-scrolling :touch;overflow-scrolling :touch;}
.sch_class{ min-width:500px !important; position: relative; right:100px; top:5px; z-index:10;}
#bk_lines a{line-height:50px; font-size:14px;}
 }
.content_bottom_h{height:400px;}
.ft_left{float:left !important; } 
 #ft1s{width:80% !important; height:1200px; overflow-y:scroll; overflow-x:hidden; z-index:1;}
#ft1s img{ margin:0 auto; display:block;}
 #ft2s{width:15% !important; padding:2.5% !important; position: fixed !important; max-width:600px !important; height:1200px;   right:5% !important; background:#fafafa !important; border-left:1px solid #e8e8e8 !important; z-index:10;  }
.glay_lines{ width:100% !important; margin:20px 0 20px 0 !important; height:1px; background:#e8e8e8 !important;}
@media (max-width: 1450px) {
.glay_lines{ width:100% !important; margin:10px 0 10px 0 !important; height:1px; background:#fafafa !important;} 
 #box_inter{max-width:100%!important; position:relative; margin:0 auto; font-size:16px; }
.pot_imgss{display:none;}	
.ft_left{float:left !important; } 
 #ft1s{width:100% !important;}
#ft1s img{max-width:800px !important; width:100% !important; margin:0 auto; display:block;}
 #ft2s{width:100% !important; padding:2.5% !important; position: relative!important; max-width:1350px !important; height:200px;  right:0% !important; background:#fafafa !important; border-left:1px solid #e8e8e8 !important;  }
 }
@media (max-width: 900px) {
.content_bottom_h{height:800px;}
}
   
.main_btns_admin{ position: relative; left:0px; top:0px;}
h2.title { font-size: 68px; letter-spacing: -3px; font-weight: bold; text-align: center; margin-top: 35px; text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.6); }
h2.title span { font-size: 38px; line-height: 48px; display: block; letter-spacing: -2px; color: rgba(51, 51, 51, 0.5); }

/* -------------------------------------------------------------------------------------------------------------------------
wookmark1 of images
---------------------------------------------------------------------------------------------------------------------------- */

#wookmark1 {   }
/*
Add the transition affect to the images in the wookmark1. Any changes to the element will be transtioned from it's current state, for example on :hover */

#wookmark1 li { float: left; list-style: none; 
    margin:10px!important; position: relative; overflow: hidden; 
	-webkit-transition: all 0.15s ease-in;
	-moz-transition: all 0.15s ease-in;
	-ms-transition: all 0.15s ease-in;
	transition: all 0.15s ease-in;
	border:1px solid #f1f1f1;
    width:299px ; height:auto;
	overflow:hidden;
	z-index:10!important;
	

}

#wookmark1 li  {
    animation-name:wookmark1s; 
    animation-duration:  0.8s;
    animation-iteration-count:1;/* infinite;*/
    animation-direction: reverse;
    animation-timing-function :ease-in-out;
	 animation-delay:0.0s;
	animation-fill-mode:forwards;
	animation-timing-function :ease-in-out;



	}

@keyframes wookmark1s {
    from {opacity:1; margin-top:0px;   }
	 to {opacity:0.0; margin-top:-10%;    }
}

.scale {
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transition: all 0.3s ease-in-out;
  opacity:1;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"   
}
.scale:hover {
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transition: all 0.3s ease-in-out;
  opacity:0.9;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)" 
}
.more img{width:100%;}
#wookmark1 li img {width:100%;-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transition: all 0.3s ease-in-out;
  opacity:1;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"   }
#wookmark1 li img:hover{ opacity:0.8;
-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease ; transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transition: all 0.3s ease-in-out;
  opacity:0.9;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)" }
	
#wookmark1 .details { position: relative; bottom:0px; background: rgba(255,255,255,0.99); z-index:100;  padding: 10px;-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease; width:100% !important;
	
	 

	
}
#wookmark1 .details:hover { position: relative; bottom:0px; background: rgba(255,255,255,1);  padding: 10px;-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease; width:100% !important; 
	
}

@media (max-width: 500px) {
	
	#wookmark1 li {
	left:50%!important; margin-left:-40% !important;
	width:80% !important ; height: auto;
	
	overflow:hidden;
	z-index:100000000!important;
	

}
#wookmark1 li img {width:100%; height:100%;-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transition: all 0.3s ease-in-out;
  opacity:1;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"   }
#wookmark1 li img:hover{ opacity:0.8;
-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease ; 
	transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transition: all 0.3s ease-in-out;
  opacity:0.9;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)" }

}



@media (max-width: 1100px) {
	.none{display:none;}
	.m_m_m_m{display: block;}
 }

#wookmark1 .details h3 {margin-left: 5px; width:100%;margin-bottom: 0px; letter-spacing: -1px; }
#wookmark1 .details a.more { position: absolute; right: 10px; top: 5px; font-size: 12px; padding: 6px 10px; background-color: rgba(0, 0, 0, 0.03);
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 15px;
	-webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.15), 0 1px 0 rgba(255, 255, 255, 0.6);
	-moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.15), 0 1px 0 rgba(255, 255, 255, 0.6);
	box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.15), 0 1px 0 rgba(255, 255, 255, 0.6);
	-webkit-transition: all 0.15s ease-in;
}

#wookmark1 .details a.more:hover { background-color: #0090e2; color: #fff; }
#information { z-index: 20; -webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease ;}
/* -------------------------------------------------------------------------------------------------------------------------
Using :target we can style the specific ID of the list item when clicked/tapped on eg: www.url.com/#info1
---------------------------------------------------------------------------------------------------------------------------- */
#wookmark1 li[id], #information li[id]:target {  width: 100%; height: auto; opacity:1; filter: alpha(opacity=100);  z-index: 100000000000 !important; top:0px; right:0px;  position: fixed; overflow: hidden; /* overflow-y: scroll; */ margin-bottom:50px; }
#wookmark1 li[id], #information li[id]:target::-webkit-scrollbar { width: 0px; background-color: rgba(0,0,0,0.6); position: relative; left: }
#wookmark1 li[id], #information li[id]:target::-webkit-scrollbar-thumb {  }
#wookmark1 li[id], #information li[id]:target div { position: relative; margin: 0 auto; top:0%; background-color: rgba(255,255,255,1); width:100%; padding: 0px;
}
/* 
Style list items with an ID */
#wookmark1 li[id], #information li[id] { overflow: hidden;  width:0; height: 0; left: 0; top: 0;  background: rgba(0,0,0,0.7);

	-webkit-transition: opacity 0.2s cubic-bezier(0,0,0,1);
	-moz-transition: opacity 0.2s cubic-bezier(0,0,0,1);
	transition: opacity 0.2s cubic-bezier(0,0,0,1); 
	
	
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; 
       filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); 
       opacity:0; 

}
/* 
Lightbox close button */
li[id] div a.close {  position: fixed; top: 10px; right: 10px; z-index:10000;  color: #fff; text-align: center; -webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

li[id] div a.close:hover { transform:rotate(90deg);-o-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-webkit-transform: rotate(90deg);-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;  position: fixed; top: 10px; right: 10px;  color: #fff; text-align: center; 
}

/* 
Animation keyframes for the lightbox.
First line is at 0% so we're setting it to be 5x the actual size and rotate it around the Y axis by -270 degrees
100% resets it's actual size and resets the rotation back to flat. */
@-webkit-keyframes lightbox {
	0% { -webkit-transform: scale(5) rotateY(-270deg); }
	100% { -webkit-transform: scale(1) rotateY(0deg); }
}

@-moz-keyframes lightbox {
	0% { -moz-transform: scale(5) /* rotateY(-270deg) */; }
	100% { -moz-transform: scale(1) /* rotateY(0deg) */; }
}

/* -------------------------------------------------------------------------------------------------------------------------
Use Modernizer (http://www.modernizr.com) to display content for browsers that don't support CSS Transforms.
It now defaults to linking to the ID ie: www.url.com/#info3 and moving to that position on the page.
---------------------------------------------------------------------------------------------------------------------------- */
.no-csstransforms #information li { overflow: visible; position: relative; margin: 0 auto; margin-bottom: 25px; background: #fff; width: 600px; padding: 30px; height: auto; list-style: none; }	
.no-csstransforms #information li div a.close { position: relative; background: transparent; padding: 0; color: #0090e2; font-size: 12px; font-weight: normal; left: 0; top: 0; }	
</pre></body></html>