﻿@keyframes spin {
    0 {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

@keyframes rotateImageLoading {
    from {
        transform: translate(-50%,-50%) rotateY(0) scale(1.01)
    }

    to {
        transform: translate(-50%,-50%) rotateY(360deg) scale(1.01)
    }
}

@keyframes shine-skeleton-lines {
    0 {
        background-position: -100px
    }

    40%,100% {
        background-position: 600px
    }
}

.cuprafooter {
    position: relative
}

    .cuprafooter .prefooter {
        padding: 24px 16px 0;
        background: linear-gradient(to bottom,#ededed 0,#ededed 50%,#f5f5f5 50%,#f5f5f5 100%)
    }

        .cuprafooter .prefooter .box-prefooter {
            text-align: center;
            padding: 56px 16px;
            background-color: #f5f5f5;
            max-width: 488px;
            width: 100%;
            margin: 0 auto
        }

            .cuprafooter .prefooter .box-prefooter > p {
                margin-bottom: 24px;
                font-family: 'CupraLight',sans-serif;
                font-size: 24px;
                line-height: 34px;
                color: var(--color-font-01)
            }

            .cuprafooter .prefooter .box-prefooter .cta {
                transition: all .3s ease;
                font-family: 'CupraMedium',sans-serif;
                font-size: 16px;
                line-height: 29px;
                color: var(--color-font-01);
                position: relative;
                padding-left: 32px;
                padding-right: 8px
            }

                .cuprafooter .prefooter .box-prefooter .cta:before {
                    transition: all .3s ease;
                    content: '';
                    position: absolute;
                    background-color: var(--color-ui-01);
                    width: 24px;
                    height: 1px;
                    bottom: 4px;
                    left: 0
                }

                .cuprafooter .prefooter .box-prefooter .cta:hover {
                    padding-left: 40px;
                    padding-right: 0;
                    opacity: .6
                }

                    .cuprafooter .prefooter .box-prefooter .cta:hover:before {
                        opacity: .6;
                        width: 32px
                    }

    .cuprafooter .global-footer {
        background-color: #f5f5f5;
        border-top: 1px solid #dbdbdb;
        padding: 32px 16px
    }

        .cuprafooter .global-footer .container-footer {
            display: flex;
            flex-direction: column;
            gap: 32px;
            align-items: center;
            margin: 0 auto
        }

        .cuprafooter .global-footer .footer-buttons {
            display: flex;
            gap: 16px;
            align-items: center
        }

            .cuprafooter .global-footer .footer-buttons > a {
                transition: all .3s ease;
                display: flex;
                opacity: .7
            }

                .cuprafooter .global-footer .footer-buttons > a:hover {
                    opacity: 1
                }

            .cuprafooter .global-footer .footer-buttons .footer-img {
                width: 24px;
                height: 24px
            }

        .cuprafooter .global-footer .footer-legal {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 16px
        }

            .cuprafooter .global-footer .footer-legal > a {
                font-family: 'CupraBook',sans-serif;
                font-size: 14px;
                line-height: 16px;
                color: var(--color-font-02)
            }

        .cuprafooter .global-footer .footer-copyright {
            font-family: 'CupraBook',sans-serif;
            font-size: 14px;
            line-height: 16px;
            color: var(--color-font-02)
        }

@media(min-width:764px) {
    .cuprafooter .prefooter {
        padding: 48px 16px 0
    }

        .cuprafooter .prefooter .box-prefooter {
            padding: 48px 32px 40px
        }

            .cuprafooter .prefooter .box-prefooter > p {
                font-size: 30px;
                line-height: 40px
            }

    .cuprafooter .global-footer {
        padding: 32px
    }

        .cuprafooter .global-footer .container-footer {
            gap: 24px;
            max-width: 560px
        }

        .cuprafooter .global-footer .footer-legal {
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: center;
            gap: 16px;
            position: relative
        }

            .cuprafooter .global-footer .footer-legal > a {
                flex: 0 0 auto;
                text-align: center;
                border-right: 1px solid var(--color-ui-03);
                padding-right: 16px
            }

                .cuprafooter .global-footer .footer-legal > a:last-child {
                    border-right: 0;
                    padding-right: 0
                }
}

@media(min-width:1016px) {
    .cuprafooter .prefooter {
        padding: 64px 16px 0
    }

        .cuprafooter .prefooter .box-prefooter {
            padding: 56px 16px;
            max-width: 664px
        }

            .cuprafooter .prefooter .box-prefooter > p {
                font-size: 30px;
                line-height: 38px
            }

    .cuprafooter .global-footer {
        padding: 50px 16px 36px
    }

        .cuprafooter .global-footer .container-footer {
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: center;
            gap: 32px;
            max-width: none
        }

        .cuprafooter .global-footer .footer-buttons {
            flex: 1 1 100%;
            justify-content: center
        }

        .cuprafooter .global-footer .footer-legal > a {
            flex: none
        }
}

@media(min-width:1436px) {
    .cuprafooter .prefooter .box-prefooter {
        padding: 32px 124px 48px;
        max-width: 672px
    }

        .cuprafooter .prefooter .box-prefooter > p {
            font-size: 30px;
            line-height: 38px
        }

    .cuprafooter .global-footer {
        padding: 48px 32px
    }

        .cuprafooter .global-footer .container-footer {
            max-width: 1436px;
            flex-direction: row;
            justify-content: space-between
        }

        .cuprafooter .global-footer .footer-legal {
            margin-top: 0
        }

        .cuprafooter .global-footer .footer-copyright {
            margin-top: 0
        }

        .cuprafooter .global-footer .footer-buttons {
            flex: 0 1 auto;
            justify-content: center
        }
}
