body {
  margin:0;
  font-family:'Nunito Sans',sans-serif;
  font-size:1rem;
  font-weight:400;
  line-height:1.5;
  color:#212529;
  text-align:left;
  background-color:#eef4f7;
  text-align:center;
  border:1px solid #ced4da;
}

.header {
  box-shadow:0 0 1px rgba(17,17,17,0.3),0 3px 10px rgba(17,17,17,0.5);
  z-index:1030;
  position:fixed;
  top:0;
  left:0;
  right:0;
}

@media (min-width: 768px) {
  .brand {
    display:none;
  }
}

@media (min-width: 300px) {
  .NAV {
    width:0%;
    display:inline-block;
    position:relative;
    left:-25px;
  }
}

@media (min-width: 768px) {
  .NAV {
    width:73%;
    display:inline-block;
  }
}

.options {
  display:inline-block;
  /*width:25%;*/
  float:RIGHT;
}

@media (min-width: 300px) {
  .options {
    display:inline-block;
    width:30%;
    float:RIGHT;
  }
}

@media (min-width: 768px) {
  .options {
    display:inline-block;
    width:27%;
    float:RIGHT;
  }
}

.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover {
  color:#fff;
}

.navbar-light .navbar-brand {
  color:#fff;
  font-weight:700;
}

.navbar-light .navbar-nav .nav-link {
  color:#FFF;
}

.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
  color:#FFF;
}

.navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show > .nav-link {
  color:#ffffff;
  font-weight:bold;
}

.title {
  font-weight:bold;
  color:#fff;
  font-size:56px;
}

@media (min-width: 300px) {
  .text {
    text-align:center;
  }
}

@media (min-width: 768px) {
  .text {
    text-align:left;
  }
}

.btn-light {
  color:#229ca9;
  background-color:#f8f9fa;
  border-color:#f8f9fa;
}

.btn-light:hover {
  color:#ffffff;
  background-color:#229ca9;
  border-color:#dae0e5;
}

.create {
  display:inline-block;
}

@media (max-width: 1200px) {
  .create {
    display:none;
  }
}

#second {
  display:none;
}

#first {
  display:none;
}

#huit {
  display:none;
}

#third {
  display:none;
}

#neuf {
  display:none;
}

#fourth {
  display:none;
}

#cinq {
  display:none;
}

#six {
  display:none;
}

#sept {
  display:none;
}

.detail {
  font-size:13px;
  font-weight:BOLD;
  color:#404040;
  text-overflow:ellipsis;
}

.sujet {
  padding:20px 0;
}

.send {
  background:#fff;
  color:#00848e;
  border:none;
  width:40px;
  height:40px;
  border-radius:50%;
}

.mess:focus {
  display:inline-block;
  margin-right:5px;
  color:#1a9099;
  border:none;
  box-shadow:none;
  border-bottom:1px solid #FFF;
}

.mess {
  display:inline-block;
  margin-right:5px;
  color:#7d8285;
  border:none;
  border-bottom:1px solid #FFF;
  box-shadow:none;
}

@media (min-width: 300px) {
  .mess {
    width:65%;
  }
}

@media (min-width: 576px) {
  .mess {
    width:80%;
  }
}

@media (min-width: 768px) {
  .mess {
    width:85%;
  }
}

@media (min-width: 300px) {
  .Text {
    width:85%;
  }
}

@media (min-width: 576px) {
  .Text {
    width:90%;
  }
}

@media (min-width: 300px) {
  .nom {
    display:none;
  }
}

@media (min-width: 576px) {
  .nom {
    display:block;
  }
}

.fix {
  z-index:30;
  text-decoration:none;
  position:fixed;
  cursor:pointer;
  bottom:30px;
  right:15px;
  float:left;
  overflow:hidden;
  width:50px;
  height:50px;
  border-radius:50%;
  background:#229ca9;
  color:#fff;
  text-align:center;
  padding-top:9px;
  font-size:1.6em;
  box-shadow:0 0 1px rgba(17,17,17,0.3),0 3px 10px rgba(17,17,17,0.5);
}

.icon-heart:hover {
  color:#229ca9;
}