@import url('https://fonts.googleapis.com/css?family=Prosto+One');
* {
	margin: 0;
	padding: 0;
}

html, body {
	height: 100%;
}

#gauche {
	width: 50%;
	height: 100%;
	float: left;
	background-color: #FFFFFF;
}

#droite {
	width: 50%;
	height: 100%;
	float: left;
}
h1{
    font-family: 'Prosto One', cursive;
    color: #FFFFFF;
    text-shadow: 0 0 20px  #000000;
    border-left: 6px solid #FFFFFF;
    padding-left: 1.5rem;
}
.bloc__right{
    background-image: url(../../../images/helpdesk/photo@2x.jpg);
    background-size: 100% 100%;
    background-position: top center;
    background-repeat: no-repeat;
    text-align: center;
    display: flex;
    align-items:center !important;
    justify-content:center !important;

}

.bloc__left{
    text-align: center;
}
.center_page{display: flex;
    align-items:center !important;
    justify-content:center !important;
    height: 90%;}
.bloc__left--content{
    display: inline-block;
    width: 360px;
 }
.login-form{
    text-align: left;
}

.logo-login {
    margin-bottom: 4rem;

}
.navigation {
    height: 40px;
    display: flex;
    justify-content: end;
    margin-right: 1rem;
}
.navigation ul li a:hover, .navigation ul li a:focus {
    background: none;
}
.login-or {

position: relative;
font-size: 18px;
color: #aaa;
margin-top: 10px;
margin-bottom: 10px;
padding-top: 10px;
padding-bottom: 10px;

}
.hr-or {

background-color: #cdcdcd;
height: 1px;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
.span-or {

display: block;
position: absolute;
left: 50%;
top: -2px;
margin-left: -25px;
background-color: #fff;
width: 50px;
text-align: center;}

.facebook-login-btn {
background-color: #3b5998;
color: #ffffff;
padding: 12px 16px 12px 40px;
cursor: pointer;
text-align: center;
text-decoration: none;
display: block;
margin-right: 1rem;
 }
 .google-login-btn {
    font-size: 14px;

line-height: 18px;

margin-bottom: 12px;

padding: 12px 16px 12px 40px;
background-color: #ffffff;

border: 1px solid #4285F4;

line-height: 24px;

 }
 footer {
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     width: 50%;
     padding-bottom: 1rem;
 }
 .link-login-social {
     display: flex;
     align-items: center;
 }
 .mb-1{
   margin-bottom: 1rem;
 }

 @media (max-width: 768px) {
#gauche {
  width: 100%;
}
footer {
    width: 100%;
}
  }