﻿body
{
	background: url(../images/bg1.jpg) no-repeat center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	position: relative;
	font-family: 'Open Sans' , sans-serif;
	margin: 0px;
	padding: 0px;
    font-size:13px;
    box-sizing:border-box;
}
.body1
{
	background: url(../images/bg1.jpg) no-repeat center fixed;	
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	position: relative;
	font-family: 'Open Sans' , sans-serif;
	margin: 0px;
	padding: 0px;
	height:100vh;
}
.wraper
{
	width:100%;
	height: 110px;
	background-color: White;
	clear: both;
}
.wrap
{
	background-color: White;
	width: 82%;
	margin:0 auto;
}
.leftlogo
{
	width:16%;
	height:100%;
	margin-top:10px;
	float:left;
	/*margin-left:10px;*/
}
.midlogo
{
	width:20%;
	height:100%;
	margin-top:10px;
	/*background-color:Red;*/
	float:left;
}
.rightlogo
{
	height:100%;
	margin-top:10px;
	float:right;
	/*margin-right:20px;*/
}
	
h1
{
	text-align:center;
	color:Maroon;
}
h2
{
	text-align:center;
	color:Maroon;
}
.midlogo1
{
	width:50%;
	height:100%;
	float:left;
	margin-left:100px;
	margin-top:25px;
}
.login-form 
{
	background:#fff;
	width:40%;
	margin:9% auto 4% auto;
 	position:relative;
 	margin-top:90px;
 	height:auto;
	 border-radius:10px;
	 -webkit-box-shadow: 0px -1px 13px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px -1px 13px 0px rgba(0,0,0,0.75);
box-shadow: 0px -1px 13px 0px rgba(0,0,0,0.75);
}
.head 
{
	position: absolute;
	top:-15%;
	left: 38%;
}
.head img 
{
	border-radius:50%;
	-webkit-border-radius:50%;
	-o-border-radius:50%;
	-moz-border-radius:50%;
	border:6px solid rgba(221, 218, 215, 0.23);
}
.head h3{padding:0; margin:0; }
.loginform 
{
	padding:24% 2.5em 12% 2.5em;
}
.loginform li
{
	border:2px solid #ddd;
	list-style:none;
	margin-bottom:25px;
	width:100%;
	background:none;
	border-radius: 0.3em;
	-webkit-border-radius: 0.3em;
	-o-border-radius: 0.3em;
	-moz-border-radius: 0.3em;
	font-weight: normal
}
.icon{
	background:url(../images/icons.png)  no-repeat 0px 0px;
	height:30px;
	width:30px;
	display: block;
	float:left;
	margin:7px -11px 0px 0px
}
input[type="text"], input[type="password"]
 {
	font-family: 'Open Sans', sans-serif;
	width:60%;
	padding:0.7em 2em 0.7em 1.7em;
	color:#858282;
	font-size:18px;
	outline: none;
	background: none;
	border:none;
	font-weight:600;
	font-weight: normal
}

.user
{
	background: url(../images/icons.png) no-repeat 12px 11px;
}
.lock
{
	background: url(../images/icons.png) no-repeat -17px 11px;
}
.p-container
{
	margin-top:2em;
}
.footer
{
	width: 100%;
	background-color:White;
	position:fixed;
    padding:5px;
    box-sizing:border-box;
    bottom:0	
}
.footerwrap
{	width:82%;
	height:30px;	
	margin:0 auto;
}
.footerleft
{
	width:60%;	
	float:left;
    height:100%;
}
.footerright
{
	float:right;
	height:100%;
	text-align:center;
}
.login-form ul {margin:0; padding:0}
.clearfix {clear:both}
@media (min-width: 1200px){}
@media (max-width: 1199px) and (min-width: 981px){
 .login-form {width:48%}
 
}
@media (max-width: 980px) and (min-width: 769px){
    .login-form {width:60%}
 h1 {
        color: Maroon;
        font-size: 20px;
        text-align: center;
    }
    .midlogo1
{
	margin-left:0px;
	margin-top:30px;
}
}
@media (max-width: 768px) and (min-width: 641px){
    .leftlogo, .rightlogo {margin-top:auto;
    }
    .wraper 
    {
    background-color: White;
    clear: both;
    padding: 10px 0 33px;
    height:29px;
    width: 100%;
    }
    .wraper img {max-height:50px}
    .login-form {width:60%}
 h1 {
        color: Maroon;
        font-size: 18px;
        text-align: center;
    }
    .midlogo1
{
	margin-left:0px;
	margin-top:0px;
}
}

@media (max-width: 640px) and (min-width: 481px){
     .leftlogo, .rightlogo {margin-top:auto;
    }
    .wraper 
    {
    background-color: White;
    clear: both;
    padding: 10px 0 33px;
    height:29px;
    width: 100%;
    }
    .wraper img {max-height:50px}
    .login-form {width:60%}
 h1 {
        color: Maroon;
        font-size: 15px;
        text-align: center;
    }
    .midlogo1
{
	margin-left:0px;
	margin-top:0px;
}
}
@media (max-width: 480px) and (min-width: 321px){
 .leftlogo, .rightlogo {margin-top:auto;
    }
    .wraper 
    {
    background-color: White;
    clear: both;
    padding: 10px 0 33px;
    height:11px;
    width: 100%;
    }
    .wraper img {max-height:35px}
    .login-form {width:90%}
    .head {
    left: 31%;
    position: absolute;
    top: -21%;
}
    h1 {
        color: Maroon;
        font-size: 11px;
        text-align: center;
    }
    .midlogo1
{
	margin-left:0px;
	margin-top:0px;
}
}
@media (max-width: 320px){
    .leftlogo, .rightlogo {margin-top:auto;
    }
    .wraper 
    {
    background-color: White;
    clear: both;
    padding: 10px 0 33px;
    height:11px;
    width: 100%;
    }
    .wraper img {max-height:30px}
    .login-form {width:90%}
    .head {
    left: 31%;
    position: absolute;
    top: -21%;
}
    .footerwrap {height:auto}
    .footerleft, .footerright {float:none; width:100%; text-align:center
    }
    h1 {
        color: Maroon;
        font-size: 11px;
        text-align: center;
    }
    .midlogo1
{
	margin-left:0px;
	margin-top:0px;
}
    .margin-bottom {top:-61px
    }
}