/***********************************/
/*           GENERAUX              */
/***********************************/
body {
  background-color: #18181d;
  height: auto;
  color: #ffffff;
}
::-webkit-scrollbar {
  display: none;
}

/* thats because ng-inspector suxx */
.ngi-app {
  color: black;
}

main {
  min-height: 100vh;
  position: relative;
}

nav {
  background-color: #26262c;
  /*padding: 15px 0;*/
}
a,
a:hover,
a:visited,
a:focus {
  text-decoration: none;
  color: white;
}
a:hover {
  cursor: pointer;
}
a:focus {
  outline: none !important;
}
h1 {
  font-size: 20px !important;
  margin: 0 !important;
}
h2 {
  padding: 2px 10px;
  font-size: 18px;
  margin: 0;
  font-weight: bold;
}
h3 {
  font-size: 20px !important;
  font-weight: bold;
  margin-bottom: 6px;
  margin-top: 0;
}
h4 {
  font-size: 35px;
  font-weight: bold;
}
p {
  margin: 0;
}
.caption-bold {
  font-weight: bold;
  font-size: 45px;
  margin-bottom: 10px;
}
header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 45px 0 25px;
}
p.project-caption {
  color: #666666;
  font-size: 10px;
  margin: 5px 0;
}

ul {
  list-style-type: none;
}

input,
select,
textarea {
  background-color: rgba(0, 0, 0, 0);
}
input::-webkit-input-placeholder,
input::-moz-placeholder,
input:-ms-input-placeholder,
input:-moz-placeholder {
  color: #9695a5 !important;
}
input:focus {
  outline: none;
}

img {
  width: 100%;
}

.legend {
  color: #a9a9b7;
  font-size: 13px;
  letter-spacing: 1px;
  font-weight: normal;
  margin-bottom: 8px;
  line-height: 13px;
}
.container {
  margin: 0 auto;
}
nav .container {
  width: 98%;
}

.left {
  float: left;
}
.right {
  float: right;
}
.clearfix {
  clear: both;
}
.bold {
  font-weight: bold;
}
.centered {
  text-align: center;
}
.btn-apercu {
  padding: 8px 35px;
  border-radius: 5px;
  border: 1px solid #ffffff;
}

nav .mainMenu ul li a.menu-active-bar {
  border-bottom: 2px solid white;
}
a.menu-active-bar {
  border-bottom: 2px solid white;
}

.hidden {
  display: none;
}
.md-datepicker-input-mask {
  overflow: hidden;
}
input[type='button']:disabled,
input[type='submit']:disabled {
  opacity: 0.5;
}

.animated {
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

/*********************/
/*       HOME        */
/********************/
nav .container > div {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
nav .logo-nav a {
  display: flex;
  align-items: center;
}
nav .logo {
  width: 55px;
  margin-right: 10px;
}
nav .mainMenu {
  display: flex;
}

nav .mainMenu > ul {
  display: flex;
  margin-bottom: 0;
  list-style-type: none;
  align-items: center;
  font-weight: bold;
}

nav .mainMenu > ul li a {
  display: inline-block;
  padding: 25px 5px;
  position: relative;
  overflow: hidden;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  margin-right: 25px;
  border-bottom: 2px solid #26262c;
}
nav .mainMenu ul li a.menuactive {
  color: rgba(255, 255, 255, 1);
}
/* Dropdown deconnexion */
.membre .dropdown-toggle.btn-default,
.membre .dropdown-toggle.btn-default,
.membre.open > .dropdown-toggle.btn-default:focus,
.membre.open > .dropdown-toggle.btn-default:hover {
  color: #ffffff;
  background-color: rgba(0, 0, 0, 0);
  border: none;
}

nav .mainMenu ul i {
  padding-right: 5px;
}

nav .membreConnect,
nav .membre {
  display: flex;
}
nav .membre {
  align-items: center;
}

.membre img {
  width: 40px;
  margin-right: 12px;
  border-radius: 20px;
}
.btn .caret {
  margin-left: 12px;
}
.dropdown-menu {
  right: 0;
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
  background-color: #383840;
  margin: 0;
  padding: 10px 0;
}
.dropdown-menu > li > a {
  color: #ffffff;
  font-weight: bold;
}
.dropdown-menu > li > a:focus,
.dropdown-menu > li > a:hover {
  color: #ffffff !important;
  background-color: #383840 !important;
}
.membre li a:focus,
.membre li a:hover {
  color: #ffffff !important;
  background-color: #383840 !important;
}
nav .membreConnect div:nth-of-type(2) {
  position: relative;
  margin-left: 20px;
}
nav .membreConnect div:nth-of-type(2) i {
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
/*** HEADER ***/

.header-title h2,
.header-title h2 + p {
  display: inline-block;
}
.header-title h2 {
  border-right: 1px solid #696875;
  margin-right: 5px;
}
.header-title a {
  margin-right: 10px;
  padding: 8px 0;
}

p.next-to-h2,
#button-add {
  display: inline-block;
  margin: 0;
}
p.next-to-h2 {
  padding-left: 12px;
}

header > div:nth-of-type(2) {
  display: flex;
  align-items: center;
}

/*** FILTERS ***/
#form-filters {
  background-color: #26262c;
  padding: 25px 0;
}
#form-filters.row {
  margin: 0 !important;
}
#selects-filters {
  display: flex;
  flex-direction: row;
}
#selects-filters > div {
  display: flex;
  flex-direction: column;
  padding: 0 20px;
}
.styled-select {
  background: url('/taurine-project-manager/src/img/chevron_nav_2.png')
    no-repeat 90% 50%;
  /* height: 38px; */
  overflow: hidden;
  width: 100%;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  background-color: #26262c;
  border: 1px solid #ffffff;
  padding: 6px 24px 6px 10px;
}
.styled-select select {
  background: transparent;
  border: none;
  font-size: 14px;
  height: auto;
  padding: 7px;
  width: 160%;
}
:focus {
  outline: -webkit-focus-ring-color auto 0px;
}
/*** FILTERS Mobile ***/
#filtersMobile {
  overflow: hidden;
  position: relative;
}
#mbtn {
  z-index: 1;
  width: 100%;
  position: relative;
  display: none;
  background-color: #18181d;
  border: none;
  padding: 20px 20px 40px;
}
#mbtn span i {
  margin-right: 10px;
}
#mbtn span {
  background-color: #181818;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 15px 20px;
  border-radius: 40px;
  border: 2px solid white;
  font-size: 12px;
}
#mdiv {
  width: 100%;
  position: relative;
  transition: all 0.5s ease;
  z-index: 0;
}

/*** LISTE ***/
#home-ul-projects {
  /*display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;*/
  padding: 50px 0;
}
#home-ul-projects li {
  /*	margin: 15px;
	width: 255px;*/
  margin-bottom: 31px;
}

#home-ul-projects li a > div {
  background-color: #26262c;
  padding: 20px;
  border-bottom: 1px solid rgb(54, 54, 65);
}
#home-ul-projects li a > div.nopadding {
  padding: 0;
}
#home-ul-projects li a > div:nth-of-type(1) {
  padding: 0;
}

#home-ul-projects .project-img {
  border: none;
  width: auto;
  background-color: #9595a5;
  background-image: url('/taurine-project-manager/src/img/picture_icone_mini.png');
  background-position: center;
  background-repeat: no-repeat;
  height: 150px;
}
#home-ul-projects .project-img > img {
  height: 150px;
  object-fit: cover;
}
#home-ul-projects .project-img > div {
  position: absolute;
  top: 10px;
  right: 25px;
  background-color: red;
  padding: 2px 12px;
  border-radius: 3px;
  text-transform: uppercase;
  font-size: 11px;
  font-weight: bold;
}
#home-ul-projects .project-img > img.hidden {
  display: none;
}

#home-ul-projects .project-title {
  min-height: 182px;
}
#home-ul-projects .project-details {
  min-height: 160px;
}
#home-ul-projects .project-details div:nth-of-type(1) {
  margin-bottom: 15px;
}
#home-ul-projects .project-author {
  display: flex;
}
#home-ul-projects .project-author div {
  width: 40px;
  height: 40px;
  margin-right: 8px;
}
#home-ul-projects .project-author img {
  width: 100%;
  border-radius: 20px;
}

.project-urgency {
  display: block;
  width: 100%;
  height: 4px;
}
.project-urgency.urgency-0 {
  background-color: #fc2e07;
  box-shadow: 0px 0px 10px 5px rgba(252, 46, 7, 0.2);
  -moz-box-shadow: 0px 0px 10px 5px rgba(252, 46, 7, 0.2);
  -webkit-box-shadow: 0px 0px 10px 5px rgba(252, 46, 7, 0.2);
}
.project-urgency.urgency-1 {
  background-color: #fc9208;
  box-shadow: 0px 0px 10px 5px rgba(252, 146, 8, 0.2);
  -moz-box-shadow: 0px 0px 10px 5px rgba(252, 146, 8, 0.2);
  -webkit-box-shadow: 0px 0px 10px 5px rgba(252, 146, 8, 0.2);
}
.project-urgency.urgency-2 {
  background-color: #02fe83;
  box-shadow: 0px 0px 10px 5px rgba(2, 254, 131, 0.2);
  -moz-box-shadow: 0px 0px 10px 5px rgba(2, 254, 131, 0.2);
  -webkit-box-shadow: 0px 0px 10px 5px rgba(2, 254, 131, 0.2);
}

/****************************/
/*   TEMPLATE FORM CREATE   */
/****************************/
/*** LIGHT THEME ***/
.light-theme {
  background-color: #f5f5f7;
}

.light-theme #infos-proj,
.light-theme #upload-proj,
.light-theme #authors-proj,
.light-theme #notes,
.light-theme #dragdrop {
  background-color: #ffffff;
}

.light-theme #infos-proj > div,
.light-theme #authors-proj > div:first-child {
  border-bottom: 1px solid #e9e9ec;
}
.light-theme .delay {
  border-left: 1px solid #e9e9ec;
}

.light-theme md-icon.md-default-theme,
.light-theme md-icon,
.light-theme #infos-proj .titre input,
.light-theme #infos-proj .client input,
.light-theme .md-datepicker-input,
.light-theme header,
.light-theme header a,
.light-theme .authors-list fieldset label,
.light-theme .delay > div > div,
.light-theme #authors-proj md-checkbox,
.light-theme #notes input,
.light-theme #notes textarea,
.light-theme #infos-proj .reference input {
  color: #3c3b41;
}

.light-theme .md-datepicker-input {
  font-weight: normal;
}
.light-theme .md-datepicker-input::placeholder {
  color: #9695a5 !important;
}
.light-theme .md-datepicker-triangle-button .md-datepicker-expand-triangle,
.light-theme
  .md-datepicker-triangle-button:hover
  .md-datepicker-expand-triangle {
  border-top-color: #3c3b41;
}
.light-theme textarea,
.light-theme #notes textarea {
  border: 1px solid #e9e9ec;
}

.light-theme #infos-proj .titre input::placeholder,
.light-theme #infos-proj .client input::placeholder,
.light-theme #notes input::placeholder,
.light-theme #notes textarea::placeholder,
.light-theme #infos-proj .reference input::placeholder {
  color: #e1e1e6;
}

.light-theme #upload-proj .buttons div {
  background-color: #323137;
}
.light-theme .button-form input[type='submit'] {
  background-color: #ffffff;
  border: 1px solid #dfdee8;
  color: #323137;
}
.light-theme .button-form input:hover {
  color: #ffffff;
}

.light-theme .authors-list fieldset > div {
  background-color: #ffffff;
}
.light-theme .authors-list fieldset .label-checked label {
  color: #ffffff;
}
.light-theme .authors-list fieldset .label-checked label {
  color: #ffffff;
}
.light-theme .authors-list fieldset input:checked + label {
  color: #ffffff !important;
}

.light-theme .checkboxDomain fieldset label {
  background-color: #aaa9b7;
}
/****/

#createForm > .row:first-of-type {margin-bottom: 20px;}
#createForm > .row:nth-of-type(2) {margin-bottom: 50px;}

#infos-proj,
#upload-proj,
#authors-proj,
#dragdrop,
#notes {
  background-color: #27262c;
  box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.1);
  padding: 0 20px;
}
#infos-proj,
#upload-proj {
  margin-bottom: 25px;
}
#authors-proj {
  padding: 0;
}

.btn-window a {
  display: flex;
  align-items: center;
  margin-left: 10px;
}
.btn-window a p {
  margin-right: 10px;
  font-weight: bold;
}
/****************/
/*	Bloc INFOS  */
/****************/

.checkboxDomain fieldset,
.authors-list fieldset {
  border: 0;
  padding: 0;
  margin: 10px 0 0 0;
  max-width: 100%;
  font-size: 0;
  position: relative;
}

.checkboxDomain fieldset legend {
  font-size: 17px;
  margin-bottom: 15px;
}

.checkboxDomain fieldset label {
  display: inline-block;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  margin-right: 10px;
  margin-bottom: 10px;
  border-radius: 25px;
  cursor: pointer;
  color: #fff;
  background: #63616e;
  padding: 5px 18px;
}

.checkboxDomain fieldset input,
.authors-list fieldset input {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.checkboxDomain fieldset input:checked + label,
.authors-list fieldset input:checked + label {
  background: #e33141;
  color: #fff;
}

.authors-list fieldset div.label-checked,
.checkboxDomain fieldset label.label-checked {
  background: #e33140;
}

#infos-proj .titre input,
#infos-proj .client input,
#notes input,
#infos-proj .reference input {
  display: block;
  width: 100%;
  line-height: 45px;
  font-size: 40px;
  font-weight: bold;
  border: none;
}
#infos-proj .titre input::placeholder,
#infos-proj .client input::placeholder,
#notes input::placeholder,
#notes textarea::placeholder,
#infos-proj .reference input::placeholder {
  color: #504f59;
}

#infos-proj > div {
  padding: 20px 0;
  border-bottom: 1px solid #494853;
}

#infos-proj > div:nth-of-type(4) {
  border-bottom: none;
}

.client-delay {
  display: flex;
}

.client {
  flex-grow: 1;
  padding-right: 20px;
}
#infos-proj .client input,
#infos-proj .reference input {
  line-height: 30px;
  font-size: 18px;
}

.delay {
  flex-grow: 1;
  border-left: 1px solid #494853;
  padding-left: 20px;
}

.delay > div,
.delay > div > div {
  display: flex;
}
.delay > div > div {
  align-items: center;
  font-size: 16px;
  font-weight: bold;
  color: #ffffff;
}
.delay > div > div:nth-of-type(1) {
  margin-right: 20px;
}

.md-icon-button + .md-datepicker-input-container {
  margin-left: 0px;
}

md-icon.md-default-theme,
md-icon {
  color: #9695a5 !important;
}
.md-datepicker-input {
  font-weight: normal;
  color: #ffffff;
}
.md-datepicker-input::placeholder {
  color: #ffffff !important;
}

.md-datepicker-triangle-button .md-datepicker-expand-triangle,
.md-datepicker-triangle-button:hover .md-datepicker-expand-triangle {
  border-top-color: #ffffff;
}

/**********************/
/*	Bloc DRAG & DROP  */
/**********************/
#section-drag-notes {
}
#dragdrop {
  display: flex;
  flex-direction: column;
}
#dragdrop,
#notes {
  min-height: 330px;
  padding: 20px;
}
.dragdrop-content {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  flex-grow: 1;
  color: #747481;
}
.dragdrop-content p i {
  font-size: 30px;
  margin-bottom: 10px;
}

.dropzone {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 135px;
  border: 2px dashed #747481;
  margin: 10px 0;
  border-radius: 8px;
  opacity: 0.5;
  background: url('/taurine-project-manager/src/img/upload_icone.png') center no-repeat;
  cursor: pointer;
}
.dropzone.dragover {
  opacity: 1;
}

.dropzone div {
  height: 100%;
  width: 100%;
}

#notes textarea {
  display: block;
  width: 100%;
  padding: 10px;
  min-height: 150px;
  border: 1px solid #494853;
  border-radius: 5px;
  margin-top: 15px;
}

/*****************/
/*	Bloc NOTES   */
/*****************/
#notes {
}
#notes input {
  line-height: 22px;
  font-size: 14px;
  margin-bottom: 20px;
}
/*****************/
/*	Bloc UPLOAD  */
/*****************/
#upload-proj {
  padding: 20px;
}
#upload-proj .frame {
  width: 100%;
  /*height: 135px;*/
  background-color: #000;
}
#upload-proj .frame img {
  width: 100%;
}
#upload-proj .buttons {
  display: flex;
  padding-top: 20px;
  justify-content: flex-end;
}
#upload-proj .buttons div {
  margin-left: 7px;
  width: 40px;
  height: 40px;
  background-color: #63616e;
  border-radius: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  -webkit-transition: 0.2s background-color ease-in-out;
  -moz-transition: 0.2s background-color ease-in-out;
  -o-transition: 0.2s background-color ease-in-out;
  transition: 0.2s background-color ease-in-out;
}
#upload-proj .buttons div:hover {
  background-color: #e23141;
}
#upload-proj i,
#upload-proj i:hover {
  color: #ffffff !important;
}

/******************/
/*	Bloc AUTHORS  */
/******************/

#authors-proj {
  display: flex;
  flex-direction: column;
}
#authors-proj > div:first-child {
  padding: 20px;
  border-bottom: 1px solid #494853;
}
#authors-proj .legend {
  margin-bottom: 0px;
}
.authors-list fieldset > div {
  display: flex;
}

.authors-list .author-img {
  width: 40px;
  height: 40px;
  margin-left: 15px;
}
.author-img img {
  border-radius: 20px;
}

/* checkbox auteurs */
.authors-list fieldset > div {
  padding: 5px 0;
}
.authors-list fieldset label {
  display: flex;
  flex-grow: 1;
  justify-content: space-between;
  align-items: center;
  text-align: left;
  font-size: 14px;
  line-height: 14px;
  font-weight: bold;
  margin-bottom: 0 !important;
  cursor: pointer;
  color: #fff;
  padding: 12px 16px;
}
.authors-list fieldset {
  margin: 10px 0;
}
.authors-list fieldset > div {
  background-color: #27262c;
}
.authors-list fieldset input + label i {
  display: none;
}
.authors-list fieldset input:checked + label i {
  display: inline-block;
}

/*** BOUTON ENREGISTRER ***/

.button-form {
  margin: 10px 0;
}
.button-form input[type='button'],
.button-form input[type='submit'] {
  padding: 30px 0;
  text-align: center;
  width: 100%;
  font-weight: bold;
  font-size: 18px;
  color: #ffffff;
  border: 1px solid #494853;
  background-color: #27262c;
  -webkit-transition: 0.2s background-color ease-in-out;
  transition: 0.2s color background-color ease-in-out;
}

.button-form input[type='button']:hover,
.button-form input[type='submit']:hover {
  background-color: #e33141;
}
.error {
  color: red !important;
}

/*****************************/
/*   TEMPLATE VIEW-PROJECT   */
/*****************************/
#vp-view article {
  margin: 0 0 25px 0;
}
#vp-view article > div {
  background-color: #26262c;
}
#vp-view article > div:nth-of-type(1) {
  padding-right: 35px;
  padding-left: 35px;
}
/* BLOC 1 */
/* Projet terminé ?*/
#vp-view #editForm .reference {
  display: flex;
  align-items: center;
}
#vp-view #editForm .reference > div{
  display: flex;
  flex-grow: 1;
}
#vp-view #editForm .reference > div:nth-of-type(1){flex-direction: column;}
#vp-view #editForm .reference > div:nth-of-type(2){
  justify-content: flex-end;
  align-items: center;
}
#vp-view #editForm .reference > div:nth-of-type(2) p {margin-right: 10px;}
md-switch.md-checked .md-thumb {background-color: #e33140;}
md-switch.md-checked .md-ink-ripple {color: #e33140;}
md-switch.md-checked .md-bar {background-color: #6e2228;}
/**/

#vp-view h4 + p {
  font-size: 18px;
}
#vp-view article {
  display: flex;
  /*margin: 0 0 40px 0;*/
}
#vp-view .project-title {
  border-bottom: 1px solid rgb(54, 54, 65);
}
#vp-view .project-title > p:nth-of-type(1) {
  margin-bottom: 20px;
  font-weight: bold;
}
#vp-view .project-title,
#vp-view .project-details {
  padding: 30px 0;
}
#vp-view .project-img {
  text-align: right;
  padding: 0;
  max-height: 370px;
  background-color: #9595a5;
  background-image: url('/taurine-project-manager/src/img/picture_icone.png');
  background-position: center;
  background-repeat: no-repeat;
}
#vp-view .project-img > img {
  object-fit: cover;
  height: 100%;
}

#vp-view .project-details {
  display: flex;
}
#vp-view .project-details > div {
  flex-grow: 1;
}
#vp-view .project-details div p:nth-of-type(2) {
  font-weight: bold;
}

/* BLOC 2 & 3 */
#vp-view .btn-apercu {
  background-color: rgba(0, 0, 0, 0);
  width: 100%;
  border-color: #494853;
  overflow: hidden;
}
#vp-view .dragdrop-content > div:nth-of-type(1) {
  color: #ffffff;
}
#vp-view #editForm .caption-bold {
  text-align: center;
}
.vp-authors,
.vp-dragdrop,
.vp-notes {
  background-color: #26262c;
  padding: 35px;
  min-height: 230px;
}
.vp-notes p:nth-of-type(1) {
  margin-bottom: 15px;
  font-weight: bold;
}

.vp-authors > div {
  display: flex;
  align-items: center;
  font-weight: bold;
  margin-bottom: 10px;
}
.vp-authors p.legend,
.vp-notes p.legend {
  padding-bottom: 15px;
}
.vp-authors > div:last-child {
  margin-bottom: 0;
}
.vp-authors > div > div {
  height: 40px;
  width: 40px;
  margin-right: 15px;
}
.vp-authors > div > div > img {border-radius:30px;}
.vp-dragdrop > div {
  text-align: center;
}
.vp-dragdrop > div > p {
  font-weight: bold;
  font-size: 35px;
  margin: 20px 0 10px;
}

#vp-view #editForm .dropzone img {
  width: auto;
}
.vp-dragdrop > div > p.caption {
  font-size: 14px;
  font-style: italic;
  margin-top: 32px;
  text-align: left;
}
.button-form input.button-cancel:hover {
  background-color: #717186;
}
#vp-view .button-form .bold {
  padding-bottom: 15px;
  text-align: center;
}
#vp-view .client {
  color: #18181d;
}
#vp-view .client input::placeholder {
  color: rgba(0, 0, 0, 0.3);
}

#editForm > .row:first-of-type {margin-bottom: 20px;}
#editForm > .row:nth-of-type(2) {margin-bottom: 50px;}

.blue {
  background-color: blue;
}
.archiveSuppr {
  display: flex;
}
.archiveSuppr div {
  flex-grow: 1;
}
.archiveSuppr div:nth-of-type(2) {
  margin-left: 18px;
}

.invoiceInput {
  margin: 20px 0 40px;
  width: 100%;
  text-align: center;
  border: none;
  font-size: 30px;
}
/*****************************/
/*     TEMPLATE ARCHIVES     */
/*****************************/

header form input[type='search'] {
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid rgba(255, 255, 255, 0.3);
  padding: 5px 10px;
  color: #ffffff;
  transition: border-bottom 0.2s ease-in-out;
}
header form input[type='search']:hover,
header form input[type='search']:focus {
  border-bottom: 2px solid rgba(255, 255, 255, 1);
}

header form input::placeholder {
  color: rgba(255, 255, 255, 0.3);
}

header form button {
  background-color: rgba(0, 0, 0, 0);
  border: none;
}

/* LISTE ARCHIVES */
.archive-list {
  padding: 0;
}
.archive-list li a {
  transition: background-color 0.2s ease-in-out;
  -webkit-transition: background-color 0.2s ease-in-out;
}
.archive-list li:nth-child(odd) a {
  background-color: #26262c;
  display: block;
}

.archive-list li:nth-child(even) a {
  background-color: #18181d;
  display: block;
}
.archive-list li a:hover {
  background-color: #e33140;
}

.archive-container {
  display: flex;
}

.archive-container > div {
  /*background-color: green;*/
  padding: 15px 20px;
}
.archive-container > div:first-of-type {
  font-weight: bold;
}
.archive-container > div:last-of-type {
  /*background-color: purple;*/
  width: 100%;
}
/*********************/
/*   TEMPLATE AUTH   */
/*********************/
.container.container-auth {
  position: absolute;
  top: 20vh;
  left: 0;
  right: 0;
}

#auth-template {
  text-align: center;
}
#auth-img {
  width: 420px;
  height: 200px;
  margin: 0 auto;
}

#auth-template h5 {
  font-size: 28px;
  margin: 50px 0;
}

.btn-google {
  background-color: #de493f;
  border: none;
  padding: 10px 16px;
  font-weight: bold;
  margin: 10px 0;
}
.btn-google i {
  margin-right: 10px;
}

/**********************/
/*     RESPONSIVE     */
/**********************/
@media screen and (max-width: 768px) {
  #auth-img {width:100%;}
  .container.container-home {
    padding: 0;
  }
  header {
    padding: 45px 15px 25px;
  }
  /* Nav */
  nav .container {
    padding: 0;
    width: 100%;
  }
  nav .container > div {
    flex-direction: column;
  }
  nav .mainMenu {
    width: 100%;
    justify-content: space-between;
  }
  nav .mainMenu ul {
    padding: 0;
  }
  nav .logo-nav,
  nav .mainMenu {
    padding-left: 15px;
    padding-right: 15px;
  }
  nav .logo-nav {
    padding-top: 30px;
    padding-bottom: 30px;
    width: 100%;
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.4);
  }
  nav .logo-nav a {
    justify-content: center;
  }
  .membre p {
    display: none;
  }
  .dropdown-menu {
    right: -15px;
    left: initial;
    float: none;
    padding: 5px;
    z-index: 100;
  }

  /* Filters mobile */
  #mbtn {
    display: block;
  }
  #mdiv {
    margin-top: -390px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
  }
  #mdiv.collapsed {
    margin-top: 0;
  }

  #selects-filters {
    flex-direction: column;
    align-items: center;
  }
  #selects-filters > div {
    width: 70%;
    margin-bottom: 20px;
  }

  /* container projets */
  #home-ul-projects {
    padding: 0;
    width: 80%;
    margin: 54px auto;
  }
  #home-ul-projects .project-img,
  #home-ul-projects .project-img > img {
    height: 200px;
  }

  /*** Réarrangement blocs view-project ***/
  /* Bloc 1 - Description et image */
  #vp-view #upload-proj {background-color: #3d3c44;}

  #vp-view section > article {
    flex-direction: column;
  }
  #vp-view section > article > div:nth-of-type(1) {
    order: 2;
  }
  #vp-view section > article > div:nth-of-type(2) {
    order: 1;
  }
  #vp-view .project-img > img {
    max-height: 300px;
  }
  /* Blocs 2, 3, 4 */
  .vp-authors,
  .vp-dragdrop,
  .vp-notes {
    min-height: auto;
  }

  /* Create et Edit */
  .client-delay {
    flex-direction: column;
  }
  .light-theme .delay,
  #vp-view .delay {
    border: none;
    padding: 30px 0 10px;
  }
  /* Calendrier */
  .light-theme .delay > div,
  #vp-view .delay > div {
    flex-direction: column;
  }
  .light-theme .delay > div > div,
  #vp-view .delay > div > div {
    justify-content: space-between;
  }
  .light-theme .delay > div > div:nth-of-type(1),
  #vp-view .delay > div > div:nth-of-type(1) {
    margin-right: 0;
  }
  .light-theme .md-datepicker-input,
  #vp-view .light-theme .md-datepicker-input {
    min-width: 200px;
  }

  #notes input {
    border-bottom: 1px solid #494853;
  }
  .light-theme #notes input {
    border-bottom: 1px solid #e9e9ec;
  }
}

@media screen and (max-width: 540px) {
  /* Nav */
  button.dropdown-toggle span:nth-of-type(1),
  .mainMenu > ul > li > a > i {
    display: none;
  }

  /* Title Accueil + Projet */
  header {
    align-items: flex-start;
  }
  .container.container-home .header-title a {
    display: none;
  }
  #vp-view .header-title h2,
  .light-theme .header-title h2 {
    padding: 0 0 15px;
    display: block;
  }
  .container.container-archives header {
    flex-direction: column;
  }
  .container.container-archives .header-title h2 {
    margin-bottom: 20px;
  }
  .container.container-archives .archive-list {
    margin-top: 20px;
  }

  /* Bouton fermer projet */
  #vp-view .btn-window > a > p,
  .light-theme .btn-window > a > p {
    display: none;
  }

  .header-title h2 {
    margin-right: 0;
    border: none;
  }
}