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

body.slideNav {overflow: hidden;}

/* TYPOGRAPHY ------------------------------*/
h1 { font-size: 1.87em; }
h2 { font-size: 1.5em; }
.highlight h2 { font-size: 1.375em; }
h3 { font-size: 1.375em }
h4 { font-size: 1.25em; }
h5 { font-size: 1.1875em; }
h6 { font-size: 1.125em; }

.intro, p.intro {
	font-size: 1.1875em;
}

.d-only {
  display: none;
}

#ancillary .options a {
  font-family:
  'Roboto Medium', sans-serif;
  font-style: normal;
}

/* HEADER ------------------------------ */
body>header{position: relative; background:#fff}
body>header .wrap { padding: 0; }

body>header #brand {
  display: block;
  margin: 0 auto;
  max-width: 26em;
  padding: 1em;
	width: 100%;
}

body>header:before{content: "";opacity: 0; z-index: 3;background-color: #000;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: .75;transition:left 0ms ease 0ms, opacity 200ms ease}
#navContainer{position: fixed;left: 100%;top:0;bottom:0;width: 75%;max-height: 100vh;background-color: var(--dark);z-index:3;-webkit-transition: left 200ms ease;transition: left 200ms ease;overflow:auto;-webkit-overflow-scrolling: touch;}

body.management #navContainer {top: 2.125em;}

body.slideNav #navContainer{left: 25%;}
#navContainer nav{display: inline}
#navContainer ul{display: block;width: 100%;margin: 0;padding-left: 0}
#navContainer li {display:block;width: 100%;position: relative;border-top: 1px solid rgba(255,255,255,0.125);}
#navContainer li li {border: 0}
#navContainer a, #navContainer .menu{color: #FFF;font-size: 1.125em;line-height: 3em;padding:0 1rem;display:block;text-transform: uppercase;width: 100%}

#navContainer .menu>span {
  font-size: 2.125em;
  line-height: 0;
  margin: 0 0.125em 0 0;
  position: relative;
  top: 0.15em;
}

#navContainer li.open{background-color: rgba(255,255,255,.1);}
#navContainer li>span{
  opacity: 1;
  display: block;
  position: absolute;
  right: 0.1875rem;
  top: .125em;
  width: 3em;
  height: 3em;
}

#navContainer li>span:before{content: ""; display: block; width: 50%; height: 0.0625rem; background-color: #FFF; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(90deg); transform-origin: center center;}
#navContainer li>span:after{content: ""; display: block; width: 50%; height: 0.0625rem; background-color: #FFF; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transform-origin: center center;}
#navContainer li.open > span:before {transform: translate(-50%, -50%)rotate(0deg);}
#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;}
#navContainer ul ul {font-size: 1em;height: 0;overflow: hidden;transition: all .3s ease;}
#navContainer ul ul a {padding-left: 2rem}
#navContainer ul ul li.on a {background-color: rgba(255,255,255,.1) }

nav#ancillary {
	background: hsl(212deg 44% 14%);
	display: block;
}

#ancillary button {
  display: none;
}

/* mobilenav */
#mobilenav{background-color: var(--blue);border-bottom: .125em solid #FFF;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.5em;-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;text-transform: uppercase;}

#mobilenav span svg {
  fill: #FFF;
  margin: 0 0 0 .125em;
  pointer-events: none;
  position: relative;
  top: .25em;
  width: 1em;
}

#mobilenav a:hover, #mobilenav span:hover{color: #FFF;background-color: var(--dark);}
/* hamburger */

#mobilenav svg { margin: 0 0 0 .25em; pointer-events: none; position: relative; top: .1875em; width: 1em; }
#mobilenav svg path { fill: #FFF; }

.hamburger {
  height: 2em;
  width: 2em;
  display: block;
  position: fixed;
  right: 0;top:0;
  z-index:2;
  opacity: 0;
  background-color: var(--aqua);
  padding: .25em;
}

.hamburger path {fill: #FFF;font-size: 1.75em;}
.hamburger svg {
  height: auto;
  left: 50%;
  position: absolute;
  pointer-events: none;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 1.25em;
}

.hamburger.on{opacity: .75;}


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

.content ul li {padding-left: 1.5em;}

.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;}

.photoright{margin: 0 0 1em var(--ws-gutter);}
.photoleft{margin:0 1em .75em 0;}

main>div>#content {
  padding-block: 2em 1em;
}

main>div>aside {
  padding-block: 2em;
}

.button.back:not(.d-only),
main.interior>.wrap>.button:first-child {
  display: table;
  margin: 1em auto 1.5em;
}



/* HOMEPAGE GRID ------------------------------ */
.grid {
  padding-block: 2em;
}

.grid .wrap {
  grid-template-columns: repeat(1, 1fr);
  display: grid;
  row-gap: 2.25em;
}

:is(.config-1, .config-2, .config-3, .config-4) .wrap {
  grid-template-areas:
  "announcements"
  "locations"
  "company-files"
  "calendar"
  "photo-gallery"
}

.config-0 .wrap {
  grid-template-areas:
  "announcements"
  "company-files"
  "calendar"
  "photo-gallery"
}


/* LOCATIONS ------------------------------ */
#locations ul,
ul.gallery.squares {
  grid-template-columns: repeat(2, 1fr);
}


/* ANNOUNCEMENTS ------------------------------ */


/* COMPANY FILES ------------------------------ */
.files.interior {
  padding-block: 1em 0;
}

.files ul {
  grid-template-columns: repeat(2, 1fr);
  row-gap: var(--ws-gutter);
}


.button.back.mb + .file-tree {
	margin-top: 1.5em;
}



/* CALENDAR ------------------------------ */
#calendar table {
  margin: 0 0 1.75em;
}

#calendar thead td {
  font-size: .875rem;
}

#calendar tbody td {
	height: 3.5em;
}

#calendar article {
  font-size: .5625rem;
}




/* PHOTO GALLERY ------------------------------ */



/* LOGIN ------------------------------ */

body.login .login-buttons {
	align-items: center;
	display: flex;
	justify-content: center;
	flex-direction: column;
	gap: 1em;
	width: 100%;
}

body.login .login-buttons input[type="submit"] {
	margin: 0;
}



/* FILE TREE RIBBONS ------------------------------ */

.accordion li>a>span.button {
	display: none;
}



/* MEDIA QUERIES ------------------------------ */
@media (max-width: 600px) {
  body>footer .fatFooter {
    flex-direction: column;
  }
  body>footer .social {
    margin-top: 1.25em;
  }
}

@media (max-width: 500px) {
  body.login .wrap {
    display: block;
  }
  body.login h1 {
    font-size: 1.25em;
  }
  body.login div.half {
    font-size: 1em;
    width: 100%;
  }
  body.login div.half:first-of-type {
    margin: 0 0 1em;
  }

  body.my-locations .photoright {
    float: none;
    margin: 0 0 1.5em;
    max-width: 100%;
    width: 100%;
  }


}
/* ~~~~~~~~~~~~~~~~~~~ STYLE-M.CSS ~~~~~~~~~~~~~~~~~~~ */