
	/***   application	 : erp						 				***/
	/***   libraries	 : cascading style sheet	 				***/
	/***   file name 	 : layout.css								***/
	/***   created	  	 : 16 Oct 2018								***/
	/***   modified  	 : 16 Oct 2018								***/

	body {
		background: #D5D5D5; 	/* background color*/
		color: #6D7993;  		/* text color */
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 13px;
		margin: 0;
		width: 100%;
		padding: 0;
		margin: auto;
	}

/* Top-Menu */
	#header {
		background: #6D7993;
		padding-bottom: 23px;
		width: 100%;
		margin: auto;
	}

	#header div {
		margin: 0 auto;
		width: 960px;
	}

	#header div div#logo {
		padding: 25px 0 25px;
		width: auto;
	}

/********************************/
/* Page Layout 					*/
	/* id: body */
	#body {
		background: #D5D5D5; /* url(../images/bg-body.gif) repeat-x; */
		padding-bottom: 40px;
		width: 100%;
	}

	/* id: container */
	#container {
		margin-right: auto; 
		margin-left: auto; 
		width: 100%;
		padding: 5px 0px 0px 0px; /* top, right, bottom, and left */
	}

	/* id: content */
	#content {
  		float: right; 
  		width: 82%;
  		padding: 5px 5px 5px 5px; /* top, right, bottom, and left */
  		border-style: solid;
 		background-color: #D5D5D5;
	}
	
	/* id: sidebar */
	#sidebar {
  		float: left; 
  		width: 15%;
  		padding: 5px 5px 5px 5px; /* top, right, bottom, and left */
  		border-style: solid;
  		background-color: #96858F;
  		color: white;
	}
	
	#cleared {
  		clear: both;
	}

	#footer {
		height: auto;
		width: 100%;
	}

	#footer div {
		background: url(../images/bg-footer.gif) repeat;
		height: 250px;
		width: 100%;
	}

	#footer div div {
		background: none;
		height: auto;
		margin: 0 auto;
		width: 960px;
	}

	#footer div div span {
		/*background: url(../images/bg-text.gif) no-repeat 0 0;*/
		/*color: #6a7112;*/
		color: white;
		display: block;
		font-size: 16px;
		height: 35px;
		left: 0;
		line-height: 35px;
		margin-bottom: 10px;
		position: relative;
		text-align: center;
		text-shadow: 0 1px #e8f09b;
		top: -4px;
		width: 120px;
}

	#footer div div ul {
		list-style: none;
		margin: 0;
		overflow: hidden;
		padding: 0;
	}

	#footer div div ul li {
		float: left;
		margin-left: 30px;
		position: relative;
		width: 300px;
	}

	#footer div div ul li.first {
		margin-left: 0;
	}

	#footer div div ul li h2 {
		font-size: 16px;
		font-weight: normal;
		margin: 0;
	}

	#footer div div ul li h2 a,
	div.body div div.content ul li div h1 a {
		/*color: #08b5d7;*/
		color: gray;
	
		text-decoration: none;
	}

	#footer div div ul li h2 a:hover,
	div.body div div.content ul li div h1 a:hover {
		color: white;
		/*color: #83e0f1;*/
	}


/********************************/
/* Content Layout			 	*/
   .divtbl {
		display: table;
		position: relative;
		width: 90%;
/*		border-width: thin;
		border-style: solid;
		border-color: red; */
	}
	
	.divrow {
		display: table-row;
	}
	
	.divrow-purple {
		display: table-row;
		font-size: 14px;
		color: #800080; /* purple */
	}
	
		
	.divcell {
		display: table-cell;
		width: 25%;
		padding: 5px 5px 5px 5px; /* top, right, bottom, and left */
        vertical-align:top;
        font-size: 12px;
		color: 	#808080; /* gray */
		border-width: thin;
		border-style: solid;
		border-color: #CCCCCC; */
	}
	
	
	/* cell label */
	.divrowheader {
		display: table-row;
		font-weight: bold;
		font-size: 14px;
		color: #696969; /* dim gray */
	}
		
	.divrowheader-purple {
		display: table-row;
		font-weight: bold;
		font-size: 14px;
		color: #800080; /* purple */
	}
			
	.divsubheader {
		display: table-row;
		font-weight: ;
		font-size: 14px;
		color: #696969; /* dim gray */
		text-decoration: underline;
	}	
		
	.cellLabel {
		width: 100px;
		font-weight: normal;
		font-size: 12px;
		color: #778899; /* lightslategray */
	}

	.cellLabel-l {
		width: 120px;
		font-weight: normal;
		font-size: 12px;
		color: #778899; /* lightslategray */
	}
	
	.cellLabel-s {
		width: 120px;
		font-weight: normal;
		font-size: 12px;
		color: #778899; /* lightslategray */
	}
	
	.cellLabel-xs {
		width: 50px;
		font-weight: normal;
		font-size: 12px;
		color: #778899; /* lightslategray */
	}
	
	.cellElem {
		width: 200px;
		font-weight: normal;
		font-size: 12px;
		color: 	#808080; /* gray */
	}
	
	.cellElem-l {
		width: 250px;
		font-weight: normal;
		font-size: 12px;
		color: 	#808080; /* gray */
	}	
	
	.cellElem-xl {
		width: 450px;
		font-weight: normal;
		font-size: 12px;
		color: 	#808080; /* gray */
	}		
	
	.cellElem-s {
		width: 120px;
		font-weight: normal;
		font-size: 12px;
		color: 	#808080; /* gray */
	}

	.cellElem-s-mediumorchid {
		width: 120px;
		font-weight: normal;
		font-size: 12px;
		color: #BA55D3;
		background-color: #D8BFD8;  /* thistle */
	}		
				
	.cellElem-xs {
		width: 80px;
		font-weight: normal;
		font-size: 12px;
		color: 	#808080; /* gray */
	}
	
	/* menu */
	.cellmenu {
		width: 10px;
		font-weight: normal;
		font-size: 12px;
		color: #778899; /* lightslategray */
	}
	
/********************************/
/* List Data in Table */
	.divlisttbl {
		display: table;
		position: relative;
		/*width: 80%;
   		/* height:100px; */
    	overflow: scroll;
	}
	
	.divlistrow {
		display: table-row;
	}
	
	.divlistcell-xs {
		display: table-cell;
		padding: 5px 5px 5px 5px; /* top, right, bottom, and left */
        vertical-align:top;
        width: 50px;
		border-width: thin;
		border-style: solid;
		border-color: gray; 
	}
	
	.divlistcell-s {
		display: table-cell;
		padding: 5px 5px 5px 5px; /* top, right, bottom, and left */
        vertical-align:top;
        width: 80px;
		border-width: thin;
		border-style: solid;
		border-color: gray; 
	}
	
	.divlistcell-m {
		display: table-cell;
		padding: 5px 5px 5px 5px; /* top, right, bottom, and left */
        vertical-align:top;
        width: 120px;
		border-width: thin;
		border-style: solid;
		border-color: gray; 
	}
	
	.divlistcell-l {
		display: table-cell;
		padding: 5px 5px 5px 5px; /* top, right, bottom, and left */
        vertical-align:top;
        width: 200px;
		border-width: thin;
		border-style: solid;
		border-color: gray; 
	}
	
	.divlistcell-xl {
		display: table-cell;
		padding: 5px 5px 5px 5px; /* top, right, bottom, and left */
        vertical-align:top;
        width: 400px;
		border-width: thin;
		border-style: solid;
		border-color: gray; 
	}
	
	.listCellElem {
		/*width: 200px; */
		font-weight: normal;
		font-size: 12px;
	}
	
	.listCellHeader {
		font-weight: bold;
		font-size: 12px;
		color: #696969; /* dim gray */
		/*border-style: solid;
		border-color: green;*/
	}
	
	
	
	

	
	