Proyecto: Grupo Popular

<!DOCTYPE html>
<html>
    <head>
        <title>Portada</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" type="text/css" href="css/slick.css">
        <link rel="stylesheet" type="text/css" href="css/slick-theme.css">
        <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
        <link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
        <link rel="stylesheet" type="text/css" href="css/reset.css">
        <link rel="stylesheet" type="text/css" href="css/fonts.css">
        <link rel="stylesheet" type="text/css" href="css/styles.css">
        <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:400,500,700">
        <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
        <script type="text/javascript" src="js/bootstrap.min.js"></script>
        <script type="text/javascript" src="js/slick.min.js"></script>
    </head>
    <body>

        <!-- begin header block -->
        <div class="header">
            <div class="header-top hidden-xs">
                <div class="container">
                    <div class="header-link">
                        <div class="dropdown pull-left">
                            <button id="dLabel" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                <span class="fa fa-search"></span>
                            </button>
                            <div class="dropdown-menu wrapper-search" aria-labelledby="dLabel">
                                <input type="text" placeholder="Buscar en este sitio...">
                                <button><i class="fa fa-search"></i></button>
                            </div>
                        </div>
                        <a href="#">REDES SOCIALES</a>
                    </div>
                </div>
            </div>
            <div class="container">
                <nav class="navbar">
                    <div class="container-fluid">
                        <!-- Brand and toggle get grouped for better mobile display -->
                        <div class="navbar-header">
                            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                                <span class="sr-only">Toggle navigation</span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                            </button>
                            <a class="navbar-brand" href="#">
                                <img class="logo" src="img/logo.png" alt="Grupo Popular" />
                            </a>
                        </div>

                        <!-- Collect the nav links, forms, and other content for toggling -->
                        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                            <ul class="nav navbar-nav navbar-right">
                                <li class="dropdown">
                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Conócenos</a>
                                    <ul class="dropdown-menu">
                                        <li><a href="#">Sobre Nosotros</a></li>
                                        <li><a href="#">Gobierno Corporativo</a></li>
                                        <li><a href="#">Compromiso Social</a></li>
                                        <li><a href="#">Proveedores</a></li>
                                    </ul>
                                </li>
                                <li class="active"><a href="#">Filiales <span class="sr-only">(current)</span></a></li>
                                <li><a href="#">Publicaciones</a></li>
                                <li><a href="#">Noticias</a></li>
                                <li><a href="#">Circulo de Accionistas</a></li>
                                <li><a href="#">Empleo</a></li>
                            </ul>
                            <div class="header-top visible-xs">
                                    <div class="header-link">
                                        <div class="dropdown pull-left">
                                            <a href="#">
                                                <span class="fa fa-search"></span>
                                            </a>
                                            <div class="dropdown-menu wrapper-search" aria-labelledby="dLabel">
                                                <input type="text" placeholder="Buscar en este sitio...">
                                                <button><i class="fa fa-search"></i></button>
                                            </div>
                                        </div>
                                        <a href="#">REDES SOCIALES</a>
                                    </div>
                            </div>
                        </div><!-- /.navbar-collapse -->
                    </div><!-- /.container-fluid -->
                </nav>
            </div>
        </div>

        <!-- begin featured block -->
        <div id="carousel-featured" class="carousel slide featured" data-ride="carousel">
            <!-- Indicators -->
            <ol class="carousel-indicators">
                <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>

            <!-- Wrapper for slides -->
            <div class="carousel-inner" role="listbox">
                <div class="item active">
                    <img src="img/featured.jpg" alt="...">
                    <div class="carousel-caption">
                        <p>El mejor grupo financiero de la</p>
                        <h3>República Dominicana</h3>
                        <p>Según la revista world finance</p>
                        <a class="opt-emphasis" href="#">Ver más</a>
                    </div>
                </div>
                <div class="item">
                    <img src="img/featured.jpg" alt="...">
                    <div class="carousel-caption caption-left">
                        <p>El mejor grupo financiero de la</p>
                        <h3>República Dominicana</h3>
                        <p>Según la revista world finance</p>
                        <a class="opt-emphasis" href="#">Ver más</a>
                    </div>
                </div>
            </div>
            <!-- Controls -->
            <a class="left carousel-control" href="#carousel-featured" role="button" data-slide="prev">
              <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
              <span class="sr-only">Previous</span>
            </a>
            <a class="right carousel-control" href="#carousel-featured" role="button" data-slide="next">
              <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
              <span class="sr-only">Next</span>
            </a>
        </div>

        <!-- begin wrapper info -->
        <div class="container wrapper-info">
            <div class="row">
                <div class="col-md-6">
                    <div class="row block-info">
                        <div class="col-md-3 pull-left">
                            <h3 class="title-medium">
                                <a href="#">SOMOS</a>
                            </h3>
                        </div>
                        <div class="col-md-9 pull-right section">
                            <p>
                                Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
                                Donec odio. Quisque volutpat mattis eros. Nullam malesuada 
                                erat ut turpis. Suspendisse urna nibh, viverra non, 
                                semper suscipit, posuere a, pede.
                            </p>
                            <p>
                                Sed egestas, ante et vulputate volutpat, eros pede semper est, 
                                vitae luctus metus libero eu augue. Morbi purus libero, faucibus 
                                adipiscing, commodo quis, gravida id, est. Sed lectus. Praesent 
                                elementum hendrerit tortor. Sed semper lorem at felis. Vestibulum 
                                volutpat, lacus a ultrices sagittis, mi neque euismod dui, eu pulvinar 
                                nunc sapien ornare nisl. Phasellus pede arcu, dapibus eu, fermentum 
                                et, dapibus sed, urna.
                            </p>
                            <a class="opt-link" href="#">Conoce más</a>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 wrapper-media">
                    <iframe src="https://www.youtube.com/embed/3GfPnykQ_eM?ecver=2"></iframe>
                </div>
            </div>
        </div>

        <!-- begin wrapper info center -->
        <div class="container wrapper-info">
            <div class="center-block fit">
                <div class="row">
                    <div class="col-md-3 pull-left text-right">
                        <h3 class="title-medium">
                            <a href="#">FILIALES</a>
                        </h3>
                    </div>
                    <div class="col-md-9 pull-right section">
                        <h4 class="title-small">Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</h4>
                        <p>
                            Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
                            Donec odio. Quisque volutpat mattis eros. Nullam malesuada 
                            erat ut turpis. Suspendisse urna nibh, viverra non, 
                            semper suscipit, posuere a, pede.
                        </p>
                        <a class="opt-link visible-xs" href="#">Ver más</a>
                    </div>
                </div>
            </div>
        </div>

        <!-- begin thumbs -->
        <div class="wrapper-thumb hidden-xs">
            <div class="row carousel-blocks">
                <a class="col-xs-12 col-sm-6 col-md-3 block-thumb" href="#">
                    <img src="img/thumb-1.jpg" alt="#" />
                    <div class="info-thumb">
                        <span>Inversiones Popular</span>
                        <i class="opt-link-initial">Conoce más</i>
                    </div>
                </a>
                <a class="col-xs-12 col-sm-6 col-md-3 block-thumb" href="#">
                    <img src="img/thumb-2.jpg" alt="#" />
                    <div class="info-thumb">
                        <span>Inversiones Popular</span>
                        <i class="opt-link-initial">Conoce más</i>
                    </div>
                </a>
                <a class="col-xs-12 col-sm-6 col-md-3 block-thumb" href="#">
                    <img src="img/thumb-3.jpg" alt="#" />
                    <div class="info-thumb">
                        <span>Inversiones Popular</span>
                        <i class="opt-link-initial">Conoce más</i>
                    </div>
                </a>
                <a class="col-xs-12 col-sm-6 col-md-3 block-thumb" href="#">
                    <img src="img/thumb-4.jpg" alt="#" />
                    <div class="info-thumb">
                        <span>Inversiones Popular</span>
                        <i class="opt-link-initial">Conoce más</i>
                    </div>
                </a>
                <a class="col-xs-12 col-sm-6 col-md-3 block-thumb" href="#">
                    <img src="img/thumb-6.jpg" alt="#" />
                    <div class="info-thumb">
                        <span>Inversiones Popular</span>
                        <i class="opt-link-initial">Conoce más</i>
                    </div>
                </a>
            </div>
        </div>

        <!-- begin publish -->
        <div class="container wrapper-split">
            <h2 class="title-medium">
                <a href="#">PUBLICACIONES</a>
            </h2>
            <p>
                Morbi in sem quis dui placerat ornare. 
                Pellentesque odio nisi, euismod in, pharetra a, 
                ultricies in, diam. Sed arcu. Cras consequat.
            </p>
            <div class="row">
                <div class="col-md-6 wrapper-carousel">
                    <div class="block-cover">
                        <a href="#">
                            <img src="img/cover.jpg" alt="#" />
                            <div class="caption-cover">
                                <i class="opt-link">Descargar</i>
                            </div>
                        </a>
                    </div>
                    <div class="block-cover">
                        <a href="#">
                            <img src="img/cover.jpg" alt="#" />
                            <div class="caption-cover">
                                <i class="opt-link">Descargar</i>
                            </div>
                        </a>
                    </div>
                    <div class="block-cover">
                        <a href="#">
                            <img src="img/cover.jpg" alt="#" />
                            <div class="caption-cover">
                                <i class="opt-link">Descargar</i>
                            </div>
                        </a>
                    </div>
                    <div class="block-cover">
                        <a href="#">
                            <img src="img/cover.jpg" alt="#" />
                            <div class="caption-cover">
                                <i class="opt-link">Descargar</i>
                            </div>
                        </a>
                    </div>
                    <div class="block-cover">
                        <a href="#">
                            <img src="img/cover.jpg" alt="#" />
                            <div class="caption-cover">
                                <i class="opt-link">Descargar</i>
                            </div>
                        </a>
                    </div>
                    <div class="block-cover">
                        <a href="#">
                            <img src="img/cover.jpg" alt="#" />
                            <div class="caption-cover">
                                <i class="opt-link">Descargar</i>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="col-md-6 wrapper-list">
                    <div class="block-list">
                        <h2 class="title-icon-book">ESTADOS FINANCIEROS</h2>
                        <ul>
                            <li>
                                <a href="#">Estados financieros auditados al 31 de diciembre 2014</a>
                            </li>
                            <li>
                                <a href="#">Estados financieros interinos al 30 de junio 2015</a>
                            </li>
                        </ul>
                        <a class="opt-link pull-right" href="#">Ver más</a>
                    </div>
                    <div class="block-list">
                        <h2 class="title-icon-book">HECHOS RELEVANTES</h2>
                        <ul>
                            <li>
                                <a href="#">Estados financieros auditados al 31 de diciembre 2014</a>
                            </li>
                            <li>
                                <a href="#">Estados financieros interinos al 30 de junio 2015</a>
                            </li>
                        </ul>
                        <a class="opt-link pull-right" href="#">Ver más</a>
                    </div>
                </div>
            </div>
        </div>

        <!-- begin news block -->
        <div class="container wrapper-featured">
            <h2 class="title-medium">
                <a href="#">NOTICIAS</a>
            </h2>
            <div class="block-img">
                <img src="img/featured-news.jpg" alt="#" />
                <div class="caption-img">
                    <small class="title-small-top">
                        <a href="#">BANCO POPULAR</a>
                    </small>
                    <h4 class="title-extra-small">
                        BANCO POPULAR DOMINICANO DA LA 
                        BIENVENIDA AL 2017  EN ZONA NORTE
                    </h4>
                </div>
            </div>
        </div>

        <!-- begin news info -->
        <div class="container block-news">
            <div class="row">
                <div class="col-md-2 text-right news-date">
                    <b>21 Enero 2017</b>
                    <span>Eduardo Almonte</span>
                    <label class="wrapper-opt-social" for="opt-social">
                        <input type="checkbox" id="opt-social" />
                        <span class="square-social">
                            <span class="block-social">
                                <a class="fa fa-twitter" id="tw" href="#"></a>
                                <a class="fa fa-facebook-official" id="fb" href="#"></a>
                                <a class="fa fa-envelope" id="ins" href="#"></a>
                            </span>
                        </span>
                    </label>
                </div>
                <div class="col-md-10">
                    <p>
                        Sed egestas, ante et vulputate volutpat, eros pede semper est, 
                        vitae luctus metus libero eu augue. Morbi purus libero, faucibus 
                        adipiscing, commodo quis, gravida id, est. Sed lectus. Praesent 
                        elementum hendrerit tortor. Sed semper lorem at felis. Vestibulum 
                        volutpat, lacus a ultrices sagittis, mi neque euismod dui, eu pulvinar 
                        nunc sapien ornare nisl. Phasellus pede arcu, dapibus eu, fermentum 
                        et, dapibus sed, urna.
                    </p>
                    <p>
                        Sed egestas, ante et vulputate volutpat, eros pede semper est, 
                        vitae luctus metus libero eu augue. Morbi purus libero, faucibus 
                        adipiscing, commodo quis, gravida id, est. Sed lectus. Praesent 
                        elementum hendrerit tortor. Sed semper lorem at felis. Vestibulum 
                        volutpat, lacus a ultrices sagittis, mi neque euismod dui, eu pulvinar 
                        nunc sapien ornare nisl. Phasellus pede arcu, dapibus eu, fermentum 
                        et, dapibus sed, urna.
                    </p>
                    <a class="pull-right opt-link" href="#">Leer Más</a>
                </div>
            </div>
        </div>

        <!-- begin other news -->
        <div class="container wrapper-square hidden-xs">
            <div class="row">
                <div class="col-sm-6">
                    <div class="row square-thumb">
                        <div class="col-sm-3 pull-left thumb-img">
                            <img src="img/thumb.png" alt="#" />
                        </div>
                        <div class="col-sm-9 pull-right thumb-info">
                            <small class="title-small-top">
                                <a href="#">Fundación Popular</a>
                            </small>
                            <h4 class="title-extra-small">
                                Morbi in sem quis dui placerat ornare. 
                                Pellentesque odio nisi, euismod in
                            </h4>
                            <p>
                                Morbi in sem quis dui placerat ornare. 
                                Pellentesque odio nisi, euismod in, pharetra a, 
                                ultricies in, diam. Sed arcu. Cras consequat.
                            </p>
                            <a class="opt-link" href="#">Ver más</a>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="row square-thumb">
                        <div class="col-sm-3 pull-left thumb-img">
                            <img src="img/thumb.png" alt="#" />
                        </div>
                        <div class="col-sm-9 pull-right thumb-info">
                            <small class="title-small-top">
                                <a href="#">Fundación Popular</a>
                            </small>
                            <h4 class="title-extra-small">
                                Morbi in sem quis dui placerat ornare. 
                                Pellentesque odio nisi, euismod in
                            </h4>
                            <p>
                                Morbi in sem quis dui placerat ornare. 
                                Pellentesque odio nisi, euismod in, pharetra a, 
                                ultricies in, diam. Sed arcu. Cras consequat.
                            </p>
                            <a class="opt-link" href="#">Ver más</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- begin magazines cover -->
        <div class="container wrapper-cover">
            <h2 class="title-medium">
                <a href="#">REVISTA ALCANCES</a>
            </h2>
            <p>
                Morbi in sem quis dui placerat ornare. 
                Pellentesque odio nisi, euismod in, pharetra a, 
                ultricies in, diam. Sed arcu. Cras consequat.
            </p>
            <div class="row carousel-cover">
                <div class="col-sm-3 square-cover">
                    <a href="#">
                        <img src="img/cover.png" alt="#" />
                        <div class="label-cover">
                            <span class="pull-left label-initial">Noviembre 2017</span>
                            <span class="pull-right opt-link">Ver</span>
                        </div>
                    </a>
                </div>
                <div class="col-sm-3 square-cover">
                    <a href="#">
                        <img src="img/cover.png" alt="#" />
                        <div class="label-cover">
                            <span class="pull-left label-initial">Noviembre 2017</span>
                            <span class="pull-right opt-link">Ver</span>
                        </div>
                    </a>
                </div>
                <div class="col-sm-3 square-cover">
                    <a href="#">
                        <img src="img/cover.png" alt="#" />
                        <div class="label-cover">
                            <span class="pull-left label-initial">Noviembre 2017</span>
                            <span class="pull-right opt-link">Ver</span>
                        </div>
                    </a>
                </div>
                <div class="col-sm-3 square-cover">
                    <a href="#">
                        <img src="img/cover.png" alt="#" />
                        <div class="label-cover">
                            <span class="pull-left label-initial">Noviembre 2017</span>
                            <span class="pull-right opt-link">Ver</span>
                        </div>
                    </a>
                </div>
            </div>
        </div>

        <!-- begin thumbnails -->
        <div class="wrapper-thumbnails">
            <div class="container block-thumbnails">
                <h3 class="title-medium">
                    <a href="#">COMPROMISO SOCIAL</a>
                </h3>
                <div class="row">
                    <div class="col-sm-4 col-md-2 block-thumb-small">
                        <img src="img/thumb-small.png" alt="#" />
                        <a href="#">
                            <span>Inclusión Financiera</span>
                        </a>
                    </div>
                    <div class="col-sm-4 col-md-2 block-thumb-small">
                        <img src="img/thumb-small.png" alt="#" />
                        <a href="#">
                            <span>Inclusión Financiera</span>
                        </a>
                    </div>
                    <div class="col-sm-4 col-md-2 block-thumb-small">
                        <img src="img/thumb-small.png" alt="#" />
                        <a href="#">
                            <span>Inclusión Financiera</span>
                        </a>
                    </div>
                    <div class="col-sm-4 col-md-2 block-thumb-small">
                        <img src="img/thumb-small.png" alt="#" />
                        <a href="#">
                            <span>Inclusión Financiera</span>
                        </a>
                    </div>
                    <div class="col-sm-4 col-md-2 block-thumb-small">
                        <img src="img/thumb-small.png" alt="#" />
                        <a href="#">
                            <span>Inclusión Financiera</span>
                        </a>
                    </div>
                    <div class="col-sm-4 col-md-2 block-thumb-small">
                        <img src="img/thumb-small.png" alt="#" />
                        <a href="#">
                            <span>Inclusión Financiera</span>
                        </a>
                    </div>
                </div>
            </div>
        </div>

        <!-- begin footer -->
        <div class="footer">
            <div class="footer-top">
                <div class="container block-search">
                    <input class="pull-right" type="text" placeholder="¿Qué buscas hoy?" />
                </div>
            </div>

            <!-- Begin dektop footer -->
            <div class="footer-bottom hidden-xs">
                <div class="container">
                    <div class="row">
                        <div class="col-sm-4">
                            <h4 class="title-medium">CONTÁCTANOS</h4>
                            <ul class="footer-links address">
                                <li id="link-address">
                                    <a href="https://www.google.com.do/maps/place/Banco+Popular/@18.481314,-69.9151641,17z/data=!3m1!4b1!4m5!3m4!1s0x8eaf89ca2b71ee51:0x33708f6c34b9ccb4!8m2!3d18.481314!4d-69.91297" target="_blank">
                                        Av. John F. Kennedy<br/>
                                        No. 20, Torre Popular,<br/>
                                        Santo Domingo, Rep. Dom.
                                    </a>
                                </li>
                                <li id="link-phone">
                                    <a href="tel:8095445500">809 544 5500</a>
                                </li>
                                <li id="link-email">
                                    <a href="mailto:info@grupopopular.com">info@grupopopular.com</a>
                                </li>
                            </ul>
                        </div>
                        <div class="col-sm-4">
                            <h4 class="title-medium">CONTENIDO</h4>
                            <ul class="footer-links">
                                <li><a href="#">Conócenos</a></li>
                                <li><a href="#">Publicaciones</a></li>
                                <li><a href="#">Noticias</a></li>
                                <li><a href="#">Circulo de Accionistas</a></li>
                                <li><a href="#">Redes Sociales</a></li>
                                <li><a href="#">Empleo</a></li>
                            </ul>
                        </div>
                        <div class="col-sm-4">
                            <h4 class="title-medium">FILIALES</h4>
                            <ul class="footer-links">
                                <li><a href="#">Banco Popular Dominicano</a></li>
                                <li><a href="#">AFP Popular</a></li>
                                <li><a href="#">Fiduciaría Popular</a></li>
                                <li><a href="#">Inversiones Popular</a></li>
                                <li><a href="#">Popular Bank, LTD</a></li>
                                <li><a href="#">Infocentro</a></li>
                                <li><a href="#">Servicios Digitales Popular</a></li>
                                <li><a href="#">ASETESA</a></li>
                                <li><a href="#">AFI Popular</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="footer-copyright">
                        <div class="row">
                            <div class="col-sm-6 text-left">
                                <span>Grupo Popular S. A.</span>
                            </div>
                            <div class="col-sm-6 text-right label-legal">
                                <a href="#">Aviso Legal</a>
                                <a>Politica de Privacidad</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Begin mobile footer -->
            <div class="footer-bottom visible-xs">
                <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
                    <div class="panel panel-default">
                        <div class="panel-heading" role="tab" id="headingOne">
                            <h4 class="title-medium">
                                <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
                                    CONTÁCTANOS
                                    <i class="fa fa-angle-up"></i>
                                    <i class="fa fa-angle-down"></i>
                                </a>
                            </h4>
                        </div>
                        <div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
                            <div class="panel-body">
                                <ul class="footer-links address">
                                    <li id="link-address">
                                        <a href="https://www.google.com.do/maps/place/Banco+Popular/@18.481314,-69.9151641,17z/data=!3m1!4b1!4m5!3m4!1s0x8eaf89ca2b71ee51:0x33708f6c34b9ccb4!8m2!3d18.481314!4d-69.91297" target="_blank">
                                            Av. John F. Kennedy<br/>
                                            No. 20, Torre Popular,<br/>
                                            Santo Domingo, Rep. Dom.
                                        </a>
                                    </li>
                                    <li id="link-phone">
                                        <a href="tel:8095445500">809 544 5500</a>
                                    </li>
                                    <li id="link-email">
                                        <a href="mailto:info@grupopopular.com">info@grupopopular.com</a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="panel panel-default">
                        <div class="panel-heading" role="tab" id="headingTwo">
                            <h4 class="title-medium">
                                <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
                                    CONTENIDO
                                    <i class="fa fa-angle-up"></i>
                                    <i class="fa fa-angle-down"></i>
                                </a>
                            </h4>
                        </div>
                        <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
                            <div class="panel-body">
                                <ul class="footer-links">
                                    <li><a href="#">Conócenos</a></li>
                                    <li><a href="#">Publicaciones</a></li>
                                    <li><a href="#">Noticias</a></li>
                                    <li><a href="#">Circulo de Accionistas</a></li>
                                    <li><a href="#">Redes Sociales</a></li>
                                    <li><a href="#">Empleo</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="panel panel-default">
                        <div class="panel-heading" role="tab" id="headingThree">
                            <h4 class="title-medium">
                                <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseThree">
                                    FILIALES
                                    <i class="fa fa-angle-up"></i>
                                    <i class="fa fa-angle-down"></i>
                                </a>
                            </h4>
                        </div>
                        <div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
                            <div class="panel-body">
                                <ul class="footer-links">
                                    <li><a href="#">Banco Popular Dominicano</a></li>
                                    <li><a href="#">AFP Popular</a></li>
                                    <li><a href="#">Fiduciaría Popular</a></li>
                                    <li><a href="#">Inversiones Popular</a></li>
                                    <li><a href="#">Popular Bank, LTD</a></li>
                                    <li><a href="#">Infocentro</a></li>
                                    <li><a href="#">Servicios Digitales Popular</a></li>
                                    <li><a href="#">ASETESA</a></li>
                                    <li><a href="#">AFI Popular</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="footer-copyright">
                    <div class="label-footer">
                        <span>Grupo Popular S. A.</span>
                    </div>
                    <div class="label-legal">
                        <a href="#">Aviso Legal</a>
                        <a>Politica de Privacidad</a>
                    </div>
                </div>
            </div>
        </div>

        <!-- begin slick js -->
        <script type="text/javascript">
            $('.wrapper-carousel').slick({
                dots: true,
                infinite: false,
                speed: 300,
                slidesToShow: 3,
                slidesToScroll: 3,
                responsive: [
                    {
                        breakpoint: 768,
                        settings: {
                            slidesToShow: 1,
                            slidesToScroll: 1
                        }
                    }
                    // You can unslick at a given breakpoint now by adding:
                    // settings: "unslick"
                    // instead of a settings object
                ]
            });
            $('.carousel-blocks').slick({
                dots: true,
                infinite: true,
                speed: 300,
                slidesToShow: 4,
                slidesToScroll: 1,
                responsive: [
                    {
                        breakpoint: 768,
                        settings: {
                            slidesToShow: 1,
                            slidesToScroll: 1
                        }
                    }
                    // You can unslick at a given breakpoint now by adding:
                    // settings: "unslick"
                    // instead of a settings object
                ]
            });
            $('.carousel-cover').slick({
                dots: true,
                infinite: true,
                speed: 300,
                slidesToShow: 4,
                slidesToScroll: 1,
                responsive: [
                    {
                        breakpoint: 768,
                        settings: {
                            slidesToShow: 1,
                            slidesToScroll: 1
                        }
                    }
                    // You can unslick at a given breakpoint now by adding:
                    // settings: "unslick"
                    // instead of a settings object
                ]
            });
        </script>
    </body>
</html>
body {
    font-family: 'Roboto', sans-serif;
}
p {
    color: #404040;
    font-size: 14px;
    font-weight: 400;
}
.header {
    background-color: #07142D;
}
.header-top {
    color: #fff;
    padding: 5px;
    text-align: right;
    font-weight: 700;
    background-color: #123270;
}
.header-top a {
    margin-left: 10px;
    padding-left: 12px;
    border-left: 1px solid #fff;
}
.header-top a:first-child {
    border: none;
    margin-left: 0;
    padding-left: 0;
}
.header-top .container {
    padding: 0 60px;
}
.logo {
    height: 100%;
}
.dropdown:before {
    left: 0;
    top: 0;
    bottom: 0;
    content: "";
    height: 50px;
    display: block;
    position: absolute;
    background-color: blue;
}
/*-- begin featured block --*/
.featured {
    margin-bottom: 20px;
}
.featured .carousel-caption {
    text-align: left;
    text-transform: uppercase;
}
.featured .item img {
    width: 100%;
    height: auto;
}
.featured h3 {
    font-size: 2.5vw;
    line-height: 30px;
    margin: 4px 0 5px;
}
.featured p {
    color: #fff;
    font-size: 2vw;
    font-weight: 400;
    margin-bottom: 3px;
}
.featured .carousel-caption {
    left: auto;
    bottom: 40%;
    text-align: left;
}
.featured .glyphicon {
    color: #fff;
    width: 50px;
    height: 50px;
    line-height: 40px;
    border-radius: 50%;
    border: 3px solid #fff;
    font-family: 'FontAwesome';
}
.featured .glyphicon-chevron-left:before {
    left: -2px;
    content: "f104";
    position: relative;
    font-weight: 700;
}
.featured .glyphicon-chevron-right:before {
    left: 1px;
    content: "f105";
    position: relative;
    font-weight: 700;
}
.caption-left {
    right: auto;
    left: 20% !important;
}
/*-- begin wrapper info --*/
.wrapper-info {
    padding-top: 50px;
    padding-bottom: 50px;
}
.title-medium,
.title-medium > a,
.title-medium-helper {
    margin-top: 0;
    color: #133370;
    font-size: 24px;
    font-weight: 700;
    text-decoration: none;
}
#accordion .title-medium a {
    font-size: 20px;
}
.title-small,
.list-form li,
.block-form p,
.title-small-initial {
    margin-top: 0;
    color: #38C2D4;
    font-weight: 400;
}
.title-medium-helper {
    color: #034581;
    margin-bottom: 0;
}
.title-medium-initial,
.title-medium-extra {
    display: block;
    font-size: 24px;
    font-weight: 700;
    line-height: 30px;
    color: #66BED0 !important;
}
.title-medium-initial {
    font-size: 18px;
}
.section,
.block-split {
    border-left: 2px solid #F7921E;
}
.wrapper-media iframe{
    width: 100%;
    border: none;
    display: block;
    min-height: 300px;
}
.label-default {
    display: block;
    color: #B1ADAA;
    font-weight: 400;
    margin-top: 10px;
    background: none;
}
.opt-link,
.opt-link-initial {
    color: #38C2D4;
    font-size: 14px;
    font-weight: 700;
    font-style: normal;
    padding-left: 12px;
    display: inline-block;
    text-decoration: none;
    background: url('../img/fast-forward.svg') left center no-repeat;
    background-size: 10px;
}
.opt-link-initial {
    color: #fff;
    font-weight: 700;
    font-style: normal;
    display: inline-block;
    background: url('../img/fast-forward-initial.svg') left center no-repeat;
    background-size: 10px;
}
.opt-link:hover,
.wrapper-social .opt-url a:hover {
    color: #133370;
    text-decoration: none;
    background-image: url('../img/fast-forward-hover.svg');
}
.header-top a,
.title-small-banner,
.opt-link-initial:hover,
.opt-emphasis:hover {
    color: #fff;
}
.fit {
    max-width: 610px;
}

/*-- begin wrapper thumb --*/
.label-cover,
.block-thumb,
.wrapper-thumb {
    overflow: hidden;
}
.block-thumb {
    padding: 0;
    /* min-height: 275px; */
    overflow: hidden;
}
.block-thumb img {
    width: 100%;
    height: auto;
    display: block;
    /* position: absolute; */
}
.info-thumb {
    top: 50%;
    opacity: 0;
    color: #fff;
    z-index: 2;
    width: 100%;
    visibility: hidden;
    text-align: center;
    position: absolute;
    margin-top: -20px;
    -webkit-transition: .2s all ease-in-out;
    -moz-transition: .2s all ease-in-out;
    -ms-transition: .2s all ease-in-out;
    -o-transition: .2s all ease-in-out;
    transition: .2s all ease-in-out;
}
.info-thumb span {
    display: block;
    font-weight: 400;
}
.block-thumb:before {
    left: 0;
    top: 0;
    right: 0;
    opacity: 0;
    bottom: 0;
    content: "";
    z-index: 1;
    display: block;
    visibility: hidden;
    position: absolute;
    background-color: rgba(18,50,111,.7);
    -webkit-transition: .2s all ease-in-out;
    -moz-transition: .2s all ease-in-out;
    -ms-transition: .2s all ease-in-out;
    -o-transition: .2s all ease-in-out;
    transition: .2s all ease-in-out;
}
.block-thumb.active:before,
.block-thumb:hover:before,
.block-thumb.active .info-thumb,
.block-thumb:hover .info-thumb {
    opacity: 1;
    visibility: visible;
}

/*-- begin wrapper split --*/
.wrapper-carousel {
    padding: 0 40px;
}
.wrapper-split,
.wrapper-cover,
.wrapper-featured {
    clear: both;
    margin-top: 70px;
    margin-bottom: 70px;
}
.block-cover {
    padding: 20px;
    text-align: center;
    min-height: 100px;
}
.block-cover img {
    width: 100%;
    height: auto;
    display: block;
}
.block-cover span,
.block-split-list .title-small {
    display: block;
    color: #133370;
    font-weight: 400;
}
.block-cover b {
    display: block;
}
.caption-cover,
.block-form .opt-emphasis {
    margin-top: 20px;
}
/*-- begin slick --*/
.slick-dots li {
    margin: 0;
}
.slick-prev:before,
.slick-next:before {
    color: #d0cdc7;
    font-size: 24px;
    font-family: 'FontAwesome';
}
.slick-prev:before {
    content: "f104";
}
.slick-next:before {
    content: "f105";
}
.slick-dots li button::before {
    color: #38C2D4 !important;
    font-size: 30px !important;
}
.slick-next {
    right: 15px;
}
.slick-prev {
    left: 0;
}
.slick-dots {
    left: 0;
    right: 0;
}
.slick-slide img {
    width: 100%;
    height: auto;
}
/*-- begin icon title --*/
.title-icon-book {
    color: #38C2D4;
    font-size: 18px;
    font-weight: 700;
    padding-left: 40px;
    background: url('../img/book.png') left center no-repeat;
    background-size: 30px;
    line-height: 25px;
}
.wrapper-list {
    border-left: 2px solid #F7921E;
}

/*-- begin list block --*/
.block-list {
    width: 100%;
    margin-top: 10px;
    display: inline-block;
}
.block-list:first-child {
    margin-top: 0;
}
.block-list > ul {
    padding: 10px 15px;
}
.block-list > ul > li {
    list-style-position: outside;
}
.block-list li > a {
    color: #133370;
}

/*-- begin news block --*/
.wrapper-featured {
    position: relative;
    margin-bottom: 20px;
}
.block-img img {
    width: 100%;
    height: auto;
    display: block;
}
.caption-img {
    left: 0;
    bottom: 0;
    padding: 20px;
    position: absolute;
    max-width: 600px;
    margin: 20px 35px;
    background-color: rgba(255,255,255,.5);
}
.caption-img h4 {
    font-size: 18px;
    line-height: 23px;
}
.title-small-top,
.title-small-top > a,
.sidebar-block-collapse li a,
.sidebar-block-collapse li label {
    color: #38C2D4;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}
.title-extra-small {
    margin-top: 0;
    color: #133370;
    font-size: 14px;
    font-weight: 700;
    line-height: 19px;
    margin-bottom: 0;
}
.block-news {
    color: #8B8B8B;
    margin-bottom: 70px;
}
.block-news span,
.footer-links li span {
    display: block;
    font-weight: 400;
}
.news-date {
    margin-bottom: 20px;
}
.thumb-img img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 50%;
    border: 6px solid #F39B13;
}
.thumb-info .title-extra-small {
    margin-bottom: 5px;
}
.wrapper-pdf,
.wrapper-square {
    padding-bottom: 40px;
    border-bottom: 1px solid #E3E0D9;
}
.square-thumb {
    margin-top: 30px;
}
.address {
    padding: 0 !important;
}
#link-address,
#link-phone,
#link-email {
    display: block;
    padding-left: 30px;
    background: url('../img/icon-home.png') left top no-repeat;
    background-size: 16px;
    margin-bottom: 15px;
}
#link-phone {
    background: url('../img/icon-phone.png') 3px no-repeat;
    background-size: 10px;
}
#link-email {
    background: url('../img/icon-email.png') left center no-repeat;
    background-size: 16px;
}

/*-- begin cover --*/
.square-cover img {
    width: 100%;
    height: auto;
    display: block;
}
.label-cover {
    margin-top: 5px;
}
.label-initial {
    color: #737373;
    font-weight: 400;
}
.wrapper-thumbnails {
    padding: 40px 10px;
    background-color: #E2DED7;
}
.wrapper-thumbnails .title-medium {
    margin-bottom: 40px;
}
.block-thumb-small {
    position: relative;
    overflow: hidden;
}
.block-thumb-small img {
    width: 100%;
    height: auto;
    display: block;
}
.block-thumb-small a {
    top: 0;
    left: 15px;
    color: #fff;
    bottom: 0;
    right: 15px;
    font-weight: 700;
    text-align: center;
    line-height: 20px;
    position: absolute;
    background-color: rgba(18,50,111,.5);
    -webkit-transition: .2s all ease-in-out;
    -moz-transition: .2s all ease-in-out;
    -ms-transition: .2s all ease-in-out;
    -o-transition: .2s all ease-in-out;
    transition: .2s all ease-in-out;
}
.block-thumb-small span {
    left: 50%;
    top: 50%;
    width: 70px;
    height: 70px;
    display: block;
    margin: -35px;
    padding: 15px 0;
    position: absolute;
}
.block-thumb-small a:hover {
    opacity: 0;
}

/*-- begin footer --*/
.footer-top {
    padding: 7px 0;
    background-color: #0F295A;
}
.footer-bottom {
    min-height: 100px;
    background-color: #133370;
}
.block-search input {
    border: none;
    outline: none;
    font-weight: 400;
    border-radius: 30px;
    padding: 3px 15px 3px 30px;
    background: url('../img/search.png') 8px 6px #fff no-repeat;
    background-size: 14px;
}
.block-search input::placeholder {
    color: #E3E2DF;
}
.footer .title-medium {
    color: #fff;
    margin: 20px 0;
    clear: both;
}
.footer-links {
    padding-left: 15px;
}
.footer-links li {
    color: #fff;
    list-style-type: initial;
    list-style-position: outside;
}
.label-legal,
.footer-links li,
.footer-links li a {
    color: #fff;
    font-weight: 400;
}
.label-legal a {
    color: #fff;
    height: 9px;
    cursor: pointer;
    font-size: 11px;
    line-height: 8px;
    margin-left: 6px;
    padding-left: 7px;
    display: inline-block;
    border-left: 1px solid #fff;
}
.label-legal a:first-child {
    border: none;
    margin-left: 0;
    padding-left: 0;
}
.footer-copyright {
    text-align: left;
    color: #8FAADC;
    padding: 20px 0;
    margin-top: 20px;
    border-top: 2px solid #082243;
    font-weight: 400;
}

/*-- begin banner --*/
.banner {
    position: relative;
    overflow: hidden;
    max-height: 400px;
}
.banner-caption {
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px;
    position: absolute;
    background-color: blue;
}
.banner-caption {
    background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%);
    background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%);
    background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );
}
.banner-square {
    margin: 30px 0;
}
.banner-carousel > button:before {
    opacity: 1 !important;
    color: #fff;
    z-index: 6;
    font-size: 40px;
}
.banner-carousel .slick-prev {
    left: 30px;
}
.banner-carousel .slick-next {
    right: 30px;
}
.block-play {
    color: #fff;
    cursor: pointer;
    font-size: 22px;
    padding: 15px 0;
}
.title-large {
    color: #fff;
    font-size: 28px;
}
.wrapper-slideshow {
    margin: 40px auto 120px !important;
}
.wrapper-media img,
.block-slideshow img {
    width: 100%;
    height: auto;
    display: block;
}
.info-slideshow {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 2px solid #F8A03B;
}
.wrapper-slideshow .slick-next {
    top: 40%;
    right: -15px;
    font-weight: 700;
}
.wrapper-slideshow .slick-prev {
    top: 38%;
    left: -15px;
    font-weight: 700;
}
.block-link a.opt-pdf:hover,
.wrapper-slideshow .slick-prev:before, 
.wrapper-slideshow .slick-next:before,
.wrapper-slideshow .slick-dots li button::before {
    color: #133370 !important;
}
.wrapper-slideshow .title-medium {
    display: block;
    text-align: right;
}

/*-- begin row split --*/
.fringe {
    margin-top: 70px;
    margin-bottom: 70px;
}
.fringe-helper {
    margin-top: 30px;
    margin-bottom: 30px;
}
.block-split:first-child {
    border-left: none;
}

/*-- begin thumb video --*/
.thumb-video,
.wrapper-media {
    position: relative;
    margin-top: 0 !important;
}
.thumb-video img {
    width: 100%;
    height: auto;
    display: block;
    cursor: pointer;
    border-radius: 10px;
}
.btn-play {
    left: 50%;
    top: 50%;
    color: #fff;
    opacity: .6;
    width: 50px;
    height: 50px;
    margin: -25px;
    font-size: 35px;
    text-align: center;
    line-height: 50px;
    position: absolute;
}
.wrapper-videos {
    margin-top: 30px;
    margin-bottom: 70px;
}

/*-- begin promo --*/
.wrapper-promo {
    color: #fff;
    overflow: hidden;
    min-height: 360px;
    margin-bottom: 70px;
    background: url('../img/promo.jpg') center no-repeat;
    background-size: cover;
}
.caption-promo {
    margin: 90px 0;
}
.caption-promo p,
.caption-promo .title-medium {
    color: #fff;
    max-width: 530px;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.27);
}
.caption-promo p {
    font-size: 18px;
}
.opt-emphasis {
    color: #fff;
    line-height: 26px;
    display: inline-block;
    border-radius: 30px;
    padding: 0 35px 2px;
    background-color: #F39B13;
}
.opt-emphasis:focus {
    color: #fff;
    outline: none;
    text-decoration: none;
}
.opt-emphasis:hover {
    text-decoration: none;
    background-color: #d88504;
}
/*-- begin profile blocks --*/
.block-profile,
.caption-video {
    position: relative;
    margin-top: 30px;
}
.block-carousel img,
.block-profile img {
    width: 100%;
    height: auto;
    display: block;
}
.caption-profile {
    left: 10px;
    right: 10px;
    width: auto;
    bottom: 10px;
    position: absolute;
    padding: 20px 35px;
    background-color: #fff;
}
.caption-profile ul {
    padding: 0;
}
.caption-profile li {
    display: block;
    color: #8FAADC;
    font-weight: 400;
}
.row-profile {
    margin-top: 20px;
    margin-bottom: 70px;
}
/*-- begin dropdown --*/
.opt-dropdown {
    position: relative;
    display: inline-block;
}
.opt-dropdown .fa {
    top: 9px;
    right: 10px;
    color: #133370;
    font-size: 20px;
    position: absolute;
}
.opt-dropdown select {
    outline: none;
    font-size: 23px;
    color: #133370;
    position: relative;
    border-radius: 0;
    margin-left: 10px;
    background: none;
    padding: 3px 35px 3px 10px;
    border-color: #D8D8D8;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    font-weight: 700;
}
.info-media {
    margin: 10px 0 20px;
}

/*-- pdf  file --*/
.opt-pdf,
.opt-url {
    color: #004F8F;
    font-weight: 700;
}
.opt-url span,
.opt-pdf span {
    margin-left: 5px;
    display: inline-block;
}
.opt-pdf:hover {
    color: #38C2D4;
    text-decoration: none;
}

/*-- begin avatar block --*/
.block-avatar {
    margin-bottom: 50px;
}
.block-avatar .thumb-img img {
    border-color: #0F317C;
}
.thumb-info .title-medium {
    margin-bottom: 0;
}
.thumb-info p {
    color: #808080;
}
.info-avatar {
    padding: 20px;
    color: #808080;
    font-size: 14px;
    border-radius: 10px;
    background-color: #F9F5F4;
    font-weight: 400;
}
.info-avatar ul,
.block-split-list ul {
    margin: 0;
    padding: 0;
    list-style-position: inside;
}
.info-avatar ul li {
    display: block;
    position: relative;
    margin-top: 5px;
    padding-left: 10px;
    font-weight: 400;
}
.info-avatar ul li:before {
    left: 0;
    top: 0;
    content: "-";
    position: absolute;
}
.block-square:first-child,
.block-pdf .caption-cover,
.info-avatar ul li:first-child,
.block-check .opt-emphasis {
    margin-top: 0;
}
.block-bonus {
    margin: 20px 0 30px;
}
.cross {
    position: relative;
    display: inline-block;
    padding-right: 20px;
}
.cross:before {
    right: 0;
    top: -3px;
    content: "";
    width: 11px;
    height: 32px;
    display: block;
    position: absolute;
    background: url(../img/cross.svg) center no-repeat;
    background-size: 11px;
}

/*-- begin collapse --*/
.wrapper-collapse a.title-medium,
.wrapper-collapse a.title-medium-extra {
    color: #034581;
    position: relative;
    text-decoration: none;
}
.sidebar .well,
.wrapper-collapse .panel-body {
    padding: 15px 0;
}
.wrapper-collapse a.title-medium:before,
.wrapper-collapse a.title-medium-extra:before {
    top: 0;
    right: -20px;
    content: "f0d8";
    color: #D8D8D8;
    position: absolute;
    font-family: 'FontAwesome';
}
.wrapper-collapse a.collapsed:before {
    content: "f0d7";
}
.wrapper-collapse .title-small {
    margin-top: 5px;
    font-weight: 500;
}
.block-modal .title-medium,
.wrapper-collapse .panel-group .panel {
    border: none;
    box-shadow: none;
    margin-bottom: 30px;
}
.wrapper-collapse .block-avatar {
    margin: 35px 0 0;
}
/*-- begin sidebar list --*/
.wrapper-opt-social input,
.sidebar-block-check input,
.block-thumb.active .opt-link-initial,
.sidebar .wrapper-collapse a.title-medium:before, 
.sidebar .wrapper-collapse a.title-medium-extra:before {
    display: none;
}
/*-- IE Selector --*/
_:-ms-fullscreen, :root .block-circle .content:before {
    display: none;
}
.item-list ul,
.sidebar-list,
.wrapper-link,
.block-items ul,
.sidebar-block-collapse ul {
    margin: 0;
    padding: 0;
}
.sidebar-list li {
    display: block;
    line-height: 20px;
    margin-bottom: 30px;
}
.block-link {
    overflow: hidden;
    margin-top: 15px;
}
.block-link a {
    margin-right: 10px;
}
.block-link a.opt-pdf {
    color: #38c2d4;
}
.wrapper-social .opt-url a,
.wrapper-social .opt-url span {
    color: #38C2D4;
    margin-left: 20px;
}
.wrapper-social .opt-url a,
.wrapper-social .opt-url span {
    margin-left: 0 !important;
    background-image: none !important;
}

/*-- begin thumbnail mini --*/
.item-list,
.wrapper-thumb-mini {
    margin-top: 30px;
}
.block-form .opt-dropdown,
.wrapper-thumb-mini img {
    display: block;
    max-width: 100%;
}
.title-default,
.block-split-list li {
    margin-top: 0;
    color: #737373;
    font-weight: 700;
}
.title-default-small {
    display: block;
    color: #737373;
    font-weight: 400;
}
.block-thumb-mini {
    overflow: hidden;
    margin-top: 60px;
}
/*-- begin faq --*/
.faq .title-medium-extra {
    font-size: 18px;
    font-weight: 400;
}
.faq .panel {
    margin-bottom: 10px !important;
}

/*-- begin branch block --*/
.block-branch img,
.wrapper-link .title-medium,
.wrapper-collapse .panel-group .panel {
    width: 100%;
    display: block;
    text-decoration: none;
    margin-bottom: 20px;
}
.block-branch {
    margin: 30px 0;
}

/*-- begin social block --*/
.block-social a {
    margin: 0;
    font-size: 24px;
    text-decoration: none;
}
.wrapper-social .block-social a {
    margin: 0 5px;
}
#tw {
    color: #29ABE3;
}
#fb {
    color: #3C5A97;
}
#ins {
    color: #4c68d7;
}

/*-- begin pdf block --*/
.block-pdf {
    padding: 0;
    text-align: left !important;
}

/*-- begin list split --*/
.block-split-list {
    margin: 0 auto;
    max-width: 300px;
}
.wrapper-split-list {
    border-left: 2px solid #E59C1D;
    margin-top: 30px;
}
.wrapper-split-list:first-child {
    border: none;
}
.item-list li,
.block-carousel,
.sidebar-block-collapse li {
    display: block;
    position: relative;
    margin-top: 20px;
}
.item-list li span {
    top: 4px;
    left: 15px;
    color: #004F8F;
    margin-left: 5px;
    font-weight: 500;
    position: absolute;
    display: inline-block;
    font-family: 'Roboto', sans-serif;
}
.sidebar .panel-body {
    padding-top: 0;
}
.square-cover,
.sidebar-block-collapse li {
    margin-top: 10px;
}
.sidebar-block-check label,
.sidebar-block-collapse li a {
    font-size: 18px !important;
}
.sidebar-block-check input:checked ~ .fa,
.sidebar-block-check label input:checked ~ span {
    cursor: pointer;
    color: #034581;
}
.sidebar-block-check label .fa {
    opacity: 0;
    visibility: hidden;
}
.sidebar-block-check input:checked ~ .fa {
    opacity: 1;
    visibility: visible;
}
/*-- wrapper pagination --*/
.opt-pagination {
    margin-top: 30px;
}
.opt-pagination .opt-page {
    color: #d9d9d9;
    font-weight: 700;
}
.opt-pagination .active {
    color: #133370;
}
.opt-pagination .fa {
    color: #EE9100;
    font-size: 12px;
    margin-left: 5px;
}

/*-- begin block action --*/
.block-action a {
    color: #cacaca;
    font-size: 22px;
    margin-right: 10px;
}
.block-action a:hover,
.block-action a.active {
    color: #FA9704;
}

/*-- begin wrapper blur --*/
.wrapper-ads {
    padding: 30px;
    background: url('../img/blur.jpg') center no-repeat;
    background-size: cover;
}
.block-ads {
    position: relative;
    margin: 30px 0 0;
    text-align: center;
    min-height: 320px;
}
.block-ads .title-small-banner {
    margin: 20px 0;
}
.block-ads ul {
    color: #fff;
    text-align: left;
    max-width: 250px;
    margin: 30px auto 40px;
    font-weight: 400;
}
.block-ads img {
    width: auto;
    display: block;
    margin: 0 auto;
    max-width: 100%;
    max-height: 125px;
}
.block-ads .opt-emphasis {
    left: 50%;
    bottom: 0;
    position: absolute;
    margin-left: -55px;
}

/*-- begin social block --*/
.social-intro {
    margin: 0 auto;
    max-width: 600px;
}
.list-form li,
.block-form p,
.title-small-initial,
.social-intro .title-small {
    color: #0A2364;
    font-style: normal;
}
.social-tabs li {
    margin: 0 10px;
    display: inline-block;
}
.social-tabs .fa {
    color: #fff;
    padding: 0;
    width: 50px;
    height: 47px;
    font-size: 25px;
    line-height: 50px;
    border-radius: 7px;
    -webkit-transition: .1s all ease-in-out;
    -moz-transition: .1s all ease-in-out;
    -ms-transition: .1s all ease-in-out;
    -o-transition: .1s all ease-in-out;
    transition: .1s all ease-in-out;
}

/*-- instagram --*/
#instagram .tab-block,
.social-tabs .fa-instagram {
    background: rgb(157,213,58);
    box-shadow: 0 5px 0 #962372;
    background: -moz-linear-gradient(left,  rgba(157,213,58,1) 0%, rgba(157,213,58,1) 0%, rgba(205,57,158,1) 0%, rgba(205,57,158,1) 50%, rgba(188,42,141,1) 51%, rgba(188,42,141,1) 100%);
    background: -webkit-linear-gradient(left,  rgba(157,213,58,1) 0%,rgba(157,213,58,1) 0%,rgba(205,57,158,1) 0%,rgba(205,57,158,1) 50%,rgba(188,42,141,1) 51%,rgba(188,42,141,1) 100%);
    background: linear-gradient(to right,  rgba(157,213,58,1) 0%,rgba(157,213,58,1) 0%,rgba(205,57,158,1) 0%,rgba(205,57,158,1) 50%,rgba(188,42,141,1) 51%,rgba(188,42,141,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a', endColorstr='#bc2a8d',GradientType=1 );
}
.social-tabs .active .fa-instagram,
.social-tabs .fa-instagram:hover {
    box-shadow: 0 3px 0 #962372;
}

/*-- facebook --*/
#facebook .tab-block,
.social-tabs .fa-facebook {
    background: rgb(157,213,58);
    box-shadow: 0 5px 0 #415796;
    background: -moz-linear-gradient(left,  rgba(157,213,58,1) 0%, rgba(157,213,58,1) 0%, rgba(84,111,186,1) 0%, rgba(84,111,186,1) 50%, rgba(71,99,178,1) 51%, rgba(71,99,178,1) 100%);
    background: -webkit-linear-gradient(left,  rgba(157,213,58,1) 0%,rgba(157,213,58,1) 0%,rgba(84,111,186,1) 0%,rgba(84,111,186,1) 50%,rgba(71,99,178,1) 51%,rgba(71,99,178,1) 100%);
    background: linear-gradient(to right,  rgba(157,213,58,1) 0%,rgba(157,213,58,1) 0%,rgba(84,111,186,1) 0%,rgba(84,111,186,1) 50%,rgba(71,99,178,1) 51%,rgba(71,99,178,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a', endColorstr='#4763b2',GradientType=1 );
}
.social-tabs .active .fa-facebook,
.social-tabs .fa-facebook:hover {
    box-shadow: 0 3px 0 #415796;
}

/*-- twitter --*/
#twitter .tab-block,
.social-tabs .fa-twitter {
    background: rgb(157,213,58);
    box-shadow: 0 5px 0 #07698a;
    background: -moz-linear-gradient(left,  rgba(157,213,58,1) 0%, rgba(157,213,58,1) 0%, rgba(11,155,202,1) 0%, rgba(11,155,202,1) 50%, rgba(6,140,185,1) 51%, rgba(6,140,185,1) 100%);
    background: -webkit-linear-gradient(left,  rgba(157,213,58,1) 0%,rgba(157,213,58,1) 0%,rgba(11,155,202,1) 0%,rgba(11,155,202,1) 50%,rgba(6,140,185,1) 51%,rgba(6,140,185,1) 100%);
    background: linear-gradient(to right,  rgba(157,213,58,1) 0%,rgba(157,213,58,1) 0%,rgba(11,155,202,1) 0%,rgba(11,155,202,1) 50%,rgba(6,140,185,1) 51%,rgba(6,140,185,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a', endColorstr='#068cb9',GradientType=1 );
}
.social-tabs .active .fa-twitter,
.social-tabs .fa-twitter:hover {
    box-shadow: 0 3px 0 #07698a;
}

/*-- youtube --*/
#youtube .tab-block,
.social-tabs .fa-youtube-play {
    background: rgb(157,213,58);
    box-shadow: 0 5px 0 #9a151a;
    background: -moz-linear-gradient(left,  rgba(157,213,58,1) 0%, rgba(157,213,58,1) 0%, rgba(196,84,86,1) 0%, rgba(196,84,86,1) 50%, rgba(210,28,34,1) 51%, rgba(210,28,34,1) 100%);
    background: -webkit-linear-gradient(left,  rgba(157,213,58,1) 0%,rgba(157,213,58,1) 0%,rgba(196,84,86,1) 0%,rgba(196,84,86,1) 50%,rgba(210,28,34,1) 51%,rgba(210,28,34,1) 100%);
    background: linear-gradient(to right,  rgba(157,213,58,1) 0%,rgba(157,213,58,1) 0%,rgba(196,84,86,1) 0%,rgba(196,84,86,1) 50%,rgba(210,28,34,1) 51%,rgba(210,28,34,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a', endColorstr='#d21c22',GradientType=1 );
}
.social-tabs .active .fa-youtube-play,
.social-tabs .fa-youtube-play:hover {
    box-shadow: 0 3px 0 #9a151a;
}

/*-- linkedin --*/
#linkedin .tab-block,
.social-tabs .fa-linkedin {
    background: rgb(157,213,58);
    box-shadow: 0 5px 0 #066c90;
    background: -moz-linear-gradient(left,  rgba(157,213,58,1) 0%, rgba(157,213,58,1) 0%, rgba(54,149,203,1) 0%, rgba(54,149,203,1) 50%, rgba(7,141,188,1) 51%, rgba(7,141,188,1) 100%);
    background: -webkit-linear-gradient(left,  rgba(157,213,58,1) 0%,rgba(157,213,58,1) 0%,rgba(54,149,203,1) 0%,rgba(54,149,203,1) 50%,rgba(7,141,188,1) 51%,rgba(7,141,188,1) 100%);
    background: linear-gradient(to right,  rgba(157,213,58,1) 0%,rgba(157,213,58,1) 0%,rgba(54,149,203,1) 0%,rgba(54,149,203,1) 50%,rgba(7,141,188,1) 51%,rgba(7,141,188,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a', endColorstr='#078dbc',GradientType=1 );
}
.social-tabs .active .fa-linkedin,
.social-tabs .fa-linkedin:hover {
    box-shadow: 0 3px 0 #066c90;
}

/*-- snapchat--*/
#snapchat .tab-block,
.social-tabs .fa-snapchat-ghost {
    background: rgb(157,213,58);
    box-shadow: 0 5px 0 #dedb0b;
    background: -moz-linear-gradient(left,  rgba(157,213,58,1) 0%, rgba(157,213,58,1) 0%, rgba(254,252,8,1) 0%, rgba(254,252,8,1) 50%, rgba(245,242,19,1) 51%, rgba(245,242,19,1) 100%);
    background: -webkit-linear-gradient(left,  rgba(157,213,58,1) 0%,rgba(157,213,58,1) 0%,rgba(254,252,8,1) 0%,rgba(254,252,8,1) 50%,rgba(245,242,19,1) 51%,rgba(245,242,19,1) 100%);
    background: linear-gradient(to right,  rgba(157,213,58,1) 0%,rgba(157,213,58,1) 0%,rgba(254,252,8,1) 0%,rgba(254,252,8,1) 50%,rgba(245,242,19,1) 51%,rgba(245,242,19,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a', endColorstr='#f5f213',GradientType=1 );
}
.social-tabs .active .fa-snapchat-ghost,
.social-tabs .fa-snapchat-ghost:hover {
    box-shadow: 0 3px 0 #dedb0b;
}
.tab-content .fa-snapchat-ghost:before,
.social-tabs .fa-snapchat-ghost:before {
    -webkit-text-stroke: 1px #000;
}
.tab-block {
    color: #fff;
    width: 100%;
    padding: 15px;
    font-size: 26px;
    text-align: center;
    border-radius: 7px;
    line-height: 20px;
    margin-bottom: 5px;
}
.social-content {
    margin-top: 50px;
}
.tab-info {
    padding: 30px;
    background-color: #F1FAFF;
    margin: 0 5px 0;
}
.tab-square {
    min-height: 300px;
    background-color: #fff;
}
.tab-title {
    margin-bottom: 20px;
}
.tab-title img {
    width: auto;
    max-height: 45px;
    display: inline-block;
}
/*-- begin search --*/
.search input {
    outline: none;
    line-height: 25px;
    min-width: 300px;
    margin-right: 10px;
    border-radius: 30px;
    padding: 5px 15px 3px;
    border: 1px solid #E7E5E5;
}
/*-- IE Selector --*/
_:-ms-fullscreen, :root .search input {
    padding-bottom: 11px;
}
_:-ms-fullscreen, :root .wrapper-search {
    width: 270px;
}
_:-ms-fullscreen, :root .wrapper-search button {
    height: 32px;
}
.search .opt-emphasis {
    border: none;
    line-height: 26px;
}
.block-square {
    margin-top: 40px;
}

/*-- begin carousel initial --*/
.carousel-initial .slick-arrow:before {
    color: #133370;
    font-size: 40px;
}
.carousel-initial .slick-next {
    right: 0;
}
.carousel-initial .slick-dots {
    position: static;
    margin-top: 20px;
}

/*-- begin circle --*/
.block-circle {
    color: #fff;
    display: table;
    width: 132px;
    margin: 20px auto;
    border-radius: 50%;
    background-color: red;
    background: url('../img/bg-blocks.jpg') center no-repeat;
    background-size: cover;
}
.block-circle .content {
    color: #fff;
    width: 132px;
    height: 132px;
    position: relative;
    overflow: hidden;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
}
.block-circle .content span {
    position: relative;
    max-width: 125px;
    display: inline-block;
    vertical-align: middle;
    text-shadow: 0 0 13px #000;
}
.block-circle .content:before {
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    content: "";
    display: block;
    position: absolute;
    background-color: rgba(0,0,0,.1);
    border-radius: 50%;
}
.block-video {
    overflow: hidden;
    max-width: 570px;
}
.block-video > div {
    float: left;
}
.img-video {
    width: 30%;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    border-radius: 50%;
    font: normal normal normal 14px/1 FontAwesome;
}
.img-video img {
    width: 100%;
    height: auto;
}
.caption-thumb {
    width: 70%;
    padding: 40px 10px;
}
.caption-thumb p {
    color: #101B59;
    font-size: 16px;
}
.caption-thumb b {
    font-weight: 700;
}
.caption-thumb i {
    display: block;
    font-size: 14px;
    color: #38C2D4;
    margin-top: 5px;
    font-style: normal;
}
.img-video:before {
    top: 50%;
    left: 50%;
    font-size: 42px;
    content: "f04b";
    position: absolute;
    margin: -23px 0 0 -10px;
    color: rgba(255,255,255,.7);
}
.block-items {
    padding: 15px;
}
.block-items li {
    color: #38C2D4;
    font-size: 16px;
    margin-top: 5px;
    font-weight: 400;
}

/*-- begin modal --*/
.block-modal {
    width: 100%;
    padding: 20px;
}
.btn-close {
    opacity: 1;
    top: 20px;
    right: 20px;
    color: #133370;
    font-size: 20px;
    position: absolute;
}
.field {
    width: 100%;
    border: none;
    outline: none;
    margin-top: 15px;
    padding: 10px;
    background-color: #eee;
    border-left: 3px solid #133370;
}
.block-form .opt-dropdown select {
    margin: 0;
    width: 100%;
    border: none;
    color: #757575;
    font-size: 14px;
    background-color: #eee;
    font-weight: 500;
    padding: 10px;
}
.block-form .title-small-top {
    font-size: 16px;
    font-family: inherit;
    margin-right: 25px;
    margin-bottom: 0;
}
.block-form table td {
    padding-top: 10px;
}
.list-form {
    margin: 0;
    padding: 0;
}
.list-form li {
    margin-top: 5px;
    margin-left: 15px;
    list-style-position: outside;
}
.block-check {
    margin-top: 20px;
}
.block-check label {
    margin: 0;
    color: #666;
    padding: 5px 0;
    font-weight: 400;
}
.wrapper-input-file {
    overflow: hidden;
    position: relative;
    margin-top: 20px;
    background-color: #eee;
}
.wrapper-input-file input {
    left: 0;
    top: 0;
    right: 0;
    opacity: 0;
    bottom: 0;
    outline: none;
    cursor: pointer;
    position: absolute;
}
.block-input-file > span {
    color: #a3a3a3;
    padding: 7px 10px;
}
.btn-file {
    color: #fff !important;
    background-color: #00a3c2;
}
/*-- Begin search block --*/
.header-link {
    position: relative;
    display: inline-block;
}
.wrapper-search {
    right: 0;
    left: auto;
    width: 240px;
    padding: 10px;
    background-color: #fff;
    box-shadow: 0 3px 10px #000;
}
.wrapper-search input {
    float: left;
    width: 78%;
    outline: none;
    color: #123270;
    font-weight: 200;
    padding: 7px 10px;
}
.wrapper-search button {
    color: #fff;
    width: 22%;
    height: 38px;
    border: none;
    font-size: 16px;
    line-height: 15px;
    padding: 8px 12px;
    box-sizing: border-box;
    border-left: 4px solid #fff;
    background-color: #123270;
}
.sidebar .panel,
.header-link .dropdown #dLabel {
    padding: 0;
    border: none;
    outline: none;
    background: none;
}
/*-- begin social --*/
.square-social {
    display: none !important;
}
.wrapper-opt-social input:checked + .square-social {
    right: 0;
    z-index: 1;
    width: 105px;
    background: #fff;
    text-align: center;
    border: 1px solid;
    padding: 5px 0px;
    position: absolute;
    border-color: #eee;
    border-radius: 3px;
    display: block !important;
}
.wrapper-opt-social {
    width: 20px;
    height: 30px;
    color: #f39b13;
    cursor: pointer;
    font-size: 21px;
    position: relative;
    margin-right: 13px;
    font-family: 'FontAwesome';
}
.wrapper-opt-social:before {
    content: "f1e0";
}
.news-date .wrapper-opt-social {
    margin-right: 0;
}
.square-social a {
    color: #fff;
    margin-left: 5px;
    text-decoration: none;
    margin-right: 0;
}
.square-social a:first-child {
    margin-left: 0;
}
.wrapper-link li {
    list-style: none;
}
.opt-collapse {
    width: 100%;
    display: block;
    font-weight: 700;
    border-radius: 5px;
    padding: 13px 15px;
    margin-bottom: 10px;
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
}
.opt-collapse .fa {
    float: right;
    font-size: 24px;
    font-weight: 700;
    line-height: 20px;
}
.wrapper-title .title-medium {
    font-size: 18px;
    margin: 2px 0 0;
}
.wrapper-title .title-medium-extra {
    font-size: 14px;
    color: #808080 !important;
}
.wrapper-title .title-medium {
    color: #66BED0;
}
.modal-content iframe {
    width: 100%;
    border: none;
    display: block;
    height: 340px;
}
.modal-video .close {
    top: -5px;
    opacity: 1;
    color: #fff;
    right: -20px;
    position: absolute;
}
.opt-follow {
    top: 5px;
    color: #fff;
    font-size: 18px;
    position: relative;
    line-height: 27px;
    margin-left: 15px;
    display: inline-block;
    padding: 5px 10px 5px;
}
.opt-follow small {
    top: -1px;
    height: 15px;
    margin-left: 5px;
    position: relative;
    line-height: 14px;
    padding-left: 10px;
    display: inline-block;
    border-left: 1px solid #fff;
}
.opt-follow:hover {
    color: #fff;
    text-decoration: none;
}
#facebook .opt-follow {
    background-color: #415796;
}
#instagram .opt-follow {
    background-color: #962372;
}
#twitter .opt-follow {
    background-color: #0b9bca;
}
#youtube .opt-follow {
    background-color: #c45456;
}
#linkedin .opt-follow {
    background-color: #3695cb;
}
.panel-title .title-medium {
    width: 100%;
    display: inline-block;
}
.wrapper-thumb .carousel-blocks .slick-prev:before,
.wrapper-thumb .carousel-blocks .slick-next:before {
    color: #fff;
    font-size: 40px;
}
.wrapper-thumb .carousel-blocks .slick-prev {
    left: 30px;
}
.wrapper-thumb .carousel-blocks .slick-next {
    right: 30px;
}
.carousel-caption .opt-emphasis {
    font-weight: 700;
    margin-top: 20px;
    text-shadow: none;
}
@media (min-width: 768px) {
    .row.text-center > div {
        float: none;
        display: inline-block;
    }
}
@media (max-width:991px) {
    .section,
    .navbar-collapse .header-top {
        border: none;
        margin-bottom: 20px;
    }
    .block-thumb {
        height: auto;
        overflow: visible;
        padding: 10px 30px;
    }
    .block-thumb:before {
        display: none;
    }
    .block-thumb img {
        position: static;
    }
    .info-thumb {
        opacity: 1;
        color: #000;
        margin-top: 0;
        text-align: left;
        position: static;
        visibility: visible;
    }
    .info-thumb span,
    .block-thumb-small {
        margin-top: 10px;
    }
    .opt-link-initial {
        color: #38C2D4;
        background: url('../img/fast-forward.svg') left center no-repeat;
        background-size: 10px;
    }
    .fit {
        max-width: none;
    }
    .wrapper-info {
        padding-top: 15px;
        padding-bottom: 15px;
    }
    .wrapper-slideshow .title-medium {
        text-align: left;
    }
    .wrapper-collapse a.title-medium {
        width: 100%;
        line-height: 27px;
        display: inline-block;
    }
    .wrapper-link .title-medium,
    .sidebar .wrapper-collapse a.title-medium {
        font-size: 18px;
    }
    .label-row {
        display: block;
        line-height: 28px;
        margin: 8px 0 18px;
    }
}
@media (min-width: 768px) and (max-width: 991px) {
    .header-top {
        text-align: center
    }
}
@media (max-width: 768px) {
    .featured h3 {
        font-size: 18px;
    }
    .featured p {
        font-size: 14px;
    }
    .featured .carousel-caption {
        left: 0;
        right: 0;
        width: 100%;
        text-align: center;
    }
    .thumb-img {
        max-width: 130px;
        margin: 0 auto 10px;
        float: none !important;
    }
    .square-thumb {
        text-align: center;
        margin-bottom: 40px;
    }
    .opt-dropdown select {
        margin: 0;
        width: 100%;
        display: block;
    }
    .slick-prev,
    .slick-next,
    .info-avatar ul li:before{
        display: none !important;
    }
    .thumb-info {
        float: none !important;
    }
    .tab-square {
        margin: 20px auto;
    }
    .block-ads {
        margin-bottom: 90px;
    }
    .single,
    .block-video,
    .square-video,
    .social-tabs .fa {
        margin-top: 20px;
    }
    .search input,
    .search .opt-emphasis {
        width: 100%;
        display: block;
        margin-bottom: 10px;
    }
    .block-form .opt-emphasis {
        width: 100%;
        display: block;
        text-align: center;
        margin-top: 20px;
    }
    .wrapper-search {
        top: auto;
        left: -50px;
    }
    .opt-follow,
    .caption-video,
    .caption-video .title-medium,
    .row-mini:first-child .block-thumb-mini:first-child {
        margin: 0;
    }
    .wrapper-social .opt-url a {
        display: inline-block;
        margin-bottom: 10px;
    }
    
    .wrapper-link .title-medium,
    .sidebar .wrapper-collapse a.title-medium {
        font-size: 18px;
        padding-top: 10px;
        border-top: 1px solid #ddd;
    }
    .sidebar .well .panel,
    .sidebar .well .panel-group,
    .sidebar .well .title-medium {
        margin-bottom: 10px;
    }
    .wrapper-list,
    .sidebar .panel:first-child .title-medium {
        border: none;
    }
    .opt-pagination .opt-page {
        font-size: 24px;
        margin-left: 14px;
    }
    .opt-pagination .fa {
        font-size: 21px;
        margin-left: 20px;
    }
    .modal-video .close {
        top: 5px;
        right: 10px;
        font-size: 32px;
    }
    .block-carousel .banner-caption {
        padding: 0;
        position: static;
        background: none;
    }
    .block-carousel .banner-caption .title-small-banner {
        color: #133370;
    }
    .block-video {
        margin-left: 20px;
    }
    .caption-thumb {
        padding-top: 0;
    }
    .slick-next,
    .wrapper-collapse a.title-medium:before, 
    .wrapper-collapse a.title-medium-extra:before{
        right: 0;
    }
    .wrapper-social-info {
        overflow: auto;
        max-height: 480px;
    }
    .thumb-video,
    .wrapper-videos .title-small-top {
        text-align: left;
        margin: 0 0 20px !important;
    }
    .header-top {
        text-align: center
    }
    .block-profile .row .caption-profile {
        padding: 0;
        position: static;
    }
    .caption-left {
        left: auto !important;
    }
}
@media (max-width: 767px) {
     .header-top {
        text-align: left;
        background: none;
    }
    .label-legal,
    .label-footer {
        text-align: center;
    }
    .footer .title-medium {
        position: relative;
        margin: 15px 0 20px;
    }
    .footer .title-medium .fa {
        right: 0;
        font-size: 28px;
        position: absolute;
    }
    .footer .title-medium .fa-angle-down,
    .footer .title-medium .collapsed .fa-angle-up {
        display: none;
    }
    .footer .title-medium .fa-angle-up,
    .footer .title-medium .collapsed .fa-angle-down {
        display: inline-block;
    }
}
@media (max-width: 400px) {
    .logo {
        width: 195px;
    }
    .navbar-brand {
        height: auto;
    }
    .navbar-toggle,
    .thumb-video, .wrapper-media {
        margin: 15px 0;
    }
    .footer-bottom .panel-group {
        margin-bottom: 0;
    }
    .caption-video,
    .footer-copyright,
    .block-split:first-child {
        margin-top: 0;
    }
    .wrapper-search {
        top: auto;
        left: -8px;
        bottom: 30px;
    }
    .block-thumb-small {
        height: 100px;
    }
    .caption-img {
        padding: 0;
        position: static;
        margin: 15px 0 0;
    }
    .block-split {
        border: none;
        margin-top: 90px;
    }
    .wrapper-split-list {
        border: none;
    }
}
Regresar