/*
 Theme Name:   NEWODIA  
 Theme URI:    https://mystudio.com
 Description:  Child Theme for Divi
 Author:       Woosby
 Author URI:   https://woosby.com/
 Template:     Divi
 Version:      1.0.0
*/

/*****Add any custom CSS below this line*****/

/*adjust the gallery grid items after clicking the load more button*/

@media all and (max-width:980px) and (min-width: 767px) {
	.pa-gallery-load-more .et_pb_gallery_item:nth-child(3n) {
		margin-right: 0 !important;
	}
}

@media all and (min-width:981px) {
	.pa-gallery-load-more .et_pb_gallery_item:nth-child(4n) {
		margin-right: 0 !important;
	}
}

/* Retirer text shadow dans le module slider */
.et_pb_slide_description {
text-shadow:none !important;
}

/* inverser l'ordre des colonnes sur mobile */
@media screen and ( max-width: 980px ) {
    .reverse {
        display: flex;
        flex-direction: column-reverse;
    }
} 


/* Retirer la bordure du menu */
#main-header {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}


/* Remove all animations and transitions for people that prefer not to see them */
 @media (prefers-reduced-motion: reduce) {
     * {
         animation-duration: 0.01ms !important;
         animation-iteration-count: 1 !important;
         transition-duration: 0.01ms !important;
         scroll-behavior: auto !important;
    }
}


/* Icone du bouton back to top */
.et_pb_scroll_top:before {
    content: "\32";/*select icon*/
} 

/* Apparence du bouton par défaut */
.et_pb_scroll_top.et-pb-icon {
    right: 30px; /* space from right */
    bottom: 30px; /* space from bottom */
    padding: 8px; /*padding size*/
	border-radius: 30px; /* make the circle */
    background: #000000 /* button color */; 
    font-size: 30px; /* icon size */
    transition: all .1s ease-in-out; /* add transition */
	color: #fff;
}
/* Apparence du bouton hover */
.et_pb_scroll_top.et-pb-icon:hover {
    bottom: 32px /* space from bottom */;
    background: #000000 /*button hover color*/; 
    transition: all .1s ease-in-out; /*add transition*/
}
/* Animation du bouton */
.et_pb_scroll_top.et-visible {
    -webkit-animation: fadeInBottom 1s 1 cubic-bezier(.50,0,.160,1);
    -moz-animation: fadeInBottom 2s 1 cubic-bezier(.50,0,.160,1);
    -o-animation: fadeInBottom 1s 1 cubic-bezier(.50,0,.160,1);
    animation: fadeInBottom 1s 1 cubic-bezier(.50,0,.160,1);
}
.et_pb_scroll_top.et-hidden {
    opacity: 0;
    -webkit-animation: fadeOutBottom 1s 1 cubic-bezier(.77,0,.175,1);
    -moz-animation: fadeOutBottom 1s 1 cubic-bezier(.77,0,.175,1);
    -o-animation: fadeOutBottom 1s 1 cubic-bezier(.77,0,.175,1);
    animation: fadeOutBottom 1s 1 cubic-bezier(.77,0,.175,1);
}



/**** Nesting Menu ****/
    /* when mobile menu is open, change hamburger icon to x icon */
    #et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::before {
        content: '\4d';
    }

    /* adjust mobile menu anchors side paddings */
    #main-header #mobile_menu.et_mobile_menu li a {
        padding-left: 20px;
        padding-right: 20px;
    }

   /* make the current page's mobile menu link be different */
    #main-header #mobile_menu.et_mobile_menu li.current-menu-item > a {
        font-weight: bolder;
    }

    /****** Code Style: Menu Slide-In ******/
    /* Font Awesome */
    .fa {
        margin-right: 15px ;
      }

    @media only screen and (max-width: 980px){
    #mobile_menu {
        display: block !important;
        min-height: 100vh;
        height: 100%;
        top: 0;
        right: 0;
        position: fixed;
        z-index: 9998;
        overflow: scroll;
        border-top: none;
        padding-top: 60px !important;
    }

    .et_mobile_menu li a {
        color: #fff !important;
        width: 100%;
        float: left;
        text-align: left;
        border-bottom: 0.1px solid #fff;
        margin: 5px;
        transition: .2s;
        text-transform: uppercase;
    }
    .mobile_nav ul#mobile_menu .current_page_item > a {
        color: #fff !important;
    background-color: #1c1068;
    }

    .mobile_nav.closed #mobile_menu {
        background: #fff !important;
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: -webkit-transform 0.4s 0s;
        -moz-transition: -moz-transform 0.4s 0s;
        transition: transform 0.4s 0s;
    }

    .mobile_nav.opened #mobile_menu {
        background: #1c1068 !important;
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
        -webkit-overflow-scrolling: touch;
        -webkit-transition: -webkit-transform 0.4s 0s;
        -moz-transition: -moz-transform 0.4s 0s;
        transition: transform 0.4s 0s;
    }

    #main-header .container.clearfix.et_menu_container {
        width: 100%;
    }

    .mobile_menu_bar:before {
        color: #1c1068 !important;
    }
    .mobile_nav.opened .mobile_menu_bar:before {
        content: '\4d';
        color: #fff !important;
        z-index: 9999;
    }
    }

    @media only screen and  (max-width: 980px) {
      .et_header_style_split .mobile_menu_bar, .et_header_style_left .mobile_menu_bar {    
        z-index: 9999;
      }
		      #et-top-navigation {    
        padding-right: 5px;
      }


    }

    @media only screen and (min-width: 481px)  {
      #mobile_menu {    
        width: 340px;    
        margin-left: calc(100% - 340px);
      }
    }
    @media only screen and (max-width: 480px)  {
      #mobile_menu {    
        width: 290px;    
        margin-left: calc(100% - 290px);
      }
    } 



/* maintain Divi mouse hover behaviour */
.et_mobile_menu .menu-item-has-children>a:hover  {
    background-color:rgba(0, 0, 0, 0) !important;
}


et_mobile_menu li a:hover, .nav ul li a:hover {
 background-color: rgba(0,0,0,0) !important;
}


#top-menu a::after  {  
 position: absolute;
 content: "";
 top:20px;
 left:0;
 width: 0%;
 height: 2px;
 background-color: #1c1068; 
 color:#1c1068!important;
 transition-duration: 0.5s;
}

#top-menu a:hover::after {

width: 100%;left: 0;
}

#top-menu a:hover {
 color:#1c1068 !important;
 opacity:1 !important;
}


/* Remove horizontal scrolling */
#page-container { overflow:hidden;

}



/* MARQUEE PERSONNALISATION*/
.marquee{
    position: relative;
    display: flex;
    animation: moveLeft 14s linear infinite !important;
}

.track {
    white-space: nowrap;
    min-width: 100%;
    text-align: center;
}

.track a{
animation: text 10s infinite linear;
position:relative;
}

@keyframes text{
0%{
left: 0%;
}

25%{
left:-25%;
}

50%{
left:-50%;
}

75%{
left:-75%;
}

100%{
left:-100%;
}
}


/*rotate image*/
.rotate { animation: rotation 8s infinite linear; } @keyframes rotation { from { transform: rotate(0deg); } to { transform: rotate(359deg); } }



/*Zoom on hover gallery image*/
.et_pb_gallery_item {
    overflow: hidden; 
	border-radius:20px;
	box-shadow: 6px 6px 18px 0px rgba(0, 0, 0, 0.3);
	
}
.et_pb_gallery_item a img:hover {
 transform:scale(1.1);
}
.et_pb_gallery_item a img {
 transition-duration: 1s;
}