@charset 'UTF-8';
@import url("font-awesome.min.css");
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;600;800&display=swap");
@import url("http://fonts.googleapis.com/css?family=Oleo+Script:400|Open+Sans:300,300italic,600,600italic,800");

/* ==========================================================================
   1. BASE & RESET STYLES
   ========================================================================== */

body {
background-color: #00285E;
background-image: -moz-linear-gradient(top, rgba(0,0,0,0.05), rgba(0,0,0,0)), url('images/bg01.png');
background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.05), rgba(0,0,0,0)), url('images/bg01.png');
background-image: -o-linear-gradient(top, rgba(0,0,0,0.05), rgba(0,0,0,0)), url('images/bg01.png');
background-image: -ms-linear-gradient(top, rgba(0,0,0,0.05), rgba(0,0,0,0)), url('images/bg01.png');
background-image: linear-gradient(top, rgba(0,0,0,0.05), rgba(0,0,0,0)), url('images/bg01.png');
background-position: top left, top left;
background-attachment: fixed;
background-repeat: repeat-x, repeat;
background-size: 100% 30em, auto;
line-height: 2.25em;
}

body.is-loading * {
-moz-transition: none !important;
-webkit-transition: none !important;
-o-transition: none !important;
-ms-transition: none !important;
transition: none !important;
-moz-animation: none !important;
-webkit-animation: none !important;
-o-animation: none !important;
-ms-animation: none !important;
animation: none !important;
}

body, input, select, textarea {
font-family: 'Inter', sans-serif;
font-size: 12pt;
color: #3E3E3E;
font-weight: 300;
}

a {
color: #900;
text-decoration: underline;
cursor: pointer !important;
}

a:hover {
text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
font-weight: 600;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
color: inherit;
text-decoration: none;
outline: 0;
}

h2 {
font-size: 2.25em;
margin: 0 0 1.0em 0;
line-height: 1em;
color: #960000;
}

h2 a:hover {
color: #333;
}

h3 {
font-size: 1.35em;
margin: 0 0 1em 0;
}

b, strong {
font-weight: 600;
}

i, em {
font-style: italic;
}

br.clear {
clear: both;
}

sub {
position: relative;
top: 0.5em;
font-size: 0.8em;
}

sup {
position: relative;
top: -0.5em;
font-size: 0.8em;
}

hr {
border-top: 1px solid #7E0000;
width: 80%;
size: 1px;
border-right: 0;
border-bottom: 0;
border-left: 0;
}

blockquote {
border-left: solid 0.5em #eee;
padding: 1em 0 1em 2em;
font-style: italic;
}

p, ul, ol, dl, table {
margin-bottom: 2em;
}

section, article {
margin-bottom: 5em;
}

section > :last-child, article > :last-child {
margin-bottom: 0;
}

section:last-child, article:last-child {
margin-bottom: 0;
}

header {
margin: 0 0 0em 0;
}

header h2, header h3 {
margin: 0 0 0.25em 0;
}

header p {
margin: 0;
}

footer {
margin: 1.5em 0 0 0;
}


/* ==========================================================================
   2. TABLES, IMAGES & BUTTONS
   ========================================================================== */

/* Tables */
table {
width: 100%;
}

table.default {
width: 100%;
}

table.default tr {
border-top: solid 1px #eee;
}

table.default tr:first-child {
border-top: 0;
}

table.default td {
padding: 0.5em 1em 0.5em 1em;
}

table.default th {
text-align: left;
padding: 0.5em 1em 0.5em 1em;
font-weight: 800;
margin: 0 0 1em 0;
}

table.default thead {
background: #404248;
color: #fff;
}

/* Images */
.image {
display: inline-block;
outline: 0;
}

.image img {
display: block;
width: 100%;
border-radius: 3px;
}

.image.fit {
display: block;
width: 100%;
}

.image.featured {
display: block;
width: 100%;
margin: 0 0 2.5em 0;
}

.image.left {
float: left;
margin: 0 2em 2em 0;
}

.image.centered {
display: block;
margin: 0 0 2.5em 0;
}

.image.centered img {
margin: 0 auto;
width: auto;
}

/* Buttons (Global Base) */
input[type="button"], input[type="submit"], input[type="reset"], .button, a.button {
-webkit-appearance: none;
position: relative;
display: inline-block;
color: #fff;
text-decoration: none;
border-radius: 5px;
font-weight: 600;
outline: 0;
border: 0;
cursor: pointer;
-moz-transition: background-color .25s ease-in-out;
-webkit-transition: background-color .25s ease-in-out;
-o-transition: background-color .25s ease-in-out;
-ms-transition: background-color .25s ease-in-out;
transition: background-color .25s ease-in-out;
font-size: 1em;
margin-top: 1.3em;
background-color: #b51a22;
padding: 0.5em 1.4em;
}

input[type="button"].big, input[type="submit"].big, input[type="reset"].big, .button.big {
font-size: 2.25em;
padding: 0.8em 0.9em;
}

input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover, .button:hover {
background: #666;
}

input[type="button"]:active, input[type="submit"]:active, input[type="reset"]:active, .button:active {
background: #b51a22;
}

.button.icon:before {
position: relative;
margin-right: 0.5em;
top: 0.05em;
}

input[type="button"].alt, input[type="submit"].alt, input[type="reset"].alt, .button.alt {
background: #f1f1f1;
background: rgba(0,0,0,0.05);
color: #444;
}

input[type="button"].alt:hover, input[type="submit"].alt:hover, input[type="reset"].alt:hover, .button.alt:hover {
background: #e8e8e8;
background: rgba(0,0,0,0.085);
}

input[type="button"].alt:active, input[type="submit"].alt:active, input[type="reset"].alt:active, .button.alt:active {
background: #e4e4e4;
background: rgba(0,0,0,0.15);
}

/* Custom Component Buttons */
.cta-btn {
background-color: #d9232d !important;
color: #ffffff !important;
text-transform: uppercase;
font-size: 0.85em;
padding: 0.7em 1.5em;
border-radius: 2px;
font-weight: 700;
}

.cta-btn:hover { background-color: #b51a22 !important; }

.outline-btn {
border: 2px solid #0b1a2d;
background: transparent !important;
color: #0b1a2d !important;
font-weight: 700;
}

/* Lists */
ul.default {
list-style: square;
padding-left: 1em;
padding-top: 1em;
padding-bottom: 1em;
color: inherit;
font-size: 1em;
text-align: left;
}

ul.default li {
padding-left: 0.5em;
list-style: square;
padding-top: 0.3em;
}

ul.actions li {
display: inline-block;
padding: 0 0 0 0.25em;
margin: 0 0 0 0.25em;
}

ul.actions li:first-child {
margin-left: 0;
padding-left: 0;
}

ul.menu li {
border-left: solid 1px #e0e0e0;
display: inline-block;
padding: 0 0 0 0.75em;
margin: 0 0 0 0.75em;
}

ul.menu li:first-child {
border-left: 0;
margin-left: 0;
padding-left: 0;
}

ol.default {
list-style: decimal;
padding-left: 1.25em;
}

ol.default li {
padding-left: 0.25em;
}


/* ==========================================================================
   3. COMPONENTS & WIDGETS
   ========================================================================== */

/* Boxes */
.box, .boxB {
border-radius: 3px;
box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.015), 0px 3px 0px 0px rgba(0,0,0,0.05);
background-color: #e2e6e8;
padding: 2em;
}

.box.feature {
padding: 0;
}

.box.feature .inner {
padding: 3em 2em;
}

.box.feature h2 {
font-size: 1.35em;
}

.box.feature p {
margin: -0.2em 0 0 0;
line-height: 1.5em;
}

.box.feature .image {
position: relative;
margin: 0;
}

.box.feature .image img {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}

.boxB {
padding: 0;
}

/* Icons */
.icon {
position: relative;
text-decoration: none;
}

.icon:before {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
text-transform: none !important;
}

.icon > .label {
display: none;
}

/* Widgets */
.widget.thumbnails .grid {
margin: 0 0 1em 0;
}

.widget.thumbnails .image {
margin: 0;
}

.widget.contact {
position: relative;
left: 0;
top: 0;
margin-bottom: 0;
}

.widget.contact ul {
overflow: hidden;
position: relative;
left: -4px;
top: 4px;
margin-bottom: 0em;
}

.widget.contact ul li {
display: inline-block;
margin-right: 0.25em;
}

.widget.contact ul li a {
display: inline-block;
width: 2.5em;
height: 2.5em;
text-align: center;
line-height: 2.5em;
border-radius: 0.35em;
outline: 0;
opacity: 0.75;
text-decoration: none;
background: #222222;
-moz-transition: background-color .25s ease-in-out;
-webkit-transition: background-color .25s ease-in-out;
-o-transition: background-color .25s ease-in-out;
-ms-transition: background-color .25s ease-in-out;
transition: background-color .25s ease-in-out;
}

.widget.contact ul li a:before {
color: #f3f3f3;
font-size: 1.75em;
line-height: 1.5em;
}

.widget.contact ul li a:hover { background: #444444; }
.widget.contact ul li a:active { background: #666666; }

/* Banner / Gallery */
#mainBanner { position: relative; }

#simplegallery1 {
position: relative;
visibility: hidden;
border: 10px solid #333;
}

#simplegallery1 .gallerydesctext {
text-align: left;
padding: 4px 8px;
}

#slides {
border: 10px solid #333;
direction: ltr;
}

#control {
margin: 4px auto;
text-align: center;
}


/* ==========================================================================
   4. LAYOUT WRAPPERS & NAVIGATION
   ========================================================================== */

#banner-wrapper { margin-bottom: 0; }
#body-wrapper { margin: 2em 4em 0em 4em; }

#header-wrapper { padding: 0 0 0.1em 0; 
background-color: #fff;
}
#features-wrapper { padding: 3em 0; }
#main-wrapper {
background: #fff;
box-shadow: 0px 3px 0px 0px rgba(0,0,0,0.05);
padding: 5em 0;
}
#footer-wrapper {
padding: 3em 0;
margin-bottom: 0;
}

#header {
display: flex;
align-items: center;
justify-content:center;
position: relative;
}

#logo {
    display: block;
    text-align: left;
}

#logo a {
    display: inline-block;
    line-height: 0;
    margin: 0 0.35em 0 0;
    padding: 0.25em 0.2em;
    border-radius: 6px;
}

/* Crisp high-DPI image scaling */
#logo a img {
    width: 200px; /* Constrains display width */
    height: auto; /* Preserves aspect ratio */
    max-width: 100%;
    object-fit: contain;
    image-rendering: -webkit-optimize-contrast;
}

/* Mobile responsive scaling */
@media screen and (max-width: 736px) {
    #logo a img {
        width: 180px;
    }
}

/* Nav & Dropotron Menu */
#nav {
font-size: 0.9em;
}

#nav ul {
display: flex;
align-items: center;
list-style: none;
margin: 0 0 1em 0;
padding: 0;
}

#nav ul li {
position: relative;
padding-left: 1.5em;
}

#nav ul li a, #nav ul li span {
display: inline-block;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.025em;
color: #07436A;
text-decoration: none;
border-radius: 4px;
padding: 0.5em 1em;
transition: background-color 0.25s ease-in-out, color 0.25s ease-in-out;
}

#nav ul li > ul {
display: none;
}

#nav ul li:hover a, #nav ul li:hover span {
background-color: #01548A;
color: #e2e6e8;
}

#nav ul li.active a, #nav ul li.active span {
background-color: #01548A;
color: #e2e6e8;
}

#nav ul li.current a {
background-color: #00285E;
color: #fff;
}

.dropotron {
background: #e2e6e8;
letter-spacing: 0.025em;
color: #01548A;
text-decoration: none;
border-radius: 6px;
padding: 0.75em 0;
min-width: 13em;
box-shadow: inset 0 0 0 1px rgba(0,0,0,0.1), 0 0.25em 0.25em 0.1em rgba(0,0,0,0.025);
margin-top: calc(-0.75em + 1px);
margin-left: -1px;
list-style: none;
}

.dropotron li {
border-top: solid 1px #eee;
line-height: 3em;
}

.dropotron li:first-child {
border-top: 0;
}

.dropotron li > a, .dropotron li > span {
text-decoration: none;
color: inherit;
display: block;
padding: 0 1.5em;
transition: color 0.25s ease-in-out, background-color 0.25s ease-in-out;
cursor: pointer;
}

.dropotron li > a:hover, .dropotron li > span:hover, .dropotron li.active > a, .dropotron li.active > span {
background-color: #00285E;
color: #fff;
}

.dropotron.level-0 {
font-size: 0.9em;
font-weight: 600;
margin-left: 1.5em;
margin-top: 0;
}

.dropotron.level-0:before {
content: '';
position: absolute;
top: -0.5em;
left: 1em;
border-bottom: solid 0.75em #e2e6e8;
border-left: solid 0.75em transparent;
border-right: solid 0.75em transparent;
z-index: 1;
}

/* Banner Module */
#imgBanner {
margin-top: 0;
margin-bottom: 0;
border-radius: 4px;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
overflow: hidden;
height: 320px;
background-color: #900;
}

#imgBanner img {
border-radius: 4px;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}

#banner {
position: relative;
border-top-left-radius: 0;
border-top-right-radius: 0;
padding: 4em 4.5em;
}

#banner h2 {
font-size: 1.6em;
margin: 0.1em 0 1em 0;
}

#banner p {
font-size: 1.1em;
line-height: 1.5em;
margin: 0;
}

#banner .button {
width: 100%;
margin-bottom: 0.5em;
}

#banner .button.icon:before {
position: absolute;
right: 0.15em;
top: 50%;
transform: translateY(-50%);
}

#banner .button.alt {
margin-bottom: 0;
}

#banner ul {
margin: 0 0 0 2em;
}

/* Footer & Copyright */
#footer {
margin-top: 0;
margin-bottom: 0;
/*font-family: Arial, Helvetica, sans-serif;*/
color: #CCC;
}

#footer h3{
	font-weight: 200;
}
#footer p { color: #CCC; 
font-weight: 200;
line-height: 1.5;
}
#footer a {
	color: #A2A2A2;
}
.footer-info p{
padding: 0 4em 0 1em;
}

/* Footer Logo High-DPI Display Scaling */
.footer-logo {
    width: 200px; /* Constrains display width to keep it sharp */
    height: auto; /* Preserves aspect ratio */
    max-width: 100%;
    display: block;
    margin-bottom: 1em;
    
    /* Optimization for crisp edges on webkit browsers */
    image-rendering: -webkit-optimize-contrast;
    object-fit: contain;
}

/* Mobile responsive adjustment */
@media screen and (max-width: 736px) {
    .footer-logo {
        width: 200px;
        margin: 0 auto 1em auto; /* Centers logo on stacked mobile footer */
    }
}
#copyright {
color: #ccc;
text-align: center;
padding: 2em 0 0 0;
	font-size: 0.9rem;
}

#copyright a { color: inherit; }

.phone:before { font-family: FontAwesome; content: '\f095'; color: inherit; }
.web:before   { font-family: FontAwesome; content: '\f08e'; color: inherit; }
.mail:before  { font-family: FontAwesome; content: '\f0e0'; color: inherit; }


/* ==========================================================================
   5. BITS FABRICATION MODERNIZATION & PAGE SECTIONS
   ========================================================================== */

/* Section Utility Classes & Dark Mode */
.dark-bg {
background-color: #0b1a2d !important;
color: #ffffff !important;
}

.dark-bg .section-header h2, 
.dark-bg h2, 
.dark-bg h3, 
.dark-bg h4 {
color: #ffffff !important;
}

/* Textured Dark Navy Background Section */
.dark-bg, .textured-navy-bg {
    background-color: #022545;
    background-image: 
        /* 1. Linear Column Gradient */
        linear-gradient(
            90deg, 
            #022545 0%, 
            #033a6d 50%, 
            #01162c 100%
        ),
        /* 2. Micro-Noise Overlay */
        url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 0.25 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");

    background-repeat: no-repeat, repeat;
    background-size: cover, 120px 120px;
    color: #ffffff;
}

.highlight-blue {
color: #04A9FB;
font-weight: 300;
}

/* Structural Section Wrappers */
#hero-wrapper {
padding: 0.5em 0;
background-color:#0b1a2d;
color: #ffffff;
}

#hero-wrapper h1 {
font-size: 2.8em;
line-height: 1.15;
color: #ffffff;
font-weight: 200;
padding-bottom: 0.6em;
}
#hero-wrapper p{
padding-right: 3em;
line-height: 1.5em;
color: #ccc;
}
#hero-wrapper .container{

}
section.hero-content{
margin: 4em 0 0 2em;
}

/* ==========================================================================
   Spacious Hero Banner Styling
   ========================================================================== */

.spacious-hero {
    padding: 0.1em 0 4em 0;
    text-align: center;
}

.spacious-hero .subheading {
    display: block;
    font-size: 0.9em;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #00a8ff; /* Secondary accent color */
    margin-bottom: 0.75em;
}

.spacious-hero h1 {
    font-size: 2.8em;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 0.5em;
    color: #ffffff;
}

.spacious-hero .highlight-blue {
    color: #00a8ff;
}

.spacious-hero .hero-lead {
    font-size: 1.25em;
    line-height: 1.6;
    max-width: 800px;
    margin: 0 auto;
    color: #d1d5db;
}

/* Mobile responsive adjustment */
@media screen and (max-width: 736px) {
    .spacious-hero {
        padding: 3em 1em 2.5em 1em;
    }

    .spacious-hero h1 {
        font-size: 2em;
    }

    .spacious-hero .hero-lead {
        font-size: 1em;
    }
}

#services-wrapper,
#industries-wrapper{
padding: 3em 0;
background: #f4f6f8;
}
#projects-wrapper {
padding: 3em 0;
background: #fff;
}

#process-wrapper { padding: 4em 0; }

#cta-banner-wrapper {
padding: 5em 3em 4em 3em;
background: #0b1a2d;
border-top: 6px solid #b90000;
}
#cta-banner-wrapper h2{
font-weight: 200;
line-height: 1.4em;
padding-left: 0;
}
#cta-banner-wrapper p{
color:#ccc;
padding-right: 2em;
}
/* Headings & Typography */
.section-header { margin-bottom: 2.5em; }

.section-header h2 {
font-size: 2.25rem;
font-weight: 200;
color: #0b1a2d;
letter-spacing: -0.5px;
margin: 0;
text-transform: uppercase;
}

.subheading {
font-size: 1.1rem;
font-weight: 400;
color: #0088cc;
text-transform: uppercase;
letter-spacing: 2px;
display: block;
margin-bottom: 0.5rem;
}

/* Center-Aligned Feature Cards */
.feature-card {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
width: 100%;
height: 100%;
padding: 1.75em 0.75em;
background: #ffffff;
border-radius: 4px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
transition: transform 0.2s ease;
}

.feature-card:hover {
transform: translateY(-4px);
width: 100%;
}

.feature-card .icon {
width: 120px;
height: 120px;
margin-bottom: 1.25em;
margin-left: auto;
margin-right: auto;
}

.feature-card h3 {
font-size: 1.05rem;
font-weight: 800;
color: #0b1a2d;
line-height: 1.25;
margin-bottom: 0.75rem;
}

.feature-card p {
font-size: 0.825rem;
font-weight: 400;
line-height: 1.5;
color: #718096;
margin-bottom: 1.5em;
}

.feature-card .card-link,
.feature-card a.arrow-link {
margin-top: auto;
color: #d9232d;
font-size: 1.1rem;
text-decoration: none;
display: inline-block;
}
#about-split-wrapper {
padding: 0.2em 0 0 0;
background-color: #fff;
}
#about-split-wrapper{
}
#about-split-wrapper h2{
font-weight: 200;
	line-height: 1.3em;

}
.about-text{line-height: 1.8em;
padding: 3em 0.1em 0.2em 0.3em;
font-size: 0.9rem;
}
/* Process Section Module */
#process-wrapper{
padding: auto 3em 3em auto;
}
#process-wrapper h2{
padding-bottom: 1.5em;
padding-top: 0.3em;
font-weight: 200;
}
.process-step { text-align: center; 
padding: 1.5em 0;
}

.icon-hex {
width: 70px;
height: 70px;
margin: 0 auto 2em auto;
display: flex;
align-items: center;
justify-content: center;
}
.process-step h4{
}
.process-step p{
margin: 1em 0;
color: #ccc;
line-height: 1.5em;
}
.step-num {
color: #0088cc;
font-weight: 600;
padding: 0.5em;
}

/* Industries Module Grid */
#industries-wrapper h2{
margin: 0.8em auto 2em auto;
}
.industry-box {
background: #ffffff;
padding: 3em 0.5em;
text-align: center;
border: 1px solid #e1e5eb;
border-radius: 4px;
}

.industry-box h4 {
font-size: 0.75em;
margin-top: 0.75em;
color: #0b1a2d;
font-weight: 600;
margin-bottom: 1em;
}
#projects-wrapper{
}
#projects-wrapper h2{
margin: 0.8em auto 2em auto;
}
#projects-wrapper h3{
font-weight: 600;
font-size: 1.1em;
}
.project-info p{
line-height: 1.4em;
}
/* ==========================================================================
   6. UTILITIES
   ========================================================================== */

.align-center { text-align: center; }
.align-right  { text-align: right; }
.margin-top   { margin-top: 2em; }