body{ font-family:'Roboto', sans-serif; color:#fff; background:#335d83; }

#main{ background-color:#335d83; }
#main a{ color:#fff; text-decoration:underline; }
#main a:hover,
#main a:active,
#main a:visited{ color:#fff; }

#main-inner{ padding-top:15px; padding-bottom:15px; text-align:center; }
#main-inner img{ max-width:400px; }

a.no-underline{ text-decoration:none !important; }
a.no-underline:hover,
a.no-underline:active,
a.no-underline:visited{ text-decoration:underline !important; }

.no-gutter, .no-padding{ padding-left:0; padding-right:0; }
.no-padding-left{ padding-left:0; }
.no-padding-right{ padding-right:0; }

.img-responsive-override,
.img-responsive-inline{ display:inline-block; height:auto; max-width:100%; }

h1{ margin-top:0; }
h2{ font-size:28px; margin-top:30px; }
h3{ font-size:24px; margin-top:30px; }
h4{ font-size:20px; margin-top:30px; }
h5{ font-size:16px; margin-top:30px; }
h6{ font-size:14px; margin-top:30px; }

.videowrapper{ float:none; clear:both; width:100%; position:relative; padding-bottom:56.25%; padding-top:25px; height:0; }
.videowrapper iframe{ position:absolute; top:0; left:0; width:100%; height:100%; }
.videowrapper-medium{ max-width:500px; }

.header{ background:#162949; }
.logo-gosa{ display:inline-block; margin:10px 10px 10px 0; }
.logo-gosa img{ height:60px; }
.logo-roadworks{ display:inline-block; margin:10px 10px 10px 0; }
.title-roadworks{ display:inline-block; margin:10px 10px 10px 0; font-size:1.2rem; vertical-align:bottom; }
.menu-toggler-container{ background:#162949; padding:15px; }

#sidebar{ background:#162949; height:100vh; }
#sidebar a{ text-decoration:none !important; }

#sidebar h2{ font-size:1rem; color:#fff; font-weight:bold; padding-left:25px; }

.menu{ margin:0; padding:0; border:0px solid #ccc; transition:border 0.3s, box-shadow 0.3s; }
.menu ul{ margin:0; padding:0; list-style-type:none; }
.menu a,
.menu a:visited{ display:block; color:#a6a6a6; padding:10px; transition:background 0.3s; }
.menu a:hover,
.menu a:active,
.menu a:focus{ background:#17263d; text-decoration:none; }
.menu .menu-glyph{ font-size:1rem; margin:0; float:right; }
.menu .menu-lable{ font-size:1rem; margin:0; display:inline-block; }

/* Accordion Menu (Quiccordion) */
#nav-side{ width:100%; color:#a6a6a6; background:#162949; padding:10px 0; border:0px solid #fff; display:block; }
#nav-side a{ display:block; background:#162949; color:#a6a6a6 !important; text-decoration:none; padding:8px 15px; border-bottom:0px solid #fff; font-size:1rem; font-weight:normal; line-height:1.5rem; cursor:pointer; }
#nav-side a:hover{ background:#17263d; color:#a6a6a6; }
#nav-side .tile-glyph{ display:inline-block; width:40px; font-size:34px; margin:0 10px; text-align:center; }
#nav-side .tile-lable{ display:inline-block; line-height:18px; }
#nav-side .has-children.closed a{ background:#162949; color:#a6a6a6; }
#nav-side .has-children.closed a:hover{ background:#17263d; color:#a6a6a6; }
#nav-side .has-children{}
#nav-side .has-children > a{ padding:8px 15px 8px 15px; }
#nav-side li.closed a{ border-bottom:0px solid #eee; background:#162949; }
#nav-side li.closed a:hover{ border-bottom:0px solid #eee; background:#17263d; }
#nav-side li ul{ padding:0; }
#nav-side li ul li a{ background:#162949; color:#a6a6a6; font-weight:normal; padding-left:30px; border-bottom:0px solid #fff; text-transform:capitalize; }
#nav-side li ul li a:hover{ background:#17263d; color:#a6a6a6; }
#nav-side li ul li.closed a{ background:#162949; color:#a6a6a6; font-weight:normal; border-bottom:0px solid #fff; }
#nav-side li ul li.closed a:hover{ background:#17263d; color:#a6a6a6; }
#nav-side li ul li ul li a{ padding-left:45px; }
#nav-side li ul li ul li ul li a{ padding-left:60px; }
#nav-side li ul li ul li ul li ul li a{ padding-left:75px; }
/* END Accordion Menu (Quiccordion) */

#nav-side ul{ display:none; }
#nav-side li{ position:relative; }
#nav-side .menu-glyph{ font-size:1rem; margin:0; background:#315779; /*float:right;*/ position:absolute; top:0; right:0; padding:8px 12px; cursor:pointer; }
#nav-side .menu-glyph:hover{ background:#17263d; }
#nav-side .menu-glyph .fas{ transition:.3s; }
#nav-side .menu-lable{ font-size:1rem; margin:0 15px 0 0; display:block; border-left:3px solid transparent; padding-left:8px; }
#nav-side li.current > a{ font-weight:normal; color:#fff !important; }
#nav-side li.current > a > .menu-lable,
#nav-side li.current > a:hover > .menu-lable{ border-left:3px solid #fff; }
#nav-side li > a:hover > .menu-lable{ border-left:3px solid transparent; }

@media screen and (max-width: 768px){
    .menu{ display:none; }
    #main-inner img{ max-width:300px; }
}