.fase-2 {
	.tela {
		background-color: $bgVerde;
	}
	.box {
		.bg {
			height: 100%;
			top: 0;
			left: 0;
			background-color: $bgAmarelo;
			background-image: url('../img/content/tela-2-bg.svg');
		}
		.nuvem {
			position: absolute;
			background-size: contain;
			background-position: top left;
			background-repeat: no-repeat;
			&.nuvem-1 {
				background-image: url('../img/content/tela-2-nuvem-1.svg');
				height: 299px;
				width: 722px;
				left: 25px;
				top: 54px;
			}
			&.nuvem-2 {
				background-image: url('../img/content/tela-2-nuvem-2.svg');
				height: 271px;
				width: 592px;
				left: -25px;
				top: 3290px;
			}
			&.nuvem-3 {
				background-image: url('../img/content/tela-2-nuvem-1.svg');
				height: 331px;
				width: 802px;
				left: 1288px;
				top: 3021px;
			}
			&.nuvem-4 {
				background-image: url('../img/content/tela-2-nuvem-4.svg');
				height: 211px;
				width: 461px;
				left: 1529px;
				top: 275px;
			}
		}
	}
	.content {
		display: none;
	}
	.content-1 {
		.inputs {
			position: absolute;
			width: 1810px;
			left: 175px;
			top: 1351px;
			input {
				width: 100%;
				height: 259px;
				background: #ffffff;
				border-radius: 80px;
				margin-bottom: 50px;
				padding: 0 73px;
				line-height: 259px;
				font-size: 113px;
				color: $bgVinho;
				font-family: $worksans;
			}
			::-webkit-input-placeholder {
				/* Edge */
				color: $bgVinho;
				font-family: $pernambuco;
			}
			:-ms-input-placeholder {
				/* Internet Explorer 10-11 */
				color: $bgVinho;
				font-family: $pernambuco;
			}
			::placeholder {
				color: $bgVinho;
				font-family: $pernambuco;
			}
		}

		.bt {
			position: absolute;
			width: 1332px;
			height: 354px;
			left: 414px;
			top: 2477px;
			background: $bgAzul;
			border-radius: 200px;
			padding-left: 126px;
			color: #ffffff;
			font-size: 215px;
			line-height: 354px;
			.sol {
				position: absolute;
				width: 404px;
				height: 473px;
				top: -84px;
				right: 85px;
			}
		}
	}
	.content-2 {
		.photo {
			position: absolute;
			width: 1395px;
			height: 1973px;
			left: 382px;
			top: 808px;
			background: $bgAzul;
			padding: 40px 0 79px;
		}
		p {
			font-size: 94px;
			line-height: 113px;
			text-align: center;
			color: #ffffff;
			margin-bottom: 37px;
		}
		.camera {
			width: calc(100% - 78px);
			// width: calc(100% - 118px);
			height: 1703px;
			margin: 0 auto;
			// background-color: #fff;
			position: relative;
			transform: scale(1.3) rotate(90deg);
			-webkit-transform: scale(1.3) rotate(90deg);
			-moz-transform: scale(1.3) rotate(90deg);
			video,
			img {
				position: absolute;
				width: 100%;
				height: auto;
				top: 50%;
				left: 50%;
				display: none;
				transform: translate(-50%, -50%);
			}
		}
		.bt {
			position: absolute;
			width: 343px;
			height: 215px;
			top: 2830px;
			// top: 2184px;
			border-radius: 60px;
			background-repeat: no-repeat;
			background-position: center center;
			display: none;
		}
		.bt-photo {
			left: 936px;
			background-color: $bgVermelho2;
			background-image: url('../img/content/tela-2-camera.svg');
		}
		.bt-refresh {
			left: 710px;
			background-color: $bgVermelho2;
			background-image: url('../img/content/tela-2-refresh.svg');
		}
		.bt-ok {
			left: 1163px;
			background-color: $bgVerde;
			background-image: url('../img/content/tela-2-ok.svg');
		}
	}
	.tela-1 {
		.box {
			.nuvem {
				&.nuvem-1 {
					height: 437px;
					width: 1057px;
					left: 35px;
					top: 456px;
				}
				&.nuvem-2 {
					height: 371px;
					width: 812px;
					left: -25px;
					top: 3200px;
				}
				&.nuvem-3 {
					background-image: url('../img/content/tela-2-nuvem-1.svg');
					height: 437px;
					width: 1057px;
					left: 1065px;
					top: 2769px;
				}
				&.nuvem-4 {
					background-image: url('../img/content/tela-2-nuvem-4.svg');
					height: 371px;
					width: 812px;
					left: 1178px;
					top: 32px;
				}
			}
		}
		.content-1 {
			display: block;
		}
	}
	.tela-2 {
		.content-2 {
			display: block;
			.camera {
				video {
					display: block;
				}
			}
			.bt-photo {
				display: block;
			}
		}
	}
	.tela-3 {
		.content-2 {
			display: block;
			.camera {
				img {
					display: block;
				}
			}
			.bt-refresh,
			.bt-ok {
				display: block;
			}
		}
	}
}
