﻿@font-face {
    font-family: 'Transcend Regular';
    src: url('/fonts/Transcend-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Lato Light';
    src: url('/fonts/Lato-Light.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/*.topheader{
    width: 100%;
    background-color:green;*/ /*black;*/
/*}

.topheader-container{
    background-image: url(/images/topheaderbg_gold.png);
    background-position: 45% center;
    background-repeat: no-repeat;
    background-size: contain;
    margin-left: auto;
    margin-right: auto;*/
/*max-width: 1200px;*/
/*}*/

.loading {
    position: absolute;
    top: 35%;
    left: 40%;
    margin: 0px;
    text-align: center;
    z-index: 1000;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}

img.logo {
    width: /*170px*/ 200px;
    max-width: 200px;
    filter: invert(1) brightness(2);
}

img.logo-1 {
    display: block;
    margin-right: auto;
    margin-left: auto;
}

.logo-container {
    width: 200px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
}

.heading-1 {
    min-height: 50px;
    padding-left: 0px;
    padding-right: 0px;
    float: left;
    margin: 0;
    line-height: 1.7em;
    direction: ltr;
    display: inline-block;
    font: Transcend Regular;
}

.col-center {
    margin: 0 auto;
    float: none;
}

.apply-now {
    height: auto;
    margin: 5px auto !important;
    text-align: center;
    font-size: 20px !important;
    vertical-align: central;
    background-color: #FDF8E4 !important;
    color: #F2AE43 !important;
}

.app-message {
    width: 100%;
    padding: 20px 0px 20px 0px;
    margin-left: 0px;
}

.mtop-15 {
    margin-top: 15px;
}

.floatL {
    float: left;
}

.full-row {
    width: 100%;
    margin-left: 0px !important;
}

@media screen and (max-width: 821px) {
    .topheader {
        width: 100%;
    }

    .topheader-container {
        max-width: 600px;
        margin-left: auto;
        margin-right: auto;
    }

    img.logo {
        max-width: 200px;
    }

    .logo-container {
        width: 200px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 15px;
    }
}

@media screen and (max-width: 420px) {
    .topheader-container {
        width: 300px;
    }

    .logo-container {
        margin-top: 15px;
    }

    .small-full {
        width: 100% !important;
    }

    .small-sign-in-btn {
        width: 100% !important;
        margin: 10px 0px 0px 0px !important;
    }

    .sm-btn-2 {
        font-size: 10px;
    }
}

@media screen and (max-width: 767px) {
    .medium-applynow {
        width: 100%;
    }

    .btn-placeholder {
        height: 0px !important;
    }

    .h4, h4 {
        font-size: 20px;
    }
    /*    
*/
}

@media screen and (min-width: 768px) {
    .large-applynow {
        width: 500px;
    }

    .h4, h4 {
        font-size: 28px;
    }
    /*.h4, h4 { font-size: 28px; }
.col-md-5 { flex: 0 0 auto; width: 41.666666667%; }*/
}

@media screen and (max-width: 1200px) {
    .bill-padding {
        padding-left: 0px !important;
    }
}

.most-content {
    box-sizing: inherit;
    /*background-image: url(/images/bg.png);
    background-repeat: repeat;
    background-position-y: 50%;*/
    background-color: #FFFFFF;
    /*min-height: -webkit-calc(100% - 100px);*/ /*-webkit-calc(100% - 100px);*/ /* Chrome */
    /*min-height: -moz-calc(100% - 100px);*/
    /* -moz-calc(100% - 100px);*/ /* Firefox */
    /*min-height: calc(115% - 100px);*/ /*calc(115% - 100px);*/ /* native */
    /*padding-bottom: 5%;*/
}

h1.heading-2 {
    color: white;
    float: none;
    font-size: 2.3em;
    line-height: 1.3em;
    margin-bottom: 0;
    padding-top: 30px;
    text-align: center;
    width: auto;
}

/*h1{
    font-family: 'Alegreya SC', serif;
}*/

h1.heading-3, div.heading-3 {
    font-weight: bold;
    color: white;
    float: none;
    font-size: /*1.2*/ 1.3em;
    line-height: 1.3em;
    margin-bottom: 0;
    margin-top: 0;
    padding-bottom: 0;
    padding-top: /* 0*/ 18px;
    text-align: left;
    width: auto;
}

h3.footer-1 {
    font-weight: bold;
    color: white;
    float: none;
    font-size: /*1.2*/ 1.3em;
    line-height: 1.3em;
    margin-bottom: 0;
    margin-top: 0;
    padding-bottom: 0;
    padding-top: /* 0*/ 26px;
    text-align: left;
    width: auto;
}
/* Footer */
#footer_body {
    font-size: 20px;
    padding-bottom: 10px;
}

.desktopphone {
    display: block;
}
 
.likebody {
    font-family: 'Lato Light', sans-serif;
    background-color: #FFFFFF;
    color: #5D685F;  
    align-items: center;
    padding: 0;
}

.container {
    background-color: white;
    float: none;
    padding: 0 0 40px 0;
    margin: 0px auto;
    align-self: center;
}
.wrapper {
    background-color: #FFFFFF;
    margin: 0 auto;
    max-width: 100%; /* Set the max width of the content area */
    box-shadow: none;
}
.flex-button {
    margin: 10px 0px;
    width: 100%;
    background-color: #5D685F /*#eda200*/; 
    color: white;
    /*color:*/ /*#0000ff*/ /*green;*/ /*#65b3fa;*/
    display: inline-block;
    font-weight: 400;
    font-size: 1em;
    font-weight: normal;
    border: 1px solid #b9b5b5;
    border-radius: 30px;
}

.flex-form {
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
}

.login-heading {
    color: white;
    text-align: center;
    background-color: black;
}

.pay-label {
    font-family: 'Transcend Regular',sans-serif;
    color: #5D685F /*#0000ff*/;
}

.pay-comp {
    margin: 0px;
    overflow-wrap: normal;
    /*padding:10px;*/
    padding: 0px;
}

.modal {
    width: fitcontent;
    height: fit-content;
    float: none;
    margin: auto;
    z-index: 9999;
    background: transparent;
    border-color: transparent;
    box-shadow: transparent;
    box-shadow: 0px;
    border: 0 hidden transparent;
}

.container-create {
    padding: 20px 20px 35px 20px;
    background-color: white;
    float: none;
}

.container-create-item-top {
    margin-top: 35px;
    margin-left: auto;
    margin-right: auto;
    padding: 5px;
    /*background-color: lightgray;
    border-radius: 5px;
    border: 0.1em solid lightgray;
    box-shadow: 0 1.5px 0 0 rgba(0,0,0,0.1);*/
    float: none;
}

.container-create-item-mid {
    align-self: center;
    margin: 5px;
}

.container-create-item-menu {
    margin-left: 56%;
    margin-bottom: 5px;
    margin-top: -20px;
    align-self: flex-start;
}

.container-create-item-bottom {
    align-self: center;
    margin: 5px;
}

.temp-login-heading {
    color: white;
    background-color: #073363;
    float: none;
    text-align: center;
}

.temp2-login-heading {
    color: white;
    padding-left: 28%;
    padding-right: 28%;
    background-color: #073363;
}

.change-login-container {
}

.change-login-header {
    margin: 200px;
}

.change-login-radio {
    margin-left: 50px;
}

.change-login-enter-det {
    margin: 10px 25px;
    padding: 25px;
    border: 0.1em solid lightgray;
    background-color: #FAFFFF;
    border-radius: 5px;
    box-shadow: 0 1.5px 0 0 rgba(0,0,0,0.1);
}

.change-login-buttons {
}

.container-validate {
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    flex: none;
    border-width: 1px;
    border-style: solid;
    border-radius: 3px;
    box-shadow: 0 1.5px 0 0 rgba(0,0,0,0.1);
    background-color: white;
    padding: 35px;
}

.container-validate-default {
    width: 70%;
    border-color: lightgray !important;
    border-width: 0.25em;
}

.container-validate-expired {
    width: 70%;
    border-color: darkred !important;
    border-width: 0.25em;
}

.container-validate-success {
    width: 70%;
    border-color: limegreen !important;
    border-width: 0.25em;
}

.flex-item-validate {
    align-self: center;
}

ol.progtrckr {
    display: table;
    list-style-type: none;
    margin: 0;
    padding: 0;
    table-layout: fixed;
    width: 100%;
}

    ol.progtrckr li {
        /*display: table-cell;*/
        text-align: center;
        line-height: 3em;
    }

ol.ptrack[data-progtrckr-steps="2"] li {
    width: 49%;
}

ol.ptrack[data-progtrckr-steps="3"] li {
    width: 33%;
}

ol.ptrack[data-progtrckr-steps="4"] li {
    width: 24%;
}

ol.ptrack[data-progtrckr-steps="5"] li {
    width: 19%;
}

ol.ptrack[data-progtrckr-steps="6"] li {
    width: 16%;
}

ol.ptrack[data-progtrckr-steps="7"] li {
    width: 14%;
}

ol.ptrack[data-progtrckr-steps="8"] li {
    width: 12%;
}

ol.ptrack[data-progtrckr-steps="9"] li {
    width: 11%;
}

ol.progtrckr li.progtrckr-done {
    color: black;
    border-bottom: 4px solid black /*#0000ff*/;
}

ol.progtrckr li.progtrckr-todo {
    color: silver;
    border-bottom: 4px solid silver;
}

ol.progtrckr li.progtrckr-todo2 {
    color: silver;
}

ol.progtrckr li.progtrckr-active {
    color: black;
    border-bottom: 4px solid black;
}

ol.progtrckr li.progtrckr-active2 {
    color: black;
}

ol.progtrckr li:after {
    content: "\00a0\00a0";
}

ol.progtrckr li:before {
    position: relative;
    bottom: -2.5em;
    float: left;
    left: 50%;
    line-height: 1em;
}

ol.progtrckr li.progtrckr-done:before {
    content: "\2713";
    color: white;
    background-color: /*#0000ff*/ black;
    height: 1.2em;
    width: 1.2em;
    line-height: 1.2em;
    border: none;
    border-radius: 1.2em;
}

ol.progtrckr li.progtrckr-todo:before {
    content: "\039F";
    color: silver;
    background-color: white;
    font-size: 1.5em;
    bottom: -1.6em;
}

ol.progtrckr li.progtrckr-active:before {
    content: "\039F";
    color: black;
    background-color: white;
    font-size: 1.5em;
    bottom: -1.6em;
}

a {
    color: #000000 !important;
}

    a:hover {
        color: #5D685F !important;
    }

.ui.primary.button, .ui.primary.buttons .button {
    border: 1px solid #b9b5b5;
    color: white;
    font-family: 'Transcend Regular', sans-serif;
    font-weight: lighter;
    padding: 10px 20px;
    background-color: #5d685f !important;
    border-radius: 30px;
}

    .ui.primary.button:hover, .ui.primary.buttons .button:hover .ui.primary.buttons .button:active {
        background-color: #000000 !important /*#5d685f !important*/;
    }

.ui.secondary.button, .ui.secondary.buttons .button {
    background-color: #5d685f !important;
   border-radius: 10px;
}

.ui.active.button:active, .ui.button:active {
    background-color: #000000 !important;
}

.btn.focus, .btn:focus, .btn:hover {
    /*color :green !important;*/
    color: white;
    background-color: #000000 !important;
}

.btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {
    /*outline-color: green !important; */
}

.ui.header .content {
    font-family: 'Transcend Regular', sans-serif;
    font-weight: normal;
    color: #5D685F;
    font-size: 16px;
}

.form-control:focus {
    border-color: black /*green*/;
    outline: 0;
    box-shadow: unset;
}

.ui.form .field > label {
    color: black /*green*/;
}

.label {
    font-family: Lato Light
}

.ui.form input:not([type]):focus, .ui.form input[type=text]:focus, .ui.form input[type=email]:focus, .ui.form input[type=search]:focus, .ui.form input[type=password]:focus, .ui.form input[type=date]:focus, .ui.form input[type=datetime-local]:focus, .ui.form input[type=tel]:focus, .ui.form input[type=time]:focus, .ui.form input[type=url]:focus, .ui.form input[type=number]:focus {
    border-color: black;
}
/* Reset autofill styles */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    -ms-appearance: none !important;
    background-color: #fff !important;
    color: #000 !important;
    background-image: none !important;
    transition: background-color 5000s ease-in-out 0s;
    box-shadow: 0 0 1px 1px #B5C0B3 inset !important;
    font-family: 'Lato Light',sans-serif;
}
.terms {
    padding: 2%;
    padding-top: 3%;
    background-color: white;
    color: black;
}

.ui-state-hover {
    color: #444 !important;
    cursor: pointer !important;
}

.confirm {
    display: inline-block;
    width: 49%;
    vertical-align: top;
}

.section {
    width: 77%;
    padding-left: 6px;
    font-weight: bold;
    font-size: 16px;
    border-bottom-color: darkgray;
    border-bottom-style: solid;
    border-bottom-width: 2px;
}
 