body {
	font-family: 'Titillium Web', sans-serif;
	color: #737373;
}

a { color: #FFF; }    
a:hover { color: #DDD; }    

/* titre des cartouches de la colonne de droite */
.SubTitle {
    font-size: 12px;
    font-weight: 600;
    background-color: #343434;
    color:#FFF;
    border-bottom: solid 1px #b8b8b8;
    text-align: left;
    padding-left: 30px;
    margin-bottom: 0px !important;
}
    
    
.logo {
        height: 60px;
        margin: 10px;
}    
    
   
 
/* choix de la langue */
.dropdown-toggle::after {
        color:#FFF;
        }        

/* barre de menu */
.menu {
    background-color:#666666; 
    color:#FFF; 
    height: 28px;
}

.menu .active {
    color:#F6D200; 
    text-decoration: overline;
}


/* Cartouche de droite avec les données */ 
.cartouche {
     width:100%;
     border: thin #AAA solid;
     box-shadow: 8px 8px 12px #aaa;
     margin-top: 15px;
}   

/* valeur principale, affiché en grand */
.VALUE {
    font-size: 55px;
    font-weight: 600;
    background-color: #ecebec;
    border-bottom: solid 1px #b8b8b8;
    padding: 4px 10px;
    color: #000;
}    
    


/* valeurs secondaires */
div.cartouche b {
    font-size:22px;
    } 
   
/* libelle d'une valeur dans le cartouche */    
.p2 { 
    padding-left:5px;
    padding-right:0px;
    text-align:left;
    margin-top:10px;
    font-size:0.7em;
    }  
    
/* valeur dans le cartouche */          
.p4 { 
    padding-left:5px;
    padding-right:5px;
    text-align:right;
    padding-right:25px;
    }      
    
/* une ligne dans le cartouche */      
.p98 {
    width:98%;
    }


/* Diag Settings */
.DS {
    background-color: #FFF;
    }

.DS td {
    vertical-align:top;
    padding-bottom:2px;
    }

.DS td input[type='text'] {
    text-align:center;
    width:120px;
    height:25px;
    }

.DS td select {
    text-align:center;
    width:120px;
    height:25px;
    }



/* Graph Settings Popup */
.GS td {
    vertical-align:top;
    padding-bottom:15px;
    }

.GS td input[type='text'] {
    text-align:center;
    width:120px;
    }

.GS td input[type='password'] {
    text-align:center;
    width:120px;
    }

.GS td select {
    text-align:center;
    width:120px;
    }

/* Login Password Popup */
.LO td {
    vertical-align:top;
    padding:15px;
    }

.LO td input[type='text'] {
    text-align:center;
    width:120px;
    }

.LO td input[type='password'] {
    text-align:center;
    width:120px;
    }


/* inutilisé ?
#f1 a:hover {
    color:#F00 !important;
    text-decoration: none !important;
    }
*/


/* alignement des menus déroulants */
select {
text-align-last: center;
}


.productDataInput {
    width:100%;
    color:#444;
    font-weight:bold;
    border:thin solid #FFF;
    cursor:pointer;
    text-align:center;
}

.productDataInput:hover {
    color:#444;
    border: thin solid #AAA;
}

.graphSettingsButton {
    display: inline-block;
    color: #FFF !important;
    background-color:#090;
    text-align:center;
    padding: 5px 20px 5px 20px;
    border-radius:5px;
    width:300px;
    margin-top: 5px ;
    margin-bottom: 5px ;
    text-decoration: none;
}
.graphSettingsButton:hover {
    background-color:#070;
    font-weight:bold;
    text-decoration: none;
    color: #FFF;
    }


input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 30px white inset;
}

.Button {
    display: inline-block;
    color: #FFF !important;
    text-align:center;
    padding: 5px 20px 5px 20px;
    border-radius:5px;
    margin-top: 5px ;
    margin-bottom: 5px ;
    text-decoration: none;
    font-weight:bold;
    cursor:pointer;
}
.Button:hover {
    text-decoration: none;
    box-shadow: 8px 8px 12px #aaa;
    }
.Button i {
    color: #FFF !important;
    }

.loginButton {
    background-color:#090;
    width:95%;
}
.loginButton:hover {
    background-color:#070;
    }

.applyButton {
    background-color:#090;
    width:95%;
}
.applyButton:hover {
    background-color:#070;
    }

.applyButton100 {
    background-color:#090;
    width:100px;
}
.applyButton100:hover {
    background-color:#070;
    }


.actionButton {
    background-color:#343434;
    width:200px;
    margin-right:20px;
    font-weight:normal;
}
.actionButton:hover {
    background-color:#000000;
    font-weight:bold;
    text-decoration: none;
    }

/* barre horizontale (séparateur) */
hr {
    margin-top: 2px; 
    margin-bottom: 2px; 
}

/* Popup Fancybox */
.fancybox-bg {
    opacity: .50 !important;
}   


/* messages d'erreurs sur les formulaires */
.erreur {
    color:#F00;
    font-weight:bold;
}	


.frame {
    padding-right:15px !important;
    padding-left:15px !important;
}

 /* Popup de type modal */
 
.animated-modal {
    width: 900px;
    border-radius: 4px;
    overflow: hidden;
    background: linear-gradient(45deg, #737373 32%, #b8b8b8 100%);

    transform: translateY(-80px);
    transition: all .5s; /* Should match `data-animation-duration` parameter */
}
.animated-modal * {
    color: #000;
}
.animated-modal h2,
.animated-modal p {
    transform: translateY(-40px);
    opacity: 0;

    transition-property: transform, opacity;
    transition-duration: .3s;
}
.fancybox-slide--current .animated-modal,
.fancybox-slide--current .animated-modal h2,
.fancybox-slide--current .animated-modal p {
    transform: translateY(0);
    opacity: 1;

    transition-duration: .3s;
}
.fancybox-slide--current .animated-modal h2 {
    transition-delay: .1s;
}
.fancybox-slide--current .animated-modal p {
    transition-delay: .4s;
}
.fancybox-slide--current .animated-modal p:first-of-type {
    transition-delay: .2s;
}
    

