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;
}

.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:45%;
    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;
  }
}

.dot {
  cursor:pointer;
  height:13px;
  width:13px;
  margin:0 2px;
  background-color:#bbb;
  border-radius:50%;
  display:inline-block;
  transition:background-color 0.6s ease;
}

.dot.active {
  background-color:#717171;
}

.next, .prev {
  cursor:pointer;
  position:absolute;
  top:50%;
  width:auto;
  padding:16px;
  margin-top:-18px;
  color:white;
  font-weight:bold;
  font-size:18px;
  transition:0.6s ease;
  border-radius:0 3px 3px 0;
}

.next {
  right:0;
  border-radius:3px 0 0 3px;
}
.m
{
border: 4px ridge #00848e;
box-shadow: 6px 6px 6px black;
border-radius:5px 5px 5px 5px;
}

.dot {
  cursor:pointer;
  height:10px;
  width:10px;
  margin:0 2px;
  background-color:#bbb;
  border-radius:50%;
  display:inline-block;
  transition:background-color 0.6s ease;
}

.third {
  /*display:none;*/
}

.entreprise {
  display:none;
}

.active {
  background-color:transparent;
}

.form-control {
  border-radius:0;
}

.second {
  display:none;
}

.subscribe {
  display:none;
}

.third {
  display:none;
}

.spinner{
  animation: rotate_spinner 2s linear 0s infinite;
}

.spinner2{
  animation: rotate_spinner 2s linear 0s infinite;
}

@keyframes rotate_spinner{
  from{transform: rotate(0deg);}
  to{transform: rotate(360deg);}
}

#sujets{
  position: relative;
  background:#fff;
  width:100%;
  margin-bottom: 50px;
  padding:39px 0;
  font-family:"Century gothic";
}

#sujets.to_load{
  background-color: #DDD;
}

#sujets > i.spinner{
  position: absolute;
  color: #229ca9;
  position: absolute;
  top: 45%;
  font-size: 2rem;
  left: 48%;
}

#suj > i.spinner{
  position: absolute;
  color: #229ca9;
  position: absolute;
  top: 45%;
  font-size: 2rem;
  left: 48%;
}

#sujets > i.spinner2{
  position: absolute;
  color: #229ca9;
  position: absolute;
  top: 45%;
  font-size: 2rem;
  left: 48%;
}