﻿@import url('https://fonts.googleapis.com/css?family=Kalam|Roboto+Condensed:300,400');
/*
DEFINED COLORS:
KABARETT:
orange: 				#ff9d33		rgba(255,157,51,1)
gelb: 					#ffd133		rgba(255,209,51,1)

LIEDERMACHEREI:
GRÜN:					#54b1a0		rgba(84,177,160,1)
INNERES TÜRKIS: 		#86c6d2		rgba(134,198,210,1)
MITTLERES TÜRKIS:		#9af0ff		rgba(154,240,255,1)
ÄUSSERES TÜRKIS: 		#739da5		rgba(115,157,165,1)

SEMINARE & WORKSHOPS:
SEMINAR OBEN LINKS: 	#58585a		rgba(88,88,90,1)
SEMINAR UNTEN RECHTS: 	#5b5b5d		rgba(91,91,93,1)

FUSSLEISTE:				#3f3f41		rgba(63,63,63,10)


TEXTCOLOR: 				#000000 	rgba(51,51,51,1)
LINKS COLOR: 			#FF2D2E 	rgba(255,45,46,1)
GERHARDSEXLROT (LINKS): #ff3300 	rgba(255,51,0,1)
*/


/* SUPER GLOBALS */
/* Browse Happy */
/* cookie consent */
.cc_btn					{padding: 6px !important;} .cc_btn:hover {border: none}
.browsehappy 			{ margin: 0.2em 0; background: #06F; color: #FFF; padding: 3em 0; text-align: center; }
.browsehappy a 			{ color: #FFF !important; text-decoration:underline !important; }
.browsehappy a:hover 	{ color: rgba(255,255,255,.8) !important; }
.phpIncludeFixer 		{margin-top: -30px }
body, html 				{ overflow-x: hidden !important; -webkit-overflow-x: hidden !important;}
* 						{ box-sizing: border-box; /*hyphens: auto !important; */outline: none !important; text-decoration:none !important; }
body 					{ font-family: 'Roboto Condensed', sans-serif; font-weight: 300; color: #000; font-size: 20px; line-height: 1.5; background-color: #FFF; -webkit-font-smoothing: antialiased; }
.container				{ -webkit-box-shadow: 0px 0px 27px rgba(51,51,51,.2); -moz-box-shadow: 0px 0px 27px rgba(51,51,51,.2); box-shadow: 0px 0px 27px rgba(51,51,51,.2); }
h1, .h1, h2, .h2 		{ font-family: 'Kalam', cursive; font-weight: 600 }
h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: 'Kalam', cursive; font-weight: 600;}

h1, .h1 { font-size: 40px; line-height: 1.3; }
h2, .h2 { font-size: 34px; line-height: 1.3; }
h3, .h3 { font-size: 20px; line-height: 1.3; }
h4, .h4 { font-size: 16px; line-height: 1.3; }
ul, ol  { list-style:circle }



/*  LINKS */
a 							{color: #000; }
a:link, a:active, a:visited { color: #000; cursor: pointer; }
a:hover 					{ border-bottom: 1px solid #000;}
.whiteLink:hover			{border-bottom: 1px solid #FFF !important;}
.nohover, .noOutline 		{ outline: none; border: none !important;}



/* HEADER, CAROUSEL & NAV */
header {}

/* CAROUSEL */
.socialBtns 			{ position: absolute; top: 27px; right: 27px; z-index: 1200; }
.socialBtns i 			{padding: 6px;}
.carousel				{max-width: 1170px; margin: 0 -15px;}
.carousel .item			{  /* Prevent carousel from being distorted if for some reason image doesn't load */}
.carousel .item img		{ margin: 0 auto; /* Align slide image horizontally center */}
.carousel-indicators 	{width: 100% !important; bottom: 0 !important; left: 0 !important; margin-left: 0 !important; text-align: right !important; padding-right: 30px; }
@media (min-width: 768px) { .carousel-indicators { bottom: 0 !important; } }
.carousel-indicators li {width: 14px;height: 14px; margin: 2px;background-color: #FFF !important;border: 1px solid #333;border-radius: 12px;}
.carousel-indicators .active {width: 14px;height: 14px;margin: 2px;background-color: #ff9d33 !important;border: 1px solid #333;border-radius: 14px;}

/* NAVIGATION */
#nav 				{ z-index: 2000 !important}
#navbar 			{ width: 100%; height: auto; margin: -75px auto 0; float:none; text-align: center !important; }
.navbar-nav 		{ float: none; }
.nav  				{ display: inline-block; }
.nav > li 			{ height: 40px; display: inline-block !important; float: none !important; margin: 15px;  border-radius: 10px;  background-color: rgba(214,211,210,.85); border: 4px solid #FFF; cursor: pointer !important; z-index: 2000 !important}
.nav > li:hover 	{ background-color: rgba(214,211,210,1);}
.nav > li > a 		{ /*padding: 10px 15px 8px !important; line-height: 1 !important;*/ font-size: 9px; color: transparent !important; /*font-weight: 500;*/}
.nav > li > a:link, .nav > li > a:focus, .nav > li > a:hover { background-color: transparent !important; color: #333; border: none; }
.news-link:hover 		{border: 2px solid #0F0}
.kabarett-link:hover 	{border: 2px solid #ffd133;}
.lieder-link:hover 		{border: 2px solid #54b1a0}
.seminar-link:hover, .kondolenz-link:hover 	{border: 2px solid #58585a}
.news-link 				{ width: 86px; background: url(../images/menu-news.png) center center no-repeat; background-size: contain; }
.kabarett-link 			{ width: 251px; background: url(../images/menu-kabarett.png) center center no-repeat; background-size: contain;}
.lieder-link 			{ width: 204px; background: url(../images/menu-liedermacherei.png) center center no-repeat; background-size: contain;}
.seminar-link 			{ width: 127px; background: url(../images/menu-seminare.png) center center no-repeat; background-size: contain;}
.kondolenz-link 		{ width: 211px; background: url(../images/menu-kondolenz.png) center center no-repeat; background-size: contain;}

--navFullactive 		{ cursor: default; border-bottom: 3px solid rgba(140,194,189,1);}
.navbar-header 			{ margin-top: -59px;}
.navbar-toggle 			{ right: 12px; }
.navbar-toggle, .navbar-toggle:hover {border: 1px solid #ff3300; background-color: #fff}.navbar-toggle:hover{}.navbar-toggle .icon-bar{background-color: #ff3300;}



/* MEDIA QUERYS */
@media  (max-width : 1200px) {
.carousel-indicators {display: none;}
.TopSpace1200		 { padding-top: 15px;}
}
@media  (max-width : 992px) {
/* globals */
.inlineBlock992		{ display: inline-block !important; }
.centerSwitch992	{ text-align: center !important; }
.socialBtns a 		{ font-size: 24px; }
#navbar 			{ margin-top: -55px; }
.nav > li 			{ height: 30px; margin: 5px; }
.news-link 			{ width: 66px; }
.kabarett-link 		{ width: 203px; }
.lieder-link 		{ width: 165px; }
.seminar-link 		{ width: 103px; }
/* Startseite */
.kabarettBLOCK, .liederBLOCK, .seminarBLOCK {padding: 15px !important; padding-top: 30px !important; opacity: 1;}
}
@media  (max-width : 768px) {
/* globals */
.centerSwitch768	{ text-align: center !important; line-height: 2; }
.removeTHIS			{ display: none; }
#navbar 			{ margin: 30px auto 0; /*background-color: #000;*/}
.navbar-toggle 		{ right: 15px !important; margin:0; bottom: -15px; }
.nav > li, .nav > li:hover { background-color: transparent !important; }
.news-link 			{ border: 2px solid #0F0 !important }
.kabarett-link 		{ border: 2px solid #ffd133 !important }
.lieder-link 		{ border: 2px solid #54b1a0 !important }
.seminar-link, .kondolenz-link 		{ border: 2px solid #58585a !important }
.kabarettIcon 		{ width: 50px !important; height: 34px !important; }
.liedermachereiIcon { width: 61px !important; height: 34px !important; }
}
@media  (max-width : 480px) {/*and (min-device-width: 320px)*/
.col-lg-12			{ padding-right: 10px; padding-left: 10px;}
.socialBtns 		{ display: none; }
h1, .h1 			{ font-size: 140%; }
h2, .h2 			{ font-size: 110%; }
h3, .h3 			{ font-size: 100%; }
p					{ font-size: 90%; }
.text-justify-switch{ text-align: justify !important;}
.width-switch400-100pc{ width: 100% !important;}
.datenschutz p, .agb p { font-size: 12px !important;}
}



/* STARTSEITE */
.kabarettBLOCK, .liederBLOCK, .seminarBLOCK { min-height: 300px; padding: 30px; padding-top: 45px; }
.kabarettBLOCK		{ background: #ffd133 url(../images/bg-kabarett-orange-top.png) top left no-repeat; }
.liederBLOCK		{ background-color: #54b1a0; background-image: url(../images/bg-liedermacherei-turkis-bottom.png); background-position: right bottom; background-repeat: no-repeat; }
.liederBLOCKwoBG	{ background-color: #54b1a0; background-image: none; }
.abstand 			{ margin-top: 11px; }
.seminarBLOCK		{ background: #58585a url(../images/bg-seminare-gray-bottom.png) bottom right no-repeat; }
.kabarettIcon 		{ width: 70px; height: 48px; background: url(../images/startseite-top-harlekin.png) center center no-repeat; background-size: contain; }
.liedermachereiIcon { width: 90px; height: 50px; background: url(../images/startseite-top-gitarre.png) center center no-repeat; background-size: contain; }
.seminarIcon		{ width: 70px; height: 79px; background: url(../images/startseite-top-seminare.png) center center no-repeat; background-size: contain; }
/* NEWS */
#news				{ display: none; position: absolute; padding-top: 30px; margin-left: -15px !important; z-index: 400; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
.newsBox			{ padding: 30px; border: 4px solid #ff9d33; min-height: 600px; border-radius: 15px; -webkit-box-shadow: 0px 0px 27px rgba(51,51,51,.5); -moz-box-shadow: 0px 0px 27px rgba(51,51,51,.5); box-shadow: 0px 0px 27px rgba(51,51,51,.5);}
.newsTermineDat		{ display: inline-block; padding: 5px; margin: 2px; border: 1px solid #000; border-radius:3px; font-size: 16px; line-height: 1; background-color: rgba(255,209,51,1) }
.newsCloseBtn		{ position: absolute; right: 5px; top: 5px; cursor: pointer; }
.newsCloseBtn i		{ color: rgba(51,51,51,.7) }
.newsCloseBtn i:hover		{ color: rgba(255,209,51,1) }
.newsTitle			{ padding-bottom: 6px; border-bottom: 1px solid #000; }

/* PICTURE BOX */
#content img		{ border-radius: 5px; border: 2px solid #FFF; }
.pictureBox:hover	{ cursor: url(images/icons/lupe.png); opacity:.9 !important;   }
.lupe				{ cursor: zoom-in !important; cursor: url(images/icons/lupe.png), auto;}
.item img			{ border: none !important; border-radius: 0 !important}

/* VIDEO EMBEDS */
/* more info about VIDEO embeds: https://css-tricks.com/NetMag/FluidWidthVideo/Article-FluidWidthVideo.php */
/* this version for youtube videos */
/*.videoWrapper 			{ position: relative; width: 100%; padding-bottom: 56.25%; padding-top: 25px; height: 0; }
.videoWrapper iframe 	{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }*/
/* this version for html5 mp4 embeds */
.videoBox 				{ display: inline-block; margin-bottom: 30px; }
.videoBoxDescription	{ padding: 0 21px; margin-top: -10px; }
video 					{ max-width: 100% !important; height: auto !important; }
video:hover				{ cursor: pointer}
/* AUDIO EMBEDS */
audio					{ max-width: 100%; }


/* GLOBAL EFFECTS */
/* TRANSITIONS */
.transitionFast 	{ -ms-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -webkit-transition: all 0.3s; transition: all 0.3s; }/**/

/* SUPER GLOBALS */




/* TEXT Works [ learn: http://www.tutorialrepublic.com/twitter-bootstrap-examples.php ]*/
/*.justify { text-align: justify;}*/
/*.textLeft {text-align: left !important}*/
/*.letterspacing{ letter-spacing: normal; }
.wordspace { word-spacing: -2px !important; }
.grossSchreiben {text-transform: uppercase !important;}
.silbentrennung { -webkit-hyphens: auto !important; hyphens: auto !important; }*/ /* braucht lang="de" / oder mit '&shy;' manuell Bruchstellen einfügen*/
.wordwrap{word-wrap:break-word;} /* wird unterschätzt! */
.lh0 		{line-height: 0 }
/*.lh02 {line-height: 0.2}
.lh06 {line-height: 0.6 !important;}*/
.lh1 		{line-height: 1 !important;}/**/
.lh2		{ line-height: 2; }
.lh12 		{ line-height: 1.2 !important; }
.lh1-5 		{ line-height: 1.5 !important; }
.lh5 		{line-height: 5 !important; }
/*code { color: rgba(207,88,38,1)!important; }*/
bold, strong, .bold { font-weight:400 !important; }/**/
.fontNormal { font-weight: normal !important;}
.italic { font-style:italic}/**/
/*.underLineDottet{border-bottom: 1px solid dotted !important;}*/



/* COLUMNS /  more info: https://css-tricks.com/guide-responsive-friendly-css-columns/*/
/* Die Anweisung "break-inside: avoid;" verhindert, dass der Block links unten mit der blauen Schrift auseindergerissen wird.*/
.article 		{ column-count: 3; column-width: 330px; -webkit-columns: 3 330px; -moz-columns: 3 330px;
				  -webkit-column-gap: 42px; -moz-column-gap: 42px; column-gap: 42px;
  				  -webkit-column-rule: 1px dotted rgba(255,255,255,.6); -moz-column-rule: 1px dotted rgba(255,255,255,.6); column-rule: 1px dotted rgba(255,255,255,.6);
		  		  margin: 42px 0; }
.articleTwoColumns 		{ column-count: 2; column-width: 495px; -webkit-columns: 2 495px; -moz-columns: 2 495px;
				  		  -webkit-column-gap: 84px; -moz-column-gap: 84px; column-gap: 84px;
  				  		  -webkit-column-rule: 1px dotted rgba(255,255,255,.6); -moz-column-rule: 1px dotted rgba(255,255,255,.6); column-rule: 1px dotted rgba(255,255,255,.6);
		  		  		  margin: 42px 0; }
.seminarBLOCK .articleTwoColumns	{ -webkit-column-rule: 1px dotted rgba(255,255,255,.2); -moz-column-rule: 1px dotted rgba(255,255,255,.2); column-rule: 1px dotted rgba(255,255,255,.2); }
.breakArticle 	{ -webkit-column-span: all; column-span: all; }
.noBlockBreak	{ -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; }


/* SCHRIFTGROESSEN und -WEIGHTS */
.font12 { font-size: 12px; }/**/
.font14 { font-size: 14px; }/**/
.font16 { font-size: 16px !important; }/**/
.font34 { font-size: 34px !important; }/**/
.number	{ padding: 0 8px; border: 1px solid #000; border-radius:50%; }

/* SCHRIFTFARBEN */
.colorOrange	{color: #ff9d33}/**/
.colorWhite		{color: #fff;}/**/
.colorTurkis	{color: #8cc2bd}/**/
.colorRed		{color: #FF2D2E}/**/
/*.colorDarkGreen { color: rgba(51,102,0,1)}*/
/*  BACKGROUNDS  */
.whiteBG		{ background-color: #f8ffff;}/**/
.turkisBG 		{ background-color: rgba(154,240,255,1) }/**/
.grayLightBG	{ background-color: rgba(91,91,93,1) }/**/
.redBG 			{ background-color: #FF2D2E; }
.orangeBG		{ background-color: #ff9d33; }


/* GRAFICS */
/*.featuringBox		{ background-color: rgba(140,194,189,.7); margin: 15px; border-radius: 5px; border: 1px solid #8cc2bd}
.borderBox 			{ border: 2px solid #8cc2bd; }
.round-border10 	{ -webkit-border-radius: 10px; border-radius: 10px; }
.round-border-left 	{ border-radius: 5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px !important; }*/
/* BORDERS */
.whiteBorder		{ border: 1px solid #FFF;}
.topLine			{ border-top: 1px dotted rgba(255,255,255,.6) }
.seminarBLOCK .topLine	{ border-top: 1px dotted rgba(255,255,255,.2) }
.round-border3 		{ -webkit-border-radius: 3px; border-radius: 3px; }
/*.borderBottom {margin: 0 0 5px; border-bottom: 1px solid #8cc2bd}
.table-border {border: 1px solid rgba(102,255,255,.4) }
.turkisBorder { border: 1px solid #8cc2bd }*/
/*.border-bottom{ border-bottom: 1px solid #9932cc;}
.mediumGray-border { border: 1px solid rgba(55,70,78,1);}
.borderColorCCC{border-color: #ccc !important;}


.round-border-top { border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0 !important; }
.round-border-right { border-radius: 0 5px 5px 0; -webkit-border-radius: 0 5px 5px 0 !important; }
.round-border-left { border-radius: 5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px !important; }
.round-border-bottom { border-radius: 0 0 5px 5px !important; -webkit-border-radius: 0 0 5px 5px !important; }*/


/* POSITION */
.hidden{display: none}/**/
.center {text-align: center }/**/
.margin0 {margin: 0 !important;}/**/
.zero { margin: 0 !important; padding: 0 !important; top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important; }/**/
.zeroOpacity { opacity: 0 !important; }
.inline-block { display: inline-block !important; }/**/
.relative-position {position: relative}
.absolute-position {position: absolute}/**/
.cell { display: table-cell !important; }
.left { float: left }/**/
.right { float: right }/**/


.vertical-baseline { vertical-align: baseline !important}/**/
.vertical-bottom { vertical-align: bottom; }/**/
.vertical-middle { vertical-align: middle !important; }
.vertical-top { vertical-align: top !important; }/**/

/* jQuery FUNCTIONS */
.cursor-pointer, .hover:hover { cursor: pointer !important; }/**/
.cursor-zoomIn:hover {cursor: zoom-in;}
.defcurs { cursor: default; }/**/




/* SPACES */
.top-space0 {margin-top: 0 !important; }/**/
.top-space10 { margin-top: 10px !important; }/**/
.top-space15 {margin-top: 15px !important}/**/
.top-space30 {margin-top: 30px !important;}/**/
.top-space45 { margin-top: 45px !important; }/**/
.top-space60 { margin-top: 60px !important; }
.left-space15 { margin-left: 15px !important; }/**/
.right-space5 {margin-right: 5px !important}
.right-space15 {margin-right: 15px !important}/**/
.right-space30 { margin-right: 30px !important; }/**/
.right-space40 { margin-right: 40px !important; }
.bottom-space15 { margin-bottom: 15px !important; }/**/
.bottom-space30 {margin-bottom: 30px !important}/**/
.bottom-space45 {margin-bottom: 45px !important}/**/
.bottom-space60 {margin-bottom: 60px !important}
.bottom-space75 {margin-bottom: 75px !important}
.bottom-space105 {margin-bottom: 105px}
.bottom-space140{margin-bottom: 140px !important}/**/
.padding0 {padding: 0 !important;}/**/
.padding3 { padding: 3px !important; }/**/
.padding10 { padding: 10px !important; }/**/
.padding15 { padding: 15px !important; }/**/
.padding20 { padding: 20px !important; }/**/
.padding30 { padding: 30px !important; }/**/
.padding-top15 {padding-top: 15px !important}/**/
.padding-top30 {padding-top: 30px}/**/
.padding-right10	{ padding-right: 10px;}/**/
.padding-right15 { padding-right: 15px !important; }
.padding-right30 { padding-right: 30px !important; }
.padding-right45 {padding-right: 45px}
.padding-left10	{ padding-left: 10px;}/**/
.padding-left15 { padding-left: 15px !important; }
.padding-left30 { padding-left: 30px !important; }
.padding-left45 { padding-left: 45px !important; }
.padding-bottom5 {padding-bottom: 5px;}/**/
.padding-bottom15 {padding-bottom: 15px !important;}/**/
.padding-bottom30 { padding-bottom: 30px !important; }/**/




/* QUICK FX */
/* test background color */
.changeBodyColor{ background-color: #333; }
.noBoxShadow	{ -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; }
.hidecontent { position: absolute; top: -9999px; left: -9999px; }
/* FX-total-center div bestehend aus outer | middle | inner */
.fx-outer { display: table; position: absolute; width: 100%; height: 100%; margin-top: -20px }
.fx-middle { display: table-cell; vertical-align: middle; }
.fx-inner { margin-left: auto; margin-right: auto; }
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - -  */
.test-border {border: 1px solid rgba(102,255,255,.4) }
.test-borderDark {border: 1px solid #333 }
.red-border { border: 1px solid #C03 }
.blue-border { border: 1px solid #06F }
.green-border { border: 1px solid #0C0;}
.overflow-hidden { overflow: hidden !important; }
.arrow-up { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 5px solid #555; }
.arrow-down { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #555; }
.arrow-right { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 5px solid #555; }
.arrow-left { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-right: 5px solid #555; }
.arrow-downWhite { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #FFF; }











/* FOOTER */
footer {padding: 18px 0 45px; background-color: #3f3f41; color: #FFF; }
.backToTop { display: none; position: fixed;right: 20px; bottom: 65px; z-index: 100 }
.backToTopBtn { width: 35px; height: 35px; background: url(../images/icons/arrowup.png) center center; background-size: cover; background-color: #FFF; border-radius: 50%; border: 1px solid #FFF  }
@media screen and (max-device-width : 768px) {
.backToTop { right: 3px !important; bottom: 3px !important; }
.backToTopBtn {width: 20px; height: 20px;}
}
/*
footer a:hover:after, .info a:hover:after { background: #FF2D2E;}
.footer-link-block {padding: 30px 0;}*/




/* KONTAKT FORMULAR */
/*.closeSiteBtn { float: right; width: 48px; height: 48px; padding: 4px; margin: 15px 30px -35px 0; background: url(../images/icons/close-alpha40-hover.png) center center no-repeat; border-radius: 24px; cursor: pointer; z-index: 20}
.closeSiteBtn:hover {background-color: #8cc2bd}*/
