/* * * * * * * * * * * * * * * * * * * * * * * * * */
/*   CSS file for WagnerPhotoArt.com   */
/* * * * * * * * * * * * * * * * * * * * * * * * * */
body  { margin: 0; padding: 8em 0 0 0; }

div#fixedbox  {
  position: absolute;
  top: 0;
  left: 0;
  width: 1080px;
  height: 200px;
  overflow:visible;
  color: #000000;
}

div#content  { padding: 1em; }

body>div#fixedbox { position: fixed; }

/* * * * * * * * * * * * * * */
/*   Original Section   */
/* * * * * * * * * * * * * * */

body {
	margin: 0;
	padding: 0;
	font-family: arial, verdana, helvetica, sans-serif;
	background:#333333;
	color: #eeeeee;
	font-size: small;
}

h1, h2 { padding: 0; margin-top: 0.75em; margin-bottom: 0.3em; border: 0; }

h3, h4, h5, h6 { padding: 0; margin-top: 0.3em; margin-bottom: 0.2em; border: 0; }

p, ul, ol, dl, li, dt, dd, blockquote {
	padding: 0;
	margin-top: 0.3em;
	margin-bottom: 0.3em;
	border: 0;
}

table { margin-top: 0; margin-bottom: 0; border: 1px solid black; }

/*Using these values for the size of the headings creates a natural relationship between them.*/
h1 {font-size: 218%;}
h2 {font-size: 164%;}
h3 {font-size: 145%;}
h4 {font-size: 118%;}
h5 { font-size: 100%; }
h6 { font-size: 75%; }
ul li {font-size: 50%; }

/*Another Approach to consistent spacing*/
ol, ul, li {margin: 0; padding: 0;}

p.dropcap:first-letter {font-size:2em}   /* usage is <p class="dropcap"> */

.opaque { opacity: .5; filter: alpha(opacity=50); }

.emphasize { color:#990000; }

/*  *****************************  */
/*  ***** GALLERY CODE *****  */
/*  *****************************  */
#gallery { position: absolute; left: 20px; top: 120px; height: 500px; }

.width0 { width:1200px; }
.width0a { width:1700px; }
.width0b { width:900px; }
.width0c { width:1000px; }
.width0cz { width:1100px; }
.width0d { width:2200px; }
.width0g { width:2500px; }
.width0s { width:2600px; }
.width0t { width:2700px; }
.width1  { width:2860px; }
.width1a  { width:3200px; }
.width1d  { width:3500px; }
.width2 { width:4300px; }
.width2d { width:5100px; }
.width3 { width:5300px; }
.width3d { width:5700px; }
.width4 { width:5900px; }
.width4b { width:6000px; }
.width4d { width:6100px; }
.width5 { width:6300px; }
.width6 { width:6900px; }
.width7 { width:7200px; }
.width7b { width:7300px; }
.width7c { width:7400px; }
.width7d { width:7500px; }
.width8 { width:8000px; }
.width8b { width:8200px; }
.width8d { width:8600px; }
.width8f { width:8800px; }
.width9 { width:9000px; }
.width10 { width:10000px; }
.width11 { width:11000px; }
.width12 { width:12000px; }
.width13 { width:13000px; }
.width14 { width:14000px; }
.width15 { width:15000px; }

#wrapper div { float:left; color: #000; }

#wrapper img { margin-top:10px; margin-right: 12px; }

/*  ***** TEXTBOXES  *****  */
.textbox {
	display:block;
	position:relative;
	margin:10px 12px 0 0;
	height:450px;
	color:#ffffff;
	background-color:#999999;
	background: transparent url(../images/Textbox-Gradient-Gray-Line.gif) repeat-x;
	overflow:auto;
}

.innertext {
	height:430px;
	color:#ffffff;
	padding:10px;
	font-size:large;
	font-family:"Palatino Linotype", Georgia, Arial, Verdana, Times;
	overflow:hidden;
}

.innertitle {
	height:430px;
	color:#ffffff;
	padding:10px;
	font-size:xx-large;
	font-weight:bold;
	font-style:italic;
	font-family:"Palatino Linotype", Georgia, Arial, Verdana, Times;
	overflow:hidden;
	text-align:center;
}

.twide0 { width:350px; }
.twide0d { width:250px; }
.twide0c { width:18em; }    /*  400px  */
.twide1 { width:600px; }
.twide15 { width:15em; }
.twide20 { width:20em; }
.twide23 { width:23em; }
.twide2 { width:25em; }
.twide28 { width:28em; }
.twide33 { width:33em; }
.twide3 { width:35em; }
.twide40 { width:40em; }
.twide45 { width:45em; }
.twide900 { width:900px; }
.twide1000 { width:1000px; }
.twide1100 { width:1100px; }

.textboxwide {
	display:block;
	position:relative;
	margin:10px 12px 0 0;
	/*width:350px;*/
	height:450px;
	color:#ffffff;  /*#cccccc;*/
	background-color:#999999;
	background: transparent url(../images/Textbox-Gradient-Gray-Line.gif) repeat-x;
	overflow:hidden;
}

.innertextwide {
	width:33em;
	height: 415px;
	/*border: #aaaaaa solid 2px;*/
	color:#ffffff;
	padding:10px;
	margin:5px;
	font-size:large;
	font-family:"Palatino Linotype", Georgia, Arial, Verdana, Times;
	overflow:hidden;
}


/*  ******************************  */
/*  ***** HEADER STUFF *****  */
/*  *****************************  */
#header {
	width: 1050px;
	height: 200px;
	position: absolute;
	top: 0;
	left:0;
	z-index: 99;
}

#navbar {
	/*position: relative;
	top:25px;
	left:400px;*/
	z-index:9;
	float:left;
	/*width:590px;*/
	background-color: #cccccc;
	margin: 8px;
}

#logo {
	/*position: relative;
	left:12px;*/
	z-index:9;
	float:left;
	margin:8px 8px 0 8px;
}

#viewthecart {
	float:left;
	margin: 20px 0 0 12px;
}

#viewcart {
	float:left;
	margin: 20px 0 0 12px;
}

/*  ARROWS   85x58  */
#arrows {
	width: 280px;
	height: 60px;
	cursor: pointer;
	float:left;
	padding: 0 6px 6px 6px;
	margin-left:120px;
}

#arrows div a {
	/*margin-right: 15px;*/
	display: block;
	width: 80px;
	height: 30px;
	overflow: hidden;
	cursor: pointer;
	font-size: 50em;
	text-indent: -9000px;
}

div#left { margin-right:15px; }

#pagetitle {
	width: 100%;
	text-align:center;
	font-weight:bold;
	font-style:italic;
	font-size:large;
	font-family: 		Arial, Helvetica, sans-serif;
	margin-bottom: 4px;
	color:#ffffff;
	/*color:#990000;
	background-color: #666666;
	border: solid 2px #330000;*/
}

/*#arrows #left a { float:left; background: transparent url(../images/Arrow-Lt-Left.gif) no-repeat;}
#arrows #left a:hover { float:left; background: transparent url(../images/Arrow-Left-Color.gif) no-repeat;}
#arrows #right a{ float:right; background: transparent  url(../images/Arrow-Lt-Right.gif) no-repeat;}
#arrows #right a:hover { float:right; background: transparent  url(../images/Arrow-Right-Color.gif) no-repeat;}*/

#arrows #left a { float:left; background: transparent url(../images/Arrow-LGray.gif) no-repeat;}
#arrows #left a:hover { float:left; background: transparent url(../images/Arrow-LGold.gif) no-repeat;}
#arrows #right a{ float:right; background: transparent  url(../images/Arrow-RGray.gif) no-repeat;}
#arrows #right a:hover { float:right; background: transparent  url(../images/Arrow-RGold.gif) no-repeat;}