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

/* 
    Document   : wlr-mobile-master
    Created on : 20-Jan-2012, 10:13:59
    Author     : Joanne Readshaw
    Description:
        Main styles for Weight Loss Resources mobile using new styling scheme
*/

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

*
{
   font-family: "Droid Sans", sans-serif;
   font-size: 14px;
   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: #222;
   margin-bottom: 0.5em;
   margin-top: 0.5em;
}

h2, h3, h4, h5, h6 
{
   margin-top: 1em;
}

h1 {font-size: 160%; margin-top: 0.5em;}
h2 {font-size: 120%;}
h3 {font-size: 115%;}
h4 {font-size: 110%;}
h5 {font-size: 105%;}
h6, p, td, th {font-size: 100%;}

p {margin: 0 0 0.5em 0;}

table
{
  border-collapse: collapse;
}

td,
th
{
  vertical-align: top;
  text-align: left;
  padding: 10px 5px;
}

td,
th
{
  border-top: 1px dashed #CCCCCC;
}

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

a:visited { text-decoration: none;}
a:hover { color: #ff9c00;}

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

li
{
  margin-bottom: 5px;
}

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

em
{
   font-weight: bold;
   font-style: normal;
   color: #ff3100;
}
/*----------------------------------------------------------------------------*/
/* 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-pad-all3 { padding: 3% !important; }
.wlr-pad-t3 { padding-top: 3% !important; }
.wlr-pad-r3 { padding-right: 3% !important; }
.wlr-pad-b3 { padding-bottom: 3% !important; }
.wlr-pad-l3 { padding-left: 3% !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-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-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-pad { padding: 5px;}
.wlr-pad-large { padding: 20px !important;}

.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;}

.desktop { display: none !important;}

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

.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;
}
/*----------------------------------------------------------------------------*/
/* Page Layout
/*----------------------------------------------------------------------------*/
#container
{
   padding-left: 3%; 
   padding-right: 3%;
   width: 94%;
}

/*-----------------------------------------------*/
/* Header
/*-----------------------------------------------*/

#header
{
   padding-top: 0;
   background-color: #ffffff;
}

#header img
{
   width: 100%;
   padding-top: 7px;
   margin-bottom: 0;
}

#header h6 
{
  padding-top: 0;
  margin-top: 0; 
  margin-bottom: 5px; 
  font-weight: normal;
}

/*-----------------------------------------------*/
/* Navigation  strip
/*-----------------------------------------------*/

.nav-strip,
#toolsout
{
   background-color: #26A3A3;
   border: none;
}

.nav-strip a
{
   font-weight: bold;
   color: #ffffff;
   text-decoration: none;
   display: inline-block;
   border-left: 1px solid #ffffff;
   margin-right: -1px;
   padding: 2% 0;
   text-align: center;
}

#toolsout a 
{
   font-weight: bold;
   color: #ffffff;
   text-decoration: none;
   display: inline-block;
   padding: 2%;
   text-align: left;
   width: 46%;
}

.nav-strip a:hover,
#toolsout a:hover
{
  background-color: #ff9c00;
}

/*-----------------------------------------------*/
/* Content
/*-----------------------------------------------*/
#coltitle {
  width: 74%;
  display: inline-block;
  padding-right: 2%;
}

.colshare
{
  width: 20%;
  display: inline-block;
  margin-top: 10px;
  margin-bottom: 5px;
  text-align: right;
}

#twitter,
#google-plus
{
  margin: 0 0 5px 0;
  text-align: right;
}

#colmain img
{
  width: 100%;
  margin-bottom: 5px;
}

/*-----------------------------------------------*/
/* Menus
/*-----------------------------------------------*/

#colnav 
{
  margin-top: 20px;
}

#colnav p
{
  padding: 10px 0;
  margin: 0;
  border-top: 1px dashed #CCCCCC;
}

#colnav p a {
  font-weight: normal;
}

#colnav h5,
#colnav h6
{
   padding: 10px 5px 5px 5px;
   margin: 0;
}

/*-----------------------------------------------*/
/* Footer
/*-----------------------------------------------*/

#footer div
{
  display: inline-block;
  width: 47%;
  vertical-align: top;
}

#footer a,
#disclaimer a
{
  font-weight: normal;
}

#footer p
{
  padding: 10px 0;
  margin: 0;
  border-bottom: 1px dashed #CCCCCC;
}

/*-----------------------------------------------*/
/* Specific Styles
/*-----------------------------------------------*/

.tick-box ul
{
  margin-left: 15px;
  list-style: none; 
}

.tick-box li
{
  background: url("/img/site/tick-box.png") no-repeat scroll 8px 0px; 
  overflow: hidden; 
  padding-left: 35px;
}

/* For popout ps on calorie counter sub pages */

p.wlr-border-t-dash {
  padding-top: 10px;
}

/* END */