/*
    AUTHOR: David Dulak
            david@redskycreative.com
*/

/*** *** *** Important for Cross-Browser Compatibility *** *** ***/
div {
-moz-box-sizing: border-box;
box-sizing: border-box;
}

/* ------------------------------------------ */
/* RESETS, BASIC PAGE SETUP, BASIC TYPOGRAPHY */
/* ------------------------------------------ */
* { margin: 0; padding: 0; }
html { overflow-y: scroll; }
body { font-size:87%;font-family:serif; }
ul { list-style: none inside; }
p { font: 1.3em/1.3em; /* margin-bottom: 1.3em; */ }
a { outline: none; }
a img { border: none; }
/* END RESET */

/* ------------------------------------------ */
/* TOOLBOX CSS */
/* ------------------------------------------ */
.floatleft { float: left; }
.floatright { float: right; }
.clear { clear: both; }
.clear br{ display: none; }
.transpBlack { background: url(../images/transpBlack.png); }
/* END TOOLBOX */

/* ------------------------------------------ */
/* PAGE STRUCTURE */
/* ------------------------------------------ */
body{
  background: url(../images/concrete.jpg);
}
#container{
  width:930px;
  margin-left:auto;
  margin-right:auto;
  background: url(../images/page-shadow.png);
}
#containerInner{
  width:900px;
  margin-left:15px;
  margin-right:15px;
}
#header{
  background: url(../images/header.jpg) no-repeat top left;
  width:900px;
  height:237px;
  position:relative;
}
#logo{
  width:250px;
  height:237px;
  position:absolute;
  left:10px;
}
#tagline{
  width:550px;
  height:237px;
  position:absolute;
  right:10px;
}
#navigation{
  background: url(../images/navigation.jpg) no-repeat top left;
  width:900px;
  height:37px;
}
#navigation ul{
  padding-top:12px;
  padding-left:10px;
}
#navigation a{
  color:#FFFFFF;
  text-decoration:none;
  font-size:15px;
}
#navigation li{
  display:inline;
  background-image:url(../images/navDivider.gif);
  background-repeat:no-repeat;
  background-position:middle left;
  padding-left:20px;
  margin-left:5px;
}
#navigation li.firstLi{
  display:inline;
  background-image:none;
}
#subNavigation{
  background: url(../images/subNavigation.jpg) no-repeat top left;
  width:900px;
  height:27px;
}
#subNavigation ul{
  padding-top:7px;
  padding-left:10px;
}
#subNavigation a{
  color:#FFFFFF;
  text-decoration:none;
  font-size:13px;
}
#subNavigation li{
  display:inline;
  background-image:url(../images/navDivider.gif);
  background-repeat:no-repeat;
  background-position:middle left;
  padding-left:20px;
  margin-left:5px;
}
#subNavigation li.firstLi{
  display:inline;
  background-image:none;
}
#body{
  background: url(../images/bodyTop.gif) no-repeat top left;
}
#bodyInner{
  background: url(../images/bodybottom.gif) no-repeat bottom right;
  position: relative;
}
#content{
  padding:30px 35px 30px 35px;
  line-height:150%;
  color:#333;
}
#content h1{
  font-weight:normal;
  margin-bottom:10px;
  letter-spacing:1px;
  color:#436622;
}
#content p{
  margin-top:9px;
  margin-bottom:9px;
}
#content h2{
  font-weight:normal;
  font-size:24px;
  letter-spacing:1px;
  color:#436622;
  text-align:center;
}
#content h2 img{
  vertical-align:middle;
}

.draggable {
	z-index: 5000;
	cursor: move;
}
.card {
	position: absolute;
}
.card-1 {
	top: 65px;
	left: 100px;
}
.card-2 {
	top: 65px;
	left: 200px;
}
.card-3 {
	top: 65px;
	left: 400px;
}
.card-4 {
	top: 65px;
	left: 500px;
}



#dragInstructions{
  margin-left:auto;
  margin-right:auto; 
  font-size:15px;
  padding-top: 290px;
  text-align: center;
}
#footer{
  background: url(../images/footer.png) no-repeat top left;
  width:930px;
  margin-left:auto;
  margin-right:auto;
  height:55px;
  position:relative;
  color:#FFFFFF;
}
	#footer ul{
	  position:absolute;
	  top:8px;
	  left:20px;
	}
	#footer ul li{
	  display:inline;
	  height:16px;
	  margin-left:16px;
	}
#credits{
  width:930px;
  margin-left:auto;
  margin-right:auto;
  margin-top:15px;
  height:55px;
  /* position:relative; */
  clear:both;
  color:#444444;
  font-size:11px;
  font-family:verdana;
  text-align:center;
}
#credits a{
   color:#444444;
   text-decoration:none;
}
#credits a:hover{
   color:#444444;
   text-decoration:underline;
}

		#portfolio, #portfolio ul{
		  list-style-position: none;
		  list-style-image: none;
		  list-style: none inside;
		  padding-top:0px;
		  float:right;
		  width:360px;
		  margin-left:25px;
		}
		
		#portfolio li{
		  margin-top:10px;
		  margin-left:10px;
		  float:left;
		}
		
		#portfolio img{
		  width:70px;
		  height:70px;
		  overflow:hidden;
		  border-color:#dddddd #888888 #888888 #dddddd;
		  border-width:1px;
		  border-style:solid;
		  padding:8px;
		}
/* END STRUCTURE */


.productImage{
  float:left;
  margin-top:15px;
  margin-right:15px;
  margin-bottom:20px;
}
.productDescription{
  margin-top:15px;
  float:left;
}

iframe{
  border:2px solid #552511;
}
  ul.list{
    list-style-position: outside;
    list-style-image: url(../images/bullet.gif);
    margin-bottom:15px;
  }
  .list li{
    margin-left:35px;
  }
.emphasize{
  font-size:18px;
  color:#c05b0a;
  letter-spacing:1px;
}
.imageRight{
  float:right;
}
.phone{
  padding-left:23px;
  background-image:url(../images/phone.png);
  background-position:0px 0px;
  background-repeat:no-repeat; 
}
.address{
  padding-left:25px;
  background-image:url(../images/house.png);
  background-position:0px 0px;
  background-repeat:no-repeat; 
}
.address a{
  text-decoration:none;
  color:#FFFFFF;
}
.address a:hover{
  text-decoration:underline;
  color:#FFFFFF;
}
.email{
  padding-left:25px;
  background-image:url(../images/email.png);
  background-position:0px 0px;
  background-repeat:no-repeat; 
}
.email a{
  text-decoration:none;
  color:#FFFFFF;
}
.email a:hover{
  text-decoration:underline;
  color:#FFFFFF;
}



/* ------------------------------------------ */
/* FORM CLASSES */
/* ------------------------------------------ */
.error{
  color:red;
}
.required {
  color:red;
  font-weight:bold;
}
.formTitle {
	font : 18px verdana, helvetica, arial, geneva, sans-serif;
	text-decoration:none;
        font-weight:normal;
        color:#ec5c3a;
        padding-bottom:20px;
}
.formSubTitle {
	font : 14px verdana, helvetica, arial, geneva, sans-serif;
	text-decoration:none;
        font-weight:bold;
        color:#ec5c3a;
        padding-top:10px;
        padding-bottom:10px;
}
.formLeft {
	text-align:right;
	vertical-align:top;
}
.formRight {
	text-align:left;

}
.formViewLeft {
	text-align:right;
	font-weight:bold;
}
.formViewRight {
	text-align:left;
        background-color:#EEEEEE;
}
.formTable textarea {
	font : 11px verdana, helvetica, arial, geneva, sans-serif;
	border : 1px solid #666;
	padding : 2px;
	background : #F8F8F8;
}
.formTable input.submit {
	font : 11px verdana, helvetica, arial, geneva, sans-serif;
	padding : 2px;
	color : #FFF;
        background : #ec5c3a;
        margin-top:10px;
}
.formTable input.submit:active {
	padding : 2px;
	color : #FFF;
	background : #666;
        margin-top:10px;
}
.formTable input.text {
	font : 11px verdana, helvetica, arial, geneva, sans-serif;
	border : 1px solid #666;
	padding : 2px;
	background : #F8F8F8;
}
.formTable input.password {
	font : 11px verdana, helvetica, arial, geneva, sans-serif;
	border : 1px solid #666;
	padding : 2px;
	background : #F8F8F8;
}
.formTable input.checkbox {
	color : #333333;
	background : #F8F8F8;
        vertical-align:bottom;
}
.formTable select {
	font : 11px verdana, helvetica, arial, geneva, sans-serif;
	color : #333333;
	background : #F8F8F8;
}
.formTable {
	font : 11px verdana, helvetica, arial, geneva, sans-serif;
	color : #333333;
	/*background : #F8F8F8;
	border : 1px solid #DDD;*/
        margin-top: 15px;
        margin-right: 15px;
        margin-bottom: 15px;
        margin-left: 15px;
}
.formTable td{
    padding:3px;
}
.dataTable{
  border: 1px #666666 solid;
  border-collapse: collapse;
  border-spacing: 0px;
}
.odd{
  background-color:#eeeeee;
}
.dataTableHeading{
  background-color: #6aa159;
  border: 1px #666666 solid;
  font-family: Verdana;
  font-weight: bold;
  font-size: 12px;
  color: #FFFFFF;
  padding:3px;
}
.dataTableHeadingAction{
  background-color: #6aa159;
  border: 1px #666666 solid;
  font-family: Verdana;
  font-weight: bold;
  font-size: 12px;
  color: #FFFFFF;
  padding:3px;
  width:20px;
}
.dataTableHeading a{
  font-weight: bold;
  font-size: 12px;
  color: #FFFFFF;
}
.dataTableHeading a:hover{
  font-weight: bold;
  font-size: 12px;
  color: #FFFFFF;
}
.dataTableHeading a:visited{
  font-weight: bold;
  font-size: 12px;
  color: #FFFFFF;
}
.dataTableColumn{
  border-bottom: 1px #6699CC dotted;
  text-align: left;
  font-family: Verdana, sans-serif, Arial;
  font-weight: normal;
  font-size: 10px;
  color: #404040;
  padding-top: 4px;
  padding-bottom: 4px;
  padding-left: 8px;
  padding-right: 0px;
}
/* END FORM */

/* ------------------------------------------ */
/* MAILER CLASSES */
/* ------------------------------------------ */
#form_box {
	clear:both;
	width: 545px; 
	background: #f8f8f8;
	border: 1px solid #d6d6d6;
	border-left-color: #e4e4e4;
	border-top-color: #e4e4e4;
	padding: 0.5em;
	margin-top: 10px;
	margin-bottom: 2px;
}
 
#form_box div {
	display:block;
	padding:5px;
}
 
#form_box div.hr {
	border-bottom: 2px solid #e2e2e1;
	height: 0px;
	margin-top: 0pt;
	margin-bottom: 7px;
}
 
#form_box div p {
	float: left;
	padding:0px;
	margin:0px;
	width: 120px;
	text-align:left;
	vertical-align:top;
	height:15px;
}
 
 
#log {
	width: 545px;
	margin-top: 10px;
}
 
#log_res {
	overflow: auto;
}
 
#log_res.ajax-loading {
	padding: 20px 0;
	background: url(../images/spinner.gif) no-repeat center;
}
/* END MAILER */



	div.pictureHolder .top .left { background: url(../images/prettyPhoto/tl.gif) top left no-repeat; } /* Top left corner */
	div.pictureHolder .top .middle { background: #fff; } /* Top pattern/color */
	div.pictureHolder .top .right { background: url(../images/prettyPhoto/tr.gif) top left no-repeat; } /* Top right corner */
	
	div.pictureHolder .content { background-color: #fff; } /* Content background */
	div.pictureHolder .content a.next:hover { background: url(../images/prettyPhoto/btnNext.gif) center right no-repeat; cursor: pointer; } /* Next button */
	div.pictureHolder .content a.previous:hover { background: url(../images/prettyPhoto/btnPrevious.gif) center left no-repeat; cursor: pointer; } /* Previous button */
	div.pictureHolder .content a.expand { background: url(../images/prettyPhoto/btnExpand.gif) top left no-repeat; cursor: pointer; } /* Expand button */
	div.pictureHolder .content a.expand:hover { background: url(../images/prettyPhoto/btnExpand.gif) bottom left no-repeat; cursor: pointer; } /* Expand button hover */
	div.pictureHolder .content a.contract { background: url(../images/prettyPhoto/btnContract.gif) top left no-repeat; cursor: pointer; } /* Contract button */
	div.pictureHolder .content a.contract:hover { background: url(../images/prettyPhoto/btnContract.gif) bottom left no-repeat; cursor: pointer; } /* Contract button hover */
	div.pictureHolder .content a.close { width: 61px; height: 22px; background: url(../images/prettyPhoto/btnClose.gif) center left no-repeat; cursor: pointer; } /* Close button */
	
	div.pictureHolder .content .details .nav a.arrow_previous { background: url(../images/prettyPhoto/arrow_previous.gif) top left no-repeat; } /* The previous arrow in the bottom nav */
	div.pictureHolder .content .details .nav a.arrow_next { background: url(../images/prettyPhoto/arrow_next.gif) top left no-repeat; } /* The next arrow in the bottom nav */
	
	div.pictureHolder .bottom .left { background: url(../images/prettyPhoto/bl.gif) top left no-repeat; } /* Bottom left corner */
	div.pictureHolder .bottom .middle { background: #fff; } /* Bottom pattern/color */
	div.pictureHolder .bottom .right { background: url(../images/prettyPhoto/br.gif) top left no-repeat; } /* Bottom right corner */
	
	div.pictureHolder .loaderIcon { background: url(../images/prettyPhoto/loader.gif) center center no-repeat; } /* Loader icon */
	
	div.prettyPhotoTitle div.prettyPhotoTitleLeft { background: url(../images/prettyPhoto/ttl.gif) top left no-repeat; }
	div.prettyPhotoTitle div.prettyPhotoTitleRight { background: url(../images/prettyPhoto/ttr.gif) top left no-repeat; }
	div.prettyPhotoTitle div.prettyPhotoTitleContent { background: url(../images/prettyPhoto/ttp.gif) top left repeat-x; }

/* ------------------------------------------------------------------------
	DO NOT CHANGE
------------------------------------------------------------------------- */

div.prettyPhotoOverlay{background:#000;position:absolute;top:0;left:0;z-index:9500;width:100%}div.pictureHolder{position:absolute;z-index:10000;width:100px}div.pictureHolder .top{position:relative;height:20px}* html div.pictureHolder .top{padding:0 20px}div.pictureHolder .top .left{position:absolute;left:0;width:20px;height:20px}div.pictureHolder .top .middle{position:absolute;left:20px;right:20px;height:20px}* html div.pictureHolder .top .middle{position:static}div.pictureHolder .top .right{position:absolute;top:0;left:auto;right:0;width:20px;height:20px}div.pictureHolder .content{position:relative;text-align:left;width:100%;height:40px}div.pictureHolder .content .details{display:none;margin:10px 15px 0 20px}div.pictureHolder .content .details p.description{display:none;float:left;margin:0}div.pictureHolder .content .details .nav{float:left;margin:4px 0 0 0}div.pictureHolder .content .details .nav p{float:left;margin:0 4px}div.pictureHolder .content .details .nav a.arrow_previous,div.pictureHolder .content .details .nav a.arrow_next{float:left;display:block;width:8px;height:9px;text-indent:-10000px;margin-top:4px}div.pictureHolder .content .details .nav a.disabled{background-position:0 -10px;cursor:default}div.pictureHolder .content div.hoverContainer{position:absolute;z-index:10000;top:0;left:0;width:100%}div.pictureHolder .content a.next{position:relative;z-index:2000;display:block;float:right;text-indent:-10000px;width:49%;height:100%;background:url(../images/prettyPhoto/btnNext.gif) 10000px 50% no-repeat}div.pictureHolder .content a.previous{cursor:pointer;display:block;text-indent:-10000px;width:49%;height:100%;background:url(../images/prettyPhoto/btnNext.gif) 10000px 50% no-repeat}div.pictureHolder .content a.expand,div.pictureHolder .content a.contract{position:absolute;z-index:20000;top:10px;right:30px;cursor:pointer;display:none;text-indent:-10000px;width:20px;height:20px}div.pictureHolder .content a.close{float:right;display:block;text-indent:-10000px}div.pictureHolder .bottom{position:relative;height:20px}* html div.pictureHolder .bottom{padding:0 20px}div.pictureHolder .bottom .left{position:absolute;left:0;width:20px;height:20px}div.pictureHolder .bottom .middle{position:absolute;left:20px;right:20px;height:20px}* html div.pictureHolder .bottom .middle{position:static}div.pictureHolder .bottom .right{position:absolute;top:0;left:auto;right:0;width:20px;height:20px}div.pictureHolder .loaderIcon{display:none;position:absolute;top:50%;left:50%;margin:-12px 0 0 -12px;width:24px;height:24px}div.pictureHolder #fullResImageContainer{width:100%;text-align:center}div.prettyPhotoTitle{display:none;position:absolute;top:0;left:0;z-index:9999;color:#fff;font-size:13px}div.prettyPhotoTitle div.prettyPhotoTitleLeft,div.prettyPhotoTitle div.prettyPhotoTitleRight{float:left;width:19px;height:23px;overflow:hidden}div.prettyPhotoTitle div.prettyPhotoTitleContent{float:left;line-height:23px}