.facebook svg *, .twitter svg *, .linkedin svg *{transition: all 0.5s;}
.facebook svg:hover path {fill: #3B5998;}
.twitter svg:hover path {fill: #00aced;}
.linkedin svg:hover path {fill: #007bb6;}


html.csstransitions #home_works_bg {
	display: block;
	opacity: 0;
	-webkit-transition: opacity 1s ease 0s;
    -moz-transition: opacity 1s ease 0s;
    -ms-transition: opacity 1s ease 0s;
    -o-transition: opacity 1s ease 0s;
	transition: opacity 1s ease 0s;
}

html.csstransitions #home_works_bg.visible {
	opacity: 1;
}

html.csstransitions #works_holder:before, html.csstransitions #dynamic-content:before {
	height: 0;
	-webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
	transition: all 0.5s ease;	
}

html.csstransitions #works_holder.visible:before, html.csstransitions #dynamic-content.visible:before {
	height: 55px;	
}


@media only screen and (min-width: 768px) {
html.csstransitions #works_holder.visible:before, html.csstransitions #dynamic-content.visible:before {
	height: 65px;	
}	
	
	
html.csstransitions .work img {
	width: 90%;
	
	-webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
	transition: all 0.4s ease;
	
	-webkit-transform: scale(1, 1);
	-moz-transform: scale(1, 1);	
	-ms-transform: scale(1, 1);	
	-o-transform: scale(1, 1);
	transform: scale(1, 1);
	
	/*-webkit-transition: transform 0.4s ease;
    -moz-transition: transform 0.4s ease;
    -ms-transition: transform 0.4s ease;
    -o-transition: transform 0.4s ease;
	transition: transform 0.4s ease;*/
	
}

html.csstransitions .work:hover img {
	-webkit-transition: transform 8s ease;
    -moz-transition: transform 8s ease;
    -ms-transition: transform 8s ease;
    -o-transition: transform 8s ease;
	transition: transform 8s ease;
}

html.csstransitions .work.visible img {
	width: 100%;
}

html.csstransitions .work.visible:hover img.work_img {
	-webkit-transform: scale(1.1, 1.1);
	-moz-transform: scale(1.1, 1.1);	
	-ms-transform: scale(1.1, 1.1);	
	-o-transform: scale(1.1, 1.1);
	transform: scale(1.1, 1.1);	
}

html.csstransitions .work .works_label {
	opacity: 0;
	background: none;
	-webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
	transition: all 0.6s ease;
}

html.csstransitions .work.left .works_label {
	right: -150px;	
}

html.csstransitions .work.left.visible .works_label {
	right: -220px;
	opacity: 1;	
}

html.csstransitions .work.right .works_label {
	left: -150px;
}

html.csstransitions .work.right.visible .works_label {
	left: -220px;
	opacity: 1;	
}


html.csstransitions .work .works_label:after {
	background-color: #fff;
	width: 250px;	
	height: 120px;
	content: "";
	position: absolute;
	top: 0px;	
	left: 0;
	z-index:-2;
}

html.csstransitions .work .works_label:before {
	content: "";
	background-color: #000;
	position: absolute;
	top: -120px;	
	left: 0;
	width: 250px;	
	height: 120px;
	z-index: -1;	
	-webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

html.csstransitions .work:hover  .works_label{
	color: #fff;
	background: none;
}

html.csstransitions .work:hover .works_label:before {
	top:0;	
}

html.csstransitions .work .works_label_title::after {
	-webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-ms-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out;
	
	
}

html.csstransitions .work:hover .works_label_title::after {
    -webkit-transform:rotate(360deg);
    -moz-transform:rotate(360deg);
	-ms-transition: rotate(360deg);
    -o-transform:rotate(360deg);
	transform: rotate(360deg);
}
}




html.csstransitions a.link {
	-webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
	transition: all 0.6s ease;		
}

html.csstransitions a.link:hover {
	padding-right: 25px;
}

html.csstransitions a.link:after {
	-webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
	transition: all 0.6s ease;
}

html.csstransitions a.link:hover:after {
    -webkit-transform:rotate(360deg);
    -moz-transform:rotate(360deg);
    -o-transform:rotate(360deg);
	transform: rotate(360deg);
}

html.csstransitions #section_photo_album img.color {
	opacity: 0;
	 -o-transition: opacity 0.3s ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
   	-webkit-transition: opacity 0.3s ease-in-out;
   	transition: opacity 0.3s ease-in-out;
}

html.csstransitions #section_photo_album .photorow li:hover img.color {
	opacity: 1;	
}




@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
header .social a.facebook:after, footer .social a.facebook:after {
	background-image: url("../images/ico_facebook_color@2x.png");
	background-size: 9px 18px;
}

header .social a.twitter:after, footer .social a.twitter:after {
	background-image: url("../images/ico_twitter_color@2x.png");
	background-size: 20px 18px;	
}

header .social a.linkedin:after, footer .social a.linkedin:after {
	background-image: url("../images/ico_linkedin_color@2x.png");
	background-size: 18px 18px;	
}	
}