@charset "UTF-8";
/* Web Solutions 4.0 Compatible */

/* text */
h1{ color:#FFF; font-size: 3.75rem; font-style: italic; font-weight: 900; text-transform: uppercase; }
h2 {font-size: 1.9375rem;}
h3 {color: #333;font-size: 1.0625rem;}
h4, th{color: #333;font-size: 1.0625rem;font-weight: 500;}
hr{margin: 2em 0}

.pageHeader h1 {margin: 0 auto;max-width: 100%;width: 72rem;}

/* HEADER ------------------------------*/
body>header{padding: 0 1.5rem;text-align: center;width: 100%;position: relative;z-index: 2;}
body.management>header {top: 2rem;}
body.management.management2>header {top: 4.75rem;}
#wsManagementBar2 { top: 2.125rem !important; }
body.interior>header { background: #FFF; }
body>header.sticky-header{background: #FFF; box-shadow: 0 1px 10px 0 rgba(0,0,0,.25); }
.home>header>.wrap,
body>header>.wrap {overflow: visible;display: flex;flex-direction: row;align-items: center;justify-content: space-between;padding: 1.5rem 0;}
#brand{display: block;height: auto;font-size: 0;}
#brand img{max-width: 100%;height: auto;}

body.home #brand img.interior { display: none; }
body:not(.home) #brand img.home { display: none; }

header.sticky-header { background: #FFF; }
body.home header.sticky-header #brand img.home { display: none; }
body.home header.sticky-header #brand img.interior { display: block; }

/* alert */
body>#alertApp+header.sticky-header{margin-top: 0;}
.management>#alertApp{top: 34px;}
body>#alertApp{font-size: 0;z-index: 10;cursor: pointer;width:100%;}
body>#alertApp, body>#alertApp.alertStatic:hover{width:100%; background:#D91414;padding-left: 1rem;padding-right: 1rem}
body>#alertApp #alertTitle{margin: 0 auto;font-weight:600;display: block;font-size: 1.125rem;padding: .5rem 1rem;line-height: 1.5;color:#fff;text-align:center;}
body>#alertApp #alertTitle a{color:#fff;text-decoration:underline}
body>#alertApp #pDesc {text-align: center}
body>#alertApp:hover { background:#9B0606;}

/* NAV ------------------------------ */
nav ul{margin: 0}
#mainnav{overflow:visible}
#mainnav ul{text-align:center;transition: ease all 200ms;overflow:visible;white-space: nowrap;margin: 0;padding: 0;}
#mainnav li{display:inline-block;margin: 0 1rem;position:relative;}
#mainnav>ul>li::after { content: ''; height: .5rem; left: 0; position: absolute; top: 100%; width: 100%; }
#mainnav a{border-radius: .1875rem;padding: .625rem 1.25rem .5rem;font-size: 1rem;line-height: 1.35;text-transform: uppercase;display:inline-block;color:#fff;text-decoration:none;}
#mainnav>ul>li:hover>a, #mainnav>ul>li:active>a{background: #EAEFF4;color: #06264C;}
#mainnav>ul>li.on>a{background: #1B497F;color:#fff;}

header.sticky-header #mainnav a { color: #1B497F; }

/*dhtml*/
#mainnav li ul{background: #EAEFF4;border-radius: .1875rem; box-shadow: 0 5px 14px 0 #C8D2D9; z-index:1;white-space: normal;width:12.5em;padding: .75rem 0;position:absolute;overflow:auto;height:auto;top: -200vh;opacity: 0;z-index: -1;visibility: hidden;transition: ease 200ms opacity 0.35s;}
body.home #mainnav li ul{ box-shadow: 0 5px 14px 0 #02223B; }
#mainnav li:hover ul {top: calc(100% + .25rem);opacity: 1;z-index: 1;visibility: visible;}
#mainnav li ul li{width:100%;margin: 0; display:block;float:left}
#mainnav ul li ul li a{background:none;border-radius: 0;color: #06264C;}
#mainnav li ul li a{font-size: .875rem;text-transform: none;padding: .5rem 1.125rem .375rem;display:block;width:100%;text-align:left;float:left;}
#mainnav li ul li a:hover, .t1 li ul li a:active{color:#fff;background:#004B87}


/* INTERIOR PAGE OVERRIDES */
body:not(.home) #mainnav>ul>li:hover>a, body:not(.home) #mainnav>ul>li:active>a{color: #FFF;background: #008EFF;}
body:not(.home) #mainnav li ul { background: #FFF; }
body:not(.home) #mainnav a { color: #1B497F; }

/* social and login */


/* mobile */
#mobilenav,.menu{display: none}

/* MAIN ------------------------------ */
.home > main, main.interior { margin-bottom: -5.5rem; position: relative; top: -5.5rem; z-index: 1; }

main>div>aside {
  width: 11.19em;
  overflow: hidden
}
.login-form + .createAccount h2 {font-size: 1.5em}
.login-form + .createAccount svg {height: 1.5rem}
.interior>main>.wrap {
  padding: 0 1.5rem;
  display: grid;
  grid-template-columns: 11.5rem auto 11.5rem;
  grid-template-areas: "sidebar content .";
  max-width: 75rem;
}

.interior.fullWidth>main>.wrap {
  grid-template-columns: 0 auto 0;
  grid-template-areas: ". content .";
}

.interior>main>.wrap>aside {
  grid-area: sidebar;
}

.interior>main>.wrap #content {
  grid-area: content;
  /* overflow: hidden; */
  min-height: 600px;
  position: relative;
  padding: 4rem 0 4rem 2.5rem;
}

.interior.fullWidth>main>.wrap #content {
  padding: 4rem 0;
  max-width:750px;
}

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


main>div>aside{overflow:hidden;}

body.fullWidth  #content {width: 100%;margin: 0 auto;float: none}
.photoright{margin:0 0 1em 2em;}
.photoleft{margin:0 2em 1em 0;}
#content.fullWidth {float:none;margin: 0 auto}
.wsManagementLogin td:first-child {width:40%; text-align: right}

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

.formTable td{width:50%}
.create-account .formTable td{width:33%}
.formTable td{padding:0 0 .5em .5em}
.formTable td:first-child{padding:0 .5em .5em 0}
.create-account .formTable td:first-child{padding:0 0 .5em .5em}
.formTable td[colspan="2"]{padding-right:0}
.formTable.formLoose,.formTable.formLoose td{width:auto}
.registration-form {max-width: 53.75rem; margin: 0 auto}

.styledTable.percentileTable tr:nth-child(even) td {background: rgba(0,0,0, 0.05);}

.flex-row#upcoming-tests .textbox {
  width: calc(50% - 0.5rem);
}


/* HOMEPAGE ------------------------------ */

#hero {
  padding: clamp(8.438rem, 5.913rem + 5.38vw, 10.625rem) 1rem clamp(4.688rem, 1.154rem + 7.54vw, 7.75rem);
}

#hero h1 {
  font-size: clamp(2.5rem, 1.058rem + 3.08vw, 3.75rem);
}

.test-ribbon:before,
.test-ribbon:after {
  	content: "";
	display: block;
	height: 1000vw;
	position: absolute;
	top: 50%;
	transform: translateY(-50%) rotate(-60deg);
}

.test-ribbon.blue:before,
.test-ribbon.blue:after {border-left: 19.6875rem solid #F9F9F9;}
.test-ribbon.blue:before {left: calc(50% - 62.5625rem);}
.test-ribbon.blue:after {right: calc(50% - 91.875rem);}

.test-ribbon.green {background:#F0F4F7}
.test-ribbon.green:before,
.test-ribbon.green:after {border-left: 19.6875rem solid #EAEFF4;}
.test-ribbon.green:before {left: calc(50% - 76.375rem);}
.test-ribbon.green:after {right: calc(50% - 31.0625rem);}

.test-ribbon .flex {
    align-items: flex-start;
    gap:2em clamp(2.5rem, 1.273rem + 6.14vw, 5.875rem);
}

.test-ribbon.green .ribbon-content {
  order:2;
}

.test-ribbon.green .actions > a:not(.button):is(:hover, :focus-visible) {
	border-color: rgba(6, 38, 76, 0.47);
}

.test-ribbon .used-by {
  max-width: 26.75rem;
}

.test-ribbon.green .used-by {
  order:1;
}

#content .test-ribbon .used-by ul {
	gap: 1.625em 1em;
}

#content .test-ribbon .used-by ul li {
    width: calc(50% - 0.8125em);
}

.test-ribbon .actions {
	gap:3em;
    margin-top: 2.875em;
}

.test-ribbon .actions .schedule-test {
	align-items: center;
}



/* REGISTER ------------------------------ */

.responsiveTable tr:hover td, .responsiveTable tr:nth-child(even):hover td { color: #FFF; background: #02223B; }

/* MEDIA QUERIES ------------------------------ */

@media (max-width: 1150px) {
  body.login #mainnav li { margin: 0 .75rem;}
  body.login #actions a { padding: .6875rem .75rem .5625rem; }

  #intro .scroll-buttons {width: 25rem;}
  #intro .button { margin: 0 .625rem 1.25rem;}
  #intro p {max-width: 35rem;}
  #intro.serve-fit img:first-of-type {height: auto;width: 15.625rem;}
  #intro.serve-fit img:last-of-type {height: auto;width: 20.625rem;}

  .interior>main>.wrap { grid-template-columns: 11.5rem auto; grid-template-areas: "sidebar content"; }
  .interior>main>.wrap #content { padding: 4rem 0 4rem 1.5rem; }

  #intro.serve-fit img:first-of-type {left: -9rem;top: 8rem;}
  #intro.serve-fit img:last-of-type {right: -11rem;transform: scaleX(-1);}
  #intro.live-fit img:first-of-type {left: -1rem;}
  #intro.live-fit img:last-of-type {right: -11rem;transform: scaleX(-1);}

  .styledTable.percentileTable th, .styledTable.percentileTable td {padding-left: .5rem; padding-right: .5rem;}

}

@media (max-width: 1023px) {
  body.login>header {padding: 0 1rem; }
  #mainnav a {padding: .625rem .75rem .5rem;}
  body.login #mainnav li { margin: 0 .25rem; }
  body.login #mainnav a { padding: .625rem .5rem .5rem;}
  body.login #actions a { padding: .6875rem .6255rem .5625rem;}

  h1 { font-size: 3rem; }
  h2 { font-size: 2.125rem; }

  #ps-fitness-tests h2>svg, #fitness-testing h2>svg {top: 0;}
  #ps-fitness-tests img { left: 50%; top: 12rem; width: 26.5625rem; }
  #fitness-testing img { right: calc(50% + 2rem); bottom: 14.5rem; width: 26.5625rem; }

  .test-ribbon .flex {
    flex-direction: column;
  }

  .test-ribbon .used-by {
    max-width: 100%;
    order:1;
    padding: 1.5em 1em;
    width: 100%;
  }

  #content .test-ribbon .used-by ul {
    justify-content: space-around;
    margin: 0;
  }

  #content .test-ribbon .used-by ul li {
    width: auto;
  }

  .test-ribbon .ribbon-content {
    order:2;
  }


}

@media (max-width: 850px) {
  #brand img { width: 10rem }
  #mainnav li { margin: 0 .25rem; }

  #ps-fitness-tests .col-text, #fitness-testing .col-text { width: 100%;}
  #ps-fitness-tests, #fitness-testing { padding: 3rem 1.5rem; }
  #ps-fitness-tests .row, #fitness-testing .row { padding: 0 ;}
  #ps-fitness-tests h2>svg, #fitness-testing h2>svg {margin: 0 .75rem 0 .2rem;}
  #ps-fitness-tests .desktop, #fitness-testing .desktop { display: none; }
  #ps-fitness-tests .mobile, #fitness-testing .mobile { display: block; }
  #ps-fitness-tests p, #ps-fitness-tests ul.checkmark li, #fitness-testing p, #fitness-testing ul.checkmark li { width: auto; }
  #ps-fitness-tests img, #fitness-testing img { bottom: 0; left: 50%; right: auto; top: auto; max-width: 100%; position: relative; transform: translateX(-50%); width: auto; }
  #ps-fitness-tests svg.slash { left: 0; top: calc(50% + 3.5rem); }
  #ps-fitness-tests ul.inline.icons, #fitness-testing ul.inline.icons { flex-flow: row wrap; }
  #ps-fitness-tests ul.inline.icons li, #fitness-testing ul.inline.icons li { margin: 0 0 2rem; padding: 0 1rem; width: 50%;}
  #fitness-testing svg.slash { bottom: calc(50% - 75rem);	left: 50%; right: auto;	transform: translateX(-50%); }
  #fitness-testing .col-text { margin-left: 0; }

  #candidates.detail-list .row { margin-top: 1.5rem; }
  #candidates.detail-list .flex-row.more-info { flex-wrap: wrap; }
  #candidates.detail-list .flex-row.more-info .textbox { width: 100%;}

  body.login #mainnav li { margin: 0 .125rem; }
  body.login #mainnav a {font-size: .9375rem;padding: .625rem .5rem .5rem;}
  body.login #actions a {font-size: .9375rem;padding: .6875rem .5rem .5625rem;}

}


/* ------------ ------- STYLE-D.CSS ------- ------------ */