.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: center no-repeat #fff;
}
html{
    height:100%;
}
body {
	color:#000000;
	background-color:#000000;
	overflow:hidden;
}
.noPadding{
	padding:0%;
}
.toBottom
{
	position:fixed;
	bottom:10%;
}
.icon{
	width:4vw;
	float:left;
	z-index: 1;
}

#logo{
	margin-left:92vw;
}
#pLogo,#myHome{
	height:9vh;
}
#gameVideo,#gamePlayButton{
	height:100%;
	margin-top: -6%;
}
#gameVideo{
	margin-left:13%;
	    margin-top: -1%;
}
.playButton, .InstructionsButton{
    padding-top: 2%;
    border-style: outset;
    border-width: 1.2vh;
    border-color: #ffffff;
    border-radius: 80px;
    height: 14vh;
    background-color: #4CAF50;
    color: #ffffff;
    font-size: 2.2vw;
}
.InstructionsButton {
    background-color: #FF9800 !important;
}

.ModalInstructions{
	text-align:justify;
	font-size: 1.5vw;
}
.menuBtns{
	padding-left:5%;
	margin-top:4%;
}
.levelDisplay {
	border-top-style: solid;
	border-bottom-style: solid;
	border-width:8px;
	border-color:#607D8B;
	
	height:38vh;
	margin-top:5%;
	padding-top: 1px;
	background-color:#B0BEC5;
	color:#ffffff;
}

.copLevel{
    width: 15vw;
    margin-left:4vw;
    float:left;
}
#BottomSection{
	height:45%;
}
.mainBg{
/*    background-position: 100% 90%; */
    background-repeat: no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover; 
	background-size: cover;
}
#playTopSection{
	margin-top: 5%;
}
#topSection{
	z-index:-1;
	height:47vh;
	margin-top: -5%;
}

#roadImage,#roadImage2{
z-index:1; 
margin:0px;
width:48vw;
float:left;
}

#frameDivider{
	height: 100%;
	width:4vw;
	position:relative;
	z-index:1;
	float:left;
	margin:0px; 
}
.center-block{
	margin:0 auto;
}
#roadRotate,#roadRotate2 {
	background-position: bottom;
	background-size: cover;
	height: 100%;
}
.border{
	border-top-right-radius: 30px;
	border-bottom-right-radius: 30px;
	background-color:#FFEA00;
    background-repeat: repeat-x;
	background-size: 10% 40px;
}

.border1{
	border-right-style: solid;
    border-bottom-style: solid;
	border-color: #9E9E9E;
	border-width: 1.3vw;
}
.border2{
	border-left-style: solid;
    border-bottom-style: solid;
	border-color: #9E9E9E;
	border-width: 1.3vw;
	
}
.move,#myThief{
	position:absolute; 
	z-index:3;
	top:17vh;
}


.frac { display: inline-block;
    position: relative;
    vertical-align: middle;
    letter-spacing: 0.001em;
    text-align: center;
}
.frac > span {
    display: block;
    padding: 0.1em;
}
.frac span.bottom {
    border-top: thin solid black;
}
.frac span.symbol {
    display: none;
} 


.dec{
	border-style: solid;
	border-width:5px;
	border-radius:50px;
	margin-bottom:5px;
	margin-top:10px;
	padding-bottom:15px;
	padding-top:10px;
	border-color:#ffffff;
}

h2 {
	color:#ffffff;
}

#equation, #ansButtons {
	margin-top: 3%;
	color:#ffffff;
}

.btn-circle {
  width: 5.5vw;
  height: 10vh;
  text-align: center;
  padding: 6px 0;
  font-size: 1.8vw;
  line-height: 1.428571429;
  border-radius: 50%;  
  outline: none !important;
}

.btn:focus {
outline:0px;
}

.textStrong{
	font-weight: bold;
	font-size: 2.8vw;
	color:#000000; 
	margin-top:1.5%;
}

#scoreOuter{
	 position:relative;
	 padding-left:3%;
}
.myFont{
        font-size: 6.5vw;
    }
.replayLbl{font-size:2.5vw;}
#mapOuter{
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover; 
	background-size: cover;
	top: 13%;
}
.copMarkerImg, .thiefMarkerImg, .airportMarkerImg, .PrisonMarkerImg{
	width: 5vw;
}
#myMap{
	z-index: 2;
    height: 71vh;
    width: 34vw;

}
#copMarker{top:95%; left:60%}
#thiefMarker{top:50%; left:60%}
.criminalImg,.copImg,.happyCriminalImg,.sadCopImg{
	height: 75vh;
}
 #scoreMsg{
 	margin-top: 4%;
 }
 #myCopCopter{top: -6vh;}

@media screen and (min-device-height :375px){
.move, #myThief {
     top: 35%;
}
}

@media screen and (device-width :812px) and (device-height :375px){
.move, #myThief {
     top: 11vh;
}
.levelDisplay {
    border-top-style: solid;
    border-bottom-style: solid;
    border-width: 8px;
    border-color: #607D8B;
    height: 40vh;
    margin-top: 3%;
    padding-top: 1px;
    background-color: #B0BEC5;
    color: #ffffff;
}
}



@media screen and (min-device-height :384px){
.move, #myThief {
     top: 35%;
}
}

@media screen and (min-device-height :411px){
.move, #myThief {
     top: 29%;
}
}
@media screen and (device-height :450px){
.move, #myThief {
     top: 17%;
}
}

@media screen  and (min-device-width :480px) and (max-device-width :520px){
.move, #myThief {
     top: 42%;
}
#BottomSection{
margin-top:2.5%
}
}
#topSection {
    margin-top: -6%;
}
}


@media screen and (device-height :600px){
.move, #myThief {
     top: 35%;
}
}
@media screen and (min-device-height :768px){
.move, #myThief {
     top: 42%;
}
#BottomSection{
margin-top:2.5%
}
#topSection{
	margin-top: -7%;
}
.copLevel{
    margin-top: 4%;
    width: 15vw;
    margin-left:4vw;
    float:left;
}
}

@media screen and (min-device-height :800px){
.move, #myThief {
     top: 36%;
}
#topSection{
	margin-top: -7%;
}
}
@media screen and (device-height :900px){
.move, #myThief {
     top: 22%;
}
}

@media screen  and (min-device-width :1280px) and (min-device-height :667px){

#topSection{
	margin-top: -7%;
}
}
@media screen  and (min-device-width :1280px) and (min-device-height :900px){

#topSection{

	margin-top: -8%;
}
.copLevel{
    margin-top: 3%;
}
}

@media screen  and (min-device-width :1366px) and (min-device-height :667px){
.move, #myThief {
     top: 25%;
}
#BottomSection{
margin-top:2.5%
}
}
@media screen  and (min-device-width :1366px) and (min-device-height :1024px){
#topSection{
	margin-top: -7%;
}
.move, #myThief {
    position: absolute;
    z-index: 3;
    top: 42%;
}
.copLevel{
    margin-top: 4%;
}
}
@media screen  and (min-device-width :1440px) and (min-device-height :900px){
#topSection{
	margin-top: -9%;
}
.move, #myThief {
    top: 35%;
}
#myCopCopter{
	top: -7%;
}
}

@media screen and (min-device-height: 900px) and (min-device-width: 1800px){
.move, #myThief {
    top: 24%;
}
#myCopCopter{
	top: -5%;
}
}

@media screen  and (min-device-width :1900px){
.copLevel{
    margin-top: 4%;
}
.move, #myThief {
    position: absolute;
    z-index: 3;
    top: 29%;
}
}


