html, body {
	background-color: #fff;
   height: 100%;
	margin: 0;
}

img { border: 0; }
.fl { float: left; }
.cf { clear: both; }
.cf10 { clear: both; height: 10px; }
.cf20 { clear: both; height: 20px; }
a { color: #666; }
a:hover { text-decoration: none; }

a, p, blockquote, span, div, h3, label, input, textarea {
   font-family: Helvetica, Arial, Verdana, sans-serif; 
}

#shell {
	margin:auto;
	min-height:100%;
	margin-top: -210px;/*footer height - this drags the outer 40px up through the top of the monitor */
}
* html #shell {
	height: 100%;
}

#logo-s {
   background-image: url(../images/logo_s.png);
   background-position: bottom left;
   background-repeat: no-repeat;
   clear: both;
   height: 210px;
   margin-left: 100px;
   width: 224px;
}
 
   /*Opera Fix*/
body:before {/* thanks to Maleika (Kohoutec)*/
	content:"";
	height:100%;
	float:left;
	width:0;
	margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}
   
#shell:after {/* thank you Erik J - instead of using display table for ie8*/
	clear:both;
	display:block;
	height:1%;
	content:" ";
}


#bar {
	background-color: #b3b3b3;	
	padding: 20px 5px 5px 100px;
	max-width: 100;
   border-top: 210px solid #fff;
}

	h1#logo { margin: 0; }
   
	h1#logo a {
		background-image: url(../images/logo_stubblefield.png);
		display: block;
		height: 15px;
		overflow: hidden;
		text-indent: -9999px;
		width: 210px;
	}
   
   h1#logo a:active { position: relative; top: 1px; }
   
#container {
	margin: 60px 0 0 100px;
}

	#container #menu { float: left; margin: 2px 30px 0 0; width: 120px; }
	#menu h2 { margin: 0 0 10px 0; }
	#menu h2 a {
      /*
		background-image: url(../images/sprite-menu.png);
		background-repeat: no-repeat;
		overflow: hidden;
		text-indent: -9999px;
      */
		display: block;
      color: #b3b3b3;
      font-size: 18px;
      font-weight: normal;
      line-height: 15px;
      text-decoration: none;
	}
   #menu h2 a:hover { color: #ffd200; }
   #menu h2 a:active { color: #e82370; position: relative; top: 1px; }
   #menu h2.current a { color: #e82370; }
   
	#menu h2 a.portfolio { background-position: 0 0; height: 15px; width: 69px; }
	#menu h2 a.portfolio:hover { background-position: -70px 0; }
	#menu h2 a.portfolio:active, #menu h2.current a.portfolio { background-position: -140px 0; }
	
	#menu h2 a.about { background-position: 0 -23px; height: 14px; width: 50px; }
	#menu h2 a.about:hover { background-position: -70px -23px; }
	#menu h2 a.about:active, #menu h2.current a.about { background-position: -140px -23px; }
	
	#menu h2 a.service { background-position: 0 -45px; height: 15px; width: 62px; }
	#menu h2 a.service:hover { background-position: -70px -45px; }
	#menu h2 a.service:active, #menu h2.current a.service { background-position: -140px -45px; }
	
	#menu h2 a.contact { background-position: 0 -66px; height: 15px; width: 66px; }
	#menu h2 a.contact:hover { background-position: -70px -66px; }
	#menu h2 a.contact:active, #menu h2.current a.contact { background-position: -140px -66px; }
	
	#menu h2 a.new { background-position: 0 -89px; height: 13px; width: 37px; }
	#menu h2 a.new:hover { background-position: -70px -89px; }
	#menu h2 a.new:active, #menu h2.current a.new { background-position: -140px -89px; }
   
   #menu #submenu { margin: 20px 0; }
   #submenu a {
      color: #e82370;
      display: block;
      font-size: 13px;
      line-height: 21px;
      text-decoration: none;
   }
   #submenu a:hover { color: #b51b56; }
   #submenu a.current { color: #e8aec4; }
   #submenu a.special { font-weight: bold; margin-top: 5px;  }

	#container #content {
		float: left;
		width: 540px;
	}
   
      #content h3 {
         color: #e82370;
         font-size: 18px;
         font-weight: bold;
         line-height: 18px;
         margin: 0 0 20px 0;
      }
            
      #content p, #content div {
         color: #191919;
         font-size: 15px;
         line-height: 20px;
      }
      
         #content blockquote {
            margin: 100px 0 0 0;
            font-size: 13px;
         }
         
         #content blockquote p {
            font-size: 13px;
            font-style: italic;
         }
         
         #content blockquote p strong {
            font-size: 12px;
            font-style: normal;
         }
         
      #content .label { 
         float: left;
         margin-right: 30px;
         width: 108px;
      }
      
      
      #content .value {
         color: #707070;
         float: left;
         font-weight: bold;
      }
      
      #content .p-title {
         color: #666;
         clear: both;
         float: left;
         font-size: 16px;
         font-weight: bold;
         line-height: 16px;
         margin-top: 20px;
      }
      
      #content .p-quote {
         color: #666;
         clear: both;
         float: left;
         font-size: 14px;
         font-style: italic;
         line-height: 14px;
         margin-top: 10px;
      }
      
      #content .p-source {
         color: #666;
         clear: both;
         float: left;
         font-size: 11px;
         line-height: 11px;
         margin-top: 10px;
         margin-left: 5px;
      }
      
ul#portfolio { list-style-type: none; }

.contact a { text-decoration: none; }

form.request ul {
   list-style-type: none;
   margin: 0;
   padding: 0;
}

form.request li {
   clear: both;
   float: left;
   margin: 5px 0;
}

form.request label {
   float: left;
   font-size: 12px;
   line-height: 26px;
   margin-right: 20px;
   width: 200px;
}

form.request span.required { color: #E82370; margin-left: 5px; }
form.request span.hidden { display: none; }

form.request #date {
   float: left;
   font-weight: bold;
}

form.request input {
   background-color: #e7e7e8;
   border: 1px solid #d7d8d9;
   color: #222222;
   float: left;
   font-size: 11px;
   line-height: 12px;
   padding: 4px;
   width: 310px;
}

form.request label.smaller {
   margin: 0 10px 0 10px;
   width: 100px;
}

form.request input.smaller {
   width: 90px;
}

form.request input.checkbox {
   background-color: transparent;
   border: 0;
   height: 20px;
   padding: 0;
   width: auto;
}

form.request label.fr {
   margin-left: 10px;
   width: auto;
}

form.request a.calendar_icon {
   display: block;
   margin: 0;
   float: left;
   margin-left: 5px;
   margin-right: 10px;
   margin-top: 5px;
}

form.request label.cf {
   clear: both;
   width: 540px;
}

form.request textarea {
   background-color: #e7e7e8;
   border: 1px solid #d7d8d9;
   color: #222222;
   height: 50px;
   font-size: 11px;
   line-height: 12px;
   padding: 4px;
   width: 530px;
   max-width: 540px;
}

form.request input.submit_btn {
   background-color: #ea1d71;
   border: 1px solid #de1b6c;
   color: #fff;
   cursor: pointer;
   font-size: 13px;
   font-weight: bold;
   height: 26px;
   margin: 0 165px;
   padding: 4px;
   text-transform: uppercase;
   width: 200px;
}
form.request input.submit_btn:hover { background-color: #de1b6c; }
form.request input.submit_btn:active { background-color: #d11966; padding-top: 6px; max-height: 26px; }

form.request input.inactive, form.request textarea.inactive { color: #999; }

.request_details ul {
   list-style-type: none;
   margin: 20px 0 0 80px;
   padding: 0;
}

.request_details span.details_label {
   display: inline-block;
   font-size: 12px;
   margin-right: 20px;
   width: 135px;
}

.request_details span.details_value {
   display: inline-block;
   font-size: 12px;
   font-weight: bold;
}

.request_details span.details_value a {
   color: #000;
   text-decoration: none;
}

.request_details span.details_note {
   display: inline-block;
   font-size: 12px;
   margin-left: 20px;
}

.request_details span.label_title, .request_details span.value_title {
   color: #E82370;
   font-size: 18px;
}

#content .message {
   background-color: #E82370;
   border: 1px solid #cf1f62;
   color: #eee;
   font-size: 13px;
   font-style: italic;
   margin: 10px 0;
   padding: 6px;
   width: 528px;
}



#image-container {
   float: left;
	height: 359px;
   position: relative;
	width: 540px;		
}

.fade-box {
   left: 0;
   position: absolute;
   top: 0;
   width: 540px;
}

.fade-box a img {
   border: 0;
}

.display_thumbs { float:left; clear: both; margin-bottom: 10px; }

.display_thumbs a, .display_thumbs a img {
   display: block;
   float: left;
   margin: 0 10px 10px 0;
   padding: 0;
   width: 40px;
   height: 40px;
}

.display_thumbs a.current {
   opacity:0.25;
   filter:alpha(opacity=25);
}