Nos partenaires et nous-mêmes utilisons différentes technologies, telles que les cookies, pour personnaliser les contenus et les publicités, proposer des fonctionnalités sur les réseaux sociaux et analyser le trafic. Merci de cliquer sur le bouton ci-dessous pour donner votre accord. Vous pouvez changer d’avis et modifier vos choix à tout moment. Informations RGPD
:root { --couleur-fond: #424242; --couleur-fond: #353535; --bordure-int: #989898; --bordure-bloc: #111; } .app { width: 550px; font-family: 'Roboto', sans-serif; background-color: #282828; padding: 10px; box-sizing: border-box; border: 1px solid #2c2c2c; margin: auto; position: relative; } .app h2,.app h3 { font-family: 'Montserrat', sans-serif; margin:0; text-transform: uppercase; letter-spacing: 2px; font-size: 12px; font-weight: bold; } .app h2 { background-color: var(--couleur-fond); text-align: center; color: #f2f2f2; padding: 30px 0; border: 1px solid var(--bordure-bloc); } .app h3 { color: var(--couleur-fond2); margin-bottom: 10px; } .app-basics, .joueur { display: -webkit-box; display: -ms-flexbox; display: flex; } .app-info { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 360px; } .app ul { border: 1px solid var(--bordure-bloc); border-top: 0; border-bottom: 0; padding:10px 15px; margin: 0; list-style-type: none; font-size: 10px; background: var(--couleur-fond2); color: #aaa; height: 260px; overflow: auto; } .app ul li { border-bottom: 1px solid #2c2c2c; padding: 7px 0 7px; display: block; } .app ul li:last-child { border-bottom: 0; } .app ul li label { color: inherit; width: 30%; display: inline-block; font-weight: bold; text-transform: uppercase; font-family: 'Montserrat', sans-serif; } .app .app-avatar { padding: 20px; background: #303030; box-sizing: border-box; } .app .app-avatar img { vertical-align: middle; height: 320px; width: 200px; } .app-quote { line-height: 11px; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; background: #1d1d1d; display: inline-block; font-size: 8px; text-transform: uppercase; letter-spacing: 1px; color: #aaa; vertical-align: top; padding: 20px; box-sizing: border-box; text-align: justify; } .app-story { background-color: var(--couleur-fond); border: 1px solid var(--bordure-bloc); padding: 10px; box-sizing: border-box; height: 300px; } .app-story + .app-story { border-top: 0; height: auto; } .app-story > div { background-color: #f2f2f2; border: 1px solid #393939; padding: 30px 50px; box-sizing: border-box; box-shadow: inset 6px 0 var(--bordure-int), inset 0 6px var(--bordure-int),inset -6px 0 var(--bordure-int), inset 0 -6px var(--bordure-int); height: 100%; } .app-story > div > div { font-size: 11px; text-align: justify; height: 100%; overflow: auto; padding-right: 10px; line-height: 14px; } .joueur .app-avatar { height: 100px; width: 100px; } .app-joueur { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .app-joueur-head { font-family: 'Montserrat', sans-serif; background-color: var(--couleur-fond2); text-transform: uppercase; color: #f2f2f2; font-size: 10px; letter-spacing: 1px; padding: 10px; border: 1px solid var(--bordure-bloc); border-top: 0; } .app-joueur .infos { background-color: var(--couleur-fond); text-transform: none; color: #f2f2f2; font-family: "roboto"; letter-spacing: 0px; height: 40px; overflow: auto; border: 1px solid var(--bordure-bloc); border-top: 0; padding: 10px; font-size: 11px; box-sizing: content-box; } .app-credit { position: absolute; bottom: -15px; left: 0; } .app-credit a { font-family: 'Montserrat', sans-serif; text-transform: uppercase; letter-spacing: 1px; font-size: 7px; font-weight: bold; text-decoration: none!important; color: #282828; }