/*Social icons*/
.social {
    display: flex;
    gap: 13px;
    align-items: center;
}

.social__item {
    width: 34px;
    height: 34px;
    padding: 0;
}

.social__link {
    display: block;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    -webkit-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}

.social__link:hover, .social__link:focus, .social__link:active {    
    -webkit-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}

.social__link.phone {
    background-image: url('../img/phone.svg');
}

.social__link.telegram {
    background-image: url('../img/Telegram.svg');    
}

.social__link.mail {
    background-image: url('../img/mail.svg');  
}

.white .social__link.phone {
    background-image: url('../img/phone-white.svg');
}

.white .social__link.telegram {
    background-image: url('../img/Telegram-white.svg');    
}

.white .social__link.mail {
    background-image: url('../img/mail-white.svg');  
}

.social__link.phone:hover, .social__link.phone:focus, .social__link.phone:active {
    background-image: url('../img/phone-hover.svg');
}

.social__link.telegram:hover, .social__link.telegram:focus, .social__link.telegram:active {
    background-image: url('../img/Telegram-hover.svg');  
}

.social__link.mail:hover, .social__link.mail:focus, .social__link.mail:active {
    background-image: url('../img/mail-hover.svg');  
}

.white .social__link.phone:hover, .white .social__link.phone:focus, .white .social__link.phone:active {
    background-image: url('../img/phone-white-hover.svg');
}

.white .social__link.telegram:hover, .white .social__link.telegram:focus, .white .social__link.telegram:active {
    background-image: url('../img/Telegram-white-hover.svg');  
}

.white .social__link.mail:hover, .white .social__link.mail:focus, .white .social__link.mail:active {
    background-image: url('../img/mail-white-hover.svg');  
}


@media (min-width:1921px) {
    .social {
        gap: 0.5vw;
    }

    .social__item {
        width: 1.5vw;
        height: 1.5vw;
    }
}

@media (max-width:1199px) {
    .social {
        gap: 10px;
    }

    .social__item {
        width: 28px;
        height: 28px;
    }
}

@media (max-width:767px) {
    .social {
        grid-template-columns: repeat(4, 30px);
    }

    .social__item {
        height: 30px;
    }
}