html {
}
body {

    vertical-align: middle;
    background-color: black;
    color: white;
    text-align:center;
   
}

#key{
    width:150px;
    height:166px;
}

#container {
    
}
#shipSelect{
    background-color:#aaaaaa;
    margin:auto;
    width:475px;
    color:black;
    height:72px;
}
#shipSelect p{
    display:inline-block;
    margin:10px;
    cursor:pointer;
}
#shipSelect p:hover{
    color:green;
}
#rotateShipButton{
    display:inline-block;
    margin-bottom: 5px;
    background-color: #ffffff;
    cursor: pointer;
    border: solid 2px #cccccc;
    padding: 5px 5px;
    color:#000000;
}
#humanStartGameButton{
    display:inline-block;
    margin-bottom: 5px;
    background-color: #ffffff;
    cursor: pointer;
    border: solid 2px #cccccc;
    padding: 5px 5px;
    color:#000000;
}
#startButton{
    display:inline-block;
    margin-bottom: 5px;
    margin-left:5px;
    background-color: #ffffff;
    cursor: pointer;
    border: solid 2px #cccccc;
    padding: 5px 5px;
    color:#000000;
}
.boardLabel{
    font-size:14px;
    height:30px;
    color:white;
    width:300px;
    margin:0px;
}
select:disabled {
    color: whitesmoke;
    background-color: darkgray;
}
.board{
    font-size:0;
    display:flex;
    margin:15px;
    display:inline-block;
    width:300px;
    height:330px;
}
.row{
    display:inline-block;
    width:300px;
    height:30px;
}
.square{
    width:26px;
    height:26px;
    border:2px outset;
    display:inline-block;
    background-color:#aaaaaa;
}

.toggle-up{
    background-color: #ffffff;
    cursor: pointer;
    border: solid 2px #cccccc;
    padding: 5px 5px;
    color:#000000;
}
.toggle-down{
    background-color: #000000;
    cursor: pointer;
    border: solid 2px #cccccc;
    padding: 5px 5px;
    color:#ffffff;
}
#toggleAI{
    display:inline-block;
}
#toggle{
    display:inline-block;
    margin:5px;
    width:135px;
    
}
#resetButton{
    display:inline-block;
    margin:5px;
    width:135px;
    background-color: #ffffff;
    cursor: pointer;
    border: solid 2px #cccccc;
    padding: 5px 5px;
    color:#000000;
}
#aiset{
    background-color:#aaaaaa;
    margin:auto;
    width:475px;
    color:black;
    height:72px;
}
#startButton{
    margin-bottom:10px;
}
#aiset label{
    margin-bottom:10px;
}
#AIspeed{
    margin:10px 10px 0px 10px;
}
h1{
    margin:auto;
}