/*1 corpo principal, instruções para layout geral do site */
BODY {
margin:0px;
text-align:center;
padding:0;

SCROLLBAR-FACE-COLOR: #c7c7c5;
SCROLLBAR-HIGHLIGHT-COLOR: white; 
SCROLLBAR-SHADOW-COLOR: white;
SCROLLBAR-3DLIGHT-COLOR: #c7c7c5;
SCROLLBAR-ARROW-COLOR: white; 
SCROLLBAR-DARKSHADOW-COLOR: #c7c7c5; 
SCROLLBAR-BASE-COLOR:#c7c7c5;


font-family: Verdana;
color:#666666;
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:white;
	font-size:10px;
	text-decoration:none;
	}
a:visited {
	font-family: verdana;
	color:white;
	font-size:10px;
	text-decoration:none;
	}
a:hover {
	font-family: verdana;
	color:#EFEFEF;
	font-size:10px;
	text-decoration:underline;
	}
a:active {
	font-family: verdana;
	color:white;
	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 {
	color:#666666;
	font-family:Arial, Helvetica, sans-serif;
	font-size:7pt;
	text-decoration:none;
	}
a.linkcoropcional:visited {
	color:#666666;
	font-family:Arial, Helvetica, sans-serif;
	font-size:7pt;
	text-decoration:none;	}
a.linkcoropcional:hover {
	color:#666666;
	font-family:Arial, Helvetica, sans-serif;
	font-size:7pt;
	text-decoration:underline;
	}
a.linkcoropcional:active {
	color:#666666;
	font-family:Arial, Helvetica, sans-serif;
	font-size:7pt;
	text-decoration:none;
}
/*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;
	color:white;
	line-height:1em;
	}
a.linkcoropcionaldois:visited {
	text-decoration:none;
	color:white;
	line-height:1em;
	}
a.linkcoropcionaldois:hover {
	text-decoration:none;
	color:black;
	line-height:1em;
	}
a.linkcoropcionaldois:active {
	text-decoration:none;
	color:white;
	line-height:1em;

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



/*2.2 classe de estilo opcional (underline)*/
a.linkunderline:link {
font-family:verdana;
font-size:7pt;
letter-spacing:-1px;
color:#999999;
}
a.linkunderline:visited {
font-family:verdana;
font-size:7pt;
letter-spacing:-1px;
color:#999999;
}
a.linkunderline:hover {
font-family:verdana;
font-size:7pt;
letter-spacing:-1px;
text-decoration:underline;
color:#999999;
}
a.linkunderline:active {
font-family:verdana;
font-size:7pt;
letter-spacing:-1px;
text-decoration:underline;
color:#999999;
}
/*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:6px;
}
.borderit:hover img{
border: 1px solid #333333;
}
.borderit:hover{
color:  #333333;
}
/*3 *********************************************************/



/*4 classe form para usar em campos de formulário, chamado por class="form" */
input.form, textarea.form { 
border:1px solid white;
font-family: Verdana;
margin:0;
padding:0;
font-size: 12px;
height: 14px;
*height: 17px;
width:250px;
}


input.formb, textarea.formb { 
border:1px solid white;
font-family: Verdana;
margin:0;
padding:0;
font-size: 12px;
height: 160px;
*height: 163px;
width:250px;
overflow-y:auto;
overflow-x:auto;
}

/*4 *********************************************************/

/*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: 750px; /*tamanho do site, largura*/
height: 501px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:left;
}
/*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 ************************************************/

p.credito {
	position:absolute;
	top: 555px;
	right: 1px;
	width:100%;
	text-align: center;
	color:#999999;
	border:0px;
	padding:0;
	font-family:verdana;
	font-size:7pt;
	letter-spacing:-1px;
}


div.home {
top:0px;
position:relative;
width: 750px; /*tamanho do site, largura*/
height: 501px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:right;
margin:0 auto; /*valor auto utilizado no Firefox para calculo altomático das margens "deixar centralizado"*/
background-image:url("img/01.jpg");
background-repeat:no-repeat;
}

/* COLEÇÕES *********************************************************/

div.colecoesleft{
top:0px;
left:0px;
position:absolute;
width: 327px; /*tamanho do site, largura*/
height: 500px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:right;
background-image:url("img/02.jpg");
background-repeat:no-repeat;
}


div.colecoestop{
top:0px;
right:0px;
position:absolute;
width: 424px; /*tamanho do site, largura*/
height: 192px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:right;
background-image:url("img/03.jpg");
background-repeat:no-repeat;
}

div.colecoesbottom{
bottom:0px;
right:0px;
position:absolute;
width: 424px; /*tamanho do site, largura*/
height: 308px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:right;
background-image:url("img/04.jpg");
background-repeat:no-repeat;
}

div.colecoes{
top:0px;
right:30px;
position:absolute;
width: 364px; /*tamanho do site, largura*/
height: 268px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:left;
overflow-y:auto;
overflow-x:no;
}

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

div.lojaleft{
top:0px;
left:0px;
position:absolute;
width: 327px; /*tamanho do site, largura*/
height: 500px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:right;
background-image:url("img/05.jpg");
background-repeat:no-repeat;
}


div.lojatop{
top:0px;
right:0px;
position:absolute;
width: 424px; /*tamanho do site, largura*/
height: 500px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:right;
background-image:url("img/06.jpg");
background-repeat:no-repeat;
}

div.lojabottom{
top:162px;
right:1px;
position:absolute;
width: 423px; /*tamanho do site, largura*/
height: 216px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:right;
}

div.loja{
top:0px;
right:30px;
position:absolute;
width: 364px; /*tamanho do site, largura*/
height: 268px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:left;
overflow-y:auto;
overflow-x:no;
}

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

div.grifesleft{
top:0px;
left:0px;
position:absolute;
width: 327px; /*tamanho do site, largura*/
height: 500px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:right;
background-image:url("img/08.jpg");
background-repeat:no-repeat;
}


div.grifestop{
top:0px;
right:0px;
position:absolute;
width: 424px; /*tamanho do site, largura*/
height: 500px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:right;
background-image:url("img/09.jpg");
background-repeat:no-repeat;
}

div.grifesbottom{
top:162px;
right:1px;
position:absolute;
width: 423px; /*tamanho do site, largura*/
height: 216px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:right;
}

div.grifes{
	top:0px;
	left:115px;
	position:absolute;
	width: 122px; /*tamanho do site, largura*/
	height: 300px; /*tamanho do site, altura*/
	border:0px;
	padding:0;
}



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

div.contatoleft{
top:0px;
left:0px;
position:absolute;
width: 327px; /*tamanho do site, largura*/
height: 500px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:right;
background-image:url("img/11.jpg");
background-repeat:no-repeat;
}


div.contatoright{
top:0px;
right:0px;
position:absolute;
width: 424px; /*tamanho do site, largura*/
height: 500px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:right;
background-image:url("img/12.jpg");
background-repeat:no-repeat;
}

div.contato{
top:115px;
right:89px;
*right:83px;
position:absolute;
width: 250px; /*tamanho do site, largura*/
height: 300px; /*tamanho do site, altura*/
border:0px;
padding:0;
text-align:center;
}