/*
 Theme Name:   Douce Renaissance - byCrofte
 Template:     Divi
 Text Domain:  Douce_renaissance
 Description:  Divi Child Theme for institut-spa-bio-marckolsheim.fr website
 Author:       Michaël Crofte
 Author URI:   https://www.bycrofte.fr/
 Version:      0.1
*/

:root  {
    /****** Useful colors *****/
    --navy-blue:        #001126;
    --dark-blue:        #2a3b96;
    --medium-blue:      #357bb4;
    --cyan-blue:        #64c0c6;
    --light-gold:       #eddb84;
    --medium-gold:      #ddbe4a;
    --dark-gold:        #ca8600;
     
    /*******************************************/
}

/* Global */
.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}


/* Header - Nav */
.et_header_style_split #et-top-navigation { /*correctif header marge énorme ?? */
    /*padding: 10px 0 0 0 !important;*/
}
#top-menu li.home .dashicons.dashicons-admin-home {
    font-size: 25px;
    position: relative;
    top: -6px;
}
#top-menu li.home a {
    padding-left: 8px;
    padding-right: 8px;
}
#top-menu ul.sub-menu li a {
    border-bottom: 1px solid #ddd;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    padding: 11px 0;
}
#top-menu ul.sub-menu li:last-child a {
    border-bottom: 0;
}
#top-menu li.offers a {
    color: #ca8600;
}


/* Home or Global */
#contact .et_pb_contact_field_options_title {
    color: #ffffff;
}
#contact .et-pb-contact-message p {
    text-align: center;
    color: #ffffff;
    font-size: 15px;
    font-weight: 300;
}


/* TABLE : works */
table.work-table {
    margin-top: 30px !important;
    font-family: 'Inter',Helvetica,Arial,Lucida,sans-serif;
    background: white;
    border: 1px solid white !important;
}
table.work-table td:first-child,
table.work-table th:first-child {
    width: 87%;
}
table.work-table tr.work-heading {
    border-top : 1px solid #ddbe4a;
}
table.work-table tr.work-heading h3 {
    color: #ddbe4a;
    font-size: 30px;
    font-weight: 800;
}
table.work-table tr.work-heading h3 small {
    font-size: 1rem;
}
table.work-table tr.work-desc td {
    border-top: 1px solid white;
    padding-top: 2px;
}
table.work-table tr.work-desc strong {
    font-weight: bold;
    color: #ddbe4a;
}
table.work-table tr.work-title h4 {
    color: #000;
    font-size: 25px;
    font-weight: 600;
    padding-bottom: 0px;
}
table.work-table tr.work-title h4 .gold {
    color: #ca8500;
}
table.work-table tr.work-title h4.title-red {
    color: #ca0000;
}
table.work-table tr.work-title h4.title-orange {
    color: #ca8500;
}
table.work-table tr.work-title h4.title-yellow {
    color: #ddbe4a;
}
table.work-table tr.work-title h4.title-green {
    color: #3b9e2c;
}
table.work-table tr.work-title h4.title-blue {
    color: #1700ca;
}
table.work-table tr.work-title h4.title-violet {
    color: #6200ca;
}
table.work-table td.work-price {
    color: #ddbe4a;
    font-size: 25px;
    font-weight: 600;
}
table.work-table th.work-price {
    color: #ddbe4a;
    font-size: 30px;
    font-weight: 800;
}
table.work-table td.work-price .work-time {
    color: black;
    font-size: 14px;
}
table.work-table td.work-price.small-price {
    font-size: 12px;
}
table.work-table tr.work-note td {
    font-size: 12px;
    font-style: italic;
    opacity: 0.8;
}
table.work-table .work-sub-tr td:first-child {
    padding-left: 40px;
    position: relative;
}
table.work-table .work-sub-tr td:first-child::after {
    content: " ";
    display: block;
    width: 2px;
    height: 100%;
    background: #000;
    left: 20px;
    top:0; bottom:0;
}

/* Table : epil */
table.epil-table {
    margin-top: 30px !important;
    font-family: 'Inter',Helvetica,Arial,Lucida,sans-serif;
    background: white;
    border: 1px solid white !important;
}
table.epil-table td,
table.epil-table th {
    width: 17%;
}
table.epil-table td:first-child,
table.epil-table th:first-child {
    width: 65%;
}
table.epil-table h4 {
    font-size: 18px;
    font-weight: 700;
    padding-bottom: 0px;
}
table.epil-table h3 {
    font-size: 18px;
    font-weight: 500;
    padding-bottom: 0px;
}
table.epil-table .col-blue h4{
    color : #14448d;}
table.epil-table .col-yellow h4{
    color : #ca8500;}
table.epil-table .col-blue {
    color : #14448d;
    border-left: 2px solid black;
}
table.epil-table .col-yellow {
    color : #ca8500;
    border-left: 2px solid black;
}
table.epil-table tr:nth-child(even) {
    background-color: #e8e9f4;
}
table.epil-table .epil-price {
    font-size: 16px;
    font-weight: 400;
}


/* Table : cils */
table.cils-table {
    margin-top: 30px !important;
    font-family: 'Inter',Helvetica,Arial,Lucida,sans-serif;
    background: white;
    border: 1px solid white !important;
}
table.cils-table td,
table.cils-table th {
    width: 18%;
}
table.cils-table td:first-child,
table.cils-table th:first-child {
    width: 28%;
}
table.cils-table h4 {
    font-size: 18px;
    font-weight: 700;
    padding-bottom: 0px;
}
table.cils-table h4 small {
    font-size: 15px;
    font-weight: 500;
}
table.cils-table h3 {
    font-size: 18px;
    font-weight: 500;
    padding-bottom: 0px;
}
table.cils-table .col-blue h4{
    color : #14448d;}
table.cils-table .col-yellow h4{
    color : #ca8500;}
table.cils-table th,
table.cils-table td {
    border-left: 2px solid black;
}
table.cils-table .bg-gold {
    background-color: #ffe9bf;
}
table.cils-table tr:nth-child(even) {
    background-color: #e8e9f4;
}
table.cils-table .cils-price {
    font-size: 16px;
    font-weight: 400;
    color: #000;
}
table.cils-table .cils-price strong {
    color : #ca8500;
    font-weight: 700;
}
#smartphone-rotate .et-pb-icon {
  display: inline-block; /* indispensable pour le transform */
  animation: rotate-phone 2.5s ease-in-out infinite;
  transform-origin: center center;
}
@keyframes rotate-phone {
  0% {    transform: rotate(0deg);  }
  30% {    transform: rotate(0deg);  }
  60% {    transform: rotate(90deg);  }
  80% {    transform: rotate(90deg);  }
  100% {    transform: rotate(0deg);  }
}


/* Work elems */
.bullet-col {
    display: inline-block;
    vertical-align: top;
}.bullet-nb {
    display: block;
    position: absolute;
    top: -56px;
    width: 50px;
    height: 50px;
    color: #fff;
    border-radius: 50%;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    line-height: 50px;
}
.bullet-nb.bullet-gold {
    background:#ca8600;
}
.bullet-nb.bullet-red {
    background: #c55944;
    left: 50%;
    transform: translateX(-50%);
}
.bullet-nb.bullet-blue {
    background:#61b6c6;
    right: 0;
}


/* GALERIE */
#galerie-mini-menu .et_pb_button_module_wrapper {
    display: inline-block;
    vertical-align: top;
    width: auto;
    margin: 10px;
}
.has_et_pb_sticky #galerie-mini-menu.et_pb_sticky .et_pb_button_module_wrapper a {
    font-size: 10px !important;
    padding: 8px 11px !important;
}


/* FOOTER */
footer#main-footer #footer-widgets .widget_block {
    margin-bottom: 20px;
    display: block;
    width: 100%;
}
footer h2.wp-block-heading {
    font-size: 20px;
    text-align: center;
}
footer .widget_nav_menu {
    display: block;
    width: 100%
}

footer .et_mobile_nav_menu {display: none !important;} /*retrait du menu mobile*/

footer .et_pb_menu__wrap,
footer .et_pb_menu__menu,
footer .et-menu-nav {
    display: block !important;
}
footer ul#menu-navigation-principale {
    text-align: center !important;
    width: 100% !important;
    display: block !important;
    list-style-type: none !important;
    display: block !important;
}
footer ul#menu-navigation-principale li::before {
    content: none !important;
}
footer ul#menu-navigation-principale li {
    padding-left: 0px !important;
    margin-left: 0px !important;
    margin-bottom: 0px !important;
    display: block !important;
    margin-top: 0 !important;
}
footer ul#menu-navigation-principale a {
    color: white !important;
    transition: 0.35s ease-in-out !important;
}
footer ul#menu-navigation-principale > li a {
    display: block !important;
    padding: 10px 0 10px 0 !important;
    border-bottom: 1px solid rgba(235, 191, 120, 0.2) !important;
}
footer ul#menu-navigation-principale > li.current_page_item a {
    color: #ebbf78 !important;
}
footer ul#menu-navigation-principale li.current_page_item > a {
    color: #ebbf78 !important;
}
footer ul#menu-navigation-principale > li.current_page_item > a {
    background: linear-gradient(90deg, rgba(235, 191, 120, 0) 0% , rgba(235, 191, 120, 0.08) 25% , rgba(235, 191, 120, 0.11) 50% , rgba(235, 191, 120, 0.11) 75% , rgba(235, 191, 120, 0) 100%) !important;
}
footer ul#menu-navigation-principale > li > a {
    background: linear-gradient(90deg, rgba(235, 191, 120, 0) 0% , rgba(235, 191, 120, 0) 25% , rgba(235, 191, 120, 0) 50% , rgba(235, 191, 120, 0) 75% , rgba(235, 191, 120, 0) 100%) !important;
}
footer ul#menu-navigation-principale > li > a:hover,
footer ul#menu-navigation-principale > li > a:focus,
footer ul#menu-navigation-principale > li > a:active {
    color: #ebbf78 !important;
}
/*sub-menu*/
footer ul#menu-navigation-principale > li.menu-item-has-children > a:first-child::after {
    display: none !important;
}
footer .et-db #et-boc .et-l .et_pb_menu_0_tb_footer.et_pb_menu .nav li ul{
    background-color: transparent !important;
}

footer ul#menu-navigation-principale ul.sub-menu {
    position: static !important;
    background-color: transparent !important;
    border: 0px !important;
    box-shadow: inset 0 5px 4px 3px rgba(0,0,0,0.01) !important;
    opacity: 1 !important;
    visibility: visible !important;
    width: 100% !important;
    padding: 10px 0 8px 0 !important;
}
footer ul#menu-navigation-principale > li > ul.sub-menu {
    background-color: rgba(0,0,0,0) !important;
    background-image: linear-gradient(180deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 20%, rgba(0,0,0,0) 100%) !important;
}
footer ul#menu-navigation-principale > li > ul.sub-menu > li {
    padding: 0px !important;
    margin-left: 0px !important;
    line-height: 0.5em !important;
    text-align: center !important;
}
footer ul#menu-navigation-principale > li > ul.sub-menu > li a {
    color: rgba(255,255,255,.75) !important;
    border-bottom: none !important;
    width: 100% !important;
}
footer ul#menu-navigation-principale > li > ul.sub-menu > li a:hover,
footer ul#menu-navigation-principale > li > ul.sub-menu > li a:focus,
footer ul#menu-navigation-principale > li > ul.sub-menu > li a:active {
    color: rgba(235, 191, 120, .75) !important;
    background: none !important;
}




/***************************************************************/
/***************************************************************/
/*********************        PLUGINS       ********************/
/***************************************************************/
/***************************************************************/




/***************************************************************/         /******/
/***************************************************************/         /*    */
/*********************      RESPONSIVE      ********************/         /*    */
/***************************************************************/         /*    */
/***************************************************************/         /***°**/

@media screen and (max-width: 1820px) {

   
}
@media screen and (max-width: 1740px) {


}
@media screen and (max-width: 1680px) {

 
}
@media screen and (max-width: 1610px) {


}
@media screen and (max-width: 1520px) {


}
@media screen and (max-width: 1440px) { /*----------------------------------------------------off breakpoint*/


}
@media screen and (max-width: 1350px) {


}
@media screen and (max-width: 1200px) { /*----------------------------------------------------off breakpoint*/


}
@media screen and (max-width: 1105px) {


}
@media screen and (max-width: 1024px) { /*----------------------------------------------------off breakpoint*/


}
@media screen and (max-width: 980px) { /*----------------------------------------------------off breakpoint*/


}
@media screen and (max-width: 768px) { /*----------------------------------------------------off breakpoint*/


}
@media screen and (max-width: 480px) { /*----------------------------------------------------off breakpoint*/


}
@media screen and (max-width: 320px) { /*----------------------------------------------------off breakpoint*/
 

}