a[class^=icon], button[class^=icon] {
  -webkit-box-sizing: content-box;
  -moz-box-sizing:    content-box;
  box-sizing:         content-box;
}


p.buttons {
  display: inline-block;
  width:   auto;
}

p.buttons input, p.buttons button {
  float:  right;
  margin: 20px 20px 0 0;
}

div#admin_header {
  position:      fixed;
  bottom:        60px;
  right:         5px;
  max-width:     140px;
  background:    rgba( 0, 0, 0, 0.4 );
  border:        1px solid rgb( 255, 255, 255 );
  border-radius: 3px;
  padding:       10px;
  z-index:       999;
}

div#admin_header a[class^=icon] {
  display: block;
  float:   right;
  opacity: 0.7;
  margin:  0 10px 10px 0;
}

div#admin_header a:hover {
  opacity: 1.0;
}

form.question {
  position:      fixed;
  top:           50%;
  left:          50%;
  width:         500px;
  height:        200px;
  margin:        -100px 0 0 -250px;
  background:    rgba( 255, 255, 255, 0.9 );
  border:        1px solid rgb( 0, 0, 0 );
  border-radius: 3px;
  padding:       10px;
  z-index:       99;
}

/* Tooltips */

.tooltip {
  width:           235px;
  color:           #000;
  font:            lighter 11px/1.3 Arial,sans-serif;
  text-decoration: none;
  text-align:      left;

  /* Bootstrap .tooltip deaktivieren, sonst werden die tooltips nicht angezeigt: */
  display:  inline;
  opacity:  1;
  position: static;
}

.tooltip span.top {
  padding-top: 2px;
  background:  url(../../../image/womex/design/bt.gif) no-repeat top;
}

.tooltip b.bottom {
  padding:    3px 8px 7px 35px;
  color:      #548912;
  background: url(../../../image/womex/design/bt.gif) no-repeat bottom;
}

.tooltip div {
  margin-left: 35px;
  padding:     8px;
}

a.tooltip {
  margin-left: 5px;
}

body#tooltip {
  padding: 20px 35px 50px 35px;
}

body#tooltip p {
  width:   300px;
}

div#service {
  max-width: 400px;
}

ol#gtob li {
  padding-top: 10px;
}

ol#gtob li p {
  padding: 0 0 10px 0;
}

/* Upload Screen */

div#upload_screen, div#semitransparent_overlay_screen {
  position:   fixed;
  top:        0;
  left:       0;
  width:      100%;
  height:     100%;
  background: url(../../../image/design/transparent_bg_black_1x1.png);
}

div#semitransparent_overlay_screen {
  display: none;
  z-index: 10;
}

div#upload_screen p, div#semitransparent_overlay_screen p {
  border:      1px solid black;
  background:  white;
  width:       200px;
  height:      100px;
  padding:     10px;
  position:    fixed;
  top:         250px;
  left:        220px;
  font-weight: bold;
}

div#semitransparent_overlay_screen p {
  display:none;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -115px;
  margin-top: -70px;
}

div#semitransparent_overlay_screen p span#overlay_waiting_message_header {
  display:     block;
  font-weight: bold;
  padding-top: 0px;
}

div#upload_screen p span, div#semitransparent_overlay_screen p span {
  display:     block;
  font-weight: normal;
  padding-top: 15px;
}

div#upload_screen img, div#semitransparent_overlay_screen img {
  margin: 10px 82px 0 82px
}

div.search_navi form {
  display: inline;
  margin:  0 15px 0 0;
  padding: 0
}

# CMS Tree

div#cms_tree ul li div.deleted, div#cms_tree ul li div.not_published {
  opacity: 0.5;
}

div#cms_tree ul li div.deleted a {
  text-decoration: line-through;
}

div#cms_tree ul li div:hover {
  background-color: rgb(240,240,240);
}

div#cms_tree ul li div {
  /* border-bottom: 1px solid rgb(220,220,220);  */
  padding:       3px;
}

div#cms_tree ul li div:after {
  content:    ".";
  display:    block;
  height:     0;
  clear:      both;
  visibility: hidden;
}

div#cms_tree ul li div a {
  float:   right;
}

div#cms_tree ul li div a:first-child {
  float:   left;
}

div#cms_tree ul li div img {
  margin:  0 0 0 10px;
}

div#cms_tree ul li span.date, div#cms_tree ul li span.url {
  float:   right;
  display: inline-block;
  width:   80px;
}

div#cms_tree ul li span.url {
  width:   280px;
}

input.logout {
  background: rgb( 255, 255, 255 );
  opacity: 0.6;
}

input.logout:hover {
  opacity: 1;
}


.group:before,
.group:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */ }

.group:after {
  clear: both; }

.row_bs4_label_fix {
  /*
  should use class="flex-row" in bs4 instead of class="row" to achieve the same effect of
  label above input line but crashes with custom "row" class in cn and womex
  maybe remove this fix with class="flex-row" after complete switch to bs4
  */
  display:block;
}

.searchform label, .searchform input[type=checkbox] {
  line-height: normal;
}

div.youtube-container {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
}
div.youtube-container iframe.youtube-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}