.mobileAccount {
    display: none;
}

#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #menu-button {
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
    line-height: 1;
    position: relative;
    box-sizing: border-box;
}
#cssmenu:after,
#cssmenu > ul:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
#cssmenu #menu-button {
    display: none;
}
#cssmenu {
    display: flex;
    justify-content: space-between;
    align-content: center;
    flex-wrap: wrap;
    width: calc(100% - 180px);
    margin: 0;
    padding-left: 3.2em;
    line-height: 1;
}
div.accountOptions {
    /*width: 32%;*/
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    justify-self: flex-end;
    align-content: center;
}

#cssmenu > ul {
    flex: 1;
    width: 68%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: center;
}

#cssmenu li {
	margin: 0;
	display: inline-block;
}

#cssmenu li:before {
    content: '';
    display: none;
}
#cssmenu > ul > li > a {
	font-size: 1em;
    font-weight: 500;
	line-height: 20px;
	margin: 0;
	color: #fff;
	display: block;
	padding: 20px;
    opacity: 0.6;
}
    #cssmenu > ul > li.icon > a {
        padding: 4px 0;
        height: 20px;
        display: block;
        box-sizing: unset;
    }
        #cssmenu > ul > li.icon > a img {
            display: block;
            margin-top: 9px;
        }

    #cssmenu > ul > li:hover > a,
    #cssmenu > ul > li.active > a {
        opacity: 1;
    }

#cssmenu ul ul {
    position: absolute;
    left: -9999px;
    flex-direction: column;
	top: 50px;
	margin-left: 0;
}
#cssmenu li:hover > ul {
  left: auto;
}
    #cssmenu ul li:last-child:hover > ul,
    #cssmenu.align-right li:hover > ul {
        right: 0;
    }
#cssmenu ul ul ul {
    margin-left: 100%;
    top: 0;
}
#cssmenu.align-right ul ul ul {
    margin-left: 0;
    margin-right: 100%;
}

#cssmenu ul ul li a {
    font-size: 0.875em;
    text-align: left;
    padding: 12px 10px 12px;
    border-bottom: 1px solid rgba(0,0,0,0.2);
    display: block;
    min-width: 235px;
    width: auto;
    background: var(--colGreen);
    text-decoration: none;
    color: #fff;
}
#cssmenu ul ul li:hover > a,
#cssmenu ul ul li a:hover {
	background: var(--colMid);
	color: #ffffff;
	border-bottom: 1px solid rgba(0,0,0,0.2);
}
#cssmenu ul ul ul li a {
  background: #ebebeb;
  color: #333;
}
#cssmenu ul ul ul li:hover > a,
#cssmenu ul ul ul li a:hover {
	background: #ddd;
	color: #222;
}

#cssmenu ul ul li.has-sub > a::after {
    position: absolute;
    top: 15px;
    right: 10px;
    width: 4px;
    height: 4px;
    border-bottom: 1px solid #dddddd;
    border-right: 1px solid #dddddd;
    content: "";
    transform: rotate(-45deg);
    transition: border-color 0.2s ease;
}

#cssmenu ul ul li.has-sub:hover > a::after {
    border-color: #ffffff;
}

    #cssmenu a {
        color: #fff;
        padding: 12px 20px;
        box-sizing: border-box;
        margin: 0;
    }    
    #cssmenu a.button {
        font-size: 0.875em;
        font-weight: 600;
        border-radius: 5px;
        background: var(--colGreen);
        min-height: 0;
    }
        #cssmenu a.button:hover {
            color: #fff;
            background: var(--colMid);
        }

#cssmenu .accountOptions a:not(.button) {
    color: #fff;
    border-right: 1px solid rgba(255,255,255,0.2)
}
    #cssmenu .accountOptions a:not(.button):last-child {
        border-right: none
    }

@media only screen and (max-width: 1480px) {
    #cssmenu {
        width: calc(100% - 150px);
        padding-left: 2em;
    }
        #cssmenu a {
            color: #fff;
            padding: 10px 15px;
            box-sizing: border-box;
            margin: 0;
        }

        #cssmenu > ul > li > a {
            padding: 15px;
        }
}
@media only screen and (min-width: 960px) and (max-width: 1279px) {
    #cssmenu {
        padding-left: 1em;
    }
    #cssmenu a {
        color: #fff;
        padding: 8px 12px;
        box-sizing: border-box;
        margin: 0;
    }
    #cssmenu > ul > li > a {
        padding: 12px 11px;
    }
    #cssmenu ul ul {
        top: 40px;
    }
}

@media all and (max-width: 959px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
    #headerWrap .container {
        align-items: flex-start;
    }
    div.accountOptions {
        margin-top: 10px;
        width: 100%;
    }
    #cssmenu a {
        color: #fff;
        padding: 5px 10px 6px;
        box-sizing: border-box;
        margin: 0;
    }
    #cssmenu .accountOptions a:not(.button) {
        font-size: 0.9em
    }
    #cssmenu .accountOptions a:not(.button):last-child {
        padding-right: 0;
    }
    #cssmenu {
        flex-direction: column;
        width: calc(100% - 120px);
        padding-left: 20px;
    }
       
    #cssmenu ul {
        display: none;
        margin: 0 0 10px;
        width: auto;
    }

        #cssmenu ul li,
        #cssmenu ul ul li,
        #cssmenu ul li:hover > ul > li {
            width: 100%;
            height: auto;
            margin-left: 0;
        }

    #cssmenu > ul > li > a {
        border-bottom: 1px solid rgba(0,0,0,0.2);
    }

    #cssmenu > ul > li.icon > a img {
        margin-top: -9px;
        float: none;
    }

    #cssmenu ul li a,
    #cssmenu ul ul li a,
    #cssmenu > ul > li.icon > a {
        display: block;
        width: 100%;
        padding: 11px 10px 9px !important;
        font-size: 14px;
        color: #fff;
        background: transparent !important;
        box-sizing: border-box;
        border-bottom: 1px solid rgba(255,255,255,0.3);
        border-radius: 0;
    }

        #cssmenu > ul > li.icon > a,
        #cssmenu > ul > li.icon > a:hover,
        #cssmenu > ul > li.icon > a:active {
            padding: 20px 20px 21px;
        }


    #cssmenu ul ul li a {
        color: #008747 !important;
    }

    #cssmenu > ul > li:hover > a,
    #cssmenu > ul > li.active > a {
        border-bottom: 1px solid rgba(255,255,255,0.3);
        background: #008747 !important;
        color: #fff !important;
    }

        

    #cssmenu > ul > li {
        float: none;
        display: block;
    }

    #cssmenu ul ul li a {
        padding: 14px 10px 13px 15px;
        font-size: 13px;
        color: #000000 !important;
        background: #fff !important;
        border-bottom: 1px solid rgba(0,0,0,0.1);
    }

        #cssmenu ul ul li:hover > a,
        #cssmenu ul ul li a:hover {
            color: #000000;
            background: #f4f4f4;
        }
    #cssmenu ul ul ul li a {
        padding-left: 40px;
    }

    #cssmenu ul ul,
    #cssmenu ul ul ul {
        position: relative;
        top: 0;
        left: 0;
        right: auto;
        width: 100%;
        margin: 0;
    }

        #cssmenu ul ul ul li a {
            background: #fff;
            color: #333;
        }

            #cssmenu ul ul ul li:hover > a,
            #cssmenu ul ul ul li a:hover {
                background: #ddd;
                color: #222;
            }

        #cssmenu > ul > li.has-sub > a::after,
        #cssmenu ul ul li.has-sub > a::after {
            display: none;
        }

    #menu-line {
        display: none;
    }

    #cssmenu #menu-button {
        width: 100%;
        display: block !important;
        padding: 10px 0 10px;
        color: #000000;
        cursor: pointer;
        text-transform: uppercase;
        border: none;
        -webkit-tap-highlight-color: transparent;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

        #cssmenu #menu-button::after {
            content: '';
            position: absolute;
            top: 2px;
            right: 0;
            display: block;
            width: 20px;
            height: 3px;
            background: var(--colGreen);
            -webkit-transition: all 0.2s ease-out;
            -moz-transition: all 0.2s ease-out;
            -o-transition: all 0.2s ease-out;
            transition: all 0.2s ease-out;
        }

        #cssmenu #menu-button::before {
            content: '';
            position: absolute;
            top: 9px;
            right: 0;
            display: block;
            width: 20px;
            height: 4px;
            border-top: 3px solid var(--colGreen);
            border-bottom: 3px solid var(--colGreen);
            -webkit-transition: all 0.2s ease-out;
            -moz-transition: all 0.2s ease-out;
            -o-transition: all 0.2s ease-out;
            transition: all 0.2s ease-out;
        }

        #cssmenu #menu-button.menu-opened::after {
            top: 9px;
            right: 0;
            transform: rotate(225deg);
        }

        #cssmenu #menu-button.menu-opened::before {
            top: 9px;
            transform: rotate(-225deg);
            display: block;
            width: 20px;
            height: 3px;
            border: none;
            background: var(--colGreen);
        }
    #cssmenu.noHamburger #menu-button {
        display: none !important;
    }
    #cssmenu .submenu-button {
        position: absolute;
        z-index: 10;
        right: 0;
        top: 0;
        display: block;
        border-left: 1px solid rgba(255,255,255,0.3);
        height: 40px;
        width: 40px;
        cursor: pointer;
    }

        #cssmenu .submenu-button::after {
            content: '';
            position: absolute;
            top: 15px;
            left: 20px;
            display: block;
            width: 1px;
            height: 11px;
            background: #fff;
            z-index: 99;
        }

        #cssmenu .submenu-button::before {
            content: '';
            position: absolute;
            left: 15px;
            top: 20px;
            display: block;
            width: 11px;
            height: 1px;
            background: #fff;
            z-index: 99;
        }

        #cssmenu .submenu-button.submenu-opened {
            border-left: 1px solid rgba(0,0,0,0.2);
        }

            #cssmenu .submenu-button.submenu-opened:after {
                display: none;
            }
}

@media only screen and (min-width: 768px) and (max-width: 959px) {

}
@media only screen and (max-width: 767px) {
    
}
@media only screen and (max-width: 479px) {
    #cssmenu {
        width: 100%;
        padding-left: 0;
        padding-bottom: 10px;
    }
        #cssmenu.noHamburger {
            padding-bottom: 0;
        }
    #cssmenu ul {
        margin-bottom: 0;
    }
    div.accountOptions {
        position: absolute;
        top: -40px;
        right: 0;
        margin: 0;
    }
}