/* mithilfe dieser css datei können die "Rahmenelemente" des WebsiteView gestyled/angepasst werden */

body, td, #pub-content, div.panel
{
  font-family:arial;
}
.modal-dialog
{
  font-weight:normal;
  text-indent:0px;
}


/* folgendes auskommentieren, um selektion zu verhindern */
/* body  :not(INPUT):not(TEXTAREA),
{
  -webkit-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  -o-user-select:none;
  user-select:none;
}*/



/* der Header-Bereich */
/* hier nichts an den Größen ändern - das gibt Probleme! */
/* Farben, HintergrundGrafiken etc. ist kein Problem! */
.websiteview-header
{
    text-align:center; /* inhalte (logo) ausrichten */
    background-color:#333;
    /*border-bottom:1px solid #eee;*/
    padding:2px;
}

#HLogo{display:inline!important;}
#HTitle{display:none!important;}
#history{
padding-top:10px;
display:none!important;
}

#ad-panel-left{
top:70px;
}

#BREADCRUMB{
  display:block!important; /* DIESE ZEILE BLENDET DEN BREADCRUMB EIN */
  width:100%;
  min-height:20px;
  margin-top:-4px;
  background-color:#ccc;
  margin:0px;
  padding-left:10px;
  border-bottom:1px solid #eee;
}

/* die Farbe für Header und die beiden reinziehbaren Bereiche */
/* sollte dunkel sein, damit der Treeview (Toc) gut aussieht */
.websiteview-frame-color 
{
  /*background-color:#fff;*/
  background-color:#333;
  
}

/* Farben für suchergebnisse */
.tipue_search_content_text,#tipue_search_content, #tipue_search_warning, #tipue_search_foot{
  /*color:black;*/
}

.tipue_search_result{
border:1px solid #eee!important;
padding:3px;
margin:3px;

}

/* inhaltsbereich  */
#pub_content{
padding-top:40px;  /* stückchen runterschieben - weil vom Header verdeckt */
}



/* folgende rules legen das Layout der Blätter-Buttons unten links und rechts fest*/
#ad-bottom-left, #ad-bottom-right{
  /*display:none; gar nicht anzeigen */
  border-radius:0px;
  width:32px;
  height:32px;
  padding:0px;
  bottom:10px;
}
#ad-bottom-left{
background-image:url(icon_rueckwaerts_blaettern.png);
background-size:contain;
background-repeat:no-repeat;
}
#ad-bottom-right{
background-image:url(icon_vorwaerts_blaettern.png);
background-size:contain;
background-repeat:no-repeat;
}


/* ausblenden der Hilfsnavigation - wenn die doch angezeigt werden soll, folgende Regeln ausblenden*/
div.pub-pageref {
/*display:none;*/
}


/*

div.custom{display:none;}
*/

/* zum ausblenden der Symbole links (Toc) und rechts (Suche) folgendes einkommentieren */
/*
#ad-header-left-link, #ad-header-right-link{
  display:none;
}
  */
#ad-header-left-link{
  display:inline;
}

/* zum ausblenden der Laschen links (Toc) und rechts (Suche) folgendes einkommentieren */
.ad-quer{
  display:none;
}


/*.ad-inactivecontent{opacity:0;} */

.websiteview-logo
{
    margin-right:10px;
    cursor:pointer; /* diese angabe sorgt dafür, dass das logo wie ein link wirkt */
}

/* der Button links oben (für den Toc) */
.websiteview-icon
{
    height:32px;
    margin:8px;
    padding:0px;
    opacity:0.8; /* darf für touch-devices nicht zu durchsichtig sein, weils da keinen hover gibt */
    
}
.websiteview-icon:hover
{
    opacity:1;
}







/* ************************************** */
/* Responsive Größen und Verhalten        */
/* Festlegungen zu kleinen Fensterbreiten */
/* ************************************** */
/* Default-Vorgaben (für alle (insbesondere Große) Fensterbreiten) */
  #pub_content{
  max-width:1000px;
  padding:10px;
  }
@media (max-width: 479px)  /* Breite bis zu 480px*/ 
{
  /* hier alle angaben zu KLEINEN Breiten */
  #pub_content{
  /*background-color:yellow;*/  /* zuim testen:Klein=Knallgelb */
  width:100%;
  max-width:100%;
  /*margin-left:0px;*/ /* den margin-left sollte man nicht befummeln - das tut der TOC schon, um den Content nach rechts zu schieben */
  margin-right:0px;
  padding:10px;
  }

  /* Breite des TOC festlegen */
  #ad-panel-left.ad-is-active  {
    /*width:100%;*/
  }
  /* Bredite des Suchbereichs festlegen */
  #ad-panel-right.ad-is-active  {
    width:30%;*/
  }

  /* Marginalien im Fluss einbinden und negativ-einzüge (für Ü-Nummern) eliminieren */
  .CONTENTCONTAINER{
    margin-left:0px!important;
    margin-left:0px!important;
  }
  .CONTENTCONTAINER>.Ueberschrift::before{
    margin-left:0px!important;
    min-width:unset!important;
  }
  .MARGINALIENCONTAINER{
    float:none!important;
    margin-left:0px!important;
  }

  /* Spaltentabelle übereinander und ohne Breitenangabe*/
  table.BLOCKSPALTEN_TABELLE,table.BLOCKSPALTEN_TABELLE tr,table.BLOCKSPALTEN_TABELLE td {
  display:block!important;
  padding:0px;
  margin:0px;
  width:100%!important;
  max-width:100%!important;
  }

  /* Mehrspaltigkeit (Zeitungslayout) deaktivieren*/
  .Zeitungslayout{
    -moz-column-count:unset!important;
    -webkit-column-count:unset!important;
    column-count:unset!important;
  }

  /*Bilder, die zu breit sein wollen*/
  div.Grafik>img{
    max-width:100%!important;
    height:auto!important;/*die höhe soll sich automatisch anpassen*/
  }
}

@media (max-width: 799px) and (min-width: 480px)  /* Breite von 480 bis zu 800px*/ 
{
  /* hier alle angaben zu Mittleren Breiten */
  #pub_content{
  /*background-color:magenta;*/  /* zuim testen:Mittel=Magenta */
  /*width:100%;*/
  max-width:100%;
  /*padding:10px;*/
  }

  /*Bilder, die zu breit sein wollen*/
  div.Grafik>img{
    max-width:100%!important;
    height:auto!important;/*die höhe soll sich automatisch anpassen*/
  }

  /* Breite des TOC festlegen */
  #ad-panel-left.ad-is-active  {
    /*width:100%;*/
  }
  /* Bredite des Suchbereichs festlegen */
  #ad-panel-right.ad-is-active  {
    width:30%;
  }

}

@media (min-width: 800px)  /* Breite über 800px*/ 
{
  /* hier alle angaben zu Großen Breiten */
  #pub_content{
  /*background-color:green;*/  /* zum testen:Groß=Green */
  }

  /* Breite des TOC festlegen */
  #ad-panel-left.ad-is-active  {
    /*width:100%;*/
  }
  /* Bredite des Suchbereichs festlegen */
  #ad-panel-right.ad-is-active  {
    width:30%;
  }

}







/* *************************************************************
   Anzeige von datenBindungsfehlern
   
   folgende 3 zeilen aus diesem Kommentar rauskopieren, und nach dem Kommentar einfügen,
   um die Anzeige von Fehlern zu unterdrücken:

.ERROR{
display:none;
}
   
   
   ********************************************************** */
   
   
/* *************************************************************
   Anzeige von Kapitelnummern im TOC
   
   folgende 3 zeilen aus diesem Kommentar rauskopieren, und nach dem Kommentar einfügen,
   um die Anzeige von Kapitelnummern im TOC zu unterdrücken:

span.TocCounter{
display:none;
}
   
   ********************************************************** */
   
span.TocCounter{
display:none;
}


/* *************************************************************
   felstlegungen für den Abbildungs-Vergrösserungs overlay
   ********************************************************** */

#pic-overlay
{
  position:fixed;
  z-index:2999;
  top:0px;
  left:0px;
  bottom:0px;
  right:0px;
  display:none;
  background:#333;
  opacity:1;
  padding:1cm;
}

#pic-overlay-inner{
background:white;
width:100%;
height:100%;
padding:0.5cm;
overflow-x:scroll;
overflow-y:scroll;
}




.modal
{
  z-index:2050;
}




#ad-panel-left
{z-index:1080;}

.websiteview-sidebar
{
  /* hier nur ne Farbe setzen, wenn sie von der websiteview-frame-color abweichen soll */
  /* background-color:#333; */ 
}




/* anpassungen für den TOC-Treeview*/
.jstree-default-dark
{
  background-color:#333;
}

.nav.nav-tabs {
	display:none; /*ausblenden des TOC-/Index-Reiters */
}

/*

.jstree-default-dark div.jstree-wholerow-clicked {
  background-color:#fff!important;
  background-image: none;
}
.tab-content{
  border-left:1px solid #d9d9d9!important;
  border-right:1px solid #d9d9d9!important;
  border-bottom:1px solid #d9d9d9!important;
  overflow:hidden;
}
.jstree-wholerow-hovered{
  background-color:#226!important;
}
a.jstree-clicked
{
  color:#226!important;
  font-weight:bold;
}
*/