 html{
position:relative;
height:100%;
min-height:100%
}
main{
    width: 900px; height: auto;
    margin: auto; padding: 0 80px;
}
header{
    width: 900px; height: 170px;
    margin-left: 100px;
    margin-right: ;
    background-image: url(https://i.postimg.cc/nVW4s1nX/Whats-App-Image-2025-09-27-at-4-05-53-PM.jpg);
    background-repeat: no-repeat;
    background-size: 700px 140px
}
body{
margin:0;
background: url(https://foollovers.com/mat/simple/v16-bg-simple.gif), linear-gradient(0deg,rgb(0, 0, 10) 70%, rgba(4, 4, 148, 1) 100%);
background-attachment: fixed;
font:15px 'Fredoka';
color:#E6E6E6;
}
p{color:#E6E6E6; text-align: justify; font: 12px 'Roboto Slab'}
::selection{background:transparent;color:#FBFF42}
#content{
    width: 900px;
    padding: 20px;
    margin: auto;
    background: #020024;
    background:  url(https://foollovers.com/mat/t-frame/frame05/back01.gif), url(https://foollovers.com/mat/t-frame/frame05/back01.gif), linear-gradient(0deg,rgba(3, 3, 107, 1) 36%, rgba(0, 0, 0, 1) 100%, rgba(3, 3, 107, 1) 30%);
    background-position:left top,right top;
    background-repeat:repeat-y,repeat-y;
    border: 1px double #ffe600;
    border-radius: 10px;
}
#subtitle{
    margin: 0 0 15px 0; 
    text-align: left;
    font-family: Fredoka;
    font-weight: 780;
    font-size: 20px;
    color: #1c26b4;
   text-shadow: 0px 0px .2px #ffe600, 1px 1px .2px #ffe600, -1px -1px .2px #ffe600, -1px 1px .2px #ffe600, 1px -1px .2px #ffe600
}
#navigation{width: 100%; margin: 0}
#navigation button{
    margin-left: 4px; padding: 8px;
    background-color: transparent;
    font:15px 'Roboto Slab';font-weight:600; 
    color:#E6E6E6;
    border-radius: 10px 0 10px 0;
    cursor: pointer
}
#yellow{border:2px solid #ffe600;&:hover{background-color:#ffe600}}
#blue{border:2px solid #1c26b4;&:hover{background-color:#1c26b4}}

div.gallery {
margin: 45px;
border: 2px double #FBFF42;
border-radius: 10px 10px 10px 10px;
background-color: transparent;
}
div.gallery:hover{
    margin: 45px;
    border: 2px double #1c26b4;
    border-radius: 10px 10px 10px 10px;
    background: #FBFF42;
    cursor: pointer;
    color: #1c26b4
}
div.gallery img{
    width: 100%;
    height: auto;
    border-radius: 10px 10px 10px 10px;
}
div.desc{
    padding: 20px;
    text-align: center;
    font: 'Fredoka';
    font-size: 15px;
}
*{
    box-sizing: border-box;
}
.responsive{
    padding: 0 6px;
    float: left;
    width: 24.99999%
}
@media only screen and (max-width:500px){
    .responsive{
        width: 100%;
    }
}
.clearfix:after{
    content: "";
    display: table;
    clear: both;
}