@charset "utf-8";
/* CSS Document */

/*Login page csss*//*Login page csss*//*Login page csss*//*Login page csss*//*Login page csss*//*Login page csss*/
/*Login page csss*//*Login page csss*//*Login page csss*//*Login page csss*//*Login page csss*//*Login page csss*/



*{ margin:0px; padding:0px;}

body{ width:100%;background:url(../img/bg-login.jpg) no-repeat; background-size: cover;}

.main{
	float: left;
    height: auto;
    width: 100%;
    border-top: 5px solid #fff;}

.header{ float:left; width:100%; background:#e78e1a; height:80px;}

.leftlogo{ 
   float: left;
  height: auto;
  width: 153px;
  margin: 6px 0px 0px 35px;
}

.text{
	float: left;
    width: 50%;
    margin: 11px 0px 0px 158px;
	}
.text h1{ text-align: center;color: #000;font-weight: bold;font-family: "Arial Black", Gadget, sans-serif;font-size: 39px;  font-style:italic;
}



.rightlogo{float: right;height: auto;width: 180px;margin: 7px 56px 0px 0px;}

.rightlogo img{ width:180px;}

.login{ 
    margin: auto;
    width: 60%;
  
    margin-top: 60px; 
   }
	
.left{     
float: left;
background: rgba(116, 153, 208, 0.37);
height: 375px;
width: 50%;
}	
.left img{margin: 8px 0px 0px 8px;}

.right{ float:left;  height:375px; width:50%;background: rgba(0, 0, 0, 0.19);}

.right-boder {
    
    width: 98%;
    margin: 4px auto;
    
    border: 1px solid #bab6b6;	}

.right h3{ text-align: center;
    color: #fff;
    padding-top: 15px;
    font-size: 25px;
    font-family: Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    font-style: italic;}
.right h4{ text-align: center;color: rgba(255, 255, 255, 0.82); padding-top: 15px;font-size: 18px;font-family: Arial, Helvetica, sans-serif;}

.input-group {
	padding: 20px 35px;
    position:relative;
    
}
#perror{position: absolute;
bottom: 43%;
right: 55%; padding:0px;}

.input-group-addon {
   padding: 8px 16px;
  
    width: 1%;
    position: absolute;
    border-right: 0px;
}
.input-group-addon img{ margin:0px 0px 0px -8px;}

.form-control {
	height: 34px;
    padding: 6px 52px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    width: 69%;
    background-color: #fff;
    background-image: none;
   
   
    font-weight: bold; margin-bottom:20px;
   
}
.forget{  text-decoration:none; color:fff !important;  float:left;}

.input-group a{ color: #FFF;
    margin-top: 10px;
    font-family: sans-serif;
    font-style: italic;}

.input-group p{ color: #FFF;
    padding-top: 60px;
    text-align: left;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    line-height: 17px;
    font-style: italic;
    font-weight: 600;}

.input-group a:hover{ color:#dc7f1c;}

.btn{  float: right;
    padding: 10px 40px;
    border: none;
    background: #e78e1a;
    color: #000;
    border-radius: 3px;
    font-weight: bold;
    cursor: pointer;}
	
.btn:hover{ background:#dc7f1c; color:#fff;}	
	
footer{ 
float: left;
width: 100%;
 background:#fff; height:50px;  margin-top:70px;}
 
 
footer img{ margin:3px 5px 0px 20px;} 
 
    
    
  
	
	
	
/* CSS Document */

/*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss */
/*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss *//*responsive csss */



/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 220px) and (max-device-width : 736px) {
	
/* STYLES GO HERE */

/*================================ new css 10:45 d ======================*/


.header{ float: left;
    width: 100%;
    height: 50px; }

.leftlogo {
 float: left;
    width: 90px;
    margin: 0px;
    height: 50px;
}
.leftlogo img {
    width: 90px;
    margin-top: 8px;
}
.text {
    float: left;
    margin: 14px 0px 0px 8px;
    width: auto;
}

.text h1 {
    font-size: 14px;
    text-align: center;}
	
	
.rightlogo {
    float: right;
    width: 90px;height: 50px; margin:0px;
}	
.rightlogo img {
    width: 90px;
    margin: 7px 0px 0px -10px;
}

.login {
    margin: auto;
    width: 90%; height:720px;
    margin-top:35px;
    margin-bottom: 20px;
    border-radius: 7px;}
	
	
	
.left {
   float: left;
background: rgba(255, 255, 255, 0.68);
height: 315px;
width: 100%;
}

.left img {
    width: 270px;
    margin: 40px 0px 0px 24px;
}
.right{ width:100%; height:405px;}

.form-control{ width:65% !important;}

footer {
    float: left;
    width: 100%;
    background: #fff;
    height: 27px !important;
    margin-top:0px !important;
}
footer img {
    margin: 3px 5px 0px 20px;
    width: 140px !important;
}

	



}
	
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
	
.header{ float: left;
    width: 100%;
    height: 50px; }

.leftlogo {
 float: left;
    width: 90px;
    margin: 0px;
    height: 50px;
}
.leftlogo img {
    width: 90px;
    margin-top: 8px;
}
.text {
    float: left;
    margin: 14px 0px 0px 8px;
    width: auto;
}

.text h1 {
    font-size: 14px;
    text-align: center;}
	
	
.rightlogo {
    float: right;
    width: 90px;height: 50px; margin:0px;
}	
.rightlogo img {
    width: 90px;
    margin: 7px 0px 0px -10px;
}


.login { width:95%; margin-top:30px; height: 385px;}
	
	
	
.left {
  float: left;
background: rgba(255, 255, 255, 0.68);
height: 385px;
width: 50%;
}

.left img {
   
   width: 350px;
margin: 33px 0px 0px 4px;
}

.right{ width: 50%;
height: 385px;}

.form-control{ width:65%;}


	
	
	
	
	
	
	
	
}


@media only screen and (min-device-width : 980px) and (max-device-width : 1280px) {
	
	.form-control{ width:75%;}
	
}