html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
display: block;
}
@font-face {
    font-family: "candara";
	src: url('CANDARA.TTF') format('truetype');
	
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
body{
	font-family: "candara";
	background:#eee;
}
.element{
	display: flex;
	justify-content: space-between;
	margin-bottom: 12px;
}
.calculator{
	background: #fff;
}
table{
	width:100%;
	text-align: center;
	margin-bottom: 10px;
}
select{
	
	text-align-last: center;
	
}
input{
	
	text-align: center;
	
}
label{
	
}

/*color:#60C7DA*/
/*color:#302643*/

.topheading{
	border-bottom:2px solid #DDDDDD;
}
h1{
	color:#165869;
	font-size:50px;
	text-align: center;
	font-weight: normal;
	padding:20px;
}
.tabbuttoncontainer{
display: flex;
flex-direction: column;

}

.tabbuttonselected{

color:#fff;
font-weight: bold;
background: #165869;
transition:all ease 0.3s;
padding:20px;
font-size:18px;
padding-right: 0px;
padding-left:20px;
}
.tabbuttonselected:hover{
	background: #367889;
}
.tabbuttonselected:focus{
	background: #367889;
}



.tabbuttonunselected{
	
	color:#fff;
	font-weight: normal;
	background: #60C7DA;
	transition:all ease 0.3s;
	font-size:18px;	
	padding:20px;
	padding-left:20px;
	padding-right: 0px;
}
.tabbuttonunselected:hover{
	background: #40A7BA;
}
.tabbuttonunselected:focus{
	background: #40A7BA;
}
.tabbuttonselected .numbercircle{
border-radius:40px;
background: #fff;
color:#165869;
display: inline-block;
width:30px;
height: 30px;
text-align: center;
margin-right:20px;
}
.tabbuttonunselected .numbercircle{
background: none;
border-radius: 40px;
border:2px solid #fff;
color:#fff;
width:30px;
height: 30px;
text-align: center;
margin-right:20px;
display: inline-block;	
}


.tabbuttonselected p{
display: inline-block;
top: 5px;
    position: relative;
}
.tabbuttonunselected p{
	display: inline-block;
	top: 5px;
    position: relative;
}

.resumobox{
	background: #60C7DA;
	min-height: 518px;
	color:#165869;
	padding: 20px;
}
.resumobox h1{
	font-size: 32px;
	font-weight: bold;
	color:#165869;
	padding:0px;
	text-align: left;
	margin-top: 20px;
}
.resumobox p{
text-align: left;
font-size: 14px;
font-weight: bold;
}
.resumobox label{
text-align: right;	
font-size: 14px;
font-weight: bold;
color:#fff;
}

.imagediv{
	margin-left: 2%;
	width: 60%;
}
.imagediv img{
   width:100%;
}
.textdiv{

}
.nextbutton{

}
.subtabdiv{
	display: flex;
	flex-direction: column;
	align-content: stretch;
	width:38%;
}
.doubletab{
	width:50%;
	display: flex;
}
.doubletab .subtabdiv{
	width:50%;
}

.radiobox{
	transition: all ease 0.3s;
	display: flex;
	margin-top: auto;
	margin-bottom: auto;
	padding:5px;
	width: 100%;
	
}
.radiobox:hover{
    background: #eee;
}
.radiobox p{
	font-size: 30px;
	margin-bottom: 10px;
	margin-left:20px;
	color:#302643;
}



.subtabdiv .selected .image{
	background-image: url('../images/radiobuttonselected.png');
	width:20px;
	height:20px;
	margin-top: auto;
    margin-bottom: auto;
}
.subtabdiv .unselected .image{
	background-image: url('../images/radiobutton.png');
	width:20px;
	height:20px;
	margin-top: auto;
    margin-bottom: auto;
}

.pointer{
	width:30px;
	height: 30px;
	background-image: url('../images/pointer.png');
	margin-left: 220px;
    margin-top: -30px;
}
.tabbuttonselected .pointer{

}
.tabbuttonunselected .pointer{
display: none;
}
.bottomrow{
	display: flex;
	height: 75px;
	overflow: hidden;
	
}
.textdiv{
	width:80%;
	padding:10px;
	font-size: 12px;
	color:#165869;
	font-weight: bold;
	text-align: left;
	margin-left: 5%;
	line-height: 16px;
}
.nextbutton{
	width:30px;
	background-color: transparent;
	border: none;
	margin-left: 2.5%;
	margin-right: 2.5%;
	height: 30px;
	background-image: url('../images/nextbutton.png');
	transition:all ease 0.3s;
	margin-top:20px;
}
.nextbutton:hover{
opacity: 0.6;

}
.resultbox{
	background: #165869;
	color:#fff;
	padding: 20px;
	min-height: 130px;
	padding-right: 0px;
}
.resultbox .row{
margin-top:10px;

}
.resultbox p{
 font-weight: bold;
 font-size: 16px;
 text-align: right;
padding:10px;
width:40%;
}
.resultbox label{
	font-weight: bold;
	font-size: 32px;
	text-align: left;
	padding:10px;
	
}
.inputbox{
	display: flex;

}
.inputbox{
	margin-top:15px;
}
.inputbox input{
transition: all ease 0.3s;
background: #e7e7e7;
border:none;
border-radius: 4px;
height: 24px;
width: 100%;
margin-left: 5px;
margin-right: 5px;
color:#302643;
}
.inputbox input:hover{
background: #dddddd;
}
.inputbox input:focus{
	background: #dddddd;
	}
.inputbox label{
	color:#165869;
	text-align: right;
	
	font-weight: bold;
	font-size: 14px;
	max-width: 250px;
	min-width: 130px;
    line-height: 24px;
}
.inputmaindiv{
	
	display: flex;
	flex-direction: column;
	padding-left: 10px;
	padding-right: 10px;
	justify-content: center;
}

.inputmaindiv input[type="button"]{
	background: #60C7DA;
	color:#fff;
	font-weight: bold;
	font-size: 30px;
	border:none;
	border-radius: 8px;
	height: 100px;
	transition: all ease 0.3s;
	white-space: initial;
}

.inputmaindiv input[type="button"]:hover{
	background: #40A7BA;
}
.inputmaindiv input[type="button"]:focus{
	background: #40A7BA;
}

.calculator{
	margin:auto;
}


	.calculator{
		max-width: 1300px;
		width:1300px;
		min-width: 1300px;
	}
	


@media screen and (max-width: 1300px) {

	.calculator{
			max-width: auto;
			width:auto;
			min-width:auto;
	}
		
	}

	@media screen and (max-width: 600px) {
	.radiobox p{
font-size:20px;
	}

	.pointer{
		display: none;
	}
}

@media screen and (max-width: 600px) {
	.radiobox p{
font-size:15px;
	}
	.doubletab{
		width:100%;
	}
.subtabdiv{
	width:100%;
	height: auto!important;
}
.imagediv{
	margin: auto!important;
}
.radiobox{
	margin-left: 7%;
}


}

@media screen and (max-width: 350px) {
	

}

	.buttondiv1{
		margin-top:20px;
	}

	#tab5 .radiobox p {
		font-size: 25px;
		
	}