
.relogio img {
	width: 55%;
	height: auto;
	position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -1%);
}


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

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


.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(../img/01.jpg) no-repeat 50% 100%;
  background-size: cover;
  position: absolute;
  bottom: 0 !important;
  width: 100%;
  left: 0;
  top: 0;
}


.rope {
  width: 87%;
  position: relative;
  left: 7%;
}


.rope.depth-10 {
  top: 0;
}


.rope.depth-20 {
  top: 0;
}


.rope.depth-30 {
  top: 0;
}


.rope.depth-40 {
  top: 0;
}


.rope.depth-50 {
  top: 0;
}

.rope.depth-60 {
  top: 0;
}


.rope.depth-70 {
  top: 0;
}


.rope.depth-80 {
  top: 0;
}


.rope.depth-90 {
  top: 0;
}

.rope.depth-900 {
  top: 0;
}
.rope.depth-1000 {
  top: 0;
}

.rope.depth-600 {
  top: 0
}

.rope.depth-300 {
  top: 0;
}

.rope.depth-100 {
  top: 0 !important;
}

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

@media screen and (max-width: 767px) {
	
	.rope {
    width: 250%;
    left: -100%;
	top: 11% !important;
}

.rope.depth-600 {
    top: 10%;
}



.relogio img {
    /*transform: translate(-50%, 7%);*/
	transform: translate(-38%, -8%);
	/*width: 58%;*/
	width: 87%;
	
}
 
}
