/* Educational Resources */
.er-intro {padding-top: 30px;}
.er-intro h1 {margin-bottom: 15px;}
.er-form {padding-top: 15px; padding-bottom: 15px;}
.er-form .form {display: flex;}
.er-form .form-item {flex-basis: 33.3%; max-width: 33.3%; padding: 0 15px;}
.er-form label {display: block; padding-bottom: 7px; font-size: 16px; line-height: 16px; color: #1ba7cc;}
.er-form select {display: inline-block; font-size: 16px; line-height: 16px; padding: 4px 8px; margin-right: 30px; width: 100%;}
.er-list {padding-top: 30px; padding-bottom: 60px; min-height: 500px;}
.er-doc {background-color: #fff; border-radius: 4px; padding: 30px; margin-bottom: 15px; position: relative;}
.er-doc h3 {margin-bottom: 0px; margin-top: 0px; padding-right: 30%; color: #1ba7cc;}
.er-doc .fileinfo {font-size: 16px; line-height: 16px; margin-top: 7px; color: #555; margin-bottom: 0px;}
.er-doc .sep {color: #ccc; font-size: 20px;}
.er-doc .ctrl {position: absolute; top: 30px; right: 30px;}
.er-doc .ctrl a {display: inline-block; margin-left: 15px;}
.er-doc .ctrl svg {width: 30px; height: 30px; display: inline-block; fill: #777; transition: fill 0.3s ease, transform 0.3s ease;}
.er-doc .ctrl a:hover svg {fill: #333; transform: scale(1.1);}
.er-doc .info {padding-right: 30%;}
.er-doc .info p {font-size: 16px; line-height: 24px; color: #000;}
.er-doc p.detail {font-size: 16px; line-height: 20px; margin-bottom: 7px; margin-top: 0;}
.er-label {color: #555; padding-right: 15px;}
.er-no-results h3{ text-align: center; background-color: #fff; border-radius: 4px; padding: 30px; color: #333; margin-top: 0}
.website .messages.error { color: #ccc; padding: 10px 0 10px 72px; }
.listicles .listicle .field-name-field-image .field-slideshow {
  height: auto !important;
}

@media (max-width: 767px) {
  .er-form .form {flex-wrap: wrap;}
  .er-form .form-item {flex-basis: 100%; max-width: 100%; padding: 0 0;}
}

/* Sub Nav links */
.sub_nav ul .sub-nav-menu a{
    display: inline-block;
}

.open-sub-nav{
    margin-left: 5px;
    display:inline-block;
}

.sub-level-nav{
    width: 16px;
    height: 15px;
    display: block;
    position: relative;
    line-height: 0;
    top: 3px;
}

.sub-level-nav::after{
    content: '+';
    position: absolute;
    top: 7px;
    left: 3px;
    font-weight: bold;
}

.toggle-sub-nav{
    display: none;
}

.sub-nav-link{
    margin-left: 15px;
    margin-bottom: 5px;
}

.sub-nav-link:first-child{
    margin-top: 10px;
}

.sr-only{
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Accessibility fixes */
.skip-link { position: absolute; top: -100px; left: 35px; background: #008EAD; padding: 11px 20px; color: #fff; z-index: 999999; transition: top 0.3s; font-size: 1.6rem;}
a.skip-link:hover { text-decoration: underline; color: #fff; }
.skip-link:focus { top: 0; text-decoration: underline;}

.pod_wrapper .list_pod .content h5,
.latest_item h3 span {
  color: #000;
}

.pod_wrapper .list_pod .content h5 > span {
  color: #fff;
}

.slideshow .slideshow_main .info {
  pointer-events: none;
}

.splash .text a span.acc-text {
  position: absolute;
  width: 1px;
  height: 1px;
  border: 0;
}

.field-type-taxonomy-term-reference {
  font-size: 2rem;
}

.slideshow .slideshow_main .image:focus {
  outline: 2px solid #000 !important;
  outline-offset: -8px;
}

.view-content.landing_with_nav .also_in_section .list_pod h2 {
  font-size: 1.8rem;
}

footer h2, h2.job-item {
  font-size: 2rem;
}


footer .newsletter h2 {
  color: #fff;
  margin: 0;
}

.blog-date {
  font-size: 1.3rem;
}


/*-----------------------------------------------------------------*/
/*Object fit hack for IE */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    div[about='/deposit-return-scheme/latest'] .image {
        /*min-height: 140px;*/
        overflow: hidden;

    }

    div[about='/deposit-return-scheme/latest'] .image img {
        position: absolute;
        height: auto;
        width: 100%;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

}
/*moving titles to them original position*/
.basic_page article .title {
    margin: 0 ;
    transform: none;
}

/*revolve styles*/
.slideshow .slideshow_main .info p.learn_more {
  float: left;
  clear: both;
  background: #fff;
  margin: 0;
  padding: 10px 50px 20px 30px;
}
.slideshow .slideshow_main .info .learn_more span {transition: right 0.3s ease;}
.slideshow .slideshow_main .info .learn_more {transition: color 0.3s ease;}
.slideshow .slideshow_main .info .learn_more:hover {color: #444;}
.slideshow .slideshow_main .info .learn_more:hover span {right: 26px;}
.learn_more:after {display: none;}
.slideshow .slideshow_nav li {cursor: pointer;}

.slideshow .slideshow_main .image:hover + .info .learn_more {color: #444;}
.slideshow .slideshow_main .image:hover + .info .learn_more span {right: 26px;}

.rm-menu-container fieldset {
  border: 0;
}


/* Reset password form styles */
form#user-pass-reset input#edit-submit.form-submit{
  padding: 10px;
  font-size: 16px;
  margin-left: 10px;
}
form#user-pass-reset{
  margin: 1em auto;
}

form#user-pass-reset div{
  text-align: center;
}

.not_a_member{
  background-color: white;
  padding-left: 4em;
  padding-bottom: 4em;
}

@media (max-width: 620px) {
  .splash.user_login{
    min-height: 1000px;
  }

  .not_a_member{
    /*width: 100%;*/
    padding: 2em;
  }
}

/* sunburst styles */
.sb-intro,
.sb-iframe
{
   padding: 10px 20px 0;
 }

.sb-intro a {
  color: #000;
  text-decoration: underline;
}

/*.sb-intro a:hover {*/
 /*text-decoration: underline;*/
/*}*/

.sb-page-container {
  padding: 0 20px;
}

.sb-chart-container {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 60px;
  width: 100%;
  /*height: 900px;*/
  margin: 30px 0 60px;
  padding: 60px 0 60px;
  position: relative;
}

.svg-container {
  width: 85%;
  height: auto;
  position: relative;
}

.svg-container svg {
  overflow: visible;
  width: 100%;
  height:auto;
  max-height: 900px;
  font-size: 20px;
  font-family: sans-serif;
}

.svg-container .level-1,
.svg-container .circle-text{
  font-size: 24px;
}

.svg-container svg path:focus {
  outline: none;
  fill-opacity: 0.4 !important;
}

.svg-container svg circle:focus {
  outline: none;
}

.svg-container svg circle[tabindex="0"]:focus {
  outline: none;
  fill: #ccc;
  fill-opacity: 0.4 !important;
}

.sb-popout {
  background: rgba(255,255,255,0.9);
  border: #1ba5cb 4px solid;
  padding: 30px 20px 20px;
  width: 100%;
  position: absolute;
  z-index: 3;
  left: 50%;
  top: 10px;
  font-size: 14px;

  transform: translateX(-50%);
}

.sb-popout-link {
  display: inline-block;
  margin-top: 20px;
  color: #1ba5cb;
  font-weight: 700;
  text-decoration: none;
}

.sb-popout-link:hover,
.sb-popout-link:focus {
  text-decoration: underline;
}

.sb-popout-close {
  position: absolute;
  top:2px;
  right: 20px;
}

.sb-popout-close a {
  text-decoration: none;
  color: #1ba5cb;
  font-weight: 700;
  display: flex;
  align-items: center;
  position: relative;
}

.sb-popout-close a::after {
  content: '';
  position:absolute;
  width: 100%;
  height: 2px;
  bottom: 4px;
  left: 0;
  transition: all 0.2s;
}

.sb-popout-close a:hover::after {
  background:#1ba5cb;
}

.sb-popout-close a::before {
  content: 'x';
  font-weight: 300;
  font-size:30px;
  padding-right: 4px;
  position: relative;
  top: -3px;
}

.sb-popout-info h2 {
  font-size: 20px;
}

.sb-popout-info h3 {
  font-size: 18px;
}

.sb-reset-link {
  position: absolute;
  top: -60px;
  right: 0px;
  color: #000;
  font-size: 16px;
  text-decoration: underline;
}

.sb-iframe {
  margin-bottom: 60px;
}

.sb-iframe iframe {
  width: 100%;
  min-height: 400px;
}

/*.sb-reset-link:hover {*/
  /*text-decoration: underline;*/
/*}*/

/* fix for mobile subnav */

@media only screen and (max-width: 1024px) {

  .sub_nav.active {
    z-index: 1;
    box-shadow: 0 3px 8px rgba(0,0,0,0.15);
  }
}

@media only screen and (min-width: 768px){
  .svg-container svg {
    font-size: 11px;
  }

  .svg-container .level-1,
  .svg-container .circle-text {
    font-size: 14px;
  }

  .sb-popout-info h2 {
    font-size: 24px;
  }

  .sb-popout-info h3 {
    font-size: 20px;
  }
}

@media only screen and (min-width: 1024px) {
  .sb-intro {
    padding: 10px 20% 0;
  }

  .sb-iframe {
    padding: 10px 12% 0;
    max-width: 76%;
  }
}


@media only screen and (min-width: 1200px){
  .svg-container {
    width: 60%;
    height: auto;
  }

  .sb-popout {
    width: 70%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }

  .sb-reset-link {
    top: 20px;
    right: 20px;
  }
}

@media (min-width: 1200px) and (min-height: 768px){
  .svg-container svg {
    font-size: 13px;
  }

  .svg-container .level-1,
  .svg-container .circle-text {
    font-size: 15px;
  }

  .svg-container {
    width: calc(100vh - 180px);
    height: auto;
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  /* IE10+ */
  .svg-container svg {
    width: 900px;
    height: 900px;
  }

  .svg-container {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
/* END sunburst styles */

.list_pod .date{margin: 0;}
.list_pod .location{margin: 0;}


/* Quiz styles */
.quiz {
  font-size: 14px;
}

.quiz__form-item {
  margin-bottom: 30px;
}

.quiz label {
  margin-bottom: 10px;
}

.quiz fieldset {
  margin: 0;
  padding: 0;
  border: none;
}

.quiz legend {
  font-weight: bold;
  margin-bottom: 10px;
}

.quiz fieldset label {
  font-weight: normal;
  display: inline-block;

}

.quiz input[type="checkbox"] {
  appearance: checkbox;
  -webkit-appearance: checkbox;
  -moz-appearance: checkbox;
}

.quiz input[type="radio"] {
  appearance: radio;
  -webkit-appearance: radio;
  -moz-appearance: radio;
}

.quiz__select-container {
  position: relative;
  display: inline-flex;
}

.quiz__select-container:after {
  background: url(/sites/default/themes/zerowaste2016/images/cop-26/cop-down.svg) center center no-repeat;
  content: '';
  pointer-events: none;
  position: absolute;
  right: 4px;
  top: calc(50% - 12px);
  width: 24px;
  height: 24px;
  background-size: 24px 24px;
  z-index: 2;
}

.quiz__select-container select {
  border: 1px solid #c7c7d0;
  border-radius: 4px;
  color: #4B4744;
  padding: 6px 30px 6px 10px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  box-sizing: border-box;
  background: none;
  line-height: 1.3;
}

.quiz .btn {
  background: #008099;
  padding: 10px 30px;
  color: #fff;
  border: 2px solid #008099;
  transition: 0.2s all ease;
  border-radius: 4px;
}

.quiz .btn:hover {
  background: #fff;
  padding: 10px 30px;
  color: #008099;
  border: 2px solid #008099;
}

.quiz__answer {
  background: #008099;
  color: #fff;
  padding: 20px;
  margin-bottom: 50px;
}

.quiz__answer a {
  color: #fff;
  text-decoration: underline;
  font-weight:bold;
}


/* Custom checkbox */
.quiz fieldset .quiz__checkbox-container {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.quiz__checkbox-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.quiz__checkbox-checkmark {
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background: #fff;
  margin-right: 10px;
  position: relative;
  border: 1px solid #c7c7d0;
  border-radius: 4px;
  flex-shrink: 0;
}

.quiz__checkbox-container:hover input ~ .quiz__checkbox-checkmark,
.quiz__checkbox-container input:focus ~ .quiz__checkbox-checkmark {
  background-color: #ccc;
}

.quiz__checkbox-container input:checked ~ .quiz__checkbox-checkmark {
  background-color: #008099;
}

.quiz__checkbox-checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.quiz__checkbox-container input:checked ~ .quiz__checkbox-checkmark:after {
  display: block;
}

.quiz__checkbox-container .quiz__checkbox-checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* Custom radio*/
.quiz fieldset .quiz__radio-container {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.quiz__radio-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.quiz__radio-checkmark {
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background: #fff;
  margin-right: 10px;
  position: relative;
  border: 1px solid #c7c7d0;
  border-radius: 50%;
  flex-shrink: 0;
}

.quiz__radio-container:hover input ~ .quiz__radio-checkmark,
.quiz__radio-container input:focus ~ .quiz__radio-checkmark {
  background-color: #ccc;
}

.quiz__radio-container input:checked ~ .quiz__radio-checkmark {
  background-color: #008099;
}

.quiz__radio-checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.quiz__radio-container input:checked ~ .quiz__radio-checkmark:after {
  display: block;
}

.quiz__radio-container .quiz__radio-checkmark:after {
  top: 9px;
  left: 9px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
}

