@font-face
{
    font-family: Italianno;
    src: url(../fonts/Italianno-Regular.ttf);
}

@font-face
{
    font-family: Questrial;
    src: url(../fonts/Questrial-Regular.ttf);
}

*
{
    margin:                             0;
    padding:                            0;
    box-sizing:                         border-box;
    font-family:                        'Questrial';
}

html,
body
{
    width:                              100%;
    height:                             100vh;
    overflow:                           hidden;
    background:                         rgba(0, 0, 0, .7);
}

body::after
{
    top:                                0;
    left:                               0;
    right:                              0;
    bottom:                             0;
    content:                            '';
    z-index:                            -1;
    position:                           absolute;
    background-size:                    cover;
    background-image:                   url('../img/fundo.jpg');
    background-repeat:                  no-repeat;
}

main
{
    color:                              white;
    width:                              100%;
    height:                             100vh;
    display:                            flex;
    display:                            -webkit-flex;
    overflow-x:                         hidden;
    overflow-y:                         auto;
    flex-direction:                     column;
    justify-content:                    space-between;
    -ms-flex-direction:                 column;
}

main > *    { z-index: 1; }

/* ----------- Formatações Gerais ----------- */

.t-c        { text-align: center; }

#fundo
{
    top:                                0;
    width:                              100%;
    height:                             100%;
    display:                            flex;
    padding:                            .8rem 0;
    z-index:                            999;
    position:                           fixed;
    overflow-y:                         auto;
    justify-content:                    center;
    background-color:                   rgba(0, 0, 0, .6);
}

#fundo > *
{
    position:                           relative;
    max-width:                          90%;
}

#fundo .fechar
{
    top:                                .2rem;
    right:                              .5rem;
    color:                              #a71a1a;
    cursor:                             pointer;
    position:                           absolute;
    font-size:                          1.8rem;
}

h2
{
    font-size:                          1.8rem;
    font-family:                        'Pinyon Script', cursive;
}

h1
{
    font-size:                          3rem;
    text-align:                         center;
    text-transform:                     uppercase;
    letter-spacing:                     .6rem
}

h3
{
    margin:                             .2rem 0;
    font-size:                          1.4rem;
    text-align:                         center;
}

button
{
    cursor:                             pointer;
    padding:                            .5rem 1rem;
    font-size:                          .8rem;
}

p
{
    margin:                             .8rem 0;
    font-size:                          1.1rem;
    text-align:                         left;
    line-height:                        125%;
}

img { max-width:                        100%; }

/* ----------- Formatações Flex ----------- */

.row
{
    flex:                               auto;
    width:                              100%;
    display:                            flex;
    display:                            -webkit-flex;
    -ms-flex:                           auto;
    flex-wrap:                          wrap;
    -ms-flex-wrap:                      wrap;
}

.col-1  {flex:    8.33%;  -ms-flex:    8.33%; }
.col-2  {flex:    16.66%; -ms-flex:    16.66%;}
.col-3  {flex:    25%;    -ms-flex:    25%;   }
.col-4  {flex:    33.33%; -ms-flex:    33.33%;}
.col-5  {flex:    41.66%; -ms-flex:    41.66%;}
.col-6  {flex:    50%;    -ms-flex:    50%;   }
.col-7  {flex:    58.33%; -ms-flex:    58.33%;}
.col-8  {flex:    66.66%; -ms-flex:    66.66%;}
.col-9  {flex:    75%;    -ms-flex:    75%;   }
.col-10 {flex:    83.33%; -ms-flex:    83.33%;}
.col-11 {flex:    91.66%; -ms-flex:    91.66%;}
.col-12 {flex:    100%;   -ms-flex:    100%;  }

/* ---------------------------------------- */

/* ---------------------------------------- */

header { padding: .5rem 0; }


.festival
{
    width:                              10rem;
    cursor:                             pointer;
    margin:                             0 .8rem 0 auto;
    display:                            block;
    text-align:                         center;
}

.festival h3 { color:                   yellow; }
.festival span { font-size:             .8rem ; }

nav
{
    width:                              100%;
    display:                            flex;
    display:                            -webkit-flex;
    margin-top:                         .8rem;
    background:                         rgba(0, 0, 0, .6);
    justify-content:                    center;
}

nav .img-logo
{
    width:                              20rem;
    display:                            flex;
    display:                            -webkit-flex;
    position:                           relative;
    align-items:                        center;
    justify-content:                    center;
}

nav .img-logo img
{
    width:                              8rem;
    height:                             7.5rem;
    position:                           absolute;
    border-radius:                      50%;
}

nav ul
{
    display:                            flex;
    display:                            -webkit-flex;
    list-style-type:                    none;
    text-decoration:                    none;
    justify-content:                    center;
}

nav ul li
{
    cursor:                             pointer;
    padding:                            .8rem 1.3rem;
    transition:                         .3s;
    font-size:                          1.6rem;
    font-family:                        'Pinyon Script', cursive;
    white-space:                        nowrap;
    font-weight:                        600;
    -o-transition:                      .3s;
    letter-spacing:                     .15rem;
    -moz-transition:                    .3s;
    -webkit-transition:                 .3s;
}

nav ul li.nav-link:hover,
nav ul li.nav-link.ativo
{ background: rgba(0, 0, 0, .6); }

#conteudo
{
    flex:                               auto;
    padding:                            2% 0;
    display:                            flex;
    display:                            -webkit-flex;
    -ms-flex:                           auto;
}

#fundoConteudo
{
    width:                              80rem;
    margin:                             auto;
    height:                             100%;
    padding:                            1.5rem 2.5rem;
    max-width:                          95%;
    background:                         rgba(0, 0, 0, .8);
    border-radius:                      2rem;
}

/* ---------------- Assessoria ---------------- */

#tiposAssessoria > div { margin: 2.5rem 0; }

.mudarView
{
    cursor:                             pointer;
    display:                            inline-block;
    position:                           relative;
    font-size:                          .9rem;
    margin-top:                         4rem;
}

.mudarView::after
{
    left:                               0;
    width:                              0;
    bottom:                             -3px;
    height:                             1px;
    content:                            "";
    position:                           absolute;
    background:                         white;
    transition:                         .3s;
    -o-transition:                      .3s;
    -moz-transition:                    .3s;
    -webkit-transition:                 .3s;
}

.mudarView:hover::after
{
    width:                              100%;
}

/* -------------------------------------------- */

/* ----------------- Listas ----------------- */

ul li
{
    padding:                            .6rem 0;
    font-size:                          1rem;
    list-style-position:                inside;
    letter-spacing:                     2px;
}

.lista-links span:hover,
.lista-links span.ativo
{
    cursor:                             pointer;
    text-decoration:                    underline;
}

/* ------------------------------------------- */

/* ----------------- Produtos ----------------- */

.produtos
{
    display:                            flex;
    justify-content:                    space-between;
}

.produtos .lista-imagens {
    width:                              30rem;
    display:                            flex;
    padding:                            2rem;
    text-align:                         center;
    align-items:                        center;
    border-radius:                      1rem;
    justify-content:                    center;
    background-color:                   black;
}

.produtos .lista-imagens .info-produto
{
    display:                            none;
    align-items:                        center;
    flex-direction:                     column;
    justify-content:                    center;
}

.produtos .lista-imagens .info-produto.ativo
{
    display:                            flex;
}

.produtos .lista-imagens p
{
    margin:                             .8rem 0 0;
    font-size:                          1rem;
    text-align:                         center;
}

/* ------------------------------------------- */

/* ----------------- Contato ----------------- */

.contato
{
    display:                            flex;
    flex-wrap:                          wrap;
}

.contato > div{
    flex:                               50%;
    min-width:                          20rem;
    padding:                            0 1rem;
}

.contato iframe
{
    width:                              600px;
    height:                             350px;
    max-width:                          100%;
}

.contato p { margin:                    .7rem 0;  }
.contato .dados > div  { margin:        2.5rem 0; }

/* ------------------------------------------- */

/* ------------------ Rodapé ------------------ */

footer
{
    display:                            flex;
    display:                            -webkit-flex;
    border-top:                         1px solid rgba(255, 255, 255, .2);
    align-items:                        center;
    justify-content:                    center;
}

footer > *
{
    color:                              white;
    margin:                             1.8rem 0;
    font-size:                          1.1rem;
}
