/* ======================================================================================
	WORK STYLE
========================================================================================*/
.productsSection {
    background: #ffffff;
    background-repeat: no-repeat;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding: 45px 0 45px 0;
}
.productsPlace { }
.products { width: 90%; margin: 0 auto; margin-bottom:60px; }
.products h2:after { 
	width: 300px;
    content: " ";
	background-image:url(/Contents/images/generalUi/after_line.png);
	background-repeat: no-repeat;
	background-position: left;
    position: absolute;
    right: -11.5em;
    top: 0.2em;
    height:20px;
}
.products h2:before { 
	width: 300px;
    content: " ";
	background-image:url(/Contents/images/generalUi/before_line.png);
	background-repeat: no-repeat;
	background-position: left;
    position: absolute;
    left: -11.5em;
    top: 0.2em;
    height:20px;
}
.products .section-text { margin: 33px 0 -22px 0; }



.portfolio .look {
	width: 40px;
	height: 40px;
	background: #332d26;
	background-image: url(/Contents/images/generalUi/search.png);
	background-repeat: no-repeat;
	background-position: center;
	color: white;
	text-align: center;
	position: absolute;
	bottom:-100%;
	right: 0;
	cursor: pointer;
	z-index: 9999;
}
.portfolio .video {
	width: 36px;
	height: 36px;
	background: #332d26;
	background-image: url(/Contents/images/generalUi/video.png);
	background-repeat: no-repeat;
	background-position: center;
	color: white;
	text-align: center;
	position: absolute;
	bottom:-100%;
	right: 0;
	cursor: pointer;
	z-index: 9999;
} 

 
.productsPortfoliolist .portfolio {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	width:23%;
	margin:1%;
	display:none;
	float:left;
	overflow:hidden;
}

	.portfolio-wrapper {
		overflow:hidden;
		position: relative !important;
		/*background: #666;*/
		text-align: center;
	}
	
	.portfolio-wrapper img { width: 100%; }

	.portfolio .content-background {
		position: absolute;
		background: #0caf73;
		width: 100%;
		height: 100%;
		bottom:-100%;
		right: 0;
		opacity: 0.9;
		z-index: 99;
	}
	.portfolio .content-text { 
		position: absolute;
		width: 100%;
		height: 100%;
		bottom:-100%;
		right: 0;
		padding: 0px 10px;
		color: #fff;
		z-index: 100;
	}
	.portfolio .content-text h3 { margin-top: 41px; font-size:1.2em; }
	.portfolio .content-text p { margin: 0; margin-top: 22px; }
	.portfolio .label {
		position: absolute;
		width: 100%;
		height: 100%;
		bottom:-100%;

		right: 0;
	}

/*---------------------WORK SECTION RESPONSIVE --------------------*/
/* Large desktop */
@media (min-width: 1200px) {
		
}
 
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
	.productsSection .container { width: 100%; }
	.products { width: 100%; margin: 0 auto; }
	.productsSection h2:before { width: 0px; }
	.productsSection h2:after { width: 0px; }
}
 
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
	.productsSection .container { width: 100%; }
	.productsSection .productsPortfoliolist .portfolio { width:48%;margin:1%; }
	.products { width: 100%; margin: 0 auto; }
	.productsSection h2:before { width: 0px; }
	.productsSection h2:after { width: 0px; }
}
 
/* Landscape phones and down */
@media (max-width: 480px) {
	.productsSection .container { width: 100%; }
	.productsSection .productsPortfoliolist .portfolio { width:98%; margin:1%; }
	.products { width: 100%; margin: 0 auto; }
}