@media all and (max-width: 980px){
body.dipi-mobile-menu-fullscreen .mobile_nav.opened:before {
visibility: visible;
background: #dfd1b6 !important;
opacity: 1;
}
body.dipi-mobile-menu-fullscreen .mobile_nav.closed:before {
visibility: hidden;
background: transparent !important;
opacity: 0;
}
body.dipi-mobile-menu-fullscreen .mobile_nav.opened ul.et_mobile_menu {
opacity: 1;
transition: all 1s;
transition-timing-function: cubic-bezier(.79,.14,.15,.86);
}
body.dipi-mobile-menu-fullscreen.et-db #et-boc .et-l .mobile_nav.closed ul.et_mobile_menu,
body.dipi-mobile-menu-fullscreen .mobile_nav.closed ul.et_mobile_menu {
opacity: 0;
}
body.dipi-mobile-menu-fullscreen .mobile_nav:before {
content: '';
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 99;
display: block;
transition: all 1s !important;
transition-timing-function: cubic-bezier(.79,.14,.15,.86) !important;
opacity: 0;
visibility: hidden;
height: 120vh;
top: -20vh;
}
body.dipi-mobile-menu-fullscreen .et_pb_sticky_placeholder .mobile_nav {
pointer-events: none;
}
body.dipi-mobile-menu-fullscreen .mobile_nav.dipi-menu-background-animation-circle:before{
position: absolute;
top: calc(20px - 50vh);
right: calc(20px - 50vh);
bottom:auto;left: auto;
height: 100vh;
width: 100vh;
transform-origin: 50% 50%;
border-radius:50%;
background: #dfd1b6 !important;
transition-property: transform;
}
body.dipi-mobile-menu-fullscreen .mobile_nav.dipi-menu-background-animation-circle.closed:before{
opacity:0;
visibility:visible;
transform: scale(0);
will-change: transform;
}
body.dipi-mobile-menu-fullscreen .mobile_nav.dipi-menu-background-animation-circle.closed.animate:before{
opacity:1;
}
body.dipi-mobile-menu-fullscreen .mobile_nav.dipi-menu-background-animation-circle.opened:before{
transform: scale(4.8);
position:fixed;
}
.dipi-menu-animation-slide-left.closed #mobile_menu,
.et-l--header .dipi-menu-animation-slide-left.closed ul.et_mobile_menu {
transform: translateX(-120%);
}
.dipi-menu-animation-slide-left.opened #mobile_menu,
.et-l--header .dipi-menu-animation-slide-left.opened ul.et_mobile_menu {
transform: translateX(0);
}
.dipi-menu-background-animation-slide-left.closed:before {
transform: translateX(-100%);
}
.dipi-menu-background-animation-slide-left.opened:before {
transform: translateX(0);
}
.dipi-menu-animation-slide-right.closed #mobile_menu ,
.et-l--header .dipi-menu-animation-slide-right.closed ul.et_mobile_menu {
transform: translateX(120%);
}
.dipi-menu-animation-slide-right.opened #mobile_menu,
.et-l--header .dipi-menu-animation-slide-right.opened ul.et_mobile_menu {
transform: translateX(0);
}
.dipi-menu-background-animation-slide-right.closed:before {
transform: translateX(100%);
}
.dipi-menu-background-animation-slide-right.opened:before {
transform: translateX(0);
}
.dipi-menu-animation-slide-bottom.closed #mobile_menu,
.et-l--header .dipi-menu-animation-slide-bottom.closed ul.et_mobile_menu {
transform: translateY(120%);
}
.dipi-menu-background-animation-slide-bottom.closed:before {
transform: translateY(100%);
}
.dipi-menu-animation-slide-bottom.opened #mobile_menu,
.et-l--header .dipi-menu-animation-slide-bottom.opened ul.et_mobile_menu,
.dipi-menu-background-animation-slide-bottom.opened:before{
transform: translateY(0);
}
.dipi-menu-animation-slide-top.closed #mobile_menu,
.et-l--header .dipi-menu-animation-slide-top.closed ul.et_mobile_menu{
transform: translateY(-120%);
}
.dipi-menu-animation-slide-top.opened #mobile_menu,
.et-l--header .dipi-menu-animation-slide-top.opened ul.et_mobile_menu,
.dipi-menu-background-animation-slide-top.opened:before{
transform: translateY(0);
}
.dipi-menu-background-animation-slide-top.closed:before {
transform: translateY(-100%);
}
.et-db #et-boc .et-l .dipi-menu-animation-grow.closed .et_mobile_menu,
.dipi-menu-animation-grow.closed #mobile_menu,
.et-l--header .dipi-menu-animation-grow.closed ul.et_mobile_menu,
.dipi-menu-background-animation-grow.closed:before {
transform: scale(.5);
opacity: 0;
visibility: hidden;
}
.et-db #et-boc .et-l .et_pb_module .dipi-menu-animation-grow .mobile_menu_bar:before{content:none;}
#main-header .mobile_nav.closed .et_mobile_menu li ul,
.et_pb_fullwidth_menu .mobile_nav.closed .et_mobile_menu li ul,
.et_pb_menu .mobile_nav.closed .et_mobile_menu li ul{
visibility: hidden !important;
}
.dipi-menu-animation-grow.opened #mobile_menu,
.et-l--header .dipi-menu-animation-grow.opened ul.et_mobile_menu,
.dipi-menu-background-animation-grow.opened:before {
transform: scale(1);
opacity: 1;
visibility: visible;
}
.dipi-menu-animation-fade.closed #mobile_menu,
.et-db #et-boc .et-l--header .dipi-menu-animation-fade.closed ul.et_mobile_menu,
.et-l--header .dipi-menu-animation-fade.closed ul.et_mobile_menu,
.dipi-menu-background-animation-fade.closed:before {
opacity: 0;
visibility: hidden;
}
.dipi-menu-animation-fade.opened #mobile_menu,
.et-db #et-boc .et-l--header .dipi-menu-animation-fade.opened .et_mobile_menu,
.et-l--header .dipi-menu-animation-fade.opened .et_mobile_menu,
.dipi-menu-background-animation-fade.opened:before {
opacity: 1;
visibility: visible;
}
body.dipi-mobile-menu-fullscreen .mobile_nav.closed:before {
transition-duration: .7s !important;
transition-delay: .2s;
transition-timing-function: cubic-bezier(.79,.14,.15,.86);
}
body.dipi-mobile-menu-fullscreen .mobile_nav.opened:before {
transition-duration: .7s !important;
transition-timing-function: cubic-bezier(.79,.14,.15,.86);
}
body.dipi-mobile-menu-fullscreen .mobile_nav.dipi-menu-background-animation-circle.opened:before {
transition-duration: .8s !important;
}
body.dipi-mobile-menu-fullscreen .mobile_nav.dipi-menu-background-animation-circle.closed:before {
transition-duration: .5s !important;
}
.mobile_nav.closed #mobile_menu,
.et-l--header .mobile_nav.closed ul.et_mobile_menu {
transition-duration: .5s;
}
.mobile_nav.opened #mobile_menu,
.et-l--header .mobile_nav.opened ul.et_mobile_menu {
transition-duration: .5s;
transition-delay: .2s !important;
}
.mobile_nav #mobile_menu,
.et-l--header .mobile_nav .et_mobile_menu {
display: block !important;
position: absolute;
z-index: 9998;
width: 100%;
}
.mobile_nav:not(.opened) #mobile_menu,
.et-l--header .mobile_nav:not(.opened) .et_mobile_menu
{
pointer-events: none;
}
body.dipi-mobile-menu-fullscreen #mobile_menu,
body.dipi-mobile-menu-fullscreen .et-l--header .et_mobile_nav_menu .et_mobile_menu {
top: 0;
min-height: 100vh;
background: transparent !important;
border-top: none !important;
box-shadow: none !important;
list-style: none;
}
#main-header .mobile_menu_bar,
.et-l--header .mobile_menu_bar {
z-index: 10001;
}
}