/*ALL PAGES*/

/*turn default gold bar into green*/
.gold-bar {
	background: #81C67B !important;
}

/*accordion arrows background color */

.ckeditor-accordion-toggle {
	background: url("data:image/svg+xml,%3csvg width='11' height='12' viewBox='0 0 11 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3e %3cpath d='M9.97656 7.56097L5.3099 11.2276L0.643229 7.56097' stroke='black'/%3e %3cpath d='M5.35315 0.565475L5.30141 11.339' stroke='black'/%3e %3c/svg%3e") center no-repeat #81c67b !important;
}

/* overall page widths */

/*
.main-content, .main-content .text-formatted, .cke_editable_themed, .paragraph--type--side-by-side .text-formatted {
  width: 75%;
  margin-left:12.5%;
  margin-right:12.5%;
}
*/

@media screen and (min-width: 64px){
	.landing-page__content .main-content, .page-node-type-microsite .publication__detail .publication__main .main-content {
	grid-column: 1 / 12 !important;
	}
}

@media screen and (min-width: 576px){
	.main-content, .main-content .text-formatted, .cke_editable_themed, .paragraph--type--side-by-side .text-formatted {
	  width: 90%;
	  margin-left:5%;
	  margin-right:5%;
}
}

@media screen and (min-width: 1665px){
.main-content, .main-content .text-formatted, .cke_editable_themed, .paragraph--type--side-by-side .text-formatted{
    width: unset !important;
    max-width: 1200px;
  }
}


/*TRACKER SUBNAV*/

.tracker-nav {
	box-sizing: border-box;
  width: 100%;
  margin: 0 auto;
}

/*grid sections*/

.tcfd-grid {
    display: block;
    padding: 2%;
    height: 500px;
  }
  .tcfd-box {
    background: #fff;
    margin: 10px 0;
    text-align: left;
  }
  @media screen and (min-width: 576px) {
    .tcfd-grid {
      display: grid;
      grid-template-rows: repeat(6, 1fr);
      grid-template-columns: repeat(12, 1fr);
      grid-gap: 10px;
    }
    .tcfd-box {
      margin: 0;
    }
    .tcfd-box:nth-child(1) {
      grid-column: span 8;
      }
    .tcfd-box:nth-child(3) {
      grid-column: span 12;
    }
    .tcfd-box:nth-child(2),
    .tcfd-box:nth-child(4) {
      grid-column: span 4;
      }
  }
 

/*colors*/

.subnav-title, .subnav-description, .subnav-link {
	color: #fff !important;
}

.tracker-column:nth-child(1) {
	background-color: #0096A4; /*teal*/
}

.tracker-column:nth-child(2) {
	background-color: #9B216C; /*magenta*/
}

.tracker-column:nth-child(3) {
	background-color: #32864B; /*teal*/
}

.tracker-column:nth-child(4) {
	background-color: #EB8026; /*orange*/
}

/*four columns*/
.tracker-column {
	float: left;
	width: calc(25% - 30px);
	height: 350px;
	margin: 0 5px 0 5px;
	padding: 10px;
}

.tracker-row {
	justify-content: space-between;
}

/* clear floats after columns */
.tracker-row:after {
  content: "";
  display: table;
  clear: both;
}

@media only screen and (max-width: 1022px) {
  .tracker-column {
  	width: calc(50% - 30px);
    height: 300px;
    margin: 0 5px 0 5px;
    padding: 10px;
    margin-bottom: 10px;
  }
}

@media screen and (max-width: 720px) {
  .tracker-column {
    margin: 10px;
    width: 100%;
    height: 250px;
  }
  
  .tracker-nav {
    width: 90%;
    margin: auto;
  }
}

/* top button */

.top-button {
  display: none; /* hidden by default */
  position: fixed;
  bottom: 20px;
  right: 25px;
  z-index: 30; /* in front of other elements */
  border: 2px solid #fff;
  outline: none;
  background-color: #fff;
  color: #32864B;
  cursor: pointer;
  padding: 10px;
  font-family:  "acumin-pro-semi-condensed", sans-serif;
  font-size: 15px;
  font-weight: 500;
}

.top-button::before {
  content: "▲ ";
}

.top-button:hover {
  box-shadow: 5px 5px 10px gray;
}

/*make footer in front of button*/

.region-footer-top, .region-footer {
  position: relative;
  z-index: 31; /* footer not to overlap header */
}



/* callout box */

.net-zero-box {
	border: 1px solid #e8e8e7 !important;
	padding: 20px 20px !important;
	margin-top: 20px !important;
	width: 100%;
}


.main-content .callout>ul li::before, .main-content .text-formatted .callout>ul li::before, .cke_editable_themed .callout>ul li::before, .paragraph--type--side-by-side .text-formatted .callout>ul li::before {
	background-color: #000;
	border-radius: 50%;
	display: block;
	height: 0.3125rem;
	width: 0.3125rem;
	position: relative;
	top: 0.9375rem;
	left: -1.25rem;
}


/* callout right table of contents */

.jump-links {
	border: 1px solid #E7E6E6 !important;
	padding: 20px 20px !important;
}

	
	@media only screen and (min-width: 1500px) {
		.jump-links {
			position: fixed !important;
			top: 300px;
			right: 25px;
			z-index: 100;
			background-color: #fff;
		}
	}


/*large white button*/

.button.white {
	border: 2px solid #81C67B;
}


/* modals */

.popup {
    position: fixed;
    top:100px;
    bottom: 100px;
    left:25%;
    right: 25%;
    width:50%;
    padding:10px;
    background-color: #fff;
    border: 1.5px solid #000;
    box-shadow: 5px 5px 10px gray;
    z-index:100;
    overflow: auto;
    display: flex;
    align-items: center;
}

@media only screen and (max-width: 1200px) {
	.popup {
		left:12.5%;
		right:12.5%;
		width:75%;
		top:200px;
    bottom: 200px;
	}
}

@media only screen and (max-width: 600px) {
	.popup {
		left:5%;
		right:5%;
		width:90%;
		top:250px;
    bottom: 250px;
	}
}

    
.cancel {
    position: absolute;
    top: 5px;
    right: 5px;
    cursor: pointer;
    margin:0;
    width: 20px;
    text-align:center;
    z-index:1000;
}

.cancel::before {
  content: 'x';
  color: #000;
  font-weight: 400;
  font-family: sans-serif;
  font-size: 20px;
}

.popup-link {
	cursor: pointer !important;
}

.main-content hr {
	background-color: #81C67B !important;
  height: 2px !important;
  border: 0 !important;
}