@charset "UTF-8";
/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

body {
  line-height: 1; }

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

nav ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none; }

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold; }

del {
  text-decoration: line-through; }

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0; }

input, select {
  vertical-align: middle; }

/* Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS.  */
html {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }

/*  apply a natural box layout model to all elements  */
* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

body, p, h1, h2, h3, h4, h5, h6 {
  padding: 0;
  margin: 0; }

body {
  font-family: "Source Sans Pro", sans-serif;
  font-weight: 400;
  font-size: 16px; }

div#headerWrapper {
  background-color: #d3d3d3; }

header {
  height: 110px;
  position: relative; }
  header figure.logo {
    position: absolute;
    bottom: 0;
    left: 2%;
    margin: auto; }
  header h1 {
    padding-top: 2%;
    font-size: 2rem;
    color: #191970;
    font-weight: 400;
    margin-left: 15%;
    text-align: center; }
  header h2 {
    font-size: 1.4rem;
    color: #191970;
    margin-left: 15%;
    text-align: center; }
  header ul.social {
    float: right;
    padding: .5rem;
    margin-bottom: .5rem; }
  header ul.social li {
    list-style-type: none;
    float: left; }
  header ul.social li a {
    font-size: 1.8rem;
    padding-left: .5rem;
    color: white; }
  header ul.social li a:hover {
    color: #800000; }

div#navWrapper {
  background-color: #8B0000;
  border-bottom: 1px solid rgba(0, 0, 0, 0.3); }

nav ul li a {
  display: block;
  text-align: center;
  font-weight: 700;
  padding: .5rem 0;
  color: #9f9fe9;
  text-decoration: none;
  transition: background 0.75s ease, color 0.75s ease; }
nav ul li.active a {
  background-color: #cd0000; }
nav ul li a:hover {
  color: #101046;
  background-color: #d3d3d3; }

main {
  padding-bottom: 1rem;
  /* HTML Validation */ }
  main h1 {
    font-size: 1.5rem;
    margin: 0.75rem 0 0 2%;
    color: #b30000; }
  main h2 {
    font-size: 1.2rem;
    margin: 0.75rem 0 0 2%;
    color: #ededed;
    padding-bottom: 1rem; }
  main p {
    margin: 0.5rem 2%;
    color: black; }
  main form#swag {
    margin: 1em 3%; }
    main form#swag fieldset {
      background-color: #d3d3d3;
      border-radius: .8rem;
      margin: 1.5em 0;
      border: white solid 1px;
      /* Customize the label (the container) */
      /* Hide the browser's default radio button */
      /* Create a custom radio button */
      /* On mouse-over, add a grey background color */
      /* When the radio button is checked, add a blue background */
      /* Create the indicator (the dot/circle - hidden when not checked) */
      /* Show the indicator (dot/circle) when checked */
      /* Style the indicator (dot/circle) */ }
      main form#swag fieldset legend {
        color: #800000;
        margin-left: 6%;
        padding: .5rem;
        font-size: .9rem; }
      main form#swag fieldset label {
        display: block;
        margin: .5em; }
      main form#swag fieldset label span {
        display: block;
        color: #191970;
        padding-top: .9rem;
        padding-bottom: .2em; }
      main form#swag fieldset .container {
        display: block;
        position: relative;
        padding-left: 35px;
        margin-bottom: 12px;
        cursor: pointer;
        font-size: 22px;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none; }
      main form#swag fieldset .container input {
        position: absolute;
        opacity: 0; }
      main form#swag fieldset .checkmark {
        position: absolute;
        top: 0;
        left: 0;
        height: 25px;
        width: 25px;
        background-color: #eee;
        border-radius: 50%; }
      main form#swag fieldset .container:hover input ~ .checkmark {
        background-color: #ccc; }
      main form#swag fieldset .container input:checked ~ .checkmark {
        background-color: #2196F3; }
      main form#swag fieldset .checkmark:after {
        content: "";
        position: absolute;
        display: none; }
      main form#swag fieldset .container input:checked ~ .checkmark:after {
        display: block; }
      main form#swag fieldset .container .checkmark:after {
        top: 9px;
        left: 9px;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: white; }
    main form#swag input.submitBtn {
      -webkit-appearance: none;
      color: #d3d3d3;
      border: solid 1px black;
      border-radius: 7px;
      width: 50%;
      margin: .5em 0;
      font-size: 2em;
      padding: .6rem;
      background: #8B0000; }
  main label input {
    background-color: white;
    color: #191970;
    padding: .3em .3em .3em 2em;
    border: solid 1px white;
    border-radius: 8px;
    font-size: .9em;
    width: 90%;
    max-width: 500px;
    background-image: url(../images/ico_validation.png);
    background-repeat: no-repeat;
    background-position: 4px -11px; }
  main input:focus {
    box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.5) inset; }
  main input:required {
    background-position: 4px -61px; }
  main input:focus:invalid {
    background-position: 4px -111px; }
  main input:required:valid {
    background-color: white;
    background-position: 4px -161px; }

div#footerWrapper {
  background-color: #800000; }

footer {
  width: 100%; }
  footer p {
    text-align: center;
    color: #191970;
    padding: .75rem 0;
    font-size: .9rem; }

.keepOpen {
  clear: both; }

.clearfix:after {
  content: "";
  display: table;
  clear: both; }

/*Change the menubar color on line 23 */
/*Change the dropdown menu color on line 49*/
/*If you have a light background color then change the background image on lines 30 and 37 to load menuOpenBlack and menuCloseBlack*/
/*Adjust the media query max-width value on line 12 to match your breakpoint between the small and medium screens OR between the medium and large screens*/
/*  apply a natural box layout model to all elements  */
* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

#hamburgerBtn {
  display: none; }

/* hide the navigation button by default */
@media only screen and (max-width: 64rem) {
  /* Navigation Button  -------------------------------------------------------- */
  body {
    padding-top: 50px; }

  nav {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2.75rem;
    background-color: #8B0000;
    /* change the menu color */ }

  #hamburgerBtn {
    display: block;
    width: 7rem;
    height: 2.75rem;
    background-image: url("../images/menuOpenWhite.png");
    background-color: rgba(0, 0, 0, 0.1);
    background-position: 2vw center;
    background-repeat: no-repeat;
    border: 0 none; }

  #hamburgerBtn.open {
    background: url("../images/menuCloseWhite.png");
    background-position: 2vw center;
    background-repeat: no-repeat; }

  /* Navigation Bar -------------------------------------------------------- */
  #primaryNav {
    height: 0;
    overflow: hidden;
    width: 20rem;
    background-color: #8B0000;
    /* change the menu color */
    margin: 0;
    padding: 0;
    z-index: 998;
    font-family: Verdana;
    font-weight: normal; }

  #primaryNav li.active a {
    background-color: rgba(0, 0, 0, 0.25); }

  #primaryNav li a {
    display: block;
    width: 100%;
    padding: .75rem 2vw;
    font-size: 14px;
    text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.15);
    color: white;
    text-decoration: none;
    border-top: 1px solid rgba(0, 0, 0, 0.2); }

  #primaryNav li a:hover {
    background-color: rgba(0, 0, 0, 0.5); }

  /* Toggle the navigation bar to expand down  */
  #primaryNav.open {
    height: auto; }

  /* Submenus – optional .parent class indicates dropdowns */
  #primaryNav > li:hover > a {
    background: rgba(0, 0, 0, 0.5); }

  #primaryNav li.parent > a:after {
    font-size: .75rem;
    content: "\25BC";
    color: rgba(255, 255, 255, 0.5);
    float: right; }

  #primaryNav li.parent > a:hover {
    background: rgba(0, 0, 0, 0.75); }

  /*hide the sub menu items by default*/
  #primaryNav li ul {
    display: none;
    background: rgba(0, 0, 0, 0.3);
    padding: 0; }

  #primaryNav li ul a {
    border-top: solid 1px rgba(0, 0, 0, 0.2);
    font-size: 12px;
    padding: 10px 5%;
    font-weight: normal; }

  #primaryNav li:hover ul {
    display: block; } }
/* End Mobile Styles */
@media only screen and (min-width: 560px) {
  header h1 {
    padding-top: 2%;
    font-size: 2rem;
    color: #191970;
    font-weight: 400;
    margin-left: 20%;
    text-align: left; }
  header h2 {
    font-size: 1.4rem;
    color: #191970;
    margin-left: 20%;
    text-align: left; }
  header ul.social li a {
    font-size: 2.5rem; }

  main .medium-1 {
    width: 8.3333333333%;
    float: left; }
  main .medium-2 {
    width: 16.6666666667%;
    float: left; }
  main .medium-3 {
    width: 25%;
    float: left; }
  main .medium-4 {
    width: 33.3333333333%;
    float: left; }
  main .medium-5 {
    width: 41.6666666667%;
    float: left; }
  main .medium-6 {
    width: 50%;
    float: left; }
  main .medium-7 {
    width: 58.3333333333%;
    float: left; }
  main .medium-8 {
    width: 66.6666666667%;
    float: left; }
  main .medium-9 {
    width: 75%;
    float: left; }
  main .medium-10 {
    width: 83.3333333333%;
    float: left; }
  main .medium-11 {
    width: 91.6666666667%;
    float: left; }
  main .medium-12 {
    width: 100%;
    float: left; } }
@media only screen and (min-width: 64.0625rem) {
  nav ul {
    margin-left: 2%;
    border-left: 1px solid rgba(0, 0, 0, 0.2); }
  nav ul li {
    float: left; }
  nav ul li a {
    display: block;
    border: none;
    border-right: 1px solid rgba(0, 0, 0, 0.2);
    background: none;
    font-size: .9em;
    padding: .7em .9em;
    color: white;
    text-decoration: none;
    /*transition*/
    -webkit-transition: background 0.3s linear;
    transition: background 0.3s linear; }
  nav ul li a:hover {
    background: #720000; }
  nav ul li ul {
    /*rules for the sub menu items*/
    z-index: 99;
    position: absolute;
    background-color: #be0000;
    left: -999em;
    /* pushes the menu way off to the side */
    width: 10em; }
  nav ul li ul li {
    /* overides the float and line from the parent ul */
    float: none;
    border-right: none;
    border-top: solid 1px rgba(0, 0, 0, 0.2); }
  nav ul li:hover ul {
    /* this displays the menus as drop downs  */
    left: auto;
    margin-left: 0; }

  main .large-1 {
    width: 8.3333333333%;
    float: left; }
  main .large-2 {
    width: 16.6666666667%;
    float: left; }
  main .large-3 {
    width: 25%;
    float: left; }
  main .large-4 {
    width: 33.3333333333%;
    float: left; }
  main .large-5 {
    width: 41.6666666667%;
    float: left; }
  main .large-6 {
    width: 50%;
    float: left; }
  main .large-7 {
    width: 58.3333333333%;
    float: left; }
  main .large-8 {
    width: 66.6666666667%;
    float: left; }
  main .large-9 {
    width: 75%;
    float: left; }
  main .large-10 {
    width: 83.3333333333%;
    float: left; }
  main .large-11 {
    width: 91.6666666667%;
    float: left; }
  main .large-12 {
    width: 100%;
    float: left; } }

/*# sourceMappingURL=styles.css.map */