diff --git a/sass/form.scss b/sass/form.scss
index 183d131..d45e0a6 100644
--- a/sass/form.scss
+++ b/sass/form.scss
@@ -9,8 +9,8 @@ select {
   color: var(--color-input);
   border-color: var(--color-input-border);
   background-color: var(--color-input-bg);
-  padding-right: var(--spacing-s);
-  padding-left: var(--spacing-s);
+  padding-inline-end: var(--spacing-s);
+  padding-inline-start: var(--spacing-s);
 
   &:focus {
     @include focus;
@@ -109,14 +109,14 @@ input-submit {
   }
 
   & > *:first-child {
-    border-top-right-radius: 0;
-    border-bottom-right-radius: 0;
-    border-right: none;
+    border-start-end-radius: 0;
+    border-end-end-radius: 0;
+    border-inline-end: none;
   }
 
   & > *:nth-child(2) {
-    border-top-left-radius: 0;
-    border-bottom-left-radius: 0;
+    border-start-start-radius: 0;
+    border-end-start-radius: 0;
     border: 1px solid var(--color-border);
   }
 }
@@ -131,7 +131,7 @@ input-submit {
     width: var(--height-checkbox);
     position: absolute;
     border: none;
-    left: 0;
+    inset-inline-start: 0;
     padding: 0;
     background-color: transparent;
 
@@ -146,7 +146,7 @@ input-submit {
     display: inline-block;
     margin: 0;
     font-size: var(--font-base);
-    padding-left: calc(var(--height-checkbox) + var(--spacing-s));
+    padding-inline-start: calc(var(--height-checkbox) + var(--spacing-s));
     min-height: var(--height-checkbox);
 
     &::before {
@@ -191,8 +191,8 @@ input-submit {
     width: var(--height-checkbox);
     border: 1px solid var(--color-input-border);
     border-radius: var(--border-radius);
-    left: 0px;
-    top: -1px;
+    inset-inline-start: 0px;
+    inset-block-start: -1px;
   }
 
   // Checkmark of the fake checkbox
@@ -203,8 +203,8 @@ input-submit {
     border-bottom: 2px solid;
     border-color: var(--color-input-toggle);
     transform: rotate(-45deg);
-    left: 6px;
-    top: 6px;
+    inset-inline-start: 6px;
+    inset-block-start: 6px;
   }
 }
 
@@ -219,8 +219,8 @@ input-submit {
     width: var(--height-radio);
     border: 1px solid var(--color-input-border);
     border-radius: calc(var(--height-radio) * 0.5);
-    left: 0px;
-    top: -1px;
+    inset-inline-start: 0px;
+    inset-block-start: -1px;
   }
 
   // Checkmark of the fake radio
@@ -229,8 +229,8 @@ input-submit {
     width: 12px;
     border-radius: 50%;
     background-color: var(--color-secondary);
-    left: 6px;
-    top: 5px;
+    inset-inline-start: 6px;
+    inset-block-start: 5px;
   }
 }
 
@@ -244,10 +244,10 @@ input-submit {
     text-align: center;
 
     &:first-of-type {
-      text-align: left;
+      text-align: inline-start;
     }
     &:last-of-type {
-      text-align: right;
+      text-align: inline-end;
     }
   }
 }
diff --git a/sass/init/_mixins.scss b/sass/init/_mixins.scss
index 3963ff3..7aaa832 100644
--- a/sass/init/_mixins.scss
+++ b/sass/init/_mixins.scss
@@ -104,7 +104,7 @@
   &::after {
     width: 50%;
     height: calc(#{$element-height} / #{$row-count});
-    right: 0;
+    inset-inline-end: 0;
     bottom: 0;
 
     background-image: linear-gradient(
@@ -186,7 +186,7 @@
   }
 
   &::before {
-    float: left;
+    float: inline-start;
     padding-top: var(--aspect-ratio-standard);
   }
 
diff --git a/sass/init/_reset.scss b/sass/init/_reset.scss
index a38c90c..eee3d42 100644
--- a/sass/init/_reset.scss
+++ b/sass/init/_reset.scss
@@ -93,7 +93,7 @@ table {
 
 dd {
   width: 80%;
-  float: left;
+  float: inline-start;
 }
 
 dl {
@@ -104,7 +104,7 @@ dl {
 
 dt {
   width: 20%;
-  float: left;
+  float: inline-start;
 }
 
 img {
diff --git a/sass/navigation/_index.scss b/sass/navigation/_index.scss
index b8b3a4f..9f3bb38 100644
--- a/sass/navigation/_index.scss
+++ b/sass/navigation/_index.scss
@@ -14,18 +14,18 @@ drawer-navigation-helper {
   // This is to make mouse movement forgiving
   width: 0;
   height: 0;
-  top: 3rem;
-  left: -5rem;
+  inset-block-start: 3rem;
+  inset-inline-start: -5rem;
 
-  border-right: 8rem solid transparent;
-  border-bottom: 5rem solid transparent;
-  border-left: 8rem solid transparent;
+  border-inline-end: 8rem solid transparent;
+  border-block-end: 5rem solid transparent;
+  border-inline-start: 8rem solid transparent;
   position: absolute;
 }
 
 drawer-section {
-  padding-right: 1rem;
-  padding-left: 1rem;
+  padding-inline-end: 1rem;
+  padding-inline-start: 1rem;
 
   &:not(:hover):not(.active) {
     drawer-title::after {
@@ -60,8 +60,8 @@ drawer-title {
   &::after {
     width: 100%;
     height: 1px;
-    bottom: -1px;
-    left: 0;
+    inset-block-end: -1px;
+    inset-inline-start: 0;
 
     content: "";
     position: absolute;
@@ -71,20 +71,20 @@ drawer-title {
 
 drawer-wrap {
   width: 100%;
-  top: 5rem;
-  left: 0;
+  inset-block-start: 5rem;
+  inset-inline-start: 0;
 
   background-color: var(--color-white);
-  border-top: 1px solid var(--color-gray-1);
-  padding-top: 2rem;
-  padding-bottom: 2rem;
+  border-block-start: 1px solid var(--color-gray-1);
+  padding-block-start: 2rem;
+  padding-block-end: 2rem;
   position: absolute;
 
   &::after {
     width: 100vw;
     height: calc(100vh - 5rem);
-    top: 5rem;
-    left: 0;
+    inset-block-start: 5rem;
+    inset-inline-start: 0;
 
     background-color: var(--color-black);
     content: "";
@@ -112,7 +112,7 @@ drawer-child {
 
   &:hover {
     border-color: var(--color-gray-1);
-    padding-left: var(--spacing-m);
+    padding-inline-start: var(--spacing-m);
 
     > a {
       color: var(--lbry-primary);
@@ -129,7 +129,7 @@ drawer-child {
 
   span {
     display: flex;
-    padding-top: 0.25rem;
-    padding-bottom: 0.25rem;
+    padding-block-start: 0.25rem;
+    padding-block-end: 0.25rem;
   }
 }
diff --git a/sass/table.scss b/sass/table.scss
index 5774fe3..678f662 100644
--- a/sass/table.scss
+++ b/sass/table.scss
@@ -7,11 +7,11 @@
     overflow: hidden;
 
     &:first-of-type {
-      padding-left: var(--spacing-l);
+      padding-inline-start: var(--spacing-l);
     }
 
     &:last-of-type {
-      padding-right: var(--spacing-l);
+      padding-inline-end: var(--spacing-l);
     }
   }
 
@@ -20,14 +20,14 @@
     position: relative;
 
     th {
-      border-bottom: 1px solid var(--color-border);
+      border-block-end: 1px solid var(--color-border);
     }
   }
 
   tr {
     &:not(:last-of-type) {
       td {
-        border-bottom: 1px solid var(--color-border);
+        border-block-end: 1px solid var(--color-border);
       }
     }
 
@@ -43,7 +43,7 @@
 }
 
 th {
-  text-align: left;
+  text-align: inline-start;
 }
 
 td {
@@ -60,11 +60,11 @@ td {
     padding: 0.5rem;
 
     &:first-of-type {
-      padding-left: 0;
+      padding-inline-start: 0;
     }
 
     &:last-of-type {
-      padding-right: 0;
+      padding-inline-end: 0;
     }
   }
 
@@ -82,5 +82,5 @@ td {
 }
 
 .table__item--align-right {
-  text-align: right;
+  text-align: inline-end;
 }