/*
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.
*/
@charset "UTF-8";
/* Web Solutions 4.0 Compatible */

  /* HEADER ------------------------------*/
  body>header{background:rgba(255, 255, 255, 0.9); backdrop-filter: blur(0.375rem); -webkit-backdrop-filter: blur(0.375rem);position: fixed;overflow: visible; padding: .47em .44em; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;  justify-content:space-between; border-bottom: .5px solid rgba(0, 0, 0, 0.2);z-index: 10;}
  body>header>.wrap{height:60px; overflow: visible}
  #brand {display:block;max-width: 14rem; width: 100%; margin-left: .25em; padding: .25rem 0 .25rem .6rem;}
  #brand img {width:100%; display: block; height: auto;}

  nav ul{margin: 0}
  #mainnav{overflow:visible}
  #mainnav ul{text-align:right;overflow:visible;margin: 0;padding: 0;}
  #mainnav li{display:inline-block;position:relative}
  #mainnav a{font-weight: 500; font-size: .9375em;line-height:2em;border: 1px solid transparent;padding: .3em .8em;display:inline-block;color:#000;text-decoration:none;}

  #mainnav>div>ul>li:last-child>a {
      background: var(--red);
      color: #FFF;
      border-radius: 5px;
  }
  #mainnav>div>ul>li:not(:last-child):hover>a, #mainnav>div>ul>li:not(:last-child):active>a {
    color: #000;
    background: #fff;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 5px;
}
  #mainnav>div>ul>li:last-child>a {
    padding: .25em 1em;
  }
  #mainnav>div>ul>li:last-child>a:hover, .hero-text .button:hover {background: var(--red); border-color: var(--red); color: #FFF; transform: perspective(1px) scale(1.05);}
  #mainnav>div>ul>li.current-menu-item>a,
  #mainnav>div>ul>li.current-page-ancestor>a {
    background: #fff;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 5px;
    padding: .3em .8em;
    color: #000;
  }
  /*dhtml*/
  #mainnav li ul{z-index:1;width:13rem;border-radius: 5px;padding: .5em; margin-left: .25rem; border-radius: 0 .5rem .5rem .5rem;background: rgba(0, 0, 0, 0.8);position:absolute;overflow:auto;height:auto; top: -200vh;opacity: 0;z-index: -1; visibility: hidden; -webkit-transition: ease 200ms opacity 0.35s; transition: ease 200ms opacity 0.35s;}
  #mainnav>div>ul>li:last-child ul{right:0}
  #mainnav li ul li{width:100%;display:block;float:left}
  #mainnav ul li ul li a{background:none;color:#fff}
  #mainnav li ul li a{font-size: 0.8em;line-height: 1.1;padding: .5em;display:block;width:100%;text-align:left;float:left}
  #mainnav li ul li a:hover, .t1 li ul li a:active{color:#113459;background:#fff; border-radius: .25em;border: 1px solid #707070;}
  #mainnav li ul ul {display: none}
  /* ancillary */
  #ancillary {position:absolute;right:0;top:0;padding: 1rem 0; color:#ccc;font-size:.7em;}
  #ancillary ul{display: inline}
  #ancillary li{display: inline;}
  #ancillary a {display: inline-block;padding: .5em .8em; text-decoration:none;color:#999;}
  #ancillary a:hover, #ancillary a:active,#ancillary li.on a{color:#666}
  #ancillary li.on a {text-decoration:none;color:#666}
  #ancillary form{display: inline;}
  #ancillary form input{display: inline-block}
  /* mobile */
  #mobilenav, .toggleNav{display: none}

  /* Accessible dropdowns */
#mainnav>div>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>div>ul>li>button:focus-visible {
	opacity: 1;
}

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

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



/* MAIN ------------------------------ */
main {padding: 0;}
main > .wrap {padding: 4.75em 4vw 2em;}
main>div>aside, .donor-protections #content + aside{width:10rem; overflow:hidden;float: left; margin-top: 1.25rem;margin-right: 5rem;}
body.fullWidth  #content {width: 100%;margin: 0 auto;float: none}

#content:not(.hero){float:right;width:calc(100% - 15rem);padding:0 0 50px;overflow:hidden;min-height:600px;position:relative}
main.donor-protections #content {overflow: visible;}
#content.fullWidth {float:none;margin: 0 auto}
.pageHeader {padding-top: 3.6875rem;}

.wsManagementLogin td:first-child {width:40%; text-align: right}

main.donor-protections .anchor-links #content + aside {margin-top: -2.5rem;}


.twoCol {-webkit-columns:2;-moz-columns:2;columns:2;}
.threeCol {-webkit-columns:3;-moz-columns:3;columns:3;}
.resCol {
	-webkit-columns: auto;-moz-columns: auto;columns: auto;
	-webkit-column-width: 13em;-moz-column-width: 13em;column-width: 13em;
}

.formTable td{width:50%}
.formTable td{padding:0 0 .5em .5em}
.formTable td:first-child{padding:0 .5em .5em 0}
.formTable td[colspan="2"]{padding-right:0}
.formTable.formLoose,.formTable.formLoose td{width:auto}

.photoright{margin:0 0 3em 4em;}
.photoleft{margin:0 4em 3em 0;}

#biographies .biographies {display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-flex-direction: row;-ms-flex-direction: row;flex-direction: row;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;-webkit-align-content: stretch;-ms-flex-line-pack: stretch;align-content: stretch;-webkit-align-items: stretch;-ms-flex-align: stretch;align-items: stretch;}
#biographies .biographies a {width: 20%; margin: 1.5% 1.5% 1em;-webkit-order: 0;-ms-flex-order: 0;order: 0;-webkit-flex: 0 1 20%;-ms-flex: 0 1 20%;flex: 0 1 20%;-webkit-align-self: auto;-ms-flex-item-align: auto;align-self: auto;}

section {padding: 2.5em 0 6em;}

/* HOME -------------------------------- */
.hero {padding-top: 3.5625rem;}
.hero::before {
  height: 75vw;
  width: 75vw;
  right: 46%;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.85)
}
.hero.hero-with-video.hero-circle:before {
  border-radius: 50%;
  background: linear-gradient( 180deg , rgba(0, 133, 115, 1) 10% , rgba(159, 208, 201, 1) 90% );
}
.hero.hero-with-video.hero-circle:after { 
  right: 46%;
  width: auto;
  border-radius: 0 50% 50% 0;
}
  .hero h1 {margin-bottom: 1rem;font-size: 2.35em;}
.page-template-template-hero .hero h1:only-child {margin-top: 2rem;}
.hero-text {width: 50%;}
.hero-with-video .hero-text {
    width: calc(50% - 4.6875rem);
}
.hero-with-video :is(.hero-video, .hero-image) {
    width: 50%;
}
body:not(.home) .hero-text {max-width: 33rem;}
body:not(.home) .hero-text .secondary-header-subtext {font-size: 1.25em;}

main .hero .wrap {padding: 3.15rem 4vw;}
body.home main .hero + .white > .wrap {padding-left: 4vw; padding-right: 4vw;} 


.donor-protections-list li {width: calc(33.33% - 1.34rem); margin-left: 2rem; align-self: stretch; position: relative;}
.donor-protections-list li:nth-of-type(3n+1) {margin-left: 0;}

/* .donor-protections-list li .button {position: absolute; bottom: 0; right: 50%; transform: translateX(50%);} */
.donor-protections-list li:nth-of-type(n+4) {margin-top: 2em;}
.donor-protections-list a:hover .text-content, .donor-protections-list a:focus .text-content {color: #3B76B5;}
.donor-protections-list a:hover .icon, .donor-protections-list a:focus .icon {transform: scale(1.15);}


.grey-background-logo h2 {margin-bottom: 3.625rem;}
.grey-background-logo .right {float: right;width: 35%;margin-left: 6%;}
.grey-background-logo .left {width: 59%;height: 24em;margin-top: -1.25em;}

.aside-buttons .button + .button {margin-left: 1rem;}

/* DONOR PROTECTIONS ------------------- */
#main ul.anchor-list {columns: 2; column-gap: 0;}
#main ul.anchor-list li {
    width: 65%;
    display: inline-block;
    text-align: left;
}
.donor-block .wrap, #main .hero.hero-small + .anchor-links > .wrap, .grey-background-logo .wrap, .call-to-action .wrap {padding-left: 4vw;padding-right: 4vw;}

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

/* FAMILY BAR */
#nkr-familybar{
  line-height:2.125em;
  padding:.5em .5em .25em;
}
#nkr-familybar span{
  padding-right:.25em;
}
#nkr-familybar li:before{
  content:"\00A0\2022\00A0";
  display:contents;
}
#nkr-familybar a{line-height:2em;}      
#nkr-familybar a:hover,
#nkr-familybar a:active{
  text-decoration:none;
  border-color:rgba(75, 117, 176, 1);
}

body>footer .wrap nav {
  display: block;
}

body>footer .wrap nav span:first-of-type:before {
  display: none;
}

body>footer .wrap #web-solutions {float:right;margin-left:11px}
body>footer .wrap nav span:before {content: "|"; margin: 0 0.5em}
body>footer>.wrap {padding: 1.5rem 1rem;
  overflow: visible;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row-reverse;
}

body>footer .social-links a:hover {opacity: .7;}

/* FIND DONOR SHIELD */
#nkrcenterbuttons button {border-radius: .3em; margin:0 1%;}
#nkrcenterbuttons > button:first-of-type {margin-left: 0;}
#nkrcenterbuttons > button:last-of-type {margin-right: 0;}

/* MIN 1500 */
@media (min-width: 93.75em) {
    html {font-size: 1.1em;}
}

/* MIN 2000 */
@media (min-width: 125em) {
     html {font-size: 1.2em;}
     #nkrcenterbuttons button {font-size: .83em;}
}

/* 1400 */
@media (max-width: 87.5em) {
  #nkr-familybar {font-size: 0.9375rem;}
  #nkr-familybar svg {width: 1.5em; height: 1.5em;}
  #nkr-familybar nav, #nkr-familybar li {font-size: 0.8125rem;}
  #nkr-familybar span {padding-right: 0; padding-left: 1.75em;}
  #nkr-familybar a {padding: 0 0.25em;}
}

/* 1200 */
@media (max-width: 75rem) {
  #nkr-familybar span {display: none;}
  #nkr-familybar ul li:first-child:before {content: none;}
  #nkr-familybar nav, #nkr-familybar li {font-size: 0.7813rem;}
}

/* 1100 */
@media (max-width: 68.75em) {
  #mainnav a {font-size: 0.8125rem; padding: .3em .5em;}
  #brand {max-width: 14.75rem; padding: .5rem; margin-left: 0;}
  #main ul.anchor-list li {width: 80%;}

  .hero::before {right: 45%}
  .hero.hero-with-video.hero-circle:after {right: 45%;}

  .hero-text {width: 50%;}
  .hero h1 {font-size: 2.125em;}
  .hero-text .button {font-size: 1em;}

  /* find donor shield */
  #nkrcenterbuttons {flex-wrap: wrap;}
  #nkrcenterbuttons button {width: 50%; margin: 0;}
  #nkrcenterbuttons button:first-of-type {border-radius: .3em 0 0 0; border-bottom: 0;border-right: 0;}
  #nkrcenterbuttons button:nth-of-type(2) {border-radius: 0 .3em 0 0; border-bottom: 0; border-right: 1px solid var(--red);}
  #nkrcenterbuttons button:nth-of-type(3) {border-radius: 0 0 0 0.3em; border-right: 0;}
  #nkrcenterbuttons button:last-of-type {border-radius: 0 0 0.3em 0;}

}

/* 900 */
@media (max-width: 56.25em) {
 body>header {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-bottom: .5em;
 }
 .hero {padding-top: 6.3125rem;}
 #brand {padding: .45rem 0;}
 #mainnav a {font-size: 0.875rem; padding: .3em .8em;}
 .hero-with-video.hero-circle .hero-text {width: 50%;}
  .hero h1 {font-size: 2em;}
  .donor-protections-list li {width: calc(50% - 1rem);}
  .donor-protections-list li:nth-of-type(3n+1) {margin-left: 2rem;}
  .donor-protections-list li:nth-of-type(odd) {margin-left: 0;}
  .donor-protections-list li:nth-of-type(n+3) {margin-top: 2.5em;}
}

/* INTERNET EXPLORER */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .hero:before {
       border-radius: 0;
       height: 100%;
       width: 100%;
       top: 0;
       right: 0;
   }
}

/* FIREFOX - FOR FAMILY BAR */
@supports (-moz-appearance:none) and (all:initial) {
  #nkr-familybar {padding: .5em;}
}