/*
Roland Schuler
3-spaltiges Layout

Unstellung auf Typo3 10.4 im Oktober 2020
Bootstrap aktualisiert auf Version 4.5

#123 oder div#123 = ID-Selektor
.123 oder p.123   = class Selektor

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

@font-face { font-family: 'Nunito-Regular';
             src: url('../fonts/Nunito-Regular.ttf') format('truetype');
              }
@font-face { font-family: 'Nunito-Bold';
             src: url('../fonts/Nunito-Bold.ttf') format('truetype');
              }

/*@font-face { font-family: 'Nunito-Light';
             src: url('../fonts/Nunito-Light.ttf') format('truetype');
              }
 */
            
@font-face { font-family: 'OpenSans-Regular';
             src: url('../fonts/OpenSans-Regular.ttf') format('truetype');
            }

@font-face { font-family: 'OpenSans-Semibold';
               src: url('../fonts/OpenSans-Semibold.ttf') format('truetype');
            }
           
@font-face { font-family: 'OpenSans-Bold';
               src: url('../fonts/OpenSans-Bold.ttf') format('truetype');            
           }

@font-face {
            font-family: 'Material Icons';
            font-style: normal;
            font-weight: 400;
            src: url('../iconfont/MaterialIons-Regular.eot'); /* For IE6-8 */
            src: local('Material Icons'),
              local('MaterialIcons-Regular'),
              url('../iconfont/MaterialIcons-Regular.woff2') format('woff2'),
              url('../iconfont/MaterialIcons-Regular.woff') format('woff'),
              url('../iconfont/MaterialIcons-Regular.ttf') format('truetype');
          }


 @media (max-width: 750px) {
   .hidden-xs {
   display: none !important;
   }
}

/*
@media (max-width: 600px) {
   body {background:#c00;min-width:600px;}
   }

   @media (min-width: @screen-sm-min) */

body {
   padding: 0px;
   margin: auto;
   margin-top: 20px;
   font-size: 12px; /* Damit ist 1em = 12 px*/
   font-family: Tahoma,Verdana,sans-serif;
   text-align:left;
   font-weight: normal;
   background:linear-gradient(to bottom,#778899,#9FB6CD) fixed;   /* Hintergrund wird nicht gescrollt */
/* background-size: 100% 1000px;*/                                /* nicht in Verbindung mit fixed    */
}

.container {
   margin-bottom: 20px;
  
   /* wird auf dem Handy umgesetzt.
   bei 410 steht "Herzlich Willkommen" noch in einer Zeile*/
   min-width: 410px;
   /* Anfangsgröße abgestimmt auf Googel-Maps (Anfahrt)*/
   max-width: 1160px;
}

/*-----------------------------Definition Headerbereich---------------------------------*/
.kopf {
   border-radius: 6px 6px 0 0;
   background: #f5f5f5;
   border-color: #330099;
   margin: 0px;
   margin-left: -15px;
   margin-right: -15px;
   padding: 0px;
   height: 150px;
   box-shadow: 8px 0px 12px grey;
}

.kopf_links {
   padding-top: 40px;
   padding-left: 40px;
}

.kopf_rechts {
   padding-top: 10px;
   padding-left: 40px;
}

.menuezeile_oben {
   border-top: 2px solid;
   border-bottom: 2px solid;
   border-color: darkblue;
   margin-top: 6px;
   margin-left: -15px;
   margin-right: -15px;
   margin-bottom: 6px;
   background-image: url("../grafik/grauverlauf.jpg");  
   padding: 0px;
   height: 30px;
 /*box-shadow: 8px 0px 12px grey;  */
}

.section {
   margin-top: 6px;
   box-shadow: 21px 0px 27px grey;        /*gr��er Wert wegen Ausgleich - Versatz von 15px*/
}

.links {
   background: #f5f5f5;
   border-right: 8px double;
   border-color: grey;
}

.mitte {
   background: #ffffff;
}

.rechts {
   background: #f5f5f5;
   border-left: 8px double;
   border-color: grey;
}

.fuss {
   font-weight: normal;
   height:26px;
   margin-top: 6px;
   background: #f5f5f5;
   border-radius: 0 0 6px 6px;
   box-shadow: 8px 6px 12px grey;
}

.fuss_links {
    text-align: left;
    padding-top: 3px;
}

.fuss_mitte {
    text-align: center;
    padding-top: 3px;
}

.fuss_rechts {
    text-align: right;
    padding-top: 3px;
}

/* ------------------------------------------------------------------------------------ */
/*                                                                                      */
/* ------------------------------------------------------------------------------------ */
p {
  font-family: Tahoma,Verdana,sans-serif;
  font-size: 15px;
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  line-height: 120%;
  padding: 0px;
}

/* RTE-Editor V.10 - eingerückte Liste */
.ce-bodytext  {
   font-size: 13px;
}

/* linker Rand in Rezepte und Überweisung */
.p_edit1 {
  font-family: Tahoma,Verdana,sans-serif;
  font-size: 15px;
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  line-height: normal;
  padding-left: 5px;
  padding-bottom: 5px;
}

.trennung {
        -ms-hyphens: auto;
        -webkit-hyphens: auto;
        hyphens: auto;
    }

h1 {
  font-family: Tahoma,Verdana,sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: bold;
  color: #000099;
  }

/* Überschriften der Artikel */
h2 {
    font-size: 18px;
    font-style: normal;
    font-weight: bold;
    color: #000099;
   }

/* Unter-Überschriften der Artikel */
h3 {
   font-size: 16px;
    font-style: normal;
    font-weight: bold;
    color: #000099;
  }

h4 {
  font-family: Nunito-Bold, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: normal;
  line-height: 120%;
  color: #000099;
  margin: 0;
  padding: 0;
  }

h5 {
  font-family: OpenSans-Semibold, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: normal;
  line-height: 120%;
  color: #000099;
  margin: 0;
  padding: 0;
  }

h6 {
   font-family: Arial, sans-serif;
   font-size: 20px;
   font-style: normal;
   font-weight: bold;
   color: #000099;
   margin: 0;
   padding: 0;
   }

   h6 {
   /* Achtung  --H6--  wird auf der Startseite für die Normalschrift verwendet */
   font-family: Tahoma,Verdana,sans-serif;
   line-height: 140%;
   font-style: normal;
   font-size: 16px;
   font-weight: normal;
   color: #000000;
   }

/* Name im Kopfbereich rechts */
.s1 {
   font-family: OpenSans-Bold, sans-serif; 
   font-size: 24px;
   font-style: normal;
   font-weight: normal;
   line-height: 115%;
   color: #000099;
   margin: 0;
   padding: 0;
   }

/* Trennlinie zwischen Namen und Adresse im Kopf rechts */ 
.hr_kopf {
   margin-top: 6px;
   margin-bottom: 8px;
   opacity: 1;
   border: 1px solid #000099;
   background-color: #000099;
}

/* Schriften im CKE Editor------------------------------------------------------------------------------------ */
.rtetitel {
   font-family: Tahoma,Verdana,sans-serif;
   line-height: 150%;
   font-style: bold;
   font-size: 22px;
   color: #000099;
}

.rtefont {
   font-family: Tahoma,Verdana,sans-serif;
   line-height: 140%;
   font-style: normal;
   font-size: 16px;
   color: #000000;
}

#TabHeaderlinks {
   padding: 50px 0 0 20px;
}

hr {
   height: 2px;
   border-color:black;
}

#TabHeaderrechts td {
   font-family: Nunito;
   border-top: solid 1px;
   border-color:darkblue;
}

/*Klasse im RTE-Editor für zentrierte Textausgaben*/
.align-center {
   text-align: center;
}
/*Klasse im RTE-Editor für zentrierte Bildausgaben*/
.img-center {
   display: block;
   margin-left: auto;
   margin-right: auto;
}

.name-of-person  {
/*  Klasse wird im RTE-Editor vergeben*/
   font-family: Nunito-Bold, sans-serif;
   font-size: 16px;
   font-style: normal;
   font-weight: normal;
   color: #000099;
   line-height: 120%;
}

.sprechzeit {
   font-size:14px;
   line-height: 120%;
}
/* Spamschutz - nicht sichtbar im Browser, nur im HTML Code */
.nichtzusehen {
   display:none
}

.kontakt_titel {
   font-size: 15px;
   font-weight: bold
}
.kontakt {
   font-size: 14px;
}

.tab-5 {
   padding-left: 5px;
}
.tab-25 {
   padding-left: 25px;
}
.tab-30 {
   padding-left: 30px;
}

/* ---------------- Material Icons ----------------- */

.material-icons {
   font-family: 'Material Icons';
   font-weight: normal;
   font-style: normal;
   font-size: 24px;  /* Preferred icon size */
   display: inline-block;
   line-height: 1;
   text-transform: none;
   letter-spacing: normal;
   word-wrap: normal;
   white-space: nowrap;
   direction: ltr;
 
   /* Support for all WebKit browsers. */
   -webkit-font-smoothing: antialiased;
   /* Support for Safari and Chrome. */
   text-rendering: optimizeLegibility;
 
   /* Support for Firefox. */
   -moz-osx-font-smoothing: grayscale;
 
   /* Support for IE. */
   font-feature-settings: 'liga';
 }

/* eine bestimmte Größe bereitstellen */
.material-icons.md-15 { font-size: 15px; }
.material-icons.md-18 { font-size: 18px; }

/* ------- respoinsive Container --->  verwendet in Google Anfahrtsmap ------------------------
------------------------------------------------------------------------------------------------*/
.responsiveContainer {
   position: relative;
   padding-bottom: 59%;
   height: 0;
   overflow: hidden;
 }
 
 .responsiveContainer iframe {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
 }

 
 /* ------- Gestaltung des Terminbuttons ----------------------------------------------------------
    die ID - hier c5 wird von Typo3 zugeweisen , in anderen Projekten übere den Inspektor auslesen 
    -->  nichtmehr nötig, da jetzt im Frame und deshalb Direktaufruf   

    #c5 {
      text-align: center; margin: 50px auto; margin-bottom: 120px;
    }   */