html {font-size:67.5%;}
/*body {background:#2f3a4e url('images/bodyBG4.gif') no-repeat top center; margin:0px; padding:0px; font: 1em/1.3em normal Tahoma, 'Trebuchet MS', sans-serif;}*/
body {background:#ffffff url('images/bodyBG5.gif') no-repeat top center; margin:0px; padding:0px; font: 1em/1.3em normal 'Verdana', 'Trebuchet MS', sans-serif; overflow-y:scroll; overflow-x:auto;}

head {
	font-family: Verdana;
    font-size: 16px;
	color: #ffffff;
}

h1 {color: #FF0000;}
h2 {color: #FFFFFF; font: 2.3em/1em normal 'Hoefler Text', 'Times New Roman', Times, serif; margin: 0px;}
h3 {color: #FF0000; font: 1.4em/1em normal 'Hoefler Text', 'Times New Roman', Times, serif; margin: 0px; padding: 10px 0px 0px 0px;}
h4 {color: #FF0000; font: 1.4em/1em normal 'Hoefler Text', 'Times New Roman', Times, serif; margin: 0px;padding: 10px 0px 0px 0px;}
h5 {color: #FF0000; font: 1.2em/1em normal 'Hoefler Text', 'Times New Roman', Times, serif; text-transform:uppercase; margin: 0px;padding: 10px 0px 0px 0px;}
h6 {color: #FF0000; font: 1em/1em normal 'Hoefler Text', 'Times New Roman', Times, serif; text-transform:uppercase; margin: 0px;padding: 10px 0px 0px 0px;}

.Style2 {	
	font-size: 1.3em;
	color: #43555A;
	font-family: 'Eras Demi ITC', 'Hoefler Text', 'Times New Roman', Times, serif;
 }


img {border:0px;}
p {margin: 0px 0px 20px 0px;}
a, a:visited {color: #43555A; text-decoration: none;}
	a:hover, a:visited:hover, a:focus {color: #444;}


.ttf {margin:0px 0px -3px 0px; padding:0px;}

#container {width: 990px; margin:0px auto;}
	
.breadcrumb {color:#5d4524; margin:-40px 0px 40px 0px; font-size:0.9em;}
	.breadcrumb a, .breadcrumb a:visited {color:#205d57;}
	.breadcrumb a:hover, .breadcrumb a:visited:hover, .breadcrumb a:focus {color: #18857b;}
	
#rightZone {float:right; width:349px; margin:0px 0px 60px 0px; padding:0px 0px 50px 0px; color: #c5be9e;}
	ul#mainNav {list-style:none; margin:0px 0px 30px 0px; padding:0px;}
	ul#mainNav li {list-style:none; margin: 0px; padding: 0px; outline: none;}
	ul#mainNav li a {display: block; outline: none;}
		
		a.navHome {width: 250px; height: 35px; position: relative; margin-top: 390px; left: 0px; overflow: hidden; cursor: hand; font-size:16px;}
		
		a.navAbout {width: 250px; height: 35px; position: relative; margin-top: 0px; left: 0px; overflow: hidden; cursor: hand; font-size:16px;}		
		
		a.navWhat {width: 400px; height: 35px; position: relative; margin-top: 0px; left: 0px; overflow: hidden; cursor: hand; font-size:16px;}
		
		a.navExamples {width: 250px; height: 35px; position: relative; margin-top: 0px; left: 0px; overflow: hidden; cursor: hand; font-size:16px; }
		
		a.navLiens {width: 250px; height: 35px; position: relative; margin-top: 0px; left: 0px; overflow: hidden; cursor: hand; font-size:16px; }

		a.navContact {width: 250px; height: 35px; position: relative; margin-top: 0px; left: 0px; overflow: hidden; cursor: hand; font-size:16px; }

		a.navMentions {width: 250px; height: 35px; position: relative; margin-top: 0px; left: 0px; overflow: hidden; cursor: hand; font-size:16px; }
		
		a.navHome:hover, #mainNav a.navHome .hover, 
		a.navAbout:hover, #mainNav a.navAbout .hover, 
		a.navWhat:hover, #mainNav a.navWhat .hover,
		a.navExamples:hover, #mainNav a.navExamples .hover,
		a.navContact:hover, #mainNav a.navContact .hover {background-position:0px 0px;}
		#mainNav a:focus {outline: none;}
	.calloutPadding {padding:5px 0px 70px 25px;}
	ul.designCategories {margin:10px 0px; padding:0px; list-style-type:none;}
		ul.designCategories li {margin:0px; padding:3px 0px; list-style-type:none; border:1px dotted #2e2315;}
		ul.designCategories li a {padding:6px 20px; display:block; background: url('images/bullet.gif') no-repeat 4px 8px #2e2315; text-indent:20px;}
			ul.designCategories li a:hover, ul.designCategories li a:visited:hover, ul.designCategories li a:target {background:url('images/bulletover.gif') no-repeat 8px 8px #251c10;}
	
#rightZone2 {float:right; width:349px; margin:380px 0px 60px 0px; padding:0px 0px 50px 0px; color: #c5be9e;}
	
#leftZone {
	width: 805px;
	margin-top:25px;
	margin-left:185px;
	padding:0px 0px 80px 0px;
	font-size: 1.1em;
	color: #c5be9e;
	position:relative;
	z-index:101;
	top: -600px;
}

#leftZone2 {
	width: 710px;
	margin-top:0px;
	margin-left:260px;
	padding:0px 0px 80px 0px;
	font-size: 1.1em;
	color: #c5be9e;
	position:relative;
	z-index:101;
	top: -610px;
}

	p.stopthat a img, .tn {border:2px solid #130f09;}
		p.stopthat a:hover img, a:hover .tn {border:2px solid #30d2c3;}
	#comments textarea {width:500px;}
	
	.navigation {background:#2e2315; margin:5px 0px 50px 0px; padding:5px; overflow:auto;}
		#comments .navigation {background:#251c10; margin:5px 0px 10px 0px; padding:5px; overflow:auto;}
	.alignright {float:right; padding:5px;}
	.alignleft {float:left; padding:5px;}


#logo {width: 800px; height: 40px;	margin-top:805px; margin-left:180px; z-index: 99; bottom: 0px;}

/* home page */
#homepageboxframe {width:640px; height:522px; overflow: hidden; margin:0px 0px 10px -20px;}

#homepageboxframeG {width:980px; height:700px; overflow: hidden; margin:0px 0px 10px -20px;}

#homepageboxframe2 {width:640px; height:452px; overflow: hidden; background:url('images/manu.jpg') no-repeat top left; margin:0px 0px 10px -20px;}

#homepageboxframe3 {width:620px; height:300px; overflow: hidden; margin:20px 0px 0px 0px;}

#homepageboxframe4 {width:642px; height:540px; overflow: hidden; margin:0px 0px 10px -20px;}

#homepageboxframe5 {width:642px; height:520px; overflow: hidden; margin:0px 0px 10px -20px;}


#homepageboxframe7 {width:642px; height:320px; overflow: hidden; background:url('images/tab07.jpg') no-repeat top left; margin:20px 0px 10px -20px;}

	ul#jquerybox {margin:19px 0px 10px 15px; padding:0px; list-style-type:none;}
		ul#jquerybox li {margin:0px; padding:0px; list-style-type:none;}
		ul#jquerybox li h3 {margin:0px; padding:0px; text-indent:-999999px; height:0px;}
.homepageText {margin:5px 0px; padding:5px 0px; font-size:1.3em; line-height:1.7em;}

/* lightbox */
#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 1000; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url('images/prevlabel.gif') left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url('images/nextlabel.gif') right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 190; width: 100%; height: 500px; background-color: #000; }
