#coaching-section {
    height: 99vh;
    background-image: url('../img/Bitcoin_rolling.gif');
    background-size: cover;
    background-position: center bottom;
    padding-top: 17%;
    
}

.coaching-landing h1 {
    text-align: center;
    padding-top: 5%;
    color: #fff;
    font-size: 50px;
}

.coaching-landing h1 > span {
    color: yellow;
}

.coaching-landing p {
    text-align: center;
    color: #fff;
    margin-left: 30%;
    margin-right: 30%;
    padding-top: 0.7%;
    font-size: 17px;
}

.coaching-landing-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -3%;
}

.coaching-info {
    background-color: #1c1a1a;
}


/*Crypto-Coaching-Infos*/
#crypto-coaching-infos {
    background-color: #1c1a1a;
  }

  #crypto-coaching-infos h1 {
    text-align: center;
    font-size: 50px;
    font-family: "Lato", sans-serif;
    color: #fff;
    padding-top: 10%;
    padding-bottom: 2%;
  }

  #crypto-coaching-infos h1 > span {
    color: yellow;
  }

  .crypto-coaching-info-container {
    display: flex;
    padding-left: 8%;
    gap: 5%;
    padding-top: 3%;
    line-height: 1.7;
  }

  
  .cryto-coaching-content1, .cryto-coaching-content2 {
    color: #fff;
    font-family: "Lato", sans-serif;
    width: 50vw;
  }

  .cryto-coaching-content1 h2 > span, .cryto-coaching-content2 h2 > span {
    color: yellow;
  }

  .cryto-coaching-content1 h2, .cryto-coaching-content2 h2 {
    font-size: 27px;
    padding-bottom: 8%;
  }

  .crypto-info-btns {
    display: flex;
    justify-content: space-around;
    padding-top: 5%;
  }




/* Mountains */
.process-h1 {
    text-align: center;
    color: #fff;
    font-size: 43px;
    padding-top: 6%;
}

.section span {
    color: yellow;
}

.numbered {
    font-size: 6rem;
    font-weight: 700;
    color: #fff;
}

.numbered {
    font-size: 2.4rem;
}

.numbered::before {
    font-size: 6rem;
    line-height: 1em;
    margin-top: -0.3em;
    display: block;
    opacity: 0.25;
}

@media (min-width: 960px) {
    .numbered {
        font-size: 9rem;
    }
    .numbered {
        font-size: 3.6rem;
    }
    .numbered::before {
        font-size: 9rem;
    }
}

.process-details .discover,
.process-details .design,
.process-details .implement,
.process-details .develop,
.process-details .deliver {
    color: #fff;
}

#processSVG {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}

.project-btn {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Frame */

/* Sections */

@media all and (min-width: 640px) {
    .section {
        padding: 4em;
    }
}

@media all and (min-width: 960px) {
    .section {
        padding: 6em;
    }
}

/* Split Vision */
.split-vision {
    overflow: hidden;
}

.split-vision .column .content {
    max-width: 540px;
    padding-top: 1em;
    padding-bottom: 1em;
    margin-right: auto;
    margin-left: auto;
    position: relative;
    z-index: 2;
}

@media all and (min-width: 800px) {
    .split-vision {
        display: flex;
        align-items: center;
    }
    .split-vision .column {
        width: 50%;
    }
    .split-vision .column .content {
        padding-right: 1em;
        padding-left: 20%;
        margin-right: -10%;
    }
}

@media all and (min-width: 960px) {
    .split-vision .column .content {
        margin-right: 0;
    }
    .split-vision.reverse .column .content {
        margin-left: 0;
    }
}

/* Process */
.process {
    width: 100%;
    max-width: none;
}

.process .discover,
.process .design,
.process .implement,
.process .develop,
.process .deliver {
    opacity: 0.8;
    transform: scaleY(0);
    transform-origin: 50% 100%;
    transition: opacity 0.25s;
}

.process.js-animate .discover,
.process.js-animate .design,
.process.js-animate .implement,
.process.js-animate .develop,
.process.js-animate .deliver {
    animation: grow-up 1s forwards;
}

.process.js-animate .discover {
    animation-delay: 0.25s;
}

.process.js-animate .design {
    animation-delay: 0.5s;
}

.process.js-animate .implement {
    animation-delay: 0.75s;
}

.process.js-animate .develop {
    animation-delay: 1s;
}

.process.js-animate .deliver {
    animation-delay: 1.25s;
}

@keyframes grow-up {
    0% {
        transform: scaleY(0);
    }
    50% {
        transform: scaleY(1.1);
    }
    80%,
    100% {
        transform: scaleY(1);
    }
}

.process-details {
    max-width: 1440px;
    padding: 2em;
    margin-right: auto;
    margin-left: auto;
}

.process-details .discover,
.process-details .design,
.process-details .implement,
.process-details .develop,
.process-details .deliver {
    max-width: 480px;
    padding: 1em 0;
    margin-right: auto;
    margin-left: auto;
    transition: opacity 0.25s;
}

.process-details .discover .heading,
.process-details .design .heading,
.process-details .implement .heading,
.process-details .develop .heading,
.process-details .deliver .heading {
    font-weight: 700;
}

.process-details .discover .heading::after,
.process-details .design .heading::after,
.process-details .implement .heading::after,
.process-details .develop .heading::after,
.process-details .deliver .heading::after {
    width: 40px;
    height: 4px;
    margin-top: 0.25em;
    display: block;
    content: '';
}

.process-details p {
    font-size: 17px;
    line-height: 1.5;
}

.heading {
    font-size: 20px;
}

.process-details .discover .heading::after {
    background: #50b1aa;
}

.process-details .design .heading::after {
    background: #f57a73;
}

.process-details .implement .heading::after {
    background: #ffb566;
}

.process-details .develop .heading::after {
    background: #43c0e6;
}

.process-details .deliver .heading::after {
    background: #60666a;
}

@media all and (min-width: 800px) {
    .process-details {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    .process-details .discover,
    .process-details .design,
    .process-details .implement,
    .process-details .develop,
    .process-details .deliver {
        width: 50%;
        padding-right: 1em;
        padding-left: 1em;
    }
    .process-details .discover {
        order: 1;
    }
    .process-details .design {
        margin-right: 0;
        order: 4;
    }
    .process-details .implement {
        order: 2;
    }
    .process-details .develop {
        margin-left: 0;
        order: 5;
    }
    .process-details .deliver {
        order: 3;
    }
}

@media all and (min-width: 800px) {
    .process-details .discover,
    .process-details .design,
    .process-details .implement,
    .process-details .develop,
    .process-details .deliver {
        width: 33.3334%;
    }
}

@media all and (min-width: 1280px) {
    .process-details .discover,
    .process-details .design,
    .process-details .implement,
    .process-details .develop,
    .process-details .deliver {
        padding-right: 2em;
        padding-left: 2em;
    }
}

@media only screen and (max-width: 768px) {
    .process-details {
        display: grid;
    }
    
    .process-details .discover {
        order: 1;
    }
    .process-details .design {
        margin-right: 0;
        order: 4;
    }
    .process-details .implement {
        order: 2;
    }
    .process-details .develop {
        margin-left: 0;
        order: 5;
    }
    .process-details .deliver {
        order: 3;
    }
}

/* Neue Klasse für die Animation */
.js-animate .process polygon {
    opacity: 1 !important;
}

#pricing2 {
    background-color: #1c1a1a;
    padding-top: 3%;
}

#pricing2 h1 {
    text-align: center;
    color: #fff;
    font-size: 43px;
    padding-bottom: 0.5%;
}

#pricing2 h1 > span {
    color: yellow;
}

/*Responsive CSS*/
/*Responsive Coaching Landing Mobile*/
@media (max-width: 767px) {
    .coaching-landing h1 {
        font-size: 40px;
        margin-right: 5%;
        margin-left: 5%;
        padding-top: 50%;
    }

    .coaching-landing p {
        margin-right: 5%;
        margin-left: 5%;
        padding-top: 5%;
        padding-bottom: 5%;
    }
}

/*Responsive Coaching Lesitungen Mobile*/
@media (max-width: 767px) {
    #crypto-coaching-infos h1 {
        font-size: 40px;
        padding-top: 15%;
        margin-left: 2%;
        margin-right: 2%;
    }

    .crypto-coaching-info-container {
        display: block;
    }

    .cryto-coaching-content1 h2, .cryto-coaching-content2 h2 {
        font-size: 26px;
        
    }

    .cryto-coaching-content1, .cryto-coaching-content2 {
        width: 100%;
        
    }

    .cryto-coaching-content1 p, .cryto-coaching-content2 p {
       margin-right: 6%;
    }

    .cryto-coaching-content2 {
        padding-top: 15%;
    }


    .cryto-coaching-content2 h2 {
        margin-right: 5%;
    } 

    .crypto-info-btns {
        padding-top: 15%;
        padding-bottom: 15%;
    }

    
}

/*Responsive Crypto Leistungen Tablet*/
@media only screen and (min-width: 600px) and (max-width: 1024px) {
    .cryto-coaching-content2  {
        margin-right: 5%;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    .cryto-coaching-content2  {
        margin-right: 5%;
    }
}