@charset "UTF-8";
/* All clamps 750 - 1200 unless noted */



body {
  scroll-padding-top: 5em;
}




/* HOVER ------------------------------*/
/* Set :focus-visible colors in style.css */

.content :is(p, li) a:not(.button):hover,
.content :is(p, li) a:not(.button):hover * {
  color: var(--ws-gold-2);
}


:is(button, .button, input:is([type="button"], [type="submit"], [type="reset"])):hover {
  background-color: #000;
  color: #FFF;
}


:is(#sidenav>ul>li>a, #sidenav>ul>li.on>a):hover,
:is(#sidenav>ul>li>ul>li>a, #sidenav>ul>li>ul>li.on>a):hover {
  background: #000;
  color: #FFF;
}

:is(#sidenav>ul>li>ul>li>ul>li>a, #sidenav>ul>li>ul>li>ul>li.on>a):hover {
  background: var(--ws-red-2);
  color: #FFF;
}




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

body:not(#tinymce) {
  display: grid;
  grid-template-columns: minmax(0, 1fr); /* Fixes horizontal overflow issue */
  grid-template-rows: auto auto 1fr;
  min-height: 100vh;
}

body>footer {
  align-self: end;
}

body.management {
  margin-top: 0 !important;
}



/* HEADER ------------------------------*/

body>header {
  background: #FFF;
  border-bottom: 2px solid var(--ws-red);
  padding-inline: 0 clamp(.25em, -1.4167em + 3.56vw, 1.25em);
  position: sticky;
  top: 0;
  z-index: 1;
}

body.scroll>header {
  box-shadow: 0 1px 1px rgba(0,0,0,.015),0 2px 2px rgba(0,0,0,.015),0 4px 4px rgba(0,0,0,.015),0 8px 8px rgba(0,0,0,.015),0 16px 16px rgba(0,0,0,.015);
}

body.management>header {
  margin-top: 35px;
  top: 35px;
}


#brand {
  background: #FFF;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
  display: block;
  font-size: 1em;
  inset: 0 auto auto 0;
  max-width: clamp(7em, -9.4583em + 35.11vw, 16.875em);
  padding: clamp(1.0625em, .5417em + 1.11vw, 1.375em) clamp(.75em, -.3958em + 2.44vw, 1.4375em);
  position: absolute;
  transition: all 1s ease 0s, padding .2s ease 0s;
  width: 100%;
}

body.scroll #brand {
  padding: 1.0625em .75em;
  transition: all .5s ease 0s, padding .25s ease .25s;
  width: clamp(7em, 3.6667em + 7.11vw, 9em);
}

#brand img {
  display: block;
  height: auto;
  width: 100%;
}

nav ul {
  margin: 0;
}

#navContainer {
  display: flex;
  justify-content: end;
}

#mainnav {
  margin-block: .9375em;
  overflow: visible;
}

#mainnav ul {
  margin: 0;
  padding: 0;
  text-align: center;
}

#mainnav li {
  display: inline-block;
  position: relative;
}

#mainnav a {
  display: inline-block;
  line-height: 1;
  text-decoration: none;
}

/* T1 */
#mainnav>ul {
  display: flex;
  gap: .3125em
}

#mainnav>ul>li>a {
  border: 1px solid #FFF;
  box-shadow: 0 0 0 1px transparent;
  color: #000;
  font-size: clamp(.9375em, .4167em + 1.11vw, 1.25em);
  padding: .5em .8em;
  transition: color .3s ease, background-color .3s ease, box-shadow .3s ease;
}

#mainnav>ul>li:last-child {
  margin-left: .25em;
}

#mainnav>ul>li:last-child>a {
  box-shadow: 0 0 0 1px var(--ws-red-2);
  border: 1px solid #FFF;
}

#mainnav>ul>li.on>a {
  box-shadow: 0 0 0 1px var(--ws-red-2);
  color: var(--ws-red);
}

#mainnav>ul>li:last-child.on>a {
  background: var(--ws-gold-2);
  box-shadow: 0 0 0 1px var(--ws-gold-2);
  color: #FFF;
}

#mainnav>ul>li:hover>a,
#mainnav>ul>li:focus-within>a,
#mainnav>ul>li>a:focus-visible {
  background: var(--ws-red-2);
  box-shadow: 0 0 0 1px var(--ws-red-2);
  color: #FFF;
}

/* Contact link */
#mainnav>ul>li:last-child:hover>a,
#mainnav>ul>li:last-child:focus-within>a,
#mainnav>ul>li:last-child>a:focus-visible {
  background: var(--ws-gold);
  box-shadow: 0 0 0 1px var(--ws-gold);
}


/* Accessible dropdowns */
#mainnav>ul>li.menu-item-has-children>a {
  padding-right: 1.25em;
}

#mainnav>ul>li>button {
  background: transparent;
  border: 0;
  box-shadow: none;
  font-size: 1rem;
  height: 1.5rem;
  inset: 50% clamp(0em, -.4167em + .89vw, .25em) auto auto;
  margin: 0;
  outline-offset: -2px;
  padding: 0;
  pointer-events: none;
  position: absolute;
  transform: translateY(-50%);
  width: 1.5rem;
}

#mainnav>ul>li>button:before {
  background: #767676;
  content: '';
  height: .75rem;
  left: 0;
  mask: url('/images/icons/caret-down.svg') no-repeat center / auto .375em;
  position: absolute;
  right: 0;
  top: calc(50% - 6px);
  transition: all .3s ease;
}

#mainnav>ul>li.on>button::before {
  background: var(--ws-red-2);
}

#mainnav>ul>li:hover>button::before,
#mainnav>ul>li:focus-within>button::before,
#mainnav>ul>li>button:focus-visible::before,
#mainnav>ul>li>a:focus-visible+button::before {
  background: #FFF;
}



/* Dropdown menus */
#mainnav li div {
  background: var(--ws-gradient-1);
  height: auto !important;
  left:0;
  opacity: 0;
  padding: .5em 0;
  position: absolute;
  text-align: left;
  top: -200vh;
  visibility: hidden;
  width: 17.5em;
}

#mainnav li:hover div,
#mainnav>ul>li.tapped > div,
#mainnav>ul>li>a:focus + div,
#mainnav>ul>li.expand>div {
  opacity: 1;
  top: 100%;
  visibility: visible;
}

/* fade out */
#mainnav li:not(.expand) div {
  transition: opacity .2s ease-out 0.25s, visibility .2s ease-out 0.25s, top 0s linear 0.5s;
}

/* fade in */
#mainnav>ul>li:is(:hover, .expand)>div {
  transition: opacity .2s ease-in .25s, top 0s linear .25s, visibility .2s ease-in 0s;
}

#mainnav>ul>li:is(:last-child, :nth-last-child(2)) div {
  left: auto;
  right: 0;
}

#mainnav>ul>li>div>ul>li {
  display: block;
  width: 100%;
}

#mainnav>ul>li>div>ul>li>a {
  color: #000;
  display: block;
  font-size: var(--ws-text-20);
  line-height: 1.05;
  padding: .35em .875em;
  text-align: left;
  width: 100%;
}

#mainnav>ul>li>div>ul>li.on>a {
  background: rgba(0,0,0,.1);
}

#mainnav>ul>li>div>ul>li>a:is(:hover, :focus-visible) {
  background: #000;
  color: #FFF;
}

#mainnav>ul>li>div>ul>li ul {
  display: none;
}



/* mobile */
#mobilenav, .toggleNav {
  display: none;
  visibility: hidden;
}




/* MAIN ------------------------------ */

main.interior>div.wrap {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
}

main.interior>div>#content {
  min-height: 37.5em;
  padding: 2em 0 5em clamp(1.5em, -9em + 18.67vw, 5em); /* 900 - 1200 */
  position: relative;
  width: calc(100% - 14.375rem);
}

body.fullWidth main>div>#content {
  float: none;
  margin: 0 auto;
  padding: 2em 0 5em;
  width: 100%;
}

main.interior>div>aside {
  width: 14.375rem;
}

#sidenav {
  margin-block: 5em;
  position: sticky;
  top: 10em;
}




/* CMS PAGE ELEMENTS ------------------------------ */

.photoright {
  margin: 0 0 2em clamp(2em, -1.333em + 7.11vw, 4em);
}

.photoleft {
  margin: 0 clamp(2em, -1.333em + 7.11vw, 4em) 2em 0;
}

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

.twoCol {
  columns: 2;
}

.threeCol {
  columns: 3;
}

.resCol {
  columns: auto;
  column-width: 13em;
}

.shareIcons a:is(:hover, :focus-visible) {
  background-color: var(--ws-red);
}

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

.content ul li::before {
  inset: .25em auto auto .5em;
}


/* Used on Contact page */
div.flex-container {
  align-items: start;
  display: flex;
}


div.flex-container .highlight {
  margin: 0 0 0 2em;
  min-width: 22em;
}



/* FAQS BLOCK ----------------------------- /
* - Standard Interior pages
*/

/* Hover */
.faqs details[open] summary:hover {
  color: var(--ws-red);
}

.faqs details:not([open]) summary:hover {
  background: #000;
}

.faqs details:not[open] summary:hover::before {
  background: var(--ws-red);
}




/* LIGHTBOX GALLERY WYSIWYG TEMPLATE ------------------------------ /
* - Standard Interior pages
*/

ul.lightbox-gallery {
	display: flex;
	flex-wrap: wrap;
	column-gap: 1rem;
	padding-inline: 0.625rem;
  --ws-column-count: 3;
}

ul.lightbox-gallery.two {
	--ws-column-count: 2;
}

ul.lightbox-gallery>li>button:is(:hover, :focus-visible) {
	transform: scale(.95);
}

.lightbox button:is(:hover,:focus-visible) {
	background: var(--ws-red)
}

.lightbox-controls button:is(:hover,:focus-visible):after {
	background: #FFF;
}


/* ###### THE LIGHTBOX ###### */

body.management .lightbox .lightbox-close {
	top: 2em;
}





/* FORMS ------------------------------ */

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


/* New contact form markup */
.form-flex .half {
  width: calc(50% - .5em);
}

.form-flex .third {
  width: calc(33.33% - .5em);
}

.form-flex .quarter {
  width: calc(25% - .5em);
}





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

body>footer :is(.fatFooter, .wrap) {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

body>footer a:hover {
  color: #FFF;
}




/* PAGEHEADER ------------------------------ */

.pageheader {
	background: var(--ws-red-3);
	height: 4.375em;
	margin: .125em 0 0;
	position: relative;
	width: 100%;
}

.pageheader::before {
	background: url('/images/pageheader.webp') no-repeat center / cover;
	content: '';
	filter: grayscale(1);
	inset: 0;
	mix-blend-mode: luminosity;
	opacity: .75;
	position: absolute;
}

.pageheader::after {
	background: linear-gradient(90deg, rgba(var(--ws-red-3-rgb), 1) 0%, rgba(var(--ws-red-rgb), .75) 100%);
	content: '';
	inset: 0;
	position: absolute;
}




/* HERO RIBBON ------------------------------ /
* - Homepage
*/

.hero {
  display: flex;
}

/* Rotator side */
.hero .rotator-wrap {
  display: contents;
}

.hero .rotator {
  align-items: end;
  display: grid;
  grid-template-columns: 100%;
  grid-template-rows: 100%;
  max-width: calc(100% - 22em);
  position: relative;
  width: 70%;
}

.hero .slideContainer {
  grid-column: 1;
  grid-row: 1;
  z-index: 0;
}

.hero .slideContainer::after {
  background: linear-gradient( 8deg , rgba(0, 0, 0, 0.8) 0% , rgba(0, 0, 0, 0) 100% );
  content: '';
  inset: 50% 0 0;
  position: absolute;
}

.hero button.play-pause {
  inset: auto .875em .875em auto;
}

.hero .textbox {
  grid-column: 1;
  grid-row: 1;
  max-width: 40em;
  padding: 0 1.3125em clamp(1.25em, -2.5em + 8vw, 3.5em);
  position: relative;
  z-index: 1;
}

.hero h1 {
  color: #FFF;
  font-size: clamp(2.25em, 1.2404em + 2.15vw, 3.125em);
}

.hero h1>em {
  font-size: .48em;
}


/* Form side */
.hero .form {
  border-left: .125rem solid #FFF;
  min-width: 22em;
  width: 30%;
}

.hero h2 {
  font-size: clamp(1.75em, 1.0288em + 1.54vw, 2.375em); /* 750 - 1400 */
}




/* CALLOUTS RIBBON ------------------------------ /
* - Homepage
*/

.callouts .ws-flex {
  --ws-column-count: 4;
}


/* Hover */
.callouts ul.ws-flex>li>a:hover>img {
  box-shadow: 0 0 0 .0625rem var(--ws-red);
  transform: scale(1.03);
}

.callouts a:hover strong.title {
  color: #000;
}

.callouts a:hover strong.title::after {
  background: #000;
}




/* ICONS RIBBON ------------------------------ /
* - Homepage
*/

.icon-list ul.ws-flex {
  --ws-column-count: 5;
}



/* WELCOME RIBBON ------------------------------ /
* - Homepage
*/

.welcome .wrap {
  display: contents;
}

.welcome .inner-wrap {
  overflow: hidden;
  position: relative;
  --ws-column-count: 12;
  --ws-gap: 1em;
}

.welcome .textbox {
  grid-column: 7 / -1;
  max-width: 32em;
  padding: 4.6875em 2em 6.75em 0;
}

.welcome .image-grid {
  display: contents;
}

.welcome .image {
  position: absolute;
}

.welcome .image-1 {
  inset: -7em auto auto calc(50% - 51.5em);
}

.welcome .image-2 {
  inset: auto auto -4em calc(50% - 53em);
}

.welcome .image-3 {
  inset: auto auto -7em calc(50% - 35.5em);
}

.welcome .image-4 {
  inset: 2em calc(50% - 49em) auto auto;
}

.welcome .image-5 {
  inset: auto calc(50% - 46.5em) -1em auto;
}



/* WHY CHOOSE US RIBBON ------------------------------ /
* - Homepage
*/

.why-choose-us ul.ws-flex {
  --ws-column-count: 5;
}




/* MAX WIDTH MEDIA QUERIES ------------------------------ */

/* 1200px */
@media (max-width: 75em) {

  .welcome :is(.image-1,.image-2,.image-3) {
    font-size:clamp(.625em, .2083em + .89vw, .875em);
  }

  .welcome .image-1 {
    inset: calc(50% - 23em) auto auto -6em;
  }

  .welcome .image-2 {
    inset: calc(50% - 3em) auto auto -7em;
  }

  .welcome .image-3 {
    inset: calc(50% - 13em) auto auto calc(50% - 31em);
  }

  .welcome .textbox {
    grid-column: 8 / -1;
    max-width: 100%;
  }

  .welcome .image-4,
  .welcome .image-5 {
    content-visibility: hidden;
    display: none;
  }

}



/* 1024px */
@media (max-width: 64em) {
  .callouts .ws-flex {
    --ws-column-count: 2;
  }

  .why-choose-us ul.ws-flex {
    --ws-column-count: 3;
  }

}




/* 900px */
@media (max-width: 56.25em) {
  ul.lightbox-gallery {
    --ws-column-count: 2;
  }
}




/* MIN WIDTH MEDIA QUERIES ------------------------------ */

/* 1024px */
@media (min-width: 64em) {
  body>footer .copyright br {
    display: none;
  }
}

/* 1800px */
@media (min-width: 112.5em) {
  body { font-size: 1.1em; }
}


/* 2400px */
@media (min-width: 150em) {
  body { font-size: 1.2em; }
}



/* -------~~~~~~~======= STYLE-D.CSS =======~~~~~~~------- */
