// ob.css

/* visibilité barre de recherche et annonce */
#smartInputResults td {z-index: 5;}
#banner .msg {z-index : 4;}

/* ipad & iphone*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
#banner .banners {height: 151px;}
#banner .banners ul.slide li  {height: 151px !important;}
.banner.center-block .msg h2, .banner.center-block .msg h3, .banner.center-block .msg h4, .banner.center-block .msg h5, .banner.center-block .msg h6 {background-color: rgb(39, 63, 102, 0.7); background-color: rgba(39, 63, 102, 0.7); padding: 15px;}
#banner .banners { background-color: #023365; color: white; display: block; height: 151px; margin-top: 0; overflow: hidden; padding: 0; width: 100%;}
#banner .banners .banner::after { background: #023365 none repeat scroll 0 0; content: ""; height: 1000%; opacity: 0.8; position: absolute; right: -1400px; top: -300%; transform: rotate(-60deg); width: 100%;}
#banner .banner::after { right: -1010px !important; width: 140% !important;}
#banner .banner::after { width: 120% !important;}
#banner .banner::after { width: 140% !important;}
#banner .banners .banner { overflow: hidden;}
.center-block { display: block; margin-left: auto; margin-right: auto;}
#banner .img { clear: both; display: block; float: left; z-index: -1;}
*::after, *::before { box-sizing: border-box;}
*::after, *::before { box-sizing: border-box;}
#banner .img { clear: both; display: block; float: left; z-index: -1;}
* { box-sizing: border-box;}
#banner .banners { color: white;}
#banner .msg { font-size: 90%; height: 86%; left: 63%; overflow: hidden; position: absolute; text-align: center; top: 8%; width: 36%; z-index: 10000;}
}

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px)  { 
#banner {display: inherit;}
#banner .banners {height: 80px;}
#banner .img {display: none;}
#banner .msg {left: 0%; width: 100%; height: 100%; font-size: 0%; top: 0%;}
#banner .msg .h2, #banner .msg h2 {font-size: 20px;}
}

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) { 
#banner {display: inherit;}
#banner .banners {height: 80px;}
#banner .img {display: none;}
#banner .msg {left: 0%; width: 100%; height: 100%; font-size: 0%; top: 0%;}
#banner .msg .h2, #banner .msg h2 {font-size: 20px;}
}