@import url('//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css');

#social{
  text-align: center;
  
}

.smGlobalBtn{
  font-size: 25px;
  display: inline-block;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  line-height: 48px;
  color: #fff;
  text-decoration: none !important;
  filter: grayscale(75%);
  margin: 7px 3px;
}

.smGlobalBtn:hover{
  filter: grayscale(0%);
}



/* facebook button class*/
.facebookBtn{
    background-color: #4060A5;
}

.facebookBtn:before{ /* use :before to add the relevant icons */
    font-family: "FontAwesome";
    content: "\f09a"; /* add facebook icon */
}

.facebookBtn:hover{
    color: #4060A5;
    background: #fff;
}

/* twitter button class*/
.twitterBtn{
    background: #00ABE3;
}

.twitterBtn:before{
      font-family: "FontAwesome";
      content: "\f099"; /* add twitter icon */
}

.twitterBtn:hover{
      color: #00ABE3;
      background: #fff;
}

/* youtube button class*/
.youtubeBtn{
    background: rgb(255, 0, 23);
}

.youtubeBtn:before{
      font-family: "FontAwesome";
      content: "\f16a"; /* add twitter icon */
}

.youtubeBtn:hover{
      color: rgb(255, 0, 23);
      background: #fff;
}

/* instagram button class*/
.instaBtn{
   background: #d6249f;
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);;
}

.instaBtn:before{
      font-family: "FontAwesome";
      content: "\f16d"; /* add twitter icon */
}

.instaBtn:hover{
      color: black;
      background: #fff;
}