body{
    background-color: #070C17;
    box-sizing: border-box;
    margin: 0;
    /* display: flex; */
    overflow-x: hidden;
}

#toolkit{
    margin-top: 6.32rem;
    margin-bottom: 3.5rem;
}
#toolkit-headline-holder{
    margin-left: 6.38rem;
}

#toolkit-headline{
    color: #FEFBF1;
    font-family: Montserrat;
    font-size: 2.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

#toolkit-toolkit{
    color: #D9FE78;
}

#toolkit-card-body{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

#toolkit-card-container{
    width: 80vw;
    height: 75vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
.toolkit-cards{
    width: 22vw;
    height: 60vh;
    border-radius: 3.12719rem;
    border: 0.7px solid #FEFBF1;
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    pointer-events: none;
    opacity: 0;
    overflow: hidden;
    background: #070C17;
}
.toolkit-card-background{
    position: absolute;
    width: 27.81038rem;
    height: 30.56744rem; 
    border-radius: 3.206rem;
    background: #0D1527; 
    z-index: -5; 
    bottom: 50%;
}
#toolkit-network{
    width:100%;
}
#toolkit-card1 .toolkit-card-background{
    transform: rotate(69.414deg);
}
#toolkit-card2 .toolkit-card-background{
    transform: rotate(123.5deg);
}
#toolkit-card3 .toolkit-card-background{
    transform: rotate(84.75deg);
}
#toolkit-card4 .toolkit-card-background{
    transform: rotate(52.484deg);
}
#toolkit-card5 .toolkit-card-background{
    transform: rotate(115.717deg);
}
#toolkit-card6 .toolkit-card-background{
    transform: rotate(93.393deg);
}
.toolkit-bg-img{
    position: absolute;
    z-index: -5;

}
.toolkit-cards-header{
    color: #FEFBF1;
    text-align: center;
    font-family: Montserrat;
    font-size: 1.95488rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-top: 5%;
    margin-bottom: 0;
}

.toolkit-cards-info{
    margin-left: 6%;
    margin-right: 6%;
    color: #FEFBF1;
    text-align: center;
    font-family: Montserrat;
    font-size: 1.12575rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.toolkit-svg{
    margin-top: 30%;
    /* margin-bottom: 30%; */
}
.left{
    transition-delay: 0.1s;
    transition-duration: 0.6s;
    transform: translateX(-27vw) scale(0.8);
    transition-timing-function: ease-in-out;
    opacity: 0.85;
    z-index: -10;
    pointer-events: auto;
}

.middle{
    transition-duration: 0.6s;
    transform: translateX(0px) scale(1);
    transition-timing-function: ease-in-out;
    opacity: 1;
    z-index: 50;
    pointer-events: auto;
}

.right{
    transition-delay: 0.1s;
    transition-duration: 0.6s;
    transform: translateX(27vw) scale(0.8);
    transition-timing-function: ease-in-out;
    opacity: 0.85;
    z-index: -10;
    pointer-events: auto;
}

#toolkit-nav{
    display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
    gap: 10px;
}

.toolkit-arrows{
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: 2px solid #FEFBF1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.toolkit-arrows:hover path {
  stroke: #D9FE78; /* example background color */
}

.toolkit-arrows:hover{
    border: 2px solid #D9FE78;
}

@media (max-width:1330px)
{
    .toolkit-cards{
        width: 300px;
        height: 500px;
    }
}
@media (max-height:700px)
{
    .toolkit-cards{
        width:250px;
        height:400px;
    }
}