#mainContainer{
    padding-top: 20px;
    display:grid;
    gap:20px;
    row-gap: 20px;
    grid-template-columns: 32% 32% 32% ;
    grid-row-start: auto;
    margin-bottom: 30px;
    margin-top: 20px;
}


.notice{
    font-family: 'Poppins';
    padding:20px;
    background-color: #0a1535;
    border-radius: 10px;
    color: #fff;
    font-family: sans-serif;
    margin-bottom: 1%;
    position: relative;
    padding-bottom: 58px;;
}

section #error{
    color: red;
    font-size:large;
}

.notice a img{
    width:100%;
    object-fit: cover;
    height:350px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;

}

.notice h2{
    font-family: 'Poppins';
    font-size: x-large;
    font-weight: 600;
    padding-bottom:10px;
    border-bottom: 2px solid #fff;
}

.notice p{
    font-family: 'Poppins';
    padding-top:16px;
}

.notice span{
    position: absolute;
    font-family: 'Poppins';
    padding-top:8px;
    bottom:10px;
    border-top: 2px solid #fff;
    width:90%;

}

@media only screen and (max-width: 900px) {
    #mainContainer{
        display:grid;
        gap:20px;
        grid-template-columns: 48% 48% ;
        grid-row-start: auto;
    }
  }

  @media only screen and (max-width: 550px) {
    #mainContainer{
        display:grid;
        gap:20px;
        grid-template-columns: auto ;
        grid-row-start: auto;
    }
  }