body{background-color:#777;
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-tap-highlight-color: transparent;
 -webkit-user-select: none; /* Chrome, Opera, Safari */
    -moz-user-select: none; /* Firefox 2+ */
    -ms-user-select: none; /* IE 10+ */
    user-select: none; /* Standard syntax */
}
*:focus {
    outline: none;
}
.bonus{
	font-family: 'Pangolin', cursive;
	color:#f4e842;
	font-size:14px;
	 font-weight: 900;
	 line-height: 0.7;
}
.obs{
	font-family: 'Pangolin', cursive;
	color:#f4e842;
	font-size:40px;
	 font-weight: 900;
	 line-height: 0.3;
}
#main{
background: linear-gradient(0deg, rgba(60,60,60, 1), rgba(180,180,180, 1));
margin-top:-5px;
height:560px;
}

a{display:block;
width:200px;
height:30px;
background-color:#666;
font-family:arial;
font-size:20px;
margin-top:30px;
text-decoration:none;
color:white;
padding:5px;
padding-left:20px;
border-radius:7px;

-webkit-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
}
a:hover{
	-webkit-box-shadow: 1px 2px 4px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 4px 0px rgba(0,0,0,0.75);
box-shadow: 1px 2px 4px 0px rgba(0,0,0,0.75);
color:#888;
	
}
h2{display:block;
position:absolute;
left:740px;
top:20px;
	font-family: 'Pangolin', cursive;
	color:green;
	text-shadow: 1px 1px 1px rgba(0, 0,0, 1);  
	
}
#spelare{
	font-family: 'Pangolin', cursive;
	color:white;
	text-shadow: 1px 1px 1px rgba(0, 0,0, 1);
    font-size:1.0em;
    background-color:none;	

   margin-left:45px;
	
}
#spelare_index{
	font-family: 'Pangolin', cursive;
	color:white;
	text-shadow: 1px 1px 1px rgba(0, 0,0, 1);
    font-size:0.9em;
	
   


	
}

#status2{display:block;
position:absolute;
left:20px;
top:514px;
	font-family: 'Patrick Hand', cursive;
	color:white;
	/* text-shadow: 2px 2px 2px rgba(0, 0,0, 1); */
font-size:1.05em;
 letter-spacing: 0.09em;	
 -webkit-user-select: none; /* Chrome, Opera, Safari */
    -moz-user-select: none; /* Firefox 2+ */
    -ms-user-select: none; /* IE 10+ */
    user-select: none; /* Standard syntax */	
}
#status{
	font-family: 'Patrick Hand', cursive;
	letter-spacing: 0.09em;	
	/* text-shadow: 2px 2px 2px rgba(0, 0,0, 1); */
	width:140px;
	margin-left:-30px;
	 -webkit-user-select: none; /* Chrome, Opera, Safari */
    -moz-user-select: none; /* Firefox 2+ */
    -ms-user-select: none; /* IE 10+ */
    user-select: none; /* Standard syntax */
	text-align: right;
}
#resultat2{display:block;
width:200px;
height:20px;
position:absolute;
left:370px;
top:10px;
	font-family: 'Pangolin', cursive;
	color:white;
	text-shadow: 1px 1px 1px rgba(0, 0,0, 1);
font-size:1.0em;	
	
}
#medalj{display:block;
position:absolute;
left:675px;
top:130px;
width:220px;
height:0px;
	
	
	
	
}

#container{ position: relative; width:900px; height:500px;margin:auto;padding-top:5px}
a{display:block;
width:200px;
height:30px;
background-color:#666;
font-family:arial;
font-size:20px;
margin-top:30px;
text-decoration:none;
color:gray;
padding:5px;
padding-left:20px;
border-radius:7px;

-webkit-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
}

#myContainer {
  width: 900px;
  height: 400px;
  position: relative;
  background: grey;
  border-radius:7px;
  background-image:url("bilder/bak.png");

-webkit-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
margin-bottom:20px;
}
#myContainer2 {
   width: 900px;
  height: 100%;
  position:absulote;
  margin-top:20px;
 
  top:0px;
   left:0px;
  
  border-radius:7px;
  
   background-image:url("bilder/bak2.png");
  

}

#myContainer3 {
   width: 900px;
  height: 0px;
  position:absulote;
  top:-800px;
   left:0px;
  
  border-radius:7px;
  
  
  

}
#myAnimation {
  width: 168px;
  height: 65px;
  position: absolute;
 top:260px;
  left:0px;
 
}
#myAnimation2 {
  width: 52px;
  height: 52px;
  position: absolute;
  top:300px;
  left:95px;
   transform-origin: 50% 50%;
}
#myAnimation3 {
  width: 52px;
  height: 52px;
  position: absolute;
  top:300px;
  left:0px;
  /*-ms-transform: rotate(40deg); /* IE 9 */
   /* -webkit-transform: rotate(40deg); /* Chrome, Safari, Opera */
    /*transform: rotate(40deg);*/
  
}
#myAnimation4 {
  width: 40px;
  height: 40px;
  position: absolute;
  top:310px;
  left:800px;
  /*-ms-transform: rotate(40deg); /* IE 9 */
   /* -webkit-transform: rotate(40deg); /* Chrome, Safari, Opera */
    /*transform: rotate(40deg);*/
  
}
#instrument {
  width: 195px;
  height: 101px;
  position: absolute;
 top:160px;
  left:0px;
  visibility: hidden;
   background-image:url("bilder/speed.png");
 z-index:30;
}
#visare {
  width: 10px;
  height: 56px;
  position: absolute;
 top:190px;
  left:89px;
  visibility: hidden;
   background-image:url("bilder/visare.png");
 z-index:35;
 transform-origin: 50% 100%;
}

#logga {
  position: absolute;
  top:25px;
  left:25px;
  width:143px;
  height:0px;
 
}

#myProgress2 {
   position: absolute;
 top:510px;
  width: 900px;
  height: 10px;
  background-color: #ddd;
  border:1px black solid;
  border-radius:7px;
 

-webkit-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
}

#myBar2 {
  position: absolute;
  top:2px;
  width: 0px;
  height: 6px;
  background-color: #4CAF50;
   border-radius:7px;
opacity: 0.5;
}
#andra{
	position:absolute;
	top:475px;
	left:360px;
	display:block;
	margin-top:6px;
/* width:180px;
height:24px; */
/* background-color:#666; */
font-family: 'Patrick Hand', cursive;
font-size:0.9em;

text-decoration:none;
color:white;

padding-left:3px;
background-color:transparent;

border:none;

/* 
-webkit-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75); */
}

 #minskaknapp{
	position:absolute;
	top:470px;
	left:15px;
	display:block;
width:30px;
height:30px;
background-color:#888;
font-family:arial;
font-size:12px;

text-decoration:none;
color:white;

padding-left:3px;
border:none;
background-repeat:no-repeat;

border-radius:20px;
 /* background-color: Transparent; */

-webkit-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
}
#okaknapp {
	position:absolute;
	top:470px;
	left:140px;
	display:block;
width:30px;
height:30px;
background-color:#888;
font-family:arial;
font-size:12px;

text-decoration:none;
color:white;

padding-left:3px;
border:none;


border-radius:20px;


-webkit-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
}
#okaknapp:hover, #minskaknapp:hover {
	
	-webkit-box-shadow: 1px 3px 3px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 3px 3px 0px rgba(0,0,0,0.75);
box-shadow: 1px 3px 3px 0px rgba(0,0,0,0.75);
}
#startknapp{
	display:block;
	position:absolute;
	top:475px;
	left:64px;
margin-top:6px;
background-color:transparent;
font-family: 'Patrick Hand', cursive;
font-size:0.9em;
color:white;
text-decoration:none;
border:none;

padding-left:7px;
/* border-radius:8px; */


	
}


#lika{
	position:absolute;
	top:475px;
	left:720px;
	
	
	
	/* width:125px;
	height: 22px;
	
	-webkit-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75); */
	
	
}

#lagraglobal{
	position:absolute;
	top:136px;
	left:500px;
	
	background-color:#666;
font-family:arial;
font-size:12px;

text-decoration:none;
color:white;

padding-left:3px;
border-radius:8px;

-webkit-box-shadow: 1px 3px 3px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 3px 3px 0px rgba(0,0,0,0.75);
box-shadow: 1px 3px 3px 0px rgba(0,0,0,0.75);
	
	width:125px;
	height: 22px;
	
	-webkit-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
box-shadow: 4px 5px 21px 0px rgba(0,0,0,0.75);
	
	
}

#lagraglobal:hover{

color:red;

padding-left:3px;
border-radius:8px;

-webkit-box-shadow: 1px 3px 3px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 3px 3px 0px rgba(0,0,0,0.75);
box-shadow: 1px 3px 3px 0px rgba(0,0,0,0.75);
	
	width:125px;
	height: 22px;
	
	-webkit-box-shadow: 1px 3px 3px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 3px 3px 0px rgba(0,0,0,0.75);
box-shadow: 1px 3px 3px 0px rgba(0,0,0,0.75);
	
	
}



       