/*import*/
@import url("global.css");
@import url("header-footer.css");

a[href*="produtos.html"] {
	color: var(--new-orange)!important;
}

/* --- banner --- */
	#banner{
		overflow: hidden;
		padding-bottom: 15px;
	}
	#banner .imagem{
		width: 50%;
	}
	#banner .imagem img{
		position: relative;
		left: -10%;
		box-shadow: 5px 10px 0 var(--new-orange);
		border-bottom-left-radius: 152px;
		border-bottom-right-radius: 152px;
	}
	#banner .desc{
		width: 50%;
		background-color: var(--new-blue);
		height: 367px;
		border-bottom-right-radius: 152px;
	}
	#banner .desc h1{
		font-size: 52px;
		line-height: 50px;
		margin-left: -150px;
	}
	#banner .desc p{
		margin-top: 15px;
		font-size: 21px;
		margin-left: -150px;
	}
	
	section.container-fluid{
		max-width: 1400px;
	}

/* --- aside menu --- */
	#menu{
		margin-top: 40px;
		max-width: 222px;
		width: 100%;
		padding-left: 15px;
	}
	#menu .input-group{
		border: 1px solid #E4E4E4;
		border-radius: 11px;
		overflow: hidden;
	}
	#menu input{
		height: 51px;
		font-size: 14px;
		font-family: "Montserrat-Regular";
	}
	#menu .categorias{
		margin-top: 27px;
	}
	#menu .categorias li{
		margin-bottom: 15px;
	}
	#menu .categorias a{
		font-size: 15px;
		font-family: "Montserrat-Bold";
		color: #707070;
		text-transform: uppercase;
		line-height: 0px;
	}
	#menu .categorias a:hover{
		color: var(--new-orange);
	}

/* --- article descricao --- */
	#descricao{
		margin-left: 20px;
		margin-right: 15px;
		max-width: 1100px;
		width: 100%;
	}

/* --- info --- */
	.info{
		border: 1px solid #E4E4E4;
		border-radius: 17px;
		padding: 20px 10px 20px 30px;
	}
	.info img{
		object-fit: cover;
	}
	.info .nav-pills .nav-link.active, 
	.info .nav-pills .show>.nav-link {
	    color: initial;
	    background-color: transparent;
	}
	.info .nav-pills .nav-link {
	     border-radius: initial;
	}
	.info .nav-link {
	     padding: 0;
	}
	.info .mini img{
		border-radius: 13px;
		margin-bottom: 8px;
		height: 79px;
	}
	.info .grande img{
		border-radius: 17px;
		height: 343px;
	}
	.info .desc{
		position: relative;
	}
	.info .desc a.download{
		width: 34px;
		height: 34px;
		border-radius: 50%;
		position: absolute;
		top: -20px;
		right: 19px;
		background-color: var(--new-orange);
		text-align: center;
		padding-top: 4px;
	}
	.info .desc img{
		max-width: 17px;
	}
	.info .desc h2{
		font-size: 21px;
		margin-bottom: 25px;
	}
	.info .desc p{
		font-size: 16px;
		margin-bottom: 30px;
	}
	.info .desc a.btn{
		height: 51px;
		font-size: 20px;
		font-family: "Montserrat-Medium";
	}

/* --- ficha --- */
	.ficha{
		max-width: 720px;
		width: 100%;
		margin-left: 70px;
		margin-top: 50px;
		padding: 0;
		padding-bottom: 75px;
	}
	.ficha .nav-link{
		font-size: 20px;
		font-family: "Montserrat-Bold";
		color: #707070;
		padding-left: 0!important;
		padding-right: 0!important;
	}
	.ficha .nav-link.active{
		background-color: transparent;
		color: var(--new-orange);
	}
	.ficha .tab-content{
		margin-top: 35px;
		height: 343px;
		margin-bottom: 20px;
	}
	.ficha iframe{
		width: 100%;
		height: 343px;
		border-radius: 17px;
	}
	.ficha h3{
		font-size: 20px;
		margin-bottom: 15px;
	}
	.ficha p{
		font-size: 16px;
	}
	
/* --- perguntas --- */
	#perguntas{
		padding-top: 85px;
		padding-bottom: 6px;
		background-color: #E9EEF7;
	}
	#perguntas h2{
		font-size: 55px;
	}
	#perguntas .accordion{
		margin-top: 47px;
		margin-bottom: 135px;
	}
	#perguntas .accordion .card{
		border: 1px solid transparent!important;
		border-radius: 20px;
		margin-bottom: 14px;
		overflow: hidden;
		transition: .3s;
	}
	#perguntas .accordion .card-header{
		min-height: 70px;
		height: 100%;
		padding: 20px 30px 0 20px;
	    border-bottom: 0;
	    transition: .3s;
	}
	#perguntas .accordion .float-left{
		max-width: 850px;
		width: 100%;
	}
	#perguntas .accordion button.font-medium{
		font-size: 16px;
		line-height: 20px;
		white-space: normal!important;
		text-align: left;
		color: #707070;
		text-decoration: none;
		margin-bottom: 5px;
		text-transform: initial;
		font-family: "Montserrat-Medium";
	}
	#perguntas .accordion button.icon:before{
		content: url(../imagens/logos/icon-seta.png);
	}
	#perguntas .accordion .card-body{
		margin: 0px 20px 45px 20px;
	}
	#perguntas .accordion .collapse{
		border: 1px solid var(--new-orange);
		border-top: none;
		border-bottom-left-radius: 20px;
		border-bottom-right-radius: 20px;
		/*transition: .3s;*/
	}
	#perguntas .accordion .card-body p{
		font-size: 16px;
		margin-bottom: 0px;
	}
	#perguntas .accordion .card-header[aria-expanded="true"] {
		border: 1px solid var(--new-orange);
		border-bottom: none;
		border-top-left-radius: 20px;
		border-top-right-radius: 20px;
		/*transition: .3s;*/
	}
	#perguntas .accordion .card-header[aria-expanded="true"] button.font-medium{
		color: var(--new-orange);
		font-family: "Montserrat-Bold";
		transition: .3s;
	}
	#perguntas .accordion .card-header[aria-expanded="true"] button.icon{
		transform: rotate(180deg)!important;
		transition: .3s;
	}
	
/* --- produtos --- */
	#produtos{
		padding-top: 80px;
		padding-bottom: 80px;
	}
	#produtos h2{
		font-size: 55px;
	}
	#produtos .carousel-produtos-2{
		margin-top: 60px;	
	}
	#produtos .carousel-produtos-2 .box{
		max-width: 272px;
		width: 100%;
		height: 558px;
		border-radius: 17px;
		position: relative;
		border: 1px solid #E4E4E4;
		transition: .3s!important;
	}
	#produtos .carousel-produtos-2 img.img-produto{
		width: 100%;
		height: 383px;
		object-fit: cover;
		border-radius: 20px;
		box-shadow: 0 10px 20px #00000030
	}
	#produtos .carousel-produtos-2 img.img-ver{
		position: absolute;
		margin: auto;
		top: 30%; left: 0; right: 0;
		opacity: 0;
		transition: .3s;
	}
	#produtos .carousel-produtos-2 .desc{
		padding: 27px;
	}
	#produtos .carousel-produtos-2 h3{
		font-size: 22px;
		margin-bottom: 15px;
		color: var(--new-orange);
	}
	#produtos .carousel-produtos-2 p{
		font-size: 16px;
		height: 75px;
		color: #707070;
		overflow: auto;
	}
	#produtos .carousel-produtos-2 p::-webkit-scrollbar {
	 	width: 5px;
	  	border-radius: 20px;
	}
	#produtos .carousel-produtos-2 p::-webkit-scrollbar-track-piece {
	 	border-radius: 20px;
	 	border: 1px solid var(--new-orange);
	}
	#produtos .carousel-produtos-2 p::-webkit-scrollbar-thumb:vertical {
	  	background-color: var(--new-orange);
	  	border-radius: 20px;
	  	border: 1px solid var(--new-orange);
	}
	#produtos .carousel-produtos-2 .box:hover img.img-ver{
		opacity: 1;
		transition: .3s;
	}
	#produtos .btn-slick-carousel-left,
	#produtos .btn-slick-carousel-right{
		position: absolute;
		z-index: 999;
		top: 45%;
		cursor: pointer;
	}
	#produtos .btn-slick-carousel-left{
		left: -6%;
	}
	#produtos .btn-slick-carousel-right{
		right: -6%;
	}

/* --- modal Orçamento / Revenda --- */
	#modal_orcamento .modal-lg,
	#modal_revendedor .modal-lg{
		max-width: 639px!important;
		width: 100%;
	}
	#modal_orcamento .modal-content,
	#modal_revendedor .modal-content{
		border-radius: 20px!important;
	}
	#modal_orcamento .modal-body,
	#modal_revendedor .modal-body{
		padding: 0;
	}
	#modal_orcamento button,
	#modal_revendedor button{
		position: absolute;
		right: 0;
		margin-top: -25px;
		margin-right: -25px;
		z-index: 2;
		opacity: 1;
	}
	#modal_orcamento .form,
	#modal_revendedor .form{
		margin-top: 0px;
		padding: 50px 30px;
	}
	#modal_orcamento h2,
	#modal_revendedor h2{
		font-size: 20px;
		margin-bottom: 20px;
	}
	#modal_orcamento select,
	#modal_revendedor select,
	#modal_orcamento input,
	#modal_revendedor input{
		height: 43px;
		font-size: 16px;
		background-color: #F5F6F8;
		border-radius: 10px;
		padding-left: 20px;
		margin-bottom: 13px;
		color: #707070;
	}
	#modal_orcamento a.btn,
	#modal_revendedor a.btn{
		height: 43px;
		padding-top: 10px;
		border-radius: 10px;
	}
	#modal_orcamento .imagem,
	#modal_revendedor .imagem{
		background: url(../imagens/img-principal.png)no-repeat center center;
		background-size: cover;
		border-top-right-radius: 20px;
		border-bottom-right-radius: 20px;
	}

@media screen and (max-width: 1660px) {
	/* --- banner --- */
		#banner .imagem img{
			left: -29%;
		}
		#banner .desc h1, #banner .desc p {
    	margin-left: -36px;
		}
}

@media screen and (max-width: 1440px) {
	/* --- banner --- */
		#banner .imagem img{
			left: -42%;
		}
		#banner .desc{
			border-bottom-right-radius: 0;
		}
		#banner .desc h1{
			margin-left: 60px;
		}
		#banner .desc p{
			margin-left: 60px;
		}
		.info-content{
			max-width: 360px;
		}
		.col-lg-7{
			max-width: 550px!important;
		}
		.info .desc a.btn{
			font-size: 16px;
		}
		section.container-fluid {
	    	max-width: 1200px;
		}
		.flex-wrap{
			flex-wrap: unset!important;
		}
		.comp-text{
			width: 920px!important;
		}
}

@media screen and (max-width: 1366px){
	#banner .imagem img {
    	left: -51%;
	}

}

@media screen and (max-width: 1356px) {
	/* --- article descricao --- */
		#descricao{
			max-width: 950px;
			margin-right: auto;
		}
}

@media screen and (max-width: 1280px){
	#banner .imagem img {
    	left: -62%;
	}
	section.container-fluid {
    	max-width: 1000px;
	}
	.col-lg-7 {
    	max-width: 500px!important;
	}
	.comp-text {
    	width: 875px!important;
	}
}

@media screen and (max-width: 1200px) {
	/* --- banner --- */
		#banner .imagem img{
			left: -110%;
		}
		#banner .desc h1{
			margin-left: 50px;
		}
		#banner .desc p{
			margin-left: 50px;
		}

	/* --- article descricao --- */
		#descricao{
			margin-left: 15px;
			margin-right: 0px;
			max-width: 780px;
		}

	/* --- info --- */
		.info .desc a.download{
			top: -5px;
		}
		.info .desc a.btn{
			height: 40px;
			font-size: 16px;
		}

	/* --- ficha --- */
		.ficha{
			margin-left: auto;
			margin-right: auto;
		}

	/* --- perguntas --- */
		#perguntas .accordion .float-left{
			max-width: 700px;
		}

	/* --- produtos --- */
		#produtos .btn-slick-carousel-left,
		#produtos .btn-slick-carousel-right{
			top: 45%;
		}
		#produtos .btn-slick-carousel-left{
			left: -1%;
		}
		#produtos .btn-slick-carousel-right{
			right: -1%;
		}
		
	/* --- modal Orçamento / Revenda --- */
		#modal_orcamento select,
		#modal_revendedor select,
		#modal_orcamento input,
		#modal_revendedor input{
			margin-bottom: 16px;
		}
}

@media screen and (max-width: 1024px){
		section.container-fluid {
    		max-width: 850px;
		}
		.flex-wrap{
			flex-wrap: unset!important;
		}
		.col-lg-7 {
    		max-width: 320px!important;
		}
		.comp-text {
    		width: 590px!important;
		}
		.info .desc p {
		    font-size: 14px;
		}
		.botoes{
			width: 50%!important;
		}
		.info .desc a.btn{
			width: 100%;
			font-size: 9px;
		}
		.btn-orange{
			padding-left: 0;
    		padding-right: 0;
		}
}

@media screen and (max-width: 992px) {
	/* --- banner --- */
		#banner .desc{
			width: 100%;
			height: 205px;
		}
		#banner .desc h1{
			text-align: center;
			margin-left: 0;
		}
		#banner .desc p{
			margin-left: 0;
		}
		#banner .imagem img{
			left: -80%;
			height: 391px;
		}

	section.container-fluid{
		position: relative;
	}

	/* --- article descricao --- */
		#descricao{
			margin-left: 0px;
		}

	/* --- info --- */
		.info .grande img{
			width: 100%;
		}
		.info .flex-column {
		    flex-direction: inherit!important;
		}
		.info .nav-pills .nav-link {
		    display: block;
		    margin-left: auto;
		    margin-right: auto;
		}
		.info .mini img{
			margin-top: 10px;
			margin-left: 0px;
			margin-bottom: 35px;
		}
		.info .desc a.download{
			display: none;
		}

	/* --- perguntas --- */
		#perguntas .accordion .float-left{
			max-width: 600px;
		}

	/* --- aside menu --- */
		aside#menu{
			position: absolute;
			top: 0;
			left: 0;
			z-index: 4;
			transition: .3s;
		}
		.sombra{
			display: none;
			width: 300px;
			padding: 25px 18px;
			background-color: white;
			border-radius: 10px;
			transition: .3s;
			box-shadow: 4px 8px 10px #00000040;
		}
		img.menu-lateral{
			position: absolute;
			display: block;
			top: -25px;
			left: 0;
			right: 0;
			margin-left: auto;
			margin-right: auto;
		}
		img.icon-close{
			position: absolute;
			top: -10px;
			left: auto;
			right: -105px;
			background-color: white;
			border: 1px solid var(--new-orange);
			border-radius: 50%;
			cursor: pointer;
		}
		.m-negative{
			display: block;
			transition: .3s;
		}

	/* --- produtos --- */
		#produtos .btn-slick-carousel-left,
		#produtos .btn-slick-carousel-right{
			top: initial;
			bottom: -50px;
		}
		#produtos .btn-slick-carousel-left{
			left: 42%;
		}
		#produtos .btn-slick-carousel-right{
			right: 42%;
		}

	/* --- modal Orçamento / Revenda --- */
		#modal_orcamento .modal-lg,
		#modal_revendedor .modal-lg{
			max-width: 400px!important;
		}
		#modal_orcamento .modal-content,
		#modal_revendedor .modal-content{
			overflow: initial; 
		}
		#modal_orcamento .imagem,
		#modal_revendedor .imagem{
			background: url(../imagens/img-principal.png)no-repeat center center;
			background-size: cover;
			height: 323px;
			border-bottom-left-radius: 20px;
			border-bottom-right-radius: 20px;
		}
}

@media screen and (max-width: 768px){
		#banner{
			height: 545px;
		}
		#banner .imagem img {
		    left: -100%;
		    height: 328px;
		    top: 62%;
		}
		#banner .desc {
    		width: 768px;
		}
		.d-flex {
    		display: -ms-flexbox!important;
    		display: inline-flex!important;
		}
		#banner .desc h1 {
    		margin-left: 50%;
		}
		.text-md-left {
    		margin-left: 25%;
    		width: 100%;
		}
}

@media screen and (max-width: 480px) {
	/* --- banner --- */
		#banner .desc h1{
			font-size: 43px;
			line-height: 40px;
		}
		#banner .desc p{
			margin-left: 0;
			margin-bottom: -90px;
		}
		#banner .imagem{
			position: relative;
			margin-top: -50px;
    		z-index: -1;
		}
		#banner .imagem img{
			left: initial;
			right: 55%;
			height: 400px;
			border-bottom-left-radius: 53px;
			border-bottom-right-radius: 53px;
		}

	/* --- aside menu --- */
		img.menu-lateral{
			top: -50px;
		}

	/* --- info --- */
		.info{
			padding: 0;
			border: none;
		}
		.info .grande img{
			width: 100%;
		}
		.info .mini{
			text-align: center;
		}
		.info .mini img{
			width: 75px;
			height: 75px;
			margin-left: 6px;
			margin-right: 6px;
		}
		.info .desc h2{
			margin-bottom: 20px;
		}
		.info .desc a.btn{
			height: 51px;
			font-size: 20px;
		}

	/* --- ficha --- */
		.ficha .nav {
			display: initial;
		}

	/* --- perguntas --- */
		#perguntas h2{
			font-size: 35px;
		}
		#perguntas .accordion .card-header{
			padding: 20px 5px 0 5px;
		}
		#perguntas .accordion .float-left{
			max-width: 260px;
		}
		#perguntas .accordion .card-body{
			margin: 0px 0px 10px 0px;
		}

	/* --- produtos --- */
		#produtos{
			margin-bottom: 80px;
		}
		#produtos h2{
			font-size: 35px;
		}
		#produtos .carousel-produtos-2 h3{
			font-size: 21px;
		}
		#produtos .btn-slick-carousel-left{
			left: 40%;
		}
		#produtos .btn-slick-carousel-right{
			right: 40%;
		}

	/* --- modal Orçamento / Revenda --- */
		#modal_orcamento .modal-lg,
		#modal_revendedor .modal-lg{
			max-width: 341px!important;
			margin-top: 30px;
			margin-bottom: 30px;
			margin-left: auto;
			margin-right: auto;
		}
		#modal_orcamento .form,
		#modal_revendedor .form{
			padding: 40px 35px 40px 35px;
		}
		#modal_orcamento h2,
		#modal_revendedor h2{
			font-size: 20px;
		}
}

@media screen and (max-width: 425px){
	#banner {
    	height: 615px;
	}
	#banner .imagem img{
		right: 129%;
	}
	#banner .desc {
    	width: 425px;
	}
	#banner .desc h1{
		margin-left: 10px;
	}
	.text-md-left {
    	margin-left: 18%;
    	width: 70%;
	}
	#banner .imagem img {
    	right: 101%;
	}
	.ro2{
		display: unset!important;
	}
} 

@media screen and (max-width: 375px) {
	/* --- banner --- */
		#banner .imagem img{
			right: 60%;
		}

	/* --- info --- */
		.info .mini img{
			width: 75px;
			height: 75px;
			margin-left: 2px;
			margin-right: 2px;
		}
		.info .desc a.btn{
			height: 51px;
			font-size: 20px;
		}

	/* --- perguntas --- */
		#perguntas .accordion .float-left{
			max-width: 230px;
		}

	/* --- produtos --- */
		#produtos .btn-slick-carousel-left{
			left: 38%;
		}
		#produtos .btn-slick-carousel-right{
			right: 38%;
		}
}

@media screen and (max-width: 360px) {
	/* --- banner --- */
		#banner .imagem img{
			right: 70%;
		}

	/* --- info --- */
		.info .mini img{
			width: 100px;
			height: 100px;
			margin-left: 20px;
			margin-right: 20px;
		}

	/* --- perguntas --- */
		#perguntas .accordion .float-left{
			max-width: 200px;
		}

	/* --- produtos --- */
		#produtos .btn-slick-carousel-left{
			left: 35%;
		}
		#produtos .btn-slick-carousel-right{
			right: 35%;
		}
}