body{
    font-family:'Open Sans', sans-serif;
    margin:0;
    padding:0;
}

#botao-topo{
    display:none;
    position:fixed;
    bottom:20px;
    right:30px;
    z-index:1;
    border:none;
    border-radius:4px;
    background-color:#999999;
    cursor:pointer;
    padding:0 8px;
}
  
#botao-topo:hover{
    background-color:#cccccc;
}

img{
    width:100%;
    max-width:100%;
}

img.mini-banner{
    margin-top:20px;
}

.imagens_de_topo{
    background-color:#182545;
}

.imagens_dos_produtos{
    width:50%;
}

.imagens_dos_produtos:hover{
    box-shadow:4px 4px 10px #dddddd;
    -moz-box-shadow:4px 4px 10px #dddddd;
    -webkit-box-shadow:4px 4px 10px #dddddd;
}

.linha_das_dicas{
    background-color:#8dc8b4;
    width:100%;
    padding:0;
    margin:0;
}

.linha_das_filas_de_imagens_das_dicas::after {
    content:"";
    clear:both;
    display:table;
}

.uma_imagem_com_uma_dica{
    float:left;
    width:33%;
    padding:10px;
    box-sizing:border-box;
    font-size:0.8em;
    color:white;
}

.uma_imagem_com_uma_dica img{
    border:3px solid white;
}

video{
    width:40%; /*Colocar a 100% se as dicas forem activadas*/
    height:auto;
    margin:25px 0 10px 0;
    border:3px solid white;
}

.linha{
    margin:20px auto;
    width:90%;
}

.linha:last-of-type{
    clear:both;
    margin-bottom:40px;
}

.linha:nth-last-of-type(2){
    margin-top:30px;
}

.coluna{
    float:left;
    width:100%;
    text-align:center;
}

.coluna p{
    color:black;
    font-size:0.7em;
    line-height:15px;
}

.cabecalho-alinhamento-ao-centro{
    text-align:center;
    line-height:10px;
}

h1{
    font-size:1.2em;
    font-weight:500;
    text-align:center;
    color:white;
}

h3{
    font-size:1.1em;
    font-weight:400;
    text-decoration:line-through black;
    color:#676671;
    text-align:center;
}

h4{
    font-size:1.3em;
    font-weight:900;
    margin-top:-18px;
    text-align:center;
}

hgroup h5{
    margin-top:10px;
    font-size:1em;
    font-weight:900;
    text-align:center;
}

hgroup h5:first-child{
    margin-top:0;
}

hgroup h5:nth-child(3){
    color:#676671;
    font-size:0.8em;
}

.linha hgroup:last-child{
    margin-top:30px;
}

.conteudo-alinhamento-ao-centro{
    text-align:center;
}

nav{
    text-align:left;
}

nav ul li{
    width:158px;
}

nav ul ul{
    display:none;
}

nav ul li:hover > ul{
    display:block;
}

nav ul{
    background-color:#e6e6e6; 
    padding:0;  
    list-style:none;
    position:relative;
    display:inline-table;
}

nav ul:after{
    content:"";
    clear:both;
    display:block;
}

nav ul li{
    float:left;
    display:block;
    padding:2px 30px;
    color:black;
    text-decoration:none;
    cursor:default;
    text-align:left;
}

nav ul ul{
    background-color:#cccccc;
    padding:0;
    position:absolute;
    top:100%;
    left:0;
}

nav ul ul li{
    float:none; 
    position:relative;
    width:158px;
    padding:2px 30px;
    color:white;
}

nav ul ul li:nth-child(2), nav ul ul li:nth-child(4), nav ul ul li:nth-child(6), nav ul ul li:nth-child(8), nav ul ul li:nth-child(10), nav ul ul li:nth-child(12){
    background-color:#999999;
}


nav ul ul li a{
    color:white;
    text-decoration:none;
}

nav ul ul li:hover{
    background-color:#e6e6e6;
}

nav ul ul ul{
    position:absolute;
    left:100%;
    top:0;
}

nav ul ul ul li{
    background-color:#f2f2f2;
}

nav ul ul ul li:nth-child(2), nav ul ul ul li:nth-child(4), nav ul ul ul li:nth-child(6), nav ul ul ul li:nth-child(8), nav ul ul ul li:nth-child(10), nav ul ul ul li:nth-child(12), nav ul ul ul li:nth-child(14), nav ul ul ul li:nth-child(16), nav ul ul ul li:nth-child(18), nav ul ul ul li:nth-child(20){
    background-color:#e6e6e6;
}

nav ul ul ul li:hover{
    background-color:white;
}

nav ul ul ul li a{
    color:#656565;
}

.logotipos_das_lojas{
    width:8%;
    padding:1%;
}

footer{
    padding:0;
    margin:0;
    width:100%;
    background-color:black;
}

.imagem-para-ecras-medios-e-pequenos{
    display:block;
}

.imagem-para-ecras-grandes-e-cinema{
    display:none;
}


@media (max-width:460px){
    .uma_imagem_com_uma_dica{
        width:100%;
    }
      
    nav{
        font-size:0.8em;
    }

    nav ul li{
        width:92px;
    }

    nav ul ul li{
        width:92px;
        z-index:1;
    }
}

@media (max-width:768px){
    video{
        width:100%; /*Retirar se as dicas forem activadas*/
    }
    
    .logotipos_das_lojas{
        width:15%;
    }

    h1, .uma_imagem_com_uma_dica{
        color:#8dc8b4;
    }
}


@media (min-width:768px){
    .linha{
        width:90%;
    }

    .linha:before, .linha:after{
        clear:both;
        content:"";
        display:block;
    }

    .linha > .coluna:first-child{
        margin-left:0;
    }

    .linha hgroup:last-child{
        margin-top:0;
    }

    .coluna{
        margin-left:5%;
    }

    .coluna.abrange-a-linha-toda{
        width:100%;
        text-align:center;
    }

    .coluna.abrange-metade-da-linha{
        width:46%;
        text-align:center;
    }

    .coluna.abrange-um-quarto-da-linha{
        width:21%;
        text-align:center;
    }

    .coluna p{
        height:80px;
    }

    h5{
        height:60px;
    }

    .imagens_dos_produtos{
        width:250px;
    }

    nav{
        text-align:center;
        font-size:1em;
    }
}


@media (min-width:768px) and (max-width:1280px){
    .hgroup p{
        height:300px;
    }

    .imagens_dos_produtos{
        max-width:150px;
    }

    nav{
        font-size:0.8em;
    }

    nav ul li{
        width:92px;
    }

    nav ul ul li{
        width:92px;
        z-index:1;
    }
}


@media (min-width:768px) and (max-width:1600px){
    nav.submenu_a_esquerda ul ul ul{
        left:-100%;
    }
}


@media (min-width:1280px){
    .linha{
        width:1192px;
    }

    .imagem-para-ecras-medios-e-pequenos{
        display:none;
    }

    .imagem-para-ecras-grandes-e-cinema{
        display:block;
    }
}