body {
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 16px;                        /* 1 em = 16 px */
    }
/*--------------------------------------------------------------- RESETS */
* { 
    margin: 0;                              /* removes default spaces */
    padding: 0;
    }
/*--------------------------------------------------------------- FONTS */
@font-face {
    font-family: Trek;
    src: url("../fonts/DS9_Title.ttf");
    }
/*----------------------------------------------------------- NAVIGATION */
nav {
    /*	color: var(--color-2);*/
	/* background-color: #ece2c6; */
    background-color: #e6d8b3;
    border-bottom: 0.3em solid #336699;     /* nav bottom border */
    }
nav ul { 
    list-style-type: none;                  /* hide list bullets */
    }
nav li {
    float: left;                            /* align list horiz */
    }
nav a {
    color: #336699;
    display: block;
    font-weight: bold;
    letter-spacing: 0em;
    padding: 1.25em 1em 1.25em 1em;   /* item list spacing */
    text-align: center;
    text-decoration: none;                  /* hides underline */
    }
nav a:hover {
    background-color: #336699;
    color: #ece2c6;
    }
#logo {
    color: #862d59;
    font-family: Trek;
    font-size: 200%;
    padding: 0.3em 3em 0.3em 1em;
    }
.guide {
    background-color: #85adad;
    border-bottom: 1px solid #336699;
    color: #f9f5ec;
    font-size: 0.9em;
    letter-spacing: 0.1em;    
    line-height: 1.8em;
    text-align: center;
    }
.guideBold {
    color: #336699;
    font-weight: 900;
    }
.guideDate {
    color: gray;
    font-size: 75%;
    font-style: italic;
    font-weight: normal;
    }
.welcome {
    background-color: #bbbb77;
    color: black;
    line-height: 1em;
    font-family: 'Courier New', Courier, monospace;
    font-size: 1.1em;
    padding: 1em 2em 1em 2em;
    text-align: center;
    border-bottom: 1px solid #336699;       /* nav bottom border */
    }
/*------------------------------------------------------- SECTION LINKS */
.sectionLinks ul {
    background-color: #85adad;
    border-bottom: 0.3em solid #336699;     /* section bottom border */
    float: left;
    list-style-type: none;                  /* hide list bullets */
    padding: 1em 0 0.5em 0;
    width: 20%;                             /* creates columns */
    }
.sectionLinks li {
    padding: 0em 0 1em 0;                   /* line spacing */
    }
.sectionLinks a {
    color: #264d73;
    font-size: 1em;
    letter-spacing: 1px;
    padding-left: 4em;
    }
.sectionLinks a:hover {
    color: #ece2c6;
    font-weight: bold;
    text-decoration: none;
    }
.sectionLinks a:visited {
    color: purple;
    }
/*-------------------------------------------------------- RECENT POSTS */
.recentLinks img {
    border: 1px gray solid;
    float: left;
    margin: 0.625em 0.5em 0.625em 1em;
    padding: 0.3em;
    width: 5em;                             /* 80 pixels */
    }
.recentLinks p {
    font-size: 0.8em;
    font-weight: bold;
    padding: 3em 1em 0em 1em;
    text-align: left;
    }
.recentLinks h2 {
    color: black;
    padding: 1em 0 0.5em 1em;
    }
.recentLinks .date {
    color: gray;
    float: left;
    font-size: 100%;
    font-style: italic;
    font-weight: normal;
    padding-top: 0.5em;	
    }
/*---------------------------------------------------------- PAGE LINKS */
.pageLinks {
    background-color: #ece2c6;
/*	height: 300vh;*/
    padding-top: 1.5em;
    padding-bottom: 4em;
    }
.pageLinks a {
    /* display: block ; /* required to indent for <a> */
    padding-left: 40px;
    text-indent: 20px;
    }
.pageLinks a:hover {
    color: red;
    }
.pageLinks h2 {
    color: #336699;
    display: block;                         /* needed to indent  <a> */
    height: 1.5em;
    text-indent: 20px;
    }
/*------------------------------------------------------------ CAR LINKS */
.carLinks div {
    background-color: #ece2c6;
    }
.carLinks img {
    width: 100%;
    }
.carLinks figure {
    background-color: #ece2c6;
    border: thin silver solid;
    margin: 1em;
    padding: 1em;
    text-align: center;
    font-size: 0.75em;
    }
.carLinksActive:hover {
    background-color: #336699;
    color: #ece2c6;
    }
.carLinks h2 {
    color: #336699;
    display: block;                         /* needed to indent  <a> */
    font-size: 90%;
	height: 1.5em;
    width: 100%;
    text-align: center;
    }

/*------------------------------------------------------------ ARTICLES */
.storyTitle {
    display: inline-block;
    }
article {
    /* background-color: #ece2c6; */
    background-color: #ece2c6;
    color: black;
    line-height: 2.15em;
    padding: 2% 10% 5% 10%;
    }
article .date {
	color: gray;
	font-size: 1em;
	font-style: italic;
	margin-top: -0.5em;
    }
article h2 {
    color: #336699;
    padding: 2em 0 0.5em 0;
    }
article hr {
    border: 1px solid #336699;
    margin: 0;
    }
article img {
    width: 90%;                             /* force image to fit */
    }
article ol {
    list-style-position: inside;
    }
article li {
    list-style-position: inside;
    text-indent: -1em;
    padding-left: 1em;		
    }
article p {
    font-family: Garamond, Palatino, 'Palatino Linotype', serif;
    font-size: 1.35em;
    padding: 1% 0% 1% 0%;                   /* paragraph line spacing */
	}
article td {
	border: 1px solid black;
	padding: 0.5em 0.5em 0.5em 0em;
	}
/*---------------------------------------------------------------- MAIN */
footer {
    background-color: #336699;
    clear: both;
    height: 2em;
    width: 100%;
    bottom: 0;                              /* sticky footer */
    position: relative;                     /* sticky footer */
    }
.featureTitle {
	color: #264d73;
	font-size: 1em;
	font-weight: lighter;
	}
.featureHR {
	border: 1px solid #264d73;
	margin-bottom: -2em;
}

/*---------------------------------------------------------- STAR TABLE */
.star table, th, td {
	border: 1px solid black;
	line-height: 2em;
}
.star td {
	padding-left: 1em;
}
	
/*-------------------------- FLEXIBLE 12 COLUMNS STRUCTURE WITH GUTTERS */
.row { 
    clear: both;
    width: 100%;
    margin: 0;
    min-width: 0em;
    }

.oneCol, .twoCol, .threeCol, .fourCol, .fiveCol, .sixCol, .sevenCol, 
.eightCol, .nineCol, .tenCol, .elevenCol, .twelveCol { float:left; }

.oneCol    { width:  8.33% }    .twoCol    { width:  16.66% }
.threeCol  { width: 25.00% }    .fourCol   { width:  33.33% }
.fiveCol   { width: 41.66% }    .sixCol    { width:  50.00% }
.sevenCol  { width: 58.33% }    .eightCol  { width:  66.66% }
.nineCol   { width: 75.00% }    .tenCol    { width:  83.33% }
.elevenCol { width: 91.66% }    .twelveCol { width: 100.00% }
.last { margin-right: 0 }

/*== END OF LINE ==*/