/* roboto-100 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: local(''),
       url('../fonts/roboto-v30-latin-100.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto-v30-latin-100.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto-v30-latin-100.ttf') format('truetype'), /* Safari, Android, iOS */
}
/* roboto-300 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: local(''),
       url('../fonts/roboto-v30-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto-v30-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto-v30-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
}
/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('../fonts/roboto-v30-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto-v30-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto-v30-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
}
/* roboto-700 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local(''),
       url('../fonts/roboto-v30-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto-v30-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto-v30-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
}

body { color: #000000; background-color: #ffffff; font-family: "Roboto", sans-serif; font-weight: 300; -webkit-text-size-adjust: 100%; }
body, div, ul, li, header, section, article { margin: 0; padding: 0; border: 0; outline: 0; }
strong, em { font-weight: 300; }
p { margin-top: 0; }
a { text-decoration: none; color: #000000; }
a:visited { color: #202020; }
ul { list-style-type: none; }
em { font-style: normal; }
h1 { position: absolute; top: -1000px; }
noscript { font-size: 16px; line-height: 58px; text-align: center; width: 100%; color: #ffffff; background-color: rgba(0, 0, 0, 0.88); display: block; }
section { display: block; margin: 0 12px; }
article { display: block; }

#raum { position: relative; width: 480px; }
#sprachwahl { font-size: 20px; font-weight: 400; color: #ffffff; position: absolute; right: 90px; top: 10px; }
#sprachwahl a { color: #ffffff; padding: 4px; }
#menu { text-align: center; }
#menu header { display: block; height: 48px; margin: 0 12px; background-color: #c0c0c0; }
#wappen { position: absolute; left: 30px; top: 0; padding-top: 20px; width: 34px; background-color: #6a676a; }
#wappen img { width: 48px; margin-left: -7px; }
#menuIcon { float: right; width: 33px; height: 23px; margin: 12px 20px 0 0; background: url(../img/menuicon.png) no-repeat 0px -23px; background-size: 33px 45px; }
#menu ul { width: 456px; margin: 4px 12px; }
#menu li { background-color: #c0c0c0; margin: 0 0 4px; }
#menu a { font-size: 15px; line-height: 46px; width: 100%; display: inline-block; }
.weiterlesen { display: none; }
.background {}
/* .a_target { position: relative; } */
.a_target { position: absolute; }

/* Hauptseite: Struktur */
#startseite { background: url(../img/bg_mobile.jpg) 0 0 no-repeat; background-size: 456px 288px; min-height: 280px; }
#projekt { padding: 8px 25px 40px; color: #2a2a2a; background-color: #f0e9ed; }
#galerie { color: #ffffff; background: url(../img/bg_galerie_heute.jpg) repeat 0 0; }
#impressum { background: url(../img/bg_impressum.jpg) repeat 0 0; }

/* Inhalte */
/* #startseite h3 { color: #ffffff; background-color: rgba(105, 103, 106, 0.9); } */

#projekt .content { }
#projekt h2 { font-size: 28px; font-weight: 300; line-height: 39px; margin: 25px 0; }
#projekt p { line-height: 27px; }
#projekt a { color: #2a2a2a; text-decoration: underline; }

#galerie .content { position: relative; padding-bottom: 40px; }
#galerie h2 { font-size: 60px; line-height: 70px; font-weight: 100; margin: 0 0 25px; padding-left: 9px; background-color: rgba(0, 0, 0, 0.5); }
#galerie p { margin: 16px 25px; }
#galerie a { color: #ffffff; text-decoration: underline; }
#galerieControl { position: absolute; width: 456px; top: 220px; }
#galerieControl li { width: 32px; height: 52px; display: inline-block; overflow: hidden; background-color: rgba(0, 0, 0, 0.5); background-image: url(../img/pfeile.png); background-repeat: no-repeat; cursor: pointer; }
.jcarousel { position: relative; width: 456px; overflow: hidden; }
.jcarousel ul { position: relative; width: 2000px; }
.jcarousel li { float: left; }
.jcarousel img { width: 456px; height: auto; }
.jcarousel p { font-size: 15px; }
.jcarousel-control-prev { background-position: 3px -93px; float: left; }
.jcarousel-control-next { background-position: 3px -142px; float: right; }

#impressum, #impressum a { color: #ffffff; }
#impressum .content { padding: 25px 25px 40px; }
#impressum h2 { font-size: 60px; line-height: 70px; font-weight: 100; margin: 0; padding-left: 9px; background-color: rgba(0, 0, 0, 0.6); }
#impressum h3 { font-size: 17px; line-height: 22px; font-weight: 300; margin: 18px 0 6px; }
#impressum p { font-size: 14px; line-height: 25px; margin: 0; }
#impressum p:first-of-type { font-size: 15px; margin-bottom: 3px; }
#impressum p:last-of-type { margin: 18px 0; }
/*#stelenImpressum { position: absolute; left: 50%; width: 340px; height: auto; margin-left: -170px; opacity: 0.33; z-index: -1; }*/

@media only screen and (orientation: portrait) {
	body { font-size: 16px; line-height: 26px; }
	#startseite .content { padding-top: 276px; }
	#startseite h2 { font-size: 54px; line-height: 70px; font-weight: 100; margin: 4px 0 0; padding-left: 9px; color: #ffffff; background-color: #a19d9e; }
/*	#startseite h3 { font-size: 22px; line-height: 29px; font-weight: 300; width: 298px; margin: 12px 0 0 6px; padding: 8px 12px; } */
/*	.a_target { top: -296px; } */
}

@media only screen and (orientation: landscape) {
	body { font-size: 15px; line-height: 25px; }
	#menu li { display: inline-block; width: 226px; }
	#startseite .content { padding-top: 80px; text-align: center; }
	#startseite h2 { font-size: 40px; line-height: 50px; font-weight: 300; margin: 0 80px 3px; color: #5a575a; background-color: rgba(255, 255, 255, 0.8); }
/*	#startseite h3 { font-size: 18px; line-height: 24px; font-weight: 300; margin: 7px 72px; padding: 4px 0; } */
/*	.a_target { top: -150px; } */
	#galerie .jcarousel p { margin-top: 0; }
}