/*@import url('fonts.css'); see notes in fonts.css */

@font-face {
    font-family: 'belcher';
    src: url('../fonts/lato-light.eot');
    src: url('../fonts/lato-light.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-light.woff2') format('woff2'),
         url('../fonts/lato-light.woff') format('woff'),
         url('../fonts/lato-light.ttf') format('truetype'),
         url('../fonts/lato-light.svg#latolight') format('svg');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'belcher';
    src: url('../fonts/lato-regular.eot');
    src: url('../fonts/lato-regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-regular.woff2') format('woff2'),
         url('../fonts/lato-regular.woff') format('woff'),
         url('../fonts/lato-regular.ttf') format('truetype'),
         url('../fonts/lato-regular.svg#latoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'belcher';
    src: url('../fonts/lato-semibold.eot');
    src: url('../fonts/lato-semibold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-semibold.woff2') format('woff2'),
         url('../fonts/lato-semibold.woff') format('woff'),
         url('../fonts/lato-semibold.ttf') format('truetype'),
         url('../fonts/lato-semibold.svg#latosemibold') format('svg');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'belcher';
    src: url('../fonts/lato-bold.eot');
    src: url('../fonts/lato-bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-bold.woff2') format('woff2'),
         url('../fonts/lato-bold.woff') format('woff'),
         url('../fonts/lato-bold.ttf') format('truetype'),
         url('../fonts/lato-bold.svg#latobold') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'belcher';
    src: url('../fonts/lato-heavy.eot');
    src: url('../fonts/lato-heavy.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-heavy.woff2') format('woff2'),
         url('../fonts/lato-heavy.woff') format('woff'),
         url('../fonts/lato-heavy.ttf') format('truetype'),
         url('../fonts/lato-heavy.svg#latoheavy') format('svg');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'belcher';
    src: url('../fonts/lato-black.eot');
    src: url('../fonts/lato-black.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-black.woff2') format('woff2'),
         url('../fonts/lato-black.woff') format('woff'),
         url('../fonts/lato-black.ttf') format('truetype'),
         url('../fonts/lato-black.svg#latoblack') format('svg');
    font-weight: 900;
    font-style: normal;
}


/* reset browser defaults */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, input, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, textarea, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
main, menu, nav, output, ruby, section, summary,
time, mark, audio, progress, video {
margin: 0;
padding: 0;
border: 0;
outline: none;
max-height: 2000em; /* workaround for chrome on android font resizing problem */
font-size: 100%;
font: inherit;
text-align: left;
vertical-align: baseline;
background: transparent;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, main, menu, nav, section, summary {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: " ";
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
[hidden], template {
display: none;
}
/*small {
font-size: 80%;
}*/
b, strong {
font-weight: bold;
}
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
pre {
overflow: auto;
}
code, kbd, pre, samp, tt {
font-family: "Courier New", Courier, monospace;
font-size: 1em;
}
button, input, optgroup, select, textarea {
margin: 0;
color: inherit;
font: inherit;
}
textarea {
overflow: auto;
}
button {
overflow: visible;
}
button, select {
text-transform: none;
}
button, input[type="button"], input[type="reset"], input[type="submit"] {
-webkit-appearance: button;
cursor: pointer;
}
button[disabled], input[disabled] {
cursor: default;
}
input[type="checkbox"], input[type="radio"] {
box-sizing: border-box;
padding: 0;
}
input[type="checkbox"] {
vertical-align: text-bottom;
}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
input[type="search"] {
-webkit-appearance: textfield;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}


html {
min-height: 100%;
background-color: #608060;
background-repeat: repeat;*/
-ms-text-size-adjust: 100%; /* Prevent iOS text size adjust after orientation change, without disabling user zoom */
-webkit-text-size-adjust: 100%;
}

body {
font-family: belcher,Arial,sans-serif;
letter-spacing: 1px;
}

.container {
margin: 0px auto;
width: 100%;
max-width: 1240px;
}

.emergency {
color: #c02020;
}

a, a:hover {
color: #407040;
text-decoration: none;
white-space: nowrap;
}

h1, h2, h3, h4, h5, h6 {
margin-top: .5em;
font-weight: 900;
}
h1 {
font-size: 215%;
}
h2 {
font-size: 190%;
}
h3 {
font-size: 165%;
font-weight: 800;
}
h4 {
font-size: 140%;
font-weight: 800;
}
h5 {
font-size: 120%;
font-weight: bold;
}
h6 {
font-size: 100%;
font-weight: bold;
}

hr {
clear: both;
display: block;
margin: 16px 0px;
border: 0;
height: .1em;
background-color: #909090;
}

img {
display: inline-block;
border: 0;
vertical-align: bottom;
}

ul, ol {
list-style-type: none;
}

table {
width: 100%;
}

th, td {
padding: .1em .4em;
}

th {
color: #202020;
font-weight: bold;
white-space: nowrap;
}

select {
margin: .1em;
border: 1px solid gray;
border-radius: .3em;
background: #f0f0f0;
}

input {
padding: .2em;
border-radius: .3em;
letter-spacing: 1px; /* bug workaround? */
white-space: nowrap;
}

input[type="text"], input[type="password"] {
margin: .1em;
border: 1px solid darkgray;
background: #f0f0f0;
}

textarea {
margin: .1em;
padding: .2em;
border: 1px solid darkgray;
border-radius: .3em;
background: #f0f0f0;
overflow: auto;
}

input[type="text"].fieldError, textarea.fieldError {
border: 1px solid #e00000;
}

input[type="submit"], input[type="button"], input[type="reset"],
.button, a.button {
margin: 2px 4px;
padding: .7em 1em;
min-width: 4em;
color: #d0d0d0;
font-weight: 900;
text-align: center;
white-space: nowrap;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
background-color: #407040;
}

input[type="submit"], input[type="button"], input[type="reset"] {
min-width: calc(4em + 2em); /* need to add 2em for left and right padding? */
}

input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover,
.button:hover, a.button:hover {
color: white;
background-color: #70a070;
}

.label {
text-align: right;
white-space: nowrap;
}

.top, .label.top {
vertical-align: top;
}

.textarea td.label {
padding-top: .4em;
}

.label.textarea {
vertical-align: top;
}

td.label {
padding-left: 0;
padding-right: 0;
}


.note {
font-size: smaller;
}

.success {
color: green;
font-weight: bold;
}

.error {
color: #e00000;
}

.globalMessages ul {
display: table;
margin: 0px auto 12px;
}

.requiredField, .fieldRequired, .required .label {
font-weight: bold;
}

.fieldErrorMessage {
color: #e00000;
white-space: nowrap;
}

td.fieldErrorMessage {
padding-left: 0;
padding-right: 0;
}

.textarea td.fieldErrorMessage {
padding-top: .4em;
vertical-align: top;
}

/**********/
/* header */
/**********/
header {
}

header:after {
clear: both;
content: " ";
display: block;
height: 0;
visibility: hidden;
}

.header-top {
padding: 16px;
color: rgba(120, 120, 120, 0.8);
text-shadow: .08em .1em .1em #a0d0a0, 0px 0px 0px black,
             .08em .1em .1em #a0d0a0;
background-color: #a0d0a0;
}

.header-top a {
display: inline-block;
color: inherit;
text-shadow: inherit;
}

.header-top p {
margin: 0;
padding: 0;
border: 0;
font-weight: 800;
font-size: 140%;
color: inherit;
}

.header-top .name {
font-weight: 900;
font-size: 110%;
letter-spacing: .08em;
}
.header-top .company.name {
font-size: 135%;
}

header .rightobject {
float: right;
}

header p.rightobject {
line-height: 1.2em;
text-align: right;
}


/********/
/* menu */
/********/
nav {
font-size: 110%;
background-color: #608060;
}

nav ul {
margin: 0px auto;
text-align: center;
}

nav ul li {
margin-top: 4px;
display: inline-block;
}

nav ul li a {
display: block;
padding: .85em 1em .7em;
border-top-left-radius: .5em;
border-top-right-radius: .5em;
min-width: 4em;
color: #e0e0e0;
font-weight: bold;
text-align: center;
}

nav ul li.active > a, nav ul li > a:hover {
color: #808080;
background-color: #e0f0e0;
}

/*******************/
/* menu drop downs */
/*******************/
nav ul li ul, .header-menu ul li ul {
display: none;
margin-left: -1px;
border: none;
}

nav ul li:hover ul, .header-menu ul li:hover ul {
display: block;
position: absolute; /* need these for drop downs to work */
z-index: +2;
}

nav ul li:hover ul li, .header-menu ul li:hover ul li {
display: block;
}

nav ul li:hover ul li a, .header-menu ul li:hover ul li a {
margin-top: -4px;
padding: .75em;
border: .3em solid #808080;
font-weight: bold;
text-align: left;
}

nav ul li:hover ul li a:hover, .header-menu ul li:hover ul li a:hover {
border: .3em solid #e8e8e8;
color: white;
background-color: #808080;
}

nav > ul > li:hover > ul > li.active > a, .header-menu > ul > li:hover > ul > li.active > a {
border: .3em solid #e8e8e8;
color: white;
background-color: #808080;
}


/********/
/* main */
/********/
section {
padding: calc(16px + 1em) 8px;
color: #505050;
background-color: #e0f0e0;
}

section:after {
clear: both;
content: " ";
display: block;
height: 0;
visibility: hidden;
}

section img, section #map iframe {
box-shadow: 0px 0px 8px 2px #a0a0a0;
}

section > .container > div {
margin: 8px;
}

section p {
margin-bottom: calc(16px + .5em);
line-height: 1.3em;
font-size: 120%;
font-weight: semi-bold;
}

section ul {
margin-left: 1em;
font-size: 120%;
list-style: disc outside;
}

section ul li {
margin: .5em 0;
}

section .docimage {
padding: 0 .5em;
display: inline-block;
text-align: center;
}

section .docimage p {
font-size: 100%;
}

section #images {
float: right;
margin: calc(16px + 1em) 0px calc(16px + 1em) calc(16px + 1em);
width: 40%;
max-width: 450px;
height: auto;
}

section#home #images {
display: none;
}

section#about #images {
width: 333px;
height: auto;
}

section #images img {
border-radius: 1em;
width: 100%;
height: 100%;
}

/* image slide show/rotation */
section #imgsscontainer {
float: right;
margin: calc(16px + 1em) 0px calc(16px + 1em) calc(16px + 1em);
width: 40%;
max-width: 450px;
}

/* retains aspect ratio of image slide show */
section #imgss {
width: 100%;
position: relative;
}
section #imgss:before {
content: "";
display: block;
padding-top: 75%; /* 4/3 ratio */
}

section #imgss img {
border-radius: 1em;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 8;
opacity: 0.0;
}
section #imgss img.active {
z-index: 10;
opacity: 1.0;
}
section #imgss img.last-active {
z-index: 9;
}

/* google map box - always 4/3 aspect ratio */
section #mapcontainer {
clear: right;
float: right;
margin-left: calc(16px + 1em);
margin-right: 0;
width: 40%;
max-width: 450px;
}

section#location #mapcontainer {
clear: none;
float: none;
display: inline-block;
min-width: 16em; /* hours width */
text-align: center;
}

section #mapcontainer p {
padding: 4px 0;
text-align: center;
}

/* retains aspect ratio of map */
section #map {
width: 100%;
position: relative;
}
section #map:before {
content: "";
display: block;
padding-top: 75%; /* 4/3 ratio */
}
section #map iframe {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}

#contactform {
margin-top: 2em;
}

#contactform table {
width: auto;
font-size: 115%;
}

#contactform input[type="text"], #contactform input[type="password"] {
width: 100%;
max-width: 20em;
}

#contactform textarea {
width: 100%;
max-width: 30em;
height: 6em;
}

.hours {
padding-top: .7em;
}

#hours, .hours {
display: inline-block;
white-space: nowrap;
}

#hours, #contactinfo, #contactform {
vertical-align: top;
}

#hours h5, .hours h5 {
margin: 0 0 .5em;
text-align: center;
}

#privacy .container {
max-width: 50em;
}


/**********/
/* footer */
/**********/
footer {
padding: 16px;
font-size: 100%;
color: #d0d0d0;
background-color: #608060;
}

footer:after {
clear: both;
content: " ";
display: block;
height: 0;
visibility: hidden;
}

footer a:hover {
color: white;
}

footer p {
margin-top: .5em;
color: inherit;
font-weight: semi-bold;
line-height: 1.3em;
}

footer p a {
color: inherit;
text-decoration: underline;
}

footer .contactinfo {
float: left;
}

footer h5 {
font-size: 150%;
}

footer h5, footer h5 a {
color: #303030;
}

footer .hours {
float: right;
font-weight: semi-bold;
}

footer .hours th {
color: #303030;
}

footer .copyright {
clear: both;
padding-top: .5em; /* margin doesn't work ?? */
}

footer .copyright p {
font-size: 90%;
text-align: center;
}