/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/pxiEyp8kv8JHgFVrJJbecmNE.woff2') format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/pxiEyp8kv8JHgFVrJJnecmNE.woff2') format('woff2');
  unicode-range: U+0100-02AF, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/pxiEyp8kv8JHgFVrJJfecg.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/pxiByp8kv8JHgFVrLCz7Z11lFc-K.woff2') format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/pxiByp8kv8JHgFVrLCz7Z1JlFc-K.woff2') format('woff2');
  unicode-range: U+0100-02AF, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/pxiByp8kv8JHgFVrLCz7Z1xlFQ.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


@font-face {
  font-family: 'Chakra Petch';
  src: url('fonts/ChakraPetch-SemiBold.woff2') format('woff2');
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: 'Chakra Petch';
  src: url('fonts/ChakraPetch-Bold.woff2') format('woff2');
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}



*{
   margin: 0;
   padding: 0;
   box-sizing: border-box;
   font-family: 'Poppins',sans-serif;
 }

  
 body{
/*    background: #ff9a47; */
/*    background-image: url(https://www.hmablogs.com/wp-content/uploads/2021/09/background.jpg); */
  background-size:cover;
  background-repeat:no-repeat;
  background-image: url(images/hospitalpic.png);
  overflow: hidden;


  }
  ::selection{
   background: rgba(255, 99, 71, 1,0.3);
 }
 .container{
   max-width: 440px;
   padding: 0 20px;
/*    margin: 70px auto; */
   margin: 170px auto;

 }
 .wrapper{
   width: 100%;
   background: #fff;
   border-radius: 5px;
   box-shadow: 0px 4px 10px 1px rgba(0,0,0,0.1);
 }
 .wrapper .title{

   height: 50px;
   background: #16a085;
   border-radius: 5px 5px 0 0;
   color: #fff;
   font-size: 35px;
   font-weight: 600;
   display: flex;
   align-items: center;
   justify-content: center;
 }
 
 .wrapper .title span {
  font-family: 'Chakra Petch', sans-serif;
}

.wrapper form{
   padding: 30px 25px 25px 25px;
 }
 .wrapper form .row{
   margin-top: 15px;
   height: 40px;
   margin-bottom: 15px;
   position: relative;
 }

 .wrapper form .row input{

   height: 100%;
   width: 100%;
   outline: none;
   padding-left: 60px;
   border-radius: 5px;
   border: 1px solid lightgrey;
   font-size: 16px;
   transition: all 0.3s ease;
 }
 form .row input:focus{
   border-color: #16a085;
   box-shadow: inset 0px 0px 2px 2px rgba(255, 99, 71, 1,0.25);
  }
  form .row input::placeholder{
   color: #999;
 }
 .wrapper form .row i{
   position: absolute;
   width: 47px;
   height: 100%;
   color: #fff;
   font-size: 18px;
   background: #16a085;
   border: 1px solid #16a085;
   border-radius: 5px 0 0 5px;
   display: flex;
   align-items: center;
   justify-content: center;
  }
 .wrapper form .pass{
   margin: -8px 0 20px 0;
  }
 .wrapper form .pass a{
   color: #16a085;
   font-size: 17px;
   text-decoration: none;
  }
  .wrapper form .pass a:hover{
   text-decoration: underline;
 }
 .wrapper form .button input{
  font-family: 'Chakra Petch', sans-serif;
   color: #fff;
   font-size: 20px;
   font-weight: 500;
   padding-left: 0px;
   background: #16a085;
   border: 1px solid #16a085;
   cursor: pointer;
  }
  form .button input:hover{
   background: #12876f;
/*    background: tomato; */
 }
 .wrapper form .signup-link{
   text-align: center;
   margin-top: 20px;
   font-size: 17px;
  }
  .wrapper form .signup-link a{
   color: #16a085;
   text-decoration: none;
  }
 form .signup-link a:hover{
   text-decoration: underline;
 }
 

 
 .footer {
    font-family: 'Chakra Petch', sans-serif;
/*     font-family: 'Sarabun', sans-serif;  */
    text-align: left;
    font-weight:bold;
    font-size: 1.5rem;
    color:#12876f;
/*     color:#fff; */
    padding-top:3px;
    padding-bottom: 3px;
    text-align: center;
    
  }
 .footer1 {
    font-family: 'Chakra Petch', sans-serif;

    text-align: left;
    font-weight:bold;
    font-size: 1rem;
    color:#12876f;
    padding-top:3px;
    padding-bottom: 3px;
    text-align: center;
    
  }


 .header {

    width: 100%;
    margin-top: 1em;
    text-align: center;
    display: flex;
    justify-content: center;
  }

  
  .logo  {
    
    display: flex;
    width: 100px;
    height: 100px;
  
  }
  .logo  .img {
    
    display: flex;
    text-align:right;
    display: flex;
    justify-content: end;
    
  }

  .headername .label {

    width: 100%;
    font-family: 'Chakra Petch', sans-serif;
    font-weight:bold;
    font-size: 3rem;
    color:#12876f;
    text-align: center;
    margin: auto;
    justify-content: center;
    margin-top: 20px;
    margin-left:10px;
}

  
  .error {
    
      width: 92%;
      margin: 0px auto;
      margin-bottom: 20px;
      padding: 10px;
      border: 1px solid #a94442;
      color: #a94442;
      background: #f2dede;
      border-radius: 5px;
      text-align: center;
  }

  .error p {

    text-align: center;

  }
  .success {
      color: #3c763d;
      background: #dff9d8;
      border: 1px solid #3c763d;
      margin-bottom: 20px;
  } 

  




  
  



  
  
  
 
/*  @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap');
*{
   margin: 0;
   padding: 0;
   box-sizing: border-box;
   font-family: 'Poppins',sans-serif;
 }

  @font-face {
    font-family: 'Chakra Petch';
    src: url('https://cdn.jsdelivr.net/gh/lazywasabi/thai-web-fonts@7/fonts/ChakraPetch/ChakraPetch-SemiBold.woff2') format('woff2');
    font-style: normal;
    font-weight: 600;
    font-display: swap;
  }

 body{
   background: #1abc9c;
   overflow: hidden;
 }
 ::selection{
   background: rgba(26,188,156,0.3);
 }
 .container{
   max-width: 440px;
   padding: 0 20px;
   margin: 170px auto;
 }
 .wrapper{
   width: 100%;
   background: #fff;
   border-radius: 5px;
   box-shadow: 0px 4px 10px 1px rgba(0,0,0,0.1);
 }
 .wrapper .title{

   height: 50px;
   background: #f57070;
   border-radius: 5px 5px 0 0;
   color: #fff;
   font-size: 30px;
   font-weight: 600;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .wrapper .title span {
  font-family: 'Chakra Petch', sans-serif;
 }

 .wrapper form{
   padding: 30px 25px 25px 25px;
 }
 .wrapper form .row{
   height: 45px;
   margin-bottom: 15px;
   position: relative;
 }

 .wrapper form .row input{

   height: 100%;
   width: 100%;
   outline: none;
   padding-left: 60px;
   border-radius: 5px;
   border: 1px solid lightgrey;
   font-size: 16px;
   transition: all 0.3s ease;
 }
 form .row input:focus{
   border-color: #f57070;
   box-shadow: inset 0px 0px 2px 2px rgba(26,188,156,0.25);
 }
 form .row input::placeholder{
   color: #999;
 }
 .wrapper form .row i{
   position: absolute;
   width: 47px;
   height: 100%;
   color: #fff;
   font-size: 18px;
   background: #f57070;
   border: 1px solid #f57070;
   border-radius: 5px 0 0 5px;
   display: flex;
   align-items: center;
   justify-content: center;
 }
 .wrapper form .pass{
   margin: -8px 0 20px 0;
 }
 .wrapper form .pass a{
   color: #f57070;
   font-size: 17px;
   text-decoration: none;
 }
 .wrapper form .pass a:hover{
   text-decoration: underline;
 }
 .wrapper form .button input{
  font-family: 'Chakra Petch', sans-serif;
   color: #fff;
   font-size: 20px;
   font-weight: 500;
   padding-left: 0px;
   background: #f57070;
   border: 1px solid #f57070;
   cursor: pointer;
 }
 form .button input:hover{
   background: #12876f;
 }
 .wrapper form .signup-link{
   text-align: center;
   margin-top: 20px;
   font-size: 17px;
 }
 .wrapper form .signup-link a{
   color: #f57070;
   text-decoration: none;
 }
 form .signup-link a:hover{
   text-decoration: underline;
 }
 


 .footer {
    font-family: 'Sarabun', sans-serif; 
    text-align: left;
    font-weight:bold;
    font-size: 1rem;
    color:#fff;
    padding-top:3px;
    padding-bottom: 3px;
    text-align: center;

 }


 .header {

  font-family: 'Chakra Petch', sans-serif;
    font-weight:bold;
    font-size: 2.5rem;
    color:#fff;
    padding-top:2em;
    text-align: center;
 } */