body {
    background-color: #fff;/*#2c5364;*/
    background-size: 100%;
}
body.preload {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
}

.response {
    display: none;
}

.defaultTemplate,
.configuration.center {
    display: flex;
    justify-content: center;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
.defaultTemplate.medium, .configuration.center.medium { width: 600px; }

.defaultTemplate .form,
.configuration form {
    align-self: center;
    position: relative;
    z-index: 1;
    background: #fff;
    max-width: 360px;
    padding: 2rem  2.8125rem;
    text-align: center;
    -webkit-box-shadow: var(--fc-card-shadow);
    -moz-box-shadow: var(--fc-card-shadow);
    box-shadow: var(--fc-card-shadow);
    border-radius: var(--fc-border-radius);
    border: 1px solid var(--fc-card-border-color);
}
.defaultTemplate.medium .form { max-width: 600px; }
.defaultTemplate .form.small-padding-bottom {
    padding-bottom: 20px;
}
.defaultTemplate .form .input-group-text {
    display: flex;
    align-items: center;
    padding: 0.375rem 0.75rem;
    margin-bottom: 15px;
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    text-align: center;
    white-space: nowrap;
    background-color: #e9ecef;
    border: 1px solid #6c6c6c;
    border-radius: 0;
}
.defaultTemplate .form input.password-field {
    position: relative;
    flex: 1 1 0%;
    min-width: 0;
}
.defaultTemplate .form .alert{
    border-radius: 0;
}
.defaultTemplate .form input {
    font-family: 'Open Sans', sans-serif;
    outline: 0;
    width: 100%;
    margin: 0 0 15px;
    padding: 15px;
    box-sizing: border-box;
    font-size: 14px;

    height: calc(1.5em + 1.5rem + 2px);

    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid var(--fc-border-color);
    border-radius: var(--fc-border-radius);
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.defaultTemplate .form input:focus {
    background-color: #fff;
    border-color: #007db3;
    outline: 0;
    box-shadow: none;
}
.defaultTemplate .form input:hover {
    -webkit-box-shadow: 0 1px 4px 0 rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 4px 0 rgba(0,0,0,.2);
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.2);
}
.defaultTemplate .form button,
.defaultTemplate .form a.button {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    text-transform: uppercase;
    outline: 0;
    background-color: #009fe3;
    border: 0;
    padding: 10px;
    color: #FFFFFF;
    width: 200px;
    cursor: pointer;
    margin: 5px;
    border-radius: var(--fc-border-radius);
}

.defaultTemplate .form button:hover,
.defaultTemplate .form a.button:hover {
    background-color: #007bb0;
}

.defaultTemplate .form a.button { display: inline-block; }
.defaultTemplate .form button.next {
    width: 100px;
    padding: 8px;
    font-size: 90%;
    margin-right: -15px;
}

.defaultTemplate button span,
.defaultTemplate a.button span {
    font-family: 'Open Sans', sans-serif;
    cursor: pointer;
    display: inline-block;
    position: relative;
    transition: 0.5s;
}
.defaultTemplate button span.small,
.defaultTemplate a.button span.small {
    font-size: 70%;
}
div[data-gjs-type="wrapper"] .defaultTemplate button span {
    font-size: 10px;
}

.defaultTemplate button:not(.inverse) span:after,
.defaultTemplate a.button:not(.inverse) span:after {
    content: '\00bb';
    position: absolute;
    opacity: 0;
    top: 0;
    right: -20px;
    transition: 0.5s;
}
.defaultTemplate button:hover:not(.inverse) span,
.defaultTemplate a.button:hover:not(.inverse) span {
    padding-right: 25px;
}
.defaultTemplate button:hover:not(.inverse) span:after,
.defaultTemplate a.button:hover:not(.inverse) span:after {
    opacity: 1;
    right: 0;
}

.defaultTemplate button.inverse span:before,
.defaultTemplate a.button.inverse span:before {
    content: '\00ab';
    position: absolute;
    opacity: 0;
    top: 0;
    left: -20px;
    transition: 0.5s;
}
.defaultTemplate  button.inverse:hover span,
.defaultTemplate  a.button.inverse:hover span {
    padding-left: 25px;
}
.defaultTemplate button.inverse:hover span:before,
.defaultTemplate a.button.inverse:hover span:before {
    opacity: 1;
    left: 0;
}

.defaultTemplate button[type="submit"].disabled {
    background-color: #a6a6a6;
}

.defaultTemplate .form .message {
    font-family: 'Open Sans', sans-serif;
    margin: 15px 0 0;
    color: #b3b3b3;
    font-size: 12px;
}
.defaultTemplate .form .message a {
    font-family: 'Open Sans', sans-serif;
    color: #009fe3;
    text-decoration: none;
}
.defaultTemplate .form .message a:hover {
    color: #0084bd;
}
.logo {
    margin-bottom: 10px;
    width:270px!important;
}
.logo.center { margin-left: auto; }
.defaultTemplate .response {
    font-size: 14px;
    font-weight: bold;
    padding-left: 4px;
    text-align: left;
    margin-bottom: 10px;
}
.defaultTemplate .response.danger {
    border-left: 3px solid #b30000;
    color: #b30000;
}
.defaultTemplate .response.success {
    border-left: 3px solid #00b356;
    color: #00b356;
}
.defaultTemplate .response.info {
    border-left: 3px solid #009fe3;
    color: #009fe3;
}
.defaultTemplate .response.warning {
    border-left: 3px solid #b38f00;
    color: #b38f00;
}
.defaultTemplate .response.visible {
    display: inherit;
}
.defaultTemplate .goToMain {
    margin-top: 10px;
}

.defaultTemplate .color-red {
    color: #b30000;
}
.defaultTemplate .color-blue {
    color: #009fe3;
}

.stacked {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;

    padding-top: 10px;
    border-top: 1px solid rgba(0,0,0,.1);
}
.defaultTemplate.medium .stacked { width: 540px; }

.stacked .authentication-icon {
    width: 32px;
    font-size: 200%;
    margin-right: 10px;
    color: #009fe3;
}

.stacked .authentication-icon.bigger-icon {
    font-size: 300%;
}

.row .stacked:last-child {
    padding-bottom: 5px;
    border-bottom: 1px solid rgba(0,0,0,.1);
    margin-bottom: 20px;
}

.stacked label {
    -ms-flex: 1;
    flex: 1;
    text-align: left;
    font-size: 90%;
}

.authentication-type {
    display: block;
    margin-top: 0!important;
    margin-bottom: .25rem!important;
    font-size: 95%;
    font-weight: bold;
}

.stacked input[type=radio] {
    width: 50px;
    margin: auto 0;
}

.stacked .authentication-icon {

}

.stacked label span {
    text-align: left;
}

.configuration .well {
    margin: 10px 0;
    padding: 10px;
    border-radius: 3px 3px 3px 3px;
    text-align: left;
    border: 0;
    border-left: 3px solid #009fe3;
    /*color: #009fe3;*/
    color: #555;
    background-color: transparent;

    -moz-box-shadow:    1px 1px 3px rgba(0,0,0, 0.5);
    -webkit-box-shadow: 1px 1px 3px rgba(0,0,0, 0.5);
    box-shadow: 1px 1px 3px rgba(0,0,0, 0.5);
}

.configuration .well i {
    color: #009fe3;
}

.configuration .formgenerator button,
.configuration .formgenerator a.button {
    font-family: 'Open Sans', sans-serif;
    text-transform: uppercase;
    outline: 0;
    background: #009fe3;
    border: 0;
    padding: 13px;
    color: #FFFFFF;
    width: auto;
    cursor: pointer;
    margin: 5px;
    display: inline-block;
}

.configuration .formgenerator button:hover,
.configuration .formgenerator a.button:hover,
.configuration .formgenerator button:focus,
.configuration .formgenerator a.button:focus {
    background-color: #007bb0;
}

.configuration .formgenerator button img,
.configuration .formgenerator a.button img {
    display: none;
}

.input-error {
    display: none;
    text-align: left;
    color: #b30000;
    margin-top: -10px;
}

@media only screen and (max-width: 700px) {
    .defaultTemplate.medium, .configuration.center.medium { width: 360px; }
    .defaultTemplate.medium .form, .configuration form { max-width: 360px;}
    .defaultTemplate.medium .stacked { width: auto; }

    .configuration .formgenerator button,
    .configuration .formgenerator a.button {
        text-align: center;
        width: 100%;
        display: block;
    }
}
.multiple-input-field {
    width: 100%;
    display: flex;
}
.multiple-input-field input {
    width: 35px;
    font-weight: bold;
    height: 35px;
}
.multiple-input-field input:focus {
    border-color: #009fe3 !important;
    box-shadow: 0 0 5px 1px #009fe3 !important;
}