.menu-open-button {
    display: block;
    width:40px;
    height:40px;
    font-size:1.4em;
    text-align:center;
    line-height:40px;
    position:absolute;
    right:6px;
    top:6px;
    z-index:2;
    cursor:default;
    -moz-user-select:none;
    -webkit-user-select:none;
    user-select:none;
}

.menu-open-button__hamburger {
    position:relative;
    width:40px;
    height:40px;
}

.menu-open-button__hamburger span {
    display:block;
    position:absolute;
    height:4px;
    width:26px;
    left:7px;
    border-radius:2px;
    background-color:#006699;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}

.menu-open-button__hamburger span:nth-child(1) {
    top:10px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
}

.menu-open-button__hamburger span:nth-child(2) {
    top:18px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
}

.menu-open-button__hamburger span:nth-child(3) {
    top:26px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
}

.menu-open-button__hamburger.open span {
    background: #006699;
}

.menu-open-button__hamburger.open span:nth-child(1) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    top:8px;
    left:10px;
}

.menu-open-button__hamburger.open span:nth-child(2) {
    width:0;
    opacity:0;
}

.menu-open-button__hamburger.open span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    top:26px;
    left:10px;
}

.main-menu-mobile {
    box-sizing:border-box;
    background-color: #fff;
    color:#000;
    position:fixed;
    overflow:auto;
    top:0;
    right:-18rem;
    width:18rem;
    border-left:4px solid #006699;
    height:100%;
    margin:0;
    padding:3.5rem 2rem 5rem 2rem;
    opacity:0;
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    z-index:1;
}

.main-menu-mobile.open {
    right:0;
    opacity:1;
}

/* .main-menu-mobile__link:link, */
/* .main-menu-mobile__link:active, */
/* .main-menu-mobile__link:visited { */
    /* display:block; */
    /* margin:1rem 0 1rem 0; */
    /* font-size:1.4rem; */
    /* text-decoration:none; */
    /* color:inherit; */
/* } */

/* .main-menu-mobile__link:hover { */
    /* color:#006699; */
/* } */

/* .main-menu-mobile__link span { */
    /* width:2rem; */
/* } */

/* .main-menu-mobile__link:hover span { */
    /* width:2.3rem; */
/* } */

.main-menu-mobile__category {
    font-size: 1.2rem;
    float: none;
    color: black;
    padding: 1rem 0 0 0;
    margin-left: -0.5rem;
    font-weight: bold;
    color: #006699;
    text-decoration: none;
    display: block;
    text-align: left;
    cursor: default;
}

.main-menu-mobile__category a:link,
.main-menu-mobile__category a:active,
.main-menu-mobile__category a:visited {
    color: #006699;
    text-decoration: none;
}

.main-menu-mobile__flokkur {
    margin: 0;
    padding: 0;
}

.main-menu-mobile__link__icon,
.main-menu-mobile__flokkur__link__icon {
    display: inline-block;
    width: 2em;
    color: #006699;
    text-align: center;
}

.main-menu-mobile__flokkur__activator__closed {
    display: block;
    float:right;
    color: #006699;
}

.main-menu-mobile__flokkur__activator__open {
    display: none;
    float:right;
    color: #006699;
}

.main-menu-mobile__link:hover,
.main-menu-mobile__flokkur__activator:hover,
.main-menu-mobile__flokkur__link:hover {
    background-color: #ddd;
}

.main-menu-mobile__flokkur__content {
    display: none;
}

.main-menu-mobile__flokkur__link {
    font-size: 1.2rem;
    float: none;
    color: black;
    padding: 12px 16px 12px 32px;
    text-decoration: none;
    display: block;
    text-align: left;
    cursor: default;
}