/*!
Theme Name: Jardin d'Agatine
Template: Divi
Description: Un theme créé par Ju R.
Version: 1.0
Author: Ju R.
*/

/* ALL
========================================== */
.et_mobile_menu {border-radius: 0 0 20px 20px; margin: 0 2%; width: 96%; border-top: 3px solid #1FA2BD;left: auto; right: -25px; width: 100vw;top:70px!important;padding:50px 50px !important;}
@media (max-width: 768px) {
  .et_mobile_menu {right: -15px;; width: 100vw;padding:30px 30px !important;}
}
@media (max-width: 460px) {
.et_mobile_menu {right: -10px;; width: 100vw;padding:30px 30px !important;}
}

/* global */
#page-container {overflow:hidden;}

.et_mobile_menu li {text-align: center;padding:20px 0;}
.et_mobile_menu li a {border-bottom:0!important;line-height: normal!important;font-weight: 400!important;}

span.menu-small {font-size: 14px;font-weight: 300;font-style: italic;}

.et_pb_menu_0_tb_header.et_pb_menu ul li.push a {background-color: #DC9775;color: #fff!important;border-radius: 60px;}

.mobile_nav.opened .mobile_menu_bar:before {content: '\4d';color:#DC9775!important;}
/*rotate the Divi Menu icon on click*/
.mobile_menu_bar:before {transition: all .4s ease;transform: rotate(0deg);display: block;}
/*rotate the Divi Menu icon on click*/
.mobile_nav.opened .mobile_menu_bar::before {transition: all .4s ease;transform: rotate(90deg);	display: block;}

/* Sliders */
.et-pb-arrow-prev:before {content: url(/wp-content/themes/Agatine/assets/arrow-w-left.svg)!important;height:40px;width:40px;}
.et-pb-arrow-next:before {content: url(/wp-content/themes/Agatine/assets/arrow-w-right.svg)!important;height:40px;width:40px;}

@media (max-width: 460px) {
  .et_pb_slider:hover .et-pb-arrow-prev {left: 10px;}
  .et_pb_slider:hover .et-pb-arrow-next{right: 10px;}
}


/* SLIDER BKG HP
========================================== */
.title-hp {position: relative; z-index: 35;text-align: center;}
.title-hp h1 {font-size: 20px; font-family: 'Merriweather Sans',Helvetica,Arial,Lucida,sans-serif;color: #fff;text-transform: uppercase;letter-spacing: 4px;}
.title-hp p {font-size: 65px; line-height: normal; font-family: 'Quicksand',Helvetica,Arial,Lucida,sans-serif;color: #fff;font-weight: 600;padding: 0 15%;}

@media (max-width: 820px) {
  .title-hp h1 {font-size: 20px; letter-spacing: 6px;}
  .title-hp p {font-size: 45px;}
}
@media (max-width: 460px) {
  .title-hp h1 {font-size: 14px; letter-spacing: 4px;}
  .title-hp p {font-size: 32px;}
}

.cb-slideshow, .cb-slideshow:after {position: relative; width: 100%; height: calc(100vh - 250px); top: 0px;left: 0px;z-index: 0;overflow:hidden;background:#fff;display: flex;flex-direction: column; justify-content: center;align-items: center;}
.cb-slideshow ul {list-style-type: none;}
.cb-slideshow:after { content: '';
  background: -moz-radial-gradient(circle, rgba(63, 94, 251, 0) 0%, rgba(0, 0, 0, 0.2) 100%); /* FF3.6-15 */
  background: -webkit-radial-gradient(circle, rgba(63, 94, 251, 0) 0%, rgba(0, 0, 0, 0.2) 100%); /* Chrome10-25,Safari5.1-6 */
  background: radial-gradient(circle,rgba(63, 94, 251, 0) 0%, rgba(0, 0, 0, 0.2) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a8000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
  width:100%;
  display:block;
  position:absolute;
  z-index:33;
  left:0;
  top:0;
  height:calc(100vh - 85px);}

.cb-slideshow li span { 
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    color: transparent;
    background-size: cover;
    background-position: 50% 25%;
    background-repeat: none;
    opacity: 0;
    z-index: 0;
     -webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 40s linear infinite 0s;
    -moz-animation: imageAnimation 40s linear infinite 0s;
    -o-animation: imageAnimation 40s linear infinite 0s;
    -ms-animation: imageAnimation 40s linear infinite 0s;
    animation: imageAnimation 40s linear infinite 0s; 
}

.cb-slideshow li:nth-child(1) span {background-image: url(/wp-content/uploads/2025/06/Canopee-vue-terrasse-scaled.jpg) ;}
.cb-slideshow li:nth-child(2) span {background-image: url(/wp-content/uploads/2025/06/Canopee-salon-sam-scaled.jpg); -webkit-animation-delay: 10s; -moz-animation-delay: 10s; -o-animation-delay: 10s; -ms-animation-delay: 10s; animation-delay: 10s; }
.cb-slideshow li:nth-child(3) span {background-image: url(/wp-content/uploads/2025/06/Bougainvillier-vue-terrasse-bas-2-scaled.jpg); -webkit-animation-delay: 20s; -moz-animation-delay: 20s; -o-animation-delay: 20s; -ms-animation-delay: 20s; animation-delay: 20s; }
.cb-slideshow li:nth-child(4) span {background-image: url(/wp-content/uploads/2025/06/Bougainvillier-terrasse-salle-a-manger.jpg); -webkit-animation-delay: 30s; -moz-animation-delay: 30s; -o-animation-delay: 30s; -ms-animation-delay: 30s; animation-delay: 30s; }

/* Animation for the slideshow images */
@-webkit-keyframes imageAnimation { 
   0% { opacity: 0;
    -ms-animation-timing-function: ease-in; }
    10% { opacity: 1;
         -ms-animation-timing-function: ease-out;
         -webkit-transform: scale(1.05) translate(1.5%, 1);
      }
    20% { opacity: 1; 
          -webkit-transform: scale(1.15) translate(3%, 2%);
        }
    30% { opacity: 0;
          -webkit-transform: scale(1.2) translate(4%, 2.5%)
         }
    100% { opacity: 0 }
}
@-moz-keyframes imageAnimation { 
    0% { opacity: 0;
    -ms-animation-timing-function: ease-in; }
    10% { opacity: 1;
         -ms-animation-timing-function: ease-out;
         -webkit-transform: scale(1.05) translate(1.5%, 1);
      }
    20% { opacity: 1; 
          -webkit-transform: scale(1.15) translate(3%, 2%);
        }
    30% { opacity: 0;
          -webkit-transform: scale(1.2) translate(4%, 2.5%)
         }
    100% { opacity: 0 }
}
@-o-keyframes imageAnimation { 
    0% { opacity: 0;
    -ms-animation-timing-function: ease-in; }
    10% { opacity: 1;
         -ms-animation-timing-function: ease-out;
         -webkit-transform: scale(1.05) translate(1.5%, 1);
      }
    20% { opacity: 1; 
          -webkit-transform: scale(1.15) translate(3%, 2%);
        }
    30% { opacity: 0;
          -webkit-transform: scale(1.2) translate(4%, 2.5%)
         }
    100% { opacity: 0 }
}
@-ms-keyframes imageAnimation { 
   0% { opacity: 0;
    -ms-animation-timing-function: ease-in; }
    10% { opacity: 1;
         -ms-animation-timing-function: ease-out;
         -webkit-transform: scale(1.05) translate(1.5%, 1);
      }
    20% { opacity: 1; 
          -webkit-transform: scale(1.15) translate(3%, 2%);
        }
    30% { opacity: 0;
          -webkit-transform: scale(1.2) translate(4%, 2.5%)
         }
    100% { opacity: 0 }
}

/* Specs
========================================== */
.spec {display: flex;flex-direction: row;justify-content: space-around;;}
.spec-content {display: flex;flex-direction: row;align-items: center;}
.spec-content img {margin-right:5px;}
.spec-content div {font-weight: 600;}

/* Slider
========================================== */
.swiper-wrapper.event {padding:0 2%;}
.swiper-container.event  {width: 100vw; max-width: 100vw;}
.swiper-container.event .swiper-btn {position: absolute; width: 140px;top: auto; bottom: 65px;right:auto;left: 20vw;}
.swiper-container.event .swiper-btn .swiper-button-prev:after {content: url(/wp-content/themes/Agatine/assets/arrow-b-left.svg)!important;height:40px;width:40px;}
.swiper-container.event .swiper-btn .swiper-button-next:after {content: url(/wp-content/themes/Agatine/assets/arrow-b-right.svg)!important;height:40px;width:40px;}
.swiper-container.event  .swiper-scrollbar {position: absolute; width: 40vw;top: auto; bottom: 60px;right:auto;left: 40vw;}
.swiper-container.event .swiper-scrollbar-drag {background:#2a2a2a}
.swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal {height:2px;}
@media (max-width: 460px) {
.swiper-slide {margin:0;}
.swiper-container.event .swiper-btn {position: absolute; width: 120px;top: auto; bottom: 65px;right:auto;left: 5vw;}
.swiper-container.event  .swiper-scrollbar {position: absolute; width: 40vw;top: auto; bottom: 60px;right:auto;left: 50vw;}



}