/* ------------------------------------------  
    MOBILE LAYOUT GRID SYSTEM
------------------------------------------ */
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12,
.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, 
.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12,
.col-lg-1, .col-lg-2, .col-lg-3,  .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12,
.col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 
{
    width: 100%;
    float: left;
    padding: 2% 0;
    /* border: 1px solid green; */
}

/* Width of images within columns by default */
.col-xs-1 img, .col-xs-2 img, .col-xs-3 img, .col-xs-4 img, .col-xs-5 img, .col-xs-6 img, .col-xs-7 img, .col-xs-8 img, .col-xs-9 img, .col-xs-10 img, .col-xs-11 img, .col-xs-12 img,
.col-sm-1 img, .col-sm-2 img, .col-sm-3 img, .col-sm-4 img, .col-sm-5 img, .col-sm-6 img, .col-sm-7 img, .col-sm-8 img, .col-sm-9 img, .col-sm-10 img, .col-sm-11 img, .col-sm-12 img,
.col-md-1 img, .col-md-2 img, .col-md-3 img, .col-md-4 img, .col-md-5 img, .col-md-6 img, .col-md-7 img, .col-md-8 img, .col-md-9 img, .col-md-10 img, .col-md-11 img, .col-md-12 img,
.col-lg-1 img, .col-lg-2 img, .col-lg-3 img, .col-lg-4 img, .col-lg-5 img, .col-lg-6 img, .col-lg-7 img, .col-lg-8 img, .col-lg-9 img, .col-lg-10 img, .col-lg-11 img, .col-lg-12 img,
.col-xl-1 img, .col-xl-2 img, .col-xl-3 img, .col-xl-4 img, .col-xl-5 img, .col-xl-6 img, .col-xl-7 img, .col-xl-8 img, .col-xl-9 img, .col-xl-10 img, .col-xl-11 img, .col-xl-12 img 
{
    width: 100%;
}

@import url('https://fonts.googleapis.com/css?family=Lato|Montserrat');

/* Define System Colors */
:root 
{
	--primaryColor:#008ac9;  
    --secondaryColor: ;
    --success: #339837;
    --danger: #dc3545;
    --textColor: #606060;
    --bgNavBar: #2a3f54;
    --linksHover: #008ac9;
}

* 
{
    box-sizing: border-box;
}

html, body 
{
	height: 100%;
    margin: 0;
    background-color: #FFF;
}

html, body, form 
{
    font-family: 'Varela Round', sans-serif;
    color: var(--textColor);
    font-size: 13px;
    margin: 0;
    padding: 0;
}

/* ------------------------------------------  
    TIPOGRAPHY  
------------------------------------------ */
h1, h2, h3, h4, h5, h6 
{
	font-family: 'Montserrat', sans-serif;
	margin: 0;
    padding: 0;
}

h1 
{ 
	font-size: 28px;
    color: var(--primaryColor);
    text-align: center;
}

h2 
{ 
	font-size: 22px;
    color: var(--secondaryColor);
}

h4 
{ 
	font-size: 16px;
    color: var(--blue);
}

p 
{
    text-align: justify;
    line-height: 20px;
}


.text-primary
{
    color: var(--primaryColor);
}

.text-secondary
{
    color: var(--secondaryColor);
}

a:active, a:visited, a:link, a:hover 
{
    text-decoration: none;
    color: var(--textColor);
}

a:hover
{
    color: var(--linksHover);
}

/* ------------------------------------------  
    CSS 
------------------------------------------ */
.text-center
{
    text-align: center !important;
}

.text-left
{
    text-align: left !important;
}

.text-right
{
    text-align: right !important;
}


/* ------------------------------------------  
    CONTAINER 
------------------------------------------ */
.container 
{
    width: 96%;
    margin: 4% 2%;
    float: left;
    padding: 2%;
    /* border: 1px solid red; */
}

/* Row with columns */
.cols-row 
{
    float: left;
    width: 100%;
    margin: 0;    
    padding: 2%;
    /* border: 1px solid green; */
}


/* ---------------------------------------------------------- */
/* ----------------- MAIN MOBILE NAVBAR --------------------- */
/* ---------------------------------------------------------- */

.main-navbar, .main-navbar-empty-space
{
    height: 80px; 
}

.main-navbar
{
    width: 100%;                                  
    position: fixed;
    background-color: #FFF;
    top: 0;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    z-index: 99;
}

/* DIV to occupies the space below the fixed navbar */
.main-navbar-empty-space
{
    background-color: transparent; 
    top: 0;
}

/* Navbar Desktop and Mobile :: Website Logo */
.main-navbar-brand-logo
{
    max-height: 70px;
    margin: 5px 0 5px 10px;
    float: left;
}

/* Navbar Desktop :: Menu Container */
.main-navbar-desktop
{
    display: none;
}

/* Navbar Mobile :: Menu Container */
.main-navbar-mobile-button
{
    float: right;
    margin: 20px 20px 0 0;
    cursor: pointer;
}

/* Navbar Mobile :: Bars of Mobile Menu */
.mobile-button-bar1, .mobile-button-bar2, .mobile-button-bar3
{
    width: 35px;
    height: 2px;
    background-color: var(--primaryColor); /* Color of mobile menu bars */
    margin: 9px 0;
    transition: 0.4s;
}

/* Navbar Mobile :: Menu bars animation after touch */
#main-navbar.open-mobile-navbar .mobile-button-bar1
{
    transform: translateY(8px) rotate(-135deg);
    -webkit-transform: translateY(8px) rotate(-135deg);
    -ms-transform: translateY(8px) rotate(-135deg);    
}

#main-navbar.open-mobile-navbar .mobile-button-bar2
{
    display: none;
}

#main-navbar.open-mobile-navbar .mobile-button-bar3
{
    transform: translateY(-2px) rotate(135deg);
    -webkit-transform: translateY(-2px) rotate(135deg);
    -ms-transform: translateY(-2px) rotate(135deg);    
}


/* Navbar Mobile :: Top Bar -> Initial state (closed) */
.main-navbar-mobile
{
    height: 0;
    width: 100%;
    position: fixed;
    z-index: 1;
    top: 80px;
    transition: .8s;
}

/* Navbar Mobile :: Top Bar -> state after press menu button (opened) */
#main-navbar.open-mobile-navbar .main-navbar-mobile
{
    height:auto;
    width: 100%;
    position: fixed;
    z-index: 90 !important;
    top: 80px;
    background-color: #FFF;
    overflow-x: hidden;
    transition: .8s;
}

/* Navbar Mobile :: Menu Sidebar -> Website Main Links */
.main-navbar-mobile a
{
    display: none;
}

#main-navbar.open-mobile-navbar .main-navbar-mobile a
{
    padding: 15px 0;
    text-align: center;
    text-decoration: none;
    font-size: 1em;
    color: var(--primaryColor);
    display: block;
    border: 1px solid #dbdbdb;
    z-index: 90 !important;
}

/* Navbar Mobile :: Menu Sidebar -> Website Main Links Hover */
#main-navbar.open-mobile-navbar .main-navbar-mobile a:hover
{
    color: #fff;
}

/* ---------- Mobile Dropdown Menu ---------- */ 
.main-navbar-mobile-dropdown-button
{
    cursor: pointer;
}

.main-navbar-mobile-dropdown-content
{
    display: none;
    background-color: #690d19;
    width: 100%;
}

.show-main-navbar-mobile-dropdown-content
{
    display: block;
}
  
.main-navbar-mobile-dropdown-content a
{
    color: #fff;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}
  
.main-navbar-mobile-dropdown a:hover
{
    background-color: #690d19;
    cursor: pointer;
    color: #fff;
}

.main-navbar-mobile-dropdown i
{
    color: #fff;
    font-size: 1.0em;
}

/* ---------------------------------------------------------- */
/* ---------------------- SEARCH ---------------------------- */
/* ---------------------------------------------------------- */
/* .search-button
{
    background: transparent;
    float: right;
    border: none;
    margin: 28px 20px 0 0;
    cursor: pointer;
}

.search-button img 
{
    width: 25px;
    height: auto;
}
  
.search-overlay 
{
    height: 100%;
    width: 100%;
    display: none;
    position: fixed;
    z-index: 99 !important;
    top: 0;
    left: 0;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0, 0.9);
}
  
.search-overlay-content 
{
    position: relative;
    top: 20%;
    width: 80%;
    text-align: center;
    margin: auto;
}

.search-overlay-content p 
{
    font-size: 2em;
    color: #ab192d;
    margin-bottom: 15px;
    text-align: center;
}
  
.search-overlay .search-close-button 
{
    position: absolute;
    top: 20px;
    right: 45px;
    font-size: 60px;
    cursor: pointer;
    color: white;
}
  
.search-overlay .search-close-button:hover 
{
    color: #ccc;
}

.search-overlay input[type=text] 
{
    padding: 10px 0;
    font-size: 17px;
    border: none;
    width: 100%;
    background: white;
}
  
.search-overlay input[type=text]:hover 
{
    background: #f1f1f1;
}

.search-overlay button 
{
    display: none;
}
  
/* ---------- Results Page ---------- */
/* .search-results-found-title 
{
    font-size: 1.1em;
    color: #0a59a4;
    text-align: center;
    margin: 0 0 20px 0;
    font-weight: 700;
}

.search-user-terms, .search-number-results-found
{
    color: #f24694;
}

.search-results-title
{
    font-size: 1.1em;
    color: #ab192d;
    text-align: left;
    margin-bottom: 10px;
    font-weight: 700; 
}

.search-results-items a
{
    font-size: 1em;
    margin-bottom: 15px;
}

.search-results-items a:hover
{
    color:#f24694;
} */ 

/* ---------------------------------------------------------- */
/* ---------------- ELEMENT AT TOP PAGE --------------------- */
/* ----------------- (IMAGE, MAP, ETC.) --------------------- */
/* -------------- CONTAINER AND PAGE TITLE ------------------ */
/* ---------------------------------------------------------- */

/* --- Element Top Page  --- */
.element-top-page, .element-top-page img {
    width: 100%;
}

.element-top-page iframe{
    width: 100%;
    height: 400px;
}

/* --- Image Resizable  (With or without text over Image) --- */
.image-resizable img, .image-resizable-over-text img{
    width: 100%;
    height: 400px;
    object-fit: cover;
}

/* Image Resizable with smaller measures */
.element-top-page-small img {
    width: 100%;
    object-fit: cover;
    height: 300px;
}

/* Image Resizable and Text over Image */
.image-resizable-over-text{
    position: relative;
    width: 100%;
}

/* Overlay on top page image */
.page-title .overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.7); 
}

/* Page Title :: Text over Image */
.page-title .overlay h1{
    color: white;
    position: absolute;
    font-size: 2.5em;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    padding: 0;
    margin: 0;
}


/* Page Title */
.page-title{
    margin: 0 0 5% 0;
}

/* Generic Input and Button Style */
button{
    background-color: var(--primaryColor);
    color: white;
    padding: 10px 25px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

/* Page Title :: Bar under the titles */
/* .bar-under-title{
    width: 20%;
    margin: -10px 40% 8% 40%;
    border: 1px solid #ab192d;
} */

/* ---------------------------------------------------------- */
/* ------------------- HOMEPAGE ----------------------------- */
/* ---------------------------------------------------------- */

.background-img-container1 
{
    /* position: relative;
    text-align: center;
    color: #FFF;
    font-size: 44px;
    padding: 2%; */
    /* background-image: url('../images/bg_financiamento.jpg'); */
    background-image: url("../images/bg_financiamento.jpg");
    text-align: center;
}

.background-img-container .text-center {
    position: absolute;
    top: 80%;
    left: 20%;
    transform: translate(-50%, -50%);
    background-color: var(--primaryColor);
    padding: 5px 10px;
    border-radius: 5px;
}




/* ---------------------------------------------------------- */
/* ------------------- VEHICLES ----------------------------- */
/* ---------------------------------------------------------- */

.list-vehicle
{
    /* border: 1px solid red; */
    margin-bottom: 5%;
    
}

.list-vehicle:hover
{
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.vehicle-img-container 
{
    position: relative;
    text-align: center;
    color: #FFF;
    font-size: 24px;
    padding: 2%;
}

.vehicle-img-container .text-bottom {
    position: absolute;
    top: 80%;
    left: 20%;
    transform: translate(-50%, -50%);
    background-color: var(--primaryColor);
    padding: 5px 10px;
    border-radius: 5px;
}

.vehicle-identification
{
    font-size: 15px !important;
    /* color: #ab192d !important; */
    text-align: center;
}

.sales-warning p
{
    text-align: center !important;
}

.features-label
{
    color: var(--primaryColor);
    font-weight: bold;
}


/* ---------------------------------------------------------- */
/* -------------------- CONTACTS ---------------------------- */
/* ---------------------------------------------------------- */

.contacts .page-title
{
    margin: 0;
    /* border: 1px solid red; */
}

.contacts p
{
    text-align: center;
    /* border: 1px solid red; */
    font-size: 16px;
}

.contacts .call-info
{
    font-size: 12px;
}

.contacts i
{
    color: var(--primaryColor);
    font-size: 20px;
}


/* ---------------------------------------------------------- */
/* ---------------------- FOOTER ---------------------------- */
/* ---------------------------------------------------------- */
footer
{
    width: 100%;
    background-color: #222;
    float:left;
}

footer .warnings
{
    text-align: center;
    margin-bottom: 5%;
}

footer h3
{
    font-size: 1.4em;
    color: #878d91;
}

footer a
{
    font-size: 0.9em;
    color: #6d7276;
    line-height: 2em;
}

footer a:hover
{
    color:var(--linksHover);
}

footer .contacts
{
    margin-bottom: 0%;
}

footer p
{
    font-size: 0.9em;
    color: #6d7276;
    line-height: 2em;
    text-align: center;
}

footer i
{
    color: #6d7276 !important;
    font-size: 1.2em;
}

footer .call-info
{
    font-size: 0.7em;
}

footer .website-author
{
    width: 100%;
    float: left;
    background-color: var(--primaryColor);
}

footer .website-author p
{
    font-size: 0.9em;
    color: #e8e5e5;
    text-align: center;
    margin: 0;
    padding: 10px 0;   
}



/* Medium devices (tablets landscape, desktops, 1024px and up)  %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */
@media (min-width: 768px) {

    /* ------------------------------------------  
        LAYOUT GRID SYSTEM
    ------------------------------------------ */
    .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12,
    .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, 
    .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12,
    .col-lg-1, .col-lg-2, .col-lg-3,  .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12,
    .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 
    {
        padding: 2%;
        margin: 0;
        /* border: 1px solid green; */
    }

    /* Small devices - Layout Grid */
    .col-sm-1 {
        width: 8.33% !important;
    }

    .col-sm-2 {
        width: 16.66% !important;
    }

    .col-sm-3 {
        width: 25% !important;
    }

    .col-sm-4 {
        width: 33.33% !important;
    }

    .col-sm-5 {
        width: 41.66% !important;
    }

    .col-sm-6 {
        width: 50% !important;
    }

    .col-sm-7 {
        width: 58.33% !important;
    }

    .col-sm-8 {
        width: 66.66% !important;
    }

    .col-sm-9 {
        width: 75% !important;
    }

    .col-sm-10 {
        width: 83.33% !important;
    }

    .col-sm-11 {
        width: 91.66% !important;
    }

    .col-sm-12 {
        width: 100% !important;
        /* border: 1px solid blue !important; */
    }

    /* ------------------------------------------  
        CONTAINER 
    ------------------------------------------ */
    .container {
        width: 96%;
        margin: 1% 2%;
        padding: 1%;
        /* border: 1px solid green; */
    }

}



/* Medium devices (tablets landscape, desktops, 1024px and up)  %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */
@media (min-width: 1280px) {

    /* ------------------------------------------  
        LAYOUT GRID SYSTEM
    ------------------------------------------ */
    .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12,
    .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, 
    .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12,
    .col-lg-1, .col-lg-2, .col-lg-3,  .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12,
    .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 
    {
        padding: 0.5% 0.25%;
        margin: 0;
        /* border: 1px solid green; */
    }
    
    /* Medium devices - Layout Grid */
    .col-md-1 {
        width: 8.33% !important;
    }

    .col-md-2 {
        width: 16.66% !important;
    }

    .col-md-3 {
        width: 25% !important;
    }

    .col-md-4 {
        width: 33.33% !important;
    }

    .col-md-5 {
        width: 41.66% !important;
    }

    .col-md-6 {
        width: 50% !important;
    }

    .col-md-7 {
        width: 58.33% !important;
    }

    .col-md-8 {
        width: 66.66% !important;
    }

    .col-md-9 {
        width: 75% !important;
    }

    .col-md-10 {
        width: 83.33% !important;
    }

    .col-md-11 {
        width: 91.66% !important;
    }

    .col-md-12 {
        width: 100% !important;
        /* border: 1px solid red !important; */
    }

    .main-navbar-mobile-button
    {
        display: none;
    }

    .main-navbar-desktop
    {
        display: block;
        float: right;
        margin: 30px 30px 0 0;
        font-size: 16px;
    }

    .main-navbar-desktop a
    {
        padding: 0 10px;
    }

    h1
    {
        font-size: 36px;
    }

    p{
        font-size: 15px;
    }

    /* ------------------------------------------  
        CONTAINER 
    ------------------------------------------ */
    .container {
        width: 80%;
        margin: 1% 10% 1% 10%;
        padding: 0.5%;
    }

    /* Row with columns */
    .cols-row {
        padding: 0.25%;
        /* border: 1px solid green; */
    }

    /* --- Image Resizable  (With or without text over Image) --- */
    .image-resizable img, .image-resizable-over-text img{
        /* width: 100%; */
        height: 100%;
        /* object-fit: cover; */
    }


  
    .page-title{
        margin: 0 0 2% 0;
    }

    .features-label
    {
        /* color: var(--primaryColor);
        font-weight: bold; */
        margin: 0 0 0 20px;
    }

}



/* Extra large devices (large desktops, 1600px and up) */
@media (min-width: 1600px) {




}