body 		
			{
			margin: 0;
			font-family: Arial, sans-serif;
			background-color: #fffdd8;
			color: #2c3e50;
			}
			header {
			background-color: #2c3e50;
			color: white;
			font-size: 1.1rem;
			padding: .7rem 2rem;
			display: flex;
			justify-content: space-between;
			align-items: center;
			position: sticky;
			top: 0;
			z-index: 1000;
			}
			nav a {
			color: white;
			margin: 0 1rem;
			text-decoration: none;
			font-weight: bold;
			font-size: 1.1rem;
			}

			.sharethiscard-btn {
			margin: 2px;
			margin-left: 6px;
			width: 275px;
			height: 32px;
			line-height: 22px;
			background-color: #2c3e50;
			color: white;
			border: 2px solid #888;
			border-radius: 6px;
			cursor: pointer;
			font-weight: bold;
			font-size: 0.95rem;
			text-align: center;
			transition: background-color 0.3s ease, transform 0.2s ease;
			display: block;
			position: relative;
			overflow: hidden;
			}
			button.copied {
			background-color: yellow;
			color: black;
			}
			.sharethiscard-btn:hover {
			background-color: #0ecc04;
			transform: scale(1.02);
			}
			
			.sharethiscard-btn-b {
			margin: 6px;
			margin-left: 6px;
			width: 275px;
			height: 32px;
			line-height: 22px;
			background-color: #2c3e50;
			color: white;
			border: 2px solid #888;
			border-radius: 6px;
			cursor: pointer;
			font-weight: bold;
			font-size: 0.95rem;
			text-align: center;
			transition: background-color 0.3s ease, transform 0.2s ease;
			display: block;
			position: relative;
			overflow: hidden;
			}
			button.copied {
			background-color: yellow;
			color: black;
			}
			.sharethiscard-btn-b:hover {
			background-color: #0ecc04;
			transform: scale(1.02);
			}
			
			.sharethiscard-btn-combo {
			margin: 5px;
			margin-left: 6px;
			width: 275px;
			height: 32px;
			line-height: 22px;
			background-color: #2c3e50;
			color: white;
			border: 2px solid #888;
			border-radius: 6px;
			cursor: pointer;
			font-weight: bold;
			font-size: 0.95rem;
			text-align: center;
			transition: background-color 0.3s ease, transform 0.2s ease;
			display: block;
			position: relative;
			overflow: hidden;
			}
			button.copied {
			background-color: yellow;
			color: black;
			}
			.sharethiscard-btn-combo:hover {
			background-color: #0ecc04;
			transform: scale(1.02);
			}

			.hero {
			margin-top: -1px;
			background-color: #00bbff;
			position: relative;
			width: 100%;
			height: 280px; /* Adjust height as needed */
			overflow: hidden;
			display: flex;
			align-items: center;
			justify-content: center;
			text-align: center;
			color: white;
			}
			.hero-bottom {
			margin-top: -1px;
			background-color: #2c3e50;
			position: relative;
			width: 100%;
			height: 20px; /* Adjust height as needed */
			overflow: hidden;
			display: flex;
			align-items: center;
			justify-content: center;
			text-align: center;
			color: white;
			}

			.hero-video {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			object-fit: cover;
			z-index: 0;
			}

			.video-overlay {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: rgba(219, 219, 219, 0.3); /* Dark overlay, adjust opacity as needed */
			z-index: 1;
			}

			.hero-content {
			margin-top: 0px;
			position: relative;
			z-index: 2;
			padding: 0px;
			}

			.hero h1 {
			font-size: 38px;
			margin-bottom: -6px;
			}
			.hero p {
			font-size: 1.25rem;
			margin-bottom: 2rem;
			}

			.categories {
			background: #1abc9c;
			color: white;
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			gap: 1rem;
			padding: 0px 0px 15px 0px;
			}
			.category-tile {
			background: #1abc9c;
			padding: 1rem 1rem;        /* top right under left  */
			border-radius: 10px;
			box-shadow: 0 2px 5px rgba(0,0,0,0.1);
			cursor: pointer;
			text-align: center;
			transition: background-color 0.3s ease;
			}
			.category-tile:hover {
			background-color: #16a085;
			color: white;
			}

			.community-tile {
			background: #1abc9c;
			padding: 1rem 2rem;
			border-radius: 10px;
			box-shadow: 0 2px 5px rgba(0,0,0,0.1);
			cursor: pointer;
			text-align: center;
			transition: background-color 0.3s ease;
			}
			.community-tile:hover {
			background-color: #16a085;
			color: white;
			}

			.featured-listings {
			margin-top: -65px;	
			padding: 2rem;
			margin-bottom: -60px;
			}
			.featured-listings h2 {
			text-align: center;
			margin-bottom: 1rem;
			}


			.card-content {
			display: flex;
			flex-direction: column;
			height: 100%;
			}

			.card-header {
			text-align: center;
			}

			.card-title {
			margin-top: -2px;
			font-size: 1.0rem;
			color: #333;
			margin-bottom: 0px;
			}

			.card-description {
			margin-top: 4px;
			font-size: 0.9rem;
			color: #666;
			margin-bottom: 2px;
			}

			.card-category {
			margin-top: 2px;
			font-size: 0.9rem;
			color: #444;
			}
			.card-tag {
			margin-top: -14px;
			font-size: 0.9rem;
			color: #444;
			}

			.card-location {
			margin-top: 1px;
			font-size: 0.9rem;
			color: #444;
			}

			.card-buttons {
			display: flex;
			justify-content: center;
			gap: 10px;
			margin-top: 0px;
			}
			.card-status {
			display: flex;
			justify-content: center;
			gap: 10px;
			margin-top: -8px;
			font-size: 10px;
			}

			.callcta-button {
			height: 22px;
			width: 260px;
			margin-top: -8px;
			background-color: #0ecc04;
			color: #fff;
			padding: 8px 15px;
			text-decoration: none;
			border-radius: 5px;
			font-size:16px;
			transition: background-color 0.3s;
			}

			.callcta-button:hover {
			background-color: #45D4FF;
			}

			.textcta-button {
			height: 22px;
			width: 260px;
			margin-top: 5px;
			background-color: #16a085;
			color: #fff;
			padding: 8px 15px;
			text-decoration: none;
			border-radius: 5px;
			font-size: 0.9rem;
			transition: background-color 0.3s;
			}

			.textcta-button:hover {
			background-color: #45D4FF;
			}

			.gmap-button {
			height: 22px;
			width: 260px;
			margin-top: 5px;
			background-color: #1A73E8;
			color: #fff;
			padding: 8px 15px;
			text-decoration: none;
			border-radius: 5px;
			font-size:16px;
			transition: background-color 0.3s;
			}

			.gmap-button:hover {
			background-color: #1A73E8;
			}

			.email-button {
			height: 22px;
			width: 260px;
			margin-top: 5px;
			background-color: #00ADF2;
			color: #fff;
			padding: 8px 15px;
			text-decoration: none;
			border-radius: 5px;
			font-size:16px;
			transition: background-color 0.3s;
			}
			.copy-email-button.copied {
			background-color: yellow;
			color: black;
			font-weight: bold;
			transition: background-color 0.3s ease, color 0.3s ease;
			}

			.email-button:hover {
			background-color: #1A73E8;
			}

			.cta-button {
			height: 22px;
			width: 260px;
			margin-top: 5px;
			background-color: #16a085;
			color: #fff;
			padding: 8px 15px;
			text-decoration: none;
			border-radius: 5px;
			font-size: 1.0rem;
			transition: background-color 0.3s;
			}

			.cta-button:hover {
			background-color: #1abc9c;
			}

			.card-media {
			margin-top: -10px;
			text-align: center;
			}

			.card-video, .card-map {
			width: 85%;
			height: 220px;
			object-fit: cover;
			border-radius: 8px;
			}

			.card-image{
			width: 100%;
			height: 165px;
			object-fit: cover;
			border-radius: 8px;
			margin-bottom: 1px;
			}
			.card-image-video-combo{
			width: 100%;
			height: 165px;
			object-fit: cover;
			border-radius: 8px 8px 0px 0px;
			margin-bottom: 1px;
			}

			.card-map{
			padding-top: 2px;
			margin-top: 4px;
			width: 100%;
			height: 170px;
			object-fit: cover;
			border-radius: 8px;
			}


			.cards-container {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			gap: 20px;
			padding: 20px;
			}

			.slideshow-container {
			width: 100%;
			max-width: 100%;
			height: 165px;
			overflow: hidden;
			border-radius: 8px;
			margin-bottom: 5px;
			box-sizing: border-box;
			}

			.slide-track {
			display: flex;
			animation: scrollSingle 16s linear infinite;
			gap: 0; /* No spacing between images unless needed */
			}

			.slide-track img {
			height: 165px;
			width: auto; /* Auto width for natural scaling */
			max-width: 100%;
			flex-shrink: 0;
			border-radius: 8px;
			display: block;
			box-sizing: border-box;
			}
			
			.slideshow-container-bigger {
			width: 100%;
			max-width: 100%;
			height: 323px;
			overflow: hidden;
			border-radius: 8px;
			margin-bottom: 5px;
			box-sizing: border-box;
			}

			.slide-track-bigger {
			display: flex;
			animation: scrollSingle 16s linear infinite;
			gap: 0; /* No spacing between images unless needed */
			}

			.slide-track-bigger img {
			height: 323px;
			width: auto; /* Auto width for natural scaling */
			max-width: 100%;
			flex-shrink: 0;
			border-radius: 8px;
			display: block;
			box-sizing: border-box;
			}

			.btn {
			width: 390px;
			flex-wrap: wrap;
			justify-content: center;
			gap: 20px;
			padding: 10px;
			}

			/* Each card */
			.card {
			background: #fff;
			border-radius: 10px;
			box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
			width: 100%;
			max-width: 310px;
			height: 775px;
			margin: 10px;
			padding: 15px;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			}

			/* Active category button style */
			.category-tile.active {
			background-color: #007bff; /* Blue background for selected button */
			color: white; /* Text color white */
			}

			footer {
			background: #2c3e50;
			font-size: 14px;
			color: white;
			text-align: center;
			padding: 1rem;
			margin-top: 50px;
			border-bottom: 0px solid black;
			}


			.select-location {
			margin: 2rem auto;
			text-align: center;
			}

			.select-location h2 {
			margin-top: -40px;
			font-size: 2rem;
			margin-bottom: 1rem;
			color: #fff;
			}

			#locationDropdown-home {
			margin-top: -24px;
			padding: 12px 12px;
			font-size: 19px;
			font-weight: bold;
			border: 2px solid #fff;
			border-radius: 8px;
			background-color: #2c3e50;
			color: white;
			width: 500px;
			cursor: pointer;
			transition: background-color 0.3s ease, transform 0.3s ease;
			}

			#locationDropdown-home:hover {
			background-color: #2c3e50;
			transform: scale(1.05);
			}

			#locationDropdown-home:focus {
			outline: none;
			border-color: #888;
			}

			#locationDropdown {
			margin-top: -24px;
			padding: 12px 12px;
			font-size: 19px;
			border: 2px solid #fff;
			border-radius: 8px;
			background-color: #2c3e50;
			color: white;
			width: 500px;
			cursor: pointer;
			transition: background-color 0.3s ease, transform 0.3s ease;
			}

			#locationDropdown:hover {
			background-color: #2c3e50;
			transform: scale(1.05);
			}

			#locationDropdown:focus {
			outline: none;
			border-color: #888;
			}

			.categoryDropdown {
			margin-top: -22px;
			width: 500px;		
			background-color: #2c3e50;
			color: #fff;
			padding: 12px 12px;
			text-decoration: none;
			border-radius: 8px;
			border: 2px solid #fff;
			font-size:19px;
			cursor: pointer;
			transition: background-color 0.3s ease, transform 0.3s ease;
			}

			.categoryDropdown:hover {
			background-color: #2c3e50;
			transform: scale(1.05);
			}

			.search-container {
			margin-top: 10px;
			position: relative;
			width: 100%;
			max-width: 700px;
			margin-left: auto;
			margin-right: auto;
			margin-bottom: 35px;
			}

			.search-wrapper {
			display: flex;
			flex-direction: column;
			align-items: center;
			position: relative;
			}

			.search-container .search-icon {
			position: absolute;
			left: 10px;
			top: 50%;
			transform: translateY(-50%);
			pointer-events: none;
			font-size: 24px;
			color: #888;
			}

			.search-container input[type="text"] {
			width: 100%;
			max-width: 700px;
			padding: 12px 8px 12px 38px; /* left padding for icon */
			font-size: 18px;
			border-radius: 25px;
			border: 3px solid #ccc;
			box-sizing: border-box;
			box-shadow: 0 6px 15px rgba(0,0,0,0.4);
			}

			/* --- Optional tweak for very small screens --- */
			@media (max-width: 400px) {
			.search-container input[type="text"] {
			font-size: 12px;
			padding: 10px 0px 10px 36px;
			margin-left: -20px;
			}
			}


			.filter-button {
			background: #1abc9c;
			font-size: 1.2rem;
			color: #fff;
			padding: 1rem 1rem;        /* top right under left  */
			border-radius: 10px;
			box-shadow: 0 2px 5px rgba(0,0,0,0.1);
			cursor: pointer;
			text-align: center;
			transition: background-color 0.3s ease;
			}

			.filter-button:hover {
			background-color: #16a085;
			}
			.image-wrapper {
			display: flex;
			justify-content: center;
			align-items: center;
			}

			.responsive-image {
			max-width: 60%;
			height: auto;
			border-radius: 8px;
			}

			.fb-button {
			display: block;
			text-align: center;
			background: #FF914D;
			color: #000;
			padding: 10px;
			border-radius: 10px;
			text-decoration: none;
			margin-top: 10px;
			font-weight: bold;
			}

			@keyframes scrollSingle {
			0% {
			transform: translateX(0);
			}
			100% {
			transform: translateX(-1240px); /* 310px * 4 (originals) */
			}
			}

			#categoryFilter {
			padding: 8px 12px;
			border-radius: 6px;
			border: 1px solid #ccc;
			font-size: 16px;
			margin-bottom: 16px;
			max-width: 300px;
			width: 100%;
			}

			#category-list {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
			gap: 12px;
			}

			.category-card {
			background: #f9f9f9;
			border: 1px solid #ddd;
			border-radius: 8px;
			padding: 12px;
			text-align: center;
			transition: all 0.3s ease;
			}


			.sponsor-banner {
			text-align: center;
			}

			.sponsor-banner img {
			max-width: 100%;
			height: auto;
			width: 728px;
			max-height: 90px;
			border-radius: 6px;
			box-shadow: 0 2px 6px rgba(0,0,0,0.15);
			}

			.sponsor-label {
			margin-top: -39px;
			font-size: 22px;
			font-family: Angsana New;
			font-weight: bold;
			color: #2c3e50;
			margin-bottom: 6px;
			text-align: center;
			letter-spacing: 0.5px;
			}

			.sponsor-banner-wrapper {
			text-align: center;
			margin: 10px auto;
			padding: 0 10px;
			margin-bottom: 25px;
			}

			.sponsor-text {
			font-weight: bold;
			font-size: 18px;

			}

			.sponsor-carousel {
			position: relative;
			width: 100%;
			max-width: 728px;
			height: auto;
			border-radius: 6px;
			aspect-ratio: 728 / 90;
			margin: 0 auto;
			overflow: hidden;
			}

			.sponsor-carousel a {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			opacity: 0;
			transition: opacity 1s ease;
			display: flex;
			align-items: center;
			justify-content: center;
			}

			.sponsor-carousel a.active {
			opacity: 1;
			z-index: 2;
			}

			.sponsor-carousel img {
			max-width: 100%;
			height: auto;
			display: block;
			}

			.no-results {
			margin-top: -40px;

			opacity: 0;
			transition: opacity 0.3s ease;
			text-align: center;
			}

			.no-results.show {
			visibility: visible;
			opacity: 1;
			}

			.free-listing {
			border: 1px solid #ccc;
			background-color: #f9f9f9;
			height: 285px;
			}

			.upgraded-listing {
			margin-top: 20px;
			border: 2px solid #1abc9c;
			background-color: #fff;
			box-shadow: 0 4px 12px rgba(0,0,0,0.1);
			}
			.label-upgraded {
			text-align: center;
			background: #1abc9c;
			color: #fff;
			padding: 2px 4px;
			border-radius: 4px;
			font-size: 10px;
			margin-top: 1px;
			}

			.label-free {
			text-align: center;
			background: #999;
			color: #fff;
			padding: 2px 4px;
			border-radius: 4px;
			font-size: 10px;
			margin-top: 13px;
			}

			#topBtn {
			position: fixed;
			bottom: 30px;
			right: 10px;
			background-color: #0866ff;
			color: white;
			border: none;
			padding: 12px 20px;
			font-size: 18px;
			font-weight: bold;
			border-radius: 30px;
			cursor: pointer;
			z-index: 999;
			box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
			transition: opacity 0.3s ease, transform 0.3s ease;
			display: none; /* Hidden by default */
			}
			#topBtn:hover {
			background-color: #004ec4;
			}

			.social-buttons {
			display: flex;
			justify-content: center;
			gap: 9px;
			margin: 20px auto;
			max-width: 288px; /* Approx width of one large button */
			}

			.social {
			margin-top: -15px;
			flex: 1;
			display: flex;
			justify-content: center;
			align-items: center;
			height: 38px;
			width: 88px;
			font-size: 20px;
			border-radius: 8px;
			text-decoration: none;
			color: white;
			transition: filter 0.3s ease;
			margin-bottom: -20px;
			}

			/* Brand Colors */
			.fb { background-color: #3b5998; }     /* Facebook */
			.x  { background-color: #000000; }     /* X (Twitter) */
			.ig { background-color: #C13584; }     /* Instagram */
			.li { background-color: #0077b5; }     /* LinkedIn */

			.social:hover {
			filter: brightness(1.15);
			}

			.email-combo {
			display: flex;
			gap: 10px;
			flex-wrap: wrap;
			}

			.email-copy-button {
			width: 220px;
			margin-top: 5px;
			background-color: #00ADF2;
			color: #fff;
			padding: 8px 15px;
			text-decoration: none;
			border-radius: 5px;
			font-size: 16px;
			transition: background-color 0.3s;
			border: none;
			cursor: pointer;
			}

			.email-copy-button:hover {
			background-color: #1A73E8;
			}

			/* Basic layout */
			.topnav {
			display: flex;
			justify-content: space-between;
			align-items: center;
			background-color: #333;
			padding: 10px 20px;
			color: white;
			}

			.main-nav a {
			color: white;
			text-decoration: none;
			margin: 0 10px;
			display: inline-block;
			}


			@keyframes pulseHighlight {
			0% {
			box-shadow: 0 0 0 0 rgba(8, 102, 255, 0.6);
			}
			50% {
			box-shadow: 0 0 0 15px rgba(8, 102, 255, 0);
			}
			100% {
			box-shadow: 0 0 0 0 rgba(8, 102, 255, 0);
			}
			}

			.card.highlight {
			background-color: #9aff72; /* light green for visual attention */
			transition: background-color 0.5s ease;
			}

			.card.pulse {
			animation: pulseHighlight 1.2s ease-out 5;
			position: relative;
			z-index: 2;
			}


.card.glow-highlight {
background-color: #9aff72; /* light green for visual attention */
			animation: pulseHighlight 1.2s ease-out 5;
			position: relative;
			z-index: 10;
}

@keyframes glow {
  0% { box-shadow: 0 0 0 rgba(255, 223, 0, 0); }
  50% { box-shadow: 0 0 20px 10px rgba(255, 223, 0, 0.8); }
  100% { box-shadow: 0 0 0 rgba(255, 223, 0, 0); }
}



			/* Mobile layout */
			@media (max-width: 768px) {


			.categoryDropdown {
			margin-top: -12px;
			width: 330px;		
			font-size:14px;
			margin-left: -20px;
			}
			.search-container {
			margin-bottom: 11px;
			}
			
			.featured-listings h2 {
			font-size:18px;
			}
			}





			@media (max-width: 600px) {
			.select-location {
			margin-left: -22px; /* Move the box 20px to the left on mobile */
			}
			}





			@media (max-width: 768px) {
			.hero {
			height: 195px; /* Reduce height for mobile */
			padding: 10px 10px;
			}


			.hero-content p {
			font-size: 1rem;
			}
			}




			@media (max-width: 480px) {
			.hero {
			height: 195px;
			}

			.hero-content h1 {
			font-size: 22px;
			margin-bottom: -21px;
			margin-left: -18px;
			}

			.hero-content p {
			font-size: 0.9rem;
			}
			footer {
			font-size: 12px;
			}

			}





			/* Responsive layout */
			@media (min-width: 1400px) {
			.card {
			flex: 0 0 calc(16.66% - 20px); /* 6 cards across */
			}

			}




			@media (max-width: 1399px) and (min-width: 1024px) {
			.card {
			flex: 0 0 calc(25% - 20px); /* 4 cards across for smaller desktops */
			}

			}




			@media (max-width: 1023px) and (min-width: 768px) {
			.card {
			flex: 0 0 calc(50% - 20px); /* 2 cards across for tablets */
			}

			}


select-location

			@media (max-width: 767px) {
			.card {
			flex: 0 0 80%; /* Full width on mobile */
			}
			.btn{
			margin-top: 100px;
			width: 300px;
			min-width: 300px;
			flex-wrap: wrap;
			justify-content: center;
			margin-left: -25px;
			}
			
			.btn-home{
			margin-top: 100px;
			width: 100px;
			min-width: 300px;
			flex-wrap: wrap;
			justify-content: center;
			margin-left: -25px;
			}

			header {
			background-color: #2c3e50;
			color: white;
			font-size: 14px;

			}

			#locationDropdown {
			margin-top: -4px;
			padding: 12px 12px;
			font-size: 14px;
			width: 330px;
			}


			}


			.share-btn {
			padding: 0px 22px 15px 0px;
			background-color: #2c3e50;
			color: white;
			border: none;
			border-radius: 6px;
			cursor: pointer;
			font-weight: bold;
			font-size: 1.1rem;
			}
			.share-btn:hover {
			background-color: #2c3e50;
			}



			.nav-links a {
			font-size: 18px;
			padding: 1px 15px 15px;
			}


			.top-nav {
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 14px 16px 4px;
			background-color: #2c3e50;
			color: white;
			}

			.nav-logo .logo-text {
			margin-top: -10px;
			font-size: 18px;
			font-weight: bold;
			color: white;
			text-decoration: none;
			display: flex;
			}

			.nav-links {
			display: flex;
			gap: 0px;
			}

			.hamburger {
			display: none;
			background: none;
			border: none;
			font-size: 24px;
			color: white;
			cursor: pointer;
			}

			/* Responsive styles */
			@media (max-width: 768px) {
			.nav-links {
			display: none;
			flex-direction: column;
			background-color: #2c3e50;
			position: absolute;
			top: 44px;
			left: 0;
			width: 100%;
			padding: 10px 0;
			}

			.nav-links a {
			padding: 9px 0px;
			border-top: 2px solid #444;
			color: white;
			font-size: 16px;
			text-align: center;
			}

			.hamburger {
			display: block;
			}
			.nav-logo .logo-text {
			font-size: 14px;
			font-weight: bold;
			}
			
			.share-btn {
			width: 90%;
			padding: 0px 0px 15px 0px;
			margin-top: 10px;
			margin-left: 18px;
			font-weight: bold;
			font-size: 16px;
			background-color: #2c3e50;
			}

			}
			
	.highlight-text {
	margin-top: 6px;
    text-align: center;
    font-size: 36px;
    font-weight: bold;
    color: #2c3e50;
  }

  .image-row {
    display: flex;
    justify-content: center;
    gap: 2rem;
    flex-wrap: wrap;
    margin: 20px auto;
    max-width: 1300px;
  }

  .image-box {
    width: 300px;
    height: 300px;
    background-color: #ddd;
    border-radius: 16px;
    box-shadow: 0 6px 15px rgba(0,0,0,0.2);
    overflow: hidden;
    transition: transform 0.3s ease;
  }

  .image-box:hover {
    transform: scale(1.03);
  }

  .image-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 16px;
  }

  .bottom-text {
    text-align: center;
    font-size: 30px;
    margin-top: 1.5rem;
    color: #34495e;
    font-weight: 500;
	margin-top: 0px;
  }
  
  .about-section {
      padding: 40px 20px;
    }
    .about-container {
      max-width: 960px;
      margin: auto;
      background: #fff;
      padding: 30px;
      border-radius: 12px;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    }
    .about-hero {
      text-align: center;
      margin-bottom: 30px;
    }
    .about-image {
      max-width: 100%;
      height: auto;
      border-radius: 8px;
    }
    .about-content h1 {
      font-size: 2.4rem;
      margin-bottom: 10px;
      text-align: center;
    }
    .about-content .intro {
      font-size: 1.2rem;
      margin-bottom: 30px;
      text-align: center;
    }
    .about-block {
      margin-bottom: 30px;
    }
    .about-block h2 {
      font-size: 1.5rem;
      color: #34495e;
      margin-bottom: 10px;
    }
    .about-block p,
    .about-block ul {
      font-size: 1.05rem;
      line-height: 1.7;
    }
    .about-block ul {
      padding-left: 20px;
      list-style: disc;
    }
    .about-footer {
      border-top: 1px solid #ddd;
      padding-top: 20px;
      text-align: center;
      font-size: 1rem;
      color: #7f8c8d;
    }
    @media screen and (max-width: 600px) {
      .about-container {
        padding: 20px;
      }
      .about-content h1 {
        font-size: 2rem;
      }
	  .about-share-block h2 {
      font-size: 1.0rem;
      color: #34495e;
      margin-bottom: 10px;
    }

		.google-form-container {
  width: 60%;
  max-width: 80%;
}

.google-form-container iframe {
  width: 60%;
}


    }
	
	.google-form-container {
  position: relative;
  width: 100%;
  max-width: 100%;
  height: 0;
  padding-bottom: 160%; /* Adjust based on your form's height-to-width ratio */
  overflow: hidden;
}

.google-form-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

	
.rotating-news-bar {
  background-color: #2c3e50;
  color: #fff;
  padding: 12px 0;
  text-align: center;
  font-weight: bold;
  font-size: 1.1rem;
  border-top: 2px solid #444;
  border-bottom: 2px solid #444;
}

.rotating-text {
  animation: fadeInOut 1s ease-in-out;
  transition: opacity 0.5s ease;
}

@keyframes fadeInOut {
  0% { opacity: 0; }
  25% { opacity: 1; }
  75% { opacity: 1; }
  100% { opacity: 0; }
}