@charset "UTF-8";
* {margin:0px; padding:0px;}



h1{ font-family: 'Lato', "Helvetica Neue", Helvetica, Arial,"sans-serif"; font-size: 120px; font-weight: 900; color:#0285C7; letter-spacing: -0.01em;line-height:1.1em;}
h2{ font-family: 'Lato', "Helvetica Neue", Helvetica, Arial,"sans-serif"; font-size: 60px; color:#ffffff; margin: 0px 10px 60px 0;letter-spacing: -0.01em;line-height:1em;}
h3{ font-family: 'Lato', "Helvetica Neue", Helvetica, Arial,"sans-serif"; font-size: 60px; color:#ffffff; margin: 0px 10px 100px 0;line-height:0.9em;}
h4{ font-family: 'Lato', "Helvetica Neue", Helvetica, Arial,"sans-serif"; font-size: 35px; color:#ffffff; margin: 20px 10px 25px 0;font-weight:900; letter-spacing: 0.04em;line-height:1.2em;}

h5{	font-size: 36px; color: #ffffff;	margin: 50px 10px 80px 10px;	padding-top: 5px;font-weight:300;line-height: 1.2em;}
h6{	font-size: 24px;color: #ffffff; 	margin: 20px 0 10px 0px;	font-weight:300;line-height: 1.2em;}
h7{	font-size: 14px; color: #ffffff;	margin: 20px 0;	font-weight:500;}

a:link, a:visited{font-style:normal;font-weight:900;color: #D5D5D5;text-decoration: none;font-size:1.05em;}
a:hover {font-style:normal;text-decoration: none; color: #B100D3;}
 
img{width: 100%;}

body{text-align: left;	font-family: 'Lato', "Helvetica Neue", Helvetica, Arial,"sans-serif";  line-height: 1.5em; font-size: 24px; letter-spacing: 0.03em; color:#ffffff; background-image: url("../gfx/hg_Pegasus-Saxophonquartett.jpg"); background-position: center top; background-size: 100% auto ; background-repeat: no-repeat;background-attachment: fixed;background-color:#000000;}

#gold {position:fixed; top:0; width:100%; height:100px; background-image: url("../gfx/hg_Pegasus-Saxophonquartett.jpg"); background-position: center top; background-size: 100% auto ; background-repeat: no-repeat;background-attachment: fixed;background-color:#CE7E00;z-index:1;}
#start{position:relative; height: 430px;text-align: right;z-index:98;width: 100%;}
#logo{width: 350px; float:right;margin: 20px 60px;z-index:101;}


#head {width: 96%; background-color:none;height: 60px;z-index: 100; margin: 0 2%; padding: 20px 0;  position: sticky; top: 0; }


#navbox { text-align: left; display:block; min-height:30px; margin:0 5% 0 0; }


#navbox #nav .menu {text-decoration: none;float: left;margin-left:15px;position:relative;display: block;}
#navbox #nav .menu UL {text-align: left;list-style: none; display: block;}	
#navbox #nav .menu li {display: inline;}
#navbox #nav .menu A, #nav .menu A:visited {float: left;font-size:35px;color:#ffffff;font-style:normal;font-weight:900;text-decoration:none; margin: 0 0 0 50px;}
#navbox #nav .menu A:hover, #nav .menu A:focus {text-decoration:none;color: #FBE22E;}


#navbox #nav ul ul {display: block;list-style: none; text-align: left; position: absolute; background-color: #fff; top: 45px;left:50px; z-index: -1;  min-width:180px;padding:10px 5px 15px 5px;border-radius: 11px;}

#imp-nav{text-decoration: none;text-align:center;}	
#imp-nav li {display: inline;}
#imp-nav  A, #nav A:visited { font-size:16px;	color:#FADC8E;	font-style: italic; text-decoration:none ;padding: 0 10px 0 7px;}
#imp-nav A:hover, #nav A:focus {color:#ffffff;}

#quartet img{width: 75%; height: auto; margin: -20% 4% 100px -18%;border: 1px solid #ffffff; border-radius: 10px;}
#auftritt img{width: 65%; height: auto; margin: -18% -4% 0 52%;border: 1px solid #ffffff; border-radius: 10px;}
#container{width: 100%; }

#head_box{position:fixed;top:0;width:100%;height: 45px;background-color:#2C0310;text-align:center;color:#2C0310;font-size: 18px;}
#bottom {width:300px;margin:3px auto 0 auto;text-align:center;}

#contend {background-color: #2a313f;background-image: url("../gfx/hg_contend_Pegasus-Saxophonquartett.jpg"); background-position: left top; background-size: 150% 100% ; background-repeat: no-repeat;background-color:#CE7E00;
	width: 70%; margin-left:5%; margin-top:80px;text-align: left;padding:10%;border: 0.3px solid #ffffff; border-radius: 15px; }
#contend span{font-weight: 900;letter-spacing: 0.02em;font-size: 23px;color:#BBC7D6; margin-left:4px; margin-right: 6px;}
.special{font-size:1.5em; color:#014f6d; font-weight:900;}


#picture-musiker {width: 100%; height: auto; margin:80px 0;}
#picture-musiker img{width: 38%; height: auto;float:left; margin: 0% 4% 2% 0%;border: 0px solid #ffffff; border-radius: 15px;}

#picture-r img{width: 42%; height: auto;float:right; margin:0% 2% 2% 3%; border: 0px solid #ffffff; border-radius: 25px;}
#picture-l img{width: 40%; height: auto;float:left; margin: -3% 3% 1% 0%;border: 0px solid #ffffff; border-radius: 25px;}



.table_box {margin: 40px 0 20px 0;width:100%;padding-top: 40px;}
.line {margin-top:10px;margin-left: 60px;width: 550px;}
.aktuell-left {float:left;width:40%;margin-top:5px;}
.aktuell-right {float:left;width:60%;}


#sound_01 { width:100%;}
#hoerprobe {margin:20px 5px}
#konzert-left {width: 40%; float: left;margin-top:10px;margin-right:3%; text-align: left;line-hight: 0.3em;}
#konzert-right {width: 57%; float: right;margin-top:0px;text-align: left;margin-right:0%}

#lines {text-align:left; border-top: 1px solid #ffffff;	border-bottom: 1px solid #ffffff;padding-top: 10px;margin-top: 30px;padding-bottom: 10px;margin-bottom: 30px;padding-left:12px;}
#lines a{color: #ffffff; font-size:12pt;}
#lines a:hover {color: #B100D3;}
.kleintext{font-size:smaller;line-height:normal;}

#band {Text-align:right; Padding: 45vH 5% 5vH 0; background-image: url("../gfx/hg_band_sw.jpg"); background-size: 100% auto; background-position: right top; background-repeat: no-repeat; background-color: #000000;}





#downloadlink a{font-size:14px;}
#down a{text-decoration:underline;}

#sound_01 { width:100%;}
#filmclip{float:left;width:30%;min-height:150px;margin-right:3%;margin-bottom:50px;}
.elastic-video {position: relative;padding-bottom: 55%;padding-top: 15px;height: 0;overflow: hidden;}
.elastic-video iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}


#galerie { margin: 20px 8px 40px 8px;}
#galerie ul {margin-bottom: 30px; margin-left: 0;}
#galerie ul li {display:inline; float:left; width: 30%;margin-bottom: 14px;margin-right: 3%;}
	
#galerie ul img {border: 1px solid #fff;padding: 2% 2%;}
#galerie ul img:link, #gallery ul img:visited {border: 1px solid #330033; }	
#galerie ul img:hover {border: 1px solid #FBE22E; }



.image {margin-bottom:10px;}


#mobile-nav,#mobile-nav-switch{display:none;}

#lightbox-container-image-box{max-width:1000px !important;height:auto !important;}	
#lightbox-container-image-data-box{	max-width:1000px !important;	padding:0px !important;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext{ height:100% !important;}

#contend-box {width: 80%; margin: 200px auto;}


@media only screen and (min-width: 1700px) {
	#contend {width: 1200px; margin: 50px auto; padding:10%;border: 0.5px solid #ffffff; border-radius: 25px; }
	#start{ width: 1700px;margin: 0 auto; }
#logo{width: 400px; float:right;margin: 20px 60px;z-index:101;}


#head {width: 1650px; margin: 0 auto; background-color:none;height: 80px;z-index: 100;  padding: 20px 0;  position: sticky; top: 0; }
#navbox #nav .menu A, #nav .menu A:visited {font-size:42px; margin: 0 0 0 50px;}
}
	


@media only screen and (max-width: 1045px) {
	
#logo{width: 260px; float:right;margin: 20px 60px;z-index:101;}
#start{position:relative; height: 280px;text-align: right;z-index:101;width: 100%;}
#navbox #nav .menu A, #nav .menu A:visited {float: left;font-size:26px;color:#FFFFFF;font-style:normal;font-weight:900;text-decoration:none; margin: 0 0 0 25px;}
	
	#lightbox-container-image-box{	max-width:95% !important;height:auto !important;	}	
#lightbox-container-image-data-box{	max-width:95% !important; padding:0px !important;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext{ height:100% !important;}
	
h2{  font-size: 50px; color:#ffffff; margin: 0px 10px 60px 0;letter-spacing: -0.01em;line-height:1.1em;}
	
}

@media only screen and (max-width: 945px) {
	
	.aktuell-left {float:none;width:90%;margin-top:5px;margin-bottom:40px;}
.aktuell-right {float:none ;width:97%;margin-left:10%}	
	#konzert-left {width: 90%; float: left;margin-top:10px;margin-right:0%; text-align: left;line-hight: 0.3em;}
#konzert-right {width: 97%; float: right;margin-top:0px;text-align: left;margin-right:0%;margin-bottom:60px;}
}
	
@media only screen and (max-width: 745px) {
	#head{display:none;}
	#gold {display:none;}
	#imp-nav{display:none;}	
#logo{width: 200px; float:right;margin: 60px 60px;z-index:101;}
	#quartet img{width: 135%; height: auto; margin: -6% 0 6% -18%;border: 1px solid #ffffff; border-radius: 10px;}
#auftritt img{width: 85%; height: auto; margin: -22% 0 10% 31%;border: 1px solid #ffffff; border-radius: 10px;}
	#contend {background-color: #2a313f;opacity: 0.94;
	width: 70%; margin-left:5%; margin-top:10px;margin-bottom:80px; text-align: left;padding:10%;border: 0.3px solid #ffffff; border-radius: 15px; }

	
	#galerie { margin: 20px 8px 40px 8px;}
#galerie ul {margin-bottom: 30px; margin-left: 0;}
#galerie ul li {display:inline; float:left; width: 47%;margin-bottom: 14px;margin-right: 3%;}
	
	#mobile-nav-switch{	display:block; 	position: fixed;	 cursor: pointer; position: top	centered;	background: #000 url(../gfx/nav.gif) no-repeat center center; background-size:30px ; height: 40px;width: 100%;	z-index:200;	}
	#mobile-nav-container{	margin:0px 0px 8px 0px;	width: 100%;	background-color: #CE7E00;position:relative;top:40px;}
	#mobile-nav{	border-top:2px solid #fff;border-bottom:2px solid #fff;margin-top:2px;list-style-type:none;	padding-top:0px; 	padding-bottom:0px;	display:none;z-index:199;	}
	#mobile-nav li{	list-style-type:none;text-align:center;}
	#mobile-nav a{	display:block;	width:95%;	 height:60px;	line-height:60px;	background-color: #CE7E00;	border-bottom:1px solid #fff;padding-left:5%;text-decoration:none; color:#fff;	font-weight:100; font-family: 'Lato', "Helvetica Neue", Helvetica, Arial,"sans-serif"; 	 font-size:24px;}
	
	
}
	

@media only screen and (max-width: 480px) {
	
body{ line-height: 1.5em; font-size: 20px; letter-spacing: 0.03em; }
	
	.table_box {margin: 40px 0 20px 0;width:100%;padding-top: 0px;border-bottom: 2px solid #fff;  padding-bottom: 10px;  }
	.aktuell-left {float:none;width:90%;margin-top:5px;margin-bottom:60px;}

h2{ font-family: 'Lato', "Helvetica Neue", Helvetica, Arial,"sans-serif"; font-size: 35px; color:#ffffff; margin: 0px 10px 40px 0;letter-spacing: -0.01em;line-height:1em;}
h3{ font-family: 'Lato', "Helvetica Neue", Helvetica, Arial,"sans-serif"; font-size: 40px; color:#ffffff; margin: 30px 10px 50px 0;line-height:0.9em;}
h4{ font-family: 'Lato', "Helvetica Neue", Helvetica, Arial,"sans-serif"; font-size: 25px; color:#ffffff; margin: 20px 10px 25px 0;font-weight:900; letter-spacing: 0.04em;line-height:1.2em;}
	
}



	
/* comforter-brush-regular - latin */
	
@font-face {
  font-family: 'Comforter Brush';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/comforter-brush-v7-latin-regular.eot'); /* IE9 Compat Modes */
  src: url('../fonts/comforter-brush-v7-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/comforter-brush-v7-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/comforter-brush-v7-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/comforter-brush-v7-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/comforter-brush-v7-latin-regular.svg#ComforterBrush') format('svg'); /* Legacy iOS */
}
	
	
	/* lato-300italic - latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 300;
  src: url('../fonts/lato-v14-latin-300italic.eot'); /* IE9 Compat Modes */
  src: local('Lato Light Italic'), local('Lato-LightItalic'),
       url('../fonts/lato-v14-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lato-v14-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lato-v14-latin-300italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lato-v14-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lato-v14-latin-300italic.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-regular - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/lato-v14-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Lato Regular'), local('Lato-Regular'),
       url('../fonts/lato-v14-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lato-v14-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lato-v14-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lato-v14-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lato-v14-latin-regular.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-italic - latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/lato-v14-latin-italic.eot'); /* IE9 Compat Modes */
  src: local('Lato Italic'), local('Lato-Italic'),
       url('../fonts/lato-v14-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lato-v14-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lato-v14-latin-italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lato-v14-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lato-v14-latin-italic.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-700 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/lato-v14-latin-700.eot'); /* IE9 Compat Modes */
  src: local('Lato Bold'), local('Lato-Bold'),
       url('../fonts/lato-v14-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lato-v14-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lato-v14-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lato-v14-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lato-v14-latin-700.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-700italic - latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/lato-v14-latin-700italic.eot'); /* IE9 Compat Modes */
  src: local('Lato Bold Italic'), local('Lato-BoldItalic'),
       url('../fonts/lato-v14-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lato-v14-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lato-v14-latin-700italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lato-v14-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lato-v14-latin-700italic.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-900 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/lato-v14-latin-900.eot'); /* IE9 Compat Modes */
  src: local('Lato Black'), local('Lato-Black'),
       url('../fonts/lato-v14-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lato-v14-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lato-v14-latin-900.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lato-v14-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lato-v14-latin-900.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-900italic - latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 900;
  src: url('../fonts/lato-v14-latin-900italic.eot'); /* IE9 Compat Modes */
  src: local('Lato Black Italic'), local('Lato-BlackItalic'),
       url('../fonts/lato-v14-latin-900italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lato-v14-latin-900italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lato-v14-latin-900italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lato-v14-latin-900italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lato-v14-latin-900italic.svg#Lato') format('svg'); /* Legacy iOS */
}
