@charset "utf-8";

/*html elements*/
html {-webkit-text-size-adjust: none;}

/*general styles*/
.hideDesktop {display: block!important;}

.hideMobile {display: none!important;}


/*layout elements*/
header {height: 55px!important;}

.layoutLogo {position: relative; left: 0; top: 0; width: 100%; margin-bottom: 20px; text-align: center; padding-top: 10px;}

.layoutLogo span {display: none!important;}

.layoutLogo img {position: relative; width: 120px; height: 35px; background: url(../img/BTGTGR_long.PNG) no-repeat center; -webkit-background-size: contain; -moz-background-size: contain; background-size: contain; display: inline-block!important;}




footer {height: auto; background: #24348a url(../img/PantherohneBG_klein.png) no-repeat center 90px; background-size: 150px auto;}

.layoutFooterInner {padding-top: 20px; padding-bottom: 85px; text-align: center;}

.layoutToTop {right: 10px;}



section {min-height: 100px;}



@media (max-width: 640px) {
	/*facebook*/
	.facebookItem {float: none; width: auto; margin-right: 0; margin-bottom: 20px;}
}

/*artists*/
.artistDetails {float: none; width: auto; margin-bottom: 20px;}

.artistGallery {float: none; width: auto;}


.artistGallery .artistThumbnail {float: left; margin: 0 0 20px 20px; width: calc(25% - 15px);}

.artistGallery .artistThumbnail:nth-child(4n+1) {margin-left: 0;}

.artistGalleryHiddenSwitch {margin-left: 0;}



@media (max-width: 640px) {

	.artistGallery .artistThumbnail {float: left; margin: 0 20px 20px 0; width: calc(50% - 10px);}

	.artistGallery .artistThumbnail:nth-child(2n+2) {margin-right: 0;}
}


.navSelectArtist {padding: 20px;}

.navSelectArtistLink {width: 49%; float: left; margin: 0 2% 20px 0;}

.navSelectArtistLink:nth-child(odd) {margin-right: 0;}

.navSelectArtistLink img {width: 100%; height: auto;}


.navSelectArtist {right: -100%; width: 100%;}


.navSelectArtistNew .navSelectArtistLink {width: 29.9%; margin-right: 5%;}

.navSelectArtistNew .navSelectArtistLink:nth-child(3n+3) {margin-right: 0;}


nav.navArtist .prev {width: auto!important; padding-left: 30px!important; padding-right: 15px!important; position: relative;}

nav.navArtist .next {width: auto!important; padding-left: 15px!important; padding-right: 30px!important; position: relative;}

nav.navArtist .prev span:nth-child(2),nav.navArtist .next span:nth-child(1) {display: block;}

nav.navArtist .prev span:nth-child(1),nav.navArtist .next span:nth-child(2) {display: none;}

nav.navArtist .prev div {display: block; position: absolute; left: 5px; top: 50%; margin-top: -7px;}

nav.navArtist .next div {display: block; position: absolute; right: 5px; top: 50%; margin-top: -7px;}


/*Aufklapp-Block*/
.accordionContent {max-width: 100%; padding: 10px 0;}


/*instagram*/
.instagramItem {float: left; width: calc(50% - 20px); margin-right: 20px; margin-bottom: 20px;}

.instagramItem:nth-child(2n+2) {margin-right: 0;}


/*text 3col*/
.textCol {width: auto; padding: 0; float: none; margin-bottom: 20px;}

.textCol:last-child {margin-bottom: 0;}


/*lang menu*/
nav.navLang {position: absolute; left: 20px; bottom: auto; top: 18px; right: 10px; }

nav.navLang ul li:nth-child(4),nav.navLang ul li:nth-child(5) {display: none;}


/*footer menu*/
nav.navFooter {float: none; margin-bottom: 10px;}


/*main menu*/
@-webkit-keyframes moveFromTop {from {opacity: 0; -webkit-transform: translateY(-100%);} to {opacity: 1; -webkit-transform: translateY(0%);}}

@-moz-keyframes moveFromTop {from {opacity: 0; -moz-transform: translateY(-100%);} to {opacity: 1; -moz-transform: translateY(0%);}}

@-ms-keyframes moveFromTop {from {opacity: 0; -ms-transform: translateY(-100%);} to {opacity: 1; -ms-transform: translateY(0%);}}

nav.navMain {left: 0; top: 0; right: 0; height: 55px;}

nav.navMain .mobileMenuToggle {display: block;}

nav.navMain ul.level1 {position: absolute; left: 0; right: 0; background: #f9ebef; top: 55px; height: auto; padding: 20px; height: 0; overflow: hidden; z-index: 1000; display: none;}

nav.navMain ul.level1 > li {opacity: 0; display: block; padding: 10px 0; height: auto; margin: 0; color: #f9ebef; font-size: 1.125rem; text-align: center; border: none!important; color: #24348a;}

nav.navMain ul.level1 > li.do {opacity: 1; -webkit-animation: moveFromTop 250ms ease-in-out; -moz-animation: moveFromTop 250ms ease-in-out; -ms-animation: moveFromTop 250ms ease-in-out;}

nav.navMain ul li.special {margin: 0 12px 0 20px;}

nav.navMain ul li.special a {font-family: '"Fira Sans",sans-serif'; text-transform: none; width: 30px; height: 30px; border: 1px solid #24348a; display: inline-block; text-align: center; padding-top: 3px; font-size: 1rem; vertical-align: middle; margin: 0 5px;}

nav.navMain ul li.special a:hover {background: #24348a; color: #f9ebef;}

nav.navMain ul li.special:hover {border: none;}

nav.navMain .mobileMenuToggle {padding: 0; margin: 0; position: absolute; right: 10px; top: 8px; bottom: 0; z-index: 1001; cursor: pointer;}

nav.navMain .mobileMenuTrigger {display: inline-block; list-style-type: none; padding: 10px; margin: 0; height: 100%; vertical-align: top;}

nav.navMain .mobileMenuToggle span {width: 34px; height: 3px; display: block; background: #24348a; margin: 0 0 5px; transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55); -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); }

nav.navMain .mobileMenuToggle.opened span.slice1 {transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); margin-top: 8px; }

nav.navMain .mobileMenuToggle.opened span.slice2 {opacity: 0; filter: alpha(opacity=0);}

nav.navMain .mobileMenuToggle.opened span.slice3 {transform: rotate(-45deg); -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); margin-top: -16px }
  
nav.navMain .mobileMenuToggle p {display: none;}


@media (max-width: 375px) {
  html {font-size: 16px;}
}

@media (max-width: 320px) {
  html {font-size: 13.653px;}
}