@font-face {
				font-family: "HeidelbergGothicMl";
				src: url("https://onlinehelp.prinect-lounge.com/fonts/HeidelbgGothicMl.otf");
}
* {     
		font-family: "HeidelbergGothicMl", Arial, sans-serif !important;
		margin: 0;
		padding: 0;
		
}

/*Google Suchfeld */
#Suchen {
        
        /*margin: 0 auto;*/
        margin-left: 1em;
        height: 4em;
        width:50%;
        text-align: left;
        justify-content: center;
        
}
#Suchen:hover, #Suchen:focus {
        width: 95%;
        transition: all 0.5s ease-in-out;
        /*border-color: #00a0e6;*/
}
#Suchen label {
        margin: 0;
        font-size: 1em;
        color: #003f77;
        display: inline;
        font-weight: 400;
  
}
form {
        margin: 0;
        min-width: 165px;
        appearance: none;
  
}

input#suche {
        border-style:   solid;
        border-width:   2px;
        border-color:   #00a0e6;
        border-radius:  0.2em;
        font-size:      1em;
        width:      60%;
        height: 2em;
        margin-left: 0;
        padding: 0;
}


input#button {
        background-color: transparent;
        border: none;
        font-size: 2em;
        margin: 0;
        cursor: pointer; 
        vertical-align: middle;
        padding: 0;
}
input#suche:focus {
        border-color: #00a0e6;
        outline: none;
        border-width: 2px;
}

input#suche:hover::placeholder {
        color: silver;
}
input#suche:focus::placeholder {
        color: transparent;
}
/* Ende Google Suchfeld */


h1 {
    font-size:      1.5rem;
    color:          grey;
    font-weight:    450;
	margin-top: 1rem;
	margin-bottom: 1.5rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
        
}
div.title {
	background-color: #00a0e6;
	height: 70px;
  
}
div.header {
	
	
	/*background-image: url(logo.png);
	background-repeat: no-repeat;
	background-size: auto 50%;
	background-position: 1em;*/
	width: 100%;
	margin-top: 0;
	/*margin-bottom: 2em;*/
	margin-right: 0;
	position: sticky;
	position: -webkit-sticky;
	top: 0;
	/*border-bottom: 1em solid #fff;*/
	
}
div.logo {
	/*background-image: url(Logo_HD.png);
	background-repeat: no-repeat;
	background-position: right top;*/
	background-color: white;
	height: 75px;
	text-align: right;
  z-index:1;
	
}

div.products {
	padding-bottom: 2em;
	padding-left: 1em;

}
div.content {
	
	width: 100%;
	float: left;
	margin-right: 1em;
	max-width: 465px;
	min-width: 300px;
	border: thin solid silver;
	border-radius: 0.2em;
	padding: 0.5em;
	margin-bottom: 1em;
	
}
div.header p {
	color: #fff;
	font-size: 1.8em;
	padding-left: 1em;
	padding-top: 0.8em;
	font-family: "Trebuchet MS", HelveticaNeue-Light, Verdana, Arial, sans-serif;
}

div details div h2 {
		font-size: 1.2rem;
		color: #000;
		font-weight: normal;
		margin-left: 1em;
}

div.intro {
	margin-top: 0;
}

div.intro p {
		line-height: 1.5rem;
		padding-left: 1em;
		max-width: 900px;
		margin-bottom: 1em;
		/*text-wrap: balance;*/
	
		
}
div.intro a {
		color: #004dcc;
		text-decoration: underline;
}
div.intro a:hover {
		color: #004dcc;
		
}
details {
	
		background: #fff;
		border: 1px solid #00a0e6;
		border-radius: 3px;
		margin-bottom: 1rem;		
		
		
}
details details {
	
		background: #fff;
		border: 0px solid black;
		border-radius: 3px;
		margin: 0;
		padding-left: 3em;
		
		
}
details div details {
		padding: 0 1rem 0 1rem;
		margin: 0;
		background: #fff;
		color: #000;
		font-size: 1.0em;
		cursor: pointer;
}
details div details summary {
		color: #000;
		background: #fff;
}
details div details p {
		margin-top: 0;
		margin-bottom: 0.3em;
		padding-top: 0;
		padding-bottom: 0;
}
details.color2 {
	
		background: #fff;
		border: 1px solid #004178;
		border-radius: 3px;
		margin-bottom: 1rem;		
		
		
}
details.color3 {
	
		background: #fff;
		border: 1px solid #ffc800;
		border-radius: 3px;
		margin-bottom: 1rem;		
		
		
}
summary:hover {
		color: silver;
		
}
summary.color2:hover, summary.color3:hover  {
		color: silver;
		
}
summary {
		padding: 1rem;
		background: #00a0e6;
		color: #fff;
		font-size: 1.5em;
		cursor: pointer;
		text-wrap: balance;
				
}
summary.color2 {
		padding: 1rem;
		background: #004178;
		color: #fff;
		font-size: 1.5em;
		cursor: pointer;
				
}
summary.color3 {
		padding: 1rem;
		background: #ffc800;
		color: #fff;
		font-size: 1.5em;
		cursor: pointer;
				
}
summary div {
		padding: 1rem 1rem 1px 1rem;
		
}
details div p {
		padding-left: 2.5em;
		padding-top: 0.5em;
		padding-bottom: 0.3em;
		line-height: 2rem;
		text-wrap: balance;
	
}
details div p a {
		color: #000;
		font-weight: bold;
		font-size: 1.2em;
}
.direct {
		border: 1px solid #00a0e6;
		border-radius: 3px;
		background: #00a0e6;
		margin-bottom: 1rem;
}
.direct.color2 {
		border: 1px solid #004178;
		border-radius: 3px;
		background: #004178;
		margin-bottom: 1rem;
}
.direct.color3 {
		border: 1px solid #ffc800;
		border-radius: 3px;
		background: #004178;
		margin-bottom: 1rem;
}
.direct > a {
        display:        block;          
        
        padding:        1rem;
        background-color: #00a0e6;
        font-size:      1.5em;
        text-decoration: none;
        
}
.direct.color2 > a {
        display:        block;          
        
        padding:        1rem;
        background-color: #004178;
        font-size:      1.5em;
        text-decoration: none;
        
}
.direct.color3 > a {
        display:        block;          
        
        padding:        1rem;
        background-color: #ffc800;
        font-size:      1.5em;
        text-decoration: none;
        
}

a.direct:hover, div a {
        color:          #004dcc;
        text-decoration: none;  
        
        
}

div.direct a {color: #fff;
	
}
div a:hover {
        color:          silver;
		text-decoration: underline;
}
div.color2 a:hover {
        color:          silver;
		text-decoration: underline;
}
div.color3 a:hover {
        color:          silver;
		text-decoration: underline;
}
div.footer {
	
	clear: both;
	padding-top: 1.5em;
	padding-left: 1em;
	margin-bottom: 2em;
	font-size: 0.8em;
	font-family: Arial, sans-serif;
	
	
}
div.footer #note {
	font-size: 1.5em;
	font-family: HelveticaNeue-Light, Verdana, Arial, sans-serif;
	padding-left: 0.5rem;
	margin-bottom: 2em;
	
}

div.footer a:hover {
	color: #000;
}
div.footer p span {
		display: inline;
		
}
div.footer p span a {
		color: #000;
		text-decoration: underline;
}
/* Der Verzögerungseffekt */
details[open] summary ~ * {animation: sweep .7s ease-in-out;}




@keyframes sweep {
  0%    {opacity: 0; margin-left: -20px}
  100%  {opacity: 1; margin-left: 0px}
}

/* Der Verzögerungseffekt Ende*/

.akkordeon {
        //max-width:       40em;
        padding:         0.2em;
        font-family:     HelveticaNeue-Light, Verdana, Arial, sans-serif;
      
         
}



.akkordeon > a {
        display:        block;          
        margin-top:     0.2em;
        margin-bottom:  0.2em;
        padding:        0.2em;
        background-color: #00a0e6;
        font-size:      1.5em;
        text-decoration: none; 
        
}

.akkordeon a:hover, .akkordeon a {
        color:          #ffffff;
        text-decoration: none;
        display:        block;
        
        
}
.akkordeon a:hover {
        color:          silver;
}

.akkordeon p a:hover, .akkordeon p a {
        
        font-weight:     bold;
        color:           #000000; 
        margin:          0.5em 0; 
        display:         block; 
            

}


.akkordeon p {
        max-height:     0;
        overflow:       hidden;          
        transition:     max-height 1s;
        font-size:      1.5em;
        border:         0;        
        margin:         0;
        padding:        0 0.2em;       

}

.akkordeon p:target span {
        display:        block;
        color:          silver;        

}

.akkordeon p:target {
        max-height:     100em;
        transition-delay: 0.5s;
        border:         0;       
}

.akkordeon p span {
        color:          silver;

}