/* Reset default styles */
body {
	margin: 0;
	padding: 0;
	font-family: Arial, sans-serif;
  }
  
  /* Logo style for desktop */
  #logo {
	width: 20%;
	height: auto;
	margin: 0 auto; /* Center the logo horizontally */
  }
  
  /* Logo style for mobile */
  @media screen and (max-width: 768px) {
	#logo {
	  width: 90%; /* Adjust the value as needed for the desired size */
	}
  }
  
  /* Desktop styles */
  @media screen and (min-width: 769px) {
	footer ul {
	  flex-direction: row;
	}
  }
  
  #premiere-main {
	padding: 20px;
	text-align: center;
  }
  
  h1 {
	font-size: 32px;
	margin-bottom: 20px;
  }
  
  .main-wrapper {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center; /* Center the content horizontally */
	max-width: 800px;
	margin: 0 auto;
  }
  
  .main-img {
	flex: 1; /* Use flex to take available space */
	max-width: 400px;
	margin-right: 20px; /* Add margin between main-text and main-image */
  }
  
  .main-img img {
	max-width: 100%;
	height: auto;
	border-radius: 5px;
  }
  
  .main-text {
	flex: 1; /* Use flex to take available space */
	text-align: left;
	max-width: 400px;
  }
  
  h3 {
	font-size: 24px;
	margin-bottom: 10px;
  }
  
  p {
	font-size: 16px;
	line-height: 1.6;
	margin-bottom: 20px;
  }
  
  a {
	display: inline-block;
	background-color: #a30389;
	color: #fff;
	padding: 12px 30px;
	text-decoration: none;
	border-radius: 5px;
	font-size: 18px;
  }
  
  /* Center h2 on desktop */
  h2 {
	text-align: center;
  }
  
  /* Mobile-friendly styles */
  @media screen and (max-width: 768px) {
	h1 {
	  font-size: 24px;
	}
  
	.main-wrapper {
	  flex-direction: column;
	  align-items: center;
	}
  
	.main-img {
	  margin-bottom: 20px;
	  margin-right: 0; /* Remove margin between main-text and main-image on mobile */
	}
  
	.main-text {
	  text-align: center;
	  margin-bottom: 20px;
	}
  
	.courses-wrapper,
	.test-wrapper {
	  display: flex;
	  flex-wrap: wrap;
	  justify-content: center;
	}
  
	.courses-wrapper img,
	.test-wrapper img {
	  max-width: 150px;
	  height: auto;
	  border-radius: 5px;
	  margin: 20px;
	}
  
	footer ul {
	  display: flex;
	  flex-wrap: wrap;
	  justify-content: center;
	  list-style: none;
	  padding: 0;
	}
  
	footer li {
	  margin: 5px;
	}
  }
  
  /* Center images inside courses-wrapper on desktop */
  #courses .courses-wrapper {
	display: flex;
	justify-content: center;
  }
  
  /* Add margin between images inside courses-wrapper on desktop */
  #courses .courses-wrapper img {
	margin: 20px;
  }
  
  /* Center images inside test-wrapper on desktop */
  @media screen and (min-width: 769px) {
	.test-wrapper {
	  display: flex;
	  justify-content: center;
	}
  
	.test-wrapper img {
	  margin: 10px; /* Add margin between images */
	}
  }
  
  /* Style for the popup form */
  .popup {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
  }
  
  .popup-content {
	background-color: #f9f9f9;
	border-radius: 5px;
	padding: 20px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 300px;
  }
  
  .close {
	color: #aaaaaa;
	float: right;
	font-size: 28px;
	font-weight: bold;
	cursor: pointer;
  }
  
  .close:hover {
	color: #000;
  }
  
  /* Additional styles for the popup form */
  .popup h3 {
	text-align: center;
	margin-bottom: 10px;
  }
  
  .popup p {
	text-align: center;
	margin-bottom: 20px;
  }
  
  .popup form {
	display: flex;
	flex-direction: column;
  }
  
  .popup input {
	margin-bottom: 10px;
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 5px;
  }
  
  .popup input[type="submit"] {
	background-color: #a30389;
	color: #fff;
	cursor: pointer;
  }
  
  /* Footer styles */
  footer {
	background-color: #f9f9f9;
	padding: 20px;
	text-align: center;
  }
  
  footer ul {
	list-style: none;
	padding: 0;
	display: flex;
	justify-content: center;
  }
  
  footer li {
	margin: 0 10px;
  }
  
  footer li a {
	text-decoration: none;
	color: #333;
	font-size: 16px;
	padding: 8px 16px;
	border-radius: 5px;
	background-color: #a30389;
	color: #fff;
  }
  
  /* Default style */
  .about-us {
	text-align: center;
  }
  
  /* Media query for mobile version */
  @media screen and (max-width: 768px) {
	/* Override the style for mobile version */
	.about-us br {
	  display: none; /* Hide the <br> tag on mobile */
	}
  }  