/* Style Guide */
/*  Colors: Green #006633 (rgb (0, 102, 51))
            Gold  #FFCC00 (rgb (204, 204, 0))
    Fonts:  Montserrat */

/* Global Styles */

* {
  font-family: 'Montserrat', sans-serif !important;
}

html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

section:not(#sponsorLogoSection) {
  padding-top: 5%;
  padding-bottom: 5%;
}

a:hover:not(.button) {
  color: #FFCC00 !important;
}

.active-section {
  color: #FFCC00 !important;
}

h1 {
  display: block;
  font-size: 2em;
  -webkit-margin-before: 0.67em;
  -webkit-margin-after: 0.67em;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
  font-weight: bold;
}

h2:not(.landingText) {
  display: block;
  font-size: 1.5em;
  -webkit-margin-before: 0.83em;
  -webkit-margin-after: 0.83em;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
  font-weight: bold;
}

h3 {
  display: block;
  font-size: 1.17em;
  -webkit-margin-before: 1em;
  -webkit-margin-after: 1em;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
  font-weight: bold;
}

figure figcaption h3 {
  text-align: center;
}

.sectionTitle {
  text-transform: uppercase;
  text-align: center;
  font-size: 2rem;
  font-weight: bold;
}

.button.primary {
  background-color: #006633;
  border-radius: 3px;
  font-size: 1.2rem;
}

.button.secondary {
  background-color: #FFCC00;
  border-radius: 3px;
  font-size: 1.2rem;
}

.button.primary:hover, .button.primary:focus {
  background-color: #004723;
}

.button.secondary:hover, .button.secondary:focus {
  background-color: #E5B700;
}

/* Small Top Bar Styles */

#smallNav,
#smallNav .menu,
#smallNav .menu li a {
  background-color: white;
  color: #006633;
}

#smallNav .menu-text img {
  width: 70%;
  float: left;
}

#smallNav button {
  width: 15%;
  position: absolute;
  top: 5%;
  right: 5%;
}

#smallNav button, li, li a {
  outline: none;
}

/* Landing Section Styles */

#landingSection {
  width: 100%;
  background: url('../img/min/portal-building-lightest.png');
  background-color: white;
  background-repeat: no-repeat;
  background-attachment: fixed;
  display: block;
  position: relative;
  overflow: hidden;
  background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  text-align: center;
}

#landingSection img, h2 {
  margin-bottom: 4%;
}

/* Large Top Bar Styles */

.navbar-fixed:not(#smallNav) {
  top: 0;
  z-index: 100;
  position: fixed;
  width: 100%;
}

.top-bar:not(#smallNav),
.top-bar:not(#smallNav) .menu,
.top-bar:not(#smallNav) .menu li a {
  background-color: white;
}

.top-bar:not(#smallNav) .menu li:not(.menu-text) a {
  color: #006633;
  padding-left: 20%;
}

/* Categories Section Styles */

#categoriesSection {
  background-color: #006633;
  color: white;
}

#categoriesSection figure {
  text-align: center;
}

#categoriesSection p {
}

#categoriesSection figure img {
  padding-right: 20px;
}

#categoriesSection figure img.first {
  padding-bottom: 20px;
}

#categoriesSection figure img.last {
  float: right;
}

/* Divider One Styles */

div#divider-one {
  width: 100%;
  height: 50%;
  overflow: hidden;
  background: url('../img/min/sample1.jpg');
  background-size: cover;
  background-position: top;
  position: relative;
  background-attachment: fixed;
}

/* Tracks Section Styles */

#tracksSection figure img {
  display: block;
  width: 50%;
  margin-left: auto;
  margin-right: auto;
}

/* Divider Two Styles */

div#divider-two {
  width: 100%;
  height: 50%;
  overflow: hidden;
  background: url('../img/min/sample2-min.jpg');
  background-size: cover;
  background-position: top;
  position: relative;
  background-attachment: fixed;
}

/* Perks Styles */

#perksSection figure {
  height: 475px;
  color: white;
  background-color: #006633;
  margin: 0 0 0 0;
  padding: 10%;
  vertical-align: top;
  overflow: hidden;
  box-shadow: inset 0 -215px 0 0 rgba(225, 225, 225, 0.2);
}

#perksSection figure img {
  max-width: 100%;
}

#perksSection figure figcaption h3 {
  text-align: center;
}

/* Divider Three Styles */

div#divider-three {
  width: 100%;
  height: 50%;
  overflow: hidden;
  background: url('../img/min/sample5.jpg');
  background-size: cover;
  background-position: top;
  position: relative;
  background-attachment: fixed;
}

/* Divider Four Styles */

div#divider-four {
  width: 100%;
  height: 50%;
  overflow: hidden;
  background: url('../img/min/sample4.jpg');
  background-size: cover;
  background-position: top;
  position: relative;
  background-attachment: fixed;
}

/* Sponsor Styles */

#sponsorLogoSection {
  background-color: #006633;
  color: white;
  width: 100%;
  padding-bottom: 10%;
  padding-top: 2%;
}

/* Footer Styles */

footer {
  background-color: #006633;
  color: white;
  width: 100%;
  overflow: hidden;
  clear: both;
  padding-bottom: 20px;
  text-align: center;
}

footer a {
  color: white;
}

footer #dapFooter {
  width: 100px;
}

/* Custom Responsive Styles */

@media screen and (width: 768px) {
  /* TODO: Fix responsiveness of medium landscape screen */
}