

.notice {margin:5px 0;padding:10px;border:1px solid #dedeb9;color: #fff;background:#C00;text-align:center;}
.notice a:link, .notice a:visited, .notice a:active, .notice a:hover {color: #fff; font-weight:bold; text-decoration: underline}

@font-face {
	font-family: 'SerifaBlack';
	src: url('http://www.wstyler.ca/fonts/SerifaBlack.eot');
	src: local('?'), url('http://www.wstyler.ca/fonts/SerifaBlack.ttf') format('truetype');
}


@font-face {
  font-family: 'Graublau Web';
  src: url('GraublauWeb.eot');
  src: local('?'),
         url('GraublauWeb.woff') format('woff'), url('GraublauWeb.ttf') format('truetype');
}

img,div,span,ul,li,a {
behavior:url(http://www.wstyler.ca/css/iepngfix.htc);
}



/*--------------------Body-----------------------*/

body{
background-image:url(http://www.wstyler.ca/images/page-bckgnd.jpg);
background-repeat:no-repeat;
background-position:top center;
background-color:#2c6996;
margin:0 auto;
padding:0;
font-family:Trebuchet MS, Lucida Grande, Arial, Helvetica, Sans-serif;
font-size:12px;
line-height:1.2em;
color:#333;
}

/*--------------------Wrapper-----------------------*/

#wrapper {
width:970px;
background-color:#e6e6e6;
text-align:center;
margin:0 auto;
}


/*--------------------Header------------------------*/

#header {
width:970px;
height:100px;
background-image:url(http://www.wstyler.ca/images/header.jpg);
background-repeat:no-repeat;
}

#logo {
widows:385px;
height:100px;
float:left;
}


.header-right {
float:right;
width:450px;
height:30px;
font-family: 'SerifaBlack', Trebuchet MS, Lucida Grande, Arial, Helvetica, Sans-serif;
letter-spacing:-0.05em;
font-size:24px;
color:#FFF;
text-align:right;
margin:62px 35px 0;
}

.header-right a:hover {
text-decoration:none;
color:#bbb;
}

.header-right a:link,.header-right a:visited,.header-right a:active {
text-decoration:none;
color:#FFF;
}

/*---------------------Menu------------------------*/

#menu {
height:60px;
width:970px;
background-image:url(http://www.wstyler.ca/images/menu/menu-bckgnd.jpg);
background-repeat:no-repeat;
padding:0 1px;
}

ul#topnav {
list-style:none;
float:left;
width:968px;
margin:0;
padding:0;
}

ul#topnav li {
float:left;
margin:0;
padding:0;
}

ul#topnav a {
float:left;
display:block;
height:60px;
text-indent:-99999px;
background-position:left top;
}

ul#topnav a:hover {
background-position:left -60px;
}

#home li.home a,#about-you li.about-you a,#screening-media li.screening-media a,#vibrating-screens li.vibrating-screens a,#washing li.washing a,#service li.service a,#analysis-processing li.analysis-processing a,#about-us li.about-us a {
background-position:left bottom;
}

ul#topnav li.home a {
background-image:url(http://www.wstyler.ca/images/menu/button-home.jpg);
width:121px;
}

ul#topnav li.about-you a {
background-image:url(http://www.wstyler.ca/images/menu/button-aboutyou.jpg);
width:121px;
}

ul#topnav li.screening-media a {
background-image:url(http://www.wstyler.ca/images/menu/button-screeningmedia.jpg);
width:121px;
}

ul#topnav li.vibrating-screens a {
background-image:url(http://www.wstyler.ca/images/menu/button-vibratingscreens.jpg);
width:121px;
}

ul#topnav li.washing a {
background-image:url(http://www.wstyler.ca/images/menu/button-washing.jpg);
width:121px;
}

ul#topnav li.service a {
background-image:url(http://www.wstyler.ca/images/menu/button-service.jpg);
width:121px;
}

ul#topnav li.analysis-processing a {
background-image:url(http://www.wstyler.ca/images/menu/button-analysisprocessing.jpg);
width:121px;
}

ul#topnav li.about-us a {
background-image:url(http://www.wstyler.ca/images/menu/button-aboutus.jpg);
width:121px;
}

/*---------------------Banner-----------------------*/

#banner {
width:970px;
height:250px;
text-align:left;
}

/*---------------------Content----------------------*/

#content {
width:970px;
height:100%;
min-height:400px;
background-color:#e6e6e6;
border-top:solid 1px #333;
}


/*---------------------Classes----------------------*/

.smallpic {
float:left;
width:100px;
height:100px;
}

.smallpichome {
float:left;
width:100px;
height:100px;
padding:0 10px 10px 0;
}

.a {
width:385px;
height:100%;
min-height:380px;
text-align:left;
line-height:1.2em;
margin:10px;
padding:10px 40px 0;
}

.c {
width:425px;
height:100%;
min-height:115px;
margin-top:10px;
margin-left:10px;
text-align:left;
line-height:1.2em;
padding:10px 40px 0 0;
}

.c-text {
float:right;
width:310px;
padding-left:10px;
}

.d1 {
width:870px;
margin-top:10px;
margin-left:10px;
text-align:left;
line-height:1.2em;
padding:10px 30px;
}

.d2 {
width:425px;
height:100%;
margin-top:10px;
text-align:left;
line-height:1.2em;
padding:0 5px 10px;
}

.d3 {
width:850px;
margin-top:10px;
text-align:left;
line-height:1.2em;
padding:10px 30px;
}

.d4 {
width:160px;
height:100%;
margin-top:10px;
text-align:left;
line-height:1.2em;
padding:0px 5px 10px 0px;
}


.d-text {
float:left;
width:305px;
padding-left:10px;
}

.d2-text {
float:left;
width:405px;
padding:0 0 10px 10px;
}

.d3-text {
float:left;
width:200px;
padding:10px 0 0 10px;
}

.e1 {
width:300px;
height:100%;
text-align:left;
padding:0 5px 10px;
}

.e2 {
width:550px;
height:100%;
margin-top:5px;
text-align:left;
line-height:1.2em;
padding:0 5px 10px;
}

.e3 {
width:170px;
height:100%;
margin-top:10px;
text-align:left;
line-height:1.2em;
padding:5px 5px 10px;
}

.e4 {
width:200px;
height:100%;
margin-top:10px;
text-align:left;
line-height:1.2em;
padding:5px 5px 10px;
}

.left,.right {
float:left;
}

.clear {
clear:both;
}

img {
border:0;
}
.white {
color:#FFF;
}

.dark {
color:#333;
}

.download {
float:left;
text-transform:uppercase;
font-size:10px;
color:#069;
text-align:left;
padding-right:10px;
}


/*----------------Read More-----------------*/

.readmore {
float:right;
text-transform:uppercase;
font-size:10px;
color:#069;
text-align:right;
padding-right:10px;
}

.readmore a:link,.readmore a:visited,.readmore a:active,.download a:link,.download a:visited,.download a:active,a:link,a:visited,a:active {
text-decoration:none;
color:#069;
}

.readmore a:hover,.download a:hover,a:hover {
text-decoration:underline;
color:#069;
}


/*----------------Heading Classes-----------------*/

.heading-banner {
text-transform:uppercase;
letter-spacing:-0.03em;
font-size:24px;
font-weight:700;
color:#069;
margin:0 0 10px;
padding:0;
}

.heading {
font-family: 'SerifaBlack', Trebuchet MS, Lucida Grande, Arial, Helvetica, Sans-serif;
letter-spacing:-0.025em;
text-transform:uppercase;
font-size:16px;
/*letter-spacing:-0.03em;*/
/*font-weight:700;*/
color:#069;
border-bottom:dashed 1px #069;
margin:0 0 10px;
padding:0 0 5px;
}

.subheading {
text-transform:uppercase;
letter-spacing:-0.02em;
font-size:14px;
font-weight:700;
color:#069;
border-bottom:dashed 1px #069;
margin:0 0 5px;
padding:0 0 4px;
}

.subheading2 {
text-transform:uppercase;
letter-spacing:-0.01em;
font-size:12px;
font-weight:700;
color:#333;
margin:0 0 5px;
padding:0 0 4px;
}

.subheading3 {
text-transform:uppercase;
letter-spacing:-0.02em;
font-size:14px;
font-weight:700;
color:#069;
margin:0 0 5px;
padding:5px 0 4px;
}

.newsheading {
text-transform:uppercase;
letter-spacing:-0.02em;
font-size:14px;
font-weight:700;
color:#069;
margin:0 0 5px;
padding:0;
}

/*---------------------Lists----------------------*/

ul {
list-style-image:url(../images/bullet.png);
list-style-position:outside;
padding:0 0 0 25px;
}

/*-------------------ToolTip----------------------*/

#screenshot {
position:absolute;
display:none;
color:#fff;
padding:5px;
}

/*---------------------Footer----------------------*/

#footer-wrapper {
width:100%;
height:90px;
text-align:center;
background-color:#222;
}

#footer-container {
width:970px;
padding-left:20px;
margin:0 auto;
}

#footer_left {
float:left;
text-align:left;
width:750px;
height:65px;
margin-top:22px;
}

#footer_right {
float:left;
width:180px;
height:55px;
margin-top:25px;
}

.footer_text {
font-size:10px;
color:#ECECEC;
line-height:2em;
}

.footer_text a:hover {
text-decoration:underline;
color:#DDD;
}

.footer_text a:link,.footer_text a:visited,.footer_text a:active {
text-decoration:none;
color:#ECECEC;
}


/*---------------------SubMenu----------------------*/

#submenu {
float:left;
background-image:url(http://www.wstyler.ca/images/bckgnd_submenu.png);
background-repeat:repeat-x;
height:42px;
width:970px;
padding:0 10px;
}

a.subnav,a.subnav:link,a.subnav:visited,.chosen {
float:left;
margin-top:13px;
text-align:center;
display:block;
width:auto;
height:42px;
text-decoration:none;
font-size:12px;
color:#bbb;
overflow:hidden;
padding:0 5px 0 0;
}

a.subnav:hover {
margin-top:13px;
color:#fff;
padding:0 5px 0 0;
}

a.subnav:active,.chosen {
color:#fff;
}

/*---------------------FlowTabs----------------------*/

#flowtabs {
z-index:999999;
position:absolute;
bottom:50px;
left:50px;
cursor:pointer;
width:760px;
height:31px !important;
_margin-bottom:-2px;
margin:0 !important;
padding:0;
}

#flowtabs li {
float:left;
text-indent:0;
list-style-type:none;
margin:0;
padding:0;
}

#flowpanes .items {
width:20000em;
position:absolute;
clear:both;
padding:0;
}

#flowpanes {
background-image:url(http://www.wstyler.ca/images/banners/banner-bckgnd.jpg);
background-color:#CCC;
width:970px;
height:250px;
position:relative;
overflow:hidden;
clear:both;
}

.banner-img {
float:right;
margin-right:40px;
}

.testimonial {
float:left;
display:block;
width:970px;
height:250px;
}

#flowpanes div h2 {
font-weight:700;
color:#036;
letter-spacing:-0.05em;
font-size:22px;
margin:10px 0 0;
}

#flowpanes div h1 {
font-weight:700;
color:#036;
font-size:13px;
margin:10px 0 -15px;
}
