

.portfolio_image_main{
	position: relative;
	margin-bottom: 10px;
	height: 550px;
	width: 1000px;
	-moz-box-shadow: 0 0 1px #888;
	-webkit-box-shadow: 0 0 1px#888;
	box-shadow: 0 0 1px #888;
	
	-moz-border-radius: 3px;
	border-radius: 3px;
	

}

#main-img{
cursor: pointer;
}

#portfolio_thumbs{
width: 1000px;
/*min-height: 160px;*/
height: auto;
margin-bottom: 0px;
clear: both;
padding-bottom: 10px;
}



#portfolio_description{
clear: both;
width: 1000px;
height: auto;

margin-top: 20px;
margin-bottom: 20px;

border-top: 2px solid #000;
/*border-bottom: 2px solid #000;*/
padding: 0;
padding-bottom: 14px;
}


/* used on the main page 

304*3=912
88/3=29

*/
.portfolio_index_thumb{
  	width: 304px;
  	height: 260px;
  	Float: left;
  	margin-right: 28px;
  	margin-bottom: 20px;
  	-moz-box-shadow: 0 0 4px #888;
	-webkit-box-shadow: 0 0 4px#888;
	box-shadow: 0 0 4px #888;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.portfolio_index_thumb:hover{
  -moz-box-shadow: 0 0 4px #00CCFF;
	-webkit-box-shadow: 0 0 4px #00CCFF;
	box-shadow: 0 0 4px #00CCFF;

}




.portfolio_index_thumb_inner{
	margin-left: 0px;
 	margin-top: 0px; 
  position: relative;
  width: 304px;
  height: 220px;
  
  -moz-border-radius: 3px;
	border-radius: 3px;
  overflow: hidden;
  border-bottom: 1px solid #CCC;


}

.portfolio_index_thumb_bar{
	width: 284px;	
	height:30px;
	margin-left: 10px;
	margin-top:10px;

}
.portfolio_title1{
  margin-top: 0px;
  color: #999;
  width: 284px;

  float:left;

}






.portfolio_index_thumb h1{
  margin: 0;
  padding: 0;
  font-size: 20px;
  float:left;
}

.portfolio_index_thumb h2{
  margin: 0px 14px 0px 14px;
  padding: 0;
  font-size: 20px;
  float:left;
}

.panel_keyword{
	width: auto;
	height: 20px;
	padding: 2px 6px;
	border: 1px solid #11d97f;/*green*/
	margin: 2px;
	float: left;
	background: #11d97f;
	color: #FFF;
}

.panel_keyword i{color: #11d97f;}

.panel_keyword:hover i{color: #FFF;}
.panel_keyword:hover {
  border: 1px solid #000;
}

/*
.port_thumb2{

	width: 227px;
  height: 235px;
  Float: left;
 
  margin-right: 12px;
  margin-bottom: 12px;
  overflow:hidden;
  
  -moz-box-shadow: 0 0 2px #888;
  -webkit-box-shadow: 0 0 2px#888;
  box-shadow: 0 0 5px #888;

  -moz-border-radius: 3px;
  border-radius: 3px;


}

.port_thumb2_inner{
	margin-top: 0px;
	margin-left: 0px;
	width: 227px;
}


.port_thumb2 p{

  margin-top: 10px;



}

*/



.featured_portfolio{
  position:relative;
	width: 944px;
  	height: 300px;
  	Float: left; 
	margin-bottom: 32px;
  	overflow:hidden;
  	/*
	-moz-box-shadow: 0 0 3px #888;
	-webkit-box-shadow: 0 0 3px#888;
	box-shadow: 0 0 3px #888;
	*/
	border: 1px solid #CCC;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.featured_portfolio_copy{
	position: absolute;
	top: 20px;
	right: 20px;
	z-index:100;
	width: 200px;
	
	height: 260px;
	font-size: 20px;
	/*
	background-color: #000;
	background-color:rgba(0,0,0,0.2);
	-moz-border-radius: 3px;
	border-radius: 3px;*/
	
	
}

.featured_portfolio_title, .main_portfolio_title{
  font-size: 16px;
  font-weight: bold;
	position: absolute;
	padding: 10px;
	top: 20px;
	left: 20px;
	z-index:100;
	color: #FFF;
	width: auto;
	
	height: 20px;
	background-color: #000;
	background-color:rgba(0,0,0,0.6);
	-moz-border-radius: 3px;
	border-radius: 3px;
	
}

/*---*/

#main_portfolio_loading{
  font-size: 16px;
  font-weight: bold;
	position: absolute;
	padding: 10px;
	top: 290px;
	left: 470px;
	z-index:101;
	color: #FFF;
	width: auto;
	
	height: 20px;
	background-color: #000;
	background-color:rgba(0,0,0,0.6);
	-moz-border-radius: 3px;
	border-radius: 3px;
	display:none;
	
}






/* 209x127 main portfolio page 
1000/4=250

227x4=908
92/3=30.66

alt
10x3=30
968/4=242

*/
.portfolio_image_thumb{
	padding: 0px;
	width:227px;
	width:242px;
	height:147px;
	
	float: left;
	margin-right:10px;
	margin-bottom:10px;
	
	-moz-box-shadow: 0 0 3px #888;
  	-webkit-box-shadow: 0 0 3px#888;
  	box-shadow: 0 0 3px #888;

  	-moz-border-radius: 3px;
  	border-radius: 3px;

}

.portfolio_image_thumb img{
	-moz-border-radius: 3px;
  	border-radius: 3px;
}
.portfolio_image_thumb p{
padding: 0;
margin: 0;
}


.portfolio_image_thumb:hover{

cursor:pointer;
-moz-box-shadow: 0 0 3px #00CCFF;
  -webkit-box-shadow: 0 0 3px #00CCFF;
  box-shadow: 0 0 3px #00CCFF;

}





/* hack */
#carousel { width: 100%; height: 300px; background-color: #FFF; padding: 5px; margin-left: 5px;

}

#carousel .slide { position: absolute; top: 5px; left: 0px; background-color: #dfdfdf; background-color: #FFF; 

}




#logo { float: left; width: 294px; height: 50px; text-indent: -9999px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; 
background-image: url(http://www.brandejs.ca/public/images/cloud_logo2.png); 
 
background-image: url(http://www.brandejs.ca/public/images/cloud_logo2.png) \9; background-position: left top; background-repeat: no-repeat; }
@media screen and (max-width: 768px) { #logo { width: 80px; } }
#logo a { display: block; height: 100%; width: 100%; }



/* old brandejs v2 - temp for banners */


			
			
			
			.thumb_shadow, .thumb_shadow_wide{
				width: 170px;
				height: 150px;
				overflow: hidden;
				margin-right: 0px;
				float: left;
				font-size: 12px;
				background-image:url(brandejs_thumb.png);	
			}
			
			
			.thumb_shadow_wide{
				width: 340px;
				background-image:url(brandejs_thumb_wide.png);	
			}
			
			.thumb_shadow img, .thumb_shadow_wide img{
				margin:9px 0 0 15px;
				padding:0;
				display: block;
			}

			.thumb_shadow_text,.thumb_shadow_wide_text {
				color: #999;
				position: absolute;
				width: 170px;
				text-align: center;
				margin:6px 0 0 0px;
				display: block;
			}
			
			.thumb_shadow_wide_text {
				
				width: 340px;
				
			}
			
			

