@font-face {
    font-family: "Source Sans Pro";
    src: url("https://trs.bg-ag.net/fonts/SourceSansPro-Regular.ttf") ;
}
@font-face {
    font-family: "Montserrat";
    font-weight: bold;
    src: url("https://trs.bg-ag.net/fonts/Montserrat-VariableFont_wght.ttf") ;
}
/* =================================================

Stand: Zweispaltiges Layout mit float und margin  
Datei: bildschirm.css

================================================== */

/* ====================================== 
  1. Kalibrierung und Restauration
  ====================================== */
 
*  { padding: 0; margin: 0; }
html { overflow-y: scroll; }

h2, h3, p, ul, ol { margin-bottom: 1em; }  
ul ul { margin-bottom: 0; } 
li {
	margin-left: 1em ; 
    list-style-type: none;

	} 
/* hier ggfs. Abstände für weitere Elemente restaurieren */

/* ====================================== 
  2. Allgemeine Styles 
  ====================================== */
body { 
  color: black; 
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 90%; 
  background-image: url("pic/XXX.jpg"); /* The image used */ 
  background-color: #ffffff; /* Used if the image is unavailable */
  background-position: right -2px bottom -2px; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: 100% auto; /* Resize the background image to cover the entire container */
  background-attachment: fixed;
  background-color: hsla(0,0%,100%,0.70);
  background-blend-mode: overlay;
}


h1 { 
	font-family: 'Montserrat', sans-serif;
	font-size: 110%;
	background-color:  #050B7F;
	color: white;
	padding:5px;
	
	margin-top:10px;
	margin-bottom: 5px;
	
 } 
 
h2 { font-size: 130%; } 
h3 { font-size: 110%; }

a { 
  text-decoration: none; 
  /* outline: none; */ /* nur wenn es Sie wirklich stört */
} 
a:link { color: #050B7F; } 
a:visited { color: #050B7F; } 
a:hover, 
a:focus { 
  border-bottom: 1px solid #050B7F; 
}
a:active { 
  color: white; 
  background-color: #050B7F; 
}
/* Allgemeine Klassen und IDs */ 
img#logo { 
  background-color: white;
  color: black;
  padding: 10px;
  z-index:0;
  width: 15%;
  height: auto;

} 

img#logo2 { 
  position:absolute;top:25px;left:470px;
  width:65px;
  z-index:1;
	
} 

.bildlinks { 
  float:left; 
  padding: 3px; 
  border: 5px solid #ccc; 
  margin-right: 10px; 
  margin-bottom: 10px; 
}
.bildrechts {
  float:right; 
  padding: 3px; 
  border: 5px solid #ccc; 
  margin-bottom: 10px;
  margin-left: 10px; 
}



.clearing { clear: both; } 

.inline {display:inline-block;}
/* ====================================== 
  3.  Styles für die Layoutbereiche 
  ====================================== */
#wrapper { 
  color: black; 
  width: 95%; 
  margin: 10px auto; 
  
}
#kopfbereich {
  position: relative; 
  color: black;
  padding: 10px 20px 10px 20px; 
}
  
#navibereich { 
  float: left; 
  width: 110px; 
  padding-left: 0px; 
  padding-top: 0px; 
  font-family: 'Montserrat', sans-serif;
}
#navibereich p { 
    padding:10px;
	margin:0;
	
	border-bottom: 1px solid #050B7F; 
     
}	
  #navibereich ul { 
    width: 12em; 
    border-top: 1px solid #822300; 
  }
  #navibereich li { 
    list-style-type: none; 
    border-left: 1px solid #050B7F; 
    border-bottom: 1px solid #050B7F; 
    margin: 0;
    
  }
  #navibereich a { 
    display: block;  /* ganze Fläche anklickbar machen*/
    text-decoration: none;
    color: white; 
    background-color: #4391FF;
    padding: 10px; 
    border-left: 3px solid #4391FF; /* nicht sichtbar */
  }
  #navibereich li.sie-sind-hier a { 
    color: white; 
    background-color:  #050B7F; 
    border-left-color: white;  /* ersetzt #ffe574 */ 
    border-bottom: none; /* Unterstreichung aus */
     
  } 
  #navibereich a:hover,
  #navibereich a:focus { 
    color: black;
    border-left-color: lightgrey; 
    border-bottom: none; 
  } 
  #navibereich a:active { 
    color: black;   
  }
 
 
 #Fahrzeugdaten{ 
  
  background-color: lightgrey; 
  float: left;	
  padding: 20px; 
  margin:1px;
  vertical-align: top;
 }
  #Betrieb{ 
	
	font-size:small; 
  background-color: lightgrey;
  float: left;	
  padding: 20px; 
  
  vertical-align: top;
 }
 
   #Zusatzinfo{ 
 
  background-color: lightgrey;
  float: left;	
  padding: 20px; 
  vertical-align: top;
  border:thin;
  border-style: dotted;
  
 }
 
 
 
 
#textbereich { 
 float: left;	
  padding-left: 40px; 
  margin-left: 50px; 
  
  vertical-align: top;
  width:75%;

  
  
  
}






#textbereich table {
	width: 100%;
	border-collapse: collapse;
	font-size: 12px;
	
	border-left: thin;
	border-right: thin;
}

#noformat table {
	width: 50%;
	border-collapse: collapse;
	font-size: 12px;
	
	border-left: thin	;
	border-right: thin;
}

#textbereich table.clean {
		width: 25%;
	border-collapse: collapse;
	font-size: 12px;
	
	border-left: thin;
	border-right: thin;
	
	
}
#textbereich table.noborder {
		width: 60%;
	border-collapse: collapse;
	font-size: 12px;
	
	border:0;

	
	
}

#textbereich table.noborder  td {
		width: 60%;
	border-collapse: collapse;
	font-size: 12px;
	
	border:0;

	
	
}

#textbereich input.number {
	width: 25px;
	
	
}

	
#textbereich table.clean td,th,tr{
	border: none;
	
}
			
				
								
#textbereich td    {
	
	vertical-align:top;
	text-align:left;
	padding: 5px;
	border: thin;
	border-top-style: thin;
	border-bottom-style:   thin;
	
	

}
				
#textbereich th    {
	vertical-align:top;
	text-align:left;
	padding: 7px;
	border: thin;
	border-top-style: thin;
	border-bottom-style:   thin;
	border-right-style: none;
	background-color: #050B7F;
	color: white;
	
}


hr {
	border: 0; 
	border-bottom: 1px dashed #ccc; 
	background: #999; 
	}




  

#textbereich button{
    font-family:'Montserrat', sans-serif;
	padding: 10px;
    margin-left: 10px;
    background-color: lightgrey;
    border-radius: 4px;
    transition-duration: 0.4s;
}
#textbereich button:hover {
    background-color: grey;
    color: white;
}
  
  
  
 #Soap_History{
  background-color: white;  /* Deckweiß */

}



#Soap_History  table.historypos {
	width:85%;
	border-collapse: collapse;
	font-size: 12px;
	background-color: white;
	border-bottom: solid;
	padding-bottom: 25px;
	
}

  #Soap_History  table.historyhead {
	width:85%;
	border-collapse: collapse;
	font-size: 12px;
	background-color: white;
	border-top: solid;
	
}
  
  
  
  
#fussbereich {
  clear: both;
  color: black;
  
  padding: 10px 20px 20px 20px;
  border-top: 1px solid #8c8c8c;
  margin-top: 0;
}

/* ======================================
  4. Sonstige Styles
  ====================================== */
/* Das Kontaktformular */




label { /* Beschriftung auf eigener Zeile */
  display: block;
  cursor: pointer;  /* Mauszeiger wird zur Hand */
  font-size:larger;
}




textarea {

  border: 1px solid #8c8c8c;
  margin-bottom: 1em;
}
input:focus,
textarea:focus {
  background-color: #ffeda0;
}

/* BUTTONS */






/* =======================================
   E N D E   D E S   S T Y L E S H E E T S
   ======================================= */
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
