@charset "utf-8";
/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body { margin:0; padding:0; color: #5a5a5a; position:relative; font-family: 'Quattrocento Sans', Arial, Helvetica, sans-serif; }
/*HTML 5 support - Sets new HTML 5 tags to display:block so browsers know how to render the tags properly. */
header, section, footer, aside, nav, article, figure {display: block;}
/* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */
.navbar .navbar-inner { border: 0; }
.navbar .brand { padding: 14px 20px 16px; /* Increase vertical padding to match navbar links */ font-size: 16px; font-weight: bold; text-shadow: 0 -1px 0 rgba(0,0,0,.5); }
.navbar .nav > li > a { padding: 10px 10px; outline:none; }
.navbar .btn-navbar { margin-top: 10px; text-align:center; }


.navbar-wrapper { position:relative; }
.navbar-wrapper .navbar { float:left; margin-top:10px; margin-bottom:15px;  width:131px; height:39px; color:#fff; font-family: 'Oxygen', Arial, Helvetica, sans-serif; font-weight:500;}
.navbar-wrapper .navbar .nav { margin:0;}
.navbar-wrapper .navbar .nav > li > a{ padding-right:0;}
.navbar-wrapper .navbar .navbar-inner{ padding-right:10px; padding-left:15px;}

#collapsed-nav{ background:#68b7e7; position:fixed; top:0; width:100%; z-index:999; visibility:hidden; }
#collapsed-nav.navbar-static-top{ margin:0; line-height:12px; height:40px;}
#collapsed-nav .container{ margin:0 auto;}
#collapsed-nav a{ color:#FFF; font-weight:normal; }
#collapsed-nav a:hover{ text-decoration:underline;}
#collapsed-nav.navbar .nav{ margin:0 auto; padding:0; text-align:center;  display:block; *display: inline; *zoom: 1; float:none; }
#collapsed-nav.navbar .nav li{ text-align:center; display:inline; margin:0; padding:0;  }
#collapsed-nav.navbar .nav > li{ float:none;}
#collapsed-nav.navbar .nav li a{display:inline-block; padding:0 14px; font-size:1em; height:40px; line-height:40px; border-right:1px solid  #86c5ec;}
#collapsed-nav.navbar .nav li:last-child a{ border-right:0;}
#collapsed-nav.navbar .nav > .active > a, #collapsed-nav.navbar .nav > .active > a:hover, #collapsed-nav.navbar .nav > .active > a:focus { color:#2998d3; background:#d7f0ff;}

/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel { margin-bottom: 15px; }
.carousel .container { position: relative; z-index: 9; }
.carousel-control {  margin-top: 0; font-size: 60px;  background-color: none; border: 0; z-index: 10; color:#ACACAC; background:#f3f3f3; height: 145px; line-height:140px; display:block; }

.carousel .item { }
.carousel img {  }

/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing{ padding-bottom:30px;}
.marketing .span4 { text-align: center;  }
.marketing .span4:last-child{ margin-right:0;}
.marketing h2 { font-weight: normal; color:#292929; font-size:38px; line-height:1em; margin:60px 10px 35px; padding:0; }
.marketing h3 { font-weight: normal; color:#292929; font-size:18px; line-height:1.2em; text-align:left; }
.marketing h3 a{color:#292929;}
.marketing .span4 p {  text-align:left; font-size:14px; line-height:21px; height:43px; overflow:hidden;}
.marketing h3, .marketing .span4 p {margin: 10px 7px;}
.marketing h3{ margin-top:20px; height:43px; overflow:hidden;}
.marketing .span4 img{ margin:0; padding:0; }
.marketing a.viewall { float:right; font-size:18px; } .marketing a.viewall:hover { text-decoration:underline; cursor:pointer; }
.marketing {min-height: 400px;}
.carousel .carousel-inner { width:96.8%; overflow:hidden.; margin:0 23px 0 30px;}
.carousel .row{ margin-left:1.4%; }
.carousel .row .span4 {display: block; float: left; width: 32.3%; margin-left: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}

.calorie-counter, .calorie-counter-wrap{ position:relative; height:350px;}
.calorie-counter-wrap{background:#FFFFFF; border-bottom:1px solid #f1f1f1; }
.calorie-counter{}
.img-free-calorie-counter{ position:absolute; left:-5%; top:32px; width:559px; height:291px;}
.btn-create-account{ position:absolute; bottom:81px; right:0;; font-family: 'Arimo', Arial, Helvetica, sans-serif; width:247px; }
.calorie-counter .btn-create-account{ right:202px;}
.btn-create-account a{ display:block; padding:12px 21px; color:#FFF; font-size:18px; }
.btn-create-account a:hover{ text-decoration:none; background:#fcbc23;}
.txt-free-calorie-counter{position:absolute; top:10%; right:-0; text-align:left;}
.txt-free-calorie-counter h1{ font-size:38px; color:#292929; line-height:1em; font-weight:bold; margin-bottom:20px;font-family: 'Oxygen', Arial, Helvetica, sans-serif;}
.txt-free-calorie-counter p{ font-size:18px; line-height:1.4em; color:#3e4752; width:450px; font-weight:normal;font-family: 'Oxygen', Arial, Helvetica, sans-serif;}
.txt-free-calorie-counter h1 .s{ font-size:0.68em; }
.txt-free-calorie-counter p .s{ font-size:0.88em;}

/* button size 
-------------------------------------------------- */
#nav-explore { font-size:14px;}
.featurette .btn-info{ font-size:18px;}



/* HEADER
-------------------------------------------------- */
#header{ display:block; position:relative; height:auto;  width: 302px; float:left;}
#header img{ margin:10px; margin-top:0; }
#header img a{ border:0;}
.acclogin{ display:block;line-height:30px; margin:10px 0; float:right; background:#d8f0ff; padding:4px 0 3px 15px; color:#ccc; width:223px; }
.acclogin a { padding:0 9px; border-right:1px solid #ccc;  font-family: 'Oxygen', Arial, Helvetica, sans-serif;  font-size:14px; font-weight:bold; color:#0089ca; }
.acclogin a#logout, .acclogin a#login{ padding-right:0; border: none;}
.acclogin a#acc, .acclogin a#admin{ padding-left:0;}

/* AD CONTENT
-------------------------------------------------- */
.ad-leaderboard { display:block; margin:0; text-align:center; padding:5px; padding-bottom:0; }
.ad-leaderboard-wrap { display:block; margin:5px auto 0; }

/* mobile contents */
#mobile-header, #mobile-nav, #mobile-profile, .img-free-calorie-counter-mobile { display: none;}

/* Featurettes
------------------------- */
.featurewrape{background-color:none; display:block; clear:both; margin:0; padding:0;}
.featurewrape.dietitian{ background:url(/images/home/wood.gif) repeat-x left top; height:560px;}
.featurewrape.premium{ background:url(/images/home/bg-runner.gif) no-repeat center top #010000; height:560px; }
.featurewrape.pc{ background:url(/images/home/bg-pc-calorie-counter.gif) no-repeat center top #f9fafa; height:560px; }
.featurewrape.mobile{height:535px; }
.featurewrape.get-ready{height:237px; background:#68b7e7; }
.featurewrape.dietitian .row, .featurewrape.premium .row, .featurewrape.pc .row, .featurewrape.mobile .row{ margin-top:88px;}
.featurewrape.get-ready .row{ margin-top:50px;}
.featurewrape.get-ready h2{ text-align:center; font-size:38px; color:#ffffff; font-weight:normal;}
.featurewrape.get-ready .btn-create-account{ position:relative; margin:30px auto 60px; width:270px; bottom:15%;}

.featurette-divider { margin: 0; padding:0; clear:both; height:1px; border:none;  background-color: #f1f1f1; color: #f1f1f1;}
.featurette { padding: 30px 0 0 12px; overflow: hidden;  }


/* Give some space on the sides of the floated elements so text doesn't run right into it. */
.featurette-image.pull-left { margin-right: 40px; height:330px; float:left; }
.featurette-image.pull-right { margin-left: 30px; height:336px; }
/* Thin out the marketing headings */
h2.featurette-heading { font-size: 38px; font-weight:normal; line-height: 1; color:#292929; }
h2.featurette-heading.right, .featurette h3.right, .featurette p.right, .learn-more.right{ text-align:right;}
.learn-more { color:#2998d3; line-height:1.2em; }
h3.lead{ font-size:18px; font-weight:normal;}

h2.featurette-heading.white, .featurette h3.white,.featurette p.white, a.learn-more.white{ color:#fff;}
a.learn-more.white:hover{ color:#ccc;}


/* Footer
-------------------------------------------------- */
#footer{ display:block; background:#f3f3f3; clear:both; padding:20px 0 80px; margin:0; color:#acacac; }

.social{text-align:center; margin:40px auto 15px;}
.footer-links{text-align:center; margin:15px auto;}
.footer-links a, .social a{ padding:0 7px; text-align:center; }
.social a:hover img, .ib-health a:hover img{opacity:0.4; filter:alpha(opacity=40); /* For IE8 and earlier */ }
.copyright, .advertise{ font-size:0.88em; text-align:center; margin:15px auto;}
.copyright{ color:#555555;}
.advertise a{ font-weight:bold; color:#555555; }
.advertise{margin-bottom:30px;}
#iblogounify_div{ position:absolute; left:50%; bottom:60px; margin-left:-118px;}

/* Colors 
-------------------------------------------------- */
.color-gray1, .color-gray1:hover{ color:#acacac;}
.color-gray2, .color-gray2:hover{ color:#555555;}
.color-black, .color-black:hover{ color:#000000;}

/* Sizes
-------------------------------------------------- */
.font06{ font-size:0.6em;}
.font07{ font-size:0.7em;}
.font08{ font-size:0.8em;}
.font09{ font-size:0.9em;}
.font10{ font-size:1em;}
.font11{ font-size:1.1em;}
.font12{ font-size:1.2em;}

/* Others
-------------------------------------------------- */
.clr{ clear:both;}

/* for return to top 
---------------------------------------- */
#return_top a { position:absolute; position:fixed; right:0; bottom:15px; text-decoration:none; outline:none;
  display:block; height:138px; width:38px; background:url(../images/return-top.png) no-repeat right top; }
#return_top a:hover { background:url(../images/return-top.png) no-repeat left top; text-decoration:none; }


/* RESPONSIVE CSS
-------------------------------------------------- */
@media (min-width: 768px) and (max-width: 979px) {

 }
@media (max-width: 979px) {
}

@media (min-width: 768px) and (max-width: 979px) {
/* fix iPad rotation potrate*/
.featurette right{}	
.featurewrape.premium .featurette-image.pull-right, .featurewrape.pc .featurette-image.pull-left{ height:50px;}
.featurewrape.pc h2, .featurewrape.pc h3, .featurewrape.pc p{ clear:both; float:right; width:380px;}
.featurewrape.premium h2, .featurewrape.premium h3, .featurewrape.premium p{ clear:both; float:let; width:440px;}
.featurewrape.mobile {  height:600px;}
}


@media (max-width: 767px) {

}
@media (max-width: 480px) {

body, .navbar-wrapper, .calorie-counter-wrap, .img-free-calorie-counter-mobile{ width:480px;}	
.img-free-calorie-counter-mobile{ display:block;}
.img-free-calorie-counter { display:none; }	
.img-free-calorie-counter-mobile img{width:100%;}
.calorie-counter, .calorie-counter-wrap{ height:540px; padding:0; margin:0;}


#header{ height:50px; }	
#nav-explore{margin-left:0;}
.navbar-wrapper .navbar{ position:relative; margin:5px auto; margin-top:15px;}	
.navbar-wrapper .navbar .navbar-inner{ min-height:30px; padding-top:0; }

.acclogin{ margin-top:10px; }
.marketing .span4{ clear:both; margin:5px auto;}	 

.featurette h1, .featurette h2, .featurette h3, .featurette p{ clear:both; margin-left:30px; margin-right:30px;}
.img-free-calorie-counter{position:relative; clear:both; height:auto; padding:0; left:0;}
.img-free-calorie-counter img{ height:auto; padding:0; margin-right:0; max-width:480px; }
.txt-free-calorie-counter h1{ margin:20px 0; font-size:36px; text-align:center; width:480px;}
.calorie-counter .btn-create-account:before{ content: "";  display: table; line-height: 0; clear:both;}
.calorie-counter .btn-create-account{ position:relative; margin:40px auto 20px; text-align:center; right:auto; left:auto; display:block; bottom:0;}


.btn-create-account{bottom:40px; }
.txt-free-calorie-counter { clear:both; position:relative;margin-right:30px; text-align:right;}
.txt-free-calorie-counter p{ width:480px; clear:both; text-align:center; font-size:18px;}

/* carousel */
.carousel-control{ display:none;}
.carousel .row .span4{ width:100%;}
.carousel img { width: 480px; height:auto; }	
.carousel{ margin-left:0; margin-right:0;}
.carousel .carousel-inner{ margin:0;width: 480px;}
.carousel-caption { position: static; }
.carousel-inner > .item{ display:block;}
.carousel .row { margin-left:30px; margin-right:30px;}

h2.featurette-heading, .marketing h2{ margin-top:35px; font-size:36px;}
.marketing h3, .marketing .span4 p{ margin-left:0;}
.marketing h2{ margin-left:30px; margin-right:30px;}
.marketing a.viewall:before, .marketing a.viewall:after{ /*content: "";  display: table; line-height: 0; clear:both; */}
.marketing a.viewall{ text-align:left; display:inline; }
h2.fitday-articles-header{ display:block; font-size:34px;}
h2.fitday-articles-header:before, h2.fitday-articles-header:after{ content: "";  display: table; line-height: 0; clear:both;  }

.featurewrape.dietitian{ height:680px; text-align:right; background: url("/images/home/wood_long.gif") repeat-x left top; }
.featurewrape.dietitian iframe{ width:420px; height:235px; margin-left:30px; margin-right:30px;}
.featurewrape.dietitian .learn-more{ color:#333333;}
.featurewrape.dietitian .featurette-image.pull-left{ height:260px; min-width:100%;}

.featurewrape.premium { height:800px;}
.featurewrape.premium .featurette-image.pull-right{ height:320px;}
.featurewrape.premium {background: url("/images/home/mobile-runner.jpg") no-repeat #000;  }

.featurewrape.pc{ height:680px; }
.featurewrape.pc .featurette-image.pull-left{ height:300px; }
.featurewrape.pc {background: url("/images/home/mobile-pc-calorie-counter.jpg") no-repeat #FFF; }

.featurewrape.mobile{ height:680px; }
.featurewrape.mobile .featurette-image.pull-right{ height:280px;}
.featurewrape.mobile {background: url("/images/home/mobile-application.jpg") no-repeat #FFF; }
.featurewrape.mobile .featurette-image.pull-right img{ display:none;}

.pc-calorie{ background-size:220px auto; background-position:right bottom;}
.featurette-image img{ max-width:300px;}

.featurewrape.dietitian .row, .featurewrape.premium .row, .featurewrape.pc .row, .featurewrape.mobile .row { margin-top: 0;}
.featurewrape.get-ready .btn-create-account { margin:45px auto 30px; }
.featurewrape.get-ready h2{ clear:both; width:480px;}
.featurewrape.get-ready{ height:245px}
.footer-links{ width:80%;}

/* responsive header */
.navbar-wrapper{ display:none;}
#mobile-nav, #mobile-profile { display: none;}
#mobile-header { position: relative;clear:both; display: block; height:55px; overflow:hidden;background:#ffffff; border-bottom:1px solid #F1F1F1; }
#mobile-logo { position:absolute; left:50%; margin-left:-100px; display:block; width:200px; height:40px; top:12px;}
#mobile-logo img{ display:block; width:200px; height:auto; border:0; padding:0;}

#responsive-menu{ width:48px; height:48px;display: inline-block;  }
#profile-menu{ width:48px; height:48px; display: inline-block;  float:right; }

/* mobile nav */
#mobile-nav{  background:#455868;}
#mobile-nav ul{ height:auto; margin-left:10px; padding:10px;}
#mobile-nav ul li{ margin-left:0; padding-left:0;}
#mobile-nav li {display: block;	float: none; width: 100%;}
#mobile-nav li a { border-bottom: 1px solid #576979; color:#fff; line-height:36px; font-size:28px;}

#mobile-profile{  background:#455868;}
#mobile-profile ul{ height:auto; margin-left:10px; padding:10px; padding-right:20px;}
#mobile-profile ul li{ margin-left:0; padding-left:0;}
#mobile-profile li {display: block;	float: none; width: 100%; text-align:right;}
#mobile-profile li a { border-bottom: 1px solid #576979; color:#fff; line-height:36px; font-size:28px;}



}
