/*FINAL CSS*/

/*ROOTS*/
:root {
    zoom: 100%;
}

/*FONTS*/
@font-face {
	font-family: gamefont;
	src: url(https://fonts.gstatic.com/s/inter/v2/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuFuYAZ9hiA.woff2) format('woff2');
}

@font-face {
	font-family: hpammo;
	src: url(https://fonts.gstatic.com/s/inter/v2/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuFuYAZ9hiA.woff2) format('woff2');
}

/*MENU CSS*/
/*TEST AREA(button animations)*/
/*MENU BUTTONS*/
.button.small {
    padding-bottom: 11px!important;
    padding-top: 9px !important;
    border-radius: 22px !important;
    text-shadow: none!important;
}

#customizeButton {
    box-shadow: none !important;
    padding-bottom: 17px !important;
    border-radius: 22px !important;
    background-color: #333333;
}

.buttonPI {
    background-color: #333333!important;
    box-shadow: none !important;
}

.buttonG {
    background-color: #333333!important;
    box-shadow: none !important;
}

.buttonR {
    background-color: #333333!important;
    box-shadow: none !important;
}

.buttonP {
    background-color: #333333!important;
    box-shadow: none !important;
}

.buttonP {
    background-color: #333333!important;
    box-shadow: none !important;
    border-radius: 50px !important;
}

.accountButton {
    color: #2196f3;
    text-align: center;
    margin-top: 10px;
    display: inline-block;
    width: 342px;
    cursor: pointer;
    background-color: #333333;
    font-size: 22px;
    padding-top: 8px;
    padding-bottom: 12px;
    border-radius: 22px;
}

/*MENU BUTTON HOVER*/
.menuItem:hover {
    border: 4px solid #2196f3;
    transform: scale(1);
    animation: glowing;
}

/*MENU WINDOWS*/
#menuWindow {
    box-shadow: none !important;
    background-color: #232323;
}

.serverHeader {
    background-color: #232323 !important;
}

.menuSelectorHeader {
    color: #ffffff;
}

* {
    color: #ffffff;
}

.grey {
    color: #ffffff;
}

.settingsHeader {
    background-color: #232323;
}

#settSearch {
    background-color: #353535;
}

.inputGrey2 {
    background: #353535;
    color: #ffffff;
}

.sliderM {
    border-radius: 0px !important;
    height: 10px;
    background-color: #353535;
}

input:checked+.optCheck {
    background-color: #ffffff00;
}

.slider {
    color: #353535;
}

.sliderVal {
    color: #ffffff;
    background: #353535;
}

.slidecontainer {
    margin-top: -5px;
}

.menuTabNew {
    color: #ffffff;
}

#customSnameTeam1 {
    background: #353535 !important;
}

#customSnameTeam2 {
    background: #353535 !important;
}

#passCode {
    background: #353535 !important;
}

#presetName {
    background: #353535 !important;
}

#presetSelect {
    background: #353535 !important;
}

#rawMapData {
    background: #353535 !important;
}

.b {
    color: #ffffff!important;
}

#rankedPartyKey {
    background-color: #353535;
}

#queueRegionSelect {
    background-color: #353535 !important;
}

#loadoutName {
    background: #353535 !important;
}

#loadoutSelect {
    background: #353535 !important;
}

.slider {
    background-color: #353535;
}

a {
   color: #ffffff;
}


.hostMapImg {
    transition: none;
}

#uiBase.onMenu #spectButton {
    top: 950px;
    bottom: auto;
    right: 178px;
    left: auto;
    transform: scale(1.3);
}

@media ( max-height: 671px ) {
    #uiBase.onMenu #spectButton {
    top: 910px;
    bottom: auto;
    right: 178px;
    left: auto;
    transform: scale(1.3);
    }
}

.sliderSml {
    border-radius: 0px;
}

.sliderSml:before {
    border-radius: 0px;
}

.sliderCent {
    border-radius: 0px;
}

.sliderCent:before {
    border-radius: 0px;
}

.settName, .settNameSmall {
    clear: both;
    margin-top: 3px !important;
    font-size: 22px !important;
    color: #000000c4;
}

input:hover+.optCheck {
    background-color: #1d1d1ded;
}

.optCheck {
    background-color: #353535;
}


/*TOP LEFT AND RIGHT HEADER BAR*/
.headerBarRight {
    right: 0;
    padding-right: 3px !important;
    padding-left: 20px;
    top: -5px !important;
    transform: scale(1.2);
    border-radius: 0 0 0 8px;
    background-color: #ffffff00 !important;
}

.verticalSeparator {
    background: rgb(255 255 255);
}

.imageButton {
    display: none !important;
}

/*MISC*/

#merchImg {
    height: 130px;
    animation: scaleBob .4s ease-in-out infinite alternate;
    -webkit-animation: scaleBob .4s ease-in-out infinite alternate;
    display: none !important;
}

#uiBase.onMenu #claimHolder {
    left: 145px;
    top: 100px;
}

#instructions {
    animation: none !important;
}

#claimImg {
    -webkit-animation: none !important;
}

#mainLogo {
    transform: scale(0.9);
}

#uiBase.onMenu #voiceDisplay {
    display: none;
}

a:visited {
    color: #ffffff;
}

.grey:visited {
    color: #ffffff;
}

a:active {
    color: #ffffff;
}

.mapListThumb {
    transition: none !important;
}
/*LEFT SIDE BAR*/
#menuItemContainer {
    width: 30%;
    position: absolute;
    left: 916px !important;
    top: 92%;
    bottom: 0;
    height: 45px;
    display: flex;
    flex-direction: row;
}

.menuItem {
    color: #fff;
    flex-grow: 1;
    display: flex;
    transition: all .1s;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    background: rgb(51 51 51);
    text-align: center;
    pointer-events: all;
    margin-left: 5px !important;
    margin-right: 5px !important;
		padding-left: 22px !important;
    padding-right: 22px !important;
		padding-top: 11px;
		padding-bottom: 11px !important;
    cursor: pointer;
    border-radius: 22px !important;
}

@media ( max-height: 671px ) {
    #menuItemContainer {
    width: 25%;
    position: absolute;
    left: 1024px !important;
    top: 92%;
    bottom: 0;
    height: 45px;
    display: flex;
    flex-direction: row;
 }
}

.menuItem .menuItemIcon {
    display: none !important;
}

.menuItem .menuItemTitle {
    margin-top: 0px !important;
    color: #fff;
    font-size: 22px !important;
}

/*LEFT SIDE BAR HOVER*/

/*AD-CONTAINER*/
#aContainer {
    display: none !important;
}

#aMerger {
    display: none !important;
}

/*BRAVE WARNING*/
#braveWarning {
    display: none !important;
}

/*CHAT-HOLDER*/
#chatHolder {
    bottom: 0px !important;
}

#uiBase.onMenu #chatHolder {
    left: 3px;
}

/*MENU-LEVEL*/
/*MODEL VIEWER(RIGHT SIDE)*/
#menuClassSubtext {
    display: none !important;
}

#classPreviewCanvas {
    margin-bottom: -80px;
}

.menuClassPlayerVirus {
    display: none !important;
}
/*MISC*/
#streamContainer {
    display: none !important;
}

/*IN-GAME CSS*/
#ammoDisplay {
	background-color: transparent;
	letter-spacing: 0;
	width: 100px;
	height: 65px;
	border-radius: 0;
	position: fixed;
	right: 31%;
	bottom: 25%;
	padding: 0;
	padding-top: 0;
	padding-left: 0;
}

#ammoVal {
	color: #fff;
	font-family: hpammo;
	font-size: 48px;
	font-weight: 500;
	margin-left: 12px;
	text-shadow: 2px 2px 3px rgba(30, 30, 30, .5);
}

#ammoMax {
	display: none;
}

#ammoIcon {
	display: none;
}

#reloadMsg {
	background: transparent !important;
}

#chatHolder {
	bottom: 20px !important;
}

#weapDisplay {
	bottom: 50%;
	transform: translateY(50%);
}

#curGameInfo {
	display: none;
}

#healthValueHolder {
    background-color: transparent;
    width: 100px;
    height: 65px;
    border-radius: 0;
    position: fixed;
    left: 30%;
    bottom: 25%;
    padding: 0;
    margin-bottom: 0;
    padding-right: 0;
    padding-left: 0;
    align-items: center;
}

#healthValue {
    color: #0670c2;
    font-size: 48px;
    font-weight: 700;
    letter-spacing: 2px;
    text-align: center;
    text-shadow: 2px 2px 3px rgba(30, 30, 30, .5);
    margin-top: 0;
    will-change: unset;
}

#maxHP {
    display: none;
}

#healthBar {
    display: none;
}
#killStreakHolder {
    position: fixed;
    left: 53%;
    top: 80%;
}

.killStreakItem {
    width: 50px;
    height: 50px;
    background-color: transparent;
}

#timerDisplay {
    text-align: center;
    position: fixed;
    transform: translateX(-50%);
    top: 80%;
    left: 50%;
    padding: 0;
    padding-left: 0;
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 0;
    margin-left: 0;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 0;
    border-radius: 0;
    background-color: transparent;
    will-change: unset;
}

#timerVal {
    font-size: 36px;
    padding-left: 0;
    text-shadow: 2px 2px 3px rgba(30, 30, 30, .5);
    will-change: unset;
}

#timerIcon {
    display: none;
}

#teamScores {
    background-color: rgba(15, 15, 15, .2);
    border-radius: 0;
}

#deathsVal,
#killsVal,
#livesDisp,
#myScoreVal {
    bottom: 7px;
    position: relative;
}

#leaderDisplay {
    border-radius: 0;
    background-color: rgba(15, 15, 15, .2);
}

.leaderName {
    color: #f00;
}

.newLeaderContainer {
    border-radius: 0;
    background-color: rgba(15, 15, 15, .2);
}

.teamTotals {
    background-color: rgba(0, 0, 0, .5);
    border-radius: 0;
}

.teamTotalN0 {
    color: #0670c2;
}

.teamTotalN1 {
    color: #eb5656;
}


#streakCount {
    position: fixed;
    transform: translateX(-50%);
    top: 85%;
    left: 50%;
    background-color: transparent;
    text-shadow: 2px 2px 3px rgba(30, 30, 30, .5);
}

#streakIcon {
    filter: drop-shadow(2px 2px 3px rgba(30, 30, 30, .5));

}

 .profilePic {
    display: none !important;
 }

 .endAContainer {
	 display: none !important
 }

 #voiceDisplay {
 	display: none;
 }

 #challIcon {
	display: none !important;
}

#hudClassIcon {
	display: none;
}

#teamScores {
	position: fixed;
	top: 35px;
	left: 50%;
	transform: translateX(-50%);
	width: 150px;
	height: 25px;
	padding: 10px;
	padding-left: 0;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
	margin-left: 0;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	border-radius: 0;
	background-color: transparent;
}

.tScore {
	display: inline-block;
}

#tScoreV1 {
	position: fixed;
	left: -25%;
	top: 4px;
}

#tScoreV2 {
	position: fixed;
	left: 25%;
	top: 4px;
}

.tScoreT {
	width: 100%;
	text-align: center;
	font-size: 15px;
	color: #fff;
	z-index: 2;
}

.tScoreM {
	display: none;
}

.tScoreF {
	left: 50%;
	width: 75px;
	height: 25px;
	margin-right: 0;
	padding-left: 0;
	padding-right: 0;
	background-color: #eb5656;
	color: transparent;
	opacity: 50%;
	z-index: 1;
}

.tScoreF.you {
	background-color: #5699eb;
	color: transparent;
	opacity: 50%;
	z-index: 1;
}

.tScoreC {
	left: 50%;
	width: 75px;
	height: 25px;
	margin-right: 0;
	background-color: #eb5656;
	opacity: 50%;
	z-index: 1;
}

.tScoreC.you {
	background-color: #5699eb;
	opacity: 50%;
	z-index: 1;
}

#policePopC {
    background-color: #525252;
}

#killCardHolder {
    bottom: 0px;
}

#endAContainer {
	display: none !important;
}

#policeButton {
    height: 57px !important;
    width: 60px !important;
    vertical-align: bottom;
    padding-top: 5px !important;
    padding-left: 17px !important;
    box-shadow: none !important;
    border-radius: 22px !important;
    background-color: #333333 !important;
}

#activateKDM {
    font-size: 24px;
    line-height: 29px;
    width: 100%;
    height: 60px;
    margin-top: 20px;
    box-shadow: none !important;
    border-radius: 22px;
    background-color: #333333 !important;
}

#activateKDM:hover {
    background-color: #414a6d;
    margin-top: 23px;
    height: 60px;
    box-shadow: inset 0 -4px 0 0 #252a3d;
    -webkit-transform: scale(1);
    transform: scale(1);
}

#polConfPop {
    pointer-events: all;
    width: 350px;
    border-radius: 6px;
    background-color: #535353;
    padding: 10px;
    padding-left: 20px;
    padding-right: 20px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

#declineBtn {
    margin-top: 5px;
    color: #fff;
    width: 44%;
    font-size: 18px;
    text-align: center;
    padding: 15px;
    cursor: pointer;
    padding-bottom: 12px;
    display: inline-block;
    background-color: #eb5656;
    float: right;
    border-radius: 22px !important;
    text-shadow: -1px -1px 0 #1c1c1c, 1px -1px 0 #1c1c1c, -1px 1px 0 #1c1c1c, 1px 1px 0 #1c1c1c, -2px -2px 0 #1c1c1c, 2px -2px 0 #1c1c1c, -2px 2px 0 #1c1c1c, 2px 2px 0 #1c1c1c, -3px -3px 0 #1c1c1c, 3px -3px 0 #1c1c1c, -3px 3px 0 #1c1c1c, 3px 3px 0 #1c1c1c;
}

/*SCROLLBAR*/
::-webkit-scrollbar {
    width: 5px;
}

::-webkit-scrollbar-thumb {
    border-radius: 0px;
    background: #868686;
    -webkit-box-shadow: inset 0 0 2px rgba(0,0,0,.6);
    box-shadow: none !important;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    border-radius: 0px;
    background-color: #f5f5f5;
}
