From 2efe0116b5090025c237eeffac161e0ca581e1b0 Mon Sep 17 00:00:00 2001
From: Takachou <5617641+takachou@users.noreply.github.com>
Date: Sun, 11 Nov 2018 06:19:53 +0400
Subject: [PATCH] Added new transition duration (#21427)

Added new transition

Added transition duration to the code and indention to the code.
---
 guide/english/css/css-buttons/index.md | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/guide/english/css/css-buttons/index.md b/guide/english/css/css-buttons/index.md
index f9614d9c25..929714738a 100644
--- a/guide/english/css/css-buttons/index.md
+++ b/guide/english/css/css-buttons/index.md
@@ -92,7 +92,18 @@ button:hover {
 
 ![Hoverable Buttons](https://image.ibb.co/hxQnfm/button_hover.png "Hoverable Buttons")
 
-To determine the speed of the hover effect use the property `transition-duration`.
+To determine the speed of the hover effect, use the property `transition-duration`.
+```
+ button {
+  background-color: #f4511e;
+  transition-duration: 0.4s;
+}
+
+ button:hover {
+  background-color: #0E2C5B;
+  color: #FFF;
+}
+```
 
 ### Disabled Buttons
 
@@ -121,10 +132,11 @@ To animate a button on click use 'button:active':
   background-color: #ff7d1a;
   border: none;
   border-radius: 15px;
+  transition-duration: 0.4s;
 }
 
 .button:hover {
-	background-color: #ff6d00;
+  background-color: #ff6d00;
 }
 
 .button:active {