@charset "UTF-8";
@font-face { font-family: 'acherusgrotesque-regular'; src: url("../fonts/acherusgrotesque-regular-webfont.woff2") format("woff2"), url("../fonts/acherusgrotesque-regular-webfont.woff") format("woff"); font-weight: normal; font-style: normal; }

html, body { min-height: 100vh; margin: 0; padding: 0; }

body { font-family: 'acherusgrotesque-regular',sans-serif; color: #000; background-color: white; font-size: 16px; line-height: 26px; }

#edit { position: fixed; right: 5%; top: 6.5%; }

.pid5 { background-color: #999; }

.pid5 .bar1, .pid5 .bar2, .pid5 .bar3 { background-color: #EFEFEF; }

h1, h2, h3 { margin: 0; padding: 0; font-weight: bold; }

h1 { font-size: 2.75rem; line-height: 3rem; color: #F5A9F2; }

.pid4 h1, .pid6 h1 { color: #999; }

/*.pid5 h1 { color: #EFEFEF; }*/
h2 { font-size: 2rem; line-height: 2.25rem; margin: 1rem 0 .5rem; color: #999; }

h3, .cd h2 { font-size: 1.5rem; line-height: 1.75rem; margin: 1rem 0 .25rem; }

p { margin: 0 0 .75rem; }

/*p:last-child { margin-bottom: 1.5rem; }*/
a { text-decoration: none; color: inherit; }

a:hover { color: #F5A9F2; transition: 1s; }

a:focus, a:active { color: #999; }

img { max-width: 100%; height: auto !important; }

ul { margin: 0; padding: 0; }

li { list-style: none; }

.fl { float: left; }

.fr { float: right; }

.invitxt, .justifypicsspacer { color: transparent; display: none; }

.menu { padding: 1rem 0 0; width: 40%; float: left; }

.menu.toggle .bars div { background-color: transparent; }

.arrow { font-size: 2rem; text-align: right; width: 60%; display: inline-block; padding: 1rem 0 0; color: #F5A9F2; }

.arrow a:hover { color: #999; }

.row.top { height: 5.5em; }

.container { position: relative; width: 1020px; max-width: 92%; margin: 0 auto; padding: 0 4%; height: 100vh; display: table; /* damit 100% hoch ausgefüllt wird */ }
/*.socialwrapper {display: none;}*/
main { display: block; }

/* for IE 10/11 */
.title { width: 100%; height: 4rem; }

.content { float: right; width: 80%; }

.content-small { width: 60%; float: left; margin-left: 20%; }

.after::after { content: ''; display: block; height: 0; clear: both; visibility: hidden; }

/* nur für dev */
/*.container { background-color: lightgrey; }*/
.box { width: 16em; height: 11em; background-color: green; float: left; margin: 0 0 1rem 1rem; }

/* */
.close { position: absolute; right: 1.5rem; top: .5rem; width: 32px; height: 32px; opacity: 1; }

.close:hover { color: #F5A9F2; opacity: .75; }

.close:before, .close:after { position: absolute; right: 5px; content: ' '; height: 30px; width: 2px; background-color: #999; }

.close:before { transform: rotate(45deg); }

.close:after { transform: rotate(-45deg); }

.bars { position: absolute; top: 1.25rem; opacity: .5; }

.bars:hover { opacity: 1; }

.bar1, .bar2, .bar3 { width: 25px; height: 3px; background-color: #999; margin: 6px 0; transition: .4s; }

/* NAV */
.sidenav { height: 100%; width: 0; position: fixed; z-index: 1; top: 0; left: 0; background-color: #EFEFEF; overflow-x: hidden; transition: 0.5s; padding-top: 6rem; }

.sidenav a { padding: 12px 8px 12px 32px; text-decoration: none; font-size: 1.5rem; color: black; display: block; transition: 0.3s; }

.sidenav a:hover, .sidenav a:focus, .sidenav a:active { color: #F5A9F2; }

.sidenav .closebtn { position: absolute; top: 0; right: 25px; font-size: 36px; margin-left: 50px; }

/* CDs */
.cd { display: flex; flex-direction: row; clear: both; margin-bottom: 3%; }

.cd_img { float: left; margin-right: 3%; width: 290px; max-width: 100%; }

.cd_img img { border: rgba(0, 0, 0, 0.05) 1px solid; }

.cd h2 { color: #999; margin-top: 0; }

.cd_subtitle { font-size: 1.075em; font-weight: bold; color: #999; }

.cd_txt { width: 62%; }

.cd_label { margin-bottom: .25em; }

.cd-detail .cd_img { float: none; }

/* concerts */
.cc_next { margin-bottom: 12%; }

.cc_next h2, .cc_prev h2 { text-transform: uppercase; margin-bottom: 3%; }

.cc_concerts h3, .subtitle { color: #F5A9F2; font-weight: bold; font-size: 1.25rem; margin: 0; }

.cc_concerts_detail h2, .cc_concerts_detail .subtitle { color: #F5A9F2; margin: 0; font-size: 1.75rem; line-height: 2.25rem; }

.cc_concerts_detail img { margin-bottom: 2%; }

.cc_concerts_detail .subtitle { margin-bottom: .5rem; }

.cc_concerts { display: flex; flex-direction: row; clear: both; margin-bottom: 3%; }

.cc_img { float: left; margin-right: 3%; width: 200px; max-width: 100%; }

.cc_img img { width: 200px; max-width: 100%; }

.cc_date { color: #999; font-weight: bold; margin: 0; }

.cc_place { margin: 0; }

.cc_concerts a:hover { color: #999; }

.cc_txt { width: 73%; }

.topics-back { margin-top: 3rem; }

.share { border: 2px solid #B8B8B8; display: inline-block; padding: .25rem .5rem .1rem; margin-top: 2rem; color: #999; }

.share:hover { border: 2px solid #F5A9F2; transition: 1s; }

/* RFG */
.pswp__bg { background-color: #999 !important; }

@media screen and (max-width: 1024px) { 
	.pid5 .content, .pid6 .content, .pid3 .content, .pid4 .content { width: 100%; } 

}

/* end NAV */
@media screen and (max-width: 840px) { .content-small { width: 80%; }
  .pid4 .content, .pid3 .content { width: 100%; }
  .cd_img { width: 34%; }
  .cd_txt { width: 63%; } 
  .container{ width: 100%;}
}

@media screen and (max-width: 768px) { /*	.pid5 .content img, .pid6 .content img { max-width: 60%; }*/ }

@media screen and (max-width: 680px) { .content, .content-small { margin: 0; width: 100%; }
  .cc_concerts { flex-direction: column; margin-bottom: 5%; }
  .cc_img { float: none; margin: 0; width: 100%; }
  .cc_txt { width: 100%; } }


@media screen and (max-width: 450px) { .cd { flex-direction: column; margin-bottom: 5%; }
  .cd_img { float: none; margin: 0; width: 100%; }
  .cd_txt { width: 100%; } 
  .container{ width: 100%;}
}

@media screen and (max-width: 240px) { body, p { font-size: .9rem; }
  h1, h2 { font-size: 1.75rem; }
  h3, #concert-calendar h3 { font-size: 1rem !important; line-height: 1.35rem !important; } }

@media screen and (max-height: 450px) { .sidenav { padding-top: 15px; }
  .sidenav a { font-size: 18px; } }