﻿/* Carousel*/

.caroufredsel_wrapper ul li:hover, .caroufredsel_wrapper .overlay-hslide:hover, .caroufredsel_wrapper .overlay-vslide:hover, .caroufredsel_wrapper .overlay-fade:hover, .caroufredsel_wrapper .overlay-zoom:hover, .caroufredsel_wrapper ul
{
	cursor: pointer;
}
.caroufredsel_wrapper ul li:active, .caroufredsel_wrapper .overlay-hslide:active, .caroufredsel_wrapper .overlay-vslide:active, .caroufredsel_wrapper .overlay-fade:active, .caroufredsel_wrapper .overlay-zoom:active, .caroufredsel_wrapper ul:active
{
	cursor: pointer;
}
.list_carousel
{
	margin: 0;
	width: 360px;
}
.list_carousel ul
{
	margin: 0;
	padding: 0;
	list-style: none;
	display: block;
}
.list_carousel li
{
	padding: 0;
	margin: 4px;
	display: block;
	float: left;
	width: 320px;
}
.list_carousel.responsive
{
	width: auto;
	margin: 0;
}
.clearfix
{
	float: none;
	clear: both;
}
.pager
{
	float: left;
	width: 300px;
	text-align: center;
}
.pager a
{
	margin: 0 5px;
	text-decoration: none;
}
.pager a.selected
{
	text-decoration: underline;
}
.timer
{
	background-color: #999;
	height: 6px;
	width: 0px;
}

.list_carousel a.prev, .list_carousel a.next
{
	display: block;
	text-align: center;
	line-height: 60px;
	width: 30px;
	position: absolute;
	top: 50%;
	margin-top: -30px;
	z-index: 999;
	color: #FFFFFF;
	font-size: 34px;
	background-color: #77C7EF;
	padding: 10px 0px;
	opacity: 0.7;
}
.list_carousel a.prev:hover, .list_carousel a.next:hover
{
	opacity: 1;
}
.list_carousel a.prev
{
	left: 0px;
}
.list_carousel a.next
{
	right: 0px;
}

.list_carousel a.prev.disabled, .list_carousel a.next.disabled
{
	cursor: default;
	color: #848494;
}
.list_carousel a.prev span, .list_carousel a.next span
{
	display: none;
}

.caroursel-work .caroufredsel_wrapper, .caroursel-work .latest-work
{
	min-height: 370px;
}

.pagination-carousel
{
	text-align: center;
	margin-top: 0px;
}
.pagination-carousel a
{
	width: 10px;
	height: 10px;
	margin: 0 5px;
	display: inline-block;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	background: #333;
}
.pagination-carousel a.selected
{
	cursor: default;
}
.pagination-carousel a span
{
	display: none;
}
/* carousel work */
.caroursel-work
{
	position: relative;
}
.carousel-navigation
{
	display: table;
	float: left;
}
/*simple carousel*/
.simple-caroursel
{
	position: relative;
}
.simple-caroursel .list_carousel a.prev, .simple-caroursel .list_carousel a.next
{
	line-height: inherit;
	margin-left: 0;
	margin-right: 0;
}
.simple-caroursel .list_carousel a.prev.disabled, .simple-caroursel .list_carousel a.next.disabled
{
	background: rgba(0, 0, 0, 0.1);
	background: rgb(0, 0, 0) transparent;
}

/*simple carou - 1 item */
.simple-carou li
{
	padding: 0 0 20px;
	width: 240px;
	display: block;
	float: left;
}
.simple-carou li img
{
	width: 100%;
	height: auto;
}
.simple-carou .panel
{
	margin: 0;
}


/* Latest Work */
.work-entry
{
	padding: 5px;
}
.work-entry h2, .work-entry h3, .work-entry h4, .work-entry h5
{
	margin: 10px 0;
	font-size: 18px;
	height: 35px;
}
.work-entry img
{
}

.work-entry-content
{
	/*padding: 5px;*/
}

.work-entry-content div.short-text
{
	height:100px;
	text-align:justify;
}

.work-entry-content a
{
	text-decoration:none;
}

.work-entry-content p
{
	height:40px;
}



.work-entry-details
{
}
.work-entry-image
{
	position: relative;
}

/* Brands */
.brands-entry
{
	padding: 5px;
}
.brands-entry h2, .brands-entry h3, .brands-entry h4, .brands-entry h5
{
	margin: 10px 0;
	font-size: 16px;
}
.brands-entry img
{
	width: 100%;
	height: auto;
}
.brands-entry-content
{
	padding: 5px;
}
.brands-entry-details
{
}
.brands-entry-image
{
	position: relative;
}


/* Image Overlay Effects*/
.image-overlay
{
	position: relative;
	cursor: default;
	overflow: hidden;
	-webkit-box-shadow: 0px 0px 1px rgba(51, 51, 51, 0.3);
	-moz-box-shadow: 0px 0px 1px rgba(51, 51, 51, 0.3);
	box-shadow: 0px 0px 1px rgba(51, 51, 51, 0.3);
}
@media only screen and (max-width: 479px)
{
    .image-overlay
    {
        max-height:200px;
    }
}

.image-overlay img
{
	width: 100%;
}


/* overlay horizontal slide*/
.overlay-hslide
{
	background: rgba(255, 255, 255, 0.6);
	background: rgb(255, 2255, 255) transparent;
	height: 100%;
	width: 0%;
	top: 0;
	right: 0;
	position: absolute;
	filter: alpha(opacity=0);
	opacity: 0;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.overlay-hslide a
{
	height: 80px;
	width: 80px;
	margin: -40px 0 0 -40px;
	position: absolute;
	text-align: center;
	top: 50%;
	left: 50%;
	line-height: 80px;
	cursor: pointer;
}
.overlay-hslide a .icon-overlay
{
	font-size: 40px;
	padding: 0;
	width: 80px;
	height: 80px;
	line-height: 80px;
	background: rgba(255, 255, 255, 0.6);
	background: rgb(255, 2255, 255) transparent;
}
.image-overlay:hover .overlay-hslide
{
	width: 100%;
	top: 0;
	left: 0;
	filter: alpha(opacity=100);
	opacity: 1;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

/* overlay vertical slide*/
.overlay-vslide
{
	background: rgba(255, 255, 255, 0.6);
	background: rgb(255, 2255, 255) transparent;
	height: 0%;
	width: 100%;
	bottom: 0;
	right: 0;
	position: absolute;
	filter: alpha(opacity=0);
	opacity: 0;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.overlay-vslide a
{
	height: 80px;
	width: 80px;
	margin: -40px 0 0 -40px;
	position: absolute;
	text-align: center;
	top: 50%;
	left: 50%;
	line-height: 80px;
	cursor: pointer;
}
.overlay-vslide a .icon-overlay
{
	font-size: 40px;
	padding: 0;
	width: 80px;
	height: 80px;
	line-height: 80px;
	background: rgba(255, 255, 255, 0.6);
	background: rgb(255, 2255, 255) transparent;
}
.image-overlay:hover .overlay-vslide
{
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	filter: alpha(opacity=100);
	opacity: 1;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}


/* overlay fade*/
.overlay-fade
{
	background: rgba(255, 255, 255, 0.6);
	background: rgb(255, 2255, 255) transparent;
	height: 100%;
	width: 100%;
	top: 0;
	position: absolute;
	filter: alpha(opacity=0);
	opacity: 0;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.overlay-fade a
{
	height: 80px;
	width: 80px;
	margin: -40px 0 0 -40px;
	position: absolute;
	text-align: center;
	top: 50%;
	left: 50%;
	line-height: 80px;
	cursor: pointer;
}
.overlay-fade a .icon-overlay
{
	font-size: 40px;
	padding: 0;
	width: 80px;
	height: 80px;
	line-height: 80px;
	background: rgba(255, 255, 255, 0.6);
	background: rgb(255, 2255, 255) transparent;
}
.image-overlay:hover .overlay-fade
{
	filter: alpha(opacity=100);
	opacity: 1;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}


/* overlay zoom*/
.overlay-zoom
{
	background: rgba(255, 255, 255, 0.6);
	background: rgb(255, 2255, 255) transparent;
	height: 100%;
	width: 100%;
	top: 0;
	
	position: absolute;
	filter: alpha(opacity=0);
	opacity: 0;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.overlay-zoom a
{
	height: 80px;
	width: 80px;
	margin: -40px 0 0 -40px;
	position: absolute;
	text-align: center;
	top: 50%;
	left: 50%;
	line-height: 80px;
	cursor: pointer;
}
.overlay-zoom a .icon-overlay
{
	font-size: 40px;
	padding: 0;
	width: 80px;
	height: 80px;
	line-height: 80px;
}
.image-overlay:hover .overlay-zoom
{
	filter: alpha(opacity=100);
	opacity: 1;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.zoom-image img
{
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.zoom-image:hover img
{
	-webkit-transform: scale(1.5);
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 250ms;
	-moz-transform: scale(1.5);
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 250ms;
	transform: scale(1.5);
	transition-timing-function: ease-out;
	transition-duration: 250ms;
}

.rotate-image-right img
{
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.rotate-image-right:hover img
{
	-webkit-transform: rotate(15deg) scale(1.5);
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 250ms;
	-moz-transform: rotate(15deg) scale(1.5);
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 250ms;
	transform: rotate(15deg) scale(1.5);
	transition-timing-function: ease-out;
	transition-duration: 250ms;
}

.rotate-image-left img
{
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.rotate-image-left:hover img
{
	-webkit-transform: rotate(-15deg) scale(1.5);
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 250ms;
	-moz-transform: rotate(-15deg) scale(1.5);
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 250ms;
	transform: rotate(-15deg) scale(1.5);
	transition-timing-function: ease-out;
	transition-duration: 250ms;
}



