#sn_menu_icon {display:block; width:41px; height:41px; position:fixed; right:30px; top:40px; z-index:100020;}
#sn_menu_icon .sn_menu_open {display:block; width:41px; height:41px; background:#099; cursor:pointer; border-radius:41px; }
#sn_menu_icon .sn_menu_close {display:none; width:41px; height:41px; background:rgba(0,0,0,0); cursor:pointer; position:absolute; left:0; top:0; z-index:10;}
#sn_menu_icon .sn_menu_open .bar {display:block; width:17px; height:3px; background:#fff; position:absolute; left:12px; top:19px; transition: background 0s 0.3s}
#sn_menu_icon .sn_menu_open .bar::before {content:""; display:block; width:17px; height:3px; background:#fff; position:absolute; left:0; top:-6px; transform-origin:left top; transition: 0.3s;}
#sn_menu_icon .sn_menu_open .bar::after {content:""; display:block; width:17px; height:3px; background:#fff; position:absolute; left:0; top:6px; transform-origin:left bottom; transition: 0.3s;}
#sn_menu_panel {width:100%; height:100%; position:fixed; left:-100%; top:0; z-index:100010; transition:0.5s 1s; 
  display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between;
}

#sn_menu_panel #sn_menu_left { width: 50%; height: 100%; background-color: #099; position: relative; overflow: auto; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: center;}
#sn_menu_panel #sn_menu_left h1 {padding:0; margin:15px; text-align:center;}
#sn_menu_panel #sn_menu_left h1 .logo {display: inline-block; margin: 0px; transition: 0.2s; background: url(../images/vibeke.png); width: 200px; height: 70px;}
#sn_menu_panel #sn_menu_left #social {text-align:center; width:100%;}
#sn_menu_panel #sn_menu_left .social {color:#555; display:inline-block; font-size:20px; margin:5px; transition:0.2s; font:400 50px/70px 'Open Sans', sans-serif;}

#sn_menu_panel #sn_menu_left .en {background-color: #fff; display:inline-block; margin:5px; transition:0.2s; background-image:url(../images/language/en.png); width:41px; height:41px; }
#sn_menu_panel #sn_menu_left .de {background-color: #fff; display:inline-block; margin:5px; transition:0.2s; background-image:url(../images/language/de.png); width:41px; height:41px; }
#sn_menu_panel #sn_menu_left .sv {background-color: #fff; display:inline-block; margin:5px; transition:0.2s; background-image:url(../images/language/sv.png); width:41px; height:41px; }
#sn_menu_panel #sn_menu_left .fi {background-color: #fff; display:inline-block; margin:5px; transition:0.2s; background-image:url(../images/language/fi.png); width:41px; height:41px; }
#sn_menu_panel #sn_menu_left .fb {background-color: #fff; display:inline-block; margin:5px; transition:0.2s; background-image:url(../images/social/fb.png); width:41px; height:41px; }
#sn_menu_panel #sn_menu_left .tw {background-color: #fff; display:inline-block; margin:5px; transition:0.2s; background-image:url(../images/social/tw.png); width:41px; height:41px; }
#sn_menu_panel #sn_menu_left .goo {background-color: #fff; display:inline-block; margin:5px; transition:0.2s; background-image:url(../images/social/goo.png); width:41px; height:41px; }
#sn_menu_panel #sn_menu_left .yt {background-color: #fff; display:inline-block; margin:5px; transition:0.2s; background-image:url(../images/social/yt.png); width:41px; height:41px; }

#sn_menu_panel #sn_menu_left .social:hover {transition:0.4s; background-color:#555; color:#555;}
#sn_menu_panel #sn_menu_left p {font:300 14px/25px 'Open Sans', sans-serif; color:#000; text-align:center;}

#sn_menu_panel #sn_menu_right {order:2; width:calc(50% - 0px); height:100%; background:#000; font:400 18px/40px 'Open Sans', sans-serif; color:#aaa; overflow-y:auto; -webkit-overflow-scrolling: touch;
  display:flex; flex-direction:column; flex-wrap:nowrap; justify-content:center; border-left:0px solid #790;
}

#sn_menu_right #sn_menu p {position:relative; padding:0; margin:0;}
#sn_menu_right #sn_menu p label {display:block; line-height:40px; text-transform:uppercase;}
#sn_menu_right #sn_menu p label::after {content:""; display:block; width:6px; height:6px; border:2px solid #aaa; border-width:0 2px 2px 0; position:absolute; right:20px; top:15px; transform:rotate(-45deg); transition:0.3s;}
#sn_menu_right #sn_menu p label:hover {color:#099;}
#sn_menu_right #sn_menu p label:hover::after {border-color:#099;}
#sn_menu_right #sn_menu p label:last-child {display:none; position:absolute; left:0; top:0; width:100%; height:40px; background:rgba(0,0,0,0);}

#sn_menu_right #sn_menu p a {line-height:50px; color:#099; text-decoration:none; text-transform: uppercase;}
#sn_menu_right #sn_menu p a:hover {color:#999;}

#sn_menu_right #sn_menu div p {height:0; overflow:hidden; opacity:0; transition:0.75s; position:relative;}

#sn_menu_right div {padding:0; margin:0; list-style:none;}

#sn_menu_right #sn_menu {width:calc(100% - 100px); max-width:300px; min-width:200px; margin:0 auto; max-height:100%;}
#sn_menu_right #sn_menu > p {text-indent:0; color:#555;}
#sn_menu_right #sn_menu div {position:relative;}
#sn_menu_right #sn_menu div::before {content:""; display:block; width:1px; height:calc(100% - 20px); background:#790; position:absolute; left:5px; top:0;}
#sn_menu_right #sn_menu div p {text-indent:15px; position:relative;}
#sn_menu_right #sn_menu div p::before {content:""; display:block; width:8px; height:1px; background:#790; position:absolute; left:5px; top:19px;}
#sn_menu_right #sn_menu div div::before {left:20px;}
#sn_menu_right #sn_menu div div p {text-indent:30px;}
#sn_menu_right #sn_menu div div p::before {left:20px;}
#sn_menu_right #sn_menu div div div::before {left:35px;}
#sn_menu_right #sn_menu div div div p {text-indent:45px;}
#sn_menu_right #sn_menu div div div p::before {left:35px;}

input[id*="sn_menu"] {display:none;}

input[class*="ip00"]:checked ~ #wrapper {overflow:hidden;}
input[class*="ip00"]:checked ~ #sn_menu_icon {position:fixed;}
input[class*="ip00"]:checked ~ #sn_menu_icon .sn_menu_open .bar {background:transparent; transition:0s;}
input[class*="ip00"]:checked ~ #sn_menu_icon .sn_menu_open .bar::before {transform: rotate(45deg); width:18px; left:3px;}
input[class*="ip00"]:checked ~ #sn_menu_icon .sn_menu_open .bar::after {transform: rotate(-45deg); width:18px; left:3px;}
input[class*="ip00"]:checked ~ #sn_menu_icon .sn_menu_close {display:block;}

input[class*="ip00"]:checked ~ #sn_menu_panel {left:0; transition:0.5s;}

input[class*="ip01"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu01 + div > p,
input[class*="ip02"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu02 + div > p,
input[class*="ip03"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu03 + div > p,
input[class*="ip04"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu04 + div > p,
input[class*="ip05"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu05 + div > p,
input[class*="ip06"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu06 + div > p,
input[class*="ip07"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu07 + div > p,
input[class*="ip08"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu08 + div > p,
input[class*="ip09"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu09 + div > p,
input[class*="ip10"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu10 + div > p,
input[class*="ip11"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu11 + div > p {height:40px; opacity:1;}

#sn_menu01:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu01 > label:last-child,
#sn_menu02:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu02 > label:last-child,
#sn_menu03:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu03 > label:last-child,
#sn_menu04:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu04 > label:last-child,
#sn_menu05:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu05 > label:last-child,
#sn_menu06:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu06 > label:last-child,
#sn_menu07:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu07 > label:last-child,
#sn_menu08:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu08 > label:last-child,
#sn_menu09:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu09 > label:last-child,
#sn_menu10:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu10 > label:last-child,
#sn_menu11:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu11 > label:last-child {display:block;}

input[class*="ip01"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu01 > label,
input[class*="ip02"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu02 > label,
input[class*="ip03"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu03 > label,
input[class*="ip04"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu04 > label,
input[class*="ip05"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu05 > label,
input[class*="ip06"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu06 > label,
input[class*="ip07"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu07 > label,
input[class*="ip08"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu08 > label,
input[class*="ip09"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu09 > label,
input[class*="ip10"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu10 > label,
input[class*="ip11"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu11 > label {color:#790;}

input[class*="ip01"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu01 > label::after,
input[class*="ip02"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu02 > label::after,
input[class*="ip03"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu03 > label::after,
input[class*="ip04"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu04 > label::after,
input[class*="ip05"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu05 > label::after,
input[class*="ip06"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu06 > label::after,
input[class*="ip07"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu07 > label::after,
input[class*="ip08"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu08 > label::after,
input[class*="ip09"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu09 > label::after,
input[class*="ip10"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu10 > label::after,
input[class*="ip11"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu11 > label::after {transform:rotate(45deg); border-color:#790;}


@media only screen and (max-width:740px) {
#sn_menu_icon {display:block; width:41px; height:41px; position:fixed; right:22px; top:22px; z-index:100020;}
}

@media only screen and (max-width: 640px) {
#header #sn_menu_icon {right:15px;}
#sn_menu_right #sn_menu {min-width:260px; margin:0 auto;}
#sn_menu_panel #sn_menu_left {width:0; display:none;}
#sn_menu_panel #sn_menu_right {width:100%; min-width:320px;}
}
@media only screen and (max-width: 480px) {
#sn_menu_right #sn_menu {margin:0 0 0 10px;}
}