/* CSS Document */

/* General */

*{margin: 0;padding: 0;box-sizing: border-box;}
html, body{font-family: Verdana,Geneva,sans-serif; color:#34414c; padding-top: 0px; overflow: hidden;}
h1 { font-size: 32px; line-height:1.2em; }
h2 { font-size: 30px; line-height:1.2em; }
h3 { font-size: 20px; line-height:1.2em; }
p, a, table { font-size: 16px; line-height:1.2em; }
input, button { font-size: 16px!important; line-height:1.2em!important; }
form {margin-top: 25px;   background: #edeef0; border-radius: 10px; padding: 25px 35px;}
main { min-height: 450px; padding: 8px;}
.ico-title {width:20px; height:20px; }
.pequena {font-size: 12px !important;}
.responsivo { display:none; }
.container-fluid { width:100%; max-width:1260px; }
table {caption-side: top;}
.bg-azul {background-color: #00AEEF !important;}
.bg-azul2 {background-color: #00c0f3 !important;}
.bg-azul3 {background-color: #8ed8f8 !important;}
.bg-azul4 {background-color: #c7eafb !important;}
.bg-gris {background-color: #5B6770 !important;}
.bg-gris2 {background-color: #34414c !important;}
.bg-gris3 {background-color: #a5adb6 !important;}
.bg-gris4 {background-color: #eceef0 !important;}
.bg-rosa {background-color: #EF5399 !important;}
.bg-rosa2 {background-color: #f8bbd2 !important;}
.bg-rosa3 {background-color: #fbdce7 !important;}
.bg-verde {background-color: #00AE5E !important;}
.bg-verde2 {background-color: #69C289 !important;}
.bg-verde3 {background-color: #d3ead8 !important;}
.bg-amarillo {background-color: #FFD534 !important;}
.bg-amarillo2 {background-color: #ffeab1 !important;}
.bg-amarillo3 {background-color: #fff4d5 !important;}
.bg-naranja {background-color: #F68A33 !important;}
.bg-naranja2 {background-color: #fdcca4 !important;}
.bg-naranja3 {background-color: #fee4cd !important;}
.table-azul {--bs-table-color: #34414c;--bs-table-bg: #c7eafb;--bs-table-border-color: #34414c;}
.table-azulredon {--bs-table-color: #34414c;--bs-table-bg: #c7eafb;--bs-table-border-color: #c7eafb;border-radius: 10px;overflow: hidden;}
.table-azul2 {--bs-table-color: #ffffff;--bs-table-bg: #00AEEF;}

.table-confirmarredon {--bs-table-color: #34414c;--bs-table-bg: #eceef0;--bs-table-border-color: #eceef0;border-radius: 10px;overflow: hidden;}
.table-confirmar {--bs-table-color: #ffffff;--bs-table-bg: #34414c;}
.btn-confirmar { width: 100%; max-width: 200px; background-color:#a5adb6; padding: 10px; border: 0px; border-radius: 10px; color: #34414c; font-size: 15px; font-weight:bold; display: inline-block;text-decoration: none;}

.table-verde {--bs-table-color: #34414c;--bs-table-bg: #d3ead8;--bs-table-border-color: #34414c;}
.table-gris-claro {--bs-table-color: #34414c;--bs-table-bg: #eceef0;--bs-table-border-color: #34414c;}
.table-amarillo {--bs-table-color: #34414c;--bs-table-bg: #fff4d5;--bs-table-border-color: #34414c;}
.table-naranja {--bs-table-color: #34414c;--bs-table-bg: #fee4cd;--bs-table-border-color: #34414c;}
.table-gris {--bs-table-color: #ffffff;--bs-table-bg: #a5adb6;--bs-table-border-color: #34414c;}
.table-azul tbody tr td,.table-verde tbody tr td,.table-gris-claro tbody tr td,.table-amarillo tbody tr td,.table-naranja tbody tr td,.table-gris tbody tr td {border: none;}
.btn-azul {
    --bs-btn-color: #fff;
    --bs-btn-bg: #00AEEF;
    --bs-btn-border-color: #00AEEF;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #8ED8F8;
    --bs-btn-hover-border-color: #8ED8F8;
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #8ED8F8;
    --bs-btn-active-border-color: #8ED8F8;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #00AEEF;
    --bs-btn-disabled-border-color: #00AEEF;
}
.btn-naranja {
    --bs-btn-color: #fff;
    --bs-btn-bg: #F68A33;
    --bs-btn-border-color: #F68A33;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #FDCCA4;
    --bs-btn-hover-border-color: #FDCCA4;
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #FDCCA4;
    --bs-btn-active-border-color: #FDCCA4;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #F68A33;
    --bs-btn-disabled-border-color: #F68A33;
}
.btn-verde {
    --bs-btn-color: #fff;
    --bs-btn-bg: #00AE5E;
    --bs-btn-border-color: #00AE5E;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #69C289;
    --bs-btn-hover-border-color: #69C289;
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #69C289;
    --bs-btn-active-border-color: #69C289;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #00AE5E;
    --bs-btn-disabled-border-color: #00AE5E;
}
.logo-black-page {width: 100%; max-width:146px; height: auto; }

/*inicio*/
.sub-data { width:100%; }
.sub-data .btn-primary {border-radius: 0px!important; padding:8px 20px!important; background-color: #00AEEF; border: #00AEEF;}
.sub-data .btn-primary:hover { background-color:#8ED8F8;}
.wi { width: 59%; }
.wd { width: 39%; }
.col_c { display: inline-block; height:100%; vertical-align:bottom; }
.col-contador { background-color: #eceef0; border-radius: 20px; padding: 10px; text-align: center; }
.carousel-inner, .carousel-item img { border-radius: 20px; }
.carousel-item:after { content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(255,255,255,0.5); }
.carousel-caption { width:100%; max-width:320px; position:absolute; top:10%; left:3%; color:#34414c; z-index: 1; }
.carousel-indicators { justify-content: flex-start!important; margin-left: 3%!important; }
.carousel-indicators [data-bs-target] { width: 10px; height: 10px; background-color: #34414c; border-radius: 100%!important; }
.banner-img { width:100%; height:400px; background-size: cover; background-position: center center; background-repeat: no-repeat; }

.bg-amarillo h4, .bg-amarillo a {color: #34414c !important;}
/*perfil*/
.datos-perfil { width:100%; }
.icon-user {max-width: 80px}
.titulo-form {margin-bottom:20px}
.btnaction {font-size:12px; color:#333; font-weight: 600; text-decoration: none;}
.bi-pencil::before {    text-decoration: underline;}
.perfiles caption {background: #737f8b; color:#fff; border-radius:10px 10px 0 0; padding: 15px 15px}
.perfiles td, .perfiles th {background-color: #edeef0 !important; padding-left:15px !important; padding-right:15px !important; font-size:90% !important}
.perfiles table a{color:#212529 ; text-decoration:none; font-size:90%}
.perfiles td {border-bottom:0}
.perfiles th {border-bottom:1px solid #333; }

/*beneficios*/
.data-beneficios .secciones a[aria-expanded="true"]:after { content: "Ver menos \f2e6";}
.data-beneficios .secciones a[aria-expanded="false"]:after { content: "Ver más \f4fa";}
.data-beneficios .secciones a { padding: 10px 15px; }
.data-beneficios .secciones a:after {  content: "";  position: relative;  top: 1px;  display: inline-block;  font-family: Arial, "bootstrap-icons" !important;
  font-style: normal;  font-weight: 400;  line-height: 1;  -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;  float: right;  transition: transform .25s linear;  -webkit-transition: -webkit-transform .25s linear;}
.div-beneficios-agregados { margin-top: 25px; border-radius: 10px; padding: 25px 35px; }
/* Personaliza el fondo de las pestañas (tabs) a verde y establece el ancho al 25% */
#multiCollapseEnrol .nav-tabs { --bs-nav-tabs-border-radius: 0; border-radius: 0px !important; }
#multiCollapseEnrol .nav-item a { font-weight: 600;}
#multiCollapseEnrol .nav-tabs .nav-item { width: 25%; border-right: 1px solid #34414c; }
#multiCollapseEnrol .nav-tabs .nav-item:last-child { border-right: none !important;}
#multiCollapseEnrol .nav-tabs .nav-link { background-color: #d3ead8; color: #34414c; }
#multiCollapseEnrol .nav-tabs li.nav-item { background: #69C289;}
/* Personaliza el fondo del contenido a gris */
#multiCollapseEnrol .tab-content { background-color: #eceef0; }
#multiCollapseEnrol .nav-tabs .nav-item.show .nav-link, #multiCollapseEnrol .nav-tabs .nav-link.active { color: #ffffff; background-color: #69C289;}
#multiCollapseEnrol .nav-tabs { border: none;}
.ico-benf-int { filter: invert(1);width: 70px; }

/*beneficios seleccionados*/
.data-beneficios-seleccionados, .data-beneficios-vigentes { width:100%; }
.icon-beneficios-seleccionados {max-width: 69px}
.icon-beneficios {max-width: 100px}
.icon-beneficios-vigentes {max-width: 30px; height: 30px; filter: brightness(0) invert(1);}
.div-beneficios-seleccionados { margin-top: 25px; border-radius: 10px; padding: 25px 35px; }
.div-vigentes-ant { margin-top: 25px; border-radius: 10px 0px 0px 10px; padding: 25px 35px; background: #edeef0; }
.div-vigentes-act { margin-top: 25px; border-radius: 0px 10px 10px 0px; padding: 25px 35px; background: #d4ebd7; }
.bck-salud { background: #d4ebd7; }
.bck-financiero { background: #c4e7fa; }
.bck-estilo { background: #ffedb2; }
.btn-vigentes { width: 100%; max-width: 190px; padding: 5px 10px; border-radius: 10px; color: #fff; font-size: 15px; margin-bottom: 0px!important;}
.bck-vig-salud { background: #69c289; }
.bck-vig-financiero { background: #00adef; }
.bck-vig-estilo { background: #faa96a; }
.bck-no-activos { background: #b8b8b8; }
#agregar-beneficio { margin-top: 0px!important; padding:0px;!important; }

/* Beneficiarios*/
.data-beneficiarios { width:100%; }
.beneficiarios caption {background: #737f8b; color:#fff; border-radius:10px 10px 0 0; padding: 15px 15px}
.beneficiarios tbody td:nth-child(1), .beneficiarios tbody th:nth-child(1) {background-color:#edeef0 !important}
.beneficiarios tbody td:nth-child(2), .beneficiarios tbody th:nth-child(2) {background-color:#d3ead8 !important}
.beneficiarios tbody td:nth-child(3), .beneficiarios tbody th:nth-child(3) {background-color:#ffedb2 !important}
.beneficiarios tbody td:nth-child(4), .beneficiarios tbody th:nth-child(4) {background-color:#c4e7fa !important}
.beneficiarios tbody td:nth-child(5), .beneficiarios tbody th:nth-child(5) {background-color:#f9dfc4 !important}
.beneficiarios tbody td:nth-child(2), .beneficiarios tbody td:nth-child(3), tbody .beneficiarios td:nth-child(4),  tbody .beneficiarios td:nth-child(5) {width: 19%; text-align: center; padding: 20px}
.beneficiarios td, .beneficiarios th  {border-bottom:1px solid #333; padding:15px; font-weight: 400 !important; }
/*.beneficiarios tr:last-child td{border-bottom:0 !important}*/
.beneficiarios .icon-user {width:40px;height: 40px; padding-right: 10px; display: block;   float: left;}
.beneficiarios th:nth-child(2), .beneficiarios th:nth-child(3), .beneficiarios th:nth-child(4), .beneficiarios th:nth-child(5) {font-size:13px !important}
.beneficiarios tfoot td { background-color: #edeef0; font-weight:bold!important; }

/*Agregar beneficiarios*/
.addben .col-md-4, .addben .col-md-6{float:left}
.addben .form-group {padding:10px 5px}
.addben button, .addben button:hover {background:#00adf0; border-color: #00adf0;margin:0 auto }
.modal-header  { border-bottom: none; }
.modal-content { background-color:#eff0f4; }
.modal-content img {margin:0 auto; display: block; }
.modal-content p {text-align: center}
.modal-footer { display:none; }

/* Asegurados*/
.data-asegurados { width:100%; }
.icon-asegurados { width: 100%; max-width: 20px; height: auto; margin-right: 5px; }
.data-asegurados .carousel-item a { position:relative; z-index:99; }
#carouselAseguradosControlsNormal .carousel-item { width:96%; margin-right: -96%; transition: transform .6s ease-in-out; }
#carouselAseguradosControlsResponsivo .carousel-item { width:94%; margin-right: -94%; transition: transform .6s ease-in-out; }
#carouselAseguradosControlsNormal .carousel-item:after, #carouselAseguradosControlsResponsivo .carousel-item:after { background: none; }
#carouselAseguradosControlsNormal .carousel-control-next, #carouselAseguradosControlsNormal .carousel-control-prev, #carouselAseguradosControlsResponsivo .carousel-control-next, #carouselAseguradosControlsResponsivo .carousel-control-prev { width: auto; } 
#carouselAseguradosControlsNormal .carousel-control-next-icon, #carouselAseguradosControlsNormal .carousel-control-prev-icon, #carouselAseguradosControlsResponsivo .carousel-control-next-icon, #carouselAseguradosControlsResponsivo .carousel-control-prev-icon { filter: brightness(0.5) invert(1); }
#carouselAseguradosControlsNormal .col-4-custom-n { flex: 0 0 auto; width: 30%; position: absolute; top: 19px; right: 40px; z-index:999; }
#carouselAseguradosControlsNormal .bi-plus-lg, .col-4-custom-r .bi-plus-lg { display: inline-block; background-color: #fff; width: 100%; max-width: 185px; height: 100%; min-height: 145px; border-radius: 20px; padding: 10px; }
#carouselAseguradosControlsNormal .bi-plus-lg:before, .col-4-custom-r .bi-plus-lg:before { font-size: 5em; line-height: 2em; font-weight: bold!important; color: #eceef0; }
.asegurados caption {background: #737f8b; color:#fff; border-radius:10px 10px 0 0; padding: 15px 15px}
.asegurados td:nth-child(1), .asegurados th:nth-child(1) {background-color:#edeef0 !important}
.asegurados td:nth-child(2), .asegurados th:nth-child(2) {background-color:#d3ead8 !important}
.asegurados td:nth-child(3), .asegurados th:nth-child(3) {background-color:#ffedb2 !important}
.asegurados td:nth-child(4), .asegurados th:nth-child(4) {background-color:#c4e7fa !important}
.asegurados td:nth-child(5), .asegurados th:nth-child(5) {background-color:#f9dfc4 !important}
.asegurados td:nth-child(2), .asegurados td:nth-child(3), .asegurados td:nth-child(4),  .asegurados td:nth-child(5) {width: 19%; text-align: center; padding: 20px}
.asegurados td, .asegurados th { border-bottom:1px solid #333; padding:15px; font-weight: 400 !important; }
.asegurados tr:last-child td{border-bottom:0 !important}
.asegurados .icon-user {width:40px;height: 40px; padding-right: 10px; display: block; float: left;}
.asegurados th:nth-child(2), .asegurados th:nth-child(3), .asegurados th:nth-child(4), .asegurados th:nth-child(5) {font-size:13px !important}
.asegurados .bi-check::before { content: "\f26e"; font-size: 2em; line-height: 0em; vertical-align: middle; color: #6bb30f; }

/* Perfiles similares */
.data-perfiles-similares  { width:100%; }
.data-perfiles-similares .carousel-item { width:96%; margin-right: -96%; transition: transform .6s ease-in-out; }
.data-perfiles-similares .carousel-item:after { background: none; }
.data-perfiles-similares .carousel-item a { position:relative; z-index:99; }
.data-perfiles-similares .carousel-control-next, .data-perfiles-similares .carousel-control-prev { width: auto; }
.data-perfiles-similares .carousel-control-next-icon, .data-perfiles-similares .carousel-control-prev-icon { filter: brightness(0.5) invert(1); }
.data-perfiles-similares #carouselExampleControls2 { display: none; }
.btn-perfiles { width: 100%; max-width: 190px; padding: 5px 10px; border-radius: 10px; color: #fff; font-size: 15px; margin-bottom: 0px!important;}

/*Otras plataformas*/
.plataformas { width:100%; }
.gris {background:#edeef0 }
.otras {padding:30px 25px; margin:15px auto; border-radius:10px}
.otras .icon-otras {padding-right: 10px; display: block; float: left;}
.otras h2  {margin-top:50px}

/*contacto*/
.datos-de-contacto { width:100%; }
.ico-contacto { width:100%; max-width:100px; }
.bi-whatsapp { color: #fff; background-color: #128C7E; border-radius: 100%; font-size: 10px; line-height: 10px; padding:5px; }

/* ----- Cuenta Regresiva ----- */
#cuenta {	width:100%;	display: flex; justify-content: center;	align-items: center; }
.simply-section { width: 50px; height: 50px; margin: 0 10px; display: flex;	align-items: center; justify-content: center; position: relative; }
.simply-amount { display: block; font-size: 20px; font-weight: 700; }
.simply-word { font-weight: 300; font-size: 12px; }
.simply-days-section div:after, .simply-hours-section div:after, .simply-minutes-section div:after { content: ":"; position: absolute; top: 2px; right: -16px; font-size: 2em; line-height: 1.2em; }
/* ---------------------------- */

/* Responsivo */
/* medidas de 575px haca arriba*/
@media (min-width: 575px) {
    .h-sm-100 { height: 100%; }
}

/* medidas de 999px haca abajo */
@media (max-width: 999px) {
	h1, h2, h3 { font-size: 20px; }
	.col_c { display: block; width: 100%; height:100%; min-height:inherit; vertical-align:inherit; }
	.carousel-caption { max-width: 95%; top: inherit; bottom: 25px; padding: 10px; text-shadow: 0 0 #34414c; }
	form  .form-group label { justify-content: flex-start!important; }
	.beneficiarios .icon-user { width: 50px; height: 50px; }
	.asegurados .icon-user { width: 50px; height: 50px; }
}
@media (max-width: 968px) {
	#carouselAseguradosControlsNormal .col-4-custom-n { top: 23px; right:35px; }
}
@media (max-width: 999px) {
	#carouselAseguradosControlsNormal .col-4-custom-n { top: 12px; right:33px; }
}
@media (max-width: 849px) {
	.div-beneficios-agregados .btn-vigentes { max-width: 170px; padding:5px 8px; font-size:13px; }
	#carouselAseguradosControlsNormal .col-4-custom-n { top: 12px; right:33px; }
	.btn-perfiles { font-size: 14px; }
	.addben .col-md-4 { width: 50%; }
}
@media (max-width: 767px) {
	.div-vigentes-ant, .div-vigentes-act { border-radius: 10px; }
	p, a, table { font-size: 14px; word-wrap: break-word; }
	#carouselAseguradosControlsNormal .col-4-custom-n { top: 7px; right:25px; padding:1.3rem!important; }
	.data-perfiles-similares #carouselExampleControls2 { display: block !important; }
	.data-perfiles-similares #carouselExampleControls { display: none !important; }
	.data-perfiles-similares #carouselExampleControls2 .col.rounded-3.p-3.m-2.bg-gris4 { max-width: 327px; margin: auto !important; }
	.btn-perfiles { max-width: 100%!important; text-align: center; }
	.addben .col-md-4 { width: 100%; }
}
@media screen and (max-width: 699px) {
	#myTabsContent .tab-pane .container .row .col {width: 50% !important;flex: auto;}
	#myTabsContent .tab-pane .container .row .col-8, #myTabsContent .tab-pane .container .row .col-4 {width: 100%;margin-bottom: 30px;}
	#myTabsContent .tab-pane .container .row .col-4 {text-align: center !important;}
	#carouselAseguradosControlsNormal .col-4-custom-n { right:20px; }
}
@media screen and (max-width: 658px) {
	#carouselAseguradosControlsNormal .col-4-custom-n { right:20px; padding:1.2rem!important; }
}
@media screen and (max-width: 631px) {
	#carouselAseguradosControlsNormal .col-4-custom-n { right:16px; padding:1rem!important; }
}
@media screen and (max-width: 621px) {
	#carouselAseguradosControlsNormal, #carouselAseguradosControlsNormal .col-4-custom-n { display: none; }
	.col-4-custom-r { flex: 0 0 auto; width: 90%; display:block!important; }
	.col-4-custom-r .bi-plus-lg { min-height: 45px; }
	.col-4-custom-r .bi-plus-lg:before { font-size: 2em; line-height:2em; }
	#carouselAseguradosControlsResponsivo { display:block!important; }
}
@media (max-width: 575px) {
	p, a, table { font-size: 14px; word-wrap: break-word; }
	.normal { display:none; }
	.responsivo { display:block; }
	.beneficiarios th:nth-child(2), .beneficiarios th:nth-child(3), .beneficiarios th:nth-child(4), .beneficiarios th:nth-child(5) { text-align:center; }
	.beneficiarios .icon-user { width: 60px; height: 60px; padding-right: 0px; margin-bottom: 10px;}
	.asegurados th:nth-child(2), .asegurados th:nth-child(3), .asegurados th:nth-child(4), .asegurados th:nth-child(5) { text-align:center; }
	.asegurados .icon-user { width: 60px; height: 60px; padding-right: 0px; margin-bottom: 10px;}
	.data-beneficios-vigentes .div-vigentes-ant .btnaction { margin: 8px auto; }
	.data-beneficios-vigentes .div-vigentes-act .btnaction { margin: 8px auto; }
	.data-beneficios-vigentes .div-vigentes-ant p, .data-beneficios-vigentes .div-vigentes-act p { text-align:center; }
	.div-beneficios-seleccionados { padding: 25px 15px; }
	.icon-beneficios { margin-bottom: 20px; }
	.btn-vigentes { max-width: 500px; }
	.tab-pane .container { padding:10px!important; }
	.ico-benf-int { width: 60px; }
	.div-beneficios-agregados .btn-vigentes {    max-width: 100%;    padding: 5px 10px;    font-size: 15px;}
}
@media screen and (max-width: 469px) {
	.separador { display: block!important; }
}
@media screen and (max-width: 499px) {
	#myTabsContent .tab-pane .container .row .col-6 {width: 100%;}
	#myTabsContent .tab-pane .container .row .col-3 { width: 50%;}
	#carouselAseguradosControlsResponsivo .carousel-item, .data-perfiles-similares .carousel-item { width: 90%; margin-right: -90%; }
	.data-perfiles-similares .carousel-control-next { right: -10px; }
}