body {
  margin: 0;
  font-size: 16px !important;
  font-family: 'Dosis', sans-serif !important;
  overflow-X: hidden;
}

p {
  font-size: 20px;
}

/* ============================================
// BACKGROUND
// ============================================ */

/* Pig
--------------------- */
#homepage .pig-container,
#watch .pig-container {
  width: 100%;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
}

.pig-color {
  /*background: url('../images/pig_mascot.png') no-repeat 50% 0 transparent;*/
  background: rgba(0, 0, 0, 0) url("../images/pig_mascot.png") no-repeat scroll 49.6% 40% / 350px auto;
}

.pig-bw {
  background: url('../images/pig_mascot_bw.png') no-repeat scroll 49.6% 40% / 350px auto;
}

/* ============================================
// Logo
// ============================================ */

.logo {
  width: 100%;
  text-align: center;
  z-index: 2;
  cursor: pointer;
}

.logo-color {
  max-width: 375px;
  padding: 0;
}

.logo-bw {
  max-width: 250px;
  padding: 10px 0 0;
}

/* ============================================
// MENU
// ============================================ */
.navigation {
  display: block;
  color: #000;
  margin-bottom: 10px;
  font-size: 1.5em;
}

#homepage .background-banner {
  position: relative;
}

.display-block {
  display: block !important;
}

.overlay-menu {
  background-color: rgba(255, 255, 255, .9);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  display: none;
}

.overlay-menu .options {
  position: relative;
  text-align: center;
  top: 48%;
}

.closeBtn {
  display: none !important;
}

.overlay-menu .closeBtn {
  display: block !important;
  font-size: 3em;
  margin-top: 5px;
  position: absolute;
  right: 10px;
}

.options {
  margin: 30px auto;
  padding: 0;
}

.options a {
  list-style: none;
  display: inline-block;
  padding: 0 25px;
  color: rgba(0, 0, 0, 1);
  text-align: center;
}

.options a:hover {
  text-decoration: none;
  color: #E60000;
}

.options a > i {
  font-size: 2em;
}

.options a > span {
  display: block;
  margin-top: 10px;
  font-size: 1em;
  text-transform: uppercase;
}

#gigs .active {
  background-color: #e1ffde;
}

.odd {
  background-color: #eee;
}

.media {
  border: 1px solid #aaa;
  padding: 1px;
  cursor: pointer;
}

.media:hover {
  background-color: #ccc;
}

/* ============================================
// HEADINGS
// ============================================ */

/* Labels
---------------------------- */
.heading-red-label {
  text-align: center;
  text-transform: uppercase;
  padding: 10px 0;
  width: 290px;
  background-color: #E60000;
  color: #fff;
  margin: 20px auto;
  margin-top: 20px;
  margin-bottom: 20px;
}

/* ============================================
// VIDEO PAGE
// ============================================ */

#videos h2 {
  font-size: 1.2em;
  margin: 5px 0 0 7px;
}

#videos img {
  cursor: pointer;
}

#videos img:hover {
  opacity: .3;
}

/* ============================================
// MUSIC PAGE
// ============================================ */
#music .topbanner {
  width: 100%;
  background-color: #000;
  text-align: center;
}

#music .topbanner img {
  height: 100%;
  max-height: 344px;
  max-width: 960px;
  width: 100%;
}

#music .logo-distributer {
  width: 100%;
  max-width: 244px;
  margin: 5px 0;
}

#music .logo-distributer:hover {
  opacity: .5;
}

#music .music-player-container {
  background-color: rgb(68, 68, 68);
  border: 1px solid rgb(170, 170, 170);
  margin: 0 auto;
  /*max-width: 425px;*/
  padding: 20px;
  width: 100%;
}

/* ============================================
// SLIDER
// ============================================ */

/* hack Bootstrap */
#gallery .carousel-indicators {
  left: 0;
  margin-left: -15px;
  position: relative;
  text-align: left;
  width: auto;
  bottom: 0;
}

#gallery .carousel-control .icon-prev::before,
#gallery .carousel-control .icon-next::before {
  color: rgb(255, 0, 0);
  font-size: 4em;
  line-height: 0;
}

/* Indicators images style */
.article-slide .carousel-indicators img {
  border: 2px solid #FFFFFF;
  float: left;
  height: 54px;
  left: 0;
  width: 100px;
}

#gallery .img-thumbnail {
  cursor: pointer;
}

#gallery .img-thumbnail:hover {
  opacity: .3;
}

#gallery .thumbs-container {
  border: 2px solid #aaa;
  height: 350px;
  margin-bottom: 40px;
  overflow-x: hidden;
  overflow-y: auto;
}

/* ============================================
// FOOTER
// ============================================ */

footer {
  margin-top: 40px;
  padding: 30px 0 20px;
  background-color: #000;
  color: #fff;
}

footer .social-icons {
  color: #fff;
  font-size: 1.3em;
  margin-right: 20px;
}

footer .social-icons:hover {
  color: rgb(230, 0, 0);
}


/* ============================================
// UTILITIES
// ============================================ */

/* Spacing
---------------- */
.u-spacing--20-mb {margin-bottom: 20px;}
.u-spacing--90-pt {padding-top: 90px;}

/* Border
---------------- */
.u-border-simple {
  border: 1px solid #ddd;
}