/* apply to all the elements */
* { margin: 0; padding: 0; }

/* html elements */
body
{
    font-size: 62.5%;
    font-family: Arial, Sans-Serif;
    background: url(images/page_bg.gif) repeat-x #fff;
    color: #939598;
}
img
{
    border: none;
}

/* wrappers, ideed elements and classes */

.whole-wrapper
{
    width: 100%;
    overflow: hidden;
}
#top-container
{
    width: 843px;
    height: 98px;
    margin: 0 auto;
    overflow: hidden;
}
#top-container #logo
{
    width:153px;
    height: 80px;
    float: left;
    margin-top: 8px;
    margin-left: 10px;
	display: inline;
}
#top-container #login-box
{
    float: right;
    margin-top: 15px;
    margin-right: 10px;
    text-align: right;
    overflow: hidden;
}
#login-box label, #login-box strong
{
    font-size: 1.2em;
    color: #939598;
    line-height: 25px;
    margin-right: 5px;
}
.blue-bar
{
    background: url(images/blue_bar_bg.gif) repeat-x;
}
#blue-bar-container
{
    width: 843px;
    height: 24px;
    margin: 0 auto;
    overflow: hidden;
}
#blue-bar-container ul, #blue-bar-container li
{
    list-style: none;
}
#blue-bar-container ul
{
    float: right;
    margin-top: 4px;
    margin-right: 10px;
}
#blue-bar-container li
{
    display: inline;
    margin-right: 40px;
}
#blue-bar-container li.last
{
    margin-right: 0;
}
#blue-bar-container ul li a
{
    font-size: 1.3em;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
}
#blue-bar-container ul li a:hover
{
    color: #FAA21E;
}
.banner-bar
{
    background: url(images/banner_bar_bg.gif) repeat-x;
}
#banner-bar-container
{
    width: 843px;
    height: 261px;
    background: url(images/banner_bar_container_bg.gif) repeat-y;
    margin: 0 auto;
    overflow: hidden;
}
#banner-bar-container #banner
{
    width: 548px;
    height: 257px;
    float: left;
    margin-top: 4px;
    margin-left: 10px;
	display: inline;
    overflow: hidden;
}
#banner-bar-container #preferrence-container
{
    width: 270px;
    height: 257px;
    float: right;
    padding-top: 4px;
    margin-right: 10px;
	display: inline;
    overflow: hidden;
}
#preferrence-container .container
{
    width: 270px;
    height: 34px;
    margin-bottom: 4px;
    background: #FAA21E;
    overflow: hidden;
}
#preferrence-container .container label
{
    font-size: 1.7em;
    float: left;
    margin-top: 7px;
    margin-left: 5px;
    margin-right: 5px;
    color: #fff;
}
#preferrence-container .container select
{
    float: right;
    font-size: 1.1em;
    padding: 2px;
    margin-top: 7px;
    margin-right: 5px;
}
#preferrence-container .container .go
{
    float: right;
    width: 47px;
    margin-top: 7px;
    margin-right: 5px;
}
#preferrence-container #help-container
{
    width: 270px;
    height: 143px;
    background: url(images/help_container_bg.jpg) no-repeat left 1px;
    overflow: hidden;
}
#help-container p
{
    display: block;
    float: right;
    font-size: 1.8em;
    text-align: right;
    margin-top: 25px;
    margin-right: 20px;
    margin-bottom: 5px;
    color: #94AFBE;
}
#help-container a
{
    display: block;
    float: right;
    width: 80px;
    height: 20px;
   background: url(images/start_chat_button.gif) no-repeat;
    margin-right: 20px;
}
#content-container
{
    width: 843px;
    margin: 0 auto;
    padding-bottom: 10px;
    background: url(images/content_container_bg.gif) repeat-y;
    overflow: hidden;
}
#content-container-bottom
{
    width: 843px;
    height: 10px;
    margin: 0 auto 20px;
    background: url(images/content_container_bottom.gif) no-repeat;
}
#content-container .left-container
{
    width: 550px;
    float: left;
    margin-left: 5px;
    padding: 15px 20px 0 15px;
    overflow: hidden;
}
.left-container h1
{
    font-size: 3em;
    color: #1F99D5;
    display: block;
}
.left-container .at-your-pace
{
    width: 121px;
    height: 27px;
    float: right;
    margin-right: 130px;
    margin-bottom: 30px;
}
.left-container h2
{
    font-size: 1.8em;
    color: #81A0C2;
    display: block;
    margin-bottom: 20px;
}
.left-container strong
{
    font-size: 1.4em;
    font-weight: bold;
    color: #FAA21E;
    display: block;
    margin-bottom: 20px;
}
.left-container p
{
    font-size: 1.2em;
    color: #939598;
    line-height: 25px;
    display: block;
    margin-bottom: 15px;
}
#content-container .right-container
{
    width: 243px;
    float: right;
    margin-right: 5px;
    padding-top: 5px;
    padding-right: 5px;
    overflow: hidden;
}
.right-container h2
{
    font-size: 1.2em;
    color: #5371AF;
    display: block;
    text-align: right;
    margin-bottom: 10px;
}
.right-container .empty-space
{
    width: 241px;
    height: 180px;
}
/* usable classes */
.clear       { clear: both; }
.align-left  { text-align: left; }
.align-right { text-align: right; }
.block       { display: block; margin-bottom: 5px; }
.strong      { font-weight: bold; }
.black       { font-family: "Arial Black"; }
.italic      { font-style: italic; }

