/*
This file is the exclusive property of Skinpharma
The use, copying, or modification in whole or in part of this file is prohibited unless prior express written permission is obtained from Skinpharma.
Author : Romain Marziali
Created on : 18 juil. 2018 14:28:08
*/
html{
	height : 100%;
}

body{
    margin : 0;
    font-family: Arial, sans-serif;
    font-size : 14px;
    min-width : 1000px;
	background: radial-gradient(#FFF 0%, #D4D4D4 90%);

	height : calc(100% - 40px);
	width: 100%;
	display : table;
}

header{
    top : 0;
    position : fixed;
    width : 100%;
    min-width : 800px;
    height : 100px;
    background: linear-gradient(80deg, #DDD, #FFF);
    justify-content: space-between;
    user-select: none;
    z-index : 9;
	border-bottom : 3px solid #ff6600;
}

.refresh-header{
	margin-left : -25px;
    width : 104%;
    min-width : 800px;
    height : 100px;
    background: linear-gradient(80deg, #DDD, #FFF);
    justify-content: space-between;
    user-select: none;
    z-index : 9;
	border-bottom : 3px solid #ff6600;
}

.left-header{
    display : inline-block;
    line-height: 80px;
}

#skinpharma-logo{
    height : 95px;
    vertical-align: middle;
    display : inline-block;
	margin-left : 5px;
	margin-top : 5px;
}

header div h1, .refresh-header div h1{
    margin : 0 20px 0 20px;
    color : #354e9c;
    font-size : 40px;
    white-space : nowrap;
}

header div h1 sup, .refresh-header div h1 sup{
	font-size : 30px;
}

header div, .refresh-header div{
    display : inline-block;
    vertical-align : top;
}

.right-header{
    float : right;
    display : inline-block; 
    z-index : 10;
    width : 180px;
    padding-top : 40px;
}

#lost-connexion-box{
    width : 100%;
    top : 30px;
    left : 30px;
    position : fixed;
    z-index : 10;
    display : flex;
    justify-content : center;
}

#lost-connexion-message{
    display : inline-block;
    text-align : center;
    border : 1px red solid;
    background-color : #FAA;
    padding : 5px;
    font-weight : bold;
}

#user-menu{
    margin-right : 10px;
}

#user-menu-head{
    padding-left : 2px;
    font-weight : bold;
    color : #354e9c;
}

#user-menu:hover > #user-menu-content{
    display : inline-block;
}

#user-menu-content{
    width : 150px;
    display : none;
    padding-bottom : 10px;
}

#user-menu-content a{
    width : 150px;
    display : inline-block;
    border : 1px #5f3f3f solid;
    padding : 2px 5px 2px 5px;
    background-color : #F2F2F2;
    color : #000;
    text-decoration : none;
}

#user-menu-content a:hover{
    background-color : #CCC;
}

section{
    padding-top : 100px;
    z-index : 8;
	 min-height: calc(100vh - 140px); 
}

.section-general{
    display : flex;
    justify-content : center;
	 align-items: center;
	min-height: calc(100vh - 140px); 
}

.container-middle{
    line-height : 30px;
		padding-top : 20px;
	padding-bottom : 20px;
}

input[type=text], input[type=email], input[type=password]{
    padding-left : 2px;
	height : 20px;
}

.container-middle div{
	margin-bottom : 10px;
}

#inactivity-form{
    line-height : 30px;
}

#inactivity-form label{
    display : inline-block;
    width : 100px;
    font-weight : bold;
}

#inactivity-form input{
    width : 230px;
}

.no-close .ui-dialog-titlebar-close {
    display: none;
}

.notifToRead{
    color : red;
}

#page-container {
	display : table-row;
}

#content-wrap {
	/* min-height: 100vh;*/
}

footer{
	left : 0;
	right : 0;
	background-color : #DDD;
	height : 40px;
	display : table-row;
}

footer div {
	display : inline-block;
	padding-right : 20px;
	padding-left : 20px;
	padding-top : 10px;
	height : 75%;
}

footer div{
	border-right : 1px solid black;
}

footer div a{
	color : black;
}