@font-face{font-family:'PT Sans Narrow';font-style:normal;font-weight:400;src:local('PT Sans Narrow'), local('PTSans-Narrow'), url(https://fonts.gstatic.com/s/ptsansnarrow/v7/UyYrYy3ltEffJV9QueSi4Uvi3q9-zTdQoLrequQTguk.woff2) format('woff2');unicode-range:U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'PT Sans Narrow';font-style:normal;font-weight:400;src:local('PT Sans Narrow'), local('PTSans-Narrow'), url(https://fonts.gstatic.com/s/ptsansnarrow/v7/UyYrYy3ltEffJV9QueSi4UU-p1xzoRgkupcXIqgYFBc.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;}
@font-face{font-family:'RussiaLight';src:url("russia-light-webfont.eot");src:url("russia-light-webfont.woff") format("woff"), url("russia-light-webfont.ttf") format("truetype");font-weight:normal;font-style:normal;}
*{margin:0;padding:0;border:0;}
body{    min-width: 300px;
    max-width: 1600px;
    margin: auto;color:#000;font-size:15px;
	background:#ededed url(background.png);;
	font-family:'RussiaLight',Verdana, Arial;}
	
a {
	    color: #966e28;
text-decoration: none;		
}

img {
	vertical-align: middle;
    border-style: none;
}

p {
    margin-top: 16px;
    margin-bottom: 5px;
}

.vips {
    background: url(https://top100web.ru/images/vip.png) no-repeat top right, linear-gradient(90deg, rgba(2, 0, 36, 0) 0%, rgb(255, 225, 253) 0%, rgba(92, 166, 255, 0.28) 100%);
    border-bottom: 1px solid #ccd8eb;
    padding: 10px;
    line-height: 22px;
}

.head_top {
    background: #303030;
    height: 60px;
	    
}

.orange {
	    background: #303030;
    color: #fff;
	border-top: 1px solid #404040;
    padding: 12px;
}



.title2 {
	background: #e1e1e1;
    padding: 12px;
}

.title {
	background: #e1e1e1;
    padding: 12px;
}

.main {
	margin-top: 3px;
    border-radius: 3px;
    padding: 10px;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #ebebeb;
    background: #fafafa;
	line-height: 22px;
}

.mobile-icon {
    border-top: 5px solid #99cd93;
    border-left: 3px solid #99cd93;
    border-right: 3px solid #99cd93;
    border-bottom: 7px solid #99cd93;
    border-radius: 3px;
    padding: 1px 5px;
}

.mobile-icon-gold {
    border-top: 5px solid #ffeb3b;
    border-left: 3px solid #ffeb3b;
    border-right: 3px solid #ffeb3b;
    border-bottom: 7px solid #ffeb3b;
    border-radius: 3px;
    padding: 1px 5px;
}
.mobile-icon-silver {
    border-top: 5px solid #c4c4c4;
    border-left: 3px solid #c4c4c4;
    border-right: 3px solid #c4c4c4;
    border-bottom: 7px solid #c4c4c4;
    border-radius: 3px;
    padding: 1px 5px;
}
.mobile-icon-bronze {
    border-top: 5px solid #dd9143;
    border-left: 3px solid #dd9143;
    border-right: 3px solid #dd9143;
    border-bottom: 7px solid #dd9143;
    border-radius: 3px;
    padding: 1px 5px;
}

.hosts {
	    background: #e1e1e1;
		    color: #04a503;
    border: 1px solid #ccc;
    padding: 1px 10px;
    border-radius: 3px 0px 0px 3px;
}

.hits {
	    background: #ffffff;
    border: 1px solid #ccc;
    margin-left: -4px;
	color: #ff3d00;
    padding: 1px 10px;
    border-radius: 0px 3px 3px 0px;
}

.badge {
	margin-left: 3px;
}

.lt {
	padding: 10px;
	    background: #fff;
		margin-top: 5px;
    border-radius: 3px;
		    border-bottom: 1px solid #f1f1f1;
}

.foots {
	background: #626262;
    color: #fff;
    padding: 10px;
    text-align: center;
}

.stat {
	    background: #fff;
    padding: 10px;
    border-bottom: 1px solid #e1e1e1;
}

.cn {
	border-radius: 4px;
    color: #aa6c00;
    background: #ffc664;
    border: 1px solid #d59526;
    padding: 2px 10px;
    float: right;
}

.tb {
color: #6e6e6e;
    padding: 8px 20px;
    border-radius: 3px;
    background: #d3d3d3;
    box-shadow: 0 -3px #c0c0c0 inset;
    transition: 0.2s;
}

.error {
    margin-top: 3px;
    background: #e5bdbd;
    border-left: 5px solid #be6c6c;
    color: #853a3a;
    border-radius: 3px;
    padding: 15px;
}


.success {
margin-top: 3px;
    background: #c1e5bd;
    border-left: 5px solid #74be6c;
    color: #42853a;
    border-radius: 3px;
    padding: 15px;
}

.info {
	margin-top: 3px;
    background: #e4e5bd;
    border-left: 5px solid #bdbe6c;
    color: #727424;
    border-radius: 3px;
    padding: 15px;
}

.wsr {
	padding: 15px;
    background: #f9f9f9;
    color: #a2a2a2;
    border-radius: 3px;
    margin: 5px;
}

.nws {
	    color: #aeaeae;
    font-size: 14px;
    line-height: 19px;
}



.rot {
  animation: 2s linear 0s normal none infinite running rot;
  -webkit-animation: 2s linear 0s normal none infinite running rot;
  width: 16px;
}
@keyframes rot {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes rot {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}



.vipes {
 animation: 5s linear 0s normal none infinite running sff;
  -webkit-animation: 5s linear 0s normal none infinite running sff;
}

@keyframes sff {

0% {
    background: url(https://top100web.ru/images/vip.png) no-repeat top right, linear-gradient(90deg, rgba(2, 0, 36, 0) 0%, rgb(255, 225, 253) 0%, rgba(92, 166, 255, 0.28) 100%);
   
}

50% {
background: url(https://top100web.ru/images/vip.png) no-repeat top right, linear-gradient(90deg, rgba(2, 0, 36, 0) 0%, rgb(255, 241, 203) 0%, rgb(249, 229, 255) 100%);
}

100% {
    background: url(https://top100web.ru/images/vip.png) no-repeat top right, linear-gradient(90deg, rgba(2, 0, 36, 0) 0%, rgb(255, 225, 253) 0%, rgba(92, 166, 255, 0.28) 100%);
}
}
.topni {
    padding: 15px;
}

input[type="submit"]:hover {background: #303030;
font-weight: bold;padding: 8px;border-radius: 4px;-moz-border-radius: 4px;-webkit-border-radius: 4px;color: #fff;}

input[type="submit"] {background:#505050;border-radius: 4px;-moz-border-radius: 4px;-webkit-border-radius: 4px;color: #fff;padding: 8px;font-weight: bold;border: 1px solid #303030;}


input, select, textarea {
    background: #fff;
    padding: 10px;
	border-radius: 3px;
    border: 1px solid #e1e1e1;
    margin: 5px 0px 5px 0px;
}

input[type="radio"] {
    margin-top: 9px;
vertical-align: middle;
}


.containers {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
    padding: 10px 0px;
}

.wheor {
padding: 8px 15px;
    width: 130px;
    margin: 10px;
    border-radius: 3px 3px 3px 3px;
    background: #99cd93;
    box-shadow: 0 -3px #8db888 inset;
    transition: 0.2s;
    font-size: 12px;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
}

.wheor:hover {
    background: #8db888;

}

img.ion {
    margin-bottom: 5px;
}

.tpage {
    color: white;
    margin-bottom: 5px;
    padding: 5px 10px;
    border-radius: 3px 3px 3px 3px;
    background: #b6b6b6;
    box-shadow: 0 -3px #a1a1a1 inset;
    transition: .2s;
}

.upage {
    color: white;
    margin-bottom: 5px;
    padding: 5px 10px;
    border-radius: 3px 3px 3px 3px;
    background: #99cd93;
    box-shadow: 0 -3px #8db888 inset;
    transition: .2s;
}

.upage:hover {
    background: #8db888;
}

.np {
    border: 1px solid #ff0000;
    color: #f00;
    background: #ffffff;
    border-radius: 100%;
    padding: 3px;
    font-size: 10px;
}

.lbar {
	    float: left;
    width: 20%;
    overflow: hidden;
    display: block;
}

.cont {
    float: left;
    width: 57%;
    overflow: hidden;
    display: block;
}

.sitebar {
    float: right;
    width: 20%;
    overflow: hidden;
    display: block;
}

.slbvr {
    background: #e1e1e1;
    border: 1px solid #d5d5d5;
    margin-bottom: 5px;
    border-radius: 3px;
    color: #555;
    text-align: center;
    padding: 5px;
}

.clear{clear:both;}


.link-buttoms {
    color: white;
    padding: 8px 20px;
    border-radius: 3px;
    background: #99cd93;
    box-shadow: 0 -3px #8db888 inset;
    transition: 0.2s;
}

.link-buttoms:hover {
    background: #8db888;
    transition: 0.2s;
}

.vh1 {
    margin-left: 15px;
    margin-bottom: 0;
    border-style: solid;
    border-color: transparent transparent #99cd93 transparent;
    border-width: 1px 15px 8px 15px;
    height: 0px;
    width: 0px;
}

.vh2 {
    margin-top: 0;
    width: 69%;
    border: #99cd93 1px solid;
    padding: 5px;
    color: #577653;
    background-color: #ddefdb;
    border-radius: 3px;
}

.nprogress-bar {
	border: 1px solid #99cd93;
    color: #598954;
    background: #ddefdb;
    border-radius: 3px;
    padding: 5px;
    text-align: center;
    width: 272px;
    border-bottom: 0;
}

     .progress-bar {
    height: 25px;
    padding: 1px;
    width: 280px;
    border-radius: 3px;
    border: 1px solid #99cd93;
display: inline-block;	
        }
        
        .progress-bar span {
            display: inline-block;
            height: 100%;
			background-color: #777;
            -moz-border-radius: 3px;
			-webkit-border-radius: 3px;
			border-radius: 3px;
            -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset;
			-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset;
			box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset;
			-webkit-transition: width .4s ease-in-out;
			-moz-transition: width .4s ease-in-out;
			-ms-transition: width .4s ease-in-out;
			-o-transition: width .4s ease-in-out;
			transition: width .4s ease-in-out;		
        }
		
      .blue span {
            background-color: #99cd93;   
        }
		
		.stripes span {
            -webkit-background-size: 30px 30px;
            -moz-background-size: 30px 30px;
            background-size: 30px 30px;			
			background-image: -webkit-gradient(linear, left top, right bottom,
								color-stop(.25, rgba(255, 255, 255, .15)), color-stop(.25, transparent),
								color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .15)),
								color-stop(.75, rgba(255, 255, 255, .15)), color-stop(.75, transparent),
								to(transparent));
            background-image: -webkit-linear-gradient(135deg, rgba(255, 255, 255, .15) 25%, transparent 25%,
                                transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%,
                                transparent 75%, transparent);
            background-image: -moz-linear-gradient(135deg, rgba(255, 255, 255, .15) 25%, transparent 25%,
                                transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%,
                                transparent 75%, transparent);
            background-image: -ms-linear-gradient(135deg, rgba(255, 255, 255, .15) 25%, transparent 25%,
                                transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%,
                                transparent 75%, transparent);
            background-image: -o-linear-gradient(135deg, rgba(255, 255, 255, .15) 25%, transparent 25%,
                                transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%,
                                transparent 75%, transparent);
            background-image: linear-gradient(135deg, rgba(255, 255, 255, .15) 25%, transparent 25%,
                                transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%,
                                transparent 75%, transparent);            
            
            -webkit-animation: animate-stripes 3s linear infinite;
            -moz-animation: animate-stripes 3s linear infinite;       		
		}
        
        @-webkit-keyframes animate-stripes { 
			0% {background-position: 0 0;} 100% {background-position: 60px 0;}
        }
        
        
        @-moz-keyframes animate-stripes {
			0% {background-position: 0 0;} 100% {background-position: 60px 0;}
        }

.SetOfGood {
	color: #00b629;
    font-weight: bold;
    margin: 15px;
}

.catlink {
    color: white;
    margin-bottom: 5px;
    display: inline-block;
    width: 89%;
    padding: 8px 15px;
    border-radius: 3px 3px 3px 3px;
    background: #99cd93;
    box-shadow: 0 -3px #8db888 inset;
    transition: 0.2s;
}
.catlink:hover {
    background: #8db888;
    transition: 0.2s;
}

.catcount {
	float: right;
}

@media (max-width:5600px) {
.cont{ width:57%;}
.viewmob { display: none;}
.lbar { margin-right: 10px; margin-left: 10px; margin-top: 5px;} 
.sitebar { margin-right: 10px;  margin-top: 5px; }
}

@media (max-width:1600px) {
.cont{ width:57%;}
.viewmob { display: none;}
.lbar { margin-right: 10px; margin-left: 10px; margin-top: 5px;} 
.sitebar { margin-right: 10px;  margin-top: 5px; }
}
@media (max-width:1024px){
.cont{ width:55%;}
.viewmob { display: none;}
.lbar { margin-right: 10px; margin-left: 10px; margin-top: 5px;}
.sitebar { margin-right: 10px;  margin-top: 5px; }
}

@media only screen and (max-width: 900px) {
.cont{ width:100%;}
.viewmob { display: block;}
.lbar { width: 100%; margin: 0;}
.slbvr { display:none; }
.pnm { display:none; }
}

@media (max-width:800px){
.sitebar{ display:none; }
.viewmob { display: block;}
.lbar { width: 100%; margin: 0;}
.slbvr { display:none; }
.pnm { display:none; }
}

@media (max-width:479px){
.sitebar{ display:none; }	
.viewmob { display: block;}
.lbar { width: 100%; margin: 0;}
.slbvr { display:none; }
.pnm { display:none; }
}

.min {
	width: 16px;
	height: 16px;
}

.bcount {
    color: #8e8e8e;
    margin-left: -10px;
    padding: 5px 15px;
    border-radius: 33px 28px 28px 4px;
    background: #e1e1e1;
    box-shadow: 0 -3px #c7c7c7 inset;
}

.zl {
	text-transform: uppercase;
    font-size: 13px;
}



.container {
  width: 150px;
  height: 150px;
  overflow: hidden;
  border-radius: 50%;
  position: relative;
}

.sector {
  width: 50%;
  height: 50%;
  position: absolute;
  left: 50%;
  top: 0;
  transform-origin: left bottom;
}

.container:after {
  content: '';
  position: absolute;
  width: 50%;
  height: 50%;
  background: #fff;
  border-radius: 50%;
  top: 25%;
  left: 25%;
}