@font-face
{
	font-family: main;
	src: url('OpenSans-Regular.ttf');
}

body, html
{
	font-family: main;
	padding: 0;
	margin: 0;
}

.gif_loader
{
	//background: red;
	width: 50%;
	display: block;
	margin: auto;
}

/*------index page-----*/
	.index_cover img
	{
		width: 100%;
		height: 300px;
		object-fit: cover;
		object-position: center;
	}

/*-----login portal------*/
	.login_portal
	{
		width: 400px;
		box-shadow: 0px 0px 5px grey;
		border-radius: 3px;
		margin:auto;
		text-align: center;
		padding: 2%;
	}

	.login_portal img
	{
		width: 60%;
	}

	.login_button
	{
		width: 80px;
		height: 35px;
		background: #cc0000;
		color: white;
		border: none;
		border-radius: 5px;
	}

	.login_portal input
	{
		width: 300px;
		height: 35px;
		border: none;
		padding: 3px;
		background: white;
		border: 1px solid grey;
		border-radius: 3px;
	}

	.forget_pass_button, .forget_pass_button:hover
	{
		color: black;
		text-decoration: none;
	}

/*-----add user area------*/
	.user_entry_form input, .user_entry_form select
	{
		width: 300px;
		height: 35px;
		border-radius: 3px;
		border: 1px grey solid;
		padding: 5px;
	}

	.user_entry_form textarea
	{
		width: 300px;
		height: 80px;
		border-radius: 3px;
		border: 1px grey solid;
		padding: 5px;
		resize: none;
	}

	.admin_user_container button, .user_entry_form button
	{
		width: auto;
		height: 33px;
		border-radius: 3px;
		border: none;
		padding: 5px;
		background: #cc0000;
		color: white;
		margin: 2px;
	}

	#create_new_user_button
	{
		width: 300px;
		height: 35px;
		border-radius: 3px;
		border: 1px grey solid;
		padding: 5px;
		display: none;		
	}

/*---manage user area--------*/
	.user_list_container
	{
		width: 100%;
		overflow-x: scroll;
	}

	.user_list_container::-webkit-scrollbar 
	{ 
	    display: none;  // Safari and Chrome
	}

	.list_user_title
	{
		padding: 0;
		margin: 0;
		margin: auto;
	}

	.list_user_title th
	{
		border: 1px grey solid;
		background: silver;
		padding: 5px;
		width: 150px;
		text-align: center;
	}

	.list_user_title td
	{
		background: lightgrey;
		border: 1px grey solid;
		padding: 5px;
		width: 150px;
		text-align: center;
	}

	.list_user_title td img
	{
		width: 17px;
		margin: 4px;
		margin-left: 8px;
		margin-right: 8px;
		cursor: pointer;
	}

	.change_password_div
	{
		display: none;
	}

/*----add inventory area-----*/
	.inventory_form input, .inventory_form select
	{
		width: 300px;
		height: 35px;
		border-radius: 3px;
		border: 1px grey solid;
		padding: 5px;
	}

	.inventory_form button
	{
		width: auto;
		height: 33px;
		border-radius: 3px;
		border: none;
		padding: 5px;
		background: #cc0000;
		color: white;
	}

	.inventory_tab button
	{
		width: 130px;
		margin:0;
		height: 40px;
	}

	.parts_only_input
	{
		//display: none;
	}

	#inv_add_new_button
	{
		width: 300px;
		height: 35px;
		border-radius: 3px;
		border: 1px grey solid;
		padding: 5px;

		display: none;
	}

/*---manage inventory area-------*/
	.inventory_list_container
	{
		width: 100%;
		overflow-x: scroll;
		text-align: center;
	}


	.inventory_list_container table
	{
		margin:auto;
	} 

	.inventory_list_container th
	{
		border: 1px grey solid;
		background: silver;
		padding: 5px;
		width: 150px;
		text-align: center;
	}

	.inventory_list_container td
	{
		background: lightgrey;
		border: 1px grey solid;
		padding: 5px;
		width: 150px;
		text-align: center;
	}

	.inventory_list_container td img
	{
		width: 17px;
		margin: 4px;
		margin-left: 8px;
		margin-right: 8px;
		cursor: pointer;
	}

	.whole_unit_table
	{
		padding: 0;
		margin: 0;
		margin: auto;
	}

	.part_only_table
	{
		//display: none;
	}

/*-----admin branch selector-----*/
	#admin_select_branch
	{
		width: 300px;
		height: 35px;
		border-radius: 3px;
		border: 1px grey solid;
		padding: 5px;
	}

	.admin_select_branch_text
	{
		font-size: 120%;
	}

/*-----ajax loader box-----*/
	.ajax_loader_bckgrnd
	{
		position: fixed;
		top:0;
		left:0;
		background: black;
		width: 100%;
		height: 100%;
		opacity: .3;
		z-index: 50;

		display: none;
	}

	.ajax_loader_box
	{
		position: fixed;
		top: 10px;
		left:0;
		right: 0;
		margin:auto;
		width: 40%;
		height: 95%;
		overflow-y: scroll;
		background: white;
		padding: 10px;
		text-align: center;
		box-shadow: 0px 0px 3px grey;
		border-radius: 5px;
		z-index: 51;
		display: none;
	}

	.close_icon
	{
		text-align: right;	
	}

	.close_icon img
	{
		width: 20px;
		cursor: pointer;
	}

/*-----warning ajax box-------*/
	.warn_box
	{
		position: fixed;
		top: 45%;
		left: 0;
		right: 0;
		margin: auto;
		background: #cc0000;
		padding: 8px;
		width: 40%;
		box-shadow: 0px 0px 5px black;
		border: 5px white solid;
		color: white;
		font-size: 110%;
		text-align: center;
		border-radius: 3px;
		z-index: 205;

		display: none;
	}

/*--user module menu bar-------*/
	.user_module_menu_bar
	{
		margin:0;
		padding: 0;
		width: 20%;
		height: 100%;
		overflow-y: scroll;
		background: #333;
		transition: .7s;

		position: fixed;
		top:0px;
		left:0;
		z-index: 20;
	}
	
	.user_module_menu_bar::-webkit-scrollbar 
	{ 
	    display: none;  // Safari and Chrome
	}

	.menu_close
	{
		display: none;
	}

	.user_module_profile
	{
		text-align: center;
		margin-top: 20px;
	}

	.user_module_profile img
	{
		width: 60px;
		border-radius: 50%;
		background: white;
	}

	.user_module_profile span
	{
		font-size: 110%;
		color: white;
	}
 
	.go_to_admin, .go_to_admin:hover
	{
		width: 100%;
		height: 33px;
		border-radius: 3px;
		border: none;
		padding: 10px;
		background: #cc0000;
		color: white;
		text-decoration: none;
	}

	.user_menu
	{
		//background: white;
		margin:0;
		padding: 0;
		list-style: none;
		text-align: left;
		color: white;
	}

	.user_menu li
	{
		//background: red;
		padding: 10px;
		padding-left: 25px;
		margin-top: 2px;
		margin-bottom: 2px;
		cursor: pointer;
	}

	.user_menu ul
	{
		list-style: none;
		padding: 0;
		padding-left:10px;

		display: none;
	}

	.user_menu ul li
	{
		padding: 5px;
		margin: 1px;
		cursor: pointer;
	}

	.user_menu ul a, .user_menu ul a:hover
	{
		text-decoration: none;

		padding: 5px;
		padding-left: 20px;
		margin: 1px;
		cursor: pointer;
		display: block;
		color: white;
	}

/*----user module--title-area------*/
	.user_module_title
	{
		width: 80%;
		background: #f1f1f1;
		position: fixed;
		top:0px;
		left: 20%;
		z-index: 10;
		vertical-align: middle;
		transition: .7s;
	}

	.logo_menu
	{
		width: 68%;
		//background: red;
		display: inline-block;
		text-align: left;
		vertical-align: middle;
	}


	.mob_menu_button
	{
		height: 50px;
		cursor: pointer;
		display: none;
		vertical-align: middle;
	}

	.company_logo
	{
		height: 45px;
		vertical-align: middle;
		//margin-left: 10px;
	}

	.user_logout
	{
		width: 30%;
		display: inline-block;
		text-align: right;
	}

	.user_logout_button
	{
		margin-left: 30px;
		width: 26px;
		border-radius: 50%;
		background: #cc0000;
		padding: 3px;
		cursor: pointer;
	}

/*----user module--content area------*/
	.user_module_area
	{
		position: absolute;
		top:50px;
		left: 20%;
		width:80%;
		z-index: 10;
		transition: .7s;
		vertical-align: top;
		margin:0;
		padding: 0;
		z-index: 5;
	}

	.user_module_heading
	{
		padding-left: 15px;
	}

	.user_module_content
	{
		padding: 10px;
		text-align: center;
	}

	#sel_new_pro_add_button
	{
		width: auto;
		height: 33px;
		border-radius: 3px;
		border: none;
		padding: 7px;
		background: #cc0000;
		color: white;	

		display: none;
	}

	.user_module_content button
	{
		width: auto;
		height: 33px;
		border-radius: 3px;
		border: none;
		padding: 7px;
		background: #cc0000;
		color: white;
	}

/*------purchase tab---------*/
	.add_purchase_form
	{
		text-align:left; 
		padding-left:20px;
		width: 100%;
		overflow-x: scroll;
	}

	.purchase_entry_table th
	{
		border: 1px grey solid;
		background: silver;
		padding: 8px;
		text-align: center;
	}

	.purchase_entry_table td
	{
		background: lightgrey;
		border: 1px grey solid;
		text-align: center;
	}

	.purchase_entry_table input, .purchase_entry_table select
	{
		width: 170px;
		border:none;
	}

	.purchase_entry_table td img
	{
		width: 17px;
		margin: 4px;
		margin-left: 8px;
		margin-right: 8px;
		cursor: pointer;
	}

/*-------quotation tab---------*/
	.add_quotation_form
	{
		width: 100%;
		overflow-x: scroll;
		text-align: left;
	}
	
	.add_quotation_form div
	{
		display: inline-block;
		margin: 5px;
		vertical-align: top;
	}

	.quotation_entry_table th
	{
		border: 1px grey solid;
		background: silver;
		padding: 5px;
	}

	.quotation_entry_table td
	{
		background: lightgrey;
		border: 1px grey solid;
	}

	.quotation_entry_table input, .quotation_entry_table select
	{
		width: 140px;
		border: none;
	}

	.quotation_entry_table td img
	{
		width: 17px;
		margin: 4px;
		margin-left: 8px;
		margin-right: 8px;
		cursor: pointer;
	}

	#gen_new_quotation_button
	{
		width: 300px;
		height: 35px;
		border-radius: 3px;
		border: 1px grey solid;
		padding: 5px;

		display: none;
	}

	#quotation_part_total_price
	{
		background: #cc0000;
	}

	.quotation_search_div
	{
		background: #f1f1f1;
		border-radius: 4px;
		margin: auto;
		padding: 5px;
		display: block;
		text-align: center;
		width: 100%;
	}

	.quotation_search_div div
	{
		display: inline-block;
	}

	#quotation_search_suggestion
	{
		position: absolute;
		height: 200px;
		overflow-y: scroll;
		overflow-x: hidden;
		background: #f1f1f1;
		text-align: left;
		box-shadow: 0px 0px 1px grey;
		display: none;
	}

	#search_result_span
	{
		width: 100%;
		padding: 4px;
		margin-top: 1px;
		margin-bottom: 1px;
		cursor: pointer;
	}

	#search_result_span:hover
	{
		background: lightgrey;
	}

	.ask_mailing_div
	{
		display: none;
	}

	.ask_mailing_div input
	{
		width: auto;
		border-radius: 3px;
		color: white;
		border: none;
		padding: 5px;
		background: #cc0000;
	}

	#invoice_gen_edit_button, #performa_invoice_gen_edit_button
	{
		//display: none;
	}

	.add_note_div
	{
		display: none;
	}

	#add_note_button
	{
		
	}

/*----quotation manage-------*/
	.quotation_list_container
	{
		width: 100%;
		overflow-x: scroll;
		text-align: center;
	}

	.quotation_list_container table
	{
		margin: auto;
	}

	.quotation_list_container::-webkit-scrollbar 
	{ 
	    display: none;  // Safari and Chrome
	}

	.quotation_list_container th
	{
		border: 1px grey solid;
		background: silver;
		padding: 5px;
		width: 150px;
		text-align: center;
	}

	.quotation_list_container td
	{
		background: lightgrey;
		border: 1px grey solid;
		padding: 5px;
		width: 150px;
		text-align: center;
	}

	.quotation_list_container td img
	{
		width: 17px;
		margin: 4px;
		margin-left: 8px;
		margin-right: 8px;
		cursor: pointer;
	}

	.view_quotation_button
	{
		display: none;
	}

	.change_branch_button
	{
		width: auto;
		height: 33px;
		border-radius: 3px;
		border: none;
		padding: 5px;
		background: #cc0000;
		color: white;
	}

	#invoice_gen_button
	{
		float: right;
	}

	.view_quotation_button
	{
		width: auto;
		height: 33px;
		border-radius: 3px;
		border: none;
		padding: 5px;
		background: #cc0000;
		color: white;
	}

	.pdf_button
	{
		color: #cc0000;
		background: white;
	}

/*--------report area area------*/
	.report_type_div
	{
		padding: 4px;
		background: #f1f1f1;
		border-radius: 4px;
		display: block;
		margin: auto;
		width: 70%;
		text-align: center;
		box-shadow: 0px 0px 1px grey;
	}

	.search_date_div
	{
		padding: 7px;
		background: #f1f1f1;
		border-radius: 10px;
		display: block;
		margin: auto;
		width: 70%;
		text-align: center;
		box-shadow: 0px 0px 1px grey;
	}

	.search_date_div input
	{
		width: 180px;
		height: 33px;
		border-radius: 3px;
		box-shadow: 0px 0px 1px grey;
		border: none;
		padding: 3px;
		margin: 3px;
	}

	.sum_of_money_div
	{
		text-align: center;
		background: #f1f1f1;
		border-radius: 5px;
		padding: 1px;
	}

/*---------user dashboard area----------*/
	.dashboard_container
	{
		width: 100%;
	}

	.dashboard_container button
	{
		width: 30%;
		height: 150px;
		vertical-align: bottom;
		border-radius: 3px;
		margin: 5px;
		//color: black;
		font-size: 120%;
		text-align: left;
		padding: 10px;
	}

	.dashboard_container button img
	{
		height: 80%;
		padding: 10px;
	}

/*---media query-------*/
@media screen and (max-width: 800px)
{
	.gif_loader
	{
		//background: red;
		width: 100%;
		display: block;
		margin: auto;
	}

/*------index page-----*/
	.index_cover img
	{
		width: 100%;
		height: 200px;
		object-fit: cover;
		object-position: bottom;
	}

/*-----login portal------*/
	.login_portal
	{
		width: 95%;
		box-shadow: 0px 0px 5px grey;
		border-radius: 3px;
		margin:auto;
		text-align: center;
		padding: 4%;
	}

	.login_portal input
	{
		width: 95%;
		height: 35px;
		border: none;
		padding: 3px;
		background: white;
		border: 1px solid grey;
		border-radius: 3px;
	}

/*--warn box--*/
	.warn_box
	{
		width: 80%;
	}

/*-----admin user area------*/
	.user_entry_form input, .user_entry_form select
	{
		width: 90%;
		height: 35px;
		border-radius: 3px;
		border: 1px grey solid;
		padding: 5px;
	}

	.user_entry_form textarea
	{
		width: 90%;
		height: 80px;
		border-radius: 3px;
		border: 1px grey solid;
		padding: 5px;
		resize: none;
	}

/*---user listing area--------*/
	.list_user_title tr th, .list_user_title tr td
	{
		border: 1px grey solid;
		padding: 5px;
		width: 200px;
		text-align: center;
	}

/*------ajax loader div--------*/
	.ajax_loader_box
	{
		width: 90%;
	}

/*----user module---area------*/
	.mob_menu_button
	{
		display: inline-block;
	}

	.user_module_menu_bar
	{
		width: 70%;
		left:-70%;
		//display: none;
	}

	.menu_close
	{
		display: block;
		float:right;
		cursor: pointer;
		width: 30px;
		padding: 6px;
	}

	.user_module_title
	{
		width: 100%;
		left:0;
	}

	.user_module_area
	{
		width: 100%;
		left:0;
	}

/*------purchase tab and quotation tab------*/
	.purchase_entry_table input, .purchase_entry_table select
	{
		width: 130px;
		border:none;
	}

	.quotation_entry_table input, .quotation_entry_table select
	{
		width: 100px;
		border:none;
	}

/*---------user dashboard area----------*/
	
	.dashboard_container button
	{
		width: 90%;
		height: 110px;
		vertical-align: bottom;
		border-radius: 3px;
		margin: 5px;
		//color: black;
		font-size: 120%;
	}

	.dashboard_container button img
	{
		height: 80%;
	}


}