.steps-enclose {
    width: 33%;
    display: inline-block;
    vertical-align: top;
    text-align: center
}

.step-area {
    display: flex;
    height: 155px;
    align-items: center;
    text-align: center;
    margin: auto;
    padding-bottom: 5px
}

.step-circle {
    font-size: 44px;
    background: linear-gradient(180deg, #1ba1c4 10%, #49b9ad 90%);
    width: 120px;
    height: 120px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    text-align: center;
    margin: auto;
    transition: width .15s, height .15s, font-size .15s
}

.step-bg {
    background: #fff;
    height: 60%;
    width: 60%;
    border-radius: 50%;
    margin: auto;
    display: flex;
    align-items: center;
    text-align: center
}

.step-number {
    color: #1ba1c4;
    margin: auto;
    font-weight: 700;
    font-family: "Times New Roman"
}

.steps-enclose:hover .step-circle {
    width: 150px;
    height: 150px;
    font-size: 56px
}

.steps-enclose:hover * {
    cursor: pointer
}

.steps-enclose:hover .step-text {
    color: #000
}

.step-text {
    font-size: 18px;
    color: #676767;
    transition: color .5s
}

.steps-spacer {
    width: 155px;
    display: block;
    margin: auto
}

@media (max-width:767px) {
    .steps-enclose {
        display: flex;
        flex-direction: row;
        width: auto;
        text-align: left;
        padding-bottom: 0
    }
    .step-area {
        width: 150px;
        display: flex;
        align-items: center;
        text-align: left;
        margin: 0
    }
    .step-text {
        display: flex;
        align-items: center;
        padding-left: 5px
    }
    .steps-spacer {
        margin: 0
    }
}

.sprite {
    background: url(../../images/Flags/cbfFlags.png) no-repeat top left;
    width: 20px;
    height: 13px;
    display: inline-block
}

.sprite.ar-SA {
    background-position: 0 0
}

.sprite.bg-BG {
    background-position: 0 -23px
}

.sprite.cs-CZ {
    background-position: 0 -46px
}

.sprite.de-DE {
    background-position: 0 -69px
}

.sprite.el-GR {
    background-position: 0 -92px
}

.sprite.en-GB {
    background-position: 0 -115px
}

.sprite.en-US {
    background-position: 0 -138px
}

.sprite.es-ES {
    background-position: 0 -161px
}

.header-links {
    line-height: 40px;
}

#loginAaction {
    margin-right: 20px;
}

.sprite.fa-IR {
    background-position: 0 -184px
}

.sprite.fr-FR {
    background-position: 0 -207px
}

.sprite.hr-HR {
    background-position: 0 -230px
}

.sprite.hu-HU {
    background-position: 0 -253px
}

.sprite.id-ID {
    background-position: 0 -276px
}

.sprite.it-IT {
    background-position: 0 -299px
}

.sprite.ja-JP {
    background-position: 0 -322px
}

.sprite.ko-KR {
    background-position: 0 -345px
}

.sprite.pl-PL {
    background-position: 0 -368px
}

.sprite.pt-BR {
    background-position: 0 -391px
}

.sprite.ro-RO {
    background-position: 0 -414px
}

.sprite.ru-RU {
    background-position: 0 -437px
}

.sprite.th-TH {
    background-position: 0 -460px
}

.sprite.tr-TR {
    background-position: 0 -483px
}

.sprite.vi-VN {
    background-position: 0 -506px
}

.sprite.zh-CN {
    background-position: 0 -529px
}

.sprite.fil {
    background-position: 0 -552px
}

.menu-border {
    height: 1px;
    background: #fff;
    opacity: .35;
    margin: auto !important
}

.color-block-rkfx .container-sub::before {
    background: linear-gradient(120deg, #5f64f8 25%, #646bf8 45%)
}

.full-pelt {
    width: 100%;
    height: 667px;
    background: url(../../images/ban1.png) no-repeat top center;
}

.full-pelt .container {
    margin: 0 auto;
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
}

@media (max-width:767px) {
    .full-pelt .container {
        padding-left: 10px
    }
}

.my-slide {
    display: flex;
    align-content: space-around;
    flex-grow: 1
}

.carousel {
    width: 100%
}

.carousel-inner {
    height: 100%;
    overflow: unset;
    clip-path: inset(0 -5vw 0 0)
}

.my-left {
    height: 70%;
    flex-direction: column;
    justify-content: center;
    display: flex;
}

@media (max-width:767px) {
    .my-left {
        align-items: center;
        width: 100%
    }
}

.my-right {
    display: none
}

@media (min-width:768px) {
    .my-right {
        height: 405px;
        align-items: flex-end;
        display: flex
    }
}

#image-two:after {
    display: none
}

.my-right img {
    position: relative;
    z-index: 2
}

#image-one img {
    height: 340px;
    margin-bottom: 30px
}

@media (min-width:1080px) {
    #image-one img,
    #image-one:after {
        margin-right: -60px
    }
    #image-one {
        min-width: 275px
    }
}

html[dir=rtl] .carousel-inner {
    clip-path: inset(0 0 0 -2vw)
}

html[dir=rtl] #image-one img,
html[dir=rtl] #image-one:after {
    margin-right: unset
}

html[dir=rtl] #image-two {
    margin-right: unset
}

html[dir=rtl] #text-three {
    margin-right: unset
}

@media (min-width:768px) {
    html[dir=rtl] .search-brokers-button {
        margin-right: unset;
        margin-left: auto
    }
}

html[dir=rtl] .my-right:after {
    display: none
}

.headline-text {
    margin-top: 12%
}

.subheadline-text {
    margin-top: auto;
    font-size: 18px;
    font-weight: 100
}

@media (max-width:768px) {
    .subheadline-text {
        text-align: center
    }
}

.search-brokers-button a {
    color: #5f67f7;
    background-color: #fff !important;
    border: solid 2px #fff !important;
    font-weight: 700;
    border-radius: 99px;
}

.search-brokers-button {
    margin-top: auto;
    margin-bottom: 10%
}

.calc-cashback .lots-picker .active {
    background-color: #5f64f8 !important
}

body:not(.tools-popout) .article-body .tool-content-wrapper .calc-widgit-top-pane {
    border: none;
    background: linear-gradient(#5f64f8 20%, #646bf8 45%);
    color: #fff
}

body:not(.tools-popout) .article-body .tool-content-wrapper .calc-widgit-top-pane .calc-popup-icon i {
    color: #fff
}

body:not(.tools-popout) .article-body .tool-content-wrapper .bottom-panel {
    border: 1px solid #7a7a7a;
    border-top: none
}

body:not(.tools-popout) .article-body .tool-content-wrapper .calculate-button {
    background-color: #5f64f8;
    color: #fff
}

ol.cl li {
    color: #5f64f8 !important
}

.textbody-break {
    background: #5f64f8 !important
}

.menu-border {
    opacity: .22 !important
}

.color-block,
.gradient {
    background: linear-gradient(120deg, #5f64f8 50%, 80%, #434aa9 90%)
}

.color-block-rkfx {
    background: linear-gradient(to right, #232448 35%, #393a55 55%)
}

.logo .icon {
    width: unset !important;
    height: 44px
}

.step-circle {
    background: linear-gradient(180deg, #5f64f8 20%, 75%, #434aa9 90%) !important
}

.step-number {
    color: #5f64f8 !important
}

input[type=button].frn-override.RKFX {
    background-color: #434aa9 !important
}

.btn-primary.frn-override.RKFX {
    background-color: #434aa9 !important
}

.frn-override.RKFX.btn-primary:active,
.frn-override.RKFX.btn-primary:focus,
.frn-override.RKFX.btn-primary:hover {
    background-color: #434aa9 !important
}

.btn-primary.frn-override.RKFX {
    background-color: #434aa9 !important;
    border: solid 2px #434aa9 !important
}

.btn-outline.frn-override.RKFX {
    background-color: transparent !important;
    border: solid 2px #434aa9 !important;
    color: #434aa9 !important
}

#rc-widget-top-pane {
    border: none;
    background: linear-gradient(#5f64f8 60%, #434aa9 85%);
    color: white;
}

#rc-widget-top-pane .calc-popup-icon i {
    color: white;
}

#rc-widget-bottom-pane {
    border: 1px solid #7a7a7a;
    border-top: none;
}

#rc-calculate-button {
    background-color: #ec3f2a;
    color: white;
}

#form-cash-back .frn-override {
    width: 100%;
    min-height: 32px;
}

#form-cash-back .error {
    display: block;
    width: 100%;
    color: red;
}

#form-cash-back .white-panel-body .white-panel-flex {
    width: 480px;
}

@media (max-width:640px) {
    #form-cash-back .white-panel-body .white-panel-flex {
        width: 100%;
    }
}

#contactForm label.error {
    display: block;
    width: 100%;
    color: red;
}

#contactForm select,
#form-cash-back select {
    font-size: 13px;
}