@charset "utf-8"; @media only screen and (min-width: 768px) {
    .sf-menu, .sf-menu>li {
        float: left
    }

    .sf-menu a, .sf-menu ul li a {
        text-decoration: none;
        zoom: 1; /* text-transform: uppercase; */
    }

    .sf-menu, .sf-menu * {
        margin: 0;
        padding: 0;
        list-style: none
    }

    .sf-menu li {
        position: relative
    }

    .sf-menu ul {
        position: absolute;
        display: none;
        top: 95%;
        left: 0;
        z-index: 99;
        box-shadow: 2px 2px 6px rgba(0,0,0,.6);
        min-width: 11em;
    }

    .sf-menu a, .sf-menu li.sfHover>ul, .sf-menu li:hover>ul {
        display: block
    }

    .sf-menu ul ul {
        top: 0;
        left: 100%
    }

    .sf-menu {
        margin-bottom: 0;
        width: 100%;
        text-align: right;
        /* display: flex; */
        /* justify-content: space-around; */
    }

    .sf-menu a {
        /* TRANSFORM-STYLE: PRESERVE-3D; */
        position: relative;
        padding: .5rem 0;
        margin: 0 auto;
        color: #fff;
        font-weight: 700;
        transition: all .9s;
        background: rgba(47 48 50 / 100%);
        background: none;
        text-transform: uppercase;
    }

    .sf-menu a:hover {
        color: #bfc3c5;
        /* background: rgba(47 48 50 / 80%); */
        transition: all .9s;
    }

    .sf-menu a.act {
        color: rgb(121 233 117 / 75%);
        /* background: #bd1320; */
        transition: all .9s
    }

    .sf-menu ul li a.act {
        color: #ededed;
        color: rgb(121 233 117 / 75%);
        background: rgb(21 20 20 / 60%);
        transition: all .9s
    }

    .sf-menu li, .sf-menu ul li {
        -webkit-transition: background .5s;
        -moz-transition: background .5s
    }

    .sf-menu li a .spacing {
        padding-left: 1rem
    }

    .sf-menu li:first-child a {
        border-left: none
    }

    .sf-menu li {
        white-space: nowrap;
        transition: background .5s;
        text-align: center;
        overflow: visible;
        width: 12%;
        /* border-right: 1px solid #fff; */
        vertical-align: middle;
        /* float: right; */
        /* background: red; */
    }

    .menuakt {
        background: #494848
    }

    .sf-menu ul li {
        width: 100%;
        text-align: center;
        border-top: 1px solid rgb(255 255 255 / 50%);
        transition: background .5s;
        height: inherit;
        border-right: none;
        background: rgb(33 34 35 / 55%);
    }

    .sf-menu ul li:hover {
        /* background: rgba(20,38,67,.8); */
        background: rgb(64 71 85 / 95%);
        background: rgb(33 34 35 / 85%);
        -webkit-transition: background .5s;
        -moz-transition: background .5s;
        transition: background .5s
    }

    .sf-menu ul li a, .sf-menu ul li a:hover {
        transition: all .5s;
    }

    .sf-menu ul li:first-child {
        /* border-top: none; */
    }

    .sf-menu ul li li:last-child {
        border-top: 1px solid #fff
    }

    .sf-menuss ul li ul li {
        background: #fff;
        width: 100%;
        text-align: left;
        border-top: 1px solid #969696
    }

    .sf-menu ulss li ul li:first-child {
        border-top: #fff
    }

    .sf-menu ul li a {
        padding: .5rem;
        font-size: .9375rem;
        font-size: 1.125rem;
        color: #fff;
        border: none;
        font-weight: 300;
        word-wrap: break-word;
        word-break: break-all;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        -o-hyphens: auto;
        hyphens: auto;
        background: none;
    }

     .sf-menu>li:first-child {
        width: 7%;
        background-image: none;
        margin-left: 0
    }

    .sf-menu>li:nth-child(2) {
        width: 19%;
    }

    .sf-menu>li:nth-child(3) {
        width: 19%;
    }

    .sf-menu>li:nth-child(4) {
        width: 9%;
    }

    .sf-menu>li:nth-child(5) {
        width: 9%;
        /* border-right: none; */
    }

    .sf-menu>li:nth-child(5) ul {
    }

    .sf-menu>li:nth-child(6) {
        width: 21%;
        /* border-right: none; */
    }

    .sf-menu>li:nth-child(7) {
        width: 16%;
        border-right: none
    }

    .sf-menu>li:nth-child(5) ul {
        margin-left: -50%
    }

    .sf-menu a {
        font-size: 1rem;
    }

    #headpic {
        margin-top: -29px;
    }

    .reduced #headpic {
        /* margin-top: .5rem; */
        margin-bottom: 0;
        transition: .7s all
    }

    #navi, #navi.reduced {
        transition: .5s all
    }

    #navi.reduced {
        position: fixed;
        width: 98.9%;
        max-width: 1250px;
        padding-top: 0;
        margin-top: 0;
        top: 0;
        z-index: 10000
    }

    #navi.reduced .sf-menu a {
        padding-top: .5rem;
        padding-bottom: .5rem;
        transition: all 1s
    }
}

@media only screen and (min-width: 860px) {
    .sf-menu a {
        font-size: 1.0625rem;
    }

    #headpic {
        display: block;
        width: 33%;
        margin-bottom: 1rem;
    }

    .sf-menu>li:nth-child(5) ul {
        margin-left: -30%
    }
}

@media only screen and (min-width: 985px) {
    #navi {
        /* width: 66%; */
        margin-top: -15px;
        margin-left: 0px;
    }

    .sf-menu>li:first-child {
        width: 9%;
        background-image: none;
        margin-left: 0
    }

    .sf-menu>li:nth-child(2) {
        width: 17.5%;
    }

    .sf-menu>li:nth-child(3) {
        width: 17.5%;
    }

    .sf-menu>li:nth-child(4) {
        width: 10%;
    }

    .sf-menu>li:nth-child(5) {
        width: 10%;
        /* border-right: none; */
    }

    .sf-menu>li:nth-child(5) ul {
    }

    .sf-menu>li:nth-child(6) {
        width: 20%;
        /* border-right: none; */
    }

    .sf-menu>li:nth-child(7) {
        width: 16%;
        border-right: none
    }

    .sf-menu a {
        font-size: 1.1625rem;
    }

    .sf-menu {
        width: 100%;
        text-align: right;
        /* padding-left: 10%; */
    }
}

@media only screen and (min-width: 1080px) {
    .sf-menu a {
        font-size: 1.25rem;
    }

    .sf-menu {
        /* width: 80%; */
        text-align: right;
        /* padding-left: 10%; */
    }

    .sf-menu a {
        /* font-size: 1.375rem; */
        /* padding-top: 1.25rem; */
        /* padding-bottom: 1.25rem; */
    }

    #headpic {
        display: block;
        /* margin-top: 0; */
        margin-bottom: 1rem
    }
}

@media only screen and (min-width: 1140px) {
    .sf-menu>li:nth-child(5) ul {
        margin-left: -8%
    }
}

@media only screen and (min-width: 1200px) {
    #navi {
        /* width: 65%; */
        margin-top: -9px;
        /* margin-left: -10px; */
    }

    .sf-menu>li:first-child {
        /* width: inherit; */
        background-image: none;
        margin-left: 0
    }

    .sf-menu>li:nth-child(2) {
        /* width: inherit; */
    }

    .sf-menu>li:nth-child(3) {
        /* width: inherit; */
    }

    .sf-menu>li:nth-child(4) {
        /* width: inherit; */
    }

    .sf-menu>li:nth-child(5) {
        /* width: inherit; */
        /* border-right: none; */
    }

    .sf-menu>li:nth-child(5) ul {
    }

    .sf-menu>li:nth-child(6) {
        /* width: inherit; */
        /* border-right: none; */
    }

    .sf-menu>li:nth-child(7) {
        /* width: inherit; */
        border-right: none
    }

    .sf-menu a {
        font-size: 1.25rem;
    }

    #headpic {
        display: block;
        /* margin-top: 0; */
        margin-bottom: 1.25rem;
        margin-bottom: .25rem;
    }
}

@media only screen and (min-width: 1275px) {
    .sf-menu>li:nth-child(5) ul {
    }
   
}

    

@media only screen and (min-width: 1300px) {
    .sf-menu a {
        font-size: 1.275rem;
    }
    #navi {
        /* width: 65%; */
        margin-top: -7px;
        /* margin-left: -10px; */
    }
}
@media only screen and (min-width: 1360px) {
    .sf-menu a {
        font-size: 1.3125rem;
    }
    #navi {
        /* width: 65%; */
        margin-top: -3px;
        /* margin-left: -10px; */
    }
}

@media only screen and (min-width: 1400px) {
    .sf-menu a {
        font-size: 1.4375rem;
    }

    .sf-menu {
        /* width: 80%; */
        text-align: right;
        /* padding-left: 18%; */
    }

    .sf-menu>li:nth-child(5) ul {
    }
    #navi {
        width: 100%;
        margin-top: -2px;
        /* margin-left: -10px; */
    }
}