/* Use "Inspecionar" do navegador para determinar o elemento desejado */

#title {}

#bottom {
    display: none !important;
}

#rodape {
    color: white; /* texto branco para contraste */
    padding: 15px;
    text-align: center;
}

#rodape a {
    color: white; /* links brancos para manter contraste */
    text-decoration: none; /* opcional, remove o sublinhado */
}

#rodape a:hover {
    color: #d1e8ff; /* azul clarinho no hover para destacar */
    text-decoration: underline; /* opcional */
}

#main {
  background-color: #fff;
  border-radius: 15px;
  max-width: 95%; /* Aumenta a largura para 95% da tela */
  margin: 0 auto;
  padding-right: 20px;
}


/* ================================
   Banner / cabeçalho
   ================================ */
#head img {
    border-radius: 15px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
    width: 100%;           /* largura total do contêiner */
    max-width: 840px;      /* mantém o tamanho máximo desejado */
    display: block;
    margin: 0 auto;        /* centraliza a imagem */
}

/* Classe opcional para ajustes específicos */
#head img.custom-style {
    border-radius: 10px;
    box-shadow: none;
}

/* ================================
   Menu lateral
   ================================ */
#side-menu {
    color: #006699;
    font-size: 10px; /* ajustei para melhor leitura */
}

#side-menu a {
    color: #006699;
    text-decoration: none;
}

#side-menu a:hover {
    color: #cccccc;
}

/* ================================
   Conteúdo
   ================================ */
#content {
    padding: 10px 0; /* separação interna opcional */
}

/* ================================
   Botão lateral "Inscreva-se"
   ================================ */
#side-bar #inscreva > p {
    background: linear-gradient(to bottom, #218cb4, #25356b);
    color: #fff;
    padding: 16px 20px;   /* espaço interno consistente */
    font-size: 16px;
    cursor: pointer;
    border-radius: 10px;   /* bordas mais arredondadas */
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

/* Efeito ao passar o mouse */
#side-bar #inscreva > p:hover {
    background-color: #006699;
    transform: scale(1.05);
    box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.4);

#parceiros {}

/* Caso queira responsividade, coloque nas seções correspondentes */

/* Smartphones na vertical */
@media (min-width:320px) {
	#title {}
	#head {}
	#side-menu {}
	#content {}
	#side-bar {}
	#inscreva {}
	#parceiros {}
}

/* Tables na vertical e Smartphones na horizontal */
@media (min-width:481px) {
	#title {}
	#head {}
	#side-menu {}
	#content {}
	#side-bar {}
	#inscreva {}
	#parceiros {}
}

/* Tables na horizontal  */
@media (min-width:641px) {
	#title {}
	#head {}
	#side-menu {}
	#content {}
	#side-bar {}
	#inscreva {}
	#parceiros {}
}

/* Notebook pequenos */
@media (min-width:961px) {
	#title {}
	#head {}
	#side-menu {}
	#content {}
	#side-bar {}
	#inscreva {}
	#parceiros {}
}

/* Notebook grandes e monitores pequenos */
@media (min-width:1025px) {
	#title {}
	#head {}
	#side-menu {}
	#content {}
	#side-bar {}
	#inscreva {}
	#parceiros {}
}

/* Monitores grandes */
@media (min-width:1281px) {
	#title {}
	#head {}
	#side-menu {}
	#content {}
	#side-bar {}
	#inscreva {}
	#parceiros {}
}
