@import "../vendor/fonts/open-sans/stylesheet.css";
@import url("https://fonts.googleapis.com/css?family=Open+Sans:800&display=swap");
/* =====================================================================
    typography - cfaf | source: ../_source/styles/base/_typography.scss
===================================================================== */
/* ----------------------------------------------------------------
    headings
---------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #f5f6fb;
  margin: 1.25em 0 0.313em;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
}
h1 em, h1 i, h2 em, h2 i, h3 em, h3 i, h4 em, h4 i, h5 em, h5 i, h6 em, h6 i {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
}
h1 strong, h1 b, h2 strong, h2 b, h3 strong, h3 b, h4 strong, h4 b, h5 strong, h5 b, h6 strong, h6 b {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
}

h4, h5, h6 {
  color: #312f61;
}

h1 {
  margin: 0;
}

h2 {
  color: #312f61;
  font-size: 2.0714285714em;
  margin-top: 0;
}

h3 {
  font-size: 1.7142857143em;
}

h4 {
  font-size: 1.5714285714em;
}

h5 {
  font-size: 1.3571428571em;
}

h6 {
  font-size: 1.1428571429em;
}

h2, h3 {
  background: #37498e;
  color: #f5f6fb;
  display: inline-block;
  font-size: 1.7142857143em;
  left: -28px;
  padding: 0.313em 0.9375em;
  position: relative;
  transform: skew(15deg);
}
h2 span, h3 span {
  display: block;
  transform: skew(-15deg);
}

p#info {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: 1.2857142857em;
}
p#info + p#info {
  margin-top: -10px;
  padding-top: 0;
}

/* --------------------------------------
    small screens:
    max-width 640px
-------------------------------------- */
@media only screen and (max-width: 40em) {
  h2, h3 {
    left: -45px;
    padding: 0.313em 1.5625em;
  }
}
/* ----------------------------------------------------------------
    paragraphs
---------------------------------------------------------------- */
/* --------------------------------------
	basic paragraphs
-------------------------------------- */
p {
  font-family: open_sanssemibold, Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 0.2px;
  color: #312f61;
  font-size: 1em;
  padding: 0.313em 0 0.625em;
  margin: 0 0 0.313em;
  text-rendering: auto;
}

.p-columns {
  -moz-column-count: 2;
  -webkit-column-count: 2;
  column-count: 2;
  -moz-column-gap: 40px;
  -webkit-column-gap: 40px;
  column-gap: 40px;
}

/* --------------------------------------
	strong and italicized text
-------------------------------------- */
strong, b {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 800;
}

em, i {
  font-family: open_sanssemibold, Helvetica, Arial, sans-serif;
  font-style: italic;
  font-weight: normal;
}

/* ----------------------------------------------------------------
    links
---------------------------------------------------------------- */
a {
  font-family: open_sanssemibold, Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 0.2px;
  color: #312f61;
  font-size: 1em;
  text-decoration: underline;
}
a:hover, a:visited:hover {
  color: rgb(116.3640167364, 20.6359832636, 25.2217573222);
}
a:link:focus, a:visited:focus {
  color: rgb(116.3640167364, 20.6359832636, 25.2217573222);
  outline: none;
}
a:visited {
  color: rgb(40.3229166667, 38.6770833333, 79.8229166667);
}
a:link:active, a:visited:active {
  color: rgb(116.3640167364, 20.6359832636, 25.2217573222);
}
a.current {
  color: rgb(116.3640167364, 20.6359832636, 25.2217573222);
  cursor: default !important;
  text-decoration: none !important;
}
a:not([href]) {
  color: #312f61;
  text-decoration: none;
}
a:not([href]):hover {
  color: #312f61;
  cursor: default;
  text-decoration: none;
}

strong a {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 800;
}

/* ----------------------------------------------------------------
    lists
---------------------------------------------------------------- */
ul, ol {
  font-family: open_sanssemibold, Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 0.2px;
  color: #312f61;
  font-size: 1em;
  margin: 0.625em 0 0.313em 1.875em;
}
ul li, ol li {
  padding: 0 0 0.625em;
  margin: 0;
}
ul ul, ul ol, ol ul, ol ol {
  margin-top: 0;
}
ul ul li, ul ol li, ol ul li, ol ol li {
  margin-top: 0;
  padding: 0.313em 0 0;
}
ul p, ol p {
  margin: 0;
  padding: 0;
}
ul img, ol img {
  margin: 0.625em 0;
}

dl.gallery-item {
  color: #312f61;
}

/* ----------------------------------------------------------------
    quotes
---------------------------------------------------------------- */
blockquote,
blockquote p {
  font-family: open_sanssemibold, Helvetica, Arial, sans-serif;
  font-style: italic;
  font-weight: normal;
  border-left: 1px solid #312f61;
  color: #312f61;
  margin: 0.9375em;
  padding-left: 1.25em;
}
blockquote p,
blockquote p p {
  border: none;
  margin: 0;
}

/* =====================================================================
    buttons - cfaf | source: ../_source/styles/base/_buttons.scss
===================================================================== */
/* ----------------------------------------------------------------
    buttons
---------------------------------------------------------------- */
button, a.button, .button {
  -webkit-border-radius: 2px 2px 2px 2px;
  -moz-border-radius: 2px 2px 2px 2px;
  border-radius: 2px 2px 2px 2px;
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 800;
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  background: #f0bb3c;
  border: 2px solid #37498e;
  color: #312f61;
  cursor: pointer;
  font-size: 14px;
  margin: 0.9375em 0.313em 0.9375em 0;
  padding: 0.625em 0.9375em !important;
  text-align: center;
  text-decoration: none !important;
  text-transform: uppercase;
}
button:hover, button:active, button:focus, a.button:hover, a.button:active, a.button:focus, .button:hover, .button:active, .button:focus {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  background: #cb242c;
  border-color: #37498e;
  color: #f5f6fb !important;
  cursor: pointer;
  outline: none;
}
button i, a.button i, .button i {
  padding-left: 0.625em;
}

.button + .button {
  margin-top: 0;
}

/* =====================================================================
    global styles - cfaf | source: ../_source/styles/base/_global.scss
===================================================================== */
/* ----------------------------------------------------------------
    general styles
---------------------------------------------------------------- */
html {
  -webkit-text-size-adjust: 100%;
} /* Prevent font scaling in landscape while allowing user zoom */
body {
  background: #37498e;
  margin: 0;
  padding: 0;
}

#skip {
  height: 1px;
  left: -9999px;
  position: absolute;
  overflow: hidden;
  top: auto;
  width: 1px;
}
#skip:focus {
  color: #f5f6fb;
  height: auto;
  position: static;
  width: auto;
  z-index: 20;
}

/* --------------------------------------
	clearing
-------------------------------------- */
.clear {
  clear: both;
}

.clearfix:before, .clearfix:after {
  content: "";
  display: table;
}
.clearfix:after {
  clear: both;
}

/* --------------------------------------
	remove firefox focus outlines
-------------------------------------- */
*:focus {
  -moz-outline-style: none;
  outline-color: -moz-use-text-color;
  outline-style: none;
  outline-width: 0;
}

/* --------------------------------------
	visibility
-------------------------------------- */
.hidden,
.hide,
hr {
  display: none;
  margin: 0 !important;
  visibility: hidden;
}

.visually-hide {
  height: 1px;
  left: -9999px;
  overflow: hidden;
  position: absolute;
}

a.visually-show .visually-hide {
  left: auto;
  position: relative;
}

/* ----------------------------------------------------------------
    content area
---------------------------------------------------------------- */
main {
  clear: both;
  position: relative;
  z-index: 2;
}

.filled-bg {
  background-color: #f5f6fb;
  background-image: url("../images/pattern1.png"), url("../images/pattern2.png");
  background-position: top left, bottom left;
  background-repeat: repeat-x;
  padding: 1.25em 0;
}

.content {
  margin: 0 auto;
  max-width: 1050px;
  padding: 50px 0;
}
.content h3:first-of-type {
  margin-top: 0;
}

.bg-pattern {
  background: url("../images/bg-pattern.png") no-repeat left top #f5f6fb;
  background-size: cover;
}

/* --------------------------------------
	images
-------------------------------------- */
.alignright {
  display: block;
  float: right;
  margin: 0.625em 0 0.625em 1.25em;
}

.alignleft {
  display: block;
  float: left;
  margin: 0.625em 1.25em 0.625em 0;
}

/* --------------------------------------
	alert
-------------------------------------- */
#alert {
  background: #f0bb3c;
}
#alert section {
  padding: 0.9375em 1.25em 1.5625em;
}
#alert p, #alert h5, #alert a:link, #alert a:visited {
  color: #312f61;
}
#alert h5 {
  margin-top: 0.9375em;
}

/* --------------------------------------
    small screens:
    max-width 640px
-------------------------------------- */
@media only screen and (max-width: 40em) {
  .alignright {
    float: none;
    margin: 0 auto 1.25em;
  }
}
/* ----------------------------------------------------------------
    homepage connect section
---------------------------------------------------------------- */
#connect {
  margin-bottom: 50px;
  margin-top: 0.625em;
}
#connect #eval-button {
  margin-top: 0;
}
#connect::after {
  clear: both;
  content: "";
  display: block;
}
#connect h3 {
  margin-top: 1.25em;
}

/* --------------------------------------
  mailchimp newsletter form
-------------------------------------- */
#mc_embed_signup .email {
  border: 2px solid #37498e;
  height: 40px;
  width: 90%;
}
#mc_embed_signup .email:focus {
  background: #f5f6fb;
}
#mc_embed_signup .button {
  height: 40px;
  margin: 0;
  padding: 0.625em 0.625em !important;
}

/* --------------------------------------
    small screens:
    max-width 640px
-------------------------------------- */
@media only screen and (max-width: 40em) {
  #mc_embed_signup .email {
    width: 100%;
  }
  #connect .columns {
    margin-bottom: 1.5625em;
  }
  #connect .columns:last-of-type {
    margin-bottom: 0;
  }
}
/* --------------------------------------
  social media icons
-------------------------------------- */
#social-icons a i {
  color: #37498e;
  font-size: 50px;
  margin-right: 10px;
  position: relative;
  top: -4px;
}
#social-icons a:hover i, #social-icons a:focus i {
  color: #312f61;
}

/* ----------------------------------------------------------------
    miscellaneous
---------------------------------------------------------------- */
.visually-hide {
  left: -9999px;
  position: absolute;
}

/* forms */
form label {
  font-family: open_sanssemibold, Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 0.2px;
  color: #312f61;
}

/* --------------------------------------
  blog
-------------------------------------- */
div.pcc-posts {
  margin-top: 1.25em;
}

div.pcc-posts dt {
  clear: both;
  font-size: 1.2em;
  line-height: 1.3;
}

div.pcc-posts dd {
  font-family: open_sanssemibold, Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 0.2px;
  color: #312f61 !important;
  margin-top: -5px;
}

div.pcc-posts dd.item-date {
  font-family: open_sanssemibold, Helvetica, Arial, sans-serif;
  font-style: italic;
  font-weight: normal;
  font-size: 0.8571428571em;
  margin: 0.625em 0 1.25em;
}

div.pcc-posts dt img {
  float: right;
  margin: 0 10px 20px 10px;
  width: 33%;
}

/* --------------------------------------
    small screens:
    max-width 640px
-------------------------------------- */
@media only screen and (max-width: 40em) {
  div.pcc-posts dt img {
    float: none;
    margin: 0 0 0.625em;
    width: 100%;
  }
}
/* --------------------------------------
	YouTube embedded videos
-------------------------------------- */
.youtube-container {
  height: 0;
  overflow: hidden;
  padding-bottom: 56.25%;
  padding-top: 30px;
  position: relative;
}
.youtube-container iframe,
.youtube-container object,
.youtube-container embed {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

/* =====================================================================
    header styles - cfaf | source: ../_source/styles/layout/_header.scss
===================================================================== */
/* ----------------------------------------------------------------
    archive notice
---------------------------------------------------------------- */
#archive-notice {
  background: #312f61;
  padding: 10px 30px;
  position: relative;
  z-index: 100;
}
#archive-notice p {
  font-family: open_sanssemibold, Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 0.2px;
  color: #fff;
  font-size: 0.9285714286em;
  margin: 0;
}
#archive-notice p a {
  color: #fff;
}
#archive-notice p a a:hover, #archive-notice p a a:focus {
  color: #f0bb3c;
}

/* ----------------------------------------------------------------
    logo, dancer
---------------------------------------------------------------- */
#header {
  background: url("../images/bg-pattern.png") no-repeat left top #f5f6fb;
  background-size: cover;
  overflow: hidden;
}
#header::after {
  clear: both;
  content: "";
  display: block;
}
#header #header-wrapper {
  height: 350px;
  margin: -70px auto 0;
  max-width: 1100px;
  position: relative;
}
#header #logo {
  position: absolute;
  right: 5px;
  top: 96px;
}
#header #dancer {
  background: url("../images/dancer.png") no-repeat center center rgba(0, 0, 0, 0);
  background-size: 240px;
  height: 330px;
  position: absolute;
  left: -80px;
  top: 20px;
  width: 240px;
  z-index: 2;
}

#header.homepage #header-wrapper {
  height: 592px;
}
#header.homepage #logo {
  right: 5px;
  top: 110px;
}
#header.homepage #dancer {
  background-size: 418px;
  height: 575px;
  left: 0;
  top: 17px;
  width: 418px;
}

/* ----------------------------------------------------------------
    media queries
---------------------------------------------------------------- */
/* -------------------------------------- 
    custom: medium screens
-------------------------------------- */
@media only screen and (min-width: 641px) and (max-width: 1099px) {
  #header #dancer {
    z-index: 5;
  }
  #header.homepage #dancer {
    left: -80px;
  }
  #header.homepage #logo {
    margin-top: 0;
    width: 70%;
  }
  #header #logo {
    margin-top: 20px;
    width: 80%;
  }
}
/* -------------------------------------- 
    custom: medium screens
-------------------------------------- */
@media only screen and (min-width: 641px) and (max-width: 1020px) {
  #header.homepage #header-wrapper {
    height: 475px;
  }
  #header.homepage #dancer {
    background-size: 291px;
    height: 400px;
    left: -40px;
    top: 75px;
    width: 291px;
  }
}
/* -------------------------------------- 
    custom: small/medium
-------------------------------------- */
@media only screen and (min-width: 641px) and (max-width: 840px) {
  #header:not(.homepage) #dancer {
    background-size: 204px;
    height: 280px;
    left: -50px;
    top: 75px;
    width: 204px;
  }
}
/* --------------------------------------
    small screens
-------------------------------------- */
@media only screen and (max-width: 640px) {
  #header.homepage #header-wrapper {
    height: 350px;
  }
  #header #dancer,
  #header.homepage #dancer {
    background-size: 204px;
    height: 280px;
    left: -10px;
    top: 75px;
    width: 204px;
  }
}
/* --------------------------------------
    custom: extra small screens
-------------------------------------- */
@media only screen and (max-width: 400px) {
  #header #dancer,
  #header.homepage #dancer {
    left: -80px;
  }
}
/* =====================================================================
    global navigation styles - cfaf | source: ../_source/styles/layout/_navigation.scss
===================================================================== */
/* -------------------------------------- 
    custom: large and medium screen styles 
-------------------------------------- */
@media only screen and (min-width: 1100px) {
  #top-border {
    background: rgba(55, 73, 142, 0.95);
    height: 70px;
    position: relative;
    top: -70px;
    width: 100%;
    z-index: 1;
  }
  #nav-wrapper .top-bar {
    background: none !important;
  }
}
#nav-wrapper {
  position: relative;
  top: 0;
  width: 100%;
  z-index: 4;
}
#nav-wrapper #nav {
  margin: 0 auto;
  max-width: 1100px;
}

#nav-wrapper .top-bar {
  background: rgba(55, 73, 142, 0.95);
  line-height: 70px;
  margin: 0 auto;
  max-width: 1100px;
  min-height: 70px;
}
#nav-wrapper .top-bar .title-area {
  height: 70px;
}
#nav-wrapper .top-bar .top-bar-section {
  display: inline-block;
  float: right;
  padding-left: 1.25em;
}
#nav-wrapper .top-bar .top-bar-section .has-dropdown > a:after, #nav-wrapper .top-bar .top-bar-section .has-dropdown > a {
  border: none;
  padding: 0 !important;
}
#nav-wrapper .top-bar .top-bar-section ul li {
  background: none;
  padding: 0;
}
#nav-wrapper .top-bar .top-bar-section ul li a, #nav-wrapper .top-bar .top-bar-section ul li a:not(.button) {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 800;
  background: none;
  color: #f5f6fb;
  font-size: 14px;
  line-height: 70px;
  padding: 0 1.25em !important;
  text-decoration: none;
  text-transform: uppercase;
}
#nav-wrapper .top-bar .top-bar-section ul li a:focus, #nav-wrapper .top-bar .top-bar-section ul li a:not(.button):focus {
  background: #f0bb3c;
  color: #312f61 !important;
  outline: none;
}
#nav-wrapper .top-bar .top-bar-section ul li:hover, #nav-wrapper .top-bar .top-bar-section ul li:focus {
  background: #f0bb3c;
}
#nav-wrapper .top-bar .top-bar-section ul li:hover a, #nav-wrapper .top-bar .top-bar-section ul li:focus a {
  color: #312f61;
  outline: none;
}
#nav-wrapper .top-bar .top-bar-section ul li ul {
  background: #f0bb3c;
  border-top: 1px solid #37498e;
  margin-top: -1px;
}
#nav-wrapper .top-bar .top-bar-section ul li ul li, #nav-wrapper .top-bar .top-bar-section ul li ul li {
  border-bottom: 1px solid #37498e;
}
#nav-wrapper .top-bar .top-bar-section ul li ul li:last-of-type, #nav-wrapper .top-bar .top-bar-section ul li ul li:last-of-type {
  border: none;
}
#nav-wrapper .top-bar .top-bar-section ul li ul li.parent-link, #nav-wrapper .top-bar .top-bar-section ul li ul li.parent-link {
  display: none !important;
}
#nav-wrapper .top-bar .top-bar-section ul li ul li a, #nav-wrapper .top-bar .top-bar-section ul li ul li a:not(.button), #nav-wrapper .top-bar .top-bar-section ul li ul li a, #nav-wrapper .top-bar .top-bar-section ul li ul li a:not(.button) {
  color: #312f61 !important;
  font-size: 14px !important;
  line-height: 50px !important;
  min-width: 150px;
}
#nav-wrapper .top-bar .top-bar-section ul li ul li a:hover, #nav-wrapper .top-bar .top-bar-section ul li ul li a:focus, #nav-wrapper .top-bar .top-bar-section ul li ul li a:not(.button):hover, #nav-wrapper .top-bar .top-bar-section ul li ul li a:not(.button):focus, #nav-wrapper .top-bar .top-bar-section ul li ul li a:hover, #nav-wrapper .top-bar .top-bar-section ul li ul li a:focus, #nav-wrapper .top-bar .top-bar-section ul li ul li a:not(.button):hover, #nav-wrapper .top-bar .top-bar-section ul li ul li a:not(.button):focus {
  background: #acbcdb !important;
  color: #312f61 !important;
}
#nav-wrapper .top-bar .top-bar-section ul li#donate a:not(:hover):not(:focus) {
  color: #f0bb3c;
}
#nav-wrapper .top-bar .top-bar-section ul li#donate:hover, #nav-wrapper .top-bar .top-bar-section ul li#donate:focus {
  background: #cb242c;
}
#nav-wrapper .top-bar .top-bar-section ul li#donate:hover a, #nav-wrapper .top-bar .top-bar-section ul li#donate:focus a {
  color: #f5f6fb;
}
#nav-wrapper .top-bar .top-bar-section ul li#donate:hover a:focus, #nav-wrapper .top-bar .top-bar-section ul li#donate:focus a:focus {
  background: #cb242c !important;
  color: #f5f6fb !important;
}
#nav-wrapper .top-bar .top-bar-section ul li#donate.current {
  background: #cb242c;
}
#nav-wrapper .top-bar .top-bar-section ul li#donate.current a {
  color: #f5f6fb !important;
}

/* -------------------------------------- 
    custom: medium and small screens
-------------------------------------- */
@media only screen and (max-width: 1099px) {
  #nav-wrapper {
    width: 100%;
  }
  #nav-wrapper .top-bar {
    background: rgba(55, 73, 142, 0.95) !important;
  }
  #nav-wrapper .top-bar .toggle-topbar.menu-icon {
    margin-top: -35px;
  }
  #nav-wrapper .top-bar .toggle-topbar.menu-icon a {
    font-family: open_sanssemibold, Helvetica, Arial, sans-serif;
    font-style: normal;
    font-weight: normal;
    letter-spacing: 0.2px;
    height: 70px;
  }
  #nav-wrapper .top-bar .toggle-topbar.menu-icon a span:after {
    box-shadow: 0 0 0 1px #f5f6fb, 0 7px 0 1px #f5f6fb, 0 14px 0 1px #f5f6fb;
  }
  #nav-wrapper .top-bar.expanded {
    background: none;
  }
  #nav-wrapper .top-bar.expanded .title-area {
    background: none;
  }
  #nav-wrapper .top-bar.expanded .top-bar-section {
    display: block;
    float: none;
    padding-left: 0;
  }
  #nav-wrapper .top-bar.expanded .top-bar-section h5 a {
    font-size: 11px !important;
  }
  #nav-wrapper .top-bar.expanded .top-bar-section ul li {
    background: #f0bb3c;
    border-bottom: 1px solid #f5f6fb;
    padding: 0;
  }
  #nav-wrapper .top-bar.expanded .top-bar-section ul li:last-of-type {
    border: none;
  }
  #nav-wrapper .top-bar.expanded .top-bar-section ul li a {
    color: #312f61 !important;
    font-size: 13px !important;
    line-height: 40px !important;
  }
  #nav-wrapper .top-bar.expanded .top-bar-section ul li a:focus {
    background: #acbcdb;
  }
  #nav-wrapper .top-bar.expanded .top-bar-section ul li:hover, #nav-wrapper .top-bar.expanded .top-bar-section ul li:focus {
    background: #acbcdb !important;
    outline: none;
  }
  #nav-wrapper .top-bar.expanded .top-bar-section ul li:hover a:hover, #nav-wrapper .top-bar.expanded .top-bar-section ul li:hover a:focus, #nav-wrapper .top-bar.expanded .top-bar-section ul li:focus a:hover, #nav-wrapper .top-bar.expanded .top-bar-section ul li:focus a:focus {
    color: #312f61 !important;
  }
  #nav-wrapper .top-bar.expanded .top-bar-section ul li#donate a:not(:hover):not(:focus) {
    color: #312f61 !important;
  }
  #nav-wrapper .top-bar.expanded .top-bar-section ul li#donate a:not(:hover):not(:focus):hover, #nav-wrapper .top-bar.expanded .top-bar-section ul li#donate a:not(:hover):not(:focus):focus {
    color: #f5f6fb !important;
  }
  #nav-wrapper .top-bar.expanded .top-bar-section .has-dropdown > a::after {
    border-color: #312f61;
    content: "\f105";
    font-family: FontAwesome;
    margin-top: -21px;
  }
  #nav-wrapper .top-bar.expanded .top-bar-section .title.back a::before {
    content: "\f104";
    font-family: FontAwesome;
    padding-right: 0.313em;
  }
}
/* -------------------------------------- 
    custom: medium screens
-------------------------------------- */
@media only screen and (min-width: 641px) and (max-width: 1099px) {
  #nav-wrapper .top-bar .top-bar-section ul li a,
  #nav-wrapper .top-bar .top-bar-section ul li a:not(.button) {
    font-size: 13px;
  }
}
/* -------------------------------------- 
    custom: small
-------------------------------------- */
@media only screen and (max-width: 875px) {
  #nav-wrapper {
    z-index: 6;
  }
}
/* =====================================================================
    sidebar styles - cfaf | source: ../_source/styles/layout/_sidebar.scss
===================================================================== */
#sidebar h4 {
  background: none;
  color: #312f61;
  font-size: 1.5714285714em;
  margin-top: 0.313em;
}
#sidebar .side-nav {
  margin-left: -0.9375em;
  padding-top: 0;
}
#sidebar .side-nav li {
  font-size: 0.9285714286em;
  margin: 0;
  padding: 0;
}
#sidebar .side-nav li a {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 800;
  color: #312f61;
  padding: 0.625em 0.9375em;
  text-decoration: none;
}
#sidebar .side-nav li a:hover:not(.button), #sidebar .side-nav li a:focus:not(.button), #sidebar .side-nav li a.current {
  background: #acbcdb;
  color: #312f61;
}
#sidebar .side-nav li.current_page_item a, #sidebar .side-nav li.current_page_item a:hover {
  background: #f0bb3c;
  color: #312f61;
}

/* --------------------------------------
    small screens:
    max-width 640px
-------------------------------------- */
@media only screen and (max-width: 40em) {
  #sidebar {
    margin-top: 2.5em;
  }
  #sidebar .side-nav {
    margin-right: -0.9375em;
  }
}
/* =====================================================================
    footer styles - cfaf | source: ../_source/styles/layout/_footer.scss
===================================================================== */
footer {
  background: #37498e;
  padding: 60px 0;
}
footer img {
  display: block;
  margin: 0 auto;
  max-width: 90%;
}

/* =====================================================================
    film grid styles - cfaf | source: ../_source/styles/components/_film-grid.scss
===================================================================== */
/* ----------------------------------------------------------------
    color overlay
---------------------------------------------------------------- */
.film-grid.small a:hover img, .film-grid.small a:focus img, .film-grid img {
  -webkit-filter: grayscale(0%);
  filter: grayscale(0%);
  opacity: 1;
}

.film-grid.small img, .film-grid a:hover img, .film-grid a:focus img {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.3;
}

.film-grid {
  background: #37498e;
  margin: 1.25em 0 0.9375em !important;
}
.film-grid img {
  position: relative;
  z-index: 1;
}
.film-grid a:focus {
  outline: none;
}

/* ----------------------------------------------------------------
    typography
---------------------------------------------------------------- */
.film-grid {
  background-color: transparent !important;
}
.film-grid article {
  background-color: #37498e !important;
}
.film-grid img {
  width: 100%;
}
.film-grid .info {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 2;
}
.film-grid .info::before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}
.film-grid .info .centered {
  display: inline-block;
  vertical-align: middle;
}
.film-grid .info p {
  margin-bottom: 0;
  padding-bottom: 0;
}
.film-grid a {
  text-align: center;
  text-decoration: none;
}
.film-grid a h3, .film-grid a h4, .film-grid a p {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  background: none;
  color: #f5f6fb;
  left: 0;
  text-shadow: 0 0 5px #333, 0 0 2px #333;
}
.film-grid a h3, .film-grid a h4 {
  font-size: 2.1428571429em;
  margin: 0 !important;
}
.film-grid.small a h4 {
  font-size: 1.3571428571em;
}

/* ----------------------------------------------------------------
    film detail pages
---------------------------------------------------------------- */
img.featured-film {
  display: block;
  margin: 0 auto 1.875em;
}

/* --------------------------------------
	adjust titles' sizes so they stay inside the boxes
-------------------------------------- */
/* --------------------------------------
    custom (smaller medium screens):
    max-width 800px and min-width 641px
-------------------------------------- */
@media only screen and (max-width: 50em) and (min-width: 40.063em) {
  .film-grid a h3, .film-grid a h4 {
    font-size: 1.5714285714em;
  }
  .film-grid.small a h3, .film-grid.small a h4 {
    font-size: 1.2142857143em;
  }
}
/* --------------------------------------
    custom (very small screens):
    max-width 560px
-------------------------------------- */
@media only screen and (max-width: 35em) {
  .film-grid a h3, .film-grid a h4 {
    font-size: 1.4285714286em;
  }
  .film-grid.small a h3, .film-grid.small a h4 {
    font-size: 1.4285714286em;
  }
}
/* =====================================================================
    filter films form styles - cfaf | source: ../_source/styles/components/_filter-films.scss
===================================================================== */
#filter-films label select {
  background-color: #37498e;
  border-color: #312f61;
  color: #f5f6fb;
  cursor: pointer;
  outline: none;
}
#filter-films label select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #f5f6fb;
}
#filter-films label select:hover, #filter-films label select:focus {
  background-color: rgb(116.3640167364, 20.6359832636, 25.2217573222);
  border-color: rgb(116.3640167364, 20.6359832636, 25.2217573222);
}
#filter-films label select option {
  background-color: #37498e;
}

#filter-films + .film-grid {
  margin-bottom: 50px !important;
}

/* =====================================================================
    block grid (Foundation component) styles - cfaf
    source: ../_source/styles/components/_block-grid.scss
===================================================================== */
[class*=block-grid-] h4, [class*=block-grid-] h5 {
  color: #f5f6fb;
  font-size: 1.5714285714em;
  line-height: 1;
  margin: 0.625em 0 0.313em;
}
[class*=block-grid-] p {
  font-size: 0.9285714286em;
  padding: 0;
}

/* =====================================================================
    open sesame styles - cfaf | source: ../_source/styles/components/_open-sesame.scss
===================================================================== */
.open-sesame {
  margin: 0.9375em 0;
}
.open-sesame > h3, .open-sesame > h4, .open-sesame > h5, .open-sesame > h6 {
  font-size: 1em;
  margin: 0.625em 0 0 0.625em !important;
}
.open-sesame > h3.open a, .open-sesame > h4.open a, .open-sesame > h5.open a, .open-sesame > h6.open a {
  color: rgb(116.3640167364, 20.6359832636, 25.2217573222);
}
.open-sesame > h3 a, .open-sesame > h4 a, .open-sesame > h5 a, .open-sesame > h6 a {
  font-family: open_sanssemibold, Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 0.2px;
  text-transform: none;
}
.open-sesame > h3 a i, .open-sesame > h4 a i, .open-sesame > h5 a i, .open-sesame > h6 a i {
  color: #312f61;
  margin-left: -0.625em;
  padding-right: 0.625em;
  position: relative;
  text-decoration: none;
}
.open-sesame > h3 a i:hover, .open-sesame > h3 a i:focus, .open-sesame > h4 a i:hover, .open-sesame > h4 a i:focus, .open-sesame > h5 a i:hover, .open-sesame > h5 a i:focus, .open-sesame > h6 a i:hover, .open-sesame > h6 a i:focus {
  color: rgb(116.3640167364, 20.6359832636, 25.2217573222);
}
.open-sesame > h3 a i::before, .open-sesame > h4 a i::before, .open-sesame > h5 a i::before, .open-sesame > h6 a i::before {
  text-decoration: none;
}
.open-sesame > h3 strong, .open-sesame > h4 strong, .open-sesame > h5 strong, .open-sesame > h6 strong {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 800;
}
.open-sesame div {
  outline: none;
}
.open-sesame .hidden-content {
  padding-left: 1.25em;
}
.open-sesame .hidden-content > *:not(.callout):not(form):not(.alignright):not(.aligncenter):not(.alignleft) {
  margin-left: 0;
  padding-left: 0;
}
.open-sesame .hidden-content h4, .open-sesame .hidden-content h5, .open-sesame .hidden-content h6 {
  margin-top: 0.625em;
}
.open-sesame .hidden-content h4 {
  font-size: 1.2857142857em;
}
.open-sesame .hidden-content h5 {
  font-size: 1.2142857143em;
}
.open-sesame .hidden-content h6 {
  font-size: 1.1428571429em;
}
.open-sesame .hidden-content ul, .open-sesame .hidden-content ol {
  margin-left: 1.5625em !important;
}
.open-sesame .hidden-content dl {
  margin-left: 0.625em !important;
}
.open-sesame .hidden-content ul li p {
  margin: 0 !important;
}
.open-sesame .facade {
  margin-left: -50px;
  padding-left: 50px;
}
