/* =================================================================
variables
================================================================= */
/* =================================================================
mixins
================================================================= */
/* =================================================================
Video
================================================================= */
/*.video {
  position: relative;
  max-height: 600px;
}*/
/*.video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}*/
.video img {
  width: 100%;
  display: block;
  cursor: pointer;
}

.video-container {
  /*margin-bottom: 35px;*/
}
.video-container .video-padding {
  /*padding-bottom: 56%;*/
}
.video-container p {
  font-size: 1.8rem;
  line-height: 1.25;
  margin-top: 15px;
  font-weight: bold;
}

.video-slider-container {
  background: #007681;
}
@media screen and (min-width: 800px) {
  .video-slider-container {
    padding: 50px 0;
    /*min-height: 1000px;*/
  }
}
.video-slider-container .trigger {
  color: #fff;
  text-transform: uppercase;
}
@media screen and (min-width: 800px) {
  .video-slider-container .trigger {
    font-size: 3.2rem;
    margin-bottom: 30px;
  }
}
.video-slider-container .flex-control-nav img {
  width: 100%;
  display: block;
}
.video-slider-container .video-padding {
  padding-bottom: 4.5%;
}
@media screen and (min-width: 800px) {
  .video-slider-container .video-padding {
    /*padding-bottom: 600px;*/
  }
}

@media screen and (min-width: 800px) {
  .video-slider {
    /*max-width: 500px;*/
    margin: 0 auto;
  }
}
.video-slider li img {
  display: block;
  width: 100%;
}

#carousel {
  padding: 0 50px 30px;
  position: relative;
  margin-top: 30px;
}
@media screen and (min-width: 800px) {
  #carousel {
    padding-bottom: 0;
  }
}
#carousel .slides li img {
  display: block;
  width: 100%;
}
#carousel ul.flex-direction-nav a {
  background: url("http://codingitclassy.com/hosted-assets/sungard/v2_0/img/slider-arrow.png") no-repeat;
  background-size: contain;
  width: 20px;
  height: 40px;
  text-indent: -9999em;
}
@media screen and (min-width: 1050px) {
  #carousel ul.flex-direction-nav a {
    width: 30px;
    height: 70px;
  }
}
#carousel ul.flex-direction-nav a.flex-prev {
  float: left;
}
#carousel ul.flex-direction-nav a.flex-next {
  float: right;
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
#carousel ul.flex-direction-nav a.flex-disabled {
  opacity: .2;
}
#carousel ul.flex-direction-nav li {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#carousel ul.flex-direction-nav li.flex-nav-prev {
  left: 0;
}
#carousel ul.flex-direction-nav li.flex-nav-next {
  right: 0;
}

.container-wide {
  max-width: 800px;
}