body		{ font-family: Arial, Helvetica, sans-serif;
		  font-size: 13px;
		}
td		{ font-family: Arial, Helvetica, sans-serif;
		  vertical-align: top;
		  font-size: 12px;
		}
th		{ font-family: Arial, Helvetica, sans-serif;
		  vertical-align: top;
		  font-size: 12px;
		}
h1		{ font-family: Arial, Helvetica, sans-serif;
		  font-size: 15px;
		  font-weight: bold;
		  color: #990000;
		}
.h1		{ font-family: Georgia, serif;
		  font-size: 15px;
		  font-weight: bold;
		}
h2		{ font-family: Arial, Helvetica, sans-serif;
		  font-size: 14px;
		  color: #666666;
		  font-weight: bold;
		}
img		{ border: none }
#white		{ color: white }
#maroon		{ color: #736357 }
.noborder	{ border-style: hidden }
input		{ background-color: #FCFCFC; border-style: solid; border-width: 1px; border-color: #EAEAEA; }
textarea	{ background-color: #FCFCFC; border-style: solid; border-width: 1px; border-color: #EAEAEA; }
select		{ background-color: #FCFCFC; border-style: hidden }
.checkbox	{ background-color: #FCFCFC; border-style: hidden }
fieldset        { border: 1px solid #EAEAEA; background-color: #FFFFFF; padding: 5px 5px 5px 5px }
.outterBox	{ border: 1px solid #E0E0E0; background-color: #FAFAFA; padding: 5px 5px 5px 5px }
.innerBox	{ border: 1px solid #EAEAEA; background-color: #FCFCFC; padding: 5px 5px 5px 5px }
.bottom_line td	{ border-bottom: 1px dotted #EAEAEA; }
legend		{ font-size: 12px; color: #990000; font-weight: bold; font-variant: small-caps }
.comboMenu	{ font-size: 12px; color: #999900; background-color: white; font-weight: bold;
		  border-style: none }
.comboName	{ font-size: 11px; font-style: italic; border-style: hidden }
.comboNum	{ font-size: 11px; border-style: hidden; text-align: right }
.combo		{ font-size: 11px; border-style: hidden }
.combolabel	{ font-size: 11px; color: black; font-style: italic; border-style: hidden }
.label		{ color: #B3A1A1; width: 100px }
.hvsh		{ color: #B3A1A1; text-align: right; vertical-align: bottom }
a		{ text-decoration: none }
.bold		{ font-weight: bold }
.accepted	{ font-weight: bold; color: #444444; font-size: 13px }
.synonym	{ font-weight: normal; color: gray; font-size: 12px }

#titleDiv	{ position: absolute; visibility: visible; top:  10px; left:   5px; z-index: 2 }
#decoLftDiv	{ position: absolute; visibility: visible; top:  45px; left:   5px; z-index: 3 }
#decoRgtDiv	{ position: absolute; visibility: visible; top:   5px; left: 570px; z-index: 1 }

#langsDiv	{ position: absolute; visibility: visible; top:  90px; left: 700px; z-index: 2 }
#hstDecDiv	{ position: absolute; visibility: visible; top:   0px; left: 610px; z-index: 1 }
#wrkDecDiv	{ position: absolute; visibility: visible; top:   0px; left: 410px; z-index: 1 }

#prjMenuDiv	{ position: absolute; visibility: visible; top: 120px; left:  45px; z-index: 1 }
#hstMenuDiv	{ position: absolute; visibility: visible; top: 120px; left: 170px; z-index: 1 }
#wrkMenuDiv	{ position: absolute; visibility: visible; top: 120px; left: 290px; z-index: 1 }
#hvMenuDiv	{ position: absolute; visibility: visible; top: 120px; left: 405px; z-index: 1 }
#warningMessage	{ position: absolute; visibility: visible; top: 85px; left: 20px; width: 580px; z-index: 9;
		  text-align: center; background-color: white; font-size: 10px; font-weight: bold; color: black; }
#warningMessage2{ visibility: visible; width: 730px; z-index: 9; font-size: 10px;
		  text-align: center; background-color: white; font-weight: bold; color: black; }

#mainDiv	{ position: absolute; visibility: visible; top: 160px; left:  30px;
		  width: 730px; text-align: justify; z-index: 1 }
#copy		{ position: static; color: #666666; visibility: visible; left: 30px; width: 730px;
/*
		  background-image: url('/imgs/rodape.gif');
		  background-repeat: no-repeat;
		  background-position: center;
*/
		  font-size: 10px; text-align: center; }
#copy a		{ text-decoration: none; color: #666666 }
a		{ text-decoration: none; color: #999900 }
.h2		{ color: #999900; font-weight: bold; font-size: 15px; text-align: left;
		  padding-left: 540px; padding-top: 20px; padding-bottom: 20px; padding-right: 0px }
ul		{ list-style-image: url("/imgs/bullet.gif");  }
option		{ padding-top: 3px; border-style: hidden }
#color1		{ color: #E6D5C6 }
#color2		{ color: #C4AC92 }
#color3		{ color: #998675 }
#color4		{ color: #C3996B }
#color5		{ color: #77634D }
#color6		{ color: #4D3F33 }
#color7		{ color: #B3A1A1 }
#color8		{ color: #999900 }
#typus		{ color: #990000 }
.note		{ color: #666666; font-size: 10px }

div.shadow {
 float:left;
 background: url(imgs/dropshadow.gif) no-repeat bottom right;
 margin: 10px 10px 10px 10px;
}
div.shadow img {
  position: relative;
  display: block;
  margin: -3px 6px 6px -3px;
}
div.shadow div {
 position: relative;
 display: block;
 margin: -3px 6px 6px -3px;
 padding: 5px;
 border-width: 1px;
 border-style: solid;
 max-width: 800px;
}

.v-container
{ background: #fff;
  display: grid;
  grid-template-areas: "v-header" "v-title" "v-viewer" "v-thumbs" "v-copy";
  grid-template-columns: auto 150px;
  grid-template-rows: 60px 20px auto 40px;
}
.v-header
{ grid-column: 1 / span 2;
  grid-row: 1;
  background-color: #fff;
}
.v-title
{ grid-column: 1 / span 2;
  grid-row: 2;
  background-color: #fff;
  text-align: right;
  font-size: small;
}
.v-viewer
{ grid-row: 3;
  grid-column: 1;
  background-color: #fff;
  height: 800px;
}
.v-thumbs
{ grid-row: 3;
  grid-column: 2;
  background-color: #eee;
  display: flex;
  flex-direction: column;
  align-itens: flex-start;
  height: 800px;
  overflow-y: scroll;
}
.thumb
{ flex: flex-shrink;
  text-align: center;
  background-color: #eee;
  cursor: pointer;
}
.v-copy
{ grid-column: 1 / span 2;
  grid-row: 4;
  background-color: #fff;
  text-align: center;
  font-size: smaller;
  color: #666;
}

