@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 100;
    src: url(fonts/roboto/roboto-v18-latin-100.eot);
    src: local("Roboto Thin"),local("Roboto-Thin"),url(fonts/roboto/roboto-v18-latin-100.eot?#iefix) format("embedded-opentype"),url(fonts/roboto/roboto-v18-latin-100.woff2) format("woff2"),url(fonts/roboto/roboto-v18-latin-100.woff) format("woff"),url(fonts/roboto/roboto-v18-latin-100.ttf) format("truetype"),url(fonts/roboto/roboto-v18-latin-100.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: italic;
    font-weight: 100;
    src: url(fonts/roboto/roboto-v18-latin-100italic.eot);
    src: local("Roboto Thin Italic"),local("Roboto-ThinItalic"),url(fonts/roboto/roboto-v18-latin-100italic.eot?#iefix) format("embedded-opentype"),url(fonts/roboto/roboto-v18-latin-100italic.woff2) format("woff2"),url(fonts/roboto/roboto-v18-latin-100italic.woff) format("woff"),url(fonts/roboto/roboto-v18-latin-100italic.ttf) format("truetype"),url(fonts/roboto/roboto-v18-latin-100italic.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 300;
    src: url(fonts/roboto/roboto-v18-latin-300.eot);
    src: local("Roboto Light"),local("Roboto-Light"),url(fonts/roboto/roboto-v18-latin-300.eot?#iefix) format("embedded-opentype"),url(fonts/roboto/roboto-v18-latin-300.woff2) format("woff2"),url(fonts/roboto/roboto-v18-latin-300.woff) format("woff"),url(fonts/roboto/roboto-v18-latin-300.ttf) format("truetype"),url(fonts/roboto/roboto-v18-latin-300.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: italic;
    font-weight: 300;
    src: url(fonts/roboto/roboto-v18-latin-300italic.eot);
    src: local("Roboto Light Italic"),local("Roboto-LightItalic"),url(fonts/roboto/roboto-v18-latin-300italic.eot?#iefix) format("embedded-opentype"),url(fonts/roboto/roboto-v18-latin-300italic.woff2) format("woff2"),url(fonts/roboto/roboto-v18-latin-300italic.woff) format("woff"),url(fonts/roboto/roboto-v18-latin-300italic.ttf) format("truetype"),url(fonts/roboto/roboto-v18-latin-300italic.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 400;
    src: url(fonts/roboto/roboto-v18-latin-regular.eot);
    src: local("Roboto"),local("Roboto-Regular"),url(fonts/roboto/roboto-v18-latin-regular.eot?#iefix) format("embedded-opentype"),url(fonts/roboto/roboto-v18-latin-regular.woff2) format("woff2"),url(fonts/roboto/roboto-v18-latin-regular.woff) format("woff"),url(fonts/roboto/roboto-v18-latin-regular.ttf) format("truetype"),url(fonts/roboto/roboto-v18-latin-regular.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 500;
    src: url(fonts/roboto/roboto-v18-latin-500.eot);
    src: local("Roboto Medium"),local("Roboto-Medium"),url(fonts/roboto/roboto-v18-latin-500.eot?#iefix) format("embedded-opentype"),url(fonts/roboto/roboto-v18-latin-500.woff2) format("woff2"),url(fonts/roboto/roboto-v18-latin-500.woff) format("woff"),url(fonts/roboto/roboto-v18-latin-500.ttf) format("truetype"),url(fonts/roboto/roboto-v18-latin-500.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: italic;
    font-weight: 400;
    src: url(fonts/roboto/roboto-v18-latin-italic.eot);
    src: local("Roboto Italic"),local("Roboto-Italic"),url(fonts/roboto/roboto-v18-latin-italic.eot?#iefix) format("embedded-opentype"),url(fonts/roboto/roboto-v18-latin-italic.woff2) format("woff2"),url(fonts/roboto/roboto-v18-latin-italic.woff) format("woff"),url(fonts/roboto/roboto-v18-latin-italic.ttf) format("truetype"),url(fonts/roboto/roboto-v18-latin-italic.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: italic;
    font-weight: 500;
    src: url(fonts/roboto/roboto-v18-latin-500italic.eot);
    src: local("Roboto Medium Italic"),local("Roboto-MediumItalic"),url(fonts/roboto/roboto-v18-latin-500italic.eot?#iefix) format("embedded-opentype"),url(fonts/roboto/roboto-v18-latin-500italic.woff2) format("woff2"),url(fonts/roboto/roboto-v18-latin-500italic.woff) format("woff"),url(fonts/roboto/roboto-v18-latin-500italic.ttf) format("truetype"),url(fonts/roboto/roboto-v18-latin-500italic.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 700;
    src: url(fonts/roboto/roboto-v18-latin-700.eot);
    src: local("Roboto Bold"),local("Roboto-Bold"),url(fonts/roboto/roboto-v18-latin-700.eot?#iefix) format("embedded-opentype"),url(fonts/roboto/roboto-v18-latin-700.woff2) format("woff2"),url(fonts/roboto/roboto-v18-latin-700.woff) format("woff"),url(fonts/roboto/roboto-v18-latin-700.ttf) format("truetype"),url(fonts/roboto/roboto-v18-latin-700.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: italic;
    font-weight: 700;
    src: url(fonts/roboto/roboto-v18-latin-700italic.eot);
    src: local("Roboto Bold Italic"),local("Roboto-BoldItalic"),url(fonts/roboto/roboto-v18-latin-700italic.eot?#iefix) format("embedded-opentype"),url(fonts/roboto/roboto-v18-latin-700italic.woff2) format("woff2"),url(fonts/roboto/roboto-v18-latin-700italic.woff) format("woff"),url(fonts/roboto/roboto-v18-latin-700italic.ttf) format("truetype"),url(fonts/roboto/roboto-v18-latin-700italic.svg#Roboto) format("svg")
}

body {
    font-size: 14px;
    /*font-weight: 300;*/
    color: #000
}

.font-roboto, body {
    font-family: Roboto,sans-serif
}

#wrapper {
    padding-bottom: 25px
}

a {
    color: #406eb3
}

.ex-btn {
    line-height: normal;
    position: relative;
    font-family: Roboto,sans-serif;
    display: inline-block;
    font-size: 18px;
    font-weight: 700;
    line-height: 28px;
    padding: 12px 69px 12px 33px;
    background: #982881;
    border-radius: 6px;
    text-transform: capitalize;
    color: #fff;
    text-align: center;
    margin-bottom: 10px;
    min-width: 239px;
    transition: all .2s ease-in-out
}

    .ex-btn:hover {
        color: #fff;
        background: #701d5f;
        text-decoration: none
    }

    .ex-btn:after {
        position: absolute;
        top: 50%;
        right: 30px;
        transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        content: "";
        display: inline-block;
        width: 18px;
        height: 18px;
        background-image: url(../img/arrow.svg);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: 50%
    }

.btn-close {
    width: 18px;
    height: 18px;
    background: url(../img/close.svg);
    cursor: pointer
}

.ex-title {
    color: #000;
    font-size: 60px;
    font-weight: 100
}

.btn-custom-purple {
    color: #fff;
    font-weight: 700;
    padding: 11px 56px;
    border-radius: 6px;
    background: #982881;
    font-size: 14px;
    line-height: 28px
}

    .btn-custom-purple:hover {
        background-color: #701d5f
    }

.item-title {
    font-size: 24px;
    font-weight: 500;
    line-height: 27px;
    margin-bottom: 0;
    overflow: hidden;
    display: -webkit-box
}

    .item-title a {
        color: #010101
    }

        .item-title a:hover {
            color: #ba2f7d;
            text-decoration: none
        }

.action a {
    color: #000;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    text-decoration: underline
}

    .action a:hover {
        color: #ba2f7d;
        text-decoration: none
    }

.ex-btn-card-direction, .ex-btn-card-direction:hover {
    background: #26478d;
    font-size: 14px;
    font-weight: 700;
    line-height: 28px;
    padding: 12px 50px 12px 25px
}

    .ex-btn-card-direction:after, .ex-btn-card-direction:hover:after {
        background-image: url(../img/arrow-next.svg);
        width: 7px;
        height: 12px;
        right: 21px
    }

.ex-title-summary {
    font-size: 33px;
    font-weight: 100;
    line-height: 36px
}

.card-content--title {
    color: #000;
    font-size: 15px;
    font-weight: 700;
    line-height: 18px
}

.icons > div {
    display: inline-block;
    margin-right: 20px
}

.style-guide #content {
    margin-top: 30px
}

.style-guide h1, .style-guide h2 {
    color: #575755;
    font-weight: 100
}

.style-guide h1 {
    font-size: 60px;
    margin-bottom: 20px
}

.style-guide h2 {
    margin: 20px 0
}

.style-guide .headding > div {
    margin-bottom: 10px
}

.style-guide .panel {
    color: #333;
    background-color: #f5f5f5;
    border-color: #ddd;
    box-shadow: 0 3px 10px rgba(0,0,0,.17)
}

    .style-guide .panel .content-body {
        padding: 15px;
        background-color: #fff
    }

.style-guide .title {
    padding: 15px;
    color: #333;
    background-color: #f5f5f5;
    border-color: #ddd
}

.custom-select.is-invalid, .form-control.is-invalid, .was-validated .custom-select:invalid, .was-validated .form-control:invalid {
    border-color: #dc3545 !important
}

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

@media screen and (max-width:991px) {
    .disabled-scroll {
        overflow: hidden;
        position: relative;
        height: 100vh
    }
}

.color > div {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

    .color > div > div {
        margin-bottom: 20px;
        box-shadow: 0 3px 10px rgba(0,0,0,.17);
        border-radius: 100%;
        width: 150px;
        height: 150px;
        display: inline-block;
        margin-right: 20px;
        text-align: center;
        padding: 0 20px;
        color: #fff;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: center;
        justify-content: center
    }

        .color > div > div span {
            display: block
        }

.clearfix {
    display: block;
    clear: both
}

    .clearfix:after, .clearfix:before {
        display: block;
        content: "";
        clear: both
    }

.login .header {
    border-bottom: 1px solid #eee
}

    .login .header .nav .menu-item a {
        font-weight: 400
    }

.header {
    border-bottom: 1px solid #eee;
    padding-top: 33px
}

    .header .-fix {
        z-index: 9;
        color: #fff;
        padding: 6px 0;
        position: fixed;
        width: 100%;
        left: 0;
        top: 0;
        background-image: linear-gradient(90deg,#96297a,#5d2779)
    }

        .header .-fix a {
            color: #fff
        }

        .header .-fix .content {
            max-width: 1170px;
            margin: auto;
            padding: 0 40px;
            position: relative
        }

        .header .-fix .btn-close {
            font-size: 24px;
            float: right;
            line-height: 18px;
            display: inline-block;
            position: absolute;
            right: 15px;
            top: 50%;
            width: 18px;
            height: 18px;
            background: url(/../img/close.svg);
            cursor: pointer;
            transform: translateY(-50%)
        }

    .header .-top {
        height: 33px;
        background: #f4f4f4
    }

    .header .-navbar {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center
    }

    .header .logo {
        padding-top: 10px;
        padding-bottom: 10px
    }

        .header .logo a {
            display: block;
            width: 172px
        }

        .header .logo img {
            width: auto;
            max-width: 132px;
            margin: 12px 0;
            max-height: 44px
        }

    .header .nav .nav-link {
        color: #000;
        font-size: 16px;
        font-weight: 400;
        padding: .5rem 20px
    }

        .header .nav .nav-link:hover {
            color: #406eb3
        }

    .header .nav .menu-item a {
        color: #010101;
        font-weight: 400;
        word-spacing: 3px
    }

.menu-icon {
    cursor: pointer;
    display: inline-block;
    float: right;
    padding: 28px 20px;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

    .menu-icon .navicon {
        background: #333;
        display: block;
        height: 2px;
        position: relative;
        transition: background .2s ease-out;
        width: 18px
    }

        .menu-icon .navicon:after, .menu-icon .navicon:before {
            background: #333;
            content: "";
            display: block;
            height: 100%;
            position: absolute;
            transition: all .2s ease-out;
            width: 100%
        }

        .menu-icon .navicon:before {
            top: 5px
        }

        .menu-icon .navicon:after {
            top: -5px
        }

.menu-btn {
    display: none
}

    .menu-btn:checked ~ .menu-icon .navicon {
        background: transparent
    }

        .menu-btn:checked ~ .menu-icon .navicon:before {
            transform: rotate(-45deg);
            top: 0
        }

        .menu-btn:checked ~ .menu-icon .navicon:after {
            transform: rotate(45deg);
            top: 0
        }

@media screen and (max-width:767px) {
    .header {
        padding: 0
    }

        .header .-top {
            display: none
        }

        .header .-navbar {
            display: block;
            height: 65px;
            position: fixed;
            width: 100%;
            background: #fff;
            left: 0;
            z-index: 14;
            top: 0;
            text-align: center
        }

        .header .nav {
            clear: both;
            background: #ebebeb;
            position: absolute;
            width: 100%;
            top: 64px;
            text-align: left
        }

            .header .nav .menu-item {
                background: hsla(0,0%,97%,.95);
                position: relative;
                border-bottom: 1px solid #dfdfdf
            }

                .header .nav .menu-item a {
                    padding: 12px 20px;
                    font-weight: 400
                }

        .header .logo {
            padding: 0;
            max-height: 100%
        }

            .header .logo img {
                max-height: 36px
            }

    .opacity-overlay {
        transition: all .2s ease-in-out;
        opacity: 0;
        position: fixed;
        width: 100%;
        height: 100%;
        background: #ffffff9e;
        z-index: -1
    }

        .opacity-overlay.active {
            opacity: 1;
            z-index: 1
        }
}

@media screen and (max-width:991px) {
    .nav {
        display: none
    }

    .header {
        padding-top: 65px
    }

        .header .-top {
            display: none
        }

        .header .-navbar {
            display: block;
            height: 65px;
            position: fixed;
            width: 100%;
            background: #fff;
            left: 0;
            z-index: 14;
            top: 0;
            text-align: center
        }

        .header .nav {
            clear: both;
            background: #ebebeb;
            position: absolute;
            width: 100%;
            top: 64px;
            text-align: left
        }

            .header .nav .menu-item {
                background: hsla(0,0%,97%,.95);
                position: relative;
                border-bottom: 1px solid #dfdfdf
            }

                .header .nav .menu-item a {
                    padding: 12px 20px;
                    font-weight: 400
                }

        .header .logo {
            padding: 0;
            max-height: 100%;
            position: absolute;
            left: 50%;
            transform: translateX(-50%)
        }

            .header .logo img {
                max-height: 36px
            }

    .opacity-overlay {
        transition: all .2s ease-in-out;
        opacity: 0;
        position: fixed;
        width: 100%;
        height: 100vh;
        background: #ffffff9e;
        z-index: -1
    }

        .opacity-overlay.active {
            opacity: 1;
            z-index: 11
        }
}

@media screen and (min-width:991px) and (max-width:1199px) {
    .header .nav .menu-item a {
        font-size: 15px;
        font-weight: 400;
        word-spacing: 0;
        padding: .5rem 8px
    }
}

.footer {
    font-weight: 400;
    line-height: 28px;
    margin-top: 65px;
    padding-top: 30px
}

    .footer a {
        text-decoration: underline
    }

        .footer a:hover {
            color: #009
        }

@media screen and (max-width:767px) {
    .footer {
        padding-top: 10px
    }

    .social {
        margin-bottom: 10px
    }

    .footer-content {
        white-space: pre-line
    }
}

.expform {
    background: url(/../img/bg-login.png);
    background-repeat: no-repeat;
    background-position: 100% 100%;
    position: relative;
    padding: 58px 98px 60px;
    margin: 30px auto;
    max-width: 596px;
    box-shadow: 0 10px 28px hsla(210,5%,68%,.3),0 10px 50px hsla(210,5%,68%,.5)
}

    .expform:before {
        background-image: linear-gradient(90deg,#26478d,#406eb3);
        content: "";
        position: absolute;
        width: 100%;
        height: 20px;
        top: 0;
        left: 0
    }

    .expform input {
        font-size: 14px
    }

    .expform a {
        text-decoration: none
    }

        .expform a:hover {
            color: #009
        }

    .expform .form-header {
        font-size: 60px;
        font-weight: 100;
        margin-bottom: 25px
    }

    .expform .form-sub-header {
        font-size: 24px;
        font-weight: 300
    }

    .expform .form-desc {
        font-weight: 400;
        line-height: 28px
    }

    .expform .form-control {
        color: #999;
        max-width: 394px
    }

    .expform .btn-custom {
        margin-top: 15px;
        color: #fff;
        font-weight: 700;
        padding: 13px 54px;
        border-radius: 6px;
        background: #26478d
    }

    .expform .form-footer {
        margin-top: 30px
    }

        .expform .form-footer .link a {
            display: inline-block
        }

        .expform .form-footer .link span {
            text-decoration: underline
        }

            .expform .form-footer .link a:not(:first-child) {
                padding-left: 20px
            }

                .expform .form-footer .link a:not(:first-child):before {
                    content: "\2022";
                    font-size: 20px;
                    color: #000;
                    font-weight: 700;
                    display: inline-block;
                    width: 20px;
                    text-align: center;
                    margin-left: -1em;
                    vertical-align: middle
                }

        .expform .form-footer .info {
            margin-top: 15px
        }

            .expform .form-footer .info span {
                text-decoration: underline
            }

    .expform .capcha.form-group {
        margin-bottom: 5px
    }

    .expform #capchaHelp {
        color: #000;
        margin-bottom: .5rem
    }

    .expform .form-desc + .form-footer {
        margin-top: 10px
    }

.form-header {
    font-size: 60px;
    font-weight: 100;
    margin-bottom: 25px
}

.form-sub-header {
    font-size: 24px;
    font-weight: 300
}

.form-desc {
    font-weight: 400;
    line-height: 28px
}

.form-control {
    color: #999;
    max-width: 394px
}

.btn-custom {
    margin-top: 15px;
    color: #fff;
    font-weight: 700;
    padding: 13px 54px;
    border-radius: 6px;
    background: #26478d
}

.form-footer {
    margin-top: 30px
}

    .form-footer a {
        text-decoration: none
    }

        .form-footer a:hover {
            color: #009
        }

    .form-footer .link a {
        display: inline-block
    }

     .form-footer .info span {
        text-decoration: underline
    }

    .form-footer .link span {
        text-decoration: underline
    }

        .form-footer .link a:not(:first-child) {
            padding-left: 20px
        }

            .form-footer .link a:not(:first-child):before {
                content: "\2022";
                font-size: 20px;
                color: #000;
                font-weight: 700;
                display: inline-block;
                width: 20px;
                text-align: center;
                margin-left: -1em;
                vertical-align: middle
            }

    .form-footer .info {
        margin-top: 15px
    }

.capcha.form-group {
    margin-bottom: 5px
}

#capchaHelp {
    color: #000;
    margin-bottom: .5rem
}

.form-desc + .form-footer {
    margin-top: 10px
}

h3.form-header {
    font-size: 40px;
    letter-spacing: -2px;
    margin-bottom: 35px;
    margin-top: 22px
}

.form-desc + .form-content {
    margin-top: 20px
}

.expform h3.form-header {
    font-size: 40px;
    letter-spacing: -2px;
    margin-bottom: 35px;
    margin-top: 22px
}

.expform .form-desc + .form-content {
    margin-top: 20px
}

.homepage .expform {
    background: url(../img/bg-login.png);
    background-repeat: no-repeat;
    background-position: 100% 100%;
    position: relative;
    padding: 40px 85px 60px;
    margin-left: 7px;
    max-width: 591px;
    box-shadow: 0 0 40px rgba(0,0,0,.16)
}

    .homepage .expform:before {
        background-image: linear-gradient(90deg,#a72074,#402176);
        background-image: linear-gradient(90deg,#a72074 0,#402176);
        content: "";
        position: absolute;
        width: 100%;
        height: 20px;
        top: 0;
        left: 0
    }

    .homepage .expform .form-header {
        font-size: 60px;
        font-weight: 100;
        margin-bottom: 9px;
        letter-spacing: -1.8px;
        line-height: 120px
    }

    .homepage .expform .form-sub-header {
        font-size: 24px;
        font-weight: 300
    }

    .homepage .expform .form-desc {
        font-weight: 400;
        line-height: 28px
    }

    .homepage .expform .form-group {
        margin-bottom: 12px
    }

        .homepage .expform .form-group label {
            color: #000;
            font-size: 14px;
            font-weight: 400;
            line-height: 28px;
            margin-bottom: 6px
        }

    .homepage .expform .form-control {
        color: #999;
        max-width: 394px;
        border-radius: 0;
        border-color: #d8d8d8;
        min-height: 40px
    }

        .homepage .expform .form-control:focus {
            box-shadow: 0 0 0
        }

    .homepage .expform .btn-custom {
        margin-top: 23px;
        color: #fff;
        font-weight: 700;
        padding: 11px 56px;
        border-radius: 6px;
        background: #982881;
        font-size: 14px;
        line-height: 28px
    }

        .homepage .expform .btn-custom:hover {
            background-color: #701d5f
        }

    .homepage .expform .form-footer {
        margin-top: 30px
    }

        .homepage .expform .form-footer .link a {
            display: inline-block;
            text-decoration: underline;
            color: #406eb3;
            font-size: 14px;
            font-weight: 400;
            line-height: 28px
        }

            .homepage .expform .form-footer .link a:not(:first-child) {
                padding-left: 20px
            }

                .homepage .expform .form-footer .link a:not(:first-child):before {
                    content: "\2022";
                    font-size: 20px;
                    color: #000;
                    font-weight: 700;
                    display: inline-block;
                    width: 20px;
                    text-align: center;
                    margin-left: -1em;
                    vertical-align: middle
                }

            .homepage .expform .form-footer .link a:hover {
                color: #009
            }

        .homepage .expform .form-footer .info {
            margin-top: 15px;
            font-size: 14px;
            font-weight: 400;
            line-height: 28px;
            color: #000
        }

            .homepage .expform .form-footer .info a {
                text-decoration: underline;
                color: #406eb3;
                font-size: 14px;
                font-weight: 400;
                line-height: 28px
            }

                .homepage .expform .form-footer .info a:hover {
                    color: #009
                }

    .homepage .expform .capcha.form-group {
        margin-bottom: 5px
    }

    .homepage .expform #capchaHelp {
        color: #000;
        margin-bottom: 0
    }

    .homepage .expform .form-desc + .form-footer {
        margin-top: 10px
    }

.homepage .ex-summary {
    max-width: 347px;
    margin-right: 50px;
    margin-left: auto
}

    .homepage .ex-summary h2 {
        margin-bottom: 45px
    }

        .homepage .ex-summary h2.ex-title {
            font-size: 33px;
            font-weight: 100;
            line-height: 36px
        }

    .homepage .ex-summary .ex-description {
        font-size: 14px;
        font-weight: 300;
        line-height: 24px;
        margin-bottom: 20px
    }

    .homepage .ex-summary .ex-btn {
        margin: 9px 0
    }

.homepage .get-started h4.ex-title {
    color: #000;
    font-size: 60px;
    font-weight: 100;
    margin-left: 90px;
    margin-bottom: 51px
}

.homepage .get-started img {
    max-width: 100%
}

.homepage .get-started ul {
    padding: 0;
    list-style: none;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between
}

    .homepage .get-started ul .item {
        -ms-flex: 0 0 360px;
        flex: 0 0 360px;
        max-width: 360px
    }

    .homepage .get-started ul .item-image {
        position: relative
    }

        .homepage .get-started ul .item-image a {
            height: 240px;
            overflow: hidden;
            display: block;
            transition: all .2s ease-in-out;
            -webkit-transition: all .2s ease-in-out;
            -moz-transition: all .2s ease-in-out;
            -o-transition: all .2s ease-in-out
        }

            .homepage .get-started ul .item-image a:before {
                background-image: linear-gradient(90deg,#a72074,#402176);
                background-image: linear-gradient(90deg,#a72074 0,#402176);
                height: 0
            }

            .homepage .get-started ul .item-image a:after, .homepage .get-started ul .item-image a:before {
                content: "";
                position: absolute;
                width: 100%;
                top: 0;
                left: 0;
                -webkit-transition: all .2s ease-in-out;
                -moz-transition: all .2s ease-in-out;
                -o-transition: all .2s ease-in-out
            }

            .homepage .get-started ul .item-image a:after {
                opacity: 1;
                background: #bc2f7f;
                background: -webkit-gradient(left top,right bottom,color-stop(0,#bc2f7f),color-stop(0,rgba(188,47,127,.55)),color-stop(47%,rgba(100,38,120,.55)),color-stop(100%,rgba(38,67,140,.55)));
                background: linear-gradient(135deg,#bc2f7f,rgba(188,47,127,.55) 0,rgba(100,38,120,.55) 47%,rgba(38,67,140,.55));
                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#bc2f7f",endColorstr="#26438c",GradientType=1);
                height: 100%;
                transition: all .2s ease-in-out
            }

            .homepage .get-started ul .item-image a:hover {
                padding-top: 20px
            }

                .homepage .get-started ul .item-image a:hover:before {
                    height: 20px
                }

                .homepage .get-started ul .item-image a:hover:after {
                    opacity: 0
                }

    .homepage .get-started ul .item-context {
        background: #fff;
        position: relative;
        z-index: 10;
        margin: -97px 0 0 66px;
        padding: 18px 0 0 30px
    }

        .homepage .get-started ul .item-context .item-title {
            font-size: 24px;
            font-weight: 500;
            line-height: 27px;
            margin-bottom: 0;
            min-height: 70px;
            overflow: hidden;
            display: -webkit-box
        }

            .homepage .get-started ul .item-context .item-title a {
                color: #010101
            }

                .homepage .get-started ul .item-context .item-title a:hover {
                    text-decoration: none;
                    color: #ba2f7d
                }

        .homepage .get-started ul .item-context .item-desc {
            padding-right: 5px
        }

            .homepage .get-started ul .item-context .item-desc p {
                color: #000;
                font-size: 14px;
                font-weight: 400;
                line-height: 18px
            }

        .homepage .get-started ul .item-context .action {
            margin-top: 20px
        }

            .homepage .get-started ul .item-context .action a {
                color: #000;
                font-size: 14px;
                font-weight: 400;
                line-height: 18px;
                text-decoration: underline
            }

                .homepage .get-started ul .item-context .action a:hover {
                    color: #ba2f7d
                }

@media screen and (max-width:767px) {
    .homepage #content {
        margin-top: 65px
    }

    .homepage .ex-summary {
        max-width: 100%;
        margin-right: auto;
        margin-bottom: 42px
    }

        .homepage .ex-summary h2 {
            margin-bottom: 12px
        }

            .homepage .ex-summary h2.ex-title {
                font-size: 24px;
                line-height: 30px
            }

        .homepage .ex-summary .directions {
            text-align: center
        }

    .homepage .expform {
        margin: auto;
        padding: 15px 32px 22px 27px
    }

        .homepage .expform .form-header {
            font-size: 30px;
            margin-bottom: -30px
        }

        .homepage .expform .submit-form {
            text-align: center
        }

            .homepage .expform .submit-form .btn-custom {
                margin-top: 20px
            }

        .homepage .expform .form-footer .info {
            line-height: 20px
        }

    .homepage .get-started h4.ex-title {
        font-size: 30px;
        margin-left: auto;
        margin-bottom: 10px;
        margin-top: 41px
    }

    .homepage .get-started ul {
        display: block
    }

        .homepage .get-started ul .item-image a {
            height: auto
        }

            .homepage .get-started ul .item-image a:after {
                opacity: 0
            }

            .homepage .get-started ul .item-image a:hover:before {
                height: 0
            }

        .homepage .get-started ul .item-context {
            margin: 15px 0;
            padding: 0
        }

            .homepage .get-started ul .item-context .item-title {
                min-height: auto;
                margin-bottom: 10px
            }

        .homepage .get-started ul .item .action {
            margin-top: 15px
        }
}

@media screen and (min-width:768px) and (max-width:1199px) {
    .homepage .ex-summary {
        max-width: 100%;
        margin-right: auto;
        margin-bottom: 42px
    }

        .homepage .ex-summary h2 {
            margin-bottom: 12px
        }

            .homepage .ex-summary h2.ex-title {
                font-size: 24px;
                line-height: 30px
            }

        .homepage .ex-summary .directions {
            text-align: left
        }

            .homepage .ex-summary .directions .ex-btn {
                min-width: 255px
            }

    .homepage .expform {
        margin: auto;
        padding: 15px 32px 22px 27px
    }

        .homepage .expform .form-header {
            font-size: 30px;
            margin-bottom: -30px
        }

        .homepage .expform .submit-form {
            text-align: left
        }

            .homepage .expform .submit-form .btn-custom {
                margin-top: 20px
            }

        .homepage .expform .form-footer .info {
            line-height: 20px
        }

    .homepage .get-started h4.ex-title {
        font-size: 30px;
        margin-left: auto;
        margin-bottom: 10px;
        margin-top: 41px
    }

    .homepage .get-started ul.started-items {
        margin: 0 -15px
    }

    .homepage .get-started ul .item {
        -ms-flex: 1;
        flex: 1;
        max-width: 360px;
        padding: 0 .938rem
    }

    .homepage .get-started ul .item-image a {
        height: auto
    }

        .homepage .get-started ul .item-image a:after {
            opacity: 0
        }

        .homepage .get-started ul .item-image a:hover:before {
            height: 0
        }

    .homepage .get-started ul .item-context {
        margin: 15px 0;
        padding: 0
    }

        .homepage .get-started ul .item-context .item-title {
            min-height: auto;
            margin-bottom: 10px
        }

    .homepage .get-started ul .item .action {
        margin-top: 15px
    }
}

.dp-group .header {
    padding-top: 0;
    border-bottom: 1px solid #eee
}

.dp-group .layer-wrapper {
    width: 1085px;
    margin: 0 auto
}

.dp-group .layer-group {
    background: #fff url(../img/dp-group-bg.png) no-repeat;
    background-size: cover;
    width: 945px;
    min-height: 467px;
    position: relative;
    box-shadow: 0 0 40px rgba(0,0,0,.16);
    border-radius: 10px 10px 0 0;
    margin-top: 60px
}

.dp-group .layer-group--header {
    background: url(../img/dp-group-banner.svg) no-repeat;
    background-size: cover;
    border-radius: 10px 10px 0 0;
    padding: 40px 20px 40px 52px;
    height: 127px
}

    .dp-group .layer-group--header h2.dp-title {
        color: #fff;
        font-size: 48px;
        font-weight: 100;
        letter-spacing: -1.44px;
        line-height: 48px
    }

.dp-group .layer-group--body {
    position: relative;
    left: 97px;
    margin-top: 37px
}

    .dp-group .layer-group--body .card {
        max-width: 458px;
        min-height: 271px;
        box-shadow: 0 3px 6px rgba(0,0,0,.16);
        background-color: #fff;
        border: 0;
        padding: 32px 27px 30px 37px;
        border-radius: 0
    }

    .dp-group .layer-group--body .card-content--title {
        color: #000;
        font-size: 15px;
        font-weight: 700;
        line-height: 18px;
        margin-bottom: 12px
    }

    .dp-group .layer-group--body .card-content p {
        color: #000;
        font-size: 14px;
        font-weight: 300;
        line-height: 17px
    }

    .dp-group .layer-group--body .card-direction {
        position: absolute;
        bottom: 30px
    }

        .dp-group .layer-group--body .card-direction .ex-btn {
            background: #26478d;
            font-size: 14px;
            font-weight: 700;
            line-height: 28px;
            padding: 12px 50px 12px 25px;
            margin-bottom: 0
        }

            .dp-group .layer-group--body .card-direction .ex-btn:after {
                background-image: url(../img/arrow-next.svg);
                width: 7px;
                height: 12px;
                right: 21px
            }

.dp-group .layer-group:after {
    content: "";
    position: absolute;
    width: 820px;
    height: 488px;
    background-color: #f4f4f4;
    top: 18px;
    left: 264px;
    z-index: -1
}

@media screen and (max-width:767px) {
    .dp-group .header {
        padding-top: 65px
    }

    .dp-group .layer-wrapper {
        width: 100%
    }

    .dp-group .layer-group {
        max-width: 100%
    }

    .dp-group .layer-group--header {
        padding: 20px 20px 20px 25px;
        height: 100px
    }

        .dp-group .layer-group--header h2.dp-title {
            font-size: 24px;
            line-height: 32px
        }

    .dp-group .layer-group--body {
        left: 0;
        margin: 0
    }

        .dp-group .layer-group--body .card {
            max-width: 100%;
            min-height: auto;
            box-shadow: 0 3px 6px rgba(0,0,0,.16);
            padding: 25px 20px
        }

        .dp-group .layer-group--body .card-content {
            margin-top: 20px
        }

        .dp-group .layer-group--body .card-content--title {
            color: #000;
            font-size: 15px;
            font-weight: 700;
            line-height: 18px
        }

        .dp-group .layer-group--body .card-content p {
            color: #000;
            font-size: 14px;
            font-weight: 300;
            line-height: 17px
        }

        .dp-group .layer-group--body .card-direction {
            position: relative;
            bottom: 0
        }

            .dp-group .layer-group--body .card-direction .ex-btn {
                background: #26478d;
                font-size: 14px;
                font-weight: 700;
                line-height: 28px;
                padding: 12px 50px 12px 25px;
                margin-bottom: 0
            }

                .dp-group .layer-group--body .card-direction .ex-btn:after {
                    background-image: url(../img/arrow-next.svg);
                    width: 7px;
                    height: 12px;
                    right: 21px
                }

    .dp-group .layer-group:after {
        content: "";
        position: relative;
        width: 0;
        height: 0;
        background-color: transparent;
        top: auto;
        left: auto;
        z-index: -1
    }
}

@media screen and (min-width:768px) and (max-width:1199px) {
    .dp-group .header {
        padding-top: 65px
    }
}

@media screen and (min-width:768px) and (max-width:1199px) and (min-width:991px) {
    .dp-group .header {
        padding-top: 0
    }
}

@media screen and (min-width:768px) and (max-width:1199px) {
    .dp-group .layer-wrapper {
        width: 100%
    }

    .dp-group .layer-group {
        width: 100%;
        min-height: auto;
        position: relative;
        margin-top: 30px
    }

    .dp-group .layer-group--header {
        background-size: cover;
        border-radius: 10px 10px 0 0;
        padding: 20px 20px 20px 52px;
        height: 85px
    }

        .dp-group .layer-group--header h2.dp-title {
            color: #fff;
            font-size: 32px;
            font-weight: 100;
            letter-spacing: -1.44px;
            line-height: 40px
        }

    .dp-group .layer-group--body {
        position: relative;
        left: 0;
        margin-top: 37px;
        padding: 0 10px 30px
    }

        .dp-group .layer-group--body .card {
            max-width: 100%;
            padding: 32px 15px 30px 20px
        }

    .dp-group .layer-group:after {
        content: "";
        position: relative;
        width: 0;
        height: 0;
        background-color: transparent;
        top: 0;
        left: 0
    }
}

.none-content #content {
    min-height: 500px
}

@media screen and (max-width:1199px) and (min-width:768px) {
    .homepage .expform {
        margin-top: 30px
    }
}

@media (max-width:991px) {
    .login .header {
        border-bottom: 0
    }

        .login .header .-fix {
            z-index: 99
        }

        .login .header .-navbar {
            border-bottom: 1px solid #eee
        }

    .header {
        border-bottom: 0
    }

        .header .-navbar {
            border-bottom: 1px solid #eee
        }

    #content {
        padding-top: 30px
    }

    .dp-group .header {
        border-bottom: 0
    }

    .dp-group .layer-group, .homepage .expform {
        margin-top: 0
    }
}

@media (max-width:767px) {
    .nav {
        display: none
    }

    .expform {
        padding-left: 15px;
        padding-right: 15px
    }
}