.flyout-form{width: 415px; height: 100%; top: 0; right: -100%; position: fixed;z-index: 800; transition: all .5s ease;}
.flyout-form.open{right: 0;}
.flyout-bg{width: 100%; height: 100%; top: 0; right: 0; opacity: 0.5; position: fixed; background-color: #000000; z-index: 750; display: none;}
.flyout-wrap{padding: 40px 50px 71px; width: 100%; height: 100%; max-width: 408px; right: -100%; top: 0; border-radius: 8px 0 0 8px; background-image: linear-gradient(to bottom, #63b5d8 0%, #0061A0 100%); color: #fff; z-index: 1800; position: fixed; transition: all .5s ease;  overflow-y: auto; -webkit-overflow-scrolling: touch;}
.open .flyout-wrap{right: 0;}
.flyout-close{right: 35px; top: 24px; position: absolute; font-size: 32px; color: #002942; opacity: 0.5;}
.flyout-avatar-text{margin-bottom: 22px;}
.flyout-form  .frm_style_formidable-style.with_frm_style div.frm_description{padding-bottom: 20px}
.flyout-avatar-text h5, .frm_form_fields h3.frm_form_title{padding-bottom: 5px; font-size: 24px; line-height: 28px; color: #002942; margin:0;}
.frm_description p { color: #fff !important; font-size: 16px; }
.flyout-form .frm_style_formidable-style.with_frm_style .form-field{position: relative; margin-bottom: 32px; float: none; width: 100%;}
.flyout-form .frm_style_formidable-style.with_frm_style .frm_form_fields input, .flyout-form .with_frm_style textarea, body .flyout-form .selectBox-dropdown{outline: 0; width: 100%; height: auto !important; font-size: 14px; line-height: 22px; letter-spacing: normal; background: #ffffff; box-shadow: none; color: #002942; padding: 12px 11px 13px; vertical-align: middle; font-family: 'Manrope', sans-serif; font-weight: 700; height: auto; transition: all .5s ease;-webkit-transition: all .5s ease;-moz-transition: all .5s ease; border: none; border-radius: 4px;}
body .flyout-form .selectBox-dropdown.selectBox-menuShowing{border-radius: 4px 4px 0 0;}
.flyout-form .frm_style_formidable-style.with_frm_style .frm_blank_field input[type="text"], .flyout-form .frm_style_formidable-style.with_frm_style .frm_blank_field input[type="email"], body .frm_style_formidable-style.with_frm_style .frm_blank_field textarea{border-color: #a6a6a6;}
.flyout-form .with_frm_style .vertical_radio .frm_checkbox{border: none; padding: 0;}
.flyout-form .with_frm_style .vertical_radio .frm_checkbox label{padding-left: 33px; margin-bottom: 8px; text-indent: 0; color: var(--text-color-80); font-size: 16px; line-height: 26px; letter-spacing: 0.57px; font-weight: 500; display: block; cursor: pointer; font-family: 'Urbanist', sans-serif; font-style: normal; position: relative; }
.flyout-form .with_frm_style .vertical_radio .frm_checkbox input {left: 0; top: 3px; width: 20px; height: 20px; padding: 0; margin: 0; cursor: pointer; position: absolute; z-index: 1; }
.flyout-form .with_frm_style .frm_radio input[type="radio"]::before, .flyout-form .with_frm_style .frm_checkbox input[type="checkbox"]::before {width: 10px; height: 10px; top: 50%; left: 50%; margin: 0; transform: translate(-50%, -50%) scale(0); background-color: #0061A0; border-radius: 0; box-shadow: none; display: block; clip-path: none; position: absolute;}
.flyout-form .with_frm_style .frm_radio input[type="radio"]:checked::before, .flyout-form .with_frm_style .frm_checkbox input[type="checkbox"]:checked::before {transform: translate(-50%, -50%) scale(1); }
.flyout-form .frm_style_formidable-style.with_frm_style .frm_form_fields .frm_submit button {width: 100%; display: block; font-size: 18px; line-height: 24px; letter-spacing: normal; padding: 13px 22px 14px; margin: 0; cursor: pointer; border: 2px solid #fff; border-radius: 8px; background: transparent; font-weight: bold; position: relative; transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; text-transform: capitalize; text-align: center; color: #ffffff; font-family: 'Manrope', sans-serif; box-shadow: none; } 
.flyout-form .frm_style_formidable-style.with_frm_style .frm_form_fields .frm_submit button:hover{background: #fff; color: #002942; } 
.flyout-form .frm_style_formidable-style.with_frm_style .frm_blank_field label, .flyout-form .frm_style_formidable-style.with_frm_style .frm_error{bottom: -15px; right: 0; width: 100%; font-size: 12px; line-height: normal; color: #fff; font-family: 'Urbanist', sans-serif; font-weight: 500; text-align: right; position: absolute;}
.flyout-form .frm_style_formidable-style.with_frm_style .frm_error_style{display: none;}
.flyout-form .with_frm_style .frm_message, .flyout-form .frm_success_style{margin: 0; padding: 0; font-size: 16px; line-height: 24px; border: none; background: none;}
.flyout-form .with_frm_style .frm_message p{color: #ffffff;}

/*-- modal popup css starts here --*/
body .modal{left: auto; right: -100%; margin: 0 !important; z-index: 1850; display: block !important; padding: 40px 50px 71px !important; width: 408px; height: 100%; min-height: 100vh; color: #fff; border-radius: 8px 0 0 8px; background: linear-gradient(to bottom, #63b5d8 0%, #0061A0 100%); transition: all 0.45s ease-in-out; }
body.modal-open .modal.in{right: 0;}
body .modal.show{right: 0}
body .wp-block-frm-modal-content .close{font-size: 0; line-height: 0;}
body .wp-block-frm-modal-content .close:before{font-size: 30px; line-height: 30px;}
body .modal-backdrop.fade{transition: all 0.45s ease-in-out; opacity: 0 !important;}
body .wp-block-frm-modal-content.show ~ .modal-backdrop.show{opacity: 0.5 !important;}
body .modal.fade .modal-dialog{width: 100%; margin: 0; -webkit-transform: none; -ms-transform: none; -o-transform: none; transform: none; -webkit-transition: none; -o-transition: none; transition: none; }
.modal .modal-title{display: none;}
.modal .modal-header{border: none; padding: 0;}
.modal-header .close{right: -20px; top: -20px; cursor: pointer; position: absolute; font-size: 32px; color: #002942; opacity: 0.5; transition: all .5s ease;}
.modal-header .close:before{content: "\f00d"; font-weight: 300; font-family: "Font Awesome 6 Pro" !important;}
.modal-header .close:hover{opacity: 1; color: #fff;}
.modal .modal-body{padding: 15px 0 0;}
.modal .modal-content{ border: none; background: none; border-radius: 0; box-shadow: none; -webkit-box-shadow: none;}
.modal .modal-content .with_frm_style .frm_form_fields > fieldset{border: none; padding: 0;}
.modal .modal-content .form-field label{color: #fff; font-family: 'Manrope', sans-serif;}
.modal .modal-content .frm_style_formidable-style.with_frm_style .frm_fields_container{display: block;}
.modal .modal-content .frm_style_formidable-style.with_frm_style div.frm_description{padding-bottom: 20px}
.modal .modal-content .frm_style_formidable-style.with_frm_style .form-field{position: relative; margin-bottom: 32px; float: none; width: 100%;}
.modal .modal-content .frm_style_formidable-style.with_frm_style .frm_form_fields input, .modal .modal-content .with_frm_style textarea, body .modal .modal-content .selectBox-dropdown{outline: 0; width: 100%; font-size: 14px; line-height: 22px; letter-spacing: normal; background: #ffffff; box-shadow: none; color: #002942; padding: 12px 11px 13px; vertical-align: middle; font-family: 'Manrope', sans-serif; font-weight: 700; height: auto; transition: all .5s ease;-webkit-transition: all .5s ease;-moz-transition: all .5s ease; border: none; border-radius: 4px;}
.modal .modal-content.selectBox-dropdown.selectBox-menuShowing{border-radius: 4px 4px 0 0;}
.modal .modal-content .frm_style_formidable-style.with_frm_style .frm_blank_field input[type="text"], .flyout-form .frm_style_formidable-style.with_frm_style .frm_blank_field input[type="email"], body .frm_style_formidable-style.with_frm_style .frm_blank_field textarea{border-color: #a6a6a6;}
.modal .modal-content .with_frm_style .vertical_radio .frm_checkbox{border: none; padding: 0;}
.modal .modal-content .with_frm_style .vertical_radio .frm_checkbox label{padding-left: 33px; margin-bottom: 8px; text-indent: 0; color: var(--text-color-80); font-size: 16px; line-height: 26px; letter-spacing: 0.57px; font-weight: 500; display: block; cursor: pointer; font-family: 'Urbanist', sans-serif; font-style: normal; position: relative; }
.modal .modal-content .with_frm_style .vertical_radio .frm_checkbox input {left: 0; top: 3px; width: 20px; height: 20px; padding: 0; margin: 0; cursor: pointer; position: absolute; z-index: 1; }
.modal .modal-content .with_frm_style .frm_radio input[type="radio"]::before, .flyout-form .with_frm_style .frm_checkbox input[type="checkbox"]::before {width: 10px; height: 10px; top: 50%; left: 50%; margin: 0; transform: translate(-50%, -50%) scale(0); background-color: #0061A0; border-radius: 0; box-shadow: none; display: block; clip-path: none; position: absolute;}
.modal .modal-content .with_frm_style .frm_radio input[type="radio"]:checked::before, .flyout-form .with_frm_style .frm_checkbox input[type="checkbox"]:checked::before {transform: translate(-50%, -50%) scale(1); }
.modal .modal-content .frm_style_formidable-style.with_frm_style .frm_form_fields .frm_submit button {width: 100%; display: block; font-size: 18px; line-height: 24px; letter-spacing: normal; padding: 13px 22px 14px; margin: 0; cursor: pointer; border: 2px solid #fff; border-radius: 8px; background: transparent; font-weight: bold; position: relative; transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; text-transform: capitalize; text-align: center; color: #ffffff; font-family: 'Manrope', sans-serif; box-shadow: none; } 
.modal .modal-content .frm_style_formidable-style.with_frm_style .frm_form_fields .frm_submit button:hover{background: #fff; color: #002942; } 
.modal .modal-content .frm_style_formidable-style.with_frm_style .frm_error{bottom: -15px; right: 0; width: 100%; font-size: 12px; line-height: normal; color: #fff; font-family: 'Urbanist', sans-serif; font-weight: 500; text-align: right; position: absolute;}
.modal .modal-content .frm_style_formidable-style.with_frm_style .frm_error_style{display: none;}
.modal .modal-content .with_frm_style .frm_message, .flyout-form .frm_success_style{margin: 0; padding: 0; font-size: 16px; line-height: 24px; border: none; background: none;}
.modal .modal-content .with_frm_style .frm_message p{color: #ffffff;}

@media only screen and (max-width: 767px) and (min-width: 200px){
    .flyout-form{width: 100%;}
    .flyout-wrap{padding: 50px 20px 74px;}
    .frm-g-recaptcha > div{width: 100% !important; height: 74px; overflow: hidden;}
    .flyout-close {right: 18px; top: 15px; padding: 0; }
    body .modal {padding: 40px 20px 71px !important; width: 100%; border-radius: 0; } 
    body .wp-block-frm-modal-content .close{padding: 0; top: 0; right: 0}
}