#targetsContainer { border-radius: 0.6em; box-shadow: 0 1px 3px 0 #d4d4d5, 0 0 0 1px #d4d4d5; background: linear-gradient( 60deg, rgba(39, 69, 195, 0.87) 0%, rgba(41, 117, 209, 1) 100% ); } #targetSelection h1 { margin: 0.6em; color: inherit; text-align: center; font-size: 180%; } #targetSelection #targets { list-style: none; padding: 0 0.5em; } #targetSelection #targets > li:last-child { margin-bottom: 0; } #targetSelection #targets > li { padding: 0.6em; border-bottom: 1px solid rgba(255, 255, 255, 0.5); margin: 0; } #targetSelection #targets > li .main { display: flex; align-items: center; justify-content: space-between; } #targetSelection #targets > li p { margin: 0.2em 0 0; opacity: 0.8; line-height: 1.2rem; } #targetSelection li .header { display: flex; align-items: center; } #targetSelection .progressCircle { margin-right: 0.6em; } #targetSelection .progressCircle svg { width: 2em; } /* IE */ @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { #targetSelection .progressCircle svg { max-height: 2.5rem; } } #targetSelection .progressCircle i { color: #5de662; font-size: 220%; } #targetSelection .optionTitle { font-size: 115%; } #targetSelection .optionTitle a { color: inherit; text-decoration: none; font-weight: 500; } #targetSelection .optionTitle a:hover { text-decoration: underline; } #targetSelection .targetInputOrValue { font-size: 135%; display: flex; justify-content: flex-end; align-items: flex-end; margin-left: 0.6em; } #targetSelection .editable { border-bottom: 1px dashed #ffffff91; min-width: 2.5em; display: inline-block; } #targetSelection .attractClick.editable { height: 2.6rem; } #targetSelection .attractClick, #targetSelection .targetInput { width: 5.5em !important; display: inline-block; text-align: right; font-weight: 500; padding: 0; padding: 0.2em 0.5em; background: rgba(255, 255, 255, 0); border-radius: 0.2em; border: 2px solid white; color: white; font-size: inherit; } #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: 500; } #targetSelection .inputSuggestions { margin: 0.6em 0; } /* Autre idée pour styler les checkboxes https://codepen.io/KenanYusuf/pen/PZKEKd */