@import url("https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,300,200");
body {
  background-color: #475057;
  font-family: 'Yanone Kaffeesatz', sans-serif;;
  color: white;
}

strong {
    font-weight: bold !important;
}


.custom-h1 {
	color: white;
	text-decoration: none;
	font-size: 1.4em;
	margin-left: 5px;
	padding-top: 5px;
	outline: 0;
}


input, textarea, select {
    font-family: 'Yanone Kaffeesatz', sans-serif;
     color: white;;
}



.custom-a {
    color: white;
}
.custom-h2 {
    color: white;
}
.custom-h5{
    color: white;
}


	/* Align input and button properly in the form */
	.input-group .form-control {
		min-height: 40px; /* Ensures input height is consistent */
	}

	/* Logout button styling */
	.text-center .btn-info {
		padding: 10px 20px;
		font-size: 18px;
		border-radius: 5px;
	}



/* Labels */
	.custom-form label {
		color: white; /* Change to your desired color */
	}

/* Help text under the input fields */
	.custom-form .form-text {
		color: white; /* Change to your desired color */
		font-style: italic; /* Optional for differentiation */
	}

/* Error messages (validation feedback) */
	.custom-form .invalid-feedback {
		color: white; /* Red for errors */
		font-weight: bold; /* Optional for emphasis */
	}

/* Inputs (if you want to style them too) */
	.custom-form input {
		border-color: white; /* Optional: Blue border */
		color: #495057; /* Text color inside the input */
	}

	div.a {
	  text-align: center;
	}

	p.a {
	  font: 30px Arial, sans-serif;
	  color: white;
	}

	.btn-green {
	  background-color: #79B51B;
	  color: white;
	  border: none;
	}

	.btn-dkgreen {
	  background-color: #79B51B;
	  color: white;
	  border: none;
	}

	.btn-green:hover {
	  background-color: white;
	  color: black;
	}

	.btn-dkgreen:hover {
	  background-color: white;
	  color: black;
	}

	.bg-custom-green {
	  background-color: #475057 !important;
	}

	.project-tiles-container {
	  display: flex;
	  flex-wrap: wrap;
	  gap: 20px;
	  justify-content: center;
	  padding: 20px;
	  box-sizing: border-box;
	}

	.project-tile-link {
	  display: block;
	  text-decoration: none;
	  width: 100%;
	  height: 100%;
	}

	.project-tile {
	  /*background-color: #313A41;*/
	  background: #313A41 url("images/bg04.jpg");
	  border-radius: 10px;
	  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	  overflow: hidden;
	  position: relative;
	  cursor: pointer;
	  transition: transform 0.3s ease, box-shadow 0.3s ease;
	  display: flex;
	  width: 250px; /* Ensure it takes up full container width */
	  height: 275px; /* Fixed height */
	  box-sizing: border-box;
	}


	.project-tile:hover {
	  transform: translateY(-10px);
	  box-shadow: 0 8px 15px rgba(0, 0, 0, 0.15);
	}

	.tile-image {
	  flex: 0 0 50%; /* Image takes up x% of the height */
	  overflow: hidden;
	}

	.tile-image img {
	  width: 90%; /* Shrinks the image to 90% of the container width */
	  height: 90%; /* Maintains the aspect ratio */
	  object-fit: contain;
	  margin: 0% 5% 5% 5%; /* Adds a margin around the image */
	  display: block; /* Prevents inline spacing issues */
	  border-radius: 10px; /* Adds rounded corners */
}

	.tile-content {
	  flex: 0 0 20%; /* Content takes up x% of the height */
		padding: 10px 5px 1px;
		display: flex;
	  flex-direction: column;
	  justify-content: center;
	  text-align: center;
	  font-family: 'Roboto', sans-serif; /* Apply the font */
	  box-sizing: border-box; /* Ensures padding doesn't affect layout */
	  color: #79B51B;
	}

	.project-description {
		color: white;
		font-size: 14px;
		font-family: 'Roboto', sans-serif;
		margin-bottom: 8px;
		padding-bottom: 0;
		line-height: 1.4; /* Controls spacing */
		height: 2.8em; /* Forces 2 lines (1.4 * 2) */
		overflow: hidden; /* Hides extra text if too long */
		display: -webkit-box;
		-webkit-line-clamp: 2; /* Limits to 2 lines */
		-webkit-box-orient: vertical;
		text-overflow: ellipsis; /* Adds '...' if text is too long */
		white-space: normal;
	}




	.project-tile h3 {
	  font-size: 18px;
	  color: #79B51B;
	  margin-bottom: 5px;
	  text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.75);
	}

	.project-tile:hover h3 {
	  color: white;
	}


/*
	Halcyonic by HTML5 UP
	html5up.net | @ajlkn
	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/

html, body, div, span, applet, object,
iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
pre, a, abbr, acronym, address, big, cite,
code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b,
u, i, center, dl, dt, dd, ol, ul, li, fieldset,
form, label, legend, table, caption, tbody,
tfoot, thead, tr, th, td, article, aside,
canvas, details, embed, figure, figcaption,
footer, header, hgroup, menu, nav, output, ruby,
section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;}


body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

	blockquote:before, blockquote:after, q:before, q:after {
		content: '';
		content: none;
	}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

body {
	-webkit-text-size-adjust: none;
}

mark {
	background-color: transparent;
	color: inherit;
}

input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input, select, textarea {
	-moz-appearance: none;
	-webkit-appearance: none;
	-ms-appearance: none;
	appearance: none;
}

/* Basic */

	html {
		box-sizing: border-box;
	}

	*, *:before, *:after {
		box-sizing: inherit;
	}

	body {
		/*background: #475057 url("images/bg03.jpg");!* Banner *!*/
		color: #474f51;
		font-size: 13.5pt;
		font-family: 'Yanone Kaffeesatz', serif;
		line-height: 1.85em;
		font-weight: 300;
	}

	input, textarea, select {
		color: #252D30;
		font-size: 13.5pt;
		font-family: 'Yanone Kaffeesatz', serif;
		line-height: 1.85em;
		font-weight: 300;
	}

	ul, ol, p, dl {
		margin: 0 0 2em 0;
	}

	a {
		text-decoration: underline;
	}

		a:hover {
			text-decoration: none;
		}

	section > :last-child,
	section:last-child,
	.last-child {
		margin-bottom: 0 !important;
	}

/* Container */

	.container {
		margin: 0 auto;
		max-width: 100%;
		width: 1200px;
	}

		@media screen and (max-width: 1680px) {

			.container {
				width: 1200px;
			}

		}

		@media screen and (max-width: 1280px) {

			.container {
				width: calc(100% - 40px);
			}

		}

		@media screen and (max-width: 980px) {

			.container {
				width: calc(100% - 50px);
			}

		}

		@media screen and (max-width: 736px) {

			.container {
				width: calc(100% - 40px);
			}

		}

/* Row */

	.row {
		display: flex;
		flex-wrap: wrap;
		box-sizing: border-box;
		align-items: stretch;
	}

		.row > * {
			box-sizing: border-box;
		}

		.row.gtr-uniform > * > :last-child {
			margin-bottom: 0;
		}

		.row.aln-left {
			justify-content: flex-start;
		}

		.row.aln-center {
			justify-content: center;
		}

		.row.aln-right {
			justify-content: flex-end;
		}

		.row.aln-top {
			align-items: flex-start;
		}

		.row.aln-middle {
			align-items: center;
		}

		.row.aln-bottom {
			align-items: flex-end;
		}

		.row > .imp {
			order: -1;
		}

		.row > .col-1 {
			width: 8.33333%;
		}

		.row > .off-1 {
			margin-left: 8.33333%;
		}

		.row > .col-2 {
			width: 16.66667%;
		}

		.row > .off-2 {
			margin-left: 16.66667%;
		}

		.row > .col-3 {
			width: 25%;
		}

		.row > .off-3 {
			margin-left: 25%;
		}

		.row > .col-4 {
			width: 33.33333%;
		}

		.row > .off-4 {
			margin-left: 33.33333%;
		}

		.row > .col-5 {
			width: 41.66667%;
		}

		.row > .off-5 {
			margin-left: 41.66667%;
		}

		.row > .col-6 {
			width: 50%;
		}

		.row > .off-6 {
			margin-left: 50%;
		}

		.row > .col-7 {
			width: 58.33333%;
		}

		.row > .off-7 {
			margin-left: 58.33333%;
		}

		.row > .col-8 {
			width: 66.66667%;
		}

		.row > .off-8 {
			margin-left: 66.66667%;
		}

		.row > .col-9 {
			width: 75%;
		}

		.row > .off-9 {
			margin-left: 75%;
		}

		.row > .col-10 {
			width: 83.33333%;
		}

		.row > .off-10 {
			margin-left: 83.33333%;
		}

		.row > .col-11 {
			width: 91.66667%;
		}

		.row > .off-11 {
			margin-left: 91.66667%;
		}

		.row > .col-12 {
			width: 100%;
		}

		.row > .off-12 {
			margin-left: 100%;
		}

		.row.gtr-0 {
			margin-top: 0px;
			margin-left: 0px;
		}

			.row.gtr-0 > * {
				padding: 0px 0 0 0px;
			}

			.row.gtr-0.gtr-uniform {
				margin-top: 0px;
			}

				.row.gtr-0.gtr-uniform > * {
					padding-top: 0px;
				}

		.row.gtr-25 {
			margin-top: -6.25px;
			margin-left: -6.25px;
		}

			.row.gtr-25 > * {
				padding: 6.25px 0 0 6.25px;
			}

			.row.gtr-25.gtr-uniform {
				margin-top: -6.25px;
			}

				.row.gtr-25.gtr-uniform > * {
					padding-top: 6.25px;
				}

		.row.gtr-50 {
			margin-top: -12.5px;
			margin-left: -12.5px;
		}

			.row.gtr-50 > * {
				padding: 12.5px 0 0 12.5px;
			}

			.row.gtr-50.gtr-uniform {
				margin-top: -12.5px;
			}

				.row.gtr-50.gtr-uniform > * {
					padding-top: 12.5px;
				}

		.row {
			margin-top: -25px;
			margin-left: -25px;
		}

			.row > * {
				padding: 25px 0 0 25px;
			}

			.row.gtr-uniform {
				margin-top: -25px;
			}

				.row.gtr-uniform > * {
					padding-top: 25px;
				}

		.row.gtr-150 {
			margin-top: -37.5px;
			margin-left: -37.5px;
		}

			.row.gtr-150 > * {
				padding: 37.5px 0 0 37.5px;
			}

			.row.gtr-150.gtr-uniform {
				margin-top: -37.5px;
			}

				.row.gtr-150.gtr-uniform > * {
					padding-top: 37.5px;
				}

		.row.gtr-200 {
			margin-top: -50px;
			margin-left: -50px;
		}

			.row.gtr-200 > * {
				padding: 50px 0 0 50px;
			}

			.row.gtr-200.gtr-uniform {
				margin-top: -50px;
			}

				.row.gtr-200.gtr-uniform > * {
					padding-top: 50px;
				}

		@media screen and (max-width: 1680px) {


			.row {
				display: flex;
				flex-wrap: wrap;
				box-sizing: border-box;
				align-items: stretch;
			}

				.row > * {
					box-sizing: border-box;
				}

				.row.gtr-uniform > * > :last-child {
					margin-bottom: 0;
				}

				.row.aln-left {
					justify-content: flex-start;
				}

				.row.aln-center {
					justify-content: center;
				}

				.row.aln-right {
					justify-content: flex-end;
				}

				.row.aln-top {
					align-items: flex-start;
				}

				.row.aln-middle {
					align-items: center;
				}

				.row.aln-bottom {
					align-items: flex-end;
				}

				.row > .imp-xlarge {
					order: -1;
				}

				.row > .col-1-xlarge {
					width: 8.33333%;
				}

				.row > .off-1-xlarge {
					margin-left: 8.33333%;
				}

				.row > .col-2-xlarge {
					width: 16.66667%;
				}

				.row > .off-2-xlarge {
					margin-left: 16.66667%;
				}

				.row > .col-3-xlarge {
					width: 25%;
				}

				.row > .off-3-xlarge {
					margin-left: 25%;
				}

				.row > .col-4-xlarge {
					width: 33.33333%;
				}

				.row > .off-4-xlarge {
					margin-left: 33.33333%;
				}

				.row > .col-5-xlarge {
					width: 41.66667%;
				}

				.row > .off-5-xlarge {
					margin-left: 41.66667%;
				}

				.row > .col-6-xlarge {
					width: 50%;
				}

				.row > .off-6-xlarge {
					margin-left: 50%;
				}

				.row > .col-7-xlarge {
					width: 58.33333%;
				}

				.row > .off-7-xlarge {
					margin-left: 58.33333%;
				}

				.row > .col-8-xlarge {
					width: 66.66667%;
				}

				.row > .off-8-xlarge {
					margin-left: 66.66667%;
				}

				.row > .col-9-xlarge {
					width: 75%;
				}

				.row > .off-9-xlarge {
					margin-left: 75%;
				}

				.row > .col-10-xlarge {
					width: 83.33333%;
				}

				.row > .off-10-xlarge {
					margin-left: 83.33333%;
				}

				.row > .col-11-xlarge {
					width: 91.66667%;
				}

				.row > .off-11-xlarge {
					margin-left: 91.66667%;
				}

				.row > .col-12-xlarge {
					width: 100%;
				}

				.row > .off-12-xlarge {
					margin-left: 100%;
				}

				.row.gtr-0 {
					margin-top: 0px;
					margin-left: 0px;
				}

					.row.gtr-0 > * {
						padding: 0px 0 0 0px;
					}

					.row.gtr-0.gtr-uniform {
						margin-top: 0px;
					}

						.row.gtr-0.gtr-uniform > * {
							padding-top: 0px;
						}

				.row.gtr-25 {
					margin-top: -6.25px;
					margin-left: -6.25px;
				}

					.row.gtr-25 > * {
						padding: 6.25px 0 0 6.25px;
					}

					.row.gtr-25.gtr-uniform {
						margin-top: -6.25px;
					}

						.row.gtr-25.gtr-uniform > * {
							padding-top: 6.25px;
						}

				.row.gtr-50 {
					margin-top: -12.5px;
					margin-left: -12.5px;
				}

					.row.gtr-50 > * {
						padding: 12.5px 0 0 12.5px;
					}

					.row.gtr-50.gtr-uniform {
						margin-top: -12.5px;
					}

						.row.gtr-50.gtr-uniform > * {
							padding-top: 12.5px;
						}

				.row {
					margin-top: -25px;
					margin-left: -25px;
				}

					.row > * {
						padding: 25px 0 0 25px;
					}

					.row.gtr-uniform {
						margin-top: -25px;
					}

						.row.gtr-uniform > * {
							padding-top: 25px;
						}

				.row.gtr-150 {
					margin-top: -37.5px;
					margin-left: -37.5px;
				}

					.row.gtr-150 > * {
						padding: 37.5px 0 0 37.5px;
					}

					.row.gtr-150.gtr-uniform {
						margin-top: -37.5px;
					}

						.row.gtr-150.gtr-uniform > * {
							padding-top: 37.5px;
						}

				.row.gtr-200 {
					margin-top: -50px;
					margin-left: -50px;
				}

					.row.gtr-200 > * {
						padding: 50px 0 0 50px;
					}

					.row.gtr-200.gtr-uniform {
						margin-top: -50px;
					}

						.row.gtr-200.gtr-uniform > * {
							padding-top: 50px;
						}

		}

		@media screen and (max-width: 1280px) {

			.row {
				display: flex;
				flex-wrap: wrap;
				box-sizing: border-box;
				align-items: stretch;
			}

				.row > * {
					box-sizing: border-box;
				}

				.row.gtr-uniform > * > :last-child {
					margin-bottom: 0;
				}

				.row.aln-left {
					justify-content: flex-start;
				}

				.row.aln-center {
					justify-content: center;
				}

				.row.aln-right {
					justify-content: flex-end;
				}

				.row.aln-top {
					align-items: flex-start;
				}

				.row.aln-middle {
					align-items: center;
				}

				.row.aln-bottom {
					align-items: flex-end;
				}

				.row > .imp-large {
					order: -1;
				}

				.row > .col-1-large {
					width: 8.33333%;
				}

				.row > .off-1-large {
					margin-left: 8.33333%;
				}

				.row > .col-2-large {
					width: 16.66667%;
				}

				.row > .off-2-large {
					margin-left: 16.66667%;
				}

				.row > .col-3-large {
					width: 25%;
				}

				.row > .off-3-large {
					margin-left: 25%;
				}

				.row > .col-4-large {
					width: 33.33333%;
				}

				.row > .off-4-large {
					margin-left: 33.33333%;
				}

				.row > .col-5-large {
					width: 41.66667%;
				}

				.row > .off-5-large {
					margin-left: 41.66667%;
				}

				.row > .col-6-large {
					width: 50%;
				}

				.row > .off-6-large {
					margin-left: 50%;
				}

				.row > .col-7-large {
					width: 58.33333%;
				}

				.row > .off-7-large {
					margin-left: 58.33333%;
				}

				.row > .col-8-large {
					width: 66.66667%;
				}

				.row > .off-8-large {
					margin-left: 66.66667%;
				}

				.row > .col-9-large {
					width: 75%;
				}

				.row > .off-9-large {
					margin-left: 75%;
				}

				.row > .col-10-large {
					width: 83.33333%;
				}

				.row > .off-10-large {
					margin-left: 83.33333%;
				}

				.row > .col-11-large {
					width: 91.66667%;
				}

				.row > .off-11-large {
					margin-left: 91.66667%;
				}

				.row > .col-12-large {
					width: 100%;
				}

				.row > .off-12-large {
					margin-left: 100%;
				}

				.row.gtr-0 {
					margin-top: 0px;
					margin-left: 0px;
				}

					.row.gtr-0 > * {
						padding: 0px 0 0 0px;
					}

					.row.gtr-0.gtr-uniform {
						margin-top: 0px;
					}

						.row.gtr-0.gtr-uniform > * {
							padding-top: 0px;
						}

				.row.gtr-25 {
					margin-top: -5px;
					margin-left: -5px;
				}

					.row.gtr-25 > * {
						padding: 5px 0 0 5px;
					}

					.row.gtr-25.gtr-uniform {
						margin-top: -5px;
					}

						.row.gtr-25.gtr-uniform > * {
							padding-top: 5px;
						}

				.row.gtr-50 {
					margin-top: -10px;
					margin-left: -10px;
				}

					.row.gtr-50 > * {
						padding: 10px 0 0 10px;
					}

					.row.gtr-50.gtr-uniform {
						margin-top: -10px;
					}

						.row.gtr-50.gtr-uniform > * {
							padding-top: 10px;
						}

				.row {
					margin-top: -20px;
					margin-left: -20px;
				}

					.row > * {
						padding: 20px 0 0 20px;
					}

					.row.gtr-uniform {
						margin-top: -20px;
					}

						.row.gtr-uniform > * {
							padding-top: 20px;
						}

				.row.gtr-150 {
					margin-top: -30px;
					margin-left: -30px;
				}

					.row.gtr-150 > * {
						padding: 30px 0 0 30px;
					}

					.row.gtr-150.gtr-uniform {
						margin-top: -30px;
					}

						.row.gtr-150.gtr-uniform > * {
							padding-top: 30px;
						}

				.row.gtr-200 {
					margin-top: -40px;
					margin-left: -40px;
				}

					.row.gtr-200 > * {
						padding: 40px 0 0 40px;
					}

					.row.gtr-200.gtr-uniform {
						margin-top: -40px;
					}

						.row.gtr-200.gtr-uniform > * {
							padding-top: 40px;
						}

		}

		@media screen and (max-width: 980px) {

			.row {
				display: flex;
				flex-wrap: wrap;
				box-sizing: border-box;
				align-items: stretch;
			}

				.row > * {
					box-sizing: border-box;
				}

				.row.gtr-uniform > * > :last-child {
					margin-bottom: 0;
				}

				.row.aln-left {
					justify-content: flex-start;
				}

				.row.aln-center {
					justify-content: center;
				}

				.row.aln-right {
					justify-content: flex-end;
				}

				.row.aln-top {
					align-items: flex-start;
				}

				.row.aln-middle {
					align-items: center;
				}

				.row.aln-bottom {
					align-items: flex-end;
				}

				.row > .imp-medium {
					order: -1;
				}

				.row > .col-1-medium {
					width: 8.33333%;
				}

				.row > .off-1-medium {
					margin-left: 8.33333%;
				}

				.row > .col-2-medium {
					width: 16.66667%;
				}

				.row > .off-2-medium {
					margin-left: 16.66667%;
				}

				.row > .col-3-medium {
					width: 25%;
				}

				.row > .off-3-medium {
					margin-left: 25%;
				}

				.row > .col-4-medium {
					width: 33.33333%;
				}

				.row > .off-4-medium {
					margin-left: 33.33333%;
				}

				.row > .col-5-medium {
					width: 41.66667%;
				}

				.row > .off-5-medium {
					margin-left: 41.66667%;
				}

				.row > .col-6-medium {
					width: 50%;
				}

				.row > .off-6-medium {
					margin-left: 50%;
				}

				.row > .col-7-medium {
					width: 58.33333%;
				}

				.row > .off-7-medium {
					margin-left: 58.33333%;
				}

				.row > .col-8-medium {
					width: 66.66667%;
				}

				.row > .off-8-medium {
					margin-left: 66.66667%;
				}

				.row > .col-9-medium {
					width: 75%;
				}

				.row > .off-9-medium {
					margin-left: 75%;
				}

				.row > .col-10-medium {
					width: 83.33333%;
				}

				.row > .off-10-medium {
					margin-left: 83.33333%;
				}

				.row > .col-11-medium {
					width: 91.66667%;
				}

				.row > .off-11-medium {
					margin-left: 91.66667%;
				}

				.row > .col-12-medium {
					width: 100%;
				}

				.row > .off-12-medium {
					margin-left: 100%;
				}

				.row.gtr-0 {
					margin-top: 0px;
					margin-left: 0px;
				}

					.row.gtr-0 > * {
						padding: 0px 0 0 0px;
					}

					.row.gtr-0.gtr-uniform {
						margin-top: 0px;
					}

						.row.gtr-0.gtr-uniform > * {
							padding-top: 0px;
						}

				.row.gtr-25 {
					margin-top: -6.25px;
					margin-left: -6.25px;
				}

					.row.gtr-25 > * {
						padding: 6.25px 0 0 6.25px;
					}

					.row.gtr-25.gtr-uniform {
						margin-top: -6.25px;
					}

						.row.gtr-25.gtr-uniform > * {
							padding-top: 6.25px;
						}

				.row.gtr-50 {
					margin-top: -12.5px;
					margin-left: -12.5px;
				}

					.row.gtr-50 > * {
						padding: 12.5px 0 0 12.5px;
					}

					.row.gtr-50.gtr-uniform {
						margin-top: -12.5px;
					}

						.row.gtr-50.gtr-uniform > * {
							padding-top: 12.5px;
						}

				.row {
					margin-top: -25px;
					margin-left: -25px;
				}

					.row > * {
						padding: 25px 0 0 25px;
					}

					.row.gtr-uniform {
						margin-top: -25px;
					}

						.row.gtr-uniform > * {
							padding-top: 25px;
						}

				.row.gtr-150 {
					margin-top: -37.5px;
					margin-left: -37.5px;
				}

					.row.gtr-150 > * {
						padding: 37.5px 0 0 37.5px;
					}

					.row.gtr-150.gtr-uniform {
						margin-top: -37.5px;
					}

						.row.gtr-150.gtr-uniform > * {
							padding-top: 37.5px;
						}

				.row.gtr-200 {
					margin-top: -50px;
					margin-left: -50px;
				}

					.row.gtr-200 > * {
						padding: 50px 0 0 50px;
					}

					.row.gtr-200.gtr-uniform {
						margin-top: -50px;
					}

						.row.gtr-200.gtr-uniform > * {
							padding-top: 50px;
						}

		}

		@media screen and (max-width: 736px) {

			.row {
				display: flex;
				flex-wrap: wrap;
				box-sizing: border-box;
				align-items: stretch;
			}

				.row > * {
					box-sizing: border-box;
				}

				.row.gtr-uniform > * > :last-child {
					margin-bottom: 0;
				}

				.row.aln-left {
					justify-content: flex-start;
				}

				.row.aln-center {
					justify-content: center;
				}

				.row.aln-right {
					justify-content: flex-end;
				}

				.row.aln-top {
					align-items: flex-start;
				}

				.row.aln-middle {
					align-items: center;
				}

				.row.aln-bottom {
					align-items: flex-end;
				}

				.row > .imp-small {
					order: -1;
				}

				.row > .col-1-small {
					width: 8.33333%;
				}

				.row > .off-1-small {
					margin-left: 8.33333%;
				}

				.row > .col-2-small {
					width: 16.66667%;
				}

				.row > .off-2-small {
					margin-left: 16.66667%;
				}

				.row > .col-3-small {
					width: 25%;
				}

				.row > .off-3-small {
					margin-left: 25%;
				}

				.row > .col-4-small {
					width: 33.33333%;
				}

				.row > .off-4-small {
					margin-left: 33.33333%;
				}

				.row > .col-5-small {
					width: 41.66667%;
				}

				.row > .off-5-small {
					margin-left: 41.66667%;
				}

				.row > .col-6-small {
					width: 50%;
				}

				.row > .off-6-small {
					margin-left: 50%;
				}

				.row > .col-7-small {
					width: 58.33333%;
				}

				.row > .off-7-small {
					margin-left: 58.33333%;
				}

				.row > .col-8-small {
					width: 66.66667%;
				}

				.row > .off-8-small {
					margin-left: 66.66667%;
				}

				.row > .col-9-small {
					width: 75%;
				}

				.row > .off-9-small {
					margin-left: 75%;
				}

				.row > .col-10-small {
					width: 83.33333%;
				}

				.row > .off-10-small {
					margin-left: 83.33333%;
				}

				.row > .col-11-small {
					width: 91.66667%;
				}

				.row > .off-11-small {
					margin-left: 91.66667%;
				}

				.row > .col-12-small {
					width: 100%;
				}

				.row > .off-12-small {
					margin-left: 100%;
				}

				.row.gtr-0 {
					margin-top: 0px;
					margin-left: 0px;
				}

					.row.gtr-0 > * {
						padding: 0px 0 0 0px;
					}

					.row.gtr-0.gtr-uniform {
						margin-top: 0px;
					}

						.row.gtr-0.gtr-uniform > * {
							padding-top: 0px;
						}

				.row.gtr-25 {
					margin-top: -5px;
					margin-left: -5px;
				}

					.row.gtr-25 > * {
						padding: 5px 0 0 5px;
					}

					.row.gtr-25.gtr-uniform {
						margin-top: -5px;
					}

						.row.gtr-25.gtr-uniform > * {
							padding-top: 5px;
						}

				.row.gtr-50 {
					margin-top: -10px;
					margin-left: -10px;
				}

					.row.gtr-50 > * {
						padding: 10px 0 0 10px;
					}

					.row.gtr-50.gtr-uniform {
						margin-top: -10px;
					}

						.row.gtr-50.gtr-uniform > * {
							padding-top: 10px;
						}

				.row {
					margin-top: -20px;
					margin-left: -20px;
				}

					.row > * {
						padding: 20px 0 0 20px;
					}

					.row.gtr-uniform {
						margin-top: -20px;
					}

						.row.gtr-uniform > * {
							padding-top: 20px;
						}

				.row.gtr-150 {
					margin-top: -30px;
					margin-left: -30px;
				}

					.row.gtr-150 > * {
						padding: 30px 0 0 30px;
					}

					.row.gtr-150.gtr-uniform {
						margin-top: -30px;
					}

						.row.gtr-150.gtr-uniform > * {
							padding-top: 30px;
						}

				.row.gtr-200 {
					margin-top: -40px;
					margin-left: -40px;
				}

					.row.gtr-200 > * {
						padding: 40px 0 0 40px;
					}

					.row.gtr-200.gtr-uniform {
						margin-top: -40px;
					}

						.row.gtr-200.gtr-uniform > * {
							padding-top: 40px;
						}

		}

/* Multi-use */

	.link-list li {
		padding: 0.2em 0 0.2em 0;
	}

		.link-list li:first-child {
			padding-top: 0 !important;
			border-top: 0 !important;
		}

		.link-list li:last-child {
			padding-bottom: 0 !important;
			border-bottom: 0 !important;
		}

	.quote-list li {
		padding: 1em 0 1em 0;
		overflow: hidden;
	}

		.quote-list li:first-child {
			padding-top: 0 !important;
			border-top: 0 !important;
		}

		.quote-list li:last-child {
			padding-bottom: 0 !important;
			border-bottom: 0 !important;
		}

		.quote-list li img {
			float: left;
		}

		.quote-list li p {
			margin: 0 0 0 90px;
			font-size: 1.2em;
			font-style: italic;
		}

		.quote-list li span {
			display: block;
			margin-left: 90px;
			font-size: 0.9em;
			font-weight: 400;
		}

	.check-list li {
		padding: 0.7em 0 0.7em 45px;
		font-size: 1.2em;
		background: url("images/icon-checkmark.png") 0px 1.05em no-repeat;
	}

		.check-list li:first-child {
			padding-top: 0 !important;
			border-top: 0 !important;
			background-position: 0 0.3em;
		}

		.check-list li:last-child {
			padding-bottom: 0 !important;
			border-bottom: 0 !important;
		}

	.feature-image {
		display: block;
		margin: 0 0 2em 0;
		outline: 0;
	}

		.feature-image img {
			display: block;
			width: 100%;
		}

	.bordered-feature-image {
		display: block;
		background: #79B51B ;
		padding: 2px;
		box-shadow: 3px 3px 3px 1px rgba(0, 0, 0, 0.15);
		margin: 0 0 1.5em 0;
		outline: 0;
	}

		.bordered-feature-image img {
			display: block;
			width: 100%;
		}

	.button-large {
		background-image: linear-gradient(to bottom, #7EBA1C, #78B11B);
		display: inline-block;
		background-color: #79B51B;
		color: #fff;
		text-decoration: none;
		font-size: 1.75em;
		height: 2em;
		line-height: 2.125em;
		font-weight: 300;
		padding: 0 45px;
		outline: 0;
		border-radius: 10px;
		box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.75), inset 0px 2px 0px 0px rgba(184, 231, 167, 0.5), inset 0px 0px 0px 2px rgba(112, 206, 78, 0.85), 3px 3px 3px 1px rgba(0, 0, 0, 0.15);
		text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.5);
	}

	.button-large:hover {
		background-image: linear-gradient(to bottom, #67DB78, #78B11B);
		background-color: #79B51B;
		box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.75), inset 0px 2px 0px 0px rgba(184, 231, 167, 0.5), inset 0px 0px 0px 2px rgba(112, 206, 78, 0.85), 3px 3px 3px 1px rgba(0, 0, 0, 0.15);
	}

	.button-large:active {
		background-image: linear-gradient(to bottom, #78B11B, #275317);
		background-color: #79B51B;
		box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.75), inset 0px 2px 0px 0px rgba(184, 231, 167, 0.5), inset 0px 0px 0px 2px rgba(75, 90, 72, 0.85), 3px 3px 3px 1px rgba(0, 0, 0, 0.15);
	}


/* Header */

	.header {
		position: relative;
		background: #475057 url("images/bg01.jpg");
		background-blend-mode: soft-light;
		border-bottom: solid 1px #272d30;
		box-shadow: inset 0px -1px 0px 0px #313A41;
		text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.75);
	}

		.header > .container {
			position: relative;
			min-height: 135px;
		}

		.header h1 {
			position: absolute;
			left: 0;
			bottom: 30px;
			font-size: 2.75em;
		}

			.header h1 a {
				color: #fff;
				text-decoration: none;
			}

		.header nav {
			position: absolute;
			right: 0;
			bottom: 30px;
			font-weight: 200;
		}

			.header nav a {
				color: white;
				text-decoration: none;
				font-size: 1.3em;
				margin-left: 30px;
				outline: 0;
			}

				.header nav a:hover {
					color: #f6f8f8;
				}

		.subpage .header > .container {
			height: 155px;
		}

/* Banner */

	#banner {
		border-top: solid 1px #222628;
		box-shadow: inset 0px 1px 0px 0px #313A41;
		padding: 35px 0 35px 0;
		color: #fff;
	}

		#banner .bordered-feature-image {
			margin-bottom: 0;
		}

		#banner p {
			font-size: 2em;
			font-weight: 200;
			line-height: 1.25em;
			padding-right: 1em;
			margin: 0 0 1em 0;
		}

/* Features */

	#features {
		background: #313A41 url("images/bg02.jpg");
		background-blend-mode: soft-light;
		border-bottom: solid 1px #272e31;
		padding: 45px 0 45px 0;
		text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.75);
		color: #a0a8ab;
	}

		#features h2 {
			font-size: 1.25em;
			color: white;
			margin: 0 0 0.25em 0;
		}

		#features a {
			color: #e0e8eb;
		}

		#features strong {
			color: #fff;
		}

/* Content */

	#content {
		background: #f7f7f7 url("images/bg04.png");
		border-top: solid 1px #fff;
		padding: 45px 0 45px 0;
	}

		#content section {
			background: #fff;
			padding: 40px 30px 45px 30px;
			box-shadow: 2px 2px 2px 1px rgba(75, 90, 72, 0.1);
			margin: 0 0 25px 0;
		}

		#content h2 {
			font-size: 1.8em;
			color: #373f42;
			margin: 0 0 0.25em 0;
		}

		#content h3 {
			color: #96a9b5;
			font-size: 1.25em;
		}

		#content a {
			color: #ED391B;
		}

		#content header {
			margin: 0 0 2em 0;
		}

		#content .quote-list li {
			border-bottom: solid 1px #e2e6e8;
		}

		#content .link-list li {
			border-bottom: solid 1px #e2e6e8;
		}

		#content .check-list li {
			border-bottom: solid 1px #e2e6e8;
		}

/* Footer */

	#footer {
		padding: 45px 0 45px 0;
		background: #313A41;
		text-shadow: 1px 1px  rgba(1, 1, 1, 0.9);
		color: white;

	}

		#footer h2 {
			font-size: 1.65em;
			color: white;
			margin: 0 0 1em 0;
		}

		#footer a {
			color: white;
		}

		#footer .quote-list li {
			border-top: solid 1px #e0e4e6;
			border-bottom: solid 1px #b5bec3;
		}

		#footer .link-list li {
			border-top: solid 1px #e0e4e6;
			border-bottom: solid 1px #b5bec3;
		}

		#footer .check-list li {
			border-top: solid 1px #e0e4e6;
			border-bottom: solid 1px #b5bec3;
		}

/* Copyright */

	#copyright {
		background: #79B51B;
		border-top: solid 1px #b5bec3;
		box-shadow: inset 0px 1px 0px 0px #313A41;
		text-shadow: 1px 1px  rgba(1, 1, 1, 0.5);
		text-align: center;
		padding: 10px 0 10px 0;
		color: white;
		/*text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.5);*/
	}

		#copyright a {
			color: #252D30;
		}

		#copyright a {
			color: white; /* Match copyright text */
			text-decoration: underline; /* Keep underline */
			font-size: inherit; /* Ensure the same font size as copyright text */
			font-family: inherit;
			padding-left: 15px
		}

		/* Add hover effect */
		#copyright a:hover {
			color: #ddd; /* Slightly lighter color on hover */

}
/* Large */

	@media screen and (max-width: 1280px) {

		/* Multi-use */

			.check-list li {
				font-size: 1em;
				line-height: 2em;
			}

			.quote-list li {
				padding: 1em 0 1em 0;
			}

				.quote-list li img {
					width: 60px;
				}

				.quote-list li p {
					margin: 0 0 0 80px;
					font-size: 1em;
					font-style: italic;
					line-height: 1.8em;
				}

				.quote-list li span {
					display: block;
					margin-left: 80px;
					font-size: 0.8em;
					font-weight: 400;
					line-height: 1.8em;
				}

			.feature-image {
				margin: 0 0 1em 0;
			}

			.button-large {
				font-size: 1.5em;
			}

		/* Banner */

			#banner p {
				font-size: 1.75em;
			}

		/* Header */

			.header h1 {
				font-size: 2.25em;
			}

			.header nav a {
				font-size: 1.1em;
			}

		/* Content */

			#content h2 {
				font-size: 1.4em;
			}

			#content h3 {
				font-size: 1.1em;
			}

			#content header {
				margin: 0 0 1.25em 0;
			}

	}

/* Medium */

	#navPanel, #titleBar {
		display: none;
	}

	@media screen and (max-width: 980px) {

		/* Basic */

			html, body {
				overflow-x: hidden;
			}

		/* Header */

			.header {
				text-align: center;
			}

				.header > .container:first-child {
					display: none;
				}

		/* Content */

			#content {
				padding: 25px 0;
			}

		/* Nav */

			#page-wrapper {
				backface-visibility: hidden;
				-moz-transition: -moz-transform 0.5s ease;
				-webkit-transition: -webkit-transform 0.5s ease;
				-ms-transition: -ms-transform 0.5s ease;
				transition: transform 0.5s ease;
				padding-bottom: 1px;
				padding-top: 44px;
			}

			#titleBar {
				backface-visibility: hidden;
				transition: transform 0.5s ease;
				display: block;
				height: 44px;
				left: 0;
				position: fixed;
				top: 0;
				width: 100%;
				z-index: 10001;
				color: #fff;
				background: url("images/bg04.jpg");
				box-shadow: inset 0px -20px 70px 0px rgba(200, 220, 245, 0.1), inset 0px -1px 0px 0px rgba(255, 255, 255, 0.1), 0px 1px 7px 0px rgba(0, 0, 0, 0.6);
				text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.75);
			}

				#titleBar .title {
					display: block;
					text-align: center;
					font-size: 1.2em;
					font-weight: 400;
					line-height: 48px;
				}

				#titleBar .toggle {
					position: absolute;
					left: 0;
					top: 0;
					width: 80px;
					height: 60px;
				}

					#titleBar .toggle:after {
						content: '';
						display: block;
						position: absolute;
						top: 6px;
						left: 6px;
						color: #fff;
						/*background: rgba(255, 255, 255, 0.025);*/
						background: #252D30;
						box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.1), inset 0px 0px 0px 1px rgba(255, 255, 255, 0.05), inset 0px -8px 10px 0px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.25);
						text-shadow: -1px -1px 1px black;
						width: 49px;
						height: 31px;
						border-radius: 8px;
					}

					#titleBar .toggle:before {
						content: '';
						position: absolute;
						width: 20px;
						height: 30px;
						background: url("images/mobileUI-site-nav-opener-bg.svg");
						top: 15px;
						left: 20px;
						z-index: 1;
						opacity: 0.25;
					}

					#titleBar .toggle:active:after {
						/*background: rgba(255, 255, 255, 0.05);*/
						background: #275317;
					}

			#navPanel {
				backface-visibility: hidden;
				-ms-transform: translateX(-275px);
				transform: translateX(-275px);
				-moz-transition: -moz-transform 0.5s ease;
				-webkit-transition: -webkit-transform 0.5s ease;
				-ms-transition: -ms-transform 0.5s ease;
				transition: transform 0.5s ease;
				display: block;
				height: 100%;
				left: 0;
				overflow-y: auto;
				position: fixed;
				top: 0;
				width: 275px;
				z-index: 10002;
				background: #313A41 url("images/bg04.jpg");
				background-blend-mode: soft-light;
				box-shadow: inset -1px 0px 0px 0px rgba(255, 255, 255, 0.25), inset -2px 0px 25px 0px rgba(0, 0, 0, 0.5);
				text-shadow: -1px -1px 1px black;
			}

				#navPanel .link {
					display: block;
					color: #fff;
					text-decoration: none;
					font-size: 1.25em;
					line-height: 2em;
					padding: 0.625em 1.5em 0.325em 1.5em;
					border-top: solid 1px #373d40;
					border-bottom: solid 1px rgba(0, 0, 0, 0.4);
				}

					#navPanel .link:first-child {
						border-top: 0;
					}

					#navPanel .link:last-child {
						border-bottom: 0;
					}

			body.navPanel-visible #page-wrapper {

				transform: translateX(275px);
			}

			body.navPanel-visible #titleBar {
				transform: translateX(275px);
			}

			body.navPanel-visible #navPanel {
				transform: translateX(0);
			}

	}

/* Small */

	@media screen and (max-width: 736px) {

		/* Basic */

			body, input, textarea, select {
				font-size: 13pt;
				line-height: 1.4em;
			}

		/* Multi-use */

			.link-list li {
				padding: 0.75em 0 0.75em 0;
			}

			.quote-list li p {
				margin-bottom: 0.5em;
			}

			.check-list li {
				font-size: 1em;
			}

			.button-large {
				width: 100%;
			}

		/* Banner */

			#banner p {
				font-size: 1.25em;
				font-weight: 200;
				line-height: 1.25em;
				margin: 0 0 1em 0;
			}

		/* Content */

			#content section {
				padding: 30px 20px;
			}

			#content h2 {
				font-size: 1.25em;
			}

			#content h3 {
				font-size: 1em;
			}

			#content header {
				margin: 0 0 1.25em 0;
			}

		/* Footer */

			#footer .link-list {
				margin: 0 0 10px 0 !important;
			}

		/* Copyright */

			#copyright {
				padding: 20px 30px;
			}

	}

/* Tables */


		/* Make header bold and improve spacing */
	.table.custom-table thead th {
		font-weight: bold;
		color: white;
		background-color: #6E6E6E !important;
		padding: 12px 16px;
		text-align: left;
		border-bottom: 2px solid #ddd;
	}

	/* Ensure rows have a minimum height but can expand */
	table.custom-table tbody tr {
    	height: auto !important; /* Ensures rows expand dynamically */
		min-height: 65px; /* Ensures a minimum height to prevent buttons from getting cut off */
		padding-top: 1px; /* Add padding for better spacing */
		padding-bottom: 1px; /* Add padding for better spacing */
		vertical-align: middle; /* Keeps content centered */
	}



		/* Make sure buttons are always visible */
	.table.custom-table td button {
		min-height: 36px !important;
		padding: 4px 8px;
		white-space: nowrap;
	}

	/* Optional: Add hover effect for better UX */
	table.custom-table tbody tr:hover {
		background-color: #f9f9f9; /* Light gray hover effect */
	}


/* Make table responsive */
.table-responsive {
    width: 100%;
    overflow-x: auto; /* Enables horizontal scrolling on small screens */
    -webkit-overflow-scrolling: touch; /* Smooth scrolling for mobile */
}

/* Ensure table layout remains readable */
.table.custom-table {
    width: 100%;
    min-width: 600px; /* Prevents table from shrinking too much */
    table-layout: auto;
}


/* Ensure table cells are properly spaced */
.table.custom-table th,
.table.custom-table td {
    padding: 10px 14px;
    border: 1px solid #ddd;
    vertical-align: middle !important;
    white-space: nowrap; /* Prevents wrapping */
}


/* Adjust form input alignment */
.input-group .form-control {
    min-height: 36px;
}

/* Logout button styling */
.text-center .btn-info {
    padding: 8px 16px;
    font-size: 14px;
    border-radius: 5px;
}

/* Make buttons responsive */
@media (max-width: 768px) {
    .table-responsive {
        overflow-x: auto;
    }

    .table.custom-table th,
    .table.custom-table td {
        font-size: 14px; /* Reduce font size for small screens */
        padding: 8px 10px;
    }

    .table.custom-table td button {
        font-size: 13px; /* Make buttons smaller */
        padding: 4px 8px;
    }
}


/* Ensure all nav links look the same */
#nav a,
#nav .logout-link {
    display: inline-block;
    text-decoration: none;
    padding: 10px 15px;
    color: #fff; /* Change this to match your theme */
	font-size: 1.5em;
}

/* Remove default button styles */
.logout-link {
    background: none;
    border: none;
    cursor: pointer;
    font: inherit;
    padding: 10px 15px;
    color: inherit;
}

/* Ensure Logout behaves like a normal link */
.logout-link:hover,
#nav a:hover {
    color: #ffcc00; /* Change this to your hover color */
}

/* Optional: Add a slight animation for a smooth effect */
.logout-link, #nav a {
    transition: color 0.3s ease-in-out;
}


/* Base styles for circular images */
.circular-image {
    width: 80px; /* Adjust size */
    height: 80px; /* Ensure perfect circle */
    border-radius: 50%; /* Makes the image circular */
    padding: 2px; /* 2px padding */
    background-color: #b5bec3; /* Optional: Contrast around the image */
    /*border: 5px solid #ddd; !* Optional: Light border *!*/
    object-fit: cover; /* Ensures the image fits within the circle */
}



/* resume.css */
/* Container styling */
.resume-container {
	width: 80%;
    margin: 0 auto;
    /*max-width: 800px;*/
    padding: 20px;
    background-color: #f8f8f8;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    color: black;
    line-height: 1.2;
}

/* Main Heading */
.resume-container h1 {
    text-align: center;
    font-size: 2.5em;
    margin-bottom: 20px;
    color: black;
}

/* Section Headings */
.resume-container h2 {
	display: block;
	width: 100%;
    background-color: #79B51B;
	font-size: 1.8em;
	text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.35);
    margin-top: 30px;
	padding: 10px;
    color: #ffffff;
	white-space: normal;  /* Ensures wrapping occurs */
    word-wrap: break-word;/
	box-sizing: border-box;
}


/* Subheadings */
.resume-container h3 {
    font-size: 1.1em;
    margin-top: 20px;
    color: black;
}

/* Paragraphs */
.resume-container p {
    margin: 10px 0;
}

/* Lists */
.resume-container ul {
    list-style-type: disc;
    margin-left: 20px;
    margin-bottom: 20px;
	margin-top: 10px;
	font-weight: normal;
}
.resume-container li {
    margin-bottom: 5px;
	font-weight: normal;
}

/* Sections or groups of content */
.resume-container .section {
    margin-bottom: 40px;
}

/* Responsive adjustments */
@media (max-width: 600px) {
    .resume-container {
        padding: 15px;
        font-size: 0.9em;
    }
}

.resume-container ul {
    list-style: disc; /* Use disc bullets; you can change to circle, square, etc. */
    padding-left: 20px; /* Indent the list */
    margin-bottom: 20px; /* Space below the list */
}

.resume-container li {
    margin-bottom: 10px; /* Space between bullet items */
    font-size: 1em;
    line-height: 1.2;
}

.job-title {
    font-weight: bold;
    color: #79B51B;
	font-size: 1.25em;/* Change this to your desired color */
}

.connect-top {
    width: 100%;
    background-color: #f2f2f2; /* Light background for contrast */
    padding: 10px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;             /* Space between items */
    margin-bottom: 20px;   /* Spacing below the connect bar */
}

.connect-top .connect-text {
    font-weight: bold;
    font-size: 1.2em;
    color: #79B51B;
  	/*text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.1);*/
}

.connect-top .icon {
    width: 40px;  /* Adjust the icon size as needed */
    height: auto;
    vertical-align: middle;
    transition: transform 0.2s;
}

.connect-top .icon:hover {
    transform: scale(1.1);
}

/* Ensure the logo does not exceed the navbar height */
#logo img {
    max-height: 60px;  /* Adjust as needed */
    width: auto;        /* Maintain aspect ratio */
}

/* Adjust size when screen is smaller (mobile view) */
@media (max-width: 980px) {
    #logo img {
        max-height: 43px; /* Smaller size for mobile */
    }
}


/* Privacy Policy Page Styles */
.privacy-container {
    max-width: 800px;
    margin: 40px auto;
    padding: 20px;
    background-color: #f9f9f9; /* Light gray background */
    border-radius: 8px; /* Rounded corners */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); /* Subtle shadow */
    font-family: 'Arial', sans-serif;
    color: #333;
}

.privacy-container h1 {
    text-align: center;
    font-size: 32px;
    margin-bottom: 20px;
    color: #222;
}

.privacy-container h2 {
    font-size: 22px;
    color: #444;
    margin-top: 30px;
    border-bottom: 1px solid #ddd; /* Underline effect */
    padding-bottom: 5px;
}

.privacy-container h3 {
    font-size: 18px;
    color: #444;
    margin-top: 30px;
    border-bottom: 1px solid #ddd; /* Underline effect */
    padding-bottom: 5px;
	padding-left: 10px;
}

.privacy-container p {
    font-size: 12px;
    line-height: 1.6;
    color: #555;
    margin-bottom: 10px;
	padding-left: 10px;
}

.privacy-container a {
    color: #007bff; /* Bootstrap blue */
    text-decoration: none;
    font-weight: bold;
}

.privacy-container a:hover {
    text-decoration: underline;
}

.privacy-container ul {
	padding-left: 25px; /* Indent the list */
	margin-bottom: 20px; /* Space below the list */
    list-style-type: disc;
}

.privacy-container li {
	margin-bottom: 10px; /* Space between bullet items */
	font-size: 12px;
	line-height: 1.1;

}


/* Responsive Design */
@media (max-width: 768px) {
    .privacy-container {
        width: 90%;
        padding: 15px;
    }

    .privacy-container h1 {
        font-size: 28px;
    }

    .privacy-container h2 {
        font-size: 20px;
    }

    .privacy-container p {
        font-size: 14px;
    }

}


.row.g-0 {
    margin-left: 0;
    margin-right: 0;
}

.col-md-4,
.col-md-8 {
    padding: 0 !important; /* Removes Bootstrap column padding */
	align-self: flex-start;
}

.feature-img {
    max-width: 100%; /* Ensures image is not stretched */
    height: auto;
    display: block; /* Prevents extra space under images */
    margin-right: 15px; /* Fine-tune spacing */
	/*padding-top: 10px !important;*/
}

.col-md-8 {
    display: flex;
    align-items: center; /* Keeps text vertically aligned */
    padding-left: 20px;!important; /* Removes Bootstrap column padding */
	padding-top: 10px !important; /* Removes Bootstrap column padding */
}

.text-container {
    flex: 1; /* Ensures text doesn't shrink too much */
}

/* On very small screens, ensure image stays left & text follows */
@media (max-width: 768px) {
    .row {
        flex-wrap: wrap;
        align-items: flex-start;
    }

    .col-auto {
        flex: 0 0 auto;
    }

    .col {
        flex: 1;
    }
}

/* Ensure the iframe container takes up the full width */
.iframe-container {
    width: 100%;
    max-width: 100%;
    display: flex;
    justify-content: center;
}

/* Ensure iframe expands properly */
#notebook-iframe {
    width: 100%;
    min-height: 1000px; /* Minimum height so it's visible */
    border: none;
}

/* Ensure iframe height is automatically adjusted */
@media (max-width: 768px) {
    #notebook-iframe {
        min-height: 800px; /* Adjust for smaller screens */
    }
}