/* Vermont Food Bank - Homepage */

body { margin:0; padding:0; background:#fff url('/_common/img/yellow_divide.gif') repeat-x 50% 124px; font:12px/15px arial; color:#666; }
p { margin:0; padding:0; font:11px/14px arial; color:#000; }
img { border:0; }

#container { margin:0 auto 0 auto; padding:0; width:760px; }
#header { margin:0; padding:0; height:133px; }
#logo { float:left; margin-top: 15px; }
#main_image { height: 285px; padding: 0; margin:0; }
#main_image_no_flash { padding:0; margin:0; position:relative; top:0; left:0; }
#yellow_divide { padding: 9px 0 0; background: #FFFFE1 url('/_common/img/yellow_divide.gif') repeat-x top center; }

h6 { margin:0; padding:0 0 4px 0; font:13px arial; color:#E17F26; font-weight:bold; } 

/* Navigation */
#nav { position:relative; float:right; height: 128px; overflow: hidden; padding-top:5px; background-color:#E17F26; }
#nav p { margin:0; padding:0; width:239px; }

/* Side Nav */
#side_nav { position:relative; margin:0; padding: 0 6px 50px; width:234px; float:right; }
.side_nav_content { margin-top:9px; }
.left-17 { margin-left: 8px; }
.with-border { border-top: 1px solid #FFD200; border-bottom: 1px solid #FFD200; }

.side_nav_content .text_area { padding:15px 20px; font:12px/15px arial; color:#000; background: #FFFFE0; }
.side_nav_content .text_area h1 { margin:0; padding:0 0 2px 0; font:11px arial; font-weight:bold; }
.side_nav_content .text_area p { padding:0 0 5px 0; }
.side_nav_content .text_area p.title { font-size: 12px; font-weight: bold; color: #393938; }

.side_nav_content .login { clear: both; padding: 15px 10px 0; color: #000; }
.side_nav_content .login h1 { margin:0; padding:0 0 2px 0; font:11px arial; font-weight:bold; }
.side_nav_content .login input { float: left; width: 125px; }
.side_nav_content .login .login_button { float: left; margin-left: 15px; }
.side_nav_content .login .login_button input { float: left; width: 66px; }

.side_nav_content .signup { padding: 0 10px; color: #000; }
.side_nav_content .signup h1 { margin:0; padding:0 0 2px 0; font:11px arial; font-weight:bold; }
.side_nav_content .signup input { float: left; width: 125px; }
.side_nav_content .signup #button_join { float: left; width: 66px; margin-top: 4px; margin-left: 12px; }
.side_nav_content .signup #checkbox_advocacy,
.side_nav_content .signup #checkbox_news { float: none; width: auto; }

.side_nav_content .donatebutton { clear: both; text-align:center;  padding: 15px 0 10px 0;}
.side_nav_content .sharebutton { float: left; padding: 25px 0 0 37px ; }
.side_nav_content .socialbuttons { float: left; padding: 18px 0 0 42px; }
.side_nav_content .socialbuttons a { display: block; float: left; height: 30px; width: 31px; margin-left: 2px; }

/* side nav middle content area */
.side_nav_white { position:relative; }
.side_nav_white .text_area_white { padding:15px 13px; background:#ffffff; }
.side_nav_white .text_area_white h1 { margin:0; padding:0 0 2px 0; font:12px arial; font-weight:bold; color: #393938; }
.side_nav_white .text_area_white p { padding:0 0 5px 0; }
.sidenav_bar { position:relative; width: 230px; } /* yellow divides */

/* Content Area */
#content_container { position:relative; margin: 0 auto; padding:0 0 0 4px; width:760px; background:url('/_common/img/container_bg.jpg') repeat-y 100% 0; }
#content { margin:19px 0 50px 0; width:500px; float:left; }
.inline { margin:5px; }
/* main callouts for content area */
#title_food { position:relative; left:0; top:2px; background:url('/home/img/title_vt_only_food_bank.gif') no-repeat; height:19px; }
#title_network { position:relative; left:0; top:2px; background:url('/home/img/title_around_our_network.gif') no-repeat; height:19px; }

.content_row { padding:0; width:500px; font-size:14px; font-weight:bold; color:#333; }
.content_row p { padding:0; width:500px; font-size:14px; line-height: 15px; font-weight:bold; color:#333; }
.content_image { position:relative; left:0; top:-10px; float:left; }
.content_text { position:relative; left:-13px; top:-5px; float:right; width:322px; }
.content_text p { padding:0 0 6px 0; font:11px/14px arial; }
.content_text p a { padding:0 0 20px 0; }
span.sm_link { padding-top:3px; }
/* patterned box callout */
#callout_bg { position:relative; width: 495px; border: 1px solid #FED200; background: #fff; }
#callout_controls { height: 25px; padding: 6px 15px 3px; background: url(/_common/img/bg-callout.gif) no-repeat 15px 100%; font-size: 12px; color: #666; }
#callout_controls .rotator_num { height: 19px; padding-left: 3px; line-height: 19px; }
#callout_controls #prev-slide,
#callout_controls #next-slide { display: block; float: left; height: 19px; width: 21px; margin-right: 1px; }
#callout_text { position: relative; margin: 2px 15px 10px; padding-bottom: 25px; }
#callout_text .callout { float: left; clear: both; width: 465px; padding: 10px 0 0; }
#login_button { position:relative; left:0; top:5px; }

#flickr-container p { display: block; float: left; margin-right: 10px; }
#flickr-container p img { width: 109px; -ms-interpolation-mode: bicubic; }

.feed-title { float: left; clear: both; width: 492px; margin: 15px 0 0; padding-bottom: 10px; }
.feed-title h3 { float: left; margin: 0; }

.column-container { clear: both; }
.column-container .col-a { float: left; width: 238px; margin-right: 15px; }
.column-container .col-b { float: left; width: 238px; }
.column-container .feed-title { width: 238px; }

.column-container .feed-title { height: 20px; border-bottom: 1px solid #FFD200; }

.column-container ul { width: 210px; margin: 0; padding: 0; list-style: none; }
.column-container ul li { float: left; clear: both; width: 185px; margin: 12px 0 0 12px; padding: 3px 0 0 15px; background: url(/_common/img/bg-feed-item.gif) no-repeat 0 8px; }
.column-container ul li a { word-wrap: break-word; }

.column-container h3 { float: left; }
.column-container p.all,
.feed-title p.all { float: right; margin-top: 5px; padding-right: 25px; }
.column-container p.all a,
.feed-title p.all a { text-transform: lowercase; text-decoration: underline; font-size: 12px; }

#flickr-container { clear: both; }
#blog-container { clear: both; }
#twitter-container { clear: both; }

.flickr h3 { display: block; height: 23px; width: 224px; background: url(/_common/img/label_flickr.gif) no-repeat 0 0; text-indent: -9999px; }
.blog h3 { display: block; height: 25px; width: 131px; background: url(/_common/img/label_blog.gif) no-repeat 0 0; text-indent: -9999px; }
.twitter h3 { display: block; height: 25px; width: 131px; background: url(/_common/img/label_twitter.gif) no-repeat 0 0; text-indent: -9999px; }

/* Footer */
#orange_bg { background:#E17F26; }
#footer-home { margin:0 auto 0 auto; padding: 20px 0; height:250px; width:760px; }
#footer-home #footer_callout { position:relative; left:0; top:0; }
#footer-home #footer_row { position:relative; left: 120px; top:-90px; float:left; }
#footer-home p { margin:0; padding:0 0 3px 0; font:12px arial; color:#fff; font-weight:normal; text-align:left; }
#footer-home p.tiny { margin:0; padding:0 0 3px 0; font:9px arial; color:#fff; font-weight:normal; text-align:left; }
#footer-home p.credit { padding:24px 0; }

/* Links */
a.sidenav:link, a.sidenav:visited { color:#064593; text-decoration:none; font-weight:bold; }
a.sidenav:active, a.sidenav:hover { color:#064593; text-decoration:underline; font-weight:bold; }

a:link, a:visited { color:#E17F26; text-decoration:none; font-weight:bold; }
a:active, a:hover { color:#E17F26; text-decoration:underline; font-weight:bold; }

a.normal:link, a.normal:visited { color:#E17F26; text-decoration:none; font:11px arial; }
a.normal:active, a.normal:hover { color:#E17F26; text-decoration:underline; font:11px arial; }

a.footlink:link, a.footlink:visited { color:#fff; text-decoration:none; font-weight:bold; font:12px arial; }
a.footlink:active, a.footlink:hover { color:#fff; text-decoration:underline; font-weight:bold; font:12px arial; }

a.footlink_sm:link, a.footlink_sm:visited { color:#fff; text-decoration:none; font-weight:bold; font:11px arial; }
a.footlink_sm:active, a.footlink_sm:hover { color:#fff; text-decoration:underline; font-weight:bold; font:11px arial; }

a.proplink:link, a.proplink:visited { color:#666; text-decoration:none; font-weight:normal; font:10px arial; }
a.proplink:active, a.proplink:hover { color:#666; text-decoration:underline; font-weight:normal; font:10px arial; }

#footer_row .first-line,
#footer_row .first-line a { font-size: 14px; font-weight: bold; }
