Add background images to sections

Author: robertheory

Diff for: assets/css/main.css

@@ -3902,8 +3902,7 @@ body.is-preload #banner:after {
 
 /* Main */
 
-#main > header {
-  padding: 12em 0 10em 0;
+.bg0 {
   background-image: -moz-linear-gradient(
       top,
       rgba(0, 0, 0, 0.5),
@@ -3928,6 +3927,64 @@ body.is-preload #banner:after {
   background-position: center center;
   background-repeat: no-repeat;
   background-size: cover;
+}
+
+.bg1 {
+  background-image: -moz-linear-gradient(
+      top,
+      rgba(0, 0, 0, 0.5),
+      rgba(0, 0, 0, 0.5)
+    ),
+    url('../../images/rio.jpg');
+  background-image: -webkit-linear-gradient(
+      top,
+      rgba(0, 0, 0, 0.5),
+      rgba(0, 0, 0, 0.5)
+    ),
+    url('../../images/rio.jpg');
+  background-image: -ms-linear-gradient(
+      top,
+      rgba(0, 0, 0, 0.5),
+      rgba(0, 0, 0, 0.5)
+    ),
+    url('../../images/rio.jpg');
+  background-image: linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
+    url('../../images/rio.jpg');
+  background-attachment: fixed;
+  background-position: center center;
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+
+.bg2 {
+  background-image: -moz-linear-gradient(
+      top,
+      rgba(0, 0, 0, 0.5),
+      rgba(0, 0, 0, 0.5)
+    ),
+    url('../../images/bg/6.jpg');
+  background-image: -webkit-linear-gradient(
+      top,
+      rgba(0, 0, 0, 0.5),
+      rgba(0, 0, 0, 0.5)
+    ),
+    url('../../images/bg/6.jpg');
+  background-image: -ms-linear-gradient(
+      top,
+      rgba(0, 0, 0, 0.5),
+      rgba(0, 0, 0, 0.5)
+    ),
+    url('../../images/bg/6.jpg');
+  background-image: linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
+    url('../../images/bg/6.jpg');
+  background-attachment: fixed;
+  background-position: center center;
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+
+#main > header {
+  padding: 12em 0 10em 0;
   text-align: center;
 }
 

Diff for: chamada-de-palestrantes.html

@@ -58,7 +58,7 @@ <h1><a href="index.html">PHP'n Rio</a></h1>
       </header>
 
       <!-- Main -->
-      <article id="main">
+      <article id="main" class="bg2">
         <header>
           <h2>Chamada de Palestrantes</h2>
           <p>Seja você um dos palestrantes do PHP'n Rio 2024.</p>

Diff for: index.html

@@ -54,7 +54,7 @@ <h1><a href="index.html">PHP'n Rio</a></h1>
       </header>
 
       <!-- Banner -->
-      <section id="banner">
+      <section id="banner" class="bg0">
         <div class="inner">
           <p>
             Vem aí o maior encontro de PHP<br />

Diff for: palestrantes.html

@@ -58,7 +58,7 @@ <h1><a href="index.html">PHP'n Rio</a></h1>
       </header>
 
       <!-- Main -->
-      <article id="main">
+      <article id="main" class="bg1">
         <header>
           <h2>Palestrantes Oficiais</h2>
           <p>