html {
  font-size: 80%;
  height: 100%;
  width: 100%;
}

body {
  font-family: 'Ubuntu', sans-serif;
  color: #000;
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
  /*background: #EFF1F1;*/
  background: #fff;
  -webkit-font-smoothing: antialiased;
}

p,h1,h2,h3,h4,h5,span,li,a,input {font-family: 'Ubuntu', sans-serif;}

/*------------------------------------*\
    GENERAL
\*------------------------------------*/

/* Middle row: How to Enter*/
.box1 {
float: left;
margin-left: 0%;
clear: none;
width: 100%;
padding: 2.5%;
/*margin-bottom: 99.25px;*/
color: #fff;
background-color: #1e1c1c;
}

.box2 {
float: left;
margin-left: 0%;
clear: none;
min-width: 100%;
padding: 2.5%;
padding-top: 50px;
color: #000;
/*background-color: blue;*/

}

/*For alternative text and image: BTB logo + "Presented by..."*/
.alt-banner {
  position: fixed; 
  top: -50%; 
  left: -50%; 
  width: 200%; 
  height: 200%;
  background-color: #1e1c1c;
}
.alt-banner img {
  position: absolute; 
  top: 0; 
  left: 0; 
  right: 0; 
  bottom: 0; 
  margin: auto; 
  min-width: 50%;
  min-height: 50%;
}

.alt-banner-container {
  float: left;
  margin-left: 0%;
  clear: none;
  width: 100%;
  padding: 2.5%;
  background-color: #1e1c1c;
}

.panel {
  margin-top: 75px;
}


img.logo {
  max-width: 160px;
  margin-top: 10px;
  margin-bottom: 20px;
}

img {
  z-index: 0;
}

/* max-width 640px, mobile-only styles */
@media only screen and (max-width: 40em) {
  img.logo {
    max-width: 100px;
    margin-bottom: 20px;
  }
  
  h1.alt-banner-text {
    text-align: left;
    font-size: 2.1rem;
    font-weight: bold;
    /*padding-top: 15px;*/
    color: #fff;
    vertical-align: middle;

  }
}

p {
  font-size: 1.3rem;  
}

p.cap {
  text-align: center;
  font-size: 1.2rem;
}

p.sub {
  text-transform: uppercase;
  font-weight: bold;
  font-size: 0.9rem;
}
p.sml {
  font-size: 0.9rem;
}


li.sml {
  font-size: 0.9rem;
}

.panel h2, h2 {
  /*color: #D78C23;*/
  color: #8e7226;
  font-weight: bold;
  font-size: 1.6875rem;
}

@media only screen and (max-width: 40em) {
  .panel h2, h2 {
  /*color: #D78C23;*/
  color: #8e7226;
  font-weight: bold;
  font-size: 1.6875rem;
}
}

a {
  /*color: #D78C23;*/
  color: #8e7226;
}

a:hover {
  color: #000;
}

a:link {
  color: #8e7226;
}


/*------------------------------------*\
    NAVIGATION (Header)
\*------------------------------------*/
/* Wrapped around .top-bar to contain to grid width */
.contain-to-grid {
  width: 100%;
  background: #1e1c1c; }

.top-bar {
  background: #1e1c1c;
  height: 2.8125rem;
  line-height: 2.8125rem;
  margin-bottom: 0;
  overflow: hidden;
  position: relative; 
}

.top-bar .name h1 a {
  font-size: 1.5rem;
  /*color: #D78C23;*/
  color: #8e7226;
  font-weight: bold;
}

.top-bar-section li:not(.has-form) a:not(.button) {
    /*padding: 10px 15px;*/
    background: #1e1c1c;
    text-align: center;
    font-size: 1.1rem;
    letter-spacing: 1px;    
    text-transform: uppercase;
    font-weight: bold;
    /*padding-left: 25px;*/
}


@media only screen and (max-width: 50em) {
  .top-bar-section li:not(.has-form) a:not(.button):hover {
    background: #1e1c1c;
  }
  .top-bar-section li:not(.has-form) a:not(.button) {
    width: 100%;
    display: block;
    clear: both;
    /*padding-left: 30px;  */
  }
}


/*------------------------------------*\
    SCROLL DOWN BUTTON ANIMATION
\*------------------------------------*/
img.down {
  position: absolute;
  padding-left: 50%;
  bottom: 100px;
  opacity: .8;
  text-align: center;  
}

.floating{
    float: left;
    -webkit-animation-name: Floatingx;
    -webkit-animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -moz-animation-name: Floating;
    -moz-animation-duration: 3s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: ease-in-out;
    /*margin-left: 30px;*/
    /*margin-top: 5px;*/
    margin-left: -20px;
}

@-webkit-keyframes Floatingx{
    from {-webkit-transform:translate(0, 0px);}
    65% {-webkit-transform:translate(0, 15px);}
    to {-webkit-transform: translate(0, -0px);    }    
}
    
@-moz-keyframes Floating{
    from {-moz-transform:translate(0, 0px);}
    65% {-moz-transform:translate(0, 15px);}
    to {-moz-transform: translate(0, -0px);}    
}

/*------------------------------------*\
    RETURN TO TOP
\*------------------------------------*/
.scroll-top-wrapper {
    position: fixed;
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
  text-align: center;
  z-index: 99999999;
    background-color: #777777;
  color: #eeeeee;
  width: 50px;
  height: 50px;
  line-height: 48px;
  right: 30px;
  bottom: 30px;
  padding-top: 2px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
.scroll-top-wrapper:hover {
  background-color: #888888;
}
.scroll-top-wrapper.show {
    visibility:visible;
    cursor:pointer;
  opacity: 1.0;
}
.scroll-top-wrapper i.fa {
  line-height: inherit;
}

/*------------------------------------*\
    BUTTONS
\*------------------------------------*/
button, .button {
  -webkit-appearance: none;
  -moz-appearance: none;
  border-radius: 0;
  border-style: solid;
  border-width: 0;
  cursor: pointer;
  font-weight: normal;
  line-height: normal;
  margin: 4.5rem 0 1.25rem;
  position: relative;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  padding: 1rem 2rem 1.0625rem 2rem;
  font-size: 1.3rem;
  background-color: #a01919;
  /*background-color: transparent;*/
  /*border-style: solid;
  border-width:2px;
  border-color: #770e1f;*/
  color: #FFFFFF;
  transition: background-color 300ms ease-out;
}

button:hover, button:focus, .button:hover, .button:focus {
    background-color: #770e1f; 
}

button:hover, button:focus, .button:hover, .button:focus {
  color: #FFFFFF; 
}

h3.readMore {
  color: #fff;
  /*color: #FFC800;*/
  opacity: 1;
  /*display: block;*/
  /*margin-bottom: 20px;*/
  /*font-size: 1.2rem;*/
  position: absolute;
  bottom: 0;
  padding-left: 25%;
  font-weight: bold;
  bottom: 100px;
  text-align: center;
  float: none;
  clear: both;  
}


/*------------------------------------*\
    FOOTER
\*------------------------------------*/
footer {
  float: left;
  margin-top: 75px;
  clear: none;
  width: 100%;
  padding-top: 20px;
  padding-bottom: 10px;
  background-color: #1e1c1c;

}

p.foot {
  color: #fff;
  font-size: 0.9rem;
  line-height: 15px;
  text-align: left;
}

@media only screen and (max-width: 40em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
  p.foot {
    text-align: center;
  }
  footer {
    float: none;
    text-align: center;
  }
}


/*------------------------------------*\
    PURE CSS PARALAX EFFECT
\*------------------------------------*/
/* ============================================================
  PRIMARY STRUCTURE
============================================================ */
.container {
  max-width: 960px;
  margin: 0 auto;
}
/* ============================================================
  SECTIONS
============================================================ */
section.module:last-child {
  margin-bottom: 0;
}
section.module h2 {
  margin-bottom: 40px;
  /*font-family: "Open Sans", sans-serif;*/
  font-family: 'Ubuntu', sans-serif;
  font-size: 30px;
  font-weight: bold
}
section.module p {
  margin-bottom: 40px;
  font-size: 16px;
  font-weight: 300;
}
section.module p:last-child {
  margin-bottom: 0;
}
section.module.content {
  padding: 40px 0;
}
section.module.parallax {
  /*height: 1000px;*/
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;

  /*position: absolute;*/
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-position: center center;
}
section.module.parallax h1 {
  color: rgba(255, 255, 255, 0.8);
  font-size: 0px;
  line-height: 40px;
  letter-spacing: 1px;
  font-weight: 700;
  text-align: left;
  /*text-transform: uppercase;*/
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  padding: 30px;
}
section.module.parallax-1 {
  background-image: url("../img/winbeerglass.jpg");
}
/*section.module.parallax-2 {
  background-image: url("../img/demo/_small/2.jpg");
}
section.module.parallax-3 {
  background-image: url("../img/demo/_small/3.jpg");
}*/

@media all and (min-width: 643px) {
  section.module h2 {
    font-size: 60px;
  }
  section.module p {
    font-size: 20px;
  }
  section.module.parallax h1 {
    font-size: 30px;
    margin-left: 140px;
  }
}
@media all and (min-width: 960px) {
  section.module.parallax h1 {
    font-size: 35px;    
  }
}


/*------------------------------------*\
    SOCIAL MEDIA
\*------------------------------------*/
img.icon {
  padding-left:10px;
  padding-bottom: 10px;
  float: right;
  max-width: 35px;
  z-index: 99;
}

@media only screen and (max-width: 643px) {
  img.icon {
    padding-left:0px;
    padding-right: 10px;
    padding-bottom: 10px;
    float: none;
    max-width:35px;
  }
}

p.tweetThis{
  /*border-top: 1px solid #fff;*/
  padding-top: 30px;
  text-align: center;
  font-size: 1.3rem;
  font-weight: bold;
  /*text-transform: uppercase;*/
  color: inherit;
}

@media only screen and (max-width: 40em) {
  p.tweetThis{
    border-top: 1px solid #fff;
  }
}

p.tweetThis:hover{
  color: white;
  border-color: #fff
}

img.twitter {
  position: relative;
  text-align: center;
  display: inline-block;
  padding: 1rem 2rem 1.0625rem 2rem;
  max-width: 125px;
}

img.char {
  float: right;
  max-height: 300px;
}

.instagram-feed-lrg {
  position: relative;
  display: inline-block;
  float: left;
  z-index: 99;
}

.instagram-feed-med {
  position: relative;
  display: inline-block;
  float: left;
  z-index: 99;
}

.instagram-feed-sml {
  position: relative;
  display: inline-block;
  float: left;
  z-index: 99;
}

.instagram-feed-xsml {
  position: relative;
  display: inline-block;
  float: left;
  z-index: 99;
}



/*Large screens*/
@media only screen and (min-width: 50.51em) { 
  .instagram-feed-med {
    display: none;
  }
  .instagram-feed-sml {
    display: none;
  }
  .instagram-feed-xsml {
    display: none;
  }
} /* min-width 800px, large screens */

/*Medium Screen*/
@media only screen and (min-width: 40.063em) and (max-width: 50.5em) { 
  .instagram-feed-lrg {
    display: none;
  }
  .instagram-feed-sml {
    display: none;
  }
  .instagram-feed-xsml {
    display: none;
  }
} /* min-width 641px and max-width 800px, use when QAing tablet-only issues */

/*Small Screen*/
@media only screen and (min-width: 31.063em) and (max-width: 40em) { 
  .instagram-feed-lrg {
    display: none;
  }
  .instagram-feed-med {
    display: none;
  }
  .instagram-feed-xsml {
    display: none;
  }
} /* min-width 497px and min-width 640px, mobile-only styles, use when QAing mobile issues */

/*X-Small Screen*/
@media only screen and (max-width: 31em) { 
  .instagram-feed-lrg {
    display: none;
  }
  .instagram-feed-med {
    display: none;
  }
  .instagram-feed-sml {
    display: none;
  }
} /* max-width 496px, mobile-only styles, use when QAing mobile issues */