/*
Template Name: Halsey HTML
Template URI: http://halsey-html.cmsmasters.net/
Author: cmsmasters
Author URI: http://cmsmasters.net/
Description: The Halsey Responsive HTML5 Site Template.
Version: 1.0
License: 
License URI: 
Tags: light, white, one-column, two-columns, left-sidebar, right-sidebar, custom-colors, post-formats, responsive, html5, css3
*/


img.fullwidth {
	image-rendering:optimizeQuality;
	-ms-interpolation-mode:bicubic;
}

.preloader {
	background:url(../img/loader.gif) 50% 50% no-repeat;
	display:block;
	width:100%;
	height:0;
	padding-bottom:56.25%;
	position:relative;
}

.preloader img {	
	opacity:0;
	filter:alpha(opacity=0);
}

.loader2 {
	background:url(../img/loader_line.gif) 50% 50% no-repeat;
	display:block;
	width:100%;
	height:0;
	padding-bottom:56.25%;
	position:relative;
}

.loader2 img {	
	opacity:0;
	filter:alpha(opacity=0);
}


.preloader.inBlog .fullwidth {
	height:auto;
	position:relative;
}

.resizable_block {
	width:100%;
	height:0;
	padding-bottom:56.25%;
	position:relative;
	overflow:hidden;
}

.preloader .fullwidth, 
.portfolio_container .preloader .fullwidth, 
.resize .preloader .fullwidth, 

/* ¡Ú¡Ú width:220px !important; height:160px !important;*/
.resizable_block .fullwidth {
	width:100% !important; 
	height:100% !important;
	position:absolute;
	top:0;
	left:0;
}


.preloader .image_container_img {	
	-webkit-transition:opacity .3s ease-out;
    -moz-transition:opacity .3s ease-out;
    -ms-transition:opacity .3s ease-out;
    -o-transition:opacity .3s ease-out;
    transition:opacity .3s ease-out;
}


figure img {display:block;
}


#middle {position:relative;}

.pj_sort {
	border-bottom:1px solid #ebecec;
	padding:30px;
	position:relative;
}

.p_options_loader {
	background:url(../images/loader_white.gif) no-repeat 0 0;
	display:block;
	width:160px;
	height:20px;
	position:absolute;
	top:21px;
	right:30px;
}

.p_options_block {
	padding:0;
	display:none;
	position:absolute;
	right:30px;
	top:14px;
	z-index:29;
	opacity:1;
}

.p_sort_block {float:left;}

.p_sort_block p {margin-left:10px;}

.p_options_block a:hover {text-decoration:none;}

.p_sort {
	float:right;
	position:relative;
}

.p_sort a[name="p_date"] {
	display:block;
	float:left;
}

.p_sort a[name="p_name"].button_small, 
.p_sort a[name="p_date"].button_small,
.p_cat_filter.button_small {padding-right:10px;}

.p_cat_filter.button_small span,
.p_sort a[name="p_name"] span, 
.p_sort a[name="p_date"] span {
	background:url(../images/arrow_sort.png) no-repeat right 8px;
	display:block;
	-webkit-transition:background-position 0.5s ease;
	-moz-transition:background-position 0.5s ease;
	-ms-transition:background-position 0.5s ease;
	-o-transition:background-position 0.5s ease;
	transition:background-position 0.5s ease;
}

.p_sort a[name="p_name"] > span, 
.p_sort a[name="p_date"] > span {padding-right:30px;}

.p_sort a.current.reversed[name="p_name"] span, 
.p_sort a.current.reversed[name="p_date"] span {background-position:right -20px;}

.p_sort a[name="p_name"] {
	margin-right:10px;
	display:block;
	float:left;
}

div.p_filter, 
.p_filter_container {
	position:relative;
	z-index:29;
}

div.p_filter {
	float:right;
	padding:0 10px 0 0;
}

a.p_cat_filter {
	display:block;
	position:relative;
	z-index:31;
}

a.p_cat_filter > span {
	width:120px;
	padding-right:15px;
}

.p_filter_container:hover .p_cat_filter.button_small span, 
a.p_cat_filter:hover span {background-position:right -20px;}

.p_filter_container ul.p_filter {
	background-color:#ffffff;
	list-style:none;
	display:block;
	width:160px;
	padding:0;
	overflow:hidden;
	position:absolute;
	top:20px;
	left:1px;
	z-index:30;
	opacity:0;
	-webkit-box-shadow:0 0 5px rgba(0, 0, 0, 0.2);	
	-moz-box-shadow:0 0 5px rgba(0, 0, 0, 0.2);
	box-shadow:0 0 5px rgba(0, 0, 0, 0.2);
	-webkit-transition:opacity 0.5s ease;
	-moz-transition:opacity 0.5s ease;
	-ms-transition:opacity 0.5s ease;
	-o-transition:opacity 0.5s ease;
	transition:opacity 0.5s ease;
}

.p_filter_container:hover ul.p_filter {
	opacity:1;
	padding:10px 0 5px;
}

ul.p_filter li a {
	display:block;
	height:0;
	padding:0 15px;
	z-index:30;
	-webkit-transition:height 0.5s ease, padding 0.5s ease, color 0.3s ease;
	-moz-transition:height 0.5s ease, padding 0.5s ease, color 0.3s ease;
	-ms-transition:height 0.5s ease, padding 0.5s ease, color 0.3s ease;
	-o-transition:height 0.5s ease, padding 0.5s ease, color 0.3s ease;
	transition:height 0.5s ease, padding 0.5s ease, color 0.3s ease;
}

.p_filter_container:hover ul.p_filter li a {
	height:20px;
	padding:5px 15px;
}

ul.p_filter:hover li a {
	height:20px;
}

.p_filter_container:hover ul.p_filter li:first-child a {padding-top:10px;}

.p_filter_container:hover ul.p_filter li:last-child a {padding-bottom:10px;}

ul.p_filter li {
	background:none;
	position:relative;
	overflow:hidden;
	display:block;
	z-index:30;
}

.p_date, 



a span.image_rollover {
	background:transparent url(./img/hover_content.png) 50% -100px no-repeat;
	display:block;
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	opacity:.7;
	-webkit-transition:background-color .2s ease-in-out, background-position .3s ease-in-out;
	-moz-transition:background-color .2s ease-in-out, background-position .3s ease-in-out;
	-ms-transition:background-color .2s ease-in-out, background-position .3s ease-in-out;
	-o-transition:background-color .2s ease-in-out, background-position .3s ease-in-out;
	transition:background-color .2s ease-in-out, background-position .3s ease-in-out;
}

a[rel="moving"] span.image_rollover {background-image:url(../img/ani.gif);}

a[rel="prettyPhoto"] span.image_rollover {background-image:url(../img/hover_content.png);}

a[rel="magnifier"] span.image_rollover {background-image:url(../img/hover_image.png);}

a[rel="magnifier2"] span.image_rollover {background-image:url(../img/zoom-more.png);}

.format-link a span.image_rollover {background-image:url(../img/hover_link.png);}

.format-video a span.image_rollover {background-image:url(../img/hover_video.png);}

a:hover span.image_rollover {
	background-color:#697EF4;
	background-position:50% 50%; /* ¡Ú 50% */
}

