* {font-family:"Roboto", "Sans serif"; font-size: 14px; font-weight:400}

::-webkit-input-placeholder {font-weight: 300; color: #323d4c}
:-moz-placeholder { font-weight: 300; color: #323d4c /* Firefox 18- */ }
::-moz-placeholder { font-weight: 300; color: #323d4c /* Firefox 19+ */ }
:-ms-input-placeholder {font-weight: 300; color: #323d4c}

html, body {display:block;height:100%;width:100%;padding:0;margin:0}
input, textarea, h2, hr {padding:0;margin:0; }
a, a:hover {text-decoration:none}
section {text-align:center;display:block;position:relative}
ul {list-style:none; padding: 0; margin: 0}

.clearfix::after {content: "";clear: both;display: table}
.limite {margin:0 auto;text-align:left; width:1160px}
.ir {text-indent:-999px;overflow:hidden}
.msgErro {color: red; text-align: center}
.msgSucesso {color: green; text-align:center}

.btn {display: inline-block;padding: 0px 27px;height: 30px;line-height: 30px;border-radius: 15px;font-size: 16px;font-weight: 300;font-style: italic; border: none; cursor: pointer}
.btn-rosa {background-color: #ee1f60; color: #FFFFFF}

.tarja {height: 32px; background-color: #FF1962;margin-bottom: 55px;}
.tarja .limite {color: #FFF; font-size:16px; font-weight:500; line-height:32px}

.form input {width: 378px; height: 48px; border: 1px solid #CCC; line-height: 48px; text-indent: 15px; font-weight: 300; font-size: 18px; margin-bottom: 10px;}
.form textarea {width: 373px; height: 180px; border: 1px solid #CCC; line-height: 24px; text-indent: 15px; font-weight: 300; font-size: 18px; margin-bottom: 10px; padding-left: 5px}

.divisor {text-align:center; width: 100%; height: 14px;  position: relative}
.divisor hr {border: 1px solid #e1e1e1; position: absolute; top: 6px; width: 100% }
.divisor span {display: inline-block; width: 90px ;height: 14px; background-color:#febe10; border-radius: 7px; position:relative }

.box-produto {width: 278px; height: 320px; float: left}
.box-produto a {display: inline-block; width: 278px; height: 320px; text-align:center }
.box-produto .box-img {display: block; width: 100%; height: 200px; text-align:center; line-height:180px }
.box-produto .box-img img {vertical-align: middle; max-width: 260px;height: auto; }
.box-produto strong {display: block; font-weight: 700; color: #323d4c; font-size: 20px; text-align:center; margin-bottom: 20px; height:50px}


#topo {height: 86px; padding-top: 30px; background-color: #FFFFFF}
#logo {float: left; background:url(../imagens/shopping-vida.png) center no-repeat; width:196px; height:51px}
#bt-menu {display:none}
#menu-home {width: 460px; float: right;height: 30px;line-height: 30px; margin-top: 10px}
#menu-home li {float:left}
#menu-home li a {display:inline-block; height:25px; line-height:25px; padding:0 15px; margin:0 10px; border-radius: 13px; color: #323d4c}
#menu-home li.ultimo a {margin-right: 0}
#menu-home li a:hover, #menu-home li a.hover {background-color: #ee1f60; color: #FFFFFF}
#menu-social {float: right;height: 30px;line-height: 30px; margin-top: 10px}
#menu-social li {float: left; margin-right: 5px}

#padding-mobile {display:none}

#banner {height:550px}
#banner ul, #banner li, #banner a { height:517px; width:100% }
#banner a {display:block; background-position: center; background-repeat: no-repeat; background-size: cover }
#nav-banners {text-align:center; height: 20px; width: 100%; padding-top: 15px }
#nav-banners a {display: inline-block; width: 14px; height:14px; font-size: 8px; color: #E2E2E2; background-color: #E2E2E2; border-radius: 50%; margin: 0 2px}
#nav-banners a:hover, #nav-banners a.activeSlide {color: #FF1861; background-color: #FF1861}

#destaques {padding-top: 40px; margin-bottom: 100px }
#destaques .titulo {font-weight: 700; font-size: 24px; text-align:center; margin-bottom: 15px }

#marcas {position: relative; margin-bottom: 60px}
#marcas ul, #marcas ul li, #marcas ul div {height: 140px; width: 100%; background-color: #FFF }
#marcas ul div { text-align:center;  height: 140px; }
#marcas ul div a {margin: 0 45px; display: inline-block; height: 140px; line-height: 140px; width:200px}
#marcas ul div a.primeiro, #marcas ul div a.ultimo {margin: 0 0}
#marcas ul div a img {vertical-align:middle; max-width: 190px; }
#nav-marcas {position: absolute; top: 45%; height:50px; width: inherit; z-index: 100 }
#nav-marcas .esquerdo {float: left }
#nav-marcas .direito {float: right }

#rodape {height: 290px; padding-top: 70px; background-color: #283A4B }
#rodape .limite { width: 960px }
#rodape .coluna {width: 300px; float: left; margin-right: 40px }
#rodape .coluna-3 {width: 270px; float: right; margin-right: 0 }
#rodape .primeiro {margin-bottom: 60px }
#logo-pequena {float:left }
#siga {width: 250px; height: 45px; float: right; line-height:45px }
#siga span {font-size: 22px; color: #93a3ba } 
#siga ul {width: 170px; height: 45px; float: right;}
#siga ul li {float:left; margin:0 2px }

#rodape address {font-size: 18px; color: #93a3ba; font-style: normal; margin-bottom: 25px} 
#lnk-privacidade {}
#rodape strong {font-weight: 700; font-size: 18px; color: #93a3ba;}
#menu-rodape {padding-top: 25px } 
#menu-rodape a {font-weight: 300; color: #93a3ba}
#menu-rodape a:hover, #menu-rodape a.hover {color: #FF1962}
#form-news {padding-top: 30px } 
#form-news input {width: 220px; height: 50px; line-height: 50px; font-size: 18px; font-weight: 300; color: #323d4c; text-indent: 10px; float: left; border: none }
#form-news button {width: 50px; height: 50px; background-color: #FF1962; color: #FFF; border:none; float: left; cursor: pointer; line-height: 50px; }
#form-news button img { vertical-align: middle; }

#rodape .terceiro {margin-top: 20px; text-align: right }

/** PRODUTOS **/
#listagem-produtos .ver-todas {height: 35px; line-height: 35px; margin-bottom: 10px}
#listagem-produtos .ver-todas h2 {color: #323d4c; font-weight: 700; font-size: 24px; float:left; text-transform:uppercase}
#listagem-produtos .ver-todas a {color: #ee1f60; font-style: italic; font-size: 18px; font-weight: 300; float: right}
#listagem-produtos .divisor {text-align:left; margin-bottom: 30px}

#bt-menu-categorias {display:none;}
#menu-categorias {background-color:#FF1962; margin-bottom: 30px}
#menu-categorias ul {text-align:center; position:relative}
#menu-categorias li { height: 80px; line-height: 80px; display: inline-block}
#menu-categorias a {font-size: 18px; text-transform: uppercase; font-style: normal; color: #FFF; display: inline-block; width: 160px;  position: relative}
#menu-categorias a.hover, #menu-categorias a:hover {color: #eebd30; font-weight: 700}

#menu-categorias li .sub-menu-categorias {display: none; text-align: left; background-color: #FFF; position:absolute; top: 80px; left: 0; z-index: 200; width:1158px; border: 1px solid #CCC; border-top: none; box-shadow: 0px 0px 7px 0px #bbb	 }
#menu-categorias li .sub-menu-categorias li {  height: 160px; margin: 0 40px}
#menu-categorias li .sub-menu-categorias li a { height: 160px; line-height: 160px; width: auto; display: inline-block }
#menu-categorias li .sub-menu-categorias li a img {max-width: 150px; vertical-align:middle}
#menu-categorias li a .point-menu {display: none; position: absolute;background-color: #FFF;transform: rotate(45deg); bottom: -10px;left: 40px;width: 20px;height: 20px}
#menu-categorias li:hover .sub-menu-categorias,#menu-categorias li:hover a .point-menu {display:block}
#menu-categorias li:hover .sub-menu-categorias li a {font-weight: 400}
.nome-subcategoria-mobile {display:none}

#banner-produtos {display: none;margin-bottom: 55px; height:360px}
#banner-produtos ul, #banner-produtos li, #banner-produtos a {width: 100%; height: 340px; display: block}
#banner-produtos a {background-position: center; background-repeat:no-repeat; background-size: cover }
#nav-banners-produtos {width: 100%; height:20px; line-height: 20px; z-index: 100}
#nav-banners-produtos a {width: 14px; height: 14px; font-size: 6px; color: #E2E2E2; background-color: #E2E2E2; line-height:14px; text-align:center; display:inline-block; margin: 2px; border-radius: 7px}
#nav-banners-produtos a.activeSlide {color: #FF1962; background-color: #FF1962}

.destaques-produtos {margin-bottom: 50px}
.destaques-produtos ul, .destaques-produtos li { background-color: #FFF}
.destaques-produtos li {height:280px}
.nav-destaques-produtos {text-align:center; height: 20px; width: 100%; padding-top: 15px }
.nav-destaques-produtos a {display: inline-block; width: 14px; height:14px; font-size: 8px; color: #E2E2E2; background-color: #E2E2E2; border-radius: 50%; margin: 0 2px}
.nav-destaques-produtos a:hover, .nav-destaques-produtos a.activeSlide {color: #FF1861; background-color: #FF1861}



@media screen and (max-width: 500px) {
	.limite {width:310px}
	
	.form input {width: 305px;}
	.form textarea {width: 300px; height: 120px;}

	.box-produto {width: 310px; float: none;}
	.box-produto a {width: 310px;}
	
	.tarja {margin-bottom: 20px}
	
	#topo {height: auto; min-height:40px; padding-top: 0;position: fixed;z-index: 20; box-shadow:0px 0px 2px 2px #666666;width: 100%;}
	#logo {float: right; background-size: contain;margin: 5px; width:120px; height:31px}
	#bt-menu {display:block; float:left;margin: 5px; background:none; border: none; font-size: 30px; font-weight: bold; padding: 0px; height:30px;width:30px;line-height:30px}
	#menu-home {width: 310px; float: none; clear:both; height: auto; display:none; margin-top: 0px; overflow:hidden; text-align: center;}
	#menu-home li {float:none;padding: 5px 0;}
	#menu-home li a {padding:0 10px; margin:0 0px; text-align:center;height: 35px;line-height: 35px;width:250px}
	#menu-home li a:hover {background-color: #FFFFFF; color: #ee1f60}
	#menu-social {float: left; margin: 5px}
	#menu-social li {margin-left: 5px}
	
	#padding-mobile {display:block;height:41px}
	
	#banner {height:155px}
	#banner ul, #banner li, #banner a { height:135px }
	#nav-banners a {height:14px;}

	#destaques {padding-top: 20px; margin-bottom: 50px }
	
	#marcas {margin-bottom: 0px}
	#marcas ul, #marcas ul li, #marcas ul div {height: 280px;}
	#marcas ul div {height: 280px; }
	#marcas ul div a {margin: 0 10px; height: 120px; line-height: 120px; width:100px; text-align:center}
	#marcas ul div a.ultimo, #marcas ul div a.primeiro {margin: 0 10px}
	#marcas ul div a img {vertical-align:middle; max-width: 90px; }

	#rodape {height: auto; padding-top: 30px; }
	#rodape .limite { width: 310px }
	#rodape .coluna {width: 310px; float: none; margin-right: 0px; margin-bottom: 20px }
	#rodape .coluna-3 {width: 310px; float: none; margin-right: 0; margin-bottom: 20px }
	#rodape .primeiro {margin-bottom: 0px }
	#logo-pequena {float:none; margin-bottom: 20px }
	#siga {width: 310px; float: none; margin-bottom: 20px}

	#menu-rodape {padding: 10px 0 0 20px}
	#menu-rodape li {padding: 5px 0}
	#menu-rodape a:hover {color: #93a3ba}

	#form-news input {width: 250px;}
	
	/** PRODUTOS **/
	#listagem-produtos .ver-todas {height: auto; line-height: 26	px; margin-bottom: 10px; text-align:right}
	#listagem-produtos .ver-todas h2 {font-size: 18px; float:none; text-align:left}
	#listagem-produtos .ver-todas a {font-size: 14px;; float:none;}
	#listagem-produtos .divisor {text-align:left; margin-bottom: 10px}

	#filtro-categorias {background-color: #FF1962}
	#bt-menu-categorias {display:block; color: #FFF; float:right;margin: 5px; background:none; border: none; font-size: 30px;  padding: 0px; height:30px;width:30px;line-height:30px}
	#menu-categorias {display:none;}
	#menu-categorias ul {text-align:left; padding-left: 20px}
	#menu-categorias li {height: auto;line-height: normal;display: block;width: 100%;padding: 10px 0}
	#menu-categorias a {font-size: 18px; text-transform: uppercase; font-style: normal; color: #FFF; display: inline-block; width: 170px;  position: relative}
	#menu-categorias a.hover {color: #FFF; font-weight: 400}

	#menu-categorias li .sub-menu-categorias {display: block;text-align: center;background-color: transparent;position: static;top: 80px;left: 0;z-index: 200;width: 250px;margin-left: 25px;text-align: left; border: none; box-shadow: none}
	#menu-categorias li .sub-menu-categorias li {  height: auto; margin: 0 0; padding: 2px 0;}
	#menu-categorias li .sub-menu-categorias li a { height: auto;line-height: normal;width: auto;display: block; }
	#menu-categorias li .sub-menu-categorias li a img {display: none}
	#menu-categorias li:hover a .point-menu {display:none}
	.nome-subcategoria-mobile {display: inline-block}
	.imagem-subcategoria-mobile {display:none}
	.nome-subcategoria-mobile.hover {color: #eebd30;}

	#banner-produtos {display: none}
	#banner-produtos ul, #banner-produtos li, #banner-produtos a {height: 120px;}
	#banner-produtos a {background-size: cover }

.destaques-produtos {margin-bottom: 50px}
.destaques-produtos ul, .destaques-produtos li { background-color: #FFF}
.destaques-produtos li {height:280px}
.nav-destaques-produtos {text-align:center; height: 20px; width: 100%; padding-top: 15px }
.nav-destaques-produtos a {display: inline-block; width: 14px; height:14px; font-size: 8px; color: #E2E2E2; background-color: #E2E2E2; border-radius: 50%; margin: 0 2px}
.nav-destaques-produtos a:hover, .nav-destaques-produtos a.activeSlide {color: #FF1861; background-color: #FF1861}
}


