use class="hidden" not style="display:none"

34 files changed, 57 insertions, 58 deletions

diff --git a/files/pt-br/conflicting/learn/css/building_blocks/selectors/index.html b/files/pt-br/conflicting/learn/css/building_blocks/selectors/index.html
index a04b285c4e..4555e39b04 100644
--- a/files/pt-br/conflicting/learn/css/building_blocks/selectors/index.html
+++ b/files/pt-br/conflicting/learn/css/building_blocks/selectors/index.html
@@ -374,7 +374,7 @@ a.homepage:hover, a.homepage:focus, a.homepage:active {
   <table style="border: 2px outset #3366bb; padding: 1em;">
    <tbody>
     <tr>
-     <td>Go to our <a class="tutospecial" href="#" title="Home page">Home page</a><span style="display: none;"> </span><span style="display: none;"> </span></td>
+     <td>Go to our <a class="tutospecial" href="#" title="Home page">Home page</a><span class="hidden"> </span><span class="hidden"> </span></td>
     </tr>
    </tbody>
   </table>
diff --git a/files/pt-br/learn/html/howto/index.html b/files/pt-br/learn/html/howto/index.html
index 9ddbd6516a..fdad3220ca 100644
--- a/files/pt-br/learn/html/howto/index.html
+++ b/files/pt-br/learn/html/howto/index.html
@@ -148,4 +148,4 @@ original_slug: Aprender/HTML/como-fazer
 </div>
 </div>
 
-<p><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span> </p>
+<p><span class="hidden"> </span><span class="hidden"> </span><span class="hidden"> </span><span class="hidden"> </span> </p>
diff --git a/files/pt-br/orphaned/instalando_rust/index.html b/files/pt-br/orphaned/instalando_rust/index.html
index 5f23d27f9b..cf7c77a442 100644
--- a/files/pt-br/orphaned/instalando_rust/index.html
+++ b/files/pt-br/orphaned/instalando_rust/index.html
@@ -64,7 +64,7 @@ original_slug: Instalando_Rust
 <p style="margin-bottom: 0in; font-style: normal; font-weight: normal; line-height: 100%;"> </p>
 
 <div class="note">
-<p><font color="#000000"><font face="DejaVu Serif, serif"><font size="3"><span style="background: transparent;"><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span>Windows (7, 8, Server 2008 R2)</span></font></font></font></p>
+<p><font color="#000000"><font face="DejaVu Serif, serif"><font size="3"><span style="background: transparent;"><span class="hidden"> </span><span class="hidden"> </span><span class="hidden"> </span><span class="hidden"> </span><span class="hidden"> </span><span class="hidden"> </span>Windows (7, 8, Server 2008 R2)</span></font></font></font></p>
 
 <p><font color="#000000"><font face="DejaVu Serif, serif"><font size="3"><span style="background: transparent;">Gnu/Linux(2.6.18 ou posterior, várias distribuições), x86 e x86-64</span></font></font></font></p>
 
diff --git a/files/pt-br/orphaned/mdn/community/whats_happening/index.html b/files/pt-br/orphaned/mdn/community/whats_happening/index.html
index abf003caf3..842f8b7fdf 100644
--- a/files/pt-br/orphaned/mdn/community/whats_happening/index.html
+++ b/files/pt-br/orphaned/mdn/community/whats_happening/index.html
@@ -18,7 +18,7 @@ original_slug: MDN/Comunidade/Whats_happening
 <h2 id="Streams_of_ephemera">Streams of ephemera</h2>
 
 <ul>
- <li><a href="https://twitter.com/mozhacks" title="https://twitter.com/mozhacks"><span id="cke_bm_286S" style="display: none;"> </span>@MozHacks</a>: Tweets about new web technologies, great HTML5 apps, and Firefox features.</li>
+ <li><a href="https://twitter.com/mozhacks" title="https://twitter.com/mozhacks"><span id="cke_bm_286S" class="hidden"> </span>@MozHacks</a>: Tweets about new web technologies, great HTML5 apps, and Firefox features.</li>
  <li><a href="https://twitter.com/NewOnMDN" title="https://twitter.com/NewOnMDN">@NewOnMDN</a>: Curated feed of new pages, significant updates, and other news about Mozilla Developer Network.</li>
  <li><a href="https://plus.google.com/+MozillaDeveloperNetwork" title="https://plus.google.com/+MozillaDeveloperNetwork">+MozillaDeveloperNetwork</a></li>
  <li><a href="http://www.youtube.com/user/mozhacks" title="http://www.youtube.com/user/mozhacks">Mozilla Hacks (YouTube)</a></li>
diff --git a/files/pt-br/tools/page_inspector/how_to/work_with_animations/index.html b/files/pt-br/tools/page_inspector/how_to/work_with_animations/index.html
index ec75510240..0d3e907dc4 100644
--- a/files/pt-br/tools/page_inspector/how_to/work_with_animations/index.html
+++ b/files/pt-br/tools/page_inspector/how_to/work_with_animations/index.html
@@ -107,11 +107,11 @@ original_slug: Tools/Page_Inspector/How_to/Trabalho_Com_Animaçoes
  <li>The <code>img#icon</code> animation:
   <ul>
    <li>animated the <code><a href="/en-US/docs/Web/CSS/filter">filter</a></code> and <code><a href="/en-US/docs/Web/CSS/transform">transform</a></code> properties, to scale the icon and color it</li>
-   <li><span style="display: none;"> </span><span style="display: none;"> </span> lasted 750ms, had an <code>endDelay</code> of 100ms</li>
+   <li><span class="hidden"> </span><span class="hidden"> </span> lasted 750ms, had an <code>endDelay</code> of 100ms</li>
    <li>used the compositor thread.</li>
   </ul>
  </li>
- <li><span style="display: none;"> </span><span style="display: none;"> </span>The <code>span#note</code> animation:
+ <li><span class="hidden"> </span><span class="hidden"> </span>The <code>span#note</code> animation:
   <ul>
    <li>animated the <code><a href="/en-US/docs/Web/CSS/width">width</a></code> and <code><a href="/en-US/docs/Web/CSS/opacity">opacity</a></code> properties, to make the name gradually appear</li>
    <li>lasted 500ms, and had a <code>delay</code> of 150ms.</li>
diff --git a/files/pt-br/web/api/canvasrenderingcontext2d/arcto/index.html b/files/pt-br/web/api/canvasrenderingcontext2d/arcto/index.html
index c4fcdc1e69..15ff88c403 100644
--- a/files/pt-br/web/api/canvasrenderingcontext2d/arcto/index.html
+++ b/files/pt-br/web/api/canvasrenderingcontext2d/arcto/index.html
@@ -76,7 +76,7 @@ ctx.fillRect(50, 20, 10, 10);
 
 <p>Altere o código abaixo e veja suas alterações atualizadas na tela:</p>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush: html">&lt;canvas id="canvas" class="playable-canvas" height="200" width="400"&gt;&lt;/canvas&gt;
 &lt;div class="playable-buttons"&gt;
   &lt;input id="edit" type="button" value="Edit" /&gt;
diff --git a/files/pt-br/web/api/canvasrenderingcontext2d/beginpath/index.html b/files/pt-br/web/api/canvasrenderingcontext2d/beginpath/index.html
index b3ad87ff61..7217bec7c5 100644
--- a/files/pt-br/web/api/canvasrenderingcontext2d/beginpath/index.html
+++ b/files/pt-br/web/api/canvasrenderingcontext2d/beginpath/index.html
@@ -51,7 +51,7 @@ ctx.stroke();
 
 <p>Edite o código abaixo e veja as alterações instantâneas no canvas:</p>
 
-<div style="display: none;">
+<div class="hidden">
 <h6 id="Playable_code">Playable code</h6>
 
 <pre class="brush: html">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
diff --git a/files/pt-br/web/api/canvasrenderingcontext2d/clearrect/index.html b/files/pt-br/web/api/canvasrenderingcontext2d/clearrect/index.html
index ec1be69b57..cb863cfdeb 100644
--- a/files/pt-br/web/api/canvasrenderingcontext2d/clearrect/index.html
+++ b/files/pt-br/web/api/canvasrenderingcontext2d/clearrect/index.html
@@ -66,7 +66,7 @@ ctx.clearRect(10, 10, 100, 100);
 
 <p>Edite o código abaixo e veja as alterações instantâneas no canvas:</p>
 
-<div style="display: none;">
+<div class="hidden">
 <h6 id="Playable_code">Playable code</h6>
 
 <pre class="brush: html">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
diff --git a/files/pt-br/web/api/canvasrenderingcontext2d/clip/index.html b/files/pt-br/web/api/canvasrenderingcontext2d/clip/index.html
index 780ba3cd58..6c5a2050c5 100644
--- a/files/pt-br/web/api/canvasrenderingcontext2d/clip/index.html
+++ b/files/pt-br/web/api/canvasrenderingcontext2d/clip/index.html
@@ -56,7 +56,7 @@ ctx.fillRect(0, 0, 100,100);
 
 <p>Edite o código abaixo e veja suas mudanças atualizadas ao vivo no canvas:</p>
 
-<div style="display: none;">
+<div class="hidden">
 <h6 id="Playable_code">Playable code</h6>
 
 <pre class="brush: html">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
diff --git a/files/pt-br/web/api/canvasrenderingcontext2d/closepath/index.html b/files/pt-br/web/api/canvasrenderingcontext2d/closepath/index.html
index 62c72086f7..e778599bcf 100644
--- a/files/pt-br/web/api/canvasrenderingcontext2d/closepath/index.html
+++ b/files/pt-br/web/api/canvasrenderingcontext2d/closepath/index.html
@@ -44,7 +44,7 @@ ctx.stroke();
 
 <p>Edite o código abaixo e veja as alterações instantâneas no canvas:</p>
 
-<div style="display: none;">
+<div class="hidden">
 <h6 id="Playable_code">Playable code</h6>
 
 <pre class="brush: html">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
diff --git a/files/pt-br/web/api/canvasrenderingcontext2d/fill/index.html b/files/pt-br/web/api/canvasrenderingcontext2d/fill/index.html
index 0c0c1dd890..a2bf1fcb82 100644
--- a/files/pt-br/web/api/canvasrenderingcontext2d/fill/index.html
+++ b/files/pt-br/web/api/canvasrenderingcontext2d/fill/index.html
@@ -56,7 +56,7 @@ ctx.fill();
 
 <p>Edite o código abaixo e veja as alterações instantâneas no canvas:</p>
 
-<div style="display: none;">
+<div class="hidden">
 <h6 id="Playable_code">Playable code</h6>
 
 <pre class="brush: html">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
diff --git a/files/pt-br/web/api/canvasrenderingcontext2d/fillrect/index.html b/files/pt-br/web/api/canvasrenderingcontext2d/fillrect/index.html
index 44b57ca77a..1178f0bf94 100644
--- a/files/pt-br/web/api/canvasrenderingcontext2d/fillrect/index.html
+++ b/files/pt-br/web/api/canvasrenderingcontext2d/fillrect/index.html
@@ -55,7 +55,7 @@ ctx.fillRect(10, 10, 100, 100);
 
 <p>Edite o código abaixo e veja as alterações instantâneas no canvas:</p>
 
-<div style="display: none;">
+<div class="hidden">
 <h6 id="Playable_code">Playable code</h6>
 
 <pre class="brush: html">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
diff --git a/files/pt-br/web/api/canvasrenderingcontext2d/lineto/index.html b/files/pt-br/web/api/canvasrenderingcontext2d/lineto/index.html
index 1876b469a8..4cfab68a36 100644
--- a/files/pt-br/web/api/canvasrenderingcontext2d/lineto/index.html
+++ b/files/pt-br/web/api/canvasrenderingcontext2d/lineto/index.html
@@ -51,7 +51,7 @@ ctx.stroke();
 
 <p>Edite o código abaixo e veja as alterações instantâneas no canvas:</p>
 
-<div style="display: none;">
+<div class="hidden">
 <h6 id="Playable_code">Playable code</h6>
 
 <pre class="brush: html">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
diff --git a/files/pt-br/web/api/canvasrenderingcontext2d/moveto/index.html b/files/pt-br/web/api/canvasrenderingcontext2d/moveto/index.html
index 137e4e2203..af07ef8e3d 100644
--- a/files/pt-br/web/api/canvasrenderingcontext2d/moveto/index.html
+++ b/files/pt-br/web/api/canvasrenderingcontext2d/moveto/index.html
@@ -51,7 +51,7 @@ ctx.stroke();
 
 <p>Edite o código abaixo e veja as alterações instantâneas no canvas:</p>
 
-<div style="display: none;">
+<div class="hidden">
 <h6 id="Playable_code">Playable code</h6>
 
 <pre class="brush: html">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
diff --git a/files/pt-br/web/api/canvasrenderingcontext2d/quadraticcurveto/index.html b/files/pt-br/web/api/canvasrenderingcontext2d/quadraticcurveto/index.html
index b60b7de07c..740d8a54dd 100644
--- a/files/pt-br/web/api/canvasrenderingcontext2d/quadraticcurveto/index.html
+++ b/files/pt-br/web/api/canvasrenderingcontext2d/quadraticcurveto/index.html
@@ -62,7 +62,7 @@ ctx.fillRect(230, 30, 10, 10);</pre>
 
 <p>Edit the code below and see your changes update live in the canvas:</p>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush: html">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
 &lt;div class="playable-buttons"&gt;
   &lt;input id="edit" type="button" value="Edit" /&gt;
diff --git a/files/pt-br/web/api/canvasrenderingcontext2d/rect/index.html b/files/pt-br/web/api/canvasrenderingcontext2d/rect/index.html
index 6c19b38495..ef3f8e2790 100644
--- a/files/pt-br/web/api/canvasrenderingcontext2d/rect/index.html
+++ b/files/pt-br/web/api/canvasrenderingcontext2d/rect/index.html
@@ -52,7 +52,7 @@ ctx.fill();
 
 <p>Edite o código abaixo e veja as alterações instantâneas no canvas:</p>
 
-<div style="display: none;">
+<div class="hidden">
 <h6 id="Playable_code">Playable code</h6>
 
 <pre class="brush: html">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
diff --git a/files/pt-br/web/api/canvasrenderingcontext2d/stroke/index.html b/files/pt-br/web/api/canvasrenderingcontext2d/stroke/index.html
index 866e317383..b522bc7926 100644
--- a/files/pt-br/web/api/canvasrenderingcontext2d/stroke/index.html
+++ b/files/pt-br/web/api/canvasrenderingcontext2d/stroke/index.html
@@ -47,7 +47,7 @@ ctx.stroke();
 
 <p>Edite o código abaixo e veja as alterações instantâneas no canvas:</p>
 
-<div style="display: none;">
+<div class="hidden">
 <h6 id="Playable_code">Playable code</h6>
 
 <pre class="brush: html">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
diff --git a/files/pt-br/web/api/canvasrenderingcontext2d/strokerect/index.html b/files/pt-br/web/api/canvasrenderingcontext2d/strokerect/index.html
index e11812857f..1326fbbaad 100644
--- a/files/pt-br/web/api/canvasrenderingcontext2d/strokerect/index.html
+++ b/files/pt-br/web/api/canvasrenderingcontext2d/strokerect/index.html
@@ -53,7 +53,7 @@ ctx.strokeRect(10, 10, 100, 100);
 
 <p>Edite o código abaixo e veja as alterações instantâneas no canvas:</p>
 
-<div style="display: none;">
+<div class="hidden">
 <h6 id="Playable_code">Playable code</h6>
 
 <pre class="brush: html">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
diff --git a/files/pt-br/web/css/css_background_and_borders/border-image_generator/index.html b/files/pt-br/web/css/css_background_and_borders/border-image_generator/index.html
index 7f4cbb9f2c..019e1d81cf 100644
--- a/files/pt-br/web/css/css_background_and_borders/border-image_generator/index.html
+++ b/files/pt-br/web/css/css_background_and_borders/border-image_generator/index.html
@@ -8,7 +8,7 @@ original_slug: Web/CSS/Tools/Border-image_generator
 ---
 <p><span class="short_text" id="result_box" lang="pt"><span class="hps">Esta ferramenta</span> <span class="hps">pode</span> <span class="hps">ser</span> <span class="hps">utilizada</span> <span class="hps">para gerar o valor </span></span>{{cssxref("border-image")}} em CSS3.</p>
 
-<div style="display: none;">
+<div class="hidden">
 <h2 id="Border_Image_Generator" name="Border_Image_Generator">Border Image Generator</h2>
 
 <h3 id="HTML_Content">HTML Content</h3>
diff --git a/files/pt-br/web/css/css_background_and_borders/border-radius_generator/index.html b/files/pt-br/web/css/css_background_and_borders/border-radius_generator/index.html
index efdba46316..003d65cb31 100644
--- a/files/pt-br/web/css/css_background_and_borders/border-radius_generator/index.html
+++ b/files/pt-br/web/css/css_background_and_borders/border-radius_generator/index.html
@@ -8,7 +8,7 @@ translation_of: Web/CSS/CSS_Background_and_Borders/Border-radius_generator
 original_slug: Web/CSS/Tools/Border-radius_generator
 ---
 <p><span class="short_text" id="result_box" lang="pt"><span class="hps">Esta ferramenta</span> <span class="hps">pode</span> <span class="hps">ser</span> <span class="hps">utilizada</span> <span class="hps">para gerar o efeito </span></span>{{cssxref("border-radius")}} em CSS3.</p>
-<div style="display: none;">
+<div class="hidden">
  <h2 id="border-radius-generator" name="border-radius-generator">border-radius</h2>
  <h3 id="HTML_Content">HTML Content</h3>
  <pre class="brush: html">&lt;div id="container"&gt;
diff --git a/files/pt-br/web/css/css_colors/color_picker_tool/index.html b/files/pt-br/web/css/css_colors/color_picker_tool/index.html
index 5769079812..d064c67f8b 100644
--- a/files/pt-br/web/css/css_colors/color_picker_tool/index.html
+++ b/files/pt-br/web/css/css_colors/color_picker_tool/index.html
@@ -16,7 +16,7 @@ tags:
 translation_of: Web/CSS/CSS_Colors/Color_picker_tool
 original_slug: Web/CSS/CSS_Colors/seletor_de_cores
 ---
-<div style="display: none;">
+<div class="hidden">
 <h2 id="ColorPicker_Tool" name="ColorPicker_Tool">ColorPicker tool</h2>
 
 <h3 id="HTML_Content">HTML Content</h3>
diff --git a/files/pt-br/web/css/css_transitions/using_css_transitions/index.html b/files/pt-br/web/css/css_transitions/using_css_transitions/index.html
index 2e1b4e331f..a839851851 100644
--- a/files/pt-br/web/css/css_transitions/using_css_transitions/index.html
+++ b/files/pt-br/web/css/css_transitions/using_css_transitions/index.html
@@ -39,7 +39,7 @@ translation_of: Web/CSS/CSS_Transitions/Using_CSS_transitions
  <div id="duration_0_5s" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
  <p><code>transition-duration: 0.5s</code></p>
 
- <div style="display: none;">
+ <div class="hidden">
  <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -104,7 +104,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
  <div id="duration_1s" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
  <p><code>transition-duration: 1s</code></p>
 
- <div style="display: none;">
+ <div class="hidden">
  <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -169,7 +169,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
  <div id="duration_2s" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
  <p><code>transition-duration: 2s</code></p>
 
- <div style="display: none;">
+ <div class="hidden">
  <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -234,7 +234,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
  <div id="duration_4s" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
  <p><code>transition-duration: 4s</code></p>
 
- <div style="display: none;">
+ <div class="hidden">
  <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -304,7 +304,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
  <div id="ttf_ease" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
  <p><code>transition-timing-function: ease</code></p>
 
- <div style="display: none;">
+ <div class="hidden">
  <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -367,7 +367,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
  <div id="ttf_linear" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
  <p><code>transition-timing-function: linear</code></p>
 
- <div style="display: none;">
+ <div class="hidden">
  <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -430,7 +430,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
  <div id="ttf_stepend" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
  <p><code>transition-timing-function: step-end</code></p>
 
- <div style="display: none;">
+ <div class="hidden">
  <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -493,7 +493,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
  <div id="ttf_step4end" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
  <p><code>transition-timing-function: steps(4, end)</code></p>
 
- <div style="display: none;">
+ <div class="hidden">
  <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -560,7 +560,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
  <div id="delay_0_5s" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
  <p><code>transition-delay: 0.5s</code></p>
 
- <div style="display: none;">
+ <div class="hidden">
  <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -632,7 +632,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
  <div id="delay_1s" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
  <p><code>transition-delay: 1s</code></p>
 
- <div style="display: none;">
+ <div class="hidden">
  <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -704,7 +704,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
  <div id="delay_2s" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
  <p><code>transition-delay: 2s</code></p>
 
- <div style="display: none;">
+ <div class="hidden">
  <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -776,7 +776,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
  <div id="delay_4s" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
  <p><code>transition-delay: 4s</code></p>
 
- <div style="display: none;">
+ <div class="hidden">
  <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
diff --git a/files/pt-br/web/css/text-decoration-style/index.html b/files/pt-br/web/css/text-decoration-style/index.html
index 9ec4f673a5..134554c304 100644
--- a/files/pt-br/web/css/text-decoration-style/index.html
+++ b/files/pt-br/web/css/text-decoration-style/index.html
@@ -85,7 +85,7 @@ text-decoration-style: unset;
 
 <h2 id="Exemplo">Exemplo</h2>
 
-<pre class="brush: css" style="display: none;">.example {
+<pre class="brush: css" class="hidden">.example {
        -moz-text-decoration-line: underline;
        -moz-text-decoration-style: wavy;
        -moz-text-decoration-color: red;
diff --git a/files/pt-br/web/css/transition-delay/index.html b/files/pt-br/web/css/transition-delay/index.html
index 0257ba610b..46fdf63529 100644
--- a/files/pt-br/web/css/transition-delay/index.html
+++ b/files/pt-br/web/css/transition-delay/index.html
@@ -56,7 +56,7 @@ transition-delay: unset;
 <div id="delay_0_5s" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
 <p><code>transition-delay: 0.5s</code></p>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -123,7 +123,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
 <div id="delay_1s" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
 <p><code>transition-delay: 1s</code></p>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -190,7 +190,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
 <div id="delay_2s" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
 <p><code>transition-delay: 2s</code></p>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -257,7 +257,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
 <div id="delay_4s" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
 <p><code>transition-delay: 4s</code></p>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
diff --git a/files/pt-br/web/css/transition-timing-function/index.html b/files/pt-br/web/css/transition-timing-function/index.html
index f352392102..5a8e741b78 100644
--- a/files/pt-br/web/css/transition-timing-function/index.html
+++ b/files/pt-br/web/css/transition-timing-function/index.html
@@ -55,7 +55,7 @@ transition-timing-function: unset;
 <div id="ttf_ease" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
 <p><code>transition-timing-function: ease</code></p>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -118,7 +118,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
 <div id="ttf_easein" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
 <p><code>transition-timing-function: ease-in</code></p>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -181,7 +181,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
 <div id="ttf_easeout" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
 <p><code>transition-timing-function: ease-out</code></p>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -244,7 +244,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
 <div id="ttf_easeinout" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
 <p><code>transition-timing-function: ease-in-out</code></p>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -308,7 +308,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
 <div id="ttf_linear" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
 <p><code>transition-timing-function: linear</code></p>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -371,7 +371,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
 <div id="ttf_stepstart" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
 <p><code>transition-timing-function: step-start</code></p>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -434,7 +434,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
 <div id="ttf_stepend" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
 <p><code>transition-timing-function: step-end</code></p>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
@@ -497,7 +497,7 @@ var intervalID = window.setInterval(updateTransition, 7000);
 <div id="ttf_step4end" style="width: 251px; display: inline-block; margin-right: 1px; margin-bottom: 1px;">
 <p><code>transition-timing-function: steps(4, end)</code></p>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush:html"> &lt;div class="parent"&gt;
   &lt;div class="box"&gt;Lorem&lt;/div&gt;
 &lt;/div&gt;
diff --git a/files/pt-br/web/css/using_css_custom_properties/index.html b/files/pt-br/web/css/using_css_custom_properties/index.html
index ac311cec06..5e96d9388a 100644
--- a/files/pt-br/web/css/using_css_custom_properties/index.html
+++ b/files/pt-br/web/css/using_css_custom_properties/index.html
@@ -284,7 +284,7 @@ translation_of: Web/CSS/Using_CSS_custom_properties
 
 </pre>
 
-<div style="display: none;">
+<div class="hidden">
 <pre class="brush:html notranslate">&lt;div&gt;
     &lt;div class="one"&gt;&lt;/div&gt;
     &lt;div class="two"&gt;Text &lt;span class="five"&gt;- more text&lt;/span&gt;&lt;/div&gt;
diff --git a/files/pt-br/web/javascript/guide/regular_expressions/index.html b/files/pt-br/web/javascript/guide/regular_expressions/index.html
index 41cc239d94..038cccb762 100644
--- a/files/pt-br/web/javascript/guide/regular_expressions/index.html
+++ b/files/pt-br/web/javascript/guide/regular_expressions/index.html
@@ -58,7 +58,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions
 <p>A tabela abaixo fornece uma lista completa dos caracteres especiais que podem ser utilizados nas expressões regulares, com sua respectiva descrição. Para testar os exemplos de expressão regular você pode usar o <a href="http://regexr.com/">regExr</a>.</p>
 
 <table class="fullwidth-table">
- <caption>Caracteres especiais utilizados em expressões regulares.<span style="display: none;"> </span><span style="display: none;"> </span></caption>
+ <caption>Caracteres especiais utilizados em expressões regulares.<span class="hidden"> </span><span class="hidden"> </span></caption>
  <thead>
   <tr>
    <th scope="col">Caractere</th>
diff --git a/files/pt-br/web/javascript/reference/global_objects/array/filter/index.html b/files/pt-br/web/javascript/reference/global_objects/array/filter/index.html
index ce591d2cac..9daed5325a 100644
--- a/files/pt-br/web/javascript/reference/global_objects/array/filter/index.html
+++ b/files/pt-br/web/javascript/reference/global_objects/array/filter/index.html
@@ -225,4 +225,4 @@ console.log(filterItems('an')); // ['banana', 'mango', 'orange']</pre>
  <li>{{jsxref("Array.prototype.reduce()")}}</li>
 </ul>
 
-<div id="link64_adl_tabid" style="display: none;">24</div>
+<div id="link64_adl_tabid" class="hidden">24</div>
diff --git a/files/pt-br/web/javascript/reference/global_objects/array/sort/index.html b/files/pt-br/web/javascript/reference/global_objects/array/sort/index.html
index 6b1f8fcc15..12f2fc1fcc 100644
--- a/files/pt-br/web/javascript/reference/global_objects/array/sort/index.html
+++ b/files/pt-br/web/javascript/reference/global_objects/array/sort/index.html
@@ -229,4 +229,4 @@ var result = mapped.map(function(el){
  <li>{{jsxref("String.prototype.localeCompare()")}}</li>
 </ul>
 
-<div id="link64_adl_tabid" style="display: none;">253</div>
+<div id="link64_adl_tabid" class="hidden">253</div>
diff --git a/files/pt-br/web/javascript/reference/global_objects/map/set/index.html b/files/pt-br/web/javascript/reference/global_objects/map/set/index.html
index e161bb2926..2f50555333 100644
--- a/files/pt-br/web/javascript/reference/global_objects/map/set/index.html
+++ b/files/pt-br/web/javascript/reference/global_objects/map/set/index.html
@@ -56,10 +56,10 @@ myMap.set('bar', 'baz');
   <tr>
    <td>{{SpecName('ES2015', '#sec-map.prototype.set', 'Map.prototype.set')}}</td>
    <td>{{Spec2('ES2015')}}</td>
-   <td><span style="display: none;"> </span>Definição    inicial.</td>
+   <td><span class="hidden"> </span>Definição    inicial.</td>
   </tr>
   <tr>
-   <td><span style="display: none;"> </span>{{SpecName('ESDraft', '#sec-map.prototype.set', 'Map.prototype.set')}}</td>
+   <td><span class="hidden"> </span>{{SpecName('ESDraft', '#sec-map.prototype.set', 'Map.prototype.set')}}</td>
    <td>{{Spec2('ESDraft')}}</td>
    <td> </td>
   </tr>
diff --git a/files/pt-br/web/javascript/reference/global_objects/math/cos/index.html b/files/pt-br/web/javascript/reference/global_objects/math/cos/index.html
index c0b0662477..566f343230 100644
--- a/files/pt-br/web/javascript/reference/global_objects/math/cos/index.html
+++ b/files/pt-br/web/javascript/reference/global_objects/math/cos/index.html
@@ -14,7 +14,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Math/cos
 ---
 <div>{{JSRef}}</div>
 
-<p><span style="display: none;"> </span><span class="seoSummary">A função <strong><code>Math.cos()</code></strong> ,que é estatica, retorna o {{interwiki("wikipedia", "cosseno")}} de um ângulo, que deve estar em {{interwiki("wikipedia", "radianos")}}. A expressão é </span><math style="display: inline;"> <mstyle displaystyle="true"> <mfrac> <msub> <mrow> <mtext>length</mtext> </mrow> <mrow> <mrow> <mtext>adjacent</mtext> </mrow> </mrow> </msub> <msub> <mrow> <mtext>length</mtext> </mrow> <mrow> <mrow> <mtext>hypotenuse</mtext> </mrow> </mrow> </msub> </mfrac> </mstyle> </math>.<span style="display: none;"> </span></p>
+<p><span class="hidden"> </span><span class="seoSummary">A função <strong><code>Math.cos()</code></strong> ,que é estatica, retorna o {{interwiki("wikipedia", "cosseno")}} de um ângulo, que deve estar em {{interwiki("wikipedia", "radianos")}}. A expressão é </span><math style="display: inline;"> <mstyle displaystyle="true"> <mfrac> <msub> <mrow> <mtext>length</mtext> </mrow> <mrow> <mrow> <mtext>adjacent</mtext> </mrow> </mrow> </msub> <msub> <mrow> <mtext>length</mtext> </mrow> <mrow> <mrow> <mtext>hypotenuse</mtext> </mrow> </mrow> </msub> </mfrac> </mstyle> </math>.<span class="hidden"> </span></p>
 
 <div>{{EmbedInteractiveExample("pages/js/math-cos.html")}}</div>
 
diff --git a/files/pt-br/web/javascript/reference/global_objects/number/index.html b/files/pt-br/web/javascript/reference/global_objects/number/index.html
index a21a4264af..b7d967a8f1 100644
--- a/files/pt-br/web/javascript/reference/global_objects/number/index.html
+++ b/files/pt-br/web/javascript/reference/global_objects/number/index.html
@@ -110,7 +110,7 @@ var minInt = -9007199254740992;
 
 <p>Ao analisar dados que foram serializados para JSON, valores inteiros que caem fora desse intervalo podem ser corrompidos quando o analisador JSON os converte ao tipo <code>Number</code>. Usando <code>String </code>em vez disso é uma possível alternativa para se evitar um resultado indesejado.</p>
 
-<h3 id="Example:_Using_Number_to_convert_a_Date_object" name="Example:_Using_Number_to_convert_a_Date_object"><span style="display: none;"> </span>Exemplo: Usando <code>Number para converter um objeto</code> <code>Date</code></h3>
+<h3 id="Example:_Using_Number_to_convert_a_Date_object" name="Example:_Using_Number_to_convert_a_Date_object"><span class="hidden"> </span>Exemplo: Usando <code>Number para converter um objeto</code> <code>Date</code></h3>
 
 <p>O exemplo a seguir converte o objeto <code>Date</code> para um valor numérico usando <code>Number como uma função</code>:</p>
 
diff --git a/files/pt-br/web/javascript/reference/global_objects/promise/index.html b/files/pt-br/web/javascript/reference/global_objects/promise/index.html
index d3d0e76322..37453735b1 100644
--- a/files/pt-br/web/javascript/reference/global_objects/promise/index.html
+++ b/files/pt-br/web/javascript/reference/global_objects/promise/index.html
@@ -75,7 +75,6 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise
 
 <h3 id="Criando_uma_Promise">Criando uma Promise</h3>
 
-<pre class="brush: html notranslate" style="display: none;">&lt;button id="btn"&gt;Make a promise!&lt;/button&gt;
 &lt;div id="log"&gt;&lt;/div&gt;
 </pre>
 
@@ -119,7 +118,7 @@ function testPromise() {
 }
 </pre>
 
-<pre class="brush:js notranslate" style="display: none;">if ("Promise" in window) {
+<pre class="brush:js notranslate" class="hidden">if ("Promise" in window) {
   btn = document.getElementById("btn");
    btn.addEventListener("click",testPromise);
 }
diff --git a/files/pt-br/web/mathml/element/math/index.html b/files/pt-br/web/mathml/element/math/index.html
index b778ed54be..fbf78fce9f 100644
--- a/files/pt-br/web/mathml/element/math/index.html
+++ b/files/pt-br/web/mathml/element/math/index.html
@@ -15,7 +15,7 @@ translation_of: Web/MathML/Element/math
  <dt id="attr-dir">
   dir</dt>
  <dd>
-  <span style="display: none;"> </span>Overall directionality of formulas. Possible values are either <code>ltr</code> (left to right) or <code>rtl</code> (right to left).</dd>
+  <span class="hidden"> </span>Overall directionality of formulas. Possible values are either <code>ltr</code> (left to right) or <code>rtl</code> (right to left).</dd>
  <dt id="attr-href">
   href</dt>
  <dd>