.social_icon .fa {
    width: 25px;
}

.social_icon .ar, .social_icon .en {
    width: 40px;
}

.social_icon .fa, .social_icon .ar, .social_icon .en {
    filter: grayscale(100%);
    transition: filter 0.4s ease-in-out;
}

    .social_icon .fa:hover, .social_icon .ar:hover, .social_icon .en:hover {
        filter: grayscale(0%);
    }
/* flaoting div ............ */

@media (max-width:800px) {
    .floatingLangs {
        display: none;
    }
}

.floatingLangs {
    line-height: 2rem;
    font-size: 14px;
    position: fixed;
    top: 15px;
    right: 15px;
    background-color: #dcdcdc;
    padding: 10px;
    border-radius: 5px;
    opacity: .5;
    box-shadow: rgba(0, 0, 0, 0.9) 5px 5px 50px 5px;
}

    .floatingLangs .closer {
        font-size: 20px;
    }

        .floatingLangs .closer:hover {
            cursor: pointer;
        }

    .floatingLangs:hover {
        opacity: 1;
    }

    .floatingLangs .fa, .floatingLangs .ar {
        border-bottom: 1px solid #ccc;
    }

    .floatingLangs .fa {
        padding-bottom: 10px;
    }

    .floatingLangs .ar {
    }

    .floatingLangs .fa {
        font-family: 'Vazir';
    }

    .floatingLangs .en {
        direction: ltr;
    }

.floatingLangsIcons img {
    background: black;
    border-radius: 50%;
}

    .floatingLangsIcons img:hover {
        background: white;
        box-shadow: rgba(0, 0, 0, 0.4) 5px 5px 50px 5px;
    }

.floatingLangsIcons .fa {
    width: 60px;
    height: 60px;
}

.floatingLangsIcons .ar, .floatingLangsIcons .en {
    width: 60px;
    height: 60px;
}

.social_icon .fa, .social_icon .en, .social_icon .ar, .floatingLangs {
    /*display: none;*/
}