/*main.css
E. Berlfein
5/12/05*/

/*main.css
E. Berlfein
5/3/05 */

/*main.css
E. Berlfein
4/30/05 */


/*************elements**********************/

body {
	font-family: verdana, helvetica, ariel, sans-serif;
	background-color: #D9D4E2;
	height: 100px;
}

/********main-text headings and paragraph*******/

#main-text h1 {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	color: black;
	font-size: 16px;
	text-decoration: none;
	font-weight: bold; 
}

#main-text h2 {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 14px;
	text-decoration: none;
	color: black;
	font-weight: bold; 
}

#main-text h3 {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 13px;
	text-decoration: underline;
	color: black;
	font-weight: normal; 
}

#main-text h4 {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 13px;
	color: black;
	text-decoration: none;
	font-weight: bold; 
}

#main-text h5 {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
	color: black; 
}

#main-text h6 {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	text-decoration: underline;
	color: black; 
}

#main-text p {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 11px;
	color: black; 
}

/********structural styling, starting from the top***********/


/*top bar is the bar at the very top of the page that contains artists name, view cart and sign guest book*/

#top-bar {
	background-color: #C9C5D4;
	border: 1px #8a878d solid; 
	font-size: 10px;
	color: #5c5c5c;
	font-family: Verdana, Helvetica, Arial, sans-serif; 
}

#top-bar td {
	padding-left: 10px;
	padding-right: 10px; 
}

#top-bar h1 {
	font-size: 10px; 
	color: black;
	font-weight: normal;
	line-height: 200%;
	margin: 0px;
	border: none; 
}

/*maintable is the whole table under the top bar*/

#maintable {
	border: 1px #8a878d solid; 
	width:760px;
	height:101%;
	background: white; 
	text-align: left;
}

/*header is the cell that contains the image at the top of the page*/

#header {
	height: 1px;
}

#header img {
	display: block;
}

/*navbar comes next, but it has a lot of styling, so it's listed below*/

/*sub-nav is only used on the gallery page. It displays the gallery categories*/

#sub-nav {
	font-size: 10px; 
	padding: 10px 0px 10px 50px;
	width: 650px; 
}

/*bars sets the bars inbetween the categories in sub-nav*/

.bars {
	color: black;
	padding-top: 0px;
	padding-left: 10px;
	padding-bottom: 0px;
	padding-right: 10px; 
}

/*main-text defines all the text in the main part of the site. It is a div, not a table or a cell. It ends just above the footer.*/

#main-text {
    font-size: 11px;
    line-height: 24px;
    padding: 0px 50px 0 50px;
    min-height: 300px;
}

/*pop-up text defines the text for pop-up windows*/

#popup-text {
    font-size: 11px;
    line-height: 24px;
    padding: 0px 20px 0 20px;
    background: white;    
}

/*page-name defines how the name of the page is displayed. page-name is used for all pages except for large-image 3, where page-name-li is used.*/

#page-name {
	font-size: 14px;
	padding-bottom: 0px;
	padding-top: 20px;
	margin-bottom: 20px; 
	letter-spacing: 5px;
	font-weight: normal;
	color: black;
	border-bottom: 1px black solid;
	width: 658px;
}

#page-name-li {
	font-size: 13px;
	padding-bottom: 3px;
	padding-top: 2px;
	font-weight: bold;
	color: black;
	text-align: center; 
}

/*floatright and floatleft define the location of images on the main pages*/

.floatright {
	float: right;
	margin-top: 8px;
	margin-left: 30px;
	margin-bottom: 30px; 
}

.floatleft {
	float: left;
	margin-top: 8px;
	margin-bottom: 30px;
	margin-right: 30px; 
}

/*footer info. logo is part of the footer, and defines a left margin on the logo image*/

#footer {
	background-color: #531a8d;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	color: #ffffff;
	font-size: 11px; 
}

#footer td {
	margin: 0px;
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 3px;
	padding-bottom: 3px; 
	border-top: 1px #831183 solid;
}

.logo {
	margin-left: 10px; 
}

/*table-largeimage(x) defines the way the tables on the large image pages are displayed. info is the top table containing information about the product and cart is the lower table contain the add to cart button.*/

#table-largeimage1 {
	width: 200px; 
}

#table-largeimage1 td {
	font-size: 11px;
	text-align: left;
	line-height: 16px;
	padding-top: 0px;
	padding-left: 10px;
	padding-bottom: 6px;
	padding-right: 10px;
	margin: 0px; 
} 

.info1 {
	border: 1px #bfbfbf solid;
}

.info1 th {
	padding-top: 10px;
	font-weight: bold;
	text-align: left;
	padding-left: 10px;
	padding-bottom: 5px; 
}

.cart1 {
	/*border: 1px #bfbfbf solid;*/
	width: 200px;
}


#table-largeimage2 {
	border: 1px #bfbfbf solid;
	width: 400px; 
	margin: auto;
}

#table-largeimage2 td {
	font-size: 11px;
	line-height: 16px;
	padding-top: 0px;
	padding-left: 10px;
	padding-bottom: 6px;
	padding-right: 10px;   
} 

.info2 {
	/*border: 1px #bfbfbf solid;*/
	text-align: center;
}

.info2 th {
	padding-top: 10px;
	font-weight: bold;
	text-align: center;
	padding-left: 10px;
	padding-bottom: 5px; 
}

.cart2 {
	/*border: 1px #bfbfbf solid;*/
	text-align: left;
}

#table-largeimage3 {
	border: 1px #bfbfbf solid;
	width: 400px; 
	margin: auto;
}

#table-largeimage3 td {
	font-size: 11px;
	line-height: 16px;
	padding-top: 0px;
	padding-left: 10px;
	padding-bottom: 6px;
	padding-right: 10px;   
} 

.info3 {
	/*border: 1px #bfbfbf solid;*/
	text-align: center;
	width: 400px;
}

.info3 th {
	padding-top: 0px;
	font-weight: bold;
	text-align: center;
	padding-left: 10px;
	padding-bottom: 0px; 
}

.cart3 {
	/*border: 1px #bfbfbf solid;*/
	text-align: left; 
}


.smalltext {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 9px; 
}

/*table-borders defines the table used on the order form*/

#table-borders {
	margin-left: auto;
	margin-right: auto;
	background-color: #ececec;
	border-left: 1px gray solid;
	border-top: 1px gray solid; 
}

#table-borders td {
	padding: 10px;
	border-bottom: 1px gray solid;
	border-right: 1px gray solid;
	font-size: 12px; 
}

#table-borders th {
	background-color: #d3d3d3;
	font-weight: normal;
	font-size: 12px;
	color: black; 
	padding: 10px;
	border-bottom: 1px gray solid;
	border-right: 1px gray solid; 
}


/************navigation bar with drop down menus**************/

#navbar {
	font-size: 12px;
	color: #000000;
	background: url(images/menubar.jpg) no-repeat; 
	height: 28px;
	text-align: center;
}

#navbar ul {
	padding: 0 0 0 30px;
	margin: 0;
	line-height: 200%;
}

#navbuttons li {
  	padding-right:10px; /*changed 2/25/05*/
  	margin: 0;
	list-style-type: none;
	float: left;
	position: relative;
	left: 0px;
	white-space: nowrap;
	width: auto;
	border: none;
}

* html #navbuttons li {
	width: 1%;
}

#navbuttons li ul {
	position: absolute;
	left: 0px; 
	display: none;
	font-weight: normal;
	padding: 0;
	margin: 0;
	width: 130px;
	line-height: 120%;
	background: #9a7cae;
	border: 1px #531a8d solid;
	border-bottom: none;
}

#navbuttons li > ul { /*IE cannot read this rule*/
   top: auto;
}

#navbuttons li:hover ul, #navbuttons li.over ul { 
	display: block;
}

#navbuttons li li {
	display: block;
	margin: 0;
	padding: 0;
	clear: left;
	border: none;
	white-space: normal; 
}

#navbuttons a {
	text-decoration: none;
	background-image: url(images/arrow_none.gif);
	background-repeat: no-repeat;
	background-position: left center; 
	padding: 0px 15px;
	margin: 0;
	display: block;
}

#navbuttons a.current {
	background: url(images/arrow.gif) no-repeat;
	background-position: left center;
}

#navbuttons li li a {
	display: block;
	font-weight: normal;
	border-bottom: 1px #531a8d solid;
	background-image: url(images/arrow_none.gif);
	background-repeat: no-repeat;
	padding: 5px 5px;
	text-decoration: none;
	margin: 0;
	text-align: left;
	width: 120px;
}


/**********navigation rollovers, listed from top to bottom***********/

a:link, a:visited, a:active {
	color:#994099;
	text-decoration: underline; 
}

a:hover, a:visited:hover {
	color: #e99d13;
	text-decoration: underline; 
}

#top-bar a:link, #top-bar a:visited, #top-bar a:active {
	color: #5c5c5c;
	text-decoration: none; 
}

#top-bar a:hover, #top-bar a:visited:hover {
	color: black;
	text-decoration: none; 
}

#navbuttons a:link, #navbuttons a:visited, #navbuttons a:active {
	color: white;
}

#navbuttons a:hover, #navbuttons a:visited:hover {
	color: #d99615;
}

#navbuttons li li a:link, #navbuttons li li a:visited, #navbuttons li li a:active {
	color: white;
}

#navbuttons li li a:hover, #navbuttons li li a:visited:hover {
	background-color: #e99d12;
	color: white; 
}

#footer a:link, #footer a:visited, #footer a:active {
	color: white;
	text-decoration: none; 
}

#footer a:hover, #footer a:visited:hover {
	color: #d99615;
	text-decoration: none; 
}


