h1 {
	color:blue;
}

.fset {
	float:left;
	padding:5px;
}

.form_tab {
	border:1px solid grey;
	padding:0.8em;
	cursor:pointer;
}

.menu_button {
	width:100%;
	margin:0.5em;
}

.q_number {
    padding-top:0.7em;
    border-radius:15px;
    border:3px solid black;
    font-size:12em;
    text-align:center;
    height:70%;
    width:90%;
}

.q_display {
    padding-top:0.7em;
    border-radius:15px;
    border:3px solid black;
    font-size:5px;
    text-align:center;
    height:85%;
    width:90%;
}

.place_border {
 
    border:5px solid black;
    
}

.rfield {
	background-color:lightcyan;
}

#carts {

	border:1px solid lightgrey;
	width:100%;
	height:60%;
	overflow-y:auto;
	overflow-x:auto;
}

#transactions {

	border:1px solid lightgrey;
	width:100%;
	height:60%;
	overflow-y:auto;
	overflow-x:auto;
}

#cases {

	border:1px solid lightgrey;
	width:100%;
	height:60%;
	overflow-y:auto;
	overflow-x:auto;
}

#check_ups {

	border:1px solid lightgrey;
	width:100%;
	height:60%;
	overflow-y:auto;
	overflow-x:auto;
}

#entries {

	border:1px solid lightgrey;
	width:100%;
	height:60%;
	overflow-y:auto;
	overflow-x:auto;
}

#grades {

	border:1px solid lightgrey;
	width:100%;
	height:70%;
	overflow-y:auto;
	overflow-x:auto;
}

.logo {
	max-width:100%;
}

#search_result2 {

	border:1px solid lightgrey;
	width:100%;
	height:65%;
	overflow-y:auto;
	overflow-x:auto;
}

#sales_items {

	border:1px solid lightgrey;
	width:100%;
	height:65%;
	overflow-y:auto;
	overflow-x:auto;
}

#sales_returns {

	border:1px solid lightgrey;
	width:100%;
	height:65%;
	overflow-y:auto;
	overflow-x:auto;
}

#collections_overpayments {

	border:1px solid lightgrey;
	width:100%;
	height:65%;
	overflow-y:auto;
	overflow-x:auto;
}

#pending_students {

	border:1px solid lightgrey;
	width:100%;
	height:65%;
	overflow-y:auto;
	overflow-x:auto;
}

#login_div {
	border:1px solid grey;
	text-align:center;
	margin: auto 0;
	width:30em;
}

.logo2 {
	max-width:100%;
}


@media screen and (max-width: 480px) {
	.logo {
		width: 100%; /* The width is 100%, when the viewport is 800px or smaller */
	}
	.logo2 {
		height:3em;
	}
	
  
	#login_div {
		border:1px solid grey;
		text-align:center;
		margin: auto 0;
		width:100%;
	}
  
}

#current_form {
	background-color:lightcyan;
	color:blue;
}

.totals {
	background-color:yellow;
	font-weight:bold;
	font-size:1.5em;
}

.totals2 {
	background-color:lightgreen;
	font-weight:bold;
	font-size:1.5em;
}

#user_modules {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}


#records {
	border:1px solid grey;
	height:80%;
	width:100%;
	overflow-y:auto;
}

#entry_div {

	overflow-x:none;
	overflow-y:auto;
}

#schedules_div {

	overflow-y:auto;
	overflow-x:auto;
	height:60%;
	border:1px solid black;
}

#enlisted_div {

	overflow-y:auto;
	overflow-x:auto;
	height:60%;
	border:1px solid black;
}

#enlisted_div2 {

	overflow-y:auto;
	overflow-x:auto;
	height:60%;
	width:100%;
	border:1px solid black;
}

#add_drop_div {

	overflow-y:auto;
	overflow-x:auto;
	height:60%;
	width:100%;
	border:1px solid black;
}

#account_ledger_div {

	overflow-y:auto;
	overflow-x:auto;
	height:60%;
	width:100%;
	border:1px solid black;
}

#collection_div {

	overflow-y:auto;
	overflow-x:auto;
	height:60%;
	width:100%;
	border:1px solid black;
}

#deposit_div {

	overflow-y:auto;
	overflow-x:auto;
	height:60%;
	width:100%;
	border:1px solid black;
}

#grades_div {

	overflow-y:auto;
	overflow-x:auto;
	height:70%;
	width:100%;
	border:1px solid black;
}


.tab_hilite {
	background-color:yellow;
	border:2px solid black;
	
}

.table_header {
	background-color:cyan;
	color:black;
	font-weight:regular;
	border:1px solid grey;
}

#search_div {

	border:1px solid lightgrey;
	width:100%;
	height:65%;
	overflow-y:auto;
	overflow-x:auto;
}





#menu_div {
	border:1px solid grey;
	padding:10px;
	margin-bottom:10px;
}

#student_div {
	border:1px solid grey;
	padding:10px;
	margin-left:10px;
	height:90%;
	overflow-y:auto;
}

.field {
	border:1px solid grey;
	background-color:lightcyan;
	display:block;
}

#search_result {
	margin-top:10px;
	margin-bottom:10px;
	border:1px solid grey;
	padding:10px;
	height:50%;
	overflow-y:auto;
}


.dropdown-submenu {
    position: relative;
}

.dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
}

.menubar {
	background-color:black;
}

.menulink {
	color:white;
}

.hilite {
	background-color:lightgreen;
	font-weight:bold;
	border:2px solid grey;
}

.hilite_button {
    padding:5px;
	background-color:lightgreen;
	font-weight:bold;
	border:2px solid grey;
}

button {
	border:1px solid grey;
}

.btn {
	border:1px solid grey;
}

.button_focus {

	background:blue;
	color:white;
	border:3px solid black;
	box-shadow: 0 0 5px -1px rgba(0,0,0,0.6);
}

button {
	padding:2px 10px;
	background-color:grey;
	color:white;
	border:1px solid lightgrey;
}



.popup {
	position: fixed;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	padding:20px;
	border:1px solid black;
	background-color:yellow;
}

.hover {
	background-color:yellow;
}

#photo {
	background-color:grey;
	width:192px;
	height:144px;
	border:1px solid grey;
	margin-bottom:5px;
}

#photo2 {
	background-color:grey;
	width:134px;
	height:108px;
	border:1px solid grey;
	margin-bottom:5px;
}

#client_photo {
	background-color:grey;
	width:192px;
	height:144px;
	border:1px solid grey;
}
.current_case {
	background-color:blue;
	color:white;
}


.client_name {
	font-size:1.5em;
	background-color:yellow;
	color:black;
}

.selected {
	background-color:lightblue;
}

.info_class {
	background-color:lightyellow;
	font-weight:bold;
	border:1px solid grey;
}
.service_price,.item_price,.item_quantity,.item_total,.prescription_item_description, 
.prescription_item_quantity,.prescription_signa_description,.prescription_signa2,
.diagnosis_diagnosis_description
{
	background:transparent;
	border:1px solid grey;
	font-weight:normal;
}

.cancelled {
	background-color:red;
	color:white;
}

.ongoing {
	background-color:darkblue;
	color:white;
}

#total_bill {
	background-color:yellow;
	font-size:1.2em;
	font-weight:bold;
}

.done {
	background-color:lightgrey;
}

#photo_result { float:left; width:320px; height:240px; border:1px solid black; background:#ccc; }
#my_camera { float:left; width:320px; height:240px; border:1px solid black; background:#ccc; }

#prescriptions { width:100%; border:1px solid grey; height:20%; overflow-y:auto; }
#diagnosis { width:100%; border:1px solid grey; height:18%; overflow-y:auto; }
#services { width:100%; border:1px solid grey; height:20%; overflow-y:auto; }
#items { width:100%; border:1px solid grey; height:18%; overflow-y:auto; }
#photos { width:100%; border:1px solid grey; height:20%; overflow-y:auto; }
#services2 { width:100%; border:1px solid grey; height:18%; overflow-y:auto; }
#items2 { width:100%; border:1px solid grey; height:18%; overflow-y:auto; }
#items3 { width:100%; border:1px solid grey; height:30%; overflow-y:auto; }
#items_all { width:100%; border:1px solid grey; height:30%; overflow-y:auto; }

#item_transactions { width:100%; border:1px solid grey; height:50%; overflow-y:auto; }

#user_rights {

	border:1px solid lightgrey;
	width:100%;
	height:80%;
	overflow-y:auto;
	overflow-x:hidden;
}

#product_discounts {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#product_units {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#product_prices {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#physical_count_details {

	border:3px solid lightgrey;
	width:100%;
	height:70%;
	overflow-y:auto;
	overflow-x:auto;
}

#adjustment_details {

	border:3px solid lightgrey;
	width:100%;
	height:70%;
	overflow-y:auto;
	overflow-x:auto;
}

#transfer_details {

	border:3px solid lightgrey;
	width:100%;
	height:70%;
	overflow-y:auto;
	overflow-x:auto;
}

#item_prices {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#item_suppliers {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#employee_positions {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#employee_education {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#employee_dependents {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#employee_documents {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#employee_civil_services {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#employee_references {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#employee_work_experiences {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#pickup_details {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#delivery_details {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#employee_list {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:hidden;
	padding-top:1em;
}

#course_list {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:hidden;
	padding-top:1em;
}

#special_fee_list {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:hidden;
	padding-top:1em;
}

#adjustment_list {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
	padding-top:1em;
}

#adjustment_students {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:hidden;
}

#teacher_list {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#teacher_degrees {

	border:1px solid lightgrey;
	width:100%;
	height:20%;
	overflow-y:auto;
	overflow-x:auto;
}

#teacher_civil_services {

	border:1px solid lightgrey;
	width:100%;
	height:20%;
	overflow-y:auto;
	overflow-x:auto;
}

#subjects {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:hidden;
}


#fees_schedules {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#students {

	border:1px solid lightgrey;
	width:100%;
	height:70%;
	overflow-y:auto;
	overflow-x:auto;
}

#sections {

	border:1px solid lightgrey;
	width:100%;
	height:75%;
	overflow-y:auto;
	overflow-x:auto;
}

#fees {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#other_attendance {

	border:1px solid lightgrey;
	width:100%;
	height:25%;
	overflow-y:auto;
	overflow-x:hidden;
}

#adjustments {

	border:3px solid blue;
	width:100%;
	height:25%;
	overflow-y:auto;
	overflow-x:hidden;
}

#loans {

	border:3px solid blue;
	width:100%;
	height:45%;
	overflow-y:auto;
	overflow-x:hidden;
}

#attendance_log {

	border:1px solid lightgrey;
	width:100%;
	height:55%;
	overflow-y:auto;
	overflow-x:hidden;
}


#payroll_div2 {

	border:1px solid lightgrey;
	width:100%;
	height:35%;
	overflow-y:auto;
	overflow-x:hidden;
	font-size:1em;
}

#payroll_div3 {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:hidden;
	font-size:1em;
}

#pickup_list {

	border:1px solid lightgrey;
	width:100%;
	height:70%;
	overflow-y:auto;
	overflow-x:auto;
}

#delivery_list {

	border:1px solid lightgrey;
	width:100%;
	height:70%;
	overflow-y:auto;
	overflow-x:auto;
}

#sale_details {

	border:1px solid lightgrey;
	width:100%;
	height:40%;
	overflow-y:auto;
	overflow-x:auto;
}

#products {

	border:1px solid lightgrey;
	width:100%;
	height:40%;
	overflow-y:auto;
	overflow-x:auto;
}

#sales {

	border:1px solid lightgrey;
	width:100%;
	height:30%;
	overflow-y:auto;
	overflow-x:auto;
}

#purchases {

	border:1px solid lightgrey;
	width:100%;
	height:30%;
	overflow-y:auto;
	overflow-x:auto;
}

#checks {

	border:1px solid lightgrey;
	width:100%;
	height:30%;
	overflow-y:auto;
	overflow-x:auto;
}

#sreturn_details {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#adjustment_details {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}




#purchase_details {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#preturn_details {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#collection_details {

	border:1px solid lightgrey;
	width:100%;
	height:50%;
	overflow-y:auto;
	overflow-x:auto;
}

#collection_checks {

	border:1px solid lightgrey;
	width:100%;
	height:25%;
	overflow-y:auto;
	overflow-x:auto;
}

#check_voucher_purchases {

	border:1px solid lightgrey;
	width:100%;
	height:30%;
	overflow-y:auto;
	overflow-x:auto;
}

#check_voucher_accounts {

	border:1px solid lightgrey;
	width:100%;
	height:30%;
	overflow-y:auto;
	overflow-x:auto;
}

#sale_accounts {

	border:1px solid lightgrey;
	width:100%;
	height:40%;
	overflow-y:auto;
	overflow-x:auto;
}

#purchase_accounts {

	border:1px solid lightgrey;
	width:100%;
	height:30%;
	overflow-y:auto;
	overflow-x:auto;
}

#collection_accounts {

	border:1px solid lightgrey;
	width:100%;
	height:25%;
	background-color:ghostwhite;
	overflow-y:auto;
	overflow-x:auto;
}

#check_voucher_checks {

	border:1px solid lightgrey;
	width:100%;
	height:25%;
	overflow-y:auto;
	overflow-x:auto;
}

#check_voucher_voucher_payables {

	border:1px solid lightgrey;
	width:100%;
	height:25%;
	overflow-y:auto;
	overflow-x:auto;
}

#collection_accounts {

	border:1px solid lightgrey;
	width:100%;
	height:25%;
	overflow-y:auto;
	overflow-x:auto;
}

#journal_voucher_details {

	border:1px solid lightgrey;
	width:100%;
	height:65%;
	overflow-y:auto;
	overflow-x:auto;
}

#cash_receipt_details {

	border:1px solid lightgrey;
	width:100%;
	height:65%;
	overflow-y:auto;
	overflow-x:auto;
}

#cash_voucher_details {

	border:1px solid lightgrey;
	width:100%;
	height:65%;
	overflow-y:auto;
	overflow-x:auto;
}

#voucher_payable_details {

	border:1px solid lightgrey;
	width:100%;
	height:40%;
	overflow-y:auto;
	overflow-x:auto;
}

#voucher_payable_purchases {

	border:1px solid lightgrey;
	width:100%;
	height:30%;
	overflow-y:auto;
	overflow-x:auto;
}

#check_voucher_details {

	border:1px solid lightgrey;
	width:100%;
	height:40%;
	overflow-y:auto;
	overflow-x:auto;
}

#check_voucher_checks {

	border:2px solid lightgrey;
	width:100%;
	height:30%;
	overflow-y:auto;
	overflow-x:auto;
}

#collection_details {

	border:2px solid lightgrey;
	width:100%;
	height:30%;
	background-color:lightcyan;
	overflow-y:auto;
	overflow-x:auto;
}

#collection_checks {

	border:2px solid lightgrey;
	background-color:lightyellow;
	width:100%;
	height:30%;
	overflow-y:auto;
	overflow-x:auto;
}


input,textarea,select {
	font-weight:bold;
	border:1px solid grey;
	background-color:lightgrey;
}

body{
  background-color: white;
  font:12px verdana,arial,sans-serif;
}

.table-fixed tbody {
height: 20em;
overflow-y: auto;
width: 100em;
}
.table-fixed thead,
.table-fixed tbody,
.table-fixed tr,
.table-fixed td,
.table-fixed th {
display: block;
}
.table-fixed tr:after {
content: "";
display: block;
visibility: hidden;
clear: both;
}
.table-fixed tbody td,
.table-fixed thead > tr > th {
float: left;
}


.table > thead > tr > th,
.table > thead > tr > td {
font-size: .9em;
font-weight: 400;
border-bottom: 0;
letter-spacing: 1px;
vertical-align: top;
padding: 8px;
background: #51596a;
text-transform: uppercase;
color: #ffffff;
}

button {
	padding:5px;
}

button:hover {
	color:yellow;
}

button:focus {
	background-color:blue;
}

input:focus {
	background-color:lightyellow;
}

select:focus {
	background-color:lightyellow;
}