/* Responsives Design , - C. Ebinger - 2020/06/24 

*/
$small: only screen and (min-width: 35.5em);  /*  568px */                                        
$medium: only screen and (min-width: 48em);   /*  768px */                                        
$large: only screen and (min-width: 64em);    /* 1024px */                                        
$x-large: only screen and (min-width: 80em);  /* 1280px */                                        
$retina: only screen and (min-width: 90em);   /* 1440px */                                        

@media screen and (max-width: 35.438em) { // .pure-hidden-xs                                      
    .pure-hidden-xs { display: none !important; }                                                 
    .pure-visible-sm { display: none !important; }                                                
    .pure-visible-md { display: none !important; }                                                
    .pure-visible-lg { display: none !important; }                                                
    .pure-visible-xl { display: none !important; }                                                
}                                                                                                 
@media screen and (min-width: 0em) and (max-width: 47.938em) { // .pure-hidden-sm             
    .pure-visible-xs { display: none !important; }                                                
    .pure-visible-md { display: none !important; }                                                
    .pure-visible-lg { display: none !important; }                                                
    .pure-visible-xl { display: none !important; }                                                
    .pure-hidden-sm { display: none !important; }                                                 
}                                                                                                 
                                                                                                  
@media screen and (min-width: 48em) and (max-width: 63.938em) { // .pure-hidden-md                
    .pure-visible-xs { display: none !important; }                                                
    .pure-visible-sm { display: none !important; }                                                
    .pure-visible-lg { display: none !important; }                                                
    .pure-visible-xl { display: none !important; }                                                
    .pure-hidden-md { display: none !important; }                                                 
}                                                                                                 
                                                                                                  
@media screen and (min-width: 64em) and (max-width: 79.938em) { // .pure-hidden-lg                
    .pure-visible-xs { display: none !important; }                                                
    .pure-visible-sm { display: none !important; }                                                
    .pure-visible-md { display: none !important; }                                                
    .pure-visible-xl { display: none !important; }                                                
    .pure-hidden-lg { display: none !important; }                                                 
}                                                                                                 
@media screen and (min-width: 80em) and (max-width: 89.938em) { // .pure-hidden-xl                
    .pure-visible-xs { display: none !important; }                                                
    .pure-visible-sm { display: none !important; }                                                
    .pure-visible-md { display: none !important; }                                                
    .pure-visible-lg { display: none !important; }                                                
    .pure-hidden-xl { display: none !important; }                                                 
}                                                                                                 
@media screen and (min-width: 90em) { // .pure-hidden-ret                                         
    .pure-visible-xs { display: none !important; }                                                
    .pure-visible-sm { display: none !important; }                                                
    .pure-visible-md { display: none !important; }                                                
    .pure-visible-lg { display: none !important; }                                                
    .pure-visible-xl { display: none !important; }                                                
    .pure-hidden-ret { display: none !important; }                                                
}



/* Ende Responsives Design */


#elements16 {position:absolute;}
.mask16 { width:980px; height:200px; position:relative; overflow:hidden;}
.mask16 img { position:absolute; display:block; border:none;}

#begruendung {
	padding: 5px;
	margin-top: 10px;
    font-family: 'Myriad Pro',Arial,Helvetica,Tahoma,sans-serif;
	color: #666666;
        background: #f0eef3;
        border: 1px solid #CECECE;

}

.begruendung ol {
    padding-left: 30px !important;
}

#begruendung h5 {
        font-size: 14px;
}

h1 {
    font-family: "Francois One",Arial,Helvetica,Tahoma,sans-serif;
    font-weight: normal;
}

h4 {
    font-family: "Francois One",Arial,Helvetica,Tahoma,sans-serif;
    font-weight: normal;
}

/* Einmal als span, wenn kein Zeilenumbruch erfolgen darf */

span.eugh-raus {
  color: #1d8a47;
  text-decoration: line-through;
}

span.eugh-rein {
  color: #1d8a47;
}

span.raus {
  text-decoration: line-through;
  color: #0015b1;
}

span.rein {
  color: #0015b1;
}

/* Zur Einarbeitung der Empfehlung Finanzausschuss */
/* =============================================== */

span.fa-raus {
  text-decoration: line-through;
  color: #ce190d;
}

span.fa-rein {
  color: #ce190d;
}

div.fa-raus {
  color: #ce190d;
  text-decoration: line-through;
}

div.fa-rein {
  color: #ce190d;
}

/* Durch RegE rein, durch Finanzausschuss wieder raus */
span.rg-rein-fa-raus-aussen {
  text-decoration: line-through;
  color: #ce190d;
}

span.rg-rein-fa-raus-innen {
  color: #0015b1;
}
/* =============================================== */

/* Einmal als div, wenn es über andere HTML-Tags hinweg geht
   "Innerhalb eines <span>-Tags dürfen nur Inline-Elemente liegen –
    also keine HTML-Tags wie div, table, ul, li oder p." */

div.eugh-raus {
  color: #1d8a47;
  text-decoration: line-through;
}

div.eugh-rein {
  color: #1d8a47;
}

div.raus {
  color: #0015b1; /* Orange */
  text-decoration: line-through;
}

div.rein {
  color: #0015b1;
}



#begruendung pre {
    background: none repeat scroll 0 0 #EFEFEF;
    border-left: 2px solid lightgrey;
    font-family: Consolas,monospace;
    font-size: 14px;
    line-height: 21px;
    margin-left: 20px;
    margin-top: 10px;
    padding: 5px;
    white-space: pre;
}


h2
{
	margin-bottom: 5px;
}

.abschnitt h2
{
	margin-bottom: 10px;
}

h3
{
	margin-bottom: 5px;
}

h4
{
	margin-bottom: 5px;
}


#footer
{
  position: static;
}

#container
{
  padding: 0;
}
.abschnitt
{
   margin-left: 10px;
   margin-bottom: 10px;
}

.abschnitt .abschnitt
{
/*  border-bottom: 1px solid #CCC; */
  padding-bottom: 0px;
}

.abschnitt *
{
/*  font-size: 14px; */
}

.abschnitt h1
{
    font-size: 18px;
    font-weight: normal;
    cursor: pointer;
    padding: 3px;
}

.abschnitt h2
{
    font-size: 18px;
    font-weight: normal;
    cursor: pointer;
    padding: 3px;
}

.abschnitt h3
{
    font-size: 18px;
    font-weight: normal;
    cursor: pointer;
    padding: 3px;
    margin-left: -22px;
    margin-bottom: 10px;
}

.abschnitt h4
{
    font-size: 18px;
    font-weight: normal;
    cursor: pointer;
    padding: 3px;
}

.current
{
  /* background: #EEE;
  color: #7ab800; */
}

.yellow
{
  background: yellow;
}

/* Erste Ebene der Aufzählung ist per Default 1. 2. 3. etc. */

ul, ol
{
  padding-bottom: 10px;
  line-height: 21px;
}

/* Abstand link erste Ebene */
ol
{
  padding-left: 90px;
}

/* Abstand link zweite Ebene */
ol ol
{
  padding-left: 12px;
/*  list-style: lower-alpha; */
}

/* Zweite Ebene a) b) c) etc. */
ol ol {list-style-type: none;}
ol ol li:before {content: counter(section, lower-alpha) ") "; margin-left: -20px;}
ol ol li { counter-increment: section; padding-left: 5px; text-indent: 4px;}

/* Dritte Ebene aa) bb) cc) etc. */
ol ol ol {list-style-type: none; counter-reset: section; }
ol ol ol li:before {content: counter(section, lower-alpha) counter(section, lower-alpha) ") "; margin-left: -20px;}
ol ol ol li { counter-increment: section; padding-left: 5px; text-indent: 4px;}

#main
{
  padding-bottom: 0 !important;
  line-height: 21px;
}

#header .level_1 li a.last
{
  padding-right: 19px;
}


#im_header .large
{
  font-size: 28px;
  padding-bottom: 10px;
  color: #555;
}

#shortcuts
{
   -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  -khtml-border-radius: 20px;
  border-radius: 20px;

  position: absolute;
  position: fixed;
  z-index: 100;
  width: 540px;
  height: 180px;
  background: rgba(0,0,0,0.85);
  left: 50%;
  top: 50%;
  margin: -220px 0 0 -300px;
  padding: 30px;
  color: #EEE;
  line-height: 34px;
}

/* Damit die Navigation oben nicht umbricht */
#header .level_1 li a:link, #header .level_1 li a:visited, #header .level_1 li span {
font: 19px/55px 'Francois One',Arial,Helvetica,Tahoma,sans-serif;
}

#shortcuts .key
{
  color: #46F50C;
}

#shortcuts .one_key
{
}

#shortcuts .key_part
{
  width: 140px;
  text-align: right;
  float: left;
}

#shortcuts .description
{
  padding-left: 20px;
}

#shortcuts #shortcuts_close
{
  position: absolute;
  top: 10px;
  right: 10px;
  color: #46F50C;
}

#sidebar
{
  position: absolute;
  font-size: 14px;
  position: fixed;
  right: -261px;
  top: 0;
  height: 100%;
  border-left: 1px solid #CECECE;
  background: #E7E7E6;
  width: 230px;
  padding: 15px;
}

#sidebar_content {
	width: 240px;
	color: #666666;
	padding-right: 22px;
        font-weight: bold;
	height:95%;
        overflow-y: scroll;   /* Scrollen aktivieren */
}

#sidebar_content .raus {
	color: #666666;
}


#sidebar_content .rein {
	color: #666666;
}


/* --------------- */

.sidebar_link .raus a:hover { /* Hover geht nicht! */
	color: green;
	text-decoration: underline;
}


.sidebar_link .rein a:hover { /* Hover geht nicht! */
	color: green;
	text-decoration: underline;
}


#sidebar_content .rein a:hover { /* Hover geht nicht! */
	color: green;
	text-decoration: underline;
}

/* --------------- */

#sidebar_content ul {
    font-weight: normal;
    padding-bottom: 0px;
    line-height: 16px;
}

#sidebar #sidebar_handle
{
  position: absolute;
  background: #7ab800;
  padding: 4px 10px;
  color: #FFF;
  left: -54px;
  top: 50%;
  margin-top: -100px;
  height: 86.15px;
  cursor: pointer;
  transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
}

body
{
  overflow-x: hidden;
  font-size: 14px;
}

.box {
    border: red 4px dashed;
    border-bottom: blue 4px solid;
    border-top-style: ridge;
}


#sidebar_content .raus {
    color: #666666;
}

#sidebar_content a:hover .raus
{
color: #7ab800;
}

#sidebar_content a:hover .rein
{
color: #7ab800;
}




























#sidebar
{
  position: absolute;
  font-size: 14px;
  position: fixed;
  right: -261px;
  top: 0;
  height: 100%;
  border-left: 1px solid #CECECE;
  background: #E7E7E6;
  width: 230px;
  padding: 15px;
}

#sidebar_content {
   width: 240px;
   color: #666666;
   padding-right: 22px;
   font-weight: bold;
   height:95%;
   overflow-y: scroll;   /* Scrollen aktivieren */
}

#sidebar_content .raus {
   color: #666666;
}


#sidebar_content .rein {
   color: #666666;
}


.sidebar_link .raus a:hover { /* Hover geht nicht! */
	color: green;
	text-decoration: underline;
}


.sidebar_link .rein a:hover { /* Hover geht nicht! */
	color: green;
	text-decoration: underline;
}


#sidebar_content .rein a:hover { /* Hover geht nicht! */
	color: green;
	text-decoration: underline;
}

/* --------------- */

#sidebar_content ul {
    font-weight: normal;
    padding-bottom: 0px;
    line-height: 20px;
}

#sidebar #sidebar_handle
{
  position: absolute;
  background: #7ab800;
  padding: 4px 10px;
  color: #FFF;
  left: -54px;
  top: 50%;
  margin-top: -100px;
  height: 20px;
  cursor: pointer;
  transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
}

body
{
  overflow-x: hidden;
  font-size: 14px;
}

.box {
    border: red 4px dashed;
    border-bottom: blue 4px solid;
    border-top-style: ridge;
}


#sidebar_content .raus {
    color: #666666;
}

#sidebar_content a:hover .raus
{
color: #7ab800;
}

#sidebar_content a:hover .rein
{
color: #7ab800;
}


#main h1:hover, h2:hover, h3:hover, h4:hover
{
color: #7ab800;
}

span.raus {
  text-decoration: line-through;
  color: #0015b1;
}

span.rein {
  color: #0015b1;
}

div.raus {
  text-decoration: line-through;
  color: #0015b1;
}

div.rein {
  color: #0015b1;
}

.label {
    display: inline;
    padding: 0.2em 0.6em 0.3em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #FFF;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25em;
}

.label-default {
    background-color: #777;
}

.infobox {
    margin-right: 0px;
    margin-left: 0px;
    margin-top: 20px;
    margin-bottom: 10px;
    background-color: #EEE;
    border-color: #DDD;
    border-width: 1px;
    border-radius: 4px 4px 0px 0px;
    box-shadow: none;
    position: relative;
    padding: 10px 10px 10px;
    border-style: solid;
}

div.infobox { margin-left: 50px !important; }

.infobox-title { color: #959595;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: bold;
    font-size: 12px;
    margin-bottom: 0px;
}


#begruendung {
    margin-right: 0px;
    margin-left: 0px;
    margin-top: 20px;
    margin-bottom: 10px;
    background-color: #EEE;
    border-color: #DDD;
    border-width: 1px;
    border-radius: 4px 4px 0px 0px;
    box-shadow: none;
    position: relative;
    padding: 10px 10px 10px;
    border-style: solid;
}

#begruendung p {
    margin: 0px 0px 0px;
}

h1:before {
    color: rgba(143, 144, 146, 0.74);
    font-family: FontAwesome;
    content: "\f0fe";
    margin-right: 10px;
}

h2:before {
    color: rgba(143, 144, 146, 0.74);
    font-family: FontAwesome;
    content: "\f0fe";
    margin-left: 20px;
    margin-right: 10px;
}

h3:before {
    color: rgba(143, 144, 146, 0.74);
    font-family: FontAwesome;
    content: "\f0fe";
    margin-left: 40px;
    margin-right: 10px;
}

h4:before {
    color: rgba(143, 144, 146, 0.74);
    font-family: FontAwesome;
    content: "\f0fe";
    margin-left: 20px;
    margin-right: 10px;
}

.begruendung-header:before {
    color: rgba(143, 144, 146, 0.74);
    font-family: FontAwesome;
    content: "\f0fe";
    margin-right: 10px;
}

.zu:before {
    color: rgba(143, 144, 146, 0.74);
    font-family: FontAwesome;
    content: "\f0fe";
    margin-right: 10px;
}

.offen:before {
    color: rgba(143, 144, 146, 0.74);
    font-family: FontAwesome;
    content: "\f146";
    margin-right: 10px;
}

.current {
   /* background: rgb(122, 184, 0) none repeat scroll 0% 0%;
    color: #EEE; */
}

.begruendung {
    margin-right: 0px;
    margin-left: 0px;
    margin-bottom: 10px;
    background-color: #EEE;
    border-color: #DDD;
    border-width: 1px;
    border-radius: 4px 4px 0px 0px;
    box-shadow: none;
    position: relative;
    padding: 10px 10px 10px;
    border-style: solid;
}

.begruendung-header {
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: bold;
    font-size: 12px;
    margin-bottom: 10px;
}

.begruendung-header a { color: #959595; }

.begruendung-content {
    margin-top: 5px;
}

.begruendung-content p {
    margin-bottom: 0px;
}

.para-link {
    color: #ffffff;
}

.absatz-link, .pred-h, .succ-h  {
    color: #ffffff;
    display: block;
    position: absolute;
}
.pred, .succ {
    color: #C3C3C2;
    display: block;
    position: absolute;
}

.begr-link {
    color: #EEE;
}

.abschnitt .abschnitt .abschnitt {
    margin-left: 30px;
}

p.absatz { margin-left: 50px !important; }
div.begruendung { margin-left: 50px !important; }

/* Inaktiver Button Link zu anderer Gesetzesfassung */
.buttoninactive { background: #7ab800; color: white;}





/* Einarbeitung Art. 6 Abs. 11 CRD IV-Umsetzungsgesetz 3 */

span.crd-raus {
  text-decoration: line-through;
  color: blue;
}

span.crd-rein {
  color: blue;
}

div.crd-raus {
  color: blue;
  text-decoration: line-through;
}

div.crd-rein {
  color: blue;
}

/* Einarbeitung
   Art. 6 G zur Umsetzung der VerbraucherrechteRL
   und zur Änd. des G zur Regelung der Wohnungsvermittlung 4 */

span.verbr-raus {
  text-decoration: line-through;
  color: green;
}

span.verbr-rein {
  color: green;
}

div.verbr-raus {
  color: green;
  text-decoration: line-through;
}

div.verbr-rein {
  color: green;
}

/* Einmal als span, wenn kein Zeilenumbruch erfolgen darf */

span.eugh-raus {
  color: #1d8a47;
  text-decoration: line-through;
}

span.eugh-rein {
  color: #1d8a47;
}

span.raus {
  text-decoration: line-through;
  color: #0015b1;
}

span.rein {
  color: #0015b1;
}

/* Zur Einarbeitung der Empfehlung Finanzausschuss */
/* =============================================== */

span.fa-raus {
  text-decoration: line-through;
  color: #ce190d;
}

span.fa-rein {
  color: #ce190d;
}

div.fa-raus {
  color: #ce190d;
  text-decoration: line-through;
}

div.fa-rein {
  color: #ce190d;
}

/* Durch RegE rein, durch Finanzausschuss wieder raus */
span.rg-rein-fa-raus-aussen {
  text-decoration: line-through;
  color: #ce190d;
}

span.rg-rein-fa-raus-innen {
  color: #0015b1;
}
/* =============================================== */

/* Einmal als div, wenn es über andere HTML-Tags hinweg geht
   "Innerhalb eines <span>-Tags dürfen nur Inline-Elemente liegen –
    also keine HTML-Tags wie div, table, ul, li oder p." */

div.eugh-raus {
  color: #1d8a47;
  text-decoration: line-through;
}

div.eugh-rein {
  color: #1d8a47;
}

div.raus {
  color: #0015b1; /* Orange */
  text-decoration: line-through;
}

div.rein {
  color: #0015b1;
}


/* Bei langen Überschriften sollen weitere Zeilen eingerückt erscheinen */
h1, h2, h3, h4 {
    margin-left: 45px;
    text-indent: -45px;
}

/* Wenn das Vorstehende gesetzt wurde, muss auch der Link weiter nach rechts */
.para-link {
    margin-left: 50px !important;
    font-size: 14px !important;
}

.taxtable {
    margin-left:auto;
    margin-right:auto;
    border: 1px solid grey;
    margin-bottom: 10px;
}

.taxtable td {
    border: 1px solid grey;
    padding: 10px;
}


/* ==================================================== */
/* Farbige Markierungen des Gesetzestextes */

/* Regierungsentwurf */

span.rein-re {
  color: #0015b1;
}

span.raus-re {
  text-decoration: line-through;
  color: #0015b1;
}

/* Finanzausschuss */

span.rein-fa {
  color: #b80000;
}

span.raus-fa {
  text-decoration: line-through;
  color: #b80000;
}

/* Satznummern bei Mausover hervorheben */

sup { padding: 1px; border-radius: 2px; }


.qtip-green {
    background-color: #7ab800 !important;
    border-color: grey !important;
    color: white !important;
}

#footer-wrapper {
   position: fixed;
   bottom: 0;
   width: 100%;   /* fixed height of the footer */
   height: 50px; /* green bar: 10px + footer: 40px */
   background-color: #f5f5f5;
   z-index: 10000;
} 

#footer { 
   height: 40px;
} 

#green-bar-top, #green-bar-bottom {
    background: #7DAD00;
}

#green-bar-bottom {
    height: 10px;
}

#footer {
    border-top: 1px solid #e5e5e5;
    text-align: center;
    font-size: 12px;
    padding: 5px;
    padding-top: 6px;
    background: #f1f1f1;
}

#footer a {
    color: #333;
}

a:hover { text-decoration: none !important; }