@charset "utf-8";

/* CSS Document */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}



body {
  font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", "Verdana", sans-serif;
  background-color: #000;
  color: #fff;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-size: 1.1em;

}

/* Header */
.header {
  position: fixed;
  top: 0;
  width: 100%; 
  background-color: rgba(0, 0, 0, 0.8);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 20px;
  z-index: 900;
}

.logo-container {
  display: flex;
  align-items: center;
  margin-left: 2%; /* margem esquerda */
}

.logo-container a{
	text-decoration: none;
}

.logo {
  width: 50px;
  height: 45px;
}

.company-name {
  font-family: "Monotype Corsiva", cursive;	
  color: #f5a623;
  font-size: 1.8em;
  margin-left: 10px;
}

.menu-icon {
  font-size: 30px;
  color: #f5a623;
  cursor: pointer;
  margin-right: 2%; /* margem direita */
 /* padding-bottom: 10%;*/	
  	
}

/* Estilo do menu hamburguer */
.menu {
  display: none;
  position: fixed;
  right: 0;
  top: 70px;
  background-color: rgba(0, 0, 0, 0.9);
  width: 200px;
  border-left: 1px solid #f5a623;
  z-index: 1000;
}

.menu-active {
  display: block;
}

.menu ul {
  list-style: none;
}

.menu li {
  padding: 15px;
}

.menu a {
  color: #f5a623;
  text-decoration: none;
  font-size: 18px;
}

/*MAIN */

.main {
 
  overflow: hidden;
  height: 80vh;
  
}

button {
display: block;
  margin: 150px auto; /* margem em cima e embaixo, 'auto' centraliza - para o botão subir ou descer*/	
  background-color: #000;
  color: #f5a623;
  padding: 10px 20px;
  border: 2px solid #f5a623;
  cursor: pointer;
  font-size: 16px;
	 position: relative;
	z-index: 900;       /* quanto maior, mais "à frente" */

}
button:hover {
  background-color: #f5a623;
  color: #000;
}
.modal {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0; top: 0;
  width: 100%; height: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,0.8);
}
.modal-content {
  background-color: #000;
  color: #f5a623;
  margin: 10% auto;
  padding: 20px;
  border: 1px solid #f5a623;
  width: 90%;
  max-width: 500px;
  border-radius: 10px;
}
.close {
  color: #f5a623;
  float: right;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
}
label { display: block; margin-top: 10px; color: #f5a623; }
input[type="text"], input[type="email"], textarea {
  width: 100%;
  padding: 10px;
  margin-top: 5px;
  border: 1px solid #ccc;
  background: #fff;
  color: #000;
}
.checkbox-group { margin-top: 10px; }
.checkbox-group label { display: block; color: #f5a623; }






		/* Footer */
		footer {
			background-color: #000;
			color: #fff;
			font-size: 16px;
			padding: 20px;
			box-sizing: border-box;
			}

		/* Flexbox Layout */
		.footer-content {
			display: -webkit-flex; /* Prefixo para suporte mais antigo */
			display: flex;
			-webkit-flex-wrap: wrap; /* Prefixo para suporte mais antigo */
			flex-wrap: wrap;
			justify-content: space-between;
		}

		.footer-section {
			flex: 1;
			margin: 10px;
			display: -webkit-flex; /* Prefixo para suporte mais antigo */
			display: flex;
			-webkit-flex-direction: column; /* Prefixo para suporte mais antigo */
			flex-direction: column;
			align-items: center;
			text-align: center;
		}

		.footer-section h2 {
			margin-bottom: 10px;
		}

/*insere os icones em linha vertical*/

	/*	.icon-container {
			display: -webkit-flex; /* Prefixo para suporte mais antigo 
			display: flex;
			-webkit-flex-direction: row; /* Prefixo para suporte mais antigo 
			flex-direction: row; /* Horizontal alignment by default 
			gap: 10px; /* Espaçamento entre os ícones 
			align-items: center; /* Vertical alignment 
		}*/

		.footer-section img {
			height: 45px;
			width: 50px;
			object-fit: contain;
		}

		.footer-section.videos img {
			height: 60px;
			width: 110px;
		}

		.footer-bottom {
			text-align: center;
			margin-top: 20px;
		}

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

		/* Responsividade para dispositivos móveis */
		@media (max-width: 768px) {
			.footer-content {
				-webkit-flex-direction: column; /* Prefixo para suporte mais antigo */
				flex-direction: column;
				align-items: center;
			}

    .footer-section {
        width: 60%;
        margin-bottom: 20px;
    }

  /* .icon-container {
       -webkit-flex-direction: column; /* Prefixo para suporte mais antigo 
        flex-direction: column; /* Vertical alignment for mobile 
        gap: 10px; /* Espaçamento entre os ícones 
	   
		
    }*/
			
				
    .footer-section img {
        height: 30px;
        width: auto;
    }

    .footer-section.videos img {
        width: 60px;
    }
}