Mini Shell

/*----------------------------------

	Theme Name: Extent
	----------------------
	
	/* #Portfolio Styles
	================================================== */
	
	.latest-works { overflow: hidden; width: 100%; background: #f7f7f7; padding: 15px 0 0; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease;}
	.page-template-portfolio-php .latest-works { padding-bottom:340px;}
	.page-template-portfolio-php .latest-works .portfolio.isotope { margin-bottom:-340px;}
	.container .latest-works { background:none; padding-top:10px;}
	.latest-works .logo, .latest-works .logo img { margin:0;}
	.container .latest-works.with-space-w { margin-left:-15px; margin-right:-15px; width:auto;}
	.latest-works .portfolio .portfolio-item { width: 24.97%; float: left; margin: 0; height: auto; padding: 0; box-sizing: border-box;}
	.latest-works.col2-w .portfolio .portfolio-item { width:49.99%;}
	.latest-works.col3-w .portfolio .portfolio-item { width:33.222%;}
	.latest-works.col4-w .portfolio .portfolio-item { width:24.97%;}
	.latest-works.col5-w .portfolio .portfolio-item { width:19.97%;}
	.latest-works.col6-w .portfolio .portfolio-item { width:16.599%;}
	.latest-works.with-space-w .portfolio .portfolio-item { padding:0 15px 30px 15px;}
	.page-template-portfolio-php .latest-works.with-space-w .portfolio .portfolio-item { padding:30px 15px 0 15px;}
	.page-template-portfolio-php .latest-works.with-space-w .portfolio { margin-left:15px; margin-right:15px;}
	 
	.icon-top-title i { display: inline-block; color: #e84a52; font-size: 64px;}
	.img-item { position: relative; overflow: hidden;}
	.img-item img { width: 100%; height: auto; margin: 0; padding: 0;}
	
	.portfolio .portfolio-item .img-item img{ -webkit-transition: .3s ease-out; -moz-transition: .3s ease-out; transition: .3s ease-out; -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); blur:2;}
	.portfolio .portfolio-item:hover .img-item img {-webkit-transform: scale(1.1); -moz-transform: scale(1.1); transform: scale(1.1);}
	
	.portfolio { display: block; padding: 0;}
	.portfolio h4, .recent-works-items h4, .shop-item h4, .side-list h5 { font-weight: 400; margin: 10px 0 7px; font-size: 18px;}
	.portfolio h4 a, .recent-works-items h4 a, .shop-item h4 a, .side-list h5 a { color: #494949;}
	.portfolio h4 a:hover, .recent-works-items h4 a:hover, .shop-item h4 a:hover, .side-list h5 a:hover { text-decoration: underline;}
	.portfolio p, .recent-works-items p { color: #909090; margin-bottom: 40px; padding-bottom: 20px; border-bottom: 4px solid #ededed; text-transform: uppercase;}
	.portfolio-item h5, .portfolio-item h5 strong { color:#6a6a6a; margin-top: 8px; font-weight:600; font-size:16px;}
	nav.primary { padding: 10px;}
	nav.primary .portfolioFilters a { padding: 5px 12px; margin:5px 0; border:1px solid transparent; border-radius:16px; font-size: 15px; line-height: 1.2; color: #606060; font-weight: 400; letter-spacing:0.6px; text-transform:uppercase; margin-top: 0 !important; text-align: center; width: auto;}
	nav.primary .portfolioFilters a:hover { color: #0ab1f0;}
	nav.primary .portfolioFilters a.selected, nav.primary ul li a:active { color: #0ab1f0; margin-top: 0 !important; border-color:#f7f7f7; background-color:#fff;}
	nav.primary .portfolioFilters .portf { color: #61A300; font-weight: bold; margin-right: 10px; padding-top: 5px;}
	nav.primary .portfolioFilters { text-align: center; margin-top:20px; margin-right: 10px; margin-bottom:20px; clear: both; list-style: none outside none;}
	
	@media only screen and (min-width: 960px) {
	.page-template-portfolio-php nav.primary .portfolioFilters { margin-left:140px; text-align: left; margin-bottom:0;}
	.portfolio-page-w  nav.primary { padding: 20px; background:#222325;}
	.portfolio-page-w.latest-works { padding-top:0;}
	.portfolio-page-w nav.primary .portfolioFilters { margin-top:0px;}
	.portfolio-page-w nav.primary .portfolioFilters a { color:#858a93; font-size:13px; font-weight:bold; border-radius:0; padding:21px; background:none;}
	.portfolio-page-w nav.primary .portfolioFilters a:hover { color:#fff;}
	.portfolio-page-w nav.primary .portfolioFilters a.selected { background-color:#1c1d1e; border-color:#1c1d1e; color:#0ab1f0;}
	}
	
	
	.zoomex, .zoomex2 { width: 100%; background: rgba(0,0,0,.35) url(../images/fancy-big-ico.png) no-repeat center; background-color: url(../images/fancy-big-ico.png)\9;  opacity: 0; -webkit-transition: all .3s ease-out; -moz-transition: all .3s ease-out; -ms-transition: all .3s ease-out; -o-transition: all .3s ease-out; transition: all .3s ease-out; color: transparent; display: block; filter: alpha(opacity=0); position: absolute; top: 0; bottom: 0; right:0; left:0; margin:0; padding:0;}
	.zoomex2 { background: rgba(10,145,215,.92); background: #000\9;}
	.zoomex2 * { filter: alpha(opacity=0)\9;}
	.zoomex2 i { color: inherit; font-size: 11px;
	-moz-transition: all .3s ease-out; -ms-transition: all .3s ease-out; -o-transition: all .3s ease-out; transition: all .3s ease-out;}
	.zoomex2 a.zoomlink1 { position: absolute; bottom: 0; left: 0; color: #fff; width:37px; height:36px; padding: 8px 12px; background:#353c3f;}
	.zoomex2 a:hover i { color: #0ab1f0;}
	.zoomex2 h6 { font-weight: bold; color: #fff; text-transform:uppercase; letter-spacing:1px; font-size: 21px; text-align: center; position: absolute; bottom: 49%; left: auto; width: 100%; padding:0 10px; 
	-webkit-transition: all 0.33s ease;
	  -moz-transition: all 0.33s ease;
	  -o-transition: all 0.33s ease;
	  transition: all 0.33s ease;}
	.zoomex2 h6 a { color:#fff;}
	.zoomex2 h6:after { position:absolute; top:50%; margin-left:2px; margin-top:-6px; font-family: 'FontAwesome'; font-size: 12px; color:inherit; opacity:0; content: "\f061"; speak: none; font-style: normal; font-weight: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased;
	 -webkit-transition: all 0.33s ease;
	  -moz-transition: all 0.33s ease;
	  -o-transition: all 0.33s ease;
	  transition: all 0.33s ease;}
	.zoomex2 h6:hover:after {opacity:0.9; margin-left:6px;}
	.container .latest-works.col5-w .zoomex2 h6, .container .latest-works.col6-w .zoomex2 h6 { font-size:15px;} 
	.zoomex2 span { font-family: 'Arapey', serif; width:100%; font-size: 15px; opacity:0.2; color: #eee; font-weight: 400; display: block;font-style:italic; letter-spacing:1px; margin-bottom:0; text-align:center; position:absolute; bottom:33%; 
	-webkit-transition: all 0.39s ease;
	  -moz-transition: all 0.39s ease;
	  -o-transition: all 0.39s ease;
	  transition: all 0.39s ease;}
	.img-item:hover .zoomex, .prettyPhoto:hover .zoomex, .img-item:hover .zoomex2, .img-item:hover .zoomex2 * { opacity: 1; filter: alpha(opacity=100);}
	.img-item:hover .zoomex2 h6 { bottom:45%;}
	.img-item:hover .zoomex2 span { bottom:38%;}
	@media only screen and (min-width: 960px) and (max-width: 1600px){
	.latest-works.col6-w .zoomex2 h6, .latest-works.col5-w .zoomex2 h6 { font-size:13px;}
	}
	
	/* ISOTOPE */
	
	.isotope-item { z-index: 2;}
	.isotope-hidden.isotope-item { pointer-events: none; z-index: 1;}
	.isotope, .isotope .isotope-item { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; transition-duration: 0.8s;}
	.isotope { -webkit-transition-property: height, width; -moz-transition-property: height, width; transition-property: height, width;}
	.isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; transition-property: transform, opacity;}
	
	/*------------ portfolio item ------------*/
	
	.portfolio-item i.fa-heart { color:#ef7c88; margin-top:3px;}
	.portfolio-item.jcarousel-item.col-md-3 { width:220px; float:left;}
	
	.portfolio-item-title { padding-top:14px; line-height:40px; font-size:21px; letter-spacing:0; font-weight:600; text-transform:uppercase;}	
	.col-wks-1, .col-wks-2, .col-wks-3 { float:left; height:65px; width:25%;}
	.col-wks-2 { width:50%;}	
	.works-item-dets-wrap { border-bottom:1px solid #e5e5e5; border-top:1px solid #e5e5e5; background:#fcfcfc;}
	.works-item-like-box, .works-item-date-box  { text-align:center; border-right:1px solid #e5e5e5; font-size:11px; color:#999; height:65px; padding-top:11px;}
	.works-item-like-box i { font-size:24px; color:#bebebe;}
	.works-item-like-box i.liked, .works-item-like-box i:hover { color:#e53f51; cursor:pointer;}
	.works-item-detail-box, .works-item-cat-box { padding:9px 0 8px 20px; color:#888; border-left:1px solid #e5e5e5; line-height:1;}
	.works-item-detail-box a { color:#808080;}
	.works-item-detail-box a:hover, .works-item-cat-box a:hover { text-decoration:underline;}
	.works-item-detail-box hr { margin:10px 0 8px;}
	.works-item-cat-box, .works-item-date-box { height:65px; font-size:19px; font-weight:300; padding-top:22px;}
	.works-item-cat-box a { color:#134f90;  font-size:14px; margin-top:2px; font-weight:600;}
	
	@media only screen and (max-width: 767px) {	
	.col-wks-3 { border-left:none;  border-top:1px solid #e5e5e5; width:100%;}
	.col-wks-2 { width:75%;}
	.works-item-detail-box, .works-item-cat-box { border-left:none;}
	.works-item-date-box { padding-top:10px; font-size:21px;} 
	}
	
	.related-works { padding-top:160px; margin-top:30px; margin-bottom:-40px; background:#f7f7f7; padding-bottom:40px;}
	.related-works h4.subtitle { text-align:center; margin-top:-130px; border:none; font-size:33px; text-transform:capitalize; font-weight:800; letter-spacing:-2.3px; margin-bottom:80px;}
	.portfolio-archive-w .portfolio-item {  width:32%; float: left; padding:0 15px;}
	.portfolio-archive-w .portfolio { margin:10px -15px;}
	.wrks-itm-cat { text-transform:uppercase; letter-spacing:1px;}
	#latest-projects li p { font-size: 11px; letter-spacing: -0.4px;}
	
	
	@media only screen and (max-width: 959px) {	
	.latest-works .portfolio-item, .latest-works.col2-w .portfolio .portfolio-item, .latest-works.col3-w .portfolio .portfolio-item, .latest-works.col4-w .portfolio .portfolio-item, .latest-works.col5-w .portfolio .portfolio-item, .latest-works.col6-w .portfolio .portfolio-item { width:49.8%;}
	.portfolio-item.jcarousel-item.col-md-3 { width:200px;}
	.portfolio-item-dets { float:none; border-top:2px solid #e5e5e5; margin-top:30px; height:84px; padding-top:10px;}
	.related-works h4.subtitle { position:absolute; width:100%; padding-right:22px;}	
	}
	
	@media only screen and (max-width: 767px) {
	.portfolio-page-w nav.primary .portfolioFilters a { width:auto; float:left; display:inline-block; margin:4px 2px;}
	}
	
	@media only screen and (max-width: 479px) {	
	.latest-works .portfolio-item, .latest-works.col2-w .portfolio .portfolio-item, .latest-works.col3-w .portfolio .portfolio-item, .latest-works.col4-w .portfolio .portfolio-item, .latest-works.col5-w .portfolio     .portfolio-item, .latest-works.col6-w .portfolio .portfolio-item { width:100%;}
	.portfolio-item.jcarousel-item.col-md-3 { width:300px;}	
	}
	
	 @media only screen and (min-width: 1200px) {			
	#latest-projects .portfolio-item.jcarousel-item.col-md-3 { width:260px;}	
	}
		
/* -------- end ----------- */