*{ margin:0; padding:0; }
a{ text-decoration: none; }
html, body{ font: 75% Arial, Helvetica, sans-serif; }
html{ background:#fff url("images/page_gradient.png") repeat-x top;  }
#page-container{ width: 800px; margin: 0 auto; }
#content{ background: url("images/grad1.gif") repeat-y right; width: 800px; float: left; }
	#happy-mask{ background: url("images/happy_mask.gif") no-repeat 100% 45px; float: left; width: 100%; }
		#sad-mask{ background: url("images/sad_mask.gif") no-repeat bottom left; float: left; width: 100%; }

#navigator{ float: right; width: 600px; height: 59px; background: url("images/nav_background.png") no-repeat; }
#navigator ul{ text-align: right; margin: 10px 10px 0 0; }
#navigator ul li{ display: inline; list-style: none; background: url("images/menu_separator.gif") no-repeat left center; padding: 0 5px 0 15px; }
#navigator ul li.first{ padding-left: 0; background: url("images/menu_separator.gif") no-repeat left center; padding: 0 5px 0 15px;; }
#navigator ul li a{ color: #a61c2b; font-size: 1.35em; }
#navigator ul li.on a{ color: #000; }

#logo{ float: left; position: relative; left: 23px; top: -15px; }
#logo a{ display: block; background: url("images/logo.png"); width: 369px; height: 79px; text-indent: -9999px; }

#left-side{ margin-left: 185px; margin-top: 20px; width: 385px; background: url("images/contentbox_bg.gif") repeat-y center; float: left; clear: left; }
#left-side .head{ background: url("images/contentbox_head.gif") no-repeat top center; padding: 20px 25px 20px 20px; min-height: 400px; }

#right-side{ float: right; width: 224px; background: #be263a url("images/grad2.gif") repeat-x bottom; margin-top: 55px; }
#right-side .head{ background: url("images/right-column_head.png") no-repeat top center; position: relative; top: -17px; padding: 57px 15px 10px; border-left: 1px solid #bebebe; border-bottom: 1px solid #bebebe; margin-bottom: -17px; }

#single-side{ float: right; width: 615px; background: url("images/contentbox2_bg.gif") repeat-y center; margin-top: 45px;}
#single-side .head{ background: url("images/contentbox2_head.png") no-repeat top center; position: relative; top: -20px;  padding-top: 35px; }

#footer{ background: #000; color: #fff; font-size: 1.1em; width: 800px; float: left; clear: both; }
#footer p{ padding: 6px 10px; float: left; }
#footer p.tld{ padding: 6px 10px; float: right; }
#footer p.tld a{ color:#fff; text-decoration:underline}
/* site wide elements */
.inside{ padding:12px; }

/* clearing floats */
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

/* others */
.hide{ display: none; }
.show{ display: block; }
.show_{ display: inline; }
.underline{ text-decoration: underline; }
.i{ font-style: italic; }
.r{ text-align: right; }
.l{ text-align: left; }
.c{ text-align: center; }
.b{ font-weight: bold; }
.s{ text-decoration: line-through; }
.u{ text-decoration: underline; }
.b{ font-weight: bolder; }
.i{ font-style:italic; }
img,form{ border: 0; margin: 0; padding: 0; }
.fr{ float: right !important; }
.fl{ float: left !important; }
.rfr{ position:relative; float: right !important; }
.rfl{ position:relative; float: left !important; }
.clear{ clear: both; }
hr{ width:100%; height:2px; }
td{ vertical-align:top; }

.frImg{ float:right; margin: 0 0 8px 8px; clear: right; }
.flImg{ float:left; margin: 0 12px 8px 0; clear: left; }