@font-face {
  font-family: 'icomoon-ultimate';
  src: url('fonts/icomoon-ultimate.eot');
  src: url('fonts/icomoon-ultimate.eot?#iefix') format('embedded-opentype'), url('fonts/icomoon-ultimate.woff') format('woff'), url('fonts/icomoon-ultimate.ttf') format('truetype'), url('fonts/icomoon-ultimate.svg#icomoon-ultimate') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'scotch';
  src: url('fonts/scotchmicro-regular-webfont.eot');
  src: url('fonts/scotchmicro-regular-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/scotchmicro-regular-webfont.woff') format('woff'), url('fonts/scotchmicro-regular-webfont.ttf') format('truetype'), url('fonts/scotchmicro-regular-webfont.svg#scotchmicro-regular-webfont') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Use the following CSS code if you want to use data attributes for inserting your icons */
[data-icon]:before {
  font-family: 'icomoon-ultimate';
  content: attr(data-icon);
  speak: none;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
}
/* Use the following CSS code if you want to have a class per icon */
/*
Instead of a list of all class selectors,
you can use the generic selector below, but it's slower:
[class*="icon-"] {
*/
.icon,
.icon-images,
.icon-film,
.icon-mic,
.icon-library,
.icon-graduation,
.icon-file,
.icon-cc,
.icon-tag,
.icon-ticket,
.icon-cart,
.icon-phone,
.icon-location,
.icon-clock,
.icon-calendar,
.icon-mobile,
.icon-screen,
.icon-tablet,
.icon-user,
.icon-spinner,
.icon-search,
.icon-cog,
.icon-car,
.icon-airplane,
.icon-menu,
.icon-link,
.icon-eye,
.icon-spotlight,
.icon-bookmark,
.icon-star,
.icon-star-2,
.icon-question,
.icon-cancel-circle,
.icon-checkmark-circle,
.icon-info,
.icon-enter,
.icon-exit,
.icon-arrow-up,
.icon-arrow-right,
.icon-arrow-down,
.icon-arrow-left,
.icon-checkbox,
.icon-checkbox-unchecked,
.icon-checkbox-partial,
.icon-facebook,
.icon-twitter,
.icon-google-plus,
.icon-youtube,
.icon-book,
.icon-film-2,
.icon-pushpin,
.icon-search-2,
.icon-tree,
.icon-eye-2,
.icon-eye-3,
.icon-filter,
.icon-filter-2,
.icon-share {
  font-family: 'icomoon-ultimate';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
}
.icon-images:before {
  content: "\21";
}
.icon-film:before {
  content: "\22";
}
.icon-mic:before {
  content: "\23";
}
.icon-library:before {
  content: "\24";
}
.icon-graduation:before {
  content: "\25";
}
.icon-file:before {
  content: "\26";
}
.icon-cc:before {
  content: "\27";
}
.icon-tag:before {
  content: "\28";
}
.icon-ticket:before {
  content: "\29";
}
.icon-cart:before {
  content: "\2a";
}
.icon-phone:before {
  content: "\2b";
}
.icon-location:before {
  content: "\2c";
}
.icon-clock:before {
  content: "\2d";
}
.icon-calendar:before {
  content: "\2e";
}
.icon-mobile:before {
  content: "\2f";
}
.icon-screen:before {
  content: "\30";
}
.icon-tablet:before {
  content: "\31";
}
.icon-user:before {
  content: "\32";
}
.icon-spinner:before {
  content: "\33";
}
.icon-search:before {
  content: "\34";
}
.icon-cog:before {
  content: "\35";
}
.icon-car:before {
  content: "\36";
}
.icon-airplane:before {
  content: "\37";
}
.icon-menu:before {
  content: "\38";
}
.icon-link:before {
  content: "\39";
}
.icon-eye:before {
  content: "\3a";
}
.icon-spotlight:before {
  content: "\3b";
}
.icon-bookmark:before {
  content: "\3c";
}
.icon-star:before {
  content: "\3d";
}
.icon-star-2:before {
  content: "\3e";
}
.icon-question:before {
  content: "\3f";
}
.icon-cancel-circle:before {
  content: "\40";
}
.icon-checkmark-circle:before {
  content: "\41";
}
.icon-info:before {
  content: "\42";
}
.icon-enter:before {
  content: "\43";
}
.icon-exit:before {
  content: "\44";
}
.icon-arrow-up:before {
  content: "\45";
}
.icon-arrow-right:before {
  content: "\46";
}
.icon-arrow-down:before {
  content: "\47";
}
.icon-arrow-left:before {
  content: "\48";
}
.icon-checkbox:before {
  content: "\49";
}
.icon-checkbox-unchecked:before {
  content: "\4a";
}
.icon-checkbox-partial:before {
  content: "\4b";
}
.icon-facebook:before {
  content: "\4c";
}
.icon-twitter:before {
  content: "\4d";
}
.icon-google-plus:before {
  content: "\4e";
}
.icon-youtube:before {
  content: "\4f";
}
.icon-book:before {
  content: "\50";
}
.icon-film-2:before {
  content: "\51";
}
.icon-pushpin:before {
  content: "\52";
}
.icon-search-2:before {
  content: "\53";
}
.icon-tree:before {
  content: "\54";
}
.icon-eye-2:before {
  content: "\57";
}
.icon-eye-3:before {
  content: "\58";
}
.icon-filter:before {
  content: "\55";
}
.icon-filter-2:before {
  content: "\56";
}
.icon-share:before {
  content: "\59";
}
/**************
Mixins
**************/
/**************
General
**************/
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
body {
  font-weight: normal;
}
h1,
h2,
h3,
h4,
h5 {
  font-weight: normal;
  font-family: 'scotch', serif;
}
.btn {
  height: 48px;
  display: inline-block;
  line-height: 48px !important;
  text-align: center;
  color: white;
  font-size: 32px;
  background-color: #ff7850;
  -webkit-appearance: none;
  padding: 0px;
  border: none;
  box-shadow: none;
}
.btn:focus,
.btn:active {
  outline: none;
}
.btn-icon {
  width: 48px;
}
.btn-inverse {
  color: #ff7850;
  background-color: white;
}
a {
  color: black;
}
/**************
Grids
**************/
.grid-row {
  overflow: hidden;
}
.grid-row > div {
  float: left;
}
.half {
  width: 50%;
}
/**************
Listen
**************/
.spielplan-filter {
  position: relative;
  overflow: hidden;
}
#spielplan-liste .searchbox {
  -webkit-transform: translate3d(0, -58px, 0);
  -webkit-transition: all 0.3s ease-in;
  position: absolute;
  top: 10px;
  margin-bottom: 0;
}
#spielplan-liste .searchbox.visible {
  -webkit-transform: translate3d(0, 0, 0);
}
.searchbox {
  width: 100%;
  background-color: white;
  border: 1px solid #ff7850;
  padding: 0 48px;
  height: 48px;
  line-height: 48px;
  z-index: 10;
  margin-bottom: 10px;
}
.searchbox .search {
  -webkit-appearance: none;
  box-shadow: none;
  border-radius: none;
  border: none;
}
.searchbox .search:active,
.searchbox .search:focus {
  outline: none;
}
.searchbox:after {
  font-family: 'icomoon-ultimate';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  position: absolute;
  top: 8px;
  left: 8px;
  height: 32px;
  line-height: 32px;
  width: 32px;
  content: "\34";
  z-index: 10;
  font-size: 32px;
  color: #969696;
}
.searchbox .close-search:before {
  font-family: 'icomoon-ultimate';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  display: block;
  position: absolute;
  top: 8px;
  right: 8px;
  height: 32px;
  line-height: 32px;
  width: 32px;
  content: "\40";
  z-index: 11;
  font-size: 32px;
  color: #ff7850;
}
ul.linkList li {
  border: 1px solid #ff7850 !important;
  margin-bottom: 10px;
  padding: 10px;
  position: relative;
  overflow: hidden;
}
ul.linkList li > a {
  display: block;
}
.list li {
  border: 1px solid #ff7850 !important;
  margin-bottom: 10px;
  padding: 10px;
  position: relative;
  overflow: hidden;
}
.list li > a {
  display: block;
}
.list li header {
  text-transform: uppercase;
  color: #ff7850;
  font-size: 16px;
  font-family: 'scotch', serif;
}
.list li header small {
  margin-left: 1em;
  font-size: 13px;
  color: #969696;
  text-transform: none;
  font-family: 'Arial', sans-serif;
}
.list li .meta {
  margin-top: 10px;
}
.list li .meta .highlight {
  color: #ff7850;
  text-transform: uppercase;
}
.list li article {
  padding-top: 10px;
}
.list li article h3 {
  text-transform: uppercase;
}
.list li .actions {
  display: block;
  overflow: hidden;
  float: right;
  position: relative;
  right: -10px;
  bottom: -10px;
}
.list li .actions a {
  display: block;
  float: left;
  margin-left: 1px;
}
.list li.news-preview article {
  padding: 0;
}
.list li.news-preview article h3 {
  padding-bottom: 10px;
}
/**************
Loader
**************/
@-webkit-keyframes loading {
  0% {
    -webkit-transform: rotateZ(0deg);
  }
  100% {
    -webkit-transform: rotateZ(360deg);
  }
}
.loader {
  text-align: center;
  width: 100%;
}
.loader .loader-icon {
  -webkit-animation: loading 1s infinite linear;
  display: block;
  width: 100%;
  height: 36px;
  margin-bottom: 12px;
}
.loader .loader-icon:before {
  font-family: 'icomoon-ultimate';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  content: "\33";
  display: block;
  margin: 25px auto;
  width: 36px;
  height: 36px;
  line-height: 36px;
  font-size: 36px;
}
/**************
Header
**************/
#app .bar-title {
  background-color: white;
  background-image: none;
  border: none;
  box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.5);
  color: black;
}
#app .bar-title h1.title {
  color: black;
  text-shadow: none;
  font-family: 'scotch', serif;
  text-transform: uppercase;
}
#app .bar-title h1.title img {
  position: relative;
  top: 7px;
}
#app .bar-title a.button {
  top: 0px;
  width: 54px;
  height: 54px;
  font-size: 32px;
  line-height: 54px;
  padding: 0;
  border: none;
  color: black;
  background: transparent;
  text-shadow: none;
}
#app .bar-title a.button:focus,
#app .bar-title a.button:active {
  box-shadow: none;
}
#app .bar-title a.button:first-child {
  position: absolute;
  left: 0px;
}
#app .bar-title a.button:last-child {
  right: 0px;
}
#app .bar-title a.button-icon {
  font-family: 'icomoon-ultimate';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  line-height: 54px;
}
/**********************************
Maps
**********************************/
.maps-overlay {
  position: absolute;
  top: 0;
  display: block;
  margin: 10px;
  width: 300px;
}
button#geoLoc {
  width: 48px;
  height: 48px;
  line-height: 48px;
  background-color: #ffffff;
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
  -webkit-transform: translateZ(0);
  z-index: 100000;
  border: none;
}
button#geoLoc:hover,
button#geoLoc:focus,
button#geoLoc:active {
  background-color: white;
}
.geoResult {
  clear: both;
  display: none;
  background-color: #ffffff;
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
  -webkit-transform: translateZ(0);
  z-index: 100000;
  border: none;
  margin-right: 0px;
  margin-left: 0px;
  min-height: 120px;
  width: 100%;
  position: absolute;
  top: 0px;
}
.geoResult #closeGeoResult {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 40px;
  height: 40px;
  line-height: 40px;
  border: none;
  background-color: transparent;
  box-shadow: none;
  -webkit-appearance: none;
  border-radius: none;
}
.geoResult #closeGeoResult h3 {
  font-size: 16px;
}
.geoResult .geoResultContent {
  text-shadow: none;
  padding: 1.5em;
  color: black;
}
/**************
Quick Buttons
**************/
.home-content {
  position: absolute;
  bottom: 0px;
  width: 100%;
}
.quick-btns {
  padding: 5px;
  box-shadow: 0px -1px 5px rgba(0, 0, 0, 0.5);
  background-color: white;
  position: relative;
  z-index: 10;
}
.quick-btns .quick-btn {
  display: block;
  margin: 5px;
  padding: 10px;
  background-color: #ff7850;
  color: white;
  text-align: center;
  text-transform: uppercase;
  font-family: 'scotch', serif;
}
.quick-btns .quick-btn .icon {
  display: block;
  font-size: 32px;
  margin-bottom: 10px;
}
#service .quick-btns {
  box-shadow: none;
  margin-top: 20px;
}
/**************
Event Single
**************/
.event-single .spielplan-link {
  display: block;
  padding: 10px;
  border: 1px solid #ff7850;
  margin-bottom: 10px;
}
.event-single em {
  padding-left: 10px;
  display: block;
  margin-top: 10px;
  border-left: 2px solid #ff7850;
}
.event-single .inhalt {
  margin: 10px 0;
  padding: 10px;
  border: 1px solid #ff7850;
}
.event-single .inhalt .inhalt-trigger {
  color: #ff7850;
  font-weight: bold;
  display: block;
}
.event-single .inhalt .inhalt-content {
  display: none;
}
.event-single .inhalt .inhalt-content.activ {
  display: block;
}
.event-single .besetzung {
  margin: 10px 0;
  padding: 10px;
  border: 1px solid #ff7850;
}
.event-single .besetzung .besetzung-trigger {
  color: #ff7850;
  font-weight: bold;
  display: block;
}
.event-single .besetzung .besetzung-content {
  display: none;
}
.event-single .besetzung .besetzung-content.activ {
  display: block;
}
.event-single .termine .termin {
  margin: 10px 0;
}
.content-marged {
  margin: 10px;
}
/**************
Sidr Menu
**************/
#app {
  -webkit-transition: all ease-in 0.3s;
  -moz-transition: all ease-in 0.3s;
  -o-transition: all ease-in 0.3s;
  -ms-transition: all ease-in 0.3s;
  transition: all ease-in 0.3s;
  box-shadow: 0px -2px 10px rgba(0, 0, 0, 0.2);
  position: relative;
  z-index: 2;
  border-radius: 4px;
  overflow: hidden;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
}
#sidr {
  position: fixed;
  top: 0;
  left: 0;
  min-height: 100%;
  z-index: 1;
  max-width: 100%;
  overflow-x: none;
  background-color: #313131;
  color: black;
  width: 280px;
  font-weight: bold;
  -webkit-transition: all ease-in 0.3s;
  -moz-transition: all ease-in 0.3s;
  -o-transition: all ease-in 0.3s;
  -ms-transition: all ease-in 0.3s;
  transition: all ease-in 0.3s;
  -webkit-transform: translate3d(-280px, 0, 0);
}
#sidr ul,
#sidr li {
  padding: 0;
  margin: 0;
}
#sidr a {
  color: rgba(255, 255, 255, 0.8);
  padding-left: 19px;
  line-height: 43px;
  display: block;
  font-size: 16px;
  text-decoration: none;
}
#sidr a:focus {
  background-color: black;
  color: white;
  border-color: black;
}
#sidr li {
  line-height: auto;
  height: auto;
  display: block;
  border-bottom: 1px solid rgba(0, 0, 0, 0.6);
  box-shadow: 0 1px 0px rgba(255, 255, 255, 0.1);
  padding-right: 44px;
  font-family: 'scotch', serif;
  font-weight: normal;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.9);
}
#sidr li.divider {
  padding-left: 19px;
  height: 10px;
  text-transform: uppercase;
  font-size: 10px;
  background-color: #363636;
  color: white;
  box-shadow: 0 1px 0px rgba(255, 255, 255, 0.1), inset 0 1px 0px rgba(255, 255, 255, 0.1);
}
#sidr li.current {
  border-left: 3px solid #ff7850;
}
#sidr li.profile {
  padding: 8px 19px;
}
#sidr.activ {
  -webkit-transform: translate3d(0, 0, 0);
}
#sidr .social-icons {
  position: absolute;
  bottom: 10px;
  padding-left: 0;
  margin-right: 10px;
}
#sidr .social-icons a {
  display: inline-block;
  font-size: 32px;
}
#sidr .social-icons .yt-icon {
  font-size: 46px;
  position: relative;
  top: 6px;
}
.select-container {
  display: inline-block;
  width: 160px;
  border: 1px solid #ff7850;
  border-radius: 0;
  -webkit-appearance: none;
  background: transparent;
  background-color: white;
  box-shadow: none;
  height: 48px;
  line-height: 48px;
  padding-left: 10px;
  position: relative;
}
.select-container select {
  opacity: 0;
  position: absolute;
  display: inline-block;
  width: 160px;
  border: 1px solid #ff7850;
  border-radius: 0;
  -webkit-appearance: none;
  background: transparent;
  background-color: white;
  box-shadow: none;
  height: 48px;
  padding-top: 10px;
  top: 0px;
  left: 0px;
  z-index: 3;
}
.select-container:focus,
.select-container:active {
  outline: none;
}
.select-container:after {
  font-family: 'icomoon-ultimate';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  display: block;
  position: absolute;
  right: 10px;
  top: 0px;
  height: 48px;
  line-height: 48px;
  width: 32px;
  font-size: 16px;
  color: #ff7850;
  text-align: center;
  z-index: 3;
  content: "\47";
}
/**************
Spielplan
**************/
.spielplan-filter {
  padding: 10px 0;
  overflow: hidden;
}
.spielplan-filter select {
  display: inline-block;
}
.spielplan-filter button {
  display: block;
  float: right;
  margin-left: 1px;
}
/**************
Home
**************/
.new-image {
  background-image: url('../img/news_image.jpg');
  background-size: cover;
  height: 400px;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
}
.new-container {
  background-color: white;
  padding-bottom: 10px;
  position: relative;
}
.new-container .new-heading,
.new-container .new-body {
  padding: 10px;
  border-bottom: 1px solid #ff7850;
}
.new-container .new-heading {
  font-family: 'scotch', serif;
  text-transform: uppercase;
  padding-top: 0;
  padding-bottom: 5px;
  font-size: 16px;
}
.new-container .new-body {
  padding-right: 58px;
  margin-bottom: 0;
  font-size: 12px;
}
.new-container .read-more {
  position: absolute;
  right: 10px;
  bottom: 10px;
}
.text-page h2 {
  margin-bottom: 20px;
}
.text-page h3 {
  margin-top: 10px;
  margin-bottom: 10px;
}
hr {
  margin: 10px 0;
  border: none;
  border-bottom: 1px solid #646464;
}
.content-padded h3 {
  margin-bottom: 20px;
}
/**************
Forms
**************/
.hcheckbox {
  border-bottom: 1px solid #646464;
  height: 48px;
  line-height: 48px;
}
.hcheckbox:first-child {
  border-top: 1px solid #646464;
}
input[type="checkbox"] {
  display: none;
}
input[type="checkbox"] + label {
  cursor: pointer;
  height: 48px;
  line-height: 48px;
  display: block;
  margin-bottom: 2em;
  text-align: left;
}
input[type="checkbox"] + label:before {
  font-family: 'icomoon-ultimate';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  content: "\4a";
  width: 32px;
  height: 32px;
  display: block;
  line-height: 48px;
  float: left;
  font-size: 32px;
  margin-right: 10px;
  position: relative;
  top: -3px;
}
input[type="checkbox"]:checked + label:before {
  content: "\49";
  color: #ff7850;
}
/**************
Panoramen
**************/
.pano-overlay {
  width: 90%;
  height: 90%;
  background-color: white;
  padding: 20px;
  color: black;
  position: absolute;
  top: 5%;
  left: 5%;
  z-index: 100;
  box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.6);
  font-size: 12px;
  -webkit-transition: all 0.6s ease-out;
  -webkit-transform: translate3d(-150%, 0, 0);
}
.pano-overlay h2 {
  font-size: 16px;
  line-height: 21px;
  color: #ff7850;
  border-bottom: 1px solid #ff7850;
  margin-bottom: 20px;
}
.pano-overlay h3 {
  margin: 10px 0px;
}
.pano-overlay.active {
  -webkit-transform: translate3d(0, 0, 0);
}
.pano-close {
  position: absolute;
  top: 10px;
  right: 10px;
  height: 32px;
  width: 32px;
  display: block;
  cursor: pointer;
  color: #ff7850;
}
.pano-close:before {
  content: 'X';
  display: block;
  font-size: 24px;
  text-align: center;
  width: 32px;
  height: 32px;
  line-height: 32px;
}
