html, body {
  margin: 0;
  padding: 0;
}

.video-hero {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
.video-hero__ratio {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;  
  height: 0;
  overflow: hidden;
}

.video-hero__iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.highlight {
  background-color: yellow;
  font-weight: bold;
}

  p, .text, .nav-item, .head{
color: #483838;
font-family: 'Roboto', sans-serif;

}  

.texte{
}

 
#search{
border-color: #483838;
border-radius: 10px;

}
    .text,
    .head {
      text-align: center;
      align-self: center;
  
    }
  
    .ecole {
      font-size: 12px;
      padding: 2px;
    }


.b-example-divider {
  width: 100%;
  margin: 0 ;
  height: 3rem;
  background-color: rgba(0, 0, 0, .1);
  border: solid rgba(0, 0, 0, .15);
  border-width: 1px 0;
  box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}

@media all and (max-width:800px) {
  .quartier {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
}
.title{
  margin-left: 50px;
   font-size: 15px;
  text-align: justify;
}
  .video-hero__iframe {
    transform: scale(1.3);
    transform-origin: center center;
  }
  


 #search {
   width: 100%;
 }
.inputSearch {

  justify-content:flex-start;
  align-items:flex-start;
 
}
}