main2.css

#navbar{
    background-image: linear-gradient(to right ,rgb(47, 43, 43) , rgb(93, 88, 88) , rgb(47, 43, 43));
    
    height: 26rem;
    /* rgb(82 81 82) */
    width: 100%;
}
.centre{
    /* position: absolute; */
    text-align: center;
    padding: 0.5rem;
}
.heading{
    color: white;
    font-size: 2.5rem;
    font-style: italic;
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}
#small{
    font-size: 1.1rem;
    color: rgb(181, 172, 172) ;
}
.button{
    height: 2rem;
    background-color: rgb(81, 78, 78);
    color: aliceblue;
    margin: 1.1rem;
    border: none;
    border-radius: 0.5rem;
}
/* flexboxes */

.firstpart{
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.firstpage{
    overflow: hidden;
    max-width: 600px;
    position: relative;
    display: flex;
    padding: 1rem;
    margin: 1rem;
}
.smboxes{
    border: 1px solid black;
    margin: 1rem;
    padding: 0.5rem; 
    width: 27rem;
    height: 22rem;
    border-radius: 1rem;
}
.smboxes img{
    position: relative;
    height: 13rem;
    width: 24rem;
    object-fit: cover;
}
.firstpage .smboxes--hidden {
    display: block;
}
.firstpage .smboxes--visible{
    display: block;
}
.firstpage .contest__actions {
    display: flex;
    width: 100%;
    justify-content: space-between;
    position: absolute;
    top: 50%;
}
.firstpage .contest__actions button {
    border-radius: 50px;
    border: 0;
    font-weight: bold;
    cursor: pointer;
    width: 40px;
    height: 40px;
}
.firstpage .contest__actions button #contest__actions--prev{
    margin-left: 20px;
}

.firstpage .contest__actions button #contest__actions--next{
    margin-left: 20px;
}