@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;600;700;800;900&display=swap');
@import url('../fonts/stylesheet.css');

body{
	overflow-x: hidden;
	font-size: 1em;
	font-family: Montserrat, sans-serif;
}

#page-aspirador {
	max-width: 1220px;
	margin: 0px auto;
	position: relative;
	overflow-x: hidden;
}

.relative {
	position: relative;
}

.img-bg {
	width: 100%;
	height: auto;
}

header {
	padding: 20px 0px;
	background: #152942;
	position: relative;
	z-index: 5;
}

.filtro-img { z-index: 9; }

#intro {
	z-index: 3;
}

#intro .title { position: absolute; right: 305px; bottom: 155px; }
#intro .logo {  position: absolute; right: 16%; top: 2%;  }
#intro h1 { color: #fff; font-size: 1.8rem; font-weight: 100; }

.title-intro {
	color: #152942;
	text-transform: uppercase;
	font-weight: 600;
	line-height: 1em;
	font-size: 1.5em;
	padding: 30px 0px;
}

#rotacao .bold {
    font-weight: 700;
}


.tit-infos { text-transform: uppercase; font-weight: 700; color: #152942; }

#infos .produtos { position: absolute;
    bottom: 37%;
    right: 0px;
    z-index: 9;
    max-width: 635px; }


#rotacao {
	background: url('../img/bg-rotacao.webp');
	background-size: 100% auto;
	background-repeat: no-repeat;
	margin-top: -47px;
    padding: 175px 0px 130px 0px;
	background-color: #eee;
}



.slogan {
	background: #b88d32;
	color: #152942;
	font-weight: 700;
	padding: 20px 30px 20px 20px;
	margin: 0px 0px 10px 0px;
	font-size: 0.6em;
	border-radius: 0px 200px 200px 0px;
	text-align: left;
	line-height: 1.2em;
	position: relative;
	z-index: 2;
}

#rotacao .yellow { color: #cd9a32; font-size: 2.4rem; }

.title-intro .modelo {
	width: 100%;
	display: block;
	color: #152942;
	font-weight: 800;
	font-size: 0.95em;
}

#intro .slogan {
	position: absolute;
    top: 18px;
    left: 30px;
    color: #152942;
    text-transform: uppercase;
    font-weight: 700;
    text-align: center;
    line-height: 1em;
    font-size: 0.7em;
    width: 70%;
}

#performance {
	background: #152942;
	background-repeat: no-repeat;
}

.giro-360  {     }

#performance p { font-size: 3.5rem;
    text-transform: uppercase;
    text-align: left;
    line-height: 3.5rem; }	
	
#performance .bold { font-weight: 800; }	

.info-performance {
	color: #FFFFFF;
	background: url('../img/border-star.png') no-repeat top right;
	padding: 35px 10px 10px 0px;
	background-size: 100% auto;
	height: 195px;
}

#vertical {
	background: url(../img/bg-white-02.webp);
	background-repeat: no-repeat;
	overflow: hidden;
}

#vertical p {     font-size: 2em;
    line-height: 2.5rem;
    text-align: center;
    line-height: 3.5rem; }	
	
#vertical .bold { font-weight: 800; }	

.info-vertical {
	color: #152942;
	padding: 35px 10px 10px 0px;
	background-size: 100% auto;
	height: 195px;
}


.arco-brilho {      color: #152942;
    background: url(../img/arco-brilho.webp) no-repeat top right;
    padding: 35px 10px 10px 0px;
    background-size: 100% auto;
	height: 550px;
    width: 430px !important;
    overflow: hidden;
  }
    

#filtro {
    background: url(../img/bg-white-01.webp);
    background-size: cover;
}

#filtro p { font-size: 3.5rem;
    text-align: left;
    line-height: 3.5rem; }	
	
#filtro .bold { font-weight: 800; }	

.info-filtro {
	color: #FFFFFF;
	background: url('../img/border-full.png') no-repeat top right;
	padding: 35px 10px 10px 0px;
	background-size: 100% auto;
	height: 195px;
}


.britaniar {
	color: #cd9a33;
	font-weight: 900;
	font-size: 0.8em;
	padding: 4px 0px 0px 0px;
	display: block;
}

.watts {
	background: #152942;
	position: absolute;
	right: 0px;
	bottom: 15px;
	padding: 10px 25px;
	border-radius: 50px 0px 0px 50px;
}

.selo-filtro {
	max-width: 280px;
    position: absolute;
    right: 245px;
    top: 140px;
}

.selo-watts { margin-top: -25%; }
.selo { width: 40%; }
.selo-vertical { width: 40%; }
.mt-7 { margin-top: 99px; }	

.mt-vertical { margin-top: 305px; max-width: 97%; }	

.mt-filtro {     margin-bottom: -100px;
    padding-top: 90px; }

.pos-selo { position: absolute;
    left: 0;
    padding: 0;
    top: 255px;    }


.pos-vertical { position: absolute;
	left: 140px;
	padding: 0;
	top: 170px;    }


#filtro .text-right {
    text-align: right!important;
    padding-left: 48%;
    padding-top: 55px;
}	


#filtro .pos-filtro {   position: absolute;
    left: 6%;
    padding: 0;
    bottom: 120px;
    width: 85%;  }	

#doisum {
	padding: 25px 0px;
	z-index: 2;
}

#doisum .number {
	color: #cd9a33;
	font-weight: 900;
	text-transform: uppercase;
	font-size: 3em;
	line-height: 1em;
}

#doisum .funcoes {
	color: #212d44;
	font-weight: 700;
	text-transform: uppercase;
	line-height: 1em;
	padding-top: 15px;
}

#infos {
	background: url(../img/bg-white-01.webp);
    background-size: cover;
}

.info-turbo {
	position: absolute;
	right: 0px;
	top: 0px;
}

.turbo-ciclone {
	text-align: center;
    background: url(../img/bg-ciclone.png) no-repeat bottom left;
    background-size: 100%;
    padding: 10px 20px 50px 20px;
    font-size: 0.8em;
    text-transform: uppercase;
    font-weight: 700;
    position: absolute;
    left: 20px;
}

.title-ciclone {
	color: #cd9a33;
	font-weight: 900;
	text-transform: uppercase;
	font-size: 1.8em;
	width: 100%;
	display: block;
	line-height: 1em;
}

.turbo-ciclone p{
	font-size: 0.7em;
	text-transform: none;
	font-weight: 500;
	line-height: 1em;
	padding-top: 5px;
}

.aspirador-ciclone {
	margin-top: 80px;
}

.info-reservatorio {
    font-size: 0.9em;
    text-transform: uppercase;
    font-weight: 700;
    position: absolute;
    top: 50%;
    left: 100px;
    margin-top: 20px;
    line-height: 1em;
}

.title-litro {
	color: #cd9a33;
	font-weight: 900;
	text-transform: uppercase;
	font-size: 2.7em;
	width: 100%;
	display: block;
	line-height: 1em;
}

.info-reservatorio p{
	font-size: 0.7em;
	text-transform: none;
	font-weight: 500;
	line-height: 1em;
}

.pt-infos { padding-top: 50px; max-width: 525px; }
 
.acessorio {
	font-size: 1.6em;
	line-height: 1em;
	margin-bottom: 25px;
}

.acessorio .icone {
	padding: 0px 15px 0px 0px;
	text-align: right;
}

#infos .line { line-height: 1.8rem; padding: 10px 10px 10px 5px; color: #878787; }

.acessorio-mop {
	position: absolute;
	bottom: 70px;
	right: 0px;
	font-size: 0.8em;
}

.info-mop {
    position: absolute;
    right: 10px;
    top: 25px;
    text-align: center;
    text-transform: uppercase;
    font-size: 0.7em;
}

.info-mop p {
	font-size: 0.7em;
}

#uso {
	background: #dddddd;
	color: #222d43;
	text-transform: uppercase;
	font-weight: 600;
	text-align: center;
	padding: 25px 0px;
	font-size: 0.7em;
}

footer {
	padding: 20px 0px;
	background: #152942;
	position: relative;
	z-index: 5;
}

.nota-footer {
	color: #FFF;
	font-size: 0.4em;
	font-weight: 300;
	text-align: left;
	margin-top: 20px;
}



/*------------------------------------------------------------------
---------------------------- RESPONSIVO ----------------------------
--------------------------------------------------------------------*/

@media (min-width: 991px) and (max-width: 1200px)  {
	#intro .logo {
		position: absolute;
		right: 9%;
		top: 2%;
	}
	#intro .title {
		position: absolute;
		right: 200px;
		bottom: 135px;
	}

	#filtro .text-right {
		text-align: right!important;
    padding-left: 47%;
    padding-top: 38px;
	}

	#filtro .pos-filtro {
		position: absolute;
		left: 5%;
		padding: 0;
		bottom: 80px;
		width: 85%;
	}

	.selo-filtro {
		max-width: 230px;
		position: absolute;
		right: 190px;
		top: 110px;
	}
}


@media (min-width: 1001px) and (max-width: 1200px)  {
	#vertical p { padding-top: 44% !important; }
    .selo-vertical {
		max-width: 500px;
		padding: 275px 0px 0px 220px;
		width: 45%;
	}
	.mt-vertical {
		margin-top: 345px;
	}

}


@media (min-width: 980px) and (max-width: 1240px)  {

	.acessorio { font-size: 1.2em !important; margin-bottom: 50px !important; }
	#rotacao { padding: 175px 0px 25px 0px !important; }

}


@media (min-width: 991px) and (max-width: 1100px)  {
      
	#infos .produtos {
		position: absolute;
		bottom: 42%;
		right: 0px;
		z-index: 9;
		max-width: 510px;
	}

	.pt-infos {
		padding-top: 28px !important;
	}

	.acessorio {
		    font-size: 1.2em !important;
           margin-bottom: 30px !important;
	}

	#rotacao { padding: 175px 0px 20px 0px; }

	.selo-vertical {
		max-width: 490px;
		padding: 270px 0px 0px 245px;
		width: 47%;
	}

	#rotacao h3 {
		font-size: 1.6rem !important;
	}

	#rotacao h3 {
		padding-top: 25px;
		text-align: center;
	}

	#vertical p {
		font-size: 1.3em !important;
		line-height: 1.5rem !important;
	}

	#vertical p {
		padding-top: 40%;
	}

	.mt-vertical {
		margin-top: 360px;
	}

	#performance p {
		font-size: 1.3em !important;
		line-height: 1.8rem !important;
	}
	.info-performance {
		padding: 17px 15px 10px 0px !important;
	}


	.info-vertical {
		padding: 17px 15px 10px 0px !important;
	}


	#filtro p {
		font-size: 1.3em !important;
		line-height: 1.8rem !important;
	}
	.info-filtro {
		padding: 17px 15px 10px 0px !important;
	}
}



@media (min-width: 768px) and (max-width: 991px)  {

	.pt-infos {
		padding-top: 40px;
		padding-left: 40px;
	}

	.acessorio .icone {
		max-width: 40px !important;
	}

	#infos .produtos {
		bottom: 36% !important;
		max-width: 410px !important;
	}

	#infos .line {
		line-height: 1.2rem !important;
	}

	.acessorio {
		font-size: 1em !important;
		margin-bottom: 40px !important;
	}

	#rotacao h3 {
		font-size: 2em !important;
		text-align: center;
	}

	#rotacao { padding: 175px 0px 60px 0px; }

	#rotacao .yellow { font-size: 1.4rem; }
	#rotacao.slogan { max-width: 100%; }
	#rotacao .slogan-yellow { max-width: 100%; }
	#rotacao .slogan-saudavel { max-width: 100%; }
    #rotacao h3 { padding-top: 15px; }

	.arco-brilho {     height: 480px; }

	#vertical p {
		padding-top: 40% !important;
	}

	.giro-360 {
		max-width: 120px;
	}


	.pos-vertical {  left: 55px; }

	#filtro .text-right {
		
		padding-left: 47%;
		padding-top: 25px;
	}

	.mt-vertical {
		margin-top: 360px;
		max-width: 97%;
	}

	.selo-filtro {
		max-width: 200px;
		position: absolute;
		right: 15%;
		top: 15%;
	}

	#filtro .pos-filtro {
		position: absolute;
		left: 5%;
		padding: 0;
		bottom: 80px;
		width: 85%;
		top: 285px;
	}

	#performance p {
		font-size: 1em !important;
        line-height: 1.3rem !important;
		padding-left: 70px !important; 
	}
	.info-performance {
		padding: 17px 15px 10px 0px !important;
	}

	#vertical p {
		font-size: 1.5em !important;
		line-height: 1.7rem !important;
		padding-left: 13px !important;
	}
	.info-vertical {
		padding: 17px 15px 10px 0px !important;
	}

	#filtro p {
		font-size: 1em !important;
        line-height: 1.3rem !important;
		padding-left: 70px !important; 
	}
	.info-filtro {
		padding: 17px 15px 10px 0px !important;
	}

	.pos-selo  { top: 175px; }

	.pos-vertical  { top: 200px; }

	.selo {
		max-width: 280px !important;
		padding: 59px 0px 0px 70px !important;
	}

	.selo-vertical {
		max-width: 345px !important;
		padding: 280px 0px 0px 175px !important;
		width: 50%;
	}

	#intro .logo {
		position: absolute;
		right: 10%;
		top: 2%;
		max-width: 320px;
	}
	#intro .title {
		position: absolute;
		right: 130px;
		bottom: 140px;
	}
	#intro h1 {
		font-size: 1.5rem;
	}


	#performance p {
		font-size: 1.8rem;
		line-height: 2rem;
	}
	.performance-img {  max-width: 100%; }


	#vertical p {
		font-size: 1.8rem;
		line-height: 2rem;
	}
	.vertical-img {  max-width: 100%; }

	#filtro p {
		font-size: 1.8rem;
		line-height: 2rem;
	}
	.filtro-img {  max-width: 100%;  }
}



@media (min-width: 319px) and (max-width: 420px)  {

	.pt-infos {
		padding-top: 30px !important;
	}

	#infos .produtos { display: none !important; }

	.acessorio .icone { max-width: 23px !important; }

	.acessorio {
		font-size: 0.8em !important;
		margin-bottom: 15px !important;
	}

	#infos .line {  padding: 2px 10px 0px 5px !important; }


	.filtro-img { width: 28% !important; }

	.selo-filtro {
		max-width: 90px !important;
		right: 5% !important;
		top: 10% !important;
	}

	#filtro p {
		font-size: 0.7rem !important;
	}

	#filtro .text-right {
		padding-left: 24% !important;
		padding-top: 0px !important;
		padding-right: 0px !important;
	}

	#filtro p {
		font-size: 0.7rem !important;
	}

	.info-filtro {
		padding: 5px 15px 10px 0px !important;
	}

	.mt-filtro {
		margin-top: 0px !important;
		margin-bottom: 30px !important;
		padding-top: 115px !important;
		padding-left: 0px;
	}

}


@media (min-width: 420px) and (max-width: 590px)  {

	.acessorio {
		font-size: 1em !important;
		margin-bottom: 20px !important;
	}

	.selo-filtro {
		max-width: 90px;
		position: absolute;
		right: 9%;
		top: 13%;
	}

	#filtro .pos-filtro {
		position: absolute;
		left: 5%;
		padding: 0;
		bottom: 80px;
		width: 85%;
		top: 285px;
	}

	.pos-selo {
		top: 170px !important;
	}

	.pos-vertical {
		top: 170px !important;
	}

	#filtro .pos-filtro {
		top: 170px !important;
	}

	#filtro .pos-filtro {
		max-width: 570px !important;
	}

	#filtro p {
		font-size: 1.8rem;
		line-height: 2rem;
	}

	#filtro p {
		padding-left: 0px !important;
	}

	.filtro-img {  max-width: 40%; }

}


@media (min-width: 767px) and (max-width: 769px)  {
	.acessorio {
		font-size: 1em !important;
		margin-bottom: 15px !important;
	}
}


@media (min-width: 590px) and (max-width: 767px)  {

	.acessorio {
		font-size: 0.9em !important;
		margin-bottom: 5px !important;
	}

	.pt-infos {
		padding-top: 20px !important;
	}

	#infos .produtos {
		bottom: 34% !important;
		max-width: 370px !important;
	}

	.acessorio .icone {     max-width: 25px!important; }

	.selo-vertical {
		max-width: 260px !important;
		padding: 165px 0px 0px 121px !important;
		width: 45% !important;
	}

	.info-vertical {
		padding: 100px 15px 10px 0px !important;
	}

	.pos-vertical {
		top: 65px !important;
	}

	.mt-vertical {
		margin-top: 24px !important;
        right: 0px !important;
	}

	#filtro .pos-filtro {
		max-width: 570px !important;
	}

	#filtro p {
		font-size: 1.8rem;
		line-height: 2rem;
	}

	#filtro p {
		padding-left: 0px !important;
	}

	.filtro-img {  max-width: 40%;   }

	#filtro .text-right {
		padding-left: 45%;
		padding-top: 6px;
	}

	.mt-filtro {
		margin-bottom: -40px;
		padding-top: 90px;
	}

	.selo-filtro {
		max-width: 126px;
		position: absolute;
		right: 20%;
		top: 14%;
		}

	#filtro .pos-filtro {
		position: absolute;
		left: 5%;
		padding: 0;
		bottom: 80px;
		width: 85%;
		top: 285px;
	}

	.pos-selo {
		top: 170px !important;
	}

	.pos-vertical {
		top: 170px !important;
	}

	#filtro .pos-filtro {
		top: 170px !important;
	}
}


@media (min-width: 490px) and (max-width: 589px)  {

	.acessorio {
		font-size: 0.9em !important;
		margin-bottom: 6px !important;
	}

	.acessorio .icone {
		max-width: 30px !important;
	}

	#infos .produtos {
		bottom: 29% !important;
		max-width: 320px !important;
	}

	#rotacao {
		padding: 110px 0px 9px 0px !important;
	}

	#rotacao h3 {
		padding-top: 10px !important;
		font-size: 0.9rem !important;
		text-align: center;
	}

	#rotacao {
		margin-top: -15px;
		padding: 100px 0px 70px 0px;
	}

	.info-vertical {
		padding: 100px 0px 0px 0px !important;
	}

	.pos-vertical {
		top: 125px !important;
	}

	.selo-vertical { max-width: 263px !important;
		padding: 166px 0px 0px 120px !important;
		width: 60% !important; }

    .mt-vertical {
		margin-top: 70px !important;
	}

	.info-vertical {
		margin-top: 0px !important;
	}

	.info-performance {
		margin-top: 0px !important;
	}

	

	#filtro .text-right {
		padding-top: 0px !important;
		padding-left: 40% !important;
		padding-right: 0px !important;
	}

	#filtro p {
		font-size: 0.9em !important;
		line-height: 1.2rem !important;
	}

	.mt-filtro {
		margin-bottom: -35px !important;
		padding-top: 191px !important; 
		margin-top: -85px !important;
	}

	.pos-selo {
		top: 125px !important;
	}

	

	#filtro .text-right {
		padding-top: 0px !important;
		padding-left: 33% !important;
	}

	#filtro .pos-filtro { width: 90%; }

}


@media (min-width: 490px) and (max-width: 767px)  {


	#rotacao h2 {
		font-size: 1.5em !important;
		line-height: 1.3em;
	}
	#rotacao .slogan { margin-top: 0px !important; }
	#rotacao .slogan-yellow { margin-top: 0px !important; }

	.pos-selo {
		max-width: 300px;
		top: 90px;
	}

	.vertical-img {     margin-right: -20px; }

	.pos-vertical {
		max-width: 300px !important;
		top: 95px !important;
		left: 48px !important;
	}

	#filtro .pos-filtro {
		max-width: 300px;
		top: 90px;
	}

	.mt-7 {
		margin-top: 60px;
	}


	.mt-filtro {
		margin-top: -60px;
	}

	#performance p {
		font-size: 1em !important;
        line-height: 1.3rem !important;
		padding-left: 70px !important; 
	}
	.info-performance {
		padding: 17px 15px 10px 0px !important;
	}

	#vertical p {
		font-size: 1em !important;
        line-height: 1.3rem !important;

	}
	.info-vertical {
		padding: 140px 5px 10px 0px !important;
	}

	#filtro p {
		font-size: 1em !important;
        line-height: 1.3rem !important;
	
	}
	.info-filtro {
		padding: 17px 15px 10px 0px !important;
	}

	.selo {
		max-width: 280px !important;
		padding: 59px 0px 0px 70px !important;
	}



	#intro .logo {
		position: absolute;
		right: 8%;
		top: 2%;
		max-width: 210px;
	}
	#intro .title {
		position: absolute;
		right: 30px;
		bottom: 47px;
		width: 210px;
	}
	#intro h1 {
		font-size: 1.2rem;
	}
}


@media (min-width: 361px) and (max-width: 420px)  {
	#rotacao {
		background-position-x: -290px !important;
		width: 185% !important;
	}

	.pt-infos {
		padding-top: 13px !important;
	}

	#infos .produtos {
		bottom: 27% !important;
		max-width: 245px !important;
	}

	#infos .line {
		line-height: 0.8rem !important;
		padding: 1px 0px 4px 3px !important;
	}

	.pt-infos { padding-left: 0px !important; }
}


@media (min-width: 421px) and (max-width: 489px)  {
	#rotacao {
		background-position-x: -194px !important;
		width: 150% !important;
	}

	#infos .line {
		line-height: 0.9rem !important;
		padding: 2px 10px 14px 5px !important;
	}

	.pt-infos {
		padding-top: 15px !important;
	}

	#infos .produtos {
		bottom: 29% !important;
		max-width: 270px !important;
	}

	.acessorio {
		font-size: 0.8em !important;
		margin-bottom: 0px !important;
	}

	.acessorio .icone {
		max-width: 25px !important;
	}

	.pt-infos {
		padding-top: 13px !important;
	}

}


@media (min-width: 319px) and (max-width: 489px)  {

	#rotacao .slogan {  
		background: rgb(184 141 50 / 90%) !important; max-width: 290px !important;
	}

	#rotacao { background-position-x: -302px; width: 200%; }

	.col-rotacao { -ms-flex: 0 0 90% !important;
    flex: 0 0 90% !important;
    width: 90%;
    max-width: 90%; }

	#rotacao {
		margin-top: 0px !important;
		padding: 200px 0px 20px 0px !important;
	}

	.giro-360 {
		max-width: 70px !important;
	}

	#rotacao h3 {
		padding-top: 10px !important;
		font-size: 0.9rem !important;
		text-align: center;
	}

	#rotacao {
		margin-top: -15px;
		padding: 100px 0px 70px 0px;
	}

	.giro-360 { max-width: 13px; }
	#rotacao { background-color: #152942; }
	#rotacao .slogan-yellow h2 { font-size: 1.3em; }
	#rotacao .slogan-yellow {     max-width: 190px; }

	#rotacao h2 { font-size: 0.9em; line-height: 1.3em; }
	#rotacao .yellow {
		font-size: 0.8rem;
	}
	#rotacao h3 { font-size: 1.3em; }

	#rotacao .slogan { padding: 15px 15px 10px 15px; max-width: 185px; }

	.vertical-img { margin-right: -13px; }

	#vertical p {
		font-size: 1em !important;
		line-height: 1.3rem !important;
	}

	.info-vertical {
		padding: 115px 0px 0px 0px !important;
	}

	.arco-brilho {    height: 325px;
		width: 285px !important; }

	.pos-vertical {
		left:30px;
		top: 0px !important;
	}

	.selo-vertical {     max-width: 230px !important;
		padding: 65px 0px 0px 110px !important;
		width: 230px !important; }

    .mt-vertical {
		margin-top: 70px !important;
	}

	.info-vertical {
		margin-top: 0px !important;
	}

	#filtro .pos-filtro {
		max-width: 93% !important;
		width: 91% !important;
		left: 6%;
		top: 110px !important;
		padding-right: 5px !important;
	}

	.mt-filtro {
		margin-top: 0px !important;
		margin-bottom: 30px !important;
		padding-top: 80px !important;
		padding-left: 0px;
	}

	#filtro .text-right {
		text-align: right!important;
		padding-left: 25% !important;
		padding-top: 2px !important;
	}

	.info-performance {
		width: 210px !important;
	}

	.info-filtro {
		width: 210px !important;
	}

	.mt-7 {
		margin-top: 95px;
	}

	.mt-vertical {
		margin-top: 80px;
	}

	#performance p {
		font-size: 0.9em !important;
        line-height: 1.1rem !important;
		padding-left: 20px !important; 
	}
	.info-performance {
		padding: 7px 15px 10px 0px !important;
	}

	#filtro p {
		font-size: 0.7em !important;
        line-height: 1.1rem !important;
		padding-left: 0px !important; 
	}
	.info-filtro {
		padding: 7px 15px 10px 0px !important;
	}

	.pos-selo  { top: 90px; }

	.pos-vertical  { top: 90px; }

	#filtro .pos-filtro  { top: 90px; }

	.selo {
		max-width: 180px !important;
		padding: 29px 0px 0px 20px !important;
		width: 40% !important;
	}


	#intro .logo {
		position: absolute;
		right: 5%;
		top: 2%;
		max-width: 145px;
	}
	#intro .title {
		position: absolute;
		right: -2px;
		top: 94px;
		width: 155px;
	}
	#intro h1 {
		font-size: 0.8rem;
		line-height: 1.1;
	}
}


@media (max-width: 769px)  {
	.acessorio .icone {
		padding: 0px 0px 0px 0px !important;
	}

	#infos .line {
		line-height: 1.2rem;
		padding: 2px 10px 15px 5px !important;
	}

	#rotacao h3 {
		padding-top: 10px;
		font-size: 1.1rem;
	}

	.giro-360 {
		max-width: 80px;
	}

	.vertical-img {
		z-index: 9;
	}

	#rotacao {
		margin-top: -20px;
		padding: 82px 0px 50px 0px;
	}

	#rotacao h2 { line-height: 1.3em; }
	#rotacao .yellow { font-size: 1rem; }
	#rotacao .slogan { max-width: 310px; margin-top: 0px; background: #b88d32; }
    #rotacao .slogan-yellow { max-width: 210px; margin-top: 0px; background: rgb(205, 154, 51, 0.9); }

	#rotacao .slogan-saudavel h3 {
		padding-top: 5px;
		padding-left: 10px;
	}

    .end { -ms-flex-pack: end!important;  justify-content: flex-end!important; } }


@media (max-width: 420px)  {
    .info-performance { padding: 10px 15px 10px 0px !important; }
	.info-performance {
		margin-top: 9px !important;
		height: 195px !important;
	}
	#performance p {
		font-size: 0.8rem !important;
		line-height: 0.9rem !important;
		margin-bottom: 5px !important;
	}

	.info-filtro { padding: 10px 15px 10px 0px !important; }
	.info-filtro {
		margin-top: 9px !important;
		height: 195px !important;
	}
	#filtro p {
		font-size: 0.8rem !important;
		line-height: 0.9rem !important;
		margin-bottom: 5px !important;
	}
}



@media (max-width: 319px)  {

	#infos .line {
		line-height: 0.8rem !important;
	}

	.pt-infos {
		padding-left: 0px !important;
		padding-top: 5px !important;
	}

	#infos .line {
		line-height: 1.1rem;
		padding: 2px 10px 15px 5px !important;
		color: #878787;
	}

	#infos .produtos { display: none; }

	.acessorio {
		font-size: 0.7em;
		margin-bottom: 5px;
	}

	#rotacao .slogan {
		background: rgb(184 141 50 / 90%) !important;
	}

	#rotacao h3 {
		padding-top: 9px !important;
		font-size: 0.8rem !important;
		line-height: 1.1;
	
	}

	.slogan { padding: 10px 30px 0px 20px !important; }

	.giro-360 {
		max-width: 70px !important;
	}

	#rotacao .slogan {
		max-width: 245px;
	}

	#rotacao {
		background-position-x: -205px !important;
        width: 180% !important;
		padding: 145px 0px 20px 0px !important;
		margin-top: 0px !important;
	}

	.vertical-img { margin-right: -9px; }

	#vertical p {
		font-size: 0.7em !important;
       line-height: 0.8rem !important;
	}

	.info-vertical {
		padding: 96px 0px 0px 0px !important;
	}

	.arco-brilho {   height: 277px;
		width: 222px !important; }

	.pos-vertical {
		left: 23px;
		top: 0px !important;
	}


    .mt-vertical {
		margin-top: 70px !important;
	}

	.info-vertical {
		margin-top: 0px !important;
	}

	.filtro-img { width: 27% !important; }

	#filtro .pos-filtro {
		left: 6%;
		width: 93%;
		padding-right: 3px !important;
	}

	.selo-filtro {
		max-width: 75px !important;
		right: 7% !important;
		top: 10% !important;
	}

	#filtro p {
		font-size: 0.7rem !important;
		padding-left: 0px !important;
	}

	#filtro .text-right {
		padding-left: 24% !important;
		padding-top: 0px !important;
		padding-right: 0px !important;
	}

	#filtro p {
		font-size: 0.7rem !important;
	}

	.info-filtro {
		padding: 5px 15px 10px 0px !important;
	}

	.mt-filtro {
		margin-top: 0px !important;
		margin-bottom: 25px !important;
		padding-top: 65px !important;
		padding-left: 0px;
	
	}


	#intro .logo {
		position: absolute;
		right: 4%;
		top: 2%;
		max-width: 130px;
	}
	#intro .title {
		position: absolute;
		right: 45px;
		top: 74px;
		width: 85px;
	}
	#intro h1 {
		font-size: 0.7rem;
		line-height: 1.1;
	}

	.mt-7 {
		margin-top: 70px;
	}

	.mt-vertical {
		margin-top: 70px;
	}

	.mt-filtro  { margin-top: -70px; }

	#performance p {
		font-size: 0.7em !important;
		line-height: 0.8rem !important;
		padding-left: 17px !important; 
	}

	.info-performance {
		padding: 8px 15px 10px 0px !important;
	}


	#filtro p {
		font-size: 0.7em !important;
		line-height: 0.8rem !important;

	}

	.info-filtro {
		padding: 8px 15px 10px 0px !important;
	}


	.pos-selo  { top: 75px; }

	.pos-vertical  { top: 75px; }

	#filtro .pos-filtro  { top: 100px; }

	.selo {
		max-width: 160px !important;
		padding: 25px 0px 0px 20px !important;
		width: 50% !important;
	}
	.selo-vertical {
		max-width: 180px !important;
		padding: 52px 0px 0px 76px !important;
		width: 69% !important;
	}
}


@media (max-width: 590px)  {
	#infos .line {
		line-height: 1rem;
		padding: 2px 10px 8px 5px !important;
		color: #878787;
	}

	.pt-infos {
		padding-top: 15px !important;
	}



	.selo {
		width: 33%;
	}

	.aspirador-acessorios { padding-right: 0px !important; }

	.selo-vertical {
		width: 33%;
	}
	.performance-img {
		width: 100%;
	}
	.info-performance {
		margin-top: 20px;
		height: 195px;
	}
	#performance p {
		font-size: 1.2rem;
		line-height: 1.2rem;
		margin-bottom: 10px;
	}
	.info-performance { width: 65%; padding: 20px 15px 10px 0px; }

	.filtro-img {
		width: 100%;
	}
	.info-filtro {
		margin-top: 20px;
		height: 195px;
	}
	#filtro p {
		font-size: 1.2rem;
		line-height: 1.2rem;
		margin-bottom: 10px;
	}
	.info-filtro { width: 65%; padding: 20px 15px 10px 0px; }

}


@media (min-width: 360px) {

	.title-intro {
		font-size: 1.8em;
	}

	#intro .slogan {
		top: 20px;
		font-size: 0.8em;
	}

	.watts {
		padding: 15px 25px 10px 25px;
	}

	.info-reservatorio {
	    left: 110px;
	    margin-top: 30px;
	}

	.acessorio {
		font-size: 0.8em;
		margin-bottom: 30px;
	}
	
}

@media (min-width: 375px) {

	.info-reservatorio {
	    left: 130px;
	    margin-top: 30px;
	}

	.acessorio {
		font-size: 0.8em;
		margin-bottom: 40px;
	}

	.info-mop {
		top: 35px;
	}

}

@media (min-width: 400px) {

	.title-intro {
		font-size: 2em;
	}

	#intro .slogan {
		top: 22px;
		font-size: 0.9em;
	}

	.turbo-ciclone {
		font-size: 1em;
		padding-bottom: 60px;
	}

	.info-reservatorio {
	    left: 150px;
	    font-size: 1em;
	}

	.acessorio-mop {
		bottom: 100px;
		font-size:1em;
	}

	.acessorio {
		font-size: 0.8em;
		margin-bottom: 50px;
	}

	.info-mop {
	    top: 30px;
	    font-size: 0.7em;
	}
}

@media (min-width: 768px) {
	.info-vertical {  width: 40%; padding: 22px 15px 10px 0px;  }
	.info-performance {  width: 40%; padding: 22px 15px 10px 0px;  }
	.info-filtro {  width: 40%; padding: 22px 15px 10px 0px;  }

    .performance-img { width: 100%; }

	.vertical-img { width: 100%; z-index: 9; }

	.filtro-img { width: 47%; z-index: 9; }
	.selo {  max-width: 420px; padding: 95px 0px 0px 125px; position: absolute; }
	.selo-vertical {        max-width: 468px;
		padding: 285px 0px 0px 228px;
		position: absolute;
		left: 0; }
	#performance p {
		font-size: 1.6em;
		line-height: 2.1rem;
		padding-left: 120px;
	}

	#vertical p {
		font-size: 1.9em;
		line-height: 2.1rem;
		padding-left: 4%;
		padding-top: 49%;
	}

	#filtro p {
		font-size: 1.8em;
       line-height: 2.1rem;
	}

	.nota-footer {
		font-size: 0.6em;
		text-align: left;
	}

	#intro .slogan {
	    top: 32px;
	    left: 20px;
	    font-size: 1.5em;
	    width: 80%;	    
	}

	.title-intro {
		font-size: 2.5em;
	}

	.watts {
		padding: 20px 40px 15px 40px;
	}

	#doisum { 
		font-size: 1.5em;
	}

	.turbo-ciclone {
	    font-size: 1.8em;
	    padding: 10px 60px 120px 60px;
	}

	.info-reservatorio {
	    left: 240px;
	    font-size: 2em;
	    margin-top: 50px;
	}


	#infos .mt-infos { margin-top: -50px; }

	.aspirador-ciclone {
		margin-top: 150px;
	}

	.acessorio {
		font-size: 1.6em;
		margin-bottom: 70px;
	}

	#uso {
		font-size: 1.2em;
		font-weight: 700;
	}

	.acessorio-mop {
		bottom: 180px;
		font-size: 1.5em;
	}

	.info-mop {
	    top: 65px;
	}

}

@media (min-width: 992px) {

	.slogan {
	    border-radius: 0px 0px 200px 200px;
	}

	.slogan {
	    margin-bottom: 15px;
	    font-size: 2.5em;
	    padding: 35px 45px 70px 45px;
	}

	#rotacao .slogan {
	    margin-bottom: 60px;
	    font-size: 2.5em;
		border-radius: 0px 200px 200px 0px;
		padding: 25px 70px 20px 110px;
		margin-top: 70px;
	}

	#rotacao h3 {
	    font-size: 2.1rem;
		padding-top: 20px;
		text-align: center;
		padding-bottom: 9px;
	}

	#rotacao .slogan-yellow h3 {
		padding-top: 0px;
	}

	
	.title-intro {
		font-size: 2.5em;
		margin: 40px 0px;
	}

	.watts {
		padding: 30px 60px 25px 60px;
		border-radius: 80px 0px 0px 80px;
	}

	#intro .slogan {
	    top: 45px;
	    left: 5px;
	    font-size: 1.9em;
	    width: 80%;
	}

	.aspirador-ciclone {
		margin-top: -80px;
	}

	.info-reservatorio {
	    left: 330px;
	    font-size: 2em;
	    margin-top: 70px;
	}

	.acessorio-mop {
		bottom: 180px;
		font-size: 2em;
	}

	.info-mop {
	    top: 90px;
	}

	
}

@media (min-width: 1100px) {

	#rotacao .slogan {
		padding: 40px 20px 20px 103px;
		margin-top: 70px;
		max-width: 635px;
	}

	.title-intro {
		font-size: 2.8em;
		margin: 40px 0px;
	}

	#intro .slogan {
   		top: 45px;
	    left: 50px;
	    font-size: 1.8em;
	    width: 60%;
	}

	.watts {
		padding: 40px 60px 30px 60px;
		border-radius: 80px 0px 0px 80px;
		bottom: 30px;
	}

	#doisum { 
		font-size: 1.6em;
	}

	.info-reservatorio {
	    left: 330px;
	    font-size: 2em;
	    margin-top: 60px;
	}

	#uso {
		font-size: 1.4em;
		font-weight: 700;
	}

	.britaniar {
	    font-size: 0.9em;
	    padding: 12px 0px 0px 10px;
	}

	.turbo-ciclone p {
	    font-size: 0.6em;
	    line-height: 1.1em;
	}

	.info-mop {
	    top: 110px;
	}

}


@media (min-width: 1200px) {

	.acessorio-mop {
	    bottom: 90px;
	    right: -40px;
	    font-size: 2em;
	}

	.info-mop {
	    top: 120px;
	    right: 50px;
	}
}