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

.container {
    width: auto;
    margin:0 auto;
    padding: 4px;
	background-position: -155px 0;
}

.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;}
.pull-1, .pull-2, .pull-3, .pull-4, .pull-5, .pull-6, .pull-7, .pull-8, .pull-9, .pull-10, .pull-11, .pull-12, .pull-13, .pull-14, .pull-15, .pull-16, .pull-17, .pull-18, .pull-19, .pull-20, .pull-21, .pull-22, .pull-23, .pull-24, .pull-25 {margin-right: 0;}
.push-1, .push-2, .push-3, .push-4, .push-5, .push-6, .push-7, .push-8, .push-9, .push-10, .push-11, .push-12, .push-13, .push-14, .push-15, .push-16, .push-17, .push-18, .push-19, .push-20, .push-21, .push-22, .push-23, .push-24, .push-25 {margin-left: 0;}

div.mob-span-1, div.mob-span-2, div.mob-span-3, div.mob-span-4, div.mob-span-5, div.mob-span-6, div.mob-span-7, div.mob-span-8, div.mob-span-9, div.mob-span-10 {float:left;margin-right: 4px;}

div.mob-last {margin-right:0;}
.mob-span-1  { width: calc(10% - 4px); }
.mob-span-2  { width: calc(20% - 4px); }
.mob-span-3  { width: calc(30% - 4px); }
.mob-span-4  { width: calc(40% - 4px); }
.mob-span-5  { width: calc(50% - 4px); }
.mob-span-6  { width: calc(60% - 4px); }
.mob-span-7  { width: calc(70% - 4px); }
.mob-span-8  { width: calc(80% - 4px); }
.mob-span-9  { width: calc(90% - 4px); }
.mob-span-10, div.mob-span-10 { width: 100%; margin: 0; }

.mob-last.mob-span-1  { width: 10%;}
.mob-last.mob-span-2  { width: 20%;}
.mob-last.mob-span-3  { width: 30%;}
.mob-last.mob-span-4  { width: 40%;}
.mob-last.mob-span-5  { width: 50%;}
.mob-last.mob-span-6  { width: 60%;}
.mob-last.mob-span-7  { width: 70%;}
.mob-last.mob-span-8  { width: 80%;}
.mob-last.mob-span-9  { width: 90%;}

.mob-append-1  { padding-right: calc(10% - 4px);}
.mob-append-2  { padding-right: calc(20% - 4px);}
.mob-append-3  { padding-right: calc(30% - 4px);}
.mob-append-4  { padding-right: calc(40% - 4px);}
.mob-append-5  { padding-right: calc(50% - 4px);}
.mob-append-6  { padding-right: calc(60% - 4px);}
.mob-append-7  { padding-right: calc(70% - 4px);}
.mob-append-8  { padding-right: calc(80% - 4px);}
.mob-append-9  { padding-right: calc(90% - 4px);}

.mob-prepend-1  { padding-left: calc(10% - 4px);}
.mob-prepend-2  { padding-left: calc(20% - 4px);}
.mob-prepend-3  { padding-left: calc(30% - 4px);}
.mob-prepend-4  { padding-left: calc(40% - 4px);}
.mob-prepend-5  { padding-left: calc(50% - 4px);}
.mob-prepend-6  { padding-left: calc(60% - 4px);}
.mob-prepend-7  { padding-left: calc(70% - 4px);}
.mob-prepend-8  { padding-left: calc(80% - 4px);}
.mob-prepend-9  { padding-left: calc(90% - 4px);}

.mob-push-1  { margin-left: 10%;}
.mob-push-2  { margin-left: 20%;}
.mob-push-3  { margin-left: 30%;}
.mob-push-4  { margin-left: 40%;}
.mob-push-5  { margin-left: 50%;}
.mob-push-6  { margin-left: 60%;}
.mob-push-7  { margin-left: 70%;}
.mob-push-8  { margin-left: 80%;}
.mob-push-9  { margin-left: 90%;}

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;
}
.mob-h-auto {
    height: auto;   
}

.mob-img img {
    width: 100%;
    height: auto;
}

.mob-top-4 {
    margin-top: 4px !important;
}
.mob-top-8 {
    margin-top: 8px !important;
}

body {
  /* Without this, the body has excess horizontal scroll when the menu is open */
  overflow-x: hidden;
}


/* 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;
    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);
    margin: 0;
}
.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: -35px;
    padding: 0;
    height: 100%;
    position: relative;
    width: 16.66666667%;
    z-index: 3000;
    
    height: 55px;
}
.drawer-contents {
    background-color: #ffffff;
    height: 100%;
    width: 100%;
    overflow: auto;
    z-index: 5000;
}
.drawer-right .drawer-controls {
    float: left;
    margin-left: -60px;
    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: #ffffff; /* 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%;
}
/* schrein */
.dw-edition {
    width: 159px;
}
.fold.dw-edition {
    margin-left: -159px;
}
.drawer-right.fold.dw-edition {
    margin-right: -159px;
}

.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(213,16,48,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(213,16,48,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(213,16,48,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(213,16,48,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;
    top: 10px;
}

.c-top {
    background-color: rgba(213,16,48,0.7);
    color: white;
    height: 55px;
    width: 55px;
    display: block;
    position: absolute;
    top: 70px;
}
.c-top .material-icons {
    font-size: 55px;
}
#scrollUp {
    display: none;
}
#hamburger span {
    font-size: 0;
}

/* dao */
/*img {
    max-width: 100%;
    height: auto;
}*/
/* form */
.pifa-field-lbl {
    display: block;
    width: auto;
    text-align: left;
}
.pifa-field-2 .pifa-field-lbl {
    float: left;    
}
.pifa-field-17.full-row .pifa-field-lbl,
.pifa-field-5.full-row .pifa-field-lbl {
    width: 100%;
    text-align: left;
    font-weight: bold;
    margin-top: 30px;
    margin-bottom: 10px;
}
.pifa-field-5.full-row {
    margin-bottom: 10px;
}
.pifa-field-5.full-row .pifa-field-lbl {
    font-size: 10px;
    line-height: 1.5em;
    color: #FF6600;
    text-transform: normal;
    margin: 10px 0 0 0;
    text-align: left;
}
.pifa-field-5.full-row .checkbox_wrapper {
    padding-left: 10px;
    margin: 5px 0;
}
.checkbox_wrapper input {
    float: left;
}
.checkbox_wrapper label {
    margin-left: 10px;
    display: inline-block;
    width: 80%;
}
.pifa-field-14.half-row {
    padding-left: 0;
    float: none;
    width: 100%;
}
.full-row {
    width: 100%;    
}
input[type=text], input[type=password], input[type=url], input[type=email], input.text, input.title, textarea, select {
    max-width: 95%;
}
/* edition */
p, li, td, th, address, nobr, form {
    font-size: 1rem;
}
.logo {
    font-size: 1.4em;
}
.social-media img {
    height: 25px;
    width: auto;
}
.drawer-contents {
    padding-top: 72px;
}
.pleft4,
.pleft8,
.pleft10,
.pleft20,
.pleft40,
.pleft80,
.pleft120,
.pleft160,
.pleft200,
.pleft240,
.pleft280,
.pleft312,
.pleft320,
.pleft360,
.pleft400 {padding-left:8px;}

.textfeld-news,
.textfeld-newslinks {
    padding: 4px 0;
}
.news-artikel,
.news-artikel.h192 {
    margin-top: 8px;
    height: auto;
    min-height: 100px;
}
.news-start .news-artikel.h192 {
    margin-top: 0;
    height: 192px;
}
.news-index:first-child .news-artikel {
    margin-top: 0;
}
h1 {
    font-size: 1.7em;
}
.buch-content {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.buch-content .buch-bild {
    order: 0;
}
.buch-content .buch-text {
    order: 2;
}
.buch-content .buch-meta {
    order: 1;
}
.vorschau-content {
    margin-bottom: 8px;
}
.mob-kontakt-content {
    padding: 4px 8px 4px 8px;
}
.logo-title {
	position: absolute;
    left: 80px;
    top: 24px;
}
.h192.kuenstler-artikel {
	height: auto;	
}