/* style_gallery.css*/
#title{ position:absolute; }
.wrapper_label_title  {position:fixed; margin-left:35%; top:120px;  background-image:url(resources/images/label_title.png); background-repeat:no-repeat; background-position:top left; border-top:1px solid #333; border-left:1px solid #333; border-bottom:1px solid #888;  border-right:1px solid #888; width:260px; height:60px;}
.label_title_abs{position:absolute; width:260px; height:60px;}
.title_rel { position:relative; height:60px;width:260px;  padding-top:15px; }
.label_title{ font-family: Impact, Arial, sans-serif; font-size:36px; color: #FFF; text-transform:uppercase; font-weight: normal; text-align:center;}
.hc { width:260px;  left:0;  margin-left:auto;  right:0;   margin-right:auto;  }
.vc { height:60px;  top:0;   margin-top:auto;   bottom:0;  margin-bottom:auto; }
bold{font-weight: bold;}
italic{font-style:italic;}
header{height:10px;}	
a, a:hover{border-style:none;text-decoration: none; }
/*   -------------------------------  right box content  -----------------------------------------  */
.wrapper_content  {position:relative; clear:right; float:right; right:9%; top:0px; width:450px; height:900px; z-index:9;}
.boxtitle{ padding-right:8px; padding-bottom:20px; font-family: Impact, Arial,Helvetica, sans-serif; font-size:24px; color: #4ea0e2;	}
.boxcontent   {padding-right:8px;color:#fff; font-family:  Arial,Helvetica, sans-serif; font-size:16px; } 	
/*   -------------------------------  footer - copyright -----------------------------------------  */
.copyright{position:fixed; bottom:5px; left:40%;  font-family:  Arial Narrow,Helvetica, sans-serif; font-size:14px;font-weight:bold; color:#000;}
.white{color:#fff;}
.wrapper_picture{ border:1px dotted #ddd;  width:390px; background-image:url(resources/images/bg_gallery3.png);background-repeat:repeat-y;background-position:center center;}
.picture{border:1px solid #aaa; padding:4px; margin-left:68px; margin-top:20px;}
.caption{font-family: Arial,Helvetica, sans-serif; font-size:12px; color:white; width:256px; text-align:center; margin-left:68px;}
/*   ---------------------------------------------------------------------------------------------  */
@media all and (orientation:portrait){
	.label_title{font-family:  Arial, sans-serif; font-size:24px; color: #4ea0e2; text-transform:uppercase; font-weight: bold; text-align:center;}	
	.wrapper_content  {position:relative; clear:right;float:right; right:1%; top:160px; width:420px; height:760px; z-index:9; overflow:auto;}	
	.wrapper_label_title  {position:fixed; margin-left:35%; top:45px;  background-image:url(resources/images/label_title.png); background-repeat:no-repeat; }
	.title_rel { position:relative; height:60px;width:260px;  padding-top:30px; }
}
@media  all and  (max-width: 1024px) and (orientation:landscape) {
	.label_title{padding-top:15px; font-family:  Arial, sans-serif; font-size:24px; color: #4ea0e2; text-transform:uppercase; font-weight: bold; }	
	.wrapper_content  {position:relative; clear:right;float:right; right:2%; top:110px; width:420px; height:560px; z-index:9; overflow:auto; }		
	.wrapper_label_title  {position:fixed; margin-left:35%; top:45px;  background-image:url(resources/images/label_title.png); background-repeat:no-repeat; }
}
@media  all and  (max-width: 1024px)  {
	.label_title{padding-top:15px; font-family:  Arial, sans-serif; font-size:24px; color: #4ea0e2; text-transform:uppercase; font-weight: bold; }	
	.wrapper_content  {position:relative; clear:right;float:right; right:2%; top:110px; width:420px; height:560px; z-index:9; overflow:auto; }		
	.wrapper_label_title  {position:fixed; margin-left:35%; top:45px;  background-image:url(resources/images/label_title.png); background-repeat:no-repeat; }
	}

@media only screen and (max-width: 620px) {
	.wrapper_content  {position:absolute;  float:right; right:1%; top:110px; width:80%; height:auto; z-index:9; overflow:auto;}	
	.wrapper_picture{  border-style:none; width:290px; background-image:none;}
	.picture{border:1px solid #ddd; padding:5px; margin-left:40px; margin-top:20px;}
	.boxtitle{ padding-bottom:20px; font-family: Impact, Arial,Helvetica, sans-serif; font-size:16px; color: #4ea0e2;	}
	.boxcontent   {color:#fff; font-family:  Arial, Helvetica, sans-serif; font-size:12px; padding-bottom:50px;} 	
	.copyright{position:fixed; bottom:5px; left:40%;  font-family:  Arial Narrow,Helvetica, sans-serif; font-size:8px;font-weight:bold; color:#000;}
	.label_title{padding-top:10px;  font-family: Arial, sans-serif; font-size:12px; color: #4ea0e2; text-transform:uppercase; font-weight: normal; } 
	.title_rel { position:relative; height:32px;width:121px;  padding-top:10px; }
	.hc { width:121px;  left:0;  margin-left:auto;  right:0;   margin-right:auto;  }
	.vc { height:32px;  top:0;   margin-top:auto;   bottom:0;  margin-bottom:auto; }
	.wrapper_label_title  {position:fixed; margin-left:25%; top:60px;  background-image:url(resources/images/label_title_wpa.png); background-repeat:no-repeat; background-position:center center; width:121px; height:32px;} 
	.wrapper_label_title  {position:fixed; margin-left:28%; top:60px;  background-image:url(resources/images/label_title_wpa.png); background-repeat:no-repeat; background-position:center center; width:121px; height:32px;}  	
}

@media only screen and (max-width: 620px) and (orientation:landscape){

	.wrapper_picture{  border-style:none; width:250px; background-image:none;}
	.wrapper_content  {position:absolute;  float:right; right:2%; top:25px; width:80%; height:auto; z-index:9; overflow:auto;}
}
@media only screen and (max-width: 620px) {
	.wrapper_picture{  border-style:none; width:250px; background-image:none;}
	.wrapper_content  {position:absolute;  float:right; right:2%; top:25px; width:80%; height:auto; z-index:9; overflow:auto;}
	}