@import url('https://fonts.googleapis.com/css?family=Urbanist');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css');

:root {
    --cinza:#3C3C3B;
    --cinza-escuro:#1E1D1D;
    --dourado:#EBD184;
    --rosa:#FF0161;
    --rosa-claro:#ffd3e3;
}

#abertura {
    background: url('../images/bg-abertura.jpg');
    background-size: cover;
    background-position: center center;
    text-align: center;
    padding: 200px 0;
}

#abertura h1, #agencia-parceira h1 , #cases h1, #marcas h1 , #metodo h1, #o-que-a-agencia-pode-fazer h1,
#como-funcionam-os-servicos h1, #clientes-no-brasil-e-no-mundo h1, #contato h1  {
    font-size: 48px;
    font-weight: bold;
    color: #fff;
    letter-spacing: .05em;
}

#abertura p, #contato p {
    color: var(--dourado);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: .05em;
}

#agencia-parceira {
    background: var(--cinza);
    text-align: center;
    padding: 120px 0;
}

#cases {
    background: url('../images/bg-servicos.jpg');
    background-size: cover;
    background-position: center center;
    text-align: center;
    padding: 120px 0;
}

#cases .box {
text-align: left;
min-height: 496px;
}

#cases h2 {
    color: var(--dourado);
    font-size: 42px;
    text-align: left;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: .05em;
}

#cases hr {
    height: 8px;
    color: #fff;
    opacity: 1;
    margin-top: 60px;
    margin-bottom: 60px;
}

#cases p {
    text-align: left;
    color: #fff;
    letter-spacing: .05em;
    line-height: 2em;
    margin-bottom: 0;
}

#clientes-no-brasil-e-no-mundo {
    background: var(--cinza-escuro);
    padding: 120px 0;
    text-align: center;
}

#clientes-no-brasil-e-no-mundo .box-branco, #clientes-no-brasil-e-no-mundo .box-rosa {
    border-radius: 8px;
    padding: 30px;
    margin-bottom: 30px;
}

#clientes-no-brasil-e-no-mundo p {
    margin-top: 30px;
}

#clientes-no-brasil-e-no-mundo h2 {
    text-transform: uppercase;
    font-weight: 900;
    font-size: 36px;
}

#clientes-no-brasil-e-no-mundo .box-branco {
    background-color: #fff;
}

#clientes-no-brasil-e-no-mundo .box-branco h2 {
    color: var(--rosa);
}

#clientes-no-brasil-e-no-mundo .box-rosa h2 {
    color: var(--dourado);
}

#clientes-no-brasil-e-no-mundo .box-rosa {
    background-color: var(--rosa);
    color: #fff;
}

#como-funcionam-os-servicos {
    text-align: center;
    padding: 120px 0; 
}

#como-funcionam-os-servicos .box-header {    
    background-color: var(--rosa);
    border-radius: 8px 8px 0 0;
    
    color: #fff;
    padding: 20px;
    letter-spacing: .05em;
    text-transform: uppercase;
}

#como-funcionam-os-servicos .box-content {    
    background: #fff;
    padding: 30px;
    padding-bottom: 5px;
    min-height: 270px;
}

#como-funcionam-os-servicos .box-content hr {   
    color: var(--rosa);
}

#como-funcionam-os-servicos .box-footer {    
    background: var(--rosa-claro);
    padding: 30px;
    text-align: left;
    border-radius: 0 0 8px 8px;
    text-transform: uppercase;
    min-height: 500px;
    margin-bottom: 30px;
}

#contato {
    background: var(--rosa);
    padding: 120px 0;
    text-align: center;
}

#footer {
    background: #fff;
    padding: 60px 0;
    text-align: center;
}

#footer hr {
    height: 2px;
    width: 150px;
    display: inline-block;
}

#footer img {
    padding: 20px;
    width: 120px;
}

#footer p {
    margin-top: 30px;
}

#footer a {
    color: #000;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: .5rem;
}

#marcas {
    background: #000;
    text-align: center;
    padding: 120px 0;
}

#metodo {
    background: var(--cinza);
    text-align: center;
    padding: 120px 0;
}

#o-que-a-agencia-pode-fazer {
    background: #fff;
    padding: 120px 0;
}

#o-que-a-agencia-pode-fazer h1 {
 color: #000;
 text-align: center;
}

#parceiros {
    background: #fff;
    padding: 120px 0;
}

#parceiros img {
    height: 50px;
}

#servicos {
    background: url('../images/bg-servicos.jpg');
    background-size: cover;
    background-position: center center;
    text-align: center;
    padding: 120px 0;
}



#servicos img {
    height: 80px;
}

#servicos p {
margin-top: 30px;
}

.box {
    background: #fff;        
    border-radius: 8px;
    box-shadow: 0px 6px #00000033;
    padding: 30px;
    margin-bottom: 30px;
}

.box-dourado {
    background: var(--dourado);        
    border-radius: 8px;
    box-shadow: 0px 6px #00000033;
    padding: 10px;
    margin-bottom: 30px;
}

.box-dourado h3 {
    font-size: 84px;
    font-weight: 900;
    color: #FF0161;
    margin-bottom: 0;
}

.box-dourado p {
    color: #000 !important;
    text-align: center !important;
    text-transform: uppercase;
}

.box-agencia-parceira, .box-metodo {
    border: 1px solid #fff;
    padding: 30px;
    border-radius: 30px;
    color: #fff;
    /* min-height: 350px; */
    margin-bottom: 30px;
}

.box-agencia-parceira p {
    line-height: 2em;
    /* min-height: 200px; */
}

.box-metodo p {
    line-height: 2em;
    min-height: 195px;
}

.btn-dourado {
    background: var(--dourado);
    padding: 10px 30px;
    border-radius: 8px;
    color: #000;
    font-weight: 600;
    letter-spacing: .05em;
    margin-top: 30px;
}

.btn-rosa {
    background: var(--rosa);
    padding: 10px 30px;
    border-radius: 8px;
    color: var(--dourado);
    font-weight: 600;
    letter-spacing: .05em;
    margin-top: 30px;
}

.rosa {
    color: #FF0161 !important;
}

body {
    background-color: var(--cinza);
    font-family: "Urbanist";
}



nav div {
    text-align: center !important;
    display: block !important;
}

nav div img {
padding: 10px;
width: 100px;
}

ul {
    list-style-type: disclosure-closed;
    color: var(--rosa);
}

ul li {
    margin-bottom: 20px;
}

ul li span {   
    color: #000;
  }

.carousel-indicators {
    margin-bottom: -1rem !important;
}

#cases .carousel-control-prev {
    width: 50px !important;
    left: -50px !important;
}


#cases .carousel-control-next {
    width: 50px !important;
    right: -50px !important;
}

#cases .box, #cases .box-dourado {
    margin-left: 10px;
    margin-right: 10px;
}

  @media (max-width: 767px)
  {  

    #abertura {
        padding: 100px 0;
    }

    #abertura h1, #agencia-parceira h1, #cases h1, #marcas h1, #metodo h1, #o-que-a-agencia-pode-fazer h1, #como-funcionam-os-servicos h1, #clientes-no-brasil-e-no-mundo h1, #contato h1 {
        font-size: 24px;
    }

    #servicos, #agencia-parceira, #parceiros, #cases, #metodo, #marcas, #o-que-a-agencia-pode-fazer,
    #como-funcionam-os-servicos, #clientes-no-brasil-e-no-mundo, #contato {
        padding: 60px 0;
    }

    #parceiros img {
        margin-top: 20px;
        margin-bottom: 20px;
    }

    #cases h2 {
        font-size: 32px;
        text-align: center;
    }

    #cases hr {
        margin-top: 30px;
        margin-bottom: 30px;
    }

    #cases p {
        text-align: center;
    }

    #cases .btn-dourado {
        margin-bottom: 60px;
    }

    #o-que-a-agencia-pode-fazer {
        text-align: center;
    }

    #cases .carousel-control-prev, #cases .carousel-control-next {
        display: none !important;
    }


    #como-funcionam-os-servicos .box-content {
        min-height: inherit;
    }

  }