/*

    Eaglehook Common Styles
    January 2014
    kenzie@route19.com

*/

/* =Defaults ********** */

* { margin: 0; padding: 0; }
a img { border: 0; }

html,
body { background: #000 url(../images/background.jpg) no-repeat center center fixed; background-size: cover; color: #000; font-family: helvetica, arial, sans-serif; font-size: 16px; min-width: 980px; }

a,
a:link,
a:visited { color: #c9920e; }

a:hover,
a:active,
a:focus { color: #996f08; }

a.button { background: #fdfe35; border: 6px solid #888; border-radius: 12px; color: #000; font-weight: bold; padding: 10px; text-decoration: none; text-transform: uppercase; }
a.button:hover,
a.button:active,
a.button:focus { background: #c79123; color: #fff; }

.container { margin: 0 auto; width: 960px; }

/* =Header ********** */

.header { background: #000; border-bottom: 10px solid #c79123; color: #fff; padding: 10px 0; }
.header .action { background: #fff; color: #000; }

.action { padding: 10px 0; overflow: hidden; }
.action h1,
.action p { display: inline-block; }
.action .call { color: #666; float: right; font-size: 0.8em; margin: 10px 20px 10px 10px; text-align: right; text-transform: uppercase; }
.action .call strong { display: block; font-size: 1.8em; }
.action .order { float: right; margin: 20px 36px 20px 0;}

/* =Content ********** */

.content { background: #fff; background: rgba(255,255,255,0.85); overflow: hidden; padding-bottom: 36px; }
.primary { width: 653px; float: right; }
.note { background: #fdfe35; margin: 1em 0; padding: 5px 20px; }
.byfor { clear: both; padding: 1em 0 0 30px; }

/* =Article ********** */

.article { float: left; margin-left: 30px; width: 326px; }
.article h1 { font-size: 1.3em; margin: 1em 0; text-transform: uppercase; }
.article h1 small { display: block; }
.article h2 { font-size: 1.2em; margin: 1em 0; }
.article h3 { font-size: 1.1em; margin: 1em 0; }
.article h4 { font-size: 1.0em; margin: 1em 0; }
.article p,
.article ul,
.article ol { font-size: 1em; margin: 1em 0; }
.article ul,
.article ol { margin-left: 18px; line-height: 1.4; }

/* =Callout ********** */

.callout { float: left; margin: 20px 20px 10px 36px; padding: 5px 20px; width: 200px; }
.callout.orange { background: #c79335; color: #000; margin-top: 0; }
.callout h1 { color: #fff; font-size: 1.1em; margin: 1em 0; }
.callout p,
.callout ul,
.callout ol { font-size: 0.9em; margin: 1em 0; }
.callout p { color: #fff; }
.callout ul,
.callout ol { margin-left: 16px; line-height: 1.2; list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAJElEQVQYGWNgoDZgRDbwPxAg8xmBAMZngjEI0dRXSMjGwSAPAO6iBAhLZDBNAAAAAElFTkSuQmCC");
}

/* =Aside ********** */

.aside { float: left; margin: 1em 0 0 36px; width: 270px; }
.aside h1 { font-size: 1.2em; margin: 1em 0; }
.aside h2 { font-size: 1.1em; margin: 1em 0; }
.aside h3 { font-size: 1.0em; margin: 1em 0; }
.aside p,
.aside ul,
.aside ol { font-size: 0.9em; margin: 1em 0; }
.aside .conference { margin: 2em 0 1em 0; text-align: center; }

/* =Form ********** */

form label { display: block; }
form input[type=text],
form input[type=email] { font-size: 1.3em; width: 99%; }
form input[type=submit] { font-size: 1.3em; margin: .5em 0; }

/* =Footer ********** */

.footer { color: #fff; margin: 20px 36px; }

/* =Responsive ********** */

@media only screen and (max-width : 980px) {
  body,
  html { background: #fff; min-width: 320px; }
  .container,
  .primary { width: auto; }
  .action { text-align: center; }
  .action h1,
  .action p { display: block; }
  .action .call,
  .action .order { float: none; text-align: center; margin: 20px 20px; }
  .action h1 img { margin: 0 auto; width: 300px; }
  .article,
  .aside { float: none; width: auto; margin: 0; padding: 0 10px; }
  .callout { float: none; width: auto; margin: 0; padding: 0 10px; }
  .callout.orange { background: #fff; }
  .callout h1,
  .callout p { color: #000; }
  .callout ul,
  .callout ol { list-style: square; }
  .byfor { padding: 1em 10px; }
  form input { max-width: 30em; }
}