:root { --navy: #15262b; } .guides > li a dfn span, body.home main h2 > span { display: inline-block; } /* ------------------------------------------ BLOCK STYLE ------------------------------------------ */ #worlds a, #worlds a:visited, .guides a, .guides a:visited { color: white; } #worlds dt, #worlds dd, .benefits dt, .benefits dd, .guides > li a { position: relative; } #worlds dt:before, #worlds dd:before, .benefits dt:before, .benefits dd:before, .guides > li a { box-shadow: 0 0 1.00rem hsl(0, 100%, 100%, 0.5), 0 0rem 0.75rem hsla(0, 0%, 0%, 0.5), 0 0rem 0.5rem hsla(0, 0%, 0%, 0.75), 0 0rem 0.25rem hsla(0, 0%, 0%, 1); } /* #worlds dt:before, #worlds dd:before, .benefits dt:before, .benefits dd:before { content: " "; width: 100%; height: 100%; z-index: 10; display: block; top: 0; left: 0; position: absolute; } */ #worlds dt, .benefits dt { z-index: 50; } #worlds dd img, .benefits dd img { position: relative; z-index: 200; } .benefits dt, .benefits dd, #worlds dt, #worlds dd { border-style: solid; } .benefits dd, #worlds dd { font-weight: 600; } .benefits dt, #worlds dt { font-weight: bold; } /* --------------------------------------- RAISONS DE VENIR --------------------------------------- */ .benefits dd, .benefits dt { color: hsl(0, 0%, 20%); border-color: var(--navy); overflow: hidden; } .benefits a, .benefits a:visited { color: inherit; } .benefits dd { background-color: var(--nuage-1); } .benefits dt{ background-color: var(--nuage-1); } /* ------------------------------------------ MONDES ------------------------------------------ */ #worlds dt { font-weight: bold; } #worlds dd address { font-style: normal; } #worlds dt, #worlds dd { border-color: #ffff81; overflow: hidden; } #worlds dt { background-color: green; color: white; } #worlds dd { background-color: var(--marron); color: white; } /* ------------------------------------------ GUIDES ------------------------------------------ */ .guides > li a { border-color: transparent; background-image: linear-gradient(hsla(0, 0%, 100%, 0.6) 0%, hsla(0, 0%, 100%, 0.61) 100%), url("sprites/default_gravel.png"); background-size: cover, 25.5rem; } .guides > li a > span, .guides > li a img { background-color: transparent; color: black; } .guides > li a dfn, .guides > li a:visited dfn { background-color: hsl(0, 0%, 15%); color: hsl(0, 0%, 95%); } .guides > li a:hover { transform: scale(1.05); border-color: black; } .guides { counter-reset: num-tuto; } .guides > li a, .guides > li a:visited { text-decoration: none; }