#response{
  width: 70%;
  margin: 15px auto;
  padding: 15px;
  border-radius: 5px;
}
.error-msg{
  background: #f2dedf;
  color: #9c4150;
  border: 1px solid #e7ced1;
  
  margin: 15px auto;
  padding: 15px;
  border-radius: 2px;
  
 
}
.success-msg{
  background: #e0efda;
  color: #407a4a;
  border: 1px solid #c6dfb2;
  
  margin: 15px auto;
  padding: 15px;
  border-radius: 2px;
  text-align:center;

}
.process-msg{
  background: #d9edf6;
  color: #377084;
  border: 1px solid #c8dce5;
}
.p-3{
margin-top:10px;}



		  
	.buttonfull{
background: #f50;
color:#fff;
border:1px solid #f50;
padding: 0.6rem  1rem 0.5rem  1rem;
display: inline-block;

margin-top: 10px;
  width: 100%;
  height: 50px;
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 500;
  gap: 10px;
  border: 1px solid #ededef;
  background-color: white;
  cursor: pointer;
  transition: 0.2s ease-in-out;
  
  
 }
.buttonfull:hover{
border:1px solid #ff55001c;
color: #666;
background:none;
 }
 
 
		  
		  ---------
		  #passwordInput {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}
#usenameInput {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}

.eye-icon {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: #888;
}

.eye-icon i {
    font-size: 1.2em;
}






//////////////////


 .post-box {
              
            background-color:#000000;
          }

          .post-box textarea {
              width: 100%;
              padding: 10px 10px 40px 10px;
              border: 1px solid #F3F4F8;
			  background-color:#F3F4F8;
              border-radius: 2px;
              resize: none;
              font-size: 16px;
              box-sizing: border-box;
          }

          .progress {
              display: flex;
              flex-direction: row;
              align-items: end;
              justify-content: space-between;
              margin-top: 0px;
			  height:50px;
			  background: #ffffff;
          }

          .progress-container {
              background: #F3F4F8;
              border-radius: 50%;
              display: flex;
              align-items: left;
              justify-content: left;
          }

          .progress-circle {
              width: 40px;
              height: 40px;
              position: relative;
              display: flex;
              align-items: center;
              justify-content: center;
          }

          .progress-circle svg {
              transform: rotate(-90deg);
          }

          .progress-circle circle {
              fill: none;
              stroke-width: 4;
          }

          .progress-circle .progress {
              stroke: #A1A6B3;
              stroke-linecap: round;
              transition: stroke-dashoffset 0.3s;
          }

          .char-count {
              font-size: 14px;
              color: #999;
          }
		  
		   .red {
              font-size: 12px;
			  font-weight:bold;
			  color: #FF0000;
			   text-align:center;
          }
		     .redbigbold {
              font-size: 15px;
			  font-weight:bold;
			  color: #FF0000;
			  text-transform:uppercase;
			  text-align:center;
          }
		   .alignright {
          text-align:right;
		  padding-bottom:30px;
		  margin-bottom:25px;
          }
		   .margin-top {
            margin-top:25px;
          }
		  
		   .margin-top10 {
            margin-top:10px;
          }
		
		  ---------