﻿/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body {
	color: #5a5a5a;
}

a {
	color: #777777;
}

	a:hover {
		color: #000;
	}

/* BACK TO TOP */

.cd-top.cd-is-visible {
	visibility: visible;
	opacity: 1;
}

.cd-top.cd-fade-out {
	opacity: 0.5;
}

/* FORM STYLE */
#error {
	background: #ff3a3c;
	color: #fff;
	padding: 0.5em;
	margin: 0.5em 0;
	border-radius: 0.5em;
}

#success {
	background: #b6e974;
	color: #000;
	padding: 0.5em;
	margin: 0.5em 0;
	border-radius: 0.5em;
}

.form {
	width: 100%;
}

	.form fieldset {
		border: 0px;
		padding: 0px;
		margin: 0px;
	}

	.form p.contact {
		font-size: 12px;
		margin: 0px 0px 10px 0;
		line-height: 14px;
	}

	.form input[type='text'],
	.form input[type='email'],
	.form textarea {
		width: 100%;
	}

	.form select {
		margin-bottom: 15px;
	}

	.form label {
		color: #f04930;
		font-weight: bold;
		font-size: 12px;
	}

		.form label.month {
			width: 135px;
		}

	.form input,
	textarea {
		background-color: rgba(255, 255, 255, 0.4);
		border: 1px solid rgba(122, 192, 0, 0.15);
		padding: 7px;
		font-family: Keffeesatz, Arial;
		color: #4b4b4b;
		font-size: 14px;
		-webkit-border-radius: 5px;
		margin-bottom: 15px;
		margin-top: -10px;
	}

		.form input:focus,
		textarea:focus {
			border: 1px solid #ff5400;
			background-color: rgba(255, 255, 255, 1);
		}

	.form .select-style {
		-webkit-appearance: button;
		-webkit-border-radius: 2px;
		-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
		-webkit-padding-end: 20px;
		-webkit-padding-start: 2px;
		-webkit-user-select: none;
		background-image: url(images/select-arrow.html), -webkit-linear-gradient(#fafafa, #f4f4f4 40%, #e5e5e5);
		background-position: center right;
		background-repeat: no-repeat;
		border: 0px solid #fff;
		color: #555;
		font-size: inherit;
		margin: 0;
		overflow: hidden;
		padding-top: 5px;
		padding-bottom: 5px;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.form .gender {
		width: 410px;
	}

	.form input.buttom {
		background: #f04930;
		display: inline-block;
		padding: 5px 10px 6px;
		color: #fff;
		text-decoration: none;
		font-weight: bold;
		line-height: 1;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		border: none;
		cursor: pointer;
		font-size: 14px;
	}

		.form input.buttom:hover {
			background-color: #2a78f6;
		}

/* PAGE HEADER
---------------------- */
#page-header {
	background-color: #f04930;
	padding: 1.5625em 1.25em 0;
}

	#page-header h2 {
		margin-bottom: 0.262144em;
		margin-top: 0;
		color: #fff;
		font-size: 3em;
	}

		#page-header h2 a {
			color: #fff;
		}

			#page-header h2 a:hover {
				text-decoration: none;
			}

nav ul {
	list-style: none;
	list-style-image: none;
	padding: 0;
}

#horizontal-nav ul > li {
	display: block;
	float: left;
}

#horizontal-nav li:first-child.active a {
	background-color: #fff;
	border-color: #fff;
	text-shadow: none;
}

#horizontal-nav li.active a {
	background: #fff;
	border-color: #fff;
	color: #777777;
}

#horizontal-nav li > a {
	border: 1px solid #677b8a;
	padding: 0.64em 1em;
	text-decoration: none;
	border-bottom: none;
	margin: 5px 5px 0 0;
	display: block;
	background-color: #48b757;
	color: #fff;
	font-weight: bold;
	transition: all 0.1s linear;
}

	#horizontal-nav li > a:hover {
		background-color: #419e4a;
	}

/* NAVBAR
-------------------------------------------------- */

#header-area .container {
	padding-left: var(--bs-gutter-x);
	padding-right: var(--bs-gutter-x);
}

/* Special class on .container surrounding .navbar, used for positioning it into place. */
#nav-right {
	float: left;
	width: 100%;
}

#top-nav {
	font-size: 0.5em;
	width: 100%;
}

.navbar-toggle {
	float: none;
	width: 100%;
	background-color: #e4e2e2;
	content: 'menu';
	margin: 0;
}

	.navbar-toggle span {
		font-weight: bold;
	}

.navbar-collapse .container-fluid {
	padding: 0;
}

.navbar {
	margin-bottom: 0;
}

.site-logo {
	width: 40%;
	height: auto;
	padding: 1em 0;
	margin: 0 auto;
}

.site-logo {
	padding: 0.25rem 0;
}


.nav a {
	color: #f04930;
	font-weight: 600;
	font-size: 2em;
}

.trial {
	color: #f04930;
}

/* Flip around the padding for proper display in narrow viewports */
.navbar-wrapper > .container {
	padding-right: 0;
	padding-left: 0;
}

.navbar-wrapper .navbar {
	padding-right: 15px;
	padding-left: 15px;
}

	.navbar-wrapper .navbar .container {
		width: auto;
	}

#top-nav a {
	color: #747474;
}

/* DOCS PAGE */
.download-item {
	width: 100%;
	padding: 10px;
	background: #8c8c8c;
	border-radius: 1em;
	margin: 1em 0;
}

	.download-item:hover {
		background: #969696;
	}

	.download-item a {
		color: #fff !important;
		text-decoration: none;
	}

	.download-item .icon {
		float: left;
		margin-right: 1em;
	}

.pdf-icon {
	background: url(../web/adobe-pdf.png) no-repeat;
	background-size: contain;
	width: 51px;
	height: 55px;
}

.ppt-icon {
	background: url(../web/ppt.png) no-repeat;
	background-size: contain;
	width: 51px;
	height: 55px;
}

.download-item .download-title {
	font-size: 1.5em;
}

/* VIDEO PAGE */
.video-item {
	padding: 10px;
	background: #8c8c8c;
	border-radius: 1em;
	margin: 1em 0;
}

	.video-item .video-title {
		color: #ffffff;
		/*		color:aquamarine;*/
		/*font-size: 1.5em;*/
		font-size: 2em;
	}

	.video-item .video-details {
		color: #ffffff;
		font-size: 1.2em;
	}

/* CAROUSEL
-------------------------------------------------- */
/* Carousel base class */

/* CAROUSEL - Bootstrap 5 */

#myCarousel {
	width: 100%;
}

.carousel-item {
	min-height: 400px;
	background-size: cover;
	background-position: center;
}

.carousel-caption {
	z-index: 10;
	color: #fff;
	top: 30%;
	bottom: 30%;
	left: 10%;
	width: 50%;
	text-align: left;
}

	.carousel-caption a {
		display: block;
		color: #fff;
	}

		.carousel-caption a:hover {
			color: #fff;
			text-decoration: none;
		}

	.carousel-caption div {
		background: rgba(240, 73, 48, 0.6);
		padding: 1em;
	}

	.carousel-caption a,
	.carousel-caption a:hover,
	.carousel-caption a:focus,
	.carousel-caption a:active {
		text-decoration: none !important;
		color: #fff;
	}

.banner1 {
	background-image: url(../web/oil-carousel.jpg);
}

.banner2 {
	background-image: url(../web/health-carousel.jpg);
}

.banner3 {
	background-image: url(../web/mining-carousel.jpg);
}

.banner4 {
	background-image: url(../web/aviation-carousel.jpg);
}

.banner5 {
	background-image: url(../web/train-carousel.jpg);
}


/* NAVBAR */
/* Header styling */
.custom-navbar {
	padding-top: 0.25rem;
	padding-bottom: 0.25rem;
}

	/*Menu links */
	.custom-navbar .nav-link {
		color: #f04930;
		font-size: 1.5em;
		font-weight: bold;
		padding: 0.5rem 1rem;
		text-transform: none;
	}

		 /*Hover / active */
		.custom-navbar .nav-link:hover,
		.custom-navbar .nav-link:focus {
			color: #d63a1f;
		}

	 /*Remove underline everywhere */
	.custom-navbar .nav-link {
		text-decoration: none;
	}

 /*Mobile toggle color */
.navbar-light .navbar-toggler {
	border-color: rgba(0,0,0,0.2);
}





/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
	margin-bottom: 20px;
	text-align: center;
}

.marketing h2 {
	font-weight: normal;
}

.marketing .col-lg-4 p {
	margin-right: 10px;
	margin-left: 10px;
}

/* Featurettes
------------------------- */

.featurette-divider {
	margin: 40px 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
	font-weight: 300;
	line-height: 1;
	letter-spacing: -1px;
}

/* FOOTER 
-------------------- */
footer ul {
	list-style: none;
	text-align: left;
	padding: 0;
}

/* TRANSITIONS */
#head {
	transition: all 0.5s linear;
}

/* BUTTONS */
.btn {
	padding: 0.5em;
	background-color: #f04930;
	color: #fff;
	font-size: 1.25em;
	font-weight: bold;
	transition: all 0.5s linear;
}

	.btn:hover {
		background-color: #d83b2b;
		color: #fff;
	}

.btn-primary {
	background-color: #337ab7;
}

	.btn-primary:hover {
		background-color: #337ab7;
		color: #fff;
	}

/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 768px) {
	/* HEADER STYLES */
	body {
		padding-top: 100px;
	}

/*	#header-area .container {
		width: 100%;
		padding: 0 15px 0 15px;
	}*/

	#header-area {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 999;
		background-color: #fff;
		width: 100%;
		-webkit-transition: all 0.4s ease-in-out;
		-moz-transition: all 0.4s ease-in-out;
	}

	#head {
		padding: 2em 0;
	}

	.shrink {
		box-shadow: 0px 5px 10px 0px rgba(66, 66, 66, 0.5);
	}

		.shrink #head {
			padding-top: 0.5em;
			padding-bottom: 0.5em;
		}

		.shrink .navbar-nav li a {
			font-size: 1.5em;
			padding: 7px 15px;
		}

		.shrink .site-logo {
			width: 12%;
		}

	.site-logo {
		width: 20%;
		float: left;
	}

	/* Navbar positioning foo */
	#top-nav {
		font-size: 0.5em;
		float: right;
	}

	#nav-right {
		float: right;
		width: 80%;
	}

	.navbar-wrapper {
		margin-top: 20px;
	}

		.navbar-wrapper .container {
			padding-right: 15px;
			padding-left: 15px;
		}

		.navbar-wrapper .navbar {
			padding-right: 0;
			padding-left: 0;
		}

		/* The navbar becomes detached from the top, so we round the corners */
		.navbar-wrapper .navbar {
			border-radius: 4px;
		}

	/* Bump up size of carousel content */
	.carousel-caption p {
		margin-bottom: 20px;
		font-size: 21px;
		line-height: 1.4;
	}

	.featurette-heading {
		font-size: 40px;
	}
}

@media (min-width: 992px) {
	.featurette-heading {
		margin-top: 20px;
	}

	.print-heading {
		display: none;
	}
}

@media print {
	#main-nav {
		display: none;
	}

	#page-header {
		display: none;
	}

	footer {
		display: none;
	}

	.cd-top {
		display: none;
	}

	#myCarousel {
		display: none;
	}

	.print-heading {
		display: block;
	}
}

@media print {
	.no-print,
	.no-print * {
		display: none !important;
	}
}

.txthigh {
	--margin-bottom: 20px;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.4;
	text-align: justify;
}

@media (min-width: 768px) {
	.txthigh {
		font-size: 18px;
	}
}

.alert-danager {
	font-weight: bold;
	color: darkred;
}

h3 {
	font-family: sans-serif;
	font-size: 28px;
	font-weight: 800;
	font-style: italic;
	color: black;
}

.features-text-one {
	text-align: justify;
	/*	padding-left: 8%;
	padding-right: 8%;*/
	font-size: 22px;
	font-weight: 600;
	font-family: 'Manrope', sans-serif;
	color: #203864;
}

.features-text-oneB {
	font-family: sans-serif;
	text-align: justify;
	font-size: 19px;
	font-family: sans-serif;
	color: #203864;
}

@media (max-width: 800px) {
	.features-text-one {
		/*font-size: 16px;*/
		/*padding-left: 7%;
		padding-right: 7%;*/
	}
}

@media (max-width: 575px) {
	.features-text-one {
		/*font-size: 16px;*/
		/*padding-left: 5%;
		padding-right: 5%;*/
	}
}

.features-text-two {
	font-family: sans-serif;
	text-align: justify;
	font-size: 19px;
	font-weight: 400;
	color: #203864;
	padding-bottom: 4%;
}

@media (max-width: 800px) {
	.features-text-two {
		/*font-size: 12px;*/
		padding-left: 10%;
		padding-right: 10%;
		padding-top: 15px;
	}
}

@media (max-width: 575px) {
	.features-text-two {
		/*font-size: 12px;*/
		padding-left: 5%;
		padding-right: 5%;
		padding-top: 15px;
	}
}

.urldropdown {
	--margin: 40px;
	--background: rgba(0, 0, 0, 0.3);
	--text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
	--background-color: #00ffe1;
	--color: #f04930;
	--font-weight: bold;
	--color: #000000;
	background-color: #f04930;
	color: #ffffff;
}

.featStyle-ul {
	/*	background: #3399ff;*/
	/*	padding: 20px;*/

	font-size: 16px;
	font-weight: 400;
	/*font-family: 'Montserrat', sans-serif;*/
}

	.featStyle-ul li {
		/*		background: #cce5ff;
		color: darkblue;*/
		margin: 5px;
		padding-left: 1em;
		color: black;
	}

		.featStyle-ul li::marker {
			content: '\f00c'; /* FontAwesome Unicode */
			font-family: FontAwesome;
			color: red;
			font-size: var(--icon-size);
		}

.addres-style-head {
	font-family: sans-serif;
	font-size: 17px;
	font-weight: bolder;
	line-height: 1.5;
	color: black;
}

.addres-style {
	font-family: sans-serif;
	font-size: 17px;
	font-weight: 400;
	line-height: 1.5;
	color: black;
}

.email-style {
	font-family: sans-serif;
	font-size: 17px;
	font-weight: 400;
	line-height: 1.5;
	color: blue;
	/*	text-decoration:underline;*/
	/*	font-style:under*/
}

h2 {
	font-weight: 300;
	line-height: 1;
	letter-spacing: -1px;
	font-size: 40px;
}

.tab-content {
	border-left: 1px solid black;
	border-right: 1px solid black;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid black;
	padding: 10px;
}

.nav-tabs {
	margin-bottom: 0;
}

.play-btn {
	/*	width: 50px;*/
	/*	position: relative;
	top: -50%;*/
	cursor: pointer;
	/*	transition: 0.5s;
	--opacity: 0;*/
}

/*.col-md-4:hover .play-btn
{
	opacity: 1;
}*/

modal-content {
	background: transparent !important;
	border: none !important;
}

.modal-dialog {
	width: 60%;
}

.video-index-item {
	padding: 10px;
	border-color: black;
	border-width: 1px;
	border-style: solid;
	/*background: #8C8C8C;*/
	border-radius: 1em;
	margin: 1em 0;
}

	.video-index-item .video-index-title {
		color: black;
		/*		color:aquamarine;*/
		/*font-size: 1.5em;*/
		font-size: 2em;
	}

	.video-index-item .video-index-details {
		color: black;
		font-size: 1.2em;
	}

.video-link {
	font-family: sans-serif;
	font-weight: 500;
	/*	font-feature-settings: 'ss01' off;*/
	/*	display: inline;*/
	cursor: pointer;
	font-size: 2em;
	line-height: 1.222222222222222;
	color: black;
}

a.video-link:hover {
	text-decoration: underline;
	color: red;
}

/* features grid */
.grid-text-one {
	text-align: justify;
	font-size: 19px;
	font-weight: 600;
	font-family: sans-serif;
	color: black;
}

.grid-text-two {
	font-family: sans-serif;
	text-align: justify;
	font-size: 17px;
	font-weight: 400;
	color: #1f1f1f;
	/*	padding-bottom: 4%;*/
}

.grid-row {
	border-color: black;
	border-width: 1px;
	border-style: solid;
}

.features-columns-text-two {
	font-family: sans-serif;
	text-align: justify;
	font-size: 17px;
	font-weight: 100;
	color: #203864;
	padding-bottom: 4%;
}


The issue is not Bootstrap — it’s a CSS overflow/layout problem caused by the PDF icon being larger than its container and the parent not constraining it.

You can fix this without changing your HTML by tightening the CSS for .download-item, .icon, and the title.

✅ Recommended Fix (Safe, Minimal)

Add this to your CSS (e.g. styleWP.css or a new overrides file loaded last):
/* Ensure download item contains its children */
.download-item {
	display: block;
	overflow: hidden;
}

/* Fix PDF icon overflow */
.download-item .icon {
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	margin-right: 12px;
}

/* If icons are floated */
.download-item .icon {
	float: left;
}

/* Ensure text stays aligned */
.download-item .download-title,
.download-item .download-details {
	overflow: hidden;
}

/* Optional: modern flex layout (BEST option) */
.download-item a {
	display: flex;
	align-items: center;
	gap: 12px;
}

/* Section headers inside downloads */
.download-section-title,
p.lead {
	font-weight: 600;
	font-size: 1.25rem;
	margin-bottom: 1rem;
	padding-bottom: 0.5rem;
	border-bottom: 2px solid #dee2e6;
	color: #333;
}


/* === FIX SOFTWARE SUB-MENU (Bootstrap 5) === */

#horizontal-nav {
	margin-top: 1rem;
}

	#horizontal-nav ul {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		padding: 0;
		margin: 0;
		list-style: none;
	}

	#horizontal-nav li {
		margin: 0;
	}

	#horizontal-nav a {
		display: inline-block;
		padding: 8px 14px;
		background-color: #4CAF50; /* keep green buttons */
		color: #fff;
		text-decoration: none;
		font-weight: 600;
		border-radius: 0;
		transition: background-color 0.2s ease;
	}

	/* Active item */
	#horizontal-nav li.active a {
		background-color: #6c757d !important; /* grey active */
		color: #fff !important;
	}



	/* Hover */
	#horizontal-nav a:hover {
		background-color: #43a047;
		color: #fff;
	}


/* GRID ROW ALTERNATING BACKGROUNDS */
.grid-row {
	padding: 12px 0;
	align-items: center;
}

	/* Odd rows */
	.grid-row:nth-child(odd) {
		background-color: #ffffff;
	}

	/* Even rows */
	.grid-row:nth-child(even) {
		background-color: #f2f2f2;
	}

/* Optional: subtle row separator */
.grid-row {
	border-bottom: 1px solid #ddd;
}
