/* GENERAL */
/*--------------*/

a:focus, a:active                           { outline: none; }
.clear                                      { clear: both; }
img.before                                  { float: left; padding: 10px 10px 0 0; }
img.after                                   { float: right; padding: 10px 0 0 10px; }
img.insert                                  { padding: 10px 0 15px 0; }

/*#sub-header h2 { text-indent: -5000px; width: 92px; height: 24px; background: url(/products/bento/images/logo_bento3.png) no-repeat 0 0; }*/

/* CONTENT */
/*---------*/
.bento-content-wrapper                      { background: url(/products/bento/images/bg_lower_area_top.png) no-repeat 0 0; bo}
.bento-content-wrapper-inner                { padding: 20px 0 20px 20px !important; background: url(/products/bento/images/bg_lower_area_bottom.png) no-repeat 0 100%; }
.lowerAreaContainer                         { padding: 20px 0 20px 20px !important; background: url(/products/bento/images/bg_lower_area_bottom.png) no-repeat 0 100%; }
.bento #lower-area                          { width: 719px; padding-right: 20px !important; border-right: 1px solid #ccc;  }
#right-col                                  { width: 200px !important; }
#lower-area p, #lower-area li, 
#right-col p, #right-col li                 { color: #616161; line-height: 130%; }
#lower-area h3                              { margin-bottom: 0; }

/* WHAT'S NEW AND WHAT IS BENTO */
/* whats-new.html, what-is-bento.html */
/*------------------------------------*/

body#whats-new #lower-area, 
body#what-is-bento #lower-area              { width: 100% !important; border-right: 0; }
body#whats-new #right-col, 
body#what-is-bento #right-col               { display: none; }

#feature-area                               { background: url(/products/bento/images/bg_feature_area.jpg) no-repeat 0 0; padding-top: 30px; height: 510px; }
#feature-area h2                            { width: 100px; height: 32px; float: left; background: url(/products/bento/images/logo_bento3.png) no-repeat 0 0; text-indent: -5000px; margin-left: 15px; }
#feature-graphic                            { background: url(/products/bento/images/feature_what_is_bento.png) no-repeat 50% 110px; clear: both; height: 440px; }
#feature-area h3                            { height: 46px; background: url(/products/bento/images/heading_what_is_bento.png) no-repeat 50% 0; text-indent: -5000px; margin: 10px 0 8px 0; }
#feature-area h4                            { height: 21px; background: url(/products/bento/images/heading2_what_is_bento.png) no-repeat 50% 0; text-indent: -5000px; }
  body#whats-new #feature-area h4           { background-image: url(/products/bento/images/heading2_whats_new.png); }
#feature-area .feature-intro                { margin-top: 370px; padding: 0 30px 0 40px; }
#feature-area .feature-intro p              { font-weight: bold; font-size: 110%; line-height: 130%; width: 60%; float: left; }
#feature-area .feature-intro span           { display: block; float: right; }

/* Bento Content Nav */
/*-------------------*/

#bento-nav                                  { background: url(/products/bento/images/bg_bento_nav.png) no-repeat 0 0; height: 175px; width: 966px; padding-top: 10px; margin-left: 0 !important; margin-bottom: 0; }
#bento-nav li a                             { font-size: 100%; font-weight: bold; height: 165px !important; display: block !important; width: 150px; margin-right: 10px; height: 50px; text-decoration: none; border-right: 1px solid #ddd; }
#bento-nav li.last a                        { margin-right: 0; border-right: 0; }
#bento-nav li a:link                        { color: #333; }
#bento-nav li a:visited                     { color: #333; }
#bento-nav li a:hover                       { color: #006e98 !important; }
#bento-nav li a:active                      { color: #333; }
#bento-nav li                               { float: left; list-style: none; text-align: center; }
#bento-nav li img                           { width: 125px; height: 115px; }
#bento-nav li span                          { display: block; }
#bento-nav li a:hover span                  { color: #006e98 !important; }
#bento-nav li a:hover strong                { color: #006e98 !important; }

  /* What's New Page Content Nav */
  #whats-new #bento-nav                     { background-image: url(/products/bento/images/bg_bento_nav_whats_new.png); height: 203px; padding-top: 5px; }
  #whats-new #bento-nav li img              { width: 189px; height: 128px; }
  #whats-new #bento-nav li a                { width: 230px; }
  #whats-new #bento-nav li span             { margin-left: 25px; text-align: left; color: #616161; font-weight: normal; }
  #whats-new #bento-nav li strong           { display: block; color: #333; font-weight: bold; }
  
/* Content */
/*---------*/

#upgrade-now                                { position: relative; background: url(/products/bento/images/bg_upgrade_now.png) no-repeat 0 0; padding: 30px 50px; }
#upgrade-now span                           { color: #616161; position: absolute; top: 35px; left: 170px; }
#upgrade-now strong                         { font-size: 120%; padding-right: 10px;}
#upgrade-now span a                         { margin-left: 10px; }

#bento-content                              { clear: both; background: url(/products/bento/images/bg_content_mid.png) repeat-y 0 0; }
#bento-content-wrapper                      { padding: 20px 20px 40px 20px;  background: url(/products/bento/images/bg_content_bottom.jpg) no-repeat 0 100%; }

.feature                                    { clear: both; margin: 10px 0; padding: 10px 0; width: 925px; }

.feature.img-left img                       { float: left; }
.feature.img-left .feature-content          { margin-left: 580px; width: 345px; }

.feature.img-right img                      { float: right; }
.feature.img-right .feature-content         { width: 345px; }

.feature h3                                 { font: normal 170% "Helvetica Neue", Helvetica, Arial, sans-serif; padding: 0; }
.feature h4                                 { font-size: 120%; font-weight: normal; color: #6f010e; margin-bottom: 10px; padding-top: 3px; line-height: 140%; }
.feature a                                  { color: #188dc8; }
.feature a.more                             { background-image: url(/products/bento/images/bullet_arrow_right.png); }
.feature p                                  { color: #444; line-height: 140%; }

.bento-callout                              { margin-top: 15px; width: 343px; background: url(/products/bento/images/bg_callout_top.png) no-repeat 0 0; padding-top: 9px; }
.callout-wrapper                            { background: url(/products/bento/images/bg_callout_bottom.png) no-repeat 100% 100%; padding: 10px 10px 20px 10px; }
.bento-callout img                          { float: left !important; padding: 0 0 0 10px; }
.bento-callout h4                           { margin-left: 160px; color: #000; font-size: 130%; font-weight: normal; }
.bento-callout p                            { margin-left: 160px; }

.top                                        { clear: both; float: right; }
.top a                                      { color: #188dc8; margin-right: 20px; padding-right: 10px; background: url(/products/bento/images/bullet_arrow_up.png) no-repeat 100% 2px; }

.callout-med                                { clear: both; width: 700px; margin: 0 auto; }
.callout-med .bento-callout                 { float: right; }
.callout-med ul                             { margin-left: 20px !important; }
.callout-med li                             { margin-bottom: 3px; }
.callout-med                                { background: url(/products/bento/images/bg_callout_med_top.png) no-repeat 0 0; padding-top: 5px; }
.callout-med-wrapper                        { padding: 5px 20px 20px 20px; background: url(/products/bento/images/bg_callout_med_bottom.png) no-repeat 100% 100%; }
.lg                                         { margin: 0 20px; }

/* DEMOS */
/* videos.html */
/*-------------*/

body#tours-profiles #feature-area           { background: url(/products/bento/images/feature_bento_tours_profiles.png) no-repeat 0 0; height: 320px; }
body#tours-tours #feature-area              { background: url(/products/bento/images/feature_bento_demos.jpg) no-repeat 0 -40px; height: 400px; }
body#tours-tours #feature-area              { border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
body#tours-tours #feature-area h3           { background: url(/products/bento/images/heading_bento_demos.png) no-repeat 50% 0 !important; padding-top: 30px !important; }
body#tours-tutorials #feature-area          { background: url(/products/bento/images/feature_bento_tours_tutorials.png) no-repeat 0 0; height: 480px; }
#feature-area h2#heading-tours-profiles     { background: url(/products/bento/images/heading_bento_profiles.png) no-repeat 0 70px; text-indent: -3000px; width: 254px;	height: 24px; padding-top: 150px; margin: 0 0 0 270px; }
.tours-intro                                { font-size: 110%; margin-bottom: 20px; }
.tours-intro h2                             { margin-bottom: 0; padding-bottom: 0; }

.video                                      { position: relative; float: left; padding-bottom: 30px; }
.video img                                  { position: absolute; top: 8px; left: 8px; }
.video #overlay-button                      { top: 0; left: 0; z-index: 999; behavior: url(/javascript/iepngfix.htc);  }
.video h4, .video p                         { margin: 0 0 0 125px; }
.video h4                                   { margin-bottom: 0; }
.video p                                    { margin-bottom: 5px; }
.watchvideo                                 { margin-top: 0 !important; }
.tours-intro .watchvideo                    { font-size: 110%; color: #616161; display: inline; margin: 0; padding: 0; }

/* FOR ETS */
/* for_ets.html */
/*-------------*/
body#for-ets #feature-area                  { height: 500px; }
body#for-ets #feature-area p                { margin-top: 330px; }
body#for-ets #lower-area                    { width 100% !important; border: 0; }

/* BENTO FOR IPHONE */
/* iphone.html */
/*------------------*/

body#iphone #feature-area, 
body#iphone-soon #feature-area							        { background: url(/products/bento/images/feature_bento_for_iphone2.jpg) no-repeat 0 -10px; height: 520px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
body#iphone #related-nav                            { margin-bottom: 22px; }
body#iphone #feature-area h3                			  { clear: both; background: url(/products/bento/images/graphic_title_iphone_way.png) no-repeat 50% ; text-indent: -4000px; height: 48px; padding: 0 !important;}
body#iphone-soon #feature-area h3                		{ clear: both; background: url(/products/bento/images/graphic_title_iphone_way2.png) no-repeat 50% ; text-indent: -4000px; height: 96px; padding: 0 !important;}

/* BENTO FOR IPAD */
/* ipad.html */

/* Just in case JavaScript is off */
body#ipad li#subnav-free-trial,
body#ipad li#subnav-buynow,
body#ipad li#subnav-buynow-iphone 						{ display: none; }
body#ipad li#subnav-buynow-ipad							{ display: block !important; }

body#ipad #feature-area									{ background: url(/products/bento/images/feature_bento_ipad.jpg) no-repeat 0 -10px; height: 300px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
body#ipad #related-nav                            		{ margin-bottom: 22px; }
body#ipad #feature-area h3                			  	{ clear: both; background: url(/products/bento/images/headline_organize_details.png) no-repeat 590px; text-indent: -4000px; height: 129px; padding: 0 !important; margin-top: 5px;}
body#ipad #feature-area p#buynow-button					{ float: right; margin: 20px 215px 0 0; }
body#ipad #feature-area p#subheadline					{ float: right; margin: 5px 5px 0 0; font-size: 16px; width: 350px; line-height: 25px; color: #888888; clear: both;}

body#ipad #lower-area h3								{ margin: 20px 0; }
body#ipad #lower-area p									{ line-height: 20px; }
body#ipad #lower-area p.templates-title 				{ font-weight: bold; margin-top: 20px; }
body#ipad #lower-area div.firstcolumn.offive 			{ margin-left: -10px; }
body#ipad #lower-area div.lastcolumn.offive 			{ width: 150px; }
body#ipad #lower-area div.offive 						{ float: left; padding-right: 25px; }
	body#ipad #lower-area div.offive ul 				{ margin-top: 10px; }
		body#ipad #lower-area div.offive ul li 			{ padding-bottom: 5px; }

body#ipad #lower-area span.red 							{ color: #820e1a; font-weight: bold; }
body#ipad #lower-area div.note 							{ background-color: #fff; border: 1px solid #ccc; padding: 15px; margin: 10px 0 15px 0; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
	body#ipad #lower-area div.note p 					{ line-height: 15px; }
	
body#ipad .promo img							{ margin-left: -10px;}

/* BENTO USES */
/* /products/bento/uses/index.html */
/*---------------------------------*/

body#uses #feature-area                             { height: 450px; background: url(/products/bento/images/feature_bento_uses3.jpg) no-repeat 0 -40px; }
body#uses #feature-area                             { border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
body#uses #feature-area h3                     		  { clear: both; background: url(/products/bento/images/heading_bento_uses.png) no-repeat 50% 0; text-indent: -4000px; height: 55px; }
body#uses #feature-intro                            { font-size: 120% !important; width: 520px; margin-left: 245px; margin-top: 320px !important; line-height: 130%; }
body#uses #feature-intro p                          { font-size: 100%; }
.uses                                               { float:right; margin-top: -43px; font-size: 85%;  }

body#uses #right-col                                { display: none; }
body#uses #lower-area h3                            { margin-bottom: 10px; color: #333; font-size: 125%;	font-weight: bold; }
body#uses .colonnade                                { width: 960px;}
body#uses #lower-area .ofthree                      { margin-right: 5px !important; width: 316px; margin: 0; background: url(/products/bento/images/bg_bento_uses_column_bottom.png) no-repeat bottom left; }
body#uses #lower-area .lastcolumn                   { margin-right: 0 !important; }
body#uses #lower-area .ofthree div                  { height: 250px; width: 296px; padding: 0 10px; background: url(/products/bento/images/bg_bento_uses_column_top.png) no-repeat 0 0; }
body#uses #lower-area .ofthree img                  { margin-top: 20px; }
  body#uses #lower-area .firstcolumn img            { margin-left: 40px !important; }
  body#uses #lower-area .middlecolumn img           { margin-left: 55px; }
  body#uses #lower-area .lastcolumn img             { margin-left: 75px; }
  
body#uses #nav-using-bento, 
body#stories-home #nav-using-bento, 
body#stories #nav-using-bento	                      { color: #000 !important; }

/* ALL FEATURES */
/* /products/bento/all-features.html */
/*-----------------------------------*/

body#all-features .feature                          { width: 700px; padding-top: 20px; }
body#all-features .feature.img-left .feature-content { margin-left: 360px; }
body#all-features #lower-area .bulleted { margin-top: 10px; }
body#all-features #lower-area .bulleted li { margin-bottom: 5px; }

.new                                                { color: #CC0033; }

/* FROM OLD BENTO CSS */
/*--------------------*/

/* Sidebar */

#sideNav                                            { margin: 0 !important; width: 199px; }
#sideNav li                                         { list-style: none; }
#sideNav li span                                    { display: block; padding: 0 10px; }
#sideNav li a                                       { display: block; padding: 10px 0 10px 10px; padding-right: 10px !important; text-decoration: none; border-bottom: 1px solid #ccc; background: url(/products/bento/images/sidebar_bullet_arrow_up.png) no-repeat 95% 12px; }
#sideNav li a:link                                  { color: #616161; }
#sideNav li a:visited                               { color: #616161; }
#sideNav li a:hover                                 { color: #000; background-image: url(/products/bento/images/sidebar_bullet_arrow_over.png); }
#sideNav li a:active                                { color: #000; }

.sub-nav                                            { display: none; }
.sub-nav ul                                         { margin-left: 0 !important; background: #efefef; padding-bottom: 10px; }
.sub-nav ul span                                    { padding-left: 30px !important; }
.sub-nav li a                                       { color: #616161 !important; border-bottom: 0 !important; font-size: 90%; padding: 5px 25px 5px 0 !important; background: url(/products/bento/images/sidebar_sub_bullet_arrow.png) no-repeat 144px 9px !important; }

#right-col .promo                                    { padding: 10px 20px; }
#right-col .promo h3                                 { font-size: 110%; }

  /* selected */
	#sideNav li.selected                              { background: #efefef; margin-top: -1px; }
	#sideNav ul li ul li.selected                     { background: #d4d4d4; margin-top: -1px; }
  #sideNav li.selected a                            { font-weight: bold; color: #000; background-image: url(/products/bento/images/sidebar_bullet_arrow_active.png); }
	#sideNav .sub-nav.selected                        { background: #efefef; }
  #sideNav .sub-nav li                          	  { display: block;  }
	#sideNav .sub-nav li.selected span                { background: #d4d4d4; margin-top: -1px; } 
	#sideNav .sub-nav li a                            { font-weight: normal; }
	#sideNav .sub-nav li.selected a                   { font-weight: normal; color: #000 !important; background-image: url(/products/bento/images/sidebar_sub_bullet_arrow_active.png) !important; } 

/* Bottom Callout */
div.ofthree                                         { width: 32%; float: left; margin-right: 30px; }
div.lastcolumn                                      { width: 29%; margin-right: 0; }
div.colonnade p                                     { color: #444; }

#callout-bottom                       		          { position: relative; margin: 25px 0; padding-top: 10px; background: url(/products/bento/images/bg_bottom_callout_top.png) no-repeat 0 0; }
.callout-bottom-wrapper               		          { height: 205px; padding: 0 20px 20px 20px; background: url(/products/bento/images/bg_bottom_callout_bottom.png) no-repeat 0 100%; }

div#callout-bottom h3                               { font-size: 120%; margin: 10px 0; color: #333; line-height: 130%; }
div#callout-bottom img                              { position: absolute; bottom: 25px; }
div#callout-bottom a                                { color: #333; text-decoration: none; }
div#callout-bottom .firstcolumn h3, 
div#callout-bottom .firstcolumn p, 
div#callout-bottom .firstcolumn img 								{ margin-left: 25px; }
#callout-bottom .lastcolumn 												{ background: url(/products/bento/images/boxshot_bento3_80px.png) no-repeat 100% 10px; }


#promo-btx h3                                       { text-align: center !important; }
#promo-get-bento img                                { top: 20px; right: 40px; }
#promo-get-bento p.buy-now                          { margin-top: 20px; }
