body {
  height: auto!important;
}

body #parent {
  width: 100%;
  height: calc(100% - 51px);
  border: none;
  background-color: #fff;
  position: absolute;
  top: 51px;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
  z-index: -1;
}

.video-body {
  background-image: radial-gradient(circle, #ffd400, #f07d42, #a84557, #4a2942, #010101);
}

.custom-navbar {
  background-color: black !important;
  box-shadow: 0px 2px 4px black;
  height: 51px!important;
}

.custom-navbar .navbar-header {
  float: left;
  margin-right: 0px!important;
}

.custom-navbar .navbar-header .navbar-brand {
  display: flex;
  align-items: center;
  height: 48px;
  padding: 0;
}

.custom-navbar .navbar-nav {
  float: left;
  display: inline-block;
  margin-left: 0px;
}

.custom-navbar .navbar-nav li {
  display: inline-block;
}

.container-flex {
  display: flex;
  align-items: center;
  min-height: 100vh;
  padding-top: 70px;
}

.selectorContainer {
  text-align: center;
  width: 100%;
}

.selectorContainer h2 {
  color: #ffd702;
}

.selectorForm {
  /*background-color: white;
  display: block;
  height: 100px;
  min-width: 100px;*/
  margin-top: 20px;
}

.selectorForm > select {

}

#videoContainer {
  width: 80%;
  max-width: 800px;
  margin: auto;
}

#videoContainer iframe,
#videoContainer object,
#videoContainer embed {
  /*position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;*/
}

#container-index {
  background-image: url('/img/BG.jpg');
  background-size: cover;
  background-repeat: no-repeat;
}

.img-thumbnail {
  margin: 30px 0;
}

.homeLink:hover {
  text-decoration: none!important;
}

.homeLink img{
  filter: grayscale(80%);
  max-height: 149px;
}
.homeLink:hover img,
.homeLink:hover label,
.videoThumb:hover,
.videoThumb:hover + label{
  filter: initial;
  transform: scale(1.15);
  color: #ffe203;
}

.homeLink:hover img,
.videoThumb:hover {
  background-color: #ffe203;
  border-color: #ffd702;
}

.thumbnailLabel {
  display: block;
  color: whitesmoke;
  margin-top: -19px;
  transition: all .2s ease-in-out;
}

.background {
  display: none;
  width: 100%;
  margin-top: 51px;
}

.videoThumb {
  cursor: pointer;
  max-height: 165px;
}

#videoEmbedRegion {
  width: 100%;
  height: 60vh;
}

#iframeContainer {
  width: 100%;
  height: 100%;
}

/* SMALL */
@media screen and (max-width: 767px) {
  #background-small {
    display: block!important;
  }
}

/* MEDIUM */
@media screen and (min-width: 768px) and (max-width: 1023px) {
  #background-medium {
    display: block!important;
  }
}

/* BIG */
@media screen and (min-width: 1024px) and (max-width: 1200px) {
  #background-big {
    display: block!important;
  }
}

/* XTRA */
@media screen and (min-width: 1201px) {
  #background-xtra {
    display: block!important;
  } 
}

