/*####################################### Banner doordash CSS#########################################*/

.hence-forth-doordash-page h1 span {
    color: #EB1700;
}

.doordash-banner {
    position: relative;
    overflow: hidden;

}

.doordash-banner::after {
    position: absolute;
    content: '';
    right: 0;
    top: 45px;
    background: transparent url("../images/doordash/banner-before.png") center/contain no-repeat padding-box;
    width: 500px;
    height: 800px;
    z-index: -1;
}

.doordash-banner-image img {
    filter: drop-shadow(28px 24px 40px rgba(0, 0, 0, 0.16));
}

/*################################# doordash Pages Layers ##################################*/
.doordash-bg-layers {
    position: relative;
    width: 100%;
    height: 100%;
}

.doordash-bg-layers::before {
    position: absolute;
    content: "";
    top: 0%;
    left: 0;
    background: transparent url("../images/doordash/doordash-layers.png") center/cover no-repeat padding-box;
    width: 100%;
    height: 100%;
    z-index: -1;
}

/*################################# Doordsah Online App  ##################################*/
.doordash-online-app-content h3 span {
    background: linear-gradient(180deg, #04EA6F 0%, #00D563 100%);
}

/*################################# Benefits Doordash Clone ##################################*/


.benefits-doordash-clone h3 span {
    background: linear-gradient(282.84deg, #00C6FF 18.56%, #0072FF 81.44%);
}

.benefits-doordash-clone-card {
    background: #FFFFFF;
    border: 1px solid #E5E5E5;
    border-radius: 16px;
    background: #FFFFFF;
    padding: 20px 15px;
    height: 100%;
    position: relative;
    cursor: pointer;
    transition: all 0.5s ease-in-out;
}

.benefits-doordash-clone-card:hover {
    background: linear-gradient(180deg, #04EA6F 0%, #00D563 100%);
    transition: all 0.5s ease-in-out;

}

.benefits-doordash-clone-card:hover .benefits-doordash-clone-text-box p,
.benefits-doordash-clone-card:hover .benefits-doordash-clone-text-box h5 {
    color: #FFFFFF;
}

.benefits-doordash-clone-img {
    position: absolute;
    left: 25px;
    top: -35px;
}


/*################################# Custom Build Doordash ##################################*/
.custom-build-doordash-clone-heading h3 span {
    background: linear-gradient(226.69deg, #FFB199 0%, #FF0844 100%);
}

.custom-build-doordash-clone-content-heading {
    background: linear-gradient(180deg, #04EA6F 0%, #00D563 100%);
    border-radius: 12px;
    padding: 20px;
    max-width: 300px;
}

.custom-build-doordash-clone-content img {
    min-height: 437px;
    max-height: 437px;
    object-fit: scale-down;
}


/*################################# Build Grow Doordash ##################################*/
.build-grow-doordash-bg {
    background: transparent url('../images/doordash/build-doordash.png') center/cover no-repeat padding-box;
    width: 100%;
    padding: 50px 25px;
    border-radius: 16px;
    min-height: 320px;
    display: flex;
    align-items: center;
}

/*################################# High End Features Doordash ##################################*/

.high-end-doordash-features-heading h3 span {
    background: linear-gradient(46.19deg, #F09819 5.66%, #FFED4E 94.35%);
}

/*#################################  Doordash Powerfull Vendor ##################################*/
.doordash-powerfull-panels {
    background: transparent url("../images/doordash/panel-bg.png") center/cover no-repeat padding-box;
    width: 100%;
    background-size: 100% 100%;
}

.doordash-powerfull-vendor-card 
{
    border-radius: 16px;
    padding: 25px;
    /*height: 100%;*/
}

.doordash-powerfull-vendor-content-left:nth-child(1) .doordash-powerfull-vendor-card {
    background: linear-gradient(46.19deg, #FF512F 5.66%, #F09819 94.35%);
}

.doordash-powerfull-vendor-content-left:nth-child(2) .doordash-powerfull-vendor-card {
    background: linear-gradient(282.84deg, #00C6FF 18.56%, #0072FF 81.44%);
}

.doordash-powerfull-vendor-content-right:nth-child(1) .doordash-powerfull-vendor-card {
    background: linear-gradient(46.19deg, #F09819 5.66%, #FFED4E 94.35%);
}

.doordash-powerfull-vendor-content-right:nth-child(2) .doordash-powerfull-vendor-card {
    background: linear-gradient(226.69deg, #FFB199 0%, #FF0844 100%);
}


/*################################# Doordash Agent App ##################################*/
.doordash-agent-app .accordion-button::after {
    opacity: 0;
}

.doordash-agent-app .accordion-item {
    background: #FFFFFF;
    box-shadow: 0px 16px 60px rgba(0, 0, 0, 0.12);
    border-radius: 12px;
    border: 0;
}

.doordash-agent-app .accordion-header {
    border-radius: 12px;

}

.doordash-agent-app .accordion-item:first-of-type .accordion-button {
    border-radius: 12px 12px 0 0;
}

.doordash-agent-app .accordion-item .accordion-button {
    border-radius: 12px 12px 0 0;
}

.doordash-agent-app .accordion-button:not(.collapsed) 
{
    color: #000;
    background-color: #fff;
    padding-bottom: 0;
}


.accordion-item .accordion-button.collapsed 
{
    border-bottom-right-radius: 12px !important;
    border-bottom-left-radius: 12px !important;
}

/*################################# Doordash Advance Admin ##################################*/
.doordash-powerfull-admin-content-left:nth-child(1) .doordash-powerfull-vendor-card {
    background: linear-gradient(180deg, #04EA6F 0%, #00D563 100%);
}

.doordash-powerfull-admin-content-left:nth-child(2) .doordash-powerfull-vendor-card {
    background: linear-gradient(268.84deg, #EA52F8 0%, #0066FF 100%);
}

.doordash-powerfull-admin-content-right:nth-child(1) .doordash-powerfull-vendor-card {
    background: linear-gradient(282.84deg, #00C6FF 18.56%, #0072FF 81.44%);
}

.doordash-powerfull-admin-content-right:nth-child(2) .doordash-powerfull-vendor-card {
    background: linear-gradient(46.19deg, #FF512F 5.66%, #F09819 94.35%);
}

/*################################# Doordash Boost Bussiness ##################################*/
.doordash-boost-bussiness-heading h3 span {
    background: linear-gradient(46.19deg, #CAC531 5.66%, #F3F9A7 94.35%);
}

.doordash-boost-bussiness-card {
    background: #FFFFFF;
    box-shadow: 0px 16px 60px rgba(0, 0, 0, 0.12);
    border-radius: 16px;
    height: 100%;
    padding: 25px;
}

/*################################# DoorDash Clone Outshine ##################################*/
.doordash-clone-outshine-heading h3 span {
    background: linear-gradient(233.54deg, #79FB3C 32.69%, #119DA4 93.81%);
}


.doordash-clone-outshine-card {
    height: 100%;
    padding: 25px;
    background: #FFFFFF;
    box-shadow: 0px 16px 32px rgba(0, 0, 0, 0.05);
    border-radius: 16px
}


/*################################# Doordash Clone CTA ##################################*/
.doordash-cta-bg {
    width: 100%;
    position: relative;
    margin-top: 100px;
    background: #F9B202;
    border-radius: 16px;
    min-height: 320px;
    display: flex;
    align-items: center;
}

.doordash-cta-bg::before {
    position: absolute;
    content: '';
    background-image: url('../images/doordash/doordash-img.png');
    width: 520px;
    height: 403px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    bottom: 0px;
    left: 0px;
}





/*################################# Media ##################################*/
@media (min-width: 1200px) and (max-width: 1399px)
{
    .doordash-banner-content h1
    {
        font-size: 37px;
    }
    .doordash-powerfull-panels h5 ,.doordash-agent-app-content h5
    {
        font-size: 28px;
    }
}

@media all and (min-width:1200px) {
    .doordash-banner-image .responsive-img {
        max-width: 60%;
    }
}

@media all and (min-width:992px) and (max-width:1199px) {
    .doordash-banner::after {
        display: none;
    }

}

@media all and (min-width:768px) and (max-width:991px) {

    .doordash-cta-bg::before {
        display: none;
    }

    .doordash-cta-bg {
        min-height: 0;
        margin-top: 0;
    }


    .doordash-banner::after {
        display: none;
    }


}


@media all and (min-width:320px) and (max-width:767px) {

    .doordash-cta-bg::before {
        display: none;
    }


    .doordash-cta-bg {
        min-height: 0;
        margin-top: 0;
    }


    .doordash-banner::after {
        display: none;
    }

    .benefits-doordash-clone-img {
        position: absolute;
        left: 0;
        right: 0;
        margin-inline: auto;
    }

    .custom-build-doordash-clone-content img {
        min-height: unset;
        max-height: unset;
    }
}