@charset "UTF-8";
/* CSS Document */

@font-face {
    font-family: 'LatoBlackItalic';
    src: url('/css/fonts/Lato-BlackItalic-webfont.eot');
    src: url('/css/fonts/Lato-BlackItalic-webfont.eot?iefix') format('eot'),
         url('/css/fonts/Lato-BlackItalic-webfont.woff') format('woff'),
         url('/css/fonts/Lato-BlackItalic-webfont.ttf') format('truetype'),
         url('/css/fonts/Lato-BlackItalic-webfont.svg#webfontWYxY3URr') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'LatoBlack';
    src: url('/css/fonts/Lato-Black-webfont.eot');
    src: url('/css/fonts/Lato-Black-webfont.eot?iefix') format('eot'),
         url('/css/fonts/Lato-Black-webfont.woff') format('woff'),
         url('/css/fonts/Lato-Black-webfont.ttf') format('truetype'),
         url('/css/fonts/Lato-Black-webfont.svg#webfont2vG1HO74') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'LatoBoldItalic';
    src: url('/css/fonts/Lato-BoldItalic-webfont.eot');
    src: url('/css/fonts/Lato-BoldItalic-webfont.eot?iefix') format('eot'),
         url('/css/fonts/Lato-BoldItalic-webfont.woff') format('woff'),
         url('/css/fonts/Lato-BoldItalic-webfont.ttf') format('truetype'),
         url('/css/fonts/Lato-BoldItalic-webfont.svg#webfontDnbove81') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'LatoBold';
    src: url('/css/fonts/Lato-Bold-webfont.eot');
    src: url('/css/fonts/Lato-Bold-webfont.eot?iefix') format('eot'),
         url('/css/fonts/Lato-Bold-webfont.woff') format('woff'),
         url('/css/fonts/Lato-Bold-webfont.ttf') format('truetype'),
         url('/css/fonts/Lato-Bold-webfont.svg#webfontQibrf0WF') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'LatoItalic';
    src: url('/css/fonts/Lato-Italic-webfont.eot');
    src: url('/css/fonts/Lato-Italic-webfont.eot?iefix') format('eot'),
         url('/css/fonts/Lato-Italic-webfont.woff') format('woff'),
         url('/css/fonts/Lato-Italic-webfont.ttf') format('truetype'),
         url('/css/fonts/Lato-Italic-webfont.svg#webfontOyyHRIea') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'LatoRegular';
    src: url('/css/fonts/Lato-Regular-webfont.eot');
    src: url('/css/fonts/Lato-Regular-webfont.eot?iefix') format('eot'),
         url('/css/fonts/Lato-Regular-webfont.woff') format('woff'),
         url('/css/fonts/Lato-Regular-webfont.ttf') format('truetype'),
         url('/css/fonts/Lato-Regular-webfont.svg#webfontHlqc3w9Z') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'LatoLightItalic';
    src: url('/css/fonts/Lato-LightItalic-webfont.eot');
    src: url('/css/fonts/Lato-LightItalic-webfont.eot?iefix') format('eot'),
         url('/css/fonts/Lato-LightItalic-webfont.woff') format('woff'),
         url('/css/fonts/Lato-LightItalic-webfont.ttf') format('truetype'),
         url('/css/fonts/Lato-LightItalic-webfont.svg#webfontaHyWEDzK') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'LatoLight';
    src: url('/css/fonts/Lato-Light-webfont.eot');
    src: url('/css/fonts/Lato-Light-webfont.eot?iefix') format('eot'),
         url('/css/fonts/Lato-Light-webfont.woff') format('woff'),
         url('/css/fonts/Lato-Light-webfont.ttf') format('truetype'),
         url('/css/fonts/Lato-Light-webfont.svg#webfontAnx2vAsJ') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'LatoHairlineItalic';
    src: url('/css/fonts/Lato-HairlineItalic-webfont.eot');
    src: url('/css/fonts/Lato-HairlineItalic-webfont.eot?iefix') format('eot'),
         url('/css/fonts/Lato-HairlineItalic-webfont.woff') format('woff'),
         url('/css/fonts/Lato-HairlineItalic-webfont.ttf') format('truetype'),
         url('/css/fonts/Lato-HairlineItalic-webfont.svg#webfontxvZLheVY') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'LatoHairline';
    src: url('/css/fonts/Lato-Hairline-webfont.eot');
    src: url('/css/fonts/Lato-Hairline-webfont.eot?iefix') format('eot'),
         url('/css/fonts/Lato-Hairline-webfont.woff') format('woff'),
         url('/css/fonts/Lato-Hairline-webfont.ttf') format('truetype'),
         url('/css/fonts/Lato-Hairline-webfont.svg#webfontkk2RXOOP') format('svg');
    font-weight: normal;
    font-style: normal;

}

::selection			{ background:#eaebff; /* Safari and Opera */ }
::-moz-selection  { background:#eaebff;   /* Firefox */ }


body { background-color:#ffebc6; background-image:url(/images/bg.jpg); background-repeat:repeat-x; margin: 0; padding: 0; padding-top: 10px; text-align: left; color:#525252; font-family:Tahoma, Geneva, sans-serif; font-size: 12px;}
		
.quote { color:#999; }		
		
#style2 {font: 24px 'LatoLight', Arial, sans-serif; color:#707070; }
.style3 {font: 20px 'LatoLight', Arial, sans-serif; color:#ff8315; }
#style3 {font: 20px 'LatoLight', Arial, sans-serif; color:#ff8315; }
.style4 {font: 20px 'LatoLight', Arial, sans-serif; color:#2c2c2c; }
#style4 {font: 20px 'LatoLight', Arial, sans-serif; color:#2c2c2c; }
.style5 {font: 18px 'LatoBold', Arial, sans-serif; color:#9095d4;}
.style5 a {font: 16px 'LatoRegular', Arial, sans-serif; color:#6166a3; text-decoration:none;}
.style5 a:hover {font: 16px 'LatoRegular', Arial, sans-serif; color:#9095d4; }
#style5 {font: 18px 'LatoBold', Arial, sans-serif; color:#9095d4;}
#style6 a {font: 11px 'LatoBold', Arial, sans-serif; color:#f78f1e; line-height:20px; text-shadow: 0px 1px 0px #FFF;}
#style6 a:hover {font: 11px 'LatoBold', Arial, sans-serif; color:#fdb261; line-height:20px; text-shadow: 0px 1px 0px #FFF;}
#style7 {font: 16px 'LatoRegular', Arial, sans-serif; color:#707070; }
#style8 {font: 28px 'LatoLight', Arial, sans-serif; color:#f78f1e; }

a { color: #f78f1e; text-decoration:none;}

a:hover { color: #fdb261;}

img {border:none;}

#container { width: 1024px; text-align:left; border: 0px; padding: 0; margin: 0 auto; 

}

#header { position:relative; width:978px; height:128px; margin-left:23px;}

#nav { position:relative; width:1022px; height:69px; z-index:100; background-image:url(/images/nav_bg.png); margin-top:-22px;}

#nav ul { list-style-type: none; padding-top:16px; margin-left:-14px;}

#nav ul li { display: inline; padding-left: 18px;}

#nav ul li a { display: inline; font: 21px 'LatoBlack', Arial, sans-serif; text-shadow: 0px 1px 0px #000; color:#FFF; text-decoration:none;}

#nav ul li a:hover { display: inline; font: 21px 'LatoBlack', Arial, sans-serif; text-shadow: 0px 1px 0px #000; color:#ffe2c9; text-decoration:none;}

#nav ul li#sub { padding-left:50px; }

#nav ul li#push { padding-right:50px; }

#main { position:relative; width:960px; margin-left:32px; margin-right:32px; z-index:1; }

#image-area { position:relative; margin-top:-9px; width:720px; height:455px; float:left; background-image:url(/images/main_bg.jpg)}

#steps { position:relative; margin-top:-9px; width:240px; height:455px; float:left; background-image:url(/images/side_bg.jpg); -moz-box-shadow: -2px 0px 2px #bbb; -webkit-box-shadow: -2px 0px 2px #bbb; box-shadow: -2px 0px 2px #bbb; }

.steps-content { height:auto; width: 220px; margin:0px 10px 10px 12px; padding-top:10px; background-image:url(/images/hairline.png); background-repeat:repeat-x; background-position:top; }

.steps-content p { padding: 0 10px 0 40px; margin:0px; line-height:14px;}

#content-area { position:relative; margin-top:-9px; width:960px; height:auto; background-image:url(/images/inner-bg.jpg); background-repeat:repeat-y;}

#inner-content { position:relative; float:left; width:720px; min-height:400px; height:auto;  }

#blank-content { position:relative; height:auto; margin-top:-9px; width: 960px; background-color:#fff; }

/*#view-all { background-color:#fee9d6; border: 5px solid #fee9d6; -moz-border-radius: 15px; -webkit-border-radius: 15px; width:200px; height:150px; margin:6px; vertical-align:middle; }*/

#blank-callouts { position:relative; float:left; width:220px; height:auto;margin-top:-9px; padding: 10px 10px 0 10px; }

/*#side-callouts { position:relative; margin-top:-9px; width:240px; height:100%; float:right; background-image:url(../images/side_bg.jpg); -moz-box-shadow: -2px 0px 2px #bbb; -webkit-box-shadow: -2px 0px 2px #bbb; box-shadow: -2px 0px 2px #bbb; }

#side-callouts-content { height:90px; width: 220px; margin:0px 10px 0px 12px; padding-top:10px; background-image:url(../images/hairline.png); background-repeat:repeat-x; background-position:top; }*/

#callouts { position:relative; width:960px; height:auto; padding-bottom:20px; float:left; background-color:#fff; border-bottom: 1px solid #d5d5d5; /*-moz-box-shadow: 0px -1px 2px #bbb; -webkit-box-shadow: 0px -1px 2px #bbb; box-shadow: 0px -1px 2px #bbb;*/}

#callouts { position:relative; width:960px; height:auto; padding-bottom:20px; float:left; background-color:#fff; border-bottom: 1px solid #d5d5d5; /*-moz-box-shadow: 0px -1px 2px #bbb; -webkit-box-shadow: 0px -1px 2px #bbb; box-shadow: 0px -1px 2px #bbb;*/}

#callouts ul {margin: 20px 0 0 -20px; list-style-type:none;}

#callouts ul li ul li { list-style-type:circle;}

#callouts ul li {width:220px;  padding-right: 20px; float:left; }

#callouts ul li#first {width:200px; padding-right: 20px;  float:left; }

#callouts ul li#double {width:440px; padding-right: 20px; float:left; }

#callouts ul li#double ul li {width:420px; padding-right: 40px; float:left; line-height:20px;}

#callouts ul li#double p ul li {width:420px; padding-right: 40px; float:left; line-height:20px;}

#callouts ul li#double p {line-height:20px; width:420px;}

#callouts a {font: 16px 'LatoRegular', Arial, sans-serif; color:#6166a3; text-decoration:none;}

#callouts a:hover {font: 16px 'LatoRegular', Arial, sans-serif; color:#9095d4; }

#comments p {line-height:20px;}

#main-shadow { position:relative; width:960px; height:32px; float:left; background-image:url(/images/content_shadow.png); }

#twitter { position:relative; width: 960px; height:auto; margin-left:32px; }

#twitter h1 a { display: inline; margin: 0 0 15px 0; font: 14px Arial, Sans-Serif; color: #434343; text-decoration: none; }

#twitter h1 a:hover { color: #fdb261; }    

#twitter ul { list-style: none; margin: 0; padding: 0; color:#525252;}

#twitter ul li { width:220px; display: inline; list-style-type: none; padding-right: 20px; float:left; }

#twitter ul li span { color: #525252; }

#twitter ul li span a { color: #f78f1e; font-weight:bold; text-decoration:none;}

#twitter ul li span a:hover { color: #fdb261;}

#twitter ul li a { color: #ccbda2; text-decoration:none;}

#twitter ul li a:hover { color: #7f745f; }

#footer { position:relative; width: 960px; height:auto; padding-bottom:20px; margin-left:32px; background-image:url(/images/hairline.png); background-repeat:repeat-x; background-position:top; padding-top:20px;}

#footer ul { list-style: none; margin: 0; padding: 0;}

#footer ul li { width:220px; display: inline; list-style-type: none; padding-right: 20px; float:left; }

#footer ul li ul { list-style: none; margin: 0; padding: 0;}
  
#footer ul li ul li { width:100px; display: inline; list-style-type: none; float:left; }

#footer ul li ul li#col1 { width:70px; display: inline; list-style-type: none; float:left; }

#legal { position:relative; width:960px; margin-left:32px; text-align:center;  background-image:url(/images/hairline.png); background-repeat:repeat-x; background-position:top; padding-top:20px; }

#bookshelf td {height:210px; width:240px; margin:0; padding:0; }

#shelfinfo { width:190px; position:relative; left:30px; top:18px; color:#fff;}

#shelfinfo a {font: 28px 'LatoBlack', Arial, sans-serif; color:#ffffff; text-decoration:none; text-shadow: 0px 1px 0px #000;}
#shelfinfo a:hover {font: 28px 'LatoBlack', Arial, sans-serif; color:#ffe2c9; text-shadow: 0px 1px 0px #000;}

#shelfbook img { margin-bottom:10px; }

#shelfbook1 img { margin-bottom:10px; margin-left:40px; }

#shelfbook2 img { margin-bottom:10px; margin-left:30px; }

#shelfbook3 img { margin-bottom:10px; margin-left:20px; }

#shelfbook4 img { margin-bottom:10px; margin-left:10px; }

#book { position:relative; margin-top:-9px; width:960px; height:455px; background-image:url(/images/book_bg.jpg)}

#pageflip {
	position:		absolute;
	top:			0px;
	left:			1px;
	height:			100%;
	width:			958px;
}

#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: #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:/images/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: 90; width: 100%; height: 455px; background-color: #000; }



li#facebook {
    width: 220px;
    overflow: hidden;
	list-style-type: none;
}


label {
  width: 130px;
  margin-right: 10px;
  float:left;
  text-align:left;
  margin-top:8px;
  font: 16px 'LatoLight', Arial, sans-serif; color:#707070; }
}

fieldset ul {list-style-type: none;}

fieldset li {list-style-type: none;}

form { border:none; }

fieldset {border:none; margin:0; padding:0; }

.textInput,textarea{  /* General style for my inputs when they're not highlighted */  
  background-color:#FFFFFF;
  
}

.inputHighlighted{  /* Highlighting style */
  background-color:#ecedf5;
}

input {outline:none; padding-left:10px;}

textarea {outline:none; padding: 10px 0 0 10px;}

#contactform li {margin-top:10px;}

#nav #sddm
{
	z-index: 30
	}

#nav #sddm li
{
	list-style: none;
	float: left;
	font: bold 14px arial}

#nav #sddm li a
{	display: block;
	text-decoration: none}

#nav #sddm li a:hover
{	background: none;}

#nav #sddm div
{	position: absolute;
	top:50px;
	visibility: hidden;
	background: #fff;
	margin: 0;
	padding: 0;
	border: 1px solid #d7d7d7;
	-moz-box-shadow: 0px 3px 6px #bbb; -webkit-box-shadow: 0px 3px 6px #bbb; box-shadow: 0px 3px 6px #bbb;}

#nav #sddm div a
{	position: relative;
	display: block;
	margin: 0;
	padding: 10px 20px;
	width: auto;
	white-space: nowrap;
	text-align: left;
	text-decoration: none;
	color: #6166a3;
	font: 14px tahoma;
	text-shadow:none;}

#nav #sddm div a:hover/**/
{	
	color: #9095d4;
	text-decoration:underline;}
	
	.stepcarousel{
position: relative; /*leave this value alone*/
border: none;
overflow: scroll; /*leave this value alone*/
width: 720px; /*Width of Carousel Viewer itself*/
height: 420px; /*Height should enough to fit largest content's height*/
}

.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}

.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 0px; /*margin around each panel*/
width: 720px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}