/*----------------------------------
  Background Grid
------------------------------------*/


/*.grid {
  position: fixed;
  width: 100%;
}
.grid-line {
  height: 100vh;
  border-left: 1px solid #ccc;
}*/
@media only screen and (min-height:900px) {
  .large-screen{
    margin-top:-145vh !important;
  }
}
@media only screen and (max-height:899px) {
  .large-screen{
    margin-top:-180vh !important;
  }
}
@media only screen and (max-height:800px) {
  .large-screen{
    margin-top:-200vh !important;
  }
}



.col0{
  margin-left:-5%;
}
.col1{
  margin-left:10%;
}
.col2{
  margin-left:20%;
}
.col3{
  margin-left:30%;
}
.col4{
  margin-left:40%;
}
.col5{
  margin-left:50%;
}
.col6{
  margin-left:60%;
}
.col7{
  margin-left:70%;
}
.col8{
  margin-left:80%;
}
.col9{
  margin-left:90%;
}
.col10{
  margin-left:100%;
}


.fixed-top {
  position: absolute;
  width: 300;
  height: 300;
  background: #37669F;
  border-radius: 20px;
  z-index: -1;
  margin-top: 550px;
  margin-left: -150px;
  opacity: 0.85;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.2);
}


/*----------------------------------
  Main
------------------------------------*/

main,
.main {
  overflow: hidden;
}

.section {
  position: relative;
}


.absolute {
  position: absolute;
  width: 100%;
  height: auto;
  margin-top: 100px;
}
.absolute.above {
  z-index: 0;
}
.lg-blue {
  width: 11vw;
  height: 11vw;
  background: #e56b6f;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.15), 0 6px 20px 0 rgba(0, 0, 0, 0.15);
  border-radius: 12px;
  margin-left: -80px;
  margin-top: 25vh;
  opacity: 0.85;
}
.sm-blue {
  width: 4.2vw;
  height: 4.2vw;
  background: #6d597a;
  border-radius: 12px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.15);
  margin-left: -30px;
  margin-top: 50vh;
  opacity: 0.85;
}
.sm-pink {
  width: 4.2vw;
  height: 4.2vw;
  background: #2a9d8f;
  border-radius: 12px;
  margin-left: -30px;
  margin-top: 50vh;
  opacity: 0.85;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.15);
}
.md-blue {
  width: 8.4vw;
  height: 8.4vw;
  background: #b56576;
  border-radius: 12px;
  margin-left: -60px;
  margin-top: 1.3vh;
  opacity: 0.85;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.15);
}
.lg-pink {
  width: 5.5vw;
  height: 5.5vw;
  background: #f4a261;
  border-radius: 12px;
  margin-left: 57px;
  margin-top: 7.5vh;
  opacity: 0.85;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.15);
}
.xl-pink {
  width: 8.4vw;
  height: 8.4vw;
  background: #2a9d8f;
  border-radius: 12px;
  margin-left: 57px;
  margin-top: 7.5vh;
  opacity: 0.85;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.15);
}



span.pink {
  color: #e9c46a;
}
span.blue {
  color: #e56b6f;
}
span.white {
  color: #fff;
}


@-webkit-keyframes fuzz /* Safari and Chrome */ {
  0% {
    opacity: 0;
  }
  40% {
    opacity: 0;
  }
  100% {
    /*-webkit-transform: scaleY(1);*/
    opacity: 1;
  }
}

@-webkit-keyframes fuzz2 /* Safari and Chrome */ {
  0% {
    opacity: 0;
  }
  48% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes fuzz3 /* Safari and Chrome */ {
  0% {
    opacity: 0;
  }
  54% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}





@-webkit-keyframes stretch /* Safari and Chrome */ {
  0% {
    -webkit-transform: scaleX(0);
    opacity: 0;
  }
  50% {
    -webkit-transform: scaleX(0);
    opacity: 1;
  }
  60% {
    -webkit-transform: scaleX(0);
  }
  100% {
    -webkit-transform: scaleX(1);
  }
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 20px, 0);
  }
  30% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}







/*----------------------------------
  Medium devices: iPad vertical
------------------------------------*/

@media (max-width: 991px) {


}



/*----------------------------------
  Small devices: iPhone 6+ and below
------------------------------------*/

@media (max-width: 767px) {


}


/*----------------------------------
  iPhone 6 & 6+ specific text bump
------------------------------------*/

@media (max-width: 991px) and (max-height: 736px) and (min-height: 481px) {


}