* { margin: 0; padding: 0; font-family: 'Raleway', serif; } body { padding: 1%; color: #2E3E50; background: #D8DDDD; text-align: center; letter-spacing: 1px; } .main { margin: auto; padding: 1% 2%; max-width: 800px; border-radius: 5px; background: #ECF0F1; box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .3); } form { width: 100%; display: flex; margin: 2% 0; } form p { text-align: left; padding: 1%; font-size: 18px; } input { padding: 1%; border-radius: 4px; border: 1px solid #CCC; font-size: 18px; } input[type=text] { flex-grow: 1; margin: 0 .5%; } input[type=submit] { cursor: pointer; } input[type=submit]:hover { background-color: #D8DDDD; } h1 { font-family: 'Baloo Tamma', cursive; } li{ list-style-type: none; font-size: 18px; min-width: 24%; margin: 2% 0; box-shadow: 0 2px 4px rgba(0, 0, 0, .2); padding: 1% 2%; background: #FFF; box-sizing: border-box; } li:hover { box-shadow:0 5px 10px rgba(0, 0, 0, .15); }