﻿body 
{

    font-family:"Century Gothic";
    background-color:#eee;
     /*background-repeat:repeat-x; 
   background-image: url(../images/bg-fade.jpg);*/
     background-image: url(../images/stripes.gif);
   margin:0px;
}

.label
{
	BACKGROUND-COLOR: #ffffff;
	font-size: 12px;
	color: black;
	font-family: Century Gothic, Helvetica, sans-serif;
	width:87px;
}

.input
{
	border-right: #8896c3 1px solid;
	border-top: #8896c3 1px solid;
	border-left: #8896c3 1px solid;
	border-bottom: #8896c3 1px solid;
	font-family: Arial, Helvetica, sans-serif;
}

.inputX
{
	border-right: #8896c3 1px solid;
	border-top: #8896c3 1px solid;
	border-left: #8896c3 1px solid;
	border-bottom: #8896c3 1px solid;
	font-family: Arial, Helvetica, sans-serif;
	BACKGROUND-COLOR: #eeeeee;
}

.error
{
	font-family:Century Gothic, Helvetica, sans-serif;
	font-size:14px;
	color:Red;
	}
	
.Message
{
	font-family:Century Gothic, Helvetica, sans-serif;
	font-size:14px;
	font-weight: bold;
	color:black;
	BACKGROUND-COLOR: #ffffff;
	}
	
.labelerror
{
	BACKGROUND-COLOR: #ffffff;
	font-weight: bold;
	font-size: 14px;
	color: red;
	font-family: Century Gothic, Helvetica, sans-serif;
	width:87px;
	}

.button
{
	border-right: black 1px solid;
	border-top: black 1px solid;
	border-left: black 1px solid;
	border-bottom: black 1px solid;
	font-family: Arial, Helvetica, sans-serif;
}



/* this is the clipping region for the menu. it's width and height get set by script, depending on the size of the items table */
.mtDropdownMenu {
	position:absolute;
	overflow:hidden;
	left:-1000px;
	top:-1000px;
	}

/* this is the main container for the menu itself. it's width and height get set by script, depending on the size of the items table */
.mtDropdownMenu .content {
	position:absolute;
	}

/* this table comprises all menu items. each TR is one item. It is relatively positioned so that the shadow and background transparent divs can be positioned underneath it */
.mtDropdownMenu .items {
	position:relative;
	left:0px; top:0px;
	border:1px solid #999;
	z-index:2;
	}

.mtDropdownMenu.top .items {
	border-top:none;
	}

/* each TR.item is one menu item */
.mtDropdownMenu .item {
    color:#762a4e;
    font-size:14px;

    font-family:Century Gothic, Helvetica, sans-serif;
    text-decoration:none;
	/* this is a hack for mac/ie5, whom incorrectly cascades the border properties of the parent table to each row */
	border:none;
	cursor:pointer;
	cursor:hand;
	}

/* this DIV is the semi-transparent white background of each menu. the -moz-opacity is a proprietary way to get transparency in mozilla, the filter is for IE/windows 5.0+. */
/* we set the background color in script because ie mac does not use it; that browser only uses a semi-transparent white PNG that the spacer gif inside this DIV is replaced by */
.mtDropdownMenu .background {
	position:absolute;
	left:0px; top:0px;
	z-index:1;
	-moz-opacity:.8;
	filter:alpha(opacity=90);
	}

/* same concept as .background, but this is the sliver of shadow on the right of the menu. It's left, height, and background are set by script. In IE5/mac, it uses a PNG */
.mtDropdownMenu .shadowRight {
	position:absolute;
	z-index:3;
	top:3px; width:2px;
	-moz-opacity:.4;
	filter:alpha(opacity=40);
	}

/* same concept as .background, but this is the sliver of shadow on the bottom of the menu. It's top, width, and background are set by script. In IE5/mac, it uses a PNG */
.mtDropdownMenu .shadowBottom {
	position:absolute;
	z-index:1;
	left:3px; height:2px;
	-moz-opacity:.4;
	filter:alpha(opacity=40);
	}

/* this is the class that is used when the mouse is over an item. script sets the row to this class when required. */
.mtDropdownMenu .item.hover {
	background:#eceaeb;
		color:305d98;
	}

/* this is either the dingbat that indicates there is a submenu, or a spacer gif in it's place. We give it extra margin to create some space between the text and the dingbat */
.mtDropdownMenu .item img {
	margin-left:10px;
	}



#menu ul {
  margin:0px;
  padding: 0px;
  list-style:none;
  vertical-align:middle;

}
#menu li 
{
  float:left;
  color:#762a4e;
  font-weight:bold;
  }
  
 #menu li a
{
font-family:"Century Gothic";
font-size:10pt;
text-decoration:none;color:#762a4e;  height:35px;
padding: 8px 10px 0px 10px;
border-left:1px solid #beb4ff;
border-right:1px solid #beb4ff;
border-top:1px solid #beb4ff;
  }
  
   #menu li A:Hover
{
background-color:White;
border-left:1px solid #999;
border-right:1px solid #999;
border-top:1px solid #999;

  }
  
  A: link, A:active, A:visited{
	text-decoration:none;
	color:#762a4e;}
	

  
  


h1{
    font: 18pt "Century Gothic";
    color: #000080;
    margin-top:.01em;
}
h2{
    font: 12pt "Century Gothic";
    color: #333333;
    font-weight: bold;
}
  
  h3
  {
   font: normal 12pt "Century Gothic";
   color: #000080;
   font-weight:bold;}
   
     h4
  {
   font: normal 11pt "Century Gothic";
   color: #000000; padding:2px; margin-bottom:.1em;}
   
p {
    color: #333333;
    font: 10pt "Century Gothic";
}

.ProductLinks {font: 8pt "Century Gothic";}


#header{ width:100%;
        /* background-repeat:repeat-x; 
   background-image: url(../images/bg.jpg); */   
   text-align:center;}

#banner{ width:900px;
         height:222px; 
           background-repeat:no-repeat; 
           background-position:top; 
           background-image: url(../images/banner.jpg); 
           text-align:center;
           border-left: solid 1px #beb4ff;
 border-right:solid 1px #beb4ff;}
 
 #global{float:right; text-align:right; width:350px;
	color: #ffffff;
    font: 11pt "Century Gothic";
    font-weight:bold;
    padding:5px;
         }

#navigation
{
	width:900px; background-color:#beb4ff;
    text-align:left;
    border-left: solid 1px #beb4ff;
	border-right:solid 1px #beb4ff; height:35px;}

#content
{width:100%;

 text-align:center;
}
 
  #quicknav{ float:left;
           width:225px; 
           height:55px; 
           background-repeat:no-repeat; 
           background-position:top; 
           background-image: url(../images/home-quicknav.jpg); 
           padding-top: 15px; text-align:center;
           }
 
 #sidebar{ float:right;
           width:230px;padding:5px;
           font: 10pt "Century Gothic"; text-align:left;
}
 
 #main
{
 text-align:left;width:900px;height:500px; padding: 15 10 10 10; background-color:White;
 
 border-left: solid 1px #beb4ff;
 border-right:solid 1px #beb4ff;}
 
 #seperator{ border: dashed 1 #cccccc;}
 
 #lower-main
{ float:none;
  width:850px;}

#lower-main span
{ float:left;
  width:100%;
  padding:5px;}
  
  #lower-main span p
{ font: 10pt "Century Gothic"; text-align:left; }

#lower-main span h3
  {text-align:left;
   font: normal 12pt Corbel;
   color: #000080;
   font-weight:bold;
   margin-bottom:-1em;}
   
  #lower-main span li
  {font: 10pt "Century Gothic"; text-align:left;}
  
  #lower-main span img
  {text-align:center;}
  
   #default-main
{ float:none;
  width:880px;}
  
  #contact{float:left;
  width:450px;}


  
  #Events{font: 10pt "Century Gothic"; 
	width:440px;
	float:left;
	text-align:left;
	padding:2px;}
	
	#Events legend{font: 14pt "Century Gothic"}
	
	#Events h2{
    font: 12pt "Century Gothic";
    color: #ffffff;
    font-weight: bold;
    background-color: Purple;
    padding:4px;
    width:100%;
}
  
  .date{font: 8pt "Century Gothic"; padding-bottom:5px;}
  .title{font: 12pt "Century Gothic"; font-weight:bold; padding-bottom:3px;}
  .event{font: 10pt "Century Gothic"}
  
  #NewProducts{font: 10pt "Century Gothic";
	text-align:center; 
	float:left; 
	width:440px;
	padding:2px;}
	
  #NewProducts TD LI{font: 10pt "Century Gothic"; padding-left:20px; list-style: none;}
	
  #NewProducts h2{
    font: 12pt "Century Gothic";
    color: #ffffff;
    font-weight: bold;
    background-color: #006eb3;
    padding:4px;
    width:100%;}
  
  #kiddomino{font: 9pt "Century Gothic"; padding:5px;}
  #footer{ width:100%; text-align:center;}
  #footerMain
           {font: 9pt "Century Gothic";width:900px;
          height:95px; 
           background-repeat:repeat-x; 
           background-position:top; 
           background-image: url(../images/bg.jpg); 
           text-align:center;
           border-top: solid 1px #beb4ff;padding:15 5 0 5;
            
 border-left: solid 1px #beb4ff;
 border-right:solid 1px #beb4ff;}
           
  #copyright{float:left;width:95%}
  #copyright a {text-decoration:none;}
  #motto{float:right;width:95%;color:#0000ff; font: bold 12pt "Century Gothic"; padding: 7 0 7 0}
  
  
#breadcrumb{text-align:left; padding:  0 0 10 4;color:#2383bf;font: bold italic 11pt/ "Century Gothic"}
#information{font: 11pt "Century Gothic"; padding: 15 10 25 20;text-align:left;}

#information p{font: 11pt "Century Gothic"; padding-bottom:1em;}

#iNew { padding:0; float:left;
	position:relative;
	left:0px; top:0px;}

#product{font: 10pt "Century Gothic";width:850px;float:left}

div.productimage{float:right; text-align:center;padding:5 5 25 5;width:360px;height:300px;}

div.productdetails{float:left;width:460px;}
div.ProductListHead{font-size: 14pt;font-weight:bold;text-decoration:none;}
div.ProductListHead A{text-decoration:none;}
div.ProductListDescription{font-size: 10pt;padding:4 0 20 0}
div.ProductListDetails{padding:8 8 8 8; border:solid 1px #eeeeee; background-color: #f9f7c6; margin-bottom:15px;}
div.ProductListDetails span{padding: 2 0 2 0}
div.ProductListNotes{padding:10 0 2 0; width:100%;}
div.ProductListPrice{ width:100%;font-size: 12pt; font-style:italic;color:#762a4e; padding-top: 15; font-weight:bold; margin-top:10px;}
div.productFile2{float:right;}

#products{font-family:"Century Gothic";width:100%}

div.productsimage{float:left; text-align:center;padding:5 15 25 15;}
div.productsdetails{float:right;width:200px;}
div.ProductsListHead{font-size: 11pt;font-weight:bold;text-decoration:none;padding-top:8;}
div.ProductsListHead A{text-decoration:none;}
div.ProductsListDescription{font-size: 9pt;padding:4 0 20 0}
div.ProductsListDetails{padding:8 0 2 0}
div.ProductsListNotes{padding:2 0 2 0; text-align:center;}
div.ProductsListPrice{font-size: 11pt; font-style:italic;}

