@charset "utf-8";
body {
	color: #381F18;
	background-color: #332E2A;
	border-top-width: medium;
	border-top-style: groove;
	border-top-color: #CC6600;
}

h1 {
	color: #CC6600;
	background-color: #660000;
	text-align: center;
	padding: 0px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	font-style: italic;
	font-weight: bold;
	position: absolute;
	top: 0px;
	margin-top: 30px;
	margin-right: 30%;
	margin-bottom: 0px;
	margin-left: 30%;
	z-index: -1;
}
h2 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	font-style: italic;
	font-weight: bold;
	color: #c60;
	background-color: #660000;
	text-align: center;
	margin: 20px;
	padding: 20px;
	border-top-width: 3px;
	border-bottom-width: 3px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #c30;
	border-bottom-color: #c30;
}

#formtable {
	border: thin solid #303;
	border-collapse:collapse;
}


#header {
	text-align: center;
	height: 150px;
	width: 650px;
	background-image: url(assets/images/chromatics_header.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	margin-right: auto;
	margin-left: auto;
	z-index: 20;
}

#navcontainer
{
	text-transform: lowercase;
	background-color: #332E2A;
	margin-top: 0;
	margin-right: 0%;
	margin-bottom: 0;
	margin-left: 0%;
	padding-top: 1%;
	padding-right: 0;
	padding-bottom: 1%;
	padding-left: 0;
	background-position: center top;
	border-top-width: medium;
	border-top-style: groove;
	border-top-color: #CC6633;
	border-bottom-style: groove;
	border-bottom-color: #669999;
}
#search {
	text-align: center;
	margin-right: 20px;
	margin-left: 20px;
}


/* to stretch the container div to contain floated list */
#navcontainer:after
{
	content: ".";
	display: block;
	line-height: 1px;
	font-size: 1px;
	clear: both;
}

ul#navlist
{
	list-style: none;
	padding: 0;
	width: 65%;
	font-size: 0.7em;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	text-align: center;
	vertical-align: top;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-variant: normal;
	text-transform: lowercase;
	font-weight: normal;
	font-style: normal;
	line-height: normal;
	background-color: #332E2A;
	background-position: center;
}

ul#navlist li
{
	display: block;
	float: left;
	width: 16%;
	margin: 0;
	padding: 0;
	vertical-align: top;
	text-align: center;
}

ul#navlist li a
{
	display: block;
	color: #5B7B93;
	text-decoration: none;
	background-color: #332E2A;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #ffe;
	border-right-color: #aaab9c;
	border-bottom-color: #000000;
	border-left-color: #3F3F3F;
}

#navcontainer>ul#navlist li a {
	width: 100%;
}

ul#navlist li#active a
{
	color: #800000;
	background-color: #EA8593;
}

ul#navlist li a:hover, ul#navlist li#active a:hover
{
	color: #F00000;
	border-top-color: #000000;
	border-right-color: #48493F;
	border-bottom-color: #fff;
	border-left-color: #5D5D5D;
	background-color: #251C18;
}
#wrap {
	margin-top: 2px;
	margin-right: auto;
	margin-bottom: 2px;
	margin-left: auto;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 3px;
	padding-left: 5px;
	border-top-color: #F3C;
	border-right-color: #F3C;
	border-bottom-color: #F3C;
	border-left-color: #F3C;
}
#wheel {
	border: thin solid #300;
	visibility: visible;
	float: right;
	text-align: center;
	padding-bottom: 5px;
	margin-bottom: 20px;
}
#contactform {
	clear: both;
	width: 500px;
	text-align: left;
	margin-right: 30%;
	margin-left: 30%;
	margin-bottom: 20px;
	margin-top: 20px;
	font-size: small;
}


body,td,th {
	font-family: Tahoma, Verdana, Arial, sans-serif;
	color: #663300;
}

a:link {
	color: #CC6600;
	text-decoration: none;
	font-weight: bold;
}

a:visited {
	text-decoration: none;
	color: #BBD1B1;
}

a:hover {
	text-decoration: none;
	color: #FF9900;
	font-weight: bolder;
}

a:active {
	text-decoration: none;
	font-weight: bolder;
	color: #F3C;
}

#swatches {
	color: #FFF2EC;
	background-color: #993300;
	text-transform: lowercase;
	margin-top: 0;
	margin-right: 0%;
	margin-bottom: 0;
	margin-left: 0%;
	padding-top: 1%;
	padding-right: 0;
	padding-bottom: 1%;
	padding-left: 0;
	border-top-width: medium;
	border-top-style: groove;
	border-top-color: #CC6633;
	border-bottom-style: groove;
	border-bottom-color: #511B00;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 16px;
}

ul#swatchlist {
	display: inline;
	list-style: none;
	padding: 0;
	width: 65%;
	font-size: 1em;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	text-align: center;
	vertical-align: top;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-variant: normal;
	text-transform: lowercase;
	font-weight: bold;
	font-style: normal;
	line-height: normal;
	background-color: #332E2A;
	background-position: center;
}

ul#swatchlist li {
	display: block;
	float: left;
	width: 16%;
	margin-left: 2%;
	margin-right: 2%;
	padding: 0;
	vertical-align: top;
	text-align: center;
}

#widget {
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	float: left;
}

ul#swatchlist li a {
	display: block;
	color: #FFFFFF;
	text-decoration: none;
	padding-top: 1em;
	padding-bottom: 1em;
	border-right-width: thin;
	border-bottom-width: thin;
	border-left-width: thin;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-right-color: #CC6633;
	border-bottom-color: #CC6633;
	border-left-color: #CC6633;
	font-style: italic;
	line-height: 100%;
}

#mono    {
	background-image: url(assets/images/monobg.jpg);
	background-repeat: repeat-x;
	background-color: #CC3333;
}

#comp {
	background-image: url(assets/images/compbg.jpg);
	background-repeat: repeat-x;
	background-color: #009966;
}

#split {
	background-image: url(assets/images/splitbg.jpg);
	background-repeat: repeat-x;
	background-color: #FF6666;
}

#triad {
	background-image: url(assets/images/triadbg.jpg);
	background-repeat: repeat-x;
	background-color: #333333;
}

#analogos {
	background-image: url(assets/images/analogosbg.jpg);
	background-repeat: repeat-x;
	background-color: #840042;
}

ul#swatchlist li a:hover {
	background-color: #CCCC00;
	background-image: url(assets/images/overbg.jpg);
	background-repeat: repeat-x;
}

#a {
	background-color: #ff0000;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#b {
	background-color: #bf3030;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#c {
	background-color: #a60000;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#d {
	background-color: #ff4040;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#e {
	background-color: #ff7373;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#f {
	background-color: #00CC00;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#g {
	background-color: #269926;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#h {
	background-color: #008500;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#i {
	background-color: #3AE63A;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}
	
#j {
	background-color: #69E669;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#k {
	background-color: #00AA72;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#l {
	background-color: #207F60;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#m {
	background-color: #006E4A;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#n {
	background-color: #36D5A1;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#o {
	background-color: #61D5AF;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#pr {
	background-color: #80E800;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#q {
	background-color: #73AE2C;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#r {
	background-color: #539700;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#s {
	background-color: #A2F43E;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#t {
	background-color: #B8F46F;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#u {
	background-color: #1826b0;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#v {
	background-color: #2E3784;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#w {
	background-color: #081272;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#x {
	background-color: #4C59D8;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#y {
	background-color: #717BD8;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#z {
	background-color: #FFEE00;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#ab {
	background-color: #BFB630;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#cd {
	background-color: #A69B00;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#ef {
	background-color: #FFF240;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#gh {
	background-color: #FFF673;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#ij {
	background-color: #FF7600;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#kl {
	background-color: #BF7230;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#mn {
	background-color: #A64D00;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#op {
	background-color: #FF9840;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#qr {
	background-color: #FFB473;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#st {
	background-color: #CB0077;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#uv {
	background-color: #982669;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#wx {
	background-color: #84004D;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#yz {
	background-color: #E642A0;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #900;
}

#a12 {
	background-color: #E567B1;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #990000;
}
#footer {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10px;
	color: #E6D5D2;
	text-align: center;
	margin-right: 2px;
	margin-left: 2px;
	background-color: #900;
	margin-bottom: 5px;
	border-top-width: thin;
	border-right-width: thin;
	border-bottom-width: thin;
	border-left-width: thin;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #000;
	border-bottom-color:  #FCC;
}



.div2 {
	background-color: #9A8F85;
	padding: 20px;
	margin: 20px;
	border: thin solid #993300;
	text-align: justify;
	color: #37271C;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 12px;
}

.container {
	background-color: #C00;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	color: #000;
	text-align: center;
	width: 80%;
	clear: right;
	padding-right: 10px;
	padding-left: 10px;
	line-height: 200%;
	position: relative;
	border-top-width: thin;
	border-right-width: thin;
	border-bottom-width: thin;
	border-left-width: thin;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #000;
	border-right-color: #000;
	border-left-color: #000;
}
.rotatecell {
	margin-right: 2%;
	margin-left: 2%;
	background-color: #900;
	text-align: center;
	padding-top: 10px;
	padding-right: 2%;
	padding-bottom: 10px;
	padding-left: 2%;
	border: thin solid #000;
	width: 450px;
	left: 70px;
	top: 447px;
}

.rowa {
	display: table-row;
	padding-top: 1%;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #000;
	width: 450px;
	margin-right: 50px;
	margin-left: 50px;
	position: relative;
}

.rowb {
	display: table-row;
	font-family: Verdana, Geneva, sans-serif;
}

.rowc {
	display: table-row;
	font-family: Verdana, Geneva, sans-serif;
}

.cell {
	display: table-cell;
	width: 100px;
	height: 100%;
	border: thin solid #420000;
	top: auto;
	padding-top: 5%;
}

.rowx {
	display: table-row;
	width: 450px;
	font-family: Verdana, Geneva, sans-serif;
}