
/*-------------------------------------------------------------*/
#country_code {
  text-align: center !important;
  height: 45px !important;
  width: 120px !important;
}
#fma_lwp_send_code_btn, #fma_lwp_covde_verfiy_btn, #country_code{
  min-width: 120px !important;
  min-height: 45px !important;
}
#fma_lwp_phone_number, #verificationCode {
  max-width: 400px !important;
  min-width: 350px !important;
  min-height: 45px !important;
}
/*-------------------------------------------------------------*/

@font-face {
  font-family: NotoColorEmojiLimited;
  unicode-range: U+1F1E6-1F1FF;
  src: url(https://raw.githack.com/googlefonts/noto-emoji/main/fonts/NotoColorEmoji.ttf);
}

#country_code option, #country_code {
  font-family: 'NotoColorEmojiLimited', -apple-system, BlinkMacSystemFont, 
  'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 
  'Segoe UI Emoji', 'Segoe UI Symbol';
}

#fma_lwp_verification_code_div {
  margin-bottom: 10px;
} 

.form-heading{
  /*text-align: center;*/
  margin: 50px 0px 40px 0px;
}

.show-hide  {
  margin-top: 10px !important;
  margin-left: 6px !important;
}

.inline {
  display: inline-block;
}
#firebase, #labels, #messages {
  display: none;
}

/*#firebase, #labels, #messages ,#general{
  margin-top: 20px;
}*/

.main-content {
  display: grid;
  grid-template-columns: auto;
}

.main-content > div > table {
  text-align: left;  
}

div > table > tbody > tr > th {
  position: relative;
  padding: 20px 20px 10px 0px;
  line-height: 1.3;
}
div > table > tbody > tr > td {
  margin-bottom: 9px;
  padding: 15px 10px;
  vertical-align: middle;
  line-height: 1.3;
}
#messages > tbody > tr > td {
  
}

#login_with_phone_number_table_admin{

	border-collapse: separate;
	border-spacing: 6px 3px;
}
#fma_lwp_phone_number_div{
	margin: 10px 0px 0px 0px;
}
#fma_lwp_show_err_msg_to_enter_phone_number{
	color:red;
}
.icon, .error {
  display: none;
}
#fma_lwp_show_err_msg_country_code{
  color:red;
}
#recaptcha-container{
	margin:10px 0px 9px 0px;
}
/*instructions style*/

#fma_lwp_instructions_container > li {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  display: inline-block;
  line-height: 2rem;
  color: white;
  text-align: center;
  margin-right: 0.5rem;
}
#fma_lwp_phone_icon {
    position: relative;
}

/*replace the content value with the
corresponding value from the list below*/
#fma_lwp_phone_icon:before {
    content: "\f10b";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: #000;
    font-size: 18px;
    padding-right: 0.5em;
    position: absolute;
    top: 10px;
    left: 0;
}
#fma_lwp_hide_instructions {
	margin: 0px 0px 8px 0px;
}
#fma_lwp_code_sent_msg{
	color:#08a208;
}
#fma_lwp_spinner_icon, #fma_lwp_spinner_code_verify_icon {
	position: relative;
	margin:0px 0px 0px 20px;
}
#fma_lwp_spinner_icon:before{
    content: "\f110";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: #000;
    font-size: 18px;
    padding-right: 0.5em;
    position: absolute;
    top: 10px;
    left: 0;
}
#fma_lwp_spinner_code_verify_icon:before {
	content: "\f110";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: #000;
    font-size: 18px;
    padding-right: 0.5em;
    position: absolute;
    top: 10px;
    left: 0;
}
#fma_lwp_continue_with_phone, #fma_lwp_send_code_btn{
	margin:0px 0px 8px 0px;
}
.fma_lwp_asterick{
	color:red;
}
/*snack bar design*/
#fma_lwp_message_snackbar {
  visibility: hidden;
  min-width: 250px;
  margin-left: -125px;
  background-color: #fff;
  border-left:outset;
  text-align: center;
  border-left-color: #46b450 !important;
  border-radius: 2px;
  padding: 16px;
  position: fixed;
  z-index: 1;
  left: 50%;
  bottom: 30px;
  font-size: 17px;
}
#fma_lwp_message_snackbar.show {
  visibility: visible;
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;
}
#fma_lwp_covde_verfiy_btn {
	margin:8px 0px 0px 0px;
}
#fma_lwp_warning_message {
  padding: 10px 10px 10px 6px;
  border-left: 5px solid #ffba00;
  background: #f5f0f0a3;
}

@media (max-width: 768px){
  #country_code {
    width: 30%;
  }
}


/*-------------------------modalcss---------------------------------*/
.fme_pnl_modal,
.fme_pnl_modal-box {
  z-index: 9999;
}

.fme_pnl_modal-sandbox {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgb( 0, 0, 0, 0.01);
}

.fme_pnl_modal {
  display: none; 
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgb(0,0,0);
  background: rgba(0,0,0,.8);
  overflow-y: hidden;
  display: grid;
  align-items: center;
}

.fme_lwp_reg_popup{height: 100%; display: flex; align-items: center; justify-content: center; padding:20px 20px; box-sizing: border-box;}
.fme_lwp_reg_popup .fme_lwp_reg_popup_inner{background-color: #fff; padding:30px 30px; box-sizing: border-box; max-width: 600px; width: 100%; margin: auto; position: relative;}
.fme_lwp_reg_popup .fme_lwp_reg_popup_inner .fme_lwp_close_popup{position: absolute; top:20px; right:20px;}
.fme_lwp_reg_popup .fme_lwp_reg_popup_inner .fme_lwp_close_popup img{max-width: 100%;}
.fme_lwp_reg_popup .fme_lwp_reg_popup_inner .fme_lwp_popup_ttl{font-size: 18px; line-height: 26px; font-family: 'Inter', sans-serif; font-weight: 600; color: #515151; margin:0px 0px; padding-bottom:10px;}
.fme_lwp_reg_popup .fme_lwp_reg_popup_inner .fme_lwp_popup_txt{font-size: 16px; line-height: 24px; color: #515151; font-family: 'Inter', sans-serif; font-weight: 400;}
.fme_lwp_reg_popup .fme_lwp_reg_popup_inner .fme_lwp_login_opt{display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; padding:20px 0px; box-sizing: border-box;}
.fme_lwp_reg_popup .fme_lwp_reg_popup_inner .fme_lwp_login_opt .fme_lwp_popup_log_cta{width:49%; font-size: 14px; line-height: 22px; color: #515151; padding:10px 20px; box-sizing: border-box; text-align: center; display: block; border:1px solid #515151; transition: .3s ease-in-out; text-decoration: none; font-family: 'Inter', sans-serif; font-weight: 400;}

.fme_lwp_popup_form .fme_lwp_form_field{padding-bottom:20px;}
.fme_lwp_popup_form .fme_lwp_form_field.fme_lwp_sub_btn{padding-bottom:0px;}
.fme_lwp_popup_form .fme_lwp_form_field .fme_lwp_text_field{font-size: 14px; line-height: 24px; padding:10px 20px; box-sizing: border-box; font-family: 'Inter', sans-serif; font-weight: 400; color: #828282; border:1px solid #B7B7B7; width: 100%; outline: unset;} 
.fme_lwp_popup_form .fme_lwp_form_field .fme_lwp_text_field::placeholder{color: #828282;}
.fme_lwp_popup_form .fme_lwp_form_field .fme_lwp_popup_submit_cta{ font-size:14px; line-height:24px; font-family: 'Inter', sans-serif; font-weight: 400; color: #fff; border: 1px solid #515151; background-color: #515151; outline: unset; padding: 8px 20px; box-sizing: border-box; min-width:9em; cursor: pointer; transition: .3s ease-in-out;}
.fme_lwp_popup_form .fme_lwp_form_field .fme_lwp_popup_submit_cta:hover{background-color: transparent; color: #515151;}
.fme_lwp_popup_form .fme_lwp_form_field .fme_lwp_txt{font-size: 14px; line-height: 22px; font-family: 'Inter', sans-serif; font-weight: 400; color: #515151; display: block; padding-top:8px;}


 @media screen and (min-width:200px) and (max-width:640px){
    .fme_lwp_reg_popup .fme_lwp_reg_popup_inner{padding:25px 25px;}
    .fme_lwp_reg_popup .fme_lwp_reg_popup_inner .fme_lwp_close_popup {top:15px; right:15px;}
    .fme_lwp_reg_popup .fme_lwp_reg_popup_inner .fme_lwp_close_popup img{width:12px;}
    .fme_lwp_reg_popup .fme_lwp_reg_popup_inner .fme_lwp_popup_ttl{font-size: 16px; line-height: 24px;}
    .fme_lwp_reg_popup .fme_lwp_reg_popup_inner .fme_lwp_popup_txt{font-size: 14px; line-height: 22px;}
    .fme_lwp_reg_popup .fme_lwp_reg_popup_inner .fme_lwp_login_opt .fme_lwp_popup_log_cta{width: 100%; padding:8px 6px;}
    .fme_lwp_reg_popup .fme_lwp_reg_popup_inner .fme_lwp_login_opt .fme_lwp_popup_log_cta:first-child{margin-bottom:20px}
    .fme_lwp_popup_form .fme_lwp_form_field .fme_lwp_text_field{padding:8px 15px;}
    .fme_lwp_popup_form .fme_lwp_form_field .fme_lwp_popup_submit_cta{padding:6px 20px; min-width: 8em;}
}
