/*	
	Theme Name: Autoluna
	Author: Federico Soria
	Description: Personalización de Motors Theme
	Version: 1.0
	License: GNU General Public License v2 or later
	License URI: http://www.gnu.org/licenses/gpl-2.0.html
	Tags: autoluna, autos, agencia, Córdoba
	Text Domain: autoluna
    Template: motors
    
*/

/* Add your own styles here */
#header .header-main {padding: 10px 0;}
#header .header-main .container {
    display: flex;
    align-items: center;
}
#header .logo-main {flex: 1; float: none;}
#header .logo-main img {width: 330px;}

#header .header-main-socs {
    list-style-type: none;
    display: flex;
    margin: 0;
}
#header .header-main-socs li {margin: 0 8px 0;}
#header .header-main-socs li:last-child {margin: 0;}
#header .header-main-socs li a {
  display: block;
  width: 35px;
  height: 35px;
  line-height: 35px;
  text-align: center;
  border-radius: 50%;
  background-color: #2f3234;
  color: #fff;
  text-indent: 1px;
}
#header .header-main-socs li a i {font-size: 14px;}
#header .header-main-socs li a:hover {background-color: #6c98e1;}
#header .header-main-socs li.whatsapp a {
    width: auto;
    height: auto;
    background: none;
    border-radius: unset;
    font-size: 1.1em;
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
    font-weight: 700;
    text-decoration: none;
}
#header .header-main-socs li.whatsapp img {
    margin-left: 8px;
    max-width: 32px;
}

/* Home */
#main {background-color: #ECECEC;}
#main .special-offers .listing-car-item-meta {padding: 15px;}
#main .special-offers .car-meta-top {
    border: none;
    padding: 0;
}
#main .special-offers .owl-controls {margin-top: 10px;}
#listing-filter {margin-top: 0;}
#listing-filter .filter-flex {
    padding: 15px;
    margin: 0 0 30px 0;
    background: #373c3f;
    display: flex;
    box-shadow: none;
    justify-content: space-between;
}
#listing-filter .filter-flex .filter-column {flex: 1; margin-right: 15px;}
#listing-filter .filter-flex .filter-search {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    text-decoration: none;
    color: #fff !important;
    border-radius: 3px;
    background-color: #6c98e1;
    box-shadow: 0 2px 0 #567ab4;
}
#listing-content .select2-selection, #listing-content .view-type.active {background: #CCC;}
#listings-result .stm-isotope-listing-item .car-title {
    white-space: normal;
    text-overflow: unset;
    margin-top: 0;
    padding-right: 5px;
}
#listings-result .stm-isotope-listing-item .image {
    position: relative;
}
#listings-result .stm-isotope-listing-item .car-video {
    position: absolute;
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    background: url('./assets/images/play_small.png');
    margin: -24px 0 0 -24px;
    width: 48px;
    height: 48px;
    z-index: 20; 
}

/* Car single */
#main .entry-header > .container {min-height: 170px;}
#main .entry-header > .container .h1 {font-size: 40px;}

.stm-single-car-page .stm-shareble a {
    display: inline-block;
    margin-right: 10px;
}
.stm-single-car-page .stm-shareble a img {max-width: 32px;}

#main .stm-single-car-page .video-preview a:before {
  position: absolute;
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -64px 0 0 -64px !important;
  width: 128px;
  height: 128px;
  background: url('./assets/images/play.png');
  border-radius: 0;
  line-height: normal;
  z-index: 20; 
}
#main .stm-single-car-page .video-preview a:hover:before {opacity: 0.8;}
#main .stm-single-car-page .stm-thumbs-car-gallery .video-preview:before {display: none;}
#main .stm-single-car-page .stm-thumbs-car-gallery .video-preview a:before {
    background: url('./assets/images/play_small.png');
    margin: -24px 0 0 -24px !important;
    width: 48px;
    height: 48px;
}

/* Gallery */
#main .ngg-galleryoverview {
    display: flex !important;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 0;
}
#main .ngg-galleryoverview:after {
    content: "";
    flex: auto;
} 
#main .ngg-gallery-thumbnail-box {
    width: 25%;
    padding: 0.5em;
    box-sizing: border-box;
    float: none;
}
#main .ngg-gallery-thumbnail {
    box-shadow: 0 2px 2px rgba(0,0,0,0.4);
    background: none;
    border: none;
    margin: 0;
}
#main .ngg-gallery-thumbnail a {margin: 0;}
#main .ngg-gallery-thumbnail img {width: 100%;}

@media (min-width: 769px) {
    #listings-result .stm-isotope-listing-item:nth-child(4n+1) {clear: left;}
}

@media (max-width: 768px) {
    #header .header-main .container {flex-direction: column;}
    #header .logo-main {margin-bottom: 0; padding: 0}
    #header .logo-main img {width: 100%;}
    #header .mobile-menu-holder {
        margin-bottom: 20px; 
        width: 100%;
    }
    #header .header-top-info {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    #header .mobile-menu-trigger {
        position: inherit;
        top: auto; 
        right: auto;
        cursor: pointer;
        width: 20px;
        height: 16px;
        padding: 0;
    }
    #header .mobile-menu-trigger span {margin-top: 3px;} 
    #header .header-main-socs li a {
        width: 26px;
        height: 26px;
        line-height: 24px;
    }
    #header .header-main-socs li a i {
        position: relative;
        left: -1px;
    }
    #header .header-main-socs li.whatsapp a {font-size: 0.7em;}
    #header .header-main-socs li.whatsapp img {
        margin-left: 3px;
        max-width: 20px;
    }
    #listings-result {margin: 0 !important;}
    #main .ngg-gallery-thumbnail-box {width: 50%;}
}

@media (max-width: 465px) {
    #main .special-offers .car-meta-top {
        display: flex;
        flex-direction: column-reverse;
        align-items: flex-end;
    }
    #main .special-offers .car-meta-top .car-title {
        padding: 0;
        margin: 0;
    }
    #main .special-offers .car-meta-top .price { 
        max-width: 120px; 
        margin-left: 0;
        margin-top: 15px;
    }
    #listing-filter .filter-flex {flex-direction: column;}
    #listing-filter .filter-flex .filter-column {
        margin-right: 0; 
        margin-bottom: 15px;
    }
    #listing-filter .filter-flex .filter-search {
        padding: 10px;
        width: auto;
    }
    #main .entry-header > .container {min-height: 135px;}
    #main .entry-header > .container .h1 {font-size: 20px;}
    #main .ngg-gallery-thumbnail-box {width: 100%;}
}
