#targetSelection h1 { margin: 0.6em; color: inherit; text-align: center; font-size: 180%; } #targetSelection .targets { list-style: none; padding: 0; margin: -1rem 0; } #targetSelection .targets > li:first-child { border-top: none; } #targetSelection .targets > li.small-target { font-size: 85%; } #targetSelection .targets > li.small-target .optionTitle a { font-weight: normal; } #targetSelection .targets > li.small-target { border-top: none; } #targetSelection .targets > li.small-target .targetInput { border-width: 1px; padding-top: 0; padding-bottom: 0; } #targetSelection .targets > li { border-top: 1px solid rgba(255, 255, 255, 0.5); padding: 0.8rem 1rem; margin-left: -1rem; margin-right: -1rem; } .light #targetSelection .targets > li:not(:first-child) { border-top: 1px solid rgba(0, 0, 0, 0.1); } #targetSelection .targets > li .main { display: flex; align-items: center; justify-content: space-between; } #targetSelection li .header { display: flex; align-items: center; } #targetSelection .targets > li.small-target .header p { display: none; } #targetSelection .optionTitle + p { margin-top: 0.2rem; margin-bottom: 0; } #targetSelection .optionTitle a { color: inherit; font-weight: bold; text-decoration: none; } #targetSelection .optionTitle a:hover, #targetSelection .aidesGlimpse a:hover { text-decoration: underline; } @media (min-width: 660px) { #targetSelection { font-size: 115%; } } @media (hover: none) { #targetSelection .optionTitle a { text-decoration: underline; } } #targetSelection #labelNew { background: #e2011c; /* Couleur de la marianne */ border-radius: 0.3em; padding: 0 0.3em; } #targetSelection .targetInputOrValue { font-size: 115%; margin-left: 0.6rem; text-align: right; display: flex; flex-direction: column; align-items: flex-end; } #targetSelection .aidesGlimpse { font-size: 70%; display: flex; } #targetSelection .aidesGlimpse a { display: inline-block; text-decoration: none; } #targetSelection .targetInputOrValue > :not(.targetInput) { margin: 0 0.6rem; } #targetSelection input { margin: 2.7px 0; } #targetSelection .targetInput { width: 5.5em; max-width: 7.5em; text-align: right; background: rgba(255, 255, 255, 0.2); padding: 0; padding: 0.2rem 0.6rem; border-radius: 0.3rem; border: 2px solid; font-size: inherit; } .light #targetSelection .targetInput { color: var(--darkColor); border-color: var(--darkColor); background: white !important; } .light #targetSelection .optionTitle { color: var(--darkColor); } #targetSelection .editableTarget { max-width: 7.5em; display: inline-block; text-align: right; padding: 0 2px; font-size: inherit; } #targetSelection .targetInputBottomBorder { margin: 0; padding: 0 2px; height: 0; overflow: hidden; } #targetSelection .editableTarget + .targetInputBottomBorder { border-bottom: 1px dashed #ffffff91; } #targetSelection .unit { margin-left: 0.4em; font-size: 110%; vertical-align: middle; } .input-error { padding: 0 0.6em; margin-right: 0.6em; font-size: 90%; font-style: italic; color: #c0392b; background: yellow; font-weight: 600; } /* Autre idée pour styler les checkboxes https://codepen.io/KenanYusuf/pen/PZKEKd */