@font-face{font-family:'Belfius21';src:url(../../../clientlibs/clientlib-pbb/resources/fonts/Belfius21-Regular.ttf)}
html{scroll-behavior:smooth}
body{font-family:'Belfius21';margin:0;padding:0}
.sections{display:flex}
@media(max-width:767px){.sticky-button{position:fixed;bottom:0;left:50%;transform:translateX(-50%);z-index:1000;background:linear-gradient(77deg,#c30045 6%,#c30046 52.32%,#e85aa7 112.91%);color:#FFF;border:0;padding:12px 24px;font-size:16px;font-weight:700;width:100%;overflow-y:auto;height:auto;border-top-left-radius:30px;border-top-right-radius:30px;cursor:pointer;transition:background-color .3s,color .3s;display:none}
}
@media(max-width:1023px){.sections{flex-direction:column-reverse}
.sections.non-stick{position:relative;padding-bottom:120px}
}
.sticky-button{display:none}
.sticky-button.show{display:block}
*{box-sizing:border-box}
.appointment-bottom{display:none}
.side-menu{position:sticky;height:100vh;top:0;left:0;box-sizing:unset;flex:1;max-width:355px;background:linear-gradient(77deg,#c30045 6%,#c30046 52.32%,#e85aa7 112.91%);padding:10px}
.side-menu.open{transform:translateX(0)}
.main-fr{padding:0 11px;color:#fff}
.main-nl{padding:0 9px;color:#fff}
.banner-logo{width:618.108px;height:410px;right:60%;top:90%;position:relative}
.back-button{color:white;border:0;padding:8px 15px;font-size:14px;cursor:pointer;margin-left:-19px;margin-bottom:12px}
.back-button:hover{text-decoration:underline}
.pension h1{color:white;font-size:18px;margin-bottom:20px;margin-top:25px}
.pension{width:100%}
.closeicon{display:none}
.input-group{margin-bottom:20px}
.input-group label{font-weight:200;font-size:11px;margin-bottom:5px;padding-right:5px}
.input-label-fr{display:inline-block}
.input-label-nl{display:inline}
.label-tooltip-section{display:flex;justify-content:space-between}
.tooltip-icon{display:inline-block;position:relative;font-size:13px;color:#FFF;cursor:pointer}
.tooltip-icon.active span{visibility:visible;opacity:1}
@media(hover:hover){.tooltip-icon:hover span{visibility:visible;opacity:1}
}
.tooltip-icon span{font-size:10px;visibility:hidden;opacity:0;width:200px;color:#c30045;background-color:#fef6f9;text-align:left;border-radius:5px;padding:10px;position:absolute;z-index:1;bottom:125%;left:50%;transition:opacity .3s}
@media(min-width:320px) and (max-width:767px){.tooltip-icon{left:-3px}
.tooltip-icon:hover span{left:-185px}
.tooltip-icon.active span{left:-185px}
}
.tooltip-text-fr{transform:translateX(-50%)}
.tooltip-text-nl{transform:translateX(0)}
.input-wrapper input{border:0;outline:0;font-size:14px;flex:1;background-color:#fff5f7;color:#5e5c5c}
.input-wrapper-fr{display:flex;align-items:center;background-color:#fff5f7;border:1px solid #ccc;border-radius:7px;padding:10px;font-size:14px;margin-bottom:10px;color:#000}
.input-wrapper-nl{margin-top:5px;display:flex;align-items:center;background-color:#fff5f7;border:1px solid #ccc;border-radius:7px;padding:10px;font-size:14px;margin-bottom:10px;color:#000}
.input-suffix{margin-left:5px;font-size:14px;color:#888}
.error_msg{color:#fff;font-size:12px;margin-bottom:10px}
.text h6{text-align:center;font-weight:300;font-size:13px;width:100%;word-spacing:4px;color:#fff;height:8px;margin-top:-7px}
.btn-grp{display:flex;flex-direction:column;justify-content:space-between;gap:10px}
.btn-grp button{z-index:1;padding:10px;font-size:18px;border:var(--sizing-border-width-px,1px) solid var(--group-color-stroke-action-white-default,#FFF);cursor:pointer}
.header-btns{display:none}
.params{display:flex}
.header-btns span{font-size:18px;color:#8f0033}
.main-fr .header-btns img,.main-nl .header-btns img{width:15px;height:15px;margin-right:5px}
.download{margin-right:21px}
.recalculate{font-weight:600;width:100%;border-radius:var(--sizing-radius-full,9999px);opacity:var(--effect-opacity-100,1);background:var(--group-color-background-action-transparent_alternative-default,rgba(255,255,255,0.00));color:#FFF}
.appointment{font-weight:600;width:100%;border-radius:var(--sizing-radius-full,9999px);opacity:var(--effect-opacity-100,1);background:var(--group-color-background-action-white-default,#FFF);color:#d40f55}
.btnURL{font-weight:600;padding:10px;border-radius:var(--sizing-radius-full,9999px);opacity:var(--effect-opacity-100,1);background:linear-gradient(77deg,#c30045 6%,#c30046 52.32%,#e85aa7 112.91%);color:#FFF;border:0}
.print{font-weight:600;width:100%;color:#d40f55;border-radius:var(--sizing-radius-full,9999px);opacity:var(--effect-opacity-100,1);background:var(--group-color-background-action-white-default,#FFF)}
@media(max-width:767px){.appointment{display:none}
.appointment-bottom{display:block !important;margin-left:auto;margin-right:auto;margin-top:10px;border-radius:var(--sizing-radius-full,9999px);opacity:var(--effect-opacity-100,1);background-color:#d40f55;color:#FFF;padding:6px 15px 10px 15px;justify-content:center;align-items:center;font-family:'Belfius21';font-size:16px;border-color:#FFF;border:2px solid #f7f3f3;box-shadow:5px 5px 10px rgba(0,0,0,0)}
.side-menu{max-width:767px}
.main-fr,.main-nl{padding:0 4px}
.input-group label{font-size:9px;font-weight:200}
.pension h1{font-size:15px}
.tooltip-text-fr{transform:translateX(0)}
.tooltip-text-nl{transform:translateX(0)}
}
@media(min-width:768px) and (max-width:1023px){.side-menu{right:10px}
.main-fr,.main-nl{padding:0 10px}
.input-group label{font-size:10px}
.tooltip-text-fr{transform:translateX(-100%)}
.tooltip-text-nl{transform:translateX(-85%)}
}
@media(max-width:1023px){.non-stick .side-menu{left:auto;top:auto;box-sizing:border-box;position:fixed;bottom:0;z-index:1;width:100%;height:auto;border-top-left-radius:30px;border-top-right-radius:30px}
.banner-logo{display:none}
.back-button{display:none}
.pension{display:none}
.side-menu.open .pension{display:block;border-top:1px solid #8f0033}
.side-menu.open .editicon{display:none}
.side-menu.open .closeicon{display:block}
.input-wrapper{border-color:#000}
.text{display:none}
.header-btns{display:flex;justify-content:space-around;align-items:center;margin-bottom:10px;font-size:16px}
.print{display:none}
.side-menu.absolute{position:absolute;bottom:0}
}
.result-header{overflow-y:auto;flex:1;padding:0 40px}
.result-header h1{color:#c30045;font-size:36px;font-weight:600}
.description{color:#000;font-size:16px;word-spacing:3px;line-height:26px}
.readmore-toggle{display:inline-block;margin-top:15px}
.readmore-content{display:none}
.readless-content{display:none}
.tabs{display:flex;gap:40px;margin-top:30px;border-bottom:1px solid #e8ebed;cursor:pointer;font-size:18px;font-style:normal;font-weight:700;line-height:140%;color:#51626f}
.tabs .active{border-bottom:2px solid #dc0078;font-weight:bold;color:#dc0078}
.financial-section{color:#000;border-radius:5px;padding:20px 0;margin-bottom:20px}
.financial-summary{border-radius:24px;display:flex;gap:48px;align-items:center;background:#fff5f7;padding:32px 48px}
.financial-summary p{font-size:16px;margin:10px 0;line-height:1.6}
.highlight{font-weight:bold}
.icons{display:flex;justify-content:space-around;margin-top:20px;margin-bottom:50px}
.icon{align-items:center;text-align:center;flex:1;padding:10px 20px;position:relative;display:flex;flex-direction:column;align-self:stretch}
.icon img{width:48px;height:48px}
.icon span{align-self:stretch;text-align:center;font-size:14px;font-weight:600;color:#000;letter-spacing:-0.36px;padding:15px}
.icon:not(:last-child){border-right:1px solid #ddd}
.tabcontent{display:none}
.head-content{color:var(--Color-Ruby-500,#c30045);font-family:Belfius21;font-size:32px;font-weight:400;line-height:130%;letter-spacing:-0.64px}
.financial-summary h3{color:var(--Color-Ruby-500,#c30045);font-family:Belfius21;font-size:32px;font-style:normal;font-weight:700;line-height:130%;letter-spacing:-0.64px}
.result-header p{color:#000}
.expenses-tooltip{color:#000;border-radius:24px;display:flex;gap:16px;font-size:16px;padding:16px 32px 16px 16px;line-height:150%;background:#fff5f7;align-items:flex-start;margin-bottom:20px}
.tail-content{display:none}
.tab-header{display:none}
.legend{color:#000;display:flex;flex-direction:column;gap:15px;padding:0 60px;margin-bottom:25px}
.legend-item{display:flex;align-items:center;gap:25px}
.icon-img{width:20px;border-radius:150px}
.legend-text{color:#51626f;font-size:14px;font-style:normal;font-weight:400;line-height:150%}
.table-data{color:#000}
.tabcontent h4{color:var(--Color-Ruby-500,#c30045);font-family:Belfius21;font-size:24px;font-style:normal;font-weight:700;line-height:125%;letter-spacing:-0.48px}
.table-data h4{color:var(--Color-Ruby-500,#c30045);font-family:Belfius21;font-size:24px;font-style:normal;font-weight:700;line-height:125%;letter-spacing:-0.48px}
.table-datas{list-style-type:none;font-style:normal;padding:0;line-height:125%;letter-spacing:-0.48px;color:#000}
.table-datas li{display:flex;padding:10px;justify-content:space-between;align-items:center}
.table-datas li:nth-child(even){background-color:#f7f7f7;border-bottom:1px solid #e8ebed;border-top:1px solid #e8ebed}
.table-datas li strong{width:25%;text-align:right}
@media(max-width:767px){.result-header{width:100%;padding:0 25px}
.financial-summary{flex-direction:column;gap:0;padding:0 30px 15px 30px}
.financial-section{padding:0}
.icons{flex-direction:column}
.icon{flex-direction:row;padding:10px 0;gap:10px}
.icon span{padding:15px 0;font-size:12px}
.icon:not(:last-child){border-right:0;border-bottom:1px solid #ddd}
.tab-header{padding-top:20px;color:#000;display:block;font-size:32px;line-height:125%;letter-spacing:-0.64px}
.tabs{display:none}
.tabcontent{display:block;margin-bottom:20px}
.expenses-tooltip{flex-direction:column}
.expenses-tooltip img{width:40px;height:40px}
.financial-section,#chart2,#chart{margin-top:20px}
.head-content{display:none}
.tail-content{display:block;color:var(--Color-Ruby-500,#c30045);font-family:Belfius21;font-size:28px;font-style:normal;font-weight:400;line-height:130%;letter-spacing:-0.56px}
.legend{padding:0 10px}
.table-data h4{font-size:18px}
.table-data table tbody tr td:nth-child(2){padding-left:20px}
.table-datas li strong{width:75%}
}
@media(min-width:768px) and (max-width:1023px){.result-header{padding:0 30px}
.description{font-size:15px;font-weight:600}
}
@media(min-width:768px){.desktopversion{display:block}
.mobileversion{display:none}
}
@media(min-width:320px) and (max-width:767px){.desktopversion{display:none}
.mobileversion{display:block}
}