.box {
    width: 55%;
    max-width: 1000px;
    margin:auto;
    border: #000000 2px solid;
    border-top-right-radius: 20px ;
    border-top-left-radius: 20px ;
    border-style: solid;
    border-color: #00638f;
    background-color: #000000;
    padding: 10px;
    border-top-right-radius: 20px ;
    border-top-left-radius: 20px ;

    margin:auto;
    display: grid;
    grid-gap: 10px;
    padding-top: 10px; 
    padding-bottom: 10px; 
}






header, main, footer, main2 {
    border: #000000 2px solid;
    border-radius: 0px;
    border-style: solid;
    border-color: #00638f;
    background-color: #00648f76;
    
}




header {
    border-top-right-radius: 20px ;
    border-top-left-radius: 20px ;
    height: 115px;
    background-image: url("https://files.catbox.moe/61x5xr.png");
    background-size: 100%;
}

main2 {
    margin-top: 15px;
    height: 525px;
    overflow-y: scroll; 
    scrollbar-width: thin;
    scrollbar-color: #00638f #000000;
}



body::before {
    content: " ";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: linear-gradient(rgba(3, 17, 31, 0.825) 50%, rgb(0 0 0 / 0%) 50%);
    z-index: 2;
    background-size: 100% 2px, 3px 100%;
    pointer-events: none;
}





body::-webkit-scrollbar {
  width: 12px;               
}

body::-webkit-scrollbar-track {
  background: black;       
}

body::-webkit-scrollbar-thumb {
  background-color: #00638f;  
  border-radius: 20px;  
  border: 3px solid black;  
}


.skeleton {
    float: left;
    position:fixed;top: 0px; z-index: 300; left: 25px;
}