$small: 500px; $medium: 800px; button { cursor:pointer; } body { padding: 0; margin: 0; } .buttonSet { background-color: #3d5a80; color: white; font-size:1.7em; border-radius:10px; width: 20%; left: 40%; text-align: center; padding: 0 2%; position:relative; top:2em; @media only screen and (max-width: $medium) { width: 30%; left: 35%; } @media only screen and (max-width: $small) { width: 65%; left: 17%; } } .fa { font-size: 100%; width: 10%; text-decoration: none; margin: 0vw 0.7vw; @media only screen and (max-width: $medium) { margin: 0vw 1.3vw; } @media only screen and (max-width: $small) { margin: 0vw 2vw; } } .fa:hover { opacity: 0.7; } .fa-linkedin { color: #e0fbfc; } .fa-youtube { color: #e0fbfc; } .fa-github { color: #e0fbfc; } .fa-instagram { color: #e0fbfc; } .fa-facebook { color: #e0fbfc; } .fa-envelope { color: #e0fbfc; }