﻿
@font-face {
    font-family: 'SansPro Regular';
    font-style: normal;
    font-weight: 400;
    src: url("fonts/SourceSansPro/SourceSansPro-Regular.ttf") format("truetype");
}

@font-face {
    font-family: 'SansPro Bold';
    font-style: normal;
    font-weight: 700;
    src: url("fonts/SourceSansPro/SourceSansPro-Bold.ttf") format("truetype");
}

body {
    background-color: #FFFFFF !important;
}

a {
    font-size: 12px;
    color: #3279B7;
}

.navbar-brand {
    margin-top: 10px;
}

#title-page {
    height: 80px;
    background: #FFFFFF;
    align-items: baseline;
}

.container-height {
    margin-top: 46px;
    margin-bottom: 35px;
}

.message {
    float: left;
    font-size: 40px;
    color: #333333;
    font-family: 'SansPro Bold';
}

@media (max-width: 768px) {
    .message {
        float:none;
    }
}

.main-container {
    margin-top: 0px;
}

.button {
    background-color: #007BFF;
}

.button-big {
    padding: 8px 35px;
    font-size: 1.6em;
    box-shadow: none;
}

button.disabled {
    background-color: #EB3484;
}

.background-stripes {
    background-image: none;
}

.button-link, .button-link:hover {
    color: #EB3484;
    border: 2px solid #EB3484;
    border-radius: 5px;
    font-size: 18px;
    font-family: 'SansPro Bold';
    padding: 4px 23px 6px 23px;
    position: relative;
    top: -18px;
}

    .button-link.start-new {
        top: 30px;
        left: 15px;
    }

.step-content {
    border-radius: 3px;
}

    .step-content h3 {
        border-bottom: 1px solid #B8B8B8;
        padding: 22px 62px 19px 62px;
        font-family: 'SansPro Bold';
        color: #161616;
        letter-spacing: 0px;
    }

    .step-content h3 span {
        display: block;
        font-family: 'SansPro Regular';
        font-size: 15px;
        left: -30px;
        top: 3px;
        position: relative;
    }

    .step-content .button {
        margin: 22px 20px 22px 0px;
    }

#steps-visualizer-content {
    position: relative !important;
    right: 0% !important;
    top: 0px !important;
}
}

.steps-visualizer .margin-right {
    
}

.steps-visualizer {
    padding-top: 2px;
    text-align: right;
}

@media (max-width: 1199px) {
    .progressbar {
        width: 390px;
    }
}

@media (max-width: 768px) {
    .progressbar-container {
        padding-bottom: 130px;
    }

    .progressbar {
        float: none;
        margin: auto;
        padding-right: 30px;
    }
}

@media (max-width: 500px) {
    .steps-visualizer img {
        width: auto;
    }
}

@media (max-width: 418px) {
    .progressbar {
        width: auto;
        min-width: 230px;
    }
}

.title-icon {
    width: 34px;
    height: 34px;
    display: inline-block;
    position: relative;
    top: 22px;
    left: 25px;
    float: left;
}


label.field-name {
    font-size: 14px;
    letter-spacing: 0.39px;
    color: #333333;
    font-family: 'SansPro Bold';
}

input {
    height: 30px;
    border-radius: 2px;
}

.row-content {
    padding: 26px 35px 42px 35px;
}

.border-top {
    border-top: 1px solid #B8B8B8;
    margin: 0px;
}

.error-message .field-validation-error {
    background: #FEE9E9;
    border-radius: 2px;
    position: absolute;
    padding: 6px 0 5px 38px;
    width: 96%;
}

.error-message span {
    color: #2C2C2C;
    text-align: left;
    letter-spacing: 0px;
    color: #2C2C2C;
    opacity: 1;
    font-size: 15px;
}

.error-message img {
    margin: 0 1px 2px -10px;
}

#OrderNumber-error:before {
    content: url(/img/icon-alert.svg);
    padding-left: 10px;
    left: 7px;
    position: absolute;
    top: 7px;
}

.round {
    position: relative;
    border: 1px solid #B8B8B8;
    padding: 0px;
    width: 19px;
    height: 19px;
    border-radius: 5px;
}

    .round span {
        left: 40px;
        top: -4px;
    }

    .round input[type="checkbox"]:checked + label {
        background-color: #006EBF;
        border-color: #2B6EB9;
        width: 19px;
        top: -1px;
        height: 19px;
        left: -1px;
    }

    .round label {
        background-color: #FFF;
        border-radius: 5px;
        cursor: pointer;
        height: 17px;
        left: 0px;
        position: absolute;
        top: 0px;
        width: 17px;
    }

        .round label:after {
            border-color: #FFFFFF;
            top: 5px;
            left: 4px;
        }

.round-minor label:after {
    top: 6px;
}

.row-content-item {
    padding: 0px 0px 5px 10px;
}

.previous-returns-dropdownlist {
    height: 32px !important;
    border-color: lightgrey !important;
    outline: none;
}

    .previous-returns-dropdownlist:hover,
    .previous-returns-dropdownlist:active,
    .previous-returns-dropdownlist:focus,
    .previous-returns-dropdownlist:active:focus,
    .show > .previous-returns-dropdownlist.dropdown-toggle {
        color: #6c757d !important;
        background-color: #fff !important;
        border-color: lightgrey !important;
        outline: none !important;
        box-shadow: none !important;
    }

.previous-returns-dropdown-item {
    padding: 0px 7px 0px 7px;
}

    .previous-returns-dropdown-item:hover,
    .previous-returns-dropdown-item:focus {
        color: #212529;
        background-color: #fff;
    }



#package-section-image {
    content: url(/images/starshipit/measurement-guide.png);
    height: 132px;
    width: 143px;
}

#return-success-image {
    content: url(/images/starshipit/badge-confirmed.png);
    height: 40px;
    width: 40px;
}

.instruction-return-icon {
    text-align: center;
}

    .instruction-return-icon img {
        height: 74px;
        width: 74px;
    }

    .instruction-return-icon label {
        font-weight: 100;
    }

.field-info.summary-address {
    width: 280px;
}

.field-info.tracking-message {
    font-family: 'SansPro Bold';
    font-weight: 700;
}

    .field-info.tracking-message .order-number {
        color: #D40511;
    }

.font-weight-bold {
    font-family: 'SansPro Bold';
    font-weight: 700;
}

.valid-address-indicator.valid {
    color: #00652F;
    border: 1px solid #2A6335;
    border-radius: 2px;
    padding: 2px 7px;
    top: 6px;
    left: 5px;
    position: relative;
    font-family: 'SansPro Bold';
    text-transform: uppercase;
}

.valid-address-indicator.invalid {
    color: #00652F;
    border: 1px solid #EF2828;
    border-radius: 2px;
    padding: 2px 7px;
    top: 6px;
    left: 5px;
    position: relative;
    font-family: 'SansPro Bold';
    text-transform: uppercase;
}

.valid-address-indicator.invalid {
    color: #D40511;
}

.valid-address-indicator {
    font-size: 10px;
}

.field-info.summary-address span {
    margin-right: 0px;
}

.checkmark {
    border: 2px solid #B8B8B8;
}

.radio-container input:checked ~ .checkmark {
    background-color: #006EBF;
    border-color: #2B6EB9;
    border-radius: 5px;
}

.radio-container .checkmark:after {
    border-color: #FFFFFF;
}

.checkmark-small {
    border: 1px solid #B8B8B8;
}

.radio-container-small input:checked ~ .checkmark-small {
    background-color: #006EBF;
    border-color: #2B6EB9;
    border-radius: 5px;
}

.radio-container-small .checkmark-small:after {
    border-color: #FFFFFF;
}

.custom-footer-row {
    margin-bottom: 20px;
    display: block;
    text-align: center;
}

.footer-row {
    display: block;
    text-align: center;
}

.footer-copyright {
    color: #444444;
    font-size: 12px;
    padding-top: 1px;
}

a.copyright-name {
    color: #FF00C4;
    text-decoration: underline;
}

a.copyright-name {
    color: #178AFF;
}

.footer-nav {
    display: block;
    margin: 0;
    padding-left: 10px;
    list-style: none;
}

.footer-nav-item {
    display: inline-block;
    margin: 0;
    padding: 0 5px;
    font-size: .8em;
    line-height: 0.7em;
}

.footer-nav-item .footer-navlink {
    color: #178AFF;
    text-decoration: underline;
}

.footer {
    position:relative;
    width: 100%;
    white-space: nowrap;
    line-height: 34px;
    margin-left: -15px;
    border: none !important;
}
.back-button {
    border: 1px solid #333333;
    border-radius: 30px;
    background-color: transparent !important;
    color: #333333;
    padding: 10px 20px;
    font: normal normal bold 14px 'SansPro Bold';
    letter-spacing: 0.36px;
    text-transform: uppercase;
    opacity: 1;
    margin-bottom: 10px;
    margin-top: 0px;
    box-shadow: none;
}


@media (max-width: 768px) {
    .text-center-phone-size {
        text-align: center;
    }
}

/* Select order by Their Ref
    ----------------------------------------------------*/
.top-margin{
    margin-top: 10px;
}

.top-padding-10{
    padding-top: 10px!important;
}

.bottom-margin-10 {
    margin-bottom: 10px!important;
}

.bottom-padding-10 {
    padding-bottom: 10px!important;
}

.bottom-padding-20 {
    padding-bottom: 20px!important;
}

.btn-pos {
    margin-top: 20px;
    margin-right: 20px
}

.order-ref {
    color: #161616;
    font-size: 17px;
    font-family: 'SansPro Bold';
    padding-top: 20px;
    padding-left: 20px;
}

.order-details {
    color: #161616;
    font-size: 14px;
    font-family: 'SansPro Regular';
    padding-top: 20px;
    padding-left: 20px;
}

.order-row {
    border: 1px solid #B8B8B8;
    padding: 2px 5px;
    border-radius: 5px;
}