/*-----------------------------------------------------------------------------------*/
/*	Animation effects
/*-----------------------------------------------------------------------------------*/
.mrgn-top{
	margin-top: 1.5em;
}
.about-row1{
	/* width: 80%; */
	background:#292828;
	margin:0em auto;
	padding-bottom: 5em;
	border-radius:8px;
	-webkit-border-radius:8px;
	-o-border-radius:8px;
	-ms-border-radius:8px;
	-moz-border-radius:8px;
}
.b-link-stripe{
	position:relative;
	display:inline-block;
	vertical-align:top;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	overflow:hidden;
}
.b-link-stripe .b-wrapper{
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	text-align:center;
	color:#ffffff;
	overflow:hidden;
}

.b-animate{
	transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition: all 0.5s;
	-webkit-transition: all 0.5s;
	visibility: hidden;
	font-size:1.1em;
	font-weight:700;
}

.b-animate-go{
	text-decoration:none;
}
.b-animate-go:hover .b-animate{
	visibility:visible;
}
.b-animate-go:hover .b-from-left{
	left:0;
}
.b-animate-go:hover .b-from-right{
	left:0;
}
.b-wrapper:hover {
	background: rgba(3, 3, 3, 0.76);
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-o-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-ms-transition: 0.5s all;
	
}

.b-animate img{
	margin-top:16%;
	display: -webkit-inline-box;
}

.b-from-left{
	position:relative;
	left:-100%;
}

.b-from-right{
	position:relative;
	left: 100%;
}

span.m_4{
	font-size:14px;
	font-weight:400;
}


/*-----------------------------------------------------------------------------------*/
/*	Portfoliolist container & filtru data-sorting & Portfolio target-class
/*-----------------------------------------------------------------------------------*/
.feature{
	background: rgb(44, 52, 61);
	padding-top:2em;
}

.feature h3.top-title{
	
	/* font: 22px/20px normal Tahoma, sans-serif; */
	font-size:2.5em;
	font-family:'Times New Roman', Times, serif;
	color:rgb(206, 206, 206);
	font-weight:800;
	text-transform:uppercase;
	text-align:center;
	margin:1em 0 0.3em 0;
}

ul#filters {
	padding: 0px;
}
#filters {
	margin: 1% 0;
	padding: 0;
	list-style: none;
	text-align: center;
}
	#filters li {
		display: -webkit-inline-box;
	}
	#filters li span {
		display: block;
		padding: 5px 12px;
		text-decoration: none;
		color: white;
		cursor: pointer;
		font-size: 16px;
		font-weight: 400;
		text-transform:uppercase;
	}
	#filters li span.active {
		color: white;
		font-weight:800;
		font-size:16px;
	}
    #portfoliolist .portfolio {
		box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		width: 20%;
		display:none;
		float:left;
		overflow:hidden;
		margin:0% 1% 1% 1%;
		text-align: center;
	}
	div#portfoliolist {
		padding: 20px 0px;
		padding-left: 110px;
    }
	.portfolio-wrapper {
		overflow:hidden;
		position: relative !important;
		cursor:pointer;
	}
	.portfolio img {
		max-width:100%;
		/*--position: relative;--*/
		transition: all 300ms!important;
		-webkit-transition: all 300ms!important;
		-moz-transition: all 300ms!important;
	}




 /* Self Clearing Goodness */
 .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
 .clearfix:before,
 .clearfix:after,
 .row:before,
 .row:after {
   content: '\0020';
   display: block;
   overflow: hidden;
   visibility: hidden;
   width: 0;
   height: 0; }
 .row:after,
 .clearfix:after {
   clear: both; }
 .row,
 .clearfix {
   zoom: 1; }
 
 .clear {
   clear: both;
   display: block;
   overflow: hidden;
   visibility: hidden;
   width: 0;
   height: 0;
 }



/*--- Media Queries Starts here ---*/
@media (max-width:1024px){
	#portfoliolist .portfolio {width: 39%;}
}
@media (max-width:970px){
	#portfoliolist .portfolio {width: 39%;}

	h3.top-title{
		font-size:2.1em;
	
		font-weight:600;
		
		margin:1em 0 0.3em 0;
	}
	#filters li span.active {
		font-weight:600;
		font-size:16px;
	}
	#filters li span{
		font-size:16px;
		padding: 5px 10px;
	}
	.contact-top-column p a{font-size: 10px;}
	.b-from-right{
		font-size:14px;
		font-weight:400;
	}
}
@media (max-width:900px){
	#portfoliolist .portfolio {width: 39%;}
	div#portfoliolist {	padding-left: 80px; }
}
@media (max-width:800px){
	#portfoliolist .portfolio {width: 39%;}
	div#portfoliolist {	padding-left: 110px; }
	#filters li span.active {
		font-size:14px;
		font-weight:600;
	}
	#filters li span{
		font-size:12px;
		padding: 5px 9px;
	}
    h3.top-title{
	font-size:2em;
	margin:1em 0 0.3em 0;
    }
}
@media (max-width:640px){
	#portfoliolist .portfolio {width: 49%;}
	div#portfoliolist {		padding-left: 140px; }

    h3.top-title{
	font-size:1.5em;
	font-weight:600;
	margin:1em 0 0.3em 0;
    }
    #filters li span.active {
	font-weight:600;
	font-size:12px;
    }
    #filters li span{
	font-size:11px;
	padding: 5px 2px;
    }
}
@media (max-width:480px){
	div#portfoliolist {padding: 12px 0px;}
	.feature {background: rgb(44, 52, 61);padding-top: 2em;}

	#portfoliolist .portfolio {width: 90%;}
	div#portfoliolist {		padding-left: 20px; }
}
@media (max-width:320px){
	.contact-top {width: 80%;}
	.contact-top h3 {font-size: 1.5em;}
	.contact-top-column p a{font-size: 14px;}
}
/*--- Media Queries Starts here ---*/