html, body {
	height: 100%;
	width: 100%;
	margin: 0px;
	padding: 0px;
	color:white; 
	font-family:font-family:verdana,arial,helvetica;
	font-size:8pt;
}

h3 {margin: 0px 0px 20px 0px; }


#timeslider {
    position: absolute; 
    bottom: 5vh;
    left: 10vh;
    z-index:100;
    display: none;
    margin: auto;
	width: 80vw;
}


#safezonecontainer a {
	color:white;
	text-decoration: none;
}

.ll {

color:red;
font-size:1.4em;
font-family:verdana,arial,helvetica	
	
}

#sh {
    color: white;
    font-weight:bold;
    padding-top: 4px;
    width: 60px;
    height: 17px;
    top: 50%;
    text-align: center;
    z-index:100;
    margin-top: -12px;
    font-size: 10pt;
  }

#timeslider .ui-slider-range { background: #000000; z-index:100; }
#timeslider .ui-slider-handle { border: 2px solid #FFFFFF; border-radius: 4px; z-index:100;  background: #000000; }
.ui-state-active { border: 2px solid #ffffff  !important ; }
.ui-widget-content { border: 2px solid #FF0000  !important ; background: #000000; color: #333333; }



#lr {
	position:absolute;
	bottom: 10px;
	left: 10px;
	z-index: 100;
	border-radius:10px;
	padding:5px;
	background-color:white;
}

.ev {
	float: right;
}

td {
	color:white; 
	font-family:verdana; 
	font-size:8pt;
}

#controls {
	position:absolute;
	top: 1vh;
	right:6px;
	z-index: 100;
	max-width:160px;
	width: 10vw;
}

#controls2 {
	position:absolute;
	top: 40px;
	left:10px;
	z-index: 100;
}

#controls3 {
	position:absolute;
	top: 40px;
	right:10px;
	z-index: 100;
}

#wrapper {
	width:100%;
	height:100%;
	position:fixed;
	top:0px;
	left:0px;
}

#sponsors {
	position: absolute;
	bottom: 5px;
	left:0px;
	width:100%; 
	text-align:center;
	z-index:10;

}

#isp {
	display:inline-block;
	margin: auto;
	position:relative;
}

.bubble td {
	font-family: 'Oswald', sans-serif;
	font-size: 8pt;
}

#maptitle {
	position:absolute; 
	z-index:100; 
	top:1vh; 
	left:1vw; 
	color:white; 
	font-size:2.7vw; 
	text-shadow: 3px 3px 3px #000000; 
	font-family: 'Oswald', sans-serif;
	margin-right:50px;
	display:none;
}
 .sponsorimg{ max-width: 100%; height: auto; margin-right:30px;}

.panes {
	background-color:#000000;
	border:solid 2px #999999;
	width: 100%;
	max-width: 150px;
	padding:3px;
	margin-bottom:10px;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	font-family: arial,verdana,helvetica;
	-webkit-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.75);
	box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.75);
	
}

.panes td {
	font-size:8pt;
	color:white;
}

.panes td input[type=checkbox]{
	position:relative;
	top: 3px;
}


.logo {
	width: 10vw;
	max-width: 150px;
	max-height: 150px;
	
}

.points {
	color: black;
	background-color: white;
	font-family: arial,verdana,helvetica;
	font-size: 7pt;
	text-align: center;
	font-weight:bold;
	width: 19px; 
	text-align:center;
	padding:1px 1px 1px 1px;
}



.starter {
	color: black;
	background-color: white;
	font-family: arial,verdana,helvetica;
	font-size: 8pt;
	text-align: center;
	font-weight:bold;
	width: 30px; 
	text-align:center;
	padding:1px 0px 0px 0px;
	-webkit-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.51);
	-moz-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.51);
	box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.51);

}

.starter2 {
	color: black;
	background-color: white;
	font-family: arial,verdana,helvetica;
	font-size: 8pt;
	text-align: center;
	font-weight:bold;
	width: 40px; 
	text-align:center;
	padding:0px 0px 0px 0px;
	border-right:solid 1px white;
	border-left:solid 1px white;
	border-bottom:solid 1px white;
}

.sossy {
	color: white;
	background-color: red;
	font-size: 10pt;
	width: 50px;
	z-index:100;
}

.helpy {
	color: white;
	background-color: #0000aa;
	text-align: center;
	width: 50px;
	z-index:10;

}

.stand {
	color: white;
	background-color: #B14A0B;
}

.black {
	color: white;
	background-color: #000000;
}

.green {
	color: white;
	background-color: #008000;

}

#loader div {
	margin: auto;
	width: 60vw;
	margin-top: 50vh;
	font-family: 'Oswald', sans-serif;
	border: 3px solid white;
	padding:5px 10px 10px 10px;
	background-color:red;
	font-size: calc(8px + 0.5vw);
	color:white;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	z-index: 200;
	text-align:center;
}

#pauser {
	display:none;
	width: 9.6vw;
    max-width: 150px;
    margin-top: 10px;
    border: 1px solid white;
    font-size: calc(2px + 0.9vw);
    background-color: red;
    padding: 0.1vw;
    color: white;
    font-family: 'Oswald', sans-serif;
    text-shadow: 1px 1px 1px #000000;
    }
    
    #pauser input {
		width: 1.2vw;
		height: 1.2vw;
		position: relative;
		top: 0.18vw;
		min-width: 10px;
		min-height: 10px;
    }

.wrap {
	position:absolute;
	width:100%;
	top:0px;
	height: 0px;
	left: 0px;
	z-index:200;
}

.leghead {
	margin-bottom: 0.5vh;
	font-size: calc(8px + 0.4vw);
	color: #FF7300;

}


.legsn{
    float: left;
    color: #555555;
    padding: 0px;
    margin: 0 0.2vw 0.2vh 0;
    text-align: center;
    width: 2vw;
    min-width: 18px;
    border-radius: 3px; 
}

.legsn input[type=checkbox] {
    visibility: hidden;
    display: none;
}

.legsn label {
    background-color: #E5E5E5;
    cursor: arrow;
    display: block;
    padding: 0.2vw;
    color: #555555;
    border: solid 1px #444444;
}

.legsn input[type=checkbox]:checked + label {
	background-color: #008000 !important;
	border: 1px solid #1E90FF;
	color: white;

}


#radar{
    position: absolute;
    right: 10px;
    top: 10px;
	z-index: 100;
	width: 7vw;
	min-width: 50px;
}

#radar input[type=checkbox] {
    visibility: hidden;
    display: none;
}

#radar label {
	text-align: center;
    background-color: #555555;
    cursor: arrow;
    display: block;
    padding: 0.2vw;
    color: #ffffff;
    border: solid 1px #333333;
	border-radius: 0.2vw;
	font-size: calc(10px + 0.3vw);
	font-weight: bold;
	font-family: 'Oswald', sans-serif;
}

#radar input[type=checkbox]:checked + label {
	background-color: #008000 !important;

}




.legclasses {
	margin: 0vh 0vh 0.7vh 0vh;
	padding: 0.3vh;
	
}

.legclasses div {
	margin: 0vh 0vh 0.2vh 0vh;
	color: #FF7300;
	font-weight: bold;

}

.legapply {
	background-color: #FF3600;
	color: white;
	font-size: calc(10px + 0.5vw);
	padding: 0.5vh 0.5vw 0.5vh 0.5vw;
	width: 235px;
	float: left;
	margin-top: 1.8vh;
	font-family: 'Oswald', sans-serif;

}

.legbox {
	float:left; 
	margin-right: 20px; 
	border: solid 1px #aaaaaa; 
	border-radius: 5px; 
	padding:5px; 
	margin-top: 1.8vh;
	min-width: 225px;
	background-color: #395B39;
}

#wrap2 {
	position:absolute;
	width:100%;
	top:0px;
	height: 0px;
	left;0px;
	z-index:50;
}

.filterfloat {
float:left; 
border-right: 1px solid #FF5800; 
border-bottom: 1px solid #FF5800; 
padding-right: 0.5vw; 
padding-bottom: 0.5vw; 
margin-right: 0.5vw; 
margin-bottom: 0.5vw; 
line-height: 1em;
}


#filter {
	display: none;
	margin: auto;
	width: 70vw;
	min-height: 50vh;
	margin-top: 10vh;
	font-family: 'Oswald', sans-serif;
	border: 2px solid white;
	padding:10px 10px 10px 10px;
	background-color:#444444;
	font-size: calc(8px + 0.3vw);
	color:white;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	z-index: 200;
	overflow: auto;
}

#replay_intro {
	font-size: calc(8px + 1.1vw);
	line-height: 1.1em;
}

.replaystart {

    border: solid 1px white;
    background-color: #FF0000;
    font-size: 1.5vw;
    padding: 0.3vh 0.5vw 0.3vh 0.5vw;
    font-weight: bold;
    color: white;
    border-radius: 5px;
    display: inline-block;
    margin: auto;
    font-family: 'Oswald', sans-serif;
    }

#dropper {
	cursor: pointer;
	position:relative;
	margin:auto;
	width:10vw;
	min-width: 85px;
	top: -20px;
	overflow:hidden;
	font-family: 'Oswald', sans-serif;
	font-size: 1vw;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border: 2px solid white;
	padding:20px 5px 3px 5px;
	background-color:#FF0000;
	text-align: center;
	vertical-align:bottom;
	font-size: calc(8px + 1.0vw);
	color: white;
	font-weight: bold;
	text-shadow: 2px 2px 2px #000000; 

}


#infomessage {
	color:white;	
	position:relative;
	margin:auto;
	width:60vw;
	top:20vh;
	overflow:hidden;
	font-family: 'Oswald', sans-serif;
	font-size: 2vw;
	line-height:1.2em;
	border-radius: 25px;
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
	border: 2px solid white;
	padding:20px;
	background-color:#000000;
} 

#infomessage2 {
	color:white;	
	position:relative;
	margin:auto;
	width:60vw;
	top:20vh;
	overflow:hidden;
	font-family: 'Oswald', sans-serif;
	font-size: calc(8px + 0.8vw);
	line-height:1.2em;
	border-radius: 25px;
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
	border: 2px solid white;
	padding:20px;
	background-color:#000000;
} 
 
#infomessage a {
	color:white;
	text-decoration:underline;
} 


.gm-style-iw {color:black;}

/* MAP BUBBLE CUSTOM */

.gm-style-iw {
	color:white;
	width: 290px !important;
	top: 15px !important;
	left: 0px !important;
	background-color: 585D60;
	box-shadow: 0 1px 6px #000000, 0.6);
	border: 1px solid red;
	border-radius: 5px 5px 5px 5px;
	background: #ffffff;

}
#iw-container {
	margin: 5px;
	width: 280px;
}


#iw-anchor {
	position:absolute; 
	bottom:-20px; 
	left: 70px;'
}


/* MAP BUBBLE CUSTOM */  



.neutral {
color:white;
text-decoration: none;
display:inline;
position:relative;
top:-2px;

}



.bubble {
	background-color: #cccccc;
	font-family: verdana,arial,helvetica;
	color:black;
}

.bubble td {
	background-color: #ffffff;
	font-size:12pt;
	color:black;
}

#gfoot {width: 10vw; max-width: 145px;}

/* The radiobox */
.radiobox {
    display: block;
    position: relative;
    padding-left: 1.6vw;
    margin-bottom: 1vh;
    cursor: pointer;
    font-size: 1.3vw;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	line-height: 1.1em;
}

/* Hide the browser's default radio button */
.radiobox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
    position: absolute;
    top: 0.1vw;
    left: 0;
    height: 1.1vw;
    width: 1.1vw;
    background-color: #eee;
    border: solid 1px #4D4D4D;
    border-radius: 20%;
}

/* On mouse-over, add a grey background color */
.radiobox:hover input ~ .checkmark {
    background-color: #FF2E00;
    border: solid 1px black;
}

/* When the radio button is checked, add a blue background */
.radiobox input:checked ~ .checkmark {
    background-color: #008000;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.radiobox input:checked ~ .checkmark:after {
    display: block;
}

.legradio {
    display: block;
    margin-bottom: 5px;
    
}
.legradio > input{ /* HIDE RADIO */
    visibility: hidden; /* Makes input not-clickable */
    position: absolute; /* Remove input from document flow */
}
.legradio > input + div{ /* DIV STYLES */
    cursor:pointer;
    padding: 1vh 1vw 1vh 1vw;
    border: solid 1px white;
    color:white;
    border-radius: 3px;
    font-size: calc(8px + 0.75vw);
    background-color: #676767;
}
.legradio > input:checked + div{ /* (RADIO CHECKED) DIV STYLES */
    background-color: #008000;
}

.legradio2 {
    display: block;
    margin-bottom: 5px;
    
}
.legradio2 > input{ /* HIDE RADIO */
    visibility: hidden; /* Makes input not-clickable */
    position: absolute; /* Remove input from document flow */
}
.legradio2 > input + div{ /* DIV STYLES */
    cursor:pointer;
    padding: 0.5vh 1vw 0.5vh 1vw;
    border: solid 1px white;
    color:white;
    border-radius: 3px;
    font-size: calc(8px + 0.5vw);
    background-color: #676767;
}
.legradio2 > input:checked + div{ /* (RADIO CHECKED) DIV STYLES */
    background-color: #FF3F00;
}














#masterpane {
 	font-size: calc(8px + 0.4vw);
 }

#masterpane h3 {
	margin-top: 1vh;
 	font-size: calc(8px + 0.9vw);
 }

#masterpane h4 {
 	font-size: calc(8px + 0.6vw);
 	margin-top: 1vh;
 	margin-bottom: 0.8vh;
 }


