/* typography.css */
body {
    font-size:      small;
    color:          #000;
	padding: 0;
}
h1 {
    font-size: 1.4em;
    margin: 0;
}
h2 {
    font-size: 1.2em;
    margin: 0;
}
h3 {
    font-size: 1.1em;
    margin: 0;
    padding: 0;
}
h4 {
    font-size: 1.2em;
    margin: 0;
}
h5 {
    font-size: 1.0em;
    margin: 0;
}
h6 {
    font-size: 1.0em;
    margin: 0;
}

a {
    color: #013299;
}

.mob-first {margin-left:0;padding-left:0;}
.mob-last {margin-right:0;padding-right:0;}

.container {
    width: auto;
    margin:0 auto;
}
.content {
    padding: 0 10px;
}

.column, .span-1, .span-2, .span-3, .span-4, .span-5, .span-6, .span-7, .span-8, .span-9, .span-10, .span-11, .span-12, .span-13, .span-14, .span-15, .span-16, .span-17, .span-18, .span-19, .span-20, .span-21, .span-22, .span-23, .span-24, .span-25 {width: auto;padding: 0;}
.first.span-1, .first.span-2, .first.span-3, .first.span-4, .first.span-5, .first.span-6, .first.span-7, .first.span-8, .first.span-9, .first.span-10, .first.span-11, .first.span-12, .first.span-13, .first.span-14, .first.span-15, .first.span-16, .first.span-17, .first.span-18, .first.span-19, .first.span-20, .first.span-21, .first.span-22, .first.span-23, .first.span-24, .first.span-25 {width: inherit;}

div.mob-span-1, div.mob-span-2, div.mob-span-3, div.mob-span-4, div.mob-span-5, div.mob-span-6 {float:left;margin-right: 1%;}

div.mob-last {margin-right:0;}
.mob-span-1  { width: 15.6% !important;}
.mob-span-2  { width: 32.3% !important;}
.mob-span-3  { width: 49.0% !important;}
.mob-span-4  { width: 65.6% !important;}
.mob-span-5  { width: 82.3% !important;}
.mob-span-6, div.mob-span-6 { width: 100% !important; margin: 0; }

.mob-last.mob-span-1  { width: 16.6%;}
.mob-last.mob-span-2  { width: 33.3%;}
.mob-last.mob-span-3  { width: 50.0%;}
.mob-last.mob-span-4  { width: 66.6%;}
.mob-last.mob-span-5  { width: 83.3%;}

.mob-append-1  { padding-right: 15.6%;}
.mob-append-2  { padding-right: 32.3%;}
.mob-append-3  { padding-right: 49.0%;}
.mob-append-4  { padding-right: 65.6%;}
.mob-append-5  { padding-right: 82.3%;}

.mob-prepend-1  { padding-left: 15.6%;}
.mob-prepend-2  { padding-left: 32.3%;}
.mob-prepend-3  { padding-left: 49.0%;}
.mob-prepend-4  { padding-left: 65.6%;}
.mob-prepend-5  { padding-left: 82.3%;}

hr {background:#ddd;color:#ddd;clear:both;float:none;width:100%;height:.1em;margin:0 0 1.45em;border:none;}
hr.space {background:#fff;color:#fff;}
.clearfix:after, .container:after {content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix, .container {display:inline-block;}
* html .clearfix, * html .container {height:1%;}
.clearfix, .container {display:block;}
.clear {clear:both;}
.mob-none,
.mob-hide{
    display: none;
}
.mob-view,
.mob-show{
    display: block;
}

/* drawer */
.drawer-controls,
.drawer-heading,
.drawer-body,
.drawer-footer {
    display: block;
}

html {
    min-height: 100%;
    height: 100%;
}
body.has-drawer {
    min-height: 100%;
    height: 100%;
}
.has-inner-drawer {
    position: relative;
    overflow: hidden;
}
.drawer {
    display: block;
    background-color: #f8f8f8;
    color: #333333;
    border-right: 1px solid #dfdfdf;
    min-height: 1px;
    height: 100%;
    top: 0;
    left: 0;
    position: fixed;
    z-index: 2035;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}
.drawer-contents,
.drawer-heading,
.drawer-body,
.drawer-nav,
.drawer-footer,
.drawer ul,
.drawer li {
    display: inherit;
    margin: 0;
    width: 100%;
    position: relative;
}
.drawer-right {
    left: auto;
    right: 0;
    border-right: none;
    /*border-left: 1px solid #dfdfdf;*/
    -webkit-box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.05);
}
.drawer-inverse {
    background-color: #333;
    color: #eeeeee;
    border-right: 1px solid #1a1a1a;
}
.drawer-inverse.drawer-right {
    border-right: 1px solid #dfdfdf;
}
.drawer-inside {
    position: absolute;
}
.drawer-controls {
    float: right;
    margin-right: -16.66666667%;
    padding: 10px;
    height: 100%;
    position: relative;
    width: 16.66666667%;
    z-index: 3000;
}
.drawer-contents {
    background-color: #f8f8f8;
    height: 100%;
    width: 100%;
    overflow: auto;
	z-index: 5000;
}
.drawer-right .drawer-controls {
    float: left;
    margin-left: -70px;
    margin-right: 0;
}
.drawer-heading {
    border-bottom: 1px solid #dfdfdf;
    padding: 10px 15px;
    color: inherit;
}
.drawer-title {
    margin-top: 0;
    margin-bottom: 0;
}
.drawer-inner-toggle {
    position: absolute;
    top: 10px;
    right: 10px;
}
.drawer-body,
.drawer-nav {
    padding: 10px 15px;
}
.drawer-nav,
.drawer-fullnav {
    padding: 10px 15px;
    margin-bottom: 0;
    list-style: none;
}
.drawer-nav li,
.drawer-fullnav li {
    position: relative;
    margin-bottom: 5px;
}
.drawer-nav li a,
.drawer-fullnav li a {
    color: #777;
    border-radius: 4px;
    position: relative;
    display: block;
    padding: 10px 15px;
}
.drawer-nav li.active a,
.drawer-fullnav li.active a,
.drawer-nav li a:hover,
.drawer-fullnav li a:hover,
.drawer-nav li a:focus,
.drawer-fullnav li a:focus {
    color: #515151;
    text-decoration: none;
    background-color: transparent; /* changed from #ffffff*/
}
.drawer-fullnav {
    color: #fff;
    padding: 0;
}
.drawer-fullnav li {
    margin-bottom: 0;
}
.drawer-fullnav li a {
    border-radius: 0;
}
.drawer-inverse .drawer-contents {
    background-color: #333;
}
.drawer-inverse .drawer-fullnav li a,
.drawer-inverse .drawer-nav li a {
    color: #fff;
    padding: 10px 15px;
}
.drawer-inverse .drawer-fullnav li.active a,
.drawer-inverse .drawer-fullnav li a:hover,
.drawer-inverse .drawer-fullnav li a:active,
.drawer-inverse .drawer-nav li.active a,
.drawer-inverse .drawer-nav li a:hover,
.drawer-inverse .drawer-nav li a:active {
    color: #eeeeee;
    background-color: #1a1a1a;
}
.drawer-footer {
    padding: 10px 15px;
}
.drawer-footer.locked {
    position: absolute;
    bottom: 0;
    left: 0;
}
.dw-xs-12 {
    width: 100%;
}
.fold.dw-xs-12 {
    margin-left: -100%;
}
.drawer-right.fold.dw-xs-12 {
    margin-right: -100%;
}
.dw-xs-11 {
    width: 91.66666667%;
}
.fold.dw-xs-11 {
    margin-left: -91.66666667%;
}
.drawer-right.fold.dw-xs-11 {
    margin-right: -91.66666667%;
}
.dw-xs-10 {
    width: 83.33333333%;
}
.fold.dw-xs-10 {
    margin-left: -83.33333333%;
}
.drawer-right.fold.dw-xs-10 {
    margin-right: -83.33333333%;
}
.dw-xs-9 {
    width: 75%;
}
.fold.dw-xs-9 {
    margin-left: -75%;
}
.drawer-right.fold.dw-xs-9 {
    margin-right: -75%;
}
.dw-xs-8 {
    width: 66.66666667%;
}
.fold.dw-xs-8 {
    margin-left: -66.66666667%;
}
.drawer-right.fold.dw-xs-8 {
    margin-right: -66.66666667%;
}
.dw-xs-7 {
    width: 58.33333333%;
}
.fold.dw-xs-7 {
    margin-left: -58.33333333%;
}
.drawer-right.fold.dw-xs-7 {
    margin-right: -58.33333333%;
}
.dw-xs-6 {
    width: 50%;
}
.fold.dw-xs-6 {
    margin-left: -50%;
}
.drawer-right.fold.dw-xs-6 {
    margin-right: -50%;
}
.dw-xs-5 {
    width: 41.66666667%;
}
.fold.dw-xs-5 {
    margin-left: -41.66666667%;
}
.drawer-right.fold.dw-xs-5 {
    margin-right: -41.66666667%;
}
.dw-xs-4 {
    width: 33.33333333%;
}
.fold.dw-xs-4 {
    margin-left: -33.33333333%;
}
.drawer-right.fold.dw-xs-4 {
    margin-right: -33.33333333%;
}
.dw-xs-3 {
    width: 25%;
}
.fold.dw-xs-3 {
    margin-left: -25%;
}
.drawer-right.fold.dw-xs-3 {
    margin-right: -25%;
}
.dw-xs-2 {
    width: 16.66666667%;
}
.fold.dw-xs-2 {
    margin-left: -16.66666667%;
}
.drawer-right.fold.dw-xs-2 {
    margin-right: -16.66666667%;
}
.dw-xs-1 {
    width: 8.33333333%;
}
.fold.dw-xs-1 {
    margin-left: -8.33333333%;
}
.drawer-right.fold.dw-xs-1 {
    margin-right: -8.33333333%;
}

.fold {
    margin-right: 0;
}
.folding {
    height: 100%;
    -webkit-transition-property: margin-left;
    transition-property: margin-left;
    -webkit-transition-duration: 0.35s;
    transition-duration: 0.35s;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease;
}
.drawer-right.fold {
    margin-left: 0;
}
.drawer-right.folding {
    -webkit-transition-property: margin-right;
    transition-property: margin-right;
}
.fold.open,
.drawer-right.fold.open {
    margin-left: 0;
    margin-right: 0;
}


.drawer-right .drawer-controls {
    text-align: right;
}

/* hamburger-button */
/* -----------------------------------------------------------------------------
  HAMBURGER ICONS COMPONENT

----------------------------------------------------------------------------- */
/**
 * Toggle Switch Globals
 *
 * All switches should take on the class `c-hamburger` as well as their
 * variant that will give them unique properties. This class is an overview
 * class that acts as a reset for all versions of the icon.
 */
.c-hamburger {
    display: block;
    position: relative;
    overflow: hidden;
    margin: 0;
    padding: 0;
    width: 55px;
    height: 55px;
    font-size: 0;
    text-indent: -9999px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    box-shadow: none;
    border-radius: none;
    border: none;
    cursor: pointer;
    -webkit-transition: background 0.3s;
    transition: background 0.3s;
}

.c-hamburger:focus {
    outline: none;
}

.c-hamburger span {
    display: block;
    position: absolute;
    top: 25px;
    left: 8px;
    right: 8px;
    height: 5px;
    background: white;
}

.c-hamburger span::before,
.c-hamburger span::after {
    position: absolute;
    display: block;
    left: 0;
    width: 100%;
    height: 5px;
    background-color: #fff;
    content: "";
}

.c-hamburger span::before {
    top: -15px;
}

.c-hamburger span::after {
    bottom: -15px;
}

/**
 * Style 2
 *
 * Hamburger to "x" (htx). Takes on a hamburger shape, bars slide
 * down to center and transform into an "x".
 */
.c-hamburger--htx {
    background-color:  rgba(85,114,140,0.7);
}

.c-hamburger--htx span {
    -webkit-transition: background 0s 0.3s;
    transition: background 0s 0.3s;
}

.c-hamburger--htx span::before,
.c-hamburger--htx span::after {
    -webkit-transition-duration: 0.3s, 0.3s;
    transition-duration: 0.3s, 0.3s;
    -webkit-transition-delay: 0.3s, 0s;
    transition-delay: 0.3s, 0s;
}

.c-hamburger--htx span::before {
    -webkit-transition-property: top, -webkit-transform;
    transition-property: top, transform;
}

.c-hamburger--htx span::after {
    -webkit-transition-property: bottom, -webkit-transform;
    transition-property: bottom, transform;
}

/* active state, i.e. menu open */
.c-hamburger--htx.is-active {
    background-color:  rgba(85,114,140,0.7);
}

.c-hamburger--htx.is-active span {
    background: none;
}

.c-hamburger--htx.is-active span::before {
    top: 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.c-hamburger--htx.is-active span::after {
    bottom: 0;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.c-hamburger--htx.is-active span::before,
.c-hamburger--htx.is-active span::after {
    -webkit-transition-delay: 0s, 0.3s;
    transition-delay: 0s, 0.3s;
}

/**
 * Style 4
 *
 * Hamburger to right-arrow (htra). Hamburger menu transforms to a
 * right-pointing arrow. Usually indicates an off canvas menu sliding in from 
 * right that will be close on re-click of the icon.
 */
.c-hamburger--htra {
  background-color:  rgba(85,114,140,0.7);
}

.c-hamburger--htra span {
  -webkit-transition: -webkit-transform 0.3s;
          transition: transform 0.3s;
}

.c-hamburger--htra span::before {
  -webkit-transform-origin: top left;
      -ms-transform-origin: top left;
          transform-origin: top left;
  -webkit-transition: -webkit-transform 0.3s, width 0.3s, top 0.3s;
          transition: transform 0.3s, width 0.3s, top 0.3s;
}

.c-hamburger--htra span::after {
  -webkit-transform-origin: bottom left;
      -ms-transform-origin: bottom left;
          transform-origin: bottom left;
  -webkit-transition: -webkit-transform 0.3s, width 0.3s, bottom 0.3s;
          transition: transform 0.3s, width 0.3s, bottom 0.3s;
}

/* active state, i.e. menu open */
.c-hamburger--htra.is-active {
  background-color: rgba(85,114,140,1.0)
}

.c-hamburger--htra.is-active span {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}

.c-hamburger--htra.is-active span::before,
.c-hamburger--htra.is-active span::after {
  width: 50%;
}

.c-hamburger--htra.is-active span::before {
  top: 0;
  -webkit-transform: translateX(-2px) translateY(2px) rotate(-45deg);
      -ms-transform: translateX(-2px) translateY(2px) rotate(-45deg);
          transform: translateX(-2px) translateY(2px) rotate(-45deg);
}

.c-hamburger--htra.is-active span::after {
  bottom: 0;
  -webkit-transform: translateX(-2px) translateY(-2px) rotate(45deg);
      -ms-transform: translateX(-2px) translateY(-2px) rotate(45deg);
          transform: translateX(-2px) translateY(-2px) rotate(45deg);
}


/* changes to hamburger */
.c-hamburger {
    position: absolute;
    bottom: 10px;
}

.c-top {
    background-color: rgba(85,114,140,0.7);
    color: white;
    height: 55px;
    width: 55px;
    display: block;
    position: absolute;
    bottom: 70px;
}
.c-top .material-icons {
    font-size: 55px;
}
#scrollTop {
    display: none;
}
#hamburger span {
	font-size: 0;
}

/* reset */
#seitenbereich {
    position: inherit;
    left: auto;
    top: auto;
    width: 100%;
    margin: 0;
}
.logo {
	font-size: 1.5em;
	margin: 10px 0 10px 0;
}
.mob-bg {
	background-color: #55728c;
}
.bg,
.bgstart {
	background: none;	
}
.startseite ~ .main,
.zwei-spaltig{
    -moz-column-count: 1;
    -moz-column-gap: 0;
    -webkit-column-count: 1;
    -webkit-column-gap: 0;
    column-count: 1;
    column-gap: 0;
}
.top10 {
	margin-top: 10px !important;	
}
.mob-content .mob-span-6 {
	margin: 0 10px;
	width: calc(100% - 20px) !important;
}
.mob-content .content {
	padding: 0;
	width: 100%;
}
.h40,
.h140,
.h150 {
	height: auto;	
}
img {
	max-width: 100%;	
}
.mob-navigation {
	padding: 10px;	
}
.mob-navigation a.menulink,
.mob-navigation .weiss a,
.mob-navigation .nav-login label{
	color: #000;	
}