@charset "UTF-8";
.vhs-back {
  background-color: #00275a;
  color: #FFF;
}
.vhs-back a {
  color: #FFF;
}
.vhs-back.light {
  background-color: #b3bfcd;
}
body .vhs-light a {
  color: #00447B;
}
.vhs-back-dark {
  background-color: #001c41;
  color: #FFF;
}
.spot-image-back {
  background-repeat: no-repeat;
  background-position: center;
}
.backlight {
  background: #CCC;
}
.link {
  color: #00275a;
}
[data-href] {
  cursor: pointer;
}
.vcenter {
  display: inline-block;
  vertical-align: middle;
  float: none;
}
.noicon {
  font-family: "Open Sans", sans-serif;
}
ul.options {
  margin: 10px 0;
  padding: 0 0 0 0;
  list-style: none;
}
ul.options li a:before {
  content: "\f138";
  padding: 0 6px 0 0;
  font-family: FontAwesome;
}
ul.options li a.more:before {
  content: "\f13a";
}
ul.options li a.less:before {
  content: "\f139";
}
ul.options.inline li {
  display: inline-block;
  padding: 0 10px 0 0;
}
.more:before {
  content: "\f138";
  padding: 0 6px 0 0;
  font-family: FontAwesome;
}
.more-down:before {
  content: "\f13a";
  padding: 0 6px 0 0;
  font-family: FontAwesome;
}
.message {
  margin: 20px 0;
  padding: 10px;
  border: 1px solid #CCC;
  background: none;
  color: #CCC;
  font-size: 12px;
  text-align: center;
}
a.message {
  display: block;
}
a.message.success {
  background: #66ac1d;
  color: #FFF;
  font-weight: bold;
  border-radius: 4px;
}
.message.success {
  border-color: #66ac1d;
  color: #66ac1d;
}
.message.warning {
  border-color: #db964b;
  color: #db964b;
}
.message.warning h3 {
  color: #db964b;
}
.message.error {
  border-color: red;
  color: red;
}
body {
  color: #333333;
  font-family: 'Open Sans', sans-serif;
}
body #postRegBannerBody {
  margin-bottom: 20px;
}
a,
a:hover,
a:active {
  color: #00447B;
  text-decoration: none;
}
.bluebg {
  background-color: #00447b;
}
.greenbg {
  background-color: #77bb49;
}
.lightgrey	a {
  color: #a8b5c5;
}
.darkblue a {
  color: #00447b;
}
.blueopacity {
  height: 245px;
  margin-top: 5px;
  padding: 0 15px;
  background: rgba(0,68,128,0.5);
  position: relative;
}
.thumbnail {
  background: none;
}
.white {
  color: #fff;
}
.teasergross,
.teaserklein {
  height: 130px;
  margin-top: 25px;
}
.teasergross span.teaser,
.teaserklein span.teaser {
  display: block;
  position: absolute;
  background: rgba(0,68,123,0.5);
  height: 130px;
  width: 47%;
  padding-top: 100px;
  padding-right: 75px;
  padding-left: 10px;
  margin-right: 13px;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
}
.list-none ul li {
  list-style: none;
}
a.toggle i {
  color: #00447B;
}
.link:before {
  content: "\f138";
  padding: 0 6px 0 0;
  font-family: FontAwesome;
}
.whitefont a {
  color: #fff;
  text-decoration: none;
}
.hilfe a {
  color: #00447B;
  text-decoration: none;
}
.teasergross a,
.teaserklein a {
  display: block;
  height: 130px;
  background-position: center center;
  background-size: cover;
}
.teasergross i,
.teaserklein i {
  position: absolute;
  left: 45%;
  top: 100px;
  color: #fff;
  font-size: 16px;
}
.t01 {
  background: url(//www.vhs-bonn.de/tpl/css/../images/montage.jpg) center center no-repeat;
}
.logo img {
  height: auto;
  width: 100%;
}
.head {
  background: rgba(255,255,255,0.85);
  position: relative;
  z-index: 8;
  padding-bottom: 10px;
}
.headback {
  min-height: 300px;
  max-width: 1200px;
  background-size: cover;
  margin: 0 auto;
}
.navigation li a {
  display: block;
  margin-top: 0px;
  text-decoration: none;
  text-align: center;
  font-weight: 700;
  color: #00447B;
}
h1 {
  font-family: 'Oswald', sans-serif;
  font-size: 42px;
  color: #00447b;
  text-transform: uppercase;
  font-weight: 700;
}
h3,
p > i > b,
p > b > i {
  font-family: 'Oswald', sans-serif;
  font-size: 22px;
  color: #00447b;
  font-style: normal;
  font-weight: 500;
  line-height: 1.1;
  margin-top: 20px;
  margin-bottom: 10px;
}
h2 {
  font-family: 'oswald', sans-serif;
  color: #4a4a4a;
}
ul {
  list-style: square;
  color: #00447b;
}
.warenkorb {
  height: 39px;
}
.warenkorb a {
  margin-top: 10px;
  display: block;
}
.block {
  display: block;
}
.content p {
  color: #333333;
}
.content a,
td {
  color: #00447B;
}
.tr1 {
  height: 65px;
  background-color: #e5ecf2;
  color: #00447B;
}
ul.navigation {
  text-align: center;
  background: rgba(255,255,255,0.75);
}
.borderbottom {
  border-bottom: solid 10px rgba(0,68,123,0.5);
}
.teasergross,
.teaserklein {
  background-size: cover;
}
td,
th {
  padding: 10px;
}
.bold {
  font-weight: 700;
}
.center {
  text-align: center;
}
.blue {
  color: #00447b;
  font-size: 12px;
}
.auto-suggest {
  position: absolute;
  z-index: 10000;
  top: 33px;
  margin: 0 0 0 0;
  padding: 0;
  background: rgba(255,255,255,0.95);
  -webkit-box-shadow: 0 5px 15px rgba(0,0,0,0.6);
}
.cat-search .auto-suggest {
  top: 80px;
}
.quicksearch .auto-suggest {
  top: 55px;
}
.banner-quicksearch .auto-suggest {
  top: 32px;
}
.auto-suggest li {
  display: block;
  margin: 0;
  padding: 0;
}
.auto-suggest li a {
  display: block;
  margin: 0 0 0 0;
  padding: 3px 10px;
  border-top: 1px solid #CCC;
  text-align: left;
  color: #666;
  text-shadow: 0 1px 1px #FFF;
}
.auto-suggest li a:hover,
.auto-suggest li.active a {
  background: #50647d;
  color: #FFF;
  text-shadow: 0 1px 1px #999;
}
.whitefont,
.whitefont a,
.whitefont a:hover,
.whitefont a:active,
.whitefont b a,
.whitefont b a:hover,
.whitefont b a:active {
  color: #fff;
}
.headline span.subtitle {
  display: inline-block;
  color: #fff;
  font-size: 24px;
  padding: 5px;
  text-transform: uppercase;
}
h1 .headline::after {
  content: " ";
  display: table;
}
.blueopacity ul {
  padding: 0px;
}
.blueopacity ul li a {
  padding: 7px 0;
}
.blueopacity ul li {
  list-style: none;
}
div.headline {
  padding-top: 260px;
  text-align: right;
}
.headbottom .headline h1 {
  display: inline-block;
  text-transform: uppercase;
  color: #fff;
  font-size: 32px;
  padding: 3px 0;
  font-weight: 400;
}
.headbottom .headline h1 span.headline {
  line-height: 42px;
  display: table;
}
.tr2 {
  height: 65px;
  background-color: #edf2f6;
  color: #00447B;
}
.pagesearch .input-group {
  margin-top: 20px;
}
.pagesearch .input-group-addon {
  padding-top: 5px;
  cursor: pointer;
}
.formsearch {
  padding-top: 5px;
  padding-bottom: 5px;
  margin-top: 0;
  margin-bottom: 10px;
  border: 1px solid #cad2dd;
  border-radius: 0;
  -webkit-box-shadow: 0;
  box-shadow: 0;
  transition: 0;
  background: rgba(255,255,255,0.5);
}
.formsearchwhite {
  padding-top: 5px;
  padding-bottom: 5px;
  margin-top: 20px;
  margin-bottom: 10px;
  border: 1px solid #fff;
  border-radius: 0;
  webkit-box-shadow: 0;
  box-shadow: 0;
  transition: 0;
}
.searchfield a {
  display: block;
  color: #fff;
  font-weight: 700;
}
.hilfe {
  background-color: #fff;
  display: block;
  width: auto;
  height: 35px;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  color: #00447B;
  z-index: 101;
}
.align-right {
  text-align: right;
}
.align-center {
  text-align: center;
}
.searchfield {
  margin-top: 18px;
  height: 250px;
  display: none;
}
body ul.navigation {
  height: 245px;
  margin: 0 0 0 0;
  padding: 0;
  background: rgba(255,255,255,0.8);
}
body ul.navigation li {
  float: left;
  display: block;
  width: 33.333%;
  max-width: 33.333%;
  margin: 0 0 10px 0;
  padding: 0;
  border-right: 1px solid transparent;
  height: auto;
}
.navigation li a {
  height: 75px;
  padding-top: 15px;
  font-size: 12px;
}
.width75 {
  max-width: 75%;
  height: auto;
}
.footer .blue {
  margin-top: 20px;
}
body .navigation li a:hover {
  border-width: 0 0 15px 0;
}
body .navigation li a.active {
  color: #FFF;
}
.navigation li.n1 a {
  border-bottom: #f6ba00 solid 7px;
}
.navigation li.n1 a.active {
  background-color: #f6ba00;
}
.navigation li.n2 a {
  border-bottom: #ea8000 solid 7px;
}
.navigation li.n2 a.active {
  background-color: #ea8000;
}
.navigation li.n3 a {
  border-bottom: #e20e22 solid 7px;
}
.navigation li.n3 a.active {
  background-color: #e20e22;
}
.navigation li.n4 a {
  border-bottom: #b50456 solid 7px;
}
.navigation li.n4 a.active {
  background-color: #b50456;
}
.navigation li.n5 a {
  border-bottom: #7e318c solid 7px;
}
.navigation li.n5 a.active {
  background-color: #7e318c;
}
.navigation li.n6 a {
  border-bottom: #2962ae solid 7px;
}
.navigation li.n6 a.active {
  background-color: #2962ae;
}
.navigation li.n7 a {
  border-bottom: #008aa3 solid 7px;
}
.navigation li.n7 a.active {
  background-color: #008aa3;
}
.navigation li.n8 a {
  border-bottom: #00a373 solid 7px;
}
.navigation li.n8 a.active {
  background-color: #00a373;
}
.navigation li.n9 a {
  border-bottom: #77bb49 solid 7px;
}
.navigation li.n9 a.active {
  background-color: #77bb49;
}
h2.n1.program,
p.n1.program {
  color: #f6ba00;
}
h2.n2.program,
p.n2.program {
  color: #ea8000;
}
h2.n3.program,
p.n3.program {
  color: #e20e22;
}
h2.n4.program,
p.n4.program {
  color: #b50456;
}
h2.n5.program,
p.n5.program {
  color: #7e318c;
}
h2.n6.program,
p.n6.program {
  color: #2962ae;
}
h2.n7.program,
p.n7.program {
  color: #008aa3;
}
h2.n8.program,
p.n8.program {
  color: #00a373;
}
h2.n9.program,
p.n9.program {
  color: #77bb49;
}
.footer a {
  color: #00447B;
}
ul.navigation li {
  max-width: 25%;
  white-space: normal;
  padding-left: 0;
  padding-right: 0;
  height: 65px;
  margin-right: 5px;
}
input[type='text'] {
  font-family: 'Open Sans', monospace;
}
input#catQ {
  font-family: 'Open Sans', monospace;
}
table tbody tr,
.backlight {
  background: #e5ecf2;
}
table tbody tr:nth-child(even) td {
  background: #edf2f6;
}
table,
tr,
.event-data tr {
  border-top: solid #fff 3px;
  width: 100%;
}
table tbody tr.hovered td,
table tbody tr.hovered td a {
  background-color: #00447b;
  color: #fff;
  text-decoration: none;
  cursor: pointer;
}
.subtitle {
  display: block;
  font-weight: 300;
  font-style: italic;
}
a.button,
.message {
  display: block;
  padding: 15px;
  text-align: center;
  background-color: #00447B;
  color: #fff;
  font-weight: 600;
  margin-bottom: 10px;
}
div.col.col-sm-2.cat-head.logo,
a.arrow.arrow-right,
a.arrow.arrow-left {
  display: none;
}
.success {
  background-color: #77bb49;
}
.warning {
  background-color: #f6ba00;
}
.failure {
  background-color: #e20e22;
}
.breadcrumb {
  background-color: #fff;
}
table.event-data td {
  padding: 13px;
}
body .lecturer blockquote {
  font-size: 13px;
  text-align: left;
}
.marginbottom80 {
  margin-bottom: 80px;
}
.marginbottom40 {
  margin-bottom: 40px;
}
.marginbottom20 {
  margin-bottom: 20px;
}
.margintop80 {
  margin-top: 80px;
}
.margintop40 {
  margin-top: 40px;
}
.margintop20 {
  margin-top: 20px;
}
.paddingtop40 {
  padding-top: 40px;
}
.paddingtop80 {
  padding-top: 80px;
}
.paddingtop20 {
  padding-top: 20px;
}
.paddingbottom40 {
  padding-bottom: 40px;
}
.paddingbottom80 {
  padding-bottom: 80px;
}
.paddingbottom65 {
  padding-bottom: 65px;
}
.paddingbottom20 {
  padding-bottom: 20px;
}
.xthumb {
  max-width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .teaserklein span.teaser {
    width: 92%;
    font-size: 14px;
  }
  .teasergross span {
    left: 50%;
    width: 48%;
  }
  .teasergross i,
  .teaserklein i {
    left: auto;
    right: 20px;
  }
  .teaserklein span.teaser {
    left: 0;
    padding: 0;
    display: block;
    position: absolute;
    bottom: 0px;
    height: 34px;
    font-weight: 600;
    font-size: 12px;
    margin-left: 15px;
    padding-left: 10px;
    padding-top: 3px;
    color: #fff;
    width: 345px;
  }
  body ul.navigation {
    height: 170px;
  }
  ul.navigation li a {
    height: 50px;
  }
  .teasergross span.teaser {
    left: 51%;
  }
}
@media screen and (min-width: 992px) {
  body.grid {
    background: center top url(//www.vhs-bonn.de/tpl/css/../images/grid-md.png);
  }
  .teasergross span.teaser,
  .teaserklein span.teaser {
    font-size: 14px;
    padding-right: 60px;
  }
  .teasergross span.teaser {
    width: 228px;
    left: 50%;
  }
  .teaserklein span.teaser {
    width: 212.5px;
  }
  .teasergross i,
  .teaserklein i {
    font-size: 24px;
  }
  .warenkorb {
    height: 39px;
  }
  .hilfe {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    background-color: #00447B;
    color: #fff;
    position: fixed;
    display: block;
    top: 355px;
    left: -108px;
    width: 250px;
    height: 35px;
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    z-index: 101;
  }
  .navigation li a {
    padding-left: 0px;
    padding-right: 0px;
    font-size: 12px;
    height: 82px;
  }
  .headbottom {
    padding-top: 194px;
  }
  ul.navigation {
    background: rgba(255,255,255,0.75);
    height: 92px;
  }
  body ul.navigation li {
    width: 12.5%;
    margin: 0;
    float: left;
    display: table-row;
  }
  body ul.navigation {
    height: 80px;
    margin-bottom: 8px;
    box-sizing: content-box;
  }
  body ul.navigation li a {
    height: 80px;
    width: 150px;
    display: table-cell;
  }
  body ul.navigation li a:hover {
    height: 88px;
  }
  .hilfe {
    top: 314px;
    width: 262px;
    left: -114px;
  }
  div.headline {
    padding-top: 60px;
  }
  .searchfield {
    display: block;
  }
  .arbitrary {
    margin-top: -10px;
  }
}
@media screen and (min-width: 1200px) {
  body.grid {
    background: center top url(//www.vhs-bonn.de/tpl/css/../images/grid-lg.png) repeat-y;
  }
  .teaserklein span.teaser {
    display: block;
    position: absolute;
    bottom: 0px;
    height: 34px;
    font-weight: 600;
    font-size: 14px;
    color: #fff;
    width: 90%;
    padding-left: 10px;
    padding-top: 5px;
  }
  .teasergross span.teaser {
    display: block;
    position: absolute;
    left: 50%;
    height: 130px;
    width: 278px;
    padding-top: 100px;
    padding-right: 150px;
    padding-left: 10px;
    margin-right: 13px;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
  }
  .hilfe {
    top: 324px;
    left: -108px;
    width: 250px;
  }
  ul.navigation li a {
    height: 82px;
    font-size: 14px;
  }
  div.headline {
    padding-top: 100px;
  }
  body ul.navigation li a {
    padding: 4px;
    width: 200px;
    vertical-align: middle;
  }
  input.form-control.formsearchwhite {
    width: 100%;
  }
  body .emotional {
    margin-top: -217px;
  }
}
body .footer figure.element.ThumbnailElement img {
  max-width: 100%;
}
body .footer figure.element.ThumbnailElement {
  padding-right: 0px;
}
body #copy {
  background: #FFF;
}
body #copy .copy-content {
  color: #CCC;
}
body #copy .copy-content i {
  color: #CCC;
}
@media screen and (min-width: 768px) {
  .footer figure.element.ThumbnailElement {
    padding-right: 15px;
    max-width: 100%;
  }
  .footer figure.element.ThumbnailElement img {
    max-width: 100%;
  }
}
.vhs-cart-popdown .wrapper {
  background-color: #001c41;
}
.cookie-usgae {
  margin-bottom: 20px;
}
ul.topnavigation li a {
  -webkit-hyphens: none;
  -moz-hyphens: none;
  hyphens: none;
  white-space: nowrap;
}
.emotional-container {
  width: 100%;
  max-width: 1240px;
  height: 320px;
  margin: 0 auto -51px auto;
  background: #00275a;
}
.fullwidth .emotional-container {
  max-width: none;
}
.background.blue {
  margin-top: 90px;
  color: #fff;
  padding: 15px;
}
.emotional-container .background.blue .link {
  color: #fff;
  font-size: 14px;
  padding-left: 10px;
}
.emotional-container .background.blue .text {
  font-size: 20px;
  line-height: 26px;
}
.emotional-container .image {
  position: absolute;
  z-index: 1;
  height: 200px;
  width: 100%;
  background-size: cover;
  background-position: center;
  -webkit-animation: animatedBackground 10s ease-out 1;
  -moz-animation: animatedBackground 10s ease-out 1;
  animation: animatedBackground 10s ease-out 1;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
.noZoomEffect .emotional-container .image {
  -webkit-animation: none;
  -moz-animation: none;
  animation: none;
  -webkit-animation-fill-mode: none;
  animation-fill-mode: none;
}
.emotional-container .vhs-teaser-emotional {
  position: absolute;
  z-index: 5;
  overflow: hidden;
  width: 100%;
  max-width: 1240px;
  height: 320px;
  margin: 0 auto;
}
.fullwidth .emotional-container .vhs-teaser-emotional {
  max-width: none;
}
.editMode .emotional-container .vhs-teaser-emotional {
  overflow: visible;
}
.editMode .emotional-container .image {
  -webkit-animation: none;
  -moz-animation: none;
  animation: none;
  -webkit-animation-fill-mode: none;
  animation-fill-mode: none;
}
.vhs-teaser-emotional .content {
  position: absolute;
  z-index: 10;
  width: 100%;
  max-width: 1240px;
  height: 100%;
  background: center top url(//www.vhs-bonn.de/cms/plugins/VhsConnect/Teaser/templates/layout-2/public/css/../images/teaser-back-shadow.png) repeat-x;
}
.fullwidth .vhs-teaser-emotional .content {
  max-width: none;
}
.emotional-container .container {
  padding-top: 120px;
}
.emotional-container form {
  margin: 0;
  padding: 15px;
  height: 140px;
  background: rgba(0,0,0,0.4);
  color: #FFF;
  text-shadow: 0 1px 1px #000;
}
.emotional-container form h3 {
  margin: 0 0 20px 0;
  padding: 0;
  color: #FFF;
  font-size: 18px;
  font-weight: bold;
  text-align: left;
}
.emotional-container form input {
  position: relative;
  z-index: 10px;
  height: 30px;
  width: 100%;
  padding: 0 80px 0 10px;
  border: none;
  background: #FFF;
  color: #333;
}
.emotional-container form input:focus {
  outline: none;
}
.emotional-container form button {
  float: right;
  position: relative;
  z-index: 11px;
  width: 70px;
  height: 30px;
  margin: -30px 0 0 0;
  padding: 0;
  background: #b2b2b2;
  font-size: 12px;
  font-weight: bold;
  line-height: 30px;
  text-align: center;
}
.emotional-container form ul.menu {
  margin: 10px 0 0 0;
  padding: 0;
  list-style: none;
}
.emotional-container form ul.menu li {
  display: inline-block;
  margin: 0 15px 0 0;
}
.emotional-container form ul.menu li a {
  color: #FFF;
}
@media screen and (min-width: 992px) {
  .emotional-container .text {
    background: #00275a;
  }
}
.emotional-container .text {
  padding: 0 10px;
  display: inline-block;
  color: #FFF;
  font-size: 36px;
  line-height: 40px;
  font-family: "Open Sans Condensed", sans-serif;
  font-weight: 700;
}
.emotional-container .link {
  display: block;
  padding: 15px 0 0 0;
  font-size: 17px;
  font-weight: bold;
  text-shadow: 0 0 5px rgba(255,255,255,0.5);
}
.emotional-container .pagina {
  position: absolute;
  z-index: 20;
  display: block;
  background: none;
  width: 100%;
  max-width: 1240px;
  margin: 270px 0 0 0;
  padding: 0;
  list-style: none;
  text-align: center;
}
.fullwidth .emotional-container .pagina {
  max-width: none;
}
.emotional-container .pagina li {
  display: inline-block;
  margin: 0 6px;
}
.emotional-container .pagina li a {
  border: none;
  background: none;
  font-size: 24px;
  color: #FFF;
  text-shadow: 0 0 7px rgba(0,0,0,0.5);
}
div.overflow {
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .emotional-container .background.blue .text {
    font-size: 24px;
  }
}
@media screen and (min-width: 992px) {
  .emotional-container,
  .emotional-container .vhs-teaser-emotional,
  .emotional-container .image {
    height: 320px;
  }
  .emotional-container .background.blue .link {
    font-size: 17px;
  }
  .emotional-container .background.blue .text {
    font-size: 36px;
  }
  .emotional-container .text {
    color: #fff;
  }
}
@media screen and (min-width: 1200px) {
  .emotional-container form ul.menu {
    margin-top: 20px;
  }
}
@media screen and (max-width: 992px) {
  .emotional-container .pagina i {
    font-size: 12px;
  }
  .emotional-container .text {
    line-height: 48px;
  }
  @-webkit-keyframes animatedBackground {
    0% {
      -webkit-transform: scale(1,1);
      -moz-transform: scale(1,1);
      -ms-transform: scale(1,1);
      -o-transform: scale(1,1);
      transform: scale(1,1);
    }
    100% {
      -webkit-transform: scale(1.1,1.1);
      -moz-transform: scale(1.1,1.1);
      -ms-transform: scale(1.1,1.1);
      -o-transform: scale(1.1,1.1);
      transform: scale(1.1,1.1);
    }
  }
  @-moz-keyframes animatedBackground {
    0% {
      -webkit-transform: scale(1,1);
      -moz-transform: scale(1,1);
      -ms-transform: scale(1,1);
      -o-transform: scale(1,1);
      transform: scale(1,1);
    }
    100% {
      -webkit-transform: scale(1.1,1.1);
      -moz-transform: scale(1.1,1.1);
      -ms-transform: scale(1.1,1.1);
      -o-transform: scale(1.1,1.1);
      transform: scale(1.1,1.1);
    }
  }
  @keyframes animatedBackground {
    0% {
      -webkit-transform: scale(1,1);
      -moz-transform: scale(1,1);
      -ms-transform: scale(1,1);
      -o-transform: scale(1,1);
      transform: scale(1,1);
    }
    100% {
      -webkit-transform: scale(1.1,1.1);
      -moz-transform: scale(1.1,1.1);
      -ms-transform: scale(1.1,1.1);
      -o-transform: scale(1.1,1.1);
      transform: scale(1.1,1.1);
    }
  }
}
@media screen and (max-width: 768px) {
  .emotional-container .background.blue .text {
    color: #fff !important;
    background: transparent;
  }
}
.article {
  padding-top: 40px;
}
.article .teaser {
  font-weight: bold;
}
.article span.image {
  background-size: cover;
  border-radius: 100%;
}
.article span.image img {
  width: 100%;
  height: auto;
  border-radius: 100%;
}
.article h1 {
  margin: 0;
  padding: 0;
  text-align: left;
}
a.load-more-button {
  display: block;
  text-align: center;
}
a.load-more-button span {
  display: inline-block;
  padding: 6px 25px;
  background: #6cb1e1;
  border-radius: 5px;
  color: #FFF;
}
a.load-more-button-mobile {
  display: block;
  text-align: center;
}
a.load-more-button-mobile span {
  display: inline-block;
  padding: 6px 25px;
  background: #6cb1e1;
  border-radius: 5px;
  color: #FFF;
}
table tr th.course-stateIcon {
  width: 60px;
}
table tr th.course-startDate {
  width: 190px;
}
table tr .tooltip-aside,
table tr.hovered .tooltip-aside {
  width: 130px;
  position: absolute;
  display: inline-block;
  margin: 0 0 0 -160px;
  padding: 2px 6px;
  background: #EEE;
  border-radius: 4px;
  color: #999;
  text-shadow: none;
  font-size: 12px;
  transition: .5s;
}
table tr .tooltip-aside em {
  display: block;
  font-style: normal;
  font-size: 10px;
}
table tr .tooltip-aside:hover {
  background: #CCC;
  color: #FFF;
}
.vhsCourseTableListing .table.vhs.events thead tr th.course-additionalInfoIcon {
  min-width: 38px;
}
.vhsCourseTableListing .table.vhs.events tbody tr .startTime,
.vhsCourseTableListing .table.vhs.events tbody tr .numberOfDates,
.vhsCourseTableListing .table.vhs.events tbody tr .venuesNameAndVenuesCity {
  white-space: nowrap;
}
.vhsCourseTableListing .table.vhs.events tbody tr td p span {
  display: block;
  margin-bottom: 10px;
}
.vhsCourseTableListing .table.vhs.events tbody tr td.additionalCourseInfo {
  white-space: normal;
}
table.vhs.events tr.first-row td {
  border-width: 3px 1px 1px 1px;
}
table.vhs.events tbody tr:first-of-type td {
  border-width: 1px !important;
}
table.vhs.events thead th a.toggle {
  float: right;
  color: #FFF;
}
table.vhs.events tbody td {
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
}
.vhs-course-filter {
  border: none;
  color: #FFF;
}
.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:hover,
.navbar-default .navbar-nav>.open>a:focus {
  background: #4a6687;
  color: #FFF;
}
.vhs-course-filter button {
  width: auto;
}
.vhs-course-filter ul.navbar-nav li.active>a {
  background: rgba(0,0,0,0.2);
}
.vhs-course-filter ul.navbar-nav li.active>a:hover {
  background: rgba(0,0,0,0.4);
}
#vhsSearchReceiver .vhs-course-filter ul li.dropdown.open a {
  color: #262626;
}
.vhs-course-filter ul li a i {
  color: #6cb1e1;
  padding-left: 6px;
}
.vhs-course-filter ul li a i.filter-check {
  color: #FFF;
  padding-left: 0;
  padding-right: 6px;
}
.vhs-course-filter ul.quicksearch {
  margin-left: -21px;
}
.vhs-course-filter ul li span input {
  margin-right: 6px;
}
.vhs-course-filter .navbar-brand.vhs-pager {
  margin-top: -5px;
}
.vhs-course-filter .navbar-brand.vhs-pager i {
  margin: 0 4px;
  padding: 5px 10px;
  border: 1px solid rgba(255,255,255,0.4);
  border-radius: 4px;
}
.vhs-course-filter.navbar-default .navbar-brand {
  color: #FFF;
}
.vhs-course-filter.navbar-default .navbar-nav>li>a {
  color: #FFF;
}
.vhs-course-filter.navbar a:before {
  content: "";
  display: inline-block;
  padding: 0;
}
.vhs-course-filter input {
  background: #FFF;
  border: none;
  color: #666;
}
form.vhs-course-filter ul.page-switcher {
  margin: 0;
  padding: 0;
  list-style: none;
}
form.vhs-course-filter ul.page-switcher li {
  display: inline;
}
form.vhs-course-filter ul.page-switcher li a {
  display: inline-block;
  margin: 0 4px;
  padding: 5px 10px;
  border: 1px solid rgba(255,255,255,0.5);
  border-radius: 4px;
}
body .vhs-course-filter ul.dropdown-menu {
  background: #FFF !important;
}
form.courseTableRefresh a.refresh-now {
  color: orange;
  font-weight: bold;
}
ul.statiLengend {
  float: right;
  margin: 20px 0 0 0;
  padding: 0;
  list-style: none;
  text-align: right;
}
ul.statiLengend li {
  display: inline-block;
  padding: 0 0 0 20px;
  font-size: 12px;
  color: #999;
}
.pagination li a.active {
  color: #FFF;
  font-weight: bold;
}
ul.filter-drops {
  margin: -10px 0 0 0;
  padding: 0;
  list-style: none;
}
ul.filter-drops li {
  display: inline-block;
  margin: 0 20px 0 0;
}
ul.filter-drops li a {
  color: #AAA;
  font-size: .8em;
}
ul.filter-drops li a:before {
  content: "\f00d";
  padding: 0 6px 0 0;
  font-family: FontAwesome;
}
table span.subtitle {
  display: block;
  font-size: 0.9em;
}
.dropdown-menu>li>span {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #333;
  white-space: nowrap;
}
.submit-form {
  cursor: pointer;
}
ul.options-small {
  margin: 20px 0;
  padding: 0;
  list-style: none;
}
ul.options-small li {
  display: inline-block;
  padding: 0 30px 0 0;
}
ul.options-small li a {
  font-weight: bold;
  color: #AAA;
}
ul.options-small li a i {
  padding: 0 6px 0 0;
  font-size: 20px;
}
table.vhs.events .additionalInfoIcon i.fa {
  margin: 0 -20px 0 -5px;
  font-size: 18px;
  color: #AAAAAA;
  padding: 8px;
}
table.vhs.events .additionalCourseInfoRow .additionalCourseInfo .dropup.portalCourses ul {
  width: 100%;
}
table.vhs.events .additionalCourseInfoRow .additionalCourseInfo .dropup.portalCourses ul li {
  padding: 2px 10px;
}
table.vhs.events .additionalCourseInfoRow .additionalCourseInfo .dropup.portalCourses ul li:hover {
  background-color: #286090;
  color: #fff;
}
table.vhs.events .additionalCourseInfoRow .additionalCourseInfo .dropup.portalCourses ul li a {
  color: inherit;
  padding: 4px;
  text-decoration: none;
  background-color: inherit;
}
table.vhs.events .additionalCourseInfoRow .additionalCourseInfo .dropup.portalCourses ul li a:hover {
  color: inherit;
  text-decoration: none;
  background-color: inherit;
}
table.vhs.events .additionalCourseInfoRow .additionalCourseInfo h3 .subtitle {
  display: block;
  font-size: 18px;
  color: #667e9c;
}
table.vhs.events .additionalCourseInfoRow .additionalCourseInfo .message.Bookable {
  color: #66ac1d;
  border-color: #66ac1d;
}
table.vhs.events .additionalCourseInfoRow .additionalCourseInfo .btn.active {
  background: #6cb1e1;
  box-shadow: none;
  color: #FFF;
  margin-top: 16px;
}
table.vhs.events .additionalCourseInfoRow .additionalCourseInfo .content-pre {
  font-weight: bold;
}
table.vhs.events .additionalCourseInfoRow .additionalCourseInfo table tbody tr td {
  border: none;
  border-bottom: 1px solid #CCC;
  background: none;
}
table.vhs.events .additionalCourseInfoRow .additionalCourseInfo table tbody tr:first-of-type td {
  border-top: 1px solid #CCC;
}
@media screen and (max-width: 767px) {
  .navbar-form-search-align {
    padding: 10px 22px !important;
  }
  .filter-btn {
    color: #fff !important;
    background-color: #00275a;
    border-color: #00275a;
    padding: 5px 5px;
  }
  .filter-btn-align {
    margin-bottom: 6px !important;
  }
}
@media screen and (min-width: 767px) and (max-width: 991px) {
  .navbar-search-box-align {
    margin-left: -16px;
  }
}
@media screen and (min-width: 992px) {
  .vhsCourseTableListing .table.vhs.events thead tr th.course-additionalInfoIcon {
    min-width: 28px;
  }
}
@media screen and (min-width: 1200px) {
  .vhsCourseTableListing .table.vhs.events thead tr th.course-additionalInfoIcon {
    min-width: unset;
    width: 40px;
  }
}
.vhsCourseTableListing .panel {
  padding: 10px;
  margin-bottom: 5px;
}
.vhsCourseTableListing .panel .panel-body,
.vhsCourseTableListing .panel .panel-heading,
.vhsCourseTableListing .panel .panel-footer {
  padding: 0;
}
.vhsCourseTableListing .panel .panel-heading {
  margin-bottom: 10px;
}
.vhsCourseTableListing .panel .panel-footer {
  border: none;
  background: none;
}
.vhsCourseTableListing .panel p {
  margin: 0;
}
.vhsCourseTableListing table.additionalCourseArea {
  margin: 0;
}
.mobile-tooltip-align {
  float: right;
  margin-right: 25px;
}
ul.links {
  margin: 40px 0;
  padding: 0;
  list-style: none;
  text-align: center;
}
ul.links li {
  display: inline-block;
  padding: 20px 20px;
}
ul.links li a span {
  display: block;
  margin-bottom: 10px;
  font-weight: 600;
}
ul.links li a em {
  display: inline-block;
  font-style: normal;
  color: #999;
  font-size: .75em;
}
ul.links {
  margin: 40px 0;
  padding: 0;
  list-style: none;
  text-align: center;
}
ul.links li {
  display: inline-block;
  padding: 20px 20px;
}
ul.links li a em {
  display: inline-block;
  font-style: normal;
  color: #999;
  font-size: .75em;
}
#copy {
  max-width: 1240px;
  margin: 0 auto;
  border-top: 1px solid #FFF;
  background: #00275a;
}
#copy .copy-content {
  padding-top: 20px;
  font-size: 11px;
}
#copy .copy-content .tools a {
  padding-right: 20px;
}
.fullwidth #copy {
  max-width: none;
}
#copy .copy-content,
#copy .copy-content a {
  color: #FFF;
  line-height: 20px;
}
#copy .logos {
  text-align: right;
}
#copy .logos a {
  display: block;
  height: 70px;
  margin: 0 0 0 30px;
  background: center right url("//www.vhs-bonn.de/cms/resources/private/partials/vhsInit/public/images/logo-item-positive.png") no-repeat;
  background-size: contain;
}
#copy .logos a span {
  display: none;
}
[data-href] {
  cursor: pointer;
}
#accessibility_settings {
  top: 20%;
  position: fixed;
}
#accessibility_settings button.btn {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
#accessibility_settings button.btn.active {
  background-color: #5cb85c;
  border-color: #5cb85c;
}
body .readspeaker_button {
  display: none;
}
body.readSpeaker .readspeaker_button {
  display: block;
}
body.dark-mode * {
  background-color: #303030 !important;
  color: #fff !important;
}
body.dark-mode * ul {
  background-color: unset !important;
}
body.dark-mode * ul li {
  background-color: unset !important;
}
body.dark-mode * ul li a {
  background-color: unset !important;
}
body.dark-mode * ul li a em {
  background-color: unset !important;
}
body.dark-mode * ul li a em span {
  background-color: unset !important;
}
body.dark-mode * .program span.logo img {
  background-color: unset !important;
}
body.dark-mode * .emotional-container .quicksearch-input,
body.dark-mode * .emotional-container .vhs-suggest.quicksearch button {
  border: 1px solid #b2bfcd !important;
}
body.dark-mode * .emotional-container .vhs-teaser-emotional .content .container {
  background-color: unset !important;
}
body.dark-mode * form.vhs.quicksearch.banner-quicksearch button {
  border: 1px solid #b2bfcd !important;
}
body.dark-mode * .vhs-base .message {
  border-color: #808080 !important;
}
body.dark-mode * input::placeholder {
  color: #fff !important;
}
body.dark-mode * form.search.vhs.quicksearch input {
  background-color: #fff !important;
  color: #000 !important;
}
body.dark-mode * form.search.vhs.quicksearch input::placeholder {
  color: #000 !important;
}
body.dark-mode * .vhs-base .btn.btn-default {
  border-color: #808080 !important;
}
body.dark-mode * .pagination>.active>a,
body.dark-mode * .pagination>.active>a:focus,
body.dark-mode * .pagination>.active>a:hover,
body.dark-mode * .pagination>.active>span,
body.dark-mode * .pagination>.active>span:focus,
body.dark-mode * .pagination>.active>span:hover {
  border-color: #808080 !important;
}
@media screen and (min-width: 768px) {
  body.grid {
    background: center top url(images/grid-sm.png);
  }
}
@media screen and (min-width: 992px) {
  body.grid {
    background: center top url(images/grid-md.png);
  }
}
@media screen and (min-width: 1200px) {
  body.grid {
    background: center top url(images/grid-lg.png) repeat-y;
  }
}
i.coursestate {
  font-size: 18px;
  color: #bfbfbf;
}
.tooltip {
  -webkit-hyphens: none !important;
  -moz-hyphens: none !important;
  -ms-hyphens: none !important;
  hyphens: none !important;
}
.message {
  margin: 20px 0;
  padding: 10px;
  border: 1px solid #AAA;
  background: none;
  color: #AAA;
  font-size: 12px;
  text-align: center;
}
a.message {
  display: block;
}
a.message.success {
  background: #66ac1d;
  color: #FFF;
  font-weight: bold;
  border-radius: 4px;
}
.message.success {
  border-color: #66ac1d;
  color: #66ac1d;
}
.message.warning {
  border-color: #db964b;
  color: #db964b;
}
.message.warning h3 {
  color: #db964b;
}
.message.error {
  border-color: red;
  color: red;
}
.vhsconnect.frame {
  margin: 50px 0 -51px 0;
  padding: 50px 0 50px 0;
}
.vhsconnect.panelframe {
  margin: 50px 0 -51px 0;
  padding: 50px 0 50px 0;
  border-top: 1px solid #CCC;
  border-bottom: 1px solid #CCC;
}
.modal-content h4 {
  text-align: left;
}
.modal-content button {
  width: auto;
}
.modal-content .btn-block {
  width: 100%;
  margin: 20px 0;
}
.vhs-base .message {
  margin: 20px 0;
  padding: 10px;
  border-color: #6cb1e1;
  border-width: 2px;
  background: #FFF;
  color: #6cb1e1;
  text-align: center;
}
.vhs-base .message.error {
  border-color: #eb3b50;
  color: #eb3b50;
}
.vhs-base .message.success {
  border-color: #66ac1d;
  color: #66ac1d;
}
.vhs-base .message.warning {
  border-color: #db964b;
  color: #db964b;
}
.vhs-base .message.light {
  border-color: #AAA;
  color: #AAA;
}
.vhs-base .message.disabled {
  border-color: #CCC !important;
  color: #CCC !important;
}
.vhs-base .input-group-addon {
  width: 45px;
}
.vhs-base .input-group {
  width: 100%;
}
.vhs-base form[data-submitted="send"] button.btn.btn-default {
  border-color: #CCC;
  background: #FFF;
  color: #CCC;
}
.vhs-base .btn.btn-default {
  width: auto;
  padding: 5px 40px;
  border-color: #00275a;
  border-width: 2px;
  transition-duration: .5s;
  transition-timing-function: ease;
  transition-delay: 0s;
  color: inherit;
  white-space: normal;
}
.vhs-base .btn.btn-default.btn-xs {
  padding: 1px 5px;
}
.vhs-base .btn.btn-default:hover {
  background: #00275a;
  border-color: #00275a;
  color: #FFF;
}
.vhs-base .btn.btn-block {
  width: 100%;
  padding: 5px 0;
}
.vhs-base .btn.btn-light {
  border-color: #CCC;
  color: #CCC;
}
.vhs-base .btn.active {
  background: #6cb1e1;
  box-shadow: none;
  color: #FFF;
}
.vhs-base button.loading {
  color: red;
}
.vhs-button-inline {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 5px;
  background: #6cb1e1;
  color: #FFF !important;
}
.vhs-button-inline:hover {
  background: #67a1c8;
  color: #FFF;
}