@charset "utf-8";
/* --------------- reset --------------- */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, em, img, strong, sub, sup, b, u, i,  dl, dt, dd, ol, ul, li, fieldset, form, label, table, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	vertical-align:baseline;
	background:transparent;
	font-size:100%;
}
img{display:inline-block;}
html { height:100%; }
body { height:auto !important; height:100%; min-height:100%; position:relative;}
a {                                      	
	margin:0;
	padding:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
table {						
	border-collapse:collapse; 
	border-spacing:0;
}
td, td img {
	vertical-align:top;			
} 
input, select, button, textarea {
	margin:0; 				
	font-size:100%; 			
}
input[type="text"], input[type="password"], textarea {
	padding:0; 				
}
input[type="checkbox"] { 		
	vertical-align:bottom;
}
input[type="radio"] {
	vertical-align:text-bottom;
}
sub {
	vertical-align:sub;
	font-size:smaller;
}
sup {
	vertical-align:super;
	font-size:smaller;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display:block;
}
nav ul {
	 list-style:none;
}


h2{
  display: inline-block;
}

/* --------------- /reset --------------- */

/* --------------- fix styles ---------*/
.cc { clear:both; }
.container { width:100%;}
.container:after, .cfix:after { content:" "; display:block; height:0; clear:both; visibility:hidden;}
.hidden { display:none; }
.show { display:block!important; }
.no-margin { margin:0!important; }
.no-padding { padding:0!important; }
.no-bg { background:none!important; }
.no-border, a img { border:none!important; }
.img-repl { text-indent:-9999px; overflow:hidden; display:block; }
.left{float:left;}
.right{float:right;}
.center{margin: 0 auto;display: block;}
.txtcenter{text-align: center;}
.txtleft{text-align: left;}
.txtright{text-align: right;}

/* --------------- /fix styles ---------*/

/* --------------- main styles ---------*/
html {
	overflow-y:scroll;
}

body {
	color:#838383;
	text-align:left;
	font-size: 12px;
	font-family: 'Roboto Condensed', sans-serif;
	line-height:1;
	letter-spacing: 0px;
	min-width:900px;
}
input, select, button, textarea {
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
}
label, input[type="button"], input[type="submit"], button {
	cursor:pointer;
}
a, a:visited {
	color:#de2323;
	text-decoration:none;
}
a:hover {
	color:#616163;
	text-decoration:none;
}
a:focus, a:active {
	color:#de2323;
	text-decoration:none;
}
.header, .footer, .content{
	width:100%;
	margin:0 auto;
	padding:0px;
	position:relative;
}
.page-layout {
	margin:0 auto;
	padding: 0 110px;
}
.page-layout:after { content:" "; display:block; height:0; clear:both; visibility:hidden;}

/* --------------- /main styles ---------*/

/* --------------- header styles ---------*/

.header .logo {
    float: left;
    display: block;
}

.search-box{
	left: 340px;
	right: 440px;
	top: 5px;
	position: absolute;
	margin: 0px;
	padding: 0;
	padding-left: 10px;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
	        border-radius: 3px;
}

.search-box input{
	vertical-align: middle;
}
.search-box input[type=text]{
    width: 100%;
	height: 55px;
	margin: 0;
	font: 12px/55px Arial,sans-serif;
	color:#000;
	background: transparent;
	border: none;
}
.search-box input[type=submit]{
	background: url(img/search-submit.png) no-repeat center center;
	width: 55px;
	height: 55px;
	text-indent:-9999px;
	font-size:0;
	padding: 0;
	cursor: pointer;
	vertical-align: top;
	margin: 0;
	padding: 0;
	border: none;
	position: absolute;
	right: 0px;
	top: 0px;
}


.header-menu{
	display: block;
	float: right;
	text-align: left;
	margin-top: 4px;
}

.header-menu a{
	display: block;
	float: left;
	height: 55px;
	font-size: 12px;
	padding: 0px 15px;
	margin: 0 2px;
	text-align: center;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
	        border-radius: 3px;
}

.header-menu a i{
	display: block;
	width: 24px;
	height: 24px;
	padding: 0;
	margin: 7px auto;
	background: url(img/ico-header.png) no-repeat;
}

.header-menu a i.ico-home{	background-position: 0 0;}
.header-menu a i.ico-cat{	background-position: -24px 0;}
.header-menu a i.ico-star{	background-position: -48px 0;}
.header-menu a i.ico-tube{	background-position: -72px 0;}
.header-menu a i.ico-share{	background-position: -96px 0;}

.header-menu a:hover i.ico-home{	background-position: 0 -24px;}
.header-menu a:hover i.ico-cat{		background-position: -24px -24px;}
.header-menu a:hover i.ico-star{	background-position: -48px -24px;}
.header-menu a:hover i.ico-tube{	background-position: -72px -24px;}
.header-menu a:hover i.ico-share{	background-position: -96px -24px;}



.header-menu-btn{
	display: none;
	position: absolute;
	top: 21px;
}
.header-menu-btn.show-menu{
	left: 15px;
}
.header-menu-btn.show-search{
	right: 15px;
}
.header-menu-btn i{
	display: block;
	width: 24px;
	height: 24px;
	padding: 0;
	margin: 0 auto;
}

.show-menu i{ background: url(img/btn-menu.png) no-repeat center center;}
.show-search i{ background: url(img/btn-search.png) no-repeat center center;}

/* --------------- /header styles ---------*/

.title-line{
	margin: 10px 0 5px;
	font-size: 16px;
	line-height: 18px;
	text-align: left;
	background: url(img/title-ico.png) no-repeat 3px top;
	padding-left: 25px;
}

.title-line span,
.title-line h1,
.title-line h2,
.title-line h3{
	text-transform: capitalize;	/* ADD */
	display: inline-block;
	font-size: 16px;		/* EDIT */
	line-height: 18px;		/* EDIT */
	font-weight: normal;
}



.thumbs-layout{
	text-align: center;
}

.thumb{
	vertical-align: top;
	text-align: left;
	display: inline-block;
	font-weight: normal;
	font-size: 12px;
	position: relative;
	margin: 2px;
	padding-bottom: 34px;
}

.thumb .label > div{
	background: url(img/glass.png);
	padding: 3px 8px;
	margin: 0 2px;
	display: block;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
	        border-radius: 3px;
}
.thumb .label{
	position: absolute;
	top: 2px;
	left: 0px;
	width: 100%;
	font-size: 12px;
	font-family: 'Nunito', sans-serif;
	color: #fff;
	display: block;
}


.thumb img{
	display: block;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
	        border-radius: 3px;
}



.thumb .drop{
	font-family: 'Cabin Condensed', sans-serif;
	padding: 7px 3px;
	display: block;
	position: absolute;
	left: 0px;
	top: 224px;
	width: 304px;
	height: 14px;
	overflow: hidden;
	z-index: 1;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
	        border-radius: 3px;
}


.thumb .desc{
	margin-bottom: 5px;
	padding: 0 0 0 18px;
	overflow: hidden;
	width: 219px;
	height: 18px;
	background: url(img/th-ico.png) no-repeat 0 -44px;
	font-size: 14px;
	line-height: 18px;
	font-family: 'Roboto Condensed', sans-serif;
}

.thumb .info{
	margin: 5px 0;
	padding: 0;
	height: 12px;
	font-size: 11px;
	color: #aeaeae;
}

.thumb .cats,
.thumb .tags{
	margin: 10px 0;
	padding: 0 5px;
	overflow: hidden;
	font-size: 11px;
	line-height: 14px;
	width: 234px;
	height: 14px;
}
.thumb .cats a,
.thumb .tags a{
	padding-left: 5px;
	display: inline-block;
}
.thumb .cats a{
	background: url(img/th-ico2.png) no-repeat 0px 0px;
}
.thumb .tags a{
	background: url(img/th-ico2.png) no-repeat 0px -13px;
}
.thumb a.canal{
	display: block;
	text-align: right;
	background: url(img/th-ico2.png) no-repeat 0 -30px;
	padding-right: 5px;
	margin-top: 10px;
	font-size: 12px;
	line-height: 14px;
}


.thumb .drop_index{
	font-family: 'Cabin Condensed', sans-serif;
	padding: 3px;
	display: block;
	position: absolute;
	left: 0px;
	top: 224px;
	width: 304px;
	height: 18px;
	overflow: hidden;
	z-index: 1;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
	        border-radius: 3px;
}

.thumb .desc_index{
	margin-bottom: 5px;
	text-align: center;
	overflow: hidden;
	width: 293px;
	height: 18px;
	font-size: 14px;
	line-height: 16px;
	font-family: 'Roboto Condensed', sans-serif;
}
.thumb .desc_index span{
	text-transform: uppercase;
	font-size: 16px;
	font-weight: bold;
}
.thumb .desc_index a{
    text-decoration:none;
}

.list-box{
	list-style-type: none;
	padding: 10px;
	margin: 0 4px 20px 4px;
}
.list-box ul{
	width: 12%;
	display: inline-block;
	position: relative;
}
.list-box ul li{
	list-style-type: none;
	display: block;
}

.list-box a{
	text-transform: capitalize;
	font-size: 14px;
	line-height: 30px;
	display: inline-block;
	padding: 0 10px;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
	        border-radius: 3px;
}


.popup-list-box ul{
	width: 12%;
	display: inline-block;
	position: relative;
	list-style-type: none;
	vertical-align: top;
}
.popup-list-box ul li{
	list-style-type: none;
	display: block;
}
.popup-list-box a{
	text-transform: capitalize;
	font-size: 12px;
	line-height: 30px;
	display: inline-block;
	border: 1px solid transparent;
	padding: 0 10px;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
	        border-radius: 3px;
}

.popup-list-box .all-link{
	float: right;
}


.nav-box{
    position: relative;
    padding: 4px 4px;
    font-size:14px;
    font-weight: bold;
    line-height: 28px;
    text-align: center;
}

.nav-box .pager{
    padding: 3px 10px;
    position:relative;
    display: inline-block;
    -webkit-border-radius: 5px;
       -moz-border-radius: 5px;
            border-radius: 5px;
}
.nav-box .pager a,
.nav-box .pager span{
    display: inline-block;
    padding: 0 5px;
    -webkit-border-radius: 3px;
       -moz-border-radius: 3px;
            border-radius: 3px;
}
}
.nav-box .pager .prev{margin-right: 8px;}
.nav-box .pager .next{margin-left: 8px;}
.nav-box .pager{ display: inline-block; }




/* --------------- /footer styles ---------*/

.spot-block{
	display: block;
	overflow: hidden;
	text-align: center;
	position: relative;
	z-index: 1;
	margin: 0px auto;
}
.spot{
	display: inline-block;
	margin: 0;
	padding: 5px;	/* ADD */
	width: 300px;
	height:260px;
	overflow: hidden;
}

.footer{
	padding: 10px 0;
	text-align: left;
	font-size: 11px;
	line-height: 14px;
	margin-top: 10px;
}
.footer .logo-box{
	float: left;
	width: 350px;
	padding-right: 40px;
	text-align: right;
}
.footer .footer-content{
	display: block;
	margin-left: 400px;
}
.footer p{
	margin: 7px 0;
}
/* --------------- /footer styles ---------*/




/* --------------- media screen styles ---------*/

@media only screen and (min-width: 1px) and (max-width: 1303px){
	.page-layout {
		padding: 0 0px;
	}
	.header .logo {
		margin: 0 auto;
		float: none;
	}
	.header-menu-btn{ display: block !important; }


	.header.search-open{
		margin-bottom: 54px;
	}
	.header.search-open .search-box{
		display: block;
	}
	.search-box{
		display: none;
		top: 74px;
		right: 10px;
		left: 10px;
	}
	.search-box{
		background: #5d5d5d;
		box-shadow: none;
	}
	.search-box input[type=text]{
		color: #fff;
		height: 42px;
		line-height: 42px;
	}
	.search-box input[type=submit]{
		width: 42px;
		height: 42px;
	}


	.header-menu{display: none;}
	.header.menu-open .header-menu{
		display: block;
	}
	.header .header-menu{
		position: absolute;
		top: 60px;
		left: 0px;
		background: #616161;
		z-index: 1;
		width: 200px;
	}
	.header-menu a {
		display: block;
		float: none;
		text-align: left;
		border: 1px solid #464646;
		border-left: none;
		border-right: none;
		margin: 0;
		padding: 15px 5px;
		width: 100%;
		height: auto;
		line-height: 18px;
		-webkit-border-radius: 0px;
		   -moz-border-radius: 0px;
		        border-radius: 0px;
	}
	.header-menu a:hover {
		border-left: none;
		border-right: none;
	}
	.header-menu a i{
		float: left;
		margin: 0;
		margin-right: 20px; 
	}

	.footer .logo-box {
		float: none;
		width: auto;
		text-align: center;
		padding: 0;
	}
	.footer .footer-content {
		margin: 0;
	}
}

@media only screen and (min-width: 640px) and (max-width: 1024px){
	body {min-width:640px;}
	.list-box ul {
		width: 32%;
	}
}
@media only screen and (min-width: 480px) and (max-width: 639px){
	body {min-width:480px;}
	.list-box ul {
		width: 49%;
	}
}
@media only screen and (max-width: 479px){
	body {min-width:320px;}
	.list-box ul {
		width: 99%;
	}
	.text-box {
		margin: 5px 10px;
	}
}

/* --------------- /media screen styles ---------*/


/* --------------- colors ---------*/

body {
	background: #ffaa11;
}

.header{
	background: #cc3300;
	border-bottom: 1px dashed #ffaa11;
	padding-bottom: 2px;
}
.header-menu a{
	color: #000;
	border: 1px solid #446622;
	background: #eeeecc;
}
.header-menu a.current,
.header-menu a:hover{
	color: #000;
	border: 1px solid #000;
	background: #ffaa11;
}

.footer{
	color: #ccc;
	background: #cc3300;
	border-top: 1px dashed #ffaa11;

}

.search-box{
	background: #ffffdd;
	border: 1px solid #446622;
	box-shadow: inset 0 2px 2px #cc3300;
}

.title-line{
	color: #000;
}


.thumb img{
	border: 1px solid #995533 !important;
}
.thumb:hover img{
	border: 1px solid #000 !important;
}


.thumb .drop{
	border: 1px solid #995533;
	background: #ffddbb;
}
.thumb:hover .drop{
	height: auto;
	border: 1px solid #000;
	background: #ffffdd;
}

.thumb .drop_index{
	border: 1px solid #446622;
	background: #ffddbb;
}
.thumb:hover .drop_index{
	height: auto;
	border: 1px solid #000;
	background: #ffffdd;
}

.thumb .desc_index{
	color: #995533;
}
.thumb:hover .desc_index{
	height: auto;
	color: #995533;
}
.thumb .desc_index span{
	color: #000;
}

.thumb a{
	color: #995533;
	text-decoration:underline;
}
.thumb a:hover{
	color: #000;
	text-decoration:none;
}

.thumb .tags{
	color: #995533;
}

.thumb a.canal{
	color: #995533;
	text-decoration:underline;
}
.thumb a.canal:hover{
	color: #000;
	text-decoration:none;
}

.thumb .desc{
	color: #000;
}
.thumb:hover .desc{
	color: #000;
	height: auto;
}


.nav-box .pager{
    border: 1px solid #995533;
    background: #eeaa55;
}
.nav-box .pager span{
    color: #000;
}
.nav-box .pager a{
    color: #000;
	text-decoration: none;
}
.nav-box .pager a:hover,
.nav-box .pager .activ{
    color: #fff;
    background: #cc3300;
    border: 1px solid #ffaa11;
}

.list-box{
	border: 1px solid #995533;
	background: #eeaa55;
}
.list-box a{
	color: #000;
}
.list-box li a:hover{ 
	color: #fff; 
	background: #cc3300;
	border: 1px solid #ffaa11;
}

.fancybox-skin{
	background: #eeaa55;
}
.popup-list-box{
	background: #eeaa55;
	display: none;
}
.popup-list-box a{
	color: #000;
}
.popup-list-box a:hover{ 
	color: #fff; 
	background: #cc3300;
	border: 1px solid #ffaa11;
}


/* --------------- colors ---------*/
