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, sup, 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;
	outline: none;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	text-decoration: none;
}
/* 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;}
textarea, select, input[type="date"], input[type="button"], input[type="datetime"], input[type="datetime-local"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"]{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-background-clip: padding;
-moz-background-clip: padding;
background-clip:padding-box;
-webkit-border-radius:0;
-moz-border-radius:0;
-ms-border-radius:0;
-o-border-radius:0;
border-radius:0;
-webkit-appearance:none;
background-color:#fff;
outline:0;
margin:0;
padding:0 5px;
border:0;
text-align: left;
font-size:14px;
height: 30px;
vertical-align: middle;
font-family: 'Roboto', sans-serif;
font-size:14px;color:#656565;
}
div, p, a, li, td {-webkit-text-size-adjust:100%;}
*, *:before, *:after {-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
/* RESET CSS */
body {font-family: 'Roboto', sans-serif;background:#f4f4f4;font-weight:300;font-size:16px;color:#fff;line-height:1;}
img {max-width:100%;display:block;}

.grid {width:968px;margin:0 auto 10px auto;}
.full-width {width:100%;margin:0;}
.col-1 {float:left;margin:0 1.5%;width:5.3333%;}
.col-2 {float:left;margin:0 1.5%;width:13.6666%;}
.col-20 {float:left;margin:0 1.5%;width:17%;}
.col-3 {float:left;margin:0 1.5%;width:22%;}
.col-4 {float:left;margin:0 1.5%;width:30.3333%;}
.col-5 {float:left;margin:0 1.5%;width:38.6666%;}
.col-6 {float:left;margin:0 1.5%;width:47%;}
.col-7 {float:left;margin:0 1.5%;width:55.3333%;}
.col-8 {float:left;margin:0 1.5%;width:63.6666%;}
.col-9 {float:left;margin:0 1.5%;width:72%;}
.col-10 {float:left;margin:0 1.5%;width:80.3333%;}
.col-11 {float:left;margin:0 1.5%;width:88.6666%;}
.col-12 {float:left;margin:0 1.5%;width:97%;}
.clearfix:after {display:table;content:"";clear:both;}

strong, b {font-weight:500;}
h3 {font-weight:500;}

.flex-grid {align-items:stretch;display:flex;flex-wrap:wrap;}
.flex-col {display:flex;flex-grow:0;flex-direction:column;}

.header-wrap {padding:30px 0;/*background:#000;*/}
.logo {width:360px;margin:0 auto;}

.black-bg {background:#121212;}
.cover-video-wrap {max-width:1200px;margin:0 auto;padding-bottom:30px;}
.cover-video {position:relative;padding-bottom:56.25%;padding-top:25px;height:0;margin-bottom:-60px;}
.cover-video iframe {position:absolute;top:0;left:0;width:100%;height:100%;}

.band-members {text-align:center;background:#000;}
.band-members .col-4 {float:right;margin:0;width:33.3333%;}
.band-members h3 {text-transform:uppercase;font-size:36px;margin:30px 0;font-weight:500;}
.band-members img.desktop {display:block;}
.band-members img.mobile {display:none;}
.about-us {width:800px;padding:60px 0 60px 0;font-size:20px;line-height:1.4;color:#444;font-weight:400;}
.about-us p {margin-bottom:10px;}
.bandcamp {width:350px;/*margin:60px auto 0 auto;*/}

.soc-netw {align-items:stretch;display:flex;flex-wrap:wrap;margin-top:30px;margin-bottom:50px;}
.soc-netw li {width:50px;height:50px;margin:0 20px 0 0;display:flex;flex-grow:0;flex-direction:column;}
.soc-netw li a {position:relative;}
.soc-netw li a:before {content:"";position:absolute;top:0;left:0;width:50px;height:50px;}
.soc-netw li.facebook a:before {background:url(img/facebook.svg) 0 0 no-repeat;}
.soc-netw li.instagram a:before {background:url(img/instagram.svg) 0 0 no-repeat;}
.soc-netw li.bandcamp a:before {background:url(img/bandcamp.svg) 0 0 no-repeat;}

.booking {margin-top:20px;margin-bottom:0px;font-size:24px;padding:40px;border:1px solid #fff;background:#fff;box-shadow:0px 10px 25px rgba(0,0,0,0.15);}
.booking p:last-of-type {margin-bottom:0;}
.booking a {color:#444;text-decoration:underline;}
.booking a:hover {color:#0f91ff;text-decoration:none;}
.dl-stuff {font-size:20px;align-items:stretch;display:flex;flex-wrap:wrap;justify-content:space-between;margin-top:10px;}
.dl-stuff li {}

.booking-2 {padding:40px 0;color:#fff;text-align:center;font-size:24px;font-weight:500;}
.booking-2 a {color:#fff;text-decoration:underline;}
.booking-2 a:hover {color:#fff;text-decoration:none;}

.gallery-wrap {background:#000;padding:40px;}
.popup-gallery {align-items:stretch;display:flex;flex-wrap:wrap;}
.popup-gallery li {width:25%;margin:20px 0;}
.popup-gallery a {display:block;margin:0;}

.award-2019 {position:relative;padding:20px 20px 20px 100px;margin-bottom:40px;background:#000;color:#fff;max-width:800px;border-radius:3px;}
.award-2019:before {content:"";background:url(img/zelta-mikrofons.png) 0 0 no-repeat;background-size:contain;width:57px;height:69px;position:absolute;top:12px;left:20px;}
.award-2019 a {color:#E8AE4A;text-decoration:underline;}
.award-2019 a:hover {color:#fff;text-decoration:none;}

blockquote {
  /*background: #f9f9f9;
  border-left: 10px solid #ccc;*/
  color:#666;
  margin: 1.5em 10px 1.5em 0;
  padding: 0.5em 10px 0.5em 0;
  quotes: "\201C""\201D""\2018""\2019";
}
blockquote:before {
  color: #ccc;
  content: open-quote;
  font-size: 4em;
  font-family:georgia;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.4em;
}
blockquote p {
  display: inline;
}


@media screen and (max-width: 1366px) {
  .grid {width:96%;margin:0 2%;}
  .logo {width:300px;}
  .band-members h3 {font-size:24px;}
}

@media screen and (max-width: 1200px) {
  .gallery-wrap {padding:40px;}
  .popup-gallery li {width:33.3333%;margin:20px 0;}
}

@media screen and (max-width: 1008px) {
  .grid {width:96%;margin:0 2%;}
  .logo {width:250px;}
  .about-us {width:96%;margin:0 2%;}
  .gallery-wrap {padding:40px;}
  .popup-gallery li {width:50%;margin:20px 0;}
}

@media screen and (max-width: 712px) {
  .col-1, .col-2, .col-20, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {width:100%;float:none;margin:0;}
  .band-members .col-4 {width:100%;}
  .band-members img.desktop {display:none;}
  .band-members img.mobile {display:block;}
  .bandcamp {width:100%;}
  .bandcamp iframe {width:100% !important;}
  .booking {padding:20px 0;background:none;border:0;border-top:2px solid #ddd;box-shadow:none;}
  .gallery-wrap {padding:40px;}
  .popup-gallery {justify-content:space-between;}
  .popup-gallery li {width:100%;margin:10px 0;text-align:center;}
  .popup-gallery img {display:inline-block;}
  .award-2019 br {display:none;}
  .award-2019 {padding:100px 20px 20px 20px;margin-bottom:40px;}
  .award-2019:before {top:15px;left:50%;margin-left:-28.5px;}
}