
@media(max-width: 1240px){
    .our-friends__grid{
        grid-template-columns: repeat(2, 1fr);
    }
    .pagination {
        width: 580px;
        height: 1390px;
    }
    .pagination__content {
        left: -620px;
        width: 1820px;
        gap: 40px;
    }
    .our-friends{
        max-height: 1733px;
    }
    .our-friends__title {
        margin: 81px 0 28px;
    }
    @keyframes move-right {
        from {left: -620px;}
        to {left: -1240px;}
    }
    .transition-right {
        animation-name: move-right;
        animation-duration: .5s;
    }
    @keyframes move-left {
        from {left: -620px;}
        to {left: 0px;}
    }
    .transition-left {
        animation-name: move-left;
        animation-duration: .5s;
    }
}
/* Popup */
@media(max-width:1071px){
    .popup {
        width: 630px;
        height: 350px;
    }
    .popup__img {
        width: 350px;
        height: 350px;
    }
    .info {
        padding: 10px 9px 37px 11px;
    }
    .type-breed {
        margin-bottom: 20px;
    }
    .description {
        margin-bottom: 20px;
        font-size: 13px;
    }
}
/* popup */

@media(max-width: 1000px){
    .footer__img {
        min-width: 300px;
    }
}

@media(max-width:990px){
    /* start FOOTER */
    .footer {
        height: 639px;
    }
    .footer__row {
        height: 100%;
        align-items: flex-end;
        flex-wrap: wrap;
        padding: 0 69px 0 63px;
    }
    .footer__img {
        margin: 30px 0 0 171px;
    }
    .contacts {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        max-width: 295px;
        height: 234px;
        margin: 0;
    }
}
@media(max-width:800px){
    .header__row {
        padding: 0 10px;
    }
    .nav {
        margin: 38px 0 78px;
    }
    .footer__row {
        padding: 0 70px 0 63px;
    }
    .footer__container {
        padding: 0px;
    }
    .footer__img {
        align-items: center;
    }
}
@media(max-width:768px){
    .btn-left_end:hover,
    .btn-right_end:hover{
    background: #F6F6F6;
    color: #CDCDCD;
    border: 2px solid #CDCDCD;;
    }
    .btn-left:hover,
    .btn-right:hover{
    background: #F6F6F6;
    }
}
