/* ####################################################### */
/* ####################### content ####################### */

table tr td {
  padding:               3px;
}
.toggle_container table {
  background:            #F2EFE8;
}

ol, ul {
  list-style:            none;
}
div.player {
  position:              relative;
  padding-top:           8px;
  padding-bottom:        16px;
  height:                92px;
  width:                 100%;
}
div.player-inside {
  position:              relative;
  background-image:      url(https://www.kowarik.at/kowarik/image/player_bg.gif);
  background-repeat:     repeat-x;
  height:                72px;
  width:                 100%;
  border:                1px solid #E4DCD0;
}
.player img {
  width:                 72px;
  height:                72px;
  position:              absolute;
  top:                   0;
  left:                  0;
}
.player h2 {
  text-decoration:       none;
  position:              absolute;
  left:                  80px;
  top:                   8px;
  color:                 #005fa0;
  font-size:             1em;
  font-weight:           700;
  margin:                0;
  padding:               0;
}
.player h2 a {
  text-decoration:       none;
  color:                 #015f9f;
}
.player span.play-info {
  position:              absolute;
  left:                  80px;
  top:                   35px;
  width:                 370px;
  color:                 #9d907f;
}
.audiojs {
  position:              absolute;
  left:                  0px;
  top:                   72px;
  width:                 100%;
}
.audiojs {
  height:                16px;
  background:            none;
  font-family:           monospace;
  font-size:             1em;
  box-shadow:            0px 0px 0px rgba(0, 0, 0, 0.3);
  border:                1px solid #E4DCD0;
}
.audiojs .scrubber {
  position:              relative;
  float:                 left;
  width:                 calc(100% - 220px);
  background-color:      #e8e1d7;
  border:                1px solid #E4DCD0;
  height:                6px;
  margin:                10px;
  border-left:           0px;
  border-bottom:         0px;
  overflow:              hidden;
  top:                   -5px;
}
.audiojs .play-pause {
  width:                 25px;
  height:                20px;
  padding-top:           0px;
  top:                   -6px;
  border-right:          1px solid #E4DCD0;
}
.audiojs .time {
  float:                 left;
  height:                25px;
  width:                 125px;
  padding-top:           0px;
  top:                   -11px;
  border-left:           1px solid #E4DCD0;
  text-shadow:           none;
  color:                 #9d907f;
}
.audiojs .time em {
  color:                 #9d907f;
}
.audiojs .loaded {
  background:            #E4DCD0;
}
.audiojs .progress {
  background:            #D8CCBC;
}

/* ####################################################### */

.text-with-image {
  position:              relative;
  height:                100%;
  margin:                auto;
  min-height:            2em;
  padding-bottom:        6px;
  clear:                 both;
}
.img-left {
  display:               inline;
  text-align:            left;
  float:                 left;
  width:                 152px;
  max-width:             152px;
  height:                100%;
  margin:                auto;
  padding:               0px;
  padding-bottom:        6px;
}
.img-right {
  vertical-align:        middle;
  display:               inline;
  text-align:            right;
  float:                 right;
  width:                 152px;
  max-width:             152px;
  height:                100%;
  margin:                auto;
  padding:               0px;
  padding-bottom:        6px;
}
.text-right {
  display:               inline;
  text-align:            left;
  float:                 right;
  width:                 calc(100% - 176px);
  height:                100%;
  margin:                auto;
  padding-right:         6px;
  padding-left:          12px;
  padding-bottom:        6px;
}
.text-left {
  display:               inline;
  text-align:            right;
  float:                 left;
  width:                 calc(100% - 176px);
  height:                100%;
  margin:                auto;
  padding-right:         12px;
  padding-left:          6px;
  padding-bottom:        6px;
}

.img-left img, .img-right img {
  max-width:             152px;
  width:                 100%;
}
@media screen and (max-width:480px) {
  .img-left {
    width:               30%;
  }
  .img-right {
    width:               30%;
    float:               left;
  }
  .text-right {
    width:               calc(70% - 38px);
    float:               left;
  }
  .text-left {
    width:               calc(70% - 28px);
  }
}

/* ####################################################### */

.inside h1 {
  color:                 #005fa0;
  font-size:             1.8em;
  font-weight:           400;
  padding:               12px;
}
.inside h3 {
  color:                 #005fa0;
  font-size:             1.2em;
  width:                 100%;
  padding-top:           12px;
}
.inside p {
  color:                 #1b1b1b;
  font-size:             1.0em;
  width:                 100%;
  padding-top:           12px;
  padding-bottom:        6px;
}
.inside p br.hide {
  margin:                0;
}

p.gray {
  color:                 #9c9080;
}

/* ####################################################### */
/* ####################### trigger ####################### */

.trigger img, .trigger-no-a img {
  max-width:             calc(100% - 18px);  
}
.trigger-no-a {
  width:                 calc(100% - 24px);
  background:            #F2EFE8;
  color:                 #005fa0;
  background-color:      #E4DCD0;
  padding:               12px;
  margin-top:            12px;
  border-radius:         4px!important;
  height:                100%;
  margin-bottom:         0px;
}

.trigger {
  width:                 calc(100% - 24px);
  background:            #F2EFE8;
  padding:               12px;
  margin-top:            12px;
  border-radius:         4px!important;
  cursor:                pointer;
  margin-bottom:         0px;
}
.trigger:hover {
  box-shadow:            0px 0px 5px rgb(156, 145, 127);
}
.trigger_active {
  color:                 #005fa0;
  background-color:      #F2EFE8;
}
.trigger_active:hover {
  box-shadow:            0px 0px 0px rgb(156, 145, 127);
}
.trigger a, .trigger-no-a a {
  color:                 #015f9f;
}
.trigger-h1, .inside .trigger-h1 {
  color:                 #005fa0;
  text-decoration:       none;
  font-weight:           400;
  font-size:             1.5em;
  margin:                0px;
  padding-left:          0px;
  padding-right:         0px;
  padding-top:           0px;
}
.toggle_container h1 {
  color:                 #005fa0;
  text-decoration:       none;
  font-weight:           400;
  font-size:             1.4em;
  margin:                0px;
  padding-left:          0px;
  padding-right:         0px;
  padding-top:           0px;
}
.toggle_container h2 {
  color:                 #005fa0;
  text-decoration:       none;
  font-weight:           400;
  font-size:             1.2em;
  margin:                0px;
  padding-left:          0px;
  padding-right:         0px;
  padding-top:           0px;
}
.toggle_container h3 {
  color:                 #005fa0;
  text-decoration:       none;
  font-weight:           400;
  font-size:             1.0em;
  margin:                0px;
  padding-left:          0px;
  padding-right:         0px;
  padding-top:           0px;
}
.toggle_container a {
  color:                 #005fa0;
  font-size:             1em;
  text-decoration:       none;
}
.trigger-h1 a, .inside .trigger-h1 a {
  font-size:             1em;
  text-decoration:       none;
}
.trigger-h1.Rat-Tat, .inside .trigger-h1.Rat-Tat {
  color:                 #009ee0;
}
.trigger-h2 {
  overflow:              hidden;
  position:              relative;
  width:                 100%;
  min-height:            20px;
  color:                 #000;
  text-decoration:       none;
  font-weight:           400;
  font-size:             1.0em;
}
.trigger-h2-left {
  float:                 left;
  width:                 calc(100% - 60px);
}
.trigger-h2-right {
  text-align:            right;
  width:                 60px;
  float:                 right;
  position:              absolute;
  bottom:                0;
  right:                 0;
}
.a-more {
  color:                 #005fa0;
  text-decoration:       none;
  white-space:           nowrap;
}
.toggle_container {
  background:            #F2EFE8;
  padding-left:          12px;
  padding-right:         12px;
  padding-top:           12px;
  padding-bottom:        12px;
  border-left:           10px solid #E4DCD0;
  border-radius:         4px!important;
  width:                 calc(100% - 34px);
  display:               block;
  margin-bottom:         18px;
}
.toggle_container p {
  padding-left:          0px;
  padding-right:         12px;
  padding-top:           0px;
  padding-bottom:        12px;
}
.toggle_container ul, .trigger-no-a ul, .trigger ul {
  font-size:             1em;
  color:                 #1b1b1b;
  list-style-type:       disc;
  list-style-position:   outside;
  list-style-image:      none;
  padding-left:          24px;
  padding-right:         12px;
  padding-top:           0px;
  padding-bottom:        12px;
  margin:                auto;
}
.toggle_container ul ul {
  list-style-type:       circle;
}
.toggle_container img {
  max-width:             98%;
  display:               inline-block;
  margin-left:           auto;
  margin-right:          auto;
  padding-bottom:        12px;
  padding-top:           12px;
}
.player-inside img {
  max-width:             100%;
  padding-bottom:        0px;
  padding-top:           0px;
}
.toggle_container ol {
  font-size:             1em;
  color:                 #1b1b1b;
  list-style-type:       decimal;
  list-style-position:   outside;
  list-style-image:      none;
  padding-left:          24px;
  padding-right:         12px;
  padding-top:           0px;
  padding-bottom:        12px;
  margin:                auto;
}
.toggle_container ul li, .toggle_container ol li {
  padding-bottom:        2px;
}

@media screen and (max-width:480px) {
  .trigger:hover {
    box-shadow:          0px 0px 0px rgb(156, 145, 127);
  }
}

/* ####################################################### */
/* ######################### team ######################## */

.team-overall {
  width:                 100%; 
  height:                100%; /* for IE6 */
  overflow:              hidden;
  padding:               0;
  margin:                0;
  border-radius:         4px !important;
}

.team {
  width:                 calc(50% - 26px);
  background-color:      #E4DCD0;
  border-radius:         4px !important;

  margin:                0;
  margin-left:           0;
  margin-top:            12px;
  margin-bottom:         0;
  padding-top:           10px;
  padding-right:         10px;
  padding-bottom:        0;
  padding-left:          10px;

  padding-bottom:        99999px;
  margin-bottom:         -99999px;

}
.team.left {
  float:                 left;
}
.team.right {
  float:                 right;
}

.team p.team-contact {
  text-align:            left;
  bottom:                0;
  padding:               0;
  padding-bottom:        12px;
  margin:                0;
}
.team p.team-contact a {
  color:                 #660066;
  text-decoration:       none;
}
.team p.team-contact a:hover {
  text-decoration:       none;
}
img.team-img {
  float:                 left;
  width:                 90px;
  border:                0;
  padding-top:           0px;
  padding-right:         10px;
  padding-bottom:        12px;
  padding-left:          0px;
  margin:                auto;
}

.team-txt {
  float:                 left;
  width:                 calc(100% - 110px);
  padding:               0;
  margin:                0;
}
.team-txt h1 {
  color:                 #000066;
  font-weight:           bold;
  font-size:             1.2em;
  padding:               0;
  margin:                auto;
}
.team-txt h2 {
  color:                 #000066;
  font-weight:           bold;
  font-size:             1em;

  padding:               0;
  margin:                0;
}
.team-txt p {
  color:                 #000;
  font-size:             1em;

  padding-top:           5px;
  padding-right:         5px;
  padding-bottom:        5px;
  padding-left:          0px;
  margin:                0;
}

@media screen and (max-width : 870px) {
  .team-txt {
    float:               none;
    width:               100%;
  }
}

@media screen and (max-width : 750px) {
  .team {
    float:               none;
    width:               calc(100% - 20px);
    padding-bottom:      0;
    margin-bottom:       0;
  }
  .team.left {
    margin-right:        0;
    margin-left:         0;
  }
  .team.right {
    margin-right:        0;
    margin-left:         0;
  }
}

/* ####################################################### */

.text-with-image .overlay {
  background:            transparent url(https://www.kowarik.at/kowarik/image/overlay.png) repeat top left;
  position:              fixed;
  top:                   0px;
  bottom:                0px;
  left:                  0px;
  right:                 0px;
  z-index:               100;
}
.text-with-image .box {
  display:               none;
  position:              fixed;
  top:                   10%;
  left:                  0%;
  right:                 0%;
  max-width:             400px;
  background-color:      #fff;
  color:                 #7F7F7F;
  padding:               20px;
  border:                2px solid #9d927e;
  -moz-border-radius:    20px;
  -webkit-border-radius: 20px;
  -khtml-border-radius:  20px;
  -moz-box-shadow:       0 1px 5px #333;
  -webkit-box-shadow:    0 1px 5px #333;
  margin-left:           auto;
  margin-right:          auto;
  margin-top:            auto;
  margin-bottom:         auto;
  z-index:               101;
}
.text-with-image  a.boxclose{
  float:                 right;
  width:                 26px;
  height:                26px;
  background:            transparent url(https://www.kowarik.at/kowarik/image/cancel.png) repeat top left;
  margin-top:            -30px;
  margin-right:          -30px;
  cursor:                pointer;
}
.text-with-image .box h1{
  border-bottom:         1px dashed #9d927e;
  margin:                -20px -20px 0px -20px;
  padding:               10px;
  background-color:      #f4f1ec;
  color:                 #9d927e;
  -moz-border-radius:    20px 20px 0px 0px;
  -webkit-border-top-left-radius: 20px;
  -webkit-border-top-right-radius: 20px;
  -khtml-border-top-left-radius: 20px;
  -khtml-border-top-right-radius: 20px;
}
.text-with-image .boximage {
  width:                 400px;
  display:               none;
  position:              absolute;
  z-index:               199;
}
.text-with-image .img-right {
  text-align:            center;
}
.text-with-image a {
  cursor:                pointer;
  width:                 500px;
  color:                 #015f9f;
}
@media screen and (max-width : 500px) {
  .text-with-image .box {
    left:                3%;
    right:               3%;
  }
}