/*

    onboard.css

*/

.onboard {
    background-color: #0B5D66;
    background-image: linear-gradient(to right, #1e1e1e, #007481);
    line-height: normal;
}

.onboard .wrapper {
    padding: 60px 30px 90px 128px;
}

.basic-page .onboard .wrapper {
    padding: 56px 42px;
}

.onboard .wrapper .breadcrumb {
    font-family: "Proxima Nova Bold", Arial, sans-serif;
    font-size: 14px;
    color: #ffffff;
    text-decoration: none;
    margin-bottom: 18px;
    display: inline-block;
}

.onboard .wrapper .breadcrumb i {
    margin-right: 6px;
    position: relative;
    top: 1px;
}

.onboard .wrapper h1 {
    text-align: left;
    padding: 0;
    margin: 0;
}

.onboard .wrapper h1 span {
    display: block;
}

.onboard .wrapper h1 span.image {}

.onboard .wrapper h1 span.image a {
    display: inline-block;
    line-height: 0;
}

.onboard .wrapper h1 span.image a:hover,
.onboard .wrapper h1 span.image a:focus {
    outline: 1px dashed #ffffff;
}

.onboard .wrapper h1 span.image img {
    width: 460px;
    max-width: 100%;
}

.onboard .wrapper h1 span.text {
    font-size: 48px;
    font-family: "Proxima Nova Extra Bold", Arial, sans-serif;
    color: #ffffff;
    margin: 15px 0 0 0;
}

.onboard .wrapper h1 span.text.smaller-text {
    font-size: 75%;
}

@media only screen and (max-width: 1200px) {
    
    .onboard .wrapper {
        padding: 60px 30px 90px 60px;
    }
    
}

@media only screen and (max-width: 767px) {
    
    .onboard .wrapper {
        padding: 60px 30px;
    }
    
    .basic-page .onboard .wrapper {
        padding: 40px 30px;
    }
    
    .onboard .wrapper h1 span.text {
        font-size: 36px;
    }
    
}