/**
 * FANGS THEME - EXECUTIVE SHARP LAYOUT - OUTER - STYLESHEET
 */


/**********************************************************************************************************************/
/*** APP OUTER STRUCTURE                                                                                              */
/**********************************************************************************************************************/

body.structure-app-outer {
    display: grid;
    height: 100vh;
    grid-template-rows: auto auto 30px;
    grid-template-columns: 100%;
    grid-template-areas: "header" "main" "footer";
    background: #eceff1;
    background: url(images/bg-noise-pattern-with-crosslines.png);
    font-family: 'Roboto Condensed', sans-serif;
}

/* Structure areas */
.structure-app-outer header {
    grid-area: header;
}
.structure-app-outer main {
    grid-area: main;
    padding: 5px 5px 50px 5px;
}
.structure-app-outer footer {
    grid-area: footer;
}

/* Structure basic texts and headings */
.structure-app-outer p,
.structure-app-outer small,
.structure-app-outer span {
    color: var(--font-solitaire-color);
}
.structure-app-outer h1,
.structure-app-outer h2,
.structure-app-outer h3,
.structure-app-outer h4,
.structure-app-outer h5,
.structure-app-outer h6 {
    margin: 0;
    padding: 0 0 10px 0;
    font-weight: 400;
    color: var(--color-primary);
}

h1 {
    font-size: 2.5em;
}
h2 {
    font-size: 2.2em;
}
h3 {
    font-size: 1.9em;
}
h4 {
    font-size: 1.6em;
}
h5 {
    font-size: 1.3em;
}
h6 {
    font-size: 1.1em;
}

/* Structure misc elements */
.structure-app-outer hr {
    margin: 20px auto;
    padding: 0;
    width: 95%;
    background-color: var(--color-primary);
    box-shadow: 0 1px 1px #999;
}