@charset "utf-8";

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	/*font: inherit;
	*/vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

* {   
 	padding: 0; margin: 0; 
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}



@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../plug/open-sans-v15-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Regular'), local('OpenSans-Regular'),
       url('../plug/open-sans-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../plug/open-sans-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../plug/open-sans-v15-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../plug/open-sans-v15-latin-600.eot'); /* IE9 Compat Modes */
  src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
       url('../plug/open-sans-v15-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../plug/open-sans-v15-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../plug/open-sans-v15-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}


html{
	height:100%;
}
    
body { 
	width:100%;
	height: 100%; margin:0px;
	/*-ms-touch-action:none; 
	-webkit-user-drag:none;*/
	-ms-user-select: none;
	font-size:8px; /* davon abgeleitet, werden alle anderen Fontgrößen in % dargestellt */
	/*font-family: 'HelveticaNeueW01-45Ligh', Times, HelveticaNeue, Helvetica, Arial, sansserif;*/
	font-family: 'Open Sans', sans-serif;	
	font-weight:400;
	font-style: normal;
	line-height:16px;
/*	text-rendering:optimizeLegibility;*/

	overflow-x:hidden;
	overflow-y:hidden;
    background-color:#14191f;
}

.clearfix,
.clearfix:after {
  clear: both;
}

/* ################################### Color Classes */


.fgWhite {	color:#FFFFFF;	}

.fgLight {	color:#8d8d8d;	}

.bgWhite {	background-color:#FFFFFF;	}

.bgMed {	background-color:#646464;	}

.bgDark {	background-color:#14191f;	}


/* ################################### Link Classes */

a {
	text-decoration:none;
	font-weight:bold;
	color:#404040;
}

/*******************************************   left  ***************************************/

#left {
    position:absolute;
    left:0px;
    top:0px;
    width:25%;
    max-width:32%;
    height:100%;
    padding:100px 0px 50px 50px;
    z-index:608;
}

.logo {
		position:absolute;
    margin-top:-40px;
    width:100%;
    height:auto;
    z-index:900;
}

    .logo .l1 {
/*
        font-size:165%;

*/      font-size:240%;
        line-height:140%;
        white-space:nowrap;
        color:#bbbbbb;
    }

    .logo .l2 {
        font-size: 240%;
        line-height: 140%;
        white-space:nowrap;
    }



#menuSmallSym {
    position:absolute;
    width:20px;
    height:20px;
    left:50px;
    bottom: 50px;
    background-image:url(../media/menu-open.png);
    background-repeat:no-repeat;
		cursor:pointer;
 /*
   z-index:602;

*/    margin-right:0px; /* für mobil */
 }
 
 #menuSmallStartSym{
    position:absolute;
    width:20px;
    height:20px;
    left:100px;
    bottom: 50px;
    background-image:url(../media/start1.png);
    background-repeat:no-repeat;
		cursor:pointer;
    margin-right:0px; /* für mobil */
 }
 
 .mainMenu {
 		position:absolute;
    width:auto;
		left:50px;
		bottom:0px;
		height:auto;
    z-index:500;
		display:none;
		padding-top:50vH;
		padding-right:35px;
		padding-bottom:50px;
 }
 		
 		 .mainMenu #menuWrapper {
 		 		margin-bottom:30px;
 		 }
 
		 .mainMenu #menuCloseSym {
		    position:absolute;
		    width:20px;
		    height:20px;
		    left:0px;
		    bottom: 50px;
		    background-image:url(../media/menu-close.png);
		    background-repeat:no-repeat;
			cursor:pointer;
		 }

 		.mainMenu h2 {
        font-size: 200%;
        line-height: 170%;
        font-weight:normal;
 		}
 			
 			.mainMenu h2 a, .mainMenu p a, .mainMenu li a {
 				color:#8d8d8d;
 				font-weight:normal;
 			}
 
			.mainMenu p {
 	   		cursor: pointer;
		    font-size: 165%;
		    line-height: 170%;

 			}

 
  		
		 .mainMenu ul{
		   	cursor: pointer;
		    font-size: 165%;
		    line-height: 170%;
		    list-style-type: none;
		    white-space: nowrap;
			}

		 .mainMenu li{
		    list-style-type: none;
		    padding-left: 85px;
		    white-space: nowrap;
			}
			
			.mainMenu #staticMenu {
					margin-top:15px;
			}
			
			
			.mainMenu .active {
					color:#ffffff;
					font-weight:bold;
			}

			.subLevel {display:none;}
			
			#m3 {
				/* sonderfall archiv */
				font-size:83%;
			}

/*			.floatBlock { float:left; border:1px solid #ff0000; }
*/			
			.datenschutz {
				overflow-y: scroll !important;

			}
			#datenschutzText{
				color: #ffffff;
				font-size: 0.8rem;
				padding-top: 10%;
				width: 200%;
			}

			#static_kunden {
				margin-top: 30px;
			}

			#static_impressum {
				padding-bottom: 10px;
			}


            .staticText {
             	color:#8d8d8d;
            	font-weight:normal;
                display:none;

            }

            .staticText h1,h3 {
                color:#ffffff;
                font-weight:bold;
                font-size: 200%;
                line-height: 170%;
            }

            .innerText{
                overflow-x:hidden;
                overflow-y:auto;
                max-height:90%;
                max-width:94%;
                padding-bottom:15px;
            }

            .textTable{
                color:#8d8d8d;
            	font-weight:normal;
            	font-size:165%;
            	line-height:145%;
            }

            .textTable td:first-child{
                padding-right:15px;
            }

            .txtBlock {
                padding-left: 115px;
                float:left;
            }
            			.txtBlock p {
                		    font-size: 165%;
                		    line-height: 170%;
             			}

                        .txtBlock a {
                            color:#ffffff !important;
                            font-weight:bold !important;
             			}

            #kunden, #person {
                width:300%;
            }

/*******************************************   Contentwrapper  ***************************************/

#right {
    position:absolute;
    right:0px;
    top:0px;
    width:100%;
    height:100%;
    padding:100px 100px 50px 33%;
}

.contentWrapper{
    width:100%;
    height:100%;
    left:0px;
    top:0px;
    background-repeat:no-repeat;
    background-position:center center;
    background-size:contain;
}

#contentImage {
	width:1px;height:1px;opacity:0.1;overflow:hidden;
}

.contentWrapper .next {
		width:50%;
		height:100%;
/*		border:1px solid #ff0000;*/
		top:0px;
		left:0px;
		float:right;
        cursor: url(../media/cur-rechts.svg), auto;
}

.contentWrapper .previous {
		width:50%;
		height:100%;
		top:0px;
		left:50%;
        cursor: url(../media/cur-links.svg), auto;
}


#wrongorientation {
	display:none;
}


/*******************************************   Media Queries  ***************************************/



@media screen and (max-width: 1280px){
	/*  body {
	      font-size:8px;
      }*/

      #left {
            height:100%;
            padding:50px 0px 25px 25px;
            /*padding-left:25px;*/
            width:38%;
            max-width:38%;
            display:block;
        }

         #right {
            width:100%;
            height:70%;
            top:17%;
            padding:0px 25px 0px 33%;
            padding-top:0px !important;
            display:block;
        }

				.logo {
							margin-top:-20px;
				}

				#menuSmallSym, .mainMenu {
							left:50px;bottom:25px;
				}
				
        #menuSmallSym {
            left:25px;
            bottom: 4%;
            z-index:500;
            margin-right:0px; /* für nicht mobil */
        }

				#menuSmallStartSym{
            left:75px;
            bottom: 4%;
            z-index:500;
            margin-right:0px; /* für nicht mobil */
				}
				.mainMenu #menuCloseSym{
					bottom:4%;
				}
				
         .mainMenu {
                width:80%;
                left:25px;
                bottom:0px;
               
         }
    		 .mainMenu ul{
    		   /* font-size: 180%;
       		    line-height: 220%;*/
				line-height: 180%;
   			}

    		 .mainMenu li{
    		    padding-left: 17%;
    		 }


        .mainMenu #menuWrapper {
 		 						margin-bottom:30px;
                overflow:auto;
                max-height:85%;
 		 		}

				#wrongorientation {
					display:none;
				}

}


@media screen and (max-width: 800px) and (orientation: portrait){

        body {
/*
            font-size:6px;

*/        }


        #left {
            width:100%;
            max-width:100%;
            height:100%;
            display:block;
        }

        .logo {
            position:absolute;
            margin-top:-35px;
            z-index: 602;
        }

        #menuSmallSym {
            margin-right:1px; /* für mobil */
        }

        .mainMenu {
            width:90%;
        		/*height:82%;*/
        }

    		 .mainMenu li, .txtBlock{
    		    padding-left: 3%;
    		 }


        #right {
                top:18%;
                padding:0px 25px 0px 25px;
                z-index:609;
                display:block;
        }

        #kunden, #person  {
            width:95% !important;
            z-index:680 !important;
        }

				#wrongorientation {
					display:none;
				}

}

@media screen and (max-width: 800px) and (orientation: landscape){

			#wrongorientation {
				position:absolute;
				width:100%;height:100%;
				left:0px;top:0px;
				background-image:url(../media/sym-wrong-orientation-phone.png);
				background-position:center center;
				background-repeat:no-repeat;
				display:block;
			}
			
			#right, #left {
							display:none;
			}
									

/*        body {
            font-size:6px;
        }

        .logo {
            position:absolute;
            margin-top:-32px;
            z-index: 602;
        }

        .logo .l1 {
            float:left;
            margin-right:8px;
       }

        .mainMenu {
                width:95%;
        		height:82%;
        }

        #right {
                padding:0px 25px 0px 25px;
        }
*/
}

@media screen and (min-width: 1919px){
        body {
            font-size:7px !important;
			line-height:16px;
        }
}

@media screen and (min-width: 2000px) and (orientation: landscape){
        body {
            font-size:8px;
			line-height:17px;
        }
}