/*  Author:   Martin Stettler (http://dieweberei.ch/)
    Version:  22/04/2019 // BS v4.2.1
*/

/* ==========================================================================
   Browse Happy prompt lte IE 9
   ========================================================================== */

.browsehappy {
    margin: 3px 0;
    background: #CC0033;
    color: #FFF;
    padding: 8px; }

.browsehappy a {
    color: #FFF;
    text-decoration: underline; }

.browsehappy a:hover {
    text-decoration: none; }

/* ==========================================================================
   BASE STYLES
   ========================================================================== */


/* Bootstrap CSS Overrides */

body {
    margin: 0;
    font-family: "Nunito Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings:
      "wdth" 100,
      "YTLC" 500;
    font-size: 16px;
    font-size: calc(16px +  (22 - 16) * (100vw - 320px)/(1280 - 320));
    line-height: 1.5;
    font-weight: normal;
    color: #212529;
    text-align: left;
    background-color: #fff; }

h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: 8px;
    font-family: "Nunito Sans", sans-serif;
    font-weight: 800; }

h1 {
  font-size: 24px;
  font-size: calc(24px +  (31 - 24) * (100vw - 320px)/(1280 - 320));
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 35px;
  line-height: 1.4; }

h2 {
  font-size: 20px;
  font-size: calc(20px +  (36 - 20) * (100vw - 320px)/(1280 - 320));
  margin-bottom: 35px; }

h3 {
  font-size: 18px; }

p,
ul {
    margin-top: 0;
    margin-bottom: 40px; }

p strong{
  font-family: "Nunito Sans", sans-serif;
  font-weight: 800;
}

.text-small { 
  font-size: 16px;
  line-height: 1.3; }

ul {
    margin-top: 0;
    margin-bottom: 16px; }

b,
strong {
    font-weight: normal; }

a,
a:hover {
    color: #000;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
        transition: all 0.5s;
    cursor: pointer; }

a:focus,
button:focus {
    outline: none; }

.row {
  padding-left: 20px;
  padding-right: 20px;
}

ul.default-list {
  padding-left: 15px;
}

.default-list li {
  font-size: 15px;
}
/*
p + ul { margin-top: -40px; }*/

/* ==========================================================================
   BRAND NAME
   ========================================================================== */
header{
  padding-top: 21px;
}

.social {
  position: absolute;
  top: 5px;
  left: 16px;
  margin: 0;
  padding: 0;
}

.social li {
  list-style: none;
}

.social li span {
  display: block;
  text-align: left;
  text-indent: -9999px;
  width: 20px;
  height: 20px;
  margin-bottom: 3vw;
}

.social li.email span {
  background: url(../img/Icon_mail.svg) no-repeat;
  background-size: 100% 100%;
}

.social li.fb span {
  background: url(../img/Icon_fb.svg) no-repeat;
  background-size: 100% 100%;
}

.social li.in span {
  background: url(../img/Icon_instagram.svg) no-repeat;
  background-size: 100% 100%;
}


header .logo span{
  display: block;
  text-indent: -9999px;
  background: url(../img/onomusic.svg) no-repeat;
  background-size: 100% 100%;
  width: 180px;
  height: 120px;
  margin: auto;
  margin-bottom: 28px;
}

header .tickets{
  position: absolute;
  top:0;
  right: 16px;
}
/* ==========================================================================
   MAIN CONTENT
   ========================================================================== */
/* Header */
.header-image img{
  width:100%;
  margin-bottom: 45px;
}

.lead-box, .sponsor-box, .sponsor{
  font-size: 20px;
  font-size: calc(20px +  (24 - 20) * (100vw - 320px)/(1280 - 320));
}

.border-box p{
  margin-bottom: 28px;
}

span.border-span, span.border-smart-span, span.border-always-span{
  display: block;
  width: 100%;
  height: 1px;
  background-color: #000;
  margin-bottom: 28px;
}

span.border-span{
  display: none;
}


.content-box{
  margin-top:20px;
  margin-bottom: 20px;
}

.content-box img{
  margin-bottom: 28px;
}

.content-box p{
  font-size: 15px;
}

.bg-pink{
  background-color: #e7267c;
  padding-top: 60px;
  margin-bottom: 40px;
}

.pink-box p:first-child{
  margin-bottom: 20px;
}

.pink-box p:last-child{
  margin-bottom: 40px;
}

.sponsor-container {
  display: flex;
  align-items: center;
  margin-bottom: 40px;
}

.sponsor {
  margin: 25px 0;
}

.sponsor img {
  max-height: 75px;
  height: auto;
}

.arrow-up {
    margin: 0 auto;
    width: 23px;
    height: 37px;
    margin-bottom: 40px;
    -webkit-transition: all .3s linear;
    -o-transition: all .3s linear;
    transition: all .3s linear;
    opacity: 1;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIyLjAuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAyMy4xIDM2LjciIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDIzLjEgMzYuNzsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtjbGlwLXBhdGg6dXJsKCNTVkdJRF8yXyk7ZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDoyO30KPC9zdHlsZT4KPGc+Cgk8ZGVmcz4KCQk8cmVjdCBpZD0iU1ZHSURfMV8iIHdpZHRoPSIyMy4xIiBoZWlnaHQ9IjM2LjciLz4KCTwvZGVmcz4KCTxjbGlwUGF0aCBpZD0iU1ZHSURfMl8iPgoJCTx1c2UgeGxpbms6aHJlZj0iI1NWR0lEXzFfIiAgc3R5bGU9Im92ZXJmbG93OnZpc2libGU7Ii8+Cgk8L2NsaXBQYXRoPgoJPHBvbHlsaW5lIGNsYXNzPSJzdDAiIHBvaW50cz0iMjIuNCwxMi4yIDExLjUsMS40IDAuNywxMi4yIAkiLz4KCTxsaW5lIGNsYXNzPSJzdDAiIHgxPSIxMS41IiB5MT0iMi4yIiB4Mj0iMTEuNSIgeTI9IjM2LjciLz4KPC9nPgo8L3N2Zz4K"); 
    background-repeat: no-repeat; }

.arrow-up:hover {
    opacity: .65;
    background-position: center; }

.data {
  margin: 50px 0 100px 0;
}
/* ==========================================================================
   FOOTER
   ========================================================================== */
.footer div{
  margin-bottom: 20px;
}

footer .border-line{
  padding: 16px 15px 0 15px;
  border-bottom: 1px solid #000;
  margin-bottom: 16px;
}

.footer p:first-child{
  margin-bottom: 0;
}

.vcard, .vcard h3,
.tickets {
  font-family: "Nunito Sans", sans-serif;
    font-weight: 300;
  font-size: 20px;
}

.vcard h3 {
  margin-bottom: 4px;
}

.vcard,
.tickets {
  margin-bottom: 30px;
}

.vcard a,
.tickets a {
  color: #000; }

.vcard a:hover,
.tickets a:hover {
  text-decoration: underline; }

.footer .logo span{
  display: block;
  text-indent: -9999px;
  background: url(../img/onomusic.svg) no-repeat;
  background-size: 100% 100%;
  width: 180px;
  height: 120px;
  margin: auto;
}

.footer-bottom{
  font-family: "Nunito Sans", sans-serif;
    font-weight: 300;
  font-size: 15px;
  margin-bottom: 20px;
}


/* ==========================================================================
   SELECTION
   ========================================================================== */

::-moz-selection {
    text-shadow: none;
    background: #333;
    color: #FFF; }

::selection {
    text-shadow: none;
    background: #333;
    color: #FFF; }

img::selection {
    background: 0 0; }

img::-moz-selection {
    background: 0 0; }

body {
    webkit-tap-highlight-color: #333; }

a[href^="tel"], 
a[href^="sms"]{
    color: inherit; 
    cursor: default; 
    text-decoration: none; }