.sticky-top {
    position: sticky;
    /* position: fixed; */
	top: 0;
    /* width: 90%; */
    /* Optional: add other styling as needed */
    background-color: #d8d8d8;
    padding: 10px;
    text-align: center;

	display: flex;
}

.sticky-bottom {
    position: fixed;
    bottom: 0;
    width: 100%;
    min-height: 32px;
    /* Optional: add other styling as needed */
    background-color: #f1f1f1;
    padding: 10px;
    text-align: center;

	display: flex;
}

.btn-bottom{
    flex: 1;
    text-align: center;
    border: 0px solid black;
    cursor: pointer;
}



body {
    width: 100vw;  /* 100% of the viewport width */
    /* height: 100vh; 100% of the viewport height */
	height: calc(100vh - 160px);
    margin: 0;     /* Remove any default margin */
    font-family: Arial, Helvetica, sans-serif;
}





.rounded-rect {
    margin: 2px;
    width: 256px;
    height: 64px;
    border: 1px solid black;
    background-color: white;
    border-radius: 10px;
}





input[type="button"] {
    border: 2px solid red;
	font-size: 12pt;
}





/* Hide the default checkbox */
input[type="checkbox"] {
    appearance: none;
    width: 40px;
    height: 40px;
    border: 2px solid #555;
    border-radius: 4px;
    outline: none;
    cursor: pointer;
}

/* Checked state */
input[type="checkbox"]:checked {
    /* background-color: #4CAF50; */
    background-color: #5270ca;
    /* border-color: #4CAF50; */
    border-color: #5270ca;
    position: relative;
}

/* Add a checkmark when checked */
input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 7px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}





input[type="text"] {
	padding: 10px;
	width: 90%;
    padding: 5px;
    box-sizing: border-box;
	border: 2px solid #ccc;
	border-radius: 10px; /* Rounded corners */
	font-size: 16px;
	outline: none;
	transition: border-color 0.3s ease-in-out;
}

input[type="text"]:focus {
	border-color: #4CAF50; /* Border color on focus */
}




input[readonly] {
    background-color: transparent;
    border: none;
    color: inherit;
    font: inherit;
    padding: 0;
    cursor: default;
    outline: none;
}

input[readonly]:focus {
    outline: none;
}




object {
    width: 64;
    pointer-events: none;
  }



* {
	box-sizing: border-box; /* Ensures padding/border doesn't cause overlap */
}


/*
.feed_row_player {
    /* border: 2px solid red; * /
    /* margin: 10px; * /
}
*/

.feed_row {
    /* flex: 1 0; */
    border-bottom: 1px solid rgb(191, 191, 191);
    padding: 2px;
    margin: 0px;
    min-height: 120px;
    vertical-align: top;
    background-color: rgb(223, 223, 223);
    _background-color: rgb(214, 112, 112);
}

.feed_row_title {
    flex: 1 1;
    border-left: 2px solid rgb(99, 99, 254);
    background-color: rgb(213, 213, 213);
    padding: 5px;
}

.feed_row_title_old {
    flex: 1 1;
    /* border: 1px solid blue; */
    background-color: rgb(213, 213, 213);
    padding: 5px;
    color: rgb(96, 96, 96);
    
}

.feed_row_title_distant {
    flex: 1 1;
    /* border: 1px solid blue; */
    background-color: rgb(213, 213, 213);
    padding: 5px;
    color: rgb(97, 94, 77);
    
}






.feed_row_body {
    flex: 1 1;
    /* dont change bg color here, only padding, see feed_row */
    _background-color: rgb(223, 223, 223);
    padding: 5px;
    padding-left: 20px;
    /* margin: 5px; */
}




.form-container {
	width: 300px; /* Adjust width as needed */
	margin: 0 auto; /* Horizontally centers the div */
	position: relative;
	top: 25%;
	left: 50%;
	transform: translate(-50%, -50%); /* Vertically centers the div */
}


.home_downloading_msg {
	width: 300px; /* Adjust width as needed */
	margin: 0 auto; /* Horizontally centers the div */
	position: absolute;
	top: 25%;
	left: 50%;
	transform: translate(-50%, -50%); /* Vertically centers the div */
}



.quick_menu{
    border: 0px solid red;

    width: 100%;
    /* margin-left: 10%; */
    /* margin-right: 10%; */
    
    display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 80vh; /* Adjust based on the parent container's height */
}

.qm_button{
    width: 80%;
    height: 50px;
    font-size: 20px !important;
}

.qm_button2{
    width: 80%;
    height: 50px;
    font-size: 20px !important;
    background-color: rgb(88, 134, 157) !important;
}