@font-face {
    font-family: 'open_sanslight';
    src: url('opensans-light-webfont.woff2') format('woff2'),
         url('opensans-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'open_sansregular';
    src: url('opensans-regular-webfont.woff2') format('woff2'),
         url('opensans-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'open_sansbold';
    src: url('opensans-bold-webfont.woff2') format('woff2'),
         url('opensans-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

body, html {
	height: 100%;
	font-family: open_sanslight,Arial,Helvetica Neue,Helvetica,sans-serif;
}

* {
    margin: 0;
    padding: 0;
  	-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
}

.titreLogin {
	width:100%;
	font-family: open_sansbold,Arial,Helvetica Neue,Helvetica,sans-serif;
	text-align:center;
	#background-color:#eee;
		margin-bottom:10px;
		padding:10px;
		#opacity:0.75;
}

.login {
	position:absolute;
	width:380px;
	top:2%;
	left:50%;
	margin-left:-190px;
	#-moz-box-shadow: 1px 1px 5px 2px #656565;
	#-webkit-box-shadow: 1px 1px 5px 2px #656565;
	#-o-box-shadow: 1px 1px 5px 2px #656565;
	#box-shadow: 1px 1px 5px 2px #656565;
	#border:1px solid #666666;
	#background:#FFFFFF;
	margin-bottom:400px;
	padding:20px;
	opacity:0.75;
}
.logoPandaLogin {
	display:block;
	position:absolute;
	bottom:14px;
	left:50%;
	width:192px;
	height:36px;
	margin-left:-96px;
	background-image: url("../datas/panda.png"); /* The image used */
	background-position: center; /* Center the image */
	background-repeat: no-repeat; /* Do not repeat the image */
	background-size: cover; /* Resize the background image to cover the entire container */	
	cursor:pointer;
}
.myInput {
	width:100%;
	padding:10px;
	margin-bottom:8px;
	border:1px solid #2b99b6;
	font-size:16px;
	background-color:#ffffff;
font-family: open_sansregular,Arial,Helvetica Neue,Helvetica,sans-serif;	
}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active  {
    -webkit-box-shadow: 0 0 0 30px white inset;
}

.mySubmit {
	width:100%;
background: #7d7e7d; /* Old browsers */
background: -moz-linear-gradient(top, #7d7e7d 0%, #0e0e0e 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #7d7e7d 0%,#0e0e0e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	color:#fff;
	border:0px;
	padding:10px;
	font-size:20px;
	cursor:pointer;
	border-radius:4px;
font-family: open_sansbold,Arial,Helvetica Neue,Helvetica,sans-serif;	
}

.logoBox {
	display:block;
	position:absolute;
	top:10px;
	left:50%;
	margin-left:-160px;
	opacity:0.1;
	width:320px;
	height:320px;
	animation: spin 6s cubic-bezier(0.8, 0, 0.2, 1) infinite;
	pointer-events:none;	
}

 @keyframes spin {
    50% { transform: rotate(180deg); }
    100% { transform: rotate(360deg); }
  }