/**
* C A S C A D I N G  S T Y L E  S H E E T
*
* @project		eCommerce
* @version		3.2
* @package		layout
* @author 		rafael@waio.com.br
* @since		FEV 2012
* @copyright	2012 Waio Soluções em TI.
*
-----------------------------------------------------------------------------*/


/* @Import CSS
-----------------------------------------------------------------------------*/
@import url("reset.css");
@import url("common.css");


/**
* L A Y O U T
*
* @section estrutura
*
-----------------------------------------------------------------------------*/
body {
	font:normal 13px/1.2em Arial, Helvetica, sans-serif;
	color:#545454;
}

#wrapper,
.wrapper,
#main {
	max-width:960px;
	min-width:960px;
	margin:0 auto;
}
#wrapper {
	padding:0 10px;
}

.col20 	 {width:20%}
.col25 	 {width:25%}
.col140  {width:140px}
.col190  {width:190px}
.col460  {width:50%}
.col1020 {width:86.44%}
.col1180 {width:100%}

.col140, .col190, .col460, .col1020, .col1180 {
	display:inline;
	float:left;
	position:relative;
}


/* Header
-----------------------------------------------------------------------------*/
#header {
	width:100%;
	height:auto;
	background:url(../images/bg-top.png) top repeat-x;
	border-bottom:8px solid #ffd716;
}
#header .wrapper {
	position:relative;
	width:960px;
	margin:0 auto;
	padding:0 10px;
}
#header h1 {
	float:left;
	width:237px;
}
#header h1 a {
	display:block;
	width:229px;
	height:167px;
	padding-top:10px;
	text-indent:-9999px;
	background:url(../images/img-logo.png) 0 10px no-repeat;
}
#header .menu-big {
	height:45px;
	margin-left:270px;
}
#header .menu-big h3 {
	float:left;
	width:212px;
	height:42px;
	margin-left:18px;
	text-align:center;
	background:url(../images/bg-header-button.png) no-repeat;
}
#header .menu-big h3 a {
	display:block;
	padding-left:30px;
	font:900 17px/42px "Arial Black", Gadget, sans-serif;
	text-transform:uppercase;
	text-shadow:1px 2px 0 #203382;
	color:#fff;
	background:url(../images/sprite-icon-custom-big.png) 12px 5px no-repeat;
}
#header .menu-big h3 a.pedidos {
	background-position:12px -38px;
}
#header .menu-big h3 a.carrinho {
	background-position:12px -83px;
}
#header .header-info {
	width:665px;
	height:50px;
	margin:20px 0 0 270px;
	padding-left:24px;
	background:url(../images/shadow-top-menu.png) bottom center no-repeat;
}
#header .header-info p {
	line-height:40px;
}
#header .header-info h2 {
	padding-left:30px;
	font:bold 31px/40px Arial, Helvetica, sans-serif;
	color:#263a8d;
	background:url(../images/sprite-icon-custom-big.png) 0 -135px no-repeat;
}
#header .navigation {
	position:relative;
	height:45px;
	margin:25px 0 0 290px;
}
#header .navigation .button {
	float:left;
}
#header .navigation .button .item {
	position:relative;
	display:block;
	height:30px;
	margin-left:73px;
	padding-left:32px;
	font:900 19px/30px "Arial Black", Gadget, sans-serif;
	text-transform:uppercase;
	color:#263a8d;
	background:url(../images/sprite-icon-custom-big.png) 0 -190px no-repeat;
	z-index:99;
}
#header .navigation .button .active {
	background-position:0 -235px;
}
#header .navigation .button .categorias {
	margin-left:0;
}
#header .navigation .button .empresa {
	background-position:0 -282px;
}
#header .navigation ul.sub {
	display:none;
	position:absolute;
	top:30px;
	left:0;
	height:70px;
	padding:20px 10px 5px 10px;
	background:url(../images/shadow-top-slider.png) left bottom no-repeat;
	overflow:hidden;
	z-index:98;
}
#header .navigation ul.sub li {
	float:left;
	width:120px;
	height:23px;
	margin:0 10px 9px 0;
}
#header .navigation ul.sub li a {
	display:block;
	padding-left:7px;
	font:bold 11px/12px Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	color:#676767;
	background:url(../images/sprite-icon-custom-small.png) 0 3px no-repeat;
}
#header .navigation ul.sub li a:hover {
	color:#888;
}
#header .navigation .fix ul.sub {
	width:390px;
	left:250px;
}


/* Search Bar
-----------------------------------------------------------------------------*/
#bar-container {
	height:58px;
	padding:18px 0;
	background-color:#263a8d;
}
#main-bar-wrapper {
	position:absolute;
	width:100%;
	z-index:999;
}
#main-bar {
	position:absolute;
	top:0;
	width:100%;
	height:40px;
	padding:5px 0;
}
#main-bar .wrapper {
	padding:0 10px;
}
#main-bar form {
	float:left;
	width:100%;
	padding:0 10px;
	background:url(../images/bg-main-search.png) 0 0 no-repeat;
}
#main-bar form input {
	width:810px;
	height:46px;
	padding:0 5px 0 30px;
	font:bold 16px/46px Arial, Helvetica, sans-serif;
	color:#454545;
	background:none;
	border:none;
}
#main-bar form input:focus {
	box-shadow:none;
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	border:none;
}
#main-bar form button {
	width:100px;
	height:46px;
	font:bold 18px/40px Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	text-shadow:1px 1px 0 #ddd;
	color:#808080;
	background:none;
	border:none;
}
#main-bar.fixed {
	position:fixed;
	top:0;
	padding:5px 0 12px 0;
	background-color:#263a8d;
	border-top:8px solid #ffd716;
}


/* Container
-----------------------------------------------------------------------------*/



/* Main-Header
-----------------------------------------------------------------------------*/
#main-header {
	margin:20px 0 10px 0;
	padding-left:5px;
	border-top:3px solid #e8e8e8;
	border-bottom:3px solid #e8e8e8;
}
#main-header,
#main-header a {
	color:#666;
	line-height:20px;
}
#main-header a {
	font-size:11px;
}
#main-header h2,
#main-header h2 a {
	margin-top:10px;
	font:900 21px/27px "Arial Black", Gadget, sans-serif;
	color:#263a8d;
}


/* Main-Navigation
-----------------------------------------------------------------------------*/
#main-navigation {
	min-height:600px;
	margin-top:10px;
	background:url(../images/bg-side-navigation.png) top left no-repeat;
}
#main-navigation div.category-list {
	margin:15px 0;
}
#main-navigation div.category-list h3 {
	margin:10px;
	font:900 18px/27px "Arial Black", Gadget, sans-serif;
	color:#263a8d;
	background:url(../images/sprite-icon-custom-big.png) 143px -191px no-repeat;
}
#main-navigation div.category-list li a.main-category {
	display:block;
	font:bold 12px Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	color:#676767;
}
#main-navigation div.category-list li:hover a.main-category {
	width:200px;
	color:#263a8d;
	/**background-color:#d0d0d0; */
	/**border-left:3px solid #b5b5b5;*/
        border-bottom:1px solid #d0d0d0;
}

.li-subdepartamento{
    padding-left:20px !important;
    line-height: 20px !important;
}

#li-subdepartamento a:hover{
    color:#003366;
}

#main-navigation div.category-list li a.main-category span {
	display:block;
	width:170px;
	margin:0 10px;
	padding:10px 0;
	background:url(../images/sprite-icon-custom-small.png) 160px -52px no-repeat;
	border-bottom:1px solid #d0d0d0;
}



#main-navigation div.category-list li:hover a.main-category span {
	margin-top:-1px;
	padding:11px 0;
	background-position:157px -92px;
	border:none;
}
#main-navigation div.category-list ul.sub-menu {
	display:none;
	position:absolute;
	top:0;
	left:200px;
	height:auto;
	padding:10px;
	background-color:#d0d0d0;
	-webkit-border-radius:15px;
	-moz-border-radius:15px;
	border-radius:15px;
	z-index:9999;
}
#main-navigation div.category-list li:hover ul.sub-menu {
	display:block;
}
#main-navigation div.category-list ul.sub-menu h4 {
	margin-left:14px;
	font:bold 17px Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	color:#2a3e91;
}
#main-navigation div.category-list ul.sub-menu li.sub-category {
	padding:10px;
	background-color:#e6e6e6;
	-webkit-border-radius:7px;
	-moz-border-radius:7px;
	border-radius:7px;
}
#main-navigation div.category-list ul.sub-menu li.sub-category ul {
	height:450px;
}
#main-navigation div.category-list ul.sub-menu li.sub-category ul li {
	position:relative;
	width:150px;
	height:20px;
	padding:0 5px;
	line-height:20px;
	border-bottom:1px solid #d0d0d0;
}
#main-navigation div.category-list ul.sub-menu li.sub-category ul li:hover {
	background-color:#d0d0d0;
}
#main-navigation div.category-list ul.sub-menu li.sub-category ul li a {
	display:block;
	font-size:11px;
	color:#676767;
}
#main-navigation div.category-list ul.sub-menu li.sub-category ul li a:hover {
	color:#263a8d;
}
#main-navigation div.category-list ul.sub-menu li.sub-category ul li h5 {
	margin:0;
	font-size:13px;
	line-height:20px;
}
#main-navigation div.category-list ul.sub-menu li.sub-category ul li.column-02 {
	margin-left:170px;
	top:-400px;
}
.ie7 #main-navigation div.category-list ul.sub-menu li.sub-category ul li.column-02 {
	top:-447px;
}
#main-navigation div.category-list ul.sub-menu li.sub-category ul li.column-03 {
	margin-left:340px;
	top:-800px;
}
.ie7 #main-navigation div.category-list ul.sub-menu li.sub-category ul li.column-03 {
	top:-891px;
}


/* Main-Content
-----------------------------------------------------------------------------*/
#main-content {
	padding:10px 0;
	background-color:#FFF;
}

/* --- Box-aSide --- */
#box-aside {
	position:absolute;
	right:0;
	height:300px;
}
#box-aside .newsletter {
	margin-bottom:15px;
	padding:10px 5px;
	text-align:center;
	background-color:#e2e8ed;
}
#box-aside .newsletter h3 {
	font-size:16px;
	margin-bottom:10px;
}
#box-aside .newsletter p {
	font-size:11px;
	margin-bottom:7px;
}
#box-aside .newsletter input {
	width:120px;
	color:#adadad;
}
#box-aside .newsletter input:focus {
	width:120px;
	color:#424242;
}


/* Footer
-----------------------------------------------------------------------------*/
#footer {
	clear:both;
	height:155px;
	margin-top:20px;
	font-size:12px;
	color:#fff;
	background-color:#263a8d;
	border-top:10px solid #ffd716;
}
#footer a {
	color:#fff;
}
#footer a:hover {
	border-bottom:1px dashed #fff;
}
#footer .box {
	float:left;
	width:50%;
}
#footer .box h3 {
	margin:20px 0 0 0;
	padding-bottom:10px;
	font:900 15px "Arial Black", Gadget, sans-serif;
	text-transform:uppercase;
	color:#fff;
	border-bottom:1px solid #1b2c75;
}
#footer .box ul {
	height:40px;
	padding:15px 0;
	border-top:1px solid #2d439e;
	border-bottom:1px solid #1b2c75;
}
#footer .box ul li {
	float:left;
	margin-bottom:5px;
}
#footer .box01 ul {
	list-style:inside;
}
#footer .box01 ul li {
	width:33%;
}
#footer .box02 ul li {
	width:50%;
}
#footer div.copyright {
	float:left;
	width:100%;
	padding-top:10px;
	font-size:11px;
	border-top:1px solid #2d439e;
}
#footer div.copyright a[rel=author] {
	float:right;
	display:block;
	width:150px;
	height:20px;
	font:bold 11px/18px "Trebuchet MS", Arial, Helvetica, sans-serif;
	text-align:left;
	background:url(../images/img-waio-footer.png) 101px -64px no-repeat;
}
#footer div.copyright a[rel=author]:hover {
	background:url(../images/img-waio-footer.png) 101px -4px no-repeat;
	border:none;
}
#footer div.copyright a[rel=author] span {
	display:none;
}
