.social-popup {

}

.social-popup .modal-content {
    border-radius: 0;
}

.social-popup .modal-body {
    padding: 25px 10px;
    position: relative;
}

.social-popup__close-btn-wrapper {
    position: absolute;
    right: 20px;
    top: 20px;
}

.social-popup__close-btn {
    background: url("/img/icons/buttons/cross-symbol.svg") no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    width: 25px;
    height: 25px;
    display: block;
}

.social-popup__header {
    width: 75%;
    margin: 0 auto;
    font-size: 26px;
    font-family: "Roboto Light";
}

.social-popup__header img {
    width: 70%;
    height: auto;
}

.social-popup__socials {
    width: 270px;
    margin: 0 auto;
    padding: 20px 0 40px 0;
}

.social-popup__social-item {
    display: block;
    float: left;
    width: 70px;
    height: 70px;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-size: cover;

    margin: 10px;
}

.social-popup__social-item.social-popup__social-item--fb {
    background-image: url("/img/icons/socials/facebook.svg");
}

.social-popup__social-item.social-popup__social-item--twitter {
    background-image: url("/img/icons/socials/twitter.svg");
}

.social-popup__social-item.social-popup__social-item--vk {
    background-image: url("/img/icons/socials/vk.svg");
}

.social-popup__social-item.social-popup__social-item--tg {
    background-image: url("/img/icons/socials/telegram.svg");
}

@media (max-width: 390px) {

    .social-popup__close-btn-wrapper {
        position: absolute;
        right: 2%;
        top: 2%;
    }

    .social-popup .modal-body {
        padding: 15px 5%;
    }
    .social-popup__header {
        width: 90%;
        font-size: 20px;
    }

    .social-popup__header img {
        width: 90%;
    }

    .social-popup__socials {
        width: 210px;
    }

    .social-popup__social-item {
        width: 50px;
        height: 50px;
    }
}