/*1 corpo principal, instruções para layout geral do site */
BODY {
overflow-y:auto;
overflow-x:auto;
margin:0px;
background-color: #de137c;
text-align:center;
padding:0;

SCROLLBAR-FACE-COLOR: #f5f5f5;
SCROLLBAR-HIGHLIGHT-COLOR: #f6faf9; 
SCROLLBAR-SHADOW-COLOR: #f5f5f5;
SCROLLBAR-3DLIGHT-COLOR: #dedede;
SCROLLBAR-ARROW-COLOR: black; 
SCROLLBAR-DARKSHADOW-COLOR: #d8d8d8; 
SCROLLBAR-BASE-COLOR: #E16F13;

font-family: Verdana;
color:#333333;
font-size:10px;
}
/*1 *********************************************************/


/*1.1 classe de estilo opcional para textos com destaque em negrito deve ser chamada por class="textobold" */
font.textobold {
font-weight: bold;
}
/*1.1 *********************************************************/



/*1.2 classe de estilo opcionalpara textos com cor diferenciado do geral do site deve ser chamada por class="cordois" */
font.cordois {
color:red;
}
/*1.2 *********************************************************/



/*2 instrução padrão para todos os links dentro do site, (bold com houver sublinhado) */
a:link {
	font-family: verdana;
	color:#333333;
	font-size:10px;
	text-decoration:none;
	}
a:visited {
	font-family: verdana;
	color:#333333;
	font-size:10px;
	text-decoration:none;
	}
a:hover {
	font-family: verdana;
	color:#333333;
	font-size:10px;
	text-decoration:underline;
	}
a:active {
	font-family: verdana;
	color:#333333;
	font-size:10px;
	text-decoration:none;
}
/*2 *********************************************************/



/*2.1 classe de estilo opcional (bold com houver de cor diferente) para links do documento, ao invés do hover ser sublinhado, o link é caracterizado pelo texto em em outra cor, todos os atributos(familia,tamanho, etc) são herdados do padrão geral de link, deve ser chamado com class="linkcoropcional" */
a.linkcoropcional:link {
	text-decoration:none;
	font-family:"Times New Roman";
	font-size:12px;
	color:#354237;
	}
a.linkcoropcional:visited {
	text-decoration:none;
	font-family:"Times New Roman";
	font-size:12px;
	color:#354237;
	}
a.linkcoropcional:hover {
	text-decoration:none;
	font-family:"Times New Roman";
	font-size:12px;
	color:#de137c;
	}
a.linkcoropcional:active {
	text-decoration:none;
	font-family:"Times New Roman";
	font-size:12px;
	color:#de137c;
}
/*2.1 *********************************************************/



/*2.1.1 classe de estilo opcional (bold com houver de cor diferente) para links do documento, ao invés do hover ser sublinhado, o link é caracterizado pelo texto em em outra cor, todos os atributos(familia,tamanho, etc) são herdados do padrão geral de link, deve ser chamado com class="linkcoropcional" */
a.linkcoropcionaldois:link {
	text-decoration:none;
	font-weight: bold;
	color:silver;
	line-height:1em;
	}
a.linkcoropcionaldois:visited {
	text-decoration:none;
	font-weight: bold;
	color:silver;
	line-height:1em;
	}
a.linkcoropcionaldois:hover {
	text-decoration:none;
	font-weight: bold;
	color:orange;
	line-height:1em;
	}
a.linkcoropcionaldois:active {
	text-decoration:none;
	font-weight: bold;
	color:silver;
	line-height:1em;

}
/*2.1.1 *********************************************************/



/*2.2 classe de estilo opcional (underline)*/
a.linkunderline:link {
	text-decoration:none;
	font-weight:normal;
	color:#FFFFFF;
	}
a.linkunderline:visited {
	text-decoration:none;
	font-weight:normal;
	color:#FFFFFF;
	}
a.linkunderline:hover {
	text-decoration:underline;
	
	color:white;
	}
a.linkunderline:active {
	text-decoration:none;
	font-weight:normal;
	color:#FFFFFF;

}




a.linkcontato:link {
	text-decoration:none;
	font-size:7pt;
color:#FFFFFF;
	}
a.linkcontato:visited {
	text-decoration:none;
	font-size:7pt;
color:#FFFFFF;
	}
a.linkcontato:hover {
	text-decoration:underline;
font-size:7pt;
color:#FFFFFF;
	}
a.linkcontato:active {
	text-decoration:none;
font-size:7pt;
color:#FFFFFF;
}

/*2.2 *********************************************************/



/*3 classe borderid para uso em imagens com links, dentro do tag <a href="" CLASS="borderit"> que antecede a imagem */
.borderit img{
border: 1px solid silver;
margin-bottom:5px;
}
.borderit:hover img{
border: 1px solid #3e9a01;
}
.borderit:hover{
color:  #3e9a01;
}

/*3 *********************************************************/




/*4 classe form para usar em campos de formulário, chamado por class="form" */
.form { 
border:1px solid silver; width:230px;
font-family: Verdana;
margin:0;
padding:0;
font-size: 10px;
background-color: white;
margin-bottom:6px;
}

html>body .form { 
border:1px solid silver; width:230px;
font-family: Verdana;
margin:2;
padding:0;
font-size: 10px;
background-color: white;
margin-bottom:6px;
}

/*4.1 *********************************************************/


/*5 estrutura principal do site, todos os outros div´s(com position:absolute;) estão alinhados com base neste, assim todo div que
tiver height ou width com %, será em cima do valor desse div principal, assim como alinhamento */
div.enquadramento {
top:0px;
position:relative;
width: 1000px; /*tamanho do site, largura*/
height: 590px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:center;
margin:0 auto; /*valor auto utilizado no Firefox para calculo altomático das margens "deixar centralizado"*/
background-image:url(img/fundo.jpg);
background-repeat:no-repeat;
}

/*5 *********************************************************/


/*6 divs do conteúdo do site:
div.top => div utilizado para cabeçalho e menus horizontais;
div.esquerda => div utilizado menus verticais ou imagens;
div.frame => div utilizado para conteúdo ou para abrir iframes que chamem arquivos externos;
div.baixo => div utilizado para rodapés, assinaturas, créditos, informações de visualizações e direitos autorais;

No HTML a hierarquia de exibição é do último div ao primeiro, o último div será exibido em acima de todos os outros, assim como o primeiro será exibido sempre abaixo dos outros ************************************************/

div.iframe{
text-align:left;
position:absolute;
top: 48px;
left: 150px;
width: 717px;
height: 478px;
border: 0px;
padding: 0px;
background-color:#FF0000;
}

div.menu{
text-align:left;
position:absolute;
top: 428px;
left: 150px;
width: 719px;
height: 106px;
border: 0px;
padding: 0px;
}




div.top {
text-align:left;
position:absolute;
top: 0px;
left: 13px;
width: 825px;
height: 13px;
border: 0px;
padding: 0px;
background-image:url("img/top.jpg");
}

div.bottom {
position:absolute;
color:#FFFFFF;
bottom: 0px;
left: 13px;
width: 825px;
height: 22px;
border:0px;
text-align: center;
background-image:url("img/bottom.jpg");
padding-top:5px;
font-size:7pt;
}


div.bottom a:hover {
text-decoration:underline;
color:#FFFFFF;
}

div.bottom a:link, div.bottom a:visited {
color:#FFFFFF;
}


div.left {
text-align:left;
position:absolute;
top: 0px;
left: 0px;
width: 13px;
height: 590px;
border: 0px;
padding: 0px;
background-image:url("img/left.jpg");
}

div.right {
text-align:left;
position:absolute;
top: 0px;
right: 0px;
width: 14px;
height: 590px;
border: 0px;
padding: 0px;
background-image:url("img/right.jpg");
}



div.frame {
position:absolute;
top: 152px;
left: 0px;
width: 764px;
height: 400px;
border:0px;
background-image:url("img/07.jpg");
background-color: #1f1a17;
}

/*6 *********************************************************/


/*HOME *********************************************************************************************************/
/*HOME *********************************************************************************************************/
/*HOME *********************************************************************************************************/

div.home{
text-align:left;
position:absolute;
top: 0px;
left: 0px;
width: 717px;
height: 478px;
border: 0px;
padding: 0px;
padding-top:30px;
padding-left:30px;
background-image:url(img/01.jpg);
}

/*LOJA *********************************************************************************************************/
/*LOJA *********************************************************************************************************/
/*LOJA *********************************************************************************************************/

div.lojaleft{
text-align:left;
position:absolute;
top: 0px;
left: 0px;
width: 486px;
height: 462px;
border: 0px;
padding: 0px;
background-image:url(img/02.jpg);
}

div.lojaright{
text-align:justify;
position:absolute;
top: 0px;
right: 0px;
width: 222px;
height: 400px;
border: 0px;
padding: 0px;
font-size:7pt;
font-family:Verdana, Arial, Helvetica, sans-serif;
}

/*GRIFES *********************************************************************************************************/
/*GRIFES *********************************************************************************************************/
/*GRIFES *********************************************************************************************************/

div.colecaoleft{
text-align:left;
position:absolute;
top: 0px;
left: 0px;
width: 225px;
height: 390px;
border: 0px;
padding: 0px;
}

div.colecaoright{
text-align:left;
position:absolute;
top: 0px;
left: 225px;
width: 493px;
height: 208px;
border: 0px;
padding: 0px;
background-image:url(img/04.jpg);
padding-top:105px;
padding-left:70px;
}

div.colecaobottom{
text-align:justify;
position:absolute;
top: 208px;
left: 225px;
width: 198px;
height: 184px;
border: 0px;
padding: 0px;
padding-top:25px;
padding-right:15px;
padding-left:282px;
background-image:url(img/05.jpg);
}

div.colecaomeio{
text-align:justify;
position:absolute;
top: 0px;
left: 225px;
width: 493px;
height: 392px;
border: 0px;
padding: 0px;
padding-top:17px;
padding-left:35px;
background-image:url(img/07.jpg);
}

div.setaesquerda{
text-align:center;
position:absolute;
bottom: 50px;
left: 5px;
width: 20px;
height: 20px;
border: 0px;
padding: 0px;
font-family:"Times New Roman";
font-size:12px;
}

div.setadireita{
text-align:center;
position:absolute;
bottom: 50px;
left: 443px;
width: 20px;
height: 20px;
border: 0px;
padding: 0px;
font-family:"Times New Roman";
font-size:12px;
}

/*CONTATO *********************************************************************************************************/
/*CONTATO *********************************************************************************************************/
/*CONTATO *********************************************************************************************************/

div.contatomeio{
text-align:justify;
position:absolute;
top: 0px;
left: 225px;
width: 493px;
height: 392px;
border: 0px;
padding: 0px;
padding-top:17px;
padding-left:175px;
background-image:url(img/12.jpg);
}