html,
body,
#page  {
  height: 100%;
}

/** body **/
body {
  margin: 0;
  padding: 0;
  font-family: arial, sans-serif;
  font-size: 12px;
	background-color: #fff;
}


#page-wrapper {
  margin: 0;
  padding: 0;
}

#page {
  margin: 0;
  padding: 0;
  position: relative;
}


/** Header Area **/

.header-and-nav {
  overflow: hidden;
}

div#header {
  position:relative;
  z-index: 8;
  margin: 0;
  padding: 0;
  display: block;
  height: 333px;
  background-color: #0f9531;
  background-image: url("../images/header.jpg");
  background-position-x: center;
  background-repeat: no-repeat;
  font-family: 'Arvo', arial, sans-serif;
}

div#header .section {
  position: relative;
  padding: 0 15px 0 15px;
}

#logo {
  margin: 40px 0 16px 0;
  padding: 0;
  overflow: hidden;
  background-image: url("../images/logo.png");
  background-repeat: no-repeat;
  width: 185px;
  height: 122px;
}

#logo a {
  display: block;
  padding-top: 200px;
}

#logo a {
  color: #fff;
}

#header .logo-and-contact {
  overflow: hidden;
}
#header .contact-details {
  float: right;
  color: #fff;
  margin-top: 40px;
}

#header .contact-details h2 {
  font-size: 24px;
  margin: 0;
}
#header .hero-unit h1 {
  color: #fff;
  font-weight: 700;
  font-size: 49px;
  margin: 0 0 14px 0;
}
#header .hero-unit p {
  color: #fff;
  font-size: 20px;
  padding: 0;
  margin: 0;
}
#header .hero-unit a:link,
#header .hero-unit a:visited {
  color: #fff;
}
/** Start displaying guy sitting down at 860px **/
#header .hero-unit img {
  display: none;
}
@media (min-width: 860px) {
  #header .hero-unit img {
    display: block;
    position: absolute;
    top: 106px;
    right: -96px;
  }
}

/** Make stuff in header smaller under 768px - we don't have a tiled background to support more content **/
@media (max-width: 768px) {
  #logo {
    margin: 20px 0 1em 0;
    padding: 0;
    background-image: url("../images/logo-144x95.png");
    width: 144px;
    height: 95px;
  }
  #header .contact-details {
    margin-top: 20px;
  }
}

#hgroup {
  margin: 105px 0 0 0;
  padding: 0;
  color: #fff;
  float: left;
}

#hgroup h1 {
  margin: 7px 0 5px 0;
  padding: 0;
  font-size: 3em;
  color: #fff;
}

#hgroup h2 {
  display: block;
  color: #fff;
  font-weight: normal;
  width: 439px;
  height: 22px;
  padding-top: 8px;
  padding-left: 15px;
  font-size: 1.3em;
}

/*** Front page rules ***/

.front div#header {
}

.front div#header .section {
}

.front #hgroup {
  margin: 30px 0 0 0;
  padding: 0;
  font-family: 'Questrial', arial, verdana, helvetica, sans-serif;
  color: #fff;
  float: left;
}

.front #hgroup h1 {
  margin: 0 0 0.5em 0;
  padding: 0 290px 0 0;
  font-size: 3.5em;
  color: #fff;
}

.front #hgroup h2 {
  display: block;
  color: #fff;
  font-weight: normal;
  width: 439px;
  height: 35px;
  padding-top: 13px;
  padding-left: 15px;
  font-size: 1.8em;
  float: right;
}
.front #content .node .field-name-body p {
  line-height: 1.65;
  font-size: 16px;
  font-family: 'Arvo', arial, verdana, helvetica, sans-serif;
  color: #333;
}

#hgroup h2 span {
  display: inline-block;
  padding: 0 8px;
}

.video {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
  margin: 0 0 25px 0;
}
.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*** Navigation ***/

#navigation {
  margin: 0;
  padding: 0;
  background-color: #16993f;
  overflow: hidden;
  display: block;
  position: relative;
}

#navigation .section {
  padding: 0 15px;
  position: relative;
}

div#block-nice-menus-1 div.block-inner {
  margin: 0;
  padding: 0;
}

div#block-nice-menus-1 div.content {
  margin: 0;
  padding: 0;
}

#navigation ul {
  z-index: 10;
  list-style: none;
  margin: 0 58px 0 0;
  padding: 0 0;
  float: left;
}

#navigation ul li {
  list-style: none;
  margin: 0 2em 0 0;
  float: left;
  font-size: 1.2em;
  background-color: transparent;
  border-width: 0 0 0 0;
}

#navigation ul.nice-menu li.collapsed {
  background-image: none;
}

#navigation ul.nice-menu li.active-trail a,
#navigation ul.nice-menu li a.active {
  border-width: 0 0 0 0;
  background-color: rgba(0,0,0,0.2);
}


#navigation ul li a:link,
#navigation ul li a:visited {
  display: block;
  margin-top: 22px;
  margin-bottom: 22px;
  padding: 7px 5px;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
}

#navigation ul li a:hover {
  background-color: rgba(0,0,0,0.2);
}

/* Top Level Active Trail */

#navigation ul.nice-menu li.active-trail a:link {
  color: #fff;
  text-decoration: none;
}

#navigation ul.nice-menu li.active-trail a:visited {
  color: #fff;
  text-decoration: none;
}

#navigation ul.nice-menu li.active-trail a:hover {
  color: #fff;
  text-decoration: none;
}

.fixednav #navigation {
  position: fixed;
  top: 0;
  width: 100%;
  -moz-box-shadow: 0px 2px 4px rgba(0,0,0,0.50);
  -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.50);
  box-shadow: 0px 2px 4px rgba(0,0,0,0.50);
  z-index: 50;
}
#block-nice-menus-1 div.content ul.nice-menu.expanded {
  overflow-y: scroll;
  width: 100%;
}
.admin-menu.fixednav #navigation {
  top: 29px;
}

.nav-logo {
  position: absolute;
  top: 26px;
  right: 5px;
  background-image: url("../images/logo-nav.png");
  background-repeat: no-repeat;
  width: 56px;
  height: 26px;
  overflow: hidden;
  display: none;
}
@media (min-width: 640px) {
  .nav-logo {
    top: 22px;
  }
}

.nav-logo a {
  display: block;
  padding-top: 26px;
}


/** Main content area **/

#main-wrapper {
  margin: 0;
  padding: 34px 0 34px 0;
  background-color: #fff;
}

#main {
  position: relative;
  margin: 0;
  padding: 0;
  background-color: #fff;
  min-height: 300px;
}

/** content **/

#content {
  float: left;
  width: 100%;
  margin-left: 0;
  margin-right: -100%; /* Negative value of #content's width + left margin. */
  padding: 0; /* DO NOT CHANGE. Add padding or margin to #content-inner. */
}

#breadcrumb {
  margin: 0 30px 15px 0px;
}

#messages {
  margin: 0 0 15px 0;
}

#messages .messages {
  border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  box-shadow: 2px 2px 4px rgba(0,0,0,0.20);
  -moz-box-shadow: 2px 2px 4px rgba(0,0,0,0.20);
  -webkit-box-shadow: 2px 2px 4px rgba(0,0,0,0.20);
}

#content h1 {
  margin: 0 0 0.7em 0;
  padding: 0;
  color: #16993f;
  font-size: 2.75em;
  font-weight: bold;
  font-family: 'Arvo', arial, verdana, helvetica, sans-serif;
}

#content h2 {
  margin: 0.7em 0;
  padding: 0;
  color: #16993f;
  font-size: 2em;
  font-weight: bold;
  font-family: 'Arvo', arial, verdana, helvetica, sans-serif;
}
#content h3 {
  margin: 0.7em 0;
  padding: 0;
  color: #333;
  font-size: 1.65em;
  font-weight: bold;
  font-family: 'Arvo', arial, verdana, helvetica, sans-serif;
}

#content p {
  margin: 0 0 1em 0;
  padding: 0;
  line-height: 1.5em;
}



/** Back to the top link **/
#back-top {
  position: absolute;
  bottom: 30px;
  right: 30px;
}

#back-top a.arrow-up {
  display: block;
  width: 55px;
  height: 56px;
  background-image: url("../images/back_to_top.png");
  background-position: 0px 0px;
}
#back-top a.arrow-up:hover {
  background-position: 0px -56px;
}



/** Footer Styles **/
#footer-wrapper {
  margin: 20px 0 0 0;
  padding: 0;
  position: relative;
  background-color: #0f9531;
  background-image: url("../images/footer_image.jpg");
  background-repeat: no-repeat;
  background-position: center;
}

#footer-wrapper .section {
  margin: 0;
  padding: 0;
}

#footer {
  margin: 0;
  padding: 0 15px;
  font-family: 'Arvo', arial, sans-serif;
}

#footer #block-block-1,
#footer #block-block-5 {
  background-image: url("../images/footer-logo.png");
  background-repeat: no-repeat;
  background-position: 0 50%;
  height: 101px;
  padding: 1em 0 0 98px;
}
#footer #block-block-1 h2,
#footer #block-block-5 h2 {
  float: left;
  color: #fff;
  font-size: 16px;
  border-left: 2px solid #fff;
  padding-left: 10px;
}
#footer #block-block-1 ul,
#footer #block-block-5 ul {
  float: left;
  margin: 1.3em;
  margin-left: 6em;
  padding: 0;
}
#footer #block-block-1 ul {
  list-style: none;
  overflow: hidden;
}
#footer #block-block-1 ul li,
#footer #block-block-5 ul li {
  margin: 0 0 3px 0;
  padding: 0;
  color: #fff;
}
#footer #block-block-1 ul li {
  overflow: hidden;
  list-style: none;
  clear: both;
}
#footer #block-block-1 ul li strong {
  display: block;
  float: left;
  width: 100px;
}

#footer #block-block-1 a,
#footer #block-block-5 a {
  color: #fff;
}


/*** Specific Views ***/

/** Case Studies **/

.view-case-studies ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.view-case-studies ul li {
  list-style: none;
  margin: 0 0 1.5em 0;
  padding: 0;
}

.view-case-studies .views-field-title {
  margin: 0 0 0.3em 0;
  padding: 0;
  color: #444;
  font-size: 1.5em;
  font-weight: bold;
  font-family: arial, verdana, helvetica, sans-serif;
}

/*** Specific Block ***/

/** Front - Criteria and Process **/
#block-block-2,
#block-block-3 {
  float: left;
  width: 50%;
  margin-bottom: 20px;
}

#block-block-2 .content,
#block-block-3 .content {
  margin: 0;
}

/* Criteria Block */

#block-block-2 h2 {
  margin-right: 35px;
}
#block-block-2 h3 {
  margin-top: 0.7em;
}
#block-block-2 p {
  margin: 0;
  padding: 0 0 0.5em 0;
}

#block-block-2 .content {
  margin: 0 35px 0 0;
  padding: 0;
}
#block-block-2 ul {
  padding-left: 15px;
}

/* Process Block */

#block-block-3 h2 {
  margin-left: 10px;
}

#block-block-3 .content {
  padding: 0 10px;
}

#block-block-3 .content ul {
  padding: 0;
  list-style: none;
}

#block-block-3 .content ul li {
  margin: 0 0 20px 0;
  padding: 0;
  list-style: none;
  clear: both;
  overflow: hidden;
}

#block-block-3 .content ul li strong {
  display: block;
  float: left;
  width: 80px;
  margin-top: 5px;
  margin-right: -90px;
  font-weight: bold;
  background-image: url("../images/step-green.png");
  background-repeat: no-repeat;
  background-position: 100% 100%;
  color: #fff;
  padding: 10px 0 10px 10px;
}

#block-block-3 .content ul li p {
  margin: 0;
  padding: 0 0 0 95px;
  float: left;
}

/* Remove line-breaks inserted by editor */
#block-block-3 .content ul li br {
  display: none;
}

/* Support Block */

#block-block-4 {
  margin: 0 0 2em 0;
  clear: both;
}

/* Updates block */

div#block-views-news-block {
  clear: both;
  float: left;
  width: 50%;
}

div#block-views-news-block .content {
  margin-right: 35px;
}

div#block-views-news-block ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

div#block-views-news-block div.views-field-created {
  font-size: 0.8em;
  color: #333;
  margin: 0 0 0.2em 0;
}

div#block-views-news-block div.views-field-body p {
  margin: 0 0 3px 0;
  padding: 0;
  line-height: 1.5em;
}

div.view-news .view-content ul li {
  margin: 0 0 8px 0;
  padding: 0 0 5px 0;
  list-style: none;
  color: #4c4c4c;
  overflow: hidden;
}

div.view-news .view-content {
  margin: 0 0 15px 0;
  padding: 0;
}

div.view-news div.views-field-title {
  margin: 0 0 0.2em 0;
  padding: 0;
  color: #444;
  font-size: 1.2em;
  font-weight: bold;
}

div.view-news div.views-field-title a:link {
  color: #444;
  text-decoration: none;
}

div.view-news div.views-field-title a:visited {
  color: #444;
  text-decoration: none;
}

div.view-news div.views-field-title a:hover {
  color: #444;
}

div.view-news div.views-field-view-node a:link,
div.view-news div.views-field-view-node a:visited,
div.view-news div.views-field-view-node a:hover {
  color: #67ad45
}

/* Case Studies Block */

#block-views-case-studies-block {
  float: left;
  width: 50%;
}

#block-views-case-studies-block .content {
  color: #4c4c4c;
}

#block-views-case-studies-block div.views-field-title {
  margin: 0 0 0.2em 0;
  padding: 0;
  color: #000;
  font-size: 1.2em;
  font-weight: bold;
}

#block-views-case-studies-block div.views-field-title a:link {
  color: #444;
  text-decoration: none;
}

#block-views-case-studies-block div.views-field-title a:visited {
  color: #444;
  text-decoration: none;
}

#block-views-case-studies-block div.views-field-title a:hover {
  color: #444;
}

#block-views-case-studies-block div.views-field-view-node a:link,
#block-views-case-studies-block div.views-field-view-node a:visited,
#block-views-case-studies-block div.views-field-view-node a:hover {
  color: #16993f
}

/** Alert Banner for Static Site **/
div#alert_banner {
  margin: 0;
  padding: 0;
}

div#alert_banner .block {
  background-color: #4d4d4f;
  color: #fff;
  font-size: 14px;
  margin: 0;
  padding: 5px;
}

div#alert_banner .block-inner {
  margin: 0;
  padding-top: 10px;
  width: 960px;
  margin: 0 auto 0 auto;
  position: relative;
  text-align: center;
}