@charset "utf-8";
body  {
	margin: 0px;
	text-align: left; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
	background-color: #a7a7a7;
	font-family: Trebuchet MS, verdana, arial;
	font-weight: 100;
	background-repeat: repeat-x;
	padding: 0px;
	background-image: url(myimages/backgmain.jpg);
}
.twoColFixRtHdr #container {
	width: 1015px; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
	border-left: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
	background-color: #a7a7a7;
	background-image: url(myimages/backgmain.jpg);
	background-repeat: repeat-x;
	padding: 0px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background-position: 0px -120px;
		} 
.twoColFixRtHdr #footer h1 {
	margin: 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	font-size:12px;
	color: #000000;
	font-weight: 100;
	padding-top: 2px;
	padding-right: 0;
	padding-bottom: 2px;
	padding-left: 15px;
	text-align:left;
}
.twoColFixRtHdr #header {
	height: 190px;
	background-attachment: scroll;
	padding: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #cccccc;
	background-color: #000;
	background-image: url(myimages/banner.jpg);
	background-repeat: no-repeat;
	margin-top: 0px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 0px;
	max-width: 1005px;
} 
.twoColFixRtHdr #header h1 {
	color: #a7a7a7;
	margin: 0px;
	font-size: 16px;
	font-weight: 100;
	vertical-align: bottom;
	padding-top: 163px;
	text-align: right;
	padding-right: 10px;
}
.twoColFixRtHdr #sidebar1 {
	float: right; /* since this element is floated, a width must be given */
	width: 140px; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 0px 0px;
	border-top: 1px solid #CCCCCC;
}
.twoColFixRtHdr #mainContent {
	margin: 0px 140px 0 0; /* the right margin on this div element creates the column down the right side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	border-right: 1px solid #CCCCCC;
	border-top: 1px solid #CCCCCC;
	padding-top: 0px;
	margin-top: -1px;
	min-height: 550px;
} 
.twoColFixRtHdr #footer {
	padding: 0 10px 0 0px;
	border-top: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
} 
.twoColFixRtHdr #footer p {
	margin: 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	font-size:12px;
	color: #000000;
	font-weight: 100;
	padding-top: 2px;
	padding-right: 0;
	padding-bottom: 2px;
	padding-left: 15px;
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}


/* SpryTabbedPanels.css - Revision: Spry Preview Release 1.4 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* This is the selector for the main TabbedPanels container. For our
 * default style, this container does not contribute anything visually,
 * but it is floated left to make sure that any floating or clearing done
 * with any of its child elements are contained completely within the
 * TabbedPanels container, to minimize any impact or undesireable
 * interaction with other floated elements on the page that may be used
 * for layout.
 *
 * If you want to constrain the width of the TabbedPanels widget, set a
 * width on the TabbedPanels container. By default, the TabbedPanels widget
 * expands horizontally to fill up available space.
 *
 * The name of the class ("TabbedPanels") used in this selector is not
 * necessary to make the widget function. You can use any class name you
 * want to style the TabbedPanels container.
 */
.TabbedPanels {
	float: left;
	clear: none;
	width: 810px; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/
	margin-left: 10px;
	margin-top: -1px;
	margin-right: 10px;
	padding-top: 0px;
	padding-right: 0px;
	padding-left: 0px;
	padding-bottom: 5px;
	height: 900px;
}
.TabbedPanelsTabGroup {
	margin: 0px;
	padding: 0px;
}
.TabbedPanelsTab {
	position: relative;
	top: 1px;
	float: left;
	margin: 0px 1px 0px 0px;
	list-style: none;
	border-left: solid 1px #CCCCCC;
	border-bottom: solid 1px #CCCCCC;
	border-right: solid 1px #CCCCCC;
	-moz-user-select: none;
	-khtml-user-select: none;
	cursor: pointer;
	font-family: "trebuchet MS", Verdana, Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #FFFFFF;
	padding-left: 8px;
	padding-right: 8px;
	padding-top: 6px;
	padding-bottom: 4px;
}
.TabbedPanelsTabHover {
	background-color: #ddd;
	color: #333333;
}
.TabbedPanelsTab:focus {
	outline:none;
}
.TabbedPanelsTabSelected {
	border-bottom: 1px solid #CCCCCC;
	color: #FFFFFF;
	background-color: #6e6e6e;}


/* This is the selector for the ContentGroup. The ContentGroup container houses
 * all of the content panels for each tabbed panel in the widget. For our
 * default style, this container provides the background color and borders that
 * surround the content.
 *
 */
.TabbedPanelsContentGroup {
	clear: both;
	border-left: solid 1px #CCCCCC;
	border-bottom: solid 1px #CCCCCC;
	border-right: solid 1px #CCCCCC;
	border-top: solid 1px #CCCCCC;
	height: 850px;
}
.TabbedPanelsContent {
	width: 800px;
	height: 840px;
	padding-top: 10px;
	padding-right: 4px;
	padding-bottom: 0px;
	padding-left: 4px;
}

/* This selector is an example of how to change the appearnce of the currently
 * active container panel. The class "TabbedPanelsContentVisible" is
 * programatically added and removed from the content element as the panel
 * is activated/deactivated.
 */
.TabbedPanelsContentVisible {
	height: 840px;

}

p {
	margin-bottom: 0px;
	padding-bottom: 0px;
}

a:link {
	text-decoration: none;
	font-weight:bold;
	color: #FFFFFF;
}
a:visited {
	text-decoration: none;
	color: #FFFFFF;
		font-weight: bold;
}
a:hover {
		text-decoration: none;
color: #cccccc;
		font-weight: normal;
}
a:active {
		text-decoration: none;
color: #999999;
	font-weight: normal;

}

a:focus {
	text-decoration: none;
outline:none;
}
img {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #666666;
	border-right-color: #0f0f0f;
	border-bottom-color: #0f0f0f;
	border-left-color: #666666;
}
/*these classes apply to specific elements within different divs*/

.twoColLiqRtHdr #sidebar1 h3, .twoColLiqRtHdr #sidebar1 p {
	margin-left: 0px; /* the left and right margin should be given to every element that will be placed in the side columns */
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	padding-bottom: 10px;
	padding-left: 0px;
}


/*this stuff is in the tabbed panels content*/

.mainpageimage {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #666666;
	border-right-color: #0f0f0f;
	border-bottom-color: #0f0f0f;
	border-left-color: #666666;
	width: 790px;
	height: 180px;
	margin-bottom: 10px;
}
.mainpageimagevertcanv {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #666666;
	border-right-color: #0f0f0f;
	border-bottom-color: #0f0f0f;
	border-left-color: #666666;
	height: 790px;

}
.mainpageimagevert {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #666666;
	border-right-color: #0f0f0f;
	border-bottom-color: #0f0f0f;
	border-left-color: #666666;
	width: 184px;
	height: 790px;
	margin-bottom: 10px;
	position: relative;
	left: 150px;
	float: left;
	top: 10px;
}
.mainpageimagecanv {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #666666;
	border-right-color: #0f0f0f;
	border-bottom-color: #0f0f0f;
	border-left-color: #666666;
	margin-top: 10px;
	}


.navbutt {
	border: none;
	float: right;
	position: relative;
	bottom: -330px;
}
.prevnavbutt {
	border: none;
	float: left;
	position: relative;
	bottom: -330px;

}
.mainpageimage:link {
	border: 1px solid #12222C;
}
.mainpageimagevert:hover {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #999999;
	border-right-color: #333333;
	border-bottom-color: #333333;
	border-left-color: #999999;
}
.mainpageimage:hover {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #999999;
	border-right-color: #333333;
	border-bottom-color: #333333;
	border-left-color: #999999;
}
.mainpageimage:active {
	border: 1px solid #FFFFFF;
}

.lightboxpurchase {
	float: right;
	border: none;
	position: relative;
	left: 0px;
}


.tabbedpurchaselink {
	border: none;
	position: relative;
	top: 218px;
	left: -20px;
	z-index: 200;
}

.tabbedpanelstext {
	font-size: 14px;
	color: #FFFFFF;
	padding-left: 450px;
	padding-top: 175px;
	padding-right: 175px;
}

/*This stuff is specifically for the questions page, not for the image pages */

.tabbedpanelquestions {
	margin-bottom: 14px;
	color: #FFFFFF;
	margin-top: 0px;
	font-size: 14px;
	padding-left: 5%;
	padding-right: 5%;
}
li {
	color: #000000;
	margin-top: 0px;
	padding: 0px;
	margin-left: 40px;
	margin-bottom: 0px;
}

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

#outerImageContainer{ position: relative; background-color: #000; width: 250px; height: 250px; margin: 0 auto; border-top: solid 1px #fff;border-right: solid 1px #fff;border-left: solid 1px #fff;}
#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(lightbox/images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(lightbox/images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 12px "trebuchet MS", Verdana, Arial, sans-serif; color: #ccc; background-color: #000; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; border-bottom: solid 1px #fff; border-right: solid 1px #fff; border-left: solid 1px #fff;}

#imageData{padding:0 10px; color: #ccc; }
#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: 90;
	background-color: #a7a7a7;
	background-image: url(myimages/backgmain.jpg);
	background-repeat: repeat-x;
	max-width:1680px;
}
.intro {
	font-size: 16px;
	color: #FFFFFF;
	max-width:750px;
	margin-right: 30%;
}
html { 
overflow: scroll; 
} 

/* 
  -----------------------------------
  Accordion Panel Magic
  by Project Seven Development
  www.projectseven.com
  Style Theme: 01 - Carbon
  -----------------------------------
*/

.p7AB {
	padding: 0px;
	font-family: "trebuchet MS", Verdana, Arial, sans-serif;
}

.p7ABtrig {
	margin: 0;
	padding: 0;
}
.p7ABtrig h3, .p7ABtrig h4 {
	margin: 0;
	padding: 0;
	font-size: 15px;
}
#p7ABW1 .p7ABtrig a, #p7ABW2 .p7ABtrig a,
#p7ABW3 .p7ABtrig a, #p7ABW4 .p7ABtrig a,
#p7ABW5 .p7ABtrig a, #p7ABW6 .p7ABtrig a,
#p7ABW7 .p7ABtrig a, #p7ABW8 .p7ABtrig a,
#p7ABW9 .p7ABtrig a, #p7ABW10 .p7ABtrig a {
	display: block;
	text-decoration: none;
	padding: 4px 8px 4px 18px;
	color: #FFFFFF;
	font-weight: normal;
	border-bottom: 1px solid #CCCCCC;
}

#p7ABW1 .p7ABtrig a:hover, #p7ABW2 .p7ABtrig a:hover,
#p7ABW3 .p7ABtrig a:hover, #p7ABW4 .p7ABtrig a:hover,
#p7ABW5 .p7ABtrig a:hover, #p7ABW6 .p7ABtrig a:hover,
#p7ABW7 .p7ABtrig a:hover, #p7ABW8 .p7ABtrig a:hover,
#p7ABW9 .p7ABtrig a:hover, #p7ABW10 .p7ABtrig a:hover {
	color: #333333;
	background-color:#ddd;
	}
.p7ABtrig a:active, .p7ABtrig a:focus {
	outline: none;
}
#p7ABW1 .p7ABtrig .p7ABtrig_down, #p7ABW2 .p7ABtrig .p7ABtrig_down,
#p7ABW3 .p7ABtrig .p7ABtrig_down, #p7ABW4 .p7ABtrig .p7ABtrig_down,
#p7ABW5 .p7ABtrig .p7ABtrig_down, #p7ABW6 .p7ABtrig .p7ABtrig_down,
#p7ABW7 .p7ABtrig .p7ABtrig_down, #p7ABW8 .p7ABtrig .p7ABtrig_down,
#p7ABW9 .p7ABtrig .p7ABtrig_down, #p7ABW10 .p7ABtrig .p7ABtrig_down {
	color: #ffffff;
	letter-spacing: 0.1em;
	font-weight: bold;
	background-color: #6e6e6e;}
.p7ABcontent {
	font-size: 14px;
	color: #FFFFFF;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
	border-bottom: 1px solid #CCCCCC;
}
.p7ABcontent a:link{
font-weight:normal;
}
.p7ABcontent a:visited{
font-weight:normal;
}

.p7ABcontent a:hover{
font-weight:bold;
}
.p7ABcontent a:active{
font-weight:bold;
}
.p7ABcontent h2, .p7ABcontent h3, 
.p7ABcontent h4 {
	font-size: 14px;
	color: #FFFFFF;
	margin: 0px;
	line-height: normal;
	letter-spacing: 0.1em;
}
.p7ABcontent p {
	margin: 6px 0 12px 0;
}
.p7ap_currentmark {
	font-weight: bold;
}
.twoColFixRtHdr #mainContent .textpage {
	margin-top: 75px;
	margin-right: 100px;
	margin-left: 100px;
	color: #FFFFFF;
}
.twoColFixRtHdr #mainContent  .TabbedPanelsContentGroup .navbutts {
	position: relative;
	top: 0px;
}
.slideshowbox {
	width: 611px;
	height: 156px;
	background-color: #D4D0C8;
	background-image: url(myimages/backgmain.jpg);
	background-repeat: repeat-x;
	background-position: -250px;
	padding: 10px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #666666;
	border-right-color: #0f0f0f;
	border-bottom-color: #0f0f0f;
	border-left-color: #666666;
	position: relative;
}
h1 {
	font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
	font-size: 16px;
	font-weight: 700;
	color: #FFFFFF;
	text-align: center;
	padding-bottom: 0px;
}


.slide {
	position: absolute;
}

.slideimg {
	width: 600px;
	background-color: #000000;
	background-image: url(myimages/backgmain.jpg);
	background-repeat: repeat-x;
	background-position: -200px;
	margin-top: 2px;
	margin-left: 4px;
}
.tabbedpanelstextdiv {
	margin-left: 100px;
	margin-right: 100px;
}



.VTabbedPanels .TabbedPanelsTabGroup {
	float: right;
	width: 80px;
	height: 100px;
	position: relative;
	top: -11px;
	right: -5px;
	z-index: 4;
}

/* This selector disables the float property that is placed on each tab button
 * by the default TabbedPanelsTab selector rule above. It also draws a bottom
 * border for the tab. The tab button will get its left and right border from
 * the TabGroup, and its top border from the TabGroup or tab button above it.
 */
.VTabbedPanels .TabbedPanelsTab {
	float: none;
	margin: 0px;
	padding-top:3px;
	padding-bottom:3px;
  	border-left: solid 1px #CCCCCC;
	border-bottom: solid 1px #CCCCCC;
	border-right: solid 1px #CCCCCC;
}

/* This selector disables the float property that is placed on each tab button
 * by the default TabbedPanelsTab selector rule above. It also draws a bottom
 * border for the tab. The tab button will get its left and right border from
 * the TabGroup, and its top border from the TabGroup or tab button above it.
 */
.VTabbedPanels .TabbedPanelsTabSelected {
	border-bottom: solid 1px #999;
}

/* This selector floats the content panels for the widget so that they
 * render to the right of the tabbed buttons.
 */
.VTabbedPanels .TabbedPanelsContentGroup {
	clear: none;
	float: right;
	padding: 0px;
	width: 800px;
	border: none;
	position: relative;
	top:-100px;
}


.VTabbedPanels .mainpageimagevertcanv {
		z-index: 50;

}
.VTabbedPanels .TabbedPanelsContent {
	
	width: 800px;
	padding-top: 10px;
	padding-right: 4px;
	padding-bottom: 0px;
	padding-left: 4px;
}

.VTabbedPanels .tabbedpanelstext {
	position: relative;
	left: -4px;
	padding-right: 180px;
}

.vertbuyform {
	position: relative !important; 
	left: 350px !important;
	top: 150px;
	margin-left: -50px;
	}
/* This selector is an example of how to change the appearnce of the currently
 * active container panel. The class "TabbedPanelsContentVisible" is
 * programatically added and removed from the content element as the panel
 * is activated/deactivated.
 */
.VTabbedPanels .TabbedPanelsContentVisible {

}
.VTabbedPanels .navbutt {
	margin-top: -10px;
	margin-right: 4px;
		z-index: 4;
}
	
.VTabbedPanels .prevnavbutt {
	margin-top: -10px;
	margin-left: -4px;
		z-index: 4;
}
	
.VTabbedPanels .tabbedpurchaselink {
	margin-top: -10px;
	z-index: 200;
	}
	
			

.zoomvert span {
display:none;
}
.zoomvert a:hover span {
	display: block;
	position: absolute;
	top:775px;
	color: #333333;
	left: 158px;
	
}

.zoomvert{
	position: relative;
	right: 00px;
	top: -20px;


}


.zoomvertcanv span {
display:none;
}
.zoomvertcanv a:hover span {
	display: block;
	position: relative;
	top:-300px;
	color: #333333;
	left:310px;
	
}

.zoomvertcanv {
margin-bottom: 10px;
	position: relative;
	left: 100px;
	float: left;
	top: -10px;


}
.VTabbedPanels .zoomvertcanv span {
display:none;
}
.VTabbedPanels .zoomvertcanv a:hover span {
	display: block;
	position: relative;
	top:-350px;
	color: #333333;
	left:310px;
	
}

.VTabbedPanels .zoomvertcanv {

z-index:50;

}
.IE5warning {
display:none;
}
	

.discountvisib a:hover img {
display:none;
}

.discountvisib span {
display:none;
 }
 

.discountvisib  {
font-color: #fff;
}
.discountvisib:hover span {
	display: block;
	color:#000;
	font-weight:normal;
	border:solid thin #333;
	background-color:#bcbcbc;
	background-image: url(myimages/backgmaingreen.jpg);
	background-repeat: repeat-x;
	position: absolute;
top: -500px;
left: -600px;
	margin-bottom: -348px;
	padding: 20px;
	z-index: 1000;
		width: 700px;
		font-size:14px;
		
}


.discountvisib {
	left: 760px;
	bottom: 21px;
	position: relative;
	text-align: left;
	width: 370px;
	font-size: 14px;
}


.discountvisib a {
	font-color: #000000;
}


.display1{
	position: relative;
	left:200px;
}
	.display1 a span{
	display:none;
}
	.display1 a:hover span {
	display:block;
		display:inline;
	}
		.display1 a:hover img{
	z-index: 200;
	position: relative;
	left: -0px;	}
	
.display2{
	position: relative;
	left: 200px;
}

.display2 a span{
	display:none;
}
	.display2 a:hover span {
	display:block;
	display:inline;
	}
		.display2 a:hover img{
	z-index: 200;
	position: relative;
	left: 0px;	}

.display3{
	position: relative;
	left: 200px;
}
	.display3 a span{
	display:none;
}
	.display3 a:hover span {
	display:block;
			display:inline;

	}
		.display3 a:hover img{
	z-index: 200;
	position: relative;
	left: 0px;
	
}