diff --git a/.github/workflows/Deploy.yml b/.github/workflows/Deploy.yml
index 11703eab..4cc18f79 100644
--- a/.github/workflows/Deploy.yml
+++ b/.github/workflows/Deploy.yml
@@ -11,7 +11,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
     - name: Checkout
-      uses: actions/checkout@v2
+      uses: actions/checkout@v3
       with:
         persist-credentials: false
     # NOTE: Python is necessary for the pre-rendering (minification) step
diff --git a/_layout/head.html b/_layout/head.html
index 1f29d624..8c9e35d5 100644
--- a/_layout/head.html
+++ b/_layout/head.html
@@ -50,8 +50,20 @@
 
     <!-- Bootstrap CSS (4.1) -->
 		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
-    <link rel="stylesheet" href="/css/script_default.css">
-    <link rel="stylesheet" href="/css/site.css">
+    {{ispage index || ispage 404}}
+      <link rel="stylesheet" href="./css/script_default.css">
+      <link rel="stylesheet" href="./css/site.css">
+    {{end}}
+
+    {{ispage blogposts/* || ispage tutorialposts/*}}
+      <link rel="stylesheet" href="../../css/script_default.css">
+      <link rel="stylesheet" href="../../css/site.css">
+    {{end}}
+
+    {{ispage getting_started || ispage blog || ispage governance || ispage gsoc || ispage tutorials}}
+      <link rel="stylesheet" href="../css/script_default.css">
+      <link rel="stylesheet" href="../css/site.css">
+    {{end}}
 
     <!-- Font Awesome -->
     <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
diff --git a/_layout/navbar.html b/_layout/navbar.html
index f0ee46ec..e1113ef7 100644
--- a/_layout/navbar.html
+++ b/_layout/navbar.html
@@ -1,31 +1,88 @@
 <!-- Navbar -->
 <nav class="navbar navbar-expand-lg navbar-dark container lighter">
-  <a class="navbar-brand" href="/">
-    <div class="logo" style="font-size:30pt;margin-top:-15px;margin-bottom:-10px;">flux</div>
-  </a>
+  {{ispage index || ispage 404}}
+    <a class="navbar-brand" href="./">
+      <div class="logo" style="font-size:30pt;margin-top:-15px;margin-bottom:-10px;">flux</div>
+    </a>
+  {{end}}
+
+  {{ispage blogposts/* || ispage tutorialposts/*}}
+    <a class="navbar-brand" href="../../">
+      <div class="logo" style="font-size:30pt;margin-top:-15px;margin-bottom:-10px;">flux</div>
+    </a>
+  {{end}}
+
+  {{ispage getting_started || ispage blog || ispage governance || ispage gsoc || ispage tutorials}}
+    <a class="navbar-brand" href="../">
+      <div class="logo" style="font-size:30pt;margin-top:-15px;margin-bottom:-10px;">flux</div>
+    </a>
+  {{end}}
   <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
     <span class="navbar-toggler-icon"></span>
   </button>
 
   <div class="collapse navbar-collapse" id="navbarSupportedContent">
     <ul class="navbar-nav mr-auto">
-      <li class="nav-item">
-        <a class="nav-link" href="/getting_started/">Getting Started</a>
-      </li>
-      <li class="nav-item">
-        <a class="nav-link" href="https://fluxml.ai/Flux.jl/" target="_blank">Docs</a>
-      </li>
-      <li class="nav-item">
-        <a class="nav-link" href="/blog/">Blog</a>
-      </li>
-      <li class="nav-item">
-        <a class="nav-link" href="/tutorials/">Tutorials</a>
-      </li>
-      <li class="nav-item">
-        <a class="nav-link" href="https://fluxml.ai/Flux.jl/dev/ecosystem/">Ecosystem</a>
-      </li>
-      <li class="nav-item">
-        <a class="nav-link" href="/gsoc/">GSoC</a>
+      {{ispage index || ispage 404}}
+        <li class="nav-item">
+          <a class="nav-link" href="./getting_started/">Getting Started</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="https://fluxml.ai/Flux.jl/" target="_blank">Docs</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="./blog/">Blog</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="./tutorials/">Tutorials</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="https://fluxml.ai/Flux.jl/dev/ecosystem/">Ecosystem</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="./gsoc/">GSoC</a>
+      {{end}}
+
+      {{ispage blogposts/* || ispage tutorialposts/*}}
+        <li class="nav-item">
+          <a class="nav-link" href="../../getting_started/">Getting Started</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="https://fluxml.ai/Flux.jl/" target="_blank">Docs</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="../../blog/">Blog</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="../../tutorials/">Tutorials</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="https://fluxml.ai/Flux.jl/dev/ecosystem/">Ecosystem</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="../../gsoc/">GSoC</a>
+      {{end}}
+
+      {{ispage getting_started || ispage blog || ispage governance || ispage gsoc || ispage tutorials}}
+        <li class="nav-item">
+          <a class="nav-link" href="../getting_started/">Getting Started</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="https://fluxml.ai/Flux.jl/" target="_blank">Docs</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="../blog/">Blog</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="../tutorials/">Tutorials</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="https://fluxml.ai/Flux.jl/dev/ecosystem/">Ecosystem</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="../gsoc/">GSoC</a>
+      {{end}}
+
       </li>
       <li class="nav-item">
         <a class="nav-link" href="https://discourse.julialang.org/c/domain/ML" target="_blank">Discuss</a>
diff --git a/blogposts/2019-03-05-dp-vs-rl.md b/blogposts/2019-03-05-dp-vs-rl.md
index bf89897f..819c0461 100755
--- a/blogposts/2019-03-05-dp-vs-rl.md
+++ b/blogposts/2019-03-05-dp-vs-rl.md
@@ -10,7 +10,7 @@ We've discussed the idea of [differentiable programming](https://fluxml.ai/2019/
 
 Differentiation is what makes deep learning tick; given a function $y = f(x)$ we use the gradient $\frac{dy}{dx}$ to figure out how a change in $x$ will affect $y$. Despite the mathematical clothing, gradients are actually a very general and intuitive concept. Forget the formulas you had to stare at in school; let's do something more fun, like throwing stuff.
 
-![](/assets/blogposts/2019-03-05-dp-vs-rl/trebuchet-basic.gif)
+![](../../assets/blogposts/2019-03-05-dp-vs-rl/trebuchet-basic.gif)
 
 When we throw things with a trebuchet, our $x$ represents a setting (say, the size of the counterweight, or the angle of release), and $y$ is the distance the projectile travels before landing. If you're trying to aim, the gradient tells you something very useful – whether a change in aim will increase or decrease the distance. To maximise distance, just follow the gradient.
 
@@ -31,19 +31,19 @@ Now we have that, let's do something interesting with it.
 
 A simple way to use this is to aim the trebuchet at a target, using gradients to fine-tune the angle of release; this kind of thing is common under the name of _parameter estimation_, and we've [covered examples like it before](https://julialang.org/blog/2019/01/fluxdiffeq). We can make things more interesting by going meta: instead of aiming the trebuchet given a single target, we'll optimise a neural network that can aim it given _any_ target. Here's how it works: the neural net takes two inputs, the target distance in metres and the current wind speed. The network spits out trebuchet settings (the mass of the counterweight and the angle of release) that get fed into the simulator, which calculates the achieved distance. We then compare to our target, and _backpropagate through the entire chain_, end to end, to adjust the weights of the network. Our "dataset" is a randomly chosen set of targets and wind speeds.
 
-![](/assets/blogposts/2019-03-05-dp-vs-rl/trebuchet-flow.png)
+![](../../assets/blogposts/2019-03-05-dp-vs-rl/trebuchet-flow.png)
 
 A nice property of this simple model is that training it is _fast_, because we've expressed exactly what we want from the model in a fully differentiable way. Initially it looks like this:
 
-![](/assets/blogposts/2019-03-05-dp-vs-rl/trebuchet-miss.gif)
+![](../../assets/blogposts/2019-03-05-dp-vs-rl/trebuchet-miss.gif)
 
 After about five minutes of training (on a single core of my laptop's CPU), it looks like this:
 
-![](/assets/blogposts/2019-03-05-dp-vs-rl/trebuchet-hit.gif)
+![](../../assets/blogposts/2019-03-05-dp-vs-rl/trebuchet-hit.gif)
 
 If you want to try pushing it, turn up the wind speed:
 
-![](/assets/blogposts/2019-03-05-dp-vs-rl/trebuchet-wind.gif)
+![](../../assets/blogposts/2019-03-05-dp-vs-rl/trebuchet-wind.gif)
 
 It's only off by 16cm, or about 0.3%.
 
@@ -55,7 +55,7 @@ This is about the simplest possible control problem, which we use mainly for ill
 
 A more recognisable control problem is [CartPole](https://gym.openai.com/envs/CartPole-v0/), the "hello world" for reinforcement learning. The task is to learn to balance an upright pole by nudging its base left or right. Our setup is broadly similar to the trebuchet case: a [Julia implementation](https://github.com/tejank10/Gym.jl) means we can directly treat the reward produced by the environment as a loss. ∂P allows us to switch seamlessly from model-free to model-based RL.
 
-![](/assets/blogposts/2019-03-05-dp-vs-rl/cartpole-flow.png)
+![](../../assets/blogposts/2019-03-05-dp-vs-rl/cartpole-flow.png)
 
 The astute reader may notice a snag. The action space for cartpole – nudge left or right – is discrete, and therefore not differentiable. We solve this by introducing a _differentiable discretisation_, defined [like so](https://github.com/FluxML/model-zoo/blob/cdda5cad3e87b216fa67069a5ca84a3016f2a604/games/differentiable-programming/cartpole/DiffRL.jl#L32):
 
@@ -74,22 +74,22 @@ In other words, we force the gradient to behave as if $f$ were the identity func
 
 The results speak for themselves. Where RL methods need to train for hundreds of episodes before solving the problem, the ∂P model only needs around 5 episodes to win conclusively.
 
-![](/assets/blogposts/2019-03-05-dp-vs-rl/cartpole.gif)
+![](../../assets/blogposts/2019-03-05-dp-vs-rl/cartpole.gif)
 
 
 ## The Pendulum & Backprop through Time
 
 An important aim for RL is to handle _delayed reward_, when an action doesn't help us until several steps in the future. ∂P allows this too, and in a very familiar way: when the environment is differentiable, we can actually train the agent using backpropagation through time, just like a recurrent net! In this case the environmental state becomes the "hidden state" that changes between time steps.
 
-![](/assets/blogposts/2019-03-05-dp-vs-rl/bptt.png)
+![](../../assets/blogposts/2019-03-05-dp-vs-rl/bptt.png)
 
 To demonstrate this technique we looked at the [pendulum](https://github.com/openai/gym/wiki/Pendulum-v0) environment, where the task is to swing a pendulum until it stands upright, keeping it balanced with minimal effort. This is hard for RL models; after around 20 episodes of training the problem is solved, but often the route to a solution is visibly sub-optimal. In contrast, BPTT can beat the [RL leaderboard](https://github.com/openai/gym/wiki/Leaderboard#pendulum-v0) in _a single episode of training_. It's instructive to actually watch this episode unfold; at the beginning of the recording the strategy is random, and the model improves over time. The pace of learning is almost alarming.
 
-![](/assets/blogposts/2019-03-05-dp-vs-rl/pendulum-training.gif)
+![](../../assets/blogposts/2019-03-05-dp-vs-rl/pendulum-training.gif)
 
 Despite only experiencing a single episode, the model generalises well to handle any initial angle, and has something pretty close to the optimal strategy. When restarted the model looks more like this.
 
-![](/assets/blogposts/2019-03-05-dp-vs-rl/pendulum-dp.gif)
+![](../../assets/blogposts/2019-03-05-dp-vs-rl/pendulum-dp.gif)
 
 This is just the beginning; we'll get the real wins applying DP to environments that are too hard for RL to work with at all, where rich simulations and models already exist (as in much of engineering and the sciences), and where interpretability is an important factor (as in medicine).
 
diff --git a/blogposts/2019-09-11-simulating-the-motion-of-charges.md b/blogposts/2019-09-11-simulating-the-motion-of-charges.md
index 1e719fe0..1b84565c 100755
--- a/blogposts/2019-09-11-simulating-the-motion-of-charges.md
+++ b/blogposts/2019-09-11-simulating-the-motion-of-charges.md
@@ -131,7 +131,7 @@ end
 
 Using some basic plotting functions, I graphed my charges at every training iteration and put them all together in a gif.
 
-![](/assets/charges/maingif.gif)
+![](../../assets/charges/maingif.gif)
 
 *Red charges are positive, Blue charges are negative and size of the dot is proportional to the absolute value of charge.*
 
@@ -143,18 +143,18 @@ Let’s prove this.
 
 Let’s take a trivial case and define a system of two charges: one positive and one negative. Let’s place them diametrically opposite with respect to the origin.
 
-![](/assets/charges/plot1.png)
+![](../../assets/charges/plot1.png)
 
 What do we expect to happen? The charges should move together.
 
-![](/assets/charges/plot2.png)
+![](../../assets/charges/plot2.png)
 
 And they do!
 
 _(What’s interesting is that they seem to have overshot and actually crossed each other at one point, only to get drawn to each other once more. An apt parallel is charges overshooting due to inertia of motion)_
 
 Let’s go back to that system of 100 charges and plot the potential energy at every training iteration.
-![](/assets/charges/plot3.png)
+![](../../assets/charges/plot3.png)
 
 It’s safe to say that the system has converged at a value of approximately -1360 .
 
diff --git a/blogposts/2020-06-29-acclerating-flux-torch.md b/blogposts/2020-06-29-acclerating-flux-torch.md
index 9144ce75..7e2b81ed 100755
--- a/blogposts/2020-06-29-acclerating-flux-torch.md
+++ b/blogposts/2020-06-29-acclerating-flux-torch.md
@@ -12,8 +12,8 @@ For popular object detection models - ResNet50, ResNet101 and VGG19 - we compare
 
 ~~~
 <p float="middle">
-  <img src="/assets/blogposts/2020-06-29-acclerating-flux-torch/combined_benchmarks_2.png">
-  <img src="/assets/blogposts/2020-06-29-acclerating-flux-torch/resnet101.png" height="300">
+  <img src="../../assets/blogposts/2020-06-29-acclerating-flux-torch/combined_benchmarks_2.png">
+  <img src="../../assets/blogposts/2020-06-29-acclerating-flux-torch/resnet101.png" height="300">
 </p>
 ~~~
 
diff --git a/blogposts/2020-12-20-Flux3D.md b/blogposts/2020-12-20-Flux3D.md
index ef719dba..2c1add47 100644
--- a/blogposts/2020-12-20-Flux3D.md
+++ b/blogposts/2020-12-20-Flux3D.md
@@ -12,7 +12,7 @@ Performing 3D vision tasks involve preparing datasets to fit a certain represent
 
 ~~~
 <div style="text-align:center">
-  <img width="400" src="/assets/blogposts/2020-12-20-Flux3D/visualize_anim.gif">
+  <img width="400" src="../../assets/blogposts/2020-12-20-Flux3D/visualize_anim.gif">
 </div>
 ~~~
 
@@ -36,9 +36,9 @@ Kaolin is a popular 3D vision library based on PyTorch. Flux3D.jl is overall fas
 
 ~~~
 <p float="middle">
-  <img src="/assets/blogposts/2020-12-20-Flux3D/bm_pcloud.png">
-  <img src="/assets/blogposts/2020-12-20-Flux3D/bm_trimesh.png">
-  <img src="/assets/blogposts/2020-12-20-Flux3D/bm_metrics.png">
+  <img src="../../assets/blogposts/2020-12-20-Flux3D/bm_pcloud.png">
+  <img src="../../assets/blogposts/2020-12-20-Flux3D/bm_trimesh.png">
+  <img src="../../assets/blogposts/2020-12-20-Flux3D/bm_metrics.png">
 </p>
 ~~~
 
@@ -158,7 +158,7 @@ Additonally, 3D structures and all relevant transforms, as well as metrics, are
 
 ~~~
 <div style="text-align:center">
-  <img width="300" src="/assets/blogposts/2020-12-20-Flux3D/fitmesh_anim.gif">
+  <img width="300" src="../../assets/blogposts/2020-12-20-Flux3D/fitmesh_anim.gif">
 </div>
 ~~~
 
@@ -183,7 +183,7 @@ julia> vbox(
 
 ~~~
 <div style="text-align:center">
-  <img src="/assets/blogposts/2020-12-20-Flux3D/visualize.png">
+  <img src="../../assets/blogposts/2020-12-20-Flux3D/visualize.png">
 </div>
 ~~~
 
diff --git a/blogposts/2021-12-1-flux-numfocus.md b/blogposts/2021-12-1-flux-numfocus.md
index 23a99983..a906381f 100644
--- a/blogposts/2021-12-1-flux-numfocus.md
+++ b/blogposts/2021-12-1-flux-numfocus.md
@@ -6,7 +6,7 @@ author = "Dhairya Gandhi, Logan Kilpatrick"
 
 ~~~
 <p float="middle">
-  <img src="/assets/blogposts/2021-12-1-flux-numfocus/flux_numfocus.png" height="300">
+  <img src="../../assets/blogposts/2021-12-1-flux-numfocus/flux_numfocus.png" height="300">
 </p>
 ~~~
 
diff --git a/index.md b/index.md
index b15cbd6a..b9e6bf2c 100644
--- a/index.md
+++ b/index.md
@@ -2,7 +2,7 @@
 @@jumbotron,jumbotron-fluid,no-pad
   @@container
     ~~~
-    <img src="/assets/logo.png" style="max-width:100%;padding-bottom:20px"/>
+    <img src="./assets/logo.png" style="max-width:100%;padding-bottom:20px"/>
     <h2>The <i>Elegant</i> Machine Learning Stack</h2>
     Flux is a 100% pure-Julia stack and provides lightweight abstractions on top of Julia's native GPU and AD support. It makes the easy things easy while remaining fully hackable.
     ~~~
@@ -194,17 +194,17 @@
     @@row
       @@col-md
         ~~~
-        <a href="https://julia.mit.edu"><img src="/assets/friends/mit-logo.png"></a>
+        <a href="https://julia.mit.edu"><img src="./assets/friends/mit-logo.png"></a>
         ~~~
       @@
       @@col-md
         ~~~
-        <a href="https://www.ucl.ac.uk"><img src="/assets/friends/ucl-logo.png"></a>
+        <a href="https://www.ucl.ac.uk"><img src="./assets/friends/ucl-logo.png"></a>
         ~~~
       @@
       @@col-md
         ~~~
-        <a href="https://www.utoronto.ca"><img src="/assets/friends/uoft_logo.png"></a>
+        <a href="https://www.utoronto.ca"><img src="./assets/friends/uoft_logo.png"></a>
         ~~~
       @@
     @@
@@ -212,17 +212,17 @@
     @@row
       @@col-md
         ~~~
-        <a href="https://juliacomputing.com"><img src="/assets/friends/juliac-logo.png"></a>
+        <a href="https://juliacomputing.com"><img src="./assets/friends/juliac-logo.png"></a>
         ~~~
       @@
       @@col-md
         ~~~
-        <a href="https://www.turing.ac.uk/research/research-projects/machine-learning-julia"><img src="/assets/friends/alan-turing.jpg"></a>
+        <a href="https://www.turing.ac.uk/research/research-projects/machine-learning-julia"><img src="./assets/friends/alan-turing.jpg"></a>
         ~~~
       @@
       @@col-md
         ~~~
-        <a href="https://www.ed.ac.uk"><img src="/assets/friends/edinburgh.png"></a>
+        <a href="https://www.ed.ac.uk"><img src="./assets/friends/edinburgh.png"></a>
         ~~~
       @@
     @@
@@ -230,17 +230,17 @@
     @@row
       @@col-md
         ~~~
-        <a href="https://www.relational.ai"><img src="/assets/friends/rai-logo.png"></a>
+        <a href="https://www.relational.ai"><img src="./assets/friends/rai-logo.png"></a>
         ~~~
       @@
       @@col-md
         ~~~
-        <a href="https://www.washington.edu"><img src="/assets/friends/washington.jpg"></a>
+        <a href="https://www.washington.edu"><img src="./assets/friends/washington.jpg"></a>
         ~~~
       @@
       @@col-md
         ~~~
-        <a href="https://www.cam.ac.uk"><img src="/assets/friends/cambridge.jpg"></a>
+        <a href="https://www.cam.ac.uk"><img src="./assets/friends/cambridge.jpg"></a>
         ~~~
       @@
     @@
@@ -248,17 +248,17 @@
     @@row
       @@col-md
         ~~~
-        <a href="https://www.cmu.edu"><img src="/assets/friends/cmu-logo.png"></a>
+        <a href="https://www.cmu.edu"><img src="./assets/friends/cmu-logo.png"></a>
         ~~~
       @@
       @@col-md
         ~~~
-        <a href="https://www.invenia.ca"><img src="/assets/friends/invenia-logo.png"></a>
+        <a href="https://www.invenia.ca"><img src="./assets/friends/invenia-logo.png"></a>
         ~~~
       @@
       @@col-md
         ~~~
-        <a href="https://beacon.bio"><img src="/assets/friends/beacon_biosignals.jpg"></a>
+        <a href="https://beacon.bio"><img src="./assets/friends/beacon_biosignals.jpg"></a>
         ~~~
       @@
     @@
diff --git a/tutorialposts/2021-10-08-dcgan-mnist.md b/tutorialposts/2021-10-08-dcgan-mnist.md
index 0eefb66a..4d339113 100644
--- a/tutorialposts/2021-10-08-dcgan-mnist.md
+++ b/tutorialposts/2021-10-08-dcgan-mnist.md
@@ -11,7 +11,7 @@ This is a beginner level tutorial for generating images of handwritten digits us
 
 A GAN is composed of two sub-models - the **generator** and the **discriminator** acting against one another. The generator can be considered as an artist who draws (generates) new images that look real, whereas the discriminator is a critic who learns to tell real images apart from fakes.
 
-![](/assets/tutorialposts/2021-10-8-dcgan-mnist/cat_gan.png)
+![](../../assets/tutorialposts/2021-10-8-dcgan-mnist/cat_gan.png)
 
 The GAN starts with a generator and discriminator which have very little or no idea about the underlying data. During training, the generator progressively becomes better at creating images that look real, while the discriminator becomes better at telling them apart. The process reaches equilibrium when the discriminator can no longer distinguish real images from fakes.
 
@@ -25,7 +25,7 @@ This tutorial demonstrates the process of training a DC-GAN on the [MNIST datase
 ~~~
 <br><br>
 <p align="center">
-<img src="/assets/tutorialposts/2021-10-8-dcgan-mnist/output.gif" align="middle" width="200">
+<img src="../../assets/tutorialposts/2021-10-8-dcgan-mnist/output.gif" align="middle" width="200">
 </p>
 ~~~
 
@@ -361,7 +361,7 @@ save("./output.gif", gif_mat)
 ```
 <br>
 <p align="center">
-<img src="/assets/tutorialposts/2021-10-8-dcgan-mnist/output.gif" align="middle" width="200">
+<img src="../../assets/tutorialposts/2021-10-8-dcgan-mnist/output.gif" align="middle" width="200">
 </p>
 
 ## Resources & References