* {
    margin:0px;
    padding:0px;
    box-sizing:border-box;
}

/* VARIABLES ====================================== */
:root {
    /* COLORS ===================================== */
    --A_COLOR_BEFORE:var(--P_COLOR);
    --A_COLOR_AFTER:var(--P_COLOR);
    --ASIDE_BACKGROUND_COLOR:#4CB963FF;
    --B_COLOR:#A0EADEFF;
    --BODY_BACKGROUND_COLOR:#A0EADEFF;
    --HEADER_FOOTER_BACKGROUND_COLOR:#157F1FFF;
    --HEADER_FOOTER_COLOR:LIGHTBLUE;
    --HR_BORDER_COLOR:#A0EADEFF;
    --H1_COLOR:#157F1FFF;
    --H2_COLOR:#157F1FFF;
    --H3_COLOR:#157F1FFF;
    --P_COLOR:#1D263BFF;
    --BLOCKQUOTE_COLOR:INDIGO;
    --SECTION_ARTICLE_BACKGROUND_COLOR:#4CB963FF;
    --SECTION_BACKGROUND_COLOR:#5C6784FF;
    --SECTION_DIV_P_COLOR:GREENYELLOW;
    --UL_COLOR:var(--P_COLOR);
    /* FONT FAMILY ================================ */
    --B_FONT_FAMILY:"Ubuntu Mono";
    --HEADER_FOOTER_FONT_FAMILY:"Cabin Sketch";
    --H1_FONT_FAMILY:"Architects Daughter";
    --H2_FONT_FAMILY:var(--H1_FONT_FAMILY);
    --H3_FONT_FAMILY:var(--H1_FONT_FAMILY);
    --NAV_DIV_BUTTON_FONT_FAMILY:'CABIN SKETCH';
    --P_FONT_FAMILY:"Shadows Into Light";
    --BLOCKQUOTE_FONT_FAMILY:var(--P_FONT_FAMILY);
    --SECTION_DIV_P_FONT_FAMILY:var(--P_FONT_FAMILY);
}
/*
--ao-english:#157F1FFF;
--emerald:#4CB963FF;
--middle-blue-green:#A0EADEFF;
--dark-blue-gray:#5C6784FF;
--space-cadet:#1D263BFF;
*/

@media screen and (min-width:1000px) and (orientation:landscape) /*DESKTOP*/ {
    :root {
        /* SIZING ================================= */
        --ASIDE_WIDTH:12%;
        --ASIDE_ARTICLE_WIDTH:100%;
        --HEADER_FOOTER_HEIGHT:5%;
        --HEADING_LEFT_WIDTH:50%;
        --HEADING_LEFT_IMG_HEIGHT:4.5VH;
        --HEADING_RIGHT_WIDTH:50%;
        --NAV_DIV_BUTTON_HEIGHT:5VH;
        --BLOCKQUOTE_WIDTH:75%;
        --SECTION_DIV_HEIGHT:40vh;
        --SECTION_DIV_IMG_HEIGHT:80%;
        --SECTION_DIV_WIDTH:50%;
        --SECTION_DIV_IMG_WIDTH:85%;
        --SECTION_DIV_P_WIDTH:85%;
        --SECTION_WIDTH:88%;
        --SECTION_ARTICLE_WIDTH:98%;
        /* FONT SIZING ============================ */
        --B_FONT_SIZE:1.35em;
        --HEADER_FOOTER_FONT_SIZE:3em;
        --H1_FONT_SIZE:1.75em;
        --H2_FONT_SIZE:1.75em;
        --H3_FONT_SIZE:1.75em;
        --NAV_A_FONT_SIZE:1.25EM;
        --NAV_DIV_BUTTON_FONT_SIZE:1.25EM;
        --P_FONT_SIZE:1.25em;
        --BLOCKQUOTE_FONT_SIZE:1em;
        --SECTION_DIV_P_FONT_SIZE:1em;
        /* ADVERTISIMENT ========================== */
    }
}
@media screen and (max-width:999px) and (orientation:landscape) /*TABLET*/ {
    :root {
        /* SIZING ================================= */
        --ASIDE_WIDTH:20%;
        --ASIDE_ARTICLE_WIDTH:100%;
        --HEADER_FOOTER_HEIGHT:5%;
        --HEADING_LEFT_WIDTH:50%;
        --HEADING_LEFT_IMG_HEIGHT:4.5%;
        --HEADING_RIGHT_WIDTH:50%;
        --NAV_DIV_BUTTON_HEIGHT:100%;
        --BLOCKQUOTE_WIDTH:75%;
        --SECTION_ARTICLE_WIDTH:98%;
        --SECTION_DIV_HEIGHT:40vh;
        --SECTION_DIV_IMG_HEIGHT:80%;
        --SECTION_DIV_WIDTH:50%;
        --SECTION_DIV_IMG_WIDTH:85%;
        --SECTION_DIV_P_WIDTH:85%;
        --SECTION_WIDTH:80%;
        /* FONT SIZING ============================ */
        --B_FONT_SIZE:1.75em;
        --HEADER_FOOTER_FONT_SIZE:2.5em;
        --H1_FONT_SIZE:3.5em;
        --H2_FONT_SIZE:3em;
        --H3_FONT_SIZE:2.5em;
        --NAV_A_FONT_SIZE:1.25EM;
        --NAV_DIV_BUTTON_FONT_SIZE:1.25EM;
        --P_FONT_SIZE:1.50em;
        --BLOCKQUOTE_FONT_SIZE:1.25em;
        --SECTION_DIV_P_FONT_SIZE:1.25em:;
        /* ADVERTISIMENT ========================== */
    }
}
@media screen and (min-width:10px) and (orientation:portrait) /*PHONE*/ {
    :root {
        /* SIZING ================================= */
        --ASIDE_WIDTH:100%;
        --ASIDE_ARTICLE_WIDTH:50%;
        --HEADER_FOOTER_HEIGHT:5%;
        --HEADING_LEFT_WIDTH:40%;
        --HEADING_LEFT_IMG_HEIGHT:4.5VH;
        --HEADING_RIGHT_WIDTH:60%;
        --NAV_DIV_BUTTON_HEIGHT:5VH;
        --BLOCKQUOTE_WIDTH:75%;
        --SECTION_ARTICLE_WIDTH:98%;
        --SECTION_DIV_HEIGHT:55vh;
        --SECTION_DIV_IMG_HEIGHT:80%;
        --SECTION_DIV_WIDTH:100%;
        --SECTION_DIV_IMG_WIDTH:85%;
        --SECTION_DIV_P_WIDTH:85%;
        --SECTION_WIDTH:100%;
        /* FONT SIZING ============================ */
        --B_FONT_SIZE:1.80em;
        --HEADER_FOOTER_FONT_SIZE:3em;
        --H1_FONT_SIZE:4em;
        --H2_FONT_SIZE:3em;
        --H3_FONT_SIZE:2em;
        --NAV_A_FONT_SIZE:1.25EM;
        --NAV_DIV_BUTTON_FONT_SIZE:1.5EM;
        --P_FONT_SIZE:1.60em;
        --BLOCKQUOTE_FONT_SIZE:1.35em;
        --SECTION_DIV_P_FONT_SIZE:2em;
        /* ADVERTISIMENT ========================== */
    }
}

/* MAIN CONTENT =================================== */
a {
    text-decoration:none;
    color:var(--A_COLOR_BEFORE);
}
b {
    color:var(--B_COLOR);
    font-family:var(--B_FONT_FAMILY);
    font-size:var(--B_FONT_SIZE);
    padding:0% 0.75%;
}
blockquote {
    color:var(--BLOCKQUOTE_COLOR);
    font-family:var(--BLOCKQUOTE_FONT_FAMILY);
    font-size:var(--BLOCKQUOTE_FONT_SIZE);
    margin:2%;
    padding:0% 10%;
}
body {
    background:var(--BODY_BACKGROUND_COLOR);
    margin-left:auto;
    margin-right:auto;
    max-width:2000px;
    width:100%;
}
header, footer {
    background-color:var(--HEADER_FOOTER_BACKGROUND_COLOR);
    height:var(--HEADER_FOOTER_HEIGHT);
}
header p, footer p {
    color:var(--HEADER_FOOTER_COLOR);
    font-family:var(--HEADER_FOOTER_FONT_FAMILY);
    font-size:var(--HEADER_FOOTER_FONT_SIZE);
    text-align:right;
}
hr {
    border:1px dashed var(--HR_BORDER_COLOR);
    margin:1vh 0.25vw;
}
h1 {
    color:var(--H1_COLOR);
    font-family:var(--H1_FONT_FAMILY);
    font-size:var(--H1_FONT_SIZE);
    text-align:center;
}
h2 {
    color:var(--H2_COLOR);
    font-family:var(--H2_FONT_FAMILY);
    font-size:var(--H2_FONT_SIZE);
    padding:0% 0.75%;
}
h3 {
    color:var(--H3_COLOR);
    font-family:var(--H3_FONT_FAMILY);
    font-size:var(--H3_FONT_SIZE);
    padding:0% 0.75%;
}
p {
    color:var(--P_COLOR);
    font-family:var(--P_FONT_FAMILY);
    font-size:var(--P_FONT_SIZE);
    padding:0% 0.75%;
}
ul {
    color:var(--UL_COLOR);
    font-family:var(--P_FONT_FAMILY);
    font-size:var(--P_FONT_SIZE);
    margin:0% 3%;
}

/* ASIDES ========================================= */
aside {
    background-color:var(--ASIDE_BACKGROUND_COLOR);
    float:left;
    text-align:center;
    width:var(--ASIDE_WIDTH);
}
aside article {
    float:left;
    width:var(--ASIDE_ARTICLE_WIDTH);
}

/* SECTIONS ======================================== */
section {
    background-color:var(--SECTION_BACKGROUND_COLOR);
    float:right;
    width:var(--SECTION_WIDTH);
}
section article {
    background-color:var(--SECTION_ARTICLE_BACKGROUND_COLOR);
    margin:1vh auto;
    width:var(--SECTION_ARTICLE_WIDTH);
    border-radius:10px;
}
section div {
    margin:0.5% 0%;
    float:left;
    height:var(--SECTION_DIV_HEIGHT);
    width:var(--SECTION_DIV_WIDTH);
}
section div img {
    height:var(--SECTION_DIV_IMG_HEIGHT);
    margin:0.5% 7.5%;
    width:var(--SECTION_DIV_IMG_WIDTH);
}
section div p {
    color:var(--SECTION_DIV_P_COLOR);
    font-family:var(--SECTION_DIV_P_FONT_FAMILY);
    font-size:var(--SECTION_DIV_P_FONT_SIZE);
    margin:0% auto;
    text-align:center;
    width:var(--SECTION_DIV_P_WIDTH);
}
.D404 {
    width:98%;
    margin:1%;
}
.D404 article {
    background:VAR(--SECTION_ARTICLE_BACKGROUND_COLOR);
    border-radius:10px;
    font-size:1.5EM;
    margin:0PX 0PX 10PX 0PX;
    width:100%;
}
.D404 div {
    background-color:VAR(--SECTION_ARTICLE_BACKGROUND_COLOR);
    border:3PX SOLID #393F;
    border-radius:3.5PX;
    float:LEFT;
    height:26%;
    margin:0.5%;
    width:19%;
}
.D404 div a {
    float:NONE;
    color:VAR(--SECTION_ARTICLE_P_COLOR);
    font-size:1EM;
    padding:5% 5%;
    text-align:CENTER;
}

/* ADVERTISIMENT ================================== */