Skip to content

Latest commit

 

History

History
742 lines (689 loc) · 38.8 KB

index.md

File metadata and controls

742 lines (689 loc) · 38.8 KB
<title>IC²D UTFPR</title> <script src="js/modernizr.js"></script> <script src="js/pace.min.js"></script>
    <nav class="header-nav-wrap">
        <ul class="header-main-nav">
            <li class="current"><a class="smoothscroll" href="#intro">Home</a></li>
            <li><a class="smoothscroll" href="#about">Sobre o Grupo</a></li>
            <li><a class="smoothscroll" href="#services">Projetos</a></li>
            <li><a class="smoothscroll" href="#partners">Parceiros</a></li>
            <li><a class="smoothscroll" href="#contact">Entre em Contato</a></li>
        </ul>

        <ul class="header-social">
            <!-- <li><a href="#0"><i class="fab fa-facebook-f" aria-hidden="true"></i></a></li>
            <li><a href="#0"><i class="fab fa-twitter" aria-hidden="true"></i></a></li> -->
            <li><a href="https://github.com/ic2d" target="_BLANK"><i class="fab fa-github"
                        aria-hidden="true"></i></a></li>

        </ul>
    </nav>
    <a class="header-menu-toggle" href="#"><span>Menu</span></a>
</header>
<section id="intro" class="s-intro target-section">
    <div class="row intro-content">
        <div class="column large-9 mob-full intro-text">
            <h3>Grupo de Estudos e Pesquisa em</h3>
            <h1>
                Inteligência Computacional <br>
                e Ciência de Dados.
            </h1>
        </div>
        <div class="intro-scroll">
            <a href="#about" class="intro-scroll-link smoothscroll">
                Saiba mais
            </a>
        </div>
        <!-- <div class="intro-grid"></div>
        <div class="intro-pic"></div> -->
    </div>
</section>
<section id="about" class="s-about target-section">
    <div class="about-me">
        <div class="row heading-block" data-aos="fade-up">
            <div class="column large-full">
                <h2 class="section-heading">Sobre o Grupo</h2>
            </div>
        </div>
        <div class="row about-me__content" data-aos="fade-up">
            <div class="column large-half about-me__text">
                <p class="lead">
                    Grupo de Estudos e Pesquisa em Inteligência Computacional e Ciência de Dados
                </p>
                <p>
                    A IC²D foi fundada em 2020 por um grupo da professores da <abbr
                        title="Universidade Tecnológica Federal do Paraná">UTFPR</abbr> campus Apucarana
                    com o objetivo de fomentar e desenvolver pesquisas de novas tecnologias, ferramentas e
                    metodologias nas áreas de computação, ciência de
                    dados, inteligência artificial e, sua divulgação para uso profissional ou para leigos.
                </p>
            </div>
            <!--<div class="column large-half about-us__gpimg">
                <img src="https://image.freepik.com/fotos-gratis/conceito-comunidade-com-grupo-pessoas_23-2147993385.jpg"
                    alt="">
            </div> -->
        </div>

        <!-- <div class="row about-me__buttons">
            <div class="column align-x-center large-half tab-full" data-aos="fade-up">
                <a href="#0" class="btn btn--stroke full-width">Contate-nos</a>
            </div>
        </div> -->
    </div> <!-- end about-us -->

    <div class="our_team mb-5">
        <div class="row heading-block" data-aos="fade-up">
            <div class="column large-full">
                <h2 class="section-heading">Nossa Equipe</h2>
            </div>
        </div>
        <div class="container" data-aos="fade-up">
            <h1 class="text-center">Professores</h1>
            <div class="d-flex justify-content-between flex-wrap">
                <div class="d-flex flex-column flex-fill container-professor">
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title">Prof. Dr. Daniel Prado de Campos</h5>
                            <div class="professor-image">
                                <img class="img-fluid"
                                    src="https://ic2d.github.io/images/professors/danielprado.gif">
                            </div>
                            <p class="card-text text-center"><a href="http://lattes.cnpq.br/2260564602839139"
                                    target="_BLANK" style="color: black;"> Currículo Lattes</a></p>
                        </div>
                    </div>
                </div>
                <div class="d-flex flex-column flex-fill container-professor">
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title">Prof. Dr. Fábio Irigon Pereira</h5>
                            <div class="professor-image">
                                <img class="img-fluid"
                                    src="https://ic2d.github.io/images/professors/fabioirigon.gif">
                            </div>
                            <p class="card-text text-center"><a href="http://lattes.cnpq.br/2320975517821477"
                                    target="_BLANK" style="color: black;"> Currículo Lattes</a></p>
                        </div>
                    </div>
                </div>
                <div class="d-flex flex-column flex-fill container-professor">
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title">Prof. Dr. Luiz Fernando Carvalho</h5>
                            <div class="professor-image">
                                <img class="img-fluid"
                                    src="https://ic2d.github.io/images/professors/luizfernando.gif">
                            </div>
                            <p class="card-text text-center"><a href="http://lattes.cnpq.br/0665079937865380"
                                    target="_BLANK" style="color: black;"> Currículo Lattes</a></p>
                        </div>
                    </div>
                </div>
                <div class="d-flex flex-column flex-fill container-professor">
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title">Prof. Dr. Maurício Eiji Nakai</h5>
                            <div class="professor-image">
                                <img class="img-fluid"
                                    src="https://ic2d.github.io/images/professors/mauricioeiji.jpg">
                            </div>
                            <p class="card-text text-center"><a href="http://lattes.cnpq.br/7376345732096655"
                                    target="_BLANK" style="color: black;"> Currículo Lattes</a></p>
                        </div>
                    </div>
                </div>
                <div class="d-flex flex-column flex-fill container-professor">
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title">Prof. Dr. Rafael Gomes Mantovani</h5>
                            <div class="professor-image">
                                <img class="img-fluid"
                                    src="https://ic2d.github.io/images/professors/rafaelgomes.gif">
                            </div>
                            <p class="card-text text-center"><a href="http://lattes.cnpq.br/3753471203485400"
                                    target="_BLANK" style="color: black;"> Currículo Lattes</a></p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

<!--<div class="about-experience mt-5">
        <div class="row heading-block" data-aos="fade-up">
            <div class="column large-full">
                <h2 class="section-heading">Publicações</h2>
            </div>
        </div>

        <div class="row about-experience__timeline">

            <div class="column large-half tab-full" data-aos="fade-up">
                <div class="timeline">
                    <div class="timeline__block">
                        <div class="timeline__bullet"></div>
                        <div class="timeline__header">
                            <p class="timeline__timeframe">December 2019</p>
                            <h3 class="item-title">Awesome Title</h3>
                            <h5>Lead Designer</h5>
                        </div>
                        <div class="timeline__desc">
                            <p>Lorem ipsum Occaecat do esse ex et dolor culpa nisi ex in magna consectetur nisi
                                cupidatat laboris esse eiusmod deserunt aute do quis velit esse sed Ut proident
                                cupidatat nulla esse cillum laborum occaecat nostrud sit dolor incididunt amet est
                                occaecat nisi.</p>
                        </div>
                    </div>

                    <div class="timeline__block">
                        <div class="timeline__bullet"></div>
                        <div class="timeline__header">
                            <p class="timeline__timeframe">July 2017 - June 2018</p>
                            <h3 class="item-title">Super Cool Agency</h3>
                            <h5>Frontend Developer</h5>
                        </div>
                        <div class="timeline__desc">
                            <p>Lorem ipsum Occaecat do esse ex et dolor culpa nisi ex in magna consectetur nisi
                                cupidatat laboris esse eiusmod deserunt aute do quis velit esse sed Ut proident
                                cupidatat nulla esse cillum laborum occaecat nostrud sit dolor incididunt amet est
                                occaecat nisi.</p>
                        </div>
                    </div>

                    <div class="timeline__block">
                        <div class="timeline__bullet"></div>
                        <div class="timeline__header">
                            <p class="timeline__timeframe">March 2016 - June 2017</p>
                            <h3 class="item-title">Epic Design Studio</h3>
                            <h5>Frontend Developer</h5>
                        </div>
                        <div class="timeline__desc">
                            <p>Lorem ipsum Occaecat do esse ex et dolor culpa nisi ex in magna consectetur nisi
                                cupidatat laboris esse eiusmod deserunt aute do quis velit esse sed Ut proident
                                cupidatat nulla esse cillum laborum occaecat nostrud sit dolor incididunt amet est
                                occaecat nisi.</p>
                        </div>
                    </div>

                </div>
            </div>

            <div class="column large-half tab-full" data-aos="fade-up">
                <div class="timeline">
                    <div class="timeline__block">
                        <div class="timeline__bullet"></div>
                        <div class="timeline__header">
                            <p class="timeline__timeframe">July 2011 - June 2015</p>
                            <h3 class="item-title">University of Life</h3>
                            <h5>Master Degree</h5>
                        </div>
                        <div class="timeline__desc">
                            <p>Lorem ipsum Occaecat do esse ex et dolor culpa nisi ex in magna consectetur nisi
                                cupidatat laboris esse eiusmod deserunt aute do quis velit esse sed Ut proident
                                cupidatat nulla esse cillum laborum occaecat nostrud sit dolor incididunt amet est
                                occaecat nisi.</p>
                        </div>
                    </div>

                    <div class="timeline__block">
                        <div class="timeline__bullet"></div>
                        <div class="timeline__header">
                            <p class="timeline__timeframe">July 2009 - June 2011</p>
                            <h3 class="item-title">State Design University</h3>
                            <h5>Bachelor Degree</h5>
                        </div>
                        <div class="timeline__desc">
                            <p>Lorem ipsum Occaecat do esse ex et dolor culpa nisi ex in magna consectetur nisi
                                cupidatat laboris esse eiusmod deserunt aute do quis velit esse sed Ut proident
                                cupidatat nulla esse cillum laborum occaecat nostrud sit dolor incididunt amet est
                                occaecat nisi.</p>
                        </div>
                    </div>

                    <div class="timeline__block">
                        <div class="timeline__bullet"></div>
                        <div class="timeline__header">
                            <p class="timeline__timeframe">July 2005 - June 2009</p>
                            <h3 class="item-title">School of Hard Knocks</h3>
                            <h5>Bachelor Degree</h5>
                        </div>
                        <div class="timeline__desc">
                            <p>Lorem ipsum Occaecat do esse ex et dolor culpa nisi ex in magna consectetur nisi
                                cupidatat laboris esse eiusmod deserunt aute do quis velit esse sed Ut proident
                                cupidatat nulla esse cillum laborum occaecat nostrud sit dolor incididunt amet est
                                occaecat nisi.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div> --><!-- end papers -->

</section> <!-- end s-about -->


<!-- services
================================================== -->
<section id="services" class="s-services ss-dark target-section">

    <div class="shadow-overlay"></div>
    <div class="row heading-block heading-block--center" data-aos="fade-up">
        <div class="column large-full">
            <h2 class="section-heading section-heading--centerbottom">Nossos Projetos</h2>

            <p class="section-desc">
                Saiba mais sobre os projetos em desenvolvimento
            </p>
        </div>
    </div> <!-- end heading-block -->
    <div class="row services-list block-large-1-3 block-medium-1-2 block-tab-full">
        <div class="column item-service" data-aos="fade-up">
            <div class="item-service__content">
                <h4 class="item-title">Inteligência Computacional na solução de Problemas das Engenharias e
                    Agronomia<br>
                    <span>Todos os professores do grupo</span>
                </h4>
                <p>
                    O Projeto tem como objetivo o desenvolvimento de soluções e aplicações voltadas ao
                    desenvolvimento regional e agronegócio. Isso inclui, mas não se limita, aos temas de <i>Machine
                        Learning</i>, Reconhecimento de Padrões, Otimização, Reconstrução, Mineração de dados,
                    Modelagem e Simulação, Teoria de Controle, Problemas Inversos, Meta-Aprendizado, Processamento
                    de imagens e sinais. Criando soluções que sejam capazes de dar suporte tanto à especialistas
                    quanto a leigos em seus diversos contextos
                </p>
            </div>
        </div>
        <div class="column item-service" data-aos="fade-up">
            <div class="item-service__content">
                <h4 class="item-title">Processamento de Sinais Biomédicos<br>
                    <span>Prof. Dr. Daniel Prado de Campos</span></h4>
                <p>
                    O Projeto tem como objetivo extrair informações de sinais biomédicos e identificar padrões de
                    forma automática, estudo, desenvolvimento e aplicação de métodos dentro do contexto de
                    processamento digital de dados. Algumas linhas temáticas presentes são: Interfaces de Controle
                    para Tecnologias Assistivas, Processamento de Sinais de Eletromiografia de Superficie (sEMG),
                    Modelagem de Parâmetros Fisiológicos e Cinseiológicos, Diagnóstico Clínico Automático a partir
                    de Biossinais e Imagens Médicas.
                </p>
            </div>
        </div>
        <div class="column item-service" data-aos="fade-up">
            <div class="item-service__content">
                <h4 class="item-title">Aprendizado de Máquina Automatizado: aprendendo a aprender<br>
                    <span>Prof. Dr. Rafael Gomes Mantovani</span>
                </h4>
                <p>
                    O Projeto tem como objetivo a pesquisa e o desenvolvimento de sistemas de Aprendizado de Máquina
                    Automático (AutoML) em três ambitos: Pré-Processamento de dados, Recomendação de Algoritmos,
                    Hiper-parâmetros e modelos e, Pós-processamento. Espera-se que os sistemas desenvolvidos possam
                    ser capazes de ajudar tanto usuários especialistas como leigos nos passos necessários para a
                    análise de dados, evitando que tenham um gasto elevado com ajustes manuais, promovendo um maior
                    foco na análise do problema.
                </p>
            </div>
        </div>
    </div>
    <div class="row services-list block-large-1-2 block-medium-1-2 block-tab-full">
        <div class="column item-service" data-aos="fade-up">
            <div class="item-service__content">
                <h4 class="item-title">Estudo de modelagem dinâmica, sistemas embarcados, implementação de hardware
                    e sistemas de controle aplicado à sistemas robóticos<br>
                    <span>Prof. Dr. Maurício Eiji Nakai</span></h4>
                <p>
                    O projeto tem como objetivo a pesquisa e implementações de robótica móvel (robôs aéreos e
                    terrestres) através de quatro tópicos: Modelagem de sistemas robóticos, Programação de Firmware,
                    Implementação de hardware, Algoritmos de controle. Visando realizar a integração da robótica no
                    dia-a-dia da universidade e a comunidade em que a UTFPR se encontra.
                </p>
            </div>
        </div>
        <div class="column item-service" data-aos="fade-up">
            <div class="item-service__content">
                <h4 class="item-title">Análise de Dados Voltada à Detecção de Eventos Anômalos e Ataques em Redes de
                    Comunicação<br><span class="align-x-end">Prof. Dr. Luiz Fernando Carvalho</span></h4>
                <p>
                    O Projeto tem como objetivo estudar e propor soluções pautadas na <i>Inteligência Artificial</i>
                    para analisar profudamente o tráfego de rede. Assim, pretende-se que as ferramentas
                    desenvolvidas identifiquem de maneira autônoma anomalias tais como: Falha de equipamentos ou
                    aplicações, congestionamentos e ataques maliciosos, de modo a assegurar a resiliência dos
                    serviços prestados pela rede e eliminar os erros gerados pela análise desempenhada manualmente
                    pelos gestores de rede.
                </p>
            </div>
        </div>
    </div>
</section>

<section id="partners" class="s-partners target-section">
    <div class="row heading-block" data-aos="fade-up">
        <div class="column large-full">
            <h2 class="section-heading">Parceiros</h2>
        </div>
    </div>
    <div class="d-flex row justify-content-center" data-aos="fade-up">
        <div class="d-flex flex-column justify-content-center partner-row">
            <a href="http://www.iapar.br" target="_BLANK"><img src="./images/partners/iapar_400x400.jpg" alt=""></a>
        </div>
    </div>
</section>

<!-- works
================================================== -->
<!-- <section id="works" class="s-works target-section">
    <div class="row heading-block heading-block--center" data-aos="fade-up">
        <div class="column large-full">
            <h2 class="section-heading section-heading--centerbottom">Eventos</h2>
            <p class="section-desc">
                Confira alguns dos eventos aos quais o grupo IC²D esteve presente
            </p>
        </div>
    </div> 

    <div class="masonry-wrap">

        <div class="masonry">
            <div class="grid-sizer"></div>

            <div class="masonry__brick" data-aos="fade-up">
                <div class="item-folio">
                    <div class="item-folio__thumb">
                        <a href="images/portfolio/gallery/g-city-building.jpg" class="thumb-link" title="Shutterbug"
                            data-size="1050x700">
                            <img src="images/portfolio/city-building.jpg"
                                srcset="images/portfolio/city-building.jpg 1x, images/portfolio/city-building@2x.jpg 2x"
                                alt="">
                        </a>
                        <a href="https://www.behance.net/" class="item-folio__project-link" title="Project link"
                            target="_blank"></a>
                    </div>

                    <div class="item-folio__text">
                        <h4 class="item-folio__title">
                            City Building
                        </h4>
                        <p class="item-folio__cat">
                            Branding
                        </p>
                    </div>

                    <div class="item-folio__caption">
                        <p>Vero molestiae sed aut natus excepturi. Et tempora numquam. Temporibus iusto quo.Unde
                            dolorem corrupti neque nisi.</p>
                    </div>
                </div>
            </div>

            <div class="masonry__brick" data-aos="fade-up">
                <div class="item-folio">
                    <div class="item-folio__thumb">
                        <a href="images/portfolio/gallery/g-woodcraft.jpg" class="thumb-link" title="Woodcraft"
                            data-size="1050x700">
                            <img src="images/portfolio/woodcraft.jpg"
                                srcset="images/portfolio/woodcraft.jpg 1x, images/portfolio/woodcraft@2x.jpg 2x"
                                alt="">
                        </a>
                        <a href="https://www.behance.net/" class="item-folio__project-link" title="Project link"
                            target="_blank"></a>
                    </div>
                    <div class="item-folio__text">
                        <h4 class="item-folio__title">
                            Woodcraft
                        </h4>
                        <p class="item-folio__cat">
                            Web Design
                        </p>
                    </div>
                    <div class="item-folio__caption">
                        <p>Vero molestiae sed aut natus excepturi. Et tempora numquam. Temporibus iusto quo.Unde
                            dolorem corrupti neque nisi.</p>
                    </div>
                </div>
            </div>

            <div class="masonry__brick" data-aos="fade-up">
                <div class="item-folio">

                    <div class="item-folio__thumb">
                        <a href="images/portfolio/gallery/g-beetle.jpg" class="thumb-link" title="The Beetle Car"
                            data-size="1050x700">
                            <img src="images/portfolio/the-beetle.jpg"
                                srcset="images/portfolio/the-beetle.jpg 1x, images/portfolio/the-beetle@2x.jpg 2x"
                                alt="">
                        </a>
                        <a href="https://www.behance.net/" class="item-folio__project-link" title="Project link"
                            target="_blank"></a>
                    </div>
                    <div class="item-folio__text">
                        <h4 class="item-folio__title">
                            The Beetle
                        </h4>
                        <p class="item-folio__cat">
                            Web Development
                        </p>
                    </div>
                    <div class="item-folio__caption">
                        <p>Vero molestiae sed aut natus excepturi. Et tempora numquam. Temporibus iusto quo.Unde
                            dolorem corrupti neque nisi.</p>
                    </div>
                </div>
            </div> 

            <div class="masonry__brick" data-aos="fade-up">
                <div class="item-folio">
                    <div class="item-folio__thumb">
                        <a href="images/portfolio/gallery/g-shutterbug.jpg" class="thumb-link" title="Grow Green"
                            data-size="1050x700">
                            <img src="images/portfolio/shutterbug.jpg"
                                srcset="images/portfolio/shutterbug.jpg 1x, images/portfolio/shutterbug@2x.jpg 2x"
                                alt="">
                        </a>
                        <a href="https://www.behance.net/" class="item-folio__project-link" title="Project link"
                            target="_blank"></a>
                    </div>
                    <div class="item-folio__text">
                        <h4 class="item-folio__title">
                            Shutterbug
                        </h4>
                        <p class="item-folio__cat">
                            Branding
                        </p>
                    </div>
                    <div class="item-folio__caption">
                        <p>Vero molestiae sed aut natus excepturi. Et tempora numquam. Temporibus iusto quo.Unde
                            dolorem corrupti neque nisi.</p>
                    </div>
                </div>
            </div>

            <div class="masonry__brick" data-aos="fade-up">
                <div class="item-folio">
                    <div class="item-folio__thumb">
                        <a href="images/portfolio/gallery/g-lamp.jpg" class="thumb-link" title="Guitarist"
                            data-size="1050x700">
                            <img src="images/portfolio/lamp.jpg"
                                srcset="images/portfolio/lamp.jpg 1x, images/portfolio/lamp@2x.jpg 2x" alt="">
                        </a>
                        <a href="https://www.behance.net/" class="item-folio__project-link" title="Project link"
                            target="_blank"></a>
                    </div>
                    <div class="item-folio__text">
                        <h4 class="item-folio__title">
                            Lamp
                        </h4>
                        <p class="item-folio__cat">
                            Web Design
                        </p>
                    </div>
                    <div class="item-folio__caption">
                        <p>Vero molestiae sed aut natus excepturi. Et tempora numquam. Temporibus iusto quo.Unde
                            dolorem corrupti neque nisi.</p>
                    </div>
                </div>
            </div>

            <div class="masonry__brick" data-aos="fade-up">
                <div class="item-folio">

                    <div class="item-folio__thumb">
                        <a href="images/portfolio/gallery/g-fuji.jpg" class="thumb-link" title="Palmeira"
                            data-size="1050x700">
                            <img src="images/portfolio/fuji.jpg"
                                srcset="images/portfolio/fuji.jpg 1x, images/portfolio/fuji@2x.jpg 2x" alt="">
                        </a>
                        <a href="https://www.behance.net/" class="item-folio__project-link" title="Project link"
                            target="_blank"></a>
                    </div>
                    <div class="item-folio__text">
                        <h4 class="item-folio__title">
                            Fuji
                        </h4>
                        <p class="item-folio__cat">
                            Web Design
                        </p>
                    </div>
                    <div class="item-folio__caption">
                        <p>Vero molestiae sed aut natus excepturi. Et tempora numquam. Temporibus iusto quo.Unde
                            dolorem corrupti neque nisi.</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>  -->



<!-- contact
================================================== -->
<section id="contact" class="s-contact ss-dark target-section">

    <div class="row heading-block" data-aos="fade-up">
        <div class="column large-full">
            <h2 class="section-heading">Entre em contato conosco</h2>
        </div>
    </div>

    <div class="row contact-main" data-aos="fade-up">
        <div class="column large-full">
            <div class="section-desc">
                <p id="contact-p">Envie-nos uma menssagem que entraremos em contato!</p>
                <div id="form-messages">
                    <div id="sendmessage">Sua mensagem foi enviada com sucesso, obrigado pelo contato!</div>
                    <div id="errormessage">Erro ao enviar a mensagem, tente novamente mais tarde!</div>
                </div>
            </div>
            <form action="sendmessage.php" id="contactForm">
                <div class="row">
                    <div class="col-md-2"></div>
                    <div class="col-md-8">
                        <div class="form-group">
                            <label class="bmd-label-floating">Nome</label>
                            <input type="text" id="name" data-rule="minlen:4"
                                data-msg="O Campo nome deve conter ao menos 4 caracteres" class="form-control">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-2"></div>
                    <div class="col-md-8">
                        <div class="form-group">
                            <label class="bmd-label-floating">E-Mail</label>
                            <input type="email" id="email" data-rule="email"
                                data-msg="Por Favor, insira um e-mail válido para continuar" class="form-control">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-2"></div>
                    <div class="col-md-8">
                        <div class="form-group">
                            <label class="bmd-label-floating">Assunto</label>
                            <input type="text" id="subject" data-rule="minlen:4"
                                data-msg="O campo assunto deve conter ao menos 4 caracteres" class="form-control">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-2"></div>
                    <div class="col-md-8">
                        <label class="bmd-label-floating">Menssagem</label>
                        <textarea class="form-control" name="message" rows="2" data-rule="required" id="message"
                            data-msg="Por Favor, escreva uma mensagem para nós!"></textarea>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-2"></div>
                    <div class="col-md-8 d-flex justify-content-between">
                        <button id="btn-cancelForm" class="btn-secondary">cancelar</button>
                        <button type="submit" class="submit">enviar msg</button>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <div class="row contact-infos d-flex" data-aos="fade-up" data-aos-anchor=".contact-main">
        <div class="col-md-5 contact-phone">
            <!-- <h4>Nosso Email</h4> -->
        </div>
        <div class="col-md-7 contact-social d-flex justify-content-end justify-content-between">
            <div class="d-flex flex-column logo-utfpr">
                <a href="http://portal.utfpr.edu.br/home" target="_BLANK"><img src="./images/logo-utfpr.png"
                        class="img-fluid" alt="Universidade Tecnológica Federal do Paraná"></a>
            </div>
            <div class="d-flex flex-column">
                <h4>Social</h4>
                <ul>
                    <!-- <li><a href="#0" title="Facebook"><i class="fab fa-facebook"></i></a></li>
                    <li><a href="#0" title="Twitter"><i class="fab fa-twitter"></i></a></li>
                    <li><a href="#0" title="Instagram"><i class="fab fa-instagram"></i></a></li> -->
                    <li><a href="https://github.com/ic2d" target="_BLANK" title="Github"><i
                                class="fab fa-github"></i></a></li>
                </ul>
            </div>
        </div>
    </div> <!-- end contact-infos -->
</section> <!-- end s-contact -->

<!-- footer
================================================== -->
<footer>
    <div class="row">
        <div class="column large-full ss-copyright">
            <span>© Copyright IC²D 2020</span>
            <span>Design by <a href="https://www.styleshout.com/">StyleShout</a></span>
        </div>

        <div class="ss-go-top">
            <a class="smoothscroll" title="Back to Top" href="#top"></a>
        </div>
    </div>
</footer>


<!-- photoswipe background
================================================== -->
<div aria-hidden="true" class="pswp" role="dialog" tabindex="-1">

    <div class="pswp__bg"></div>
    <div class="pswp__scroll-wrap">

        <div class="pswp__container">
            <div class="pswp__item"></div>
            <div class="pswp__item"></div>
            <div class="pswp__item"></div>
        </div>

        <div class="pswp__ui pswp__ui--hidden">
            <div class="pswp__top-bar">
                <div class="pswp__counter"></div><button class="pswp__button pswp__button--close"
                    title="Close (Esc)"></button> <button class="pswp__button pswp__button--share"
                    title="Share"></button> <button class="pswp__button pswp__button--fs"
                    title="Toggle fullscreen"></button> <button class="pswp__button pswp__button--zoom"
                    title="Zoom in/out"></button>
                <div class="pswp__preloader">
                    <div class="pswp__preloader__icn">
                        <div class="pswp__preloader__cut">
                            <div class="pswp__preloader__donut"></div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
                <div class="pswp__share-tooltip"></div>
            </div><button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)"></button>
            <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)"></button>
            <div class="pswp__caption">
                <div class="pswp__caption__center"></div>
            </div>
        </div>

    </div>

</div><!-- end photoSwipe background -->


<!-- Java Script
================================================== -->
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
<script src="js/material-dashboard.min.js"></script>