* {
    box-sizing: border-box;
}

html, body {
    margin: 0;
}

.questao-e-resolucao {
	display: flex;
	margin-top: 10px;
}

.questao {
	margin-right: 10px;
	border: 1px solid black;
	width: 50%;
	box-shadow: 3px 2px grey;
	padding-left: 3px;
}

.resolucao {
	font-size: 1.5em;
	font-family: arial;
	font-weight: bold;
	background-color: #3277e6;
	width: 50%;
	text-align: center;
	color: white;
}

.resolucao:hover {
	background-color: #09419c;
}

a {
	text-decoration: none;
}

.questao a {
	color: black;
    text-decoration: none;
}

.resolucao a {
	color: white;
    text-decoration: none;
}

.etiquetas {
	width: 100%;
	display: flex;
	font-size: 12px;
}

.etiquetas div {
	border-radius: 10px;
	padding: 3px;
	margin: 2px 3px 4px 3px;
	color: white;
	font-weight: bold;
}

.vestibular {
	background-color: #e02e22;
	letter-spacing: 0.7px;
}

.ano {
	background-color: #167ed9;
}

#conteudo-principal {
    width: 90%;
    margin: auto;
}

@media(max-width: 768px) {
    #tela-questoes-formulario-pesquisa {
        display: none;
    }

    #conteudo-principal {
        margin-top: 5em;
    }

    #caixa-pesquisa {
        position: fixed;
        bottom: 0;
    }

    #ferramentas {
        display: none;
    }
    
}

#caixa-pesquisa {
    display: none;
}

@media(min-width: 768px) {
    #tela-questoes-formulario-pesquisa {
        display: flex;
        align-items: center;
        margin-top: 5%;
        margin-bottom: 0.8em;
        background-color: rgba(100, 100, 100, 0.4);
        padding-bottom: 1%;
    }

    #container-caixa-ferramentas {
        margin-bottom: 4em;
    }


    #tela-questoes-formulario-pesquisa > input[type='text'] {
        max-height: 16px;
        flex-grow: 7;
    }

    #tela-questoes-formulario-pesquisa > input[type='image'] {
        max-height: 32px;
        align-self: flex-end;
    }

    #tela-questoes-formulario-pesquisa > div, input[type='text'] {
        margin-right: 4%;
        flex-grow: 1;
    }

    .tela-questoes-anos-vestibulares {
        display: flex;
        flex-direction: column;
    }

    .tela-questoes-anos-vestibulares > select {
        margin-top: 7%;
    }

    #tela-questoes-formulario-pesquisa-caixa-botao {
        height: 100%;
        align-items: flex-end;
    }

    #ferramentas {
        float: right;
    }

    #caixa-pesquisa {
        display: none;
        position: fixed;
        bottom: 0;
    }
}

@media (min-width: 880px){
   #conteudo-principal {
      padding-right: 10%;
  } 

}