/* ===================================================================== */
/*  The following CSS was created using Theme Editor.                    */
/*  To modify this CSS, click "Open Theme Editor".                       */
/* ===================================================================== */

/* ===================================================================== */
/*  Root - CSS Variables                                                 */
/* ===================================================================== */

:root {
	
    /* Color - Brand */
    --color-primary: #207062;
    --color-secondary: #207062;

    --color-primary-hover: #18544a;
    --color-primary-selected: rgba(32, 112, 98, .12);
	
    /* Dark Theme */
    --background-dark-theme: rgba(255, 255, 255, .1);
    --background-dark-theme-hover: rgba(255, 255, 255, .2);
}



html{
    color: #000;
}

.display-desktop{
    display: block;
}
.phone .display-desktop, .tablet .display-desktop {
    display: none;
}
.content .main{
    margin-top: 82px;
}

a ,a:visited {
    color: unset;
    text-decoration: none;
}

a:hover {
    color: unset;
    text-decoration: none;
}
a:focus{
     text-decoration: none;
}

a:visited{
     text-decoration: none;
}
.one-line-text {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    }
/*********************** footer ****************/
.footer{
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    background-color: #ffff;
}
.footer .sep-foot{
    width: 100%;
    height: 9px;
    background-color: #EBEEF4;
}
.partner{
   
    margin-top: 48px;
    font-weight: 400;
    font-size: 28px;
    line-height: 100%;
    letter-spacing: 0.16em;
    text-align: center;
    padding-bottom: 46px;
}

 .partner-logo{
    margin-top: 16px;
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    align-items: center;
    justify-content: center;
}


 .partner-icon100{
    display: flex;
    flex-direction: row;
    font-weight: 400;
    justify-content: center;
    align-items: center;
    height: 100px;
    aspect-ratio: 1 / 1;
}

.partner-icon80 {
        display: flex;
    flex-direction: row;
    font-weight: 400;
    justify-content: center;
    align-items: center;
    height: 80px;
    aspect-ratio: 1 / 1;
}

.partner-icon-lanscape {
    display: flex;
    flex-direction: row;
    font-weight: 400;
    justify-content: center;
    align-items: center;
    width: 120px;
    object-fit: contain;
}

.DBD-icon{
    width: 119px;
    height: 56px;
}

.menu-footer{
    background: #2D796B;
    box-shadow: -2px 0px 44px 0px #0000001A;
    padding-bottom: 64px;
    width: 100%;
}

.menu-bottom-grid{
    display: grid;
    grid-template-columns: 35% 30% auto;
    width: 100%;
}
.menu-bottom-grid .first-col-menu{
    margin-top: 52px;
    margin-left: 96px;
}

.first-col-menu .resident-text{
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #FFFFFF;
    margin-top: 27px;
    height: 72px;
    width: 100%;
    display: flex;
    flex-direction: column;
}
.resident-text-two{
    width: 239px;
}
.second-col-menu{
    margin-top: 69px;
    display: grid;
    grid-template-columns: 50% auto;
    row-gap: 20px;
}

.second-col-menu .menu-text{
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    text-align: left;
    color: #FFFFFF !important;
}

.second-col-menu .menu-text .user-menu-dropdown{
    padding-left: 0px;
}
.second-col-menu  .arrow-icon{
    display: none;
}

.third-col-menu{
    margin-top: 60px;
}

.third-col-menu .contact-text{
    font-weight: 500;
    font-size: 16px;
    line-height: 27px;
    color: #FFFFFF;
    width: auto;
    margin-left: 15px;
    text-align: left;
}

.third-col-menu .contact-grid{
    display: grid;
    grid-template-columns: 50% auto;
    row-gap: 21px;
    margin-left: 15px;
    margin-top: 18px;
} 
.third-col-menu .contact-grid .line{
    width: 30px;
    height: 30px;
}

.third-col-menu .contact-grid .face{
    width: 30px;
    height: 30px;
}
.footer-detail{
    background: #0B3C30;
    height: 65px;
    display: grid;
    grid-template-columns: 50% auto;
    justify-content: space-between;
    padding: 22px 96px 22px 96px;
}

.footer-detail .footer-detail-text{
    font-family: 'Prompt';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    color: #FFFFFF;
}

.gurumalist-logo-img{
    height: auto; 
    width: 297px; 
}

.footer-detail{
    background: #0B3C30;
    height: 65px;
    display: grid;
    grid-template-columns: 50% auto;
    justify-content: space-between;
    padding: 22px 96px 22px 96px;
}

.footer-detail .footer-detail-text{
    font-family: 'Prompt';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    color: #FFFFFF;
}

.new-footer-wrapper{
    
}
.blank-spcace{
    height: 90px;
    display: none;
}
.our-partner-text{
    font-family: Prompt;
    font-size: 28px;
    font-weight: 400;
    line-height: 42.34px;
    letter-spacing: 0.16em;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    text-align: center;
    color:  #333333;
    text-transform: uppercase;
}

.resident-text-two{
    width: 239px;
}
.new-footer-wrapper .partner {
    text-align: center;
    background-color: #fff;
    height: auto;
    color: var(--color-neutral-9);
    padding-top: 30px;
    padding-bottom: 30px;
}

.partner-wrapper{
    justify-content: center;
    text-align: center;
    align-items: center;
    display: flex;
    gap: 40px;
    flex-wrap: wrap;
}

.partner-Content{
    display: contents;
    width: 100% !important;
    justify-content: center;
    margin-top: 16px;
}

.partner-grid{
    display: grid;
    grid-template-columns: 16.65% 16.65% 16.65% 16.65% 16.65% 16.65%;
    width: 100% !important;
    justify-content: center;
    margin-top: 16px;
}

.partner-img{
    width: 66px;
    height: 65px;
    border-radius: 13px;
}
.help-ser-nomargin{
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}
.each-partner-text{
    font-family: 'Prompt';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #000000;
    margin-top: 13px;
}
.gurumalist-logo-img{
    height: auto; 
    width: 297px; 
}
.each-partner-text-margin{
    margin-top: 19px !important;
}
.menu-bottom{
    width:100%;
height: 307px;
background: #2D796B;
box-shadow: -2px 0px 44px rgba(0, 0, 0, 0.1);
}
.menu-bottom-grid{
    display: grid;
    grid-template-columns: 35% 30% auto;
    width: 100%;
}
.menu-bottom-grid .first-col-menu{
    margin-top: 52px;
    margin-left: 96px;
}

.first-col-menu .resident-text{
    font-family: 'Prompt';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #FFFFFF;
    margin-top: 27px;
    height: 72px;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.second-col-menu{
    margin-top: 69px;
    display: grid;
    grid-template-columns: 50% auto;
    row-gap: 20px;
}

.second-col-menu .menu-text{
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    text-align: left;
    color: #FFFFFF !important;
}
.third-col-menu{
    margin-top: 60px;
}

.third-col-menu .contact-text{
    font-family: 'Prompt';
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 27px;
    color: #FFFFFF;
    width: auto;
    margin-left: 15px;
    text-align: left;
}

.third-col-menu .contact-grid{
    display: grid;
    grid-template-columns: 50% auto;
    row-gap: 21px;
    margin-left: 15px;
    margin-top: 18px;
} 

.footer-detail{
    background: #0B3C30;
    height: 65px;
    display: grid;
    grid-template-columns: 50% auto;
    justify-content: space-between;
    padding: 22px 96px 22px 96px;
}

.footer-detail .footer-detail-text{
    font-family: 'Prompt';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    color: #FFFFFF;
}

.text-topbanner-wrap{
    position: absolute;
    top: 1%;
    left: 2%;
    z-index: 5;
}

.text-certified{
    font-weight: 600;
font-style: Regular;
font-size:70px;
line-height: 100px;
letter-spacing: 7.2px;
vertical-align: middle;
color: #ffff;
text-shadow: 5px 1px 7px #00000040;
}

.text-top-banner{
font-weight: 400;
font-style: Regular;
font-size: 44.01px;
line-height: 82px;
letter-spacing: 7.2px;
vertical-align: middle;
color: #ffff;
text-shadow: 5px 1px 7px #00000040;
}

.text-th-banner{
font-weight: 400;
font-style: Regular;
font-size: 24px;
line-height: 26.1px;
letter-spacing: 0.27px;
vertical-align: middle;
color: #ffff;
margin-top: 16px;
}


/** Ipad Pro Portrait **/
 @media screen and (orientation:portrait) and (max-width:834px){

    .second-col-menu{
        grid-template-columns: 100%;
    }
    .gurumalist-logo-img{
    height: auto; 
    width: 213px; 
}
    .menu-bottom{
        height: 330px;
    }
    .blank-spcace{
    display: block;
}
    .third-col-menu .contact-grid{
        grid-template-columns: 100%;
    }
    .CarSearch{
        grid-row-start: 1;
    }
    .Promotion{
        grid-row-start: 4;
    }
    .SellMyCar{
        grid-row-start: 2;
    }
    .KintoOneValue{
        grid-row-start: 3;
    }
    .AboutUs{
        grid-row-start: 5;
    }
    .HelpService{
        grid-row-start: 6;
    }
    .first-col-menu .resident-text {
        width: 230px;
    }
    .second-col-menu{
        margin-top: 47px;
    }
    .menu-bottom-grid .first-col-menu{
        margin-top: 43px;
        margin-left: 32px;
    }
    .menu-bottom-grid{
        grid-template-columns: 42% 28% auto;
    }
    .third-col-menu{
        margin-top: 38px;
    }
    .third-col-menu .line{
        grid-row-start: 1;
    }
    .third-col-menu .facebook{
        grid-row-start:2;
    }
    .third-col-menu .youtube{
        grid-row-start: 3;
    }
    .third-col-menu .twitter{
        grid-row-start: 4;
    }
    .footer-detail .footer-detail-text {
        text-align: center;
        justify-content: center;
    }
    .footer-detail {
        grid-template-columns: 100%;
        text-align: center;
        padding: 12px 96px 22px 96px;
    }
    .new-footer-wrapper .partner {
            padding-top: 0px;
    padding-bottom: 70px;
    }
    .partner-wrapper{
        margin-top: 22px;
    }

}


/** Mobile" portrait **/
 @media screen and (orientation: portrait) and (max-width:515px){
     .menu-bottom-grid{
         grid-template-columns: 100%;
     }
     .blank-spcace{
    display: block;
}
     .our-partner-text{
         font-size: 26px;
     }
     .each-partner-text{
         font-size: 12px;
     }
     .menu-bottom{
         height: auto;
         padding-left: 15px;
         padding-top: 36px;
         padding-bottom: 25px;
     }
     .menu-bottom-grid .first-col-menu{
         margin-left: 0px;
         margin-top: 0px;
     }
     .first-col-menu .resident-text {
         margin-top: 17px;
         height: auto;
         width: 348px;
     }
     .second-col-menu{
    margin-top: 32px;
    display: grid;
    grid-template-columns: 50% auto;
    row-gap: 20px;
    }   
    .CarSearch{
        grid-row-start: 1;
        grid-column-start: 1;
    }
    .Promotion{
        grid-row-start: 1;
        grid-column-start: 2;
    }
    .SellMyCar{
        grid-row-start: 2;
        grid-column-start: 1;
    }
    .KintoOneValue{
        grid-row-start: 3;
        grid-column-start: 1;
    }
    .AboutUs{
        grid-row-start: 2;
        grid-column-start: 2;
    }
    .HelpService{
        grid-row-start: 3;
        grid-column-start: 2;
    }
    .third-col-menu {
    margin-top: 32px;
    }
    .third-col-menu .contact-grid{
    grid-template-columns: 50% auto;
    margin-left: 0px;
    row-gap: 12px;
    }
     .third-col-menu .line{
        grid-row-start: 1;
        grid-column-start: 1;
    }
    .third-col-menu .facebook{
        grid-row-start:1;
        grid-column-start: 2;
    }
    .third-col-menu .youtube{
        grid-row-start: 1;
        grid-column-start: 2;
    }
    .third-col-menu .twitter{
        grid-row-start: 2;
        grid-column-start: 2;
    }
    .mobile-margin-contact{
        margin-left: 0 !important;
    }

    .contact-grid .DBD{
        grid-row-start: 2;
        grid-column-start: 1;
    }

    .footer-detail{
    background: #0B3C30;
    height: 65px;
    display: grid;
    font-size: 12px;
    grid-template-columns: 100%;
        justify-content: center;
    padding: 11px 0px 1px 0px;
}
.footer-detail .footer-detail-text {
    font-size: 12px;
}

 }

 @media screen and (orientation:landscape) and (max-height:428px) and (max-width:926px){
     .footer-detail {
        padding: 22px 0px 21px 12px;
     }
      .gurumalist-logo-img{
    height: auto; 
    width: 213px; 
} 
     .blank-spcace{
    display: block;
}
      .second-col-menu{
        grid-template-columns: 100%;
    }
    .menu-bottom{
        height: 330px;
    }
    .third-col-menu .contact-grid{
        grid-template-columns: 100%;
    }
    .CarSearch{
        grid-row-start: 1;
    }
    .Promotion{
        grid-row-start: 4;
    }
    .SellMyCar{
        grid-row-start: 2;
    }
    .KintoOneValue{
        grid-row-start: 3;
    }
    .AboutUs{
        grid-row-start: 5;
    }
    .HelpService{
        grid-row-start: 6;
    }
    .first-col-menu .resident-text {
        width: 230px;
    }
    .second-col-menu{
        margin-top: 47px;
    }
    .menu-bottom-grid .first-col-menu{
        margin-top: 43px;
        margin-left: 32px;
    }
    .menu-bottom-grid{
        grid-template-columns: 42% 28% auto;
    }
    .third-col-menu{
        margin-top: 38px;
    }
    .third-col-menu .line{
        grid-row-start: 1;
    }
    .third-col-menu .facebook{
        grid-row-start:2;
    }
    .third-col-menu .youtube{
        grid-row-start: 3;
    }
    .third-col-menu .twitter{
        grid-row-start: 4;
    }
    .footer-detail .footer-detail-text {
        text-align: center;
    }
    .footer-detail {
        grid-template-columns: 100%;
        text-align: center;
        padding: 12px 96px 22px 96px;
    }
 }
 /** Ipad Pro 11" Landscape **/
 @media screen and (orientation:landscape) and (max-width:1194px){
     .blank-spcace{
    display: block;
}
.menu-bottom-grid {
    grid-template-columns: 41% 29% auto;
}
    .gurumalist-logo-img{
    width: 297px;
    height: 87px;
    }
 }


 .partner-icon100{
    display: flex;
    flex-direction: row;
    font-weight: 400;
    justify-content: center;
    align-items: center;
    height: 100px;
    aspect-ratio: 1 / 1;
}

.partner-icon80 {
        display: flex;
    flex-direction: row;
    font-weight: 400;
    justify-content: center;
    align-items: center;
    height: 80px;
    aspect-ratio: 1 / 1;
}

.partner-icon-lanscape {
    display: flex;
    flex-direction: row;
    font-weight: 400;
    justify-content: center;
    align-items: center;
    width: 120px;
}

.partner-wrapper a{
    display: flex;
    justify-content: center;
    align-items: center;
}

.DBD-icon{
    width: 119px;
    height: 56px;
}

/* Mobile" portrait */
 @media screen and (orientation: portrait) and (max-width:515px){
     .partner-icon100 {
        height:70px;
    }

    .partner-icon80 {
        height: 60px;
    }

    .partner-icon-lanscape {
        width: 80px;

    }

    .partner-icon-lanscape.kinto{
        width: 100px;
        height: 50px;
    }

    .partner-wrapper{
    justify-content: center;
    align-items: center;
    display: grid;
    gap: 18px;
    flex-wrap: wrap;
    grid-template-columns: auto auto auto;
    text-align: center;
    align-content: center;
    margin-top: 22px;
    }

    .new-footer-wrapper .partner{
        padding-top: 0px;
        padding-bottom: 64px;
    }
 }
/** Button **/

.share-button-wrapper {
    position: relative;
    display: block;
    transition: all .2s ease-in-out;
}

.share-button-wrapper .other-share {
    position: absolute;
    top: 10px;
    right: 0;
    height: 50px;
    width: 130px;
    text-align: left;
    padding: var(--space-s);
    background-color: var(--color-neutral-0);
    border: 1px solid var(--color-neutral-4);
    border-radius: var(--border-radius-soft);
    display: none;
}

.share-button-wrapper .other-share>div {
    display: inline;
    /* width: 32px;
    height: 32px; */
}

.share-button-wrapper .other-share>div:not(:last-of-type) {
    margin-right: var(--space-s);
}

.share-button-wrapper .other-share img {
    width: 32px;
    height: 32px;
    border-radius: 50px;
    object-fit: cover;
    object-position: center;
}

.share-button-wrapper:hover .other-share {
    display: inline-flex;
}


/** End Button **/


.text-twoline{
      overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.popup-box{
    width: 410px;
    border-radius: 5px;
    padding: var(--space-s);
    max-height: unset;
}

.popup-icon{
    width: 23px;
    height: 23px;
}

.tel-popup-btn{
    align-content: center;
    align-items: center;
    width: 380px;
    height: 40px;
}

.tel-popup{
    width: 123px !important;
    height: 82px !important;
}

.tel-popup img{
    width: 123px;
    height: 82px;
    object-fit: cover;
}

.tell-card-tellcon img{
    width: 20px;
}

.tel-popup .car-image-box{
    width: 123px;
    height: 82px;
}

.info-popup{
    padding-left: 10px;
    width: 200px;
}

.info-popup-title{
    padding-bottom: 19px;
    height: 45px;
}

.call-n-line{
    display: grid;
    grid-template-columns: 50% auto;
    gap: 11px;
}

.line-btn-grey img{
    width: 25px!important;
    height: 25px;
}


.tell-card-tellcon {
    background: linear-gradient(90.6deg, #396D61 0%, #20804F 114.65%);
    border-radius: 5px;
    font-size: 16px!important;
    color: #fff;
    text-align: center;
    justify-content: center;
    pointer-events: none !important;
    margin-top: 8px;
    width: 100%;
    border-style: none;
}

.tell-card-title {
    color: #207062;
    font-weight: 600;
    font-size: 16px;
}

.tell-card-carname {
    color: #294540;
    font-weight: 600;
    font-size: 16px;
}

.tell-card-seller {
    color: #294540;
    font-weight: 300;
    font-size: 14px;
}

.tell-card-textbottom {
    color: #1B7062;
    font-weight: 500;
    font-size: 14px;
    
}

.text-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.text-ellipsis-1 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.text-ellipsis-2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.text-ellipsis-3 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.text-ellipsis-4 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.tippy-box{
    background-color: #fff;
    max-width: 233px !important;
    box-shadow: 10px 33px 72px 0px #3333331A;
    border-radius: 10px;
}

.tippy-arrow{
    color: #fff;
    box-shadow: 10px 33px 72px 0px #3333331A;
}

[data-tippy-root]{
    box-shadow: 10px 33px 72px 0px #3333331A;
}

.note-buttom{
    margin-top: 26px;
}

.test-drive{
    max-width: unset;
    width: 1000px;
    max-height: unset;
    padding: 0px;
}

.textarea-addi{
    resize: none !important;
}

.request-test-drive-btn{
    height: 30px;
    font-size: 14px;
}
.request-test-drive-btn .bg{
    background-color: #145046;
    }



.bottom-compare {
    position: fixed;
    z-index: 99;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    transition: all .3s ease-in-out;
}

.bottom-compare-wrapper {
    background-color: #155046;
    color: #fff;
    padding: 15px 15%;
    box-shadow: -1px -3px 3px 0px rgb(0 0 0 / 20%), 0px -2px 6px 0 rgb(0 0 0 / 19%);
}

.bottom-compare-wrapper .Button,
.bottom-compare-wrapper .btn {
    height: 30px;
    min-width: 120px;
    font-size: 14px;
    padding: 0px 20px 0px 20px;
    border-style: none;
    white-space: nowrap;
}

.btn-green {
    background-color: #207062;
    color: #fff;
    height: 30px;
    padding: 0px 20px;
    white-space: nowrap;
}

.bottom-compare-wrapper .car-selected-wrapper {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
}

.bottom-compare-wrapper .car-selected-wrapper .car-item {
    background-color: #fff;
    border-radius: 20px;
    height: 28px;
    width: auto;
    display: flex;
    align-items: center;
    margin-right: 18px;
    padding: 4px 12px;
    font-size: 12px;
    color: #000;
}

.bottom-compare-wrapper .car-selected-wrapper .car-item .fa {
    margin-left: 4px;
   color: var(--color-primary);
}

.hover-click {
    cursor: pointer;
}
.icon-close{
    height: 20px;
    width: 20px;
    font-size: 20px;
    color: #000;
}
.icon-close:hover{
    transform: rotate(90deg);
    opacity: 0.842;
    color: #000;
    transition: all .3s ease;
}

.list-appointment{
    max-height: 200px;
    overflow-y: auto !important;
    display: flex;
    flex-direction: column;
    gap: 21px;
}

/********* Layout Responsive ************/
.tablet .nav-bar,
.phone .nav-bar{
    justify-content: space-between;
}


@media screen and (max-width: 1112px) {
    .header .navigation-bar{
        padding: var(--space-none) 30px;
    }
    .phone .header .navigation-bar{
        padding: var(--space-none) 15px;
    }
}

.Application_Menu.open{
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

.Application_Menu.open .nav-bar-item{
    display: flex;
    align-items: center;
    flex-direction: column;
    position: fixed;
    z-index: 999;
    background: #fff;
    width: 100%;
    left: 0;
    justify-content: unset;
    overflow: auto;
}
.Application_Menu.open .nav-bar-item > div{
    width: 100%;
}

.Application_Menu.open .nav-bar-item .item{
    padding: 16px;
    width: 100%;
    text-align: left;
    font-size: 16px;
    line-height: 21px;
}

.login-new-design{
    background: linear-gradient(113.4deg, #396D61 13.89%, #207B50 64.02%, #20804F 93.52%);
box-shadow: 0px 0px 10px rgba(40, 119, 85, 0.5);
border-radius: 20px !important;
width: 164px;
border-style: none;
}

.Register-new-button{
    border-radius: 40px !important;
    width: 164px;
}


.user-email-login{
    margin-top: 13px;
    margin-left: 20px;
    font-weight: 500;
    font-size: 18px;
    line-height: 27px;
    /* Secondary Color */
    color: #406E83;
}

.logo-side-menu-new {
    width: 100%;
    justify-content: space-between;
    display: flex;
}.two-col-grid{
    display: grid;
    width: 100%;
    grid-template-columns: 50% auto;
    gap: 15px;
    margin-top: 20px;
}

.login-new-design.btn{
    background: linear-gradient(113.4deg, #396D61 13.89%, #207B50 64.02%, #20804F 93.52%);
box-shadow: 0px 0px 10px rgba(40, 119, 85, 0.5);
border-radius: 20px !important;
width: 164px !important;
color: #ffff;
    height: 40px;
    font-size: 14px;
}

.Register-new-button.btn{
    border-radius: 40px !important;
    width: 164px !important;
    background-color: transparent !important;
    height: 40px;
    font-size: 14px;
}

.new-top-side-menu {
    background: #EDF7F5;
    padding-bottom: 0px;
    width: 100%;
    padding-top: 16px;
    padding-right: 16px;
    padding-left: 16px;
}


.user-email-login{
    margin-top: 13px;
    margin-left: 20px;
    font-weight: 500;
    font-size: 18px;
    line-height: 27px;
    color: #406E83;
}

.logo-side-menu-new {
    width: 100%;
    justify-content: space-between;
    display: flex;
}

.login-list-menu {
    display: none;
}

.phone .login-list-menu ,
.tablet .login-list-menu {
    display: block;
}
.login-list-menu > div{
    padding: 16px;
    font-weight: 400;
font-size: 16px;
line-height: 24px;
background: #EDF7F5;
}

.font-color-black{
    color: #535151 ;
}

.font-color-green{
    color: var(--color-primary) ;
}

.separator-wrap{
    display: flex;
    gap: 4%;
    margin-top: 10px;
    align-items: center;
    color: #00708c;
    font-size: 16px;
    font: bold;
}

.separator-or{
    width: 53%;
    height: 1px;
    background-color: #dee2e6;
}

.login-with-simply{
    font-size: 14px;
    width: 100%;
   background-color: #FF785B;
    text-align: center;
    height:40px;
    border-radius: 40px;
    cursor: pointer;
    color: white;
    border: unset !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.simply-icon{
    height: 30px;
    border-radius: 8px;
}

.desktop .new-top-side-menu{
    display: none;
}

.tablet .user-menu-dropdown, .phone .user-menu-dropdown{
    padding-left: 0px ;
}

.phone .nav-bar .gurulogo{
    max-width: 180px;
}

/** Languaue Switcher **/

.language-switcher-overlay{
    width: 0px;
    height: 0px;
    
}

.language-switcher-overlay.active{
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
    cursor: default;
}

.language-switch {
    display: none;
    padding: var(--space-none) 16px;
    margin-top: var(--space-base);
}

.language-switcher{
    width: 115px;
    height: 24px;
    padding: 2px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;

    font-weight: 400;
    font-size: 14px;

    color: #396D61;
}
.show-current-locale a {
    width: 56px;
}
.language-switcher .show-current-locale{
    display: flex;
}

.language-switcher .show-current-locale{
    display: flex;
}

.language-switcher img{
    width: 20px;
    height: 20px;
    margin-right: 6px;
    border-radius: 50%;
}

.language-switcher .fa{
    width: 9px;
    height: 13x;
    transform: rotate(180deg);
}

.language-switcher-dropdown{
    width: 0;
    height: 0;
    opacity: 0;
}

.language-switcher-dropdown.expanded{
    display: block;
    position: absolute;
    top: 26px;
    left: 0;
    right: 0;
    width: 100%;
    height: auto;
    box-shadow: var(--shadow-s);
    border-radius: 10px;
    background-color: var(--color-neutral-0);
    padding: 10px 2px;
    transition: all .2s ease-in-out;
    z-index: 4;
    opacity: 1;
}

.language-switcher-dropdown a{
    width: 100%;
    height: 20px;
    color: var(--color-primary) !important;
    font-weight: 300;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 6px 4px;
}

.language-switcher-dropdown a+a{
    margin-top: 10px;
}

.language-switcher-dropdown a:hover{
    font-weight: 600;
}

.language-switcher-dropdown a.active{
    font-weight: 600;
    pointer-events: none;
    cursor: default;
}

.language-switcher-dropdown a .language-checkmark{
    display: none;
}

.language-switcher-dropdown a .language-checkmark img{
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.language-switcher .arrow{
    margin-left: 9px;
    transition: all .2s ease-in-out;
    display: flex;
    object-fit: cover;
    height: 100%;
}

.language-switcher-dropdown.expanded +.language-switcher .fa {
    transform: rotate(180deg);
}

@media screen and (min-width:1024px){
    .header-top .language-switcher{
        margin-right: 35px;
    }
}


@media screen and (orientation: portrait) and (max-width: 515px) {
    .language-switch {
        display: block;
    }
}

/** End Languaue Switcher **/


.phone .separater-wrapper,
.tablet .separater-wrapper{
    display: block;
}


   .tablet .user-menu-dropdown .dropdown-content-wrapper,
   .phone .user-menu-dropdown .dropdown-content-wrapper {
        position: relative;
        top: 0px !important;
        min-height: 40px;
        background-color: var(--color-neutral-0);
        padding: 0 var(--space-base);
        border: none;
        border-radius: 0;
        box-shadow: none;
        z-index: 200;
        transition: all .2s ease-in-out;
        display: none;
        min-width: 220px;
    }

.tablet .language-switch,
.phone .language-switch {
    display: block;
}


.tablet .user-menu-dropdown:hover .dropdown-content-wrapper,
.phone .user-menu-dropdown:hover .dropdown-content-wrapper {
    display: flex;
    flex-wrap: wrap;
}

.tablet .nav-bar-item .item,
.phone .nav-bar-item .item{
    font-weight: 400;
}

.phone .menu-icon img{
    width: 32px;
    height: 32px;
}

.tablet .menu-icon img{
    width: 24px;
    height: 24px;
}

.menu-icon{
    width: auto;
    margin-right: 0px;
}

.sign-out-wrapper{display:none ;}
.tablet .sign-out-wrapper,
.phone .sign-out-wrapper{
    display: block;
}
.sellmaycar-wrap {
  
}
.sellmaycar-wrap .tippy-box{
    padding: 16px;
}

.d-pc{
    display: block;
}

.d-tablet{
    display: none;
}


.sure-certified .logo{
    width: 121px;
    height: 56px;
    margin-right: 56px;
    margin-top: 2px;
    margin-bottom: 2px;
}

.sure-certified .surecert-detail{
    padding: 49px 72px 49px 72px;
    display: flex;
    flex-direction: column;
    gap: 21.69px;
    height: auto;
    max-width: 1440px;
    width: 100%;
}
.sure-certified .surecert-detail .title{
font-weight: 600;
font-size: 33px;
line-height: 43.2px;
letter-spacing: 5.4px;
vertical-align: middle;
}
.sure-certified .surecert-detail .title-red{
    color:  #D32030;
}

.sure-certified .surecert-detail .text-detail{
font-weight: 400;
font-size: 24px;
line-height: 35px;
letter-spacing: 0%;
vertical-align: middle;
}
.sure-certified .D-sure-carlist{
    max-width: 1297px;
    width: 100%;
}

.sure-certified .D-sure-carlist .title-header{
    margin-bottom: 50px;
 
font-weight: 600;
font-style: SemiBold;
font-size: 24px;
line-height: 30px;
letter-spacing: 2.4px;
text-align: center;
vertical-align: middle;

}
.top-banner{
    height: 900px;
    width: 100%;
    object-fit: contain;
}

.D-sure-carlist-wrap{
    padding-top: 35px;
    background: #fff;
}

.osui-carousel .splide img{
    height: auto;
}
.d-pc{
    display: block;
}

.d-tablet{
    display: none;
}







/**** Ipad Pro Portrait ****/
@media screen and (orientation:portrait) and  (max-width:834px){
    .sure-certified .surecert-detail{
        padding:25px;
    }
    .sure-certified .surecert-detail .title{
        justify-content: center;
        font-size: 26px;
    }
     .d-tablet{
    display: block;
    }
    .d-pc{
    display: none;
    }
        .sure-certified .surecert-detail .text-detail{
        font-size: 20px;
        text-align: center;
    }
        .dsure-card-list{
        justify-content: center;
    }
     .menu-icon img{
        margin-right: var(--space-m);
    }
    .tell-card-tellcon{
        display: flex;
        align-items: center;
        height: 40px;
    }.sure-certified .surecert-detail{
        height: auto;
    }
        .warp-landtab-l {
        display: flex;
        justify-content: center;
    }
    .dsure-card-list {
        max-width: 622px;
    }
    .Car-card-CarSearch{
        justify-content: flex-start;
    }
             .text-top-banner{
         font-size: 34px;
     }
    .text-certified{
        font-size: 60px;
    }
}


/*** Ipad Pro 11" Landscape ****/
@media screen and (orientation:landscape) and (max-width:1194px){
    .d-tablet{
    display: block;
}
       .d-pc{
    display: none;
    }

    .sure-certified .surecert-detail .text-detail{
        font-size: 20px;
        text-align: center;
    }

    .dsure-card-list{
        justify-content: flex-start;
    }
    .nav-bar{
    justify-content: space-between;
    }   
    .display-desktop{
    display: none;
    }

    .menu-icon img {
    width: 24px;
    height: 24px;
}
.menu-icon {
  display: block;
}   
.desktop .menu-icon{
    display: block;
}
.desktop .new-top-side-menu {
    display: block;
}   
.login-list-menu{
    display: block;
}
.sign-out-wrapper{
    display: block;
    margin-bottom: 20px;
}
.language-switch{
    display: block;
}
.Application_Menu.open .nav-bar-item{
    overflow: auto;
}
.user-menu-dropdown{
    padding-left: 0px;
}
.warp-landtab-l{
    display: flex;
    justify-content: center;
}
.dsure-card-list{
    max-width: 957px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}
.user-menu-dropdown .dropdown-content-wrapper{
    position: relative;
    top: 0px !important;
    min-height: 40px;
    background-color: var(--color-neutral-0);
    padding: 0 var(--space-base);
    border: none;
    border-radius: 0;
    box-shadow: none;
    z-index: 200;
    transition: all .2s ease-in-out;
    display: none;
    min-width: 220px;
}
.user-menu-dropdown:hover .dropdown-content-wrapper{
    display: flex;
    flex-wrap: wrap;
}
.nav-bar-item .item{
    font-weight: 400;
}
.separater-wrapper{
    display: block;
}
   .tell-card-tellcon{
        display: flex;
        align-items: center;
        height: 40px;
    }
    .Car-card-CarSearch{
        
    }
}
/**** Mobile" portrait ******/
 @media screen and (orientation: portrait) and (max-width:515px){

     .sure-certified .surecert-detail {
        padding: 20px;
        gap: 3.69px;
        height: auto;
    }
    .sure-certified .surecert-detail .text-detail{
        font-size: 12px;
        line-height: 18px;
        text-align: center;
    }
    .sure-certified .surecert-detail .title{
        font-size: 12px;
        line-height: 22px;
    }
    
    .sure-certified .D-sure-carlist .title-header{
        margin-bottom: 0px;
    }
    .pagination{
        margin-bottom: 20px;
    }
    .menu-footer{
        height: auto;
    padding-left: 15px;
    padding-top: 36px;
    padding-bottom: 25px;
    }
    .third-col-menu .contact-text{
       
        }
        .bottom-compare-wrapper {
        margin-top: 20px;
        z-index: 1;
        padding: 15px 12px;
    }
        .bottom-compare-wrapper .Button, .bottom-compare-wrapper .btn {
        height: 20px;
        min-width: 100px;
        font-size: 12px;
        padding: 0px 10px;
    }
        .mobile-margin-contact {
        margin-left: 0 !important;
    }
    .menu-icon img{
        margin-right: 0px;
    }
    .test-drive{
        max-height: 600px;
        overflow: auto;
    }
        .Car-card-CarSearch {
        justify-content: center;
    }
    .text-certified-wrap{
        flex-direction: column;
        align-items: flex-start;
    }
                 .text-top-banner{
         font-size: 20px;
         line-height: 38px;
     }
    .text-certified{
        font-size: 24px;
        line-height: 100%;
        margin-left: 0px;
    }
    .text-topbanner-wrap{
        top: 3%;
    left: 4%;
    }

    .text-th-banner{
        font-size: 10px;
    }
 }


/**** Mobile" Landscape ****/
 @media screen and (orientation:landscape) and (max-height:435px) and (max-width:940px){

         .dsure-card-list {
        max-width: 622px;
        width: fit-content;
    }
    .test-drive{
            max-height: 305px;
    padding: 0px;
    overflow: auto;
    }
    .dsure-card-list{
        justify-content: center;
        grid-template-columns: 1fr 1fr;
    }
 }

 .pagination-counter{
     display: none;
 }

 .pagination{
     margin-top: 50px;
     justify-content: center;
     margin-bottom: 100px;
 }

 .pagination-container {
    background: #ffffff;
    padding: 8px;
    border-radius: 8px;
    position: relative;
 }

.card-pagination .fa-angle-left:before{
    visibility: visible;
    color: #E0E7EE;
}
.card-pagination .fa-angle-right:before{
        visibility: visible;
    color: #E0E7EE;
}
.pagination-button{
    color: #333333;
    padding: 4px 10px 4px 10px;
    background-color: #EBEEF4;
    align-items: center;
    width: auto;
     border-radius: 8px;
     border-style: none;
}

.pagination-button.is--active{
    font-size: 12px;
    background-color: #396D61;
    color: #ffff;
}

.pagination-container > .pagination-button:first-child{
    width: 44px;
    height: 32px;
}

.pagination-container > .pagination-button:last-child{
        width: 44px;
    height: 32px;
}