@font-face{font-family:ibmplexsans;font-display:swap;font-weight:400;src:local("IBMPlexSans"),url(../fonts/IBMPlexSans-Regular.woff2) format("woff2"),local("IBMPlexSans"),url(../fonts/IBMPlexSans-Regular.woff) format("woff")}
@font-face{font-family:ibmplexsans;font-display:swap;font-weight:600;src:local("IBMPlexSans"),url(../fonts/IBMPlexSans-Medium.woff2) format("woff2"),local("IBMPlexSans"),url(../fonts/IBMPlexSans-Medium.woff) format("woff")}
@font-face{font-family:ibmplexsans;font-display:swap;font-weight:700;src:local("IBMPlexSans"),url(../fonts/IBMPlexSans-Bold.woff2) format("woff2"),local("IBMPlexSans"),url(../fonts/IBMPlexSans-Bold.woff) format("woff")}

body {background-color:#e7f0e9; font-family:'ibmplexsans', Arial, Helvetica, sans-serif; font-weight: 400;}
.myerror {font-size: 12px; color: #c9302c; margin: 20px 0 10px; display: block;}
.mywarn {font-size: 12px; color: #FF8C00; margin: 20px 0 10px; display: block;}
.mysuccess {font-size: 12px; color: forestgreen; }
.toggle-password {
  position: absolute;
  top: 40px;
  right: 20px;
  cursor: pointer;
  color: #6c757d;
}

.toggle-password:hover {
  color: #495057;
}

/* account page */
.acc_top {text-transform: capitalize; position: relative; padding: 0; background:#1e175d;}
.acc_top .gradient {padding:100px 0; background:rgba(0,0,0,0.7); height: 850px; }
/*.acc_top .gradient .full_back {background-image:url('../imgs/Serene-Environment-scaled.jpg'); background-size: cover; height: 750px; background-position: center;}*/


.acc_top .acc_boxes {border-radius:5px; max-width: 450px; position:relative; background:#fff; box-shadow:0 0 10px 1px #333; display: block; margin: 0 auto 50px;}
.acc_top .acc_boxes .formbox {padding: 20px;}
.acc_top .acc_boxes .formbox h2 {border-top-left-radius: 3px; border-top-right-radius: 3px; text-align: left; padding: 20px; background: #4caf4f; font-size: 18px; 
font-weight: bold; margin: 0; margin-bottom: 10px; color: #fff;}
.acc_top .acc_boxes .formbox h2 span {display: inline-block; float: right;}
.acc_top .acc_boxes .formbox h2 span img {display: block; width: auto; height: 30px;}
.acc_top .acc_boxes .formbox h2 p {font-size: 10px; margin: 0; padding: 0; margin-top: 5px; color: #afafaf;}
.acc_top .acc_boxes .formbox label {color: #1f2532; text-align: left; font-weight: bold;}
.acc_top .acc_boxes .formbox label span {color: #f00;}
.acc_top .acc_boxes .formbox label a {color: #1f2532; text-decoration: underline; text-transform: capitalize; }
.acc_top .acc_boxes .formbox .form-group {margin-bottom: 20px;}
.acc_top .acc_boxes .formbox .form-control {border: 1px solid #909090; padding: 9px 12px; height: 40px !important; box-shadow: none;}
.acc_top .acc_boxes .formbox .form-control::placeholder {font-family: 'ibmplexsans', sans-serif;}
.acc_top .acc_boxes .formbox select {padding: 3px 10px !important; height: 40px !important;}
.acc_top .acc_boxes .formbox .btn {background:#4caf4f; display:block; min-width:170px; padding-top: 10px; margin: 0 auto; text-align: center; color:#fff; border-radius:25px; cursor: pointer;}
.acc_top .acc_boxes .formbox .btn:focus {outline: none;}
.acc_top .acc_boxes .formbox .checkbox {color: #333; font-size: 11px; text-transform:none;}
.acc_top .acc_boxes .formbox .links {text-align: center; margin: 0px 0 10px;}
.acc_top .acc_boxes .formbox .links a {color: #1f2532; text-decoration: none; font-size: 14px; cursor: pointer;}
.acc_top .acc_boxes .formbox .links span {margin: 0 5px; display: inline-block; color: #1f2532;}

@media (max-width: 768px){
.acc_top .gradient {padding: 70px 0;}
.acc_top .acc_boxes {max-width: auto; margin-top: 30px;}}
@media (max-width: 556px){
    .acc_top .acc_boxes {max-width: auto;}
.acc_top .acc_boxes .formbox {padding: 10px;}}