body {
		width: 360px;	
	}
	
	#wrapper {
		width: 360px;
		overflow: hidden;
		margin: 0px;
		padding-top: 0px;
	}
	
		/* ------------------------------------------ */
		#pageheader {
			height: 100px;
		}	
			#pageheader h1 {
				width: 100%;
			}
			
				#pageheader #banner {
				    height: 110px;
				}
				
					#pageheader #banner p {
						display: none;
					}
				
				#pageheader h1 span {
					background-size: 145% auto;
					background-position: 0px -10px;
				}
				
			#pageheader #hnav {
				display: none;
			}
		
		
		#main1 {
			width: 100%;
			display: flex;
	  		flex-direction: column-reverse;	
		}
		
			/* nav system ------------------------------------------ */
			#left {
				float: none;
				position: absolute;
				left: 0px;
				top: 0px;
				z-index: 11;
				width: 100%;
			}
				#left h2 {
					display: block;
					background-image: url("menu_closed.svg");
					background-repeat: no-repeat;
					background-position: 310px 26px;
					margin: 0px;
					padding: 0px;
					width: 100%;
					height: 80px;
					color: transparent;
				}
				#left h2.open {
					background-image: url("menu_open.svg");
				}
				
				
				
				#left ul {
					
					display: none; 	
					margin-top: 0px;
					position: absolute;
					right: 0px;
					left: 0px;
					top: 80px;
					background-color: rgba(255,255,255,1);
					padding-top: 20px;
					padding-bottom: 40px;
					border-style: none none solid none;
					border-width: 1px;
					border-color: #000000;
				}
					#left ul li {
						margin: 0px 20px;
						padding: 5px 0px 5px 0px;
						border-style: none none solid none;
						border-width :1px;
						
					}	
						#left ul li a {
							background-image: none !important;	
							font-weight: normal;
							padding: 0px;
						}
				
			
			/* cntent ------------------------------------- */	
			#middle {
				padding: 0px;
				margin: 0px;	
			}
				#middle p {
					font-size: 15px;
					line-height: 1.8;	
				}
				#middle h2 {
					font-size: 140%;
				}
				#middle h3 {
					font-size: 120%;
				}
				#middle img {
					width: 320px;
					height: auto;	
					margin-left: 20px;
				}
				
				
				#middle .download,
				#middle .linkout {
					padding-left: 40px;
					background-position: 20px 8px;
				}
				
				#middle .mehr {
					padding-left: 30px;
					background-position: 20px 8px;
				}
				#middle li {
					background-position: 0px 4px;
				}
				
				
				
				
				#middle .project {
					height: auto;	
				}
				
				/* required here: /proj/pages/entdeckerrouten_nordenhamburgs.htm */
				#middle .container {
					width: 100%;
				}
				#middle > ul  {
					padding: 0px 20px;
					margin-left: 20px;
				}
					#middle > ul > li {
						/* padding: 0px;	/* digi/dataprotection.htm */	
					}
				
				#middle .imgelementleft {
					margin: 5px 15px 5px 0px;
				}
				
				/* http://localhost/digikultur/website/tech/pages/digitour_basic.htm
				*/
				
				#middle .imgelementright {
					margin: 0px 20px 15px 0px;
				}
				
				
			/* ------------------------------------------ */
			#right {
				float: none;
				width: 100%;
				display: none;
				padding-top: 10px;
				line-height: 1.5
			}
				#right h2.introRight {
					text-transform: uppercase;
					color: #666666;
					border-color: #666666;
					border-width: 3px;
					border-style: solid none none none;
					margin: 30px 20px 10px 20px;
					padding-left: 0px;
					padding-top: 10px;
					padding-bottom: 20px;
					font-size: 110%;
				}
				
				
				#right img {
					width: 320px;
					height: auto;	
					margin-left: 20px;
				}
				
				/* http://localhost/digikultur/website/proj/pages/barlach.htm */
				#right p img {
					margin-left: 0px;
					/* width: 280px; */
					/* height: auto; */	
				}
				
				#right .mehr {
					padding-left: 30px;
					background-position: 20px 3px;
				}
		
		/* ------------------------------------------ */	
		#footer {
			width: 100%;	
			height: auto;
			padding-bottom: 20px;
		}
			#copywrite {
				padding: 0px;
				position: static;	
			}
			#footnav {
				float: none;
				padding: 0px;
				position: static;	
			}  
			
			#footer > ul {
				padding: 20px;	
			}	
			#footer > ul li {
				font-size: 130%;
				list-style-type: none;
				
				border-style: solid none solid none;
				border-width: 1px;
				border-color: #2A4D93;	 
				margin-top: -1px;
			}	
			
			#footer a {
				display: block;
				padding: 6px 0px 6px 0px;
				text-decoration: none;	
				color: #2A4D93;	
			}
			
			#footer #footnav li {
    			float: right;
    			margin-right: 30px;
    			width: 22px;
			}
				#drucken {
					display: none;	
				} 
			
			#footer #anfang a {
    			padding: 2px 0px 6px 0px;
			}
			
		/* common paddings --------------------------- */
		h1, h2, h3, h4, h5, h6, p, address {
			padding: 0px 20px;	
		}