/* ========================================================================== *\
   USING SITE COLOR SCHEME
\* ========================================================================== */

a:link, a:visited  { color: #33a6a4; }
a:hover, a:visited:hover,
a:active, a.active { color: #F47B20; }

/* ========================================================================== *\
   META
\* ========================================================================== */

.meta-item,
.meta-item a       { color: #555555; }
.meta-item a:hover { color: #F47B20; }

/* ========================================================================== *\
   LINKS
\* ========================================================================== */

.link a       { color: #33a6a4; }
.link a:hover { color: #F47B20; }

/* ========================================================================== *\
   READMORE LINKS
\* ========================================================================== */

.link-read-more a       { color: #33a6a4; }
.link-read-more a:hover { color: #F47B20; }

/* ========================================================================== *\
   HEADING COLORING
\* ========================================================================== */

h1, h2, h3, h4, h5, h6 { color: #33a6a4; }

/* ========================================================================== *\
   BLOCK TITLES
\* ========================================================================== */

.block-title {
  color: #33a6a4;
}

.region-content .block-title,
.region-left .block-title,
.region-right .block-title,
.region-footer .block-title {
  font-family: 'Trajan W01', Times, "Times New Roman", serif;
text-transform: uppercase;;
  font-weight: normal;
  color: #6889AD;
}

.region-content .block-title.accordion-heading,
.region-left .block-title.accordion-heading,
.region-right .block-title.accordion-heading,
.region-footer .block-title.accordion-heading {
  text-transform: uppercase !important;
}

/* TODO: Which other blocks need this margin? Can't apply to 
 * all blocks, because it adds margin to blocks that have an
 * empty title (like posts block). */
.bundled-posts .block-title {
  margin-bottom: 20px;
}

/* ========================================================================== *\
   POST TITLES
\* ========================================================================== */

.node-header {
  font-size: 28px;
  line-height: 1.1;
}

.node-header .subtitle {
  font-weight: bold;
  color: #625C49;
  font-size: .7em;
  line-height: 1.1;
  margin-top: .4em;
}

.node-header a:hover {
  color: #F47B20;
}


/* ========================================================================== *\
   BLOCKQUOTES
\* ========================================================================== */

blockquote {
  font-style: normal;
}

/* ========================================================================== *\
   IMAGES + IMAGE GALLERY TEASER POSTS
\* ========================================================================== */

.node .field-image img {
  /* Removes line-height-related bottom maargin. */
  display: block;
}

.slideshow-icon,
.slideshow-icon:hover {
  background-color: transparent;
}

.slideshow-icon {
  /* TODO: Change image size. */
  background-size: 32px;
  opacity: 0.677;
  -webkit-transition: opacity 0.2s ease-out;
  -moz-transition: opacity 0.2s ease-out;
  transition: opacity 0.2s ease-out;
}

.slideshow-icon:hover {
  opacity: 1;
}

/* ========================================================================== *\
   GLOBAL SETUP
\* ========================================================================== */

body {
  color: #555555;
  background: #EEEEEE;
}

#page, #very-top {
  background-color: #fff;
}

#page, #very-top, #closure-blocks {
  width: 100%;
  min-width: 980px;
  overflow: hidden;
}

.region-very-top,
#block-nice_menus-1,
.home-carousel .block-inner,
.banner .block-inner,
.home-tabs,
.region-main,
.region-footer,
body.n .region-footer,
.pods-below .block-inner,
.footer-pods,
.footer-quicklinks {
  width: 980px;
  margin: 0 auto;
}

/* Allows crazy wide tables (webform results) to be scrolled horizontally */

body[class*='-webform-emails'] .region-main {
  overflow: auto;
}

.region-very-top, .region-main {
  position: relative;
}

.region-header {
  /* For IE7 */
  z-index: 50;
}

#block-nice_menus-1 {
  top: auto;
  left: auto;
}

.home-carousel, .banner {
  float: none;
  width: 100%;
  /* The carousel goes beyond the edges of the 980px, so prevent horizontal
   * scrollbars if the browser window is less than 980px wide. */
  overflow: hidden;
  background-color: #002530;
  z-index: 1;
}

.pods-below {
  float: none;
  width: 100%;
  overflow: hidden;
  background-color: #959595;
}

.home-tabs, .footer-pods {
  float: none;
}

#main {
  background-image: url(img/main.png);
  background-repeat: repeat-x;
  background
}

body.n .region-footer .block {
  width: 60%;
  margin-left: 20%;
}

#closure-blocks {
  float: none;
}

/* ========================================================================== *\
   IMAGE GALLERY FIXES
\* ========================================================================== */

.fiw-25  .gallery .field-image,
.fiw-40  .gallery .field-image,
.fiw-50  .gallery .field-image,
.fiw-60  .gallery .field-image,
.fiw-75  .gallery .field-image,
.fiw-100 .gallery .field-image { max-width: inherit !important; }

.fif-lt .gallery .field-image,
.fif-rt .gallery .field-image,
.fif-no .gallery .field-image {
  float: inherit;
  margin-right: inherit;
  margin-left: inherit;
}

.gallery .field-image a {
  max-width: inherit !important;
}

/* ========================================================================== *\
   LOGO
\* ========================================================================== */

#block-digitaldcore-logo, #block-logo {
  width: 390px;
  height: 118px;
}

#block-logo {
  background: url(img/logo-theme.png) no-repeat 35px 30px #fff;
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.3),
    only screen and (min--moz-device-pixel-ratio: 1.3),
    only screen and (-o-min-device-pixel-ratio: 1.3 / 1),
    only screen and (min-resolution: 1.3dppx),
    only screen and (min-resolution: 125dpi) {
  #block-logo {
    background-image: url(img/logo-theme@2x.png);
    background-size: 345px 64px;
  }
}

/* ========================================================================== *\
   HEADERLINKS
\* ========================================================================== */

div.block.headerlinks {
  margin-left: 390px;
  width: 370px;
}

.headerlinks .node-header {
  font-size: 16px;
  font-weight: 300;
}

.headerlinks .node {
  margin-left: 0;
  margin-right: 20px;
}

.headerlinks .has-image {
  margin-right: 5px;
}

.headerlinks .field-image img {
  width: 24px;
  max-width: 24px;
}

.headerlinks .node-39666 {
  position: absolute;
  right: -200px;
  top: 40px;
}

.headerlinks .node-39666 a {
  color: #000;
  opacity: 0.4;
  padding-left: 28px;
  background-image: url(img/cart-small.png);
  background-repeat: no-repeat;
  background-position: 0 3px;
}

.headerlinks .node-39666 a:hover {
  opacity: 1.0;
}
/* ========================================================================== *\
   SEARCH
\* ========================================================================== */

.dd-search .dd-search-keywords {
  border: none;
  background: #EEEEEE;
}

.dd-search .dd-search-keywords .form-text {
  color: #959595;
  font-family: 'Avenir W01', Helvetica, Arial, sans-serif;
  font-size: 10px;
  text-align: right;
  font-weight: 300;
  letter-spacing: .2em;
  width: 132px;
  line-height: 22px;
}

.dd-search-active .dd-search-keywords .form-text {
  font-size: 14px;
  text-align: left;
  font-weight: inherit;
  letter-spacing: inherit;
}

.dd-search .dd-search-submit {
  border: none;
  background-color: #EEEEEE;
  background-image: url(img/search.svg);
}

html.no-svg .dd-search .dd-search-submit {
  background-image: url(img/search.png);
}

/* ========================================================================== *\
   MAIN NAVIGATION
\* ========================================================================== */

.navbar .nice-menu {
  border-top: none;
  margin-left: -10px;
  margin-right: -50px;
  margin-bottom: 1px;
}

.navbar .nice-menu a.first-visible {
  padding-left: 10px;
}

.nice-menu a.menu-link {
  font-size: 16px;
  font-weight: bold;
}

.nice-menu a.menu-link.depth-1 {
  color: #6889AD;
  border-bottom: none;
}

.nice-menu a.menu-link.depth-1.active,
.nice-menu .active-trail a.menu-link.depth-1 {
  color: #33a6a4;
}

.nice-menu .over a.menu-link.depth-1,
.nice-menu a.menu-link.depth-1:hover {
  color: #fff;
  background-color: #F47B20;
}

/* Adding .navbar to make selector stronger */
.navbar .nice-menu ul {
  background-color: #6889AD;
  border-top: 1px solid white;
  padding-bottom: .5em;
}

.navbar .nice-menu ul ul {
  top: -1px;
  left: 240px;
  border-left: 1px solid white;
}

/* Right-align the last two dropdowns. See dtheme.js. */
.navbar .nice-menu li.right-align {
  position: relative;
}
.navbar .nice-menu li.right-align > ul {
  right: 0;
}
.navbar .nice-menu > li.right-align > ul ul {
  left: auto;
  right: 240px;
  border-left: none;
  border-right: 1px solid white;
}

.nice-menu a.menu-link {
  background-color: #6889AD;
  border-bottom: 1px solid white;
}

.nice-menu .active-trail > a {
  background-color: #33a6a4;
}

.nice-menu a.menu-link:hover,
.nice-menu li:hover > a.menu-link {
  background-color: #F47B20;
}

/* ========================================================================== *\
   HOME CAROUSEL
\* ========================================================================== */

.home-carousel .block-inner {
  position: relative;
}

.home-carousel .block-content {
  position: relative;
  left: -60px;
  width: 1100px;
}

.home-carousel .node-teaser {
  margin-bottom: 0;
  padding-bottom: 0;
  height: 300px;
}

.home-carousel .node-item {
  display: none;
}

.home-carousel .node-header,
.home-carousel .node-upper-image {
  display: block;
}

.home-carousel .field-image {
  margin: 0;
}

.home-carousel .node-header {
  position: absolute;
  top: 35px;
  left: 95px;
  width: 360px;
  bottom: 70px;
  overflow: hidden;
  text-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);
}

.home-carousel .node-header .title {
  color: #fff;
  font-size: 36px;
  font-weight: bold;
  line-height: 1.25;
}

.home-carousel .node-header .subtitle {
  color: #fff;
  font-size: 18px;
  font-weight: 300;
  line-height: 1.25;
}

.home-carousel .carousel-navigation {
  left: 95px;
  width: auto;
  bottom: 35px;
}

.home-carousel .carousel-navigation .carousel-previous,
.home-carousel .carousel-navigation .carousel-pager,
.home-carousel .carousel-navigation .carousel-next {
  float: left;
  display: inherit;
}

.home-carousel .carousel-next a,
.home-carousel .carousel-previous a {
  width: 30px;
  height: 30px;
  padding: 0;
  background-repeat: no-repeat;
  background-position: 7px 0px;
  -webkit-transition: -webkit-transform 0.2s;
  -moz-transition: -moz-transform 0.2s;
  transition: transform 0.2s;
}

.home-carousel .carousel-next a {
  background-image: url(/sites/all/modules/_dd/dd_templates/css/images/carousel-next.svg);
}

.home-carousel .carousel-previous a {
  background-image: url(/sites/all/modules/_dd/dd_templates/css/images/carousel-prev.svg);
}

html.no-svg .home-carousel .carousel-next a {
  background-image: url(/sites/all/modules/_dd/dd_templates/css/images/carousel-next.png);
}

html.no-svg .home-carousel .carousel-previous a {
  background-image: url(/sites/all/modules/_dd/dd_templates/css/images/carousel-prev.png);
}

.home-carousel .carousel-next a:hover,
.home-carousel .carousel-previous a:hover {
  background-color: transparent;
  -webkit-transform: scale(1.1, 1.1);
  -moz-transform: scale(1.1, 1.1);
  transform: scale(1.1, 1.1);
}

.home-carousel .carousel-next span,
.home-carousel .carousel-previous span {
  display: none;
}

.home-carousel .carousel-pager a {
  float: left;
  width: 16px;
  height: 16px;
  padding: 0;
  margin-top: 6px;
  margin-left: 4px;
  margin-right: 4px;
  overflow: hidden;
  text-indent: -9999px;
  border-radius: 8px;
  -webkit-transition: -webkit-transform 0.2s, background-color 0.5s;
  -moz-transition: -moz-transform 0.2s, background-color 0.5s;
  transition: transform 0.2s, background-color 0.5s;
}

.home-carousel .carousel-pager a {
  background-color: #757575;
  background-color: rgba(255,255,255,0.25);
}

.home-carousel .carousel-pager a:hover {
  -webkit-transform: scale(1.2, 1.2);
  -moz-transform: scale(1.2, 1.2);
  transform: scale(1.2, 1.2);
}

.home-carousel .carousel-pager a.active-slide {
  background-color: #fff;
}

/* ========================================================================== *\
   BANNER
\* ========================================================================== */

.banner .block-inner {
  position: relative;
}

.banner .block-content {
  position: relative;
  left: -60px;
  width: 1100px;
}

.banner .node-teaser {
  margin-bottom: 0;
  padding-bottom: 0;
  height: 180px;
}

.banner .node-item {
  display: none;
}

.banner .node-header,
.banner .node-upper-image {
  display: block;
}

.banner .field-image {
  margin: 0;
}

.banner .node-header {
  position: absolute;
  top: 40px;
  right: 95px;
  width: 360px;
  bottom: 10px;
  overflow: hidden;
  text-align: right;
  text-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);
}

.banner .node-header .title {
  color: #fff;
  font-size: 36px;
  font-weight: bold;
  line-height: 1.25;
}

/* ========================================================================== *\
   AQUAFORNIA / AQUAPEDIA CAROUSEL
\* ========================================================================== */

body.not-front .home-carousel .node-teaser {
  height: 180px;
}

body.wt273 .home-carousel .view-term:after,
body.wt164 .home-carousel .view-term:after {
  content: " ";
  position: absolute;
  width: 320px;
  height: 180px;
  top: 60px;
  right: 115px;
  background-repeat: no-repeat;
}

body.wt273 .home-carousel .view-term:after {
  background-image: url(img/aquafornia-carousel.png);
}

body.wt164 .home-carousel .view-term:after {
  background-image: url(img/aquapedia-carousel.png);
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.3),
    only screen and (min--moz-device-pixel-ratio: 1.3),
    only screen and (-o-min-device-pixel-ratio: 1.3 / 1),
    only screen and (min-resolution: 1.3dppx),
    only screen and (min-resolution: 125dpi) {
  body.wt273 .home-carousel .view-term:after {
    background-image: url(img/aquafornia-carousel@2x.png);
    background-size: 100%;
  }

  body.wt164 .home-carousel .view-term:after {
    background-image: url(img/aquapedia-carousel@2x.png);
    background-size: 100%;
  }
}

/* ========================================================================== *\
   HOME COMMON / SHARED STYLING
\* ========================================================================== */

.home-quicklinks .block-title,
.home-teasers .block-title {
  font-family: 'Trajan W01', Times, "Times New Roman", serif;
text-transform: uppercase;
  font-size: 22px;
  font-weight: normal;
  color: #555555;
}

/* ========================================================================== *\
   HOME TABS
\* ========================================================================== */

.home-tabs {
  position: relative;
  padding-top: 2em;
  padding-bottom: 2em;
  height: 5em;
  overflow: hidden;
}

.home-tabs .node-upper-meta {
  display: none;
}

.home-tabs .node-header {
  text-align: center;
}

.home-tabs .node-header .title {
  text-transform: uppercase;
  font-size: 24px;
  color: #555555;
}

.home-tabs .home-tab-active .node-header .title {
  color: #33a6a4;
}

.home-tabs .node-header a:hover .title {
  color: #F47B20;
}

.home-tabs .node-header .subtitle {
  font-size: 14px;
  line-height: 1.3;
  font-weight: normal;
  color: #6889AD;
  /* Makes the subtitles wrap in  a pretty way. */
  margin: .5em 3.8em;
}

.home-tabs:after {
  content: " ";
  position: absolute;
  bottom: 0px;
  width: 32px;
  height: 16px;
  background-image: url(img/home-arrow.svg);
  -webkit-transition: left 0.4s ease-out;
  -moz-transition: left 0.4s ease-out;
  transition: left 0.4s ease-out;
}

html.no-svg .home-tabs:after {
  background-image: url(img/home-arrow.png);
}

/* Show the right tab, showing position 1 by default */
/* Change the content so that IE8 redraws the element properly */
.home-tabs:after { left: 10.85%; content: " "; }
body.home-tab-2 .home-tabs:after { left: 35.85%; content: "  "; }
body.home-tab-3 .home-tabs:after { left: 60.85%; content: "   "; }
body.home-tab-4 .home-tabs:after { left: 85.85%; content: "    "; }

/* Show/hide stuff for tab 1: trending (default) */
.home-pods-trending,
.home-quicklinks-trending {
  display: block;
}
.home-pods-water-topics,
#block-menu_block-3,
.home-teasers-aquafornia,
.home-logo-aquafornia,
.home-quicklinks-aquafornia,
.home-teasers-aquapedia,
.home-logo-aquapedia,
.home-quicklinks-aquapedia {
  display: none;
}

/* Show/hide stuff for tab 2: water topics */
body.home-tab-water-topics .home-pods-trending,
body.home-tab-water-topics .home-quicklinks-trending {
  display: none;
}
body.home-tab-water-topics .home-pods-water-topics,
body.home-tab-water-topics #block-menu_block-3 {
  display: block;
}

/* Show/hide stuff for tab 3: aquafornia */
body.home-tab-aquafornia .home-pods-trending,
body.home-tab-aquafornia .home-quicklinks-trending {
  display: none;
}
body.home-tab-aquafornia .home-teasers-aquafornia,
body.home-tab-aquafornia .home-logo-aquafornia,
body.home-tab-aquafornia .home-quicklinks-aquafornia {
  display: block;
}

/* Show/hide stuff for tab 4: aquapedia */
body.home-tab-aquapedia .home-pods-trending,
body.home-tab-aquapedia .home-quicklinks-trending {
  display: none;
}
body.home-tab-aquapedia .home-teasers-aquapedia,
body.home-tab-aquapedia .home-quicklinks-aquapedia,
body.home-tab-aquapedia .home-logo-aquapedia {
  display: block;
}

/* ========================================================================== *\
   HOME QUICKLINKS COMMON
\* ========================================================================== */

.home-quicklinks {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  float: none;
  margin-left: -40px;
  width: auto;
}

.home-quicklinks .block-inner {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  float: right;
  clear: right;
  width: 33.33%;
}

.home-quicklinks .block-title,
.home-quicklinks .block-content {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  margin-left: 40px;
}

.home-quicklinks .node-teaser {
  float: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.home-quicklinks .node-item,
.home-quicklinks .node-upper-image {
  display: none;
}

.home-quicklinks .node-header {
  display: block;  
}

.home-quicklinks .node-header a {
  display: block;
  line-height: 20px;
  padding: 6px 12px;
  margin-bottom: 5px;
  font-weight: bold;
  font-size: 14px;
  text-align: center;
  text-transform: uppercase;
  background-color: #33a6a4;
  background-image: url(img/home-quicklink.png);
  background-repeat: repeat-x;
  /* Support multiple lines. */
  background-position: bottom left; 
  color: white;
  border-radius: 4px;
}

.home-quicklinks .node-header a:hover {
  background-color: #F47B20;
}

.home-quicklinks .node-header .subtitle {
  display: none;
}

.home-quicklinks .field-image {
  max-width: 24px !important;
  margin: 0 10px 0 0;
}

/* ========================================================================== *\
   HOME QUICKLINKS TRENDING
\* ========================================================================== */

.home-quicklinks-trending {
  /* We have to position this thing relative for block editing controls,
     so make sure it's not covered by the pods. */
  z-index: 1;
}

.home-quicklinks-trending .block-inner {
  clear: both;
}

.home-quicklinks-trending .block-title {
  text-align: center;
  margin-bottom: 15px;
}

/* ========================================================================== *\
   HOME PODS TRENDING + WATER TOPICS (SHARED STYLING)
\* ========================================================================== */

.home-pods .node-upper-meta {
  display: none;
}

.home-pods .node-header {
  font-size: 20px;
}

.home-pods .node-links {
  font-size: 12px;
}

/* ========================================================================== *\
   HOME PODS TRENDING
\* ========================================================================== */

.home-pods-trending {
  float: none;
  clear: left;
}

/* We don't want to clear 1, 4, 7 etc. anymore, because the quick links are extra. */
.home-pods-trending.col-3 .views-row:nth-child(3n+1) {
  clear: none;
}

.home-pods-trending.col-3 .views-row:first-child {
  clear: left;
}

/* So instead, we'll clear 3, 6, 9, etc. */
.home-pods-trending.col-3 .views-row:nth-child(3n) {
  clear: both;
}
/* For IE8 */
.home-pods-trending.col-3 .views-row-3,
.home-pods-trending.col-3 .views-row-6,
.home-pods-trending.col-3 .views-row-9,
.home-pods-trending.col-3 .views-row-12 {
  clear: both;
}

/* ========================================================================== *\
   HOME PODS WATER TOPICS
\* ========================================================================== */

.home-pods-water-topics {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  float: none;
  margin-left: -40px;
  width: auto;
}

.home-pods-water-topics .block-inner {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  float: left;
  clear: left;
  width: 33.33%;
}

.home-pods-water-topics .block-title,
.home-pods-water-topics .block-content {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  margin-left: 40px;
}

/* ========================================================================== *\
   HOME WATER TOPICS MENU BLOCK

   Note: this block depends on some custom PHP in template.php! Look for
   dtheme_preprocess_menu_block_wrapper(). -Dennis
\* ========================================================================== */

#block-menu_block-3 {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  float: none;
  margin-left: -40px;
}

#block-menu_block-3 .menu-column {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  float: left;
  width: 33.33%;
}

#block-menu_block-3 .menu-column > ul {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  margin-left: 40px;
}

#block-menu_block-3 ul a {
  display: inherit;
  padding: 0;
  border: none;
}

#block-menu_block-3 li.expanded {
  margin-bottom: 25px;
}

#block-menu_block-3 li.expanded > a {
  font-family: 'Trajan W01', Times, "Times New Roman", serif;
text-transform: uppercase;;
  font-weight: bold;
  font-size: 18px;
  line-height: 25px;
}

#block-menu_block-3 li.leaf > a {
  font-size: 14px;
  line-height: 20px;
  color: black;
}

#block-menu_block-3 ul a:hover {
  color: #F47B20;
}

/* ========================================================================== *\
   HOME LOGO AQUAFORNIA + AQUAPEDIA
\* ========================================================================== */

.home-logo {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  float: none;
  margin-left: -40px;
  width: auto;
}

.home-logo .block-inner {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  float: right;
  clear: right;
  width: 33.33%;
}

.home-logo .block-content {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  margin-left: 40px;
}

.home-logo .node-upper-meta {
  display: none;
}

.home-logo .node-header {
  text-align: center;
}

.home-logo .node-header .title {
  font-family: 'Trajan W01', Times, "Times New Roman", serif;
text-transform: uppercase;;
  font-weight: normal;
  font-size: 32px;
  color: black;
}

.home-logo .node-header .subtitle {
  font-weight: normal;  
  font-size: 14px;
  line-height: 1.4;
  color: #6889AD;
}

.home-logo .field-image img {
  height: 100px !important;
  margin: 0 auto;
}

/* ========================================================================== *\
   HOME TEASERS AQUAFORNIA + AQUAPEDIA
\* ========================================================================== */

.home-teasers {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  float: none;
  margin-left: -40px;
  width: auto;
}

.home-teasers .block-inner {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  float: left;
  clear: both;
  width: 66.66%;
}

.home-teasers .block-title,
.home-teasers .block-content {
  /* Simulate how the column/gutter classes work on the pods block to get the correct width. */
  margin-left: 40px;
}

/* ========================================================================== *\
   LEFT NAVIGATION / TERM NAVIGATION
\* ========================================================================== */

.term-nav {
  font-size: 16px;
}

.term-nav .block-title a,
.term-nav .block-title a.depth-2,
.term-nav .block-title a.depth-3 {
  padding: 0 0 5px;
  border-bottom: none;
  text-transform: uppercase;
  color: #555555;
}

.term-nav .block-title a:hover,
.term-nav .block-title a.active:hover,
.term-nav .block-title a.depth-2:hover,
.term-nav .block-title a.depth-3:hover {
  color: #F47B20;
}

.term-nav .block-title a.active {
  color: #33a6a4;
}

.term-nav ul ul a       { margin-left: 24px }
.term-nav ul ul ul a    { margin-left: 48px }
.term-nav ul ul ul ul a { margin-left: 72px }

.term-nav .menu a {
  color: #6889AD;
  border-bottom: none;
  line-height: 1.3;
}

.term-nav .menu a:hover {
  color: #F47B20;
}

.term-nav .menu a.active {
  color: #33a6a4;
}

.term-nav .menu .expanded > a:before,
.term-nav .menu .collapsed > a:before {
  background-color: transparent;
  background-image: url(img/term-nav-arrows.svg);
  background-position: left top;
}

html.no-svg .term-nav .menu .expanded > a:before,
html.no-svg .term-nav .menu .collapsed > a:before {
  background-image: url(img/term-nav-arrows.png);
}

.term-nav .menu .expanded > a:before {
  background-position: 100% top;
}

/* ====================================== *\
   THIS ITEM APPEARS IN - LEFT NAVIGATION
\* ====================================== */

.appearing-nav #nav-back {
  /* Allow positioning of arrow. */
  position: relative;
  height: 34px;
  margin-bottom: 20px;
}

.appearing-nav #nav-back a:before {
  /* Show arrow. */
  content: " ";
  display: block;
  position: absolute;
  background-image: url(img/back.svg);
  background-repeat: no-repeat;
  background-position: left top;
  height: 34px;
  width: 10px;
  top: 0;
  left: -10px;
}

.appearing-nav #nav-back a:hover:before {
  background-position: left bottom;
}

html.no-svg .appearing-nav #nav-back a:before {
  background-image: url(img/back.png);
}

.appearing-nav #nav-back a {
  /* Compensate for the arrow image. */
  margin-left: -10px;
  padding-left: 10px;
  background-image: none;
  background-color: #625C49;
  -webkit-transition: none;
  transition: none;
}

.appearing-nav #nav-back:hover a,
.appearing-nav #nav-back a:hover {
  background-color: #F47B20;
}

.appearing-nav .small {
  font-size: 14px;
  text-transform: uppercase;
  font-weight: 300;
  color: #AAAAAA;
  border-bottom: none;
}

.appearing-nav ul li {
  margin-right: 0;
  margin-left: 0;
  font-size: 16px;
}

.appearing-nav li a {
  border: none;
  color: #6889AD;
}

.appearing-nav li a:hover {
  color: #F47B20;
}

/* ========================================================================== *\
   OVERVIEW
   & NODE FULL
\* ========================================================================== */

h1,
.overview .title,
.node-full .title {
  font-family: 'Trajan W01', Times, "Times New Roman", serif;
text-transform: uppercase;
  font-weight: normal;
  font-size: 30px;
  color: #555555;
}

.overview .subtitle,
.node-full .subtitle {
  font-family: 'Trajan W01', Times, "Times New Roman", serif;
text-transform: uppercase;
  font-weight: bold;
  font-size: 18px;
  color: #959595;
}

.overview .node-content,
.node-full .node-content {
  color: inherit;
}

/* ========================================================================== *\
   META
\* ========================================================================== */

.meta .meta-item {
  font-size: 0.92em;
  border-right-color: #959595;
}

/* ========================================================================== *\
   TABS
\* ========================================================================== */

div.tab {
  -webkit-transition: color .2s ease-out, background-color .2s ease-out;
  -moz-transition: color .2s ease-out, background-color .2s ease-out;
  transition: color .2s ease-out, background-color .2s ease-out;
  font-size: 1em;
}

/* (Default) */
div.tab                  {     border-color: #AAAAAA;
                                      color: #AAAAAA; }
div.tab.active           { background-color: #AAAAAA;
                                      color: #fff; }

/* Publications */
div.tab.tab-pt103        {     border-color: #F47B20;
                                      color: #F47B20; }
div.tab.tab-pt103.active { background-color: #F47B20;
                                      color: #fff; }

/* Products */
div.tab.tab-pt573        {     border-color: #33a6a4;
                                      color: #33a6a4; }
div.tab.tab-pt573.active { background-color: #33a6a4;
                                      color: #fff; }

/* Aquapedia background */
div.tab.tab-pt475        {     border-color: #7ec252;
                                      color: #7ec252; }
div.tab.tab-pt475.active { background-color: #7ec252;
                                      color: #fff; }

/* Aquafornia news */
div.tab.tab-pt479        {     border-color: #6889AD;
                                      color: #6889AD; }
div.tab.tab-pt479.active { background-color: #6889AD;
                                      color: #fff; }

/* Videos */
div.tab.tab-pt106        {     border-color: #625C49;
                                      color: #625C49; }
div.tab.tab-pt106.active { background-color: #625C49;
                                      color: #fff; }

/* Tours */
div.tab.tab-pt477        {     border-color: #94bee6;
                                      color: #94bee6; }
div.tab.tab-pt477.active { background-color: #94bee6;
                                      color: #fff; }

/* Events */
div.tab.tab-pt60         {     border-color: #6889AD;
                                      color: #6889AD; }
div.tab.tab-pt60.active  { background-color: #6889AD;
                                      color: #fff; }

/* Photo gallery */
div.tab.tab-pt107        {     border-color: #ffcc00;
                                      color: #ffcc00; }
div.tab.tab-pt107.active { background-color: #ffcc00;
                                      color: #fff; }

/* Blog */
div.tab.tab-pt168        {     border-color: #235f5a;
                                      color: #235f5a; }
div.tab.tab-pt168.active { background-color: #235f5a;
                                      color: #fff; }

/* Maps-posters */
div.tab.tab-pt614        {     border-color: #b26165;
                                      color: #b26165; }
div.tab.tab-pt614.active { background-color: #b26165;
                                      color: #fff; }

/* ========================================================================== *\
   ACCORDIONS
\* ========================================================================== */

.accordion-heading .icon {
  background-image: url(img/chevron-right.svg);
  background-color: transparent;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}

/* No svg fallback support (eg. IE8) */
html.no-svg .accordion-heading .icon {
  background-image: url(img/chevron-right.png);
}

/* No svg fallback support (eg. IE8) */
html.no-svg .accordion-heading.active .icon {
  background-image: url(img/chevron-down.png);
}

/* ========================================================================== *\
   POST LEVEL EXPANDING RELATED LINKS
\* ========================================================================== */

.expanding-links .block-title a {
  color: #6889AD;
  text-decoration: none;
}

.expanding-links .block-title .link-text {
  font-size: inherit;
  white-space: inherit;
}

/* ========================================================================== *\
   PODS RIGHT
\* ========================================================================== */

.pods-right .views-row-odd .node-inner {
  background-color: #625C49;
}

.pods-right .views-row-even .node-inner {
  background-color: #6889AD;
}

.pods-right .views-row-odd .node:hover .node-inner,
.pods-right .views-row-even .node:hover .node-inner {
  background-color: #33a6a4;
}

.pods-right .node-header .title {
  color: #C7E9FB;
  -webkit-transition: color 0.3s ease-out;
  -moz-transition: color 0.3s ease-out;
  transition: color 0.3s ease-out;
}

.pods-right .node:hover .node-header .title {
  color: white;
}

.pods-right .node-header .subtitle {
  font-size: 1em;
  line-height: 1.313;
  font-weight: 300;
}

/* ========================================================================== *\
   PODS BELOW
\* ========================================================================== */

.pods-below .block-content {
  margin: 1em 35px;
}

.pods-below .node-header {
  font-size:   1.143em; /* 16px */
  line-height: 1.313em; /* 21px */
}

.pods-below .node-header .title {
  color: #C7E9FB;
}

.pods-below .node-header .subtitle {
  font-size: 1em;
  line-height: 1.313;
  font-weight: 300;
}

.pods-below .node:hover .node-header .title {
  color: white;
}

/* ========================================================================== *\
   LOGO PODS
\* ========================================================================== */

.pods-right .node.pt612 .node-inner {
  background-color: #625C49;
}

.pods-right .node.pt612:hover .node-inner {
  background-color: #F47B20;
}

.pods-right .pt612 .node-header {
  text-align: center;
}

.pods-right .pt612 .title {
  font-family: 'Trajan W01', Times, "Times New Roman", serif;
text-transform: uppercase;;
  font-weight: normal;
  font-size: 18px;
  color: white;
}

.pods-right .pt612 .subtitle {
  font-weight: normal;  
  font-size: 14px;
  line-height: 1.4;
}

.pods-right .pt612 .field-image {
  margin: 10px;
}

.pods-right .pt612 .field-image img {
  height: 100px !important;
  margin: 0 auto;
}
  
/* ========================================================================== *\
   FOOTER PODS + QUICKLINKS
\* ========================================================================== */

/* We want to float the quicklinks together with our pods, so open ourselves up. */
.footer-pods {
  clear: both;
  float: none;
  margin-top: 1em;
  margin-bottom: 1em;
}

/* Add a faux column at the front with a logo. */
.footer-pods .view-content:before {
  content: " ";
  float: left;
  width: 25%;
  height: 160px;
  background-image: url(img/footer-logo.png);
  background-position: 40px 1em;
  background-repeat: no-repeat;
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.3),
    only screen and (min--moz-device-pixel-ratio: 1.3),
    only screen and (-o-min-device-pixel-ratio: 1.3 / 1),
    only screen and (min-resolution: 1.3dppx),
    only screen and (min-resolution: 125dpi) {
  .footer-pods .view-content:before {
    background-image: url(img/footer-logo@2x.png);
    background-size: 154px 86px;
  }
}

/* Add a faux column at the end that's empty, for the quicklinks. */
.footer-pods .view-content:after {
  content: " ";
  float: left;
  height: 160px;
}

/* We don't want to clear 1, 4, 7 etc. anymore, because we're adding extra stuff. */
.footer-pods .views-row:nth-child(3n+1) {
  clear: none;
}

/* Move the second pod (if any) to the right, so the quicklinks become the third column. */
.footer-pods .views-row-2 .node {
  float: right;
}

.footer-pods .node-inner {
  height: 160px;
}

.footer-pods .node-item {
  display: none;
}

.footer-pods .node-content {
  display: block;
}

/* We imitate a container for columns with 40px gutter, so we can use percentages that match with the pods. */
.footer-quicklinks {
  float: none;
}

/* We imitate a 1/4 column with 40px gutter. */
.footer-quicklinks .block-inner {
  margin-left: -5px; /* 35 - 40 = -5 */
}

/* We imitate a 1/4 column with 40px gutter. */
.footer-quicklinks .block-title,
.footer-quicklinks .block-content {
  float: left;
  width: 25%;
  margin-left: -41px;
}

.footer-quicklinks .block-title .block-title-text,
.footer-quicklinks .block-content .view-term {
  margin-left: 41px;
}

.footer-pods .node-inner,
.footer-pods .view-content:after {
  margin-left: 20px;
  border-left: 1px solid #CCCCCC;
  padding-left: 19px;
  /* Let the internal margins kick in. */
  overflow: hidden;
}

.footer-quicklinks .block-inner {
  margin-top: 1em;
}

.footer-quicklinks .node-teaser {
  float: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.footer-quicklinks .block-title {
  padding-top: 1em;
}

.footer-quicklinks .block-title,
.footer-quicklinks .node-header,
.footer-pods .node-content {
  font-size: 10px;
  line-height: 1.5;
  color: #959595;
  text-transform: uppercase;
}

.footer-quicklinks .node-item,
.footer-quicklinks .node-upper-image {
  display: none;
}

.footer-quicklinks .node-header {
  display: block;  
  font-weight: normal;
}

.footer-quicklinks .node-header a {
  color: inherit;
}

.footer-quicklinks .node-header a:hover {
  color: #F47B20;
}

/* ========================================================================== *\
   LIST OF TOPICS /alphabetical-list-subjects
\* ========================================================================== */

body.t204 .subterm-block {
  width: 100%;
}


body.t204 .subterm-content .views-row .node {
margin-bottom: 10px;
}

body.t204 .subterm-content .title {
font-size: 20px;
}

body.t204 .subterm-content .views-row:nth-child(4n+1) {
  clear: both;
}

body.t204 .subterm-inner {
  margin-left: -40px;
}

body.t204 .subterm-block-inner {
  margin-left: 40px;
}


body.t204 .main-channel .subterm-link:hover {
background: #C7E9FB;
}


body.t204 .main-channel .node-upper-meta {
  display: none;
}

body.t204 .main-channel .subterm-overview .node-header a {
  font-family: 'Trajan W01', Times, "Times New Roman", serif;
text-transform: uppercase;;
  color: #625C49;
  font-size: 50px;
  font-weight: normal;
  /*border: 1px solid #CCCCCC;
  padding: 18px 12px 10px 12px;*/
  border-top: 1px solid #AAAAAA;
  padding: 12px 6px 4px 6px;
}

body.t204 .main-channel .subterm-content {
display: block;
}

body.t204 .main-channel .subterm-overview .node {

}

body.t204 .main-channel .subterm-content .node:hover {
  color: white;

  border-color: #F47B20;
}

body.t204 .main-channel .subterm-overview .node-header a .title:after {
  content: ".";
  display: inline;
  color: #959595;
}

body.t204 .main-channel .node-header a:hover .title:after {
  color: white;
}

body.t204 .main-channel .link-read-more {
  display: none;
}

/* Put alphabet in term nav in grid. */

.term-nav .menu-mlid-11585 ul.menu {
  margin-left: 20px;
  overflow: hidden;
}

.term-nav .menu-mlid-11585 ul.menu li {
  float: left;
  width: 20%;
}

.term-nav .menu-mlid-11585 ul.menu li a {
  margin-left: 0;
}

/* Special style overview titles (letters) in alphabet subterms. */

body.wt204 .overview .node-header {
  line-height: 1;
}

body.t204 .overview .node-header {
  line-height inherit;
}

body.wt204 .overview .node-header a .title {
  font-family: 'Trajan W01', Times, "Times New Roman", serif;
text-transform: uppercase;;
  color: #625C49;
  font-size: 50px;
  font-weight: normal;
}

body.t204 .overview .node-header a .title {
  font-size: inherit;
}

body.wt204 .overview .node-header a .title:after {
  content: ".";
  display: inline;
  color: #959595;
}

body.t204 .overview .node-header a .title:after {
  display: none;
}

/* Special style navbar menu. */

.navbar .mt-204 ul {
  display: none !important;
}


/* Eeek! Sloane added the below */

body.tt632 .node-content table, body.tt632 .node-content tbody, body.tt632 .node-content td, body.tt632 .node-content tr{
border: none;
}

/* ========================================================================== *\
   CALENDAR
\* ========================================================================== */

.cal-filters {
  float: right;
  border-bottom: none;
}

#cal .view-content {
  padding-top: 6px;
}

.cal-filters a.tab {
  padding: 6px 10px;
  cursor: pointer;
  border-radius: 5px;
  border-width: 1px;
  border-style: solid;
  font-size: 12px;
}

.cal-filters a.tab:hover,
.cal-filters a.tab.active {
  color: white !important;
  background-color: #999;
  border-color: #999;
}

#cal .node {
  padding: 2px 5px;
  font-size: 12px;
  line-height: 1.2em;
  border-top: 5px solid #000;
}

#cal .calendar-calendar div.calendar {
  width: 90%;
  margin-left: 0;
  margin-right: 0;
  padding: 5%;
}

#cal .calendar-calendar div.node-title {
  margin-bottom: 5px;
}

.calendar-calendar ul.links {
  float: left;
  margin-bottom: 15px;
}

.calendar-calendar .links li {
  float: left;
  width: auto;
  margin-right: 0;
}

.calendar-calendar .links li a {
  padding: 6px 10px;
  border-left: 1px solid #C7E9FB;
  background-color: #15AEAE;
  color: white;
  text-decoration: none;
  font-size: 12px;
}

.calendar-calendar .links li a:hover {
  text-decoration: underline;
}

.calendar-calendar .links li.first a {
  border-width: 1px;
  border-radius: 5px 0 0 5px;
}

.calendar-calendar .links li.last a {
  border-radius: 0 5px 5px 0;
}

.calendar-calendar div.date-nav {
  clear: both;
  padding: 10px 15px;
  margin: 0;
  background-color: #6889AD;
}

.calendar-calendar div.date-nav a {
  padding: 6px 10px;
  background-color: rgba(255,255,255,0.2);
  color: white;
  text-decoration: none;
  font-size: 12px;
  border-radius: 5px;
}

.calendar-calendar div.date-nav a:hover {
  text-decoration: underline;
}

.calendar-calendar div.date-nav h3 {
  color: white;
}

.calendar-calendar div.calendar {
  background-color: transparent;
}

.cal-filters a.show-wt60:hover, .cal-filters a.show-wt60.active   { background-color: #15AEAE; }
.cal-filters a.show-wt644:hover, .cal-filters a.show-wt644.active { background-color: #F47B20; }
.cal-filters a.show-wt477:hover, .cal-filters a.show-wt477.active { background-color: #6889AD; }
.cal-filters a.show-wt621:hover, .cal-filters a.show-wt621.active { background-color: #09C; }

#cal .wt60 a, #cal .show-wt60   { color: #15AEAE; border-color: #15AEAE; }
#cal .wt644 a, #cal .show-wt644 { color: #F47B20; border-color: #F47B20; }
#cal .wt477 a, #cal .show-wt477 { color: #6889AD; border-color: #6889AD; }
#cal .wt621 a, #cal .show-wt621 { color: #09C; border-color: #09C; }

#cal .wt60  { border-color: #15AEAE; }
#cal .wt644 { border-color: #F47B20; }
#cal .wt477 { border-color: #6889AD; }
#cal .wt621 { border-color: #09C; }

#cal .wt60 a  { color: #15AEAE; border-color: #15AEAE; }
#cal .wt644 a { color: #F47B20; border-color: #F47B20; }
#cal .wt477 a { color: #6889AD; border-color: #6889AD; }
#cal .wt621 a { color: #09C; border-color: #09C; }

#cal .wt60 a, #cal .show-wt60   { color: #15AEAE; border-color: #15AEAE; }
#cal .wt644 a, #cal .show-wt644 { color: #F47B20; border-color: #F47B20; }
#cal .wt477 a, #cal .show-wt477 { color: #6889AD; border-color: #6889AD; }
#cal .wt621 a, #cal .show-wt621 { color: #09C; border-color: #09C; }

/* ========================================================================== *\
   THEMING OUT COMMERCE WEBFORM FIELDSET ON FULL NODE PAGE - REMOVE WHEN BEN FIXES!
\* ========================================================================== */

body.node-38609 .webform-commerce-summary {
  display: none;
}

/* ========================================================================== *\
   HIDE ACCESS CONTROL META INFORMATION FROM MAGAZINE ARTICLES
   FD Issue: https://support.digitaldeployment.com/helpdesk/tickets/3005
\* ========================================================================== */

.node.pt577 .meta-access {
  display: none;
}

/* ========================================================================== *\
   HIDE ACCESS CONTROL META INFORMATION FROM BOARD PORTAL
   FD Issue: https://support.digitaldeployment.com/helpdesk/tickets/3658
\* ========================================================================== */

body.tt662 .meta .meta-access {
  display: none;
}

/* ========================================================================== *\
   HIDE RELATED PEOPLE AND PROFILES META INFORMATION FROM DISPLAYING SITEWIDE
   FD Issue: https://support.digitaldeployment.com/helpdesk/tickets/3497
   FD Issue: https://support.digitaldeployment.com/helpdesk/tickets/4013
\* ========================================================================== */

.meta .meta-profile {
  display: none !important;
}

/* ========================================================================== *\
   ADD A DONATE BUTTON
   FD Issue: https://support.digitaldeployment.com/helpdesk/tickets/5214
\* ========================================================================== */

.donate-btn {
  position: absolute;
  top: 40px;
  right: -120px;
}

.donate-btn .node-header a {
  display: block;
  background-color: #15AEAE;
  color: white;
  padding: 0 20px;
  border-radius: 5px;
}

.donate-btn .node-header a:hover {
  background-color: #F47B20;
  color: white;
}