/******************************************************

	Public site of Dulac Distribution: one stylesheet, served by AssetMapper.

	Mobile first: the rules outside any media query are those of a phone; each
	breakpoint only adds what changes from there. The rendering on tablets and
	computers is the one of the previous site, to the pixel.

	Breakpoints:
	- (min-width: 768px)  tablet and larger
	- (min-width: 960px)  computer
	- (min-width: 1060px) wide computer (width of the content: 1020px + 2 x 20px)

	Fonts:
	- text: 'Helvetica', 'Arial', sans-serif
	- titles and navigation: 'Helvetica', 'Myriad Pro', Calibri, Arial, sans-serif
	- headings: Ikaros, 'Myriad Pro', Calibri, Arial, sans-serif

	Colours: text #5a6369, red of the brand #FF2100

*******************************************************
	RESET
*******************************************************/

* { border:0; margin:0; padding:0; list-style:none; font-size:100%; outline:none; }
*, *:before, *:after { box-sizing:border-box; }
label, input[type="submit"], input[type="reset"], input[type="checkbox"], input[type="button"], input[type="radio"], select, button { cursor:pointer; }
input, button, textarea, select, .obj-btn { font-size:100%; font-family:'Helvetica', 'Myriad Pro', Calibri, Arial, sans-serif; color:#5a6369; padding:0 10px; border:1px solid #adb1b4; vertical-align:middle; height:40px; transition:border-color 0.2s ease; padding-top:1px; /* Fix font line-height issue */ }
input:hover, button:hover, textarea:hover, select:hover, input:focus, button:focus, textarea:focus, select:focus { border-color:#5a6369; }
select { padding:0; } option { padding-right:7px; }
textarea { height:auto; resize:vertical; padding:10px; }
input[type="image"], input[type="radio"], input[type="checkbox"] { height:auto; border:none; padding:0; }
input[type="image"]:hover, input[type="radio"]:hover, input[type="checkbox"]:hover, input[type="image"]:focus, input[type="radio"]:focus, input[type="checkbox"]:focus { border-color:transparent; }
input:not([type="radio"]):not([type="checkbox"]), button, select, textarea { -webkit-appearance:none; appearance:none; box-shadow:none; border-radius:0; }
sup { font-size:55%; vertical-align:super; line-height:1; }
address { font-style:normal; }
.mod_marge { margin-bottom:30px; }
#noticeNewsletter { color:red; }
#mod-search input, #email_newsletter { font-family:'Helvetica', 'Arial', sans-serif, Calibri, Arial, sans-serif; font-size:14px; }
.clear { clear:both; }
.center { text-align:center; }

/******************************************************
	FONTS
*******************************************************/

@font-face {
	font-family: SophieDulac;
	src: url("../fonts/SophieDulac-Bold-YkZNt9d.woff2") format('woff2');
	font-display: swap;
}

@font-face {
	font-family: Ikaros;
	src: url("../fonts/Ikaros-jlSAK6n.woff2") format('woff2');
	font-display: swap;
}

/******************************************************
	BASE
*******************************************************/

body { font:14px/1.3em 'Helvetica', 'Arial', sans-serif, Calibri, Arial, sans-serif; font-weight:500; color:#5a6369; min-width:320px; }

a { color:#5a6369; outline:none; }
a:hover { text-decoration:none; }

	/* Wrapper align */

.alignContent { position:relative; margin:0 auto; max-width:1060px; padding:0 10px; }

@media only screen and (min-width:768px) {
	.alignContent { padding:0 20px; }
}

	/* Fading effect */

.css-fadingEffect { transform:translateZ(0); transition:opacity 0.2s ease; }
.css-fadingEffect:hover { opacity:0.8; }

	/* Visible to screen readers only */

.visually-hidden { position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/******************************************************
	PAGINATION
*******************************************************/

.pagination { clear:both; text-align:center; font-size:18px; color:#a5a5a5; }
.pagination li { display:inline-block; padding:20px; font-family:'Helvetica', 'Myriad Pro', Calibri, Arial, sans-serif; }
.pagination a { color:#a5a5a5; text-decoration:none; }
.pagination .current a { text-decoration:none; color:#FF2100 !important; }
.pagination a:hover { text-decoration:none; }


/******************************************************
	LISTS
*******************************************************/

	/* Social list */

.obj-socialList { overflow:hidden; }
.obj-socialList-item { float:left; height:34px; }
.obj-socialList-link { display:block; width:50px; height:50px; background:url("../img/sprite-social-33nEX3Z.png") no-repeat; text-indent:-9999px; position:relative; top:-8px; }

.obj-socialList-link.link-tw-1 { background-position:0 -50px; }
.obj-socialList-link.link-fb-1 { background-position:-50px -50px; }
.obj-socialList-link.link-vm-1 { background-position:-100px -50px; }

.obj-socialList-link.link-tw-2 { background-position:0 -100px; }
.obj-socialList-link.link-fb-2 { background-position:-50px -100px; }
.obj-socialList-link.link-vm-2 { background-position:-100px -100px; }

.obj-socialList-link[class*="link-tw"]:hover { background-position:0 0; }
.obj-socialList-link[class*="link-fb"]:hover { background-position:-50px 0; }
.obj-socialList-link[class*="link-vm"]:hover { background-position:-100px 0; }

	/* Arrows list */

.obj-listArrows { font-size:13px; line-height:1.1em; }
.obj-listArrows li { position:relative; padding-left:10px; margin-top:0.5em; }
.obj-listArrows li:first-child { margin-top:0; }
.obj-listArrows li:before { content:url("../img/triangle-1-kk2ZsbJ.png"); position:absolute; left:0; top:0; }
.obj-listArrows a { text-decoration:none; }
.obj-listArrows a:hover { text-decoration:underline; }

.listArrows-color-1 li,
.listArrows-color-1 a { color:#cccfd1; }
.listArrows-color-1 li:before { content:url("../img/triangle-3-4Cqr5mX.png"); }

.obj-listArrows-item.item-highlight { font-weight:600; text-transform:uppercase; color:#FF2100; }
.obj-listArrows-item.item-highlight:before { content:url("../img/triangle-2-bJPgTvr.png"); }
.obj-listArrows-item.item-release { font-size:12px; }

.obj-listArrows-item.item-alert { font-style:italic; color:#e5291d; }
.obj-listArrows-item.item-alert:before { content:url("../img/triangle-4-ltkRozW.png"); }


	/* Inline list */

.obj-listInline > li { display:inline-block; vertical-align:top; }
.obj-listInline.listInline-4cols > li { width:49%; padding-right:1%; margin:0; margin-bottom:5px; }
.obj-listInline.listInline-middle > li { vertical-align:middle; }
.obj-listInline.listInline-smallSpacing > li { margin-left:10px; }
.obj-listInline.listInline-smallSpacing > li:first-child { margin-left:0; }

@media only screen and (min-width:768px) {
	.obj-listInline.listInline-4cols > li { width:24%; }
}

	/* Contact list */

.obj-contactsList { text-align:center; margin-bottom:-30px; margin-top:40px; line-height:1.2em; font-size:17px; }
.obj-contactsList-item { display:inline-block; width:50%; vertical-align:top; margin-bottom:40px; }
.obj-contactsList-item dt { font-family:Ikaros, 'Myriad Pro', Calibri, Arial, sans-serif; text-transform:uppercase; color:#000; margin-bottom:10px; }
.obj-contactsList-item dd { font-family:'Helvetica', 'Myriad Pro', Calibri, Arial, sans-serif; color:#FF2100; }
.obj-contactsList-item dd a { color:inherit; text-decoration:none; }
.obj-contactsList-item dd a:hover { text-decoration:underline; }

@media only screen and (min-width:768px) {
	.obj-contactsList-item { width:24.50%; margin-bottom:50px; }
}

	/* Search results */

.obj-textContent .news { margin-bottom:40px; }
.search-result-link { color:#000; text-decoration:none; }

/******************************************************
	BANNER / SECTION
*******************************************************/

	/* Banner: the picture for phones is an <img>, the one for computers a background
	   given by the page in --banner-image. */

.obj-banner { position:relative; }
.obj-banner .alignContent { height:100%; }
.obj-banner-iframe { position:absolute; }
.obj-banner-mobileImg { display:block; width:100%; height:auto; }
.obj-banner-thumbs { font-family:'Helvetica', 'Myriad Pro', Calibri, Arial, sans-serif; text-transform:uppercase; top:20px; right:65px; background:#FF2100; color:#fff; z-index:500; padding:5px; letter-spacing:1px; font-size:12px; }

@media only screen and (min-width:768px) {
	.obj-banner-thumbs { background:#FF2100; padding:10px; font-size:25px; }
}

@media only screen and (min-width:960px) {
	.obj-banner { height:600px; background:transparent var(--banner-image, none) no-repeat center center; }
	.ui-sliderBanner .obj-banner { background-size:cover; }
	.obj-banner-mobileImg { display:none; }
}

	/* Section */

.obj-section { margin-bottom:40px; }
.obj-section-description { margin-bottom:25px; }

@media only screen and (min-width:768px) {
	.obj-section { margin-bottom:50px; }
}

	/* Header page */

.obj-headerPage { display:table; width:100%; padding:30px 0; }
.obj-headerPage-title,
.obj-headerPage-desc { display:block; vertical-align:top; }
.obj-headerPage-title { text-align:center; }
.obj-headerPage-title + .obj-headerPage-desc { padding-left:0; margin-top:20px; vertical-align:middle; }

@media only screen and (min-width:768px) {
	.obj-headerPage { padding:50px 0; }
	.obj-headerPage-title,
	.obj-headerPage-desc { display:table-cell; }
	.obj-headerPage-title { text-align:inherit; }
	.obj-headerPage-title + .obj-headerPage-desc { padding-left:40px; margin-top:0; }
}

@media only screen and (min-width:960px) {
	.obj-headerPage-title + .obj-headerPage-desc { padding-left:120px; }
}

/******************************************************
	TITLES
*******************************************************/

	/* Section */

.obj-titleSection { position:relative; font-family:'Helvetica', 'Myriad Pro', Calibri, Arial, sans-serif; font-weight:normal; font-size:26px; line-height:0.7em; color:#FF2100; border-bottom:1px solid #FF2100; margin-bottom:20px; }
.obj-titleSection-mask { background:#fff; padding-right:20px; text-transform:uppercase; }
.obj-titleSection img { max-width:200px; height:auto; }

.titleSection-tw:before { content:''; position:absolute; bottom:-5px; right:0; background:#fff url("../img/twitter-big-oKOrPJq.png") no-repeat right center; width:58px; /*48 + spacing*/ height:39px; }
.titleSection-big { text-align:center; }
.titleSection-big .obj-titleSection-mask { padding-left:20px; }

@media only screen and (min-width:768px) {
	.obj-titleSection { font-size:30px; margin-bottom:25px; }
	.obj-titleSection img { max-width:none; }
	.titleSection-big { font-size:40px; }
}

	/* Content */

[class*="obj-title-h"] { color:#000; font-family:Ikaros, 'Myriad Pro', Calibri, Arial, sans-serif; font-weight:normal; text-transform:uppercase; line-height:1em; }
.obj-title-h1 { font-size:34px; }
.obj-title-h2 { font-size:26px; }
.obj-title-h3 { font-size:20px; }
.obj-title-h4 { font-size:16px; }

@media only screen and (min-width:768px) {
	.obj-title-h1 { font-size:48px; }
	.obj-title-h2 { font-size:30px; }
}

/******************************************************
	BUTTONS / LINKS
*******************************************************/

	/* Buttons */

.obj-btn { cursor:pointer; display:inline-block; text-decoration:none; white-space:nowrap; line-height:38px; /*40-2*border*/ padding-left:15px; padding-right:15px; border-color:#000; background:#000; color:#fff; font-size:16px; transition:all 0.2s ease; }
.obj-btn:hover { background:#FF2100; color:#fff; border-color:#FF2100; }

input.obj-btn,
button.obj-btn { line-height:inherit; }
button.obj-btn.btn-full { line-height:38px; }

.obj-btn.btn-medium { font-size:20px; }
.obj-btn.btn-big { font-size:24px; }
.obj-btn.btn-full { width:100%; text-align:center; padding-left:0; padding-right:0; }

.obj-btn.btn-color-1 { background:#FF2100; border-color:#FF2100; }
.obj-btn.btn-color-1:hover { background:#fff; color:#FF2100; }

.obj-btn.btn-noHeight { height:auto; line-height:1em; padding:10px; padding-top:11px; white-space:normal; }

	/* Links */

.obj-link { font-family:'Helvetica', 'Myriad Pro', Calibri, Arial, sans-serif; font-weight:normal; font-size:14px; white-space:nowrap; color:#FF2100; text-decoration:none; }
.obj-link:before { content:url("../img/triangle-2-bJPgTvr.png"); margin-right:4px; }
.obj-link:hover { text-decoration:underline; }


.obj-link.link-back { font-size:16px; }
.obj-link.link-back:before { content:url("../img/picto-back-F9LoD2B.png"); vertical-align:middle; margin-right:7px; }

	/* Footer button */

.obj-btnFooter { position:relative; display:table; margin:0 auto; }
.obj-btnFooter > * { display:inline-block; vertical-align:middle; }
.obj-btnFooter-abs { position:absolute; top:50%; transform:translateY(-50%); }
.obj-btnFooter-abs.abs-right { left:100%; margin-left:20px; }

/******************************************************
	CONTENT
*******************************************************/

	/* Text block */

.obj-textContent p { margin-bottom:0.8em; }
.obj-textContent strong { font-weight:600; color:#333; }
.obj-textContent > *:last-child { margin-bottom:0; }
.obj-textContent a { color:#FF2100; }

/* Pictures inserted in rich texts (logos of partners under a synopsis…) never overflow the page. */
.obj-textContent img { max-width:100%; height:auto !important; }

.textContent-style-1 { font-size:15px; text-align:center; line-height:1.3em; }
.textContent-style-1.left { text-align:left; }
.textContent-spacing-1 { margin:20px 0; }

	/* Thumb */

.obj-thumb-pic { display:block; position:relative; }
.obj-thumb-pic img { display:block; width:100%; height:auto; }
.obj-thumb-pic.pic-play:before,
.obj-thumb-pic.pic-play:after { content:''; position:absolute; transition:opacity 0.2s ease; }
.obj-thumb-pic.pic-play:before { top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); }
.obj-thumb-pic.pic-play:after { width:52px; height:52px; top:50%; margin-top:-26px; left:50%; margin-left:-26px; background:url("../img/picto-play-tdkEOfs.png"); }
.obj-thumb-link { text-decoration:none; }
.obj-thumb-link:hover .obj-thumb-pic.pic-play:before,
.obj-thumb-link:hover .obj-thumb-pic.pic-play:after { opacity:0.4; }
.obj-thumb-title { margin-top:10px; text-align:center; display:block; }

	/* Contact */

.obj-contact { display:table; width:100%; }
.obj-contact-infos,
.obj-contact-list { display:block; vertical-align:bottom; }
.obj-contact-list { white-space:nowrap; text-align:left; color:#FF2100; font-weight:600; margin-top:10px; }
.obj-contact-list li { display:inline-block; margin-left:40px; }
.obj-contact-list li:first-child { margin-left:0; }
.obj-contact-list li:before { margin-right:10px; display:inline-block; vertical-align:middle; }
.obj-contact-list .contact-tel:before { content:url("../img/picto-tel-wTl2wtx.png"); }
.contact-map { min-height:440px; width:100%; overflow:hidden; }
.contact-map img { max-width:none !important; background:none !important; }

@media only screen and (min-width:960px) {
	.obj-contact-infos,
	.obj-contact-list { display:table-cell; }
	.obj-contact-list { text-align:right; padding-left:20px; margin-top:0; }
}

/******************************************************
	FORM
*******************************************************/

.field-full { width:100%; }
.field-size-1 { font-size:19px; }

.form-section { margin-bottom:10px; }

.form-btnInside { display:table; width:100%; border:0.10em solid #adb1b4; transition:border 0.2s ease; }
.form-btnInside:hover { border-color:#5a6369; }
.form-btnInside-field,
.form-btnInside-btn { display:table-cell; vertical-align:middle; }
.form-btnInside-field { max-width:1px; width:100%; }
.form-btnInside-field input { border:0; height:38px; width:100%; }
.form-btnInside-btn input { margin:0 10px; }

/******************************************************
	LAYOUT
*******************************************************/

	/* Grid table: "grid-mobile-1column" stacks its cells on phones */

.grid-table { display:table; width:100%; }
.grid-table.table-fixed { table-layout:fixed; }
.grid-cell { display:table-cell; vertical-align:top; padding-left:40px; }
.grid-cell:first-child { padding-left:0 !important; }

.table-spacing-20 .grid-cell { padding-left:20px; }
.table-spacingMobile-5 > .grid-cell { padding-left:5px; }

.grid-mobile-1column,
.grid-mobile-1column > .grid-cell { display:block; }
.grid-mobile-1column > .grid-cell { padding-left:0; margin-bottom:30px; }

.cell-full { max-width:1px; width:100%; }
.cell-noWrap { white-space:nowrap; }

@media only screen and (min-width:768px) {
	.table-spacingMobile-5 > .grid-cell { padding-left:20px; }
	.grid-mobile-1column { display:table; }
	.grid-mobile-1column > .grid-cell { display:table-cell; padding-left:40px; margin-bottom:0; }
	.cell-size-1 { width:280px; }
	.cell-size-2 { width:350px; }
}

	/* "modules-last": on phones, the newsletter comes after the page content, with room above it,
	   and the search module is left out (the search lives in the menu panel) */

.modules-last { display:flex; flex-direction:column; }
.modules-last > .alignContent { margin-left:0; margin-right:0; }
.modules-last > .top-modules { order:1; margin-top:50px; }
.top-modules > .grid-table > .grid-cell:first-child { display:none; }

@media only screen and (min-width:768px) {
	.modules-last { display:block; }
	.modules-last > .alignContent { margin-left:auto; margin-right:auto; }
	.modules-last > .top-modules { margin-top:0; }
	.top-modules > .grid-table > .grid-cell:first-child { display:table-cell; }
}

	/* Grid float */

.grid-wrapper:after { content:''; display:table; clear:both; }
.grid-wrapper { margin:0 -10px; margin-bottom:-20px; }
.grid-col { float:left; padding:0 10px; margin-bottom:20px; }
.grid-4cols { margin:0 -5px; }
.grid-4cols .grid-col { width:50%; padding:0 5px; margin-bottom:10px; }

@media only screen and (min-width:768px) {
	.grid-4cols { margin:0 -10px -20px; }
	.grid-4cols .grid-col { width:25%; padding:0 10px; margin-bottom:20px; }
}

	/* Float layout: columns side by side from 960px */

.cols-wrapper:after { content:''; display:table; clear:both; }
.col-left, .col-right { width:100%; margin-bottom:30px; }
.cols-wrapper:last-child .col-left:last-child,
.cols-wrapper:last-child .col-right:last-child { margin-bottom:0; }

@media only screen and (min-width:768px) {
	.col-left, .col-right { margin-bottom:40px; }
	.cols-wrapper:last-child .col-left:last-child,
	.cols-wrapper:last-child .col-right:last-child { margin-bottom:0; }
}

@media only screen and (min-width:960px) {
	.col-left, .col-right { width:auto; margin-bottom:0; }
	.col-left { float:left; }
	.col-right { float:right; }
	.col-right.col-spacing-1 { width:calc(100% - 265px); }
	.col-size-1 { width:225px; }
}

/******************************************************
	PRODUCT
*******************************************************/

	/* Product list: a one-film carousel on phones, a grid from 768px */

.productList-item.hidden { display:block; }
.productList-more { margin-top:20px; }

@media only screen and (min-width:768px) {
	.productList:after { content:''; display:table; clear:both; }
	.productList { margin:0 -5px; margin-bottom:-20px; padding-top:15px; }
	.productList-item { float:left; padding:0 5px; margin-bottom:20px; width:25%; }
	.productList-item.hidden { display:none; }
}

@media only screen and (min-width:960px) {
	.productList { margin:0 -20px; margin-bottom:-40px; }
	.productList-item { padding:0 20px; margin-bottom:40px; }
	.productList-more { margin-top:40px; }
}

	/* Product item */

.productItem-link { display:block; text-align:left; background:#fff; transition:box-shadow 0.2s ease; text-decoration:none; overflow:hidden; }
.productItem-nb { font-size:12px; margin-bottom:5px; }
.productItem-picture { position:relative; overflow:hidden; min-height:322px; }
.productItem-picture img { display:block; width:100%; max-width:225px; height:auto; margin:0 auto; }
.productItem-picture:before,
.productItem-picture:after { content:''; transition:opacity 0.2s ease; position:absolute; opacity:0; }
.productItem-picture:before { left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.8); }
.productItem-picture:after { background:url("../img/product-hover-YeUKfyP.png") no-repeat; width:187px; height:116px; left:50%; margin-left:-93.5px; top:50%; margin-top:-58px; }
.productItem-content { padding:15px 15px 0; }
.productItem-hgroup { height:85px; text-align:center; overflow:hidden; }
.productItem-hgroup .hgroup-title { line-height:0.9em; margin-bottom:5px; }
.productItem-hgroup .hgroup-from { font-weight:600; line-height:1.25em; }
.productItem-infos { font-size:13px; line-height:1.5em; height:7.5em; /* line-height*nblignes */ overflow:hidden; }
.productItem-infos li { margin:0; }

@media only screen and (min-width:768px) {
	.productItem-nb { display:none; }
	.productItem-content { padding:15px; }
	.productItem-hgroup .hgroup-title { font-size:18px; }
	.productItem-hgroup .hgroup-from { font-size:13px; }
}

@media only screen and (min-width:960px) {
	.productItem-hgroup .hgroup-title { font-size:20px; }
	.productItem-hgroup .hgroup-from { font-size:inherit; }
	.productItem-link:hover { box-shadow:0 0 40px rgba(0, 0, 0, 0.3); }
	.productItem-link:hover .productItem-picture:before,
	.productItem-link:hover .productItem-picture:after { opacity:1; }
}

/******************************************************
	NEWS
*******************************************************/

	/* News list: a one-item carousel on phones, a list from 768px, two columns from 960px */

.newsList-item.hidden { display:block; }

@media only screen and (min-width:768px) {
	.newsList { margin:0 0 -40px; }
	.newsList-item { display:inline-block; width:100%; padding:0; margin-bottom:40px; vertical-align:top; }
	.newsList-item.hidden { display:none; }
}

@media only screen and (min-width:960px) {
	.newsList { margin:0 -10px -40px; }
	.newsList-item { width:49.50%; padding:0 10px; }
}

	/* News item */

.newsItem { overflow:hidden; }
.newsItem-date { overflow:hidden; font-size:12px; margin-bottom:5px; }
.newsItem-pic { float:left; margin-right:8px; margin-bottom:5px; }
.newsItem-pic a { display:block; }
.newsItem-pic img { display:block; max-width:110px; height:auto; }
.newsItem-title { margin-bottom:3px; }
.newsItem-title a { text-decoration:none; }
.newsList .newsItem-title a { color:#000; }
.newsItem-from { font-weight:600; font-size:12px; margin-bottom:10px; }
.newsItem-desc { font-size:12px; margin-bottom:15px; }

@media only screen and (min-width:768px) {
	.newsItem-pic img { max-width:130px; }
}

/******************************************************
	UI
*******************************************************/

	/* Custom checkbox */

.ui-chk { display:inline-block; vertical-align:top; }
.ui-chk input[type="checkbox"] { position:absolute; opacity:0; width:1px; height:1px; }

.ui-chk label { display:block; position:relative; padding-left:20px; font-size:12px; user-select:none; }
.ui-chk label:before { content:''; position:absolute; top:3px; left:0; width:14px; height:11px; background:url("../img/sprite-chk-dzXaohK.png") no-repeat 0 bottom; }

.ui-chk label:hover,
.ui-chk input[type="checkbox"]:checked + label { color:#FF2100; }
.ui-chk input[type="checkbox"]:checked + label:before { background-position:0 top; }
.ui-chk input[type="checkbox"]:focus-visible + label { outline:2px solid #FF2100; outline-offset:2px; }
.ui-chk input:disabled + label { opacity:0.5; cursor:default; }

	/* Checkboxes tree */

.ui-chkTree .ui-chk label { font-size:13px; }
.ui-chkTree-main { font-weight:bold; text-transform:uppercase; }
.ui-chkTree-sub > li { margin-top:5px; margin-left:20px; }

	/* Visibility */

.hidden { display:none; }
.hidden-mobile { display:none; }

@media only screen and (min-width:768px) {
	.hidden-mobile { display:revert; }
}

/******************************************************
	PAGE FRAME
*******************************************************/

#global { min-height:100vh; display:flex; flex-direction:column; }
#center { flex-grow:1; margin-bottom:40px; padding-top:80px; /* fixed header of phones */ }

@media only screen and (min-width:768px) {
	#center { padding-top:0; }
}

/******************************************************
	HEADER
*******************************************************/

	/* Header: fixed at the top on phones */

#header { position:fixed; top:0; left:0; width:100%; z-index:9; background:#fff; box-shadow:rgba(0,0,0,0.6) 0 0 10px; }
#header-top { position:relative; height:80px; line-height:80px; text-align:center; padding:0 60px; }

@media only screen and (min-width:768px) {
	#header { position:relative; top:auto; left:auto; width:auto; z-index:auto; box-shadow:none; }
	#header-top { line-height:inherit; text-align:inherit; padding:0; }
}

	/* Logo */

#header-logo { display:inline-block; vertical-align:middle; }
#header-logo img { display:block; max-width:100%; height:auto; }

@media only screen and (min-width:768px) {
	#header-logo { position:absolute; left:0; bottom:30px; top:15px; display:block; }
}

	/* Tools: search and social links, from 768px */

#header-tools { display:none; position:absolute; right:0; bottom:30px; }
#header-search,
#header-social { display:inline-block; vertical-align:middle; }
#header-search .search-entry { height:30px; width:140px; border:0; border-left:2px solid #e1e1e1; font-family:Ikaros, 'Myriad Pro', Calibri, Arial, sans-serif; text-transform:uppercase; font-size:20px; }
#header-search .search-entry::placeholder { color:#d5d4d5; opacity:1; }
#header-search .search-button { vertical-align:middle; }
#header-social { margin-left:20px; }

@media only screen and (min-width:768px) {
	#header-tools { display:block; }
}

	/* Navigation: a sliding panel on phones, a bar from 768px */

#header-nav { text-align:center; padding:0 0 20px; background:#041622; }
#header-nav .nav-item { position:relative; display:block; padding-top:30px; margin-left:0; }
#header-nav .nav-item:first-child { padding-top:20px; }
#header-nav .nav-item:before { content:'\2022'; font-family:Arial, sans-serif; font-size:19px; position:absolute; top:5px; left:0; width:100%; display:inline-block; color:#979796; }
#header-nav .nav-item:first-child:before { display:none; }
#header-nav .nav-link { text-transform:uppercase; line-height:18px; color:#fff; text-decoration:none; font-size:16px; font-family:'Helvetica', 'Myriad Pro', Calibri, Arial, sans-serif; transition:color 0.2s ease; }
#header-nav .nav-link:hover,
#header-nav .nav-link.active { color:#FF2100; }

.mobilePanel-btn { position:absolute; top:50%; left:10px; cursor:pointer; display:block; width:40px; height:43px; margin-top:-21.5px; padding:0; border:0; background:transparent url("../img/sprite-navMobile-x2-eayDLLL.png") no-repeat center top / 40px 86px; }
.navOpen .mobilePanel-btn { background-position:center bottom; }
.mobilePanel-content { position:fixed; top:80px; left:-100%; bottom:0; width:100%; overflow:auto; transition:left 0.2s ease; }
.navOpen .mobilePanel-content { left:0; }
.mobilePanel-search { display:flex; gap:10px; padding:20px 20px 0; background:#041622; }
.mobilePanel-search-entry { flex:1; min-width:0; font-size:16px; /* 16px keeps iOS from zooming in */ background:#fff; border-color:#fff; border-radius:0; -webkit-appearance:none; appearance:none; }

@media only screen and (min-width:768px) {
	#header-nav { padding:12px 0 10px; /* Fix font line-height issue */ background:#2e2e2c; }
	#header-nav .nav-item { display:inline-block; padding-top:0; margin-left:13px; }
	#header-nav .nav-item:first-child { padding-top:0; margin-left:0; }
	#header-nav .nav-item:before { top:auto; left:-12px; width:auto; }

	.mobilePanel-btn { display:none; }
	.mobilePanel-search { display:none; }
	.mobilePanel-content { position:static; top:auto; left:auto; bottom:auto; width:auto; overflow:visible; transition:none; }
}

@media only screen and (min-width:960px) {
	#header-nav .nav-item { margin-left:18px; }
	#header-nav .nav-item:first-child { margin-left:0; }
	#header-nav .nav-item:before { left:-14px; }
}

/******************************************************
	FOOTER
*******************************************************/

#footer { background:#010f18 url("../img/footer-bg-uIHUeWs.jpg") no-repeat center center; background-size:cover; color:#fff; font-size:12px; }
#footer a { color:#cccfd1; text-decoration:none; }
#footer a:hover { text-decoration:underline; }
#footer-top { padding-top:40px; padding-bottom:30px; }

	/* Infos: centred, alone on phones and tablets */

#footer-infos { text-align:center; }
#footer-infos .infos-logo { margin-bottom:30px; }
#footer-infos .infos-desc { margin-bottom:25px; }
#footer-infos .infos-social { display:table; margin:0 auto; }

	/* Navigation: from 768px */

#footer-nav { display:none; }
#footer-nav .nav-list { overflow:hidden; margin:0 -15px; }
#footer-nav .nav-item { position:relative; float:left; width:25%; padding:0 15px; }
#footer-nav .nav-item:before { content:'\2022'; font-family:Arial, sans-serif; font-size:19px; position:absolute; color:#979796; display:none; }
#footer-nav .nav-item.item-sepa-1:before { left:-20%; }
#footer-nav .nav-item.item-sepa-2:before { left:-10%; }
#footer-nav .nav-link { display:inline-block; color:#fff; font-family:'Helvetica', 'Myriad Pro', Calibri, Arial, sans-serif; font-size:16px; margin-bottom:20px; }
#footer-nav .nav-sub li { font-size:12px; line-height:1.3em; }

@media only screen and (min-width:768px) {
	#footer-infos { margin-bottom:40px; }
	#footer-nav { display:block; }
}

@media only screen and (min-width:960px) {
	#footer-top { display:table; width:100%; }
	#footer-infos { display:table-cell; vertical-align:top; width:350px; margin-bottom:0; text-align:inherit; }
	#footer-infos .infos-logo { margin-bottom:10px; }
	#footer-infos .infos-social { display:block; margin:0; }
	#footer-nav { display:table-cell; vertical-align:top; padding-left:40px; }
}

@media only screen and (min-width:1060px) {
	#footer-nav .nav-item:before { display:inline; }
	#footer-nav .nav-item:first-child:before { display:none; }
}

	/* Copyright and partners: centred on phones */

#footer-copyright { border-top:1px solid #808080; padding:25px 0 20px 0; overflow:hidden; text-align:center; }
#footer-copyright .copyright-mention { margin-bottom:10px; }
#footer-copyright .copyright-nav li { display:inline-block; }
#footer-copyright .copyright-nav li:before { content:' - '; margin:0 2px; }
#footer-copyright .copyright-nav li:first-child:before { display:none; }
/* Touch targets of at least 24px on phones */
#footer-copyright .copyright-nav a { display:inline-block; padding:6px 0; }

#footer-partenaires { padding:0 0 25px 0; overflow:hidden; text-align:center; }
#footer-partenaires .partenaires-nav li { display:inline-block; }
#footer-partenaires .partenaires-nav li:before { content:'    '; margin:0 2px; }
#footer-partenaires .partenaires-nav li:first-child:before { display:none; }

@media only screen and (min-width:768px) {
	#footer-copyright,
	#footer-partenaires { text-align:inherit; }
	#footer-copyright .copyright-mention { float:left; margin-bottom:0; }
	#footer-copyright .copyright-nav { float:right; }
	/* Inline padding: a 24px tall target without moving the line. */
	#footer-copyright .copyright-nav a { display:inline; padding:5px 0; }
	#footer-partenaires .partenaires-nav { float:right; }
}

/******************************************************
	FILM PAGE
*******************************************************/

	/* Header */

.movieView-header { padding-top:30px; padding-bottom:0; }
.movieView-hgroup { text-align:center; margin-bottom:30px; }
.movieView-hgroup .hgroup-title { margin-bottom:15px; }
.movieView-hgroup .hgroup-from { font-weight:600; font-size:16px; }

.movieView-poster { display:none; margin-top:-130px; margin-bottom:20px; box-shadow:0 0 30px rgba(0, 0, 0, 0.2); }
.movieView-poster img { display:block; }
.movieView-logo { width:120px; }

.movieView-external { font-weight:600; text-align:center; }
.movieView-external li:not(:first-child) { margin-top:5px; }
.movieView-external a { text-decoration:none; }
.movieView-external a:hover span { text-decoration:underline; }
.movieView-external .external-img,
.movieView-external .external-source { display:inline-block; vertical-align:middle; }
.movieView-external .external-img { margin-right:5px; }

@media only screen and (min-width:768px) {
	.movieView-hgroup { margin-bottom:50px; }
	.movieView-hgroup .hgroup-from { font-size:20px; }
}

@media only screen and (min-width:960px) {
	.movieView-header { padding-top:50px; padding-bottom:30px; }
	.movieView-poster { display:block; }
	.movieView-external { text-align:inherit; }
}

	/* Downloads */

.movieView-download li a,
.movieView-download li a:hover { font-size:13px; text-decoration:none; }
.movieView-download li a span { font-size:10px; }
.download-all { border:0; height:auto; padding:0; background:none; cursor:pointer; }
.download-size { color:#6f777c; white-space:nowrap; }
.download-status { margin-top:15px; text-align:center; color:#FF2100; }
.download-status:empty { display:none; }
#btnAllDl { padding-top:10px; display:block; text-align:center; }
#btnAllDl .obj-btn span { font-size:15px; }
/* "Tout télécharger" under the button on phones, beside it from 768px */
#btnAllDl .obj-btnFooter-abs { position:static; display:block; margin:15px auto 0; transform:none; }

@media only screen and (min-width:768px) {
	#btnAllDl { display:table; text-align:inherit; }
	#btnAllDl .obj-btnFooter-abs { position:absolute; display:inline-block; margin:0 0 0 20px; transform:translateY(-50%); }
}

	/* Details: role and name on one line until 960px */

.movieView-details { font-size:14px; }
.movieView-details .details-item { margin-bottom:30px; }
.movieView-details .details-item:last-child { margin-bottom:0; }
.movieView-details .details-title { font-weight:600; color:#313c44; font-size:20px; text-transform:uppercase; margin-bottom:15px; text-align:center; }
.movieView-details .details-list > li:not(:last-child) { margin-bottom:5px; }

@media only screen and (min-width:768px) {
	.movieView-details .details-title { text-align:inherit; }
}

@media only screen and (min-width:960px) {
	.movieView-details { font-size:13px; }
	.movieView-details .details-title { font-size:15px; }
	.movieView-details .details-role { display:block; }
}

	/* Extract pictures: uploaded or taken from Vimeo / YouTube, always in the same frame */

.movieView-teasing .obj-thumb-pic img { aspect-ratio:175 / 130; object-fit:cover; }

	/* Badge of the banner */

.owl-vignette { display:none; position:absolute; height:50px; width:92%; margin-top:-25px; text-align:right; top:10%; cursor:pointer; color:#fff; text-decoration:none; font-size:25px; font-family:SophieDulac, 'Myriad Pro', Calibri, Arial, sans-serif; }
.owl-vignette span { font-family:SophieDulac, 'Myriad Pro', Calibri, Arial, sans-serif; background:#FF2100; color:#fff; padding:5px; letter-spacing:1px; }

@media only screen and (min-width:768px) {
	.owl-vignette { display:block; }
}

/******************************************************
	TWITTER MODULE
*******************************************************/

#mod_twitter .obj-textContent.obj-col { margin-bottom:10px; }

/******************************************************
	CAROUSELS
	Native horizontal scrolling with scroll snap; assets/site/site.js adds the controls.
	Slides per page and gap: --carousel-items and --carousel-gap.
*******************************************************/

.carousel-track { display:flex; align-items:flex-start; gap:var(--carousel-gap, 0px); overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-width:none; }
.carousel-track::-webkit-scrollbar { display:none; }
.carousel-track > * { flex:0 0 calc((100% - (var(--carousel-items, 1) - 1) * var(--carousel-gap, 0px)) / var(--carousel-items, 1)); min-width:0; scroll-snap-align:start; }

.carousel-prev,
.carousel-next { position:absolute; width:21px; height:30px; padding:0; border:0; background:url("../img/sprite-arrows-AJGKC0K.png") no-repeat; cursor:pointer; transition:opacity 0.2s ease; }
.carousel-prev { background-position:left center; }
.carousel-next { background-position:right center; }

@media only screen and (min-width:960px) {
	.carousel-prev:hover,
	.carousel-next:hover { opacity:0.8; }
}

/* Slides and their images get their own compositing layer, as with the previous carousel:
   image resampling is otherwise not identical to the pixel. */

.ui-sliderBanner .carousel-track > *,
.ui-sliderNews .carousel-track > * { backface-visibility:hidden; }
.ui-sliderBanner .carousel-track img,
.ui-sliderNews .carousel-track img { display:block; width:100%; transform-style:preserve-3d; }

	/* Banner: dots of at least 24px to the touch on phones, 8px apart from 768px */

.ui-sliderBanner.carousel { position:relative; z-index:1; }
.ui-sliderBanner .carousel-dots { position:absolute; bottom:2px; left:0; width:100%; text-align:center; }
/* The dot is drawn by ::before, so the enlarged active dot never grows its touch target over its neighbours. */
.carousel-dot { position:relative; display:inline-block; vertical-align:middle; box-sizing:content-box; width:8px; height:8px; padding:8px; border:0; background:none; cursor:pointer; }
.carousel-dot:before { content:''; position:absolute; top:8px; left:8px; width:8px; height:8px; border-radius:50%; background:#515150; transition:transform 0.2s ease; }
.carousel-dot.active:before { background-color:#fff; transform:scale(1.4); }

@media only screen and (min-width:768px) {
	.ui-sliderBanner .carousel-dots { bottom:10px; }
	.carousel-dot { padding:0; margin-left:8px; }
	.carousel-dot:before { top:0; left:0; }
	.carousel-dot:first-child { margin-left:0; }
}

	/* News of the home page: two per page from 1024px */

.ui-sliderNews.carousel:not(.carousel-mobile) { position:relative; z-index:1; padding:0 30px; }
.ui-sliderNews .carousel-prev,
.ui-sliderNews .carousel-next { top:70px; }
.ui-sliderNews .carousel-prev { left:0; }
.ui-sliderNews .carousel-next { right:0; }

@media only screen and (min-width:1024px) {
	.ui-sliderNews:not(.carousel-mobile) { --carousel-items:2; --carousel-gap:20px; }
}

	/* News page and film lists: a one-item carousel on phones, a list or a grid from 768px */

.ui-sliderNews.carousel-mobile { position:relative; z-index:1; padding:0 30px; }
.ui-sliderProduct.carousel { position:relative; z-index:1; padding:0 30px; }
.ui-sliderProduct .productItem-link { max-width:225px; margin:0 auto; }
.ui-sliderProduct .carousel-track img { display:block; width:100%; transform-style:preserve-3d; }
.ui-sliderProduct .carousel-prev,
.ui-sliderProduct .carousel-next { top:50%; margin-top:-16px; }
.ui-sliderProduct .carousel-prev { left:50%; margin-left:-150px; }
.ui-sliderProduct .carousel-next { right:50%; margin-right:-150px; }

@media only screen and (min-width:768px) {
	.ui-sliderNews.carousel-mobile { position:static; z-index:auto; padding:0; }
	.ui-sliderProduct.carousel { position:static; z-index:auto; padding:15px 0 0; }
	.ui-sliderProduct .productItem-link { max-width:none; margin:0; }
	.ui-sliderProduct .carousel-track img { transform-style:flat; }
	.carousel-mobile .carousel-track,
	.ui-sliderProduct .carousel-track { display:contents; }
	.carousel-mobile .carousel-nav,
	.ui-sliderProduct .carousel-nav { display:none; }
}

	/* Trailer button and captions of the banners */

.owl-video-play-icon { position:absolute; height:60px; width:60px; left:50%; top:180px; margin-left:-30px; margin-top:-80px; background:url("../img/picto-play60-6ynD5vl.png") no-repeat; cursor:pointer; z-index:1; }
.owl-video-play-texte { display:none; position:absolute; height:50px; width:400px; margin-left:-200px; margin-top:-45px; text-align:center; left:50%; top:70%; cursor:pointer; color:#fff; text-decoration:none; font-size:20px; font-family:SophieDulac, 'Myriad Pro', Calibri, Arial, sans-serif; text-shadow:0px 5px 7px rgba(0, 0, 0, 0.75); }
.owl-video-play-infos { display:none; position:absolute; height:50px; width:92%; margin-top:-25px; text-align:right; top:95%; cursor:pointer; color:#fff; text-decoration:none; font-size:20px; font-family:Raleway, 'Myriad Pro', Calibri, Arial, sans-serif; text-shadow:0px 5px 7px rgba(0, 0, 0, 0.75); }

@media only screen and (min-width:768px) {
	.owl-video-play-icon { height:153px; width:153px; top:300px; margin-left:-76px; margin-top:-76px; background-image:url("../img/picto-play100-VmrhEBE.png"); }
	.owl-video-play-texte,
	.owl-video-play-infos { display:block; }
}

@media only screen and (min-width:960px) {
	.owl-video-play-icon { top:50%; }
}

/******************************************************
	DIALOGS
*******************************************************/

	/* Trailer */

.video-dialog { width:min(900px, 100vw - 40px); max-width:none; padding:0; margin:auto; border:0; background:transparent; overflow:visible; }
.video-dialog::backdrop { background:rgba(11, 11, 11, 0.8); }
.video-dialog-frame { aspect-ratio:16 / 9; background:#000; box-shadow:0 0 8px rgba(0, 0, 0, 0.6); }
.video-dialog-frame iframe { display:block; width:100%; height:100%; }
.video-dialog-close { position:absolute; top:-40px; right:-6px; width:44px; height:44px; padding:0; border:0; background:transparent; color:#fff; font:28px/44px Arial, sans-serif; opacity:0.65; }
.video-dialog-close:hover { opacity:1; }

	/* Picture gallery */

.gallery-dialog { max-width:min(860px, 100vw - 40px); padding:0; margin:auto; border:0; background:transparent; overflow:visible; }
.gallery-dialog::backdrop { background:rgba(11, 11, 11, 0.8); }
.gallery-dialog figure { margin:0; }
.gallery-dialog img { display:block; max-width:100%; max-height:calc(100vh - 120px); margin:0 auto; box-shadow:0 0 8px rgba(0, 0, 0, 0.6); }
.gallery-dialog figcaption { margin-top:8px; color:#ccc; font-size:13px; text-align:center; }
.gallery-prev,
.gallery-next { position:absolute; top:50%; width:21px; height:30px; margin-top:-15px; padding:0; border:0; background:url("../img/sprite-arrows-AJGKC0K.png") no-repeat; cursor:pointer; }
.gallery-prev { left:4px; background-position:left center; }
.gallery-next { right:4px; background-position:right center; }

@media only screen and (min-width:768px) {
	.gallery-prev { left:-36px; }
	.gallery-next { right:-36px; }
}

	/* Download */

.download-dialog { width:min(440px, 100vw - 40px); padding:30px 30px 25px; margin:auto; border:0; text-align:center; color:#5a6369; box-shadow:0 0 40px rgba(0, 0, 0, 0.3); }
.download-dialog::backdrop { background:rgba(11, 11, 11, 0.6); }
.download-dialog-icon { display:block; width:46px; height:46px; margin:0 auto 15px; }
.download-dialog-icon circle { fill:#FF2100; }
.download-dialog-icon path { fill:none; stroke:#fff; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.download-dialog-title { font-family:Ikaros, 'Myriad Pro', Calibri, Arial, sans-serif; text-transform:uppercase; color:#000; font-size:22px; margin-bottom:8px; }
.download-dialog-summary { color:#FF2100; font-weight:600; margin-bottom:12px; }
.download-dialog-text { font-size:13px; line-height:1.5em; margin-bottom:20px; }

/******************************************************
	COOKIE CONSENT: colours and font of the site
*******************************************************/

#cc-main {
	--cc-font-family: 'Helvetica', 'Arial', sans-serif;
	--cc-modal-border-radius: 0;
	--cc-btn-border-radius: 0;
	--cc-primary-color: #000;
	--cc-secondary-color: #5a6369;
	--cc-btn-primary-bg: #000;
	--cc-btn-primary-border-color: #000;
	--cc-btn-primary-hover-bg: #ff2100;
	--cc-btn-primary-hover-border-color: #ff2100;
	--cc-btn-secondary-bg: #fff;
	--cc-btn-secondary-color: #000;
	--cc-btn-secondary-border-color: #000;
	--cc-btn-secondary-hover-bg: #000;
	--cc-btn-secondary-hover-color: #fff;
	--cc-btn-secondary-hover-border-color: #000;
	--cc-toggle-on-bg: #ff2100;
	--cc-link-color: #FF2100;
}