﻿@font-face {
    font-family: 'Nunito';
    src: url('../fonts/Nunito/Nunito-Regular.ttf');
}

body {
    font-family: 'Nunito', sans-serif;
    font-weight: 400;
    font-size: 16px;
    background-color: #eeeeee50;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 600;
    font-family: 'Nunito', sans-serif;
    color: #272727;
}

a:hover {
    text-decoration: none;
}

a h5 {
    color: #337ab7;
    text-decoration: none;
    font-weight: 500;
}


/******
UL STYLE
******/

.guiones {
    list-style-type: '- ';
}

.noStyle {
    list-style-type: none;
}

#numerada ol {
    counter-reset: list;
}

    #numerada ol > li {
        list-style: none;
    }

        #numerada ol > li:before {
            content: counter(list, number) ") ";
            counter-increment: list;
        }

#alfa ol {
    counter-reset: list;
}

    #alfa ol > li {
        list-style: none;
    }

        #alfa ol > li:before {
            content: counter(list, lower-alpha) ") ";
            counter-increment: list;
        }

/******
NAVBAR PRINCIPAL
******/

.navbar {
    /*background-image: url("../img/background-bar.jpg");*/
    margin-bottom: 0;
    border-radius: 0;
    border: 0;
    min-height: 60px;
    font-size: 16px;
}

.navbar-nav > li > a {
    line-height: 40px;
    font-size: 18px;
    font-weight: bold;
}

.navbar-brand {
    padding: 10px 15px;
    height: 72px;
    line-height: 72px;
}

.navbar-toggle {
    margin-top: 20px;
    padding: 10px 10px !important;
}

.navbar-default .navbar-nav > li > a {
    color: #000;
    height: 72px;
}

.navbar-default {
    background: #f5f5f5;
}

    /*@media only screen and (min-width: 768px) {
    .navbar-default .nav > li > a:active {
        pointer-events: none;
        cursor: pointer;
    }
}*/

    .navbar-default .nav > li > a:focus,
    .navbar-default .nav > li > a:hover {
        text-decoration: none;
        color: #000 !important;
        background-color: rgba(197, 197, 197, 0.25) !important;
    }

.container-fluid > .navbar-collapse,
.container-fluid > .navbar-header,
.container > .navbar-collapse,
.container > .navbar-header {
    border: 0px;
}

.logo {
    width: 280px;
    padding: 10px;
}

.ospac-img {
    width: 260px;
}

.ospac-img:hover {
    filter: brightness(500%);
}

@media only screen and (max-width: 768px) {
    .ospac-img {
        /*width: 150px;*/
        /*padding: 0 0 10px;*/
    }
}

.dropdown-menu {
    background-color: rgba(238, 238, 238, 0.900);
}

    .dropdown-menu .divider {
        background-color: #eee;
    }

    .dropdown-menu li > a:focus,
    .dropdown-menu li > a:hover {
        background-color: rgba(78, 182, 198, 0.250);
    }

.dropdown-header {
    padding: 0px 10px;
    margin: 2px;
}

/******
ACCESOS DIRECTOS 3
******/

.institucional {
    margin: 25px 5px 5px 5px;
}

    .institucional a {
        text-decoration: none;
        font-size: 15px;
    }


.conectados {
    margin: 5px 5px 5px 5px;
    padding: 0px;
    color: #337ab7;
    font-size: 12px;
}

    .conectados a {
        text-decoration: none;
        font-size: 12px;
    }

.bold {
    font-weight: bold;
}

/******
ACCESOS DIRECTOS
******/

.redondear {
    border-radius: 0.75rem;
}

.contenedor {
    top: 40px;
    width: 340px;
    position: absolute;
    right: 5%;
    height: 100px;
    z-index: 1000;
    text-align: center;
}

    .contenedor a {
        color: #FFF;
        text-decoration: none;
    }

.bloque {
    border-radius: 0.70rem;
    height: 60px;
    font-weight: 500;
    text-align: center;
    color: #FFF;
    line-height: 2rem;
    border: 2px solid #FFF;
    padding: 8px;
    font-size: 18px;
}

.bloque-ospac {
    border-radius: 0.70rem;
    border: 2px solid #FFF;
    background: #ffffffa8;
}

    .bloque-ospac:hover {
        background-image: linear-gradient(to right, rgba(97, 184, 122, 0.7), rgba(67, 109, 145, 0.7));
    }

.bloque-elecciones {
    border-radius: 0.70rem;
    height: 30px;
    font-weight: 500;
    text-align: center;
    color: #FFF;
    line-height: 2rem;
    border: 2px solid #FFF;
    padding: 4px;
    font-size: 14px;
    background-color: #a7b5c1;
    /*background-color: #016944;*/
    /*background-color: #803319;*/
}

.preguntas {
    background-color: #DA5F06;
}

.consultas {
    background-color: #D39D2F;
}

.afiliados {
    background-color: #00688A;
}

.instituciones {
    background-color: #A8D7E3;
}

.redes-top {
    background-color: rgba(238, 238, 238, 0.600);
    text-align: center;
    line-height: 2rem;
    border-top-left-radius: 0.45rem;
    border-top-right-radius: 0.45rem;
}

.redes-icon {
    width: 30px;
    padding-right: 5px;
}

/*.insta {
    background: linear-gradient(135deg, #f58529 0%, #ffda77 25%, #dd2a7b 50%, #8134af 75%, #515bd4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
}

.whatsapp {
    background: linear-gradient(135deg, #075e54 0%, #128c7e 25%, #25d366 50%, #dcf8c6 75%, #34b7f1 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.youtube {
    background: linear-gradient(135deg, #5335cf 0%, #de005e 25%, #f66e48 50%, #de005e 75%, #5335cf 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}*/

.redes-top a {
    color: #000;
}

.redes-bottom {
    background-color: rgba(238, 238, 238, 0.600);
    text-align: center;
    line-height: 2rem;
    border-bottom-left-radius: 0.35rem;
    border-bottom-right-radius: 0.35rem;
}

/******
BARRA DEL PIE
******/

footer {
    background-color: #2e2e2e;
    padding: 25px;
}

#footer {
    padding-top: 15px;
    padding-bottom: 15px;
    color: #fff;
    background: #2e2e2e;
    margin-top: 50px;
}

    #footer a {
        color: #fff;
    }

        #footer a:hover {
            color: #45aed6;
        }

    #footer ul {
        list-style: none;
        padding: 0;
        margin: 0 -7.5px;
    }

        #footer ul > li {
            display: inline-block;
            margin: 0 7.5px;
        }

@media only screen and (min-width: 768px) {
    #footer .social-icons {
        float: right;
    }
}

/******
BANNER T�TULOS
******/

.banner {
    height: 340px;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
}

.banner-autoridades {
    background-image: url("../images/jumbotron/Autoridades.png");
}

.banner-centros {
    background-image: url("../images/jumbotron/Centros\ de\ Atencion.png");
}

.banner-marcoLegal {
    background-image: url("../images/jumbotron/Marco\ Legal.png");
}

/**Jubilaci�n**/

.banner-aportes {
    background-image: url("../images/jumbotron/Aportes\ y\ Categorias\ 1200x300.png");
}

.banner-cancelacion {
    background-image: url("../images/jumbotron/Cancelacion\ de\ Afiliacion\ 1200x300.png");
}

.banner-feDeVida {
    background-image: url("../images/jumbotron/Fe\ de\ Vida\ 1200x300.png");
}

.banner-jubilacion {
    background-image: url("../images/jumbotron/Jubilaciones\ y\ Pensiones\ 1200x300.png");
}

.banner-pension {
    background-image: url("../images/jumbotron/Pension.png");
}

.banner-prevision {
    background-image: url("../images/jumbotron/Opciones\ para\ Prevision\ 1200x300.png");
}

.banner-subsidios {
    background-image: url("../images/jumbotron/Subsidios\ 1200x300.png");
}

/**Obra Social**/

.banner-quieroAfiliarme {
    background-image: url("../images/jumbotron/Quiero\ Afiliarme\ 1200x300.png");
}

.banner-tokenOspac {
    background-image: url("../images/jumbotron/Token\ OSPAC.png");
}

.banner-planes {
    background-image: url("../images/jumbotron/Nuestros\ Planes\ 1200x300.png");
}

.banner-atencionDirecta {
    background-image: url("../images/jumbotron/Atencion\ Directa\ 1200x300.png");
}

.banner-planMaternoInfantil {
    background-image: url("../images/jumbotron/Plan\ Materno\ Infantil\ 1200x300.png");
}

.banner-servicioDeEmergencia {
    background-image: url("../images/jumbotron/Servicio\ de\ Emergencia\ 1200x300.png");
}

.banner-asistenciaEnViajes {
    background-image: url("../images/jumbotron/Asistencia\ en\ Viajes\ 1200x300.png");
}

.banner-trasplante {
    background-image: url("../images/jumbotron/Trasplante\ 1200x300.png");
}

.banner-protesisYOrtesis {
    background-image: url("../images/jumbotron/Protesis\ y\ Ortesis\ 1200x300.png");
}

.banner-implantesDentales {
    background-image: url("../images/jumbotron/Implantes\ Dentales\ 1200x300.png");
}

.banner-discapacidad {
    background-image: url("../images/jumbotron/Discapacidad\ 1200x300.png");
}

.banner-subsidioPorSepelio {
    background-image: url("../images/jumbotron/Subsidio\ por\ Sepelio\ 1200x300.png");
}

.banner-otrosBeneficios {
    background-image: url("../images/jumbotron/Cobertura\ Celiaquia\ 1200x300.png");
}

/**Otros Beneficios**/

.banner-prestamosPerA {
    background-image: url("../images/jumbotron/Prestamos\ para\ gastos\ no\ cubiertos\ por\ OSPAC.png");
}

.banner-prestamosPerJP {
    background-image: url("../images/jumbotron/Prestamos\ Personales\ para\ Jubilados\ y\ Pensionados.png");
}

.banner-prestamosGastos {
    background-image: url("../images/jumbotron/Prestamos\ para\ gastos\ no\ cubiertos\ por\ OSPAC.png");
}

.banner-subsidioExtra {
    background-image: url("../images/jumbotron/Subsidios\ 1200x300.png");
}

/*.banner-Estampillado {
    background-image: url("../images/jumbotron/");
}*/

/*.banner-tercerContribuyente {
    background-image: url("../images/jumbotron/");
}*/

/**+Info**/

.banner-appCpac {
    background-image: url("../images/jumbotron/APP\ CPAC.png");
}

.banner-formularios {
    background-image: url("../images/jumbotron/Formularios.png");
}

.banner-mediosDePago {
    background-image: url("../images/jumbotron/Medios\ de\ Pago.png");
}

.banner-redes {
    background-image: url("../images/jumbotron/Redes\ Sociales.png");
}

.banner-preguntasFrecuentes {
    background-image: url("../images/jumbotron/Preguntas\ frecuentes.png");
}

.jumbotron {
    background-color: #FFF;
    padding-top: 0px;
    padding-bottom: 0px;
}

    .jumbotron .banner h2 {
        color: #000000;
        font-weight: bold;
        padding: 60px 0px 0px 100px;
        font-size: 40px;
    }

    .jumbotron .row {
        padding-left: 0px;
        padding-right: 0px;
        margin-left: 0px;
        margin-right: 0px;
    }

@media only screen and (max-width: 768px) {
    .banner-autoridades {
        background-position: 40% 20px;
    }

    .banner-marcoLegal {
        background-position: 45% 60px;
    }

    .banner-centros {
        background-position: 25% 45px;
    }

    /**Jubilacion**/

    .banner-aportes {
        background-position: 60%;
    }

    .banner-prevision {
        background-position: 20%;
    }

    .banner-cancelacion {
        background-position: 40%;
    }

    .banner-feDeVida {
        background-position: 50%;
    }

    .banner-jubilacion {
        background-position: 30% 60px;
    }

    .banner-pension {
        background-position: 40% 60px;
    }

    .banner-subsidios {
        background-position: 50% 60px;
    }

    /**Obra Social**/

    .banner-quieroAfiliarme {
        background-position: 45% 60px;
    }

    .banner-tokenOspac {
        background-position: 40% 60px;
    }

    .banner-atencionDirecta {
        background-position: 40%;
    }

    .banner-planMaternoInfantil {
        background-position: 45%;
    }

    .banner-servicioDeEmergencia {
        background-position: 25% 60px;
    }

    .banner-asistenciaEnViajes {
        background-position: 50% 60px;
    }

    .banner-trasplante {
        background-position: 40% 40px;
    }

    .banner-protesisYOrtesis {
        background-position: 48%;
    }

    .banner-discapacidad {
        background-position: 60%;
    }

    .banner-implantesDentales {
        background-position: 60%;
    }

    .banner-subsidioPorSepelio {
        background-position: 40% 40px;
    }

    .banner-otrosBeneficios {
        background-position: 40% 40px;
    }

    /**Otros Beneficios**/

    .banner-prestamosPerA {
        background-position: 20% 40px;
    }

    .banner-prestamosPerJP {
        background-position: 45% 40px;
    }

    .banner-prestamosGastos {
        background-position: 40% 40px;
    }

    .banner-subsidioExtra {
        background-position: 40% 40px;
    }

    .banner-Estampillado {
        background-position: 40% 40px;
    }

    .banner-tercerContribuyente {
        background-position: 40% 40px;
    }

    /**+Info**/

    .banner-mediosDePago {
        background-position: 40% 60px;
    }

    .banner-appCpac {
        background-position: 50% 60px;
    }

    .banner-redes {
        background-position: 50% 60px;
    }

    .banner-preguntasFrecuentes {
        background-position: 60% 60px;
    }

    .banner-formularios {
        background-position: 20% 60px;
    }
}

/******
INDEX SLIDER
******/

/*#main-slider {
    overflow: hidden;
}*/

#main-slider .item {
    height: 470px; /*340px;*/
    background-repeat: no-repeat;
    background-position: 40% 0;
    background-size: cover;
}

#main-slider .slider-inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    color: #fff;
}

    #main-slider .slider-inner h2 {
        margin-top: 90px;
        font-size: 36px;
        line-height: 1;
        text-transform: uppercase;
        color: #000;
    }

        #main-slider .slider-inner h2 > span {
            color: #45aed6;
        }

    #main-slider .slider-inner .btn {
        margin-top: 10px;
    }

#main-slider .owl-prev,
#main-slider .owl-next {
    position: absolute;
    top: 50%;
    background-color: rgba(0, 0, 0, 0.2);
    color: #fff;
    font-size: 30px;
    display: inline-block;
    margin-top: -35px;
    height: 70px;
    width: 70px;
    line-height: 70px;
    text-align: center;
    border-radius: 100px;
    z-index: 5;
    -webkit-transition: background-color 400ms;
    transition: background-color 400ms;
}

    #main-slider .owl-prev:hover,
    #main-slider .owl-next:hover {
        background-color: #45aed6;
    }

#main-slider .owl-prev {
    left: -35px;
    text-indent: 14px;
}

#main-slider .owl-next {
    right: -35px;
    text-indent: -14px;
}

#bar {
    width: 0%;
    max-width: 100%;
    height: 4px;
    background: #45aed6;
}

#progressBar {
    margin-top: -4px;
    position: relative;
    z-index: 999;
    width: 100%;
    background: rgba(0, 0, 0, 0.1);
}

@media only screen and (max-width: 768px) {
    #main-slider .item {
        height: 340px;
    }
    /*Se acomoda el background "Queremos cuidarte..." para versión movil*/
    #main-slider .owl-wrapper > .owl-item:first-child > .item {
        background-position-x: 90%;
    }
}

/****
PROGRESS BAR
****/
.transition-timer-carousel-progress-bar {
    height: 3px;
    background-color: #45aed6;
    width: 0%;
    margin: 0px 0px 0px 0px;
    border: none;
    z-index: 11;
    position: relative;
}

/******
MOBILE VIEW
******/
@media only screen and (max-width: 768px) {
    #main-slider .slider-inner h2 {
        margin-top: 60px;
        margin-left: 10px;
        font-size: 20px;
    }
}

@media only screen and (min-width: 768px) {
    .dropdown:hover .dropdown-menu {
        display: block;
    }
}

@media only screen and (max-width: 960px) {
    .contenedor {
        top: 45px;
        width: 30%;
    }
}

@media only screen and (max-width: 768px) {
    .contenedor {
        top: 0;
        position: relative;
        width: 96%;
        right: 0;
    }

    .institucional {
        margin: 10px;
    }

    .conectados {
        margin: 0px;
        padding: 0px;
    }

    .navbar-nav > li > a {
        line-height: 15px;
    }

    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        padding: 5px 45px;
    }

    .navbar-nav .open .dropdown-menu .dropdown-header,
    .navbar-nav .open .dropdown-menu > li > a > h5 {
        font-weight: bold;
    }

    .navbar-default .navbar-nav > li > a {
        height: unset;
    }

    .dropdown-menu .divider {
        background-color: #1d94b6;
    }

    .jumbotron .banner h2 {
        padding: 80px 0px 0px 25px;
        margin: 0px 35px 0px 0px;
        font-size: 30px;
    }
}

/******
CUERPO
*******/

.section-header > h2 {
    font-size: 32px;
    font-weight: 600;
    color: #12326e;
    padding-bottom: 10px;
}

.entry-header > .entry-title {
    font-size: 32px;
    font-weight: 600;
    color: #12326e;
}

h2 > span {
    color: #45aed6;
}


/* blog ************************************************************************************************/

#blog {
    margin-top: 100px;
}

.column-title {
    margin-top: 0;
    padding-bottom: 15px;
    border-bottom: 1px solid #eee;
    margin-bottom: 15px;
    position: relative;
}

    .column-title:after {
        content: " ";
        position: absolute;
        bottom: -1px;
        left: 0;
        width: 40%;
        border-bottom: 1px solid #45aed6;
    }

@media only screen and (max-width: 768px) {
    #blog {
        /*margin-top: 70px;*/
        padding-top: 70px;
    }
}

/* blog ************************************************************************************************/

#portfolio div.section-header {
    color: #000;
}

#portfolio h1,
#portfolio h2 {
    color: #000000;
}

#portfolio h4 {
    font-weight: bold;
    font-family: 'Nunito', sans-serif;
    color: #272727;
}

#portfolio {
    padding: 25px 0px 25px 0px;
}

    #portfolio .portfolio-filter {
        list-style: none;
        padding: 0;
        margin: 0 0 50px;
        display: inline-block;
    }

        #portfolio .portfolio-filter > li {
            float: left;
            display: block;
        }

            #portfolio .portfolio-filter > li a {
                display: block;
                padding: 7px 15px;
                background: #e5e5e5;
                color: #64686d;
                position: relative;
            }

                #portfolio .portfolio-filter > li a:hover,
                #portfolio .portfolio-filter > li a.active {
                    background: #45aed6;
                    color: #fff;
                    box-shadow: 0 -3px 0 0 #318daf inset;
                    -webkit-box-shadow: 0 -3px 0 0 #318daf inset;
                }

                    #portfolio .portfolio-filter > li a.active:after {
                        content: " ";
                        position: absolute;
                        bottom: -17px;
                        left: 50%;
                        margin-left: -10px;
                        border-width: 10px;
                        border-style: solid;
                        border-color: #318daf transparent transparent transparent;
                    }

            #portfolio .portfolio-filter > li:first-child a {
                border-radius: 4px 0 0 4px;
            }

            #portfolio .portfolio-filter > li:last-child a {
                border-radius: 0 4px 4px 0;
            }

    #portfolio .portfolio-items {
        margin: -15px;
    }

    #portfolio .portfolio-item {
        /*width: 24.9%;*/
        float: left;
        padding: 3px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
    }

        #portfolio .portfolio-item .portfolio-item-inner {
            position: relative;
        }

            #portfolio .portfolio-item .portfolio-item-inner .portfolio-info {
                opacity: 0;
                transition: opacity 400ms;
                -webkit-transition: opacity 400ms;
                position: absolute;
                bottom: 0;
                left: 0;
                right: 0;
                padding: 10px;
                background: rgba(0, 0, 0, 0.5);
                color: #fff;
            }

                #portfolio .portfolio-item .portfolio-item-inner .portfolio-info h3 {
                    font-size: 16px;
                    line-height: 1;
                    margin: 0;
                    color: #fff;
                }

                #portfolio .portfolio-item .portfolio-item-inner .portfolio-info .preview {
                    position: absolute;
                    top: -18px;
                    right: 12px;
                    border-radius: 50%;
                    width: 36px;
                    height: 36px;
                    line-height: 36px;
                    text-align: center;
                    color: #fff;
                    box-shadow: 0 0 0 2px #fff;
                    -webkit-box-shadow: 0 0 0 2px #fff;
                }

        #portfolio .portfolio-item:hover .portfolio-info {
            opacity: 1;
        }

    #portfolio h1,
    #portfolio h2 {
        color: #000000;
    }

    #portfolio div.section-footer {
        padding: 10px 0 10px;
        color: #fff;
    }

    #portfolio .team-member {
        /* padding: 0px 15px; */
        margin-bottom: 20px;
        /*height: fit-content;*/
        height: 370px;
        background: #fff;
        /*background: #eeeeee50;*/
        border-radius: 0.70rem;
        /* border: 2px solid #eeeeee;
    transition: border-color 400ms;
    -webkit-transition: border-color 400ms;
    border-radius: 0.70rem; */
    }

        #portfolio .team-member .team-img {
            margin: -15px -15px 0 -15px;
        }

    #portfolio .full .news-height {
        height: 485px;
    }

    #portfolio .team-img > a {
        text-decoration: none;
    }

    #portfolio .team-member .team-info {
        /* padding-bottom: 5px; */
        /*border-bottom: 1px solid #dbdbdb;*/
        margin-bottom: 10px;
        text-decoration: none;
    }

    #portfolio .team-info h5 {
        font-weight: 500;
        color: #fff;
        background-color: #a7b5c1;
        padding: 5px;
        border-radius: 0.3rem;
    }

    /*#portfolio .team-member:hover {
    border-color: #45aed6;
}*/

    #portfolio .team-member:hover .social-icons > li > a {
        background: #45aed6;
    }

    #portfolio .social-icons {
        list-style: none;
        padding: 0;
        margin: 0;
    }

        #portfolio .social-icons > li {
            display: inline-block;
        }

            #portfolio .social-icons > li > a {
                display: block;
                width: 25px;
                height: 25px;
                line-height: 24px;
                text-align: center;
                color: #fff;
                background: #45aed6;
                /*background: #222534;*/
                border-radius: 0.3rem;
            }

@media only screen and (max-width: 960px) {
    #portfolio .full .news-height {
        height: 365px;
    }

    #portfolio .team-member {
        height: 365px;
    }
}

#magazine div.section-header {
    color: #000000;
}

#magazine h1,
#magazine h2 {
    color: #000000;
}

#magazine div.section-footer {
    padding: 10px 0 10px;
    /*background-image: -moz-linear-gradient(90deg, #2c8cb3 0%, #2caab3 100%);
    background-image: -webkit-linear-gradient(90deg, #2c8cb3 0%, #2caab3 100%);
    background-image: -ms-linear-gradient(90deg, #2c8cb3 0%, #2caab3 100%);*/
    color: #fff;
}

#magazine .team-member {
    padding: 13px;
    background: #eeeeee;
    border: 2px solid #eeeeee;
    transition: border-color 400ms;
    -webkit-transition: border-color 400ms;
    border-radius: 0.70rem;
}

    #magazine .team-member .team-img {
        margin: -15px -15px 0 -15px;
    }

#magazine .team-img > a {
    text-decoration: none;
}

#magazine .team-member .team-info {
    padding-bottom: 10px;
    border-bottom: 1px solid #dbdbdb;
    margin-bottom: 10px;
}

#magazine .team-member:hover {
    border-color: #45aed6;
}

    #magazine .team-member:hover .social-icons > li > a {
        background: #45aed6;
    }

#magazine .social-icons {
    list-style: none;
    padding: 0;
    margin: 0;
}

    #magazine .social-icons > li {
        display: inline-block;
    }

        #magazine .social-icons > li > a {
            display: block;
            width: 32px;
            height: 32px;
            line-height: 32px;
            text-align: center;
            color: #fff;
            background: #222534;
            border-radius: 3px;
        }

#magazine .img-responsive {
    max-width: 98% !important;
    margin-top: 2px !important;
}

#autoridades .container-wrapper {
    /*background: rgba(69, 174, 214, 0.3);*/
    top: 0;
    right: 0;
    width: 100%;
    z-index: 1;
}

#autoridades .contact-form {
    /*background: rgba(255, 255, 255, 0.8);*/
    background: rgba(69, 174, 214, 0.3);
    padding: 10px;
    margin-top: 10px;
}

    #autoridades .contact-form h3 {
        margin-top: 0;
    }

    #autoridades .contact-form address {
        color: #272727;
    }

#preguntasFrecuentes .team-member {
    color: #000;
    height: 285px;
    min-height: 200px;
    visibility: visible;
    animation-duration: 400ms;
    animation-delay: 0ms;
    animation-name: fadeInUp;
    border: 2px solid #eeeeee;
    padding: 15px;
    transition: border-color 400ms;
    -webkit-transition: border-color 400ms;
    border-radius: 0.70rem;
}

    #preguntasFrecuentes .team-member:hover {
        border-color: #45aed6;
    }

#preguntasFrecuentes .panel-group .panel {
    margin-bottom: 20px;
    border-radius: 0.75rem;
}

#preguntasFrecuentes .panel-heading {
    border-radius: 0.75rem;
}

#preguntasFrecuentes .oculta {
    display: none !important;
}

.black {
    color: #000;
}

.panel {
    cursor: pointer;
}

.team-help {
    margin-top: 10px;
    font-size: 22px;
    font-weight: bold;
}

.team-info {
    margin-top: 10px;
    font-weight: bold;
    color: #45aed6;
}

.team-member:hover {
    border-color: #45aed6;
}

.i-icon {
    font-size: 4rem !important;
    color: #12326e;
}

.media.service-box {
    margin: 25px 0;
}

    .media.service-box .pull-left {
        margin-right: 20px;
    }

        .media.service-box .pull-left > i {
            font-size: 24px;
            height: 64px;
            line-height: 64px;
            text-align: center;
            width: 64px;
            border-radius: 100%;
            color: #45aed6;
            box-shadow: inset 0 0 0 1px #d7d7d7;
            -webkit-box-shadow: inset 0 0 0 1px #d7d7d7;
            transition: background-color 400ms, background-color 400ms;
            position: relative;
        }

            .media.service-box .pull-left > i:after {
                content: "";
                position: absolute;
                width: 20px;
                height: 20px;
                top: 50%;
                margin-top: -10px;
                right: -10px;
                border: 4px solid #fff;
                border-radius: 20px;
                background: #45aed6;
            }

    .media.service-box:hover .pull-left > i {
        background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
        background-image: -webkit-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
        background-image: -ms-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
        color: #fff;
        box-shadow: inset 0 0 0 5px rgba(255, 255, 255, 0.8);
        -webkit-box-shadow: inset 0 0 0 5px rgba(255, 255, 255, 0.8);
    }

.media-heading {
    font-weight: bold;
}

/******
PANEL PREGUNTAS FRECUENTES
******/

#preguntasFrecuentes .panel-title {
    font-weight: bold;
}

/******
FORMULARIOS
******/
#formularios li {
    padding: 7.5px 0 7.5px 0;
}

    #formularios li a h2 {
        color: #12326e;
        font-weight: bold;
    }

#formularios .ignore {
    display: none;
    text-align: center;
}

#formularios .oculta {
    display: none !important;
}

#formularios .row {
    margin-right: 10px;
    margin-left: -10px;
}

#formularios .panel-group .panel {
    margin-bottom: 20px;
    border-radius: 0.75rem;
}

#formularios .panel-heading {
    border-radius: 0.75rem;
}

#formularios .panel-title {
    font-weight: bold;
}

.input-group {
    display: flex;
    margin-top: 10px;
}

.buscar-input {
    font-size: 14px;
    display: flex;
    width: 100%;
    height: 36px;
    padding: 0 40px;
    color: #323840;
    border: 1px solid #337ab7;
    border-radius: 0.75rem;
    box-sizing: border-box;
    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'%3E%3C/path%3E%3C/svg%3E") no-repeat 13px center;
    &:focus

{
    outline: none;
    ~.buscar-label

{
    top: -8px;
    font-size: 13px;
}

}
}

.buscar-label {
    color: #337ab7;
    font-size: 14px;
    font-weight: normal;
    position: absolute;
    pointer-events: none;
    left: 45px;
    top: 11px;
    padding: 0 5px;
    background: #f9f9f9;
    transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
}

.buscar-input:not(:placeholder-shown) ~ .buscar-label {
    top: -8px;
    font-size: 11px;
}

/******
ERROR
******/
div .espacio {
    padding-top: 40px;
    height: 300px;
}

/******
WHATSAPP
******/
.container-boton {
    background-color: #27941e;
    border: 1px solid #fff;
    position: fixed;
    z-index: 999;
    border-radius: 30%;
    bottom: 20px;
    right: 20px;
    padding: 0px;
    transition: ease 0.3s;
    /*animation: efecto 1.2s infinite;*/
}

    .container-boton:hover {
        transform: scale(1.1);
        transition: 0.4s;
    }

.boton {
    width: 60px;
    transition: ease 1s;
}

/******
    PADRON ELECTORAL
******/

.lista-elecciones {
    padding-right: 20px;
    border-right: 1px solid #ccc;
}

.table-striped > tbody > tr:nth-child(2n+1) > td,
.table-striped > tbody > tr:nth-child(2n+1) > th {
    background-color: #e2e2e226;
}

@media only screen and (max-width: 768px) {
    #padronelectoral {
        padding-top: 70px;
    }
}


/******
    TRÁMITES
******/
.img-icon {
    height: 30px;
}

.nav > li.active > a > img {
    filter: brightness(2);
}

.btn-cpac {
    background-color: #2F7083;
    color: #FFF;
    border-color: #0A4859;
    text-align: center;
}

    .btn-cpac:hover,
    .btn-cpac:focus,
    .btn-cpac:active,
    .btn-cpac.active,
    .open .dropdown-toggle.btn-cpac {
        background-color: #1B5D70 !important;
        color: #FFF !important;
        border-color: #0A4859 !important;
    }

    .btn-cpac span {
        cursor: pointer;
        color: #fff;
        display: inline-block;
        position: relative;
        transition: 0.5s;
    }

        .btn-cpac span:after {
            content: '\00bb';
            position: absolute;
            opacity: 0;
            top: 0;
            right: -20px;
            transition: 0.5s;
        }

    .btn-cpac:hover span {
        padding-right: 25px;
    }

        .btn-cpac:hover span:after {
            opacity: 1;
            right: 0;
        }

.team-backg {
    height: 50px;
    padding: 10px 16px;
    background: #fff;
    border-radius: 0.7rem;
}

    .team-backg span {
        cursor: pointer;
        /*color: #fff;*/
        display: inline-block;
        position: relative;
        transition: 0.5s;
    }

        .team-backg span:after {
            content: '\00bb';
            position: absolute;
            opacity: 0;
            top: 0;
            right: -20px;
            transition: 0.5s;
        }

    .team-backg:hover span {
        padding-right: 25px;
    }

        .team-backg:hover span:after {
            opacity: 1;
            right: 0;
        }

/* Tooltip */

.cpac-tooltip + .tooltip > .tooltip-inner {
    padding: 15px;
    font-size: 1.2em;
    background-color: #eee;
    color: #000;
}

.cpac-tooltip + .tooltip.bottom > .tooltip-arrow {
    border-bottom: 5px solid #eee;
}


/******
    HOVER NEWS
******/

.hover {
    overflow: hidden;
    position: relative;
    padding-bottom: 68%;
}

.hover-overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 90;
    transition: all 0.4s;
}

.hover img {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    transition: all 0.3s;
}

.hover-content {
    position: relative;
    z-index: 99;
}

.hover-2-title {
    position: absolute;
    top: 50%;
    left: 0;
    text-align: center;
    width: 100%;
    z-index: 99;
    transition: all 0.3s;
}

.hover-2-description {
    width: 100%;
    position: absolute;
    bottom: 0;
    opacity: 0;
    left: 0;
    text-align: center;
    z-index: 99;
    transition: all 0.3s;
}

.hover-2:hover .hover-2-title {
    transform: translateY(-1.5rem);
}

.hover-2:hover .hover-2-description {
    bottom: 0.5rem;
    opacity: 1;
}

.hover-2:hover .hover-overlay {
    background: linear-gradient(to top, rgba(255, 255, 255, 5), rgba(255, 255, 255, 0.5));
}

.rounded {
    border-radius: 0.7rem;
}
