@charset "UTF-8";

/* ---------------------------- [ Palettes
    Vibrant nature
        #124F9A (intense blue), #1B9D34 (emerald green), #F7DC6F (light yellow), #8B9467 (light brown), #45B3FA (blue sky)
    Lost island
        #1B9D34 (emerald green),  #124F9A (intense blue), #34A85A (turquoise), #F2C464 (light orange), #2E865F (dark green)
    Beach sunrise
        #124F9A (intense blue), #1B9D34 (emerald green), #F2C464 (light orange), #FFD700 (golden yellow), #4682B4 (blue gray)
    Forest jungle
        #1B9D34 (emerald green), #124F9A (intense blue), #3E8E41 (dark green), #C9E4CA (light green), #8B9467 (light brown)
*/
:root {
    --maincolor:#124F9A;
    --auxcolor:#1B9D34;
    --contrast: #F7DC6F;

    --actionbkg:#e3ecec;
    --lightmaincolor:#e7edf4;
    --ligthauxcolor:#e8f5ea;
    --nwhite:#FCFCFC;
    --nlightgray:#CCC;
    --nmediumgray:#999;
    --ngray:#666;
    --ndarkgray:#333;
    --nlightblack: #1C1C1C;
    }


/* ---------------------------- [ page ] ---------------------------- */

body { background-color:var(--nwhite); color:var(--nlightblack); }

a { color:var(--maincolor); }
a:hover { color:var(--auxcolor); }


/* ---------------------------- [ unsigned ] ---------------------------- */

body.unsigned {
	background:linear-gradient(-62deg, #d1ebd6, var(--nlightgray), #cfdbea, var(--nlightgray));
	background-size:320% 320%;
	animation:unsigned_gradient 24s ease infinite;
	height:100vh;
}

@keyframes unsigned_gradient {
	0% { background-position:0% 50%; }
	50% { background-position:100% 50%; }
	100% { background-position:0% 50%; }
    }

#msgnotification { background-color:var(--nwhite); color:var(--ndarkgray); border:1px var(--nmediumgray) solid; border-radius:0.875em;
    width:30rem; height:10rem; bottom:2.5rem; right:2.5rem; position:fixed; box-shadow:0.125rem 0.125rem 0.625rem var(--nlightgray); }

#login_window { width:35em; background-color:var(--nwhite); }

/* Forms and data */
.isid, .isiid { color:var(--nmediumgray); font-family:ui-monospace, 'Source Code Pro', Menlo, Consolas, monospace; overflow:auto; }
button, .button { background-color:var(--actionbkg); color:var(--maincolor); border:2px var(--ngray) solid; padding:0.625em 1.625em; text-align:center; }
button:hover, .button:hover { background-color: var(--nlightgray); color:var(--maincolor); border:2px var(--maincolor) solid; }
button:disabled, .button:disabled { background-color: var(--ngray); color:var(--nlightblack); }
button:focus, .button:focus { background-color:var(--nwhite); border:2px var(--auxcolor) solid; }
button span.label { margin-top: 0.625rem; }
input.islogin, input.ispwd, [type='password'], input.isiid, input.islocation, input.isdate, [type='date'],
input.isdtime, [type='datetime-local'], input.istime, [type='time'], input.isnumber, [type='number'],
input.istel, [type='tel'], input.isemail, [type='email'], input.isurl, [type='url']
    { background-repeat:no-repeat; background-position:left; background-size:contain; padding-left:2em; height:1.625rem; }
input.islogin { background-image:url('/img/icons/islogin.png'); }
input.ispwd, [type='password'] { background-image:url('/img/icons/ispwd.png'); }
input.isiid { background-image:url('/img/icons/isiid.png'); }
input.islocation { background-image:url('/img/icons/islocation.png'); }
input.isdate, [type='date'] { background-image:url('/img/icons/isdate.png'); }
input.isdtime, [type='datetime-local'] { background-image:url('/img/icons/isdtime.png'); }
input.istime, [type='time'] { background-image:url('/img/icons/istime.png'); }
input.isnumber, [type='number'] { background-image:url('/img/icons/isnumber.png'); }
input.istel, [type='tel'] { background-image:url('/img/icons/istel.png'); }
input.isemail, [type='email'] { background-image:url('/img/icons/isemail.png'); }
input.isurl, [type='url'] { background-image:url('/img/icons/isurl.png'); }
input [type='file'] { width:30em; max-width:100%; border:1px #eee solid; border-radius:0.375em; padding:0.375rem; }
input { border:1px solid var(--nmediumgray); }
input:focus { border-color:1px solid var(--auxcolor); }
::placeholder, ::-ms-input-placeholder, ::-webkit-input-placeholder, ::-moz-placeholder { color:var(--nmediumgray); }

fieldset, div.infoset { border:1px #eee solid; border-bottom-left-radius:0.375em; border-bottom-right-radius:0.375em; border-top-right-radius:0.375em; }
div.infoset { margin:0 0.375em; margin-inline:2px; border:1px #eee solid; padding:0.625rem 0.25rem; }
label { padding:0 0.25em; max-width:fit-content; margin-bottom:0; }
label, .label { text-transform: capitalize; }
label.active { background-color: var(--maincolor); color:var(--nwhite); padding-right:1.625rem; border-top-left-radius:0.375em; border-top-right-radius:0.375em; }
label.active + fieldset:hover, label.active + input[type='text']:hover, label.active + [type='password']:hover,
label.active + [type='date']:hover, label.active + [type='datetime-local']:hover, label.active + [type='time']:hover,
label.active + [type='number']:hover, label.active + [type='tel']:hover, label.active + [type='email']:hover,
label.active + [type='url']:hover, label.active + textarea:hover, label.active + select:hover
    { border:1px var(--maincolor) solid; }
label.inactive { background-color: var(--nlightgray); color:var(--nlightblack); padding-right:1.625rem; border-top-left-radius:0.375em; border-top-right-radius:0.375em; }
label.inactive + fieldset:hover, label.inactive + input[type='text']:hover, label.inactive + [type='password']:hover,
label.inactive + [type='date']:hover, label.inactive + [type='datetime-local']:hover, label.inactive + [type='time']:hover,
label.inactive + [type='number']:hover, label.inactive + [type='tel']:hover, label.inactive + [type='email']:hover,
label.inactive + [type='url']:hover, label.inactive + textarea:hover, label.inactive + select:hover, label.inactive + div.infoset:hover
    { border:1px var(--nlightgray) solid; }
fieldset + ul, div.infoset + ul { margin:0; }

/* ---------------------------- [ signed ] ---------------------------- */


/* head content */

#main_header { background-color:var(--nlightgray); color:var(--ndarkgray); vertical-align:middle; border-bottom:2px var(--ngray) solid; }
.header_col_pad { padding:1.625rem 1.2rem 0.125rem 1.2rem; }
#upper_logo { height:3.125rem; }
#main_header h2 { font-size:1.125rem; color:var(--auxcolor); margin-top:0.5rem; }
#main_header select { border:1px var(--maincolor) solid; color:var(--maincolor); background-color:var(--nmediumgray); padding:0.5rem; height:2.125rem; }
.navicon { border:1px var(--maincolor) solid; background-color:var(--nmediumgray);  border-radius:0.25rem; padding:0.625rem; height:2.5rem; }
.smallicon { height:1.625rem; vertical-align:middle; }
.icon, .sup_icon { height:2.625rem; vertical-align:middle; }
.tnimg { width:6.975em; }
.bigimg { width:18.3em; }

/* main navbar */
#navlist { background-color:var(--maincolor); color:var(--ngray); border-right:2px var(--nlightgray) solid; min-height:90vh; }
#navlist a { color:var(--nlightgray); }
#navlist button { width:100%; padding:0.625em 1em; background:transparent; color:var(--nwhite); border:1px var(--nlightgray) solid; text-align:left; }
#navlist button:hover { border-color: var(--nwhite); }
#navlist button:focus a { color: var(--nwhite); }
#navlist .sup_icon { height:1.825rem; border-radius:0.2rem; margin:0.125em 0.375em; padding:0.125rem; border:1px var(--nlightgray) solid; background-color: var(--maincolor); }
#navlist li { margin-bottom: 0.125rem;; }
#navlist li .col { padding: 0.25em; }
#navlist div.col:first-child { width: 1.625em;}
#navlist li span.label, #navlist li img.micro_icon { margin-top: 0.625rem; position:absolute; }

#navlist li.navitem_privileged button { border-width:3px; }
#navlist li.navitem_serv { padding-top: 0.375em; }
@media (min-width:768px) {
    #navlist li.navitem_serv button { padding-left:0.125em; }
    #navlist li.navitem_subs button { padding-left:0.375em; }
    #navlist li.navitem_action button { padding-left:1em; }
    }
#navlist li.navitem_action .sup_icon { background-color: var(--nlightgray); }
#navlist li.navitem_path button { border:2px var(--auxcolor) solid; }
#navlist li.navitem_active button  { border: 2px var(--auxcolor) solid; }
#navlist li.navitem_active img { border:2px var(--nwhite) solid; background-color:var(--auxcolor) !important; }


/* services data */
.module_logo { height:4rem; }
.small_canvas { width:32em; height:24em; }
.medium_canvas { width:48em; height:32em; }
table.table-list, table.table-description { margin-left:1.625em; width:92%; border:0.125em var(--maincolor) solid;}
table.table-list th, table.table-flist td { vertical-align: middle; }
table.table-list thead tr { background-color: var(--maincolor); }
table.table-list th { color:var(--nlightgray); text-align: left; border:1px white solid; }
table.table-list th.flistheader_selected { border-bottom:0.125em var(--auxcolor) solid; }
table.table-list thead form { display: inline; }
table.table-list thead .col { padding: 0.125em; }
table.table-list thead span.label { color:var(--nlightgray); margin-top:0.625em; margin-left:0.625em; position:absolute; }
table.table-list tbody { border-top: 0.125em var(--auxcolor) solid; border-bottom: 0.125em var(--auxcolor) solid; }
table.table-list tbody tr:nth-of-type(even) { background-color:var(--lightmaincolor); }
table.table-list tbody tr:hover { background-color:var(--ligthauxcolor); }
table.table-list tfoot { background-color: var(--nlightgray); }
table.table-list tfoot td { padding:0.625em; }
table.table-list tfoot ul { margin:0 0.325em; text-align:right; }
table.table-list tfoot ul li { margin:0 auto; }
table.table-description td>div.col { padding:1.625em; }
table.table-list button, table.table-description button { padding:0.125em; }
td.isid, td.isiid { font-size: 0.625rem; }
td.isbool { text-align: center; }


/* body content */
#main_footer { color:var(--nmediumgray); vertical-align:middle; border-top:2px var(--nlightgray) solid; }
body.signed #main_footer { background-color:var(--nlightblack); }
#main_footer p, #main_footer a { color:var(--ngray); }