/* Free exercises on the sounds [s], [k], [ʒ] and [g]. Loaded after clock-exercise.css, imparfait-exercise.css, phrases-exercise.css, noms-exercise.css,
   present-exercise.css and imparfait1-exercise.css, whose line, keyboard and rows it reuses.
   The word or the sentence keeps its gaps; the letters touched below fill them at once. */
.sons-mark{background:none;color:#1f45e6;text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:4px}
.sons-slot{display:inline-block;min-width:1.5em;margin:0 1px;padding:0 2px;border-bottom:3px solid #2453ff;color:#2453ff;text-align:center;line-height:1.15}
.sons-slot sub{font-size:.55em;color:#5a6390}
.sons-slot.is-filled{color:#1f45e6}
.sons-slot.is-correct{border-color:#16794a;color:#16794a}
.sons-slot.is-wrong{border-color:#c0392b;color:#c0392b}
.sons-listen{margin:0 0 12px}
/* One row per gap: its name, then one button per spelling; a single gap has no name. */
.sons-rows .clock-choice{font-size:19px}
.sons-rows--3 .noms-sort-row{grid-template-columns:minmax(0,1fr) repeat(3,minmax(0,1fr))}
.sons-rows--4 .noms-sort-row{grid-template-columns:minmax(0,1.3fr) repeat(4,minmax(0,1fr))}
.sons-rows--single .noms-sort-row{grid-template-columns:repeat(var(--sons-options,2),minmax(0,1fr))}
.sons-rows--single.sons-rows--3{--sons-options:3}
.sons-rows--single.sons-rows--4{--sons-options:4}
@media(max-width:700px){
 .sons-rows--2 .noms-sort-row,.sons-rows--single.sons-rows--2 .noms-sort-row{grid-template-columns:repeat(2,minmax(0,1fr))}
 .sons-rows--3 .noms-sort-row{grid-template-columns:repeat(3,minmax(0,1fr))}
 .sons-rows--4 .noms-sort-row{grid-template-columns:repeat(4,minmax(0,1fr))}
 .sons-rows .noms-sort-word{grid-column:1/-1}
}