@charset "UTF-8";
/*
Theme Name: Web Solutions
Theme URI: https://www.websolutions.com/
Author: Web Solutions
Author URI: https://www.websolutions.com/
Description: WordPress wpCode
Version: 2.0
Text Domain: wpcodev2

Web Solutions is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.
*/




.anchor>div {
  top: -4.625em;
}

body.admin-bar .anchor>div {
  top: -6.625em;
}



/* TYPOGRAPHY ------------------------------*/

/* h1 { font-size: 2em; }
h2 { font-size: 1.75em; }
h3 { font-size: 1.5em; }
h4, th { font-size: 1.25em; }
h5 { font-size: 1.125em; }
h6 { font-size: 1.0em; }

.intro {
  font-size: 1.25em;
}
 */


/* HOVER ------------------------------*/

a:is(:hover, :focus-visible),
a:is(:hover, :focus-visible) * {
  color: var(--ws-dark-blue);
}

.content a:not(.button):is(:hover, :focus-visible) {
  text-decoration-color: var(--ws-dark-blue);
}

:is(#sidenav>ul>li>a, #sidenav>ul>li.current_page_item>a, #sidenav>ul>li.current_page_ancestor>a):is(:hover,:focus-visible),
:is(#sidenav>ul>li>ul>li>a, #sidenav>ul>li>ul>li.current_page_item>a, #sidenav>ul>li>ul>li.current_page_ancestor>a):is(:hover,:focus-visible),
:is(#sidenav>ul>li>ul>li>ul>li>a, #sidenav>ul>li>ul>li>ul>li.current_page_item>a, #sidenav>ul>li>ul>li>ul>li.current_page_ancestor>a):is(:hover,:focus-visible) {
  color: var(--ws-red);
}

:is(.button, button, input[type="button"], input[type="submit"], input[type="reset"], .wp-block-button__link):is(:hover, :focus) {
  background-color: #FFF;
  color: var(--ws-red);
}

:is(button, .button).black:is(:hover,:focus-visible),
.black .wp-block-button__link:is(:hover,:focus-visible) {
  color: #000;
}

:is(button, .button).blue:is(:hover,:focus-visible),
.blue .wp-block-button__link:is(:hover,:focus-visible) {
  color: var(--ws-blue);
}

.our-leadership-featured a:is(:hover,:focus-visible) span.button.blue.outline,
:is(button, .button).blue.outline:is(:hover,:focus-visible),
.blue.outline .wp-block-button__link:is(:hover,:focus-visible) {
  background: var(--ws-blue);
  color: #FFF;
}


:is(button, .button).back:is(:hover,:focus-visible)::before,
.back .wp-block-button__link:is(:hover,:focus-visible)::before {
  background: var(--ws-red);
}



/* STICKY FOOTER ------------------------------*/

body {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto auto 1fr;
  min-height: 100vh;
}

body.admin-bar {
  min-height: calc(100vh - 32px);
}

body>footer {
  align-self: end;
}




/* HEADER ------------------------------*/
body>header {
  background: #FFF;
  display: contents;
  z-index: 2;
}

body>header .flex>div {
  align-items: center;
  display: flex;
  justify-content: center;
  max-height: 22em;
  width: 50%;
}

body>header .flex>div {
  aspect-ratio: 757 / 200;
}

body.home>header .flex>div {
  aspect-ratio: 757 / 330;
}

#brand {
  display: block;
  margin-inline: auto;
  max-width: min(72.65%, 28.25em);
  padding: 1em;
  width: 100%;
}

body.home>header #brand {
  max-width: min(72.65%, 38em);
}

#brand img {
  display: block;
  width: 100%;
}

nav ul {
  margin: 0;
}

#navContainer {
  display: contents;
}

#mainnav {
  background: #000;
  overflow: visible;
  position: sticky;
  top: 0;
  z-index: 4;
}

body.admin-bar #mainnav {
  top: 32px
}

#mainnav ul {
  margin: 0;
  overflow: visible;
  padding: 0;
  text-align: center;
}

#mainnav li {
  display: inline-block;
  position: relative;
}

#mainnav a {
  color: #FFF;
  display: inline-block;
  font-size: 1.125em;
  line-height: 1.028;
  padding: .875em 1em;
  text-decoration: none;
}

#mainnav>ul>li:hover>a,
#mainnav>ul>li.expand>a,
#mainnav>ul>li>a:focus,
#mainnav>ul>li:focus-within>a {
  background: var(--ws-red);
  color: #FFF;
}

#mainnav>ul>li:is(.current-menu-item, .current-page-ancestor)>a {
  background: var(--ws-red);
  color: #FFF;
}





/* ACCESSIBLE DROPDOWNS ------------------------------ */

#mainnav>ul>li>button {
  background: transparent;
  bottom: 0;
  border: 0;
  height: .5rem;
  opacity: 0;
  padding: 0;
  pointer-events: none;
  position: absolute;
  right: 50%;
  transform: translate(50%,-50%);
  width: 1.25rem;
}

#mainnav>ul>li>button:focus-visible {
  opacity: 1;
}

#mainnav>ul>li>button:before {
  background: url('./images/icons/chevron-down.svg') no-repeat center / contain;
  content: '';
  height: .75rem;
  left: 0;
  position: absolute;
  right: 0;
  top: calc(50% - 6px);
}





/* T2 DROPDOWN MENU ------------------------------ */

#mainnav li ul {
  background: #FFF;
  border-radius: 0 0 .5rem .5rem;
  box-shadow: 0 5px 6px 0px rgba(0,0,0,.1);
  height:auto;
  opacity: 0;
  overflow:auto;
  position:absolute;
  padding: .5em 0;
  top: -200vh;
  transition: ease 200ms opacity 0.35s;
  visibility: hidden;
  width: 14em;
  z-index: -1;
}

#mainnav li:hover ul,
#mainnav li>a:focus + ul,
#mainnav>ul>li.expand>ul,
#mainnav>ul>li>ul:focus-within {
  opacity: 1;
  top: auto;
  visibility: visible;
  z-index: 1;
}

#mainnav>ul>li:last-child ul {
  left: auto;
  right: 0;
}

#mainnav li ul li {
  display: block;
  width: 100%;
}

#mainnav li ul li a {
  background: none;
  color: #000;
  display: block;
  font-size: 1em;
  line-height: 1.1;
  padding: .375em .5em .375em 1.75em;
  position: relative;
  text-align: left;
  width: 100%;
}

#mainnav>ul ul li a::before  {
  content: '';
  background: url('images/icons/chevron-right-red.svg') no-repeat center / contain;
  height: .625em;
  left: .75em;
  position: absolute;
  top: .5625em;
  width: .6875em;
}

#mainnav li ul li a:is(:hover, :focus-visible) {
  background: var(--ws-lt-gray);
  color: #000;
}

#mainnav li ul ul {
  display: none;
}


/* mobile */
#mobilenav, .toggleNav {
  content-visibility: hidden;
  display: none;
}



/* MAIN ------------------------------ */


main > .wrap {
  padding-top: 4.9375em;
}

main>div>aside {
  float: left;
  overflow: hidden;
  padding-top: 0;
  padding-right: 4.8125em;
  width: 15.625em;
}

body.fullWidth #content {
  float: none;
  margin: 0 auto;
  width: 100%;
}

#content {
  float: right;
  min-height: 37.5em;
  overflow: hidden;
  padding: 0 0 3.125em;
  position: relative;
  width: calc(100% - 15.625em);
}

#content.fullWidth {
  float: none;
  margin: 0 auto;
}

.twoCol {
  columns: 2;
}

.threeCol {
  columns: 3;
}

.alignright {
  margin: 0 0 .75em 2.5em;
}

.alignleft {
  margin: 0 2.5em .75em 0;
}




/* WELCOME ------------------------------ */

.welcome {
  display: flex;
}
.welcome:nth-of-type(odd) {
  flex-direction: row-reverse;
}

.welcome>div {
  width: 50%;
}

.welcome .wrap {
  max-width: 51.875em;
  padding: clamp(2.5em, 1.042em + 3.11vw, 4.375em) clamp(1.5rem, -2.667rem + 8.89vw, 4rem);

}


/* FOOTER ------------------------------ */

body>footer .fatFooter>a {
  aspect-ratio: 378 / 200;
  width: 25%;
}

body>footer .fatFooter>a.sponsor {
  overflow: hidden;
}

body>footer .fatFooter>a:is(:hover,:focus-visible)::after {
  opacity: .75;
}

body>footer .fatFooter>a.kfl:is(:hover,:focus-visible)::after {
  background: #DBDBDB;
  opacity: 1;
}

body>footer .fatFooter>a:is(:hover,:focus-visible)>img {
  transform: scale(1.06);
}
body>footer .fatFooter>a.sponsor:is(:hover,:focus-visible)>img,
body>footer .social-links a:is(:hover,:focus) {
  opacity: .75;
}
body>footer .copyright a:is(:hover,:focus) {
  text-decoration: underline;
} 
body>footer .copyright a:first-of-type {
  padding-left: .5em;
}



/* LEADERSHIP LANDING (COPIED FROM NKR MAIN SITE) ------------------------------ */

.leadership-landing-intro { padding-block: 4.0625rem; }
.our-leadership-featured .wrap, .our-story .wrap {flex-direction: row-reverse;}
.our-leadership-featured .featured-left {width: calc(40% - 1.75rem);}
.leadership-landing .our-leadership-featured .featured-left {width: calc(30% - 1.75rem);}
.leadership-landing .our-leadership-featured .featured-right {margin-left: 3.4375rem; padding-block: 3rem; width: calc(70% - 1.75rem);}
.our-leadership-team div.flex {gap: 3rem 4rem;}
.our-leadership-team div.flex div.slide {width: calc(25% - 3rem);}
.our-leadership.leadership-landing.custom-col-count .our-leadership-team .flex .slide:is(:nth-child(5), :nth-child(6), :nth-child(7)) {width: calc(33.33% - 2.67rem);}
.our-leadership.leadership-landing.custom-col-count .our-leadership-team .flex .slide:is(:nth-child(5), :nth-child(6), :nth-child(7)) a {max-width: 70.25%; display: block; margin: 0 auto;}
.our-leadership.leadership-landing.custom-col-count .our-leadership-team .flex .slide:nth-child(5) a {margin-right: 0;}
.our-leadership.leadership-landing.custom-col-count .our-leadership-team .flex .slide:nth-child(7) a {margin-left: 0;}

.our-leadership-team div.slide a:is(:hover,:focus-visible) .team-member-name,
.our-leadership-featured a:is(:hover,:focus-visible) .name {color: var(--ws-red);}
main .our-leadership a:is(:hover,:focus-visible) img {border-color: var(--ws-red); }
.our-leadership-featured a:is(:hover,:focus-visible) p {color: #000;}
.our-leadership-team .leadership-buttons > .button + .button {margin-left: 1rem;}
.our-leadership-team .wrap {padding-bottom: 4.75rem;}
.our-leadership.bio-page .our-leadership-team .wrap {padding-bottom: 1.4375rem;}


.our-leadership-team .slick-slider button:is(:hover, :focus-visible) {
  background-color: transparent;
  opacity: .6;
}

/* ----- */
.our-leadership.bio-page .our-leadership-team div.flex {justify-content: flex-start;}
.our-leadership.leadership-landing .our-leadership-team div.flex {justify-content: center;}





/* BIO PAGE (COPIED FROM NKR MAIN SITE) ------------------------------ */
.bio-page-intro .bio-content {padding-left: 3.875rem;}
.our-leadership-team .slick-slider .slick-slide {
  padding: 0 1.5625rem;
}
.our-leadership-team .slick-slider > button {
  width: 2.1em;
  height: 3.75em;
}







/* MAX-WIDTH MEDIA QUERIES ------------------------------ */


/* 900 */
@media (max-width: 56.25rem) {
  body>footer .copyright-links {
    display: block;
  }
  body>footer .copyright a:first-of-type {
    padding-left: 0;
  }
}

@media (max-width: 782px) {
  body.admin-bar {
    min-height: calc(100vh - 46px);
  }

  body.admin-bar #mainnav {
    top: 46px;
  }

  body.admin-bar .anchor>div {
    top: -4.625em;
  }

}





/* MIN-WIDTH MEDIA QUERIES ------------------------------ */

/* 1800px */
@media (min-width: 112.5em) {
  body { font-size: 1.1em; }
}



/* 2400px */
@media (min-width: 150em) {
  body { font-size: 1.2em; }
}


