.section1{
    background-color: rgba(10, 0, 0, .05);
}
.col-8 > div, .col-4 > div{
    background-color: #fff;
}

.col-8{
    padding: 15px;
}
.col-4{
    padding: 15px;
}

h5{
    background: -webkit-linear-gradient(right, rgba(0, 8, 53,.95), #b8017b);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.ticket-details, .traveller-details, .seat-map, .price-details, .coupon-code{
    margin-top: 15px;
    margin-bottom: 15px;
    padding: 13px;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, .15);
    overflow: hidden;
}

.col-8 > div > hr, .col-4 > div > hr{
    margin: 0px -13px;
    border-top: 0.5px solid rgba(0,0,0,.1);
}
.ticket-details-div{
    margin: 13px 10px;
}

.time-details > div{
    text-align: center;
}

.time-details{
    margin-right: 25px;
    margin-left: -25px;
}
.brand{
    font-weight: 600;
}
.plane-name{
    color: #4a4a4a;
    font-size: .8em;
}
.time{
    font-size: 1.4em;
    font-weight: 600;
}
.duration{
    border-bottom: 0.7px solid #9f9f9f;
    font-size: .9em;
    color: #454545;
}
.date, .place, .airport{
    font-size: smaller;
}
.date{
    font-size: 1em;
    font-weight: 600;
    color: #454545;
}
.place{
    color: #4a4a4a;
    font-size: .8em;
    font-weight: 600;
}
.airport{
    color: #4a4a4a;
    font-size: .8em;
}
.baggage-details{
    font-size: .8em;
    color: grey;
    padding-top: 13px;
}

.each-traveller{
    justify-content: space-between;
    margin: 13px 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .15);
    padding: 8px 17px;
    border-radius: 10px;
}
.traveller-head{
    display: flex;
    justify-content: space-between;
}
.traveller-head h6{
    color: darkgreen;
    padding-top: 2px;
}
.add-traveller{
    /*margin: 13px;*/
    padding-top: 13px;
}
.add-traveller-btn{
    color: blue;
    padding: 0;
    font-size: .9em;
}
.add-traveller-btn:hover{
    color: blue;
}
.add-traveller-btn:focus, .add-traveller-btn:active{
    box-shadow: none;
}
.traveller-name{
    font-weight: 600;
}
.delete-traveller button{
    padding: 0;
}
.delete-traveller button:focus, .delete-traveller button:active{
    box-shadow: none;
}
.delete-traveller button:hover{
    color: red;
}

.contact-details-div{
    margin: 13px 10px;
    padding: 10px;
    flex-flow: column;
}
.contact-details form{
    flex: 1;
}
.ci{
    font-weight: 400;
    color: #4a4a4a;
    font-size: .9em;
}
.cd{
    font-weight: 550;
}
.send-email{
    font-size: .87em;
    color: grey;
    padding-top: 13px;
}
.add-traveller-div{
    border: 1px solid lightgrey;
    border-radius: 5px;
    margin: 13px 10px;
    padding: 10px;
    flex-flow: column;
}
.add-traveller-div form{
    flex: 1;
}
.note-name{
    font-size: .9em;
    margin-bottom: 9px;
}
.note-name span{
    font-weight: 600;
}
.radio-div > div{
    padding-left: 15px;
}

.seat-map{
    display: flex;
    justify-content: space-between;
}
.seat-map-label{
    margin-left: 10px;
    margin-right: 10px;
    display: flex;
    margin-top: auto;
    margin-bottom: auto;
}
.payment-btn{
    display: flex;
    justify-content: center;
}

.base-fare, .surcharges, .other-service, .total-fare{
    margin: 13px 10px;
    justify-content: space-between;
    font-weight: bold;
}
.base-fare-value, .surcharges-value, .other-service-value{
    font-size: 1.1em;
}
.total-fare{
    font-size: 1.3em;
    padding-top: 13px;
    display: flex;
    margin: 0px;
}



.media-payment-btn{
    display: none;
}
.media-payment-btn > div{
    display: flex;
    justify-content: center;
}

.media-airline{
    display: none;
}
.media-airline > div{
    display: flex;
    text-align: left;
    margin-top: 13px;
}
.media-airline > div > div{
    margin-top: auto;
    margin-bottom: auto;
}



@media (max-width: 376px) {
    .container-fluid{
        background-color: rgba(10, 0, 0, .05);
    }
    .section1{
        background-color: transparent;
    }
    .section{
        padding-top: 0;
    }
    .main-row{
        display: block;
        margin-left: 0;
        margin-right: 0;
    }
    .main-row > div{
        max-width: 100%;
        padding: 0;
    }
    .main-row > div > div{
        border-radius: 0;
    }
    .payment-btn{
        display: none;
    }
    .media-payment-btn{
        display: block;
    }
    .contact-details-div{
        margin: 0;
        padding: 0;
    }
    .contact-details-div > div{
        display: block;
    }
    .contact-details-div > div > div{
        max-width: 100%;
        width: 100%;
        margin-top: 10px;
    }
    .individual-traveller-div .each-traveller{
        margin-left: 0;
        margin-right: 0;
    }
    .individual-traveller-div .add-traveller-div{
        margin-left: 0;
        margin-right: 0;
    }
    .individual-traveller-div .add-traveller-div-name{
        display: block;
    }
    .individual-traveller-div .add-traveller-div-name > div{
        margin-top: 10px;
    }
    .price-details > .row{
        margin-left: 0;
        margin-right: 0;
    }
    .price-details{
        margin-top: 0;
    }
    .coupon-code .base-fare{
        margin-left: 0;
        margin-right: 0;
    }
    .coupon-apply{
        padding-right: 0!important;
    }
    .ticket-details-div{
        margin-left: 0;
        margin-right: 0;
        margin-top: 5px;
        justify-content: space-between;
    }
    .ticket-details-div > .airline-name{
        display: none;
    }
    .ticket-details-div .depart-time{
        max-width: 36%;
        width: 36%;
        flex: auto;
    }
    .ticket-details-div .arrival-time{
        max-width: 36%;
        width: 36%;
        flex: auto;
    }
    .ticket-details-div .time-details{
        margin-left: 0;
        margin-right: 0;
        width: fit-content;
        width: 28%;
        max-width: 28%;
        flex: auto;
        justify-content: center;
        padding-left: 5px;
        padding-right: 5px;
    }
    .ticket-details-div .airport{
        
    }
    .ticket-details-div .time-details{
        display: flex;
    }
    .ticket-details-div .time-details > div{
        margin-top: auto;
        margin-bottom: auto;
    }
    .ticket-details-div .time{
        font-size: 1.4em;
    }
    .ticket-details-div .depart-time{
        padding-left: 0;
        padding-right: 10px;
    }
    .ticket-details-div .arrival-time{
        padding-left: 10px;
        padding-right: 0;
        text-align: right;
    }
    .ticket-details-div .ddate{
        font-size: .9em;
        font-weight: normal;
        color: black;
    }
    .ticket-details-div .adate{
        font-size: .9em;
        font-weight: normal;
        color: black;
    }
    .round-seperator > hr{
        border-top: 1px dashed rgba(0,0,0,.5) !important;
    }
    .media-airline{
        display: block;
    }
}