@media screen and (min-width: 479px) and (max-width: 799px) {
.match .inputs {
font-size: 17px!important;
} 
}
@media screen and (min-width: 479px) and (max-width: 599px) {
.match .squares img {
width: 65px!important;
height: 65px!important;
}
}
@media screen and (min-width: 0px) and (max-width: 479px) {
.match .squares img {
width: 40px!important;
height: 40px!important;
}
.match .inputs {
font-size: 14px!important;
} 
.match .inp2 {
width: 200px!important;
}
.match .note {
font-size: 12px!important;
}
}
body {
background-image: url("../../back/wood/wood1.jpg");
background-attachment: fixed;
background-size: cover;
font-family: Tahoma, Geneva, sans-serif;
}
.match {
position: relative;
margin: 0 20px;
}
.note {
margin: 0 auto 20px auto;
display: table;
font-size: 16px;
}
.match .match .squares {
padding-top: 20px;
}
.match .squares img {
width: 90px;
height: 90px;
padding: 4px;
filter: contrast(150%);
}
.match .inputs input[type="text"] {
height: 25px;
margin-bottom: 3px;
border: 0;
background: none;
color: #ccc7c7;
}
.match .inp1 {
width: 65px;
}
.match .inp2 {
width: 250px;
}
.match .inputs {
font-size: 20px;
padding: 10px;
color: #ccc7c7;
}
.match .game-btn {
background-color: #000;
color: #bbb;
border: 1px solid #808080;
}
.match .doscore .text,
.tohigh .text,
.tolow .text {
max-width: 400px;
}
.match .score-board {
max-width: 800px;
}
.match .score-board h4, .note {
color: #c7c3c3
}
.match .score-board tr:nth-child(even) {
background-color: #232222;
color: #c7c3c3;
}
.match .score-board tr:nth-child(odd) {
background-color: #414141;
color: #c7c3c3;
}