body{font-family: arial;}
#bottomSegment{
    float: left;
    width: 98%;
    margin: 1%;
    border: 1px solid lightgray;
    background: #9e9e9e59;
}
.calculator{
    cursor:  pointer;
    color: #214fda;
}
.calculateBtn{
    float: left;
    width: 100%;
    background: darkred;
    color: white;
    height: 4em;
    text-align: center;
    font-weight: bold;
    cursor:pointer;
    outline:none;
    }

.details{
    font: bold 14px arial !important;
    color: #666;
    font-weight: 400;
    text-align: center;
}
.dynamicHeading{font: bold 16px arial !important;
    color: maroon;}
    
.dynamicText{font: 14px arial !important;
    color: #333;}
.dynamicText1{font: 35px arial !important;
    color: #333; text-align:center;}
.fund{
    float: left;
    width: 16%;
    height: 87px;
    margin: 1%;
    background: white;
    padding: 1%;
    text-decoration: none;
    box-shadow: 10px 10px 5px rgba(136, 136, 136, 0.38);
    text-align:  center;
}
.goalPlanner{
    float:  left;
    width: 96%;
    padding: 2%;
}

.headSection{
	float: left;
	width: 16.5%;
	margin: 0.5% 0.7%;
	background: blue;
	padding: 1%;
	text-decoration: none;
	text-align:  center;
	border: 0.1px solid darkgray;
	}
.headSection:hover{ background:white;}
.headSection:hover .linto{ color:#333;}
.headSection:hover .headLogo{  -webkit-filter: grayscale(100%); /* Ch 23+, Saf 6.0+, BB 10.0+ */
  filter: grayscale(100%); /* FF 35+ */}
.linto{
    font: bold 14px arial !important;
    color: white;
    text-align: center;
    }
.fund:hover{ box-shadow:unset;}
input[type="text"]{
	width: 87%;
	outline:  none;
	height: 35px;
	color: #333;
	font-family: robotolight,Arial,Helvetica,sans-serif;
	float: left;
	border: none;
	background: url(https://www.reliancemutual.com/SiteCollectionImages/SiteImages/rupee.jpg) no-repeat #eaedf1;
	padding: 0 10px 0 40px;
}
input[type="submit"]{
	    background: darkred;
	    border: none;
	    outline: none;
	    cursor: pointer;
	    padding: 5% 14%;
	    margin: 6% 1%;
	    color: white;
}
.innerBorder{
    float:  left;
    width: 99%;
    margin: 1% 0%;
    border:  2px solid lightgray;
}
.left{
    float:  left;
    width: 30%;
    background:  white;
    margin: 1%;
}
.middle{
    float:  left;
    width: 30%;
    margin: 1%;
    background: white;
    padding: 1% 2%;
}
.right{
	
float: left;
	
width: 30%;
	
background: white;
	
padding: 2%;
	
margin: 1%;
}



select{
	width: 48%;
	outline:  none;
	height: 35px;
	color: #333;
	font-family: robotolight,Arial,Helvetica,sans-serif;
	float: left;
	border: none;
	background:#eaedf1;
	margin:1%;
	}
.sipCalculator{ float:  left;
    width: 96%;
    padding: 2%;}
.period{
	width: 50%;
	float: left;
	}
#tab4{    float: left;
    width: 100%;}

.logo{
    width: 100px;
    }
.toggle{float: left;
    width: 100%;
    background: blue; cursor:pointer;}
.toggleHead{    float: left;
    width: 82%;
    color: white;
    padding: 1% 3%;font-weight: bold;}
.menuIcon{float: left;
    width: 25px;
    padding: 4% 1%;}
.dropDown{float: left;
    width: 98%;
    background: blue;
    margin: 1% 0%;
    text-align: center;
    padding: 1%;}
.mobileLink{color: white;}
.mobileView{display:none;}
@media only screen and (max-width:1024px){.fund,.headSection{ width:46%;}
	}
@media only screen and (max-width:800px){.middle{ width:94%;}.right{ width:94%;}input[type="text"]{
	width: 82%;
}.desktopView{display:none;}.mobileView{display:block;}}