html,body
{
margin:0;
padding :0;
background:aliceblue;
font-size:16px;
color:#777;
font-family :sans-serif ;
font-weight :300;
/*background-image :url(wallpaper.jpg)  ;*/
/*background-image :url(cyan2.jpg)  ;*/
/*background-repeat : no-repeat ;*/
height:100%;
  
}
.footer{ 
    position: fixed; 
    bottom: 0px; 
    width: 100%;
    background-color: #000000; 
    color: #FFFFFF;
    height :30px;
    text-align:center;
}

#login-box
{
	position:relative ;
	margin:5% auto ;
	height :550px;
	background :#fff;
	box-shadow :0 2px 4px rgba(0,0,0,0.6);
	width:800px;
    border:solid ;
    border-width:2px;
    border-color:black ;
}
#login2-box
{
	position:relative ;
	margin:5% auto ;
	height :550px;
	background :#fff;
	box-shadow :0 2px 4px rgba(0,0,0,0.6);
	/*width:100%;*/
    	width:800px;
    border:solid ;
    border-width:2px;
    border-color:black ;
}
.right-box
{
	position :absolute ;
	top:50px;
	right:0;
	box-sizing :border-box ;
	padding :40px;
	width:300px;
	height:500px;
    background-color:#0c3790;
   color:white;

}
	.left-box
{
		position :absolute ;
		top:50px;
		left:0;
		box-sizing:border-box;
		padding:40px;
		width:500px;
		height:500px;
		background-image:url(cart.png);

background-position :center;
background-size:cover;
}



#login-boxpage
{
	position:relative ;
	margin:5% auto ;
	height:300px;
	background :#fff;
	box-shadow :0 2px 4px rgba(0,0,0,0.6);
	width:1000px;
    border:solid ;
    border-width:2px;
    border-color:black ;
	height:560px;
}
.right-boxpage
{
	position :absolute ;
	top:0px;
	right:0;
	box-sizing :border-box ;
	/*padding :40px;*/
	width:400px;
	height:560px;
   font:red;
   

}


    .left-boxwithoutpic
{
		position :absolute ;
		top:0px;
		left:0;
		box-sizing:border-box;
		/*padding:40px;*/
		width:200px;
		height:560px;
	

background-position :center;
background-size:cover;

}

      .center-boxwithoutpic
{
		position :absolute ;
		top:0px;
		left:200px;
		box-sizing:border-box;
		/*padding:40px;*/
		width:200px;
		height:560px;
	

background-position :center;
background-size:cover;

}
    .buttonpageright {
    /*margin-bottom :28px;
    margin-left :28px;*/
    width:46px;
    height :32px;
    background :#f44336;
    /*border:none;*/
    border-radius :2px;
    color:#fff;
    position :absolute;
    bottom  :37px;
    left:115px;
    /*right: 80px;*/
}
    .buttonpageleft {
    /*margin-bottom :28px;
    margin-left :28px;*/
    width:45px;
    height :32px;
    background :#f44336;
    /*border:none;*/
    border-radius :2px;
    color:#fff;
    position :absolute;
    bottom  :38px;
    left:4px;
    /*right: 80px;*/
}
    .buttonpagecenter {
    /*margin-bottom :28px;
    margin-left :28px;*/
    width:49px;
    height :32px;
    background :#f44336;
    /*border:none;*/
    border-radius :2px;
    color:#fff;
    position :absolute;
    bottom  :38px;
    left:56px;
    /*right: 80px;*/
}
    	.left-upper
{
		position :absolute ;
		top:0px;
		left:0;
		box-sizing:border-box;
		
		width:500px;
		height:250px;
		background-image :url(step2.png);

background-position :center;
background-size:cover;
}
    .upper
{	position :absolute ;
  
	top:0;
	right:0px;

	box-sizing:border-box;
	
	width:0px;
	height:250px;
    color:red;

}
h1
{
	margin:0 0 20px 0;
	font-weight:300;
	font-size :28px;
}
input[type="text"],
input[type="password"]
{
	display: block;
	box-sizing: border-box;
	margin-bottom: 20px;
	padding: 4px;
	width: 220px;
	height: 32px;
	border: none;
	outline: none;
	border-bottom: 1px solid #aaa;
	font-family: sans-serif;
	font-weight: 400;
	font-size: 15px;
	transition: 0.2s ease;
}
* {
    font-family:sans-serif;
	
	font-size: 20px;
}
.button {
    /*margin-bottom :28px;
    margin-left :28px;*/
    width:120px;
    height :32px;
    background :#f44336;
    /*border:none;*/
    border-radius :2px;
    color:#fff;
    position :absolute;
    bottom :170px;
    right:150px;
}
.labelerror {
    /*margin-bottom :28px;
    margin-left :28px;*/
    /*width:120px;*/
    /*height :32px;*/
    background :#f44336;
    /*border:none;*/
    border-radius :2px;
    color:#fff;
    position :absolute;
    bottom :100px;
    right:10px;
  width:400px;
	
}
.uppertitle
{
	position :absolute ;
	top:0px;
	right:0px;
	background :#fff;
	box-shadow :0 2px 4px rgba(0,0,0,0.6);
	width:800px;
    height :50px;
    border:solid ;
    border-width:2px;
    border-color:black ;
    background-color :#0c3790;
    color :white ;
    

}
.CustomCss .dx-wrap {
     font-size:large;
	 color :red;
}

.CustomCssgrid .dx-wrap {
     font-size:large;
	 color :red;

}

.CustomCssgrid.dxgvControl_DevEx
{
	border: 1px solid red;
}

.girdView
{
    border-color: #999999;
    border-style: None;
    border-width: 1px; 
    padding: 2px ;
	font-family: 'Angsana New' !important;
    font-size: 18px !important;
}