@font-face{
    font-family: 'gilroy';
    src: url(gilroy/Gilroy-Regular.ttf);
}
@font-face{
    font-family: 'gilroy-bold';
    src: url(gilroy/Gilroy-Bold.ttf);
    font-style: normal;
}
:root{
    --black: #2b2b2b;
    --box: #f2f1f1;
    --color: #ED1C24;
    --kili-box: #08031A;;
}
body{
    overflow-x: hidden !important;
    width: 100%;
    touch-action: manipulation;
    -ms-content-zooming: none;
    -ms-touch-action: manipulation;
    -webkit-touch-callout: none;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: none;
}
*{
    padding: 0;
    margin: 0;
    font-family: 'gilroy',sans-serif;
    font-style: normal; 
    font-weight: normal;
}
 
 
 
 
       /* Navigation Bar */
       .navbar {
        display: flex;
        /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); */
        padding: 15px 0;
        color: #000;
        position: fixed;
        transition: .5s ease-in-out;
        justify-content: center;
        align-items: center;
        width: 100%;
        z-index: 3;
      
    }
    .Kiliride-actions-link{
        display: flex;
        padding: 10px 30px;
        width: 80%;
        max-width: 1200px;
        border-radius: 30px;
        transition: ease .5s;
        position: relative;
    }
    .Kiliride-actions-link.red{
        background-color: #fff;
    }
    .Kiliride-actions-link .get-app{
        position: absolute;
        right: 20px;
        top: 25px;
    }
    .Kiliride-actions-link .get-app a{
         text-decoration: none;
        color: var(--color);
        padding: 14px 16px;
        background-color: #fff;
        border-radius: 8px;
        font-family: 'gilroy-bold';
    }
    .Kiliride-actions-link .kiliride-logo-first{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .Kiliride-actions-link .kiliride-logo-first img{
        object-fit: cover;
        height: 48px;
        width: 117px;
    }
    .Kiliride-actions-link .nav-item-holder{
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0 50px;
        width: auto;
    }
    .nav-item-holder .nav-item {
        margin-right: 0;
        text-align: center;
        width: auto;
        text-wrap: nowrap;
        font-size: 15px;
        padding: 10px;
        cursor: pointer;
        position: relative;
        transition: ease .3s;
        color: #fff;
    }
    .nav-item-holder .nav-item .arrow-icon{
        display: none;
    }
    /* Dropdown Menu */
    .dropdown {
        position: fixed;
        top: 100px;
        left: 0;
        width: 100vw; /* Full width */
        transition: ease .3s;
        height: auto;
        padding: 20px 0;
        color: white;
        /* box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); */
        opacity: 0;
        visibility: hidden;
        z-index: 5;
    }
    .nav-item-holder .nav-item:hover .dropdown {
        opacity: 1;
        visibility: visible;
    }
    .Kiliride-actions-link:hover{
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); 
    }
    /* Arrow Indicator */
    .nav-item-holder .nav-item:nth-child(3):hover .arrow-{
        transform:translateX(150%) rotate(45deg);
    }
    .nav-item-holder .nav-item:hover .arrow-{
        width: 20px;
        height: 20px;
        border-radius: 5px;
        background-color: #fff;
        transform:translateX(300%) rotate(45deg);
        position: absolute;
        left: 0;
        bottom: -65px;
        transition: ease .5s;
        border-top: 1px solid  rgba(0, 0, 0, 0.2);
        border-left: 1px solid  rgba(0, 0, 0, 0.2);
    }

    .arrow-{
        transform: rotate(45deg);
    }
    /* Dropdown Content */
    .dropdown-content {
        display: flex;
        width: 80%;
        max-width: 1200px;
        background: #fff;
        border-radius: 30px;
        padding: 30px;
        margin: auto;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
    }
    .dropdown-content .drop-down-header{
        display: none;
    }
    .column {
        width: 30%;
        max-width: 500px;
        display: flex;
        flex-direction: column;
        justify-self: flex-start;
        align-items: start;
        margin: 0 10px;
        border-right: 1px solid #DFDFDF;
    }
    .border-right{
        border-right: none;
    }
    .column h3 {
        margin-bottom: 10px;
        color: #A4A7AE;
        font-size: 15px;
    }
    .column a{
        margin: 10px 0;
        text-decoration: none;
        color: #000;
        font-weight: 700;
        font-size: 20px;
        transition: .1s ease;
    }
     .column a:hover{
        background-color: #ED1C2412;
        padding: 8px 15px;
        border-radius: 8px;
        color: var(--color);
    }
    .column .column-second{
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .column .column-second img{
        object-fit: cover;
        width: 185px;
        height: 153px;
        border-radius: 10px;
    }
    .column .column-second .text{
        display: flex;
        flex-direction: column;
        margin-left: 20px;
        width: 250px;
        justify-content: flex-start;
        align-items: start;
    }
    .column .column-second .text p{
        font-size: 20px;
        text-wrap: wrap;
        line-height: 20px;
        text-align: left;
        color: #000;
    }
    .column .column-second .text a{
        text-align: left;
        color: var(--color);
        text-decoration: none;
        margin: 10px 0;
    }
    
    @media(max-width: 580px){
        .navbar {
            display: none;
        }
    }
    
    
    
    
    .kiliride-nav-header{
        display: none;
        justify-content: space-between;
        width: 100%;
        height: 60px;
        position: fixed;
        top: 0;
        z-index: 5;
        transition: .5s ease-in-out;
        background-color: var(--color);
    }
    .kiliride-nav-header .kiliride-logo{
        width: auto;
        margin: 0 10px;
    }
    .kiliride-nav-header .kiliride-logo img{
        object-fit: contain;
        width: 130px;
        height: 70px;
    }
    .kiliride-nav-header .Kiliride-menu-open{
        margin: 10px;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
        background-color: #C6242A;
        border-radius: 50%;
    }
    .kiliride-nav-header .Kiliride-menu-open i{
        color: #fff;
    }
    .Kiliride-Advanced-menu{
        width: 100%;
        height: 100%;
        overflow: hidden;
        padding:  0;
        Background-color: var(--color);
        Color: #fff;
        Text-align: center;
        Margin: 0;
        Display: none;
        Justify-content: center;
        flex-direction: column;
        position: fixed;
        Height: auto;
        z-index: 5;
        transition: transform 0.5s ease-out, opacity 0.5s ease-out;
    }
    @media(max-width: 580px){
        .Kiliride-Advanced-menu{
            display: flex;
        }
        .kiliride-nav-header{
            display: flex;
        }
    }
    
    .Kiliride-Advanced-menu .container{
        Display: flex;
        Width: 100%;
        height: 100%;
        background-color: var(--color);
    }
    
    .Kiliride-Advanced-menu .left-panel {
        Width: 100%;
        Display: flex;
        height: 100vh;
        Flex-direction: column;
        align-items: center;
        position: relative;
        overflow: scroll;
    }
    .Kiliride-Advanced-menu .left-panel 
    .Kiliride-top-menu-section{
        display: flex;
        justify-content: space-between;
        width: 100%;
        z-index: 1;
    }
    .Kiliride-Advanced-menu .left-panel 
    .Kiliride-top-menu-section .kiliride-logo{
        width: auto;
        margin: 0 10px;
    }
    .Kiliride-Advanced-menu .left-panel 
    .Kiliride-top-menu-section .kiliride-logo img{
        object-fit: contain;
        width: 130px;
        height: 70px;
    }
    .Kiliride-Advanced-menu .left-panel 
    .Kiliride-top-menu-section .Kiliride-menu-close{
        margin: 10px;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
        background-color: #C6242A;
        border-radius: 50%;
        color: #fff;
    }
    .Kiliride-Advanced-menu .left-panel .action-button{
        padding: 20px 0;
        border: 1px solid #DADADA;
        border-radius: 30px;
        width: 90%;
        margin: 50px 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .Kiliride-Advanced-menu .left-panel .action-button a{
        text-decoration: none;
        padding: 20px 0;
        width: 90%;
        Transition: 0.3s;
        background-color: transparent;
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: #fff;
        margin-top: 10px;
        font-size: 18px;
    }
    .Kiliride-Advanced-menu .left-panel .get-the-app-button{
        margin: 10px 0;
        position: relative;
        justify-content: left;
        align-items: left;
        width: 100%;
        margin-bottom: 20px;
    }
    .Kiliride-Advanced-menu .left-panel .get-the-app-button .get-app{
        background-color: #fff;
        padding: 14px 18px;
        border-radius: 8px;
        text-decoration: none;
        position: absolute;
        left: 20px;
        color: var(--color);
        font-weight: 600;
    }
    .Kiliride-Advanced-menu .left-panel .action-button button{
        border: none;
        border-bottom: 1px solid #DADADA;
    }
    .Kiliride-Advanced-menu .nav-item-btn{
        border-bottom: 1px solid #DADADA;
        padding: 20px 0;
        width: 90%;
        Transition: 0.3s;
        background-color: transparent;
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: #fff;
        margin-top: 10px;
        font-size: 18px;
    }
    .Kiliride-Advanced-menu .left-panel .action-button button:last-child{
        border-bottom: none;
    }
    .Kiliride-Advanced-menu .nav-item-btn i{
        color: #DADADA;
    }
    
    .Kiliride-Advanced-menu .right-panel {
        Width: 100%;
        Position: absolute;
        left: 0;
        top: 0;
        height: 100%;
        background-color: #C6242A;
        display: none;
    }
    
    .Kiliride-Advanced-menu .content-menu{
        Opacity: 0;
        visibility: hidden;
        Transition: opacity .3s ease-in-out;
        Position: absolute;
        Width:95%;
        height: 98%;
        border-top-right-radius: 40px;
        border-bottom-right-radius: 40px;
        Top: 0;
        transform: translateX(-10px);
        background-color: var(--color);
        overflow: scroll;
        z-index: 2;
    }
    .Kiliride-Advanced-menu .content-menu .kiliride-primary-nav{
        position: absolute;
        top: 0;
        padding: 20px 0;
        justify-content: space-between;
        display: flex;
        align-items: center;
        width: 100%;
        z-index: 2;
        background-color: var(--color);
    }
    .Kiliride-Advanced-menu .content-menu .kiliride-primary-nav .back-view{
        font-size: 12px;
        margin: 0 20px;
        color: #fff;
    }
    .Kiliride-Advanced-menu .content-menu .kiliride-primary-nav .close-view{
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #C6242A;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        margin: 0 10px;
    }
    .Kiliride-Advanced-menu .content-menu .kiliride-primary-nav .close-view i{
        color: #fff;
    }
    .Kiliride-Advanced-menu .content-menu .kiliride-secondary-main{
        display: flex;
        flex-direction: column;
        width: 100%;
        justify-content: center;
        align-items: center;
        position: relative;
    }
    .Kiliride-Advanced-menu .content-menu .kiliride-secondary-main .kiliride-link-holder{
        width: 90%;
        border-radius: 30px;
        position: absolute;
        top: 100px;
    }
    @media(min-width: 581px) and (max-width: 950px){
        .Kiliride-Advanced-menu .content-menu .kiliride-secondary-main .kiliride-link-holder{
            justify-content: unset;
            align-items: unset;
            top: 100px;
        }
        .Kiliride-Advanced-menu{
            display: flex;
            width: 50%;
        }
        .kiliride-nav-header{
            display: flex;
        }
        .navbar {
            display: none;
        }
        .Kiliride-Advanced-menu .right-panel {
            width: 100%;
        }
    }
    .Kiliride-Advanced-menu .content-menu .kiliride-secondary-main .kiliride-link-holder .second-segment{
        margin: 20px 0;
    }
    .Kiliride-Advanced-menu .content-menu .kiliride-secondary-main .kiliride-link-holder .second-segment h1{
        text-align: left;
        font-size: 13px;
        color: #fff;
        margin-bottom: 20px;
    }
    .Kiliride-Advanced-menu .content-menu .kiliride-secondary-main .kiliride-link-holder .second-segment .The-segment{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        border: 1px solid #DADADA;
        border-radius: 30px;
        padding: 5px 0;
    }
    .Kiliride-Advanced-menu .content-menu .kiliride-secondary-main .kiliride-link-holder .second-segment .The-segment a{
        color: #fff;
        display: block;
        padding: 20px 0;
        width: 90%;
        Transition: 0.3s;
        background-color: transparent;
        align-items: center;
        color: #fff;
        font-size: 18px;
        text-decoration: none;
        text-align: left;
    }
    .Kiliride-Advanced-menu .content-menu .kiliride-secondary-main .kiliride-link-holder h1{
        text-align: left;
        font-size: 13px;
        color: #fff;
    }
    .Kiliride-Advanced-menu .content-menu .kiliride-secondary-main .kiliride-link-holder .main-segment{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin-top: 40px;
        border: 1px solid #DADADA;
        border-radius: 30px;
        padding: 20px 0;
    }
    .Kiliride-Advanced-menu .content-menu .kiliride-secondary-main .kiliride-link-holder .main-segment a{
        color: #fff;
        display: block;
        border-bottom: 1px solid #DADADA;
        padding: 20px 0;
        width: 90%;
        Transition: 0.3s;
        background-color: transparent;
        align-items: center;
        color: #fff;
        font-size: 18px;
        text-decoration: none;
        text-align: left;
    }
    .Kiliride-Advanced-menu .content-menu .kiliride-secondary-main .kiliride-link-holder .main-segment a:last-child{
        border: none;
        border-bottom: none;
    }
    .Kiliride-Advanced-menu .content-menu.active {
        visibility: visible;
        Opacity: 1;
        transform: translateX(0);
        animation: translateX 0.6s linear;
    }
    
    @keyframes translateX {
        from { transform: translateX(-10px);}
        to { transform: translateX(0px);}
    }
    .hide-menu{
        transform: translateX(-100%);
        opacity: 0;
    }
    
    /* menu end*/



 
 
 
 
 
 
 
 
 
 
 
link[rel="icon"]{
    width: 65px;
    height: 65px;
}
.call-to-action{
    padding: 12px 24px;
    background-color: var(--color);
    text-wrap: nowrap;
    color: #f2f1f1;
    text-decoration: none;
    border-radius: 24px;
    font-family: 'gilroy-bold',sans-serif;
    transition: .3s ease-in;
    margin: 5px;
}
.call-to-action-new{
    padding: 12px 24px;
    background-color: var(--color);
    text-wrap: nowrap;
    color: #fff !important;
    text-decoration: none;
    border-radius: 5px;
    font-family: 'gilroy-bold',sans-serif;
    transition: .3s ease-in;
    margin: 5px;
}


.Kiliride-cookies{
    width: 300px;
    height: auto;
    background-color: #fff;
    position: fixed;
    bottom: 50px;
    right: -350px;
    border-radius: 12px;
    transition: right 0.3s ease;
    z-index: 2222;
    padding: 20px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.Kiliride-cookies.show-cookie{
    right: 10px;
}
.Kiliride-cookies h1{
    font-family: 'gilroy-bold';
    font-size: 25px;
    margin-bottom: 20px;
    color: #1B172D;
}
.Kiliride-cookies p{
 font-size: 16px;
    line-height: 20px;
    font-weight: 400;
    vertical-align: middle;
}
@media(max-width: 580px){
    .Kiliride-cookies{
        width: 300px;
        bottom: 20px;
    }
    .Kiliride-cookies h1{
        font-size: 20px;
    }
    .Kiliride-cookies p{
        font-size: 13px;
        line-height: 20px;
    }
}
.Kiliride-cookies .buttons{
    width: 100%;
    display: flex;
    margin: 20px 0;
    justify-content: right;
}
.Kiliride-cookies .buttons .cookie-btn{
    padding: 12px 16px;
    border-radius: 60px;
    margin: 0 5px;
    border: 1px solid var(--color);
    background-color: #fff;
    color: var(--color);
    transition: ease-in .3s;
}
.Kiliride-cookies .buttons .cookie-btn:nth-child(1){
    background-color: var(--color);
    color: #fff;
}
.Kiliride-cookies .buttons .cookie-btn:hover{
    background-color: var(--color);
    color: #fff;
}

.call-to-action:hover{
    background-color: var(--box);
    color: var(--color);
}
.container{
    width: 100%;
    color: var(--black);
    overflow: hidden;
}
.container .navigation{
    top: 0;
    width: 100%;
    height: 50px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    display: flex;
    padding: 15px 10px;
    float: right;
    position: fixed;
    background-color: #fff;
    z-index: 9999;
    margin-bottom: 10px;
    transition: all 0.3s ease-in;
}
.container .navigation.sticky{
    background: #fff !important;
    transform: translateY(-100%);
}
.container .navigation.sticky .links a {
    color: var(--black) !important;
}
.container .navigation.sticky.hide{
   transform: translateY(0%);
   background: #fff !important;
}
.container .navigation.hide{
    transform: translateY(-100%);
    background: #fff !important;
 }
.container .navigation .kili-logo{
    width: auto;
    width: 150px;
    height: 100%;
    margin-left: 8%;
}

.container .navigation .kili-logo img{
    top: 0;
    margin-top: -15px;
    width: 100%;
    height: auto;
    object-fit: cover;
}
.container .navigation .nav-link{
    margin-left: 2%;
    margin-right: 100px;
    width: 80%;
    height: 100%;
    justify-content: right;
    display: flex; 
}
.humburger-menu{
    display: none;
}
.container .navigation.hide{
    background-color: #ffffff;
    position: fixed;
}
.container  .menu, .close-menu-btn{
    display: none;
    position: absolute;
    right: 15px;
    justify-content: center;
    align-items: center;
    transition: none;
    color: var(--black);
    width: 40px;
    height: 40px;
}
.close-menu-btn img{
    width: 40px;
    height: 40px;
    object-fit: cover;
    border-radius: 50%;
}
.close-menu-btn{
    color: var(--color);
}
.container .navigation .nav-link .info{
    display: none;
}
.container .navigation .nav-link .links .close{
    display: none;
}
.container .navigation .closing-image-bar{
    display: none;
}
.container .navigation .nav-link .downloads-btn{
    display: none;
}
@media(max-width: 580px){
    .humburger-menu{
        display: flex;
    }
    .container .navigation .kili-logo{
        margin-left: 20px;
    }
    .container .navigation .logo{
        margin-left: 20px;
    }
    .container .navigation .nav-link::-webkit-scrollbar{
        display: none;
    }
    body.noscroll{
      width: 100%;
      overflow: hidden;
    }
    .container .navigation .nav-link .downloads-btn{
        width: 100%;
        height: 200px;
        margin-top: -50px;
        padding: 10px 0;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        text-align: center;
    }
    .container .navigation .nav-link{
        display: block;
        left: 0;
        margin-left: -650px;
        background: #fff;
        position: absolute;
        transition: all ease-in .1s;
        top: 50px;
        width: 100% !important;
        background-color: #fff;
        height: 120vh;
        margin-top: 30px;
        border: none;
        overflow: hidden;
        padding: 0;
    }

    .container .navigation .nav-link .links{
        padding: 20px 0;
        margin-top: 10px;
        font-weight: 700;
        margin-bottom: 10px;
        width: 80% !important;
    }
    .container .navigation .nav-link .links a{
        font-size: 1rem !important;
        padding: 0;
        position: relative;
    }
    .container  .menu,.close-menu-btn{
        display: flex;
        z-index: 99999;
        cursor: pointer;
        transition: none !important;
    }
    .close-menu-btn{
        display: none;
    }
    .container .menu i{
        font-size: 25px;
        background-color: transparent;
    }
    .container .menu img{
        width: 30px;
        transition: none;
        height: 30px;
        margin-right: -5px;
        margin-top: -5px;
        float: right;
        display: none;
        background-color: transparent;
    }
    .container .navigation .nav-link .sign{
        padding: 10px 0;
        height: 50px;
        width: 80% !important;
        text-align: center;
        align-items: center;
        margin-top: 5px !important;
        justify-content: center;
        background-color: transparent !important;
        
      }
      .container .navigation .nav-link .sign a{
        text-decoration: none;
        color: #fff !important;
        font-size: 15px !important;
        font-weight: 700 !important;  
        padding: 15px 20px !important;
        background-color: #ED1C24;
        border-radius: 30px;
        text-transform: none;
        width: 50% !important;
        display: none;
    }
    .container .navigation{
        padding: 20px 0;
        width: 100%;
    }

}

.container .navigation .nav-link .details{
    display: none;
}

/*here i work on drop down menu and links*/
.container .navigation .nav-link .links:hover i{
    transform: rotate(180deg);
}
.container .navigation .nav-link .links:hover .hidden-links{
    display: block;
    transition: all ease-in .3s;
}
.container .navigation .nav-link .hidden-image{
    display: none;
    width: 50%;
}

.container .navigation .nav-link .links{
    padding: 15px 5px;
    margin-left: 25px;
    letter-spacing: 0;
    transition: all ease-in .3s;
    color: #222222;
    font-size: 14px;
    width: auto;
    font-weight: 400;
}
@media(max-width: 580px){
 
  .closed-kili{
        display: none;
      }
    .container .navigation .nav-link{
        display: block;
        float: left;
        margin-left: -650px;
        background-color: #fff;
        position: absolute;
        transition: all ease-in .3s;
        top: 50px;
        width: 50%;
        height: 100vh;
        margin-top: 30px;
        border: none;
        overflow-y: hidden;
        padding: 0 ;
    }


    .container .navigation .nav-link .sign{
        padding: 10px 5px;
        width: 100px !important;
        width: 50px;
        text-align: center;
        align-items: center;
        justify-content: center;
        display: none !important;
      }
      .container .navigation .nav-link .downloads-btn{
        display: inline-flex;
      }


      .container .navigation .nav-link .downloads-btn{
        width: 100%;
        height: 200px;
        margin-top: -50px;
        padding: 10px 0;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        text-align: center;
    }
    .container .navigation .nav-link .downloads-btn .button-link{
        color: #fff;
        text-wrap: nowrap;
        padding: 10px 2px;
        margin-top: 20px;
    }

    .container .navigation .nav-link .downloads-btn .button-link a{
        padding: 10px 25px;
        border-radius: 30px;
        border: 1px solid #b2b2b2;
        color: #fff;
        text-decoration: none;
        text-wrap: nowrap;
        font-size: 12px;
        background-color: #ED1C24;
    }
    
}

@media(min-width: 901px) and (max-width: 1070px){
    .container .navigation .nav-link .links{
        margin-left: 2px;
    }
    .container .navigation .nav-link .links a{
        font-size: 12px !important;
        text-wrap: nowrap !important;
    }
}

@media(min-width: 581px) and (max-width: 900px){
     .humburger-menu{
        display: flex;
    }
    .container .navigation .nav-link .downloads-btn{
        display: inline-flex;
        width: 100%;
        margin-top: 10px;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        text-align: center;
      }
      .container .navigation .nav-link .downloads-btn .button-link{
        color: #fff;
        text-wrap: nowrap;
        padding: 10px 2px;
        margin-top: 20px;
    }

    .container .navigation .nav-link .downloads-btn .button-link a{
        padding: 10px 25px;
        border-radius: 30px;
        border: 1px solid #b2b2b2;
        color: #fff;
        text-decoration: none;
        text-wrap: nowrap;
        font-size: 12px;
        background-color: #ED1C24;
    }
    .container .navigation .nav-link .sign{
        display: none;
    }
    .closed-kili{
        display: none;
    }
    .container .navigation .nav-link{
        display: block;
        float: left;
        margin-left: -650px;
        background-color: #fff;
        position: absolute;
        transition: all ease-in .3s;
        top: 50px;
        width: 50%;
        height: 100vh;
        margin-top: 30px;
        border: none;
        overflow-y: hidden;
        padding: 0 ;
    }
    .container .navigation .logo{
        margin-left: 20%;
    }
    .container{
        overflow: hidden;
    }
    .container  .menu,.close-menu-btn{
        display: flex;
        z-index: 99999;
        cursor: pointer;
        transition: none !important;
        right: 40px;
    }
    .close-menu-btn{
        display: none;
    }
    .container .menu i{
        font-size: 25px;
        background-color: transparent;
    }
    .container .navigation .nav-link{
        margin-right: 20px;
        text-wrap: nowrap;
    }
    .container .navigation .nav-link .links a{
        text-wrap: nowrap !important;
    }
    .container .navigation .kili-logo{
        margin-left: 10px;
    }
} 

.container .navigation .nav-link .links .hidden-links{
    display: none;
    z-index: 9999;
    width: 100%;
    height: auto;
    background-color: #fff;
    transition: all ease-in .3s;
    padding: 0 10px;
}
.container .navigation .nav-link .links .hidden-links ul{
    text-decoration: none;
    color: var(--black);
}
.container .navigation .nav-link .links .hidden-links ul li{
    list-style-type: none;
    padding: 15px 0;
    transition: ease-out .3s;
    font-weight: 400;
    width: 100%;
    overflow: hidden;
    text-align: start;
    justify-content: start;
    align-items: start;
}
@media(max-width: 580px){
    .container .navigation .nav-link .links .hidden-links ul li{
        text-align: start;
        justify-content: start;
        align-items: start; 
        margin-top: -5px;
    }
    .container .navigation .nav-link .links .hidden-links ul li a{
        font-weight: 500;
        font-size: 15px !important;
        padding: 15px 0;
    }
    .container .navigation .nav-link .links .hidden-links{
        display: none;
        padding: 0;
        margin-bottom: -30px;
        padding: 10px 20px;
    }
}
.container .navigation .nav-link .sign{
    background-color: #ED1C24;
    height: 12px;
    color: #fff;
    border-radius: 25px;
    display: flex;
    width: auto;
    margin-top:  4px;
    margin-left: 30px;
    text-align: center;
}
.container .navigation .nav-link .sign a{
    text-decoration: none;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 800 !important;  
    padding: 0 10px;
    text-transform: none;
}
.container .navigation .nav-link .links a{
    text-decoration: none;
    color: var(--black);
    width: 100%;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    text-wrap: nowrap;
}
.container .navigation .nav-link .links i{
    width: 10px;
    height: 10px;
    padding: 3px 5px;
    transition: ease-out .3s;
    float: right;
}
/*here i work on drop down menu and links ends*/



/*Kiliride landing page design*/

.page-container{
    width: 100%;
    height: 880px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    overflow: hidden;
    background: var(--color);
    position: relative;
}
.page-container .first-section{
    width: 80%;
    height: auto;
    margin: 100px 0;
    display: flex;
    justify-content: center;
    position: relative;
}
.page-container .first-section .content-container{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    padding: 60px 0;
    text-align: center;
}
.page-container .first-section .content-container .details{
    width: 100%;
    height: auto;
    position: relative;
    display: block;
}

.page-container .first-section .content-container .details .kiliride-shorts{
    display: flex;
    flex-direction: column;
    width: 100%;
    justify-content: center;
    align-items: center;
}
.page-container .first-section .content-container .details .kiliride-shorts p{
    font-size: 20px;
    text-wrap: wrap;
    text-align: center;
    line-height: 30px;
    font-weight: 700;
    font-family: 'gilroy-bold',sans-serif;
    letter-spacing: 0;
}
.page-container .first-section .content-container .details .kiliride-shorts h1{
    font-family: 'gilroy-bold',sans-serif;
    font-size: 10px;
    letter-spacing: 0 !important;
}
.page-container .first-section .content-container .details .kiliride-icon-flex-top{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-icon-flex-top a{
    text-decoration: none;
}
.kiliride-icon-flex-top .flex-icon{
    display: flex;
    margin: 30px 0;
}
.kiliride-icon-flex-top .flex-icon .icon-icon{
    width: 135px;
    height: 40px;
    margin: 0 5px;
}
.kiliride-icon-flex-top .flex-icon .icon-icon img{
    width: 135px;
    height: 40px;
    border-radius: 8px;
    object-fit: cover;
}
.page-container .kiliride-mockup{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    bottom: 0;
    position: absolute;
}
.kiliride-mockup .mockup{
    width: 100%;
    height: 400px;
    display: flex;
    justify-content: center;
    overflow: visible;
}
.kiliride-mockup .mockup img{
    width: 450px;
    height: 400px;
    object-fit: contain;
    transform: translateX(70px);
}
.page-container .first-section .content-container .details p{
    color: #fff;
    font-family: 'gilroy-bold',sans-serif;
    font-size: 15px;
    letter-spacing: 0 !important;
}
@media(max-width: 581px){
    .page-container .first-section .content-container .details p{
        font-size: 10px;
    }
}
.page-container .first-section .content-container .details h1{
    color: #fff;
    font-size: 60px;
    letter-spacing: 0;
    padding: 20px 0;
    position: relative;
    font-family: 'gilroy-bold',sans-serif;
}
.page-container .first-section .content-container .details h1{
    color: #fff;
    font-size: 3.5em;
    letter-spacing: 0;
    font-family: 'gilroy-bold',sans-serif;
}

.page-container .first-section .content-container .details .text-details{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 20px;
    width: 100%;
    padding: 10px 0;
    overflow: hidden;
}
.page-container .first-section .content-container .details .text-details span.text-in{
    display: block;
    text-wrap: nowrap;
    animation: textIn .5s ease;
}
.page-container .first-section .content-container .details .text-details span.text-out{
    animation: textOut .5s ease;
}
@keyframes textIn{
    0%{
        transform: translateY(100%);
    }
    100%{
        transform: translateY(0);
    }
}
@keyframes textOut{ 
    0%{
        transform: translateY(0);
    }
    100%{
        transform: translateY(-100%);
    }
}

.page-container .first-section .content-container .details .text-details span{
    display: none;
    line-height: 46px;
    font-size: 1.5em;
    color: #fff;
    font-family: 'gilroy-bold';
}

@media(max-width: 800px){
    .page-container .first-section{
        width: 100%;
        height: 400px;
    }
    .page-container .first-section .content-container .details{
        height: auto;
        justify-content: center;
        align-items: center;
        text-align: center;
        flex-direction: column;
        width: 95%;
    }

    .page-container .first-section .content-container .details h1{
        font-size: 1.7em;
        text-wrap: nowrap;
    }
    .page-container .first-section .content-container .details .text-details{
        font-size: 1rem;
        width: 98%;
        margin-left: 1%;
    }
}
/*landing page end*/



/*flex your wallet*/

.switch-display-kili{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #08031A;
    padding-bottom: 50px;
}
.switch-media{
    width: 100%;
    padding: 20px 0;
    height: auto;
    align-items: center;
    display: flex;
    flex-direction: column;
}
.switch-media h1{
    font-size: 56px;
    color: #ffffff;
    text-align: center;
    font-family: 'gilroy-bold',sans-serif;
    margin: 60px 0;
}
::-webkit-scrollbar{
    display: none;
}
.button-container{
   margin-bottom: 60px;
   display: flex;
   width: 100%;
   overflow-x: scroll;
   justify-content: center;
   align-items: center;
}
.tab-button {
    padding: 12px 24px;
    background-color: #08031A;
    text-wrap: nowrap;
    color: var(--black);
    text-decoration: none;
    border-radius: 24px;
    font-family: 'gilroy-bold',sans-serif;
    transition: .3s ease-in;
    margin: 5px;
    border: 1px solid #7E8492;
    color: #7E8492;
}
.tab-button.activees {
    Background-color: var(--color);
    Color: white;
}
.content-container {
    Margin-top: 20px;
    width: 80%;
}
@media(min-width: 581px) and (max-width: 900px){
    .content-container {
        width: 90%;
    } 
}
.content-bx {
    Display: none;
    justify-content: center;
    align-items: center;
}
.content-bx.activees {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  
}
.kiliride-sides{
    width: 500px;
    height: auto;
    flex-direction: column;
    display: flex;
}
.kiliride-sides:nth-child(2){
    margin-left: 30px;
    
}
@media(min-width: 581px) and (max-width: 1000px){
    .content-bx.activees {
        flex-direction: column;
    }
    .kiliride-sides:nth-child(2){
        margin-left: 0;
        width: 100%;
    }
    .kiliride-sides{
        width: 100%;
        margin: 20px;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
}
.kiliride-sides img{
    height: 400px;
    width: 500px;
    border-radius: 12px;
    object-fit: cover;
}

.kiliride-sides .sides-head{
    display: flex;
    text-align: start;
    width: 100%;
}
.kiliride-sides .sides-head h1{
    margin: 0;
    transform: translateY(-10px);
    padding: 0  !important;
}
.sides-holder-colums{
    display: block;
    padding: 0 20px;
}
.sides-holder-colums .sides-data-row{
    height: auto;
    display: flex;
    width: calc(100% - 20px);
    margin-bottom: 20px;
}
.sides-holder-colums .sides-data-row a{
    margin: 0 40px;
}
 
.sides-holder-colums .sides-data-row .number-in-round{
    width: 30px;
    height: 30px;
    background-color: #08031A;
    border: 2px solid var(--color);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 12px;
}
.sides-holder-colums .sides-data-row .side-information{
    height: auto;
    display: block;
    padding: 0 10px;
    width: 80%;
}
.sides-holder-colums .sides-data-row .side-information .head-big{
    font-size: 1.5em;
}
.sides-holder-colums .unique-row{
    margin-bottom: 20px;
}
.sides-holder-colums .sides-data-row .side-information h1{
    font-size: 1em;
    margin: 0;
    margin-bottom: 5px;
    text-align: start;
}
.sides-holder-colums .sides-data-row .side-information p{
    font-size: 1em;
    line-height: 18px;
    color: #fff;
    letter-spacing: 0;
}
.kiliride-sides .sides-head h1{
    font-size: 33px;
    padding: 10px 20px;
    text-align: start;
}
@media(max-width: 580px){
    .kiliride-sides:nth-child(2){
        margin-left: 0;
        width: 100%;
    }
    .sides-holder-colums .sides-data-row .side-information .head-big{
        margin: 30px 0 !important;
    }
    .content-bx.activees {
        display: block;
    }    
    .content-container {
        width: 100%;
    }
    .switch-media h1{
         font-size: 36px;
         margin: 30px 0;
    }
    .switch-media{
        width: 100%;
        height: auto;
    }
    .kiliride-sides img{
        height: 300px;
        width: 90%;
    }
    .kiliride-sides{
        width: 100%;
    }
    .kiliride-sides:nth-child(1){
        justify-content: center;
        align-items: center;
    }
    .button-container {
        justify-content: start;
        margin: 20px 0;
    }
    .sides-holder-colums .sides-data-row {
        width: 100%;
    }
    .sides-holder-colums .sides-data-row .trans-round{
        display: none;
    }
    .kiliride-sides .sides-head h1{
        font-size: 1.5em;
    }
    .sides-holder-colums .sides-data-row .side-information h1{
        font-size: 1.3em;
    }
    .sides-holder-colums .sides-data-row .side-information .head-big{
        font-size: 20px;
        margin: 20px 0;
        width: 120%;
    }
    .sides-holder-colums .sides-data-row .side-information p{
        line-height: 25px;
    }
}
::-webkit-scrollbar{
    display: none;
}
/*flex your wallet end*/








 








.flex-container{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    text-align: center;
}
.contents-container{
    height: 600px;
    width: 100%;
    overflow: hidden;
    position: relative;
    background-color: #f8f8f8;
}
.contents-container h1{
    font-weight: 700;
    color: var(--black);
    font-size: 2rem;
    padding: 20px 0;
}
.contents-container .item-bar{
    width: 100%;
    height: 90%;
    margin-top: 80px;
}
.item-bar .img .information{
    justify-content: center;
    padding: 20px;
    width: 50%;
    float: right;
    margin-bottom: 50px;
}
.item-bar .img .information table tr td{
    padding: 0 5px;
    color: var(--black);
    font-size: 1rem;
    font-family: 'gilroy-bold';
}
.item-bar .img .information .banner{
    width: 30px;
    height: 29px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    color: #fff;
    margin-top: -5px;
    background-color: #ED1C24;
}
.item-bar .img .information .banner p{
    padding: 5px 0;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.item-bar .img .information h1{
    color: var(--black);
    margin-bottom: 20px;
    display: block;
    text-align: start;
    padding: 0 5px;
}
@media(min-width: 701px) and (max-width: 1080px){
    .item-bar .img .information h1{
        font-size: 1.5rem;
    }
    .contents-container{
        height: 650px;
    }
    .flex-container{
        width: 96%;
        margin-left: 2%;
    }
}
.item-bar .img .information p{
    align-items: start;
    text-align: start;
    padding: 0 50px;
    margin-top: 5px;
    margin-bottom: 20px;
}
.item-bar .img .information a{
    padding: 10px 35px;
    font-weight: 700;
    color: #fff;
    background-color: #ED1C24;
    text-decoration: none;
    text-align: center;
    align-items: center;
    border-radius: 30px;
    
}
.item-bar .img{
    height: 80%;
    width: 100%;
    margin-top: -80px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.item-bar .img h1{
    display: none;
}
.item-bar .img img{
    height: 100%;
    width: 40%;
    float: left;
    margin-left: 20px;
    object-fit: cover;
    border-radius: 30px;
    margin-bottom: 30px;
    pointer-events: none;
}
.btm-sliders-container{
    height: 50px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    align-items: center;
    transform: translateY(-80%);
    padding: 20px 0;
    left: 50%;
    overflow-x: scroll;
}
.btm-sliders-container::-webkit-scrollbar{
    width: 0;
    height: 0;
}
.btm-sliders-container span{
    height: 20px;
    border: 1px solid  rgba(102, 101, 101, 0.336);
    background-color: #f8f8f8;
    margin: 0 5px;
    padding: 10px 40px;
    border-radius: 30px;
    cursor: pointer;
    user-select: none;
}
.btm-sliders-container span:hover{
    background-color: #fff;
}
.contents-container .slide{
    position: absolute;
    top: 50%;
    transform: translateX(-50%);
    width: 45px;
    height: 45px;
    border: 2px solid red;
    margin-left: 50px;
}
@media(max-width: 900px){
    .btm-sliders-container{
        justify-content: start;
        text-align: start;
    }
}
@media(max-width: 700px){
    .flex-container{
        width: 96%;
        margin-left: 2%;
    }
    .item-bar .img h1{
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 30px 0;
    }
 
    .item-bar .img .information table tr td{
        font-size: 1rem;
        line-height: 28px;
        padding: 10px;
    }
    .btm-sliders-container{
        width: 100%;
        display: flex;
        left: 50%;
        justify-content: start;
        text-align: start;
        overflow-x: scroll;
    }
    .btm-sliders-container span{
        padding: 10px 20px;
           display: inline;
    }
    .item-bar .img{
        display: block;
    }
    .item-bar .img .information{
        float: none;
        display: block;
        width: 100%;
        height: auto;
        padding: 40px 0;
        background-color: #f8f8f8;
        overflow-y: hidden;
        
    }
    .item-bar .img .information::-webkit-scrollbar{
        display: none;
    }
    .item-bar .img img{
        height: 250px;
        width: 100%;
        margin-left: 0;
    }
    .contents-container{
        height: auto;
        overflow: hidden;

    }
    .contents-container h1{
        font-size: 1.2rem;
        font-weight: 700;
        color: var(--black);
    }
    .item-bar .img .information a{
        padding: 15px 40px;
    }
    .item-bar .img .information p:last-child{
        margin-bottom: 50px !important;
    }
    .item-bar .img .information p{
        line-height: 25px;
        font-size: 1rem;
        padding: 0 65px;
        margin-top: -5px;
    }
    .item-bar .img .information .banner p{
        padding: 3px !important;
    }
    .item-bar .img .information h1{
        display: none;
    }
}



.service-layout{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.service-layout .service-flex-head{
    width: 80%;
    max-width: 1200px;
    margin: 60px 0;
}
.service-layout .service-flex-head .service-title{
    padding: 10px 0;
}
.service-layout .service-flex-head .service-title h1{
    font-family: 'gilroy-bold';
    margin-bottom: 10px;
    font-size: 36px;
}
.service-layout .service-flex-head .service-title p{
    width: 50%;
    line-height: 25px;
    font-size: 20px;
}
.service-layout .service-box-holder{
    width: 80%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
} 
.service-layout .service-box-holder .services-box{
    background: #fafafa;
    width: 30%;
    max-height: 400px;
    padding: 20px 10px;
}
@media(min-width: 581px) and (max-width: 900px){
    .service-layout .service-flex-head{
        width: 90%;
    }
    .service-layout .service-box-holder{
        width: 90%;
    }
}
.service-layout .service-box-holder .services-box .service-icon{
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background-color: var(--color);
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 60px;
}
.service-layout .service-box-holder .services-box h1{
    line-height: 25px;
    font-size: 20px;
    font-family: 'gilroy-bold';
    margin-bottom: 10px;
}
.service-layout .service-box-holder .services-box p{
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0;
}
@media(min-width: 581px) and (max-width: 900px){
    .service-layout .service-box-holder .services-box{
        margin: 0 10px;
        height: 250px;
    }
}
@media(max-width: 580px){
    .service-layout .service-flex-head{
        display: flex;
        justify-content: center;
        align-items: center;
        width: 90%;
    }
    .service-layout .service-flex-head .service-title{
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
        width: 100%;
    }
    .service-layout .service-flex-head .service-title p{
        width: 100%;
        text-align: center;
    }
    .service-layout .service-box-holder{
        width: 90%;
        flex-direction: column;
    }
    .service-layout .service-box-holder .services-box{
        width: calc(100% - 20px);
        margin: 10px 0;
    }
}








.set-box{
    width: 100%;
    height: 300px;
    margin-bottom: 50px;
    display: block;
    background-color: #fff;
    margin-top: 100px;
    text-align: center;
    align-items: center;
    justify-content: center;
}
.set-box .service-body{
    display: flex;
    width: 100%;
    text-align: center;
    align-items: center;
    justify-content: center;
    padding: 50px 0;
}
.set-box .services-head{
    text-align: center;
    align-items: center;
    justify-content: center;
}
.set-box .services-head h1{
    font-size: 2rem;
    padding: 10px 0;
    font-family: 'gilroy-bold';
}

.set-box .box-holder{
    width: 300px;
    height: 200px;
    padding: 10px;
    border-radius: 10px;
    gap: 20px;
    margin-right: 20px;
    background: #f8f8f8;
}
.set-box .box-holder .box-inset{
    box-shadow: inset 0 0 10px 5px rgba(221, 221, 221, 0.237);
    width: 100px;
    height: 100px;
    border-radius: 50%;
    float: right;
    justify-content: center;
    align-items: center;
    text-align: center;
    background: #fff;
}
.set-box .box-holder .box-inset img{
    width: 70px;
    margin-top: 10px;
    height: 70px;
    object-fit: contain;
    pointer-events: none;
}
.set-box .box-holder .paragraph{
    justify-content: flex-start;
    text-align: start;
    width: 100%;
    height: 100px;
}
.set-box .box-holder .paragraph h1{
    font-size: 2rem;
    font-family: 'gilroy-bold';
    padding: 10px 0;
}

@media(max-width: 700px){
    .set-box{
        width: 100%;
        height: auto;
    }
    .set-box .service-body{
        flex-direction: column;
    }
    .set-box .box-holder{
        width: 80%;
        padding: 20px;
        margin-left: 5%;
        margin-bottom: 20px;
    }
    .set-box .services-head{
        width: 90%;
        margin-left: 5%;
    }
    .set-box .services-head p{
        text-align: balance;
    }
}
@media(min-width: 701px) and (max-width: 1080px){
    .set-box{
        height: auto;
    }
    .set-box .service-body{
        flex-direction: column;
    }
    .set-box .box-holder{
        margin-bottom: 20px;
    }
}



/*working on youtube frame video*/

.youtube{
    width: 100%;
    display: flex; 
    justify-content: center;
    align-items: center;
    height: auto;
    margin: 100px 0;
}
.youtube .youtube-frame-holder{
    width: 80%;
    max-width: 1200px;
    display: flex;
}
.youtube .frames{
    width: 50%;
    height: 350px;
    margin-bottom: 30px;
    display: block;
    padding: 0;
    position: relative;
}
.youtube .frames iframe{
    position: absolute;
    right: 0;
    width: 400px;
    height: 280px;
    border-radius: 30px;
}
.frame iframe::-webkit-scrollbar{
    display: none;
}
.youtube .frames .content h6{
   font-size: 45px;
   line-height: 50px;
   font-family: 'gilroy-bold';
}
.youtube .frames .content p{
    width: 90%;
    text-align: start;
    padding: 10px 5px;
    font-size: 15px;
    line-height: 28px;
    margin-bottom: 30px;
}

@media(min-width: 481px) and (max-width: 900px){
    .youtube .youtube-frame-holder{
        width: 90%;
    }
    .youtube .frames iframe{
        width: 90% !important;
        height: 200px;
    }
}
@media(max-width: 480px){
    .youtube .youtube-frame-holder{
        flex-direction: column;
        width: 90%;
    }
}

@media(max-width: 700px){
    .youtube{
        flex-direction: column;
        height: auto;
        margin-top: 30px;
        margin-bottom: 60px;
    }
    .youtube .youtube-frame-holder{
        flex-direction: column;
        width: 90%;
    }
    .youtube .frames{
        width: 100%;
        align-items: center;
        justify-content: center;
        text-align: center;
        height: auto;
    }
    .youtube .frames:nth-child(1){
        margin-bottom: 60px;
    }
    .youtube .frames iframe{
        position: unset;
        width: 100%;
    }
    .frame iframe::-webkit-scrollbar{
        display: none;
    }
    .youtube .frames .content h6{
        font-size: 30px;
        padding: 20px 0;
       line-height: 40px;
       letter-spacing: 0;
    }
    .youtube .frames .content p{
        padding: 10px 0;
        font-size: 1rem;
        width: 100%;
    }
}

.ads-banner{
    width: 100%;
    padding: 20px 0;
    margin-bottom: 60px;
    background-color: #fafafa;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -60px;
}
.ads-banner .text{
    width: 90%;
    padding: 20px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.ads-banner .text h2{
    font-size: 48px;
    color: #181D27;
    font-family: 'gilroy-bold';
    margin-bottom: 20px;
}
.ads-banner .text p{
    font-size: 18px;
    text-align: center;
    color: #181D27;
}


/* slider css starts from here*/
.body{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 35px;
    height: 350px;
    margin-bottom: 50px;
}
.card .imgs{
    width: 250px;
    height: 200px;
    transition: ease-in-out .5s;
}
 
.card .imgs img{
    width: 200px;
    height: 100px;
    margin-left: 10%;
    object-fit: contain;
    /*border: 4px solid #fff;*/  
}
.card h2{
    font-weight: 700;
    color: #ED1C24;
    font-size: 1.56rem;
    margin: 30px;
}
.card span{
    color: var(--black);
    font-size: 12px;
    font-weight: 700px;
}
.carousel :where(.card, img){
    display: flex;
    align-items: center;
    justify-content: center;
}
.carousel .dragging .card{
    cursor: grab;
    user-select: none;
}
.carousel .card{
    height: 250px;
    width: 250px;
    list-style: none;
    background: #fff;
    border-radius: 10px;
    padding-bottom: 15px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    scroll-snap-align: center;
    margin-top: 10%;
    transition: ease-in .5s;
    border: 1px solid rgb(192, 190, 190);
    box-shadow: 0 0 5px 3px rgba(221, 218, 218, 0.226);
}
.carousel .card .title{
    width: 100%;
    height: 100%;
}
.carousel .card:hover .title{
    width: 100%;
    height: 100%;
}
 
.carousel .card .title img{
    width: 100%;
    height: 100%;
    transition: ease-in-out .3s;
}
.carousel .card:hover span{
  display: none;
transition: all ease-in-out .1s;
}
.carousel .card:hover{
    height: 290px;
    width: 270px;
    margin-top: 10px;
}
.carousel .card:last-child {
    margin-right: 50px;
}

.carousel .card:hover .imgs{
    border-radius: 30px;
    transition: ease-in-out .3s;
    margin-top: -70px;
}
.carousel .card:hover img{
    margin-top: 50px;
    margin-left: 30%;
    height: 100px;
    width: 100px;
}
.carousel .card:hover .book-ride{
    width: 100%;
    height: 45%;
    margin-top: -30px;
    display: block;
    text-align: center;
    justify-content: center;
    align-items: center;
    color: #E2E2E2;
    user-select: none;
}
.carousel .card  .book-ride{
    border-radius: 10px;
    border: none;
    display: block;
    flex-direction: column;
    justify-content: center;
    backdrop-filter: blur(1px);
    object-fit: cover;
    overflow: hidden;
    transition: unset; 
    width: 0;
    height: 0;
    transition: ease-in-out .3s;
}
.book-ride h1{
    font-weight: 700;
    color: #ED1C24;
    font-size: 1.56rem;
}
.book-ride p{
    width: 80%;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: .9rem;
    margin-left: 10%;
    line-height: 15px;
    margin-bottom: 30px;
    color: var(--black);
}
.book-ride button{
    background: #ED1C24;
    padding: 15px 20px;
    text-decoration: none;
    color: #fff;
    border-radius: 5px;
    cursor: pointer;
    border: none;
    font-family: 'gilroy-bold';
}
.pop-up{
    position: absolute;
    width: 250px;
    height: 215px;
    padding: 20px;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 0 10px 5px rgba(24, 24, 24, 0.109);
    display: none;
    left: 50%;
    transform: translate(-50%,-150%);
    justify-content: center;
    text-align: center;
    align-items: center;
    transition: ease .3s;
    transition: top 0ms ease-in-out 0ms opacity 300ms ease-in-out margin-top 300ms ease-in-out;
}
.pop-up h2{
    width: 100%;
    margin-top: 25px;
    padding: 5px 0;
    text-align: center;
    font-size: 25px;
    font-weight: 700;
    color: #ED1C24;
}
.pop-up .pop-link{
    padding: 10px;
    line-height: 10px;
    display: block;
    margin-top: 30px;
}
.pop-up .pop-link a{
    text-decoration: none;
    color: var(--black);
    border: 1px solid #b2b2b2 ;
    border-radius: 30px;
    padding: 10px 20px;
}
.pop-up > *{
    margin: 15px 0;
}
.pop-up .close{
    position: absolute;
    top: -5px;
    right: 10px;
    width: 30px;
    height: 30px;
    justify-content: center;
    align-items: center;
    text-align: center;
    border: none;
    border-radius: 50%;
    background: #ED1C24;
    cursor: pointer;
}
.pop-up .close i{
    color: #fff;
    padding: 8px;
}
body.active-pop{
    overflow: hidden;
}
body.active-pop .carpool{
    filter: blur(5px);
     transition: filter 0ms ease-in-out 0ms;
}
body.active-pop .ads-banner{
    filter: blur(5px);
     transition: filter 0ms ease-in-out 0ms;
}
body.active-pop .wraper{
    filter: blur(5px);
     transition: filter 0ms ease-in-out 0ms;
}
body.active-pop .pop-up{
    opacity: 1;
    filter: blur(0);
    display: block;
    transition: top 0ms ease-in-out 0ms opacity 300ms ease-in-out margin-top 300ms ease-in-out;
}
@media(max-width: 700px){
    .body{
        padding: 0 0;
      margin-bottom: 130px;
    }
    .carousel .card:hover .book-ride{
        margin-top: -20px;
        height: 100%;
        width: 100%;
    }
    .carousel .card:hover .book-ride p{
        text-align: center;
    }
    .card .imgs{
       background-color: transparent;
       justify-content: center;
       align-items: center;
       text-align: center;
       margin-left: 0;
    }
    .card .imgs img{
        border: none;
        width: 150px !important;
        height: 150px !important;
    }
 
    .carousel .card:nth-child(2) {
        margin-left: -25%;
    }
    .carousel .card:nth-child(3) {
        margin-left: -50%;
    }
    .carousel .card:nth-child(4) {
        margin-left: -75%;
    }
    .carousel .card:nth-child(5) {
        margin-left: -100%;
    }
    .carousel .card:hover{
        transition: 1s;
        box-shadow: 0 5px 5px rgba(0,0,0,0.2);
        backdrop-filter: blur(5px);
        width: 76%;
        height: 300px;
        margin-top: 6%;
        justify-content: center;
    }
    .wraper .carousel{
        height: 40vh;
    }
    .card .imgs img{
        margin-left: 0;
        object-fit: contain;
    }
    .carousel .card:hover .imgs{
        display: none;
    }
    .book-ride a{
        padding: 15px 30px;
        border-radius: 30px;
    }
    .book-ride p{
        line-height: 25px;
        margin-top: 50px;
        font-size: 1rem;
        color: var(--black);
        margin-bottom: 60px;
    }
    .card span{
        margin-top: -50px;
    }
 
}
.wraper{
    max-width: 1060px;
    width: 100%;
    position: relative;
}
.wraper .fa-solid{
    text-align: center;
    align-items: center;
    justify-content: center;
}
.navs-tab{
    align-items: start;
    text-align: start;
    justify-content: start;
    width: 100%;
   position: absolute;
   bottom: 10px;
    display: flex;
}
.navs-tab .nav-tab-button{
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #fafafa;
    display: flex;
    justify-content: center;
    align-items: center;
}

 .navs-tab i{
    height: 50px;
    width: 50px;
    background: #fff;
    color: var(--black);
    line-height: 50px;
    border-radius: 50%;
    cursor: pointer;
    border: 1px solid rgba(199, 199, 199, 0.376);
    font-size: 1.25rem;
    align-items: center;
    text-align: center;
}
.wraper i:hover{
    background-color: #ED1C24;
    color: #FFF;
}
@media(min-width: 701px) and (max-width: 1080px){
    .wraper{
        max-width: 800px;
    }
}
.carousel::-webkit-scrollbar{
    display: none;
}
.wraper .carousel{
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc(100% / 2) - 12px;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: 0;
    height: 380px;
}
@media(max-width: 700px){
    .wraper .carousel{
        grid-auto-columns: calc(100% / 4) - 12px;
        scroll-snap-type: x mandatory;
        scroll-behavior: smooth;
    }
    .carousel .card{
        height: 270px;
        width: 75%;
        list-style: none;
        background: #fff;
        border-radius: 10px;
        padding-bottom: 15px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        scroll-snap-align: start;
        margin-top: 10%;
        transition: all ease-in-out .1s;
        border: 1px solid rgba(192, 190, 190, 0.692);
    }
}

@media(max-width: 700px) {
    .wraper .carousel{
        grid-auto-columns: 100%;
        height: 410px;
    }
    .navs-tab{
        justify-content: right;
        align-items: right;
    }
    .card .imgs{
        width: 150px;
        height: 250px;
    }
    .card .imgs img{
        width: 100%;
        height: 240px;
    }
    .body{
        padding: 0 0;
        width: 90%;
        margin-left: 5%;
    }
}






.kiliride-carpool-layout{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #08031A;
    padding: 80px 0;
}
.kiliride-carpool-layout .layout-holder-kili{
    width: 80%;
    max-width: 1200px;
    display: flex;
}
.kiliride-carpool-layout .layout-holder-kili .carpool-sides{
    width: 50%;
    height: 400px;
}
@media(min-width: 901px) and (max-width: 1070px){
    .kiliride-carpool-layout .layout-holder-kili .carpool-sides{
        height: auto;
    }
}
.kiliride-carpool-layout .layout-holder-kili .carpool-sides img{
    object-fit: cover;
    width: 90%;
    height: 400px;
    border-radius: 25px;
}
.kiliride-carpool-layout .layout-holder-kili .carpool-sides .carpool-flex-data{
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    margin:  -10px 0;
    margin-bottom: 20px;
}
.kiliride-carpool-layout .layout-holder-kili .carpool-sides .carpool-flex-data h1{
    font-size: 40px;
    font-family: 'gilroy-bold';
    color: #fff;
    margin-bottom: 20px;
    letter-spacing: 0;
}
.kiliride-carpool-layout .layout-holder-kili .carpool-sides .carpool-flex-data p{
    color: #E9E8E8;
    line-height: 26px;
    font-size: 16px;
}
.carpool-pool-layout{
    width: 100%;
    margin: 15px 0;
    display: flex;
}
.carpool-pool-layout .icon-holder-pool{
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    margin: 0;
    background-color: #212121;
    border: 2px solid var(--color);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 10px;
}
.carpool-pool-layout .icon-holder-pool i{
    color: var(--color);
    font-size: 12px;
}
.carpool-pool-layout .data-pool{
    width: 80%;
    margin-left: 15px;
    display: block;
    padding: 0;
}
.carpool-pool-layout .data-pool h1{
    margin-bottom: 10px;
    font-family: 'gilroy-bold';
    color: #E9E8E8;
    letter-spacing: 0;
    font-size: 17px;
}
.carpool-pool-layout .data-pool p{
    color: #E9E8E8;
    letter-spacing: 0;
    font-size: 12px;
    line-height: 20px;
}
.carpool-pool-layout a{
    margin: 0 30px;
}
@media(min-width: 581px) and (max-width: 900px){
    .kiliride-carpool-layout .layout-holder-kili{
        width: 90%;
        flex-direction: column;
    }
    .kiliride-carpool-layout .layout-holder-kili .carpool-sides{
        height: auto;
        width: 100%;
         margin-bottom: 30px;
    }
    .kiliride-carpool-layout .layout-holder-kili .carpool-sides img{
        height: 400px;
        width: 400px;
    }
}
@media(max-width: 580px){
    .kiliride-carpool-layout .layout-holder-kili{
        width: 90%;
        flex-direction: column-reverse;
    }
    .kiliride-carpool-layout .layout-holder-kili .carpool-sides{
        width: 100%;
        height: auto;
    }
    .kiliride-carpool-layout .layout-holder-kili .carpool-sides:nth-child(2){
        margin-bottom: 50px;
    }
    .kiliride-carpool-layout .layout-holder-kili .carpool-sides img{
        width: 100%;
        height: 270px;
    }
}





.kiliride-carpool-feature{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
    margin: 20px 0;
}
.kiliride-carpool-feature .features-holder{
    width: 80%;
    display: flex;
    justify-content: center;
}
@media(min-width: 581px) and (max-width: 900px){
    .kiliride-carpool-feature .features-holder{
        width: 90%;
    }
}
.kiliride-carpool-feature .features-holder .kili-features{
    width: 300px;
    max-height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 0 10px;
}
.kiliride-carpool-feature .features-holder .kili-features
.head-feature{
    width: 100%;
    padding: 10px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-carpool-feature .features-holder .kili-features
.head-feature .image-icon{
    width: 50px;
    height: 50px;
}
.kiliride-carpool-feature .features-holder .kili-features
.head-feature .image-icon img{
    width: 40px;
    height: 40px;
    object-fit: contain;
}
.kiliride-carpool-feature .features-holder .kili-features
.paragraph{
    display: block;
    text-align: left;
}
.kiliride-carpool-feature .features-holder .kili-features
.paragraph h1{
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 20px;
    line-height: 28px;
    font-family: 'gilroy-bold';
    letter-spacing: 0;
    color: #372D5E;
}
.kiliride-carpool-feature .features-holder .kili-features
.paragraph p{
    color: #62628A;
    font-size: 15px;
    line-height: 20px;
}
@media(max-width: 580px){
    .kiliride-carpool-feature .features-holder{
        width: 90%;
        flex-direction: column;
    }
    .kiliride-carpool-feature .features-holder .kili-features{
        width: 100%;
        margin: 20px 0;
    }
}





.carpool{
    width: 85%;
    margin-left: 8%;
    display: flex;
    height: auto;
    margin-bottom: 50px;
    padding: 10px 0;
}
@media(min-width: 701px) and (max-width: 1080px){
    .carpool{
        width: 96%;
        margin-left: 2%;
    }
}
.carpool .pool{
    width: 45%;
    padding: 10px 15px;
    margin-left: 2%;
}
.carpool .pool img{
    width: 105%;
    height: 100%;
    object-fit: cover;
    border-radius: 25px;
    padding: 0 0;
    pointer-events: none;
}

.carpool .pool .head-up{
    text-align: start;
    display: block;
}
.carpool .pool .head-up h3{
    font-size: 3rem;
    font-weight: 500;
    color: var(--black);
    font-weight: 800;
}
.carpool .pool .head-up p{
    padding: 5px 10px;
    font-size: 20px;
    font-weight: 400px;
}
.carpool .pool p{
    width: 90%;
    line-height: 28px;
    padding: 5px 10px;
    font-size: 18px;
}
.carpool .pool .flex-container{
    margin: 10px 5px;
    display: flex;
    width: 100%;
}
.carpool .pool .log-x4 {
    text-align: center;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-bottom: 30px;
}
.carpool .pool .log-x5 {
    text-align: center;
    align-items: center;
    justify-content: center;
    display: flex;
    width: 100%;
    margin-top: 20px;
    margin-bottom: 20px;
}
.carpool .pool .log-x5 a{
    text-decoration: none;
    color: var(--black);
    font-size: 15px;
    font-weight: 700;
}
.carpool .pool .flex-container .flex-rows{
    width: 90%;
    display: block;
    padding: 10px 0;
    margin-left: 0;
}

.carpool .pool .flex-container .flex-rows h4 img{
    width: 20px;
    height: 20px;
    margin-top: 4px;
    box-shadow: 0 0 3px #2B2B2B;
    margin-left: -20px;
}
.carpool .pool .flex-container .flex-rows h4{
    font-size: 1.3rem;
    font-weight: 500;
    letter-spacing: 1px;
    color: var(--black);
    font-weight: 700;
    margin: 0 -10px 10px 0;
    display: flex;
    padding: 5px 0;
    gap: 10px;
}
.carpool .pool .flex-container .flex-rows table{
    width: 100%;
    margin-left: -20px;
}
.carpool .pool .flex-container .flex-rows table tr{
    width: 100%;
    display: flex;
    text-align: start;
    align-items: start;
}
.carpool .pool .flex-container .flex-rows table tr td{
    padding: 5px 10px;
    display: flex;
    text-align: start;
    align-items: start;
}
.carpool .pool .flex-container .flex-rows ul{
    text-decoration: none;
    text-align: start;
    width: 100%;
}
.carpool .pool .flex-container .flex-rows ul li{
    list-style: none;
    padding: 5px 0px;
    display: flex;
    width: 300px;
    font-size: 18px;
}
.carpool .pool .flex-container .flex-rows ul li .icon{
    padding: 0 10px;
}
.carpool .pool .flex-container .flex-rows ul li h1{
    text-align: start;
    font-size: 12px;
}
@media(max-width: 700px){
    .carpool{
        display: block;
        width: 96%;
        margin-left: 2%;
    }
    .carpool .pool{
        width: 90%;
    }
    .carpool .pool .flex-container{
        display: flex;
        width: 100%;
    }
    .carpool .pool .flex-container .flex-rows{
        width: 100%;
        padding: 0 10px;
        margin-bottom: 0px;
    }
    .carpool .pool .flex-container .flex-rows h4{
        font-size: 1rem;
        display: flex;
        padding: 5px 0;
    }
    .carpool .pool .flex-container .flex-rows h4 img{
         margin-top: -90px !important;
    }
    .carpool .pool .head-up h3{
        font-size: 2rem;
        font-weight: 700;
        padding: 5px 10px;
    }
    .carpool .pool .head-up p{
        font-size: 18px;
    }
    .carpool .pool p{
        font-size: 15px;
        width: 100%;
    }
    .carpool .pool:last-child{
        padding: 10px 0;
        margin-left: 0;
        width: 98%;
    }
    .carpool .pool a{
        margin-bottom: 30px;
    }
    .carpool .pool img{
        width: 90%;
        margin-left: 5%;
        margin-top: -50px;
    }
}
 
/*slider starts*/
.bodys{
    margin: 0;
    padding: 0;
    height: 600px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #ED1C24;
    overflow: hidden;
}
.bodys .round{
    width: 400px;
    height: 400px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.384);
    overflow: hidden;
}
.bodys .round:first-child{
    float: left;
    transform: translate(-80%, 0);
}
.bodys .round:last-child{
    float: right;
    transform: translate(80%, 0);
}
.slider{
    width: 800px;
    height: 500px;
    border-radius: 10px;
    overflow: hidden;
    transform: translateX(0);
}
.slides{
    width: 500%;
    height: 500px;
    display: flex;
}
.slides input{
    display: none;
}

.slide{
    width: 20%;
    transition: .2s;
    text-align: center;
    align-items: center;
}
.slide h1{
    color: #fff;
    font-weight: 700;
    font-size: 3rem;
    margin-bottom: 30px;
}
.slide img{
    width: 200px;
    height: 200px;
    object-fit: cover;
    border-radius: 50%;
    pointer-events: none;
}
.slide p{
    color: #fff;
    width: 90%;
    margin-left: 5%;
}
.navigation-manual{
    position: absolute;
    margin-top: -20px;
    width: 100%;
    display: flex;
    justify-content: center;
}
.manual-btn{
    border: 2px solid #ffffff;
    padding: 5px;
    border-radius: 10px;
    cursor: pointer;
    transition: 1s;
}
.manual-btn:not(:last-child){
    margin-right: 40px;
}
.manual-btn:hover{
    background: rgb(255, 255, 255);
}
#radio1:checked ~ .first {
    margin-left: 0;
}
#radio2:checked ~ .first{
    margin-left: -20%;
}
#radio3:checked ~ .first{
    margin-left: -40%;
}
 
.navigation-auto{
    position: absolute;
    display: flex;
    justify-content: center;
    margin-top: 480px;
    width: 100%;
}
.navigation-auto div{
    border: 2px solid #ffffff;
    padding: 5px;
    border-radius: 10px;
    cursor: pointer;
    transition: 1s;
}
@media(min-width: 1380px) and (max-width: 3000px){
    .navigation-auto,.navigation-manual{
        margin-left: 0%;
        width: 100%;
        position: absolute;
    }
}
.navigation-auto div:not(:last-child){
    margin-right: 40px;
}

#radio1:checked ~ .navigation-auto .auto-btn1 {
    background-color: #fff;
}
#radio2:checked ~ .navigation-auto .auto-btn2 {
    background-color: #fff;
}
#radio3:checked ~ .navigation-auto .auto-btn3 {
    background-color: #fff;
}
@media(min-width: 701px) and (max-width: 1080px){
    .navigation-auto{
        margin-left: 0;
    }.navigation-manual{
        margin-left: 0;
    }

}
@media(max-width: 700px){
    .bodys{
        height: 350px;
        width: 100%;
        padding: 100px 0;
    }
    .slider{
        margin-top: 80px;
    }
    .navigation-manual{
        width: 100%;
        margin-top: -50px;
        margin-left: 0;
    }
    .bodys .round{
        display: none;
    }
    .navigation-auto{
        width: 100%;
        margin-left: 0;
        margin-top: 450px;
    }
    .slide p{
        margin-top: -20px;
        font-size: 1rem;
        width: 80%;
        text-align: center;
        justify-content: center;
        align-items: center;
        margin-left: 10%;
        line-height: 25px;
    }
    .slide img{
        width: 100px;
        height: 100px;
    }
    .slide h1{
        font-size: 1rem;
        padding: 20px 0;
    }
}
 /*slider  ends*/

  /*faq start*/
.question-section{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
}
.question-section a{
    color: var(--color);
    text-decoration: none;
    padding: 10px 0;
}
.section-title{
    padding: 10px 0;
}
.section-title h1{
    font-size: 2em;
    font-family: 'gilroy-bold',sans-serif;
    color: var(--black);
}
.section-title p{
    font-size: 1em;
    color: var(--black);
    font-weight: 600;
}

.faq{
    margin-top: 2rem;
    width: 700px;
    padding-bottom: 1rem;
    border-bottom: 1px solid #ececec;
    cursor: pointer;
}
.faq:nth-child(7){
    border-bottom: none;
}

@media(max-width: 700px){
    .faq{
        width: 90%;
    }
    .quetion-- h2{
        font-size: .8em;
    }
    .section-title h1{
        font-size: .8em;
    }
    .section-title{
        font-size: 1.5em;
    }
}
.quetion--{
    display: flex;
    justify-content: space-between;
    align-items: center;
    animation: ease-in .3s;
    margin: 10px 0;
}
.quetion-- h2{
    font-size: 1rem;
    font-weight: 600;
}
.answer{
    max-height: 0;
    overflow: hidden;
    transition: max-height .4s ease;
}
.answer p{
    padding-top: 1rem;
    line-height: 1.6;
    font-size: 1rem;
}
.faq #minus{
    display: none;
}
.faq.active- #minus{
    display: flex;
}
.faq.active- #plus{
    display: none;
}
.faq.active- .answer{
    max-height: 300px;
    animation: fade 1s ease;
}
.faq.active- .icon{
    transform: rotate(180deg);
    transition: transform 0.5s ease-in;
}
.faq.active- .icon i{
    transition: transform 0.5s ease-in;
}
@keyframes fade{
    from{
        opacity: 0;
        transform: translateY(-10px);
    }
    to{
        opacity: 1;
        transform: translateY(0);
    }
}
.Kiliride-chat-direct{
    width: 100%;
    height: auto;
    padding: 10px 0;
    margin: 80px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.Kiliride-chat-direct .chat-column-box{
    width: 80%;
    padding: 20px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background: #f8f8f8;
    border-radius: 10px;
}

.direct-flex-column{
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    margin: 10px 0;
}   
@media(max-width: 700px){
    .Kiliride-chat-direct .chat-column-box{
        width: 90%;
    }
    .direct-flex-column{
        width: 90%;
    }
}
.direct-flex-column h1{
    font-family: 'gilroy-bold',sans-serif;
    font-size: 1em;
}
.direct-flex-column p{
    font-size: 1em;
    font-weight: 500;
    text-align: center;
}
.direct-flex-column .translated-image{
    display: flex;
    justify-content: space-between;
    width: 120px;
}
.direct-flex-column .translated-image .image-flex{
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 3px solid #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}
.direct-flex-column .translated-image .image-flex:nth-child(2){
    transform: translate(-20px, -5px);
    z-index: 2;
}
.direct-flex-column .translated-image .image-flex:nth-child(3){
    transform: translateX(-40px);
    z-index: 1;
}
.direct-flex-column .translated-image .image-flex img{
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
}
 
  /*faq ends*/

 
 .question-container{
     width: 100%;
     display: block;
     margin: 10px 0;
     justify-content: center;
     text-align: center;
     align-items: center;
    margin-bottom: 50px;
 }
 .question-container h2{
     font-size: 1.5rem;
     margin: 50px 0 50px 0;
     font-weight: 800;
     color: var(--black);
 }
 .question-container h3{
    font-size: 2rem;
    margin: 50px 0 50px 0;
    font-weight: 800 !important;
    color: var(--black);
}
 .question-container a{
    text-decoration: none;
    color: #ED1C24;
    padding: 10px 0;
    margin-top: 10px;    
}
.question-container p{
    font-size: 12px;
}
 .question-container .question-box{
    padding: 10px 5px;
    background: #ffffff;
    border-radius: 10px;
    margin-left: 20%;
    margin-top: 20px;
    border: 1px solid rgba(145, 144, 144, 0.322);
    width: 60%;
}
.question-container .question-box button{
    width: 97%;
    height: 35px;
    border: none;
    border-radius: 40px;
    outline: none;
    color: var(--black);
    text-align: start;
    padding: 0 35px;
    font-weight: 600;
    font-size: 18px;
    background: #fff;
}
.question-container .question-box button i{
    font-size: 1.5rem;
    margin-top: -10px;
    float: right;
    margin-right: 0px;
     
}
.question-container .question-box .answer{
    padding: 10px 0;
    margin-top: 10px;
    display: block;
    height: 0;
    transition: 2s;
}
.question-container .question-box .answer a{
    text-decoration: none;
    color: #ED1C24;
}
.question-container .question-box .answer p{
    font-size: 18px;
    padding: 0 50px;
    text-align: justify;
    width: 90%;
    line-height: 25px;
}

@media(max-width: 700px){
    .question-container .question-box{
        margin-left: 3%;
        width: 90%;
        border-radius: 10px;
    }
    .question-container .question-box .answer{
        width: 90%;
    }
    .question-container .question-box button{
        font-size: 15px;
        background: none;
        padding: 0 5px;
    }
    .question-container .question-box button i{
        font-size: 15px;
    }
    .question-container .question-box button img{
        width: 20px;
        height: auto;
        margin-right: -5px;
    }
    .question-container .question-box .answer p{
        font-size: 15px;
        padding: 0 10px;
        width: 100;
    }
    .question-container h2{
        font-size: 1rem;
    }
}
 
.blog{
    width: 85%;
    height: auto;
    margin-bottom: 50px;
    margin-left: 8%;
    font-family: 'gilroy',sans-serif;
}
.blog h1{
    font-size: 3rem;
    font-weight: 700 !important;
    color: var(--black);
    text-align: center;
    padding: 10px 10px;
    font-family: 'gilroy-bold',sans-serif !important;
    margin: 20px 0 20px 0;
}
.blog h1 a{
    float: right;
    margin-right: 10px;
    text-decoration: none;
    color: var(--black);
    font-size: 15px;
}
.blog .blog-paragraph{
    justify-content: space-between;
    display: flex;
    width: 94%;
    margin-left: 3%;
    font-weight: 700;
    font-size: 22px;
    font-family: 'gilroy',sans-serif;
}
.blog .blog-paragraph a{
    text-decoration: none;
    color: var(--black);
    font-size: 1.5rem;
    font-family: 'gilroy',sans-serif;
    font-weight: 700;
    display: flex;
    gap: 10px;
}
.blog .blog-paragraph a i{
    width: 30px;
    height: 30px;
}
.blog p{
    font-size: 18px;
    padding: 0 0;
    text-align: start;
}
.blog .posts{
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    font-family: 'gilroy',sans-serif;
 }
 .blog .posts a{
    font-family: 'gilroy',sans-serif;
    text-decoration: none;
    color: var(--black);
 }
.blog .posts .post-box{
    width: 500px;
    margin-left: 1%;
    margin-top: 20px;
    padding: 5px;
    height: 200px;
    font-family: 'gilroy',sans-serif;
}
.blog .posts .post-box p{
    font-family: 'gilroy',sans-serif;
}
 
 
 
 
@media(min-width: 710px) and (max-width: 1080px){
    .blog .posts .post-box{
        height: 200px;
    }
    .blog .posts .post-box p a{
        font-size: 15px;
        line-height: 10px;
        width: 100%;
    }
    .blog p{
        font-size: 1rem;
    }
    .blog .blog-paragraph{
        font-size: 1rem;
    }
    .blog .posts .post-box:last-child a{
        margin-top: 50%;
    }
    .navigation-manual{
        width: 100%;
    }
    .navigation-auto{
        width: 100%;
    }
}
.blog .posts .post-box img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
    
}
.blog .posts .post-box p{
    width: 90%;
    font-size: 22px;
    padding: 20px 0;
   
}
.blog .posts .post-box p a{
    text-decoration: none;
    color: var(--black);
    font-size: 18px;
    font-weight: 500 !important;
    font-family: 'gilroy-bold' !important;
}
.log-x6{
    display: none;
}
@media(max-width: 700px){
    .blog{
        margin-bottom: 0;
        margin-top: -40px;
    }
    .blog p{
        font-size: 15px !important;
    }
    .blog .blog-paragraph a{
    display: none;
    }
    .blog .posts{
        display: block;
    }
    .blog h1{
        font-size: 1.2rem;
    }
    .blog .posts .post-box img{
        height: 200px;
        width: 100%;
        margin-left: 0;
    }
    .blog .posts .post-box{
        width: 100%;
        height: auto;
        margin-bottom: 5px;
        margin-left: 0;
        padding: 0 0;
    }
       .log-x6{
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: center;
        text-align: center;
        margin-top: 20px;
    }
    .call-to-action-new-log{
        width: 80%;
        padding: 12px 24px;
        background-color: var(--color);
        text-wrap: nowrap;
        color: #f2f1f1;
        text-decoration: none;
        border-radius: 5px;
        font-family: 'gilroy-bold',sans-serif;
        transition: .3s ease-in;
        margin: 5px;
    }
}

.email-box{
    width: 80%;
    margin-left: 10%;
    border-radius: 50px;
    height: 300px;
    padding: 0;
    margin-top: 150px;  
    background-image: url(images/email\ bacground\ screen.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    user-select: none;
    -ms-user-select: none;
    color: #fff;
}
.email-box .all-form{
    display: flex;
    width: 100%;
    padding: 0 50px;
    color: #fff;
}
.email-box h1{
    padding: 30px 50px 20px;
    font-size: 3rem;
    font-weight: 700;
}
.email-box p{
    padding: 0 50px 20px; 
    font-size: 18px;
    color: #fff;
}
.email-box input{
    padding: 15px 20px;
    background: #f8f8f8;
    color: var(--black);
    font-size: 15px; 
}
.email-box .form .all-form .email{
    width: 35%;
    border-radius: 20px;
    border: none;
    outline-color: #ED1C24;
    font-weight: 500;
}
.email-box input[type=submit]{
    background: #fff;
    border-radius: 30px;
    border: none;
    font-size: 1.2rem;
    outline: none;
    transition: ease-in .3s;
    margin-left: 20px;
    padding: 20px 50px;
    text-align: none;
    color: var(--black);
    font-weight: 700;
}
.email-box .error{
    background: #FFF;
    color: var(--black);
    padding: 10px 30px;
    display: none;
    font-size: 15px;
    justify-content: center;
    align-items: center;
    text-align: center;
    border-radius: 30px;
    width: 200px;
    margin-left: 50px;
}
 
@media(max-width: 700px){
    .email-box{
        margin-top: 10%;
        width: 100%;
        height: 100%;
        align-items: center;
        text-align: center;
        border-radius: 5px;
        margin-left: 0;
        padding: 20px 0;
    }
    .email-box .all-form{
        flex-direction: column;
        align-items: center;
        text-align: center;
        justify-content: center;
        padding: 0;
    }
    .email-box h1{
        padding: 10px 5px;
        font-size: 2rem;
    }
    .email-box .form .all-form .email{
        text-align: start;
        margin-left: 5px;
        width: 80%;
    }
    .email-box input[type=submit]{
        margin-left: -10px;
    }
    .email-box .error{
        margin-left: 0;
        margin-top: 5px;
    }
}

.footer{
    width: 85%;
    margin-left: 8%;
    height: auto;
    display: flex;
    margin-top: 30px;
    background: #F8F8F8;
}

 .horizontal{
    display: block;
    background: #F8F8F8;
    width: 85%;
    margin-left: 8%;
    height: 100px;
    border-bottom: #000;
  
}
.closing-bar{
    width: 85%;
    background-color: #f8f8f8;
    margin-left: 8%;
    height: auto;
}

.closing-bar .line{
    width: 100%;
    margin-left: 0;
    background-color: rgba(150, 150, 150, 0.473);
    height: 1px;
}
.closing-bar .buttom-bar{
    justify-content: space-between;
    width: 90%;
    margin-left: 0;
    color: var(--black);
    display: flex;
    padding: 20px 20px;
    margin-bottom: 20px;
}
@media(min-width: 701px) and (max-width: 1080px){
    .footer{
        width: 100%;
        margin-left: 0;
    }
    .horizontal{
        width: 100%;
        margin-left: 0; 
    }
 
    .closing-bar .buttom-bar{
        width: 95%;
        margin-left: 0%;
    } 
}
.closing-bar .buttom-bar .link a{
    text-decoration: none;
    display: flex;
    color: var(--black);color: var(--black);
    margin-right: 10px;
    width: auto;
    text-wrap: nowrap;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.closing-bar .buttom-bar .link{
    text-decoration: none;
    display: flex;
    gap: 10px;
    color: var(--black);
}
.horizontal .closing-web{
    margin-top: 10px;
    padding: 0 0px;
    width: 80%;
    margin-left: 1%;
    height: 100px;
    position: absolute;
    display: flex;
    justify-content: space-between;
}

.horizontal .closing-web .line-vty .row-links-x5s:hover{
    background-color: #ED1C24;
    color: #fff;
    border: none;
}
.horizontal .closing-web .line-vty .row-links-x5s:hover .fa-brands{
    color: #fff;
}
.horizontal .closing-web .line-vty .row-links-x5s:hover a{
    color: #fff;
}
.horizontal .closing-web .line-vty .row-links-x5s{
    background-color: #fff;
    width: auto;
    border-radius: 20px;
    border: 1px solid var(--black);;
    display: flex;
    transition: ease-in .3s;
    margin-right: 10px;
}
.horizontal .closing-web .line-vty .row-links-x5s:first-child i{
    color: #fff;
    margin-top: -1px;
}
.horizontal .closing-web .line-vty .row-links-x5s:first-child{
    background-color: #ED1C24;
    color: #fff;
    border: none;
}
.horizontal .closing-web .line-vty .row-links-x5s:first-child a{
    color: #fff;
}
.horizontal .closing-web .line-vty .row-links-x5s a{
    text-decoration: none;
    display: flex;
    color: var(--black);
    text-align: center;
    justify-content: center;
    padding: 13px 30px;
    font-size: 15px;
    text-wrap: nowrap;
}
.horizontal .closing-web .line-vty{
    display: flex;
    width: auto;
    height: 45px;
    margin-right: 10px;
}
.horizontal .closing-web .social{
    width: 100%;
    height: 20px;
    display: flex;
    text-align: start;
    align-items: left;
}
.horizontal .closing-web .social a{
    text-decoration: none;
}
.horizontal .closing-web .social .icons-:hover{
    background-color: #ED1C24;
}
.horizontal .closing-web .social .icons-:hover .fa-brands,svg{
    color: #ffffff;
}
.horizontal .closing-web .social .icons-{
    background-color: #fff;
    width: 40px;
    height: 40px;
    justify-content: center;
    text-align: center;
    align-items: center;
    transition: ease-in .5s;
    border-radius: 8px;
    margin-left: 4px;
}
.horizontal .closing-web .social .icons- .fa-brands{
    width: 20px;
    height: 20px;
    margin-top: 12px;
    color: var(--black);
}
.horizontal .closing-web .social .icons- svg{
    width: 20px;
    height: 15px;
    margin-top: 12px;
    color: var(--black);
}
.horizontal .hr-{
    width: 90%;
    margin-left: 5%;
    height: 1px;
    background-color: #dfdcdc;
}
@media(max-width: 700px){
    .horizontal .closing-web{
        flex-direction: column;
        height: auto;
    }
    .horizontal .closing-web{
        width: 100%;
    }
    .horizontal{
        width: 100%;
        margin-left: 0;
        margin-bottom: 0;
        height: auto;
    }
    .horizontal .closing-web .line-vty .row-links-x5s:first-child i{
        margin-top: -5px;
    }
    .horizontal .closing-web .social{
        padding: 40px 0;
        text-align: center;
        justify-content: center;
        align-items: center;
        width: 100%;
    }
    .horizontal .closing-web .social .icons-{
        margin-top: 20px;
    }
    .horizontal .closing-web .line-vty{
        flex-direction: column;
        margin-top: -5px;
        padding: 20px 20px;
        height: auto;
        margin-bottom: 30px;
        justify-content: center;
        align-items: center;
    }
    .horizontal .closing-web .line-vty .row-links-x5s{
        margin-top: 10px;
        width: auto;
        padding: 5px 20px;
        border-radius: 30px;
        text-wrap: nowrap;
    }
    .horizontal .closing-web .line-vty .row-links-x5s a{
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 10px 5px;
        border-radius: 20px;
  
        text-wrap: nowrap;
    }
    .closing-bar .buttom-bar{
        flex-direction: column;
        height: auto;
        margin-bottom: 10px;
        margin-top: 280px;
    }
    .closing-bar .buttom-bar .copy{
        justify-content: center;
        align-items: center;
        text-align: center;
    }
    .closing-bar{
        width: 100%;
        margin-left: 0;
        padding: 0;
    }
    .closing-bar .buttom-bar .link{
        display: block;
        width: 100%;
        height: auto;
        padding: 20px 0;
       justify-content: center;
       align-items: center;
       text-align: center;
     }
    .closing-bar .buttom-bar .link a{
        display: inline-flex;
        padding: 20px 0;
        justify-content: center;
        align-items: center;
        text-align: center;
    }
}
.footer .footer-content{
    width: 30%;
    display: block;
    margin-left: 5px;
    padding: 10px 10px;
}
@media(min-width: 701px) and (max-width: 1080px){
    .closing-bar{
        width: 100%;
        margin-left: 0%;
    }
}
.footer .footer-content p{
    padding: 0 10px;
    width: 90%;
    font-size: 15px;
    text-align: start;
    margin-top: 50px;
}
.footer .footer-content .top{
    width: 150px;
    height: 50px;
    margin: 20px 15px;
    margin-top: 40px;
}
.footer .footer-content .top img{
    top: 0;
    margin-top: -15px;
    width: 100%;
    height: auto;
    object-fit: cover;
      
}
.footer .footer-content .coming-soon{
    display: flex;
    width: 100%;
    margin-left: 0;
    margin-top: 20px;
    margin-bottom: 40px;
}
.footer .footer-content .coming-soon a{
     margin-left: 10px;
    text-decoration: none;
    color: var(--black);
}
.footer .footer-content .coming-soon .soon{
    width: 100%;
    margin-left: 0;
    padding: 10px 10px;
    border: 1px solid #707070;
    border-radius: 20px;
    background: transparent;
    gap: 10px;
}
.footer .footer-content .coming-soon .soon img{
    width: 15px;
    height: 15px;    
}

.footer .footer-content .rows-bts{
    display: flex;
    width: 100%;
}
.footer .footer-content .rows-bts .row{
    margin-left: 2%;
    padding: 10px 15px;  
}

.footer .footer-content .rows-bts .row ul{
    display: block;
    padding: 0 5px;
}
.footer .footer-content .rows-bts .row ul a{
    text-decoration: none;
    color: var(--black);
}
.footer .footer-content .rows-bts .row h1{
    font-size: 1.2rem;
    font-weight: 800 !important;
    color: var(--black);
    margin-left: 2px;
    padding: 10px 0;
    margin-top: 30px;
    text-wrap: nowrap;
    word-wrap: nowrap;
}
.footer .footer-content .rows-bts .row ul li{
    text-decoration: none;
    color: var(--black);
    list-style: none;
    padding: 10px 0;
}


@media(max-width: 700px){
    .footer .footer-content .rows-bts .row h1{
        font-size: 1.2rem;
    }
    .footer{
        width: 100%;
        display: block;
        margin-left: 0;
        margin-top: 60px;
    }
    .footer .footer-content{
        width: 90%;
        margin-left: 3%;
        padding: 10px 5px;
    }
    .footer .footer-content .top{
        margin: 0;
    }
    .footer .footer-content .rows-bts{
        display: block;
    }
    .footer .footer-content .rows-bts .row{
        padding: 0;
    }
    .footer .footer-content .coming-soon {
        margin-left: -10px;
        font-size: 15px;
    }
    .footer .footer-content .coming-soon .soon{
        margin-left: 0;
    }

}


 

/*working on ride page*/
.ride{
    width: 85%;
    margin-left: 6.5%;
    margin-top: 100px;
    margin-bottom: 40px;
    height: auto;
}

.ride .rides{
    width: 100%;
    height: 500px;
    display: inline-block;
    margin-left: 20px;
    background-image: url(images/joyous-woman-infront-of-wall-royalty-free-image-1609631350_.jpeg);
    background-repeat: no-repeat;
    background-size: cover;
    object-fit: cover;
}
.ride .rides .buttom-line{
    width: 100%;
    height: 150px;
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.ride .rides .buttom-line a{
    width: 150px;
    text-decoration: none;
    padding: 10px 5px;
    color: #fff;
    font-size: 18px;
    border-radius: 30px;
    font-weight: 700;
    margin-left: 10px;
    transition: ease-in .1s;
}
 
.ride .rides .buttom-line a:first-child{
    background-color: #fff;
    color: var(--black);
    box-shadow: 0 4px 8px 1px rgba(0, 0, 0, 0.2);
}
.ride .rides .buttom-line a:last-child{
    background-color: #ED1C24;
}

.ride .rides .rider{
    padding: 10px 50px;
    text-align: start;
    bottom: 0;
    margin-top: 10%;
    width: 600px;
    height: auto;
}
.ride .rides .rider h1{
    font-size: 6rem;
    font-weight: 600;
    color: #fff;
    margin: 0;
}

.ride .rides .rider p{
    font-size: 1.2rem;
    color: #ffffff;
    margin: 0 0 10px 0;
    width: 100%;
    margin-top: 0;
    line-height: 28px;
    font-weight: 600;
    margin-bottom: 10px;
}
.ride .rides .rider a{
    border-radius: 20px;
    color: var(--black);
    background-color: #ffffff;
    padding: 10px 30px;
    text-decoration: none;
    transition: ease-in .3s;
    font-weight: 700;
}
.ride .rides .rider a:hover{
    background-color: #ED1C24;
    color: #fff;
}
@media (max-width: 700px){
    .ride{
        width: 100%;
        margin-left: 0%;
        margin-top: 80px;
        display: flex;
        flex-direction: column-reverse;
        height: auto;
     }
    .ride .rides{
        padding: 0 0;
        margin-left: 0;
        width: 100%;
        background-repeat: no-repeat;
        background-size: 600px;
    }
    .ride .rides .rider{
        padding: 0 10px;
        align-items: center;
        text-align: center;
        width: 95%;
       
    }
    .ride .rides .rider h1{
        text-align: start;
        margin-bottom: 5px;
        font-size: 80px;
    }
    .ride .rides .buttom-line{
        margin-top: -40px;
    }
    .ride .rides .rider h2{
        text-align: center;
        font-size: 1.5rem;
        width: 100%;
        color: var(--black);
        font-weight: 700;
    }
    .ride .rides .rider p{
        font-size: 1rem;
        line-height: 20px;
        text-align: start;
        padding: 0 5px;
    }
    .ride .rides:first-child img{
        margin-top: -100px;
        height: 350px;
    }
   
}

.layers-{
    background-color: #f8f8f8; 
    width: 85%;
    height: auto;
    margin-left: 8%;
    display: flex;
}
.layers- .layer- img{
    width: 100%;
    margin-top: 40px;
    margin-left: 40px;
    height: 300px;
    object-fit: cover;
    align-items: center;
    border-radius: 20px;
    text-align: center;
}
.layers- .layer-{
    width: 45%;
    height: 400px;
    padding: 10px 20px;
}
 
.layers- .layer- .layer-xs1{
    margin-top: 50px;
    width: 100%;
    text-align: start;
    align-items: start;
}
.layers- .layer- .layer-xs1 h2{
    text-align: start;
    line-height: 40px;
    font-size: 1.5rem;
    width: 100%;
    color: var(--black);
    font-weight: 700;
    margin-bottom: 20px;
}
.layers- .layer- .layer-xs1 p{
    font-size: 1.5rem;
    line-height: 28px;
    font-size: 1rem;
    padding: 0;
    width: 100%;
    margin-bottom: 30px;
}
@media (max-width: 700px){
    .layers-{
        width: 100%;
        margin-left: 0;
        margin-bottom: 50px;
        padding: 0 0;
        margin-top: -30px;
        flex-direction: column;
    }
    .layers- .layer- a{
        margin-left: 20px;
    }
    .layers- .layer-{
        width: 100%;
        margin-left: 0;
        height: auto;
        padding: 0;
        background-color: #f8f8f8;
    }
   
    .layers- .layer- .layer-link{
        width: 100%;
        align-items: center;
        text-align: center;
        justify-content: center
    } 
  
    .layers- .layer-:last-child{
        width: 100%;
        margin-left: 0;
    }
    .layers- .layer- .layer-xs1{
        margin-top: 50px;
        padding: 20px 0;
    }
    .layers- .layer- img{
        width: 90%;
        margin-left: 5%;
        padding: 0;
    }
    .layers- .layer- .layer-xs1 h2{
        font-size: 1.7rem;
        padding: 0 20px;
        width: 90%;
    }
    .layers- .layer- .layer-xs1 p{
        font-size: 18px;
        padding: 0 20px;
        width: 90%;
        margin-bottom: 40px;
    }
}
/*key feature transition*/
section{
    display: flex;
    justify-content: center;
    align-items: center;
}
section .containing{
    margin: 10px;
}
section .containing h4{
    font-size: 1.5rem;
    font-weight: 700;
    text-align: center;
    align-items: center;
    justify-content: center;
}
section .containing .member{
    height: auto;
}

/*slider starts*/
section .containing .member .bodys-st{
    margin: 0;
    padding: 40px 0;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #f8f8f8;
    width: 85%;
    margin-left: 8%;
    overflow: hidden;
}
section .containing .member .slider-st{
    width: 1150px;
    height: 400px;
    border-radius: 10px;
    overflow: hidden;
    transform: translateX(0);
    justify-content: center;
    text-align: center;
    align-items: center;
}
section .containing .member h1{
    text-align: center;
    justify-content: center;
    align-items: center;
    color: var(--black);
    font-size: 2rem;
    font-weight: 700;
    padding: 10px 0;
}
section .containing .member p{
    line-height: 28px;
    padding: 30px 0;
}
section .containing .member .slides-st{
    width: 165%;
    height: 500px;
    scroll-snap-type: X mandatory;
    display: flex;
    justify-content: center;
    align-items: start;
    text-align: start;
}
section .containing .member .slides-st input{
    display: none;
}

section .containing .member .slide-st{
    width: 20%;
    transition: .2s;
    text-align: center;
    align-items: center;
}
section .containing .member .slide-st h1{
    color: var(--black);
    font-weight: 700;
    font-size: 1.2rem;
    margin-bottom: 0;
}
section .containing .member .slide-st h1:last-child{
    font-size: 1rem;
}
section .containing .member .slide-st img{
    width: 300px;
    height: 200px;
    object-fit: cover;
    border-radius: 15px 15px 0 15px; 
}
section .containing .member .slide-st p{
    color: #fff;
    width: 90%;
    margin-left: 5%;
}
section .containing .member .navigation-manual-st{
    position: absolute;
    width: 100%;
    margin-top: -150px;
    margin-left: 0;
    display: flex;
    justify-content: center;
 
}
section .containing .member .manual-btn-st{
    border: 2px solid #ED1C24;
    padding: 5px;
    border-radius: 10px;
    cursor: pointer;
    transition: 1s;
}
section .containing .member .manual-btn-st:not(:last-child){
    margin-right: 40px;
}
section .containing .member .manual-btn-st:hover{
    background: #ED1C24;
}
#radio1:checked ~ .first-st {
    margin-left: 0;
}
#radio2:checked ~ .first-st{
    margin-left: -40%;
}
#radio3:checked ~ .first-st{
    margin-left: -80%;
}
#radio4:checked ~ .first-st{
    margin-left: -120%;
}
#radio5:checked ~ .first-st{
    margin-left: -160%;
}
 
section .containing .member .navigation-auto-st{
    position: absolute;
    display: flex;
    width: 100%;
    justify-content: center;
    margin-top: 350px;
    margin-left: -65%;
}
section .containing .member .navigation-auto-st div{
    border: 2px solid #ED1C24;
    padding: 5px;
    border-radius: 10px;
    cursor: pointer;
    transition: 1s;
}
section .containing .member .navigation-auto-st div:not(:last-child){
    margin-right: 40px;
}

#radio1:checked ~ .navigation-auto-st .auto-btn1-st {
    background-color: #ED1C24;
}
#radio2:checked ~ .navigation-auto-st .auto-btn2-st {
    background-color: #ED1C24;
}
#radio3:checked ~ .navigation-auto-st .auto-btn3-st {
    background-color: #ED1C24;
}
#radio4:checked ~ .navigation-auto-st .auto-btn4-st {
    background-color: #ED1C24;
}
#radio5:checked ~ .navigation-auto-st .auto-btn5-st {
    background-color: #ED1C24;
}
@media(min-width: 701px) and (max-width: 1080px){
    section .containing .member{
        margin-left: 0%;
        width: 100%;
    }
    section .containing{
        margin: 0;
        width: 100%;
    }
    section .containing .member .bodys-st{
        width: 100%;
         margin-left: 0;
    }
    section .containing .member .slide-st{
        margin-left: 50px;
    }
}
@media(max-width: 700px){
    section .containing .member{
       
        width: 100% !important;
        margin-left: 1px;
    }
    section .containing .member .bodys-st{
        height: auto;
        width: 100%;
        padding: 0 0;
        margin-left: -10px;
 
    }
    section .containing .member h1{
        font-size: 1.5rem;
        padding: 20px 0;
    }
    section .containing .member p{
        text-align: center;
        width: 90%;
        margin-left: 3%;
        padding: 20px 0;
    }
    section .containing p{
        padding: 20px 0;
    }
    section .containing .member .slide-st{
       margin-left: 200px;
    }
    section .containing{
        margin: 0;
        width: 100%;
    }
    section .containing .member .slide-st h1{
        margin-left: 250px;
        width: 300px;
        padding: 10px 0;
    }

    section .containing .member .slide-st{
        display: block;
    }
    section .containing .member{
        width: 330px;
    }
    section .containing .member .slide-st img{
        margin-left: 300px;
    }
    #radio1:checked ~ .first-st {
        margin-left: 37%;
    }
    #radio2:checked ~ .first-st{
        margin-left: -55%;
    }
    #radio3:checked ~ .first-st{
        margin-left: -135%;
    }
    #radio4:checked ~ .first-st{
        margin-left: -210%;
    }
    #radio5:checked ~ .first-st{
        margin-left: -300%;
    }
 
}

/*video player*/
.video-player{
    width: 100%;
    height: 400px;
    justify-content: center;
    align-items: center;
    text-align: center;
    display: flex;
}
.video-player .player-{
    width: 60%;
    height: 100%;
    border-radius: 10px;
}
.video-player .player- video{
    width: 100%;
    height: 100%;
    pointer-events: none;
    border-radius: 10px;
    object-fit: cover; 
}
.video-player .player- iframe{
    height: 100%;
    width: 100%;
    border-radius: 10px;
    object-fit: cover; 
}
.video-player .player- video:focus{
    outline: none;
}
@media(max-width: 700px){
    .video-player .player-{
        width: 100%;
    }
    .video-player .player- iframe{
        width:90%;
    }
    
}
 
 /*slider  ends*/
.pulse{
    width: 150px;
    height: 50px;
    background: #ED1C24;
    position: absolute;
    border-radius: 40px;
    place-items: center;
    color: #fff;
    margin: auto;
    display: grid;
}
.pulse a{
    text-decoration: none;
    color: #fff;
}
.pulse:before,
.pulsea:after{
    content: "";
    position: absolute;
    background: #ED1C24;
    height: 80%;
    width: 80%;
    z-index: -1;
    opacity: 0.8;
    border-radius: 40px;
}
.pulse:before{
    animation: pulse 1.5s ease-out infinite;
}
.pulse:after{
    animation: pulse 1.8s 1s ease-out infinite;
}
@keyframes pulse{
    100%{
        transform: scale(1.7);
        opacity: 0;
    }
}
 
section h2{
    font-size: 40px;
    text-align: center;
    color: var(--black);
    padding: 20px 0;
    font-weight: 700;
}
section p{
    font-size: 15px;
    width: 80%;
    margin-left: 10%;
    text-align: center;
    align-items: center;
    justify-content: center;
}
section .cards{
    display: flex;
    margin-top: 20px;
    align-items: center;
    text-align: center;
    justify-content: center;
    margin-bottom: 30px; 
    margin-left: 0;
}
  .cards-{
    display: flex;
    margin-top: 20px;
    align-items: center;
    text-align: center;
    justify-content: center;
    margin-bottom: 30px;
}

section .cards .text-card .iconin-box{
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #ED1C24;
    margin-left: 40%;
    margin-top: 20px;
    align-items: center;
    text-align: center;
    justify-content: center;
}
section .cards .text-card .iconin-box i{
    color: #fff;
    width: 50px;
    height: 50px;
    margin-top: 15px;
}
section .cards .text-card{
    background: #f8f8f8;
    border-radius: 20px;
    margin: 20px;
    padding: 25px 20px;
    height: 230px;
    width: 250px;
    transition: ease-in .1s;
}
section .cards .text-card:hover{
    box-shadow: 0 4px 8px 1px rgba(0, 0, 0, 0.2);
    border-top: 4px solid #ED1C24;
    background-color: #fff;
    transform: scale(1.1); 
}
section .cards .text-card p{
    text-align: center;
    align-items: center;
    justify-content: center;
    font-size: 15px;
   
}
section .cards .text-card h3{
    font-size: 15px;
    margin-top: 30px;
    text-align: center;
    margin-bottom: 10px;
    color: var(--black);
    font-weight: 700 !important;
}
@media (max-width: 900px){
    section {
        margin-left: 1%;
        padding: 0;
        width: 100%;
    }
    section .cards{
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        width: 100%;
    }
}
@media(max-width: 700px){
    section .cards .text-card{
        width: 80%;
        height: 20%;
        margin-top: 10px;
        margin-left: 10px;
    }
    section .cards .text-card .iconin-box{
        margin-left: 43%;
    }
    section .cards .text-card h3{
        font-size: 1.2rem;
    }
    ::-webkit-scrollbar{
        display: none;
    }
    section .cards .text-card p{
        font-size: 15px;
    }
    section p{
        font-size: 1rem;
    }
    section .cards .text-card:hover{
        height: auto;
    }
    section .containing h2{
        font-size: 1.5rem;
    }
}
.reveal{
    position: relative;
    transform: translateY(80px);
    opacity: 0;
    transition: all 2.5s ease;
}
.reveal.active{
    transform: translateY(0px);
    opacity: 1;
}
/*key feature transition ends*/

.key-feature a{
    background-color: #ED1C24;
    padding: 10px 20px;
    color: #fff;
    margin-left: 50%;
    border-radius: 20px;
    text-align: center;
    justify-content: center;
    align-items: center;
    text-decoration: none;
}




/*partner form start*/
.kiliride-partner-form{
    width: 100%;
    justify-content: center;
    align-items: center;
    display: flex;
    margin: 100px 0;
}
.kiliride-partner-form .kili-partner-form-holder{
    width: 80%;
    max-width: 1200px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px;
    background-color: #08031A;
    border-radius: 30px;
}
.kiliride-partner-form .kili-partner-form-holder .partner-tab{
    height: 500px;
    width: 400px;
    margin: 0 10px;
    padding: 0 20px;
    background-color: red;
    border-radius: 20px;
}
.kiliride-partner-form .kili-partner-form-holder .partner-tab:nth-child(2){
    position: relative;
    padding: 0;
    margin: 0;
}
.kiliride-partner-form .kili-partner-form-holder .partner-tab:nth-child(2) img{
    object-fit: contain;
    height: 600px;
    width: 500px;
    position: absolute;
    bottom: -1px;
}

.kiliride-partner-form .kili-partner-form-holder .partner-tab:nth-child(1){
    background-color: #fff;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form-{
    display: block;
    width: 100%;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- h1{
    font-family: 'gilroy-bold';
    color: #1A0244;
    margin: 20px 0 10px;
    font-size: 24px;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- p{
    color: #1A0244;
    font-size: 15px;
    line-height: 18px;
    font-weight: 500;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form{
    margin-top: 20px;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .inputs-first{
    display: flex;
    width: 100%;
    margin: 10px 0;
    justify-content: space-between;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .inputs-first .first-{
    width: 190px;
}
@media(min-width: 581px) and (max-width: 970px){
    .kiliride-partner-form .kili-partner-form-holder .partner-tab:nth-child(2){
        display: none;
    }
    .kiliride-partner-form .kili-partner-form-holder{
        width: 90%;
    }
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .inputs-first .first- label{
    display: block;
    color: #1A0244;
    margin-bottom: 5px;
    font-family: 'gilroy-bold';
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .inputs-first .first- .input-bar{
    width: 180px;
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #C4C0D3;
    outline: none;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input{
    width: 100%;
    display: block;
    margin: 10px 0;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input label{
    display: block;
    color: #1A0244;
    margin-bottom: 5px;
    font-family: 'gilroy-bold';
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input .baner{
    display: flex;
    justify-content: space-between;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input .baner .flag{
    background-color:#EFEFEF;
    width: 70px;
    display: flex;
    justify-content: center;
    padding: 10px;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    border-top: 1px solid #C4C0D3;
    border-bottom: 1px solid #C4C0D3;
    border-left: 1px solid #C4C0D3;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input .baner .flag img{
    object-fit: contain;
    width: 30px;
    height: 20px;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input .baner .flag span{
    font-family: 'gilroy-bold';
    margin: 0 2px;
    color: #1A0244;
} 
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input .baner .flag-input{
    width: 330px;
    padding: 10px;
    border-top: 1px solid #C4C0D3;
    border-bottom: 1px solid #C4C0D3;
    border-right: 1px solid #C4C0D3;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-left: none;
    outline: none;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input select{
    width: 400px;
    padding: 10px;
    border: 1px solid #C4C0D3;
    border-radius: 8px;
    color: #1A0244;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    outline: none;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input select option{
    background-color: #fff;
    color: #1A0244;
    margin: 5px 0;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input .motor-attribute{
    display: flex;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input .motor-attribute .check{
    padding: 5px;
    border-radius: 5px;
    color: var(--color);
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input .motor-attribute span{
    margin-left: 5px;  
    color: #1A0244;
    font-weight: 700; 
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .submit{
    width: 100%;
    margin: 10px 0;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .submit p{
    color: #1A0244;
    margin: 5px 0;
    font-size: 15px !important;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .submit .submit-btn{
    width: 100%;
    padding: 10px;
    text-align: center;
    border: none;
    background-color:#EFEFEF;
    font-family: 'gilroy-bold';
    border-radius: 8px;
}
.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .form-error{
    width: 100%;
    background-color: red;
    padding: 10px 0;
    display: none;
    text-align: center;
    color: #fff;
}
@media(max-width: 580px){

.kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input .baner .flag-input{
     
    padding: 15px 10px;
}
    .kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input select{
    width: 98%;
    padding: 15px 10px;
}
    .kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .other-input .motor-attribute{
    margin: 5px 0;
}
    .kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .submit p{
    font-size: 12px;
    margin: 5px 0;
}
    .kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .submit .submit-btn{
    padding: 15px 0;
}
    .kiliride-partner-form .kili-partner-form-holder 
    .partner-tab .partner-form- .sign-up-form .inputs-first .first-{
        width: 100%;
    }
        .kiliride-partner-form .kili-partner-form-holder 
    .partner-tab .partner-form- .sign-up-form .inputs-first{
        flex-direction: column;
    }
    .kiliride-partner-form .kili-partner-form-holder .partner-tab:nth-child(2){
        display: none;
    }
    .kiliride-partner-form .kili-partner-form-holder{
        width: 90%;
    }
    .kiliride-partner-form .kili-partner-form-holder .partner-tab{
        width: calc(100% - 20px);
        height: auto;
        padding: 30px 20px;
    }
    .kiliride-partner-form .kili-partner-form-holder 
.partner-tab .partner-form- .sign-up-form .inputs-first .first- .input-bar{
    width: 92%;
    padding: 15px 10px;
    margin: 5px 0;
}
}
/*partner form end ends*/






.partners{
    background-color: #F8F8F8;
    height: 500px;
    width: 100%;
    margin-left: 0;
    margin-top: -50px;
    margin-bottom: 40px;
    background-image:linear-gradient(rgba(4,9,30,0.5),rgba(4,9,30,0.5)), url(images/webp/INFLUENCER-kili.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    object-fit: cover;
}
.col-space{
    width: 85%;
    height: 300px;
    margin-left: 8%;
    background-color: #f8f8f8;
    background-image: url(images/flex/SVG\ SAVED.svg);
    background-repeat: no-repeat;
    pointer-events: none;
    background-size: cover;
    margin-bottom: 40px;
}
.partners section{
    float: right;
    margin-top: 50px;
    margin-right: 50px;
    background-color: #ffffff;
    width: 400px;
    height: auto;
    border-radius: 10px;
    box-shadow: 0 4px 8px 1px rgba(0, 0, 0, 0.2);
    align-items: center;
    text-align: center;
    z-index: 9999;
  
}

.partners section .form{
    width: 90%;
    height: 90%;
}
.partners section .form h1{
    padding: 15px 10px;
    font-weight: 700;
    margin-bottom: 20px;
    color: var(--black);
    text-align: start;
    margin-bottom: 10px;
}
.partners section .form .input{
    display: block;
    width: 100%;
    height: auto;
    align-items: start;
    text-align: start;
    padding: 2px 10px;
    margin-bottom: 10px;
}
 
::placeholder{
    font-size: 15px; 
}
.partners section .form .input.success input{
    border-color: #09c372;
}
.partners section .form .input.fail input{
    border-color: #ED1C24;
}
.partners section .form .message{
    width: 100%;
    height: auto;
    text-align: center;
    font-size: 15px;
    color: var(--black);
    background-color: #f8f8f8;
    padding: 10px 0;
    display: none;
    border-radius: 10px;
    margin-bottom: 10px;
    font-size: 12px;
}
.partners section .form .input select{
    width: 94%;
    border: none;
    padding: 10px ;
    outline-color: #ED1C24;
    background-color: #f8f8f8;
    border-radius: 10px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url(images/do.png);
    background-repeat: no-repeat;
    background-size: 10px;
    background-position: 300px 10px;
    color: #0000ff;
    font-size: 15px;
}
.partners section .form .input select option{
    padding: 15px 0;
    background-color: #f8f8f8;
    color: var(--black);
    border: 1px solid #fff;
    outline: none;
    font-size: 15px;
}
 
 
.partners section .form .input input[type="submit"]{
    background-color: #ED1C24;
    border: none;
    outline: none;
    color: #FFF;
    font-weight: 800;
    font-size: 18px;
    border-radius: 20px;
    width: 95%;
}
.partners section .form .input input{
    width: 90%;
    padding: 15px 10px;
    outline: none;
    border: none;
    background-color: #f8f8f8;
    margin-bottom: 5px;
    border-radius: 10px;
    margin-top: 5px;
    outline-color: #ED1C24;
}
.partners section .form .input .error{
    color: #ED1C24;
    font-size: 12px;
 
}
.partners section .form .input label{
    font-size: 15px;
    color: var(--black);
    font-weight: 700;
    padding: 5px;
}
.partners .partner{
    width: 45%;
    height: 500px;
    text-align: start;
    padding: 20px 25px;
}
.partners .partner:first-child{
    padding: 0 50px;
}
.partners .paragraph{
    width: 50%;
    padding: 0 50px;
    transform: translateY(150%);
}
@media(min-width: 701px) and (max-width: 1100px){
    .col-space{
         background-position: -20px;
    }
    .partners section{
        margin-right: 10px;
    }
    .partners section{
        width: 40%;
    }
    .partners .paragraph{
        width: 50%;
        transform: translateY(70%);
    }
    .partners .paragraph h1{
        line-height: 50px; 
    }
    
}
.partners .paragraph h1{
    font-size: 2rem;
    color: #ffffff;
    font-weight: 800;
    line-height: 40px;
    margin-top: 20%;
    margin-bottom: 10px;
}
.partners .paragraph p{
    color: #fff;
    margin-bottom: 30px;
    line-height: 28px;
}
.partners .partner a{
    background-color: #ED1C24;
    color: #fff;
    text-align: center;
    padding: 10px 25px;
    border-radius: 20px;
    text-decoration: none;
}
.partners .partner img{
    width: 100%;
    height: 90%;
    margin-left: -20px;
    object-fit: cover;
    border-radius: 30px;
}
@media(max-width: 700px){
    .partners section .form{
        margin-left: 0;
        height: auto;
    }
    .partners section .form .input{
        padding: 0 7px;
    }
    .partners section .form .input {
        font-size: 15px;
    }
    .partners{
        display: block;
        width: 100%;
        height: 400px;
        padding: 0;
        margin-top: 80px;
        margin-left: 0;
        margin-bottom: 0;
    }
    .col-space{
        width: 100%;
        margin-left: 0;
        background: transparent;
        margin-bottom: 0;
        display: none;
    }
    .partners section{
        float: unset;
        width: 80%;
        height: auto;
        margin-left: 10%;
        align-items: center;
        margin-top: 100px;
    }
    .partners .paragraph{
        width: 100%;
        padding: 0 20px;
        transform: translateY(40%);
    }
    .partners .paragraph h1{
        font-size: 25px;
        line-height: 28px;
    }
    .partners .paragraph p{
        font-size: 1rem;
        width: 90%;
        line-height: 25px;
    }
}

@media(min-width: 100px) and (max-width: 376px){
 
}

/* fleet owner slider*/
.bonding{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-bottom: 50px;
    margin-top: 150px
}
.contents{
    height: 500px;
    width: 85%;
    margin-left: 5px;
    overflow: hidden;
    position: relative;
}
.contents .images{
    width: 100%;
    height: 100%;
}
.images .img{
    height: 100%;
    width: 100%;
    transition: all ease;
    background-color: #f8f8f8;
}
.images .img .paragraphs{
    float: left;
    width: 50%;
    height: 100%;
    background-color: #F8F8F8;
    padding: 20px 0;
    transform: translateY(30%);
}
.images .img .paragraphs h1{
    font-size: 2rem;
    color: var(--black);
    margin: 5px 0 20px 0;
    text-align: start;
    padding: 0 20px;
    font-weight: 700;
}
.images .img .paragraphs p{
    line-height: 28px;
    font-size: 18px;
    color: var(--black);
    text-align: start;
    padding: 10px 20px;
}
.images .img img{
    height: 100%;
    width: 50%;
    border-radius: 20px;
    float: right;
    object-fit: cover;
}
.btm-sliders{
    position: absolute;
    bottom: 5px;
    left: 0;
    overflow: hidden;
    justify-content: center;
    transform: translateY(-8800%);
    height: 5px;
}
.btm-sliders span{
    border: none;
    background-color: #c5bfbf;
    margin: 0 0;
    margin-left: 0;
    padding: 0 30px;
    height: 5px !important;
    border-radius: none;
    cursor: pointer;
}
.contents .slide:hover .fa-solid{
    color: #fff;
}
.contents .slide .fa-solid{
    text-align: center;
    align-items: center;
    justify-content: center;  
    padding: 15px 0;
    font-size: 18px;
}
.contents .slide{
    position: absolute;
    top: 85%;
    transform: translateX(-50%);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 1px solid #cacaca;
    margin-left: 50px;
    text-align: center;
    align-items: center;
    justify-content: center;
}
.contents .slide:hover{
    background-color: #ED1C24;
    border: none;
}
.contents .right{
    right: 85%;
}
@media(min-width: 701px) and (max-width: 1080px){
    .contents .right{
        right: 75%;
    }
    .btm-sliders span{
        padding: 0 15px;
    }
    .images .img .paragraphs h1{
        font-size: 25px;
        text-wrap: nowrap;
    }
    
}
@media(max-width: 700px){
    .contents .slide .fa-solid{
        padding: 15px 0;
    }
    .contents .slide{
        top: 73%;
        transform: translateX(70%);
    }
    .contents .left{
        right: 65%;
    }
    .contents .right{
        right: 45%;
    }
   .bonding{
       height: 80vh;
       margin-top: 480px;
       background-color: #F8F8F8;
        width: 96%;
       margin-left: 2%;
       margin-bottom: 50px;
   }
   .contents{
       margin-top: 50px;
       height: 800px;
       width: 100%;
       margin-left: 0;
   }
   .btm-sliders{
    width: 100%;
    transform: translateY(-15000%); 
    margin-left: -20px;
    padding: 0 0;
   }
   .images .img{
    display: block;
    height: 80%;
   }
    .images .img img{
        float: unset;
        margin-left: 0;
        object-fit: cover;
        height: 250px;
        width: calc(100% - 5px);
        display: block;
        margin-top: 20%;
    }
    .images .img .paragraphs{
        float: unset;
        width: 100%;
        margin-top: 0;
        height: auto;
    }
    .images .img .paragraphs p{
        font-size: 1rem;
        width: 95%;
        padding: 2px 10px;
    }
    .images .img .paragraphs h1{
        font-size: 22px;
        text-align: center;
        justify-content: center;
        align-items: center;
    }
}
@media(min-width: 250px) and (max-width: 350px){
    .bonding{
        margin-top: 580px !important;
    }
}
@media(min-width: 351px) and (max-width: 390px){
    .bonding{
        margin-top: 550px !important;
    }
}
@media(min-width: 395px) and (max-width: 410px){
    .bonding{
        margin-top: 400px !important;
    }
}
@media(min-width: 411px) and (max-width: 430px){
    .bonding{
        margin-top: 520px !important;
    }
}
 
 

.kit-box-1s{
    width: 100%;
    height: auto;
    text-align: center;
    justify-content: center;
    align-items: center;
    background-color: #ED1C24;
}
.kit-box-1s h1{
    font-size: 2rem;
    font-weight: 700;
    color: #fff;
    padding: 0;
    padding: 50px 0;
}
@media(max-width: 700px){
    .kit-box-1s h1{
        font-size: 1.4rem;
        margin-top: -50px;
    }
    .kit-box-1s{
        margin-top: 20%;
    }
}

.title-local{
    width: 100%;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 10px 0;
}
.title-local h1{
    font-weight: 700;
    font-size: 2rem;
}
.squeced-kit{
    height: 410px;
    width: 100%;
    margin-top: 20px;
    margin-bottom: 30px;
    padding: 20px 10px;
    display: flex;
    column-gap: 10px;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.kits{
    width: 300px;
    height: 350px;
    column-gap: 10px;
    text-align: center;
    align-items: center;
    justify-content: center;
}
.kits .details{
    text-align: center;
    align-items: center;
    justify-content: center;
}
.kits .details h1{
    font-size: 18px;
    font-weight: 800;
    color: var(--black);
    margin-bottom: 10px;
}
.kits .details p{
    line-height: 25px;
    color: var(--black);
    width: 100%;
    font-size: 15px;
}
.kits .icon{
    width: 100px;
    margin-left: 35%;
    height: 100px;
    border-radius: 50%;
    margin-top: 20px;
    text-align: center;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    background-color: #ED1C24;
}
.kits .icon img{
    width: 50px;
    height: 50px;
    transform: translate(0,50%);
    object-fit: cover;
    border-radius: 50%;
}
@media(max-width: 700px){
    .squeced-kit{
        height: auto;
        display: block;
        width: 96%;
        margin-left: 2%;
    }
    .squeced-kit::-webkit-scrollbar{
        display: none;
    }
    .kits{
        width: 96%;
        column-gap: 0;
        margin-left: 0;
        justify-content: center;
        text-align: center;
        align-items: center;
    }
    .kits .icon{
        width: 100%;
        height: 100px;
        margin-left: 0;
        border-radius: 0;
        justify-content: center;
        text-align: center;
        align-items: center;
        background: #fff;
    }
    .kits .icon .phone{
        width: 100px;
        height: 100px;
        border-radius: 50%;
        justify-content: center;
        text-align: center;
        align-items: center;
        background-color: #ED1C24;
        margin-left: 38%;
    }
    
 
}
.region-1{
    width: 80%;
    margin-left: 10%;
    padding: 20px 0;
    height: auto;
}
.region-1 img{
    width: 100%;
    height: 50%;
    object-fit: cover;
    border-radius: 20px;
}
.region-1 h1{
    text-transform: capitalize;
    font-size: 2rem;
    color: var(--black);
    text-align: center;
    justify-content: center;
    padding: 20px 0;
}
.region-1 p{
    font-size: 1.5rem;
    line-height: 35px;
    margin-bottom: 30px;
}

@media(max-width: 700px){
    .region-1{
        width: 96%;
        margin-left: 2%;
    } 
    .region-1 p{
        font-size: 1rem;
        line-height: 25px;
    }
}

/*carpool*/


@media(max-width: 700px){
    .carpool-xs2{
        width: 105%;
        height: 80vh;
        margin-top: -200px;
    }
    .carpool-xs2 .title{
         width: 100%;
        margin-top: 30vh;
        padding: 10px 0;
        margin-left: 0;
    }
    .carpool-xs2 .title h2{
        padding: 10px 10px; 
    }
    .carpool-xs2 .title h1{
        font-size: 5rem;
        font-weight: 900;
        padding: 10px 10px;
    }
    .carpool-xs2 .title p{
        font-weight: 900;
        padding: 10px 10px;
    }
}
.riding{
    display: flex;
    width: 80%;
    margin-left: 10%;
    background-color: #f8f8f8;
    height: 500px;
    margin-top: 50px;
    margin-bottom: 50px;
}
.riding .rides{
    width: 45%;
    height: auto;
    display: block;
}
.riding .rides:last-child{
    text-align: center;
    justify-content: center;
    align-items: center;
    
}
 
.riding .rides img{
    width: 90%;
    height: 100%;
    object-fit: cover;
    border-radius: 30px;
    align-items: center;
}
.riding .rides h1{
    font-size: 40px;
    margin-top: 90px;
    margin-bottom: 30px;
    color: var(--black);
    font-weight: 700;
}
.riding .rides p{
    font-size: 22px;
    color: #707070;
    line-height: 29px;
}

@media(max-width: 700px){
    .riding{
        flex-direction: column;
        width: 96%;
        margin-left: 2%;
        height: auto;
    }
    .riding .rides{
        width: 100%;
    }
    .riding .rides h1{
        text-align: center;
    }
    .riding .rides p{
        width: 98%;
        font-size: 18px;
        padding: 0 10px;
    }
}




/*delivery page start*/
.kiliride-delivery-page{
   width: 100%;
    height: 600px;
    margin-top: -50px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--color);
    position: relative;
    top: 0;
}
.kiliride-delivery-page .kiliride-delivery{
    width: 80%;
    max-width: 1200px;
    height: auto;
    display: flex;
}
.kiliride-delivery-page .kiliride-delivery .dderivery-sides{
    width: 70%;
    height: 600px;
    display: flex;
    align-items: center;
    position: relative;
}

.kiliride-delivery-page .kiliride-delivery .dderivery-sides .delivery-holder-{
    display: flex;
    flex-direction: column;
}
.kiliride-delivery-page .kiliride-delivery .dderivery-sides .search-tab{
    display: flex;
    width: 100%;
    flex-direction: column;
    margin: 20px 0;
}
.kiliride-delivery-page .kiliride-delivery
.dderivery-sides .search-tab .kiliride-search-result{
    width: 80%;
    max-height: 100px;
    display: block;
    overflow-y: scroll;
    margin: 10px 0;
}
.kiliride-delivery-page .kiliride-delivery
.dderivery-sides .search-tab .kiliride-search-result .search-result{
    display: flex;
    justify-content: space-around;
    padding: 12px 0;
    width: 100%;
    margin: 5px 0;
    background-color: #fff;
}
.kiliride-delivery-page .kiliride-delivery
.dderivery-sides .search-tab .kiliride-search-result a{
    text-decoration: none;
    color: #000;
}
.kiliride-delivery-page .kiliride-delivery
.dderivery-sides .search-tab .kiliride-search-result .search-result .result{
    width: auto;
}
.kiliride-delivery-page .kiliride-delivery
 .dderivery-sides .search-tab .search-navigation{
    width: 130px;
    display: flex;
    padding: 12px 15px;
    align-items: center;
    background-color: #991419;
    border-radius: 20px;
    position: relative;
    transition: ease-in .3s;
 }
 .kiliride-delivery-page .kiliride-delivery
 .dderivery-sides .search-tab .search-navigation:hover{
    width: 300px;
 }
 .kiliride-delivery-page .kiliride-delivery
 .dderivery-sides .search-tab .search-navigation:hover .searching{
    width: 300px;
 }
 .kiliride-delivery-page .kiliride-delivery
 .dderivery-sides .search-tab .search-navigation:hover
  .searching::-webkit-search-cancel-button{
    display: none;
 }
 .kiliride-delivery-page .kiliride-delivery
 .dderivery-sides .search-tab .search-navigation:hover
  .searching::-ms-clear, ::-ms-reveal{
    display: none;
  }
 .kiliride-delivery-page .kiliride-delivery
 .dderivery-sides .search-tab .search-navigation img{
    width: 24px;
    height: 24px;
    object-fit: contain;
    position: absolute;
    top: 10px;
 }
 .kiliride-delivery-page .kiliride-delivery
 .dderivery-sides .search-tab .search-navigation .searching::placeholder{
    color: #fff !important;
 }
 .kiliride-delivery-page .kiliride-delivery
 .dderivery-sides .search-tab .search-navigation .searching{
    border: none;
    outline: none;
    color: #fff;
    background-color: transparent;
    font-size: 15px;
    width: 100px;
    margin: 0 30px;
 }
.kiliride-delivery-page .kiliride-delivery .dderivery-sides:nth-child(2){
    width: 30%;
}
.kiliride-delivery-page .kiliride-delivery .dderivery-sides img{
   position: absolute;
    object-fit: contain;
    bottom: 0;
    width: 550px;
    height: 550px;
    margin-left: -100px;
}
.kiliride-delivery-page .kiliride-delivery .dderivery-sides .delivery-tab{
    width: 100%;
    text-align: start;
}
.kiliride-delivery-page .kiliride-delivery .dderivery-sides .delivery-tab h1{
    font-family: 'gilroy-bold';
    font-size: 65px;
    line-height: 75px;
    letter-spacing: 0;
    color: #fff;
}

.kiliride-delivery-page .kiliride-delivery .dderivery-sides .delivery-tab h1 span{
    color: var(--kili-box);
    font-family: 'gilroy-bold';
}
.kiliride-delivery-page .kiliride-delivery .dderivery-sides .delivery-tab p{
    font-size: 22px;
    line-height: 32px;
    color: #fff;
}
@media(max-width: 581px){
    .kiliride-delivery-page .kiliride-delivery
.dderivery-sides .search-tab .kiliride-search-result{
    width: 100%;
}
    .kiliride-delivery-page .kiliride-delivery
    .dderivery-sides .search-tab .search-navigation img{
        left: -15px;
    }
    .kiliride-delivery-page .kiliride-delivery
    .dderivery-sides .search-tab .search-navigation:hover{
        width: 250px;
    }
    .kiliride-delivery-page .kiliride-delivery
    .dderivery-sides .search-tab .search-navigation{
        padding: 15px;
    }
    .kiliride-delivery-page .kiliride-delivery
 .dderivery-sides .search-tab{
    display: flex;
    justify-content: center;
    align-items: center;
 }
    .kiliride-delivery-page .kiliride-delivery .dderivery-sides .delivery-tab p{
        font-size: 20px;
        line-height: 25px;
        text-align: center;
        margin: 10px 0;
    }
    .kiliride-delivery-page .kiliride-delivery .dderivery-sides .delivery-tab{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
    .kiliride-delivery-page .kiliride-delivery .dderivery-sides .delivery-tab h1{
        font-size: 30px;
        line-height: 40px;
        text-align: center;
    }
    .kiliride-delivery-page .kiliride-delivery .dderivery-sides:nth-child(2){
        width: 100%;
        display: flex;
        justify-content: center !important;
    }
    .kiliride-delivery-page{
        height: auto;
    }
    .kiliride-delivery-page .kiliride-delivery{
        flex-direction: column;
        width: 90%;
    }
    .kiliride-delivery-page .kiliride-delivery .dderivery-sides img{
      width: 100%;
        height: 450px;
        margin-left: 30px;
    }
    .kiliride-delivery-page .kiliride-delivery .dderivery-sides{
        width: 100%;
        height: 400px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
        .kiliride-delivery-page .kiliride-delivery .dderivery-sides:nth-child(1){
        margin-top: 50px;
    }
}
.kiliride-food{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 80px 0;
    background-color: var(--kili-box);
}
.kiliride-food .kiliride-food-holder{
    width: 80%;
    max-width:1200px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.kiliride-food .kiliride-food-holder .head-section{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 20px 0;
}
.kiliride-food .kiliride-food-holder .head-section h1{
    font-size: 65px;
    font-family: 'gilroy-bold';
    color: #fff;
}
.kiliride-food .kiliride-food-holder .head-section h1 span{
    color: var(--color);
    font-family: 'gilroy-bold';
}
.kiliride-food .kiliride-food-holder .values{
    display: flex;
    width: 100%;
    justify-content: space-between;
}
.kiliride-food .kiliride-food-holder .values .value-data{
    width: 31%;
    height: auto;
    padding: 10px 0;
    justify-content: space-between;
    display: flex;
}

.kiliride-food .kiliride-food-holder .mobile{
    display: none;
}
@media(max-width: 581px){
    .kiliride-food .kiliride-food-holder .out-mobile{
        display: none;
    }
    .kiliride-food .kiliride-food-holder .mobile{
        display: flex;
    }
    .kiliride-food .kiliride-food-holder .values{
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
    .kiliride-food .kiliride-food-holder .values .value-data{
        width: 100%;
        margin: 10px 0;
    }
    .kiliride-food .kiliride-food-holder .head-section h1{
        font-size: 30px;
        line-height: 40px;
    }
    .kiliride-food{
        padding: 40px 0;
    }
    .kiliride-food .kiliride-food-holder{
        width: 90%;
    }
}
.kiliride-food .kiliride-food-holder .values .value-data .icon-check{
    background-color: var(--kili-box);
    border: 2px solid var(--color);
    display: flex;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
}
.kiliride-food .kiliride-food-holder .values .value-data .icon-check i{
    color: var(--color);
    font-size: 12px;
}
.kiliride-food .kiliride-food-holder .values .value-data .description-data{
    width: 90%;
    height: auto;
    display: block;
}
.kiliride-food .kiliride-food-holder .values .value-data .description-data h1{
    font-size: 20px;
    line-height: 25px;
    margin-bottom: 10px;
    font-family: 'gilroy-bold';
    color: #fff;
}
.kiliride-food .kiliride-food-holder .values .value-data .description-data p{
    font-size: 13px;
    line-height: 20px;
    letter-spacing: 0;
    color: #fff;
}

.kiliride-grab-kili{
    width: 100%;
    margin: 60px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-grab-kili .grab-kili{
    width: 80%;
    max-width: 1200px;
    border-radius: 30px;
    height: 400px;
    background-color: var(--color);
    display: flex;
}
.kiliride-grab-kili .grab-kili .grab-side{
    height: 400px;
    width: 50%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-grab-kili .grab-kili .grab-side img{
    position: absolute;
    object-fit: contain;
    height: 400px;
}
.kiliride-grab-kili .grab-kili .grab-side .grab-head{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.kiliride-grab-kili .grab-kili .grab-side .grab-head h1{
    font-size: 65px;
    color: #fff;
    line-height: 84px;
    letter-spacing: 0;
    font-family: 'gilroy-bold';
}
.kiliride-grab-kili .grab-kili .grab-side .grab-head p{
    font-size: 24px;
    line-height: 34px;
    color: #fff;
}
.kiliride-grab-kili .grab-kili .grab-side .grab-head .grab-btn{
    display: flex;
}
.call-to-action-new-{
    padding: 12px 24px;
    background-color: #A61C22;
    text-wrap: nowrap;
    color: #fff !important;
    text-decoration: none;
    border-radius: 5px;
    font-family: 'gilroy-bold',sans-serif;
    transition: .3s ease-in;
    margin: 5px;
}
@media(min-width: 581px) and (max-width: 700px){
    .call-to-action-new-{
        padding: 12px 14px;
    }
}
@media(max-width: 581px){
    .kiliride-grab-kili .grab-kili .grab-side .grab-head .grab-btn{
        display: none;
    }
    .kiliride-grab-kili{
        padding: 30px 0;
        margin: 20px 0;
    }
    .kiliride-grab-kili .grab-kili .grab-side img{
        width: 250px;
    }
    .kiliride-grab-kili .grab-kili .grab-side .grab-head p{
        font-size: 15px;
        line-height: 22px;
    }
    .kiliride-grab-kili .grab-kili .grab-side .grab-head h1{
        font-size: 15px;
        line-height: 22px;
        margin-bottom: 20px;
    }
    .kiliride-grab-kili .grab-kili{
        height: 250px;
        width: 90%;
    }
    .kiliride-grab-kili .grab-kili .grab-side:nth-child(2){
        display: none;
    }
    .kiliride-grab-kili .grab-kili .grab-side{
        height: 250px;
        width: 100%;
        overflow: hidden;
    }
}
.interactive-switch-holder{
    width: 100%;
    padding: 30px 0;
    Background-color: var(--kili-box);
    Color: #fff;
    Text-align: center;
    Margin: 0;
    Display: flex;
    Justify-content: center;
    Align-items: center;
    flex-direction: column;
    Height: auto;
}
.interactive-switch-holder h1{
    font-size: 35px;
    line-height: 45px;
    font-family: 'gilroy-bold';
    letter-spacing: 0;
    margin: 20px 0;
}
.interactive-switch-holder h1 span{
    color: var(--color);
    font-family: 'gilroy-bold';
}
.interactive-switch-holder .container{
    Display: flex;
    Width: 80%;
    height: 500px;
    Max-width: 1200px;
}
.interactive-switch-holder .left-panel {
    Width: 50%;
    Display: flex;
    height: 500px;
    justify-content: center;
    Flex-direction: column;
}
.interactive-switch-holder .left-panel h2{
    font-size: 15px;
    line-height: 30px;
    letter-spacing: 0;
    color: #fff;
    text-align: left;
}

.interactive-switch-holder .switch {
    Border: 2px solid #1B172D;
    border-radius: 10px;
    Text-align: left;
    Color: #aaa;
    Font-size: 18px;
    width: calc(100% - 20px);
    padding: 10px 20px;
    Cursor: pointer;
    Transition: 0.3s;
    margin: 10px 0;
    background-color: transparent;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.interactive-switch-holder .switch .button-side{
    width: 80%;
    display: block;
}
.interactive-switch-holder .switch .button-side h1{
    font-size: 15px;
    line-height: 24px;
    color: #fff;
    margin: 10px 0;
}
.interactive-switch-holder .switch .button-side p{
    font-size: 14px !important;
    line-height: 18px;
    color: #fff;
}
.interactive-switch-holder .switch .button-side-icon{
    height: 60px;
    width: 60px;
    border-radius: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #1B172D
}
.interactive-switch-holder .switch .button-side-icon i{
    color: #fff;
}
@media(min-width: 901px) and (max-width: 1310px){
        .interactive-switch-holder .container{
        width: 90%;
        height: auto;
    }
    .interactive-switch-holder .left-panel {
        height: auto;
    }
}
@media(min-width: 581px) and (max-width: 900px){
    .interactive-switch-holder .switch .button-side-icon{
        height: 40px;
        width: 40px;
        border-radius: 8px;
    }
    .interactive-switch-holder .container{
        width: 90%;
        height: auto;
    }
    .interactive-switch-holder .left-panel {
        height: auto;
    }
    .kiliride-grab-kili .grab-kili .grab-side .grab-head h1{
        font-size: 40px;
        line-height: 50px;
    }
    .kiliride-grab-kili .grab-kili .grab-side img{
        height: 300px;
    }
    .kiliride-grab-kili .grab-kili{
        width: 90%;
        height: 300px;
    }
    .kiliride-grab-kili .grab-kili .grab-side{
        height: 300px;
    }
    .kiliride-food .kiliride-food-holder .values .value-data .description-data h1{
        font-size: 25px;
        line-height: 35px;
    }
    .kiliride-food .kiliride-food-holder .values .value-data .description-data p{
        font-size: 18px;
        line-height: 25px;
    }
    .kiliride-food .kiliride-food-holder .values{
        flex-direction: column;
    }
    .kiliride-food .kiliride-food-holder .values .value-data{
        width: 100%;
    }
    .kiliride-food .kiliride-food-holder .head-section h1{
        font-size: 40px;
        margin: 10px 0;
    }
    .kiliride-food .kiliride-food-holder{
        width: 90%;
    }
    .kiliride-delivery-page .kiliride-delivery .dderivery-sides{
        width: 100%;
        height: 500px;
        text-align: center;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .kiliride-delivery-page .kiliride-delivery .dderivery-sides .delivery-tab h1{
        font-size: 40px;
        line-height: 50px;
    }
    .kiliride-delivery-page .kiliride-delivery{
           width: 90%;
        flex-direction: column;
    }
    .kiliride-delivery-page{
        height: auto;
    }
    .kiliride-delivery-page .kiliride-delivery .dderivery-sides:nth-child(2){
           width: 100%;
    }
}
.interactive-switch-holder .switch:hover, .switch.active {
    Font-weight: bold;
    background-color: #1B172D !important;
}
.interactive-switch-holder .switch:hover, .switch.active .button-side-icon{
    background-color: var(--color);
}
.interactive-switch-holder .switch:hover .button-side-icon{
    background-color: var(--color);
}

.interactive-switch-holder .right-panel {
    Width: 50%;
    Position: relative;
}

.interactive-switch-holder .content {
    Display: none;
    Opacity: 0;
    Transition: opacity 1s ease-in-out;
    Position: absolute;
    Width: 100%;
    Top: 0;
}

.interactive-switch-holder .content.active {
    Display: block;
    Opacity: 1;
}

.interactive-switch-holder .nav-arrow {
    Position: absolute;
    Top: 50%;
    Transform: translateY(-50%);
    Background: rgba(255, 255, 255, 0.2);
    Border: none;
    Color: white;
    Padding: 10px 15px;
    Cursor: pointer;
    display: none;
}

.interactive-switch-holder .left-arrow { left: 40px; }
.interactive-switch-holder .right-arrow { right: 40px; }

.interactive-switch-holder .indicators {
    Position: absolute;
    Bottom: 10px;
    Left: 50%;
    Transform: translateX(-50%);
    display: none;
}
.interactive-switch-holder .dot {
    Height: 10px;
    Width: 10px;
    Margin: 0 5px;
    Background-color: #aaa;
    Border-radius: 50%;
    Display: inline-block;
    Cursor: pointer;
}
.interactive-switch-holder .dot.active {
    Background-color: var(--color);
}

@keyframes rotate {
    from { opacity: 0;}
    to { opacity: 1;}
}
.image-container{
    width: 100%;
}
.image-container img{
    transition: transform 0.3s ease-in;
    object-fit: contain;
    height: 500px;
}
.rotate{
    animation: rotate 0.6s linear;
}

@media(max-width: 581px){
    .image-container img{
        height: 350px;
    }
    .interactive-switch-holder .nav-item .button-side-icon{
        height: 40px;
        width: 40px;
        border-radius: 8px;
    }
    .interactive-switch-holder {
        padding: 50px 0;
    }
    .interactive-switch-holder .nav-arrow {
        display: flex;
        color: var(--color);
        bottom: -295px;
        top: unset;
        width: 50px;
        height: 50px;
        justify-content: center;
        align-items: center;
        font-size: 35px;
        background-color: transparent;
    }
    .interactive-switch-holder .indicators {
        display: flex;
        bottom: -250px;
    }
    .interactive-switch-holder .switch {
        display: none;
    }
    .interactive-switch-holder .switch.active {
        display: flex;
    }
    .interactive-switch-holder .container{
        width: 90%;
        height: auto;
        flex-direction: column-reverse;
    }
    .interactive-switch-holder .right-panel {
        width: 100%;
        height: auto;
        margin-bottom: 20px;
    }
    .interactive-switch-holder .left-panel {
        width: 100%;
        height: auto;
        margin-bottom: 100px;
    }
    .interactive-switch-holder .content {
        position: unset;
    }
}


.kiliride-partner-col{
    width: 100%;
    margin: 80px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.kiliride-partner-col h1{
    font-size: 60px;
    line-height: 74px;
    font-family: 'gilroy-bold';
}
.kiliride-partner-col .highlight{
    color: var(--color);
    font-family: 'gilroy-bold';
}
.kiliride-partner-col .toggle-buttons {
    display: flex;
    justify-content: center;
    margin: 30px 0;
    padding: 10px 18px;
    border: 1px solid var(--color);
    border-radius: 40px;
}
.kiliride-partner-col .toggle-buttons button{
    padding: 10px 20px;
    font-size: 16px;
    cursor: pointer;
    transition: background 0.3s, color 0.3s;
    margin: 5px;
    border-radius: 20px;
    border: none;
    background-color: transparent;
    color: var(--color);
}

.kiliride-partner-col .toggle-buttons .active-class{
    background: var(--color);
    color: #fff;
    font-family: 'gilroy-bold';
}

.kiliride-partner-col .content-partner{
    display: none;
    border: 1px solid var(--box);
    width: 500px;
    height: auto;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
    padding: 20px;
}

.kiliride-partner-col .content-partner .top-delivery{
    padding: 5px;
    background-color: #f8f8f8;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 30px;
    max-width: 260px;
    height: 35px;
}
.kiliride-partner-col .content-partner .top-delivery img{
    width: 25px;
    height: 25px;
    object-fit: contain;
}
.kiliride-partner-col .content-partner .top-delivery h1{
     font-family: 'gilroy-bold';
     font-size: 15px;
     color: #1A0244;
}
.kiliride-partner-col .content-partner h1{
    font-family: 'gilroy-bold';
    color: #1A0244;
    font-size: 35px;
}
@media(max-width: 581px){
    .kiliride-partner-col .content-partner h1{
        font-size: 20px;
    }
    .kiliride-partner-col .content-partner{
        width: calc(100% - 46px);
    }
    .kiliride-partner-col h1{
        font-size: 35px;
        line-height: 45px;
    }
    .kiliride-partner-col .highlight{
        font-size: 35px;
    }
    .kiliride-partner-col .toggle-buttons {
        padding: 10px;
        border-radius: 30px;
    }
    .kiliride-partner-col .toggle-buttons button{
        padding: 10px;
    }
}
.kiliride-partner-col .content-partner .kili-paragraph{
    margin: 20px 0;
}
.kiliride-partner-col .content-partner .kili-paragraph h1{
    font-family: 'gilroy-bold';
    font-size: 15px;
    line-height: 22px;
    margin-bottom: 20px;
}
.kiliride-partner-col .content-partner .kili-paragraph p{
    font-size: 16px;
    line-height: 18px;
}
.kiliride-partner-col .content-partner .kili-paragraph a{
    padding: 12px 16px;
    background-color: var(--color);
    text-decoration: none;
    color: #fff;
    border-radius: 30px;
    margin: 20px 0;
}
.kiliride-partner-col .content-partner.active-class {
    display: block;
    opacity: 1;
}






/*delivery page end*/






.derivery{
    margin-top: 100px;
    height: 500px;
    width: 100%;
    margin-left: 0;
    background-image: linear-gradient(rgba(4,9,30,0.5),rgba(4,9,30,0.5)), url(images/flex/derivery.png);
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.derivery .derivery-boxes-b1{
    flex-direction: column;
    width: 50%;
    height: 400px;
}
.derivery .derivery-boxes-b1 img{
    width: 80%;
    height: 100%;
    margin-left: 100px;
    object-fit: cover;
}
.derivery .derivery-boxes-b1 h1{
    font-size: 40px;
    font-weight: 700;
    color: #fff;
    line-height: 50px;
    font-weight: 900;
    margin: 20px 0 5px 0;
    text-wrap: nowrap;
}
.derivery .derivery-boxes-b1 p{
    line-height: 28px;
    font-size: 12px;
    text-wrap: nowrap;
    color: #fff !important;
}
.derivery .derivery-boxes-b1 .search-{
    width: 100%;
    max-height: 300px;
    align-items: center;
    justify-content: center;
    text-align: center;
    place-items: center;
}
.derivery .derivery-boxes-b1 .search- .input{
    background-color: #fff;
    width: 80%;
    height: 50px;
    border-radius: 30px;
    box-shadow: 0 4px 8px 1px rgba(0, 0, 0, 0.2);
    align-items: center;
    justify-content: center;
    text-align: center;
    display: flex;
}
 
.derivery .derivery-boxes-b1 .user-list{
    width: 100%;
    height: 200px;
    display: block;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.derivery .derivery-boxes-b1 .user-list .result-suggestion a{
    text-decoration: none;
}
.derivery .derivery-boxes-b1 .user-list .result-suggestion{
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.derivery .derivery-boxes-b1 .user-list .result-suggestion .box{
    background-color: #f8f8f8;
    height: 50px;
    width: 100%;
}
.derivery .derivery-boxes-b1 .user-list .result-suggestion::-webkit-scrollbar{
   display: none;
}
.derivery .derivery-boxes-b1 .user-list .result-suggestion .result h1{
    font-size: 15px;
    color: #707070;
}
.derivery .derivery-boxes-b1 .user-list .result-suggestion .result h2{
    font-size: 15px;
    color: #707070;
}
.derivery .derivery-boxes-b1 .user-list .result-suggestion .box .result{
    width: 90%;
    height: 30px;
    align-items: center;
    background-color: transparent;
    justify-content: space-between;
    display: flex;
    color: #707070;
    border-top: 1px solid #64646413;
}

.derivery .derivery-boxes-b1 .user-list .search- .input input[type="search"]::-webkit-search-cancel-button{
    display: none;
}
.derivery .derivery-boxes-b1 .user-list .search- .input i{
    color: var(--black);
    width: 20px;
    height: 10px;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.derivery .derivery-boxes-b1 .user-list .search- .input button{
    background-color: #fff;
 
    width: 40px;
    height: 40px;
    top: 0;
    border-radius: 50%;
    border: none;
    align-items: center;
    justify-content: center;
    text-align: center;

}
.derivery .derivery-boxes-b1 .user-list .search- .input .searching::placeholder{
    color: var(--black);
    font-size: 15px;
    font-weight: 700 !important;
}
.derivery .derivery-boxes-b1 .user-list .search- .input input{
    padding: 10px 20px !important;
    display: flex !important;

}
.derivery .derivery-boxes-b1 .user-list .search- .input .searching{
    border: none;
    width: 80%;
    height: 90%;
    outline: none;
    justify-content: center;
    margin-top: 0;
    padding: 0 10px;
    display: flex !important;
    
}
.derivery .derivery-boxes-b1 p{
    font-size: 12px;
    line-height: 28px;
    color: #707070;
    margin-bottom: 30px;
}


@media(min-width: 701px) and (max-width: 1080px){
    .derivery{
        width: 100%;
        flex-direction: column;
        margin-left: 0;
        margin-top: 100px;
    }
    .derivery .derivery-boxes-b1 .user-list .search- .input{
        text-align: center;
        justify-content: center;
        align-items: center;
        margin-left: 10%;
    }
    .derivery .derivery-boxes-b1 .user-list .result-suggestion .box{
        margin-left: 0;
    }
    .derivery .derivery-boxes-b1{
        width: 100%;
        height: auto;
        padding: 0 0;
        text-align: center;
        justify-content: center;
        align-items: center;
    }
    .derivery .derivery-boxes-b1 p{
        padding: 0 10px;
        text-align: center;
    }
    .derivery .derivery-boxes-b1 h1{
        font-size: 3rem;
        text-align: center;
        text-wrap: balance;
        margin: 0 0 10px 0;
    }
    .derivery .derivery-boxes-b1 img{
        margin-top: 20px;
        height: 400px;
        width: 90%;
    }
}


 
@media(max-width: 700px){
    .derivery .derivery-boxes-b1 .user-list .result-suggestion{
        width: 100% !important;
    }
    .derivery .derivery-boxes-b1 .user-list .result-suggestion .box .result{
        width: 100%;
    }
    .derivery .derivery-boxes-b1 .user-list .result-suggestion .box{
        width: 90%;
    }
    .derivery{
        flex-direction: column;
        margin-top: 100px;
        height: 400px;
        width: 100%;
    }
 
    .derivery .derivery-boxes-b1 .user-list .search- .input .searching{
        width: 100%;
        background-color: transparent !important;
    }
    .derivery .derivery-boxes-b1 .search- .input{
        width: 80%;
        margin-left: 2%;
        padding: 0 15px;
    }
    .derivery .derivery-boxes-b1{
        width: 90%;
        height: auto;
        padding: 0 10px;
    }
 
    .derivery .derivery-boxes-b1 h1{
        font-size: 20px;
        font-weight: 700;
        line-height: 45px;
    }
    .derivery .derivery-boxes-b1 p{
        font-size: 1rem !important;
    }
    .derivery .derivery-boxes-b1 img{
        margin-top: 20px;
        width: 100%;
        height: 100%;
        margin-left: -5px;
        border-radius: unset;
        padding: 0;
         border-radius: 100px;
        border: none;
        outline: none;
    }
   
    .derivery .derivery-boxes-b1 .user-list .search- .input button{
        width: 45px;
    }
    .derivery .derivery-boxes-b1 .user-list input{
        background-color: transparent !important;
        font-size: 10px !important;
    }
}
.middle-bx-const{
    display: flex;
    width: 85%;
    height: 350px;
    margin-left: 8%;
    margin-top: 50px;
    align-items: center;
    text-align: center;
    justify-content: center;
    background-color: #f8f8f8;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}
.middle-bx-const .bx-const{
    width: 100%;
    height: 100%;
    display: block;
    padding: 20px 0;
    text-align: center;
    justify-content: center;
}
.middle-bx-const .bx-const:last-child{
    margin-left: 30px;
    width: 80%;
}
.middle-bx-const .bx-const img{
    width: 100%;
    padding: 0;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
    margin-top: 0;
}
.middle-bx-const .bx-const h1{
    margin-top: 15%;
    color: var(--black);
    font-weight: 600;
    font-size: 1.5rem;
    padding: 20px 0 10px 0;
    text-align: start;
}
.middle-bx-const .bx-const .span-twos{
    display: flex;
    width: 100%;
    height: 30%;
    align-items: center;
    justify-content: center;
}

.middle-bx-const .bx-const .span-twos .span-{
    width: 100%;
    display: inline-flex;
    text-align: start;
}
.middle-bx-const .bx-const .span-twos .span- p{
    font-size: 15px;
    line-height: 28px;
    color: var(--black);
}
p{
    font-size: 15px !important;
}
@media(min-width: 701px) and (max-width: 1080px){
    .middle-bx-const .bx-const .span-twos .span- p{
        margin-top: 50px;
        font-size: 18px;
    }
}
@media(max-width: 700px){
    .middle-bx-const .bx-const:last-child{
        width: 100%;
    }
    .middle-bx-const .bx-const .span-twos .span-{
        text-align: start;
    }
    .middle-bx-const .bx-const .span-twos .span- p{
        margin-top: 0;
        text-wrap: wrap;
        font-size: 1rem !important;
        margin-bottom: 20px;
        padding: 0 10px;
        width: 95%;
    }
    .middle-bx-const{
        width: 96%;
        margin-left: 2%;
        flex-direction: column;
        height: auto;
        padding: 0;
        flex-direction: column-reverse;
        background-color: #fff;
    }
    .middle-bx-const .bx-const{
        width: 100%;
        padding: 0;
    }
    .middle-bx-const .bx-const:first-child{
        height: auto;
    }
    .middle-bx-const .bx-const img{
        margin-top: 5px;
        width: 100%;
    }
    .middle-bx-const .bx-const .span-twos{
        margin-top: 20px;
    }
    .middle-bx-const .bx-const h1{
        margin-top: 0;
        padding: 10px 0;
        margin-left: -50px;
        text-align: center;
        font-size: 25px !important;
    }

}
.plates{
    width: 86%;
    margin-left: 8%;
    background-color: #fff;
    height: 100vh;
    margin-top: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.plates .plate{
    width: 45%;
    height: 100%;
    display: block;
    padding: 0 50px;
}
.plates .plate .rotating{
    display: block;
    height: auto;
    padding: 0;
}
.plates .plate .rotating .rotate{
    width: 100%;
    height: 300px;
    margin: 120px 0 20px;
    background-color: #fff;
}
.plates .plate .rotating .rotate img{
    width: 300px;
    height: 300px;
    background-color: transparent;
    border-radius: 50%;
    animation: rotation 5s linear infinite;
}
@keyframes rotation {
    0%{
        transform: rotate(0deg);
    }
    100%{
        transform: rotate(360deg);
    }
}
 .link-up{
    margin-top: 40px;
    margin-left: 0;
    justify-content: center;
    text-align: center;
    align-items: center;
    padding: 20px 0;
    margin-bottom: 30px;
}

.plates .plate img{
    width: 110%;
    height: 98%;
    object-fit: cover;
    border-radius: 40px;
}
.plates .plate .plateus{
    width: 100%;
    margin: 10px 0 20px 0;
    margin-bottom: 40px;
}
.plates .plate .plateus h1{
    text-align: start;
    padding: 0 80px;
    color: var(--black);
    font-weight: 600;
    font-size: 1.5rem;
}
.plates .plate .plateus .plateus-devide{
    display: flex;
}
.plates .plate .plateus .plateus-devide i{
    color: #fff;
    text-align: center;
    justify-content: center;
    align-items: center;
    padding: 12px 0;
}
.plates .plate .plateus .plateus-devide .devide-:first-child{
    width: 40px;
    height: 40px;
    margin-right: 20px;
    border-radius: 50%;
    margin-top: 0;
    background-color: #ED1C24;
}
.plates .plate .plateus .plateus-devide .devide-:last-child{
    width: 80%;
    padding: 0 0px;
    margin-left: 20px;
}
.plates .plate .plateus .plateus-devide .devide-:last-child p{
    font-size: 15px;
    color: var(--black);
    line-height: 28px;
    text-align: start;
}

@media(min-width: 701px) and (max-width: 1080px){
    .plates{
        height: auto;
        width: 100%;
        margin-left: 0;
    }
    .plates .plate .plateus{
        margin: 20px 0;
    }
     
    .plates .plate .plateus .plateus-devide .devide-:first-child{
        width: 40px;
        height: 40px;
    }

    .plates .plate .plateus .plateus-devide .devide-:last-child p{
        font-size: 18px;
    }
    .plates .plate .plateus h1{
        font-size: 1.3rem;
        text-wrap: nowrap;
        padding: 0 80px;
    }
}
@media(max-width: 700px){
    .plates{
        width: 96%;
        margin-left: 2%;
        display: block;
        height: auto;
        margin-bottom: 80px;
    }
    .plates .plate{
        width: 100%;
        display: block;
        padding: 0 0;
    }
    .plates .plate .plateus{
        padding: 10px 10px;
    }
    .plates .plate .rotating .rotate{
        margin: -30px 0 -20px 0;
    }
    .plates .plate .plateus h1{
        text-align: start;
        margin-left: 60px;
        font-size: 18px;
        padding: 10px 5px;
        font-weight: 600;
        text-wrap: nowrap;
    }
    .plates .plate .plateus .plateus-devide .devide-:first-child{
        width: 40px;
        height: 40px;
        margin-top: 0!important;
    }
    .plates .plate .plateus .plateus-devide .devide-:last-child p{
        font-size: 1rem;
    }
    .plates .plate .plateus .plateus-devide .devide-:last-child{
        margin-left: 5px;
    }
    .link-up{
        margin-top: -30px !important;
        margin-bottom: 50px;
    }
}
.about-us{
    width: 85%;
    margin-top: 100px;
    margin-left: 8%;
    align-items: center;
    text-align: center;
    height: 500px;
    margin-bottom: 20px;
}
.about-us .content{
    width: 100%;
    height: 100%;
}
.about-us .content .top-image {
    width: 100%;
    height: 100%;
}
.about-us .content .top-image img{
    width: 100%;
    height: 100%;
    border-radius: 30px;
    object-fit: cover; 
    pointer-events: none;
}
 
@media(max-width: 1000px){
    .about-us{
        height: 50vh;
        width: 100%;
        margin-top: -50px;
        margin-left: 0;
        overflow: hidden;
    }
    .about-us .content{
        height: 50vh;
        padding: 0;
        left: 0;
        margin-left: 0;
    }
    .about-us .content .top-image img{
        border-radius: 0;
        width: 96%;
        margin-left: 1%;
        
    }
}



/*new driver page css*/
.kiliride-driver-holder{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--kili-box);
}
.kiliride-driver-holder .kiliride-driver{
    height: 500px;
    width: 100%;
    margin-top: 60px;
    display: flex;
    justify-content: center;
}
.kiliride-driver-holder .kiliride-driver .drivers-side{
    width: 500px;
    height: 100%;
    margin: 0 10px;
    position: relative;
}

.kiliride-driver-holder .kiliride-driver .drivers-side img{
    position: absolute;
    object-fit: contain;
    height: 600px;
    bottom: 0;
}
.kiliride-driver-holder .kiliride-driver
 .drivers-side .driver-side-detail{
    display: block;
    width: 100%;
    height: 100%;
}
.kiliride-driver-holder .kiliride-driver
 .drivers-side .driver-side-detail .top-driver-head{
    display: flex;
    width: 100%;
 }
 .kiliride-driver-holder .kiliride-driver
 .drivers-side .driver-side-detail .top-driver-head h1{
    font-family: 'gilroy-bold';
    letter-spacing: 0;
    line-height: 75px;
    font-size: 70px;
    color: #ffffff;
    text-align: start;
    margin-bottom: 20px;
 }
 .kiliride-driver-holder .kiliride-driver
 .drivers-side .driver-side-detail .top-driver-head h1 span{
    color: var(--color);
    font-family: 'gilroy-bold';
 }
 .kiliride-driver-holder .kiliride-driver
 .drivers-side .driver-side-detail .driver-flex{
    margin: 10px 0;
    display: flex;
    width: 100%;
    justify-content: space-between;
 }
 .kiliride-driver-holder .kiliride-driver
 .drivers-side .driver-side-detail .driver-flex .round-check{
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: var(--kili-box);
    border: 2px solid var(--color);
    display: flex;
    justify-content: center;
    align-items: center;
 }
 .kiliride-driver-holder .kiliride-driver
 .drivers-side .driver-side-detail .driver-flex .round-check i
 {    font-size: 10px; color: var(--color);}
 .kiliride-driver-holder .kiliride-driver
 .drivers-side .driver-side-detail .driver-flex .driver-row{
    width: 90%;
    display: block;
 }
 .kiliride-driver-holder .kiliride-driver
 .drivers-side .driver-side-detail .driver-flex .driver-row h1{
    font-size: 20px;
    line-height: 25px;
    margin-bottom: 10px;
    font-family: 'gilroy-bold';
    color: #fff;
 }
 .kiliride-driver-holder .kiliride-driver
 .drivers-side .driver-side-detail .driver-flex .driver-row p{
font-size: 15px;
line-height: 20px;color: #fff;
 }
 .kiliride-driver-holder .kiliride-driver
 .drivers-side .driver-side-detail .driver-flex a{
    margin-left: 50px;
 }
 .kilidrive-community{
    margin: 60px 0;
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
 }
 .kilidrive-community .kilidrive{
    width: 80%;
    display: flex;
    justify-content: center;
    align-items: center;
 }
 .kilidrive-community .kilidrive .the-driver-side{
    width: 500px;
    height: 500px;
 }
 .kilidrive-community .kilidrive .the-driver-side:nth-child(2){
    display: flex;
    flex-direction: column;
    justify-content: center;
 }
 .kilidrive-community .kilidrive .the-driver-side .driver-desc{
    padding: 8px 16px;
    background-color: #ED1C243B;
    border-radius: 26px;
    width: 150px;
    color: var(--color);
    margin: 20px 0;
 }
 .kilidrive-community .kilidrive .the-driver-side .driver-desc h1{
    font-family: 'gilroy-bold';
    font-size: 13px;
 }
 .kilidrive-community .kilidrive .the-driver-side .driver-colum-kili{
    display: block;
    width: 100%;
 }
 .kilidrive-community .kilidrive .the-driver-side .driver-colum-kili h1{
    color: #372D5E;
    font-family: 'gilroy-bold';
    font-size: 35px;
    line-height: 40px;
    margin-bottom: 40px;
 }
 .kilidrive-community .kilidrive .the-driver-side .driver-colum-kili img{
    object-fit: contain;
    height: 250px;
 }
 .kilidrive-community .kilidrive .the-driver-side .flex-check{
    display: flex;
    width: 100%;
    padding: 10px 0;
    margin: 10px 0;
    border-bottom: 1px solid var(--box);
 }
 .kilidrive-community .kilidrive .the-driver-side .flex-check .round-check{
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: var(--color);
    display: flex;
    align-items: center;
    justify-content: center;
 }
 .kilidrive-community .kilidrive .the-driver-side .flex-check .round-check i{
    font-size: 10px;
    color: #fff;
 } .kilidrive-community .kilidrive .the-driver-side .flex-check h1{
    margin-left: 10px;
    font-family: 'gilroy-bold';
    font-size: 15px;
    line-height: 25px;
    margin-top: -2px;
 }
 .driver-flex-row{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 40px 0;
 }
 .driver-flex-row .driver-flex-holder{
    width: 80%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 30px;
    background-color: #f8f8f8;
 }
 .driver-flex-row .driver-flex-holder .driver-column:nth-child(1){
    width: 500px;
    height: 500px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
 }
 .driver-flex-row .driver-flex-holder .driver-column{
    width: 500px;
    height: 400px;
    display: block;
 }
 
 .driver-flex-row .driver-flex-holder .driver-column img{
    object-fit: cover;
    height: 300px;
    width: 400px;
    border-radius: 15px;
 }
 .driver-flex-row .driver-flex-holder .driver-column .span{
    width: 100px;
 }
 .driver-flex-row .driver-flex-holder .driver-column span h1{
    font-size: 12px;
    line-height: 20px;
    color: var(--color);
    font-family: 'gilroy-bold';
    margin-bottom: 30px;
 }
 .driver-flex-row .driver-flex-holder .driver-column .driver-col-inflex{
    display: flex;
    width: 100%;
    justify-content: space-between;
    margin-bottom: 15px;
 }
 .driver-flex-row .driver-flex-holder
  .driver-column .driver-col-inflex .round-check-round{
   width: 40px;
    height: 40px;
    justify-content: center;
    align-items: center;
    display: flex;
    background-color: var(--box);
    border-radius: 8px;
  }
  .driver-flex-row .driver-flex-holder
  .driver-column .driver-col-inflex .round-check-round img{
    width: 20px;
    height: 20px;
    object-fit: contain;
  }
  .driver-flex-row .driver-flex-holder
  .driver-column .driver-col-inflex .decription{
    width: 90%;
  }
  .driver-flex-row .driver-flex-holder
  .driver-column .driver-col-inflex .decription h1{
    font-size: 15px;
    line-height: 18px;
    font-family: 'gilroy-bold';
    color: #372D5E;
    margin-bottom: 10px;
  }
  .driver-flex-row .driver-flex-holder
  .driver-column .driver-col-inflex .decription p{
    font-size: 15px;
    line-height: 20px;
    color: #7B6060;
    font-weight: 600;
}
.driver-flex-row .driver-flex-holder
.driver-column .driver-col-inflex .link-class{
    margin: 20px 45px;
    display: flex;
    width: 70%;
    justify-content: left;
}
.driver-flex-row .driver-flex-holder
.driver-column .driver-col-inflex .link-class a{
    text-decoration: none;
}
.driver-flex-row .driver-flex-holder
.driver-column .driver-col-inflex .link-class a img{
    object-fit: contain;
    height: 37px;
    width: 110px;
    margin: 0 5px;
    border-radius: 0;
}
.kili-flex-inline{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kili-flex-inline .flex-line{
    width: 80%;
    max-width: 1200px;
    display: flex;
}

.kili-flex-inline .flex-line .box-line{
    max-width: 300px;
    max-height: 400px;
    padding: 20px;
    border: 1px solid var(--box);
    border-radius: 16px;
    margin-right: 10px;
}
.kili-flex-inline .flex-line .box-line .box-icon{
    width: 50px;
    height: 50px;
    margin-bottom: 30px;
}
.kili-flex-inline .flex-line .box-line .box-icon img{
    width: 50px;
    height: 50px;
}
.kili-flex-inline .flex-line .box-line h1{
    font-size: 20px;
    line-height: 25px;
    font-family: 'gilroy-bold';
    margin: 20px 0;
}
.kili-flex-inline .flex-line .box-line p{
    font-size: 15px;
    line-height: 22px;
    font-weight: 500;
}



.kiliride-testimony {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    margin: 40px 0;
}

.kiliride-testimony .testimonial-container {
    width: 80%;
    max-width: 1200px;
    display: flex;
    flex-direction: column;
    padding: 20px;
    border-radius: 10px;
    position: relative;
}
.kiliride-testimony .testimonial-container h1{
    color: #333;
    font-family: 'gilroy-bold';
    background-color: #f8f8f8;
    border-radius: 22px;
    padding: 10px 16px;
    width: 210px;
    font-size: 15px;
    color: var(--color);
    margin: 20px 0;
}
.kiliride-testimony .testimonial-container h2 {
    color: #333;
    font-family: 'gilroy-bold';
}
.kiliride-testimony .testimonial{
    display: none;
    text-align: center;
    justify-content: space-between;
    transition: opacity 0.3s ease;
    padding: 20px 0;
}

.kiliride-testimony .testimonial.active{
    display: flex;
    width: 100%;
    height: auto;
}
.testimonial-img {
    width: 400px;
    height: 400px;
    object-fit: cover;
    border-radius: 22px;
    margin-bottom: 10px;
}
.kiliride-testimony .testimonial .testimonial-text{
    width: 60%;
    height: 400px;
    border-radius: 30px;
    display: flex;
    justify-content: center;
    border: 1px solid var(--color);
}
.kiliride-testimony .testimonial .testimonial-text .text-holder{
    width: 80%;
    padding: 30px 0;
    display: flex;
    flex-direction: column;
    justify-content: left;
}
.kiliride-testimony .testimonial .testimonial-text .text-holder h3{
    font-size: 18px;
    line-height: 22px;
    font-weight: 600;
    color: #000;
    padding: 0;
    text-align: left;
    margin-bottom: 20px;
}
.kiliride-testimony .testimonial .testimonial-text .text-holder p{
    color: #0C0E11;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
}
.testimonial-text p {
    font-size: 18px;
    color: #555;
}

.kiliride-testimony .testimonial-nav {
    position: absolute;
    content: '';
    left: 45%;
    bottom: 100px;
}

.kiliride-testimony .nav-btn {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 50%;
    margin: 2px;
    cursor: pointer;
    opacity: 0.5;
    transition: opacity 0.3s;
}

.kiliride-testimony .nav-btn.active {
    opacity: 1;
    border: 2px solid var(--color);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
@media(min-width: 581px) and (max-width: 1200px){
     .kiliride-testimony .testimonial-nav {
        left: 7%;
    }
    .kiliride-testimony .testimonial .testimonial-text{
        width: 100%;
        height: 300px;
    }
    .kiliride-testimony .testimonial .testimonial-text .text-holder{
        width: 90%;
    }
    .testimonial-img {
        width: 100%;
        height: 400px;
    }
    .kiliride-testimony .testimonial.active{
        flex-direction: column;
    }
    .kiliride-testimony .testimonial-container {
        width: 90%;
    }
}
@media(min-width: 581px) and (max-width: 900px){

    .kili-flex-inline .flex-line .box-line .box-icon{
        width: 40px;
        height: 40px;
    }
    .kili-flex-inline .flex-line .box-line .box-icon img{
        width: 40px;
        height: 40px;
    }
    .kili-flex-inline .flex-line{
        width: 90%;
    }
    .driver-flex-row .driver-flex-holder .driver-column:nth-child(1){
        width: 40%;
    }
   .driver-flex-row .driver-flex-holder .driver-column img{
        height: 400px;
        width: 600px;
    }
    .driver-flex-row .driver-flex-holder .driver-column{
        width: 600px;
    }
    .kiliride-driver-holder .kiliride-driver
    .drivers-side .driver-side-detail .top-driver-head h1{
        font-size: 50px;
        line-height: 60px;
    }
    .driver-flex-row .driver-flex-holder{
        width: 90%;
        flex-direction: column;
    }
    .kiliride-driver-holder .kiliride-driver .drivers-side img{
        height: 500px;
    }
}

@media(max-width: 580px){
    .kiliride-testimony .testimonial-nav {
        left: 20px;
        bottom: 50px;
    }
    .kiliride-testimony .testimonial .testimonial-text .text-holder
    {
        width: 90%;
    }
    .kiliride-testimony .testimonial .testimonial-text{
        width: 100%;
        height: 250px;
    }
    .testimonial-img {
        width: 100%;
       height: 300px;
    }
    .kiliride-testimony .testimonial.active{
        flex-direction: column;
    }
    .kiliride-testimony .testimonial{
        justify-content: unset;
    }
    .kiliride-testimony .testimonial-container {
        width: 90%;
    }
    .kili-flex-inline .flex-line .box-line .box-icon img{
        width: 40px;
        height: 40px;
    }
    .kili-flex-inline .flex-line .box-line .box-icon{
        width: 40px;
        height: 40px;
    }
      .driver-flex-row .driver-flex-holder
    .driver-column .driver-col-inflex{
         margin-bottom: 5px;
    }
    
      .driver-flex-row .driver-flex-holder
    .driver-column .driver-col-inflex .decription h1{
      font-size: 20px;
      line-height: 28px;
    }
    .driver-flex-row .driver-flex-holder
    .driver-column .driver-col-inflex .decription p{
      font-size: 18px;
      line-height: 25px;
    }
    .driver-flex-row .driver-flex-holder
    .driver-column .driver-col-inflex .decription{
      width: 85%;
    }
    .kili-flex-inline .flex-line .box-line{
       width: calc(100% - 5px) !important;
       padding: 10px;
        margin: 10px 0;
    }
    .kili-flex-inline .flex-line{
        width: 90%;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
    .driver-flex-row .driver-flex-holder .driver-column img{
        width: 100%;
    }
    .driver-flex-row .driver-flex-holder .driver-column{
        width: 95%;
        padding-top: 30px;
        height: auto;
    }
    .driver-flex-row .driver-flex-holder .driver-column:nth-child(1){
        width: 100%;
        height: 400px;
    }
    .driver-flex-row .driver-flex-holder{
        width: 90%;
        padding: 20px 0;
        flex-direction: column-reverse;
    }
    .kilidrive-community .kilidrive .the-driver-side .driver-colum-kili h1{
        font-size: 25px;
        line-height: 35px;
        text-align: left;
        width: 100%;
    }
    .kilidrive-community .kilidrive .the-driver-side{
        width: 100%;
        height: 400px;
    }
    .kilidrive-community .kilidrive{
        width: 90%;
        flex-direction: column;
    }
    .kilidrive-community{
        margin: 30px 0;
    }
    .kiliride-driver-holder .kiliride-driver
 .drivers-side .driver-side-detail .top-driver-head h1{
    font-size: 25px;
    line-height: 35px;
 }
    .kiliride-driver-holder .kiliride-driver{
        flex-direction: column-reverse;
        height: auto;
        margin-top: 30px 0;
        width: 90%;
    }
    .kiliride-driver-holder .kiliride-driver .drivers-side{
        width: 100%;
        height: 400px;
        margin-bottom: 0;
    }
     .kiliride-driver-holder .kiliride-driver .drivers-side:nth-child(1){
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .kiliride-driver-holder .kiliride-driver .drivers-side img{
        height: 400px;
    }
    .kilidrive-community .kilidrive .the-driver-side .driver-colum-kili img{
        height: 200px;
    }
    .kilidrive-community .kilidrive .the-driver-side .driver-colum-kili{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
}

/*new driver page css end*/






/*new ride page css*/
.kili-ride-static-row{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 80px 0;
    margin-top: 0;
}
.kili-ride-static-row .ride-static-row{
    width: 80%;
    max-width: 1200px;
    display: flex;
    height: 400px;
}
.kili-ride-static-row .ride-static-row .static-row img{
    width: 90%;
    height: 400px;
    object-fit: cover;
    border-radius: 30px;
    position: absolute;
    right: 0;
}
.kili-ride-static-row .ride-static-row .static-row{
    width: 50%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    position: relative;
}
.kili-ride-static-row .ride-static-row .static-row h1{
    font-family: 'gilroy-bold';
    letter-spacing: 0;
    line-height: 60px;
    font-size: 60px;
    color: #212121;
    text-align: start;
    margin-bottom: 20px;
}
.kili-ride-static-row .ride-static-row .static-row h1 span{
    color: var(--color);
    font-family: 'gilroy-bold';
}
.kili-ride-static-row .ride-static-row .static-row p{
    color: #62628A;
    font-size: 20px;
    letter-spacing: 0;
    line-height: 25px;
    margin-bottom: 20px;
}
.kili-ride-static-row .ride-static-row .static-row a{
    font-family: 'gilroy-bold';
}
.kili-ride-second-row-flex{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 80px 0;
    background-color: var(--kili-box);
}
.kili-ride-second-row-flex .second-row-flex{
    width: 80%;
    max-width:1200px;
    display: flex;
    height: 400px;
}
.kili-ride-second-row-flex .second-row-flex .row-flex-kiliride{
    width: 50%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    position: relative;
}
.kili-ride-second-row-flex .second-row-flex .row-flex-kiliride img{
    width: 90%;
    height: 400px;
    object-fit: cover;
    border-radius: 30px;
    position: absolute;
    left: 0;
}
.kili-ride-second-row-flex .second-row-flex .row-flex-kiliride h1{
    font-family: 'gilroy-bold';
    font-size: 65px;
    line-height: 80px;
    letter-spacing: 0;
    color: #fff;
}
.kili-ride-second-row-flex .second-row-flex .row-flex-kiliride p{
    color: #fff;
    font-size: 20px;
    letter-spacing: 0;
    line-height: 25px;
    margin-bottom: 20px;
}
.kili-ride-second-row-flex .second-row-flex .row-flex-kiliride h1 span{
    color: var(--color);
    font-family: 'gilroy-bold';
}
.kiliride-frame-1{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 50px 0;
    margin-top: 20px;
}
.kiliride-frame-1 .frame-flex-row{
    width: 80%;
    max-width:1200px;
    height: 360px;
    background-color: var(--color);
    border-radius: 30px;
    display: flex;
    justify-content: center;
}
.kiliride-frame-1 .frame-flex-row .frame-coontent-col{
    width: 400px;
    height: auto;
    position: relative;
}
.kiliride-frame-1 .frame-flex-row .frame-coontent-col img{
    position: absolute;
    top: 0;
    width: 400px;
    height: 330px;
    object-fit: contain;
}
.ride-fleet{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.ride-fleet .the-fleet{
    width: 80%;
    max-width: 1200px;
    padding: 40px 0;
    display: flex;
    justify-content: space-between;
}
.ride-fleet .the-fleet h1{
    font-family: 'gilroy-bold';
    font-size: 35px;
}
.ride-fleet .the-fleet p{
    width: 50%;
    letter-spacing: 0;
    font-size: 20px;
    color: #62628A;
    line-height: 20px;
    font-weight: 600;
    text-align: justify;
}
.kiliride-transport-medium{
    width: 100%;
    height: auto;
    padding: 50px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-transport-medium .trans-meddium{
    width: 80%;
    max-width:1200px;
    padding: 40px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.kiliride-transport-medium .trans-meddium .medium{
    width: 45%;
    margin-left: 10px;
    margin-bottom: 20px;
    height: auto;
}
.kiliride-transport-medium .trans-meddium .medium:nth-child(1) .medium-round img{
    width: 150px;
    height: 120px;
    margin: -20px -30px;
}
.kiliride-transport-medium .trans-meddium .medium .medium-round{
    background-color:  #F0F5FF;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    position: relative;
}
.kiliride-transport-medium .trans-meddium .medium .medium-round img{
    position: absolute;
    bottom: -10px;
    left: -10px;
    height: 100px;
    width: 100px;
    object-fit: contain;
}
.kiliride-transport-medium .trans-meddium .medium h1{
    font-family: 'gilroy-bold';
    font-size: 20px;
    margin: 20px 0;
    letter-spacing: 0;
} 
.kiliride-transport-medium .trans-meddium .medium p{
    font-size: 15px;
    color: #62628A;
    line-height: 25px;
}

@media(max-width: 580px){
    .kiliride-transport-medium{
        padding: 0;
    }
    .kiliride-transport-medium .trans-meddium .medium{
        width: calc(100% - 20px);
    }
    .kiliride-transport-medium .trans-meddium{
        width: 90%;
    }
    .ride-fleet .the-fleet{
        width: 90%;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .ride-fleet .the-fleet h1{
        font-size: 25px;
        line-height: 32px;
        margin-bottom: 15px;
    }
    .ride-fleet .the-fleet p{
        width: 100%;
        text-align: center;
        font-size: 12px;
        line-height: 20px;
    }
    .kiliride-frame-1 .frame-flex-row .frame-coontent-col img{
        width: 300px;
        height: 200px;
    }
    .kiliride-frame-1 .frame-flex-row .frame-coontent-col{
        width: 300px;
    }
    .kiliride-frame-1 .frame-flex-row{
        width: 90%;
        height: 220px;
    }
    .kili-ride-second-row-flex{
        align-items: center;
        justify-content: center;
        padding: 40px 0;
    }
    .kili-ride-second-row-flex .second-row-flex .row-flex-kiliride{
        align-items: center;
        width: 100%;
    }
    .kili-ride-second-row-flex .second-row-flex .row-flex-kiliride p{
        font-size: 15px;
        line-height: 20px;
        text-align: center;
    }
    .kili-ride-second-row-flex .second-row-flex .row-flex-kiliride h1{
        font-size: 25px;
        text-align: center;
        line-height: 40px;
    }
    .kili-ride-second-row-flex .second-row-flex .row-flex-kiliride img{
        position: unset;
        width: 100%;
        height: 300px;
    }
    .kili-ride-second-row-flex .second-row-flex .row-flex-kiliride{
        width: 100%;
        margin: 10px 0;
    }
    .kili-ride-second-row-flex .second-row-flex{
        width: 90%;
        flex-direction: column-reverse;
        height: auto;
    }
    .kili-ride-static-row{
        padding: 40px 0;
    }
    .kili-ride-static-row .ride-static-row{
        width: 90%;
        flex-direction: column;
        height: auto;
    }
    .kili-ride-static-row .ride-static-row .static-row img{
        width: 100%;
        height: 300px;
        border-radius: 15px;
        position: unset;
    }
    .kili-ride-static-row .ride-static-row .static-row{
        width: 100%;
        align-items: center;
        margin: 10px 0;
    }
    .kili-ride-static-row .ride-static-row .static-row h1{
        text-align: center;
        font-size: 40px;
        line-height: 50px;
    }
    .kili-ride-static-row .ride-static-row .static-row p{
        text-align: center;
        font-size: 15px;
        line-height: 20px;
    }
}
@media(min-width: 581px) and (max-width: 900px){
    .kili-ride-static-row .ride-static-row{
        width: 90%;
    }
    .kili-ride-static-row .ride-static-row .static-row h1{
        font-size: 40px;
        line-height: 40px;
    }
    .kili-ride-second-row-flex .second-row-flex{
        width: 90%;
    }
    .kili-ride-second-row-flex .second-row-flex .row-flex-kiliride h1{
        font-size: 40px;
        line-height: 50px;
    }
    .kiliride-frame-1 .frame-flex-row{
        width: 90%;
    }
    .ride-fleet .the-fleet{
        width: 90%;
    }
    .kiliride-transport-medium .trans-meddium{
        width: 90%;
    }
}



.Kiliride-line{
    width: 100%;
    margin: 10px 0;
    justify-content: center;
    align-items: center;
    background-color: var(--kili-box);
    flex-direction: column;
    overflow: hidden;
    display: none;
}
@media(max-width: 580px){
    .Kiliride-line{
        display: flex;
    }
}
.Kiliride-line .desktop-head-up{
    width: 100%;
    padding: 20px 0;
}
.Kiliride-line .desktop-head-up h1{
    font-size: 20px;
    line-height: 30px;
    font-family: 'gilroy-bold';
    letter-spacing: 0;
    color: #fff;
    padding: 0 20px;
    width: calc(100% - 25px);
}
.Kiliride-line .desktop-head-up h1 span{
    color: var(--color);
    font-family: 'gilroy-bold';
}
.key-features {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 90%;
}
.Kiliride-line h2{
    font-size: 15px;
    color: #fff;
    letter-spacing: 0;
}
.key-features .feature{
    width: 100%;
    height: auto;
    padding: 20px 0;
    margin: 10px 0;
    border-radius: 12px;
    border: 1px solid var(--color);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #1C1C1C;
    z-index: 2;
}
.key-features .feature h1{
    font-size: 20px;
    color: #fff;
    margin-bottom: 20px;
    font-weight: 600;
}
.key-features .feature p{
    line-height: 25px;
    font-size: 15px;
    color: #fff;
    margin: 0 0 10px;
    text-align: center;
}
.Kiliride-line .line {
    position: absolute;
    left: 50%;
    top: 10px;
    width: 4px;
    height: 100%; 
    background-color: red;
}
.download-kiliride-app{
    width: 100%;
    margin: 50px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.download-kiliride-app .kiliride-app-side-holder{
    width: 80%;
    max-width:1200px;
    display: flex;
    background-color: var(--color);
    padding: 40px 0;
    border-radius: 50px;
    position: relative;
}
.kiliride-app-side-holder .kiliride-app-side{
    height: 400px;
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.kiliride-app-side-holder .kiliride-app-side:nth-child(2){
    justify-content: center;
    display: flex;
    align-items: flex-end;
    width: 45%;
    position: absolute;
    right: 50px;
    bottom: -40px;
}
.kiliride-app-side-holder .kiliride-app-side:nth-child(2) h1{
    font-size: 37px;
    color: #fff;
    line-height: 45px;
    text-align: right;
    font-family: 'gilroy-bold';
}
.kiliride-app-side-holder .kiliride-app-side .download-flex-btn{
    display: flex;
    margin: 20px 0;
}
.kiliride-app-side-holder .kiliride-app-side .download-flex-btn .download-kiliride{
    margin: 0 5px;
}
.kiliride-app-side-holder .kiliride-app-side .download-flex-btn .download-kiliride img{
    height: 56px;
    width: 150px;
    object-fit: contain;
}
.kiliride-app-side-holder .kiliride-app-side iframe{
    width: 80%;
    height: 300px;
    border-radius: 25px;
}
@media(min-width: 581px) and (max-width: 900px){
    .kiliride-app-side-holder .kiliride-app-side .download-flex-btn .download-kiliride img{
        width: 90px;
        height: 35px;
    }
}
@media(min-width: 581px) and (max-width: 900px){
    .desktop-mobile-container-second .desktop-mobile-side-second .desktop-decription-second
{
    width: 300px !important;
}
    .kiliride-desktop-column .desktop-column .desktop-head-up h1{
        font-size: 25px;
        line-height: 35px;
    }
    .kiliride-app-side-holder .kiliride-app-side:nth-child(2) h1{
        font-size: 22px;
        line-height: 30px;
    }
    .kiliride-desktop-column .desktop-column{
        width: 90%;
    }
    .download-kiliride-app .kiliride-app-side-holder{
        width: 90%;
        padding: 10px 0;
    }
    .kiliride-app-side-holder .kiliride-app-side iframe{
        height: 250px;
    }
}
@media(max-width: 580px){
  
    .download-kiliride-app .kiliride-app-side-holder{
        width: 90%;
        flex-direction: column-reverse;
        border-radius: 25px;
    }
    .kiliride-app-side-holder .kiliride-app-side{
        height: auto;
        width: 100%;
    }
    .kiliride-app-side-holder .kiliride-app-side:nth-child(2){
        position: unset;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .kiliride-app-side-holder .kiliride-app-side:nth-child(2) h1{
        text-align: center;
        font-size: 20px;
        line-height: 27px;
    }
    .kiliride-app-side-holder .kiliride-app-side iframe{
        width: 90%;
        height: 200px;
    }
    .kiliride-app-side-holder .kiliride-app-side .download-flex-btn .download-kiliride img{
        width: 100px;
        height: 35px;
    }
}

.kiliride-flex-three{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    background-color: var(--kili-box);
}
.flex-head-three{
    background-color: var(--kili-box);
    display: flex;
    flex-direction: column;
    text-align: start;
    padding: 20px 0;
}
@media(max-width: 580px){
    .flex-head-three{
        display: none;
    }
    .kiliride-flex-three{
        display: none;
    }
}
.flex-head-three h1{
    font-size: 50px;
    line-height: 60px;
    font-family: 'gilroy-bold';
    letter-spacing: 0;
    color: #fff;
    padding: 0 100px;
}
.flex-head-three .second-head{
    padding: 10px 0;
    width: 50%;
    border-top: 2px solid var(--color);
    border-top-right-radius: 40px;
    border-right: 2px solid var(--color);
}
.flex-head-three .second-head h2{
    font-size: 20px;
    line-height: 40px;
    font-family: 'gilroy-bold';
    letter-spacing: 0;
    color: #fff;
    padding: 0 100px;
}
.flex-head-three h1 span{
    color: var(--color);
    font-family: 'gilroy-bold';
}
.kiliride-flex-three .animated-kili-line{
    position: absolute;
    left: 50%;
    top: 0;
    width: 2px;
    height: 84%; 
    background-color: var(--color);
}
.kiliride-flex-three .animated-kili-line .end-line{
    position: absolute;
    bottom: 0;
    content: '';
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: var(--color);
    left: -15px;
}
.kiliride-flex-three section{
    width: 100%;
    height: 500px;
    background-color: var(--kili-box);
    display: flex;
}
.kiliride-flex-three section:nth-child(3){
    background-color: #fff;
}
.kiliride-flex-three section .sides-section{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
}
.kiliride-flex-three section .sides-section img{
    width: 400px;
    height: 400px;
    object-fit: contain;
}
.kiliride-flex-three section .sides-section .desktop-decription{
    position: relative;
    width: 90%;
    padding: 20px 0;
    justify-content: start;
    align-items: start;
    display: flex;
    flex-direction: column;
}
.kiliride-flex-three section .sides-section .desktop-decription-middle{
    position: relative;
    width: 90%;
    padding: 20px 0;
    justify-content: flex-end;
    align-items: flex-end;
    display: flex;
    flex-direction: column;
}
.kiliride-flex-three .animated-kili-line::before{
    position: absolute;
    content: '';
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: var(--color);
    left: -15px;
    top: 18%;
}
.kiliride-flex-three .animated-kili-line::after{
    position: absolute;
    content: '';
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: var(--color);
    left: -15px;
    top: 58%;
}
.kiliride-flex-three section .sides-section .desktop-decription h1{
    font-size: 37px;
    color: #fff;
    line-height: 45px;
    font-family: 'gilroy-bold';
}
.kiliride-flex-three section .sides-section .desktop-decription-middle h1{
    font-size: 37px;
    color: #000;
    line-height: 45px;
    font-family: 'gilroy-bold';
}
.kiliride-flex-three section .sides-section .desktop-decription-middle p{
    letter-spacing: 0;
    text-align: right !important;
    justify-content: start;
    font-size: 20px;
    line-height: 30px;
    color: #000;
}
.kiliride-flex-three section .sides-section .desktop-decription p{
    letter-spacing: 0;
    text-align: start !important;
    justify-content: start;
    font-size: 20px;
    line-height: 30px;
    color: #fff;
    margin-left: 0;
}
@media(min-width: 581px) and (max-width: 900px){
    .flex-head-three h1{
        font-size: 30px;
        line-height: 40px;
         padding: 0 50px;
    }
    .flex-head-three .second-head h2{
         padding: 0 50px;
    }
    .kiliride-flex-three section .sides-section .desktop-decription h1{
        font-size: 25px;
    }
    .kiliride-flex-three section .sides-section .desktop-decription-middle h1{
        font-size: 25px;
    }
    .kiliride-flex-three section .sides-section .desktop-decription p{
        line-height: 25px;
    }
}
/*new ride page end*/






/*swiper*/
.swiper {
    width: 100%;
    height: 600px;
    background-image: linear-gradient(rgba(4,9,30,0.5),rgba(4,9,30,0.5)), url(images/webp/background2-kili.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: center;
    align-items: center;
}
.swiper .swiper-head{
    position: relative;
    width: calc(100% - 120px);
}
.swiper .swiper-head h1{
    position: absolute;
    color: #fff;
    top: 200px;
    left: 10%;
    font-family: 'gilroy-bold';
    font-weight: 700;
    font-size: 4em;
}

.swiper-slide{
    position: relative;
}
.swiper-slide .text-slide{
    position: absolute;
    bottom: 30px;
    width: 50%;
    height: 200px;
    left: 10%;
}
.swiper-slide .text-slide p{
    line-height: 28px;
    color: #fff;
}

.swiper-slide p{
    font-family: 'gilroy-bold';
}
@media(max-width: 700px){
    .swiper .swiper-head{
        width: calc(100% - 20px);
    }
    .swiper .swiper-head h1{
        top: 200px;
        font-size: 2.5em;
        left: 20px;
    } 
    .swiper-slide .text-slide{
        left: 20px;
        width: calc(100% - 20px);
        height: auto;
        bottom: 10px;
    }
}
.swiper-button-prev::before,
.swiper-button-next::before{
    display: none;
}
.swiper-pagination-bullet{
    background-color: var(--box) !important;
}
.swiper-pagination-bullet-active{
    background-color: var(--color) !important;
}
.jump-button{
    padding: 20px 0;
}
 
.abouting-{
    width: 100%;
    height: 700px !important;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    margin-bottom: 0;
}
.ex-slide{
    display: flex;
    text-wrap: nowrap;
    margin-top: -20px;
    transition: ease-in 2s;
    width: 100%;
    align-items: start;
    justify-content: start;
    text-align: start;
   
}
 
 .ex-slide ul{
    display: flex;
}
 .ex-slide ul li{
    text-decoration: none;
    list-style: none;
    display: flex;
    margin-right: 20px;
   
}
.ex-slide ul li a{
    text-decoration: none;
    color: #fff;
    background-color: #ED1C24;
    width: 100px;
    text-align: center;
    padding: 10px;
    border-radius: 30px;
    float: right;
    cursor: pointer;
    font-weight: 700;
    transition: 1s;
}
.ex-slide a:hover{
    background-color: #fff;
    color: var(--black);
}

.words{
    top: 300px;
    left: 9%;
    position: absolute;
    align-items: flex-start;
    width: 800px;
    height: 400px;
   
}
@media(min-width: 701px) and (max-width: 950px){
    .words{
        width: 500px !important;
    }
}
@media(min-width: 701px) and (max-width: 1050px){
    .abouting-{
        height: 800px !important;
    }
    .words{
        top: 20%;
    }
}
@media(min-width: 1400px) and (max-width: 3000px){
    .abouting-{
        height: 800px !important;
    }
    .words{
        top: 20%;
    }
}
.abouting- .words h1{
    text-wrap: nowrap;
    white-space: nowrap;
    font-size: 4rem;
    line-height: 70px;
    color: #fff;
    font-weight: 700;
    text-align: start;
    margin-bottom: 30px;
}
 
.abouting- .words p{
    color: #fff;
    width: 100%;
    font-weight: 500;
    line-height: 25px;
    font-size: 15px;
    text-align: start;
}

/* working on fleet top head*/
.fleet-top-head{
    background-image:linear-gradient(rgba(4,9,30,0.5),rgba(4,9,30,0.5)), url(images/back2.webp);
    width: 100%;
    height: 700px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.fleet-top-head .fleet-words{
    transform: translateY(80%);
    width: 50%;
    padding: 0 100px;
}
@media(min-width: 1400px) and (max-width: 3000px){
    .fleet-top-head{
        height: 800px !important;
    }
    .fleet-top-head .fleet-words{
        transform: translateY(10%);
    }
}
.fleet-top-head .fleet-words .links-vst-back{
    width: 100%;
    padding: 30px 0;
    text-align: start;
}
.fleet-top-head .fleet-words .links-vst-back a{
    background-color: #ED1C24;
    color: #fff;
    text-decoration: none;
    text-wrap: nowrap;
    border-radius: 30px;
    padding: 15px 20px;
    font-weight: 700;
}
.fleet-top-head .fleet-words h1{
    text-wrap: nowrap;
    white-space: nowrap;
    font-size: 5rem;
    line-height: 80px;
    color: #fff;
    font-weight: 700;
}
.fleet-top-head .fleet-words p{
    color: #fff;
    width: 100%;
    font-weight: 400;
    line-height: 30px;
    font-size: 1rem;
    text-align: start;
}
/* working on fleet top head end*/
.mission{
    align-items: center;
    text-align: center;
    justify-content: center;
    place-items: center;
    height: auto;
    padding: 20px 0;
    width: 85%;
    margin-left: 8%;
}
.mission .subjectives{
    display: flex;
    width: 100%;
    height: auto;
}
.mission .subjectives .subject{
    width: 45%;
    height: 100%;
    display: block;
    padding: 5px 20px;
    text-align: start;
    justify-content: center;
}
.mission .subjectives .subject .points{
    display: flex;
    margin-bottom: 20px;
}
.mission .subjectives .subject .points .back{
    width: auto;
    display: flex;
    width: 90%;
}

.mission .subjectives .subject .points .back:last-child{
    display: block;
}
.mission .subjectives .subject .points .back h2{
    color: #fff;
    font-size: 15px;
}
.mission .subjectives .subject .points .back h3{
    font-weight: 700;
    padding: 0 10px;
    text-wrap: nowrap;
}
.mission .subjectives .subject .points .back p{
    padding: 0 10px;
}
.mission .subjectives .subject .points .back:first-child{
    font-size: 12px;
    justify-content: center;
    align-items: center;
    text-align: center;
    place-items: center;
    color: #ffffff;
    background-color: #ED1C24;
    border-radius: 50%;
    width: 40px;
    height: 40px;
}
.mission .subjectives .subject img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
    
}
.mission .subjectives .subject h1{
    font-size: 2rem;
    color: var(--black);
    margin-bottom: 0;
    padding: 20px 0;
    font-weight: 700;
}
.mission .subjectives .subject p{
    line-height: 28px;
    text-align: start;
    margin-left: 0;
    width: 90%;
}
 
@media(min-width: 701px) and (max-width: 1050px){
    .abouting-{
        height: 800px;
    }
}
@media(min-width: 100px) and (max-width: 350px){
    .fleet-top-head .fleet-words{
        transform: translateY(60%) !important;
    }
}
 
/*Iphone SE, samsung s8 media query*/
@media(min-width: 350px) and (max-width: 375px){
    .fleet-top-head .fleet-words{
        transform: translateY(80%) !important;
    }
}
 
@media(min-width: 701px) and (min-height: 1080px){
    .fleet-top-head {
        height: 400px !important;
    }
    .fleet-top-head .fleet-words{
        transform: translateY(-150%) !important;
        background-color: yellowgreen;
     }
}
@media(max-width: 700px){
    .fleet-top-head .fleet-words{
        transform: translateY(60%);
        width: 90%;
        padding: 0 20px;
    }
    .fleet-top-head .fleet-words h1{
        font-size: 2rem;
 
        line-height: 50px;
        color: #fff;
        font-weight: 700;
    }
    .fleet-top-head .fleet-words p{
        font-size: 1rem;
        line-height: 25px;
        text-align: justify;
    }
    body{
    overflow-x: hidden;
    }
    .abouting-{
        height: 700px !important;
        width: 100%;
    }
    .fleet-top-head{
        height: 600px !important;
    }
    .fleet-top-head .fleet-words{
 
        transform: translateY(80%) !important;
    }
    .words{
        width: 90%;
        left: 0;
        position: relative;
        padding: 50px 20px;
        height: auto;
        top: 25%;
    }
    .ex-slide a{
        margin-left: 0;
        padding: 20px;
    }
    .ex-slide{
        margin-top: -20px;
        width: 100%;
        align-items: start;
        justify-content: start;
        text-align: start;
        margin-left: 0;
    }
    .abouting- .words h1{
        font-size: 30px;
        padding: 0;
        line-height: 38px;
        margin-bottom: 0;
    }
    .mission .subjectives .subject .points .back{
        width: 80%;
    }
    .mission .subjectives .subject img{
        width: 90%;
        margin-left: 5%;
    }
    .mission .subjectives .subject .points{
       width: 80%;
       margin-left: 15%;
    }
    .mission .subjectives .subject .points .back:first-child{
        width: 30px;
        height: 30px;
    }
    .mission .subjectives .subject .points .back p{
        display: inline-block;
        width: 100%;
        text-wrap: balance;
        padding: 0;
    }
    .mission .subjectives .subject .points .back h3{
        text-align: start;
        align-items: start;
        padding: 0 20px;
    }
    .mission .subjectives .subject .points .back h2{
        font-size: 12px;
    }
    .mission{
        width: 100%;
        margin-left: 0;
    }
    .mission .subjectives{
        flex-direction: column;
        margin-bottom: 30px;    }
    .mission .subjectives .subject{
        width: 100%;
        padding: 0 0;
    }
    .mission .subjectives:nth-child(2){
        flex-direction: column-reverse;
    }
    .mission .subjectives .subject h1{
        margin-bottom: 5px;
        padding: 15px 25px;
        font-size: 1.5rem;
        margin-top: 30px;
        text-align: center;
    }
    .mission .subjectives .subject p{
        margin-bottom: 20px;
        padding: 10px 10px;
        margin-left: 7%;
        width: 80%;
        font-size: 1rem;
        text-align: center;
    }
    .mission .subjectives .subject .points .back p{
        text-align: start;
    }
}
.log-box-001{
    background-image: url(images/flex/Where\ are\ we.png);
    width: 100%;
    background-size: cover;
    background-position: center;
    height: 500px;
    padding: 20px 0;
}




/* kiliride about u page */
.kiliride-about-us-top-{
    position: relative;
    width: 100%;
    height: 800px;
}
.kiliride-about-us-top-cover{
    position: absolute;
    top: 0;
    width: 100%;
    height: 800px;
    background-color: #08031A;
    justify-content: center;
    align-items: center;
    display: flex;
}
.kiliride-about-us-top-cover .cover-container{
    width: 80%;
    height: 500px;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
}
.kiliride-about-us-top-cover .cover-container .top-about{
    height: 500px;
    gap: 10px;
    display: flex;
    align-items: center;
}
.kiliride-about-us-top-cover .cover-container .top-about:nth-child(1){
    width: 700px;
}
.kiliride-about-us-top-cover .cover-container .top-about:nth-child(2){
    flex-direction: column;
    width: 310px;
    margin-left: -50px;
}

.kiliride-about-us-top-cover .cover-container .top-about .text-details{
    margin: 0 20px;
}
.kiliride-about-us-top-cover .cover-container .top-about .text-details h1{
    font-size: 60px;
    line-height: 65px;
    letter-spacing: 0;
    color: #fff;
    font-family: 'gilroy-bold';
}
.kiliride-about-us-top-cover .cover-container .top-about .text-details p{
    margin: 20px 0;
    line-height: 25px;
    font-size: 20px;
    color: #fff;
}
@media(min-width: 901px) and (max-width: 1200px){
    .kiliride-about-us-top-cover .cover-container .top-about .text-details h1{
        font-size: 40px;
        line-height: 45px;
    }
    .kiliride-about-us-top-cover .cover-container .top-about:nth-child(1){
        width: 500px;
    }
}
@media(min-width: 581px) and (max-width: 900px){
    .kiliride-about-us-top-cover .cover-container .top-about .text-details h1{
        font-size: 30px;
        line-height: 35px;
    }
    .kiliride-about-us-top-cover .cover-container .top-about:nth-child(1){
        width: 400px;
    }
    .kiliride-about-us-top-cover .cover-container{
        width: 98%;
    }
}
.kiliride-about-us-top-cover .cover-container .top-about img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
    transition: .2s ease-in;
}
.kiliride-about-us-top-cover .cover-container .top-about img:hover{
    transform: scale(1.05);
}
.kiliride-about-us-top-cover .cover-container .top-about .top-image{
    width: 100%;
    height: 290px;
    display: flex;
    justify-content: space-between;
}
.kiliride-about-us-top-cover .cover-container .top-about .top-image .card-left{
    width: 200px;
    height: 100%;
}
.kiliride-about-us-top-cover .cover-container .top-about .top-image .card-right{
    width: 100px;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.kiliride-about-us-top-cover .cover-container 
.top-about .top-image .card-right .high{
    height: 100px;
    width: 100%;
    margin-bottom: 10px;
}
.kiliride-about-us-top-cover .cover-container 
.top-about .top-image .card-right .low{
    height: 180px;
    width: 100%;
}
.kiliride-about-us-top-cover .cover-container .top-about .lower-images{
    width: 100%;
    height: 200px;
    display: flex;
    justify-content: space-between;
}
.kiliride-about-us-top-cover .cover-container .top-about .lower-images .card-left{
    width: 100px;
    height: 100%;
}
.kiliride-about-us-top-cover .cover-container .top-about .lower-images .card-right{
    width: 200px;
    height: 100%;
}
@media(max-width: 700px){
    .kiliride-about-us-top-cover .cover-container .top-about .text-details p{
        text-align: center;
    }
    .kiliride-about-us-top-{
        height: 950px;
    }
    .kiliride-about-us-top-cover{
        height: 950px;
    }
    .kiliride-about-us-top-cover .cover-container .top-about{
        height: auto;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .kiliride-about-us-top-cover .cover-container .top-about .text-details{
        width: 90%;
        margin: 100px 0;
    }
    .kiliride-about-us-top-cover .cover-container .top-about .text-details h1{
        font-size: 20px;
        line-height: 45px;
        text-align: center;
    }
    .kiliride-about-us-top-cover{
        flex-direction: column;
    }
    .kiliride-about-us-top-cover .cover-container{
        width: 100%;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .kiliride-about-us-top-cover .cover-container .top-about:nth-child(1){
        width: 100%;
    }
    .kiliride-about-us-top-cover .cover-container .top-about:nth-child(2){
        margin-left: 0;
    }
}
.kiliride-passenger{
    width: 100%;
    height: 400px;
    background-attachment: fixed;
    background-image: url(images/flex/kiliride-passenger-001.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
@media(max-width: 580px){
    .kiliride-about-us-top-cover .cover-container .top-about .text-details h1{
        font-size: 30px;
        line-height: 35px;
    }
    .kiliride-passenger{
        height: 200px;
    }
}
@media(min-width: 581px) and (max-width: 900px){
    .kiliride-passenger{
        height: 300px;
    }
}
.kiliride-number-counter{
    width: 100%;
    height: auto;
    padding: 40px 0;
    background-color: #08031A;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-number-counter .count-down{
    width: 80%;
    padding: 30px 0;
    max-width: 1200px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-number-counter .count-down .statistics{
    width: 50%;
    display: flex;
}
.kiliride-number-counter .count-down .statistics:nth-child(2){
    display: flex;
    justify-content: start;
    align-items: start;
    height: 80px;
}
.kiliride-number-counter .count-down .statistics .number{
    width: 200px;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;
    margin: 0 10px;
}
.kiliride-number-counter .count-down .statistics .number .counteer{
    display: flex;
}
.kiliride-number-counter .count-down .statistics .number .text{
    text-align: left;
    justify-content: start;
    align-items: start;
}
.kiliride-number-counter .count-down .statistics .number .text p{
    text-align: left;
    font-size: 24px;
    color: #fff;
    font-family: 'gilroy-bold';
}
.kiliride-number-counter .count-down .statistics .number .counteer .up{
    font-size: 30px;
    color: #fff;
    font-family: 'gilroy-bold';
}
.kiliride-number-counter .count-down .statistics .number .counteer h1{
    font-size: 90px;
    font-family: 'gilroy-bold';
    color: #fff;
}
.kiliride-number-counter .count-down .statistics .new{
    display: flex;
    justify-content: start;
    align-items: start;
    width: 100%;
    padding: 0;
}
.kiliride-number-counter .count-down .statistics .new .round{
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #08031A;
    border: 1px solid var(--color);
}
.kiliride-number-counter .count-down .statistics .new .round i{
    color: var(--color);
    font-size: 12px !important;
}
.kiliride-number-counter .count-down .statistics .new p{
    margin-left: 20px;
    width: calc(100% - 20px);
    color: #fff;
    font-size: 20px;
    line-height: 22px;
}
@media(max-width: 580px){
    .kiliride-number-counter .count-down .statistics .number .counteer .up{
        font-size: 15px;
    }
    .kiliride-number-counter .count-down{
        width: 90%;
        flex-direction: column;
    }
    .kiliride-number-counter .count-down .statistics{
        width: 100%;
        margin: 15px 0;
    }
    .kiliride-number-counter .count-down .statistics .number{
        width: auto;
    }
    .kiliride-number-counter .count-down .statistics .number .counteer h1{
        font-size: 40px;
    }
}
@media(min-width: 581px) and (max-width: 900px){
    .kiliride-number-counter .count-down{
        width: 95%;
    }
    .kiliride-number-counter .count-down .statistics .number .counteer .up{
        font-size: 20px;
    }
    .kiliride-number-counter .count-down .statistics .number .counteer h1{
        font-size: 40px;
    }
}
.kiliride-middle-cover{
    background-image: url(images/flex/kiliride-staff-001.png);
    background-attachment: fixed;
    height: 400px;
    width: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
@media(max-width: 580px){
    .kiliride-middle-cover{
        height: 180px;
    }
}
@media(min-width: 581px) and (max-width: 900px){
    .kiliride-middle-cover{height: 300px;}
}
.kiliride-core-aspect{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 80px 0;
}
.kiliride-core-aspect .aspect{
    width: 400px;
    height: auto;
    padding: 20px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.kiliride-core-aspect .aspect h1{
    font-family: 'gilroy-bold';
    font-size: 50px;
    line-height: 70px;
    padding: 10px 0;
}
.kiliride-core-aspect .aspect p{
    color: #62628A;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
}

@media(max-width: 580px){
    .kiliride-core-aspect .aspect{
        width: 90%;
    }
    .kiliride-core-aspect .aspect h1{
        font-size: 30px;
        line-height: 40pxx;
    }
}
.kiliride-core-values{
    padding: 80px 0;
    width: 100%;
    height: auto;
    background-color: #08031A;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-core-values .core-valuees{
    width: 80%;
    max-width: 1200px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.kiliride-core-values .core-valuees .description{
    height: auto;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
 
.kiliride-core-values .core-valuees .description h1{
    font-size: 60px;
    line-height: 65px;
    color: #fff;
    font-family: 'gilroy-bold';
    margin-bottom: 50px;
}
.kiliride-core-values .core-valuees .description .the-sides{
    width: 50%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}
.kiliride-core-values .core-valuees .description .the-sides img{
    width: 400px;
    height: 400px;
    object-fit: contain;
}
.kiliride-core-values .core-valuees .description .the-sides .kili-values-flex{
    margin-bottom: 20px;
    display: block;
    width: 100%;
}
.kiliride-core-values .core-valuees .description .the-sides .kili-values-flex h1{
    font-size: 20px;
    font-family: 'gilroy-bold';
    margin: 0;
    color: #fff;
}
.kiliride-core-values .core-valuees .description .the-sides .kili-values-flex p{
    font-size: 20px;
    line-height: 25px;
    color: #959292;
}
@media(max-width: 580px){
    .kiliride-core-values .core-valuees .description .the-sides img{
        width: 90%;
    }
    .kiliride-core-values .core-valuees .description .the-sides{
        width: 100%;
    }
    .kiliride-core-values .core-valuees .description h1{
        font-size: 30px;
        margin-bottom: 10px;
    }
    .kiliride-core-values{
        padding: 40px 0;
    }
    .kiliride-core-values .core-valuees{
        width: 90%;
    }
    .kiliride-core-values .core-valuees .description{
        flex-direction: column;
    }
}
@media(min-width: 581px) and (max-width: 900px){
    .kiliride-core-values .core-valuees .description .the-sides img{
        width: 90%;
    }
    .kiliride-core-values .core-valuees .description .the-sides{
        width: 100%;
    }
    .kiliride-core-values .core-valuees .description h1{
        font-size: 50px;
        margin-bottom: 30px;
    }
    .kiliride-core-values .core-valuees{
        width: 90%;
    }
    .kiliride-core-values .core-valuees .description{
        flex-direction: column;
    }
}
.kiliride-story{
    background-color: #B70F15;
    width: 100%;
    height: auto;
    padding: 80px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-story .story-holder{
    width: 80%;
    max-width: 1200px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.kiliride-story .story-holder h1{
    font-size: 60px;
    font-family: 'gilroy-bold';
    color: #fff;
}
.kiliride-story .story-holder .story-video{
    width: 80%;
    height: 500px;
    max-width: 1200px;
    margin: 20px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-story .story-holder .story-video video{
    width: 900px;
    max-width: 1200px;
    height: 500px;
    object-fit: cover;
    border-radius: 30px;
}
@media(min-width: 581px) and (max-width: 900px){
    .kiliride-story .story-holder .story-video video{
        width: 99%;
        height: 400px;
    }
}
@media(max-width: 580px){
    .kiliride-story{
        padding: 40px 0;
    }
    .kiliride-story .story-holder{
        width: 90%;
        height: auto;
    }
    .kiliride-story .story-holder .story-video{
        width: 100%;
        height: 200px;
    }
    .kiliride-story .story-holder .story-video video{
        height: 200px;
        border-radius: 15px;
    }
    .kiliride-story .story-holder{
        width: 90%;
    }
    .kiliride-story .story-holder h1{
        font-size: 30px;
    }
}
@media(min-width: 581px) and (max-width: 900px){
    .kiliride-story .story-holder h1{
        font-size: 40px;
    }
    .kiliride-story .story-holder{
        width: 90%;
    }
    .kiliride-story .story-holder .story-video{
        width: 100%;
        border-radius: 50px;
    }
}
.kiliride-carousel-about{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #08031A;
    flex-direction: column;
    padding: 80px 0;
}
.kiliride-carousel-about .head-section{
    padding: 40px 0;
    width: 500px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.kiliride-carousel-about h2{
    color: #fff;
    font-family: 'gilroy-bold';
    font-size: 40px;
    padding: 40px 0;
}
.kiliride-carousel-about p{
    color: #62628A;
    line-height: 25px;
    font-size: 20px;
    text-align: center;
}
.carousel-container-in-about {
    position: relative;
    max-width: 800px;
    margin: auto;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}
.carousel-in-about {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    margin: 0 50px;
    justify-content: left;
    scroll-behavior: smooth;
    scrollbar-width: none; /* Hide scrollbar for modern browsers */
}
.carousel-in-about::-webkit-scrollbar {
    display: none; /* Hide scrollbar for WebKit browsers */
}
.carousel-container-in-about .kiliride-member {
    min-width: 225px;
    height: 280px;
    flex: 0 0 auto;
    box-sizing: border-box;
    padding: 10px;
    border-radius: 10px;
    text-align: center;
    display: block;
}
.carousel-container-in-about .kiliride-member .name{
    margin: 10px 0;
}
.carousel-container-in-about .kiliride-member .name legend{
    font-size: 16px;
    color: #fff;
    font-weight: 500;
}
.carousel-container-in-about .kiliride-member .name p{
    font-size: 16px;
    color: #fff;
    font-weight: 500;
}
.carousel-container-in-about .kiliride-member img {
    width: 200px;
    height: 200px;
    object-fit: cover;
    border-radius: 10px;
}
 .carousel-container-in-about .arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: var(--color);
    color: #08031A;
    border: none;
    cursor: pointer;
    font-size: 20px;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.carousel-container-in-about .arrow-left {
    left: 5px;
}
.carousel-container-in-about .arrow-right {
    right: 0;
}
@media(min-width: 581px) and (max-width: 900px){
    .carousel-container-in-about {
        max-width: 100%;
    }
}
@media(max-width: 580px){
    .carousel-container-in-about {
        width: 100%;
    }
    .kiliride-carousel-about p{
        font-size: 18px;
        line-height: 22px;
    }
    .kiliride-carousel-about h2{
        font-size: 20px;
        line-height: 25px;
    }
    .kiliride-carousel-about .head-section{
        width: 90%;
    }
    .kiliride-carousel-about{
        padding: 40px 0;
    }
}
.kiliride-location{
    background-image: url(images/flex/Where\ are\ we.png);
    background-position: center;
    background-size: cover;
    width: 100%;
    height: 500px;
    background-repeat: no-repeat;
}
@media(max-width: 580px){
    .kiliride-location{
        height: 200px;
    }
}
@media(min-width: 581px) and (max-width: 900px){
    .kiliride-location{
        height: 300px;
    }
}
.kiliride-sustainability{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 80px 0;
}
.kiliride-sustainability .sustainability-holder{
    width: 80%;
    max-width: 1200px;
    background-color: #F7F7FC;
    border-radius: 60px;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-sustainability .sustainability-holder .sides{
    width: 50%;
    height: auto;
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.kiliride-sustainability .sustainability-holder .sides img{
    object-fit: contain;
    height: 400px;
    width: 500px;
}
.kiliride-sustainability .sustainability-holder .sides .top-head{
    width: 100%;
    padding: 20px 0;
}
.kiliride-sustainability .sustainability-holder .sides .top-head h1{
    font-size: 45px;
    line-height: 50px;
    font-family: 'gilroy-bold';
}
.kiliride-sustainability .sustainability-holder .sides .the-paragraphs{
    width: calc(100% - 80px);
    height: auto;
    padding: 20px 0;
}
.kiliride-sustainability .sustainability-holder .sides .the-paragraphs p{
    margin: 10px 0;
    color: #7B6060;
    font-size: 20px;
    line-height: 25px;
}
.kiliride-sustainability .sustainability-holder .sides .the-paragraphs .learn-more{
    padding: 10px 16px;
    margin: 30px 0;
    color: #fff;
    background-color: var(--color);
    text-decoration: none;
    border-radius: 8px;
}
@media(max-width: 580px){
    .kiliride-sustainability .sustainability-holder .sides img{
        width: 200px;
        height: 200px;
    }
    .kiliride-sustainability .sustainability-holder{
        width: 90%;
        border-radius: 30px;
    }
    .kiliride-sustainability .sustainability-holder .sides .top-head{
        text-align: center;
    }
    .kiliride-sustainability .sustainability-holder{
        flex-direction: column;
    }
    .kiliride-sustainability .sustainability-holder .sides{
        width: 100%;
    }
    .kiliride-sustainability .sustainability-holder .sides .top-head h1{
        font-size: 22px;
        line-height: 28px;
        text-align: center;
    }
}
@media(min-width: 581px) and (max-width: 900px){
    .kiliride-sustainability .sustainability-holder .sides .top-head{
        text-align: center;
    }
    .kiliride-sustainability .sustainability-holder{
        flex-direction: column;
    }
    .kiliride-sustainability .sustainability-holder .sides{
        width: 100%;
    }
    .kiliride-sustainability .sustainability-holder .sides .top-head h1{
        font-size: 30px;
        line-height: 35px;
        text-align: center;
    }
}
@media(min-width: 901px) and (max-width: 1100px){
    .kiliride-sustainability .sustainability-holder .sides .top-head{
        padding: 0;
    }
    .kiliride-sustainability .sustainability-holder .sides .top-head h1{
        font-size: 30px;
        line-height: 35px;
    }
    .kiliride-sustainability .sustainability-holder .sides .the-paragraphs p{
        font-size: 16px;
        line-height: 20px;
    }
    .kiliride-sustainability .sustainability-holder .sides img{
        width: 300px;
    }
}
/* kiliride about us page end */








.retaurant-top-frame{
    width: 100%;
    height: 500px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.retaurant-top-frame .restaurant-frame-holder{
    bottom: 40px;
    position: absolute;
    width: 80%;
    height: 400px;
    max-width: 1200px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.retaurant-top-frame .restaurant-frame-holder .restautant-frame{
    width: 50%;
    height: 300px;
    display: flex;
    justify-content: unset;
    align-items: unset;
    flex-direction: column;
}

.retaurant-top-frame .restaurant-frame-holder .restautant-frame h1{
    font-family: 'gilroy-bold';
    color: #000;
    font-size: 60px;
    line-height: 70px;
}
.retaurant-top-frame .restaurant-frame-holder .restautant-frame h1 span{
    color: var(--color);
    font-family: 'gilroy-bold';
    font-size: 60px;
}
.retaurant-top-frame .restaurant-frame-holder .restautant-frame p{
    color: #62628A;
    font-size: 20px;
    line-height: 25px;
    margin: 20px 0;
} 
.retaurant-top-frame .restaurant-frame-holder .restautant-frame img{
    object-fit: contain;
    width: 500px;
    border-radius: 30px;
}
@media(min-width: 901px) and (max-width: 1270px){
    .retaurant-top-frame .restaurant-frame-holder .restautant-frame img{
        width: 90%;
    }
}

.kiliride-flex-horizontal{
    display: block;
    width: 100%;
    position: relative;
    height: 900px;
    background-color: #08031A;
}
.kiliride-flex-horizontal .flex-horizontal{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
    position: relative;
    height: 250px;
}
.kiliride-flex-horizontal .flex-horizontal .upper-horizontal{
    display: flex;
    justify-content: center;
    width: 80%;
    max-width: 1200px;
    position: relative;
    height: 200px;
}
.kiliride-flex-horizontal .flex-horizontal .upper-horizontal .glass{
    width: 80px;
    height: 80px;
    background-color: #fff;
    transform: rotate(-10deg);
    border-radius: 20px;    
    position: absolute;
    left: 10px;
    top: 5px;
}
.kiliride-flex-horizontal .flex-horizontal .upper-horizontal .glass img{
    object-fit: contain;
    width: 80px;
}
.kiliride-flex-horizontal .flex-horizontal .upper-horizontal .partner-up-form{
    height: 500px;
    position: absolute;
    width: 450px;
    top: -180px;
    background-color: #fff;
    right: 50px;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.partner-up-form .in-form-holder{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 90%;
}
.partner-up-form .partner-form-{
    display: block;
    width: 100%;
}
.partner-up-form .partner-form- h1{
    font-family: 'gilroy-bold';
    color: #1A0244;
    margin: 20px 0 10px;
    font-size: 24px;
}
.partner-up-form .partner-form- p{
    color: #1A0244;
    font-size: 15px;
    line-height: 18px;
    font-weight: 500;
}
.partner-up-form .partner-form- .sign-up-form{
    margin-top: 20px;
}
.partner-up-form .partner-form- .sign-up-form .inputs-first{
    display: flex;
    width: 100%;
    margin: 10px 0;
    justify-content: space-between;
}
.partner-up-form .partner-form- .sign-up-form .inputs-first .first-{
   width: calc(50% - 5px);
}

.partner-up-form .partner-form- .sign-up-form .inputs-first .first- label{
    display: block;
    color: #1A0244;
    margin-bottom: 5px;
    font-family: 'gilroy-bold';
}
.partner-up-form .partner-form- .sign-up-form .inputs-first .first- .input-bar{
    width: 90%;
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #C4C0D3;
    outline: none;
}
.partner-up-form .partner-form- .sign-up-form .other-input{
    width: 100%;
    display: block;
    margin: 10px 0;
}
.partner-up-form .partner-form- .sign-up-form .other-input label{
    display: block;
    color: #1A0244;
    margin-bottom: 5px;
    font-family: 'gilroy-bold';
}
.partner-up-form .partner-form- .sign-up-form .other-input .baner{
    display: flex;
    justify-content: space-between;
}
.partner-up-form .partner-form- .sign-up-form .other-input .baner .flag{
    background-color:#EFEFEF;
    width: 70px;
    display: flex;
    justify-content: center;
    padding: 10px;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    border-top: 1px solid #C4C0D3;
    border-bottom: 1px solid #C4C0D3;
    border-left: 1px solid #C4C0D3;
}
.partner-up-form .partner-form- .sign-up-form .other-input .baner .flag img{
    object-fit: contain;
    width: 30px;
    height: 20px;
}
.partner-up-form .partner-form- .sign-up-form .other-input .baner .flag span{
    font-family: 'gilroy-bold';
    margin: 0 2px;
    color: #1A0244;
} 
.partner-up-form .partner-form- .sign-up-form .other-input .baner .flag-input{
    width: 330px;
    padding: 10px;
    border-top: 1px solid #C4C0D3;
    border-bottom: 1px solid #C4C0D3;
    border-right: 1px solid #C4C0D3;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-left: none;
    outline: none;
}
.partner-up-form .partner-form- .sign-up-form .other-input select{
    width: 400px;
    padding: 10px;
    border: 1px solid #C4C0D3;
    border-radius: 8px;
    color: #1A0244;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    outline: none;
}
.partner-up-form .partner-form- .sign-up-form .other-input select option{
    background-color: #fff;
    color: #1A0244;
    margin: 5px 0;
}
.partner-up-form .partner-form- .sign-up-form .other-input .motor-attribute{
    display: flex;
}
.partner-up-form .partner-form- .sign-up-form .other-input .motor-attribute .check{
    padding: 5px;
    border-radius: 5px;
    color: var(--color);
}
.partner-up-form .partner-form- .sign-up-form .other-input .motor-attribute span{
    margin-left: 5px;  
    color: #1A0244;
    font-weight: 700; 
}
.partner-up-form .partner-form- .sign-up-form .submit{
    width: 100%;
    margin: 10px 0;
}
.partner-up-form .partner-form- .sign-up-form .submit p{
    color: #1A0244;
    margin: 5px 0;
    font-size: 15px !important;
}
.partner-up-form .partner-form- .sign-up-form .submit .submit-btn{
    width: 100%;
    padding: 10px;
    text-align: center;
    border: none;
    background-color:#EFEFEF;
    font-family: 'gilroy-bold';
    border-radius: 8px;
}
.partner-up-form .partner-form- .sign-up-form .form-error{
    width: 100%;
    background-color: red;
    padding: 10px 0;
    display: none;
    text-align: center;
    color: #fff;
}
@media(max-width: 580px){
    .partner-up-form .partner-form- .sign-up-form .other-input .baner .flag-input{
    padding: 15px 10px;
}
.partner-up-form .partner-form- .sign-up-form .other-input select{
    width: 98%;
    padding: 15px 10px;
}
.partner-up-form .partner-form- .sign-up-form .other-input .motor-attribute{
    margin: 5px 0;
}
.partner-up-form .partner-form- .sign-up-form .submit p{
    font-size: 12px;
    margin: 5px 0;
}
.partner-up-form .partner-form- .sign-up-form .submit .submit-btn{
    padding: 15px 0;
}
.partner-up-form .partner-form- .sign-up-form .inputs-first .first-{
        width: 100%;
    }
    .partner-up-form .partner-form- .sign-up-form .inputs-first{
        flex-direction: column;
    }
     
    .partner-up-form .partner-form- .sign-up-form .inputs-first .first- .input-bar{
    width: 92%;
    padding: 15px 10px;
    margin: 5px 0;
}
}
.kiliride-flex-horizontal .lower-horizontal{
    width: 100%;
    padding: 40px 0;
    height: 400px;
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    bottom: 50px;
}
.kiliride-flex-horizontal .lower-horizontal .lower-holder-flex{
    width: 80%;
    max-width: 1200px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-flex-horizontal .lower-horizontal .lower-holder-flex .horizontal-sides{
    width: 50%;
    height: 400px;
    display: block;
}
.kiliride-flex-horizontal .lower-horizontal .lower-holder-flex .horizontal-sides img{
    width: 500px;
    height: 400px;
    object-fit: cover;
    border-radius: 30px;
}
.kiliride-flex-horizontal .lower-horizontal
 .lower-holder-flex .horizontal-sides h1{
    font-size: 60px;
    line-height: 70px;
    font-family: 'gilroy-bold';
    color: #fff;
 }
 .kiliride-flex-horizontal .lower-horizontal
 .lower-holder-flex .horizontal-sides h1 span{
    font-size: 60px;
    font-family: 'gilroy-bold';
    color: var(--color);
 }
 .kiliride-flex-horizontal .lower-horizontal
 .lower-holder-flex .horizontal-sides p{
    color: #A7A7AD;
    font-size: 20px;
    line-height: 25px;
    margin: 20px 0;
 }
 .kiliride-flex-horizontal .center-icon{
    position: absolute;
    bottom: 15px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    
 }
 .kiliride-flex-horizontal .center-icon .icon-hol{
    width: 60px;
    height: 60px;
    border-radius: 12px;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    transform: rotate(15deg);
 }
 .kiliride-flex-horizontal .center-icon .icon-hol img{
    width: 60px;
    object-fit: contain;
 }
 .kiliride-mackbook-mockup{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 50px 0;
 }
 .kiliride-mackbook-mockup .mackbook-sides-holder--{
    width: 80%;
    max-width: 1200px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
 }
 .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides{
    width: 500px;
    height: 300px;
 }
 .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides:nth-child(1){
    display: flex;
    justify-content: center;
 
    position: relative;
 }
 .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides .red-background{
    background-color: var(--color);
    width: 250px;
    height: 270px;
    border-radius: 20px;
    z-index: -1;
    position: absolute;
 }
 .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides img{
    object-fit: contain;
    width: 400px; 
    height: 300px; 
 }
 .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides h1{
    font-size: 50px;
    line-height: 60px;
    color: #372D5E;
    font-family: 'gilroy-bold';
 }

 @media(min-width: 901px) and (max-width: 1270px){
    .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides h1{
        font-size: 40px;
        line-height: 50px;
    }
    .kiliride-flex-horizontal .lower-horizontal
    .lower-holder-flex .horizontal-sides h1 span{
        font-size: 40px;
        line-height: 50px;
    }
    .kiliride-flex-horizontal .lower-horizontal
 .lower-holder-flex .horizontal-sides h1{
    font-size: 40px;
    line-height: 50px;
 }
    .kiliride-flex-horizontal .flex-horizontal .upper-horizontal .partner-up-form{
        right: 0;
      
    }
    .kiliride-flex-horizontal .lower-horizontal .lower-holder-flex .horizontal-sides img{
        width: 90%;
    }
}
 .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides p{
    font-size: 20px;
    line-height: 25px;
    color: #62628A;
    margin: 20px 0;
 }
 .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides .icn-rotate{
    width: 100%;
    height: 35px;
    padding: 20px 0;
 }
 .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides .icn-rotate img{
    object-fit: contain;
    width: 70px;
    height: 70px;
 }
 .kiliride-user-performance{
    width: 100%;
    padding: 40px 0;
    display: flex;
    justify-content: center;
    align-items: center;
 }
 .kiliride-user-performance .user-performance-holder{
    width: 80%;
    max-width: 1200px;
    display: flex;
    justify-content: center;
    align-items: center;
 }
 .kiliride-user-performance .user-performance-holder .user-performance{
    width: 300px;
    height: 250px;
    padding: 20px 0;
    margin: 0 10px;
 }
 .kiliride-user-performance .user-performance-holder .user-performance .icon{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
 }
 .kiliride-user-performance .user-performance-holder .user-performance .icon img{
    width: 40px;
    height: 40px;
    object-fit: contain;
 }
 .kiliride-user-performance .user-performance-holder .user-performance h1{
    padding: 20px 0;
    color: #372D5E;
    font-size: 20px;
    font-family: 'gilroy-bold';
 }
 .kiliride-user-performance .user-performance-holder .user-performance p{
    font-size: 18px;
    line-height: 22px;
    color: #62628A;
    font-weight: 500;
 }
 .popcorn{
    width: 100%;
    display: flex;
 }
 .popcorn img{
    object-fit: contain;
    width: 80px;
    height: 80px;
    margin: 0 300px;
 }
 
 @media(min-width: 581px) and (max-width: 900px){
    .popcorn{
        display: none;
    }
    .kiliride-user-performance .user-performance-holder{
        width: 90%;
    }
    .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides .icn-rotate{
        display: none;
    }
    .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides h1{
        font-size: 30px;
        line-height: 40px;
    }
    .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides{
        width: 45%;
    }
    .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides .red-background{
        width: 200px;
        height: 230px;
    }
    .kiliride-mackbook-mockup .mackbook-sides-holder--{
        width: 90%;
    }
    .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides img{
        width: 280px;
        height: 250px;
    }
    .kiliride-flex-horizontal .center-icon{
        display: none;
    }
    .kiliride-flex-horizontal .lower-horizontal .lower-holder-flex .horizontal-sides{
        width: 100%;
        margin: 20px 0;
        height: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .kiliride-flex-horizontal .lower-horizontal
 .lower-holder-flex .horizontal-sides p{
    text-align: center;
 }
    .kiliride-flex-horizontal .lower-horizontal
    .lower-holder-flex .horizontal-sides h1 span{
        font-size: 40px;
        line-height: 50px;
    }
    .kiliride-flex-horizontal .lower-horizontal
 .lower-holder-flex .horizontal-sides h1{
    font-size: 40px;
    line-height: 50px;
    text-align: center;
 }
 .kiliride-flex-horizontal .lower-horizontal{
    bottom: 150px;
 }
    .kiliride-flex-horizontal .lower-horizontal .lower-holder-flex{
        flex-direction: column-reverse;
        width: 90%;
    }
    .kiliride-flex-horizontal .flex-horizontal .upper-horizontal .partner-up-form{
        position: unset;
        margin-bottom: 20px;
    }
    .kiliride-flex-horizontal .flex-horizontal .upper-horizontal .glass{
        position: absolute;
        left: 20px;
        top: unset;
        bottom: 10px;
        display: none;
    }
    .kiliride-flex-horizontal .flex-horizontal .upper-horizontal{
        flex-direction: column-reverse;
        justify-content: center;
        align-items: center;
        height: 500px;
        width: 90%;
        margin: 0;
    }
    .kiliride-flex-horizontal{
        margin: 150px 0;
        height: 1200px;
    }
    .retaurant-top-frame{
        height: 700px;
    }
    .retaurant-top-frame .restaurant-frame-holder{
        width: 90%;
        height: 600px;
        flex-direction: column-reverse;
        justify-content: center;
        align-items: center;
    }
    .retaurant-top-frame .restaurant-frame-holder .restautant-frame{
        width: 100%;
        justify-content: center;
        align-items: center;
        margin: 20px 0;
    }
}
 .kiliride-food-tablet{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px 0;
 }
 .kiliride-food-tablet .kiliride-tablet-flexx{
    width: 80%;
    max-width: 1200px;
    padding: 20px 0;
    display: flex;
    justify-content: center;
 }
 .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row{
    width: 500px;
    height: 400px;
 }
 .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row img{
    width: 400px;
    height: 400px;
    object-fit: cover;
    border-radius: 30px;
 }
 .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row .upper-part{
    width: 100%;
 }
 .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row .upper-part h1{
    font-size: 45px;
    line-height: 50px;
    color: #372D5E;
    font-family: 'gilroy-bold';
 }
 .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row .upper-part p{
    margin: 20px 0;
    color: #000000;
    font-size: 20px;
 }
 .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row .main-part{
    width: 100%;
 }
 .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row .main-part 
 .part-flex{
    width: 100%;
    height: auto;
    display: flex;
    margin: 15px 0;
 }
 .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row .main-part 
 .part-flex .icon{
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1px solid var(--color);
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
 }
 .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row .main-part 
 .part-flex .icon i{
    color: var(--color);
    font-size: 12px !important;
 }
 .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row .main-part 
 .part-flex .part-data{
    width: calc(100% - 30px);
    display: block;
    padding: 0;
    margin: -5px 10px;
 }
 .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row .main-part 
 .part-flex .part-data h1{
    color: #090909;
    font-size: 20px;
    font-family: 'gilroy-bold';
    margin-bottom: 5px;
 }
 .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row .main-part 
 .part-flex .part-data p{
    font-size: 15px;
    line-height: 22px;
    color: #090909;
    font-weight: 500;
 }

 
@media(max-width: 580px){
      .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row .main-part 
    .part-flex{
        margin: 30px 0;
    }
    .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row .main-part 
    .part-flex .part-data h1{
        font-size: 16px;
        line-height: 20px;
    }
    .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row .upper-part h1{
        font-size: 35px;
        line-height: 40px;
    }
    .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row img{
        width: 100%;
        height: 300px;
    }
    .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row{
        width: 100%;
        height: auto;
        margin: 20px 0;
    }
    .kiliride-food-tablet .kiliride-tablet-flexx{
        width: 90%;
        flex-direction: column;
    }
    .popcorn img{
        margin: 0;
    }
    .kiliride-user-performance .user-performance-holder .user-performance .icon img{
        margin: 0 100px;
    }
    .kiliride-user-performance .user-performance-holder .user-performance .icon{
        justify-content: start;
        align-items: start;
    }
    .kiliride-user-performance .user-performance-holder{
        width: 90%;
        flex-direction: column;
    }
    .kiliride-user-performance .user-performance-holder .user-performance{
        width: 100%;
    }
    .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides .icn-rotate{
        position: relative;
        width: 100%;
    }
    .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides .icn-rotate img{
        right: 0px;
        position: absolute;
    }
    .kiliride-flex-horizontal .center-icon{
      display: flex;
    }
    .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides h1{
        font-size: 35px;
        line-height: 40px;
        text-align: center;
    }
    .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides p{
        text-align: center;
    }
    .kiliride-mackbook-mockup{
        padding: 20px 0;
        margin: -30px 0;
    }
    .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides{
        width: 100%;
        height: auto;
    }
    .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides .red-background{
        width: 200px;
        height: 230px;
    }
    .kiliride-mackbook-mockup .mackbook-sides-holder--{
        width: 90%;
        height: auto;
        flex-direction: column-reverse;
        padding: 20px;
    }
    .kiliride-mackbook-mockup .mackbook-sides-holder-- .mackbook-sides img{
        width: 350px;
        height: 250px;
    }
    .kiliride-flex-horizontal .flex-horizontal .upper-horizontal .partner-up-form{
        width: 100%;
        height: auto;
        margin: 50px 0;
    }
    .kiliride-flex-horizontal .lower-horizontal .lower-holder-flex .horizontal-sides img{
        object-fit: cover;
        width: 90%;
        height: 300px;
    }
    .kiliride-flex-horizontal .lower-horizontal .lower-holder-flex .horizontal-sides{
        width: 100%;
        margin: 20px 0;
        height: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .kiliride-flex-horizontal .lower-horizontal
 .lower-holder-flex .horizontal-sides p{
    text-align: center;
 }
    .kiliride-flex-horizontal .lower-horizontal
    .lower-holder-flex .horizontal-sides h1 span{
        font-size: 40px;
        line-height: 50px;
    }
    .kiliride-flex-horizontal .lower-horizontal
 .lower-holder-flex .horizontal-sides h1{
    font-size: 40px;
    line-height: 50px;
    text-align: center;
 }
 
.kiliride-flex-horizontal .flex-horizontal .upper-horizontal .glass{
    position: absolute;
    left: 20px;
    top: unset;
    bottom: 10px;
    display: none;
}
.kiliride-flex-horizontal .flex-horizontal .upper-horizontal{
    flex-direction: column-reverse;
    justify-content: center;
    align-items: center;
    height: 700px;
    width: 90%;
   
}
 .kiliride-flex-horizontal .lower-horizontal{
    bottom: 250px;
 }
    .kiliride-flex-horizontal .lower-horizontal .lower-holder-flex{
        flex-direction: column-reverse;
        width: 90%;
    }
    .kiliride-flex-horizontal .flex-horizontal .upper-horizontal .partner-up-form{
        position: unset;
        margin-bottom: 20px;
    }
    .kiliride-flex-horizontal .flex-horizontal .upper-horizontal .glass{
        position: absolute;
        left: 20px;
        top: unset;
        bottom: -100px;
        display: flex;
    }
    .kiliride-flex-horizontal .flex-horizontal .upper-horizontal{
        flex-direction: column-reverse;
        justify-content: center;
        align-items: center;
        height: 700px;
        width: 90%;
        margin: 0;
    }
    .kiliride-flex-horizontal{
        margin: 150px 0;
        height: 1500px;
    }
    .retaurant-top-frame{
        height: 700px;
    }
    .retaurant-top-frame .restaurant-frame-holder{
        width: 100%;
        height: 600px;
        flex-direction: column-reverse;
        justify-content: center;
        align-items: center;
    }
    .retaurant-top-frame .restaurant-frame-holder .restautant-frame img{
        width: 100%;
        height: 300px;
        object-fit: cover;
    }
    .retaurant-top-frame .restaurant-frame-holder .restautant-frame h1{
        font-size: 40px;
        line-height: 50px;
    }
    .retaurant-top-frame .restaurant-frame-holder .restautant-frame p{
        text-align: center;
    }
    .retaurant-top-frame .restaurant-frame-holder .restautant-frame h1 span{
        font-size: 40px;
        line-height: 50px;
    }
    .retaurant-top-frame .restaurant-frame-holder .restautant-frame{
        width: 90%;
        justify-content: center;
        align-items: center;
        margin: 20px 0;
    }
}
 @media(min-width: 581px) and (max-width: 1050px){
    .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row .main-part 
    .part-flex{
        margin: 25px 0;
    }
    .kiliride-food-tablet .kiliride-tablet-flexx{
        width: 90%;
        flex-direction: column;
     }
     .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row{
        width: 100%;
        margin: 20px 0;
     }
     .kiliride-food-tablet .kiliride-tablet-flexx .flex-sides-row img{
        width: 100%;
     }
 }
/* kiliride restaurant and store */








.social-impact{
    width: 100%;
    height: auto;
    padding: 20px 0;
    margin-top: 0;
    background: #f8f8f8;
    margin-bottom: 20px;
}
.social-impact .impact{
    display: flex;
    padding: 10px;
    justify-content: center;
    text-align: center;
    align-items: center;
}
.social-impact .impact .impacts{
    width: 80%;
    height: auto;
    display: block;
    margin-right: 10px;
    border-radius: 20px;
    text-align: center;
    align-items: center;
    justify-content: center;
}
 


.social-impact .impact .impacts img{
    width: 100%;
    height: 100%;
    border-radius: 20px;
    pointer-events: none;
}

 
.social-impact .impact .impacts .socilizing{
   display: flex;
   text-align: center;
   flex-direction: column;
    padding: 30px 0;
    width: 100%;
}
.social-impact .impact .impacts .socilizing ul{
    display: block;
    list-style-type: disc;
    text-align: start;
}
.social-impact .impact .impacts .socilizing ul li{
     list-style-type: disc;
}
.social-impact .impact .impacts .socilizing h1{
    color: var(--black);
    font-size: 3rem;
    font-weight: 700;
    padding: 20px 0;
    text-align: center;
}
.social-impact .impact .impacts .socilizing p{
    font-size: 1rem;
    width: 100%;
    line-height: 28px;
    color: var(--black);
    text-align: center;
}
.creation-bts{
    width: 100%;
    display: block;
    align-items: center;
    justify-content: center;
    text-align: center;
    place-items: center;
    padding: 20px 0;
}
@media(min-width: 710px) and (max-width: 1080px){
    .creation-bts{
        height: 500px;
    }
}
.creation-bts h1{
    color: var(--black);
    font-weight: 800;
    font-size: 1.5rem;
}
.creation-bts .binary{
    display: flex;
    width: 100%;
    justify-content: center;
    text-align: center;
    place-items: center;
}
.creation-bts .creation{
    width: 25%;
    margin-right: 20px;
    display: block;
    height: 300px;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.creation-bts .creation a{
    background: #ED1C24;
    color: #fff;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 30px;
    font-weight: 700;
}
.creation-bts .creation h1{
    color: var(--black);
    font-weight: 700;
    padding: 20px 0;
    font-size: 1.2rem;
}
.creation-bts .creation p{
    line-height: 28px;
    font-size: 15px;
    margin-bottom: 30px;
}
.creation-bts .creation .icon--{
    width: 100%;
}
.creation-bts .creation .icon-- .holder{
    background: #ED1C24;
    width: 40px;
    height: 40px;
    justify-content: center;
    align-items: center;
    text-align: center;
    border-radius: 50%;
    margin-left: 45%;
    margin-top: 50px;
}
.creation-bts .creation .icon-- i{
    color: #fff;
    margin-top: 10px;
}
.enviroments-_{
    width: 100%;
    height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.enviroments-_ .roll{
    width: 40%;
    height: 400px;
    padding: 20px 0;
    margin-right: 10px;
    display: block;
}
.enviroments-_ .roll img{
    width: 100%;
    height: 100%;
    border-radius: 15px;
    object-fit: cover;
}
.enviroments-_ .roll .inner-enviroment{
    margin-top: 5%;
    padding: 0 20px;
    height: auto;
    text-align: start;
}
.enviroments-_ .roll .inner-enviroment h1{
    font-size: 1.5rem;
    color: var(--black);
    font-weight: 700;
    text-wrap: wrap;
}
.enviroments-_ .roll .inner-enviroment ul{
    text-align: start;
    width: 90%;
}
.enviroments-_ .roll .inner-enviroment ul li{
    text-align: start;
    list-style: inside;
    padding: 10px;
    font-size: 18px;
    width: 100%;
}
.enviroments-_ .roll .inner-enviroment .carrier{
    width: 100%;
    padding: 30px 0;
    align-items: start;
    text-align: start;
}
.enviroments-_ .roll .inner-enviroment a{
    background: #ED1C24;
    padding: 15px 20px;
    color: #fff;
    text-decoration: none;
    border-radius: 30px;
    font-weight: 700;
}
.closing-tag{
    width: 85%;
    margin-left: 8%;
    text-align: center;
    align-items: center;
    justify-content: center;
}
@media(max-width: 700px){
    .social-impact{
        height: auto;
        padding: 80px 0;
        width: 100%;
        margin-top: -20px;
        margin-bottom: 30px;
    }
    .social-impact .impact{
        flex-direction: column-reverse;
        padding: 0 10px;
    }
    .social-impact .impact .impacts .socilizing{
        margin-top: 10px;
    }
    .social-impact .impact .impacts .socilizing h1{
        font-size: 2rem;
        font-weight: 700;
        text-align: center;
        align-items: center;
        justify-content: center;
        padding: 0;
    }
    .social-impact .impact .impacts .socilizing p{
        text-align: center;
        align-items: center;
        justify-content: center;
        line-height: 30px;
    }
    .social-impact .impact .impacts{
        width: 100%;
        padding: 0;
        margin-top: -20px;
     }
     .social-impact .impact .impacts img{
        width: 90%;
        margin-left: 5%;
     }
   
     .enviroments-_ .roll .inner-enviroment ul{
        padding: 20px 0;
        width: 100%;
        text-align: center;
     }
     .enviroments-_ .roll .inner-enviroment ul li{
        text-decoration: none;
        list-style: inside;
        text-align: start;
        padding: 10px 0;
        font-size: 15px;
     }
     .creation-bts .creation .icon--{
        margin-left: 0 !important;
        width: 100%;
     }
     .creation-bts .binary{
        flex-direction: column;
     }
     .creation-bts{
        height: auto;
     }
     .creation-bts .creation{
        width: 90%;
        margin-left: 5%;
     }
     .enviroments-_{
        flex-direction: column;
        height: auto;
     }
     .enviroments-_ .roll{
        width: 100%;
        margin-right: 0;
     }
     .enviroments-_ .roll img{
        width: 96%;
        margin-left: 2%;
     }
     .log-box-001{
        height: 180px;
        position: relative;
        padding: 20px 0;
        background-position: none;
        width: 100%;
     }
     .social-impact .impact .impacts .socilizing h1{
        padding: 10px;
     }
     
     .enviroments-_ .roll .inner-enviroment .carrier{
        align-items: center;
        text-align: center;
        margin-top: 20px;
     }
}




/*new blog design*/
.kiliride-blog-upper{
    width: 100%;
    margin: 120px 0;
    overflow: hidden;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-blog-upper .kiliride-upper{
    width: 80%;
    height: auto;
}
.kiliride-blog-upper .kiliride-upper h1{
    text-align: center;
    font-size: 3em;
    font-family: 'gilroy-bold';
    color: var(--black);
    margin-bottom: 50px;
}

.kiliride-blog-upper .kiliride-upper .upper-image{
    width: 100%;
    margin-bottom: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-blog-upper .kiliride-upper .upper-image img{
    width: 100%;
    height: 400px;
    object-fit: cover;
}
.kiliride-title-diplay{
    height: auto;
    width: 50%;
    padding: 10px 0;
}

.kiliride-title-diplay span{
    text-align: start;
    color: var(--color);
}
.kiliride-title-diplay h1{
    text-align: left !important;
    justify-content: start;
    align-items: start;
    font-size: 2em;
    line-height: 50px;
    padding: 10px 0;
    margin-bottom: 10px !important;
}
.kiliride-title-diplay p{
    line-height: 28px;
}
.kiliride-blog-middle{
    width: 100%;
    overflow: hidden;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: -80px 0;
}
.kiliride-middle{
    width: 60%;
    height: auto;
    text-align: start;
}

.kiliride-middle h1{
    text-align: left !important;
    font-size: 2em;
    line-height: 50px;
    padding: 20px 0;
    font-family: 'gilroy-bold';
}
.kiliride-middle p{
    line-height: 28px;
    margin-bottom: 20px;
}
.kiliride-middle h3{
    border-left: 1px solid purple;
    padding: 0 10px;
    margin: 20px 0;
    font-style: italic;
    letter-spacing: 2px;
    line-height: 30px;
    font-family: 'gilroy-bold';
}
.kiliride-middle img{
    height: 400px;
    width: 100%;
    object-fit: cover;
    margin: 10px 0;
    border-radius: 12px;
}
.kiliride-middle .conclusion{
    background-color: #f4f4f4;
    width: calc(100% - 20px);
    padding: 10px;
}
.kiliride-middle .conclusion h1{
    text-align: left !important;
    font-size: 2em;
    line-height: 50px;
    padding: 20px 0;
    font-family: 'gilroy-bold';
}
.kiliride-middle .conclusion p{
    line-height: 28px;
    margin-bottom: 20px;
}
.kiliride-blogger-flex{
    width: 100%;
    margin: 100px 0;
    padding: 10px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-blogger-flex .blogger-information{
    display: flex;
    width: 60%;
    padding: 10px 5px;
    height: 50px;
    justify-content: start;
    border-top: 2px solid #f4f4f4;
}
.kiliride-blogger-flex .blogger-information .profile{
    width: 50px;
    height: 50px;
}
.kiliride-blogger-flex .blogger-information .profile img{
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 50%;
}
.kiliride-blogger-flex .blogger-information .details{
    display: flex;
    flex-direction: column;
    align-items: start;
    padding: 0 10px;
    justify-content: start;
}
.kiliride-blogger-flex .blogger-information .details h1{
    font-family: 'gilroy-bold';
    font-size: 1em;
}
.kiliride-blogger-flex .blogger-information .details h2{
    font-size: 1em;
}
.blog-post-showcase{
    width: 100%;
    display: flex;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}
.blog-post-showcase .flex-post-viewer{
    width: 80%;
    max-width: 1200px;
    height: auto;
}
@media(max-width: 700px){
    .kiliride-blog-upper .kiliride-upper{
        width: 90%;
    }
    .kiliride-blog-upper .kiliride-upper h1{
        font-size: 2em;
    }
    .kiliride-blog-upper .kiliride-upper .upper-image img{
        height: 300px;
        width: 100%;
    }
    .kiliride-title-diplay{
        width: 100%;
    }
    .kiliride-middle{
        width: 90%;
    }
    .kiliride-blogger-flex .blogger-information{
        width: 90%;
    }
    .blog-post-showcase{
        flex-direction: column;
    }
    .blog-post-showcase .flex-post-viewer{
        width: 90%;
    }
    .kiliride-middle img{
        height: 300px;
    }
}
.blog-post-showcase .flex-post-viewer span{
    color: var(--color);
    font-size: 1em;
}

.blog-post-showcase .flex-post-viewer .flex-upper-information{
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
}
.blog-post-showcase .flex-post-viewer .flex-upper-information .posts-head-up{
    display: block;
    width: 70%
}
.blog-post-showcase .flex-post-viewer .flex-upper-information .posts-head-up h1{
    font-family: 'gilroy-bold';
    font-size: 2em;
    padding: 10px 0;
}
@media(max-width: 700px){
    /*.blog-post-showcase .flex-post-viewer span{*/
    /*    display: none;*/
    /*}*/
    .blog-post-showcase .flex-post-viewer .flex-upper-information .posts-head-up{
        width: 100%;
    }
    .blog-post-showcase .flex-post-viewer .flex-upper-information .link-tag-flex{
        display: none;
    }
    .blog-post-showcase .flex-post-viewer .flex-upper-information{
        justify-content: start;
    }
}
.blog-post-showcase .flex-post-viewer .flex-upper-information .posts-head-up p{
    line-height: 28px;
    font-size: 1em;
}
.blog-post-showcase .flex-post-viewer .post-items{
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
}

.post-box-row{
    width: 30%;
    height: 450px;
    display: block;
}

.post-box-row .post-image{
    width: 100%;
    height: auto;
    position: relative;
}
.post-box-row .post-image .mobile-theme{
    display: none;
}
.post-box-row .post-image img{
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 12px;
}
@media(max-width: 900px){
    .post-box-row .post-image img{
        height: 250px;
    }
    .blog-post-showcase .flex-post-viewer .post-items{
        flex-direction: column;
    }
    .post-box-row{
        width: 100%;
        height: auto;
        margin-bottom: 10px;
    }
    
    .post-box-row .post-image .mobile-theme{
        position: absolute;
        bottom: 0;
        height: 80px;
        width: 100%;
        background: rgba(255, 255, 255, 0.2);
        backdrop-filter: blur(24px);
        -webkit-backdrop-filter: blur(24px);
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        display: flex;
        justify-content: space-around;
        align-items: center;
    }
    .post-box-row .post-image .mobile-theme .mobile-views{
        display: block;
        width: 40%;
    }
    .post-box-row .post-image .mobile-theme .mobile-views:last-child{
        text-align: right;
    }
    .post-box-row .post-image .mobile-theme .mobile-views h1{
        font-size: 1em;
        color: #fff;
    }
    .post-box-row .post-image .mobile-theme .mobile-views h2{
        font-size: 1em;
        color: #fff;
    }
}
.post-box-row span{
    padding: 20px 0;
    color: var(--color);
    font-family: 'gilroy-bold';
}
.post-box-row .title-up{
    display: flex;
    justify-content: space-between;
}
.post-box-row .mobile-read{
    display: none;
}
.post-box-row .title-up .title-flex-up{
    width: 90%;
    height: auto;
}

.post-box-row .title-up .title-flex-up h1{
    font-family: 'gilroy-bold';
    font-size: 20px;
    line-height: 25px;
    letter-spacing: 0;
}
.post-box-row .title-up .title-flex-up a{
    text-decoration: none;
    font-family: 'gilroy-bold';
    color: var(--black);
    font-size: 20px;
    line-height: 25px;
    cursor: pointer;
    color:  #181D27;
    letter-spacing: 0;
}
.post-box-row .title-up .title-flex-up p{
    padding: 10px 0;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0;
}
.post-box-row .personel-infomation{
    width: 100%;
    height: 50px;
    padding: 10px 0;
    display: flex;
}
@media(max-width: 700px){
    .post-box-row .title-up{
        margin: 15px 0;
    }
   
    .post-box-row .personel-infomation{
        display: none;
    }
   .post-box-row .mobile-read{
        display: flex;
        padding: 10px 0;
        display: flex;
        text-wrap: nowrap;
    }
    .post-box-row .mobile-read a img{
        width: 20px;
        height: 20px;
        transform: translateY(5px);
    }
    .post-box-row .mobile-read a{
        text-decoration: none;
        color: var(--color);
        text-wrap: nowrap;
    }
}
.post-box-row .personel-infomation .personel-image{
    width: 50px;
    height: 50px;
}
.post-box-row .personel-infomation .personel-image img{
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 50%;
}
.post-box-row .personel-infomation .personel-details{
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 10px;
}
.post-box-row .personel-infomation .personel-details h1{
    font-weight: 600;
    font-size: 1em;
}
.post-box-row .personel-infomation .personel-details h2{
    font-size: 1em;
}

.subscriber-flex{
    width: 100%;
    margin: 40px 0;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}
.subscriber-flex .kiliride-subcribers{
    width: 80%;
    justify-content: space-around;
    display: flex;
    align-items: center;
    height: 200px;
    background-color: #f4f4f4;
    border-radius: 12px;
}

.subscriber-flex .kiliride-subcribers .sub-sides{
    width: 40%;
    display: flex;
    flex-direction: column;
}
.subscriber-flex .kiliride-subcribers .sub-sides a{
    color: #000;
}
.subscriber-flex .kiliride-subcribers .sub-sides h1{
    font-size: 2em;
    font-family: 'gilroy-bold';
    padding: 10px 0;
}
.subscriber-flex .kiliride-subcribers .sub-sides p{
    font-size: 1em;
}
.subscriber-flex .kiliride-subcribers .sub-sides:last-child p{
    padding: 0 5px;
}
.subscriber-flex .kiliride-subcribers .sub-sides .flex-input{
    width: 100%;
    display: flex;
}
.flex-input .inputs{
    display: flex;
    margin-bottom: 10px;
}
.flex-input .inputs .email{
    width: 20em;
    padding: 10px;
    border: 1px solid #cacaca;
    border-radius: 5px;
    margin: 0 5px;
    outline-color: var(--color);
}
@media(min-width: 710px) and (max-width: 1040px){
    .subscriber-flex .kiliride-subcribers{
        flex-direction: column;
        justify-content: center;
        align-items: center;
        height: auto;
        width: 100%;
    }
    .subscriber-flex .kiliride-subcribers .sub-sides{
        width: 50%;
        margin: 20px 0;
    }
    .flex-input .form .inputs .email{
        width: 15em;
    }
}
@media(max-width: 700px){
    .subscriber-flex .kiliride-subcribers{
        width: 90%;
        height: auto;
        flex-direction: column;
        justify-content: center;
    }
    .subscriber-flex .kiliride-subcribers .sub-sides{
        width: 100%;
        height: 150px;
        margin: 5px 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .subscriber-flex .kiliride-subcribers .sub-sides h1{
        font-size: 1.5em;
    }
    .subscriber-flex .kiliride-subcribers .sub-sides p{
        text-align: center;
    }
    .subscriber-flex .kiliride-subcribers .sub-sides .flex-input{
        justify-content: center;
        align-items: center;
    }
    .subscriber-flex .kiliride-subcribers .sub-sides .flex-input .inputs{
        width: 100%;
    }
    .flex-input .form .inputs{
        flex-direction: column;
    }
    .flex-input .inputs .email{
        width: 22em;
    }
    .flex-input .inputs .submit{
        width: 100%;
        margin: 10px 0;
    }
}
.flex-input .inputs .submit{
    border: 1px solid #cacaca;
    border-radius: 5px;
    background-color: var(--color);
    color: #fff;
    padding: 0 10px;
    font-family: 'gilroy-bold';
    height: 40px;
}

/*ends*/



















.kili-blog{
    width: 100%;
    align-items: center;
    text-align: center;
    display: flex
    place-items: center;  
    margin-top: 150px;
}
.kili-blog .blog{
    width: 80%;
    height: auto;
    margin-bottom: 20px;
}

@media (max-width: 700px){

    .kili-blog .blog{
        width: 100%;
        margin-left: 0;
        padding: 20px 0;
    }
    .kili-blog .blog h4{
        padding: 20px 0;
    }
}
.kili-blog .blog .pis-center{
    align-items: center;
    text-align: center;
    place-items: center;  
    width: 100%;
}
.kili-blog .blog .pis-center p{
    align-items: center;
    text-align: center;
    place-items: center;  
    font-size: 1.5rem;
    text-wrap: balance;
    font-weight: 100 !important;
}
.kili-blog .blog h1{
    font-size: 2.5rem;
    color: var(--black);
    font-weight: 700;
}
.kili-blog .blog h1 span{
    color: #ED1C24;
}
.kili-blog .blog .paragraphs{
    width: 70%;
    margin-left: 15%;
    height: auto;
    margin-bottom: 10px;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.kili-blog .blog .paragraphs a{
    text-decoration: none;
    color: #ED1C24;
}

.kili-blog .blog .paragraphs  h2{
    font-size: 1.3rem;
    font-weight: 500;
    text-transform: capitalize;
    margin-bottom: 10px;
    text-align: start;
    padding: 0 20px;
}
.kili-blog .blog .paragraphs p{
    padding: 10px 20px;
    line-height: 30px;
}
.kili-blog .blog .testimonials{
    width: 80%;
    margin-left: 10%;
    display: flex;
    margin-top: 40px;
}
.kili-blog .blog .testimonials .testifier{
    width: 80px;
    height: 80px;
    overflow: hidden;
}
.kili-blog .blog .testimonials .testifier img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}
.kili-blog .blog .testimonials .testimonie{
    width: 80%;
    padding: 20px 20px;
    height: 40px;
 }
/*working on donate page*/
.kili-blog .blog .donate-title{
    background-color: #f8f8f8;
    width: 100%;
    height: auto;
    padding: 100px 0;
    align-content: center;
    text-align: center;
    margin-bottom: 50px;
    justify-content: center;
}
.kili-blog .blog .donate-title p{
    font-size: 1.2rem;
    color: var(--black);
    align-content: center;
    text-align: center;
    justify-content: center;
    font-weight: 700;
    line-height: 28px;
    width: 80%;
    margin-left: 10%;
    text-wrap: balance;
}
.kili-blog .blog .donate-title p sup{
    font-size: 40px;
    letter-spacing: 5px;
  
    justify-content: center;
    align-items: center;
    text-align: center;
    transform: translateY(50%);
    color: #ED1C24;
}
.kili-blog .blog .campaigns{
    display: block;
    width: 100%;
    height: auto;
}
.kili-blog .blog .campaigns h1{
    font-size: 2rem;
    color: var(--black);
    margin-bottom: 20px;
}
.kili-blog .blog .campaigns .current-campaign{
    width: 100%;
    height: auto;
    margin-top: 20px;
}
.kili-blog .blog .campaigns .current-campaign h2{
    color: var(--black);
    font-size: 3rem;
    font-weight: 800;
    margin-bottom: 20px;
}
.kili-blog .blog .campaigns .current-campaign .camp-{
    width: 100%;
    overflow: hidden;
    border-radius: 30px;
}
.kili-blog .blog .campaigns .current-campaign .camp- img{
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 30px;
    margin-bottom: 10px;
}
.kili-blog .blog .campaigns .current-campaign .camp- 
.camp-description{
    padding: 10px 0;
}
.kili-blog .blog .campaigns .current-campaign .camp- 
.camp-description h3{
    padding: 10px 0;
    color: var(--black);
    font-size: 2rem;
    font-weight: 800;
}
.kili-blog .blog .campaigns .current-campaign .camp- 
.camp-description button{
    border: none;
    background: none;
    color: #ED1C24;
    font-size: 15px;
}
.kili-blog .blog .campaigns .current-campaign 
.camp- .camp-description p{
    line-height: 28px;
    color: var(--black);
    font-size: 1rem;
    width: 100%;
    text-wrap: balance;
}
.kili-blog .blog .campaigns .current-campaign 
.camp- .camp-description a{
    text-decoration: none;
    color: #ED1C24;
}
.kili-blog .blog .campaigns p{
    font-size: 1rem;
    color: var(--black);
    align-content: center;
    text-align: center;
    justify-content: center;
    line-height: 28px;
}
@media (max-width: 700px) {
    .kili-blog .blog .donate-title p{
        text-align: start;
        text-wrap: balance;
    }
    .kili-blog .blog .campaigns p{
        text-align: center;
        text-wrap: balance;
        padding: 0 20px;
    }
    .kili-blog .blog .testimonials{
        flex-direction: column;
    }
    .kili-blog .blog .testimonials .testifier{
        justify-content: center;
        align-items: center;
        text-align: center;
        width: 100%;
        margin-bottom: 40px;
    }
    .kili-blog .blog .testimonials .testifier img{
        width: 80px;
        height: 80px;
    }
    .kili-blog .blog .paragraphs{
        width: 95%;
        margin-left: 0;
        padding: 0 5px;
    }
    .kili-blog .blog .testimonials .testimonie{
        width: 95%;
        padding: 0 5px;
    }
}
/*working on circular bar*/
.kili-blog .blog .campaigns .current-campaign 
.camp- .logic-gate-b1{
    display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
    width: 100%;
    margin-bottom: 20px;
}
.kili-blog .blog .campaigns .current-campaign 
.camp- .container{
    position: relative;
    display: flex;
    gap: 30px;
    justify-content: center;
    align-items: center;
}
.kili-blog .blog .campaigns .current-campaign 
.camp- .container .box{
    position: relative;
    padding: 40px 0;
    width: 350px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.kili-blog .blog .campaigns .current-campaign h2{
    font-weight: 700;
}
.kili-blog .blog .campaigns .current-campaign 
.camp- .container .box h2{
    color: var(--black);
    position: relative;
    font-size: 3rem;
    margin-top: 30px;
    font-weight: 700;
}
.kili-blog .blog .campaigns .current-campaign 
.camp- .container .box a{
    text-decoration: none;
    color: #fff;
    font-weight: 700;
    background: #ED1C24;
    padding: 8px 25px;
    border-radius: 30px;
    margin-left: -20px;
}
.kili-blog .blog .campaigns .current-campaign 
.camp- .container .box h3{
    padding: 2px 0;
    font-size: 1rem;
    margin-bottom: 20px;
}
.kili-blog .blog .campaigns .current-campaign 
.camp- .container .box h2 small{
    font-size: 1.5rem;
}
.kili-blog .blog .campaigns .current-campaign 
.camp- .container .box .circle{
    position: relative;
    width: 250px;
    height: 250px;
    background: conic-gradient(from 0deg,var(--clr) 0%,var(--clr) 0% var(--i),#fff var(--i), #fff 100%);
    border-radius: 50%;
    justify-content: center;
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}
.kili-blog .blog .campaigns .current-campaign 
.camp- .container .box .circle::before{
    content: '';
    position: absolute;
    inset: 10px;
    background: #fff;
    border-radius: 50%;
}
/*working on donate page ends*/
/*working on running campany*/
 .running-campaign{
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
    background: #f8f8f8;
    height: auto;
    padding: 30px 0;
    margin-bottom: 30px;
}
.running-campaign .previous-campaign{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.running-campaign .previous-campaign .campaign{
    width: 30%;
    height: 420px;
    padding: 20px 0;
    margin-right: 10px;
    border: none;
    background: #fff;
    border-radius: 20px;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.running-campaign .previous-campaign .campaign .camp-details{
    width: 90%;
    height: 100%;
    display: block;
    margin-left: 5%;
    padding: 10px 0;
    text-align: start;
    align-items: start;
}
.running-campaign .previous-campaign .campaign .camp-details h2{
    font-size: 1.3rem;
    color: var(--black);
    font-weight: 700;
}
.running-campaign .previous-campaign .campaign .camp-details p{
    font-size: 1rem;
    line-height: 15px;
    color: var(--black);
    text-align: start;
    align-items: start;
    line-height: 20px;
    margin-bottom: 20px;
    font-weight: 300;
}
.running-campaign .previous-campaign .campaign .camp-details a{
    text-decoration: none;
    width: 100%;
}
.running-campaign .previous-campaign .campaign .camp-details .join{
    background: #fff;
    text-decoration: none;
    color: var(--black);
    padding: 12px 0;
    width: 100%;
    text-align: center;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    border: 1px solid #00000049;
    transition: ease-in .3s;
}
.running-campaign .previous-campaign .campaign .camp-details .join:hover{
    background: #ED1C24;
    color: #fff;
}

.previous-campaign .campaign .camp-details img{
    width: 100%;
    height: 250px !important;
    object-fit: cover;
}

/*working on running campainy ends*/
/*working on payments method start*/
.payments-method{
    display: block;
    height: auto;
    width: 100%;
}
.payments-method h1{
    font-size: 1rem;
}
.payments-method .amounts{
    display: block;
    text-align: center;
    justify-content: center;
    align-items: center;
    margin-left: 30%;
}
.payments-method .amounts input{
    padding: 10px 30px;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid #adabab;
    margin-bottom: 20px;
    border-radius: none;
    display: block;
    text-align: start;
    justify-content: center;
    align-items: start;
    outline-color: #ED1C24;
    width: 400px;
}
.payments-method .submit{
    text-align: center;
    justify-content: center;
    align-items: center;
    display: flex;
    width: 100%;
    margin-top: 10px;
}
.payments-method .submit input[type="submit"]{
    display: grid;
    background: #ED1C24;
    color: #fff;
    padding: 10px 40px;
    text-align: center;
    justify-content: center;
    align-items: center;
    border: none;
    border-radius: 20px;
}
.payments-method .payments{
    display: flex;
    width: 100%;
    height: auto;
    text-align: center;
    justify-content: center;
    align-items: center;
}
.payments-method .payments .method{
    width: 400px;
    height: 200px;
    margin-right: 20px;
    border-radius: unset;
}
.payments-method .payments .method img{
    width: 100px;
    height: 100px !important;
    border-radius: unset !important;
    object-fit: cover;
}
.payments-method .payments .method span{
    font-size: 1rem;
}

@media (max-width: 700px) {
    .running-campaign p{
        width: 100%;
        text-wrap: balance;
    }
    .running-campaign .previous-campaign{
        flex-direction: column;
    }
    .running-campaign .previous-campaign .campaign{
        width: 100%;
        margin-top: 30px;
    }
    .payments-method .amounts{
        display: block;
        margin-left: 0;
    }
    .payments-method .amounts input{
        width: 80%;
        margin-bottom: 10px;
        padding: 10px 0;
        margin-right: 0;
        
    }
}
/*working on payments campainy ends*/

/* working on support page*/
.search-holder{
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-image: url(images/flex/phone.png);
    background-position: center;
    background-size: cover;
    height: 500px;
    margin-top: 100px;
}
.search-holder h1{
    color: #fff;
    font-size: 2rem;
    font-weight: 700;
    padding: 100px 0;
}
.search-holder h2{
    color: #fff;
    margin-top: -100px;
}
 .search-box .output::-webkit-scrollbar{
    display: none;
}
.search-box .output{
    width: 100%;
    max-height: 40vh;
    overflow: scroll;
    display: inline-block;
    align-items: center;
    text-align: center;
    justify-content: center;
}
.search-box .output .outputs{
    display: inline-block;
    width: 100%;
}
.search-box .output .output-row{
    height: auto;
    width: 400px;
    background-color: #f8f8f8;
    margin-top: 10px;
    display: inline-block;
    font-size: 15px;
   
}
.search-box .output .output-row p{
    font-size: 15px;
    max-height: 35opx;
}

.search-holder .search-box{
    width: 100%;
    text-align: center;
    justify-content: center;
    align-items: center;
    height: auto;
    display: block;
    margin-top: 30px;
    margin-bottom: 20px;
}
 .search-box .searching i{
    padding: 15px 20px;
}
 .search-holder .search-box .searching{
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    margin-left: 35%;
    width: 30%;
    height: 50px;
    border-radius: 30px;
    background-color: #f8f8f8;
    color: var(--black);
    font-size: 1rem; 
}
.search-box .searching .supporting{
    font-weight: 700;
    height: 40px;
}
 .search-box .searching input{
    border: none;
    width: 100%;
    padding: 10px 20px;
    background-color: #f8f8f8;

    border-radius: 30px;
    outline: none;
}
.kili-blog .blog .support{
    width: 100%;
    height: auto;
}
.kili-blog .blog .support .buttons{
    display: flex;
    width: 100%;
    height: auto;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
    text-align: center;
    
}
.kili-blog .blog .support .buttons .actives{
    color: #ED1C24;
}
.kili-blog .blog .support .buttons ul{
    display: flex;
    text-decoration: none;
}
.kili-blog .blog .support .buttons ul li{
    list-style: none;
    padding: 10px 20px;
    font-size: 1.5rem;
}
.kili-blog .blog .support .buttons ul li a{
    text-decoration: none;
    color: var(--black);
    font-weight: 800;
}
.kili-blog .blog .support .co-worker{
    width: 100%;
    height: 400px;
}
.kili-blog .blog .support .co-worker img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
}
.kili-blog .blog .support h2{
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 30px;
}

/* working on support page ends*/
/* working on privacy and policy*/
.pdf-holder{
    width: 100%;
    height: 200px;
    align-items: center;
    justify-content: center;
    display: flex;
}
.download-pdf{
    display: flex;
    border: none;
    color: #fff;
    background: #ED1C24;
    padding: 16px 25px;
    align-items: center;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
}
.download-pdf i{
    font-size: 1.5rem;
}
.download-pdf:hover{
    background: #ed1c23da;
}
.download-pdf .text{
    font-size: 1.6;
    padding: 0 0 0 10px;
}

.kili-blog .blog .privacy{
    width: 100%;
}
.kili-blog .blog .privacy p{
    font-size: 1rem;
    line-height: 28px;
    text-align: justify;
}
.kili-blog .blog .privacy p a{
    text-decoration: none;
    color: #ED1C24;
}
.kili-blog .blog .policy{
    width: 100%;
    display: block;
    margin-top: 20px;
    text-align: start;
}
.kili-blog .blog .policy h5{
    font-size: 2rem;
    color: var(--black);
    font-weight: 700;
    margin-bottom: 10px;
}
.kili-blog .blog .policy .head-bold{
    font-weight: 700;
}
.kili-blog .blog .policy p{
    line-height: 28px;
    font-weight: none;
    margin-bottom: 20px;
}
.kili-blog .blog .policy p a{
    text-decoration: none;
    color: #ED1C24;
}
.kili-blog .blog .policy p h2{
    font-size: 1rem;
    color: var(--black);
    padding: 20px 0;
}
.kili-blog .blog .policy ul{
    display: block;
    font-weight: 100;
    padding: 0 20px;
}
.kili-blog .blog .policy ul li{
    list-style: disc;
    text-align: justify;
    font-size: 1rem;
    padding: 10px 0;
    line-height: 28px;
}
/* working on privacy and policy ends*/




/* working on fleet-owner*/
.Kiliridde-fleet-owner{
    width: 100%;
    height: 700px;
    background-color: #08031A;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.Kiliridde-fleet-owner .fleet-owner-hol-row{
    position: absolute;
    bottom: 120px;
    width: 80%;
    max-width: 1200px;
    display: flex;
    height: 400px;
}

.Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec{
    width: 50%;
    display: flex;
    align-items: center;
    flex-direction: column;
}
.Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec img{
    width: 90%;
    object-fit: cover;
    height: 400px;
    border-radius: 30px;
}
.Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec .fleet-head{
    width: 100%;
}
.Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec h1{
    color: #fff;
    font-size: 60px;
    line-height: 65px;
    text-align: left;
    margin: 20px 0;
    font-family: 'gilroy-bold';
}
.Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec h1 span{
    font-size: 60px;
    line-height: 68px;
    text-align: left;
    color: var(--color);
    font-family: 'gilroy-bold';
}
.Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec p{
    color: #959292;
    font-size: 20px;
    line-height: 24px;
}
@media(min-width: 1000px) and (max-width: 1190px){
    .Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec h1{
        font-size: 50px;
        line-height: 58px;
    }
    .Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec h1 span{
        font-size: 50px;
        line-height: 58px;
    }
}
@media(min-width: 951px) and (max-width: 999px){
    .Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec h1{
        font-size: 45px;
        line-height: 48px;
    }
    .Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec h1 span{
        font-size: 45px;
        line-height: 48px;
    }
}

.fleet-owner-form{
    width: 100%;
    height: auto;
    padding: 20px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 380px;
}
.fleet-owner-form .owner-form-holder{
    width: 80%;
    max-width: 1200px;
    height: 380px;
    justify-content: right;
    display: flex;
    position: relative;
}
.fleet-owner-form .owner-form-holder .form-right{
    width: 50%;
    height: auto;
    position: absolute;
    top: -200px;
    display: flex;
}
.fleet-owner-form .owner-form-holder .form-right .form{
    padding: 30px;
    background-color: #fff;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
    width: calc(70% - 30px);
    height: auto;
    border-radius: 20px;
}
@media(min-width: 581px) and (max-width: 950px){
    .fleet-owner-form{
        height: 500px;
    }
    .fleet-owner-form .owner-form-holder{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 90%;
        height: 400px;
    }
    .fleet-owner-form .owner-form-holder .form-right{
        width: 80%;
        top: -130px;
        left: 0%;
        transform: translateX(25%);
    }
    .Kiliridde-fleet-owner{
        height: 1000px;
    }
    .Kiliridde-fleet-owner .fleet-owner-hol-row{
        width: 90%;
        flex-direction: column-reverse;
        height: 800px;
    }
    .Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec{
        width: 100%;
        justify-content: center;
        margin: 10px 0;
    }
    .Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec .fleet-head{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
    .Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec h1{
        text-align: center;
    }
    .Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec p{
        text-align: center;
    }
}
@media(max-width: 580px){
    .fleet-owner-form{
        height: 500px;
    }
    .fleet-owner-form .owner-form-holder{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 90%;
        height: 400px;
    }
    .fleet-owner-form .owner-form-holder .form-right .form{
        width: 100%;
    }
    .fleet-owner-form .owner-form-holder .form-right{
        width: 100%;
        top: -130px;
      
    }
    .Kiliridde-fleet-owner{
        height: 800px;
    }
    .Kiliridde-fleet-owner .fleet-owner-hol-row{
        width: 90%;
        flex-direction: column-reverse;
        height: 900px;
    }
    .Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec{
        width: 100%;
        justify-content: center;
        margin: 10px 0;
    }
    .Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec .fleet-head{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
    .Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec h1{
        text-align: center;
        font-size: 30px;
        line-height: 38px;
    }
    .Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec h1 span{
        font-size: 30px;
        line-height: 38px;
    }
    .Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec p{
        text-align: center;
    }
    .Kiliridde-fleet-owner .fleet-owner-hol-row .fleet-dec img{
        height: 300px;
    }
}
.fleet-owner-form .owner-form-holder .form-right .form .data-holder{
    display: block;
}
.fleet-owner-form .owner-form-holder .form-right .form .data-holder h1{
    margin: 10px 0;
    font-weight: 600;
    color: #1A0244;
    font-size: 30px;
    line-height: 38px; 
}
.fleet-owner-form .owner-form-holder .form-right .form .data-holder p{
    color: #524977;
    font-size: 20px;
    line-height: 24px;
}
.fleet-owner-form .owner-form-holder .form-right .form 
.data-holder .input-data{
    display: block;
    width: 100%;
    margin: 10px 0;
}
.fleet-owner-form .owner-form-holder .form-right .form 
.data-holder .input-data label{
    display: block;
    font-size: 18px;
    line-height: 24px;
    color: #1A0244;
    font-weight: 600;
    margin: 5px 0;
}
.fleet-owner-form .owner-form-holder .form-right .form 
.data-holder .input-data .input{
    width: calc(100% - 20px);
    padding: 12px 10px;
    background-color: #EDEAF1;
    border-radius: 8px;
    border: none;
    outline: none;
}
.fleet-owner-form .owner-form-holder .form-right .form 
.data-holder .input-data .halfs{
    display: flex;
    width: 100%;
}
.fleet-owner-form .owner-form-holder .form-right .form 
.data-holder .input-data .halfs .left{
    width: 60px;
    background-color: #EDEAF1;
    border-radius: 8px;
    padding: 12px 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.fleet-owner-form .owner-form-holder .form-right .form 
.data-holder .input-data .halfs .left img{
    width: 20px;
    height: 20px;
    border-radius: 50%;
}
.fleet-owner-form .owner-form-holder .form-right .form 
.data-holder .input-data .halfs .left span{
    color: #1A0244;
    font-weight: 600;
    margin: 0 5px;
}
.fleet-owner-form .owner-form-holder .form-right .form 
.data-holder .input-data .halfs .mobile{
    margin: 0 5px;
    width: calc(100% - 20px);
    padding: 12px 10px;
    background-color: #EDEAF1;
    border-radius: 8px;
    border: none;
    outline: none;
}
.fleet-owner-form .owner-form-holder .form-right .form 
.data-holder .input-data select{
    width: calc(100% - 0px);
    padding: 12px 10px;
    background-color: #EDEAF1;
    border-radius: 8px;
    border: none;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.fleet-owner-form .owner-form-holder .form-right .form 
.data-holder .input-data .submit{
    width: 100%;
    border-radius: 30px;
    background-color: #EDEAF1;
    text-align: center;
    border: none;
    outline: none;
    padding: 12px 0;
    font-size: 20px;
    color: #837C9F;
    font-weight: 600;
}
.fleet-owner-form .owner-form-holder .form-right .form 
.data-holder .error{
    background-color: var(--color);
    color: #fff;
    width: 100%;
    padding: 12px 0;
    text-align: center;
    display: none;
}
.headflex{
    width: 100%;
    display: flex;
    padding: 10px 0;
    justify-content: center;
    align-items: center;
}
.headflex .in{
    width: 80%;
    max-width: 1200px;
    display: flex;
}
.headflex .in h1{
    color: #372D5E;
    font-size: 50px;
    font-family: 'gilroy-bold';
}
@media(max-width: 580px){
    .headflex .in h1{
        font-size: 25px;
    }
}

.interactive-switch-holder-fleet{
    width: 100%;
    padding: 30px 0;
    Background-color: var(--kili-box);
    Color: #fff;
    Text-align: center;
    Margin: 0;
    Display: flex;
    Justify-content: center;
    Align-items: center;
    flex-direction: column;
    Height: auto;
}
.interactive-switch-holder-fleet h1{
    font-size: 35px;
    line-height: 45px;
    font-family: 'gilroy-bold';
    letter-spacing: 0;
    margin: 20px 0;
}
.interactive-switch-holder-fleet h1 span{
    color: var(--color);
    font-family: 'gilroy-bold';
}
.interactive-switch-holder-fleet .container{
    Display: flex;
    Width: 80%;
    height: auto;
    Max-width: 1200px;
    flex-direction: row-reverse;
}

.interactive-switch-holder-fleet .left-panel {
    Width: 50%;
    Display: flex;
    height: auto;
    justify-content: center;
    Flex-direction: column;
}

.interactive-switch-holder-fleet .left-panel h2{
    font-size: 15px;
    line-height: 30px;
    letter-spacing: 0;
    color: #fff;
    text-align: left;
    width: 80%;
}

.interactive-switch-holder-fleet .switch {
    Border: 2px solid #1B172D;
    border-radius: 10px;
    Text-align: left;
    Color: #aaa;
    Font-size: 18px;
    width: calc(100% - 20px);
    padding: 10px 20px;
    Cursor: pointer;
    Transition: 0.3s;
    margin: 10px 0;
    background-color: transparent;
    display: flex;
    justify-content: space-between;
    align-items: center;
    
}
.interactive-switch-holder-fleet .switch .button-side{
    width: 80%;
    display: block;
}
.interactive-switch-holder-fleet .switch .button-side h1{
    font-size: 15px;
    line-height: 24px;
    color: #fff;
    margin: 10px 0;
}
.interactive-switch-holder-fleet .switch .button-side p{
    font-size: 14px !important;
    line-height: 18px;
    color: #fff;
}
.interactive-switch-holder-fleet .switch .button-side-icon{
    height: 60px;
    width: 60px;
    border-radius: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #1B172D
}
.interactive-switch-holder-fleet .switch .button-side-icon i{
    color: #fff;
}
@media(min-width: 901px) and (max-width: 1310px){
        .interactive-switch-holder-fleet .container{
        width: 90%;
        height: auto;
    }
    .interactive-switch-holder-fleet .left-panel {
        height: auto;
    }
}
@media(min-width: 581px) and (max-width: 900px){
    .interactive-switch-holder-fleet .nav-item .button-side-icon{
        height: 40px;
        width: 40px;
        border-radius: 8px;
    }
    .interactive-switch-holder-fleet .container{
        width: 90%;
        height: auto;
        flex-direction: column;
    }
    .interactive-switch-holder-fleet .left-panel {
        height: auto;
    }
}
.interactive-switch-holder-fleet .switch:hover, .switch.active {
    Font-weight: bold;
    background-color: #1B172D !important;
}
.interactive-switch-holder-fleet .switch:hover, .switch.active .button-side-icon{
    background-color: var(--color);
}
.interactive-switch-holder-fleet .switch:hover .button-side-icon{
    background-color: var(--color);
}

.interactive-switch-holder-fleet .right-panel {
    Width: 50%;
    Position: relative;
}

.interactive-switch-holder-fleet .content {
    Display: none;
    Opacity: 0;
    Transition: opacity 1s ease-in-out;
    Position: absolute;
    Width: 100%;
    Top: 0;
}

.interactive-switch-holder-fleet .content.active {
    Display: block;
    Opacity: 1;
}

.interactive-switch-holder-fleet .nav-arrow {
    Position: absolute;
    Top: 50%;
    Transform: translateY(-50%);
    Background: rgba(255, 255, 255, 0.2);
    Border: none;
    Color: white;
    Padding: 10px 15px;
    Cursor: pointer;
    display: none;

}

.interactive-switch-holder-fleet .left-arrow { left: 40px; }
.interactive-switch-holder-fleet .right-arrow { right: 40px; }

.interactive-switch-holder-fleet .indicators {
    Position: absolute;
    Bottom: 10px;
    Left: 50%;
    Transform: translateX(-50%);
    display: none;
}
.interactive-switch-holder-fleet .dot {
    Height: 10px;
    Width: 10px;
    Margin: 0 5px;
    Background-color: #aaa;
    Border-radius: 50%;
    Display: inline-block;
    Cursor: pointer;
}
.interactive-switch-holder-fleet .dot.active {
    color: #6316DB;
    Background-color: var(--color);
    width: 25px;
    border-radius: 20px;
}

@keyframes rotate {
    from { opacity: 0;}
    to { opacity: 1;}
}
.interactive-switch-holder-fleet .image-container{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 500px;
}
.interactive-switch-holder-fleet .image-container img{
    transition: transform 0.3s ease-in;
    object-fit: contain;
    height: 280px;
}
.interactive-switch-holder-fleet .image-container .length{
    height: 400px;
}
.interactive-switch-holder-fleet .rotate{
    animation: rotate 0.6s linear;
}
@media(min-width: 581px) and (max-width: 980px){
    .interactive-switch-holder-fleet .left-panel h2{
        width: 100%;
        text-align: center;
    }
    .interactive-switch-holder-fleet .image-container img{
        height: 200px;
    }
   
    .interactive-switch-holder-fleet .nav-item .button-side-icon{
        height: 40px;
        width: 40px;
        border-radius: 8px;
    }
    .interactive-switch-holder-fleet {
        padding: 50px 0;
    }
    .interactive-switch-holder-fleet .nav-arrow {
        display: flex;
        color: var(--color);
        bottom: -295px;
        top: unset;
        width: 50px;
        height: 50px;
        justify-content: center;
        align-items: center;
        font-size: 35px;
        background-color: transparent;
    }
.interactive-switch-holder-fleet .left-arrow { left: 170px; }
.interactive-switch-holder-fleet .right-arrow { right: 170px; }

    .interactive-switch-holder-fleet .indicators {
        display: flex;
        bottom: -250px;
    }
    .interactive-switch-holder-fleet .switch {
        display: none;
    }
    .interactive-switch-holder-fleet .switch.active {
        display: flex;
    }
    .interactive-switch-holder-fleet .container{
        width: 90%;
        height: auto;
        flex-direction: column-reverse;
    }
    .interactive-switch-holder-fleet .right-panel {
        width: 100%;
        height: auto;
        margin-bottom: 20px;
    }
    .interactive-switch-holder-fleet .left-panel {
        width: 100%;
        height: auto;
        margin-bottom: 100px;
    }
    .interactive-switch-holder-fleet .content {
        position: unset;
    }
}
@media(max-width: 581px){
    .interactive-switch-holder-fleet .left-panel h2{
        width: 100%;
        text-align: center;
        display: none;
    }
    .interactive-switch-holder-fleet .image-container img{
        height: 150px;
    }
   
    .interactive-switch-holder-fleet .nav-item .button-side-icon{
        height: 40px;
        width: 40px;
        border-radius: 8px;
    }
    .interactive-switch-holder-fleet {
        padding: 50px 0;
    }
    .interactive-switch-holder-fleet .nav-arrow {
        display: flex;
        color: var(--color);
        bottom: -255px;
        top: unset;
        width: 50px;
        height: 50px;
        justify-content: center;
        align-items: center;
        font-size: 35px;
        background-color: transparent;
    }
    .interactive-switch-holder-fleet .indicators {
        display: flex;
        bottom: -210px;
    }
    .interactive-switch-holder-fleet .switch {
        display: none;
    }
    .interactive-switch-holder-fleet .switch.active {
        display: flex;
    }
    .interactive-switch-holder-fleet .container{
        width: 90%;
        height: auto;
        flex-direction: column-reverse;
    }
    .interactive-switch-holder-fleet .right-panel {
        width: 100%;
        height: auto;
        margin-bottom: 20px;
    }
    .interactive-switch-holder-fleet .left-panel {
        width: 100%;
        height: auto;
        margin-bottom: 100px;
    }
    .interactive-switch-holder-fleet .content {
        position: unset;
    }
}

.kiliride-red-car-class{
    margin: 80px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}
.kiliride-red-car-class .car-class-holder{
    width: 80%;
    max-width: 1200px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-red-car-class .car-class-holder .init-car{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
}
.kiliride-red-car-class .car-class-holder .init-car .fx{
    width: 100%;
    display: block;
}
.kiliride-red-car-class .car-class-holder .init-car .fx a{
    background-color: var(--color);
    padding: 12px 16px;
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
}
.kiliride-red-car-class .car-class-holder .init-car img{
    height: 300px;
    object-fit: contain;
}
.kiliride-red-car-class .car-class-holder .init-car h1{
    font-size: 60px;
    line-height: 68px;
    font-family: 'gilroy-bold';
    margin-bottom: 30px;
}
.kiliride-red-car-class .car-class-holder .init-car h1 span{
    font-size: 60px;
    line-height: 68px;
    font-family: 'gilroy-bold';
    color: var(--color);
}

@media(min-width: 581px) and (max-width: 980px){
    .kiliride-red-car-class .car-class-holder{
        width: 90%;
    }
    .kiliride-red-car-class .car-class-holder .init-car h1{
        font-size: 40px;
        line-height: 48px;
    }
    .kiliride-red-car-class .car-class-holder .init-car h1 span{
        font-size: 40px;
        line-height: 48px;
    }
    .kiliride-red-car-class .car-class-holder .init-car img{
        height: 200px;
    }
}
@media(max-width: 581px){
    .kiliride-red-car-class .car-class-holder .init-car .fx{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
    .kiliride-red-car-class .car-class-holder{
        width: 90%;
        flex-direction: column;
    }
    .kiliride-red-car-class .car-class-holder .init-car{
        width: 100%;
    }
    .kiliride-red-car-class .car-class-holder .init-car img{
        height: 250px;
    }
    .kiliride-red-car-class .car-class-holder .init-car h1{
        font-size: 30px;
        line-height: 38px;
        text-align: center;
    }
    .kiliride-red-car-class .car-class-holder .init-car h1 span{
        font-size: 30px;
        line-height: 38px;
    }
}







/* working on fleet-owner end*/





/* working on Our-brand start*/
.Kiliride-upper-frame-brand{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    height: 1100px;
}
.Kiliride-upper-frame-brand .frame-brand{
    width: 80%;
    max-width: 1200px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: absolute;
    bottom: 50px;
}
.Kiliride-upper-frame-brand .frame-brand .upper-frame-info{
    width: 100%;
    margin: 20px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.Kiliride-upper-frame-brand .frame-brand .upper-frame-info h1{
    text-align: center;
    font-size: 65px;
    line-height: 74px;
    color: #000000;
    font-weight: 700;
}
.Kiliride-upper-frame-brand .frame-brand .upper-frame-info h1 span{
    font-size: 65px;
    line-height: 74px;
    color: var(--color);
    font-weight: 700;
}
.Kiliride-upper-frame-brand .frame-brand .upper-frame-info p{
    font-size: 20px;
    line-height: 24px;
    color: #62628A;
    text-align: center;
    width: 80%;
}
.Kiliride-upper-frame-brand .frame-brand .upper-frame-info .video{
    border-radius: 30px;
    width: 100%;
    object-fit: cover;
    height: 600px;
}
@media(min-width: 581px) and (max-width: 950px){
    .Kiliride-upper-frame-brand{
        height: 800px;
    }
    .Kiliride-upper-frame-brand .frame-brand{
        width: 90%;
    }
    .Kiliride-upper-frame-brand .frame-brand .upper-frame-info .video{
        height: 300px;
        width: 600px;
    }
}
@media(max-width: 580px){
    .Kiliride-upper-frame-brand{
        height: 700px;
    }
    .Kiliride-upper-frame-brand .frame-brand{
        width: 90%;
    }
    .Kiliride-upper-frame-brand .frame-brand .upper-frame-info h1{
        font-size: 40px;
        line-height: 45px;
    }
    .Kiliride-upper-frame-brand .frame-brand .upper-frame-info h1 span{
        font-size: 40px;
        line-height: 45px;
    }
    .Kiliride-upper-frame-brand .frame-brand .upper-frame-info .video{
        height: 200px;
    }
    .Kiliride-upper-frame-brand .frame-brand .upper-frame-info p{
        width: 100%;
    }
}
.brand-description-1{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 20px 0;
}
.brand-description-1 .holder-brand{
    width: 80%;
    max-width: 1200px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.brand-description-1 .holder-brand .side-brand{
    width: 50%;
    display: block;
}
.brand-description-1 .holder-brand .side-brand .brand-text{
    background-color: #ED1C242B;
    border-radius: 30px;
    padding: 12px 0;
    text-align: center;
    width: 280px;
    color: var(--color);
    font-size: 18px;
    font-weight: 600;
}
.brand-description-1 .holder-brand .side-brand .width{
    width: 480px;
}
.brand-description-1 .holder-brand .side-brand h1{
    font-size: 35px;
    line-height: 44px;
    color: #372D5E;
    font-family: 'gilroy-bold';
    width: 80%;
    margin: 20px 0;
}
.brand-description-1 .holder-brand .side-brand p{
    font-size: 22px;
    line-height: 28px;
    color: #62628A;
    width: 80%;
}

.hand-display{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 600px;
}
.hand-display .img-holder{
    width: 80%;
    max-width: 1200px;
    position: relative;
    height: 500px;
    border-radius: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--color);
}
.hand-display .img-holder img{
    position: absolute;
    bottom: 0;
    height: 500px;
    width: 700px;
    object-fit: contain;
    border-radius: 30px;
}
.paragraph-details-brand{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.paragraph-details-brand .paragraph-brand{
    width: 80%;
    max-width: 1200px;
    display: flex;
    flex-direction: column;
}
.paragraph-details-brand .paragraph-brand .upper-brand{
    border-radius: 30px;
    width: 300px;
    text-align: center;
    color: #ED1C24;
    background-color: #ED1C242B;
    padding: 12px 0;
    margin: 20px 0;
}
.paragraph-details-brand .paragraph-brand h1{
    color: #372D5E;
    font-size: 30px;
    line-height: 35px;
    font-weight: 600;
    width: 50%;
    margin: 20px 0;
} 
.paragraph-details-brand .paragraph-brand p{
    color: #62628A;
    font-size: 22px;
    line-height: 25px;
}
.brand-color{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 150px 0 50px 0;
}
.brand-color .brand-frame{
    margin: 20px 0;
    width: 80%;
    max-width: 1200px;
}
.brand-color .brand-frame .top{
    width: 100%;
    height: 400px;
}
.brand-color .brand-frame .bottom{
    width: 100%;
    height: 150px;
}
.brand-color .brand-frame img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.text-wrap{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 30px 0;
}
.text-wrap .wraped-flex{
    width: 80%;
    max-width: 1200px;
    display: flex;
    flex-wrap: wrap;
}
.text-wrap .wraped-flex .box{
    width: 30%;
    height: 250px;
    margin: 5px;
    padding: 10px;
}
.text-wrap .wraped-flex .box img{
    width: 20px;
    height: 20px;
}
.text-wrap .wraped-flex .box h1{
    color: #372D5E;
    font-size: 30px;
    margin: 20px 0;
    font-family: 'gilroy-bold';
}
.text-wrap .wraped-flex .box p{
    font-size: 20px;
    color: #62628A;
    line-height: 24px;
}

.brand-frame-1{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 100px 0;
}
.brand-frame-1 .fm-brand{
    width: 80%;
    max-width: 1200px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.brand-frame-1 .fm-brand .dr{
    height: 400px;
}
.brand-frame-1 .fm-brand .st{
    border-radius: 30px;
    height: 725px;
}
.brand-frame-1 .fm-brand img{
    width: 100%;
    height: 600px;
    object-fit: contain;
}

.flex-image-inbrand{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 90px 0;
}
.flex-image-inbrand .inbrand-holder{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80%;
    max-width: 1200px;
}
.flex-image-inbrand-{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 90px 0;
}
.flex-image-inbrand- .inbrand-holder-{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80%;
    max-width: 1200px;
}
.flex-image-inbrand- .inbrand-holder- .brand-last{
    width: 50%;
    height: 500px;
}
.flex-image-inbrand- .inbrand-holder- .brand-last img{
    height: 400px;
    object-fit: contain;
}
.flex-image-inbrand- .inbrand-holder- .brand-last .upper-last-frame{
    padding: 12px 0;
    width: 280px;
    text-align: center;
    background-color: #F3EDFF;
    color: var(--color);
    font-size: 18px;
    border-radius: 30px;
    font-weight: 600;
    margin: 20px 0; 
}
.flex-image-inbrand- .inbrand-holder- .brand-last h1{
    color: #372D5E;
    font-size: 35px;
    line-height: 42px;
    width: 80%;
    font-family: 'gilroy-bold';
    margin: 20px 0; 
}
.flex-image-inbrand- .inbrand-holder- .brand-last p{
    margin:0 0 40px 0;
    color: #ED1C24;
    font-size: 20px;
    line-height: 24px; 
}
.flex-image-inbrand- .inbrand-holder- .brand-last a{
    background-color: var(--color);
    border-radius: 8px;
    padding: 12px 16px;
    color: #fff;
    text-decoration: none;
    font-weight: 600;
}
.flex-image-inbrand .inbrand-holder .ide{
    width: 50%;
}
.flex-image-inbrand .inbrand-holder .ide img{
    width: 90%;
    height: 300px;
    object-fit: contain;
}
@media(min-width: 581px) and (max-width: 950px){
    .flex-image-inbrand- .inbrand-holder- .brand-last{
        width: 100%;
        margin: 10px 0;
    }
    .flex-image-inbrand-{
       margin: 20px 0;
    }
    .flex-image-inbrand- .inbrand-holder-{
        width: 90%;
        flex-direction: column;
    }
    .flex-image-inbrand .inbrand-holder{
        width: 90%;
    }
    .flex-image-inbrand{
        margin: 20px 0;
    }
    .brand-frame-1 .fm-brand .st{
        height: 600px;
    }
    .brand-frame-1 .fm-brand .dr{
        height: 600px;
    }
    .brand-frame-1{
        margin: 20px 0;
    }
    .text-wrap .wraped-flex .box{
        width: 40%;
        margin: 10px 5px; 
    }
    .text-wrap .wraped-flex{
        width: 90%;
    }
    .text-wrap{
        margin: 20px 0;
    }
    .brand-color .brand-frame .top{
        height: 250px;
    }
    .brand-color .brand-frame .bottom{
        height: 100px;
    }
    .brand-color .brand-frame{
        width: 90%;
    }
    .brand-color{
        margin: 50px 0;
    }
    .paragraph-details-brand .paragraph-brand h1{
        width: 100%;
    }
    .hand-display .img-holder{
        width: 90%;
    }
    .brand-description-1 .holder-brand .side-brand h1{
        width: 100%;
        margin: 20px 0 10px 0;
    }
    .brand-description-1 .holder-brand .side-brand p{
        width: 100%;
    }
    .brand-description-1 .holder-brand{
        width: 90%;
        flex-direction: column;
    }
    .brand-description-1 .holder-brand .side-brand{
        width: 100%;
        margin: 20px 0;
    }
}
@media(max-width: 580px){
    .flex-image-inbrand- .inbrand-holder- .brand-last img{
        width: 100%;
        height: 300px;
        object-fit: cover;
    }
    .flex-image-inbrand- .inbrand-holder- .brand-last h1{
        width: 100%;
        font-size: 28px;
        line-height: 32px;
    }
    .flex-image-inbrand- .inbrand-holder- .brand-last{
        width: 100%;
        height: auto;
        margin: 20px 0;
    }
    .flex-image-inbrand{
        margin: 20px 0;
    }
   
    .flex-image-inbrand .inbrand-holder .ide img{
        height: 200px;
        width: calc(100% - 10px);
        margin: 0 5px;
    }
    .flex-image-inbrand .inbrand-holder{
        width: 90%;
    }
    .flex-image-inbrand- .inbrand-holder-{
        flex-direction: column;
        width: 90%;
    }
    .brand-frame-1 .fm-brand .st,.brand-frame-1 .fm-brand .dr{
        height: 250px;
        border-radius: 0;
    }
    .brand-frame-1 .fm-brand img{
        height: 250px;
    }
    .brand-frame-1 .fm-brand{
        width: 90%;
    }
    .brand-frame-1{
        margin: 10px 0;
    }
    .text-wrap .wraped-flex .box{
        width: 100%;
        padding: 0;
        margin: 10px 0;
    }
    .text-wrap .wraped-flex{
        width: 90%;
    }
    .brand-description-1 .holder-brand .side-brand .width{
        font-size: 15px;
        width: 100%;
        line-height: 22px;
    }
    .brand-color .brand-frame .bottom{
        height: 50px;
    }
    .brand-color .brand-frame .top{
        height: 120px;
    }
    .brand-color .brand-frame{
        width: 90%;
    }
    .brand-color{
        margin: 80px 0 30px 0;
    }
    .paragraph-details-brand .paragraph-brand h1{
        width: 100%;
        font-size: 20px;
        line-height: 25px;
    }
    .paragraph-details-brand .paragraph-brand{
        width: 90%;
    }
    .hand-display{
        height: 200px;
    }
    .hand-display .img-holder{
        width: 90%;
        height: 200px;
    }
    .hand-display .img-holder img{
        height: 200px;
        width: 100%;
    }
    .brand-description-1 .holder-brand .side-brand h1{
        font-size: 20px;
        line-height: 24px;
        width: 100%;
        margin: 25px 0 10px 0;
    }
    .brand-description-1 .holder-brand .side-brand p{
        width: 100%;
        font-size: 20px;
        line-height: 24px;
        margin: 15px 0;
    }
    .brand-description-1 .holder-brand{
        width: 90%;
        flex-direction: column;
    }
    .brand-description-1 .holder-brand .side-brand{
        width: 100%;
    }
}
/* working on Our-brand ends*/




/* working on career start*/
.career-top-frame{
    width: 100%;
    height: 600px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px 0;
    background-color: #08031A;
    position: relative;
}
.career-top-frame .career-frame-holder{
    width: 80%;
    height: 400px;
    max-width: 1200px;
    display: flex;
    justify-content: center;
    position: absolute;
    bottom: 80px;
}
.career-top-frame .career-frame-holder .frame-sides{
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.career-top-frame .career-frame-holder .frame-sides img{
    object-fit: cover;
    height: 400px;
    width: 90%;
    border-radius: 30px;
}
.career-top-frame .career-frame-holder .frame-sides .side-holder-column{
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    width: 100%;
    height: 100%;     
}
.career-top-frame .career-frame-holder .frame-sides .side-holder-column h1{
    font-family: 'gilroy-bold';
    font-size: 60px;
    line-height: 68px;
    color: #fff;
    margin: 20px 0;
}
.career-top-frame .career-frame-holder .frame-sides .side-holder-column h1 span{
    font-family: 'gilroy-bold';
    font-size: 60px;
    line-height: 68px;
    color: var(--color);
}
@media(min-width: 951px) and (max-width: 1180px){
    .career-top-frame .career-frame-holder .frame-sides .side-holder-column h1{
        font-size: 50px;
        line-height: 58px;
    }
}
.career-top-frame .career-frame-holder .frame-sides .side-holder-column p{
    color: #FFFFFF;
    font-size: 20px;
    line-height: 24px;
    width: 70%;
    margin: 0 0 20px 0;
}
.career-top-frame .career-frame-holder .frame-sides .side-holder-column a{
    background-color: var(--color);
    padding: 12px 16px;
    border-radius: 8px;
    color: #fff;
    text-decoration: none;
}
@media(min-width: 581px) and (max-width: 950px){
    .career-top-frame{
        height: 900px;
    }
    .career-top-frame .career-frame-holder{
        height: 800px;
        flex-direction: column;
        width: 90%;
    }
    .career-top-frame .career-frame-holder .frame-sides{
        width: 100%;
        margin: 20px 0;
    }
    .career-top-frame .career-frame-holder .frame-sides .side-holder-column{
        justify-content: center;
        align-items: center;
    
    }
    .career-top-frame .career-frame-holder .frame-sides .side-holder-column h1{
        text-align: center;
    }
    .career-top-frame .career-frame-holder .frame-sides .side-holder-column p{
        text-align: center;
    }
}
@media(max-width: 580px){
    .career-top-frame{
        height: 800px;
    }
    .career-top-frame .career-frame-holder{
        height: 800px;
        flex-direction: column;
        width: 90%;
    }
    .career-top-frame .career-frame-holder .frame-sides{
        width: 100%;
        margin: 20px 0;
    }
    .career-top-frame .career-frame-holder .frame-sides img{
        width: 100%;
        height: 300px;
    }
    .career-top-frame .career-frame-holder .frame-sides .side-holder-column{
        justify-content: center;
        align-items: center;
    
    }
    .career-top-frame .career-frame-holder .frame-sides .side-holder-column h1{
        text-align: center;
        font-size: 35px;
        line-height: 38px;
    }
    .career-top-frame .career-frame-holder .frame-sides .side-holder-column h1 span{
        font-size: 35px;
        line-height: 38px;
    }
    .career-top-frame .career-frame-holder .frame-sides .side-holder-column p{
        text-align: center;
    }
}
.career-head-row{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 30px 0 0 0;
    padding: 20px 0;
}
.career-head-row h1{
    font-size: 40px;
    font-weight: bold;
}
.career-carouel-flex{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
}
.career-carouel-flex .carousel {
    position: relative;
    width: 80%;
    max-width: 1200px;
    height: 320px;
    overflow: hidden;
    background: white;
    border-radius: 12px;
    text-align: center;
    padding: 2rem 0;
  }

  .career-carouel-flex .carousel-items {
    display: flex;
    transition: transform 0.5s ease-in-out;
  }

  .career-carouel-flex  .carousel-item {
    width: 100%;
    height: 300px;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
  }
  .career-carouel-flex  .carousel-item .carousel-side{
    width: 50%;
    height: 300px;
    padding:  0;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .career-carouel-flex  .carousel-item .carousel-side img{
    width: 80%;
    height: 100%;
  }
  .career-carouel-flex .carousel-item h2 {
    margin: 20px 0;
    font-size: 2rem;
    font-weight: bold;
  }

  .career-carouel-flex .carousel-item p {
    color: #62628A;
    margin-top: 22px;
  }

  .career-carouel-flex .arrows {
    position: absolute;
    bottom: 10px;
    width: 100%;
    display: flex;
    justify-content: right;
    background-color: red;
    left: 0;
  }
  .career-carouel-flex .btn{
    width: 100%;
    display: flex;
    justify-content: right;
  }
  .career-carouel-flex .btn .btn-holder{
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .career-carouel-flex .btn .btn-holder .left{
    margin: 0 10px;
  }
  .career-carouel-flex .btn .btn-holder .right{
    margin: 0 10px;
  }
  .career-carouel-flex .arrow {
    background: rgba(0, 0, 0, 0.1);
    border: none;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    z-index: 1;
  }

  .career-carouel-flex .dots {
    display: flex;
    justify-content: center;
    bottom: 10px;
    padding: 10px 0;
    width: auto;
    left: 0;
  }
  .career-carouel-flex .dot {
    width: 10px;
    height: 10px;
    margin: 0 5px;
    border-radius: 50%;
    background: #EFEBEB;
    cursor: pointer;
    transition: background 0.3s;
  }

  .career-carouel-flex .dot.active {
    background: var(--color);
  }
  @media(min-width: 581px) and (max-width: 950px){
    .career-carouel-flex .btn .btn-holder{
        width: 100%;
    }
    .career-carouel-flex .btn{
        margin: -80px 0;
        justify-content: center;
    }
    .career-carouel-flex .carousel {
        width: 90%;
        height: 800px;
    }
    .career-carouel-flex  .carousel-item {
        flex-direction: column;
        height: auto;
        margin: 50px 0;
    }
    .career-carouel-flex  .carousel-item .carousel-side{
        width: 100%;
        align-items: center;
        height: 500px;
    }
    .career-carouel-flex  .carousel-item .carousel-side:nth-child(2){
        height: 200px;
    }
    .career-carouel-flex  .carousel-item .carousel-side img{
        width: 600px;
        height: 500px;
    }
    .career-carouel-flex .carousel-item p {
        margin-top: 0;
    }
  }
  @media(max-width: 580px){
    .career-carouel-flex .btn .btn-holder{
        width: 100%;
    }
    .career-carouel-flex .btn{
        margin: -20px 0;
        justify-content: center;
    }
    .career-carouel-flex .carousel {
        width: 90%;
        height: 600px;
    }
    .career-carouel-flex  .carousel-item {
        flex-direction: column;
        height: auto;
        margin: 50px 0;
    }
    .career-carouel-flex  .carousel-item .carousel-side{
        width: 100%;
        align-items: center;
        height: 300px;
    }
    .career-carouel-flex  .carousel-item .carousel-side:nth-child(2){
        height: 200px;
    }
    .career-carouel-flex  .carousel-item .carousel-side img{
        width: 100%;
        height: 300px;
    }
    .career-carouel-flex .carousel-item p {
        margin-top: 0;
    }
  }



.kiliride-office-frame{
    background-image: url(images/flex/Kiliride-office-.png);
    /*background-attachment: fixed;*/
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 400px;
    margin-top: 80px;
}
.kiliride-how-it-work{
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #08031A;
    padding: 20px 0 90px 0;
}
.kiliride-how-it-work .how-it-work-frame{
    width: 80%;
    max-width: 1200px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.kiliride-how-it-work .how-it-work-frame h1{
    font-size: 50px;
    margin: 50px 0;
    font-family: 'gilroy-bold';
    color: #fff;
}
.kiliride-how-it-work .how-it-work-frame .sides-application-holder{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 0;
}
.kiliride-how-it-work .how-it-work-frame .sides-application-holder .side-application{
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.kiliride-how-it-work .how-it-work-frame .sides-application-holder .side-application img{
    object-fit: contain;
    height: 300px;
}
@media(min-width: 581px) and (max-width: 950px){
    .kiliride-how-it-work .how-it-work-frame{
        width: 90%;
    }
    .kiliride-how-it-work .how-it-work-frame .sides-application-holder .side-application img{
        height: 280px;
    }
}
.kiliride-how-it-work .how-it-work-frame .sides-application-holder .side-application .left-side{
    margin: 10px 0;
    display: flex;
    flex-direction: column;
    width: 100%;
}
.kiliride-how-it-work .how-it-work-frame .sides-application-holder .side-application .app-holder{
    width: 100%;
    display: block;
}
.kiliride-how-it-work .how-it-work-frame .sides-application-holder .side-application .left-side h1{
    font-size: 25px;
    font-weight: 700;
    color: #fff;
     margin: 10px 0;
}
.kiliride-how-it-work .how-it-work-frame .sides-application-holder .side-application .left-side p{
    color: #959292;
    font-size: 20px;
    line-height: 25px;
}
.kiliride-how-it-work .how-it-work-frame .company-statitics{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: -20px 0;
}
.kiliride-how-it-work .how-it-work-frame .company-statitics .company-data{
    width: auto;
    padding:  0 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.kiliride-how-it-work .how-it-work-frame .company-statitics .company-data .title{
    color: #ED1C24;
    font-size: 90px;
     font-family: 'gilroy-bold';
    text-align: center;
}
.kiliride-how-it-work .how-it-work-frame .company-statitics .company-data .paragraph{
    font-size: 24px;
    color: #FFFFFF;
    font-weight: 700;
}
@media(min-width: 581px) and (max-width: 950px){
    .kiliride-how-it-work .how-it-work-frame .company-statitics .company-data .title{
        font-size: 40px;
    }
    .kiliride-how-it-work .how-it-work-frame .company-statitics .company-data .paragraph{
        font-size: 16px;
    }
}

@media(max-width: 580px){
    .kiliride-how-it-work .how-it-work-frame .company-statitics .company-data .paragraph{
        font-size: 16px;
    }
    .kiliride-how-it-work .how-it-work-frame .company-statitics .company-data .title{
        font-size: 30px;
    }
    .kiliride-how-it-work .how-it-work-frame .sides-application-holder .side-application .left-side p{
        font-size: 18px;
    }
    .kiliride-how-it-work .how-it-work-frame .sides-application-holder .side-application .left-side h1{
        font-size: 20px;
    }
    .kiliride-how-it-work .how-it-work-frame{
        width: 90%;
    }
    .kiliride-how-it-work .how-it-work-frame .sides-application-holder .side-application{
        width: 100%;
        margin: 20px 0;
    }
    .kiliride-how-it-work .how-it-work-frame .sides-application-holder .side-application img{
        height: 280px;
    }
    .kiliride-how-it-work .how-it-work-frame .sides-application-holder{
        flex-direction: column;
    }
    .kiliride-office-frame{
        height: 150px;
    }
    .kiliride-how-it-work .how-it-work-frame h1{
        font-size: 30px;
        margin: 25px 0;
    }
}
.growing-fast{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 80px 0;
}
.growing-fast h1{
    font-size: 60px;
    line-height: 68px;
    font-weight: bold;
    color: #000000;
    text-align: center;
}
.growing-fast h1 span{
    color: var(--color);
    font-size: 60px;
    line-height: 68px;
    font-weight: bold;
}
.growing-fast p{
    margin: 30px 0;
    font-size: 30px;
    font-weight: 700;
    color: #000;
}
@media(max-width: 580px){
    .growing-fast h1{
        font-size: 30px;
        line-height: 38px;
    }
    .growing-fast h1 span{
        font-size: 30px;
        line-height: 38px;
    }
    .growing-fast p{
        font-size: 18px;
    }
}
.kiliride-career-form{
    margin: 30px 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px 0;
    flex-direction: column;
}
.kiliride-career-form .career-form-holder{
    width: 500px;
    display: block;
}

.kiliride-career-form .career-form-holder .form-data-flex{
    width: calc(100% - 10px);
    padding: 10px;
    display: block;
    margin:  0;
}
.kiliride-career-form .career-form-holder .form-data-flex label{
    display: block;
    font-size: 18px;
    line-height: 28px;
    font-weight: bold;
    color: #1B1B1B;
    padding: 6px 0;
}
.kiliride-career-form .career-form-holder .form-data-flex .input{
    width: calc(100% - 20px);
    padding: 12px 10px;
    background-color: #F1F1F1;
    border-radius: 8px;
    border: none;
    outline: none;
    color: #605C5C;
}
.kiliride-career-form .drag-area{
    width: 100%;
    display: block;
    padding: 20px 0;
}
.kiliride-career-form .drag-area .title{
    font-size: 18px;
    line-height: 24px;
    color: #1B1B1B;
    font-weight: bold;
    padding: 10px;
}
.kiliride-career-form .drag-area .title h3{
    font-size: 15px;
    color: #786F6F;
    font-weight: 600;
}
.kiliride-career-form .drag-area .drop-area{
    border: 1px dashed #A4A4A4;
    width: 100%;
    height: 200px;
    padding: 20px 0;
    border-radius: 35px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.kiliride-career-form .drag-area .drop-area h1{
    font-size: 20px;
    line-height: 25px;
    margin: 20px 0 10px 0;
    text-align: center;
}
.kiliride-career-form .drag-area .drop-area p{
    color: #6B6666;
    font-size: 18px;
    margin: 0;
}
.kiliride-career-form .drag-area .drop-area label{
    display: block;
    margin: 40px 0 0 0;
    display: flex;
    border-radius: 12px;
    padding: 12px 16px;
    background-color: #E4E2E2;
    color: #767676;
    font-weight: bold;
    cursor: pointer;
}
.kiliride-career-form .career-form-holder .form-data-flex .input-location{
    display: flex;
    width: calc(100% - 20px);
    padding: 12px 10px;
    background-color: #F1F1F1;
    border-radius: 8px;
} 
.kiliride-career-form .career-form-holder .form-data-flex .input-location i{
    font-size: 15px;
    color: #000;
}
.kiliride-career-form .career-form-holder .form-data-flex .input-location .lct{
    width: calc(100% - 20px);
    background-color: #F1F1F1;
    margin: 0 15px;
    border: none;
    outline: none;
    color: #605C5C;
}
.kiliride-career-form .career-form-holder .select-option{
    width: 100%;
    display: flex;
}
.kiliride-career-form .career-form-holder .select-option .side{
    width: calc(50% - 20px);
    margin: 10px;
    display: block;
}
.kiliride-career-form .career-form-holder .select-option .side label{
    display: block;
    font-size: 18px;
    line-height: 28px;
    font-weight: bold;
    color: #1B1B1B;
    padding: 6px 0;
}
.kiliride-career-form .career-form-holder .select-option .side select{
    background-color: #F1F1F1;
    width: calc(100% - 20px);
    border: none;
    outline: none;
    padding: 12px 10px;
    border-radius: 8px;
    font-size: 18px;
}
.kiliride-career-form .career-form-holder .select-option .side .linkedIn{
    background-color: #F1F1F1;
    width: calc(100% - 20px);
    border: none;
    outline: none;
    padding: 12px 10px;
    border-radius: 8px;
    color: #605C5C;
    font-size: 18px;
}
.kiliride-career-form .career-form-holder p{
    text-align: center;
    width: 100%;
    color: #181616;
    font-size: 20px;
    line-height: 24px;
}
.kiliride-career-form .career-form-holder .check-box{
    display: flex;
    width: 100%;
    height: 100px;
    padding: 0;
}
.kiliride-career-form .career-form-holder .check-box .box{
    width: auto;
    display: block;
}
.kiliride-career-form .career-form-holder .check-box .box p{
    margin: -2px 0;
    padding: 0;
    color: #8C8C8C;
}
.kiliride-career-form .career-form-holder .submit{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-career-form .career-form-holder .submit-btn{
    font-weight: bold;
    color: #fff;
    background-color: var(--color);
    border-radius: 8px;
    padding: 12px 20px;
    border: none;
    outline: none;
}
.kiliride-career-form .career-form-holder .error{
    width: 100%;
    background-color: var(--color);
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-weight: 500;
    padding: 12px 0;
    margin: 20px 0;
    display: none;
    text-align: center;
}

@media(max-width: 580px){
    .kiliride-career-form .drag-area .drop-area{
        width: 96%;
    }
    .kiliride-career-form .career-form-holder .form-data-flex{
        margin: 0 -10px;
    }
    .kiliride-career-form .career-form-holder .submit{
        margin: 20px 0;
    }
    .kiliride-career-form .career-form-holder .check-box .box:nth-child(1){
        margin-right: 10px;
    }
    .kiliride-career-form .career-form-holder p{
        font-size: 16px;
        line-height: 22px;
    }
    .kiliride-career-form .career-form-holder .select-option .side{
        width: calc(100% - 10px);
        margin: 20px 0;
    }
    .kiliride-career-form .career-form-holder .select-option .side select{
        width: 100%;
    }
    .kiliride-career-form .career-form-holder .select-option{
        flex-direction: column;
    }
    .kiliride-career-form .career-form-holder{
        width: 90%;
    }
    .growing-fast h1{
        font-size: 30px;
        line-height: 38px;
    }
    .growing-fast h1 span{
        font-size: 30px;
        line-height: 38px;
    }
    .growing-fast p{
        font-size: 18px;
    }
}














/* working on career start*/
.first-blog{
    width: 80%;
    margin-left: 10%;
    height: 100%;
}
.career-top{
    width: 100%;
    height: 600px !important;
    margin-bottom: 60px;
    background-image: linear-gradient(rgba(4,9,30,0.3),rgba(4,9,30,0.3)),url(images/webp/career-kili.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}
.career-top .col-gate{
    position: absolute;
    bottom: 30px;
    left: 120px;
    width: 40%;
    height: auto;
    padding: 10px 0;
}

.career-top .col-gate h1{
      align-items: start;
      text-align: start;
      color: #fff;
      font-size: 50px;
      font-weight: 700;
      margin-bottom: 50px;
}
.career-top .col-gate a{
    background-color: #ED1C24;
    padding: 15px 30px;
    border: none;
    text-decoration: none;
    color: #fff;
    border-radius: 30px;
    font-size: 18px;
    font-weight: 800 !important;
}
.cat-dog{
    width: 100%;
    height: auto;
    padding: 20px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.cat-dog .dog-cat{
    display: block;
    width: 20%;
    border-right: 1px solid #ED1C24;
    height: auto;
}
.cat-dog .dog-cat h1{
    color: #ED1C24;
    font-size: 3rem;
    font-weight: 900 !important;
}
.cat-dog .dog-cat p{
    font-size: 15px;
    font-weight: 700;
}
@media(max-width: 700px) {
    .career-top{
        background-position: right;
        width: 100%; 
    }
    .career-top .col-gate{
        left: 10px;
        width: calc(100% - 20px);
    }
    .cat-dog{
        display: inline-block;
        padding: 0;
        margin-top: -20px;
    }
    .cat-dog .dog-cat{
        display: inline-block;
        width: 40%;
        padding: 10px;
        margin-bottom: 30px;
    }
    .cat-dog .dog-cat h1{
        font-size: 2rem;
    }
    .cat-dog .dog-cat p{
        font-size: 15px;
    }
    .search-holder{
        background-position: 60%;
    }
    .kili-blog .blog .privacy{
        width: 90%;
        margin-left: 2%;
        padding: 10px  15px;
    }
    .kili-blog .blog .policy h5{
        font-size: 1rem;
        text-align: justify;
        line-height: 28px;
        padding: 20px 0;
    }
    .kili-blog .blog .policy p h2{
        font-size: 1rem;
        color: var(--black);
        font-weight: 500;
        padding: 20px 0;
    }
    .kili-blog .blog .policy p{
        line-height: 28px;
        font-weight: none;
        margin-bottom: 20px;
    }
    .search-holder h1{
        font-size: 1.5rem;
        text-wrap: nowrap;
    }
    .search-holder h2{
        font-size: 1rem;
    }
    .kili-blog .blog .policy ul{
        padding: 0;
    }
}
.lgwX{
    width: 100%;
    background: #fff;
    display: flex;
    text-align: start;
    height: auto;
    margin-top: -150px;
    margin-bottom: 50px;
    padding: 50px 0;
}
.lgwX .bsksl p{
    color: var(--black);
    margin-top: 15%;
    font-size: 15px;
    line-height: 28px;
}
.lgwX .bsksl{
    width: 45%;
    height: 300px;
    padding: 10px;
    display: block;
}
.lgwX .bsksl iframe{
    width: 100%;
    border-radius: 30px;
    height: 100%;
}
@media (max-width: 700px){
    .lgwX{
        flex-direction: column-reverse;
        height: auto;
        margin-top: -250px;
    } 
    .lgwX .bsksl{
        width: 90%;
        margin-left: 3%;
     }
    .lgwX .bsksl p{
        text-align: center;
        justify-content: center;
        align-items: center;
    }
    .lgwX .bsksl iframe{
        width: 100%;
        height: 200px;
        margin-left: 0;
        margin-top: -30px;
    }
  
}
.center-bar{
    width: 100%;
    padding: 20px 0;
    margin-bottom: 60px;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-color: #ED1C24;
}
.center-bar p{
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 700;
    display: inline-block;
    font-size: 1.5rem;
}
.animation{
    color: #fff;
    width: 100%;
    border-right: 2px solid #fff;
    white-space: nowrap;
    overflow: hidden;
    animation: typing 3s steps(30),
        cursor .4s step-end infinite alternate;
}
@keyframes cursor {
    50%{border-color: transparent;}
}
@keyframes typing {
    from {width: 0;}
}
@media (max-width: 700px) {
    .center-bar p{
        font-size: 1rem !important;
        display: inline-block;
        width: 100%;
        white-space: nowrap;
        line-height: 20px;
    }
    .center-bar{
        height: 30px;
        width: 100%;
    }
    .animation{
        display: inline-block;  
    }
  .search-holder .search-box .searching{
        width: 80%;
        margin-left: 10%;
  }
}
@media(min-width: 710px) and (max-width: 1080px){
    .search-holder .search-box .searching{
        width: 50%;
        margin-left: 25%;
    }
    .panels .panel-boxs{
        margin-left: 15%;
        color: var(--black);
    }
}
/*Animation load*/

/*Animation load ends*/
 .career-gate{
    width: 100%;
    height: auto;
    padding: 70px 0;
    margin-bottom: 20px;
    background-color: #ED1C24;
    color: #FFF;
}
 .career-gate h1{
    color: #FFF !important;
    font-size: 2rem;
    margin-bottom: 20px;
    font-weight: 700;
}
.career-gate .flex-box{
    width: 100%;
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.career-gate .flex-box .boxes{
    width: 500px;
    margin-bottom: 20px;
    height: auto;
    padding: 10px 10px;
    text-align: start;
    display: inline-block;
    position: relative;
}
@media(min-width: 710px) and (max-width: 1080px){
    .career-gate .flex-box .boxes{
        width: 350px !important;
    }
}
.explore-link{
   width: 100%;
   text-align: center;
   justify-content: center;
   align-items: center;
}
 
.career-gate .flex-box .boxes h2{
    font-size: 1.5rem;
    margin-bottom: 10px;
    color: #fff;
    font-weight: 700;
    text-align: start;
}
.career-gate .flex-box .boxes p{
    line-height: 28px;
    font-size: 1rem;
    color: #fff;
    margin-left: 0;
    text-align: start;
}
.iframe-video{
    width: 100%;
    height: 500px;
    border-radius: 20px;
    margin-bottom: 60px;
    justify-content: center;
}
.apply{
    width: 80%;
    margin-left: 10%;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 20px 0;
}
.apply h1{
    font-size: 2rem;
}
.apply a{
    text-decoration: none;
    color: #FFF;
    background-color: #ED1C24;
    padding: 15px 30px;
    border-radius: 30px;
    font-weight: 700;
}
.apply p{
    font-size: 1rem;
    color: var(--black);
    justify-content: center;
    align-items: center;
    text-align: center;
    line-height: 25px;
    margin-bottom: 20px;
}
.apply .bold-line{
    font-family: 'gilroy-bold';
    font-weight: 700;
}
.iframe-video iframe{
    width: 80%;
    height: 80%;
    border-radius: 20px;
}


.kili-blog .blog .head-bar{
    width: 100%;
    height: 400px;
    background-color: #ED1C24;
}
.kili-blog .blog .head-bar .bottom{
    padding: 170px 20px;
    color: #fff;
    text-align: start;
    align-items: start;
}
.kili-blog .blog .head-bar .bottom h2{
    color: #fff;
    text-align: start;
    font-weight: 800;
    align-items: start;
    margin-bottom: 20px;
    color: #FFF;
    font-size: 2rem;
}
.kili-blog .blog .head-bar .bottom p{
    color: #fff;
    line-height: 25px;
    font-size: 1rem;
    width: 80%;
}
@media (max-width: 700px) {
    .iframe-video{
        border-radius: none;
    }
    .iframe-video iframe{
        width: 100%;
        height: 100%;
        border-radius: none !important;
    }
    .career-top .col-gate h1{
        font-size: 2rem;
    }
 
 
  
    .center-bar{
        font-size: 1.3rem;
    }
    .career-gate .flex-box{
        flex-direction: column;
    }
    .career-gate h1{
        font-size: 1.5rem;
    }
    .career-gate .flex-box .boxes{
        width: 90%;
        justify-content: center;
        text-align: start;
        margin-left: 0;
    }
    .career-gate .flex-box .boxes p{
        justify-content: center;
        text-align: start;
        padding: 0 10px;
        width: 95%;
    }
    .career-gate .flex-box .boxes h2{
        font-size: 1.2rem;
        padding: 0 10px;
    }
    .explore-link{
        float: unset;
        align-items: start;
        margin-left: 0;
        margin-right: 0;
        justify-content: center;
        padding: 20px 0;
    }
    .apply{
        padding: 30px 0;
        margin-bottom: 20px;
    }
    .apply p{
        text-align: center;
        align-items: center;
        width: 90%;
        margin-left: 5%;
        margin-bottom: 30px;
    }
    .apply h1{
        padding: 20px 0;
        font-weight: 700;
    }
    .kili-blog .blog .head-bar .bottom{
        padding: 100px 5px;
        width: 100%;
    }
    .kili-blog .blog .head-bar .bottom p{
        width: 95%;
    }
    .kili-blog .blog .head-bar{
        width: 100% !important;
        margin-left: -10px;
        padding: 0 20px;
    }
}
.first-blog {
    width: 100% !important;
    margin-left: 0%;
}
.first-blog img{
    width: 95%;
    height: 600px;
    object-fit: cover;
    border-radius: 20px;
}
.title{
    width: 100%;
    padding: 20px 25px;
}
.title a{
    text-decoration: none;
    color: var(--black);
}
.title p{
    font-size: 1.5rem !important;
    font-weight: 600;
    font-family: 'gilroy-bold';
    color: var(--black);
}
.title .date{
    font-size: 12px !important;
    color: #7070706b;
    padding: 20px 0;
    display: flex;
}
 .spaning{
    display: flex;
    width: 100%;  
    padding: 10px 0;
}
.spaning .icons-{
    display: flex;
    background-color: #fff;
    padding: 10px 10px;

}
.title .col-{
    height: 100px;
    text-align: left;
    align-items: start;
}
.title .col- a{
    text-decoration: none;
    background-color: #ED1C24;
    padding: 10px 20px;
    color: #FFF;
    border-radius: 20px;
    font-weight: 700;
}
.title .col- .skipp- a{
    background-color: transparent;
    color: #ED1C24;
}
.title .col- p{
    font-size: 1rem !important;
    font-weight: 400;
    line-height: 28px;
    margin-bottom: 30px;
}
.kili-blog .blog .posts{
    width: 100%;
    height: auto;
    align-items: center;
    text-align: center;
    justify-content: center;
    margin-top: 50px;
    display: inline-block;
}
.kili-blog .blog .posts a{
    text-decoration: none;
}
.kili-blog .blog .posts .post{
    width: 30%;
    top: 0;
    height: 300px;
    display: inline-block;
    margin-right: 15px;
    margin-bottom: 15px;
    text-align: start;
}
.kili-blog .blog .posts .post img{
    width: 100%;
    height: 60%;
    border-radius: 10px;
    object-fit: cover;
}
.kili-blog .blog .posts .post .caption{
    width: 100%;
    height: 50px;
}
.kili-blog .blog .posts .post .date{
    font-size: 12px;
    color: #70707086;
    padding: 5px 0;
}
.kili-blog .blog .posts .post .caption span{
    text-align: start;
    justify-content: baseline;
    align-items: start;
    font-size: 12px;
}
.kili-blog .blog .posts .post .caption p{
    font-size: 1rem;
    line-height: 25px;
    text-align: start;
    color: var(--black);
    font-family: 'gilroy-bold';
    font-weight: 500;
}
.next{
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin-bottom: 40px;
   
}
.next a{
    background-color: #ED1C24;
    padding: 10px 20px;
    border-radius: 30px;
    text-decoration: none;
    color: #fff;
    font-weight: 700;
    margin-right: 10px;
}
.notification{
    width: 100%;
    height: 200px;
    text-align: center;
    justify-content: center;
    align-items: center;
    margin-bottom: 50px;
}

.ride-book{
    background-color: #f2f1f1;
    border-radius: 20px;
    width: 60%;
    height: 100%;
    margin-left: 20%;
    overflow: hidden;
    display: flex;
}
.ride-book .reds{
    background-color: #ED1C24;
    width: 50%;
    height: 100%;
    text-align: center;
    justify-content: center;
    align-items: center;
    font-size: 2rem;
}
.ride-book .bar{
    width: 80%;
    margin-left: 10%;
    margin-top: 20%;
    font-size: 1.5rem;
    color: #fff;
    text-align: start;
    font-weight: 700;
}
.ride-book .reds .bar p{
    color: #fff;
    font-size: .8rem;
    text-align: start;
    padding: 10px 0;
}
.ride-book .right{
  width: 50%;
  font-size: 1.5rem;
  color: var(--black);
}
.ride-book .righting{
    width: 80%;
    margin-left: 10%;
    margin-top: 20%;
    font-weight: 800;
    font-size: 1.5rem;
    color: var(--black);
    text-align: start;
    display: block;
}
.ride-book .righting p{
    color: var(--black);
    font-size: .8rem;
    text-align: start;
    padding: 10px 0;
}
@media (max-width: 700px) {
    .first-blog img{
        height: 200px;
    }
    .first-blog{
        width: 90% !important;
        margin-left: 5%;
    }
    .ride-book .reds .bar{
        font-size: 1rem;
    }
    .ride-book .righting{
        font-size: 1rem;
    }
    .title{
        width: 100%;
        padding: 10px 5px;
    }
    .title p{
        font-size: 1.5rem;
        line-height: 25px;
    }

    .kili-blog .blog .posts .post{
        width: 90%;
        height: auto;
        padding: 10px 0;
        margin-left: 3%;
    }
 
    .kili-blog .blog .posts .post .caption p{
        font-size: 1rem;
    }
    .ride-book{
     width: 100%;
     margin-left: 0;
     border-radius: 0;
     height: 400px;
     flex-direction: column;
     border-radius: 30px;
     background-color: transparent;
    }
    .ride-book .reds{
        height: 200px;
        width: 100%;
        border-radius: 30px 30px 0 0;
    }
    .ride-book .reds .bar p{
        font-size: 1rem;
    }
    .ride-book .reds .bar{
        font-size: 1.5rem;
    }
    .notification{
        height: auto;
        width: 90%;
        margin-left: 5%;
        padding: 20px 0;
        border-radius: 30px !important;
    }
    .ride-book .right{
        width: 100%;
        height: 200px;
        padding: 0;
        margin-top: 0;
        background-color: #f2f1f1;
        border-radius: 0 0 30px 30px;
    }
    .ride-book .righting{
        font-size: 1.5rem;
    }
}
/* fleet owner slider*/
.bonding-bx{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-top: -50px;
}
.contents-bx{
    height: 400px;
    width: 100%;
    overflow: hidden;
    position: relative;
}
.contents-bx .images-bx{
    width: 100%;
    height: 100%;
}
.images-bx  .img-bx{
    height: 100%;
    width: 100%;
    transition: all ease;
    background-color: #f8f8f8;
}
.images-bx .img-bx  .paragraphs-bx {
    float: left;
    width: 50%;
    height: auto;
    padding: 20px 40px;
    transform: translateY(30%);
    text-align: start;
}
.images-bx  .img-bx  .paragraphs-bx  h1{
    font-size: 2rem;
    color: var(--black);
    margin: 5px 0 20px 0;
    text-align: start;
    padding: 0 20px;
    font-weight: 800;
}
.images-bx  .img-bx  .paragraphs-bx a{
    padding: 15px 20px;
    background-color: #ED1C24;
    color: #fff;
    text-decoration: none;
    border-radius: 30px;
    margin-left: 20px;
    font-weight: 700;
}
.images-bx  .img-bx  .paragraphs-bx  p{
    line-height: 28px;
    font-size: 18px;
    color: var(--black);
    text-align: start;
    padding: 10px 20px;
    margin-bottom: 20px;
}
.images-bx  .img-bx img{
    height: 50%;
    width: 30%;
    float: right;
    margin-right: 100px;
    object-fit: contain;
     transform: translateY(30%); 
}
.contents-bx  .slide-bx:hover .fa-solid{
    color: #fff;
}
.contents-bx  .slide-bx  .fa-solid{
    text-align: center;
    align-items: center;
    justify-content: center;  
    padding: 10px 0;
    font-size: 1.5rem;
    color: var(--black);
}
.contents-bx  .slide-bx {
    position: absolute;
    top: 85%;
    transform: translateX(-50%);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #dddadaab;
    right: 50px;
    text-align: center;
    align-items: center;
    justify-content: center;
    transition: ease-in .3s;
}
.contents-bx .slide-bx:hover{
    background-color: #ED1C24;
    border: none;
}
.contents-bx  .left{
    left: 87%;
}
@media(min-width: 701px) and (max-width: 1080px){
    .contents-bx  .right{
        right: 15%;
    }
    .images-bx  .img-bx{
        padding: 0;
    }
    .contents-bx{
        height: 500px;
    }
       .images-bx  .img-bx  .paragraphs-bx {
       
        margin-top: -10%;
       }
        .images-bx .img-bx img{
            float: right;
            margin-right: 0;
            width: 30%;
        }
}
@media(max-width: 700px){
    .contents-bx  .slide-bx {
        top: 90%;
        transform: translateX(60%);
        width: 50px;
        height: 50px;
    }
    .contents-bx  .right{
        right: 40%;
    }
    .contents-bx  .left{
        left: 25%;
    }
   .bonding-bx {
       height: auto;
       margin-top: -50px;
       margin-left: -5%;
       padding: 0;
       left: 0;
       width: 120%;
       margin-bottom: 0;
       background-color: #f8f8f8;
   }
   .contents-bx {
       margin-top: 0;
       height: auto;
       padding: 80px 0;
       width: 80%;
       margin-left: -8%;
       margin-bottom: 10px;
       
   }
   .images-bx  .img-bx{
    display: block;
    height: auto;
    text-align: center;
    align-items: center;
    place-items: center;
    margin-bottom: 0;
    margin-top: -80px;
    padding: 50px 0;
    width: 100%;
   }
    .images-bx .img-bx img{
        float: none;
        text-align: center;
        place-items: center;
        align-items: center;
        width: 100%;
        height: 250px;
        margin-top: 30px;
        user-select: none;
        margin-bottom: 0;
    }
    .images-bx  .img-bx  .paragraphs-bx {
        float: unset;
        width: 100%;
        margin-top: -80px;
        padding: 0;
        height: auto;
        text-align: center;
        align-items: center; 
    }
    .images-bx  .img-bx  .paragraphs-bx  p{
        font-size: 18px;
        width: 100%;
        margin-bottom: 30px;
        padding: 2px 0;
        text-align: center;
    }
    .images-bx  .img-bx  .paragraphs-bx  h1{
        font-size: 3rem;
        text-align: center;
        justify-content: center;
        align-items: center;
        padding: 0;
        margin: 0;
    }
    .images-bx  .img-bx  .paragraphs-bx a{
        margin-left: 0;
    }

}
/*ends*/




/*new bajaji*/

 
.Kiliride-flex-new {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: auto;
    width: 100%;
    padding: 20px 0;
    margin: 20px 0 ;
}

.container-fleet {
    position: relative;
    width: 80%;
    height: 500px;
    overflow: hidden;
    background: var(--box);
    padding: 10px;
}

.slider-wrapper-fleet {
    overflow: hidden;
    position: relative;
    height: 400px;
}

.slider-fleet {
    display: flex;
    transition: 0.3s ease;
}

.slide-fleet {
    min-width: 100%;
    height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: bold;
    background: #fff;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
}

.slide-fleet .kili-side{
    width: 40%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    padding: 10px;
}
.slide-fleet .kili-side:last-child{
    display: flex;
    justify-content: center;
    align-items: center;
}
.slide-fleet .kili-side h1{
    font-size: 1.5em;
    font-weight: 700;
    padding: 10px 0;
    text-align: start;
}
.slide-fleet .kili-side a{
    text-wrap: nowrap;
    font-size: 15px;
    color: #fff;
    text-decoration: none;
    display: flex;
    text-align: center;
    width: 100px !important;
}
.slide-fleet .kili-side p{
    line-height: 25px;
    font-size: .8em;
    margin-bottom: 10px;
}
.slide-fleet .kili-side img{
    object-fit: contain;
    width: 200px;
    height: 200px;
}
.Kiliride-flex-new .button-holder{
    position: absolute;
    bottom: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}
.Kiliride-flex-new button {
    background: var(--color);
    color: white;
    border: none;
    height: 50px;
    width: 50px;
    cursor: pointer;
    border-radius: 5px;
    font-size: 18px;
    margin: 0 5px;
    transition: .2s ease-in;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.Kiliride-flex-new #prev {
    left: 10px;
}

.Kiliride-flex-new #next {
    right: 10px;
}

.Kiliride-flex-new button:hover {
    background: #fff;
    color: #ED1C24;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
}

.Kiliride-flex-new .progress-container {
    width: 100%;
    height: 5px;
    background: #ddd;
    margin-top: 20px;
    border-radius: 5px;
    overflow: hidden;
}

.Kiliride-flex-new .progress-bar {
    height: 100%;
    width: 0;
    background: var(--color);
    transition: width 0.5s ease-in-out;
}
@media(min-width: 700px) and (max-width: 950px){
    .container-fleet {
        width: 100%;
    }
    .slide-fleet .kili-side h1{
        font-size: 2em;
    }
}
@media(max-width: 700px){
    .container-fleet {
        width: 100%;
        min-height: 650px;
        margin-bottom: 10px;
    }
    .slide-fleet .kili-side h1{
        font-size: 2em;
    }
    .slider-wrapper-fleet {
        height: auto;
    }
    .slide-fleet .kili-side{
        width: calc(100% - 20px);
        margin: 5px 0;
        align-items: center;
        height: auto;
    }
    .slide-fleet {
        flex-direction: column;
        height: auto;
    }
    .Kiliride-flex-new .button-holder{
        padding: 10px;
        z-index: 100;
        bottom: 0;
    }
    .slide-fleet .kili-side p{
        text-align: center;
    }
 
}
/*ends bajaji*/







.anchor-close{
    width: 100%;
    display: flex;
    justify-content: center;
    height: auto;
    background: #ED1C24;
    margin-bottom: 20px;
    overflow: hidden;
}
.anchor-close p{
    line-height: 25px;
    font-size: 1.2rem;
    color: #FFF;
    padding: 20px;
}
@media(max-width: 700px){
 
    .anchor-close p{
        font-size: 18px;
    }
}


.question-panel{
    width: 100%;
    display: inline-block;
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
    height: 200px;
}
.question-panel a{
    text-decoration: none;
    text-align: center;
}
.question-panel .quin-bck-ruun{
    width: 60%;
    height: 100%;
    margin-left: 20%;
    display: block;
    box-shadow: 0 0 10px 5px rgba(26, 25, 25, 0.13);

}
.question-panel .quin-bck-ruun h1{
    background: #fff;
    color: var(--black);
    padding: 50px 0;
    font-size: 20px;

}
.question-panel .quin-bck-ruun .icons{
    display: flex;
    text-wrap: nowrap;
     justify-content: center;
    align-items: center;
    text-align: center;
    background: #ED1C24;
    width: 100%;
    height: 32px;
    margin-top: -30px;
}
.question-panel .quin-bck-ruun .icons a{
    justify-content: center;
    height: 20px;
    font-weight: 700;
    padding: 10px 30px;
    color: #fff;
    text-decoration: none;
    text-align: center;
    border-radius: 30px;
}
.question-panel .quin-bck-ruun .icons .icon i{
    color: #fff;
    font-size: 20px;
    transform: translateY(80%);
} 
.panels{
    width: 100%;
    display: inline-block;
    margin-top: 10px;
    max-height: 250px;
    overflow: scroll;
}
.panels::-webkit-scrollbar{
    display: none;
}
.panels .panel-boxs::-webkit-scrollbar{
    display: none;
}
.panels .panel-boxs{
    width: 30%;
    padding: 15px 5px;
    margin-left: 35%;
    height: auto;
    border-radius: 0;
    background-color: #f8f8f8;
    display: block;
    margin-bottom: 10px;
    margin-right: 10px;
    text-align: start; 
    overflow: scroll;
    color: var(--black);
    justify-content: start;
    text-align: start;
    align-items: start;
    overflow: scroll;
}
@media(min-width: 710px) and (max-width: 1080px){
 
    .panels .panel-boxs{
        margin-left: 25%;
        width: 49%;
    }
}
.panels .panel-boxs::-webkit-scrollbar{
    display: none;
}
.panels .panel-boxs p{
    padding: 2px 20px;
    line-height: 28px;
    font-size: 15px;
}
.panels .panel-boxs h1{
    padding: 2px 20px;
    font-weight: 700;
    color: var(--black);
    font-size: 15px;
    border-bottom: 1px solid #b2b2b279;
}
.question-panel .panel-box:hover{
    transform: scale(1.05);
}
.question-panel .panel-box{
    width: 30%;
    height: 200px;
    border-radius: 30px;
    background-color: #f8f8f8;
    display: inline-block;
    margin-bottom: 10px;
    margin-right: 10px;
    text-align: start; 
    transition: ease-in .3s;
}
.question-panel .panel-box h1{
    text-align: start;
    font-size: 1.5rem;
    padding: 10px 20px;
    color: #2f313f;
}
.question-panel .panel-box .panel-image{
    width: 40%;
    height: 50%;
    margin-bottom: 0;
    float: right;
    align-items: right;
    text-align: right;
}
.question-panel .panel-box .panel-image img{
    width: 100px;
    height: 100%;
}
@media(max-width: 700px){
    .panels{
        display: block;
    }
    .question-panel .quin-bck-ruun{
        width: 90%;
        margin-left: 5%;
    }
    .panels .panel-boxs{
        display: block;
        width: 90%;
        margin-left: 4%;
    }
    .question-panel .quin-bck-ruun h1{
        font-size: 15px;
        font-weight: 500 !important;
        width: 90%;
        margin-left: 5%;
    }

    .question-panel{
        display: block;
    }
    .question-panel .panel-box{
        display: block;
        width: 90%;
        margin-left: 5%;
    }
}
.support_form{
    width: 100%;
    height: 600px;
    margin-top: 100px;
    background-image: linear-gradient(rgba(4,9,30,0.7), rgba(4,9,30,0.7)),url(images/2754828_businessman_jpeg6a36c81b6ede7638f4673b8048293986.jpeg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.support_form .rider_form{
    height: 90%;
    width: 100%;
}
.support_form .rider_form form{
    background: #fff;
    float: right;
    width: 400px;
    height: auto;
    margin-right: 50px;
    border-radius: 10px;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 5px rgba(0, 0, 45, 0.230);
    padding: 20px 0;
    text-align: center;
    display: block;
}
.support_form .rider_form form h1{
    font-size: 1rem;
    color: var(--black);
    font-weight: 700;
    padding: 20px 0;
}
.support_form .rider_form form .holder textarea{
    width: 85%;
    height: 100px;
    padding: 5px 10px;
    margin-left: 5%;
    border-radius: 10px;
    outline-color: #ED1C24;
    background-color: #f8f8f8;
    border: 1px solid #2b2b2b;
    resize: none;
}
.support_form .rider_form form .holder{
    width: 100%;
    display: block;
    margin-bottom: 10px;
    text-align: start;
    justify-content: start;
    align-items: start;
}
.support_form .rider_form form .holder label{
    padding: 0 20px;
    left: 0;
    text-align: start;
    align-items: start;
}
.support_form .rider_form form .holder input[type="submit"]{
    background: #ED1C24;
    color: #fff;
    height: 50px;
    width: 90%;
    font-weight: 700;
    font-size: 18px;
}
.support_form .rider_form form .holder input{
    width: 80%;
    height: 32px;
    padding: 5px 20px;
    margin-left: 5%;
    border-radius: 10px;
    outline-color: #ED1C24;
    background-color: #f8f8f8;
    border: none;
}
.support_form .rider_form form .holder select option{
    color: var(--black);
}
.support_form .rider_form form .holder select{
    width: 90%;
    margin-left: 5%;
    background: #f8f8f8;
    height: 40px;
    padding: 10px 0;
    border: none;
    outline-color: #ED1C24;
    color: #0000ff;
    font-size: 15px;
}
.support_form .rider_form form .mess-col{
    width: 90%;
    height: 32px;
    padding: 5px 0;
    margin-left: 5%;
    border-radius: 10px;;
    background-color: #f8f8f8;
    color: var(--black);
    display: none;
}
@media (max-width: 700px){
 
    .support_form .rider_form form{
        float: unset;
        width: 90%;
        margin-left: 5%;
    }
}
/*coming soon*/
.coming-soon-page{
    background: linear-gradient(to left, #f8f8f8, #ececec);
    width: 100%;
    height: 700px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}
.coming-soon-page .coming-soon-holder{
    width: 80%;
    margin-top: 100px;
    height: 400px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.coming-soon-page .coming-soon-holder .coming-sides{
    width: 50%;
    display: flex;
    flex-direction: column;
}
.coming-sides span{
    font-size: 1em;
    padding: 20px 0;
    font-weight: 600;
}
.coming-sides h1{
    font-size: 4em;
    font-family: 'gilroy-bold';
    color: var(--black);
}
.coming-sides .input-form{
    display: flex;
    padding: 10px 0;
    width: 100%;
}
.coming-sides .input-form .form-holder-flex{
    border-radius: 28px;
    width: 400px;
    height: 50px;
    border: 1px solid var(--color);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.coming-sides .input-form .form-holder-flex .email{
    width: 90%;
    padding: 10px 20px;
    background: transparent;
    border: none;
    outline: none;
}
.coming-sides .input-form .form-holder-flex .submit-{
    border-radius: 20px;
    padding: 5px 20px;
    height: 40px;
    background-color: var(--color);
    border: none;
    color: #fff;
    margin-right: 10px;
}
.coming-sides:last-child{
  width: 40% !important;
}
.coming-sides .image-holder{
    position: relative;
    float: right;
    width: 100%;
}
.coming-sides .image-holder img{
    width: 100%;
    border-radius: 12px;
    height: 300px;
    z-index: 1;
    object-fit: cover;
    position: relative;
}
.coming-sides .image-holder::before{
    position: absolute;
    content: '';
    width: 300px;
    height: 300px;
    background: var(--color);
    border-radius: 50%;
    top: 25%;
    transform: translateX(-25%);
}

.coming-soon-page .flex-links{
    display: flex;
    margin: 30px 0;
    width: 80%;
    justify-content: space-between;
}
.coming-soon-page .flex-links .link-tab-holder{
    display: flex;
}

.coming-soon-page .flex-links .link-tab-holder .social-icon-jump{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    border-radius: 5px;
    background-color: #fff;
    margin: 0 5px;
}
.coming-soon-page .flex-links .link-tab-holder .social-icon-jump a{
    color: #000;
    text-decoration: none;
}
.coming-soon-page .flex-links .link-tab-holder a{
    text-decoration: none;
    color: #000;
    margin: 0 5px;
    font-size: 1em;
    transition: .3s ease;
}
.coming-soon-page .flex-links .link-tab-holder a:nth-child(2){
    border-bottom: 1px solid var(--color);
}
@media(max-width: 950px){
    .coming-soon-page .flex-links .link-tab-holder{
        padding: 10px 0;
    }
    .coming-soon-page{
        height: auto;
    }
    .coming-soon-page .flex-links{
        width: 100%;
        padding: 10px 0;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .coming-sides:last-child{
        width: 100% !important;
    }
    .coming-sides .image-holder::before{
        display: none;
    }
    .coming-sides .image-holder::after{
        position: absolute;
        content: '';
        width: 300px;
        height: 300px;
        background: var(--color);
        border-radius: 50%;
        top: -30px;
        transform: translateX(-25%);
    }
    .coming-soon-page .coming-soon-holder{
        flex-direction: column;
        width: 90%; 
        height: auto;
        padding: 10px 0;
        margin-top: 150px;
    }
    .coming-soon-page .coming-soon-holder .coming-sides{
        width: 100%;
    }
    .coming-sides h1{
        font-size: 2em;
    }
    .coming-sides .input-form{
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .coming-sides .input-form .form-holder-flex{
        width: 100%;
    }
    .coming-sides .input-form .form-holder-flex .email{
        width: 100%;
    }
    .coming-soon-page .flex-links .link-tab-holder a{
        font-size: .8em;
    }
}





/*footer*/

.kiliride-footer{
    width: 100%;
    margin: 50px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 10px 0;
}

.kiliride-footer .kiliride-link-icon{
    display: flex;
    width: 80%;
    margin: 30px 0;
}
.kiliride-footer .kiliride-link-icon a{
    text-decoration: none;
    color: #000;
}
.kiliride-footer .kiliride-link-icon .link-icon-footer-{
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
    width: 40px;
    height: 40px;
    margin: 0 5px;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kiliride-footer .kiliride-link-icon .link-icon-footer i,svg{
    width: 15px;
    height: 15px;
    color: #000;
    font-size: 15px;
}
.kiliride-footer .footer-holder-flex{
    display: flex;
    justify-content: space-between;
    align-self: center;
    width: 80%;
}

.footer-items-column{
    width: 20%;
    height: auto;
    display: block;
}
.footer-items-column h1{
    font-weight: 600;
    padding: 10px 0;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 20px;
}
.footer-items-column .link-tag-flex{
    padding: 10px 0;
}
.footer-items-column .link-tag-flex a{
    text-decoration: none;
    color: #717680;
}
.kiliride-footer .kiliride-ending-tag{
    display: flex;
    width: 80%;
    justify-content: space-between;
    border-bottom: 1px solid #E9EAEB;
}
@media(min-width: 581px) and (max-width: 900px){
    .kiliride-footer .footer-holder-flex{
        flex-wrap: wrap;
        justify-content: left;
        width: 90%;
    }
    .footer-items-column{
        width: 30%;
        margin: 10px 5px;
    }
}
@media(max-width: 580px){
    .kiliride-footer .kiliride-link-icon{
        width: 90%;
    }
    .kiliride-footer .footer-holder-flex{
        flex-wrap: wrap;
        width: 90%;
    }
    .footer-items-column{
        width: 50%;
        margin: 10px 0;
    }
    .kiliride-footer .kiliride-ending-tag{
        width: 90%;
        flex-direction: column;
        justify-content: start;
    }
}
.kiliride-footer .kiliride-ending-tag .item-flex-lay{
    display: flex;
}
.kiliride-footer .kiliride-ending-tag .item-flex-lay a{
    text-decoration: none;
    color: #717680;
}
.kiliride-footer .kiliride-ending-tag .item-flex-lay .side-two{
    display: flex;
    margin: 0 5px;
}
.kiliride-footer .kiliride-ending-tag .item-flex-lay img{
    width: 130px;
    height: 70px;
    object-fit: contain;
}


/*policy*/
.Kiliride-policy-paragraph{
    width: 100%;
    display: flex;
    margin: 100px 0;
    justify-content: center;
    align-items: center;
}
.policy-paragraph-holder{
    width: 50%;
    max-width: 600px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.policy-paragraph-holder .upper-class{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px;
}
.policy-paragraph-holder .upper-class span{
    color: var(--color);
    font-size: 16px;
    margin: 20px 0 0;
    font-family: 'gilroy-bold';
}
.policy-paragraph-holder .upper-class h1{
    font-family: 'gilroy-bold';
    font-size: 45px;
    color: #181D27;
    margin: 20px 0;
    line-height: 54px;
} 
.policy-paragraph-holder .upper-class p{
    color: #535862;
    font-size: 20px;
    line-height: 26px;
    text-align: center;
    font-weight: 500;
}
.policy-paragraph-holder .content-class{
    padding: 20px 0;
    display: block;
}
.policy-paragraph-holder .content-class p{
    color: #535862;
    font-size: 18px;
    line-height: 25px;
    text-align: left;
    font-weight: 500;
    margin: 20px 0;
}
.policy-paragraph-holder .content-class h1{
    font-size: 30px;
    color: #181D27;
    margin: 20px 0;
    line-height: 34px;
     font-family: 'gilroy-bold';
} 
.policy-paragraph-holder .content-class ul{
    margin: 0 15px;
    width: calc(100% - 20px);
}
.policy-paragraph-holder .content-class ul li{
    font-family: 'gilroy-bold';
    font-size: 18px;
    line-height: 25px;
    font-weight: 400;
    color: #535862;
}
.policy-paragraph-holder .content-class ul li a{
    color: #535862;
    font-size: 18px;
    line-height: 25px;
    font-weight: 400;
}
@media(max-width: 580px){
    .policy-paragraph-holder{
        width: 90%;
    }
    .policy-paragraph-holder .content-class h1{
        font-size: 20px;
    }
}