/* CSS Datei OFD-BW Stand 21.04.20 */

/* Umrechnung rem in Pixel:   px = 16 * rem * font-size
/* Box Model */
*, *:before, *:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

/* Small screens (default) */
html { 
    font-size: 16px; 
    font size 100%
}
.untermenuepunkt li{ 
    font-size: 90%; 
}
table.termine th { 
    display: none; 
}
table.termine td { 
    font-size: 80%; 
}
#standortauswahl { 
    display: none; 
}
.untermenuepunkt {
    padding-left: 0px;
}
.cal td { 
    height: 1.5rem 
}

/* div#noportrait { 
    display: block; 
}  */
.untermenuepunkt {
    padding-left: 0px; 
}
#terminformular input { 
    width: 280px; 
    width: 17.5rem; 
} 
div#termindaten th {
	display:block;
	float:none; 
   width:90%;
}
div#terminformular th { 
	display:block;
  	float:none; 
	width:90%;
}
div#termindaten td { 
	display:block;
} 
div#terminformular td { 
	display:block;
	max-width:90%; 
}
input { 
	max-width:100%; 
}
textarea { 
	max-width:100%; 
}
button {
	max-width:100%; 
}

fieldset.contentBoxForm#datenerfassung label span{display: block; background-color: transparent; font-weight: bold; color: #505050;}
fieldset#datenausgabe label {display: block; background-color: /* MITTELGRAU */; font-weight: bold; color: #505050;}
fieldset.contentBoxForm#datenerfassung label span a{ color: #505050; text-decoration: underline; }

/* M.Wende: Fuer alles kleiner als Large screens (1024px) */
@media (max-width: 1023px) /* 64rem ?? */{
   body { background-image: none; padding: 0; }
   html { background-image: none; }
   .container { margin: 0; padding: 0; }
   .brand { float: left; }
   .nav-logo {padding-left: 28px; }
   .brand-neuss { font-size: 28px; line-height: 24px; }
   .brand-de { font-size: 16px; line-height: 16px; }
   .row { margin: 0; width: 100%; }
   #header { padding: 0 15px; }
/*   #logo { display: none; } */
   #logo img { margin: 0px 10px; }
   #top-nav2 { width: 100% }
   #Parent { display: none; }

   .brand { width: 100%; line-height: 1; }

/*   .main-nav { height: 90px; width: auto; margin-left: -10px; margin-right: 0;} */

   #zs {padding-top: 10px; }

/* UEBERPRUEFEN FUER ANDERE AUFLOESUNGEN  */
fieldset#datenerfassung label span {display: block; background-color: transparent; color: #505050;}
fieldset#datenausgabe label {display: block; background-color:  white; font-weight: bold; color: #505050;}
fieldset#datenerfassung label span a{ color: #505050; text-decoration: underline; }
/* ENDE PRUEFEN  */

.navbar-right {
   line-height: 36px;
   display: block;
   width: 100%;
/* line-height: 30px; */
 }

.navbar-right li#mitem.fitem.active a, .navbar-right li#mitem.fitem a:hover {
   padding-top: 9px; padding-bottom: 10px;
 }

.navbar-right ul li a, navbar-right a:hover, .navbar-right a:link:hover {
   line-height: 40px;
   padding: 9px 15px 10px 30px;
   text-align: left;
   margin: 0;
   font-size: 16px;
   font-weight: 300;
   font-stretch: normal;
   font-variant-caps: normal;
 }

.navbar-right ul {
   padding: 0;
   position: relative;
   top: auto;
   left: auto;
 }

.navbar-right li {
   box-shadow: none;
   padding: 0;
   margin: 0; */
   padding-top: 6px;
   display: inline-block;
   position: static;
   line-height: 22px;
   text-align: left;
 }

.innercontainer { width: 100%; }
#navundcontent { margin: 0; padding: 0px; }
h1 { font-size: 28px; }
h2, h3 { font-size: 22px; }
form { padding: 0; }

div#content { padding: 10px 10px 10px 28px; }
div#navigation { padding: 10px 28px 10px 10px; }

#navigation h3 {
/* height: 100%;
   line-height: 150%;
   font-size: 14px;
   color: white;
   background-color: #6FB725;
   border-radius: 10px 10px 0 0;
   padding: 5px 5px 5px 10px;
   margin: 0;
   font-size: 18px; */
 }

fieldset#datenerfassung label span {width: 300px;}

#gebfehler, #steuernummernfehler, #mobilnummernfehler { padding-left: 0px !important; font-weight: normal; }
#gebhinweis, #steuernummernformathinweis, #mobilnummernhinweis { padding-left: 0px !important; }

} /* ENDE VON KLEINER ALS "LARGE SCREENS" */

/* SCHON BEI HALBER BILDSCHIRM AUF HANDY-ANSICHT */
@media (max-width: 51.875em) {
   #logo { margin-top: 35px; margin-bottom: 15px; float: none; }
   #logo img { float: none; margin-left: auto; margin-right: auto; margin-bottom: 8px; }
   #logo span { width: 100%; text-align: center; font-size: 18px; }
   .main-nav { line-height: 38px; padding: 0; margin: 15px auto; width: 100%; }
   .navbar-right { margin-top: 35px; z-index: 999; padding-left: 0; }
   .navbar-right #mitem { display: none; font-size: 22px; background: white; padding: 0; padding-left: 10% !important;-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; padding-bottom: 40px; }
   .navbar-right:hover #mitem, .navbar-right:active #mitem, .navbar-right #mitem a:link, .navbar-right #mitem a:visited { display: list-item; color: black; }
   .navbar-right #mitem a { font-size: 22px !important; font-weight: 600; }
   .navbar-right li#mitem.fitem { margin-left: 0; }
   .navbar-right li#mitem.fitem a, .navbar-right li#mitem.fitem a:hover { background: transparent; margin-left: 0; }
   .navbar-right #mtitle { display: inline-grid !important; padding-left: 0px; padding-top: 0px; font-size: 12px; color: #232380; }
   .navbar-right #mtitle a { font-size: 12px !important; padding: 0 !important; color: #232380; }
   .navbar-right #mitem:last-of-type { padding-bottom: 100px; }
   .navbar-right #mitem.fitem { margin-top: 80px; }

   .navbar-right #mtitle::before {
       font-family: "FontAwesome";
       content: "\f0c9";
       left: 0;
       font-size: 30px;
       color: #232380;
   }

   .navbar-right #mtitle img { float: right; margin: 0px 10px; width: 35px; }
   .navbar-right li {
      display: list-item;
      float: none;
      width: 100%;
      height: 38px;
      line-height: 28px;
      padding-left: 40px;
   }
   .navbar-right a:hover { background: transparent; text-decoration: underline; underline-color: #232380; color: black; font-weight: 600; }
   #footer { line-height: 40px; padding-left: 10px; padding-right: 10px;}
   .xfooter-right a { padding-left: 10px; }
   .footer__links { display: none; }
   .navbar-right { padding-left: 15px; padding-right: 0px; padding-top: 0px; }
   .navbar-right { position: absolute; top: 10px; }
   .navbar-right a, .navbar-right a:link:hover {
       font-size: 20px !important;
       line-height: 13px !important;
       /* padding: 1px 2px 7px 2px !important; */
       padding: 10px 5px 13px 5px !important;
   }
}

/* M. Wende iPhones usw. */
@media (max-width: 640px) {
   .hcontainer .container { margin-top: 0px !important; }
   .container { width: 100% !important; margin-top: 10px !important; }
   .row { margin: 0; padding: 0px 10px; }
   #logo span.logo2 { display: none; }
   #rutpic { display: none; }
   #footer { line-height: 20px; padding-left: 10px; padding-right: 10px;}
   .xfooter-right a { padding-left: 10px; }
   #tempus { display: none; }

   .nav-logo {padding-left: 17px; }
   .brand-neuss { font-size: 24px; line-height: 24px; }
   .brand-de { font-size: 16px; line-height: 16px; }
   div#content { padding: 10px 15px 10px 15px; }
   div#navigation { float: left; width: 100%; padding: 10px 10px 10px 15px; } 
   #standortauswahl { display: block; }
   .tooltip:hover span.info { width:100px; font-size:6pt; }
   #grafik img { width: 280px; height: auto; }
   #RATHAUS { left: 88px !important; top: 53px !important; }
   #RATHAUS img { width: 60px; }
   #NORF { left: 146px !important; top: 155px !important; }
   #NORF img { width: 60px; }
   #HOLZHEIM { left: 44px !important; top: 128px !important; }
   #HOLZHEIM img { width: 60px; }
   table input[type=text] { width: 100%; }
   table.cal { font-size: 1rem; }
   .anzahlauswahl { width: 3.2rem; }
   .menuepunkt .mpunkt { max-width:75%; }
/*   fieldset#datenerfassung label { margin-bottom: 15px; } */
   fieldset#datenerfassung label span {margin-bottom: 0.2rem; padding-top: 0.75rem; }
}


/* IPhone 320*480px */ 
@media (min-width: 320px) {
    html {font-size: 100%; }
    .untermenuepunkt li{ font-size: 100%; }
    table.termine th { display: none; }
    table.termine td { font-size: 80%; }
    .untermenuepunkt {padding-left: 1rem; }
}

/* Kleine Displays */ 
@media (max-width: 350px) {
   div#content { padding: 10px 10px 10px 10px; }
   div#navigation { float: left; width: 100%; padding: 10px 10px 10px 10px; }
   .navbar-right { padding-left: 0px; }
}

/* IPhone 569*320px */
@media (min-width: 560px) {
   html {font-size: 100%; }
   table.termine th { display: none; }
   table.termine td { font-size: 80%; }
   fieldset.termindaten label span {display: block; background-color: transparent; font-weight: bold;}
   fieldset#datenausgabe label {display: block; background-color:  transparent; color: #505050;  }
   fieldset#datenausgabe div { flex-direction: row; }
}

/* Medium screens (640px) */
@media (min-width: 640px) {
  html { font-size: 112%; }
  table.termine th { display: table-cell; }
  table.termine td { font-size: 100%; }
  .cal td { height: 1rem }
  /* FAUX Column */
  #navundcontent { 
 /*   background-image:url("../designs/ofdbw/img/hintergruende.gif");  */
    background-position:25% 0;
    background-repeat:repeat-y;
	background-color: transparent;
  }
  div#termindaten th { 
    display:table-cell;
    float:none;
    width:170px;
  }
  div#termindaten tr { 
     border-bottom:1px solid /* MITTEL */;
  }
  div#terminformular th { 
    display:table-cell;
    float:none; 
    width:170px;
  }
  div#termindaten td, div#terminformular td { 
    display:table-cell;
    float:none; 
  }

  #navigation { width: 40%; }
  #content { width: 60%; }
  h1 { margin-top: 15px; }
}

/* Screens zwichen 640px und 768px (iPad Vertikal) */
@media (min-width: 640px) and (max-width: 768px) {
   .selection { font-size: 10px; }
   #standortauswahl { display: block; }
   .tooltip:hover span.info { width:100px; font-size:6pt; }
   #grafik img { width: 362px; height: auto; }
   #RATHAUS { left: 117px !important; top: 75px !important; }
   #RATHAUS img { width: 70px; }
   #NORF { left: 191px !important; top: 206px !important; }
   #NORF img { width: 70px; }
   #HOLZHEIM { left: 61px !important; top: 170px !important; }
   #HOLZHEIM img { width: 70px; }
}

/* Screens zwichen 769px und 834px (iPad Pro Vertical) */
@media (min-width: 769px) and (max-width: 834px) {
   #standortauswahl { display: block; }
   .tooltip:hover span.info { width:100px; font-size:6pt; }
   #grafik img { width: 442px; height: auto; }
   #RATHAUS { left: 154px !important; top: 97px !important; }
   #RATHAUS img { width: 70px; }
   #NORF { left: 243px !important; top: 258px !important; }
   #NORF img { width: 70px; }
   #HOLZHEIM { left: 83px !important; top: 215px !important; }
   #HOLZHEIM img { width: 70px; }
}

 
/* Large screens (1024px) */
@media (min-width: 64rem) {
/* FOLGENDE ZWEI ZEILEN WIEDER EINGEFUEGT */
   #content { width: 75%; }
   #navigation { width: 25%; }
	html { font-size: 120%; }
	table.termine th { display: table-cell; }
	table.termine td { font-size: 100%; }
	#standortauswahl { display: block; 
							min-height:800px; }
	div#noportrait { display: none; }
	div#content, div#naviundcontent { min-height:800px; }
   fieldset#datenerfassung label > span:first-of-type{display: inline-block; background-color: transparent; color: #505050; line-height: 2;}
   fieldset#datenerfassung input, textarea {padding-left: 0.3rem;}
   fieldset#datenerfassung label {border: none; background-color: transparent; }
   fieldset#datenerfassung label span a{ color: /* BLAU */; text-decoration: none; }
   fieldset#datenerfassung label span a:hover{ color: /* HOVERBLAU */; text-decoration: none; }
   fieldset#datenausgabe label {display: inline-block; color: #505050; background-color: transparent; font-weight: normal;}
  
}

.container {
   margin: 0 auto;
   width: 90%; */
   max-width: 940px;
}

/* Fuer breite Bildschirme */
@media (min-width: 40rem) {
.column {
	float: left;
	padding-left: 0;
	padding-right: 0;
}
.column.voll { width: 100%; }
.column.zweidrittel { width: 66.7%; }
.column.halb { width: 50%; }
.column.drittel { width: 33.3%; }
.column.viertel { width: 25%; }
.column.dreiviertel { width: 75%; }
.column.dreiviertelmitabstand { width: 72%; margin-left: 3%;}
.column.flow-opposite { float: right; }
}

/* Clearfix by Nicolas Gallagher */
.clearfix:before,
.clearfix:after {
content: " ";
display: table;
}
.clearfix:after {
clear: both;
}
.clearfix {
*zoom: 1;
}
/* Clearfix Ende */ /* Responsive Images */
img { 
  max-width: 100%; 
  height: auto;
}

.blau { }
