body{
    background-color: #f2f4f8;
}

main{
    max-width: 1248px;
    margin: 30px auto;
}


/* Login Page */

.login {
    background-color: white;
    margin: 20vh auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px;
    border-radius: 10px;
    width: 50%;
}

/* End Login Page */

/* index.html */

.concerts{
    display: flex;
    flex-wrap: wrap;
    gap: 50px;
}

.concert{
    width: 256px;
}

.concert img{
    width: 100%;
}

.concert a{
    color: black;
    text-decoration: none;
    transition: 0.3s;
    font-weight: bold;
}

.concert a:hover{
    color: #0d6efd ;
    text-decoration: none;
}

.concert .description{
    font-size: 14px;
}

/* Concert Page */
.concert_details{
    display: flex;
    align-items: center;
}

.concert_details .concert_image{
    width: 300px;
}

.concert_details .concert_image img{
    width: 100%;
}



@media (max-width: 768px) {
    .concert_details{
        flex-direction: column;
    }

    .concert-modal{
        width: 100% !important;
        margin: 0;
    }

   

    #show_concert-modal .booking_details{
        display: flex;
        flex-direction: column;
    }

    .sector_info {
        display: flex;
        width: 100%;
        flex-direction: column;
    }

    .login {
      width: 90%;
    }
  
    .login div {
      width: 100% !important;
    }
  }