@charset "UTF-8";
/*
 Theme Name:  Foundation - Ë¿¹ÏÊÓƵ
 Theme URI:   https://www.pcc.edu/foundation/
 Description: A custom theme for the PCC Foundation. Child of pcc.
 Author:      Ë¿¹ÏÊÓƵ
 Author URI:  https://www.pcc.edu/
 Version:     1.0
 Template:    pcc
*/
/*--------------------------------------------------------------------------
	custom font
--------------------------------------------------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@800&display=swap");
/* ----------------------------------------------------------------
    general
---------------------------------------------------------------- */
body {
  background: #008099;
}

/* ----------------------------------------------------------------
    typography
---------------------------------------------------------------- */
/* --------------------------------------
    navigation
-------------------------------------- */
#content-area h2, #content-area h3, #content-area h4, #content-area h5, #content-area h6, #sidenav h2, #sidenav h3, #sidenav h4, #sidenav h5, #sidenav h6 {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal !important;
  font-weight: 800 !important;
  color: #314162;
}

/* --------------------------------------
    buttons
-------------------------------------- */
.button, button, [type=submit], [type=button] {
  font-family: open_sansbold, Helvetica, Arial, sans-serif !important;
}

.alignbuttons {
  margin: 1.25rem 0 2.5rem;
  text-align: center;
}
.alignbuttons .button {
  font-size: 1.125em !important;
}

/* ----------------------------------------------------------------
    header
---------------------------------------------------------------- */
#foundation-header {
  background: #ffffff;
  position: relative;
}
#foundation-header #logo h1 {
  margin: 0;
}
#foundation-header #logo h2 {
  margin: 0;
}
#foundation-header #logo h2 img {
  width: 10.9375rem;
}

/* --------------------------------------
    divider
-------------------------------------- */
#main .divider {
  background: #008099;
  background: linear-gradient(rgba(0, 128, 153, 0.85), rgba(0, 128, 153, 0.85)), url("/foundation/wp-content/themes/pcc-foundation/_source/images/divider.jpg");
  background-repeat: no-repeat;
  background-repeat: repeat-x;
  background-size: auto;
  height: 1.875rem;
  width: 100%;
}

/* ----------------------------------------------------------------
    navigation
---------------------------------------------------------------- */
.top-bar #main-nav a:not(.button) {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal !important;
  font-weight: 800 !important;
  color: #314162;
  padding-top: 2.5rem !important;
}

/* --------------------------------------
    campaign button
-------------------------------------- */
.top-bar #campaign-button {
  margin-left: auto;
}
.top-bar #campaign-button .button {
  border-color: #00667a;
  box-shadow: 0.1875rem 0.1875rem #edaa1e;
  margin: 1.5rem 0 0;
  padding: 0.75rem 1.25rem 0.8125rem 1.25rem !important;
}

/*----- narrower medium screens -----*/
@media only screen and (min-width: 40em) and (max-width: 57.8125em) {
  .top-bar #campaign-button .button {
    font-size: 0.875em !important;
    margin-top: 1.0625rem;
    width: 8.25rem;
  }
}
/* --------------------------------------
    small screens - navigation
-------------------------------------- */
@media only screen and (max-width: 39.9375em) {
  #global-nav {
    background: #e9e9e9 !important;
    padding: 0.625rem 0 1.875rem !important;
  }
  .top-bar #main-nav a:not(.button) {
    padding-top: 1.25rem !important;
  }
  .top-bar #campaign-button {
    margin-left: 0;
  }
}
/*----- hamburger menu -----*/
.title-bar .menu-icon {
  margin-top: 0 !important;
}
.title-bar .menu-icon span {
  background: #314162 !important;
}
.title-bar .menu-icon.active span:nth-of-type(2) {
  background: #ffffff !important;
}

/* ----------------------------------------------------------------
    sidebar
---------------------------------------------------------------- */
#snav h3 {
  background: #314162 !important;
}
#snav .side-nav a.current {
  border-color: #314162;
  color: #314162;
}
#snav .side-nav a:hover, #snav .side-nav a:focus {
  border-color: #314162;
}

#sidenav .card:not(.info) .card-heading {
  background: #008099 !important;
  box-shadow: 0 0.1875rem rgb(0, 93.8666666667, 112.2) !important;
  color: #ffffff !important;
}

/* ----------------------------------------------------------------
    cards
---------------------------------------------------------------- */
#content-area .card {
  background: #d7eaee !important;
  box-shadow: 0.1875rem 0.1875rem rgb(161.3157894737, 205.8157894737, 215.1842105263) !important;
}
#content-area .card .card-heading {
  background: none;
  box-shadow: none;
  margin-bottom: 0;
}

.card-columns .card > a:hover, .card-columns .card > a:focus {
  background: rgb(179.2105263158, 215.2105263158, 222.7894736842) !important;
}

/* ----------------------------------------------------------------
    open sesame
---------------------------------------------------------------- */
#content-area .open-sesame > h4, #content-area .open-sesame > h5, #content-area .open-sesame > h6 {
  font-family: open_sansbold, Helvetica, Arial, sans-serif;
  font-style: normal !important;
  font-weight: normal !important;
}

/* ----------------------------------------------------------------
    social links
---------------------------------------------------------------- */
.social-links {
  list-style: none;
  margin: 0;
}
.social-links li {
  display: inline;
  margin-right: 0.3125rem;
}

footer .social-links i {
  font-size: 1.9375em;
}

/* ----------------------------------------------------------------
    footer
---------------------------------------------------------------- */
footer {
  background: #008099;
}
footer .grid-x {
  padding: 0 !important;
}
footer .medium-3 {
  padding-left: 0 !important;
}
footer img {
  width: 10.9375rem;
}
footer p {
  color: #ffffff !important;
  padding: 0;
}
footer a {
  color: #ffffff !important;
}
footer a:hover, footer a:focus {
  color: rgb(242.25, 242.25, 242.25) !important;
}

/* --------------------------------------
    medium screens - footer
-------------------------------------- */
@media only screen and (min-width: 40em) and (max-width: 63.9375em) {
  footer img {
    margin-bottom: 1.25rem;
  }
  footer .block-grid-2 li:nth-of-type(odd) {
    padding: 0 0.625rem 1.25rem 0;
  }
  footer .block-grid-2 li:nth-of-type(even) {
    padding: 0 0 1.25rem 0.625rem;
  }
}
/* --------------------------------------
    small screens - footer
-------------------------------------- */
@media only screen and (max-width: 39.9375em) {
  footer .cell {
    padding-bottom: 0 !important;
  }
  footer .social-links {
    margin: 1.25rem 0 0 0.625rem;
  }
  footer .large-7 {
    padding-bottom: 1.25rem !important;
    padding-top: 1.25rem !important;
  }
}
/* ----------------------------------------------------------------
    champions for opportunity
---------------------------------------------------------------- */
/* --------------------------------------
    fix the margin on the callout images
    on the CFO landing page
-------------------------------------- */
.champ-img-fix {
  margin: 1.25rem 0 0 25% !important;
}

/* --------------------------------------
    sorting
-------------------------------------- */
#champ-search {
  text-align: right;
}
#champ-search input {
  background-color: rgb(240.65, 240.65, 240.65);
  border: 0.0625rem solid #008099;
  box-shadow: none;
  color: rgb(63.75, 63.75, 63.75);
  margin: 0.3125rem 0 0;
  padding: 0.5rem 0.625rem;
}
#champ-search input:focus {
  background-color: rgba(0, 128, 153, 0.08);
  border-color: #008099;
  box-shadow: none;
}
#champ-search input::placeholder {
  color: #595959;
  opacity: 0.7;
}

/* --------------------------------------
    grid
-------------------------------------- */
.pcc-champ-grid a {
  padding-bottom: 0 !important;
}
.pcc-champ-grid a::after {
  display: none;
}
.pcc-champ-grid img {
  aspect-ratio: 1/1;
  margin-bottom: 0 !important;
}
.pcc-champ-grid .pcc-champ-grid-thumb p {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal !important;
  font-weight: 800 !important;
  color: #314162;
  font-size: 1.375em;
  margin: 0;
  padding: 0.9375rem 1.25rem 1.75rem !important;
  text-align: center;
}

/* --------------------------------------
    pagination
-------------------------------------- */
.pcc-champ-nav {
  display: flex;
  font-size: 1.25em;
  justify-content: space-between;
  margin: 2.5rem auto 0;
  width: 50%;
}
.pcc-champ-nav a:not(:hover):not(:focus) {
  text-decoration: none;
}

/*----- medium screens – pagination -----*/
@media only screen and (min-width: 40em) and (max-width: 63.9375em) {
  .pcc-champ-nav {
    width: 80%;
  }
}
/*----- small screens – pagination -----*/
@media only screen and (max-width: 39.9375em) {
  .pcc-champ-nav {
    width: 100%;
  }
}
/* ----------------------------------------------------------------
    homepage
---------------------------------------------------------------- */
/* --------------------------------------
    full-width header
    medium and large screens
-------------------------------------- */
@media only screen and (min-width: 40em) {
  body.home #foundation-header > .grid-container {
    margin-left: 0;
    margin-right: 0;
    max-width: 100%;
    padding-left: 1.875rem;
    padding-right: 1.875rem;
  }
}
/* --------------------------------------
    slideshow
-------------------------------------- */
#foundation-slideshow {
  aspect-ratio: 1200/533;
  height: auto !important;
  overflow: hidden;
}
#foundation-slideshow img {
  width: 100%;
}
#foundation-slideshow .rsArrow {
  cursor: pointer;
  display: block;
  height: 100%;
  position: absolute;
  width: 2.75rem;
  z-index: 21;
}
#foundation-slideshow .rsArrowLeft {
  left: 0;
  top: 0;
}
#foundation-slideshow .rsArrowLeft .rsArrowIcn {
  background-position: -4rem -2rem;
}
#foundation-slideshow .rsArrowRight {
  right: 0;
  top: 0;
}
#foundation-slideshow .rsArrowRight .rsArrowIcn {
  background-position: -4rem -4rem;
}
#foundation-slideshow .rsArrowIcn {
  background: url("/wp-content/themes/pcc/_source/vendor/royalslider-9.5.7/skins/pcc/rs-default.png");
  background-color: rgba(0, 0, 0, 0.75);
  border-radius: 0.125rem;
  cursor: pointer;
  height: 2rem;
  left: 50%;
  margin-top: -1rem;
  margin-left: -1rem;
  position: absolute;
  top: 50%;
  transition: opacity 0.7s;
  width: 2rem;
}
#foundation-slideshow .rsArrowIcn:hover, #foundation-slideshow .rsArrowIcn:focus {
  background-color: rgba(0, 0, 0, 0.9);
}
#foundation-slideshow .rsArrowDisabled .rsArrowIcn {
  filter: alpha(opacity=20);
  opacity: 0;
}

/* --------------------------------------
    boxes
-------------------------------------- */
.grid h2, .news-social h2 {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal !important;
  font-weight: 800 !important;
  color: #314162;
  font-size: 2.25em;
}
.grid .cell, .news-social .cell {
  padding: 1.875rem !important;
}

.grid.grid-x {
  max-width: 100%;
}
.grid h2 {
  margin-top: 0;
}
.grid .contrast {
  background: #314162;
  background: linear-gradient(rgba(49, 65, 98, 0.9), rgba(49, 65, 98, 0.9)), url("/foundation/wp-content/themes/pcc-foundation/_source/images/family.jpg");
  background-repeat: no-repeat;
  background-size: cover !important;
  color: #ffffff;
  margin: -1.875rem;
  padding: 1.875rem;
  height: calc(100% + 3.75rem);
}
.grid .contrast h2, .grid .contrast p, .grid .contrast a:not(.button) {
  color: #ffffff;
}
.grid .contrast a:not(.button):focus:not(:hover) {
  color: #ffffff;
  outline: 0.0625rem solid #ffffff;
}
.grid .dark {
  background: #008099;
  background: linear-gradient(rgba(0, 128, 153, 0.9), rgba(0, 128, 153, 0.9)), url("/foundation/wp-content/themes/pcc-foundation/_source/images/grads.jpg");
  background-repeat: no-repeat;
}

/*----- small screens – boxes -----*/
@media only screen and (max-width: 39.9375em) {
  .grid .cell:nth-of-type(2) {
    border-bottom: 0.1875rem solid #008099;
  }
}