/* CSS Document */
@import url(/assets/css/reset.css);
@import url('https://fonts.googleapis.com/css2?family=Lato:ital@0;1&family=Lato:ital,wght@0,400;0,500;1,400&display=swap');
body {
	font-style: normal;
	font-family: Lato, sans-serif;
	color: #252525
}
.description-and-article p {
	font-size: 19px;
	line-height: 1.2;
	margin-top: 10px;
}
.description-and-article ol li, .description-and-article ul li {
	font-size: 19px;
	line-height: 1.2;
}
.description-and-article h1 {
	margin-bottom: 20px;
}
.description-and-article h2 {
	font-size: 23px;
	margin-top: 23px;
	margin-bottom: 19px;
}
.description-and-article h3 {
	font-size: 23px;
	margin-top: 19px;
}
.format-11 {
	margin-bottom: 25px !important;
}
.converted-value-container {
	padding: 15px;
	border-radius: 7px;
	/* background: #f5f5f5; */
    /* width: 350px; */
    /*width: 350px;*/
	margin: 0 auto; /* Centers the div */
	/* Additional styles for better visualization */
    /* height: 200px; */ /* Example height */
	background-color: #f3f3f3; /* Example background color *//* display: flex; */ /* Using flexbox for vertical centering if needed *//*justify-content: center; /* Horizontal centering for child content *//*align-items: center;*/
}
.external-sources {
	margin-bottom: 25px !important;
}
.external-sources i {
	font-style: italic;
	margin-right: 5px;
}
.external-sources ul {
	display: inline;
}
.external-sources ul li {
	display: inline;
	margin-right: 10px;
	font-style: italic;
}
.footer {
	margin-bottom: 41px !important;
}
.footer p {
	font-size: 19px;
}
.clearfix {
	overflow: hidden;
	clear: both;
}
h1 {
	font-size: 41px;
	font-weight: bold;
	text-align: center;
	line-height: 1.2;
}
.proper-size-and-alignment {
	width: 700px;
	margin: 0 auto;
	text-align: center;
}
.description-of-converter {
	text-align: center;
	/* font-size: 19px; */
	border-top: 3px #e0e0e0 solid;
	/* margin-bottom: 20px; */
	padding: 25px;
	margin-top: 25px;/* line-height: 1.2; */
}
.description-of-converter p {
	font-size: 19px;
	line-height: 1.2;
	margin-bottom: 15px;
}
.clsInputField, input#value-in-crores, input#value-in-lakh, input#value-in-crore, input#value-in-million, input#value-in-billion, input#value-in-inr, input#value-in-usd, input#value-usdinr-conversion, input#value-in-inr-crores, input#value-in-inr-trillion, input#value-in-lakh-crores {
	margin: 0 auto;
	display: block;
	margin-bottom: 18px;
	position: relative;
	left: 0;
	width: 250px!important;
	/*height: 26px;*/
	outline: 0;
	border: 2px solid #cdcdcd;
	background-color: #fff;
	font-size: 18px;
	font-family: Roboto, sans-serif;
	padding: 5px 5px;
	border-radius: 7px;
}
input[type="submit"] {
	margin: 0 auto;
	display: block;
	-webkit-border-radius: 1!important;
	-moz-border-radius: 1;
	border-radius: 7px;
	color: #fff!important;
	background: #48317f;
	padding: 11px 40px 11px 40px!important;
	text-decoration: none;
	font-size: 16px!important;
	transition: .5s;
	cursor: pointer;
	border: 0;
	font-weight: bold;
}
input[type="submit"]:hover {
	transition: .5s;
	background: #22d8cf;
}
label {
	font-size: 21px;
	font-weight: bold;
	margin-bottom: 10px;
	/* padding: 20px; */
	display: block;
	/* margin: 0 auto; */
	text-align: center;
}
form {
	margin-top: 25px;
	margin-bottom: 52px;
}
.container {
	margin-top: 25px;
}
p.converted {
	text-align: center;
	line-height: 1.2;
	font-size: 23px;
	font-weight: bold;
	margin-bottom: 25px;
	color: red;
}
span.ortext {
	color: grey;
	margin-right: 10px;
	font-weight: 500;
	font-style: italic;
	text-transform: lowercase;
}
.other-links {
	text-align: center;
	/* font-size: 23px; */
	border-top: 3px #e0e0e0 solid;
	/* margin-bottom: 20px; */
	padding: 25px;
	margin-top: 25px;
}
.other-links a {
	display: block;
	margin-bottom: 15px;
	font-size: 23px;
}
.other-links p {
	font-size: 23px;
	font-weight: bold;
	margin-bottom: 25px;
}
.calculator {
	width: 45%;
	/* background-color: aliceblue; */
	float: left;
	margin-right: 10px;
}
/* Add these styles to your croretomillion.css file */

.calculator.converters-column:last-child {
	margin-right: 0;
}
/* Financial calculator section */
.calculator.financial {
	width: 100%;
	clear: both;
	margin-top: 20px;
	padding-top: 15px;
	border-top: 2px dashed #cdcdcd;
}
.converters-container h3, .calculator.financial h3 {
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 15px;
	color: #48317f;
	text-align: center;
}
/* Calculation explanation styling */
.calculation-explanation {
    margin-top: 20px;
    text-align: center;
    background-color: #f9f9f9;
    padding: 15px;
    border-radius: 7px;
    border-left: 3px solid #48317f;
}

.calculation-explanation h3 {
    color: #48317f;
    font-size: 18px;
    margin-bottom: 10px;
    text-align: center;
}

.calculation-explanation ol {
    padding-left: 20px;
    text-align: center;
    list-style-position: inside;
}

.calculation-explanation li {
    margin-bottom: 10px;
    font-size: 15px;
    line-height: 1.4;
}

.calculation-explanation strong {
    color: #333;
}
.field-note {
	font-size: 14px;
	color: #666;
	text-align: center;
	margin-top: -10px;
	margin-bottom: 20px;
	font-style: italic;
	padding: 0 20px;
	line-height: 1.3;
}

/* Select dropdown styling to match other inputs */
select.clsInputField {
    margin: 0 auto;
    display: block;
    margin-bottom: 18px;
    position: relative;
    left: 0;
    width: 250px!important;
    outline: 0;
    border: 2px solid #cdcdcd;
    background-color: #fff;
    font-size: 18px;
    font-family: Roboto, sans-serif;
    padding: 5px 5px;
    border-radius: 7px;
    height: 38px; /* Match the height of other inputs */
}


@media only screen and (max-width: 600px) {
.field-note {
	font-size: 13px;
	padding: 0 15px;
}
.calculation-explanation {
	padding: 10px;
}
.calculation-explanation li {
	font-size: 14px;
}
.proper-size-and-alignment {
	width: auto;
}
.calculator.converters-column, .calculator.financial {
	width: 100%;
	float: none;
	margin-right: 0;
}
h1 {
	padding: 10px 10px;
	background-color: #f4eef6;
}
p.converted {
	padding: 0 15px;
	line-height: 1.2;
}
.footer p {
	background-color: #f7f7f7;
	font-size: 19px;
	padding: 10px 20px;
	line-height: 1.4;
}
b {
	font-weight: 500;
}
label {
	padding: 0 20px;
	line-height: 1.2;
}
.container {
	margin-top: 0;
}
}
