/* Hotsite Philips v1.0 */

@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;900&display=swap');

.lp-colchao--hero {width:100%; font-family: 'Lato', sans-serif;}
.lp-colchao--hero h1 {font-size: 26px; color: #fff; margin: 0 auto;}
.lp-colchao--hero h2 {font-size: 36px; color: #004EAA; margin: 0 auto; font-weight: bolder; text-align: center; padding: 80px 0 20px 0;}
.lp-colchao--hero a.cta {background: #1F3A99; color: #fff; font-size: 16px; font-weight: 900; border-radius: 6px; display: inline-block; padding:15px 50px; margin-top: 20px;}
.lp-colchao--hero a.cta:hover {opacity: 0.8;}
.lp-colchao--hero a.cta2 {background: #fff; color: #274BCB; font-size: 16px; font-weight: 900; border-radius: 6px; display: inline-block; padding:15px 50px; margin-top: 20px;}
.lp-colchao--hero a.cta2:hover {opacity: 0.8;}
.lp-colchao--hero p {font-size: 16px; padding: 5px 0; color: #343434;}
.lp-colchao--hero section .container-content {width: 1200px;  margin: 0 auto; display: flex; align-items: center; flex-wrap: wrap;}
.lp-colchao--hero h2.tit {color: #fff!important; margin-bottom: 30px;}
.mobili{display: none !important; visibility: none;}
.deski {display: block !important;} 

/* Intro */
.wrapper {height: 622px; overflow-x: hidden; overflow-y: hidden; perspective: 300px;}
.parallax__group {position: relative; height: 692px; width: 100vw; transform-style: preserve-3d; z-index: -999;}
.parallax__layer {position: absolute; top: -140px; left: 0; right: 0; bottom: 0;}
.sky {background: url('https://www.casasbahia-imagens.com.br/criacao/03-hotsite/2021/08-ago/colchao/images/bg-nuvem.png')  no-repeat center; background-size: cover; transform: translateZ(-600px) scale(3); z-index: -1; height: 692px;}
.star {background: url('https://www.casasbahia-imagens.com.br/criacao/03-hotsite/2021/08-ago/colchao/images/star.png') no-repeat center; background-size: cover; transform: translateZ(-300px) scale(2.75); z-index: 2; height: 574px}
.year-container {position: absolute; left: 42%; top: 60%; transform: translate(-50%, -50%); width: 17rem; height: 25rem;}

/* Tipos de Colchão */
.lp-colchao-tipos {  background: #fff; transform: translateZ(0) scale(1); z-index: 8; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center;}
.lp-colchao-tipos .container-content ul {display: flex; flex-wrap: wrap; justify-content: space-around; margin-bottom: 80px;}
.lp-colchao-tipos .container-content ul li {flex: 1; justify-content: space-between; margin-right:20px ;}
.lp-colchao-tipos .container-content ul .label {font-size: 24px; color: #274BCB;}
.lp-colchao-tipos .container-content ul div:last-child {margin-right: 0;}

/* Medidas */

.lp-colchao-medidas {background-color: #1F3A99;}
.lp-colchao-medidas .container-content ul {display: flex; flex: 1;  justify-content: space-between; margin-bottom: 80px;}
.lp-colchao-medidas .container-content ul span.label {font-size: 18px; color: #fff; display: block; text-align: center;}
.lp-colchao-medidas .container-content ul li {overflow: hidden; position: relative; transition: all 0.25s;}
.lp-colchao-medidas .container-content ul li:hover {transform: scale(1.1, 1.1); }

/* Tabela */

.lp-colchao-tabela {background-color: #274BCB;}
.lp-colchao-tabela .container-content .cta2 {margin:0 auto 80px;}
.lp-colchao-tabela .container-content .tabela {width: 100%; margin: 0 auto; font-size: 20px; text-align: center; padding-bottom: 40px;}
.lp-colchao-tabela .container-content .tabela thead {background-color: #1F3A99; color: #fff;}
.lp-colchao-tabela .container-content .tabela tbody {background-color: #335EF4; color:#fff;}
.lp-colchao-tabela .container-content .tabela table,th,td {border: 1px solid #1F3A99; padding: 20px; text-align: center;}
.lp-colchao-tabela .container-content .tabela .color {background-color: #274BCB;}

/* Porque investir */

.lp-colchao-investimento {background-color: #fff;}
.lp-colchao-investimento .container-content .lp-colchao-cont {display: flex; justify-content: space-between; }
.lp-colchao-investimento .container-content .lp-colchao-cont .investimento-cont {width: 500px; margin-right: 100px;}
.lp-colchao-investimento .lp-colchao-list {width: 100%; background-color: #F5F5F7;}
.lp-colchao-investimento .lp-colchao-list .list {width: 1200px; display: flex; margin: 0 auto; align-items: center; justify-content: space-between;}
.lp-colchao-investimento .lp-colchao-list .list ul {margin: 60px 0; display: flex; flex-wrap: wrap;}
.lp-colchao-investimento .lp-colchao-list .list ul li {width: calc(100% / 3); font-size: 16px; color: #343434; list-style-image: url(../https://www.casasbahia-imagens.com.br/criacao/03-hotsite/2021/08-ago/colchao/images/arrow.png);  padding-top: 20px;}
.lp-colchao-investimento h2 {text-align: left;}

/* Tecnologia */

.lp-colchao-tecnologias {background-color: #fff;}
.lp-colchao-tecnologias .container-content .lp-colchao-tech {display: flex;  margin:40px 0 60px 0;}
.lp-colchao-tecnologias .container-content .lp-colchao-tech p.txt {font-size: 24px; color: #274BCB;}
.lp-colchao-tecnologias .container-content .lp-colchao-tech img {margin: 0 30px 60px 30px;}
.lp-colchao-tecnologias .container-content .lp-colchao-tech .label {font-size: 24px; color: #274BCB;}
.lp-colchao-tecnologias .container-content .lp-colchao-tech .tech .cont-tech{margin-top: 40px;}

/* Marcas */

.lp-colchao-brand {background-color: #1F3A99;}
.lp-colchao-brand .container-content ul a img {border-radius: 100%; border: 1px solid #fff; padding: 6px; margin-right: 16px;}
.lp-colchao-brand .container-content ul {margin-bottom: 120px; display: flex; flex-wrap: wrap;}
.lp-colchao-brand .container-content ul div:last-child {margin-right: 0;}
.lp-colchao-brand .container-content ul li {overflow: hidden; position: relative; transition: all 0.25s;}
.lp-colchao-brand .container-content ul li:hover {transform: scale(1.1, 1.1); }

/* Outros produtos */

.lp-colchao-products {background-color: #F7F7F7;}
.lp-colchao-products .container-content ul {display: flex; flex: 1; justify-content: space-between; margin-bottom: 80px;}
.lp-colchao-products .container-content span {font-size: 26px; color: #274BCB; display: block; text-align: center;}
.lp-colchao-products .container-content ul li {overflow: hidden; position: relative; transition: all 0.25s;}
.lp-colchao-products .container-content ul li:hover {transform: scale(1.1, 1.1); }

/* Estágio do sono */

.lp-colchao-estagio {background-color: #fff;}
.lp-colchao-estagio .container-content ul {display: flex; flex-wrap: wrap; margin:40px 0 80px 0;}
.lp-colchao-estagio .container-content ul li {flex: 1; justify-content: space-between; text-align: center; margin-right: 10px;}
.lp-colchao-estagio .container-content ul li span {font-size: 16px; color: #343434; display: table; text-align: center; margin-top: 20px;}
.lp-colchao-estagio .container-content ul li div:last-child {margin-right: 0;}

/* Travesseiros */

.lp-colchao-travesseiros {background-color: #f5ba2e;}
.lp-colchao-travesseiros .container-content .travesseiros {display: flex; justify-content: space-between;}
.lp-colchao-travesseiros .container-content .travesseiros p {color: #343434;}
.lp-colchao-travesseiros .container-content .travesseiros h2 {color: #343434!important; text-align: left; margin-bottom: 0!important; margin-top: 60px;}

/* Footer */

.lp-colchao-footer {height: 285px; background: url(https://www.casasbahia-imagens.com.br/criacao/03-hotsite/2021/08-ago/colchao/images/bg-nuvem_footer.png);}
.lp-colchao-footer .container-content a {margin: 120px auto 0; text-align: center;}
.lp-colchao-footer .container-content span {font-size: 18px; font-weight: bolder; display: table; color: #fff; margin-top: 10px;}

/* Styles mobile */
@media screen and (max-width: 768px) {
.lp-colchao--hero h1 {font-size: 20px;}
.lp-colchao--hero h2 {font-size: 26px; padding: 0; margin-top: 60px; text-align: center;}
.lp-colchao--hero h2.tit {margin-bottom: 0;}
.lp-colchao--hero p {font-size: 16px; text-align: center}
.lp-colchao--hero section .container-content {width: 100%; padding: 0 20px;}
.lp-colchao--hero section .container-content span {font-size: 20px;}
.lp-colchao--hero section .container-content label {font-size: 20px;}
.mobili{ display: block !important; }
.deski { display: none !important; visibility: none; }

.wrapper {height: 476px;}
.parallax__group {height: 500px;}
.sky {height: 576px; background-size:initial ;}
.year-container {width: 100%; margin: 0 auto;}
.year-container img {width: 100%; text-align: center; padding:124px 0 0 45px;}

.lp-colchao-tipos .container-content ul li {margin-top: 60px; text-align: center;}

.lp-colchao-medidas .container-content ul {width: 100%; text-align: center; display: block;}
.lp-colchao-medidas .container-content ul li img{width: 50%; margin-top: 40px;}

.lp-colchao-investimento .container-content .lp-colchao-cont {width: 100%; text-align: center; display: block; margin: 0!important;}
.lp-colchao-investimento .lp-colchao-cont img {width: 100%; margin-top: 30px;}
.lp-colchao-investimento .container-content .lp-colchao-cont .investimento-cont {width: 100%;}
.lp-colchao-investimento .lp-colchao-list .list ul {width: 100%;}
.lp-colchao-investimento .lp-colchao-list .list ul li {width: 100%;}


.lp-colchao-tabela {width: 100%;}
.lp-colchao-tabela .container-content .tabela {font-size: 11px; margin-top: 20px;}
.lp-colchao-tabela .container-content .tabela table,th,td {padding:10px 0;}

.lp-colchao-tecnologias .container-content .lp-colchao-tech {width: 100%; display: block; margin: 0!important; padding-bottom: 60px; text-align: center;}
.lp-colchao-tecnologias .container-content .lp-colchao-tech img {width: 100%; margin: 0!important; padding-top: 20px;}
.lp-colchao-tecnologias .container-content .lp-colchao-tech .label {margin-top: 20px;}
.lp-colchao-tecnologias .container-content .lp-colchao-tech p.txt {font-size: 20px;}

.lp-colchao-brand .container-content ul {margin-bottom: 60px!important; text-align: center;}
.lp-colchao-brand .container-content ul li {margin:0 auto; padding: 10px;}
.lp-colchao-brand .container-content ul div:last-child {margin-right: 0;}
.lp-colchao-brand .container-content ul a img {margin: 0!important;}

.lp-colchao-products .container-content img {width: 90%;}
.lp-colchao-products .container-content ul {display: block; text-align: center;}
.lp-colchao-products .container-content ul li {margin-top: 10px;}

.lp-colchao-estagio .container-content ul li {margin-top: 40px;}
.lp-colchao-estagio .container-content ul {margin: 0!important; padding-bottom: 60px;}
.lp-colchao-estagio .container-content ul li span {font-size: 16px; color: #343434; display: table; text-align: center; margin-top: 20px;}

.lp-colchao-travesseiros .container-content .travesseiros {width: 100%; display: table;}
.lp-colchao-travesseiros .container-content .travesseiros .travesseiros-txt {text-align: center;}
.lp-colchao-travesseiros .container-content .travesseiros img{width: 100%; padding-top: 20px;}
.lp-colchao-travesseiros .container-content .travesseiros h2 {text-align: center;}

.lp-colchao-footer .container-content a {margin: 150px auto 0;}
}

