/* This main css file contains the default rules and is geared toward the small/phone view */

* { box-sizing: border-box;}  /* This wildcard applies to all elements ensuring a box layout model */

body {
    
    line-height: 32px;
    font-family: Constantia;
    color: darkorange;
    /* Declare the base font-family - from google font api or other */
}

header, nav, main, footer { /* the comma means apply the following CSS declarations to all of the listed elements */
    /* Declare the maximum width and other main element rules to limit the stretch on wide views */
    margin: 1.25rem auto;
    padding: .5rem;
    max-width: 800px;
}

header {
    text-align: center;
    background-color: white;
    color: black;
}
header h1 {
    font-size: 32px;
    text-align: center;
    color: #FF964C;
    }
header img {
    float: left;
    margin-right: 20px;
}
header .subheading {
    font-size: 20px;
    text-align: center;
    color: #FF964C;
}

nav {}
nav button {}
nav ul {
    list-style-type: none;
    margin: 1px;
    padding: 1px;
    overflow: hidden;
    background-color: #9A4A12;
}
nav ul li {
    text-align: center;
}
nav ul li a {
    display: block;
    color: #FF964C;
    text-align: center;
    padding: 1px 20px;
    text-decoration: none;
}
nav ul li.active a {
    background-color: #7F3300;
}
nav ul li a:hover {
    background-color: #EF6F14;
    color: white;
    
}

main {
    margin: 1.25rem auto;
    padding: .5rem;
    max-width: 800px;
}
 h2 {
    font-family: Constantia;
    font-size: 26px;    
    text-align: center;
    
}

h3, h4, h5 {
    font-family: Constantia;
    font-size: 22px;    
    text-align: center;
    
}
main section div {
    text-align: center;
}
main section picture img {
    display: block;
    float: left;
    margin-right: 20px;
}
main figure { 
    margin: 0 0 .1rem 2%; 
    width:96%; 
}
main figure img { 
    width: 100%; 
}


section {}

section img {
    float: left;
    margin-right: 20px;
    
}
 
section.forecast { 
    display: none;
    
}


article p.town-article img { 
    display: block;
    max-height: 100%; 
    margin-right: auto;
    margin-left: auto;
    padding: 1px 1px 12px 1px;
}

footer {
    text-align: center;
    background-color: #7F3300;
}
footer aside {
    line-height: normal;
    font-size: 15px;
    padding: 12px 0 0 0;
}
footer>p {
    font-size: 12px;
    text-align: center;
} 

