html {
  position: relative;
  width: 100%;
}
body {
  background: var(--theme-8);
  width: 100%;
}
.top-head {
height: 32px;
  background: var(--theme-9);
}
#OTS-header {
  height: 72px;
  background: #fff;
  position: sticky;
  position: -webkit-sticky;
  top: 0;
  z-index: 20;
}

#OTS-header .logo-brand {
width: 160px;
height: 72px;
}
#OTS-header .logo-brand a {
display: inline-block;
width: 100%;
height: 100%;
}
#OTS-header .logo-brand a img{
width: 150px;
height: 70px;
position: relative;
top: -px;

}
#OTS-header  .search-head {
width: 665px;
}
#OTS-header  .search-head .form-head {
width: 100%;
height: 72px;
position: relative;
}
#OTS-header  .search-head .form-head form {
width: 100%;
position: absolute;
top: calc(50% - 19px);
}
#OTS-header  .search-head .form-head .recherche {
height: 40px;
border-radius: 3px;
background: #fff;
border: 1px solid rgba(0,0,0,0.1);
width: 75%;
display: inline-block;
vertical-align: top;
}

#OTS-header  .search-head .form-head .recherche i {
width: 40px;
display: inline-block;
text-align: center;
height: 100%;
position: relative;
left: 0;
padding-top: 5px;
font-size: 18px;
color: #75757a
}

#OTS-header  .search-head .form-head .recherche input{
display: inline-block;
width: calc(100% - 60px);
margin-left: -5px;
height: 100%;
border: 0;
background: none;
padding-left: 2px;
font-size: 16px;
position: relative;
top: -1px
}
#OTS-header  .search-head .form-head button {
padding: 0 20px;
display: inline-block;
vertical-align: top;
height: 40px;
font-size: 14px;
border-radius: 3px;
border: 0;
color: #fff;
background: var(--theme-9);
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
text-transform: uppercase;
font-weight: bold
}
#OTS-header .menu-top {
width: 285px;
}
#OTS-header .menu-top .ul-head {
padding: 0;
margin: 0;
list-style: none;
height: 100%;
line-height: 72px
}

#OTS-header .menu-top .ul-head li {
display: inline-block;
padding: 0 8px;
}
#OTS-header .menu-top .ul-head li a {
color: #040404;
text-decoration: none;
}

#OTS-header .menu-head {
width: 100%;
background: #fff;
 text-align: center;
background: var(--theme-8)
}
#OTS-header .menu-head ul.menu-site {
padding: 0;
margin: 0;
list-style: none;
height: 100%;
}
#OTS-header .menu-head ul.menu-site li {
display: inline-block;
height: 40px;
line-height: 40px;
}

#OTS-header .menu-head ul.menu-site li a {
display: inline-block;
width: 100%;
height: 100%;
padding: 0 20px;
position: relative;
color: #040404;
text-decoration: none;
font-family: 'Noto Sans';
font-size: 14px
}
#OTS-header .menu-head ul.menu-site li a:hover {
color: var(--theme-9)
}
#OTS-header .menu-head ul.menu-site li a:after {
content: '|';
position: absolute;
right: 0;
}
#OTS-header .menu-head ul.menu-site li:last-child a:after {
  content: '';
}























































/*html {
  position: relative;
  width: 100%;
}
body {
  background: var(--theme-8);
  width: 100%;
}
.top-head {
height: 32px;
  background: var(--theme-9);
}
#OTS-header {
  height: 72px;
  background: #fff;
  position: sticky;
  position: -webkit-sticky;
  top: 0;
  z-index:1;
}

#OTS-header .logo-brand {
width: 160px;
height: 72px;
}
#OTS-header .logo-brand a {
display: inline-block;
width: 100%;
height: 100%;
}
#OTS-header .logo-brand a img{
width: 150px;
height: 70px;
position: relative;
top: -px;

}
#OTS-header  .search-head {
width: 665px;
}
#OTS-header  .search-head .form-head {
width: 100%;
height: 72px;
position: relative;
}
#OTS-header  .search-head .form-head form {
width: 100%;
position: absolute;
top: calc(50% - 19px);
}
#OTS-header  .search-head .form-head .recherche {
height: 40px;
border-radius: 3px;
background: #fff;
border: 1px solid rgba(0,0,0,0.1);
width: 75%;
display: inline-block;
vertical-align: top;
}

#OTS-header  .search-head .form-head .recherche i {
width: 40px;
display: inline-block;
text-align: center;
height: 100%;
position: relative;
left: 0;
padding-top: 5px;
font-size: 18px;
color: #75757a
}

#OTS-header  .search-head .form-head .recherche input{
display: inline-block;
width: calc(100% - 60px);
margin-left: -5px;
height: 100%;
border: 0;
background: none;
padding-left: 2px;
font-size: 16px;
position: relative;
top: -1px
}
#OTS-header  .search-head .form-head button {
padding: 0 20px;
display: inline-block;
vertical-align: top;
height: 40px;
font-size: 14px;
border-radius: 3px;
border: 0;
color: #fff;
background: var(--theme-9);
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
text-transform: uppercase;
font-weight: bold
}
#OTS-header .menu-top {
width: 285px;
}
#OTS-header .menu-top .ul-head {
padding: 0;
margin: 0;
list-style: none;
height: 100%;
line-height: 72px
}

#OTS-header .menu-top .ul-head li {
display: inline-block;
padding: 0 8px;
}
#OTS-header .menu-top .ul-head li a {
color: #040404;
text-decoration: none;
}

#OTS-header .menu-head {
width: 100%;
background: #fff;
 text-align: center;
background: var(--theme-8)
}
#OTS-header .menu-head ul.menu-site {
padding: 0;
margin: 0;
list-style: none;
height: 100%;
}
#OTS-header .menu-head ul.menu-site li {
display: inline-block;
height: 40px;
line-height: 40px;
}

#OTS-header .menu-head ul.menu-site li a {
display: inline-block;
width: 100%;
height: 100%;
padding: 0 20px;
position: relative;
color: #040404;
text-decoration: none;
font-family: 'Noto Sans';
font-size: 14px
}
#OTS-header .menu-head ul.menu-site li a:hover {
color: var(--theme-9)
}
#OTS-header .menu-head ul.menu-site li a:after {
content: '|';
position: absolute;
right: 0;
}
#OTS-header .menu-head ul.menu-site li:last-child a:after {
  content: '';
}
*/























































@media screen and (max-width: 1199px) {
  #OTS-header  .search-head {
     width: 510px;
  }
    #OTS-header  .search-head .form-head .recherche {
    height: 40px;
    border-radius: 3px;
    background: #fff;
    border: 1px solid rgba(0,0,0,0.1);
    width: 70%;
    display: inline-block;
    vertical-align: top;
  }
  }
  
  
  @media screen and (max-width: 991px) {
  #OTS-header  .search-head {
     width: 100%;
  }
    #OTS-header  .search-head .form-head .recherche {
    height: 40px;
    border-radius: 3px;
    background: #fff;
    border: 1px solid rgba(0,0,0,0.1);
    width: 81%;
    display: inline-block;
    vertical-align: top;
  }
    #OTS-header {
    height: auto;
    background: #fff;
    position: sticky;
    position: -webkit-sticky;
    top: 0;
  }
  #OTS-header .logo-brand {
  width: 100%;
  height: 72px;
    text-align: center;
  }
  #OTS-header .menu-top {
  width: 100%;
    text-align: center;
  }
  }
  
  
  
  @media screen and (max-width: 767px) {
  #OTS-header  .search-head {
     width: 100%;
  }
    #OTS-header  .search-head .form-head .recherche {
    height: 40px;
    border-radius: 3px;
    background: #fff;
    border: 1px solid rgba(0,0,0,0.1);
    width: 100%;
    display: inline-block;
    vertical-align: top;
    margin-bottom: 10px;
  }
    #OTS-header {
    height: auto;
    background: #fff;
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    z-index: auto;
  }
  #OTS-header .logo-brand {
  width: 100%;
  height: 72px;
    text-align: center;
  }
  #OTS-header .menu-top {
  width: 100%;
    text-align: center;
    margin-top: 30px
  }
  #OTS-header  .search-head .form-head button {
  padding: 0 20px;
    width: 100%;
  display: inline-block;
  vertical-align: top;
  height: 40px;
  font-size: 14px;
  border-radius: 3px;
  border: 0;
  color: #fff;
  background: var(--theme-9);
      box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
  text-transform: uppercase;
  font-weight: bold;
  }
  
  }