/*----------------------------------------------------------
	CRÉATION UN OEIL MODERNE Communication & Médias
	https://www.un-oeil-moderne.com/
----------------------------------------------------------*/

@import url(https://fontlibrary.org/face/hanken);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700);
@import url(https://use.fontawesome.com/releases/v5.7.2/css/all.css');

/*----------------------------------------------------------
	HEURE VAGABONDE STYLES
----------------------------------------------------------*/

body {
  font-family: 'Open Sans', sans-serif; 
  font-size: 1.1rem;
  line-height: 150%;
  color: #675850;
}
#g-main {
  padding: 0;
  background-image: url(/images/images_site/graphics/boussole-fond-de-page.png);
    background-repeat:no-repeat;
    background-position: center center;
    background-attachment: fixed;
}
strong {
  color: inherit;
}

/*----------------------------------------------------------
	HEADER
----------------------------------------------------------*/
.gantry-logo img {
    width: 363px;
    margin: 0;
}
.titreheader {
	font-family: 'HankenBook', sans-serif; 
	font-size: 2rem;
	font-weight: normal;
	font-style: normal;
	text-transform: uppercase;
	color: #675850;
	text-align: right;
	margin-top: 31px;
}
.sstrtheader {
	font-family: 'HankenBook', sans-serif; 
	font-weight: normal;
	font-size: 1.7rem;
	color: #5F9BAF;
	text-align: right
}

/*----------------------------------------------------------
	MENUS
----------------------------------------------------------*/
/* MENU HORIZONTAL */
.g-toplevel {
	font-family: 'HankenBook'; 
       font-weight: normal; 
       font-style: normal;
}
.g-main-nav .g-toplevel > li > .g-menu-item-container > .g-menu-item-content {
      font-size: 1.4rem;
}
#g-navigation .g-main-nav .g-toplevel > li:not(.g-menu-item-type-particle):not(.g-menu-item-type-module).active > .g-menu-item-container {
	color: #F29600;
}
.g-menu-item-subtitle {
    opacity: 1;
    font-size: 0.9rem;
    color: #675850;
}
#g-navigation {
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.dropdown {
	
}

/* MENU MOBILE */
.fa-fw {
      width: 1.28571429em;
      text-align: center;
      color: #675850;
}

/* MENU VERTICAL */
#vmenu {
      display: block;
      border: 2px solid #5F9BAF;
      margin-top: -1rem;
}
#vmenu h2 {
      margin-bottom: -1rem;
      margin-top: 2rem; 
}
#vmenu ul {
        
}
#vmenu li a {
       display: block;
       font-family: 'HankenBook', sans-serif;
       color: #5F9BAF;
       font-size: 1.2rem;
       line-height: 2rem;
       border-bottom: 1px solid #5F9BAF;
       padding: 15px 0 0 15px;
}
#vmenu a:before {
	content: "»";
	margin-right: 5px;
}
#vmenu li a:hover {
	color: #F29600;
}
#vmenu .active {
    background-color: #e6e6e6;
}
.menu_v {
	margin: 0 25px;
}

/*----------------------------------------------------------
	TITRES
----------------------------------------------------------*/
h1 {
	font-family: 'HankenBook', sans-serif; 
	font-size: 2.8rem;
	font-weight: normal;
	font-style: normal;
	text-transform: uppercase;
	color: #5F9BAF;
	line-height: 120%;
	padding: 15px;
}
/* h1 titre des destinations et tête d'articles */
.title {
	font-family: 'HankenBook', sans-serif;
	font-weight: normal;
	font-style: normal;
	color: #ffffff;
	background-color: #5F9BAF;
	line-height: 120%;
	text-align: center;
	padding: 20px 0;
}

h2 {
	font-family: 'HankenBook', sans-serif; 
	font-weight: normal;
	color: #5F9BAF;
	font-size: 1.8rem;
	line-height: 105%;
}

/* h2 titres blanc sur fond bleu > articles */
.textetitres {
	font-family: 'HankenBook', sans-serif;
	color: #ffffff;
	font-size: 1.9rem;
	background-color: #5F9BAF;
	padding: 15px;
}

h3 {
	font-family: 'HankenBook', sans-serif; 
	font-weight: normal;
	font-style: normal;
	color: #675850;
	line-height: 105%;
	font-size: 1.4rem;
	
}
h4 {
	font-family: 'Open Sans', sans-serif; 
	font-weight: bold;
	color: #5F9BAF;
	line-height: 125%;
	
}

/*----------------------------------------------------------
	STYLES CONTENUS
----------------------------------------------------------*/
.legende {
	font-family: 'Georgia', serif;
	font-size: 0.9rem;
	line-height: 125%;
	color: #877c6c;
	font-style: italic;
}
.img_caption {
    text-align: center !important;
  	font-family: 'Open Sans', sans-serif;
	font-size: 0.9rem;
	line-height: 10%;
  	color: #877c6c;
}

/* Introduction en-tête des textes */
.intro {
	font-family: 'HankenBook', sans-serif;
	color: #5F9BAF;
	font-size: 1.3rem;
}
/* Introduction centrée > en-tête des destinations */
.intro70 {
	font-family: 'HankenBook', sans-serif;
	color: #5F9BAF;
	font-size: 1.3rem;
	text-align: justify;
	display: block;
	width: 80%;
	margin: auto;
}

/* TEXTES EXERGUE */
/* Dans les textes, typo en blanc sur fond bleu */
.cartouche {
	background-color: #5F9BAF;
	color: #ffffff;
	padding: 15px 25px;
}
.cartouche .titre {
	font-family: 'HankenBook', sans-serif;
	color: #ffffff;
	font-size: 2rem;
}
/* Dans les textes, simple encadré bleu */
.encadre {
	border: 2px solid #5F9BAF;
	padding: 1rem;
	font-size: 1rem;
}
/* Avis de voyageurs texte */
blockquote p {
	font-family: Georgia, serif;
	font-size: 1.1rem;
	font-style: italic;
}

/*----------------------------------------------------------
	LIENS
----------------------------------------------------------*/
a:hover, a:active {
	color: #C0A375;
}
a img {
  opacity:1;
}
a img:hover {
  opacity:0.5;
}

/*----------------------------------------------------------
	IMAGES
----------------------------------------------------------*/
/* Images de fond des modules */
.imgmod {
  padding: 1rem;
}

/* Séparateur = boussole et filets, centré dans la colonne */
hr {
        display:block;
	border:none;
	clear: both;
	height:114px;
	background: url('https://www.heurevagabonde.fr/images/images_site/graphics/separateur.png');
	background-repeat: no-repeat;
	background-position: center;
}
.separateur {
	text-align: center;
	margin: 25px;
}

/* Légende dans les pop-ups */
#jcemediabox-popup-caption, #jcemediabox-popup-caption p {
	font-size: 0.8rem;
}

/*----------------------------------------------------------
	BREADCRUMB
----------------------------------------------------------*/
.breadcrumb {
    padding: 0; 
    margin: -35px 0;
    list-style: none;
    background: none;
}

/*----------------------------------------------------------
	STYLES MODULES IN PAGES
----------------------------------------------------------*/
/* h3 titre des modules, blanc sur fond bleu */
.moduletitre {
	font-family: 'HankenBook', sans-serif; 
	font-weight: normal;
	text-align: center;
	color: #ffffff;
	background-color: #5F9BAF;
	font-size: 2rem;
	line-height: 120%;
	padding: 15px 0;
}
.relateditems li {
	display: block;
       font-family: 'HankenBook', sans-serif;
       color: #5F9BAF;
       font-size: 1.2rem;
       line-height: 2rem;
       border-bottom: 1px solid #5F9BAF;
       padding: 15px 0 0 15px;
}
/* module de présentation des articles en relation */
.art_relative .g-item-title {
	font-size: 1.4rem;
}
.art_relative .intro {
	font-size: 1.1rem;
	margin-top: -5px;
}
/* Avis de voyageur - Destination */
.testidest {
	padding: 0 25px;
}
.testidestitle {
	font-size: 1.3rem;
	text-align: center;
	font-style: italic; 
}
.testidest .intro {
	font-size: 1.1rem;
}

/*----------------------------------------------------------
	STYLES MODULES HOMEPAGE
----------------------------------------------------------*/
/* homepage gauche */
.hpg {
	background-color: #5F9BAF;
}

.customhpg {
	background-repeat:no-repeat;
}

.hpgtxt {
	padding: 0 1.5rem;
	text-align: center;
	color: #ffffff;
}
.hpdrh2 {
	float: left
}

/*----------------------------------------------------------
	STYLES MODULES PAGE THEME
----------------------------------------------------------*/
.fdtransp {
	background-color: transparent !important;
}

/*----------------------------------------------------------
	STYLES PAGES TAGS
----------------------------------------------------------*/
.tagpage a img {
      float: left;
      margin: 0 1.5rem 0.8rem 0;
      max-width: 50%;
      
}
.tagpage .intro {
	line-height: 125%;
}

.label-info[href], .badge-info[href] {
    background-color: #C0A375;
    padding: 0.2rem 0.5rem;
    font-size: 0.8rem;
    text-transform: uppercase;
}
a.label:hover, a.label:focus, a.badge:hover, a.badge:focus {
    background-color: #75654d ;
    color: #ffffff;
    text-decoration: none;
    cursor: pointer;
}

.list-striped li:nth-child(odd), .list-striped dd:nth-child(odd), .row-striped .row:nth-child(odd), .row-striped .row-fluid:nth-child(odd) {
    background-color: transparent;
}

.list-striped li:hover, .list-striped dd:hover, .row-striped .row:hover, .row-striped .row-fluid:hover {
    background-color: transparent;
}
/*----------------------------------------------------------
	SLIDER MODULES
----------------------------------------------------------*/
/* Cartouche fond bleu boussole en fond > Slider > Pages articles */
.slcartouche {
	background-color: #5F9BAF;
	color: #ffffff;
	padding: 15px 25px;
	text-align: center;
	background-image: url(/heurvag/images/images_site/graphics/boussole_fd_pt.png);
	background-repeat:no-repeat;
}

.slcartouche .titre {
	font-family: 'HankenBook', sans-serif;
	color: #ffffff;
	font-size: 1.8rem;
	text-align: center;
	line-height: 120%;
}
.slcartouche .slbold {
	color: #ffffff;
	font-weight: bold;
}

/*----------------------------------------------------------
	TESTIMONIAUX
----------------------------------------------------------*/
/* Page présentation avis de voyageurs */
.testicat .intro {
	font-size: 1.1rem;
}
.testicat h2 a {
	font-size: 1.6rem;
}

/* Home Page */
#g-subfeature {
	padding: 0;
}
.testihp .intro {
	font-size: 1.1rem;
}
.testihp h2 {
	font-size: 1.4rem;
}
.testihp .g-array-item-image {
        float: left;
        margin-right: 15px;
}
.testihp .button {
        float: right;
}
/*----------------------------------------------------------
	PRÉSENTATION PAGE BLOG VOYAGES
----------------------------------------------------------*/
/* Page présentation blog */
.blogcat .intro {
	font-size: 1.2rem;
}
.blogcat h2 a {
	font-size: 1.6rem;
}
/*----------------------------------------------------------
	BOUTONS
----------------------------------------------------------*/
.button {
    font-family: 'Open Sans', sans-serif; 
    font-weight: bold;
    text-transform: uppercase;
    text-decoration: none;
    padding: 7px 22px;
    background: #F2B465;
    color: #fff;
}
.btn {
    font-family: 'Open Sans', sans-serif; 
    font-weight: bold;
    text-decoration: none;
    padding: 7px 22px;
    background: #F2B465;
    color: #fff;
    border: none;
}

.button:hover {
    background: #995E00;
    color: #fff;
}
.btn:hover {
    background: #995E00;
    color: #fff;
}

/*----------------------------------------------------------
	GRILLE DESTINATIONS
----------------------------------------------------------*/
.overlay-container {
  display: grid;
  grid-template-columns: repeat(auto-fill,minmax(270px,1fr));
  max-width: 1200px;
  margin: 0 auto;
}

.overlay-image
{
    position: relative;	
    width: 100%;
    text-align: center;
}

.carre {
	width: 273px; 
	height: 273px; 
	object-fit: cover;  	
}

.overlay-image .destitle
{
	position:absolute;
	z-index: 100;
	padding: 5px;
  	font-family: 'HankenBook', sans-serif;
	text-transform: uppercase;
	font-weight: bold;
  	font-size:2rem;
  	color:#fff;
 	text-shadow: 2px 2px 4px #000;
 	text-align: center;
  	bottom: 8px;
  	left: 8px;
	max-width: 270px;
	width: 100%;
}

a.carre {
    margin: 5px 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    display: block;
    background: transparent;
    text-decoration: none;
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
    bottom: 0;
    left: 0;
}

/*----------------------------------------------------------
	SLIDESHOW
----------------------------------------------------------*/
.slideshow .uk-overlay-panel>:last-child {
  text-align: center;
}
.slideshow h3 {
  font-size: 2rem;
  line-height: 150%;
}
.slideshow .g-slideshow-desc {
  font-size: 1.5rem;
}