/*
    main.css by Vincent Klijn LRPS 
    <https://www.vincentklijnux.eu>
    created 2016-12-26

    Copyright (c) 2016 Vincent Klijn UX
    This file may be used for personal educational purposes as needed. 
    Use for other purposes is granted provided that this notice is
    retained and any changes made are clearly indicated as such. 

    version 1.0.2 - vk 2018-07-23
*/

/* -------- color guide ----------
#3c6b92 : main blue
#6acce2 : light blue
#2c566a : teal accent
#193742 : dark blue
#e1d8b9 : sand accent
#cb7d20 : orange accent
#51341a : brown
#995522 : dark orange (used for links or high contrast accents)
#cb202a : red accent (this color does not encode well, use only for small accents)
#896287 : purple
*/

/* reasonable reset */
html, body, div, section, article, aside, header, hgroup, footer, nav, h1, h2, h3, h4, h5, h6, table, tr, td,
p, blockquote, address, time, span, em, strong, img, ol, ul, li, dl, dt, figure, canvas, video {
    margin: 0;
    padding: 0;
    border: 0;
}

body  {
    font-family: Georgia, serif;    /* default page font */
    background-color: #3c6b92;
}

/* paragraph styles */
p.message, p.error {
    font: normal 1em Helvetica, Arial, sans-serif;
    padding: 0 3px;
}

p.message {
    border: 1px solid #995522;
    background-color: #e1d8b9;
    color: black;
}

p.error {
    border: 1px solid #193742;
    background-color: #cb202a;
    color: white;
}

li.message {
	margin-right: 2em;
    border: 1px solid #995522;
	padding: 0.5em;
    background-color: #e1d8b9;
    color: black;
}

/* class style for red text */
.red {
    color: #cb202a;
}

/* div styles */
#content {
    width: 85%;
    margin: 20px auto;
    padding: 5px;
    background-color: white;
    min-height: 300px;
}

/* header styles */
#content h1, #content h2 {
    font: normal 1.4em Helvetica, Arial, sans-serif;
    color: #3c6b92;
}
/* other text styles */
#content p, h1, h2, h3 {
    margin-bottom: .5em;
}

/* line under h1 tag */
#content h1 {
    border-bottom: solid 2px #3c6b92;
}

/* styling for the h2 error message */
#content h2.error {
    color: #cb7d20;
}

/* Link List Styles on index.html */
#page-links {
	list-style: none;
	margin: 2em 0 0 2em;
}
#page-links li {
	margin-bottom: 1em;
}

/* Google Map Styles */
#mapCanvas {
    height: 500px;
    width: 800px;
}

/* Table Styles */

.myTable {
    background: #c3cebc;
    margin-bottom: .5em;
    border: 1px solid #995522;
    border-collapse: collapse;
}

.myTable tr, .myTable td, .myTable th {
    font: normal 1em Helvetica, Arial, sans-serif;
    text-align: left;
    border: solid 1px #995522;
    padding: 1px 3px;
}

.myTable tr:nth-child(odd) {
    background: #e1d8b9;
}

.myTable th {
    background: #193742;
    color: #c3cebc;
    border: solid 1px #51341a;
}

.myTable td {
    min-width: 100px;
}

/* Form Styles */

#form {
    margin-bottom: 10px;
    border-bottom: 2px solid #3c6b92;
}

#form input[type=text] {
    width: 300px;
}

#form td.button, #form td.label {
    text-align: right;
}

#form td.label {
    padding-right: 3px;
}
