/*****************************************
Created:  6/24/2020                      *
Modified: 11/18/2020                     *
Author:  Michael Mourtada                *
Ver:     1.5                             *
This file contain almost all the social  *
media icons it requires awesome fonts.   *
******************************************

/* ----------------------------------------------------------------------
Call it:
<i class="social fab fa-facebook-f">
OR
<i class="social-sm fab fa-facebook-f">

add any style to it from bootstrap like rounded-circle rounded shadow
Like this:

<i class="social fab fa-facebook-f shadow">
<i class="social fab fa-facebook-f rounded shadow">
<i class="social fab fa-facebook-f rounded-circle shadow">
------------------------------------------------------------------------*/

.social {
    width:40px;
    height:40px;
    padding: 0.28em;
    margin: 5px;
    font-size:1.5625rem;
    display:inline-block;
    vertical-align:middle;
    text-align:center;
    text-decoration:none;
    color:#aaa;
    background:rgba(177, 175, 175, 0.3);
    transition:all 0.2s;
    -webkit-transition:all 0.2s;
    -moz-transition:all 0.2s;
    -o-transition:all 0.2s;
}

.social-sm {
    width:1.625rem; /* 26px */
    height:1.625rem;
    padding: 0.28em;
    margin: 5px;
    font-size:1.0625rem; /* 17px */
    display:inline-block;
    vertical-align:middle;
    text-align:center;
    text-decoration:none;
    color:#aaa;
    background:rgba(177, 175, 175, 0.3);
    transition:all 0.2s;
    -webkit-transition:all 0.2s;
    -moz-transition:all 0.2s;
    -o-transition:all 0.2s;
}

/* ====== Hover Colors ====== */
.fa-map-marker-alt:hover  {background:#FF0000!important;color:#fff!important;}
.fa-phone:hover           {background:#25D366!important;color:#fff!important;}
.fa-sms:hover             {background:#25D366!important;color:#fff!important;}
.fa-envelope:hover        {background: repeating-linear-gradient(-45deg, #0000ff, #0000ff 5px, #ff0000 5px, #ff0000 10px);color:#fff;}*/
.fa-sms:hover             {background:#25D366!important;color:#fff!important;}
.fa-facebook:hover        {background:#3b5998!important; color:#fff!important;}