/*menu*/
/*menu*/
/*menu*/
.select-menu {
    width: 100%; /* Make the select take up the full width of its container */
}


select.select-menu{
	margin-bottom:0px;
	border:3px solid #101010;
	font-size:16px;
	border-radius:0px;
	font-weight:bold;
	display:block;
	padding:7px 1%;
	/*height:45px;*/
}
select.select-menu option{
	border-bottom:1px solid #333;
	cursor:pointer;
}
ul.cal-menu{}
ul.cal-menu li.list-group-item{
	font-size:16px;
}
ul.cal-menu li.list-group-item-warning{
	background:#ffe8df !important;
}
ul.cal-menu li.list-group-item-warning strong{
	font-size:18px !important;
	color:#333 !important;
}
/*content area*/
/*content area*/
/*content area*/
.sFcontent {
    padding:25px 20px 20px 20px;
	
	
    background-color: #333;
    border-radius: 10px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
	width: 100%;
    max-width: 100%;
	
}

.sFcontent p.brand{
	margin-bottom:0px;
	padding-top:10px;
	color:#909090;
	font-size:14px;
}
.sFcontent p.brand a{
	color:#909090;
	text-decoration:underline;
}


.sFcontent label {
    display: block;
    margin-bottom: 10px;
    font-weight: bold;
	color:#fff;
	font-weight:bold;
}
.sFcontent label span {
	color:red;
	font-weight:bold;
}
.sFcontent input {
    width: 100%;
    padding: 10px;
    margin-bottom: 20px;
    border: 2px solid #333333;
    border-radius: 5px;
    font-size: 16px;
	box-sizing: border-box;
}
.sFcontent select {
    width: 100%;
    padding: 10px;
	box-sizing: border-box;
    margin-bottom: 20px;
    border: 2px solid #333333;
    border-radius: 5px;
    font-size: 16px;
}

.sFcontent button {
    width: 100%;
    padding: 10px;
    background-color: #333;
    color: #fff;
    border: none;
    border-radius: 5px;
    font-size: 16px;
    cursor: pointer;
}

.sFcontent button:hover {
    background-color: #555;
}
.sFcontent .gobtn{
    padding: 10px 15px;
    font-size: 24px;
    background: #eb3a00 !important;
    color: #fff !important;
    width: 100%;
    font-weight: bold;
    border-radius: 5px;
}
.sFcontent .gobtn:hover{
    background: #d23400 !important;
    color: #fff !important;
}

.sFcontent .printbtn{
    width: 100%;
    padding: 10px;
    background:#333;
    color: #fff;
    border: none;
    border-radius: 5px;
    font-size: 24px;
	font-weight:bold;
    cursor: pointer;
	border: 1px solid #CCC;
}

.sFcontent #currencyAuto,.sFcontent #currencyMortgage,.sFcontent #currency {
    width: 100%;
    padding: 10px;
    margin-bottom: 20px;
    border-radius: 5px;
    font-size: 16px;
}
.sFcontent p.brand{
	margin-bottom:0px;
	padding-top:0px;
	color:#222;
	font-size:14px;
	display:none;
}
.sFcontent p.brand a{
	color:#222;
	text-decoration:underline;
}


.sFcontent .result {
    margin-top: 20px;
    font-size: 18px;
    font-weight: bold;
    text-align: left;
	color:#333;
}
.sFcontent .result p{
	/*color:#333;*/
}
.sFcontent .result div.table-responsive{
	overflow-x:scroll;
}
.sFcontent .result table{
	width:100%;
}
.sFcontent .result table tr th,.sFcontent .result table tr td{
	padding:5px;
	color:#fff;
}
.sFcontent .result table thead tr{
	background:#1b1b1b;
}
.sFcontent .result table tr td{
	font-weight:normal;
}


.sFcontent .result table tr:nth-child(odd) td{
    background:#565656;
}
.sFcontent .result table tr:nth-child(even) td{
    background-color: #3e3e3e;
}

.sFcontent .text-box{
	color:#222;
}
.sFcontent .text-box h1{
	margin-top:0px;
}

/*Basic calculator*/
/*Basic calculator*/
/*Basic calculator*/
.basic-calculator {
    /*background-color: #333;*/
    padding: 0px;
	width: 100%;
    max-width: 100%;
}

.basic-calculator #expression {
    width: 100%;
    min-height:30px;
	padding: 7px 10px!important;
	box-sizing: border-box;

    background-color: #222;
    color: #888;
    border: none;
    text-align: right;
    
    font-size: 14px;
    border-radius: 5px;
    margin-bottom: 5px;
}
.basic-calculator #display {
    width: 100%;
	padding: 10px;
	box-sizing: border-box;
    height: 50px;
	
    background-color: #222;
    color: #fff;
    border: none;
    text-align: right;
    font-weight:bold;
    font-size: 24px;
    border-radius: 5px;
    margin-bottom: 10px;
}

.basic-calculator .buttons {
    display: grid;
    gap: 10px;
}

.basic-calculator .basic-buttons {
    grid-template-columns: repeat(4, 1fr);
}

.basic-calculator .advanced-buttons {
	margin-top:10px;
    grid-template-columns: repeat(4, 1fr);
    display: none; /* Hidden by default */
}

.basic-calculator #toggle-advanced {
    width: 100%;
    padding: 10px;
    margin-bottom: 10px;
    background-color: #555;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.basic-calculator #toggle-advanced:hover {background-color: #666;}

.basic-calculator button {
    background-color: #444;
    color: #fff;
    border: none;
    padding: 20px;
    font-size: 18px;
    border-radius: 5px;
    cursor: pointer;
}

.basic-calculator button:hover {background-color: #555;}
.basic-calculator button:active {background-color: #666;}
.basic-calculator button.cal{
	background:#262626 !important;
}
.basic-calculator button.cal:hover{
	background:#212121 !important;
}

/* Responsive Design for Wider Screens */
@media (min-width: 600px) {
.basic-calculator .buttons {
	grid-template-columns: repeat(5, 1fr); /* Adjust for wider screens */
}

.basic-calculator .basic-buttons {
	grid-template-columns: repeat(5, 1fr);
}

.basic-calculator .advanced-buttons {
	grid-template-columns: repeat(4, 1fr);
}
}
.equal{background:#eb3a00 !important;}
.equal:hover{background:#fb3f01 !important;}

/*.mortgage-calculator*/
/*.mortgage-calculator*/
/*.mortgage-calculator*/
.mortgage-calculator {
	/*background-color: #333;*/
    padding: 0px;
	width: 100%;
    max-width: 100%;
}


/*.loan-calculator*/
/*.loan-calculator*/
/*.loan-calculator*/
.loan-calculator {
    /*background-color: #333;*/
    padding: 0px;
	width: 100%;
    max-width: 100%;
}
.loan-calculator .result {
    margin-top: 20px;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}

.loan-calculator .result p {
    margin: 10px 0;
	color:#fff;
}
/*.auto-calculator*/
/*.auto-calculator*/
/*.auto-calculator*/
.auto-loan-calculator {
    /*background-color: #333;*/
    padding: 0px;
	width: 100%;
    max-width: 100%;
}
.auto-loan-calculator .result {
    margin-top: 20px;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}

.auto-loan-calculator .result p {
    margin: 10px 0;
}

.table-hover>tbody>tr:hover {
    background-color: #5e5e5e !important;
}
/*.percentage-calculator*/
/*.percentage-calculator*/
/*.percentage-calculator*/
.percentage-calculator{}
.percentage-calculator #partPercentageResult{
	margin-bottom:0px;
	color:#fff;
}
.percentage-calculator #valuePercentageResult{
	margin-bottom:0px !important;
	color:#fff;
}
.currency-calculator{}
.currency-calculator .result{color:#fff;}
.currency-calculator .history{color:#fff;}
.currency-calculator p a{color:#ccc;}

.bmi-calculator{}
.bmi-calculator .result{margin-top:15px;}
.bmi-calculator .result p{color:#fff;}
.bmi-progress {
    width: 100%;
    height: 20px;
    display: flex;
    position: relative;
    border: 1px solid #000;
  }
  .bmi-section {
    flex: 1;
    height: 100%;
  }
  .underweight { background-color: blue; }
  .normal { background-color: green; }
  .overweight { background-color: orange; }
  .obesity { background-color: red; }
  .bmi-marker {
    position: absolute;
    top: 0;
    width: 5px;
    height: 100%;
    background-color: black;
    transition: left 0.5s;
  }
  
  
  
  
  
  
  
  
 .progress-bar { width: 100%; height: 20px; background: lightgray; }
  .progress { height: 100%; background: green; }

/*.mix*/
/*.mix*/
/*.mix*/
.clear::after {
  display: block;
  clear: both;
  content: "";
}
.space{
	margin-top:30px;
	margin-bottom:30px;
}
.theme-color{color:#eb3a00;}
.converted-amount{font-size:24px;}
.text-disclaimer{color:#222;}
.exchange-rate{font-weight:normal;}