|
- @fond: #2a2a2a;
- @fondSecondaire: #222222;
- @fondOptionHover: lighten(@fond, 10%);
- @texte: white;
- @couleurLien: white;
- @couleurPrincipale: red;
- @border: #5f5f5f;
- @borderHover: #808080;
- @borderFocus: white;
-
- ::selection {
- color: @fond;
- background-color: @texte;
- }
-
- .bouton {
- border: 2px solid grey;
- padding: 10px;
- padding-left: 15px;
- padding-right: 15px;
- margin: 5px;
- display: inline-block;
- border-radius: 14px;
- color: @texte;
- text-decoration: none;
-
- &:hover {
- color: @couleurPrincipale;
- border: 2px solid @couleurPrincipale;
- }
-
- }
-
- .petit-bouton {
- border: 2px solid grey;
- padding: 2px;
- padding-left: 10px;
- padding-right: 10px;
- margin: 5px;
- font-size: 80%;
- display: inline-block;
- border-radius: 14px;
- color: @texte;
- text-decoration: none;
-
- &:hover {
- color: @couleurPrincipale;
- border: 2px solid @couleurPrincipale;
- }
-
- }
-
- html {
- font-size: 20px;
- scrollbar-color: @texte @fond;
- scrollbar-width: auto;
- }
-
-
- a, a:visited {
- text-decoration: underline;
- color: @couleurLien;
- transition: all 0.1s linear;
-
- &:hover {
- text-decoration: none;
- color: @couleurPrincipale;
- }
-
- }
-
- .logo {
- margin-bottom: 10px;
- }
-
- img {
- height: auto;
- max-width: 100%;
- }
-
- .imgArticle {
- border: 1px white solid;
- border-radius: 5px;
- display: block;
- margin: auto;
- margin-top: 20px;
- margin-bottom: 20px;
- }
-
- del {
- text-decoration: line-through;
- }
-
- code, var, samp {
- font-family: "Ubuntu Mono", monospace;
- background-color: @fondSecondaire;
- padding: 5px;
- border-radius: 10px;
- font-style: normal;
- }
-
- body {
- font-family: "Ubuntu", sans-serif;
- padding: 0px;
- margin: 0px;
- background-color: @fondSecondaire;
- color: @texte;
- font-size: 25px;
- line-height: 35px;
- }
-
- address {
- font-style: normal;
- }
-
- ul {
- padding-left: 35px;
- margin: 0px;
- }
-
- dt {
- font-weight: 500;
- }
-
- dd {
- margin-left: 25px;
- padding-bottom: 10px;
- }
-
- p {
- margin: 0px;
- padding-top: 10px;
- padding-bottom: 10px;
- }
-
- .grille-services {
- display: grid;
- grid-template-columns: 1fr 1fr 1fr 1fr;
- grid-gap: 30px;
-
- @media (max-width: 1500px) {
- grid-template-columns: 1fr 1fr 1fr;
- }
-
- @media (max-width: 1000px) {
- grid-template-columns: 1fr 1fr;
- }
-
- @media (max-width: 600px) {
- grid-template-columns: 1fr;
- }
-
- }
-
- .titreService {
- font-size: 1.3em;
- text-align: center;
- }
-
- .metaService {
- text-decoration: none;
- font-size: 28px;
- margin-top: 6px;
- }
-
- .metasService {
- display: flex;
- flex-direction: row;
- justify-content: center;
- font-size: 0.8em;
- }
-
- .logoService {
- text-align: center;
- }
-
- .elLogoServ {
- max-width: 150px;
- max-height: 100px;
- color: @texte;
- }
-
- .descService {
- padding-top: 5px;
- padding-bottom: 10px;
- text-align: left;
- }
-
- .domService {
- font-family: "Ubuntu Mono", monospace;
- overflow-wrap: anywhere;
- margin-top: -6px;
- font-size: 0.8em;
- color: #eeeeee;
- }
-
- main {
- background-color: @fond;
- margin: 0px;
- padding: 30px;
- padding-top: 15px;
-
- @media (max-width: 500px) {
- padding-left: 10px;
- padding-right: 10px;
- }
- }
-
- .centre {
- text-align: center;
- justify-content: center;
- }
-
- article {
- margin-left: 20%;
- margin-right: 20%;
-
- @media (max-width: 1400px) {
- margin-left: 10%;
- margin-right: 10%;
- }
-
- @media (max-width: 800px) {
- margin-left: 0px;
- margin-right: 0px;
- }
- }
-
- #pres {
- text-align: center;
- line-height: 40px;
- margin-left: 100px;
- margin-right: 100px;
-
- @media (max-width: 1400px) {
- margin-left: 0px;
- margin-right: 0px;
- }
- }
-
- // FOOTER
-
- .textefooter {
- margin: 30px;
- line-height: 1.5em;
- text-align: center;
- }
-
- .interlude {
- display: flex;
- justify-content: center;
- }
-
- .traitinterlude > hr {
- display: none;
- }
-
- .traitinterlude {
- border-top: 2px gray dashed;
- width: 450px;
- }
-
- footer {
- text-align: center;
- display: flex;
- flex-direction: column;
- }
-
- .logofooter {
- padding-left: 6%;
- margin-top: 20px;
- text-align: center;
- }
-
- .liensfooter {
- display: flex;
- flex-direction: row;
- padding: 20px;
- }
-
- .lienfooter {
- margin: 10px;
- }
-
- /* ----------------------- HEADER ------------------------ */
-
- #lienHeader {
- margin: 0px;
- //border: 3px white solid;
- //border-top: none;
- //border-radius: 0px 0px 12px 12px;
- text-align: center;
- font-size: 2em;
- display: flex;
- justify-content: center;
- padding: 30px;
- padding-bottom: 20px;
- margin-left: 35px;
- margin-right: 35px;
-
- @media (max-width: 600px) {
- border: none;
- padding: 0px;
- margin-top: 20px;
- margin-left: 20px;
- margin-right: 20px;
- }
- }
-
- header {
- display: flex;
- justify-content: center;
- }
-
-
- #header:active {
- box-shadow: 2px 2px 3px white inset;
-
- }
-
- #header:hover {
- background-color: @fondOptionHover;
- transition: all 0.2s ease-in-out;
- @media (max-width: 600px) {
- background-color: inherit;
- }
- }
-
-
- // ----- TITRES -----
-
- h1, h2, h3, h4, h5, h6 {
- font-weight: normal;
- line-height: 100%;
- }
-
- h1 {
- font-size: 250%;
- text-align: center;
- margin: 0px;
- padding-bottom: 20px;
- padding-top: 15px;
- }
-
- h2 {
- font-size: 200%;
- margin-top: 50px;
- margin-bottom: 20px;
- }
-
- h3 {
- font-size: 160%;
- margin-top: 30px;
- margin-bottom: 10px;
- }
-
- h4 {
- font-size: 130%;
- margin-top: 0px;
- margin-bottom: 0px;
- }
-
- h5 {
- font-size: 115%;
- }
-
- h6 {
- font-size: 107%;
- }
-
- .gomeza {
- display: none; // Sera changé le moment voulu en JS
- position: fixed;
- bottom: 0px;
- left: 30px;
- z-index: 100;
- }
-
- // --- Formulaire ---
- /*
- input, textarea {
- border: 2px @border solid;
- border-radius: 10px;
- font-size: 20px;
- font-weight: normal;
- color: @texte;
- transition: border 0.1s linear;
- background-color: @fondSecondaire;
- margin-top: 8px;
- font-family: "Ubuntu", sans-serif;
- padding: 10px;
- margin: 10px;
-
- &:hover {
- border: 2px @borderHover solid;
- }
-
- &:focus {
- border: 2px @borderFocus solid;
- outline: none;
- }
- }
-
- input[type="text"] {
- width: 100px;
- }
-
- textarea {
- background-color: @fondSecondaire;
- color: @texte;
- scrollbar-color: @texte @fond;
- scrollbar-width: auto;
- width: 90%;
- }
-
- textarea::placeholder {
- color: @texteSecondaire;
- opacity: 1;
- font-family: "Ubuntu", sans-serif;
- font-weight: normal;
- font-size: 1em;
- }
- */
- @media (max-width: 800px) {
-
- .basfooter {
- flex-direction: column;
- }
-
- .logofooter {
- padding: 0px;
- }
-
- }
|