@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;1,200&display=swap');

html {
  font-size: 100%;
  /* 1 */
  overflow-y: scroll;
  /* 2 */
  font-family: sans-serif;
  /* 3 */
  -ms-text-size-adjust: 100%;
  /* 4 */
  -webkit-text-size-adjust: 100%;
  /* 4 */ }
  *{
  margin: 0;
  padding: 0;
}




/*----------------------------------------------   
--Typography: Fluid body sizing hotness
* Adjust to suit your needs.
-----------------------------------------------  */
body {
  font-size: 120%; }
  @media (min-width: 36em) {
    body {
      font-size: 120%; } }
  @media (min-width: 58em) {
    body {
      font-size: 140%; } }
  @media (min-width: 86em) {
    body {
      font-size: 140%; } }
  @media (min-width: 115em) {
    body {
      font-size: 150%; } }
  @media (min-width: 125em) {
    body {
      font-size: 180%; } }
  @media (min-width: 145em) {
    body {
      font-size: 190%; } }


/*----------------------------------------------   
--Typography: paragraph
-----------------------------------------------  */
p {
  font-family: "Poppins", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
  letter-spacing: .12rem; }
 

.top {
  width: 100%;
  text-align: center;
  color: #73F0BE;
  position: fixed;
  text-transform: uppercase;
  z-index: 1;
  top: 1em; }

footer {
  width: 100%;
  text-align: center;
  color: rgba(255, 255, 255, 0.8);
  position: fixed;
  z-index: 8;
  bottom: 1em; }


a {
  display: inline-block;
  padding: 6px 10px;
  color: #73F0BE;
  border: 1px solid #73F0BE;
  border-radius: 3px;
  font-weight: 700;
  line-height: normal;
  text-decoration: none;
  text-align: center;
  -webkit-transition: color 0.7s ease;
  -moz-transition: color 0.7s ease;
  transition: color 0.7s ease; }
  a:hover {
    color: #56c2e3;
    -webkit-transition: color 0.7s ease;
    -moz-transition: color 0.7s ease;
    transition: color 0.7s ease; }

#all_slides{
    position: relative;
    height: 100vh;
    padding: 0px;
    margin: 0px;
    list-style-type: none;
}

.slide{
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 1;
    -webkit-transition: opacity 1s;
    -moz-transition: opacity 1s;
    -o-transition: opacity 1s;
    transition: opacity 1s;
}

.active{
    opacity: 1;
    z-index: 2;
}


.controls{
    display: none;
}

.slide{
    font-size: 40px;
    padding: 40px;
    box-sizing: border-box;
    background: #333;
    color: #fff;
    background-size: cover;
}

.slide:nth-of-type(1){
  background-image: url('../images/nikkei-grill_mock-bcard-mobile.jpg');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(1){
  	background-image: url('../images/nikkei-grill_mock-bcard.jpg'); } }
  	
.slide:nth-of-type(2){
  background-image: url('../images/iceberg_logo_mock_bcard-02-s.jpg');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(2){
  	background-image: url('../images/iceberg_logo_mock_bcard-02.jpg'); } }

.slide:nth-of-type(3){
  background-image: url('../images/sinnstifterinnen_logos_s.png');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(3){
  	background-image: url('../images/sinnstifterinnen_logos_m.png'); } }

.slide:nth-of-type(4){
  background-image: url('../images/sinnstifterinnen_logo-01.png');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(4){
  	background-image: url('../images/sinnstifterinnen_logo-01.png'); } }

.slide:nth-of-type(5){
  background-image: url('../images/cocoon_logo_mock_bcard-01-s.jpg');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(5){
  	background-image: url('../images/cocoon_logo_mock_bcard-01.jpg'); } }


.slide:nth-of-type(6){
  background-image: url('../images/257_logo-02-s.png');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(6){
  	background-image: url('../images/257_logo-02.png'); } }

.slide:nth-of-type(7){
  background-image: url('../images/hochhaus-haushoch-10.png');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(7){
  	background-image: url('../images/hochhaus-haushoch-10.png'); } }
  	
.slide:nth-of-type(8){
  background-image: url('../images/hochhaus-haushoch-11.png');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(8){
  	background-image: url('../images/hochhaus-haushoch-11.png'); } }

.slide:nth-of-type(9){
  background-image: url('../images/hochhaus-haushoch-12.png');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(9){
  	background-image: url('../images/hochhaus-haushoch-12.png'); } }

.slide:nth-of-type(10){
  background-image: url('../images/hochhaus-haushoch-14.png');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(10){
  	background-image: url('../images/hochhaus-haushoch-14.png'); } }

.slide:nth-of-type(11){
  background-image: url('../images/privee_logo-s.png');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(11){
  	background-image: url('../images/privee_logo.png'); } }
  	
.slide:nth-of-type(12){
  background-image: url('../images/privee_logo_mock_bcard-02-s.jpg');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(12){
  	background-image: url('../images/privee_logo_mock_bcard-02.jpg'); } }
  	
.slide:nth-of-type(13){
  background-image: url('../images/kortmann-beton_logo-01-s.png');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(13){
  	background-image: url('../images/kortmann-beton_logo-01.png'); } }
  	
.slide:nth-of-type(14){
  background-image: url('../images/kortmann-beton_logo_mock_bcard-01-s.jpg');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(14){
  	background-image: url('../images/kortmann-beton_logo_mock_bcard-01.jpg'); } }
  	
.slide:nth-of-type(15){
  background-image: url('../images/art/licht-und-schatten-1.jpg');
  background-size: 100% auto;
    background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(15){
  	background-image: url('../images/art/licht-und-schatten-1.jpg');
  	background-size: 50% auto; } }
  	  	
.slide:nth-of-type(16){
  background-image: url('../images/art/licht-und-schatten-2.jpg');
  background-size: 100% auto;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(16){
  	background-image: url('../images/art/licht-und-schatten-2.jpg');
  	background-size: cover; } }

.slide:nth-of-type(17){
  background-image: url('../images/art/bsquare-01.jpg');
  background-size: 100% auto;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(17){
  	background-image: url('../images/art/bsquare-01.jpg'); } }
  	
.slide:nth-of-type(18){
  background-image: url('../images/art/bsquare-02.jpg');
  background-size: 100% auto;
  background-position: 50% 50%;
  background-repeat: no-repeat;}
  @media (min-width: 58em){
  	.slide:nth-of-type(18){
  	background-image: url('../images/art/bsquare-02.jpg'); } }