


[hidden] {
  display: none;
}


img {
  border: 0;
  -ms-interpolation-mode: bicubic;
}

svg:not(:root) {
  overflow: hidden;
}

figure {
  margin: 0;
}


fieldset {
  border: 1px solid silver;
  margin: 0 0;
  padding: 0.35em 0.625em 0.75em;
}






img {
  display: block;
  width: 100%;
}

ul {
  list-style: none;
  display: block;
  padding: 0;
  margin: 0;
}

a {
  text-decoration: none;
  color: #d92400;
}

.accelerate {
  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}

.center {
  max-width: 400px;
  margin: 0 auto;
  width: 88%;
}

.wrapper {
  min-height: 460px;
  position: absolute;
  overflow: hidden;
  display: table;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
}

.cell {
  vertical-align: middle;
  display: table-cell;
}




.scene,
.layer {
  display: block;
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
}

.scene {
  min-height: 460px;
  position:relative;
  overflow: hidden;
}


.layer {
  position: absolute;
}
.layer div {
  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}



.background {
  background: url('../assets/images/background.jpg');
  top: 0px;
  position: absolute;
background-repeat:no-repeat;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover;
background-position:inherit;
  width: 110%;
  height:110%;
  left: 0%;
  top: 0;

}

.bobi {
  background-size: 100% auto;
    width: 17%;
	height: 55%;

  background-image: url('../assets/images/linper-bobi.png');
  background-repeat: no-repeat;
  position: absolute;  
  bottom: 0%;
  right: 0%;
}

.baio {
  background-size: 100% auto;
    width: 29%;
	height: 62%;
  background-image: url('../assets/images/linper-baio.png');
  background-repeat: no-repeat;
  position: absolute;
  bottom: -5%;
  right: 9%;

}

.negrinho {
  background-size: 100% auto;
    width: 30%;
	height: 62%;
  background-image: url('../assets/images/linper-negrinho.png');
  background-repeat: no-repeat;
  position: absolute;
  bottom: -6%;
  right: 28%;  

}


.duba {
  background-size: 100% auto;
    width: 24%;
	height: 55%;
  background-image: url('../assets/images/linper-duba.png');
  background-repeat: no-repeat;
  position: absolute;
  bottom: 1%;
  left: -4%; 

}


.piti {
  background-size: 100% auto;
    width: 23%;
	height: 55%;
  background-image: url('../assets/images/linper-piti.png');
  background-repeat: no-repeat;
  position: absolute;
  bottom: 3%;
  left: 12%;  

}

.tatu {
  background-size: 100% auto;
    width: 22%;
	height: 55%;
  background-image: url('../assets/images/linper-tatu.png');
  background-repeat: no-repeat;
  position: absolute;
  bottom: 8%;
  left: 26%;
}

.igo {
  background-size: 100% auto;
    width: 20%;
	height: 50%;
  background-image: url('../assets/images/linper-igo.png');
  background-repeat: no-repeat;
  position: absolute;
  bottom:8%;
  left: 26%;
}


.flor2 {
  background-size: 100% auto;
    width: 35%;
	height: 65%;
  background-image: url('../assets/images/linper-flor2.png');
  background-repeat: no-repeat;
  position: absolute;
  bottom: -5%;
  left: -5%;
}


.flor1 {
  background-size: 100% auto;
    width: 35%;
	height: 65%;
  background-image: url('../assets/images/linper-flor1.png');
  background-repeat: no-repeat;
  position: absolute;
  bottom: -5%;
  right: -5%;
}

.grama1 {
  background-size: 100% auto;
    width: 35%;
	height: 68%;
  background-image: url('../assets/images/linper-grama1.png');
  background-repeat: no-repeat;
  position: absolute;
  bottom: 5%;
  right: 17%;
}

.grama2 {
  background-size: 100% auto;
    width: 35%;
	height: 68%;
  background-image: url('../assets/images/linper-grama2.png');
  background-repeat: no-repeat;
  position: absolute;
    bottom: -5%;
	right: 2%;

}





.rope {
  width: 120%;
  position: relative;
  left: -10%;

}

.hanger {
  -webkit-transform-origin: 0% 0%;
  -moz-transform-origin: 0% 0%;
  transform-origin: 0% 0%;
  position: absolute;
}
.hanger.position-1 {
  top: 28%;
}
.hanger.position-2 {
  top: 46%;
}
.hanger.position-3 {
  top: 59%;
}
.hanger.position-4 {
  top: 66.5%;
}
.hanger.position-5 {
  top: 69.5%;
}
.hanger.position-6 {
  top: 66.5%;
}
.hanger.position-7 {
  top: 59%;
}
.hanger.position-8 {
  top: 46%;
}
.hanger.position-9 {
  top: 28%;
}
.hanger.position-1 {
  left: 10%;
}
.hanger.position-2 {
  left: 20%;
}
.hanger.position-3 {
  left: 30%;
}
.hanger.position-4 {
  left: 40%;
}
.hanger.position-5 {
  left: 50%;
}
.hanger.position-6 {
  left: 60%;
}
.hanger.position-7 {
  left: 70%;
}
.hanger.position-8 {
  left: 80%;
}
.hanger.position-9 {
  left: 90%;
}

.board {
  -webkit-transform-origin: 50% 0%;
  -moz-transform-origin: 50% 0%;
  transform-origin: 50% 0%;
  margin: 0px -140px;
  background-size: 280px 280px;
  height: 280px;
  width: 280px;
  background-repeat: no-repeat;
  position: absolute;
  top: -4px;
  left: 0;
}
.board.birds {
  background-image: url('../assets/images/board-birds.png');
}
.board.cloud-1 {
  background-image: url('../assets/images/board-cloud-1.png');
}
.board.cloud-2 {
  background-image: url('../assets/images/board-cloud-2.png');
}
.board.cloud-3 {
  background-image: url('../assets/images/board-cloud-3.png');
}
.board.cloud-4 {
  background-image: url('../assets/images/board-cloud-4.png');
}

.swing-1 {
  -webkit-animation: swing 4s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
  -moz-animation: swing 4s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
  animation: swing 4s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
  
}

.swing-2 {
  -webkit-animation: swing 3.5s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
  -moz-animation: swing 3.5s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
  animation: swing 3.5s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.swing-3 {
  -webkit-animation: swing 3s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
  -moz-animation: swing 3s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
  animation: swing 3s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.swing-4 {
  -webkit-animation: swing 2.5s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
  -moz-animation: swing 2.5s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
  animation: swing 2.5s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.swing-5 {
  -webkit-animation: swing 2s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
  -moz-animation: swing 2s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
  animation: swing 2s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
}


.rope.depth-10 {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  transform: scale(1);
  top: 20%;
}
.rope.depth-10 .hanger {
  -webkit-transform: scale(0.25);
  -moz-transform: scale(0.25);
  transform: scale(0.25);
}


.rope.depth-20 {
  -webkit-transform: scale(1.02778);
  -moz-transform: scale(1.02778);
  transform: scale(1.02778);
  top: 16.66667%;
}
.rope.depth-20 .hanger {
  -webkit-transform: scale(0.27778);
  -moz-transform: scale(0.27778);
  transform: scale(0.27778);
}


.rope.depth-30 {
  -webkit-transform: scale(1.05556);
  -moz-transform: scale(1.05556);
  transform: scale(1.05556);
  top: 13.33333%;
}
.rope.depth-30 .hanger {
  -webkit-transform: scale(0.30556);
  -moz-transform: scale(0.30556);
  transform: scale(0.30556);
}



.rope.depth-40 {
  -webkit-transform: scale(1.08333);
  -moz-transform: scale(1.08333);
  transform: scale(1.08333);
  top: 10.0%;
}
.rope.depth-40 .hanger {
  -webkit-transform: scale(0.33333);
  -moz-transform: scale(0.33333);
  transform: scale(0.33333);
}



.rope.depth-50 {
  -webkit-transform: scale(1.11111);
  -moz-transform: scale(1.11111);
  transform: scale(1.11111);
  top: 6.66667%;
}
.rope.depth-50 .hanger {
  -webkit-transform: scale(0.36111);
  -moz-transform: scale(0.36111);
  transform: scale(0.36111);
}



.rope.depth-60 {
  -webkit-transform: scale(1.13889);
  -moz-transform: scale(1.13889);
  transform: scale(1.13889);
  top: 3.33333%;
}
.rope.depth-60 .hanger {
  -webkit-transform: scale(0.38889);
  -moz-transform: scale(0.38889);
  transform: scale(0.38889);
}



.rope.depth-70 {
  -webkit-transform: scale(1.16667);
  -moz-transform: scale(1.16667);
  transform: scale(1.16667);
  top: 0.0%;
}
.rope.depth-70 .hanger {
  -webkit-transform: scale(0.41667);
  -moz-transform: scale(0.41667);
  transform: scale(0.41667);
}



.rope.depth-80 {
  -webkit-transform: scale(1.19444);
  -moz-transform: scale(1.19444);
  transform: scale(1.19444);
  top: -3.33333%;
}
.rope.depth-80 .hanger {
  -webkit-transform: scale(0.44444);
  -moz-transform: scale(0.44444);
  transform: scale(0.44444);
}



.rope.depth-90 {
  -webkit-transform: scale(1.22222);
  -moz-transform: scale(1.22222);
  transform: scale(1.22222);
  top: -6.66667%;
}
.rope.depth-90 .hanger {
  -webkit-transform: scale(0.47222);
  -moz-transform: scale(0.47222);
  transform: scale(0.47222);
}



.rope.depth-100 {
  -webkit-transform: scale(1.25);
  -moz-transform: scale(1.25);
  transform: scale(1.25);
  top: -10%;
}
.rope.depth-100 .hanger {
  -webkit-transform: scale(0.5);
  -moz-transform: scale(0.5);
  transform: scale(0.5);
}

@media all and (min-width: 400px) {
 

  .scene {
    min-height: 360px;
  }

  .rope.depth-10 {
    top: 10%;
  }
  .rope.depth-10 .hanger {
    -webkit-transform: scale(0.3);
    -moz-transform: scale(0.3);
    transform: scale(0.3);
  }

  .rope.depth-20 {
    top: 6.11111%;
  }
  .rope.depth-20 .hanger {
    -webkit-transform: scale(0.33333);
    -moz-transform: scale(0.33333);
    transform: scale(0.33333);
  }

  .rope.depth-30 {
    top: 2.22222%;
  }
  .rope.depth-30 .hanger {
    -webkit-transform: scale(0.36667);
    -moz-transform: scale(0.36667);
    transform: scale(0.36667);
  }

  .rope.depth-40 {
    top: -1.66667%;
  }
  .rope.depth-40 .hanger {
    -webkit-transform: scale(0.4);
    -moz-transform: scale(0.4);
    transform: scale(0.4);
  }

  .rope.depth-50 {
    top: -5.55556%;
  }
  .rope.depth-50 .hanger {
    -webkit-transform: scale(0.43333);
    -moz-transform: scale(0.43333);
    transform: scale(0.43333);
  }

  .rope.depth-60 {
    top: -9.44444%;
  }
  .rope.depth-60 .hanger {
    -webkit-transform: scale(0.46667);
    -moz-transform: scale(0.46667);
    transform: scale(0.46667);
  }

  .rope.depth-70 {
    top: -13.33333%;
  }
  .rope.depth-70 .hanger {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    transform: scale(0.5);
  }

  .rope.depth-80 {
    top: -17.22222%;
  }
  .rope.depth-80 .hanger {
    -webkit-transform: scale(0.53333);
    -moz-transform: scale(0.53333);
    transform: scale(0.53333);
  }

  .rope.depth-90 {
    top: -21.11111%;
  }
  .rope.depth-90 .hanger {
    -webkit-transform: scale(0.56667);
    -moz-transform: scale(0.56667);
    transform: scale(0.56667);
  }

  .rope.depth-100 {
    top: -25%;
  }
  .rope.depth-100 .hanger {
    -webkit-transform: scale(0.6);
    -moz-transform: scale(0.6);
    transform: scale(0.6);
  }
}
@media all and (min-width: 600px) {
 

  .background {
    bottom: 96px;
  }

 

  .light {
    margin: -140px -140px;
    background-size: 280px 280px;
    height: 280px;
    width: 280px;
  }
  .light.a {
    bottom: 144px;
  }
  .light.b {
    bottom: 144px;
  }
  .light.c {
    bottom: 192px;
  }
  .light.d {
    bottom: 160px;
  }
  .light.e {
    bottom: 192px;
  }
  .light.f {
    bottom: 128px;
  }

 

  .rope.depth-10 {
    top: 20%;
  }
  .rope.depth-10 .hanger {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    transform: scale(0.5);
  }

  

  .rope.depth-20 {
    top: 16.66667%;
  }
  .rope.depth-20 .hanger {
    -webkit-transform: scale(0.55556);
    -moz-transform: scale(0.55556);
    transform: scale(0.55556);
  }

 

  .rope.depth-30 {
    top: 13.33333%;
  }
  .rope.depth-30 .hanger {
    -webkit-transform: scale(0.61111);
    -moz-transform: scale(0.61111);
    transform: scale(0.61111);
  }

  

  .rope.depth-40 {
    top: 10.0%;
  }
  .rope.depth-40 .hanger {
    -webkit-transform: scale(0.66667);
    -moz-transform: scale(0.66667);
    transform: scale(0.66667);
  }

  

  .rope.depth-50 {
    top: 6.66667%;
  }
  .rope.depth-50 .hanger {
    -webkit-transform: scale(0.72222);
    -moz-transform: scale(0.72222);
    transform: scale(0.72222);
  }

 

  .rope.depth-60 {
    top: 3.33333%;
  }
  .rope.depth-60 .hanger {
    -webkit-transform: scale(0.77778);
    -moz-transform: scale(0.77778);
    transform: scale(0.77778);
  }

  

  .rope.depth-70 {
    top: 0.0%;
  }
  .rope.depth-70 .hanger {
    -webkit-transform: scale(0.83333);
    -moz-transform: scale(0.83333);
    transform: scale(0.83333);
  }

 

  .rope.depth-80 {
    top: -3.33333%;
  }
  .rope.depth-80 .hanger {
    -webkit-transform: scale(0.88889);
    -moz-transform: scale(0.88889);
    transform: scale(0.88889);
  }



  .rope.depth-90 {
    top: -6.66667%;
  }
  .rope.depth-90 .hanger {
    -webkit-transform: scale(0.94444);
    -moz-transform: scale(0.94444);
    transform: scale(0.94444);
  }

  

  .rope.depth-100 {
    top: -10%;
  }
  .rope.depth-100 .hanger {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    transform: scale(1);
  }
}
@media all and (min-width: 900px) {
 

  .background {
    bottom: 160px;
  }

 

  .light {
    margin: -160px -160px;
    background-size: 320px 320px;
    height: 320px;
    width: 320px;
  }
  .light.a {
    bottom: 112px;
    left: 15%;
  }
  .light.b {
    bottom: 160px;
  }
  .light.c {
    bottom: 208px;
  }
  .light.d {
    bottom: 176px;
  }
  .light.e {
    bottom: 208px;
  }
  .light.f {
    bottom: 128px;
    left: 85%;
  }

 

  .rope.depth-10 {
    top: 10%;
  }
  .rope.depth-10 .hanger {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    transform: scale(0.5);
  }

  

  .rope.depth-20 {
    top: 6.66667%;
  }
  .rope.depth-20 .hanger {
    -webkit-transform: scale(0.56111);
    -moz-transform: scale(0.56111);
    transform: scale(0.56111);
  }

 

  .rope.depth-30 {
    top: 3.33333%;
  }
  .rope.depth-30 .hanger {
    -webkit-transform: scale(0.62222);
    -moz-transform: scale(0.62222);
    transform: scale(0.62222);
  }

  

  .rope.depth-40 {
    top: 0.0%;
  }
  .rope.depth-40 .hanger {
    -webkit-transform: scale(0.68333);
    -moz-transform: scale(0.68333);
    transform: scale(0.68333);
  }

  

  .rope.depth-50 {
    top: -3.33333%;
  }
  .rope.depth-50 .hanger {
    -webkit-transform: scale(0.74444);
    -moz-transform: scale(0.74444);
    transform: scale(0.74444);
  }


  .rope.depth-60 {
    top: -6.66667%;
  }
  .rope.depth-60 .hanger {
    -webkit-transform: scale(0.80556);
    -moz-transform: scale(0.80556);
    transform: scale(0.80556);
  }

 

  .rope.depth-70 {
    top: -10.0%;
  }
  .rope.depth-70 .hanger {
    -webkit-transform: scale(0.86667);
    -moz-transform: scale(0.86667);
    transform: scale(0.86667);
  }

 
  .rope.depth-80 {
    top: -13.33333%;
  }
  .rope.depth-80 .hanger {
    -webkit-transform: scale(0.92778);
    -moz-transform: scale(0.92778);
    transform: scale(0.92778);
  }

  .wave.depth-90 {
    bottom: -34px;
    margin: 0px 0px;
    background-size: 612px 244.8px;
    height: 245px;
  }
  

  .rope.depth-90 {
    top: -16.66667%;
  }
  .rope.depth-90 .hanger {
    -webkit-transform: scale(0.98889);
    -moz-transform: scale(0.98889);
    transform: scale(0.98889);
  }

 

  .rope.depth-100 {
    top: -20%;
  }
  .rope.depth-100 .hanger {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    transform: scale(1.05);
  }
}
@media all and (min-width: 1200px) {
  

 

  .light {
    margin: -200px -200px;
    background-size: 400px 400px;
    height: 400px;
    width: 400px;
  }



  .rope.depth-10 {
    top: 5%;
  }
  .rope.depth-10 .hanger {
    -webkit-transform: scale(0.6);
    -moz-transform: scale(0.6);
    transform: scale(0.6);
  }

  

  .rope.depth-20 {
    top: 1.66667%;
  }
  .rope.depth-20 .hanger {
    -webkit-transform: scale(0.67778);
    -moz-transform: scale(0.67778);
    transform: scale(0.67778);
  }

 

  .rope.depth-30 {
    top: -1.66667%;
  }
  .rope.depth-30 .hanger {
    -webkit-transform: scale(0.75556);
    -moz-transform: scale(0.75556);
    transform: scale(0.75556);
  }

  

  .rope.depth-40 {
    top: -5.0%;
  }
  .rope.depth-40 .hanger {
    -webkit-transform: scale(0.83333);
    -moz-transform: scale(0.83333);
    transform: scale(0.83333);
  }

 

  .rope.depth-50 {
    top: -8.33333%;
  }
  .rope.depth-50 .hanger {
    -webkit-transform: scale(0.91111);
    -moz-transform: scale(0.91111);
    transform: scale(0.91111);
  }

 

  .rope.depth-60 {
    top: -11.66667%;
  }
  .rope.depth-60 .hanger {
    -webkit-transform: scale(0.98889);
    -moz-transform: scale(0.98889);
    transform: scale(0.98889);
  }

  

  .rope.depth-70 {
    top: -15.0%;
  }
  .rope.depth-70 .hanger {
    -webkit-transform: scale(1.06667);
    -moz-transform: scale(1.06667);
    transform: scale(1.06667);
  }

 

  .rope.depth-80 {
    top: -18.33333%;
  }
  .rope.depth-80 .hanger {
    -webkit-transform: scale(1.14444);
    -moz-transform: scale(1.14444);
    transform: scale(1.14444);
  }

 

  .rope.depth-90 {
    top: -21.66667%;
  }
  .rope.depth-90 .hanger {
    -webkit-transform: scale(1.22222);
    -moz-transform: scale(1.22222);
    transform: scale(1.22222);
  }

 

  .rope.depth-100 {
    top: -25%;
  }
  .rope.depth-100 .hanger {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    transform: scale(1.3);
  }
}
a, button {
  -webkit-transition: color 0.6s cubic-bezier(0.165, 0.84, 0.44, 1), background-color 0.6s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  -moz-transition: color 0.6s cubic-bezier(0.165, 0.84, 0.44, 1), background-color 0.6s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: color 0.6s cubic-bezier(0.165, 0.84, 0.44, 1), background-color 0.6s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.cross, .x, .y {
  -webkit-transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  -moz-transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.about .panel,
.about .cables {
  -webkit-transition: all 0.8s cubic-bezier(0.77, 0, 0.175, 1);
  -moz-transition: all 0.8s cubic-bezier(0.77, 0, 0.175, 1);
  transition: all 0.8s cubic-bezier(0.77, 0, 0.175, 1);
}

@-webkit-keyframes phase {
  0% {
    opacity: 1;
  }

  25% {
    opacity: 0.4;
  }

  50% {
    opacity: 0.8;
  }

  75% {
    opacity: 0.4;
  }

  100% {
    opacity: 1;
  }
}

@-moz-keyframes phase {
  0% {
    opacity: 1;
  }

  25% {
    opacity: 0.4;
  }

  50% {
    opacity: 0.8;
  }

  75% {
    opacity: 0.4;
  }

  100% {
    opacity: 1;
  }
}

@-ms-keyframes phase {
  0% {
    opacity: 1;
  }

  25% {
    opacity: 0.4;
  }

  50% {
    opacity: 0.8;
  }

  75% {
    opacity: 0.4;
  }

  100% {
    opacity: 1;
  }
}

@keyframes phase {
  0% {
    opacity: 1;
  }

  25% {
    opacity: 0.4;
  }

  50% {
    opacity: 0.8;
  }

  75% {
    opacity: 0.4;
  }

  100% {
    opacity: 1;
  }
}

@-webkit-keyframes tilt {
  0% {
    -webkit-transform: rotateX(-30deg);
    -moz-transform: rotateX(-30deg);
    transform: rotateX(-30deg);
  }

  25% {
    -webkit-transform: rotateX( 30deg);
    -moz-transform: rotateX( 30deg);
    transform: rotateX( 30deg);
  }

  50% {
    -webkit-transform: rotateY(-30deg);
    -moz-transform: rotateY(-30deg);
    transform: rotateY(-30deg);
  }

  75% {
    -webkit-transform: rotateY( 30deg);
    -moz-transform: rotateY( 30deg);
    transform: rotateY( 30deg);
  }

  100% {
    -webkit-transform: rotateZ( 20deg);
    -moz-transform: rotateZ( 20deg);
    transform: rotateZ( 20deg);
  }
}

@-moz-keyframes tilt {
  0% {
    -webkit-transform: rotateX(-30deg);
    -moz-transform: rotateX(-30deg);
    transform: rotateX(-30deg);
  }

  25% {
    -webkit-transform: rotateX( 30deg);
    -moz-transform: rotateX( 30deg);
    transform: rotateX( 30deg);
  }

  50% {
    -webkit-transform: rotateY(-30deg);
    -moz-transform: rotateY(-30deg);
    transform: rotateY(-30deg);
  }

  75% {
    -webkit-transform: rotateY( 30deg);
    -moz-transform: rotateY( 30deg);
    transform: rotateY( 30deg);
  }

  100% {
    -webkit-transform: rotateZ( 20deg);
    -moz-transform: rotateZ( 20deg);
    transform: rotateZ( 20deg);
  }
}

@-ms-keyframes tilt {
  0% {
    -webkit-transform: rotateX(-30deg);
    -moz-transform: rotateX(-30deg);
    transform: rotateX(-30deg);
  }

  25% {
    -webkit-transform: rotateX( 30deg);
    -moz-transform: rotateX( 30deg);
    transform: rotateX( 30deg);
  }

  50% {
    -webkit-transform: rotateY(-30deg);
    -moz-transform: rotateY(-30deg);
    transform: rotateY(-30deg);
  }

  75% {
    -webkit-transform: rotateY( 30deg);
    -moz-transform: rotateY( 30deg);
    transform: rotateY( 30deg);
  }

  100% {
    -webkit-transform: rotateZ( 20deg);
    -moz-transform: rotateZ( 20deg);
    transform: rotateZ( 20deg);
  }
}

@keyframes tilt {
  0% {
    -webkit-transform: rotateX(-30deg);
    -moz-transform: rotateX(-30deg);
    transform: rotateX(-30deg);
  }

  25% {
    -webkit-transform: rotateX( 30deg);
    -moz-transform: rotateX( 30deg);
    transform: rotateX( 30deg);
  }

  50% {
    -webkit-transform: rotateY(-30deg);
    -moz-transform: rotateY(-30deg);
    transform: rotateY(-30deg);
  }

  75% {
    -webkit-transform: rotateY( 30deg);
    -moz-transform: rotateY( 30deg);
    transform: rotateY( 30deg);
  }

  100% {
    -webkit-transform: rotateZ( 20deg);
    -moz-transform: rotateZ( 20deg);
    transform: rotateZ( 20deg);
  }
}

@-webkit-keyframes wave {
  0% {
    -webkit-transform: rotateZ(0deg) translate3d(0,10%,0) rotateZ(0deg);
    -moz-transform: rotateZ(0deg) translate3d(0,10%,0) rotateZ(0deg);
    transform: rotateZ(0deg) translate3d(0,10%,0) rotateZ(0deg);
  }

  100% {
    -webkit-transform: rotateZ(360deg) translate3d(0,10%,0) rotateZ(-360deg);
    -moz-transform: rotateZ(360deg) translate3d(0,10%,0) rotateZ(-360deg);
    transform: rotateZ(360deg) translate3d(0,10%,0) rotateZ(-360deg);
  }
}

@-moz-keyframes wave {
  0% {
    -webkit-transform: rotateZ(0deg) translate3d(0,10%,0) rotateZ(0deg);
    -moz-transform: rotateZ(0deg) translate3d(0,10%,0) rotateZ(0deg);
    transform: rotateZ(0deg) translate3d(0,10%,0) rotateZ(0deg);
  }

  100% {
    -webkit-transform: rotateZ(360deg) translate3d(0,10%,0) rotateZ(-360deg);
    -moz-transform: rotateZ(360deg) translate3d(0,10%,0) rotateZ(-360deg);
    transform: rotateZ(360deg) translate3d(0,10%,0) rotateZ(-360deg);
  }
}

@-ms-keyframes wave {
  0% {
    -webkit-transform: rotateZ(0deg) translate3d(0,10%,0) rotateZ(0deg);
    -moz-transform: rotateZ(0deg) translate3d(0,10%,0) rotateZ(0deg);
    transform: rotateZ(0deg) translate3d(0,10%,0) rotateZ(0deg);
  }

  100% {
    -webkit-transform: rotateZ(360deg) translate3d(0,10%,0) rotateZ(-360deg);
    -moz-transform: rotateZ(360deg) translate3d(0,10%,0) rotateZ(-360deg);
    transform: rotateZ(360deg) translate3d(0,10%,0) rotateZ(-360deg);
  }
}

@keyframes wave {
  0% {
    -webkit-transform: rotateZ(0deg) translate3d(0,10%,0) rotateZ(0deg);
    -moz-transform: rotateZ(0deg) translate3d(0,10%,0) rotateZ(0deg);
    transform: rotateZ(0deg) translate3d(0,10%,0) rotateZ(0deg);
  }

  100% {
    -webkit-transform: rotateZ(360deg) translate3d(0,10%,0) rotateZ(-360deg);
    -moz-transform: rotateZ(360deg) translate3d(0,10%,0) rotateZ(-360deg);
    transform: rotateZ(360deg) translate3d(0,10%,0) rotateZ(-360deg);
  }
}


@-webkit-keyframes swing {
  0% {
    -webkit-transform: rotateZ(10deg);
    -moz-transform: rotateZ(10deg);
    transform: rotateZ(10deg);
  }

  100% {
    -webkit-transform: rotateZ(-10deg);
    -moz-transform: rotateZ(-10deg);
    transform: rotateZ(-10deg);
  }
}


@-moz-keyframes swing {
  0% {
    -webkit-transform: rotateZ(10deg);
    -moz-transform: rotateZ(10deg);
    transform: rotateZ(10deg);
  }

  100% {
    -webkit-transform: rotateZ(-10deg);
    -moz-transform: rotateZ(-10deg);
    transform: rotateZ(-10deg);
  }
}

@-ms-keyframes swing {
  0% {
    -webkit-transform: rotateZ(10deg);
    -moz-transform: rotateZ(10deg);
    transform: rotateZ(10deg);
  }

  100% {
    -webkit-transform: rotateZ(-10deg);
    -moz-transform: rotateZ(-10deg);
    transform: rotateZ(-10deg);
  }
}

@keyframes swing {
  0% {
    -webkit-transform: rotateZ(10deg);
    -moz-transform: rotateZ(10deg);
    transform: rotateZ(10deg);
  }

  100% {
    -webkit-transform: rotateZ(-10deg);
    -moz-transform: rotateZ(-10deg);
    transform: rotateZ(-10deg);
  }
}

html.mouse a:hover, html.mouse button:hover {
  -webkit-transition: color 0.2s cubic-bezier(0.165, 0.84, 0.44, 1), background-color 0.2s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  -moz-transition: color 0.2s cubic-bezier(0.165, 0.84, 0.44, 1), background-color 0.2s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: color 0.2s cubic-bezier(0.165, 0.84, 0.44, 1), background-color 0.2s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}
html.mouse a:hover {
  color: #ff755a;
}
html.mouse button:hover {
  background-color: #d92400;
  color: white;
}
html.mouse .toggle:hover .x, html.mouse .toggle:hover .y {
  background-color: white;
}
html.mouse .links a:hover {
  background-color: #d92400;
  color: white;
}

html.touch a.tap, html.touch button.tap {
  -webkit-transition: color 0s cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color 0s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -moz-transition: color 0s cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color 0s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: color 0s cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color 0s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
html.touch a.tap {
  color: #ff755a;
}
html.touch button.tap {
  background-color: #d92400;
  color: white;
}
html.touch .toggle.tap .x, html.touch .toggle.tap .y {
  background-color: white;
}
html.touch .links a.tap {
  background-color: #d92400;
  color: white;
}

#awwwards {
  position: absolute;
  z-index: 9999;
  top: 40px;
  left: 0;
}
#awwwards a {
  background-repeat: no-repeat;
  background-position: 0 0;
  text-indent: -999em;
  overflow: hidden;
  display: block;
  height: 105px;
  width: 70px;
}
#awwwards.left.black a {
  background-image: url(../../graphics/awwwards_sotd_black_left.png);
}
#awwwards.right.black a {
  background-image: url(../../graphics/awwwards_sotd_black_right.png);
}
#awwwards.left.white a {
  background-image: url(../../graphics/awwwards_sotd_white_left.png);
}
#awwwards.right.white a {
  background-image: url(../../graphics/awwwards_sotd_white_right.png);
}
#awwwards.left.green a {
  background-image: url(../../graphics/awwwards_sotd_green_left.png);
}
#awwwards.right.green a {
  background-image: url(../../graphics/awwwards_sotd_green_right.png);
}

@media (max-width: 767px) {
  #awwwards {
    display: none;
  }
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dppx) {
  #awwwards a {
    -webkit-background-size: 70px 105px;
    -moz-background-size: 70px 105px;
    -ie-background-size: 70px 105px;
    -o-background-size: 70px 105px;
    background-size: 70px 105px;
  }
  #awwwards a.left.black a {
    background-image: url(../../graphics/awwwards_sotd_black_left2x.png);
  }
  #awwwards a.right.black a {
    background-image: url(../../graphics/awwwards_sotd_black_right2x.png);
  }
  #awwwards a.left.white a {
    background-image: url(../../graphics/awwwards_sotd_white_left2x.png);
  }
  #awwwards a.right.white a {
    background-image: url(../../graphics/awwwards_sotd_white_right2x.png);
  }
  #awwwards a.left.green a {
    background-image: url(../../graphics/awwwards_sotd_green_left2x.png);
  }
  #awwwards a.right.green a {
    background-image: url(../../graphics/awwwards_sotd_green_right2x.png);
  }
}












/* ---------------     Imagens Fade ------------------  */


 /* relative, absolute, fixed */
 
#showcase { padding-top:50px; }
figure {}
.gallery { padding:0; margin: 0; width:100%;}
.gallery figure { padding:0; margin: 0;  width:100%;}
.clearfix:before,.clearfix:after{content:" ";display:table;} 
.clearfix:after{clear:both;} 
.clearfix{zoom:1;}


#showcase2 { padding-top:50px; }
figure2 {}
.gallery2 { padding:0; margin: 0; width:100%;}
.gallery2 figure2 { padding:0; margin: 0;  width:100%;}
.clearfix2:before,.clearfix:after{content:" ";display:table;} 
.clearfix2:after{clear:both;} 
.clearfix2{zoom:1;}


#showcase3 { padding-top:50px; }
figure3 {}
.gallery3 { padding:0; margin: 0; width:100%;}
.gallery3 figure3 { padding:0; margin: 0;  width:100%;}
.clearfix3:before,.clearfix:after{content:" ";display:table;} 
.clearfix3:after{clear:both;} 
.clearfix3{zoom:1;}



/*
#showcase4 { padding-top:50px; }
figure4 {}
.gallery4 { padding:0; margin: 0; width:100%;}
.gallery4 figure4 { padding:0; margin: 0;  width:100%;}
.clearfix4:before,.clearfix:after{content:" ";display:table;} 
.clearfix4:after{clear:both;} 
.clearfix4{zoom:1;}


.desktop_device .block_projects_slider_1 .image:hover .hover {background-color:#f29400; background-color:rgba(250, 150, 0, 0.75);}
.desktop_device .block_projects_slider_1 .image:hover .hover .icons li {top:50%; opacity:1; filter:alpha(opacity=100);}

.block_projects_slider_1 .image.hovered .hover {background-color:#f29400; background-color:rgba(250, 150, 0, 0.75); }
.block_projects_slider_1 .image.hovered .hover .icons li {top:50%; opacity:1; filter:alpha(opacity=100);}

.block_project_item .image {width:724px; float:left; position:relative;}
.block_project_item .image img {width:100%; height:auto; display:block;}



.hover {display:none;}
.hover {
	position:absolute;
	left:0px;
	right:0px;
	top:0px;
	bottom:0px;
}
.block_projects_slider_1 .hover .icons li {
	margin-left:0px;
	margin-top:-25px;
	display:block;
	position:absolute;
	left:50%;
	top:80%;
	opacity:0;
	filter:alpha(opacity=0);
}
.hover .icons li:first-child {
	margin-left:-25px;
}


#image:hover .hover {background-color:#f29400; background-color:rgba(250, 150, 0, 0.75);}
#image:hover .hover .icons li {top:50%; opacity:1; filter:alpha(opacity=100);}

#image2 img {width:250px}

#image{position:relative; background-color:#ffffff;}
#image img {display:block; width:100% }




figure2:hover .hover {background-color:#f29400; background-color:rgba(250, 150, 0, 0.75);}
figure2:hover .hover .icons li {top:50%; opacity:1; filter:alpha(opacity=100);}


figure2 img {width:250px;}

figure2 {width:724px; float:left; position:relative;}
figure2 img {width:100%; height:auto; display:block;}
*/


figure2 { float:left; }
figure2 .description { padding-bottom:26px;}


figure3 { float:left; }
figure3 .description { padding-bottom:26px;}

figure4 { float:left; }
figure4 .description { padding-bottom:26px;}

figure5 { float:left; }
figure5 .description { padding-bottom:26px;}

figure6 { float:left; }
figure6 .description { padding-bottom:26px;}



