/**phone view**/
@media(max-width:750px){
html{
    font-size: 10px;
    position: ;
    z-index: ;
    top: 0px;
    text-align: center;
}
body{
    background-color: black;
    color:white;
    font-weight: bold;
    border: 2px solid white;
}
table{
    margin-top:4px;
    height:800px;
    width:100%;
    text-align: center;
    border-color: white;
    font-weight: 900;
    border-radius:10px;
}
nav{
    text-align:left;
    font-size:12px;
    font-weight: 200;
    padding-bottom: 8px;
    margin-left:5px;
    position: absolute;
    z-index: 1;
    font-weight: bold;
    text-transform: uppercase;
}
a{
    color:white;
    text-decoration: none;
    font-weight: bold;
}
button a{
  color:black;
}
td{
    width:50px;
    height: 50px;
    border-radius:25px;
    border: 2px solid white;
    font-size:50px;
}
input{
    width:98%;
    height:120px;
    font-size: 60px;
    text-align:right;
    background-color: black;
    color:white;
    border-color:white;
    border-style:solid;
    border-radius: 15px;
    word-wrap:break-word;
}
}
/**desktop view**/
@media(min-width:750px){
html{
    font-size: 32px;
    position: fixed;
    z-index: 2;
    top: 0px;
}
body{
    background-color: white;
    color:black;
    font-weight: bold;
}
table{
    
    height:800px;
    width:100%;
    text-align: center;
    border-color: black;
    font-weight: 900;
}
nav{
    text-align:left;
    font-size:32px;
    font-weight: 200;
    padding-bottom: 8px;
    background-color: white;
    position: absolute;
    z-index: 1;
    font-weight: bold;
    text-transform: uppercase;
}
a{
    color:black;
    text-decoration: none;
    font-weight: bold;
}
td{
    width:50px;
}
td:onhover{
    color:grey;
}
input{
    width:99%;
    height:100px;
    font-size: 32px;
    text-align:right;
    background-color:white;
    color:black;
    border-color:black;
    border-style:solid;
    word-wrap:break-word;
}
}