@font-face
{
	font-family: 'Open Sans';
	src: local('Open Sans Regular'), local('OpenSans-Regular'), url(../../staticwebcontent/charts/fonts/opensans-regular.ttf);
}

html {
	
 height: 100%;
  overflow : visible; 
 
}

body {
	
    text-align: left;
    min-height: 100vh;
    width: 100%;
	background-color: #62808a;	/* a background color that looks like the background image to avoid white flashes */
    background-image: url(../images/background-accueil.jpg);
    background-repeat: no-repeat;
    font-family: 'Open Sans';
    background-size: auto 100%;
    background-position: center top;
	background-attachment : fixed;
	margin: 0;
	padding: 0;
	
}

body.transition
{
    opacity: 0;
/*    transform: translateX(-200px);*/
}

body.transition.is-ready
{
    opacity: 1;
/*    transform: translateX(0);*/
    transition-duration: 0.3s;
}

@media (min-aspect-ratio: 41/23) {
  body {
     background-size: 100% auto;
	 
  }
  
}

#newlogo {
	background-image : url(../images/logo_DD.svg);
	background-repeat : no-repeat;
	background-size : 90% 90%;
	margin-top : -4px;
	height : 10em;
	width : 22%;
	margin-left : auto;
	margin-right : auto;
}

.panelName
{
	
	text-align : center;
	margin-left: auto;
	margin-right: auto;
	font-weight : bold;

}

#panel_thin
{

	margin-left: auto;
	margin-right: auto;
	width: 300px;
	padding: 8px 14px 8px 14px;
	-webkit-border-radius: 16px;
  	-moz-border-radius: 16px;
  	border-radius : 16px;
	background-color: white;
}

.inputable
{
	font-size:12px;
}

input .text
{
	width:100%;
}

input[type=button] {
    color:white;
	background-color : #f06722;
    width : 70%;
    height : 30px;
    font-size:100%;
    border-radius : 5px;
    cursor:pointer;
	font-weight:bold;
	font-family: 'Open Sans';
	border : 0;
	margin-top : 15px;
	margin-bottom : 15px;
	margin-left : 45px;
}

input[type=text], input[type=password] {
    color:white;
	background-color : #534E4D;
	font-family: 'Open Sans';
	padding : 5px;
	border : 0;
	border-radius : 5px;
	font-weight : bold;
	margin : 5px;
}

#connection {
	width : 70%;
 /*! margin:5px; */
}

a
{
	color: #0066ff;
}

a:link
{
	/*color: #000000;*/
	text-decoration:none ;
}

a:active
{
	/*color: #000000;*/
	text-decoration:none ;
}

a:hover
{
	color: #0066ff;
	text-decoration: underline;
	cursor: pointer;
}

td {
	text-align : left;
}


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


html {
	
  overflow : visible; 
 
}

}