body {
    font-size: 16px;
}
.font-montserrat {
    font-family: 'Montserrat', sans-serif;
}
p,
h1,
h2,
h3,
h4,
h5,
dl, ol, ul {
    margin-bottom: 0;
}
/***************************
 *      SLIDER
 *************************** */
.carousel-caption .texto * {
    
    letter-spacing: var( --slider-letter-spacing-1 );
    font-size: var( --slider-font-size-1 );
    line-height: var( --slider-line-height-1 );
    font-weight: var( --slider-font-weight-1 );
    color: var( --slider-color-1 );
    font-family: var( --slider-font-family-1 );
    text-shadow: 0 0 10px #ffffff;
}
.carousel-caption .texto u {
    color: inherit;
}
.carousel-caption {
    text-align: initial !important;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
    filter: invert(1);
}
.carousel-caption .texto *:not(:first-child) {
    letter-spacing: var( --slider-letter-spacing-2 );
    font-size: var( --slider-font-size-2 );
    line-height: var( --slider-line-height-2 );
    font-weight: var( --slider-font-weight-2 );
    color: var( --slider-color-2 );
    font-family: var( --slider-font-family-2 );
}
.carousel-caption .texto > * + * {
    margin-top: 220px;
    font-weight: 600;
}
.carousel-indicators li {
    background-color: var( --color-8E8E8E );
}
/***************************
 *      CONTACTO
 *************************** */
 .wrapper-contacto {
    font-size: var( --contacto-font-size );
    line-height: var( --contacto-line-height );
    letter-spacing: var( --contacto-letter-spacing );
    font-weight: var( --contacto-font-weight );
    color: var( --contacto-font-color );
}
.wrapper-contacto a {
    color: inherit;
}
.wrapper-contacto form .title {
    color: var( --color-E30613 );
    background: var( --color-F5F5F5 );
    font-size: var( --font-size-16 );
    line-height: 42px;
}
.wrapper-contacto .title\:1 {
    font-size: var( --contacto-title-font-size );
    line-height: var( --contacto-title-line-height );
    letter-spacing: var( --contacto-title-letter-spacing );
    font-weight: var( --contacto-title-font-weight );
    color: var( --contacto-title-color );
}
.wrapper-contacto .mapa iframe {
    width: 100%;
    height: 400px;
}
.wrapper-contacto .info {
    background-color: var( --color-F8F8F8 );
}
.wrapper-contacto .info i {
    font-size: 23px;
    color: var( --color-E30613 );
}
.wrapper-contacto .info i.fa-whatsapp {
    color: #0DC143;
}
.wrapper-contacto form label {
    font-size: var( --contacto-label-font-size );
    line-height: var( --contacto-label-line-height );
    letter-spacing: var( --contacto-label-letter-spacing );
    font-weight: var( --contacto-label-font-weight );
    color: var( --contacto-label-color );
}
.wrapper-contacto form .form-control {
    border-radius: 8px;
}
.wrapper-contacto .info h3 {
    font-size: var( --contacto-info-title-font-size );
    line-height: var( --contacto-info-title-line-height );
    letter-spacing: var( --contacto-info-title-letter-spacing );
    font-weight: var( --contacto-info-title-font-weight );
    color: var( --contacto-info-title-color );
}
.wrapper-contacto .btn.btn-danger {
    background-color: var( --color-B1121B );
    border-color: var( --color-B1121B );
    border-radius: 8px;
}

.border-editable {
    border: 3px dashed #dee2e6 !important
}
.border-editable i {
    position: absolute;
    right: 0;
    top: 0;
}

.familia {
    text-align: center;
    font-size: var( --familia-font-size );
    line-height: var( --familia-line-height );
    letter-spacing: var( --familia-letter-spacing );
    font-weight: var( --familia-font-weight );
    color: var( --familia-color );
}
.familia a {
    color: inherit;
    text-decoration: none;
    display: block;
}
.producto a:hover,
.familia a:hover {
    -webkit-box-shadow: 0 0 14px 1px rgba(0,0,0,.1);
    box-shadow: 0 0 14px 1px rgba(0,0,0,.1);
}
.familia .title::before,
.familia .title::after {
    content: "-";
}
.familia .title::before {
    margin-right: 10px;
}
.familia .title::after {
    margin-left: 10px;
}
.familia .title + * {
    font-size: var( --font-size-14 );
    line-height: 27px;
    letter-spacing: 1.61;
    font-weight: 400;
    color: var( --color-7E90A1 );
}
.producto {
    text-align: center;
    font-size: var( --producto-font-size );
    line-height: var( --producto-line-height );
    letter-spacing: var( --producto-letter-spacing );
    font-weight: var( --producto-font-weight );
    color: var( --producto-color );
}
.producto a {
    color: inherit;
    text-decoration: none;
}
.producto img {
    border-bottom: 1px solid var( --color-7E90A1 );
}
.producto .title {
    font-size: var( --producto-title-font-size );
    line-height: var( --producto-title-line-height );
    letter-spacing: var( --producto-title-letter-spacing );
    font-weight: var( --producto-title-font-weight );
    color: var( --producto-title-color );
}
.producto h3.title {
    font-size: var( --producto-h3-title-font-size );
    line-height: var( --producto-h3-title-line-height );
    letter-spacing: var( --producto-h3-title-letter-spacing );
    font-weight: var( --producto-h3-title-font-weight );
    color: var( --producto-h3-title-color );
}
.menu-lateral > li > div {
    font-size: var( --menu-font-size );
    line-height: var( --menu-line-height );
    letter-spacing: var( --menu-letter-spacing );
    font-weight: var( --menu-font-weight );
    color: var( --menu-color );
}
.menu-lateral > li > div + ul {
    font-size: var( --submenu-font-size );
    line-height: var( --submenu-line-height );
    letter-spacing: var( --submenu-letter-spacing );
    font-weight: var( --submenu-font-weight );
    color: var( --submenu-color );
}
.menu-lateral a {
    color: inherit;
}
.menu-lateral .active,
.menu-lateral a:hover {
    text-decoration: none;
    color: var( --color-B1121B );
}

.menu-lateral [aria-expanded="true"] > i {
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transition: all 700ms ease;
    -moz-transition: all 700ms ease;
    -ms-transition: all 700ms ease;
    -o-transition: all 700ms ease;
    transition: all 700ms ease;
}
.menu-lateral [aria-expanded="true"],
.menu-lateral .active {
    color: var( --color-B1121B );
}
.breadcrumb {
    color: var( --color-6E6F71 );
    font-size: var( --font-size-12 );
    line-height: 27px;
    letter-spacing: .42;
}
.breadcrumb-item + .breadcrumb-item::before {
    content: "|";
}
.breadcrumb a {
    color: inherit
}
.title-catalogo {
    padding: 0 7px;
    background: var( --color-F5F5F5 );
    font-size: var( --categoria-title-font-size );
    line-height: var( --categoria-title-line-height );
    letter-spacing: var( --categoria-title-letter-spacing );
    font-weight: var( --categoria-title-font-weight );
    color: var( --categoria-title-color );
}

.wrapper-producto h4.title {
    font-size: var( --producto-h4-title-font-size );
    line-height: var( --producto-h4-title-line-height );
    letter-spacing: var( --producto-h4-title-letter-spacing );
    font-weight: var( --producto-h4-title-font-weight );
    color: var( --producto-h4-title-color );
}
.wrapper-producto h4.title span {
    position: relative;
}
.wrapper-producto h4.title span::before {
    content: "";
    position: absolute;
    width: 48px;
    left: calc( 50% - 24px );
    bottom: -10px;
    border-bottom: 1px solid #575361;
}
.wrapper-producto .code {
    font-size: var( --producto-code-font-size );
    line-height: var( --producto-code-line-height );
    letter-spacing: var( --producto-code-letter-spacing );
    font-weight: var( --producto-code-font-weight );
    color: var( --producto-code-color );
}
.wrapper-producto h3.title {
    font-size: var( --producto-h3-title-font-size );
    line-height: var( --producto-h3-title-line-height );
    letter-spacing: var( --producto-h3-title-letter-spacing );
    font-weight: var( --producto-h3-title-font-weight );
    color: var( --producto-h3-title-color );
}
.wrapper-producto .subtitle {
    font-size: var( --producto-h3-subtitle-font-size );
    line-height: var( --producto-h3-subtitle-line-height );
    letter-spacing: var( --producto-h3-subtitle-letter-spacing );
    font-weight: var( --producto-h3-subtitle-font-weight );
    color: var( --producto-h3-subtitle-color );
}
.wrapper-producto .description {
    font-size: var( --producto-description-font-size );
    line-height: var( --producto-description-line-height );
    letter-spacing: var( --producto-description-letter-spacing );
    font-weight: var( --producto-description-font-weight );
    color: var( --producto-description-color );
}

.wrapper-producto .tamanio {
    font-size: var( --producto-tamanio-font-size );
    line-height: var( --producto-tamanio-line-height );
    letter-spacing: var( --producto-tamanio-letter-spacing );
    font-weight: var( --producto-tamanio-font-weight );
    color: var( --producto-tamanio-color );
}
.wrapper-producto .tamanio .title,
.wrapper-producto .relacion h4.title {
    background-color: var( --color-F3F3F3 );
    padding: 0 7px;
    font-size: var( --font-size-13 );
    letter-spacing: .22;
    line-height: 28px;
}
.wrapper-producto .frase {
    font-size: var( --font-size-15 );
    line-height: 22px;
    letter-spacing: .5;
    color: var( --color-6E6F71 );
    position: relative;
}
.wrapper-producto .frase span {
    position: relative;
}
.wrapper-producto .frase span::before {
    position: absolute;
    content: "";
    width: 48px;
    left: 0;
    bottom: -20px;
    border-bottom: 1px solid var( --color-B1121B );
}
.wrapper-producto .btn.btn-danger {
    background-color: var( --color-B1121B );
    border-radius: 8px;
}
/***************************
 *      HOME
 *************************** */
.wrapper-home .wrapper-elemento {
    background-color: var( --color-F8F8F8 );
}
.wrapper-home .elementos .row:nth-child( 2n + 1 ) .col-12:first-child {
    order:2
}
.wrapper-home .elementos .row:nth-child( 2n + 1 ) .col-12:last-child {
    order:1
}
.wrapper-home .elementos {
    font-size: var( --home-elementos-font-size );
    line-height: var( --home-elementos-line-height );
    letter-spacing: var( --home-elementos-letter-spacing );
    font-weight: var( --home-elementos-font-weight );
    color: var( --home-elementos-font-color );
}
.wrapper-home .elementos .title {
    font-size: var( --home-elementos-title-font-size );
    line-height: var( --home-elementos-title-line-height );
    letter-spacing: var( --home-elementos-title-letter-spacing );
    font-weight: var( --home-elementos-title-font-weight );
    color: var( --home-elementos-title-font-color );
}
.wrapper-home .iconos {
    font-size: var( --home-iconos-font-size );
    line-height: var( --home-iconos-line-height );
    letter-spacing: var( --home-iconos-letter-spacing );
    font-weight: var( --home-iconos-font-weight );
    color: var( --home-iconos-font-color );
}
.wrapper-home .iconos .title {
    font-size: var( --home-iconos-title-font-size );
    line-height: var( --home-iconos-title-line-height );
    letter-spacing: var( --home-iconos-title-letter-spacing );
    font-weight: var( --home-iconos-title-font-weight );
    color: var( --home-iconos-title-font-color );
}
.wrapper-home .iconos h3.title {
    font-size: var( --home-title-font-size );
    line-height: var( --home-title-line-height );
    letter-spacing: var( --home-title-letter-spacing );
    font-weight: var( --home-title-font-weight );
    color: var( --home-title-font-color );
}
.wrapper-home .iconos img {
    width: 50px;
    display: block;
    margin: auto;
}
.wrapper-home .presupuesto {
    color: var( --presupuesto-color );
    font-size: var( --presupuesto-font-size );
    line-height: var( --presupuesto-line-height );
    letter-spacing: var( --presupuesto-letter-spacing );
    font-weight: var( --presupuesto-font-weight );
}
.wrapper-home .presupuesto .btn {
    border-radius: 8px;
    border-color: var( --color-E30613 );
    background-color: var( --color-E30613 );
}
.wrapper-home .presupuesto .text {
    padding: 1em 1.5em;
    border-left: 3px solid var( --color-E30613 );
}
.wrapper-home .presupuesto .text *:first-child {
    font-size: var( --font-size-30 );
    line-height: 54px;
    font-weight: var( --font-weight-600 );
}
.wrapper-home .presupuesto .text *:last-child {
    font-size: var( --font-size-18 );
    line-height: 54px;
    text-transform: uppercase;
}
/***************************
 *      EMPRESA
 *************************** */
.wrapper-empresa .dato {
    font-size: var( --empresa-dato-font-size );
    line-height: var( --empresa-dato-line-height );
    letter-spacing: var( --empresa-dato-letter-spacing );
    font-weight: var( --empresa-dato-font-weight );
    color: var( --empresa-dato-font-color );
}
.wrapper-empresa .dato .title {
    font-size: var( --empresa-title-font-size );
    line-height: var( --empresa-title-line-height );
    letter-spacing: var( --empresa-title-letter-spacing );
    font-weight: var( --empresa-title-font-weight );
    color: var( --empresa-title-font-color );
}

.sello {
    width: 230px;
}
/***************************
 *      PAGINA
 *************************** */
.wrapper-page .phrase {
    font-size: var( --page-phrase-font-size );
    line-height: var( --page-phrase-line-height );
    letter-spacing: var( --page-phrase-letter-spacing );
    font-weight: var( --page-phrase-font-weight );
    color: var( --page-phrase-color );
    position: relative;
}
.wrapper-page .phrase::before {
    content: "";
    width: 20%;
    position: absolute;
    left: 0;
    bottom: 0;
    border-bottom: 1px solid var( --color-B1121B );
}
.wrapper-page .data {
    color: var( --page-data-color );
    font-size: var( --page-data-font-size );
    line-height: var( --page-data-line-height );
    letter-spacing: var( --page-data-letter-spacing );
    font-weight: var( --page-data-font-weight );
}
.wrapper-page .header .title {
    left: 15px;
    bottom: 20px;
    color: var( --page-title-color );
    font-size: var( --page-title-font-size );
    line-height: var( --page-title-line-height );
    letter-spacing: var( --page-title-letter-spacing );
    font-weight: var( --page-title-font-weight );
}
@media (max-width: 768px) {
    .carousel-caption {
        position: static !important;
    }
    .carousel-caption .texto * {
        font-size: 27px;
        line-height: 27px;
    }
    .carousel-caption .texto > * + * {
        margin-top: 10px;
        font-weight: 600;
    }
    .wrapper-page .header .title {
        position: static !important;
    }
}