* {
  font-family: 'hilvccboing-regularregular';
  color: rgba(0,0,0,.5);
  letter-spacing: 0.2em;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  /* Margin bottom by footer height */
  margin-top: 60px;
  margin-bottom: 60px;
}

.playerbackground{
  background-color: rgba(0,0,0,1);
}

.sectiontitle{
  font-family: 'hilvccboing-lightlight';
  font-size: 32px;
}

.footer {
  position: fixed;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  font-family: 'hilvccboing-regularregular';
  color: rgba(0,0,0,.5);
  letter-spacing: 0.3em;
  text-align: center;
  line-height: 30px;
  background-color: rgba(240,240,240,1);
}


.footer a:link, .contactlinks a:link, .lead a:link {
  color: rgba(0,0,0,.8);
  text-decoration: none;
}

.footer a:visited, .contactlinks a:visited, .lead a:visited {
  color: rgba(0,0,0,.8);
  text-decoration: none;
}

.footer a:hover, .contactlinks a:hover, .lead a:hover {
  color: rgba(0,0,0,.5);
  text-decoration: none;
}

.footer a:active, .contactlinks a:active, .lead a:active {
  color: rgba(0,0,0,.8);
  text-decoration: none;
}




.navbar-custom {
    background-color: rgba(240,240,240,1);
}

.navbar-custom-player {
    background-color: rgba(0,0,0,1);
}

.navbar-custom .navbar-brand,
.navbar-custom .navbar-text {
    font-family: 'hilvccboing-regularregular';
    color: rgba(0,0,0,.8);
    letter-spacing: 0.3em;
}

.navbar-custom-player .navbar-brand,
.navbar-custom .navbar-text {
    font-family: 'hilvccboing-regularregular';
    color: rgba(255,255,255,.8);
    letter-spacing: 0.3em;
}

.navbarlogo{
  height: 30;
  /* put value of image height as your need */
  float: left;
  margin-right: 7px;
}

/* change the link color */
.navbar-custom .navbar-nav .nav-link {
  font-family: 'hilvccboing-regularregular';
  color: rgba(0,0,0,.8);
  letter-spacing: 0.3em;
}

.navbar-custom-player .navbar-nav .nav-link {
  font-family: 'hilvccboing-regularregular';
  color: rgba(255,255,255,.8);
  letter-spacing: 0.3em;
}

/* change the color of active or hovered links */
.navbar-custom .nav-item.active .nav-link,
.navbar-custom .nav-item:hover .nav-link {
    color: rgba(0,0,0,.5);
}

.navbar-custom-player .nav-item.active .nav-link,
.navbar-custom-player .nav-item:hover .nav-link {
    color: rgba(255,255,255,.5);
}

.custom-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0,0,0,.8)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.custom-toggler-player .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255,.8)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.custom-toggler.navbar-toggler {
  border-color: rgba(255,255,255,.9) !important;/*rgba(0,0,0,.8);*/
}

.navbar-custom-player {
  border-color: rgba(255,255,255,.1) !important;
}

.gradient-text {
  /* Fallback: Set a background color. */
  background-color: #36A8E0;
  background-image: linear-gradient(
         90deg,
         #36A8E0 1.0%,
         #8E96CB 19.5%,
         #B27DB4 34.8%,
         #CF5197 52.3%,
         #E4007E 68.1%,
         #EF9473 85.1%,
         #FCDA00 99.0%);
  background-size: 100%;
  background-repeat: repeat;
  /* Use the text as a mask for the background. */
  /* This will show the gradient as a text color rather than element bg. */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  /* Animate the text when loading the element. */
    /* This animates it on page load and when hovering out. */
    animation: rainbow-text-simple-animation-rev 0.75s ease forwards;
}

#bm {
  height: 40px;
  width: 270px;
}

.postercontainer{
  position: relative;
}

.posterplayoverlay{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: .5s ease;
  opacity:0;
  background-color: rgba(0,0,0,.8);
}

.playbuttonoverlay{
  position: relative;
  display: block;
  margin: auto;
  left: 0;
  top: 35%;
  height: 30%;
}

.postercontainer:hover .posterplayoverlay {
  opacity: 1;
}

.postercredits{
  position: absolute;
  bottom: 20px;
  width:100%;
  color: white;
  text-align: center;
}

#reelplayer{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: .5s ease;
  visibility: hidden;
}

#videoinfo p{
  font-family: 'hilvccboing-regularregular';
  color: rgba(255,255,255,.6);
}

#intro{
  min-height: 50vh;
}

/*
#arrowdown{
  position: absolute;
  text-align: center;
  top: 90vh;
  left:50%;
  font-size: 32px;
  transition: .5s ease;
  opacity:0;
}

body:hover #arrowdown{
  opacity:1;
}
*/