@charset "utf-8";
/* CSS Document */

/******************************
[Table of Contents]
1. 1600px
2. 1440px
3. 1280px
4. 1199px
5. 1024px
6. 991px
7. 959px
8. 880px
9. 768px
10. 767px
11. 539px
12. 479px
13. 400px
******************************/

/************
1. 2498px
************/

@media only screen and (max-width: 2498px)
{
}

/************
1. 2391px
************/

@media only screen and (max-width: 2391px)
{
    .contact {
        background-position: center left;
    }
}

/************
1. 2245px
************/

@media only screen and (max-width: 2391px)
{
    .contact {
        background-position: center left -50px;
    }
}

/************
1. 2051px
************/

@media only screen and (max-width: 2051px)
{
    .contact {
        background-position: center left -100px;
    }
}

/************
1. 1991px
************/

@media only screen and (max-width: 1991px)
{
    .contact {
        background-position: center left -200px;
    }

    .modal-video .modal-content {
        width: 60%;
        height: 500px;
    }
}

/************
1. 1920px
************/

@media only screen and (max-width: 1920px)
{
    .page-inventory {
        background-size: auto;
    }
}

/************
1. 1691px
************/

@media only screen and (max-width: 1691px)
{
    .contact {
        background-position: center left -260px;
    }
}


/************
1. 1600px
************/

@media only screen and (max-width: 1600px)
{
    .contact {
        background-position: center left -300px;
    }
}

/************
2. 1500px
************/

@media only screen and (max-width: 1500px)
{
    .our-team .item-left,
    .our-team .item-right {
        display: none;
    }

    .page-financing {
        background-size: auto;
    }

    .page-houses {
        background-size: auto;
    }
}

/************
2. 1449px
************/

@media only screen and (max-width: 1449px)
{
    .modal-video .modal-content {
        width: 80%;
    }
}

/************
3. 1380px
************/

@media only screen and (max-width: 1380px)
{
}

/************
3. 1280px
************/

@media only screen and (max-width: 1280px)
{
    .contact {
        background-position: center left -500px;
    }
}

/************
4. 1199px
************/

@media only screen and (max-width: 1199px)
{
    .company-us .content-wrapper {
        padding: 0 2% 0 0 !important;
    }

    .company-us .right-element {
        width: 100%;
        max-width: 100%;
    }

    .main-banner .banner-infos .car-year,
    .main-banner .banner-infos .car-price {
        width: 100%;
        min-width: 100% !important;
    }

    .main-banner .banner .info {
        padding-top: 0;
    }

    .search-form .form-group {
        width: 230px;
    }

    .search-form .form-group input {
        width: 80%;
    }

    .quality-service .container div {
        max-width: 100% !important;
        flex: 100%;
    }

    .quality-service .certified div:first-child {
        max-width: 100px !important;
        margin-right: 30px;
    }
}

/************
4. 1100px
************/

@media only screen and (max-width: 1100px)
{

}

/************
5. 1024px
************/

@media only screen and (max-width: 1024px)
{
    .modal-video .modal-content {
        width: 95%;
    }
}

/************
6. 991px
************/

@media only screen and (max-width: 991px)
{
    .contact {
        background-position: center left -700px;
    }

    .copyright .social li a span {
        display: none;
    }

    .copyright .social li a i {
        font-size: 30px;
    }

    .copyright .social li {
        margin-right: 5px;
    }

    .main-banner .banner .info h1.title {
        font-size: 50px;
        line-height: 50px;
    }

    .main-banner #slideShow {
        max-width: 90%;
    }

    .smart-search-modal .smart-form {
        max-width: 90%;
    }
}

/************
7. 959px
************/

@media only screen and (max-width: 959px)
{

}

/************
8. 880px
************/

@media only screen and (max-width: 880px)
{
    .main-menu-desktop {
        display: none !important;
    }

    .search-desktop {
        display: none !important;
    }

    .mobile-search {
        display: block !important;
    }

    .mobile-menu {
        display: block !important;
    }

    .modal-video .modal-content {
        width: 100%;
        height: 450px;
    }
}

/************
8. 824px
************/

@media only screen and (max-width: 824px)
{
}

/************
9. 768px
************/

@media only screen and (max-width: 768px)
{
    .contact {
        background: none;
    }

    .company-us .content {
        padding: 20px 0;
    }

    .company-us .style-title h4 {
        font-size: 25px;
        line-height: 25px;
    }

    .ordering-filters .filter-label.expanded {
        color: #000 !important;
    }
}

/************
10. 767px
************/

@media only screen and (max-width: 767px)
{
    .stats .stats-box {
        width: 80% !important;
    }

    .main-banner .banner-infos .car-year,
    .main-banner .banner-infos .car-price {
        width: 40% !important;
        min-width: 40% !important;
    }

    .main-banner .banner-infos .description {
        border-radius: 0 0 5px 5px;
    }

    .page-inventory #filter-price-range {
        width: 96%;
        max-width: 96%;
    }

    .paginator {
        justify-content: center;
    }

    .banner-control-infos {
        bottom: -50px;
    }

    .search-form .form-group {
        width: 100%;
    }

    .search-form .form-group input {
        width: 80%;
    }

    .filter-results small {
        display: block;
        text-align: center;
        margin-top: 10px;
    }

    .filter-car {
        width: 50px;
        clip-path: none;
        position: absolute;
        top: -45px;
        right: 0;
        padding: 0;
        -webkit-transition: 1s;
        -moz-transition: 1s;
        -ms-transition: 1s;
        transition: 1s;
    }

    .filter-car.expanded {
        width: 100% !important;
        clip-path: polygon(30px 0,100% 0,calc(100%) 100%,0 100%) !important;
        padding: 18px 20px 20px 50px !important;
        position: relative !important;
    }

    .filter-car.expanded #filter-form {
        display: block;
    }

    .filter-car:hover {
        cursor: pointer;
        opacity: 0.7;
    }

    .filter-car.expanded:hover {
        cursor: auto;
        opacity: 1;
    }

    .filter-car.expanded .mobile-filter-form:hover {
        cursor: pointer;
        opacity: 0.7;
    }

    .filter-car .mobile-filter-form {
        display: block;
        text-align: center;
        width: 100%;
        padding: 15px;
    }

    .filter-car.expanded .mobile-filter-form {
        padding: 0;
    }

    .filter-car .mobile-filter-form i {
        font-size: 20px;
    }

    .filter-car #filter-form {
        display: none;
    }
}

/************
10. 626px
************/

@media only screen and (max-width: 626px)
{
    .gallery-no-photo {
        height: 300px;
    }
}

/************
11. 575px
************/

@media only screen and (max-width: 575px)
{
    .company-us .company-picture {
        display: none;
    }

    .company-us .right-element .right-container {
        background-position: center right;
    }

    .company-us .left-element {
        display: none;
    }

    .banner-control-infos {
        bottom: -20px;
    }

    .search-form {
        flex-direction: column !important;
    }

    .search-form form {
        width: 100%;
    }

    .search-form span {
        margin-bottom: 10px;
    }

    .search-form .form-group {
        margin-bottom: 0;
        display: flex;
        flex-direction: row;
    }

    .filter-results small {
        display: block;
        text-align: center;
    }
}

/************
11. 539px
************/

@media only screen and (max-width: 539px)
{
    .company-us .style-title h4 {
        font-size: 20px;
        line-height: 20px;
    }

    .main-banner .banner-infos .bigger {
        font-size: 25px;
    }

    .quality-service {
        display: flex;
        flex-direction: column !important;
    }

    .quality-service .certified div:first-child {
        max-width: 100% !important;
        margin: 0;
    }

}

/************
12. 480px
************/

@media only screen and (max-width: 480px)
{
}

/************
13. 479px
************/

@media only screen and (max-width: 479px)
{

}

/************
14. 427px
************/

@media only screen and (max-width: 427px)
{
    .car-box .infos .title {
        width: 45% !important;
    }

    .car-box .infos .title h4 {
        font-size: 20px;
    }
}

/************
14. 400px
************/

@media only screen and (max-width: 400px)
{

}

/************
15. 355px
************/

@media only screen and (max-width: 355px)
{
    .menu-mobile {
        clip-path: none;
        padding: 20px 15px;
    }

    .menu-mobile i {
        margin: 0;
        padding: 0;
    }

    .top-header-fixed .menu-mobile {
        padding: 20px;
    }

    .main-logo a img {
        width: 100px;
    }

    .car-box .infos .title {
        width: 40% !important;
    }

    .car-box .infos .info .bigger {
        font-size: 18px;
    }
}

/************
15. 345px
************/

@media only screen and (max-width: 355px)
{
    .style-title h4 {
        font-size: 30px;
        line-height: 30px;
    }
}