body {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: normal;
}

.Content h1 {
    border-bottom: 1px solid #bfbfbf;
    padding: 0 0 11px;
}

.Content h1::before {
    content: "";
    bottom: -1px;
    left: 0;
    width: 108px;
    height: 2px;
    background-color: #86AB35;
    display: block;
    position: absolute;
    display: none;
}

.menu_tree>ul {
    margin-top: 41px;
}

/* CONTACTO ******************************/
.Contact h1 {}

.Contact .long_desc ul li {
    clear: left;
    float: left;
    line-height: 1.4em;
    margin-bottom: 20px;
    padding-left: 38px;
    position: relative;
}

.Contact .long_desc ul li::before {
    font-family: "Ionicons";
    font-size: 1.8em;
    left: 0;
    position: absolute;
    text-align: center;
    top: 3px;
    width: 28px;
}

.Contact .long_desc ul li.mail:before {
    content: "\f422"
}

.Contact .long_desc ul li.phone:before {
    content: "\f4b8"
}

.Contact .long_desc ul li.rrhh:before {
    content: "\f47b"
}

.Contact .long_desc ul li.address:before {
    content: "\f455"
}


.Contact .long_desc ul li span {
    font-size: 1.1em;
    font-weight: 600;
}

.Contact .long_desc ul li a {
    text-decoration: underline;
}

.Contact .long_desc ul li a:hover {
    opacity: 0.7;
}

.Contact .long_desc h4,
.Contact .long_desc h5 {
    margin: 0 0 3px;
}

.Contact .long_desc h4 {
    font-size: 1.2em;
}

.Contact .long_desc .horario {
    color: #777;
    float: left;
    font-size: 0.9em;
    font-weight: normal;
    letter-spacing: 0.03em;
    margin: 4px 0;
    text-transform: uppercase;
}

.Contact iframe#mapa {
    border-bottom: 5px solid #ededed !important;
    height: 400px;
    width: 100%;
}

iframe#mapa {
    width: 100%;
    display: block;
    pointer-events: none;
    position: relative;
    /* IE needs a position other than static */
}

iframe#mapa.clicked {
    pointer-events: auto;
}

.long_desc a {
    text-decoration: underline;
    color: #86AB35;
}

.long_desc a:hover {
    color: #86AB35;
}

.long_desc ul {
    clear: both;
    float: left;
    margin: 0 0 20px;
}

.long_desc ul,
.long_desc ul li {
    float: left;
    width: 100%;
}

.long_desc ul>li {
    clear: left;
    float: left;
    margin-bottom: 6px;
    padding-left: 16px;
    position: relative;
}

.long_desc ul li {
    margin-bottom: 5px;
}

.long_desc ul>li::before {
    float: left;
    font-family: "Ionicons";
    content: "\f3d1";
    font-size: 12px;
    left: 1px;
    opacity: 0.7;
    position: absolute;
    top: 0;
    margin-right: 12px;
}

.long_desc h2 {
    float: left;
    margin: 40px 0 15px;
    position: relative;
    width: 100%;
}

.Content .short_desc p,
.Content .long_desc p {
    float: left;
}

code {
    color: #86AB35;
    font-weight: normal;
    background: #ff40402b;
}

blockquote {
    float: left;
    width: 100%;
    color: #919191;
    font-size: 1.2em;
    line-height: 1.3em;
    margin: 15px 0 40px;
}

.faq_list {
    margin: 0 0 20px;
    float: left;
    width: 100%;
}

.faq_list>.row {
    margin-bottom: 40px;
}

.faq_list article {
    margin: 5px 0 0;
    padding: 0;
    border-width: 0;
    height: auto;
    flex-direction: column;
}

.faq_list article:hover {
    border: none !important;
}

.faq_list li:last-child article {
    border-bottom: 1px solid #e4e4e4;
}

.faq_list article>a {
    color: #000;
    border-color: #7DA032;
    font-size: 1.26em;
    line-height: 1.25em;
    letter-spacing: -0.02em;
    font-weight: normal;
    padding: 15px 20px;
    float: left;
    width: 100%;
    background: #f6f6f6;
    margin: 0;
    border-width: 1px 1px 0;
    border-style: solid;
}

.faq_list article>a::after {
    content: "\f3d0";
    font-family: "Ionicons";
    position: absolute;
    right: 18px;
    top: 16px;
}

.faq_list article>a.collapsed {
    border-color: #e4e4e4;
}

.faq_list article .tab-pane {
    background: #fff;
    float: left;
    width: 100%;
    border: 1px solid #7DA032;
    border-top: none;
    padding: 0
}

.faq_list article .tab-pane .short_desc,
.faq_list article .tab-pane .long_desc {
    margin: 0 0 10px;
}

.faq_list article .tab-pane .long_desc {
    padding: 20px
}

.sucursales .map {
    width: auto;
}

.Content.Contact .map-container {
    margin-bottom: 36px;
}




/*///////////////////////////////////////////////////////////////////////////////////////*/
/*   SELECCION DE SUCURSAL   (carrito + sitio)       /////////////////////////////////  */
/*/////////////////////////////////////////////////////////////////////////////////////*/


/* buscador ***/

.selectors-container {
    display: inline-flex;
    width: 100%;
    flex-wrap: wrap;
    background: #7DA032;
    box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
    padding: 0;
    color: #fff;
    position: relative;
    justify-content: space-between;
}

.selectors-container svg {
    position: absolute;
    left: 20px;
    top: 30px;
    transform: scale(1.1);
}

.selectors-container h4 {
    text-transform: uppercase;
    margin: -7px 0 4px;
    font-size: 1.35em;
    font-weight: 500;
    opacity: 0.5;
}

.selectors-container h4 span {
    display: none
}

.selectors-container .form-group {
    margin-bottom: 1px;
}

.selectors-container label {
    width: 100%;
    font-size: 12px;
    color: white;
    margin-bottom: 1px;
}

.selectors-container .selx {
    margin: 0;
    padding: 21px;
}

.selxzona {
    width: 67%;
    order: 2;
}

.selxnombre {
    width: 100%;
    background: #7DA032;
}

.selxnombre label span {
    display: none
}

.selectors-container>p {
    padding: 0 6px;
    margin: 0;
    width: 100%;
}

.selectors-container .form-control,
.selectors-container select {
    height: 40px;
    font-size: 14px !important;
    width: 33%;
}

.selectors-container .customselect:after {
    font-size: 1.3em;
    line-height: 1.2em;
}

.selectors-container .orderLoc {
    background: #004C80 !important;
    color: #000;
    max-width: unset;
    width: 100%;
    height: 40px;
    border-radius: 0;
    font-weight: 600;
    line-height: 22px;
}


/* cuando se usa un solo buscador (bloque dentro del listado, arriba) */

.selectors-container.default {
    display: none;
}

.selectors-container.inlist .selxnombre {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 14px;
    height: 60px;
}

.selectors-container.inlist .selxnombre h4 {
    padding: 0;
    margin: 0 15px 0 0;
    font-size: 1em;
}

.selectors-container.inlist h4 span {
    display: block;
}

.selectors-container.inlist .selxnombre .form-group {
    margin: 0;
    width: 100%;
    max-width: 200px;
}

.selectors-container.inlist .selxnombre label {
    display: none;
}

.selectors-container.inlist .form-control {
    height: 30px;
    width: 100%;
}





/**/
.campos .form-group {
    width: 49%;
}

.campos {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.campos .valid {
    width: 100%;
}

.campos .valid .field-validation-error::before {
    display: none
}

.campos .valid .field-validation-error {
    color: #87f9f5 !important;
    line-height: 1.2em !important;
    float: left;
    width: 100%;
    font-size: 1em;
    padding: 9px 0 0;
}

.selectors-container .field-validation-valid {
    display: none;
}

#site_list .pn.posr {
    padding-top: 0 !important;
}


/* listado ***/

#mapa .site_list {
    padding: 0;
    height: 100%;
    margin: 0;
}

#mapa .mapa-list {
    height: 100%;
    overflow: auto;
    max-height: calc(100% - 60px);
    background-color: #f6f6f6;
}

#mapa .mapa-list li a {
    background: #f6f6f6;
    float: left;
    width: 100%;
    padding: 15px 10px;
    color: #535252;
    font-size: 11px;
    border: 1px solid #e1e1e1;
    border-bottom: none;
    min-height: 100px;
}

#mapa .mapa-list li:first-child a {
    border-top: none;
}

#mapa .mapa-list li:nth-last-child(1) a {}

#mapa .mapa-list li a:hover,
#mapa .mapa-list li a.active {
    background: lightyellow;
    border-left: 5px solid #86AB35;
}

#mapa .mapa-list li a.active {
    pointer-events: none;
}

#mapa .mapa-list li .loc-name {
    color: #000 !important;
    font-weight: 600;
    font-size: 1.2em !important;
    text-transform: uppercase;
}

#mapa .mapa-list .loc-addr,
#mapa .mapa-list .loc-time,
#mapa .mapa-list .loc-cod strong {
    font-size: 1.1em;
    opacity: 1;
    font-weight: normal;
    line-height: 1.3em;
}

#mapa .mapa-list .loc-addr {
    font-size: 1.15em;
}

#mapa .mapa-list .loc-time {
    color: #999;
    margin-top: 4px;
}

#mapa .mapa-list .loc-cod strong {
    color: black !important;
    line-height: 18px;
    font-size: 12px;
    opacity: 1;
    font-weight: 600;
}

#mapa .mapa-list li a.active {
    background: #fff;
}

#mapa .mapa-list li {
    margin: 0 !important;
}

#mapa .mapa-list .mCSB_draggerContainer {
    border: #e1e1e1 1px solid;
    background-color: #f6f6f6;
}

#mapa .mapa-list .mCSB_dragger_bar {
    line-height: 30px;
    width: 10px;
    border-radius: 12px;
    background-color: #c2c2c2;
}

#mapa .mapa-list .mCSB_draggerRail {
    background-color: transparent;
}


/* mapa ***/
#map {
    position: unset !important;
    z-index: 0;
    height: auto !important;
}

#mapa {
    display: flex;
    justify-content: space-between;
    border-bottom: 2px solid #f0f0f0;
    position: relative;
    background: #e6e6e6;
    height: 480px;
}

#map::before {
    content: "";
    background-image: url(/content/images/map.svg);
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    height: 100px;
    width: 100px;
    top: calc(50% - 50px);
    right: calc(50% - 50px);
    position: absolute;
    opacity: 0.07;
    z-index: 0;
}

#mapImage {
    padding: 0;
    overflow: hidden;
}

#mapImage>a {
    z-index: 1;
    position: relative;
    height: auto;
    width: 100%;
    float: left;
}

#mapImage img {
    width: 100%;
    object-fit: cover;
    object-position: center;
    height: 100%;
    display: inline-block;
}

#mapImage .noselect {
    pointer-events: none;
}

#mapImage .btn.btn-primary {
    height: 55px;
    width: 100%;
    line-height: 2.7em;
    margin-top: 10px;
    font-size: 1.2em;
    background-color: #cc0000;
}

.gm-svpc div img {
    position: relative !important;
}


@media(max-width: 767px) {
    .selectors-container {
        flex-direction: column;
        margin-bottom: 6px;
    }

    .selectors-container.inlist {
        margin-bottom: 0;
    }

    .selectors-container .form-control,
    .selectors-container select {
        width: 100%;
    }

    .selectors-container .selx {
        width: 100%;
    }

    #mapa {
        flex-direction: column;
        height: auto;
    }

    #mapa .site_list,
    #mapImage {
        width: 100%
    }

    #mapa .mapa-list {
        max-height: 282px;
        border-bottom: 1px solid #ddd;
    }

    #mapa .mapa-list li a {
        padding: 8px 10px;
    }

    #mapImage {
        height: 260px;
        border-top: 5px solid #fff;
    }

    #sucursalesModal .selxnombre label span {
        display: inline-block;
        text-transform: uppercase;
    }

    .Cart .selectors-container .selx {
        padding: 12px 20px 18px;
    }

    .Cart .selectors-container .form-control,
    .Cart .selectors-container select,
    .Cart .selectors-container .orderLoc {
        padding: 6px
    }

    .selxnombre {
        order: 2
    }
}

@media(max-width: 991px) {}


@media (max-width: 479px) {
    .campos .form-group {
        width: 100%;
    }
}


.mensaje-mapa {
    color: #000000d1;
    width: 100%;
    font-size: 1.1em;
    padding: 0 10px 0 66px;
    display: block;
    position: relative;
    margin: 28px 0;
}

.mensaje-mapa::before {
    content: "O";
    float: left;
    font-size: 38px;
    font-family: "e3font";
    margin-right: 6px;
    color: #383838;
    height: 36px;
    position: absolute;
    left: 17px;
    line-height: 100%;
    top: calc(50% - 18px);
}


@media (max-width: 1199px) {
    .mensaje-mapa {
        font-size: 0.98em;
        padding-left: 52px;
    }

    .mensaje-mapa::before {
        font-size: 32px;
        top: calc(50% - 16px);
        left: 10px;
    }
}

@media (max-width: 779px) {
    .mensaje-mapa {
        margin: 7px 0;
    }
}


/*Custom Date Picker*/

.bootstrap-datetimepicker-widget {
    list-style: none
}

.bootstrap-datetimepicker-widget.dropdown-menu {
    display: block;
    margin: 2px 0;
    padding: 4px;
    width: 19em
}

@media (min-width:768px) {
    .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
        width: 38em
    }
}

@media (min-width:992px) {
    .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
        width: 38em
    }
}

@media (min-width:1200px) {
    .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
        width: 38em
    }
}

.bootstrap-datetimepicker-widget.dropdown-menu:before,
.bootstrap-datetimepicker-widget.dropdown-menu:after {
    content: '';
    display: inline-block;
    position: absolute
}

.bootstrap-datetimepicker-widget.dropdown-menu.bottom:before {
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #ccc;
    border-bottom-color: rgba(0, 0, 0, 0.2);
    top: -7px;
    left: 7px
}

.bootstrap-datetimepicker-widget.dropdown-menu.bottom:after {
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid white;
    top: -6px;
    left: 8px
}

.bootstrap-datetimepicker-widget.dropdown-menu.top:before {
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 7px solid #ccc;
    border-top-color: rgba(0, 0, 0, 0.2);
    bottom: -7px;
    left: 6px
}

.bootstrap-datetimepicker-widget.dropdown-menu.top:after {
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid white;
    bottom: -6px;
    left: 7px
}

.bootstrap-datetimepicker-widget.dropdown-menu.pull-right:before {
    left: auto;
    right: 6px
}

.bootstrap-datetimepicker-widget.dropdown-menu.pull-right:after {
    left: auto;
    right: 7px
}

.bootstrap-datetimepicker-widget .list-unstyled {
    margin: 0
}

.bootstrap-datetimepicker-widget a[data-action] {
    padding: 6px 0
}

.bootstrap-datetimepicker-widget a[data-action]:active {
    box-shadow: none
}

.bootstrap-datetimepicker-widget .timepicker-hour,
.bootstrap-datetimepicker-widget .timepicker-minute,
.bootstrap-datetimepicker-widget .timepicker-second {
    width: 54px;
    font-weight: bold;
    font-size: 1.2em;
    margin: 0
}

.bootstrap-datetimepicker-widget button[data-action] {
    padding: 6px
}

.bootstrap-datetimepicker-widget .btn[data-action="incrementHours"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Increment Hours"
}

.bootstrap-datetimepicker-widget .btn[data-action="incrementMinutes"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Increment Minutes"
}

.bootstrap-datetimepicker-widget .btn[data-action="decrementHours"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Decrement Hours"
}

.bootstrap-datetimepicker-widget .btn[data-action="decrementMinutes"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Decrement Minutes"
}

.bootstrap-datetimepicker-widget .btn[data-action="showHours"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Show Hours"
}

.bootstrap-datetimepicker-widget .btn[data-action="showMinutes"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Show Minutes"
}

.bootstrap-datetimepicker-widget .btn[data-action="togglePeriod"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Toggle AM/PM"
}

.bootstrap-datetimepicker-widget .btn[data-action="clear"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Clear the picker"
}

.bootstrap-datetimepicker-widget .btn[data-action="today"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Set the date to today"
}

.bootstrap-datetimepicker-widget .picker-switch {
    text-align: center
}

.bootstrap-datetimepicker-widget .picker-switch::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Toggle Date and Time Screens"
}

.bootstrap-datetimepicker-widget .picker-switch td {
    padding: 0;
    margin: 0;
    height: auto;
    width: auto;
    line-height: inherit
}

.bootstrap-datetimepicker-widget .picker-switch td span {
    line-height: 2.5;
    height: 2.5em;
    width: 100%
}

.bootstrap-datetimepicker-widget table {
    width: 100%;
    margin: 0
}

.bootstrap-datetimepicker-widget table td,
.bootstrap-datetimepicker-widget table th {
    text-align: center;
    border-radius: 4px
}

.bootstrap-datetimepicker-widget table th {
    height: 20px;
    line-height: 20px;
    width: 20px
}

.bootstrap-datetimepicker-widget table th.picker-switch {
    width: 145px
}

.bootstrap-datetimepicker-widget table th.disabled,
.bootstrap-datetimepicker-widget table th.disabled:hover {
    background: none;
    color: #777;
    cursor: not-allowed
}

.bootstrap-datetimepicker-widget table th.prev::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Previous Month"
}

.bootstrap-datetimepicker-widget table th.next::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Next Month"
}

.bootstrap-datetimepicker-widget table thead tr:first-child th {
    cursor: pointer
}

.bootstrap-datetimepicker-widget table thead tr:first-child th:hover {
    background: #eee
}

.bootstrap-datetimepicker-widget table td {
    height: 54px;
    line-height: 54px;
    width: 54px
}

.bootstrap-datetimepicker-widget table td.cw {
    font-size: .8em;
    height: 20px;
    line-height: 20px;
    color: #777
}

.bootstrap-datetimepicker-widget table td.day {
    height: 20px;
    line-height: 20px;
    width: 20px
}

.bootstrap-datetimepicker-widget table td.day:hover,
.bootstrap-datetimepicker-widget table td.hour:hover,
.bootstrap-datetimepicker-widget table td.minute:hover,
.bootstrap-datetimepicker-widget table td.second:hover {
    background: #eee;
    cursor: pointer
}

.bootstrap-datetimepicker-widget table td.old,
.bootstrap-datetimepicker-widget table td.new {
    color: #777
}

.bootstrap-datetimepicker-widget table td.today {
    position: relative
}

.bootstrap-datetimepicker-widget table td.today:before {
    content: '';
    display: inline-block;
    border: solid transparent;
    border-width: 0 0 7px 7px;
    border-bottom-color: #7DA032;
    border-top-color: rgba(0, 0, 0, 0.2);
    position: absolute;
    bottom: 4px;
    right: 4px
}

.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover {
    background-color: #7DA032;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25)
}

.bootstrap-datetimepicker-widget table td.active.today:before {
    border-bottom-color: #fff
}

.bootstrap-datetimepicker-widget table td.disabled,
.bootstrap-datetimepicker-widget table td.disabled:hover {
    background: none;
    color: #777;
    cursor: not-allowed
}

.bootstrap-datetimepicker-widget table td span {
    display: inline-block;
    width: 54px;
    height: 54px;
    line-height: 54px;
    margin: 2px 1.5px;
    cursor: pointer;
    border-radius: 4px
}

.bootstrap-datetimepicker-widget table td span:hover {
    background: #eee
}

.bootstrap-datetimepicker-widget table td span.active {
    background-color: #86AB35;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25)
}

.bootstrap-datetimepicker-widget table td span.old {
    color: #777
}

.bootstrap-datetimepicker-widget table td span.disabled,
.bootstrap-datetimepicker-widget table td span.disabled:hover {
    background: none;
    color: #777;
    cursor: not-allowed
}

.bootstrap-datetimepicker-widget.usetwentyfour td.hour {
    height: 27px;
    line-height: 27px
}

.bootstrap-datetimepicker-widget.wider {
    width: 21em
}

.bootstrap-datetimepicker-widget .datepicker-decades .decade {
    line-height: 1.8em !important
}

.input-group.date .input-group-addon {
    cursor: pointer
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0
}