/*
    Theme Name: RvA Service PWA
    Theme URI: http://wordpress.org/themes/twentythirteen
    Author: BriteBlue Solutions
    Author URI: https://briteblue.nl
    Description: De officiële RvA PWA.
    Version: 1.0
    License: GNU General Public License v2 or later
    License URI: http://www.gnu.org/licenses/gpl-2.0.html
    Tags: black, brown, orange, tan, white, yellow, light, one-column, two-columns, right-sidebar, flexible-width, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, translation-ready
    Text Domain: twentythirteen
    */
    * {
        font-family: 'Nunito Sans', sans-serif;
    }

    body {
        overflow-x: hidden;
        background-color: #00a6df !important;
    }

    @media (max-width: 575.98px) {
        .personal-data-nav {
            margin-top: 30px !important;
        }
    }

    @media (min-width: 768px) {
        #menu-item-107{
            display: none;
        }
    }

    body>.container {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    @media (min-width: 768px) {
        header .menu-item {
            padding: 0px 10px;
        }
    }

    #wpadminbar {
        display: none;
    }

    /* #menu-testmenu li.current-menu-item {
        background: red;
    } */

    .top-nav {
        background: #00A6DF;
    }

    .nav-btm {
        flex-direction: row !important;
    }

    .nav-btm li {
        padding: 0 13px;
        text-align: center;
    }

    .bottom-nav {
        /* background: var(--filter-color); */
        background: #00A6DF;
        flex-direction: row;
        /* height: calc(65px + (constant(safe-area-inset-bottom))*1.1);
        height: calc(65px + (env(safe-area-inset-bottom))*1.1); */
        height: 75px;
        /* min-height: 60px; */
        padding-left: 5px !important;
        padding-right: 5px !important;
        /* padding-bottom: env(safe-area-inset-bottom, .5rem) !important; */
    }

    .nav-btm .current_page_item a {
        /* background: #12475a; */
        border-radius: 6px;
        color: #12475a !important;
        /* padding: 4px 13px; */
    }

    .nav-btm .current_page_item svg path,
    .nav-btm .current_page_item rect {
        /* background: #12475a; */
        stroke: #12475a !important;
        fill: #12475a !important;
        /* padding: 4px 13px; */
    }

    .nav-btm .current_page_item circle {
        stroke: #12475a !important;
    }

    /* .bottom-nav .container {
        padding-bottom: 10px;
        padding-top: 13px;
    } */

    /* .nav-btm .fixed-projects-containerer-icon {
        width: 20px;
        height: 20px;
        background: red;
        display: inline-block;
        border-radius: 50%;
    } */

    .nav-btm .nav-link {
        font-size: 12px;
        font-weight: bold;
        padding: 0;
    }

    .bottom-nav a {
        color: #fff !important;
    }

    .bottom-nav a:hover {
        color: #dadada;
    }

    /* .slide {
        transition: -webkit-transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
        transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
    } */

    main {
        height: 100vh;
    }


    .container.active.slide {
        /* -webkit-transform: translateX(-19.5rem);
        -moz-transform: translateX(-19.5rem);
        -o-transition: translateX(-19.5rem);
        transition: translateX(-19.5rem);
        transform: translateX(-19.5rem);
        overflow-y: auto;
        height: 100vh; */
        opacity: 0.8;
        transition: all 300ms ease-in;
    }

    @media (max-width: 767.98px) {
        .offcanvas-collapse {
            position: fixed;
            top: 56px;
            /* Height of navbar */
            bottom: 0;
            width: 100%;
            padding-right: 1rem;
            padding-left: 2rem;
            overflow-y: auto;
            background-color: #00a6df;
            transition: -webkit-transform .3s ease-in-out;
            transition: transform .3s ease-in-out;
            transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
            -webkit-transform: translateX(100%);
            transform: translateX(100%);
        }

        .offcanvas-collapse.open {
            -webkit-transform: translateX(-1rem);
            /* transform: translateX(4rem); */
            transform: translateX(8rem);
            /* Account for horizontal padding on navbar */
            padding-bottom: 130px;
        }
    }

    .nav-scroller {
        position: relative;
        z-index: 2;
        height: 2.75rem;
        overflow-y: hidden;
    }

    .nav-scroller .nav {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        padding-bottom: 1rem;
        margin-top: -1px;
        overflow-x: auto;
        color: rgba(255, 255, 255, .75);
        text-align: center;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    .nav-underline .nav-link {
        padding-top: .75rem;
        padding-bottom: .75rem;
        font-size: .875rem;
        color: var(--secondary);
    }

    .nav-underline .nav-link:hover {
        color: var(--blue);
    }

    .nav-underline .active {
        font-weight: 500;
        color: var(--gray-dark);
    }

    .text-white-50 {
        color: rgba(255, 255, 255, .5);
    }

    .bg-purple {
        background-color: var(--purple);
    }

    .border-bottom {
        border-bottom: 1px solid #e5e5e5;
    }

    .box-shadow {
        box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
    }

    .lh-100 {
        line-height: 1;
    }

    .lh-125 {
        line-height: 1.25;
    }

    .lh-150 {
        line-height: 1.5;
    }


    @media (max-width: 575.98px) {
        li#menu-item-26 a:before {
            content: '';
            display: block;
            background: #fff url("/wp-content/themes/RVA/image/rva-logo.png") no-repeat;
            background-position-x: 0%;
            background-position-y: 0%;
            background-size: auto;
            background-origin: padding-box;
            padding: 40px 30px;
            border-radius: 80px;
            margin-bottom: 20px;
            background-size: 70px;
            background-position: center left;
            background-origin: content-box;
        }
    }