/* linkto */
.link-slide {
	height: 100vh;
	background-size: cover;
	background-position: 50% 50%;
	font-family: 'Montserrat', sans-serif;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	color: black;
	margin-left: 200px;
}
.link-list {
	position: fixed;
	height: 100vh;
	display: flex;
	flex-flow: column;
	justify-content: center;
	left: 0;
	z-index: 1;
	width: 200px;
	background: white;
}
.scrollTo {
	color: black;
}
.link-item a {
	display: block;
	margin: 20px 0 20px 20px;
	transition: all ease 0.3s;
	transform-origin: left;
}
.link-item a:hover, .link-item.active a {
	margin-left: 30px;
}
.link-slide .thumb-box {
	justify-content: space-evenly;
}
.link-slide .thumb-text .details, .link-slide .thumb-text .title {
	margin: 0;
}
.link-slide .link {
	text-align: center;
}
.link-slide .link a {
	padding: 10px;
	background-color: #555555;
	color: #ededed;
	display: inline-block;
	text-transform: uppercase;
}
.link-slide .intro {
	max-width: 66%;
}
/* thumbto */
.thumb-slide {
	height: 100vh;
	background-size: cover;
	background-position: 50% 50%;
	font-family: 'Montserrat', sans-serif;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	color: black;
	margin-left: 150px;
}
.thumb-list {
	position: fixed;
	height: 100vh;
	display: flex;
	flex-flow: column;
	justify-content: center;
	left: 0;
	z-index: 1;
	width: 150px;
	background: white;
	/*box-shadow: 0 5px 5px #0000004d;*/
}
.scrollTo {
	color: black;
}
.thumb-item a {
	width: 150px;
	display: block;
	margin: 10px 0;
	transition: all ease 0.3s;
	transform-origin: left;
}
.thumb-item a:hover, .thumb-item.active a {
	transform: scale(1.1);
	box-shadow: 0 0px 5px rgba(0, 0, 0, 0.2);
}
.thumb-box {
	display: flex;
	height: 100vh;
	flex-direction: column;
	justify-content: center;
  	padding: 0 4vw;
}
.thumb-text {
	width: 50%;
}
.thumb-img {
	background-size: cover;
	background-position: 50% 50%;
	width: 50%;
	justify-content: end;
	align-content: center;
}
.thumb-text .details {
	margin: 30px 0;
}
.thumb-text .category {
	float: left;
}
.thumb-text .category::after {
	content: "";
	height: 8px;
	background-color: currentColor;
	width: 45%;
	display: block;
}
.thumb-text .title {
	font-size: 5vw;
	font-weight: 800;
	width: 100%;
	color: black;
	opacity: 0.7;
	line-height: 1em;
}
.thumb-img .link {
	text-align: center;
}
.thumb-img .link a {
	padding: 10px;
	background-color: #555555;
	color: #ededed;
	margin-bottom: 15vh;
	display: inline-block;
	text-transform: uppercase;
}
.double .img {
	max-width: 250px;
} 
/* PHOTOGRAPHY */
.photography {
	font-family: 'Raleway', sans-serif;
	color: #000;
  	height: 100vh;
}
.photography .image {
	height: 60%;
	padding: 0;
	background-position: 50% 50%;
	background-size: cover;
	background-repeat: no-repeat;
}
.photography .box {
	height: 100%;
	background-color: white;
	padding: 5vh 5vw;
}
.photography .intro {
	margin: 3vh 0 0 0;
	line-height: 1.8em;
}
.photography .category {
	background: black;
	color: white;
	padding: 4px 9px 4px 13px;
	text-transform: uppercase;
	font-size: 12px;
	letter-spacing: 5px;
	text-align: center;
}
.photography .title {
	font-family: 'Abril Fatface', serif;
	font-weight: 800;
	margin: 3vh 0 0 0;
	color: #fecc00;
	font-size: 16.25vw;
}
.photography .intro.tof {
	max-width: none;
}
.photography .tof img {
	margin: 0 0 5vw 0;
}
.photography .link {
	margin: 30px 0;
	text-align: right;
}
.photography .link a {
	color: #000000;
	font-weight: 600;
	text-transform: uppercase;
	font-size: 12px;
	letter-spacing: 2px;
	display: inline-block;
}
.photography .link a::after {
	width: 50%;
	height: 1px;
	background: black;
	content: "";
	display: block;
	right: -50%;
	position: relative;
	transition: all ease 0.5s;
}
.photography .link a:hover::after {
	right: -60%;
}
@media (min-width: 768px) {
.photography {
	font-size: 17px;
}
.photography .image {
	height: 100%;
}
.photography .title {
	margin: 8vh 5vw 0 -15vw;
	font-size: 6.25vw;
}
.photography .tof img {
	margin: 0 30px 30px 0;
    max-width: 25%;
	display: inline-block;
}
.photography .text-intro {
	max-width: 50%;
}
.sneackers .text-intro {
	max-width: 100%;
}
.photography .intro {
	max-width: 70%;
	margin: 5vh 0 0 0;
}
.photography .link {
	max-width: 90%;
}
}
/* people */
.dot-list a:hover, .dot-list.active a {
	transform: scale(1.2);
}
.dot-list a {
	height: 16px;
	width: 16px;
	background-color: rgba(0,0,0,0.3);
	display: block;
	margin: 12px 0;
	opacity: 0.4;
	box-sizing: content-box;
	transition: all ease 0.3s;
	transform-origin: center;
	transform-style: flat;
	border-radius: 100%;
}
.people {
	font-family: 'Raleway', sans-serif;
	color: #000;
  	height: 100vh;
}
.people .image {
	height: 50%;
	padding: 0;
	background-position: 50% 50%;
	background-size: cover;
	background-repeat: no-repeat;
}
.people .box {
	height: 100%;
	background-color: white;
	padding: 5vw;
}
.people .intro {
	margin: 3vh 0 0 0;
	line-height: 1.8em;
}
.people .category {
	background: black;
	color: white;
	padding: 4px 9px 4px 13px;
	text-transform: uppercase;
	font-size: 12px;
	letter-spacing: 5px;
	text-align: center;
}
.people .title {
	font-family: 'Abril Fatface', serif;
	font-weight: 800;
	margin: 3vh 0 0 0;
	color: #fecc00;
	font-size: 8.25vw;
}
.people .link {
	margin: 30px 0 0 0;
	text-align: right;
}
.people .link a {
	color: #000000;
	font-weight: 600;
	text-transform: uppercase;
	font-size: 12px;
	letter-spacing: 2px;
	float: right;
}
.people .link a::after {
	width: 50%;
	height: 1px;
	background: black;
	content: "";
	display: block;
	right: -50%;
	position: relative;
	transition: all ease 0.5s;
}
.people .link a:hover::after {
	right: -60%;
}
@media (min-width: 768px) {
.people {
	font-size: 17px;
}
.people .image {
	height: 100%;
}
.people .title {
	margin: 14vh 5vw 0 -15vw;
	font-size: 6.25vw;
}
.people .intro {
	max-width: 70%;
	margin: 5vh 0 0 0;
}
}
/* double */
.double {
	height: 100vh;
	background-size: cover;
	background-position: 50% 50%;
	font-family: 'Montserrat', sans-serif;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;
  	color: black;
}
.dots {
	position: fixed;
	height: 100vh;
	display: flex;
	flex-flow: column;
	justify-content: center;
	right: 2.5vw;
  	z-index:1;
}
.scrollTo {
	color: black;
}
.item-list a {
	height: 7px;
	width: 18px;
	background-color: rgba(0,0,0,0.5);
	display: block;
	margin: 12px 0;
	opacity: 0.4;
	box-sizing: content-box;
	transition: all ease 0.3s;
	transform-origin: right;
	transform-style: flat;
}
.item-list a:hover, .item-list.active a {
	transform: scale(2, 1);
}
.double .box {
	padding: 30px;
	display: flex;
	width: 100%;
	height: 100vh;
	flex-direction: column;
	justify-content: center;
	max-width: 80vw;
}
.double .details {
	margin: 30px 0;
}
.double .category {
	float: left;
}
.double .category::after {
	content: "";
	height: 8px;
	background-color: currentColor;
	width: 45%;
	display: block;
}
.double .title {
	font-size: 9vw;
	font-weight: 800;
	width: 100%;
	padding: 0 25vw 0 5vw;
	color: black;
	opacity: 0.7;
	line-height: 1em;
	margin: 5vh 0 15vh;
}
.double .link {
	text-align: right;
}
.double .link a {
	padding: 10px;
	background-color: rgba(255,255,255,0.3);
	color: black;
}
.double .img {
	max-width: 250px;
}
/* vertical */
.vertical {
	height: 100vh;
	background-size: cover;
	background-position: 50% 50%;
	font-family: 'Montserrat', sans-serif;
	padding: 0;
	color: #000;
}
.vertical .box {
	padding: 30px;
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
	background-color: rgba(255,2555,255,0.1);
	flex-direction: column;
	justify-content: center;
}
.vertical .box p {
	width: 100%;
	text-transform: uppercase;
	font-size: 12px;
}
.vertical .day {
	font-size: 92px;
	line-height: 0.8em;
	font-weight: 800;
	display: block;
}
.vertical .my {
	margin: 0 10px 0 0;
	text-transform: uppercase;
	font-size: 12px;
}
.vertical .category::after {
	content: "";
	height: 1px;
	background-color: currentColor;
	width: 45%;
	display: block;
}
.vertical .category {
	display: block;
	margin: 50px 0 0 0;
}
.vertical .title {
	font-size: 32px;
	font-weight: 800;
	width: 100%;
	margin: 10px 0 0 0;
}
.vertical .link {
	margin: 40px 0 0 0;
}
.vertical .link a {
	background-color: rgba(254, 204, 0, 0.6);
	padding: 4px 7px 3px;
	color: #000000;
	font-weight: 500;
}
/* BLOG 01 */
article.item.blog-01 {
    background-color: transparent;
}
.blog-01 .entry-image {
    height: 60vh;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    position: fixed;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
}
.blog-01 .entry-header {
    margin: 15vh 0 0;
	 text-align: center;
}
.blog-01 h1 {
    font-size: 50px;
    line-height: 1.2em;
    margin: 0 0 50px;
    padding: 0px;
    background: transparent;
    color: white;
    font-weight: normal;
    text-align: center;
    text-shadow: 0px 0px 20px #ffffff;
    font-style: italic;
}
.info-block {
    text-align: center;
    margin: 0 0 3vh 0;
}
.blog-01 .article-info {
    margin: 20px auto 4vh;
    text-align: center;
    border-top: 1px solid;
    display: inline-block;
    padding: 18px 0 0 0;
}
.blog-01 .article-info > dd {
    color: #000000;
    display: inline-block;
    font-size: 14px;
    font-weight: normal;
    margin: 0 8px;
    text-transform: none;
}
.body-blog {
	background: white;
	padding: 5vw;
	line-height: 1.7em;
	display: inline-block;
}
.avatar {
	display: block;
	margin: 0 auto;
	border-radius: 100%;
	max-width: 150px;
	border: 1px solid #fecc00;
}
/* FULLSCREEN */
/* a la agente */
.fullscreen {
	width: 100vw;
	height: 100vh;
	float: left;
	position: relative;
	background-position: 50% 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	background-size: cover;
}
.fullscreen::after {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	content: "";
	background-color: rgba(0,0,0,0.15);
}
.color-fullscreen {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	opacity: 0;
	z-index: 1;
	width: 0%;
	transition: all 1s ease;
}
.fullscreen:hover .color-fullscreen {
	opacity: 0.70;
	width: 100%;
}
.title-fullscreen {
	z-index: 9999;
	margin: 0 3vw;
	position: relative;
}
.title-fullscreen a {
	font-size: 3vw;
	text-transform: uppercase;
	line-height: 3.5vw;
}
.fullscreen:hover .title-fullscreen a {
	color: #000 !important;
	opacity: 1;
}
@media (max-width: 767px) {
.title-fullscreen {
	margin: 0 30px;
}
.title-fullscreen a {
	font-size: 3vh;
	line-height: 4vh;
}
}

.fullscreen:hover .title-fullscreen a::after {
  width: 100%;
}
.fullscreen .title-fullscreen a::after  {
	content: '';
	height: 100%;
	background: #FECC00;
	width: 0%;
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: -1;
	transition: all 1.3s ease;
}

/*JDFR MODULE TITLE*/
.jd18fr .sp-module .sp-module-title {
	margin: 0 0 30px 16px;
	font-size: 16px;
	text-transform: uppercase;
	font-weight: 600;
	color: #D0453D;
	padding-bottom: 6px;
	line-height: 1.3em;
}
.jd18fr .sp-module .sp-module-title::after {
	display: block;
	content: "";
	width: 50%;
	height: 5px;
	background: #ececec;
	margin: 4px 0 0 0;
}
/* JoomlaDay FR 2018 - Christian Bardin - Les overrrides de layout  */
/* module Joomla Derniers articles - sur base Helix3 de JoomShaper */
/* on reinitialise les styles Helix3 du module  */
.sp-module .latestnews > div {
    padding-bottom: 0;
    margin-bottom: 15px;
    border-bottom: none;
}
/* styles du titre article */
.title-jday {
    font-size: 16px;
    text-transform: uppercase;
    margin: 15px 0;
    font-weight: 600;
    border-bottom: 1px solid #ececec;
    padding-bottom: 5px;
}
/* styles des paragraphe et liens  */
p.intro-jday, .intro-jday a {
    margin: 0;
    line-height: 1.5em;
    font-weight: 500;
}
/* styles au survol des liens  */
.intro-jday a:hover {
    color: #000000;
}
/* BLOC IMAGE */
.image-jday {
    position: relative;
}
/* ETIQUETTE CATEGORIE */
.cat-jday {
    text-transform: uppercase;
    text-align: right;
    background: #d0453d;
    font-size: 14px;
    padding: 6px 9px;
    line-height: 1em;
    position: absolute;
    top: 15px;
    right: 0px;
    color: #ffffff;
    font-weight: 700;
}
/* BLOC IMAGE ET CATEGORIE AU SURVOL */
.news-jday * {
    transition: all ease 0.3s;
}
.image-jday img:hover {
    transform: scale(1.05);
}
.image-jday a:hover .cat-jday {
    right: -9px;
    top: 8px;
}
/* LIRE LA SUITE CUSTOM */
.link-jday {
	text-align: right;
	border-bottom: 9px solid #e9e9e9;
	margin: 0 0 15px 0;
}
.link-jday a {
    padding: 2px 5px;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 700;
    color: #f9c256;
}
.link-jday a:hover {
    color: #af322b;
}
/* END JDAY */
/* module latest news - base helix3 de joomshaper */

/* on reinitialise les styles du module  */
.sp-module .latestnews > div {
    padding-bottom: 0;
    margin-bottom: 15px;
    border-bottom: none;
}
/* styles du titre article */
.title-jug {
    font-size: 17px;
    text-transform: uppercase;
    margin: 15px 0;
    font-weight: 600;
}
/* styles des paragraphe et liens  */
p.intro-jug, .intro-jug a {
    margin: 0 0 10px;
    line-height: 1.5em;
    font-weight: 500;
}
.intro-jug a:hover {
    color: #000000;
}
/* ##### */

/*page full screen */
.fullpage #sp-main-body {
	display: none;
}
#sp-full-slice .row {
	margin: 0;
}
#sp-full {
    padding: 0;
}
/* a la agente */
.agente {
	width: 33.33333333%;
	height: 50vh;
	float: left;
	position: relative;
	background-position: 50% 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	background-size: cover;
}
.agente::after {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	content: "";
	background-color: rgba(0,0,0,0.15);
}
.color-agente {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	opacity: 0;
	z-index: 1;
}
.agente:hover .color-agente {
	opacity: 0.70;
}
.title-agente {
	z-index: 9999;
	margin: 0 3vw;
}
.title-agente a {
	font-size: 3vw;
	text-transform: uppercase;
	line-height: 3.5vw;
}
.agente:hover .title-agente a {
	color: #000 !important;
	opacity: 1;
}
@media (max-width: 767px) {
.agente {
	width: 100%;
	height: 50vh;
}
.title-agente {
	margin: 0 30px;
}
.title-agente a {
	font-size: 3vh;
	line-height: 4vh;
}
}
/* say */
.say-title a {
    font-size: 7vw;
    text-transform: uppercase;
    font-weight: 900;
    color: #00cfff;
    line-height: 1em;
    opacity: 1.3;
    text-shadow: 2.5vw 0px rgb(255, 241, 1);
    transition: all ease 0.6s;
}
.say-title a::after {
    content: attr(data-title);
    color: #ff0a99;
    position: absolute;
    top: 0;
    left: 2.5vw;
    opacity: 0.6;
    transform: matrix(-1, 0, 0, 1, 0, 0);
    text-align: right;
    text-shadow: 0 0 white;
}
.say-title a:hover {
    text-shadow: 0vw 0px rgb(255, 241, 1);
    color: #6d51c8;
}
.say-title a:hover::after {
    opacity: 0;
}
/* scratch */
.scratch-title a {
    font-size: 70px;
    text-transform: uppercase;
    font-weight: 900;
    color: red;
    line-height: 1em;
    opacity: 0.6;
    text-shadow: 10px 10px rgba(255,0,0,0.4), -10px -10px rgba(0,0,255,0.3);
}
.scratch-title a::after {
    content: attr(data-title);
    display: block;
    color: blue;
    position: absolute;
    top: 3%;
    left: 1%;
    opacity: 0.8;
    text-shadow: 2px 2px rgba(255,255,255,0.4);
}
.scratch-title a:hover {
    color: yellow;
    text-shadow: 4px 5px rgba(255,255,255,1);
    opacity: 0.6;
}
.scratch-title a:hover::after {
    text-shadow: -2px -7px green;
}
/* module category gallery short la belle electrique - base helix3 de joomshaper */

/* MODULE CAT GALLERY CARDS */
.title-short::before {
    content: "_ ";
}
.title-short {
    background: rgba(255, 255, 255, 0.7) none repeat scroll 0 0;
    min-height: 100px;
    padding: 20px;
    position: absolute;
    bottom: 20px;
    margin: 0 20px;
}
.day-short {
    background-color: black;
    color: white;
    padding: 0px 7px;
    text-transform: uppercase;
    position: absolute;
    right: 0;
    top: 10px;
    font-size: 12px;
    font-weight: 700;
}
.short .card {
	min-height: 1px;
	padding-left: 15px;
	padding-right: 15px;
	position: relative;
	float: left;
  	margin: 0 0 30px;

}
.short .image-short {
  	width: 100%;
    background-position: center center;
    background-size: cover;
    position: relative;
}
/* mobile */
@media (max-width: 768px) {
  .short .card {
      width: 100%;
  }
}
/* sm */
@media (min-width: 768px) {
  .short .card, .short .image-short {
      max-height: 250px;
      min-height: 250px;
  }
  .short .card {
      width: 50%;
  }
}
/* md */
@media (min-width: 992px) {
  .short .card:first-child {
      margin-left: 33.3333%;
  }
  .short .card {
      width: 33.3333%;
  }
}
/* lg */
@media (min-width: 1200px) {
  .short .card:first-child {
      margin-left: 25%;
  }
  .short .card {
      width: 25%;
  }
}
/* STYLE STEMPLATE */
#sp-header {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    box-shadow: unset;
    height: auto;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 99;
}
#sp-header .logo {
    height: auto;
    margin: 30px 0 0 30px;
    position: absolute;
}
/* MAIN MENU */
#offcanvas-toggler {
	background: #fecc00 url("../images/burgeur-white.png") no-repeat scroll center center;
	float: right;
	font-size: 20px;
	height: 32px;
	line-height: unset;
	margin: 30px;
	position: absolute;
	right: 15px;
	width: 32px;
	padding: 30px;
	border-radius: 100px;
}
#offcanvas-toggler > i {
    color: #000000;
    display: none;
}
.full-screen-ftop .offcanvas-menu {
    background-color: #fecc00;
}
.offcanvas-menu .offcanvas-inner .sp-module ul > li {
    border: medium none;
}
.full-screen-ftop .offcanvas-menu .offcanvas-inner .sp-module ul li a {
    color: #ffffff;
    display: inline-block;
    font-size: 36px;
    font-weight: 300;
    line-height: 1.5em;
    padding: 10px 0;
}
.full-screen-ftop .offcanvas-menu .close-offcanvas {
	background: rgba(255, 255, 255, 1) url("../images/close-yellow.png") no-repeat scroll center center;
	border: medium none;
	font-size: 20px;
	height: 32px;
	line-height: 1;
	padding-top: 0;
	right: 30px;
	top: 30px;
	width: 32px;
	padding: 30px;
	border-radius: 100px;
}
.close-offcanvas .fa.fa-remove {
    display: none;
} 
