@media screen and (min-width: 599px) and (max-width: 799px) {
.simon-wrap .zimg {
width: 60px!important;
height: 60px!important;
} 
}
@media screen and (min-width: 0px) and (max-width: 599px) {
#but1,
#but8,
#but2,
#but7,
#but3,
#but6,
#but4,
#but5 {
border-width: 2px;
}
.simon-wrap .disp1a, .simon-wrap .disp2a {
font-size: 12px!important;
}
}
@media screen and (min-width: 321px) and (max-width: 599px) {
.simon-wrap .zimg {
width: 45px!important;
height: 45px!important;
} 
}
@media screen and (min-width: 0px) and (max-width: 321px) {
.simon-wrap .zimg {
width: 30px!important;
height: 30px!important;
} 
}
body {
background-image: url("../../back/misc/tx4.jpg");
background-attachment: fixed;
}
.simon-wrap {
margin: 0 20px;
position: relative;
}
.simon-wrap .logo2 {
width: 35%;
}
.simon-wrap .glyphicon-question-sign {
color: #500088;
}
.simon-wrap .zimg {
width: 80px;
height: 80px;
margin: 0 2px 10px 2px;
}
.simon-wrap .disp1a, .simon-wrap .disp2a {
height: 25px;
color: #000;
font-size: 16px;
font-weight: bold;
text-align: center;
text-transform: uppercase;
}
.simon-wrap .game-btn, .simon-wrap select {
background-color: #500088;
color: #fff;
}
.simon-wrap .score-board {
max-width: 500px;
border: 3px solid #500088;
border-radius: 4px;
}
.simon-wrap .score-board tr:nth-child(even) {
background-color: #d5e7f9;
}
.simon-wrap .score-board tr:nth-child(odd) {
background-color: transparent;
}
.goodscore, .tolow {
position: relative;
margin: 20px;
height: 200px;
}
.goodscore .text, .tolow .text {
max-width: 450px;
font-size: 15px;
}
.simon-wrap .note .text {
max-width: 600px;
}
#but1,
#but8,
#but2,
#but7,
#but3,
#but6,
#but4,
#but5 {
border-style: solid;
border-width: 5px;
border-radius: 5px;
}
#but1 {
border-color: #ff00ff;
}
#but8 {
border-color: #00ffff;
}
#but2 {
border-color: #6805ad;
}
#but7 {
border-color: #ff0000;
}
#but3 {
border-color: #00ff00;
}
#but6 {
border-color: #dd6301;
}
#but4 {
border-color: #0000ff;
}
#but5 {
border-color: #ffff00;
}