nav ul,
nav ul ul,
nav li,
nav li li {
  position: static;
  left: 0;
  list-style: none;
  padding: 0;
  margin: 0;
}



/* LAYOUT */

html {
  font-size: 100%;
}

* {
  margin: 0;
  padding: 0;
}

body {
  background-color: #EEE;
  font-family: Roboto, Ubuntu, sans-serif;
}

hr {
  margin-top: 2em;
  margin-bottom: 2em;
  margin-left: -4.5em;
  height: 0;
  border-right: 0;
  border-top: 0;
  border-bottom: 1px solid #707070;
  width: 70%;
  clear: both;
}

#flex-container,
#flex-footer,
#flex-credit {
  width: 90%;
  background-color: transparent;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

#flex-container-bg {
  width: 90%;
  background-color: #FFF;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-top: 2em;
  padding-bottom: 3em;
}

#flex-container-team {
  width: 90%;
  background-color: #FFF;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-top: 2em;
  padding-bottom: 1em;
}

#flex-container-team-member {
  width: 90%;
  background-color: #FFF;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-top: 3em;
  padding-bottom: 3em;
  margin-top: 25em;
}

#flex-container-news {
  width: 90%;
  background-color: #FFF;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-top: 2em;
  padding-bottom: 20em;
}

.flex-wrapper {
  display: flex;
  flex-wrap: wrap;
  max-width: 81.25em;
  width: 90%;
}



/* TEXT */

h1 {
  font-family: proxima-nova, Roboto, sans-serif;
  color: #FFF;
  font-size: 500%;
  line-height: 100%;
  font-weight: 300;
}

h2 {
  font-family: proxima-nova, Roboto, Ubuntu, sans-serif;
  display: block;
  color: #707070;
  font-size: 250%;
  font-weight: 300;
  padding-bottom: 0.5em;
}

h3 {
  font-family: proxima-nova, Roboto, Ubuntu, sans-serif;
  display: block;
  color: #707070;
  font-size: 200%;
  font-weight: 300;
}

h3.padding-bottom {
  font-family: proxima-nova, Roboto, Ubuntu, sans-serif;
  display: block;
  color: #707070;
  font-size: 200%;
  font-weight: 300;
  padding-bottom: 0.5em;
}

h4 {
  font-family: Ubuntu, Roboto, sans-serif;
  display: block;
  font-weight: 400;
  color: #000;
  font-size: 150%;
  padding-bottom: 0.25em;
}

h5 {
  font-family: proxima-nova, Roboto, Ubuntu, sans-serif;
  display: block;
  color: #707070;
  font-size: 250%;
  font-weight: 300;
  padding-bottom: 0.5em;
}

p {
  font-family: Ubuntu, Roboto, sans-serif;
  color: #000;
  text-align: left;
  display: block;
  font-weight: 100;
  font-size: 120%;
  line-height: 120%;
  padding-bottom: 2em;
}

p.last {
  padding-bottom: 0;
}

strong {
  font-weight: 400;
  color: rgb(21, 41, 4);
}

p.name {
  padding-bottom: 0;
  margin-top: 0.5em;
}

p.title {
  color: #707070;
  padding-bottom: 0;
  font-size: 100%;
}

p.footer {
  text-align: left;
  display: block;
  font-weight: 100;
  font-size: 100%;
  line-height: 150%;
  padding-top: 2em;
  padding-bottom: 3em;
}

p.credit {
  color: #CCC;
  padding-top: 1em;
  font-size: 90%;
}



/* HEADER */

header {
  font-family: Roboto, Ubuntu, sans-serif;
  text-align: left;
  padding-top: 3em;
  position: relative;
}

.logo {
  width: 30%;
  float: left;
}

.menu-main {
  width: 70%;
  float: right;
  text-align: right;
}

#head {
  text-align: left;
  padding-top: 15em;
  padding-bottom: 1em;
}


/* Animation */

@keyframes fadeInUp {
  from {
    transform: translate3d(0, 40px, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@-webkit-keyframes fadeInUp {
  from {
    transform: translate3d(0, 40px, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
    opacity: 1
  }
}

.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
  -webkit-animation-duration: 1s;
  -webkit-animation-fill-mode: both;
}

.animatedFadeInUp {
  opacity: 0;
}

.fadeInUp {
  opacity: 0;
  animation-name: fadeInUp;
  -webkit-animation-name: fadeInUp;
}


/* Menu */

#menu-main-fixed li,
#menu-main-fixed-rita li {
  float: right;
  list-style-type: none;
  font-family: Ubuntu, Roboto, sans-serif;
  font-size: 100%;
  clear: both;
  line-height: 100%;
  text-transform: uppercase;
  padding-bottom: 1em;
}

#menu-main-fixed li a {
  text-decoration: none;
  color: #FFF;
  display: block;
}

#menu-main-fixed li a:hover {
  text-decoration: underline;
  color: #FFF;
}

#menu-main-fixed li a:focus {
  text-decoration: underline;
  color: #FFF;
}

#menu-main-fixed li a:active {
  text-decoration: underline;
  color: #FFF;
}

#menu-page {
  text-decoration: underline;
  color: #FFF;
}

#menu-main-fixed-rita li a {
  text-decoration: none;
  color: #CCC;
  display: block;
}

#menu-page-rita {
  text-decoration: underline;
  color: #CCC;
}



/* ABOUT */

.back-about {
  background-image: url(images/about.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}


/* FOOTER */

#contact {
  flex: 1 0 45%;
}



/* CREDIT */

#flex-credit a {
  text-decoration: none;
  color: #A9A9A9;
}



/* PHILOSOPHY */

.back-philosophy {
  background-image: url(images/philosophy.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

section {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.media {
  min-width: 0;
  margin: 5px;
}

img.model {
  width: 1300px;
  max-width: 100%;
  max-height: 90px;
}



/* PARTNERS */

.back-partners {
  background-image: url(images/partners.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.partners-logo {
  border: 1px solid #CCC;
  margin: 5px;
  width: 100%;
  height: auto;
  flex: 0 0 21%;
}

.partners-logo-empty {
  border: 1px solid #FFF;
  margin: 5px;
  width: 100%;
  height: auto;
  flex: 0 0 21%;
}

img.partners {
  display: block;
  border: 0;
  width: 100%;
  height: 100%;
}



/* TEAM */

.back-team {
  background-image: url(images/team.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.team-member {
  border: 0;
  margin: 5px 5px 32px;
  width: 300px;
  height: auto;
  flex: 1 0 21%;
}

.team-member-empty {
  border: 0;
  margin: 5px 5px 0px;
  width: 300px;
  height: auto;
  flex: 1 0 21%;
}

img.headshot {
  display: block;
  position: relative;
  border: 0;
  width: 100%;
  height: 100%;
}

a.team-member-bio {
  display: block;
  text-decoration: none;
  position: relative;
}

.hover-photo {
  color: #FFF;
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  background-color: rgba(0, 0, 0, .6);
  transition: opacity .3s linear;
}

.hover-photo:hover {
  opacity: 1;
}

.hover-photo span {
  text-align: center;
  display: block;
  width: 100%;
  margin-top: 40%;
}



/* TEAM MEMBER */

.back-duck {
  background-image: url(images/duck-bg.jpg);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-lake {
  background-image: url(images/lake-bg.jpg);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-fall {
  background-image: url(images/fall-bg.jpg);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-ducks {
  background-image: url(images/ducks-bg.jpg);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-dominick {
  background-image: url(images/dominick-bg.jpg);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-bryan {
  background-image: url(images/bryan-bg.jpg);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-chris {
  background-image: url(images/chris-bg.jpg);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-ken {
  background-image: url(images/any-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-steve-hightower {
  background-image: url(images/steve-hightower-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-erik {
  background-image: url(images/erik-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-liz {
  background-image: url(images/liz-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-brian {
  background-image: url(images/brian-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-roy {
  background-image: url(images/roy-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-don {
  background-image: url(images/don-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-roger {
  background-image: url(images/roger-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-owen {
  background-image: url(images/owen-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-stephen {
  background-image: url(images/stephen-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-ben {
  background-image: url(images/ben-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-kelly {
  background-image: url(images/kelly-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-frank {
  background-image: url(images/frank-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-scott {
  background-image: url(images/scott-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-rita {
  background-image: url(images/rita-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-cale {
  background-image: url(images/cale-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-matt {
  background-image: url(images/matt-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-josh {
  background-image: url(images/josh-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-travis {
  background-image: url(images/travis-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-steve-johnson {
  background-image: url(images/steve-johnson-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-randy {
  background-image: url(images/randy-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-marine {
  background-image: url(images/marine.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-camping {
  background-image: url(images/camping.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.back-any {
  background-image: url(images/any-bg.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.team-member-left {
  flex: 28%;
  padding-right: 1em;
}

img.member {
  width: 100%;
  height: auto;
  margin-top: 0.75em;
  margin-bottom: 1em;
}

.team-member-right {
  flex: 68%;
  padding-left: 1em;
  border-left: 1px solid #707070;
}

.top,
.bottom {
  width: 100%;
  float: none;
  flex: 100%;
}

span.territory {
  font-weight: 400;
}

span.e-mail {
  color: rgb(21, 41, 4);
}



/* NEWS */

.back-news {
  background-image: url(images/news.png);
  background-color: #EEE;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100% auto;
  max-height: 1000px;
}

.prev {
  border-right: 1px solid rgb(21, 41, 4);
  padding-right: 10px;
  color: rgb(21, 41, 4);
}

.next {
  padding-left: 10px;
  color: rgb(21, 41, 4);
}

a {
  color: rgb(21, 41, 4);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}



/* MEDIA QUERIES */

@media (max-width: 1200px) {

  .back-about {
    background-image: url(images/about-1300.png);
  }

  .back-philosophy {
    background-image: url(images/philosophy-1300.png);
  }

  .back-partners {
    background-image: url(images/partners-1300.png);
  }

  .back-team {
    background-image: url(images/team-1300.png);
  }

  .back-news {
    background-image: url(images/news-1300.png);
  }

  .back-duck {
    background-image: url(images/duck-bg-1300.jpg);
  }

  .back-lake {
    background-image: url(images/lake-bg-1300.jpg);
  }

  .back-fall {
    background-image: url(images/fall-bg-1300.jpg);
  }

  .back-ducks {
    background-image: url(images/ducks-bg-1300.jpg);
  }

  .back-dominick {
    background-image: url(images/dominick-bg-1300.jpg);
  }

  .back-bryan {
    background-image: url(images/bryan-bg-1300.jpg);
  }

  .back-chris {
    background-image: url(images/chris-bg-1300.jpg);
  }

  .back-ken {
    background-image: url(images/aaron-bg-1300.png);
  }

  .back-steve-hightower {
    background-image: url(images/steve-hightower-bg-1300.png);
  }

  .back-erik {
    background-image: url(images/erik-bg-1300.png);
  }

  .back-liz {
    background-image: url(images/liz-bg-1300.png);
  }

  .back-brian {
    background-image: url(images/brian-bg-1300.png);
  }

  .back-don {
    background-image: url(images/don-bg-1300.png);
  }

  .back-roger {
    background-image: url(images/roger-bg-1300.png);
  }

  .back-owen {
    background-image: url(images/owen-bg-1300.png);
  }

  .back-stephen {
    background-image: url(images/stephen-bg-1300.png);
  }

  .back-roy {
    background-image: url(images/roy-bg-1300.png);
  }

  .back-ben {
    background-image: url(images/ben-bg-1300.png);
  }

  .back-kelly {
    background-image: url(images/kelly-bg-1300.png);
  }

  .back-frank {
    background-image: url(images/frank-bg-1300.png);
  }

  .back-scott {
    background-image: url(images/scott-bg-1300.png);
  }

  .back-rita {
    background-image: url(images/rita-bg-1300.png);
  }

  .back-cale {
    background-image: url(images/cale-bg-1300.png);
  }

  .back-matt {
    background-image: url(images/matt-bg-1300.png);
  }

  .back-josh {
    background-image: url(images/josh-bg-1300.png);
  }

  .back-travis {
    background-image: url(images/travis-bg-1300.png);
  }

  .back-steve-johnson {
    background-image: url(images/steve-johnson-bg-1300.png);
  }

  .back-randy {
    background-image: url(images/randy-bg-1300.png);
  }

  .back-marine {
    background-image: url(images/marine-1300.png);
  }

  .back-camping {
    background-image: url(images/camping-1300.png);
  }

  .back-any {
    background-image: url(images/any-bg-1300.png);
  }

  .team-member-left {
    flex: 35%;
  }

  .team-member-right {
    flex: 60%;
  }

}



@media (max-width: 960px) {

  h1 {
    font-size: 400%;
  }

  .team-member-right {
    flex: 100%;
    padding-left: 0;
    border-left: none;
  }

  team-member-left {
    padding-right: 1em;
  }

  .top {
    width: 45%;
    float: left;
  }

  .bottom {
    width: 54%;
    float: right;
  }

  img.member {
    margin-top: 0;
    width: 95%;
  }

  #flex-container-team-member {
    padding-bottom: 0;
    margin-top: 15em;
  }

}



@media (max-width: 810px) {

  .partners-logo,
  .partners-logo-empty,
  .team-member,
  .team-member-empty {
    width: 200px;
    height: auto;
    flex: 1 0 30%;
  }

  #head {
    padding-top: 5em;
  }

  #flex-container-bg {
    padding-bottom: 2em;
  }

  #flex-container-team,
  #flex-container-news {
    padding-bottom: 0;
  }

}



@media (max-width: 760px) {

  h5 {
    padding-bottom: 0.5em;
  }

  hr {
    width: 100%;
  }

  .back-philosophy {
    background-image: url(images/philosophy-mobile.png);
  }

  .back-team {
    background-image: url(images/team-mobile.png);
  }

}


@media (max-width: 620px) {

  html {
    font-size: 90%;
  }

  .back-about {
    background-image: url(images/about-mobile.png);
  }

  .back-partners {
    background-image: url(images/partners-mobile.png);
  }

  .back-news {
    background-image: url(images/news-mobile.png);
  }

  .back-duck {
    background-image: url(images/duck-bg-mobile.jpg);
  }

  .back-lake {
    background-image: url(images/lake-bg-mobile.jpg);
  }

  .back-fall {
    background-image: url(images/fall-bg-mobile.jpg);
  }

  .back-ducks {
    background-image: url(images/ducks-bg-mobile.jpg);
  }

  .back-dominick {
    background-image: url(images/dominick-bg-mobile.jpg);
  }

  .back-bryan {
    background-image: url(images/bryan-bg-mobile.jpg);
  }

  .back-chris {
    background-image: url(images/chris-bg-mobile.jpg);
  }

  .back-ken {
    background-image: url(images/aaron-bg-mobile.png);
  }

  .back-steve-hightower {
    background-image: url(images/steve-hightower-bg-mobile.png);
  }

  .back-erik {
    background-image: url(images/erik-bg-mobile.png);
  }

  .back-liz {
    background-image: url(images/liz-bg-mobile.png);
  }

  .back-brian {
    background-image: url(images/brian-bg-mobile.png);
  }

  .back-roy {
    background-image: url(images/roy-bg-mobile.png);
  }

  .back-don {
    background-image: url(images/don-bg-mobile.png);
  }

  .back-roger {
    background-image: url(images/roger-bg-mobile.png);
  }

  .back-owen {
    background-image: url(images/owen-bg-mobile.png);
  }

  .back-stephen {
    background-image: url(images/stephen-bg-mobile.png);
  }

  .back-ben {
    background-image: url(images/ben-bg-mobile.png);
  }

  .back-kelly {
    background-image: url(images/kelly-bg-mobile.png);
  }

  .back-frank {
    background-image: url(images/frank-bg-mobile.png);
  }

  .back-scott {
    background-image: url(images/scott-bg-mobile.png);
  }

  .back-rita {
    background-image: url(images/rita-bg-mobile.png);
  }

  .back-cale {
    background-image: url(images/cale-bg-mobile.png);
  }

  .back-matt {
    background-image: url(images/matt-bg-mobile.png);
  }

  .back-josh {
    background-image: url(images/josh-bg-mobile.png);
  }

  .back-travis {
    background-image: url(images/travis-bg-mobile.png);
  }

  .back-steve-johnson {
    background-image: url(images/steve-johnson-bg-mobile.png);
  }

  .back-randy {
    background-image: url(images/randy-bg-mobile.png);
  }

  .back-marine {
    background-image: url(images/marine-mobile.png);
  }

  .back-camping {
    background-image: url(images/camping-mobile.png);
  }

  .back-any {
    background-image: url(images/any-bg-mobile.png);
  }

  .partners-logo,
  .partners-logo-empty,
  .team-member,
  .team-member-empty {
    width: 200px;
    height: auto;
    flex: 1 0 45%;
  }

  .logo,
  .menu-main {
    width: 50%;
  }

  .team-member-left {
    flex: 100%;
    padding-right: 0;
  }

  img.member {
    margin-top: 0;
  }

  #flex-container-team-member {
    padding-top: 2em;
  }

  h5 {
    padding-bottom: 0.25em;
  }

}



@media (max-width: 430px) {

  header {
    padding-top: 2em;
  }

  #head {
    padding-top: 2em;
  }

  h1 {
    font-size: 250%;
    font-weight: 300;
  }

  h3 {
    font-size: 150%;
    color: #000;
  }

  p.footer {
    font-size: 90%;
  }

  #contact {
    padding-bottom: 1em;
  }

  .top,
  .bottom {
    width: 100%;
    float: none;
  }

  img.member {
    width: 100%;
  }

  #flex-container-team-member {
    margin-top: 12em;
  }

}