@charset "utf-8";
/* CSS Document */

/******************************

[Table of Contents]

1. Fonts
2. Body and some general stuff
3. Header
	3.1 Logo
	3.2 Main Nav
	3.3 Header Side
	3.4 Hamburger
4. Menu
	4.1 Menu Social
	4.2 Menu copyright
5. Home
7. Page Section
8. Buttons
9. News
	9.1 Comments
	9.2 Leave Comment
10. Sidebar
11. Footer
	11.1 Newsletter
	11.2 Footer Content
	11.3 Footer Copyright


******************************/

/***********
1. Fonts
***********/

@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800|Roboto:400,500,700');

/*********************************
2. Body and some general stuff
*********************************/

* {
	margin: 0;
	padding: 0;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
	text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
}

body {
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	font-weight: 400;
	background: #FFFFFF;
	color: #a5a5a5;
}

div {
	display: block;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

ul {
	list-style: none;
	margin-bottom: 0px;
}

p {
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	line-height: 2.29;
	font-weight: 400;
	color: #a5a5a5;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
	text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
}

p a {
	display: inline;
	position: relative;
	color: inherit;
	border-bottom: solid 1px #ffa07f;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}

a,
a:hover,
a:visited,
a:active,
a:link {
	text-decoration: none;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
	text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
}

p a:active {
	position: relative;
	color: #FF6347;
}

p a:hover {
	color: #FFFFFF;
	background: #ffa07f;
}

p a:hover::after {
	opacity: 0.2;
}

::selection {
	background: #FFD266;
	color: #C88E00;
}

p::selection {
	background: #FFD266;
	color: #C88E00;
}

h1 {
	font-size: 36px;
}

h2 {
	font-size: 22px;
}

h3 {
	font-size: 18px;
}

h4 {
	font-size: 14px;
}

h5 {
	font-size: 11px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Roboto', sans-serif;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
	text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
}

h1::selection,
h2::selection,
h3::selection,
h4::selection,
h5::selection,
h6::selection {}

::-webkit-input-placeholder {
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
}

:-moz-placeholder

/* older Firefox*/
	{
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
}

::-moz-placeholder

/* Firefox 19+ */
	{
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
}

:-ms-input-placeholder {
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
}

::input-placeholder {
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
}

.form-control {
	color: #db5246;
}

section {
	display: block;
	position: relative;
	box-sizing: border-box;
}

.clear {
	clear: both;
}

.clearfix::before,
.clearfix::after {
	content: "";
	display: table;
}

.clearfix::after {
	clear: both;
}

.clearfix {
	zoom: 1;
}

.float_left {
	float: left;
}

.float_right {
	float: right;
}

.trans_200 {
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}

.trans_300 {
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}

.trans_400 {
	-webkit-transition: all 400ms ease;
	-moz-transition: all 400ms ease;
	-ms-transition: all 400ms ease;
	-o-transition: all 400ms ease;
	transition: all 400ms ease;
}

.trans_500 {
	-webkit-transition: all 500ms ease;
	-moz-transition: all 500ms ease;
	-ms-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
}

.fill_height {
	height: 100%;
}

.super_container {
	width: 100%;
	overflow: hidden;
}

.prlx_parent {
	overflow: hidden;
}

.prlx {
	height: 130% !important;
}

.nopadding {
	padding: 0px !important;
}

/*********************************
3. Header
*********************************/

.header {
	position: fixed;
	top: 45px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 1318px;
	height: 104px;
	background: #FFFFFF;
	z-index: 10;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}

.header.scrolled {
	top: 15px;
}

.header.scrolled .header_content::before {
	box-shadow: 0px 20px 49px rgba(0, 0, 0, 0.17);
}

.header_content {
	width: calc(100% - 279px);
	height: 100%;
}

.header_content::before {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: '';
	box-shadow: 0px 20px 49px rgba(0, 0, 0, 0.67);
	z-index: -1;
}

/*********************************
3.1 Logo
*********************************/

.logo_container {
	display: inline-block;
	padding-left: 20px;
	/* Adjust as needed */
}

.logo {
	display: flex;
	align-items: center;
	/* vertically center logo and text */
}

.logo img {
	width: 60px;
	/* adjust size as needed */
	height: auto;
}

.logo-text {
	display: flex;
	flex-direction: column;
	/* stack Thangam and Career Academy */
	margin-left: 10px;
	/* space between logo and text */
}

.logo-text .main-text {
	font-family: 'Open Sans', sans-serif;
	font-size: 30px;
	font-weight: 900;
	color: #ef2c2c;
	text-transform: uppercase;
}

.logo-text .sub-text {
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	font-weight: 600;
	color: #ef2c2c;
	text-transform: uppercase;
	margin-top: -5px;
	/* optional: reduce gap between lines */
}

/*********************************
3.2 Main Nav
*********************************/

.main_nav_container {
	display: inline-block;
	margin-left: auto;
	padding-right: 93px;
}

.main_nav {
	margin-top: 7px;
}

.main_nav_item {
	display: inline-block;
	margin-right: 40px;
}

.main_nav_item:last-child {
	margin-right: 0px;
}

.main_nav_item a {
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 700;
	color: #3a3a3a;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}

.main_nav_item a:hover {
	color: #ffb606;
}

.main_nav_item.active a {
	color: #ffb606;
	/* same color as hover or any color you want */
}

/*********************************
3.3 Header Side
*********************************/

.header_side {
	width: 279px;
	height: 100%;
	background: #ffb606;
}

.header_side img {
	width: 29px;
	height: 29px;
}

.header_side span {
	display: block;
	position: relative;
	font-size: 18px;
	font-weight: 500;
	color: #FFFFFF;
	padding-left: 12px;
}

/*********************************
3.4 Hamburger
*********************************/

.hamburger_container {
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	right: 20px;
	display: none;
	cursor: pointer;
}

.hamburger_container i {
	font-size: 24px;
	padding: 10px;
	color: #3a3a3a;
}

.hamburger_container:hover i {
	color: #ffb606;
}

/*********************************
4. Menu
*********************************/

.menu_container {
	position: fixed;
	top: 0;
	right: -50vw;
	width: 50vw;
	height: 100vh;
	background: #FFFFFF;
	z-index: 12;
	-webkit-transition: all 0.6s ease;
	-moz-transition: all 0.6s ease;
	-ms-transition: all 0.6s ease;
	-o-transition: all 0.6s ease;
	transition: all 0.6s ease;
	visibility: hidden;
	opacity: 0;
}

.menu_container.active {
	visibility: visible;
	opacity: 1;
	right: 0;
}

.menu {
	position: absolute;
	top: 150px;
	left: 0;
	padding-left: 15%;
}

.menu_list {
	-webkit-transform: translateY(3.5rem);
	-moz-transform: translateY(3.5rem);
	-ms-transform: translateY(3.5rem);
	-o-transform: translateY(3.5rem);
	transform: translateY(3.5rem);
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 1000ms 600ms ease;
	opacity: 0;
}

.menu_container.active .menu_list {
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-ms-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

.menu_item {
	margin-bottom: 9px;
}

.menu_item a {
	font-family: 'Open Sans', sans-serif;
	font-size: 36px;
	font-weight: 700;
	color: #3a3a3a;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}

.menu_item a:hover {
	color: #ffb606;
}

.menu_close_container {
	position: absolute;
	top: 86px;
	right: 79px;
	width: 21px;
	height: 21px;
	cursor: pointer;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}

.menu_close {
	top: 9px;
	width: 21px;
	height: 3px;
	background: #3a3a3a;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}

.menu_close::after {
	display: block;
	position: absolute;
	top: -9px;
	left: 9px;
	content: '';
	width: 3px;
	height: 21px;
	background: #3a3a3a;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}

.menu_close_container:hover .menu_close,
.menu_close_container:hover .menu_close::after {
	background: #ffb606;
}

/*********************************
4.1 Menu Social
*********************************/

.menu_social_container {
	margin-top: 100px;
	-webkit-transform: translateY(3.5rem);
	-moz-transform: translateY(3.5rem);
	-ms-transform: translateY(3.5rem);
	-o-transform: translateY(3.5rem);
	transform: translateY(3.5rem);
	-webkit-transition: all 1000ms 1000ms ease;
	-moz-transition: all 1000ms 1000ms ease;
	-ms-transition: all 1000ms 1000ms ease;
	-o-transition: all 1000ms 1000ms ease;
	transition: all 1000ms 1000ms ease;
	opacity: 0;
	padding-left: 4px;
}

.menu_social_item {
	display: inline-block;
	margin-right: 27px;
}

.menu_social_item:last-child {
	margin-right: 0px;
}

.menu_social_item a i {
	color: #3a3a3a;
}

.menu_social_item a i:hover {
	color: #ffb606;
}

.menu_container.active .menu_social_container {
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-ms-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

/*********************************
4.2 Menu copyright
*********************************/

.menu_copyright {
	margin-top: 60px;
	-webkit-transform: translateY(3.5rem);
	-moz-transform: translateY(3.5rem);
	-ms-transform: translateY(3.5rem);
	-o-transform: translateY(3.5rem);
	transform: translateY(3.5rem);
	-webkit-transition: all 1000ms 1200ms ease;
	-moz-transition: all 1000ms 1200ms ease;
	-ms-transition: all 1000ms 1200ms ease;
	-o-transition: all 1000ms 1200ms ease;
	transition: all 1000ms 1200ms ease;
	opacity: 0;
	padding-left: 3px;
}

.menu_container.active .menu_copyright {
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-ms-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

/*********************************
5. Home
*********************************/

.home {
	width: 100%;
	height: 447px;
}

.home_background_container {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.home_background {
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}

.home_content {
	position: absolute;
	left: 50%;
	bottom: 109px;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	background: #ffb606;
	padding-top: 24px;
	padding-bottom: 18px;
	padding-left: 39px;
	padding-right: 42px;
}

.home_content h1 {
	font-size: 72px;
	font-weight: 400;
	color: #FFFFFF;
	line-height: 0.5;
	white-space: nowrap;
}

/*********************************
7. Page Section
*********************************/

.page_section {
	padding-top: 117px;
	padding-bottom: 117px;
}



.section_title h1 {
	display: block;
	color: #1a1a1a;
	font-weight: 500;
	padding-top: 24px;
	margin-top: -42px;
}

.section_title h1::before {
	display: block;
	position: absolute;
	top: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 55px;
	height: 4px;
	content: '';
	background: #ffb606;
}

/*********************************
8. Buttons
*********************************/

.button {
	cursor: pointer;
}

.button:hover {
	box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2);
}

.button a {
	font-size: 14px;
	line-height: 48px;
	font-weight: 700;
	text-transform: uppercase;
}

.button_1 {
	width: 202px;
	height: 48px;
}

/*********************************
9. Contact
*********************************/

.contact {
	padding-top: 106px;
	padding-bottom: 117px;
}

.contact_title {
	font-size: 36px;
	font-weight: 500;
	color: #1a1a1a;
}

.contact_form_container {
	margin-top: 70px;
}

.input_field {
	width: 100%;
	background: #f8f4f4;
	border: solid 2px transparent;
	margin-bottom: 24px;
	height: 42px;
	padding-left: 33px;
}

.input_field:focus {
	outline: none !important;
	border-color: #ffb606;
}

.text_field {
	width: 100%;
	height: 189px;
	background: #f8f4f4;
	border: solid 2px transparent;
	padding-left: 33px;
	margin-bottom: 24px;
}

.text_field:focus {
	outline: none !important;
	border-color: #ffb606;
}

.contact_send_btn {
	width: 100%;
	height: 48px;
	background: #ffb606;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	color: #FFFFFF;
	cursor: pointer;
	border: none;
}

.contact_send_btn:focus {
	outline: solid 1px #ffb606;
	border: green !important;
}

/*********************************
10. About
*********************************/

.about_title {
	font-size: 36px;
	font-weight: 500;
	color: #1a1a1a;
}

.about_text {
	margin-top: 20px;
}

.contact_info {
	margin-top: 64px;
	padding-left: 46px;
}

.contact_info_item {
	font-size: 14px;
	font-weight: 400;
	color: #a5a5a5;
	margin-bottom: 22px;

}

.contact_info_item:last-child {
	margin-bottom: 0px;
}

.contact_info_icon {
	display: inline-block;
	width: 24px;
	height: 24px;
	vertical-align: middle;
	margin-right: 10px;
}

.contact_info_icon img {
	width: 100%;
}

/*********************************
11. Google Map
*********************************/

#google_map {
	width: 100%;
	height: 532px;
	margin-top: 117px;
}

.map_container {
	width: 100%;
	height: 100%;
	overflow: hidden;
}

#map {
	width: 100%;
	height: calc(100% + 30px);
}


/*********************************
12. Footer
*********************************/

.footer {
	width: 100%;
	padding-top: 86px;
	background: #1a1a1a;
}

.footer .section_title h1 {
	color: #FFFFFF;
	
}

/*********************************
12.1 Newsletter
*********************************/

.newsletter {
	padding-bottom: 85px;
	border-bottom: solid 2px #4d4e4e;
}

.newsletter_form_container {
	width: 60%;
	margin-top: 48px;
}

.newsletter_email {
	width: calc(100% - 164px);
	height: 42px;
	border: none;
	padding-left: 27px;
	font-weight: 500;
	color: #1a1a1a;
}

.newsletter_email:focus {
	outline: solid 2px #ffb606;
}

.newsletter_submit_btn {
	width: 164px;
	height: 42px;
	border: none;
	background: #ffb606;
	color: #FFFFFF;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
}

.newsletter_submit_btn:focus {
	border: solid 2px #FFFFFF;
}

/*********************************
12.2 Footer Content
*********************************/

.footer_content {
	padding-top: 50px;
	padding-bottom: 83px;
	border-bottom: solid 2px #4d4e4e;
}

.footer_content .logo_container {
	padding-left: 0px;
}

.footer_content .logo span {
	color: #FFFFFF;
}

.footer_about_text {
	margin-top: 24px;
	margin-bottom: 0px;
	padding-right: 20px;
}

.footer_column_title {
	font-size: 18px;
	font-weight: 500;
	color: #FFFFFF;
	padding-top: 15px;
}

.footer_column_content {
	margin-top: 32px;
}

.footer_list_item {
	margin-bottom: 11px;
}

.footer_list_item a {
	font-size: 14px;
	color: #a5a5a5;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}

.footer_list_item a:hover {
	color: #ffb606;
}

.footer_contact_item {
	font-size: 14px;
	font-weight: 400;
	color: #333;
	margin-bottom: 22px;
}

.footer_contact_item:last-child {
	margin-bottom: 0px;
}

.footer_contact_icon {
	display: inline-block;
	width: 24px;
	height: 24px;
	vertical-align: middle;
	margin-right: 10px;
}

.footer_contact_icon img {
	width: 100%;
}

/*********************************
12.3 Footer Copyright
*********************************/

.footer_bar {
	padding-top: 19px;
	padding-bottom: 19px;
}

.footer_social .menu_social_item a i {
	color: #FFFFFF;
}

.footer_social .menu_social_item a i:hover {
	color: #ffb606;
}

.footer_social .menu_social_item:last-child {
	margin-right: 0px;
}

/* ===== Body & Global ===== */
body {
	font-family: Arial, sans-serif;
	background: #fff;
	margin: 0;
	padding: 0;
	color: #222;
}

.contact-section {
	width: 90%;
	max-width: 1100px;
	margin: auto;
	padding: 50px 0;
}

.sub-title {
	text-align: center;
	font-size: 18px;
	letter-spacing: 1px;
	color: #444;
}

.main-title {
	text-align: center;
	font-size: 32px;
	margin: 10px 0;
}

.desc {
	text-align: center;
	max-width: 650px;
	margin: auto;
	color: #666;
}

/* ===== Contact Information ===== */
.contact-info {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 15px;
	margin-top: 40px;
}

.info-item {
	flex: 1 1 30%;
	/* Grow, shrink, basis */
	display: flex;
	gap: 15px;
	font-size: 15px;
	color: #ffb606;
	min-width: 250px;
	/* prevent too small */
}

.info-item i {
	font-size: 24px;
	color: #ffb606;
}

.phone-text a,
.email-text a {
	color: #444;
	text-decoration: none;
}
.info-item p{
	color: #333;
}

/* ===== Responsive Media Queries ===== */

/* Tablets (768px - 1024px) */
@media (max-width: 1024px) {
	.info-item {
		flex: 1 1 45%;
	}
}

/* Small tablets / large phones (600px - 767px) */
@media (max-width: 767px) {
	.info-item {
		flex: 1 1 100%;
	}

	.main-title {
		font-size: 28px;
	}

	.sub-title {
		font-size: 16px;
	}

	.desc {
		font-size: 14px;
	}
}

/* Mobile devices (<600px) */
@media (max-width: 600px) {
	.contact-section {
		padding: 30px 15px;
	}

	.main-title {
		font-size: 24px;
	}

	.desc {
		font-size: 13px;
	}

	.info-item i {
		font-size: 20px;
	}
}

/* ===== Quick Inquiry Section ===== */
.quick-title {
	margin-top: 50px;
	font-size: 26px;
}

.quick-desc {
	color: #333;
	margin-bottom: 25px;
}

/* ===== Form & Map Container ===== */
.form-map-box {
	display: flex;
	gap: 25px;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: center;
	/* center on smaller screens */
}

.form-box {
	flex: 1 1 400px;
	max-width: 600px;
	/* prevent too wide on large screens */
}

.map-box {
	flex: 1 1 400px;
	height: 400px;
	border-radius: 8px;
	overflow: hidden;
	margin-top: 0;
	max-width: 600px;
}

.map-box iframe {
	width: 100%;
	height: 100%;
	border: 0;
}

/* ===== Form Styling ===== */
form input,
form textarea {
	width: 100%;
	padding: 12px;
	margin-bottom: 10px;
	border-radius: 5px;
	border: 1px solid #ccc;
	box-sizing: border-box;
	font-size: 15px;
	margin-bottom:  30px;
}

form button {
	width: 100%;
	padding: 12px 0;
	background-color: #ff6d18;
	color: #fff;
	border: none;
	border-radius: 5px;
	cursor: pointer;
	font-size: 16px;
	text-align: center;
	transition: 0.3s;
}

form button:hover {
	background-color: #e55a00;
}

/* ===== Support Section ===== */
.support-title {
	margin-top: 50px;
	font-size: 26px;
}

.support-list {
	list-style: none;
	padding: 0;
	margin-top: 20px;
}

.support-list li {
	margin: 12px 0;
	font-size: 16px;
	display: flex;
	align-items: center;
	gap: 10px;
}

.support-list i {
	color: #007b2e;
}

/* ===== Footer ===== */
.footer_contact_item a,
.footer_copyright span {
	color: #beb5b5;
	text-decoration: none;
}

/* ===== Responsive Adjustments ===== */

/* Laptops 1024px+ and desktops 1440px+ */
@media (min-width: 1024px) {
	.form-map-box {
		flex-direction: row;
		justify-content: space-between;
	}

	.form-box,
	.map-box {
		max-width: 48%;
		margin-top: 0;
	}
}

/* Tablets 768px–1023px */
@media (max-width: 1023px) and (min-width: 768px) {
	.form-map-box {
		flex-direction: column;
		align-items: center;
	}

	.form-box,
	.map-box {
		max-width: 600px;
		width: 100%;
	}

	form button {
		width: 100%;
	}

	.map-box {
		margin-top: 20px;
		height: 350px;
	}
}

/* Mobile <768px */
@media (max-width: 767px) {
	.form-map-box {
		flex-direction: column;
		align-items: center;
	}

	.form-box,
	.map-box {
		width: 100%;
		max-width: 100%;
	}

	.map-box {
		margin-top: 20px;
		height: 300px;
	}

	.quick-title {
		font-size: 22px;
		text-align: center;
	}

	.quick-desc {
		font-size: 14px;
		text-align: center;
	}

	form input,
	form textarea,
	form button {
		font-size: 14px;
	}
}

@media (max-width: 480px) {
	.contact-section {
		padding: 30px 15px;
	}
}



input.error,
textarea.error {
	border: 1px solid red;
}

.row-flex input.error {
	display: block !important;
	width: 100% !important;
}

input.error,
textarea.error {
	display: block !important;
}

.row-flex input {
	display: block;
}

.row-flex .error-message {
	width: 100%;
	display: block;
	margin-left: 0;
}


.footer_contact_item {
    color: #c0bcbc !important; /* Or any dark color like #222 */
}

.newsletter_form input {
    margin-bottom: 0 !important;
}

.newsletter {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
}

.newsletter_form input,
.newsletter_submit_btn {
    border-radius: 0 !important;   /* remove rounded corners */
    margin-top: 0 !important;      /* keeps vertical alignment */

}
/* FIX NEWSLETTER INPUT & BUTTON IN MOBILE */
@media (max-width: 480px) {

    .newsletter_form {
        display: block !important;
        width: 100% !important;
        text-align: center !important;   /* Center child elements */
    }

    .newsletter_form input {
        width: 100% !important;
        border-radius: 0 !important;
        margin: 0 0 10px 0 !important;
        height: 45px !important;
    }

    .newsletter_submit_btn {
        width: 40% !important;
        border-radius: 0 !important;
        height: 45px !important;
        display: block !important;
        margin: 0 auto !important;      /* Centers the button */
    }

    .newsletter {
        margin-top: 30px !important;
        margin-bottom: 30px !important;
    }
}

/* Extra small screens: 320px */
@media (max-width: 360px) {
    .newsletter_form input,
    .newsletter_submit_btn {
        height: 42px !important;
    }
}

/* Make logo image responsive */
.logo img {
    width: 100%;
    max-width: 60px;    /* control size – adjust as needed */
    height: auto;
}

/* Make logo text wrap properly */
.logo-text {
    display: flex;
    flex-direction: column;
    margin-left: 8px;
}

/* Mobile screens */
@media (max-width: 480px) {
    .logo img {
        max-width: 45px !important;   /* smaller logo on mobile */
    }

    .main-text {
        font-size: 18px !important;
    }

    .sub-text {
        font-size: 12px !important;
    }
}

/* Very small screens (320px) */
@media (max-width: 360px) {
    .logo img {
        max-width: 40px !important;
    }
}
/* MOBILE & TABLET INPUT FIX */
@media (max-width: 991px) {

    .row-flex {
        display: block !important;
        width: 100% !important;
    }

    .row-flex input {
        width: 100% !important;
        margin-bottom: 10px !important;
        display: block !important;
    }

    .form-box input,
    .form-box textarea {
        width: 100% !important;
        margin-bottom: 15px !important;
		
    }

    /* Error message style */
    .error-message {
        font-size: 13px;
        color: #e40000;
        padding-top: 12px;
        margin-bottom: 5px;
        display: block;
    }

    /* Auto spacing for entire form */
    .form-box {
        padding: 10px !important;
    }
}

/* SMALL MOBILE (max 480px) */
@media (max-width: 480px) {
    .form-box {
        padding: 5px !important;
    }

    input, textarea {
        font-size: 15px !important;
    }
}

/* Extra small (320px) */
@media (max-width: 360px) {
    input, textarea {
        font-size: 14px !important;
    }
}



.row-flex {
    display: flex;
    gap: 20px; /* space between fields */
    flex-wrap: wrap; /* responsive: wrap on smaller screens */
}

.input-group {
    display: flex;
    flex-direction: column;
    flex: 1; /* both fields take equal width */
    min-width: 200px; /* ensure they don't get too small */
	
}

.input-group input,
.input-group textarea {
    /* padding: 10px; */
    font-size: 16px;
    border: 1px solid #ccc;
    border-radius: 5px;
	margin-bottom: 40px;
}

.error-message {
    color: red;
    font-size: 13px;
    margin-top: -10px;
	bottom: 16px;
    
}

/* ==============================
   Active Menu Item - Orange
================================= */
/* Desktop menu */
.main_nav_list li.active a {
    color: orange;       /* Active color */
    font-weight: bold;
}

/* Mobile menu */
.menu_list li.active a {
    color: orange;       /* Active color */
    font-weight: bold;
}
.footer_social a {
  pointer-events: none;
  cursor: default;
}
.footer_list_item {
    color: #bbb0b0;     /* make text visible */
    font-size: 16px; 
    line-height: 28px;
    margin-bottom: 8px;
    list-style: none;   /* optional – remove dot */
}
.popup {
    position: fixed;
    top: 20px;
    right: 20px;
    padding: 12px 18px;
    border-radius: 6px;
    color: #fff;
    opacity: 0;
    transform: translateY(-10px);
    transition: 0.3s;
    z-index: 99999;
}

.popup.show {
    opacity: 1;
    transform: translateY(0);
}

.popup.success {
    background: #28a745; /* GREEN */
}

.popup.error {
    background: #dc3545; /* RED */
}

/* ===== Newsletter email error BELOW input (final fix) ===== */

.newsletter_form {
    flex-wrap: wrap;            /* allow new line */
    align-items: flex-start;    /* top align */
}

.newsletter_email {
    flex: 1 1 calc(100% - 164px); /* keep space for button */
}

#emailError {
    width: 100%;                /* take full row */
    order: 3;                   /* force below input & button */
    font-size: 13px;
    color: #dc3545;
    margin-top: 6px;
    text-align: left;
}
.newsletter_email.error {
    outline: 2px solid #dc3545;
}
/* --- */
.footer_contact_item {
  display: flex;
  align-items: flex-start;   /* aligns text from top */
  

  font-size: 14px;
  font-weight: 400;
  color: #a5a5a5;
  margin-bottom: 22px;
}

.footer_contact_item a {
  color: #a5a5a5;
  text-decoration: none;
}
.footer_contact_icon img {
  width: 26px;
  height: 26px;
}
.footer_contact_item a + a {
  margin-left: 2px;
}