/* Common Style Start */
@font-face {
    font-family: "Roboto";
    src: url("../font/Roboto-Light.woff2") format("woff2"), url("../font/Roboto-Light.woff") format("woff"), url("../font/Roboto-Light.svg#Roboto-Light") format("svg"), url("../font/Roboto-Light.ttf") format("ttf");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Roboto";
    src: url("../font/Roboto-Regular.woff2") format("woff2"), url("../font/Roboto-Regular.woff") format("woff"), url("../font/Roboto-Regular.svg#Roboto-Regular") format("svg"), url("../font/Roboto-Regular.ttf") format("ttf");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Roboto";
    src: url("../font/Roboto-Medium.woff2") format("woff2"), url("../font/Roboto-Medium.woff") format("woff"), url("../font/Roboto-Medium.svg#Roboto-Medium") format("svg"), url("../font/Roboto-Medium.ttf") format("ttf");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Roboto";
    src: url("../font/Roboto-Bold.woff2") format("woff2"), url("../font/Roboto-Bold.woff") format("woff"), url("../font/Roboto-Bold.svg#Roboto-Bold") format("svg"), url("../font/Roboto-Bold.ttf") format("ttf");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
* {
    padding: 0;
    margin: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
html {
    font-size: 62.5%;
    /* changes a default 16px font size to 10px */
}
body {
    font-family: "Roboto", sans-serif;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.4;
    color: #222222;
    background-color: #f4f6fa;
}
a {
    text-decoration: none;
}
.hidden {
    display: none !important;
}
.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.flex-column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}
.flex-align-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.flex-justify-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.flex-justify-between {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-weight: 700;
    font-size: 1.4rem;
    line-height: 1;
    padding: 1.6rem 4.6rem;
    border: 1px solid transparent;
    border-radius: 3.8rem;
    text-align: center;
    cursor: pointer;
    text-transform: uppercase;
}
.button-white {
    color: #da251c;
    border-color: #da251c;
    background-color: #fff;
}
.button-primary {
    color: #fff;
    background-color: #da251c;
}
.button-block {
    display: block;
    width: 100%;
}
.primary-title {
    font-weight: 500;
    font-size: 1.8rem;
    margin-bottom: 0;
}
.secondary-title {
    font-weight: 700;
    font-size: 2.4rem;
    margin-bottom: 0;
}
.yellow-highlight {
    color: #ffcc33;
}
.white-box {
    padding: 1.6rem;
    background-color: #fff;
    border-radius: 0.5rem;
}
.list {
    padding-left: 2rem;
}
.list li .list {
    margin-top: 1.6rem;
}
.unorder-list {
    list-style: disc;
}
.position-relative {
    position: relative;
}
.container {
    width: 100%;
    padding-right: 1.6rem;
    padding-left: 1.6rem;
    margin-left: auto;
    margin-right: auto;
}
@media screen and (min-width: 576px) {
    .container {
        max-width: 540px;
    }
}
/* Common Style End */

/* Header, Fotter and Main Content Style Start */
.fixed-header {
    padding-top: 5.6rem;
}
.has-navigation {
    padding-bottom: 7.2rem;
}
.header {
    min-height: 56px;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    width: 100%;
}
.main-content {
    overflow: auto;
}
.fixed-header .main-content {
    height: calc(100vh - 57px);
}
.has-navigation .main-content {
    height: calc(100vh - 72px);
}
.fixed-header.has-navigation .main-content {
    height: calc(100vh - 128px);
}
.back-button {
    font-weight: 500;
    font-size: 1.6rem;
    border: none;
    color: #003366;
    background-color: transparent;
}
.back-button img {
    width: 18px;
    margin-right: 0.4rem;
}
/* Header, Fotter and Main Content Style End */

/* Header Styles Start */
header {
    padding: 1.6rem 2.4rem;
    background-color: #da251c;
}
.logo-link {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.logo-img {
    width: 100%;
    max-height: 25px;
}
/* Header Styles End */

/* Protect Family Styles Start */
.kgso-landing {
    background: url("../img/kgso-landing.png") no-repeat center/cover;
    padding-bottom: 3rem;
}
.protect-family-banner {
    min-height: 420px;
    padding-top: 8rem;
    padding-bottom: 8rem;
    color: #333;
    /* background: -o-linear-gradient(353.66deg, #006666 0%, #003366 100%);
    background: linear-gradient(96.34deg, #006666 0%, #003366 100%);
    border-radius: 0 0 1.4rem 1.4rem; */
    margin-bottom: 3rem;
}
.protect-family-banner .container {
    position: relative;
}
.primary-title {
    max-width: 50%;
    color: #fff;
    position: relative;
    z-index: 1;
}
.primary-title::before {
    content: "";
    position: absolute;
    top: -20px;
    right: calc(100% - 130%);
    bottom: -20px;
    background-color: rgb(30, 70, 121);
    width: 100vw;
    z-index: -1;
}
@media screen and (min-width: 768px) {
    .primary-title::before {
        right: calc(100% - 150%);
    }
}
.protect-family-img {
    width: 100%;
    max-width: 375px;
    position: absolute;
    top: -68px;
    right: 0;
    z-index: 1;
}
.protect-family-benifits {
    gap: 1.6rem;
    max-width: 50%;
    list-style-position: outside;
    list-style-image: url("../img/check-small.svg");
    padding-left: 2rem;
    margin: 5rem 0 0;
}
/* Protect Family Styles End */

/* Life Cover Styles Start */
.kgso-card-header {
    padding: 2rem 3.4rem;
    color: #fff;
    background: -o-linear-gradient(353.66deg, #d85004 0%, #f94f78 100%);
    background: linear-gradient(96.34deg, #d85004 0%, #f94f78 100%);
    -webkit-box-shadow: 0 4px 13px rgb(0 0 0 / 19%);
    box-shadow: 0 4px 13px rgb(0 0 0 / 19%);
    border-radius: 1.4rem;
}
.kgso-card {
    padding: 1.8rem 2.4rem;
    margin: -3.4rem 0.8rem 3.4rem 0.8rem;
    color: #fff;
    background: -o-linear-gradient(353.66deg, #da251c 0%, #da6d71 100%);
    background: linear-gradient(96.34deg, #da251c 0%, #da6d71 100%);
    background-image: url("../img/card-bg.svg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom right;
    border-radius: 1.4rem;
    text-align: center;
}
.kgso-card-header {
    padding: 2rem 3.4rem;
    margin: -3.4rem -3.4rem 0 -3.4rem;
    color: #fff;
    background: -o-linear-gradient(353.66deg, #d85004 0%, #f94f78 100%);
    background: linear-gradient(96.34deg, #d85004 0%, #f94f78 100%);
    -webkit-box-shadow: 0 4px 13px rgba(0, 0, 0, 0.19);
    box-shadow: 0 4px 13px rgba(0, 0, 0, 0.19);
    border-radius: 1.4rem;
}
.kgso-card-title {
    font-weight: 700;
    font-size: 2rem;
    margin-bottom: 0.8rem;
}
.kgso-card-body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1.6rem;
    padding-top: 1.8rem;
}
.avail-life-cover {
    font-weight: 300;
    font-size: 1.6rem;
    margin-bottom: 0;
}
.life-cover-amount {
    font-weight: 300;
    font-size: 4rem;
    margin-bottom: 0;
}
.life-cover-amount span {
    font-size: 1.4rem;
}
/* Life Cover Styles End */

/* Download Brochure & Terms Condition Style Start */
.brochure-condition-section {
    text-align: center;
}
.kgso-landing .download-brochure {
    padding-bottom: 0.4rem;
    margin-bottom: 3rem;
    border-bottom: 1px solid #003366;
}
.download-brochure {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: 500;
    color: #003366;
}
.download-brochure img {
    width: 24px;
    margin-right: 0.4rem;
}
.terms-condition-link {
    font-size: 1.6rem;
    -webkit-text-decoration-line: underline;
    text-decoration-line: underline;
    color: #0a85ff;
}
/* Download Brochure & Terms Condition Style End */

/* Terms and Condition Style Start */
.text-section {
    padding: 1.6rem 0;
}
.terms-condition.white-box {
    gap: 1.6rem;
}
.term {
    color: #999;
}
.term strong {
    font-weight: 500;
    color: #263238;
}
/* Terms and Condition Style End */

/* Fixed Navigation Style Start */
.navigation {
    padding: 1.4rem 1.6rem;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    -webkit-box-shadow: 0 0 3px rgb(0 0 0 / 25%);
    box-shadow: 0 0 3px rgb(0 0 0 / 25%);
}
/* Fixed Navigation Style End */

/* Declaration Style Start */
.declaration-section .secondary-title {
    margin-bottom: 1.6rem;
}
.declaration-by-memb{
    margin-top: 24px;
    margin-bottom: 0px!important;
}
.declaration {
    color: #263238;
}
.declaration,
.declaration .order-list,
.declaration .unorder-list {
    gap: 1.6rem;
}
.payment-redirect {
    height: calc(100vh - 160px);
}
/* Declaration Style End */

/* Payment Popup Style Start */
.popup {
    margin: 9rem 0 2.4rem;
    padding: 3.2rem;
    gap: 1.6rem;
    min-height: 270px;
    background-color: #fff;
    border-radius: 0.8rem;
    text-align: center;
    -webkit-filter: drop-shadow(0 6px 4px rgba(0, 0, 0, 0.12));
    filter: drop-shadow(0 6px 4px rgba(0, 0, 0, 0.12));
}
.popup p {
    font-weight: 500;
}
/* Payment Popup Style End */

/* Form Style Start */
.form-steps {
    font-size: 1.2rem;
    color: #999;
    list-style: none;
    text-align: center;
    gap: 3.4rem;
    margin: 0.8rem 0 2.4rem;
}
.form-steps li {
    max-width: 85px;
    position: relative;
}
.form-steps li:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 100%;
    top: 12px;
    width: 30px;
    height: 1px;
    background-color: #999;
}
.form-steps li:nth-child(3)::after {
    display: none;
}
.form-step-count {
    width: 24px;
    height: 24px;
    line-height: 1.8;
    margin: 0 auto 1.2rem;
    border: 1.5px solid #999;
    border-radius: 2.4rem;
}
.active-step .form-step-count,
.active-step .form-step-label {
    font-weight: 700;
    color: #222;
    border-color: #222;
}
.form-steps li.active-step::after {
    background-color: #0a85ff;
}
.life-cover-form {
    gap: 1.6rem;
}
.life-cover-form .form-label {
    width: 100%;
    display: block;
    font-weight: 500;
    color: #222;
    margin-bottom: 0.8rem;
}
.life-cover-form .form-input,
.life-cover-form .form-select {
    width: 100%;
    font-weight: 500;
    font-size: 1.6rem;
    padding: 1.2rem;
    color: #222;
    border: 1px solid #ccc;
    background-color: #fff;
    border-radius: 0.5rem;
}
.life-cover-form .form-select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url("../img/expand-more.svg") no-repeat right 1.2rem center/1.2rem;
    cursor: pointer;
}
.life-cover-form .form-input::-webkit-input-placeholder {
    color: #999;
}
.life-cover-form .form-input::-moz-placeholder {
    color: #999;
}
.life-cover-form .form-input:-ms-input-placeholder {
    color: #999;
}
.life-cover-form .form-input::-ms-input-placeholder {
    color: #999;
}
.life-cover-form .form-input::placeholder {
    color: #999;
}
.life-cover-form .form-input:active,
.life-cover-form .form-input:hover,
.life-cover-form .form-input:focus,
.life-cover-form .form-input:visited,
.life-cover-form .form-input:target,
.life-cover-form .form-input:focus-visible,
.life-cover-form .form-input:focus-within,
.life-cover-form .form-select:active,
.life-cover-form .form-select:hover,
.life-cover-form .form-select:focus,
.life-cover-form .form-select:visited,
.life-cover-form .form-select:target,
.life-cover-form .form-select:focus-visible,
.life-cover-form .form-select:focus-within {
    border-color: #222;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.life-cover-form .form-group {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.form-group .col-half {
    width: 50%;
}
input[type="number"] {
    -moz-appearance: textfield;
}
.life-cover-form .form-input::-webkit-outer-spin-button,
.life-cover-form .form-input::-webkit-inner-spin-button,
input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-calendar-picker-indicator {
    /* display: none; */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
input[type="date"]:before {
    color: #999;
    content: "DD/MM/YYYY";
    pointer-events: none;
    position: absolute;
    top: 1px;
    right: 1px;
    bottom: 1px;
    left: 1px;
    padding: 1.2rem;
    background-color: #fff;
    border-radius: 0.5rem;
}
.form-group .calendar-icon {
    width: 14px;
    position: absolute;
    right: 15px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    pointer-events: none;
    background-color: #fff;
}
input[type="radio"] + label {
    cursor: pointer;
    position: relative;
    padding-left: 3rem;
    margin-bottom: 0;
}
input[type="radio"] + label:before {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    margin-right: 1.4rem;
    position: absolute;
    top: -1px;
    left: 0;
    border: 1px solid #999;
    background-color: #fff;
    border-radius: 50%;
}
input[type="radio"] {
    display: none !important;
    *display: inline;
}
input[type="radio"]:checked + label:before {
    border-color: #003366;
}
input[type="radio"]:checked + label:after {
    content: "";
    display: block;
    position: absolute;
    top: 4px;
    left: 5px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #003366;
}
input[type="checkbox"] + label {
    cursor: pointer;
    position: relative;
    padding-left: 3rem;
    margin-bottom: 0;
}
input[type="checkbox"] + label:before {
    content: "";
    display: block;
    width: 16px;
    height: 16px;
    margin-right: 1.2rem;
    position: absolute;
    top: 0;
    left: 0;
    border: 1px solid #999;
    background-color: #fff;
    border-radius: 0.4rem;
}
input[type="checkbox"] {
    display: none !important;
    *display: inline;
}
input[type="checkbox"]:checked + label:after {
    content: "✔";
    font-size: 1.2rem;
    line-height: 2;
    color: #fff;
    background-color: #003366;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 18px;
    height: 18px;
    border-radius: 0.3rem;
}
.policy-summary-box {
    font-size: 1.6rem;
    gap: 1.6rem;
    margin-top: 2.4rem;
}
.policy-summary-row .policy-summary-label {
    width: 100%;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 120px;
    flex: 0 0 120px;
    max-width: 120px;
    color: #707070;
}
.policy-summary-row .policy-summary-value {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-left: 1rem;
    text-align: right;
}
.policy-summary-row .policy-summary-value strong {
    display: block;
}
/* Form Style End */

/* upload selfie */
.upload-selfie{
    background: rgba(10, 133, 255, 0.06);
    border: 1px dashed #CCCCCC;
    border-radius: 8px;
}
.upload-selfie-caption{
    text-align: center;
    padding-top: 78px;
    padding-bottom: 98px;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
}
.upload-selfie-note{
    display: flex;
    align-items:center;
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    color: #222222;
}
.upload-selfie-note span{
    opacity: 0.5;
}
.file-chooser{
    color: #0A85FF;
    text-decoration-line: underline;
}
/* upload selfie */

/* **********************
REVIEW DETAIL START 
********************** */
.review-detail-label{
    word-spacing: 9px;
}
.policy-detail{
    padding: 32px 0;
}
.policy-detail-heading{
    font-weight: 700;
    font-size: 18px;
    line-height: 128%;
    display: flex;
    align-items: center;
    color: #222222;
}
.policy-term{
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    color: #707070;
    margin-top: 15px ;
}
.policy-term-date{
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    color: #222222;
    margin-top: 5px;
}
.policy-detail-box{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-top: 12px ;
}
.policy-sum-name, .policy-premium-name{
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    color: #707070;
    margin-bottom: 10px;
}
.policy-premium-name{
    margin-top: 30px;
}
.policy-sum-amount{
    font-weight: 700;
    font-size: 16px;
    line-height: 16px;
    /* text-align: right; */
    color: #000000;
}
.policy-premium-amount{
    font-weight: 700;
    font-size: 16px;
    line-height: 16px;
    color: #000000;
}

.personal-detail{
    padding: 32px 0 20px 0;
    border-top: 1px solid #D9D9D9;
}
.personal-detail-heading, .address-main-heading{
    font-weight: 700;
    font-size: 18px;
    line-height: 128%;
    display: flex;
    align-items: center;
    color: #222222;
}
.address-main{
    /* margin-top: 30px; */
    padding: 20px 0;
}
.personal-detail-name, .personal-detail-dob, .personal-detail-email, .personal-detail-number, .current-address, .permanent-address{
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #999999;
    margin-top: 30px;
}
.personal-detail-entered-name, .personal-detail-entered-dob, .personal-detail-entered-email, .personal-detail-entered-number, .permanent-address-heading, .current-address-heading{
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    color: #222222;
    margin-top: 8px;
}
.personal-detail-box{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-top: 0px!important ;
}
.nominies-detail{
    border-top: 1px solid #D9D9D9;
    padding: 32px 0;
}
/* **********************
REVIEW DETAIL START 
********************** */