/*
* MEDIA QUERIES
* Breakpoints for responsive sites
*/
/*
* TEXT TRUNCATE
* An easy way to truncate text with an ellipsis. Requires the element to be block or inline-block.
* Usage: @include text-truncate;
* Source: http://web-design-weekly.com/2013/05/12/handy-sass-mixins/
*/
/*
* DON'T BREAK
* Useful mixing so links don't overrun their container
* Usage: @include dontbreak();
* Source: https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/
*/
/*
* Skew
* Useful mixing to create skewed edges
* Usage: @include angle-edge(bottomright, 3deg, topleft, 3deg, #fff);
* Source: http://www.hongkiat.com/blog/skewed-edges-css/
*/
/*
* SASS Parent append
* Useful if you want to add an append to the parent without writing it out again
* Usage: @include parent-append(":hover")
* Source: https://codepen.io/imkremen/pen/RMVBvq
*/
/*
* Checked animation
*/
@-webkit-keyframes checked {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes checked {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@-webkit-keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(45deg);
  }
}
@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }
}
/*
* Breakpoint debugging
*/
.latest-reports {
  margin-bottom: 60px;
}
.latest-reports--title {
  margin-bottom: 30px;
  display: flex;
  align-items: center;
  padding-bottom: 20px;
  border-bottom: 1px solid black;
  flex-wrap: wrap;
}
.latest-reports--title h2 {
  color: #373737;
  font-size: 1.875rem;
  color: #2a7e81;
  font-family: "OpenSansBold", sans-serif;
  margin-right: 15px;
  margin-bottom: 0px;
  font-weight: 700;
}
.latest-reports--title p {
  color: #083145;
  margin: 0 0 20px 0;
  font-size: 1.25rem;
  margin-bottom: 0px;
  position: relative;
  top: 3px;
}
.latest-reports--inner {
  position: relative;
  margin-left: -10px;
  margin-right: -10px;
}
.latest-reports--inner .slick-track {
  display: flex;
}
.latest-reports--inner--item {
  height: inherit;
  background-color: #2A7E81;
  padding: 1.5rem 0.75rem;
  text-align: center;
  margin: 10px;
  display: flex !important;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  transition: 0.2s ease-out;
}
.latest-reports--inner--item h3 {
  color: #fff;
  font-weight: 700;
  margin-bottom: 0.5rem;
  font-size: 1rem;
}
.latest-reports--inner--item p {
  color: #fff;
}
.latest-reports--inner--item .read-on-btn {
  color: #64C0BD;
  border: 0px;
  border-bottom: 1px solid #64C0BD;
  text-transform: uppercase;
  font-size: 0.75rem;
  line-height: 1rem;
  text-transform: uppercase;
  font-weight: 800;
  transition: all 0.2s ease-in-out;
  background-color: transparent;
  padding: 0;
  cursor: pointer;
}
.latest-reports--inner--item .read-on-btn:hover {
  color: #64C0BD;
  border-bottom: 1px solid #64C0BD;
}
.latest-reports--inner--item:hover, .latest-reports--inner--item:active, .latest-reports--inner--item:focus {
  background: #205F61;
}
.latest-reports--inner--item:hover p, .latest-reports--inner--item:active p, .latest-reports--inner--item:focus p {
  color: #fff;
}
.latest-reports--inner--item:hover .read-on-btn, .latest-reports--inner--item:active .read-on-btn, .latest-reports--inner--item:focus .read-on-btn {
  color: #64C0BD;
  border-bottom: 1px solid #64C0BD;
}
.latest-reports--inner .slick-arrow {
  cursor: pointer;
  background-color: #2a7e81;
  text-indent: -9999px;
  width: 34px;
  height: 34px;
  border: 0px;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  transition: 200ms;
}
.latest-reports--inner .slick-arrow.slick-next {
  right: 10px;
  bottom: -40px;
  background-image: url("assets/right-arrow.svg");
}
.latest-reports--inner .slick-arrow.slick-prev {
  left: 10px;
  bottom: -40px;
  background-image: url("assets/left-arrow.svg");
}
.latest-reports--inner .slick-arrow.slick-disabled {
  display: none !important;
}
.latest-reports--inner .slick-arrow:hover {
  background-color: #267174;
}