.itemContainer
{
    width: 600px;
    list-style-type: none;
}

.itemContainer li
{
    height: 280px;
    width: 200px;
    float: left;
}

.itemContainer li img
{
    width: 180px;
    margin: 10px 20px 10px 0;
} 

*
{
    font-size: small;
    color:  #660066;
    font-family: Arial, Helvetica, sans-serif;
    text-align: left;
}
a
{
    color: #CC00CC;
    text-decoration: none;
}
a:hover
{
    color: #FF00FF;
}
body
{
    /* 
		Clears white space around the body.
	*/
    margin: 0 0 0 0; padding: 0;
    width: 100%; background-color: #DECEFF;
}


h1
{
  /*
    Makes h1 elements smaller than their browser default.
  */
 font-size : 14px;
 padding-bottom: 2px;
 margin-bottom: 0px;
}
p
{
    padding-top: 0px;
    margin-top: 0px;
}

.Introduction
{
  font-style: italic;
  color: #003399;
}
#bgplacer
{
    margin-left: auto; 
    margin-right: auto; 
    position:relative; 
overflow: hidden;
	width: 900px;    margin-top: 0; padding: 0; color:White;
}
#bgwrapper
{
    background-position: center top;
    float: left;
    width: 900px;
    min-width: 900px;
    background-repeat: repeat-y;
    background-image: url('../Images/artemis_background.jpg');
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    padding: 0;
    top:  0;
}
#PageWrapper
{
	/*
		Sets the total width for the entire page. 
	*/
	width: 800px; 
	position: relative; 
	MARGIN-LEFT: auto; 
	MARGIN-RIGHT: auto; 
}

#Header
{
    /*
		Gives the header the same width as the PageWrapper. The height creates some room for the logo
		that is set with the background-image.
	*/
    background-position: inherit top;
    background-image: url('../Images/artemis_header3.jpg');
    width: 800px;
    height: 215px;
    background-repeat: no-repeat;
    visibility: visible;
}

.HeaderLink
{
	/*
		The #HeaderLink is nested in the #Header. It provides a link to the contact page.
	*/
	width: 800px; 
	height: 230px; 
	display: block;	
}

#MenuWrapper
{
    /*
		The menu spans the page width, right below the header.
		At the top and left a few pixels padding is applied to create some room.
	*/
    background-position: left top;
    /*background-image: url('../Images/FrontPageText.jpg');*/
    width: 700px;
    height: 80px;
    padding-left: 10px;
    background-repeat: no-repeat; margin-left: 100px;
}
#Menu
{
    /*
		The Menu gets a white border on all four sides.
	*/
    padding-right: 20px;
    height: 22px;
}

.MainMenu
{
    /*
		The Menu gets a white border on all four sides.
	*/
    height: 22px;
}

#SubMenuWrapper
{
    position: relative;
    float: left;
    width: 100px;
}
#SubMenu
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: small;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    color: #660066;
    padding-left: 10px;
    padding-right: 10px;
}
.SubMenu A
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: small;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    color: #660066;
}
#InfoBox
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: small;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    color: #660066;
    padding-left: 10px;
    padding-right: 10px;
    overflow: auto;
}
#SellSamples
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: small;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    color: #660066;
    padding-left: 10px;
    padding-right: 10px;
    overflow: auto;
}
.leftspace
{
    height:80px;
}
#Front
{
    position: relative;
    padding-right: 5px;
    float: left;
    width: 695px;
}
#Font
{
    position: relative;
    float: left;
    width: 700px;
}
.Font p
{
    padding-right: 10px;   
}
#Front td
{
    font-size:small;
    font-family: Arial, Helvetica, sans-serif;
}
#Front a
{
    font-size: small;
}

#page
{
    /*
		Defines the main content area. The #MainContent element has a minimum height of 500 pixels, but can grow if necessary.
		The font-size is 80% of its parenty element, which in this case comes down to 80% of the font
		the user has specified as the default font in the browser.
	*/
    font-size: 0.8em;
    width: 1073px;
    border-left: 0px;
    border-right: 0px;
    padding-left: 51px;
}

#SpaceTopHome
{
    height:68px;
}
#HomeImg
{
    padding-left: 15px;
}
#SpaceMidHome
{
    height:148px;
}
#HomeBoxWrapper
{
    width:900px;
    padding-left: 10px;
}
#SpaceBotPortMenu
{
    height:20px;
}

#aboutme
{
	/*
		Defines the main content area. The #MainContent element has a minimum height of 500 pixels, but can grow if necessary.
		The font-size is 80% of its parenty element, which in this case comes down to 80% of the font
		the user has specified as the default font in the browser.
	*/
	font-size: 0.8em;
	width: 1073px;
	border-left: 0px;
	border-right: 0px;
	padding-left: 51px;
	background-image: url('../Images/Contact.jpg');
	background-repeat:no-repeat;
	background-color: #ffffff;
    min-height: 500px;
}
#SpaceTopAbout
{
    height:167px;
}
#aboutmemain
{
    padding-top: 10px;
    padding-left:55px;
    width:1073px;
}
#brandingtable
{
    width: 832px;
    color: #70BADD;
}

#Onlinetable
{
    padding-top: 50px;
    padding-right: 51px;
}     
#Onlinetable td
{
    color: #70BADD;
}        

#Print
{
    padding-top: 30px;
    padding-right: 100px;
}  
#Print td
{
    color: #70BADD;
}        
   
#Adverts
{
    padding-top: 10px;
    padding-right: 50px;
}     
Adverts a
{
    color: #66CCFF;
}
#Adverts td
{
    color: #70BADD; font-size: 0.8em;
}
#Adverts td i
{
    color: #70BADD; font-size: 1em;
}

#FootWrap
{
    width: 800px;
    clear: both;
    float: left;
    height:150px; position: inherit;    
}
#FooterImg
{
    /*
		The footer is positioned below all other content (yet still within PageWrapper).
		At the top, it gets a border with a dashed style, while all other sides have no border.
		clear: both is used to clear the impact of the float properties used for #MainContent and #SideBar.
	*/
    background-position: top;
    width: 800px;
    clear: both;
    float: left;
    visibility: visible;
    z-index: inherit;
    position: inherit;
    background-image: url('../Images/ArtemisFooterTop.jpg');
    background-repeat: no-repeat;
    height: 73px;
    background-position: center top;
}

#Footer
{
    /*
		The footer is positioned below all other content (yet still within PageWrapper).
		At the top, it gets a border with a dashed style, while all other sides have no border.
		clear: both is used to clear the impact of the float properties used for #MainContent and #SideBar.
	*/
    background-position: center top;
    text-align: center;
    font-size: x-small;
    clear: both;
    float: left;
    width: 800px;
    background-image: url('../Images/ArtemisFooterBot.jpg');
    background-repeat: no-repeat;
    height: 50px;
    position: inherit;
}
#Footer a
{
    font-size: x-small;
}

#Footer td
{
    text-align: left;
    font-size: 0.7em;
    font-weight: bold;
}
#Footer td a
{
    text-align: left;
    font-weight: bold;
    color:#BB3882;
    font-size: 1em;
}

.MyButton
{
	color: #308462;
}
.StaticMenuItemStyle, .StaticMenuItemStyle a
{
    color: #325664;
    text-decoration: none;
    padding-left: 2px;
    font-size: 1em;
}

.StaticHoverStyle, .StaticSelectedStyle
{
    color: White;    
}
.StaticHoverStyle a,
{
    color: White;
    text-decoration: none;
}
.StaticSelectedStyle
{
    color: White;    
}

.StaticMenuItemStyleP
{
    border: 2px solid #FFFFFF;
    text-decoration: none;
    font-size: 1em;
    background-color: #70BADD;
    width: 230px;
    height: 36px;
    color: White;
}

.StaticHoverStyleP, .StaticSelectedStyleP
{
    background-color: #B9357E;
    text-decoration: none;
}
.StaticHoverStyleP a, .StaticMenuItemStyleP a
{
    text-decoration: none;
}
.MainMenu a:hover
{
    color: #FFFFFF;
}
#LightBox a a:visited
{
    color: #FFFFFF;
    font-size: xx-small;
}

#LightBox
{
    float: left; width: 900px; position: inherit;
}
#branding td
{
    font-size: 0.85em;
}
.arrow
{
    font-size: 0.85em;   
}
.StaticMenuItemStyleP
{
    border: 1px solid #FFFFFF;
    text-decoration: none;
    font-size: 1em;
    width: 80px;
    height: 36px;
    padding-left:5px;
    background-color: #FFFFFF;
    color:#CC00CC;
}

.StaticHoverStyleP, .StaticSelectedStyleP
{
    background-color: #CCCCFF;
    text-decoration: none;
}
.StaticHoverStyleP a, .StaticMenuItemStyleP a
{
    text-decoration: none;
}
.info
{
    font-size: small;
}
.info ul
{
    padding-top:0px; 
    margin-top:0px;   
}
.info p
{
    padding-bottom:0;
    margin-bottom:0;
}

.info table
{
    margin-left:auto;
    margin-right:auto;    
}
.StaticMenuItemStyleR  /*.StaticMenuItemStyleR td */
{
    text-decoration: none;
    font-size: 1em;
    width: 90px;
    height: 26px;
    padding-left: 2px;
    padding-right: 2px;
    background-color: #CC99FF; 
    text-align: center;
}

.StaticHoverStyleR
{
    background-color: #FFFF99;
    text-decoration: none;
}
.StaticSelectedStyleR
{
    background-color: #CC77FF;
    text-decoration: none;
}
.StaticHoverStyleR a, .StaticMenuItemStyleR a
{
    text-decoration: none;
}
#leftpics
{
    position: relative;
    float: left;
    width: 140px; 
    padding-top: 5px;   
    padding-bottom: 5px;   
}
#toppics
{
    position: relative;
    float: left; 
    padding-top: 5px;   
    padding-bottom: 5px;   
}
#rangetext
{
    position: relative;
    padding-right: 5px;
    float: right;
    width: 545px; 
    padding-top: 5px;   
}
#leftpics img
{
    padding-top: 2px;
    padding-bottom: 2px;
}
#SubMenu a
{
    color: #006699;
    text-decoration: none;
}
#SubMenu a:hover
{
    color: #0066FF;
}
#SubMenu p, #SubMenu b
{
    color: #003F5E;
}