@charset "UTF-8";

@
-webkit-viewport {
	width: device-width;
}

@
-moz-viewport {
	width: device-width;
}

@
-ms-viewport {
	width: device-width;
}

@
-o-viewport {
	width: device-width;
}

@
viewport {
	width: device-width;
}

.navbar {
	display: flex;
	height: 60px;
	width: auto;
	justify-content: space-between;
	align-items: center;
	padding: 15px 30px;
	background-color: white;
	color: white;
}

.navbar .logo {
    cursor: pointer;
}

.navbar .logo img {
	width: 15.625rem;
	margin-top: 15px;
	height: auto; /* Set the logo size */
	
}


.navbar .button .M-button {
	height: 40px;
	width: 40px;
	display: block;
	position: absolute;
	right: 10px;
	bottom: 0;
	border: 0;
}

.navbar .button {
	height: 40px;
	width: 40px;
	position: relative;
	background: hidden;
	border: none;
	cursor: pointer;
	left: 35vw;
	z-index: 10;
}

.navbar .button:hover {
	opacity: 0.8;
}

.dropdown {
	background-color: white;
	color: black;
	width: auto;
}

.dropdown .dropdown-menu {
	display: none;
	position: absolute;
	top: 50px;
	align-items: center;
	justify-content: center;
	background-color: white;
	border-radius: 20px;
	padding: 10px;
	width: auto;
	height: auto;
	/* right: 4.5vw; */
	list-style: none;
	text-align: left;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
}

.dropdown .dropdown-menu a {
	color: black;
	font-weight:bold;
	text-decoration: none;
	align-items: center;
	justify-content: center;
}

@media ( max-width : 768px) {
	.navbar {
		flex-direction: column;
		align-items: flex-start;
		padding: 10px 15px;
	}
	.navbar .button .M-button {
		right:10px;
	}
	.navbar .logo img {
		width: 15rem; 
		height: auto;
		right: auto;
		margin: 10px 0 0 15px;
	}
	.navbar .button {
		position: absolute;
		top: 3.5vh;
		right: 25px;
		left: 87vw; 
		
	}
}

/*--------------------------------------------------------------------------
                  footer
   --------------------------------------------------------------------------*/
.site-footer {
	background-color: white;
	padding: 5px;
	height: 90px;
}

.f-container {
	display: flex;
	position: relative;
	flex-direction: column;
	justify-content: center;
}


.foot-nav {
	display: flex;
	justify-content: flex-start;
	gap: 20px;
	position: absolute;
	top: 10px;
	left: 20px;
	font-size: 22px;
}

.foot-nav a {
	color: #333;
	text-decoration: none;
	font-weight: bold;
}

.foot-nav .faq:before, .ct:before {
	content: "\2022";
	color: #EB8320;
	margin-right: 10px;
	font-size: 22px;
}

.foot-nav a:hover, .foot-nav a:focus {
	color: #5c666f;
}


.copyright {
	display: flex;
	position: absolute;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 15px;
	left: 20px;
	font-size: 17px;
	margin-top: 45px;
}

.copy {
	color: black;
}

.copy:hover, .copy:focus {
	color: #5c666f;
}

.copyright a {
	color: black;
	text-decoration: none;
	font-size: 17px;
	margin-bottom: 18px;
}

.copyright a:hover, .copyright a:focus {
	color: #5c666f;
}

.links {
	display: flex;
	gap: 20px;
}

.copyright .links a:before {
	content: "|";
	margin-right: 8px;
	color: black;
}

/* Logos on the Right */
.footer-logo {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	justify-content: right-end;
	margin-top: 8px;
}

.footer-logo a {
	display: inline-block;
}

.footer-logo a.Newlogo-ctia {
	width: 12S0px;
	height: auto;
}

.footer-logo a.Newlogo-gsma {
	margin-bottom: 20px;
	width: 200px;
	height: auto;
	padding-left: 15px;
	border-left: 1px solid black;
}

@media ( max-width : 768px) {
	.f-container {
		flex-direction: column;
		align-items: center; 
		padding: 0 35px 0 0;
	}

	.footer-logo {
		justify-content: center;
		margin-top: 20px;
		gap: 10px; 
		width: 100%; 
	}

	.foot-nav {
		position: relative;
		justify-content: center;
		font-size: 18px;
		gap: 15px;
	}

	/* Center copyright links and adjust font size */
	.copyright {
		position: relative;
		justify-content: center;
		font-size: 15px;
		margin-top: 15px;
		gap: 10px;
		text-align: center;
	}
	.copyright a {
		font-size: 15px;
		margin-bottom: 10px;
	}
	.copyright .links a {
		font-size: 14px;
	}

	.footer-logo a.Newlogo-ctia, .footer-logo a.Newlogo-gsma {
		width: 120px; 
	}

	.footer-logo a.Newlogo-gsma {
		margin-left: 10px;
		padding-left: 20px;
	}

	.foot-nav a, .copyright a {
		font-size: 16px;
		margin-bottom: 10px;
	}

	.foot-nav a:nth-child(2):before, .foot-nav a:nth-child(3):before {
		font-size: 18px;
	}
}