/** COMPONENTS **/
html {
    min-height: 100%;
    position: relative;
}

body {
    background-color: #E4E6E9;
    min-height: 100%;
    padding-bottom: 0;
    font-family: 'Roboto', sans-serif;
    font-size: 13px;
    color: #393939;
    line-height: 1.5;
}




h6, .h6 {
  font-size: .80rem;
}

hr, .hr {
	margin: 10px;
}



/* ---- Navbar ---- */
.navbar {
    margin: 0;
    padding-left: 0;
    padding-right: 0;
    border-width: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    min-height: 45px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12);
    border-bottom: 8px solid var(--COLOR_TERTIARY, #6D80A7);
}

.navbar-nav {
    height: 100%;
    margin: 0 !important;
}

.navbar-nav > li {
    line-height: 45px;
    height: 45px;
    padding: 0;
    position: relative;
    float: left;
    font-size: 21px;
}

.navbar-nav > li:first-child {
    border-left-width: 0;
}

.navbar-nav > li > a {
    background-color: #005EB8 !important;
    color: #FFF;
    display: block;
    line-height: inherit;
    text-align: center;
    height: 100%;
    width: auto;
    min-width: 50px;
    padding: 0 8px;
    position: relative;
}

/*
.navbar-nav > li > a > .badge {
    position: relative;
    top: -4px;
    left: 2px;
    padding-right: 5px;
    padding-left: 5px;
}
*/

.navbar-nav > li > a:hover,
.navbar-nav > li > a:focus,
.navbar-nav > li.open > a {
    background-color: var(--COLOR_SECONDARY, #337ab7) !important;
    color: #FFF;
}

.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
    color: #005EB8 !important;
    background-color: var(--bs-nav-tabs-link-active-bg);
    border-color: var(--bs-nav-tabs-link-active-border-color);
	border-radius: .5rem .5rem 0 0 !important;
}



.dropdown-menu {
    border-radius: 0 !important;
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.dropdown-menu > li > a {
    font-size: 13px;
    font-weight: 400;
    margin-bottom: 1px;
    margin-top: 1px;
    display: block;
    clear: both;
    line-height: 1.42857143;
    color: #333333;
    white-space: nowrap;
}



.nav-tabs {
    border-color: var(--COLOR_TERTIARY, #96A8D2);
    margin-bottom: 0 !important;
    margin-left: 0;
    position: relative;
    top: 1px;
	/* box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%) */
}

.nav-tabs > li > a {
    padding: 7px 12px 8px;
}

.nav-tabs > li > a,
.nav-tabs > li > a:focus {
    border-radius: 0 !important;
    border-color: var(--COLOR_TERTIARY, #96A8D2);
    background-color: #F9F9F9;
    color: #999;
    margin-right: -1px;
    line-height: 18px;
    position: relative;
}

.nav-tabs > li > a:hover {
    background-color: #FFF;
    color: var(--COLOR_PRIMARY, #96A8D2);
    border-color: var(--COLOR_TERTIARY, #96A8D2);
	border-radius: .5rem .5rem 0 0 !important;
	cursor: pointer !important;
}

.nav-tabs > li > a:active,
.nav-tabs > li > a:focus {
    outline: none !important;
}

.nav-tabs > li:first-child > a {
    margin-left: 0;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    color: var(--COLOR_PRIMARY, #96A8D2);
    border-color: var(--COLOR_TERTIARY, #96A8D2);
    border-top: 2px solid var(--COLOR_PRIMARY, #96A8D2);
    border-bottom-color: transparent;
    background-color: #FFF;
    z-index: 1;
    line-height: 18px;
    margin-top: -1px;
    box-shadow: 0 -2px 3px 0 rgba(0, 0, 0, 0.15);
}



/* ---- Input Fields ---- */
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"] {
    color: #858585;
    background-color: #FFF;
    padding: 5px 5px 6px;
    font-size: 14px;
    font-family: inherit;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s;
	border-radius: 0.375rem;
}


textarea:hover,
input[type="text"]:hover,
input[type="password"]:hover,
input[type="datetime"]:hover,
input[type="datetime-local"]:hover,
input[type="date"]:hover,
input[type="month"]:hover,
input[type="time"]:hover,
input[type="week"]:hover,
input[type="number"]:hover,
input[type="email"]:hover,
input[type="url"]:hover,
input[type="search"]:hover,
input[type="tel"]:hover,
input[type="label"]:focus,
input[type="color"]:hover {
}

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="label"]:focus,
input[type="color"]:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    color: #696969;
    background-color: #FFF;
    outline: none;
	border-color: var(--COLOR_PRIMARY, #96A8D2);
	border-width: thin;
}

input::-webkit-input-placeholder,
.form-control::-webkit-input-placeholder {
    color: #C0C0C0;
}

input:-moz-placeholder,
.form-control:-moz-placeholder {
    color: #C0C0C0;
    opacity: 1;
}

input::-moz-placeholder,
.form-control::-moz-placeholder {
    color: #C0C0C0;
    opacity: 1;
}

input:-ms-input-placeholder,
.form-control:-ms-input-placeholder {
    color: #C0C0C0;
}

.form-select {
    color: #858585;
    background-color: #FFF;
    padding: 5px 5px 6px;
    font-size: 14px;
    font-family: inherit;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s;
	border-radius: 0.375rem;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
	background-color: #005EB8 !important;
	color: white;
}

.dataTables_wrapper .dataTables_processing {
    margin-top: 0px;
	padding-top: 7px;

}


/* ---- Buttons ---- */
.btn-mini {
	height: 23px !important;
	font-size: smaller !important;
	margin-right: 3px;
}


.btn-primary,
.btn-primary:focus,
.btn-primary.focus {
    background-color: #005EB8 !important;
    border-color: #005EB8;
}

.btn-primary:hover,
.btn-primary:focus:hover,
.btn-primary.focus:hover,
.btn-primary:active:hover,
.btn-primary:focus:active,
.open > .btn-primary.dropdown-toggle,
.open > .btn-primary.dropdown-toggle:hover,
.open > .btn-primary.dropdown-toggle:focus,
.open > .btn-primary.dropdown-toggle.focus,
.open > .btn-primary.dropdown-toggle:active {
    background-color: var(--COLOR_SECONDARY, #337ab7) !important;
    border-color: var(--COLOR_SECONDARY, #337ab7) !important;
}

.btn-primary.no-border:hover,
.btn-primary.no-border:active {
    border-color: var(--COLOR_SECONDARY, #337ab7);
}

.btn-primary.no-hover:hover,
.btn-primary.no-hover:active {
    background-color: var(--COLOR_SECONDARY, #337ab7) !important;
}

.open > .btn-primary.dropdown-toggle.active,
.btn-primary.active,
.btn-primary.focus.active,
.btn-primary.active:focus,
.btn-primary.active:hover {
    background-color: COLOR_TERIARY !important;
    border-color: COLOR_TERIARY;
}

.btn-primary.no-border.active {
    background-color: COLOR_TERIARY !important;
    border-color: COLOR_TERIARY;
}

.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
    background-color: var(--COLOR_SECONDARY, #337ab7) !important;
    border-color: var(--COLOR_SECONDARY, #337ab7) !important;
}



.btn-secondary,
.btn-secondary:focus,
.btn-secondary.focus {
    background-color: var(--COLOR_SECONDARY, #465A7F) !important;
    border-color: var(--COLOR_SECONDARY, #465A7F);
}

.btn-secondary:hover,
.btn-secondary:focus:hover,
.btn-secondary.focus:hover,
.btn-secondary:active:hover,
.btn-secondary:focus:active,
.open > .btn-secondary.dropdown-toggle,
.open > .btn-secondary.dropdown-toggle:hover,
.open > .btn-secondary.dropdown-toggle:focus,
.open > .btn-secondary.dropdown-toggle.focus,
.open > .btn-secondary.dropdown-toggle:active {
    background-color: var(--COLOR_PRIMARY, #465A7F) !important;
    border-color: var(--COLOR_SECONDARY, #465A7F) !important;
}

.btn-secondary.no-border:hover,
.btn-secondary.no-border:active {
    border-color: #1B6AAA;
}

.btn-secondary.no-hover:hover,
.btn-secondary.no-hover:active {
    background-color: #428BCA !important;
}

.open > .btn-secondary.dropdown-toggle.active,
.btn-secondary.active,
.btn-secondary.focus.active,
.btn-secondary.active:focus,
.btn-secondary.active:hover {
    background-color: #2f7bba !important;
    border-color: #27689d;
}

.btn-secondary.no-border.active {
    background-color: #2b72ae !important;
    border-color: #2b72ae;
}

.btn-secondary.disabled,
.btn-secondary[disabled],
fieldset[disabled] .btn-secondary,
.btn-secondary.disabled:hover,
.btn-secondary[disabled]:hover,
fieldset[disabled] .btn-secondary:hover,
.btn-secondary.disabled:focus,
.btn-secondary[disabled]:focus,
fieldset[disabled] .btn-secondary:focus,
.btn-secondary.disabled:active,
.btn-secondary[disabled]:active,
fieldset[disabled] .btn-secondary:active,
.btn-secondary.disabled.active,
.btn-secondary[disabled].active,
fieldset[disabled] .btn-secondary.active {
    background-color: #428BCA !important;
    border-color: #428BCA !important;
}

.btn-tertiary,
.btn-tertiary:focus,
.btn-tertiary.focus {
    background-color: var(--COLOR_TERIARY, #6D80A7) !important;
    border-color: var(--COLOR_TERIARY, #6D80A7);
}

.btn-tertiary:hover,
.btn-tertiary:focus:hover,
.btn-tertiary.focus:hover,
.btn-tertiary:active:hover,
.btn-tertiary:focus:active,
.open > .btn-tertiary.dropdown-toggle,
.open > .btn-tertiary.dropdown-toggle:hover,
.open > .btn-tertiary.dropdown-toggle:focus,
.open > .btn-tertiary.dropdown-toggle.focus,
.open > .btn-tertiary.dropdown-toggle:active {
    background-color: var(--COLOR_PRIMARY, #465A7F) !important;
    border-color: var(--COLOR_SECONDARY, #465A7F) !important;
}

.btn-tertiary.no-border:hover,
.btn-tertiary.no-border:active {
    border-color: #1B6AAA;
}

.btn-tertiary.no-hover:hover,
.btn-tertiary.no-hover:active {
    background-color: #428BCA !important;
}

.open > .btn-tertiary.dropdown-toggle.active,
.btn-tertiary.active,
.btn-tertiary.focus.active,
.btn-tertiary.active:focus,
.btn-tertiary.active:hover {
    background-color: #2f7bba !important;
    border-color: #27689d;
}

.btn-tertiary.no-border.active {
    background-color: #2b72ae !important;
    border-color: #2b72ae;
}

.btn-tertiary.disabled,
.btn-tertiary[disabled],
fieldset[disabled] .btn-tertiary,
.btn-tertiary.disabled:hover,
.btn-tertiary[disabled]:hover,
fieldset[disabled] .btn-tertiary:hover,
.btn-tertiary.disabled:focus,
.btn-tertiary[disabled]:focus,
fieldset[disabled] .btn-tertiary:focus,
.btn-tertiary.disabled:active,
.btn-tertiary[disabled]:active,
fieldset[disabled] .btn-tertiary:active,
.btn-tertiary.disabled.active,
.btn-tertiary[disabled].active,
fieldset[disabled] .btn-tertiary.active {
    background-color: #428BCA !important;
    border-color: #428BCA !important;
}

/* ---- Action Buttons ---- */
.action-button {
    -webkit-filter: drop-shadow(4px 4px 2px rgba(0,0,0,0.5));
    filter: drop-shadow(4px 4px 2px rgba(0,0,0,0.5));
    transition: all 0.3s cubic-bezier(.25,.8,.25,1);
    color: white !important;
}

.action-button:hover {
    -webkit-filter: drop-shadow(6px 6px 3px rgba(0,0,0,0.5));
    filter: drop-shadow(6px 6px 3px rgba(0,0,0,0.5));
    cursor: pointer;
}

.action-button:active {
    -webkit-filter: drop-shadow(2px 2px 1px rgba(0,0,0,0.5));
    filter: drop-shadow(2px 2px 1px rgba(0,0,0,0.5));
    transform: translateY(4px);
}


.block {
	display: block !important;
}

.btn-app.btn-ofisportal {
    display: block !important;
    width: 180px;
    height: 90px;
    font-size: 16px;
    font-weight: normal;
    text-align: center;
    border: none;
    border-radius: 12px;
    padding: 12px 0 8px;
    margin: 2px;
    line-height: 1.1;
    position: relative;
    background-color: ghostwhite !important;
    background-image: none !important;
    margin-bottom: 30px;
	box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.16), 0 5px 10px 0 rgba(0, 0, 0, 0.12);
}

.btn-app.btn-ofisportal:hover {
    background: gainsboro !important;
    font-weight: bolder;
}

.btn-app.btn-ofisportal.btn-icon {
    padding-top: 20px;
}
.btn-app.btn-ofisportal.btn-icon svg{
    margin:auto;
    color:#005EB8;
    font-size: 35px !important;
}
.btn-app.btn-ofisportal.btn-icon span{
    color:#005EB8;
}

.img-ofisportal {
    height: 70px;
    margin-bottom: 7px;
}

.lbl-ofisportal {
	display: block !important;
    font-size: 16px;
    color: #2a8bcb
}

.mfa {
    margin-bottom:2px;
}


.btn-search-action {
    width: 25px;
    max-height: 25px;
}


/* ---- Admin Links ---- */
#adminLinks a, #loginHelp a, .footer-content a {
    color: var(--COLOR_TERTIARY, #6D80A7) !important;
    text-align: center;
    text-decoration: none;
}

#adminLinks a:hover, #adminLinks a:active, #loginHelp a:hover, #loginHelp a:active, .footer-content a:hover, .footer-content a:active {
    color: #005EB8 !important;
    text-align: center;
    text-decoration: none;
}










/* ---- Footer ---- */
.footer {
    padding-top: 75px;
    height: 0;
    width: 0;
}

.footer .footer-content {
    text-align: center;
    position: absolute;
    z-index: auto;
    left: 0;
    right: 0;
    bottom: 0;
}
    
	
/** COLORS **/
.primary-color, .stepper li.active a .circle, .stepper li.completed a .circle {
    background-color: #005EB8 !important;
}

.primary-color-dark {
    background-color: #005EB8 !important;
    filter: brightness(60%);
}

.primary-color-foreground {
    color: #005EB8 !important;
}

.secondary-color {
    background-color: var(--COLOR_SECONDARY, #465A7F) !important;
}

.secondary-color-dark {
    background-color: var(--COLOR_SECONDARY, #465A7F) !important;
    filter: brightness(60%);
}

.secondary-color-foreground {
    color: var(--COLOR_SECONDARY, #465A7F) !important;
}

.tertiary-color {
    background-color: var(--COLOR_TERTIARY, #6D80A7) !important;
}

.tertiary-color-dark {
    background-color: var(--COLOR_TERTIARY, #6D80A7) !important;
    filter: brightness(60%);
}

.tertiary-color-foreground {
    color: var(--COLOR_TERTIARY, #6D80A7) !important;
}




/* ---- Other Colors ---- */
.dark {
    color: #333 !important;
}

.white {
    color: #FFF !important;
}

.red {
    color: #DD5A43 !important;
}

.red2 {
    color: #E08374 !important;
}

.light-red {
    color: #FF7777 !important;
}

.blue {
    color: #478FCA !important;
}

.light-blue {
    color: #93CBF9 !important;
}

.green {
    color: #69AA46 !important;
}

.light-green {
    color: #B0D877 !important;
}

.orange {
    color: #FF892A !important;
}

.orange2 {
    color: #FEB902 !important;
}

.light-orange {
    color: #FCAC6F !important;
}

.purple {
    color: #A069C3 !important;
}

.pink {
    color: #C6699F !important;
}

.pink2 {
    color: #D6487E !important;
}

.brown {
    color: brown !important;
}

.grey {
    color: #777 !important;
}

.light-grey {
    color: #BBB !important;
}

.red-text {
    color: #F44336 !important;
}

.blue-text {
    color: #2196F3 !important;
}

.light-blue-text {
    color: #03a9f4 !important;
}

.green-text {
    color: #4CAF50 !important;
}

.orange-text {
    color: #ff9800 !important;
}

.blue-grey-text {
    color: #607d8b !important;
}

.grey-text {
    color: #9e9e9e !important;
}

.white {
    background-color: #FFFFFF !important;
}

.white-text {
    color: #FFFFFF !important;
}

.light-green-text {
    color: #8bc34a !important;
}




/** UTILITIES **/
.hide {
    display: none !important;
}

.hidden {
    display: none;
}

.lighter {
    font-weight: lighter;
}

.bolder {
    font-weight: bolder;
}

.inline {
    display: inline-block !important;
}

.block {
    display: block !important;
}

.center,
.align-center {
    text-align: center !important;
}

.align-left {
    text-align: left !important;
}

.align-right {
    text-align: right !important;
}

.align-justify {
    text-align: justify;
}

.middle {
    vertical-align: middle;
}

.align-middle {
    vertical-align: middle !important;
}

.align-top {
    vertical-align: top !important;
}

.align-bottom {
    vertical-align: bottom !important;
}


/* ---- Size ---- */
.bigger-110 {
    font-size: 110% !important;
}

.bigger-120 {
    font-size: 120% !important;
}

.bigger-130 {
    font-size: 130% !important;
}

.bigger-140 {
    font-size: 140% !important;
}

.bigger-150 {
    font-size: 150% !important;
}

.bigger-160 {
    font-size: 160% !important;
}

.bigger-170 {
    font-size: 170% !important;
}

.bigger-180 {
    font-size: 180% !important;
}

.bigger-190 {
    font-size: 190% !important;
}

.bigger-200 {
    font-size: 200% !important;
}

.bigger-210 {
    font-size: 210% !important;
}

.bigger-220 {
    font-size: 220% !important;
}

.bigger-230 {
    font-size: 230% !important;
}

.bigger-240 {
    font-size: 240% !important;
}

.bigger-250 {
    font-size: 250% !important;
}

.bigger-260 {
    font-size: 260% !important;
}

.bigger-270 {
    font-size: 270% !important;
}

.bigger-280 {
    font-size: 280% !important;
}

.bigger-290 {
    font-size: 290% !important;
}

.bigger-300 {
    font-size: 300% !important;
}

.bigger-115 {
    font-size: 115% !important;
}

.bigger-125 {
    font-size: 125% !important;
}

.bigger-175 {
    font-size: 175% !important;
}

.bigger-225 {
    font-size: 225% !important;
}

.bigger-275 {
    font-size: 275% !important;
}

.smaller-90 {
    font-size: 90% !important;
}

.smaller-80 {
    font-size: 80% !important;
}

.smaller-70 {
    font-size: 70% !important;
}

.smaller-60 {
    font-size: 60% !important;
}

.smaller-50 {
    font-size: 50% !important;
}

.smaller-40 {
    font-size: 40% !important;
}

.smaller-30 {
    font-size: 30% !important;
}

.smaller-20 {
    font-size: 20% !important;
}

.smaller-75 {
    font-size: 75% !important;
}

.width-20 {
    width: 20% !important;
}

.width-25 {
    width: 25% !important;
}

.width-30 {
    width: 30% !important;
}

.width-35 {
    width: 35% !important;
}

.width-40 {
    width: 40% !important;
}

.width-45 {
    width: 45% !important;
}

.width-50 {
    width: 50% !important;
}

.width-55 {
    width: 55% !important;
}

.width-60 {
    width: 60% !important;
}

.width-65 {
    width: 65% !important;
}

.width-70 {
    width: 70% !important;
}

.width-75 {
    width: 75% !important;
}

.width-80 {
    width: 80% !important;
}

.width-85 {
    width: 85% !important;
}

.width-90 {
    width: 90% !important;
}

.width-95 {
    width: 95% !important;
}

.width-100 {
    width: 100% !important;
}

.width-75 {
    width: 75% !important;
}

.width-25 {
    width: 25% !important;
}

.width-auto {
    width: auto !important;
}

.height-auto {
    height: auto !important;
}

/*** MESSAGES***/
.env-message {
    background-color: #fdc513;
    border-bottom: 0px solid #fdc513;
}

