/**
 * Main stylesheet
 * @author Rodrigo Henrique Paiva - rhpaiva[at]gmail.com
 *
 * List of contents (search by "index: x" where x is the index number):
 *   1. Erick Meyer's Reset a little bit modified
 *   2. My own reset and tag rules
 *   3. Rules related to IDentifiers
 *     - mainContainer: wraps the whole planet in!
 *     - top: logo, search box, login box and main menu
 *     - content-wrapper: content, categories, product and other main stuff
 *     - page: contact form
 *     - page: faq
 *     - page: products
 *     - footer
 *   4. Global styles used (or not) everywhere
 */

/* # index: 1 */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, button
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 12px;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
	color:#333;
	background:#F2BFBB url(../images/bgs/bg.maincontainer.jpg) repeat-x;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}

.videos {
	border-spacing: 2;
}

caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes:none;
}

/* # index: 2 - Own reset */
acronym, abbr {border-bottom:1px dotted; cursor:help}
a:link, a:visited {color:#c39; text-decoration:underline}
a:hover, a:focus {color:#fff;background:#c39;}
a.secao:link, a.secao:visited {color:#fff; text-decoration:none; font-weight:bold; font-size:16px; padding:2px; background:#c39;}
a.secao:hover, a.secao:focus {color:#fff; text-decoration:underline; font-weight:bold; font-size:16px; padding:2px; background:#c39;}
fieldset {border:1px solid #ccc; padding:10px; margin-bottom:20px}
legend {padding:5px; font-weight:bold; text-transform:uppercase; background:#ccc}
button {background:#936; color:#fff; font-weight:bold; text-transform:uppercase; padding:5px; font:inherit; cursor:pointer; border:none; overflow:visible; /* fix IE weird padding */}
input, textarea {color:#C36; border:1px solid #C69; background:#FFF; padding:1px 3px 1px 3px}
input:focus, textarea:focus {background:#fcc; padding:1px 3px 1px 3px; color:#000}
select {color:#C36; border:1px solid #C69; background:#FFF; padding:1px 3px 1px 3px}
label {cursor:pointer}
strong {font:inherit; font-weight:bold}
small {font-size:10px}

/* # index: 3 - IDentifiers */
#top-leftPanel {float:left; width:530px}
#mainContainer {margin:auto; width:980px}
#top {float:left; width:100%;}
#top h1 {float:left; width:490px; height:100px; margin:0 0 0 20px; background:url(../images/logo.jpg) no-repeat}

#top-rightPanel {float:right; width:45%;}
/* search box */
#frmSearch {float:right; width:200px; height:150px; background:url(../images/bgs/bg.loginsearch.jpg) -214px 0px no-repeat;}
#frmSearch fieldset {float:left; width:90%; margin:45px 10px auto 10px; color:#FFF;border:none; padding:0}
#frmSearch * {margin-top:10px}
#frmSearch fieldset button {float:right}

/* login box */
#login {margin-right:10px; float:right; width:215px; height:150px; background:url(../images/bgs/bg.loginsearch.jpg) no-repeat;}
#login fieldset {float:left; width:90%; margin:40px 10px auto 10px; color:#FFF; border:none; padding:0}
#login fieldset label {float:left; width:50px; padding-top:10px;}
#login fieldset input {margin-top:5px;}
#login fieldset button {float:right; margin-top:10px}
#login fieldset p {padding-top:15px;}
#login fieldset p a,
#login.logoff * {color:#fff;}
#login.logoff p {margin:50px 10px 10px 10px}
#login.logoff ul li {list-style:inside disc; margin:10px}

/* main menu */
#menu {float:left; width:100%; margin-left:20px; margin-top:20px; clear:both; }
#menu li {display:inline; float:left}
#menu li a {float:left; color:#603; padding:15px 15px 7px 14px; font-weight:bold; font-size:12px; text-transform:uppercase; text-align:center}
#menu li a:hover, #menu li a:focus {background:url(../images/bgs/bg.menu.tabon.png) no-repeat;}
#menu li a.activetab {background:url(../images/bgs/bg.menu.tabon.png) no-repeat !important;}
#menu li a.menu-faq {padding-left:19px !important; padding-right:18px !important}
#menu li a.menu-contact {padding-left:17px !important; padding-right:17px !important}
#menu li a.menu-eventos {padding-left:18px !important; padding-right:17px !important}

/* content wrapper */
#content{float:left; width:100%; background:url(../images/bgs/bg.contentborders.png) top no-repeat}
#content-wrapper {float:left; width:100%; background:#fff; margin-top:18px;}
#content-bottom {float:left; width:100%; height:18px; background:url(../images/bgs/bg.contentborders.png) bottom no-repeat}

/* categories */
/*
#categories {margin:0 10px; position:relative}
#categories h3 {float:left; font-weight:bold; font-size:14px; padding:8px 5px; background:url(../images/bgs/bg.button.categories.png) no-repeat; color:#fff; width:170px; text-decoration:none; cursor:pointer}
#categories ul {width:212px; height:300px; overflow:auto; top:25px; position:absolute; clear:both; background:#fff; border:1px solid #A53D69; display:none}
#categories ul li {width:100%; clear:both}
#categories ul li a {float:left; width:200px; padding:6px; border-bottom:1px dashed #ccc}
#categories ul li a.closeCategories {text-align:right; background:#E0E0E0; text-transform:uppercase}
#categories ul li a.closeCategories:hover, 
#categories ul li a.closeCategories:focus {
	color:inherit; background:#ccc url(../images/buttons/button.close.png) 74% 50% no-repeat
}
*/
#categories {float:left; width:700px; margin:0 10px}
#categories h3 {float:left; font-weight:bold; font-size:18px; color:#999}
#categories ul {width:500px; float:left; margin-top:10px}
#categories ul li {float:left; display:inline; list-style:none; margin:0 0 10px 15px}

#livehelp {float:right; width:200px; background-color:#f5f5f5; border:1px dashed #ccc; padding:10px; margin-right:10px}
#livehelp a {font-size:20px; font-weight:bold}

/* content itself */
#content-data {float:left; width:100%;}

/* page: contact form */
#frmContact label{clear:both; display:block; margin-top:10px}
#contact dt{margin:10px 0}
#contact dd {margin:0 10px}
#contact ol {list-style:inside decimal}
#contact li {margin:5px}

/* page: contact form */
#frmCadastro .tipoCadastro {padding:5px; background:#FFC; margin:10px 0}
#frmCadastro .fieldPadding {width:220px; float:left; padding-top:5px; text-align:right; font-weight:bold}
#frmCadastro p.formrow {margin:10px 0 !important}
#frmCadastro label{margin-right:5px; font-weight:bold}

/* page: faq */
#faq dt{font-size:14px; color:#906; margin:20px auto 10px auto}
#faq dd {margin:0 10px}

/* page: products */
#product-info {float:right; width:200px; margin-top:10px}
#product-info h3 {background:#B24271; padding:5px; color:#fff; font-weight:bold; font-size:14px}
#product-info ul li {margin:10px}
#product-description {font-size:14px}
#product-prices, 
#product-colors,
#product-sizes {background-color:#FAE2E2; margin:0 0 10px 5px; padding-bottom:5px;}
#product-photos {float:left; margin:20px 10px 20px auto}
#product-photos li {padding:2px; float:left;display:inline; border:1px solid #B24271}
#product-photos li img,
#product-thumbs li img {float:left}
#product-thumbs {float:left; margin-top:20px; width:400px}
#product-thumbs li {display:inline; margin:auto 5px 5px auto; float:left}
#product-thumbs li a {padding:1px; border:1px solid #ccc; float:left}
#product-thumbs li a:hover,
#product-thumbs li a:focus {border:1px solid #c39}
#colorSelection {float:left; background:#FAE2E2; clear:both; width:100%}
#colorSelection p  {margin:10px}
#colorSelection table caption {margin:10px; font-size:18px; font-weight:bold; width:100%; color:#992958}
#colorSelection table {margin:10px; width:60%}
#colorSelection table thead tr th {font-weight:bold; font-size:14px; padding:5px; border-bottom:1px solid #992958}
#colorSelection table tbody tr td {padding:5px; border-bottom:1px solid #ccc}
#relatedProducts {float:left; width:100%; background:#FAE2E2; padding-bottom:10px}
#relatedProducts h3 {margin:20px 10px; font-size:18px; font-weight:bold; width:100%; color:#992958}
#relatedProducts ul {margin:10px}
#relatedProducts ul li {float:left; display:block; width:74px; background:#fff; border:1px solid #B24271; margin:3px; text-align:center}
#relatedProducts ul li img {clear:both; float:left; margin-bottom:2px}
#relatedProducts ul li a {float:left; margin:2px; text-decoration:none; width:70px}
#adSignin {float:left; width:390px; margin-top:10px; padding:10px; border:1px dashed #ccc; background:#f5f5f5}
.detailButton {float:left; margin:20px 0}
.detailButton a:link, 
.detailButton a:visited, 
.detailButton a:hover 
.detailButton a:active {background:none}

/* page: photo album */
#photoAlbum fieldset legend {margin-bottom:20px}
#photos {float:left; width:100%}
#photos li {display:inline; float:left; margin:0px 10px 10px 0px; height:160px}
#photos li a {border:1px solid #ccc; padding:5px 5px 3px 5px; float:left}

/* banners */
#banners {float:left; width:100%; background:#fff; padding:10px 0; text-align:center}
#banners li {display:inline; list-style:none}
#banners li a:hover {background:none}

/* footer */
#toplink {width:45px; height:45px; margin:0; padding:0; right:0px; bottom:0px; position:fixed; z-index:9999}
#toplink a {width:45px; height:45px; display:block; overflow:hidden; font-size:1px; line-height:230px; background:url(../images/icon.gototop.gif) no-repeat}
* HTML #toplink {display:none}

/* # index: 4 - Global styles */
#msgValidacao {background:#FFCCCC; margin:10px; padding:10px; display:none}
#msgValidacao h3 {margin-bottom:10px; font-size:16px}
#msgValidacao ul {list-style:inside disc} 
#msgValidacao ul li {margin-bottom:5px}

#pedido table caption { margin:10px; font-size:18px; font-weight:bold; width:100%; color:#992958}
#pedido table { margin-left: auto; margin-right: auto; width:80%; }
#pedido table tbody tr th { font-weight:bold; font-size:14px; padding:5px; border-bottom:1px solid #992958}
#pedido table tbody tr td { padding:5px; border-bottom:1px solid #ccc}

#pedidoitens table caption { margin:10px; font-size:18px; font-weight:bold; width:100%; color:#992958}
#pedidoitens table { margin-left: auto; margin-right: auto; width:100%; }
#pedidoitens table tbody tr th { font-weight:bold; font-size:14px; padding:5px; border-bottom:1px solid #992958}
#pedidoitens table tbody tr td { padding:5px; text-align: left; }

.right {float:right}
.hidden {display:none}
.nomargin {margin:0px}
.noborder {border:none}
.help {cursor:help}
.clickable {cursor:pointer}
.underline {text-decoration:underline !important}
.external {background:url(img/icon.external.blue.gif) no-repeat right; padding-right:15px}
.button-ok {background:url(../images/buttons/button.ok.png) no-repeat; width:34px; height:24px}
.pageContent {margin:20px}
.contentTitle {color:#B24271; font-size:26px; font-weight:bold; margin:15px 0; padding-bottom:5px; border-bottom:1px dotted #B24271}
.paragraph {margin:20px auto}
.resetButton {background:none; padding:0}

a.orkut:link, a.orkut:hover {text-decoration: none}