/* Custom Obelix font definition : */ @font-face{ font-family: "Lapsus Pro Bold"; src: url("../fonts/lapsus-pro.ttf"); } *, *::before, *::after { box-sizing: border-box; } .zone_txt { display: block; background-color: rgba(88, 159, 218, 0.798); width: 90vw; margin-left: auto; margin-right: auto; padding: 5vw; font-size: 2rem; margin-top: 40px; border-radius: 15px; color: black; z-index: 1; } html { font-size: 20px; } body { font-family: 'Lapsus Pro Bold'; font-size: 1rem; padding: 0; margin: 0; display: flex; flex-direction: column; justify-content: space-between; } .bg{ background-attachment: fixed,fixed; -webkit-background-attachment: fixed,fixed; background-color: #499135; background-repeat: no-repeat, no-repeat; background-size: auto,cover; -webkit-background-size: auto,cover; -moz-background-size: auto,cover; -o-background-size: auto,cover; position: fixed; height: 100vh; width: 100vh; /* s/o coconut.jpeg */ z-index: -10000000; } /* papier peint pour petits écrans (smartphones) */ @media all and (max-width: 800px) { .bg{ background-position: center center, center center; background-size: auto,cover; background-attachment: scroll,scroll; -webkit-background-attachment: scroll,scroll ; } } main { text-align: center; height: 100%; } a.link { text-decoration: none; color: #FFDC00; -webkit-text-stroke: 1px black; } a.link:hover { color: white; -webkit-text-stroke: 1px white; } a.linkmail { font-family: arial, sans-serif; font-weight: bold; text-decoration: none; color: #FFDC00; } a.linkmail:hover { color: white; -webkit-text-stroke: 1px white; } /* BEGIN PANCARTE */ .pancarte { display: inline-block; position: relative; padding: 10px; margin: 40px 10vw 0; font-size: 2.5px; background-color: #a06827; border-top: solid 2em #a06827; border-left: solid 2em #a06827; border-right: solid 2em #a06827; border-bottom: solid 2em #332806; border-radius: 10px; z-index: 1; } /* ajoute une petite marge au dessus de la pancarte sur mobile pour laisser de la place a la navbar ajuste aussi la taille du texte de la pancarte */ @media all and (max-width: 800px) { .pancarte{ margin-top: 10vh; } } .pancarte .title { padding: 3vw 4.5vw; color: black; font-size: 1.5rem; } .circles-top { top: 3em; } .circles-bottom { bottom: 3em; } .circles::after, .circles::before { content: ""; position: absolute; display: block; width: 2em; height: 2em; top: inherit; bottom: inherit; border-radius: 100%; background: black; opacity: .9; } .circles::before { left: 3em; } .circles::after { right: 3em; } /** END PANCARTE **/ .menu_space_bottom { position: sticky; width: 100%; opacity: 0; left: 0; bottom: 0; padding: 0; margin: 0; } .complete-wrapper { flex: 1 0 auto; padding-bottom: 60px; } footer { display: block; flex-shrink: 0; background-color: #74c457; background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%237ee15e' fill-rule='evenodd'%3E%3Cpath d='M0 40L40 0H20L0 20M40 40V20L20 40'/%3E%3C/g%3E%3C/svg%3E"); border-radius: 20px 20px 0 0; -webkit-box-shadow: 0 0 8px -1px rgba(8, 10, 13, 0.34); box-shadow: 0 0 8px -1px rgba(8, 10, 13, 0.34); width: 100%; padding: 50px; font-size: 1rem; color: black; z-index: 1; } .footer-text-area { width: 80%; max-width: 800px; margin-top: 2vh; margin-left: auto; margin-right: auto; font-size: 3vh; } /* general purpose css */ ul { padding: 0; } li { list-style: none; } h1, h2, h3, h4, h5, h6 { font-weight: unset; } section { overflow: hidden; max-width: 1000px; } #main_content { padding-top: 20px; } .pc_container{ text-align: center; }