/* Video Banner Styles*/

/*Charles restyle*/

/*.video {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.banner-vid {
    display: table-cell;
    padding: 14px;
    vertical-align: top;
}

.banner-content {
    color: #666;
    font-size: 14px;
    display: table-cell;
    padding: 14px;
    vertical-align: top;
}*/

/****************/

.video_banner {
background-color: #efefef;
height: 240px;
/*display: inline-block;*/
border: 1px solid #bcbcbc;
margin-bottom: 10px;
}

/*Styles for expanded banner*/
.banner-expand {
position: fixed;
top: 54px;
height: 508px;
width: 100%;
left: 0;
background-color: var(--dark-blue);
z-index: 1300;
}

.banner-vid {
  float: left;
}


/*Banner content styles*/
.banner-content {
color: #666;
font-size: 14px;
float: right;
width: 50%;
}

.header {
color: #222;
font-size: 18px;
font-weight: 700;
}

/*Hides banner content when the banner is expanded*/
.video_banner.banner-expand .banner-content {
display: none;
}

.video {
  margin: 20px;
}

/*Styles for when video is expanded*/
.video_banner.banner-expand .video {
  margin: auto;
}

.video_banner.banner-expand .banner-vid {
  text-align: center;
  width: 100%;
  float: none;
}

/*Minimize Icon Styles*/
.fa-compress {
  float: right;
  font-size: 23px;
}

.exit .fa {
  color: white;
}

.exit {
  position: absolute;
  right: 14px;
  top: 10px;
}

.exit:hover {
  cursor: pointer;
}

.exiticon {
  display: none;
}

/*Video Link Styles*/
.video_link {
  cursor: pointer;
  font-weight: 500;
}

.divname::before {
  display: block;
  content: " ";
  margin-top: -500px;
  height: 500px;
  visibility: hidden;
}

/*Responsive styles*/
.phonevid {
  display: none;
  text-align: center;
}

/*Reduces text width when resizing windows*/

@media only screen and (max-width: 1552px) {
  .banner-content {
  width: 50%;
  }
}

@media only screen and (max-width: 1474px) {
  .banner-content {
  width: 45%;
  }
}

@media only screen and (max-width: 1406px) {
  .banner-content {
  width: 45%;
  }
}

@media only screen and (max-width: 1351px) {
  .banner-content {
  width: 40%;
  }
}

@media only screen and (max-width: 1310px) and (min-width:1280px){
  .banner-content {
/*   float: none; */
  width: 45%;
/*   clear: left;
  padding-top: 5px; */
  }

/*   .banner-vid {
    float: none;
    width: 100%;
  }

  .video_banner {
    display: inline-block;
    height: unset;
  } */
}

@media only screen and (max-width: 1280px) {
  .banner-content {
  width: 40%;
  }
}

@media only screen and (max-width: 1240px) {
  .banner-content {
  width: 40%;
  }
}

@media only screen and (max-width: 1160px) {
  .banner-content {
  width: 40%;
  }
}

@media only screen and (max-width: 1090px) {
  .banner-content {
  width: 40%;
  }
}

@media only screen and (max-width: 1035px) {
  .banner-content {
  width: 35%;
  }
}

/*@media only screen and (max-width: 1433px) {
  .banner-content {
      display: block;
      padding-top: 0;
  }
   
  .banner-vid {
      display: block;
    }

  iframe {
    height: 300px;
  }
  }*/

/*@media only screen and (max-width: 1311px) and (min-width:1280px){
  .banner-content {
  float: none;
  width: 100%;
  clear: left;
  padding-top: 5px;
  }

  .banner-vid {
    float: none;
    width: 100%;
  }
}*/

/*Replaces video banner with regular youtube video on mobile devices*/

@media only screen and (max-width: 999px) {
  .phonevid {
    display: inline;
  }

  .phoneiframe {
    width: 100%;
    height: 350px;
  }

  .video_banner {
    display: none;
  }
}