/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*--------------------------------------------(min-width:250px) and (max-width: 329px)  -----------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
@media all and (min-width:250px) and (max-width: 329px) {
    /*---------------------------                   ------------------------*/
    .filtre_select { width: 80px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 30px;
  padding-right: 30px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/menu-filtre.png');
   background-size:30px;
  background-repeat: no-repeat;
  background-position: left;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .filtre_select_ar {  width: 80px;
  height: 40px;
  display: inline-block;
  float:right;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 8px;
  padding-left: 10px;
  padding-right: 35px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:12px;
  background-image: url('https://www.obien.ma/images/global/menu-filtre.png');
   background-size:30px;
  background-repeat: no-repeat;
  background-position: right;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .localisation_select { width: 80px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 35px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  
  background-image: url('https://www.obien.ma/images/global/localisation-menu.png');
   background-size:28px;
  background-repeat: no-repeat;
  background-position: left;
  
  /*background-image: url('https://www.obien.ma/images/global/localisation-menu.png');
   background-size:32px;
  background-repeat: no-repeat;
  background-position: left; */
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    
      .localisation_select_ar { width: 80px;
  height: 40px;
  display: inline-block;
  float:right;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 8px;
  padding-left: 10px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:12px;
  background-image: url('https://www.obien.ma/images/global/localisation-menu.png');
   background-size:28px;
  background-repeat: no-repeat;
  background-position: right;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .prix_select { width: 80px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 35px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/prix-menu.png');
   background-size:28px;
  background-repeat: no-repeat;
  background-position: left;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
  
  
 /*---------------------------                   ------------------------*/
    .prix_select_ar { width: 80px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 10px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/prix-menu.png');
   background-size:28px;
  background-repeat: no-repeat;
  background-position: right;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*-------------------------                            ----------------------*/   
    
    #toggle_div {
       position:absolute; z-index:150; display:none; top:103px; left:0; padding:0px;
       border:none; max-height:700px; margin:0 auto; overflow:hidden; background:white; text-align:left;  min-height:600px;
       margin: 0 auto;  padding:0px; color:#789; font-size:11px; width:330px; }
              
    #toggle_div a { display:block; font-size:12px; margin:0; padding-bottom:5px; }

    #results { position:absolute; display:none; top:36px; left:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:11px; }
    #results div{ padding:10px; font-size:11px; text-align:left; color:#474747; font-weight:bold; cursor:pointer;}
    
    #results_ar {   position:absolute; display:none; top:36px; right:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120; color:black; font-size:13px; }
    #results_ar div{ padding:10px;   font-size:11px; text-align:right; color:#474747; font-weight:bold; cursor:pointer; }

    #searchComplete {  height:30px;}
    
    .bloc_titre { padding-bottom:0px; margin:0; color:#474747; font-weight:bold;  font-size:14px; font-family: 'Roboto', Arial, Helvetica, sans-serif; padding-left:0px; padding-right:0px; height:auto; line-height:17px; text-align:left; }
    .obien { display:inline-block; position:relative; left:10%; color:#ff6e14; font-weight:bold; font-size:20px; text-align:center; height:55px; margin-top:15px; }
    .obien_ar { display:inline-block; position:relative; right:10%; color:#ff6e14; font-weight:bold; font-size:20px; text-align:center; height:55px; margin-top:15px; }
    
    .ville_div { padding:6px; font-size:11px; color:black; }
    
    .btn { font-size:12px; }
    
    .btn_head { min-width:19.9vw; }
    
    #bloc_post_right { margin-left:24%; margin-right:33px; width:65%; margin:0 auto; overflow:hidden; padding-top:8px; padding-bottom:8px;   padding-right:2px;  }
    #bloc_post_left { margin-right:24%; margin-left:33px; width:65%; margin:0 auto; overflow:hidden;  padding-top:8px; padding-bottom:8px; padding-right:2px; text-align:right;   }
          
    #navig_post_right { float:left; width:23%; margin-right:35px;  margin:0 auto; overflow:hidden; padding:0; margin:0; position:relative; top:15%;  transform: translate(0%,15%); background:#ffffff; text-align:center; }
    #navig_post_left { float:right; width:23%; margin-left:35px;  margin:0 auto; overflow:hidden; padding:0; margin:0; position:relative; top:15%;  transform: translate(0%,15%);  background:#ffffff; text-align:center; }      
    
    #bigger { width:100%; height:135px; text-align:center; margin:0 auto; box-sizing:border-box; border-radius: 15px 15px 15px 0; }
    .biggerAnn { width:100%; height:220px; border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px; } 
    
    img[src="loader"] { position:absolute; left:50%; top:50%; margin:-15px 0 0 -15px;}
    
    #viewer { position:relative; width:300px; height:300px; margin:0 auto; text-align:center; background:#f2f2f2;  border-radius: 12px; }
     .viewer {  width:300px; height:300px; }
     #myCanvas { max-width:100%; height:300px;  background:#f2f2f2;  margin:0 auto; text-align:center;   }
    
   
     #small { max-width:100%; height:45px;  margin:0; padding:0; }
     #controls { margin-top:0px; width:98%; height:65px; margin:0 auto; overflow:hidden; background:#ffffff; }
     #thumbs li { width:45px; height:45px; }
     #thumbs a { width:45px; height:45px; }
     
     #next { color:red; font-size:30px; font-weight:bold; cursor:pointer; }
    #prev {  color:red; font-size:30px; font-weight:bold; cursor:pointer; }
     
     .prev_button img { width:30px; height:30px; }
     .next_button img { width:30px; height:30px; }
     .prev_button { position:relative; margin-top:18px; float:left; width:30px; height:30px; margin-left:5px;  }
    .next_button {  position:relative; margin-top:18px; float:right; width:30px; height:30px; margin-right:5px;  }
    .centre_button { margin-right:25px; margin-left:25px; overflow:hidden; margin:0 auto; text-align:center; width:265px;  }
    
    
    .pied_categorie_min { width:99%; background:#f1f1f1; margin:0 auto; overflow:hidden; position:relative; font-size:11.5px; }
    
    /* --------------------------------------------------------------------------------------------- */
    /*  -------------  CARROUSSEL TACTILE ---------------------------------------------------------- */
    /* --------------------------------------------------------------------------------------------- */
    .main-carousel{
    width:100%;
    margin:0;
    margin-top:0;
    padding-right:6px;

    overflow:hidden;

    box-sizing:border-box;
}
    .carousel-cell { width:99%;  margin-top:0px; padding-bottom:0px; background-color:#f9f9f9; color:#474747; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;
    margin:6px; }
    
    .acceuil-carousel-cell { width:80%;  margin-top:0px; padding-bottom:0px; background-color:#f9f9f9; color:#474747; box-shadow: 1px 2px 2px 2px rgba(190,190,190, 0.1),
            1px -1px 2px 2px rgba(190,190,190, 0.1); border-radius:8px;
    margin:6px; background:white; padding:10px; padding-bottom:10px; }
    
    #big-carousel { width:20%; }
    #big-carousel a { font-size:12px; }
    
    
    /* ------------------------------------------------------------ */
    .carousel-rub-cell img { width:35px; height:35px; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
    
    
    
    /* --------------------------------------------------------------------------------------------- */
    /*  -------------  TWEET ---------------------------------------------------------- */
    /* --------------------------------------------------------------------------------------------- */
    
    #tweet_first { color:#ffffff;background:#282828;  display: inline-block; vertical-align:top; width: 42%; margin:0 auto; overflow:hidden;
              padding:4px; margin:4px; font-size: 11px; }
    
    #tweet { color:#ffffff;background:#26394c;  float:left; width:100%; padding:8px; font-weight:bold; box-sizing: border-box; }
    #tweet img {  margin-right: 2px;}
    #tweet ul { display: inline-block; vertical-align:top; margin-top: 0; width: 48%; padding-left: 2px; box-sizing: border-box; }
    #tweet a {display: block; text-decoration: none; color:#d2d2d2; padding:0px; margin-bottom:14px; padding-bottom:8px; font-weight:normal; font-size:14px; text-align:center; margin:0 auto; }
    #tweet h2 { font-family: 'Montserrat', sans-serif !important; font-size:20px; color:#ffffff; font-weight:bold; text-align:center; padding-bottom:25px; padding-top:2px; }
}

/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*--------------------------------------------(min-width:330px) and (max-width: 399px)  -----------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
@media all and (min-width:330px) and (max-width: 399px) {
    
    /*---------------------------                   ------------------------*/
    .filtre_select { width: 100px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 30px;
  padding-right: 30px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/menu-filtre.png');
   background-size:30px;
  background-repeat: no-repeat;
  background-position: left;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .filtre_select_ar {  width: 100px;
  height: 40px;
  display: inline-block;
  float:right;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 8px;
  padding-left: 10px;
  padding-right: 35px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:12px;
  background-image: url('https://www.obien.ma/images/global/menu-filtre.png');
   background-size:30px;
  background-repeat: no-repeat;
  background-position: right;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .localisation_select { width: 100px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 35px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  
  background-image: url('https://www.obien.ma/images/global/localisation-menu.png');
   background-size:28px;
  background-repeat: no-repeat;
  background-position: left;
  
  /*background-image: url('https://www.obien.ma/images/global/localisation-menu.png');
   background-size:32px;
  background-repeat: no-repeat;
  background-position: left; */
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    
      .localisation_select_ar { width: 100px;
  height: 40px;
  display: inline-block;
  float:right;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 8px;
  padding-left: 10px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:12px;
  background-image: url('https://www.obien.ma/images/global/localisation-menu.png');
   background-size:28px;
  background-repeat: no-repeat;
  background-position: right;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .prix_select { width: 100px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 35px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/prix-menu.png');
   background-size:28px;
  background-repeat: no-repeat;
  background-position: left;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
  
  
 /*---------------------------                   ------------------------*/
    .prix_select_ar { width: 100px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 10px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/prix-menu.png');
   background-size:28px;
  background-repeat: no-repeat;
  background-position: right;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
  
    
    /*-------------------------                            ----------------------*/    
    
    #toggle_div {
       position:absolute; z-index:150; display:none; top:103px; left:0; padding:0px;
       border:none; max-height:700px; margin:0 auto; overflow:hidden; background:white; text-align:left;  min-height:600px;
       margin: 0 auto;  padding:0px; color:#789; font-size:11px; width:400px; }
              
    #toggle_div a { display:block; font-size:12px; margin:0; padding-bottom:5px; }

    #results {   position:absolute; display:none; top:36px; left:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:11px; }
    #results div{ padding:10px; font-size:11px; text-align:left; color:#474747; font-weight:bold; cursor:pointer;}
    
    #results_ar {   position:absolute; display:none; top:36px; right:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120; color:black; font-size:13px; }
    #results_ar div{ padding:10px;   font-size:11px; text-align:right; color:#474747; font-weight:bold; cursor:pointer; }

    #searchComplete {  height:30px;}
    
    .bloc_titre { padding-bottom:0px; margin:0; color:#474747; font-weight:bold;  font-size:14px; font-family: 'Roboto', Arial, Helvetica, sans-serif; padding-left:0px; padding-right:0px;  height:auto; line-height:17px;  text-align:left;}
    .obien { display:inline-block; position:relative; left:10%; color:#ff6e14; font-weight:bold; font-size:20px; text-align:center; height:55px; margin-top:17px; }
    .obien_ar { display:inline-block; position:relative; right:10%; color:#ff6e14; font-weight:bold; font-size:20px; text-align:center; height:55px; margin-top:17px; }
    
    .ville_div { padding:6px; font-size:12px; color:black; }
    
    .btn { font-size:12px; }
    
    .btn_head { min-width:19.9vw; }
    
    #bloc_post_right { margin-left:27%; margin-right:33px; width:63%; margin:0 auto; overflow:hidden; padding-top:8px; padding-bottom:8px;   padding-right:2px;  }
    #bloc_post_left { margin-right:27%; margin-left:33px; width:63%; margin:0 auto; overflow:hidden;  padding-top:8px; padding-bottom:8px; padding-right:2px; text-align:right;   }
          
    #navig_post_right { position:relative; float:left; width:26%; margin-right:35px;  margin:0 auto; overflow:hidden; padding:0; margin:0; background:#ffffff; text-align:center; }
    #navig_post_left { position:relative; float:right; width:26%; margin-left:35px;  margin:0 auto; overflow:hidden; padding:0; margin:0; background:#ffffff; text-align:center; }      
    
    #bigger { width:100%; height:135px; text-align:center; margin:0 auto; box-sizing:border-box; border-radius: 15px 15px 15px 0; }
    .biggerAnn { width:100%; height:235px; border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px;  } 
    
    img[src="loader"] { position:absolute; left:50%; top:50%; margin:-15px 0 0 -15px;}
     
    #viewer { position:relative; width:300px; height:300px; margin:0 auto; text-align:center; background:#f2f2f2;  border-radius: 12px; }
     .viewer {  width:300px; height:300px; }
     #myCanvas { max-width:100%; height:300px;  background:#f2f2f2; margin:0 auto; text-align:center;   }     
          
     #small { max-width:100%; height:45px;  margin:0; padding:0; }
     #controls { margin-top:0px; width:98%; height:65px; margin:0 auto; overflow:hidden; background:#ffffff; }
     #thumbs li { width:45px; height:45px; }
     #thumbs a { width:45px; height:45px; }
     
     #next { color:red; font-size:30px; font-weight:bold; cursor:pointer; }
    #prev {  color:red; font-size:30px; font-weight:bold; cursor:pointer; }
     
     .prev_button img { width:30px; height:30px; }
     .next_button img { width:30px; height:30px; }
     .prev_button { position:relative; margin-top:18px; float:left; width:30px; height:30px; margin-left:5px;  }
    .next_button {  position:relative; margin-top:18px; float:right; width:30px; height:30px; margin-right:5px;  }
    .centre_button { margin-right:25px; margin-left:25px; overflow:hidden; margin:0 auto; text-align:center; width:265px;  }
    
    /* --------------------------------------------------------------------------------------------- */
    /*  -------------  CARROUSSEL TACTILE ---------------------------------------------------------- */
    /* --------------------------------------------------------------------------------------------- */
    .main-carousel{
    width:100%;
    margin:0;
    margin-top:0;
    padding-right:6px;

    overflow:hidden;

    box-sizing:border-box;
}
    .carousel-cell { width:99%; margin-top:0px; padding-bottom:0px; background-color:#f9f9f9; color:#474747; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;
    margin:6px; line-height: 80%;     }
    
    .acceuil-carousel-cell { width:80%;  margin-top:0px; padding-bottom:0px; background-color:#f9f9f9; color:#474747; box-shadow: 1px 2px 2px 2px rgba(190,190,190, 0.1),
            1px -1px 2px 2px rgba(190,190,190, 0.1); border-radius:8px;
    margin:6px; background:white; padding:10px; padding-bottom:10px; }
    
    #big-carousel { width:20%; }
    #big-carousel a { font-size:13px; }
    
    
    /* ------------------------------------------------------------ */
    .carousel-rub-cell img { width:35px; height:35px; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
    
    
    
    /* --------------------------------------------------------------------------------------------- */
    /*  -------------  TWEET ---------------------------------------------------------- */
    /* --------------------------------------------------------------------------------------------- */
    #tweet_first { color:#ffffff;background:#282828;  display: inline-block; vertical-align:top; width: 42%; margin:0 auto; overflow:hidden;
              padding:4px; margin:4px; font-size: 12px; }
    
    #tweet { color:#ffffff;background:#26394c; float:left; width:100%; padding:8px; font-weight:bold; box-sizing: border-box; }
    #tweet img {  margin-right: 2px;}
    #tweet ul { display: inline-block; vertical-align:top; margin-top: 0; width: 48%; padding-left: 2px; box-sizing: border-box; }
    #tweet a { display: block; text-decoration: none; color:#d2d2d2; padding:0px; margin-bottom:14px; padding-bottom:8px; font-weight:normal; font-size:14px; text-align:center; margin:0 auto; }
    #tweet h2 { font-family: 'Montserrat', sans-serif !important; font-size:20px; color:#ffffff; font-weight:bold; text-align:center; padding-top:2px; padding-bottom:25px; }
}


/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*--------------------------------------------(min-width:400px) and (max-width: 499px)  -----------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
@media all and (min-width:400px) and (max-width: 499px) {
    
    /*---------------------------                   ------------------------*/
    .filtre_select { width: 110px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 30px;
  padding-right: 30px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/menu-filtre.png'), url('https://www.obien.ma/images/global/fleche-menu-droite.png');
   background-size:30px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: left, right;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .filtre_select_ar {  width: 110px;
  height: 40px;
  display: inline-block;
  float:right;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 8px;
  padding-left: 10px;
  padding-right: 35px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:12px;
  background-image: url('https://www.obien.ma/images/global/menu-filtre.png'), url('https://www.obien.ma/images/global/fleche-menu-gauche.png');
   background-size:30px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: right, left;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .localisation_select { width: 110px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 35px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  
  background-image: url('https://www.obien.ma/images/global/localisation-menu.png'), url('https://www.obien.ma/images/global/fleche-menu-bas.png');
   background-size:28px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: left, right;
  
  /*background-image: url('https://www.obien.ma/images/global/localisation-menu.png');
   background-size:32px;
  background-repeat: no-repeat;
  background-position: left; */
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    
      .localisation_select_ar { width: 110px;
  height: 40px;
  display: inline-block;
  float:right;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 8px;
  padding-left: 10px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:12px;
  background-image: url('https://www.obien.ma/images/global/localisation-menu.png'), url('https://www.obien.ma/images/global/fleche-menu-bas.png');
   background-size:28px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: right, left;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .prix_select { width: 110px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 35px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/prix-menu.png'), url('https://www.obien.ma/images/global/fleche-menu-bas.png');
   background-size:28px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: left, right;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
  
  
 /*---------------------------                   ------------------------*/
    .prix_select_ar { width: 110px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 10px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/prix-menu.png'), url('https://www.obien.ma/images/global/fleche-menu-bas.png');
   background-size:28px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: right, left;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
  
  
    #toggle_div {
       position:absolute; z-index:150; display:none; top:103px; left:0; padding:0px;
       border:none; max-height:700px; margin:0 auto; overflow:hidden; background:white; text-align:left;  min-height:600px;
       margin: 0 auto;  padding:0px; color:#789; font-size:11px; width:440px; }
              
    #toggle_div a { display:block; font-size:12px; margin:0; padding-bottom:5px; }

    #results {   position:absolute; display:none; top:36px; left:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:11px; }
    #results div{ padding:10px; font-size:11px; text-align:left; color:#474747; font-weight:bold; cursor:pointer;}
    
    
    #results_ar {   position:absolute; display:none; top:36px; right:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:13px; }
    #results_ar div{ padding:10px;   font-size:11px; text-align:right; color:#474747; font-weight:bold; cursor:pointer; }

    #searchComplete {  height:30px;}
    
    .bloc_titre { padding-bottom:0px; margin:0; color:#474747; font-weight:bold; font-size:14px; font-family: 'Roboto', Arial, Helvetica, sans-serif; padding-left:0px; padding-right:0px;  height:auto; line-height:17px; text-align:left; }
    
    .btn { font-size:13px; }
    
    .btn_head { min-width:19.9vw; }
    
    .obien { display:inline-block; position:relative; left:10%; color:#ff6e14; font-weight:bold; font-size:20px; text-align:center; height:55px; margin-top:13px; }
    .obien_ar { display:inline-block; position:relative; right:10%; color:#ff6e14; font-weight:bold; font-size:20px; text-align:center; height:55px; margin-top:13px; }
    
    .ville_div { padding:6px; font-size:12px; color:black; }
    
    #bloc_post_right { margin-left:27%; margin-right:33px; width:65%; overflow:hidden; padding-top:8px; padding-bottom:8px;   padding-right:2px;  }
    #bloc_post_left { margin-right:27%; margin-left:33px; width:65%; margin:0 auto; overflow:hidden;  padding-top:8px; padding-bottom:8px; padding-right:2px; text-align:right;   }
          
    #navig_post_right { position:relative; float:left; width:26%; margin-right:35px;  margin:0 auto; overflow:hidden; padding:0; margin:0; background:#ffffff; text-align:center; }
    #navig_post_left { position:relative; float:right; width:26%; margin-left:35px;  margin:0 auto; overflow:hidden; padding:0; margin:0; background:#ffffff; text-align:center; }      
    
    #bigger { width:100%; height:165px; text-align:center; margin:0 auto; box-sizing:border-box; border-radius: 15px 15px 15px 0; }
    .biggerAnn {  width:100%; height:240px; border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px;  } 
    
    img[src="loader"] { position:absolute; left:50%; top:50%; margin:-15px 0 0 -15px;}
    
    #viewer { position:relative; width:350px; height:350px; margin:0 auto; text-align:center; background:#f2f2f2;  border-radius: 12px; }
     .viewer { position:absolute;  width:350px; height:350px; }
     #myCanvas { max-width:100%; height:350px;  background:#f2f2f2;    } 
    
    #small { max-width:100%; height:50px;  margin:0; padding:0; }
     #controls { margin-top:0px; width:98%; height:70px; margin:0 auto; overflow:hidden; background:#ffffff; }
     #thumbs li { width:50px; height:50px; }
     #thumbs a { width:50px; height:50px; }
     
     #next { color:red; font-size:35px; font-weight:bold; cursor:pointer; }
    #prev {  color:red; font-size:35px; font-weight:bold; cursor:pointer; }
     
     .prev_button img { width:30px; height:30px; }
     .next_button img { width:30px; height:30px; }
     .prev_button { position:relative; margin-top:18px; float:left; width:30px; height:35px; margin-left:5px;  }
    .next_button {  position:relative; margin-top:18px; float:right; width:30px; height:35px; margin-right:5px;  }
    .centre_button { margin-right:25px; margin-left:25px; overflow:hidden; margin:0 auto; text-align:center; width:295px;  }
    
    /* --------------------------------------------------------------------------------------------- */
    /*  -------------  CARROUSSEL TACTILE ---------------------------------------------------------- */
    /* --------------------------------------------------------------------------------------------- */
    .main-carousel{
    width:100%;
    margin:0;
    margin-top:0;
    padding-right:6px;

    overflow:hidden;

    box-sizing:border-box;
}
    .carousel-cell { width:99%; margin-top:0px; padding-bottom:0px; background-color:#f9f9f9; color:#474747; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;
    margin:6px; line-height: 80%;      }
    
    .acceuil-carousel-cell { width:80%;  margin-top:0px; padding-bottom:0px; background-color:#f9f9f9; color:#474747; box-shadow: 1px 2px 2px 2px rgba(190,190,190, 0.1),
            1px -1px 2px 2px rgba(190,190,190, 0.1); border-radius:8px;
    margin:6px; background:white; padding:10px; padding-bottom:10px; }
    
    #big-carousel { width:20%; }
    #big-carousel a { font-size:13px; }
    
    
    /* ------------------------------------------------------------ */
    .carousel-rub-cell img { width:35px; height:35px; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
    
    
    /* --------------------------------------------------------------------------------------------- */
    /*  -------------  TWEET ---------------------------------------------------------- */
    /* --------------------------------------------------------------------------------------------- */
    #tweet_first { color:#ffffff;background:#282828;  display: inline-block; vertical-align:top; width: 42%; margin:0 auto; overflow:hidden;
              padding:4px; margin:4px; font-size: 12px; }
    
    #tweet { color:#ffffff;background:#26394c; float:left; width:100%; padding:8px; font-weight:bold; box-sizing: border-box; }
    #tweet img {  margin-right: 2px;}
    #tweet ul { display: inline-block; vertical-align:top; margin-top: 0; width: 48%; padding-left: 2px; box-sizing: border-box; }
    #tweet a { display: block; text-decoration: none; color:#d2d2d2; padding:0px; margin-bottom:14px; padding-bottom:8px; font-weight:normal; font-size:14px; text-align:center; margin:0 auto; }
    #tweet h2 { font-family: 'Montserrat', sans-serif !important; font-size:20px; color:#ffffff; font-weight:bold; text-align:center; padding-bottom:25px; padding-top:2px; }
} 

/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*--------------------------------------------(min-width:500px) and (max-width: 579px)  -----------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
@media all and (min-width:500px) and (max-width: 579px) {
    /*---------------------------                   ------------------------*/
    .filtre_select { width: 160px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 30px;
  padding-right: 30px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/menu-filtre.png'), url('https://www.obien.ma/images/global/fleche-menu-droite.png');
   background-size:30px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: left, right;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .filtre_select_ar {  width: 130px;
  height: 40px;
  display: inline-block;
  float:right;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 8px;
  padding-left: 10px;
  padding-right: 35px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:12px;
  background-image: url('https://www.obien.ma/images/global/menu-filtre.png'), url('https://www.obien.ma/images/global/fleche-menu-gauche.png');
   background-size:30px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: right, left;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .localisation_select { width: 130px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 35px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: normal;
  border: 1px solid #c2d0e5;
  color: #152233;
  border-radius:15px;
  
  background-image: url('https://www.obien.ma/images/global/localisation-menu.png'), url('https://www.obien.ma/images/global/fleche-menu-bas.png');
   background-size:28px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: left, right;
  
  /*background-image: url('https://www.obien.ma/images/global/localisation-menu.png');
   background-size:32px;
  background-repeat: no-repeat;
  background-position: left; */
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    
      .localisation_select_ar { width: 130px;
  height: 40px;
  display: inline-block;
  float:right;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 8px;
  padding-left: 10px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: normal;
  border: 1px solid #c2d0e5;
  color: #152233;
  border-radius:12px;
  background-image: url('https://www.obien.ma/images/global/localisation-menu.png'), url('https://www.obien.ma/images/global/fleche-menu-bas.png');
   background-size:28px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: right, left;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .prix_select { width: 130px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 35px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: normal;
  border: 1px solid #c2d0e5;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/prix-menu.png'), url('https://www.obien.ma/images/global/fleche-menu-bas.png');
   background-size:28px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: left, right;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
  
  
 /*---------------------------                   ------------------------*/
    .prix_select_ar { width: 130px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 10px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/prix-menu.png'), url('https://www.obien.ma/images/global/fleche-menu-bas.png');
   background-size:28px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: right, left;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*-------------------------                            ----------------------*/    
    
    #toggle_div {
       position:absolute; z-index:150; display:none; top:103px; left:0; padding:0px;
       border:none; max-height:700px; margin:0 auto; overflow:hidden; background:white; text-align:left;  min-height:600px;
       margin: 0 auto;  padding:0px; color:#789; font-size:11px; width:520px; }
              
    #toggle_div a { display:block; font-size:12px; margin:0; padding-bottom:5px; }

    #results {   position:absolute; display:none; top:36px; left:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:11px; }
    #results div{ padding:10px; font-size:11px; text-align:left; color:#474747; font-weight:bold; cursor:pointer;}
    
    
    #results_ar {   position:absolute; display:none; top:36px; right:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:13px; }
    #results_ar div{ padding:10px;   font-size:11px; text-align:right; color:#474747; font-weight:bold; cursor:pointer; }

    #searchComplete {  height:30px;}
    
    .btn { font-size:13px; }
    
    .btn_head { min-width:19.9vw; }
    
    .bloc_titre { padding-bottom:0px; margin:0; color:#474747; font-weight:bold; font-size:14px; font-family: 'Roboto', Arial, Helvetica, sans-serif; padding-left:0px; padding-right:0px; height:auto; line-height:17px; text-align:left; }
    .obien { display:inline-block; position:relative; left:10%; color:#ff6e14; font-weight:bold; font-size:22px;text-align:center; height:55px; margin-top:15px; }
    .obien_ar { display:inline-block; position:relative; right:10%; color:#ff6e14; font-weight:bold; font-size:22px;text-align:center; height:55px; margin-top:15px; }
    
    .ville_div { padding:6px; font-size:13px; color:black; }
    
    #bloc_post_right { margin-left:24%; margin-right:33px; width:69%; margin:0 auto; overflow:hidden; padding-top:8px; padding-bottom:8px;   padding-right:2px;  }
    #bloc_post_left { margin-right:24%; margin-left:33px; width:69%; margin:0 auto; overflow:hidden;  padding-top:8px; padding-bottom:8px; padding-right:2px; text-align:right;   }
          
    #navig_post_right { position:relative; float:left; width:23%; margin-right:35px;  margin:0 auto; overflow:hidden; padding:0; margin:0; background:#ffffff; text-align:center; }
    #navig_post_left { position:relative; float:right; width:23%; margin-left:35px;  margin:0 auto; overflow:hidden; padding:0; margin:0; background:#ffffff; text-align:center; }      
    
    #bigger { width:100%; height:165px; text-align:center; margin:0 auto; box-sizing:border-box; border-radius: 15px 15px 15px 0; }
    .biggerAnn {  width:100%; height:260px; border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px; } 
    
    img[src="loader"] { position:absolute; left:50%; top:50%; margin:-15px 0 0 -15px;}
    
    #viewer { position:relative; width:350px; height:350px; margin:0 auto; text-align:center; background:#f2f2f2;  border-radius: 12px; }
     .viewer { position:absolute;  width:350px; height:350px; }
     #myCanvas { max-width:100%; height:350px;  background:#f2f2f2;    }
          
   #small { max-width:100%; height:55px;  margin:0; padding:0; }
     #controls { margin-top:0px; width:98%; height:75px; margin:0 auto; overflow:hidden; background:#ffffff; }
     #thumbs li { width:55px; height:55px; }
     #thumbs a { width:55px; height:55px; }
     
     #next { color:red; font-size:35px; font-weight:bold; cursor:pointer; }
    #prev {  color:red; font-size:35px; font-weight:bold; cursor:pointer; }
     
     .prev_button img { width:30px; height:30px; }
     .next_button img { width:30px; height:30px; }
     .prev_button { position:relative; margin-top:18px; float:left; width:30px; height:35px; margin-left:5px;  }
    .next_button {  position:relative; float:right; width:30px; height:35px; margin-right:5px;  }
    .centre_button { margin-right:25px; margin-left:25px; overflow:hidden; margin:0 auto; text-align:center; width:325px;  }
    
    .pied_categorie_min { width:99%; background:#f1f1f1; margin:0 auto; overflow:hidden; position:relative; font-size:13px; }
    
    /* --------------------------------------------------------------------------------------------- */
    /*  -------------  CARROUSSEL TACTILE ---------------------------------------------------------- */
    /* --------------------------------------------------------------------------------------------- */
    .main-carousel{
    width:100%;
    margin:0;
    margin-top:0;
    padding-right:6px;

    overflow:hidden;

    box-sizing:border-box;
}
    .carousel-cell { width:99%; margin-top:0px; padding-bottom:0px; background-color:#f9f9f9; border:2px solid #e2e2e2; color:#474747; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;
    margin:6px; line-height: 80%;       }
    
    .acceuil-carousel-cell { width:80%;  margin-top:0px; padding-bottom:0px; background-color:#f9f9f9; color:#474747; box-shadow: 1px 2px 2px 2px rgba(190,190,190, 0.1),
            1px -1px 2px 2px rgba(190,190,190, 0.1); border-radius:8px;
    margin:6px; background:white; padding:10px; padding-bottom:10px; }
    
    #big-carousel { width:20%; }
    #big-carousel a { font-size:13px; }
    
    
    /* ------------------------------------------------------------ */
    .carousel-rub-cell img { width:35px; height:35px; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
    
    
    /* --------------------------------------------------------------------------------------------- */
    /*  -------------  TWEET ---------------------------------------------------------- */
    /* --------------------------------------------------------------------------------------------- */
    #tweet_first { color:#ffffff;background:#282828;  display: inline-block; vertical-align:top; width: 42%; margin:0 auto; overflow:hidden;
              padding:4px; margin:4px; font-size: 12px; }
    
    #tweet { color:#ffffff; background:#26394c; float:left; width:100%; padding:8px; font-weight:bold; box-sizing: border-box; }
    #tweet img {  margin-right: 2px;}
    #tweet ul { display: inline-block; vertical-align:top; margin-top: 0; width: 48%; padding-left: 2px; box-sizing: border-box;}
    #tweet a { display: block; text-decoration: none; color:#d2d2d2; padding:0px; margin-bottom:14px; padding-bottom:8px; font-weight:normal; font-size:14px; text-align:center; margin:0 auto; }
    #tweet h2 { font-family: 'Montserrat', sans-serif !important; font-size:20px; color:#ffffff; font-weight:bold; text-align:center; padding-bottom:25px;  padding-top:2px; }
}


/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*--------------------------------------------(min-width:580px) and (max-width: 649px)  -----------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
@media all and (min-width:580px) and (max-width: 649px) {
    /*-------------------------                            ----------------------*/    
    
    /*---------------------------                   ------------------------*/
    .filtre_select { width: 160px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 30px;
  padding-right: 30px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/menu-filtre.png'), url('https://www.obien.ma/images/global/fleche-menu-droite.png');
   background-size:30px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: left, right;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .filtre_select_ar {  width: 140px;
  height: 40px;
  display: inline-block;
  float:right;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 8px;
  padding-left: 10px;
  padding-right: 35px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:12px;
  background-image: url('https://www.obien.ma/images/global/menu-filtre.png'), url('https://www.obien.ma/images/global/fleche-menu-gauche.png');
   background-size:30px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: right, left;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .localisation_select { width: 140px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 35px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: normal;
  border: 1px solid #c2d0e5;
  color: #152233;
  border-radius:15px;
  
  background-image: url('https://www.obien.ma/images/global/localisation-menu.png'), url('https://www.obien.ma/images/global/fleche-menu-bas.png');
   background-size:28px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: left, right;
  
  /*background-image: url('https://www.obien.ma/images/global/localisation-menu.png');
   background-size:32px;
  background-repeat: no-repeat;
  background-position: left; */
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    
      .localisation_select_ar { width: 140px;
  height: 40px;
  display: inline-block;
  float:right;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 8px;
  padding-left: 10px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: normal;
  border: 1px solid #c2d0e5;
  color: #152233;
  border-radius:12px;
  background-image: url('https://www.obien.ma/images/global/localisation-menu.png'), url('https://www.obien.ma/images/global/fleche-menu-bas.png');
   background-size:28px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: right, left;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    /*---------------------------                   ------------------------*/
    .prix_select { width: 140px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 35px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: normal;
  border: 1px solid #c2d0e5;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/prix-menu.png'), url('https://www.obien.ma/images/global/fleche-menu-bas.png');
   background-size:28px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: left, right;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
  
  
 /*---------------------------                   ------------------------*/
    .prix_select_ar { width: 140px;
  height: 40px;
  display: inline-block;
  float:left;
  background:#ffffff;
  margin-top: 0px;
  padding-top: 7px;
  padding-left: 10px;
  padding-right: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #474747;
  color: #152233;
  border-radius:15px;
  background-image: url('https://www.obien.ma/images/global/prix-menu.png'), url('https://www.obien.ma/images/global/fleche-menu-bas.png');
   background-size:28px, 32px;
  background-repeat: no-repeat, no-repeat;
  background-position: right, left;
  cursor: pointer;
  line-height: 25px; /* important pour centrage vertical */
  box-sizing: border-box; }
    
    #toggle_div {
       position:absolute; z-index:150; display:none; top:103px; left:0; padding:0px;
       border:none; max-height:485px; margin:0 auto; overflow:hidden; background:white; text-align:left;  height:470px;
       margin: 0px;  padding:0px; color:#789; font-size:11px; width:580px; }
              
    #toggle_div a { display:block; font-size:12px; margin:0; padding-bottom:5px; }

    #results {   position:absolute; display:none; top:36px; left:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:11px; }
    #results div{ padding:10px; font-size:11px; text-align:left; color:#474747; font-weight:bold; cursor:pointer;}
    
    #results_ar {   position:absolute; display:none; top:36px; right:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:13px; }
    #results_ar div{ padding:10px;   font-size:11px; text-align:right; color:#474747; font-weight:bold; cursor:pointer; }
 
    #searchComplete {  height:30px;}
    
    .btn { font-size:13px; }
    
    .btn_head { min-width:19.9vw; }
    
    .bloc_titre { padding-bottom:0px; margin:0; color:#474747; font-weight:bold;  font-size:14px; font-family: 'Roboto', Arial, Helvetica, sans-serif; padding-left:0px; padding-right:0px; height:auto; line-height:18px; text-align:left; }
    .obien { display:inline-block; position:relative; left:10%; color:#ff6e14; font-weight:bold; font-size:22px;text-align:center; height:55px; margin-top:15px; }
    .obien_ar { display:inline-block; position:relative; right:10%; color:#ff6e14; font-weight:bold; font-size:22px;text-align:center; height:55px; margin-top:15px; }
    
    .ville_div { padding:6px; font-size:13px; color:black; }
    
    
    #bloc_post_right { margin-left:24%; margin-right:33px; width:70%; margin:0 auto; overflow:hidden; padding-top:8px; padding-bottom:8px;   padding-right:2px;  }
    #bloc_post_left { margin-right:24%; margin-left:33px; width:70%; margin:0 auto;  overflow:hidden;  padding-top:8px; padding-bottom:8px; padding-right:2px; text-align:right;   }
          
    #navig_post_right { position:relative; float:left; width:23%; margin-right:35px; margin:0 auto;  overflow:hidden; padding:0; margin:0; background:#ffffff; text-align:center; }
    #navig_post_left { position:relative; float:right; width:23%; margin-left:35px;  overflow:hidden; padding:0; margin:0; background:#ffffff; text-align:center; }      
    
    #bigger { width:100%; height:175px; text-align:center; margin:0 auto; box-sizing:border-box; border-radius: 15px 15px 15px 0; }
    .biggerAnn {  width:100%; height:280px; border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px;  } 
    
    img[src="loader"] { position:absolute; left:50%; top:50%; margin:-15px 0 0 -15px;}
    
    #viewer { position:relative; width:350px; height:350px; margin:0 auto; text-align:center; background:#f2f2f2;  border-radius: 12px; }
     .viewer { position:absolute;  width:350px; height:350px; }
     #myCanvas { max-width:100%; height:350px;  background:#f2f2f2;    }
           
    #small { max-width:100%; height:60px;  margin:0; padding:0; }
     #controls { margin-top:0px; width:98%; height:70px; margin:0 auto; overflow:hidden; background:#ffffff; }
     #thumbs li { width:60px; height:60px; }
     #thumbs a { width:60px; height:60px; }
     
     #next { color:red; font-size:35px; font-weight:bold; cursor:pointer; }
    #prev {  color:red; font-size:35px; font-weight:bold; cursor:pointer; }
     
     .prev_button img { width:30px; height:30px; }
     .next_button img { width:30px; height:30px; }
     .prev_button { position:relative; margin-top:18px; float:left; width:30px; height:35px; margin-left:5px;  }
    .next_button {  position:relative; margin-top:18px; float:right; width:30px; height:35px; margin-right:5px;  }
    .centre_button { margin-right:25px; margin-left:25px; overflow:hidden; margin:0 auto; text-align:center; width:355px;  }  
    
    .pied_categorie_min { width:99%; background:#f1f1f1; margin:0 auto; overflow:hidden; position:relative; font-size:13px; } 
    
    /* --------------------------------------------------------------------------------------------- */
    /*  -------------  CARROUSSEL TACTILE ---------------------------------------------------------- */
    /* --------------------------------------------------------------------------------------------- */
    .main-carousel{
    width:100%;
    margin:0;
    margin-top:0;
    padding-right:6px;

    overflow:hidden;

    box-sizing:border-box;
}
    .carousel-cell { width:99%; margin-top:0px; padding-bottom:0px; background-color:#f9f9f9; color:#474747; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;
    margin:6px; line-height: 80%;       }
    
    .acceuil-carousel-cell { width:80%;  margin-top:0px; padding-bottom:0px; background-color:#f9f9f9; color:#474747; box-shadow: 1px 2px 2px 2px rgba(190,190,190, 0.1),
            1px -1px 2px 2px rgba(190,190,190, 0.1); border-radius:8px;
    margin:6px; background:white; padding:10px; padding-bottom:10px; }
    
    #big-carousel { width:20%; }
    #big-carousel a { font-size:13px; }
    
    
    /* ------------------------------------------------------------ */
    .carousel-rub-cell img { width:35px; height:35px; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
    
    
    /* --------------------------------------------------------------------------------------------- */
    /*  -------------  TWEET ---------------------------------------------------------- */
    /* --------------------------------------------------------------------------------------------- */
    #tweet_first { color:#ffffff;background:#282828;  display: inline-block; vertical-align:top; width: 42%; margin:0 auto; overflow:hidden;
              padding:4px; margin:4px; font-size: 12px; }
    
    #tweet { color:#ffffff;background:#26394c; float:left; width:100%; padding:8px; font-weight:bold; box-sizing: border-box; }
    #tweet img {  margin-right: 2px;}
    #tweet ul { display: inline-block; vertical-align:top; margin-top: 0; width: 48%; padding-left: 2px; box-sizing: border-box; }
    #tweet a {display: block; font-size:15px; text-decoration: none; color:#d2d2d2; padding:0px; margin-bottom:14px; padding-bottom:8px; font-weight:normal; text-align:center; margin:0 auto; }
    #tweet h2 { font-family: 'Montserrat', sans-serif !important; font-size:20px; color:#ffffff; font-weight:bold; text-align:center; padding-bottom:25px; padding-top:2px; }
}




/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*--------------------------------------------(min-width:650px) and (max-width: 849px)  -----------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
@media all and (min-width:650px) and (max-width: 749px) {
    /*-------------------------                            ----------------------*/    
    #toggle_div {
       position:absolute; z-index:150; display:none; top:95px; left:10px;
       border:none; max-height:495px; margin:0 auto; overflow:hidden; background:white; text-align:left;  height:480px; 
       margin: 0px;  padding:0px; color:#789; font-size:12px; width:720px;}
              
    #toggle_div a { display:block; font-size:12px; margin:0; padding:0; }

    #results {   position:absolute; display:none; top:36px; left:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:11px; }
    #results div{ padding:10px; font-size:11px; text-align:left; color:#474747; font-weight:bold; cursor:pointer;}
  /*  #results div:focus, #results div:hover, #results div:active{ padding:10px; background:#e8e8e8;  font-size:11px; color:orange; 
       font-weight:bold; cursor:pointer; }*/
       
    
    .btn { font-size:14px; } 
    
    #results_ar {   position:absolute; display:none; top:36px; right:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:13px; }
    #results_ar div{ padding:10px;   font-size:11px; text-align:right; color:#474747; font-weight:bold; cursor:pointer; }
   /* #results_ar div:focus, #results_ar div:hover{ padding:10px; background:#e8e8e8; text-align:right; color:orange; 
       font-weight:bold; cursor:pointer; }*/

    .result_focus { background:#e6e6e6; color:orange; }
    #searchComplete {  height:30px;}
    
    
}

/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*--------------------------------------------(min-width:750px) and (max-width: 849px)  -----------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
@media all and (min-width:750px) and (max-width: 849px) {
    /*-------------------------                            ----------------------*/    
    #toggle_div {
       position:absolute; z-index:150; display:none; top:95px; left:10px;
       border:none; max-height:495px; margin:0 auto; overflow:hidden; background:white; text-align:left;  height:480px; 
       margin: 0px;  padding:0px; color:#789; font-size:12px; width:850px;}
              
    #toggle_div a { display:block; font-size:12px; margin:0; padding:0; }

    #results {   position:absolute; display:none; top:36px; left:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:11px; }
    #results div{ padding:10px; font-size:11px; text-align:left; color:#474747; font-weight:bold; cursor:pointer;}
  /*  #results div:focus, #results div:hover, #results div:active{ padding:10px; background:#e8e8e8;  font-size:11px; color:orange; 
       font-weight:bold; cursor:pointer; }*/
    
    #results_ar {   position:absolute; display:none; top:36px; right:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:13px; }
    #results_ar div{ padding:10px;   font-size:11px; text-align:right; color:#474747; font-weight:bold; cursor:pointer; }
   /* #results_ar div:focus, #results_ar div:hover{ padding:10px; background:#e8e8e8; text-align:right; color:orange; 
       font-weight:bold; cursor:pointer; }*/

    .result_focus { background:#e6e6e6; color:orange; }
    #searchComplete {  height:30px;}
    
    .btn { font-size:14px; } 
    
    
}



/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*--------------------------------------------(min-width:850px) and (max-width: 1023px)  -----------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
@media all and (min-width:850px) and (max-width: 1023px) {
    /*-------------------------                            ----------------------*/    
    #toggle_div {
       position:absolute; z-index:150; display:none; top:95px; left:0;
       border:none; max-height:495px; margin:0 auto; overflow:hidden; background:white; text-align:left;  height:480px;
       padding-right: 20px; color:#789; font-size:12px; width:950px;}
              
    #toggle_div a { display:block; font-size:12px; margin:0; padding:0; }

    #results {   position:absolute; display:none; top:36px; left:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:11px; }
    #results div{ padding:10px; font-size:12px; text-align:left; color:#474747; font-weight:bold; cursor:pointer;}
    /*#results div:focus, #results div:hover{ padding:10px; background:#e8e8e8;  color:orange; font-weight:bold; cursor:pointer; }*/
    
    #results_ar {   position:absolute; display:none; top:36px; right:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:13px; }
    #results_ar div{ padding:10px;   font-size:12px; text-align:right; color:#474747; font-weight:bold; cursor:pointer; }
    /*#results_ar div:focus, #results_ar div:hover{ padding:10px; background:#e8e8e8; text-align:right; color:orange;
       font-weight:bold; cursor:pointer; }*/

    .result_focus { background:#e6e6e6; color:orange; }
    #searchComplete {  height:30px;}
    
    .btn { font-size:14px; } 
    
}



/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*--------------------------------------------(min-width:1024px) and (max-width: 1239px)  -----------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
@media all and (min-width:1024px) and (max-width: 1239px) {
    /*-----------------------------------------        --------------------------------------------------*/
    #toggle_div {
       position:absolute; z-index:150; display:none; top:102px; left:0; max-height:385px; overflow:hidden; background:white;
       text-align:left;  height:400px; border:none;
       margin: 0px;  padding:0px; color:#789; font-size:12px; min-width:1024px;}
      
     #toggle_div a { display:block; font-size:12px; }
     

     #results {   position:absolute; display:none; top:36px; left:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:11px; }
    #results div{ padding:10px; font-size:13px; text-align:left; color:#474747; font-weight:bold; cursor:pointer;}
    /*#results div:focus, #results div:hover, #results div:active{ padding:10px; background:#e8e8e8;  color:orange; font-weight:bold; cursor:pointer; }*/
    
    #results_ar {   position:absolute; display:none; top:36px; right:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:13px; }
    #results_ar div{ padding:10px;   font-size:13px; text-align:right; color:#474747; font-weight:bold; cursor:pointer; }
    /*#results_ar div:focus, #results_ar div:hover{ padding:10px; background:#e8e8e8; text-align:right; color:orange; 
       font-weight:bold; cursor:pointer; }*/

    .result_focus { background:#e6e6e6; color:orange; }
    .result_blur { background:white; color:#474747; }
    #searchComplete {  height:30px;}
    
    
}


/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*--------------------------------------------(min-width:1240px) and (max-width: 1749px)  -----------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
@media all and (min-width:1240px) and (max-width: 1749px) {
    /*-----------------------------------------        --------------------------------------------------*/
    #toggle_div {
       position:absolute; z-index:150; display:none; top:102px; left:0;
       border:none; max-height:385px; overflow:hidden; background:white; text-align:left;  height:400px;
       margin-right: 0px; color:#789; font-size:11px; min-width:1024px;}
      
     #toggle_div a { display:block; font-size:12px; }

     #results {   position:absolute; display:none; top:36px; left:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:11px; }
    #results div{ padding:10px; font-size:14px; text-align:left; color:#474747; font-weight:bold; cursor:pointer;}
   /* #results div:focus, #results div:hover{ padding:10px; background:#e8e8e8;  color:orange; font-weight:bold; cursor:pointer; }*/
    
    #results_ar {   position:absolute; display:none; top:36px; right:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:13px; }
    #results_ar div{ padding:10px;   font-size:14px; text-align:right; color:#474747; font-weight:bold; cursor:pointer; }
    /*#results_ar div:focus, #results_ar div:hover{ padding:10px; background:#e8e8e8; text-align:right; color:orange;
       font-weight:bold; cursor:pointer; }*/

    .result_focus { background:#e6e6e6; color:orange; }
    #searchComplete {  height:30px;}
    
    .btn { font-size:15px; } 
    
}



/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*--------------------------------------------(min-width:1750px) and (max-width: 2048px)   -----------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
/*------------------------------------------------------------ --------------------------------------------------------------------*/
@media all and (min-width:1750px) and (max-width: 2048px) {
    /*----------------------------------------   -----------------------------------------------------*/  
    #toggle_div {
        position:absolute; z-index:150; display:none; top:102px; left:0;
        border:none; max-height:385px; overflow:hidden; background:white; text-align:left;  height:400px; 
        margin-right: 0px; color:#789; font-size:12px; min-width:1750px;}
      
    #toggle_div a { display:block; font-size:12px; }

    #results {   position:absolute; display:none; top:36px; left:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:11px; }
    #results div{ padding:10px; font-size:14px; text-align:left; color:#474747; font-weight:bold; cursor:pointer;}
    /*#results div:focus, #results div:hover{ padding:10px; background:#e8e8e8;  color:orange; font-weight:bold; cursor:pointer; }*/
    
    #results_ar {   position:absolute; display:none; top:36px; right:0; 
	        border:1px solid #e6e6e6; background:white;  min-height:30px; min-width:100%;
	        text-align:left;  border:1px solid #e6e6e6;  z-index:120;
	        color:black; font-size:13px; }
    #results_ar div{ padding:10px;   font-size:14px; text-align:right; color:#474747; font-weight:bold; cursor:pointer; }
   /* #results_ar div:focus, #results_ar div:hover{ padding:10px; background:#e8e8e8; text-align:right; color:orange; 
       font-weight:bold; cursor:pointer; }*/

    .result_focus { background:#e6e6e6; color:orange; }
    #searchComplete {  height:30px;}
    
    .btn { font-size:15px; } 
}