:root{
	/*--fuente: 13px Roboto,OpenSans,HelveticaNeue-Light,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif;*/
	--fuente: 13px Monserrat;
}
.no-select{
	user-select: none;
	-ms-user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
}
.icon::before {
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}
::selection {
    background-color: #afd4a7a3;
    color: #000;
}
a.nostyle:link {
    text-decoration: inherit;
    color: inherit;
    cursor: pointer;
}
a.nostyle:visited {
    text-decoration: inherit;
    color: inherit;
    cursor: pointer;
}
input::-webkit-datetime-edit-day-field:focus,
input::-webkit-datetime-edit-month-field:focus,
input::-webkit-datetime-edit-year-field:focus {
    background-color: #afd4a7a3;
    color: #000;
}
/* Recomendación usar una fuente más ligera */
@font-face {
    font-family: Monserrat;
    src: url(../assets/Montserrat-Regular.ttf);
}
html,body{
	margin: 0;
	height: 100%;
	font: var(--fuente);
	overflow: hidden;
}
body {
	overflow: hidden;
}

form{
	margin-block-end: 0;
}
*{
	box-sizing: border-box;
}
.top-item.selection{
	flex:1;
}
.top-item.client-logo{
	display:flex;
}
.scr{
	height:100%;
	position:relative;
	display:flex;
	flex-direction: column;
}
.sp-logo{
	display: flex;
    align-items: center;
    justify-content: center;
    flex:1;
}
.sp-logo img{
	height: auto;
    width: 100%;
    max-width: 900px;
    -webkit-filter: drop-shadow(3x 3px 5px #00000080);
    filter: drop-shadow(3px 3px 5px #00000080);
}
.login-box{
	display:flex;
	align-items: center;
	justify-content: center;
    padding-right: 10%;
    max-width: 100%;
}
.login-box .login-div .login-bg{
	position: absolute;
    opacity: 0.8;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
}
.login-box .login-div{
	width: 400px;
    /*height: 400px;*/
    position: relative;
    border-radius: 10px;
    display:flex;
}
.login-box .login-frm{
	position: relative;
    flex: 1;
    display:flex;
    flex-direction: column;
}
.login-box .login-frm>.frm{
	flex:1;
}
.login-top{
	height:32px;
	display: flex;
	align-items: flex-end;
    justify-content: flex-end;
}
.scr .login-mid{
	flex:1;
	display:flex;
}

.login-btm-band{
	position: absolute;
    bottom: 0;
    width:100%;
    height:72px;
}
.login-bottom{
    width: 100%;
    display:flex;
}
.login-bottom .logo1{
	width: 140px;
    height: 66px;
    background: url(../img/logo-tyb.png) no-repeat;
    background-size: 100%;
    cursor:pointer;
}
.login-bottom .empresa{
	flex:1;
	display: flex;
    align-items: center;
    justify-content: center;
}
.login-bottom .empresa > div{
	text-align: center;
	font-size: 16px;
}
.login-bottom .logo2{
    width: 74px;
    height: 72px;
    background: url(../img/logo-kondors.png) no-repeat;
    background-size: 100%;
    cursor:pointer;
}	
.bg-image{
	filter: blur(6px);
	-webkit-filter: blur(6px);
	height: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position:absolute;
	top: -24px;
    left: -24px;
    width: calc(100% + 48px);
    height: calc(100% + 24px);
}
.bg-glass{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height: 100%;
	background-color: #626261;
	opacity: 0.4;
}
input{
	font: var(--fuente);
}
input[type="date"]::-webkit-calendar-picker-indicator{
    color: rgba(0, 0, 0, 0);
    opacity: 1;
    display: block;
    background: url(../../mywildalberta.ca/images/GFX-MWA-Parks-Reservations.png) no-repeat;
    width:  9px;
    height: 9px;
    border-width: thin;
}
input[type="date"]:not(:valid)::-webkit-datetime-edit {
  color: grey;
}
button{
	font: var(--fuente);
}
select,option{
	font: var(--fuente);
}
.screen-top{
	padding: 3px 3px;
	display:flex;
	flex-direction: row;
}

.app-logo{
	display: inline-block;
	padding: 0 16px;
}
.app-logo .logo img{
	height: 66px;
    width: auto;
}
.welcome{
	display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding:0 12px 0 12px;
    flex:1;
}
.welcome .welcome-msg{
	font-size: 24px;
}
.client-logo{
	min-width: 100px;
	display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    padding: 4px 12px;
    font-size: 16px;
}
.form-client-logo{
	display:flex;
	justify-content: center;
}
#client-logo{
	max-width: 90%;
	max-height: 170px;
	margin: 12px;
	border-radius: 6px;
	filter: drop-shadow(1px 1px 1px #000000cc);
}
.frm input{
	font-size: 21px;
    width: 100%;
    padding: 6px 12px 6px 40px;
    border-radius: 6px;
    border: 1px solid #a9a9a9;
}
.frm input[type=text]{
	text-transform: uppercase;
}
.frm button{
	cursor: pointer;
	padding: 5px 20px;
    border-radius: 4px;
}
.frm.form-submit{
	text-align: center;
}
.frm>div{
	position: relative;
}
.frm>div>i.fas{
    position: absolute;
    font-size: 1.6em;
    margin-top: 10px;
    margin-left: 10px;
}
input:focus, select:focus, button:focus, textarea:focus{
	outline: 3px solid #4b9d2369;
	box-shadow: inset 0 2px 6px #00000029!important;
}
.frm.forgot-pw{
	text-align: center;
}
.frm.forgot-pw a{
	text-decoration: none;
	scale: 1;
	transition: scale 0.1s ease;
	cursor: pointer;
}
.frm.forgot-pw a:hover{
	scale: 2;	
}

.login-frm form>div{
	padding: 2px 20px 16px;
}
.login-frm form>div>div{
	padding: 2px;
}
.band1{
	position: relative;
	display: flex;
	align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 4px;
}
.band1>.filter-btn{
	display:inline-block;
	padding: 4px 12px;
	border-radius: 6px;
	padding: 8px 20px;
	font-size: 14px;
	font-weight: bold;
	cursor:default;
}
.option-box{
	display:flex;
	align-items: center;
}
.options>div, .login-top>.options>div{
	display:inline-block;
	font-size: 12px;
	padding: 1px;
}
.search-bar{
	padding:14px;
	position: relative;
}
.search-bar input[type="date"]{
	font-family: Monserrat;
	font-size: 13px;
	min-width: 160px;
    padding: 4px 8px;
}

.search-bar input:not([type=checkbox]){
   border-radius: 6px;
    padding: 5px 8px;
    width: 100%;
}
.search-bar .section{
	display:inline-block;
	padding: 4px 8px;
}
.search-bar input.search{
	width: 200px;
	text-transform: uppercase;
}
.search-bar input.date{
	width: 100px;
}
.search-bar .select{
	border-radius: 6px;
    padding: 5px 8px;
    border: none;
    width: 100%;
}
.search-bar button{
	border: 1px;
	padding: 5px 20px;
	border-radius: 4px;
}
#searchform{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
.band2{
	position: relative;
    display: flex;
    min-height: 28px;
}
.options .opt-text.user{
	font-size: 1.5em;
    padding-left: 6px;
}
.options .opt-text.user a{
	text-decoration: none;
	color: #fff;
}
div.maindiv{
	display:flex;
	flex-direction: column;
	height: 100%;
}
.maindiv > .databand{
	flex:1;
}
.tdg .th {
    border-right: 1px solid transparent!important;
}
.tdg .fc{
	border-right: 1px solid transparent!important;
}
.tdg .th .flt {
	background: #F8F8F8 0% 0% no-repeat padding-box;
    border: 1px solid #C3C3C3;
}
.tdg .header{
	border-bottom: none!important;
}
.tdg .td {
    border-right: 1px transparent!important;
}
.tdg .tr {
    border-bottom: 1px transparent!important;
}
.tdg .td.action i, .tdg .td.action img{
	font-size: 18px;
	opacity: 0.5;
}
.tdg .td.action.delete i{
	color: #ff2525;
}
.tdg .td.action:hover i, .tdg .td.action:hover img{
	opacity: 1;
}
.glass{
	background-color: transparent;
	/*z-index: 9999999999;*/
	position: absolute;
	top: 0;
	left:0;
	width:100%;
	height:100%;
}
.glass.transparent{
	background-color: transparent!important;
	backdrop-filter: none!important;
}
.glass img{
	position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.mod-box{
	position: absolute;
    top: 151px;
    left: 242px;
    /* border: 1px solid #000; */
    background-color: #4b9d23;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    color: #fff;
    min-width: 177px;
}

.mod-box .elem {
    display: flex;
    padding: 5px 9px;
}
#modality{
	min-width: 177px;
}
.logger{
	position: relative;
    width: 172px!important;
    height: 29px!important;
    top: 10px;
	font:var(--fuente);
}
.msf_multiselect_container{
	margin-top: -8px;
}
.msf_multiselect_container ul{
	margin-top: 9px!important;
}
.msf_multiselect_container textarea{
	overflow: hidden!important;
    text-overflow: ellipsis;
    border-radius: 6px;
    padding: 6px!important;
}

.msf_multiselect_container .msf_multiselect{
	border-radius: 6px;
	-webkit-box-shadow: 4px 3px 18px -5px #00000006;
    box-shadow: 4px 3px 18px -5px #0000006e;
}

.msf_multiselect li {
	padding: 8px;
}
.iframe-viewer{
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height: 100%;
	border:none;
}
.intro{
	position:absolute;
	left:50%;
	top:50%;
	transform: translate(-50%,-50%);
}
.intro>img{
	max-width: 100%;
}
.window{
	display:flex;
	flex-direction: column;
	position: absolute;
	top: 50%;
	left:50%;
	transform: translate(-50%, -50%);
	border-radius: 4px;
}
.window .btn{
	border-radius: 5px;
	padding: 6px 14px;
    margin: 4px;
}

button:active, button.down{
	opacity:0.6;
	color: #fff!important;
    background-color: #3E9040!important;
}

.window .win-title{
	display:flex;
	justify-content: end;
	min-height: 28px;
	/*position: absolute;*/
    padding: 6px;
    width: 100%;
}
.window .sub-title{
	flex: 1;
    font-size: 18px;
    font-weight: bold;
    padding-left: 6px;
}
.window .win-body {
	flex:1;
	display:flex;
	flex-direction: column;
}
.window .win-footer{
	padding: 10px;
	display:flex;
	justify-content: end;
	min-height: 58px;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
}
.window .lbl-msg{
	flex:1;
	display: flex;
    flex-direction: column;
	justify-content: center;
    align-items: center;
    text-align: center;
}
.window .win-close{
    display: block;
    padding: 4px 10px;
    font-size: 18px;
    justify-content: end;
    cursor: default;
}
.window .win-close:active{
	opacity: 0.6;
}

.window .pb{
	min-height: 3px;
}

.progress-line, .progress-line:before {
  height: 3px;
  width: 100%;
  margin: 0;
}
.progress-line {
  background-color: #58a700;
  display: -webkit-flex;
  display: flex;
}
.progress-line:before {
  background-color: #2f5400;
  content: '';
  -webkit-animation: running-progress 1s cubic-bezier(0.4, 0, 0.2, 1) infinite;
  animation: running-progress 1s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
@-webkit-keyframes running-progress {
  0% { margin-left: 0px; margin-right: 100%; }
  50% { margin-left: 25%; margin-right: 0%; }
  100% { margin-left: 100%; margin-right: 0; }
}
@keyframes running-progress {
  0% { margin-left: 0px; margin-right: 100%; }
  50% { margin-left: 25%; margin-right: 0%; }
  100% { margin-left: 100%; margin-right: 0; }
}
.window .btn{
	min-width: 110px;
}
.tabpane{
	display: flex;
    flex-direction: column;
    flex: 1;
}
.tabpane>.panels{
	flex:1;
	display:flex;
}
#win-edit .b-next{
	display:inline-block;
}
#win-edit .b-prev{
	position:absolute;
	left: 10px;
}
#win-edit.save .b-prev{
	display:inline-block;
}
#win-edit.save .b-update{
	display:inline-block;
}
.tabbar{
	display: flex;
	padding: 12px 24px 0;
}
.tab {
    padding: 12px 16px;
    position: relative;
    top: 1px;
    border: 1px solid transparent;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    cursor: default;
}

.tabpane>.panels>.panel{
	display:none;
	padding-top: 16px;
	flex-direction: column;
}
.tabpane>.panels>.panel.sel{
	flex:1;
	display:flex;
}
.tpanel{
	display:flex;
	flex-direction: column;
}
.tpanel.search-bar{
	padding: 0;
}
.tpanel.inline{
	display:flex;
	flex-direction: row;
}
.tlabel{
	padding: 4px;
}
.tedit{
	padding: 4px;
}
.tcombo{
	padding: 3px 4px;
}
.tcombo select.select{
    height: 28px;
}


/**------------------------*/
.user-avatar{
	padding: 6px 9px;
    background-color: #439f47;
    border-radius: 50%;
    margin-right: 7px;
    font-weight: bold;
    pointer-events: none;
    min-width: 35px;
    display: inline-block;
    text-align: center;
}

.window.menu-user{
	height: auto;
    width: 200px;
    position: absolute;
    right: 3px;
    transform: none;
    top: 70px;
    left: auto;
    outline: none;
    box-shadow: -3px 4px 8px #00000066;
}
.window.menu-user > .win-body > div{
	cursor: default;
	padding: 6px;
}
.window.menu-user > .win-body > .clickable:hover{
	background-color: #D2EBD3;
}
.window.menu-user > .win-body > .top {
	border-bottom: 1px solid #00000033;
}
.window.menu-user > .win-body > .top > .nombre{
	font-weight: bold;
	text-shadow: 0 0 #000;
}
.window.menu-user > .win-body > .top > .correo{
	opacity: 0.5;
}
.window.menu-user > .win-body > .bottom{
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	color: #dd0000;
}
.login-frm>.flags{
	text-align: center;
}
.login-frm>.flags{
	text-align: center;
}
.login-frm>.flags>a>img{
	opacity:0.5;
}
.login-frm>.flags>a>img:hover{
	opacity:1;
}
.login-frm>.flags>a>img:active{
	transform:scale(0.95);
}
input[type="date"] {
    position: relative;
}

input[type="date"]:after {
    font-family: "Font Awesome 6 Free";
    font-weight: 900; 
    content: "\f073";
    color: var(--fondo-verde);
    padding: 0 5px;
    position: absolute;
    top: 7px;
    right: 1px;
}
input[type="date"]::-webkit-calendar-picker-indicator {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    height: auto;
    color: transparent;
    background: transparent;
    outline: none;
}
input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
  height: 13px;
  width: 13px;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iY3VycmVudENvbG9yIiBjbGFzcz0iYmkgYmkteC1jaXJjbGUiIHZpZXdCb3g9IjAgMCAxNiAxNiI+CiAgPHBhdGggZD0iTTggMTVBNyA3IDAgMSAxIDggMWE3IDcgMCAwIDEgMCAxNHptMCAxQTggOCAwIDEgMCA4IDBhOCA4IDAgMCAwIDAgMTZ6Ii8+CiAgPHBhdGggZD0iTTQuNjQ2IDQuNjQ2YS41LjUgMCAwIDEgLjcwOCAwTDggNy4yOTNsMi42NDYtMi42NDdhLjUuNSAwIDAgMSAuNzA4LjcwOEw4LjcwNyA4bDIuNjQ3IDIuNjQ2YS41LjUgMCAwIDEtLjcwOC43MDhMOCA4LjcwN2wtMi42NDYgMi42NDdhLjUuNSAwIDAgMS0uNzA4LS43MDhMNy4yOTMgOCA0LjY0NiA1LjM1NGEuNS41IDAgMCAxIDAtLjcwOHoiLz4KPC9zdmc+);
  background-size: 13px 13px;
}
.window .content-window{
	/*margin-top: 38px;*/
    flex:1;
}

.flexed .win-body{
	display:flex;
	flex-direction: row;
}
.flexed .win-body > div{
	flex:1;
	margin: 2px;
	box-shadow: 3px 0px 6px #0000001F;
}
.flexed .win-body > .menu-left{
	flex: none;
	width: 250px;
	background-color: var(--fondo-footer);
	font-weight: bold;
}
#win-edit-user .lmenu{
	padding: 10px 20px;
	border-left: 8px solid transparent;
}
#win-edit-user .lmenu:hover{
	background-color: var(--resaltado);
}
.win-body input,
.win-body select,
.win-body textarea{
	border-radius: 6px;
	background: var(--fondo-footer) 0% 0% no-repeat padding-box;
}
.ucontainer{
	padding: 48px 48px;
}

.ucontainer > .tform > div{
	display: flex;
}

.ucontainer > .tform > div :where(input, select){
	width: 100%;
}

.ucontainer > .tform > .usrinfo{
	flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
}

.ucontainer > .tform > .usrinfo > .pic > .user-avatar{
    height: 42px;
    width: 42px;
    font-size: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ucontainer > .tform > .usrinfo > .nom > .tlabel{
	padding:0;
}

.ucontainer > .tform > .usrinfo > .nom .uemail{
	opacity: 0.4;
}
.ucontainer.on .pass {
	display: flex;
} 
.ucontainer.on2 .inst {
	display: flex;
	height: 100%;
}
.ucontainer.on3 .perm {
	display: flex;
	height: 100%;
}
.login-box.disappear {
    scale: 0;
    opacity: 0;
    max-width: 0;
    transition: 0.2s linear;
}
.tform.frm.padded {
    padding: 20px 60px;
    text-align: center;
}
.tlabel.login-email[data-name=lblemail] {
    text-align: left;
    position: absolute;
    padding: 8px 16px;
    opacity: 0.6;
    pointer-events: none;
}
.tform.frm.padded .email input{
	padding: 25px 12px 6px 12px;
	text-transform: lowercase !important;
}
.title-rec-pass{
	font-weight: bold;
    color: #000;
    font-size: 1.2em;
}
.rec-alert{
	height: 24px;
	color: #ee0000;
}

.fontawesome-i2svg-active body {
	display: initial;
}

body:where(:not(.hidden)) > .hourglass{
	display:none;
}

.hourglass{
	position: absolute;
	top: 50%;
	left:50%;
	transform: translate(-50%,-50%);
}
/*------ centros ------*/
#frm-useredit{
	display:flex;
	flex-direction: column;
	height: 100%;
}
.tpanel.insts, .tpanel.perms{
	border-radius: 6px;
	flex:1;
	position: relative;
	margin: 4px;
}
.tmulticheck{
	position: absolute;
	width: 100%;
	height: 100%;
	overflow-y: auto;
	border-radius: 4px;
}
.tmulticheck td{
	padding:2px;
}
.tmulticheck .mc-caption{
	font-size: 13px;
}
.tmulticheck input[type=checkbox]{
	height: 18px;
	outline: none;
}
.tmulticheck table{
	width: 100%;
}
.tmulticheck td:first-child{
	width: 26px;
}

@-webkit-keyframes rotating {
    from{
        -webkit-transform: rotate(0deg);
    }
    to{
        -webkit-transform: rotate(360deg);
    }
}

.rotating {
    -webkit-animation: rotating 1s linear infinite;
}

.search-glass{
	z-index: 5;
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
}
.search-bar button.open-search {
	padding: 8px 12px;
	display: none;
	min-width: 39px;
}

@media screen and (width <= 700px) {
	.search-glass{
		display:block;
	}
	#searchform{
		position: absolute;
        z-index: 10;
        background-color: inherit;
        box-shadow: 2px 20px 55px #000000;
        border-radius: 6px;
        width: 100%;
        top: 100%;
        left: 0;
        padding: 8px;
        display: none;
	}
	.search-bar{
		padding: 8px;
	}
	.search-bar button.open-search {
		display: block;
		transform: scaleY(1);
	}
	.search-bar .section.srch, .search-bar .section.srch input{
		width: 100%;
	}
	.login-box{ 
		padding: 16px;
	}
	.app-logo{
		padding: 0 6px;
		display: flex;
		align-items: center;
	}
	.app-logo .logo img{
		height: 40px!important;
	}
	.login-bottom .empresa > div{
		font-size: 0.6em;
	}
	.band1 {
		font-size: 0.8em;
		display: none;
	}
	.client-logo{
		font-size: 0.8em;
	}
	.screen-top{
		display: flex;
		justify-content: space-between;
	}
	.option-box .options{
		display: none!important;
	}
	.window.menu-user {
		top: 48px;
	}
}