/*
Theme Name: Centre of Attention Venue Decor
Theme URI: https://generatepress.com
Description: Default GeneratePress child theme
Author: Hefin Sankala
Author URI: https://WPFreelancer.co.uk
Template: generatepress
Version: 0.1
*/
/* GeneratePress Site CSS */
.custom-border {
border-radius:255px 15px 225px 15px/15px 225px 15px 255px;
}
.custom-bg-shape {
border-radius: 15px 225px 15px 255px/255px 15px 225px 15px;
}
/*
body:not(.page) :is(.site-header,.main-navigation) {
background-color: var(--base);
}*/
/* End GeneratePress Site CSS */
.gb-headline {
/* font-size:250px !important; */
}
.venue-decor-title {
top: -16px;
left: 49px;
position: relative;
font-size: 31px;
letter-spacing: 0.35rem;
}
.site-header {
/* background-color: #340E3B; */
/* color: #ffffff; */
/* background-image: linear-gradient(90deg, #350a3c, #d36fe0 350%) !important;*/
}
.site-header, .main-navigation.mobile-header-navigation, #generate-slideout-menu {
/* background-color: #340E3B; */
/* color: #ffffff; */
background-image: linear-gradient(90deg, #350a3c, #d36fe0 350%) !important;
}
.main-navigation.is_stuck {
/* background-color: #340E3B; */
/* color: #ffffff; */
background-image: linear-gradient(90deg, #350a3c, #d36fe0 350%) !important;
}
.main-navigation .mobile-header-navigation
/*
nav#site-navigation {
background: linear-gradient(to bottom, #3498db, #2f4468);
}*/
/*https://web.dev/articles/css-marker-pseudo-element */
.eeevent_description li {
/* list-style-image: url(/right-arrow.svg);*/
/* OR */
list-style-type: '👉';
padding-inline-start: 1ch;
}
.image-container {
position: relative;
}
.our-work-template-image::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(to top, rgba(0, 0, 0, 0.7) , rgba(0, 0, 0, 0) 50%);
}
.our-work-template-image {
position: relative;
overflow: hidden;
}
.our-work-template-image::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: inherit;
background-size: 100%;
transition: transform 0.3s ease-in-out;
}
.our-work-template-image:hover::before {
transform: scale(1.1);
}
.previous_event_select_btn {
white-space: nowrap;
}
.footer-logo {
display: block;
margin: 0 auto;
text-align: center;
}
.gb-container-5c053ed4 form {
}
.gb-container-5c053ed4 form p {
}
/* .gb-container-5c053ed4 form label {
//display: block;
// margin-bottom: 5px;
} */
.gb-container-5c053ed4 form input[type="text"],
.gb-container-5c053ed4 form input[type="email"],
.gb-container-5c053ed4 form input[type="tel"],
.gb-container-5c053ed4 form select,
.gb-container-5c053ed4 form textarea {
width: 100%;
}
.gb-container-5c053ed4 form input[type="submit"] {
width: 100%;
padding: 10px;
color: #fff;
border: none;
border-radius: 8px;
cursor: pointer;
transition: background-color 0.3s ease-in-out;
}
form input[type="submit"]:hover {
background-color: #0056b3;
}
.menu-toggle > .gp-icon.icon-menu-bars {
font-size:20px;
}
.site-logo.mobile-header-logo img {
padding: 5px 0px !important;
}
/* https://generatepress.com/forums/topic/how-to-center-logo-on-mobile/ */
.site-logo.mobile-header-logo {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}
#mobile-header .menu-toggle {
order: -1;
margin-left: auto;
}
.navigation-branding .main-title, .mobile-header-navigation .site-logo {
margin-left: 0px !important;
}
.gb-container.gb-container-459edc30 {
display: flex;
flex-direction: column; /* Optional, if you want elements stacked vertically */
align-items: center;
justify-content: center;
}
/* Optional: Center text within the buttons */
.mobile-number-menu a {
font-size: 14px !important;
}
.mobile-menu-email-address a {
font-size: 14px !important;
text-transform: lowercase !important;
}
.slideout-navigation .main-nav {
margin-bottom: 0px !important;
}
/* https://generatepress.com/forums/topic/container-header-padding-on-mobile-does-not-change/ */
#mobile-header {
padding: 4px;
}
.ngg-gallery-thumbnail-box {
margin-left: 20px;
margin-bottom: 16px;
}
.ngg-galleryoverview.default-view .ngg-gallery-thumbnail a {
margin: 0px !important;
box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px !important;
}
/* https://www.svgbackgrounds.com/custom-css-bullets-with-marker/ */
.custom-bulleted-list-ticks {
li {
padding-top: 0.5em;
padding-left: 0.5em;
font-weight: bold;
list-style-image: url('data:image/svg+xml,');
color:white;
font-size: 14px;
}
}
.custom-bulleted-list-ticks li span.text-bullet-position {
vertical-align: 0.35em;
}
.our-work-template-image {
border-radius: 5px 5px 0px 0px;
}
.white-text-link {
color: white !important;
}
.one-container.archive .post:not(:last-child):not(.is-loop-template-item), .one-container.blog .post:not(:last-child):not(.is-loop-template-item) {
padding-bottom: 20px !important;
}
.page-numbers {
/* border: solid #ad41c3 1px; */
}
.page-numbers.gb-block-is-current {
background-color: #d36fe0 !important;
}
.pagination-numbers {
padding: 15px 25px !important;
}
.mysuper {
position: absolute !important;
bottom: 0 !important;
right: 0 !important;
padding: 10px; /* Adjust padding as needed */
margin: 0;
border-top-left-radius: 5px; /* Add border radius for a nicer look */
}
/* .our-work-template-image::after {
content: "" !important;
position: absolute !important;
top: 0 !important;
left: 50 !important;
width: 100% !important;
height: 100% !important;
background: linear-gradient(to top, rgba(0, 0, 0, 0.7) , rgba(0, 0, 0, 0) 50%) !important;
} */
.image-frame img {
border: 12px solid #ffffff;
}
/*-----------------------------------
* Contact Form 7 - Styles
*-----------------------------------*/
.wpcf7-not-valid-tip {
font-weight: bold !important;
color: #b800d8;
}
.wpcf7 form .wpcf7-response-output {
color: purple !important;
font-weight: bold !important;
}
form input[type="submit"]:hover {
background-color: #9335a4;
}
/*-----------------------------------
* Header Icon - Styles
*-----------------------------------*/
.hover-bold {
text-decoration: none;
font-weight: normal;
transition: text-shadow 0.2s ease;
}
.hover-bold:hover {
text-shadow: 0.5px 0 0 currentColor, -0.5px 0 0 currentColor; /* Simulates bold without width change */
}
@media only screen and (min-width: 768px) and (max-width: 1100px) {
.menu-bar-items {
position: absolute;
right: 4rem;
}
}
@media (min-width: 769px) and (max-width:1100px) {
.hide-on-tablet {
display:none !important
}
}
@media (min-width: 769px) and (max-width:1100px) {
.main-navigation .inside-navigation {
height: 100px !important;
}
.navigation-branding img, .site-logo.mobile-header-logo img {
height: 92px !important;
}
.main-navigation.has-branding .menu-toggle, .main-navigation.has-sticky-branding.navigation-stick .menu-toggle {
padding-top: 13px !important;
}
}
/*-----------------------------------
* FooGallery - Styles
*-----------------------------------*/
.foogallery.fg-border-thin .fg-item-inner {
border-width: 0px !important;
}
div.fg-item.fg-type-image.fg-loaded {
box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px !important;
}
.fg-panel-area-inner {
background-color: #FBF1FF;
}
.fg-panel-button {
background-color: #350a3c !important;
/* border-color: #ffffff !important; */
}
/* .fg-panel.fg-light{
background-color: #653e744f !important;
} */
.fg-panel-thumb-spacer {
background-color: #653e744f !important;
}
.fg-panel.fg-button-purple .fg-panel-thumb.fg-selected {
background-color: #ba69cb !important;
border-color: #ba69cb !important;
}
.fg-panel.fg-highlight-purple .fg-panel-area .fg-panel-thumb:hover {
background-color: #ba69cb !important;
border-color: #ba69cb !important;
}
.foogallery.fg-light-overlays.fg-hover-zoom2 .fg-caption-inner:before {
background-image: url('img/magnifying-glass-svgrepo-com.svg');
}
.fg-item-inner:hover .fg-image-overlay {
opacity: 0.1 !important;
}
/* .foogallery.fg-caption-hover.fg-hover-fade .fg-loaded .fg-item-inner:hover .fg-caption {
visibility: visible;
opacity: 0.5;
} */
.foogallery .fg-item-inner:hover .fg-caption {
opacity: 0.5 !important;
}
.fg-panel-button-info {
/* display: none; */
}
.fg-panel.fg-button-purple .fg-panel-thumbs-button {
background-color: #901CA8 !important;
border-color: #901CA8 !important;
}
.fg-panel:is(.fg-medium,.fg-panel-no-mobile) .fg-panel-buttons .fg-panel-button {
border-radius: 10px;
width: 37px;
height: 37px;
}
.fg-panel.fg-button-purple .fg-panel-thumbs-button {
background-color: #350a3c !important;
border-color: #350a3c !important;
}
.fg-default.fg-gutter-25 {
padding-left: 0px !important;
margin-bottom: 0px !important;
}
/*-----------------------------------
* Image - Styles
*-----------------------------------*/
.img-move-down {
object-position: center top; /* Moves the image downward */
}
/*-----------------------------------
* Text Shadow - Styles
*-----------------------------------*/
.text-shadow-light {
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
}
.text-shadow-medium {
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}
.text-shadow-dark {
text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
}
.text-shadow-purple {
text-shadow: 2px 2px 4px rgba(144, 28, 168, 0.5);
}
.text-shadow-glow {
text-shadow: 0 0 10px rgba(255, 255, 255, 0.8),
0 0 20px rgba(144, 28, 168, 0.4);
}
/*-----------------------------------
* FLATPICKR - Styles
*-----------------------------------*/
.flatpickr-day.selected,
.flatpickr-day.selected:hover {
background: #7a0a97;
border-color: #550856;
}
.flatpickr-day:hover {
background: #9c27b04a;
}
.flatpickr-day.today:hover {
background: #7a0a97;
}
/*
This rule only applies to:
...
but NOT to:
...
The "span" is included to increase specificity —
without it, this style might be overridden by Flatpickr's defaults.
Leave the "span" in to make sure it takes effect.
*/
span.flatpickr-day.today:not(.selected) {
border-color: #e9e9e9;
border-right-color: transparent;
border-top-color: transparent;
border-bottom-color: #7a0a97;
}
span.flatpickr-day.today:not(.selected):hover {
border-color: #550856;
}
.faq-container {
max-width: 800px;
margin: 0 auto;
}
.faq-item {
margin-bottom: 10px;
border: 1px solid #670F75;
border-radius: 6px;
overflow: hidden;
/* Added box-shadow */
box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.12); /* Horizontal offset, vertical offset, blur radius, color (semi-transparent black) */
}
.previous-event-inner {
box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.12); /* Horizontal offset, vertical offset, blur radius, color (semi-transparent black) */
}
.previous_event_select_btn {
box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.32) /* Horizontal offset, vertical offset, blur radius, color (semi-transparent black) */
}
/*-----------------------------------
* FAQ Animation - Styles
*-----------------------------------*/
.faq-category-section:nth-child(1) {
padding-top: 25px;
}
.faq-category-section {
padding-bottom: 25px;
}
.faq-item {
margin-bottom: 10px;
border: 1px solid #670F75;
border-radius: 6px;
overflow: hidden;
}
.faq-question {
display: flex;
justify-content: space-between;
align-items: center;
padding: 15px 20px;
background-color: #F2D0FF;
cursor: pointer;
transition: background-color 0.3s ease;
color: #670F75;
}
.faq-question h3 {
margin: 0;
font-size: 18px;
color: #670F75;
}
.faq-question.active {
background-color: #E6BFFF;
font-weight: bold;
}
.faq-arrow {
width: 20px;
height: 20px;
transition: transform 0.3s ease;
color: #670F75;
flex-shrink: 0;
}
.faq-arrow.rotate {
transform: rotate(180deg);
}
.faq-answer {
background-color: #FBF1FF;
overflow: hidden;
transition: max-height 0.7s ease-out;
}
.faq-answer-content {
padding: 15px 20px 27px;
}
/* Mobile-specific FAQ padding */
@media (max-width: 820px) {
.faq-container {
padding: 0 15px;
max-width: 100%;
}
.faq-question {
padding: 12px 15px;
}
.faq-answer-content {
padding: 15px;
}
.faq-item {
margin-bottom: 15px;
/* Add some breathing room at the bottom */
margin-left: 5px;
margin-right: 5px;
}
.faq-question h3 {
font-size: 16px; /* Slightly smaller font size for mobile */
padding-right: 10px; /* Ensure text doesn't crowd the arrow */
}
}