/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
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;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
  letter-spacing: -0.02cm;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}


body{
      width: 100%;
      height: auto;
      padding-bottom: 54.6%;
      background: linear-gradient(-180deg, rgb(124, 193, 249) 10%, #ff847a 95%);
      border: none;
      border-radius: 5px;
      overflow-x: hidden;
    }
    @font-face {
      font-family: uniqueBold;
      src: url(font/Unique-Bold.otf);
    }
    @font-face {
      font-family: GeneralSans;
      src: url(font/GeneralSans-Medium.otf);
    }
    ::selection {
    color: #ffffff;
    background-color: #fc47f3;
}
    a:hover{
      color: #fc47f3;
      text-shadow: 
      -1px -1px 0 #ffffff,
      1px -1px 0 #ffffff,
      -1px 1px 0 #ffffff,
      1px 1px 0 #ffffff;
    }
    a{
      text-decoration: underline;
    }
    a:visited{
      text-decoration: underline;
    }
    .readingTexts{
      font-family: GeneralSans;
      font-size: 21px;
      letter-spacing: 0.01rem; 
      line-height: 1.35;
      color: white;   
    }
    .link{
      color: #ffffff;
      cursor: pointer;
    }
    .anchors{
      color: #ffffff;
      cursor: pointer;
      letter-spacing: 0.2rem; 
      text-decoration: none;
    }
    .pinkOutline{
      color: #ffffff;
      text-shadow:
      -1px -1px 0 #fc47f3,
      1px -1px 0 #fc47f3,
      -1px 1px 0 #fc47f3,
      1px 1px 0 #fc47f3;
    }
    .pinkTexts{
      color: #fc47f3;
      text-shadow:
      -1px -1px 0 #ffffff,
      1px -1px 0 #ffffff,
      -1px 1px 0 #ffffff,
      1px 1px 0 #ffffff;
    }
    .vectorElements{
      pointer-events: none;
      position: absolute;
    }
    .topDrawingLeft{
      position: fixed;
      width: 30%;
      left: 0%;
      top: 0.5vw;
    }
    .topDrawingRight{
        position: fixed;
        width: 30%;
        right: 1.5%;
        top: 0.5vw;
    }
    .title{
      display: block;
      width: 85%;
      left: 7.5%;
      top: 6.5vw;
    }
    .titlePortrait{
        display: none;
      }
    .titleSmall{
        top: 10px;
        width: 50%;
        left: 25%;
        pointer-events: auto;
    }
    .titleSmallPortrait{
        display: none;
  }
  .subtitles{
    font-family: uniqueBold;
    text-align: center;
    letter-spacing: 0.2rem;
    font-size: 4vw;
    color: white;
    text-shadow:
     -1px -1px 0 #fc47f3,
     1px -1px 0 #fc47f3,
     -1px 1px 0 #fc47f3,
     1px 1px 0 #fc47f3; 
  }
    .drone{
      right: 24%;
      top: 90vw;
      width: 11%;
    }
    .bricksPortrait{
        display: none;
    }
    .bricks{
      position: relative;
      left: -16%;
      top: 5vw;
      width: 99vw;
    }
    #aboutButton{
      width: 5.8vw;
      height: 4.4vw;
      text-align: center;
      position: fixed;
      padding-top: 6px;
      padding-left: 2px;
      text-decoration: none;
      border-radius: 21%;
      background-color: #ffffff;
      box-shadow: 
      -1px -1px 0 #fc47f3,
      1px -1px 0 #fc47f3,
      -1px 1px 0 #fc47f3,
      1px 1px 0 #fc47f3;
      right: 1.7vw;
      bottom: 20px;
    }
    #aboutButton:hover{
      text-decoration: none;
      background-color: #fc47f3;
      box-shadow: 
      -1px -1px 0 #ffffff,
      1px -1px 0 #ffffff,
      -1px 1px 0 #ffffff,
      1px 1px 0 #ffffff;
      color: #ffffff;
      text-shadow: 
      -1px -1px 0 #fc47f3,
      1px -1px 0 #fc47f3,
      -1px 1px 0 #fc47f3,
      1px 1px 0 #fc47f3;
    }
    #returnButton{
      width: 5.8vw;
      height: 4.4vw;
      text-align: center;
      position: fixed;
      padding-bottom: 6px;
      padding-left: 2px;
      text-decoration: none;
      border-radius: 21%;
      background-color: #ffffff;
      box-shadow: 
      -1px -1px 0 #fc47f3,
      1px -1px 0 #fc47f3,
      -1px 1px 0 #fc47f3,
      1px 1px 0 #fc47f3;
      right: 1.7vw;
      bottom: 20px;
    }
    #returnButton:hover{
      text-decoration: none;
      background-color: #fc47f3;
      box-shadow: 
      -1px -1px 0 #ffffff,
      1px -1px 0 #ffffff,
      -1px 1px 0 #ffffff,
      1px 1px 0 #ffffff;
      color: #ffffff;
      text-shadow: 
      -1px -1px 0 #fc47f3,
      1px -1px 0 #fc47f3,
      -1px 1px 0 #fc47f3,
      1px 1px 0 #fc47f3;
    }
    #ticketButton{
      width: 7.2vw;
      height: 4.4vw;
      letter-spacing: 0.1rem;
      text-align: center;
      position: fixed;
      padding-top: 6px;
      padding-left: 2px;
      text-decoration: none;
      border-radius: 18%/20% ;
      background-color: #ffffff;
      box-shadow: 
      -1px -1px 0 #fc47f3,
      1px -1px 0 #fc47f3,
      -1px 1px 0 #fc47f3,
      1px 1px 0 #fc47f3;
      left: 1.7vw;
      bottom: 20px;
    }
    #ticketButton:hover{
      text-decoration: none;
      background-color: #fc47f3;
      box-shadow: 
      -1px -1px 0 #ffffff,
      1px -1px 0 #ffffff,
      -1px 1px 0 #ffffff,
      1px 1px 0 #ffffff;
      color: #ffffff;
      text-shadow: 
      -1px -1px 0 #fc47f3,
      1px -1px 0 #fc47f3,
      -1px 1px 0 #fc47f3,
      1px 1px 0 #fc47f3;
    }
    .aboutPage{
      position: relative;
      top: 27vw;
      width: 76%;
      left: 12%;
    }
    .creditsSection{
      padding-top: 30px;
      text-align: center;
    }
    .content{
      position: relative;
      text-align: center;
      top: 50vw;
      width: 76%;
      left: 12%;
    }

    .programmeTitle{
      position: relative;
      width: 80%;
      margin-bottom: -10%;
      margin-top: 10%;
    }
    .participantsList{
      text-align: center;
      font-family: uniqueBold;
      letter-spacing: 0.1rem;
      font-size: 4vw;
      color: white;
      text-shadow:
       -1px -1px 0 #fc47f3,
       1px -1px 0 #fc47f3,
       -1px 1px 0 #fc47f3,
       1px 1px 0 #fc47f3; 
    }
    .textDescriptions{
      text-align: left;
      color: #ffffff;
      text-shadow: none;
    }

  .time{
display: none;
  }
  .workTitle{
    font-family: GeneralSans;
    text-align: center;
    font-size: 2.2vw;
    letter-spacing: 0.01rem;
    color: #fc47f3; 
  }
  .dot{
    position: relative;
    width: 40%;
    left: 30%;
  }
  .artistTitle{
    position: relative;
    width: 100%;
    display: inline;
    padding-top: 13vw;
  }
  .artistTitlePortrait{
    display: none; 
  }
  .artistImg{
    position: relative;
    height: 30vw;
    box-shadow: 
    -1px -1px 0 #fc47f3,
    1px -1px 0 #fc47f3,
    -1px 1px 0 #fc47f3,
    1px 1px 0 #fc47f3;
    border-radius: 25px;
    margin-top: 2%;
    margin-bottom: 2%;
  }

.map{
  position: relative;
  width: 90%;
  box-shadow: 
  -1px -1px 0 #fc47f3,
  1px -1px 0 #fc47f3,
  -1px 1px 0 #fc47f3,
  1px 1px 0 #fc47f3;
  border-radius: 25px;
  margin-top: 3%;
}






    @media only screen and (max-width : 999px)  {

        body{
            height: auto;
            width: 100%;
            padding-bottom: 103vw;
        }
        .texts{
            font-family: uniqueBold;
            letter-spacing: 0.17rem;
            font-size: 6vw;
            color: white;
            text-shadow:
             -1px -1px 0 #fc47f3,
             1px -1px 0 #fc47f3,
             -1px 1px 0 #fc47f3,
             1px 1px 0 #fc47f3; 
          }
          .readingTexts{
            font-family: GeneralSans;
            font-size: 19px;
            letter-spacing: 0.01rem;
            line-height: 1.30;
            color: white;   
          }
          .vectorElements{
            pointer-events: none;
            position: absolute;
          }
          .topDrawingLeft{
            position: fixed;
            width: 48vw;
            left: 0px;
            top: 0.5vw;
          }
          .topDrawingRight{
              position: fixed;
              width: 48vw;
              right: 2.5vw;
              top: 0.5vw;
          }
          .title{
            display: none;
          }
          .titlePortrait{
            display: block;
            width: 98vw;
            left: 1vw;
            top: 25vw;
          }
          .titleSmallPortrait{
            top: 25vw;
            width: 50%;
            left: 25%;
            display: block;
            pointer-events: auto;
        }
          .titleSmall{
            display: none;
        }
        .drone{
          display: none;
        }
          .bricksPortrait{
            position: relative;
            display: block;
            top: 0vw;
            left: -9%;
            width: 115%;
          }
          .bricks{
            display: none;
          }
          .content{
            position: relative;
            top: 105vw;
            width: 86%;
            left: 7%;
          }
          .participantsList{
            position: relative;
            left: 1%;
            text-align: center;
            font-family: uniqueBold;
            letter-spacing: 0.1rem;
            font-size: 7vw;
            color: white;
            text-shadow:
             -1px -1px 0 #fc47f3,
             1px -1px 0 #fc47f3,
             -1px 1px 0 #fc47f3,
             1px 1px 0 #fc47f3; 
          }
          #returnButton{
            width: 10.8vw;
            height: 7.5vw;
            text-align: center;
            position: fixed;
            padding-bottom: 5px;
            padding-top: 3px;
            padding-left: 2px;
            right: 2.7vw;
            bottom: 2.7vw;
          }
          #aboutButton{
            width: 10.8vw;
            height: 7.5vw;
            text-align: center;
            position: fixed;
            padding-top: 3px;
            padding-left: 2px;
            padding-bottom: 9px;
            border-radius: 21%;
            right: 2.7vw;
            bottom: 2.7vw;
            font-size: 9vw;
          }
          #ticketButton{
            width: 17vw;
            height: 7.5vw;
            text-align: center;
            position: fixed;
            padding-top: 3px;
            padding-left: 2px;
            padding-bottom: 9px;
            border-radius: 14%/20%;
            left: 2.7vw;
            bottom: 2.7vw;
            font-size: 9vw;
          }
          .aboutPage{
            top: 75vw;
            width: 86%;
            left: 7%;
          }
          .subtitles{
            font-family: uniqueBold;
            letter-spacing: 0.17rem;
            font-size: 9vw;
            color: white;
            text-shadow:
             -1px -1px 0 #fc47f3,
             1px -1px 0 #fc47f3,
             -1px 1px 0 #fc47f3,
             1px 1px 0 #fc47f3; 
          }
          .artistTitlePortrait{
            position: relative;
            height: 36vw;
            display: inline;
            padding-top: 25vw;
          }
          .artistTitle{
            display: none;
          }
          .artistImg{
            width: 100%;
            height: auto;
            margin-bottom: 0%;
          }
          .programmeTitle{
            position: relative;
            width: 100%;
            margin-top: 25%;
            margin-bottom: -25%;
          }
          .dot{
            width: 60%;
            left: 20%;
          }

  .time{
    display: inline-block;
    position: relative;
    text-align: center;
    width: 22%;
    top: 0%;
    font-family: uniqueBold;
    letter-spacing: 0.1rem;
    font-size: 9vw;
    padding-top: 5px;
    text-shadow: none;
    margin: 2%;
    background-color: #ffffff;
    box-shadow: 
    -1px -1px 0 #fc47f3,
    1px -1px 0 #fc47f3,
    -1px 1px 0 #fc47f3,
    1px 1px 0 #fc47f3;
    border-radius: 25px;
    color: #fc47f3;
  }
  .map{
    width: 100%;
    height: auto;
  }

  
    }