/* Usando a fonte Montserrat */ body, .evento-texto, .botao-evento { font-family: 'Montserrat', sans-serif; /* Alterando a fonte para Montserrat */ } /* Definindo o layout para a coluna do evento */ .evento-conteudo { display: flex; /* Usando flexbox para dividir a coluna */ justify-content: space-between; /* Espaço entre imagem e texto */ align-items: flex-start; /* Alinhamento superior para a imagem e texto */ } /* Imagem ocupando 1/3 da coluna */ .evento-imagem { flex: 1; /* Ocupa 1 parte do espaço total */ margin-right: 20px; /* Espaço à direita da imagem */ } .evento-imagem img { width: 100%; /* A imagem ocupa todo o espaço disponível */ height: auto; /* Mantém a proporção da imagem */ } /* Texto ocupando 2/3 da coluna */ .evento-texto { flex: 2; /* Ocupa 2 partes do espaço total */ text-align: left; /* Alinha o texto à esquerda */ } /* Tamanho da fonte para o título em px */ .evento-texto h3 { font-size: 18px; /* Tamanho do título em pixels */ margin-bottom: 10px; } /* Tamanho da fonte para os parágrafos em px */ .evento-texto p { font-size: 16px; /* Tamanho do texto dos parágrafos em pixels */ margin-bottom: 8px; } /* Centralizando o botão abaixo do conteúdo */ .evento-botao { text-align: center; /* Centraliza o botão */ margin-top: 20px; /* Espaço acima do botão */ } /* Tamanho da fonte para o botão em px */ .botao-evento { font-size: 14px; /* Tamanho do texto no botão em pixels */ display: inline-block; padding: 10px 20px; background-color: #a3d9a5; color: white; text-decoration: none; border-radius: 5px; font-weight: bold; /* Fonte negrito para o botão */ } .botao-evento:hover { background-color: #d4af37; /* Muda a cor de fundo ao passar o mouse */ color: white; /* Mantém a cor do texto como branco no hover */ }