/*
Theme: APP Personas grandes
Author: Sentraland / ViviMS
Version: 1.0
*/
/*******************************************
		BASIC
*******************************************/
:root{
	--marengo: #00234b;
	--pizarra: #1F2333;
}
@font-face {
	font-family: 'Gotham';
	src: url(../fonts/gotham_book.eot);
	src: url(../fonts/gotham_book.eot?#iefix) format('embedded-opentype'),
		 url(../fonts/gotham_book.otf) format('otf'),
		 url(../fonts/gotham_book.svg#gotham_book) format('svg'),
		 url(../fonts/gotham_book.ttf) format('truetype'),
		 url(../fonts/gotham_book.woff) format('woff'),
		 url(../fonts/gotham_book.woff2) format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Gotham';
	src: url(../fonts/gotham_bold.eot);
	src: url(../fonts/gotham_bold.eot?#iefix) format('embedded-opentype'),
		 url(../fonts/gotham_bold.otf) format('otf'),
		 url(../fonts/gotham_bold.svg#gotham_bold) format('svg'),
		 url(../fonts/gotham_bold.ttf) format('truetype'),
		 url(../fonts/gotham_bold.woff) format('woff'),
		 url(../fonts/gotham_bold.woff2) format('woff2');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
html {
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	scroll-behavior: smooth;
}
body {
	margin: 0;
	overflow-x: hidden;
	font-family: 'Gotham', sans-serif;
	font-weight: 400;
	font-size: 17px;
	background-color: var(--bs-gray-100);
	color: var(--marengo);
}
a,
a:visited,
a:focus,
a:active,
a:hover {
	color: var(--marengo);
	text-decoration: none;
	outline: none;
}
strong,
b{
	font-weight: 700;
}
/*******************************************
		LOGIN
*******************************************/
body.login {
	min-height: 100vh;
	background-color: var(--bs-gray-100);
	visibility: visible!important;
    opacity: 1!important;
	/*background-size: cover;
	background-repeat: no-repeat;
	background-color:hsla(204,66%,75%,1);
	background-image:
		radial-gradient(at 40% 20%, hsla(191,99%,46%,1) 0px, transparent 40%),
		radial-gradient(at 80% 0%, hsla(212,100%,14%,0.62) 0px, transparent 40%),
		radial-gradient(at 0% 50%, hsla(192,40%,88%,1) 0px, transparent 40%),
		radial-gradient(at 80% 50%, hsla(191,99%,46%,1) 0px, transparent 40%),
		radial-gradient(at 0% 100%, hsla(212,100%,14%,0.62) 0px, transparent 40%);*/
}
.logo-login{
	width: 100%;
	max-width: 280px;
}



/*******************************************
		MAIN
*******************************************/
.main {
	min-height: calc(100vh - 195px);
}
.logo{
	width: 100%;
	max-width: 150px;
}
html.claro body .logo-claro{
	display: none;
}
.logo-claro{
	width: 100%;
	max-width: 150px;
}
/*******************************************
		BOTONES
*******************************************/
.btn.boton{
	border-radius: 0;
	padding: 0.5rem 2.5rem;
}
.btn-ancho{
	max-width: 100%;
	display: block;
}
a.btn-ancho{
	color: var(--marengo);
}
.btn-ancho i{
	font-size: 50px;
	line-height: 1;
	color: var(--bs-secondary);
}
.btn-outline-danger.btn-ancho i{
	color: var(--bs-danger);
}
.btn-outline-danger.btn-ancho:hover i,
.btn-outline-danger.btn-ancho:active i{
	color: var(--bs-white);
}
.btn-ancho:hover i,
.btn-ancho:active i{
	color: var(--bs-white);
}
.btn-descarga{
	max-width: 100%;
	display: block;
}
.btn-descarga i{
	font-size: 2rem;
	line-height: 1;
	color: var(--bs-warning);
	vertical-align: middle;
	height: 32px;
	display: inline-block;
}
.btn-descarga:hover i,
.btn-descarga:active i{
	color: var(--marengo);
}
.btn-danger,
.btn-success {
	--bs-btn-color: var(--bs-white);
	--bs-btn-hover-color: var(--bs-white);
	--bs-btn-active-color: var(--bs-white);
	--bs-btn-disabled-color: var(--bs-white);
}
.btn.btn-outline-primary i::before{
	line-height: 1.5;
}
.btn.btn-outline-primary i{
	color: var(--bs-warning);
}
.btn.btn-outline-primary:hover i,
.btn.btn-outline-primary:active i{
	color: var(--bs-white);
}
.btn-panico {
	width: 200px;
	height: 200px;
	padding: 30px;
}
.btn-panico i{
	font-size: 130px;
	line-height: 130px;
	height: 130px;
	display: block;
}
.proximamente{
	position: relative;
	overflow: hidden;
}
.proximamente::before {
	background: var(--bs-danger);
	position: absolute;
	content: 'Próximamente';
	color: var(--bs-white);
	transform: rotate(-45deg);
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%) rotate(-30deg);
	width: calc(100% + 30px);
	z-index: 1;
}
.btn-outline-warning.proximamente{
	color: rgba(var(--bs-warning-rgb),0.5);
	pointer-events: none;
	border-color: rgba(var(--bs-warning-rgb),0.5);
}
.btn-outline-warning.proximamente i{
	opacity: 0.5;
}
/*******************************************
		FORMULARIOS
*******************************************/
.form-control{
	padding: 0.695rem 0.75rem;
	border-color: var(--bs-primary);
	border-radius: 0.75rem;
}
.form-control:focus{
	border-color: var(--bs-primary);
	box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.25);
}
select {
	background-image: url(../images/arrow-down.svg);
	background-repeat: no-repeat;
	background-position: calc(100% - 15px) center;
	background-size: 11px 6px;
}
.input-group-text{
	background-color: var(--bs-white);
	border-color: var(--bs-primary);
	color: var(--bs-primary);
	border-left: 0px;
	font-size: 30px;
	line-height: 1;
	border-radius: 0.75rem;
}
.form-check.form-switch{
	padding: 0;
}
.form-check.form-switch .form-check-input{
	float: none;
	margin: 0 auto;
	width: 100px;
	height: 38px;
	background-color: var(--bs-danger);
	border-color: var(--bs-danger);
	--bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
}
.form-check.form-switch .form-check-input:focus{
	box-shadow: 0 0 0 transparent;
	--bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
}
.form-check.form-switch .form-check-input:checked{
	background-color: var(--bs-success);
	border-color: var(--bs-success);
	--bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
}
.perfil-inicial .form-check-inline {
	display: block;
	margin: 0;
	padding: 0;
}
.perfil-inicial .form-check-inline label{
	display: block;
	cursor: pointer;
	-webkit-user-select: none;
	   -moz-user-select: none;
		-ms-user-select: none;
			user-select: none;
}
.perfil-inicial .form-check-inline input{
	position: absolute;
	opacity: 0;
	cursor: pointer;
}
.perfil-inicial .form-check-inline input ~ .checkmark{
	display: block;
	border: 1px solid var(--bs-warning);
	text-align: center;
	border-radius: 1rem;
	padding: 1rem;
	margin: 0.5rem auto;
	width: 160px;
}
.perfil-inicial .form-check-inline input:checked ~ .checkmark{
	border: 1px solid var(--bs-info);
	background-color: var(--bs-info);
}
/*******************************************
		MODAL
*******************************************/
.modal-header{
	border-bottom: 0 transparent;
}
.btn-close{
	--bs-btn-close-color:var(--bs-white);
	--bs-btn-close-bg: none;
	width: 30px;
	height: 30px;
}
.btn-close:after{
	content: "\f110";
	font-family: flaticon_adulto_mayor !important;
	font-style: normal;
	font-weight: normal !important;
	font-variant: normal;
	text-transform: none;
	font-size: 30px;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.modal-footer{
	justify-content: center;
}
/*******************************************
		VARIOS
*******************************************/
.tit-sec {
	display: flex;
	align-items: center;
	position: relative;
	padding-left: 45px;
}
.tit-sec i{
	font-size: 30px;
	color: var(--bs-secondary);
	line-height: 1;
	position: absolute;
	left: 0;
	top: 7px;
}
.tit-sec a i{
	color: var(--bs-primary);
}
.shadow-top{
	box-shadow: 0 -.125rem .25rem rgba(var(--bs-black-rgb),.075);
}
.shadow-bottom{
	box-shadow: 0 .125rem .25rem rgba(var(--bs-black-rgb),.075);
}
.boxes,
.boxes2{
	position: relative;
	border: 1px solid var(--bs-secondary);
	background-color: var(--bs-white);
	padding: 0.53rem 0.75rem;
	border-radius: 0.75rem;
	box-shadow: 0 .125rem .25rem rgba(var(--bs-black-rgb),.075);
}
.boxes.nro-sos{
	border: 1px solid var(--bs-danger);
}
.boxes2{
	padding: 0;
	overflow: hidden;
}
.boxes2 > div > div {
	padding: 0.53rem 0.75rem;
}
.boxes.alto{
	min-height: 100px;
}
a.boxes{
	display: block;
	position: relative;
	border: 1px solid var(--bs-warning);
	background-color: var(--bs-white);
	padding: 0.53rem 0.75rem;
	border-radius: 0.75rem;
	box-shadow: 0 .125rem .25rem rgba(var(--bs-black-rgb),.075);
}
a.boxes:hover{
	background: var(--bs-warning);
}
.txt-bene{
	font-size: 38px;
	font-weight: 700;
	color: var(--bs-warning);
}
a.boxes:hover .txt-bene{
	color: var(--bs-white);
}
.cont-box{
	font-size: 30px;
	color: var(--bs-primary);
	line-height: 1;
	display: flex;
}
.cont-box a{
	color: var(--bs-primary);
}
.bg-margengo{
	background-color: var(--marengo);
}
img {
	max-width: 100%;
	height: auto;
}
.section.hidden {
    display: none;
}
.footer-login{
	margin-top: 30px;
}
/*******************************************
		MODO OSCURO
*******************************************/
html.oscuro body,
html.oscuro body .btn.btn-ancho,
html.oscuro body .btn.btn-descarga,
html.oscuro body .form-control{
	color: var(--bs-gray-100);
}
html.oscuro body,
html.oscuro body .form-control,
html.oscuro body .input-group-text,
html.oscuro body .boxes,
html.oscuro body .boxes2,
html.oscuro body .modal-content{
	background-color: var(--pizarra);
}
html.oscuro body .shadow-bottom {
	box-shadow: 0 .125rem .25rem rgba(var(--bs-white-rgb),.075);
}
html.oscuro body .shadow-top {
	box-shadow: 0 -.125rem .25rem rgba(var(--bs-white-rgb),.075);
}
html.oscuro body .logo{
	display: none;
}
/* html.oscuro body a,
a:visited,
a:focus,
a:active,
a:hover {
	color: white;
	text-decoration: none;
	outline: none;
} */
/*******************************************
		TAMAÑO TIPOGRAFÍA
*******************************************/
html.menos {
	font-size: 16px;
}
html.normal {
	font-size: 18px;
}
html.mas {
	font-size: 22px;
}
/*******************************************
		TAMAÑO TIPOGRAFÍA
*******************************************/
body {
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}
body.loaded {
    visibility: visible;
    opacity: 1;
}

/*******************************************
		MEDIA QUERY
*******************************************/
@media (min-width: 576px){
}
@media (min-width: 768px){
}
@media (min-width: 992px){
	.footer-login{
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 1030;
	}
}
@media (min-width: 1200px){
}