/* TODO customize this sample style Syntax recommendation http://www.w3.org/TR/REC-CSS2/ */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; background: transparent; } /* =HTML5 --------------------------------------------------------------------------------*/ article,aside,canvas,details,figcaption,figure, footer,header,hgroup,menu,nav,section,summary { display:block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } textarea{ overflow:auto; font-size:1em; } fieldset{ display:block; } input, select{ margin:0; padding:0; outline:0; } input, label, select{ vertical-align:middle; font-size:1em; } legend{ margin-left:-7px; } /* remember to define focus styles! */ :focus { /*outline: 0;*/ } /* remember to highlight inserts somehow! */ ins { text-decoration: none; } del { text-decoration: line-through; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: collapse; border-spacing: 0; } /* resolve strict doctype behaviour */ object, embed{ display:block; margin-left:auto; margin-right:auto; } body{font-size: 11px; font-family:Lato-Regular, Arial;} input, textarea, select{font-family:Lato-Regular, Arial;} hr { border-color: #ccc; border-style: solid; border-width: 1px 0 0; clear: both; height: 0; } /* =Headings --------------------------------------------------------------------------------*/ h1{font-size:24px;font-weight: normal;} h2,.sub-title{font-size: 22px;font-weight: normal;} h3{font-size: 20px;font-weight: normal;} h4{font-size: 18px;font-weight: normal;} h5{font-size: 16px;font-weight: normal;} h6{font-size: 14px;font-weight: normal;} p{font-size: 11px;} a{outline:0 none;} @font-face { font-family: 'Lato-Bold'; src: url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-bold-webfont.eot'); src: url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-bold-webfont.eot?#iefix') format('embedded-opentype'), url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-bold-webfont.woff') format('woff'), url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-bold-webfont.ttf') format('truetype'), url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-bold-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'Lato-Light'; src: url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-light-webfont.eot'); src: url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-light-webfont.eot?#iefix') format('embedded-opentype'), url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-light-webfont.woff') format('woff'), url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-light-webfont.ttf') format('truetype'), url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-light-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'Lato-Regular'; src: url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-regular-webfont.eot'); src: url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-regular-webfont.eot?#iefix') format('embedded-opentype'), url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-regular-webfont.woff') format('woff'), url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-regular-webfont.ttf') format('truetype'), url('//static.cybercartes.com/layouts/cyb_default/fonts/lato-regular-webfont.svg#webfont') format('svg'); } html{ /*background:url("//static.cybercartes.com/layouts/cyb_default/img/hp/3/cybercartes_01.png") repeat left top;*/ color:#45373f; -webkit-text-size-adjust:none; -o-text-size-adjust:none; } body a{ color:#fff; } .clear{ clear:both; font-size:0; } #feedback-new-site { /****Temporaire****/ position: fixed; z-index: 1000; right: 0px; top: 175px; } #facebbok-like{ /*-----Xavier------*/ margin: 0 0 0 31px; /*déplacé de catalogue.css*/ display: inline; /*idem*/ background:url("//static.cybercartes.com/layouts/cyb_default/img/hp/3/cybercartes_15.png") no-repeat top left; color: #305D9A; float: left; font-size: 15px; height: 39px; padding: 70px 0 0 100px; position: relative; width: 118px; z-index: 100; _visibility:hidden; } .action-like{ display:block; margin:0 0 0 52px; padding:15px 0 0 39px; /*background:url( hp/3/cybercartes_04.png") no-repeat left top;*/ min-height:33px; } .top-banner { width: 970px; margin:0 auto; padding:8px 0 0 0; border:0; } #menuMainEntries { display: none; } /* MEGA BAN */ .wrap-top{ position:relative; display:block; background-color: #AD0054; z-index:2; min-width: 1044px; } .wrap-top-inner{ position:relative; width:1044px; height:82px; margin:0 auto; } .wrap-top-inner-hp{ height:188px; } .left-header{ display: flex; float: left; height: 100%; align-items: center; } .right-header{ float: left; display: flex; align-items: center; height: 100%; width: 23px; } .my-cybercatre{ float:right; padding:0 33px 0 0; background:url("//static.cybercartes.com/layouts/cyb_default/img/hp/3/cybercartes_07.png") no-repeat right center; font-size:12px; font-weight:normal; font-family:Lato-Regular, Arial; text-decoration:none; line-height:16px; _line-height:18px; margin:7px 4px 13px 0; position:relative; overflow:hidden; color:#fff; display:none; } .my-cybercatre:hover{ text-decoration:underline; } #searchElem { display: none; width:100% } #nav ul li#navSearchContainer { display: flex; align-items: center; justify-content: flex-end; } #allSearchContainer { overflow: hidden; display: flex; justify-content: flex-end; border-radius: 35px; -moz-border-radius: 35px; -webkit-border-radius: 35px; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; transition: all 0.3s; } #searchBtnContainer { width: 40px; height: 40px; border-radius: 35px; -moz-border-radius: 35px; -webkit-border-radius: 35px; overflow: hidden; } .searchForm { display: block; width: 170px; float: left; z-index: 2; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; transition: all 0.5s; } #navSearchContainer .key-searched{ line-height:40px; background:transparent; font-size:15px; color:#fff; float:left; border:0; font-family:Lato-Regular, Arial; } .searchCloseBtn { display: flex; width: 38px; height: 38px; align-items: center; justify-content: center; position: absolute; right: -13px; top: 22px; border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; transition: visibility 0s, opacity 0.5s linear; } #searchCloseBtn:hover { background-color: #860041; } #searchCloseBtn img { width: 35px; } #searchInput::placeholder { color: #3f0320; } .hidden { display: none; } .visuallyhidden { opacity: 0; } /* //MEGA BAN */ /* catalog 2022 flex */ #cardItems-list, #cardSaintItems-list { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: flex-start; align-content: flex-start; } #cardSaintItems-list { padding: 15px 0 60px 0; background-color: #EBF0F2; margin-bottom: 24px; } .cardItem { width: 310px; height: 274px; margin: 0 25px 50px 25px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; box-shadow: rgba(149, 157, 165, 0.2) 0px 0px 12px; background-color: #fff; } #cardSaintItems-list .cardItem { margin-bottom: 0px; } .cardItem:hover .cardItem-thumb img { -moz-transform: scale(1.06); -webkit-transform: scale(1.06); transform: scale(1.06); -moz-transition: all 0.8s; -webkit-transition: all 0.8s; transition: all 0.8s; } .cardItem.bread div, .cardItem.secondBread div { margin: 8px 5px 0px 5px; } .cardItem-thumb { display:block; overflow: hidden; } .cardItem-thumb img { width: 310px; -moz-transition: all 0.8s; -webkit-transition: all 0.8s; transition: all 0.8s; } .cardItem-thumb, .cardItem-thumb img { border-radius: 10px 10px 0 0; -moz-border-radius: 10px 10px 0 0; -webkit-border-radius: 10px 10px 0 0; } #cardSaintItems-list .cardItem-thumb, #cardSaintItems-list .cardItem-thumb img { border-radius: 0 0 10px 10px; -moz-border-radius: 0 0 10px 10px; -webkit-border-radius: 0 0 10px 10px; } #cardSaintItems-list .cardItem-thumb { position: relative; } .multiNamesBtnContainer{ display:flex; flex-direction: column; height: 186px; } .multiNamesBtnContainer.max { flex-wrap: wrap; padding: 5px 10px 10px 10px; background-color: #A8E1F6; height: 171px; border-radius: 0 0 10px 10px; } .multiNameButton { flex: 1 1 0; background-color: #EDFCF5; margin: 0 10px 10px 10px; position: relative; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -moz-transition: all 0.8s; -webkit-transition: all 0.8s; transition: all 0.8s; } .multiNameButton:hover { background-size: 150%; -moz-transition: all 0.8s; -webkit-transition: all 0.8s; transition: all 0.8s; } .multiNameButtonMax { color: #45373f; font-size: 14px; font-family: Lato-Bold, Arial; margin: 5px; } .bg0 { background-image: url("https://static.cybercartes.com/data/saints/saint_17.jpg"); background-position: 10% 27%; background-size: 140%; } .bg1 { background-image: url("https://static.cybercartes.com/data/saints/saint_22.jpg"); background-position: 30% 41%; background-size: 140%; } .bg2 { background-image: url("https://static.cybercartes.com/data/saints/saint_24.jpg"); background-position: 19% 83%; background-size: 140%; } .bg3 { background-image: url("https://static.cybercartes.com/data/saints/saint_13.jpg"); background-position: 0% 58%; background-size: 160%; } .multiNameButton .nameGD { color: #45373f; position: absolute; z-index: 1; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 16px; font-family: Lato-Bold, Arial; } .cardItem-texts { display: block; padding: 15px; } #cardSaintItems-list .cardItem-texts { height: 58px; } .cardItem-title { display: block; font-family: Lato-Bold, Arial; text-decoration: none; font-size: 16px; color: #45373f; } #cardSaintItems-list .cardItem-title { font-size: 20px; } .cardItem-description { display: block; font-family: Lato-Regular, Arial; font-size: 11px; color: #9D9D9D; line-height: 12px; padding-top: 6px; } #cardSaintItems-list .cardItem-description { font-size: 14px; padding-top: 5px; } .cardItem-description-saint { display: block; font-family: Lato-Regular, Arial; font-size: 16px; color: #45373f; padding-top: 12px; } .saint-separator { height: 1px; width: 80%; border-bottom: 1px solid #EBF0F2; margin: 0 auto; margin-bottom: 20px; } .new{ position: absolute; margin: 4px; padding: 5px; z-index:10; background-color: #F4E42D; color: #45373f; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; } /* //catalog 2022 flex */ .wrap-content{ position:relative; display:block; } .wrap-content-inner{ position:relative; width:994px; margin:0 auto; overflow:hidden; padding:30px 15px 0 15px; } /*nav*/ #nav li h2{ font-size:16px; } #nav li h2 a{ text-decoration:none; display:inline-block; } #nav{ display:block; width: 100%; height: 100%; float:left; } .mainMenuList { display: flex; justify-content: center; } .mainMenuList li { list-style: none outside none; } .mainMenuList li a { display: block; text-decoration: none; color:#fff; font-family:Lato-Regular, Arial; cursor:pointer; transition: 0.3s; } .mainEntrie { font-size: 18px; line-height: 82px; padding-left: 28px; padding-right: 28px; margin:0; } .mainMenuList li:hover .mainEntrie { background-color: #900448; } #nav ul li a.active { box-shadow: inset 0 -6px 0 #860041; } /* NAV 2*/ .dropdown { visibility: hidden; opacity: 0; min-width: 5rem; position: absolute; transition: all 0.5s ease; left: 0; display: none; flex-direction: row; justify-content: flex-start; padding: 3%; background-color: #900448; border-radius: 0 0 10px 10px; -moz-border-radius: 0 0 10px 10px; -webkit-border-radius: 0 0 10px 10px; box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 4px; /* visibility: visible; opacity: 1; display: flex; */ width: 94%; top: 82px; } .dropdown li{ padding: 0 25px; border-right: solid 1px #AD0054; } .dropdown li:last-child { border-right: none; } .dropdown li a { line-height: 40px; font-size: 16px; padding: 0 10px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .dropdown li a:hover { background-color: #AD0054; } #nav ul li:hover > ul, #nav ul li:focus-within > ul, #nav ul li ul:hover, #nav ul li ul:focus { visibility: visible; opacity: 1; display: flex; } /**/ /* Logo */ #cc_svg_logo { fill: #fff; width: 104px; margin-left: 10px; margin-right: 25px; height: 82px; -moz-transition: all 0.4s; -webkit-transition: all 0.4s; transition: all 0.4s; } #cc_text { fill: #fff; } #petales path { -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } #nav ul li a.logo { display: flex; align-items: center; padding: 0; height: 100%; box-shadow: 23px 0px 0px -22px #7e043f; -moz-transition: all 0.4s; -webkit-transition: all 0.4s; transition: all 0.4s; } #nav ul li a.logo:hover { background-color: inherit; box-shadow: inherit; } #nav ul li a.logo:hover #cc_svg_logo { -moz-transform: scale(1.24); -webkit-transform: scale(1.24); transform: scale(1.24); -moz-transition: all 0.4s; -webkit-transition: all 0.4s; transition: all 0.4s; } #nav ul li a.logo:hover #petales path { animation-delay: calc(var(--order) * 220ms); } #nav ul li a.logo:hover #petale-1 { animation: fadeIn-1 0.5s ease forwards; } #nav ul li a.logo:hover #petale-2 { animation: fadeIn-2 0.5s ease forwards; } #nav ul li a.logo:hover #petale-3 { animation: fadeIn-3 0.5s ease forwards; } #nav ul li a.logo:hover #petale-4 { animation: fadeIn-4 0.5s ease forwards; } #nav ul li a.logo:hover #petale-5 { animation: fadeIn-5 0.5s ease forwards; } #nav ul li a.logo:hover #cc_text { animation: fadeIn-text 0.5s ease forwards; animation-delay: calc(var(--order) * 10ms); } @keyframes fadeOut-text { 100% { fill: #fff; } } @keyframes fadeIn-text { 100% { fill: #22363D; } } @keyframes fadeIn-1 { 100% { fill: #7F6DC0; } } @keyframes fadeIn-2 { 100% { fill: #05A885; } } @keyframes fadeIn-3 { 100% { fill: #DB006A; } } @keyframes fadeIn-4 { 100% { fill: #F4E42D; } } @keyframes fadeIn-5 { 100% { fill: #A8E1F6; } } /*/Logo*/ #nav ul li a#searchBtn { display: flex; align-items: center; justify-content: center; height: 100%; padding-right: 0; padding-left: 0; z-index: 100; } #nav ul li a#searchBtn:hover { /*background-color: #fff;*/ /*background-color: inherit;*/ background-color: #860041; } #nav ul li a#searchBtn img { padding-bottom: 2px; padding-right: 2px; } #nav ul li .area-submenu{ display:none; visibility:hidden; } #nav ul li.hover .area-submenu{ display: inline; visibility: visible; position: absolute; z-index: 10; font-weight: normal; margin: 0; left: 24px; top: 82px; box-shadow: rgb(73 10 22 / 30%) 0px 5px 5px; } #nav ul li.hover ul{ margin: 0; padding: 20px 0px 0 20px; border: 0; width: 976px; height: 128px; position: relative; background: #900448; line-height: 15px; font-size: 14px; font-family: Lato-Light, Arial; display: block; } #nav ul li.hover ul li { font-size: 13px; background: none; cursor: default; border-left: 1px solid #AD0054; height: 79px; margin-top: 10px; color: #FFFFFF; display:inline-block; } #nav ul li.hover ul li a { color: #FFFFFF; display: inline-block; font-size: 16px; height: 30px; overflow: hidden; text-decoration:none; font-family:Lato-Regular, Arial; padding-left: 40px; padding-right: 25px; margin:0; clear:both; padding-top:0; } #nav ul li.hover ul li a:hover{ text-decoration:underline; color: #FFFFFF; } #nav ul li.hover ul li a { line-height: 20px; } /*nav fin*/ .card-name { font-family:Lato-Light, Arial; font-size: 30px; } .card-category { font-size: 15px; font-family:Lato-Bold, Arial; } .active-card{ background:url("//static.cybercartes.com/layouts/cyb_default/img/hp/3/cybercartes_22.png") no-repeat; height: 10px; width: 12px; margin-left: 135px; } .arrow-active-card{ width: 555px; margin:0 auto; } .top-day{ color: #FFFFFF; float: right; height: 110px; position: relative; text-align: center; width:575px; } .bg-tday{ position:absolute; right:0; top:0; width:633px; height:110px; background:url("//static.cybercartes.com/layouts/cyb_default/img/hp/3/cybercartes_41.png") no-repeat 10px top; } .top-day .flowers{ background: url("//static.cybercartes.com/layouts/cyb_default/img/hp/3/cybercartes_53.png") no-repeat 0 0; bottom: -25px; height: 39px; position: absolute; right: 253px; width: 59px; z-index: 10; } .top-day .day{ display: block; font-family:Lato-Light, Arial; font-size: 9pt; left: 220px; padding: 5px 0; position: absolute; top: 1px; width: 163px; text-align: center; } .top-day .day strong{ font-family:Lato-Bold, Arial; font-size:13px; } .party-person{ color: #43363C; display: block; font-family:Lato-Light, Arial; font-size: 13px; padding-left: 0; padding-top: 30px; position: relative; width: 575px; } .party-person a.msg-party{ color: #43363C; display: block; font-size: 24px; line-height:32px; padding: 0 0 0 10px; text-decoration: none; } .party-person .msg-party strong{ font-family:Lato-Bold, Arial; font-size: 24px; color:#45353f; } .party-person .date{ color: #44363E; display: block; font-family:Lato-Light, Arial; font-size: 15px; line-height:15px; } .party-person .date a{ color: #44363E; font-family:Lato-Light, Arial; font-size: 11pt; text-decoration: none; } .party-person .date strong{ font-family:Lato-Bold, Arial; font-size: 15px; } .party-person .show-all-firstname{ font-size:11px; color:#bd005a; padding:0 12px 0 0; background:url("//static.cybercartes.com/layouts/cyb_default/img/hp/3/cybercartes_43.png") no-repeat right 2px; font-family:Lato-Bold, Arial; text-decoration:none; height:15px; display:inline-block; margin:0 3px 6px 10px; } .party-person .show-all-firstname span{ border-bottom:1px solid transparent; display:block; color:#bd005a; font-family:Lato-Light, Arial; font-size:12px; } .party-person .show-all-firstname:hover span{ border-bottom:1px solid #bd005a; } /*----------FOOTER------------*/ footer { margin-top: 20px; background-color: #22363D; } footer * { color: #EBF0F2; list-style: none; text-decoration: none; font-family: Lato, Arial, sans-serif; } footer ul { margin:0; padding: 0; } .footerZone { max-width: 1050px; margin: 0 auto; padding: 40px 0; } .top-footer { display: flex; justify-content: center; padding-bottom: 0px; } .top-footer svg { margin: 0 20px; } .top-footer:before, .top-footer:after { content: ""; flex: 1 1; border-bottom: 1px solid #172B33; margin: auto; } .main-footer { display: flex; flex-direction: row; } .main-footer .listZone, .main-footer .btnZone { width: 50%; } .main-footer .listZone { display: flex; justify-content: space-around; } .main-footer .listZone .footerTitle { font-family: Lato-Bold; font-size: 20px; margin-bottom: 20px; } .main-footer .listZone a { font-size: 14px; line-height: 30px; } .main-footer .listZone a:hover { text-decoration: underline; } .main-footer .btnZone { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; } .main-footer .btnZone > a:first-child { border: 3px solid; font-family: lato-Bold, Arial; } .main-footer .btnZone > a { display: flex; justify-content: center; width: 60%; padding: 15px 0px; border: 1px solid #EBF0F2; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; margin-bottom: 45px; font-size: 16px; } .main-footer .btnZone > a:hover { background-color: #172B33; border-color: } .main-footer .btnZone .socials { min-width: 60%; display: flex; flex-direction: row; justify-content: space-between; } .main-footer .btnZone .socials a { display: flex; align-items: center; justify-content: center; padding: 10px 12px; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; } .main-footer .btnZone .socials a:hover { background-color: #172B33; } .apps-footer { border-top: 1px solid #172B33; border-bottom: 1px solid #172B33; } .apps-footer ul { display: flex; flex-direction: row; justify-content: space-around; } .apps-footer a { display: flex; flex-direction: column; align-items: center; padding: 20px; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; } .apps-footer a:hover { background-color: #172B33; } .apps-footer a span { font-size: 16px; margin-bottom: 14px; } .bottom-footer p { font-size: 12px; margin: 0 30px; line-height: 16px; } /*--------------------------*/ /*------Railroad---------*/ .cartes-list-top .path{ float:left; padding:5px 0 6px 0; } .cartes-list-top .path li{ float:left; } .cartes-list-top .path li.separator{ width:5px; height:11px; text-indent:-9999px; font-size:0; padding:0 12px 0 6px; background:url("//static.cybercartes.com/layouts/cyb_default/img/catalog/arrow-path.png") no-repeat 10px 4px; } .cartes-list-top .path span{ padding:0; margin:0; border:0; font-size:14px; } .cartes-list-top .path a{ color:#ca096d; text-decoration:none; font-family:Lato-Regular, Arial; float:left; line-height:11px; } .cartes-list-top .path a:hover { text-decoration: underline; } .cartes-list-top .path .last a{ font-family:Lato-Bold, Arial; } .cartes-list-top .path .last a:hover{ text-decoration: none; } .cartes-list-top .filter-by{ float:right; display:none !important; } .cartes-list-top .title{ float:left; font-family:Lato-Regular, Arial; line-height:14px; color:#606164; font-size:14px; padding:5px 13px 4px 0; } .cartes-list-top .list-filters{ float:left; padding:1px 5px 1px 1px; background:url("//static.cybercartes.com/layouts/cyb_default/img/catalog/populate-top-list.png") no-repeat 0 0; width:199px; height:21px; } .cartes-list-top .list-filters li{float:left;} .cartes-list-top .list-filters li.nouveaute a{ float:left; padding:5px 18px 6px 19px; background:url("//static.cybercartes.com/layouts/cyb_default/img/catalog/black-btn-list.png") no-repeat 0 0; width:65px; height:10px; font-family:Lato-Regular, Arial; line-height:8px; color:#fff; font-size:14px; text-decoration:none; } .cartes-list-top .list-filters li.popularite{ padding-left:8px; } .cartes-list-top .list-filters li.popularite a{ float:left; padding:5px 0 6px 20px; background:url("//static.cybercartes.com/layouts/cyb_default/img/catalog/coeur_plein_catalog.png") no-repeat 0 7px; font-family:Lato-Regular, Arial; line-height:8px; color:#45373f; font-size:14px; text-decoration:none; } /********* * Autres * *********/ .bigInput { color: #757575; margin-right: 10px; float: left; font-size: 22px; height: 32px; width: 260px; border-width: 1px; border-style: solid; border-color: #B6B6B6; padding-left: 8px; } .bigInput:hover { border-width: 1px; border-style: solid; border-color: #00B8FF; /*-moz-box-shadow: inset 0 0 5px #9E9E9E; -webkit-box-shadow: inset 0 0 5px #9E9E9E; box-shadow: inset 0 0 5px #9E9E9E;*/ } .bigInput:focus { border-width: 1px; border-style: solid; border-color: #00B8FF; -moz-box-shadow: inset 0 0 1px 0px rgba(0, 0, 0, 0.72); -webkit-box-shadow: inset 0 0 1px 0px rgba(0, 0, 0, 0.72); box-shadow: inset 0 0 1px 0px rgba(0, 0, 0, 0.72); background-color: #F2F7FF; } .fontBold{ font-family: Lato-Bold, Arial; } .fontLight{ font-family: Lato-Light, Arial; } .fontUpper{ text-transform: uppercase; } #isNotForLittleChild { padding:25px; font-size:16px; line-height:18px; text-align:center; } #isNotForLittleChild .warning { font-size:18px; font-weight:bolder; color:#BD005A; } #isNotForLittleChild strong { font-size:12px; color:#BD005A } #isNotForLittleChild a { display:inline-block; width:100px; height:35px; line-height:35px; margin-top:10px; text-decoration:none; background:#BD005A; color:#fff; } #isNotForLittleChild a:hover { background:#f20075; } #isNotForLittleChild #noncaira { background:#eee; color:#555; } #isNotForLittleChild #noncaira:hover { background:#eee; } #suggestion-popin { padding:25px; font-size:16px; line-height:18px; position: absolute; overflow: auto; background-color: #FFF; z-index: 9999; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; } #suggestion-overlay, #formPopin-overlay { position: absolute; top: 0px; left: 0px; width: 100%; height: 350%; background-color: #777; opacity:0.5; z-index: 9998; } #suggestion-popin p { position: relative; display: block; padding: 20px; background: #d2effb; cursor:pointer; font-size: 18px; line-height: 26px; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; margin-bottom: 10px; } #suggestion-popin p:hover { background:#f20075; color:#fff; } #freeRibbon { position: fixed; right: 0; top: 0; z-index: 1000; } /*------FB Banner---------*/ .fbBanner { display:block; padding:0; min-width: 1024px; background:url("//static.cybercartes.com/layouts/cyb_default/img/hp/3/cybercartes_44.png") repeat scroll 0 0 transparent; } .fbBanner-inner { height: auto; margin: 6px auto 0 auto; overflow: hidden; padding: 14px 0 14px 24px; position: relative; width: 1000px; clear: both; } .fbBanner-inner .fbLinkBloc { float: left; clear: both; } .titleZone { width: 320px; float: left; text-align: center; margin-top: 29px; margin-right: 65px; } .title { font-family:Lato-Light, Arial; font-size:37px; color:#45373f; } #becomeFanLink { font-family:Lato-Light, Arial; font-size:20px; color:#45373f; text-decoration: none; } #fbComplementLink img { margin-top: 15px; } .fbBanner-inner .fbPlugin { float: right; } .fbBanner-inner .fbPlugin iframe { background-color: #ffffff; } .fbMin { font-size:25px; } .fbName { font-family:Lato-Bold, Arial; color: #25559b; } .dotLine { padding: 0px 0px 70px 0px; height: 1px; background-image: url(../../img/dotted_line.png); background-repeat: repeat-x; } /*------No search Result---------*/ #noResultImg { display: block; width: 90px; margin: 0 auto; } .preTitle { font-size: 20px; color: #969596; margin-bottom: 10px; margin-top: 20px; text-align: center; } .postTitle { font-size: 20px; color: #969596; margin-top: 20px; text-align: center; } .searchBlockTitle { text-align: center; font-size: 28px; margin-bottom: 50px; } #noResultContainer { border-bottom: 1px dashed #C6C6C7; } #searchInputResultSearch::placeholder { color: #96959682; font-size: 18px; } #noResultContainerInner { padding: 20px 0 100px 0; margin: 0 auto 0 auto; width: 80%; } #searchBlock { padding-top: 20px; padding-bottom: 20px; width: 455px; margin: 0 auto; } #noResultContainer .search .key-searched { font-size: 30px; } #boutonRech { height: 34px; width: 174px; background: url(//static.cybercartes.com/layouts/cyb_default/img/catalog/rech.png); cursor: pointer; border: none; } #boutonRech:hover { background: url(//static.cybercartes.com/layouts/cyb_default/img/catalog/rech_hover.png); } @media only screen and (max-width: 530px) { #noResultContainerInner { width: 90%; } #searchBlock { width: 100%; } #searchInputResultSearch { display: block; float: none; margin: 0 auto; } #boutonRech { display: block; float: none; margin: 0 auto; margin-top: 10px; } } /*------COOKIES Banner---------*/ #cookie_choice { display: none; z-index: 2000; padding: 5px 15px; overflow: hidden; position: fixed; top: 0; left: 0; width: 100%; background-color: #fff; color: #999; font-size: 13px; font-family: Arial,Helvetica,sans-serif; box-sizing: border-box; border-bottom: 1px solid #ccc; text-align: center; } #cookie_choice_info { margin-left: 5px; } #cookie_choice_close { margin-left: 25px; } #cookie_choice a, #cookie_choice a:hover, #cookie_choice a:active, #cookie_choice a:visited { color: #000; text-decoration: underline; } @media screen and (min-width: 768px) { #cookie_choice { padding: 5px 30px } } @media print { #cookie_choice { display: none } } /*------CMP sensib Banner---------*/ #sensib_banner { display: none; width: 96%; background-color: #670089; position: absolute; bottom: 0; left: 0; position: fixed; z-index: 99999; color: #fff; text-align: center; padding:0 2% 30px; } #cmp_s_closeBtnContainer { position: absolute; top: 12px; right: 0; text-decoration: none; font-size: 16px; width: 40px; } #cmp_s_closeBtn { display: block; width: 100%; text-decoration: none; } #cmp_s_title { font-size: 16px; font-family: Lato-Bold, arial; margin-top: 20px; margin-bottom: 18px; } #iCircle { background: #fff; color: #670089; padding: 0px 7px; border-radius: 56%; -moz-border-radius: 56%; -webkit-border-radius: 56%; font-size: 16px; } #cmp_s_mainText { font-size: 18px; font-family: Lato-Regular, arial; margin: 10px auto; } .cmp_s_secondText { font-size: 16px; font-family: Lato-Light, arial; margin-top: 10px; margin-bottom: 12px; } #cmp_s_knowMoreText { margin-bottom: 18px; } #cmp_s_knowMoreBtn { font-size: 14px; text-decoration: underline; } #cmp_s_acceptBtn { background-color:#fff; display:inline-block; cursor:pointer; color:#670089; font-size:14px; padding:12px 29px; text-decoration:none; font-family: Lato-Bold, arial; border-radius: 28px; -moz-border-radius: 28px; -webkit-border-radius: 28px; } #cmp_s_secondTextMin { display: none; } #proposal-Popin { display:none; align-items: center; max-width:85%; border-radius:20px; background-color: #EBF0F2; color: #45373F; } #proposal-Popin #appIcon { margin-bottom: 20px; } #proposal-Popin p { font-size: 22px; text-align: center; line-height: 26px; } #proposal-Popin #dlAppBtn { display: block; background-color: #DB006A; width: 100%; text-align: center; text-decoration: none; padding: 20px 0; font-size: 19px; font-family: 'Lato-Light'; border-radius: 20px; margin: 44px auto; } #proposal-Popin #noDlAppBtn { border: none; text-decoration: underline; font-size: 18px; color: #45373F; font-family: 'Lato-Regular'; } @media only screen and (max-width: 430px) { #sensib_banner { padding: 0 2% 22px; } #cmp_s_title { margin-top: 12px; } #cmp_s_mainText { font-size: 14px; } #cmp_s_secondTextMax { display: none; } #cmp_s_knowMoreBtn { font-size: 13px; } #cmp_s_acceptBtn { font-size: 12px; padding: 10px 25px; } #cmp_s_secondTextMin { display: block; font-size: 12px; margin-bottom: 8px; } } /* @media (prefers-color-scheme: dark) { body { background-color: #1c1c1e; color: #fefefe; } a { color: #5fa9ee; } img { filter: grayscale(20%); } .mobile-header{ background: #796ce8; } } */