body{
    background-image: url(background_fireworks.gif);
    background-attachment:fixed;
    background-size: 10%;
}
#box1{
    border:rgb(0, 122, 0) 7px double;
    height:100px;
    width:1200px;
    margin:auto;
    margin-top:30px;
    padding:5px;
    background-color:rgba(6, 53, 14, 0.9);
}
marquee{
    font-size:15px;
    font-family:monospace;
    color:rgb(243, 219, 0);

}

#starsbars{
   margin-left: 370px;
}

#box2{
    background:linear-gradient(8deg, rgba(0,0,0,0.6) 12%, rgba(152,242,58,0.5) 100%);
    width:530px;
    height:460px;
    padding-left:15px;
    padding-right:15px;
    border: 3px solid #98F23A;
    border-radius: 30px 30px 30px 30px;
    margin-left:330px;
    font-size:20px;
    font-family:monospace
}

#box3{
    margin-left:950px;
    margin-right:300px;
    margin-top:-625px;
    margin-bottom:20px;
    border:solid;
    border-color:blue;
    border-style: double;
    width:525px;
    height:615px;
}

#box4{
    background-image: url(palmier.jpg);
    background-repeat:round;
    margin:auto;
    height:650px;
    width:1200px;
    border-radius: 30px 30px 30px 30px;
    font-family:monospace;
    font-style: italic;
    color:aquamarine
}

.gallery { /* this is the main div that wraps your gallery */
    display:flex;
    flex-wrap:nowrap;
    width:50px; /* this can be modified to make the gallery wider */
}

.gallery > div {
    margin-top:100px;
    margin-bottom:100px;
    margin-left:60px;
    margin-right:20px; /* this controls the gaps between the images */
    margin-bottom:20px; /* this controls the gaps between the images */
}

.gallery img{
    width:300px;
    border-style:groove;
}

.gallery img:hover {
    transform:scale(1.2); /* this scales up the image when you hover over it */
    object-fit:contain; /* this keeps the aspect ratio of the original images*/
}