:root{
	--base: #086f97;
}
body{
	background-color: #ededed;
}

img{
	max-width: 100%;
}
[onclick]{
	cursor: pointer;
}
.login-content{
	position: absolute;
	top: 45px;
	right: 0;
	left: 0;
	max-width: 439px;
	margin: auto;
	width: 98%;
	box-shadow: 0px 0px 33px 4px rgb(48 32 32 / 22%);
	border-radius: 10px;
	padding: 45px 26px;
	background: white;
}

.login-content .login-logo{
	text-align: center;
}

.login-content .login-form .login-group{
	position: relative;
	margin: 32px 0;
}

.login-content .login-form .login-group input.login-input{
	width: 100%;
	border: 2px solid #d9d9d9;
	padding: 15px;
	border-radius: 5px;
	background: transparent;
	color: #3a3a3a;
	outline: none;
	z-index: 1;
	position: relative;
}

.login-content .login-form .login-group span{
	position: absolute;
	margin: auto;
	left: 17px;
	color: #6e6d6d;
	font-weight: 500;
	line-height: 1;
	transition: .4s;
	padding: 6px 0;
	top: 14px;
	z-index: 0;
}
.login-content .login-form .login-group input.login-input:focus ~ span{
	transform: scale(0.75);
	color: #02aff1;
	background: white;
	padding: 0 5px;
	left: -6px;
	top: -8px;
	z-index: 1;
}
.login-content .login-form .login-group input.login-input:valid ~ span{
	transform: scale(0.75);
	color: #02aff1;
	background: white;
	padding: 0 5px;
	left: -6px;
	top: -8px;
	z-index: 1;
}
.login-content .login-form .login-group input.login-input:valid{
   border-bottom: 2px solid #02aff1;
}
.login-content .login-form .login-check{
	display: flex;
	margin: 1px 24px;
	font-size: 13px;
	margin-bottom: 24px;
	margin-top: -14px;
}
.login-content .login-form .login-check input[type="checkbox"]{
	transform: scale(1.5);
}
.login-content .login-form .login-check label{
	margin-left: 8px;
	margin-top: 2px;
	font-weight: 500;
	color: #5e5e5e;
}
.login-content h6{
	text-align: center;
	margin: 26px;
	margin-bottom: 63px;
}

.login-content .login-form .login-button{
	text-align: right;
}
.login-content .login-form .login-button button.btn-login{
	background: #02aff1;
	color: white;
	padding: 9px 36px;
	font-variant: all-petite-caps;
}
.lds-ring {
	display: inline-block;
	position: absolute;
	width: 80px;
	height: 80px;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
.lds-ring div {
	box-sizing: border-box;
	display: block;
	position: absolute;
	width: 64px;
	height: 64px;
	margin: 8px;
	border: 8px solid #02aff1;
	border-radius: 50%;
	animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
	border-color: #02aff1 transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
	animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
	animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
	animation-delay: -0.15s;
}
@keyframes lds-ring {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

.loadpage{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	text-align: center;
	margin: auto;
	background: rgba(237,237,237,0.66);
}

.control-container{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
}
.control-container .control-nav{
	position: absolute;
	top: 0;
	bottom: 0;
	width: 20%;
	background: var(--base);
	transition: .3s;
	overflow-y: auto;
	overflow-x: hidden;
}
.control-container .control-content{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 20%;
	width: 80%;
	background: #ededed;
	transition: .3s;
}
.control-container .control-content .content{
	position: absolute;
	top: 63px;
	left: 0;
	right: 0;
	bottom: 0;
	overflow-y: auto;
}
.control-container.nav-close .control-content{
    left: 6%;
    width: 94%;
}
.control-container .control-nav .logo{
	text-align: center;
	background: url(../img/logonuevo.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	max-width: 238px;
	width: 100%;
	height: 102px;
	margin: 28px auto;
}
.control-container.nav-close .control-nav .logo{
	background: url(../img/logonuevo2.png);
	background-size: contain;
	background-repeat: no-repeat;
    width: 93%;
	height: 102px;
	text-align: left;
	margin: 28px 3px;
}
.control-container .control-content .control-header{
	width: 100%;
	background: #ffffff;
	box-shadow: 0 1px 1px rgba(0,0,0,0.15);
	clear: both;
	display: flex;
	justify-content: space-between;
}
.control-container .control-content .control-header button.nav-bar{
	border: none;
	background: none;
	font-size: 33px;
	outline: none;
	color: #466570;
	line-height: 1;
	padding: 10px;
	margin: 0 7px;
}

.control-container .control-content .control-header .control-user{
	position: relative;
}
.control-container .control-content .control-header .control-user button{
	padding: 6px 21px;
	margin: 0 11px;
}
.control-container .control-content .control-header .control-user button img{
	width: 48px;
	border-radius: 50%;
	margin-right: 14px;
}
.control-container .control-content .control-header .control-user button i{
	margin-left: 7px;
}
.control-container .control-content .control-header .control-user ul{
	list-style: none;
	padding: 0;
	position: absolute;
	max-width: 350px;
	width: 100%;
	right: 0;
	margin: 0;
	background: white;
	z-index: 99;
	box-shadow: 0 0px 4px rgb(0 0 0 / 15%);
	border-radius: 5px;
	padding: 7px 0;
	text-align: center;
	display: none;
	opacity: 0;
	transition: .3s;
}
.control-container .control-content .control-header .control-user > ul.user-open{
	display: block;
	opacity: 1;
}
.control-container .control-content .control-header .control-user > ul li{
	padding: 8px 0;
	transition: .1s;
	cursor: pointer;
}
.control-container .control-content .control-header .control-user > ul li:hover{
	color: white;
	background: #086f97;
}
.control-container .control-nav .nav-group{
	padding: 13px 0;
	border-bottom: 1px solid rgba(255,255,255,0.23);
}
.control-container .control-nav .nav-group:last-child{
	border-bottom: none;
}
.control-container .control-nav .nav-group > div{
	text-align: center;
	font-variant: all-petite-caps;
	color: white;
	font-weight: 500;
	font-size: 1.1em;
	margin: 10px 0;
}
.control-container .control-nav .nav-group ul{
	list-style: none;
	padding: 0;
	margin: 0;
}
.control-container .control-nav .nav-group ul li{
	padding: 11px 0;
	cursor: pointer;
	margin: 3px 0px;
	color: white;
	transition: .1s;
	display: flex;
	justify-content: center;
}
.control-container .control-nav .nav-group ul li:hover{
	background: rgba(255,255,255,0.33);
}
.control-container .control-nav .nav-group ul li i{
	margin-right: 15px;
	font-size: 1.2em;
	line-height: 1.2;
}
.control-container.nav-close .control-nav .nav-group ul li .nav-txt{
	display: none;
}
.control-container.nav-close .control-nav{
    width: 6%;
}
.control-container.nav-close .control-nav .nav-group ul li i{
	margin-right: 0px;
}
.control-container.nav-close .control-nav .nav-group > div{
	opacity: 0;
}
.panel{
	background: white;
	margin: 25px 31px;
	box-shadow: 0 1px 1px rgb(0 0 0 / 15%);
	padding: 20px;
}
.panel h2{
	margin-bottom: 33px;
	font-size: 1.4rem;
}
.btn-load{
	box-shadow: 0 1px 2px rgb(0 0 0 / 52%);
	border-radius: 27px;
	background: aliceblue;
	font-variant: all-petite-caps;
	font-weight: 500;
	padding: 7px 24px;
	color: #464646!important;
}
.btn-opcion{
	margin-right: 11px;
	border-radius: 50%;
	background: white;
	width: 37px;
	height: 37px;
	box-shadow: 0 1px 1px rgb(0 0 0 / 38%);
	border: 1px solid #dfdfdf;
	color: #747474;
}
.menu-opcion{
	width: 38px;
	position: relative;
}
.menu-opcion ul{
	list-style: none;
	position: absolute;
	min-width: 188px;
	width: 100%;
	right: 0;
	margin: 0;
	background: white;
	z-index: 99;
	box-shadow: 0 0px 4px rgb(0 0 0 / 15%);
	border-radius: 5px;
	padding: 7px 0;
	text-align: center;
	display: none;
	transition: .3s;
}
.menu-opcion button.isopen ~ ul{
	display: block;
}
.menu-opcion ul li{
	padding: 5px 0;
	transition: .1s;
	cursor: pointer;
	color: #525252;
}
.menu-opcion ul li:hover{
	color: white;
	background: #086f97;
}

.btn-txt1{
	font-variant: all-petite-caps;
	font-size: 18px;
}
.mat-control{
	margin-bottom: 19px;
}

::-webkit-scrollbar {
	width: 5px;
}
::-webkit-scrollbar-track {
	border-radius: 10px;
	background: white;
}
::-webkit-scrollbar-thumb {
	background: #043446;
	border-radius: 10px;
}
#table_id3 tbody tr, #table_id4 tbody tr{
	transition: .2s;
	cursor: pointer;
}
#table_id3 tbody tr:hover, #table_id4 tbody tr:hover{
	background: #028ab3;
	color: white;
}
.selection tbody tr{
	transition: .2s;
	cursor: pointer;
}
.selection tbody tr:hover{
	background: #028ab3;
	color: white;
}
.hojadevida .view{
	background: #54afef;
	padding: 22px;
	border-radius: 6px;
	color: white;
	font-variant: all-petite-caps;
	font-weight: 500;
	font-size: 20px;
	box-shadow: 1px 1px 1px rgba(0,0,0,0.21);
	text-shadow: 0px 1px 1px rgba(0,0,0,0.51);
}
.hojadevida  .equipo{
	background: aliceblue;
	padding: 33px;
	font-size: 29px;
	font-weight: 700;
	text-align: center;
	color: #363636;
	box-shadow: 1px 1px 2px rgb(0 0 0 / 7%);
	border-radius: 2px;
	border: 1px solid #dbe5ed;
	cursor: pointer;
	margin-bottom: 19px;
}
.back{
	margin: 29px;
}
.back button{
	font-variant: all-petite-caps;
}
.dataTables_wrapper {
	position: relative;
	clear: both;
	background-color: #F3F6F9 !important;
	padding: 32px;
	border-radius: 9px;
	overflow-x: auto;
}
table.dataTable.stripe>tbody>tr.odd>*, table.dataTable.display>tbody>tr.odd>* {
    box-shadow: none;
}
table.dataTable.display>tbody>tr.odd>.sorting_1, table.dataTable.order-column.stripe>tbody>tr.odd>.sorting_1 {
	box-shadow: inset 0 0 0 9999px rgba(0,0,0,0.02);
}

@media(max-width: 767px)
{
	.control-container .control-content{
		left: 0;
		width: 100%;
	}
	.control-container .control-nav{
		width: 69%;
		left: -69%;
		z-index: 999;
	}
	.control-container.nav-close .control-nav{
		width: 69%;
		left: 0;
		z-index: 999;
		box-shadow: 0px 0px 78px 53px rgba(0,0,0,0.19);
	}
	.control-container.nav-close .control-nav .logo{
		text-align: center;
		background: url(../img/logonuevo2.png);
		background-size: contain;
		background-repeat: no-repeat;
		max-width: 238px;
		width: 100%;
		height: 102px;
		margin: 28px auto;
	}
	.control-container.nav-close .control-nav .nav-group > div{
		opacity: 1;
	}
	.control-container.nav-close .control-nav .nav-group ul li i{
		margin-right: 15px;
	}
	.control-container.nav-close .control-nav .nav-group ul li .nav-txt{
		display: block;
	}
	.panel{
		margin: 25px 15px;
	}
	.control-container.nav-close .control-content{
	    left: 0;
	    width: 100%;
	}
	.hojadevida .view{
		margin: 11px 0;
	}
}
.bselect-active.elipsis{
	display: block;
	width: 100%;
	height: calc(1.5em + 0.75rem + 2px);
	padding: 0.375rem 0.75rem;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: #495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: 0.25rem;
	transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
	margin-bottom: -5px;
}
.bselect-default-text {
	padding-left: 0px;
}
.bselect-content {
	margin-top: 8px;
	width: 100%!important;
}
.list-mat{
	background: rgba(0,0,0,0.05);
	border-radius: 5px;
	padding: 11px;	
}
.list-mat .title{
	font-variant: all-petite-caps;
	text-align: center;
	font-weight: 500;
	margin-bottom: 12px;
}
.list-mat > ul{
	list-style: none;
	padding: 0;
}
.list-mat > ul li{
	display: flex;
	align-items: center;
	border-bottom: 1px solid rgba(0,0,0,0.16);
	font-size: 15px;
}
.list-mat > ul li:last-child{
	border-bottom: none;
}
.list-mat .dataTables_wrapper {
    background-color: transparent!important;
    padding: 0px;
}

.list-mat table.dataTable tbody th, .list-mat table.dataTable tbody td {
    padding: 0px 10px;
}

table.dataTable.serv>tbody>tr.child ul.dtr-details {
    white-space: normal;
}

.print table thead tr th{
	background: #a5d4d9;
    border: 1px solid gray;
    text-align: center;
}
.print table tbody tr td{
	border: 1px solid gray;
	font-size: 12px;
	text-align: center;
	padding: 10px;		
}

.print2 table thead tr th{
	background: #a5d4d9;
    border: 1px solid gray;
    text-align: center;
}
.print2 table tbody tr td{
	border: 1px solid gray;
	font-size: 12px;
	padding: 10px;		
}

.empleados .empl-content ul{
	list-style: none;
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	max-height: 282px;
	align-content: flex-start;
	margin-bottom: 0;
	background: #f3f6f9;
	border-radius: 12px;
	padding: 18px;
	overflow-y: auto;
}

.empleados .empl-content ul li{
	margin: 3px 17px;
	border-bottom: 1px solid rgb(0 0 0 / 6%);
	padding: 0px 9px;
	font-size: 14px;
}

.empleados .bselect-content{
	position: inherit;
	top: 0!important;
}
.informe-stats{
	display: flex;
	justify-content: end;
}
.informe-stats .item{
	background: aliceblue;
	max-width: 360px;
	width: 100%;
	padding: 15px 47px;
	border-radius: 6px;
	margin: 17px;
	font-size: 20px;
	display: flex;
	justify-content: space-between;
}
table.dataTable {
    font-size: 12px;
}

.slider-list ul{
	background: #eaeaea;
	list-style: none;
	padding: 20px;
	border-radius: 5px;
	box-shadow: inset 0px 0px 12px rgba(0,0,0,0.13);
}

.slider-list ul li{
	display: inline-block;
	width: 16%;
	vertical-align: middle;
	margin: 9px;
	cursor: pointer;
	position: relative;
}


.slider-list ul li button.slremove{
	position: absolute;
	background: red;
	border: none;
	border-radius: 50%;
	width: 22px;
	height: 22px;
	line-height: .1;
	font-size: 11px;
	font-weight: 700;
	color: white;
	top: -5px;
	left: -7px;
}

.slider-list ul li button.slGaleRem{
	position: absolute;
	background: red;
	border: none;
	border-radius: 50%;
	width: 22px;
	height: 22px;
	line-height: .1;
	font-size: 11px;
	font-weight: 700;
	color: white;
	top: -5px;
	left: -7px;
}
.upload{
	position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.59);
}

.upload .upload-content{
	position: absolute;
	top: 12px;
	left: 0;
	right: 0;
	width: 90%;
	max-width: 379px;
	background: white;
	margin: auto;
	padding: 29px 5px;
	border-radius: 5px;
	box-shadow: 1px 1px 26px rgb(0 0 0 / 37%);
}

.upload .upload-content button.upload-file{
    overflow: hidden;
    position: relative;
}

.upload .upload-content button.upload-file input[type="file"]{
	position: absolute;
	left: 0;
	right: 0;
	width: 100%;
	top: 0;
	bottom: 0;
	opacity: 0;
}
.boxperms{
	margin-bottom: 31px;
	padding-left: 28px;
	display: flex;
	align-items: center;
}
.boxperms .form-check-input{
	transform: scale(1.2);
}
.boxperms .form-check-label{
	font-weight: 400;
}

.bselect-list li.elipsis {
	white-space: break-spaces;
	border-bottom: 1px solid #dbd1d1;
}
.bselect-default-text {
	white-space: break-spaces;
}
.bselect-active.elipsis{
	height: auto;
}
.sl_show{
	position: absolute;
	right: 0;
	top: -5px;
	padding: 2px;
	font-size: 13px;
}
table.table-ss tr{
	border-bottom: 1px solid #e3e3e3;
}
table.table-ss tr td{
	padding: 4px 7px;
	font-size: 14px;
}
table.table-ss input.form-control {
    min-width: 73px;
}
.editp .con, .editcol .con {
	margin: 10px;
	background: #dfdfdf;
	border-radius: 10px;
	padding: 24px;
	position: relative;
}

.editp .con .cancel, .editcol .con .cancel {
	position: absolute;
	right: 15px;
	top: 11px;
}
.lt-list tbody tr{
	cursor: pointer;
}
.lt-list tbody tr:hover{
	background: #336b87b5;
	color: white;
}
.list-mat .bselect-content{
	top: 29px!important;
	position: absolute;
}

.tableD tbody tr:hover {
    background: transparent!important;
	color: #212529!important;
	cursor: default!important;
}

.tableD .arrows {
	display: flex;
	flex-direction: column;
	width: 21px;
	height: 33px;
	justify-content: center;
}

.tableD .arrows button {
	border: 0;
	outline: none;
	background: rgba(128, 128, 128, 0.25);
	border-radius: 6px;
	margin: 2px 0;
	width: 100%;
	font-size: 9px;
}