.form-div {
    border-radius: 5px;
    border: 1px solid #e8e8e8;
    padding: 5px 0px 5px 10px;
}

a.signup {
    text-decoration: none;
    color: #fff;
}
a.signup:hover {
    text-decoration: none;
    color: orange;
}

.btn-sms {
    padding:0;
    background:none;
    color:#fff;
    border:none;
    text-align:start;
}


.intro_pic {
    text-align: center;
    object-fit:cover;
    border-radius:50%;
}
#splash .driver_name, .driver_info {
    color: #fff;
    font-weight: 400;
}
.driver_lang {
    color:hsla(0, 0%, 100%, 0.8);
    font-size: 0.8rem;
    font-weight:300;
    background-color: hsla(0, 0%, 0%, 0.3);
    border-radius: 10px;
    padding:5px 10px 5px 10px;
    text-align: center;
    align-items: center;
    border: none;
}

#profile-screen {
    position:fixed;
    top:0;
    left:0;
    padding:0;
    margin:0;
    width:100%;
    height:100%;
    background: #151515cc;
    backdrop-filter: overlay(30%);

    z-index:-5;
}

#hero-screen {
    position:fixed;
    top:0;
    left:0;
    padding:0;
    margin:0;
    width:100%;
    height:100%;
    background: #151515cc;
    backdrop-filter: brightness(50%);
    z-index:-5;
}

@media only screen and (max-width:767px) {
    #hero-screen {
        opacity: 0.9;
    }
    .bookbtn, .infobtn {
        font-size: 1rem;
    }
    .banner1_sm {
        display: block;
    }
    .banner1_lg {
        display: none;
    }
    .intro_pic {
        max-width: 140px;
    }
    #splash .driver_name {
        font-size:2.1rem;
    }
    #splash .driver_info {
        font-size: 1rem;
    }
    #splash h4.driver_intro {
        text-align: center;
        font-size: 0.9rem;
        font-style: italic;
    }
    .splashbox {
        position: relative;
        right: 0;
        width: 100%;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 2;
        color: #fff;
        transform: translateY(20px);
        transition: 1s;
        text-shadow: 2px 2px 4px #00000050;
    }
    .heroslide {
        filter:blur(2px);
    }
}
@media only screen and (min-width:768px) {
    #hero-screen {
        opacity: 0.2;
    }
    .bookbtn, .infobtn {
        font-size: 1.1rem;
    }
    .banner1_sm {
        display: none;
    }
    .banner1_lg {
        display: block;
    }
    .intro_pic {
        max-width: 180px;
    }
    #splash .driver_name {
        font-size:2.5rem;
    }
    #splash .driver_info {
        font-size:1.2rem;
    }
    #splash h4.driver_intro {
        text-align: center;
        font-size: 1rem;
        font-style: italic;
    }
    .splashbox {
        position: relative;
        right: 0;
        width: 100%;
        text-align: start;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 2;
        color: #fff;
        transform: translateY(20px);
        transition: 1s;
    }
    .heroslide {
        filter:blur(0px);
    }
}

.sectiontitle {
    color:orange;
    text-transform:uppercase;
    font-size:0.8rem;
    letter-spacing:4px;
    padding:30px;
}


    #splash .splashbox {
        height: 100vh;
        visibility: hidden;
        opacity: 0;
        transform: translateY(100px);
        transition: transform 1s, opacity 1s;
        transition-delay: calc(var(--index) * 200ms);
    }

    #splash.animate .splashbox {
        visibility: visible;
        opacity: 1;
        transform: translateY(0px);
    }


    .hero-back {
        width:100%;
        height:100vh;
        position:fixed;
        top:0;
        left:0;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        overflow: hidden;
        z-index: -15;
    }

    .heroslide {
        position:fixed;
        width: 100%;
        height: 100vh;
        background-size: cover;
        background-position: right;
        opacity: 0;
        transition: opacity 4s ease-in-out;
        animation: kenburns 30s ease-in-out infinite; /* Adjust timing as needed */
        z-index:-10;
    }
    .heroslide.active {
        opacity: 1;
    }
    #hero-overlay {
        position:fixed;
        top:0;
        left:0;
        padding:0;
        margin:0;
        width:100%;
        height:100%;
        background: #363636;
        opacity: 0;
        z-index:-10;
    }
    #hero-overlay2 {
        position:fixed;
        top:0;
        left:0;
        padding:0;
        margin:0;
        width:100%;
        height:100%;
        background: #000000;
        opacity: 0;
        z-index:-10;
    }


    .infobtn {
        padding: 6px 10px 6px 10px;
        border-radius: 5px;
        border: none;
        background: #56747540;
        letter-spacing: 1px;
        font-weight: 500;
        color:#fff;
        text-decoration:none;
    }
    .bookbtn {
        padding: 6px 10px 6px 10px;
        border-radius: 5px;
        border: none;
        background: #56747580;
        letter-spacing: 1px;
        font-weight: 500;
        color:#fff;
        text-decoration:none;
    }
    .infobtn:hover, .bookbtn:hover {
        color: #000;
        background: orange;
      }

      .bookbtn:visited, .infobtn:visited {
        text-decoration:none;
      }

    /* Ken Burns Effect */
    @keyframes kenburns {
        0% {
            transform: scale(1.15) translate(0, 0);
        }
        50% {
            transform: scale(1.3) translate(-1%, -1%);
        }
        100% {
            transform: scale(1.15) translate(0, 0);
        }
    }

    div :is(.infobox-1, .infobox-2) {
        text-align: center;
    }

    .infobox-1 {
        border-right:1px solid #ccc;
    }

    span.miniheader {
        font-size: 0.8rem;
        text-transform: uppercase;
        letter-spacing: 1px;
        font-weight: 700;
        color: orange;
    }
    span.minitext {
        font-size: 0.5rem;
        text-transform: uppercase;
        letter-spacing: 1px;
        font-weight: 500;
        color: hsla(0, 0%, 100%, 0.3);
    }

    .vertical-center {
        margin: 0;
        position: absolute;
        top: 5%;
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
      }

      .offer-vehicle {
        width:90%;
        max-width:360px;
        margin-top: -85px;
      }
      .subhead {
        text-transform: uppercase;
        font-size: 1rem;
        letter-spacing:1px;
        color: #fff;
      }