#main{
	position:relative;
	top: 20px;
	min-height:670px;
	visibility:hidden;
}


aside{
	float: left;
	width:170px;
	padding-top: 17px;
}

#gal_nav{
	list-style-type:none;
	margin: 0;
	color: #5c5f6d;
	font-family:"Helvetica", "Calibri", "Arial";
	font-size:0.6875em;
	font-weight:bold;
	
}

#gal_nav li{
	width: 165px;
	line-height:16px;	
	margin-bottom:10px;
   -webkit-border-radius: 3px;
    border-radius: 3px;
   -moz-background-clip: padding; 
   -webkit-background-clip: padding-box; 
    background-clip: padding-box;
    padding: 8px 0px 8px 10px;
    text-shadow: 0px 1px 2px #222;
  


}
#gal_nav li.short{
	height: 16px;
    background: url(../img/button_bg.png) top left no-repeat;
}
#gal_nav li.long{
	height: 30px;
    background: url(../img/button_bg_long.png) top left no-repeat;
}


#gal_nav li.short:hover{
	background: url(../img/button_act_bg.png) top left no-repeat;
	cursor:pointer;
	color: #797d90;
		
}
#gal_nav li.short.active{
	color: #d0d2d9;
	background: url(../img/button_act_bg.png) top left no-repeat;
	cursor:pointer;
}
#gal_nav li.long:hover{
	background: url(../img/button_act_bg_long.png) top left no-repeat;
	cursor:pointer;
	color: #797d90;
		
}
#gal_nav li.long.active{
	background: url(../img/button_act_bg_long.png) top left no-repeat;
	cursor:pointer;
	color: #d0d2d9;
		
}

#sec_layer{
	margin:0;
	list-style-type:none;
	display:none;
}
#sec_layer li{
	height: auto;
	padding: 2px 0px 2px 10px;
	line-height:16px;
	
}
#sec_layer li:hover{
	color: #797d90;
	cursor:pointer;
	
}
#sec_layer li.active{
	color: #e35d5d;
	cursor:pointer;
	
}
.form{
	width: 100%;
	height: 30px;
	overflow: hidden;
	
  background-color: #313540;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#313540), to(#292c36));
  background-image: -webkit-linear-gradient(top, #313540, #292c36);
  background-image:    -moz-linear-gradient(top, #313540, #292c36);
  background-image:      -o-linear-gradient(top, #313540, #292c36);
  background-image:         linear-gradient(to bottom, #313540, #292c36);

	-webkit-box-shadow: 0 0 .25em #000;
	box-shadow: 0 0 .25em #000;
	white-space: nowrap;
	display:none;	
}

.form:hover{
	
  background-color: #414552;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#414552), to(#343742));
  background-image: -webkit-linear-gradient(top, #414552, #343742);
  background-image:    -moz-linear-gradient(top, #414552, #343742);
  background-image:      -o-linear-gradient(top, #414552, #343742);
  background-image:         linear-gradient(to bottom, #414552, #343742);

}


#gal_nav2{
	font-family:"Helvetica", "Calibri", "Arial";
	font-size:11px;
	font-weight:bold;
	font-size:12px;
	color: #d0d2d9;
	padding: 9px 0 0 10px;
	border:none;
	background:transparent;
	background:none;
	-webkit-appearance:none;
	cursor:pointer;
	outline:none;
	background:url(../img/updown_arr.png) no-repeat 80% 10px;
	overflow:hidden;
						
}
#gal_nav2:active, #gal_nav2:focus{
	border: none;
	outline:none;
}





#gallery{
	float:left;
	width:74.87%;    /* 560px  */
	margin:17px 0 40px 2.406%;   /* 18px  */
	
	
}
#gallery img{
	opacity:0.5;
	filter: alpha(opacity=50);
	float: left;
	padding: 0 0 10px 10px;
}

.act{
	cursor:pointer;
	
}

.disabled{
	display: block;
	
}



.thumb_hover{
	display:inline-block;
	width: 70px;
	height: 70px;
	position:relative;
	top: 0;
	left: 0px;
	background: rgba(255,255,255,0.2);
	z-index:2;
	float: left;
	margin: 0 0 10px -70px;
}

#project{
	position:absolute;
	top: 0;
	left: 170px;
	float:left;
	margin:17px 0 0 3.743%;
	display:none;
}

#details{
	float:left;
	height: auto;
	width: 100%;
	-webkit-border-radius: 3px;
    border-radius: 3px;
   -moz-background-clip: padding; 
   -webkit-background-clip: padding-box; 
    background-clip: padding-box;
    background: rgba(255,255,255,0.2);
    font-family:'Helvetica','Arial','Calibri';
    margin-left:0px;
        
}

#details h2{
	font-size:14px;
	color: #fff;
	padding: 10px 12px 6px;
	margin:0;
	line-height:18px;
	font-weight:normal;
}
#details p{
	font-size:13px;
	color: #b1b1b1;
	padding: 0px 12px 8px;
	margin:0;
	line-height:15px;
}

#mainpic{
	float:left;
	margin: 0px 0 0px 0px;
	width:100%;
	
}

#maindiv{
	float:left;
	margin: 10px 0 10px 0px;
	width: 85%;
	-webkit-border-radius: 13px;
    border-radius: 13px;
   -moz-background-clip: padding; 
   -webkit-background-clip: padding-box; 
    background-clip: padding-box;
	background:  white url(../img/preloader.gif) center center no-repeat;
}

#sidebar{
	float: right;
	width: 12.72%;   /* 70px */
	margin-top: 1.818%;   /* 10px */
	margin-left:5px;
	
}
#sidebar a img{
	width:100%;
	margin-bottom:10px;
	opacity:0.3;
	filter: alpha(opacity=30);
}
#sidebar a img:hover{
	
	opacity:0.7;
	filter: alpha(opacity=70);
}

#sidebar a img.side_act{
	
	opacity:1.0;
	filter: alpha(opacity=100);
}

#prev{
	float:left;
	width: 23.63%;   /* 130px */
	height: 22px;
}

a#prev_btn{
	height:22px;
	line-height:22px;
	background:url(../img/back_btn.png) 0 0 no-repeat;
	float: left;
	padding-left:27px;
	font-family:'Arial','Helvetica','Calibri';
	font-size: 10px;
	color: #838792;
	text-decoration:none;
	padding-top: 1px;
}
a#prev_btn:hover{
	background:url(../img/back_btn.png) 0 -22px no-repeat;
	color: #aeb4c4;
}


#back{
	float:left;
	width: 38.18%;   /* 210px */
	height: 22px;
}

a#back_btn{
	width: 100%;
	height:22px;
	line-height:22px;
	float: left;
	font-family:'Arial','Helvetica','Calibri';
	font-size: 10px;
	color: #838792;
	text-decoration:none;
	padding-top: 1px;
	text-align:center;
}
a#back_btn:hover{
	color: #aeb4c4;
}
#next{
	float:left;
	width: 23.63%;   /* 130px */
	height: 22px;
}

a#next_btn{
	
	height:22px;
	line-height:22px;
	background:url(../img/next_btn.png) right 0 no-repeat;
	float: right;
	padding-right:27px;
	font-family:'Arial','Helvetica','Calibri';
	font-size: 10px;
	color: #838792;
	text-decoration:none;
	padding-top: 1px;
}
a#next_btn:hover{
	background:url(../img/next_btn.png) right -22px no-repeat;
	color: #aeb4c4;
}

.tooltip{
	display:none;
	background: white;
	color: #555;
	position:absolute;
	z-index:999;
	width: 200px;
}

.tooltip p{
	margin:0;
	padding:5px;
	font-size: 10px;
	text-align:left;
}



@media screen and (max-width: 768px){
	#gallery{
		width: 72%;
	}
	.tooltip{
	visibility:hidden;
	}
	
	
	
}




@media screen and (max-width: 688px){
	
	#gallery{
		width: 68.3%;
	}
	

}


@media screen and (max-width: 606px){
	
	#gallery{
		width: 100%;
		margin:17px 0 40px;
	}
	aside{
		padding-top:0px;
	}
	#gal_nav{
		display:none;
	}
	.form{
		display:block;
	}
	#gal_nav2{
		margin:0;
		width:120%;
	}
	.disabled{
		display: none;
	
	}
	#project{
		width:100%;
		top: 20px;
		left: 0;
		margin: 17px 0 0;
	}
	
}

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

	#maindiv{
	width:100%;
	}
	#sidebar{
	float: left;
	width: 100%;
	margin-top: 0;
	margin-left:0;
	
	}
	#sidebar a img{
		margin-bottom:0px;
		opacity:0.3;
		filter: alpha(opacity=30);
		width: 17.8%;  /* 54px */
		margin-right: 2.75%;  /* 10px */
	}
	#sidebar a:last-child img{
		
		margin-right:0px;
	}
	#prev{
	margin-top: 10px;
	width: 35%;  /* 130px */
	}
	#back{
	margin-top: 10px;
	width: 30%;  /* 110px */
	}
	
	#next{
	margin-top: 10px;
	width: 35%;  /* 130px */;
	}
	.tooltip{
	visibility:hidden;
	}

	
}

@media screen and (max-width: 390px){
	
	.form{
		margin-top:20px;
	}

}




 
 
/* 

@media screen and (max-width: 768px){
    #main{
		min-height: 500px;
	}
	.disabled{
		display: none;
	
	}
	#gal_nav{
	
		font-size:9px;
		display:none;
		
	}
	#gal_nav2{
		display:block;
				
}
	#gallery{
		float:left;
		width:320px;
		margin:17px 0 60px 0px;
		
		
	}
	aside{
		float: left;
		width:140px;
		padding-top: 17px;
	}
	#gal_nav li{
		width: 130px;
		margin-bottom: 2px;
	}
	#sec_layer li{
		line-height: 12px;
	}
	#project{
	left: 150px;
	width:310px;
	margin:17px 0 0 0px;
	}
	#details{
	width: 310px;
	}
	#maindiv{
	width: 310px;
	height: auto;
	}
	#mainpic{
	width:310px;
	height:auto;
	}
	#details h2{
	font-size:12px;
	color: #fff;
	padding: 4px 12px 2px;
	margin:0;
	line-height:16px;
	font-weight:normal;
	}
	#details p{
	font-size:11px;
	color: #b1b1b1;
	padding: 0px 12px 5px;
	margin:0;
	line-height:15px;
	}
	#sidebar{
	float: left;
	width: 310px;
	margin-top: 0px;
	margin-left:0px;
	
	}
	#sidebar a img{
		margin-bottom:0px;
		opacity:0.3;
		filter: alpha(opacity=30);
		width: 54px;
		margin-right:10px;
	}
	#sidebar a:last-child img{
		
		margin-right:0px;
	}
	#prev{
	margin-top: 10px;
	width:110px;
	}
	#back{
	margin-top: 10px;
	width:120px;
	}
	a#back_btn{
	width: 120px;
	height:22px;
	line-height:22px;
	float: left;
	font-family:'Arial','Helvetica','Calibri';
	font-size: 10px;
	color: #838792;
	text-decoration:none;
	padding-top: 1px;
	text-align:center;
	}
	#next{
	margin-top: 10px;
	width:80px;
	}
	.tooltip{
	visibility:hidden;
}
	

}
	

@media screen and (max-width: 480px){
    #main{
		min-height: 650px;
	}
	.disabled{
		display: none;
	
	}
	#gal_nav{
		display:none;
		font-size:9px;
		
	}
	#gal_nav2{
		display:block;
				
}
	#gallery{
		float:left;
		width:320px;
		margin:17px 0 60px 0px;
		
		
	}
	aside{
		float: left;
		width:140px;
		padding-top: 17px;
	}
	#gal_nav li{
		width: 130px;
		margin-bottom: 2px;
	}
	#sec_layer li{
		line-height: 12px;
	}
   
}

*/