@font-face {
  font-family: 'Archivo';
  src: url('fonts/archivo-regular.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Archivo';
  src: url('fonts/archivo-semibold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
#ajax-spinner {
  position: fixed;
  left: 50%;
  top: 50%;
  z-index: 123456;
  width: 40px;
  height: 40px;
  visibility: hidden;
}
#ajax-spinner .sk-child {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
#ajax-spinner .sk-child:before {
  content: '';
  display: block;
  margin: 0 auto;
  width: 15%;
  height: 15%;
  background-color: #333;
  border-radius: 100%;
  -webkit-animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
  animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
}
#ajax-spinner .sk-circle2 {
  -webkit-transform: rotate(30deg);
  -ms-transform: rotate(30deg);
  transform: rotate(30deg);
}
#ajax-spinner .sk-circle3 {
  -webkit-transform: rotate(60deg);
  -ms-transform: rotate(60deg);
  transform: rotate(60deg);
}
#ajax-spinner .sk-circle4 {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}
#ajax-spinner .sk-circle5 {
  -webkit-transform: rotate(120deg);
  -ms-transform: rotate(120deg);
  transform: rotate(120deg);
}
#ajax-spinner .sk-circle6 {
  -webkit-transform: rotate(150deg);
  -ms-transform: rotate(150deg);
  transform: rotate(150deg);
}
#ajax-spinner .sk-circle7 {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}
#ajax-spinner .sk-circle8 {
  -webkit-transform: rotate(210deg);
  -ms-transform: rotate(210deg);
  transform: rotate(210deg);
}
#ajax-spinner .sk-circle9 {
  -webkit-transform: rotate(240deg);
  -ms-transform: rotate(240deg);
  transform: rotate(240deg);
}
#ajax-spinner .sk-circle10 {
  -webkit-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
}
#ajax-spinner .sk-circle11 {
  -webkit-transform: rotate(300deg);
  -ms-transform: rotate(300deg);
  transform: rotate(300deg);
}
#ajax-spinner .sk-circle12 {
  -webkit-transform: rotate(330deg);
  -ms-transform: rotate(330deg);
  transform: rotate(330deg);
}
#ajax-spinner .sk-circle2:before {
  -webkit-animation-delay: -1.1s;
  animation-delay: -1.1s;
}
#ajax-spinner .sk-circle3:before {
  -webkit-animation-delay: -1s;
  animation-delay: -1s;
}
#ajax-spinner .sk-circle4:before {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}
#ajax-spinner .sk-circle5:before {
  -webkit-animation-delay: -0.8s;
  animation-delay: -0.8s;
}
#ajax-spinner .sk-circle6:before {
  -webkit-animation-delay: -0.7s;
  animation-delay: -0.7s;
}
#ajax-spinner .sk-circle7:before {
  -webkit-animation-delay: -0.6s;
  animation-delay: -0.6s;
}
#ajax-spinner .sk-circle8:before {
  -webkit-animation-delay: -0.5s;
  animation-delay: -0.5s;
}
#ajax-spinner .sk-circle9:before {
  -webkit-animation-delay: -0.4s;
  animation-delay: -0.4s;
}
#ajax-spinner .sk-circle10:before {
  -webkit-animation-delay: -0.3s;
  animation-delay: -0.3s;
}
#ajax-spinner .sk-circle11:before {
  -webkit-animation-delay: -0.2s;
  animation-delay: -0.2s;
}
#ajax-spinner .sk-circle12:before {
  -webkit-animation-delay: -0.1s;
  animation-delay: -0.1s;
}
@-webkit-keyframes sk-circleBounceDelay {
  0%,
  80%,
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes sk-circleBounceDelay {
  0%,
  80%,
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.flashmsg-title {
  font-weight: normal;
}
.flashmsg-message {
  -ms-word-wrap: break-word;
  word-wrap: break-word;
}
.flashmsg-message a,
.flashmsg-message label {
  color: #FFFFFF;
}
.flashmsg-message a:hover {
  color: #CCCCCC;
  text-decoration: none;
}
.flashmsg-close-button {
  position: relative;
  right: -0.3em;
  top: -0.3em;
  float: right;
  font-size: 20px;
  font-weight: bold;
  color: #FFFFFF;
  -webkit-text-shadow: 0 1px 0 #ffffff;
  text-shadow: 0 1px 0 #ffffff;
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  filter: alpha(opacity=80);
  line-height: 1;
}
.flashmsg-close-button:hover,
.flashmsg-close-button:focus {
  color: #000000;
  text-decoration: none;
  cursor: pointer;
  opacity: 0.4;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  filter: alpha(opacity=40);
}
.rtl .flashmsg-close-button {
  left: -0.3em;
  float: left;
  right: 0.3em;
}
button.flashmsg-close-button {
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
}
.flashmsg-top-right {
  top: 60px;
  right: 1vw;
}
#flashmsg-container {
  position: fixed;
  z-index: 999999;
  pointer-events: none;
}
#flashmsg-container * {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#flashmsg-container > div {
  position: relative;
  pointer-events: auto;
  overflow: hidden;
  margin: 0 0 6px;
  padding: 15px 15px 15px 50px;
  width: 300px;
  -moz-border-radius: 3px 3px 3px 3px;
  -webkit-border-radius: 3px 3px 3px 3px;
  border-radius: 3px 3px 3px 3px;
  background-position: 15px 15px;
  background-repeat: no-repeat;
  -moz-box-shadow: 0 0 12px #999999;
  -webkit-box-shadow: 0 0 12px #999999;
  box-shadow: 0 0 12px #999999;
  color: #FFFFFF;
  opacity: 0.95;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=95);
  filter: alpha(opacity=95);
}
#flashmsg-container > div.rtl {
  direction: rtl;
  padding: 15px 50px 15px 15px;
  background-position: right 15px center;
}
#flashmsg-container > div:hover {
  -moz-box-shadow: 0 0 12px #000000;
  -webkit-box-shadow: 0 0 12px #000000;
  box-shadow: 0 0 12px #000000;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  cursor: pointer;
}
#flashmsg-container > .flashmsg-info {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=") !important;
}
#flashmsg-container > .flashmsg-danger {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=") !important;
}
#flashmsg-container > .flashmsg-success {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==") !important;
}
#flashmsg-container > .flashmsg-warning {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=") !important;
}
#flashmsg-container.flashmsg-top-center > div,
#flashmsg-container.flashmsg-bottom-center > div {
  width: 300px;
  margin-left: auto;
  margin-right: auto;
}
#flashmsg-container.flashmsg-top-full-width > div,
#flashmsg-container.flashmsg-bottom-full-width > div {
  width: 96%;
  margin-left: auto;
  margin-right: auto;
}
.flashmsg {
  background-color: #030303;
}
.flashmsg-success {
  background-color: #51A351;
}
.flashmsg-danger {
  background-color: #BD362F;
}
.flashmsg-info {
  background-color: #2F96B4;
}
.flashmsg-warning {
  background-color: #F89406;
}
.flashmsg-progress {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 4px;
  background-color: #000000;
  opacity: 0.4;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  filter: alpha(opacity=40);
}
/* Responsive Design */
@media all and (max-width: 240px) {
  #flashmsg-container > div {
    padding: 8px 8px 8px 50px;
    width: 11em;
  }
  #flashmsg-container > div.rtl {
    padding: 8px 50px 8px 8px;
  }
  #flashmsg-container .flashmsg-close-button {
    right: -0.2em;
    top: -0.2em;
  }
  #flashmsg-container .rtl .flashmsg-close-button {
    left: -0.2em;
    right: 0.2em;
  }
}
@media all and (min-width: 241px) and (max-width: 480px) {
  #flashmsg-container > div {
    padding: 8px 8px 8px 50px;
    width: 18em;
  }
  #flashmsg-container > div.rtl {
    padding: 8px 50px 8px 8px;
  }
  #flashmsg-container .flashmsg-close-button {
    right: -0.2em;
    top: -0.2em;
  }
  #flashmsg-container .rtl .flashmsg-close-button {
    left: -0.2em;
    right: 0.2em;
  }
}
@media all and (min-width: 481px) and (max-width: 768px) {
  #flashmsg-container > div {
    padding: 15px 15px 15px 50px;
    width: 25em;
  }
  #flashmsg-container > div.rtl {
    padding: 15px 50px 15px 15px;
  }
}
/*
Font: Archivo
Thin 100 + Italic
ExtraLight 200 + Italic
Light 300 + Italic
Regular 400 + Italic
Medium 500 + Italic
SemiBold 600 + Italic
Bold 700 + Italic
ExtraBold 800 + Italic
Black 900 + Italic
*/
/*
Barvy
#FFFFFF
#0000004D
#000000CC
#00000080
#000000BF
#000000
*/
body {
  color: white;
  font-family: 'Archivo', sans-serif;
  font-size: 16px;
  font-weight: normal;
  font-style: normal;
  letter-spacing: normal;
  background: black url(bg.jpg) no-repeat center center fixed;
  -webkit-font-smoothing: antialiased;
}
h1 {
  font-size: 3.2em;
  font-weight: 600;
  text-align: center;
  margin-top: 0.8rem;
  margin-bottom: 2rem;
}
h1.homepage {
  display: none;
}
@media (max-width: 500px) {
  h1 {
    font-size: 2.4em;
  }
}
@media (max-width: 350px) {
  h1 {
    font-size: 2em;
  }
}
h2 {
  font-weight: 600;
  font-size: 2em;
  margin: 1.5rem auto;
}
h3 {
  font-size: 1.6em;
  letter-spacing: 0.02em;
}
h4 {
  font-size: 1.4em;
}
h5 {
  font-size: 1.2em;
}
img {
  max-width: 100%;
  height: auto;
}
.music-city-logo-claim {
  max-width: 350px;
}
a {
  color: #1b1561;
}
a:hover {
  color: black;
  text-decoration: underline;
}
a.white {
  color: white;
}
a[href^="tel:"] {
  white-space: nowrap;
}
.error {
  color: #dc3545;
}
.logoArenaBig {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 50px;
  margin-top: 50px;
  margin-bottom: 50px;
}
@media (max-width: 300px) {
  .logoArenaBig {
    gap: 20px;
  }
}
.logoArenaBig .logoArena {
  width: auto;
  height: 150px;
}
@media (max-width: 1000px) {
  .logoArenaBig .logoArena {
    height: 100px;
  }
}
@media (max-width: 767px) {
  .logoArenaBig .logoArena {
    height: 70px;
  }
}
@media (max-width: 470px) {
  .logoArenaBig .logoArena {
    height: 50px;
  }
}
.logoArenaBig h1 {
  font-size: 4em;
  font-weight: 600;
  text-transform: uppercase;
  margin: 0;
}
@media (max-width: 1000px) {
  .logoArenaBig h1 {
    font-size: 3em;
  }
}
@media (max-width: 767px) {
  .logoArenaBig h1 {
    font-size: 2em;
  }
}
@media (max-width: 470px) {
  .logoArenaBig h1 {
    font-size: 1em;
  }
}
.logoAkustickaKytaraText,
.logoElektrickaKytaraText {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  gap: 40px;
}
.logoAkustickaKytaraText h2,
.logoElektrickaKytaraText h2 {
  font-size: 3em;
  font-weight: 600;
}
.logoAkustickaKytaraText .logoAkustickaKytara,
.logoElektrickaKytaraText .logoAkustickaKytara,
.logoAkustickaKytaraText .logoElektrickaKytara,
.logoElektrickaKytaraText .logoElektrickaKytara {
  height: 120px;
}
.partnerBigBlock,
.partnerHomeBlock {
  display: flex;
  gap: 40px;
  margin: 0 auto;
  margin-bottom: 40px;
  align-items: center;
  justify-content: center;
}
@media (max-width: 400px) {
  .partnerBigBlock,
  .partnerHomeBlock {
    flex-direction: column;
  }
}
.partnerBigBlock .item,
.partnerHomeBlock .item {
  width: 50%;
}
@media (max-width: 550px) {
  .partnerBigBlock .item,
  .partnerHomeBlock .item {
    width: 100%;
  }
}
.partnerBigBlock .item a,
.partnerHomeBlock .item a {
  margin: 0 auto;
}
.partnerHomeBlock {
  justify-content: center;
  gap: 60px;
}
.partnerHomeBlock .item {
  width: auto;
}
.partnerHomeBlock .item .logoSai {
  width: 200px;
}
.partners {
  display: flex;
  gap: 40px;
  justify-content: center;
  align-items: center;
  margin: 40px auto;
}
@media (max-width: 650px) {
  .partners {
    flex-direction: column;
    gap: 20px;
    margin: 20px auto;
  }
}
.partners .logoKytarycz {
  width: 100%;
}
.partners .logoKonzervator {
  max-height: 110px;
}
.partners .logoSai {
  height: 80px;
  width: auto;
  max-width: 100%;
}
.partners .logoBsg {
  max-height: 80px;
}
.partners .logoJkf {
  max-height: 80px;
}
.navbar .navbar-brand {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  color: white;
  text-transform: uppercase;
  font-size: 1em;
  text-decoration: none;
}
.navbar .navbar-brand .logoArena {
  width: 40px;
  height: auto;
}
@media (max-width: 400px) {
  .navbar .navbar-brand span {
    display: none;
  }
}
.signBoard {
  display: flex;
  justify-items: center;
  align-items: start;
  gap: 40px;
  margin-bottom: 40px;
}
@media (max-width: 650px) {
  .signBoard {
    flex-direction: column;
  }
}
.signBoard a {
  color: white;
  text-decoration: none;
}
.signBoard a:hover {
  filter: brightness(130%);
}
.signBoard .item {
  width: 50%;
  aspect-ratio: 1;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  border-radius: 24px;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 40px;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
}
@media (max-width: 650px) {
  .signBoard .item {
    width: 100%;
  }
}
.signBoard .item h2 {
  margin: 0;
  text-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
}
.signBoard .item.ac {
  background-image: url('box-ak-kytara.jpg');
}
.signBoard .item.el {
  background-image: url('box-el-kytara.jpg');
}
.signBoard .item .logoAkustickaKytaraText,
.signBoard .item .logoElektrickaKytaraText {
  width: 100%;
}
@media (max-width: 1199px) {
  .signBoard .item h2 {
    font-size: 2em;
  }
  .signBoard .item .logoAkustickaKytara,
  .signBoard .item .logoElektrickaKytara {
    height: 100px;
  }
}
@media (max-width: 991px) {
  .signBoard .item {
    padding-bottom: 0;
    align-items: center;
  }
  .signBoard .item .logoAkustickaKytaraText,
  .signBoard .item .logoElektrickaKytaraText {
    flex-direction: column;
  }
}
.header {
  display: flex;
  justify-content: center;
  margin-bottom: 40px;
}
.header img {
  border-radius: 1.5rem;
}
@media (max-width: 500px) {
  .header img {
    border-radius: 0.5rem;
  }
}
.textblock {
  padding: 50px;
  border-radius: 20px;
  color: #1b1561;
  background-color: rgba(255, 255, 255, 0.8);
  box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
}
@media (max-width: 950px) {
  .textblock {
    padding: 20px;
  }
}
.social {
  display: flex;
  gap: 25px;
  margin-bottom: 20px;
}
@media (max-width: 550px) {
  .social {
    margin-bottom: 0;
  }
}
.social .fa,
.social .fab,
.social .fal,
.social .far,
.social .fas {
  font-size: 25px;
}
.modal .modal-title {
  text-align: left;
  color: black;
  margin: 0;
}
.modal .modal-body {
  color: black;
}
.arena {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
  margin-bottom: 40px;
}
@media (max-width: 991px) {
  .arena {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 767px) {
  .arena {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 500px) {
  .arena {
    grid-template-columns: 1fr;
  }
}
.arena .user {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding: 10px;
  color: #212529;
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 0.5rem;
}
.arena .user .title {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-bottom: 20px;
}
.arena .user .title img {
  border-radius: 0.5rem;
}
.arena .user h2 {
  font-size: 2em;
  margin: 0;
  margin-top: 20px;
  text-align: center;
}
@media (max-width: 1199px) {
  .arena .user h2 {
    font-size: 1.2em;
  }
}
.arena .user a {
  color: #212529;
  text-decoration: none;
}
.arena .user .star {
  position: absolute;
  width: 80px;
  bottom: 0;
  right: 0;
  transform: rotate(-6deg) translate(10%, 10%);
  z-index: 99;
  overflow: hidden;
}
.arena .user .star text {
  font-family: 'Archivo';
  font-weight: 600;
}
.arena .songsList {
  display: flex;
  flex-direction: column;
  margin-bottom: 20px;
  gap: 5px;
  width: 100%;
}
.arena .songsList .item {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 5px;
}
.arena .songsList .item .fas {
  color: #364080;
  font-size: 24px;
}
.arena .songs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.arenaDetail {
  position: relative;
}
.arenaDetail .title {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 25px;
}
@media (max-width: 767px) {
  .arenaDetail .title {
    flex-direction: column;
    align-items: center;
    gap: 1em;
  }
}
.arenaDetail .title h2 {
  text-align: left;
  margin: 1em 0;
}
@media (max-width: 767px) {
  .arenaDetail .title h2 {
    margin: 0;
    margin-top: 1em;
  }
}
.arenaDetail .page {
  display: grid;
  grid-template-columns: 250px 1fr;
  gap: 40px;
}
@media (max-width: 991px) {
  .arenaDetail .page {
    grid-template-columns: 150px 1fr;
  }
}
@media (max-width: 767px) {
  .arenaDetail .page {
    grid-template-columns: 1fr;
  }
}
.arenaDetail .page img {
  margin-top: 40px;
  border-radius: 0.5rem;
}
.arenaDetail .profile {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
}
.arenaDetail .songs {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
}
.leftNav,
.rightNav {
  position: absolute;
  top: 200px;
}
@media (max-width: 650px) {
  .leftNav,
  .rightNav {
    top: 280px;
  }
}
.leftNav svg,
.rightNav svg {
  width: 50px;
}
.leftNav svg polyline,
.rightNav svg polyline {
  stroke: rgba(255, 255, 255, 0.5);
}
@media (max-width: 650px) {
  .leftNav svg polyline,
  .rightNav svg polyline {
    stroke: rgba(27, 21, 97, 0.5);
  }
}
.leftNav:hover svg polyline,
.rightNav:hover svg polyline {
  stroke: #ffffff;
}
@media (max-width: 650px) {
  .leftNav:hover svg polyline,
  .rightNav:hover svg polyline {
    stroke: #1b1561;
  }
}
.leftNav {
  left: -60px;
}
@media (max-width: 650px) {
  .leftNav {
    left: 10px;
  }
}
.rightNav {
  right: -60px;
}
@media (max-width: 650px) {
  .rightNav {
    right: 10px;
  }
}
.jsBackBtn {
  width: fit-content;
}
.jsBackBtn.hide {
  display: none;
}
.kontakt {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
}
@media (max-width: 767px) {
  .kontakt {
    grid-template-columns: 1fr;
  }
}
.kontakt .item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 20px;
}
.kontakt h3,
.kontakt p {
  margin: 0;
}
.porota {
  display: grid;
  grid: auto / 1fr;
  gap: 40px;
  justify-items: start;
  align-items: start;
}
@media (max-width: 991px) {
  .porota {
    grid: auto / 1fr;
  }
}
@media (max-width: 650px) {
  .porota {
    justify-items: center;
  }
}
@media (max-width: 650px) {
  .porota .item {
    flex-direction: column-reverse;
    text-align: center;
    gap: 10px;
  }
}
.porota .item h2 {
  margin-top: 0;
  text-align: center;
}
.porota .item h2 span {
  display: block;
  font-size: 0.5em;
  font-weight: normal;
  margin-top: 8px;
}
.porota .item .photo {
  max-width: 300px;
  float: left;
  margin-right: 20px;
  margin-bottom: 10px;
}
@media (max-width: 767px) {
  .porota .item .photo {
    float: none;
    max-width: 100%;
    margin: 0 auto;
    margin-bottom: 20px;
  }
}
.porota.elektricka {
  grid: auto / 1fr 1fr 1fr;
  justify-items: center;
}
@media (max-width: 1200px) {
  .porota.elektricka {
    grid: auto / 1fr 1fr;
  }
}
@media (max-width: 650px) {
  .porota.elektricka {
    grid: auto / 1fr;
  }
}
.porota.elektricka .item .photo {
  max-width: 100%;
  float: none;
}
.backingTracks {
  display: grid;
  grid: auto / 1fr 1fr;
  justify-content: center;
  gap: 20px;
  margin-bottom: 40px;
}
@media (max-width: 767px) {
  .backingTracks {
    grid: auto / 1fr;
  }
}
.backingTracks .item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.backingTracks .item .fas {
  font-size: 24px;
  color: black;
}
.backingTracks .item .audioPlayer {
  width: 100%;
}
.historie h2 {
  margin-top: 60px;
  border-bottom: 1px solid;
}
.userDetail .status {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 20px;
}
@media (max-width: 767px) {
  .userDetail .status {
    flex-direction: column-reverse;
  }
}
.userDetail .status h3 {
  margin-bottom: 20px;
}
.userDetail .statusData {
  width: max-content;
  display: grid;
  grid: auto / 150px 1fr;
  gap: 10px;
  margin-bottom: 40px;
}
@media (max-width: 767px) {
  .userDetail .statusData {
    grid: auto / 1fr;
  }
  .userDetail .statusData > *:nth-child(2n) {
    font-weight: bold;
  }
}
.userDetail .statusData span {
  font-weight: bold;
}
.userDetail .statusOK {
  font-weight: bold;
}
.userDetail .statusMsg {
  margin-bottom: 20px;
}
.userDetail .statusErrors b {
  color: #dc3545;
}
.userDetail .songsList {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 40px;
}
@media (max-width: 767px) {
  .userDetail .songsList {
    flex-direction: column;
  }
}
.userDetail .songsList .item {
  width: calc((100% / 2) - 20px);
}
@media (max-width: 767px) {
  .userDetail .songsList .item {
    width: 100%;
  }
}
.userDetail .songsList .item .buttonsLine {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-top: 10px;
}
.userDetail .userData {
  width: max-content;
  display: grid;
  grid: auto / 200px 1fr;
  gap: 10px;
  margin-bottom: 40px;
}
.userDetail .userData .fab,
.userDetail .userData .fas {
  display: none;
}
@media (max-width: 767px) {
  .userDetail .userData {
    grid: auto / 1fr;
  }
  .userDetail .userData > *:nth-child(2n) {
    font-weight: bold;
  }
  .userDetail .userData a span {
    display: none;
  }
  .userDetail .userData .fab,
  .userDetail .userData .fas {
    display: inline-block;
    font-size: 25px;
  }
}
footer {
  text-align: center;
  margin: 20px auto;
}
footer a {
  color: white;
  text-decoration: underline;
}
footer a:hover {
  color: #d3d3d3;
}
.coolForms {
  margin: auto;
  margin-top: 40px;
  max-width: 500px;
  text-align: left;
}
@media (max-width: 600px) {
  .coolForms {
    max-width: 100%;
  }
}
.coolForms .form-group {
  padding: 8px;
  margin-bottom: 5px;
}
.coolForms label {
  display: block;
  margin-bottom: 5px;
}
.coolForms label.form-check-label {
  margin-bottom: 0;
}
.coolForms input,
.coolForms select,
.coolForms textarea {
  border: 1px solid darkgrey;
  border-radius: 5px;
  width: calc(100% - 20px);
  margin: 2px 0px;
  display: block;
}
.coolForms textarea {
  min-height: 150px;
}
.coolForms input[type=radio],
.coolForms input[type=checkbox] {
  display: inline;
  width: 1em;
  padding: 0;
  margin-right: 10px;
  margin-bottom: 0;
}
.coolForms .button {
  _margin: auto;
  font-style: normal!important;
}
.coolForms .help-block {
  display: inline-block;
  margin-top: 8px;
}
.coolForms .has-error input,
.coolForms .has-error select,
.coolForms .has-error textarea {
  border: #c73734 solid 1px;
}
.coolForms .has-error label {
  color: #c73734;
}
.coolForms .form-control-feedback {
  display: inline-block;
  margin-top: 8px;
  color: #c73734;
}
.coolForms input.error,
.coolForms textarea.error,
.coolForms select.error {
  border-color: #c73734;
}
.coolForms button,
.coolForms input[type=reset],
.coolForms input[type=submit] {
  width: auto;
  height: auto;
  overflow: hidden;
}
.coolForms .form-control-feedback {
  display: inline-block;
  margin-top: 8px;
  color: #dc3545;
}
.coolForms .form-group > label[for$='-website'] {
  display: none;
}
.coolForms .form-group > input[name='website'] {
  display: none;
}
.coolForms .form-group:has(input[name='website']) {
  display: none;
}
.coolForms .form-group:has(input[type='submit']) {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.pagination {
  margin: 0;
  padding: 0;
  text-align: center;
  justify-content: center;
  align-items: baseline;
  gap: 5px;
}
.pagination a {
  color: white;
  display: inline-block;
  text-decoration: none;
  padding: 5px 14px;
  border-radius: 15px;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}
.pagination a.active {
  background-color: rgba(100, 60, 100, 0.8);
  color: #fff;
}
.pagination a:hover:not(.active) {
  background-color: rgba(168, 125, 168, 0.4);
}
.pagination .counter {
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 5px;
}
.video {
  position: relative;
  overflow: hidden;
  padding-top: 56.25%;
  /* 16:9 */
  margin-bottom: 20px;
}
.video > iframe,
.video > video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.video-wrap.loaded {
  position: relative;
  cursor: pointer;
}
.video-wrap.loaded::before {
  position: absolute;
  content: '';
  display: block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: url('icon_play.svg');
  background-size: 200px 200px;
  background-repeat: no-repeat;
  background-position: center center;
  z-index: 10;
  opacity: 0.6;
}
@media (max-width: 600px) {
  .video-wrap.loaded::before {
    background-size: 100px 100px;
  }
}
.video-wrap.loaded:hover::before {
  opacity: 0.9;
}
.video-wrap .normalVideo {
  position: relative;
  width: 100%;
}
.image {
  margin-bottom: 20px;
}
.gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 20px;
  margin: 20px auto;
}
.gallery a {
  display: block;
  overflow: hidden;
  box-shadow: 0 0 4px -1px #000;
}
.gallery.size1 {
  width: 100%;
}
.gallery.size2 a {
  width: calc((100% / 2) - 20px);
}
@media (max-width: 450px) {
  .gallery.size2 a {
    width: 100%;
  }
}
.gallery.size3 a {
  width: calc((100% / 3) - 20px);
}
@media (max-width: 767px) {
  .gallery.size3 a {
    width: calc((100% / 2) - 20px);
  }
}
@media (max-width: 450px) {
  .gallery.size3 a {
    width: 100%;
  }
}
.rocnik {
  margin-bottom: 60px;
  scroll-margin-top: 80px;
}
#btnToTop {
  cursor: pointer;
  position: fixed;
  bottom: 5%;
  right: 5%;
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5);
  border: 1px solid #1b1561;
  border-radius: 5px;
  background-color: #1b1561;
  color: white;
  padding: 10px 15px;
  transition: opacity 1s ease-in-out;
  opacity: 0;
  visibility: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
#btnToTop svg {
  width: 32px;
  fill: white;
}
#btnToTop.hidden {
  opacity: 0;
  visibility: hidden;
}
#btnToTop.show {
  opacity: 0.6;
  visibility: visible;
}
#btnToTop:hover {
  opacity: 1;
}