Proyecto: Enco

</!DOCTYPE html>
</html lang="es">
    </head>
        </title>Portadas<//title>
        </meta charset="UTF-8">
        </meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1">
        </link rel="icon" type="image/png" href="img/favicon.png" />
        </link href="https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,300;0,400;0,500;0,600;0,700;1,800&display=swap" rel="stylesheet">
        </link href="https://fonts.googleapis.com/css2?family=Barlow:wght@200;300;400;600;700&display=swap" rel="stylesheet">
        </link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,600;0,700;1,200&display=swap" rel="stylesheet">
        </link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
        </link rel="stylesheet" href="css/style.css" />
        </link rel="stylesheet" href="css/responsive.css" />
        </link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css" />
        </script src="https://kit.fontawesome.com/88523de38a.js" crossorigin="anonymous"><//script>
        </script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"><//script>
        </script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"><//script>
        </script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"><//script>
        </script type="text/javascript" src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"><//script>
        </script type="text/javascript" src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"><//script>
    <//head>
</body class="header-body">

    </!-- BEGIN HEADER -->
    </header>
        </!-- BEGIN HEADER DESKTOP -->
        </div class="header-wrapper d-none d-lg-block">
            </div class="container">
                </div class="header-block">
                    </div class="logo">
                        </a href="#">
                            </img src="img/logo.png" alt="#"/>
                        <//a>
                    <//div>
                    </div class="header-menu-wrapper">
                        </div class="header-top">
                            </div class="social-wrapper">
                                </a href="#"></i class="fab fa-facebook"><//i><//a>
                                </a href="#"></i class="fab fa-instagram"><//i><//a>
                                </a class="balloon-lang active" href="#">EN<//a>
                            <//div>
                            </div class="links-wrapper">
                                </ul>
                                    </li></a href="#">Sobre Enco<//a><//li>
                                    </li></a href="#">Trabaja con Nosotros<//a><//li>
                                    </li></a href="#">Contacto<//a><//li>
                                <//ul>
                            <//div>
                            </div class="actions-wrapper">
                                </ul>
                                    </li>
                                        </a href="#">
                                            </img src="img/heart.svg" alt="#">
                                        <//a>
                                    <//li></li>
                                        </a href="#">
                                            </img src="img/user.svg" alt="#">
                                        <//a>
                                    <//li></li>
                                        </a href="#">
                                            </img src="img/cart.svg" alt="#">
                                        <//a>
                                    <//li>
                                <//ul>
                            <//div>
                        <//div>
                        </div class="header-bottom">
                            </nav>
                                </ul class="header-bottom-menu">
                                    </li>
                                        </a href="#">Categoria de productos<//a>
                                        </ul class="header-bottom-submenu">
                                            </li>
                                                </a href="#">Selladores Elastoméricos<//a>
                                            <//li>
                                            </li>
                                                </a href="#">Pinturas Aquitectónicas<//a>
                                            <//li>
                                            </li>
                                                </a href="#">Esmaltes Anticorrosivos<//a>
                                            <//li>
                                            </li>
                                                </a href="#">Productos para Madera<//a>
                                            <//li>
                                        <//ul>
                                    <//li>
                                    </li class="action-items">
                                        </a href="#">Historial de lo último visto<//a>
                                    <//li>
                                    </li>
                                        </a href="#">Productos destacados<//a>
                                    <//li>
                                <//ul>

                                </!-- BEGIN HISTORY BLOCK-->
                                </ul class="header-bottom-submenu header-items">
                                    </li>
                                        </a href="#">
                                            </div class="item">
                                                </div></img src="img/img-can-small.png" alt="#" /><//div>
                                                </div>Stain Blocking Allure<//div>
                                            <//div>
                                        <//a>
                                    <//li>
                                    </li>
                                        </a href="#">
                                            </div class="item">
                                                </div></img src="img/img-can-small.png" alt="#" /><//div>
                                                </div>Stain Blocking Allure<//div>
                                            <//div>
                                        <//a>
                                    <//li>
                                    </li>
                                        </a href="#">Ver</br/>Completo<//a>
                                    <//li>
                                <//ul>

                            <//nav>
                            </div class="search-wrapper">
                                </div class="search-input">
                                    </input type="text" placeholder="Estoy buscando...">
                                <//div>
                            <//div>
                        <//div>
                    <//div>
                <//div>
            <//div>
        <//div>

        </!-- BEGIN MOBILE HEADER -->
        </div class="intro-header-mob d-block d-lg-none">
            </div class="accordion" id="accordionExample">
                </div class="header-mob-wrapper">
                    </div class="container">
                        </!-- begin brand -->
                        </a class="header-brand" href="#">
                            </img src="img/logo.png" alt="crossco" />
                        <//a>
                        </div class="header-mob-buttons">
                            </button class="btn btn-link collapsed btn-plus btn-dusk" type="button" data-toggle="collapse" data-target="#collapsePlus" aria-expanded="false" aria-controls="collapsePlus"><//button>
                            </button class="btn btn-link collapsed btn-menu btn-dusk" type="button" data-toggle="collapse" data-target="#collapseMenu" aria-expanded="true" aria-controls="collapseMenu"><//button>
                        <//div>
                    <//div>
                <//div>

                </div class="card">
                    </div id="collapsePlus" class="collapse" aria-labelledby="headingPlus" data-parent="#accordionExample">
                        </div class="card-body submenu-wrapper">
                            </div class="container">
                                </nav>
                                    </ul>
                                        </li>
                                            </a href="#">Categoria de Productos<//a>
                                            </ul>
                                                </li></a href="#">Selladores Elastómericos<//a><//li>
                                                </li></a href="#">Pinturas Arquitectónicas<//a><//li>
                                                </li></a href="#">Esmaltes Anticorrosivos<//a><//li>
                                                </li></a href="#">Productos para Madera<//a><//li>
                                                </li></a href="#">Productos destacados<//a><//li>
                                            <//ul>
                                        <//li>
                                    <//ul>
                                    </ul>
                                        </li>
                                            </a href="#">Historial de lo último visto<//a>
                                            </ul>
                                                </li></a href="#">Stain Blocking Allure<//a><//li>
                                                </li></a href="#">Stain Blocking Allure<//a><//li>
                                                </li></a href="#">Ver Completo<//a><//li>
                                            <//ul>
                                        <//li>
                                    <//ul>
                                <//nav>
                            <//div>
                        <//div>
                    <//div>
                <//div>
                </div class="card">
                    </div id="collapseMenu" class="collapse" aria-labelledby="headingMenu" data-parent="#accordionExample">
                        </div class="card-body submenu-wrapper">
                            </div class="container">
                                </input class="input-search" type="text" placeholder="Buscar">
                                </nav>
                                    </ul>
                                        </li></a href="#">Sobre Enco<//a><//li>
                                        </li></a href="#">Trabaja con nosotros<//a><//li>
                                        </li></a href="#">Contacto<//a><//li>
                                        </li></a href="#">Favoritos<//a><//li>
                                        </li></a href="#">Iniciar Sesión<//a><//li>
                                    <//ul>
                                <//nav>
                            <//div>
                        <//div>
                    <//div>
                <//div>
            <//div>
            </div class="balloon-bg">
                </div class="container block-relative">
                    </div class="wrapper-balloon-lang balloon-mob">
                        </a class="btn-cart" href="#"><//a>
                        </a class="balloon-lang active" href="#">EN<//a>
                    <//div>
                <//div>
            <//div>
        <//div>
    <//header>

    </!-- BEGIN CAROUSEL -->
    </div id="carousel-featured" class="carousel slide" data-ride="carousel" data-touch="true">
        </ol class="carousel-indicators carousel-dots">
            </li data-target="#carousel-featured" data-slide-to="0" class="active"><//li>
            </li data-target="#carousel-featured" data-slide-to="1"><//li>
            </li data-target="#carousel-featured" data-slide-to="2"><//li>
        <//ol>
        </div class="carousel-inner">
            </div class="carousel-item carousel-block active" style="background-image: url('img/img-featured.jpg')">
                </div class="carousel-info container">
                    </h1 class="title">La pintura más avanzada de nuestra generación<//h1>
                    </a class="btn-default mt-2" href="#">Ver Más<//a>
                <//div>
            <//div>
            </div class="carousel-item carousel-block" style="background-image: url('img/img-featured.jpg')">
                </div class="carousel-info container">
                    </h1 class="title">La pintura más avanzada de nuestra generación<//h1>
                    </a class="btn-default mt-2" href="#">Ver Más<//a>
                <//div>
            <//div>
            </div class="carousel-item carousel-block" style="background-image: url('img/img-featured.jpg')">
                </div class="carousel-info container">
                    </h1 class="title">La pintura más avanzada de nuestra generación<//h1>
                    </a class="btn-default mt-2" href="#">Ver Más<//a>
                <//div>
            <//div>
        <//div>
        </div class="carousel-control-wrapper">
            </div class="block-relative container">
                </a class="carousel-control-prev" href="#carousel-featured" role="button" data-slide="prev">
                    </span class="carousel-control-prev-icon" aria-hidden="true"><//span>
                    </span class="sr-only">Previous<//span>
                <//a>
                </a class="carousel-control-next" href="#carousel-featured" role="button" data-slide="next">
                    </span class="carousel-control-next-icon" aria-hidden="true"><//span>
                    </span class="sr-only">Next<//span>
                <//a>
            <//div>
        <//div>
    <//div>

    </!-- BEGIN FRAMES CAROUSEL -->
    </div class="frames-wrapper">
        </div class="container">
            </div class="title-wrapper">
                </h2 class="title-text">Productos en </b>oferta<//b><//h2>
                </small class="subtitle-text">Conoce los productos que estan en oferta por esta temporada<//small>
            <//div>
            </div class="frames-row">
                </div class="frames-block text-center">
                    </a class="frames-img" href="#">
                        </img src="img/img-can-medium.png" alt="#" />
                    <//a>
                    </h3 class="frames-title mb-2">STAIN BLOCKING ALLURE<//h3>
                    </div>
                        </span class="price-actual">$25.00<//span>
                        </span class="price-old">$25.00<//span>
                    <//div>
                    </a class="btn-default mt-2" href="#">Ver más<//a>
                <//div>
                </div class="frames-block text-center">
                    </a class="frames-img" href="#">
                        </img src="img/img-can-medium.png" alt="#" />
                    <//a>
                    </h3 class="frames-title mb-2">STAIN BLOCKING ALLURE<//h3>
                    </div>
                        </span class="price-actual">$25.00<//span>
                        </span class="price-old">$25.00<//span>
                    <//div>
                    </a class="btn-default mt-2" href="#">Ver más<//a>
                <//div>
                </div class="frames-block text-center">
                    </a class="frames-img" href="#">
                        </img src="img/img-can-medium.png" alt="#" />
                    <//a>
                    </h3 class="frames-title mb-2">STAIN BLOCKING ALLURE<//h3>
                    </div>
                        </span class="price-actual">$25.00<//span>
                        </span class="price-old">$25.00<//span>
                    <//div>
                    </a class="btn-default mt-2" href="#">Ver más<//a>
                <//div>
                </div class="frames-block text-center">
                    </a class="frames-img" href="#">
                        </img src="img/img-can-medium.png" alt="#" />
                    <//a>
                    </h3 class="frames-title mb-2">STAIN BLOCKING ALLURE<//h3>
                    </div>
                        </span class="price-actual">$25.00<//span>
                        </span class="price-old">$25.00<//span>
                    <//div>
                    </a class="btn-default mt-2" href="#">Ver más<//a>
                <//div>
            <//div>
        <//div>
    <//div>

    </!-- BEGIN SPLIT BLOCK -->
    </div class="split-wrapper">
        </div class="row no-gutters">
            </div class="split-block col-lg-6 p-0" style="background-image: url('img/img-split-1.jpg')">
                </div class="split-info">
                    </h3 class="split-title">Esmaltes Anticorrosivos<//h3>
                    </a class="btn-default" href="#">Ver Más<//a>
                <//div>
            <//div>
            </div class="split-block col-lg-6 p-0" style="background-image: url('img/img-split-2.jpg')">
                </div class="split-info">
                    </h3 class="split-title">Selladores Elastoméricos<//h3>
                    </a class="btn-default" href="#">Ver Más<//a>
                <//div>
            <//div>
        <//div>
    <//div>

    </!-- BEGIN NEWSLETTER -->
    </div class="newsletter-wrapper">
        </div class="container">
            </div class="title-wrapper">
                </h2 class="title-text">Únete a nuestra comunidad<//h2>
                </small class="subtitle-text">
                    Suscríbase a nuestro boletín y 
                    reciba nuestras últimas noticias, 
                    ofertas y promociones exclusivas.
                <//small>
            <//div>
            </div class="input-wrapper">
                </input class="input-email" type="email" placeholder="Ingrese su correo" />
            <//div>
        <//div>
    <//div>

    </!-- BEGIN IMAGE LARGE -->
    </div class="image-wrapper">
        </img src="img/img-enco.jpg" alt="#" />
    <//div>

     </!-- BEGIN FOOTER -->
     </footer>
        </div class="container">
            </div class="footer-row d-lg-flex text-lg-left">
                </div class="footer-block flex-fill d-none d-lg-block">
                    </h3>Contacto<//h3>
                    </address>
                        Baldorioty Street #43 Cidra, Fax (787) 739-2242
                    <//address>
                    </a class="icon-phone" href="tel:+1787-739-3751">787-739-3751<//a>
                <//div>
                </div class="footer-block flex-fill d-none d-lg-block">
                    </h3>Contenido<//h3>
                    </ul>
                        </li></a href="#">Sobre ENCO<//a><//li>
                        </li></a href="#">Trabaja con nosotros<//a><//li>
                        </li></a href="#">Contacto<//a><//li>
                    <//ul>
                    </ul>
                        </li></a href="#">Categoria de productos<//a><//li>
                        </li></a href="#">Historial de lo último visto<//a><//li>
                        </li></a href="#">Productos destacados<//a><//li>
                    <//ul>
                <//div>
                </div class="footer-block flex-fill d-none d-lg-block">
                    </h3>Servicio al Cliente<//h3>
                    </ul>
                        </li></a href="#">Preguntas frecuentes<//a><//li>
                        </li></a href="#">Politica de privacidad<//a><//li>
                        </li></a href="#">Politica de devolución<//a><//li>
                        </li></a href="#">Envío<//a><//li>
                    <//ul>
                <//div>
                </div class="footer-block flex-fill">
                    </h3>Suscribirse<//h3>
                    </input class="input-email" type="text" placeholder="Ingrese su correo">
                    </div class="footer-social">
                        </a href="#"></i class="fab fa-facebook" aria-hidden="true"><//i><//a>
                        </a href="#"></i class="fab fa-instagram" aria-hidden="true"><//i><//a>
                        </a class="balloon-lang active" href="#">EN<//a>
                    <//div>
                <//div>
            <//div>
        <//div>
    <//footer>


    </script src="js/common.js"><//script>
<//body>
<//html>
body {
    font-family: 'Raleway', sans-serif;
}
.header-body {
    padding-top: 117px;
}
.header-body header {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 100;
    position: fixed;
}
ul {
    margin: 0;
    padding: 0;
}
.header-wrapper {
    z-index: 1;
    position: relative;
    box-shadow: 0 2px 3px rgba(0,0,0,.2);
    background-image: linear-gradient(90deg, #0062d4 50%, #dcdcdc 50%);
    background-image: -webkit-linear-gradient(90deg, #0062d4 50%, #dcdcdc 50%);
}
.header-top,
.header-bottom {
    height: 50%;
    min-height: 1em;
}
.header-top {
    display: flex;
    align-items: center;
    background-color: #DCDCDC;
}
.header-bottom {
    height: 50%;
    align-items: center;
    display: inline-flex;
    background-color: #0063D4;
}
.logo {
    display: flex;
    grid-row: span 2;
    align-items: center;
    background-color: #004494;
}
.logo img {
    max-height: 140px;
}
.header-menu-wrapper {
    width: 100%;
}
.header-block {
    display: flex;
    flex-direction: row;
}
.social-wrapper {
    font-size: 22px;
    display: inline-flex;
    height: 100%;
    align-items: center;
    padding-left: 10px;
}
.social-wrapper a {
    display: flex;
    font-size: 33px;
    color: #004594;
    margin-left: 10px;
    text-decoration: none;
}
a.balloon-lang {
    width: 32px;
    color: #fff;
    height: 32px;
    display: flex;
    font-size: 12px;
    font-weight: 300;
    border-radius: 50%;
    position: relative;
    text-align: center;
    align-items: center;
    text-decoration: none;
    justify-content: center;
    background-color: #004594;
}
.balloon-lang:before {
    right: 0;
    width: 0;
    bottom: 0;
    height: 0;
    content: '';
    display: block;
    position: absolute;
    transform: rotate(-40deg);
    border-top: 8px solid #004594;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
}
.links-wrapper {
    width: 100%;
    text-align: right;
}
.links-wrapper li,
.actions-wrapper li {
    display: inline-block;
}
.links-wrapper li a {
    color: #000;
    font-size: 12px;
    font-weight: 500;
    margin-left: 30px;
}
.links-wrapper li:first-child a {
    margin-left: 0;
}
.actions-wrapper {
    height: 100%;
    display: flex;
    margin-left: 30px;
}
.actions-wrapper ul {
    align-items: center;
    display: inline-flex;
}
.actions-wrapper li {
    height: 100%;
}
.actions-wrapper a {
    height: 100%;
    margin: 0 2px;
    padding: 0 20px;
    align-items: center;
    display: inline-flex;
    background-color: #004594;
}
.actions-wrapper img {
    max-height: 30px;
}
.header-bottom-menu {
    display: inline-flex;
}
.header-items li,
.header-bottom-menu li {
    list-style: none;
}
.header-bottom-menu li a {
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    max-width: 130px;
    font-weight: 600;
    text-align: center;
    display: inline-block;
    text-decoration: none;
}
.header-bottom-menu > li > a {
    padding: 16px 20px;
    text-decoration: none;
}
.header-bottom-menu li:first-child a {
    margin-left: 0;
}
.header-bottom,
.search-wrapper,
.header-bottom nav,
.list-amount-block {
    width: 100%;
}
.search-wrapper {
    text-align: right;
}
.search-wrapper input {
    border: none;
    outline: none;
    min-width: 300px;
    padding: 7px 15px;
    border-radius: 6px;
    background: url('../img/search.svg') 95% center no-repeat #fff;
    background-size: 20px;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #DCDCDC;
    font-size: 12px;
    line-height: 25px;
}
::-moz-placeholder { /* Firefox 19+ */
    color: #DCDCDC;
    font-size: 12px;
    line-height: 25px;
}
:-ms-input-placeholder { /* IE 10+ */
    color: #DCDCDC;
    font-size: 12px;
    line-height: 25px;
}
:-moz-placeholder { /* Firefox 18- */
    color: #DCDCDC;
    font-size: 12px;
    line-height: 25px;
}
.link-active,
.header-bottom-menu > li:hover > a {
    color: #004494 !important;
    background-color: #dcdcdc;
}

/* BEGIN MOBILE HEADER */
.block-relative {
    position: relative;
}

.header-brand {
    float: left;
}

.header-brand img {
    display: block;
    max-height: 55px;
}

.wrapper-balloon-lang {
    top: 0;
    bottom: 0;
    margin-left: 25px;
    position: absolute;
    align-items: center;
    display: inline-flex;
}

.balloon-lang {
    width: 32px;
    color: #fff;
    height: 32px;
    display: flex;
    font-size: 12px;
    font-weight: 300;
    margin-left: 7px;
    border-radius: 50%;
    position: relative;
    text-align: center;
    align-items: center;
    text-decoration: none;
    justify-content: center;
    background-color: #707070;
}

.footer-block li a,
.balloon-lang:hover {
    color: #fff;
}

.balloon-lang.active:before {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
}

.balloon-mob {
    left: 0;
    right: 0;
    top: auto;
    margin: 0;
    display: flex;
    bottom: -45px;
    padding: 5px 15px;
    justify-content: flex-end;
}

.balloon-bg {
    background-color: rgba(0, 98, 212, .80);
    height: 62px;
}

.balloon-bg .balloon-mob {
    bottom: -62px;
    padding: 15px;
}

.intro-header-mob,
.header-mob-wrapper {
    z-index: 2;
    position: relative;
    box-shadow: 0 -2px 5px rgba(0, 0, 0.5);
}

.intro-header-mob .card {
    width: 100%;
    border: none;
}

.intro-header-mob .btn-link {
    float: left;
    width: 32px;
    height: 32px;
    display: block;
    margin-left: 5px;
    border-radius: 50%;
    background: url('../img/icon-menu-active.png') center no-repeat;
    background-size: contain;
}

.intro-header-mob .accordion {
    background-color: #dcdcdc;
}

.btn-menu.btn-clear {
    background: url('../img/icon-menu-active.png') center no-repeat;
}

.btn-menu.btn-clear.collapsed {
    background: url('../img/icon-menu.png') center no-repeat;
}

.btn-menu.btn-dusk {
    background: url('../img/icon-menu-active.png') center no-repeat;
    background-size: contain;
}

.btn-plus.btn-dusk {
    background: url('../img/icon-plus.png') center no-repeat;
    background-size: contain;
}

.btn-menu.btn-dusk.collapsed {
    background: url('../img/icon-menu-dusk.png') center no-repeat;
    background-size: contain;
}

.btn-plus.btn-dusk.collapsed {
    background: url('../img/icon-plus-dusk.png') center no-repeat;
    background-size: contain;
}

.header-mob-buttons {
    float: right;
    margin: 10px 0 10px 10px;
}

.intro-header-mob .input-search {
    width: 100%;
    display: block;
    max-width: none;
    margin: 0 0 20px;
}

.submenu-wrapper {
    padding: 35px;
    overflow: auto;
    background-color: #0062d4;
}

.submenu-wrapper ul {
    margin-top: 15px;
}
.summary-items li:first-child,
.summary-amount li:first-child,
.submenu-wrapper ul:first-child,
.list-amount-block li:first-child,
.spot-list-wrapper ul li:first-child {
    margin-top: 0;
}

.submenu-wrapper li {
    display: block;
    margin-top: 10px;
}

.submenu-wrapper li:first-child {
    margin-top: 0;
}

.submenu-wrapper a {
    font-size: 14px;
    color: #DCDCDC;
    text-decoration: none;
}

.submenu-wrapper ul ul {
    margin-top: 10px;
}

.submenu-wrapper ul ul a {
    color: #fff;
    font-size: 12px;
}

.intro-header-mob .card {
    border-radius: 0;
}

/*-- begin main menu --*/
.input-search {
    border: none;
    outline: none;
    max-width: 180px;
    margin-left: 45px;
    border-radius: 30px;
    display: inline-block;
    padding: 7px 5px 7px 35px;
    font-size: 12px !important;
    background: url('../img/icon-search.png') 13px 10px #fff no-repeat;
    background-size: 15px;
}

.input-search::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #000;
}

.input-search::-moz-placeholder {
    /* Firefox 19+ */
    color: #000;
}

.input-search:-ms-input-placeholder {
    /* IE 10+ */
    color: #000;
}

.input-search:-moz-placeholder {
    /* Firefox 18- */
    color: #000;
}

.search-cart-wrapper {
    float: right;
}

.btn-cart {
    width: 32px;
    height: 32px;
    float: right;
    margin-left: 10px;
    border-radius: 50%;
    background: url('../img/icon-cart.png') center no-repeat;
    background-size: contain;
}

.item {
    display: flex;
    font-size: 11px;
    font-weight: 600;
    text-align: left;
    max-width: 180px;
    align-items: center;
    text-transform: uppercase;
}
.item img {
    margin: 8px;
    height: auto;
    display: block;
    max-height: 54px;
}
.header-items {
    padding: 0;
    bottom: -70px;
}
.header-items a {
    height: 100%;
    padding-left: 20px;
    align-items: center;
    display: flex !important;
    max-width: 180px !important;
}
.show-block {
    opacity: 1 !important;
    visibility: visible !important;
}

/*-- BEGIN CAROUSEL FEATURED --*/
.carousel-block {
    font-size: .5rem;
    padding: 50px 30px;
    position: relative;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.carousel-block .title {
    color: #fff;
    font-size: 4em;
    font-weight: 700;
    max-width: 350px;
    letter-spacing: 1.7px;
    text-transform: uppercase;
}
.btn-default {
    border: none;
    color: #fff;
    font-size: 1em;
    font-weight: 200;
    padding: 10px 60px;
    border-radius: 8px;
    display: inline-block;
    text-transform: uppercase;
    background-color: #004594;
    font-family: 'Barlow', sans-serif;
}
.btn-default:hover {
    color: #000 !important;
    background-color: #dcdcdc;
}
.btn-default:focus {
    outline: none;
}
.btn-fit {
    padding: 10px 20px;
}
.carousel-info .btn-default {
    font-size: 2em;
}
.btn-default:hover {
    color: #fff; 
    text-decoration: none;
}
.slick-arrow {
    top: 50%;
    z-index: 1;
    width: 40px;
    height: 50px;
    border: none;
    margin-top: -25px;
    position: absolute;
    text-indent: -9999em;
    outline: none !important;
    background-size: 57px !important;
}

.slick-prev {
    /* left: 6%; */
    background: url(../img/arrow-prev.png) no-repeat center;
}

.slick-next {
    right: 0;
    background: url(../img/arrow-next.png) no-repeat center;
}
/* .carousel-block::before {
    top: 0;
    left: 0;
    bottom: 0;
    right: 50%;
    content: "";
    opacity: .6;
    display: block;
    position: absolute;
    background-color: var(--bg-color);
} */
.carousel-info {
    z-index: 1;
    position: relative;
    padding: 4em 2.5em 7em;
}
.carousel-dots li {
    opacity: 1;
    width: 13px;
    height: 13px;
    margin: 0 10px;
    border-radius: 50%;
    text-indent: -9999em;
    display: inline-block;
    background-color: #0050A0;
}
.carousel-dots li.active {
    background-color: #fff;
}
#carousel-featured .carousel-control-prev,
#carousel-featured .carousel-control-next {
    width: 7%;
    opacity: 0;
    visibility: hidden;
}
#carousel-featured .carousel-control-prev-icon {
    background-image: url(../img/arrow-prev.png);
}
#carousel-featured .carousel-control-next-icon {
    background-image: url(../img/arrow-next.png);
}
#carousel-featured .carousel-control-prev-icon,
#carousel-featured .carousel-control-next-icon {
    width: 60px;
    height: 60px;
}

.carousel-control-wrapper {
    top: 0;
    bottom: 0;
    width: 100%;
    display: flex;
    position: absolute;
}


/* -- BEGIN FRAMES CAROUSEL -- */
.frames-wrapper {
    padding: 50px 0;
    font-family: 'Barlow', sans-serif;
}
.carousel-title {
    font-size: 18px;
    color: #004594;
    letter-spacing: 2.4px;
    text-transform: uppercase;
}
.title-wrapper {
    padding: 0 15px;
    text-align: center;
    position: relative;
    font-family: 'Raleway', sans-serif;
}
.title-thin {
    font-size: 18px;
    color: #004594;
    font-weight: 200;
    text-transform: uppercase;
    font-family: 'Barlow', sans-serif;
}
.title-wrapper .title-text {
    margin: 0;
    font-size: 37px;
    font-weight: 600;
    color: #004594;
    letter-spacing: 4px;
    text-transform: uppercase;
}
.title-wrapper small {
    color: #5E5857;
    font-size: 18px;
}
.frames-img img {
    margin: 0 auto;
    max-height: 170px;
}
.frames-title {
    display: block;
    font-size: 20px;
    font-weight: 400;
    max-width: 200px;
    margin: 5px auto 0;
    letter-spacing: 1px;
}
.frames-row {
    margin-top: 40px;
}
.price-actual,
.price-old {
    font-size: 20px;
    color: #004594;
    font-weight: 700;
}
.price-old {
    font-size: 16px;
    font-weight: 300;
    text-decoration: line-through;
}
.frames-row .slick-prev {
    background-image: url(../img/arrow-prev-color.png);
}
.frames-row .slick-next {
    background-image: url(../img/arrow-next-color.png);
}

/* -- BEGIN SPLIT BLOCK -- */
.split-block {
    position: relative;
    align-items: center;
    background-repeat: no-repeat;
    background-size: cover;
    font-family: 'Barlow', sans-serif;
}
.split-title {
    color: #fff;
    font-size: 2em;
    font-weight: 300;
    letter-spacing: 4px;
    margin-bottom: 20px;
    text-transform: uppercase;
}
.split-info {
    z-index: 1;
    position: relative;
    padding: 3em 1.5em 7em;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}
/* -- BEGIN NEWSLETTER BLOCK -- */
.newsletter-wrapper {
    padding: 3em 15px;
    background-color: #004594;
}
.newsletter-wrapper .title-text,
.newsletter-wrapper .subtitle-text {
    color: #fff;
}
.input-wrapper {
    margin: 2em auto 0;
    text-align: center;
}
.input-email {
    border: none;
    outline: none;
    border-radius: 8px;
    padding: 6px 40px 6px 15px;
    background: url('../img/icon-plane.png') 95% center no-repeat #fff;
    background-size: 8%;
}
.input-email::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #000;
}
.input-email::-moz-placeholder { /* Firefox 19+ */
    color: #000;
}
.input-email:-ms-input-placeholder { /* IE 10+ */
    color: #000;
}
.input-email:-moz-placeholder { /* Firefox 18- */
    color: #000;
}
.image-wrapper img {
    width: 100%;
    height: auto;
    display: block;
}
/* -- BEGIN FOOTER -- */
footer {
    padding: 3em 0;
    color: #fff;
    background-color: #004594;
    font-family: 'Barlow', sans-serif;
}

address,
.icon-phone {
    color: #fff;
    max-width: 200px;
    padding-left: 27px;
    background: url(../img/icon-location.png) 0 4px no-repeat;
    background-size: 18px;
}

.icon-phone {
    line-height: 24px;
    background-image: url(../img/icon-phone.png);
    padding: 0 5px 5px 25px;
    background-position: 0 3px;
}

footer h3 {
    font-size: 18px;
    font-weight: 300;
    letter-spacing: 1px;
    margin-bottom: 10px;
    text-transform: uppercase;
}
.footer-block li {
    display: block;
    margin-top: 5px;
    font-size: 14px;
    font-weight: 300;
}
.footer-block ul {
    margin-bottom: 15px;
}
.footer-social {
    display: flex;
    margin-top: 20px;
    align-items: center;
}
.footer-social a {
    color: #fff;
    font-size: 32px;
    margin-right: 10px;
    display: inline-flex;
    text-decoration: none;
}
.footer-social .balloon-lang {
    margin: 0;
    width: 30px;
    height: 30px;
    font-size: 12px;
    color: #004494;
    background-color: #fff;
}
.footer-social .balloon-lang:before {
    border-top-color: #fff;
}
.footer-block .input-email {
    font-family: 'Raleway', sans-serif;
}
/* -- BEGIN CATEGORY PAGE -- */
.sidebar-wrapper {
    font-family: 'Barlow', sans-serif;
}
.sidebar-wrapper .frames-title {
    font-size: 16px;
}
.product-calification {
    border: none;
    outline: none;
    display: block;
    margin: 0 auto;
    font-size: 12px;
    font-weight: 300;
    background: none;
    color: #0050A0;
}
.product-title {
    font-size: 22px;
    color: #5E5857;
    font-weight: 600;
}
.product-price {
    display: block;
    font-size: 20px;
    color: #004594;
    font-weight: 700;
    text-align: center;
}
.products-item {
    padding: 0 60px 20px 60px;
}
.products-item img {
    margin: 0 auto;
    max-height: 260px;
}
.square-title {
    font-size: 18px;
    font-weight: 700;
    color: #004494;
    text-transform: uppercase;
    font-family: 'Barlow', sans-serif;
}
.square-item img {
    width: 100%;
    height: auto;
    display: block;
    padding-right: 10px;
}
.square-item small {
    display: block;
}
.square-item-title {
    display: block;
    font-size: 12px;
    color: #5E5857;
    font-weight: 600;
    line-height: 16px;
    margin-bottom: 5px;
}
.square-item-subtitle {
    font-size: 12px;
    color: #004594;
    font-weight: 600;
}
.btn-close {
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    border: none;
    display: block;
    position: absolute;
    text-indent: -99999em;
    background: url('../img/icon-close.png') center no-repeat;
    background-size: 14px;
}
.btn-close:focus {
    outline: none;
}
.square-item-amount {
    margin: 15px 0;
    font-size: 12px;
    font-weight: 700;
    color: #5E5857;
    font-family: 'Raleway', sans-serif;
}
.square-item-amount span:first-child {
    color: #0050A0;
}
.btn-default-outline {
    width: 100%;
    display: block;
    color: #004594;
    margin-top: 10px;
    padding: 7px 15px;
    border-radius: 8px;
    text-transform: uppercase;
    border: 1px solid #004594;
    background-color: transparent;
}
.products-wrapper-mob .slick-dots {
    display: flex;
    text-align: center;
    align-items: center;
    margin-bottom: 30px;
    justify-content: center;
}
.products-wrapper-mob .slick-dots li {
    list-style: none;
    display: inline-flex;
}
.products-wrapper-mob .slick-dots li button {
    width: 10px;
    height: 12px;
    border: none;
    margin: 0 6px;
    border-radius: 50%;
    text-indent: -9999em;
    background-color: #0050A0;
}
.products-wrapper-mob .slick-dots li.active button {
    background-color: #fff;
}
.breadcrumb {
    font-size: 12px;
    font-weight: 500;
    padding: 25px 0 25px;
    background-color: transparent;
    font-family: 'Raleway', sans-serif;
}
.breadcrumb a,
.breadcrumb-item.active {
    color: #0050A0;
}
.breadcrumb-item+.breadcrumb-item::before {
    content: "-";
}

/* -- BEGIN SINGLE PAGE -- */
.single-wrapper-row {
    padding: 20px 0;
    align-items: center;
}

.single-info-row,
.single-product-wrapper {
    text-align: center;
}

.single-info-img img {
    display: block;
    max-width: 100%;
    max-height: 330px;
}

.single-subtitle {
    display: block;
    font-size: 14px;
    color: #5E5857;
    font-weight: 700;
    text-transform: uppercase;
}

.single-title {
    margin: 0;
    font-size: 20px;
    color: #004494;
    font-weight: 600;
    text-transform: uppercase;
}

.single-caption {
    font-size: 14px;
    margin: 5px 0 0;
}

.single-price {
    display: block;
    font-size: 24px;
}
.cart-wrapper-mob {
    margin-bottom: 40px;
}


/*-- begin dropdown colors --*/

.scrollable-list {
    width: 100%;
    float: left;
    display: none;
    color: #666;
    padding: 5px 0;
    min-width: 115px;
    background: #FFF;
    border-radius: 3px;
    border-radius: 30px;
    border: 1px solid #5E5857;
}

.scrollable-list ul {
    margin: 0;
    padding: 0;
    z-index: 1;
    margin-top: 17px;
    position: absolute;
    border-radius: 4px;
    background-color: #fff;
    padding: 3px 0px 3px 0px;
    border: 1px solid #5E5857;
}

.scrollable-list ul li {
    margin: 8px;
    cursor: pointer;
    list-style: none;
    line-height: 25px;
    text-indent: -9999em;
}

.selected-option {
    cursor: pointer;
    font-size: 12px;
    padding: 0 10px;
    text-transform: uppercase;
    font-weight: 400 !important;
}

.scrollable-list ul li:hover {
    color: #c33;
}

.selected-option:hover {
    color: #333;
}

.scrollable-list i {
    width: 23px;
    height: 23px;
    display: block;
    border-radius: 3px;
    text-indent: -99999em;
    border: 1px solid #DCDCDC;
}

.scrollable-list,
.input-dropdown {
    border-radius: 8px;
    background: url('../img/dropdown.png') right center no-repeat;
    background-size: 20px;
}

.input-dropdown select {
    width: 100%;
    outline: none;
    font-size: 12px;
    color: #5E5857;
    appearance: none;
    background: none;
    padding: 8px 15px;
    border-radius: 8px;
    -moz-appearance: none;
    -webkit-appearance: none;
    border: 1px solid #5E5857;
}

.label-single {
    color: #5E5857;
    font-size: 12px;
}

.input-number {
    width: 100%;
    outline: none;
    font-size: 14px;
    appearance: none;
    padding: 6px 15px;
    border-radius: 8px;
    -moz-appearance: none;
    -webkit-appearance: none;
    border: 1px solid #5E5857;
    background: url('../img/input-number.png') right center no-repeat;
    background-size: 22px;
}


/* Chrome, Safari, Edge, Opera */

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}


/* Firefox */

input[type=number] {
    -moz-appearance: textfield;
}

.input-block {
    margin-top: 10px;
}

.single-button-wrapper {
    margin-top: 20px;
    align-items: center;
}

.single-button-wrapper .button-normal {
    margin: 0;
}

.single-social {
    display: flex;
    margin-top: 15px;
    text-align: center;
    align-items: center;
    justify-content: center;
}

.single-social span {
    font-size: 14px;
    margin-right: 10px;
}

.single-social a {
    margin: 0 3px;
    font-size: 25px;
    color: #DCDCDC;
    display: inline-block;
}
.rating-stars {
    margin-top: 5px;
    font-size: 18px;
}

.rating-stars ul {
    padding: 0;
    display: inline-block;
    list-style-type: none;
    -moz-user-select: none;
    -webkit-user-select: none;
}

.rating-count {
    color: #000;
    font-size: 14px;
    font-weight: 400;
    margin-left: 5px;
    font-style: normal;
}

.rating-stars ul>li.star {
    display: inline-block;
}

.rating-stars ul>li.star>i.fa {
    color: #ccc;
}

.rating-stars li.star .fa-star,
.rating-stars ul>li.star.hover>i.fa,
.rating-stars ul>li.star.selected>i.fa {
    color: #004594;
}
.input-number::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #000;
    font-size: 14px;
}
.input-number::-moz-placeholder { /* Firefox 19+ */
    color: #000;
    font-size: 14px;
}
.input-number:-ms-input-placeholder { /* IE 10+ */
    color: #000;
    font-size: 14px;
}
.input-number:-moz-placeholder { /* Firefox 18- */
    color: #000;
    font-size: 14px;
}
.tabs-wrapper {
    margin-top: 40px;
    font-family: 'Raleway', sans-serif;
}
.tabs-wrapper .nav-pills a {
    padding: 12px;
    font-size: 12px;
    color: #5E5857;
    font-weight: 600;
    text-align: center;
    margin-bottom: 10px;
    background-color: #DCDCDC;
    border-radius: 10px 30px 10px 10px;
}
.nav-pills .nav-link.active, 
.nav-pills .show>.nav-link {
    background-color: #004594;
}
.tab-content p {
    font-size: 14px;
}
.btn-download-wrapper {
    width: 100%;
    text-align: center;
}
.btn-download-wrapper a {
    color: #000;
    font-size: 14px;
    font-weight: 200;
    margin-left: 20px;
    display: inline-block;
    text-transform: uppercase;
}
.btn-download-wrapper span {
    display: block;
    line-height: 30px;
    padding-right: 45px;
    background: url(../img/icon-download.png) right center no-repeat;
    background-size: contain;
}
.btn-download-wrapper a:first-child {
    margin-left: 0;
}
/* -- BEGIN TABLE BLOCK -- */
.icon-rounded-close {
    width: 27px;
    height: 27px;
    border: none;
    background: url('../img/icon-rounded-close.png') center no-repeat;
    background-size: contain;
}
.table-wrapper {
    width: 100%;
    font-size: 16px;
    color: #5E5857;
    font-weight: 600;
    text-transform: uppercase;
    font-family: 'Barlow', sans-serif;
}
.table-wrapper th {
    color: #B2B2B2;
    text-transform: initial;
    font-family: 'Raleway', sans-serif;
}
.table-wrapper td b {
    color: #004594;
}
.table-wrapper img {
    display: block;
    max-height: 100px;
}
.table-wrapper .input-number {
    max-width: 80px;
    border-radius: 5px;
    border-color: #DCDCDC;
}
.table-wrapper .input-block {
    margin-top: 0;
}
.amount-wrapper {
    background-color: #DCDCDC;
}
.total-wrapper {
    padding: 15px 0;
    background-color: #004594;
}
.amount-wrapper,
.total-wrapper {
    text-transform: uppercase;
    font-family: 'Barlow', sans-serif;
}
.coupon-block {
    max-width: 360px;
    padding: 30px 0 30px;
}
.coupon-block span {
    display: block;
    color: #5E5857;
    margin-bottom: 15px;
    font-weight: 600;
}
.coupon-block .btn-action {
    width: 100%;
    max-width: 200px;
}
.input-action {
    width: 100%;
    border: none;
    padding: 7px 15px;
    border-radius: 5px;
}
.btn-action {
    border: none;
    color: #fff;
    font-size: 12px;
    font-weight: 300;
    border-radius: 8px;
    padding: 10px 20px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    background-color: #004494;
}
.list-amount-wrapper {
    height: 100%;
    display: flex;
    align-items: center;
}
.list-amount-block li {
    display: block;
    margin-top: 5px;
    overflow: hidden;
    font-weight: 600;
    color: #5E5857;
}
.list-amount-block li i {
    float: right;
    color: #004594;
    font-style: normal;
}
.total-wrapper .list-amount-block li,
.total-wrapper .list-amount-block li i {
    color: #fff;
    font-size: 18px;
    font-weight: 600;
}
.buttons-wrapper {
    margin-bottom: 30px;
    font-family: 'Barlow', sans-serif;
}
.buttons-wrapper .btn-action {
    margin-left: 10px;
}
.buttons-wrapper .btn-action:first-child {
    margin-left: 0;
}
.input-field {
    width: 100%;
    min-height: 38px;
    padding: 5px 15px;
    border-radius: 3px;
    border: 1px solid #DCDCDC;
}
.form-wrapper label {
    color: #000;
    display: block;
    font-size: 12px;
    margin-bottom: 10px;
}
.form-wrapper .input-dropdown select {
    border-radius: 3px;
    border: 1px solid #DCDCDC;
}
.input-cover {
    margin-top: 15px;
}
.form-wrapper textarea.input-field {
    min-height: 100px;
}
.summary-wrapper {
    margin: 30px 0;
}
.summary-title {
    margin: 0;
    color: #fff;
    padding: 15px;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
    background-color: #004594;
    font-family: 'Barlow', sans-serif;
}
.summary-items {
    padding: 15px;
    font-size: 14px;
    color: #5E5857;
    font-family: 'Barlow', sans-serif;
}
.summary-items li,
.summary-amount li {
    margin-top: 10px;
    overflow: hidden;
    text-transform: uppercase;
}
.summary-items i {
    float: right;
    font-size: 12px;
    color: #004594;
    font-weight: 600;
    font-style: normal;
}
.summary-amount {
    padding: 15px;
    font-size: 14px;
    color: #5E5857;
    font-weight: 700;
    background-color: #DCDCDC;
    font-family: 'Montserrat', sans-serif;
}
.summary-total {
    color: #fff;
    padding: 15px;
    font-size: 18px;
    font-weight: 600;
    overflow: hidden;
    text-transform: uppercase;
    background-color: #004594;
    font-family: 'Montserrat', sans-serif;
}
/* -- BEGIN PAGE WRAPPER -- */
.page-wrapper {
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}
.intro-img-wrapper {
    height: 100%;
    display: flex;
    text-align: center;
    align-items: center;
    justify-content: center;
    background-color: #014493;
}
.intro-img {
    width: 100%;
    display: block;
}
.intro-text {
    height: 100%;
    font-size: 13px;
    color: #004594;
    padding-top: 70px;
    font-family: 'Montserrat', sans-serif;
}
.intro-list {
    width: 100%;
    display: flex;
    margin-top: 30px;
    justify-content: space-between;
}
.intro-list li {
    width: 100%;
    color: #fff;
    display: flex;
    font-size: 16px;
    list-style: none;
    min-width: 100px;
    padding: 30px 30px;
    width: min-content;
    align-items: center;
    width: min-intrinsic;
    word-wrap: break-word;
    width: -moz-min-content;
    width: -webkit-min-content;
    background-color: #014493;
    -ms-grid-columns: min-content;
    font-family: 'Barlow', sans-serif;
}
.intro-wrapper {
    padding: 70px 0;
}
.text-wrapper {
    padding: 50px 0;
    font-size: 13px;
    background-color: #fff;
    font-family: 'Montserrat', sans-serif;
}
.text-wrapper p {
    color: #004494;
}
.text-wrapper .square-title {
    font-weight: 300;
    margin-bottom: 20px;
}
.split-text-wrapper {
    position: relative;
}
.split-square-wrapper {
    padding: 0 0 60px;
}
.split-text-wrapper::before {
    top: 0;
    bottom: 0;
    width: 40%;
    content: "";
    display: block;
    position: absolute;
    background-position: center;
    background-repeat: no-repeat;
    background-image: var(--bg-img);
    background-size: cover;
}
.split-text-wrapper::after {
    top: 0;
    right: 0;
    bottom: 0;
    left: 40%;
    width: 60%;
    content: "";
    opacity: .80;
    display: block;
    position: absolute;
    background-color: #004594;

}
.split-text-block {
    z-index: 1;
    color: #fff;
    font-size: 13px;
    position: relative;
    padding: 20px 0 20px;
    font-family: 'Montserrat', sans-serif;
}
.split-text-block .square-title {
    color: #fff;
    font-weight: 200;
    margin-bottom: 15px;
}
/* -- BEGIN HEADER PAGE -- */
.header-page {
    min-height: 100px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.header-page h1 {
    margin: 0 auto;
    color: #fff;
    padding: 40px;
    font-size: 32px;
    font-weight: 700;
    max-width: 390px;
    text-align: center;
    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
    background-color: rgba(0, 69, 148, .80);
}
.form-page-wrapper {
    padding: 15px 0;
    font-size: 13px;
    font-family: 'Raleway', sans-serif;
}
.input-file-wrapper {
    right: 0;
    bottom: 0;
    width: 100%;
    max-width: 180px;
    position: absolute;
}
.input-upload input {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    cursor: pointer;
    position: absolute;
}
.input-upload {
    width: 100%;
    line-height: 30px;
    position: relative;
    padding-right: 50px;
    display: inline-block;
    background-size: 30px;
    text-transform: uppercase;
    background: url('../img/icon-upload.png') right center no-repeat;
    background-size: 30px;
}
.input-upload-block .btn-default {
    max-width: none;
    margin: 20px 0 0;
}
/* BEGIN CONTACT PAGE */
.icon-search {
    padding-left: 45px;
    background: url('../img/icon-search.png') 15px center no-repeat;
    background-size: 20px;
}
.address-block {
    color: #fff;
    border-radius: 10px;
    background-color: #004594;
    font-family: 'Barlow', sans-serif;
}
.address-block .title-thin {
    color: #fff;
    font-size: 16px;
}
address a,
address small {
    color: #fff;
    display: block;
    font-size: 11px;
    margin-top: 12px;
    position: relative;
}
address a:hover {
    color: #fff;
    text-decoration: none;
}
.icon-email::before,
.icon-tel::before {
    top: 0;
    left: -24px;
    content: "";
    width: 15px;
    height: 15px;
    display: block;
    position: absolute;
    background: url(../img/icon-tel.png) left center no-repeat;
    background-size: 15px;
}
.icon-email::before {
    background: url(../img/icon-email.png) left center no-repeat;
    background-size: 15px;
}

.address-block address {
    padding: 10px 15px 15px 45px;
    background: url(../img/icon-location.png) 12px 0px no-repeat;
    background-size: 23px;
}
.map-wrapper iframe {
    width: 100%;
    height: 300px;
    display: block;
}
/* -- BEGIN MODAL -- */
.modal-wrapper .modal-header {
    display: block;
    border-bottom: none;
    padding: 10px 10px 0;
}

.modal-wrapper .modal-body {
    padding: 20px;
}

.modal-wrapper .modal-content {
    padding: 15px;
}

.modal-wrapper .button-normal {
    margin-top: 25px;
}

.modal-close {
    width: 32px;
    height: 32px;
    float: right;
    display: block;
    margin: 0 !important;
    background: url(../img/icon-modal-close.png) center no-repeat;
    background-size: contain;
}

.modal-wrapper .modal-body iframe {
    width: 100%;
    height: auto;
    min-height: 300px;
}

.modal-title {
    font-size: 18px;
    color: #004594;
    text-transform: uppercase;
    font-family: 'Barlow', sans-serif;
}

/* -- BEGIN PURCHASE PAGE -- */
.spot-wrapper {
    width: 100%;
    display: flex;
    padding: 0 15px;
    min-height: 600px;
    align-items: center;
    letter-spacing: 1px;
    justify-content: center;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    font-family: 'Barlow', sans-serif;

}
.spot-block {
    width: 100%;
    margin: 50px;
    max-width: 600px;
    overflow: hidden;
    min-height: 100px;
    border-radius: 10px;
    background-color: #fff;
    box-shadow: 0 0 8px rgba(0,0,0,.2);
}
.spot-header-block {
    color: #fff;
    padding: 12px;
    text-align: center;
    position: relative;
    text-transform: uppercase;
    background-color: #004594;
}
.spot-header-title {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 2px;
}
.spot-header-subtitle {
    margin: 0;
    font-size: 16px;
}
.spot-info-block {
    color: #0050A0;
    font-weight: 600;
    padding: 15px 25px 25px;
    background-color: #F3F3F3;
}
.spot-info-title {
    text-align: center;
    text-transform: uppercase;
}
.spot-list-wrapper {
    margin-top: 35px;
}
.spot-list-wrapper ul {
    font-size: 14px;
    overflow: hidden;
}
.spot-list-wrapper ul li {
    margin-top: 3px;
}
.spot-list-title {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.spot-item-title {
    float: left;
    display: block;
    color: #5E5857;
    text-transform: uppercase;
}
.spot-item-name {
    float: right;
    color: #004594;
    font-weight: 700;
}
.spot-address span {
    display: block;
    color: #5E5857;
    font-size: 14px;
}
.btn-download {
    top: 50%;
    right: 20px;
    width: 32px;
    height: 32px;
    display: block;
    margin-top: -16px;
    border-radius: 50%;
    position: absolute;
    text-indent: -9999em;
    background: url(../img/icon-download-white.png) center no-repeat;
    background-size: contain;
}
Regresar