/***************************************************************
*
* BODY
*
****************************************************************/

body {
	display: flex;
	flex-direction: column;
	min-height: 100vh; /* Full height of the viewport */
}

main {
	flex: 1; /* Take up the available space */
}

/***************************************************************
*
* NAVIGATION
*
****************************************************************/

nav
{
	background-color: #000000;
}

nav a:hover
{
	color: #ffcc00 !important;
}

/***************************************************************
*
* TYPOGRAPHY
*
****************************************************************/

h1 {
	font-family: 'Poppins', sans-serif;
	font-size: 3.2em;
}

body {
	font-family: 'Poppins', sans-serif;
}

p
{
	color: #676767;
}

.heading
{
	color: #000000;
}

/***************************************************************
*
* HOME PANEL
*
****************************************************************/

#homePanel {
	color: #ffffff;
	background-color: #16101b !important;
	background: url("/images/background.webp") no-repeat center center;
	background-size: cover;
	background-position: right;
	min-height: 600px;
}

/***************************************************************
*
* SERVICE LIST
*
****************************************************************/

.service-list
{
	font-size: 2.2rem;
}

@media(max-width: 768px)
{
	.service-list
	{
		font-size: 1.4rem;
	}
}

/***************************************************************
*
* ICONS
*
****************************************************************/

.social i
{
	font-size:1.4em;

}

.social a i {
  color: #ffffff; /* default */
  transition: color 0.3s ease;
}

.social a:last-child
{
	margin-right: 0;
}

.social a:hover i {
  color: #fc4d77 !important; /* yellow/orange on hover */
}

/***************************************************************
*
* FORMS
*
****************************************************************/

/* Apply styles to all input, textarea, and select elements in forms */
form .form-control
{
	background-color: #f5f5f5; /* Light grey background */
	border: 2px solid #f5f5f5; /* No border */
	padding: 0.75rem 1rem; /* Larger padding */
	font-size: 1.1rem; /* Slightly larger font size */
	border-radius: 0.25rem; /* Optional: Rounded corners */
}

/* Remove focus box-shadow and slightly darker background when focused */
form .form-control:focus
{
	box-shadow: none; /* Remove focus shadow */
	background-color: #f5f5f5; /* Light grey background */
	border: 2px solid #000000; /* No border */
}

/***************************************************************
*
* BUTTONS
*
****************************************************************/

.btn-primary {
	background-color: #16101b;
    border: 1px solid #16101b;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
 	background-color: #2040ae !important;
	border-color: #2040ae !important;
}

/***************************************************************
*
* FOOTER
*
****************************************************************/

.footer
{
	background-color: #16101b;
}

.footer p
{
	color: #ffffff;
	font-size:0.9em;
}

.footer a
{
	color:#ffffff;
	text-decoration: none;
}