/*=== fonts ====*/
@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,600,700,900");

/*===== color =====*/
a {
    text-decoration: none;
}

a:hover,
a:focus {
    text-decoration: none;
}

.clear {
    clear: both;
}



i:before {
    margin-left: 0px !important;
}

body {
    --primary-blue: #3156ED;
    --dark-blue: #0A143D;
    --primary-black: #575C71;
    --dark-black: #000C14;
    font: 300 15px/28px "Roboto", sans-serif;
    letter-spacing: 0px;
    color: var(--primary-black);
    padding: 0px;
    overflow-x: hidden;
    z-index: 0;
}

.body_wrapper {
    z-index: 20;
    overflow: hidden;
}

a,
.btn,
button {
    text-decoration: none;
    outline: none;
}

a:hover,
a:focus,
.btn:hover,
.btn:focus,
button:hover,
button:focus {
    text-decoration: none;
    outline: none;
}

.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

@media (min-width: 1250px) {
    .container {
        max-width: 1200px;
    }
}

@media (max-width: 767px) {
    .container {
        max-width: 100%;
    }
}

.image-rendering-optimize-quality {
    image-rendering: optimizeQuality;
    image-rendering: -webkit-optimize-contrast;
}

.app-btn-primary{
    background-color: var(--primary-blue);
    outline: none;
    border: none;
    font-weight: 500;
    line-height: 24px;
    font-size: 18px;
    font-family: "Roboto", sans-serif;
}

.app-btn-primary:hover, .app-btn-primary:active, .app-btn-primary:focus {
    background-color: #2347D9;
}

.fw-700{
    font-weight: 700;
}

.radius-8{
    border-radius: 8px;
}