.main-navigation a:hover, 
.nav-container > ul > li label:hover {
        opacity: 0.75;
}

.main-navigation li {
        position: relative;
}
        
.main-navigation input[type=checkbox] {
        display: none;
}

.main-navigation li label {
        cursor: pointer;
}



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

        .nav-primary {
                float: right;
                margin-top: 1.5em;
        }

        .main-navigation ul {
                margin-left: -1em;
                padding-top: 3.25em;
                padding-bottom: 0.5em;
                padding-left: 1em;
                padding-right: 2em;
                line-height: 1.15;
                width: 275px;
                position: absolute;
                top: -1em;
                display: none;
        }
        
        .main-navigation input[type=checkbox]:checked + label + ul,
        .main-navigation input[type=checkbox]:checked + label:nth-of-type(n) + ul {
                display: block;
        }

        .main-navigation > li:first-of-type {
                z-index: 100;
        }
        .main-navigation > li:nth-of-type(2) {
                z-index: 90;
        }
        .main-navigation > li:nth-of-type(3) {
                z-index: 80;
        }
        .main-navigation > li:nth-of-type(4) {
                z-index: 70;
        }
        .main-navigation > li:nth-of-type(5) {
                z-index: 60;
        }
        .main-navigation > li:nth-of-type(6) {
                z-index: 50;
        }
        .main-navigation > li:nth-of-type(7) {
                z-index: 40;
        }
        .main-navigation > li:nth-of-type(8) {
                z-index: 30;
        }
        .main-navigation > li:nth-of-type(9) {
                z-index: 20;
        }

        .main-navigationxxx ul {
                border-radius: 0.5em;
        }

        .main-navigationxxx ul ul {
                border-radius: 0 0.5em 0.5em 0;
        }

        .main-navigation ul li {
                margin-bottom: 0.5em;
        }

        .main-navigation ul li:last-child {
                margin-bottom: 0.25em;
        }

        .main-navigation ul li a {
                display: inline-block;
                margin-bottom: 0.25em;
        }

        .main-navigation ul ul {
                margin-left: calc( 275px + -1.5em );
                padding-top: 1em;
        }

        .main-navigation li label {
                position: absolute;
                top: 0;
                right: 0;
                z-index: 20;
        }

        .main-navigation ul li label {
                right: -1em;
        }

        .main-navigation input[type=checkbox]:checked + label i {
                transform: rotate(180deg);
        }

        .main-navigation ul input[type=checkbox]:checked + label i {
                transform: rotate(270deg);
        }

        .main-navigation li a {
                position: relative;
                z-index: 20;
        }

        .main-navigation li.has-children {
                padding-right: 0.75em; 
        }

        .main-navigation > li {
                display: inline-block;
                margin-left: 0.75em;
                margin-right: 0.75em;
        }

        .main-navigation li.has-children a {
                margin-right: 0.5em;
        }

        .current-page > a {
                xfont-weight: 700;
                xopacity: 0.5;
        }

        #menu .footer-pages {
                display: none;
        }

}



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

        #menu {
                xdisplay: none;
                position: absolute;
                top: 0;
                left: 0;
                z-index: 100;
                padding-bottom: 10em;
                width: 0;
                max-height: 0;
                opacity: 0;
                transition: width 0.25s, max-height 0.25s, opacity 0.25s;
                overflow: hidden;
        }
        
        #menu:target {
                xdisplay: block;
                opacity: 1;
                width: 100%;
                max-height: 100%;
        }

        .main-navigation {
                padding-top: 8em;
                padding-left: 17.5%;
                padding-right: 17.5%;
        }

        .main-navigation ul {
                xdisplay: none;
                position: absolute;
                top: -1000px;
                left: -100%;
                opacity: 0;
                transition: left 0.25s;
        }
        
        .main-navigation input[type=checkbox]:checked + label + ul,
        .main-navigation input[type=checkbox]:checked + label:nth-of-type(n) + ul {
                xdisplay: block;
                position: relative;
                top: 0;
                left: 0;
                opacity: 1;
        }

        .main-navigation li {
                border-top: 1px solid rgba(255,255,255,0.15);
                line-height: 1.25;
        }
        
        .main-navigation li:first-child {
                border-top: none;
        }
                
        .main-navigation li label {
                position: absolute;
                top: 0.75em;
                right: 0.75em;
                display: inline-block;
                padding-left: 1em;
                border-left: 1px solid rgba(255,255,255,0.25);
        }

        .main-navigation input[type=checkbox]:checked + label i {
                transform: rotate(180deg);
        }

        .main-navigation ul li a {
                padding-left: 1em;
                letter-spacing: -1px;
        }
                
        .main-navigation ul ul li a {
                padding-left: 2em;
        }
                
        .main-navigation ul ul ul li a {
                padding-left: 3em;
        }
                
        .main-navigation ul ul ul ul li a {
                padding-left: 4em;
        }

        .main-navigation ul ul ul ul ul li a {
                padding-left: 5em;
        }

        .main-navigation ul ul ul ul ul ul li a {
                padding-left: 6em;
        }

        .main-navigation a {
                display: block;
                padding-top: 0.75em;
                padding-bottom: 0.75em;
                margin-right: 3em;
        }

        .main-navigation li.current-page > a {
                font-weight: 700;
                letter-spacing: 0.25px; 
        }

}