morgaan/generateur-de-mots-pour-dessinez-c-est-gagne.markdown

## generateur-de-mots-pour-dessinez-c-est-gagne.markdown

      
    Raw
  

              generateur-de-mots-pour-dessinez-c-est-gagne.markdown
            
          
    Générateur de mots pour Dessinez c'est gagné !

A Pen by morgan on CodePen.
License.

  
## index.html
<!DOCTYPE html>
<html lang="fr">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Génère un mot</title>
</head>

<body>
	<div aria-live="polite" class="word-wrapper" id="word-wrapper"><p class="sr-only">Cliquez sur Nouveau mot pour lancer le générateur de mots</p></div>
	<button id="generate-word">Nouveau mot</button>
</body>

</html>

## script.babel
const dict = "angle,armoire,banc,bureau,cabinet,carreau,chaise,classe,clé,coin,couloir,dossier,eau,école,écriture,entrée,escalier,étagère,étude,extérieur,fenêtre,intérieur,lavabo,lecture,lit,marche,matelas,maternelle,meuble,mousse,mur,peluche,placard,plafond,porte,portemanteau,poubelle,radiateur,rampe,récréation,rentrée,rideau,robinet,salle,savon,serrure,serviette,siège,sieste,silence,sol,sommeil,sonnette,sortie,table,tableau,tabouret,tapis,tiroir,toilette,vitre,toilettes,crayon,stylo,feutre,taille-crayon,pointe,mine,gomme,dessin,coloriage,rayure,peinture,pinceau,couleur,craie,papier,feuille,cahier,carnet,carton,ciseaux,découpage,pliage,pli,colle,affaire,boîte,casier,caisse,trousse,cartable,jouet,jeu,pion,dé,domino,puzzle,cube,perle,chose,forme,carré,rond,pâte à modeler,tampon,livre,histoire,bibliothèque,image,album,titre,bande dessinée,conte,dictionnaire,magazine,catalogue,page,ligne,mot,enveloppe,étiquette,affiche,alphabet,appareil,caméscope,cassette,cédé,cédérom,chaîne,chanson,chiffre,contraire,différence,doigt,écran,film,fois,idée,instrument,intrus,lettre,liste,magnétoscope,main,micro,modèle,musique,nom,nombre,orchestre,ordinateur,photo,point,poster,pouce,prénom,question,radio,sens,tambour,télécommande,téléphone,télévision,trait,trompette,voix,xylophone,zéro,ami,attention,camarade,colère,copain,coquin,dame,directeur,directrice,droit,effort,élève,enfant,fatigue,faute,fille,garçon,gardien,madame,maître,maîtresse,mensonge,ordre,personne,retard,sourire,travail,arrosoir,assiette,balle,bateau,bouchon,bouteille,bulles,canard,casserole,cuillère,cuvette,douche,entonnoir,gouttes,litre,moulin,pluie,poisson,pont,pot,roue,sac,plastique,saladier,seau,tablier,tasse,trous,verre,anorak,arc,bagage,baguette,barbe,bonnet,botte,bouton,bretelle,cagoule,casque,casquette,ceinture,chapeau,chaussette,chausson,chaussure,chemise,cigarette,col,collant,couronne,cravate,culotte,écharpe,épée,fée,flèche,fusil,gant,habit,jean,jupe,lacet,laine,linge,lunettes,magicien,magie,maillot,manche,manteau,mouchoir,moufle,nœud,paire,pantalon,pied,poche,prince,pull-over,pyjama,reine,robe,roi,ruban,semelle,soldat,sorcière,tache,taille,talon,tissu,tricot,uniforme,valise,veste,vêtement,aiguille,ampoule,avion,bois,bout,bricolage,bruit,cabane,clou,crochet,élastique,ficelle,fil,marionnette,marteau,métal,mètre,morceau,moteur,objet,outil,planche,plâtre,scie,tournevis,vis,voiture,véhicule,accident,aéroport,auto,camion,engin,feu,frein,fusée,garage,gare,grue,hélicoptère,moto,panne,parking,pilote,pneu,quai,train,virage,vitesse,voyage,wagon,zigzag,acrobate,arrêt,arrière,barre,barreau,bord,bras,cerceau,chaises,cheville,chute,cœur,corde,corps,côté,cou,coude,cuisse,danger,doigts,dos,échasses,échelle,épaule,équipe,escabeau,fesse,filet,fond,genou,gymnastique,hanche,jambes,mains,milieu,montagne,muscle,numéro,ongle,parcours,pas,passerelle,pente,peur,pieds,plongeoir,poignet,poing,pont de singe,prises,rivière des crocodiles,roulade,saut,serpent,sport,suivant,tête,toboggan,tour,trampoline,tunnel,ventre,bagarre,balançoire,ballon,bande,bicyclette,bille,cadenas,cage à écureuil,cerf-volant,château,coup,cour,course,échasse,flaque,paix,pardon,partie,pédale,pelle,pompe,préau,raquette,rayon,sable,sifflet,signe,tas,tricycle,tuyau,vélo,allumette,anniversaire,appétit,beurre,coquille,crêpes,croûte,dessert,envie,faim,fève,four,galette,gâteau,goût,invitation,langue,lèvres,liquide,louche,mie,moitié,moule,odeur,œuf,part,pâte,pâtisserie,recette,rouleau,sel,soif,tarte,tranche,yaourt,glaçon,jus,kiwi,lame,mûre,noyau,paille,pamplemousse,râpe,bassine,cocotte,épluchure,légume,pomme de terre,rondelle,soupe,consommé,potage,arête,frite,gobelet,jambon,os,poulet,purée,radis,restaurant,sole,animal,bébés,bouche,cage,câlin,caresse,foin,graines,hamster,lapin,maison,nez,œil,oreille,patte,toit,yeux,abeille,agneau,aile,âne,arbre,bain,barque,bassin,bébé,bec,bête,bœuf,botte de foin,boue,bouquet,bourgeon,branche,caillou,campagne,car,champ,chariot,chat,cheminée,cheval,chèvre,chien,cochon,colline,coq,coquelicot,crapaud,cygne,départ,dindon,escargot,étang,ferme,fermier,flamme,fleur,fontaine,fumée,grain,graine,grenouille,griffe,guêpe,herbe,hérisson,insecte,jardin,mare,marguerite,miel,morceau de pain,mouche,mouton,oie,oiseau,pierre,pigeon,plante,plume,poney,poule,poussin,prairie,rat,rivière,route,tortue,tracteur,tulipe,vache,vétérinaire,aigle,animaux,aquarium,bêtes,cerf,chouette,cigogne,crocodile,dauphin,éléphant,girafe,hibou,hippopotame,kangourou,lion,loup,ours,panda,panthère,perroquet,phoque,renard,requin,rhinocéros,singe,tigre,zèbre,zoo,épingle,bâton,bêtise,bonhomme,bottes,canne,cauchemar,cri,danse,déguisement,dinosaure,drapeau,en argent,en or,en rang,fête,figure,géant,gens,grand-mère,grand-père,joie,joue,journaux,maquillage,masque,monsieur,moustache,ogre,princesse,rue,trottoir,Noël,boule,cadeau,canne à pêche,chance,guirlande,humeur,papillon,spectacle,surprise,trou,visage,âge,an,année,après-midi,calendrier,début,dimanche,été,étoile,fin,heure des mamans,heure,hiver,horloge,jeudi,jour,journée,lumière,lundi,lune,mardi,matin,mercredi,midi,minuit,minute,mois,moment,montre,nuit,ombre,pendule,retour,réveil,saison,samedi,semaine,soir,soleil,temps,univers,vacances,vendredi,air,arc-en-ciel,brouillard,ciel,éclair,flocon,goutte,hirondelle,luge,neige,nuage,orage,ouragan,parapluie,parasol,ski,tempête,thermomètre,tonnerre,traîneau,vent,balai,biscuit,boisson,bol,bonbon,céréale,confiture,coquetier,couteau,couvercle,couvert,cuisine,cuisinière,désordre,dînette,éponge,évier,fourchette,lait,lave-linge,lessive,machine,nappe,pain,pile,plat,plateau,poêle,réfrigérateur,repas,tartine,torchon,vaisselle,argent,aspirateur,bague,barrette,bijou,bracelet,brosse,cadre,canapé,chambre,cheveu,chiffon,cil,coffre,coffret,collier,couette,coussin,couverture,dent,dentifrice,drap,fauteuil,fer à repasser,frange,glace,lampe,ménage,or,oreiller,parfum,peigne,pouf,poupée,poussette,poussière,shampoing,sourcil,trésor,tube,vase,adulte,amour,baiser,bavoir,biberon,bisou,caprice,cimetière,cousin,cousine,crèche,fils,frère,grand-parent,homme,femme,jumeau,maman,mari,mariage,mère,papa,parent,père,petit-enfant,petit-fils,petite-fille,rasoir,sœur,ambulance,bosse,champignon,dentiste,docteur,fièvre,front,gorge,infirmier,infirmière,jambe,larme,médecin,menton,ordonnance,pansement,peau,piqûre,poison,sang,santé,squelette,araignée,brouette,chenille,coccinelle,fourmi,jonquille,lézard,pâquerette,rangée,râteau,rosé,souris,taupe,terrain,terre,terrier,tige,ver,portière,billet,farce,grimace,grotte,pays,regard,ticket,bûche,buisson,camp,chasseur,châtaigne,chemin,chêne,corbeau,écorce,écureuil,forêt,gourde,lac,loupe,lutin,marron,moustique,muguet,nid,paysage,pin,rocher,sapin,sommet,tente,adresse,appartement,ascenseur,balcon,boucherie,boulanger,boulangerie,boutique,bus,caniveau,caravane,carrefour,cave,charcuterie,cinéma,cirque,cloche,clocher,clown,coiffeur,colis-route,courrier,croix,église,embouteillage,endroit,essence,facteur,fleuriste,foire,hôpital,hôtel,immeuble,incendie,laisse,magasin,manège,médicament,moineau,monde,monument,ouvrier,palais,panneau,paquet,parc,passage,pharmacie,pharmacien,piscine,place,police,policier,pompier,poste,promenade,quartier,square,timbre,travaux,usine,village,ville,voisin,volet,abricot,ail,aliment,ananas,banane,bifteck,café,carotte,cerise,chocolat,chou,citron,citrouille,clémentine,concombre,coquillage,corbeille,crabe,crevette,endive,farine,fraise,framboise,fromage,fruit,haricot,huile,marchand,melon,monnaie,navet,noisette,noix,nourriture,oignon,orange,panier,pâtes,pêche,persil,petit pois,poire,poireau,pomme,prix,prune,queue,raisin,riz,salade,sucre,thé,tomate,viande,vin,baleine,bouée,île,jumelles,marin,mer,mouette,navire,pêcheur,plage,port,sardine,vague,voile";

const words = dict.split(",").filter(function(item, pos, self) {
			 // remove duplicates.
    return self.indexOf(item) == pos;
});

console.log('Dict count:', dict.split(",").length);
console.log('Word count:', words.length);

const Generator = function (wordContainer) {
	const usedIndices = [];
	return {
		next: function () {
			let newWord;
			if (usedIndices.length === words.length) {
				wordContainer.textContent = "Tous les mots ont été utilisés, recharge la page!";
			} else {
				while (!newWord) {
					const index = Math.floor(Math.random() * words.length);
					if (usedIndices.indexOf(index) === -1) {
						newWord = words[index];
							usedIndices.push(index);
							wordContainer.innerHTML = `<div class="word">${newWord}</div>
		<div class="used-word-counter">${usedIndices.length} mot${usedIndices.length > 1 ? 's':''} utilisé${usedIndices.length > 1 ? 's':''} sur ${words.length}</div>`;
				 }
			}
	 }
		}
};
};

document.addEventListener("DOMContentLoaded", function (event) {
	const button = document.querySelector("#generate-word");
	const gen = new Generator(document.querySelector("#word-wrapper"));
	button.addEventListener("click", (e) => {
		e.preventDefault();
		gen.next();
	});
});

## style.scss
body {
	font-family: "Arial";
	display: flex;
	flex-direction: column;
	margin: 40vh auto;
}

.word-wrapper {
	margin: 0 auto 16px;
	text-align: center;
}

.word {
	font-weight: bold;
	font-size: 36px;
	text-transform: capitalize;
	margin-bottom: 16px;
}

.used-word-counter {
	font-size: 20px;
	font-weight: normal;
	color: #333;
}

button {
	width: 300px;
	font-size: 24px;
	padding: 1em;
	margin: 0 auto 1.5em;
	border-radius: 0.5em;
	border: none;
	background-color: deeppink;
	color: white;
	font-weight: bold;
}

/* Hiding class, making content visible only to screen readers but not visually */
/* "sr" meaning "screen-reader" */

.sr-only:not(:focus):not(:active) {
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}

.new-word {
	display: none;
}
	<!DOCTYPE html>
	<html lang="fr">

	<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Génère un mot</title>
	</head>

	<body>
	<div aria-live="polite" class="word-wrapper" id="word-wrapper"><p class="sr-only">Cliquez sur Nouveau mot pour lancer le générateur de mots</p></div>
	<button id="generate-word">Nouveau mot</button>
	</body>

	</html>
	const dict = "angle,armoire,banc,bureau,cabinet,carreau,chaise,classe,clé,coin,couloir,dossier,eau,école,écriture,entrée,escalier,étagère,étude,extérieur,fenêtre,intérieur,lavabo,lecture,lit,marche,matelas,maternelle,meuble,mousse,mur,peluche,placard,plafond,porte,portemanteau,poubelle,radiateur,rampe,récréation,rentrée,rideau,robinet,salle,savon,serrure,serviette,siège,sieste,silence,sol,sommeil,sonnette,sortie,table,tableau,tabouret,tapis,tiroir,toilette,vitre,toilettes,crayon,stylo,feutre,taille-crayon,pointe,mine,gomme,dessin,coloriage,rayure,peinture,pinceau,couleur,craie,papier,feuille,cahier,carnet,carton,ciseaux,découpage,pliage,pli,colle,affaire,boîte,casier,caisse,trousse,cartable,jouet,jeu,pion,dé,domino,puzzle,cube,perle,chose,forme,carré,rond,pâte à modeler,tampon,livre,histoire,bibliothèque,image,album,titre,bande dessinée,conte,dictionnaire,magazine,catalogue,page,ligne,mot,enveloppe,étiquette,affiche,alphabet,appareil,caméscope,cassette,cédé,cédérom,chaîne,chanson,chiffre,contraire,différence,doigt,écran,film,fois,idée,instrument,intrus,lettre,liste,magnétoscope,main,micro,modèle,musique,nom,nombre,orchestre,ordinateur,photo,point,poster,pouce,prénom,question,radio,sens,tambour,télécommande,téléphone,télévision,trait,trompette,voix,xylophone,zéro,ami,attention,camarade,colère,copain,coquin,dame,directeur,directrice,droit,effort,élève,enfant,fatigue,faute,fille,garçon,gardien,madame,maître,maîtresse,mensonge,ordre,personne,retard,sourire,travail,arrosoir,assiette,balle,bateau,bouchon,bouteille,bulles,canard,casserole,cuillère,cuvette,douche,entonnoir,gouttes,litre,moulin,pluie,poisson,pont,pot,roue,sac,plastique,saladier,seau,tablier,tasse,trous,verre,anorak,arc,bagage,baguette,barbe,bonnet,botte,bouton,bretelle,cagoule,casque,casquette,ceinture,chapeau,chaussette,chausson,chaussure,chemise,cigarette,col,collant,couronne,cravate,culotte,écharpe,épée,fée,flèche,fusil,gant,habit,jean,jupe,lacet,laine,linge,lunettes,magicien,magie,maillot,manche,manteau,mouchoir,moufle,nœud,paire,pantalon,pied,poche,prince,pull-over,pyjama,reine,robe,roi,ruban,semelle,soldat,sorcière,tache,taille,talon,tissu,tricot,uniforme,valise,veste,vêtement,aiguille,ampoule,avion,bois,bout,bricolage,bruit,cabane,clou,crochet,élastique,ficelle,fil,marionnette,marteau,métal,mètre,morceau,moteur,objet,outil,planche,plâtre,scie,tournevis,vis,voiture,véhicule,accident,aéroport,auto,camion,engin,feu,frein,fusée,garage,gare,grue,hélicoptère,moto,panne,parking,pilote,pneu,quai,train,virage,vitesse,voyage,wagon,zigzag,acrobate,arrêt,arrière,barre,barreau,bord,bras,cerceau,chaises,cheville,chute,cœur,corde,corps,côté,cou,coude,cuisse,danger,doigts,dos,échasses,échelle,épaule,équipe,escabeau,fesse,filet,fond,genou,gymnastique,hanche,jambes,mains,milieu,montagne,muscle,numéro,ongle,parcours,pas,passerelle,pente,peur,pieds,plongeoir,poignet,poing,pont de singe,prises,rivière des crocodiles,roulade,saut,serpent,sport,suivant,tête,toboggan,tour,trampoline,tunnel,ventre,bagarre,balançoire,ballon,bande,bicyclette,bille,cadenas,cage à écureuil,cerf-volant,château,coup,cour,course,échasse,flaque,paix,pardon,partie,pédale,pelle,pompe,préau,raquette,rayon,sable,sifflet,signe,tas,tricycle,tuyau,vélo,allumette,anniversaire,appétit,beurre,coquille,crêpes,croûte,dessert,envie,faim,fève,four,galette,gâteau,goût,invitation,langue,lèvres,liquide,louche,mie,moitié,moule,odeur,œuf,part,pâte,pâtisserie,recette,rouleau,sel,soif,tarte,tranche,yaourt,glaçon,jus,kiwi,lame,mûre,noyau,paille,pamplemousse,râpe,bassine,cocotte,épluchure,légume,pomme de terre,rondelle,soupe,consommé,potage,arête,frite,gobelet,jambon,os,poulet,purée,radis,restaurant,sole,animal,bébés,bouche,cage,câlin,caresse,foin,graines,hamster,lapin,maison,nez,œil,oreille,patte,toit,yeux,abeille,agneau,aile,âne,arbre,bain,barque,bassin,bébé,bec,bête,bœuf,botte de foin,boue,bouquet,bourgeon,branche,caillou,campagne,car,champ,chariot,chat,cheminée,cheval,chèvre,chien,cochon,colline,coq,coquelicot,crapaud,cygne,départ,dindon,escargot,étang,ferme,fermier,flamme,fleur,fontaine,fumée,grain,graine,grenouille,griffe,guêpe,herbe,hérisson,insecte,jardin,mare,marguerite,miel,morceau de pain,mouche,mouton,oie,oiseau,pierre,pigeon,plante,plume,poney,poule,poussin,prairie,rat,rivière,route,tortue,tracteur,tulipe,vache,vétérinaire,aigle,animaux,aquarium,bêtes,cerf,chouette,cigogne,crocodile,dauphin,éléphant,girafe,hibou,hippopotame,kangourou,lion,loup,ours,panda,panthère,perroquet,phoque,renard,requin,rhinocéros,singe,tigre,zèbre,zoo,épingle,bâton,bêtise,bonhomme,bottes,canne,cauchemar,cri,danse,déguisement,dinosaure,drapeau,en argent,en or,en rang,fête,figure,géant,gens,grand-mère,grand-père,joie,joue,journaux,maquillage,masque,monsieur,moustache,ogre,princesse,rue,trottoir,Noël,boule,cadeau,canne à pêche,chance,guirlande,humeur,papillon,spectacle,surprise,trou,visage,âge,an,année,après-midi,calendrier,début,dimanche,été,étoile,fin,heure des mamans,heure,hiver,horloge,jeudi,jour,journée,lumière,lundi,lune,mardi,matin,mercredi,midi,minuit,minute,mois,moment,montre,nuit,ombre,pendule,retour,réveil,saison,samedi,semaine,soir,soleil,temps,univers,vacances,vendredi,air,arc-en-ciel,brouillard,ciel,éclair,flocon,goutte,hirondelle,luge,neige,nuage,orage,ouragan,parapluie,parasol,ski,tempête,thermomètre,tonnerre,traîneau,vent,balai,biscuit,boisson,bol,bonbon,céréale,confiture,coquetier,couteau,couvercle,couvert,cuisine,cuisinière,désordre,dînette,éponge,évier,fourchette,lait,lave-linge,lessive,machine,nappe,pain,pile,plat,plateau,poêle,réfrigérateur,repas,tartine,torchon,vaisselle,argent,aspirateur,bague,barrette,bijou,bracelet,brosse,cadre,canapé,chambre,cheveu,chiffon,cil,coffre,coffret,collier,couette,coussin,couverture,dent,dentifrice,drap,fauteuil,fer à repasser,frange,glace,lampe,ménage,or,oreiller,parfum,peigne,pouf,poupée,poussette,poussière,shampoing,sourcil,trésor,tube,vase,adulte,amour,baiser,bavoir,biberon,bisou,caprice,cimetière,cousin,cousine,crèche,fils,frère,grand-parent,homme,femme,jumeau,maman,mari,mariage,mère,papa,parent,père,petit-enfant,petit-fils,petite-fille,rasoir,sœur,ambulance,bosse,champignon,dentiste,docteur,fièvre,front,gorge,infirmier,infirmière,jambe,larme,médecin,menton,ordonnance,pansement,peau,piqûre,poison,sang,santé,squelette,araignée,brouette,chenille,coccinelle,fourmi,jonquille,lézard,pâquerette,rangée,râteau,rosé,souris,taupe,terrain,terre,terrier,tige,ver,portière,billet,farce,grimace,grotte,pays,regard,ticket,bûche,buisson,camp,chasseur,châtaigne,chemin,chêne,corbeau,écorce,écureuil,forêt,gourde,lac,loupe,lutin,marron,moustique,muguet,nid,paysage,pin,rocher,sapin,sommet,tente,adresse,appartement,ascenseur,balcon,boucherie,boulanger,boulangerie,boutique,bus,caniveau,caravane,carrefour,cave,charcuterie,cinéma,cirque,cloche,clocher,clown,coiffeur,colis-route,courrier,croix,église,embouteillage,endroit,essence,facteur,fleuriste,foire,hôpital,hôtel,immeuble,incendie,laisse,magasin,manège,médicament,moineau,monde,monument,ouvrier,palais,panneau,paquet,parc,passage,pharmacie,pharmacien,piscine,place,police,policier,pompier,poste,promenade,quartier,square,timbre,travaux,usine,village,ville,voisin,volet,abricot,ail,aliment,ananas,banane,bifteck,café,carotte,cerise,chocolat,chou,citron,citrouille,clémentine,concombre,coquillage,corbeille,crabe,crevette,endive,farine,fraise,framboise,fromage,fruit,haricot,huile,marchand,melon,monnaie,navet,noisette,noix,nourriture,oignon,orange,panier,pâtes,pêche,persil,petit pois,poire,poireau,pomme,prix,prune,queue,raisin,riz,salade,sucre,thé,tomate,viande,vin,baleine,bouée,île,jumelles,marin,mer,mouette,navire,pêcheur,plage,port,sardine,vague,voile";

	const words = dict.split(",").filter(function(item, pos, self) {
	// remove duplicates.
	return self.indexOf(item) == pos;
	});

	console.log('Dict count:', dict.split(",").length);
	console.log('Word count:', words.length);

	const Generator = function (wordContainer) {
	const usedIndices = [];
	return {
	next: function () {
	let newWord;
	if (usedIndices.length === words.length) {
	wordContainer.textContent = "Tous les mots ont été utilisés, recharge la page!";
	} else {
	while (!newWord) {
	const index = Math.floor(Math.random() * words.length);
	if (usedIndices.indexOf(index) === -1) {
	newWord = words[index];
	usedIndices.push(index);
	wordContainer.innerHTML = `<div class="word">${newWord}</div>
	<div class="used-word-counter">${usedIndices.length} mot${usedIndices.length > 1 ? 's':''} utilisé${usedIndices.length > 1 ? 's':''} sur ${words.length}</div>`;
	}
	}
	}
	}
	};
	};

	document.addEventListener("DOMContentLoaded", function (event) {
	const button = document.querySelector("#generate-word");
	const gen = new Generator(document.querySelector("#word-wrapper"));
	button.addEventListener("click", (e) => {
	e.preventDefault();
	gen.next();
	});
	});
	body {
	font-family: "Arial";
	display: flex;
	flex-direction: column;
	margin: 40vh auto;
	}

	.word-wrapper {
	margin: 0 auto 16px;
	text-align: center;
	}

	.word {
	font-weight: bold;
	font-size: 36px;
	text-transform: capitalize;
	margin-bottom: 16px;
	}

	.used-word-counter {
	font-size: 20px;
	font-weight: normal;
	color: #333;
	}

	button {
	width: 300px;
	font-size: 24px;
	padding: 1em;
	margin: 0 auto 1.5em;
	border-radius: 0.5em;
	border: none;
	background-color: deeppink;
	color: white;
	font-weight: bold;
	}

	/* Hiding class, making content visible only to screen readers but not visually */
	/* "sr" meaning "screen-reader" */

	.sr-only:not(:focus):not(:active) {
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;
	}

	.new-word {
	display: none;
	}