/* 
    Document   : wlr-master
    Created on : 05-Aug-2011, 10:21:25
    Author     : John Godsland
    Description:
        Main stles for Weight Loss Resources using new styling scheme
*/

/*----------------------------------------------------------------------------*/
/* Resets
/*----------------------------------------------------------------------------*/

*
{
   font-family: "Droid Sans", Arial, Verdana, Geneva, sans-serif;
   font-size: 13px;
   margin: 0;
   padding: 0;
}

body
{
   background-color: #ffffff;
}

img, fieldset, iframe
{
   border: none;
}

pre
{
   font-family: Courier, "Courier New", monospace;
}

span
{
   font: inherit;
}

/*----------------------------------------------------------------------------*/
/* Default Styles
/* Note: Please only include styles for HTML elements in this section, not
         for classes or ID's.
/*----------------------------------------------------------------------------*/

h1, h2, h3, h4, h5, h6 
{
   font-weight: bold;
   color: #555;
/*   margin: 0 0 5px 0;*/
}

h1 {font-size: 200%;}
h2 {font-size: 180%;}
h3 {font-size: 160%;}
h4 {font-size: 140%;}
h5 {font-size: 120%;}
h6 {font-size: 110%;}

p {margin: 0 0 5px 0;}

table
{
  border-collapse: collapse;
}

th, td
{
   vertical-align: middle;
}

a
{
   color: #009393;
   text-decoration: none;
   font-size: inherit;
}

a:visited
{
   text-decoration: none;
}

a:hover
{
   color: #ff3100;
}

ul, ol
{
   margin-left: 25px;
}

hr
{
   color: #ccc;
   border: none;
   border-top: #ccc 1px solid;
   margin: 10px 0;
}

em
{
   font-size: inherit;
   font-weight: bold;
   font-style: normal;
   color: #ff3100;
}

/*----------------------------------------------------------------------------*/
/* Forms
/* Note: Use this section for standard form HTML elements, not custom entries
/*       for specific forms. Note that certain classes are generic because
/*       of their inclusion in the WLR libraries.
/*----------------------------------------------------------------------------*/

form {}

caption {}

input {}

input[type=text] 
{
   border: 1px #ccc solid;
}

fieldset
{
   margin-bottom: 20px;
}

label, fieldset.field-radio p
{
   font-weight: bold;
   color: #555;
}

fieldset.field-text input, 
fieldset.field-password input, 
fieldset.field-multi input,
fieldset.field-select select
{
   padding: 2px;
}

fieldset.field-text label, fieldset.field-multi label,
fieldset.field-select label, fieldset.field-password label
{ /* Line up prompts */
  width: 150px;
  float: left;
  text-align: right;
  margin-right: 5px;
  margin-top: 4px;
}

fieldset.field-multi span, fieldset.field-text span, fieldset.field-password span
{ /* This is used to label each element of the multi and suffixes on standard text fields */
   margin: 0 5px 0 5px;
}

fieldset.form-buttons
{
   text-align: right;
   margin-bottom: 0;
}

fieldset.form-buttons input
{
   padding: 5px 12px 5px 12px !important;
}

fieldset.field-checkbox input
{
   margin-left: 155px;
}

div.form-note
{
   font-size: 90%;
   margin-top: 5px;
}

fieldset.field-text div.form-note,
fieldset.field-multi div.form-note,
fieldset.field-select div.form-note,
fieldset.field-password div.form-note
{
   margin-left: 155px;
}

.wlr-neutral fieldset.field-radio label.ui-state-active,
.wlr-neutral fieldset.field-radio label.ui-widget-content .ui-state-active,
.wlr-neutral fieldset.field-radio label.ui-widget-header .ui-state-active,
.wlr-neutral label.ui-state-active
{
   color: #555;
   background-color: #D9F3FB;
   background-color: #cce9e9;
   background-image: none;
}

/*----------------------------------------------------------------------------*/
/* Expando Boxes
/*----------------------------------------------------------------------------*/
.expando
{
   border-bottom: #aaa 1px solid;
}

.expando table
{
   display: inline-table;
}

.expando-top
{
   padding: 10px 0 10px 15px;
   padding: 0 0 10px 0;
   cursor: pointer;
}

.expando-top .expando-control
{
/*
   background-image: url(../../img/site/chevron-down.png);
   width: 16px;
   height: 16px;
   display: inline-block;
   float: right;
   margin-right: 15px;
*/
}

.expando-main
{
   padding: 10px 0 10px 10px;
   padding:  0 0 10px 0;
}

/*----------------------------------------------------------------------------*/
/* Generic Custom Classes
/*----------------------------------------------------------------------------*/

/* -- New "standard" Ones -- */
.wlr-pad-std { padding: 20px !important; }
.wlr-pad-l-std { padding-left: 20px !important; }
.wlr-pad-r-std { padding-right: 20px !important; }
.wlr-pad-t-std { padding-top: 20px !important; }
.wlr-pad-b-std { padding-bottom: 20px !important; }

.wlr-pad-all10 { padding: 10px !important; }
.wlr-pad-t10 { padding-top: 10px !important; }
.wlr-pad-r10 { padding-right: 10px !important; }
.wlr-pad-b10 { padding-bottom: 10px !important; }
.wlr-pad-l10 { padding-left: 10px !important; }

.wlr-border-std { border: 1px #ccc solid; }
.wlr-border-l-std { border-left: 1px #ccc solid; }
.wlr-border-r-std { border-right: 1px #ccc solid; }
.wlr-border-t-std { border-top: 1px #ccc solid; }
.wlr-border-b-std { border-bottom: 1px #ccc solid; }

.wlr-border-dash { border: 1px #CCC dashed; }
.wlr-border-t-dash { border-top: 1px #CCC dashed; }
.wlr-border-r-dash { border-right: 1px #CCC dashed; }
.wlr-border-b-dash { border-bottom: 1px #CCC dashed; }
.wlr-border-l-dash { border-left: 1px #CCC dashed; }

.wlr-shaded-std-col1 { background-color: #eee; } /* Grey */
.wlr-shaded-std-col2 { background-color: #D9F3FB; } /* Blue */
.wlr-shaded-std-col2 { background-color: #cce9e9; } /* Blue */
.wlr-shaded-std-col3 { background-color: #fff7d9; } /* Yellow */
.wlr-shaded-std-col4 { background-color: #FFF4F2; } /* Tangerine Orange */
.wlr-shaded-std-col5 { background-color: #fff0d9; } /* Sunrise Orange */
.wlr-shaded-std-col6 { background-color: #f6fcff; } /* Ice */
.wlr-shaded-std-col6 { background-color: #f6fcfc; } /* Ice */
.wlr-shaded-std-col7 { background-color: #fffdd9; } /* Lemon */
.wlr-shaded-std-col8 { background-color: #40c4eb; } /* Bold Blue */
.wlr-shaded-std-col8 { background-color: #26a3a3; } /* Bold Blue */
.wlr-shaded-std-col9 { background-color: #bfe4e4; } /* Light Teal */
.wlr-shaded-std-col10 { background-color: #fff98c; } /* Post-It Yellow */
.wlr-shaded-std-col11 { background-color: #ff9c00; }

.wlr-margin-t20 { margin-top: 20px; }
.wlr-margin-r20 { margin-right: 20px; }
.wlr-margin-b20 { margin-bottom: 20px; }
.wlr-margin-l20 { margin-left: 20px; }


.wlr-margin-all10 { margin: 10px; }
.wlr-margin-t10 { margin-top: 10px; }
.wlr-margin-r10 { margin-right: 10px; }
.wlr-margin-b10 { margin-bottom: 10px; }
.wlr-margin-l10 { margin-left: 10px; }


.wlr-width-100pc { width: 100%; }
.wlr-width-60pc { width: 60%; }
.wlr-width-50pc { width: 50%; }
.wlr-width-33pc { width: 33%; }
.wlr-width-25pc { width: 25%; }
.wlr-width-20pc { width: 20%; }

.wlr-nowrap { white-space:nowrap; }

.wlr-shadow-std
{
   -moz-box-shadow: 2px 2px 1px 0 #79adad;
   -webkit-box-shadow: 2px 2px 1px 0 #79adad;
   box-shadow: 2px 2px 1px 0 #79adad;
}

.wlr-line-space-more {line-height: 175%;}

.no-tb-bord
{
   border-top: none !important;
   border-bottom: none !important;
}

/* -- TODO: Move this definition! -- */
hr.wlr-hr-std
{
   color: #ccc;
   border: none;
   border-top: #ccc 1px solid;
   margin: 0;
}

/* ------------------------ */
.wlr-pad
{
   padding: 5px;
}

.wlr-pad-large 
{ 
   padding: 20px !important;
}

.wlr-pad-ui
{
   padding: 12px 16px 0 16px;
}

.wlr-pad-popup
{
   padding: 10px 20px 0 20px;
   padding: 35px 50px 20px 50px;
}


.wlr-box-shaded
{
   border: #ff3100 1px solid;
   background-color: #fff4f2;
   padding: 10px;
   margin: 10px 0;
}

.wlr-box-shaded-alt
{
   border-top: #ccc 1px solid;
   border-bottom: #ccc 1px solid;
   background-color: #ffe380;
   padding: 10px;
   margin: 0;
}

.wlr-box-shaded-alt hr
{
   color: #FFC600;
   border: none;
   border-top: #FFC600 1px solid;
   margin: 10px 0;
}


.wlr-text-large { font-size: 110%; }
.wlr-text-extra-large { font-size: 140%; }
.wlr-text-small { font-size: 90%; }
.wlr-text-extra-small { font-size: 75%; }

.wlr-text-center
{
   text-align:center;
}

.wlr-text-right
{
   text-align:right;
}

.wlr-text-color1 { color: #555; }
.wlr-text-color2 { color: #009ecd; }
.wlr-text-color2 { color: #008484; }
.wlr-text-color3 { color: #ff9c00; }
.wlr-text-color4 { color: #fff; }
.wlr-text-color5 { color: #40c4eb; }
.wlr-text-color5 { color: #26a3a3; }
.wlr-text-color6 { color: #fff; }

.wlr-text-color-alt { color: #ff3100; }

.wlr-text-bold
{
   font-weight: bold;
}

.wlr-bgcolor-alt
{
   background-color: #bfebf8;
   background-color: #b3dfdf;
}

/* Custom Buttons */
.wlr-button-orange
{
   background: #ff4800 !important;
   border-color: #e54100 !important;
   color: #fff !important;
   font-weight: bold !important;
}

.wlr-button-orange:hover
{
   background: #e54100 !important;
   border-color: #cc3a00 !important;
   color: #fff !important;
}

.wlr-button-blue 
{
   background: none repeat scroll 0 0 #00b0e4 !important;
   background: none repeat scroll 0 0 #009393 !important;
   border-color: #009ecd !important;
   border-color: #008484 !important;
   color: #ffffff !important;
   font-weight: bold !important;
}

a:hover.wlr-button-blue 
{
   background: none repeat scroll 0 0 #009ecd !important;
   background: none repeat scroll 0 0 #008484 !important;
}

.wlr-button-sunshine 
{
   background: none repeat scroll 0 0 #ff9c00 !important;
   border-color: #e58c00 !important;
   color: #ffffff !important;
   font-weight: bold !important;
}

a:hover.wlr-button-sunshine 
{
   background: none repeat scroll 0 0 #e58c00 !important;
}

/*----------------------------------------------------------------------------*/
/* Custom Table Classes
/*----------------------------------------------------------------------------*/
.wlr-table-valign-top td,
.wlr-valign-top
{
   vertical-align: top;
}

.wlr-table-data
{
   width: 100%;
}

.wlr-table-data td, .wlr-table-data th
{
   padding: 4px 4px 4px 4px;
   border-bottom: 1px #ccc solid; 
   border-top: 1px #ccc solid;
   text-align: left;
   height: 25px;
}

.wlr-table-data td img, .wlr-table-data th img
{
   float: left;
}

.wlr-table-data tr.alt-row,
.wlr-table-data tr.even
{
/*   background-color: #f7fdfe;*/
   background-color: #f2fbfc;
}

.wlr-table-data tr.average
{
/*   
   background-color: #d9f3fb;
   background-color: #fff1bf;
*/
   background-image: url(../img/site/shade-yellow.png);
}

.wlr-table-data tr.private
{
/*   background-color: #ffe0d9;*/
   background-image: url(../img/site/shade-red.png);
}

.wlr-table-data tr.hidden
{
   display: none;
}

.wlr-table-data th
{
   font-weight: bold;
   color: #555;
   background-color: #d9f3fb;
   background-color: #cce9e9;
}

.wlr-table-data td.wlr-text-center,
.wlr-table-data th.wlr-text-center,
.wlr-table-summary td.wlr-text-center,
.wlr-table-summary th.wlr-text-center
{
   text-align: center;
}

.wlr-table-data td.wlr-text-right,
.wlr-table-data th.wlr-text-right,
.wlr-table-summary td.wlr-text-right,
.wlr-table-summary th.wlr-text-right
{
   text-align: right;
}

.wlr-table-data td.wlr-info-button
{
   background: url(../img/site/info3.png) no-repeat 4px 50%;
   width:25px;
}

.wlr-table-data td.wlr-info-button a
{
   display: inline-block;
   width: 25px;
   height: 25px;
}

/* -- Summary Table (Used for small snippets of data) -- */

.wlr-table-summary th,
.wlr-table-summary td
{
  padding: 5px;
  border-bottom: 1px #ccc dashed;
  text-align: left;
}


/* --- Active Table --- */
tr.active-table-selected
{
/*   background-color: #fff1bf !important;*/
   background-image: url(../img/site/shade-yellow.png);
}

tr.active-table-hover
{
   background-color: #bfebf8 !important;
   background-color: #b3dfdf !important;
   cursor: pointer;
}

td.active-table-toolbar
{
   border: none;
   background-color: #eee;
}

td.active-table-toolbar a.button
{
   
}

th.active-table-checkall
{
   background: #D9F3FB url(../img/site/tb-top-arrow.png) no-repeat 0 0;
   background: #cce9e9 url(../img/site/tb-top-arrow.png) no-repeat 0 0;
   border-top: none;
   padding-top: 6px;
}

/* --- Alpha Navigation Table --- */
.table-alphanav
{
   background-color: #D9F3FB;
   background-color: #cce9e9;
}
.table-alphanav th
{
   font-size: 110%;
   padding: 4px 0 4px 0;
   border-right: 1px #ccc solid;
   width: 27px;
   color: #aaa;
}

#table-alphanav-t th
{
   border-bottom: 1px #ccc solid;
}

#table-alphanav-b th
{
   border-top: 1px #ccc solid;
}

.table-alphanav th a
{
   font-size: 110%;
   width: 100%;
   display: inline-block;
}

.table-alphanav th.table-alphanav-oth
{
   width: 70px;
   border-right: none;
}

.table-alphanav th.table-alphanav-sel
{
   background-color: #40C4EB;
   background-color: #26a3a3;
   color: #fff;
}


/*----------------------------------------------------------------------------*/
/* Page Layout
/*----------------------------------------------------------------------------*/
#header
{
   width: 960px;
   margin: 0 auto;
}

#header img
{
   margin: 10px 0 10px 0;
   float: left;
}

#header p
{
   float: right;
   margin: 10px 0 0 0;
}

#header-wide
{
   width: 100%;
   height: 54px;
}

#tab-strip
{
   width: 100%;
   text-align: center;
   border-bottom: #40c4eb 5px solid;
   border-bottom: #26a3a3 5px solid;
   background-image: url(../img/site/grad.png);
   background-repeat: repeat-x;
   background-position: bottom;
}

#tab-strip a
{
   font-weight: bold;
   color: #00b0e4;
   color: #009393;
   text-decoration: none;
   font-size: 14px;
   background-color: #fff;
   
   display: inline-block;
   padding: 5px 15px 5px 15px;
   margin: 0 2px 0 1px;
   
   border: 1px solid #cccccc;
   border-bottom: none;
   
   -webkit-border-top-left-radius: 5px;
   -webkit-border-top-right-radius: 5px;
   -moz-border-radius-topleft: 5px;
   -moz-border-radius-topright: 5px;
   border-top-left-radius: 5px;
   border-top-right-radius: 5px;
}

#tab-strip a:hover
{
   color: #ff3100;
}

#tab-strip a.selected, #tab-strip a.selected:hover
{
   color: #fff;
   border: 1px solid #40c4eb;
   border: 1px solid #26a3a3;
   border-bottom: none;
   background-color: #40c4eb;
   background-color: #26a3a3;
}

#main
{
   width: 962px;
   margin: 0 auto;
   overflow: auto;
}

#colnav
{
   width: 150px;
   float: left;
}

#colnav a
{
   font-size: 110%;
   font-weight: bold;
   width:100%;
   display:inline-block;
}

#colnav a.nav-selected
{
   color: #ff3100;
}

#colnav p
{
   margin: 0;
   padding: 5px 10px 5px 5px;
   border-bottom: 1px #ccc solid;
}

#colnav p.nav-selected
{
   background-color: #40C4EB;
   background-color: #26a3a3;
}

#colnav p.nav-selected a
{
   color: #fff;
}

#colnav h5,
#colnav h6
{
   padding: 10px 5px 5px 5px;
   border-bottom: 1px #ccc solid;
   margin: 0;
}

#colundo
{
   width: 778px;
   margin-left: 10px;
   margin-bottom: 10px;
   padding: 10px;
   border: #FF3100 1px solid;
   background-color: #FFF4F2;
   float: left;
   
}

#colmain
{
   width: 798px;
   margin-left: 10px;
   margin-bottom: 10px;
   border: #ccc 1px solid;
   float: left;
}

/* Setup and sign-up only */
#main1
{
   width: 940px;
   margin: 0 auto;
/*   background: #E6DFCF;*/
/*   padding: 10px;*/
/*border-top: #e6DfCf 10px solid;
border-bottom: #e6DfCf 10px solid;*/
   overflow: auto;
}

#wide-top, #wide-bottom
{
   clear: both;
   padding: 10px 0 10px 0;
}

#col1
{
   width: 630px;
   background-color: white;
   padding: 10px 0 10px 0;
   float: left;
   display: block;
}

#col2
{
   width: 300px;
   float: left;
   margin: 0 0 0 10px;
}

#footer
{
   width: 960px;
   margin: 0 auto;
   padding: 10px 0 10px 0;
   text-align: center;
}

#pageshare
{
   position: fixed;
   margin-left: -71px;
   margin-top: 50px;
   background-color: #f6fcfc;
   border: 1px solid #ccc;
   padding: 0 0 2px 0;
   z-index: 10;
}
#pageshare .sbutton
{
   float: left;
   clear: both;
   margin: 5px 5px 0 5px;
}
.fb_share_count_top
{
   width: 48px !important;
}
.fb_share_count_top,
.fb_share_count_inner
{
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
}
.FBConnectButton_Small,
.FBConnectButton_RTL_Small
{
   width: 49px !important;
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
}
.FBConnectButton_Small .FBConnectButton_Text
{
   padding: 2px 2px 3px !important;
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
   font-size: 8px;
}