/* Your Browser cachs css !!! */

body {
	font-family: Arial, "Times New Roman", Times; 
	margin: 0;
	padding: 0;
}



table, div , h1, h2, h3, h4, h5, h6{
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: Verdana,Arial,Helvetica; 
  vertical-align: baseline;
}

a {
	text-decoration: none;
}

a:visited 
{
    text-decoration: none; 
}


/*  ---------- Main Structure ------------------- */

.page_title {
	padding: 2px;
	text-align: center;
	font-size:25px; 
	color:Black;

}



#backhome {
	display: block;
	position: absolute;
	top: 8px;
	left: 8px;
	float: left;
}


pre {
	font-size: 10px;
	/* font-family:Verdana,Arial,Helvetica; */
}

img {
	border:0;
	cursor: default;
	user-select: none;
}

/*    Top Menu bar with drop down button --------  */
#top_menu_bar {
	display: block;
	position: absolute;
	top: 1px;
	left: 1px;
	float: left;
}

#top_menu_bar_new {
	display: block;
	position:relative; 
	float: left;
	clear:right;
}

ul.top_menu {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: white;
}



li.top_menu_li,  li.top_menu_dropdown {
  float: left;
}

li.top_menu_li a, .dropbtn {
  display: inline-block;
  color: black;
  text-align: center;
  padding: 12px 14px;
  text-decoration: none;
}

 li.top_menu_li a:hover, .top_menu_dropdown:hover .dropbtn {
  color: grey;	
  background-color: #cef442;
}

 li.top_menu_dropdown {
  display: inline-block;
}

 .top_menu_dp-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 200px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

 .top_menu_dp-content a {
  color: black;
  padding: 12px 17px;
  text-decoration: none;
  display: block;
  text-align: left;
  	/* font-size:small; */
}

 .top_menu_dp-content a:hover {
	color: white;
	background-color: #c8cece;

}

 .top_menu_dropdown:hover .top_menu_dp-content {
  display: block;
}

/* ---  end menu bar 1---  */

/* --- Start Menu bar 2 Multiple Layers--- */

	.top-ul{
		list-style-type: none;
		margin: 0;
		padding: 0;
	}

	.top-li {
		float: left;
	}

	.top-li:hover {
		background-color: #cef442;
		box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
		z-index: 1;
	}

	.mdropdown {
		margin: 0;
		padding: 0;
		list-style: none;
		/* width: 75px; */
		/* background-color: #cef442; */
	}

	.mdropdown li {
		position: relative;
	}

	.mdropdown li a {
		color: black;
		text-align: center;
		text-decoration: none;
		display: block;
		padding: 10px;
	}

	.mdropdown li ul {
		position: absolute;
		top: 100%;
		margin: 0;
		padding: 0;
		list-style: none;
		display: none;
		line-height: normal;
		background-color: #f2f2f2;
		box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
		z-index: 1;
	}

	.mdropdown li ul li a {
		text-align: left;
		color:  #595959;
		font-size: 15px;
		padding: 10px;
		display: block;
		white-space: nowrap;
	}

	.mdropdown li ul li a:hover {
		background-color: #cef442;
		color: black;
		min-width: 120px;
		box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
		z-index: 2;
	}

	.mdropdown li ul li ul {
		left: 100%;
		top: 0;
	}

	ul li:hover>a {
		background-color: #cef442;
		color: black !important;
	}

	ul li:hover>ul {
		display: block;
	}


/* ---- End menu bar 2 ------ */



/* --------- App Specific -(To Move out) -------- */

table.child {
	border: 1;
	border-color: #e2bca8;
	margin-left: 50px;
	padding-left: 50px;
	/* font-family:Verdana,Arial,Helvetica; */
	font-size:small;
    color:#af734b;
}

table.child2 {
	border: 0px;
	border-bottom:0px
	border-color: #e2bca8;
	padding-left: 0px;
	/* font-family:Verdana,Arial,Helvetica; */
	font-size:x-small;
    color:#af734b;
}


td.plusminus{ 
	cursor: pointer;
	background: url('../img/plus.png') no-repeat center center;
}

tr.shown td.plusminus {
	background: url('../img/minus.png') no-repeat center center;
}

td.ver {
	color: blue;
    cursor: pointer;
	text-align: center;
}

p.urls {
	color: blue;
    cursor: pointer;
	text-align: center;
}

p.warnings {
	color: red;
	text-align: center;
}

span.urls {
	color: blue;
    cursor: pointer;
	text-align: center;
}

span.overdue {
	color: red;
}


#top-left {
	display: block;
	position: absolute;
	top: 8px;
	right: 8px;
	float: right;
}

#top-left button {
	width: 85px;	
	padding: 2px 2px;
}

#download_btn {
	display: block;
	position: absolute;
	top: 8px;
	left: 40px;
	float: left;
}

.title {
	text-align: center;
	/* font-family:Verdana,Arial,Helvetica; */
	margin-top: 5px;
	color:Black;
}

.version {
	text-align: center;
	/* font-family:Verdana,Arial,Helvetica; */
	font-size: 12px;	
	margin-top: 2px;
}

.centered{
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.cross_button{
	/* font-family:Verdana,Arial,Helvetica; */
    position: absolute;
    top: 0px;
    right: 3px;
	color: grey;
	cursor: pointer;
}



tfoot input {
  width: 100%;
}

thead input {
  width: 90%;
}


div#Parent_list{
	width:95%;
	margin:0 auto;
	position: relative;
	background-color:#94baf7;
	border: 1px solid #ddd;
	padding: 8px;
	box-shadow: 4px 8px 8px 0 rgba(0, 0, 0, 0.2), 4px 10px 20px 0 rgba(0, 0, 0, 0.19);
	
}

.auth_window{
	margin:0 auto;
	position: relative;
	background-color:#94baf7;
	border: 1px solid #ddd;
	width: 260px;
	padding: 8px;
	box-shadow: 4px 8px 8px 0 rgba(0, 0, 0, 0.2), 4px 10px 20px 0 rgba(0, 0, 0, 0.19);

}

.small_pop{
	margin:0 auto;
	display:none;
	position: absolute;
	background-color:#cef442;
	border: 1px solid #ddd;
	padding: 8px;
	box-shadow: 4px 8px 8px 0 rgba(0, 0, 0, 0.2), 4px 10px 20px 0 rgba(0, 0, 0, 0.19);
	
}


.small_pop td{
	vertical-align: top;
}

.mandatory_alert{
	color:	red;
	font-size: small;
	display: none;
}


.toggle_element{
	display:none;
}



.login_obj {
  width: 100%;
  padding: 6px 10px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  box-sizing: border-box;
}



button.login_btn {
  font-family: Arial;
  background-color: #5d6868;
  color: white;
  padding: 12px 16px;
  margin: 15px 0;
  border: none;
  cursor: pointer;
  width: 100%;
}

.small_btn {
  /* for older version   */
  background-color: #f9f9f9; 
  border: 1px solid; 
  color: black;
  padding: 5px 2px;
  text-align: center;
  vertical-align: center;
  text-decoration: none;
  width: 45px;
  font-size: 12px;
}

td.cancel_btn{
	cursor: pointer;
	background: url('../img/cross_logo.png') no-repeat center center;
}

td.issue_btn{
	cursor: pointer;
	background: url('../img/tick_logo.png') no-repeat center center;
}


div#Child_list {
	width:75%;
	text-align: center;
}

div#Child_reserve {
	width:75%;
	/* text-align: center; */
	background-color: #a3c2c2;
}


div#pop-newtrans #tbl_detail input{
	width:115px;
}

.raletive_div{
	/* for wrapping */
	position: relative;
}

div#pop-newtrans #tr_submit{

  position: absolute;
  right: 	0px;
  bottom: 	0px;

  background-color: #f9f9f9; 
  border: 1px solid; 
  color: black;
  text-align: center;
  text-decoration: none;
  padding: 5px 3px;
  width: 50px;
  font-size: 11px;
	
}


div#pop-newtrs {
	/*  For older version     */
	width:75%;
	width:250px; 
	height:330px;
}

div#evp-footer {
	margin: auto;
	text-align: center;
	color: grey;
}

.foot_notes{
	margin: auto;
	color: grey;
}
.foot_notes .cell-right {
	width: 150px;
	text-align: right;
}

.foot_notes .cell-left {
	width: 500px;
	text-align: left;
}

/* --- Side Nav Bar ---*/

#theSidenav a {
  position: absolute;
  left: -105px;
  transition: 0.3s;
  padding: 10px;
  width: 120px;
  text-decoration: none;
  font-size: 18px;
  color: white;
  border-radius: 0 5px 5px 0;
}

#theSidenav a:hover {
  left: 0;
}

  
#side-picker-1 {
  top: 50px;
  background-color: #2196F3;
}

#side-picker-2 {
  top: 100px;
  background-color: #55a;
}

#side-picker-3 {
  top: 150px;
  background-color: #000099;
}

/* --- User Option Panel ---*/

.mobile-friendly-wrapper{
	width: 480px; 
	padding: 10px; 
	display:none;
}

.user-option-wrapper{
	width: 620px; 
	padding: 20px; 
	display:none;
}

.DatePickerWrapper{
	width: 620px; 
	padding: 20px; 
	display:none;
}


.user-options-date{
	
	width: 300px;
}

/*  -------- Drag Structure ----------- */
.drag-container {
  	
  width: 600px;	
  margin-right: auto;
  margin-left: auto;
  /* *zoom: 1; */}
  
.drag-container:before, .drag-container:after {
    display: table;
    content: ""; }
.drag-container:after {
    clear: none; }

.drag_list {
  float: left;
  /* margin-left: 10px; */
  width: 300px;}

/* -------- Drag Behaviour ------------ */

body.dragging, body.dragging * {
  cursor: move !important; }


.dragged {
  position: absolute;
  top: 0;
  opacity: 0.5;
  z-index: 2000; }


ol.drag_ol {
  margin: 0 0 10px 0;
  /* min-height: 10px; */}
  
  ol.drag_ol li {
    display: block;
    margin: 5px;
    padding: 5px;
    border: 1px solid #cccccc;
    color: #0088cc;
    background: #eeeeee;}
  
  ol.drag_ol li.placeholder {
    position: relative;
    margin: 0;
    padding: 0;
    border: none; }
    
    ol.drag_ol li.placeholder:before {
      position: absolute;
      content: "";
      width: 0;
      height: 0;
      margin-top: -5px;
      left: -5px;
      top: -4px;
      border: 5px solid transparent;
      border-left-color: red;
      border-right: none; }

/* -------- Data Table Control ---------- */
.datatable-div{
	clear: left;
}

td.plusminus{ 
	cursor: pointer;
	background: url('/bp_img/plus.png') no-repeat center center;
}

tr.shown td.plusminus {
	background: url('/bp_img/minus.png') no-repeat center center;
}