﻿@font-face {
    font-family: 'Custom';
    src: url('fonts/OpenSans-Light-webfont.eot');
    src: url('fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Light-webfont.woff') format('woff'),
         url('fonts/OpenSans-Light-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face font
    {-family: 'Custom';
    src: url('fonts/OpenSans-SemiBold-webfont.eot');
    src: url('fonts/OpenSans-SemiBold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-SemiBold-webfont.woff') format('woff'),
         url('fonts/OpenSans-SemiBold-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-SemiBold-webfont.svg#OpenSansSemiBold') format('svg');
    font-weight: bold;
    font-style: normal;

}

html {overflow-y: scroll; margin: 0; padding:0;}

body { font-size: 13px; font-family: Helvetica, Arial, sans-serif; color: #000; color: #4c4c4c; margin: 0; padding: 0; background: #ffffff url(images/bg2.jpg) repeat-x fixed top center;}


a, a:visited { text-decoration: none; color: rgb(0, 0, 85); cursor: pointer; }
    a:hover { text-decoration: none; color: rgb(108, 108, 190); }

a:focus { outline: none; }
button::-moz-focus-inner { border: 0; }

.x { clear: both; }
a.dark { color: #333;}
a.nodec {text-decoration: none;}
p { margin: 0 0 12px; }
img { border: 0; }

h1 { font-size: 24px; font-weight: normal; margin-bottom: 15px; color: #333; margin-top: 0px; font-family: Custom, Helvetica, Arial, sans-serif; text-shadow: 1px 1px 1px white;}
h2 { font-size: 20px; font-weight: normal; color: #333; padding: 0; margin: 0 0 10px 0; font-family: Custom, Helvetica, Arial, sans-serif;text-shadow: 1px 1px 1px white;}
h3 { font-size: 17px; font-weight: normal; padding: 0; margin: 0 0 5px 0; line-height: 25px; font-family: Custom, Helvetica, Arial, sans-serif;text-shadow: 1px 1px 1px white;}
h4 { font-size: 15px; font-weight: normal; margin: 3px 0 2px 0; font-family: Custom, Helvetica, Arial, sans-serif;}
h5 { font-size: 12px; font-weight: bold; margin: 0px; }

.col-1
{
    width: 290px;
    margin-right: 20px;
    float: left;
    display: inline;
    padding: 0 0 10px 0;
}
.col-2
{
    width: 670px;
    float: left;
    display: inline;
    margin-right: 20px;
    padding: 0 0 10px 0;
}
.col-3
{
    width: 980px;
    padding: 0;
}
.last
{
    padding-right: 0;
    margin-right: 0px !important;
}

.sep {margin: 5px 0px; height: 2px; background: url(images/sep-bg.png) repeat-x;}

#wrapper { margin: 0 auto; width: 980px;}
.menu-icon > a { padding: 4px 20px 0 0 !important; width: 120px; }
.menu-icon img {padding: 0; margin-top: -2px;}

#linkbar {float: right; padding: 20px 2px 2px; letter-spacing: 1px; vertical-align: middle; font-size: 11px; font-family: Custom;}
    #linkbar img {vertical-align: middle; padding-left: 10px;}
    #linkbar a {color: #333; padding-left: 10px;}

body.ext .extoff {
    display: none;
}

#layoutBody { width: 980px; padding-top: 75px; }
.touch #layoutBody { padding-top: 45px; }

.menu { list-style:none; margin: 0; float: left; }
ul.menu, .menu ul {padding: 0; }
    .menu li { float: left; }
    .menu li a { display: block; font-size: 14px; padding: 8px 18px; text-decoration: none; color: #4c4c4c; }

        .menu ul.sub { background: #FAFAFA; margin: 0; position: absolute; display: none; z-index: 1001; box-shadow: 0px 1px 2px rgb(145, 145, 145); padding: 0; *border: 1px solid #cdcdcd; }
        .menu ul.sub li { float: none;list-style-type: none; }
        .menu ul.sub li a { white-space: nowrap; }

.newslist {margin: 0px 0px 15px 0px; padding: 0 0 10px 0; border-bottom: 5px solid #cdcdcd;}
.threadList h2 a, .options h2 a {color: #333;}
img.hdr { float: left; padding-right: 10px; }

.menu.nav > li {border-left: 1px solid #0f2e43;}
.menu.nav > li > a {padding: 10px 24px; font-size: 13px; line-height: 15px; color: #C6C1BE; font-family: Custom; letter-spacing: 1px; border-left: 1px solid #3e647e; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.menu.nav > li > a.active { color: white; font-weight: normal; }
.menu.nav > li > a:hover {color: white;}
.menu.nav > li > ul {background: #16526a; 
                     background: -webkit-linear-gradient(top, #16526a, #0c2c39); 
                     background: -moz-linear-gradient(top, #16526a, #0c2c39); 
                     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#16526a', endColorstr='#0c2c39');
                     border: 0;}
.menu.nav > li > ul a {color: #C6C1BE;}
.menu.nav > li > ul a:hover {color: white;}

.spinner {border: 1px solid #cdcdcd;}

.largeSelect {width: 310px; }
.largeInput { width: 310px; }
.largeSelect, .largeInput, .standardInput {margin: 0 5px 10px 0; background: white; padding: 7px; border: 1px solid #CCCCCC;}

ul { margin: 0; padding: 0 0 0 20px; }
ol { margin: 0; padding: 0 0 0 20px; }

input[type=text], input[type=password], textarea {border: 1px solid #cdcdcd;}

#left { width: 600px; float: left; display: inline; margin-right: 10px; padding: 0px 15px; }
#right { width: 260px; float: right; border-left: 1px solid #ccc; padding-left: 36px; margin-right: 20px; display: inline; }

#mainContent { padding: 20px 0 30px 0; }
#mainContent[data-external=true] { padding-top: 0;margin-top: -20px;}

.col { float: left; width: 280px; padding: 10px 15px 0px; margin-right: 10px; }
.col img { margin-bottom: 8px;}
.col h1 { border-bottom: 5px solid #cdcdcd; padding: 0 0 5px 0;}

/* framework customization */
.ui-button .ui-button-text { font-weight: normal; min-height: 10px; }
.ui-slider { z-index: inherit !important; }
.ui-slider-handle { z-index: inherit !important; }

.cutoff { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.editor
{
    _overflow-y: scroll;
    cursor: text;
    *cursor:auto;
    background: #fff; 
    width: 980px;
    margin: 20px 20px 20px 20px;
    border-top-width: 0px;
}

.threadEditor
{
    _overflow-y: scroll;
    cursor: text;
    *cursor:auto;
    background: #fff; 
    width: 98%;
    font-size: 14px;
    margin: 10px 10px 10px 10px;
    border-top-width: 0px;
}

.price
{
    margin-top: 0px;
    font-size: 20px;
    color: #636161;
}

.pricesmall
{
    margin-top: 0px;
    font-size: 16px;
    color: #636161;
}

.currency
{
    color: #666666; 
    font-size:10px;
    line-height: 10px;
}

.icon {
    border: 0px;
}

.preview
{
    background-color: white;
    min-height: 30px;
    padding: 20px;
}
.fl {float: left !important;}
.fr {float: right !important;}
.fn {float: none !important;}
.tar {text-align: right;}
.tac {text-align: center;}
.tac > img {display: block; margin: auto; border-radius: 10px;}
.failure {color: Red !important; }
.success {color: Green !important; }
.error {color: Red;}

.h1-line {line-height: 30px;}
.h2-line {line-height: 26px;}
.h3-line {line-height: 25px;}
.h4-line {line-height: 22px;}
.p-rel {position: relative;}
.vam {vertical-align: middle;}
.vab {vertical-align: bottom;}

.gradbox { margin: 0px 0px 16px 0px; padding: 10px; border-bottom: 5px solid #cdcdcd; background-color: white; }
.gradbox.trans { background-color: inherit; padding: 10px 0; }
.gradbox.inv {border-top: 5px solid #cdcdcd; border-bottom: none; }
.dimmed { opacity: 0.7; filter: alpha(opacity=70); }
.col ul, ul.blue
{
    list-style-image: url(/content/images/bluearrow.gif);
    padding-left: 20px;
}
ul.blue > li { padding-bottom: 6px; }
ul.taglist {  margin: 0; padding: 0;display: block; }
ul.taglist li {
    width: 180px;
    margin-left: 10px;
}
.no-right {
    border-right-width: 0 !important;
}
ul.taglist li a {
    padding: 4px 0px 4px 20px;
    font-size: 12px;
    display: block;
    background-position: 1px 1px;
    background-image: url(/content/images/bullet-white-alt.png);
    background-repeat: no-repeat;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    line-height: 19px;
    color: #494747;
    height: 19px;
}
ul.taglist li:hover a {
    background-image: url(/content/images/bullet-white-alt-active.png);
    background-position: 0px 0px;
    padding: 3px 0px 3px 19px;
    border: 1px solid #cdcdcd;
    border-right: 0;
    background-color: white;
    border-radius: 3px 0 0 3px;
}
ul.taglist li a.no-icon { background-image: none !important; padding-left: 0 !important; }
ul.taglist li:hover .add {
    display: block;
    border-radius: 0 3px 3px 0;
}
ul.taglist li .add {
    float: right;
    margin: 0;
    height: 27px;
}
ul.taglist li .add .ui-icon { margin-top: -9px; }
ul.taglist li a.active {
    background-image: url(/content/images/bullet-green-alt.png);
}
ul.taglist.boxless li:hover a { border: none; padding: 4px 0px 4px 20px; background-position: 1px 1px; }
ul.bulletlist li a {
    padding: 4px 10px 4px 20px;
    display: block;
    background-position: 1px 1px;
    background-image: url(/content/images/bullet-white-alt.png);
    background-repeat: no-repeat;
}
ul.bulletlist li a.active {
    background-image: url(/content/images/bullet-green-alt.png);
}

ul.bulletlist li a.noicon {
    background-image: none;
}

.newsheader { font-size: 15px;}
.newsrelated { float: right; font-style: italic; margin-left: 10px; font-size: 12px; text-align: right; }
.newsrelated.wide { width: 250px;}
.newsrelated a {display:block;}
.page-title {float: left; margin: 10px 0 0 0; max-width: 380px;}

.nav-sep {width: 100%; border-top: 1px solid #b3b3b3;}
.nav-sep.strong {border-top: 2px solid #4c4c4c; margin-top: 30px;}
.navbg { position: fixed; top: 0; left: 0; width: 100%; z-index: 1;
        background: #16526a url(images/navgrad.png) repeat-x;
        background: -webkit-linear-gradient(top, #16526a, #0c2c39);
        background: -moz-linear-gradient(top, #16526a, #0c2c39);
        height: 35px;
        border-bottom: 1px solid white;
}
.navbg .center { margin: 0 auto; width: 980px; }
.touch .navbg { position: static; }
a.icon-link
{
    display: block;
    float: left;
    margin-right: 7px;
    width: 80px;
    border: 1px solid #cdcdcd;
    background-color: White;
    border-radius: 4px;
    text-align: center;
}

a.icon-link.right
{
    margin-right: 0;
}

a.icon-link img
{
    display: block;
    margin: auto;
    max-height: 50px;
    padding: 2px 0;
    max-width: 80px;
}

a.icon-link span
{
    padding: 4px;
    max-height: 40px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
}

.m-0 {margin: 0px !important;}
.m-10 {margin: 10px !important;}
.m-a { margin-left: auto; margin-right: auto; }
.mt-5 {margin-top: 5px !important;}
.pt-10 {padding-top: 10px !important;}
.pt-0 {padding-top: 0px !important;}
.mt-0 {margin-top: 0px !important;}
.mt-10 {margin-top: 10px !important;}
.mt-20 {margin-top: 20px !important;}
.mt-25 {margin-top: 25px !important;}
.mb-5 {margin-bottom: 5px !important;}
.mb-10 {margin-bottom: 10px !important;}
.mb-20 {margin-bottom: 20px !important;}
.mr-5 {margin-right: 5px !important;}
.mr-10 {margin-right: 10px !important;}
.mr-15 {margin-right: 15px !important;}
.mr-20 {margin-right: 20px !important;}
.ml-10 {margin-left: 10px !important;}
.ml-20 {margin-left: 20px !important;}
.p-0 {padding: 0px !important;}
.p-5 {padding: 5px !important;}
.p-10 {padding: 10px !important;}
.b-0 {border: 0 !important;}
ul.cleanlist, ul.taglist {list-style: none !important; list-style-image: none !important;}
.hidden {display:none;}
.db {display: block;}
.ui-button.small .ui-button-text {padding-top: .2em; padding-bottom: .2em;}
.ui-autocomplete a {font-size: 11px; }
.fsmall {font-size: 12px;}
.freg { font-family: Helvetica, Arial, sans-serif;}
.bs-n {box-shadow: none;}

#mask {
  position:absolute;
  left:0;
  top:0;
  z-index:99;
  background-color:#000;
  display:none;
}  
#boxes .window {
  position:absolute;
  left:0;
  top:0;
  width:440px;
  height:200px;
  display:none;
  z-index:100;
  padding:20px;
}

#boxes #divClose 
{
    float: right;
}

#boxes #divHeader
{
    float: left;
}

.plancharts
{
    width: 450px;
}

.dietchart
{
    width: 110px; 
    height: 110px;
    float: left;
}

.barchart
{
    width: 140px; 
    height: 100px;
    float: left;
}

.legend
{
    font-size: 11px;
    margin: 0;
    padding: 0;
}
.legend li .color-icon {width: 10px; height: 10px;float: left; margin: 2px 5px 0 0;}

.dialog-box .dietchart { width: 110px; height: 90px; }
.dialog-box .barchart { width: 125px; height: 80px; margin-top:5px }
.dialog-box .legend { margin-top: 15px }

.ui-dialog-content > iframe
{
    border: 0;
    margin: -.5em -1em;
}
.fb-like {height: 28px;}
.offers-hor .productbox { float: left; margin: 0 10px 10px 20px;}
.menu.account .profile-link { padding: 6px 10px 3px 0px; }
.menu.account .profile-link > img { border: 1px solid #cdcdcd; border-radius: 4px; height: 26px;  }
.menu.account img {vertical-align: middle;}

.sub {font-size: 12px;}
.active {font-weight: bold;}
.ui-autocomplete-loading { background-image: url('images/ui-anim_basic_16x16.gif'); background-repeat: no-repeat; background-position: right center; }
.nstype {background-repeat: repeat-y;}
.nst-0 { background-image: url(images/nstype_prot.png); }
.nst-1 { background-image: url(images/nstype_fat.png) }
.nst-2 { background-image: url(images/nstype_carb.png) }
.nst-3 { background-image: url(images/nstype_alc.png) }
.nst-na { display: none }
span.nstype { width: 8px; height: 15px; float: left; border: 1px solid #ffffff; }
#printframe {width: 0; height: 0; border: 0;}

.menu.regnav
{
    background: url(images/nav-bg.png) repeat-x top left;
    color: #4c4c4c; font-size: 12px; font-family: Custom; width: 980px;
    border-radius: 0 0 4px 4px;
    box-shadow: 0px 1px 3px rgb(163, 163, 163);
    height: 37px;
}
.menu.regnav > li > a { font-size: 12px; letter-spacing: 1px; padding: 6px 14px; text-shadow: 1px 1px 1px white; overflow: hidden;white-space: nowrap; text-overflow: ellipsis; line-height: 25px; }
.menu.regnav > li > ul { background: #fafafa; background: rgb(241, 241, 241); margin-top: 1px; overflow-y: auto;max-height: 600px; }
body.ext .menu.regnav > li > a { padding: 7px 15px; }
.menu.regnav > li > a.active { font-weight: bold;}
.menu.regnav a:hover {color: black;}
.auth {float: right !important;}
.auth > a {padding-right: 10px !important;}

.btn-link { border: 0; background: none !important; box-shadow: none !important; }
.btn-link.ui-state-hover { color: rgb(108, 108, 190); }
.checkbox-label.ui-state-active { background: rgb(175, 175, 175) url(images/bg_fallback.png) 0 0 repeat-x !important; }

.ui-buttonpane {
    border-width: 1px 0 0 0;
    margin: 0;
    background-color: whiteSmoke;
    padding: 5px 15px 5px;
    border-top: 1px solid #DDD;
    box-shadow: inset 0 1px 0 white;
    zoom: 1;
}

button.button-clear { background: none;  border: none; box-shadow: none !important; }

.lightup { opacity: 0.5; }
.lightup:hover { opacity: 1.0; }

.messagelist li {background: none !important; border-top: 0; border-bottom: 1px solid #b4b4b4; display: block; overflow: hidden; padding: 5px 2px;display: block !important;}
.messagelist > li > a {padding: 0 5px; margin: 0;font-size: 12px;font-family: Helvetica, Arial, sans-serif;}
.messagelist a .title {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.messagelist a .title, .messagelist a .snip { margin-bottom: 2px; display: block; float: left; width: 480px;}
.messagelist .profile, .postlist .profile {width: 32px; height: 32px; float: left; margin: 0 5px 0 0; border: 1px solid #cdcdcd; border-radius: 4px;}
.messagelist .news .title {font-weight: bold;}
.notifications { width: 75px; }
#notifications img { border: 1px solid #cdcdcd; background-color: white; padding: 2px; border-radius: 4px; }
#notifications:hover img { opacity: 1.0; filter: alpha(opacity=100); }
.count-bubble { background-color: white; color: rgb(56, 56, 56); padding: 0 4px; line-height: 14px; font-size: 10px; border-radius: 4px; border: 1px solid #cdcdcd; }
.nots-count { position: absolute; right: 30px; top: 5px; display: none; }
.messagelist.narrow { left: -300px; width: 500px;margin-top: -2px !important;}
.messagelist.narrow a .title, .messagelist.narrow a .snip { margin-bottom: 2px; display: block; float: left; width: 335px;text-overflow: ellipsis;overflow: hidden;}
.messagelist.narrow li { height: 40px; }

/*icons*/
.icon-arrow-down { background: url(images/arrow_down.png) no-repeat center -65px; min-width: 40px; min-height: 20px; display: block; font-size: 10px; text-align: center; }
.icon-arrow-down:hover { background-position: center -27px; }
.icon-arrow-up { background: url(images/arrow_up.png) no-repeat center -65px; min-width: 40px; min-height: 20px; display: block; font-size: 10px; text-align: center; }
.icon-arrow-up:hover { background-position: center -27px; }

.highcharts-tooltip { min-width: 200px; cursor: pointer; }
.highcharts-tooltip span { white-space: inherit !important; }

/*jquery.dropdown.css*/
.dropdown-menu{font:14px sans-serif;position:absolute;z-index:9999999;display:none;}.dropdown-menu UL{list-style:none;background:#FFF;border:solid 1px #cccccc;border-radius:6px;box-shadow:0 5px 10px #cccccc;overflow:visible;margin:0;padding:4px 0;}.dropdown-menu.has-tip{margin-top:8px;}.dropdown-menu.has-tip:before{position:absolute;top:-6px;left:9px;content:'';border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid #CCC;border-bottom-color:rgba(0,0,0,0.2);display:inline-block;}.dropdown-menu.has-tip.anchor-right:before{left:auto;right:9px;}.dropdown-menu.has-tip:after{position:absolute;top:-5px;left:10px;content:'';border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #FFF;display:inline-block;}.dropdown-menu.has-tip.anchor-right:after{left:auto;right:10px;}.dropdown-menu.has-scroll UL{max-height:358px;overflow:auto;}.dropdown-menu LI{list-style:none;line-height:18px;margin:0;padding:0;}.dropdown-menu LI > A,.dropdown-menu LABEL{display:block;color:#555;text-decoration:none;line-height:18px;white-space:nowrap;padding:3px 15px;}.dropdown-menu LI > A:hover,.dropdown-menu LABEL:hover{background-color:#08C;color:#FFF;cursor:pointer;}.dropdown-menu .divider{height:1px;background:#E5E5E5;overflow:hidden;margin:5px 1px;}.dropdown-menu LI > A{background-position:2px center;background-repeat:no-repeat;}