img {border: 0; padding: 0; margin: 0}
form {border: 0; padding: 0; margin: 0}
input {border: 1px solid #ccc; font: bold x-small arial; color: #666}
select {border: 1px solid #ccc; font: bold x-small arial; color: #666}

body {background: #fff; border: 0; padding: 0; margin: 15px 0px 15px 0px; font: small arial; color: #666}


/*		General Layout		*/

#main {width: 960px; margin: auto}

#supheader {width: 960px; height: 39px; clear: both}

#banner {width: 960px; height: 156px; background: #fff url(images/web-design-shrewsbury.gif) top left repeat-x; clear: both}
#banner_left {float: left; width: 201px; background-color: #fff}
#banner_right {float: left; width: 365px}

#left {float: left; width: 200px}

#right {float: left; width: 200px}

#center {float: left; width: 555px}
#center_padding {padding: 0 20px 0 20px}

#footer {width: 960px; padding: 5px 0 0 0; border-top: 1px solid #f90; clear: both}
.leftfoot {float: left; width: 50%}
.rightfoot {float: left; width: 50%; text-align: right} 

.width100 {width: 100%}
.width86 {width: 86%}
.width80 {width: 80%}
.width50 {width: 50%}

.lh39 {line-height: 39px}

.mar5 {margin: 5px}
.mar5top {margin-top: 5px}
.mar5right {margin-right: 5px}
.mar5bot {margin-bottom: 5px}
.mar5left {margin-left: 5px}
.mar10 {margin: 10px}
.mar10top {margin-top: 10px}
.mar10right {margin-right: 10px}
.mar10bot {margin-bottom: 10px}
.mar10left {margin-left: 10px}
.mar20 {margin: 20px}
.mar20top {margin-top: 20px}
.mar20right {margin-right: 20px}
.mar20bot {margin-bottom: 20px}
.mar20left {margin-left: 20px}
.pad1 {padding: 1px}
.pad5 {padding: 5px}
.pad5top {padding-top: 5px}
.pad5right {padding-right: 5px}
.pad5bot {padding-bottom: 5px}
.pad5left {padding-left: 5px}
.pad10 {padding: 10px}
.pad30 {padding: 30px}
.pad10top {padding-top: 10px}
.pad10right {padding-right: 10px}
.pad10bot {padding-bottom: 10px}
.pad10left {padding-left: 10px}
.imgpad {padding: 0 0 20px 20px}
.large { font-size:large}
.medium { font-size:medium}
.small { font-size:small}
.flright { float:right}
.flleft { float:left}

.bordergrey {border: 1px solid #cccccc}
.clrboth {clear:both}

/*		Text		*/

h1 {font: bold medium arial; color: #f90; border: 0; padding: 0; margin: 5px 0 6px 0}
h2 {font: bold small arial; color: #333; border: 0; padding: 0; margin: 10px 0 10px 0}
h3 {font: bold small arial; color: #f90; border: 0; padding: 0 0 2px 0; margin: 0 0 10px 0; border-bottom: 1px solid #ccc}

p {font: 9pt arial; color: #666; border: 0; padding: 0; margin: 0; line-height:18px;}
#center p {margin: 0 0 10px 0}

.center {text-align: center}
.left {text-align: left}
.right {text-align: right}

.green {color: #0f5234}
.blue {color: #5f7e8e}
.red {color: #c00}
.orange {color: #f90}
.lgrey {color: #999}

.underline {border-bottom: 1px solid #ccc}

.x-small {font-size: x-small}
.small {font-size: small}
.medium {font-size: medium}
.large {font-size: large}
.x-large {font-size: x-large}
.x-small {font-size: x-small}


/*		Linkology		*/

a:link, a:visited {text-decoration: none; color: #f90}
a:hover {text-decoration: underline; color: #f90}
a:active {text-decoration: none; color: #f90}

#footer a:link, #footer a:visited {text-decoration: none; color: #f90; font-size:8pt}
#footer a:hover {text-decoration: underline; color: #f90}
#footer a:active {text-decoration: none; color: #f90}

#supheader a:link, #supheader a:visited {text-decoration: none; color: #999; font-size:8pt}
#supheader a:hover {text-decoration: underline; color: #999}
#supheader a:active {text-decoration: none; color: #999}

img.transON { opacity:.50; filter:alpha(opacity=50); -moz-opacity:0.5 }
img.transOFF {opacity:1; filter:alpha(opacity=100); -moz-opacity:1 } 

.loginbut { width: 16px; height: 16px; color: #fff; background: #ff6600; border: 0px none; padding: 0; margin: 0; font-style:normal; font-variant:normal; font-weight:bold; font-size:small; font-family:arial}

/*		Navigation		*/

#main_menu ul {margin: 0; padding: 0; list-style-type: none; font: small arial}
#main_menu li {margin: 0 0 1px 0}
#main_menu a {display: block; height: 25px; line-height: 25px; padding: 0 0 0 10px; width: 190px; background-color: #f70}
#main_menu a:link {color: #fff; text-decoration: none}
#main_menu a:visited {color: #fff; text-decoration: none}
#main_menu a:hover {background-color: #f90; color: #fff}

#main_menu li.sel a {background-color: #f90}


#services_menu {padding: 2px 0 4px 0; background-color: #f90}
#services_menu a:link, #services_menu a:visited {text-decoration: none; color: #fff; font-size: 8pt}
#services_menu a:hover {text-decoration: underline; color: #fff}
#services_menu a:active {text-decoration: none; color: #fff}


#sub_menu ul {margin: 0; padding: 0; list-style-type: none; font: small arial}
#sub_menu li {margin: 0 0 1px 0}
#sub_menu a {display: block; padding: 2px 10px 2px 10px; width: 180px; background-color: #bbb}
#sub_menu a:link {color: #fff; text-decoration: none}
#sub_menu a:visited {color: #fff; text-decoration: none}
#sub_menu a:hover {background-color: #ccc; color: #fff}

#sub_menu ul li.sel a {background-color: #ccc}


#sub_menu ul li ul {margin: 0; padding: 0; list-style-type: none; font: x-small arial}
#sub_menu ul li ul li {margin: 0 0 1px 0}
#sub_menu ul li ul li a {display: block; padding: 2px 10px 2px 10px; width: 180px; background-color: #e9e9e9}
#sub_menu ul li.sel ul li a {display: block; padding: 2px 10px 2px 10px; width: 180px; background-color: #e9e9e9}
#sub_menu ul li ul li a:link {color: #666; text-decoration: none}
#sub_menu ul li ul li a:visited {color: #999; text-decoration: none}
#sub_menu ul li ul li a:hover {background-color: #ff9900; color: #666666}

#sub_menu ul li ul li.sel a {background-color: #f5f5f5}

#twitter {
width: 200px;
border: solid 1px #999999;
}

ul#twitter_update_list {
margin: 0 auto;
padding: 0;
list-style-type: none;
}

ul#twitter_update_list li {
padding: 0 0 10px 0px;
}

a#twitter-link img{
border: solid 1px #cccccc;
}

div#call_to_action {
width: 200px;
height: 250px;
border: solid 1px #cccccc;
background: url(images/enquiry_background.gif) no-repeat;
}

div#call_to_action h3 {
padding: 10px 7px 10px 45px; 
color: #666666;

}

form#enquiry {
width: 180px;
padding: 7px;
}

form#enquiry input.textfield {
width: 170px;
height:15px;
border: solid 1px #cccccc;
background-color: #ffffff;
padding: 5px;
}

form#enquiry textarea {
width: 170px;
height:45px;
border: solid 1px #cccccc;
background-color: #ffffff;
padding: 5px;
font-family:arial;
font-size:x-small;
}

form#enquiry textarea:hover {
border: solid 1px #e9e9e9;
}

form#enquiry input.textfield_error {
width: 170px;
height:15px;
border: solid 1px #f90;
padding: 5px;
}

form#enquiry input.textfield:hover {
border: solid 1px #e9e9e9;
}

form#enquiry input.textfield_error:hover {
border: solid 1px #e9e9e9;
}

p.required {
font-size: 11px;
padding: 0 7px;
color: #f90;
}

div#web_review {
width: 500px;
background: url(images/form_grad.gif) repeat-x;
border: solid 1px #cccccc;

}

div#web_review h3 {
padding: 10px 7px 10px 45px; 
color: #666666;

}

form#review {
width: 480px;
padding: 7px;
}

form#review input.textfield {
width: 470px;
height:15px;
border: solid 1px #cccccc;
background-color: #ffffff;
padding: 5px;
/* margin-bottom: 10px; */
}

form#review input.textfield_error {
width: 470px;
height:15px;
border: solid 1px #f90;
padding: 5px;
/* margin-bottom: 10px; */
}

form#review input.textfield:hover {
border: solid 1px #e9e9e9;
}

form#review input.textfield_error:hover {
border: solid 1px #e9e9e9;
}

form#review textarea {
width: 470px;
height:60px;
border: solid 1px #cccccc;
background-color: #ffffff;
padding: 5px;
/* margin-bottom: 10px; */
font-family:arial;
font-size:x-small;
}

form#review .textarea:hover {
border: solid 1px #e9e9e9;
}

p.required {
font-size: 11px;
padding: 0 7px;
color: #f90;
}

a.web_review img {
border: solid 1px #cccccc;
}

a.web_review img:hover {
border: solid 1px #f90;
}

a.top {
background:url(images/top.png) no-repeat right center;
padding: 15px 30px 15px 0;
}