/*
 * AlexDW's New and Improved CSS3 StyleSheet
 * This is for the new layout
 * Designed for The Home of AlexDW
 * http://www.mgzi.net/
 * Copyright (C) 2020 H. Alex La Hurreau
 */

/*
 * Five colors:
 * Green (bright): #6bff23
 * Blue (bright): #0060d3
 * Gray/blue: #3a363f
 * Text (l. blue-green): #7cd4aa
 * Link (mustard): #bbbf55
 *
 * Not used:
 * Blue (dark): #2c3ba7
 * Green (dark): #185841
 */

/* We now have a white background (with black text) */
html {
    font-size: 1px;/*for using REM units*/
    background: #3a363f;
}
body{
    /* TODO these are the 2020 'normal' fonts, but maybe we can do better? */
    /*font-family: -apple-system, Blink,MacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;*/
    font-family: 'Cambria', 'Palatino', 'URW Palladio L', ui-serif, serif;
    font-size: 16rem;
    font-weight: 400;
    line-height: 1.3;
    color: #3a363f;
    max-width: 960px;
    margin: auto;
}

/* Heading/SubHeading formats */
header#banner {
    text-align: center;
    margin: 0px;
    color: #3a363f;
    background-color: #3a363f;
    background-image: url("/images/waterfront.png");
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
    height: 250px;
    overflow: auto;
}

header, h1, h2, h3, h4, h5, h6 {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
}

/* Link colors */
a {
    text-decoration: none;
}

a:link {
    background: transparent;
    color: #bbbf55;
}
a:visited {
    background: transparent;
    color: #bbbf55;
}
a:hover {
    background: #bbbf55;
    color: #3a363f;
}

/* Top banner formatting */
nav {
    background: #3a363f;
    max-width: 960px;
    margin: 0.5em;
}
nav ul {
    border: none;
    margin: 0em;
    padding: 0em;
    text-align: center;
    font-weight: bold;
}
nav a:hover {
    background: #0060d3;
    color: #3a363f;
}
nav ul li {
    display: inline;
    text-decoration: none;
}
nav ul li a {
    display: inline-block;
    padding: 0.5em 0.5em;
    border-radius: 0.7em;
    border: 0.1em solid #0060d3;
    margin: 0.3em 0.1em;
}
nav ul li.active a:link {
    background: #0060d3;
    color: #6bff23;
}

span#icon {
    display: inline-block;
    width: 5em;
}

/* Page layouts */
div#main {
    background: #3a363f;
    color: #7cd4aa;
    /*color: #bed3b5;*/
    border: none;
    margin: 0px;
    overflow: hidden;
}
article {
    margin-top: -0.5em;
    padding: 0.0em 0.5em;
}

/* CSS for the anti-SPAM message */
address#about {
    text-align: right;
    font-style: italic;
    font-size: small;
    margin-top: -0.5em;
    padding: 0.5em 0.5em;
    background: #ffffff;
}

/* CSS for acronyms (saw this on php.net) */
abbr, acronym {
    border-bottom: 1px dashed #00cc00;
    cursor: help;
}

img { border: 0; }

@media screen and (max-width: 800px) {
    nav ul li {
        display: block;
        padding: 0.5em 0em;
    }

    background-position: right;
}

/* vim:set expandtab ts=4: */
