@import url('//db.onlinewebfonts.com/c/1e16b363a6dabda72a084d971738be58?family=SF+Compact+Text');
.loginpage{
    font-family: "SF Compact Text";
}



#logo {
    width: 30%;
    height: 6%;
    margin: 3vh 0 1vh 0;
}

.BC {
    background-color: #384C6D;
    color: white;
    font-size: 15.5px;
    min-height: 100vh;
    padding: 10px;
}

.BC h6 {
    font-size: 17px;
    text-decoration: underline;
    margin: 1vh 0 0 0;
}

.fc {
    background-color: #8BB6AE;
    min-height: 100vh;
}

.fc .mt {
    margin-top: 10vh;
}

@media screen and (max-width:1400px) {
    .fc .mt {
        margin-top: 15vh;
    }
}

.fc p {
    color: #FFFFFF;
    text-align: center;
    font-size: 23px;
    font-weight: 400;
    font-family: "SF Compact Text";
    margin: 0;
}

.w3-content .w3-display-container {
    border-radius: 10px;
    opacity: 1;
    min-height: 67vh;
    padding: 20px;
    margin: 6vh 30px 2vh 30px;
    text-align: center;
}

.w3-content .intro1 {
    background-color: #fafaed;
    border-radius: 55px;
}

.w3-content .intro {
    background-color: #fafaed;
    opacity: 1;
    min-height: 62vh;
    padding: 20px;
    /* margin:6vh 30px 2vh 30px ; */
    text-align: center;
}

.w3-content .intro {
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='35' ry='35' stroke='%23DCAA64FF' stroke-width='8' stroke-dasharray='23' stroke-dashoffset='0' stroke-linecap='butt'/%3e%3c/svg%3e");
    border-radius: 36px;
}

.w3-content .intro h2 {
    color: #8B272F;
    /* margin-bottom: 5rem; */
    font-size: 26px;
    text-shadow: 0 1px #daa3a8;
    font-weight: 400;
    opacity: 2;
}

.goal,.training  p {
   margin-top: 13vh;
}
.tobj p {
    margin-top: 10vh;
}
 
.w3-content .intro p {
    color: #8B272F;
    line-height: 2;
    text-shadow: 0 1px #daa3a8;
    font-size: 17px;
    text-align: center;
    padding: 0px 50px 15px 50px;
}

 

.w3-display-left img {
    height: 7vh;
    /* margin-left: 30px; */
}

.w3-display-right img {
    height: 7vh;
    /* margin-right: 30px; */
}
 
.indexlra:focus{
    box-shadow:none;
     outline: none;
}
.indexlra {
    color: #78a9da!important;
    margin: 0 50px 0 50px;
 
}


.dots {
    position: relative;
    top: -9%;
    opacity: 1;
}

.dot {
    cursor: pointer;
    height: 12px;
    width: 12px;
    background-color: #c5aaab;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}

.active1,
.dot:hover {
    background-color: #8B272F;
}

.active,
.dot:hover {
    background-color: #0000002E;
}

@media screen and (max-width:600px) {
    .dots {
        position: relative;
        top: -7%;
        opacity: 1;
    } 
    
}
@media screen and (max-width:500px) {
    .dots {
        position: relative;
        top: -5%;
        opacity: 1;
    } 
    
}


/* ============================================================================================================================================= */

.Login {
    transform: translate(0%, 20%);
}

.Login h6 {
    color: #7b7c83;
    text-align: center;
    margin-bottom: 5vh;
    font-size: 18px;
    font-family: "SF Compact Text";
    font-weight: 600;
}

#logo1 {
    width: 16rem;
    height: 4rem;
    text-align: center;
}
#logo2{
    width: 16rem;
    height: 7rem;
    text-align: center;
    margin-top: -3vh;
}

.Uif {
    font-size: 16px;
    font-family: sans-serif;
    color: #0D0D0D;
    border: none;
    width: 80%;
    background: #fdfdfd;
}

.Ui {
    font-size: 17px;
    font-family: sans-serif;
    color: #0D0D0D;
    border: none;
    background: #fdfdfd;
    width: 100%;
}

input::placeholder {
    color: #DA6C5C;
}

input:focus,
textarea {
    outline: none;
}

#uiline {
    border-bottom: 1px solid #ccc;
    margin: 42px 80px 0 80px;
}

#uiline img {
    width: 1.5em;
    height: 1.5em;
}

@media screen and (max-width:1660px) {
    #uiline {
        border-bottom: 1px solid #ccc;
        margin: 42px 80px 0 80px;
    }
}

@media screen and (min-width:991px) {
    .Login {
        transform: translate(0%, 20%);
    }
    #uiline {
        margin: 42px 80px 0 80px;
    }
}

.Login p {
    float: right;
    margin: 0px 100px 0 100px;
    font-size: 12px;
}

.Login a {
    width: 40%;
    height: 3rem;
    color: black;
}

.lb #log {
    border: none;
    background: #384C6D;
    color: white;
    /* transform: translate(20%, -20%); */
    padding: 6px;
    text-decoration: none;
    text-align: center;
    border-radius: 30px;
    transition: 0.6s;
    height: 2.6rem;
    width: 15rem;
    font-size: 17px;
}

#log {
    border: none;
    background: #384C6D;
    color: white;
    /* transform: translate(20%, -20%); */
    padding: 8px;
    text-decoration: none;
    text-align: center;
    border-radius: 3px;
    transition: 0.6s;
    font-size: 19px;
}

#log:hover {
    background-color: #566279;
}

#log2 {
    font: normal normal bold 18px/28px;
    border: 1px solid grey;
    background-color: white;
    transform: translate(-15%, -20%);
    padding: 12px;
    text-decoration: none;
    text-align: center;
    border-radius: 3px;
}

@media screen and (max-width:575px) {
    #log {
        transform: translate(0%, 0%);
    }
    #log2 {
        transform: translate(0%, 50%);
    }
    #uiline {
        border-bottom: 1px solid #ccc;
        margin: 42px 50px 0 50px;
    }
}

.Fp #log2 {
    font: normal normal bold 18px/28px;
    transform: translate(-34%, 0%);
    text-decoration: none;
    text-align: center;
    border: none;
    width: 29%;
    white-space: nowrap;
    color: #D3933F;
}

@media screen and (max-width:500px) {
    .Fp #log2 {
        transform: translate(-75%, 0%);
    }
}
.or p {
    font-size: 18px;
    color: #B8B8B8;
    margin-top: 5vh;
    position: relative;
}

.or p:before {
    content: "";
    display: block;
    width: 100px;
    height: 1px;
    background: #b6b1b1;
    left: 25px;
    top: 52%;
    position: absolute;
}

.or p:after {
    content: "";
    display: block;
    width: 100px;
    height: 1px;
    background: #aca8a8;
    right: 25px;
    top: 52%;
    position: absolute;
}
.rr a {
    font-size: 14px;
    margin-top: 5vh;
    text-decoration: none;
    text-align: center;
    width: 100%;
}

.rr span {
    color: #DA6C5C;
    font-weight: 600;
    text-decoration: underline;
    transition: 0.5s;
}