/*
Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
Click nbfs://nbhost/SystemFileSystem/Templates/JSP_Servlet/CascadeStyleSheet.css to edit this template
*/
/* 
    Created on : May 23, 2024, 7:56:58 PM
    Author     : ebelloma
*/

:root {
    --MAX_DISPLAY_SIZE: 1480px;
}

html,body {
    margin: 0px; padding: 0px;
    z-index: 1;
}
html {
    height: 100%;
    min-width: 250px; overflow: auto;
    /* background-color: #074b83; */
    font-size: 16px;
}
body {
    background-color: white;
    font-family: "Open Sans", sans-serif; /* Helvetica */
    word-spacing: normal; letter-spacing: normal;
    /* padding-bottom: 2.0em; ONLY WHEN FIXED FOOTER */
}

#HEADER {
    position: sticky; top: 0px; width: 100%;
    height: 96px;
    font-family: "Open Sans", sans-serif;
    z-index: 10;
    color: white; background-color: #074b83;
    box-shadow: 0px 2px 4px grey;
}
#HEADER_main {
    /*left: 50%; transform: translateX(-50%);*/
    z-index: 10;
    margin: 0px auto;
    max-width: var(--MAX_DISPLAY_SIZE);
    font-size: 1.1em;
}

#FOOTER {
    color: white; background-color: #074b83;
    min-height: 6.0em;
    font-family: "Open Sans", sans-serif;
    /*
    position: fixed; bottom: 0px; width: 100%; 
    */
}
#FOOTER_main {
    margin: 0px auto;
    max-width: var(--MAX_DISPLAY_SIZE);
    font-size: .9em; line-height: 2.0em;
}

#CONTENT {
    z-index: 1;
    margin: 0px auto; background-color: transparent;
    max-width: var(--MAX_DISPLAY_SIZE);
    min-height: 80vh;
    font-family: "Poppins";
    /*position: absolute; top: 0px; bottom: 0px; width: 100%; background-color: orange;*/
}
#CONTENT .w3-container {
    padding-left: 8px!important; padding-right: 8px!important;
}

@media all and (min-width: 1px) and (max-width: 424px) { /*Mobile*/
    body {
        font-size: .7em;
    }
    .no_mobile { display: none !important }
}
@media all and (min-width: 425px) and (max-width: 768px) { /*Tablet*/
    body {
        font-size: .8em;
    }
}
@media all and (min-width: 769px) and (max-width: 1023px) { /*Laptop*/
    body {
        font-size: .9em;
    }
}
@media all and (min-width: 1024px) { /*Desktop*/
    body {
        font-size: 1.0em;
    }
}