.h3, h3 {
    font-size: 1.50rem !important;
}
label, p{
    font-size: 15px;
}
body{
	/* background: url(../img1/bg.jpg) no-repeat; */
	background-size: cover;
}
/*.login-wrapper
{
    background: #fff;
}*/
.bg-pic
{
	    padding: 40px 35px 40px 35px;
    margin-top: 19.8%;
    background-color:#fff ;
    box-shadow: 0 4px 24px 0 rgb(34 41 47 / 24%);
    /* border-radius: 10px; */
   height: 475px;
    color:#283046;
}
.logo-m{
    /*left: 6%;
     position: absolute; 
    top: 4%;*/
}
.logo-m img{width: 68%;}
a:hover{
    cursor: pointer !important; 
}
#time
{
    font-size: 30px;  font-weight: bold;
}
#date
{
     font-size: 16px; font-weight: 400;
}
.gr{
    background: #deb40a !important;
	color:#fff !important;
}
.side-bar-form{
    /* background-color: rgba(32, 40, 43, 0.1); 
    background-color: rgb(231 238 241 / 26%);
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);*/
    padding: 40px 35px 40px 40px;
    color: #ffffff;
    margin-top: 18%;
    background-color: #919191;
    box-shadow: 0 4px 24px 0 rgb(34 41 47 / 24%);
    /* border-radius: 10px; */
	height: 475px;
	position:relative;
}
.side-bar-form::before{
	content:"";
	position:absolute;
	left:-20px;
	top:20px;
	background: url(../img1/spirel.png) repeat-y;
	width:41px;
	height:435px;
}

.side-bar-form:after {
    top: 1%;
    right: -15px;
    z-index: 2;
    width: 15px;
    height: 98%;
    content: '';
    position: absolute;
    background:#4e4d4d url(../img1/bookpattren.png) repeat-y;
    -webkit-background-size: 99% 99.5%;
    -moz-background-size: 99% 99.5%;
    -ms-background-size: 99% 99.5%;
    -o-background-size: 99% 99.5%;
    background-size: 99% 99.5%;
	border-left: 1px solid #787676;
}

.options p a
{
    font-weight: bold; color: #fff;
}
/*.banner-caption
{
    position: absolute;
    top: 50%;
    left: 5%;
    transform: translateY(-50%);
}*/
.banner-caption h2{
    font-size: 30px;
    font-weight: bold;
}
.banner-time
{
    position: absolute !important; top: 50px; width: 80% !important; left: 50px;
}
.banner-time a:hover
{
    color: #ddd;
}
.login-caption
{
    position: absolute !important;
    bottom: 32px;width: 80% !important; 
}
.login-caption ul{
    padding: 0px;
    margin: 0px;
    list-style: none;
}
.login-caption li a
{
    color: #fff;
}
.banner-time h1
{
    font-size: 40px; color: #fff;
}
.banner-time p
{
    font-size: 13px; color: #fff;
}
.banner-time a
{
    color: #fff; font-weight: bold;
}
.banner-caption a:hover
{
    color: #ccc;
}
.btn-theme
{
    background: #fff;
    color: #911d49;
    text-transform: uppercase;
    font-weight: bold;
    border-radius: 32px;
    font-size: 14px;
}
.form-group .input-box{
    border-top: 0px;
    border-left: 0px;
    border-right: 0px;
    border-radius: 0px;
    border-bottom: 2px solid #ddd;
    height: 50px;
    font-size: 16px;
	background: transparent;
	color:#fff;
}
.form-group .input-box:focus{
    border-bottom: 2px solid #deb40a;
}

.form-group .input-box::-webkit-input-placeholder {color: #ccc;}
.form-group .input-box:-ms-input-placeholder {color: #ccc;}
.form-group .input-box::placeholder {color: #ccc;}
/*.date-time{
    position: absolute;
    bottom: 20px;
    left: 5%;
}*/
.date-time {
    top: 5%;
    margin-top: 19%;
}
.message-box {
  display: none;
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 9999;
}
.message-box.open {
  display: block;
}
.message-box .mb-container {
  position: absolute;
  left: 0px;
  top: 35%;
  background: rgba(0, 161, 171, 0.9);
  padding: 20px;
  width: 100%;
}
.message-box .mb-container .mb-middle {
  width: 50%;
  left: 25%;
  position: relative;
  color: #FFF;
}
.message-box .mb-container .mb-middle .mb-title {
  width: 100%;
  float: left;
  padding: 10px 0px 0px;
  font-size: 31px;
  font-weight: 400;
  line-height: 36px;
}
.message-box .mb-container .mb-middle .mb-title .fa,
.message-box .mb-container .mb-middle .mb-title .glyphicon {
  font-size: 38px;
  float: left;
  margin-right: 10px;
}
.message-box .mb-container .mb-middle .mb-content {
  width: 100%;
  float: left;
  padding: 10px 0px 0px;
}
.message-box .mb-container .mb-middle .mb-content p {
  margin-bottom: 0px;
}
.message-box .mb-container .mb-middle .mb-footer {
  width: 100%;
  float: left;
  padding: 10px 0px;
}
.message-box.message-box-warning .mb-container {
  background: #283046;
}
.message-box.message-box-danger .mb-container {
  background: #283046;
}
.message-box.message-box-info .mb-container {
  background: rgba(141, 10, 10, 0.9);
}
.message-box.message-box-success .mb-container {
  /* background: rgba(141, 10, 10, 0.9); */
  background:#283046;;
}
/* Media Queries */
/* ======================================= */
/* ======================================= */

@media screen and (max-width:768px)
{
    .banner-caption h2{
        font-size: 35px;
    }
    .bg-pic
    {
        height: 400px;
    }
    .banner-caption
    {
        /* position: absolute !important; bottom: 10px; width: 90% !important; left: 10px; */
    }
    .banner-time
    {
        position: absolute !important; top: 20px; width: 90% !important; left: 10px;
    }
    .banner-time h1
    {
        font-size: 20px; color: #fff; font-weight: bold;
    }
    .banner-time p
    {
        font-size: 13px; color: #fff;
    }
    .side-bar-form
    {
        padding-left: 30px !important; padding-top: 20px; color:#fff;
		/* background-color: rgba(32, 40, 43, 0.1); */
		-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
		padding: 50px 48px 0px 48px;
		margin-top: 0%;
    }
    .login-caption
    {
        position: static!important; width: 90% !important; 
    }
    .login-caption ul li
    {
        font-size: 12px;
    }
    .date-time{
        /* position: absolute; */
        /* bottom: -10px; */
        /* left: 5%; */
		margin-top:0;
    }
}


@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) 
{
    
}

@media only screen 
and (min-device-width : 320px)  
{
  
    
}

@media only screen 
and (min-device-width : 1280px) 

{
    
    
}

@media (min-width: 1880px)

{
    
    
}

@media only screen 
and (min-device-width : 360px)  
{
    
  
}

@media only screen 
and (min-device-width : 375px) 
{
    
    
}
/* ======================================= */
/* ======================================= */