/* INICIO FOOTER START */

footer {
    width: 100%;
    color: white;

    .row {
        padding-block: 30px;
    }

    #informacoesMapaFooter {
        display: flex;
        gap: 15px;

        margin-block: 60px;

        #informacoesContato {
            display: flex;
            flex-direction: column;
            justify-content: center;
            gap: 25px;

            height: 300px;
            list-style: none;
            
            padding: 0;
            margin: auto;
            margin-bottom: 0;


            li {
                display: flex;
                align-items: center;
                flex-direction: row;
                justify-content: start;
                gap: 15px;

                .caixa-icone {
                    flex-shrink: 0;
                    width: 22px;

                    display: flex;
                    align-items: center;
                    justify-content: center;

                    i {
                        font-size: 1.375rem;
                    }
                }

                div {
                    p {
                        color: #fff;
                        font-weight: 400;
                        font-size: 0.875rem;
                        line-height: 1.25rem;
                    }

                    .tituloTopico {
                        width: 100%;
                        margin-bottom: 0;

                        color: #fff;
                        font-weight: 700;
                        font-size: 1.125rem;
                        line-height: 1.5rem;
                    }
                }
            }

        }

        #mapa {
            width: 100%;
            height: 300px;
            padding-left: 30px;
            padding-right: 0;

            iframe {
                width: 100%;
                height: 100%;
                border-radius: 15px;
            }
        }
    }

    #redesSociais {
        display: flex;
        flex-direction: column;

        h4 {
            padding: 0;
            margin-bottom: 30px;

            color: #fff;
            font-size: 2rem;
            font-weight: 600;
        }

        .container-redes-sociais {
            display: flex;
            justify-content: center;
            gap: 15px;

            .rede-social {
                all: unset;

                display: flex;
                justify-content: space-between;
                align-items: center;

                width: 100%;
                height: 80px;
                max-width: 500px;

                border-radius: 15px;

                transition: transform 300ms;
                box-shadow: 0px 0px 7px 2px #0000004f;
                background-color: #fff;

                cursor: pointer;

                &#redeInstagram {
                    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
                }

                &#redeFacebook {
                    background: linear-gradient(45deg, #4092FB 0%, #1773EA 30%, #1773EA 70%, #0b56b8 100%);
                }

                &#redeYoutube {
                    background: linear-gradient(45deg, #cc0000 0%, #FF0000 50%, #CC0029 100%);
                }

                &:hover {
                    transform: scale(1.05);
                }

                &:active {
                    transform: scale(0.95);
                }

                p {
                    margin-bottom: 0px;

                    color: #fff;
                    font-weight: 600;
                    line-height: 1.125;
                    font-size: 0.875rem;
                }

                span {
                    font-weight: 400;
                }

                .caixa-icone {
                    text-align: center;

                    i {
                        font-size: 2rem;
                    }
                }
            }
        }

    }

    #creditosLinks {
        p {
            color: #fff;
            text-align: center;
            font-size: 1.25rem;
            font-weight: 500;

            a {
                color: #4286f4;
                font-weight: 600;
            }
        }
    }
}

@media(max-width: 768px) {

    footer {
        #informacoesMapaFooter {
            flex-wrap: wrap;

            #informacoesContato {
                display: flex;
                justify-content: center;

                height: unset;
                max-height: 300px;

                ul {
                    width: 80%;
                    gap: 15px;
                    margin-bottom: 30px;

                    li {
                        gap: 10px;

                        .caixa-icone {
                            width: 18px;

                            i {
                                font-size: 1.125rem;
                            }
                        }

                        div {
                            p {
                                font-size: 0.75rem;
                                margin-bottom: 5px;
                            }

                            .tituloTopico {
                                font-size: 1rem;
                            }
                        }
                    }
                }
            }

            #mapa {
                padding: 0;
                display: flex;
                align-items: center;
                justify-content: center;

                iframe {
                    width: 80%;
                }
            }
        }

        #redesSociais {
            h4 {
                width: 80%;
                text-align: center;
                font-size: 1.5rem;
                margin: 0 auto;
                margin-bottom: 30px;
            }
            .container-redes-sociais {
                flex-wrap: wrap;
            }
        }

        #creditosLinks {
            display: flex;
            align-items: center;
            justify-content: center;

            p {
                width: 80%;
                font-size: 1rem;
            }
        }
    }
}

@media(max-width: 465px) {
    footer {

        #redesSociais {
            h4 {
                font-size: 1.25rem;
                width: 95%;
                margin: 0;
                margin-bottom: 15px;
            }

            .rede-social a {
                p {
                    line-height: 1;
                    font-size: 0.75rem;
                }

                span {
                    font-size: 0.75rem;
                }

                .caixa-icone i {
                    font-size: 1.75rem;
                }
            }
        }

        #creditosLinks p {
            width: 95%;
            font-size: 0.875rem;
        }
    }
}

/* FIM FOOTER END */