@page {
  size: 210mm 297mm;  /*877pt 1240pt*/

/*  prince-bleed: 2mm;
  prince-trim: 2mm;*/
}

img {
  max-width: 100%;
}

/* reset chapter and figure counters on the body */
body {
  font-family: Lato, "Trebuchet MS", "Open Sans", sans-serif, "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
  font-size: 1.4em;
  padding: 0;
}

p, ul, li, table, strong, span, tr, td {
  color: #333;
}

h2 {
  line-height: 1;
}


.break {
  page-break-before: always;
}

/* supprime l'espace qui se colle avant le premier row*/

.row:before {
  display: none;
}

h1,h2,h3,h4,h5,.titre-anim {
  page-break-after: avoid;
  page-break-inside:avoid;
}

h1+p, h2+p, h3+p {
  page-break-before: avoid;
}

table, figure {
  page-break-inside: avoid;
}

ul.toc {
  list-style: none;
  margin: 0;
  padding: 0;
}

a {
  color: #000;
}

p {
  margin: 0;
}


.titre-journal {
  padding: 1em;
  margin-top: -3em;
  margin-bottom: 1em;
  width: 100%;
}

.titre-partie {
  padding: 5px;
  margin-top: 0px;
  margin-bottom: 5px;
  width: 100%;
}

.titre-journal h1 {
font-family: "Digital-medium", "Lucida Grande", "Trebuchet MS", "Lucida Sans", "Lucida Sans Unicode", sans-serif;
    font-size: 3.8em;
    letter-spacing: 0.1em;
    margin-bottom: 0;
    margin-top: 0.6em;
    text-align: center;
    font-weight: lighter;
}

.titre-partie h2 {
  font-family: "Digital-medium", "Lucida Grande", "Trebuchet MS", "Lucida Sans", "Lucida Sans Unicode", sans-serif;
  font-size: 3em;
  letter-spacing: 0.1em;
  margin-bottom: 0;
  margin-top: 0.5em;
  text-align: center;
  font-weight: lighter;
}

#listeVille {
  font-family: "Digital-medium", "Lucida Grande", "Trebuchet MS", "Lucida Sans", "Lucida Sans Unicode", sans-serif;
  display: block;
  text-transform: uppercase;
  font-size: 1em;
  color: #fff !important;
  text-align: center;
  padding-top: 1.2em;
  margin-top: -1em;
  background-color: #000 !important;
  height: 15mm;
  font-weight: lighter;
}

.listeVille {
    font-family: "Digital-medium", "Lucida Grande", "Trebuchet MS", "Lucida Sans", "Lucida Sans Unicode", sans-serif;
  display: block;
  text-transform: uppercase;
  font-size: 1em;
  color: #fff !important;
  text-align: center;
  padding-top: 1.2em;
  margin-top: -1em;
  background-color: #000 !important;
  height: 15mm;
  font-weight: lighter;
}

#logoOtl {
    width: 8em;
    margin-top: 1.8em;
    float: left;
    margin-left: 0em;
}

#logoBretagne {
    float: right;
    margin-top: 1.8em;
    margin-right: 0em;
    width: 2em;
}

#logoOtf {
  float: left;
  transform: translateX(20%);
  width: 2.3em;
  margin-top:15px;
  margin-right: -50px;
}

#logoDq {
float: right;
transform: translateX(-10%);
width: 3.25em;
margin-top: -45px;
}





h2.chapter {
  font-weight: bold;
}

p {
  line-height: 1em;
  /*hyphens: auto;*/
}

span {
  margin: 0em;
}

ul {
  margin: 0em;
  padding: 0em;
}

li {
  margin: 0em;
  line-height: 1em;
}

.hide {
  display: none;
}


/* Ligne coloré première page -------------------------------------*/
.ligne {
  display: flex;
}

#violet {
  background-color: #5D92CD;
  width: 16.667%;
  display: inline-block;
  min-height: 3mm;
}
#rose {
  background-color: #C44BA1;
  width: 16.667%;
  display: inline-block;
  min-height: 3mm;
}
#bleu {
  background-color: #35BCC4;
  width: 16.667%;
  display: inline-block;
  min-height: 3mm;
}
#orange {
  background-color: #F79A3B;
  width: 16.667%;
  display: inline-block;
  min-height: 3mm;
}
#vert {
  background-color: #87C399;
  width: 16.667%;
  display: inline-block;
  min-height: 3mm;
}
#rose2 {
  background-color: #FB3099;
  width: 16.665%;
  display: inline-block;
  min-height: 3mm;
}


/*Méga-menu --------------------*/

/* Navbar container */


.navbarw3s {
  overflow: hidden;
  background-color: #333;
  font-family: Arial;
  display: flex;
  flex-direction: row;
}

/* Links inside the navbar */
.navbarw3s a {
  float: left;
  font-size: 16px;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

/* The dropdownw3s container */
.dropdownw3s {
  order: 1;
  overflow: hidden;
  min-width: 100px;
}

.button-bar {
  display: flex;
  flex-direction: row;
  order: 2;
  justify-content: flex-end;
  width: 100%;
}

.button-bar button {
  min-width: 80px;
  margin-left: 5px;
  background-color: #333;
  color: white;
  border:none;
}

.button-bar button:hover {
  background-color: #F79A3B;
}


/* dropdownw3s button */
.dropdownw3s .dropbtnw3s {
  font-size: 16px;
  border: none;
  outline: none;
  color: white;
  padding: 14px 16px;
  background-color: inherit;
  font: inherit; /* Important for vertical align on mobile phones */
  margin: 0; /* Important for vertical align on mobile phones */
}

.navbarw3s a:hover, .dropdownw3s:hover .dropbtnw3s {
  background-color: #F79A3B;
}

/* dropdownw3s content (hidden by default) */
.dropdownw3s-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  width: 100%;
  /*left: 0;*/
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1000;
  max-width: 1170px;
}

/* Mega Menu header, if needed */
.dropdownw3s-content .headerw3s {
  background: red;
  padding: 16px;
  color: white;
}

/* Show the dropdownw3s menu on hover */
.dropdownw3s:hover .dropdownw3s-content {
  display: block;
}

/* Create three equal columnw3ss that floats next to each other */
.columnw3s {
  float: left;
  width: 33.33%;
  padding: 10px;
  background-color: #ccc;
  height: 200px;
}

/* Style links inside the columnw3ss */
.columnw3s a {
  float: none;
  color: black;
  padding: 12px;
  text-decoration: none;
  display: block;
  text-align: left;
}

/* Add a background color on hover */
.columnw3s a:hover {
  background-color: #ddd;
}

/* Clear floats after the columnw3ss */
.roww3s:after {
  content: "";
  display: table;
  clear: both;
}

 /* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .columnw3s {
    width: 100%;
    height: auto;
  }

  #buttonCol1, #buttonCol2, #buttonCol4, #clean, #descriptif {
    display: none;
  }
}


@media screen and (max-width: 800px) {
  .columnw3s {
    max-width: 750px;
    height: auto;
  }
}












/*Boite des filtres*/

.box-filter {
  margin: 20px 0 20px 0;
  font-size: 12px;
}

.input-group-text {
  margin-top: 10px;
}

.input-group-text label {
  align-items: center;
  padding: 2px 5px 5px 5px;
  margin-bottom: 2px;
  font-size: 12px;
  color: #495057;
  text-align: center;
  white-space: nowrap;
  background-color: #e9ecef;
  border: 1px solid #ced4da;
}

.input-group-text label input {
  margin-right: 5px;
  position: relative;
  top: 4px;
  }

.btn-secondary {
  margin-top: 10px;
  background-color: #e9ecef;
}

label:hover {
  cursor: pointer;
}

input:hover {
  cursor: pointer;
}

/**
 * slider styles
 */
[data-jplist-control="slider-range-filter"]{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 12px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
}

.range-slider-value{
    width: 100px;
    box-sizing: border-box;
    padding: 0 5px;
}

.jplist-slider {
    width: 200px;
    height: 20px;
    background-color: #555;
    margin-right: 15px;
    margin-left: 15px;
    border-radius: .25rem;
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.jplist-slider::before {
    content: '';
    display: block;
    width: 100%;
    height: 3px;
    background: #fff;
    position: absolute;
    z-index: 100;
    left: 0;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    opacity: 0;
}

.jplist-slider-holder-1,
.jplist-slider-holder-2 {
    width: 20px;
    height: 100%;
    border-radius: .25rem;
    display: block;
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    z-index: 200;
    -webkit-transition: 0.3s background-color;
    -o-transition: 0.3s background-color;
    transition: 0.3s background-color;
    padding: 0;
    margin: 0;
    font-size: 0;
    line-height: 0;
}

.jplist-slider-holder-1 {
    background: #C44BA1;
}

.jplist-slider-holder-2 {
    background: #5D92CD;
}

.jplist-slider-holder-1:active,
.jplist-slider-holder-2:active{
    background: #5D92CD;
    box-shadow: 0px 0px 10px #fff;
}

.jplist-slider-range {
    width: 0;
    height: 20px;
    background: #ccc;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
    background-size: 1rem 1rem;
}

.jplist-items-number-0 > ul.pagination{
    display: none !important;
}

.jplist-items-number-0 > span[data-type="info"]{
    margin-left: 0 !important;
}


.resultats {
  margin-left: 10px;
}
.nb-resultats {
  margin-left: 10px;
}



/* Pour ajuster les encarts de la première page, avec la bonne marge :*/
.marginsupp {
  margin-bottom: 50px;
}



.mention {
  transform: translateY(0mm);
}

.mention p {
  font-size: 0.6em;
  text-align: center;
}

/* Couv 27.5 cm - 23 cm  */
.titre-couv {
  text-align: center;
  margin-top: 1em;
}

.text-couv {
  margin-top: 2em;
}

.titre-couv h2 {
    font-family: "Digital-medium", "Lucida Grande", "Trebuchet MS", "Lucida Sans", "Lucida Sans Unicode", sans-serif;
  font-size: 5em;
  letter-spacing: 0.1em;
  margin-bottom: 0;
}

.titre-couv sup {
  font-size: 0.5em;
}

.titre-couv h3 {
  font-family: "Digital-light", "Lucida Grande";
  display: block;
  font-weight: bold;
  text-transform: uppercase;
  font-size: 2.5em;
}

.titre-couv p {
  font-family: "Digital-light", "Lucida Grande";
  display: block;
  text-transform: uppercase;
  font-size: 2em;
}

.ligne-couv {
  position: absolute;
  bottom: 20px;
}

/* Ligne coloré première page -------------------------------------*/
.bandeau-nb {
  margin-top: -0.275em;
}


/*Couleurs (à utiliser pour faciliter le formattage*/
.couleur-background-plouescat {
  background-color:#FFA242;
}

.couleur-background-cleder {
  background-color:#FFA242;
}

.couleur-background-landivisiau {
  background-color:#9A8280;
}

.couleur-background-saint-pol {
  background-color:#5D92CD;
}

.couleur-background-roscoff {
  background-color:#3CC5BE;
}

.couleur-background-batz {
  background-color:#3CC5BE;
}


.couleur-texte-plouescat {
  color:#FFA242;
}

.couleur-texte-cleder {
  color:#FFA242;
}

.couleur-texte-landivisiau {
  color:#9A8280;
}

.couleur-texte-saint-pol {
  color:#5D92CD;
}

.couleur-texte-roscoff {
  color:#3CC5BE;
}

.couleur-texte-batz {
  color:#3CC5BE;
}

.couleur-texte-rose {
  color:#FB3199;
}

.couleur-texte-marron {
  color:#9A8280;
}

.couleur-texte-noir {
  color: black;
}


/*Formatage du bloc de légende*/

.bloc-hebergement-grand {
  display: inline-block;
  width: 181mm;
  height: 67mm;
  border-width:0.25px;
  border-style: solid;
  border-color:#333;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  overflow: hidden;
}

.picto-interpage {
  display: flex;
  max-height: 67mm;
  width: 100%;
  height: auto;
  padding: 5px;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: flex-start;
  font-size: 11px;
}

.picto-interpage figure {
  display: flex;
  align-items: center;
  margin: 3px;
}

.picto-interpage figcaption {
  width: 120px;
}


.picto-interpage img {
  height: 22px;
  margin: 3px 5px 2px 0px;
  background-color: #fff;
}


.picto-interpage figcaption {
  margin-top: 0;
  text-decoration: none;
  display: block;
}




/* Style principal restaurant (encart simples petit format) */

.bloc-restaurant-petit {
display: inline-block;
width: 88mm;
height: 59mm;
border-width: 0.5px;
border-style: solid;
border-color: #333;
margin-top: 10px;
margin-bottom: 10px;
margin-left: 10px;
margin-right: 6px;
overflow: hidden;
}

.row-1 {
  width: 100%;
  height: 6mm;
  /*background-color: #FB3199;*/
  display: flex;
  align-items: center;
  padding: 0 0 0 5px;
  font-size: 0.9em;
  text-transform: uppercase;
  color: #fff;
}

.row-1 p {
  color: #fff;
}

h4 {
  color: #fff;
  font-size: 0.9em;
  font-weight: bold;
  margin-right: 5px;
}

.jp-commune {
  white-space: nowrap;
}

.jp-commune::after {
  content: " > ";
  color: white;
}

.categorie {
  text-transform: uppercase;
  letter-spacing: 0px;
  /*font-family: Bebas Neue;*/
  font-size: 0.75em;
  line-height: 0.85;
  font-weight: 300;
}

.row-2 {
  background-color: #DEDEDE;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  height: 6mm;
  width: 100%;
  padding: 0 0 0 5px;
  font-size: 0.85em;
    border-bottom-width: 0.5px;
  border-bottom-style: solid;
  border-color:#333;
}

.row-2 p {
  margin-right: 2px;
}

.chef {
  font-weight: bold;
  font-size: 0.75em;
}

.row-3 {
  display: flex;
  height: 26mm;
}
.row-4 {
  display: flex;
  height: 14mm;
    border-bottom: 0.5px solid #333;
}

.descriptif {
  width: 57mm;
  overflow: hidden;
  padding: 5px;
}

.descriptif p {
  font-size: 8.25px;
  letter-spacing: -0.05px;
  hyphens: auto;
  text-align: justify;
}

p.infos-pratique {
  padding-top: 3px;
  color: grey;
  font-size: 7px;
  letter-spacing: -0.20px;
  hyphens: auto;
}

.descriptif-langue{
  display: flex;
  width: 100%;
  height: auto;
  padding: 7px 9px 7px 0px;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: flex-start;
}

.descriptif-langue figure {
  display: flex;
  align-items: start;
  margin-top: 5px;
}

.descriptif-langue img {
  height: 10px;
  padding: 2px;
  margin-top: 0px;
}

.descriptif-langue figcaption{
width: 240px;
}

.descriptif-langue figcaption p{
  text-decoration: none;
  display: block;
  font-size: 7px;
  color: #6a6a6a;
  width: 100%;
}

.descriptif strong {
color: #000 ;
}

.image {
  width: 31mm;
  height: 26mm;
}

.image img {
  width: 31mm;
  height: 26mm;
  object-fit: cover;
}



.bloc-info{
  width: 57mm;
  max-width: 57mm;
  height: 14mm;
  display: flex;
  flex-wrap: wrap;
  border: 0.5px solid #333;
  border-left: none;
  border-bottom: none;
  overflow: hidden;
}

.bloc-adresse{
  width: 35mm;
  height: 14mm;
  padding: 5px;
  font-size: 7.50px;
  letter-spacing: -0.05px;
  overflow: hidden;
  border-bottom: 0.25px solid #333;
}

.gras-noir {
  font-weight: bold;
  color: #000;
}

.bloc-adresse li{
  list-style: none;
  margin: 0;
  padding: 0;
}

.bloc-adresse ul{
  margin-left: 0;
  margin-bottom: 2px;
}

.maj {
  text-transform: uppercase;
}

.bloc-recommandation {
  flex:1;
  height: 14mm;
  border-left: 0.25px solid #333;
  border-bottom: 0.25px solid #333;
  padding: 5px 5px 5px 5px;
  font-size: 7.50px;
  letter-spacing: -0.10px;
  font-weight: bold;
}

.bloc-recommandation p:empty{
  border-left: 0.25px solid #fff;
}

.bloc-recommandation:empty {
  border-left: none;
}

.bloc-picto {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: flex-start;
  width: 31mm;
  height: 14mm;
  padding: 7px 0px 7px 0px;
  background-color: #DEDEDE;
  /*border: 1px solid #000;*/
}

.bloc-picto img {
  height: 14px;
  padding: 2px;
  margin: 2.50px;
  background-color: #fff;
  border-style: solid;
  border-width: 0.25px;
  border-color: black;
}

.bloc-picto p {
font-size: 8px;
}

.bloc-tarifs {
  width: 100%;
  height: 7mm;
  overflow: hidden;
  display: flex;
}

.bloc-tarifs span {
  display: flex;
  align-items: center;
  align-content: stretch;
  font-size: 7px;
  height: 7mm;
  max-height: 7mm;
  text-align: center;
  overflow: hidden;
  padding-left: 2px;
  padding-right: 2px;
  border-right: 0.25px solid #333;
  border-right-style: auto;
  /*  letter-spacing: -0.15px;*/
  line-height: 7px;
}

.bloc-tarifs span p {
  margin-left: auto;
  margin-right: auto;
}

.bloc-tarifs span:last-child {
  border-right: none;
}


.étoiles img {
  width: 8px;
  height: 8px;
  margin-bottom: 8px;
}

img.insolite {
  width: 60px;
  height: auto;
  margin-right: 10px;
  margin-left: auto;
}

.labels img {
  max-height: 18px;
  width: 7px;
}

.labels-2 {
  margin-left: auto;
}

.labels-2 img {
  height: 22px;
  width: auto;
  padding-right: 5px;
}

.th {
  padding-right: 5px;
}

.th img{
  padding-right: 0;
    height: 14px;
  width: auto;
}

.adresse1:empty {
  display: none;
}

.adresse2:empty {
  display: none;
}

.num-tel {
  white-space: nowrap;
}



/* Style alternatif restaurant (encart pub grand format) */

.bloc-restaurant-grand {
  display: inline-block;
  width: 108mm;
  height: 144mm;
  border-width:0.5px;
  border-style:solid;
  border-color:#333;
  margin-top: 2mm;
  margin-bottom: 1mm;
  margin-left: 0mm;
  margin-right: 0mm;
  overflow: hidden;
}

.row-chef {
  display: flex;
  height: 74mm;
    border-bottom: 0.5px solid #333;
}

.image-chef {
  width: 108mm;
  height: 74mm;
}

.image-chef img {
  width: 108mm;
  height: 74mm;
  object-fit: cover;
}




/* VISUEL ----------------------------------------------------*/

.img-remplissage {}

.visuel-x2 {
  display: inline-block;
  width: 108mm;
  height: 144mm;
  margin-top: 2mm;
  margin-bottom: 2mm;
  margin-left: 0mm;
  margin-right: 0mm;
  overflow: hidden;
  border-width:0.5px;
  border-style:solid;
  border-color:#333;
}

.visuel-x1-haut {
  display: inline-block;
  width: 108mm;
  height: 70mm;
  margin-top: 2mm;
  margin-bottom: 0.75mm;
  margin-left: 0mm;
  margin-right: 0mm;
  overflow: hidden;
  border-width:0.5px;
  border-style:solid;
  border-color:#333;
}


.visuel-x2 img {
  object-fit: cover;
    width: 108mm;
  height: 144mm;
}

.visuel-x1-haut img{
  object-fit: cover;
    width: 108mm;
  height: 70mm;
}

.trait-invisible {
  margin: 0px;
  color: #fff;
  border:none;
}


/* MEDIA PRINT ----------------------------------------------------*/


@media print {

  .box-filter {
  display: none;
  }
  .navbarw3s {
  display: none;
  }

  .hide {
    display: none;
  }


}