/*============== 0.1 Fonts ===============*/
/*headings*/
/*
@font-face {
    font-family: 'PalmBeach Regular';
    font-style: normal;
    font-weight: normal;
    src: local('PalmBeach Regular'), url('../fonts/PalmBeachBold.otf') format('opentype');
    }
*/

@font-face{
	font-family:'Santorini';
	font-style:normal;
	font-weight:600;
	font-display:swap;
	src:url('../fonts/Santorini.eot') format('embedded-opentype'),	url('../fonts/Santorini.woff2') format('woff2'),url('../fonts/SantoriniRegular.woff') format('woff'),url('../fonts/Santorini.ttf') format('truetype');
}
	
@font-face{
	font-family:'Rollgates';
	font-style:normal;
	font-display:swap;
	src:url('../fonts/Rollgates Luxury.ttf') format('truetype'),url('../fonts/Rollgates Luxury.otf') format('opentype');
}

@font-face {
	font-family: "Abigale";
	src: url("/wp-content/themes/joiabeach/assets/fonts/abigail-v4.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "Pertili";
	src: url("/wp-content/themes/joiabeach/assets/fonts/pertili.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
}


/*============== 1. General ==============*/
*:focus {
	outline: none!important;
}

body {
	/*font-family: 'Lato', sans-serif;*/
	font-family: 'Roboto Condensed', sans-serif;
	/*font-size: 16px;*/
	font-size: 13.6px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	position: relative;
	/*color: #060501;*/
	color: #5C4033;
	/*line-height: 1.7;*/
	line-height: 1.3;
	letter-spacing: 0.8px;
	background-color:#f9f7ef;
}

h1, .u-h1 {
	font-size: 30.6px;
}

h2, .u-h2 {
	font-size: 27.2px;
}

h3, .u-h3 {
	font-size: 23.8px;
}

h4, .u-h4 {
	font-size: 20.4px;
}

h5, .u-h5 {
	font-size: 17px;
}

h6, .u-h6 {
	font-size: 13.6px;
}

.u-text-small {
	font-size: 10px;
}

@media (min-width: 768px) {  
	body {
		font-size: 16px;
		line-height: 1.7;
	}
	
	h1, .u-h1 {
		font-size: 36px;
	}

	h2, .u-h2 {
		font-size: 32px;
	}

	h3, .u-h3  {
		font-size: 28px;
	}

	h4, .u-h4  {
		font-size: 24px;
	}

	h5, .u-h5  {
		font-size: 20px;
	}

	h6, .u-h6  {
		font-size: 16px;
	}

	.u-text-small {
		font-size: 12px;
	}
}

a {
	/*color: #1f1f1f;*/
	color: #483025;
	transition: color .3s ease;
}

a:hover,
a:focus,
a.active {
	color: #d7967d;
}

ul {
	margin: 0;
	padding: 0;
}

img {
	max-width: 100%;
	height: auto;
}

svg {
	max-width: 100%;
}

a:hover,
a:focus {
	text-decoration: none;
}


/*============== 2. Utilities ==============*/

/* fonts */


.u-text-underline {
	text-decoration:underline;
}

.u-text-nodecoration {
	text-decoration:none;
}

.u-font-serif {
	/*font-family: 'PalmBeach Regular';*/
	font-family: 'Roboto Condensed', sans-serif;
}

.u-font-serif-script {
	font-family: 'Santorini';
}

.u-font-italic {
	font-style: italic;
}

.u-font-upper{
	text-transform:uppercase;
}
.u-font-lower{
	text-transform:lowercase;
}


.u-weight-700 {
	font-weight: 700;
}

.u-weight-900 {
	font-weight: 900;
}

.u-font-line-height{
	line-height:initial;
}

.u-color-white {
	color: #fff !important;
	color: #F2F0EF !important;
}

.u-color-primary {
	/*color: #d7967d !important;*/
	/*Color Palette Mod*/
	color: #d7967d !important;
}

.u-color-secondary {
	color: #d7967d !important;
	color: #9C9070 !important;
}

.u-color-grey {
	color: #575757 !important;
	color: #5C4033 !important;
}

.u-color-gold {
	color: #9C9070 !important;
}

a.u-color-gold:hover{
	color: #575757 !important;
	color: #5C4033 !important;
}

/* borders */
.u-border-2{
	border: 2px solid;
}
.u-border-secondary {
	border-color: #d7967d !important;
	border-color: #9C9070 !important; 
}

.u-border-white {
	border-color: #fff !important;
}

.u-border-primary {
	border-color: #d7967d !important;
}

.u-border-none {
	border: 0px !important;
}



/* backgrounds */
.u-bg-secondary {
	/*background-color: #d7967d !important;*/
	background-color: #e5d5bd !important; 
	background-color: #9C9070 !important; 
}

.u-bg-tan {
	background-color: #e5d5bd !important; 
}

.u-bg-grey {
	background-color: #575757 !important; 
}

.u-bg-pink {
	background-color: #d7967d !important; 
}

.u-bg-white {
	background-color: #fff !important;
}

.u-bg-cream {
	background-color: #f9f7ef !important;
}

.u-bg-texture{
	background-image:url(../img/texture1.jpg);
	background-repeat:repeat;
}

.u-bg-primary {
	background-color: #d7967d !important;
}

.u-bg-cover {
	background-size: cover;
	background-repeat: no-repeat;
}

.u-bg-contain {
	background-size: contain;
}

.u-bg-no-repeat {
	background-repeat: no-repeat;
}

.u-bg-p-center {
	background-position: center;
}

.u-bg-p-bottom {
	background-position: bottom;
}

.u-bg-p-top {
	background-position: top;
}

/* spacing */
.u-mt-5 {
	margin-top: 5rem !important;
}

.mt-6 {
	margin-top: 6rem !important;
}

.mt-7 {
	margin-top: 7rem !important;
}

.mb-6 {
	margin-bottom: 6rem !important;
}

.mb-7 {
	margin-bottom: 7rem !important;
}

.mb-8 {
	margin-bottom: 8rem !important;
}

.pt-6 {
	padding-top: 6rem !important;
}

.pt-7 {
	padding-top: 7rem !important;
}

.pt-8 {
	padding-top: 8rem !important;
}

.pb-6 {
	padding-bottom: 6rem !important;
}

.pb-7 {
	padding-bottom: 7rem !important;
}

.pb-8 {
	padding-bottom: 8rem !important;
}

/*============== 3. Elements ==============*/

.footer__copy a:hover{
	color:#575757
}

.card{
	border-radius:0;
	border-width:2px;
}

.btn {
	text-transform: uppercase;
    font-size: 14px;
    display: inline-block;
    /*border-radius: 20px;*/
	border-radius: 0px;
	padding: 10px 40px;
	font-weight: 700;
	background-color: #d7967d;
	border: 1px solid #d7967d;
	color: #fff;
	color: #F2F0EF;
	transition: all .3s ease;
}

.btn:hover,
.btn:focus {
	background-color: #fff;
	color: #d7967d;
}


.btn-rollgates {
	padding: 15px 25px 12px 25px !important;
	font-weight: 600 !important;
	font-size:18px !important;
	background-color:transparent !important;
	border: 1px solid #5C4033 !important;
	border: 1px solid #d7967d !important;
	color: #5C4033 !important;
	color: #d7967d !important;
	font-family:Rollgates !important;
	line-height:normal !important;
	transition: color .25s ease,background-color .25s ease !important;
	width:auto !important;
}

.btn-rollgates:hover, .btn-rollgates:focus {
	background-color:#5C4033 !important;
	background-color:#d7967d !important;
	color:#F2F0EF !important;
	color:#F2F0EF !important;
}

.btn-rollgates-solid {
	padding: 15px 25px 12px 25px;
	font-weight: 600;
	font-size:18px;
	background-color:#d3bc8b;
	background-color:#f2f0ef;
	border: 0px;
	color: #5C4033;
	color: #d7967d;
	font-family:Rollgates;
	line-height:normal;
	transition: color .25s ease,background-color .25s ease !important;
	text-transform: uppercase;
}

.btn-rollgates-solid:hover, .btn-rollgates-solid:focus {
	background-color:#5C4033;
	background-color:#d7967d;
	color:#F2F0EF;
	border: 0px solid #F2F0EF;
}


.footer-rollgates{
	padding: 15px 25px 12px 25px;
	font-weight: 600;
	font-size:4em;
	background-color:#d3bc8b;
	background-color:#f2f0ef;
	background-color:transparent;
	/*
	background: rgba(242, 240, 239, .5);
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
	*/
	border: 0px;
	color: #5C4033;
	color: #d7967d;
	color: #ffffff;
	font-family:Rollgates;
	line-height:normal;
	transition: color .25s ease,background-color .25s ease !important;
	text-transform: uppercase;
}

@media(max-width: 992px) {
	.footer-rollgates{
		font-size: 2em;
	}
}

.btn-swoosh {
	padding: 40px 0px 30px 25px;
	min-width:396px;
	width:auto !important;
	font-weight: 400;
	font-size:18px;
	background-color:transparent;
	border: 0;
	color: #fff;
	color: #F2F0EF;
	background-image:url(../img/button_bg.png);
	background-size:cover;
}
.btn-swoosh:hover, .btn-swoosh:focus {
	background-color:transparent;
	/*background-image:url(../img/button_bg-dark.png);*/
	color: #ffffff;
}

.btn-swoosh:focus, .btn-swoosh:active{
	outline: 0 !important;
  border: none !important;
  -moz-outline-style: none !important;	
  box-shadow:none !important;	
}


.btn-swoosh-small {
		padding:29px 0px 20px 16px !important;
		min-width: 285px !important;	
		font-size:14px !important;
		background-color: transparent !important;
		border: 0px !important;
		margin-top:1.5em;
	}
	
.btn-swoosh-large {
	padding:75px 0px 30px 40px !important;
}

.btn-swoosh-small:hover {
	color:#fff !important;
	color: #F2F0EF !important;
}

@media(max-width: 576px) {
	.btn-swoosh {
		padding:29px 0px 20px 16px !important;
		min-width: 285px !important;	
		font-size:14px !important;
	}
}
    

.btn--ghost {
	background-color: transparent;
	color: #d7967d;
}

.btn--ghost:hover,
.btn--ghost:focus {
	background-color: #d7967d;
	color: #fff;
	color: #F2F0EF;
}

.btn--full {
	display: block;
}

.btn--big {
	padding: 13px 70px;
}

.back-to-top {
    position: fixed;
    bottom: 6em;
    right: 1.1em;
	border-radius:25px !important;
    padding: .75em .95em 0.6em 1em !important;
    display: none;
	border-color: #d7967d;
	background-color: #fff;
	color: #d7967d;
}

.back-to-top:hover, .back-to-top:active  {
	border-color: #d7967d;
	background-color: #d7967d;
	color: #fff;
	color: #F2F0EF;
}

.list-bare {
	list-style: none;
}

.short-line {
	width: 80px;
	height: 2px;
	background-color: #d7967d;
	border: 0;
}

.short-line--black {
	background-color: #1f1f1f;
}

.icon--grey {
	color: #5C4033;
	transition: color .3s ease;
}

.icon:hover {
	color: #1f1f1f;
}

.event-card .card-body{
	padding:0px;
}

.event-card a:hover, .event-card a:active, .event-card a:visited, .event-card a:focus{
	color:inherit !important;
}

.card-body2{
	padding:1.25em;
}

.card-date{
	position:absolute;
	top: 0;
	left: 0;
	padding: 4px 10px;
}

.card-date em{
	display:block;
}

.card-date em.day{
	line-height:20px;
}
.card-date em.date{
	line-height:22px;
	font-style:normal;
}
.card-date em.month{
	line-height:20px;
}



/*============== 4. Header ==============*/
.header {
	padding: 20px 0;
	position: sticky;
	top: 0;
	background-color: #fff;
	z-index: 999;
	border-bottom: 1px solid #e7e7e7;
}

.header-black {
	/*position: absolute;*/
	position:fixed;
	top: 0;
	left: 0;
	right: 0;
	padding: 20px 0;
	background-color: rgba(0,0,0,0.4);
	/*background-color: rgba(255,255,255,0.4);*/
	z-index: 999;
}

.header-solid{
	padding: 20px 0;
	position: sticky;
	top: 0;
	background-color: #FFF;
	background-color: #f9f7ef;
	z-index: 999;
	/*border-bottom: 0px solid #e7e7e7;*/
	border-bottom: 1px solid #8c8c8c;
}

/*
.header-scrolled {
	background-color: rgba(0,0,0,0.65);
}
*/

.header__logo span {
	display: block;
	font-size: 30px;
	text-transform: uppercase;
	letter-spacing: 4px;
    color: #fff;
	color: #F2F0EF;
}

.desktop-nav {
	list-style: none;
}

.desktop-nav li {
	margin: 0 20px;
	position: relative;
}

.desktop-nav__link {
	text-transform: uppercase;
	font-size: 14px;
}

.header-black .desktop-nav__link {
	color: #fff;
	color: #F2F0EF;
	font-weight: 600;
}

.header-black .desktop-nav__link.active {
	color: #d7967d;
}

.header-solid .desktop-nav__link {
	color: #5C4033;
	font-weight: 600;
}

.header-solid .desktop-nav__link.active {
	color: #d7967d;
}


.desktop-nav__submenu {
	position: absolute;
	top: 100%;
	left: -40px;
	background-color: #d7967d;
	padding: 20px 20px 20px 20px;
	min-width: 250px;
	opacity: 0;
	visibility: hidden;
}

.desktop-nav__item--has-submenu:hover > .desktop-nav__submenu {
	opacity: 1;
	visibility: visible;
}

.desktop-nav__submenu li {
	margin-bottom: 10px;
}
.desktop-nav__submenu li a {
	text-transform: uppercase;
	font-size: 14px;
}

.desktop-nav__submenu li a:hover {
	color: #fff;
	color: #F2F0EF;
}

.desktop-nav__submenu li:last-of-type {
	margin-bottom: 0;
}

.mobile-nav-trigger {
	display: block;
	margin-top: 0px;
}

.header-black .mobile-nav-trigger {
	color: #fff;
	color: #F2F0EF;
}

.header-solid .mobile-nav-trigger {
	color: #5C4033;
}

.mobile-nav-trigger .icon {
	font-size: 26px;
}

.mobile-nav-list {
	display: none;
	text-align: center;
    list-style: none;
    text-transform: uppercase;
    padding-bottom: 30px;
}

.mobile-nav-list li {
	border-bottom: 1px solid #5C4033;
    width: 80%;
    max-width: 400px;
    margin: 0 auto;
    padding: 10px 0;
}

.mobile-nav-list li:last-of-type {
	border-bottom: 0;
}

.header-black .mobile-nav-list {
    background-color: black;
    color: #fff;
	color: #F2F0EF;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    padding: 100px 0 40px;
    z-index: -1;
}

.header-solid .mobile-nav-list {
    background-color: #fff;
	background-color: #f9f7ef;
    color: #000;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    padding: 100px 0 40px;
    z-index: -1;
}

.header-black .mobile-nav-list li a {
	color: #fff;
	color: #F2F0EF;
}

.header-solid .mobile-nav-list li a {
	color: #5C4033;
}

.mobile-nav-list__submenu {
	padding-top: 10px;
	padding-bottom: 10px;
	display: none;
	list-style: none;
}

.mobile-nav-list__submenu > li {
	padding-bottom: 5px;
	border-bottom: 0;
}

.mobile-nav-list__item--has-submenu > a {
	position: relative;
	display: inline-block;
}

.mobile-nav-list__item--has-submenu > a:after {
	content: "+";
	position: absolute;
	right: -20px;
	line-height: 27px;
}

.mobile-nav-list__item--has-submenu > a.active:after {
	content: "-";
}

/*============== 5. Hero ==============*/
.hero {
	padding: 110px 0;
	background-size: cover;
	background-repeat: no-repeat;
	color: #fff;
	color: #F2F0EF;
}

.hero--v2 {
	padding: 110px 0;
	position: relative;
}

.hero--v2:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #280600;
	opacity: 0.45;
}

.hero-imgslider .hero--v2:before {
	background: transparent !important;
}

.hero--slide {
	height: 500px;
}

.hero--sm {
	padding: 60px 0;
}

.hero--md {
	padding: 100px 0;
}

.hero--md--v2 {
	padding: 120px 0 100px;
}

.hero__title {
	font-size: 42px;
	font-weight: 700;
	margin-bottom: 20px;
}


.hero__accent {
	font-weight: 700;
	font-size: 1.35em;
	/*font-style: italic;*/
	text-shadow:0px 0px 15px #000;
}



.hero__subtitle {
	font-weight: 700;
}

.faq-accordion .btn-link{
	background:none !important;
	border:none !important;
	cursor:pointer;
	text-decoration:none;
	width: 100%;
text-align: left;
}

.faq-accordion .btn-link:hover{
	color:#000000;
	text-decoration:none;
}

.faq-accordion .card{
	margin-bottom:1em;
}


@media(min-width: 992px) {
	.hero {
		padding: 220px 0;
	}

	.hero--v2 {
		padding: 300px 0 220px;
	}

	.hero--slide {
		height: 80vh;
	}

	.hero--slide--v2 {
		padding: 260px 0 220px;
	}

	.hero--sm {
		padding: 80px 0;
	}

	.hero--md {
		padding: 120px 0;
	}

	.hero--md--v2 {
		padding: 200px 0 120px;
	}

	.hero__title {
		font-size: 50px;
	}
	
	.hero__subtitle {
		font-size: 18px;
	}
	
}

.hero-slider .slick-dots {
	position: absolute;
	bottom: 40px;
	width: 100%;
	text-align: center;
}

.hero-slider .slick-dots li {
	display: inline-block;
	margin: 0 4px;
}

.hero-slider .slick-dots li button {
	border: 0!important;
	border-radius: 50%;
	background-color: rgba(255,255,255,0.5)!important;
	cursor: pointer;
	height: 14px;
	width: 14px;
	padding: 0;
	font-size: 0;
}

.hero-slider .slick-dots li.slick-active button {
	background-color: #fff!important;
}

/*============== Pagination ==============*/
.navigation li a,
.navigation li a:hover,
.navigation li.active a,
.navigation li.disabled {
    color: #fff;
	color: #F2F0EF;
    text-decoration:none;
}
 
.navigation li {
    display: inline;
}
 
.navigation li a,
.navigation li a:hover,
.navigation li.active a,
.navigation li.disabled {
    background-color: #d7967d;
    border: 1px solid #d7967d;
    border-radius: 0px;
    cursor: pointer;
    padding: 12px;
    padding: 0.75rem;
}
 
.navigation li a:hover,
.navigation li.active a {
    background-color: #fff;
	color:#d7967d;
}

/*============== 6. Story ==============*/
.story-block__upper-title {
	color: #d7967d;
	font-size: 14px;
	text-transform: uppercase;
	margin-bottom: 10px;
	font-weight: 700;
}

.story-block__title {
	font-size: 20px;
	margin-bottom: 50px;
	position: relative;
}

.story-block__title:after {
	content: "";
	position: absolute;
	bottom: -18px;
	left: 40%;
	width: 20%;
	height: 2px;
	background-color: #d7967d;
}

.story-block p {
	letter-spacing: 0.3px;
}

@media(min-width: 992px) {
	.story-block__title {
		font-size: 27px;
	}
}

/*============== 7. Slider ==============*/
.slider-section {
	position: relative;
	padding: 60px 0 90px;
}

.slider-section__illustration {
	position: absolute;
	top: -175px;
	right: 0;
	z-index: -1;
	opacity: 0.5;
}

.slider-item {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	height: 250px;
	position: relative;
}

.slider-item span {
	display: inline-block;
	width: 85%;
    max-width: 200px;
	background: #d7967d;
	font-size: 14px;
    padding: 10px;
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 0;
    color: #575757;
    font-weight: 700;
}

.slider-item--text-sm {
	padding: 8px;
	line-height: 1.3;
}

.slider-section mark {
	background-color: transparent;
	color: #575757;
	font-style: italic;
	display: block;
	font-weight: 500;
}

.slider-section .slick-list {
	height: 280px;
}

.slider-section .slider-arrow {
	position: absolute;
	top: 100%;
	cursor: pointer;
	/*width: 60px;*/
}

.slider-section .slider-arrow svg path {
	stroke: #d7967d;
	stroke-width: 1px;
	fill:#d7967d;
}

.slider-section .slider-arrow--prev {
	left: calc(50% - 60px);
}

.slider-section .slider-arrow--next {
	right: calc(50% - 60px);
}

.event-slider .slider-arrow {
	position: absolute;
	top: 100%;
	cursor: pointer;
	/*width: 60px;*/
}

.event-slider .slider-arrow svg path {
	stroke: #fff;
	stroke-width: 1px;
	fill:#fff;
}

.event-slider .slider-arrow--prev {
	left: calc(50% - 60px);
}

.event-slider .slider-arrow--next {
	right: calc(50% - 60px);
}

@media(min-width: 1270px) {
	.slider-section .slider-arrow {
		top: calc(50% - 27px);
		width: auto;
	}

	.slider-section .slider-arrow--prev {
		left: -60px;
	}
	
	.slider-section .slider-arrow--next {
		right: -60px;
	}
	
	.event-slider .slider-arrow {
		top: calc(50% - 27px);
		width: auto;
	}

	.event-slider .slider-arrow--prev {
		left: -60px;
	}
	
	.event-slider .slider-arrow--next {
		right: -60px;
	}
}

/*============== 8. Menu ==============*/
.menu ul {
	list-style: none;
}

.menu-nav li {
	text-transform: uppercase;
}

.menu-nav__link.u-color-primary {
	padding-bottom: 2px;
	border-bottom: 2px solid #d7967d;
}

.menu-tab {
	display: none;
	margin: 50px 0;
}

.menu-tab:first-of-type {
	display: block;
}

.menu-tab__img {
	position: absolute;
	top: -100px;
	right: 0;
	opacity: 0.5;
	z-index: -1;
}

@media(min-width: 768px) {
	.menu-list {
		width: 50%;
	}
}

.menu-list-item {
	margin-bottom: 18px;
}

.menu-list-item__title {
	font-weight: 700;
	font-size: 20px;
	flex: 1 0 auto;
}

.menu-list-item sup {
	color: #575757;
    margin-left: 2px;
    font-family: "Lato";
    font-size: 12px;
    font-weight: 400;
}

.menu-list-item__desc {
	color: #575757;
	max-width: 80%;
	font-size: 14px;
}

.menu-list-item__desc,
.menu-list-item__price {
  flex: 1 0 auto;
}

.menu-list-item__dots {
  flex: 0 1 auto;
}

.menu-list-item__dots::before {
    display: block;
    overflow: hidden;
    content: ".....................................................................................................";
    height: 2em;
    padding: 0 6px;
    word-break: break-word;
    float: right;
}

/*============== 9. Testimonials ==============*/
.testimonial__quote {
	font-size: 22px;
}

.testimonial__person {
	font-size: 18px;
	font-style: italic;
}

.testimonials .slick-dots {
	margin-top: 20px;
}

.testimonials .slick-dots li {
	display: inline-block;
	margin: 0 4px;
}

.testimonials .slick-dots li button {
	background: transparent;
	border-radius: 50%;
    height: 14px;
    width: 14px;
    font-size: 0;
    border: 1px solid #1f1f1f;
    padding: 0;
}

.testimonials .slick-dots li.slick-active button {
	background: #1f1f1f;
}

/*============== 10. Article Card ==============*/
.article-card {
	display: block;
	height: 100%;
	background-color: #fff;
	text-align: center;
	padding-bottom: 10px;
	border: 15px solid #d7967d;
	margin-bottom: 30px;
}

.article-card--sm {
	height: auto;
}

.article-card__img-wrapper {
	height: 200px;
	width: 100%;
	overflow: hidden;
}

.article-card__img {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	height: 100%;
	width: 100%;
	transition: transform .8s ease;
}

.article-card__date {
	font-size: 14px;
	color: #575757;
}

.article-card:hover .article-card__img {
	transform: scale(1.1);
}

@media(min-width: 768px ) and (max-width: 991px) {
	.article-card__img {
		height: 100px;
	}
}

/*============== 11. Gallery ==============*/
.grid-item,
.grid-sizer {
	/*width: 100%;*/
	width: 46%;
}

.gutter-sizer {
		width: 4%;
	}

.grid-item {
	margin-bottom: 4%;
}


@media(min-width: 576px) {
	.grid-item,
	.grid-sizer {
		width: 46%;
	}

	.gutter-sizer {
		width: 4%;
	}
}

@media(min-width: 768px) {
	.grid-item,
	.grid-sizer {
		width: 31.333%;
	}

	.grid-item {
		margin-bottom: 3%;
	}

	.gutter-sizer {
		width: 3%;
	}
}

/*============== 12. Blog ==============*/
.wysiwyg p {
	margin-bottom: 20px;
	letter-spacing: 0.3px;
	color: #575757;
}

.wysiwyg a {
	text-decoration: underline;
	font-weight: 700;
}

.wysiwyg img {
	margin-bottom: 20px;
}


/*============== 13. Form ==============*/
.form input,
.form select,
.form textarea,
.form button {
	width: 100%;
}

.form-confirmation {
	color: #d7967d;
	text-align: center;
	display: none;
}

.form__field {
	margin-bottom: 20px;
}

.form__field input,
.form__field textarea,
.form__field select {
	background-color: #d7967d;
	padding: 10px;
	border: 0;
	border-bottom: 3px solid #9C9070;
	color: #575757;
	color: #fff;
	color: #F2F0EF;
}


.form__field input::placeholder {
  color: #fff;
  color: #F2F0EF;
  opacity: 0.6;
}

.form__field input:-ms-input-placeholder {
 color: #fff;
 color: #F2F0EF;
 opacity: 0.6;
}

.form__field input::-ms-input-placeholder {
 color: #fff;
 color: #F2F0EF;
 opacity: 0.6;
}


.form__field input[type="submit"],
.form__field button {
	background-color: #9C9070;
	border: 1px solid #9C9070;
	padding: 10px;
	cursor: pointer;
	color: #fff;
	color: #F2F0EF;
	font-weight: 700;
	letter-spacing: 1.5px;
	transition: all .3s ease;
}

.form__field input[type="submit"]:hover,
.form__field input[type="submit"]:focus,
.form__field button:hover,
.form__field button:focus {
	background-color: #fff;
	color: #d7967d;
}

.form__field select {
	height: 50px;
	-webkit-appearance: none;
}

.form__field__error {
	color: #575757;
	font-size: 14px;
	font-style: italic;
	display: none;
}

/*============== 14. Contact Info ==============*/
.contact-info {
	list-style: none;
    height: 100%
}

.contact-info li {
    font-size: 16px;
    padding: 10px;
}

.contact-info li span {
	text-transform: uppercase;
    color: #d7967d;
    display: block;
    font-weight: 700;
    font-size: 16px;
    letter-spacing: 1.5px;
}

/*============== 15. Footer CTA ==============*/
.footer-cta {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	padding: 100px 0;
}

.footer-cta__title {
	font-size: 42px;
	font-weight: 700;
}

.footer-cta__subtitle {
	font-weight: 700;
	margin-bottom: 30px;
}

@media(min-width: 992px) {
	.footer-cta__title {
		font-size: 50px;
	}

	.footer-cta__subtitle {
		font-size: 18px;
	}
}

/*============== 16. Footer ==============*/
.footer-widgets {
	padding: 60px 0;
	padding: 40px 0 20px 0;
	font-size: 14px;
}

.footer p {
	margin-bottom: 0;
}
.footer__copy {
	font-size: 14px;
}

.footer-widget {
	margin-bottom: 30px;
}

.footer-widget__title {
	font-size: 14px;
	font-weight: 700;
	margin-bottom: 15px;
	margin-bottom: 5px;
	color: #5C4033;
}

.footer-widget,
.footer-widget a {
	color: #5C4033;
}

.footer-widget ul {
	list-style: none;
}

.footer-widget__social-list li {
	display: inline-block;
	margin-right: 11px;
}

.footer-widget__social-list .icon {
	font-size: 40px;
}

.footer-social-list li:last-of-type {
	margin-right: 0;
}

/* fix for IE */
.mobile-nav-trigger .icon {
	width: 26px;
	height: 26px;
	display: block;
}

.footer-widget__social-list .icon {
	
}

.icon svg {
	fill: currentColor;
	display: block;
	width: 100%;
	height: 100%;
}

.icon .icon-inner {
	display: block;
	width: 100%;
	height: 100%;
}


/* GALLERY */
.filtering {
    margin-bottom: 40px;
}
.filtering span {
    cursor: pointer;
    margin-right: 10px;
	margin-left:10px;
    display: inline-block;
    margin-bottom: 5px;
}
.filtering span:last-child {
    /*margin: 0;*/
}

.portfolio-wrapper {
    position: relative;
    overflow: hidden;
}
.portfolio-overlay {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    transition: all 500ms ease;
}
.portfolio-wrapper .portfolio-image img {
    transform: scale(1.2);
    will-change: transform;
    transition: all 0.5s ease;
    width: 100%;
}
.portfolio-wrapper:hover .portfolio-image img {
    transform: none;
}
.portfolio-overlay:before {
    position: absolute;
    display: inline-block;
    top: 15px;
    right: 15px;
    bottom: 15px;
    left: 15px;
    border: 1px solid rgba(255, 255, 255, 0.36);
    content: "";
    opacity: 0;
    transition: all 0.5s ease;
    transform: scale(0.85);
}
.portfolio-overlay .portfolio-content {
    position: absolute;
    bottom: 50%;
    left: 0;
    width: 100%;
    text-align: center;
    opacity: 0;
    padding: 0 35px;
}
.portfolio-content h4 {
    color: #FFF;
	color: #F2F0EF;
    font-weight: 600;
    font-size: 20px;
    text-transform: capitalize;
    letter-spacing: 1px;
    margin-bottom: 0px;
}
.portfolio-content p {
    color: #FFF;
	color: #F2F0EF;
    font-weight: 500;
    letter-spacing: 1px;
    margin-bottom: 0;
}
.portfolio-content > a {
    line-height: 42px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: #FFF;
	color: #F2F0EF;
    display: inline-block;
    text-align: center;
    margin-bottom: 15px;
    font-weight: 800;
}
.portfolio-wrapper:hover .portfolio-overlay {
    background-color: rgba(0, 0, 0, 0.65);
}
.portfolio-wrapper:hover .portfolio-overlay:before {
    opacity: 1;
    visibility: visible;
    transform: none;
}
.portfolio-wrapper:hover .portfolio-overlay .portfolio-content {
    transform: translateY(50%);
    transition: transform 0.5s ease;
    opacity: 1;
}
@media screen and (max-width: 1199px) {
    .portfolio-content h4 {
        font-size: 18px;
    }
}
@media screen and (max-width: 991px) {
    .portfolio-content h4 {
        margin-bottom: 0px;
    }
    .portfolio-content p {
        font-size: 15px;
    }
    .portfolio-content > a {
        margin-bottom: 10px;
    }
}
@media screen and (max-width: 767px) {
    .portfolio-content h4 {
        font-size: 17px;
    }
    .portfolio-content p {
        font-size: 14px;
    }
}
@media screen and (max-width: 575px) {
    .portfolio-content h4 {
        font-size: 16px;
    }
}
.grid .grid-item {
    position: relative;
    overflow: hidden;
}
.grid .grid-item .portfolio-wrapper {
    position: relative;
    overflow: hidden;
}
.grid .grid-item .portfolio-overlay {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    transition: all 500ms ease;
}
.grid .grid-item .portfolio-wrapper .portfolio-image img {
    transform: none;
    will-change: transform;
    transition: none;
    width: 100%;
}
.grid .grid-item .portfolio-wrapper:hover .portfolio-image img {
    transform: none;
}
.grid .grid-item .portfolio-overlay:before {
    position: absolute;
    display: inline-block;
    top: 15px;
    right: 15px;
    bottom: 15px;
    left: 15px;
    border: 1px solid rgba(255, 255, 255, 0.36);
    content: "";
    opacity: 0;
    transition: all 0.5s ease;
    transform: scale(0.85);
}
.grid .grid-item .portfolio-overlay .portfolio-content {
    position: absolute;
    bottom: 50%;
    left: 0;
    width: 100%;
    text-align: center;
    opacity: 0;
}
.grid .grid-item .portfolio-content h4 {
    color: #FFF;
	color: #F2F0EF;
    font-weight: 600;
    letter-spacing: 1px;
    font-size: 20px;
    margin-bottom: 0px;
}
.grid .grid-item .portfolio-content p {
    color: #FFF;
	color: #F2F0EF;
    font-weight: 500;
    letter-spacing: 1px;
    margin-bottom: 0;
}
.grid .grid-item .portfolio-content a {
    line-height: 36px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    color: #FFF;
	color: #F2F0EF;
    display: inline-block;
    text-align: center;
    margin-bottom: 0px;
    font-weight: 800;
}
.grid .grid-item .portfolio-wrapper:hover .portfolio-overlay {
    background-color: rgba(0, 0, 0, 0.65);
}
.grid .grid-item .portfolio-wrapper:hover .portfolio-overlay:before {
    opacity: 1;
    visibility: visible;
    transform: none;
}
.grid .grid-item .portfolio-wrapper:hover .portfolio-overlay .portfolio-content {
    transform: translateY(50%);
    transition: transform 0.5s ease;
    opacity: 1;
}
@media screen and (max-width: 1199px) {
    .grid .grid-item .portfolio-content h4 {
        font-size: 18px;
    }
}
@media screen and (max-width: 991px) {
    .grid .grid-item .portfolio-content h4 {
        margin-bottom: 0px;
    }
    .grid .grid-item .portfolio-content p {
        font-size: 15px;
    }
    .grid .grid-item .portfolio-content a {
        margin-bottom: 10px;
    }
}
@media screen and (max-width: 767px) {
    .grid .grid-item .portfolio-content h4 {
        font-size: 17px;
    }
    .grid .grid-item .portfolio-content p {
        font-size: 14px;
    }
}
@media screen and (max-width: 575px) {
    .grid .grid-item .portfolio-content h4 {
        font-size: 16px;
    }
    .grid .grid-item .portfolio-overlay:before {
        top: 10px;
        right: 10px;
        bottom: 10px;
        left: 10px;
    }
}


.modal-content {
	background-color:#000 !important;
	
}
.close {
	color:#fff;
	color: #F2F0EF;
}
.modal-header {
	border-bottom:none;
}

.modal-title{
	color:#fff;
	color: #F2F0EF;
}


/* EVEBNT INQUIRY */

.tripleForm h2{
	font-family: 'Roboto Condensed', sans-serif;
}
/*--------------------------------------------------------------
# TRIPLESEAT LEAD
--------------------------------------------------------------*/
#tripleseat_embed_form {
   display: inline-block;
	text-align: left;
	width: 100%;
	padding: 20px !important;
	background-color: transparent !important;
	max-width:800px;
}

#tripleseat_embed_form h2{
	color:#5C4033;
	font-size:1.75rem;
}

#tripleseat_embed_form label{
	color:#5C4033;
}

#tripleseat_embed_form input::placeholder{
	color:#fff !important;
	color: #F2F0EF !important;
	opcaity: .06;
}

#tripleseat_embed_form input::placeholder {
  color: #fff;
  color: #F2F0EF;
  opacity: 0.6;
}

#tripleseat_embed_form input:-ms-input-placeholder {
 color: #fff;
 color: #F2F0EF;
 opacity: 0.6;
}

#tripleseat_embed_form input::-ms-input-placeholder {
 color: #fff;
 color: #F2F0EF;
 opacity: 0.6;
}


#tripleseat_embed_form input, #tripleseat_embed_form select, #tripleseat_embed_form textarea{
	/*background-color:#3E47FF !important;*/
	background-color: #d7967d !important;
	padding: 10px !important;
	border: 0 !important;
	border-bottom: 3px solid #9C9070 !important;
	color: #fff !important;
	color: #F2F0EF !important;
	width:100%;
	
}

.row_details_header td{
	padding-top:3em !important;
}

#tripleseat_embed_form #lead_submit{
	display: block !important;
	width: 100% !important;
	text-align: center !important;
	background-color: #9C9070 !important;	
	border: 1px solid #9C9070 !important;
	color: #FFFFFF !important;
	color: #F2F0EF !important;	
	font-size: 1.125rem !important;	
	line-height: 2rem !important;	
	letter-spacing: 1.5px !important;	
	font-weight: 700 !important;	
	border-radius: 5px !important;	
	-webkit-border-radius: 0px !important;
	-moz-border-radius: 0px !important;
	border-radius: 0px !important;
	transition: all .3s ease;
	cursor: pointer !important;
	text-transform:uppercase;
}

#tripleseat_embed_form #lead_submit:hover{
	background-color: #fff !important;
	color: #d7967d !important;
}

.tripleForm{
	text-align:center;
	margin-bottom:2rem;
}

.tripleForm table{
	width:100%;
}


@media (max-width: 575px) {
#tripleseat_embed_form {
    padding: 3px !important;
}
}


.contact-form label{
	display:none;
}

.contact-form .wpforms-field {
	margin-bottom:20px;
	text-align:left;
}

.contact-form .wpforms-recaptcha-container {
	margin-bottom:20px;
}

.contact-form .wpforms-error{
	color:#ff0000;
}
.contact-form .wpforms-confirmation-container{
	background-color: #d7967d;
	padding: 2em;
	text-align: center;
	color: #fff;
	color: #F2F0EF;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 1.5em;
}


.hero__title-script {
	text-rendering:optimizeLegibility;
	font-feature-settings: "kern" 1;
}

/* 
Extra small devices (portrait phones, less than 576px) 
No media query since this is the default in Bootstrap because it is "mobile first"
*/
.header__logo img{
		width:50%;
	}
	
.head-reservations{
	padding:8px 15px;
}

.headReserveCol{
	padding-right:6px;
}

.hero-imgslider .hero{
	height:75vh;
}

.hero__title-script {
	font-size: 2.90em;
	font-weight: 700;
	margin-bottom: 10px;
	padding-top: 1em;
	margin-top: -1em;
	padding-bottom: 1em;
	margin-bottom: -0.5em;
}

.hero__title-script-home {
	font-size: 3em;
	font-weight: 700;
	margin-bottom: 20px;
}

.hr_lines{
	position: relative;
	display: inline-block;
	background-color:#f9f7ef;
	padding: 0 10px;
}

.hr_lines:before {
  content: "";
  height: 1px;
  border-top: 0px solid #d7967d;
  border-bottom: 3px solid #d7967d;
  position: absolute;
  width: 150%;
  top: 50%;
  left: -25%;
  z-index: -999;
}

.home-slider-full{
	display:none;
}
.home-slider-mobile{
	display:block;
}
.home-hero-fixed-full{
		display:none;
	}
	.home-hero-fixed-mobile{
		display:block;
	}

.header-black {
	padding: 10px 0;
}
.header-solid {
	padding: 10px 0;
}

.hero-home-slider{
    opacity: 0;
    visibility: hidden;
    transition: opacity 1s ease;
    -webkit-transition: opacity 1s ease;
}
.hero-home-slider.slick-initialized {
    visibility: visible;
    opacity: 1;    
}

.modal-dialog {
    max-width: 100%;
}

.ekko-lightbox{
	padding-right: 0px !important;
}

.mail-list-icon{
	width:50%;
}
 
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {  
	.header__logo img{
		width:30%;
	}
	.head-reservations{
		padding:10px 40px;
	}
	
	.headReserveCol{
		padding-right:15px;
	}

	
	.hero-imgslider .hero{
		height:75vh;
	}
	
	.hero__title-script {
		/*font-size: 70px;*/
		font-size: 4em;
	}
	.hero__title-script-home {
		/*font-size: 70px;*/
		font-size: 3em;
	}
	
	.hr_lines:before {
		width:200%;
		left: -50%;
	}
	
	.home-slider-full{
		display:none;
	}
	.home-slider-mobile{
		display:block;
	}
	.home-hero-fixed-full{
		display:none;
	}
	.home-hero-fixed-mobile{
		display:block;
	}
	.header-black {
		padding: 10px 0;
	}
	.header-solid {
		padding: 10px 0;
	}
}
 
/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {  
	.header__logo img{
		width: 30%;
	}
	.head-reservations{
		padding:10px 40px;
	}
	.hero-imgslider .hero{
		height:75vh;
	}
	
	.hero__title-script {
		/*font-size: 70px;*/
		font-size: 5em;
	}
	.hero__title-script-home {
		/*font-size: 70px;*/
		font-size: 3em;
	}
	
	.home-slider-full{
		display:block;
	}
	.home-slider-mobile{
		display:none;
	}
	.home-hero-fixed-full{
		display:block;
	}
	.home-hero-fixed-mobile{
		display:none;
	}
	.header-black {
		padding: 20px 0;
	}
	.header-solid {
		padding: 20px 0;
	}
	
	.mail-list-icon{
		width:100%;
	}
}
 
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
	.modal-dialog {
		max-width: 75%;
	}

	
	.header__logo img{
		width:auto;
	}
	.head-reservations{
		padding:10px 20px;
	}
	.hero-imgslider .hero{
		height:75vh;
	}
	
	.hero__title-script {
		/*font-size: 70px;*/
		font-size: 6em;
	}
	.hero__title-script-home {
		/*font-size: 70px;*/
		font-size: 4em;
	}
	
	.home-slider-full{
		display:block;
	}
	.home-slider-mobile{
		display:none;
	}
	.home-hero-fixed-full{
		display:block;
	}
	.home-hero-fixed-mobile{
		display:none;
	}
	.header-black {
		padding: 20px 0;
	}
	.header-solid {
		padding: 20px 0;
	}
}
 
/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {  
    .header__logo img{
		width:auto;
	}
	.head-reservations{
		padding:10px 40px;
	}
	.hero-imgslider .hero{
		height:75vh;
	}
	
	.hero__title-script {
		/*font-size: 70px;*/
		font-size: 6em;
		line-height:auto !important;
	}
	.hero__title-script-home {
		/*font-size: 70px;*/
		font-size: 5em;
	}
	
	.home-slider-full{
		display:block;
	}
	.home-slider-mobile{
		display:none;
	}
	.home-hero-fixed-full{
		display:block;
	}
	.home-hero-fixed-mobile{
		display:none;
	}
	.header-black {
		padding: 20px 0;
	}
	.header-solid {
		padding: 20px 0;
	}
}