/* General settings */
body { margin: 0; margin-top: 20px; padding: 0; background: url(../images/bg-gradient.png) repeat-x; 
       font-family: Arial, Verdana, Times New Roman; }

* { padding: 0; margin: 0; }

/* Override the Blueprint css for container. */
.container { background-color: #FFF; border: 1px solid #7F6B4B; }

.clear { clear: both; }
.spacer { line-height: 1px; clear: both; height: 1px; }
.row { line-height: 0px; clear: both; height: 0px; }
.row span.left { width: 49%; float: left; text-align: left; }
.row span.right { width: 49%; float: right; text-align: right; }

/* General setting for not displaying the dialog. */
.dialog { display: none; }

.footer { clear: both; font-size: 90%; }
.footer hr { width: 80%; margin: 1em auto; }

/* Override the Blueprint screen.css file to make labels normal. */
label { font-weight: normal; }
/* Place a req for label that requires input. */
.req { font-weight: bold; }
.disabled { color: #CCC; }

form,
form ul,
form ol { margin: 0; padding: 0; }

h1 { padding: 0; margin: 0; color: inherit; }
h1 img { margin-right: .5em; }
h1 div { font-weight: bolder; font-size: 150%; padding-top: .3em;}

h2 { padding: 0; margin: 0; color: inherit; }
h3 { padding: 0; margin: 0; }
h4 { padding: 0; margin: 0; }
h5 { padding: 0; margin: 0; }
h6 { padding: 0; margin: 0; }

/* General message styles */
.message { border: 1px solid #CCC; margin: 5px; background-color: #E8EFFB; padding: 0; }
.message h3 { padding: .2em; margin: 0; background: none !important; border: 0 !important; font-size: medium !important; }
.message p { line-height: normal; padding: .5em; margin: 0; }
.message .success { padding: .5em; margin: 0; background: url(/content/images/accept.png) no-repeat 5px 7px; padding-left: 30px; }
.message .info { padding: .5em; margin: 0; background: url(/content/images/information.png) no-repeat 5px 7px; padding-left: 30px; }
.message .attention { padding: .5em; margin: 0; background: url(/content/images/error.png) no-repeat 5px 7px; padding-left: 30px; color: #F90; font-weight: bolder; }
.message .error { border-style: none; padding: .5em; margin: 0; background: url(/content/images/exclamation.png) no-repeat 5px 7px; padding-left: 30px; color: #C33; font-weight: bolder;}
.message .plain { border-style: none; padding: .5em; margin: 0; background-color: #E4EFE0; }
#user-content .message div h3 { padding: 0; margin: 0; margin-bottom: .5em; }
.message .msgclose,
.message .ann-edit { display: none; float: right; padding: 4px; margin: 2px 5px; cursor: pointer; }
.message .msgclose { display: block; }
.middle-msg,
.announcement { margin-bottom: 0; margin-top: 0; }
.message .msgclose:hover,
.message .ann-edit:hover { border: 1px solid #777; padding: 3px 3px 2px 3px }
.message .announcement-form { display: none; padding: 1em; background-color: #E4EFE0; }
.announcement-form input[type=text] { width: 80%; margin-right: .5em; }
.announcement-form input[type=button] { margin-right: .5em; }
.announcement-form input[type=button]:last-child { margin-right: 0; }

/* Heading Exceptions */


/* Text Align */
    .left   { text-align: left; }
    .right  { text-align: right; }
    .center { text-align: center; }
    .all-center { text-align: center; vertical-align: middle; padding: 5% 0; }

/* Form components */

    /* Remove the previous settings from blueprint  */
    input.text, input.title, select, textarea { margin: 0; }
    
    input,
    textarea,
    select { border: 1px solid #CCC; padding: 2px; }

    select { height: auto; max-width: 250px; }
    
    textarea { width: 250px; height: 50px; }
    
    input:focus,
    textarea:focus
    select:focus { border: 1px solid #9F804B; }

    /* Button styles. */
    input[type=button].action,
    input[type=submit].action { background-color: #FFBD4B;
                                border-top: 1px solid #fff; border-left: 1px solid #fff;
                                border-right: 1px solid #9F804B; border-bottom: 1px solid #9F804B;
                                text-align: center;
                                vertical-align: bottom;
                              }
    input[type=button],
    button { border-top: 1px solid #fff; border-left: 1px solid #fff;
            border-right: 1px solid #9F804B; border-bottom: 1px solid #9F804B;
            padding: .2em 5px;
            text-align: center; vertical-align: bottom; }

/* Form flow */
    /* Example: label:
                inputbox 
    */
    .form-label-top-right { text-align: right; vertical-align: bottom; }
    .form-label-top-right li { float: left; list-style-type: none; margin-right: 10px; }
    .form-label-top-right li label,
    .form-label-top-right li a,
    .form-label-top-right li input { clear: both; float: left; text-align: left; margin: 0.5em 0; }

    /* Example:     label: inputbox     
        (Two-column form)    
    */
    .form-label-left { }
    .form-label-left li { width: 100%; list-style-type: none; clear: both; padding: 1em 0 .5em 0; }
    .form-label-left li label { float: left; width: 40%; }
    .form-label-left li label.left { text-align: left; }
    .form-label-left li label.right { text-align: right; }
    .form-label-left li span { float: right; width: 59%; text-align: left; padding: 0; }

    
    /* form inside a "component" */
    .form-label-component { }
    .form-label-component li { width: 100%; list-style-type: none; clear: both; padding: 1em 0 .5em 0; }
    .form-label-component li label { float: left; width: 80px;}
    .form-label-component li label.left { text-align: left; }
    .form-label-component li label.right { text-align: right; }
    .form-label-component li span { float: right; text-align: left; padding: 0; width: 75%;}
    .form-label-component li textarea { height: 10em; }    
    
    /* Example:     label: inputbox   checkbox
        (multi-column form)
    */
    .form-columns { }
    .form-columns li { list-style-type: none; height: auto; clear: both; padding: 1em 0 .5em 0; }
    .form-columns li label { list-style-type: none; }
    .form-columns li label.left { text-align: left; }
    .form-columns li label.right { text-align: right; }

    /* Cxception for the validation boxes to line up. */
    .form-columns input,
    .form-columns select,
    .form-columns textarea { float: left; } 

    /* Example:     ctrl label  [ctrl]     button
        (multi-column form)
        1st ctrl = radio button or checkbox.
        2nd ctrl = edit boxes/dropdown list
    */
    .validation { float: left; width: auto; margin-left: 10px; }
    .validation-block { float: left; border-style: solid; width: 0px; height: 0px; line-height: 0px; }
    .validation-left { float: left; border-width: 11px 11px 11px 0px; border-color: White #D1D1EF White #D1D1EF; }
    .validation-msg { float: left; padding: 2px 5px; border: none; background-color: #D1D1EF; }    

    #validUserName { padding-left: 2em;  margin-left: .5em;}
    .valid-ok { padding-left: .5em; background: url(/content/images/tick.png) no-repeat ; }
    .valid-no { padding-left: .5em; background: url(/content/images/cross.png) no-repeat ; }
    

/* Heading */
    #header { padding-top: 1em; }
    #blog-header { padding: 1em 0; margin-bottom: 2em; }
    #blog-header a { text-decoration: none; }
    .background { background: #FFDB9D url("../images/bg.png") repeat-x 100% 100%; }
    .logo { padding-left: 10px; }
    .byline { padding-left: 70px; }


/* Tabbed Menu */
    .menu { border-top: 1px solid #765; background-color: #FFBD4B; height: 31px; 
            background: #DAE0D2 url("../images/bg.png") repeat-x bottom; line-height:normal; 
            }
    .menu .tabs { float:left; font-size:93%; line-height:normal; }
    .menu .tabs ul { margin: 0; padding: 5px 10px 0; list-style: none; }
    .menu .tabs li { float: left; margin: 0; padding: 0; background: url("../images/left.gif") no-repeat left top; padding: 0 0 0 9px;}
    .menu .tabs a { font-weight: bold; text-decoration: none; float: left; display: block; background: url("../images/right.gif") no-repeat right top; padding: 5px 15px 6px 6px;}
    /* Commented Backslash Hack
         hides rule from IE5-Mac \*/
    .menu .tabs a {float:none;}
      /* End IE5-Mac hack */
    .menu .tabs #current { background-image: url("../images/left_on.gif"); }
    .menu .tabs #current a { background-image: url("../images/right_on.gif"); padding-bottom: 7px;}

    .menu .search { padding-top: 3px; }

/* News/Login bar. */
    .newslogin { padding: 5px 0; }


/* User Profile Page */
    .profile-bar { border: 1px solid #999; background-color: #FFF4DF; padding: 2px; margin-bottom: 5px; }
    .profile-image { float: left; border: 1px solid #CCC; padding: 1px; margin: 5px; }
    .profile-name { font-size: xx-large; padding: 0; margin: 0; line-height:normal; }
    .profile-column { height: auto; float: left; vertical-align: top; }
    .profile-column ul { list-style-type: none; padding: 0; margin: 0; }
    .profile-column ul li { margin-top: .2em; }
    .profile-column ul li a { padding-left: 20px; background-position: 0px; }

    .profile-column ul li a.sendMessage { background: url(../images/email_go.png) no-repeat; }
    .profile-column ul li a.addFriend { background: url(../images/user_add.png) no-repeat; }
    .profile-column ul li a.photo { background: url(../images/photos.png) no-repeat; }
    .profile-column ul li a.friend { background: url(../images/heart.png) no-repeat; }
    .profile-column ul li a.comment { background: url(../images/comment.png) no-repeat; }
    .profile-column ul li a.review { background: url(../images/user_comment.png) no-repeat; }
    .profile-column ul li a.request { background: url(../images/door_open.png) no-repeat; }
    .profile-column ul li a.recommend { background: url(../images/sound.png) no-repeat; }
    
/* Lists of products */

    .lists-container { text-align: center; padding: 5px 0 20px 0; vertical-align: top; }

    .list-header { background-color: #FFF4DF; padding: 2px; margin: 0; border-bottom: 1px solid #776655;
                   background: url("../images/bg.png") repeat-x; }
    .list-header img { float: left; margin-right: 5px;}
    .list-header .title { width: 60%; float: left; text-align: left; font-weight: bold; }
    .list-header .options { width: 35%; float: right; text-align: right; padding-right: 3px; }
    .list-body { padding: 5px; padding-bottom: 0;}
    
    .movie-list, .music-list, .book-list { margin: 5px; text-align: left; border: 1px solid #CCC; 
                                           display: -moz-inline-box; display: inline-block;
                                           padding: 2px; vertical-align:top;
                                         }
    ol.list li { border: 1px solid #CCC; padding: .5em; clear: both; margin: .5em; 
				vertical-align: top; clear: both; list-style-position: outside; }
				
    ol.list li div.list-item { clear: both; display: inline-block; vertical-align: top; }
    ol.list li div.list-item img { float: left; margin-right: 10px; border: 1px solid #CCC; padding: 1px;}

    div.item-toolbar { padding: 2px 5px; margin: 0; border-top: 1px solid #CCC; height: 10px; margin-top: 3px; }
    div.item-toolbar .left { width: 48%; height: 10px; float: left; text-align: left; 
                             margin: 0; font-size: 90%; vertical-align: middle; padding: 0; }
    div.item-toolbar .left a { text-decoration: none; }
    div.item-toolbar .left span { position: relative; top: -3px; }
    div.item-toolbar .right { width: 50%; height: 16px; float: right; 
                              text-align: right; margin: 0; padding: 0;}

/* Product Page */

    .noHeader { border: 1px solid #CCC; margin-bottom: 10px; }
    .noHeader h1 { padding: .5em 0; font-size: 150%; }
    .noHeader img { margin: 10px; padding: 1px; border: 1px solid #CCC; }

    .related { margin: 10px; }
    .related h4 { border-bottom: 1px solid #000; font-weight: bold; }
    .related ul { list-style: none; margin-top: 1em; }
    .related ul li img { border: 0 none; margin: 0; padding: 0; }
    
    .product-details img { float: left; }

    .product-choices { clear: both; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; margin: 0 10px;}
    .product-choices img { padding: 0; margin: 0; vertical-align: middle; border: 0; }
    .product-choices .left { margin: 0; padding: 0; width: 39%; float: left; text-align: left; }
    
    .product-options { list-style: none; display: inline-block; float: right; text-align: left; 
                       margin: 0; padding: 0; width: 12em; font-size: 85%; margin-top: 1em; }
    .product-options li { list-style: none; clear: both; line-height: 2em; }
    .product-options li span { display: block; float: left; padding-left: 5px;}
    .product-options li img { border: 0 none; margin: .2em .3em; padding: 0; }
    
    
/* Product mini-tabs */

    .ui-tabs .ui-tabs-panel { background-color: #FFF5E3 !important; min-height: 100px; }
    .ui-tabs div.panes { clear: both; background-color: #FFF5E3 !important; min-height: 100px; }
    
    #minitabs {
        margin: 0;
        margin-top: 15px;
        padding: 0 0 20px 10px;
        border-bottom: 1px solid #000;
        }

    #minitabs li {
        display: inline;
        overflow: hidden;
        list-style-type: none;
        }
    	
    #minitabs li a, li.ui-tabs-selected a {
        border-top: 1px solid #CCC;
        border-left: 1px solid #CCC;
        border-right: 1px solid #CCC;
        float: left;
        font-size: 12px;
        line-height: 11px;
        margin: 0 5px;
        padding-bottom: 2px;
        text-decoration: none;
        color: #000;
        }

    #minitabs li.ui-tabs-selected a {
        background-color: #FFF5E3;
        border-top: 1px solid #000;
        border-left: 1px solid #000;
        border-right: 1px solid #000;
        border-bottom: 1px solid #FFF5E3; 
        color : black;  
        font-weight: bold;
        font-size: 12px;
        line-height: 11px;
        }

    #minitabs li a:hover {
        color: #000;
        background: #FFDC9F;
        /*
        */
    }


    #minitabs li.ui-tabs-selected a:hover {
        background: #FFF5E3;
        color: #000;
        border-bottom: 1px solid #FFF5E3; 
        /*
        */
    }

    
    
/* Component Site layout */
    
    .component { border: 1px solid #CCC; padding:2px; margin-bottom: 1em; }
    .component h3 { font-size: 100%; border-bottom: 1px solid #765; padding: 3px; font-weight: bolder; background: url(../images/bg.png) repeat-x; }
    .component h3 img { padding-right: .3em; vertical-align: middle; }
    .component h3 span.left { float: left; width: 50%; text-align: left; color: #000; }
    .component h3 span.right { float: right; width: 50%; text-align: right; color: #000;}
    .component .body { text-align: left; background-color: #FFF4DF; padding: 0; margin: 0; }
    
    .component .body ul.bio { list-style: none; padding: 0 5px; margin: 0; }
    .component .body ul.bio li { list-style: none; padding: 0 5px; margin: 0; clear: both; }
    
    ul.bio li span.left-box { width: 35%; float: left; text-align: right; }
    ul.bio li span.right-box { width: 64%; float: right; text-align: left; }
    
    .component .body ul.bio li.subhead { padding-top: 5px; margin-bottom: 5px; border-bottom: 1px solid #CCC; width: 80%; 
                                         font-weight: bold; }
    
    .component .body .profile-form { padding: 10px; text-align: center; }
    .component .body .profile-form img { padding: 1px; border: 1px solid #CCC; }
    
    .component .body .recommended { margin: 0; }
    .component .body .recommended li.entry { border-bottom: 1px solid #CCC; }
    .component .body .recommended li.entry img { padding: 1px; margin: 5px; }
    
    .component ol { margin: 1em 3em; }    
    .component ol li { margin-bottom: .5em; }
    
div.topspace { padding: 10px 0; clear: both; }

/* Opinion List (Comments & Reviews) */

    .user-list { list-style-type: none; margin: 0; padding: 0; }
    .user-list > li { list-style-type: none; display: block; clear: both; border-bottom: 1px solid #CCC; }
    /* .user-list > li:last-child { border-bottom: none; } */
    .user-list hr { margin: 10px 0 5px 0; clear: both; }
    
    li.entry { display:block; padding: 5px; clear: both; list-style: none; }
    li.entry .profile { float: left; margin: 0 1em; text-align: center; }
    li.entry .profile img { border: 1px solid #CCC; padding: 1px; margin: 0 auto; }

    li.entry .product { text-align: left; height: 100%; padding: 0 .5em; float: left; }
    li.entry .product a { width: 7em; display: inline-block;  }
    li.entry .product img { border: 1px solid #CCC; padding: 1px; }

    li.entry .data ul { list-style: none; padding: 0; margin: 0; }
    li.entry .data ul li { list-style: none; clear: both; padding: 0; margin: 0; }
    li.entry .data ul li h4 { clear: both; height: auto;  }
    
    /*
    li.entry .details { text-align: left; margin: 0; padding: 0; width: 15em; float: right; }
    */
    li.entry .details {  }
    li.entry .details .date { text-align: right; font-size: 80%; font-weight: bolder; margin-bottom: 5px; }
    li.entry .details p { text-align: left; }
    
    li.entry .title h4 { height: auto; font-weight: bold; }
    li.entry .rating label,
    li.entry .review-text label { font-weight: bold; }
        
    .user-list li .quotes { display: block; vertical-align: top; }
    .user-list li .quotes .heading {  }
    .user-list li .quotes .heading span { float: right; text-align: left; font-size: 80%; }
    .user-list li .quotes .heading span.username { margin: 0; padding: 0; font-size: 130%; font-weight: bold; }
    .user-list li .quotes .heading span:last-child { float: right; text-align: right; font-size: 80%;}

    .user-list li .quotes .leftquote { height: auto; background: url(../images/quoleft.gif) no-repeat top left; margin-left: 7em; }
    .user-list li .quotes .rightquote { padding-left: 40px; padding-top: 10px; padding-right: 7em; height: auto; 
                                        background: url(../images/quoright.gif) no-repeat bottom right; }
    
    .user-list li .review { height: auto; clear: both; }
    .user-list li .review .rating { float: left; clear: both; }
    .user-list li .review .rating img { border: 0; margin: 0; padding: 0; }
    
    .user-list li .video-profile { width: 13em; }
    .user-list li .video-description { margin-top: 10px; }
    
    .review-list { list-style-type: none; margin: 0; padding: 0; }
    .review-list > li { list-style-type: none; display: block; padding: 5px; clear: both; border-bottom: 1px solid #CCC; }
    .review-list > li:last-child { border-bottom: none; }
    
    .review-list li .profile { width: 4em; float: left; }
    .review-list li .profile img { border: 1px solid #CCC; padding: 1px; }

    .review-list li .quotes { display: block; float: left; width: 85%; vertical-align: top; background: url(../images/quoright.gif) no-repeat bottom right; }
    .review-list li .quotes .heading { width: 100%; }
    .review-list li .quotes .heading span { float: left; width: 60%; text-align: left; }
    .review-list li .quotes .heading span.username { margin: 0; padding: 0; font-size: 130%; font-weight: bold; }
    .review-list li .quotes .heading span:last-child { float: right; width: 30%; text-align: right; font-size: 80%;}

    .review-list li .quotes .leftquote { height: auto; clear: both;}
    .review-list li .quotes .rightquote { padding-left: 40px; padding-top: 10px; padding-right: 30px; height: auto; background: url(../images/quoleft.gif) no-repeat top left; }

/* Friends Component */
    
    ul#friends { float: left; list-style-type: none; display: inline; text-align: center; 
                 border: none; margin: 0; padding: 0;}
    ul#friends li { float: left; margin: 5px; padding: 5px; text-align: center; list-style-type: none; 
                   min-height: 100px; width: 87px;}
    .component ul#friends li { width: 65px; }
    ul#friends li div.details { font-size: 85%; }
    ul#friends li img { border: 1px solid #CCC; padding: 1px; clear: both; }
    ul#friends li a { text-align: center; clear: both; padding: 0; margin: 0; display: block; }
    ul#friends li p { margin: 0; font-size: smaller; }
    
/* Albums/Photos */

    ul#photos { float: left; list-style-type: none; display: inline; text-align: center; border: none;}
    ul#photos li { float: left; margin: 10px; padding: 5px; text-align: center; list-style-type: none; 
                   border: 1px solid #CCC; width: 87px; }
    ul#photos li div.details { font-size: 85%; }
    ul#photos li .album { height: 90px; line-height: 90px; }
    ul#photos li .album img { line-height: 90px; vertical-align: middle; }

/* User Preferences */
    
    #user-prefs { list-style-type: none; margin: 0; padding: 10px 10px; padding-right: 0; 
                    background-color: #FFF4DF; border: 1px solid #765; 
                    z-index: 0; position: relative; }
    #user-prefs ul { padding-right: 0; }
    #user-prefs li { margin: 0; padding: 2px 5px; }
    #user-prefs li img { margin: 0; padding: 0 5px 0 0; }
    #user-prefs li.active { background-color: #FFF;
                          width: 128px; 
                          border-top: 1px solid #9F804B;
                          border-bottom: 1px solid #9F804B;
                          border-left: 1px solid #9F804B;
                          font-weight: bold; }

    /* User Content */
    #user-content { border: 1px solid #765; 
                    z-index: 999; 
                    margin-left: -11px;
                    min-height: 325px;
                    height: auto;
                    padding: 1em 0;
                    }
    /* General settings for user-content data */
    #user-content h3 { margin: .625em 0; }
    #user-content img { border: 1px solid #CCC; padding: 1px; }
    #user-content .checkbox {  }
    #user-content .checkbox input { margin-right: 10px; }
    #user-content ol { list-style-type: decimal; margin-left: 10em; }
    #user-content ol li { list-style-type: decimal; margin: 0; padding: 0; padding-bottom: 2em; }
    
    /* User-Content lists */
    #user-content ol#list { text-align: left; margin: 2em 10em; }

    ol#list li { border: 1px solid #CCC; padding: .5em; clear: both; margin: .5em; 
				vertical-align: top; clear: both; }
    ol#list li:hover { background-color: #FFF4DF; cursor: move; }
    ol#list li div.list-entry { width: 35em; display: inline-block; vertical-align: top; }
    ol#list li div.list-entry img { float: left; margin-right: 10px; }
    ol#list li span.delete { float: right; border: none; padding: 0; 
                             margin: 0; background: none; cursor: pointer; }
    ol#list li span.delete button.listDelete { border: none; padding: 0; margin: 0; 
                                               background: none; cursor: pointer;}
    ol#list li span.delete button.listDelete img { border: none; padding: 0; margin: 0; }

    
    #user-content .general li:hover { background-color: #FFF4DF; }
    #user-content hr { width: 75%; background: #CCC none repeat scroll 0 0; 
                         border: medium none; clear: both;
                         float: none; color: #CCC;
                         height: 0.1em; margin: 2em auto; }
    
    .left-section { float: left; width: 49%; padding-left: 1em; }
    .right-section { float: right; width: 40%; text-align: right; padding-right: 1em; }
    
/* Grid Layout */

    .toolbar { padding: 1em 0; font-size: 85%; }
    
    table#grid-layout { padding: 0; margin: 0; clear: both; }
    table#grid-layout thead td { background-color: #FFF4DF; font-weight: bold; 
                                 border-bottom: 1px solid #765; border-top: 1px solid #765;
                                 color: #765; }
                                 
    table#grid-layout tr.alt { background-color: #EFFFFF; }
    
/* Pager display */

    .pager { background-color: #FFF4DF; padding: .5em 0; 
             border: 1px solid #765; }
    .pager-disabled { color: Gray; }
    .pager-current-page { font-weight: bold; padding: 5px; margin: 5px; }
    .pager #numbers a { padding: 5px; margin: 5px; }
    
/* Dialog settings (Taken from the jQuery UI) */

    .ui-dialog { background-color: #FFF; border: 1px solid #765; }
    .ui-dialog-titlebar-close span { display: none; } /* remove the 'x' */
    .ui-dialog-titlebar { /*resets*/margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none;
        background: url(../images/bg.png) repeat-x; margin: 5px; margin-bottom: 0; border-bottom: 1px solid #765; padding: .3em .4em;
        font-weight: bolder;
    }
        
    .ui-dialog-titlebar-close  	
    {
        /*resets*/margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none;
	    background: url(../images/888888_11x11_icon_close.gif) 0 0 no-repeat;
	    position: absolute;
	    right: 8px;
	    top: .5em;
	    width: 11px;
	    height: 11px;
	    z-index: 100;
    }
    .ui-dialog-content { /*resets*/margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none;
	    background-color: #FFF4DF; color: #222222; padding: .5em .7em; }
    .ui-resizeable-e { background-color: #FFE8C1; }
    
    .ui-dialog-buttonpane {
	    position: absolute;
	    bottom: 0;
	    width: 100%;
	    text-align: right;
	    border-top: 1px solid #aaaaaa;
	    background: #FFF4DF;
    }

    .ui-dialog-buttonpane button {
	    margin: .5em 8px .5em .5em;
        border-top: 1px solid #fff; border-left: 1px solid #fff;
        border-right: 1px solid #9F804B; border-bottom: 1px solid #9F804B;
	    cursor: pointer;
	    padding: .2em .6em .3em .6em;
	    line-height: 1.4em;
    }

    .ui-dialog-buttonpane button:active {
	    background: #FFBD4B;
    }
    
    #dialog .form-columns li div { width: 5em; }

    #dialog ul { float: left; vertical-align: middle; }
    #dialog ul li { float: left; }
    #dialog ul li div { float: left; }
    
    #dialog fieldset.preview { clear: both; border: 1px solid #765; padding: .4em; margin: 0; 
                               max-width: 290px; max-height: 100px;
                               min-width: 290px; min-height: 100px;
                               width: 290px; height: 100px; }
    #dialog fieldset.preview legend {  }
    
    fieldset.preview div.loading { border-top: 1px solid #fff; border-left: 1px solid #fff;
        border-right: 1px solid #9F804B; border-bottom: 1px solid #9F804B; background-color: #FFF;
        width: 15em; height: 3.5em; text-align: center; margin: auto auto; }
    fieldset.preview div.loading span { padding: 1em 0; }
    fieldset.preview div.loading img { margin: .2em .5em; padding: 0; vertical-align: middle; }
    
    fieldset.preview .preview-entry img { float: left; padding: 0; margin: 0; margin-right: 10px; }
    
/* Registration screen */

    ol#registration-menu { margin: 0; padding: 10px 25px; padding-right: 0; 
                    background-color: #FFF4DF; border: 1px solid #765; 
                    z-index: 0; position: relative; }
    ol#registration-menu > li { margin: 0; padding: 2px 5px; }

    ol#registration-menu > li.active { background-color: #FFF;
                          width: 113px; 
                          border-top: 1px solid #9F804B;
                          border-bottom: 1px solid #9F804B;
                          border-left: 1px solid #9F804B;
                          font-weight: bold; }
    ol#registration-menu > li.inactive { color: #CFCFCF; }
    ol#registration-menu > li.completed { background: url(../images/tick.png) no-repeat top left; 
                                          list-style-type: none; margin-left: -20px; padding-left: 25px;
                                          text-decoration: line-through;}

    li div.agreement input { float: none; margin-right: 10px; }
    
/* TriBar */

    .tri-bar { margin: .5em 0; }
    .tri-bar img { float: left; padding: 0; margin-left: 10px; margin-right: -7px; margin-top: -7px; }

    .tri-box { height: 24px; border: 1px solid #7F6B4B; background-color: #FFBD4B; margin: 0 auto; padding: 2px 5px; }
    .tri-box span { font-weight: bold; padding-left: 1.5em; }
    .tri-box input[type=image] { padding: 0; margin: 0; width: auto; border: 0; vertical-align: middle; }
    .tri-box select { border: 1px solid #9F804B; padding: 2px; margin: 0; }
    .tri-box input { border: 1px solid #9F804B; padding: 2px; margin: 0; width: 60%; }

    .tri-box .twitter { padding: 0; margin: 0; }
    .tri-box .twitter input { width: 15px; margin-left: 10px; vertical-align: middle; }
    .tri-box .twitter img { float: none; margin: 0; padding: 0; vertical-align: middle; margin-right: 10px; }
    
/* TriBar List of Entries */

    ul.tribar { text-align: left; }
    ul.tribar li.tribar-date { clear: both; text-align: right; border-bottom: 1px solid #000; 
                               list-style-type: none; margin-top: 1em; font-size: 90%; }
    ul.tribar li.entry { clear: both; display: block; list-style-type: none; margin-top: 1em;
                         border-bottom: 1px solid #CCC; }
        
    ul.tribar li.entry .details { float: none; }
        
/* User-Sections (Photos, friends, blog, news, etc.)*/

    #user-section-content { border: 1px solid #CCC; }
    #user-section-content ul img { border: 1px solid #CCC; padding: 1px; }
    
/* Search Page */

    .search-container { border: 1px solid #CCC; margin-bottom: 1em; padding: 1em; }
    .search-body { padding-bottom: 1em; padding-top: 3px;}
    .search-body ul { list-style: none; float: left; vertical-align: middle; }
    .search-body ul li { list-style: none; float: left; }
    .search-body ul li:first-child { padding-top: 2px; }
    .search-body input[type=text] { padding-right: 0; margin-right: 0; border: none; }
    .search-body a { text-decoration: none; }
    .search-body .searchbox { border: 1px solid #CCC; background-color: #FFF; }
    .search-body #search-selected { padding: 3px; }
    .search-body span#divider { margin:2px 5px; border-right: 1px solid #CCC; }
    
    .search-body ul li ul { display: none; position: absolute; top: 26px; left: 17em; 
                        width: 10em; border: 1px solid #CCC; background: white; z-index: 999;
                        float: none; }
    .search-body ul li ul li { display: block; float: none; padding-left: 10px; background-color: #FFF; }
    .search-body ul li ul li:hover { background-color: #FFF4DF; }
    
    .search-body ul li ul a { border: none; }
    .edit-focus { border: 1px solid #765 !important; }
    
    ul#search-list { padding: 0; margin: 0 1em; }
    ul#search-list li { clear: both; list-style: none; margin: .5em 0; }
    ul#search-list li.entry { display:block; padding: .5em 0; border: 1px solid #CCC; height: auto; width: 100%; }
    ul#search-list li.entry:hover { background-color: #EFF4FF;}
    
    ul#search-list li.entry .product { height: 100%; padding: 0 .5em; text-align: center; width: 6em; }
    ul#search-list li.entry .product img { border: 1px solid #CCC; padding: 1px; margin-right: 2em; }

    ul#search-list li.entry .profile { height: 100%; padding: 0 .5em; text-align: center; }
    ul#search-list li.entry .profile img { border: 1px solid #CCC; padding: 1px; margin-right: 2em; }

    ul#search-list li.entry div.menu-float { float: right; text-align: left; font-size: 80%; }
    ul#search-list li.entry div.menu-float a { text-decoration: none; padding: 3px 0; }
    ul#search-list li.entry div.menu-float a img { float: left; padding: 0; margin: 0; padding-right: 5px; }
    
    ul#search-list li.entry h4 { clear: both; height: auto; }
    ul#search-list li.entry .search-details { float: left; clear: both; height: auto; font-size: x-small; }
    
/* Rolodex */
    #rolodex * { padding: 0; margin: 0; }
    #rolodex { float: left; padding: .5em; }
    /* filter */
    #rolodex-filter { clear: both; float: left; background-color: #FFF; padding: .5em;
                      border: 1px solid #CCC; margin-bottom: 1em;}
    #rolodex-filter input { padding: 2px; }
    
    ul#rolodex-tabs { list-style: none; width: 3em; float: left; }
    ul#rolodex-tabs li { list-style: none; text-align: center; border: 1px solid #CCC; border-right: 1px solid #765; }
    ul#rolodex-tabs li a { padding: .2em 1em; text-decoration: none;}
    ul#rolodex-tabs li:hover { background-color: #DDD; }
    ul#rolodex-tabs li.selected:hover { background-color: #DDD; }
    ul#rolodex-tabs li.selected { border: 1px solid #765; border-right: none; background-color: #FFF;
                                  color: #000; margin-right: -1px;}
    ul#rolodex-tabs li.disabled:hover { background-color: inherit; }
    ul#rolodex-tabs li.disabled { color: #ccc; }
    
    ul#rolodex-users { border: 1px solid #765; border-left: none; 
                       background-color: #FFF; width: 15em; float: left; overflow: auto; 
                       max-height: 43em; min-height: 43em; }
    ul#rolodex-users li { list-style: none; display: block; clear: both; padding: .3em 1em; }
    ul#rolodex-users li:hover { background-color: #EFF4FF; }
    
    ul#rolodex-users li input[type=checkbox] { margin-top: .3em; float: left; margin-right: .5em;}
    ul#rolodex-users li div { display: block; padding-left: 1.5em; }

    ul#rolodex-users li label { padding-left: 5px; display: block; }
    ul#rolodex-users li label:first-child { font-size: small; font-weight: bold; } 
    ul#rolodex-users li label:last-child { font-size: smaller; clear: both; }
    
    ul#rolodex-users li.group { padding: 0; margin: 0; margin: 0 10px; 
                                border-bottom: 1px solid black; text-align: left; font-size: medium;} 
    ul#rolodex-users li.group:hover { background-color: inherit; }
    
/* Featured product */

    .featured { float: left; border: 1px solid #CCC; padding: 1em; background: url(/content/images/feature-bg.png) repeat-x; }
    .featured #profile { text-align: center; }
    .featured #profile img { border: 1px solid #CCC; padding: 1px; }
    .featured #data {  }
    .featured #data ul {  }
    .featured #data ul li { font-size: large; }
    .featured #data .leftquote { height: auto; clear: both; background: url(../images/quoright.gif) no-repeat bottom right; }
    .featured #data .rightquote { padding-left: 40px; padding-top: 10px; padding-right: 30px; height: auto; background: url(../images/quoleft.gif) no-repeat top left; }
    

/* Quick Rating control */

    span.rating { padding: 0; margin: 0; }
    span.rating img.rate { border: 0; padding: 0; margin: 0; }
    span.rating span#numRating { padding: 5px; }

/* Home Page */
.features { clear: both; margin-bottom: 3em; }
.media-column {  }
.media-column img { margin: 2em auto; }
.media-column h3 { text-align: center; }
.media-column h4 { height: auto; line-height: 1.5em; }
.media-column:last-child { padding: 0 0 0 5px; border-right: none; }
.middle { border-right: 1px dotted #CCC;
          border-left: 1px dotted #CCC;
          padding: 0 5px; }

/* Learning page */
.learn-section { margin-bottom: 20px; }
.learn-section .learn-entry { border: 1px solid #CCC; padding: 20px; clear: both; 
                              background: url(/content/images/header-bg-rev.png) repeat-x 0 0; }
.learn-section p { margin-bottom: 0; }
.learn-section h3 { display: inline; border-top: 1px solid #CCC; border-left: 1px solid #CCC; 
                    border-right: 1px solid #CCC; padding: 0 10px; margin: 0;
                    z-index: 999; border-bottom: 2px solid #FFF; }
.learn-entry span.left { width: 60%; float: left; }
.learn-entry span.right { width: 40%; float: right; }
.learn-entry img { border: 1px solid #CCC; }

/* Photo Carousel */

    .photo-list fieldset * { margin: 0; padding: 0; border: 0 none; }
    .photo-list fieldset { border: 0 none; margin: 0 auto; width: 1%; }
    .photo-list fieldset dl { margin: 0 auto; }
    .photo-list fieldset dt { padding: 2px; text-align: center; border: 1px solid #CCC; border-bottom: 0 none; }
    .photo-list fieldset dt img {  }
    .photo-list fieldset dd { font-size: 82%; padding:5px; border: 1px solid #CCC; text-align: center; background-color: #FFF4DF; }
    
/* Users Dashboard */
.dashboard, 
.dashboard li { margin: 0; padding: 0; list-style: none; }
.dashboard li { padding: .5em 1em; }
.dashboard li p { margin: 0; }
.dashboard li p.right { font-size: 85%; }
    
/* Blog */
.article { margin-bottom: 1em; }
.article h1 { font-size: 200%; }
.article p { margin: .5em 0; }
.article p.date { border-bottom: 1px solid #CCC; font-size: 95%; } 

h3.empty { margin: 1em 0; }

/* Chat */

.chatbox * { margin: 0; padding: 0; border: 0 none; }
.chatbox { position: fixed; bottom: 0; right: 0; height: 1.5em; width: 13em; 
           border: 1px solid #777; background: #FFF; border-bottom: 0 none; }
.max { height: 25em; }
.chatbox span { font-weight: bold; }

.chat-list-container { }
.chat-list,
.chat-list li { list-style: none; margin: 0; padding: 0; }

.chat-list { overflow: scroll; height: 24em; }
.chat-list li { border: 1px solid #CCC; margin: 3px; padding: 2px; }
.chat-list li:hover { background: #FFF4DF; }

.chat-list li .profile { float: left; width: 70%; text-align: left; }
.chat-list li .profile span { text-align: left; }
.chat-list li .profile img { padding: 1px; border: 1px solid #CCC; float: left; 
                             margin-right: 5px; vertical-align: top; }
.chat-list li .status { float: right; width: 19%; text-align: right; vertical-align: middle; }

.chat-header * { margin: 0; padding: 0; border: 0 none; }
.chat-header { background: url("../images/bg.png") repeat-x scroll 0 0 transparent; 
               clear: both; border-bottom: 1px solid #CCC; }
.chat-header .left-section { float: left; width: 70%; padding: 0 5px; text-align: left; }
.chat-header .right-section { float: right; width: 20%; padding: 1px; }
.chat-header .right-section span img { font-size: 85%; vertical-align: top; }


/* Chat Window */
.chat-window * { margin: 0; padding: 0; border: 0 none; }
.chat-window { position: fixed; bottom: 0; right: 0; height: 1.5em; width: 13em; 
               border: 1px solid #777; background: #FFF; border-bottom: 0 none; }

.chat-input {  }