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

body {line-height: 1.5}

/* text */
h1{font-size:2rem; text-align: center; font-style: italic; font-weight: 900; text-transform: uppercase; color:#FFF}
h2, .subheading {font-size: 1.25rem;}
h3 {font-size:1.3125rem}
h4, th{font-size:1.125rem}
hr{margin: 2rem 0}
.content ul li::before {top:0.5rem}
.login-form + .createAccount svg {height: 1.5rem}
#brand {display: block;max-width: 10rem;}
#brand img {display: block; max-width: 100%; height:auto;}
#brand img.home { display: none; }
body.home { background: #FFF; }
header > .wrap {display: flex;flex-direction: row;align-items: center;justify-content: space-between;padding: 0.75rem 0.5rem; }

#actions a {font-size: .75rem;padding: .625rem 1.25rem .5rem;}

/* addon classes */
.twoCol, .threeCol, .resCol{
	-webkit-column-rule:1px outset rgba(0,0,0,.15);
	column-rule:1px outset rgba(0,0,0,.15);
	-webkit-columns: auto;
	columns: auto;
	-webkit-column-width: 13em;
	column-width: 13em;
}

/* list */
.content ul li {padding-left: 1.5em;}
/* forms */
.formTable, .formTable table{width:100%;display: block}
.formTable tbody{display: block}
.formTable tr{display: block}
.formTable td{display: block;width:100%;padding: 0}
.formTable input[type="text"], .formTable input[type="password"], .formTable input[type="tel"], .formTable input[type="number"], .formTable input[type="email"], .formTable input[type="url"], .formTable textarea{margin-bottom:1em}
.formTable table td + td {padding-left: 0 !important;}
button, .button, input[type="button"], input[type="submit"], input[type="reset"] {font-size: 1rem}
/* nav */
body>header:before{content: "";opacity: 0; z-index: 3;background-color: #fff;display: block;position: fixed;left:100vw;top:0;width:100vw;height:100vh;transition:left 0ms ease 200ms, opacity 200ms ease}
body.slideNav>header:before{left:0;opacity: .85;transition:left 0ms ease 0ms, opacity 200ms ease}
body.slideNav {overflow: hidden}

#navContainer{position: fixed;left: 100%;top:0;bottom:0;width: 75%;background-color:#02223B;z-index: 15;-webkit-transition: left 200ms ease;transition: left 200ms ease;}
body.management #navContainer { top: 2.125rem}
.slideNav #navContainer{left: 25%;}
#navContainer nav{display: inline}
#navContainer ul{display: block;float: left;width: 100%;margin: 0;padding-left: 0}
#navContainer li{display:block;float: left;margin: 0;width: 100%;position: relative;border-top: 1px solid rgba(255,255,255,.25);}
#mainnav > ul > li {border-top: 1px solid rgba(255,255,255,.25);margin: 0;}
#mainnav > ul > li > a, #navContainer .menu {font-size: 1.125rem;}

body>header #navContainer a, #navContainer .menu{color: #FFF;font-size: 1.125rem;padding: 1rem 1rem;display:block;float: left;width: 100%;}

body>header #navContainer a:hover,#navContainer .menu:hover, body>header #navContainer li.open a:hover{ background: #008EFF; }
body>header #navContainer li.open a { background-color: rgba(255,255,255,.1)}
body>header #navContainer li.on>a{background-color: #008EFF; }
body>header #navContainer li>span{display: block;position: absolute;right: .25rem;top: .375rem;width:2.75em;height: 2.75em;}
body>header #navContainer li>span:before{content: "";display: block;width: 50%;height: .1875rem;background-color: #FFF;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%) rotate(90deg);transform-origin: center center;}
body>header #navContainer li>span:after{content: "";display: block;width: 50%;height: .1875rem;background-color: #FFF;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);transform-origin: center center;}
body>header #navContainer li.open > span {transform: rotate(-135deg);}
body>header #navContainer li > span::before { -webkit-transition: -webkit-transform .2s ease; transition: -webkit-transform .2s ease; transition: transform .2s ease; transition: transform .2s ease, -webkit-transform .2s ease;}
body>header #navContainer ul ul {font-size: .8em;display: none}
body>header #navContainer ul ul a {padding: 1rem 1rem 1rem 1.75rem;}
body>header #navContainer ul ul li.on a {background-color: #008EFF;}

aside.menu svg {height: 1.5rem;position: relative;top: .375rem;width: 1.5rem;}

#mobilenav {
	background-color: #02223B;
	width: 100%;
	text-align: center;
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-direction: row;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	flex-direction: row;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-ms-flex-pack: center;
	-webkit-box-pack: center;
	justify-content: center;
	-ms-flex-line-pack: center;
	align-content: center;
	-ms-flex-align: center;
	-webkit-box-align: center;
	align-items: center;
}

#mobilenav a, #mobilenav span{
	color: #fff;line-height: 2.5rem;
	-ms-flex-order: 0;
	-webkit-box-ordinal-group: 1;
	order: 0;
	-ms-flex: 1 1 auto;
	-webkit-box-flex: 1;
	flex: 1 1 auto;
	-webkit-align-self: auto;
	-ms-flex-item-align: auto;
	align-self: auto;
}
#mobilenav *+* {border-left: 1px solid rgba(255,255,255,0.25)
}
#mobilenav a:hover, #mobilenav span:hover{color: #FFF;background-color: #008EFF;}
.hamburger{position: relative;height: 2.25rem;padding: .25rem;width: 2.5rem;display: block;position: fixed;right: .5rem;top:.5rem;opacity: .5;z-index: 10;opacity: 0;}
body.management .hamburger { top: 2.625rem; }
.hamburger.on{opacity: .5}
#mobilenav span.menu svg { pointer-events: none; position: relative; top: .1875rem;}
span.menu.hamburger { background: #008EFF;}
span.menu.hamburger svg { height: auto; margin: 0 auto; display: block;pointer-events:none; position: absolute; left: 50%; top:50%; transform: translate(-50%,-50%);  width: 50%; z-index: 1;}
span.menu.hamburger svg path { fill: #FFF;}
.hamburger.on:hover { opacity: .75; }
/* alert */
.management>#alertApp{margin-top: 34px;}
body>#alertApp, body>#alertApp.alertStatic:hover{width:100%; background:#D91414;padding-left: 1rem;padding-right: 1rem}
body>#alertApp #alertTitle{margin:0; font-weight:600; display: block; font-size:1em;padding:1em; 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;}


/* content */
.interior #top h1 {margin-bottom: 0}
.pageHeader {text-align: center; padding:2rem 1rem}
.pageHeader h1 {font-size: 2rem}
.pageHeader p {font-size: 1.25em; line-height: 130%; }

#content {padding:1rem 1.5rem;}
#content.home, #content.serve-fit, #content.live-fit, #content.test-landing { padding: 0; }

#sidenav {padding: 0 1.5rem;}
#sidenav>ul {border-top: 3px solid #C8D2D9;padding: 2rem 0;}

.photoright{margin:0 0 .75em 1em;}
.photoleft{margin:0 1em .75em 0;}

body.login .half { flex-direction: column; }
.login-form,.createAccount { width: 100%; }
.login-form+.createAccount { margin-left: 0; }

.registration-form h2 .test-fee {
	background: #41CB00;
	font-size: 1rem;
	font-weight: 500;
	color: #fff;
	padding: .125em 1.25em;
	border-radius: 4px;
	float: none;
	display: block;
	text-align: center;
	margin: 1em 0;
}
.registration-form h2 .accepted-payment {display: block;margin: 0 auto;float: none;}

.registrantFilters {
	flex-wrap: wrap;
}


/* footer */
body>footer {text-align: center}
body>footer .fatFooter{
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-direction: column;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	flex-direction: column;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-ms-flex-pack: start;
	-webkit-box-pack: start;
	justify-content: flex-start;
	-ms-flex-line-pack: stretch;
	align-content: stretch;
	-ms-flex-align: stretch;
	-webkit-box-align: stretch;
	align-items: stretch;
}
body>footer .fatFooter > *+* {margin-top: 2em}
body>footer .fatFooter > div {order: 1}
body>footer .fatFooter > nav {order: 2}
body>footer .fatFooter > address {order: 3}
#web-solutions-exposure{
	-ms-flex-order: 1;
	-webkit-box-ordinal-group: 2;
	order: 1;
}
body>footer .wrap nav a+span:before {content: "|"; margin: 0 0.5em}
body>footer  .social-media a { margin: .75rem .375rem 0;}
body>footer>.fatFooter nav { text-align: center; }

/* HERO ------------------------------ */
#hero {
    align-items: center;
    display: flex;
    justify-content: center;
    padding: 3em 1em;
}
#hero .button { display: table; margin: 0 auto; }
#hero .button + .button { margin: 1.5rem auto 0;}

/* HOMEPAGE RIBBONS 1 + 2 ------------------------------ */

.test-ribbon h2 {
	font-size: 1.5em;
}

.test-ribbon .flex {
	flex-direction: column;
	gap:2em;
}

.test-ribbon .flex .used-by {
    gap:1em;
    margin: 0;
    order: 1;
    padding: 1.5em 1em;
}

.test-ribbon .used-by h3 {font-size: 1em;}

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

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

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

.test-ribbon .actions {
	gap: 1em;
	margin-top: 2.875em;
	justify-content: center;
}

.test-ribbon .actions .schedule-test {
	display: block;
	padding-top: 1em;
}

.test-ribbon .actions ul {
	flex-direction: column;
	margin-top: 0.5em;
}

.test-ribbon.green .actions > a:not(.button) {
	margin-top: 1em;
}


/* INTRO ------------------------------ */
#intro, #intro.serve-fit {flex-direction: column;padding: 1.5rem 1.5rem 3rem;}
#intro .textbox { position: static; transform: none; }
#intro svg {transform: none}
#intro h1>svg, #intro h1>img { max-width: 100%; }
#intro .scroll-buttons {width: 25rem;}
#intro .button { margin: 0 .625rem 0.5rem;}

#intro.serve-fit img:first-of-type, #intro.live-fit img:first-of-type {
	display: block;
	margin: 1em auto 0;
	position: static;
	max-height: 290px;
}
#intro.serve-fit img:last-of-type, #intro.live-fit img:last-of-type { display: none; }

#intro.test-landing { padding: 4rem 1.5rem 1rem; }


/* DETAIL LIST SECTIONS ------------------------------ */
.detail-list .flex-row { flex-wrap: wrap; padding: 1rem 0 3.75rem; width: 100%}
.detail-list:first-of-type .flex-row { padding-top: 0; }
.detail-list h2 {font-size: 1.75em}
.detail-list h3 {margin-top:1em}
.detail-list .textbox, .list { width: 100%; }
.detail-list .list {padding:0.5rem 1rem}
.list { margin-top: 1rem; }
#content .detail-list li {padding-left: 2rem}
#candidates.detail-list .row { margin-top: 0; }
#candidates.detail-list .flex-row.more-info {padding-bottom: 2.35rem}
/* BLOG ------------------------------ */
#blog .flex-row { flex-wrap: wrap; }
#blog > div {font-size: 1.5rem;}
#blog svg { margin: 0 auto .625rem; }
#content #blog li {margin: 3rem 0 0;padding: 0;width: 100%;}
#content #blog li:first-child { margin-top: 1rem; }

/* REGISTER ------------------------------ */
#register {padding: 4rem 1.5rem 4rem;}
.styledTable tr:first-child, .styledTable th { display: none; }

.styledTable tr, .styledTable td {
	display: block;
	line-height: 120%;
	float: left;
	clear: both;
	width: 100%
}

.styledTable tr {
	margin-bottom: 2rem;
	padding: 1.5rem 0;
	border: 1px solid rgba(0,0,0,.125);
	background: #F2F4F5;
}

.styledTable td:before {
	content: attr(data-attribute);
	color: #666;
	display: block;
	text-align: left;
	font-size: .75em;
	font-weight: 400;
	font-style: italic;
}
.styledTable td[data-workout] {padding-top: 3rem; position: relative;}
.styledTable td[data-workout]:after {
	content: attr(data-workout);
	color: #02223B;
	font-size: 1rem;
	position: absolute;
	top: 1.5rem;
	left: 1rem;
}
.styledTable td:first-child { font-size: 1.125em; font-weight: 900; }
.styledTable td:first-child:before { display: none; }
.styledTable td { border: 0; font-size: 1rem; font-weight: 500; }
.styledTable td .button {
	display: block;
	font-size: 1rem;
	text-align: center
}

#passing-scores .styledTable td, #passing-scores .styledTable tr th:last-of-type, #passing-scores .styledTable tr td:last-of-type, .table-test .styledTable th, .table-test .styledTable td, #passing-scores .percentileTable.styledTable tr th:last-of-type, #passing-scores .percentileTable.styledTable tr td:last-of-type { text-align: left; }

/* COMPONENTS------------------------------ */
#components .flex-row>li { width: 100%; }
#components li:nth-child(2n+2) {transition-delay: 0s;}

/* EVENTS ------------------------------ */

.events { flex-direction: column; }
.events div { margin: 0 auto 3rem; width: 100%; }
.events div+div { margin: 0 auto; }

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

@media (max-width: 575px) {
	#ps-fitness-tests h2, #fitness-testing h2 { text-align: center; }
	#ps-fitness-tests h2>svg, #fitness-testing h2>svg {display: block; float: none; margin: 0 auto 1.5rem;}

	body.login #mainnav li { margin: 0 .375rem; }
	body.login #actions a { padding: .6875rem .75rem .5625rem; }
	body.login #actions a[href='/Exams/Login/'] { display: none; }
}

@media (max-width: 420px) {
	body.login #brand img { width: 8rem }
	#fitness-testing .icon-button { margin-right: 1.25rem; }
	#ps-fitness-tests h2, #fitness-testing h2 { text-align: center; }
	#ps-fitness-tests h2>svg, #fitness-testing h2>svg{ display: block; margin: 0 auto 1.5rem; }
}

/* ------------ ------- STYLE-M.CSS ------- ------------ */
