<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
.container {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.container:hover .backwards {
margin: 15px;
-moz-transform: scale(1, 1);
-webkit-transform: scale(1, 1);
-o-transform: scale(1, 1);
-ms-transform: scale(1, 1);
transform: scale(1, 1);
}
.space {
padding-left: 50px;
}
.container:hover .space {
padding-right: 50px;
padding-left: 0;
}
.backwards {
display: inline;
font-size: 100px;
font-style: bold;
transition: all .9s;
-moz-transform: scale(-1, -1);
-webkit-transform: scale(-1, -1);
-o-transform: scale(-1, -1);
-ms-transform: scale(-1, -1);
transform: scale(-1, -1);