diff --git a/assets/stylesheets/lesson/index.css b/assets/stylesheets/lesson/index.css
index c7701e6..c92fff6 100644
--- a/assets/stylesheets/lesson/index.css
+++ b/assets/stylesheets/lesson/index.css
@@ -1,4 +1,4 @@
-.lesson-module {
+@block lesson-module {
   margin-top: var(--grid-gutter);
 
   & img {
@@ -26,16 +26,17 @@
   @element trigger {
     display: inline-block;
 
+    height: 30px;
     padding: 0 1em;
     margin-right: 1em;
 
     background: var(--code-trigger-bg);
 
-    border-top-left-radius: var(--border-radius);
-    border-top-right-radius: var(--border-radius);
+    border-top: 3px solid transparent;
 
+    line-height: 30px;
     font-family: var(--font-medium);
-    font-size: 0.7em;
+    font-size: 0.875em;
     color: var(--code-trigger-color);
 
     cursor: pointer;
@@ -45,10 +46,15 @@
       margin-right: 0;
     }
 
+    &:hover {
+      color: var(--color-link-content-hover);
+    }
+
     @modifier active {
       background: var(--code-trigger-bg-active);
-      color: var(--code-trigger-color-active);
+      color: var(--code-trigger-color-active) !important;
       cursor: default;
+      border-color: var(--code-trigger-border-active);
     }
   }
 
diff --git a/assets/stylesheets/variables.css b/assets/stylesheets/variables.css
index f92c71a..04d7767 100644
--- a/assets/stylesheets/variables.css
+++ b/assets/stylesheets/variables.css
@@ -65,8 +65,9 @@
   --module-copy-emphasized-cta-color: #fff;
 
   --code-bg: var(--color-bg-grey);
-  --code-trigger-bg: color(var(--color-bg-grey) shade(20%));
+  --code-trigger-bg: #fff;
   --code-trigger-bg-active: var(--code-bg);
-  --code-trigger-color: #fff;
-  --code-trigger-color-active: var(--color-text-dark-bg-grey);
+  --code-trigger-color: var(--color-text-grey);
+  --code-trigger-color-active: var(--color-text-default);
+  --code-trigger-border-active: #c3cfd5;
 }
diff --git a/public/stylesheets/style.css b/public/stylesheets/style.css
index f2b2223..e5abd0c 100644
--- a/public/stylesheets/style.css
+++ b/public/stylesheets/style.css
@@ -2137,7 +2137,7 @@ github.com style (c) Vasily Polovnyov <vast@whiteants.net>
 }
 
 .lesson-module {
-  margin-top: 22px
+  margin-top: 22px;
 }
 
 .lesson-module img {
@@ -2166,17 +2166,18 @@ github.com style (c) Vasily Polovnyov <vast@whiteants.net>
 .lesson-module-code__trigger {
     display: inline-block;
 
+    height: 30px;
     padding: 0 1em;
     margin-right: 1em;
 
-    background: rgb(198, 199, 200);
+    background: #fff;
 
-    border-top-left-radius: 4px;
-    border-top-right-radius: 4px;
+    border-top: 3px solid transparent;
 
+    line-height: 30px;
     font-family: 'robotomedium', Helvetica, sans-serif;
-    font-size: 0.7em;
-    color: #fff;
+    font-size: 0.875em;
+    color: #8091a5;
 
     cursor: pointer;
     -webkit-user-select: none;
@@ -2189,10 +2190,15 @@ github.com style (c) Vasily Polovnyov <vast@whiteants.net>
   margin-right: 0;
 }
 
+.lesson-module-code__trigger:hover {
+  color: #3c80cf;
+}
+
 .lesson-module-code__trigger--active {
       background: #f7f9fa;
-      color: #a9b9c0;
+      color: #536171 !important;
       cursor: default;
+      border-color: #c3cfd5;
 }
 
 .lesson-module-code__code {