.colleaguesSectionFullsize {
    max-width: 1960px;
    width:100%;
    height: 572px;
    justify-self: center;
    margin: 144px auto 0px auto;
}

.headline{
    display: flex;
    align-items: center;
    margin: 0 auto 48px auto;
    padding: 0px 5px;
    justify-content: center;
    max-width:600px;
    font-size: 32px;
    font-family: 'FiraCode', sans-serif;
    color: rgba(61, 207, 182, 1);
    font-weight: 700;
    text-align: center;
}

.colleagues{
    position:relative;
}

.quoteImg{
    position:absolute;
    display:block;
    top:-18px;
    left:0%;
    opacity:0;
    transform:translateX(-50%);
    width: 64px;
    height: 64px;
    z-index: 4;
}

.colleaguesCards {
    display:flex;
    max-width: 1440px;
    gap:30px;
    height: 413px;
    position:relative;
    overflow-x: hidden;
    justify-self: center;
    width:100%;
    align-items: center;
}

.singleColleaguesCardLeft {
    display: flex;
    position:relative;
    /* top:0px;
    left:-291px; */
    /* transform:translateX(-50%); */
    transition:  1.5s ease;
    flex-direction: column;
    justify-content: space-evenly;
    margin-top:20px;
    /* transform:rotateY(36deg); */
    min-width: 632px;
    max-width: 632px;
    height: 244px;
    border-radius: 32px;
    padding: 48px 40px;
    font-size: 20px;
    border: 1px solid rgba(61, 207, 182, 1);
    /* background-color: rgba(61, 207, 182, 0.3); */
}

.singleColleaguesCardMiddle {
    display: flex;
    position:relative;
    /* transform:translateX(-50%); */
    transition: 1.5s ease;
    flex-direction: column;
    justify-content: space-evenly;
    min-width: 632px;
    max-width: 632px;
    height: 274px;
    border-radius: 32px;
    padding: 48px 40px;
    font-size: 20px;
    border: 1px solid rgba(61, 207, 182, 1);
    /* background-color: rgba(61, 207, 182, 0.3); */
}

.singleColleaguesCardRight {
    display: flex;
    position:relative;
    /* top:0px; */
    right:420px;
    transition: 1.5s ease;
    flex-direction: column;
    justify-content: space-evenly;
    margin-top:20px;
    min-width: 632px;
    max-width: 632px;
    height: 244px;
    border-radius: 32px;
    padding: 48px 40px;
    font-size: 20px;
    border: 1px solid rgba(61, 207, 182, 1);
    /* background-color: rgba(61, 207, 182, 0.3); */
}


.card{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
}

.card.active{
    height:372px;
    background-color: rgba(61, 207, 182, 0.3);
    transition: 1.5s ease;
    margin-top:0px;
    box-sizing: border-box;
}
.card.active .quoteImg{
    opacity:1;
    transition: 4.5s ease;
}

.card.prev{
    height:342px;
    transform: translateX(-155%);
    transform:  1.5s ease;
    margin-top:20px;
    box-sizing: border-box;
    background-color: rgba(61, 207, 182, 0.1);
}

.card.next{
    height:342px;
    transform: translateX(56%);
    transform:  1.5s ease;
    margin-top:20px;
    box-sizing: border-box;
    background-color: rgba(61, 207, 182, 0.1);
}

.card.slideOut{
    height:342px;
    transform: translateX(-280%);
    transform:  1.5s ease;
    margin-top:20px;
    box-sizing: border-box;
}


.card.slideInStart{
    height:342px;
    transform: translateX(155%);
    transform:  1.5s ease;
    margin-top:20px;
    box-sizing: border-box;
}

/* .card.slideInFromLeft{
    height:342px;
    transform: translateX(-210%);
    transform:  1.5s ease;
    margin-top:20px;
    box-sizing: border-box;
    } */
    
    .skipAria {
    display: flex;
    justify-self: center;
    align-items: center;
    justify-content: space-between;
    margin-top: 48px;
    width: 184px;
    height: 40px;
    cursor: pointer;
    margin:0 auto;
    
}
.skipBoxL{
    width:40px;
    height:35px;
    /* transition: 1s ease-in-out; */
    cursor: pointer;
}
.skipBoxR{
    width:40px;
    height:35px;
    /* transition: 1s ease-in-out; */
    cursor: pointer;
}


.skipArrowL{
    width:40px;
    height:35px;
    transition: 0.2s ease-in-out;
    cursor: pointer;
}
.skipArrowR{
    width:40px;
    height:35px;
    transition: 0.2s ease-in-out;
    cursor: pointer;
}

@media(hover:hover) and (pointer:fine){
.skipArrowL:hover{
    content:url(../img/arrow_leftTürkisCentered.svg);
    transition: 0.2s ease-in-out;
    margin-left:-5px;
    width:40px;
    height:35px;
}
.skipArrowR:hover{
    content:url(../img/arrow_rightTürkisCentered.svg);
    transition: 0.2s ease-in-out;
    margin-left:5px;
    width:40px;
    height:35px;
}}

.dot_white {
    width: 8px;
    height: 8px;
}

.mainText {
    margin-top: 30px;
    font-family: 'Karla', sans-serif;
    font-size: 20px;
    color:white;
}

.name {
    color:white;
    display: flex;
    align-items: center;
    gap:15px;
}

.name p{
    min-width:190px;
    font-family: 'Karla', sans-serif;
    font-size: 18px;
}
.name hr {
    width: 65%;
    height: 1px;
    border-color:white;
}