/*
This is the rough structure of a page:

.container
  #header
    h2.camp_title
    #menu
    .donate
  #main
  #footer
    h2.camp_title
    #search / ul.links
    .donate

We are using the following colour scheme:

  Grey: #474238
  Red: #C1272D
  
*/

/**** Layout and styles for every page ****/
body {
  /* The background tile is centered horizontally and starts at the start of the header. This
  allows images which are layed on top to include bits of the background without looking shit */
  background: url(/images/background.jpg) 50% 40px;
  font-size: 62.5%; /* 1em = 10pt */
  font-family: Helvetica, Arial, sans-serif;
  color: #474238;
}

/* These are dynamically inserted by javascript */
#bgillustration1 { /* top right */
  background: url(/images/background_illustration.png) no-repeat 70px -470px;
  left: 50%;
  position: absolute;
  top: 0;
  z-index: -1;
}
#bgillustration2 { /* middle left */
  background: url(/images/background_illustration.png) no-repeat 100% 600px;
  right: 50%;
  margin-right: 140px;
  position: absolute;
  top: 0;
  z-index: -1;
}
#bgillustration3 { /* bottom right */
  background: url(/images/background_illustration.png) no-repeat 300px 0;
  left: 50%;
  display: none;
  height: 700px;
  position: absolute;
  z-index: -1;
}

.container {
  font-size: 1.3em; /* 13pt */
  position: relative;
  width: 960px;
  overflow: hidden;
}
#header, #main, #footer {
  clear: both;
  padding: 0 10px;
}
#header, #footer {
  border-top: 2px solid #474238;
  position: relative;
}
#header {
  height: 80px;
  margin-top: 40px;
  margin-bottom: 10px;
}
#menu {
  margin-left: 0;
  list-style-type: none;
  position: absolute;
  right: 0;
  margin-right: 108px;
  margin-top: -42px;
}
  #menu li {
    float: left;
    display: inline;
    padding: 42px 10px 0 10px;
    background-position: 50% -36px;
    background-repeat: no-repeat;
  }
    .home #menu li.home,
    .next_actions #menu li.next_actions,
    .past_actions #menu li.past_actions,
    .get_involved #menu li.get_involved,
    .blog #menu li.blog,
    .press #menu li.press,
    #menu li.hover {
      background-position: 50% 4px;
    }
    #menu li.home {
      background-image: url(/images/menu/bike.png);
    }
    #menu li.next_actions {
      background-image: url(/images/menu/glue.png);
    }
    #menu li.past_actions {
      background-image: url(/images/menu/lock.png);
    }
    #menu li.get_involved {
      background-image: url(/images/menu/tent.png);
    }
    #menu li.blog {
      background-image: url(/images/menu/megaphone.png);
    }
    #menu li.press {
      background-image: url(/images/menu/turbines.png);
    }
  #menu li a {
    display: block;
    line-height: 45px;
    padding: 5px 10px 0 10px;
    text-decoration: none;
    font-weight: bold;
    color: #474238;
  }
    #menu li a:hover, #menu li a:active,
    .home #menu li.home a,
    .next_actions #menu li.next_actions a,
    .past_actions #menu li.past_actions a,
    .get_involved #menu li.get_involved a,
    .blog #menu li.blog a,
    .press #menu li.press a {
      background: #474238 url(/images/menu_arrow.gif) no-repeat 9px 3px;
      color: white;
    }
h2.camp_title a {
  margin-top: 10px;
  background: url(/images/camp_for_climate_action.png) no-repeat;
  text-indent: -999px;
  height: 38px;
  overflow: hidden;
  display: block;
}
a.donate {
  width: 88px;
  height: 78px;
  background: url(/images/donate.png) no-repeat 0 0 !important;
  text-indent: -999px;
  overflow: hidden;
  padding: 0 !important;
  margin-top: 2px;
  display: block;
  float: right;
}
  a.donate:hover, a.donate:active {
    background-position: 0 -78px !important;
  }

#main {
  overflow: hidden;
}

/* Column width: 608px
   Shadow width: 6px */
#content {
  background: url(/images/faux_column.png) repeat-y;
  width: 568px; /* 608 - 2*20 */
  padding: 20px;
  padding-right: 26px;
  float: left;
}
#submenu, #sidebar {
  width: 306px;
  float: right;
  clear: right;
}
#submenu {
  padding-left: 5px;
}
#submenu ul {
  list-style-type: none;
  border-top: 2px solid #474238;
  padding: 10px 0 0 0;
  margin: 0 0 20px 0;
}
  #submenu ul ul {
    border: 0;
    padding: 0;
    margin: 0;
  }
#submenu ul a {
  font-size: 1.308em; /* 17pt */
  border: none;
  display: block;
  font-weight: bold;
}
#submenu ul li.open a {
  background: white;
}
#submenu ul li.open a, #submenu ul ul {
  margin-left: -5px;
  padding-left: 5px;
}
#submenu ul li.open ul a {
  font-weight: normal;
}
#submenu ul ul {
  margin-bottom: 5px;
  background: white;
}
#submenu ul ul a {
  font-size: 1em; /* 13pt */
  font-weight: normal;
}
#submenu ul a:hover, #submenu ul a:active, #submenu ul li.on a, #submenu ul li.on li a:hover {
  color: #C1272D;
}
#submenu ul li.on li a {
  color: #474238;
  font-weight: normal !important;
}
#submenu ul ul ul {
  margin-bottom: 0;
}
#submenu ul ul ul li a {
  padding-left: 30px !important;
  background: url(/images/submenu_dash.gif) no-repeat 20px 50% !important;
}
#submenu ul ul ul li.on a, #submenu ul ul ul li a:hover, #submenu ul ul ul li a:active {
  background-image: url(/images/submenu_dash_on.gif) !important;
}

#search {
  border-bottom: 2px solid #474238;
  padding: 0;
  overflow: hidden;
  padding: 0.5em 0;
}
  #search input {
    border: 1px solid #767065;
    float: left;
    margin: 0;
    font-size: 1em;
    line-height: 1;
  }
  #search #search_box {
    width: 266px;
    margin-right: 3px;
    padding: 2px;
  }
  #search input.submit {
    background: #474238;
    color: white;
    width: 25px;
    padding: 2px 6px;
    cursor: pointer;
  }
  #search input.submit:hover {
    background: #C1272D;
  }
#footer {
  margin-top: 20px;
  padding-bottom: 10px;
  overflow: hidden;
}
#footer p.links {
  margin: 10px 0 0 0;
}
#footer p.links a {
  color: #474238;
  padding: 0 3px;
}
  #footer p.links a:hover, #footer p.links a:active {
    color: #C1272D;
  }
#footer p.links a.first {
  padding-left: 0;
}
#newsletter {
  background: #474238 url(/images/menu_arrow.gif) no-repeat 13px 2px;
  padding: 20px 17px;
  width: 186px;
  font-size: 1.538em; /* 20pt */
  color: white;
  font-weight: bold;
}
  #newsletter a {
    color: white;
    text-decoration: none;
    border-bottom: 2px solid #a3a19c;
  }
    #newsletter a:hover {
      border-color: #C1272D;
    }

/**** General styles ****/
/* -> Headings */
h1, h2, h3, h4, h5, h6 {
  color: #474238;
}
#main h1 {
  font-weight: bold;
  font-size: 2.308em; /* 30pt */
}
#sidebar h2, #highlights h2, #feeds h2, #next_action h2, #content h2.caps, #content h3.caps {
  font-size: 1.308em; /* 17pt */
  text-transform: uppercase;
  letter-spacing: -1px;
  line-height: 1;
  border-top: 2px solid #474238;
  padding-top: 3px;
  border-bottom: none;
  font-weight: normal;
}
#content h2, #content h2.caps,
#content h3, #content h3.caps,
#content h4, #content h4.caps {
  margin-bottom: 5px;
  border: none;
  font-weight: bold;
}
#content h2.intro, #content h3.intro {
  margin-bottom: 15px;
}
#content h2, #content h2.caps {
  font-size: 1.538em; /* 20pt */
}
#content h3, #content h3.caps {
  font-size: 1.154em; /* 15pt */
}
#content h4, #content h4.caps {
  font-size: 1em; /* 13pt */
}
#content h5, #content h6 {
  font-size: 1em; /* 13pt */
  margin-bottom: 3px;
  font-weight: normal;
}
#content h5 {
  font-style: italic;
}

/* -> Lists */
#content ul, #sidebar ul {
  list-style-type: none;
  margin: 15px 0 15px 10px;
}
  #content ul li {
    padding-left: 12px;
    background: url(/images/bullet.jpg) no-repeat 0px 8px;
  }
  #sidebar ul li {
    padding-left: 11px;
    background: url(/images/bullet_sidebar.png) no-repeat 0px 6px;
  }

/* -> Tables */
#content table {
  border-collapse: collapse;
  margin: 15px 0;
}
  #content table td, #content table th {
    border: 1px solid #d8c0bd;
    padding: 5px 10px;
  }

/* -> Links */
#main a {
  color: #474d43;
  border-bottom: 1px solid #474d43;
  text-decoration: none;
}
  #main a:hover, #main a:active {
    color: #C1272D;
    border-bottom-color: #C1272D;
  }
#main h1 a, #main h2 a, #main h3 a {
  border: none;
  display: block;
}
#main a.image_link {
  border: none;
  display: block;
}
  #main a.image_link img {
    display: block;
    border: 1px solid #474d43;
  }
  #main a.image_link:hover img, #main a.image_link:active img {
    border-color: #C1272D;
  }
#main a.image_link_no_border {
  border: none;
  display: block;
}
  #main a.image_link_no_border img {
    display: block;
  }

#content h2 a, #content h3 a {
  color: #C1272D;
}
  #content h2 a:hover, #content h2 a:active,
  #content h3 a:hover, #content h3 a:active {
    color: #474238;
  }


#sidebar h2 a, #sidebar h3 a {
  color: #C1272D;
  border-top: 2px solid #C1272D;
  margin-top: -5px;
  padding-top: 3px;
}
  #sidebar h2 a:hover, #sidebar h2 a:active,
  #sidebar h3 a:hover, #sidebar h3 a:active {
    color: #474238;
    border-color: #474238;
  }

/* -> Other */
.left, .alignleft {
  float: left;
  margin: 0 10px 5px 0;
}
.right, .alignright {
  float: right;
  margin: 0 0 5px 10px;
}

/*** Specific styles ***/
#next_action {
  background: #474238;
  margin: 0 0 1.5em 0;
  overflow: hidden;
  padding: 10px;
}
  #next_action p.image {
    width: 530px;
    float: left;
    margin: 0;
  }
    #next_action p.image a {
      display: block;
      border: none;
      line-height: 0;
    }
    #next_action p.image img {
      display: block;
    }
  #next_action div.content {
    float: left;
    width: 370px;
    margin-left: 20px;
  }
  #main #next_action h2 {
    border-top-color: #c1272d;
    font-size: 1.538em; /* 20pt */
  }
  #main #next_action h2 a {
    color: white;
  }
  #main #next_action h2 a:hover, #main #next_action h2 a:active {
    color: #c1272d;
  }
  #main #next_action h2.meta {
    color: white;
    font-size: 1.846em; /* 24pt */
    font-weight: bold;
    margin: 30px 0 5px 0;
    border: none;
    padding: 0;
  }
  #next_action p {
    font-size: 1.538em; /* 20pt */
    color: #d8ded4;
  }
    #next_action p a {
      color: white;
      border-bottom: 2px solid #C1272D;
    }
      #next_action p a:hover {
        border-color: white;
        color: white;
      }
  #next_action p.links {
    margin-bottom: 0;
  }
  #next_action p.links a, #main h3 a.action_link {
    background: #c1272d;
    color: white;
    padding: 5px;
    text-decoration: none;
    line-height: 2;
    font-weight: bold;
    border: none;
  }
    #next_action p.links a:hover, #next_action p.links a:active,
    #main h3 a.action_link:hover, #main h3 a.action_link:active {
      color: #c1272d;
      background: white;
    }

#main h3 a.action_link {
  display: block;
  line-height: 1.3;
}

#highlights {
  overflow: hidden;
  margin-bottom: 30px;
}
#main #highlights h2 {
  font-size: 1.538em; /* 20pt */
}
#highlights .item h3 {
  font-size: 1.462em; /* 19pt */
  font-weight: bold;
  margin: 6px 0 6px 0;
}
  #highlights .item a {
    border-bottom: 0;
  }
  #highlights .item h3 a {  
    color: #c1272d;
  }
  #highlights .item h3 a:hover, #highlights .item h3 a:active {
    color: #474238;
  }
  #highlights .item p {
    margin: 0;
  }

#feeds {
  margin: 0 -10px;
  padding: 10px;
  background: url(/images/feeds_faux_columns.png) repeat-y;
  overflow: hidden;
  clear: both;
}
  #feeds h3 {
    font-weight: bold;
    font-size: 1.154em; /* 15pt */
    margin: 0 0 6px 0;
  }
    #feeds h3 a {
      text-decoration: none;
      color: #474238;
      border: none;
    }
    #feeds h3 a:hover, #feeds h3 a:active {
      color: #c1272d;
    }
  #feeds h2 {
    margin: 0 0 20px 0;
  }
  #feeds .item {
    margin: 0 0 30px 0;
  }
    #feeds .item p {
      margin: 0 0 10px 0;
    }
  #feeds .item.last {
    margin: 0;
  }
  #main #from_blog h2, #main #press_releases h2 {
    border: none;
    padding: 0;
  }
  #main #from_blog h2 a, #main #press_releases h2 a {
    color: #c1272d;
    border-top: 2px solid #c1272d;
    padding-top: 3px;
  }
    #main #from_blog h2 a:hover, #main #from_blog h2 a:active,
    #main #press_releases h2 a:hover, #main #press_releases h2 a:active {
      color: #474238;
      border-top-color: #474238;
    }
  #from_blog p.meta {
    color: #767065;
  }
  #press_releases p.meta {
    margin-bottom: 5px;
  }
  #from_press p.meta {
    text-transform: uppercase;
    margin-bottom: 5px;
  }
  #main #press_twitter h2 {
    border: none;
    padding: 0;
  }
    #main #press_twitter h2 a {
      color: #474238;
      border-top: 2px solid #474238;
      padding-top: 3px;
    }
      #main #press_twitter h2 a:hover {
        color: #c1272d;
        border-top-color: #c1272d;
      }
  #press_twitter h3 a {
    color: #C1272D;
  }
    #press_twitter h3 a:hover, #press_twitter h3 a:active {
      color: #474238;
    }
  #main #twitter a {
    color: #474238;
    font-weight: bold;
    border: none;
  }
    #main #twitter a:hover, #main #twitter a:active {
      color: #C1272D;
    }
  #events {
    color: #f3f0e8;
  }
    #main #events h2 {
      border-top: none;
      color: #deded4;
      padding: 0;
    }
      #main #events h2 a {
        border-top: 2px solid #deded4;
        color: #deded4;
        padding-top: 3px;
      }
      #main #events h2 a:hover, #main #events h2 a:active {
        color: #474D43;
        border-top-color: #474D43;
      }
    #events h3 a {
      color: white;
      font-weight: bold;
    }
      #events h3 a:hover, #events h3 a:active {
        color: #474238;
      }
    #events p.desc {
      margin-bottom: 5px;
    }
    #events p.meta {
      color: #474238;
      font-weight: bold;
    }
  #feeds #twitter p {
    margin-bottom: 5px;
  }
  #feeds #twitter p.meta {
    color: #474238;
  }
  #feeds #twitter_follow, #feeds #facebook {
    margin-bottom: 15px;
    line-height: 24px;
  }
    #feeds #twitter_follow a, #feeds #facebook a {
      padding: 3px;
      padding-left: 33px;
      background-position: 3px 3px;
      background-repeat: no-repeat;
    }
    #feeds #twitter_follow a {
      background-image: url(/images/twitter.png);
    }
    #feeds #facebook a {
      background-image: url(/images/facebook.png);
    }
 
#intro_text a {
  display: block;
  background: url(/images/intro_text.png) no-repeat 0 0;
  height: 50px;
  text-indent: -9999px;
  overflow: hidden;
  border: 0;
}
  #intro_text a:hover, #intro_text a:active {
    background-position: 0 -50px;
  }

#content p.intro {
  font-size: 1.231em;
  color: #4c5149;
}

.blog #content h1, #content .blog_post h2 {
  margin-bottom: 10px;
  font-size: 2.308em; /* 30pt */
  border: none;
}
  #content .blog_post h2 a {
    border: none;
    line-height: 1;
  }
.blog #content p.meta {
  font-size: 1.231em;
}
.blog #content #nav-above {
  overflow: hidden;
  margin: 0 0 15px 0;
}
.blog #content #nav-below {
  overflow:hidden;
  margin: 15px 0 0 0;
}
  .blog #content #nav-above .nav-previous, .blog #content #nav-below .nav-previous {
    float: left;
    width: 50%;
  }
  .blog #content #nav-above .nav-next, .blog #content #nav-below .nav-next {
    float: right;
    width: 50%;
    text-align: right;
  }
#comments ol.commentlist {
  margin-left: 0;
  list-style-type: none;
}
  #comments ol.commentlist li {
    border-bottom: 1px dotted #767065;
    margin-top: 10px;
  }
  #content #comments p.meta {
    font-size: 1em;
    font-style: italic;
    margin: -5px 0 10px 0;
  }
#commentform label {
  display: block;
  float: left;
  width: 100px;
  margin: 0.5em 0;
}
#commentform p {
  margin: 0 0 5px 0;
}
.blog #sidebar .meta {
  margin: 0 0 15px 0;
}
  .blog #sidebar .meta h3 {
    margin-bottom: 5px;
    font-weight: bold;
    font-size: 1.231em;
  }
    .blog #sidebar .meta h3 a {
      display: inline;
      border-top: none;
      border-bottom: 1px solid #474D43;
      color: #474D43;
    }
  .blog #sidebar .meta p {
    margin: 0;
  }
.blog #sidebar .meta p {
  color: #767065;
}
.blog #sidebar ul {
  list-style-type: none;
  margin: 0 0 20px 0;
}
  .blog #sidebar ul a {
    display: block;
    margin: 5px 0;
    border: none;
  }
  .blog #sidebar ul li.on a {
    font-weight: bold;
    color: #C1272D;
  }
  .blog #sidebar .tags a {
    border: none;
    margin-right: 5px;
  }

#content.blog_index {
  background: none;
  padding: 0;
  width: 614px;
}
#content.blog_index .blog_post, #content.blog_index h2.index_title {
  background: url(/images/faux_column.png) repeat-y;
  padding: 20px;
  padding-right: 26px;
  margin: 0 0 20px 0;
}
#content.blog_index h2.index_title {
  border: none;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 1.308em; /* 17pt */
}
#content.blog_index .blog_post .more {
  margin-bottom: 0;
}
  #content.blog_index .blog_post .more a {
    font-size: 1.538em; /* 20pt */
    border: none;
    font-weight: bold;
  }

#actions .item {
  float: left;
  margin-right: 20px;
  width: 220px;
  line-height: 0;
  margin-bottom: 20px;
  position: relative;
}
#actions .item.promoted {
  width: 460px;
  height: 260px;
}
  #actions .item.last {
    margin-right: 0;
  }
  #actions .item * {
    margin: 0;
  }
  #actions .item .details {
    background: url(/images/474238_translucent.png);
    position: absolute;
    bottom: 0;
    z-index: 1;
    width: 100%;
    padding-bottom: 10px;
    line-height: 1.5;
  }
    #actions .item.hover .details {
      background: url(/images/C1272D_translucent.png);
      padding-bottom: 0;
    }
    #actions .item.hover * {
      color: white !important;
    }
  #actions .item a {
    display: block;
    border: none;
  }
  #actions .item .meta a {
    color: #C1272D;
    padding: 10px 10px 0 10px;
    font-weight: bold;
    font-size: 0.923em; /* 12pt */
  }
  #actions .item h3 {
    font-weight: bold;
    font-size: 1.154em; /* 15pt */
  }
  #actions .item h2 {
    font-weight: bold;
    font-size: 1.308em; /* 17pt */
  }
    #actions .item .details h3 a, #actions .item .details h2 a {
      color: white;
      padding: 0 10px;
    }
  #actions .item .info a {
    color: white;
    padding: 0 10px 10px 10px;
  }

.get_involved #content .intro {
  font-weight: bold;
}

.press .press_release, .events .event {
  border-top: 1px solid #dadada;
  padding: 10px 0;
}
  .press .press_release p.meta, .events .event p.meta {
    text-transform: uppercase;
    margin: 0;
    color: #a9a9a9;
  }
  .press .press_release h2, .events .event h2 {
    font-size: 1.154em !important; /* 15pt */
  }
  .events .event p.desc {
    margin: 0;
  }

.cms_edit_container, .cms_edit_connectable {
  overflow: hidden;
  padding-left: 0 !important;
  padding-right: 0 !important;
  border: 0 !important;
  margin: 0 !important;
  outline: 1px solid rgb(153, 153, 153);
}
.cms_edit_connectable {
  float: left;
}
#single_event p.meta {
  font-size: 1.231em;
}