a{
 text-decoration: none;
 color: #000000;
}

body{
 font-family: arial;
 background-color: #777777;
 color: #ffffff; 
}

.nummer{
 height: 480px;
 width: 500px;
 border-radius: 500px;
 font-size: 400px;
 padding-top: 20px;
 text-align: center;
 float: left;
 border: #000000 3px solid;
 margin-left: calc(50% - 490px);
}  

.nummerklein{
 height: 48px;
 width: 50px;
 border-radius: 500px;
 font-size: 35px;
 padding-top: 2px;
 text-align: center;
 margin: 0 auto;
 float: left;
 margin: 5px 5px 5px 5px;
 border: #000000 1px solid;
} 

.neuesSpiel{
 height: 48px;
 width: 50px;
 border-radius: 500px;
 font-size: 35px;
 padding-top: 2px;
 text-align: center;
 margin: 0 auto;
 float: left;
 margin: 5px 5px 5px 5px;
 border: #000000 1px solid;
}   

.Spielende{
 font-size: 150px;
 width: 800px;
 height:200px;  
}

.neu{
 width: 300px;  
}

.wrapper{
 margin-top: 40px;  
 height: 510px;
 overflow: hidden;
}

.spielplan{
 margin-top: 150px;  
 height: 185px;
 width: 185px;
 border: #000000 2px solid;
 padding-top: -5px;
 overflow: hidden;
}

.gezogen{
 height: 185px;
 width: 100%;
}

.aktuell{
 height: 32px;
 padding-top: 3px;
 width: 35px;
 border-radius: 30px;
 border: #000000 1px solid;
 background-color: #ffffff;
 text-align: center;
 font-weight: bold;
 font-size: 24px;
 
} 

/*###############################################################*/
/*###################### Schiffe versenken ######################*/
/*###############################################################*/
 
h1{
 color: rgb(0, 204, 255);
}

.OceanWrap{
 height: 475px;
 width: 1110px;  
 margin: 0 auto;
}

.ocean{
 height: 440px;
 width: 440px;
 margin: 30px 30px 30px 30px;
 float: left;
}

.feld{
 height: 40px;
 width: 40px;
 float: left;
 border: #00aaaa 1px solid;
 text-align: center;
 font-size: 37px;
 background-color: #00ffff;
 background-repeat: no-repeat;
 background-size: 100% 100%;
}

#schussICON{
 float: left;
 width: 100px;
 height:100px;
 margin: 15% 5px 0px 0px; 
 background-size: 100% 100%; 
}

.daneben{
 background-image: url('../img/sv/daneben.gif');
}

.schiff{
 background-image: url('../img/sv/schiff.gif');
}  

.getroffen{
 background-image: url('../img/sv/getroffen.gif');
}  

.nix{
 background-image: url('../img/sv/nix.gif');
} 

.rot{
 border: #ff0000 1px solid;
}

.gruen{
 border: #008400 1px solid;
}

.schuss{
 height: 40px;
 width: 40px;
 border-radius: 20px;
 border: #000000 1px solid;
}    

.feldimg{
 width: 40px;
}

@media screen and (max-width: 800px) {

 .ocean{
  height: 270px;
  width: 270px;
  margin: 5px 5px 5px 5px;
 }
 
 .feld, .schuss{
  height: 25px;
  width: 25px;
 }

}