/********** Template CSS **********/
:root {
    --primary: #00559d;
    --secondary: #5F656F;
    --light: #F5F5F5;
    --dark: #02245B;
}

@import url('fonts/stylesheet.css');

body{font-family: "MorebiRoundedMedium"; font-size:16px;line-height:1.7;color:#323232;}

.back-to-top {
    position: fixed;
    display: none;
    right: 30px;
    bottom: 30px;
    z-index: 99;
}

h1,
h2,
.h1,
.h2,
.fw-bold {
    font-weight: 700 !important;
}

h3,
h4,
.h3,
.h4,
.fw-medium {
    font-weight: 600 !important;
}

h5,
h6,
.h5,
.h6,
.fw-semi-bold {
    font-weight: 500 !important;
}

a {text-decoration: none;}


/*** Spinner ***/
#spinner {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s ease-out, visibility 0s linear .5s;
    z-index: 99999;
}

#spinner.show {
    transition: opacity .5s ease-out, visibility 0s linear 0s;
    visibility: visible;
    opacity: 1;
}


/*** Button ***/
.btn {
    transition: .5s;
    font-weight: 500;
}

.btn-primary,
.btn-outline-primary:hover {
    color: #FFFFFF;
	background: #00559d !important;
	border: #00559d;
}

.btn-square {
    width: 38px;
    height: 38px;
}

.btn-sm-square {
    width: 32px;
    height: 32px;
}

.btn-lg-square {
    width: 48px;
    height: 48px;
}

.btn-square,
.btn-sm-square,
.btn-lg-square {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: normal;
}


.topbar-right {
    position: relative;
    background: var(--primary);
	width:auto;
	left:69%;
}

.topbar-right::before {
    position: absolute;
    content: "";
    width: 30px;
    height: 100%;
    top: 0;
    left: -15px;
    transform: skewX(-30deg);
    background-color: var(--primary);
}


/*** Navbar ***/
.navbar.sticky-top {
    top: -100px;
    transition: .5s;
}

.navbar .navbar-brand {
    position: relative;
    padding-right: 50px;
    height: 75px;
    display: flex;
    align-items: center;
}

/*
.navbar .navbar-brand::after {
    position: absolute;
    content: "";
    width: 50px;
    height: 100%;
    top: 0;
    right: -25px;
    transform: skewX(-30deg);
    background-color: var(--primary);
}
*/

.navbar .navbar-nav .nav-link {
    margin-right: 35px;
    padding: 20px 0;
    color: var(--dark);
    font-size: 18px;
    font-weight: 500;
    outline: none;
}

.navbar .navbar-nav .nav-link:hover,
.navbar .navbar-nav .nav-link.active {
    color: var(--primary);
}

.navbar .dropdown-toggle::after {
    border: none;
    content: "\f107";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    vertical-align: middle;
    margin-left: 8px;
}

@media (max-width: 991.98px) {
    .navbar .navbar-nav .nav-link  {
        margin-right: 0;
        padding: 10px 0;
    }

    .navbar .navbar-nav {
        border-top: 1px solid #EEEEEE;
    }
}

@media (min-width: 992px) {
    .navbar .nav-item .dropdown-menu {
        display: block;
        border: none;
        margin-top: 0;
        top: 150%;
        opacity: 0;
        visibility: hidden;
        transition: .5s;
    }

    .navbar .nav-item:hover .dropdown-menu {
        top: 100%;
        visibility: visible;
        transition: .5s;
        opacity: 1;
    }
}

.logo-img {max-width:200px; height: auto;}
.logo-home img{filter:brightness(0) invert(1); -webkit-filter:brightness(0) invert(1);}
.logo img {transition: all 200ms ease-out;}
@media (max-width: 580px){
	.logo-img {wi-dth:200px;}	
}

.header{width:100%;border-top:3px solid #006cb5;border-bottom:1px solid #006cb5;display:table;z-index:999;margin-bottom:0 !important;background-color:#f4f4f4;}

.header-home {background-color:transparent !important; border-top:0px solid transparent !important; border-bottom:1px solid #fff !important;}

/*** Header ***/
.carousel-caption {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    background: linear-gradient(to right, rgba(2, 36, 91, 1) 0%, rgba(2, 36, 91, 0) 100%);
    z-index: 1;
}

.carousel-control-prev,
.carousel-control-next {
    width: 15%;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
    width: 3.5rem;
    height: 3.5rem;
    background-color: var(--primary);
    border: 15px solid var(--primary);
    border-radius: 3.5rem;
}

@media (max-width: 768px) {
    #header-carousel .carousel-item {
        position: relative;
        min-height: 450px;
    }
    
    #header-carousel .carousel-item img {
        position: absolute;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

.page-header {
    background: linear-gradient(to right, rgba(2, 36, 91, 1) 0%, rgba(2, 36, 91, 0) 100%), url(../img/carousel-2.jpg) center center no-repeat;
    background-size: cover;
}

.page-header .breadcrumb-item+.breadcrumb-item::before {
    color: var(--light);
}

.page-header .breadcrumb-item,
.page-header .breadcrumb-item a {
    font-size: 18px;
    color: var(--light);
}


/*** Facts ***/
.facts {
    position: relative;
    margin: 6rem 0;
    background: var(--dark);
}

.facts .border {
    border-color: rgba(255, 255, 255, .1) !important;
}


/*** Features ***/
.btn-play {
    position: absolute;
    top: 50%;
    right: -30px;
    transform: translateY(-50%);
    display: block;
    box-sizing: content-box;
    width: 16px;
    height: 26px;
    border-radius: 100%;
    border: none;
    outline: none !important;
    padding: 18px 20px 20px 28px;
    background: var(--primary);
}

@media (max-width: 992px) {
    .btn-play {
        left: 50%;
        right: auto;
        transform: translate(-50%, -50%);
    }
}

.btn-play:before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 60px;
    height: 60px;
    background: var(--primary);
    border-radius: 100%;
    animation: pulse-border 1500ms ease-out infinite;
}

.btn-play:after {
    content: "";
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 60px;
    height: 60px;
    background: var(--primary);
    border-radius: 100%;
    transition: all 200ms;
}

.btn-play span {
    display: block;
    position: relative;
    z-index: 3;
    width: 0;
    height: 0;
    left: -1px;
    border-left: 16px solid #FFFFFF;
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
}

@keyframes pulse-border {
    0% {
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
        opacity: 1;
    }

    100% {
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(2);
        opacity: 0;
    }
}

.modal-video .modal-dialog {
    position: relative;
    max-width: 800px;
    margin: 60px auto 0 auto;
}

.modal-video .modal-body {
    position: relative;
    padding: 0px;
}

.modal-video .close {
    position: absolute;
    width: 30px;
    height: 30px;
    right: 0px;
    top: -30px;
    z-index: 999;
    font-size: 30px;
    font-weight: normal;
    color: #FFFFFF;
    background: #000000;
    opacity: 1;
}


/*** Service ***/
.service-item {
    position: relative;
    margin: 65px 0 25px 0;
    box-shadow: 0 0 45px rgba(0, 0, 0, .07);
}

.service-item .service-img {
    position: absolute;
    padding: 12px;
    width: 130px;
    height: 130px;
    top: -65px;
    left: 50%;
    transform: translateX(-50%);
    background: #FFFFFF;
    box-shadow: 0 0 45px rgba(0, 0, 0, .09);
    z-index: 2;
}

.service-item .service-detail {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
    z-index: 1;
}

.service-item .service-title {
    position: absolute;
    padding: 65px 30px 25px 30px;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: #FFFFFF;
    transition: .5s;
}

.service-item:hover .service-title {
    top: -100%;
}

.service-item .service-text {
    position: absolute;
    overflow: hidden;
    padding: 65px 30px 25px 30px;
    width: 100%;
    height: 100%;
    top: 100%;
    left: 0;
    display: flex;
    align-items: center;
    text-align: center;
    background: rgba(2, 36, 91, .7);
    transition: .5s;
}

.service-item:hover .service-text {
    top: 0;
}

.service-item .service-text::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100px;
    top: -100%;
    left: 0;
    transform: skewY(-12deg);
    background: #FFFFFF;
    transition: .5s;
}

.service-item:hover .service-text::before {
    top: -55px;
}

.service-item .btn {
    position: absolute;
    width: 130px;
    height: 50px;
    left: 50%;
    bottom: -25px;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--secondary);
    background: #FFFFFF;
    border: none;
    box-shadow: 0 0 45px rgba(0, 0, 0, .09);
    z-index: 2;
}

.service-item .btn:hover {
    color: #FFFFFF;
    background: var(--primary);
}


/*** Project ***/
.project-carousel {
    position: relative;
    background: var(--dark);
}

.project-item {
    position: relative;
    display: block;
}

.project-item img {
    transition: .5s;
}

.project-item:hover img,
.project-carousel .owl-item.center img {
    margin-top: -60px;
}

.project-item .project-title {
    position: absolute;
    padding: 0 15px;
    width: 100%;
    height: 80px;
    bottom: -110px;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: var(--dark);
    transition: .5s;
}

.project-item:hover .project-title,
.project-carousel .owl-item.center .project-title  {
    bottom: -60px;
}

.project-item .project-title::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 30px;
    top: -15px;
    left: 0;
    transform: skewY(-5deg);
    background: var(--dark);
    transition: .5s;
}

.project-carousel .owl-nav {
    position: absolute;
    width: 100%;
    height: 45px;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    transition: .5s;
    opacity: 0;
    z-index: 1;
}

.project-carousel:hover .owl-nav {
    opacity: 1;
}

.project-carousel .owl-nav .owl-prev,
.project-carousel .owl-nav .owl-next {
    margin: 0 30px;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    background: var(--primary);
    border-radius: 45px;
    font-size: 22px;
    transition: .5s;
}


/*** Team ***/
.team-item .team-social {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: -100%;
    display: flex;
    align-items: center;
    background: var(--primary);
    transition: .5s;
}

.team-item:hover .team-social {
    left: 0;
}


/*** Testimonial ***/
.testimonial-carousel::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    height: 100%;
    width: 0;
    background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
    z-index: 1;
}

.testimonial-carousel::after {
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    height: 100%;
    width: 0;
    background: linear-gradient(to left, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
    z-index: 1;
}

@media (min-width: 768px) {
    .testimonial-carousel::before,
    .testimonial-carousel::after {
        width: 200px;
    }
}

@media (min-width: 992px) {
    .testimonial-carousel::before,
    .testimonial-carousel::after {
        width: 300px;
    }
}

.testimonial-carousel .owl-nav {
    position: absolute;
    width: 350px;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: space-between;
    opacity: 0;
    transition: .5s;
    z-index: 1;
}

.testimonial-carousel:hover .owl-nav {
    width: 300px;
    opacity: 1;
}

.testimonial-carousel .owl-nav .owl-prev,
.testimonial-carousel .owl-nav .owl-next {
    position: relative;
    color: var(--primary);
    font-size: 45px;
    transition: .5s;
}

.testimonial-carousel .owl-nav .owl-prev:hover,
.testimonial-carousel .owl-nav .owl-next:hover {
    color: var(--dark);
}

.testimonial-carousel .testimonial-img img {
    width: 100px;
    height: 100px;
}

.testimonial-carousel .testimonial-img .btn-square {
    position: absolute;
    bottom: -19px;
    left: 50%;
    transform: translateX(-50%);
}

.testimonial-carousel .owl-item .testimonial-text {
    margin-bottom: 30px;
    box-shadow: 0 0 45px rgba(0, 0, 0, .08);
    transform: scale(.8);
    transition: .5s;
}

.testimonial-carousel .owl-item.center .testimonial-text {
    transform: scale(1);
}


/*** Footer ***/
/*
.footer {
    color: #B0B9AE;
}

.footer .btn.btn-link {
    display: block;
    margin-bottom: 5px;
    padding: 0;
    text-align: left;
    color: #B0B9AE;
    font-weight: normal;
    text-transform: capitalize;
    transition: .3s;
}

.footer .btn.btn-link::before {
    position: relative;
    content: "\f105";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 10px;
}

.footer .btn.btn-link:hover {
    color: var(--light);
    letter-spacing: 1px;
    box-shadow: none;
}

.copyright {
    color: #B0B9AE;
    border-top: 1px solid rgba(255, 255, 255, .1);
}
*/

ul.inner-product-list {width:100%; margin:30px 0px 0px 0px; padding: 0px;}
ul.inner-product-list li {width:20%; max-width: 133px; margin: 15px; padding: 0px; display: inline-block; list-style: none; border-right: 3px solid #02245B; border-top:3px solid #02245B; border-left:3px solid #7b8286; border-bottom:3px solid #7b8286; border-radius:0px 20px 0px 20px; text-align: center; position: relative;}
ul.inner-product-list li {-webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
ul.inner-product-list li:hover { box-shadow: 0px 0px 10px #9a9a9a;}
ul.inner-product-list li a {width:100%; height: 200px; margin: 0px; padding: 0px; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
ul.inner-product-list li a h4 {color: #005ba9 !important; font-size:16px !important; font-weight: normal !important; margin-bottom: 1rem; font-family: "Open Sans"; }
ul.inner-product-list li a:hover h4{color:#02245B !important;}
ul.inner-product-list li a:hover {background: rgba(255,255,255,0.5);}
ul.inner-product-list li a img {width:77px; }

@media (max-width:740px) {
	ul.inner-product-list li {width: 39%;}
}

@media (max-width:480px) {
	ul.inner-product-list li {width: 39%;}	
}

ul.number-list {width: 100%; margin: 0px 0px 0px 20px; padding: 0px;}
ul.number-list li {width:100%; list-style:decimal; line-height: 30px;}
ul.number-list li a {color:#5F656F;}
ul.number-list li a:hover{color: #FF5E14;}
ul.double-row li {width: 48% !important; display: inline-block; list-style:decimal}
ul.triple-row li {width: 33% !important; display: inline-block; list-style:decimal}
ul.four-row li {width: 24% !important; display: inline-block; list-style:decimal}



ul.unorder-list {width: 100%; margin: 0px 0px 0px 20px; padding: 0px; }
ul.unorder-list li {width:100%; list-style:disc; line-height: 30px;}
ul.unorder-list li a {color:#5F656F;}
ul.unorder-list li a:hover{color: #FF5E14;}
	
.flange-image-responsive{width:100%; float: left; max-width:200px; }
.flange-image-responsive-right{width:100%; float: right; max-width:200px; }

.list-four-part li {width:24%; display:inline-block;}

.fastener-image-responsive{width:100%; float: left; max-width:200px; padding-right: 5px }
.fastener-image-responsive-right{width:100%; float: right; max-width:200px; }

.round-bars-image-responsive{width:100%; float: left; max-width:200px; }
.round-bars-image-responsive-right{width:100%; float: right; max-width:200px; }


.last-line-box {background: #eee; border:1px solid #ddd; box-shadow: #eee 10px 10px 5px; text-align: center; padding: 10px; width: fit-content;}
.last-line-box h2 {font-size: 14px;}
.all-image-responsive {width:100%; margin: 0px; padding: 5px; max-width: 500px;}


/* xxxx HOME PAGE START xxxx */
/* Visual Panel Start */
.home-visual-panel { width:100%; margin:0px 0px 0px 0px; padding:0px; background-image:url(images/home-bg.jpg); background-size:cover; background-position:fixed; height:100vh;}
h2.slider-text  { color:#fff; font-size:40px; font-weight:bold;}
.slider-white-text { color:#fff; font-size:20px;  }
.slider-button {padding:10px 30px; margin-top:15px; font-size:20px; color:#fff; background:#006cb5; border:1px solid #006cb5; width:auto; display:inline-block;}
.slider-button:hover {background:transparent; color:#fff; border:1px solid #fff;}
@media (max-width:768px) {.slider-text {top:5%; width:75%;}}
@media only screen and (max-width: 767px) and (min-width: 480px) {
h2.slider-text {font-size:20px; top:2%; width:90%;}
.slider-white-text {font-size:14px;}
.slider-button {padding:5px; color:#fff; background:#006cb5; width:auto; display:inline-block;}	
}
@media only screen and (max-width: 479px) and (min-width: 220px){
.home-visual-panel{display:none;}}
/*Visual Panel End*/

h2.home-page-heading { font-size:48px; padding:0px; margin:0px; position:relative; padding-top:22px; font-weight: normal !important;}
h2.home-page-heading:before {content:""; position:absolute; top:0; width:73px; height:5px; background:#006cb5;}

h2.home-page-heading2 { font-size:48px; padding:0px; margin:20px 0px; position:relative; padding-top:22px; color:#7b8286; font-weight: normal !important;}
h2.home-page-heading2:before {content:""; position:absolute; top:0; width:73px; height:5px; background:#7b8286;}

h2.home-blue-heading { font-size:48px; padding:0px; margin:0px; position:relative; padding-top:22px; color:inherit;}
h2.home-blue-heading:before {content:""; position:absolute; top:0; width:73px; height:5px; background:#006cb5;}

h2.home-grey-heading { font-size:48px; padding:0px; margin:0px; position:relative; padding-top:22px; color:#fff; text-align:center; font-weight: normal !important;}
h2.home-grey-heading:before {content:""; position:absolute; top:0; width:73px; height:5px; background:#fff; left:47%;}

a.product-image { position:relative; display:block;}
a.product-image:before { content:''; width:100%; height:100%; position:absolute; top:0; left:0; op-acity:0.71; backg-round:#171d22; transition:all 0.2s ease-out;}
a.product-image:hover:before {opacity:0.95; background:#006cb5;}
a.product-image .product-content{position:absolute; bottom:10%; right:20px; transition:all 0.2s ease-out; text-align:right;opacity:0.71; background:#171d22; padding: 5px 10px; border-radius: 5px;}
a.product-image .product-content h3 {color:#fff; display:inline-block; font-size:24px; font-weight:normal !important; font-family: "MorebiRoundedRegular";}
a.product-image:hover .product-content { bottom:35%;}
.home-right-arrow {color:#fff; vertical-align:text-bottom; margin-bot--tom:5px; margin-left:10px; padding:10px; border:1px solid #fff; font-size:20px;}
.home-right-arrow:hover {color:#999; border:1px solid #999;}

.home-service {border-right:1px solid #3c3c3c; border-top:1px solid #3c3c3c; padding:20px 0px;}
.home-service figure { text-align:center !important;}
.home-service h3 {color:#fff !important; text-align:center; font-weight: normal !important;}
.home-service p {color:#858585; text-align:center;}

.btn-home { margin:85px 0px 0px 0px;}
.btn-home a {border:2px solid #fff; padding:10px; color:#fff; float:right;}
.btn-home a:hover {border:2px solid #006cb5; color:#006cb5; background:#fff;}
.home-col-section {height:380px; position:relative; box-shadow:2px 2px 10px #ccc;}
.home-col-section a h3 {padding:0px 10px;}
.home-col-section a:hover h3 {color:#778188;}
.home-more {position:absolute; right:20px; bottom:0; font-size:18px;}

.homepage-product {background:#fff; padding:50px 0px;}
.homepage-material {background:#313131; padding-bottom:50px;}
.font-size-17pt {font-size:17pt !important;}
.img-width-max-150px {max-width: 150px !important;}
.img-width-max-160px {max-width: 160px !important;}
.p-tb-70 {padding:70px 0px;}
.width-100-percent {width: 100% !important;}
.txt-center{text-align: center !important;}

/*--- Material Grade Section CSS ---*/
 .chemical-box { width:100%; margin:0px; padding:0px;}
.chemical-box ul { width:100%; margin:0px; padding:0px;}
.chemical-box ul li{ width:15%; margin:0px 0.5%; padding:0px; float:left; list-style:none;}
.chemical-box-small {border:2px solid #fff; width:75px; height:75px; border-radius:10px; padding:2px; margin:0px;}
.chemical-box-small2 {border:2px solid #fff; width:70px; height:70px; border-radius:10px; padding:2px; margin:0px 5px 5px 5px; display: inline-block;}
.chemical-box-big {border:2px solid #fff; width:150px; height:150px; border-radius:10px; padding:2px; margin:0px; text-align:center;}
.chemical-number { text-align:left; font-size:16px; line-height:12pt; color:#fff;}
.chemical-formula {text-align:center; font-size:24px; margin-top:0px; line-height:24pt; color:#fff;}
.chemical-name {text-align:center; margin-top:10px; font-size:16px; line-height:0pt; color:#fff;}
.chemical-label { text-align:center; display:block; border-top:2px solid #fff; border-bottom:1px solid #fff; width:100% !important; padding:5% 0px !important; margin-top:15px !important; font-size:18px; color:#fff;}
		 .chemical-box-small2 .chemical-name {font-size:12px;}
		 .chemical-box-small2 .chemical-formula {line-height:22pt;}
/*For Big Box*/
.chemical-box-big .chemical-number{ font-size:22px; }
.chemical-box-big .chemical-formula{ font-size:80px; margin-top:30px;}
.chemical-box-big .chemical-name{font-size:22px; margin-top:35px; line-height:16pt;}
.chemical-box ul li a:hover .chemical-box-small,.chemical-box ul li a:hover .chemical-box-big { border:2px solid #006cb5; color:#006cb5;}
.chemical-box ul li a:hover .chemical-number, .chemical-box ul li a:hover .chemical-formula, .chemical-box ul li a:hover .chemical-name, .chemical-box ul li a:hover .chemical-label {color:#006cb5;}
.chemical-content-box a{text-decoration: none;}
@media (max-width:768px) { 
.home-standard-col {border-right:none; border-bottom:none;}
.chemical-box ul li {width:48%; text-align:center; margin-bottom:15px; display:inline-block;}
.chemical-content-box {width:100%; max-width:180px; display:inline-block;}
}
@media only screen and (max-width: 767px) and (min-width: 220px) {
h2.home-page-heading {font-size:20px; line-height:28pt;}
h2.home-page-heading span {font-size:16px;}	
.home-standard-col {border-right:none; border-bottom:none;}
.chemical-box ul li {width:100%; text-align:center; margin-bottom:15px; display:inline-block;}
	}
/*--- Material Grade Section CSS ---*/


a.standard-home:hover {filter: drop-shadow(5px 5px 3px #aaa); 
				}
.standard-image {width:100%; max-width:130px; display: inline-block; padding: 20px;}


/*--- Service Section CSS ---*/
.home-hexagon-section {margin:0px; padding:50px 0px; float:left; width:100%; display:block; background:url(images/home-pro-bg.png) no-repeat right; background-attachment:fixed;}
.home-hexagon-section1 {margin:0px; padding:15px 0px; float:left; width:100%; display:block; background:url(images/home-pro-bg.png) no-repeat right; background-attachment:fixed;}
.hexagon3-left {float:left; width:45%; padding:0px 0px;}
.hexagon3-right {float:right; width:50%;}
.hexagon3-right h2 { font-size:50px; padding-bottom:10px;}
.hexagon3-right p {font-size:16px;}

.hexagon3 {position: relative; width: 143px; height: 83px; margin: 19px 0; border-left: solid 5px #005ba9; border-right: solid 5px #005ba9;
 color:#005ba9 !important;}
.hexagon3 h3 { color:#005ba9; text-align:center; display:block; font-size:16px; margin-top: 3px;}

.hexagon3:before,.hexagon3:after {content: ""; position: absolute; z-index: 1; width: 100px; height: 100px; -webkit-transform: scaleY(0.6) rotate(-45deg);
  -ms-transform: scaleY(0.6) rotate(-45deg); transform: scaleY(0.6) rotate(-45deg); left: 16.519px;}
.hexagon3:before {top: -50px; border-top: solid 7.0711px #005ba9; border-right: solid 7.0711px #005ba9;}
.hexagon3:after {bottom: -50px; border-bottom: solid 7.0711px #005ba9; border-left: solid 7.0711px #005ba9;}
.hexagon3 .content-box{ position:absolute; text-align:center; width:100%; top:-20px; z-index:9999;} 
.hexagon3 .content-box img { max-width:60px; height:auto; width:100%;}
img.manufacturing-icon {max-width:80px !important;}
img.fabrications-icon {max-width:110px !important; margin-top:7px;}
img.outsourcing-icon {max-width:75px !important;}
img.coatings-icon {max-width:100px !important;}
img.surface-treatment-icon{ max-width:100px !important;}

ul.hexa-list { width:100%; margin:0px; padding:0px; text-align:center;}
ul.hexa-list li { margin:0px; padding:0px 10px; list-style:none; display:inline-block; max-width:143px;}

.hexagon3:hover { cursor:pointer; background:#005ba9;}
.hexagon3:hover:before,.hexagon3:hover:after { background:#005ba9; }
.hexagon3:hover h3 {color:#fff }
.hexagon3:hover .content-box img { filter:brightness(0) invert(1);}

.hex-white-brd{border-right: solid 5px #fff; border-left: solid 5px #fff;}
.hex-white-brd:before {border-top: solid 7.0711px #fff; border-right: solid 7.0711px #fff;}
.hex-white-brd:after {border-bottom: solid 7.0711px #fff; border-left: solid 7.0711px #fff;}
.hex-white-brd:hover { background:#fff;}
.hex-white-brd:hover:before,.hex-white-brd:hover:after { background:#fff; }
.hex-white-brd:hover .content-box img { filter:none !important;}
.manufacturing,.stock-clearance,.fabrications,.outsourcing,.coatings,.surface-treatment { display:none}
/*--- Service Section CSS ---*/

/* xxxx HOME PAGE END xxxx */


/*XXXXXXX FOOTER START XXXXXX*/

.footer {padding:20px 0px; border-top:5px solid #006cb5; border-bottom:2px solid #006cb5; background:#f4f4f4;}
.footer h2 {padding:0px 0px 10px 0px; margin:10px 0px; line-height:0; font-weight: normal !important; color: #00559d;}
ul.footer-menu { width:100%; margin:0px; padding:0px;}
ul.footer-menu li { width:100%; margin:0px; padding:0px; list-style:none;}
ul.footer-menu li a{ color:#4a4746; font-family: "MorebiRoundedRegular"; text-decoration: none;}
ul.footer-menu li a strong {font-family: "MorebiRoundedMedium"; font-size:18px; color:#006cb5;}
ul.footer-menu li a:hover{ color:#778188;}

ul.contact {padding:0; margin:0px;}
ul.contact li { font-family:"MorebiRoundedMedium", Arial, Helvetica, sans-serif; text-decoration:none; border-top:solid 1px rgba(210, 215, 217, 0.75); margin:0px; padding:5px 0px 5px 5px; position:relative; font-size:14px; line-height:20pt; width:90%; list-style: none !important;}
ul.contact li:before { color:#006cb5; display:inline-block; font-size:1.5em; height:1.125em; position:absolute; left:0; line-height:1.125em; width:1.5em; to-p:1em; font-family: 'FontAwesome';  }
ul.contact li:first-child { border-top:0; margin-top:0; padding-top:0;}

.copyright-container{background: #778188;}
.copyright{text-align:left;color:#fff;font-size:13px;}
.copyright a {color:#fff;}
ul.follow-list { width:100%; margin:0px; padding:0px 0px 0px 0px; text-align:right;}
ul.follow-list li { display:inline-block; margin:0px; padding:0px 19px 0px 0px; font-size:24px; }
ul.follow-list li:last-child{ padding:0px; }
ul.follow-list li a { color:#fff; text-decoration:none; display:block; text-align:center;}
ul.follow-list li a .fa { color:#fff; }
ul.follow-list li a:hover .fa{ color:#006cb5 !important; background:none !important; }
ul.follow-list li a .fa {font-size:20px;}
.qr-image {width:100%; max-width:124px; text-align: center;}
/*XXXXXXX FOOTER END XXXXXX*/