/* CSS Document for all 'wizard' styles */

#headerwrap .small {
	height:160px;
}
#headerwrap .big {
	height:500px;
}

h2,h3,h4,h5,h6 {
	margin:1em 0 .5em 0;
	padding:0;
	}
	
/* common wizard styles */
.wizardBox {
	position:relative;
	top:20px;
	width:816px;
}
	.wizardBox h2 {
		position: relative;
		top: 25px;
		font-size: 18px;
		font-family: 'century gothic', verdana, san-serif;
		font-weight: normal;
		color: #fff;
		letter-spacing: .1ex;
	}

	.wizardBox button, #framedetail {
		position: relative;
		height: 30px;
		width: 110px;
		border-width: 0;
		text-align: center;
		letter-spacing: 1px;
		font-size: 11px;
		background-color: transparent;
		background-image: url(img/button_multiple-trans.png);
		background-repeat: no-repeat;
		background-position: 0 0;
		padding-bottom: 5px;
		top: 10px;
	}
			
		#framedetail {
			top: 2px;
			left: 30px;
		}
		
		.wizardBox button:hover, .wizardBox button.buttonhover, #framedetail:hover {
			background-position: 0 -30px;
			color: #77f;
		}
				
		/* remove hover for purchase buttons unless specifically put in on correct email */
		.wizardBox button.disabled:hover, .wizardBox button.disabled {
				background-position: 0 0;
				color: #888;	
		}
			
		.backbutton {
			left: 35px;
		}
		.continuebutton {
			left: 550px;
		}
		.hidebutton {
			position: absolute;
			left: 655px;
			top: -25px;
		}
		#savebutton {
			top: 0;
			margin-bottom: 10px;
			left: 310px; /* 40px; */
			letter-spacing: 0;
		}
		#registrybutton {
			top:0;
			margin-bottom:10px;
			/* left:375px; */
			left: 265px;
			letter-spacing:0;
		}	
		#buybutton {
			top:0;
			margin-bottom:10px;
			/* left:443px; */
			left:333px;
			letter-spacing:0;
		}	
		.wizardBox button span {
			font-size:18px;
		}

#select_letter .smallbutton, #select_filter .smallbutton, #select_filter #dlg_prevbutton {
	background-color:transparent;
	background-image:url(img/button_multiple_small-trans.png);
	background-repeat:no-repeat;
	background-position:0 0;
	height:20px;
	width:73px;
	border-width:0;
	position:relative;
	font-size:10px;
	letter-spacing:1px;
	padding-bottom:2px;
	margin-left:10px;	
}
	#select_letter .smallbutton:hover, #select_filter .smallbutton:hover {
		background-position:0 -20px;
		color:#77f;
	}
	#select_letter .filter {
		margin-right:60px;
	}
	#select_letter #dlg_prevbutton {
		position:absolute;
		left:282px;
	}
	#select_letter #dlg_nextbutton {
		position:absolute;
		left:400px;
	}
	
	#select_letter #dlg_pagenum {
		position:absolute;
		left:560px;
		top:23px;
	} 	

.frame, .mat, .letters {
	position:relative;
	margin:0;
	line-height:.1;
	}

	.letters img {
	    border:2px solid #000;	/* default until changed */ 
		 margin:0;
		 padding:0;      
	}
	 
		.letters img.space {
			width:35px;
			border:none;
			margin:0;
			padding:0;
		}
	
.mat {
	padding:30px;
	background-color:#fff; /* default until changed */
	}
	
.frame {
	left:25px;
	padding:24px;
	z-index:999;
	background-position:left top;
	background-repeat:no-repeat;
}

	.frameright {
		position:relative;	
		background-position:left top;
		background-repeat:no-repeat;
		z-index:999;
		height:175px;
		width:40px;
		margin:-138px -40px 0 0; 
		float:right;	
	}

.wizardBox hr {
	margin:0 10px;
	color:#333;
	background-color:#333;
}
.wizardBox label {
	display:block;
	position:relative;
	left:25px;
	font-size:11px;
	margin-top:20px;
}

#wizardBox form {
	margin:10px 0 25px 0;
}

.wizardBox select {
	margin:0 0 25px 25px;
}	
	.wizardBox .topOf h2 {
		position:relative;
		top:0;
		left:25px;
	}
	
	.wizardBox .topOf .top_par {
		position:relative;
		color:#fff;
		font-size:14px;
		margin-top:-10px;
		left:25px;
	}
	.wizardBox .topOf .top_ol {
		color:#fff;
		font-size:12px;
		padding:0;
		margin:5px 15px 15px;
		position:relative;
		left:25px;
		width:700px;
	}

#wizard_pane_2, #wizard_pane_3, #wizard_pane_4, #wizard_pane_5 {display:none;}

/* pane specific styles, may match more than one pane */

#wizard_pane_1 {
	position:relative;
	top:0;	
	height:160px;
	width:600px;
	background:url(img/step_BAK.png) 156px 47px no-repeat;	
	}
	#wizard_pane_1 #headgraphic {
		position:absolute;
		left:35px;
		top:5px;
		z-index:999;
		}	
	#wizard_pane_1 h2 {
		position:relative;
		left:170px;	
		}
	#wizard_pane_1 form h3 {
		position:absolute;
		color:#000;
		font-family:'century gothic', verdana, san-serif;
		font-size:24px;
		font-weight:normal;
		position:relative;
		left:195px;
		top:16px;
		width:100px;
		height:30px;	
		}		
	#wizard_pane_1 input#textin {
		position:absolute;
		left:280px;
		top:61px;
		width:140px;
		height:20px;
		font-size:12px;
		letter-spacing:1px;
		font-family:arial, verdana, san-serif;
		border:1px solid #000;
	}
		
	#wizard_pane_1 button {
		position:absolute;		
		top:58px;
		left:440px;
		padding-bottom:0;	
	}
	
	#wizard_pane_1 a {
		position:absolute;
		text-decoration:none;
		color:#000;
		font-size:12px;
		height:30px;
		width:110px;
		background-image:url(img/button_multiple-trans.png);
		background-repeat:no-repeat;
		background-position:0 0;
		top:65px;
		left:440px;
		text-align:center;
		line-height:30px;
		letter-spacing:1px;
	}
		#wizard_pane_1 a:hover {
			
		}
	#wizard_pane_1 #status {
		position:absolute;
		left:190px;
		top:104px;
		font-weight:bold;
		z-index:999;
	}

	#mat_wiz2, #mat_wiz3 {
		margin:30px;
	}
	
	#wizard_pane_4 form {
		padding-bottom:25px;
	}
	#wizard_pane_4 input, #wizard_pane_4 select {
		display:inline;
		margin:0 0 0 25px;
	}
	
	#frametype {width:135px;}
	#framecolor {width:120px;}
	
	#wizard_pane_4 .mat {
		border: 1px dashed #000; /* default on start */
	}

	#wizard_pane_5 form {
		margin-top:15px;
	}

	form label {margin-bottom:10px;}	
	
	#framedetail {
		display:block;
		height:27px;
		color:#000;
		text-decoration:none;
		line-height:27px;
		margin-left:315px;
		margin-top:-36px;	
	}
	
	.wizardBox span.pricing {
		float:left;
		font-size:12px;
		color:#fff;		
	}
	#wizard_pane_3 span.pricing {		
		margin:-45px 0 0 150px;
	}
		.wizardBox span.pricing span {
			font-weight:bold;
		}
	#wizard_pane_4 span.pricing {
		margin:-20px 0 20px 440px;
	}
	#wizard_pane_5 span.pricing {
		margin:-35px 0 20px 40px; /* left was 200px */
	}	
		
	hr.divider {clear:both;}
	
	
/* letter dialog styles */ 

#opacScreen {
	width:100%;
	height:150%;
	background-color:#000;
	visibility:hidden;
	position:absolute;
	top:0px;
	left:0px;
}

#dialog_wrapper {
	position: absolute;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
	z-index: 0;
	visibility:hidden;
}

#select_letter {
	position: relative;
	margin: auto;
	top: 300px;
	width:650px;
	padding: 15px;
	z-index: 0;
	background-color: #ccc;
	border: 1px solid #666;
	visibility:hidden;
}

#filterform {
	font-size:1em;
	}
	
#filterform select {
	font-size:1em;
	margin-left:30px;
	margin-right:30px;
	}
	#filterform #filtertype {
		width: 75px;
	}
	#filterform #filter {
		width: 200px;
	}
	#filterform fieldset {
		padding: 10px;
		margin: 10px;
		}
			
/* tooltip styles */

.tooltipShadow {
    background-color: #666;
    visibility: hidden;
 }

 .tooltipContent {
    left: -4px; top: -4px;        /* how much of the shadow shows */
    background-color: #fff;       /* yellow background */
    border: solid black 1px;      /* thin black border */
    padding: 5px;                 /* spacing between text and border */
    font: bold 10pt sans-serif;   /* small bold font */
    width: 200px;
 }

/* stuff for wholesale version only */

fieldset#datacollection {
	position: relative;
	width: 390px;
	margin: 0px 0 20px 40px;
	top: -30px;
	border-width: 0;
	padding: 0;
}
	#datacollection p {
		margin: 0 0 15px 0;
	}
	#datacollection label {
		font-weight: bold;
		display: inline;
		left: 0;
		margin: 0 10px 0 0;
		padding: 0;
	}
	#datacollection input {
		margin: 0 0 0 5px;
		/* width: 100px; */
	}
	#datacollection input#data_email {
		width: 160px;
	}
	#datacollection input#data_phone {
		width: 85px;
	}
	

#whochooses {
	position: relative;
	left: 570px;
	top: -38px;
	display: none;
}
	#whochooses label {
		display: block;
		margin: 0;	
	}
	#whochooses input {
		margin: 0 10px;
	}
p#imagenames {
	display: none;
}