/*
Theme Name: BREE Collaborative
Description: Custom WordPress theme built exclusively for use on the BREE Collaborative website
Version: 1.0
Author: Christine Estrada via Revolution PR
Author URI: http://www.revolutionpr.com
*/



/* RESET
 * Reset default browser CSS. Based on work by Eric Meyer: 
 * http://meyerweb.com/eric/tools/css/reset/index.html
 * ---------------------------------------------------------------------- */

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, font, 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 {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure, 
footer, header, hgroup, nav, section { 
  display: block; 
}

audio, canvas, video { 
  display: inline-block; *display: inline; *zoom: 1; 
}
audio:not([controls]) { 
  display: none; 
}

[hidden] { 
  display: none; 
}


body {
	line-height: 1;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
}

ol, ul {
	list-style: none;
	padding-left: 20px;
}

blockquote {
	quotes: none;
}

blockquote:before, blockquote:after {
	content: '';
	content: none;
}

del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* float clearing */
.group:after {
	content: ".";  
 	display: block; 
 	height: 0; 
 	clear: both; 
 	visibility: hidden; 
}

.group {
	display: inline-block;
}

/* Hides from IE-mac */
* html .group {
	height: 1%;
}

.group {
	display: block;
}
/* End hide from IE-mac */




/* GENERAL TYPOGRAPHY
 * Styling for global typographical elements
 * ---------------------------------------------------------------------- */

body {
  font-family: "Istok Web", Helvetica, sans-serif;
  font-size: 14px;
  line-height: 1.4;
  color: #4d4d4d;
}

a {
  color: #3da4ac;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

a.button {
  display: inline-block;
  height: 20px;
  font-family: "PT Sans Narrow", sans-serif;
  font-size: 13px;
  font-weight: 700;
  line-height: 22px;
  text-transform: uppercase;
  padding: 0 26px 0 4px;
  border: 1px solid #135e60;
  color: #135e60;
  background: url('images/bg_btn.png') right center no-repeat;
}

a.button:hover {
  text-decoration: none;
  border: 1px solid #fff;
  color: #fff;
  background: #135e60 url('images/bg_btn-white.png') right center no-repeat;
}

span.doc {
  display: inline-block;
  padding-left: 16px;
  margin-bottom: 5px;
  background: url('images/icon_doc.png') top left no-repeat;
}

p {
  margin-bottom: 10px;
}

h1 {
  font-size: 18px;
  font-weight: bold;
}

h2 {
  font-size: 18px;
  font-weight: bold;
  text-transform: uppercase;
}

h3 {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 5px;
  color: #135e60;
}

p + h3,
table + h3 {
  margin-top: 30px;
}

blockquote {
  color: #135e60;
  margin-bottom: 30px;
}




/* SITE STRUCTURE
 * Structural elements
 * ---------------------------------------------------------------------- */

.main-container {
  position: relative;
  width: 940px;
  margin: 0 auto;
}

.page-content {
}




/* COMMON ELEMENT STYLING
 * Styling for common elements (column, etc)
 * ---------------------------------------------------------------------- */

.cms-copy ul {
  margin: 15px 0;
}

.cms-copy ul li {
  list-style: disc;
  margin-left: 20px;
  margin-bottom: 5px;
}

.cms-copy ol li {
  list-style: decimal;
  margin-left: 15px;
  margin-bottom: 10px;
}

.cms-copy table td {
  padding: 5px;
}

.cms-copy table th {
  text-align: left;
  padding: 5px;
  color: #fff;
  background-color: #3da4ac;
}

.cms-copy table tr:nth-child(even) td {
  background-color: #eee;
}

.cms-copy table tr:nth-child(odd) td {
  background-color: #fff;
}




/* HEADER STYLING
 * Styling for the header area of the site
 * ---------------------------------------------------------------------- */
 
header[role='banner'] {
  padding-top: 25px;
}

  header[role='banner'] .logo {
    display: block;
    text-align: center;
  }




/* FOOTER STYLING
 * Styling for the footer area of the site
 * ---------------------------------------------------------------------- */

footer[role='contentinfo'] {
  margin-top: 65px;
  padding: 10px 10px 0;
  color: #fff;
  background-color: #135e60;
}

  footer[role='contentinfo'] a {
    color: #fff;
  }
  
  footer[role='contentinfo'] .column.left {
    float: left;
    width: 30%;  
  }

  footer[role='contentinfo'] .column.right {
    float: right;
    width: 70%;  
    font-size: 12px;
    margin-top: 3px;
    text-align: right;
  }

    footer[role='contentinfo'] .column.right a {
      text-decoration: underline;
    }




/* NAVIGATION STYLING
 * Styling for navigation
 * ---------------------------------------------------------------------- */

  /* TYPOGRAPHY: GLOBAL NAV
   * Global typography for nav elements
   * ---------------------------------------------------------------------- */

  .nav-primary a {
    font-weight: 400;
    line-height: 1;
    text-transform: uppercase;
    color: #fff;
  }
  
  .nav-primary a:hover {
    text-decoration: none;
  }


  /* NAV STYLING: PRIMARY NAV
   * Styling for primary header nav
   * ---------------------------------------------------------------------- */

  .nav-primary {
    position: relative;
    margin-top: 30px;
    background-color: #135e60;
  }
  

    .nav-primary > ul {
      float: left;
    }
    
    .nav-primary li {
      float: left;
      position: relative;
    }
    
    .nav-primary a {
      display: block;
      padding: 11px;
      border-left: 1px solid #fff;
    }
    
    .nav-primary li:first-child a {
      border-left: none;
    }
    
    .nav-primary > ul > li.current-menu-item,
    .nav-primary > ul > li.current-page-parent {
      background-color: #3da4ac;
    }
    
    .nav-primary > ul > li.current-menu-item > a:hover {
      background-color: transparent;
    }

    .nav-primary a:hover {
      background-color: #3da4ac;
    }
    
    .nav-primary .menu-item-has-children:hover .sub-menu {
      display: block;
    }
  
    .nav-primary .sub-menu {
      display: none;
      position: absolute;
      top: 0;
      left: 0;
      width: 150px;
      margin-top: 35px;
      background-color: #135e60;
      z-index: 500;
    }
    
    .nav-primary .sub-menu li {
      display: block;
      float: none;
    }
    
    .nav-primary .sub-menu a {
      border-top: 1px solid #fff;
      border-left: none;
    }
    
    .nav-primary .sub-menu li:first-child a {
      border-top: none;
    }

    .nav-primary .section-search {
      float: right;
    }
    
    .section-search input[type='text'] {
      float: left;
      width: 178px;
      font-size: 11px;
      padding: 3px;
      margin-top: 7px;
      border: 1px solid #3da4ac;
      color: #135e60;
      background-color: #fff;    
    }
  
    .section-search input[type='submit'] {
      float: left;
      width: 25px;
      height: 25px;
      margin: 5px;
      border: none;
      background: url('images/icon_search.jpg') center center no-repeat;
    }
    
    
  /* NAV STYLING: PAGE NAV
   * Styling for page nav
   * ---------------------------------------------------------------------- */

  .nav-page {
    margin-bottom: 20px;  
  }

    .nav-page a,
    .nav-page div {
      display: block;
      float: left;
      width: 60px;
      padding: 2px 0;
      margin-right: 15px;
      text-align: center;
      color: #fff;
      background-color: #135e60;
    }
    
    .nav-page a:hover,
    .nav-page div:hover {
      cursor: pointer;
      text-decoration: none;
      background-color: #3da4ac;
    }
    
    .nav-page a.current,
    .nav-page div.current {
      background-color: #3da4ac;
    }
    



/* SECTION STYLING
 * Styling for section content
 * ---------------------------------------------------------------------- */

  /* SECTION STYLING: SIDEBAR
   * Styling for sidebar content
   * ---------------------------------------------------------------------- */

  .section-sidebar {
    float: right;
    width: 300px;
  }
  
    .section-sidebar section {
      margin-bottom: 30px;
    }
  
    .section-sidebar p {
      font-size: 12px;
      line-height: 1.6;
    }
  
    .section-sidebar h2 {
      font-size: 20px;
      padding: 16px 10px 10px 10px;
      margin: 0;
      text-align: center;
      color: #fff;
      background-color: #135e60;
    }
  
    .section-sidebar .cms-copy {
      padding: 10px 20px;
      border: 2px solid #135e60;
    }
    
    .section-sidebar .button {
      margin-bottom: 20px;
    }




/* ARTICLE STYLING
 * Styling for articles
 * ---------------------------------------------------------------------- */

.article-page header {
  position: relative;
  width: 100%;
  height: 150px;
  background-color: #ccc;
  margin-bottom: 30px;
}

.article-page header h1 {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 51px;
  text-transform: uppercase;
  text-align: center;
  line-height: 51px;
  color: #fff;
  background: url('images/bg_header.png');
}

article.with-sidebar {
  float: left;
  width: 600px;
}

.article-excerpt {
}




/* PAGE STYLING
 * Styling for specific pages
 * ---------------------------------------------------------------------- */

  /* PAGE STYLING: HOME
   * Styling for home page
   * ---------------------------------------------------------------------- */

  #home .article-hero {
    position: relative;
    width: 940px;
    height: 382px;
  }
  
    #home .article-hero .hero-copy {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      background: url('images/bg_dark-green.png');
    }
    
    #home .article-hero .cms-copy {
      font-size: 18px;
      font-weight: bold;
      text-align: center;
      text-transform: uppercase;
      color: #fff;
      padding: 10px;
    }
    
    #home .article-hero .button {
      border: 1px solid #fff;
      color: #fff;
      background: url('images/bg_btn-white.png') right center no-repeat;
    }
    
    #home .article-hero .button:hover {
      border: 1px solid #135e60;
      color: #135e60;
      background: #fff url('images/bg_btn.png') right center no-repeat;
    }
  
  #home .section-features {
    margin-top: 40px;
  }
  
    #home .section-features article {
      position: relative;
      float: left;
      width: 300px;
      margin-left: 20px;
    }
    
    #home .section-features article:first-child {
      margin-left: 0;
    }
  
    #home .section-features .thumbnail {
      position: relative;
      width: 300px;
      height: 193px;
      margin-bottom: 20px;
    }
    
    #home .section-features .feature-copy {
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      height: 50px;
      line-height: 50px;
      text-align: center;
      text-transform: uppercase;
    }
    
    #home .section-features .feature-copy h2 {
      display: inline-block;
      font-size: 20px;
      font-weight: bold;
      color: #fff;
      padding-left: 35px;
    }
    
    #home .section-features .feature-copy.reports h2 {
      background: url('images/icon_topics.png') left 8px no-repeat;
    }
    
    #home .section-features .feature-copy.members h2 {
      background: url('images/icon_members.png') left 9px no-repeat;
    }

    #home .section-features .feature-copy.meetings h2 {
      background: url('images/icon_meetings.png') left 10px no-repeat;
    }

  #home .section-bottom-features {
    margin-top: 40px;
  }
  
    #home .section-bottom-features article {
      float: left;
      width: 460px;
      margin-left: 20px;
    }
    
    #home .section-bottom-features h2 {
      text-align: center;
      padding: 15px 0;
      margin-bottom: 20px;
      color: #fff;
      background-color: #135e60;
    }

    #home .section-bottom-features article:first-child {
      margin-left: 0;
    }      
    
    #home .section-bottom-features article:first-child h2 {
      background-color: #8bc53f;
    }


  /* PAGE STYLING: MEETING MATERIALS
   * Styling for meeting materials
   * ---------------------------------------------------------------------- */

  .meeting-materials {
    display: none;
  }
  
  .meeting-materials.current {
    display: block;
  }
  
  


/* FORM STYLING
 * Styling for forms
 * ---------------------------------------------------------------------- */

.gform_footer input[type='submit'] {
  display: inline-block;
  height: 20px;
  font-family: "PT Sans Narrow", sans-serif;
  font-size: 13px !important;
  font-weight: 700;
  line-height: 20px;
  text-transform: uppercase;
  padding: 0 26px 0 4px;
  border: 1px solid #135e60;
  color: #135e60;
  cursor: pointer;
  background: url('images/bg_btn.png') right center no-repeat;
}

.gform_footer input[type='submit']:hover {
  text-decoration: none;
  border: 1px solid #fff;
  color: #fff;
  background: #135e60 url('images/bg_btn-white.png') right center no-repeat;
}