/*
* 
* A BETTER LA
* 
* "Styles upon styles upon styles..."
*
* Theme Name: A Better LA
* Theme URI: http://abetterla.org
* Description: A Better LA Theme
* Author: Paul Singh
* Author URI: http://paulsingh.net
* Version: 1.0
*
*/



/* ---------- CSS RESET ---------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
   margin: 0;
   padding: 0;
   border: 0;
   font-size: 100%;
   font: inherit;
   vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
   display: block;
}
body {
   line-height: 1;
}
ol, ul {
   list-style: none;
}
blockquote, q {
   quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
   content: '';
   content: none;
}
table {
   border-collapse: collapse;
   border-spacing: 0;
}

/* My additions */

input, select, textarea
{
  margin: 0;
  padding: 0;
}

/* Clearfix */

.clearfix:before,
.clearfix:after {
    content:"";
    display:table;
}
.clearfix:after {
    clear:both;
}
/* For IE 6/7 (trigger hasLayout) */
.clearfix {
    zoom:1;
}

/* ---------- FONTS ---------- */

@font-face {
    font-family: 'Adventor';
    src: url('fonts/texgyreadventor-regular-webfont.eot');
    src: url('fonts/texgyreadventor-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/texgyreadventor-regular-webfont.woff') format('woff'),
         url('fonts/texgyreadventor-regular-webfont.ttf') format('truetype'),
         url('fonts/texgyreadventor-regular-webfont.svg#TeXGyreAdventorRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Adventor';
    src: url('fonts/texgyreadventor-italic-webfont.eot');
    src: url('fonts/texgyreadventor-italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/texgyreadventor-italic-webfont.woff') format('woff'),
         url('fonts/texgyreadventor-italic-webfont.ttf') format('truetype'),
         url('fonts/texgyreadventor-italic-webfont.svg#TeXGyreAdventorItalic') format('svg');
    font-weight: normal;
    font-style: italic;
}

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

@font-face {
    font-family: 'Adventor';
    src: url('fonts/texgyreadventor-bolditalic-webfont.eot');
    src: url('fonts/texgyreadventor-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/texgyreadventor-bolditalic-webfont.woff') format('woff'),
         url('fonts/texgyreadventor-bolditalic-webfont.ttf') format('truetype'),
         url('fonts/texgyreadventor-bolditalic-webfont.svg#TeXGyreAdventorBoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
}

/* ---------- TYPOGRAPHY ---------- */

body
{
   color: #494949;
   background: #fff;
   font-family: 'Adventor', Arial, sans-serif;  
   font-size: 15px;
   font-weight: normal;
   font-style: normal;
   -webkit-text-size-adjust: 100%; /* So iOS doesn't resize fonts */   
}

i, em, blockquote
{
   font-style: italic;
}

b, strong
{
   font-weight: bold;
}

h1 
{
   font-size: 24px;
   line-height: 36px;
   margin-bottom: 10px;
   font-weight: bold;
}

h2 
{
   font-size: 18px;
   line-height: 27px;
   margin-bottom: 5px;
   font-weight: bold;
}

p, blockquote
{
   line-height: 22px;
   margin-bottom: 20px;
}

sup
{
   font-size: 9px;
   vertical-align: top;
}

blockquote
{
   margin: 15px 30px;
}

a, a:visited, a:hover, a:active
{
  color: #494949;
}

/* ---------- WORDPRESS REQUIRED ---------- */

.alignleft 
{
   float: left !important;
}

.alignright 
{
   float: right !important;
}

.aligncenter 
{    
   display: block !important;
   margin-left: auto !important;
   margin-right: auto !important;
}

/* ---------- STRUCTURE ---------- */

.container
{
   width: 1024px;
   margin: 0 auto;
   position: relative;
}

#header
{
  position: relative;
  height: 370px;
}

#main-content
{
   /*float: left;*/
   width: 648px;
   padding: 45px 80px 45px 80px;
   background: #cadcdf;
   /*background: #d2dde5;*/
   margin-bottom: 0px;
   padding-bottom: 80px; /* For footer */
   position: relative;
   top: 0;
   bottom: 0;
   left: 0;
}

#sidebar
{
   position: absolute;
   top: 370px;
   bottom: 0;
   right: 0;
   width: 216px;
   background: url('images/background_map.jpg') 0 -210px;
   padding-bottom: 80px; /* For footer */
}

#footer
{
   clear: both;
   width: 1024px;
   margin: 0 auto;
   text-align: center;   
   position: absolute;
   bottom: 10px;
}

/* ---------- NAVIGATION ---------- */

.navigation
{
  position: absolute;
  top: 24px;
  left: 0px;
  z-index: 15;
}

.navigation li
{
  list-style: none;
  display: inline;
  margin: 0 34px;
}

.navigation a:hover, li.current-menu-item
{
  border-bottom: 3px solid white;
}

.navigation img
{
  height: 20px;

}

li.nav-about img
{
  background: url(images/navigation2.png) 0 0 no-repeat;
  width: 84px;
  background-size: cover;
}

li.nav-programs img
{
  background: url(images/navigation2.png) -116px 0 no-repeat;
  width: 85px;

}

li.nav-testimonials img
{
  background: url(images/navigation2.png) -236px 0 no-repeat;
  width: 106px;
}

li.nav-leadership img
{
  background: url(images/navigation2.png) -421px 0 no-repeat;
  width: 103px;
  background-size: cover;
}

li.nav-contact img
{
  background: url(images/navigation2.png) -513px 0 no-repeat;
  width: 70px;
}

li.nav-thriftshop img
{
  background: url(images/navigation_thriftshop.png) 0 0 no-repeat;
  width: 86px;
}

li.nav-engagement img
{
  background: url(images/navigation_engagement.png) 0 0 no-repeat;
  width: 118px;   
}

/* ---------- HEADER BOX ---------- */

#header-box
{
  position: absolute;
  top: 18px;
  right: 18px;
  bottom: 50px;
  width: 185px;
  z-index: 15;
  background: rgba(0,0,0,0.1);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#19000000, endColorstr=#19000000); /* IE 6/7 */
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#19000000, endColorstr=#19000000)"; /* IE8 */
  text-align: center;

  /*top: 15px;
  bottom: 15px;*/
}

#header-box img
{
  margin-top: 20px;
  /*margin-top: 10px;*/
}

#header-box img.button_donate
{  
   width: 130px;
}

/* ---------- SIDEBAR ---------- */

#sidebar
{
  text-align: center;
}

.sidebar-box
{
  color: #79797c;
  width: 184px;
  margin: 20px auto 0 auto;
  padding: 15px 0 10px 0;
  text-align: center;
  background: rgba(0,0,0,0.075);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#19000000, endColorstr=#19000000); /* IE 6/7 */
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#19000000, endColorstr=#19000000)"; /* IE8 */
}

.sidebar-box a, .sidebar-box a:visited
{
   color: #79797c;
}

.sidebar-box h2
{
   margin-bottom: 8px;
}

#page_home .sidebar-box p,
.sidebar-box p
{
   margin-left: 20px;
   margin-right: 20px;   
   margin-bottom: 15px;
}

#social-links
{
   margin-bottom: 15px;
}

#social-links li
{
  list-style: none;
  display: inline;
  margin: 0 1px 0 0;
}

#social-links img
{
  height: 30px;
}

.social_buton
{
   width: 30px;
}

#social-label
{
  background: url(images/buttons_social.png) 0 0px no-repeat;
  width: 129px;
  height: 20px;
}

#social-facebook
{
  background: url(images/buttons_social.png) 0 -0 no-repeat;
  background-size: cover;
}

#social-twitter
{
  background: url(images/buttons_social.png) -34px 0 no-repeat;
  background-size: cover;
}

#social-flickr
{
  background: url(images/buttons_social.png) -69px 0 no-repeat;
  background-size: cover;
}

#social-youtube
{
  background: url(images/buttons_social.png) -104px 0 no-repeat;
  background-size: cover;
}

.sidebar-quote
{
  font-family: "Times New Roman", Times, serif;
  color: #77777F;
  margin-top: 11px;
  font-size: 1.6em;
  font-style: italic;
  padding: 0 5px;
}

#newsletter
{
  position: relative;
  width: 158px;
  margin: 0 auto;
}


#newsletter-label
{
  background: url(images/label_newsletter.png) 0 0px no-repeat;
  width: 158px;
  height: 23px;
  margin-bottom: 10px;
}

#newsletter-email
{
  width: 110px; 
  font-size: 12px;
  height: 21px;
  border: 2px solid #cecece;
  color: #494949;   
  padding-left: 10px;
  margin-left: 5px;
  float: left;
}

#newsletter-submit
{
  border: 2px solid #cecece;
  background: #fff;
  padding-left: 2px;
  float: left;
}

#archive-box p
{
   color: #77777f;
   font-weight: bold;
   font-size: 16px;
   letter-spacing: .7px;   
}

#archives-list a
{
   color: #77777f;
   line-height: 25px;
}

/* ---------- FOOTER ---------- */

#footer li
{
  list-style: none;
  display: inline;
  font-size: 14px; 
  margin: 4px 27px;
}

#footer p
{
  margin: 10px 12px;
  font-size: 12px;
}

/* ---------- CONTENT AREA ---------- */


#main-content ul
{
   list-style: disc;
   margin: 0 0 30px 20px;
}


#main-content li
{
   padding-left: 10px;
   margin: 10px 0;
   line-height: 1.25em;
}


#main-content img
{
   max-width: 612px;
   height: auto !important;
}
/* ---------- HOME PAGE ---------- */

.slogan
{
  color: #fff;
  font-size: 1em;
  width: 80%;
  margin: 0 auto 6px 30px;
  line-height: 1.15em;
  text-align: left;
}

.slogan:first-of-type
{
   margin-top: -10px;
}

.slogan:last-of-type
{
   margin-bottom: 10px;
}

.mission_statements
{
  text-align: justify;
  font-size: 1.10em;
  padding: 10px;
  margin: -10px -40px 15px -40px;
  line-height: 22px;
  margin-bottom: 22px;
}

.mission_title
{
  text-decoration: underline;
  font-weight: bold;
  margin-bottom: 20px;
}

#current_news
{
  font-family: "Times New Roman", Times, serif;
  margin-bottom: 20px;
  font-size: 1.6em;
  text-decoration: underline;
}

.post-date
{
   margin-bottom: 10px;
   font-size: 12px;
}

#page_home h1
{
   margin-top: 25px;
   margin-bottom: 18px;
}

#page_home p
{
  margin-bottom: 15px;
}

#page_home #main-content img
{
  margin: 5px 0;
}

#video-box iframe
{
  float: left;
  width: 450px;
  height: 253px;
  padding-bottom: 45px;
  margin-right: 20px;
  border: none;
}

#page_home #video-box iframe
{
   padding-bottom: 0px;
}

#video-description
{
  float: left;
  width: 175px;
  height: 253px;
}

.news_entry
{
  margin-bottom: 45px;
}

.news_entry h2
{
  font-size: 24px;
}

.news_entry img
{
  /* max-width: 595px; */
  max-width: 595px;
}

.caption, .wp-caption p
{
  font-size: 12px;
  margin: 0 0 10px 0;
  line-height: 14px;
  width: 595px;
  padding: 3px 5px 5px 5px;
}

#page_nav
{
  position: relative;
  width: 100%;
  margin-bottom: 10px;
  font-size: 14px;
  height: 20px;
}

#page_nav .nav-previous
{
  float: left;
  text-align: left;
}

#page_nav .nav-next
{
  float: right;
  text-align: right;
}


/* ---------- PROGRAMS PAGE ---------- */

#page_programs dt
{
   padding-top: 20px;
}

#page_programs dd
{
   line-height: 22px;
   margin-bottom: 30px;
}

#page_programs #main-content ul
{
   list-style: disc;
   margin-bottom: 30px;
}

#page_programs #main-content li
{
   margin: 0 0 8px 35px;
   padding-left: 10px;
}

#page_programs #main-content img
{
   margin: 10px 0 -15px 0;
}

/* ---------- CONTACTS PAGE ---------- */

#page_contact p
{
   margin-bottom: 0px;
}

#page_contact iframe, #page_a-better-thrift-shop iframe
{
  width: 608px;
  height: 400px;
  border: 2px solid #fff;
  margin: 20px 0;
}

#page_contact h2, #page_a-better-thrift-shop h2
{
  margin: 30px 0 0 0 ;
}

.address_block
{
   margin-bottom: 20px;
}


/* ---------- TESTIMONIALS PAGE ---------- */

#testimonial_video iframe
{
  width: 628px;
  height: 471px;
  border: none;
}

#testimonial_video p
{
  font-size: 14px;
  margin: 10px 0;
  line-height: 20px;
}

#video_slider
{
  width: 528px;
  margin-top: 20px;
  position: relative;
  padding: 15px 50px;
  background: #bbd3d7;
}

#video_slider li
{
  margin: 0;
  padding: 0;
}

#video_slider img
{
  width: 165px;
  margin: 0;
  padding: 0;
}

#video_slider a
{
  text-decoration: none;
}

#video_slider p
{
  font-size: 12px;
  line-height: 15px;
  margin-bottom: 0;
}

#video_slider .bx-prev {
   left: 10px;
   background: url(images/bx-controls.png) no-repeat 0 -32px;
}

#video_slider .bx-next {
   right: 10px;
   background: url(images/bx-controls.png) no-repeat -43px -32px;
}

#video_slider .bx-prev:hover {
   background-position: 0 0;
}

#video_slider .bx-next:hover {
   background-position: -43px 0;
}


#video_slider .bx-controls-direction a {
   position: absolute;
   top: 60px;
   outline: 0;
   width: 32px;
   height: 32px;
   text-indent: -9999px;
}   

/* ---------- LEADERSHIP PAGE ---------- */

.bod
{
  position: relative;
}

#page_leadership #main-content
{
  width: 700px;
}

.bod_box
{
  margin-top: 5px;
  position: absolute;
  top: 0;
  left: 0;
  visibility: hidden;
}

.bod_box img
{
  width: 230px;
}

#page_leadership #main-content .bod_box img
{
  float: left;
  margin: 0;
  padding-right: 20px;
}

#page_leadership #main-content .bod_box h1
{
  margin-top: 0;
  padding-top: 0;
  font-size: 20px;
  line-height: 20px;
}

#bod4
{
  visibility: visible;
}

.bod_biobox
{
  width: 398px;
  float: left;
}

.bod_bio, .bod_quote
{
  font-size: 13px;
  line-height: 18px;
}

.bod_quote
{
  clear: both;
  padding-top: 10px;
  display: none;
  font-style: italic;
}

ul#bod_selector
{
  list-style: none;
  margin: 255px 0 0 0;
}

.bod_clickformore
{
   font-size: 13px;
   margin-bottom: 40px;
   margin-top: 5px;
   font-style: italic;
}

#bod_selector li
{
  list-style: none;
  display: inline;
  margin: 0;
  padding: 0;
}

#bod_selector li img
{
  width: 65px;
  margin: 10px 5px 0 0;
  padding: 0;
}

.ab_member
{
  margin-bottom: 7px;
}

.ab_member img
{
  float: left;
  width: 65px;
  margin-right: 5px;
}

.ab_name
{
  font-size: 18px;
  line-height: 28px;
  font-weight: bold;
}

.ab_title
{
  margin-bottom: 8px;
  font-style: italic;
}

.ab_description
{
  float: left;
}

.sa
{
  margin-top: 20px;
}

.ab_member p
{
   font-size: 13px;
   line-height: 20px;  
   margin-bottom: 30px;
}


/* ---------- VOLUNTEER PAGE ---------- */

#volunteer_form
{
  margin: 40px 20px 20px 20px;
}

#volunteer_form textarea
{
  clear: both;
  display: block;
}

.volunteer_form_group
{
  margin-bottom: 30px;
}

.volunteer_form_row
{
  margin: 10px 5px 5px 0;
}

.volunteer_form_label
{
  float: left;
  width: 150px;
  margin: 2px;
}

.volunteer_form_field
{
  font-size: 12px;
  border: 2px solid #cecece;
  color: #494949;   
}

.error_msg
{
  margin-bottom: 5px;
  color: #be1616;
}

.success_msg
{
  margin-bottom: 5px;
  font-weight: bold;
}

.volunteer_submit_button
{
  background: url(images/button_submit.png) no-repeat 0 0;
  width: 130px;
  height: 30px;
  margin-top: 20px;
}