html {
  box-sizing:border-box;
  scroll-behavior:smooth;
}

body {
  background-color:#5e6ca4;
  color:#fff;
  box-shadow:inset 0 0 15rem rgba(0,0,0,0.5);
  font-size:1rem;
  font-family:'Montserrat', 'Arial', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
  font-family:'Ubuntu', 'Arial', sans-serif;
  letter-spacing:.05em;
}

a {
  color:#fff;
  text-decoration:underline;
}

a:hover, a:focus {
  color:#fff;
  text-decoration:none;
}

img {
  max-width:100%;
}

.container {
  min-height:100vh;
  padding:2rem;
  display:flex;
  flex-direction:row;
  justify-content:center;
  align-items:center;
}

.card {
  background:none;
  border:none;
  text-align:center;
}

.icon {
  width:200px;
  height:200px;
  margin:0 auto 1rem;
  border:.5rem solid rgba(0,0,0,0.3);
  border-radius:50%;
}

.btn {
  width:50px;
  height:50px;
  text-decoration:none;
  border-radius:50%;
  display:inline-flex;
  justify-content:center;
  align-items:center;
}

.btn-outline-primary {
  border:none;
  color:#fff;
}

.btn-outline-primary:hover, .btn-outline-primary:focus {
  background-color:#fff;
  color:#5e6ca4;
}

.btn-primary {
  display:inline-block;
  text-decoration:none;
  background-color:rgba(255,255,255,0.5);
  color:rgba(0,0,0,0.8);
}

.btn-primary:hover, .btn-primary:focus {
  background:rgba(255,255,255,1);
  color:rgba(0,0,0,0.8);
}