/*@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');*/
@font-face {
    font-family: "Open Sans";
    src: url('../fonts/OpenSans-VariableFont_wdth,wght.ttf') format('woff2-variations');
    font-feature-settings: "lnum" 1;
    font-display: swap;
}
/*@font-face {
    font-family: "Open Sans";
    font-feature-settings: "lnum" 1;
    src: url('../fonts/OpenSans-Italic.woff2') format('woff2-variations');
    font-weight: 300 900;
    font-style: italic;
    font-display: swap;
}*/
@font-face {
    font-family: 'Oswald';
    src: url('../fonts/Oswald-Regular.woff') format('woff'),
    url('../fonts/Oswald-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Mulish";
    font-feature-settings: "lnum" 1;
    src: url('../fonts/mulish/woff2/mulish.woff2') format('woff2-variations');
    font-weight: 300 900;
    font-display: swap;
}

:root {
    --weight-light: 'wght' 300;
    --weight-normal: 'wght' 400;
    --weight-medium: 'wght' 450;
    --weight-demi: 'wght' 525;
    --weight-bold: 'wght' 700;
    --weight-h-light: 'wght' 300;
    --weight-h-normal: 'wght' 400;
    --weight-h-medium: 'wght' 500;
    --weight-h-demi: 'wght' 600;
    --weight-h-bold: 'wght' 700;
    --weight-h-bolder: 'wght' 800;
    --weight-h-black: 'wght' 900;
    /* Color: monochromes */
    --black-base: 0, 0%;
    --black-hsl: var(--black-base), 0%;
    --black: hsl(var(--black-hsl));
    --black-05: hsla(var(--black-hsl), 5%);
    --black-10: hsla(var(--black-hsl), 10%);
    --black-15: hsla(var(--black-hsl), 15%);
    --black-20: hsla(var(--black-hsl), 20%);
    --black-25: hsla(var(--black-hsl), 25%);
    --black-30: hsla(var(--black-hsl), 30%);
    --black-35: hsla(var(--black-hsl), 35%);
    --black-40: hsla(var(--black-hsl), 40%);
    --black-45: hsla(var(--black-hsl), 45%);
    --black-50: hsla(var(--black-hsl), 50%);
    --black-55: hsla(var(--black-hsl), 55%);
    --black-60: hsla(var(--black-hsl), 60%);
    --black-65: hsla(var(--black-hsl), 65%);
    --black-70: hsla(var(--black-hsl), 70%);
    --black-75: hsla(var(--black-hsl), 75%);
    --black-80: hsla(var(--black-hsl), 80%);
    --black-85: hsla(var(--black-hsl), 85%);
    --black-90: hsla(var(--black-hsl), 90%);
    --black-95: hsla(var(--black-hsl), 95%);
    --white-base: 0, 100%;
    --white-hsl: var(--white-base), 100%;
    --white: hsl(var(--white-hsl));
    --white-05: hsla(var(--white-hsl), 5%);
    --white-10: hsla(var(--white-hsl), 10%);
    --white-15: hsla(var(--white-hsl), 15%);
    --white-20: hsla(var(--white-hsl), 20%);
    --white-25: hsla(var(--white-hsl), 25%);
    --white-30: hsla(var(--white-hsl), 30%);
    --white-35: hsla(var(--white-hsl), 35%);
    --white-40: hsla(var(--white-hsl), 40%);
    --white-45: hsla(var(--white-hsl), 45%);
    --white-50: hsla(var(--white-hsl), 50%);
    --white-55: hsla(var(--white-hsl), 55%);
    --white-60: hsla(var(--white-hsl), 60%);
    --white-65: hsla(var(--white-hsl), 65%);
    --white-70: hsla(var(--white-hsl), 70%);
    --white-75: hsla(var(--white-hsl), 75%);
    --white-80: hsla(var(--white-hsl), 80%);
    --white-85: hsla(var(--white-hsl), 85%);
    --white-90: hsla(var(--white-hsl), 90%);
    --white-95: hsla(var(--white-hsl), 95%);
    --grey-base: 270, 1.5%;
    --grey-hsl: var(--grey-base), 25.9%;
    --grey: hsl(var(--grey-hsl));
    --grey-l1: hsl(var(--grey-base), 36%);
    --grey-l2: hsl(var(--grey-base), 46%);
    --grey-l3: hsl(var(--grey-base), 56%);
    --grey-l4: hsl(var(--grey-base), 66%);
    --grey-l5: hsl(var(--grey-base), 80%);
    --grey-d1: hsl(var(--grey-base), 20%);
    --grey-d2: hsl(var(--grey-base), 14%);
    --grey-05: hsla(var(--grey-hsl), 5%);
    --grey-10: hsla(var(--grey-hsl), 10%);
    --grey-15: hsla(var(--grey-hsl), 15%);
    --grey-20: hsla(var(--grey-hsl), 20%);
    --grey-25: hsla(var(--grey-hsl), 25%);
    --grey-30: hsla(var(--grey-hsl), 30%);
    --grey-35: hsla(var(--grey-hsl), 35%);
    --grey-40: hsla(var(--grey-hsl), 40%);
    --grey-45: hsla(var(--grey-hsl), 45%);
    --grey-50: hsla(var(--grey-hsl), 50%);
    --grey-55: hsla(var(--grey-hsl), 55%);
    --grey-60: hsla(var(--grey-hsl), 60%);
    --grey-65: hsla(var(--grey-hsl), 65%);
    --grey-70: hsla(var(--grey-hsl), 70%);
    --grey-75: hsla(var(--grey-hsl), 75%);
    --grey-80: hsla(var(--grey-hsl), 80%);
    --grey-85: hsla(var(--grey-hsl), 85%);
    --grey-90: hsla(var(--grey-hsl), 90%);
    --grey-95: hsla(var(--grey-hsl), 95%);
    /* Colors: etc */
    --red-base: 343.2, 66.7%;
    --red-hsl: var(--red-base), 29.4%;
    --red: hsl(var(--red-hsl));
    --red-l1: hsl(var(--red-base), 40%);
    --red-l2: hsl(var(--red-base), 45%);
    --red-d1: hsl(var(--red-base), 30%);
    --red-d2: hsl(var(--red-base), 25%);
    --red-10: hsla(var(--red-hsl), 10%);
    --red-20: hsla(var(--red-hsl), 20%);
    --red-30: hsla(var(--red-hsl), 30%);
    --red-40: hsla(var(--red-hsl), 40%);
    --red-50: hsla(var(--red-hsl), 50%);
    --red-60: hsla(var(--red-hsl), 60%);
    --red-70: hsla(var(--red-hsl), 70%);
    --red-80: hsla(var(--red-hsl), 80%);
    --red-90: hsla(var(--red-hsl), 90%);

    /*--blue-base: 224.5, 52.4%;
    --blue-hsl: var(--blue-base), 24.7%;
    --blue: hsl(var(--blue-hsl));
    --blue-l1: hsl(var(--blue-base), 40%);
    --blue-l2: hsl(var(--blue-base), 45%);
    --blue-d1: hsl(var(--blue-base), 30%);
    --blue-d2: hsl(var(--blue-base), 25%);
    --blue-10: hsla(var(--blue-hsl), 10%);
    --blue-20: hsla(var(--blue-hsl), 20%);
    --blue-30: hsla(var(--blue-hsl), 30%);
    --blue-40: hsla(var(--blue-hsl), 40%);
    --blue-50: hsla(var(--blue-hsl), 50%);
    --blue-60: hsla(var(--blue-hsl), 60%);
    --blue-70: hsla(var(--blue-hsl), 70%);
    --blue-80: hsla(var(--blue-hsl), 80%);
    --blue-90: hsla(var(--blue-hsl), 90%);*/

    --blue-base: 211.4, 87.4%;
    --blue-hsl: var(--blue-base), 24.9%;
    --blue: hsl(var(--blue-hsl));
    --blue-l1: hsl(var(--blue-base), 40%);
    --blue-l2: hsl(var(--blue-base), 45%);
    --blue-d1: hsl(var(--blue-base), 30%);
    --blue-d2: hsl(var(--blue-base), 25%);
    --blue-10: hsla(var(--blue-hsl), 10%);
    --blue-20: hsla(var(--blue-hsl), 20%);
    --blue-30: hsla(var(--blue-hsl), 30%);
    --blue-40: hsla(var(--blue-hsl), 40%);
    --blue-50: hsla(var(--blue-hsl), 50%);
    --blue-60: hsla(var(--blue-hsl), 60%);
    --blue-70: hsla(var(--blue-hsl), 70%);
    --blue-80: hsla(var(--blue-hsl), 80%);
    --blue-90: hsla(var(--blue-hsl), 90%);

    --darkblue-base: 228, 32%;
    --darkblue-hsl: var(--darkblue-base), 21%;
    --darkblue: hsl(var(--darkblue-hsl));
    --darkblue-l1: hsl(var(--darkblue-base), 40%);
    --darkblue-l2: hsl(var(--darkblue-base), 45%);
    --darkblue-d1: hsl(var(--darkblue-base), 30%);
    --darkblue-d2: hsl(var(--darkblue-base), 25%);
    --darkblue-10: hsla(var(--darkblue-hsl), 10%);
    --darkblue-20: hsla(var(--darkblue-hsl), 20%);
    --darkblue-30: hsla(var(--darkblue-hsl), 30%);
    --darkblue-40: hsla(var(--darkblue-hsl), 40%);
    --darkblue-50: hsla(var(--darkblue-hsl), 50%);
    --darkblue-60: hsla(var(--darkblue-hsl), 60%);
    --darkblue-70: hsla(var(--darkblue-hsl), 70%);
    --darkblue-80: hsla(var(--darkblue-hsl), 80%);
    --darkblue-90: hsla(var(--darkblue-hsl), 90%);

    --golden-base: 55.4, 10.2%;
    --golden-hsl: var(--golden-base), 75.1%;
    --golden: hsl(var(--golden-hsl));
    --golden-l1: hsl(var(--golden-base), 40%);
    --golden-l2: hsl(var(--golden-base), 45%);
    --golden-d1: hsl(var(--golden-base), 30%);
    --golden-d2: hsl(var(--golden-base), 25%);
    --golden-05: hsla(var(--golden-hsl), 5%);
    --golden-10: hsla(var(--golden-hsl), 10%);
    --golden-20: hsla(var(--golden-hsl), 20%);
    --golden-30: hsla(var(--golden-hsl), 30%);
    --golden-40: hsla(var(--golden-hsl), 40%);
    --golden-50: hsla(var(--golden-hsl), 50%);
    --golden-60: hsla(var(--golden-hsl), 60%);
    --golden-70: hsla(var(--golden-hsl), 70%);
    --golden-80: hsla(var(--golden-hsl), 80%);
    --golden-90: hsla(var(--golden-hsl), 90%);

}


/* Common */
* {margin:0px; padding:0px; line-height: 1.4rem;}

html, body {
    height: 100%;
}

body {font-family: 'Open Sans', sans-serif; font-size:16px; color:#333; font-weight: 400;   display: flex;
    flex-direction: column;
    min-height: 100vh;}

/* Flexbox layout for the entire page */
div.wrapper {display: flex; flex-direction: column; min-height: 100vh;}
#middle{flex: 1;}

h1, h2, h3, h4, h5, h6 {font-family: 'Oswald'; margin: 12px 0; color: var(--blue-d2);}
h1 {font-size:2.4rem;}
h2 {font-size: 2rem; margin-bottom:2rem; text-transform: uppercase; text-align: center;}

p { line-height:1.5rem;}

a, a > em {cursor: pointer; text-decoration: none; color:var(--red);
    text-decoration: none;
    background-image: linear-gradient(currentColor, currentColor);
    background-position: 0 100%;
    background-repeat: no-repeat;
    background-size: 0 1px;
    transition: all 0.3s ease !important;}

a > span {}
a:hover, a:hover > span, a:hover > em {outline: 0; background-size: 100% 1px;}
a:focus {outline: 0;}

strong{font-weight:600;}
ul li, ol li {margin-bottom:0.5rem;}
img {max-width:100%; height:auto;}

.btn-primary {background:var(--blue-d1); border-color:var(--blue-d1);}
.btn-primary:hover {background:var(--blue-d2); border-color:var(--blue-d2);}

.btn-danger {background:var(--red-d1); border-color:var(--red-d1);}
.btn-danger:hover {background:var(--red-d2); border-color:var(--red-d2);}
strong.formRequired {color:var(--red-d1);}