#AreaLogo {background: #000; border-bottom: 6px solid #c95913; padding: 20px 50px; margin: 0 auto;} #AreaGeralProduto {position: relative; background: #FFF; width: 100%; display: block; max-width: 900px; margin: 0 auto; font-family: 'Oswald', sans-serif; font-size: 16px; color: #FFF;} #AreaGeralProduto br {display: block; clear: both;} .BackgroundGeral {width: 100%; display: block;} #AreaGeralProduto p {width: 360px; z-index: 999; display: block; clear: both; box-sizing: border-box; text-align: justify; color: #000;} #AreaGeralProduto p strong {color: #ca5a1a;} #AreaGeralProduto h3 {color: #000; font-size: 22px; margin: 10px 0; text-transform: uppercase; display: block; clear: both;} #AreaGeralProduto h3 span {color: #ca5a1a;} .ConteudoBloco {padding: 0 50px; box-sizing: border-box; top: 0; width: 100%;} #BlocoUm {display: block; clear: both; background: #151515; height: 680px; position: relative;} #BlocoUm .ConteudoBloco {width: 450px; right: 20px; top: 50px; z-index: 999; position: absolute;} #LogoProduto {float: right;} #BlocoUm h3 {color: #FFF; float: right; margin-top: 20px;} #BlocoUm p {color: #FFF; float: right; display: block; clear: both;} #BlocoUm p img {clear: both; display: block; float: right; position: absolute; z-index: 999;} #imagemPrincipal {position: absolute; left: 80px; bottom: 30px; z-index: 999;} #BlocoDois {position: relative; margin-top: -150px;} #BlocoDois .ConteudoBloco {position: absolute; width: 430px; margin-top: 200px;} #BlocoDois h3 {color: #FFF; width: 100%;} #BlocoDois p {color: #FFF; width: 100%;} #PulseiraGrande {position: absolute; right: 0; bottom: -130px;} #BlocoTres {padding-top: 150px;} #BlocoTres h3 {color: #000; width: 100%;} #BlocoTres p {color: #c95913; width: 100%;} #BlocoTres img {width: 100%;} #BlocoQuatro {} #BlocoQuatro iframe {width: 100%; max-width: 560px;} #ImgMeramente {display: block; clear: both;} #FimBlocos {padding: 10px; text-align: center; font-size: 22px; font-weight: bold; color: #FFF; background: #c95913; border-bottom: 6px solid #000; text-transform: uppercase;} @media screen and (max-width: 800px) { #PulseiraGrande {display: none;} #BlocoUm {height: auto;} #BlocoUm .ConteudoBloco {width: 100%;} #BlocoUm .ConteudoBloco img {display: block; clear: both; float: none;} #BlocoUm p {width: 100%;} #BlocoUm h3 {width: 100%;} #imagemPrincipal {position: initial; margin: 50px 0;} #BlocoUm .ConteudoBloco {position: initial;} #ApagarImg {display: none !important;} #BlocoDois {position: initial; background: #c95913; float: left; display: block; clear: both; width: 100%; margin: 0;} #BlocoDois .ConteudoBloco {position: initial; width: 100%; margin-top: 30px;} #BlocoDois .BackgroundGeral {display: none;} #BlocoTres {display: block; clear: both; padding-top: 30px;} } @media screen and (max-width: 530px) { .ConteudoBloco {padding: 0 20px;} #AreaGeralProduto h3 {text-align: center;} } @media screen and (max-width: 440px) { } @media screen and (max-width: 400px) { #AreaLogo img {width: 100%;} #BlocoDois img {width: 100%;} #imagemPrincipal {width: 100%; padding: 0 50px; box-sizing: border-box;} #BlocoUm .ConteudoBloco img {width: 100%;} }