*{margin: 0;padding: 0;box-sizing: border-box;font-family: Verdana, Geneva, Tahoma, sans-serif;}
body{background-color: rgb(231, 233, 233);}
.header h1{text-align: center;background-color: rgb(31, 65, 160);padding: 15px;color: white;}
.navbar{background-color: black;padding: 10px;}
.navbar a{text-decoration: none;color: white;padding: 13px; }
.register{float: right;margin-top: -14px;}
.navbar a:hover{color: rgb(31, 65, 160);}
.fbox{border: 2px solid white;width: 100%;height: 65vh;margin-top: 10px;background-color: white;margin-left: 10px;}
.article{margin-top: 12px;margin-left: 10px;}
.article h3{font-size: 27px;}
.article h5{margin-top: 8px;}
.articleimg img{margin-left: 10px;width: 97%;border-radius: 15px;height: 40vh;margin-top: 14px;max-width: 100%;}
.ffooter{margin-left: 10px;}
.am{margin-top: 5px;font-weight: bolder;}
.sbox{width: 100%;height: 65vh;border: 2px solid white;margin-top: 13px;background-color: white;margin-left: 10px;}
.sarticle{margin-left: 10px;margin-top: 12px;}
.sarticle h5{margin-top: 6px;}
.sarticle h3{font-size: 27px;}
.sarticleimg img{width: 97%;border-radius: 15px;height: 40vh;margin-top: 14px;max-width: 100%;}
.sam{margin-top: 5px;font-weight: bolder;}
.row{display: flex;}
.leftside{width: 90%;float: left;}
.rightside{width: 10%;float: right;}
.rbox{margin-left: 24px;margin-top: 11px;border: solid 2px white;width: 115%;background-color: white;}
.o{height: 120px;width: 300px;border-radius: 15px;margin-top: 10px;max-width: 100%;}
.t{height: 120px;width: 300px;border-radius: 15px;margin-top: 5px;max-width: 100%;}
.th{height:120px;width: 300px;border-radius: 15px;margin-top: 5px;max-width: 100%;}
.latest{margin-left: 30px;margin-top: 20px;}
.ftitle{margin-top: 5px;}
.stitle{margin-top: 5px;}
.ttitle{margin-top: 5px;}
.srbox{border: 2px solid white;margin-top: 20px;margin-left: 24px;height: 155px;width: 115%;background-color: white;}
.writeup{margin-left: 7px;margin-top: 15px;}
.writeup h6{margin-top: 7px;}
.mainfooter h4{text-align: center;color: white;}
.mainfooter{background-color: rgb(44, 30, 41);padding: 15px;}

@media only screen and (max-width=550px){
    .header{
        grid-template-columns: 1fr;
        grid-template-rows: 0.4fr 0.3fr 2.4fr 5fr 1.3fr;
        .header{grid-area: header;}
        .fbox{grid-area: fbox;}
        .sbox{grid-area: sbox;}
        .rbox{grid-area: rbox;}
        .srbox{grid-area: srbox;}
        .mainfooter{grid-area: mainfooter;}
    }
}