/*
Theme Name: Coral Reef Child
description: Client Theme - Coral Reef
Template: coral-reef-parent
Version: 1.0.0
Text Domain: coral-reef-child
Author: BCW
*/

@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,opsz,wght@0,18..144,300..900;1,18..144,300..900&display=swap');

.btn, .gform_button {background:var(--color-2);color:#fff;}
.btn:hover, .gform_button:hover {background:var(--color-3);color:#fff;}

.primary-footer .sitemap .menu li a {color:#fff;}
.primary-footer .sitemap .menu li a:hover {color:var(--color-3);}

.primary-footer .business-col .logo-row .logo-col img {filter: drop-shadow(0px 0px 1px #fff) drop-shadow(0px 0px 2px #fff) drop-shadow(0px 0px 3px #fff);}

.home #content-section {position: relative; z-index: 1; color: #000;}
.home #content-section:before {position:absolute; top:0;left: 0;width:100%; height: 100%; content: ""; background: #fff; opacity: .2;z-index: -1; }

.background-features .feature h2 { max-width: 680px;}
.background-features .feature .content { max-width: 100%;}

h1, h2, h3, .primary-footer .footer-row .business-name, h2.heading, .heading, .overlay p { font-family: "Merriweather", serif;}

.ip-heading h1, .footer-row {color: #fff !important;}
.services-section .services .service .heading {font-size: 32px;color: #fff !important;line-height: 45px;margin:0;}


.footer-row a {color: #fff !important;}
.footer-row a:hover {color: var(--color-2) !important;}

.section-heading {font-family: "Merriweather", serif !important;}

.redstar {font-size: 1.2em; color:#ff0000;}

.spacer {clear: both; height: 20px;}

.menu-section .description-prices .price {font-weight: bold;display: inline-block;}
.menu-section .description-prices .price:nth-child(2) {margin-left: 10px;}

.price.match-width {font-weight: bold;}


.background-features .feature h2::after {
    content: "";
    height: 0;
    width: 50px;
    background-color: unset;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
}

.anniv {display: flex; justify-content: center; align-items: center; flex-direction: column;font-size: 25px; text-align: center; margin: 50px auto; flex-direction:row; column-gap:30px; row-gap:30px; flex-wrap: wrap;}
.anniv img {width:400px;}
.linktitle {margin-top: 20px; display: block;}

.bottomcon {padding-bottom: 30px;}

.home .background-features .feature {min-height: 30vw;  flex: 1 1 33%;}

.cateringform {background:none;padding-bottom: 50px;}
.cateringform label {color: #fff;}
#field_2_9 label {display: block;}
#field_2_8 label {display: none;}

.formheading {color: var(--color-2); font-weight: bold; font-size:1.8em; text-align: center;display: block;    font-family: "Merriweather", serif; margin-bottom: 30px;}

.primary-header .logo-col {
    flex: unset !important;
}
body.sticky .primary-header .logo-col img { max-height: 350px;}
.logotxt {color: #fff; text-align: center; font-weight: bold; font-size: 1.5em;    font-family: "Merriweather", serif;}
body.sticky.scrolled .primary-header .logo-col .logotxt{font-size: .8em;}

.hours {text-transform: uppercase;}

.home #form-section {display: none;}
.home #feature-section {padding-bottom: 0;}

.hsub {    text-align: center;
    font-size: 1.3em;
    font-weight: bold;
    margin: 0 0 50px 0;}

.page-id-6 .main-section-inner .image-col img {border: 10px double var(--color-2);}

.hours {    font-weight: 700;}
.hours span {white-space: wrap; }
 .hours p {margin-bottom: 20px;}

 .hours span {
    white-space: wrap;
}
 .hours span {font-weight: 400;
    display: block;}

#contactinfobox {display: flex; justify-content: center; align-items: center; column-gap: 30px; row-gap:30px; border-bottom: 1px solid #ccc; padding-bottom:50px; margin: 0 auto; flex-wrap: wrap;}
.businfo {font-weight: 700; font-size: 20px; width:400px; max-width:100%; text-align: center;}
.businfo div {margin-bottom: 6px;}
.conhours {text-align: center;}



.ip-heading {	background-color: var(--color-2);}
.mobile-header .mobile-nav a, .mobile-header .nav-toggler {
    color: #fff;
}
.mobile-header .mobile-nav .current_page_item a, .mobile-header .mobile-nav a:hover, .toggle-less, .mobile-header .nav-toggler.active .icon  {color:var(--color-2) !important;}
.mobile-header .mobile-c2a a {color:#fff;}
.mobile-header .mobile-c2a a:hover {color:var(--color-2);}


.menubtns {display: flex; justify-content: center; flex-wrap: wrap; column-gap: 15px;row-gap:15px; margin-top:50px;border-bottom:1px solid var(--color-2);padding-bottom:50px;}