/* 
Theme Name:      Divi Child
Theme URI:       http://childtheme-generator.com/
Description:     Divi Child is a child theme of Divi, created by ChildTheme-Generator.com
Author:          Roland Brotbeck
Author URI:      http://childtheme-generator.com/
Template:        Divi
Version:         1.0.0
Text Domain:     Divi-child
*/

/*
    Add your custom styles here
*/

body #top-header {
    display: none !important;
}

body.toolbox_menu2 #top-menu>li>a:before, body.toolbox_menu2 .dtb-menu ul.et-menu>li>a:before {
    left: 0;
}

body.toolbox_menu2 #top-menu>li>a:hover:before, body.toolbox_menu2 .dtb-menu ul.et-menu>li>a:hover:before, body.toolbox_menu2 #top-menu>li.current_page_item>a:before, body.toolbox_menu2 .dtb-menu ul.et-menu>li.current_page_item>a:before, body.toolbox_menu2 #top-menu>li.current-menu-ancestor>a:before, body.toolbox_menu2 .dtb-menu ul.et-menu>li.current-menu-ancestor>a:before {
    margin-left: 0;
}

body #top-menu li a, body #top-menu li:hover a {
    color: #555756;
    font-family: 'Bozon Book', Helvetica, Arial, Lucida, sans-serif;
}

body #top-menu li ul, #et-secondary-nav .menu-item-has-children>a:first-child:after, #top-menu .menu-item-has-children>a:first-child:after {
    display: none !important;
}

#et-secondary-nav .menu-item-has-children>a:first-child, #top-menu .menu-item-has-children>a:first-child {
    padding-right: 0 !important;
}

/*------------------------------------*\
  CANVAS
\*------------------------------------*/
.offmenu-trigger {
    position: relative;
    display: none;
    width: 40px;
    height: 40px;
    margin: 0 auto 40px auto;
    color: transparent;
    border-radius: 50%;
    background-color: #6e706f;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 62px;
    cursor: pointer;
    z-index: 9999;
    display: none;
}

.offmenu-trigger:hover {
    background-color: #dd000c;
}

.offmenu-trigger.active {
    background-color: #dd000c;
}

@media only screen and (min-width:980px) {
    .offmenu-trigger {
        display: block;
    }

}

.offmenu-trigger span {
    display: block;
    width: 20px;
    height: 1px;
    margin: 5px 0 5px 10px;
    border-radius: 1px;
    background-color: #fff;
    opacity: 1;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

.offmenu-trigger span:nth-child(1) {
    margin-top: 14px;
}

.offmenu-trigger span:nth-child(2) {
    width: 14px;
}

.offmenu-trigger.active span:nth-child(1), .offmenu-trigger.active span:nth-child(3) {
    position: absolute;
    top: 6px;
    right: 10px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.offmenu-trigger.active span:nth-child(2) {
    display: none;
}

.offmenu-trigger.active span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    margin-top: 14px;
}

/*------------------------------------*\
  MENU OFF
\*------------------------------------*/
.offmenu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    z-index: 900;
    background-color: #fff;
    border-bottom: solid 1px #ececec;
    -webkit-box-shadow: 0 8px 20px 0 rgb(0 0 0 / 10%);
    box-shadow: 0 8px 20px 0 rgb(0 0 0 / 10%);
}

.offmenu .inside {
    padding-top: 196px;
    padding-bottom: 120px;
    padding-left: 100px;
    padding-right: 100px;
}

@media only screen and (min-width:1600px) {
    .offmenu .inside {
        padding-left: 200px;
        padding-right: 200px;
    }

}

#menu-off {
    display: flex;
    justify-content: space-between;
}

#menu-off li {

    /*width: 25%;
    width: calc((100% - 300px) / 5);*/
    line-height: 1.1em;
    margin-bottom: 50px;
    position: relative;
}

#menu-off li a {
    font-size: 1.7vw;
    color: #555756;
    text-transform: uppercase;
    font-family: 'Bozon Book', Helvetica, Arial, Lucida, sans-serif;
    font-weight: 900;
    letter-spacing: 1px;
    position: relative;
}

#menu-off li a:before {
    content: '';
    display: block;
    background: #dd000c;
    width: 0;
    height: 3px;
    left: 0;
    position: absolute;
    top: -7px;
    transition: all .3s ease-in-out;
    opacity: 1;
    border-radius: 0;
}

#menu-off li.current-menu-item a:before, #menu-off li:hover a:before {
    width: 100%;
}

#menu-off li ul {
    margin-top: 70px;
}

#menu-off li li {
    width: 100%;
    margin-bottom: 40px;
}

#menu-off li li:last-child {
    margin-bottom: 0;
}

#menu-off li li a {
    font-size: 1.5vw;
    color: #555756;
    text-transform: none;
    font-family: 'Bozon Book', Helvetica, Arial, Lucida, sans-serif;
    font-weight: 300;
    letter-spacing: 0.5px;
}

#menu-off li li a:before {
    display: none !important;
}

#menu-off li li.current-menu-item a, #menu-off li li:hover a {
    color: #dd000c;
}

/*------------------------------------*\
  RESPONSIVE
\*------------------------------------*/
@media only screen and (min-width:980px) {
    body.et_header_style_left #logo, body.et_header_style_split #logo {
        max-width: 195px;
        max-height: initial;
    }

    body #et-top-navigation {
        padding-left: 0 !important;
        margin-right: 50px;
    }

    body #top-menu li {
        padding-right: 18px;
    }

    body #top-menu li a {
        font-size: 15px;
        letter-spacing: 0px;
    }

    #main-header .container {

    }

}

@media only screen and (min-width:1200px) {

    #page-container {
        padding-top: 164px;
    }

    #main-header {
        position: absolute;
        top: 0;
        left: 0; 
    }


    #main-header.off-canvas {
        position: absolute;
        top: -164px;
        left: 0
    }

    #main-header.fixed {
        position: fixed;
        top: 0px;
        left: 0;
        
    }

    body #et-top-navigation {
        margin-right: 107px;
    }

    body #top-menu li {
        padding-right: 18px;
    }

    body #top-menu li a {
        font-size: 18px;
    }

}

@media only screen and (min-width:1600px) {
    body.et_header_style_left #logo, body.et_header_style_split #logo {
        max-width: 270px;
    }

    body #top-menu li {
        padding-right: 49px;
    }

    body #top-menu li a {
        font-size: 18px;
    }

}