/* ==========================================================================
   Custom css
   ========================================================================== */
html {
  position: relative;
  min-height: 100%;
}


body {
  background-color: #fafafa;
  font-family: 'Bellefair', serif;
}

h1 {
  color: #000;
  font-size: 4rem;
}

h3 {
  color: #fff;
}


h4 {
  color: #000;
  font-size: 1rem;
}

p {
  color: #fff;
  font-size: 1rem;
}

ul {
  -webkit-padding-start: 0;
  list-style-type: none; 
  padding: 0;
}

ul li {
  margin: 5px 0;
}

ul#menu-menu-1,menu {
  -webkit-padding-start: 0;
}

a {
  text-decoration: none;
  color: #000;
  font-size: 1rem;
}

a:hover:first-child{
  text-decoration: none;
  padding:0px;
}

a:hover{
  text-decoration: none;
  background-color: #000;
  color: #fff;
}

a:focused {
  color: gray;
}

a:visited{
  text-decoration: none;
}

a:-webkit-any-link {
  text-decoration: none;
}

.padding {
  padding: 10px;
}

.inline-link {
    color: #fff;
}

:focus {
    outline: none;
}

.vid-top {
  margin-top: -50px;
}


/*-------------------------------------------------*/
/*                     Headers                     */
/*-------------------------------------------------*/


.header-colors {
  background-color: #FDA758;
  background-color: #105EFF;
  background-color: #8A2E4D;
  background-color: #EFA89E;
  background-color: #8DCFCE;
  background-color: #E84523;
  background-color: #2A5A62;
}

.main-header {
  margin-bottom: 50px;
}

.work-header {
  width: 100%;
  height: 500px;
  background-color: #0057ff;
  position: relative;
}

@media (min-width:575px) {
  .work-header {
    width: 100%;
    height: 450px;
    background-color: #0057ff;
  }
}

.asana-header {
  background-color: #E84523;
  height: 550px;
}

.googleplay-header {
  background-color: #e32f54;
  height: 450px;
}
.stadia-header {
  background-color: #E84523;
  height: 500px;
}
.guardian-header {
  background-color: #0e4869;
  height: 430px;
}

.starbucks-header {
  background-color: #2A5A62;
  height: 380px;
}

.dinela-header {
  background-color: #8DCFCE;
  height: 550px;
}

.great-header {
  background-color: #E84523;
  height: 430px;
}

.los-eiw-header {
  background-color: #FDA758;
  height: 800px;
}

.heavy-header {
  background-color: #EFA89E;
  height: 450px;
}

.grammy-header {
  background-color: #8A2E4D;
  height: 400px;
}

.los-ed-header {
  background-color: #105EFF;
  height: 500px;
}

.graco-header {
  background-color: #8DCFCE;
  height: 500px;
}

.clean-header {
  background-color: #2A5A62;
  height: 600px;
}

.crate-header {
  background-color: #8DCFCE;
  height: 350px;
}

.truth-header {
  background-color: #E84523;
  height: 250px;
}

.visa-header {
  background-color: #8DCFCE;
  height: 400px;
}

.color-header {
  background-color: #E84523;
  height: 300px;
}

.visa-header {
  background-color: #8A2E4D;
  height: 300px;
}

.AICP-header {
  background-color: #105EFF;
  height: 650px;
}

.experience-header {
  height: 1200px;
}

@media (min-width:535px) {
 .starbucks-header {
    height: 400px;
  }

  .los-eiw-header {
    height: 700px;
  }

  .dinela-header {
    height: 450px;
  }
}

@media (min-width:768px) {
   .starbucks-header {
    height: 350px;
  }

  .los-eiw-header {
    height: 550px;
  }

  .great-header {
    height: 400px;
  }

  .guardian-header {
    background-color: #0e4869;
    height: 400px;
  }

  .graco-header {
    height: 400px;
  }

  .los-ed-header {
    height: 400px;
  }

  .clean-header {
    height: 420px;
  }

  .AICP-header {
    height: 500px;
  }

  .grammy-header {
    height: 350px;
  }

  .guardian-header {
    height: 400px;
  }


}

@media (min-width:992px) {

  .starbucks-header {
    height: 450px;
  }

  .los-eiw-header {
    height: 720px;
  }

  .great-header {
    height: 450px;
  }

  .guardian-header {
    background-color: #0e4869;
    height: 480px;
  }

  .dinela-header {
    height: 550px;
  }

  .heavy-header {
    height: 550px;
  }

  .grammy-header {
    height: 450px;
  }

  .crate-header {
    height: 450px;
  }

  .graco-header {
    height: 500px;
  }

  .los-ed-header {
    height: 480px;
  }

  .clean-header {
    height: 550px;
  }

  .color-header {
    height: 350px;
  }

  .visa-header {
    height: 350px;
  }
  
  .AICP-header {
    height: 650px;
  }


}


@media (min-width:1200px) {

  .starbucks-header {
    height: 400px;
  }

  .heavy-header {
    height: 500px;
  }

  .crate-header {
    height: 400px;
  }

  .dinela-header {
    height: 480px;
  }

  .AICP-header {
    height: 600px;
  }

  .los-ed-header {
    height: 450px;
  }


  .los-eiw-header {
    height: 650px;
  }

  .grammy-header {
    height: 400px;
  }

  .graco-header {
    height: 450px;
  }

  .clean-header {
    height: 500px;
  }
}

.experience-copy {
  padding: 40px 0px ;
  color: #fff;
}

.experience-copy p{
  line-height: 2;
  font-size: 1rem;
}


.header-copy {
  padding: 60px 0px 60px 0;
  color: #fff;
  line-height: 2;
  font-size: 1.2rem;
}

@media (min-width:992px) {
  .header-copy {
    padding: 60px 0px ;
    color: #fff;
    line-height: 1.6;
    font-size: 2rem;
  }

  .experience-copy {
    padding: 40px 0px ;
    color: #fff;
    line-height: 2;
    font-size: 2rem;
  }
}

/*-------------------------------------------------*/
/*                     images                      */
/*-------------------------------------------------*/


.left-nav{
 margin-top: 40px;
}

@media (min-width:768px) {
  .left-nav{
   margin-top: 80px;
  }
}

.right-imgs {
  display: none;
  position: relative;
}

.static-image {
  margin: 30px auto;
  width: 100%;
  height: 100%;
}

@media (min-width:894px) {
  .right-imgs {
    height: 600px;
    display: block;
  }
}

.images {
  position: absolute;
  margin-top: 170px;
  width: 100%;
  height: 400px;
}

.img-top {
  margin-top: -30px;
}

.carousel {
  margin-top: 100px
}

.carousel-30 {
  margin-top: 30px
}

#main-img {
  z-index: 1;
  background-image: url("../img/hover/main-img.png");
  background-repeat: no-repeat;
  width: 100%;
}

#asana-img {
  display: none;
  background-image: url("../img/hover/asana.png");
  background-repeat: no-repeat;
  width: 100%;
  z-index: 1000;
}

#googleplay-img {
  display: none;
  background-image: url("../img/hover/googleplay.png");
  background-repeat: no-repeat;
  width: 100%;
  z-index: 1000;
}

#stadia-img {
  display: none;
  background-image: url("../img/hover/stadia.png");
  background-repeat: no-repeat;
  width: 100%;
  z-index: 1000;
}

#guardian-img {
  display: none;
  background-image: url("../img/hover/guardian.png");
  background-repeat: no-repeat;
  width: 100%;
  z-index: 1000;
}

#great-img {
  display: none;
  background-image: url("../img/hover/great.png");
  background-repeat: no-repeat;
  width: 100%;
  z-index: 1000;
}

#starbucks-img {
  display: none;
  background-image: url("../img/hover/starbucks.png");
  background-repeat: no-repeat;
  width: 100%;
  z-index: 1000;
}

#dinela-img {
  display: none;
  background-image: url("../img//hover/dinela.png");
  background-repeat: no-repeat;
  width: 100%;
  z-index: 1000;
}

#heavy-img {
  display: none;
  background-image: url("../img/hover/heavy.png");
  background-repeat: no-repeat;
  width: 100%; 
  z-index: 1000; 
}

#los-eiw-img {
  display: none;
  background-image: url("../img/hover/los-eiw.png");
  background-repeat: no-repeat;
  width: 100%; 
  z-index: 1000; 
}

#grammy-img {
  display: none;
  background-image: url("../img/hover/grammy.png");
  background-repeat: no-repeat;
  width: 100%; 
  z-index: 1000; 
}

#los-ed-img {
  display: none;
  background-image: url("../img/hover/los-ed.png");
  background-repeat: no-repeat;
  width: 100%; 
  z-index: 1000; 
}

#graco-img {
  display: none;
  background-image: url("../img/hover/graco.png");
  background-repeat: no-repeat;
  width: 100%; 
  z-index: 1000; 
}

#clean-img {
  display: none;
  background-image: url("../img/hover/clean.png");
  background-repeat: no-repeat;
  width: 100%; 
  z-index: 1000; 
}

#crate-img {
  display: none;
  background-image: url("../img/hover/crate.png");
  background-repeat: no-repeat;
  width: 100%; 
  z-index: 1000; 
}

#truth-img {
  display: none;
  background-image: url("../img/hover/truth.png");
  background-repeat: no-repeat;
  width: 100%; 
  z-index: 1000; 
}

#visa-img {
  display: none;
  background-image: url("../img/hover/visa.png");
  background-repeat: no-repeat;
  width: 100%; 
  z-index: 1000; 
}

#color-img {
  display: none;
  background-image: url("../img/hover/color.png");
  background-repeat: no-repeat;
  width: 100%; 
  z-index: 1000; 
}

#AICP-img {
  display: none;
  background-image: url("../img/hover/AICP.png");
  background-repeat: no-repeat;
  width: 100%; 
  z-index: 1000; 
}



/*-------------------------------------------------*/
/*                     video                       */
/*-------------------------------------------------*/

iframe {
  margin: 20px 0;
}

@media (min-width:575px) {
  iframe {
    margin: 20px 0 20px 0px;
  }
}

.embed-responsive {
    overflow: visible; 
}

.top-vid {
  margin-top: -100px;
}

@media (min-width:575px) {
  .top-vid {
    margin-top: -50px;
  }
}

.video-container {
  max-width: 900px;
  padding-top: 50px;
}

.vertical-video {
  margin: 20px 0;
  height: 700px;
}

.vid-full {
  width: 100%;
  /*margin: auto;*/
  margin-left: -10%;
  min-width: 121%;
}

@media (min-width:768px) {
  .vid-full {
    width: 100%;
    margin-left: -55px;
    min-width: 121%;
  }
}

@media (min-width:992px) {
  .vid-full {
    width: 100%;
    margin-left: -75px;
    min-width: 121%;
  }
}

@media (min-width:1200px) {
  .vid-full {
    width: 100%;
    margin-left: -85px;
    min-width: 121%;
  }
}


/*-------------------------------------------------*/
/*              side - content &notes              */
/*-------------------------------------------------*/


.header-side-mobile p {
  color: #fff;
  font-size: 2.5rem;
  padding: 0 0 0 15px;
}

@media (min-width:768px) {
  .header-side-mobile {
    display: none;
  }
}

.header-side {
  margin-top: 100px;
  display: none;
}

@media (min-width:768px) {
  .header-side {
    margin-top: 65px;
    display: block;
  }
}

.header-side p{
    padding-left: 80px;
    color: #fff;
    font-size: 3rem;
    line-height: 50px;
}

.scrollToTop p {
  color: #fff;
  font-size: 1rem;
  position: absolute;
  top: 15px;
  left: 15px;
  cursor: pointer;
  z-index: 9000;
}

.scrollToTop-bot p {
  display: block;
  color: #000; 
  font-size: 1rem;
  position: fixed;
  bottom: 10px;
  left: 15px;
  cursor: pointer;
}

#loader {
  width: 100px;
  height: 100px;
  margin-top: 100px;
}

.notes {
  margin: 0px 0px 20px 0px;
}

.press {
  margin: 20px 0px;
  line-height: 25px;
}


@media (min-width:768px) {
  .notes {
    margin: 150px 0px 0px 0px;
  }

  .press {
    margin: 20px 0px;
    line-height: 25px;
  }
}

.carousel img {
  width: 50%;
  height: 50%;
}

.carousel img {
  margin: auto;
}

.carousel-inner {
  text-align: center;
} 

.carousel-item {
  text-align: center;
} 



a.left.carousel-control {
  width: 50px;
  height: 50px;
  position: absolute;
  top: 50%;
  left: 0px;
  z-index: 5000;
  background-color: #e6e6e6;
}

a.right.carousel-control {
  width: 50px;
  height: 50px;
  position: absolute;
  top: 50%;
  right: 0px;
  z-index: 5000;
  background-color: #e6e6e6;
}

a.left.carousel-control:hover, a.right.carousel-control:hover {
  background-color: #000;
}

.icon-prev {
  color: #fff;
  font-size: 2rem;
  margin-left: 15px;
}

.icon-next {
  color: #fff;
  font-size: 2rem;
  margin-left: 17px;
}