/* Made with love by Mutiullah Samim*/

@import url('https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700&family=Oxygen:wght@300;400;700&display=swap');


html,body{
background-image: url('../images/bg.jpg');
background-size: cover;
background-repeat: no-repeat;
height: 100%;
font-family: 'Exo 2', sans-serif;
}

.responsive {
  max-width: 100%;
  height: auto;
}

.container{
height: 100%;
align-content: center;
}
.destra{
	text-align:right;
}
.card{
height: 440px;
margin-top: 130px;
margin-bottom: auto;
width: 400px;
background-color: rgba(0,0,0,0.8) !important;
}
.card .alert{
	text-align:center;
}
.card .alert {
	font-size:18px;
	
}
@media (max-width:567px){
.card{
	max-width:98%;
	margin-top:55px;
	margin-left:10px;
}

}
.social_icon span{
font-size: 60px;
margin-left: 10px;
color: #FFC312;
}

.social_icon span:hover{
color: white;
cursor: pointer;
}

.card-header h3{
color: white;
font-size:18px;
margin-top:30px;
}

.card-body h3{
color: white;
font-size:18px;
margin-top:5px;
margin-bottom:10px;
}

.social_icon{
position: absolute;
right: 20px;
top: -45px;
}
/*------show/hide password---------*/
.hideShowPassword-toggle,
.my-toggle {
  z-index: 3;
}



/*---------------------------------*/
.input-group-prepend span{
width: 20px;
background-color: #FFC312;
color: black;
border:0 !important;
}

.input-group-prepend i{
font-size: 10px;
margin-left:0;
}
input:focus{
outline: 0 0 0 0  !important;
box-shadow: 0 0 0 0 !important;

}

.remember{
color: white;
}

.remember input
{
width: 20px;
height: 20px;
margin-left: 15px;
margin-right: 5px;
}

.login_btn{
border: 1px solid #fff;
color: white;
background-color: #56b8e6;
width: 100px;
opacity: 1;

}
.login_btn:disabled{
color: white;
background-color: #56b8e6;
width: 100px;
opacity: 0.5;

}

.login_btn:hover{
border: 1px solid #fff !important;
color: #fff !important;
background-color: #E02928 !important;
}

.links{
color: white;
font-size:15px;
}

.links a{
color:white;
margin-left: 4px;
}
.card a {
 color: white;
}
.card a:hover {
 color: #56b8e6;
}
.card-footer {
margin-top:20px;
margin-bottom:20px;
}

.card-footer a{
color:white;
font-size:15px;
}
.card-footer a:hover{
color:#56b8e6;
}


/*----------------------------------*/