@charset "utf-8";
/* CSS Document */
/*
 		 ____         _____   _____        __   __  
        ||   \   ^    ||   \  ||   \   ||  ||  / /    ^    ©
        ||___/  / \   ||___/  ||___/   ||  || /_/    / \   
        ||     /___\  ||      || \\    ||  || \ \   /___\  
        ||    |     | ||      ||  \\   ||  ||  \ \ |     | 
*/

@font-face {
    font-family: 'robotoregular';
    src: url('../fonts/roboto/Roboto-Regular.eot');
    src: url('../fonts/roboto/Roboto-Regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/roboto/Roboto-Regular.woff') format('woff'),
         url('../fonts/roboto/Roboto-Regular.ttf') format('truetype'),
         url('../fonts/roboto/Roboto-Regular.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'robotothin';
    src: url('../fonts/roboto/Roboto-thin.eot');
    src: url('../fonts/roboto/Roboto-thin.eot?#iefix') format('embedded-opentype'),
         url('../fonts/roboto/Roboto-thin.woff') format('woff'),
         url('../fonts/roboto/Roboto-thin.ttf') format('truetype'),
         url('../fonts/roboto/Roboto-thin.svg#robotothin') format('svg');
    font-weight: normal;
    font-style: normal;

}

body {
	margin: 0;
	padding: 0;
	font-size: 12px;
    line-height: 20px;
  	-webkit-text-size-adjust: 100%;
  	-ms-text-size-adjust: 100%;
 	text-size-adjust: 100%;
	font-family: 'robotoregular';
}

a  { text-decoration: none; color:inherit}
a:hover { text-decoration: underline; }
a:focus { outline: none;  }

/*================================ Contener general */
.container {  
    padding-bottom: 7px; padding-top:40px; margin:0 auto; width:1110px;
	}

.container_connect {  
    margin:0 auto; padding-top:40px; width:90%; max-width:550px; color:#FFF; font-family: 'robotoregular'; text-align:center
	}
.container_connect a { color: #CCC }
.container_connect a:hover { color: #Caa }	
.container_connect .titre { font-size:22px;}

.container_connect .soustitre { padding-top:25px; padding-bottom: 20px; border-top:thin #FFF solid ; border-bottom:thin #FFF solid ; font-size:20px; text-transform: uppercase; }

.container_connect .box { 
				 border:rgba(217, 0, 27, 0.8) solid 6px;
				 border-radius:15px;
				 background-color: rgba(100, 100, 100, 0.7);
				 margin-top:35px;
				 text-align:left; 
				 padding: 10px 50px 0px 50px;
				 display: block; 
				}
.control-label {  color: #dedede; font-size:14px ; margin-bottom: 5px;  margin-top:15px; display: block; width:85%}				
.input-group {
    color: #555;
    padding: 4px 8px;
    margin-bottom: 0;
    width: 90%;
    }
input[type="text"],input[type="password"]  {
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 6px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #555;
    display: block;
    height: 27px;
    line-height: 1.42857;
    padding: 4px 8px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
	width: 100%;
}

input[type=checkbox] {
	position: absolute;
	top: -9999px;
	left: -9999px;
}

label {
	display: block;
	color: rgba(255, 255, 255, 0.5);
	cursor: pointer;
}

.unmask {
 margin-left:30px;
  width: 25px;
  height: 25px;
}

input[type=checkbox]:checked ~ label {
	color: rgba(0, 0, 0, 1)
}

/*.material-icons.md-dark { color: rgba(0, 0, 0, 1); }
.material-icons.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); }*/

.panel-footer {
    height: inherit;
    margin: 30px -50px 0px -50px;
	background-color: rgba(150,150,150,0.5);
    border-color: #eee;	
	border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
	padding: 10px 15px;
	border-top:#FFF solid 1px;
}

.btn-connect {
    margin:0 auto;
	width:100%;
	border-radius: 6px;
    font-size: 15px;
	display: block;
    padding:10px;
    width: 80%;
	box-shadow: 0 -2px 0 #e6e6e6 inset;
	background-color: #fff;
    border-color: #ccc;
    color: #555;
	 }
	
@media (max-width: 768px){
.background_connect1, .background_connect2, .background_connect3, .background_connect4, .background_connect5, .background_connect6, .background_connect7, .background_connect8, .background_connect9, .background_connect10, .background_connect11{ background-image: url(../images/bg_lock_smartphone.jpg);width:100%; background-size: inherit;  }
}