@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');


h1,h2,h3,h4,h5,h6,p,li,a,span{
    font-family: "Jost", sans-serif;
}
.navbar-brand img{
    width: 150px;
}
.navbar{
    padding: 20px 8%;
    padding-left: 5%;
}
.span_logo{
    color: red!important;
    position: absolute;
    right:40px;
    bottom:0;
}
.magicborder{
    box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}
.magicborderx{
    box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
    background: #fff;
    padding: 10px 20px;
}
.magicbg{
    background-image: url("../images/grid.jpg");
    background-repeat: repeat;
    padding:100px;
    padding-top: 30px;
}
.zoom_in_hover{
    transition: .5s all;
}
.zoom_in_hover:hover{
    transform: scale(1.09);
}
.nav-link{
    font-size: 18px;
    color: #000;
}
.nav-item{
    margin: 0 15px;
}
.cta_nav a{
    background-color: #F88435;
    font-weight: 500;
    font-size: 17px;
    color:#fff;
    border-radius:0;
    padding: 9px 25px;
    text-decoration: none;
}
.banner_one{
    background-image: url("../images/grid.jpg");
    background-repeat: repeat;
    padding:100px;
    padding-bottom: 20px;
}
.banner_one_left, .banner_one_left2{
    background:#fff;
    margin-bottom: 15px;
    padding: 30px;
    box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}
.banner_one_left h1{
    font-size: 50px;
}
.typed_text, .typed-cursor{
    color: #F88435;
    font-size: 30px;
    font-weight:500;
}
.app_link{
    margin-top: 20px;
}
.app_link a img{
    height: 40px;
}
.banner_one_right img{
    width:100%;
}
.banner_two{
    background-image: url("../images/grid.jpg");
    background-repeat: repeat;
    padding:100px;
    padding-top: 30px;
}
.banner_two video,.banner_three video{
    width: 40%;
    padding: 10px;
    background:#fff;
}
.banner_three{
    margin-top: 0px;
}
.banner_three h1{
    width:40%;
    margin:auto;
}
.features_box i{
    background: #F88435;
    color: #fff;
    height: 70px;
    width:70px;
    line-height: 70px;
    border-radius: 50%;
    font-size: 25px;
}
.features_box h2{
    font-size: 21px;
}
.features_box{
    height: 300px;
}
.banner_five img{
    width:100%;
}
.doordash_logo{
    width:40%;
    margin:auto;
}
.doordash_logo img{
    width: 100%;
}
.doordash_stores img{
    width: 100%;
    height: 200px;
}
.carousel{
    margin-top:30px;
}
.carousel-indicators [data-bs-target]{
    height: 30px;
    width: 30px;
    border-radius: 50%;
}
footer.magicbg{
    padding: 0;
    width:100%;
    overflow:hidden;
}
footer ul li{
    display: inline;
    margin: 0 5px;
}
footer ul li::after{
    content: "|";
    margin-left: 10px;
}
footer ul li a{
    color:#000;
    text-decoration: none;
    font-size: 19px;
}

/* Style the buttons that are used to open and close the pkg_accordion pkg_panel */
.pkg_accordion {
background-color: #fff;
color: #444;
cursor: pointer;
padding: 18px 0;
width: 100%;
text-align: left;
border: none;
outline: none;
transition: 0.4s;
border-bottom: 1px solid #d6d6d6;
font-weight: 500;
color: #6a6a8e;
}
.pkg_accordion:after {
content: '\02795'; /* Unicode character for "plus" sign (+) */
font-size: 11px;
color: #6a6a8e!important;
float: right;
margin-left: 5px;
}
.pp_pkg{
    overflow-y: hidden;
    margin-bottom: 25px;
}
.pkg_acc_active:after {
content: "\2796"; /* Unicode character for "minus" sign (-) */
}

.pkg_acc_active, .pkg_accordion:hover {
background-color: #fff;
}


.pkg_panel {
    padding: 0 18px;
background-color: white;
max-height: 0;
overflow: hidden;
transition: max-height 0.2s ease-out;
}
.pkg_panelin{
    padding: 15px 0; font-size: 16px; font-weight: 400; color: #000; padding-left: 0!important; line-height: 18px;
}
.pkg_accordion{
    color: #000!important;
    margin-top: 13px;
}

@media (max-width:800px) {
    .navbar-brand img{
        width: 90px;
    }
    .cta_nav{
        position:absolute;
        right: 20%;
    }
    .cta_nav a{
        font-size: 15px;
        padding: 5px 18px;
    }
    .magicbg{
        padding:50px 20px;
    }
    .banner_one{
        padding:100px 20px;
    }
    .banner_two{
        padding:40px 10px;
        padding-bottom: 10px;
    }
    .banner_two video, .banner_three video{
        width: 100%;
        padding: 10px;
        padding-bottom: 10px;
    }
    .banner_three h1{
        width:100%;
        margin:auto;
    }
    .features_box{
        height: auto;
    }
    .doordash_stores img{
        width: 100%;
        height: auto;
    }
      
}