:root{
    --button-bg-color: rgba(0, 64, 84, 0.9);
}
#validButton, #dropZone, #logout:hover, .folderline:hover, .buttonAction:hover {
    background-color: rgba(0, 64, 84, 0.9);
}
.logo {
    background-image: url(../resources/_logo.png);
}
.wallPaper{
    background-color:#999999;
    background-image: url("../resources/_fond.jpg");
    background-position: center;
    background-size: cover;
}

#wallPaper {
    position:fixed;
    z-index:-1;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
}
#wallPaperLogin {
    position:fixed;
    z-index:-1;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
}
.lightTheme{
    background-color: rgba(255, 255, 255, 0.90);
    color: #666;
}

.darkTheme{
    background-color: rgba(41, 41, 41, 0.9);
    color:lightgrey;
}

body {
    font-family: 'Raleway', 'Muli-Regular', sans-serif;
    font-size:14px;
    font-weight: 500;
    margin:0px;
    font-variant-numeric: lining-nums;
    -moz-font-feature-settings:"lnum" 1;
    -moz-font-feature-settings:"lnum=1";
    -ms-font-feature-settings:"lnum" 1;
    -o-font-feature-settings:"lnum" 1;
    -webkit-font-feature-settings:"lnum" 1;
    font-feature-settings:"lnum" 1;
}

#fileListContainer {
    margin-left:170px;
    margin-right:100px;
    margin-top: 120px;
}

td{
    border:0px;
}
.texte {
    cursor: default;
    margin-right:10px;
}
.transition {
  -webkit-transition: all 0.2s; // Chrome Safari
  -moz-transition: all 0.2s;      // Mozilla
  -o-transition: all 0.2s;        // Opéra
  -ms-transition: all 0.2s;        // IE
  transition: all 0.2s;
}
.displayBlock {
    display: block;
}
.displayNone {
    display: none !important;
}
.visibilityHidden{
    visibility: hidden;
}

.transparent {
    opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */
}
.opaque {
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}

#folderline {
    position: relative;
    top: 5px;
    margin-left: 210px;
    margin-right: 110px;
    border-radius: 3px;
    display: inline-block;
}

#actionBar {
    position: fixed;
    height: 100%;
    width: 50px;
    top:0px;
    left:0px;
}

#addButtonContainer {
    margin-top: 200px;
}

#addButton {
    margin-left: -5px;

}
.buttonAction{
    cursor:default;
    padding-top: 15px;
    padding-bottom: 15px;
    width:70px;
    border-radius: 3px;
    line-height: 8px;
    /*border: 1px solid rgba(128, 128, 128, 0.35);*/
    text-align: center;
    font-size: 0.9em;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4);
}

.buttonAction:hover {
   /*  background-color: rgba(220, 120, 120, 1);
    width:70px;
    height:70px;
    font-size: 5em;
    line-height: 60px;*/
    background-color: var(--button-bg-color);
    color: white;
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.8);
    -moz-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.8);
    -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.8);
}

#thePlus {
    font-size: 4.6em;
}
#newForm {
    display: inline-block;
    position:relative;
    height:250px;
    border-radius: 3px;
    width : 0px;
    padding:0px;
    opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */
}
.newFormVisible {
    width:250px !important;
    padding:25px !important;
    opacity: 1 !important;
    filter: alpha(opacity=100) !important; /* For IE8 and earlier */
}

.newForm {
    z-index: -1;
    background-color : rgba(100,100,100,0.4);
    width: 100%;
    height: 100%;
    border-radius: 3px;
    overflow: hidden;
    box-shadow: 2px 8px 6px rgba(0,0,0,0.2),
                 0px -5px 35px rgba(255,255,255,0.3);
    -moz-box-shadow: 2px 8px 6px rgba(0,0,0,0.2),
                 0px -5px 35px rgba(255,255,255,0.3);
    -webkit-box-shadow: 2px 8px 6px rgba(0,0,0,0.2),
                 0px -5px 35px rgba(255,255,255,0.3);
}

.overlayNewForm {
    background-color: rgba(10, 10, 10, 0.6);
    position: absolute;
    width: 100%;
    height: 100%;
    z-index:1;
    opacity: 1 !important;
    filter: alpha(opacity=100) !important; /* For IE8 and earlier */
    -webkit-transition: opacity 0.2s; // Chrome Safari
    -moz-transition: opacity 0.2s;      // Mozilla
    -o-transition: opacity 0.2s;        // Opéra
    -ms-transition: opacity 0.2s;        // IE
    transition: opacity 0.2s;
    cursor: pointer;
    box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.85) inset;
    -moz-box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.85) inset;
    -webkit-box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.85) inset;
}
.filedrop:hover .texteInfos {
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
    text-shadow: 0 0 15px white;
}
.filedrop {
    position:relative;
    height: 61%;
    text-align: center;
    color:white;
}
.texteInfos {
    position: absolute;
    cursor: pointer;
    margin-top: 50px;
    width: 100%;
    z-index: 2;
}
.filedrop .material-icons {
    margin-top: 5px;
    font-size: 3em !important;
}
.newFolder {
    color: #555;
    background-color: #eee;
    padding-left:30px;
    padding-right:5px;
}
.newFolderText {
    padding-top:8px;
    font-size: 0.9em;
    padding-right: 25px;
    color: grey;
}
.newFolderValue{
    min-height: 15px;
}
.newFolder .material-icons{
    cursor: default;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 6px;
    padding-bottom: 6px;
    border: 1px solid transparent;
    transition: all 0.2s, border 0s, background-color 0s;
}
.newFolder .material-icons:hover {
    background-color: white;
    border: 1px solid #9dbff6;
}
#sampleNotif {
    position:fixed;
    right:0px;
}
.upProgressDiv{
    width:100%;
    height:5px;
    margin-top:5px;
    margin-bottom:5px;
}
.upProgressBar {
    width:0%;
    height:5px;
    background-color: black;
    border-radius: 2px;
    box-shadow: 3px 2px 6px rgba(0,0,0,0.4), -3px -2px 5px rgba(255,255,255,1);
    -moz-box-shadow: 3px 2px 6px rgba(0,0,0,0.4), -3px -2px 5px rgba(255,255,255,1);
    -webkit-box-shadow: 3px 2px 6px rgba(0,0,0,0.4), -3px -2px 5px rgba(255,255,255,1);
}
.folderline {
    display:inline-block;
    background-color: rgba(255, 255, 255, 0.08);
    line-height: 25px;
    padding-left:20px;
    padding-right:20px;
    padding-top:5px;
    padding-bottom:5px;
    border-radius: 2px;
    margin-bottom: 10px;
    margin-right: 3px;
    cursor:default;
    /*border: 1px solid rgba(128, 128, 128, 0.5);*/
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.6);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.6);
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.6);
}

.folderline:hover {
    background-color: var(--button-bg-color);
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.8);
    -moz-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.8);
    -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.8);
    color: white;
}

.pushedButton {
    text-shadow: 0 0 15px white;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.6) inset !important;
    -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.6) inset !important;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.6) inset !important;
    background-color: rgba(48, 48, 48, 0.85) !important;
    background-color: var(--button-bg-color) !important;
    color: white;
}

.fileContainer {
    display:inline-block;
    position:relative;
    width:250px;
    height:250px;
    padding:25px;
    transform-style: preserve-3d;
    transform: perspective(800px);
}

.vignette {
    width:100%;
    height:100%;
    border-radius: 3px;
    -webkit-transition: all 0.2s, transform 1s cubic-bezier(0.23, 1, 0.32, 1);
    transition: all 0.2s, transform 1s cubic-bezier(0.23, 1, 0.32, 1);
    overflow:hidden;
    box-shadow: 2px 3px 5px 0px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 2px 3px 5px 0px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 2px 3px 5px 0px rgba(0, 0, 0, 0.4);
    transform-origin: center center;
    -ms-transform: rotateX(0deg) rotateY(0deg); /* IE 9 */
    -webkit-transform: rotateX(0deg) rotateY(0deg); /* Chrome, Safari, Opera */
    transform: rotateX(0deg) rotateY(0deg);
    transform-style: preserve-3d;
}
.vignette:hover {
    box-shadow: 20px 30px 50px 0px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 20px 30px 50px 0px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 20px 30px 50px 0px rgba(0, 0, 0, 0.4);
}
.vignetteEdit {
    z-index:1;
    box-shadow: 2px 8px 6px rgba(0,0,0,0.2),
                 0px -5px 35px rgba(255,255,255,0.3);
    -moz-box-shadow: 2px 8px 6px rgba(0,0,0,0.2),
                 0px -5px 35px rgba(255,255,255,0.3);
    -webkit-box-shadow: 2px 8px 6px rgba(0,0,0,0.2),
                 0px -5px 35px rgba(255,255,255,0.3);
  /*  box-shadow: 20px 30px 50px 0px rgba(0, 0, 0, 0);
    -moz-box-shadow: 20px 30px 50px 0px rgba(0, 0, 0, 0);
    -webkit-box-shadow: 20px 30px 50px 0px rgba(0, 0, 0, 0);*/
}
.vignetteEdit:hover {
    z-index:1;
    box-shadow: 2px 8px 6px rgba(0,0,0,0.2),
                 0px -5px 35px rgba(255,255,255,0.3);
    -moz-box-shadow: 2px 8px 6px rgba(0,0,0,0.2),
                 0px -5px 35px rgba(255,255,255,0.3);
    -webkit-box-shadow: 2px 8px 6px rgba(0,0,0,0.2),
                 0px -5px 35px rgba(255,255,255,0.3);
}
.vignetteDelete {
    width : 0px;
    opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */
    padding:0px;
}
.overinset {
    position: absolute;
    width: calc(100% - 50px);
    height: calc(100% - 50px);
    box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.85) inset;
    -moz-box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.85) inset;
    -webkit-box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.85) inset;
    z-index: 1;
    border-radius: 2px;
    pointer-events: none; /* WARNING : NOT COMPATIBLE UNDER IE11 !!! */
    opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */
}
.overinsetEdit {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important; /* For IE8 and earlier */
}
.overlay {
    background-color: rgba(10, 10, 10, 0.6);
    width:100%;
    height:0%;
    opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */
    -webkit-transition: opacity 0.2s; // Chrome Safari
    -moz-transition: opacity 0.2s;      // Mozilla
    -o-transition: opacity 0.2s;        // Opéra
    -ms-transition: opacity 0.2s;        // IE
    transition: opacity 0.2s;
    cursor:pointer;
    box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.85) inset;
    -moz-box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.85) inset;
    -webkit-box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.85) inset;
}
.selectOpenIcon {
    position:absolute;
    left:0px;
    top:-200px;
    width: 100%;
    text-align:center;
    margin-top:50px;
    color:white;
    cursor: pointer;
    opacity: 0.8;
    filter: alpha(opacity=80); /* For IE8 and earlier */
}
.vignetteEdit .fileImage:hover .overlay {
    background-color: rgba(10, 10, 10, 0.7);
}
.vignetteEdit .fileImage:hover .selectOpenIcon {
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
    text-shadow: 0 0 15px white;
}
.selectOpenIcon .material-icons {
    font-size: 3em;
}

.vignetteEdit .selectOpenIcon {
    top:6px;
}
.vignetteEditMore .selectOpenIcon {
    margin-top:0px;
}
.vignetteEdit .overlay {
    height: 100% !important;
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}
.vignetteEdit .fileImage{
    height:61%;
    /*background-size: contain;*/
}
.vignetteEditMore .fileImage{
    height:20% !important;
    /*background-size: contain;*/
}
.selection {
    position:absolute;
    left:0px;
    top:-50px;
    margin:10px;
    cursor: default;
}
.actionsel .material-icons {
    color : white;
    /*background-color:cyan;
    border-radius : 5px;*/
    font-weight:bold;
    font-size:30px !important;
    opacity: 0.8;
    filter: alpha(opacity=80); /* For IE8 and earlier */
}
.download {
    position:absolute;
    cursor: default;
    right:0px;
    top:-55px;
    margin:1px;
    margin-top: 3px;
    padding:5px;
    padding-top: 3px;
    color : grey;
    border: 1px solid transparent;
    -webkit-transition: all 0.2s, border 0s, background-color 0s;
    transition: all 0.2s, border 0s, background-color 0s;
}
.download:hover {
    background-color : white;
    border: 1px solid #9dbff6;
}

.titleactiondl {
    font-size: 0.7em;
    margin-top:-5px;
}
.vignetteEdit .selection {
    top:0px;
}
.vignetteEdit .download {
    top:0px;
}
.vignetteEdit .fileStick{
    cursor:default;
    background: #eee;
}

.vignette:hover .openInfoOptions {
    display:table-cell;
}

.vignette:hover .fileTitleInfos {
    display:none;
}
.vignetteEdit .openInfoOptions {
    display:table-cell;
}

.vignetteEdit .fileTitleInfos {
    display:none;
}

.vignetteEdit .fileStick .material-icons{
    display:inline-block;
    -webkit-transform:rotate(180deg);
    -moz-transform:rotate(180deg);
    -o-transform:rotate(180deg);
    -ms-transform:rotate(180deg);
    transform:rotate(180deg);
    border: 1px solid transparent;
    -webkit-transition: all 0.2s, border 0s, background-color 0s;
    transition: all 0.2s, border 0s, background-color 0s;
}


.vignetteEdit .fileStick .material-icons:hover{
    background-color : white;
    border: 1px solid #9dbff6;
}

.fileStick:hover .material-icons{
    display:inline-block;
    /*background-size: contain;*/
}
.fileStick:hover .openInfoOptions {
    display:table-cell;
}

.fileStick:hover .fileTitleInfos {
    display:none;
}
.fileImage {
    position:relative;
    cursor : default;
    width:100%;
    height:82%;
    color:white;
    z-index:-1;
    text-align: center;
    -webkit-transition: height 0.3s;
    transition: height 0.3s;
}
.realFileImage {
    position: absolute;
    width: 200%;
    height: 200%;
    top:-50%;
    left: -50%;
    z-index: -1;
    background-position: center center;
    background-repeat: no-repeat;
    background-image:url('/resources/_icon/file_icon.png');
    -webkit-transition: height 0.3s, transform 1s cubic-bezier(0.23, 1, 0.32, 1);
    transition: height 0.3s, transform 1s cubic-bezier(0.23, 1, 0.32, 1);
}

.fileStick {
    color:#555555;
    height:16%;
    padding-bottom:5px;
    overflow: hidden;
    cursor:default;
    background: lightgrey; /* Old browsers */
    background: -moz-linear-gradient(top, rgba(255,255,255,1) 3%,rgba(230,230,230,1) 10%,rgba(230,230,230,1) 93%,rgba(170,170,170,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(255,255,255,1) 3%,rgba(230,230,230,1) 10%,rgba(230,230,230,1) 93%,rgba(170,170,170,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(255,255,255,1) 3%,rgba(230,230,230,1) 10%,rgba(230,230,230,1) 93%,rgba(170,170,170,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#848484',GradientType=0 ); /* IE6-9 */
}
.openInfoOptions{
    text-align:right;
    padding-right:8px;
    cursor:default;
    display:none;
}
.fileActions {
    /*position: absolute;*/
    /*z-index:-1;*/
    /*top: 0%;
    margin-top:25px;
    margin-left: 30px;*/
    left: 0px;
    width: 100%;
    height:50px;
    /*height: calc(100% - 50px);*/
    margin-left:2px;
    margin-bottom:5px;
}
.action {
    display:inline-block;
    min-width: 40px;
    padding:5px;
    font-size:0.8em;
    text-align:center;
    border: 1px solid transparent;
}
.action:hover {
    background-color : white;
    border: 1px solid #9dbff6;
}
.action_title {
}
/*
.action_delete {
    left:180px;
}
.action_cut {
    left:120px;
}
.action_copy {
    left:60px;
}
.action_share {
    left:0px;
}
*/
.fileInfos {
    font-size: 0.9em;
    background-color:#eeeeee;
    color:grey;
    cursor:default;
    height:62%;
}
.fileTitle_value {
    display: inline-block;
    text-align: left;
    padding:5px;
    margin:5px;
    border: 1px solid transparent;
    white-space: nowrap;
    width: 180px;
    overflow:hidden;
}
.fileTitle_value[contenteditable="true"]:hover, .fileTitle_value[contenteditable="true"]:focus
 {
    cursor:text;
    background-color: white;
    border-bottom: none;
    border: 1px solid #9dbff6;
}
.fileTitle_value[contenteditable="true"] {
    cursor:text;
    border-bottom: 1px solid lightgrey;
}
.fileTitleInfos{
    font-size:0.7em;
    padding-right:5px;
    text-align:right;
}
.systemInfo {
    font-style: italic;
    font-size: 0.9em;
}
.info {
    padding-right:15px;
    padding-left:15px;
    padding-top: 10px;
    padding-bottom: 5px;
}
.infoTitle {
    font-weight: bold;
}
.infoValue{
    font-style: italic;
    margin-top:3px;
    min-height: 15px;
    padding-left:5px;
    border: 1px solid transparent;
}
.infoValue[contenteditable="true"]{
    font-style: normal;
}
.infoValue[contenteditable="true"]:hover, .infoValue[contenteditable="true"]:focus {
    cursor:text;
    background-color: white;
    border: 1px solid #9dbff6;
}
.bottombloc {
    border-bottom:1px solid lightgrey;
    margin-bottom:5px;
    padding-bottom:3px;
    padding-top:3px;
}
.deleteAlert{
	border-color: #BF000B;
    color: #D8000C;
    background-color: #FFBABA;
}

.updateAlert{
	border-color: #865100;
	color: #9F6000;
    background-color: #FEEFB3;
}

.createNom{
    display : inline-block;
}

#inputFileContainer {
    position:absolute;
    z-index:3;
    cursor: pointer;
    width:100%;
    height: 100%;
    top:0px;
    left:0px;
}

#inputFile{
    width:100%;
    height: 100%;
    cursor: pointer;
}

.realDelete {
    background-color : transparent;
    border: 1px solid transparent;
    text-align: center;
    color : darkred;
    margin-left:15px;
    margin-right:15px;
    padding:10px;
}
.realDelete:hover {
    background-color : white;
    border: 1px solid #9dbff6;
}
.deleteFileIcon:hover {
    background-color: red;
}

.updateFile {
    position:fixed;
    left:-500px;
    top:0px;
    width:0px;
    height:0px;
}

#dropZone {
    position:fixed;
    width:100%;
    height:0%;
    left:0px;
    top:0px;
    overflow:hidden;
    z-index:10;
    font-family: 'Raleway', 'Muli-Regular', sans-serif;
    text-align:center;
    font-size: 3em;
    color:white;
    background-color: var(--button-bg-color);
    -webkit-transition: opacity 0.15s; // Chrome Safari
    -moz-transition: opacity 0.15s;      // Mozilla
    -o-transition: opacity 0.15s;        // Opéra
    -ms-transition: opacity 0.15s;        // IE
    transition: opacity 0.15s;
}


#dropZone .texteCentre {
    line-height: 1.5em;
    margin-top: 40vh; /* poussé de la moitié de hauteur de viewport */
    transform: translateY(-60%); /* tiré de la moitié de sa propre hauteur */
}

#overL{
    position:absolute;
    width:100%;
    height:100%;
    top:0px;
    left:0px;
    z-index:1;
    background-color: rgba(92, 64, 64, 0.01);
}
.height100 {
    height:100% !important;
}

#voletNotifs{
    position:fixed;
    z-index:10;
    /*padding-right: 10px;*/
    bottom:0px;
    right:0px;
    width: 280px;

}
.notif {
   /* width: calc(100% - 50px);
    margin:10px;*/
    cursor: default;
    padding-left:20px;
    border-bottom: 1px solid grey;
    padding-right:20px;
    padding-top:15px;
    padding-bottom:15px;
    background-color: #f1f1f1;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
    box-shadow: 2px 3px 5px 0px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 2px 3px 5px 0px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 2px 3px 5px 0px rgba(0, 0, 0, 0.4);
}
.closeCross {
    position: absolute;
    cursor: default;
    right: 0px;
    top:0px;
    width: 20px;
    height: 20px;
    padding: 5px;
    margin: 2px;
    border: 1px solid transparent;
}
.closeCross:hover {
    background-color : white;
    border: 1px solid #9dbff6;
}
.closeCross .material-icons {
    font-size : 20px;
    cursor: default;
}



#credentialsForm {
    position:absolute;
    text-align: center;
    cursor:default;
    width: 500px;
    height: 300px;
    left: calc(50% - 290px);
    top: 20%;
    color:grey;
    padding: 30px;
    border-radius: 5px;
    background-color: rgba(255, 255, 255, 0.80);
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4);
}

#formulogin{
    padding:10px;
    font-size: 16px;
    text-align: right;
    padding-right: 70px;
}

.lineform {
    padding: 10px;
}

.lineFormValue {
    text-align: left;
    padding: 3px;
    width: 200px;
    height: 20px;
    font-family: 'Raleway', 'Muli-Regular', sans-serif;
    border: 1px solid transparent;
    border-bottom:1px solid darkgrey;
    background: transparent;
    font-size: 16px;
    color:grey;
}

.lineFormValue:hover, .lineFormValue:focus {
    cursor:text;
    border: 1px solid #9dbff6;
    background-color: white;
}

#validButton{
    text-align: center;
    font-size: 16px;
    margin: 30px;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 15px;
    color: white;
    background-color: var(--button-bg-color);
    cursor: pointer;
    width: 85%;
    height: auto;
}

.inlineBlock{
    display: inline-block;
}
#boutonsUser {
    position: absolute;
    font-size: 10px;
    cursor: pointer;
    bottom: 0px;
    width: 100%;
    text-align: center;
}
#boutonsUser .material-icons {
    font-size: 21px;
}
.boutons {
    cursor: default;
    text-align: center;
    color: grey;
    padding-top: 3px;
    padding-bottom: 4px;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4) inset;
    -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4) inset;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4) inset;
}
.boutons:hover {
    color: white;
    background-color: #EC7832;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4);
}
#validButton:hover, .buttonFormValueActiv{
    opacity: 0.9;
    filter: alpha(opacity=90); /* For IE8 and earlier */
}
#bandeau{
    position:fixed;
    left:0px;
    top:0px;
    width: 100%;
    min-height: 47px;
    z-index:10;
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.8);
    -moz-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.8);
    -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.8);
}
#logologin{
    width: 100%;
    height: 80px;
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
}

#logo{
    position: absolute;
    display: inline-block;
    left: 0px;
    width: 180px;
    height: 45px;
    background-size: auto 90%;
    background-repeat: no-repeat;
    background-position: center;
}

#logout{
    height: 40px;
    width: 100px;
    position: absolute;
    right: 0px;
    font-size: 0.9em;
    top: 0px;
    padding-top: 3px;
    padding-bottom: 4px;
    line-height: 0.9em;
    border-radius: 0px;
    border: none;
    background-color: transparent;
}
#logout:hover{
    background-color: var(--button-bg-color);
    color:white;
}

#logout .material-icons {
    font-size: 21px;
}
.shareBloc{
}
.loaderGif{
    width: 100%;
    height: 45px;
    background-image: url(../resources/loader.gif);
    background-repeat: no-repeat;
    background-position: center;
}
.theLink{
    white-space: nowrap;
    overflow: hidden;
    font-style: normal !important;
    cursor: text;
}

.buttonCopyLink{
    width: calc(100% - 10px);
    text-align: center;
    font-size: 1em;
}

i{
    vertical-align: middle !important;
}