
#mobile-menu .button,
#main-header .button,
.button,
.button-white,
.button.size-smaller,
.button.size-1,
.button.size-2,
.button.size-3,
.button-white,
#main-header .button,
.button,
.button-outline,
.button-outline-blue,
.button-outline-blue.size-2,
.button-outline.size-2,
.button-outline,
.button-outline-blue,
.button-orange,
.button-orange,
.button-orange.size-2,
.button-blue,
.button-blue,
.button-blue.size-2,
.button-aws,
.button-aws,
.button-aws .button-aws-svg__border,
.appear #hero-content .button,
#ready-to-start .button-wrapper .button.orange,
.btn {
    /* width: 175px; */
    font-family: 'GT Walsheim Medium';
    font-size: 17px;
    font-weight: 500;
    text-align: left;
    line-height: 22px;
    height: 46px;
    display: inline-flex;
    padding: 12px 24px 12px 24px;
    gap: 8px;
    border-radius: 100px;
    transition: all 0.3s ease-in-out;
    text-decoration: none;
}

.appear #hero-content .button.button-purple {
    background: #873cfe;
    min-width: 192px;
    font-family: "Roboto", sans-serif;
    text-decoration: none !important;
}

.appear #hero-content .button.button-dark-purple {
    min-width: 192px;
}

.appear #hero-content .button.button-blue {
    background: linear-gradient(270deg, #6ED2E9 0%, #61A2FF 100%);
    color: #1B1D28;
    min-width: 192px;
}

.appear #hero-content .button.button-w {
    background: #fff;
    color: #1B1D28;
    min-width: 192px;
    border: 1px solid #1B1D28;
}

#mobile-menu .button:hover,
#main-header .button:hover,
.button:hover,
.button-white:hover,
.button.size-smaller:hover,
.button.size-1:hover,
.button.size-2:hover,
.button.size-3:hover,
.button-white:hover,
#main-header .button:hover,
.button:hover,
.button-outline:hover,
.button-outline-blue:hover,
.button-outline-blue.size-2:hover,
.button-outline.size-2:hover,
.button-outline:hover,
.button-outline-blue:hover,
.button-orange:hover,
.button-orange:hover,
.button-orange.size-2:hover,
.button-blue:hover,
.button-blue:hover,
.button-blue.size-2:hover,
.button-aws:hover,
.button-aws:hover,
.button-aws .button-aws-svg__border:hover,
.appear #hero-content .button:hover,
#ready-to-start .button-wrapper .button.orange:hover,
.btn:hover {
    text-decoration: underline;
    transition: all 0.3s ease-in-out;
}
#ready-to-start .button-wrapper .button.orange,
.btn-blue {
    background: linear-gradient(270deg, #6ED2E9 0%, #61A2FF 100%);
    color: #1B1D28;
    transition: all 0.3s ease-in-out;
}

#mobile-menu .button,
#main-header .button,
.button,
.button-white,
.button.size-smaller,
.button.size-1,
.button.size-2,
.button.size-3,
.button-white,
#main-header .button,
.button,
.button-outline,
.button-outline-blue,
.button-outline-blue.size-2,
.button-outline.size-2,
.button-outline,
.button-outline-blue,
.button-orange,
.button-orange,
.button-orange.size-2,
.button-blue,
.button-blue,
.button-blue.size-2,
.button-aws,
.button-aws,
.button-aws .button-aws-svg__border,
.appear #hero-content .button,
.btn-purple {
    background: linear-gradient(270deg, #873CFE 0%, #4424EE 100%);
    color: #fff;
    /* box-shadow: 0px 4px 15px 0px #2671FF29; */
    transition: all 0.3s ease-in-out;
}
.btn-white {
    background-color: #fff;
    color: #1B1D28;
    /* box-shadow: 4px 4px 20px 0px #FF8F2529, -4px -4px 20px 0px #1F2C9C29; */
    transition: all 0.3s ease-in-out;
}
.btn-outline-white {
    background-color: transparent;
    border: 1px solid #fff;
    color: #fff;
}
.btn-outline-black {
    background-color: transparent;
    border: 1px solid #1B1D28;
    color: #1B1D28;
}
.btn-outline-purple {
    /* position: relative;
    z-index: 2; */
    /* background-color: transparent; */
    /* border: 1px solid #1B1D28; */
    color: #1B1D28;
    padding: 1px;
    background: linear-gradient(270deg, #873CFE 0%, #4424EE 100%);
}
.btn-outline-purple span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 6px 18px;
    background-color: #fff;
    color: #1B1D28;
    border-radius: 100px;
    line-height: 28px;
}
.btn-outline-blue {
    /* position: relative;
    z-index: 2; */
    background-color: transparent;
    /* border: 1px solid #1B1D28; */
    color: #fff;
    padding: 1px;
    border: 1px solid #6ED2E9;
    /* background: linear-gradient(270deg, #6ED2E9 0%, #61A2FF 100%); */


}
.btn-outline-blue span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 6px 18px;
    background-color: transparent;
    color: #fff;
    border-radius: 100px;
    line-height: 28px;
}
/* .btn-outline-purple:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 100px;
    
    z-index: -2;
    transition: all 0.3s ease-in-out;    
    background: linear-gradient(270deg, #873CFE 0%, #4424EE 100%);;
    

}
.btn-outline-purple:before {
    content: "";
    position: absolute;
    top: 1px;
    left: 1px;
    width: calc(100% -2px);
    height: calc(100% -2px);
    border-radius: 100px;
    background: #fff;
    z-index: -1;
    transition: all 0.3s ease-in-out;
    border: 1px solid transparent;
} */
.only-icon {
    width: 46px;
    height: 46px;
    padding: 0;
    align-items: center;
    justify-content: center;
}
.only-icon span {
    display: block;
    width: 13px;
    height: 13px;
    line-height: 13px;
}
.btn.brands-carousel-btn {
    display: flex;
    align-items: center;
    flex-direction: row;
}
.btn.brands-carousel-btn {
    padding: 12px 16px 12px 16px;
    gap: 0;
}
.btn.brands-carousel-btn:hover {
    gap: 8px;
}
.btn.brands-carousel-btn p {
    width: 0;
    opacity: 0;
    overflow: hidden;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
}
.btn.brands-carousel-btn span {
    display: block;
    width: 13px;
    height: 13px;
}
.btn.brands-carousel-btn span svg {
    display: block;
    width: 100%;
    height: auto;
}
.btn.brands-carousel-btn:hover {
    padding: 12px 24px 12px 24px;
}
.btn.brands-carousel-btn:hover p {
    width: auto;
    opacity: 1;
    overflow: hidden;
    visibility: visible;
    transition: all 0.3s ease-in-out;
}

.link {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    text-align: left;
    color: #1D2224;
}
.link.play {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
}
@media (max-width: 1080px) {
    .btn.brands-carousel-btn {
        gap: 8px;
        padding: 12px 24px 12px 24px;
    }
    .btn.brands-carousel-btn p {
        width: auto;
        opacity: 1;
        overflow: hidden;
        visibility: visible;
        transition: all 0.3s ease-in-out;
    }
}


