/* @import url(/includes/css/grid-flex.css); */
@charset "UTF-8";

:root {
	--purple: #7E0C6D;
	--dark-purple: #4F0A45;
	--dark-grey: #615D59;
	--grey: #F0F0EF;
	--green: #8E8B00;
	--gutter: 1.5em;
}


/* Web Solutions 4.0 Compatible */
html {-webkit-box-sizing:border-box;box-sizing:border-box;}
*, *:before, *:after {-webkit-box-sizing:inherit;box-sizing:inherit;}
body {margin:0;padding:0;-webkit-text-size-adjust:none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}

img{border: 0}
ul{padding-left: 0}
ul li{list-style:none}
html, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, hr{
	font-family:inherit;
	font-size:inherit;
	font-style:inherit;
	font-weight:inherit;
}

table {border-collapse:collapse}
td, th {empty-cells:show;vertical-align: middle;text-align:left;}
body {background:#333}
#skipNavigation{background:#fff;color:#000;padding:.5em;position:absolute;left:0;top:-1000px;z-index:10}
#skipNavigation:focus,#skipNavigation:active{top:0;}
iframe[src="/management/login/persistSession.aspx"] {display: none}
/*page widths*/
body>header, #mainnav, main, body>footer, #alertApp{width:100%;clear:left;display:block;}
body>*>.wrap, .wrap, body>footer>.fatFooter,#alertApp>*,.home .wrap{width:100%;max-width: 77rem;margin-left:auto;margin-right:auto;position:relative;overflow:auto;padding-left: var(--gutter);padding-right: var(--gutter);}

body.interior>main>.wrap { max-width: 61.75em; }

/* FONT FACES ------------------------------ */

/* Source Sans Pro Light */
blockquote footer {
	font-family: 'Source Sans Pro', sans-serif;
	font-style: normal;
	font-weight: 300;
}

/* Source Sans Pro Regular */
#alertApp h2, #callouts h2>span, body>header #mainnav ul li ul li a,
body>footer button, #sidenav li li a, #welcome h1>span {
	font-family: 'Source Sans Pro', sans-serif;
	font-style: normal;
	font-weight: 400;
}

/* Source Sans Pro Regular Italic */
em {
	font-family: 'Source Sans Pro', sans-serif;
	font-style: italic;
	font-weight: 400;
}

/* Source Sans Pro Semi-bold */
h1, h2, h3, h4, h5, h6, #sidenav li a, #events .date {
	font-family: 'Source Sans Pro', sans-serif;
	font-style: normal;
	font-weight: 600;
}

/* Source Sans Pro Semi-bold Italic */
blockquote, blockquote p {
	font-family: 'Source Sans Pro', sans-serif;
	font-style: italic;
	font-weight: 600;
}

/* Source Sans Pro Bold */
#mainnav a, #navContainer .menu , .links h2, button, .button, body>header #mobilenav a, #mobilenav span,
input[type="button"], input[type="submit"], input[type="reset"], p.intro, .intro {
	font-family: 'Source Sans Pro', sans-serif;
	font-style: normal;
	font-weight: 700;
}

#welcome h1, #callouts h2 {
	font-family: 'Kaushan Script', cursive;
	font-style: normal;
	font-weight: 400;
}

/* text */
body, .text, input, button, select, textarea { font-family:'Source Sans Pro', sans-serif;line-height:1.5;color:#666;-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.text{font-size: 1rem}
a, a *{color: var(--purple);text-decoration:none;}
a:hover, a:active, a:hover *, a:active *{color: var(--green);}
p,h1,h2,h3,h4,hr,#content ul,.contentEditor ul,blockquote,dd,ol{margin-top:0;margin-bottom:1rem}
h1, h2, h3, h4, h5, h6, th{ line-height: 120%;}

p + h2, p + h3, p + h4, p + h5, p + h6,
ul + h2, ul + h3, ul + h4, ul + h5, ul + h6 { margin-top: 2rem; }

.textColor, h1, h2, h3, h4, h5, h6, th, dt{color:#000}

em, i, q, cite, .italic{font-style:italic}
b, strong{font-weight:700}
u{text-decoration:none}
hr{border:0;border-top:1px solid rgba(0,0,0,.15);margin:1em 0;padding-top:1px}

#content time { font-size: 1.125em; }
p {font-size: 1.125em;}

h1 {font-size: 1.875em; }
h2 { color: var(--purple); font-size: 1.875em; }
h3 { color: #000; font-size: 1.5em; }
h4, th { color: var(--green); font-size: 1.25em; }
h5 { color: var(--purple); font-size: 1.125em; }
h6 { color: #000; font-size: 1.0625em; }

.pagebanner h1 { color: #FFF; font-size: 2.5em; }

.intro {color: #000;font-size: 1.25em;margin: 0 0 1.5em;}

.highlight h1, .highlight h2 { color: #000; font-size: 1.875em; }

sup, sub {font-size:.6em; line-height:.6em;vertical-align:baseline;position:relative}
sup {bottom:1ex}
sub {top:.5ex}

blockquote {
	color: var(--purple);
	float: right;
	font-size: 1.375em;
	margin: 0 0 0 2em;
	max-width: 50%;
	text-align: right;
	width: 300px;
}

blockquote p { color: inherit; font-size: inherit; quotes: '\201c' '\201d'; }
blockquote p::before { content: open-quote; }
blockquote p::after  { content: close-quote; }

blockquote footer {
	color: #4A4A4A;
	font-size: .72em;
}

blockquote footer::before {
	content: '- ';
}

figcaption {
	color: var(--dark-grey);
	font-size: .8125rem;
	text-align: right;
}


/* ANCILLARY ------------------------------ */
a font { color: inherit; }
body>header #ancillary a {
  color:#999;
  display: inline-block;
  padding: 0;
  position: relative;
  text-decoration:none;
  width: 1.25rem;
  height: 1.125rem;
}

body>header #ancillary a::after,
body>header #ancillary a::before {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: auto 100%;
  bottom: 0;
  content: '';
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

body>header #ancillary li.user a::after { background-image: url('/images/icons/user-purple.svg'); }
body>header #ancillary li.user a::before { background-image: url('/images/icons/user.svg'); }

body>header #ancillary li.logout a::after { background-image: url('/images/icons/sign-out-purple.svg'); }
body>header #ancillary li.logout a::before { background-image: url('/images/icons/sign-out.svg'); }

body>header #ancillary li.cart a::after { background-image: url('/images/icons/cart-purple.svg'); }
body>header #ancillary li.cart a::before { background-image: url('/images/icons/cart.svg'); }

#google_translate_element {display: inline-block;}

/* MAIN ------------------------------ */
.menu{cursor: pointer}
.contentEditor{background:#fff;min-width:100%;}

main, .mceContentBody{ background: #FFF; font-size: 1rem; overflow: hidden; }

main>.butterfly {
	height: auto;
	position: absolute;
	z-index: 2;
}

main>.butterfly:nth-of-type(1) {
	right: -1em;
	top: .5em;
	-webkit-transition-delay: .5s;
	-o-transition-delay: .5s;
	transition-delay: .5s;
	width: 10em;
}

main>.butterfly:nth-of-type(2) {
	top: 2em;
	width: 8.3125em;
}

footer .butterfly { display: none; }

main.interior + footer .butterfly {
	display: block;
	height: auto;
	left: -1.5em;
	position: absolute;
	top: -7.5em;
	width: 10.625em;
	z-index: 2;
}


/* sidenav */
#sidenav{width:100%;overflow:hidden;margin:0 0 3rem}
#sidenav ul{padding: 0}

#sidenav>ul>li {padding: 0 0 .125rem;position: relative;}

#sidenav>ul>li::after {
	background-color: #FFF;
	background-image: -webkit-gradient(linear, left top, right top, color-stop(60%, var(--green)), color-stop(0%, #FFF));
	background-image: -o-linear-gradient(left, var(--green) 60%, #FFF 0%);
	background-image: linear-gradient(to right, var(--green) 60%, #FFF 0%);
	background-position: 0 top;
	background-size: 10px 1px;
	background-repeat: repeat-x;
	bottom: 1px;
	content: '';
	height: .125rem;
	left: 0;
	opacity: .4;
	position: absolute;
	width: 100%;
}

#sidenav li a{color: #000;font-size: 1.125rem;padding: .3125em 1.875rem .3125em .5rem;position: relative;line-height:1.1em;display:block;}
#sidenav li a:hover, #sidenav li a:active{background:#e5e5e5}
#sidenav li.on>a{background: var(--purple);color: #FFF; position: relative; }

#sidenav>ul>li.on>a::after {
	background-image: url('/images/icons/angle-down-white.svg');
	background-repeat: no-repeat;
	background-position: right .5em center;
	background-size: 1em 1em;
	bottom: 0;
	content: '';
	left: 0;
	opacity: .6;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: 0;
}

/* t2 */
#sidenav li.on ul{background: #F0F0EF;border: 1px solid #F0F0EF;margin: 0 0 .1875em;}
#sidenav li.on ul li a{padding:.3em .5rem .3em .5rem;font-size: .9375rem;color:#666;}
#sidenav li ul li a:hover,
#sidenav li ul li a:active,
#sidenav li ul li.on>a{color: var(--green);background: #FFF;}
/* t3 */
#sidenav li ul li.on ul{padding-bottom:.5em;border:0}
#sidenav li ul li.on ul li{border:0}
#sidenav li ul li.on ul li a{padding-left:1rem;font-size:.8em;color:#666}
#sidenav li ul li ul li a:hover,
#sidenav li ul li ul li a:active,
#sidenav li ul li ul li.on>a{color:#000; background:#e5e5e5;}
/* t4 */
#sidenav ul ul ul { display: none; }
#sidenav li ul li ul li.on ul li a{padding-left:1.5rem;font-size:.7em;color:#666}
#sidenav li ul li ul li ul li a:hover,
#sidenav li ul li ul li a:active,
#sidenav li ul li ul li ul li.on>a{color:#000; background:#f5f5f5;}

/*section callouts*/
main>div>aside section{margin:0 0 20px;padding:10px}
main>div>aside section:hover{background:#FFC}
main>div>aside section h1{margin:0;font-size:1.2em}
main>div>aside section p{margin:0}

/* MAIN ------------------------------ */
.pagebanner {
	background: var(--dark-purple);
	font-size: 1rem;
	margin: 0 0 4em;
	padding: 1.625em var(--gutter);
	position: relative;
	text-align: center;
}

.pagebanner::before {
	background: url('/images/pattern.svg') repeat left top / auto .75rem;
	content: '';
	height: 100%;
	left: 0;
	opacity: .1;
	position: absolute;
	top: 0;
	width: 100%;
}

.pagebanner .wrap { overflow: hidden; }

.pagebanner h1 { margin: 0; }

/* breadcrumb ----------------------------- */
.breadcrumb{margin-bottom: 1em}
.breadcrumb a:after{content: "\00A0\00A0\203A\00A0"}

/* content */
.content{word-wrap:break-word}
#content .photoright, #content .photoleft{max-width:50%;height:auto}
#content .photoright img,#content .photoleft img {max-width:100%;height:auto;margin: 0;float: none}
#content img.phototreatment{max-width:50%;height:auto}
#content figure.phototreatment{width: 100%;text-align: center}
#content figure.phototreatment img{max-width: 100%;width: auto;height: auto}
img.phototreatment,img.photoright,img.photoleft,.photoright img,.photoleft img {max-width: 100%;height: auto}
.photoright{float:right;clear:right}
.photoleft{float:left;clear:left}
.muted {opacity:0.5;filter:alpha(opacity=50)}
.highlight, #content .highlight{background: #F6F6EC; clear:both; padding: 1.75em 1.5em;position: relative;margin: 2em 0;z-index: 0;}
.highlight::before {z-index: -1; }
small, .textSm{font-size:.8em}
#content table{width:100%}

.shareIcons{display:inline-block;position:relative;overflow:auto}
.shareIcons a{display:block;float:left;margin:0 .5em 1em 0;height:20px;width:20px;background-position:center center; background-repeat:no-repeat;background-size:contain;border-radius:.2em;-webkit-box-shadow: inset 0px -2px 0px 0px rgba(0, 0, 0, .2);box-shadow: inset 0px -2px 0px 0px rgba(0, 0, 0, .2)}
.shareIcons a:hover{background-color:#F03C5E}
.shareFacebook{background-color:#3b5998; background-image:url(../../images/icons/64x64/facebook.png)}
.shareTwitter{background-color:#00aced; background-image:url(../../images/icons/64x64/twitter.png)}
.shareLinkedin{background-color:#007bb6; background-image:url(../../images/icons/64x64/linkedin.png)}
.shareGoogle{background-color:#dd4b39; background-image:url(../../images/icons/64x64/google-plus.png)}

/* list */
#content ol { margin-left: 2em }
#content ol li {
	font-size: 1.125em;
	margin: 0 0 1em;
	padding: 0 0 0 .25em;
}
#content ol ol li {list-style: lower-alpha}

#content ul li {
	font-size: 1.125em;
	margin: 0 0 .5em;
	padding-left:2em;
	position: relative;
}

#content ul ul { margin: .75em 0}
#content ul li li, #content ol li li { font-size: 1em; }

#content ul li:before{
	background: url('/images/icons/angle-right.svg') no-repeat center center / cover;
	content: '';
	height: .625em;
	left: 1em;
	position: absolute;
	width: .35em;
	text-align: center;
	text-indent:0;
	top: .4375em;
}

#content ul li ul li:before{opacity: .5}

#tinymce ul { padding-left: 2em; }
#tinymce ul li {
	list-style: disc !important;
	list-style-position: inside;
}

/* addon classes */
.clearFloats{clear:both}
.nobr{white-space: nowrap}
.twoCol, .threeCol, .resCol{
	-webkit-column-rule:0;
	-moz-column-rule:0;
	column-rule:0;
	-webkit-column-gap:2em;
	-moz-column-gap:2em;
	column-gap:2em;
}
.req{color:#c00}
.textIcon{background:#999; background-color:rgba(0,0,0,.2);font-size:.8em;line-height:1em;display:inline-block;padding:.2em .4em;border-radius: .5em;color:#fff}
.textIcon:hover{background:#666; background-color:rgba(0,0,0,.4);color:#fff}
.clearfix:after{content: "";display: table;clear: both;}

.videoContainer {margin: 0 0 2em;width: 100%;height:0;line-height:0;position: relative;padding-top:56.25%; /* 16:9 */}
.videoContainer.ratio-4-3 {padding-top:75%; /* 4:3 full-frame */}
.videoContainer iframe {position:absolute;left:0;top:0;right:0;bottom:0;width:100%;height:100%;border:0}
.interior #content .links {padding-top: 0;}
.interior #content .links ul li:before {display: none;}
.interior #content .links ul li{padding-left: 0;}
/* forms */
input, button, select, textarea {font-size:1rem;line-height: 1.2em}
input[type="text"], input[type="password"], input[type="tel"], input[type="number"],
input[type="email"], input[type="url"], input[type="search"], textarea, select,
input[type="button"], input[type="submit"], input[type="reset"] {
	border-radius:0;
	outline: none;
	-webkit-appearance:none;
	font-size: 1rem
}

input[type="text"],input[type="date"], input[type="password"], input[type="tel"], input[type="number"],
input[type="email"], input[type="url"], input[type="search"], textarea, select{
	border: 1px solid #F2F2F2;
	background-color: #FAFAFA;
	padding: .5625em .5em;
	width: 100%;
}

input[type="text"]:focus,input[type="date"]:focus, input[type="password"]:focus, input[type="tel"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, textarea:focus, select:focus{background-color: #fff;}
textarea{display:block;}

select option{padding:0 .2em}

select::-ms-expand { display: none; }

select {
	background-image: url('/images/icons/select-arrows.svg');
	background-repeat: no-repeat;
	background-position: -webkit-calc(100% - .875em) -webkit-calc(50% + .125rem);
	background-position: -webkit-calc(100% - .875em) calc(50% + .125rem);
	background-position: calc(100% - .875em) calc(50% + .125rem);
	padding-right: 2.15rem;
	-webkit-appearance: none;
	-moz-appearance: none;
}

input::-moz-focus-inner { border:0; padding:0; }

button,.button,input[type="button"],
input[type="submit"], input[type="reset"] {
	background: var(--purple);
	border: .125rem solid var(--purple);
	color: #FFF;
	cursor: pointer;
	display: inline-block;
	font-size: 1em;
	line-height: 1em;
	margin: .25em;
	padding: .625em 1.5em;
}

button:hover,.button.hover,input[type="button"]:hover,
input[type="submit"]:hover,input[type="reset"]:hover,
.button:hover,.button:focus,input[type="button"]:focus,
input[type="submit"]:focus,input[type="reset"]:focus {
	background-color: var(--green);
	border-color: var(--green);
	color:#fff;
}

.button.green, button.green {
	background: var(--green);
	border-color: var(--green);
}

.button.green:hover, button.green:hover,
.button.green:focus, button.green:focus {
	background-color: var(--purple);
	border-color: var(--purple);
}

.button.black, button.black {
	background: #000;
	border-color: #000;
}

.button.black:hover, button.black:hover,
.button.black:focus, button.black:focus {
	background-color: var(--purple);
	border-color: var(--purple);
}

.button.outlined, button.outlined {
	background-color: #FFF;
	color: var(--purple);
}

.button.outlined:hover, button.outlined:hover,
.button.outlined:focus, button.outlined:focus {
	border-color: var(--green);
	color: var(--green);
}


.button{display: inline-block}
button img{height:1em;width:auto;vertical-align:top}
input.bulky, .bulky {padding:.4em .6em;font-size:1.2em}
.formTable, .formTable table{width:100%}
.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 input[type="search"], .formTable textarea{width:100%}
.formTable table td,.formTable table td:first-child{padding-bottom:0}
.formTable.right td:first-child{text-align:right;width:1%}
.formTable.right td{width:auto}
.subjClass{display:none !important;}
#Captcha label{padding-left:0}
td.right, th.right{text-align:right}
.wsNew{display:inline-block;font-size:.7em;line-height:1.5em;height:1.5em;padding:0 .3em;margin:.3em 0;background-color:#FFC700;overflow:visible;vertical-align:top;color:#fff;font-style:italic}
.formEdit select, .formBuilder select { width:40%; }

/* pagination */
.pagination{font-size:.95em;text-align:right}

/* page header */
.pageHeader{width:100%;height:auto;margin-bottom:2em}

/* alert */
#alertApp {background: var(--purple);cursor: pointer;font-size: 1rem;position: relative;width: 100%;padding: .5rem 2.5rem;z-index: 1;}
#alertApp:not(.alertStatic):hover { background:var(--dark-purple); }
#alertApp.alertStatic { cursor: default;}
#alertApp h2 {color: #FFF;font-size: 1em;line-height: 1.25rem;margin: 0 auto;padding: .1875rem .3125rem;text-align: center;}
#alertApp:hover h2,#alertApp.expand h2 {color: #FFF;}
#alertApp #alertDesc {height: 0;overflow: hidden;}
#alertApp p {color: #FFF;font-size: .9375rem;line-height: 1.5;margin: 0;padding: .5rem 0 .75rem;position: relative;text-align: center; z-index: 1;}

#alertApp h2>.plus {
	background: url('/images/icons/plus-regular.svg') no-repeat center / cover;
	display: inline-block;
	height: .75em;
	margin: 0 0 0 .5em;
	position: relative;
	top: .0625em;
	width: .75em;
}

#alertApp.expand h2>.plus {	background-image: url('/images/icons/minus-regular.svg'); }

#StudentInfoForm td .children {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: flex-start;-ms-flex-pack: start;justify-content: flex-start;-webkit-align-content: stretch;-ms-flex-line-pack: stretch;align-content: stretch;-webkit-align-items: center;-ms-flex-align: center;align-items: center;}
#StudentInfoForm td .children > label {width:100%}
#StudentInfoForm td input.writeIn {margin:0 0 0.5em 0.5em}


/* management overrides */
#wysiwygBody{background:#fff}

/* management table */
hr+.manage{margin-top:-1em}
.manage{border-bottom:1px solid rgba(0,0,0,.2);width:100%;line-height:1.3em}
.manage th{border-bottom:1px solid rgba(0,0,0,.2);text-align:left}
.manage th.right{text-align:right}
.manage th.sort{cursor:pointer}
.manage th.sort img{margin-left:5px}
.manage th img {position:relative;bottom:-2px}
.manage td,.manage th{padding:5px 5px 5px 0}
.manage td:first-child{padding-left:.8em}
.manage img.preload{display:none;position:absolute;z-index:9900;top:0;border:solid 1px #fff}
.manage td.icons img{margin-left:5px;position:relative;bottom:-2px}
.manage td:first-child.icons img{margin-left:0}
.manage td:first-child.icons{padding-left:3px;padding-right:3px}
.manage td:nth-child(2) {overflow-wrap: break-word;word-wrap: break-word;-ms-word-break: break-all;word-break: break-all;word-break: break-word;-ms-hyphens: auto;-webkit-hyphens: auto;hyphens: auto;}
.manage td.icons a:first-child img{margin-left:0}
.manage td.icons input{position:relative;bottom:2px;margin-left:5px}
.manage .hidden{font-style:italic;color:#900}
.manageButton{text-align:right;padding:10px 0}
.alternate tbody tr:nth-child(even), .even{background:#fff}
.alternate tbody tr:nth-child(odd), .odd {background:rgba(0,0,0,.06)}
.manage+hr, .manage+.manageLinks+hr{margin-top:50px}
.manageLinks{margin-top:10px}
.manageLinks select { max-width: 20em; }
.manageLinks a{white-space:nowrap}
.manageLinks a img{position:relative;bottom:-2px}
.manageLinks button{margin-left:5px}
.manageButtons{text-align: right;padding:10px 0}
.wsReturnToButton {float:right;margin-top:-3.5em}
.manage.rightFirstChild td:first-child{text-align:right}
.sortRow th{cursor:pointer}
.manageEllipsis{width:200px;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;display:inline-block}


/* REGISTER BUTTON ------------------------------ */
.registerButton {
	position: fixed;
    bottom: 25%;
    right: 0;
    z-index: 10;
}
.registerButton a {
    background-color: var(--purple);
    border: 2px solid #fff;
    border-right: none;
	border-radius: 4px 0 0 4px;
    box-shadow: 0 4px 8px 0 rgb(0 0 0 / 25%);
    color: #fff;
    font-size: 1.25rem;
	font-weight: 700;
    padding: 0.35em 1.1em .45em;
    position: relative;
	text-transform: uppercase;
}
.registerButton a:hover {background-color: var(--green);}

/* FOOTER ------------------------------ */
body>footer { background: var(--grey); font-size: 1rem; clear: both; }
body>footer{color: var(--dark-grey);line-height: 1.75;padding: 2rem 1rem;position: relative;}
body>footer a { color: var(--purple); }
body>footer a:hover, footer a:active { color: var(--green); }
body>footer a.on, footer .on>a { text-decoration: none; color: #FFF; }
body>footer>.wrap{ overflow: visible; clear: both }
body>footer>.wrap nav{ display: inline; }

body>footer .fatFooter {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	-ms-flex-pack: justify;
	justify-content: space-between;
	margin: 0 auto 3em;
}

body>footer address { font-size: .875rem; margin: 0 0 2em; }

body>footer .fatFooter p, body>footer .fatFooter a, body>footer input[type="email"] { font-size: .875rem; }

body>footer .fatFooter strong {
	color: #231F20;
	display: block;
	font-size: 1rem;
	margin: 0 0 .25em;
	text-transform: uppercase;
}

body>footer strong.registration {margin: 2em 0 .25em;}
body>footer input[type="email"] { width: 15em; }

ul.social { margin: 1em 0 3.5em; }

ul.social li a {
	background-color: #fff;
	border: 1px solid #000;
	border-radius: 3px;
    display: block;
	margin: 0 0 1em;
	padding: .25em .5em;
	position: relative;
	width: 10rem;
}

ul.social svg {
	height: 1rem;
	position: absolute;
	top: 50%;
	transform: translatey(-50%);
	width: 1.5625em;
}

ul.social span {
	color: #000;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1;
	padding-left: 1.75em;
	text-transform: uppercase;
}
ul.social li:nth-child(1) a { border-color: #43609C; }
ul.social li:nth-child(2) a { border-color: #FF0000; }
ul.social li:nth-child(3) a { border-color: #833AB4; }
ul.social li:nth-child(1) path { fill: #43609C; }
ul.social li:nth-child(2) path { fill: #FF0000; }
ul.social li:nth-child(3) path { fill: #833AB4; }

ul.social li a:hover {border-color: var(--green); background-color: var(--green);}
ul.social li a:hover path {fill: #fff;}
ul.social li a:hover span {color: #fff;}

body>footer .logo:nth-of-type(1) img { height: auto; margin: 0 1.5em 0 0; width: 3.125em; }
body>footer .logo:nth-of-type(2) img { height: auto; width: 9.5625em; }

body>footer button {font-size: .875em;margin: 0;padding: .625em 1em;text-transform: uppercase;}

body>footer .wrap { font-size: .8125rem; }
body>footer .wrap a { color: var(--dark-grey); }
body>footer .wrap a:hover, body>footer .wrap a:focus { color: var(--green); }

/* TRANSITIONS ------------------------------ */
a, a *,button,.button,input[type="button"],input[type="submit"],.rsFullscreenBtn,#alertApp,#alertApp span,
#search-toggle::before, #search-toggle::after, body>header #ancillary #search-input, #alertDesc, #navContainer li,
.hamburger, #mobilenav span, #callouts a::before, body>header #ancillary a::after, body>header #ancillary a::before,
#welcome .video::after, #welcome .video::before {
	-webkit-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
}
input:focus, select:focus, textarea:focus{-webkit-transition: background-color 150ms ease;-o-transition: background-color 150ms ease;transition: background-color 150ms ease}


/* FORM ERROR ------------------------------ */
.formError {background-color:Black; border:0; padding: 5px 10px; color:#fff; display:none; margin:0 0 2px; z-index:9999; border-radius: 10px; -moz-box-shadow:0 2px 2px #333; -webkit-box-shadow:0 2px 2px #333;}
.formError p {margin:0; font-size:.9em; }
.formError em { border:10px solid;  border-color:Black transparent transparent; bottom:-17px; display:block; height:0; left:40px; position:absolute; width:0; }

/* DASHED BORDER ------------------------------ */
.dashed-border { position: relative; }
.dashed-border::after {
	background-color: #FFF;
	background-image: -webkit-gradient(linear, left top, right top, color-stop(60%, var(--green)), color-stop(0%, #FFF));
	background-image: -o-linear-gradient(left, var(--green) 60%, #FFF 0%);
	background-image: linear-gradient(to right, var(--green) 60%, #FFF 0%);
	background-position: 2px bottom;
	background-size: 12px 1px;
	background-repeat: repeat-x;
	content: '';
	height: .3125rem;
	left: 0;
	opacity: .4;
	position: absolute;
	top: 100%;
	width: 100%;
	z-index: 1;
}

.top.dashed-border::after {
	background-position: 2px top;
	top: -webkit-calc(100% - .3125em);
	top: calc(100% - .3125em);
}


/* CALLOUTS ------------------------------ */
#callouts {
	background: var(--purple);
	font-size: 1rem;
	position: relative;
	z-index: 3;
}

#callouts .heading {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
	height: 100%;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
	left: 50%;
	padding: 1.5em .5em;
	position: absolute;
	text-align: center;
	top: 0;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 20%;
}

#callouts .heading::before {
	background: url('/images/pattern.svg') repeat left top / auto .75rem;
	content: '';
	height: 100%;
	left: 0;
	opacity: .1;
	position: absolute;
	top: 0;
	width: 100%;
}

#callouts .heading a {
	background: url('/images/icons/angle-down-white.svg') no-repeat center center / 1.5em 2.25em;
	display: block;
	height: 3em;
	margin: 1em auto 0;
	opacity: .6;
	width: 3em;
}

#callouts .heading a:hover { opacity: 1; }

#callouts ul {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	margin: 0;
}

#callouts li {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 20vh;
	min-height: 29.1875em;
	position: relative;
	text-align: center;
	width: 20%;
	z-index: 0;
}

#callouts li::after {
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(50%, rgba(39,51,63,.2)), color-stop(91%, #000));
	background-image: -o-linear-gradient(top, rgba(39,51,63,.2) 50%, #000 91%);
	background-image: linear-gradient(180deg, rgba(39,51,63,.2) 50%, #000 91%);
	content: '';
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1;
}

#callouts li:nth-child(3) { margin-left: auto; }

#callouts li a {
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
	height: 100%;
	-webkit-box-pack: end;
	-webkit-justify-content: flex-end;
	-ms-flex-pack: end;
	justify-content: flex-end;
	left: 0;
	padding: 1.25em 1.75em;
	position: absolute;
	top: 0;
	-webkit-transform-origin: 50% 100%;
	-ms-transform-origin: 50% 100%;
	transform-origin: 50% 100%;
	width: 100%;
	z-index: 0;
}

#callouts li a::before {
	background: var(--purple);
	bottom: 0;
	content: '';
	left: 0;
	opacity: 0;
	position: absolute;
	right: 0;
	top: 0;
	z-index: -1;
}

#callouts h2 {
	color: #FFF;
	font-size: 2.1875em;
	margin: 0;
}

#callouts h2>span {
	display: block;
	font-size: 1.25rem;
	line-height: 1;
	margin: .75em 0 0;
}

#callouts time { display: block; margin: 0 0 1em; }
#callouts time>span { color: #FFF; font-size: .875em; }
#callouts time>span:last-child { font-size: 1em;  }
#callouts h3 {
	color: #FFF;
	font-size: 1.25em;
	margin: 0;
}

#callouts li .button { text-transform: uppercase; }

#callouts li a:hover::before { opacity: .25; }
#callouts li a:hover .button { background: var(--purple); color: #FFF; }

/* ADULT ED / ENRICHMENT (homepage) ------------------------------ */
.links {
	font-size: 1rem;
	padding: 4em 0 2em;
	position: relative;
	text-align: center;
}

.links::before,
.highlight::before {
	background: url('/images/pattern.svg') repeat left top / auto .75rem;
	content: '';
	height: 100%;
	left: 0;
	opacity: .1;
	position: absolute;
	top: 0;
	width: 100%;
}

.links ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: stretch;
	margin: 0 -.6875em 1em;
}

.links li {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	margin: 0 0 2em;
	padding: 0 0.6875em;
	width: 33.33%;
}

.links .image {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	margin: 0 0 .625em;
	padding: 0 0 55.26%;
	-webkit-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
}

.links a:hover .image {
	-webkit-transform: scale(.92,.92);
	-ms-transform: scale(.92,.92);
	transform: scale(.92,.92);
}

.links h2 { margin: 0 0 1.5rem; text-transform: uppercase; }
.links h3 { font-size: 1.25em; }
.links h3>span { color: inherit; -webkit-transition: none; -o-transition: none; transition: none; }
.links .button {margin: .375em .25em;text-transform: uppercase;}

#adult-ed { z-index: 2; }
#adult-ed.links::before, .highlight::before { opacity: 1; }

#adult-ed.links {	background: -webkit-gradient(linear, left bottom, left top, from(rgba(251,251,247,0)), to(#F6F6EC));	background: -o-linear-gradient(bottom, rgba(251,251,247,0) 0%, #F6F6EC 100%);	background: linear-gradient(0deg, rgba(251,251,247,0) 0%, #F6F6EC 100%); }

#adult-ed.links h2 { color: #000; }
#adult-ed.links h3 { color: var(--purple); }

#adult-ed .button { background-color: transparent; border-color: var(--green); color: var(--green); }

#adult-ed .button:hover, #adult-ed .button:hover:focus { background-color: var(--green); color: #FFF; }

#adult-ed .butterfly {
	bottom: -4.8125em;
	height: auto;
	position: absolute;
	right: -2.5625em;
	width: 16.9375em;
	z-index: 2;
}
#adult-ed.links a:hover h3 { color: var(--green); }

#enrichment { z-index: 1; }
#enrichment.links, #events.links { background: var(--dark-purple); }
#enrichment.links h2, #enrichment.links h3, #events.links h2 { color: #FFF; }

#enrichment .button, #events .button {	background-color: transparent; border-color: #FFF; color: #FFF; }
#enrichment .button:hover, #events .button:hover { border-color: var(--green); background: var(--green); }

#enrichment .butterfly, #events .butterfly {
	bottom: -56px;
	height: auto;
	left: -2.25em;
	position: absolute;
	width: 13.5em;
	z-index: 2;
}

/* EVENTS (Homepage) -------------------- */
#events.links li {
	display: flex;
	flex-direction: column;
}

#events .image {
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-color: #FFF;
	border-radius: 0.375rem 0.375rem 0 0;
	margin-bottom:0;
}
#events .info {
	background-color: #fff;
	border-radius: 0 0 0.375rem 0.375rem;
	padding: 1em;
    display: flex;
    flex-direction: column;
	flex: 1 0 auto;
    flex-wrap: nowrap;
    align-content: stretch;
    align-items: stretch;
}
#events .info :is(h3, .date, .time, p) {text-align: left;}
#events .info .date {
	color: var(--green);
	display: block;
	font-size: 1.5rem;
	margin-bottom: 1rem;
	text-transform: uppercase;
}
#events .info h3 {
	color: var(--purple);
	font-size: 1.5rem;
	margin-bottom: 0;
}
#events .info .time {
	color: var(--purple);
	display: block;
	margin-bottom: 1em;
}
#events .info p {
	color: #000;
	line-height: 1.3;
}
#events .info .button {
	background-color: #fff;
	border: 2px solid var(--green);
	color: var(--green);
	margin: auto auto 0;
	text-align: center;
	width: 9em;
}
#events .info .button:hover {
	background-color: var(--green);
	color: #fff;
}

/* WELCOME ------------------------------ */
#welcome {
	font-size: 1rem;
	padding: 4em 0;
}

#welcome .wrap {
	-webkit-box-align: start;
	-webkit-align-items: flex-start;
	-ms-flex-align: start;
	align-items: flex-start;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

#welcome .textbox { width: -webkit-calc(50% - 3em); width: calc(50% - 3em); }

#welcome .video {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	border: .125rem solid #FFF;
	cursor: pointer;
	margin: 2em 0 0;
	position: relative;
	width: -webkit-calc(50% - 1em);
	width: calc(50% - 1em);
	z-index: 1;
}

#welcome .video::before {
	background: url('/images/icons/youtube-play.svg') no-repeat center center / 5.5em 4.1875em;
	content: '';
	display: block;
	padding: 0 0 55.91%;
	pointer-events: none;
	z-index: 2;
}

#welcome .video::after {
	background: url('/images/icons/youtube-play-green.svg') no-repeat center center / 5.5em 4.1875em;
	content: '';
	height: 100%;
	left: 0;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	top: 0;
	width: 100%;
}

#welcome .video.play::after, #welcome .video.play::before { background: 0 0; pointer-events: none; }

#welcome .video:hover::after { opacity: 1; }
#welcome .video:hover::before { opacity: 0; }

#welcome .video iframe {
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

#welcome h1 {
	color: #000;
	line-height: 1;
}

#welcome h1>span {
	color: var(--purple);
	display: block;
	font-size: .6em;
	margin: 0 0 .25em;
	text-transform: uppercase;
}

#welcome p {
	font-size: 1.25em;
}

#welcome .butterfly {
	position: absolute;
	right: -2em;
	top: 1.125em;
	-webkit-transition-delay: .2s;
	-o-transition-delay: .2s;
	transition-delay: .2s;
	width: 10.625em;
	z-index: 0;
}


/* ANIMATIONS CSS ------------------------------ */

.fade-in, .links li, #welcome .video, #callouts .heading>div, #callouts li a,
.translate-left, .translate-right, .translate-up {
	opacity: 0;
	position: relative;
	-webkit-transition: all 1s ease;
	-o-transition: all 1s ease;
	transition: all 1s ease;
}

.translate-left { -webkit-transform: translate(3rem,0); -ms-transform: translate(3rem,0); transform: translate(3rem,0); }
.translate-right { -webkit-transform: translate(-3rem,0); -ms-transform: translate(-3rem,0); transform: translate(-3rem,0); }
.translate-up { -webkit-transform: translate(0,3rem); -ms-transform: translate(0,3rem); transform: translate(0,3rem); }

.animated {opacity: 1;}

.translate-left.animated, .translate-right.animated, .translate-up.animated, .translate-down.animated { -webkit-transform: translate(0,0); -ms-transform: translate(0,0); transform: translate(0,0); }

.stop-transitions * {
	-webkit-transition: none !important;
	-o-transition: none !important;
	transition: none !important;
}

.links li, #welcome .video, #callouts .heading>div, #callouts li a { -webkit-transform: scale(.9,.9); -ms-transform: scale(.9,.9); transform: scale(.9,.9); }
.links li.animated, #welcome .video.animated,
#callouts .heading.animated>div, #callouts li.animated a {
	opacity: 1;
	-webkit-transform: scale(1,1);
	-ms-transform: scale(1,1);
	transform: scale(1,1);
}

#callouts li>a { -webkit-transition-delay: .5s; -o-transition-delay: .5s; transition-delay: .5s }

/* DESKTOP THROUGH MOBILE MEDIA QUERIES ------------------------------ */
@media (max-width:1100px) {
	#callouts .heading {
		display: block;
		padding: 3.5em var(--gutter) 2em;
		position: static;
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
		width: 100%;
	}

	#callouts ul { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
	#callouts li { height: auto; min-height: 0; width: 50%;}
	#callouts li a { padding: 6.5em 1.25em 1.25em; position: static; }

}


#content .category-class-list {
	margin: 2rem 0;
}
#content .category-class-list dt {
	font-size: 1.25rem;
	font-weight: 700;
	color: #000;
}
#content .category-class-list dt > span {
	color: var(--purple);
}
#content .category-class-list dt > span:before {
	content: "|";
	color:var(--purple);
	display: inline-block;
	margin: 0 .4rem 0 0;
}
#content .category-class-list dd {
	padding: 1.125rem 1.25rem;
	margin: 0;
	position: relative;
	background: var(--grey);
}
#content .category-class-list div:nth-of-type(odd) dd {background: rgba(25, 29, 75, 0.05);}
#content .category-class-list div:nth-of-type(even) dd {background: #EAEAEF;}
#content .category-class-list div + div {margin-top: 2.5rem;}
#content .category-class-list dd + dd:before {
	content: "";
	position: absolute;
	top: 0;
	left: 1.25rem;
	right: 1.25rem;
	height: 1px;
	background: rgba(151, 151, 151, 0.4);
}
#content .category-class-list ul {margin-bottom: 0;}

#content .category-class-list dd ul li b {color:#000;}
#content .category-class-list dd ul li {
	padding-left: 0;
	font-weight: 400;
	margin-bottom: 0;
}
#content .category-class-list dd ul li a:not(.button) {
	text-decoration: underline;
	color: var(--green);
	font-weight: 700;
}
#content .category-class-list dd ul li span {
	color:#000;
	font-weight: 700;
}
#content .category-class-list dd ul li a:not(.button):hover {color: var(--purple)}
#content .category-class-list dd ul li:before { content: none; }
#content .category-class-list .class-time {
	font-weight: 700;
	color:#000;
}
#content .category-class-list i {font-weight: 300;}
#content .button.register {
	padding: .375em .45em;
	position: relative;
	margin-top: .6em;
}
#content .category-class-list .button.register{margin-left: 0;}


/* ================== STYLE.CSS ==================== */
