body, html {color:#DDD; 
background-color:#282828;
font-family:Tahoma, Verdana;padding:0;margin:0;
height: 100%;}


a, a:hover, a:visited {color:#AAA;text-decoration: none;padding:0;margin:0}
a:hover {text-decoration: none;color:#FFF}

.header {
	text-align:center;
	margin:0 auto;
}

.header {padding:10px 0 0}
.header p, .header .headline {
	max-width:720px;
	margin:0 auto;
}

.headline {font-size:11px;color:#888;padding-bottom:3px;}
.headline a {white-space: nowrap;color:#FFC701;font-weight:bold}
.headline a:hover {color:#FFF}
#logo {border:none;}
#logo img {border-radius:0;width:100%;max-width:727px}

.nav {margin:3px auto;max-width:800px;text-align:center}
.nav a {text-transform:uppercase;display:inline-block; font-size:12px;font-weight:bold;border-radius:3px;color:#D5E4F0;background:#544fdb;padding:3px 6px;margin:0 1px 2px;text-shadow:1px 1px 0 #2d27b9, -1px -1px 0 #7573bf;border:2px solid #000}
.nav a:hover {color:#FFF}
h1#onetitle {text-align:center;font-size:24px;color:#FFC701}

#container {
padding-top:5px;
  display: flex;
  display: -webkit-flex; /* Safari 8 */
  display: -ms-flexbox;
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;         /* Safari 8 */
  -ms-flex-flow: row wrap;
  justify-content: center;
  -webkit-justify-content: center;       /* Safari 8 */
  -ms-flex-pack: center;
}

#b300{max-width:300px;margin:0 auto;text-align:center}

#b240 {max-width:240px;margin:0 auto;text-align:center;font-size:11px}
#b240 a, #b600 a {font-weight:bold;color:#FFC701}
#b240 a:hover, #b600 a:hover {font-weight:bold;color:#FFF}

#b600 {max-width:580px;margin:0 auto;text-align:center;font-size:11px;}

h5 {color:#477bad;padding:2px 0;font-size:13px;margin:0}

.headertxt {padding:7px 10px;margin:0 auto;font-size:11px;font-weight:normal;color:#CCC}

.listing {width:290px;margin:2px;background:#000;position:relative;padding:5px;border-radius:6px}
.number {position:absolute;top:-3px;right:13px;display:inline-block;text-align:center;line-height:23px;
width:25px;height:25px;background:#000;border:2px solid #666;color:#FFC701;font-size:16px;border-radius:13px;font-weight:bold}
.pushit a, .pushit a:hover {text-decoration:none;border:none}
.pushit #pdescs {display:block;font-size:16px;margin:0;padding:0;color:#FFC701;font-weight:bold}
.pushit a:hover #pdescs {color:#FFF;}
.pushit #descs {border:none;font-size:11px;color:#CCC;}
.pushit #descs b {font-weight:bold;border-bottom:1px solid #666;color:#666}
.pushit #descs a:hover b {border-bottom:1px solid #FFF;color:#FFF}
.pushit b#red, #headsub b#red {display:inline-block;background:#F00;color:#FFF;font-weight:bold;border-radius:3px;padding:1px 3px;
border:none;font-size:10px}
.pushit b#blue, #headsub b#blue{display:inline-block;background:#00F;color:#FFF;font-weight:bold;border-radius:3px;padding:1px 3px;
border:none;font-size:10px}
#headsub {font-size:11px; color:#CCC;font-weight:normal;padding:4px 0;margin:0;text-align:center}
.pushit .thumbshot {float:right;margin:5px 0 0 2px;}
.pushit .thumbshot img {border:2px solid #666}
.pushit a:hover .thumbshot img {border:2px solid #FFF}

.rating {height:28px;width:150px;margin:0 auto;overflow:hidden}
.bottom, .footer {max-width:600px;margin:0 auto;text-align:center;font-size:11px}
.bottom p {text-align:center}
.bottom a {color:#FFC701;text-decoration:none}
.bottom a:hover {color:#FFF;text-decoration:underline}

/*--------------------------------------------main */
.main {margin: 0 auto; max-width:1260px;padding: 0 1.5em}

.masonry {
    margin: 1.5em 0;
    padding: 0;
    column-gap: 1.5em; /* Общее расстояние между колонками */
    font-size: .85em;
    -moz-column-gap: 1.5em; /* Расстояние между колонками для Firefox */
    -webkit-column-gap: 1.5em; /* Расстояние между колонками  для Safari, Chrome и iOS */
}
 
.item {
    display: inline-block;
    background: #000;
    padding-bottom: 1em;
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	break-inside: avoid;
    margin: 0 0 1.5em;
    width: 100%;
	overflow-y: auto;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box; 
    box-shadow: 0 0 3px 0 #fff;
}

#breakme { -webkit-column-break-before:always; break-before: always; }

.listing_m {margin:2px;padding:5px;border-radius:6px}
.number_m {display:inline-block;font-size:13px;font-weight:bold;color:#FFC701;margin-right:10px}
.listing_m  a {font-size:13px;font-weight:bold;color:#DDD}
.listing_m  a:hover {color:#FFF}

.item h2 {padding:6px 8px; margin:0 0 10px;background: linear-gradient(180deg, rgba(46,46,46,0), rgba(46,46,46,1));color:#BBB;font-size:12px;font-weight:bold}
.item h2 a {color:#FFC701;}
.item h2 a:hover {color:#FFF;}

@media only screen and (min-width: 400px) {
    .masonry {
        -moz-column-count: 2;
        -webkit-column-count: 2;
        column-count: 2;
		height:auto;
    }
}
 
@media only screen and (min-width: 700px) {
    .masonry {
        -moz-column-count: 3;
        -webkit-column-count: 3;
        column-count: 3;
		height:auto;
    }
	#m2 {height:auto!important}

}
 
@media only screen and (min-width: 900px) {
    .masonry {
        -moz-column-count: 4;
        -webkit-column-count: 4;
        column-count: 4;
		height:auto;
    }
#m2 {height:auto!important} 
#logo img {border-radius:10px;width:100%;max-width:727px;border:2px solid #000}

}
 
@media only screen and (min-width: 1100px) {
    .masonry {
        -moz-column-count: 5;
        -webkit-column-count: 5;
        column-count: 5;
		height:732px;
    }
	#m2 {height:367px!important}
}
 
#adbutton, #x3gbutton {
	padding:15px 0;
}
#adbutton a, #x3gbutton a {
	color: #111; 
	text-decoration: none;
	border-radius: 3px;
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
	border: 1px solid rgba(0,0,0,0.25);
	display: online-block;
	cursor: pointer;
	text-transform:uppercase;
	font-weight:bold;
	font-size: 14px;
	letter-spacing:0.05em;
	padding: 5px 15px;
	text-align:center;
	line-height:12px;
	font-weight:bold;
	background-color: #8680c9;
}

#adbutton a:hover, #x3gbutton a:hover{
	background-color: #ffcd02;
}

#thumbz {width:126px;height:102px; margin:10px 7px 0 0;position:relative}
#thumbz a h4 {width:120px;height:16px;overflow:hidden;padding:0;margin:0;letter-spacing:0;line-height:14px;
color:#FFD51E;font-size:10px;font-weight:bold;border-bottom:0;text-align:center;display:inline-block;position:absolute;bottom:11px;left:2px;
text-shadow:1px 1px 1px #000, -1px -1px 1px #000;}
#thumbz a:hover h4 {}
#thumbz a b {background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,1));width:120px;height:24px;display:block;position:absolute;top:68px;right:4px;opacity:0.9}
#thumbz a span {font-size:9px; color:#000;font-weight:normal;height:15px;overflow:hidden;display:inline-block;position:absolute;top:98px;right:3px}
#thumbz #votez {font-size:9px; color:#AAA;font-weight:normal;height:15px;overflow:hidden;display:block;width:120px;position:absolute;top:96px;right:0;text-align:center}
.listing #votex {font-size:12px; color:#AAA;font-weight:bold;height:15px;overflow:hidden;display:block;width:120px;text-align:center;margin:15px auto 5px auto} 
.listing .voteMe i {margin:0 10px;font-size:14px} 
#thumbz .voteMe i {margin:0 10px;font-size:11px}
.fa-thumbs-up {color:#00FF00}
.fa-thumbs-down {color:#FF0000}
#thumbz a #thumbz-img {width:120px;height:90px;text-align:center;padding:0;border:2px solid #010101;
-khtml-border-radius:3px; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; position:absolute}
#thumbz a:hover #thumbz-img {border:2px solid #464646}
#thumbz a:hover #thumbz-img img {width:116px;margin-top:2px}
#thumbz #th-rating {position:absolute;top:97px}

.thumbs {padding-bottom:10px}
