/*
    Created on : 3 Jul 2023, 18:24:11
    Author     : Noel Hinton
*/

body {
    font-size: 16px !important;
    letter-spacing: 0.0625em;
}
body * {box-sizing: border-box;}

.wp-site-blocks:before {
    content:""; position: fixed; width: 100%; height: 100%; background-image:url('../images/bg-pattern.png'); background-size: 236px; opacity: 0.25;
}
h1,h2,h3 {overflow-wrap:initial; word-break:initial;}

main ::-webkit-scrollbar { height: 5px; width:5px; }
main ::-webkit-scrollbar-track { background: transparent; }
main ::-webkit-scrollbar-thumb { background: var(--wp--preset--color--secondary); }

main {max-width: var(--wp--style--global--content-size); margin: 0 auto; background:#FFF; transition:filter 0.5s; }


/*      HELPERS         */
.shadow {box-shadow: 0 2px 6px rgba(0,0,0,0.25);}

.text-uppercase {text-transform: uppercase;}
.text-left {text-align: left;}
.text-center {text-align: center;}
.text-right {text-align: right;}

.hide {
  display: none;
}


/* @media screen and (min-width: 40em) {
	.post-type-archive-supplier .supplier-panel {margin: 1em;}
} */

#supplier-filter {margin-bottom: 2em; position: absolute; top: 200px; left: 50%; width: 70%; transform: translateX(-50%) translateY(-50%); 
                  background: #6D439A; padding: 1em 1.2em; border-radius: 0; z-index: 10; display: none;}
#supplier-filter.show {display: block;}
#supplier-filter label {display:none;}
#supplier-filter select {margin: 0;}


@media screen and (max-width: 39.9375em) {
	#supplier-filter {width:75%;}
	.post-type-archive-supplier .supplier-panel {max-width:100px;}
}

#roommap {
  position: relative;
  top: 0px;
}

#roommap img {
  border-radius: 30px;
  max-width: 100%;
}

.clickbox {
  background-color: red;
  opacity: 0;
  position: absolute;
  z-index: 99;
  transition: all 0.5s;
}

.clickbox:hover {
  opacity: 0.5;
}

#uppermarquee {
	top: 14.2%;
	left: 11.9%;
	width: 26%;
	height: 17%;
}

#lowermarquee {
	top: 38.4%;
	left: 13.3%;
	width: 8.7%;
	height: 29.2%;
}

#carriagesuite {
  top: 58.5%;
  left: 32.4%;
  width: 8.5%;
  height: 26%;
}

#billiardroom {
	top: 35.7%;
	left: 44.3%;
	width: 8.2%;
	height: 11%;
}

#regencysuite {
  top: 46.7%;
  left: 44.3%;
  width: 6.8%;
  height: 14%;
}

#frenchresteraunt {
	top: 35%;
	left: 62.4%;
	width: 6.7%;
	height: 8.4%;
}

#drawingroom {
  top: 62.7%;
  left: 46.3%;
  width: 5.8%;
  height: 11.4%;
}

#readingroom {
  top: 62.7%;
  left: 52.1%;
  width: 7.4%;
  height: 10.4%;
}

#roommap .close {
  position: absolute;
  top: 10px;
  right: 30px;
  border: 5px solid #6d439a;
  border-radius: 40px;
  width: 40px;
  height: 40px;
  line-height: 33px;
  text-align: center;
  font-size: 25px;
	cursor: pointer;
}

.cell.mobileFilter {
    display: none;
}

.cell.filterbar {
  background-color: #6D439A;
  border-radius:0 0 25px 25px;
  padding: .5rem;
  color: #ffffff;
  margin-bottom: 2rem;
}

span.filtermap {
  background-color: #ffffff;
  border-radius: 20px;
  padding: 3px 30px;
  color: #6d439a;
  border: 3px solid #ffffff;
	transition: all 0.25s;
}

span.filtermap:hover {
  color: #ffffff;
  background-color: #6d439a;
}

.cell.filterbar p {
  line-height: 50px;
  text-align: left;
  padding: 0px 10px;
  position: relative;
}

/* .cell.mobileFilter .supplierfilter {
  margin-top: 10px;
  margin-bottom: 0px;
} */

.cell.mobileFilter .supplierfilter {
  margin-bottom: 0px;
  width: 100%;
  margin-top: 0px;
  margin-right: -3px;
  padding-left: 20px;
  height: 35px!important;
  border-radius: 28px !important;
  border: transparent;
}

.cell.mobileFilter .clearInputFilter {
  position: absolute;
  bottom: 18px;
  right: 30px;
  color: #6d439a;
  font-size: 25px;
}

.cell.filterbar p span {
	cursor: pointer;
}

.currentfilter {
  margin-left: 30px;
}

.filterbar input {
  width: 25%;
  float: right;
  margin-top: 7px;
  margin-right: -3px;
  padding-left: 20px;
  height: 35px!important;
  border-radius: 28px !important;
  border: transparent;
}

.filterbar span.clearInputFilter {
  position: absolute;
  right: 15px;
  color: #6d439a;
  font-size: 25px;
  z-index: 9;
}

@media screen and (max-width: 880px) {
  .cell.filterbar {
    display: none;
	}

	#roommap {
    display: none;
	}

	#supplier-filter {
    display: block;
    position: relative;
    top: unset;
    transform: none;
    float: none;
    width: 100%;
    left: 0px;
	}

	.cell.mobileFilter {
    display: block;
	}
}

@media screen and (max-width: 781px) {
    .show-for-medium {display: none !important;}
}
@media screen and (max-width: 1199px) {
    .show-for-large {display: none !important;}
}





/*      ELEMENTS        */
main {z-index: 8; position: relative;  }
main > .has-global-padding {padding: 0 !important;}
header i.fa-bars {font-size: 2rem;}
@media screen and (min-width: 1200px) {
    header i.fa-bars {display: none;}
}

.wp-block-image {border-radius: 10px; overflow: hidden;}

.wp-block-post-content > h1 {text-shadow:0 0 30px #001020;}


/*      BLOCKS          */
.wp-block-columns.border-b {border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; margin-bottom: -20px; overflow: hidden;}
.wp-block-columns.border-b + .wp-block-columns.border-b > .wp-block-column.has-background {padding-top: 50px !important;}
.wp-block-column {position: relative; }
.wp-block-column:first-child {z-index:2;}

.wp-block-column.is-layout-flow {display: flex; flex-direction: column; justify-content: space-between;}

.wp-block-group-is-layout-flex.is-vertical > * {line-height: 1;}





/*      PATTERNS        */
header.wp-block-template-part {margin-bottom: -50px; position: relative;  z-index: 10; }
.masthead {background: #FBBC0F; padding: 20px 2rem 10px 2rem; flex-wrap: nowrap !important; gap:1rem !important; align-items: flex-start !important; 
    position: relative; border-radius:0 0 50px 50px; transition: all 0.5s;  }
body.post-type-archive-supplier main {padding-top:50px; padding-left: 4rem; padding-right: 4rem; }
@media screen and (max-width: 1099px) {
    .masthead {border-radius:0;}
}
@media screen and (max-width: 959px) {
    header.wp-block-template-part {margin-bottom: 0;}
    body.post-type-archive-supplier main {padding:0; }
    body.post-type-archive-supplier main .is-layout-grid {padding: 0 2rem;}
}


.logo {width:250px; max-width: 30vw; display: block; position: relative; z-index: 11; }
.logo img {width:100%;}
@media screen and (max-width: 959px) {
    .logo {width:200px;}
}

.header-location {gap:1rem; align-items: center; display: flex; justify-content: center;
    font-size:2rem; line-height: 1em; position: absolute; top:100%; left:0; right:0; z-index: 12; }
.header-location .content {border-radius:0 0 25px 25px; text-align: center; display: flex; background: #2CB5B5; color:#fff; padding: 1rem 1.5rem;  }



nav.main-navigation {position: relative; width:100%;}
nav.main-navigation ul {display: flex; list-style: none; margin: 0; justify-content: space-between; align-items: center; padding: 0; }
nav.main-navigation ul li {text-transform: none; font-size:1.5rem; padding: 0 1rem; text-align: center; line-height: 1.125em; flex: 1 1 0px;}
nav.main-navigation ul li a {color:#fff; transition: color 0.5s cubic-bezier(.1,0.7,0.3,0.9);}
nav.main-navigation ul li a:hover {color:#51B5D4;}
.device-menu {display:none;}
@media screen and (max-width: 1099px) {
    nav.main-navigation ul {justify-content: center; }
    nav.main-navigation ul li {flex:none;}
    .masthead {position: relative; z-index: 15;}
    .masthead-content nav.main-navigation ul li:not(.branding) {display: none;}
    .device-menu {display:block; position: absolute; top:100%; left:0; z-index: 13; transition: all 0.5s; transform: translateY(-100%);
        background: #FBBC0F; border-radius: 0 0 25px 0; padding: 2rem 0; opacity: 1;}
    .device-menu nav.main-navigation li.branding {display: none; }
    .device-menu nav.main-navigation ul {flex-direction: column; align-items: flex-start; gap:1rem; }
    .device-menu nav.main-navigation ul li {padding: 0 2rem;}
    body.menu-open .device-menu  {transform: translateY(0); opacity: 1;}
    body.menu-open main {filter: brightness(0.5);}
}


footer {position: relative; z-index: 10;}

footer .footer-info {background:var(--wp--preset--color--dark-grey); color:var(--wp--preset--color--contrast); padding: 2.5rem 3rem; position: relative;}
footer .footer-title {display:flex; justify-content: center; gap:2rem; align-items: flex-start; }
footer .footer-title h2 {text-align: center; line-height: 1em;}
footer .footer-info .where-when {display: flex; align-items: center; justify-content: center;  gap:2rem;}
footer .footer-info .where {text-align: right; font-size:1.2rem; flex:1 0 0; }
footer .footer-info .when {font-size:1.6rem; flex:1 0 0; }
@media screen and (max-width: 659px) {
    footer .footer-info .where-when  {flex-direction: column; gap:0; }
    footer .footer-info .where, footer .footer-info .when {text-align: center; font-size:1.4rem; }
    footer .footer-info img {max-width:20vw;}
}

footer .footer-navigation {background:#000; color:var(--wp--preset--color--contrast); padding: 1.5rem; position: relative;}
footer .footer-navigation ul {display: flex; list-style: none; margin: 0; padding: 0 4rem; gap:1rem 4rem; justify-content: center; flex-wrap: wrap;}
footer .footer-navigation ul li {white-space: nowrap;}
footer .footer-navigation ul li a {transition: color 0.5s cubic-bezier(.1,0.7,0.3,0.9);}
footer .footer-navigation ul li a:hover {color:var(--wp--preset--color--quaternary);}

footer .footer-social {background:var(--wp--preset--color--dark-grey); color:var(--wp--preset--color--contrast); padding: 1rem 0;}
footer .footer-social p {margin: 0; opacity: 0.5;}



/*				OMNI					*/
.omni { top:50%; right:2rem; transform: translateY(-50%); background: transparent; cursor: pointer; display:inline-block; pointer-events: all;
    z-index:999; transition: all 0.5s cubic-bezier(0,0.75,0.25,1); height: 28px; position: absolute;   }
.omni__content {width: 1.5rem; height:1.5rem; position:relative;}
.omni span {border-top: 3px solid #fff; display: block; position: absolute; transition: all 0.5s; left:0.75rem; top:0.75rem;}
.omni span:nth-child(1) {transform: translate(-0.7rem,-0.5rem); width:1.4rem;}
.omni span:nth-child(2) {transform: translate(-0.7rem,0); width:1.4rem;}
.omni span:nth-child(3) {transform: translate(-0.7rem,0.5rem); width:1.4rem;}
.omni.right span:nth-child(1) {transform: translate(-0.7rem,-0.4rem) rotate(45deg); width:80%;}
.omni.right span:nth-child(2) {opacity: 0;}
.omni.right span:nth-child(3) {transform: translate(-0.7rem,0.4rem) rotate(-45deg);width:80%;}
.omni.close span:nth-child(1) {transform: translate(-0.9rem,0) rotate(-45deg); width: 1.75rem;}
.omni.close span:nth-child(2) {opacity: 0;}
.omni.close span:nth-child(3) {transform: translate(-0.9rem,0) rotate(45deg); width: 1.75rem;}
.omni.left span:nth-child(1) {transform: translate(-0.7rem,-0.4rem) rotate(-45deg); width:80%;}
.omni.left span:nth-child(2) {opacity: 0;}
.omni.left span:nth-child(3) {transform: translate(-0.7rem,0.4rem) rotate(45deg);width:80%;}
@media screen and (min-width: 1100px) {
    .omni {display: none;}
}


.wp-block-video video {display: block;}
.wp-block-embed.is-type-video {border-radius: 50px; overflow: hidden;}

.wp-block-cover.contain img {object-fit: contain !important;}


.post-type-archive-supplier ul.columns-5 {align-items:flex-end;}
.post-type-archive-supplier h2 {padding-bottom: 0;}


/*                  404                 */
.error404 .has-404-background {background: url('../images/bg-404.png');}
.error404 .wp-block-media-text__media img {max-width:200px;}
@media screen and (max-width: 599px) {
    .error404 .wp-block-media-text.is-stacked-on-mobile {gap:2rem;}
    .error404 .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media {grid-row:3; text-align: center;}
}


.nf-field-label .nf-label-span, .nf-field-label label {font-weight: 400; font-size:1.4rem;}
input[type=submit].ninja-forms-field {    font-family: var(--wp--preset--font-family--pain-de-mie); font-weight: 400; font-size:1.4rem; letter-spacing: 0.05em;
    padding: 0.75rem 3rem;}
