﻿

@keyframes rotation {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

body {
  font-family: var(--frmsc-identity-font);
}

.login-button { background-color: #72A2E2; font-size: 1rem; color: #ffffff; width: 100%; height: 50px; border-radius: 7px; box-shadow: none; border: none; padding: 15px }

.frmsc_account_banner_container
{
    padding-left: 25%;
    padding-top: 17%;

}

.account-container-font
{ 
    font-family: Helvetica Neue, Helvetica, Arial
}

.inner-containers 
{ 
    height: 100vh;
}

.account-controls-container
{
    color: black;
}

.account-gradient-circle {
    height: 35%;
    width: 35%;
    border-radius: 50%;
    position: absolute;
    top: 30%;
    background: linear-gradient( #99ccff 0%, #ebf2fb 0%);
    -webkit-filter: blur(20px);
    opacity: 1;
    left: 26%;
    z-index: -1;
}

.welcome-heading {
    font-weight:700;
    font-size: 0.8em
}

.account-form-container {
    display: block
}

.account-form {
    width: 100%;
}

.account-form-sub-heading {
    font-size: 0.6em;
}

.account-form-label {
    margin-bottom: 5px;
    font-size: 0.8rem;
}

.silver-border {
    border-color:#CFD6E6;
    border-radius: .4em;
}

.frmsc_login_banner {
height: 60%
}


.validationText {
    font-size:.8rem;
    color:red
}

.account-submit-button {
    width: 60%;
    background-color: #72A2E2;
    border-color: #72A2E2;
    font-size:0.8rem;
    color: #ffffff;
    height: 40px;
    border-radius: 7px;
    box-shadow: none;
    border: none;
}


.account-submit-button-container {
    display:flex;
    flex-direction:column;
    align-items:center
}

.validation-summary-errors ul {
    display: block;
    list-style-type: none;
    padding: 0;
}

.account-container {
    height: 100vh
}

.frmsc_logo {
    height: 150px;
    width: 150px;
    margin: 0 auto;
}

    .frmsc_logo img {
        max-width: 100%;
        max-height: 100%;
        display: block;
    }



.input-field {
    border: 1px solid #d6dbe8;
    border-radius: 7px;
    width: 100%;
    color: #222;
    font-size: 0.8em;
    padding: 13px;
}

    .input-field::placeholder {
        color: #d6dbe8;
        font-weight: 400;
    }

    .input-field::ms-input-placeholder {
        color: #d6dbe8;
    }


    .input-field:focus {
        outline: none;
        border: 3px solid #72A2E2;
        border-radius: 7px;
    }

.account-terms-and-conditions-container {display: flex; justify-content: center; align-items: center; height: 100%}
.account-terms-and-conditions-dialog { position: relative;  width: 41%; border-radius: 30px; background-color: white; box-shadow: 0px 2px 15px rgb(128 128 128 /75%) }

.account-terms-and-conditions-content { padding: 20px; padding-left: 20px; padding-bottom: 20px;  font-size: 1rem; }

.account-terms-and-conditions-dialog-close-btn { position: absolute; top: 5%; right: 3%;  border: none; font-size: 1.5rem; outline: none; background-color: white; color: grey; cursor: pointer }

.account-terms-and-conditions-dialog-overlay { z-index: 1000; height: 100vh; background-color: rgba(0, 0, 0, 0.3) !important; position: relative;}

.center-spinner-wrapper { position: absolute; top: 50%; left: 50%; display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 800; }

 .center-spinner{
   height:30px;
   width:30px;
   margin:0 auto;
   -webkit-animation: rotation .6s infinite linear;
   -moz-animation: rotation .6s infinite linear;
   -o-animation: rotation .6s infinite linear;
   animation: rotation .6s infinite linear;
   border-left:6px solid #B8CDF0;
   border-right:6px solid #B8CDF0;
   border-bottom:6px solid #B8CDF0;
   border-top:6px solid #72a2e2;
   border-radius:100%;
 }

.spinner-text { color: #B8CDF0; }

@media screen and (max-width:991px){
    .account-terms-and-conditions-dialog{
        width:85%;
        margin:15px;
        overflow:auto;
        height:600px;
        scrollbar-width:none;
    }
}