/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/


.cta-component {
font-family: "Moderat-Medium";
display: -webkit-inline-box;
display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 28px !important;
        background: var(--primary-color, #1C45F5) !important;
        padding: 12px 6px 12px 24px;
    color: white;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    cursor: pointer;
    height: 46px;
    position: relative;
    z-index: 990;
}

.cta-component svg {
    margin-left: 8px;
}

.orange-cta {
    background-color: #EA4336;
    color: white;
}

.blue-cta {
    background-color: #1C45F5;
    color: white;
}

.transparent-orange-cta {
    background-color: transparent;
    border: 3px solid #EA4336;
    color: white;
}

.transparent-orange-cta svg path {
    stroke: white !important;
}

.transparent-blue-cta {
    background-color: transparent;
    border: 3px solid #1C45F5;
    color: #1C45F5;
}

.transparent-blue-cta svg path {
    stroke: #1C45F5 !important;
}
.white-cta {
background-color: transparent;
    color: #1C45F5;
}

.white-cta:hover {
    transform: scale(1) !important;
    background-color: #F6F7FF;
}

.white-cta svg path {
    stroke: #1C45F5 !important;
}


@media all and (max-width: 600px) {
    .cta-component {
        width: 100%;
        justify-content: center;
    }
.cta-component:hover {
-webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}