*::-webkit-input-placeholder {
	color: #666;
	opacity: 1;
}
*:-moz-placeholder {
	color: #666;
	opacity: 1;
}
*::-moz-placeholder {
	color: #666;
	opacity: 1;
}
*:-ms-input-placeholder {
	color: #666;
	opacity: 1;
}
body{
background-color: #232323;
height: 100%;	
}
/* .sections {
    margin: 10px 0 41px 0;
    text-align: center;
}
.sections>a.active, .sections input[type=checkbox]:checked~label {
    border-bottom: 3px solid #f40;
    color: #f40!important;
}
.sections>a, .sections label {
    display: inline-block;
    margin: 0 10px 0 0;
    font-size: 1.7em;
    line-height: 34px;
    color: #dbdcde;
    text-transform: uppercase;
    padding: 5px;
}*/
a {
    color: #87cefa;
    text-decoration: none;
}
.mh:hover {
color: white;
}



.menu{
position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 6666;
    min-height: 70px;
    background: #000;
    background: rgba(0,0,0,.8);
    border-bottom: 1px solid #f40;
}
.contentGH{
margin: 0px auto 0;
    padding: 0 10px;
    max-width: 1200px;	
display: table;
font-family: WarfaceRegularRussian;
font-size: 15px;
line-height: 1.5;
}
/*MAP*/

.maps{
width: 1016px;
height: 100%;	
display: flex;
}
.map-first{
height: 178px;
width: 321px;
background-size: 321px 178px;
image-rendering: pixelated;
position: relative;
margin: 0 26px 0 0;
float: left;
}
.map-second{
height: 178px;
width: 321px;
background-size: 321px 178px;
image-rendering: pixelated;
position: relative;
margin: 0 27px 0 0;
float: left;
}
.map-third{
height: 178px;
width: 321px;
background-size: 321px 178px;
image-rendering: pixelated;
position: relative;
float: left;
}
.map-border{
width: 100%;
height: 100%;
border: 3px solid #ffffff38;
top: -55px;
position: relative;
}
.map-info{
height: 55px;
width: 100%;
background-color: #00000094;
text-align: center;
}
.map-info-name{
    font-size: 1.5em;
     color: white;
text-transform: uppercase;
line-height: 17px;
padding: 11px 0 7px 0;
}
.map-info-mode{
 color: white;
font-size: 1em;
line-height: 10px;
}

.map-info-match{
color: white;
font-size: 1em;
text-align: left;
margin: 43px 0 0 14px;
line-height: 20px;
z-index: 1;
}
.tt{
margin: 23px 0 0 14px;
}

.map-info-time{
color: white;
font-size: 1em;
text-align: left;
margin: 0 0 0 14px;
line-height: 20px;
z-index: 1;
}
.map-info-kd{
color: white;
font-size: 1em;
text-align: left;
margin: 0 0 0 14px;
line-height: 20px;
z-index: 1;
}
.map-info-win{
color: white;
font-size: 1em;
text-align: left;
margin: 0 0 0 14px;
line-height: 20px;
z-index: 1;
}
/*history info*/
.history{
width: 1016px;
height: 100%;
}
.history-info{
height: 100%;

}
.hi-map{
margin: 0 0 11px 102px;	
color: white;
font-size: 1.2em;
line-height: 12px;
}
.hi-mode{
margin: 0 0 0 150px;	
color: #ababab;
font-size: 1em;
line-height: 10px;
}
.hi-1{
margin: -33px 0 0 390px;        
color: white;
font-size: 1.2em;
line-height: 12px;    
}
.hi-2{
margin: 10px 0 0 390px;        
color: #ababab;
font-size: 1em;
line-height: 10px;    
}
.hi-room{
margin: -32px 0 0 515px;		
color: white;
font-size: 1.2em;
line-height: 12px;
}
.hi-room2{
margin: 10px 0 0 500px;        
color: #ababab;
font-size: 1em;
line-height: 10px; 
}
.hi-time{
margin: -41px 0 0 629px;	
color: white;
font-size: 1.2em;
line-height: 12px;
}
.hi-time-down{
margin: 10px 0 0 625px;	
color: #ababab;
font-size: 1em;
line-height: 10px;
}
.hi-time-down2{
margin: 10px 0 0 636px; 
color: #ababab;
font-size: 1em;
line-height: 10px;
}
.hi-kd{
margin: -30px 0 0 721px;	
color: white;
font-size: 1.5em;
line-height: 15px;	
}
.hi-kda{
margin: -23px 0 0 800px;	
font-family: WarfaceRegularRussian;
color: white;
font-size: 1.2em;
line-height: 12px;
}
.hi-kda-down{
margin: 12px 0 24px 813px;
font-size: 1.2em;
line-height: 12px;
color: #ababab;
}
.hi-kda-c{
margin: -52px 0 31px 884px;    
font-family: WarfaceRegularRussian;
color: white;
font-size: 1.5em;
line-height: 15px;
}

/* MATCH*/


.match{
height: 72px;
width: 100%	;
margin: 0 0 23px 0;
}
.match-map{
height: 72px;
width: 400px;
image-rendering: pixelated;
background-size: 500px 300px;
background-position: center;
text-align: center;
}
.match-background{
background: rgb(255,255,255);
background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(25,25,25,1) 38%, rgba(25,25,25,1) 99%, rgba(255,255,255,0) 100%);
width: 100%;
height: 100%;	
top: -144px;
position: relative;
}
.match-border{
position: relative;
top: -72px;
border-top:  3px solid #ffffff60; 	
border-left:   3px solid #ffffff60;
border-bottom:    3px solid #ffffff60;
height: 72px;
width: 400px;
}
.category-history{
text-align: center;
color: #dbdcde;
font-size: 1.7em;
    line-height: 34px;
margin: 10px 0 0 0;
}
.category{
text-align: center;
color: #dbdcde;
font-size: 1.7em;
    line-height: 25px;    
margin: 0 0 52px 0;
}
.category-down{
color: #ababab;
font-size: 0.6em;
line-height: 6px;    
}

.match-info{
width: 350px;
height: 100%;
position: relative;
top:-216px;	
text-align: center;
}
.mi-name{
text-transform: uppercase;	
font-size: 1.5em;
line-height: 20px;
color: white;
padding:  17px  0 10px 0;
}
.mi-mode{
font-size: 1em;
line-height: 10px;
color: white;
}
.mi-date{
margin: -42px 0 0 357px; 
font-size: 1.8em;
line-height: 18px;
color: white;
}
.mi-date-time{
margin: 10px 0 0 378px;
font-size: 1.8em;
line-height: 18px;
color: #ababab;
}
.mi-icon{
background-size: 32px 32px;
background-position: center;
height: 32px;
width:32px;
margin:   -40px 0 0 509px;	
}
.mi-streak{
margin:   -24px 0 0 542px;	
font-size: 1.6em;
line-height: 16px;
width: 38px;
height: 19px;
}
.mi-points{
    margin: -37px 0 0 505px;
    font-size: 1.6em;
    line-height: 16px;
    width: 68px;
    height: 25px;
    color: white;
}
.mi-points-diff{
    margin: 3px 0 0 0px;
    color: #ababab;
    font-size: 0.6em;
}
.mi-time{
margin: -38px 0 0 634px;	
color: white;
font-size: 1.3em;
}
.mi-time-war{
margin: -4px 0 0 640px;    
color: #ababab;
font-size: 1em;
}
.mi-kd{
margin: -35px 0 0 714px;
color: white;
font-size: 1.3em;
height: 29px;
width: 58px;
text-align: center;
}
.mi-kda{
margin: -29px 0 0 807px;
color: white;
font-size: 1.3em;
height: 29px;
width: 50px;
text-align: center;
}
.mi-icon-match{
margin: -35px 0 0 812px;	
width: 40px; 
height:40px;
background-size: 40px 40px;
background-position: center;
}
.mi-icon-class{
margin: -41px 0 0 896px;    
width: 40px; 
height:40px;
background-size: 40px 40px;
background-position: center;
}
.mi-status{
margin: -55px 0 0 1006px;   
width: 10px; 
height:72px;
border-top-right-radius:10px ;
border-bottom-right-radius:10px;
}
/*STATUS COLOR*/
.status-win{
background-color: #05ff00;  
}
.status-lose{
background-color: #ff0000;  
}

/*STREAK COLOR*/
.streak-win{
color: #05ff00;
}
.streak-lose{
color:  #ff0000;
}
.streak-none{
color:  #ffffff;
}

/*STREAK COLOR*/
.points-plus{
    color: #05ff00;
}
.points-minus{
    color:  #ff0000;
}
.points-none{
    color:  #ffffff;
}

/*hover-map*/

.map-first:hover .map-border{
border-style: solid;
border-image: linear-gradient(to top,#f40,rgba(255, 255, 255, 0.20)) 1 1%;
}
.map-first:hover .map-hover-gradient{
background: rgb(255,68,0);
background: linear-gradient(0deg, rgba(255,68,0,0.4290091036414566) 0%, rgba(255,255,255,0) 53%);
width: 100%;
height: 100%;	
position: relative;
top: -235px;
z-index: 1;
}
.map-first:hover .map-info-hover{
z-index: 20;
position: relative;
}
.map-second:hover .map-info-hover{
z-index: 20;
position: relative;
}
.map-third:hover .map-info-hover{
z-index: 20;
position: relative;
}
.map-second:hover .map-border{
border-style: solid;
border-image: linear-gradient(to top,#f40,rgba(255, 255, 255, 0.20)) 1 1%;
}
.map-second:hover .map-hover-gradient{
background: rgb(255,68,0);
background: linear-gradient(0deg, rgba(255,68,0,0.4290091036414566) 0%, rgba(255,255,255,0) 53%);
width: 100%;
height: 100%;	
position: relative;
top: -235px;
z-index: 1;
}
.map-third:hover .map-border{
border-style: solid;
border-image: linear-gradient(to top,#f40,rgba(255, 255, 255, 0.20)) 1 1%;
}
.map-third:hover .map-hover-gradient{
background: rgb(255,68,0);
background: linear-gradient(0deg, rgba(255,68,0,0.4290091036414566) 0%, rgba(255,255,255,0) 53%);
width: 100%;
height: 100%;	
position: relative;
top: -235px;
z-index: 1;
}



/*hover-match*/


.match:hover .match-border{
background: rgb(255,68,0);
background: linear-gradient(90deg, rgba(255,68,0,0.7287289915966386) 0%, rgba(255,255,255,0) 42%);	
}

.match:hover .match-hover{
border-style: solid;
border-image: linear-gradient(to right,#f40,rgba(0, 0, 0, 0)) 1 1%;
top: -288px;
height: 100%;
position: relative;
width: 60%;
}

footer {
    margin-top: 10px;
    padding-top: 20px;
    text-align: center;
    border-top: 2px solid #404c57;
height: 100px;
}

.footer-button{
width: 100%;
height: 50px;
position: relative;
top: -47px;    
background: rgb(35,35,35);
background: linear-gradient(0deg, rgba(35,35,35,1) 80%, rgba(255,255,255,0) 100%);
text-align:center;
}
.footer-button-text{
font-size: 1.7em;
line-height: 34px;   
padding: 30px 0 0 0;
display: block;
}
.fbth{
color: #dbdcde;
}
.fbth:hover{
color: white;   
}

