Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add files via upload #53262

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
204 changes: 204 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,204 @@
<!DOCTYPE html>
<html lang="pt-BR">

<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description"
content="Clínica Médica Especializada - Oferecemos atendimento de qualidade em várias especialidades médicas." />
<title>Clínica Médica - Especialidade em Dermatologia</title>
<link rel="stylesheet" href="style.css">
</head>

<body>
<!-- Cabeçalho -->
<header>
<div class="logo">

</div>
<nav>
<ul>
<li><a href="#home">Início</a></li>
<li><a href="#especialidade">Especialidade</a></li>
<li><a href="#sobre">Sobre</a></li>
<li><a href="#contato">Contato</a></li>
</ul>
</nav>
</header>

<!-- Seção Principal -->
<main>
<!-- Banner inicial -->
<section id="home" class="banner">
<h1>Bem-vindo à Clínica Médica Especializada</h1>
<p>
Na ,<STrong>CORPOS BUENOS</STrong> acreditamos que a beleza vai além da aparência,
ela é uma expressão de confiança, saúde e bem-estar. Nosso objetivo é
oferecer uma experiência transformadora, onde cada cliente se sinta
cuidado e valorizado. Com uma equipe altamente qualificada e
equipamentos de última geração, oferecemos uma ampla gama de serviços,
incluindo tratamentos faciais, corporais, depilação a laser, design de
sobrancelhas e procedimentos estéticos avançados. Cada tratamento é
cuidadosamente personalizado para atender às necessidades individuais,
garantindo resultados que realçam a sua beleza natural. Nosso espaço
foi projetado para proporcionar um ambiente relaxante e acolhedor,
onde você pode desconectar da rotina e se entregar a momentos de
autocuidado. Valorizamos a qualidade, o conforto e a satisfação de
cada cliente, por isso trabalhamos apenas com produtos de renome e
técnicas comprovadas. Na [Nome da Empresa], acreditamos que o
bem-estar é o primeiro passo para a verdadeira beleza. Agende sua
consulta hoje e descubra como podemos ajudar você a se sentir ainda
mais radiante e confiante!
</p>
<a href="#contato" class="btn-agendar">Agende sua consulta</a>
</section>

<!-- Seção da Especialidade -->
<section id="especialidade" class="especialidade">
<h2>Nossa Especialidade: Dermatologia</h2>
<p>
Na nossa clínica, oferecemos tratamento completo em dermatologia,
cuidando da saúde da sua pele com profissionais experientes e
tecnologia de ponta.
</p>
<div class="servicos">
<div class="servico">
<h3>Tratamentos Faciais</h3>
<p>
Oferecemos diversos tratamentos para rejuvenescimento facial,
controle da acne e outras condições dermatológicas.
</p>
</div>
<div class="servico">
<h3>Tratamentos Corporais</h3>
<p>
Cuide da saúde da sua pele com nossos tratamentos corporais para
estrias, celulite, cicatrizes e muito mais.
</p>
</div>
<div class="servico">
<h3>Procedimentos Estéticos</h3>
<p>
Realizamos procedimentos estéticos, como peelings, botox, e
preenchimentos, garantindo sua autoestima e confiança.
</p>
</div>
</div>

<div class="tabela de preços">
<div class="precos">
<!-- Seção da Especialidade -->
<section id="especialidade" class="especialidade">
<h2>Nossa Especialidade: Dermatologia</h2>
<p>Na nossa clínica, oferecemos tratamento completo em dermatologia, cuidando da saúde da sua
pele com profissionais experientes e tecnologia de ponta.</p>

<!-- Tabela de Preços -->


<div class="servicos">
<div class="servico">
<h3>Tratamentos Faciais</h3>
<p>Oferecemos diversos tratamentos para rejuvenescimento facial, controle da acne e
outras condições dermatológicas.</p>
</div>
<div class="servico">
<h3>Tratamentos Corporais</h3>
<p>Cuide da saúde da sua pele com nossos tratamentos corporais para estrias, celulite,
cicatrizes e muito mais.</p>
</div>
<div class="servico">
<h3>Procedimentos Estéticos</h3>
<p>Realizamos procedimentos estéticos, como peelings, botox, e preenchimentos,
garantindo sua autoestima e confiança.</p>
</div>
</div>
<h3>Tabela de Preços</h3>
<table border="1">
<thead>
<tr>
<th>Serviço</th>
<th>Descrição</th>
<th>Preço</th>
</tr>
</thead>
<tbody>
<tr>
<td>Limpeza de Pele Profunda</td>
<td>Remoção de impurezas, cravos e células mortas.</td>
<td>R$ 150,00</td>
</tr>
<tr>
<td>Peeling Químico</td>
<td>Tratamento para rejuvenescimento e renovação celular.</td>
<td>R$ 300,00</td>
</tr>
<tr>
<td>Botox</td>
<td>Preenchimento facial para redução de rugas e linhas de expressão.</td>
<td>R$ 900,00</td>
</tr>
<tr>
<td>Tratamento de Acne</td>
<td>Procedimento para controle e eliminação da acne.</td>
<td>R$ 250,00</td>
</tr>
<tr>
<td>Preenchimento Labial</td>
<td>Aumento do volume labial e definição dos contornos.</td>
<td>R$ 1.200,00</td>
</tr>
</tbody>
</table>

</section>


</section>

<!-- Sobre a Clínica -->
<section id="sobre" class="sobre">
<h2>Sobre a Clínica</h2>
<p>
Nossa clínica é referência em atendimento personalizado e humanizado.
Contamos com uma equipe multidisciplinar altamente capacitada,
comprometida em oferecer o melhor cuidado em saúde para você.
</p>
<p>
Estamos localizados em um ambiente moderno e acolhedor, onde o
paciente é sempre nossa prioridade. Venha conhecer nossos serviços!
</p>
</section>



</main>

<!-- Formulário de Contato -->
<section id="contato" class="contato">
<h2>Contato</h2>
<form action="envia-email.php" method="POST">
<label for="nome">Nome:</label>
<input type="text" id="nome" name="nome" required />

<label for="email">E-mail:</label>
<input type="email" id="email" name="email" required />

<label for="telefone">Telefone:</label>
<input type="tel" id="telefone" name="telefone" required />

<label for="mensagem">Mensagem:</label>
<textarea id="mensagem" name="mensagem" rows="4" required></textarea>

<button type="submit">Enviar</button>
</form>
</section>

<!-- Rodapé -->
<footer>
<p>&copy; 2024 Clínica Médica. Todos os direitos reservados.</p>

</footer>
</body>

</html>
118 changes: 118 additions & 0 deletions style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,118 @@
/* Estilos globais */
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}

header {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #4CAF50;
padding: 10px 20px;
color: white;
}

header nav ul {
list-style-type: none;
}

header nav ul li {
display: inline;
margin: 0 10px;
}

header nav ul li a {
color: white;
text-decoration: none;
}

.banner {
background: url('banner.jpg') no-repeat center center;
background-size: cover;
color: white;
padding: 100px 20px;
text-align: center;background: url('banner.jpg') no-repeat center center;
}

.btn-agendar {
background-color: #FFA500;
padding: 10px 20px;
color: white;
text-decoration: none;
border-radius: 5px;
margin-top: 20px;
}

section {
padding: 40px 20px;
}

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

.servico {
width: 30%;
}

.contato form {
display: flex;
flex-direction: column;
}
/* Estilos para a Tabela de Preços */
table {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
}

table, th, td {
border: 1px solid #ddd;
}

th, td {
padding: 12px;
text-align: left;
}

th {
background-color: #4CAF50;
color: white;
}

tr:nth-child(even) {
background-color: #f2f2f2;
}

tr:hover {
background-color: #ddd;
}




.contato label,
.contato input,
.contato textarea {
margin-bottom: 10px;
}

footer {
background-color: #333;
color: white;
text-align: center;
padding: 10px;
}

footer nav ul {
padding: 0;
margin: 0;
}

footer nav ul li {
display: inline;
margin: 0 5px;
}
Loading