/**
     * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
     * http://cssreset.com
     */
    html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, tt, var,
    b, u, i, center,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td,
    article, aside, canvas, details, embed, 
    figure, figcaption, footer, header, hgroup, 
    menu, nav, output, ruby, section, summary,
    time, mark, audio, video {
    	margin: 0;
    	padding: 0;
    	border: 0;
    	font: inherit;
    	vertical-align: baseline;
    }
    /* HTML5 display-role reset for older browsers */
    article, aside, details, figcaption, figure, 
    footer, header, hgroup, menu, nav, section {
    	display: block;
    }
    body {
    	line-height: 1;
    }
    ol, ul {
    	list-style: none;
    }
    blockquote, q {
    	quotes: none;
    }
    blockquote:before, blockquote:after,
    q:before, q:after {
    	content: '';
    	content: none;
    }
    table {
    	border-collapse: collapse;
    	border-spacing: 0;
    }

@font-face {
  font-family: 'Chomsky';
  src: url('../fonts/Chomsky.woff2') format('woff2'), url('../fonts/Chomsky.woff') format('woff');
}
	
	
    body {
	   	background:#dedede;
	 	  font-family:Arial, Helvetica, sans-serif;
      font-family: 'Teko', sans-serif;
    	padding: 0;
	    position: relative;
    	margin: 0;
    }
	
*,
*:before,
*:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

 
  A:link {COLOR: inherit; TEXT-DECORATION: underline;}
  A:visited {COLOR: inherit; TEXT-DECORATION: none;}
  A:active {COLOR: inherit; TEXT-DECORATION: none;}
  A:hover {COLOR: inherit; TEXT-DECORATION: none;}


html, body { 
   
   font-family: 'Teko', sans-serif;
	-webkit-text-size-adjust: none;
	-webkit-font-smoothing: antialiased;
	font-weight:400;
	background: #000;
	color: #fff;
  margin: 0px;
  padding: 0px;
  font-size: 50px;
}


* {-webkit-font-smoothing: antialiased;}
*{-webkit-appearance: none;}

strong, b{ font-weight:bold;}
em,i{ font-style:italic;}
u{ text-decoration:underline;}
small{ font-size:70%;}
ul{ list-style:disc; margin:25px 0 25px 30px; }
ul li{ margin: 10px 0 20px; }

.clear{ clear:both;}
.clearR{ display: none; }


.center{ width:1600px; margin:auto; position:relative; }
.center-top{ height: 100%; position: relative; }

.tekst{ font-family: 'Raleway', sans-serif; font-size: 19px; line-height: 1.7; color: #EDEAEA; font-weight: 300;}

.all{ position: relative; width: 100%; overflow: hidden; }

.separator{ position: relative; width: 100%; height: 80px; }

.link-click{ position: relative; display: inline-block; cursor: pointer; z-index: 800; }
.link-click:after{ width: 100%; position: absolute; display: block; content: ''; left: 0px; top: 100%; margin-top: -1px; height: 1.5px; 
              -webkit-transition: all .2s linear;
              -moz-transition: all .2s linear;
              -ms-transition: all .2s linear;
              -o-transition: all .2s linear;
              transition: all .2s linear;}
.link-click.yellow:after{ background: #FF9D00; }
.link-click.white:after{ background: #FFF; }
.link-click:hover:after{ width: 100%; top: 50%; }

.main{ width: 100%; position: relative; height: 500px; }
.main .foto.rotate{ transform: rotate(180deg); }
.main .foto{ width: 100%; height: 100%; display: block; position: absolute; top: 0px; left: 0px; z-index: 1; 
background-image: url('../grafika/main.jpg'); background-position: top center no-repeat; background-size: cover;}

.main .foto-glitch{ width: 100%; height: 100%; display: block; position: absolute; top: 0px; left: 0px; z-index: 2; }
.glitchMobile{ animation: glitchMobile .8s linear; }



.main .logo-main{ position: absolute; width: 100%; left: 0px; bottom: 100px; text-align: center; font-size: 270px; color: #FF9D00; z-index: 600; font-family: 'Chomsky', sans-serif;}

.main .menu-container-main{ position: absolute; bottom: 30px; left: 0px; z-index: 600; width: 100%; }
.top .menu-top-container{ position: absolute; top: 10px; left: 0px; z-index: 600; width: 100%; }
ul.menu{ list-style: none; margin: auto; padding: 0px; text-align: center; position: relative; width: 1310px; }
ul.menu:after{ display: block; position: absolute; bottom: 10px; left: 0px; width: 100%; height: 2px; background: #fff; content: ''; }
ul.menu li{ display: inline-block; font-size: 35px; font-weight: 300; margin-right: 60px; position: relative; cursor: pointer; }
ul.menu li span.number{ display: inline-block; font-size: 25px; color: #FF9D00; margin-right: 5px; }
ul.menu li:last-of-type{ margin-right: 0px; }
ul.menu li .glitch-txt{ display: inline-block; }

.top .menu-top-container ul.menu{ list-style: none; margin: auto; padding: 0px; text-align: center; position: relative; width: 1130px;}
.top .menu-top-container ul.menu:after{ display: none; }
.top .menu-top-container ul.menu li{ display: inline-block; font-size: 25px; font-weight: 300; margin-right: 60px; position: relative; cursor: pointer; }
.top .menu-top-container ul.menu li:last-of-type{ margin-right: 0px; }
.top .menu-top-container ul.menu li span.number{ display: inline-block; font-size: 20px; color: #A7A7A7; margin-right: 5px; }

ul.menu li a{ text-decoration: none; }

.top{width: 100%; height: 80px; position: fixed; top: -80px; left: 0px; background: #111; z-index: 828;
  -webkit-transition: all .35s linear;
  -moz-transition: all .35s linear;
  -ms-transition: all .35s linear;
  -o-transition: all .35s linear;
  transition: all .35s linear;}
.top .logo{ position: absolute; left: 2%; top: 10px; font-size: 55px; color: #FF9D00; z-index: 800; font-family: 'Chomsky', sans-serif; cursor: pointer;}
.top.active{ top: 0px; }


.social-menu{ position: fixed; top: 13px; right: 2%; z-index: 900; }
.social-menu ul{list-style: none; margin: auto; padding: 0px; position: relative;}
.social-menu ul li{ display: inline-block; margin: 0 5px; }
.social-menu ul li img{ width: 20px; }
.social-menu ul li.social-yt img{ width: 24px; }
.social-menu ul li.social-yt{ margin-right: 3px; }

#menu-bar { width: 45px; height: 40px;  cursor: pointer; position: fixed; top: 23px; right: 2%; z-index: 900; display: none;}
.bar { height: 4px; width: 100%; background-color: #FF9D00; display: block; border-radius: 1px; transition: 0.3s ease;
-webkit-box-shadow: 0 0 5px 2px rgba(0,0,0,.2);
box-shadow: 0 0 5px 2px rgba(0,0,0,.2);}
#bar1 { transform: translateY(-6px);}
#bar2{ width: 80%; margin-left: 20%; }
#bar3 { transform: translateY(6px);}
.change { display: block;}
.change .bar { background-color: white;
-webkit-box-shadow: none;
box-shadow: none;}
.change #bar1 { transform: translateY(4px) rotateZ(-45deg);}
.change #bar2 { opacity: 0;}
.change #bar3 { transform: translateY(-6px) rotateZ(45deg);}

.menu-container{ position: fixed; width: 100%; height: 100%; z-index: 890; left: 0px; top: 0px; display: none; overflow-x: hidden; overflow-y: scroll; }
.menu-container .menu-fixed{color: #fff; font-size: 70px;  padding: 120px 50px 50px 100px; text-align: left; margin: 0px; list-style: none;}
.menu-container .menu-fixed .menu-item{ margin-bottom: 28px; opacity: 0; line-height: 1; transform: translateX(-30px); display: block; clear: both;
-webkit-transition: all .32s cubic-bezier(0.68, -0.6, 0.32, 1.6);
   -moz-transition: all .32s cubic-bezier(0.68, -0.6, 0.32, 1.6);
   -ms-transition: all .32s cubic-bezier(0.68, -0.6, 0.32, 1.6);
   -o-transition: all .32s cubic-bezier(0.68, -0.6, 0.32, 1.6);
  transition: all .32s cubic-bezier(0.68, -0.6, 0.32, 1.6);}
.menu-container .menu-fixed .menu-item.active{ transform: translateX(0); opacity: 1; }
ul.menu-fixed li span.number{ display: inline-block; font-size: 40px; color: #FF9D00; margin-right: 10px; }

.zaslona_menu{ position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; background: url(../grafika/back.jpg)  top center;  opacity: .15; background-size: 40%; z-index: 842; display: none;}
.zaslona_menu_back{position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; background: #111111 top center;  opacity: 1; background-size: 40%; z-index: 841; display: none;}


.header{ font-size: 150px; color: #FF9D00; font-family: 'Chomsky'; position: relative; display: block; z-index: 600; }
.header div{ position: relative; z-index: 100; }
.header span{ font-size: 390px; opacity: 0.16; color: #FFFFFF; position: absolute; font-family: 'Teko', sans-serif; z-index: 1;}

.back-site{ position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: url(../grafika/back.jpg) top center;  opacity: .1; background-size: 40%; }
.back-site.main-back{ z-index: 400; }
.back-site.ekipa-back{ z-index: 400; opacity: .15; }
.back-site.news-back{ z-index: 400; opacity: .15; }
.back-site.koncerty-back{ z-index: 400; opacity: .15; }
.back-site.dyskografia-back{ z-index: 400; opacity: .15; }
.back-site.merch-back{ z-index: 400; opacity: .15; }
.back-site.galeria-back{ z-index: 400; opacity: .15; }
.back-site.kontakt-back{ z-index: 400; opacity: .15; }


.ekipa{ position: relative; width: 100%; background: #111; }
.ekipa-padding{ padding: 70px 0 100px; }
.ekipa .header{ text-align: right; }
.ekipa .header span{ text-align: right; right: -10%; top: 5%; }

.ekipa-L, .ekipa-R{ float: left; width: 50%; position: relative;}
.ekipa-L{ padding-right: 2%; z-index: 600;}
.ekipa-R{ padding-left: 2%;  z-index: 600; }

.ekipa-L .foto{ width: 135%; margin-left: -20%; position: relative; z-index: 200; opacity: .65; margin-bottom: 100px;}
.ekipa-L .foto img{ width: 100%; display: block; }
.ekipa-txt-1{ width: 500px; margin-top: -70px; font-size: 40px; font-weight: 300; text-align: right; line-height: 1.5; z-index: 600; position: absolute; top: 0px; right: 2%; letter-spacing: 1px;}
.ekipa-txt-2{ font-family: 'Raleway', sans-serif; font-size: 19px; line-height: 1.7; color: #EDEAEA; margin-top: 100px; }

.czytaj-dalej-ekipa{ font-size: 22px; color: #FF9D00; text-align: center; margin-top: 40px; display: none; }


.news{ position: relative; width: 100%; background: url('../grafika/news.jpg') left top #111 no-repeat; background-size: cover; min-height: 100vh; }
.news-padding{ padding: 70px 0 100px; }
.news .header{ text-align: left; }
.news .header span{ left: -5%; top: 50px; }

.first-news{ width: 100%; color: #fff; padding-left: 320px; margin-top: 30px; position: relative; z-index: 800; }
.first-news-L, .first-news-R{ float: left; width: 50%; }
.first-news-L{ padding-right: 2%; }
.first-news-R{ padding-left: 2%; margin-top: 120px; }
.first-news-L .foto{ width: 100%; display: block; position: relative; }
.first-news-L .foto:after{ padding-top: 67%; display: block; content: ''; }
.first-news-L .foto-back-empty{ background: url('../grafika/wkk.svg') center center #000; background-size: 50%; }
.first-news-R .data{ font-size: 27px; color: #FF9D00; margin-bottom: 5px; font-weight: 300;}
.first-news-R .nazwa{ font-size: 35px; color: #EDEAEA; margin-bottom: 20px; font-weight: 300; line-height: 1.4; letter-spacing: .5px;}
.first-news-R .tekst{ margin-bottom: 20px; }
.first-news-R .more{ color: #FF9D00; font-size: 26px; font-weight: 300; }
.news-click{ cursor: pointer; }

.news-lista{ position: relative; z-index: 800; margin-top: 100px; }
.news-lista-item{ float: left; width: 50%; position: relative; margin-bottom: 70px;}
.news-lista-item:nth-of-type(2n+1){ padding-right: 5%; }
.news-lista-item:nth-of-type(2n+2){ padding-left: 5%; margin-top: 50px; }

.news-lista-item .foto{ width: 33%; float: left; display: block; position: relative; margin-right: 2%; }
.news-lista-item .foto:after{ padding-top: 70%; display: block; content: ''; }
.news-lista-item .foto-back-empty{ background: url('../grafika/wkk.svg') center center #000 no-repeat; background-size: 50%; }
.news-lista-item .content{ float: left; width: 63%; margin-left: 2%; position: relative; margin-top: 40px; }
.news-lista-item .data{ font-size: 25px; color: #FF9D00; margin-bottom: 5px; font-weight: 300;}
.news-lista-item .nazwa{ font-size: 30px; color: #EDEAEA; font-weight: 300; line-height: 1.4; letter-spacing: .5px; }
.news-lista-item .more-container{ text-align: right; }
.news-lista-item .more{ color: #FF9D00; font-size: 22px; font-weight: 300; }

.loadMore{ text-align: center; margin-top: 80px; font-size: 30px; font-weight: 300; color: #FF9D00; }

.news-max{ width: 990px; margin: auto; position: relative;  z-index: 600;}
.news-max .foto{ width: 100%; display: block; margin-bottom: 30px; }
.news-max .foto img{ width:50%; display: block; margin: auto; }
.news-max .data{ font-size: 26px; color: #FF9D00; margin-bottom: 10px; font-weight: 300;}
.news-max .nazwa{ font-size: 37px; font-weight: 300; color: #EDEAEA; margin-bottom: 25px; }
.news-max .tekst{ margin-bottom: 30px; }

.news-next-prev{ width: 240px; position: relative; font-size: 20px; color: #FF9D00; margin-top: 30px; margin-bottom: 30px; z-index: 600; cursor: pointer;}
.news-next-prev.prev{ float: left;}
.news-next-prev.next{ float: right; text-align: right;}
.news-next-prev .foto{ width: 100%; display: block; margin-bottom: 15px; }
.news-next-prev .foto:after{ padding-top: 70%; display: block; content: ''; }


.koncerty{ position: relative; width: 100%; background: url('../grafika/koncerty.jpg') right top #111 no-repeat; background-size: 100%; min-height: 100vh;}
.koncerty-padding{ padding: 70px 0 100px; }
.koncerty .header{ text-align: left; }
.koncerty .header span{ left: -5%; top: 50px; }
.brak-koncertow{ text-align: center; font-size: 35px; }

.koncerty-container{ float: right; width: 850px; position: relative; z-index: 600; margin-top: 50px; }

.koncerty-row{ position: relative; padding-left: 170px; margin-bottom: 40px; font-size: 23px; }
.koncerty-row .data{ position: absolute; top: 0px; left: 0px; font-size: 37px; font-weight: 300; width: 120px; letter-spacing: .5px; }
.koncerty-row .data span{ display: block; font-size: 26px; margin-top: 3px;}
.koncerty-row .nazwa{ font-size: 37px; color: #FF9D00; font-weight: 300; width: 100%; letter-spacing: .5px; }
.koncerty-row .miejsce{ font-size: 23px; font-family: 'Raleway', sans-serif; font-weight: 300; width: 100%; letter-spacing: .5px; margin-top:10px; position: relative; min-height: 30px; padding-right: 200px;}
.koncerty-row .koncerty-klik{ position: absolute; font-size: 26px; font-weight: 300; color: #EDEAEA; }
.koncerty-row .koncerty-klik a{ text-decoration: none; }
.koncerty-row .koncerty-klik.klik-szczegoly{ bottom: 0px; right: 110px; }
.koncerty-row .koncerty-klik.klik-kup{ bottom: 0px; right: 0px; }

.koncerty-slider{ width: 100%; position: relative; }
.koncerty-slider .slide{ position: relative; width: 100%; }

.koncerty-controls{ text-align: center; }
.koncerty-icon{ display: inline-block; margin: 0 5px; width: 30px; height: 30px; mask-size: cover; background-color: #FF9D00; cursor: pointer;}
.koncerty-prev{ -webkit-mask: url(../grafika/up.svg) no-repeat center;
                mask: url(../grafika/up.svg) no-repeat center; }
.koncerty-next{ -webkit-mask: url(../grafika/down.svg) no-repeat center;
                mask: url(../grafika/down.svg) no-repeat center; }
.koncerty-icon:hover{ background-color: #fff; }


.video{ position: relative; width: 100%; background: #111 no-repeat; min-height: 97vh;}
.video .center{ height: 97vh; }
.video-padding{ padding: 70px 0 100px; }
.video .header{ text-align: right; }
.video .header span{ right: -5%; top: -20px; }

.video-back{ width: 100%; position: absolute; overflow: hidden; height: 100%; z-index: 100; top: 0px; left: 0px;}
.video-back video { position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%);}
.video-frame{ width: 90px; height: 4px; background: #fff; position: absolute; z-index: 300; }
.video-frame:after{ height: 58px; width: 4px; background: #fff; content: ''; display: block; position: absolute;}
.video-frame.tl{ top: 60px; left: 50px; }
.video-frame.tr{ top: 60px; right: 50px; }
.video-frame.bl{ bottom: 60px; left: 50px; }
.video-frame.br{ bottom: 60px; right: 50px; }
.video-frame.tl:after{ top: 0px; left: 0px; }
.video-frame.tr:after{ top: 0px; right: 0px; }
.video-frame.bl:after{ bottom: 0px; left: 0px; }
.video-frame.br:after{ bottom: 0px; right: 0px; }
.video-rec{ position: absolute; top: 94px; left: 92px; font-size: 40px; color: #fff; z-index: 400; letter-spacing: 2px; }
.video-rec:after{ width: 20px; height: 20px; background: red; position: absolute; right: -32px; top: 7px; display: block; content: ''; border-radius: 100%; animation: recording 1.5s infinite both;}
.video-time{ position: absolute; bottom: 94px; left: 92px; font-size: 30px; color: #fff; z-index: 400; letter-spacing: 1px; }

.video-content{position: absolute; width: 100%; z-index: 600;}
.video-menu{ text-align: center; }
.video-menu .item{ font-size: 35px; letter-spacing: 1px; display: inline-block; margin: 0 25px; font-weight: 300; cursor: pointer; color: #FF9D00}
.video-menu .item .link-click{ color: #FFF; font-size: 30px; }
.video-slider{ margin-top: 60px; }
.slider-live{ display: none; }
.video-slide{ position: relative; margin: 0%; cursor: pointer;}
.video-slide a{ text-decoration: none; }
.video-slide .foto{ width: 100%; display: block; position: relative;}
.video-slide .foto:after{ padding-top: 65%; content: ''; display: block; width: 100%; position: relative; }
.video-slide .foto:before{ position: absolute; top: 50%; left: 50%; margin-top: -35px; margin-left: -35px; height: 70px; width: 70px; content: ''; display: block; background: url(../grafika/play.svg) center center; background-size: contain; 
              -webkit-transition: all .2s linear;
              -moz-transition: all .2s linear;
              -ms-transition: all .2s linear;
              -o-transition: all .2s linear;
              transition: all .2s linear; }
.video-slide:hover .foto:before{ transform: scale(1.2); }
.video-slide .nazwa{ color: #fff; font-size: 32px; font-weight: 300; text-align: right; margin-top: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.video-controls{ text-align: center; margin-top: 30px; }
.video-icon{ display: inline-block; margin: 0 5px; width: 30px; height: 30px; mask-size: cover; background-color: #FF9D00; cursor: pointer;
-webkit-transition: all .2s linear;
              -moz-transition: all .2s linear;
              -ms-transition: all .2s linear;
              -o-transition: all .2s linear;
              transition: all .2s linear; }
.video-prev{ -webkit-mask: url(../grafika/left.svg) no-repeat center;
                mask: url(../grafika/left.svg) no-repeat center; }
.video-next{ -webkit-mask: url(../grafika/right.svg) no-repeat center;
                mask: url(../grafika/right.svg) no-repeat center; }
.video-icon:hover{ background-color: #fff; }



.dyskografia{ position: relative; width: 100%; background: #111 no-repeat; min-height: 100vh;}
.dyskografia-padding{ padding: 70px 0 100px; }
.dyskografia .header{ text-align: left; }
.dyskografia .header span{ left: -10%; top: -10px; }

.dyskografia-container{ width: 106%; margin: -3%; position: relative; color: #fff; margin-top: 150px; z-index: 600; text-align: center; font-size: 1px;}
.dyskografia-container .plyta{ width: 27%; display: block; float: left; margin: 0 3% 4%; }
.dyskografia-container .plyta:nth-of-type(3n+1){clear: both;}
.dyskografia-container .plyta .foto{ position: relative; width: 100%; padding-left: 40px; }
.dyskografia-container .plyta .foto .icons{ position: absolute; bottom: 0px; left: 0px; width: 25px; min-height: 10px; }
.plyta-icons .icon{ margin-top: 20px; position: relative; z-index: 600; }
.plyta-icons .icon img{ width: 100%; display: block; cursor: pointer; }
.plyta-icons .icon:after{ position: absolute; content: attr(data-txt); font-size: 19px; color: #000; background: #FF9D00; padding: 4px 6px 2px; display: none; left: 31px; top: -12px; z-index: 800; line-height: 1; }
.plyta-icons .icon:hover:after{ display: block; z-index: 800; }
.plyta-icons .icon:hover{ z-index: 800; }
.click-plyta{ cursor: pointer; }

.dyskografia-container .plyta .foto .foto-inner{ width: 100%; position: relative; z-index: 600; }
.dyskografia-container .plyta .foto .foto-inner:after{ padding-top: 100%; display: block; content: ''; position: relative; z-index: 600; }
.dyskografia-container .plyta .foto .foto-inner .foto-file{ position: absolute; top: 0px; left: 0px; z-index: 600; width: 100%; height: 100%; }
.dyskografia-container .plyta .foto .foto-inner:before{ position: absolute; content: ''; display: block; width: 106%; height: 103%; left: 0px; top: 0px; background: #FF9D00; z-index: -1; opacity: 0;
              -webkit-transition: all .2s linear;
              -moz-transition: all .2s linear;
              -ms-transition: all .2s linear;
              -o-transition: all .2s linear;
              transition: all .2s linear;}
.dyskografia-container .plyta .nazwa{ text-align: right; font-size: 40px; font-weight: 300; margin-top: 20px; color: #EDEAEA; letter-spacing: 1px; }
.dyskografia-container .plyta:hover .foto .foto-inner:before{ opacity: 1; }

.plyta-columns{ display: flex; align-items: flex-start; width: 1050px; margin: auto; position: relative; z-index: 600; }
.plyta-max-L{ width: 50%; align-self: flex-end; text-align: right; padding-right: 25px; }
.plyta-max-L .plyta-max-nazwa{ font-size: 70px; letter-spacing: 1px; font-weight: 300; }
.plyta-max-L .plyta-max-dopisek{ color: #FF9D00; font-size: 22px; font-family: 'Raleway', sans-serif; margin-top: 0px; letter-spacing: 1px; font-weight: 300; margin-bottom: 10px; }
.plyta-max-R{ width: 50%; }
.plyta-max-R img{ width: 100%; display: block; }
.plyta-max-icons{ margin-top: 40px auto; text-align: center; margin-top: 50px; position: relative; z-index: 600;}
.plyta-max-icons .icon{ width: 30px; display: inline-block; margin: 0 20px; position: relative; z-index: 600; }
.plyta-max-txt{ width: 1050px; margin: auto; margin-top: 60px; margin-bottom: 30px; position: relative; z-index: 600; }



.merch{ position: relative; width: 100%; background: url('../grafika/merch.jpg') center center #111 no-repeat; background-size: cover; min-height: 100vh;}
.merch-padding{ padding: 70px 0 100px; }
.merch .header{ text-align: left; }
.merch .header span{ left: -5%; top: 50px; }

.merch-content{ margin-top: 50px; position: relative; }
.merch-L, .merch-R{ width: 35%; position: relative; z-index: 600;}
.merch-L{ text-align: right; font-weight: 300; color: #EDEAEA; font-size: 30px; margin-left: 5%; line-height: 1.5;}
.merch-L .link-shop{ margin-top: 50px; text-align: right; color: #FF9D00; line-height: 1; }
.merch-L .link-shop a{text-decoration: none;}


.galeria{ position: relative; width: 100%; background: url('../grafika/foto.jpg') center top #111 no-repeat; background-size: 100%; min-height: 100vh;}
.galeria-padding{ padding: 70px 0 100px; }
.galeria .header{ text-align: left; }
.galeria .header span{ left: -10%; top: 00px; }

/*
.galeria-container{ width: 104%; position: relative; margin: 100px 0; margin-left: -2%; z-index: 600; }
.galeria-container .foto{ float: left; margin: 2%; overflow: hidden; border-style: solid; border-width: 2px; position: relative;}
.galeria-container .foto:after{ content: ''; display: block; position: relative; }
.galeria-container .foto div{ position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
.galeria-container .foto:nth-of-type(6n+1){ border-color: red; width: 37.5%;}
.galeria-container .foto:nth-of-type(6n+1):after{ padding-top: 67%;}
.galeria-container .foto:nth-of-type(6n+2){ border-color: yellow; width: 25.2%; }
.galeria-container .foto:nth-of-type(6n+2):after{ padding-top: 100%;}
.galeria-container .foto:nth-of-type(6n+3){ border-color: orange; width: 25.2%; }
.galeria-container .foto:nth-of-type(6n+3):after{ padding-top: 100%;}

.galeria-container .foto:nth-of-type(6n+4){ border-color: brown; width: 25.2%;}
.galeria-container .foto:nth-of-type(6n+4):after{ padding-top: 100%;}
.galeria-container .foto:nth-of-type(6n+5){ border-color: brown; width: 25.2%;}
.galeria-container .foto:nth-of-type(6n+5):after{ padding-top: 100%;}
.galeria-container .foto:nth-of-type(6n+6){ border-color: brown; width: 37.5%;}
.galeria-container .foto:nth-of-type(6n+6):after{ padding-top: 67%;}

.galeria-container{ width: 100%; margin: auto; position: relative; display: flex; flex-wrap: wrap; margin-bottom: 70px; margin-top: 100px; z-index: 600;}
.galeria-container::after { content: '';  flex-grow: 999999999;}
.galeria-container .foto{ flex-grow: 1; height: 310px; margin: 12px; background-color: #000; overflow: hidden; position: relative; background: #FF9D00;}
.galeria-container .foto img{ height: 310px; object-fit: cover; object-position:center top; max-width: 100%; min-width: 100%; 
  -webkit-transition: all .210s linear;
  -moz-transition: all .210s linear;
  -ms-transition: all .210s linear;
  -o-transition: all .210s linear;
  transition: all .21s linear; }
  */
.galeria-container{ width: 102%; margin-left: -1%; position: relative; margin-bottom: 70px; margin-top: 100px; z-index: 600;}
.galeria-container .foto{ position: relative; width: 23%; margin: 1%; overflow: hidden; }
.galeria-container .foto img{ width: 100%; display: block;
  -webkit-transition: all .210s linear;
  -moz-transition: all .210s linear;
  -ms-transition: all .210s linear;
  -o-transition: all .210s linear;
  transition: all .21s linear; }
.galeria-container .foto:hover img{ transform: scale(1.1); opacity: .8 }


.galeria-container-R{ width: 100%; margin: auto; position: relative; margin-bottom: 30px; margin-top: 60px; z-index: 600; display: none;}
.galeria-container-R .foto{ width: 100%; display: block; margin-bottom: 30px;}
.galeria-container-R .foto img{ width: 100%; display: block; }

.kontakt{ position: relative; width: 100%; background: url('../grafika/kontakt.jpg') top center #111 no-repeat; background-size: cover; min-height: 100vh;}
.kontakt-padding{ padding: 70px 0 100px; }
.kontakt .header{ text-align: right; }
.kontakt .header span{ right: -10%; top: 0px; }

.kontakt-content{ position: relative; z-index: 600; margin-top: 50px; }
.kontakt-L, .kontakt-R{ width: 35%; position: relative; float: left; margin-bottom: 100px; }
.kontakt-L{ text-align: right; font-weight: 300; color: #EDEAEA; font-size: 30px; margin-left: 5%; line-height: 1.5;}
.kontakt-L a, .kontakt-R a{ color: #FF9D00; text-decoration: none; line-height: 1; }
.kontakt-R{ text-align: left; font-weight: 300; color: #EDEAEA; font-size: 30px; margin-left: 5%; line-height: 1.5;}

.kontakt-link-download{ font-size: 27px; color: #fff; }
.kontakt-link-download span{ font-size: 22px; }
.kontakt-link-download a{ color: #fff; }



.copyright{ background: #111; padding: 15px 0; text-align: center; font-size: 19px; color: #999; }
.copyright a{ color: #FF9D00; margin-left: 10px; }



.zaslona{ width: 100%; height: 0%; position: fixed; background: #000; opacity: .98; z-index: 1050; 
  -webkit-transition: all .40s linear;
  -moz-transition: all .40s linear;
  -ms-transition: all .40s linear;
  -o-transition: all .40s linear;
  transition: all .40s linear;}
.zaslona{ left: 0px; bottom: 0px; }
.zaslonaAll{height: 100%;}
.zaslonaInner{ position:fixed; width:100%; height:100%; overflow-y:auto; top:0px; left:0%; z-index:1051; opacity:0; -webkit-overflow-scrolling: touch; color: #fff;}

.closeOverlay{ width:40px; height:40px; float:right; margin-bottom:30px; z-index:950; cursor:pointer; opacity:1; position: relative; margin-top: 20px;
              -webkit-transition: all .2s linear;
              -moz-transition: all .2s linear;
              -ms-transition: all .2s linear;
              -o-transition: all .2s linear;
              transition: all .2s linear; }
.closeOverlay .close1{ width: 4px; height: 40px; transform: rotate(45deg); background: #fff; position: absolute; left: 20px; top: 0px; }
.closeOverlay .close2{ width: 4px; height: 40px; transform: rotate(-45deg); background: #fff; position: absolute; left: 20px; top: 0px; }



.link {
    cursor: pointer;
    position: relative;
    white-space: nowrap;
    color: #fff;
}

.link::before,
.link::after {
    position: absolute;
    width: 100%;
    height: 2px;
    background: #FF9D00;
    top: 50%;
    left: 0;
    pointer-events: none;
}

.link::before {
    content: '';

}


.link--helike:hover span {
    animation: glitchText 0.4s linear;
}

@keyframes glitchText {
    0% {
        opacity: 1;
        transform: translate3d(-10px, 0, 0) scale3d(-1, -1, 1);
        -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
        clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
    }

    10% {
        -webkit-clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
        clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
    }

    20% {
        -webkit-clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
        clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
    }

    35% {
        -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
        clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
    }

    50% {
        -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
        clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
    }

    60% {
        -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
        clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
    }

    70% {
        -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
        clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
    }

    80% {
        -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
        clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
    }

    90% {
        transform: translate3d(-10px, 0, 0) scale3d(-1, -1, 1);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    }
}

.link--helike::before {
    height: 2px;
    opacity: 0;
}
li.active .link--helike:before{
  opacity: 1;
}

.link--helike:hover::before {
    opacity: 1;
    animation: glitchLine 0.4s steps(2, start) forwards;
}

@keyframes glitchLine {
    0% {
        transform: scale3d(1, 1, 1);
    }

    10% {
        transform: translate3d(10px, 0, 0);
    }

    20% {
        transform: translate3d(0, 4px, 0);
    }

    30% {
        transform: scale3d(0.1, 1.4, 1) translate3d(0, -25px, 0);
        transform-origin: 100% 0%;
    }

    40% {
        transform: scale3d(1, 0.3, 1) translate3d(0, 25px, 0);
    }

    50% {
        transform: scale3d(0.5, 0.3, 1) translate3d(-100px, -80px, 0);
    }

    60% {
        transform: scale3d(1, 1.25, 1) translate3d(10px, -5px, 0);
    }

    70% {
        transform: scale3d(0.5, 0.5, 1) translate3d(0, 20px, 0);
    }

    80% {
        transform: translate3d(-30, 10px, 0) scale3d(1, 0.4, 1);
        transform-origin: 100% 0%;
    }

    90% {
        transform: scale3d(1, 0.5, 1) translate3d(0, -15px, 0);
        ;
        transform-origin: 0% 50%;
    }

    100% {
        opacity: 1;
    }
}



.loader{ position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 99999;
   background-color: #000;
   font-family: 'Chomsky', sans-serif;
   background: radial-gradient(circle at center,#444 0%,#000 100%);}

.noise-wrapper { position: absolute;left: 0;top: 0;width: 100%;height: 100%;opacity: 1; overflow: hidden; z-index: 10;}

.noise { position: absolute; top: -500px; right: -500px; bottom: -500px; left: -500px; background: transparent url(../grafika/back.jpg) 0 0; background-size: 320px 320px; opacity: .35; }

.loader .wkk{ width: 250px; height: 80px; position: absolute; top: 50%; left: 50%; margin-left: -125px; margin-top: -40px; z-index: 100; mix-blend-mode: overlay;}
.loader .wkk img{ width: 100%; }
.loader .wkk2{ width: 250px; height: 80px; position: absolute; top: 50%; left: 50%; margin-left: -125px; margin-top: -40px; z-index: 150; overflow: hidden; }
.loader .wkk2 img{ width: 100%; }
.loader .wkk2 div{ position: absolute; bottom: 0px; left: 0px; width: 100%; height: 0%; display: block; overflow: hidden; animation: logo 2s infinite both;}
.loader .wkk2 div span{ position: absolute; width: 100%; height: 80px; bottom: 0px; left: 0px; display: block; }


@keyframes logo {
   0% {
     height: 0%;
  }
   100% {
     height: 100%;
  }
}

@keyframes recording {
   0% {
     opacity: 1;
  }
   5% {
     opacity: 0;
  }
  55% {
     opacity: 0;
  }
  60% {
     opacity: 1;
  }
}
 

 @keyframes glitchMobile {
   0% {
     transform: translateX(0px) translateY(0px) rotate(180deg);
  }
   20% {
     transform: translateX(0px) translateY(0px) rotate(180deg);
  }
   22% {
     transform: translateX(125px) translateY(40px) rotate(180deg);
  }
  24% {
     transform: translateX(125px) translateY(40px) rotate(180deg);
  }
  26% {
     transform: translateX(125px) translateY(40px) rotate(180deg);
  }
  28% {
     transform: translateX(0px) translateY(0px) rotate(180deg);
  }
  30% {
     transform: translateX(125px) translateY(20px) rotate(180deg);
  }
  33% {
     transform: translateX(0px) translateY(0px) rotate(180deg);
  }
  35% {
     transform: translateX(10px) translateY(10px) rotate(180deg);
  }
  37% {
     transform: translateX(0px) translateY(0px) rotate(180deg);
  }
  39% {
     transform: translateX(10px) translateY(10px) rotate(180deg);
  }
  40% {
     transform: translateX(-20px) translateY(-40px) rotate(180deg) scale(1.3);
  }
  42% {
     transform: translateX(225px) translateY(20px) rotate(180deg) scale(1.3);
  }
  44% {
     transform: translateX(200px) translateY(0px) rotate(180deg) scale(1.3);
  }
  46% {
     transform: translateX(10px) translateY(10px) rotate(180deg) scale(1.3);
  }
  48% {
     transform: translateX(0px) translateY(0px) rotate(180deg) scale(1);
  }
  50% {
     transform: translateX(10px) translateY(10px) rotate(180deg);
  }
  52% {
     transform: translateX(-20px) translateY(-40px) rotate(180deg);
  } 
  53% {
     opacity: 1;
      transform: translateX(0px) translateY(0px) rotate(180deg);
  }
  99% {
     opacity: 1;
      transform: translateX(0px) translateY(0px) rotate(180deg);
  }
  100% {
     opacity: 1;
      transform: translateX(0px) translateY(0px) rotate(0deg);
  }
}