.banner img{
    height: 55vh;
    width: 100%;
}
.plans-title{
    padding: 1em 7em;
}
.plans{
    display:grid;
    grid-template-columns: repeat(4,1fr);
    grid-gap: 2em;
    margin-bottom: 2em;
}
.plan-card{
    color: white;
    padding: 1em;
    border:none;
    border-radius: 5px;
    background-color: #986620;
    text-align: center;
}
.book-form{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-gap:3em;
    padding: 1em 7em;
    
}

.input-field{
    padding:1em;   
    border:none;
    border-bottom: 2px solid black; 
    font-size: 1em;
}

.card-option{
    display: flex;
    justify-content: space-between;
}

.type-ticket{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-gap:3em;
}
.payment-card{
    width:90px;
    height: 75px;
}
.submit-button{
    grid-column-start: 1;
    grid-column-end: 3;
    width:40%;
    justify-self:center;
    padding: 1em;
    border-radius: 10px;
    border: none;
    background-color: #986620;
    font-size: 1.5em;
    color: white;
}

@media (max-width: 768px){
    .plans{
        grid-template-columns: repeat(2,1fr);
    }
    .book-form{
        display: block;
    }
    .input-field{
        width: 100%;
        margin-top: 1em;
    }
    .submit-button{
        width: auto;
        margin-top: 1em;
        display: block;
        grid-column-start: none;
    grid-column-end: none;
    }
}


@media (max-width: 596px){
    .plans-title {
        padding: 1em 2em;
    }
    .payment-card{
        width: 75px;
    }
        
    
}