@media screen and (min-width: 479px) and (max-width: 768px) {
.dotwrap .player input[type="text"] {
font-size: 20px!important;
} 
}
@media screen and (min-width: 0px) and (max-width: 479px) {
.dotwrap input[type="radio"] {
width: 14px!important;
height: 14px!important;
}
.dotwrap .space1 {
width: 20px!important;
height: 6px!important;
}
.dotwrap .space2 {
width: 6px!important;
height: 20px!important;
}
.dotwrap .space3 {
width: 20px!important;
height: 20px!important;
}
.dotwrap .player input[type="text"], .dotwrap .player {
font-size: 16px!important;
} 
}
body {
background-image: url("back.jpg");
background-attachment: fixed;
background-size: cover;
}
.dotwrap {
position: relative;
margin: 0 20px;
}
.dotwrap .logo {
width: 50%;
}
.dotwrap .space1 {
width: 25px;
height: 9px;
position: relative;
bottom: 1px;
}
.dotwrap .space2 {
width: 9px;
height: 24px;
position: relative;
left: -0.5px;
}
.dotwrap .space3 {
width: 25px;
height: 24px;
border-radius: 5px;
}
.dotwrap input[type="radio"] {
width: 22px;
height: 22px;
vertical-align: middle;
margin: -1px;
cursor: pointer;
}
.dotwrap .player input[type="text"] {
width: 35px;
margin: 0;
background: none;
color: #55e65b;
border: 0;
}
.dotwrap .player input[type="text"]:first-of-type {
margin-right: 25px;
}
.dotwrap .player input[type="text"], .dotwrap .player {
font-size: 20px;
font-weight: 900;
}
.dotwrap .player, .dotwrap .open-inst {
color: #dad9d9;
}
.dotwrap .game-btn {
background-color: #3a3a3a;
color: #dad9d9;
border: 2px solid #fff;
margin: 0 2px 5px 2px;
}
.dotwrap td {
text-align: center;
}
.dotwrap .score-board, .dotwrap  .instruct .text{
max-width: 500px;
}
.dotwrap .score-board {
margin-top: 50px;
color: #dad9d9;
border: 2px solid #fff;
}
.dotwrap .score-board td {
text-align: left;
}
.dotwrap .score-board tr:nth-child(even) {
background-color: #1f1e1e;
}
.dotwrap .score-board tr:nth-child(odd) {
background-color: #3a3a3a;
}