diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
index b352df45..48a0cb1a 100644
--- a/app/assets/stylesheets/application.scss
+++ b/app/assets/stylesheets/application.scss
@@ -362,7 +362,7 @@ svg {
  
  details[open].styled > summary::after {
    transform: rotate(90deg) translatey(-0.1em);
-   color: black
+   color: magenta
  }
 
 
diff --git a/app/views/sites/_designs.haml b/app/views/sites/_designs.haml
index 49362770..538b5bc9 100644
--- a/app/views/sites/_designs.haml
+++ b/app/views/sites/_designs.haml
@@ -44,16 +44,16 @@
           -# image_path("images/logo.png")
           %h1.pb-3.text-center.font-weight-bolder= t('.selector')
           - @designs.each do |design|
-            %details.styled
-              %summary.custom-control-design
+            %details.styled.custom-control-design
+              %summary
                 %h5.font-weight-bolder.pt-2 - #{design.name}  
                 .pb-2 #{design.description}
               .col
-                %h1.text-center.font-weight-bolder.pb-3= t('.preview')
+                %h5.text-center.font-weight-bolder.pb-3= t('.preview')
                 .embed-responsive.embed-responsive-1by1
                   %iframe.embed-responsive-item{allowfullscreen: "", src: "/placeholder.png"}
               .col
-                %h1.text-center.font-weight-bolder.pb-3= t('.characteristics')
+                %h5.text-center.font-weight-bolder.pb-3= t('.characteristics')
                 - characteris = design.characteristics.split(".")
                 - characteris.each_with_index do |charact, index|
                   %h5.design #{index + 1}. #{charact}