/* Absolute Center Spinner */
.loading {
    position: fixed;
    z-index: 999;
    height: 2em;
    width: 2em;
    overflow: visible;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

/* Transparent Overlay */
.loading:before {
    content: '';
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.3);
}

/* :not(:required) hides these rules from IE9 and below */
.loading:not(:required) {
    /* hide "loading..." text */
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0;
}

.loading:not(:required):after {
    content: '';
    display: block;
    font-size: 10px;
    width: 1em;
    height: 1em;
    margin-top: -0.5em;
    -webkit-animation: spinner 1500ms infinite linear;
    -moz-animation: spinner 1500ms infinite linear;
    -ms-animation: spinner 1500ms infinite linear;
    -o-animation: spinner 1500ms infinite linear;
    animation: spinner 1500ms infinite linear;
    border-radius: 0.5em;
    -webkit-box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
    box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) -1.5em 0 0 0, rgba(0, 0, 0, 0.75) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
}

/* Animation */

@-webkit-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-moz-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-o-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}




.sign_feild {
    width: 215px;
    padding: 0px 35px 0 10px;
    height: 40px;
    border: 1px solid #fff;
    border-radius: 5px;
    margin: 0 3px;
    font-size: 14px;
}

.input-block-level {
    display: block;
    width: 100%;
    min-height: 28px;        // Make inputs at least the height of their button counterpart
.box-sizing(border-box); // Makes inputs behave like true block-level elements
}


.flexBreak {
    margin: auto;
}

.sign-up-linksIphone {
    display: none;
}

#join-title {
    font-size: 32px;
    font-weight: bold;
    font-family: 'HelveticaNeueBD' !important;
}
#join-popup * {
    outline: none;
    -webkit-overflow-scrolling: touch;
}
#join-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1000;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0.3s, opacity 0.1s; }
#join-popup[aria-hidden=false] {
    opacity: 1;
    visibility: visible; }
#join-popup[aria-hidden=false] .join-body {
    transform: translateY(0); }
#join-popup .join-wrapper {
    display: flex;
    align-items: center;
    margin: -25px 0;
    min-height: 100%;
    /*min-height: calc(100% - 102px);*/
}
#join-popup .join-close {
    position: absolute;
    top: 30px;
    z-index: 1000;
    right: 0; }
#join-popup .join-close button {
    padding: 16px;
    margin: 0;
    border: 0;
    background: transparent; }
#join-popup .join-close button svg {
    fill: white;
    width: 16px;
    height: 16px; }
#join-popup .join-body {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    background: white;
    margin: 0 auto;
    width: 100%;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12);
    padding: 32px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: top;
    justify-content: center;
    position: relative; }
#join-popup .join-body:before {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 400px;
    height: 366px;
    max-width: 100%;
    max-height: 100%;
    background: url("/express/compute/img/Illustration.svg") no-repeat; }
@media (min-width: 576px) {
    #join-popup .separator {
        margin: 42px 0 32px;
    }
    #join-popup .join-body {
        width: 530px;
    }
}

@media (max-width: 576px) {
    #join-popup .join-close { top: 10px !important; }
    #join-popup .join-close button svg { fill: black !important; }
}

@media only screen and (max-width: 1200px) and (min-width: 160px) {
    /*@media (max-width: 1200px) {*/

    /*.sign-up-links, .sign-up-linksIphone {
        display: none !important;
    }*/
    .sign-up-linksIphone { display: flex !important;
        flex-basis: 360px !important;
        width: 100% !important;
        max-width: 360px;
        justify-content: center !important;
    }
    #join-popup .join-body {
        align-items: center;
    }


    #join-popup .join-body { padding-top: 0px !important; }
    #join-popup { max-height: 100% !important; }
    #join-popup .separator { margin-top: 40px !important; margin-bottom: 0px !important; }
    /*#join-popup .form .join-input input, #join-popup .form .join-input label { height: 48px !important; }*/
    .sign-up-links { display: none !important; }

    .flexBreak { padding: 22px 0 22px 0 !important; max-width: 360px !important; }
    #join-popup .sign-up-linksIphone a:first-of-type { margin-left: 0px; }
    #join-popup .sign-up-linksIphone a:last-of-type { margin-right: 0px; }
    /*.btn_submit_new { height: 40px !important; }*/
    #join-popup .form .terms { font-size: 15px !important; }

    #join-popup .join-wrapper {
        min-height: auto;
        margin-top: 0px !important;
    }

    #join-popup .sign-up-linksIphone a {
        width: 28% !important;
        background: white;
        display: flex;
        height: 58px;
        align-items: center;
        justify-content: left;
        text-decoration: none;
        font-size: 16px;
        border-radius: 3px;
        margin: 0 10px 24px 10px;
        border: 2px solid #167EE6;
        color: #167EE6 !important;
    }



    #join-popup .sign-up-linksIphone a svg {
        display: inline-block;
        min-width: 20px;
        height: 20px;
    }
    #join-popup .sign-up-linksIphone a.facebook {
        border-color: #475993;
        color: #55659B; }
    #join-popup .sign-up-linksIphone a.github {
        color: black;
        border-color: black; }
}


@media only screen and (max-width: 1200px) and (min-width: 300px) {

    #join-popup .join-wrapper {
        min-height: auto;
        margin-top: 45px;
    }

    #join-popup .sign-up-links a {
        padding-left: 20% !important; }

    #join-popup .separator {
        margin-top: 30px !important;
    }
}

@media (min-width: 768px) {
    #join-popup .separator {
        margin: 42px 0 32px;
    }
}
@media (min-width: 1200px) {
    #join-popup .join-body {
        width: 1112px;
        min-height: 595px;
    }
}
#join-popup .form, #join-popup .separator, #join-popup .sign-up-links {
    position: relative;
    z-index: 1; }
#join-popup .form {
    width: 100%;
    max-width: 360px; }
#join-popup .title {
    color: #1a1a1a;
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 9px; }
@media (min-width: 768px) {
    #join-popup .title {
        font-size: 32px; } }
#join-popup .subtitle {
    font-weight: 400;
    font-size: 16px;
    color: #6D7278;
    margin-bottom: 25px; }
#join-popup .form .join-input {
    position: relative;
    margin-bottom: 24px; }
#join-popup .form .join-input input, #join-popup .form .join-input label {
    height: 58px; }
#join-popup .form .join-input input::-webkit-input-placeholder {
    color: transparent; }
#join-popup .form .join-input input:-ms-input-placeholder {
    color: transparent; }
#join-popup .form .join-input input::-ms-input-placeholder {
    color: transparent; }
#join-popup .form .join-input input::-moz-placeholder {
    color: transparent; }
#join-popup .form .join-input input::placeholder {
    color: transparent; }
#join-popup .form .join-input input {
    padding: 0 20px;
    border: 2px solid #e8e8e8;
    border-radius: 3px;
    width: 99%;
    font-size: 16px;
    color: #1a1a1a; }
#join-popup .form .join-input label {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    font-size: 16px;
    color: #999;
    display: inline-flex;
    align-items: center;
    transition: width 0.2s, height 0.2s, transform 0.2s, background 0.2s, font-size 0.2s;
    margin: 0 18px;
    padding: 0 6px; }
#join-popup .form .join-input input:focus + label, #join-popup .form .join-input input:not(:placeholder-shown) + label {
    height: 18px;
    font-size: 14px;
    transform: translateY(-50%);
    background: white; }
#join-popup .form .join-input.show-feedback input {
    padding-right: 50px; }
#join-popup .form .join-input.show-feedback:after {
    content: "";
    position: absolute;
    top: 19px;
    right: 16px;
    width: 20px;
    height: 20px;
    background: url("/express/compute/img/validateX.svg") no-repeat;
    /*
    border: 4px solid white;
    border-radius: 50%;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 47.971 47.971' fill='%23bf1717'%3E%3Cpath d='M28.228,23.986L47.092,5.122c1.172-1.171,1.172-3.071,0-4.242c-1.172-1.172-3.07-1.172-4.242,0L23.986,19.744L5.121,0.88 c-1.172-1.172-3.07-1.172-4.242,0c-1.172,1.171-1.172,3.071,0,4.242l18.865,18.864L0.879,42.85c-1.172,1.171-1.172,3.071,0,4.242 C1.465,47.677,2.233,47.97,3,47.97s1.535-0.293,2.121-0.879l18.865-18.864L42.85,47.091c0.586,0.586,1.354,0.879,2.121,0.879 s1.535-0.293,2.121-0.879c1.172-1.171,1.172-3.071,0-4.242L28.228,23.986z'/%3E%3C/svg%3E") no-repeat;
    box-shadow: 0 0 0 2px #bf1717;
     */
}
#join-popup .form .join-input.show-feedback.feedback-success:after {
    /*box-shadow: 0 0 0 2px #52b12a;*/
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14px' height='14px' viewBox='0 0 97.619 97.618' fill='%2352b12a'%3E%3Cpath d='M96.939,17.358L83.968,5.959c-0.398-0.352-0.927-0.531-1.449-0.494C81.99,5.5,81.496,5.743,81.146,6.142L34.1,59.688 L17.372,37.547c-0.319-0.422-0.794-0.701-1.319-0.773c-0.524-0.078-1.059,0.064-1.481,0.385L0.794,47.567 c-0.881,0.666-1.056,1.92-0.39,2.801l30.974,40.996c0.362,0.479,0.922,0.771,1.522,0.793c0.024,0,0.049,0,0.073,0 c0.574,0,1.122-0.246,1.503-0.68l62.644-71.297C97.85,19.351,97.769,18.086,96.939,17.358z'/%3E%3C/svg%3E");
    background-size: 14px 14px;
    background-position: center center;
    background: url("/express/compute/img/validateV.svg") no-repeat;
}
#join-popup .form .submit {
    margin-bottom: 24px;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #FB9517;
    font-size: 18px;
    color: white;
    transition: background-color 0.25s; }
#join-popup .form .submit:hover, #join-popup .form .submit:focus {
    background-color: #dc7c05; }
#join-popup .form .terms {
    font-size: 16px;
    color: #a6a6a6; }
#join-popup .form .terms a {
    color: #0091ff !important;
    text-decoration: none; }
#join-popup .form .terms a:hover, #join-popup .form .terms a:focus {
    text-decoration: underline; }
#join-popup .separator {
    width: 100%;
    max-width: 360px;
    margin: 0px 0 32px;
    text-align: center; }
#join-popup .separator:before {
    height: 1px;
    background: #EEE;
    width: 100%;
    content: "";
    display: block; }
#join-popup .separator span {
    display: inline-block;
    padding: 4px;
    font-size: 16px;
    color: #6c6c6c;
    background: white;
    transform: translateY(-50%); }
#join-popup .sign-up-links {
    width: 100%;
    max-width: 360px; }
#join-popup .sign-up-links a {
    background: white;
    display: flex;
    height: 58px;
    align-items: center;
    justify-content: left;
    text-decoration: none;
    font-size: 16px;
    border-radius: 3px;
    margin-bottom: 24px;
    border: 2px solid #167EE6;
    padding-left: 80px;
    color: #167EE6 !important; }
#join-popup .sign-up-links a svg {
    display: inline-block;
    flex-basis: 20px;
    min-width: 20px;
    height: 20px;
    margin-right: 13px; }
#join-popup .sign-up-links a.facebook {
    border-color: #475993;
    color: #55659B; }
#join-popup .sign-up-links a.github {
    color: black;
    border-color: black; }
#join-popup .sign-up-links a:last-child {
    margin-bottom: 0; }
#join-popup .sign-up-links a:hover, #join-popup .sign-up-links a:focus {
    font-weight: 600; }
@media (min-width: 1200px) {
    #join-popup .join-body {
        flex-direction: row; }
    #join-popup .form, #join-popup .sign-up-links {
        flex-basis: 360px;
        min-width: 360px;
        width: initial; }
    #join-popup .separator {
        height: 225px;
        width: 154px;
        flex-basis: 154px;
        min-width: 154px;
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center; }
    #join-popup .separator:before, #join-popup .separator:after {
        width: 2px;
        height: 117px; }
    #join-popup .separator:after {
        content: "";
        background: #EEE;
        display: block; }
    #join-popup .separator span {
        transform: initial; } }


.flexBreak {
    flex-basis: 100%;
    width: 100%;
    max-width: 100%;
    padding: 30px 0 0 90px;
}

.btn_submit_new {
    width: 100%;
    color: #fff;
    font-size: 20px;
    height: 51px;
    background-color: #fb9516;
    border-width: 0px;
    position: relative;
    margin-top: 6px;
    padding: 0px;
}