.page_caption{padding-top:50px; position:relative; max-width:960px; margin:0 auto}
.page_caption h2{font-size:44px; line-height:50px; margin:0 0 30px; padding:0 0 10px; border-bottom:1px solid #ccc; color:#00b1bb; text-align:center; font-family:'Courgette',Verdana,Arial,Helvetica,sans}
.page_caption .capt_tools{float:right;}
.page_caption .capt_tools a{}

.customerGallery{position:relative;}

#no_photos{text-align:center; font-size:21px; padding:60px 20px; max-width:920px; margin:0 auto;}
#no_photos a{color:#34afb4; font-weight:bold; text-decoration:underline}
#no_photos a:hover{text-decoration:none}

#cg_container{padding-bottom:100px}
#cg_container .processing{background:#fff}
#cg_container .processing div{top:100px}

#photos_loading{
	position:absolute; bottom:0px; left:0; width:100%; padding:30px; 
	font-size:24px; line-height:30px; color:#787878; border:1px solid #ebebeb; text-align:center;
	-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; 
}


/* Grid */
.cpCell{width:19%; margin:10px 0.5%; max-width:363px}

@media only screen and (max-width:1620px){
	.cpCell{width:24%; margin:10px 0.5%; max-width:388px}
}

@media only screen and (max-width:1280px){
	.cpCell{width:32%; margin:10px 0.5%; max-width:409px}
}

@media only screen and (max-width:768px){
	.cpCell{width:49%; margin:10px 0.5%; max-width:376px}
}

@media only screen and (max-width:470px){
	.cpCell{width:99%; margin:10px 0.5%; max-width:465px}
}
	

/* Photo Block */
.cpPhoto{
	padding:1.05%; border:1px solid #ccc;
	-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; 
}
	.cpImg{height:0; padding-top:85%; margin-bottom:25px; overflow:hidden; position:relative; background-position:50% 50%; background-repeat:no-repeat; background-size:cover}
		.cpImg img{position:absolute; top:0; left:0; width:100%; height:100%; display:none}
	
	.cpShare{position:absolute; bottom:5px; left:0; width:96%; margin:0 2%; background:#fff; padding:15px 7px; opacity:0;
		-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;
		-webkit-transition:opacity .2s ease-out .1s; -moz-transition:opacity .2s ease-out .1s; transition:opacity .2s ease-out .1s}
		.cpShare .cpSocial{max-width:80%; float:right;}
		.cpSocial >a, .cpFavorites >a{display:inline-block; line-height:18px; padding:0 4px; margin:0 4px;}
		.cpFavorites >a{padding:0; margin:1px 4px;}
		.cpSocial >a >i, .cpFavorites >a >i{font-size:18px; color:#999;}
		.cpSocial >a.facebook:hover >i{color:#325c94;}
		.cpSocial >a.twitter:hover >i{color:#00abdc;}
		.cpSocial >a.pinterest:hover >i{color:#d9031f}
		.cpSocial >a.sendemail:hover >i{color:#f19d2f;}
		.cpFavorites{max-width:20%; float:left;}
		.cpFavorites >a.favorites:hover >i{color:#ff0000;}
		
		.cpOverlay{position:absolute; top:0; left:100%; width:100%; height:100%; background:rgba(52,175,180,0.9); color:#fff}
		.cpOverlay span{position:absolute; top:50%; left:-120%; width:60px; height:20px; line-height:20px; margin:-10px 0 0 -30px; text-align:center}
		.cpOverlay span:before{content:"\f06e"; font:normal normal normal 14px/1 FontAwesome; display:block; font-size:28px; color:#f5f5f5}
		.cpOverlay, .cpOverlay span{-webkit-transition:all .2s ease-out .1s; -moz-transition:all .2s ease-out .1s; transition:all .2s ease-out .1s}
		/* transition-property | transition-duration | transition-timing-function | transition-delay*/
		
		.cpImg:hover .cpOverlay{left:0}
		.cpImg:hover .cpOverlay span{left:50%; color:#fff}
		.cpImg:hover .cpShare{opacity:1;}
		
	
	.cpDesc{padding-bottom:20px}
		.cpCustomer{font-size:18px; color:#333; margin-bottom:16px}
		.cpComment{font-size:14px; line-height:24px; color:#888; margin-bottom:30px}
		.cpDate{font-size:14px; color:#ccc;}
						
	.cpFoot{padding-top:10px; border-top:1px solid #ccc}
		.cpProduct{display:block; overflow:hidden; padding:10px 0 5px 70px; min-height:37px}
			.cpProduct img{display:block; float:left; max-width:60px; margin:0 10px 0 -70px}
			.cpProduct strong{font-size:14px; font-weight:normal; color:#00b1bb}
			.cpProduct small{font-size:10px; color:#888}
			
			.cpProduct:hover{text-decoration:none}
			.cpProduct strong:hover{text-decoration:underline}

/* Popup */
#cpPopup{padding:10px; max-width:800px}
#cpPopup .modal_bar{height:0; border:none; padding:0; margin:0;}
#cpPopup .modal_title{display:none}
#cpPopup .modal_close{}
#cpPopup .modal_close span{border-radius:50%; font-size:12px; font-weight:bold}

#cpPopup .modalImg{text-align:center; margin:0 0 20px; width:800px}
	#cpPopup .modalImg img{max-width:100%;}

.modalDesc{}
	.cpCustomer{font-size:16px; margin-bottom:0px}
	.cpComment{font-size:12px; line-height:18px; margin-bottom:15px}
	.cpDate{font-size:12px; color:#ccc; margin-bottom:10px}

.modalNav{position:absolute; top:50%; left:0; width:100%; padding:0 10px!important}
	.modalNav a{position:absolute; top:-40px; display:block; width:127px; height:76px; background:url(../images/arrow.png) 0 0 no-repeat; text-align:left; text-indent:-9999em}
	.modalNav a.prev{left:-150px; background-position:0 -76px}
	.modalNav a.next{right:-150px; background-position:0 0}
	.modalNav a.disabled{display:none}
	
@media only screen and (max-width:1180px){
	#cpPopup{max-width:620px;}
	#cpPopup .modalImg{width:600px;}
}

@media only screen and (max-width:970px){
	#cpPopup{max-width:420px;}
	#cpPopup .modalImg{width:400px;}
}