/** Shopify CDN: Minification failed

Line 265:20 Expected identifier but found whitespace
Line 265:22 Unexpected "{"
Line 265:30 Expected ":"
Line 266:24 Expected identifier but found whitespace
Line 266:26 Unexpected "{"
Line 266:34 Expected ":"

**/


/* CSS from section stylesheet tags */
.fl-container {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: top;
    }
    
    .fl-item {
      /*background-color: lightgrey;*/
      width: 19%;
    }
    
    .fl-item p, .fl-item img {
      text-align: center;
      margin: auto;
      display: block;
    }
    
    .fl-item p {
      padding: 8px;
      margin-top: 16px;
      margin-bottom: 16px;
    }
    
    .fl-item img {
      margin-top: 32px;
      width: 44px;
    }
    
    @media only screen and (max-width: 600px) {
      .fl-item {
        background-color: white;
        width: 49%;
      }
      .fl-item:first-child {
        display: none;
      }
    }
    
    .none {
      display: none;
    }
.hori-container {
    overscroll-behavior: none;
    width: 500%;
    height: 100%;
    display: flex;
    flex-wrap: nowrap;
}

.hori-img {
    width: 75vw;
    height: 100%;
}

.hori-img img {
    width: auto;
    height: 100%
}

.hori-text {
    width: 25%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    align-items: center;
}

.hori-text div {
    color: #424242;
    font-size: 1.2rem;
    padding: 40px;
    font-weight: 300;
    text-align: left;
}

.hori-text h1 {
    font-size: 2.2rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.hori-text p {
    font-size: 1.4rem;
    font-weight: 300;
}

.hori-panel {
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    font-size: 1.5em;
    text-align: center;
    position: relative;
    background-color: #fff;
}
/*
.panel-screens {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}*/
#cont {
    width: 100vw;
    height: 100vh;
  position: relative;
    overflow: hidden;
}

.display-h1 {
    z-index: 100;
    position: absolute;
    background-color: var(--silber-ram);
    background: linear-gradient(45deg, transparent 30px, var(--silber-ram) 0) bottom left;
    /* background: linear-gradient(90deg, rgba(244, 244, 244, 0.9) 0%, rgba(244, 244, 244, 0.9) 80%, rgba(244, 244, 244, 0.2) 100%); */
    padding: 0px 3vw;
    top: 70px;
    right: 0;
    font-size: clamp(2.2rem, 2vw, 2.6rem);
    font-weight: 700;
    color: var(--rot-20-ram);
    text-shadow: 1px 1px 1px #6262623d;

}

.panel-bild-r-l {
    width: 100%;
    height: 100%;
    display: flex;
    position: absolute;
}
.header-top {
    color: var(--rot-20-ram);
    font-weight: 700 !important;
    text-align: left;
    letter-spacing: 0.03em;
    line-height: 1;
    text-shadow: 1px 1px 1px #6262623d;
}
  h6{
    display:inline !important;
    color: var(--rot-20-ram);
    font-weight: 700 !important;
    text-align: left;
    letter-spacing: 0.03em;
    line-height: 1;
    text-shadow: 1px 1px 1px #6262623d;
    
  }

.txtONE {
    position: absolute;
    bottom: 0px;
    left: 10vw;
    background-color: var(--silber-ram);
    background: linear-gradient(225deg, transparent 30px, var(--silber-ram) 0) top right;
    width: 30vmax;
    min-height: 26vmin;
    padding: 22px 22px 42px 22px;
}

.txtKLEIN {
    color: #000000d6;
    margin-top: 12px;

    font-weight: normal;
    font-size: 1.6vmax;
    text-align: left;
    text-shadow: 1px 1px 8px rgba(90, 90, 90, 0.4);
}
/* Split */
.split-gallery h1 {
    font-size: clamp(2em, 3vw, 4em);
    margin-bottom: 1.2rem;
}

/* more buttons start */
#check01,
#check02,
#check03,
#check04,
#check05,
#check06,
#check07,
#check08 {
    display: none;
}

.ctn {
    display: none;
    transition: 0.5s linear;
}

label.more {
    display: inline-block;
    margin-top: 15px;
    color: cornflowerblue;
    text-decoration: underline;
    cursor: pointer;
    font-weight: bold;
}

#check01:checked~.ctn,
#check02:checked~.ctn,
#check03:checked~.ctn,
#check04:checked~.ctn,
#check05:checked~.ctn,
#check06:checked~.ctn,
#check07:checked~.ctn,
#check08:checked~.ctn {
    display: block;
}

#check01:checked~label.more,
#check02:checked~label.more,
#check03:checked~label.more,
#check04:checked~label.more,
#check05:checked~label.more,
#check06:checked~label.more,
#check07:checked~label.more,
#check08:checked~label.more {
    visibility: hidden;
}

#check01:checked~label.more::after,
#check02:checked~label.more::after,
#check03:checked~label.more::after,
#check04:checked~label.more::after,
#check05:checked~label.more::after,
#check06:checked~label.more::after,
#check07:checked~label.more::after,
#check08:checked~label.more::after {
    content: 'Show less';
    display: block;
    visibility: visible;
}

/* More BTN ENDE  */
.split-gallery {
    display: flex;
    /*     background-color: rgb(51, 51, 51); */
    overflow-x: hidden;

    background-image: url("/cdn/shop/{{section.settings.bgmac-image | image_url: '2048x'}}");
    background-size: {{section.settings.bg-size}}; 
    background-position: {{section.settings.bg-position}};
    background-repeat: no-repeat;
    /*  background-image: radial-gradient(circle at 47% 14%, rgba(205, 205, 205, 0.04) 0%, rgba(205, 205, 205, 0.04) 43%, transparent 43%, transparent 100%), radial-gradient(circle at 35% 12%, rgba(215, 215, 215, 0.04) 0%, rgba(215, 215, 215, 0.04) 4%, transparent 4%, transparent 100%), radial-gradient(circle at 1% 35%, rgba(24, 24, 24, 0.04) 0%, rgba(24, 24, 24, 0.04) 37%, transparent 37%, transparent 100%), radial-gradient(circle at 21% 1%, rgba(0, 0, 0, 0.04) 0%, rgba(0, 0, 0, 0.04) 26%, transparent 26%, transparent 100%), radial-gradient(circle at 23% 82%, rgba(249, 249, 249, 0.04) 0%, rgba(249, 249, 249, 0.04) 60%, transparent 60%, transparent 100%), radial-gradient(circle at 11% 54%, rgba(251, 251, 251, 0.04) 0%, rgba(251, 251, 251, 0.04) 23%, transparent 23%, transparent 100%), radial-gradient(circle at 69% 68%, rgba(234, 234, 234, 0.04) 0%, rgba(234, 234, 234, 0.04) 10%, transparent 10%, transparent 100%), linear-gradient(90deg, var(--silber-ram), var(--silber-ram)); */
}

.left {
    /* outline:2px solid red; */
    width: 40%;
    margin-bottom: 100px;
}

.right {
    /* outline:2px solid blue; */
    height: 100vh;
    width: 60%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.desktopContent {
    margin: auto;
    width: 80%;
}

.desktopContentSection {
    /* outline:2px solid green; */
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #333;
}

.desktopContentSection:nth-child(even) {

    /* background:#ccc; */
}

.desktopContentSection h1 {
    font-size: clamp(2em, 3vw, 3em);
}

.desktopContentSection p {
    font-size: 1.4vmax;
    margin-bottom: 1.2em;
}

.desktopPhotos {
    width: 55vw;
    height: 40vw;
    border-radius: 30px;
    position: relative;
    overflow: hidden;
    box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.4);
}


.mac {
    width: 55vw;
    height: auto;
    position: absolute;
}

.drei-d {
    transform:
        perspective(1000px) rotateX(2deg) rotateY(-8deg) rotateZ(2deg);
    box-shadow: 24px 16px 64px 0 rgba(0, 0, 0, 0.08);
    border-radius: 32px;
    /*     transform:
        perspective(800px) rotateY(-8deg);
    transition: transform 1s ease 0s;
    border-radius: 4px;
    box-shadow:
        rgba(0, 0, 0, 0.024) 0px 0px 0px 1px,
        rgba(0, 0, 0, 0.05) 0px 1px 0px 0px,
        rgba(0, 0, 0, 0.03) 0px 0px 8px 0px,
        rgba(0, 0, 0, 0.1) 0px 20px 30px 0px;

    &:hover {
        transform: perspective(800px) rotateY(-4deg);
    } */
}

.mac img {
    width: 100%;
}

.desktopPhoto {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: whitesmoke;
}

.desktopPhoto img {
    position: absolute;
    width: 95%;

}

.animation img {
    height: 30%;
    width: auto;
    bottom: 90px;
}

/* End Split*/
.video-wrapper iframe,
.video-wrapper object,
.video-wrapper embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.video-wrapper {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 0px;
  height: 0;
  overflow: hidden;
}
.my_header {
    height: 100%;
    width: 100%;
    overflow: hidden;
    background-image: linear-gradient(black, black), url("images/beijing-financial-district.jpg");
    background-size: cover;
    background-blend-mode: saturation;
    background-repeat: no-repeat;
    position: relative;
    /*     background-color: #cdb995; */
}

.header-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
}

.video-buttons {
    position: absolute;
    bottom: 30px;
    left: 80px;
    transform: translateX(-50%);
    z-index: 100;
}

.video-buttons>i {
    margin: 0 10px;
    cursor: pointer;
    float: left;
    font-size: 40px;
    color: #ffffff;
    /*Schatten werfen */
    text-shadow: 2px 2px 4px #75757577;
}

.video-buttons>i:hover {
    color: #d3af37;
}