@charset "utf-8";
/* CSS Document */
/*
@font-face {
    font-family: 'Swis721ThBTThin';
    src: url('fonts/swiss_721_thin_bt-webfont.eot');
    src: url('fonts/swiss_721_thin_bt-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/swiss_721_thin_bt-webfont.woff') format('woff'),
         url('fonts/swiss_721_thin_bt-webfont.ttf') format('truetype'),
         url('fonts/swiss_721_thin_bt-webfont.svg#Swis721ThBTThin') format('svg');
    font-weight: normal;
    font-style: normal;

}
*/

@font-face {
font-family: 'Swiss 721 Light Condensed BT';
font-style: normal;
font-weight: normal;
src: url('fonts/swisscond/swiss721LTCNBTl.woff') format('woff');
}


/* html{ margin:0;padding:0} */
body{ margin:0;padding:0;/* margin-left:auto;margin-right:auto; */font-family: 'Swiss 721 Light Condensed BT'; color:#333c3d;xbackground-color:#CCC}


h1{}
h2{}
h3{}
h4{}
p{	font-size: 1.2rem;font-size: 18px; line-height:28px }
a{ color:#333c3d;text-decoration:none}
a:hover,a.active{color:#27bcc5;text-decoration:underline}


#wrapper{width:100%;
			max-width:1655px;
			min-width:965px;
			/* margin-left:auto;
			margin-right:auto; */
			border:1px solid #ccc;
			margin-top:0px;
			margin-bottom:0px;
			padding:0px;
			background-image:url(graphics/content-bg.jpg);
			background-repeat:repeat-y;
			background-size:contain;
}
#header{ width:100%}
#header-desktop {display:block}
#header-mobile {display:none}

.leftrow{ float:left;width:12%;border-right:0px solid red}

#content1{ position:relative;
			margin-top:0px;
			width:100%;
			background-image:url(graphics/content-bg.jpg);
			background-repeat:repeat-y;
			background-size:contain;
			z-index:10;
			border:0px solid red }

#ventana{text-align:center; position:relative; left:35%; width:25%;}
			
#content2{ width:100%;
			background-image:url(graphics/bg-row3.jpg);
			background-repeat:repeat-y;
			background-size:contain;
			margin-top:-5px;
			padding:0px;
			padding-top:20px;
			border:0px solid green }

.blocks{ 	float:left;width:28.35%;
			border:1px solid #931414;
			background-color:#dfe0df;
			margin:5px 3.2% 30px 0px;
			padding:1%;
			border-radius: 3px;
			-moz-box-shadow: 0 0 5px 8px #888;
			-webkit-box-shadow: 0 0 5px 8px#888;
			box-shadow: 0 0 10px 10px #a2a2a1;
			cursor:pointer;
			}
			
.blocks:hover{background-color:#dfe0df}		
			
.blocks img { float:left;width:40%; margin-right:3%;border:1px solid #fff}			
.blocks p 	{ font-size:14px; margin-top:0px;margin-bottom:2px}

.blocks td 	{font-size:0.7em;font-size:12px;}
.s2 		{ text-align:right}
/*			
#footer{width:100%;background-image:url(graphics/bg-row3.jpg) ;background-repeat:repeat-y;background-size:contain;margin:0px;border:0px solid #ccc}
*/
#foundation 			{ height:60px;width:100%;background-image:url(graphics/bg-footer.jpg) ;
						background-repeat:repeat-y;background-size:100% auto;margin-top:-5px;}
.trennlinie 	 		{ width:100%;margin:0px;padding:0px;margin-top:-10px}
#foundation a 			{ font-size:14px;color:#fff;padding-right:2%;padding-top:12px}
#foundation a:hover 	{ color:#fff}


.next p 				{ font-size:14px}
.next a 				{ font-size:14px;color:#27bcc5;text-decoration:underline}

#navigation 			{ text-align:right; margin:60px 12% 0 0}
#navigation a 			{font-size:0.8em;font-size:14px}

#leftblock2				{ margin-top:80px;margin-right:12%;text-align:right;font-size:14px}
#leftblock3				{ display:none}

#text 					{ position:relative; float:left;width:38%;border:0px solid red;margin:0px 5% 40px 5%;z-index:10}

#mainimage 				{ float:left;width:20%;border:0px solid red;padding-top:20px;text-align:justify}
#mainimage p 			{ font-size:11px}
#mainimage-mobile 		{display:none;float:left;width:100%}

.spacer 				{position:relative;width:100%;height:1px;border:0px solid green;clear:both}

.demo p 				{ font-family: 'Swiss 721 Light Condensed BT'; color:#333c3d;}




/********** Sidemenu + Navigation *********/

#hamburger 			 	{ position:fixed; font-size:32px;cursor:pointer;margin-top:50px;left:2%;display:none; color:#27bcc5}
.sidenav  			 	{ width: 0; position: fixed; z-index: 30; margin-top:0px; left: 0; background-color: #fff; 
						  border:1px solid #c1c1c1; overflow-x: hidden; overflow: hidden; transition: 0.5s; padding-top: 0px; padding:40px 0 40px 0px}
 #mm06 				 	{ float:right; height:14px;text-align: left; width:80%;padding-left:2%;margin-bottom:10px }
.sidenav a  		 	{ text-decoration: none; display: block; transition: 0.3s;}
.sidenav a:hover,
.offcanvas a:focus  	{}
.close 			 		{ top:20px}
.sidenav ul 	 		{ padding-left:12%; margin-top:-10px}
.sidenav ul ul 	 		{ margin-left:0%}
.sidenav li 	 		{ list-style-type: none;padding-left: 0px;margin-left: 0px;text-indent: 0px}
.sidenav .row 	 		{ height:14px;top:0px;margin-top:-12px}
.sidenav .closebtn   	{ position: absolute; top: 0;	left: 2%;	margin-top:-8px;font-size: 32px; border:0px solid #999 }


#katmenu 			 	{ width:89%;padding-left:0%;padding-right:0%;min-width:89%;margin-bottom: 30px;
						  margin-top:425px; margin-top: 40px;border:0px solid #ccc} 
#katmenu 			 	{ z-index:1} 
.hidden 		 		{ display:hidden}
.fade 			 		{ opacity: 0.90;transition:0.5s}
.fade:hover 	 		{ opacity:1;transition:0.5s} 
.fade img 		 		{ width:96px;height:65px}
.balken 		 		{ float:left;width:96.4%;padding-left:2.6%;}
.cimg 			 		{ float:left;position:relative;width:48%;width:96px;height:60px; margin-top:6.8px;z-index:10;overflow:hidden} 
.mtext 			 		{ margin-top:-25px;position:relative;color:#fff;font-size:12px; padding-left:5%;z-index:20;
						  text-shadow: 2px 2px 1px #666 }
.mtext a,.mtext a:hover	{ color:#fff}
.mtext a:hover 		 	{ text-decoration:underline}



#modalleft {float:left;width:650px}
#modalframe {width:600px;height:450px}
#modalframe-handy {display:none}

.show-mobile		{display:none}	


.modalDialog {
  position: Fixed;
  /* font-family: Verdana, Sans-Serif; */
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 99999;
  opacity: 0;
  transition: opacity 400ms ease-in;
  pointer-events: None;
}
.modalDialog:target {
  opacity: 1;
  pointer-events: Auto;
}
.modalDialog > div {
  width: 500px;
  max-width: 90%;
  position: relative;
  margin: 10% Auto;
  padding: 20px 10px 20px 10px;
  border-radius: 30px;
  background-color: #FFFFFF;
  /* background: linear-gradient(#ffffff, #666); */
  cursor: Default;
}
.close {
  background-color: #ff0000;
  opacity: 1.0;
  color: #ffffff;
  line-height: 30px;
  width: 30px;
  position: Absolute;
  right: -12px;
  text-align: Center;
  top: -10px;
  text-decoration: None;
  font-size: 14px;
  font-weight: Bold;
  border-radius: 12px;
  box-shadow: 5px 5px 8px #000000;
}
.close:hover {
  background-color: #00D9FF;
}







/* Tablet view */
/* @media screen and (max-width:769px) { */
@media screen and (max-width:769px) {
#wrapper{width:769px;
			/* margin-left:auto;
			margin-right:auto; */
			max-width: 769px;
			border:0px solid red;
			margin-top:0px;
			margin-bottom:0px;
			padding:0px;
			background-image:url(graphics/content-bg.jpg);
			background-repeat:repeat-y;
			background-size:contain;
}
#text		{border:0px solid blue;width:50%;margin-left:150px}	
#mainimage-mobile {display:block;width:100%;float:left;border:0px solid red;margin-left:0px }	
#mainimage-mobile img {padding-top:0px }		
#mainimage {display:none}	
#navigation {display:none}
	
#hamburger		 	{ display:block;position:fixed; font-size:3em;cursor:pointer;margin-top:10px;left:2.0%;
					z-index:200;background-color:none}

	.sidenav 		 	{ height: auto;  width: 0; margin-top:10px;  padding:40px 0 40px 0px;left: 0; 
						opacity: 0.95; z-index:300; background-color:#676d73;background-color:#fff}

/*	#mm06 			 	{ float:right; height:14px;text-align: left; width:50%;padding-left:0%;margin-bottom:10px; } */
	.sidenav a 		 	{ font-size:1.4em;xcolor:#fff;text-decoration: none; display: block; padding-left:30px; transition: 0.3s}
	.sidenav a:hover, 
	.offcanvas a:focus 	{}
	.close			 	{ top:20px}
	.sidenav ul 	 	{ margin-left:10%; margin-top:0px;/*line-height: 18px*/}
	.sidenav ul ul 	 	{ margin-left:0%}
	.sidenav li 	 	{ list-style-type: none;padding-left: 0px;margin-left: 0px;text-indent: 0px;padding-bottom:2em;}
	.sidenav .row	 	{ height:14px;top:0px;margin-top:-12px}
	.sidenav .closebtn  { position: absolute; top: 0;	left: 0px;	margin-top:0px;font-size: 32px;}
	
	#leftblock2			{ display:none}
	#leftblock3			{ display:block}
	#modalleft 			{ float:left;width:100%}
	#modalframe 		{width:100%;height:400px}
	
	
.blocks{ 	float:left; width:40%;
			border:1px solid #931414;
			background-color:#dfe0df;
			margin: 5px 0 20px auto;	
			padding:1%;
			cursor:pointer;
			}	
	
#block1 {margin-left:152px}	
.blocks td 	{ font-size:11px;}
.s2 		{ font-size: 11px; }
	
#foundation{ height:60px;width:100%;margin-top:0px;}
.trennlinie{ width:100%;margin:0px;padding:0px;margin-top:-10px}

#foundation a{font-size:14px;color:#fff;padding-right:2%;padding-top:12px}
#foundation a:hover{color:#fff}
#foot navigation { border: 2px solid #fff}
.desktop	{ padding-left:20px; display: none}		
.show-mobile		{display:block}		
}

/* Mobile view */
@media screen and (max-width:480px) {
	
#wrapper{width:100%;
			min-width:440px;
			/* margin-left:auto;
			margin-right:auto; */
			border:1px solid blue;
			margin-top:0px;
			margin-bottom:0px;
			padding:0px;
			background-image:url(graphics/content-bg.jpg);
			background-repeat:repeat-y;
			background-size:contain;
}
#header{ position: static}
#header-desktop {display:none}
#header-mobile {display:block}
	
	
#mainimage-mobile {display:block;width:100%}		
#mainimage {display:none}	


.blocks{ 	float:left; width:70%;
			border:5px solid #931414;
			background-color:#dfe0df;
			margin:5px auto 30px auto;
			padding:1%;
			cursor:pointer;
			}
#content2{ width:100%;
			background-image:url(graphics/bg-row3.jpg);
			background-repeat:repeat-y;
			background-size:contain;
			margin-top:-5px;
			padding:0px;
			padding-top:20px;
			border:0px solid green; }	

	
#leftblock2{ margin-top:80px;margin-right:12%;font-size:11.5px;text-align:right;display:none}
#leftblock2 p{font-size:14px}	
	
#modalleft 			{ float:left;width:100%}
#modalframe 		{ width:100%;height:400px}
#modalframe-handy 	{ display:blocks}	
#navigation {display:none}
#text		{margin-left:15%; margin-right:15%;border:0px solid blue;width:60%}
#block1 	{margin-left:15%}	
.blocks td 	{font-size:0.7em;}	
.s2 		{ font-size: 9px; }	
	
.desktop	{ padding-left:20px; display: none}	
.show-mobile		{display:block}	
}