/*---------- Presentation Stylesheet ------------ */
/*                 Stytrotech CNC                 */
/*       Created By Ben Stewart - Aug 2008        */

body {
 background: #b4b3b2 url(assets/styrotech_body_bg.jpg) repeat-x;
 font-family:Verdana, Arial, Helvetica, sans-serif;
 font-size:12px;
 line-height:14px;
 color: #36312d;
 margin: 0px auto;
 width:365px;
}
* {
 margin:0;
 padding:0;
}
html {
 height:100%;
 margin-bottom:1px; /* keeps a vertical scrollbar on all pages */
}
h1, h2, h3 {
 font-weight:bold;
 color: #fff;
 margin: 0;
 text-transform:uppercase;
 padding:5px 0 15px 0;
}
h1 {
 font-size:20px;
 text-transform:none;
}
h2 {
 font-size:15px;
 padding:5px 0 10px 0;
}
h3 {
 font-size:12px;
}
ul {
 margin: 10px 10px 10px 20px;
}
li {
 margin:0px;
 font-size:12px;
 text-align:justify;
 list-style: square;
 padding:0 0 10px 0px;
}
p {
 text-align:justify;
}
a {
 border:none;
 color: #36312d;
 text-decoration:none;
}
a:hover {
 color: #fd6629;
 text-decoration: underline;
}
a:active {
 outline: none;
}
a:focus {
 -moz-outline-style: none;
}
hr {
 height:1px;
 background-color: #a7b2b7;
 border: 1px solid #a7b2b7;
 margin-bottom: 10px;
}
img.Image_left {
 float: left;
 margin: 15px;
}
img.Image_right {
 float: right;
 margin: 15px;
}
img.Image_centre {
 margin: 0 auto 15px auto;
}
img.Image_negative {
 margin: -25px 0 15px 0;
*margin: -10px 0 15px 0;
}
body {
 background: #b4b3b2 url(assets/styrotech_body_bg.jpg) repeat-x;
 font-family:Verdana, Arial, Helvetica, sans-serif;
 color: #36312d;
 font-weight: 500;
 margin: 30px auto 0px auto;
 width:100%;
}
#header {
 height:142px;
 background: url(assets/styrotech_header.jpg) no-repeat;
}
#header img {
 height:112px;
 float:left;
 width:350px;
 margin-left:20px;
}
#spacer {
 height:18px;
}
#slideshow_wrapper {
 height:250px;
 margin-top:-18px;
 background: url(assets/styrotech_slideshow_bg.png) no-repeat;
 background-position: bottom;
}
#slideshow {
 height:215px;
 width:675px;
 margin-left:43px;
 padding-top:17px;
}
/********** Top Menu ***********/
#menu {
 background: url(assets/styrotech_menu_bg.jpg) repeat-x;
 border-left:2px solid #7f7d7c;
 height:30px;
 overflow:hidden;
 clear:both;
}
#menu a {
 padding: 8px 0;
 color:#FFF;
 float:left;
 text-align:center;
 border-right:2px solid #7f7d7c;
 width:167px;
 display:block;
 text-transform:uppercase;
 text-decoration: none;
}
#menu a.home {
 width:80px;
 text-decoration: none;
}
#menu a:hover,
#menu  a#active {
 background: url(assets/styrotech_menu_bg_hover.jpg) repeat-x;
 text-decoration: none;
}
#menu a:hover#active {
 text-decoration: none;
}

/********** Content Area ***********/
#container {
 text-align:left;
 width:760px;
 margin:0 auto;
}
.topcontent {
 background: url(assets/styrotech_topfooter_bg.jpg) repeat-x;
 border-bottom: 2px solid #dedddd;
 height:22px;
 clear:both;
 width:100%;
 color:#fff;
 text-transform:uppercase;
 padding-top:8px;
 text-align:center;
}
.history {
 width:756px;
 position: absolute;
}

#contentwrapper {
 background: url(assets/styrotech_content_bg.gif) repeat-y center;
 border-top: 2px solid #dedddd;
}
#content p {
 padding:0px 12px 0px 25px;
}
#rightCol {
 float:right;
 width:379px;
}
#rightCol p {
 padding:5px 15px 10px 15px;
}
#rightCol table {
 padding:10px 15px 10px 15px;
}
#leftCol {
 float:left;
 width:379px;
}
#leftCol p {
 padding:5px 15px 10px 15px;
 text-align:justify;
}
#leftCol ul li.hoverlist {
 list-style:none;
 text-align:justify;
 color: #36312d;
 text-transform:uppercase;
 padding-bottom:5px;
}
#leftCol a {
 color: #36312d;
 margin-top:-12px;
 padding:0 0 0 55px;
 display:block;
 height:55px;
 background: url(assets/styrotech_opac.png) no-repeat top left;
}
#leftCol a:hover {
 color: #fd6629;
 background:url(assets/dummy.gif) no-repeat top left;
}
.infopage {
 width:635px;
 height:215px;
 background:url(../../assets/images/pageimages/Information.jpg) no-repeat;
 padding: 100px 20px 0 20px;
}
/********** Footer Area ***********/
#topfooter {
 background: url(assets/styrotech_topfooter_bg.jpg) repeat-x;
 border:solid #7f7d7c;
 border-width: 0 2px;
 overflow:hidden;
 height:30px;
 clear:both;
 width:756px;
 text-align:right;
}
#topfooter p {
 color: #FFF;
 font-size:12px;
 padding:8px 10px 0 0;
 text-transform:uppercase;
 text-align:right;
}
#topfooter a {
 text-decoration:none;
 background:url(assets/styrotech_emailus.jpg) no-repeat right;
 padding-right:30px;
 color: #fff;
}
#topfooter a:hover {
 text-decoration: underline;
 color: #fd6629;
}
#footer {
 clear:both;
 width:100%;
 color: #737373;
}
#footer p {
 color: #737373;
 font-size:9px;
 padding:15px 0;
 text-align:right;
}
#footer a {
 color: #737373;
 text-decoration:none;
}
#footer a:hover {
 color: #737373;
 text-decoration: underline;
}
/*------------- Contact Form --------------*/

div.contactForm {
 width:340px;
 padding: 0px;
 margin: 0 0 0 20px;
}
div.row {
 clear: both;
 padding-top: 5px;
 vertical-align: middle;
}
div.row span.label {
 float: left;
 width: 100%;
 text-align: right;
 padding:0px 10px 0px 0px;
}
div.row span.formw {
 float: right;
 width: 100%;
 text-align: left;
}
input, textarea, .button {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 12px;
 color: #36312d;
 width: 100%;
 border: 1px solid #fff;
 background: #fff;
 padding-left: 3px;
}
input {
 width: 100%;
 margin: 3px 0 2px 0;
}
div.row textarea {
 height:200px;
 margin: 3px 0 0px 0;
}
div.spacer {
 clear: both;
}
.button {
 width:100px;
 color:#FFF;
 float:right;
 border: none;
 height:30px;
 background:url(assets/styrotech_topfooter_bg.jpg) repeat-x;
 cursor:pointer;
 margin-top:-2px;
}
