#targetsContainer { max-width: 40em; margin: 0 auto; padding: 0.2em .5em; border-radius: 0.6em; box-shadow: 0px 0px 13px 3px rgba(0, 0, 0, 0.25) } #targetsContainer > div { width: 100%; } #targetSelection h1 { margin: 0.6em; color: inherit; text-align: center; font-size: 180%; } #targetSelection #action { text-align: center; margin: 1em auto; } #targetSelection #action p { color: #4b4b66; margin-bottom: 1em; font-size: 120%; } #targetSelection #targets { margin: .4em auto; /* For the checkbox that will appear */ padding: 0; } #targetSelection #targets li { margin-bottom: .4em; background: rgba(0, 0, 0, 0.25); display: flex; align-items: center; padding: .4em .6em .4em; border-radius: .3em; } #targetSelection #targets > li p { margin: .2em 0 0; opacity: .80; line-height: 1.2em; } #targetSelection .progressCircle { width: 2.5em; margin-right: .6em; } #targetSelection .progressCircle i { color: #5de662; font-size: 180% } #targetSelection label { width: 10%; display: inline-block; cursor: pointer; } #targetSelection .texts { margin: 0 .4em 0; width: 55%; display: inline-block; } #targetSelection .optionTitle { font-size: 120%; font-weight: 600; } #targetSelection .optionTitle a { color: inherit } #targetSelection .optionTitle a:hover { text-decoration: underline; } #targetSelection input[type='checkbox'] { position: absolute; z-index: -1; opacity: 0; } #targetSelection input + label > i.fa { max-width: 0.75em; } #targetSelection .targetInputOrValue { width: 40%; font-size: 110%; text-align: right; } #targetSelection .editable { border-bottom: 1px dashed #ffffff91; min-width: 2.5em; display: inline-block; } #targetSelection .attractClick, #targetSelection input[type='number'] { width: 5em !important; display: inline-block; height: 1.6em; text-align: right; font-weight: 600; padding: 0; padding: 0em 0.5em; background: white; border-radius: 0.2em; border: none; box-shadow: 0px 1px 9px 0px rgba(0, 0, 0, 0.45); color: #333; font-size: inherit } #targetSelection .unit { margin-left: .6em; font-size: 120%; vertical-align: middle; } .input-error { padding: 0 .6em; margin-right: .6em; font-size: 80%; font-style: italic; color: #c0392b; background: yellow; font-weight: 600; } /* Autre idée pour styler les checkboxes https://codepen.io/KenanYusuf/pen/PZKEKd */