@import url('https://fonts.googleapis.com/css?family=Open+Sans');

a {
  text-decoration: none;
}

/* Container for layout */
.wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 10px;
}

/* Icon container */
.bg-ico {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #f1f1f1;
  width: 55px;
  height: 55px;
  line-height: 32px;
  margin: 0 4px;
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: 0 5px 15px -5px rgba(0,0,0,0.1);
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}
.bg-ico:hover {
  box-shadow: 0 5px 15px -5px rgba(0,0,0,0.8);
}

/* Font Awesome icon style */
.fab {
  font-size: 20px; /* small icon */
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
  transition: all 0.35s cubic-bezier(0.31, -0.105, 0.43, 1.59);
}
.fab:hover {
  text-shadow: 0px 5px 5px rgba(0, 0, 0, 0.3);
}
.bg-ico:hover .fab {
  transform: scale(2.5);
  transition: transform 0.3s ease;
}

/* Brand colors */
#facebook .fab { color: #4267B2; }
#twitter .fab { color: #1DA1F2; }
#youtube .fab { color: #c4302b; }
#pinterest .fab { color: #c8232c; }
#tumblr .fab { color: #34526f; }
#whatsapp .fab { color: #25D366; }
#linkedin .fab {
    color: #0077b5;
  }
  
  .linkedin:hover {
    color: #fff;
  }
/* Instagram rainbow gradient text */
#instagram .fab {
  color: transparent;
  background: radial-gradient(circle at 30% 107%, 
     #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
  background-clip: text;
  -webkit-background-clip: text;
}