/*
 Theme Name:  Charly
 Theme URI:  https://charly.madebsyuperfly.com
 Description:  A Superfly Child Theme Made With ❤ for Divi
 Author:  BeSuperfly
 Author URI:  https://www.besuperfly.com
 Template:  Divi
 Version:  1.0
*/



/* GENERAL */
#page-container {
  overflow-x: hidden;
}
@media screen and (max-width : 980px) {
  .switch {
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -webkit-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
  }
}



/* TYPOGRAPHY */
span.OoohYeah {
  font-family: 'Oooh Baby', handwriting;
  font-size: 56px;
  text-transform: none;
}
@media screen and (max-width : 980px) {
  span.OoohYeah {
    font-size: 50px;
  }
}
@media screen and (max-width : 767px) {
  span.OoohYeah {
    font-size: 44px;
  }
}



  /* ANIMATION */
@keyframes rotateCircleText {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}
.charlyBadge {
  animation: rotateCircleText 20s infinite linear;
}



/* HEADER */
.et_fullwidth_nav #main-header .container {
  padding-left: 34px;
}
.et_header_style_left #et-top-navigation {
  padding-top: 37px !important;
  padding-left: 37px !important;
}
#top-menu li {
  padding-right: 35px;
}
#top-menu li a {
  font-weight: 600 !important;
}
#top-menu li a:hover {
  color: #f2af7a;
  opacity: 1 !important;
}



/*DROPDOWN*/
#top-menu li ul {
  box-shadow: 0 30px 60px rgba(29, 28, 26, 0.1);
  top: 40px;
}
#top-menu li ul li {
  padding: 5px 20px;
}
#top-menu li ul li a {
  font-size: 14px;
  letter-spacing: 2px;
  line-height: 1.2em;
  transition: all .3s ease-in-out;
}
#top-menu li ul li a:hover {
  color: #f2af7a !important;
}
.et_mobile_menu li a:hover, #top-menu li ul li a:hover {
  background-color: transparent;
}
#top-menu .menu-item-has-children>a:first-child {
  padding-right: 0;
}
#top-menu .menu-item-has-children>a:first-child:after {
  content: "";
}



/*CTA MENU ITEM*/
#main-header #top-menu-nav {
  position: relative;
  top: -5px;
}
#top-menu li.highlightBtn a {
  padding: 18px 32px 18px 35px !important;
  background: transparent;
  box-shadow: 0px 10px 20px 0px rgba(242, 175, 122, 0.33);
  z-index: 9;
  transition: all .3s ease-in-out;
}
#top-menu li.highlightBtn a:hover {
  color: #1d1c1a;
  background: transparent;
  box-shadow: 0px 10px 20px 0px rgba(240, 167, 240, 0.25);
  opacity: 1;
  cursor: pointer;
}
#top-menu li.highlightBtn:before {
  content:"";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(90deg, #F6D987 0%, #F2AF7A 100%);
  transition: all .3s ease-in-out;
  z-index: 7;
}
#top-menu li.highlightBtn:after {
  content:"";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(90deg, #F2AF7A 0%, #F0A7F0 100%);
  opacity: 0;
  transition: all .3s ease-in-out;
  z-index: 8;
}
#top-menu li.highlightBtn:hover:after {
  opacity: 1;
}



/* FIXED NAVIGATION */
.et_fullwidth_nav #main-header.et-fixed-header .container {
  padding-left: 15px;
  padding-right: 15px;
}
#main-header.et-fixed-header #top-menu-nav {
  position: relative;
  top: -10px;
}
.et_fullwidth_nav #main-header.et-fixed-header #logo {
  max-height: 50%;
}
.et_header_style_left .et-fixed-header #et-top-navigation nav>ul>li>a {
  padding-bottom: 21px;
}
.et_fullwidth_nav #main-header.et-fixed-header #top-menu li.highlightBtn a {
  padding: 15px 24px 16px 27px !important;
}
.et_fullwidth_nav #main-header.et-fixed-header #top-menu ul {
  top: 30px;
  background-color: #fff;
}



/*MOBILE MENU*/
@media screen and (max-width : 980px) {
  #main-header .container {
    width: 94%;
  }
  .et_fullwidth_nav #main-header .container {
    padding-left: 7px;
  }
  .mobile_menu_bar:before {
    font-size: 48px;
    top: -5px;
  }
  .et_mobile_menu {
    border: none;
    box-shadow: 0 30px 60px rgba(29, 28, 26, 0.1);
    padding: 50px;
    overflow: hidden;
  }
  .et_mobile_menu:before {
    content:"";
    display: block;
    width: 150px;
    height: 149px;
    position: absolute;
    top: -5px;
    right: -5px;
    background-image: url("/wp-content/uploads/2024/04/circleTextGrey.png");
    background-size: cover;
    animation: rotateCircleText 20s infinite linear;
  }
  .et_mobile_menu li {
    position: relative;
  }
  .et_mobile_menu li a {
    border: none;
    text-align: center;
    font-size: 20px;
    text-transform: uppercase;
    letter-spacing: 3px;
    transition: all .3s ease-in-out;
  }
  .et_mobile_menu li a:hover {
    color: #f2af7a;
    opacity: 1 !important;
  }
  .et_mobile_menu .menu-item-has-children {
    padding-bottom: 5px;
  }
  .et_mobile_menu .menu-item-has-children>a {
    font-weight: 600;
    background: transparent;
    padding-bottom: 5px;
  }
  #main-header .et_mobile_menu li ul, .et_mobile_menu li li {
    padding-left: 0;
  }
  .et_mobile_menu li ul li a {
    font-size: 14px;
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .et_mobile_menu li.highlightBtn a {
    margin-top: 20px;
    padding: 18px 33px 19px 35px !important;
    background: transparent;
    box-shadow: 0px 11px 20px 0px rgba(242, 175, 122, 0.33);
    position: relative;
    z-index: 9;
  }
  .et_mobile_menu li.highlightBtn a:hover {
    color: #1d1c1a;
    background: transparent;
    box-shadow: 0px 11px 20px 0px rgba(240, 167, 240, 0.25);
    opacity: 1;
    cursor: pointer;
  }
  .et_mobile_menu li.highlightBtn:before {
    content:"";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(90deg, #F6D987 0%, #F2AF7A 100%);
    transition: all .3s ease-in-out;
    z-index: 7;
  }
  .et_mobile_menu li.highlightBtn:after {
    content:"";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(90deg, #F2AF7A 0%, #F0A7F0 100%);
    opacity: 0;
    transition: all .3s ease-in-out;
    z-index: 8;
  }
  .et_mobile_menu li.highlightBtn:hover:after {
    opacity: 1;
  }
}
@media screen and (max-width : 600px) {
  .et_fullwidth_nav #main-header .container {
    width: 85%;
    max-width: 85%;
  }
  #logo {
    max-height: 40%;
  }
  .et_header_style_left #et-top-navigation {
    padding-right: 3px;
  }
  .et_mobile_menu:before {
    width: 100px;
    height: 99px;
    top: -5px;
    right: -5px;
  }
}



/* HOME HERO */
@media screen and (max-width : 1100px) {
  #homeHero #rowHero {
    margin-bottom: 100px; 
  }
}
@media screen and (max-width : 980px) {
  #homeHero #rowHero .rowText {
    width: 94%;
    max-width: 94%;
    margin-left: 3%;
    margin-top: -100px;
  }
}
@media screen and (max-width : 479px) {
  #homeHero #rowHero .rowText {
    width: 94% !important;
    max-width: 94%;
    margin-left: 3% !important;
    margin-top: -50px !important;
  }
}



/* HOME LIFE */
@media screen and (max-width : 980px) {
  #homeLife #rowLife .rowText {
    margin-top: -150px;
  }
}
@media screen and (max-width : 767px) {
  #homeLifeAlternate #rowLife .rowText {
    width: 115% !important;
  }
}



/* SPLIT IMAGE SECTION */
@media screen and (max-width : 980px) {
  .splitImageSection .splitRow .et_pb_column {
    width: 47% !important;
  }
}



/* TESTIMONIAL SLIDER */
.charlyTestimonialSlider img {
  width: 100px;
  border-radius: 100%;
  margin-bottom: -10px;
}
.charlyTestimonialSlider h5 {
  color: #F6D7BF;
  font-family: 'Barlow Semi Condensed', Helvetica, Arial, Lucida, sans-serif;
  font-size: 18px;
  font-weight: 600;
  font-style: normal;
  text-transform: uppercase;
  letter-spacing: 3px;
  padding-top: 30px;
}
@media screen and (max-width : 980px) {
  .charlyTestimonialSlider h5 {
    font-size: 16px;
  }
}
@media screen and (max-width : 767px) {
  .charlyTestimonialSlider img {
    width: 80px;
  }
  .charlyTestimonialSlider h5 {
    font-size: 15px;
  }
}
@media screen and (max-width : 479px) {
  .et_mobile_device .charlyTestimonialSlider .et-pb-arrow-prev {
    left: -15px;
  }
  .et_mobile_device .charlyTestimonialSlider .et-pb-arrow-next {
    right: -15px;
  }
}



/* BLOG */
.et_pb_blog_grid .et_pb_post {
  padding: 0;
}
.et_pb_blog_grid .et_pb_post .et_pb_image_container {
  margin: 0;
}
.et_pb_blog_grid .et_pb_post h2.entry-title {
  padding-bottom: 0;
}
.et_pb_post .entry-featured-image-url {
  margin-bottom: 20px;
}



/* SINGLE POST */
body.single #main-header {
  background-color: #fff;
}
body.single #et-top-navigation nav>ul>li>a {
  padding-bottom: 45px;
}
body.single #page-container .et_pb_section .et_pb_comments_0_tb_body.et_pb_comments_module .et_pb_button {
  font-size: 13px;
  padding: 10px 18px 11px 21px !important;
}



/* GET MY SECRETS */
@media screen and (max-width : 980px) {
  .getMySecrets .phone {
    margin-bottom: 0;
  }
}



/* INTERIOR */
body.interior #main-header {
  background-color: #fff;
}
body.interior #et-top-navigation nav>ul>li>a {
  padding-bottom: 45px;
}



/* PORTFOLIO */
#charlyPortfolio.et_pb_filterable_portfolio .et_pb_portfolio_filters li a {
  border-radius: 0 !important;
}
#charlyPortfolio .et_pb_portfolio_item .post-meta {
  margin-top: 0;
}



/* KEN BURNS */
@media only screen and (min-width: 767px) {
  .kenBurnsHeader .et_parallax_bg {
    animation: kenburns 45s forwards;
  }
}
@media only screen and (min-width: 767px) {
  .kenBurnsSection .et_parallax_bg {
    animation: kenburns 45s infinite;
  }
}
@keyframes kenburns {
  0% {
    opacity: 0;
    -ms-transform: scale3d(1.05, 1.05, 1.05) translate3d(-15px, 0px, 0px);
    -webkit-transform: scale3d(1.05, 1.05, 1.05) translate3d(-15px, 0px, 0px);
    transform: scale3d(1.05, 1.05, 1.05) translate3d(-15px, 0px, 0px);
    animation-timing-function: linear;
  }
  1% {
    opacity: 1;
  }
  100% {
    -ms-transform: scale3d(1.3, 1.3, 1.3) translate3d(-25px, -55px, 0px);
    -webkit-transform: scale3d(1.3, 1.3, 1.3) translate3d(-25px, -55px, 0px);
    transform: scale3d(1.3, 1.3, 1.3) translate3d(-25px, -55px, 0px);
  }
}



/* LAST EDITED BY JOHN ON MAY 1, 2024 */

/* ----------- PUT CUSTOM CSS BELOW THIS LINE --- DO NOT EDIT ABOVE THIS LINE --------------------------- */