html, body{
height:100%;
font-size:15px;
color: #555;
}
main{
max-width:1300px;
margin: auto;
height: 100%;
}
section.login{
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
height: 100%;
}
section.login div{
border: 1px solid #ccc;
border-radius: 8px;
width:350px;
padding:40px;
-webkit-box-shadow: 0px 0px 23px 10px rgba(0,0,0,0.15);
-moz-box-shadow: 0px 0px 23px 10px rgba(0,0,0,0.15);
box-shadow: 0px 0px 23px 10px rgba(0,0,0,0.15);
}
main input[type="text"], main input[type="date"], main input[type="time"], main input[type="password"]{
width:100%;
box-sizing: border-box;
padding:10px;
outline:none;
border-radius: 8px;
border:1px solid #ccc;
}
main input[type="time"]{
margin-top:5px;
}
section.login img{
width:250px;
margin-bottom:20px;
}
main button{
width:100%;
padding:10px;
border: 1px solid transparent;
border-radius: 8px;
letter-spacing: 1px;
cursor: pointer;
font-size:16px;
color: #fff;
margin-top:5px;
background: #012550;
}
main a{
text-decoration: none;
color:#012550;
}
.ms {
border-collapse: collapse;
width: 100%;
font-size:14px;
margin-top:25px;
}
.ms td, .ms th {
border: 1px solid #ddd;
padding: 5px;
}
.ms tr:nth-child(even){background-color: #f2f2f2;}
.ms tr:hover {background-color: #ddd;}
.ms th {
text-align: left;
background-color: #012550;
color: #fff;
}
.fw{
display:grid;
grid-template-columns: repeat(5, 1fr);
grid-gap:25px;
}
ul.scrshts{
display:grid;
grid-template-columns: repeat(3, 1fr);
grid-gap:15px;
list-style-type: none;
padding: 0;
}
ul.scrshts li{
text-align:center;
}
ul.scrshts li img{
width:100%;
height:50px;
object-fit:cover;
display: block;
}
.rep_wrap{
width:100%;
max-width:500px;
margin:30px auto;
font-size:18px;
}
.rep_wrap .sshs img{
width:100%;
height:auto;
display:block;
margin-top:15px;
border:1px solid #ddd;
}
.sshs{
margin-top:15px;
}
@media screen and (max-width: 850px) {
    .fw {
      grid-template-columns: 100%;
      grid-gap:5px;
    }      
}
@media screen and (max-width: 450px) {
    .ms {
    font-size:12px;
    }
    .ms td, .ms th{
    word-break: break-all;
    }
    ul.scrshts{
    grid-gap:5px;
    }
}