.form {
  display: flex;
  flex-direction: column;
  /* gap: 10px; */
  background-color: #ffffff;
  padding: 1.875rem;
  width: 26.875rem;
  border: 2px solid #06826A;
  border-radius: 15px;
}

::placeholder {
}

.form button:not('.iti__selected-country') {
  border-radius: 10px;
  background-color: var(--theme-color-orange);
  border-color: var(--theme-color-orange);
  margin-top: 1rem;
  width: max-content;
  min-width: 10rem;
  margin-inline: auto;
}
.form button:hover { color: var(--theme-color-orange);}

.form .submitbtn.theme_btn_orange {
  border-radius: 10px;
  background-color: var(--theme-color-orange);
  border-color: var(--theme-color-orange);
  margin-top: 1rem;
  width: max-content;
  min-width: 10rem;
  margin-inline: auto;
}
.form .submitbtn.theme_btn_orange:hover { color: var(--theme-color-orange); background-color: transparent;}

.flex-column > label {
  color: #000000;;
  font-weight: 500;
  margin-bottom: 0;
  letter-spacing: 0.01em;
  margin-bottom: 0.5rem;
  padding-left: 1rem;
  font-size: 1.063rem;
}

.inputForm {
  border: 1.5px solid #C0BEB6;
  border-radius: 15px;
  height: 3.125rem;
  display: flex;
  align-items: center;
  padding-right: 10px;
  transition: 0.2s ease-in-out;
  margin-bottom: 1.5rem;
  flex-wrap: wrap;
}
.inputForm_bottom {  margin-bottom: 1.5rem;}

.input {
  margin-right: 10px;
  border-radius: 10px;
  border: none;
  width: 88%;
  height: 100%;
  padding-left: 12px;
}

.input:focus {
  outline: none;

}


.inputForm:focus-within {
  border: 1.5px solid var(--theme-color);
}
/* svg path { stroke: var(--theme-color);} */
.input:focus-within ~ svg path { stroke: var(--theme-color);}
.input:focus ~ svg path { stroke: var(--theme-color); fill: var(--theme-color);}

.input:focus ~ svg rect { stroke: var(--theme-color); fill: var(--theme-color);}
.input:focus ~ svg circle { stroke: var(--theme-color); fill: var(--theme-color);}

.input:focus::-webkit-input-placeholder {
  color: var(--theme-color) !important;
  }
   
  .input:focus:-moz-placeholder { /* Firefox 18- */
  color: var(--theme-color) !important;  
  }
   
  .input:focus::-moz-placeholder {  /* Firefox 19+ */
  color:var(--theme-color) !important;  
  }
   
  .input:focus:-ms-input-placeholder {  
  color: var(--theme-color) !important;  
  }


.flex-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  justify-content: space-between;
}

.flex-row > div > label {
  font-size: 14px;
  color: black;
  font-weight: 400;
}

.flex-row input[type="checkbox"] {
  margin-right: 0.5rem;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 1.188rem; height: 1.125rem;
  border: 1.5px solid #000000;
  border-radius: 4px; /* Custom border-radius */
  outline: none;
  cursor: pointer;
  position: relative;
  top: 4px;
}

/* Checkbox when checked */
.flex-row  input[type="checkbox"]:checked {
  background-color: var(--theme-color);
  border-color: var(--theme-color);
}

/* Add a tick mark using the ::after pseudo-element */
.flex-row  input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 6px;
  width: 6px;
  height: 10px;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* .flex-row  input[type="checkbox"]  {width: 1.188rem; height: 1.125rem;} */

.span {
  font-size: 0.875rem;
  margin-left: 5px;
  color: var(--theme-color-orange);
  font-weight: 500;
  cursor: pointer;
}

/* .button-submit {
  margin: 20px 0 10px 0;
  background-color: #151717;
  border: none;
  color: white;
  font-size: 15px;
  font-weight: 500;
  border-radius: 10px;
  height: 50px;
  width: 100%;
  cursor: pointer;
} */

.button-submit:hover {
  background-color: #252727;
}

.p {
  text-align: center;
  color: black;
  font-size: 14px;
  margin: 1rem 0 0 0;
  font-family: formatext;
}

.btn {
  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;
}

.btn:hover {
  border: 1px solid #2d79f3;
  ;
}
.form_user .heading_sm:before {     left: 50%;
  transform: translateX(-50%);}
    

/*------------start login css------------*/ 
.loginbnr{
  height: auto;
}
.login-card{
    width:450px;
    margin:50px auto;
  
}

.height-50{
    border-radius:30px;
    background-color: #CEE7D4 !important;
    border-color: #CEE7D4 !important;
    color: #55A073 !important;
    height: 50px;
   font-size: 13px;
}

#button{
    border-radius:30px;

}

.btn-icon{
    position: absolute;
    top: -35px;
    padding: 5px;
    margin: 0px 165px;
    align-items: center;
  
}
.btn-org{
   height: 50px;
   color: #fff;
    background-color: #D1780D;
    border-color: #D1780D;
    letter-spacing: normal;
    font-weight: 500
}

  hr.hr3 {
  border-top: 1px dotted #eee;

}
.text-underline a{
  color: #000;
  text-decoration: underline;
}
.text-blue{
  color: #214D4C;
}
.btn-clr{
  background: #DC7C0E;
}
.btn-clr img{
  width: 30px;
  height: auto;
}

.btn-circle.btn-sm { 
    width: 70px;
    height: 70px;
    padding: 20px 0px;
  }
.wra-lgn{
       padding: 140px 50px 140px 50px;
       margin-bottom: 0px;
 }
 .wra-text, .wra-hdlgpd  {
  font-family: 'Playfair Display', serif;
}
.wra-text {
  font-size: 48px;
  font-weight: 500;
  font-style: italic;
  line-height: 64px
}
.wra-text {
  color: #214D4C
}
.wragrybg {
  background: #E8E8E8
}
.wrabox {
  padding:  40px;
  position: relative;
  margin-bottom: 30px
}
.wrabox p {
  margin-bottom: 20px;
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  color: #585858
}


/*------------End login css------------*/

/*------------start Regi css------------*/


.regi-banner {
    background-image: url(reg-banner.html);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    color: #fff;
}
.wra-lgn{
       padding: 140px 50px 140px 50px;
       margin-bottom: 0px;
 }
 .wra-rg-text, .wra-hdlgpd  {
  font-family: 'Playfair Display', serif;
}
.wra-rg-text {
  font-size: 48px;
  font-weight: 500;
  font-style: italic;
  line-height: 64px
}
.wra-rg-text {
  color: #214D4C
}
.wra-rg-text:before {
     content: "";
    background: #d67f53;
    height: 2px;
    width: 200px;
    display: table;
    position: absolute;
    bottom: -5px;
    left: 420px;
}

label.file {
     position: relative;
    display: block;
    width: 50%;
    height: 50%;
    font-size: 80%;
    text-align: center;
    text-transform: uppercase;
    border: 2px dashed #ccc;
    margin: 3rem 0;
    padding: 3rem;
    border-radius: 100px;
    top: 21px;
    left: 100px;
}

label.file:hover {
  background-color: rgba(255, 255, 255, 0.3);
}

label.file:active,
label.file.focus {
  border-color: #09f;
}

.file input[type="file"] {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  outline: 0;
  border: 1px solid red;
}

/*------------End Regi css------------*/


.cart_process_list { list-style: none; margin: 0 0 1.5rem 0; padding: 0; display: flex;justify-content: space-around; }
.cart_process_list li { text-align: center; position: relative; }
.cart_process_list li a {color: var(--black); pointer-events: none;}
.cart_process_list li a.active {pointer-events: all;}
.cart_process_list li a .number span {font-size: 1rem; margin: 0 auto; font-weight: 500; font-family: 'Oswald', sans-serif; border-radius: 50%; height: 40px; width: 40px; display: grid; place-items: center; border: solid 1px var(--black500); color: var(--black500); background: #fff; position: relative; z-index: 1;}
.cart_process_list li a .number span {} 
.cart_process_list{ position: relative;} .cart_process_list:after {    position: absolute; top: 20px; left: 0; width: 100%; border-top: dashed 2px #58585b; content: '';}
.cart_process_list .title { font-size: 0.875rem; font-weight: 600; color: var(--black500); margin-top: 4px;}
.cart_process_list li a.active .number span {color: var(--theme-color); animation: pulse 1.5s infinite; border: solid 1px var(--theme-color);}
.cart_process_list li a.active .title {color: var(--theme-color);}


        /* INNER PAGE CSS */
        .choose_pic_box { }
        .choose_pic_box .choose_pic_box_left   { width: fit-content;  margin-bottom: 1rem;} 
        .confirm_for_social .custom_check_box  {display: none;}
        .pic_uploaded_show .confirm_for_social .custom_check_box   { display: block; }
        .imageSuccessMessage {color: var(--primary-color);}
        .result_wrapper #result{box-shadow: 0 0 5px 1px #00000061; margin-bottom: 1rem; border-radius: 50%; width: 12.5rem; margin-inline: auto;}
        label>span { text-transform: capitalize; }
        .upload_btn input{display:none}
        .upload_btn{font-size:1rem;background-color:var(--theme-color);color:var(--white);padding:.65rem 2rem;
          border-radius:5rem;font-weight:500; cursor: pointer;}
        .upload_content{text-align:center;padding-top:.4rem;font-weight:600;color:var(--black600)}
        .upload_wrapper{position: relative;}
        #my-image, #use { display: none; }
        .cropper_popup { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; overflow: auto; z-index: 9;  pointer-events: none; opacity: 0;background-color: #00000061; transition: 0.5s;}
        .cropper_content {  margin: auto; position: relative; border-radius: 12px; transition: 0.5s; transform: translateY(51vh); opacity: 0;        height: 100%;
          width: 100%;
          display: flex;
          overflow: auto;
          padding-block: 8rem;}
        .cropper_popup_close{--size:2.5rem;cursor:pointer;position:absolute;right:calc(0px - calc(var(--size)/ 2.5));border-radius:50%;padding:10px;top:calc(0px - calc(var(--size)/ 2.5));width:var(--size);height:var(--size);display:grid;place-items:center;font-size:calc(var(--size) / 2.6);box-shadow:0 0 0 1px #00000038; background-color: var(--white);}
        .cropper_content_box{padding:3rem; text-align: center;     margin: auto;
          background: #fff; position: relative;}
        body.cropper_opened{overflow:hidden; padding-right: 1rem;}
        body.cropper_opened .cropper_popup { pointer-events: all; opacity: 1;}
        body.cropper_opened .cropper_content { pointer-events: all; opacity: 1; transform: translateY(0); }
        .croppie-container { height: initial!important; }
        .cropper_popup .theme_btn_orange {font-size: 0.875rem;  padding: 0.425rem 1.875rem;}
        .loader_btn.loading~button{display: none;}
        .pic_uploaded_show .leftside>img { display: none; } 
        .pic_uploaded_show .leftside .result_wrapper { display: block;    }
        .leftside .upload_btn { padding: 0; --size: 1.8rem; width: var(--size); height: var(--size); display: inline-grid; place-items: center; position: absolute;
           bottom: 0.6rem; right: 6rem; font-size: calc(var(--size) / 2.5); }
        .uploadProfilePic { background-color: transparent; font-weight: 600; color: var(--color_dark800); font-size: 1.125rem; padding: 0; margin-right: 0; }
        .leftside .result_wrapper{margin-top: 0; position: relative;  text-align: center;
            margin-bottom: 1rem;}
        .wall_fame_home .flower_graph_wall{pointer-events: none; z-index: -1;}
        .error{display: block;}
        /* 15 jan 2023 end */

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(209, 124, 46, 0.7);
  }
  70% {
    box-shadow: 0 0 0 15px rgba(209, 124, 46, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(209, 124, 46, 0);
  }
}