@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@200;300;400;500;600;700;800&display=swap');

.BG 				        { clear: both; background-color: #ffffff; padding-top: 0;  font-family: 'Montserrat', sans-serif !important; line-height: 1.2; }
.BGClr 				        { clear: both; background-color: #f8f8f8; padding-top: 0;  font-family: 'Montserrat', sans-serif !important; line-height: 1.2; }


.FormMainSection 	{ border-radius: 20px; background: rgba(151, 151, 151, 0.09); backdrop-filter: blur(3.5px); padding: 15px 20px;}
.FormSubSection		{ border-radius: 20px; background-color: #FFFFFF; padding: 20px 25px; margin-top: 10px; margin-bottom: 10px; box-shadow: 0px 11px 32px 0px rgba(0, 0, 0, 0.05);}
.ThanksSection      { text-align: center; padding-bottom: 15px;}

.step 				{ text-align: left; padding: 8px 0 8px 15px; border-left: 5px solid #C7C7C7; color: #7D7D7D;  font-family: 'Montserrat', sans-serif !important; margin-bottom: 10px; }
.step p 			{ color: #7D7D7D; font-family: 'Montserrat', sans-serif !important; font-size: 15px; padding: 0px; margin: 0px; }
.step img			{ margin-right: 5px; }

.stepactive 		{ border-left: 5px solid #1A93CC !important; }
.stepactive label	{ color: #333333;  }

.form-control 		{ height: 40px !important; border-radius: 50px !important; border-color: #a7bfd2 !important; color: #7d7d7d; font-family: 'Montserrat', sans-serif !important; margin-bottom: 10px; margin-right: 5px; 
						font-size: 15px; font-weight: 500; width: 100% !important; }
.form-field-title 	{ font-weight: 500; font-size: 16px; line-height: 19px; font-family: 'Montserrat', sans-serif !important; }

.form-title 		{ font-size: 20px; padding-top: 13px; padding-bottom: 0px; color: #333; font-weight: 600; font-family: 'Montserrat', sans-serif !important; }
.form-title2 		{ padding-top: 13px; padding-top: 5px; padding-bottom: 10px; color: #7D7D7D; font-weight: 600; font-size: 15px; font-family: 'Montserrat', sans-serif !important; }
.form-title3 		{ font-size: 22px; padding-top: 13px; padding-bottom: 0px; color: #333; font-weight: 600; font-family: 'Montserrat', sans-serif !important; }
.form-title4 		{ padding-top: 12px; padding-top: 5px; padding-bottom: 10px; color: #7D7D7D; font-weight: 400; font-size: 15px; font-family: 'Montserrat', sans-serif !important; }

.mybutton 			{ border-radius: 50px; color: white; background: #005380; padding: 8px 35px; font-size: 15px; margin:20px auto 0 auto;  }
.mybutton:focus,
.mybutton:hover,
.mybutton.focus		{ color:#FFFFFF; background-color: #009bda; border-color:#005380; }

.mybutton:active,
.mybutton.active	{}

.mybutton img 		{ margin: -3px 0 0 5px;}

.mybutton2 			{ border-radius: 30px; color: white; background: #1A93CC; font-size: 15px; padding: 8px 35px; margin: 10px auto 15px; width: 175px; font-family: 'Montserrat', sans-serif !important; }
.mybutton2:focus,
.mybutton2:hover,
.mybutton2.focus	{ color:#FFFFFF; background-color: #009bda; border-color:#005380; }

.mybutton2 img 		{ margin: -3px 0 0 5px;}

.FormCenter			{ margin: auto; float: inherit;}

.ARGFormCheckBox            { clear: left; width: 10%; float: left;}
.ARGFormCheckLbl            { float: left; width: 90%; padding-top: 2px;}
.ARGFormCheckLbl label      { font-size: 12px; color: #4E4E4E; line-height: 17px; font-weight: normal;}

.ARGFormCheckLbl a:hover    { text-decoration: underline !important; color: #009bda;}


.ARGReferenceDataSection    { border-radius: 20px; background: rgba(151, 151, 151, 0.09); padding: 17px 24px; margin-bottom: 15px;}

.ARGReferenceDetails        { color: #7D7D7D; font-size: 14px;}
.ARGReferenceDetails img    { margin-right: 5px;}

.ARGReferenceMobile         { float: left; padding-right: 15px;}
.ARGReferenceMobile img     { margin-right: 6px;}

.ARGReferenceEmail          { float: left; }
.ARGReferenceEmail img      { margin-right: 3px;}

.ARGReferenceIcons          { }
.ARGReferenceIcons img      { float: right;  margin-top: 9px;}
.ARGReferenceIcons a        { cursor: pointer; }



.FormLeftSection 	        { background-color: #FFFFFF; color: #012132; padding:30px 0px 15px;}
.FormRightSection           { background-color: #0E3594; color: #FFFFFF; flex: 0 0 auto; padding: 35px 0 50px; display: inline-block;}

.FormLeftSection h1	        { font-size: 22px; color: #012132; padding: 5px 0 5px 0; margin: 0px; font-weight: 400; font-family: 'Montserrat', sans-serif !important;}
.FormLeftSection h1 span    { font-weight: 700; font-family: 'Montserrat', sans-serif !important;}

.FormLeftSection h3	        { font-size: 14px; color: #5B6165; padding: 0 0 20px 0; margin: 0px; line-height: 1.2;}

.GrayBGSection              { background: rgba(151, 151, 151, 0.09); border-radius: 15px; padding: 20px 25px; margin-bottom: 20px;}
.GrayBGSection .Heading     { font-size: 16px; font-weight: 600; padding-top: 10px; padding-bottom: 10px;}

.col-form-label             { padding-top: 12px;}
.labelRight                 { text-align: left; padding-right: 0; margin-top: 10px; }

.CardBGSection              { background: rgba(151, 151, 151, 0.09); border-radius: 15px; padding: 20px 25px 25px; margin: 0 0 20px 0;}
.CardTitleRow               { margin-bottom: 15px !important; margin-right: 0px;}

.CardBGSection .Heading     { font-size: 16px; font-weight: 700; padding-top: 10px; color: #7D7D7D;}
.CardBGSection .Close       { float: right; width: 25px; height: 24px; padding-top: 1px; background-color: #E1E1E1; border-radius: 50px; text-align: center; cursor: pointer;margin-left: 20px;}
.CardBGSection .Close:hover { background-color: #FFFFFF;}
.CardBGSection .col-form-label  { font-size: 13px; padding-top: 13px;}

.CardBGSection.Total            { background: #DEF0FF;}
.CardBGSection.Total .Heading   { color: #00426A;}

.form-control 		        { height: 40px !important; border-radius: 50px !important; border-color: #a7bfd2 !important; color: #292929; font-family: 'Montserrat', sans-serif !important; 
                                margin-bottom: 10px;    margin-top: 10px; margin-right: 0; font-size: 15px; font-weight: 500; width: 100% !important; padding-left: 15px !important; }

.form-group                 { margin-bottom: 10px !important;display: flow !important;}
.CardBGSection .form-group  { margin-bottom: 0;}

.form-control[disabled], 
.form-control[readonly], 
fieldset[disabled] .form-control { background-color: #E0E0E0; }

.form-range                 { margin-bottom: 10px;width: inherit;}

.RangeValueLeft             { font-size: 14px; color: #7D7D7D; text-align: left;}
.RangeValueRight            { font-size: 14px; color: #7D7D7D; text-align: right;}

hr.FormDivider              { border-top: 1px solid #D6D6D6; margin: 0 auto 20px;}

.TnCDetails                 { padding-top: 0; padding-bottom: 10px;}
.TnCDetails p               { color: #505050; font-size: 11px; font-family: 'Montserrat', sans-serif !important;    line-height: 20px;}
.TnCDetails p span          { font-weight: 800; }
    
.FormRightSection .HeadingSmall     { color: #FFFFFF; font-size: 16px; padding-bottom: 3px;}
.FormRightSection .HeadingMedium    { color: #FFFFFF; font-size: 24px; padding-bottom: 3px; font-weight: 600;}
.FormRightSection .HeadingAED       { color: #FFFFFF; font-size: 50px; padding-bottom: 8px; font-weight: 700;}
.FormRightSection .HeadingAED span  { font-size: 30px; font-weight: 500;}
.FormRightSection p                 { color: #FFFFFF; font-size: 16px; font-family: 'Montserrat', sans-serif !important; padding-bottom: 40px; border-bottom: 1px solid #7D7D7D;}

.FormRightSection .HeadingAED span+span  { font-size: 16px; font-weight: 300;}

.PayingValue                    { padding-top: 20px;}
.PayingValue p                  { padding-bottom: 35px; border-bottom: 0px solid #7D7D7D;}

.ApplyMasterSection2            { position: absolute; bottom: 50px; width: calc(100% - 30px);}

.ApplySection                   { background: rgba(255, 255, 255, 0.88); backdrop-filter: blur(30px); border-radius: 15px; padding: 20px 25px 10px;}

.ApplySection .Heading          { font-size: 24px; font-weight: 700; padding-bottom: 10px; color: #133892;}
.ApplySection .Close            { float: right; width: 35px; height: 35px; padding-top: 6px; background-color: #E1E1E1; border-radius: 50px; text-align: center; cursor: pointer;}
.ApplySection .Close:hover      { background-color: #FFFFFF;}
.ApplySection .col-form-label   { font-size: 12px; padding-top: 13px;}

.ApplySection .form-group       { margin-bottom: 0;}


.FormRightSection .form-control { margin-bottom: 15px;}

/* 
.DefaultLightButton 			{ border-radius: 40px; color: white; background: #009BDA; font-size: 16px; font-weight: 700; padding: 10px 40px; margin: 10px auto 15px; 
                                    font-family: 'Montserrat', sans-serif !important; border-color:transparent; box-shadow: 7px 8px 9px 0px rgba(0, 155, 218, 0.10);} */

.DefaultLightButton {
    border-radius: 40px;
    color: #0E3594;
    width: 100%;
    background: #F1DE2F;
    font-size: 16px;
    font-weight: 700;
    padding: 10px 40px;
    margin: 10px auto 15px;
    font-family: 'Montserrat', sans-serif !important;
    border-color: transparent;
    border: 2px solid #D1C134;
    box-shadow: 7px 8px 9px 0px rgba(0, 155, 218, 0.10);
    margin-top: 25px;
}
.DefaultLightButton:focus,
.DefaultLightButton:hover,
.DefaultLightButton.focus	    { color:#FFFFFF; background-color: #133892; border-color:transparent; }

.DisplayStretch1                { padding: 0 20px;}
.DisplayStretch2                { padding: 0 20px;}

.FormDetailSection              { text-align: center; padding-top: 40px; padding-bottom: 40px; color: #03283A; }
.FormDetailSection p            { font-size: 16px; color: #03283A;  font-family: 'Raleway', sans-serif !important; line-height:1.3; }

.StatsSection                   { padding-top: 40px; padding-bottom: 40px; text-align: center;}
.StatsSection .Stat1stLine      { font-size: 16px; }
.StatsSection .StatMainLine     { font-size: 50px; font-weight: 700; }
.StatsSection .Stat2ndLine      { font-size: 16px; margin-bottom: 30px; }

.SwitchButton 			        { border-radius: 60px; color: #0E3594; background: #F1DE2F; font-size: 18px; font-weight: 600; padding: 16px 45px; margin: 10px auto 15px; line-height: 1.2;
                                  font-family: 'Montserrat', sans-serif !important; border-color:transparent; box-shadow: 0px 0px 20px 0px rgba(0, 155, 218, 0.50);
                                  transition: all ease-in 0.3s;}
.SwitchButton:focus,
.SwitchButton:hover,
.SwitchButton:active:hover,
.SwitchButton:active,
.SwitchButton.focus	            { color:#0E3594; background-color: #c7b401; border-color:transparent; box-shadow: 0px 0px 20px 0px rgb(255 214 64 / 50%); 
                                    outline: transparent;}

.SwitchButton .LeftText         { float: left; padding-right: 15px;}                     
.SwitchButton .SwitchBox        { width: 50px; height: 30px; background-color: #0E3594; float: right; border-radius: 50px; margin-top: 5px; transition: all ease-in 0.3s;}                     
.SwitchButton .SwitchNob        { width: 26px; height: 26px; background-color: #FFFFFF; float: left; border-radius: 50px; margin: 2px 2.5px 2px 3px; transition: all ease-in 0.3s;} 


.SwitchButton:focus .SwitchNob  { float: right;}
.SwitchButton:focus .SwitchBox  { background-color: #00411E; }  

.FaqBG                          { padding-top: 30px; padding-bottom: 30px;}
.card h5                        { padding: 0; margin: 0; border-bottom: 1px solid rgb(212, 212, 212);}
.card .form-field-title         { white-space: normal; width: 100%; text-align: left; padding: 20px 80px 20px 10px; font-size: 18px; color: #012132; font-family: 'Raleway', sans-serif !important;
                                    background: url(/fh_new/wp-content/themes/fhg_theme/images/Minus-Dark.svg) right center no-repeat;}

.card .form-field-title.collapsed {background: url(/fh_new/wp-content/themes/fhg_theme/images/Plus-Dark.svg) right center no-repeat;}
.card .form-field-title:focus,
.card .form-field-title:hover,
.card .form-field-title:active:hover,
.card .form-field-title:active,
.card .form-field-title.focus   { color: #009BDA; }

.card .card-body                { padding: 20px; background: rgba(151, 151, 151, 0.09);}

#referenceData {
    display: flow;
}

.row {
    margin-bottom: 0px;
    justify-content: space-between;
}

.d-none {
    display: none !important;
}

.only-uae-national-msg { color: #133892 !important;padding: 30px 0;font-weight: 500; border-bottom: 0 !important; font-size: 14px !important;}


.error {
    color: #ff0000;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}


/* Loader CSS */
.loader {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: none;
    padding: 21px;
    position: relative;
    animation: rotate 1s linear infinite;
}
.loader::before {
    content: "";
    display: inline-flex;
    inset: 0px;
    border-radius: 50%;
    border: 5px solid #133892;
    animation: prixClipFix 2s linear infinite;
    width: 35px;
    height: 35px;
}

.snd-ico-boxes{
    background-color: white;padding: 30px 10px;width: 23%;margin: 10px;height: 230px;
}

.contact-ico-boxes{
    background-color: white;padding: 30px 10px;width: 23%;margin: 10px;height: 210px;
}

.solution-ico-boxes{
    background-color: #F8F8F8;padding: 30px 10px;width: 23%;margin: 10px;height: 230px;
}

.reg-ico-boxes{
    background-color: white;padding: 30px 10px;width: 31%;margin: 10px;height: 185px;
}

.bnr-btn-head{
    display: flex;gap: 15px;margin-top: -8%;flex-wrap: wrap;position: absolute;width: 500px;margin-left: 10%;
}

.bnr-btn-head-speak{
    flex: 1 1 200px; text-align: center; background: #F1DE2F; color: #0E3594; font-weight: 700; padding: 10px 20px; border-radius: 50px; border: 2px solid #D1C134; cursor: pointer;
}

.bnr-btn-head-call{
    flex: 1 1 200px; text-align: center; background: #E2E7F2; color: #0E3594; font-weight: 700; padding: 10px 20px; border-radius: 50px; cursor: pointer;
}

.sol-box-handle{
    color: #03283A;font-size: 16px;font-weight: 700;line-height: 20px;word-wrap: break-word; padding: 10px 0;
}
.sol-subbox-handle{
    color: #5B6165;font-size: 14px;font-weight: 400;
}
.img-sec-handle{
    background: #f8f8f8;border-radius: 8px;padding: 20px;margin-bottom: 10px;
}
.img-sec-handle-sub{
    background: #f8f8f8;border-radius: 8px;padding: 0px;margin-bottom: 10px;
}


@keyframes rotate {
    100%   {transform: rotate(360deg)}
  }

  @keyframes prixClipFix {
      0%   {clip-path:polygon(50% 50%,0 0,0 0,0 0,0 0,0 0)}
      25%  {clip-path:polygon(50% 50%,0 0,100% 0,100% 0,100% 0,100% 0)}
      50%  {clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,100% 100%,100% 100%)}
      75%  {clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,0 100%,0 100%)}
      100% {clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,0 100%,0 0)}
  }
  

  /* ------------------------- */



@media (max-width: 628px) { 

    .FormRightSection {
        width: -webkit-fill-available;
    }
    .TnCDetailsMob{
        display: flex;
        align-content: flex-start;
        flex-wrap: nowrap;
        height: 545px;
        justify-content: space-between;
        align-items: stretch;
        flex-direction: column;
    }
    .bnr-btn-head{
   margin-top: -15% !important;
   width: 350px !important;
}
    .snd-ico-boxes{
       width: 95% !important;
       height: 220px !important;
    }

    .bnr-btn-head-speak{
    flex: 1 1 100px !important;
    padding: 10px !important;
        font-size: 12px !important;
}

.bnr-btn-head-call{
    flex: 1 1 100px !important;
    padding: 10px !important;
        font-size: 12px !important;
}

    .contact-ico-boxes{
    width: 95% !important;
       height: 220px !important;
}

.solution-ico-boxes{
    width: 95% !important;
       height: 250px !important;
}

.reg-ico-boxes{
    width: 95% !important;
       height: 170px !important;
}


}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) { 

    .labelRight                     { text-align: right; padding-right: 0; }

    .FormLeftSection 	            { padding:30px 30px 15px;}
    .FormRightSection               { padding: 35px 50px 50px;}

    .FormLeftSection h1	            { font-size: 30px; }
    .FormLeftSection h3	            { font-size: 16px; }

    .form-group                     { margin-bottom: 10px !important;display: flow !important;}
    .CardBGSection .form-group      { margin-bottom: 10px;}

    .CardBGSection .col-form-label      { padding-top: 4px;}

    .CardTitleRow                   { margin-bottom: 10px; margin-right: 0px; }
    .CardBGSection                  { padding: 20px 25px 15px;}

    .FormRightSection p             { padding-bottom: 10px;}


    .SavingValue .HeadingSmall      { border-right: 1px solid #7D7D7D; }
    .SavingValue .HeadingMedium     { border-right: 1px solid #7D7D7D; }
    .SavingValue .HeadingAED        { border-right: 1px solid #7D7D7D; display: inherit; color: #f0dd41; }
    .SavingValue p                  { border-right: 1px solid #7D7D7D; border-bottom: 0 solid #7D7D7D;}

    .DisplayStretch2                { padding-top: 20px;}

    .PayingValue                    { padding-top: 0;}
    .StatsSection .Stat2ndLine      { margin-bottom: 0; }
    



}

.hidden-xs{
    display:none;
}

.form-inline label {
    display: initial !important;
}
/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) { 

    .FormSection                    { display: flex;}
    .FormRightSection               { flex: 0 0 auto; display: block;}

    .NoPadRight                     { padding-right: 0;}
    .NoPadLeft10                    { padding-left: 10px;}

    .NoPadRight10:nth-child(odd)    { padding-right: 20px; padding-right: 10px;}
    .NoPadRight10:nth-child(even)   { padding-left: 10px; padding-right: 20px;}

    
    .FormLeftSection 	            { padding:30px 10px 15px;}
    .FormRightSection               { padding: 35px 10px 50px;}

    .SavingValue .HeadingSmall      { border-right: 0 solid #7D7D7D; }
    .SavingValue .HeadingMedium     { border-right: 0 solid #7D7D7D; }
    .SavingValue .HeadingAED        { border-right: 0 solid #7D7D7D; color: #f0dd41;}
    .SavingValue p                  { border-right: 0 solid #7D7D7D; border-bottom: 1px solid #7D7D7D;}

    .FormRightSection p             { padding-bottom: 30px;};

    .PayingValue                    { padding-top: 15px;}

    .TnCDetails                     { padding-top: 10px;}

    .DisplaySetting                 { display: flow; flex-direction: column; justify-content: space-between; height: 100%; }
    .DisplayStretch1                { flex-flow: column; flex: 0 auto; justify-content: flex-end; align-items: center; display: flex;}
    .DisplayStretch2                { flex-flow: column; flex: 0 auto; justify-content: flex-end;  display: flex;}
    .hidden-xs{
        display:block;
    }
    .img-responsive{
		display:none;
	}
    
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 

    .BG 				            { padding: 50px; }

    .FormLeftSection 	            { border-radius: 15px 0 0 15px; padding:30px 20px 15px;}
    .FormRightSection               { border-radius: 0 15px 15px 0; padding: 30px 10px 30px; display: block;}

    .FormLeftSection h1	            { font-size: 34px; }
    .FormLeftSection h3	            { font-size: 16px; }

    .GrayBGSection .Heading         { padding-top: 10px;}

    .col-form-label                 { padding-top: 12px;}

    .CardBGSection                  { background: rgba(151, 151, 151, 0.09); border-radius: 15px; padding: 15px 15px 15px; margin: 0 0 20px 0;}
    .CardTitleRow                   { margin-bottom: 10px; margin-right: 0px;}

    .CardBGSection .col-form-label  { font-size: 12px; padding-top: 25px;}

    .PayingValue                    { padding-top: 20px;}

    .FormDetailSection              { padding-top: