@charset "utf-8";

.GridRupees{display:inline-block;font-family:"FontAwesome"}
.animated{animation-duration:.8s;animation-fill-mode:both}
@keyframes fadeIn {
0%{opacity:0}
100%{opacity:1}
}
@keyframes fadeInUp {
0%{opacity:0;transform:translateY(50px)}
100%{opacity:1;transform:translateY(0)}
}
@keyframes fadeInDown {
0%{opacity:0;transform:translateY(-50px)}
100%{opacity:1;transform:translateY(0)}
}
@keyframes zoom-in {
0%{opacity:0;transform:scale(.8)}
100%{opacity:1;transform:scale(1)}
}
@keyframes fadeInLeft {
0%{opacity:0;transform:translateX(-50px)}
100%{opacity:1;transform:translateX(0)}
}
@keyframes fadeInRight {
0%{opacity:0;transform:translateX(50px)}
100%{opacity:1;transform:translateX(0)}
}
.fadeInLeft{animation-name:fadeInLeft}
.fadeInRight{animation-name:fadeInRight}
.fadeIn{animation-name:fadeIn}
.fadeInUp{animation-name:fadeInUp}
.fadeInDown{animation-name:fadeInDown}
.zoomIn{animation-name:zoom-in}
html{font-family:var(--regular);-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{margin:0;padding:0;font-family:open_sanslight;font-size:14px}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}
audio,canvas,progress,video{display:inline-block;vertical-align:baseline}
audio:not([controls]){display:none;height:0}
[hidden],template{display:none}
a{background-color:transparent;text-decoration:none!important}
a:active,a:hover{outline:0;text-decoration:none}
abbr[title]{border-bottom:1px dotted}
b,strong{font-weight:700}
dfn{font-style:italic}
h1{font-size:2em;margin:.67em 0}
mark{background:#ff0;color:#000}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sup{top:-.5em}
sub{bottom:-.25em}
img{border:0}
svg:not(:root){overflow:hidden}
figure{margin:1em 40px}
hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}
pre{overflow:auto}
code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}
button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}
button{overflow:visible}
button,select{text-transform:none}
button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}
button[disabled],html input[disabled]{cursor:default}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
input{line-height:normal}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}
input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}
input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}
input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}
legend{border:0;padding:0}
textarea{overflow:auto}
optgroup{font-weight:700}
table{border-collapse:collapse;border-spacing:0}
td,th{padding:0}
ul,li{list-style:none}
:focus{outline:0}
.pr{position:relative}
.trans{transition:all .5s ease}
.no-gutter > [class*='col-']{padding-right:0;padding-left:0}
.gutter5px > [class*='col-']{padding-right:5px;padding-left:5px}
.row-centered{text-align:center}
.tR{text-align:right}
.cb{clear:both}
.col-xs-5ths,.col-sm-5ths,.col-md-5ths,.col-lg-5ths{position:relative;min-height:1px;padding-right:10px;padding-left:10px}
.col-xs-5ths{width:20%;float:left}
@media (min-width: 768px) {
.col-sm-5ths{width:20%;float:left}
}
@media (min-width: 992px) {
.col-md-5ths{width:20%;float:left}
}
@media (min-width: 1200px) {
.col-lg-5ths{width:20%;float:left}
}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0}
/*Range Slider Start*/
.rangeslider,.rangeslider__fill{display:block;border-radius:10px}
.rangeslider{background:#ececec;position:relative}
.rangeslider--horizontal{height:2px;width:100%}
.rangeslider--vertical{width:20px;min-height:150px;max-height:100%}
.rangeslider--disabled{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=40);opacity:.4}
.rangeslider__fill{background:var(--yellow);position:absolute}
.rangeslider--horizontal .rangeslider__fill{top:0;height:100%}
.rangeslider--vertical .rangeslider__fill{bottom:0;width:100%}
.rangeslider__handle{ cursor: pointer;    display: inline-block;    width: 15px;    height: 15px;    position: absolute;    border-radius: 50%;    background: var(--green);}
.rangeslider--horizontal .rangeslider__handle:active,.rangeslider--horizontal .rangeslider__handle:hover{    top: -10px;}
.rangeslider__handle:active, .rangeslider__handle:hover {  width: 20px;    height: 20px; }
.rangeslider__handle:hover:after,.rangeslider__handle:active:after{    content: "";    display: block;    width: 36px;    height: 36px;    margin: auto;    position: absolute;    top: 0px;    right: 0px;    bottom: 0;    left: -8px;    border-radius: 50%;    background-color: rgba(0, 0, 0, .06);}
.rangeslider--horizontal .rangeslider__handle{top:-7px;touch-action:pan-y;-ms-touch-action:pan-y}
.rangeslider--vertical .rangeslider__handle{left:-10px;touch-action:pan-x;-ms-touch-action:pan-x}
input[type="range"]:focus + .rangeslider .rangeslider__handle{-moz-box-shadow:0 0 8px rgba(255,0,255,0.9);-webkit-box-shadow:0 0 8px rgba(255,0,255,0.9);box-shadow:0 0 8px rgba(255,0,255,0.9)}
/*Range Slider End*/
.GolasSliderWrap [class*='col-'] {height:calc(100vh - 100px);display:table;}
.GoalQBoxBg, .GoalABoxBg { display:table-cell;vertical-align:middle; }
.GoalQBox{    position: relative;background-color:#fff;padding:80px 65px 65px 65px;text-align:center;border-radius:5px;    box-shadow: 2px 2px 2px 0 #c2c2c2;}
.GoalQBox > b{display:block;font-weight:400;font-size:25px;line-height:25px;margin:10px 0 5px 0;color:var(--green)}
.GoalQBox > p{display:block;margin:0;font-size:13px;line-height:14px;color:#a8a8a8}
.goalInput{width:320px;display:block;margin:35px auto 55px auto;position:relative}
.goalInput.TwoDigit{width:135px;}
.goalInput > input{     width: 100%;    height: 55px;    border: none;    border-radius: 5px;    padding-left: 50px;    font-size: 45px;    line-height: 55px;    font-family: var(--regular);    text-align: left;    color:var(--green);     background-color: rgb(245, 245, 245);}
.goalInput.TwoDigit > input{padding-left:5px;padding-right:30px}
.goalInput > em{position:absolute;left:10px; bottom: 5px;font-size:20px;line-height:30px;color: var(--green);font-style:normal;font-weight:bold}
.goalInput > em > i{padding-left: 15px;}
.goalInput.TwoDigit > em{    left: auto;    right: 5px;    bottom: 0px;}
.GolasSlider {overflow:hidden;z-index:9;}
.GolasSlider .slick-list{  box-shadow: 0 2px 2px 0 #c2c2c2}
.GolasSliderButton {text-align:center;margin-top:25px;}
.GolasSliderButton > a{display: inline-block !important;    height: 40px;    width: 130px;    text-align: center;    line-height: 40px;    background-color: var(--green);    text-transform: uppercase;    font-size: 20px;    color: #fff;    border-radius: 4px;}
.GolasSliderButton > a.GolasSliderPrev{background-color: var(--green);    margin-right: 25px;display:inline-block !important}
.GolasSliderButton > a.GolasSliderPrev.slick-disabled{display:none !important;}


.GoalABox {border-radius:5px;padding:80px 65px 65px 65px;    position: relative;}
.GoalABoxWhite {height: 125px;    background-color: #fff;    position: relative;    display: table;    width: 100%;margin-bottom: 20px;border-radius: 5px;}
.GoalABoxWhite > p{padding-left: 135px;    display: table-cell;    vertical-align: middle;    color: var(--green);    font-size: 16px;    line-height: 16px;    box-shadow: 2px 2px 2px 0 #c2c2c2;}
.GoalABoxWhite > p > b {display:inline-block;font-weight:normal; }
.GoalABoxWhite > p > span {    display: block;    font-family: var(--smibold);    color: var(--green);    font-size: 40px;    line-height: 40px;    margin-top: 5px;}
.GoalABoxWhite > p > span > i {    font-size: 33px;    line-height: 33px;}
.GoalABoxWhite > em {position: absolute;    width: 65px;    height: 65px;      left: 30px;    top: 50%;    margin-top: -32px;    background-size: 100%;    background-repeat: no-repeat;    background-position: center center;}
.GoalABoxWhite > em:after{    content: '';    position: absolute;    width: 1px;    top: -10px;    bottom: -10px;    right: -13px;    background-color: #ececec;}
.GoalABoxWhite > em.target {    background-image: url('../images/target.svg');}
.GoalABoxWhite > em.savings {    background-image: url('../images/savings.svg');}
.GoalABoxBlue{    background-color: #1277bc;    height: 75px;    display: table;    width: 100%;border-radius: 5px;}
.GoalABoxBlue > p {display: table-cell;    vertical-align: middle;    padding: 20px;    color: #fff;    font-size: 15px;}
.GoalABoxBlue > p > a{    display: inline-block;    background: #fff;    text-align: center;    border-radius: 44px;    padding: 10px 25px;    margin-left: 20px;    text-transform: uppercase;    font-size: 16px;    line-height: 16px;    color: #1e366a;    transition: all .5s ease;}
.GoalABoxBlue > p > a:hover {   background: #1e366a; color: #fff;}
.GoalABoxRecalc{ text-align: center;    margin-top: 10px;}
.GoalABoxRecalc > a { display: inline-block; color:var(--green);    font-size: 18px;    line-height: 15px;    border-bottom: 1px solid var(--yellow);    padding-bottom: 2px;}


.goalheaderwrap { position: relative;  height: 105px; background-color: var(--green); }

.goalheadsec { display: inline-block; margin: 40px 0 0; text-align: left; font-family: var(--regular);}
.goalheadsec > h2 { color: var(--green); margin: 0; padding: 0 0 5px; font-size: 27px; line-height: 27px; text-transform:capitalize }
.goalheadsec > span {display: block; padding: 0 0 8px; color: var(--yellow); font-size: 14px; line-height: 14px; text-transform: uppercase; }
.goalheadsec .goalselect > span { color: var(--green); font-size: 13px; line-height: 18px; font-style: italic; display: inline-block; }
.goalheadsec .goalselect > ul { position: absolute; top: 20px; margin: 0; width: 200px; left: 0; background-color: #f4f7f6; color: #202121; padding: 0; visibility: hidden; opacity: 0; box-shadow: 5px 5px 15px 0px rgb(0 0 0 / 15%); z-index: 99; transition: all 0.3s ease-in-out; }
.backsec { display: inline-block; float: right; }
.backsec a.close { display: inline-block !important; margin: 40px 0; padding: 8px 18px; text-align: center; line-height: 25px; background-color: #fff; text-transform: uppercase; font-size: 14px; color: var(--green); border-radius: 4px; opacity: unset; text-shadow: none; min-width: 100px; float: right; }
.backsec a.close:hover{ opacity: unset !important; text-shadow: none; color: var(--green); }




.goalheaderwrapper { position: fixed; left: 0px; top: 0px; right: 0px; height: 120px; z-index: 1980; transition: all 0.3s ease; background-color:var(--green); border-bottom: 1px solid #e4e4e4; }
  
.goalheader { position: relative;  height: 105px; }
.goalheader > h1 { display: block; margin: 0; width:210px; height: 55px; position: absolute; left: 25px; top: 17px; z-index: 9997; background:url(../images/logo.svg) no-repeat center center; cursor: pointer; background-size: 100%; transition: all 0.3s ease; }
.goalheader > h1 > a { display: block; height: 100%; text-indent: -9999px; }
.goalheader > a {    position: absolute;    right: 0px;    top: 0px;    padding: 0;    border-left: 1px solid #efefef;    color: #d0d0d0;    display: block;    font-size: 29px;    bottom: 0;    width: 105px;    line-height: 105px;    text-align: center;}
.goalheadpage { position: absolute; display: block; top: 20px; right: 135px; text-align: right; font-family: var(--regular);}
.goalheadpage > h2{ margin: 0; display: block; }
.goalheadpage > span {display:block; color: var(--yellow); font-size: 14px; line-height: 14px; text-transform: uppercase; }
.goalheadpage > h2 { color: #fff; font-size: 27px; line-height: 27px;text-transform:capitalize }
.goalheadpage > a { color: #1e366a; font-size: 13px; line-height: 13px; font-style: italic; }
.goalheadpage > a:hover{color: #1e366a;}
.goalheadpage > b > a{ color: #fff; display: block; font-size: 15px; line-height: 18px; font-weight: normal; display:inline-block; padding-bottom:3px; border-bottom:1px solid var(--yellow)}
.goalcontentwrapper{position:relative}
.goalfooter {     height: 20px; background: var(--green) ; display:block;}


.goalselect {  position: relative; cursor:pointer;}
.goalselect > span { color: #fff; font-size: 13px; line-height: 18px; font-style: italic; display:inline-block;}
.goalselect > span:before{content:'Change Your Goal'}
.goalselect > ul {  position: absolute;    top: 20px; margin: 0;    width: 200px;       left: 50%;    margin-left: -82px; background-color: #f4f7f6;  color: #202121;     padding: 0;       visibility: hidden;    opacity: 0;     box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.15);    z-index: 99;      transition: all 0.3s ease-in-out; }
.goalselect > ul > li{    background-color: #f4f7f6;  cursor: pointer;    -webkit-transition: all 0.3s ease-in-out;    transition: all 0.3s ease-in-out;}
.goalselect > ul > li > a{    position: relative; text-align: center;   display: block;    font-size: 16px;    font-weight: 600;      padding: 10px;    color: #202121;}
.goalselect.open > ul{    padding: 10px 10px 0 10px;  visibility: visible;    opacity: 1;    }

.GoalQBox:before{width: 150px;height: 150px;content: '';display: block;position: absolute;left: 50%;top: 50%;margin-top: -230px;background-repeat: no-repeat; border-radius: 50%;margin-left: -75px;background-size: 100%;background-color: #fff;background-position: center center;z-index: 9990;}

.ChildEducationBG .GoalQBox:before{    background-image: url('../images/Child_Education-SQ.png');}
.BuyHomeBG .GoalQBox:before{    background-image: url('../images/Dream_Home_Planning-SQ.png');}
.RetireEasyBG .GoalQBox:before{    background-image: url('../images/Retirement_Planning-SQ.png');}
.WealthCreationBG .GoalQBox:before{    background-image: url('../images/WealthCreation.png');}
.childwedBG .GoalQBox:before{    background-image: url('../images/Marriage_Planning-SQ.png');}
.buyacarBG .GoalQBox:before{  background-image: url('../images/Dream_Vehicle-SQ.png');}
.holidayBG .GoalQBox:before{  background-image: url('../images/Vacation_Planning-SQ.png');}


@media only screen and (min-width : 1200px) {
    
}
	
@media only screen and (max-width: 992px) {
    .goalheader {    height: 70px;}
	.goalheader > h1 {    width: 125px;    height: 35px;    left: 10px;    top:20px;}
	.goalheader > a {      width: 70px;    padding: 0;    text-align: center;    line-height: 70px;}
	.goalheadpage > h2{font-size: 22px;}
	.goalheadpage > span{font-size: 12px;}
    .goalheadpage { position: static; text-align: left; padding-left: 10px;padding-top:10px }
    .goalheaderwrapper{height:175px} 
    .goalheader {    border-bottom: 1px solid #efefef;}
    .goalcontentwrapper{    padding-top: 0;}
	.GolasSliderWrap [class*='col-'] {height:auto;    width: 100%;display:block}
	.GoalQBoxBg {display:block;    padding-top: 30px;}
	.GoalABoxBg {display:block;   padding-top: 20px;}
	.goalselect > ul { left: 0;    margin-left: 0; }
	.GoalQBox:before{display:none;}
	.goalfooter{margin-top:25px;}

    .goalheadsec .goalheadpage > h2{font-size: 22px;}
	.goalheadsec .goalheadpage > span{font-size: 12px;}
	
	
}

@media only screen and (max-width: 767px) 
{
    
    .goalInput {width: auto;    margin: 16px auto 35px auto;}
    .GoalQBox,.GoalABox {    padding: 20px 20px 35px 20px;}
 /*.goalcontentwrapper:before{content:none}*/
    .GolasSliderButton > a {    height: 35px;    width: 100px;font-size: 18px;line-height:35px;}
    .GolasSliderButton > a.GolasSliderPrev {margin-right: 15px;}
    .GoalQBox > b {    font-size: 18px;    line-height: 20px;}
    
    .GoalABoxWhite {display:block;    height: auto;}
    .GoalABoxWhite > p {      text-align: center;    padding: 100px 10px 20px 10px;    width: 100%;    display: block;}
     .GoalABoxWhite > p > span {    margin-top: 15px;    font-size: 30px;    line-height: 30px;}
     .GoalABoxWhite > p > span > i {font-size: 26px;    line-height: 26px;}
    .GoalABoxWhite > em{    top: 10px;    left: 50%;    margin-left: -32px;    display: block;    margin-top: 0;}
    .GoalABoxWhite > em:after {    height: 1px;    width: auto;    left: 0;    right: 0;    top: auto;}
    
    .GoalABoxBlue { display:block;    height: auto;}
    .GoalABoxBlue > p {display:block;    height: auto;text-align:center}
    .GoalABoxBlue > p > a {    display: block;    margin: 0;    margin-top: 15px;}
    
    .goalheadpage > h2 {    font-size: 18px;    line-height: 18px;    display: inline-block;}
    .goalselect {display: inline-block;}
    
    .goalheadpage > span {       font-size: 11px;    line-height: 11px;    margin-bottom: 3px;}
    .goalheaderwrapper {    height: 120px;}
    
    .goalInput > input {    font-size: 32px;    line-height: 40px;padding-left: 40px;}
    .goalInput > em {    font-size: 18px;    line-height: 18px;    left: 10px;    bottom: 10px;}
    .goalInput.TwoDigit > em{    bottom: 10px;}
    .goalselect > span {    display: inline-block;    font-size: 12px;    line-height: 12px;padding: 0 10px;}
    .goalselect > span:before{content:'Change'}
    
    .goalselect > ul {     left: 50%;    margin-left: -100px;}

}

@media only screen and (max-width: 479px) {
   .goalheaderwrapper{height: 130px;} 
   .goalheadsec { margin: 30px 0 0; }
   .goalheadsec > h2 { font-size: 22px; line-height: 25px; }
   .GoalQBoxBg { padding-top: 0; }
}