/*
Theme: Ativas
Theme URI: ativascorretora.com.br
Description: Site desenvolvido para Ativas - Contact Center
Author: Antonio Pereira
Author URI: bemmais.com
Version: 1.0
*/



/* -- IMPORTS -- */

@font-face {
	font-family: EncodeSans-Regular;
	src: url(fonts/EncodeSans-Regular.ttf);
}
@font-face {
	font-family: EncodeSans-Medium;
	src: url(fonts/EncodeSans-Medium.ttf);
}
@font-face {
	font-family: EncodeSans-Bold;
	src: url(fonts/EncodeSans-Bold.ttf);
}
@font-face {
	font-family: EncodeSans-ExtraBold;
	src: url(fonts/EncodeSans-ExtraBold.ttf);
}
@font-face {
	font-family: EncodeSans-Black;
	src: url(fonts/EncodeSans-Black.ttf);
}



/* -- SETTINGS -- */

*{
	margin: 0 auto;
}
a{
	text-decoration: none;
}
.main-content{
	width: 80%;
	margin: 0 10%;	
}
.flex{
	display: flex;
}
.flex-important{
	display: flex;
}
.none-display, .fx-none, .block-display{
	display: none;
}
.fx-block{
	display: block;
}
.seta-off{
	background-image: url("img/s4-seta-off.png");
	background-repeat: no-repeat;
	background-position: center center;
}
.seta-on{
	background-image: url("img/s4-seta-on.png");
	background-repeat: no-repeat;
	background-position: center center;
}
h1{
	font-size: 1.5em!important;
}
.carousel-control-prev{
    width: 10%!important;
}
.carousel-control-next{
    width: 10%!important;
}
.carousel-control-prev-icon{
	background-image: url('img/prev.png')!important;
    width: 27px!important;
}
.carousel-control-next-icon{
	background-image: url('img/next.png')!important;
    width: 27px!important;
}

#fixed-btns{
	position: fixed;
	padding-left: 2%;
	padding-top: 12%;
	z-index: 11;
}
#fixed-btns .fixed-btn{
	display: flex;
	margin-bottom: 20px;
}
#fixed-btns .fixed-btn .fixed-cont{
	background-color: #d39b00;
	align-self: center;
	height: 75px;
	margin-left: -38px;
	padding: 23px 50px;
	padding-right: 25px;
	border-radius: 0 75px 75px 0;
	font-family: EncodeSans-Bold;
	color: #322f28;
}
#fixed-btns .fixed-btn .fixed-cont a{
	text-decoration: underline;
	color: #322f28;

}
#fixed-btns .fixed-btn .fixed-cont img{
	margin: 0 5px;
}
#fixed-btns .fixed-btn .btn-img{
	z-index: 2;
	width: 75px;
	margin-left: 0;
	margin-right: 0;
}




/* -- HEADER -- */

header{
	width: 100%;
	padding: 20px 0;
	position: absolute;
}
header #menu{
	display: none;
}
header #logo{
	margin-left: 0;
	height: fit-content;
}
header ul{
	display: flex;
	margin-right: 0;
	padding: 35px 0;
}
header ul li{
	text-decoration: none;
	list-style: none;
	margin: 0 20px;
	font-family: EncodeSans-Black;
	color: #fff;
	text-shadow: 0px 0px 10px #333029;
	cursor: pointer;
}



/* -- INDEX -- */

#section1, #section1 img{
	width: 100%;
}

#section2{
	width: 100%;
	background-color: #333029;
	padding-bottom: 50px;
	margin-top: -3px;
}
#section2 #s2-cont{
	margin-top: -4%;
}
#section2 .box{
	width: 30%;
	padding: 50px 0;
	background-color: #4d4b43;
	border-radius: 15px;
}
#section2 .box h1{
	max-width: 90%;
	text-align: center;
	margin: 25px auto;
	color: #fff;
	font-family: EncodeSans-Black;
}
#section2 .box p{
	font-family: EncodeSans-Regular;
	max-width: 90%;
	text-align: justify;
	color: #a6a396;
}
#section2 #seta{
	margin-top: 50px;
}
#section2 #seta img{
	cursor: pointer;
}

#section3{
	width: 100%;
	background-color: #333029;
	padding-top: 50px;
	background-image: url('img/s3-back.png');
	background-size: 100%;
	background-position: bottom;
	background-repeat: no-repeat;
}
#section3 h1{
	text-align: center;
	color: #fff;
	font-family: EncodeSans-Black;
	margin-bottom: 25px;
}
#section3 p{
	color: #a6a396;
	text-align: justify;
	text-align-last: center;
}
#section3 .flex{
	margin-top: 50px;
	padding: 25px 2%;
	background-color: #4d4b43;
	border-radius: 15px;
}
#section3 .flex .box{
	width: 30%;
	padding: 50px 0;
	border-radius: 15px;
}
#section3 .flex .box #title{
	text-align: center;
	color: #d39b00;
	font-family: EncodeSans-ExtraBold;
	margin-bottom: 10px;
}
#section3 .flex .box p{
	max-width: 90%;
}

#section4{
	background-color: #e6e3d8;
	margin-top: -1px;
	padding-top: 100px;
}
#section4 h1{
	text-align: center;
	color: #333029;
	font-family: EncodeSans-Black;
	margin-bottom: 25px;
}
#section4 .flex{
	width: 100%;
}
#section4 .btn{
	width: 25%;
	display: flex;
	border-radius: 15px;
	margin-bottom: 25px;
	padding: 0;
}
#section4 .esq{
	width: 70%;
	text-align: center;
	padding: 40px 0;
	background-color: #4d4b43;
	font-family: EncodeSans-Bold;
	color: #a6a396;
	border-radius: 15px 0 0 15px;
}
#section4 .dir{
	width: 30%;
	background-color: #333029;
	border-radius: 0px 15px 15px 0px;
}
#section4 #dinamic-cont{
	margin-top: 50px;
}
#section4 #dinamic-esq{
	width: 60%;
}
#section4 #dinamic-esq img{
	width: 80%;
	margin-left: 10%;
}
#section4 #dinamic-dir{
	width: 40%;
	align-self: center;
	text-align: justify;
	color: #4d4b43;
	font-family: EncodeSans-Regular;
}
#section4 #dinamic-dir h1{
	text-align: left;
}
#section4 #bottom{
	width: 100%;
}
#section4 #back-left{
	position: absolute;
    width: 10%;
    left: 2%;
    margin-top: 35%;
}
#section4 #back-left{
	position: absolute;
    width: 10%;
    left: 2%;
    margin-top: 35%;
}
#section4 #back-right{
	position: absolute;
    right: 0;
    margin-top: 20%;
    width: 9%;
}

#section5{
	background-color: #333029;
	padding-bottom: 50px;
	margin-top: -4px;
}
#section5 h1{
	text-align: center;
	color: #fff;
	font-family: EncodeSans-Black;
	margin-bottom: 0;
}
#section5 h1 span{
	color: #d39b00;
}
#section5 p{
	color: #a6a396;
	text-align: center;
	font-family: EncodeSans-Regular;
	margin: 25px 0;
	margin-bottom: 40px;
}
#section5 form{
	width: 70%;
	margin-left: 15%;
}
#section5 form input, #section5 form select, #section5 form textarea{
	font-family: EncodeSans-Regular;
	color: #a6a396;
	background-color: #4d4b43;
	padding: 15px 2%;
	border: none;
	border-radius: 15px;
	margin-bottom: 15px;
}
#section5 form textarea{
	height: 150px;
}
#section5 form input::placeholder{
	color: #a6a396;
}
#section5 .center-input{
	width: 100%;
	margin-left: 0;
}
#section5 .esq-input{
	width: 49%;
	margin-left: -2%;
}
#section5 .dir-input{
	width: 49%;
	margin-right: 0;
	float: right;
}
#section5 form select{
	background-image: url('img/s5-seta.png');
	background-repeat: no-repeat;
	background-position: center right;
	appearance: none;
}
#section5 form input[type='submit']{
	color: #333029;
	background-color: #d39b00;
	font-family: EncodeSans-Black;
	padding: 15px 40px;
	margin-top: 15px;
}

#section6{
	width: 100%;
	padding: 50px 0;
	background-color: #e6e3d8;
}
#section6 h1{
	text-align: center;
	color: #fff;
	font-family: EncodeSans-Black;
	margin-bottom: 25px;
	color: #d39b00;
}
#section6 #parceiros{
    width: 80%;
    margin-left: 10%;
    display: flex;
    margin-top: 25px;
}
#section6 #parceiro{
    width: 25%;
    padding: 0 2%;
    align-self: center;
}
#section6 #parceiro img{
    max-width: 100%;
}

#section7 iframe{
	margin-bottom: -6px;
}



/* -- FOOTER -- */

footer{
	padding-top: 50px;
	background-color: #333029;
}
footer #sociais{
    width: max-content;
    margin-bottom: 25px;
}
footer p{
	font-family: EncodeSans-Regular;
	text-align: center;
	color: #e6e3d8;
	margin-bottom: 25px;
}
footer #bottom{
	background-color: #4d4b43;
	width: max-content;
	padding: 15px 40px;
	padding-bottom: 5px;
	border-radius: 15px 15px 0 0;
	color: #e6e3d8;
}
footer #bottom p{
	margin-bottom: 0;
}
footer #bottom p a{
	text-decoration: none;
	color: #e6e3d8;
	font-family: EncodeSans-Medium;
}



/* -- MOBILE -- */

@media only screen and (max-width: 1300px){

	/* -- HEADER -- */

	header{
		background-color: #333029;
		position: initial;
		min-height: 140px;
		padding: 0;
	}
	header #menu{
		display: block;
		position: absolute;
		right: 5%;
		top: 10px;
	}
	header #menu img{
		height: 120px;
	}
	header #ul{
		display: none;
		margin-top: 135px;
		text-align: right;
		position: absolute;
		font-size: 22pt;
		right: 0%;
		background-color: rgb(51, 48, 41);
		padding: 15px 5%;
		border-bottom-left-radius: 15px;
	}
	header #ul li{
		padding: 10px 0;
	}
	header #logo{
		position: absolute;
		left: 5%;
		top: 10px;
		height: 120px;
	}



	/* -- SETTINGS -- */

	.main-content{
		width: 90%;
		margin: 0 5%;	
	}
	.flex{
		display: block;
	}
	h1{
		font-size: 30pt!important;
	}
	.block-display{
		display: block!important;
	}
	#fixed-btns{
		position: fixed;
		padding-left: 2%;
		padding-top: 12%;
	}
	#fixed-btns .fixed-btn{
		display: flex;
		margin-bottom: 20px;
	}
	#fixed-btns .fixed-btn .fixed-cont{
		background-color: #d39b00;
		align-self: center;
		height: 100px;
		margin-left: -38px;
		padding: 23px 50px;
		padding-right: 25px;
		border-radius: 0 75px 75px 0;
		font-family: EncodeSans-Bold;
		color: #322f28;
		font-size: 22pt;
	}
	#fixed-btns .fixed-btn .fixed-cont a{
		text-decoration: underline;
		color: #322f28;

	}
	#fixed-btns .fixed-btn .fixed-cont img{
		margin: 0 5px;
		height: 100%;
	}
	#fixed-btns .fixed-btn .btn-img{
		z-index: 2;
		width: 100px;
		margin-left: 0;
		margin-right: 0;
	}



	/* -- INDEX -- */

	#section2 #s2-cont{
		margin-top: -1%;
	}
	#section2 .box{
		width: 90%;
		padding: 50px 0;
		background-color: #4d4b43;
		border-radius: 15px;
		margin-bottom: 50px;
	}
	#section2 .box h1{
		max-width: 90%;
		text-align: center;
		margin: 25px auto;
		color: #fff;
		font-family: EncodeSans-Black;
	}
	#section2 .box p{
		font-size: 22pt;
	}
	#section2 #seta{
		margin-top: 50px;
	}
	#section2 #seta img{
		width: 50px;
		cursor: pointer;
	}
	
	#section3{
		width: 100%;
		background-color: #333029;
		padding-top: 50px;
		background-image: url('img/s3-back.png');
		background-size: 100%;
		background-position: bottom;
		background-repeat: no-repeat;
		margin-top: -1px;
	}
	#section3 p{
		color: #a6a396;
		text-align: justify;
		text-align-last: center;
		font-size: 22pt;
	}
	#section3 .flex{
		padding: 0 2%;
	}
	#section3 .flex .box{
		width: 100%;
		padding: 50px 0;
	}
	
	#section4{
		margin-top: -2px;
		padding-top: 50px;
	}
	#section4 p{
		font-size: 22pt;
	}
	#section4 h1{
		margin: 50px 0;
	}
	#section4 .flex{
		width: 100%;
	}
	#section4 #flex2{
		padding-bottom: 50px;
	}
	#section4 .btn{
		width: 100%;
	}
	#section4 .esq{
		font-size: 22pt;
	}
	#section4 #dinamic-cont{
		margin-top: 50px;
		display: none;
	}
	#section4 #back-left{
		display: none;
	}
	#section4 #back-right{
		display: none;
	}
	
	#section5{
		padding-top: 50px;
	}
	#section5 p{
		font-size: 22pt;
	}
	#section5 form{
		width: 100%;
		margin-left: 0%;
	}
	#section5 form input, #section5 form select{
		padding: 30px 2%;
		margin-bottom: 30px;
		font-size: 22pt;
	}
	#section5 form input::placeholder{
		color: #a6a396;
	}
	#section5 .esq-input{
		width: 100%;
		margin-left: 0;
	}
	#section5 .dir-input{
		width: 100%;
		float: none;
	}
	#section5 form select{
		background-image: url('img/s5-seta.png');
		background-repeat: no-repeat;
		background-position: center right;
		appearance: none;
		background-size: auto 100%;
	}
	#section5 form input[type='submit']{
		padding: 30px 80px;
		margin-top: 30px;
	}
	
	#section6{
		width: 100%;
		padding: 50px 0;
		background-color: #e6e3d8;
	}
	#section6 h1{
		text-align: center;
		color: #fff;
		font-family: EncodeSans-Black;
		margin-bottom: 25px;
		color: #d39b00;
	}
	#section7 iframe{
		margin-bottom: -6px;
		height: 600px;
	}

	footer{
		padding-top: 50px;
		background-color: #333029;
	}
	footer #sociais{
		width: max-content;
		margin-bottom: 25px;
	}
	footer #sociais img{
		width: 70px;
		margin: 0 10px;
	}
	footer p{
		font-size: 25pt;
	}
	footer #bottom{
		font-size: 25pt;
	}
}