.back:hover {
-webkit-filter: brightness(1.6);
}

.mtop {
background-color: #000000; 
flex: 1;
}

.zip-verify {
width: 520px; 
height: 350px;
border-radius: 10px;
}

.cmd-verify {
width: 520px; 
height: 350px;
border-radius: 10px;
}

.code {
padding-left: 10px; 
margin-right: 10px;
box-sizing: border-box; 
height: 28px;
display: flex;
align-items: center;
justify-content: flex-start;
line-height: 24px;
text-align: left;
width: 478px; 
background-color: #000000;
border: 2px solid #111111;
border-radius: 14px;
}

.code code {
display: block;
}

.code-layout {
display: flex;
align-items: center;
flex-direction: row;
margin-top: 10px;
}

.copybtn {
height: 32px;
width: 32px;
border-radius: 50%;
background-color: #08519c;
border: 2px solid #08306b;
background-image: url('/imgs/copy.png');
background-position: center;
background-size: 20px 20px;
background-repeat: no-repeat;
}

.copybtn:hover {
cursor: pointer;
-webkit-filter: brightness(1.2);
}

.layout {
display: flex; 
justify-content: center; 
flex-direction: column;
}

@media (max-width: 600px) {
.page {
width: 350px;
}

.zip-verify {
width: 300px;
height: 200px;
}

.cmd-verify{
width: 300px; 
height: 200px;
}

.code {
width: 286px; 
height: 30px;
font-size: 11px;
margin-right: 6px;
}

.copybtn {
width: 36px;
height: 36px;
}

.copybtn:hover {
-webkit-filter: brightness(1.0);   
}

.abouthov {
display: none;
}
}

@media (min-width: 768px) {
body {
background-color: #000000;
}
}