@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
html{font-family: "Roboto", sans-serif;}
body{margin: 0;padding: 0;box-sizing: border-box;scroll-behavior: smooth;background: #f5f6fa}
a{text-decoration: none;}
ul{list-style: none;padding: 0;margin: 0}
.flex{display: flex;justify-content: center}
.pixel{width: 1400px;}
.bg-white{background: white}
.bg-grey{background: #d5d5d5}
.bg-orange{background: #fda500}
.bg-blue{background: #0a58ca}
.text-white{color: white}
.text-black{color: black}
.text-13{font-size: 14px}
.text-16{font-size: 16px}
.text-17{font-size: 17px}
.text-18{font-size: 18px}
.p-50{padding: 40px 0 0 0}
nav{background: #005cad;border-bottom: 4px solid #fda500;position: fixed;top: 0;left: 0;width: 100%;z-index: 1000;}
.header{height: 110px}
.space{height: 110px}
.header-wrapper{display: flex;justify-content: space-between}
.page-wrapper{padding: 50px 0;color: #717d7b}

.header-logo{display: flex;align-items: center}
.header-logo img{width: 220px}

.header-list ul{align-items: center;height: 110px}
.header-list ul li{color: white;padding: 20px;font-size: 18px;font-weight: 300}

.yan-menu{align-items: center}
.yan-menu-buton i{color: white;background: #fda500;padding: 7px;font-size: 18px;border-radius: 5px;margin: 0 10px}
.yan-menu-buton span{color: white;font-size: 18px;font-weight: 300}


/*SLIDER*/

.slider{background: #005097;height: 70vh;width: 100%}
.slider-wrapper{align-items: center}
.slider-search{width: 75%}
.search-section{width: 50%;display: flex}
.search-section .section-1{width: 50%;padding: 12px;}
.search-section .section-1.bg-blue{margin: 0 3px}
.search-section .section-1 span{
    font-size: 13px;
    display: flex;
    justify-content: center;
    font-weight: 600;
    letter-spacing: -0.2px;
}
.search-area{width: 100%;margin: 3px 0;padding: 5px 0}
.search-area .adres{
    width: 25%;
    margin:5px 0px 5px 5px;
    height: 45px;
    padding: 10px;
    border: 1px solid #e8e6e6;
    border-radius: 5px;
    text-align: center;
    outline: none;
    font-size: 15px;
    color: #717d7b;
}
.search-area .form-control{
    width: 15%;
    margin: 5px;
    height: 25px;
    padding: 10px;
    border: 1px solid #e8e6e6;
    border-radius: 5px;
    text-align: center;
    font-size: 17px;
    color: #717d7b;
}
.search-area .form-control::placeholder{font-size: 15px;text-align: center}
.search-area .search-buton{width: 15%;margin: 5px 5px 5px 0px;cursor: pointer}
.search-area .search-buton button{width: 100%;border: none;height: 45px;font-size: 14px;background: #187d39;color: white;border-radius: 5px}


.search-area .form-control-2{
    width: 35%;
    margin: 5px;
    height: 25px;
    padding: 10px;
    border: 1px solid #e8e6e6;
    border-radius: 5px;
    text-align: center;
    font-size: 17px;
    color: #717d7b;
}
.search-area .form-control-2::placeholder{font-size: 15px;text-align: center}


.appointmend-section{width: 100%;display: flex;justify-content: space-between}
.appointmend-section .left-1{width: 50%}
.appointmend-section .right-1{width: 35%;display: flex;}
.appointmend-section .right-1 .section-2{
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 300;
}
.appointmend-section .right-1 .section-2.bg-grey{margin: 0 3px}
.appointmend-section .left-1 .section-2{padding: 10px;border-bottom-left-radius: 20px;display: flex;align-items: center}
.appointmend-section .left-1 .section-2 label{
    font-size: 14px;
    font-weight: 300;
    color: #161616;
    margin: 0 5px;
}
.appointmend-section .right-1 .section-2 span{padding: 10px 20px}

.move{margin-top: 80px}
.move img{width: 230px;margin-bottom: -12px;object-fit: cover; height: 72px;}
.move .car-hr{border-bottom: 2px dashed white;width: 100%;height: 0}

/*SLIDER*/

/*CATEGORY*/
.grup-list-wrapper{height: 150px;background: white;}
.grup-list-card{width: 300px;height: 120px;display: flex;justify-content:center; align-items: center; margin: 10px;background: #f5f6fa;padding: 5px}
.grup-list-card .card-image{width: 45%}
.grup-list-card .card-info{width: 55%;text-align: center}
.grup-list-card .card-image img{width: 100%}
.grup-list-card .card-info .card-category{padding: 5px;}
.grup-list-card .card-info .card-category span{padding: 3px 15px;border-radius: 10px;background: #0a58ca;color: white;font-size: 13px}
.grup-list-card .card-info .card-price span{color: #717d7b;font-size: 13px}
.grup-list-card .card-info .card-price span.price{color: #187d39;font-size: 20px;font-weight: 600}
/*CATEGORY*/

/*CAR-CARD*/

.car-container{display: flex;justify-content: space-between;margin-bottom: 20px}
.car-container .car-info{width: 74%;background: white}
.car-container .car-info .info-1{display: flex;justify-content: end;padding: 10px;align-items: center}
.car-container .car-info .info-1 span{color: #fff;font-size: 16px;margin: 0 20px}
.car-container .car-info .info-1 .card-category{background: #005cad;padding: 5px;}
.car-container .car-info .info-1 img{width: 150px;margin: 0 10px}
.car-container .car-info .info-2{display: flex;justify-content: space-between;padding: 10px 20px;align-items: center}
.car-container .car-info .info-2 .car-image{width: 33%;padding: 15px}
.car-container .car-info .info-2 .car-image img{width: 90%}
.car-container .car-info .info-2 .car-in-info{width: 65%}
.car-container .car-info .info-2 .car-in-info span{color: #717d7b;line-height: 1.5;font-size: 20px}
.car-container .car-price-info{width: 24%;background: white;margin-left: 5px}

.car-container .car-info .info-3{border-top: 7px solid #005cad;display: flex;justify-content: flex-start;}
.car-container .car-info .info-2 .car-marka{font-weight: 500;color: #717d7b;}
.car-container .car-info .info-3 .right-container{display: flex;justify-content: space-between; align-items: center;width: 100%;padding: 15px 35px}
.car-container .car-info .info-3 .right-container .car-icon{display: block;text-align: center}
.car-container .car-info .info-3 .right-container .car-icon img{width: 18px;filter: grayscale(1);}
.car-container .car-info .info-3 .right-container .car-icon span{font-size: 16px;color: #939393;margin: 0 10px;font-weight: 400}
.car-buton{color: white}

.car-container .car-price-info .info-1{display: flex;justify-content: center;align-items: center;height: 79%}
.car-container .car-price-info .info-1 h1{color: #137935;margin: 0;font-size: 35px}
.car-container .car-price-info .info-1 span{color: #717d7b;margin: 0;font-size: 18px}
.car-container .car-price-info .info-2{display: flex;justify-content: center;align-items: center;border-top: 7px solid #005cad;height: 19.5%;background: #ffa600}
.car-container .car-price-info .info-2 a{color: white;font-size: 20px}
/*CAR-CARD*/

/*REFERANCE*/

.company-list-wrapper{background: white;height: 150px}
.company-list-card{width: 150px;height: 150px;object-fit: cover; display: flex;justify-content:center; align-items: center;background: #f5f6fa;padding: 5px}
.company-list-card .card-image{width: 90%}
.company-list-card .card-image img{width: 100%}

/*REFERANCE*/

/*CULTURE*/

.culture-line{position: relative;}
.culture-line hr{border-top: 7px solid #005cad;}
.culture-line .culture-title{
    font-size: 25px;
    color: white;
    position: absolute;
    right: 90px;
    top: -20px;
    text-align: end;
}
.culture-line .culture-title h1{
    width: auto;
    text-align: center;
    margin: 0;
    position: absolute;
    right: 0;
    color: white;
    background: #0c508a;
    border-radius: 10px;
    padding: 5px 20px;
    font-size: 25px;
    font-weight: 300;
    border: 4px solid #f5f6fa;
}

/*CULTURE*/


/*CITY*/

.city-wrapper{margin: 100px 0}
.city-card{width: 300px;margin: 10px;height: 400px}
.city-card .city-image{width: 300px}
.city-card .city-image img{width: 300px;border-radius: 20px}
.city-card .city-title{border-radius: 20px;padding: 10px;margin: 5px 0}
.city-card .city-title h1{color: #0a58ca;font-size: 22px;font-weight: 900;margin: 10px 0 0 0 }
.city-card .city-title h2{color: #717d7b;font-size: 20px;font-weight: 300;margin: 0 0 10px 0;}

/*CITY*/

/*FOOTER*/

footer{margin: 50px 0;background: #f5f6fa;z-index: 1000;position: relative}
.footer-title{margin: 30px 0}
.footer-title h1{font-size: 27px;font-weight: 600;}
.footer-col{display: flex;justify-content: space-between;flex-wrap: wrap;margin: 80px 0}
.footer-col li{font-size: 20px;font-weight: 300;color: #717d7b;line-height: 1.8;}
.footer-bottom{background: #f1f1f1;}

.bottom-col{display: flex;justify-content: space-between;}
.bottom-col .social-icon{display: flex;align-items: center}
.bottom-col .social-icon i{font-size: 25px;margin: 10px;color: #005cad;}
.bottom-col .bottom-info{display: flex;align-items: center;justify-content: center}
.bottom-col .bottom-info .hr{width: 0;height: 15px; border-right: 2px solid #717d7b;margin: 10px}
.bottom-col .bottom-info h4{color: black;font-size: 16px;font-weight: 300}

/*FOOTER*/

.bottom-nav{display: none}
.single-wp{
    left: -100px;
    opacity: 0;
    visibility: hidden;
    position: fixed;
    bottom: 70px;
    width: 55px;
    height: 55px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: #fda500;
    z-index: 1000;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 50px;
    transition: 1s ease-in-out;
}
.single-wp.active{
    left: 5px;
    opacity: 1;
    visibility: initial;
    transition: 1s ease-in-out;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
}
.single-wp i{color: white;font-size: 20px;}
.single-wp{display: none}

/*LİST*/

.list-form{background: #ffa600;border-bottom: 5px solid #005cad;}
.list-title-wrapper h1{font-size: 18px;font-weight: 400;color: #717d7b}
.list-title-wrapper h1 a{font-size: 18px;font-weight: 400;color: #717d7b}
.list-kampanya{background: #005cad;padding: 10px;height: 60px;display: flex;align-items: center;border-radius: 20px}
.list-kampanya h2{font-size: 18px;color: white;font-weight: 300}
.list-car-wrapper{display: flex;justify-content: space-between;margin: 20px 0}
.list-car-col1{width: 350px}
.list-car-col2{width: 1100px}
.list-filter{background: white;position: fixed;width: 325px;border-radius: 20px;transition: transform 0.3s ease-out;}
.list-filter.stop {position: absolute;bottom: -210px;}
.list-filter-head{background: #ffa600;position: relative;height: 60px;border-top-right-radius: 20px;border-top-left-radius: 20px;display: flex;align-items: center;padding: 0 30px;color: white;justify-content: center}
.list-filter-head h1{margin: 0;font-size: 18px;font-weight: 500}
.filter-card{display: flex;align-items: center;padding: 0 30px;justify-content: space-between;border-top: 1px solid #e1e1e1;flex-wrap: wrap;cursor: pointer}
.filter-card h1{font-size: 18px;color: #717d7b;font-weight: 500;width: 85%}
.filter-card i{font-size: 22px;color: #717d7b;}
.filter-content {
    display: none;
    padding: 10px 0;
    background: #f9f9f9;
    border-radius: 10px;
    max-height: 200px; /* Maksimum yükseklik */
    overflow-y: auto; /* İçerik fazla olursa dikey kaydırma */
    width: 100%;
    cursor: pointer;
    margin: 10px 0;
}
.filter-content label {display: block;padding: 5px 0;cursor: pointer;}
/*LİST*/


/*SINGLE*/

.stage{margin: 50px 0}
.stage-wrapper{display: flex;align-items: center;justify-content: space-between}
.stage-icon{width: 50px;height: 50px;background: #717d7b;border-radius: 50%;display: flex;justify-content: center;align-items: center;}
.stage-icon i{color: white;font-size: 20px}
.stage-icon h2{color: white;font-size: 20px;font-weight: 400}
.stage-hr{height: 0;width: 200px;border-bottom: 2px solid #717d7b;}
.stage-card{display: flex;align-items: center;flex-wrap: wrap}
.stage-title h1{margin: 0 10px;padding: 0;font-size: 16px;color: #717d7b;font-weight: 400}
.conditions .conditions-info h1{margin: 0;font-size: 15px;text-align: center;font-weight: 400;color: #717d7b;}
.conditions .conditions-info h1 a{text-decoration: underline;color: #131717}
.conditions-danger{display: flex;margin: 10px;background: #f7f4ec;border: 1px solid #f2d293;border-radius: 10px;padding: 10px;}
.conditions-danger span{color: #717d7b; margin-left: 5px}
.conditions-danger i{margin: 5px 0;}

.condition-card{
    display: none;
    position: fixed;
    z-index: 10000;
    width: 100%;
    left: 0;
    top: 0;
    justify-content: center;
    align-items: center;
    height: 100%;
    background: #00000024;
}
.condition-card.active{display: flex;}
.condition-container{width: 500px;background: white;height: 70%;border-radius: 20px;overflow-y: scroll;}
.condition-title{display: flex;justify-content: space-between;align-items: center;padding: 5px 20px;border-bottom: 1px solid;}
.condition-title h1{font-size: 22px;font-weight: 400;}
.condition-container i{font-size: 20px;}
.condition-ul{padding: 10px 20px}
.condition-ul li{display: block;padding: 10px 0;}
.condition-in-title{width: 100%;display: flex;justify-content: space-between;align-items: center;cursor: pointer}
.condition-in-title h1{font-size: 16px;color: #7b7b7b;font-weight: 500}
.condition-in-title i{color: #7b7b7b}
.condition-ul li p {max-height: 0;overflow: hidden;transition: max-height 0.4s ease, padding 0.4s ease;padding: 0 15px;margin: 0;color: #7b7b7b;font-weight: 400;line-height: 1.3;}
.condition-ul li.active p {    max-height: 1000px;padding: 10px 15px;color: #7b7b7b;font-weight: 400;line-height: 1.3;}

.segment-grup{width: 74%;margin: 20px 0;border-top: 2px solid #717d7b;}
.segment-title{padding: 20px 10px}
.segment-grup .grup-list-wrapper{padding: 20px 10px;background: transparent}
.segment-grup .grup-list-card{background: white;flex-wrap: wrap;height: 150px}
.segment-title h1{font-size: 22px;color: #4b4b4b;font-weight: 400;}
.segment-title p{font-size: 15px;color: #717d7b}
.up{width: 100%;display: flex;justify-content: center;height: 40px;margin: 10px 0 0 0;}
.up-buton{width: 90%;text-align: center;background: #0087ff;height: 100%;border-radius: 5px}
.up-buton a{color: white;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center}
.ek-wrapper{width: 74%}
.ek-card{padding: 20px;box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;border-radius: 5px;margin: 0 0 20px 0;background: #fdfdff;}
.ek-title h1{font-size: 22px;font-weight: 400;color: #4f5455}
.ek-info p{font-size: 16px;font-weight: 400;color: #717d7b}
.ek-card .container{display: flex;justify-content: right;align-items: center}
.ek-card .button{
    background-color: #d2d2d2;
    width: 80px;
    height: 40px;
    border-radius: 200px;
    cursor: pointer;
    transition: 0.2s;
}
.ek-card .button::before{
    position: absolute;
    content: '';
    background-color: white;
    width: 30px;
    height: 30px;
    border-radius: 200px;
    margin: 5px;
    transition: 0.2s;
}
.ek-card input:checked + .button{background-color: #ffa600}
.ek-card input:checked + .button::before{transform: translateX(40px)}
.ek-card input{display: none}
.ek-card .price{font-size: 20px;margin: 0 20px;font-weight: 500}
.next-button{margin: 50px 0 200px 0}
.next-info{display: flex;align-items: center;justify-content: right}
.next-price{margin: 20px}
.next-price span{font-weight: 300}
.next-price h1{font-size: 25px;margin: 5px 0}
.button-next button{
    background: #ffa600;
    border: none;
    padding: 20px 40px;
    border-radius: 5px;
    color: white;
    font-size: 18px;
}
/*SINGLE*/

.list-filter-head i{display: none}

/*SSS*/


.sss{display: flex;justify-content: center;align-items: center;margin-top: 0;padding: 25px 0;}
.sorular{display: flex;justify-content: start;}
.accordian{width: 100%;display: block;}
.accordian .card{
    margin-bottom: 20px;
    width: 100%;
    border-top: 2px solid #EBECEC;
    cursor: pointer;
    position: relative;
    bottom: 0;
    opacity: 1;
    animation: up 1s ease-in-out;
}
.accordian .card .card-header h3{
    color: #898989;
    position: relative;
    font-weight: 200;
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-size: 18px;
    padding: 15px  0;
}
.accordian .card .card-header .fa{
    position: absolute;
    right: 20px;
    top: 30px;
    height: 25px;
    width: 25px;
    cursor: pointer;
    color: #898989;
    background-color: transparent;
    text-align: center;
    line-height: 25px;
    font-size: 20px;
    border-radius: 40px;
}
.accordian .card .card-header{position: relative;padding: 20px 0;}
.accordian .card .card-body{padding: 20px;}
.accordian .card .card-body{display: none;}
.accordian .card .card-body p{font-size: 18px;font-family: 'Poppins', sans-serif;line-height: 24px;color: #898989;margin: 0;}

#session{
    position: fixed;
    background: #3d3d3d;
    padding: 20px 30px;
    bottom: 0;
    left: 0;
    width: 100%;
    display: none;
    align-items: center;
    opacity: 0.9;
    animation: session 4s ease-in;
    z-index: 10000;
}
@keyframes session {
    0%{
        bottom: -250px;
        opacity: 0;
    }
    80%{
        bottom: -250px;
        opacity: 0;
    }
    100%{
        bottom: 0;
        opacity: 0.9;
    }
}
.session-container{width: 66%;}
.session-container h1{margin: 7px 0;padding: 0;font-size: 18px;color: white;font-weight: 500;}
.session-container span{
    margin: 0;
    padding: 0;
    font-size: 16px;
    color: white;
    font-weight: 300;
    line-height: 1.4;
}
.session .session-btn{
    background: #fda500;
    padding: 8px;
    color: #3d3d3d;
    font-size: 17px;
    margin: 0 10px;
    cursor: pointer;
}
.session .gizli{
    color: #1FBFD1;
    font-size: 17px;
    display: flex;
    align-items: center;
}
.session-link{
    position: absolute;
    right: 100px;
}

@media (max-width: 1080px) {

    .pc{display: none !important;}
    .list-car-col1{position: fixed;bottom: 0;height: 45px;left: 24%;width: 450px;z-index: 100}
    .list-filter{width: 450px;position: relative;transition: transform 0.3s ease-out;box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;}
    .list-filter-head{position: relative;height: 60px;z-index: 1;border-top-right-radius: 0;border-top-left-radius: 0;border-top: 2px solid #005cad;}
    .list-filter-container{max-height: 0;overflow: hidden;transition: max-height 0.3s ease-in-out;transform: translateY(-110%);background: white;border-top-right-radius: 20px;border-top-left-radius: 20px;}
    .list-filter-head{height: 45px;display: flex;justify-content: space-between}
    .list-filter-head i{font-size: 18px;color: white;display: initial}

    .pixel{width: 95%}
    .header{height: 100px;}
    .space{height: 100px}
    .header-list ul li{padding: 20px 10px;font-size: 12px}
    .header-logo img{width: 150px}
    .yan-menu-buton i{margin: 0 2px;font-size: 12px}
    .yan-menu-buton span{font-size: 12px}
    .yan-menu-buton i{font-size: 15px}
    .header-logo img{width: 175px}
    .slider-search{width: 95%}
    .search-section{width: 65%}
    .search-area .adres{font-size: 12px}
    .search-area .form-control::placeholder{font-size: 12px;}
    .search-area .form-control{font-size: 12px}
    .search-area .search-buton button{font-size: 12px}
    .search-section .section-1 span{font-size: 12px;font-weight: 400}
    .text-13{font-size: 12px}
    .appointmend-section .left-1{width: 40%}
    .appointmend-section .right-1{width: 50%}


    .car-card-wrapper{display: flex;flex-wrap: wrap;justify-content: space-between;overflow-x: hidden}
    .car-container{width: 49%;flex-wrap: wrap;margin-bottom: 35px}
    .car-container .car-info{width: 100%}
    .car-container .car-info .info-1 img{width: 100px}
    .car-container .car-info .info-1 span{font-size: 15px}
    .car-container .car-info .info-2{align-items: center;flex-wrap: wrap}
    .car-container .car-info .info-2 .car-image{width: 100%}
    .car-container .car-info .info-2 .car-in-info{width: 100%}
    .car-container .car-info .info-2 .car-in-info span{font-size: 15px}
    .car-container .car-info .info-3{border-top: 2px solid #005cad;justify-content: space-between}
    .car-container .car-info .info-3 .right-container{width: 100%;margin: 0;padding: 10px 35px}
    .car-container .car-info .info-3 .right-container .car-icon img{width: 12px}
    .car-container .car-info .info-3 .right-container .car-icon span{font-size: 12px; margin: 0 5px;}
    .car-container .car-price-info{margin-left: 0;border-top: 2px solid #005cad;width: 100%}
    .car-container .car-price-info .info-1{height: 75%}
    .car-container .car-price-info .info-1 span{font-size: 12px;margin: 0}
    .car-container .car-price-info .info-1 h1{font-size: 25px}
    .car-container .car-price-info .info-2{height: 60%;border-top: 1px solid #005cad;}
    .car-container .car-price-info .info-2 a{font-size: 18px}

    footer{z-index: 0}
    .footer-col ul{margin: 0 30px 30px 0;width: 45%}
    .bottom-col{flex-wrap: wrap;justify-content: center}
    .bottom-col .social-icon{margin: 20px 0}
    .bottom-col .bottom-info{width: 100%}

}

@media (max-width: 500px) {
    .footer-col ul{width: 95%}
    #session{
        padding: 20px 10px;
        flex-wrap: wrap;
        bottom: 47px;
    }
    .session-container{
        width: 90%;
    }
    .session-link{
        width: 100%;
        margin: 10px 0;
        position: relative;
        right: 10px;
    }
    .condition-container{width: 95%;}
    .pc-2{display: none !important;}
    .footer-bottom{margin-bottom: 50px}
    .header-list{display: none}
    .single-wp{display: flex}
    .bottom-nav{display: initial;position: fixed;bottom: 0;left: 0;width: 100%;z-index: 1000}
    .bot-nav{list-style: none;margin: 0;padding: 0;width: 100%;display: flex}
    .bot-nav li{background: #005097;padding: 5px 0;width: calc(100% / 5);}
    .bot-nav li img{filter: invert(84%) sepia(104%) saturate(4) hue-rotate(-46deg) brightness(147%) contrast(374%);width: 22px;height: 25px;object-fit: contain}
    .bot-nav li a{color: white;display: flex;flex-wrap: wrap;justify-content: center;align-items: center}
    .bot-nav li span{font-size: .7rem;width: 100%;text-align: center}

    .car-container .car-info .info-2 .car-image{padding: 0}
    .car-container .car-info .info-2 .car-image img{width: 100%}

    .car-container .car-info .info-1 .card-category{display: flex;padding: 5px 0}
    .car-container .car-info .info-1 span{margin: 0 10px}
    .car-container .car-info .info-3 .right-container .car-icon{margin: 0 8px}
    .car-container .car-info .info-3 .right-container{width: 100%;margin: 0}
    .car-container .car-price-info .info-2{height: 50%}

    .list-filter-head{height: 45px;display: flex;justify-content: space-between}
    .list-filter-head i{font-size: 18px;color: white;display: initial}
    .list-filter{width: 100%;height: 45px}
    .list-car-col1{width: 100%;left: 0;bottom: 35px;height: 60px}
    .list-filter-container{transform: translateY(-110%);height: 60vh;box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;}
    .list-kampanya{margin-top: 15px}
    .filter-card{padding: 5px 40px}
    .filter-card h1{font-size: 14px}
    .filter-card i{font-size: 18px}
    .filter-content label{font-size: 14px}
    .list-filter-head h1{font-size: 16px}
    .list-title-wrapper h1{margin: 20px 0 0 0}
    .list-form-container{height: 75px}


    .header{height: 90px}
    .header-logo{margin-left: 5px}
    .space{height: 90px}
    .yan-menu-buton i{font-size: 12px;margin: 0 2px;}
    .yan-menu-buton span{font-size: 12px}
    .yan-menu{margin-right: 5px}
    .header-logo img{width: 150px}

    .slider{height: 500px}
    .search-section{width: 100%}
    .slider-search{width: 98%}
    .search-area .adres{width: 90%;margin: 5px}
    .appointmend-section .left-1 .section-2 label{font-size: 12px}
    .search-area{flex-wrap: wrap}
    .search-area .form-control{width: 37%}
    .search-area .form-control-2{width: 100%}
    .search-area .search-buton{width: 90%;margin: 5px}
    .appointmend-section{flex-wrap: wrap}
    .appointmend-section .left-1{width: 100%}
    .appointmend-section .left-1 .section-2{border-bottom-left-radius:0;background: #ffffff;padding: 10px 20px}
    .appointmend-section .right-1{width: 100%}
    .appointmend-section .right-1 .section-2.bg-grey{margin: 0;height: 40px;border-bottom-left-radius:20px}
    .search-section .section-1.bg-blue{margin: 0;border-top-right-radius: 20px}
    .search-section .section-1 span{font-weight: 300}
    .search-area .adres{height: 40px}
    .search-area .form-control{height: 18px}

    .move{margin-top: 25px}
    .move img{width: 150px}

    .car-container .car-price-info .info-1{margin: 5px 0;justify-content: center;padding: 0 15px}
    .car-container .car-info .info-2{padding: 10px 15px}
    .car-container .car-info .info-2 .car-in-info span{font-size: 14px}
    .car-container .car-info .info-3{justify-content: center;flex-wrap: wrap}
    .car-buton{font-size: 12px}
    .car-container .car-price-info .info-1 h1{font-size: 18px}
    .car-container .car-info .info-1 img{width: 60px}
    .car-container .car-info .info-1 span{font-size: 12px}
    .search-area .search-buton button{height: 40px}

    .grup-list-card{width: 100%}
    .grup-list-wrapper a{width: 65%;margin: 0 10px}
    .grup-list-wrapper{height: 125px}
    .grup-list-card .card-info .card-category span{font-size: 12px}
    .grup-list-card .card-info .card-price span.price{font-size: 15px}
    .grup-list-card .card-info .card-price span{font-size: 12px}
    .grup-list-card .card-image img{width: 95%}
    .grup-list-card{height: 95px}

    .company-list-card{width: 100px;height: 100px}
    .company-list-wrapper{height: 100px}

    .culture-line .culture-title h1{font-size: 20px}
    .city-wrapper{margin: 50px 0}
    .city-card .city-title h1{font-size: 18px}
    .city-card .city-title h2{font-size: 15px}


    footer{margin: 20px 0}
    .footer-title{margin: 0}
    .footer-title h1{font-size: 20px}
    .footer-col li{font-size: 17px}
    .footer-col{margin: 40px 0}
    .bottom-col .bottom-info{flex-wrap: wrap}
    .bottom-col .bottom-info h4{font-size: 12px}

    .search-area .search-buton{margin: 2px 5px}
    .search-area .form-control{margin: 2px 5px}
    .search-area .adres{margin: 2px 5px}


}
