@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700;900&display=swap');

*{
	margin:0;
	padding:0;
	font-family: 'Poppins', sans-serif;
	box-sizing: border-box;
}

body{
  font-size: 14px;
  color: #000;
}

.header{
	display:flex;
	flex-basis:100%;
	flex-wrap:wrap;
	justify-content:flex-start;
	align-content:flex-start;
	align-items: flex-start;
	background:#000;
	background-image: url(../imagens/reservaIpes/fundo.png);
	background-size:cover;
	background-position: center;
	opacity:0.9;
	height:auto;
}

.header_item{
	display:flex;
	flex-basis:50%;
	flex-wrap:wrap;
	justify-content:center;
	align-items:flex-start;
}

.logo{
}

.logo img{
	transform:scale(0.7);
}

.header_item h1{
	position:relative;
	top:-30;
	color:#fff;
	flex-basis:80%;
	text-align:center;
	margin-bottom:20px;
	font-size:2em;
	font-weight: bold;
}

.header_item p{
	flex-basis:80%;
	color:#fff;
	font-size:1.2em;
	line-height: 30px;
	font-weight: 400;
}

.header_item p:last-child{
	margin-bottom:20px;
}

.formulario_container{
	display:flex;
	flex-basis:100%;
	flex-wrap:wrap;
	justify-content:center;
	align-content: flex-start;
}

.formulario{
	margin-top:40px;
	display:flex;
	width:360px;
	flex-wrap:wrap;
	justify-content:flex-start;
	align-content: flex-start;
	background:#85294a;
	padding:20px;
	border-radius:5px;
	transform:5s;
	margin-bottom:20px;
}

.formulario .formulario_titulo{
	flex-basis:100%;
	color:#fff;
	font-size:3em;
}

.formulario .formulario_subtitulo{
	flex-basis:100%;
	padding:3px;
	background:#f2bd24;
	text-align:center;
	margin-top:-10px;
	color:#85294a;
	margin-bottom:10px;
}

.formulario h6{
	font-size:1.5em;
	flex-basis:100%;
	text-align:center;
	color:#fff;
}

.formulario .saber_mais{
	ont-size:1em;
	flex-basis:100%;
	text-align:center;
	color:#fff;
}

.form{
	padding:10px;
	display:flex;
	flex-basis:100%;
	flex-wrap:wrap;
	justify-content:center;
	align-items:center;
}

.form label{
	display:flex;
	flex-basis:100%;
	flex-wrap:wrap;
}

.form label input{
	flex-basis:100%;
	padding:10px;
	margin-bottom:20px;
	border-radius:4px;
	border:0;
}

.form label .btn_enviar{
	background:#f2bd24;
	color:#fff;
	cursor:pointer;
	font-size:1.2em;
	font-weight: bold;
}

.form label .btn_enviar:hover{
	background: rgba(247,178,7,1.00);
}

.diferenciais{
	display:flex;
	flex-basis:100%;
	flex-wrap:wrap;
	justify-content:center;
	align-items:center;
	padding:40px;
}

.diferenciais h1{
	flex-basis:100%;
	font-size:2em;
	text-align:center;
	color:#85294a;
	font-weight:500;
	margin-bottom:20px;
}
.diferenciais p{
	max-width:920px;
	font-size:1.2em;
	flex-wrap:wrap;
	line-height: 40px;
}

.containers{
	margin-top:50px;
	position:relative;
	display:flex;
	flex-basis:100%;
	justify-content:space-around;
	align-items:flex-start;
	flex-wrap:wrap;
	padding:10px;
}

@media(max-width:1105px){
	.containers{
		height:auto;
}
}

@media(max-width:800px){
	.containers{
		height:auto;
}
}

.containers .card{
	position:relative;
	max-width:320px;
	height:220px;
	background:#fff;
	margin:30px 10px;
	padding:20px 15px;
	display:flex;
	flex-direction:column;
	align-items: flex-start;
	box-shadow: 0 5px 20px rgba(0,0,0,0.5);
	transition:0.5s;
	transition:0.3s ease-in-out;
	border-radius:4px;
	cursor:pointer;
}

.containers .card:hover{
	height:450px;
}

.containers .card .imgBx{
	position:relative;
	width:280px;
	height: 240px;
	top:-60px;
	left:6px;
	z-index:1;
	box-shadow: 0 5px 20px rgba(0,0,0,0.2);
}

.containers .card .imgBx img{
	width:100%;
	max-height:100%;
	height:240px;
	border-radius:4px;
	object-fit: cover;
}

.containers .card .content{
	position:relative;
	margin-top:-140px;
	padding:10px 15px;
	text-align:center;
	visibility:hidden;
	opacity: 0;
	transition: 0.3s ease-in-out;
}

.containers .card:hover .content{
	visibility: visible;
	opacity: 1;
	margin-top:-40px;
	transition-delay: 0.3s;
	height:180px;
}

.content h2{
	font-size:1.2em;
	margin-bottom:10px;
	color:#85294a
}

.content p{
	font-size:0.9em;
	text-align: left;
    flex-basis:100%;
}

.conclusao{
	display:flex;
	flex-basis:100%;
	flex-wrap:wrap;
	justify-content:center;
	align-items:center;
	background-image: linear-gradient(to bottom, rgba(112,31,31,0.61) 0%, rgba(112,31,31,0.61) 100%), url(../imagens/reservaIpes/fundoc.png);
	background-size:cover;
	background-position:center;
	min-height:550px;
	padding:20px;
}

.conclusao h1{
	color:rgb(242, 189, 36);;
	font-size:1.6em;
	flex-basis:90%;
	text-align:center;
	margin-bottom:20px;
}

.conclusao_info{
	display:flex;
	flex-basis:100%;
	flex-wrap:wrap;
	justify-content:center;
	align-content: flex-start;
	margin-bottom:30px;
}

.conclusao_info p{ 
	flex-basis:80%;
	text-align:center;
	color:#fff;
	font-size:1.2em;
	margin-bottom:20px;
}

.botao_video{
	margin-top:-100px;
	display:flex;
	flex-basis:100% !important;
	flex-wrap:wrap;
	justify-content:center;
	align-content: flex-start;
}

.conclusao a{
	text-decoration:none;
	padding:14px 30px;
	background:#f2bd24;
	color:#fff;
	text-align:center;
	font-weight:bold;
}

.trailer{
	position:fixed;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	z-index:10000;
	background:rgba(0,0,0,0.95);
	width:100%;
	height:100%;
	display:flex;
	justify-content:center;
	align-items:center;
	visibility: hidden;
	opacity:0;
}

.trailer.active{
	visibility:visible;
	opacity:1;
}

.trailer video{
	position:relative;
	max-width:900px;
	outline:none;
}

.close{
	position:absolute;
	top:30px;
	right:30px;
	cursor:pointer;
	filter:invert(1);
	max-width:64px;
}
	
.rodape{
	flex-basis:100%;
	padding:20px;
	background:#85294a;
}

.rodape p{
	text-align:center;
	color:#fff;
	font-size:0.6em;
}

/** RESPONSIVO **/
@media(max-width:1145px){
	.header_item{
	display:flex;
	flex-basis:40%;
	flex-wrap:wrap;
	justify-content:center;
	align-items:flex-start;
}
}

@media(max-width:991px){
	.trailer video{
		max-width:90%;
	}
}

@media(max-width:890px){
	.header{
	display:flex;
	flex-basis:100%;
	flex-wrap:wrap;
	justify-content:center;
	align-content:flex-start;
	align-items: flex-start;
	}
	
	.header_item{
	display:flex;
	flex-basis:100%;
	flex-wrap:wrap;
	justify-content:center;
	align-items:flex-start;
	margin-bottom:20px;	
}
}

@media(max-width:520px){
	.logo img{
	transform:scale(0.65);
	width:100%;
}

.header_item h1{
	position:relative;
	top:-30;
	color:#fff;
	flex-basis:70%;
	text-align:center;
	margin-bottom:20px;
	font-size:1.8em;
	font-weight: bold;
}

.header_item p{
	flex-basis:70%;
	color:#fff;
	font-size:1em;
	line-height: 30px;
	font-weight: 500;
}

.formulario{
	margin-top:40px;
	display:flex;
	width:340px;
	flex-wrap:wrap;
	justify-content:flex-start;
	align-content: flex-start;
	background:#85294a;
	padding:20px;
	border-radius:5px;
	transform:5s;
}
	
.diferenciais h1{
	flex-basis:100%;
	font-size:1.6em;
	text-align:center;
	color:#85294a;
	font-weight:500;
	margin-bottom:20px;
}
.diferenciais p{
	width:80%;
	font-size:1.1em;
	flex-wrap:wrap;
	line-height: 40px;
}
	
.conclusao h1{
		flex-basis:90%;
		font-size:1.4em;
	}

.conclusao p{  
	flex-basis:70%;
	text-align:center;
	color:#fff;
	font-size:1em;
}
	
.rodape p{
		font-size:0.65em;
	}			
}

/*Alerta*/
.alerta{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	flex-basis:100%;
	border-radius: 4px;
	property-webkit-border-radius: 4px;
	property-moz-border-radius: 4px;
	property-o-border-radius:4px;
	property-ms-border-radius:4px;
	margin-bottom:20px;
}


.alerta_sucesso{
	display:flex;
	flex-wrap:wrap;
	flex-basis:100%;
	justify-content: center;
	padding:8px 10px;
	background:#28a745;
	color:#fff;
	font-size:0.9em;
}