@charset "UTF-8";
/******************************************************************
Site Name:
Author:

Stylesheet: Main Stylesheet

Helpful articles on Sass file organization:
http://thesassway.com/advanced/modular-css-naming-conventions

******************************************************************/
/*********************
IMPORTING SASSY PARTIALS

Make sure to import these FIRST so all your sassy variables get loaded in

*********************/
/* normalize.css 2012-07-07T09:50 UTC - http://github.com/necolas/normalize.css */
/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined in IE 8/9.
 */
@import url("https://fonts.googleapis.com/css?family=EB+Garamond:400,400i,700|Montserrat:200,400,700");
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block;
}

/**
 * Correct `inline-block` display not defined in IE 8/9.
 */
audio,
canvas,
video {
  display: inline-block;
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9.
 * Hide the `template` element in IE, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none;
}

/* ==========================================================================
   Base
   ========================================================================== */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/**
 * Remove default margin.
 */
body {
  margin: 0;
}

/* ==========================================================================
   Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background: transparent;
}

/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */
a:focus {
  outline: thin dotted;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0;
}

/* ==========================================================================
   Typography
   ========================================================================== */
/**
 * Address styling not present in IE 8/9, Safari 5, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */
b,
strong,
.strong {
  font-weight: bold;
}

/**
 * Address styling not present in Safari 5 and Chrome.
 */
dfn,
em,
.em {
  font-style: italic;
}

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}

/*
 * proper formatting (http://blog.fontdeck.com/post/9037028497/hyphens)
*/
/*
 * Addresses margins set differently in IE6/7.
 */
pre {
  margin: 0;
}

/**
 * Correct font family set oddly in Safari 5 and Chrome.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size: 1em;
}

/**
 * Improve readability of pre-formatted text in all browsers.
 */
pre {
  white-space: pre-wrap;
}

/**
 * Set consistent quote types.
 */
q {
  quotes: "“" "”" "‘" "’";
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
q:before,
q:after {
  content: "";
  content: none;
}

small, .small {
  font-size: 75%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* ==========================================================================
  Embedded content
========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9.
 */
img {
  border: 0;
}

/**
 * Correct overflow displayed oddly in IE 9.
 */
svg:not(:root) {
  overflow: hidden;
}

/* ==========================================================================
   Figures
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari 5.
 */
figure {
  margin: 0;
}

/* ==========================================================================
   Forms
   ========================================================================== */
/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0; /* 1 */
  padding: 0; /* 2 */
}

/**
 * 1. Correct font family not being inherited in all browsers.
 * 2. Correct font size not being inherited in all browsers.
 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 */
button,
input,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 2 */
  margin: 0; /* 3 */
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
button,
input {
  line-height: normal;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */
button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type=button],
input[type=reset],
input[type=submit] {
  -webkit-appearance: button; /* 2 */
  cursor: pointer; /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type=checkbox],
input[type=radio] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */
input[type=search] {
  -webkit-appearance: textfield; /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box; /* 2 */
  box-sizing: content-box;
}

/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * 1. Remove default vertical scrollbar in IE 8/9.
 * 2. Improve readability and alignment in all browsers.
 */
textarea {
  overflow: auto; /* 1 */
  vertical-align: top; /* 2 */
}

/* ==========================================================================
   Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.image-replacement,
.ir {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

.clearfix, .cf, .comment-respond {
  zoom: 1;
}
.clearfix:before, .clearfix:after, .cf:before, .comment-respond:before, .cf:after, .comment-respond:after {
  content: "";
  display: table;
}
.clearfix:after, .cf:after, .comment-respond:after {
  clear: both;
}

/******************************************************************
Site Name:
Author:

Stylesheet: Variables

Put your variables here.  That includes fonts.

Use the two tier varaible system for maximum flexibility.
In short, define a color variable, with a hex code, and then define a property varaible using your color variable.
This allows for maximum flexibility down the line.  It allows you to both replace all instances of a color in one line
or change one properties color without effecting anything else.

*******************************************************************/
/***************************************************************************
COLOR DEFINITIONS
****************************************************************************/
/**********************************************************************
PROPERTY DEFINITIONS
***********************************************************************/
/**************************************************************************
FONT EMBEDS
***************************************************************************/
/* Google fonts method: go to google fonts, select a font, open your selection window, click the '@import' tab, and copy the code here.
I've started you out with one font. I like it. Maybe you do to. Maybe you change it. Count your blessings, because I almost made comic sans the default font. It is like the rickroll of fonts. BOOM. You got comic sans-ed. I shoulda done in. Sigh.*/
/*
If you want to embed locally hosted fonts, use the syntax below. You need the actual font files corresponding to
the file formats called below. Drop those into /library/fonts, copy the code chunk below (without the comments, lunchbox),
and you should be off to the races. The font races. Much excitement.
*/
/*  @font-face {
      font-family: 'Font Name';
      src: url('library/fonts/font-name.eot');
      src: url('library/fonts/font-name.eot?#iefix') format('embedded-opentype'),
             url('library/fonts/font-name.woff') format('woff'),
             url('library/fonts/font-name.ttf') format('truetype'),
             url('library/fonts/font-name.svg#font-name') format('svg');
      font-weight: normal;
      font-style: normal;
  }
*/
/****************************************************************************
FONT VARIABLES
******************************************************************************/
/******************************************************************
Site Name:
Author:

Stylesheet: Sass Functions

Functions do what functions ought to do. They take an input and provide an output.
Think of these like mixins that take a parameter.  Write them that way too.
If you want to automate something, ask yourself, 'would it be helpful for this tool to take a parameter?'
If the answer is yes, write it as a function. If not, then mix it in, baby.

For more info on functions, go here:
http://sass-lang.com/documentation/Sass/Script/Functions.html

******************************************************************/
/*********************
COLOR FUNCTIONS
These are helpful when you're working
with shadows and such things. It's essentially
a quicker way to write RGBA.

Example:
box-shadow: 0 0 4px black(0.3);
compiles to:
box-shadow: 0 0 4px rgba(0,0,0,0.3);
*********************/
/*********************
RESPONSIVE HELPER FUNCTION


Example:
width: cp(650px, 1000px);
or
width: calc-percent(650px, 1000px);
both compile to:
width: 65%;
*********************/
/******************************************************************
Site Name:
Author:

Stylesheet: Mixins Stylesheet

Yeah, so mixins. Can be super useful, especially for code that you find yourself repeating frequently (vendor prefixes for example),
but that being said, I wouldn't go out of your way to force mixins just because they're a cool SASS feature.
In short, don't over-complicate things. You don't need a mixin for everything. Also, what you gain in speed you lose in granular control.

Helpful:
http://sachagreif.com/useful-sass-mixins/
http://thesassway.com/intermediate/leveraging-sass-mixins-for-cleaner-code
http://web-design-weekly.com/blog/2013/05/12/handy-sass-mixins/

******************************************************************/
/*********************
TRANSITION
*********************/
/* @include css-gradient(#dfdfdf,#f8f8f8); */
/*********************
BOX SIZING
*********************/
/* @include box-sizing(border-box); */
/*********************
IMPORTING PAGES

*********************/
.home-text-wrap {
  padding: 6em 0;
  margin-top: -4em;
}
.home-text-wrap h2 {
  margin: 0.4em 0;
}

.home-tiles-wrap {
  justify-content: space-between;
}
.home-tiles-wrap .quarter-col {
  display: flex;
  flex-basis: 24%;
}
.home-tiles-wrap .feature-tile {
  display: flex;
  align-items: center;
  position: relative;
  background-size: cover;
  background-position: center;
  width: 100%;
  overflow: hidden;
}
.home-tiles-wrap .feature-tile .overlay {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(38, 91, 122, 0.5);
  z-index: 2;
}
.home-tiles-wrap .feature-tile .text-wrap {
  position: relative;
  z-index: 5;
  flex-basis: 100%;
}
.home-tiles-wrap .feature-tile .text-wrap .tile-text {
  margin: 4em 0;
  padding: 0 0.5em;
}
.home-tiles-wrap .feature-tile::before, .home-tiles-wrap .feature-tile::after {
  content: "";
  position: absolute;
  background-color: #2bd2ca;
  transition: all 0.2s ease-in-out;
  z-index: 3;
}
.home-tiles-wrap .feature-tile::before {
  top: -3em;
  left: 0;
  width: 1.5em;
  height: 3em;
}
.home-tiles-wrap .feature-tile::after {
  right: -3em;
  bottom: 0;
  width: 3em;
  height: 1.5em;
}
.home-tiles-wrap .feature-tile:hover::before {
  top: 0;
}
.home-tiles-wrap .feature-tile:hover::after {
  right: 0;
}

.home-who .text-col {
  padding: 4em 1.5em 1.5em;
}
.home-who .text-col h2 {
  margin-bottom: 0.5em;
}
.home-who .text-col .who-text-wrap {
  margin-bottom: 3em;
}

.home-blog .sm-title {
  margin-bottom: 0.25em;
}
.home-blog .text-col {
  background-size: cover;
  background-position: center;
  align-content: center;
  padding: 2em;
}
.home-blog .text-col h2 {
  margin-bottom: 0.5em;
}
.home-blog .text-col .post-excerpt {
  margin-bottom: 3em;
}

.section .container {
  max-width: 1200px;
  padding: 0 50px;
}
@media (max-width: 1000px) {
  .section .container {
    padding: 0 25px !important;
  }
}
@media (max-width: 700px) {
  .section .container {
    padding: 0 25px !important;
  }
}

.hero-mountain {
  background-position-y: 0;
  position: absolute;
  inset: auto 0px 0px auto;
  width: 60%;
  height: 70%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: bottom;
  bottom: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  justify-content: end;
}
.hero-mountain svg {
  transform: scale(2);
  opacity: 0.35;
}

.about-us h3 {
  margin-bottom: 6px;
}
@media (max-width: 1000px) {
  .about-us .container {
    padding-right: 0;
  }
}
.about-us .col {
  padding-top: 100px;
  padding-bottom: 100px;
}
.about-us .col:first-child {
  padding-right: 0;
}
.about-us .col:last-child {
  padding-left: 50px;
}
.about-us .icon-list {
  display: flex;
  flex-direction: horizontal;
  flex-wrap: wrap;
}
.about-us .icon-list .icon-con {
  width: 50%;
}
.about-us .icon-list .icon-con:nth-child(even) {
  margin-top: 100px;
}
.about-us .icon-list .icon-con .icon-icon {
  height: 100px;
  width: 100px;
  background-size: contain;
  background-position: center;
}
.about-us .icon-list .icon-con .icon-content {
  padding-right: 50px;
}

.temerity-talks {
  margin-top: 100px;
}
.temerity-talks.home {
  margin-bottom: 100px;
}
.temerity-talks .container {
  flex-direction: column;
}
.temerity-talks .tt-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-around;
  margin-bottom: 40px;
}
@media (max-width: 1000px) {
  .temerity-talks .tt-header {
    flex-direction: column;
  }
}
.temerity-talks .tt-header h3 {
  white-space: nowrap;
}
.temerity-talks .tt-header p {
  margin-bottom: 0;
  padding: 0 50px 0 50px;
}
@media (max-width: 1000px) {
  .temerity-talks .tt-header p {
    margin-top: 10px;
    margin-bottom: 15px;
  }
}
.temerity-talks .tt-header .btn {
  min-width: 130px;
}
.temerity-talks .tt-con {
  display: flex;
  justify-content: space-between;
  flex-direction: row;
}
@media (max-width: 1000px) {
  .temerity-talks .tt-con {
    flex-direction: column;
  }
}
.temerity-talks .tt-con .tt-highlight {
  width: 38%;
}
@media (max-width: 1000px) {
  .temerity-talks .tt-con .tt-highlight {
    width: 100%;
  }
}
.temerity-talks .tt-con .tt-highlight .card {
  min-height: 500px;
}
.temerity-talks .tt-con .tt-rows {
  width: 58%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media (max-width: 1000px) {
  .temerity-talks .tt-con .tt-rows {
    width: 100%;
    margin-top: 20px;
  }
  .temerity-talks .tt-con .tt-rows .card {
    margin-top: 20px;
  }
}
.temerity-talks.featured {
  margin-top: 0;
  padding-top: 50px;
  padding-bottom: 50px;
}
.temerity-talks.featured .tt-header {
  justify-content: start;
  margin-bottom: 0px;
}
.temerity-talks.cats {
  background-color: white;
  margin-top: 50px;
  margin-bottom: 50px;
}
@media (max-width: 1000px) {
  .temerity-talks.cats .container {
    padding: 0px;
  }
  .temerity-talks.cats .container .tt-con {
    padding-left: 25px;
  }
}
.temerity-talks.cats .tt-header {
  justify-content: start;
  margin-bottom: 0px;
}
.temerity-talks.cats .tt-con-scroll {
  overflow-x: scroll;
  width: calc((100vw - 100%) / 2 + 99%);
}
.temerity-talks.cats .tt-con {
  display: flex;
  overflow: visible;
}
.temerity-talks.cats .tt-highlight {
  width: auto;
  overflow: visible;
  display: flex;
  white-space: nowrap;
  margin-bottom: 15px;
}
.temerity-talks.cats .tt-highlight .card {
  display: inline-block;
  white-space: unset;
  width: 476px;
  min-height: 500px;
  min-width: 476px;
  margin-right: 50px;
}
@media (max-width: 1000px) {
  .temerity-talks.cats .tt-highlight .card {
    max-width: 476px;
  }
}
@media (max-width: 530px) {
  .temerity-talks.cats .tt-highlight .card {
    min-width: calc(100vw - 60px);
    max-width: calc(100vw - 60px);
  }
}

.btn {
  background-color: #1A3B4D;
  border-radius: 20px;
  padding: 10px 30px 10px 30px;
  color: white;
  font-family: "Poppins", sans-serif;
  font-weight: bold;
  white-space: nowrap;
  text-align: center;
  border: 1px solid #1A3B4D;
  transition: 0.25s;
}
.btn:hover {
  background-color: #ffffff;
  border: 1px solid #1A3B4D;
  color: #1A3B4D;
}

.back-yellow {
  background-color: #FBCC2B;
}

.back-darkblue {
  background-color: #1A3B4D;
}

.teal-underline {
  position: relative;
}
.teal-underline::after {
  position: absolute;
  top: 100%;
  left: 0;
  height: 15px;
  width: 100%;
  background-color: #2AD2C9;
  content: "";
  border-radius: 20px;
}

.card {
  border-radius: 20px;
  box-shadow: 0px 4px 13px rgba(0, 0, 0, 0.25);
  overflow: hidden;
  position: relative;
  background-color: white;
}
.card p:empty {
  display: none;
}
.card .sharedaddy.sd-sharing-enabled {
  display: none;
}
.card .image {
  background-size: cover;
  background-position: center;
  height: 265px;
  width: 100%;
  position: relative;
}
.card .card-content {
  padding: 20px 30px 30px 20px;
  white-space: normal;
}
.card .card-content h3 {
  margin-top: 5px;
  margin-bottom: 5px;
}
.card.small {
  display: flex;
  flex-direction: row;
  min-height: 150px;
  box-shadow: none;
  overflow: visible;
  background-color: transparent;
}
.card.small .image {
  position: absolute;
  top: 0;
  left: 0;
  width: 250px;
  height: 100%;
  box-shadow: 0px 4px 13px rgba(0, 0, 0, 0.25);
  border-radius: 20px;
}
@media (max-width: 700px) {
  .card.small .image {
    width: 40%;
  }
}
.card.small .card-content {
  padding: 0;
  padding-left: 265px;
}
@media (max-width: 700px) {
  .card.small .card-content {
    padding-left: 45%;
  }
}

.tag {
  border-radius: 20px;
  background-color: #F0BD3D;
  color: black;
  position: absolute;
  display: block;
  top: 15px;
  right: 15px;
  padding: 5px 15px;
  font-size: 14px;
  font-family: "Poppins", sans-serif;
  font-weight: bold;
}

.section.team-list {
  margin-top: 100px;
}
.section.team-list .container {
  display: block;
}
.section.team-list .container .row {
  flex-wrap: wrap;
}

.team-pic {
  position: relative;
  background-position: center;
  background-size: cover;
  min-height: 400px;
  width: 90%;
  border: 1px solid #F0BD3D;
  margin-bottom: 10%;
}
.team-pic:before {
  position: absolute;
  content: "";
  top: 15px;
  right: 15px;
  height: 100%;
  width: 100%;
  z-index: -1;
  background-color: #F0BD3D;
}
.team-pic .team-content {
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 10px 20px;
  text-align: right;
  background-color: #9F187D;
}
.team-pic .team-content h3, .team-pic .team-content h2 {
  color: white;
  margin-top: 0;
  margin-bottom: 0;
}

.section.casestudy.stats {
  padding-top: 85px;
  padding-bottom: 70px;
}
.section.casestudy.stats h1, .section.casestudy.stats h2 {
  color: white;
  margin: 0;
}
.section.casestudy.stats .con-stats .col-4 {
  padding-left: 2.5%;
  padding-right: 2.5%;
}
@media (max-width: 1000px) {
  .section.casestudy.stats .con-stats .col-4 {
    padding-bottom: 40px;
  }
  .section.casestudy.stats .con-stats .col-4 h1 {
    font-size: 3.25em;
    padding-bottom: 5px;
  }
}
.section.casestudy.about .col {
  padding-top: 70px;
  padding-bottom: 80px;
}
@media (max-width: 1000px) {
  .section.casestudy.about .col {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}
.section.casestudy.about .col:nth-child(even) {
  text-align: center;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.section.casestudy.about .col:nth-child(even) a {
  margin-top: 20px;
}
.section.casestudy.imagerow {
  margin-top: 100px;
  margin-bottom: 100px;
}
@media (max-width: 1000px) {
  .section.casestudy.imagerow {
    margin-top: 15px;
    margin-bottom: 30px;
  }
  .section.casestudy.imagerow .container {
    padding: 0 15px;
  }
  .section.casestudy.imagerow .row {
    flex-direction: row;
  }
  .section.casestudy.imagerow .row .col {
    margin-right: 10px;
  }
  .section.casestudy.imagerow .row .col:last-child {
    margin-right: 0;
  }
}
.section.casestudy.imagerow .col {
  background-position: center;
  background-size: contain;
  min-height: 350px;
  margin-right: 50px;
}
@media (max-width: 1000px) {
  .section.casestudy.imagerow .col {
    min-height: 33vw;
  }
}
.section.casestudy.imagerow .col:nth-child(3) {
  margin-right: 0;
}
.section.casestudy.imagerow .col.test-image {
  background-size: cover;
  background-repeat: no-repeat;
  height: 350px;
}
@media (max-width: 1000px) {
  .section.casestudy.imagerow .col.test-image {
    background-size: contain;
    padding-bottom: 40px;
    height: auto;
  }
}
.section.casestudy.test {
  position: relative;
  z-index: 1;
  margin-bottom: 100px;
  margin-top: 100px;
}
.section.casestudy.test .test-image {
  background-size: cover;
  min-height: 350px;
  margin-right: 80px;
  background-position: center;
  margin-top: -20px;
  position: relative;
  background-repeat: no-repeat;
}
@media (max-width: 1000px) {
  .section.casestudy.test .test-image {
    background-size: contain;
    background-color: white;
  }
}
.section.casestudy.test .test-image:before {
  top: 20px;
  left: -20px;
  width: 100%;
  height: 100%;
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  background-color: #F0BD3D;
}
.section.casestudy.test h2 {
  margin-top: 60px;
}
.section.casestudy.test h1, .section.casestudy.test h2, .section.casestudy.test p {
  color: white;
}

.hero-wrap.casestudy h3 {
  margin: 0 0 10px !important;
}
.hero-wrap.casestudy p {
  max-width: 550px;
  font-size: 1.25em;
}

.section.team-bio {
  position: relative;
  padding-bottom: 150px;
}

.post-template-default article {
  margin-top: 50px;
  max-width: 100%;
}
.post-template-default iframe {
  max-width: 100%;
}

.section.article-hero {
  min-height: 400px;
  width: 100%;
  background-size: cover;
  background-position: center;
  filter: blur(2px);
}

#simple-banner ~ .total-page-container {
  position: relative;
  top: 44px;
}
#simple-banner ~ .total-page-container header {
  top: 44px;
}

.simple-banner-text a {
  font-weight: bold;
}

.our-team-hero {
  padding-top: 8em;
}
.our-team-hero h1 a, .our-team-hero h3 a {
  color: #374d5a;
  font-weight: bold !important;
}

@media (max-width: 700px) {
  #sticky-wrapper {
    display: none;
  }
}
.section.temerity-talks.cats .container {
  position: relative;
}
@media (max-width: 1000px) {
  .section.temerity-talks.cats .container {
    padding: 0 !important;
  }
}
.section.temerity-talks.cats .container .scroller {
  position: absolute;
  top: 40%;
  right: 0;
  display: block;
  width: 50px;
  height: 50px;
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  z-index: 10000;
  cursor: pointer;
}
.section.temerity-talks.cats .container .scroller:before, .section.temerity-talks.cats .container .scroller:after {
  content: "";
  display: block;
  width: 10px;
  height: 20px;
  transform: rotate(-45deg);
  background-color: #9F187D;
  position: absolute;
  top: 11px;
  left: 22px;
}
.section.temerity-talks.cats .container .scroller:after {
  transform: rotate(-135deg);
  top: 18px;
}
.section.temerity-talks.cats .container .scroller.back {
  right: auto;
  left: -50px;
  background-color: rgba(159, 24, 125, 0.1);
  display: none;
}
.section.temerity-talks.cats .container .scroller.back.show {
  display: block;
}
.section.temerity-talks.cats .container .scroller.back:before {
  transform: rotate(45deg);
  left: 18px;
}
.section.temerity-talks.cats .container .scroller.back:after {
  transform: rotate(135deg);
  left: 18px;
}

.content-wrap.impact-content {
  margin-top: 8em;
}

.first-impact-row .image-col {
  position: relative;
  top: -3em;
}
.first-impact-row .text-col {
  padding: 2em 0;
}

.team-row {
  align-items: flex-start;
}
.team-row.columns-wrap {
  flex-wrap: nowrap;
}
.team-row .third-col {
  flex-basis: 320px;
  flex-grow: 1;
}
.team-row .two-third-col {
  flex-basis: 640px;
  flex-grow: 1;
}
.team-row .image-wrap {
  padding-left: 1em;
  text-align: right;
}
.team-row .image-col .inner-image {
  padding-top: 150%;
  background-size: cover;
  background-position: center;
}
.team-row .text-col {
  padding: 3em 1em;
}
.team-row .text-col .team-name {
  margin: 0;
}
.team-row .text-col .team-title {
  margin-top: 0;
  font-size: 1em;
}
.team-row .text-col .team-social {
  margin-top: 3em;
}
.team-row:nth-child(even) .image-wrap {
  order: 2;
}
.team-row:nth-child(even) .two-third-col {
  text-align: right;
}
.team-row:nth-child(even) .two-third-col .two-third-gutters {
  text-align: left;
}
.team-row:nth-child(even) .third-col {
  text-align: left;
  padding-left: 0;
  padding-right: 1em;
}

.team-dots {
  padding: 3em 0;
}
.team-dots::before {
  right: 0;
  width: 100%;
}

.horizontal-tabs .tab-title-container {
  margin: 2em auto;
}
.horizontal-tabs .tab-title-container .tab {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 0.875em;
  text-align: center;
  padding: 0.25em 1em;
  transition: all 0.3s ease-in-out;
}
.horizontal-tabs .tab-title-container .tab:hover {
  background-color: #ecedef;
}
.horizontal-tabs .tab-title-container .tab.active-tab {
  background-color: #f0bd3d;
  color: #ffffff;
}

.invest-dots {
  margin-top: 3em;
}
.invest-dots.columns-wrap {
  flex-wrap: nowrap;
}
.invest-dots .third-col {
  flex-basis: 320px;
  flex-grow: 1;
}
.invest-dots .two-third-col {
  flex-basis: 640px;
  flex-grow: 1;
}
.invest-dots::before {
  right: 0;
  width: 90%;
}
.invest-dots .image-col {
  position: relative;
  min-height: 400px;
  top: -3em;
}
.invest-dots .text-col .invest-text-wrap {
  padding: 2em 0;
}
.invest-dots.invest-imageless .invest-text-wrap {
  padding: 2em 0;
  margin: 0 auto;
}

@media only screen and (max-width: 1250px) {
  .invest-dots::before {
    width: 97%;
  }
}
.gallery-col {
  position: relative;
}
.gallery-col .gallery-prev, .gallery-col .gallery-next {
  height: 2em;
  width: 2em;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  z-index: 1000;
  background-size: cover;
  background-position: center;
}
.gallery-col .gallery-prev {
  left: 0.5em;
  background-image: url("../images/left.svg");
}
.gallery-col .gallery-next {
  right: 0.5em;
  background-image: url("../images/right.svg");
}
.gallery-col .slick-dots {
  bottom: 2em;
}
.gallery-col .slick-dots li button {
  height: 16px;
  width: 16px;
  background-color: transparent;
  border: 2px solid #ffffff;
  border-radius: 50%;
}
.gallery-col .slick-dots li button::before {
  display: none !important;
}
.gallery-col .slick-dots li button:hover {
  background-color: rgba(240, 189, 61, 0.5);
}
.gallery-col .slick-dots li.slick-active button {
  background-color: #f0bd3d;
}
.gallery-col .slick-dotted.slick-slider {
  margin-bottom: 0;
}

.tax-filter-wrap {
  display: flex;
  justify-content: flex-start;
  margin-bottom: 1em;
  flex-wrap: wrap;
}
.tax-filter-wrap .term-wrap {
  margin-bottom: 1em;
}
.tax-filter-wrap .term {
  padding: 0.25em 0.5em;
  color: #5E676D;
  font-family: "Poppins", sans-serif;
  font-size: 0.875em;
  font-weight: 700;
  cursor: pointer;
  margin: 0 1em;
}
.tax-filter-wrap .term:hover {
  background-color: #ecedef;
}
.tax-filter-wrap .term.active-term {
  color: #ffffff;
  background-color: #f0bd3d;
}

.portfolio-wrap.columns-wrap {
  justify-content: flex-start;
}
.portfolio-wrap.columns-wrap .portfolio-tile {
  border: 1px solid #e5e6e8;
  position: relative;
  flex-basis: 24%;
  margin-bottom: 1%;
  margin-right: 1%;
  font-family: "Poppins", sans-serif;
  font-size: 0.875em;
  text-align: center;
  transition: all 0.3s ease-in-out;
}
.portfolio-wrap.columns-wrap .portfolio-tile .cat-terms {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 0.75em;
}
.portfolio-wrap.columns-wrap .portfolio-tile .cat-terms .pterm {
  display: none;
  padding: 0.25em;
  margin-left: 0.25em;
  background-color: #e5e6e8;
  color: #5E676D;
  font-weight: 700;
  transition: all 0.3s ease-in-out;
}
.portfolio-wrap.columns-wrap .portfolio-tile .cat-terms .pterm.exited {
  display: inline-block;
}
.portfolio-wrap.columns-wrap .portfolio-tile .logo-wrap {
  min-height: 9em;
  padding: 2em 0 1em;
  display: flex;
  align-items: center;
  justify-content: center;
}
.portfolio-wrap.columns-wrap .portfolio-tile .logo-wrap .port-logo {
  max-width: 90%;
  max-height: 5em;
  transition: opacity 250ms ease-in-out;
}
.portfolio-wrap.columns-wrap .portfolio-tile .logo-wrap .port-logo.alt-logo {
  position: absolute;
  opacity: 1;
}
.portfolio-wrap.columns-wrap .portfolio-tile .port-content {
  padding: 0 0.5em;
}
.portfolio-wrap.columns-wrap .portfolio-tile .port-name {
  margin-bottom: 0;
}
.portfolio-wrap.columns-wrap .portfolio-tile .port-loc {
  font-size: 0.875em;
  margin-bottom: 2em;
}
.portfolio-wrap.columns-wrap .portfolio-tile:hover {
  border-color: #f0bd3d;
}
.portfolio-wrap.columns-wrap .portfolio-tile:hover .cat-terms .pterm {
  background-color: #f0bd3d;
  color: #ffffff;
}
.portfolio-wrap.columns-wrap .portfolio-tile:hover .colorized .port-logo {
  opacity: 0;
}
.portfolio-wrap.columns-wrap .portfolio-tile:hover .colorized .port-logo.alt-logo {
  opacity: 1;
}
.portfolio-wrap.columns-wrap .portfolio-tile.no-link {
  cursor: default;
}
.portfolio-wrap.columns-wrap .portfolio-tile.no-link:hover {
  border-color: #e5e6e8;
}
.portfolio-wrap.columns-wrap .portfolio-tile.hidden {
  display: none;
}

.index-content-wrap {
  margin-top: 7em;
}

.content-row .blog-tile .half-col {
  min-height: 45vh;
}
.content-row .blog-tile .half-col.text-col {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.content-row.bi-lower-wrap {
  display: flex;
  justify-content: space-between;
  margin-bottom: 1em;
}

.columns-wrap.post-tiles-wrap {
  flex-basis: 75%;
  justify-content: flex-start;
}

.post-tile {
  padding: 0 3em 3em 0;
}
.post-tile p, .post-tile a {
  font-family: "Poppins", sans-serif;
  font-size: 0.75em;
}

.read-link {
  display: inline-block;
  color: #f0bd3d;
  font-weight: 700;
}

.blog-sidebar-wrap {
  flex-basis: 24%;
  display: flex;
  flex-direction: column;
  max-height: 34em;
}

.blog-filter-wrap {
  background-color: #ecedef;
  flex-grow: 1;
  padding: 1.5em;
  margin-bottom: 0.5em;
}
.blog-filter-wrap select {
  width: 100%;
  font-family: "Poppins", sans-serif;
  font-size: 0.75em;
  padding: 0.5em;
  border: 1px solid #e5e6e8;
  margin-bottom: 1em;
  color: #5E676D;
}
.blog-filter-wrap form {
  border-bottom: 1px solid #2bd2ca;
}
.blog-filter-wrap .topics-list {
  padding: 0;
  margin: 0;
}
.blog-filter-wrap .topics-list li {
  list-style: none;
}
.blog-filter-wrap .topics-list li .topic-link {
  color: #5E676D;
  font-family: "Poppins", sans-serif;
  font-size: 0.75em;
}
.blog-filter-wrap .topics-list li .topic-link::before {
  background-color: #5E676D;
  height: 1px;
}

.blog-signup-wrap {
  background-color: #ecedef;
  padding: 1.5em;
}
.blog-signup-wrap .mc-actual-form-wrap {
  display: flex;
  flex-wrap: wrap;
}
.blog-signup-wrap .mc-field-group {
  flex-basis: 50%;
  flex-grow: 1;
}
.blog-signup-wrap .submit-wrap {
  display: flex;
  flex-basis: auto;
}
.blog-signup-wrap input[type=email] {
  border: 1px solid #e5e6e8;
  font-family: "Poppins", sans-serif;
  padding: 0.5em;
  font-size: 0.75em;
  width: 100%;
  display: block;
}
.blog-signup-wrap input[type=submit] {
  padding: 0.5em;
  width: 2.25em;
  font-size: 0.75em;
}

/*********************
IMPORTING MODULES

*********************/
/****************************************************************
Here you got your tab styles.
Instructions on how to use the tab system are in the instructions.
The styles you see before you are the very most basic rules that
make the tabs functions. Otherwise the tabs are completely unstyled.
They are a blank slate to do with as you please.  It is a big responsibility.
Try not to make them look dumb.
********************************************************************/
.vertical-tabs {
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.vertical-tabs .tab-title-container {
  width: 50%;
}
.vertical-tabs .tab-content-window {
  width: 49%;
}
.vertical-tabs .tab-content {
  display: none;
}
.vertical-tabs .tab-content.active-content {
  display: block;
}

.horizontal-tabs {
  display: flex;
  flex-wrap: wrap;
}
.horizontal-tabs .tab-title-container {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.horizontal-tabs .tab-title-container .tab {
  cursor: pointer;
  border-radius: 20px;
  color: #1A3B4D !important;
  padding: 10px 30px;
}
.horizontal-tabs .tab-content-window {
  width: 100%;
}
.horizontal-tabs .tab-content {
  display: none;
}
.horizontal-tabs .tab-content.active-content {
  display: block;
}

/***********************************
Accordion styles go here. Knock yourself out.
Right now, it is set so that all accordion sections start closed.
Just modify that line below if you want a particular section to start open
************************************/
.accordion-content {
  display: none;
}

/****************************************
Aight this is your fancy new grid system.
Whiiiiiiiiiich is basically a flexbox. Instructions on how to use it are in the...instructions.
I will be adding addional gridding options in the near future.
Put any additional grid styles here!
****************************************/
.columns-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.two-third-col {
  flex-basis: 66.6%;
}

.half-col {
  flex-basis: 50%;
}

.third-col {
  flex-basis: 33.3%;
}

.quarter-col {
  flex-basis: 25%;
}

.fifth-col {
  flex-basis: 20%;
}

.sixth-col {
  flex-basis: 16.66%;
}

.image-col {
  background-size: cover;
  background-position: center;
}

.gallery-col {
  width: 50%;
}

.two-col-module {
  margin-bottom: 4em;
}
.two-col-module .text-col {
  padding: 2em 1em 2em 0;
}
.two-col-module .image-col {
  position: relative;
  transition: all 0.3s ease-in-out;
}
.two-col-module .image-col .overlay {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(38, 91, 122, 0.5);
}
.two-col-module .image-col .two-col-logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 50%;
  z-index: 5;
}
.two-col-module .image-col.image-col-link:hover {
  opacity: 0.7;
}
.two-col-module:nth-child(odd) .image-col {
  order: 1;
}
.two-col-module:nth-child(odd) .text-col {
  order: 2;
  padding: 2em 0 2em 1em;
}

.gall-two-col {
  display: block !important;
}
.gall-two-col .half-col {
  display: inline-block;
  width: 49%;
  vertical-align: middle;
}
.gall-two-col .half-col.text-col {
  display: inline-flex;
  flex-direction: column;
  padding: 2em 1em 2em 0 !important;
}

@media only screen and (max-width: 768px) {
  .half-col, .third-col, .two-third-col {
    flex-basis: 100%;
  }
  .quarter-col, .fifth-col, .sixth-col {
    flex-basis: 50%;
  }
  .two-col-module .text-col {
    padding: 2em 0.5em;
    order: 2;
  }
  .two-col-module .image-col {
    order: 1;
    padding-top: 50%;
  }
  .gall-two-col .half-col {
    width: 100%;
  }
}
@media only screen and (max-width: 481px) {
  .quarter-col, .fifth-col, .sixth-col {
    flex-basis: 100%;
  }
}
.section {
  position: relative;
}
.section .fill-left {
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
}
.section .fill-right {
  position: absolute;
  top: 0;
  right: 0;
  width: 50%;
  height: 100%;
}
.section .container {
  max-width: 1270px;
  display: flex;
  position: relative;
  margin: auto;
}
.section .container .row {
  display: flex;
  flex-direction: horizontal;
  width: 100%;
}
@media (max-width: 1000px) {
  .section .container .row {
    flex-direction: column;
  }
}
.section .container .row .col {
  display: block;
}
.section .container .row .col-6 {
  width: 50%;
}
@media (max-width: 1000px) {
  .section .container .row .col-6 {
    width: 100%;
  }
}
.section .container .row .col-4 {
  width: 33.33%;
}
@media (max-width: 1000px) {
  .section .container .row .col-4 {
    width: 100%;
  }
}
.section .container .row .col-8 {
  width: 66.66%;
}
@media (max-width: 1000px) {
  .section .container .row .col-8 {
    width: 100%;
  }
}

.mt30 {
  margin-top: 30px;
  display: inline-block;
}

.mt15 {
  margin-top: 15px;
  display: inline-block;
}

.mb0 {
  margin-bottom: 0;
}

.mb50 {
  margin-bottom: 50px;
}

.filllink {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
}

/******************************************************************
Button styles go here. Knock yourself out. I didn't make you a starter button. People are particular about their buttons.
I didn't want to step on your toes.  Maybe I'll add a starter button later.  It will be the best button.

Helpful Links:
http://galp.in/blog/2011/08/02/the-ui-guide-part-1-buttons/

******************************************************************/
.wpcf7 input[type=submit], .twitter-btn, .blue-btn, .yellow-btn {
  display: inline-block;
  padding: 0.5em 2em;
  font-weight: 700;
  font-family: "Poppins", sans-serif;
  font-size: 1em;
  transition: all 0.3s ease-in-out;
  color: #ffffff;
  border: none;
}

.yellow-btn {
  background-color: #f0bd3d;
  color: #ffffff !important;
}
.yellow-btn:hover {
  background-color: #2bd2ca;
  color: #ffffff;
}

.blue-btn {
  background-color: #295e7d;
}
.blue-btn:hover {
  background-color: #2bd2ca;
}

.sm-btn {
  padding: 0.5em;
  font-size: 0.875em;
}

.check-btn {
  background-image: url("../images/check.svg");
  background-size: 1em 1em;
  background-position: center;
  background-repeat: no-repeat;
}

.twitter-btn {
  background-color: #2bd2ca;
  color: #ffffff;
  padding-left: 3em;
  padding-right: 1em;
  position: relative;
}
.twitter-btn:hover {
  background-color: #295e7d;
  color: #ffffff;
}
.twitter-btn::before {
  content: "";
  background-image: url("../images/twitter-white.svg");
  background-size: contain;
  background-position: center;
  width: 1.25em;
  height: 1.25em;
  position: absolute;
  left: 1em;
  top: 0.55em;
}

/******************************************************************
Forms!! The things wrought in css hell to ruin your life! Yaaaaaaay forms!
Go ahead and put your form styles here. Gooooooooooood luck!

******************************************************************/
.signup-wrap {
  text-align: left;
  position: relative;
  background-color: #1A3B4D;
  max-width: 100%;
  overflow: hidden;
}
.signup-wrap .gutters {
  max-width: 1200px;
  position: relative;
}
.signup-wrap .gutters .form-wrap {
  padding: 55px 0;
}
.signup-wrap .gutters .signup-bg {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 50%;
  display: flex;
  height: 125%;
  bottom: 0;
}
.signup-wrap .gutters .signup-bg img {
  width: auto;
  height: auto;
  max-width: initial;
}
.signup-wrap h3 {
  color: white;
}
.signup-wrap form {
  font-family: "Poppins", sans-serif;
  display: flex;
  justify-content: flex-start;
}
.signup-wrap form input[type=text], .signup-wrap form input[type=email] {
  border: none;
  margin: 0;
  background-color: #ffffff;
  color: #5E676D;
  padding: 9px;
  font-size: 0.875em;
}
.signup-wrap form .mc-inputs-wrap {
  display: flex;
  justify-content: left;
  z-index: 10;
}

div.start-convo-wrap {
  margin-bottom: 1em;
  border-top: 1px solid #e5e6e8;
  padding-top: 4em;
}
div.start-convo-wrap .text-col:first-child {
  padding: 0 1em;
}
div.start-convo-wrap .supertitle {
  margin-top: 0;
}
div.start-convo-wrap .contact-deets-wrap {
  font-family: "Poppins", sans-serif;
}
div.start-convo-wrap .contact-deets-wrap p {
  font-size: 0.875em;
}
div.start-convo-wrap .contact-deets-wrap h6 {
  margin: 0;
}

.wpcf7 {
  background-color: #ecedef;
  font-family: "Poppins", sans-serif;
}
.wpcf7 form {
  padding: 1em 2em;
}
.wpcf7 form > p {
  margin-bottom: 0;
}
.wpcf7 h6 {
  margin-bottom: 1em;
}
.wpcf7 input, .wpcf7 textarea {
  width: 100%;
  border: 1px solid #9F187D;
  border-radius: 20px;
  color: #5E676D;
  margin-bottom: 1em;
  padding: 0.5em;
  font-size: 0.75em;
  font-weight: 700;
  padding: 10px;
}
.wpcf7 input::placeholder, .wpcf7 textarea::placeholder {
  color: #e5e6e8;
}
.wpcf7 input[type=submit] {
  background-color: #f0bd3d;
  width: auto;
  font-size: 0.875em;
}
.wpcf7 input[type=submit]:hover {
  background-color: #2bd2ca;
  color: #ffffff;
}
.wpcf7 div.wpcf7-validation-errors, .wpcf7 div.wpcf7-acceptance-missing, .wpcf7 div.wpcf7-response-output, .wpcf7 div.wpcf7-mail-sent-ng, .wpcf7 div.wpcf7-aborted {
  border: none !important;
  padding: 0;
  margin: 1em 0;
}
.wpcf7 span.wpcf7-not-valid-tip {
  font-size: 0.75em;
}

input, textarea {
  width: 100%;
  border: 1px solid #9F187D;
  border-radius: 20px;
  color: #5E676D;
  margin-bottom: 1em;
  padding: 0.5em;
  font-size: 0.75em;
  font-weight: 700;
  padding: 10px;
}
input::placeholder, textarea::placeholder {
  color: #e5e6e8;
}

input.has-submit {
  border-radius: 20px 0 0 20px;
}

.btn.input-submit {
  border-radius: 0 20px 20px 0;
}

.single-title, .page-title, .entry-title {
  margin: 0;
}

.single-title {
  color: #295e7d;
  font-size: 3em;
}

.post-wrapper {
  margin-top: 12em;
}

/* post meta */
.byline {
  color: #5E676D;
  margin: 0 0 2em;
  font-size: 0.75em;
  font-family: "Poppins", sans-serif;
}
.byline a {
  color: #f0bd3d;
}

.single-post .top-wrapper {
  position: relative;
  background-color: white;
  top: -5px;
}

.post-col-wrap.columns-wrap {
  flex-wrap: nowrap;
}
.post-col-wrap .post-share-col {
  flex-basis: 6em;
  flex-grow: 1;
  padding-top: 1em;
}
.post-col-wrap .post-share-col .share-icon, .post-col-wrap .post-share-col .sd-social-icon .sd-content ul li[class*=share-] a.share-icon.sd-button {
  background: transparent !important;
  color: #5E676D !important;
  opacity: 0.5;
}
.post-col-wrap .post-share-col .share-icon:hover, .post-col-wrap .post-share-col .sd-social-icon .sd-content ul li[class*=share-] a.share-icon.sd-button:hover {
  opacity: 1;
}
.post-col-wrap .post-share-col .sd-social-icon .sd-content ul li {
  display: list-item;
}
.post-col-wrap .post-content-col {
  flex-grow: 1;
  padding: 0 1em;
}
.post-col-wrap .post-content-col .entry-content {
  margin-bottom: 1.5em;
}
.post-col-wrap .post-content-col .entry-content img {
  max-width: 100%;
  margin-bottom: 1.5em;
  height: auto;
}
.post-col-wrap .post-content-col .entry-content p:first-child {
  font-size: 1.5em;
}
.post-col-wrap .post-content-col .entry-content p {
  font-size: 1.125em;
}
.post-col-wrap .post-content-col .entry-content blockquote {
  float: left;
  width: 30%;
  border-top: 5px solid #2bd2ca;
  margin: 0.5em 4em 0 0;
  font-size: 1.25em;
  font-family: "Poppins", sans-serif;
  padding-top: 0.5em;
}
.post-col-wrap .post-content-col .entry-content h1, .post-col-wrap .post-content-col .entry-content h2, .post-col-wrap .post-content-col .entry-content h3 {
  text-align: left;
}
.post-col-wrap .post-content-col .article-footer {
  border-top: 1px solid #5E676D;
  padding: 2.5em 0 1em;
}
.post-col-wrap .post-content-col .article-footer p {
  font-family: "Poppins", sans-serif;
  font-size: 0.75em;
}
.post-col-wrap .post-content-col .author-headshot {
  float: left;
  max-width: 150px;
  height: auto;
  margin: 0 1.5em 1.5em 0;
}
.post-col-wrap .related-post-col {
  flex-basis: 200px;
}
.post-col-wrap .related-post-col .rp-header {
  border-top: 2px solid #2bd2ca;
  padding-top: 0.5em;
}
.post-col-wrap .related-post-col .rp-title {
  margin: 1em 0 0 0;
  font-size: 0.875em;
  display: inline-block;
}
.post-col-wrap .related-post-col .rp-excerpt {
  font-family: "Poppins", sans-serif;
  font-size: 0.75em;
}
.post-col-wrap .related-post-col .rp-excerpt p {
  margin-bottom: 0.2em;
}
.post-col-wrap .related-post-col .rp-link {
  display: inline-block;
  font-family: "Poppins", sans-serif;
  font-size: 0.875em;
  color: #f0bd3d;
  transition: all 0.3s ease-in-out;
}
.post-col-wrap .related-post-col .rp-link:hover {
  color: #295e7d;
}

body > .sd-block, body > .sticky-wrapper > .sd-block {
  display: none;
}

.wp-caption {
  max-width: 100%;
  background: #eee;
  padding: 5px;
  /* images inside wp-caption */
}
.wp-caption img {
  max-width: 100%;
  margin-bottom: 0;
  width: 100%;
}
.wp-caption p.wp-caption-text {
  font-size: 0.85em;
  margin: 4px 0 7px;
  text-align: left;
}

/* end .wp-caption */
.tags {
  margin: 0;
}

/******************************************************************
COMMENT STYLES

I dunno who would want comments on their page, but if you really really really want comments, I suppose you can style them here.
I left you the default styling from Bones.
******************************************************************/
/* h3 comment title */
#comments-title {
  padding: 0.75em;
  margin: 0;
  border-top: 1px solid #ecedef;
  /* number of comments span */
}
.commentlist {
  margin: 0;
  list-style-type: none;
}

.comment {
  position: relative;
  clear: both;
  overflow: hidden;
  padding: 1.5em;
  border-bottom: 1px solid #ecedef;
  /* vcard */
  /* end .commentlist .vcard */
  /* end children */
  /* general comment classes */
}
.comment .comment-author {
  padding: 7px;
  border: 0;
}
.comment .vcard {
  margin-left: 50px;
}
.comment .vcard cite.fn {
  font-weight: 700;
  font-style: normal;
}
.comment .vcard time {
  display: block;
  font-size: 0.9em;
  font-style: italic;
}
.comment .vcard time a {
  color: #ecedef;
  text-decoration: none;
}
.comment .vcard time a:hover {
  text-decoration: underline;
}
.comment .vcard .avatar {
  position: absolute;
  left: 16px;
  border-radius: 50%;
}
.comment:last-child {
  margin-bottom: 0;
}
.comment .children {
  margin: 0;
  /* variations */
  /* change number for different depth */
}
.comment[class*=depth-] {
  margin-top: 1.1em;
}
.comment.depth-1 {
  margin-left: 0;
  margin-top: 0;
}
.comment:not(.depth-1) {
  margin-top: 0;
  margin-left: 7px;
  padding: 7px;
}
.comment.odd {
  background-color: #ffffff;
}
.comment.even {
  background: #ecedef;
}
/* comment meta */
/* comment content */
.comment_content p {
  margin: 0.7335em 0 1.5em;
  font-size: 1em;
  line-height: 1.5em;
}

/* end .commentlist .comment_content */
/* comment reply link */
.comment-reply-link {
  font-size: 0.9em;
  float: right;
} /* end .commentlist .comment-reply-link */
/* edit comment link */
.comment-edit-link {
  font-style: italic;
  margin: 0 7px;
  text-decoration: none;
  font-size: 0.9em;
}

/******************************************************************
COMMENT FORM STYLES
******************************************************************/
.comment-respond {
  padding: 1.5em;
  border-top: 1px solid #ecedef;
}

#reply-title {
  margin: 0;
}

.logged-in-as {
  color: #ecedef;
  font-style: italic;
  margin: 0;
}
.logged-in-as a {
  color: #000000;
}

.comment-form-comment {
  margin: 1.5em 0 0.75em;
}

.form-allowed-tags {
  padding: 1.5em;
  background-color: #ecedef;
  font-size: 0.9em;
}

/* comment submit button */
#submit {
  float: right;
  font-size: 1em;
}

/* comment form title */
#comment-form-title {
  margin: 0 0 1.1em;
}

/* cancel comment reply link */
/* logged in comments */
/* allowed tags */
#allowed_tags {
  margin: 1.5em 10px 0.7335em 0;
}

/* no comments */
.nocomments {
  margin: 0 20px 1.1em;
}

/*********************
FOOTER STYLES
*********************/
footer {
  clear: both;
}
footer .upper-footer {
  background-color: #285F7D;
  color: white;
  padding: 30px 0;
  width: 100%;
}
footer .upper-footer .container {
  max-width: 1200px;
  margin: auto;
  display: block;
  display: flex;
  flex-direction: row;
}
@media (max-width: 1000px) {
  footer .upper-footer .container {
    flex-direction: column;
  }
}
footer .upper-footer .container .left-info {
  width: 20%;
  position: relative;
}
footer .upper-footer .container .left-info .footer-tagline {
  text-align: center;
}
@media (max-width: 1000px) {
  footer .upper-footer .container .left-info {
    width: 80%;
    margin: auto;
    display: block;
    position: relative;
  }
  footer .upper-footer .container .left-info .footer-logo {
    margin: auto;
  }
  footer .upper-footer .container .left-info .footer-logo img {
    margin: auto;
    display: block;
  }
}
footer .upper-footer .container .right-info {
  padding-top: 25px;
  width: 80%;
  position: relative;
}
@media (max-width: 1000px) {
  footer .upper-footer .container .right-info {
    width: 100%;
  }
}
footer .lower-footer {
  background-color: #D9D9D9;
  font-size: 15px;
  padding: 20px 0 10px;
}
footer .lower-footer .copy-text p {
  margin-bottom: 0;
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  color: #ffffff;
  font-size: 0.875em;
}
footer .lower-footer .footer-links {
  font-family: "Poppins", sans-serif;
}
footer .lower-footer .footer-links #menu-footer-menu {
  display: flex;
  justify-content: center;
  padding-left: 0;
}
footer .lower-footer .footer-links #menu-footer-menu li {
  padding: 0 0.5em;
  list-style: none;
}
footer .lower-footer .footer-links #menu-footer-menu li a {
  color: #1A3B4D;
  font-weight: 400;
  font-size: 0.875em;
  padding: 0;
}
footer .lower-footer .footer-links #menu-footer-menu li a:hover {
  color: #f0bd3d;
}
footer .lower-footer .disclaimer-wrap {
  margin-top: 1em;
}
footer .lower-footer .disclaimer-wrap p {
  font-family: "Poppins", sans-serif;
  color: #808E96;
  font-size: 0.75em;
  margin-bottom: 0;
}

nav.footer .mega-footer-links a {
  color: white;
}
nav.footer .mega-footer-links ul {
  -moz-column-count: 3;
  -moz-column-gap: 20px;
  -webkit-column-count: 3;
  -webkit-column-gap: 20px;
  column-count: 3;
  column-gap: 20px;
}
@media (max-width: 1000px) {
  nav.footer .mega-footer-links ul {
    column-count: 1;
    max-width: 100%;
    overflow: hidden;
  }
}
nav.footer .mega-footer-links ul li.menu-item {
  display: flex;
  flex-direction: row;
  padding: 0;
  margin-bottom: 0;
}
@media (max-width: 1000px) {
  nav.footer .mega-footer-links ul li.menu-item {
    flex-direction: column;
  }
}
nav.footer .mega-footer-links ul li.menu-item > a {
  font-weight: bold;
}
nav.footer .mega-footer-links ul li.menu-item > a:before {
  display: none;
}
nav.footer .mega-footer-links ul li.menu-item ul.sub-menu {
  display: flex;
  flex-direction: column;
  max-height: unset;
  position: relative;
  opacity: 1;
  background-color: transparent;
  padding: 0;
  left: -70px;
  top: 40px;
  list-style: disc;
}
@media (max-width: 1000px) {
  nav.footer .mega-footer-links ul li.menu-item ul.sub-menu {
    flex-direction: column;
    top: -10px;
    left: 20px;
  }
}
nav.footer .mega-footer-links ul li.menu-item ul.sub-menu li {
  margin-left: 18px;
  font-weight: normal;
  margin-top: 5px;
  padding: 0;
  margin-bottom: 0;
  display: list-item;
}
nav.footer .mega-footer-links ul li.menu-item ul.sub-menu li a {
  color: white;
  padding: 0;
  font-weight: normal;
  white-space: normal;
}
nav.footer .mega-footer-links ul li.menu-item ul.sub-menu li a:before {
  display: none;
}

header.header {
  background-color: #ffffff;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
  transition: all 0.3s ease-in-out;
  box-shadow: 0 1px 5px #e5e6e8;
}
header.header #inner-header {
  display: flex;
  justify-content: end;
  align-items: center;
  padding: 1em 50px;
  max-width: 1270px;
  position: relative;
  min-height: 100px;
}
header.header #inner-header .logo-wrap {
  display: inline-block;
  position: absolute;
  left: 50px;
  top: 0;
}
header.header #inner-header .logo-wrap .logo-img {
  height: 80px;
  position: relative;
  top: 10px;
  width: auto;
  transition: 0.5s;
}
header.header #inner-header .logo-wrap .dark-logo {
  display: inline-block;
}
header.header #inner-header .logo-wrap .light-logo {
  display: none;
}
header.header #inner-header nav {
  flex-basis: 45%;
}
header.header #inner-header #menu-header-menu {
  display: flex;
  justify-content: space-between;
}
header.header #inner-header #menu-header-menu::before, header.header #inner-header #menu-header-menu::after {
  display: none;
}
header.header #inner-header #menu-header-menu li {
  display: inline-block;
}
header.header #inner-header #menu-header-menu li .slinky-line::before {
  background-color: #295e7d;
}
header.header #inner-header #menu-header-menu li a {
  padding: 0.5em 0;
}
header.header #inner-header #menu-header-menu li a .h4 {
  transition: all 0.3s ease-in-out;
}
header.header #inner-header .menu-icon {
  display: none;
  background-image: url("../images/menu_dark.svg");
  background-size: cover;
  background-position: center;
  cursor: pointer;
  height: 2em;
  width: 2em;
}
header.header.is-clear {
  background-color: white;
  box-shadow: none;
}
header.header.is-clear .logo-wrap.is-home {
  position: absolute;
  background-color: white;
  top: 0;
  left: 0;
  height: 200px !important;
  width: 340px !important;
}
@media (max-width: 700px) {
  header.header.is-clear .logo-wrap.is-home {
    width: auto !important;
    height: 90px !important;
    padding: 0 0 15px 0;
  }
}
header.header.is-clear .logo-wrap.is-home .logo-img {
  width: 100% !important;
  height: auto !important;
  padding: 25px;
}
@media (max-width: 700px) {
  header.header.is-clear .logo-wrap.is-home .logo-img {
    width: auto !important;
    height: 90px !important;
    padding: 0 0 15px 0;
  }
}
header.header.is-clear .logo-wrap.is-home .logo-img.dark-logo {
  display: inline-block;
}
header.header.is-clear .logo-wrap.is-home .logo-img.light-logo {
  display: inline-block;
}
header.header.is-clear #inner-header #menu-header-menu li .slinky-line::before {
  background-color: #ffffff;
}
.is-sticky header.header {
  background-color: #ffffff;
}
.is-sticky header.header #inner-header .dark-logo {
  display: inline-block;
}
.is-sticky header.header #inner-header .light-logo {
  display: none;
}
.is-sticky header.header #inner-header #menu-header-menu li .slinky-line::before {
  background-color: #295e7d;
}
.is-sticky header.header #inner-header #menu-header-menu li a .h4 {
  color: #295e7d;
}
.is-sticky header.header #inner-header .menu-icon {
  background-image: url("../images/menu_dark.svg");
}

nav li.menu-item {
  position: relative;
}
nav li.menu-item a {
  position: relative;
}
nav li.menu-item a:before {
  position: absolute;
  top: 85%;
  height: 5px;
  width: 0%;
  left: 0;
  content: "";
  background-color: #FBCC2B;
  transition: 0.5s;
  z-index: 101;
}
nav li.menu-item .slinky-line:before, nav li.menu-item .slinky-line:after {
  display: none;
}
nav li.menu-item a:hover {
  position: relative;
}
nav li.menu-item a:hover:before {
  width: 100%;
}
nav li.menu-item .sub-menu {
  position: absolute;
  left: -20px;
  top: 100%;
  padding-left: 0;
  background-color: white;
  padding: 20px;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: 0.5s opacity;
  z-index: 100;
}
nav li.menu-item .sub-menu a {
  white-space: nowrap;
}
nav li.menu-item:hover .sub-menu {
  max-height: 800px;
  opacity: 1;
}

nav > ul > li.menu-item.current-menu-item > a {
  position: relative;
}
nav > ul > li.menu-item.current-menu-item > a:before {
  width: 100%;
}

.hero-wrap {
  height: 75vh;
  max-height: 500px;
  position: relative;
  background-size: cover;
  background-position: center;
  width: 100%;
  display: flex;
  align-items: center;
  padding-top: 8em;
}
.hero-wrap .hero-overlay {
  background: rgba(26, 59, 77, 0.61);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.hero-wrap .hero-parallax {
  position: absolute;
  z-index: 10;
  background-size: contain;
  background-position: right 50%;
  background-repeat: no-repeat;
}
.hero-wrap .hero-text-wrap {
  position: relative;
  z-index: 20;
  max-width: 1270px;
  width: 100%;
}
.hero-wrap .hero-text-wrap .hero-text {
  flex-basis: 100%;
  margin: 0;
}
.hero-wrap .hero-text-wrap .hero-text.excerpt {
  max-width: 550px;
  font-size: 1.25em;
}
.hero-wrap .hero-text-wrap h1.hero-text {
  margin-bottom: 15px;
}
.hero-wrap .hero-text-wrap.casestudy h3.category {
  margin: 0 !important;
}
.hero-wrap .hero-text-wrap.profile {
  max-height: 350px;
}
.hero-wrap .hero-text-wrap .left-bit {
  text-align: left;
}
.hero-wrap .hero-text-wrap .right-bit {
  text-align: left;
}

/*********************
All Breakpoint Styles - These apply to ALL breakpoints unless over-ridden
*********************/
/******************************************************************
Site Name:
Author:

Stylesheet: Desktop Stylesheet

General Styles that apply to all pages and all breakpoints unless over-ridden by another breakpoint partial.

IF YOUR RULE APPLIES TO MORE THAN ONE PAGE IT GOES HERE.

IF YOUR RULE ONLY APPLIES TO ONE PAGE, PUT IT IN THE PAGE SPECIFIC PARTIAL.

******************************************************************/
/*********************
GENERAL STYLES
*********************/
body {
  font-family: "Lora", serif;
  font-size: 100%;
  line-height: 1.5;
  color: #000000;
  background-color: #ffffff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.light-text p, .light-text h1, .light-text .h1, .light-text h2, .light-text .h2, .light-text h3, .light-text .h3, .light-text h4, .light-text .h4, .light-text h5, .light-text .h5, .light-text li {
  color: #ffffff;
}
.light-text a {
  color: #e5e6e8;
}
.light-text a:hover {
  color: #f0bd3d;
}
.light-text a.yellow-btn:hover {
  color: #ffffff;
}

.blue {
  color: #295e7d;
}

.slate {
  color: #374d5a;
}

.gray {
  color: #5E676D;
}

.yellow {
  color: #f0bd3d;
}

.dark-pattern-bg {
  background-image: url("../images/dark-pattern-bg.png");
}

.light-pattern-bg {
  background-image: url("../images/light-pattern-bg.png");
}

.bg-grey {
  background-color: #D9D9D9;
}

/********************************************************************
GUTTERS
*********************************************************************/
.gutters {
  max-width: 1200px;
  position: relative;
  margin: 0 auto;
  padding-left: 50px;
  padding-right: 50px;
}
@media (max-width: 700px) {
  .gutters {
    padding-left: 25px;
    padding-right: 25px;
  }
}

.left-gutters {
  max-width: 480px;
  width: 90%;
  margin: 0 0 0 auto;
}

.third-gutters {
  max-width: 320px;
  width: 85.7%;
  margin: 0 0 0 auto;
  display: inline-block;
}

.two-third-gutters {
  max-width: 640px;
  width: 92.3%;
  margin: 0 auto 0 0;
  display: inline-block;
}

.content-wrap {
  margin-top: 4em;
}

.content-row {
  margin-bottom: 6em;
}

/*********************
LINK STYLES
*********************/
a {
  text-decoration: none;
  color: #374d5a;
  transition: all 0.3s ease-in-out 0s;
}
a:hover {
  color: #295e7d;
}
a.no-dec {
  color: inherit;
}
a.no-dec:hover {
  color: inherit;
  text-decoration: underline;
}

.two-col-module a:not(.btn) {
  color: #f0bd3d;
  font-family: "Poppins", sans-serif;
  font-size: 0.875em;
  font-weight: 700;
}
.two-col-module a:not(.btn):hover {
  color: #374d5a;
}

.slinky-line {
  position: relative;
}
.slinky-line::before {
  content: "";
  position: absolute;
  width: 0;
  height: 2px;
  bottom: -2px;
  left: 0;
  visibility: hidden;
  transition: all 0.3s ease-in-out 0s;
}
.slinky-line:hover::before {
  visibility: visible;
  width: 100%;
}

.full-dots, .sixty-dots, .ninety-dots, .half-dots, .team-dots, .invest-dots {
  position: relative;
}
.full-dots::before, .sixty-dots::before, .ninety-dots::before, .half-dots::before, .team-dots::before, .invest-dots::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 1;
  background-image: url("../images/dots-bg.png");
  background-position: right top;
  background-repeat: repeat;
}
.full-dots > div, .sixty-dots > div, .ninety-dots > div, .half-dots > div, .team-dots > div, .invest-dots > div {
  position: relative;
  z-index: 3;
}

.half-dots {
  padding: 3em 0;
}
.half-dots::before {
  left: 0;
  width: 50%;
}

.ninety-dots::before {
  left: 0;
  width: 90%;
}

.sixty-dots::before {
  right: 0;
  width: 60%;
}

.full-dots::before {
  left: 0;
  right: 0;
  width: 100%;
}

/****************************************************************
PARAGRAPH STYLES
******************************************************************/
p {
  margin: 0 0 1em;
  color: #5E676D;
  font-size: 1.125em;
  /* cleaning up the ragged lines and breaks
  -webkit-hyphens: auto;
     -moz-hyphens: auto;
          hyphens: auto;
  // sets a minimum number of characters before and after the break
  -webkit-hyphenate-before: 2;
   -webkit-hyphenate-after: 3;
           hyphenate-lines: 3;
  // enabling fancy ligatures when available
  -webkit-font-feature-settings: "liga", "dlig";
   -moz-font-feature-settings: "liga=1, dlig=1";
      -ms-font-feature-settings: "liga", "dlig";
       -o-font-feature-settings: "liga", "dlig";
          font-feature-settings: "liga", "dlig";*/
}

/******************************************************************
HEADING STYLES
******************************************************************/
a, h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  text-rendering: optimizelegibility;
  font-weight: 200;
  font-family: "Poppins", sans-serif;
}

h1, .h1 {
  font-size: 53px;
  line-height: 65px;
  font-weight: bold;
}

h2, .h2 {
  font-size: 30px;
  line-height: 45px;
  font-weight: bold;
}

h3, .h3 {
  font-size: 20px;
  line-height: 30px;
  color: #000;
  font-weight: bold;
}

.back-darkblue h3, .back-darkblue .h3, .back-darkblue p {
  color: white;
}

h4, .h4 {
  font-size: 16px;
  font-weight: 700;
}

h5, .h5 {
  font-size: 0.875em;
  font-weight: 700;
  text-transform: uppercase;
  color: #295e7d;
  letter-spacing: 0.125em;
}

h6, .h6 {
  font-size: 0.875em;
  font-weight: 700;
  margin: 0.5em 0;
}

.subtitle {
  text-align: left;
  font-size: 2em;
}

.supertitle {
  margin-bottom: 0;
}

p {
  color: black;
}

li {
  margin-bottom: 10px;
}

/*********************
NAVIGATION STYLES
*********************/
/*
all navs have a .nav class applied via
the wp_menu function; this is so we can
easily write one group of styles for
the navs on the site so our css is cleaner
and more scalable.
*/
.nav {
  border-bottom: 0;
  margin: 0;
}
.nav li a {
  display: block;
  padding: 0.75em;
}

blockquote, blockquote p {
  font-weight: bold;
}

/*********************
IMAGES
*********************/
img {
  max-width: 100%;
}
img.alignright {
  float: right;
  margin-left: 1.5em;
}
img.alignleft {
  float: left;
  margin-right: 1.5em;
}
img.aligncenter {
  display: block;
  margin: 0 auto;
}
img.alignnone {
  display: block;
}

.icon {
  width: 2em;
  height: 2em;
  background-position: center;
  background-size: contain;
  cursor: pointer;
}
.icon.social-icon {
  margin: 0 0.5em;
  width: 1em;
  height: 1em;
}

/******************************************************************
PAGINATION STYLES
******************************************************************/
.pagination,
.wp-prev-next {
  margin: 1.5em 0;
  font-family: "Poppins", sans-serif;
  font-size: 0.75em;
  font-weight: 700;
}

.pagination {
  text-align: left;
}
.pagination ul {
  display: inline-block;
  white-space: nowrap;
  padding: 0;
}
.pagination li {
  padding: 0;
  margin: 0;
  display: inline-block;
  list-style: none;
}
.pagination a.page-numbers, .pagination span.page-numbers {
  margin: 0;
  text-decoration: none;
  padding: 0;
  line-height: 1em;
  font-weight: 700;
  padding: 0.75em;
  min-width: 1em;
  display: inline-block;
  color: #374d5a;
}
.pagination a.page-numbers:hover, .pagination a.page-numbers:focus, .pagination span.page-numbers:hover, .pagination span.page-numbers:focus {
  background-color: #295e7d;
  color: #ffffff;
}
.pagination a.page-numbers.current, .pagination span.page-numbers.current {
  cursor: default;
  color: #f0bd3d;
}
.pagination a.page-numbers.current:hover, .pagination a.page-numbers.current:focus, .pagination span.page-numbers.current:hover, .pagination span.page-numbers.current:focus {
  background-color: #ecedef;
}
.pagination .pagi-left, .pagination .pagi-right {
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  width: 0.75em;
  height: 0.75em;
  display: inline-block;
}
.pagination .pagi-left {
  background-image: url("../images/left-gray.svg");
}
.pagination .pagi-right {
  background-image: url("../images/right-gray.svg");
}

/* end .coyote_page_navi */
/* fallback previous & next links */
.wp-prev-next .prev-link {
  float: left;
}
.wp-prev-next .next-link {
  float: right;
}

/* end .wp-prev-next */
main {
  margin-top: 0 !important;
}

/* mobile menu close */
.menu-icon {
  opacity: 1;
  transition: 0.25s;
}
.menu-icon:before, .menu-icon:after {
  opacity: 0;
  transition: 0.25s;
}

#check-menu-icon:checked + label .menu-icon {
  background-image: unset;
}
#check-menu-icon:checked + label .menu-icon:before, #check-menu-icon:checked + label .menu-icon:after {
  content: "";
  height: 25px;
  width: 4px;
  display: block;
  background-color: #1A3B4D;
  position: absolute;
  transform: rotate(45deg);
  margin-left: 10px;
  opacity: 1;
}
#check-menu-icon:checked + label .menu-icon:after {
  transform: rotate(-45deg);
}

/*********************
1030 and DOWN
These styles apply to all widths 1030px and DOWN unless over-ridden
*********************/
@media only screen and (max-width: 1030px) {
  /******************************************************************
  Site Name:
  Author:

  Stylesheet: Desktop Stylsheet

  For styles 1030px wide and DOWN

  This sheet is for styles that you want to apply to...well...1030px and down.  I guess that was pretty self-explanatory.

  ******************************************************************/
  .post-tile.third-col {
    flex-basis: 50%;
  }
  header.header #inner-header {
    flex-wrap: wrap;
  }
  header.header #inner-header .logo-wrap {
    flex-basis: 40%;
    max-width: 40%;
  }
  header.header #inner-header .logo-wrap img {
    max-width: 100%;
  }
  header.header #inner-header .menu-icon {
    display: inline-block;
  }
  header.header #inner-header nav {
    flex-basis: 100%;
    display: none;
  }
  header.header #inner-header nav #menu-header-menu {
    flex-wrap: wrap;
  }
  header.header #inner-header nav #menu-header-menu li {
    flex-basis: 100%;
    text-align: right;
  }
  header nav {
    position: relative;
    top: 15px;
  }
  header nav li.menu-item .sub-menu {
    display: flex;
    position: relative;
    left: 0;
    top: 0;
    overflow: visible;
    opacity: 1;
    max-height: unset;
    flex-direction: column;
    padding-top: 10px;
    padding-bottom: 0;
  }
  header nav li.menu-item .sub-menu a span {
    font-weight: normal !important;
  }
  header nav li.menu-item .sub-menu:hover {
    max-height: unset;
  }
  header .nav li a {
    display: inline-block;
    padding: 0.75em;
  }
}
/*********************
768px and DOWN
These styles apply to all widths 768px and DOWN unless over-ridden
*********************/
@media only screen and (max-width: 768px) {
  /******************************************************************
  Site Name:
  Author:

  Stylesheet: 768px and DOWN.

  This sheet is for styles that you want to apply to...well...768px and down.  I guess that was pretty self-explanatory.
  iPad styles are going to live here.

  ******************************************************************/
  body {
    font-size: 0.875em;
  }
  h1, .h1 {
    font-size: 2.5em;
    line-height: 1.4em;
  }
  h2, .h2 {
    font-size: 1.75em;
    line-height: 1.4em;
  }
  .footer .upper-footer #footer-col-1 {
    order: 2;
    text-align: right;
  }
  .footer .upper-footer #footer-col-2 {
    order: 1;
  }
  .footer .upper-footer #footer-col-3 {
    order: 3;
  }
  .footer .upper-footer #footer-col-4 {
    order: 4;
  }
  .footer .lower-footer .half-col {
    text-align: left;
  }
  .footer .lower-footer .copy-text {
    margin-bottom: 0.5em;
  }
  .footer .lower-footer .footer-links #menu-footer-menu {
    justify-content: center;
  }
  .hero-wrap {
    padding-top: 3em;
    background-attachment: scroll;
  }
  .home-tiles-wrap .quarter-col {
    flex-basis: 49%;
    margin-bottom: 2%;
  }
  .home-who .text-col {
    padding: 0;
  }
  .home-who .image-col {
    min-height: 300px;
  }
  .home-blog .blog-tile .image-col {
    padding-top: 50%;
  }
  div.start-convo-wrap .contact-deets-wrap {
    display: none;
  }
  .tab-title-container {
    flex-wrap: wrap;
  }
  .tab-title-container .tab {
    flex-basis: 100%;
  }
  .invest-dots.columns-wrap {
    flex-wrap: wrap;
    margin-top: 0;
  }
  .invest-dots.columns-wrap:before {
    width: 100%;
  }
  .invest-dots.columns-wrap .image-col {
    min-height: 300px;
    top: auto;
  }
  .invest-dots.columns-wrap .third-col, .invest-dots.columns-wrap .two-third-col {
    flex-basis: 100%;
  }
  .invest-dots.columns-wrap .text-col .invest-text-wrap {
    padding: 2em;
  }
  .portfolio-wrap.columns-wrap .portfolio-tile {
    flex-basis: 32%;
  }
  .index-content-wrap {
    margin-top: 5em;
  }
  .content-row .blog-tile .half-col {
    min-height: 30vh;
  }
  .post-tile.third-col {
    flex-basis: 100%;
  }
  .post-col-wrap.columns-wrap {
    flex-wrap: wrap;
  }
  .post-col-wrap.columns-wrap .post-share-col {
    flex-basis: 5em;
    flex-grow: 0;
  }
  .post-col-wrap.columns-wrap .post-content-col {
    flex-basis: 50%;
    flex-grow: 1;
  }
  .post-col-wrap.columns-wrap .related-post-col {
    flex-basis: 100%;
    margin-top: 1em;
  }
}
/*********************
481 and DOWN
These styles apply to all widths 481px and DOWN unless over-ridden
*********************/
@media only screen and (max-width: 481px) {
  /******************************************************************
  Site Name:
  Author:

  Stylesheet: 481px and DOWN

  This sheet is for styles that you want to apply to...well...481px and down.  I guess that was pretty self-explanatory.

  ******************************************************************/
  h1, .h1 {
    font-size: 2.5em;
  }
  h2, .h2 {
    font-size: 1.75em;
  }
  .footer .upper-footer .footer-text, .footer .upper-footer .footer-social {
    text-align: left !important;
  }
  .footer .upper-footer #footer-col-1 {
    order: 1;
  }
  .footer .upper-footer #footer-col-2 {
    order: 2;
  }
  .footer .upper-footer #footer-col-3 {
    order: 3;
  }
  .footer .upper-footer #footer-col-4 {
    order: 4;
  }
  .home-tiles-wrap .quarter-col {
    flex-basis: 100%;
  }
  .team-row.columns-wrap {
    flex-wrap: wrap;
  }
  .team-row.columns-wrap .third-col {
    flex-basis: 100%;
    text-align: center;
  }
  .team-row.columns-wrap .third-col .third-gutters {
    max-width: 60%;
  }
  .team-row.columns-wrap .team-dots {
    padding: 1em;
  }
  .team-row.columns-wrap .two-third-col {
    flex-basis: 100%;
  }
  .team-row.columns-wrap .two-third-col .two-third-gutters {
    width: 100%;
    padding: 2em 1em 3em;
  }
  .team-row:nth-child(2n) .image-wrap {
    order: 0;
  }
  .portfolio-wrap.columns-wrap .portfolio-tile {
    flex-basis: 49%;
  }
  .index-content-wrap {
    margin-top: 3em;
  }
  .content-row.bi-lower-wrap {
    flex-wrap: wrap;
  }
  .content-row.bi-lower-wrap .post-tiles-wrap {
    flex-basis: 100%;
    order: 2;
  }
  .content-row.bi-lower-wrap .blog-sidebar-wrap {
    flex-basis: 100%;
    order: 1;
    margin-bottom: 4em;
  }
  .content-row.bi-lower-wrap .post-tile {
    padding: 0 0 2em 0;
  }
  .post-col-wrap.columns-wrap .single-title {
    font-size: 2.5em;
  }
  .post-col-wrap.columns-wrap .post-content-col {
    padding: 0;
  }
  .post-col-wrap.columns-wrap .post-content-col .author-headshot {
    max-width: 30%;
    height: auto;
    margin: 0 1em 1em 0;
  }
  .post-col-wrap.columns-wrap .post-content-col .entry-content blockquote {
    font-size: 1em;
  }
  .post-col-wrap.columns-wrap .related-post-col {
    order: 3;
  }
  .post-col-wrap.columns-wrap .post-share-col {
    flex-basis: 100%;
    order: 2;
  }
  .post-col-wrap.columns-wrap .post-share-col .sd-social-icon .sd-content ul li {
    display: inline-block;
  }
  .post-col-wrap.columns-wrap .post-share-col .sd-social-icon .sd-content ul li:first-child {
    padding-left: 0;
  }
}
/*********************
RETINA (2x RESOLUTION DEVICES)
This applies to the retina iPhone (4s) and iPad (2,3) along with
other displays with a 2x resolution. You can also create a media
query for retina AND a certain size if you want. Go Nuts.
*********************/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
  /******************************************************************
  Site Name: 
  Author: 

  Stylesheet: Retina Screens & Devices Stylesheet

  When handling retina screens you need to make adjustments, especially
  if you're not using font icons. Here you can add them in one neat
  place.

  ******************************************************************/
  /* 

  EXAMPLE 
  Let's say you have an image and you need to make sure it looks ok
  on retina screens. Let's say we have an icon which dimension are
  24px x 24px. In your regular stylesheets, it would look something
  like this:

  .icon {
  	width: 24px;
  	height: 24px;
  	background: url(img/test.png) no-repeat;
  }

  For retina screens, we have to make some adjustments, so that image
  doesn't look blurry. So, taking into account the image above and the
  dimensions, this is what we would put in our retina stylesheet:

  .icon {
  	background: url(img/test@2x.png) no-repeat;
  	background-size: 24px 24px;
  }

  So, you would create the same icon, but at double the resolution, meaning 
  it would be 48px x 48px. You'd name it the same, but with a @2x at the end
  (this is pretty standard practice). Set the background image so it matches
  the original dimensions and you are good to go. 

  */
}
/*********************
PRINT STYLESHEET
Feel free to customize this. Remember to add things that won't make
sense to print at the bottom. Things like nav, ads, and forms should
be set to display none.
*********************/
@media print {
  /******************************************************************
  Site Name:
  Author:

  Stylesheet: Print Stylesheet

  Stop killing trees!

  ******************************************************************/
  * {
    background: transparent !important;
    color: black !important;
    text-shadow: none !important;
    filter: none !important;
    -ms-filter: none !important;
  }
  a, a:visited {
    color: #444 !important;
    text-decoration: underline;
  }
  a:after, a:visited:after {
    content: " (" attr(href) ")";
  }
  a abbr[title]:after, a:visited abbr[title]:after {
    content: " (" attr(title) ")";
  }
  .ir a:after,
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: "";
  }
  pre, blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }
  thead {
    display: table-header-group;
  }
  tr, img {
    page-break-inside: avoid;
  }
  img {
    max-width: 100% !important;
  }
  @page {
    margin: 0.5cm;
  }
  p, h2, h3 {
    orphans: 3;
    widows: 3;
  }
  h2,
  h3 {
    page-break-after: avoid;
  }
  .sidebar,
  .page-navigation,
  .wp-prev-next,
  .respond-form,
  nav {
    display: none;
  }
}