blockquote, body, dd, dl, dt, fieldset, figure, h1, h2, h3, h4, h5, h6, hr, html, iframe, legend, li, ol, p, pre, textarea, ul{ margin:0; padding:0; } h1, h2, h3, h4, h5, h6{ font-size:100%; font-weight:normal; } ul{ list-style:none; } button, input, select, textarea{ margin:0; } html{ box-sizing:border-box; font-family:sans-serif; } *, *::after, *::before{ box-sizing:inherit; } img, video{ height:auto; max-width:100%; } iframe{ border:0; } table{ border-collapse:collapse; border-spacing:0; } td, th{ padding:0; text-align:left; } @font-face{ font-family:"barlow-regular"; font-weight:normal; src:url(/assets/fonts/Barlow-Regular.woff2?18f2f5707779b4ab7d75be55f63b75e9) format("woff2"), url(/assets/fonts/Barlow-Regular.woff?b01be197bee9b9a37cae8069396bf69c) format("woff"); } @font-face{ font-family:"barlow-bold"; font-weight:100; src:url(/assets/fonts/Barlow-Bold.woff2?8bb7d2508e1369c8e08b3da2c21bf55f) format("woff2"), url(/assets/fonts/Barlow-Bold.woff?a8de7b19e6b093ca3c454afe8fcb2019) format("woff"); } @font-face{ font-family:"cocon-regular"; font-weight:normal; src:url(/assets/fonts/cocon-regular-webfont.woff2?d9001c237a5e8ef80d7a13c348871d6e) format("woff2"), url(/assets/fonts/cocon-regular-webfont.woff?577e859a5070520903b40655753164e1) format("woff"); } html{ font-size:100%; } body{ font-size:18px; font-family:"barlow-regular", arial, sans-serif; line-height:1.4; } button{ border:0 none; background-color:transparent; cursor:pointer; } img{ width:100%; max-width:-webkit-max-content; max-width:-moz-max-content; max-width:max-content; } #frise-autoscroll{ position:absolute; width:100%; height:100%; } #frise-autoscroll .img-frise{ position:relative; width:-webkit-max-content; width:-moz-max-content; width:max-content; margin:0 auto; } #frise-autoscroll .img-frise .svg-mask{ position:-webkit-sticky; position:sticky; width:100%; height:100px; bottom:0; background-image:linear-gradient(to top, #ffffff, #ffffff, #ffffff, transparent); } #backtotop{ display:none; align-items:center; justify-content:center; position:fixed; bottom:20px; right:20px; width:40px; height:40px; border-radius:40px; background-color:#fccf1d; z-index:99; } #backtotop .arrow{ border:solid #fff; border-width:0 3px 3px 0; display:inline-block; padding:3px; } #backtotop .arrow.up{ transform:rotate(-135deg); } #search{ width:28px; height:28px; margin-left:25px; } ul.more{ margin-top:50px; } ul.more li{ align-items:center; position:relative; padding-left:25px; margin-bottom:30px; } ul.more li:last-of-type{ margin-bottom:0; } ul.more li p:first-of-type{ position:relative; } ul.more li:before{ content:""; position:absolute; left:0; top:15px; width:13px; height:13px; background-color:#222f5c; border-radius:50%; } ul.more li .label img{ width:100px; } ul.infos{ display:flex; justify-content:center; } ul.infos li{ justify-content:center; text-align:center; color:#222f5c; font-family:"barlow-bold", arial, sans-serif; } ul.infos span{ display:flex; justify-content:center; align-items:center; width:85px; height:85px; padding:20px; margin:20px auto; background-color:#fccf1d; border-radius:50%; } .offset-anchor{ position:relative; top:-100px; } .banner{ position:absolute; bottom:-1px; height:50px; width:100%; } .banner svg{ position:absolute; bottom:0; } @media screen and (min-width: 800px){ main{ padding-top:100px; } ul.more li p:first-of-type{ font-size:30px; } ul.infos li{ flex-basis:20%; } } @media screen and (max-width: 799px){ main{ padding-top:50px; } ul.more li p:first-of-type{ font-size:22px; } } .container.news .sectiontitle{ margin-bottom:25px; } .container.news .sectiontitle h2{ margin-bottom:0; } .container{ padding-top:60px; padding-bottom:60px; } @media screen and (min-width: 1200px){ .wrapper, .wrapper-m{ margin-left:auto; margin-right:auto; } .wrapper{ width:1170px; max-width:1170px; } .wrapper-m{ width:900px; max-width:900px; } } @media (max-width: 1199px){ .wrapper, .wrapper-m{ width:100%; max-width:100%; padding-left:25px; padding-right:25px; } } .align-center{ text-align:center; } .align-left{ text-align:left; } .align-justify{ text-align:justify; } .bold{ font-weight:bold; } .ttu{ text-transform:uppercase; } .has-bckg--grey{ background-color:#f5f5f5; } .is-flex{ display:flex; } .is-flex.vertical-center{ align-items:center; } .is-flex.horizontal-center{ justify-content:center; } .is-flex.start{ align-items:flex-start; } .is-flex.wrap{ flex-wrap:wrap; } .is-flex.space-between{ justify-content:space-between; } .is-small{ margin-top:35px; margin-bottom:35px; font-size:12px; } .p-rel{ position:relative; } .p-abs{ position:absolute; } .color-red{ color:#ff0400; } .color-blue{ color:#222f5c; } .color-yellow{ color:#fccf1d; } .font-size-medium{ font-size:45px; } @media screen and (min-width: 800px){ .is-flex .w50{ flex-basis:50%; } .is-flex .w50:nth-child(2){ margin-left:35px; } .is-flex .w100{ flex-basis:100%; } .is-flex .w100:nth-child(1){ padding-right:185px; } .is-flex .w100:nth-child(2){ margin-left:35px; } } @media screen and (max-width: 799px){ .is-flex{ flex-direction:column; } .blue-products.is-flex{ flex-direction:initial; justify-content:center; } .smrt-align-center{ text-align:center; } } p{ margin-bottom:10px; } h1, .page-subtitle{ margin-bottom:25px; } h1, .sectiontitle, .page-subtitle{ position:relative; padding-bottom:20px; } .sectiontitle, .sectiontitle h2{ font-size:38px; } h1:not(.maintitle):after, .sectiontitle:after, .page-subtitle:after{ content:""; position:absolute; bottom:0; left:0; right:0; width:20px; height:2px; margin-left:auto; margin-right:auto; background-color:#fccf1d; } h1.blue-line:not(.maintitle):after, .sectiontitle.blue-line:after, .page-subtitle.blue-line:after{ background-color:#222f5c; } h1.white-line:not(.maintitle):after, .sectiontitle.white-line:after, .page-subtitle.white-line:after{ background-color:white; } h1:not(.maintitle){ display:inline-block; position:relative; } .page-subtitle{ display:block; position:relative; margin-left:auto; margin-right:auto; } .maintitle{ font-family:"barlow-bold", arial, sans-serif; } .mascotte:before{ content:url(/assets/images/coq.png?2c2ffbd44b298f35a5b6247e137d2593); position:absolute; left:-450px; bottom:0; } .h2{ margin-bottom:0; font-family:"barlow-regular", arial, sans-serif; } h2:not(.punchline-module__title), h3:not(.product-card__title){ margin-bottom:25px; } h3:not(.product-card__title):not(:first-child){ margin-top:25px; } h3{ font-family:"barlow-bold", arial, sans-serif; } h3.product-card__title{ font-family:"cocon-regular", arial, sans-serif; } @media screen and (min-width: 800px){ h1:not(.title_page), .page-subtitle, h2{ font-size:48px; } h2, .h2, h3:not(.item__title, .product-card__title){ font-size:30px; } } @media screen and (max-width: 799px){ h1:not(.title_page), .page-subtitle{ font-size:32px; } h2{ font-size:18px; } h2, .h2, h3:not(.item__title, .product-card__title){ font-size:24px; } } .cta{ display:inline-block; min-width:180px; margin-top:25px; padding:15px; font-size:15px; font-family:"barlow-bold", arial, sans-serif; text-align:center; text-transform:uppercase; border:1px solid #fccf1d; background-color:#fff; border-radius:30px; } .cta:hover{ color:#fff; background-color:#fccf1d; } .link, .cta{ color:#fccf1d; text-decoration:none; } .breadcrumb{ --margin-breadcrumb:50px; position:absolute; flex-wrap:wrap; margin-left:var(--margin-breadcrumb); top:20px; align-items:center; max-width:25%; text-align:initial; color:#8b4437; font-size:calc(18px * 0.85); z-index:2; } .breadcrumb a:first-of-type{ margin-right:5px; } .breadcrumb a:nth-of-type(2){ margin-right:5px; margin-left:5px; } .breadcrumb:before{ position:absolute; left:calc(var(--margin-breadcrumb) * -1); content:url(/assets/images/arrow-back.jpg?b995a9d20eaaee831944babd9df5bbc4); } @media screen and (max-width: 799px){ .breadcrumb{ max-width:70%; top:-60px; right:0; justify-content:flex-end; flex-direction:initial; } .product-template .breadcrumb{ display:none; } } .site-header{ position:fixed; left:0; right:0; font-family:"barlow-bold", arial, sans-serif; background-color:#fccf1d; box-shadow:0 2px 8px rgba(12, 20, 23, 0.15); z-index:99; } .site-header svg .cls-1{ fill:#000; } .site-header svg .cls-2{ fill:transparent; } .site-header.blue-bg{ background-color:#222f5c; } .site-header.blue-bg svg .cls-1{ fill:#fff; } .site-header .wrapper{ display:flex; align-items:center; } .site-header .logotype{ top:0; left:1em; width:25%; z-index:1; } .site-header .logotype img{ width:200px; } .site-header > span{ width:25%; text-align:right; } .site-header nav li{ display:inline-block; } .site-header nav a{ color:#222f5c; text-decoration:none; } .site-header nav a:hover{ color:#ff0400; } .site-header .traduction{ display:flex; } .site-header .traduction li{ margin-right:15px; } .site-header .traduction li a{ color:#222f5c; text-transform:uppercase; text-decoration:none; } .site-header .traduction li.current a{ color:#ff0400; } .site-header .traduction li:last-of-type{ margin-right:0; } @media screen and (min-width: 800px){ .site-header .wrapper{ justify-content:space-between; height:100px; } .site-header.blue-bg nav a:not(.featured-link), .site-header.blue-bg .traduction li a{ color:white; } .site-header.blue-bg nav a:not(.featured-link):hover, .site-header.blue-bg .traduction li a:hover{ color:#ff0400; } } @media screen and (max-width: 799px){ .site-header .wrapper{ justify-content:flex-end; height:50px; } .site-header .logotype img{ width:100px; } } .menu-overlay__checkbox{ display:none; } #menu_arrow{ display:none; } @media screen and (min-width: 800px){ .menu{ width:40%; margin-left:300px; text-transform:uppercase; } .menu-overlay__btn{ display:none; } .menu .menu__list{ display:flex; justify-content:space-between; } .menu a{ display:inline-block; color:#222f5c; text-decoration:none; } .menu a:hover{ color:#ff0400; } .menu a.active{ position:relative; color:#ff0400; } .menu a.active:before{ content:""; position:absolute; top:-60px; left:0; right:0; width:75px; height:4px; margin-left:auto; margin-right:auto; background-color:#fccf1d; } .menu .only-smrt{ display:none; } } @media screen and (max-width: 799px){ .menu{ order:2; } .menu .only-smrt a{ color:#ff0400; } .menu label{ display:flex; align-items:flex-start; justify-content:center; position:fixed; width:2.8em; height:2.8em; z-index:9999; } .menu__list{ display:none; } .menu__link{ display:flex; justify-content:space-between; padding:1em; border-bottom:solid 1px #0c1417; } .menu__link:last-child{ border-bottom-width:0; } .menu__link #menu_arrow{ display:block; width:50px; height:19px; transition:width 0.3s ease-in-out; } .menu__link:hover #menu_arrow{ width:12px; } .menu__link:hover #menu_arrow .cnt{ fill:#ff0400; } .menu .menu-overlay{ position:fixed; display:flex; right:0; z-index:100; } .menu .menu-overlay__icon{ display:block; position:relative; width:1.5em; height:0.1em; background:#fff; transition:0.4s; } .menu .menu-overlay__icon:after, .menu .menu-overlay__icon:before{ content:""; display:block; position:absolute; width:100%; height:0.1em; background:#fff; border-radius:2em; transition:0.4s; } .menu .menu-overlay__icon:before{ top:-10px; } .menu .menu-overlay__icon:after{ top:10px; } .menu .menu-overlay__btn{ display:flex; justify-content:center; align-items:center; top:0; right:20px; justify-content:center; cursor:pointer; } .menu .menu-overlay__checkbox:checked ~ .menu-overlay__btn .menu-overlay__icon{ background:0 0; } .menu .menu-overlay__checkbox:checked ~ .menu-overlay__btn .menu-overlay__icon::before{ transform:rotate(45deg); } .menu .menu-overlay__checkbox:checked ~ .menu-overlay__btn .menu-overlay__icon::after{ transform:rotate(-45deg); } .menu .menu-overlay__checkbox:checked ~ .menu-overlay__btn .menu-overlay__icon::after, .menu .menu-overlay__checkbox:checked ~ .menu-overlay__btn .menu-overlay__icon::before{ top:0; } .menu .menu-overlay__checkbox:checked ~ .menu__list{ display:flex; flex-direction:column; position:fixed; top:50px; left:0; width:100%; padding-top:1em; padding-left:1em; padding-right:1em; text-transform:uppercase; background-color:#fff; transition-delay:0s; box-shadow:0 2px 8px rgba(12, 20, 23, 0.2); } } .secondmenu{ display:flex; justify-content:flex-end; } @media screen and (max-width: 799px){ .secondmenu{ margin-right:3em; } } #picto-localisation{ left:-40px; width:25px; height:34px; margin-right:30px; } #picto-localisation .cls-1{ fill:#131414; } #picto-localisation .cls-2{ fill:transparent; } .footer-widgets{ align-items:center; } .footer-widgets .footer-widgets__content{ left:20%; right:0; } .footer-widgets .footer-widgets__content.white-color p{ color:white; } .footer-widgets .footer-widgets__content.white-color #picto-localisation .cls-1{ fill:white; } .footer-widgets img{ max-width:100%; } .footer-content{ color:#fff; font-size:15px; background-color:#fccf1d; } .footer-content.blue-bg{ background-color:#222f5c; } .footer-content ul{ margin-bottom:25px; } .footer-content a{ color:#fff; text-decoration:none; } .banner.footer{ top:-1px; transform:rotate(180deg); } @media screen and (min-width: 800px){ .footer-content ul li{ display:inline-block; margin-left:10px; margin-right:10px; } .footer-content ul li:first-child{ margin-left:0; } .footer-content ul li:last-child{ margin-right:0; } } @media screen and (max-width: 799px){ .footer-widgets{ height:200px; } .footer-widgets img{ height:100%; -o-object-fit:cover; object-fit:cover; opacity:0.2; } .footer-widgets .footer-widgets__content{ text-align:center; left:50%; transform:translateX(-50%); bottom:20px; } .footer-widgets .footer-widgets__content #picto-localisation{ top:-40px; left:50%; transform:translateX(-50%); } .footer-widgets .footer-widgets__content.white-color p{ color:black; } .footer-widgets .footer-widgets__content.white-color #picto-localisation .cls-1{ fill:black; } .footer-content ul li{ margin-bottom:10px; } } form{ font-size:16px; } input[type=text]{ border:0 none; } input[type=submit]{ min-width:180px; padding:15px; color:#fccf1d; background-color:transparent; font-weight:bold; text-align:center; text-transform:uppercase; border:1px solid #fccf1d; } .newsletter input[type=text], input[type=submit]{ border-radius:30px; } input[type=submit]{ cursor:pointer; } input[type=submit]:hover{ color:#fff; background-color:#fccf1d; } input[type=text], input[type=number], input[type=mail]{ padding:15px; font-size:15px; border:0 none; outline-color:#efefef; } textarea{ width:100%; max-width:100%; margin-top:30px; margin-bottom:30px; } .form-row{ display:flex; padding-top:30px; padding-bottom:30px; } .form-group{ display:flex; padding-bottom:2px; width:100%; max-width:100%; border-bottom:solid 1px #0c1417; } .form-group input[type=text], .form-group input[type=number], .form-group input[type=mail]{ flex-grow:2; } .form-group:first-of-type{ margin-left:0; } .form-group:last-of-type{ margin-right:0; } fieldset{ margin-top:45px; border:0 none; } fieldset legend{ margin-bottom:30px; font-weight:bold; } .radio-label{ position:relative; padding-left:20px; margin-right:25px; cursor:pointer; } .radio-label input{ -webkit-appearance:none; -moz-appearance:none; appearance:none; } .checkmark{ position:absolute; top:3px; left:0; right:10px; height:12px; width:12px; background-color:#fff; border:solid 1px #fccf1d; border-radius:50%; } .radio-label:hover input ~ .checkmark{ background-color:#fccf1d; } .radio-label input:checked ~ .checkmark{ background-color:#fff; } .checkmark:after{ content:""; position:absolute; display:none; } .radio-label input:checked ~ .checkmark:after{ display:block; } .radio-label .checkmark:after{ top:2px; left:2px; width:6px; height:6px; border-radius:50%; background-color:#fccf1d; } .ck-button{ margin-bottom:45px; } .ck-button label{ margin-right:10px; } .ck-button label:last-child{ margin-right:0; } .ck-button label span{ padding:10px; margin-right:10px; border:1px solid #0c1417; border-radius:40px; cursor:pointer; } .ck-button label span:last-child{ margin-right:0; } .ck-button label span:hover{ color:#fff; border-color:#fccf1d; background-color:#fccf1d; } .ck-button label input{ position:absolute; top:-20px; } .ck-button input:checked + span{ background-color:#fccf1d; color:#fff; border-color:#fff; } .swap{ visibility:hidden; } .swap:after{ cursor:pointer; visibility:visible; content:""; font-size:calc(var(--swap-size) - 2.5rem); display:inline-block; width:var(--swap-size); height:var(--swap-size); padding:0.5rem; border:1px solid #fccf1d; border-radius:0.4em; background-color:#fff; display:flex; justify-content:center; align-items:center; } .swap:checked:after{ content:""; background-color:#fccf1d; } @media screen and (min-width: 800px){ .newsletter input[type=text]{ width:430px; } .form-group{ align-items:center; margin-left:15px; margin-right:15px; } } @media screen and (max-width: 799px){ input[type=text], input[type=submit]{ display:block; margin-left:auto; margin-right:auto; } form, input[type=text]{ width:100%; max-width:100%; } input[type=submit]{ margin-top:25px; } .form-row, .form-group{ flex-direction:column; } .form-group{ margin-bottom:25px; } .form-group:last-child{ margin-bottom:0; } .ck-button label span{ display:inline-block; margin-bottom:5px; } } .product-card, .gamme-card{ display:flex; position:relative; height:375px; margin-bottom:20px; overflow:hidden; } .product-card > img, .gamme-card > img{ display:block; width:100%; height:100%; -o-object-fit:cover; object-fit:cover; max-width:none; } .product-card a, .gamme-card a{ top:0; z-index:9; } .product-card .overlay, .gamme-card .overlay{ display:flex; align-items:center; justify-content:center; position:absolute; width:100%; height:50%; font-weight:bold; transition:bottom 0.4s; } .product-card .product-card__title, .product-card a{ position:absolute; right:0; bottom:0; left:0; } .product-card .product-card__title{ padding:1em 0.2em; background-color:rgba(255, 255, 255, 0.5); } .product-card .overlay{ bottom:-200px; } .product-card .overlay span{ width:50%; padding-top:1em; padding-bottom:1em; background-color:#fff; border-radius:2em; } .product-card:hover .overlay{ bottom:0; } .gamme-card .gamme-card__title, .gamme-card a{ position:absolute; right:0; bottom:0; left:0; } .gamme-card .gamme-card__title{ padding:1em 0.2em; background-color:rgba(255, 255, 255, 0.5); } .gamme-card .overlay{ bottom:-50px; } .gamme-card .overlay span{ color:#fff; font-size:30px; font-family:"barlow-bold", arial, sans-serif; } .gamme-card:hover .overlay{ bottom:50px; } #list .wrapper > div:first-child{ padding-top:0; } #list .title{ color:#fff; font-size:calc(18px * 3.25); } #list .is-flex{ -moz-column-gap:20px; column-gap:20px; flex-wrap:wrap; flex-direction:initial; } #list .section-header{ margin-bottom:50px; color:#fff; } #list .section-header .title{ margin-bottom:5px; } #list .section-header .content{ top:30px; padding-left:30px; padding-right:30px; } .overlay{ background-color:rgba(139, 68, 55, 0.8); } .overlay span{ color:#8b4437; } .is-brown header .content{ background-color:rgba(139, 68, 55, 0.8); } .is-brown .overlay{ background-color:rgba(139, 68, 55, 0.8); } .is-brown .product-card .overlay span{ color:#8b4437; } .is-orange header .content{ background-color:rgba(211, 101, 0, 0.8); } .is-orange .overlay{ background-color:rgba(211, 101, 0, 0.8); } .is-orange .product-card .overlay span{ color:#d36500; } .is-grey header .content{ background-color:rgba(203, 165, 131, 0.8); } .is-grey .overlay{ background-color:rgba(203, 165, 131, 0.8); } .is-grey .product-card .overlay span{ color:#cba583; } .is-yellow header .content{ background-color:rgba(252, 207, 29, 0.8); } .is-yellow .overlay{ background-color:rgba(252, 207, 29, 0.8); } .is-yellow .product-card .overlay span{ color:#fccf1d; } .is-yellow .gamme-card .overlay span{ color:#fff; } .is-blue header .content{ background-color:rgba(152, 193, 232, 0.8); } .is-blue .overlay{ background-color:rgba(152, 193, 232, 0.8); } .is-blue .product-card .overlay span{ color:#98c1e8; } .is-green header .content{ background-color:rgba(133, 184, 63, 0.8); } .is-green .overlay{ background-color:rgba(133, 184, 63, 0.8); } .is-green .product-card .overlay span{ color:#85b83f; } .is-pink header .content{ background-color:rgba(190, 54, 108, 0.8); } .is-pink .overlay{ background-color:rgba(190, 54, 108, 0.8); } .is-pink .product-card .overlay span{ color:#be366c; } #posts{ position:relative; } #posts .sectiontitle:after{ content:""; background-color:#0c1417; } .posts-list{ width:1120px; margin:0 auto; justify-content:center; align-items:center; flex-wrap:wrap; -moz-column-gap:20px; column-gap:20px; } .post-card{ width:360px; margin-bottom:50px; } @media (min-width: 769px){ .product-card{ width:32%; max-width:32%; } .gamme-card{ width:32%; max-width:32%; } .gamme-card:nth-child(4), .gamme-card:nth-child(5){ width:49%; max-width:49%; } #list .section-header .content{ position:absolute; } #posts > img{ position:absolute; top:0; left:0; z-index:-1; -o-object-fit:cover; object-fit:cover; } } @media (max-width: 1024px){ #list .section-header{ margin-bottom:80px; } #list .is-flex{ justify-content:center; } } @media (max-width: 1200px){ .posts-list{ width:100%; } } @media (max-width: 768px){ #list .section-header .content{ position:relative; } #posts > img{ position:absolute; top:0; left:0; height:14%; z-index:-1; -o-object-fit:cover; object-fit:cover; } .post-card{ width:100%; max-width:360px; } } @media (max-width: 480px){ #posts > img{ height:8%; } } .punchline-module{ color:#fccf1d; } @media screen and (min-width: 800px){ .punchline-module h2{ font-size:42px; } } @media screen and (max-width: 799px){ .punchline-module h2{ font-size:24px; } } .newsletter .wrapper{ justify-content:space-between; align-items:center; } .animate__animated{ opacity:0; } .animate__animated.reveal-visible{ opacity:1; } .jumbotron{ font-family:"barlow-bold", arial, sans-serif; position:relative; z-index:1; overflow:hidden; } .jumbotron img{ transition:scale 0.3s ease-in-out; } .jumbotron img.zoomed{ scale:1.05; } .jumbotron .item__title{ position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:-webkit-max-content; width:-moz-max-content; width:max-content; display:flex; align-items:center; justify-content:center; color:#fff; } .jumbotron .item__title:before, .jumbotron .item__title:after{ content:""; position:absolute; height:60%; background-color:#fff; box-shadow:0 2px 8px rgba(12, 20, 23, 0.6); } .jumbotron .item__title:before{ left:0; } .jumbotron .item__title:after{ right:0; } #carrousel1 .carrousel{ overflow:hidden; outline-color:transparent; } #carrousel1 .carrousel .carrousel__container{ transition:transform 0.3s; transform:translateZ(0); } #carrousel1 .carrousel .carrousel__container:after{ content:""; clear:both; display:table; } #carrousel1 .carrousel .carrousel__item{ float:left; } #carrousel1 .carrousel .item{ display:flex; align-items:center; justify-content:center; position:relative; } #carrousel1 .carrousel .item img{ display:block; width:100%; height:auto; } #carrousel1 .carrousel .item > a{ position:absolute; top:0; right:0; bottom:0; left:0; } #carrousel1 .carrousel .item:hover .item__link{ background-color:#fccf1d; } #carrousel1 .carrousel .item__image{ width:100%; overflow:hidden; } #carrousel1 .carrousel .item__link{ display:inline-flex; align-items:center; justify-content:center; position:absolute; right:0; top:0; bottom:0; padding:1em; color:#fff; background-color:#fccf1d; font-size:calc(18px * 0.65); font-weight:700; text-transform:uppercase; transition:background-color 0.3s; } #carrousel1 .carrousel .item__link p{ margin-bottom:0; } .carrousel, .items{ position:relative; } .carrousel__next, .carrousel__prev{ position:absolute; width:2.3em; height:2.3em; background:url(/assets/images/caroussel_arrow-right.png?2cdf04a1096a17958e8415beae962d71) 50% no-repeat; background-size:contain; border-radius:50%; top:50%; margin-top:-1.2em; right:1.2em; cursor:pointer; transition:transform 0.3s, opacity 0.3s; } .carrousel__prev{ background-image:url(/assets/images/caroussel_arrow-left.png?a70304ae9c1add15f69f786c16cf5c1c); right:auto; left:1.2em; } .carrousel__next--hidden, .carrousel__prev--hidden{ opacity:0; } .carrousel__next:hover, .carrousel__prev:hover{ transform:scale(1.2); } .carrousel__pagination{ display:block; position:absolute; bottom:100px; left:0; right:0; text-align:center; display:none; } .carrousel__pagination__button{ width:18px; height:18px; border-radius:50%; display:inline-block; margin:0 20px; border:solid 2px #222f5c; cursor:pointer; } .carrousel__pagination__button--active, .carrousel__pagination__button:hover{ background-color:#222f5c; } @media screen and (min-width: 800px){ #carrousel1 .carrousel__pagination{ display:block; } .jumbotron .item__title{ width:770px; font-size:60px; } .jumbotron .item__title:before, .jumbotron .item__title:after{ content:""; width:7px; } } @media screen and (max-width: 799px){ .jumbotron .item__title{ padding-left:1em; padding-right:1em; font-size:26px; } .jumbotron .item__title:before, .jumbotron .item__title:after{ content:""; width:4px; } } #carrousel2{ margin-top:2rem; } #carrousel2 .carrousel{ padding-bottom:1.5em; overflow:hidden; outline-color:transparent; } #carrousel2 .carrousel .carrousel__container{ transition:transform 0.3s; transform:translateZ(0); } #carrousel2 .carrousel .carrousel__container:after{ content:""; clear:both; display:table; } #carrousel2 .carrousel .carrousel__item{ float:left; } #carrousel2 .carrousel .item{ display:flex; align-items:center; justify-content:center; position:relative; } #carrousel2 .carrousel .item img{ display:block; width:100%; height:auto; } #carrousel2 .carrousel .item > a{ position:absolute; top:0; right:0; bottom:0; left:0; } #carrousel2 .carrousel .item:hover .item__link{ background-color:#fccf1d; } #carrousel2 .carrousel .item__body{ flex-basis:60%; padding:90px; color:#fff; background-color:#0c1417; } #carrousel2 .carrousel .item__title{ position:relative; padding-bottom:20px; color:#fccf1d; font-size:16px; } #carrousel2 .carrousel .item__title:after{ content:""; position:absolute; bottom:0; left:0; right:0; width:20px; height:2px; margin-left:auto; margin-right:auto; background-color:#fccf1d; } #carrousel2 .carrousel .item__link{ display:inline-flex; align-items:center; justify-content:center; position:absolute; right:0; top:0; bottom:0; padding:1em; color:#fff; background-color:#fccf1d; font-size:calc(18px * 0.65); font-weight:700; text-transform:uppercase; transition:background-color 0.3s; } #carrousel2 .carrousel .item__link p{ margin-bottom:0; } .carrousel, .items{ position:relative; } .carrousel__next, .carrousel__prev{ position:absolute; width:2.3em; height:2.3em; background:url(/assets/images/caroussel_arrow-right.png?2cdf04a1096a17958e8415beae962d71) 50% no-repeat; background-size:contain; border-radius:50%; top:50%; margin-top:-1.2em; right:0; cursor:pointer; transition:transform 0.3s, opacity 0.3s; } .carrousel__prev{ background-image:url(/assets/images/caroussel_arrow-left.png?a70304ae9c1add15f69f786c16cf5c1c); right:auto; left:0; } .carrousel__next--hidden, .carrousel__prev--hidden{ opacity:0; } .carrousel__next:hover, .carrousel__prev:hover{ transform:scale(1.2); } #carrousel2 .carrousel__pagination{ position:absolute; bottom:30px; right:0; text-align:center; display:none; } #carrousel2 .carrousel__pagination__button{ background-color:rgba(252, 207, 29, 0.5); width:14px; height:14px; border-radius:50%; display:inline-block; margin:0 3px; cursor:pointer; } #carrousel2 .carrousel__pagination__button--active, #carrousel2 .carrousel__pagination__button:hover{ background-color:#fccf1d; } @media screen and (min-width: 800px){ #carrousel2 .carrousel__pagination{ display:block; } } @media screen and (max-width: 799px){ #carrousel2 .carrousel .item__body{ padding:2em; text-align:center; } #carrousel2 .carrousel .item__title .secondtitle{ padding-right:5em; font-size:calc(18px * 0.9); } #carrousel2 .carrousel .item img{ width:70%; margin-left:auto; margin-right:auto; } } .timeline{ position:relative; max-width:1200px; margin:4rem auto 0; } .timeline .year{ display:inline-block; padding:15px 30px; margin-bottom:10px; font-size:43px; color:#fff; border-radius:50px; } .timeline .step > img{ width:50%; } .timeline .step.is-flex{ width:520px; } .timeline .step.is-flex .year{ margin-right:20px; } .timeline .step.special > img{ display:block; width:60%; margin-bottom:20px; margin-left:30%; } .timeline .step .step_content{ background-color:#fff; } .timeline .step .step_title{ margin-bottom:10px; } .timeline .step .step_title:nth-child(odd){ color:#ff0400; } .timeline .step .step_title:nth-child(even){ color:#222f5c; } .timeline .step:not(:last-child){ margin-bottom:2rem; } .timeline .step:nth-child(odd) .step_title{ color:#ff0400; } .timeline .step:nth-child(even) .step_title{ color:#222f5c; } .timeline .step:nth-child(odd) .year{ background-color:#ff0400; } .timeline .step:nth-child(even) .year{ background-color:#222f5c; } @media screen and (min-width: 800px){ .timeline{ z-index:0; } .timeline #frise-autoscroll{ top:3rem; } .timeline .step{ width:400px; } .timeline .step.is-flex{ width:520px; } .timeline .left{ left:0; } .timeline .right{ left:50%; } } @media screen and (max-width: 799px){ .timeline #frise-autoscroll{ display:none; } .timeline .step{ width:100%; } .timeline .step.is-flex{ width:100%; } } .jumbotron{ position:relative; display:flex; align-items:center; justify-content:center; } .jumbotron .maintitle{ position:absolute; color:#fff; text-align:center; text-shadow:0 2px 8px rgba(12, 20, 23, 0.6); z-index:1; } .jumbotron .maintitle .title-icon{ display:flex; align-items:center; justify-content:center; background-color:#fccf1d; width:120px; height:120px; margin-left:auto; margin-right:auto; padding:20px; border-radius:50%; } .jumbotron img{ max-width:100%; } #products, #values{ display:flex; align-items:center; justify-content:center; position:relative; } #products > img, #values > img{ position:absolute; top:0; left:0; z-index:-1; -o-object-fit:cover; object-fit:cover; } #products .sectiontitle h2{ margin-bottom:0; } #products .sectiontitle:after{ content:""; background-color:#0c1417; } #products > img{ height:80%; } #products .product-item{ display:flex; align-items:center; flex:1; margin-right:60px; transition:transform 0.2s; } #products .product-item:last-child{ margin-right:0; } #products .product-item:hover{ transform:scale(1.1); } #products .products-list{ margin-top:20px; } #values .sectiontitle:after{ content:""; background-color:#0c1417; } #values .sectiontitle.white-line:after{ background-color:white; } #values > img{ height:110%; max-width:100%; } #values ul{ display:flex; justify-content:space-between; } #values .values-content{ width:1000px; margin-bottom:50px; } #values .values-list{ margin-top:100px; } #values .values-list .item{ display:inline-flex; flex-direction:column; justify-content:center; align-items:center; flex:1; font-family:"barlow-bold", arial, sans-serif; } #values .values-list .item img{ width:70px; height:70px; margin-bottom:20px; -o-object-fit:contain; object-fit:contain; } #reassurances{ margin-bottom:60px; } #reassurances ul{ display:flex; flex-wrap:wrap; } #reassurances ul li{ display:inline-flex; flex-direction:column; align-items:center; color:#222f5c; font-family:"barlow-bold", arial, sans-serif; } #reassurances img{ max-width:70px; height:auto; margin-right:10px; } #reassurances .number{ color:#ff0400; font-size:calc(18px * 4); } .video-wrapper{ display:none; } .cuisto{ position:absolute; left:0; top:0; } .plan, .phone{ padding-left:80px; } .plan p:first-of-type, .phone p:first-of-type{ font-size:calc(18px * 1.1); } .plan p:nth-of-type(2), .phone p:nth-of-type(2){ color:#999999; font-size:calc(18px * 0.85); line-height:1.5; } .blue header{ background-color:#222f5c; } .blue .cta, .blue .link{ color:#222f5c; } .blue .cta{ border-color:#222f5c; } .blue .cta:hover{ color:#fff; background-color:#222f5c; } .blue #values{ color:#fff; } .blue #values .item:nth-of-type(even){ color:#ff0400; } .blue .product-card .overlay{ background-color:rgba(34, 47, 92, 0.8); } .blue .product-card .overlay span{ color:#222f5c; } .blue .traduction li a{ color:#fff; } .blue .traduction li.current a{ color:#ff0400; } .blue .featured-link{ color:#ff0400; } .blue-bg .featured-link{ background-image:url(/assets/images/food-service-active.png?2e2bf7035544edbac65d65338c1fbd7c); background-position:center top; } .best{ display:flex; align-items:center; font-family:"barlow-bold", arial, sans-serif; } .mt50{ margin-top:50px; } .mb50{ margin-bottom:50px; } .has-label{ position:relative; } .has-label:before{ content:""; position:absolute; right:20px; top:unset; bottom:-280px; width:11vw; height:15vw; max-width:130px; background-image:url(/assets/images/Logo_MadeInFrance.jpg?caa24dd8d843129d80d8cdfc7ccfb1b6); background-repeat:no-repeat; background-size:contain; } @media screen and (min-width: 800px){ .jumbotron .maintitle{ font-size:calc(18px * 3.25); } .blue .menu .menu__item a{ color:#fff; } .has-label:before{ top:25px; bottom:unset; } .has-chicken-path{ position:relative; } .has-chicken-path:before{ content:url(/assets/images/empreintes.png?a2c7cc1a99b8e4e1302c7b327fdafed7); position:absolute; left:20px; top:-20px; } .bckg-illustration:after{ content:url(/assets/images/cuisinier.jpg?baaefbda5b45a25efacd1962934e1ccd); position:absolute; top:-110px; right:60px; width:300px; height:300px; z-index:-1; } .featured-link{ bottom:-63px; right:-250px; width:280px; padding-top:37px; padding-bottom:35px; line-height:1; color:#222f5c; background-image:url(/assets/images/food-service.png?0516f121d7754c28b2cb3055ce991861); background-repeat:no-repeat; background-position:center 12px; } .featured-link:hover{ background-image:url(/assets/images/food-service-active.png?2e2bf7035544edbac65d65338c1fbd7c); background-position:center top; } .featured-link span{ display:block; font-size:12px; } #reassurances ul{ justify-content:space-between; } #reassurances ul li{ width:30%; } #values .values-list{ margin-top:100px; } .desk-mt180{ margin-top:180px; } .desk-mr18{ margin-right:80px; } .desk-mt-n15{ margin-top:-15px; } .desk-mt-n80{ margin-top:-80px; } .desk-mt-n95{ margin-top:-95px; } .desk-ml-150{ margin-left:150px; } .desk-mt-120{ margin-top:120px; } .desk-mt50{ margin-top:50px; } .desk-mb-80{ margin-bottom:80px !important; } .best{ padding-top:100px; padding-left:145px; } .best:before{ content:url(/assets/images/personnage.png?afab50b1fecf5fd0149a8216117dd5a8); position:absolute; left:0; z-index:-1; } .best span:first-of-type{ margin-right:10px; color:#ff0400; font-size:90px; } .best span:nth-of-type(2){ color:#222f5c; font-size:55px; } .reduice-img img{ width:65%; max-width:65%; margin-top:-100px; } } @media screen and (max-width: 799px){ .jumbotron .maintitle{ font-size:calc(18px * 1.8); } .blue > .menu .menu__item a{ color:#fff; } #products .product-item{ margin-right:0; } #products .product-item img{ margin:1rem auto; } #values ul{ flex-direction:column; align-items:center; } .has-label:before{ width:130px; height:190px; right:unset; left:50%; transform:translateX(-50%); top:unset; bottom:-285px; } .featured-link{ display:none; } #reassurances ul{ flex-direction:column; } .reassurance-item:not(:first-child){ margin-top:30px; } #values .values-list{ margin-top:50px; flex-wrap:wrap; } #values .values-list .item{ width:50%; margin-bottom:3em; } .best span:first-of-type{ margin-right:10px; color:#ff0400; font-size:45px; } .best span:nth-of-type(2){ color:#222f5c; font-size:32px; } .smrt-mb-100{ margin-bottom:100px !important; } .smrt-mb-200{ margin-bottom:200px !important; } .smrt-order{ display:flex; flex-direction:column; align-items:flex-start; } .smrt-order img{ order:3; } .smrt-order span{ order:0; } } :root{ --primary-color:#d4021d; --secondary-color:#707070; --background-color:#ffffff; --title-font:"Satisfy", sans-serif; --title-size:30px; --text-font:"Barlow", sans-serif; --text-size:16px; --accept-color:#33aa33; --deny-color:#aa3333; --ck-bg-color:var(--background-color); --ck-w1-bgcolor-title:var(--background-color); --ck-w1-font-family-title:var(--title-font); --ck-w1-font-size-title:var(--title-size); --ck-w1-color-title:#000000; --ck-w1-font-family-txt:var(--text-font); --ck-w1-font-size-txt:var(--text-size); --ck-w1-color-txt:var(--primary-color); --ck-w1-color-href-hover:var(--secondary-color); --ck-w1-color-btn:var(--primary-color); --ck-w1-color-btn-hover:var(--secondary-color); --ck-w1-font-family-btn-txt:var(--text-font); --ck-w1-font-size-btn-txt:var(--text-size); --ck-w1-color-btn-txt:#ffffff; --ck-w1-color-btn-txt-hover:#ffffff; --ck-w1-color-btn-border:transparent; --ck-w1-color-btn-border-hover:transparent; --ck-bg-color-modal-wrapper:#ffffff; --ck-w2-bgcolor-title:var(--primary-color); --ck-w2-font-family-title:var(--title-font); --ck-w2-font-size-title:var(--title-size); --ck-w2-color-title:#ffffff; --ck-w2-font-family-txt:var(--text-font); --ck-w2-font-size-txt:var(--text-size); --ck-w2-color-txt:#ffffff; --ck-w2-color-href-hover:#000000; --ck-color-accept:#808080; --ck-color-accept-hover:var(--accept-color); --ck-color-deny:#808080; --ck-color-deny-hover:var(--deny-color); --ck-color-txt:#ffffff; --ck-color-txt-hover:#ffffff; --ck-bgcolor-list:#e4e4e4; --ck-font-family-list:var(--text-font); --ck-font-size-list:var(--text-size); --ck-color-list:#000000; } #ldcweb-cn *, #ldcweb-cn *::before, #ldcweb-cn *::after{ padding:0; margin:0; box-sizing:border-box; } #template{ display:none; } #ldcweb-cn.open-banner .ldcweb-cn-banner{ display:flex; } #ldcweb-cn.open-modal #ldcweb-cn-modal{ display:flex; } #ldcweb-cn.open-banner, #ldcweb-cn.open-modal{ display:flex; } #ldcweb-cn{ display:none; flex-direction:column; justify-content:flex-end; position:fixed; left:0; right:0; top:0; bottom:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.7); z-index:99999999999; opacity:1; line-height:initial; } #ldcweb-cn p, #ldcweb-cn a{ font-family:var(--ck-w1-font-family-txt); font-size:var(--ck-w1-font-size-txt); color:var(--ck-w1-color-txt); } #ldcweb-cn a{ text-decoration:underline; transition:color 0.5s; } #ldcweb-cn a:hover{ color:var(--ck-w1-color-href-hover); } #ldcweb-cn .ldcweb-cn-banner, #ldcweb-cn-modal .modal-wrapper{ overflow:auto; display:flex; flex-direction:column; align-items:center; } #ldcweb-cn .ldcweb-cn-banner{ display:none; padding:6vw 10vw; max-height:50vh; box-shadow:0px 5px 10px -5px #000 inset; background-color:var(--ck-bg-color); } #ldcweb-cn .ldcweb-cn-banner div:not(:last-child){ margin-bottom:4vw; } #ldcweb-cn .banner-img{ flex:1; max-width:200px; } #ldcweb-cn .banner-img img{ width:100%; } #ldcweb-cn .col{ flex:2; } #ldcweb-cn .banner-title p{ font-family:var(--ck-w1-font-family-title); font-size:var(--ck-w1-font-size-title); font-weight:bold; color:var(--ck-w1-color-title); text-align:center; } #ldcweb-cn .banner-txt{ text-align:center; } #ldcweb-cn .btns{ flex:1; display:flex; flex-direction:column; } #ldcweb-cn .btns .btn{ display:block; padding:1em; text-align:center; min-width:12em; width:100%; line-height:0; background-color:var(--ck-w1-color-btn); text-decoration:none; font-family:var(--ck-w1-font-family-btn-txt); font-size:var(--ck-w1-font-size-btn-txt); color:var(--ck-w1-color-btn-txt); transition:all 0.5s; } #ldcweb-cn .btns .btn:hover{ background-color:var(--ck-w1-color-btn-hover); background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); color:var(--ck-w1-color-btn-txt-hover); } #ldcweb-cn-modal{ display:none; align-items:center; justify-content:center; position:fixed; left:0; right:0; top:0; bottom:0; width:100%; height:100%; z-index:200; background:rgba(0, 0, 0, 0.7); opacity:1; } #ldcweb-cn-modal .modal-wrapper{ position:relative; background-color:var(--ck-bg-color-modal-wrapper); max-height:100vh; } #ldcweb-cn-modal .modal-wrapper > div:not(:first-of-type){ width:100%; } #ldcweb-cn-modal .modal-btn-close{ position:absolute; right:0; top:0; width:5vw; height:6vw; display:flex; justify-content:center; align-items:center; } #ldcweb-cn-modal .modal-btn-close a{ width:100%; height:100%; display:flex; justify-content:center; align-items:center; font-family:Arial, Helvetica, sans-serif; font-size:medium; font-weight:bold; color:var(--ck-w2-color-title); background-color:var(--ck-w2-bgcolor-title); text-decoration:none; border-radius:0 0 0 50%; transition:all 0.5s; } #ldcweb-cn-modal .modal-btn-close a:hover{ color:#000000; background-color:#808080; background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); box-shadow:-1px 1px 10px -4px #000; } #ldcweb-cn-modal .modal-title, #ldcweb-cn-modal .modal-all{ background-color:var(--ck-w2-bgcolor-title); } #ldcweb-cn-modal .modal-title .description, #ldcweb-cn-modal .modal-title > div, #ldcweb-cn-modal .modal-all{ display:flex; flex-direction:column; align-items:center; } #ldcweb-cn-modal .modal-title .description, #ldcweb-cn-modal .modal-title > div a, #ldcweb-cn-modal .modal-all p, #ldcweb-cn-modal .modal-all a{ font-family:var(--ck-w2-font-family-txt); font-size:var(--ck-w2-font-size-txt); color:var(--ck-w2-color-txt); text-align:center; } #ldcweb-cn-modal .modal-title > div a:hover, #ldcweb-cn-modal .modal-all a:hover{ color:var(--ck-w2-color-href-hover); } #ldcweb-cn-modal .modal-wrapper .modal-title{ padding:4vw; } #ldcweb-cn-modal .modal-title .title{ font-family:var(--ck-w2-font-family-title); font-size:var(--ck-w2-font-size-title); font-weight:bold; color:var(--ck-w2-color-title); text-align:center; } #ldcweb-cn-modal .modal-title .title::after, #ldcweb-cn-modal .modal-title > div::after{ content:""; display:block; width:90%; height:2px; margin:4vw auto; background-color:rgba(255, 255, 255, 0.5); } #ldcweb-cn-modal .modal-title a{ width:-webkit-fit-content; width:-moz-fit-content; width:fit-content; } #ldcweb-cn-modal .modal-wrapper .modal-all{ padding:0 4vw 4vw; } #ldcweb-cn-modal .modal-all .all-buttons{ display:flex; flex-direction:column; align-items:center; } #ldcweb-cn-modal .modal-all .all-buttons > div{ width:calc(100% + 15vw); margin:2vw 0 0; } #ldcweb-cn-modal .modal-all a{ display:block; padding:3vw 0; color:var(--ck-color-txt); text-decoration:none; transition:all 0.5s; } #ldcweb-cn-modal .all-buttons > div.accept > a.active{ background-color:var(--ck-color-accept-hover); background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); } #ldcweb-cn-modal .all-buttons > div.deny > a.active{ background-color:var(--ck-color-deny-hover); background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); } #ldcweb-cn-modal .modal-all > div > div:first-of-type a{ background-color:var(--ck-color-accept); } #ldcweb-cn-modal .modal-all > div > div:last-of-type a{ background-color:var(--ck-color-deny); } #ldcweb-cn-modal .modal-all > div > div:first-of-type a:hover{ color:var(--ck-color-txt-hover); background-color:var(--ck-color-accept-hover); background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); } #ldcweb-cn-modal .modal-all > div > div:last-of-type a:hover{ color:var(--ck-color-txt-hover); background-color:var(--ck-color-deny-hover); background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); } #ldcweb-cn-modal .modal-wrapper .modal-details{ padding:2vw 0; } #ldcweb-cn-modal .modal-details ul{ display:flex; flex-direction:column; } #ldcweb-cn-modal .modal-details li > div{ display:flex; flex-direction:column; justify-content:space-between; margin:2vw 0; padding:2vw 4vw; background-color:var(--ck-bgcolor-list); } #ldcweb-cn-modal .modal-details li span, #ldcweb-cn-modal .modal-details li a, #ldcweb-cn-modal .modal-details li label{ font-family:var(--ck-font-family-list); font-size:var(--ck-font-size-list); color:var(--ck-color-list); } #ldcweb-cn-modal .modal-details li a:hover{ color:var(--secondary-color); } #ldcweb-cn-modal .modal-details .ldcweb-cn-infos{ display:flex; flex-direction:column; flex:1; } #ldcweb-cn-modal .modal-details .ldcweb-cn-infos span:first-of-type{ font-size:calc(var(--ck-font-size-list) * 1.25); font-weight:bold; } #ldcweb-cn-modal .modal-details .ldcweb-cn-infos a{ width:-webkit-fit-content; width:-moz-fit-content; width:fit-content; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons{ display:flex; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type, #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type{ transition:all 0.5s; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type{ margin-right:2vw; background:var(--ck-color-accept); } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type{ background:var(--ck-color-deny); } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{ width:25vw; margin:2vw 0; display:table; text-align:center; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type:hover, #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type:hover{ cursor:pointer; background:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:hover > label{ color:var(--ck-color-txt-hover); } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type input:checked ~ label, #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type input ~ label.active{ background-color:var(--ck-color-accept-hover); background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type input:checked ~ label, #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type input ~ label.active{ background-color:var(--ck-color-deny-hover); background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons input{ display:none; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons label{ display:block; padding:1.5vw 0; color:var(--ck-color-txt); transition:color 0.5s; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons label:hover{ cursor:pointer; color:var(--ck-color-txt-hover); } @media only screen and (min-width: 768px){ #ldcweb-cn .ldcweb-cn-banner{ padding-top:4vw; padding-bottom:4vw; } #ldcweb-cn .btns{ flex-direction:row; } #ldcweb-cn .btns > div:first-child, #ldcweb-cn .btns > div:last-child{ margin-top:0; } #ldcweb-cn .btns > div:not(:last-child){ margin:0 2vw 0 0; } #ldcweb-cn-modal .modal-wrapper{ width:90vw; } #ldcweb-cn-modal .modal-all{ flex-direction:row; justify-content:space-between; } #ldcweb-cn-modal .modal-all a{ padding:2vw 0; } #ldcweb-cn-modal .modal-all .all-buttons > div{ margin:0; } #ldcweb-cn-modal .modal-all .all-buttons > div:last-of-type{ margin:1vw 0 0; } #ldcweb-cn-modal .modal-all a{ width:30vw; } #ldcweb-cn-modal .modal-details li > div{ flex-direction:row; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons{ flex-direction:column; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{ width:20vw; margin:0; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type{ margin:0 0 1vw; } } @media only screen and (min-width: 1024px){ #ldcweb-cn .ldcweb-cn-banner{ flex-direction:row; align-items:flex-start; justify-content:space-between; padding:2vw 3vw; } #ldcweb-cn .ldcweb-cn-banner div:not(:last-child){ margin:0 0 0.5em 0; } #ldcweb-cn .ldcweb-cn-banner > div:not(:last-child){ margin:0 4vw 0 0; } #ldcweb-cn .ldcweb-cn-banner .banner-img{ height:100%; display:flex; align-items:center; } #ldcweb-cn .banner-img img{ height:-webkit-fit-content; height:-moz-fit-content; height:fit-content; } #ldcweb-cn .banner-txt{ text-align:start; } #ldcweb-cn .btns{ height:100%; flex-direction:column; justify-content:center; } #ldcweb-cn .btns > div:first-child .btn{ margin:0; } #ldcweb-cn-modal .modal-wrapper{ width:80vw; } #ldcweb-cn-modal .modal-btn-close{ width:3vw; height:3vw; } #ldcweb-cn-modal .modal-wrapper .modal-title{ padding:2vw; } #ldcweb-cn-modal .modal-title .title::after, #ldcweb-cn-modal .modal-title > div::after{ margin:2vw auto; } #ldcweb-cn-modal .modal-wrapper .modal-all{ padding:0 2vw 2vw; } #ldcweb-cn-modal .modal-all a{ padding:1.5vw 0; } #ldcweb-cn-modal .modal-all .all-buttons{ flex-direction:row; } #ldcweb-cn-modal .modal-all .all-buttons > div:first-of-type{ margin:0 1vw 0 0; } #ldcweb-cn-modal .modal-all .all-buttons > div:last-of-type{ margin:0; } #ldcweb-cn-modal .modal-all a{ width:22vw; } #ldcweb-cn-modal .modal-wrapper .modal-details{ padding:1vw 0; } #ldcweb-cn-modal .modal-details li > div{ margin:1vw 0; padding:2vw; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons{ flex-direction:row; align-items:center; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{ width:10vw; margin:0; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type{ margin:0 1vw 0; } } @media only screen and (min-width: 1440px){ #ldcweb-cn .col{ flex:4; } #ldcweb-cn-modal .modal-wrapper{ width:60vw; } #ldcweb-cn-modal .modal-btn-close{ width:2vw; height:2vw; } #ldcweb-cn-modal .modal-all .all-buttons > div:first-of-type{ margin:0 1vw 0 0; } #ldcweb-cn-modal .modal-all a{ width:15vw; padding:1vw 0; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{ width:8vw; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons label{ padding:1vw 0; } } @media only screen and (min-width: 1920px){ #ldcweb-cn p{ font-size:calc(var(--ck-w1-font-size-txt) * 1.25); } #ldcweb-cn .banner-title p{ font-size:calc(var(--ck-w1-font-size-title) * 1.25); } #ldcweb-cn .btns .btn{ font-size:calc(var(--ck-w1-font-size-btn-txt) * 1.25); } #ldcweb-cn-modal .modal-wrapper{ width:50vw; } #ldcweb-cn-modal .modal-btn-close{ width:2rem; height:2rem; } #ldcweb-cn-modal .modal-title .description, #ldcweb-cn-modal .modal-title > div a, #ldcweb-cn-modal .modal-all p, #ldcweb-cn-modal .modal-all a{ font-size:calc(var(--ck-w2-font-size-txt) * 1.25); } #ldcweb-cn-modal .modal-wrapper .modal-title{ padding:1vw; } #ldcweb-cn-modal .modal-title .title{ font-size:calc(var(--ck-w2-font-size-title) * 1.25); } #ldcweb-cn-modal .modal-title .title::after, #ldcweb-cn-modal .modal-title > div::after{ margin:1vw auto; } #ldcweb-cn-modal .modal-wrapper .modal-all{ padding:0 1vw 1vw; } #ldcweb-cn-modal .modal-all a{ width:13vw; padding:0.5vw 0; } #ldcweb-cn-modal .modal-wrapper .modal-details{ padding:0.5vw 0; } #ldcweb-cn-modal .modal-details li > div{ margin:0.5vw 0; padding:1vw; } #ldcweb-cn-modal .modal-details li span, #ldcweb-cn-modal .modal-details li a, #ldcweb-cn-modal .modal-details li label{ font-size:calc(var(--ck-font-size-list) * 1.25); } #ldcweb-cn-modal .modal-details .ldcweb-cn-infos span:first-of-type{ font-size:calc(var(--ck-font-size-list) * 1.5); } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons{ flex-direction:row; align-items:center; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{ width:5vw; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type{ margin:0 1vw 0; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons label{ padding:0.5vw 0; } }