/* CSS CONTA 4U */

/* AGOSTO 2021 */

/* FRONT MARKETING */

/* SUPER T.I */ /* DIVISÃO NOVOS NEGÓCIOS */







html{scroll-behavior: smooth;}

:focus {outline:0 !important;}

body{
	zoom: 95%;
}



/*@keyframes bounce {
	0%, 20%, 60%, 80%, 100% {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	}

	40%{
	-webkit-transform: translateY(-20px);
	transform: translateY(-20px);
	}

	80%{
	-webkit-transform: translateY(-10px);
	transform: translateY(-10px);
	}
}

*/




/* TOPO */ /* TOPO */ /* TOPO */ /* TOPO */ 



.topo{

	background-color: rgb(10,19,63);

	padding: 8px;
}



.navbar .collapse .navbar-nav .nav-item .nav-link{

	font-size: 13px;

	margin-left: 10px;

	color: #fff;

}



.navbar .collapse .navbar-nav .nav-item .nav-link:hover{

	color: #70C0DC;

}







/* SLIDER */ /* SLIDER */ /* SLIDER */ /* SLIDER */ 





.slider-principal{

	background-color: #19575c; 

	background-image: url(../imgs/slider-principal.jpg);

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    background-attachment: fixed;

	

	background-blend-mode: overlay;



    display: flex;

    flex-direction: column;

    justify-content: center;

    padding-top: 65px;

}


.btn:hover{
	background-color: #eeeef0;
	color: #70C0DC;

}





.slider-principal h1{

	color: #fff;

	font-weight: bold;

	letter-spacing: 5px;

	padding-top: 50px;

}



.slider-principal h1 span{

	color: #eda340;

}



.slider-principal p{

	color: #fff;

	font-weight: lighter;

	margin-bottom: 35px;

	margin-top: 35px;

	letter-spacing: 3px;

}



.slider-principal a{

	text-decoration: none;

}



.slider-principal h5{

	color: #fff;

	border: 1px solid #fff;

	border-radius: 40px;

	text-align: center;

	width: 85%;

	padding: 13px;

	margin-bottom: 10px;

}





.slider-principal h5:hover{

	background-color: #fff;

	color: #3d2060;

}




.slider-principal img{

	margin-bottom: 50px;

}









/* FUNCIONALIDADES */ /* FUNCIONALIDADES */ /* FUNCIONALIDADES */ /* FUNCIONALIDADES */ 



.funcionalidades{

	padding: 50px 0 50px 0;

}



.funcionalidades h1{

	color: #481c71;

	font-weight: bold;

}



.funcionalidades h3{

	color: #481c71;

	font-weight: normal;

}



.funcionalidades h4{

	color: #481c71;

	font-weight: bold;

}



.funcionalidades img{

	margin-top: 44px;

	margin-bottom: 7px;

	width: 155px;

}



/*.funcionalidades img:hover{
	animation: bounce 1s;
}
*/


.funcionalidades a{

	text-decoration: none;

}



.funcionalidades h5{

	width: 100%;

	background-color: #3d2060;

	color: #fff;

	padding: 17px;

	text-align: center;

	border-radius: 40px;

	border: 1px solid #3d2060;

}



.funcionalidades h5:hover{

	border: 1px solid #3d2060;

	background-color: transparent;

	color: #3d2060;

}









/* A SOLUÇÃO PARA */ /* A SOLUÇÃO PARA */ /* A SOLUÇÃO PARA */ /* A SOLUÇÃO PARA */ 





.solucao-para .fundo1{

	background-image: url(../imgs/slider-principal.jpg);

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    background-attachment: fixed;

	padding-top: 70px;

	height: 500px;

}



.solucao-para h2{

	color: #fff;

	margin-bottom: 50px;

}



.segura h5{

	color: #fff;

	font-weight: normal;

	float: left;

	border: 1px solid #fff;

	border-radius: 33px;

	width: 48%;

	padding: 13px;

	margin-right: 10px;

	margin-bottom: 15px;

}



.segura h5:hover{

	background-color: #fff;

	color: #3d2060;

}





.solucao-para .fundo2{

	background-image: url(../imgs/ideal-para.jpg);

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

}









/* A CONTA4U */ /* A CONTA4U */ /* A CONTA4U */ /* A CONTA4U */ 



.a-conta4u{

	background-image: url(../imgs/slider-principal-segundo.jpg);

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    padding: 70px 0 80px 0;

}



.a-conta4u img{

	margin-bottom: 44px;

	margin-top: 23px;

}



.a-conta4u h5{

	color: #fff;

	text-align: justify;

	font-weight: lighter;

}







/* SIMPLIFIQUE */ /* SIMPLIFIQUE */ /* SIMPLIFIQUE */ /* SIMPLIFIQUE */ 



.simplifique{

	padding: 50px;

}



.simplifique h1{

	color: #481c71;

	font-weight: bold;

}



.simplifique h4{

	color: #481c71;

	margin-bottom: 72px;

	font-size: 20px;

}



.simplifique img{

	margin-bottom: 15px;

}



.simplifique h3{

	color: #481c71;

	font-weight: bold;

	margin-bottom: 15px;

}



.simplifique p{

	color: #481c71;

}



.simplifique a{

	text-decoration: none;

}



.simplifique h5{

	width: 100%;

	background-color: #3d2060;

	color: #fff;

	padding: 17px;

	text-align: center;

	border-radius: 40px;

	border: 1px solid #3d2060;

	margin-top: 40px;

}



.simplifique h5:hover{

	border: 1px solid #3d2060;

	background-color: transparent;

	color: #3d2060;

}









/* IDEAL */ /* IDEAL */ /* IDEAL */ /* IDEAL */ 



.ideal{

	background-image: url(../imgs/slider-principal.jpg);

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    background-attachment: fixed;



    padding: 60px;

}



.ideal h1{

	color: #fff;

}



.ideal h3{

	color: #fff;

	font-weight: normal;

}



.ideal img{

	margin-top: 55px;

	margin-bottom: 10px;

}



.ideal h4{

	color: #fff;

	font-weight: bold;

	margin-bottom: 44px;

}



.ideal a{

	text-decoration: none;

}



.ideal h5{

	width: 100%;

	background-color: #fff;

	color: #3d2060;

	padding: 17px;

	text-align: center;

	border-radius: 40px;

	border: 1px solid #3d2060;

	margin-top: 40px;

}



.ideal h5:hover{

	border: 1px solid #fff;

	background-color: transparent;

	color: #fff;

}











/* FOOTER */ /* FOOTER */ /* FOOTER */ /* FOOTER */ 



.footer{

	background-color: #240b44;

	padding: 100px;

	color: #fff;



}



.footer a{

	text-decoration: none;

}



.footer h5{

	color: #fff;

	font-weight: lighter;

}





.footer2{

	background-color: #130526;

	color: #fff;

	padding-top: 7px;

}



.footer2 h5{

	font-weight: lighter;

	font-size: 15px;

}






/* MIDIA QUERIES */ /* MIDIA QUERIES *//* MIDIA QUERIES *//* MIDIA QUERIES */
/* RESPONSIVO */ /* RESPONSIVO *//* RESPONSIVO *//* RESPONSIVO */
/* MIDIA QUERIES */ /* MIDIA QUERIES *//* MIDIA QUERIES *//* MIDIA QUERIES */
/* RESPONSIVO */ /* RESPONSIVO *//* RESPONSIVO *//* RESPONSIVO */
/* MIDIA QUERIES */ /* MIDIA QUERIES *//* MIDIA QUERIES *//* MIDIA QUERIES */
/* RESPONSIVO */ /* RESPONSIVO *//* RESPONSIVO *//* RESPONSIVO */
/* MIDIA QUERIES */ /* MIDIA QUERIES *//* MIDIA QUERIES *//* MIDIA QUERIES */
/* RESPONSIVO */ /* RESPONSIVO *//* RESPONSIVO *//* RESPONSIVO */





@media(max-width: 767px){


	.slider-principal img{
		margin-top: 55px;
	}

	.separador{
		display: none;
	}

	.solucao-para .fundo2{
		height: 500px;
	}

	.a-conta4u {
    	background-image: url(../imgs/slider-principal.jpg);
	}

	.simplifique img{
		margin-top: 13px;
	}

	.simplifique h4{
		margin-bottom: 33px;
	}

	.simplifique h5{
		margin-top: 0px;
	}

	.simplifique p{
		margin-bottom: 44px;
	}

	.ideal h5{
		margin-top: 0;
	}

	.ideal img{
		margin-top: 10px;
	}

	.ideal h3{
		margin-bottom: 55px;
	}

	.footer{
		text-align: center;
	}

	.footer img{
		margin-bottom: 33px;
	}

	.footer h4{
		margin-top: 44px;
	}

}


@media(max-width: 529px){

	.slider-principal br{
		display: none;
	}

	.slider-principal h1{
		padding-top: 25px;
		font-size: 30px;
	}

	.slider-principal h5{
		width: 100%;
	}

	.solucao-para .fundo1{
		height: 700px;
	}

	.solucao-para .segura h5{
		float: none;
		width: 100%;
		margin-right: 0;
		margin-top: 0;
		margin-bottom: 10px;
	}

	.solucao-para br{
		display: none;
	}


	.funcionalidades h1{
		font-size: 30px;
	}

	.funcionalidades h3{
		font-size: 20px;
	}

	.simplifique h1{
		font-size: 30px;
	}

	.simplifique h4{
		font-size: 18px;
	}

	.ideal h1{
		font-size: 30px;
	}

	.ideal h3{
		font-size: 20px;
		margin-bottom: 33px;
	}

}



@media(max-width: 485px){

	.slider-principal{
		text-align: center;
		padding-top: 33px;
	}

	.slider-principal p{
		letter-spacing: 1px;
	}

	.solucao-para .fundo2{
		display: none;
	}

	.solucao-para h2{
		font-size: 25px;
	}

}



@media(max-width: 411px){

	.slider-principal{
		text-align: center;
	}

	.slider-principal p{
		letter-spacing: 0;
	}

	.slider-principal img{
		margin-top: 33px;
	}

	.footer h4{
		font-size: 20px;
	}

	.footer h5{
		font-size: 15px;
	}

	.funcionalidades h5 span{
		font-size: 17px;
	}

	.simplifique h5 span{
		font-size: 17px;
	}

	.ideal h5 span{
		font-size: 17px;
	}

	.ideal h1{
		font-size: 25px;
	}

}



@media(max-width: 375px){

	.solucao-para .fundo1 {
		height: 733px;
	}

	.footer img{
		width: 100%;
	}

	.footer .midias-sociais img{
		width: 50%;
		margin-bottom: 10px;
	}

	.funcionalidades h5 span{
		font-size: 15px;
	}

	.simplifique h5 span{
		font-size: 15px;
	}

	.ideal h5 span{
		font-size: 13px;
	}


	.funcionalidades h1{
		font-size: 25px;
	}

	.funcionalidades h3{
		font-size: 17px;
	}

	.simplifique h1{
		font-size: 25px;
	}

	.simplifique h4{
		font-size: 14px;
	}


	.footer h5{
		font-size: 13px;
	}

	.footer h4{
		font-size: 15px;
	}

}



@media(max-width: 333px){

	.topo img{
		width: 130px;
	}

	.simplifique h5 span{
		font-size: 13px;
	}

	.ideal h5 span{
		font-size: 11px;
	}

}



@media(max-width: 318px){

	.slider-principal h1{
		font-size: 20px;
	}

}



@media(max-width: 310px){

	.funcionalidades h1 {
		font-size: 21px;
	}

	.simplifique h1{
		font-size: 21px;
	}

	.ideal h1{
		font-size: 21px;
	}

	.footer h5{
		font-size: 12px;
	}

	.simplifique h5 span {
		font-size: 12px;
	}

	.ideal h5 span {
		font-size: 10px;
	}

}