/* roboto-300 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/roboto-v30-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-300.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-300italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: url('fonts/roboto-v30-latin-300italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-300italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-300italic.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/roboto-v30-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}

body { padding: 0; margin: 0; background: #fff; font-family: 'Roboto', sans-serif; font-size: 19px; line-height: 28px; color: #464945; font-weight: 300; text-decoration: none; text-align: left; }
h1 { padding: 0; margin: 0 0 50px 0; font-family: 'Roboto', sans-serif; font-size: 60px; line-height: 69px; font-weight: 300; color: #315222; }
h2 { padding: 0; margin: 0 0 33px 0; font-family: 'Roboto', sans-serif; font-size: 26px; line-height: 35px; font-weight: 400; color: #315222; }
h3 { padding: 0; margin: 0 0 30px 0; font-family: 'Roboto', sans-serif; font-size: 24px; line-height: 33px; font-weight: 300; color: #464945; }
h4 { padding: 0; margin: 0; font-family: 'Roboto', sans-serif; font-size: 18px; line-height: 18px; font-weight: 300; color: #464945; letter-spacing: .1em; text-transform: uppercase; }
a { color: #464945; text-decoration: underline; }
p { padding: 0; margin: 0 0 30px 0; }
p span { font-weight: 400; }
ul { margin: 0 0 30px 20px; padding: 0; list-style: none; }
ul li::before { content: "\2022"; font-weight: bold; color: #305122; display: inline-block; width: 1em; margin-left: -1em; }
hr { height: 1px; border: none; margin: 10px 0 30px 0; border-bottom: 1px solid #b5bd34; }
iframe { margin: 30px 0 0 0; }
.clearer { clear: both; }
.contentclearer { clear: both; height: 20px; }

#top { width: 1100px; padding: 0; margin: 0 auto; text-align: left; }
#logo { float: left; margin: 52px 0 40px 0; }
#navi { float: right; margin: 118px 0 0 0; padding: 0; font-weight: 400; }
#navi .naviitem { float: left; margin: 0 0 0 31px; padding: 0 2px 0 2px; }
#navi .naviitem a { color: #305122; text-decoration: none; }
#navi .active { border-bottom: 3px solid #b5bd34; padding: 0 2px 8px 2px; }
#navi select { display: none; }

#header { width: 1100px; padding: 0; margin: 0 auto 60px auto; text-align: left; }
#header img { border-bottom: 7px solid #b5bd34; }
#header hr { height: 1px; border: none; margin: 0 0 90px 0; border-bottom: 7px solid #b5bd34; }

#content { width: 1100px; padding: 0; margin: 0 auto 140px auto; text-align: left; }
#content .content { float: right; width: 60%; }
#content .content .imgright { float: right; max-width: 39%; height: auto; margin: 0 0 20px 0; border: 3px solid #b5bd34; }
#content .content .imgleft { float: left; max-width: 27%; height: auto; margin: 0 5% 30px 0; border: 3px solid #b5bd34; }
#content .column { float: left; width: 45%; margin: 0 5% 0 0; }
#content .column h3 { margin: 0; }
#content .column img { max-width: 100%; height: auto; margin: 0 0 20px 0; border: 3px solid #b5bd34; }
#content .sidebar { float: left; width: 40%; }
#content .news { border: 3px solid #b5bd34; padding: 35px 40px 20px 40px; }
#content .news .imgleft { margin: 7px 20px 20px 0; border: none; }

#footer { width: 1100px; padding: 0; margin: 0 auto 70px auto; text-align: left; border-top: 7px solid #b5bd34; }
#footer .footer { float: left; margin: 20px 30px 30px 0; }

form { border: 3px solid #b5bd34; padding: 35px 40px 20px 40px; }
fieldset { border: none; margin: 0; padding: 0; }
fieldset h3 { margin: 0 0 10px 0; }
fieldset li h3 { margin: 0 0 20px 0; }
label { display: inline-block; line-height: 28px; vertical-align: top; width: 100%; padding: 0; margin: 0; color: #464945; }
fieldset ol { padding: 0; margin: 0; list-style: none; }
fieldset li { list-style: none; padding: 10px 0; margin: 0; }
fieldset input, fieldset textarea { width: 100%; background: #f0f1e8; border: none; font-family: 'Roboto', sans-serif; font-size: 19px; line-height: 28px; color: #464945; font-weight: 300; text-decoration: none; }
fieldset input[type=checkbox] { float: left; width: auto; margin: 7px 15px 0 0; }
fieldset span { float: left; width: 90%; }
.button { width: 160px; height: 40px; font-family: 'Roboto', sans-serif; font-size: 19px; line-height: 28px; color: #fff; font-weight: 300; background:#b5bd34; border: none; margin: 0 15px 0 0; }
.fieldblind { display: none; }

/* http://www.menucool.com/tooltip/css-tooltip */
a.tooltip { outline:none; }
a.tooltip:hover { text-decoration:none; } 
a.tooltip span { border-radius:4px; z-index:10; display:none; padding:14px 20px; margin:-270px 0 0 30px; width:300px; }
a.tooltip:hover span { display:inline; position:absolute; border:2px solid #b5bd34; background:#fff; font-family: 'Roboto', sans-serif; font-size: 13px; line-height: 22px; color: #464945; }
.callout { z-index:20; position:absolute; top:270px; border:0; left:-12px; }



/* Responsive */

@media only screen and (max-width: 1100px) {
iframe, small { width: 92%; margin: 30px 4% 0 4%; }
#top { width: 100%; margin: 0; }
#logo { float: none; margin: 30px 0 30px 4%; }
#navi { float: none; margin: 0; }
#navi .naviitem { display: none; }
#navi select { width: 100%; display: block; text-align: center; background: #b5bd34 url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0Ljk1IDEwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9LmNscy0ye2ZpbGw6IzQ0NDt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmFycm93czwvdGl0bGU+PHJlY3QgY2xhc3M9ImNscy0xIiB3aWR0aD0iNC45NSIgaGVpZ2h0PSIxMCIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIxLjQxIDQuNjcgMi40OCAzLjE4IDMuNTQgNC42NyAxLjQxIDQuNjciLz48cG9seWdvbiBjbGFzcz0iY2xzLTIiIHBvaW50cz0iMy41NCA1LjMzIDIuNDggNi44MiAxLjQxIDUuMzMgMy41NCA1LjMzIi8+PC9zdmc+) no-repeat 100% 50%; padding: 15px; border: 0; font-family: 'Roboto', sans-serif; font-size: 19px; color: #fff; font-weight: 400; -moz-appearance: none; -webkit-appearance: none; appearance: none; }
#navi select option { padding: 15px 0; }
#header { width: 100%; margin: 0; }
#header img { width: 100%; height: auto; }
#header hr { display: none; }
#content { width: 100%; margin: 50px 0; }
#content .content { width: 56%; margin: 0 4% 0 0; }
#content .sidebar { width: 32%; margin: 0 4%; }
#footer { width: 100%; margin: 0 0 40px 0; }
#footer .footer { margin: 20px 4% 30px 4%; }
}

@media only screen and (max-width: 900px) {
h1 { font-size: 50px; line-height: 59px; }
#content .content { float: none; width: 92%; margin: 0 4% 50px 4%; }
#content .sidebar { float: none; width: 92%; margin: 0 4%; }
#content .content .imgleft { max-width: 40%; margin: 0 5% 30px 0; }
.button { width: auto; padding: 0 15px; }
a.tooltip span { margin:-240px 0 0 -100px; width:280px; }
}

@media only screen and (max-width: 500px) {
h1 { font-size: 37px; line-height: 46px; }
}