/*
Theme Name: Catchy Labs Theme Child
Theme URI: https://catchylabs.com/
Description: Child theme for the Catchy Labs Elementor Theme WordPress theme.
Author: Bobby Danklefsen
Author URI: https://catchylabs.com/
Template: catchylabs-theme
Version: 1.0.0
Text Domain: cl-elementor
*/

/* Put all custom styles here
   ========================================================================== */

body {
   margin: 0;
   font-family:var(--base-font, 'Verdana');
   font-size: var(--base-font-size, 20px);
   font-weight: var(--base-font-w, normal);
   line-height: 1.5;
   color: var(--text);
   background-color: #fff;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}

b,
strong,
.strong {
   font-family:var(--base-font-strong, 'Verdana');
   font-weight:var(--base-font-strong-w, bold);
}

/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/

h1, h2, h3, h4, h5, h6 {
   margin-top: .5rem;
   margin-bottom: 1rem;
   font-family: var(--accent-font, 'Garamond');
   font-weight: var(--accent-font-w, normal);
   line-height: 1.2;
   color: inherit;
}

h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong {
   font-family:var(--accent-font-strong, 'Garamond');
   font-weight:var(--accent-font-strong-w, bold);
}

.accent-font {
   font-family: var(--accent-font, 'Garamond') !important;
   font-weight: var(--accent-font-w, normal) !important;
}

.accent-font-strong {
   font-family:var(--accent-font-strong, 'Garamond') !important;
   font-weight:var(--accent-font-strong-w, bold) !important;
}

/* Structure
   ========================================================================== */

@media (min-width:768px) {
   body:not([class*="elementor-page-"]) #tribe-events-pg-template,
   body:not([class*="elementor-page-"]) main {
      margin-top:220px;
   }
}

.cl-breadcrumbs a {
	text-decoration: none !important;
	font-size:1rem !important; 
   text-transform: capitalize !important;
}

.elementor-widget-video video {
   opacity: 1;
}

.elementor-widget-video video::-webkit-media-controls,
.elementor-widget-video video::--media-controls {
   opacity:0;
}

.elementor-widget-video:hover video::-webkit-media-controls,
.elementor-widget-video:hover video::--media-controls {
   opacity:1;
}

@media (max-width:768px) {
   #submenu.keep-alive {
      display:none !important;
   }
}


/* Skew
   ========================================================================== */

.skew {
   margin-bottom:360px;

	-ms-transform: skewY(-7.5deg);
   -webkit-transform: skewY(-7.5deg);
   transform: skewY(-7.5deg);
	transform-origin: 100% 100%;
   -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
}
.reverse-skew {
   -ms-transform: skewY(7.5deg); 
   -webkit-transform: skewY(7.5deg); 
   transform: skewY(7.5deg);
}

/* Footer
   ========================================================================== */

#footer-button .elementor-button-icon svg {
   width:2.75em;
}

#footer-button .elementor-button span {
   text-align: left;
}

/* B3 Button
   ========================================================================== */

.oma-button a {
   display:inline-flex;
   align-items: stretch;
   overflow: hidden;
   text-decoration: none;
}
.oma-button a .title {
   text-align: left;
   background-color:#FF8C1A;
   padding:8px 45px 8px 25px;
   border-radius:25px 0 0 25px;
   color:white;
   font-size:18px;
   text-transform: uppercase;
   font-family:var(--accent-font-strong, 'Garamond') !important;
   font-weight:var(--accent-font-strong-w, bold) !important;
   transition: var(--default-transition);
   border:solid thin #FF8C1A;
}
.oma-button a:hover .title {
   color:white;
   background-color: black;
   border-color:black;
}
.oma-button a .arrow {
   background-color:#505050;
   color:white;
   font-size:25px;
   padding:0 18px;
   border-radius: 50%;
   margin-left:-25px;
   display: flex;
   align-items: center;
}

/* button */
.oma-button.button {
   border-radius:5px;
   overflow: hidden;
   background-color:#FF8C1A !important;
   display:inline-block;
   position: relative;
}
.oma-button input[type="submit"] {
   text-align: left;
   padding:5px 13px;
   color:black;
   font-size:80%;
   min-width:150px;
   text-transform: uppercase; 
   font-family: 'open_sans_condensedbold' !important;
   transition: var(--default-transition);
}
.oma-button.button:hover input[type="submit"] {
   background-color:black;
   color:#FF8C1A;
}
.oma-button.button:after {
   content:"\f105";
   display: flex;
   align-items: center;
   font-family: 'Font Awesome 6 Free';
   font-weight: 900;
   color:white;
   background-color:black;
   position:absolute;
   right:0;
   top:0;
   bottom:0;
   padding:0 10px;
}
.oma-button .wpcf7-spinner {
   display:none !important;
}

/* Upcoming events
   ========================================================================== */

.b3-upcoming-events .b3-upcoming-events-container .lower-info {
   margin-bottom:75px;
}


@media (min-width:768px) {
   .b3-upcoming-events .b3-upcoming-events-container .lower-info {
      display:flex;
      gap:20px;
   }
}

.b3-upcoming-events .excerpt {
   padding-top:20px;
}

.b3-upcoming-events .excerpt p {
   margin-bottom:30px;
}

.b3-upcoming-events .date .container {
   padding:15px 50px 30px;
   color:white;
   background-color: #4F5612;
   border-radius: 15px;
   text-align: center;
}

.b3-upcoming-events .date .month,
.b3-upcoming-events .date .day {
   font-size:180%;
   line-height: 1em;
   margin: 0;
}

.b3-upcoming-events .date .day {
   font-size:400%;
}

/* Nav Menu
   ========================================================================== */

.nav-menu ul.sub-menu {
   display:none !important;
}

body .cl-submenu li a {
   padding-bottom:2px;
}

body .cl-submenu li a:hover, 
body .cl-submenu li.current-menu-item a {
   color:#FF8C1A;
}

/* Fixed Header
   ========================================================================== */

header.fixed {
   padding:0 !important;
}

/* Bottom Triangle
   ========================================================================== */

.bottom-triangle > .e-con-inner:after {
   content:"";
   width:100%;
   height:300px;
   background-color: white;
   clip-path: polygon(100% 0, 0% 100%, 100% 100%);
   position: absolute;
   bottom:0;
   left:0;
   right: 0;
}

.bottom-triangle .elementor-element {
   z-index: 9999;
}

/* Newsletter Signup
   ========================================================================== */

#newsletter_signup {
   display:none;
   align-items: center;
   justify-content:center;
   z-index: 0;
}

@media (min-width:768px) {
   #newsletter_signup {
      visibility: hidden;
      display:flex;
      position: fixed;
      pointer-events: none;
      -webkit-transition: all 0.3s;
      transition: all 0.3s;  
      top: 0;
      right: 0;
      bottom: 0;
      opacity: 0;
      left: 0;
      background-color:rgba(55,55,55,0.75);
   }

   #newsletter_signup:target {
      opacity: 1;
      pointer-events: auto;
      visibility: visible;
      z-index: 8999; 
   }
}

#newsletter_signup #newsletter_inner {
   background-color: white;
   padding:80px;
   border-radius: 25px;
   display: flex;
   flex-direction: row;
   align-items: flex-start;
   gap:80px;
   max-width:900px;
   position: relative;
}

#newsletter_signup .vanity-icon {
   width:150px;
}

#newsletter_signup #newsletter_inner > div {
   flex:1;
}

#newsletter_signup label {
   display:none;
}

#newsletter_signup input[type="text"], 
#newsletter_signup input[type="email"] {
   background: #D9D9D9;
   border:none;
   font-weight: bold;
}

#newsletter_signup .hide {
   visibility: hidden;
   height:0;
   width:0;
}

#newsletter_signup li {
   margin-bottom:15px;
}

#newsletter_signup #foli1 {
   display:flex;
   gap:15px;
}

#newsletter_signup #foli1 > span {
   width:40%;
}

#newsletter_signup #foli1 > span:last-child {
   width:60%;
}

#newsletter_signup form {
   margin-top:30px;
}

#newsletter_signup .close {
   position: absolute;
   top:20px;
   right:20px;
   cursor: pointer;
   width:65px;
   height:65px;
}

#newsletter_signup .close img {
   width:100%;
}

@media (max-width:768px) {
   #newsletter_signup .vanity-icon {
      display:none;
   }
}

/* Newsletter Signup
   ========================================================================== */

#cmsmod {
   visibility: hidden;
   position: fixed;
   display:flex;
   align-items: center;
   justify-content:center;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   z-index: 0;
   opacity: 0;
   pointer-events: none;
   -webkit-transition: all 0.3s;
   transition: all 0.3s;
   background-color:rgba(55,55,55,0.75);
}

#cmsmod:target {
   opacity: 1;
   pointer-events: auto;
   visibility: visible;
   z-index: 8999; 
}

#cmsmod .modal_inner {
   background-color: white;
   padding:60px 50px 35px;
   border-radius: 25px;
   display: flex;
   flex-direction: row;
   align-items: flex-start;
   gap:80px;
   max-width:900px;
   position: relative;
}

#cmsmod .close {
   position: absolute;
   top:20px;
   right:20px;
   cursor: pointer;
   width:40px;
   height:40px;
}

/* Events
   ========================================================================== */

.cl-dca-events .events-item .link  {
   margin-top:30px;
}

.cl-dca-events {
   display:flex;
   justify-content: center;
   flex-wrap: wrap;
   gap:20px;
}

.cl-dca-events .events-item .content {
   padding:30px;
}

.cl-dca-events .events-item {
   width:32%;
   margin-bottom:60px;
   border-radius: 25px;
   overflow: hidden;
   background-color: #F0F0F0;
}

.cl-dca-events .content p {
   font-size:16px;
   margin-bottom:30px;
}

.cl-dca-events .date {
   background-color: #F8A221;
   color:white;
   padding:40px;
}

.cl-dca-events .date span {
   display:block;
   text-align: center;
   line-height: 1em;
}

.cl-dca-events .date .day {
   font-weight:bold;
   font-size:100px;
   margin-bottom:10px;
}

.cl-dca-events .date .month {
   font-size: 40px;
   text-transform: uppercase;
}

@media (max-width:1025px) {
   .rss-feed-list li {
       padding: 10px 0 10px 30px;
   }

   .cl-dca-events .events-item {
       width:50%;
   }
}

@media (max-width:768px) {
   .cl-dca-events .events-item {
       width:100%;
   }
}