img, form, h1, h2, h3, h4, h5, h6, p, body {border: 0; padding: 0; margin: 0}

/* set background to white and set the default font style. */
body {background: #000 url('../images/web_design_back_1.jpg') top center no-repeat; color: #333; margin: 0 0 30px 0}

/**************************************** DIVS ****************************************/

#web_design_main {width:948px; padding-bottom: 10px; clear: both; margin:auto}

#web_design_header {background: url('../images/web_design_header2.png') top left no-repeat; width: 948px; height:86px; margin:0px}
#web_design_header2 {background: url('../images/web_design_header3.png') top left no-repeat; width: 948px; height:86px; margin:0px}

#headericons { float:left; width:150px; height: 66px; margin-left:580px; margin-top:10px; }
.icons {  width: 42px; height:60px; margin:0 4px 0 0; text-align:center; float:left; padding-top:0}
#contactinfo { float:right; margin:35px 15px 0 0; text-align:right; }
#contactinfo .details { color:#fff; font-size:15px; font-family:'Trebuchet MS', Arial, Helvetica, sans-serif }
#contactinfo .email {  color:#fff; font-size:15px; }

/* #web_design_header {background: url('../images/xmas_header.png') top left no-repeat; width: 948px; height:86px; margin:0px} */

#web_design_telford_nav { background:#282626 url(images/top_menu_bg.gif)repeat-x;height:30px;line-height:30px;margin:0;padding:0;text-align:left; font-size:12px; width:948px }


#web_design_login { width:475px; height: 33px; margin-top:7px; margin-left: 230px; margin-right:18px; padding-top: 2px; float:right; color:#c8c8c8; font-size:11px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; background:transparent }

#web_design_hero {width:948px; height: 125px; clear:both }

#web_design_content { width:948px }

.web_design_portfolio_sur { background-color:#fff; width:644px; margin:0; padding:0; border:1px dotted #ccc }

.web_design_portfolio_img {float:left; margin-right:15px; margin-bottom:10px }

#content_bgrd { background:url(../images/content_bgrd.png) top right repeat-y; }
#web_design_left {width:697px; float:left; }
#web_design_right {width:250px; float:left;  }

#web_design_middle {width:750px; float:left;}
#middle_left { width:530px; float:left;  }
.middle_left_top { background: url('../images/middle_left_top.png') top left no-repeat;  }
.left_mid { background: url('../images/left_bgrd.gif') top left repeat-y; }
#middle_right { width:190px; float:left;}
.web_design_right {width:178px; float:right; padding: 0; margin-bottom:6px}
#web_design_footer {width:950px; margin: auto; padding: 5px 0 10px 0; clear:both}

#telford_web_design { background:url(../images/content_bgrds.png) top left no-repeat; width:948px;  } 
#telford_web_design_bot {background:url(../images/content_bottom_bgrds.png) top left no-repeat; width:948px; height:33px }

.web_portfolio_cont { padding:10px 0 12px 6px }
.web_portfolio_mid { background:url(../images/portfolio_bgrd.png) top left no-repeat; width:178px; height:133px; text-align:center}

#boltonsurround { background-color:#e6ebf5; border:1px solid #c7c7c7; }
#boltonsave { position:absolute; margin-left:-35px; margin-top:-15px; z-index:0; } 

/************************** ADDITIONS ******************************/

.clear {display:block; content:"."; clear:both; font-size:0; line-height:0; height:0; overflow:hidden}
.clear10 {display:block; content:"."; clear:both; font-size:0; line-height:0; height:10px; overflow:hidden}
.clear20 {display:block; content:"."; clear:both; font-size:0; line-height:0; height:20px; overflow:hidden}
.clear30 {display:block; content:"."; clear:both; font-size:0; line-height:0; height:30px; overflow:hidden}
.clear100 {display:block; content:"."; clear:both; font-size:0; line-height:0; height:100px; overflow:hidden}
.spacer-d10 {clear: both; height: 9px; border-bottom: 1px dotted #ccc; margin-bottom: 10px}
.spacer-d20 {clear: both; height: 19px; border-bottom: 1px dotted #ccc; margin-bottom: 20px}
.spacer-d30 {clear: both; height: 29px; border-bottom: 1px dotted #ccc; margin-bottom: 30px}
.spacer-s10 {clear: both; height: 9px; border-bottom: 1px solid #eee; margin-bottom: 10px}
.spacer-s20 {clear: both; height: 19px; border-bottom: 1px solid #eee; margin-bottom: 20px}
.spacer-s30 {clear: both; height: 29px; border-bottom: 1px solid #eee; margin-bottom: 30px}
.pad6 { padding:6px }
.leftpad { padding:6px 10px 6px 10px }
.pad15 { padding:15px }

.go_but { width:14px; height:14px; background: url('../images/go_but.gif') top left no-repeat; margin:0; padding:0; border:0; cursor:pointer  }

.page img { border:1px solid #ccc; padding:3px; float:right; margin:0 0 20px 20px}

/**************************************** TEXT ****************************************/

.porttitle { background:url(../images/portitle.jpg) bottom left no-repeat; color:#fff; padding:2px 0 2px 10px; margin:0; font-size:8pt;width:636px }

h1 {font-weight: bold; font-size: 16px; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; color: #555; margin-bottom: 8px }
h2 {font-weight: normal; font-size: 14px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color: #1a4d80; margin-bottom:8px}
h3 {font-weight: normal; font-size: 14px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color: #e72a8c; margin: 10px 0 5px 0; text-align: left}
h4 {font-weight: bold; font-size: 12px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color: #999; margin-bottom: 6px; line-height:14px}
h5 {font-weight: bold; font-size: 12px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color: #fff; background:url(../images/telford_web_design_h5bgrd.gif) top left no-repeat; line-height:28px; padding-left:10px}
h6 {font-weight: bold; font-size: 12px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color: #fff; background: #cb5900; padding: 5px}

#web_design_right h4 a { color:#555; font-weight:bold; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:11px; margin:0; padding:0}

#web_design_right p { line-height:15px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:11px; color:#666 }

#web_design_left p {color: #303030; margin-bottom: 10px; line-height:18px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:12px}
#web_design_footer p {color: #b6b6b6; margin-bottom: 10px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:11px}

#middle_left a {color: #82aa30; margin-bottom: 10px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif}


#web_design_right p.smallprint { font-size:10px; text-align:right }
#web_design_right h2.boltontitle { margin-left:22px }

/**************************************** LINKS ****************************************/

a:link, a:visited {text-decoration: none; color: #82aa30; font-weight: normal; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif}
a:hover {text-decoration: underline}
a:active {text-decoration: none}

.icons a { color:#FFF; text-decoration:none; font-size:9px;font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; }
.icons a:hover { color:#FFF; text-decoration:none; font-size:9px;font-family:"Trebuchet MS", Arial, Helvetica, sans-serif }

li { color: #303030; line-height:18px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:12px }

.web_portfolio_mid a:link {text-decoration: none; color: #fff; font-weight: normal; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif}
.web_design_portfolio_sur a:link {text-decoration: none; color: #82aa30; font-weight: normal}



#top_menu{background:#282626 url(images/top_menu_bg.gif) repeat-x;height:30px;line-height:30px;margin:0;padding:0;text-align:left; font-size:12px; z-index:2;}
#top_menu ul{list-style:none;margin:0;padding:0; z-index:2;}
#top_menu ul li{float:left;margin:0;padding:0; z-index:2;}
#top_menu ul li a,#top_menu ul li a:visited{color:#bbb;display:block;height:30px;line-height:28px;padding:0;text-align:center;text-decoration:none;border-right:solid 1px #444; padding:0 15px 0 15px; z-index:2;}
#top_menu ul li a:hover{background-color:#EBEBEB;color:#333; z-index:2;}

#top_menu li ul {
   position: absolute;
   margin-left: -999em;
   clear:both; z-index:2;
}

#top_menu li:hover ul {
   position: absolute;
   margin-left: 0px;
   width: 159px;
   background-color:#000;
   filter: alpha (opacity=80);
   opacity:0.80;
   border-bottom: 1px #8c8e8f solid;
   border-left:1px solid #b3b5b7; z-index:2;
}


#top_menu li ul li {
	float: left;
	padding:0 0 0 0 ; 
	list-style: none;
	border-right:1px #b3b5b7 solid; z-index:2;
}


#top_menu li:hover ul li a {
   color: #fff;
   font-weight: normal;
   width: 150px;
   height: 18px;
   line-height: 18px;
   display: block;
   text-align:left;
   padding:2px 0 2px 0;
   margin:0;
   padding-left: 8px;
   font-size: 8pt;
   text-transform:none;
   background-color:#000;
   border-right: 1px #8c8e8f solid; z-index:2;
}


#top_menu li:hover ul li a:hover {
   background-color:#444;
   border-top: 1px #8c8e8f solid;
   border-bottom: 1px #8c8e8f solid;
   height: 16px;
   line-height: 16px;
   color:#FFF; z-index:2;
   clear:both
}

#top_menu li a:hover .nobg {
	background-color:#FFF
}

.stepcarousel{
position: relative; /*leave this value alone*/
border: 0px solid black;
overflow: scroll; /*leave this value alone*/
width: 170px; /*Width of Carousel Viewer itself*/
height: 105px; /*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*/
text-align:center;
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 5px 0px 5px 0px; /*margin around each panel*/
width: 170px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}

/** top login box ***/
#demo-header{ width: 945px; margin: 0 auto; position: relative; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif }

#login-link{ position: absolute; top: 0px; right: 0px; display: block; background: #2a2a2a; padding: 5px 15px 5px 15px; color: #FFF; font-size:13px;	 }

#login-panel{ position: absolute;  top: 26px;  right: 0px;  width: 170px;  padding: 10px 15px 15px 15px;  background: #2a2a2a; font-size: 12px; font-weight: bold; color: #FFF;  display: none; }

#login-panel .box{ width:150px; padding:2px; font-size:11px; margin-right:5px }
#login-panel .esc { font-size:11px; margin-left:40px }
.chat { color:#FFF; font-size:9px; font-family:'Trebuchet MS', Arial, Helvetica, sans-serif; }