html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; font-family: Sans-serif; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } a:hover { border: 0; } 
body { font-family: Arial, sans-serif; text-transform: capitalize;}
input {-webkit-appearance: none;-moz-appearance: none;appearance: none;}

body {background:#232323; color:#7A7A7A;}
body a {color:#E9AB17;}

 
header{background:#1d1d1d; text-align:right;}  
header div {padding-left:15px; padding-right:15px;}  
header div:after {clear:both; display:block; content:'';}
a.logotype {display:inline-block; float:left; font-weight:700; color:#fff; text-decoration:none; font-size:22px; text-transform:uppercase; line-height:50px;} 
a.logotype strong {color:#E9AB17;}
header form {display:inline-block; margin-top:7px; min-width:400px; position:relative; float:right; margin-left:0px;border: 1px solid #333;border-radius: 2px;}
header form input {background:#191818; width: -webkit-calc(100% - 10px); width: -moz-calc(100% - 10px); width: calc(100% - 10px); line-height:35px;border:0px;-webkit-border-radius: 2px; -moz-border-radius: 2px; color:#fff;}

header form button {width:37px; height:37px; position:absolute; right:0; top:0; line-height:39px;  text-align:center; border:0px; cursor:pointer; background-image:url("../css/search.png"); background-position: center;background-size: 22px;background-repeat: no-repeat;background-color: #191818;}
header form button:hover {color:#E9AB17;}
header nav {display:inline-block; float:right;margin: 10px;}
header nav a{display:inline-block; line-height:35px; text-decoration:none; color:#fff; font-size:12px; font-weight:600; text-transform:uppercase; padding:0 15px 0 8px; }
header nav a i {display:inline-block; }
header nav a i.categories {color:#E9AB17; margin-right:3px;}

header nav a.check,
header nav a.check i,
header nav a:hover i{color:#E9AB17;}

.content_area {margin:10px;}
.content_area ul {margin:0 -4px;}
.content_area ul:after {content:''; display:block;clear:both;}
.content_area ul li {display:inline-block; float:left; width:328px;margin: 10px 0px;}
.content_area ul li .item {margin:5px 4px;position: relaitve;}
.content_area ul li .item a { text-decoration:none;}
.content_area ul li .item div {padding:8px; background:rgba(255,255,255,.03); -webkit-border-bottom-right-radius: 2px; -webkit-border-bottom-left-radius: 2px; -moz-border-radius-bottomright: 2px; -moz-border-radius-bottomleft: 2px; border-bottom-right-radius: 2px; border-bottom-left-radius: 2px; transition: all 300ms ease-in-out 0s;}
.content_area ul li:hover .item div {  background:rgba(255,255,255,.1); }
.content_area ul li .item .picture {  position:relative;
 background:#3e3c46 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-image'%3E%3Crect x='3' y='3' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Ccircle cx='8.5' cy='8.5' r='1.5'%3E%3C/circle%3E%3Cpolyline points='21 15 16 10 5 21'%3E%3C/polyline%3E%3C/svg%3E") center/18px no-repeat;
 padding-top:50%;
 overflow:hidden;
overflow: hidden;
-webkit-border-top-left-radius: 2px;
-webkit-border-top-right-radius: 2px;
-moz-border-radius-topleft: 2px;
-moz-border-radius-topright: 2px;
border-top-left-radius: 2px;
border-top-right-radius: 2px;
display: block;
position: relative;
}
.content_area ul li .item .picture .amount {position:absolute; right:10px; bottom:6px; color:#fff; background:rgba(37, 37, 37,.9); font-size:10px; padding:6px 6px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; z-index:3; transition: all 300ms ease-in-out 0s;}

.content_area ul li .item .picture img {
 object-fit:cover;
 vertical-align:bottom;
 top:0;
 left:0;
 width:100%;
 height:100%;
 display:block;
 position: absolute;
}
.content_area ul li .item .title {display:block; font-size: 13px; line-height:20px; #font-weight: 600; display: block; overflow: hidden; color: #FFFFFF; height: 20px; text-align: left;white-space: nowrap;text-overflow: ellipsis;}


.bottom_line,
.headline {margin:10px;}
.bottom_line:after,
.video_item:after,
.video_item .player .navigation:after,
.headline:after {content:''; display:block; clear:both;}
.bottom_line h2,
.headline h1 {color:#fff; font-weight:600; text-transform:uppercase; display:inline-block; float:left; margin:5px 0px;}
.headline .sort {display:inline-block; float:right; position:relative; height:40px; z-index:10;  -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; border:1px solid rgba(255,255,255,.1);}
.headline .sort span {font-size:12px; font-weight:600; color:#fff; display:block; line-height:40px; padding:0 30px 0 12px; position:relative;}
.headline .sort ul {position:absolute; left:-1px; top:40px; background:#252525; width:100%;  transition: all 300ms ease-in-out 0s; max-height:0px; overflow:hidden; border:1px solid rgba(255,255,255,.1); border-top:0;}
.headline .sort:hover ul {max-height:300px;}
.headline .sort ul li {}
.headline .sort ul li a{line-height:40px; text-decoration:none; font-size:11px; font-weight:600; display:block; text-transform:uppercase; color:#fff; padding-left:12px;}
.headline .sort ul li:hover a,
.headline .sort ul li.select a {color:#E9AB17; }
.headline .sort ul li.select a {position:relative;}
.headline .sort ul li.select a:before {border-left:3px solid #E9AB17; content:''; display:inline-block; width:1px; height:100%; position:absolute; left:-1px; top:0;}
  
.page-navigation {text-align:center;margin:20px 0;}  
.page-navigation a {display: inline-block; position: relative; text-decoration: none; font-size: 12px; line-height: 35px; padding: 0 12px; border: 1px solid rgba(255, 255, 255, .07); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; min-width: 25px; color:#fff;margin: 5px;}
.page-navigation a:hover,
.page-navigation a.select {color:#fff; border-color:#E9AB17; background:#E9AB17;}
.page-navigation a.next {float:right;}
.page-navigation a.before {float:left;}


.bottom_block {text-align:center; height:252px; overflow:hidden; margin:15px 0;}
.video_item .sidebar a,
.bottom_block a {display:inline-block; width:300px; height:250px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1);}

footer {padding-top:10px; border-top:1px solid rgba(255,255,255,.1); margin-top:25px; padding-bottom:20px;}
footer div {text-align:center;margin: 10px;}
footer div p {}
footer div p a{font-size:11px; line-height:40px; display:inline-block; text-decoration:none; color:#fff; margin:0 10px;}
footer div p a:hover {color:#E9AB17;}
footer div small {display:block; font-size:11px;}

.video_item {margin-top:20px;}
.video_item .player {display:inline-block; float:left; width: -webkit-calc(100% - 320px); width: -moz-calc(100% - 320px); width: calc(100% - 320px);}
.video_item .player .navigation {padding-top:5px;}
.video_item .player .navigation .rate_this {display:inline-block; line-height:35px; float:left;}
.video_item .player .navigation .rate_this span {color:#fff; line-height:35px; display:inline-block; font-size:12px; color:#fff; padding:0 20px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; font-weight:600;}
.video_item .player .navigation .rate_this span.procent {color:#E9AB17;}
.video_item .player .navigation .rate_this span i:before {font-weight:normal;}
.video_item .player .navigation .rate_this .like {background:#1ec343; cursor:pointer;}
.video_item .player .navigation .rate_this .dislike {background:#ed1f28;  cursor:pointer;}
.video_item .player .navigation .fav,
.video_item .player .navigation .duration,
.video_item .player .navigation .views,
.video_item .player .navigation .add {display:inline-block; float:right; line-height:35px;  border:1px solid rgba(255,255,255,.1); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; padding:0 12px; font-size:10px; font-weight:600; color:#fff; margin-left:8px;}
.video_item .player p {line-height:1.4; font-size:11px; margin-top:10px;}
.video_item .player p a:hover {text-decoration:none;}
.video_item .player .video {position: relative;zoom: 1;width: 100%;}
.video_item .player .video iframe {display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;float: none;overflow: hidden;}
.video_item .sidebar {}
.video_item .tags {margin:10px 0px; display:block; text-align:left;}
.video_item .tags a {margin:5px; display:inline-block; font-size:16px; text-decoration: none; text-align:left;} 

.listing_block .title_list {display:block; text-transform:uppercase; font-weight:600; color:#fff; margin:10px;}
.listing_block  ul {margin:10px 0 15px 0;}
.listing_block  ul li {display:inline-block; width:200px;padding: 5px 10px;}
.listing_block  ul li a {float:left; font-size:14px; text-decoration:none; border-bottom:1px dotted rgba(255,255,255,.6); color:rgba(255,255,255,.6); }
.listing_block  ul li a:hover {border-color:transparent; color:#E9AB17;}
.listing_block  ul li span {float:right;font-size: 13px;}


  @media screen and (min-width: 1640px) {
	header div,
	.headline,
	.bottom_line,
	footer div,
	.video_item,
	.listing_block,
	.content_area { max-width:1640px;margin-left:auto; margin-right:auto; }
}



@media screen and (min-width: 990px) {
	header div,  .content_area, .video_item {max-width:980px;text-align:center; margin:0px auto; padding:0px auto;}
	.headline, .listing_block, .bottom_line { max-width:980px;margin:10px auto;}

}

@media screen and (min-width: 1330px) {
	header div,  .content_area, .video_item {max-width:1306px;text-align:center; margin:0px auto; padding:0px auto;}
.headline, .listing_block, .bottom_line { max-width:1306px;margin:10px auto;}
}
@media screen and (min-width: 1660px) {
	header div,  .content_area, .video_item {max-width:1638px;text-align:center; margin:0px auto; padding:0px auto;}
.headline, .listing_block, .bottom_line { max-width:1638px;margin:10px auto;}
}

@media screen and (max-width: 1000px) {
	.video_item .sidebar,
	.video_item .player {width:100%; float:none; display:block;}
	.video_item .sidebar { text-align:center; margin:20px 0;}
	.content_area ul li {width:33.3%;}

}

@media screen and (max-width: 860px) {

	header form { width: -webkit-calc(100% - 420px); width: -moz-calc(100% - 420px); width: calc(100% - 420px); min-width:0px;}
}
@media screen and (max-width: 740px) {
	.page-navigation a {display:none;}
	.page-navigation a.before,
	.page-navigation a.next,
	.page-navigation a.select {display:inline-block;}
	.listing_block  ul li {width:33.3%;}
}

@media screen and (max-width: 668px) {
	a.logotype {padding-left:0; display:block; line-height:40px; float:none; text-align:left;}
	header nav a {line-height:24px;}
	header form{width:100%;}
	header form {margin-left:0; margin-top:0;}
		.content_area ul li {width:50%;}
}

@media screen and (max-width: 620px) {
		.video_item .player .navigation   { text-align:center;}
		.video_item .player .navigation .rate_this {display:block; float:none; width:100%; margin-bottom:10px;}
		.video_item .player .navigation .fav, .video_item .player .navigation .duration, .video_item .player .navigation .views, .video_item .player .navigation .add {float:none;}
}
@media screen and (max-width: 520px) {
	
	.headline .sort,
	.headline h1 {display:block; float:none;}
	.headline .sort {margin-top:10px;}
}

 
@media screen and (max-width: 400px) {
	a.logotype {display:inline-block; float:left; text-align:center;}
	header nav {display:inline-block;  float:left; top:38px; left:0; }
	header nav a {display:inline-block; float:left;}
	header form {display:inline-block;  margin-top:15px;}
	
}