﻿
/* CSS Document */


@font-face {
    font-family: 'futura_lightregular';
    src: url('/images/sipcalc/js/fonts/futura__light_-webfont.eot');
    src: url('/images/sipcalc/js/fonts/futura__light_-webfont.eot?') format('embedded-opentype'),
         url('/images/sipcalc/js/fonts/futura__light_-webfont.woff2') format('woff2'),
         url('/images/sipcalc/js/fonts/futura__light_-webfont.woff') format('woff'),
         url('/images/sipcalc/js/fonts/futura__light_-webfont.ttf') format('truetype'),
         url('/images/sipcalc/js/fonts/futura__light_-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'futura_bk_btbook';
    src: url('/images/sipcalc/js/fonts/futura-book-bt-webfont.eot');
    src: url('/images/sipcalc/js/fonts/futura-book-bt-webfont.eot?') format('embedded-opentype'),
         url('/images/sipcalc/js/fonts/futura-book-bt-webfont.woff2') format('woff2'),
         url('/images/sipcalc/js/fonts/futura-book-bt-webfont.woff') format('woff'),
         url('/images/sipcalc/js/fonts/futura-book-bt-webfont.ttf') format('truetype'),
         url('/images/sipcalc/js/fonts/futura-book-bt-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'open_sansregular';
    src: url('/images/sipcalc/js/fonts/opensans-regular-webfont.eot');
    src: url('/images/sipcalc/js/fonts/opensans-regular-webfont.eot?') format('embedded-opentype'),
         url('/images/sipcalc/js/fonts/opensans-regular-webfont.woff2') format('woff2'),
         url('/images/sipcalc/js/fonts/opensans-regular-webfont.woff') format('woff'),
         url('/images/sipcalc/js/fonts/opensans-regular-webfont.ttf') format('truetype'),
         url('/images/sipcalc/js/fonts/opensans-regular-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;

}

/*=============================== Typography =============================== */
h1,h2,h3,h4,h5,h6{
	margin: 0;
	font-family: 'futura_lightregular','open_sansregular',Arial,sans-serif;
	font-weight: normal;
	color:#333333;
}
h5,h6,.font-arial{
	font-family: Arial,Helvetica,sans-serif;
}

.icimg{
	float: left;
}

.ictxt{
	float: left;
	padding-top:18px;
	padding-left:18px;
}


/*Tabs*/
.tab {
    overflow: hidden;
    border: 0px solid #ccc;
    background-color: white;
	width:68%;
}

/* Style the buttons inside the tab */
.tab button {
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
    font-size: 17px;
	color:darkgrey;
}

/* Change background color of buttons on hover */
.tab button:hover {
    background-color: white;
}

/* Create an active/current tablink class */
.tab button.active {
    background-color: white;
	color:black;
	background-image: url(bluebg.png);
	background-repeat:no-repeat;
}

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 0px;
    border: 0px solid #ccc;
    border-top: none;
}

/* Style the close button */
.topright {
    float: right;
    cursor: pointer;
    font-size: 28px;
}

.topright:hover {color: red;}
/*Tabs*/




.headmob{
	display:none;
	font-size:15px;
	color: black;
	margin-top:15px;
}


.divone{
	width:100%;
	float: left;
}

.divtwo{
	width:30%;
	float: right;
	height:540px;
	margin-top:50px;
	background: white;
}

.amountcal{
	width:40%;
	height: 500px;
	background:#44b5c5;
	float: right;
}

.gtext{
	width:100%;
	height:40px;
	background:#44b5c5;
	font-size:15px;
	padding:10px;
	text-align: center;
	color: white;
}



.ui-widget-content {
    border: 0px solid #aaaaaa;
    background-color:#E0E0E0;
    color: #222222;
}



.income-taxcalculator{ background:url(/images/sipcalc/images/grey-bg.gif) repeat; width:100%; }
/*.income-taxcalculator h3{ font-size:36px; font-weight:400; text-align:center; padding:20px 0; letter-spacing:2px; color:#005387;}*/
.income-taxcalculator p{ padding:0 25px 40px 25px; margin:0; line-height:25px; text-align:justify; color:#404b52; font-size:14px;}
/*h4{  font-size:36px; font-weight:400; text-align:center; padding:40px 0 0 0; letter-spacing:2px; color:#005387; border-bottom:1px solid #e5e3e3;}*/
p.taxdata {
    color: #404b52;
    font-size: 13px;
    line-height: 18px;
    margin: 0;
    padding: 0 0 10px;
    text-align: justify;
}
span.heading { border-bottom: 1px solid #e5e3e3;color: #005387; display: inline-block; font-size: 30px; font-weight: 400; letter-spacing: 2px; margin: 0 auto 30px;  padding: 30px 50px 10px; text-align: center; width: auto;}






.bannercontent{ float: right; margin:4% 0; text-align: left; width: 100%;}
b.bannertxt{  color: #fff; display: block; font-size: 49px; position: relative; right: 230px; text-align: right; font-weight:900;}
small.bannertxtsm{  color: #fff; display: block; font-size: 30px; text-align: right;}
.emergency-button{ background: #2ecc71; border: 0 none; border-radius: 4px; color: #fff;font-size: 28px; font-weight: 400;margin: 18px 0;padding:7px 40px; text-align: center;}
.bannertime{ text-align:center; color:#4ec7f7; font-size:36px;  }

.error {
    color: red !important;        
}

#TaxCal label.error {
  display: none !important;
}

.errMsg{  border: 1px solid #f00 !important;}
.innerbodycontainer .saving_data{ margin: 40px auto;
    width: 90%;}
.annual-slider #slider, .sliderblock #slider_80c,.sliderblock #slider_medical, .sliderblock #slider_home_loan, .sliderblock #slider_home_rent{opacity:1;  background: #edecec;border: none;}
.annual-slider .ui-state-default, .annual-slider .ui-widget-content .ui-state-default, .annual-slider .ui-widget-header .ui-state-default,
.sliderblock .ui-state-default, .sliderblock .ui-widget-content .ui-state-default, .sliderblock .ui-widget-header .ui-state-default
{width: 35px; height: 35px;border-radius: 50%;background: #fff;box-shadow: 1px 1px 1px #ccc; top: -16px;}
.annual-slider  .ui-widget-header, .sliderblock  .ui-widget-header{  background: #0a5194 !important;}
.inner-section .annual-slider .ui-state-default, .inner-section .annual-slider .ui-widget-content .ui-state-default, .inner-section .annual-slider .ui-widget-header .ui-state-default,
.inner-section .sliderblock .ui-state-default, .inner-section .sliderblock .ui-widget-content .ui-state-default, .inner-section .sliderblock .ui-widget-header .ui-state-default
{width: 20px; height: 20px;border-radius: 50%;background: #faa61a;box-shadow: 1px 1px 1px #ccc; top: -7px;}


.tooltip{  position: absolute;right: 90px;top: -17px;background-color: #ECECEC;padding: 5px;border-radius: 5px;font-size: 12px;width: 218px;text-align: left;z-index: 1;}
#maincontainer{ padding-left:0;}
.body_container{width: 100%; padding:0 0 0 0;}
.breadcrumbinner{ padding-top:5px;}


/*h2{box-sizing:border-box; color:#636363; float:left; line-height:33px; margin: 0;padding: 5px 7px;text-indent: 6px; width: 100%; background:#fff; border:1px solid #f4f4f4;height:47px;  display: none; cursor:pointer; text-align:left;}
h2.dactive-button{ background:#0a5194; color:#fff;}
h2 small.eightyc{ background:url(../images/sprite.png) no-repeat -51px -498px; width:52px; height:25px; float:left;}
h2.dactive-button small.eightyc{ background-position:-125px -497px;}
h2 small.mediclaim{ background:url(../images/sprite.png) no-repeat -54px -544px;   height:52px; width:52px; float:left;}
h2.dactive-button small.mediclaim{ background-position:-136px -542px;}
h2 small.homeloan{ background:url(../images/sprite.png) no-repeat -53px -603px; width:52px; height:37px; float:left;}
h2.dactive-button small.homeloan{ background-position:-134px -604px;}
h2 small.rentedhouse{ background:url(../images/sprite.png) no-repeat -55px -673px; width:52px; height:37px; float:left;}
h2.dactive-button small.rentedhouse{ background-position:-136px -672px;}
h2 small.summary{ background:url(../images/sprite.png) no-repeat -48px -731px; width:52px; height:34px; float:left;}
h2.dactive-button small.summary{ background-position:-131px -730px;}*/
.twoblock-table{ display:none;}
.annual-textblock{display: inline-block;  margin: 0 auto;  text-align: center;  width: auto; position: relative;}
.annual-container{ clear: both;  margin: 25px auto 0; text-align: center; width: 100%;}

.inner-section ul.data_ul{float:left;margin:0;padding:0;width:100%;list-style:none; color: #404b52;font-size:14px;}
.inner-section ul.data_ul li{background:url("/media/system/images/bulletblack.png") no-repeat scroll 15px 15px transparent;float:left;line-height:18px;margin:0;padding:5px 2% 5px 4%;width:94%;text-align:left;}
.inner-section ul.data_ul li a{color:#008DC2;text-decoration:none;}
.inner-section ul.data_ul li strong{font-weight:bold;}

.sip-input { border: 0 none; color: darkgray; display: inline-block; font-size: 22px;width: 79%; background:white;}




@media screen and (max-width: 1000px) {
#sipCalculator .inner-section{ width: 100%;}
.rightSection .inner-section{margin: 0px 0;}
	
	
	.container_12{
		padding:2% !important;
	}
	
	
	.tab {
    overflow: hidden;
    border: 0px solid #ccc;
    background-color: white;
	width:40%;
}
	
	.tab button {
    background-color: white;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
    font-size: 17px;
	color:darkgrey;
	width:50%;
}

	
	.tab button.active {
    background-color: white;
	color:black;
	background-image: url(bluebg2.png);
	background-repeat:no-repeat;
}
	
	.ictxt{
	float: left;
	padding-top:5px;
	padding-left:8px;
		font-size:18px;
		text-align:left;
		
}
	.amtext1 {
		line-height:180%;
	}
	
	.icimg{
	display: none;
}
	
	
	.tab {
    overflow: hidden;
    border: 0px solid #ccc;
    background-color: #f8f8f8;
	width:100%;
}
	

	#sipCalculator .annual-income div.heading {
    border-bottom: none;
    color: #005387;
    font-size: 15px;
    font-weight: 400;
    margin: 0 auto;
   padding-top:0px;
    text-align: left;
    width: auto;
}
	
	.headmob{
	display:block;
}

	
	
	
	.divone{
	width:100%;
	float: left;
}
	
	.divtwo{
	width:100%;
	float: left;
	height:520px;
	margin-top:-30px;
	background: white;
	margin-bottom:30px;
}
	
	
	
	#sipCalculator .annualincome-block { width:100% !important;}
}

@media screen and (max-width: 740px) {
.forexData .breadcrumbinner {
     padding-top: 0px; 
}
#sipCalculator .inner-section {
    width: 100%;
    margin: 0px auto 30px;
    float: initial;
}
.annual-income div.heading span {
    font-size: 20px;
}
}

@media screen and (max-width: 480px) {
	#sipCalculator .inner-section {
    width: 90%;}
#sipCalculator .rightSection .inner-section {width:100%}
#wrapper section.head h1.header_item{width:100%;}
#sipCalculator  .annual-income div.heading span {
    font-size: 16px;
}
#sipCalculator .annual-container {
    width: 100%;
}
#sipCalculator .annualincome-block{    top: -12px; width:100%;}
}
@media screen and (max-width: 440px) {
#sipCalculator .sip-input {
    font-size: 13px;
}



#sipCalculator .annualincome-block{    width: 100%;
    left: 0px;
    top: -62px;}
	#sipCalculator .annual-slider{float:initial}
	#sipCalculator .sip-input {
    font-size: 20px;
}
#sipCalculator .annual-slider {

    margin: 80px auto 0;
}
#sipCalculator {
    display: table;
    width: 100%;
    margin: 0px 0;
}
}


.ui-helper-hidden {
	display: none;
}
.ui-helper-hidden-accessible {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}
.ui-helper-reset {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	line-height: 1.3;
	text-decoration: none;
	font-size: 100%;
	list-style: none;
}
.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
	content: "";
	display: table;
	border-collapse: collapse;
}
.ui-helper-clearfix:after {
	clear: both;
}
.ui-helper-clearfix {
	min-height: 0; /* support: IE7 */
}
.ui-helper-zfix {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	opacity: 0;
	filter:Alpha(Opacity=0);
}

.ui-front {
	z-index: 100;
}


/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
	cursor: default !important;
}


/* Icons
----------------------------------*/

/* states and images */
.ui-icon {
	display: block;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: no-repeat;
}


/* Misc visuals
----------------------------------*/

/* Overlays */
.ui-widget-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.ui-accordion .ui-accordion-header {
	display: block;
	cursor: pointer;
	position: relative;
	margin-top: 2px;
	padding: .5em .5em .5em .7em;
	min-height: 0; /* support: IE7 */
}
.ui-accordion .ui-accordion-icons {
	padding-left: 2.2em;
}
.ui-accordion .ui-accordion-noicons {
	padding-left: .7em;
}
.ui-accordion .ui-accordion-icons .ui-accordion-icons {
	padding-left: 2.2em;
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
	position: absolute;
	left: .5em;
	top: 50%;
	margin-top: -8px;
}
.ui-accordion .ui-accordion-content {
	padding: 1em 2.2em;
	border-top: 0;
	overflow: auto;
}
.ui-autocomplete {
	position: absolute;
	top: 0;
	left: 0;
	cursor: default;
}
.ui-button {
	display: inline-block;
	position: relative;
	padding: 0;
	line-height: normal;
	margin-right: .1em;
	cursor: pointer;
	vertical-align: middle;
	text-align: center;
	overflow: visible; /* removes extra width in IE */
}
.ui-button,
.ui-button:link,
.ui-button:visited,
.ui-button:hover,
.ui-button:active {
	text-decoration: none;
}
/* to make room for the icon, a width needs to be set here */
.ui-button-icon-only {
	width: 2.2em;
}
/* button elements seem to need a little more width */
button.ui-button-icon-only {
	width: 2.4em;
}
.ui-button-icons-only {
	width: 3.4em;
}
button.ui-button-icons-only {
	width: 3.7em;
}

/* button text element */
.ui-button .ui-button-text {
	display: block;
	line-height: normal;
}
.ui-button-text-only .ui-button-text {
	padding: .4em 1em;
}
.ui-button-icon-only .ui-button-text,
.ui-button-icons-only .ui-button-text {
	padding: .4em;
	text-indent: -9999999px;
}
.ui-button-text-icon-primary .ui-button-text,
.ui-button-text-icons .ui-button-text {
	padding: .4em 1em .4em 2.1em;
}
.ui-button-text-icon-secondary .ui-button-text,
.ui-button-text-icons .ui-button-text {
	padding: .4em 2.1em .4em 1em;
}
.ui-button-text-icons .ui-button-text {
	padding-left: 2.1em;
	padding-right: 2.1em;
}
/* no icon support for input elements, provide padding by default */
input.ui-button {
	padding: .4em 1em;
}

/* button icon element(s) */
.ui-button-icon-only .ui-icon,
.ui-button-text-icon-primary .ui-icon,
.ui-button-text-icon-secondary .ui-icon,
.ui-button-text-icons .ui-icon,
.ui-button-icons-only .ui-icon {
	position: absolute;
	top: 50%;
	margin-top: -8px;
}
.ui-button-icon-only .ui-icon {
	left: 50%;
	margin-left: -8px;
}
.ui-button-text-icon-primary .ui-button-icon-primary,
.ui-button-text-icons .ui-button-icon-primary,
.ui-button-icons-only .ui-button-icon-primary {
	left: .5em;
}
.ui-button-text-icon-secondary .ui-button-icon-secondary,
.ui-button-text-icons .ui-button-icon-secondary,
.ui-button-icons-only .ui-button-icon-secondary {
	right: .5em;
}

/* button sets */
.ui-buttonset {
	margin-right: 7px;
}
.ui-buttonset .ui-button {
	margin-left: 0;
	margin-right: -.3em;
}

/* workarounds */
/* reset extra padding in Firefox, see h5bp.com/l */
input.ui-button::-moz-focus-inner,
button.ui-button::-moz-focus-inner {
	border: 0;
	padding: 0;
}
.ui-datepicker {
	width: 17em;
	padding: .2em .2em 0;
	display: none;
}
.ui-datepicker .ui-datepicker-header {
	position: relative;
	padding: .2em 0;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	position: absolute;
	top: 2px;
	width: 1.8em;
	height: 1.8em;
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
	top: 1px;
}
.ui-datepicker .ui-datepicker-prev {
	left: 2px;
}
.ui-datepicker .ui-datepicker-next {
	right: 2px;
}
.ui-datepicker .ui-datepicker-prev-hover {
	left: 1px;
}
.ui-datepicker .ui-datepicker-next-hover {
	right: 1px;
}
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
	display: block;
	position: absolute;
	left: 50%;
	margin-left: -8px;
	top: 50%;
	margin-top: -8px;
}
.ui-datepicker .ui-datepicker-title {
	margin: 0 2.3em;
	line-height: 1.8em;
	text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
	font-size: 1em;
	margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
	width: 49%;
}
.ui-datepicker table {
	width: 100%;
	font-size: .9em;
	border-collapse: collapse;
	margin: 0 0 .4em;
}
.ui-datepicker th {
	padding: .7em .3em;
	text-align: center;
	font-weight: bold;
	border: 0;
}
.ui-datepicker td {
	border: 0;
	padding: 1px;
}
.ui-datepicker td span,
.ui-datepicker td a {
	display: block;
	padding: .2em;
	text-align: right;
	text-decoration: none;
}
.ui-datepicker .ui-datepicker-buttonpane {
	background-image: none;
	margin: .7em 0 0 0;
	padding: 0 .2em;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
	float: right;
	margin: .5em .2em .4em;
	cursor: pointer;
	padding: .2em .6em .3em .6em;
	width: auto;
	overflow: visible;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
	float: left;
}

/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
	width: auto;
}
.ui-datepicker-multi .ui-datepicker-group {
	float: left;
}
.ui-datepicker-multi .ui-datepicker-group table {
	width: 95%;
	margin: 0 auto .4em;
}
.ui-datepicker-multi-2 .ui-datepicker-group {
	width: 50%;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
	width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
	width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
	border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
	clear: left;
}
.ui-datepicker-row-break {
	clear: both;
	width: 100%;
	font-size: 0;
}

/* RTL support */
.ui-datepicker-rtl {
	direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
	right: 2px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
	left: 2px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
	right: 1px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
	left: 1px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
	clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
	float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
	float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
	border-right-width: 0;
	border-left-width: 1px;
}
.ui-dialog {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	padding: .2em;
	outline: 0;
}
.ui-dialog .ui-dialog-titlebar {
	padding: .4em 1em;
	position: relative;
}
.ui-dialog .ui-dialog-title {
	float: left;
	margin: .1em 0;
	white-space: nowrap;
	width: 90%;
	overflow: hidden;
	text-overflow: ellipsis;
}
.ui-dialog .ui-dialog-titlebar-close {
	position: absolute;
	right: .3em;
	top: 50%;
	width: 20px;
	margin: -10px 0 0 0;
	padding: 1px;
	height: 20px;
}
.ui-dialog .ui-dialog-content {
	position: relative;
	border: 0;
	padding: .5em 1em;
	background: none;
	overflow: auto;
}
.ui-dialog .ui-dialog-buttonpane {
	text-align: left;
	border-width: 1px 0 0 0;
	background-image: none;
	margin-top: .5em;
	padding: .3em 1em .5em .4em;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	float: right;
}
.ui-dialog .ui-dialog-buttonpane button {
	margin: .5em .4em .5em 0;
	cursor: pointer;
}
.ui-dialog .ui-resizable-se {
	width: 12px;
	height: 12px;
	right: -5px;
	bottom: -5px;
	background-position: 16px 16px;
}
.ui-draggable .ui-dialog-titlebar {
	cursor: move;
}
.ui-menu {
	list-style: none;
	padding: 2px;
	margin: 0;
	display: block;
	outline: none;
}
.ui-menu .ui-menu {
	margin-top: -3px;
	position: absolute;
}
.ui-menu .ui-menu-item {
	margin: 0;
	padding: 0;
	width: 100%;
	/* support: IE10, see #8844 */
	list-style-image: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7);
}
.ui-menu .ui-menu-divider {
	margin: 5px -2px 5px -2px;
	height: 0;
	font-size: 0;
	line-height: 0;
	border-width: 1px 0 0 0;
}
.ui-menu .ui-menu-item a {
	text-decoration: none;
	display: block;
	padding: 2px .4em;
	line-height: 1.5;
	min-height: 0; /* support: IE7 */
	font-weight: normal;
}
.ui-menu .ui-menu-item a.ui-state-focus,
.ui-menu .ui-menu-item a.ui-state-active {
	font-weight: normal;
	margin: -1px;
}

.ui-menu .ui-state-disabled {
	font-weight: normal;
	margin: .4em 0 .2em;
	line-height: 1.5;
}
.ui-menu .ui-state-disabled a {
	cursor: default;
}

/* icon support */
.ui-menu-icons {
	position: relative;
}
.ui-menu-icons .ui-menu-item a {
	position: relative;
	padding-left: 2em;
}

/* left-aligned */
.ui-menu .ui-icon {
	position: absolute;
	top: .2em;
	left: .2em;
}

/* right-aligned */
.ui-menu .ui-menu-icon {
	position: static;
	float: right;
}
.ui-progressbar {
	height: 2em;
	text-align: left;
	overflow: hidden;
}
.ui-progressbar .ui-progressbar-value {
	margin: -1px;
	height: 100%;
}
.ui-progressbar .ui-progressbar-overlay {
	background: url("/images/sipcalc/js/images/animated-overlay.gif");
	height: 100%;
	filter: alpha(opacity=25);
	opacity: 0.25;
}
.ui-progressbar-indeterminate .ui-progressbar-value {
	background-image: none;
}
.ui-resizable {
	position: relative;
}
.ui-resizable-handle {
	position: absolute;
	font-size: 0.1px;
	display: block;
}
.ui-resizable-disabled .ui-resizable-handle,
.ui-resizable-autohide .ui-resizable-handle {
	display: none;
}
.ui-resizable-n {
	cursor: n-resize;
	height: 7px;
	width: 100%;
	top: -5px;
	left: 0;
}
.ui-resizable-s {
	cursor: s-resize;
	height: 7px;
	width: 100%;
	bottom: -5px;
	left: 0;
}
.ui-resizable-e {
	cursor: e-resize;
	width: 7px;
	right: -5px;
	top: 0;
	height: 100%;
}
.ui-resizable-w {
	cursor: w-resize;
	width: 7px;
	left: -5px;
	top: 0;
	height: 100%;
}
.ui-resizable-se {
	cursor: se-resize;
	width: 12px;
	height: 12px;
	right: 1px;
	bottom: 1px;
}
.ui-resizable-sw {
	cursor: sw-resize;
	width: 9px;
	height: 9px;
	left: -5px;
	bottom: -5px;
}
.ui-resizable-nw {
	cursor: nw-resize;
	width: 9px;
	height: 9px;
	left: -5px;
	top: -5px;
}
.ui-resizable-ne {
	cursor: ne-resize;
	width: 9px;
	height: 9px;
	right: -5px;
	top: -5px;
}
.ui-selectable-helper {
	position: absolute;
	z-index: 100;
	border: 1px dotted black;
}
.ui-slider {
	position: relative;
	text-align: left;
}
.ui-slider .ui-slider-handle {
	position: absolute;
	z-index: 2;
	width: 1.2em;
	height: 1.2em;
	cursor: default;
	
}
.ui-slider .ui-slider-range {
	position: absolute;
	z-index: 1;
	font-size: .7em;
	display: block;
	border: 0;
	background-position: 0 0;
}

/* For IE8 - See #6727 */
.ui-slider.ui-state-disabled .ui-slider-handle,
.ui-slider.ui-state-disabled .ui-slider-range {
	filter: inherit;
}

.ui-slider-horizontal {
	height: .9em;
}
.ui-slider-horizontal .ui-slider-handle {
	top: -.3em;
	margin-left: -.6em;
}
.ui-slider-horizontal .ui-slider-range {
	top: 0;
	height: 100%;
}
.ui-slider-horizontal .ui-slider-range-min {
	left: 0;
}
.ui-slider-horizontal .ui-slider-range-max {
	right: 0;
}

.ui-slider-vertical {
	width: .8em;
	height: 100px;
}
.ui-slider-vertical .ui-slider-handle {
	left: -.3em;
	margin-left: 0;
	margin-bottom: -.6em;
}
.ui-slider-vertical .ui-slider-range {
	left: 0;
	width: 100%;
}
.ui-slider-vertical .ui-slider-range-min {
	bottom: 0;
}
.ui-slider-vertical .ui-slider-range-max {
	top: 0;
}
.ui-spinner {
	position: relative;
	display: inline-block;
	overflow: hidden;
	padding: 0;
	vertical-align: middle;
}
.ui-spinner-input {
	border: none;
	background: none;
	color: inherit;
	padding: 0;
	margin: .2em 0;
	vertical-align: middle;
	margin-left: .4em;
	margin-right: 22px;
}
.ui-spinner-button {
	width: 16px;
	height: 50%;
	font-size: .5em;
	padding: 0;
	margin: 0;
	text-align: center;
	position: absolute;
	cursor: default;
	display: block;
	overflow: hidden;
	right: 0;
}
/* more specificity required here to override default borders */
.ui-spinner a.ui-spinner-button {
	border-top: none;
	border-bottom: none;
	border-right: none;
}
/* vertically center icon */
.ui-spinner .ui-icon {
	position: absolute;
	margin-top: -8px;
	top: 50%;
	left: 0;
}
.ui-spinner-up {
	top: 0;
}
.ui-spinner-down {
	bottom: 0;
}

/* TR overrides */
.ui-spinner .ui-icon-triangle-1-s {
	/* need to fix icons sprite */
	background-position: -65px -16px;
}

/* Component containers
----------------------------------*/

/* Overlays */
.ui-widget-overlay {
	background: #aaaaaa url(/images/sipcalc/js/images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x;
	opacity: .3;
	filter: Alpha(Opacity=30);
}
.ui-widget-shadow {
	margin: -8px 0 0 -8px;
	padding: 8px;
	background: #aaaaaa url(/images/sipcalc/js/images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x;
	opacity: .3;
	filter: Alpha(Opacity=30);
	border-radius: 8px;
}


.ui-slider-horizontal.ui-slider-pips {
  margin-bottom: 1.4em;
}

/* default hide the labels and pips that arnt visible */
/* we just use css to hide incase we want to show certain */
/* labels/pips individually later */
.ui-slider-pips .ui-slider-label,
.ui-slider-pips .ui-slider-pip-hide {
  display: none;
}

/* now we show any labels that we've set to show in the options */
.ui-slider-pips .ui-slider-pip-label .ui-slider-label {
  display: none;
}

/* PIP/LABEL WRAPPER */
/* position each pip absolutely just below the default slider */
/* and also prevent accidental selection */
.ui-slider-pips .ui-slider-pip {
  width: 2em;
  height: 1em;
  line-height: 1em;
  position: absolute;
  font-size: 15px;
  color: #999;
  overflow: visible;
  text-align: center;
  top: 20px;
  left: 20px;
  margin-left: -1em;
  cursor: pointer;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
	 display: none;
}

.ui-state-disabled.ui-slider-pips .ui-slider-pip {
  cursor: default;
}

/* little pip/line position & size */
.ui-slider-pips .ui-slider-line {
  background: #999;
  width: 1px;
  height: 3px;
  position: absolute;
  left: 50%;
}

/* the text label postion & size */
/* it overflows so no need for width to be accurate */
.ui-slider-pips .ui-slider-label {
  position: absolute;
  top: 5px;
  left: 50%;
  margin-left: -1em;
  width: 2em;
}

/* make it easy to see when we hover a label */
.ui-slider-pips:not(.ui-slider-disabled) .ui-slider-pip:hover .ui-slider-label {
  color: black;
  font-weight: bold;
}

/* VERTICAL */
/* vertical slider needs right-margin, not bottom */
.ui-slider-vertical.ui-slider-pips {
  margin-bottom: 1em;
  margin-right: 2em;
}

/* align vertical pips left and to right of the slider */
.ui-slider-vertical.ui-slider-pips .ui-slider-pip {
  text-align: left;
  top: auto;
  left: 20px;
  margin-left: 0;
  margin-bottom: -0.5em;
}

/* vertical line/pip should be horizontal instead */
.ui-slider-vertical.ui-slider-pips .ui-slider-line {
  width: 3px;
  height: 1px;
  position: absolute;
  top: 50%;
  left: 0;
}

.ui-slider-vertical.ui-slider-pips .ui-slider-label {
  top: 50%;
  left: 0.5em;
  margin-left: 0;
  margin-top: -0.5em;
  width: 2em;
}

/* FLOATING HORIZTONAL TOOLTIPS */
/* remove the godawful looking focus outline on handle and float */
.ui-slider-float .ui-slider-handle:focus,
.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip-label,
.ui-slider-float .ui-slider-handle:focus .ui-slider-tip,
.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip-label,
.ui-slider-float .ui-slider-handle:focus .ui-slider-tip-label
.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip-label {
  outline: none;
}

/* style tooltips on handles and on labels */
/* also has a nice transition */
.ui-slider-float .ui-slider-tip,
.ui-slider-float .ui-slider-tip-label {
  position: absolute;
  visibility: hidden;
  top: -40px;
  display: block;
  min-width: 34px;
  margin-left: -18px;
  left: 50%;
  height: 20px;
  line-height: 20px;
  background: white;
  border-radius: 3px;
  border: 1px solid #888;
  text-align: center;
  font-size: 12px;
  opacity: 0;
  color: #333;
  
}

/* show the tooltip on hover or focus */
/* also switch transition delay around */
.ui-slider-float .ui-slider-handle:hover .ui-slider-tip,
.ui-slider-float .ui-slider-handle.ui-state-hover .ui-slider-tip,
.ui-slider-float .ui-slider-handle:focus .ui-slider-tip,
.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip,
.ui-slider-float .ui-slider-handle.ui-state-active .ui-slider-tip,
.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label {
  opacity: 1;
  top: -30px;
  visibility: visible;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  -webkit-transition-delay: 200ms, 200ms, 0ms;
  transition-delay: 200ms, 200ms, 0ms;
}

/* put label tooltips below slider */
.ui-slider-float .ui-slider-pip .ui-slider-tip-label {
  top: 42px;
}

.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label {
  top: 32px;
  font-weight: normal;
}

/* give the tooltip a css triangle arrow */
.ui-slider-float .ui-slider-tip:after,
.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after {
  content: " ";
  width: 0;
  height: 0;
  border: 5px solid rgba(255, 255, 255, 0);
  border-top-color: white;
  position: absolute;
  bottom: -10px;
  left: 50%;
  margin-left: -5px;
}

/* put a 1px border on the tooltip arrow to match tooltip border */
.ui-slider-float .ui-slider-tip:before,
.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before {
  content: " ";
  width: 0;
  height: 0;
  border: 5px solid rgba(255, 255, 255, 0);
  border-top-color: #888;
  position: absolute;
  bottom: -11px;
  left: 50%;
  margin-left: -5px;
}

/* switch the arrow to top on labels */
.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after {
  border: 5px solid rgba(255, 255, 255, 0);
  border-bottom-color: white;
  top: -10px;
}

.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before {
  border: 5px solid rgba(255, 255, 255, 0);
  border-bottom-color: #888;
  top: -11px;
}

/* FLOATING VERTICAL TOOLTIPS */
/* tooltip floats to left of handle */
.ui-slider-vertical.ui-slider-float .ui-slider-tip,
.ui-slider-vertical.ui-slider-float .ui-slider-tip-label {
  top: 50%;
  margin-top: -11px;
  width: 34px;
  margin-left: 0px;
  left: -60px;
  color: #333;
  -webkit-transition-duration: 200ms, 200ms, 0;
  transition-duration: 200ms, 200ms, 0;
  -webkit-transition-property: opacity, left, visibility;
  transition-property: opacity, left, visibility;
  -webkit-transition-delay: 0, 0, 200ms;
  transition-delay: 0, 0, 200ms;
}

.ui-slider-vertical.ui-slider-float .ui-slider-handle:hover .ui-slider-tip,
.ui-slider-vertical.ui-slider-float .ui-slider-handle.ui-state-hover .ui-slider-tip,
.ui-slider-vertical.ui-slider-float .ui-slider-handle:focus .ui-slider-tip,
.ui-slider-vertical.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip,
.ui-slider-vertical.ui-slider-float .ui-slider-handle.ui-state-active .ui-slider-tip,
.ui-slider-vertical.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label {
  top: 50%;
  margin-top: -11px;
  left: -50px;
}

/* put label tooltips to right of slider */
.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label {
  left: 47px;
}

.ui-slider-vertical.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label {
  left: 37px;
}

/* give the tooltip a css triangle arrow */
.ui-slider-vertical.ui-slider-float .ui-slider-tip:after,
.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after {
  border: 5px solid rgba(255, 255, 255, 0);
  border-left-color: white;
  border-top-color: transparent;
  position: absolute;
  bottom: 50%;
  margin-bottom: -5px;
  right: -10px;
  margin-left: 0;
  top: auto;
  left: auto;
}

.ui-slider-vertical.ui-slider-float .ui-slider-tip:before,
.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before {
  border: 5px solid rgba(255, 255, 255, 0);
  border-left-color: #888;
  border-top-color: transparent;
  position: absolute;
  bottom: 50%;
  margin-bottom: -5px;
  right: -11px;
  margin-left: 0;
  top: auto;
  left: auto;
}

.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after {
  border: 5px solid rgba(255, 255, 255, 0);
  border-right-color: white;
  right: auto;
  left: -10px;
}

.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before {
  border: 5px solid rgba(255, 255, 255, 0);
  border-right-color: #888;
  right: auto;
  left: -11px;
}

/* SELECTED STATES */
/* Comment out this chuck of code if you don't want to have
        the new label colours shown */
.ui-slider-pips [class*=ui-slider-pip-initial] {
  font-weight: bold;
  color: #14CA82;
}

.ui-slider-pips .ui-slider-pip-initial-2 {
  color: #1897C9;
}

.ui-slider-pips [class*=ui-slider-pip-selected] {
  font-weight: bold;
  color: #FF7A00;
}
.ui-slider-pips:not(.ui-slider-disabled) .ui-slider-pip:hover .ui-slider-label{color:#FF7A00;}

.ui-slider-pips .ui-slider-pip-inrange {
  color: black;
}

.ui-slider-pips .ui-slider-pip-selected-2 {
  color: #E70081;
}

.ui-slider-pips [class*=ui-slider-pip-selected] .ui-slider-line,
.ui-slider-pips .ui-slider-pip-inrange .ui-slider-line {
  background: black;
}



select { cursor: pointer; }
#wrapper { width: 1000px; margin: 0 auto; }
#retirement #wrapper { width: auto; margin: 0 auto; }
/*Start New*/

.willretire .hlvdata-block ul.hlvblock li a.viewCal .cal { background-position: -215px -76px; float: left; height: 33px; width: 27px; }
.willretire .hlvdata-block ul.hlvblock li a.viewCal .understand { width: 32px; height: 35px; background-position: -256px -76px; float: left; }
.retirement ul.personaldetail { margin: 0 auto; padding: 0; width: 100%; position: relative; }
.willretire .hlvdata-block ul.hlvblock li .earnval { color: #0A5194; padding: 0px 5px 0px 20px; line-height: 25px; }

.willretire .hlvdata-block ul.hlvblock li .earnval input{    width: 23px;
    text-align: center;
    background-color: transparent;
    color: #0A5194;}
.willretire .hlvdata-block ul.hlvblock li .earnval::before { content: ""; background: url(/images/sipcalc/images/retirement-icon.png) no-repeat -71px -71px; width: 12px; height: 22px; display: inline-block; position: relative; left: -4px; top: 3px; }
.willretire .hlvdata-block ul.hlvblock li .editValue{padding-left:0px; text-align:left;}
.willretire .hlvdata-block ul.hlvblock li .editValue::before{background:none !important}
.retirement ul.personaldetail li { border: 1px solid #f7f7f7; border-radius: 5px; display: inline-block; margin: 15px; padding: 0; width: 28%; box-shadow: -1px 1px 6px 2px #ddd; font-size: 14px; background: #fff; position: relative; }
.retirement ul.personaldetail li.sel span { background: #0a5194; }
.retirement ul.personaldetail li span { background: #c9c9c9; float: left; margin: 0; padding: 5px 0; width: 57px; border-radius: 5px 0 0 5px; }
.retirement ul.personaldetail li input[type="text"] { background: #fff; border: 0; padding: 12px; margin: 0; width: 77%; float: left; box-sizing: border-box; color: #000; font-size: 14px; line-height: 25px;}
.retirement ul.personaldetail li.sel span { background: #0a5194; }
.retirement ul.personaldetail li span { background: #c9c9c9; float: left; margin: 0; padding: 5px 0; width: 57px; border-radius: 5px 0 0 5px; }
.retirement ul.personaldetail li span small.user { display: table; height: 39px; width: 50px; background-position: -59px -12px; }
.retirement ul.personaldetail li span small.age { display: table; height: 39px; width: 50px; background-position: -110px -12px; }
.retirement ul.personaldetail li span small.income { display: table; height: 39px; width: 50px; background-position: -161px -12px; }
.retirement ul.personaldetail li span small.save { display: table; height: 39px; width: 50px; background-position: -253px -6px; }
.retirement ul.personaldetail li span small.reward { display: table; height: 39px; width: 50px; background-position: -211px -12px; }
.retirement ul.personaldetail li select { border: 0; padding: 12px; margin: 0; box-sizing: border-box; width: 77%; color: #000; float: left; line-height: 45px;}
.willretire { background: #f4f4f4; }
.willretire .hlvdata-block { box-sizing: border-box; margin: 20px auto; width: 92%; background: #f9f9f9; box-shadow: -1px 1px 6px 2px #ddd; border-radius: 5px; }
.willretire .hlvdata-block ul.hlvblock { display: table; margin: 0; padding: 0; width: 100%; position: relative; }
.willretire .hlvdata-block ul.hlvblock li { margin: 0; padding: 0; list-style: none; text-align: center; display: table-cell; vertical-align: middle; position: relative; font-weight: 300; padding: 22px; }
.willretire .hlvdata-block ul.hlvblock li.w15 { width: 15% }
.willretire .hlvdata-block ul.hlvblock li.w20 { width: 20% }
.willretire .hlvdata-block ul.hlvblock li.w25 { width: 25% }
.willretire .hlvdata-block ul.hlvblock li.w30 { width: 30% }
.willretire .hlvdata-block ul.hlvblock li.w75 { width: 75% }
.proceedmedi-block { margin: 0; text-align: center; width: 100%; padding: 0 40px; }
.proceedmedi-block .proceed-button { background: #2ecc71; border: 0 none; display: inline-block; border-radius: 4px; color: #fff; font-size: 18px; font-weight: 400; padding: 10px 40px; text-align: center; margin: 18px 0; position: relative; text-decoration: none; }
.proceedmedi-block .proceed-button em { background: url(/images/sipcalc/images/sprite_new.png) no-repeat -64px -388px; height: 10px; position: absolute; right: 24px; top: 17px; width: 9px; }
.willretire .hlvdata-block ul.hlvblock a.editVal { background-color: #0A5194; color: #fff; padding: 15px; border-radius: 5px; position: relative; }
.willretire .hlvdata-block ul.hlvblock a.viewCal { background-color: #0a5194; border-radius: 5px; color: #fff; display: block; float: right; min-height: 52px; padding: 8px; vertical-align: middle; width: 168px; }
.willretire .hlvdata-block ul.hlvblock li a.viewCal .alingM { float: left; width: 114px; }
_:-webkit-any-link, :root .willretire .hlvdata-block ul.hlvblock li a.viewCal .alingM { width: 116px;/*safari hack*/} 
/*all error update*/
.retirement ul.personaldetail li span.errUpdate { position: absolute; background-color: transparent;width: 100%; background:none}
.retirement ul.personaldetail li.rActive span.errUpdate{background:none}
.retirement ul.personaldetail li span.txtDOB_error, .retirement ul.personaldetail li span.txtRetireAge_error, .retirement ul.personaldetail li span.txtAnnualIncome_error, .retirement ul.personaldetail li span.txtSavings_error { top: 52px; left: 15px; }
.retirement ul.personaldetail li.errMsg{  border: 1px solid #f00 !important;}
/*END NEW*/
#wrapper aside.rightdiv { width: 20%; float: right; margin: 0; padding: 4em 0 0 0; }
.content-style-form {  }




/*SIP CALC*/
#sipCalculator .annual-income {
    box-sizing: border-box;
    margin: 0;
    padding: 10px;
    width: 100%;
    display: table;
}
#sipCalculator  .annual-container{    position: relative;}
#sipCalculator .annual-slider {
    float: left;
    margin: 50px auto 0;
    width: 100%;
}
#sipCalculator .annual-income div.heading {
    border-bottom: none;
    color: #005387;
    font-size: 15px;
    font-weight: 400;
    margin: 0 auto;
   padding-top:25px;
    text-align: left;
    width: auto;
}
#sipCalculator .annual-income div.heading em{display:none}
#sipCalculator .inner-section {
    width: 100%;
    margin: 0;
    text-align: center;
    float: left;
}
#sipCalculator .annual-container{margin: 0px auto 0;}

#sipCalculator .annualincome-block {
    background: white;
	color: white;
    font-size: 24px;
    font-weight: lighter;
   padding:4px 7px 7px;
    width: 30%;
    right: 0px;
    top: -32px;
    position: absolute;
	float: right;
	border: 1px solid lightgray;
	
}
#sipCalculator .rs-box{padding-top: 0px;}
#sipCalculator .rs-box small {
    font-size: 18px;
    color: white;
	font-weight:lighter;
}
#sipCalculator .sip-input{font-size: 18px;}
#sipCalculator{
    display: table;
    width: 100%;
    margin: 50px 0;
}
.table tr td p{font-size:15px; padding-bottom:10px; padding-top:10px; color: black}

.table tr:nth-child(even) span{    font-size: 20px;
    color: #0d57a0;
    font-weight: 400;}
.table tr:nth-child(odd) span{    font-size: 20px;
   color: #0d57a0;
    font-weight: 300;}
	.borderless td, .borderless th {
    border: none !important;
}

.annual-income.bgColor{    border-radius: 0px;}
.annual-income.bgColor{background:;
    
}
.ui-slider-float .ui-slider-tip, .ui-slider-float .ui-slider-tip-label {

    min-width: 34px;

     height:auto; 

    padding: 2px 10px;
}
/**/







