/* -- reset -- */
*{
	padding: 0;
	margin: 0;
	
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	
	-webkit-tap-highlight-color: transparent;
}
/* -- fim reset -- */


/* -- global --*/
@font-face{
	font-family: dinmedium;
    src: url(../media/dinmedium.ttf);
}

html{
	width: 100%;
	height: 100%;
	background: #535353;
}

body{
	height: auto;
	width: inherit;
	margin-left: auto;
	margin-right: auto;
	font-family: Georgia;
}

/* -- fim global -- */


/* -- point of view -- */
.screen{
	opacity: 0;
	width: 1255px;
	height: 500px;
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	background-color: #fff;
}

#bt_i{
	z-index: 10;
	left: 2%;
	top: 2%;
}

.frame{
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	display: none;
	overflow: hidden;
	position: absolute;
}

.frame_inner{
	position: absolute;
    top: 2%;
    left: 1%;
    width: 98%;
    height: 95%;
	z-index: 50;
    border: 2px solid #2E6AAE;
}

.bt{
	width: 5%;
	display: none;
	cursor: pointer;
	position: absolute;
}

.bt_fechar{
    position: absolute;
	cursor: pointer;
    right: 2%;
    width: 5%;
    top: 5%;
}

#creditos{
	width: 100%;
	height: 100%;
	background-color: #ffffff;
	z-index: 15;
	
	box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
	
	outline: 3px solid #3669B1;
	outline-offset: -10px;
}

#frame1{
	background-image: url(../media/frame1bg.svg);
	background-size: cover;
}

#eweg{
	position: absolute;
	top: 10%;
	left: 37.5%;
	width: 25%;
}

#bt_avancar_1{
	bottom: 2%;
	right: 1%;
}

#frame2{
	display: block;
	top: 0%;
	left: 0%;
	background-color: #D5E9F2;
	display: none;
}

.onda{
	position: absolute;
	width: 220%;
}

@-webkit-keyframes onda1{
    0%		{left: -5%;}
    100%	{left: -115%;}
} 

@keyframes onda1{
    0%		{left: -5%;}
    100%	{left: -115%;}
}

#onda1{
	bottom: 30%;
	animation-name: onda1;
    animation-duration: 7s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-direction: alternate;
	
	-webkit-animation-name: onda1;
	-webkit-animation-duration: 7s;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
	
	z-index: 10;
}

@-webkit-keyframes onda2{
    0%		{left: -120%;}
    100%	{left: 0%;}
} 

@keyframes onda2{
    0%		{left: -120%;}
    100%	{left: 0%;}
}

#onda2{
	bottom: 5%;
	animation-name: onda2;
    animation-duration: 8s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-direction: alternate;
	
	-webkit-animation-name: onda2;
	-webkit-animation-duration: 8s;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
	
	z-index: 20;
}

@-webkit-keyframes onda3{
    0%		{left: -10%;}
    100%	{left: -110%;}
} 

@keyframes onda3{
    0%		{left: -10%;}
    100%	{left: -110%;}
}

#onda3{
	bottom: -20%;
	animation-name: onda3;
    animation-duration: 9s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-direction: alternate;
	
	-webkit-animation-name: onda3;
	-webkit-animation-duration: 9s;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
	
	z-index: 30;
}

@keyframes rotate {
    from { background-position: 221% 0%; }
    to { background-position: 0% 0%; }
}

@-webkit-keyframes rotate {
    from { background-position: 221% 0%; }
    to { background-position: 0% 0%; }
}

#earth, #earth_fim{
	position: absolute;
	top: 15%;
	left: 5%;
	width: 27.1%;
    height: 67%;
	
	z-index: 40;
	
	box-shadow: inset 8px 36px 80px 36px rgb(0, 0, 0),
	inset -6px 0 12px 4px rgba(255, 255, 255, 0.3);
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
    background: url(../media/gradiente.svg);
	animation-iteration-count: infinite;
	animation-timing-function: linear;
	-webkit-animation-duration: 12s;
	-webkit-animation-name: rotate;
	animation-duration: 12s;
	animation-name: rotate;
    background-size: cover;
	border-radius: 50%;
}

.diamundial{
    position: absolute;
    width: 60%;
    top: 12%;
    left: 36%;
	z-index: 15;
	
	animation-iteration-count: infinite;
	animation-timing-function: ease;
	animation-duration: 2s;
	animation-name: sobedia;
	
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: 2s;
	-webkit-animation-name: sobedia;
}

.diamundial_off{
	top: 100%;
}

@keyframes sobedia {
	0%	{ top: 12% }
	50%	{ top: 15% }
    100%{ top: 12% }
}

@-webkit-keyframes sobedia {
	0%	{ top: 12% }
	50%	{ top: 15% }
    100%{ top: 12% }
}

.daagua{
	position: absolute;
    width: 60%;
    top: 37%;
    left: 36%;
    z-index: 25;
	
	animation-iteration-count: infinite;
	animation-timing-function: ease;
	animation-duration: 3s;
	animation-name: sobedaagua;
	
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: 3s;
	-webkit-animation-name: sobedaagua;
}

.daagua_off{
	top: 100%;
}

@keyframes sobedaagua {
	0%	{ top: 37% }
	50%	{ top: 35% }
    100%{ top: 37% }
}

@-webkit-keyframes sobedaagua {
	0%	{ top: 37% }
	50%	{ top: 35% }
    100%{ top: 37% }
}

#bt_anterior{
	bottom: 5%;
	left: 2%;
	z-index: 100;
}

#bt_avancar{
	bottom: 5%;
	right: 2%;
	z-index: 100;
}

.frame3texto1{
	position: absolute;
	top: 100%;
	left: 10%;
	width: 50%;
	z-index: 50;
	transition: 500ms;
	-webkit-transition: 500ms;
}

.frame3texto1_up{
	top: 15%;
}

.frame3texto2{
	position: absolute;
	top: 100%;
	left: 10%;
	width: 50%;
	z-index: 50;
	transition: 500ms;
	-webkit-transition: 500ms;
}

.frame3texto2_up{
	top: 35%;
}

.frame3texto3{
	position: absolute;
	top: 100%;
	left: 10%;
	width: 50%;
	z-index: 50;
	transition: 500ms;
	-webkit-transition: 500ms;
}

.frame3texto3_up{
	top: 80%;
}

.gota{
	position: absolute;
    width: 2%;
	z-index: 50;
	display: none;
}

#gota1{
	top: 20%;
	left: 80%;
}

#gota2{
	top: 25%;
	left: 78.5%;
}

#gota3{
	top: 25%;
	left: 81.5%;
}

#gota4{
	top: 30%;
	left: 77%;
}

#gota5{
	top: 30%;
	left: 83%;
}

#gota6{
	top: 35%;
	left: 75.5%;
}

#gota7{
	top: 35%;
	left: 84.5%;
}

#gota8{
	top: 40%;
	left: 74%;
}

#gota9{
	top: 40%;
	left: 86%;
}

#gota10{
	top: 45%;
	left: 72.5%;
}

#gota11{
	top: 45%;
	left: 87.5%;
}

#gota12{
	top: 50%;
	left: 71%;
}

#gota13{
	top: 50%;
	left: 89%;
}

#gota14{
	top: 30%;
	left: 80%;
}

#gota15{
	top: 35%;
	left: 78.5%;
}

#gota16{
	top: 35%;
	left: 81.5%;
}

#gota17{
	top: 40%;
	left: 77%;
}

#gota18{
	top: 40%;
	left: 83%;
}

#gota19{
	top: 45%;
	left: 75.5%;
}

#gota20{
	top: 45%;
	left: 84.5%;
}

#gota21{
	top: 50%;
	left: 74%;
}

#gota22{
	top: 50%;
	left: 86%;
}

#gota23{
	top: 55%;
	left: 72.5%;
}

#gota24{
	top: 55%;
	left: 87.5%;
}

#gota25{
	top: 60%;
	left: 71%;
}

#gota26{
	top: 60%;
	left: 89%;
}

#gota27{
	top: 40%;
	left: 80%;
}

#gota28{
	top: 45%;
	left: 78.5%;
}

#gota29{
	top: 45%;
	left: 81.5%;
}

#gota30{
	top: 50%;
	left: 77%;
}

#gota31{
	top: 50%;
	left: 83%;
}

#gota32{
	top: 55%;
	left: 75.5%;
}

#gota33{
	top: 55%;
	left: 84.5%;
}

#gota34{
	top: 60%;
	left: 74%;
}

#gota35{
	top: 60%;
	left: 86%;
}

#gota36{
	top: 65%;
	left: 72.5%;
}

#gota37{
	top: 65%;
	left: 87.5%;
}

#gota38{
	top: 50%;
    left: 80%;
}

#gota39{
	top: 55%;
	left: 78.5%;
}

#gota40{
	top: 55%;
	left: 81.5%;
}

#gota41{
	top: 60%;
	left: 77%;
}

#gota42{
	top: 60%;
	left: 83%;
}

#gota43{
	top: 65%;
    left: 75.5%;
}

#gota44{
	top: 65%;
	left: 84.5%;
}

#gota45{
	top: 70%;
	left: 74%;
}

#gota46{
	top: 70%;
	left: 86%;
}

#gota47{
	top: 60%;
    left: 80%;
}

#gota48{
	top: 65%;
	left: 78.5%;
}

#gota49{
	top: 65%;
	left: 81.5%;
}

#gota50{
	top: 70%;
	left: 77%;
}

#gota51{
	top: 70%;
	left: 83%;
}


#gota52{
	top: 70%;
    left: 80%;
}

#gota53{
	top: 75%;
	left: 78.5%;
}

#gota54{
	top: 75%;
	left: 81.5%;
}

.frame4texto1{
	position: absolute;
	top: 100%;
	left: 5%;
	width: 90%;
	z-index: 50;
	transition: 500ms;
	-webkit-transition: 500ms;
}

.frame4texto1_up{
	top: 10%;
}

.gota_grande{
	position: absolute;
    top: -40%;
	width: 10%;
	z-index: 50;
}

.click_video1, .click_video2, .click_video3, .click_video4, .click_video5, .click_video6{
	cursor: pointer;
	opacity: 0.2;
}

.video_iframe{
	position: absolute;
	top: 5%;
	left: 10%;
	width: 80%;
	height: 90%;
}

.gota_grande_on{
    top: 40%;
}

#gota_grande_1{
	left: 7%;
	transition: 500ms;
	-webkit-transition: 500ms;
}

#gota_grande_2{
	left: 22%;
	transition: 500ms;
	-webkit-transition: 500ms;
}

#gota_grande_3{
	left: 37%;
	transition: 500ms;
	-webkit-transition: 500ms;
}

#gota_grande_4{
	left: 52%;
	transition: 500ms;
	-webkit-transition: 500ms;
}

#gota_grande_5{
	left: 67%;
	transition: 500ms;
	-webkit-transition: 500ms;
}

#gota_grande_6{
	left: 82%;
	transition: 500ms;
	-webkit-transition: 500ms;
}

.bt_quiz{
	position: absolute;
    right: 2%;
    bottom: 5%;
    width: 0%;
    height: 10%;
	border-radius: 30px;
    background-color: #2E6AAE;
	cursor: pointer;
	
	transition: 500ms;
	-webkit-transition: 500ms;
    z-index: 50;
}

.bt_quiz_on{
    width: 60%;
}

#quiztexto{
    position: absolute;
    top: 20%;
    left: 5%;
    width: 90%;
	display: none;
}

.pergunta_div{
	position: absolute;
	width: 100%;
	height: 100%;
	display: none;
}

.questao{
	position: absolute;
    width: 90%;
    top: 10%;
    left: 5%;
	display: none;
}

.alt{
	position: absolute;
	width: 4%;
	cursor: pointer;
	z-index: 50;
	display: none;
}

.q_alt{
	position: absolute;
	height: 10%;
	z-index: 50;
	display: none;
}

.bt_confirma{
	position: absolute;
    top: 87%;
    left: 74%;
    width: 20%;
	cursor: pointer;
    z-index: 50;
	display: none;
}

.bt_avancar_seta{
	position: absolute;
    top: 87%;
    left: 95%;
    height: 9%;
	cursor: pointer;
    z-index: 50;
	display: none;
}

#bt_alt1_1{
	top: 35%;
    left: 5%;
}

#bt_alt1_2{
	top: 55%;
    left: 5%;
}

#bt_alt1_3{
	top: 75%;
    left: 5%;
}

#q1_alt1{
	top: 38%;
    left: 12%;
}

#q1_alt2{
	top: 58%;
    left: 12%;
}

#q1_alt3{
	top: 78%;
    left: 12%;
}

#bt_alt2_1{
	top: 35%;
    left: 5%;
}

#bt_alt2_2{
	top: 55%;
    left: 5%;
}

#bt_alt2_3{
	top: 75%;
    left: 5%;
}

#q2_alt1{
	top: 38%;
    left: 12%;
}

#q2_alt2{
	top: 58%;
    left: 12%;
}

#q2_alt3{
	top: 78%;
    left: 12%;
}

#bt_alt3_1{
	top: 35%;
    left: 5%;
}

#bt_alt3_2{
	top: 55%;
    left: 5%;
}

#bt_alt3_3{
	top: 75%;
    left: 5%;
}

#q3_alt1{
	top: 38%;
    left: 12%;
}

#q3_alt2{
	top: 58%;
    left: 12%;
}

#q3_alt3{
	top: 78%;
    left: 12%;
}

#fim{
	z-index: 50;
}

#encerramento{
    position: absolute;
    top: 22%;
    left: 42%;
    width: 50%;
    z-index: 50;
}

#maos{
	position: absolute;
    top: 15%;
    left: -2%;
    height: 78%;
}

.maquina, .balde, .chuveiro, .torneira, .caneca, .ferramenta{
	position: absolute;
	z-index: 50;
    transition: 500ms;
    -webkit-transition: 500ms;
	display: none;
}

#maquina{
	width: 5%;
    top: 54%;
    left: 9.5%;
}

#maquina_in{
    top: 60%;
    left: 10.7%;
	width: 2.5%;
	
	animation-iteration-count: infinite;
	animation-timing-function: ease;
	animation-duration: 1s;
	
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: 1s;
}

@-webkit-keyframes giro{
    0%		{transform: rotate(0deg);}
    100%	{transform: rotate(360deg)}
} 

@keyframes giro{
    0%		{transform: rotate(0deg);}
    100%	{transform: rotate(360deg)}
}

#balde{
	top: 53%;
    left: 24.5%;
    width: 5%;
}

#balde_gota{
	top: 53%;
    left: 26.5%;
    width: 1%;
	
	animation-iteration-count: infinite;
	animation-timing-function: ease;
	animation-duration: 1s;
	
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: 1s;
}

@-webkit-keyframes gota{
    0%		{top: 53%; opacity: 1;}
    100%	{top: 57%; opacity: 0;}
} 

@keyframes gota{
    0%		{top: 53%; opacity: 1;}
    100%	{top: 57%; opacity: 0;}
}

#chuveiro{
    top: 54%;
    left: 39%;
	width: 5%;
}

#chuveiro_agua1{
	top: 55.5%;
    right: 58%;
    width: 0%;
	
	animation-iteration-count: infinite;
	animation-timing-function: ease;
	animation-duration: 1s;
	
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: 1s;
}

@-webkit-keyframes chuveiro1{
    0%		{width: 0%;}
    100%	{width: 1%;}
} 

@keyframes chuveiro1{
    0%		{width: 0%;}
    100%	{width: 1%;}
}

#chuveiro_agua2{
    top: 56.5%;
    right: 58%;
    width: 0%;
    
	animation-iteration-count: infinite;
	animation-timing-function: ease;
	animation-duration: 1s;
	
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: 1s;
}

#chuveiro_agua3{
	top: 57.5%;
    right: 57.8%;
    width: 0%;
	
	animation-iteration-count: infinite;
	animation-timing-function: ease;
	animation-duration: 1s;
	
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: 1s;
}

#torneira{
	top: 51%;
    left: 54.5%;
    width: 5%;
}

#torneira_gota{
	top: 65.7%;
    left: 54.3%;
    width: 1%;
	
	animation-iteration-count: infinite;
	animation-timing-function: ease;
	animation-duration: 2s;
	
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: 2s;
}

@-webkit-keyframes torneira_gota{
    0%		{width: 1%;}
    100%	{top: 72%; opacity: 0;}
} 

@keyframes torneira_gota{
    0%		{width: 1%;}
    100%	{top: 72%; opacity: 0;}
}

#caneca{
	top: 58%;
    left: 69.6%;
    width: 6%;
}

#caneca_fumaca1{
    bottom: 43%;
    left: 70.2%;
    height: 0%;
	
	animation-iteration-count: infinite;
	animation-timing-function: ease;
	animation-duration: 2000ms;
	
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: 2000ms;
}

@-webkit-keyframes fumaca1{
    0%		{height: 0%;}
    100%	{height: 10%; opacity: 0;}
} 

@keyframes fumaca1{
    0%		{height: 0%;}
    100%	{height: 10%; opacity: 0;}
}

#caneca_fumaca2{
    bottom: 43%;
    left: 71.5%;
    height: 0%;
	
	animation-iteration-count: infinite;
	animation-timing-function: ease;
	animation-duration: 1850ms;
	
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: 1850ms;
}

@-webkit-keyframes fumaca2{
    0%		{height: 0%;}
    100%	{height: 12%; opacity: 0;}
} 

@keyframes fumaca2{
    0%		{height: 0%;}
    100%	{height: 12%; opacity: 0;}
}

#caneca_fumaca3{
    bottom: 43%;
    left: 73%;
    height: 0%;
	
	animation-iteration-count: infinite;
	animation-timing-function: ease;
	animation-duration: 2000ms;
	
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: 2000ms;
}

@-webkit-keyframes fumaca3{
    0%		{height: 0%;}
    100%	{height: 10%; opacity: 0;}
} 

@keyframes fumaca3{
    0%		{height: 0%;}
    100%	{height: 10%; opacity: 0;}
}

#ferramenta1{
	top: 54%;
    left: 84%;
    width: 6%;
	
	transform-origin: center;
	animation-iteration-count: infinite;
	animation-timing-function: ease;
	animation-duration: 3000ms;
	/*animation-name: ferramenta1;*/
	
	-webkit-transform-origin: center;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: 3000ms;
	/*-webkit-animation-name: ferramenta1;*/
}

@-webkit-keyframes ferramenta1{
    0%		{transform: rotate(0deg);}
    100%	{transform: rotate(-360deg);}
} 

@keyframes ferramenta1{
    0%		{transform: rotate(0deg);}
    100%	{transform: rotate(-360deg);}
}

#ferramenta2{
	top: 54%;
    left: 84%;
    width: 6%;
	
	transform-origin: center;
	animation-iteration-count: infinite;
	animation-timing-function: ease;
	animation-duration: 3000ms;
	/*animation-name: ferramenta2;*/
	
	-webkit-transform-origin: center;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: 3000ms;
	/*-webkit-animation-name: ferramenta2;*/
}

@-webkit-keyframes ferramenta2{
    0%		{transform: rotate(0deg);}
    100%	{transform: rotate(360deg);}
} 

@keyframes ferramenta2{
    0%		{transform: rotate(0deg);}
    100%	{transform: rotate(360deg);}
}

#barraazul{
	position: absolute;
    top: 20%;
    left: 5%;
    width: 90%;
    height: 2px;
    background-color: #3669B1;
}

#creditos_titulo{
    position: absolute;
    width: 15%;
    top: 10%;
    left: 5%;
}

#layout{
	position: absolute;
    width: 24%;
    top: 30%;
    left: 5%;
}

#prog{
	position: absolute;
    width: 17%;
    top: 50%;
    left: 5%;
}

#videos{
	position: absolute;
    width: 68%;
    top: 68%;
    left: 5%;
}

.c_gota{
	position: absolute;
    height: 5%;
	z-index: 50;
}

#c_gota1{
	top: 20%;
	left: 85%;
}

#c_gota2{
	top: 24%;
	left: 84%;
}

#c_gota3{
	top: 24%;
	left: 86%;
}

#c_gota4{
	top: 28%;
	left: 83%;
}

#c_gota5{
	top: 28%;
	left: 87%;
}

#c_gota6{
	top: 32%;
	left: 82%;
}

#c_gota7{
	top: 32%;
	left: 88%;
}

#c_gota8{
	top: 36%;
	left: 81%;
}

#c_gota9{
	top: 36%;
	left: 89%;
}

#c_gota10{
	top: 40%;
	left: 80%;
}

#c_gota11{
	top: 40%;
	left: 90%;
}

#c_gota12{
	top: 44%;
	left: 79%;
}

#c_gota13{
	top: 44%;
	left: 91%;
}

#c_gota14{
	top: 28%;
	left: 85%;
}

#c_gota15{
	top: 32%;
	left: 84%;
}

#c_gota16{
	top: 32%;
	left: 86%;
}

#c_gota17{
	top: 36%;
	left: 83%;
}

#c_gota18{
	top: 36%;
	left: 87%;
}

#c_gota19{
	top: 40%;
	left: 82%;
}

#c_gota20{
	top: 40%;
	left: 88%;
}

#c_gota21{
	top: 44%;
	left: 81%;
}

#c_gota22{
	top: 44%;
	left: 89%;
}

#c_gota23{
	top: 48%;
	left: 80%;
}

#c_gota24{
	top: 48%;
	left: 90%;
}

#c_gota25{
	top: 52%;
	left: 79%;
}

#c_gota26{
	top: 52%;
	left: 91%;
}

#c_gota27{
	top: 36%;
	left: 85%;
}

#c_gota28{
	top: 40%;
	left: 84%;
}

#c_gota29{
	top: 40%;
	left: 86%;
}

#c_gota30{
	top: 44%;
	left: 83%;
}

#c_gota31{
	top: 44%;
	left: 87%;
}

#c_gota32{
	top: 48%;
	left: 82%;
}

#c_gota33{
	top: 48%;
	left: 88%;
}

#c_gota34{
	top: 52%;
	left: 81%;
}

#c_gota35{
	top: 52%;
	left: 89%;
}

#c_gota36{
	top: 56%;
	left: 80%;
}

#c_gota37{
	top: 56%;
	left: 90%;
}

#c_gota38{
	top: 44%;
    left: 85%;
}

#c_gota39{
	top: 48%;
	left: 84%;
}

#c_gota40{
	top: 48%;
	left: 86%;
}

#c_gota41{
	top: 52%;
	left: 83%;
}

#c_gota42{
	top: 52%;
	left: 87%;
}

#c_gota43{
	top: 56%;
    left: 82%;
}

#c_gota44{
	top: 56%;
	left: 88%;
}

#c_gota45{
	top: 60%;
	left: 81%;
}

#c_gota46{
	top: 60%;
	left: 89%;
}

#c_gota47{
	top: 52%;
    left: 85%;
}

#c_gota48{
	top: 56%;
	left: 84%;
}

#c_gota49{
	top: 56%;
	left: 86%;
}

#c_gota50{
	top: 60%;
	left: 83%;
}

#c_gota51{
	top: 60%;
	left: 87%;
}


#c_gota52{
	top: 60%;
    left: 85%;
}

#c_gota53{
	top: 64%;
	left: 84%;
}

#c_gota54{
	top: 64%;
	left: 86%;
}

.video{
	width: 100%;
	height: 100%;
	background-color: #ffffff;
	z-index: 100;
	
	box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
	
	outline: 3px solid #3669B1;
	outline-offset: -10px;
}

#vejamais{
	float: right;
	height: 10%;
	width: auto;
	cursor: pointer;
	display: none;
}