
@media screen and (min-width: 601px) {
	.background-image {
		background-image: url('/image/video_clean.png'); /* Adjust path as needed */
		background-size: cover; /* Scales the image to cover the entire element */
		background-repeat: no-repeat; /* Prevents the image from repeating */
		background-position: center center; /* Centers the image horizontally and vertically */
		height: 65vh; /* Ensures the body covers the full viewport height */
		/*width: 92vw;*/ /* Ensures the body covers the full viewport width */
		margin: 0; /* Removes default body margin */
	}

	.background-sponsorship {
		background-image: url('/image/sponsorship_overview_clean.png'); /* Adjust path as needed */
		background-size: cover; /* Scales the image to cover the entire element */
		background-repeat: no-repeat; /* Prevents the image from repeating */
		background-position: center center; /* Centers the image horizontally and vertically */
		/*height: 100vh;*/ /* Ensures the body covers the full viewport height */
		width: 100%;  /*Ensures the body covers the full viewport width*/
		margin: 0; /* Removes default body margin */
	}

	.title{
		color: #0d0d40;
		font-size: 27px;
		font-weight: 700;
		text-align: justify;
	}

	.paragraph{
		color :black;
		font-size: 17px;
		font-weight: 500;
		text-align: justify;
	}

	.padding-sponsor{
		padding-right: 22rem;
		padding-left: 22rem;
		padding-top: 5rem;
		padding-bottom: 3rem;
	}

	.title-sponsorship-overview{
		color :white;
		font-size: 27px;
		font-weight: 700;
		text-align: center;
	}

	.paragraph-sponsorship-overview{
		color :white;
		font-size: 18px;
		font-weight: 700;
		text-align: justify;
	}

	.paragraph-convention-overview{
		color :white;
		font-size: 16px;
		font-weight: 500;
		text-align: justify;
	}

	.discover-button {
		background: #0C2BA8;
		background: linear-gradient(90deg,rgba(12, 43, 168, 1) 0%, rgba(108, 170, 212, 1) 50%, rgba(212, 206, 146, 1) 100%);
		color: white; /* Text color */
		padding: 10px 20px;
		border: none;
		cursor: pointer;
		font-size: 18px;
		font-weight: 800;
		text-align: center;
		text-decoration: none;
		display: inline-block;
		border-radius: 20px; /* Rounds all corners by 8 pixels */
	}

	.box-available{
		position: relative;
		float: left;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

	.sponsor-available{
		color :#080063;
		font-size: 25px;
		font-weight: 700;
		text-align: justify;
		padding-left: 1rem;
		padding-right: 3rem;
	}

	.headtext{
		color :#3b6087;
		font-size: 18px;
		font-weight: 700;
		text-align: justify;
	}

	.text{
		color :black;
		font-size: 14px;
		font-weight: 500;
		text-align: justify;
		padding-left: 10px;
	}

	.white-btn {
		background: linear-gradient(90deg, #0047ab, #3fa9f5, #f2e68c);
		position: absolute;
		top: 180px;
		left: 50px;
		padding: 10px 20px;
		background-color: white;
		color: black;
		padding: 12px 32px;
		border: none;
		border-radius: 50px;
		font-weight: 600;
	}

	.white-btn:hover {
		transform: translateY(-3px);
		box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
		color: white;
	}

	.white-btn:focus {
		outline: none;
		box-shadow: 0 0 0 4px rgba(63, 169, 245, 0.3);
	}

	.button-schedule {
		color :black;
		font-weight: 500;
		font-size: 1rem;
	}

	.aspect-ratio-box {
		width: 70%;
		aspect-ratio: 8 / 10; /* Sets a 8:10 aspect ratio */
		border: 2px solid #555;
		margin: 20px auto;
		border-radius: 10px;
		/* For top content inside the box */
		display: flex;
		flex-direction: column; /* Stacks children vertically */
		align-items: flex-start; /* Aligns content to the top */
		justify-content: flex-start;
	}

	.aspect-ratio-box .content {
		padding: 1rem;
	}

	.aspect-ratio-box-plenary {
		width: 70%;
		aspect-ratio: 10 / 4; /* Sets a 10:6 aspect ratio */
		background-color: #0049f5;
		/* border: 2px solid #555; */
		margin: 20px auto;
		border-radius: 10px;
		/* For top content inside the box */
		display: flex;
		flex-direction: column; /* Stacks children vertically */
		align-items: flex-start; /* Aligns content to the top */
		justify-content: flex-start;
	}

	.aspect-ratio-box-plenary-grey {
		width: 70%;
		aspect-ratio: 10 / 4; /* Sets a 10:6 aspect ratio */
		background-color: #d9d9d9;
		/* border: 2px solid #555; */
		margin: 20px auto;
		border-radius: 10px;
		/* For top content inside the box */
		display: flex;
		flex-direction: column; /* Stacks children vertically */
		align-items: flex-start; /* Aligns content to the top */
		justify-content: flex-start;
	}

	.aspect-ratio-box-plenary .content {
		padding: 1rem;
		color: white;
	}

	.aspect-ratio-box-plenary-grey .content {
		padding: 1rem;
		color: black;
	}

	.topics {
		font-weight: 700;
		font-size: 19px;
	}

	.paragraph-topics {
		font-weight: 400;
		font-size: 16px;
	}
}

@media screen and (max-width: 450px) {
	.background-image {
		background-image: url('/image/video_clean.png'); /* Adjust path as needed */
		background-size: cover; /* Scales the image to cover the entire element */
		background-repeat: no-repeat; /* Prevents the image from repeating */
		background-position: center center; /* Centers the image horizontally and vertically */
		height: 62vh; /* Ensures the body covers the full viewport height */
		/*width: 92vw;*/ /* Ensures the body covers the full viewport width */
		margin: 0; /* Removes default body margin */
	}

	.background-sponsorship {
		background-image: url('/image/sponsorship_overview_clean.png'); /* Adjust path as needed */
		background-size: cover; /* Scales the image to cover the entire element */
		background-repeat: no-repeat; /* Prevents the image from repeating */
		background-position: center center; /* Centers the image horizontally and vertically */
		/*height: 100vh;*/ /* Ensures the body covers the full viewport height */
		width: 100%;  /*Ensures the body covers the full viewport width*/
		margin: 0; /* Removes default body margin */
	}

	.title{
		color: #0d0d40;
		font-size: 14px;
		font-weight: 700;
		text-align: justify;
	}

	.paragraph{
		color :black;
		font-size: 12px;
		font-weight: 700;
		text-align: justify;
	}

	.padding-sponsor{
		padding-right: 3rem;
		padding-left: 3rem;
		padding-top: 1rem;
		padding-bottom: 1rem;
	}

	.title-sponsorship-overview{
		color :white;
		font-size: 16px;
		font-weight: 700;
		text-align: center;
	}

	.paragraph-sponsorship-overview{
		color :#131c7d;
		font-size: 13px;
		font-weight: 700;
		text-align: justify;
	}

	.discover-button {
		background: #0C2BA8;
		background: linear-gradient(90deg,rgba(12, 43, 168, 1) 0%, rgba(108, 170, 212, 1) 50%, rgba(212, 206, 146, 1) 100%);
		color: white; /* Text color */
		padding: 10px 20px;
		border: none;
		cursor: pointer;
		font-size: 13px;
		font-weight: 800;
		text-align: center;
		text-decoration: none;
		display: inline-block;
		border-radius: 20px; /* Rounds all corners by 8 pixels */
	}

	.sponsor-available{
		color :#080063;
		font-size: 12px;
		font-weight: 600;
		text-align: justify;
		display: inline-block;
		padding-bottom: 1rem;
	}

	.headtext{
		color :#3b6087;
		font-size: 13px;
		font-weight: 700;
		text-align: justify;
	}

	.text{
		color :black;
		font-size: 12px;
		font-weight: 500;
		text-align: justify;
		padding-left: 10px;
	}

	.white-btn {
		position: absolute;
		top: 180px;
		left: 50px;
		padding: 10px 20px;
		background-color: white;
		color: black;
		padding: 12px 32px;
		border: none;
		border-radius: 50px;
		font-weight: 600;
	}

	.button-schedule {
		color :black;
		font-weight: 500;
		font-size: 1rem;
	}

	.button-schedule {
		color :black;
		font-weight: 500;
		font-size: 1rem;
	}

	.aspect-ratio-box {
		width: 70%;
		aspect-ratio: 8 / 10; /* Sets a 8:10 aspect ratio */
		border: 2px solid #555;
		margin: 20px auto;
		border-radius: 10px;
		/* For top content inside the box */
		display: flex;
		flex-direction: column; /* Stacks children vertically */
		align-items: flex-start; /* Aligns content to the top */
		justify-content: flex-start;
	}

	.aspect-ratio-box .content {
		padding: 1rem;
	}

	.topics {
		font-weight: 700;
	}

}

.my-button {
	background-color: #0d6dfc;
	padding: 10px 20px;
	border: none;
	cursor: pointer;
	border-radius: 10px;
	font-weight: 700;
}

.required-indicator {
	color: red; /* Or any other distinct color */
}

input.form-control {
	background-color: #F2F2F2; /* Or any other shade of grey like #CCCCCC, #E0E0E0, etc. */
}

textarea.form-control {
	background-color: #F2F2F2; /* Or any other shade of grey like #CCCCCC, #E0E0E0, etc. */
}
