/* ==========================================================================
  GERAL
  ========================================================================== */
html, body {font-family: 'Open Sans', arial, helvetica, sans-serif;overflow: hidden;margin: 0;position: absolute;width: 100%;height: 100%;}
h1, h2, h3, h4 {color: #f25657;font-family: 'FranklinGothic-DemiCond', arial, helvetica, sans-serif;margin-top: 0;font-size: 30px;}

/* ==========================================================================
  BORDA
  ========================================================================== */
.borda {background: #2c5772;height: 62px;width: 100%;text-align: center;position: fixed;top: 0;z-index: 99;}
.borda a.logo {float: left;background: url(../images/logo.png) no-repeat;height: 52px;width: 244px;margin: 5px 0 5px 5px;: 5px;}
.borda > a {position: relative;z-index: 9999;}
/* ==========================================================================
  LIKE
  ========================================================================== */
.like-btn {float: left;margin: 6px 25px;padding-left: 50px;background: url(../images/like-bg.png) no-repeat left top;padding-top: 22px;height: 25px;}
/* ==========================================================================
  FILTRO
  ========================================================================== */
#openFilter {color: #fff;display: block !important;text-indent: initial;cursor: pointer;}
.toggle-filter {display: none;}
.filters {position: absolute;width: 300px;z-index: 999;padding: 20px;right: 5%;top: 0px;text-align: left;background: url('https://secure226.hostgator.com.br/~nickl082/concessionarias/wp-content/themes/concessionariasf/assets/images/legenda-maps.png') no-repeat 95% 15px #2c5772;}
.filters.tab {right: 5px !important;top: 0px !important;}
.filters ul {padding: 12px 7px 0;display: block;width: 100%;float: left;}
.filters li {margin-right: 10px;width: 30%;float: left;list-style: none;padding: 0;text-align: left !important;margin-bottom: 8px;}
.filters li a {color: #fff;width: 100%;height: 40px;display: block;text-indent: -99999px;background-size: contain !important;background-color: #fff !important;border-radius: 5px;background-position: center center;}
.filters li a#all-marcas {background: url(../images/multimarcas.png) no-repeat center center;}
.filters li a:hover {color: #f5f5f5;}
.filters i {margin-right: 8px;}
.filters span > span {padding: 8px 10px;border-radius: 50%;margin-right: 0px;display: inline;border: 2px dotted #fff;}
.filters span.info-filtro {float: left;width: 100%;margin-bottom: 5px;color: rgba(255,255,255,0.6);font-size: 12px;}
.filters .brand-icon {background: #ffc600;margin-left: 18px;}
.filters .revendas-icon {background: #d84848;}
.filters .lojas-icon {background: #48aad8;}

.filtro-rev {margin-top: 35px;padding-left: 8px; margin-bottom: 5px;}
a.filterLoja.check.on {background-color: #00aced;box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.25)}
a.filterLoja.check {width: 26%;background-color: #ee888a;padding: 10px;color: #fff;text-align: center;display: block;margin: 0;float: left;text-decoration: none;font-size: 14px;}
a.filterLoja.check:hover {background-color: #3599bf;}
a.autorizada {border-left: 1px solid #2c5772;border-right: 1px solid #2c5772;}

/* ==========================================================================
  ADS
  ========================================================================== */
.ads {position: absolute;z-index: 999;left: 50%;bottom: 20px;width: 728px;margin-left: -364px;background-color: #222;text-align: center;height: 90px;}
.ads.mb20 {position: fixed; bottom: 22% !important;}
.ads.mt80 {top: 80px !important; bottom: inherit !important;}
.close_ads {position: absolute;top: 6px;right: 6px;width: 24px;height: 24px;font-size: 20px;font-weight: 700;text-align: center;line-height: 24px;color: #FFF;background: #000;border-radius: 12px;cursor: pointer;}

/* ==========================================================================
  MAPA DE CONCESSIONÁRIAS
  ========================================================================== */
#bodyContent h3 {color: #2287d4;margin: 8px 0 12px;min-width: 150px;white-space: pre-wrap;}
#bodyContent > p > a {float: left;margin-top: 10px;}
#bodyContent a, #bodyContent a:hover {background: #f25657;color: #fff;padding: 5px; text-decoration: none;}
.marcas_mapa {bottom: 0;margin-bottom: 30px;opacity: 0.5;position: absolute;right: 30px;z-index: 99;}
.mapas-lg {position: absolute; width: 100%; height: 100%;overflow: hidden;background: #2c5772;}
.mapas-lg #map {height: 100%;width: 100%; float: left; margin-top: 62px;}
.mapas img {width: auto; height: auto;max-width: none;}
/* Lista Lojas */
div.lojas div.bgloja div.thumb img {border: 0;}
div.lojas.mapa {position: absolute;height: 100%;width: 100%;z-index: 99;}
div.lojas.mapa .item_container {z-index: 999;width: 300px;top: 160px;left: 50%;margin-left: -150px;display: block;overflow: hidden;position: absolute;box-shadow: 0 10px 50px rgba(0,0,0,0.9);}
.bgloja {background: #fff;box-shadow: 0 10px 50px rgba(0,0,0,0.5);}
.loja {padding: 10px 20px;}
.item_loja {display: none;}
.close {position: absolute;top: 6px;right: 6px;width: 24px;height: 24px;font-size: 20px;font-weight: 700;text-align: center;line-height: 24px;color: #FFF;background: #000;border-radius: 12px;cursor: pointer;}
 /* ==========================================================================
  ANIMAÇÕES
  ========================================================================== */
.check {
transition: background .25s ease-in-out;
-moz-transition: background .25s ease-in-out;
-webkit-transition: background .25s ease-in-out;
}


@media screen and (max-width:768px) {
.ads {left: 50%;width: 100%;margin-left: -50%;background-color: rgba(0,0,0,0) !important;height: auto;  }
.like-btn {display: none;}
}

@media screen and (max-width:375px) {
html.overflow-x, body.overflow-x, .mapas-lg.overflow-x {overflow-x: hidden; overflow-y: scroll !important;}
.ads {display: none;}
.like-btn {display: none;}
.mapas .ads img {width: 100% !important;display: block;height: auto !important;max-width: 100% !important;}
#openFilter {padding-left: 15px;}
.filters.tab {right: 0px !important;}
.filters {width: 100%;padding: 20px 0;}
}

@media screen and (max-width:320px) {
  .filters .brand-icon {margin-left: 5px;}
}