@charset "utf-8";
/* CSS Document */

/*General layout*/
html{height:100%; }
a{ cursor:pointer; outline:none; }
a{ color:#999999;}
a:hover{ color:#333333;}/*#f1f1f1;}*/

body {
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
    background-color:#fafafa; /*background-image: url(../images/wbs_bg_h_w.jpg); background-repeat:repeat; background-position: 50% top;*/
	/*background-image: url(../images/wbs_bg.png); background-repeat:repeat; background-position: 50% top;*/
	background-attachment:scroll; /*for some reason it stutters with fixed*/
	color: #111111;/*#c1c8b8;*/
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	/* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	text-align: center;
	min-height:100%;
	}
#wbs_pat{ width:423px; height:586px; background:url(../images/wbs_pat_w.png); position:absolute; left:auto; right:0; top:0;}

p{ text-align:justify;
	font: 100% Verdana, Arial, Helvetica, sans-serif;}

.column #container {
	position:relative;
	width:700px;
	padding:0px;
	margin:0 auto;
	/*background: url(../images/wbs_pane_v.png) repeat-y top center;*/
	/*background: url(../images/s_w.png) repeat top center;*/
	/*margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
	/*color:#c1c8b8;*/
	font-size:10px;
    overflow:visible;
}
.column #mainContent {
	position: relative;
	margin:0 auto;
	/*width:600px;*/
	padding: 44px 50px; /* remember that padding is the space inside the div box and margin is the space outside the div box */

}
.column #menu { 
	position: fixed;
	top:0; left:0;
	width: 100%; height:46px;
	background-image:url(../images/wbs_menu_w.png); background-repeat:repeat-x;
	padding: 0;
}

.column h2 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding:0;
	font-size:2.5em;
	font-weight:normal;
	text-transform:uppercase;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	letter-spacing:0.05em;
	color:#333333;
	/*background:url(../images/wbs_header_w.png) left top no-repeat;*/
	background:url(../images/wbs_header_w.png) left top no-repeat;
	/*background:#eeeeee;*/
	margin: 20px 0 0 0;
	padding:4px 10px 10px 10px;
}
.column h3{
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:1em;
	letter-spacing:-0.075em;
	font-weight:bold;

	color:#f83666;
	border-bottom:1px dotted #f83666;
}

.column #footer {
	width:600px;
	margin:0 auto;
	padding: 0 10px 90px 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	background:url(../images/wbs_footer_w.png) bottom left repeat-x;
	background-color:#f83666;/*#000000;*/
	/*color:#423f3e;*/
} 
.column #footer p {
	/* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	/* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	margin: 0; 
	padding: 0px 0;
}
.column #header {
	background:#111111;
	color:#eeeeee;	
	text-align:left;
}
.column #header a:hover{ color:white; }
.column #header p{ padding-left:347px; }

#menu .c{ position:relative; margin:0 auto; width:616px; height:46px;}
#m1, #m2, #m3, #m4, #m5, #m6 { position:relative; height:46px; float:left;}
#m1{ background:url(../images/wbs_m1w.png); width:67px;left:0px;}
#m2{ background:url(../images/wbs_m2w.png); width:85px;margin-left:40px;}
#m3{ background:url(../images/wbs_m3w.png); width:117px ;left:0px;}
#m4{ background:url(../images/wbs_m4w.png); width:96px ;left:0px;}
#m5{ background:url(../images/wbs_m5w.png); width:86px ;left:0px;}
#m6{ background:url(../images/wbs_m6w.png); width:81px ;float:right;}
a#m1:hover{ background:url(../images/wbs_m1w_h.png);}
a#m2:hover{ background:url(../images/wbs_m2w_h.png);}
a#m3:hover{ background:url(../images/wbs_m3w_h.png);}
a#m4:hover{ background:url(../images/wbs_m4w_h.png);}
a#m5:hover{ background:url(../images/wbs_m5w_h.png);}
a#m6:hover{ background:url(../images/wbs_m6w_h.png);}

a.preview img{ margin: 8px 0px 0px 0px;}
a.preview:hover img{ outline:1px solid #f83666;}


.allbox{ background:none; position:absolute; width:100%;top:0; left:0;}
.blackbox{background:#000000; position:absolute; width:100%; top:0; left:0;}
.framebox{position: absolute; overflow:visible; cursor:default; background:#423f3e;}
.whitebox{ cursor:default; }
.photo{margin:0 auto;}
.gloss{}
.watermark{background:url(../images/wbs_f.png) 97% 97% no-repeat;}
.altStateTip{ display:block; width:100%; text-align:center; font-size:0.8em; color:#aaaaaa; background:#423f3e;
	padding:4px 0 4px 0; margin-top:10px;}

a.preview_s{margin:0;padding:0;}
a.preview_s img{ margin: 0px 0px 0px 0px; float:left;}
a.preview_s:hover img{ margin: 0px; border: none;} /*1px solid #666;}*/

.spacer{height:80px; width:1px;clear:both; }
.filler{float:left; background:#f1f1f1;height:150px;width:150px;}
.clear{clear:both; height:1px; width:1px;}