/* Custom CSS to override Bootstrap defaults */
html { scroll-behavior: smooth; height: 100%; } /* Prevents having to use JS to enable smooth scrolling anchors */
body { font-family: 'Lato', sans-serif; }
h1, h2, h3, h4, h5 { font-family: 'Oswald', sans-serif;}
.logo { max-height: 60px; }
.logo-sm { height: 30px; width: auto; }
.bg-global-nav { background: rgb(0,0,0); background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(78,78,78,1) 100%); }
.bg-gray { background-color: #c8c8c8; }
.bg-home-banner { background-color: rgb(122, 193, 67); color: #ffffff; }
.img-sm { max-height: 50px; width: auto; }

/* General classes and styles */
.monospace { font-family: monospace; }
.nowrap { white-space: nowrap; }
.small-fonts { font-size: 12px; }
.spacer { height: 25px; }
.spacer-lg { height: 50px; }
.hidden { display: none; }
.video-fluid { width: 100%; height: auto; }
.header-img {
    height: 50vh;
    background-size: cover;
    background-position: center center;
    position: relative;
    vertical-align: top;
    color: #ffffff;
}
.banner-about { background-image: url("/img/about/banner.jpg"); }
.banner-contact { background-image: url("/img/contact/banner.jpg"); }
.banner-custom-fab { background-image: url("/img/custom-fab/banner.jpg"); }
.banner-e-coating { background-image: url("/img/e-coating/banner.jpg"); }
.banner-fasteners { background-image: url("/img/fasteners/banner.jpg"); }
.banner-quality { background-image: url("/img/quality/banner.jpg"); }
.banner-tip-crete { background-image: url("/img/tip-crete/banner.jpg"); }

/* Header Videos */
#home-jumbotron h1 { font-size: 4rem; }
#home-jumbotron p { font-size: 1.2rem; }

/* Custom colors and classes */
.bg-featured { clip-path: polygon(0 15%, 100% 0, 100% 85%, 0 100%); padding: 4rem 6%; }

/* Video Headers */
header.video { position: relative; background-color: black; height: 50vh; width: 100%; overflow: hidden; }
header.video video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    height: auto;
    z-index: 0;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
header.video .container { position: relative; z-index: 2; }
header.video .overlay { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-color: black; opacity: 0.5; z-index: 1; }
.overlay-text h1, .overlay-text h2 { text-shadow: 1px 1px 1px #000000; }

/* Overlay Boxes */
.wg-box { position: relative; margin: auto; overflow: hidden; }
.wg-box .wg-box-overlay { background: rgba(0,0,0,0.7); position: absolute; height: 100%; width: 100%; left: 0; top: 0; bottom: 0; right: 0; opacity: 0; -webkit-transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; transition: all 0.4s ease-in-out 0s; }
.wg-box:hover .wg-box-overlay { opacity: 1; }
.wg-box-image { width: 100%; }
.wg-box-details { position: absolute; text-align: center; padding-left: 1em; padding-right: 1em; width: 100%; top: 50%; left: 50%; opacity: 0; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; }
.wg-box:hover .wg-box-details { top: 50%; left: 50%; opacity: 1; }
.wg-box-details h3 { color: #fff; font-weight: 500; letter-spacing: 0.15em; margin-bottom: 0.5em; text-transform: uppercase; }
.wg-box-details p { color: #fff; font-size: 0.8em; }
.wg-box-fadeIn-bottom { top: 80%; }

/* Same height boxes */
.full-height {margin-bottom: 15px; }
.full-height-card { margin: 10px 0; }
.full-height-card .card_body { height: 70px; max-height: 72px; display: table-cell; vertical-align: middle; }

/* Footer */
footer { padding-top: 25px; }
.social-icon { font-size: 2.25em; margin: 0 10px; }

/* Amrize Footer */
@font-face { font-family: 'Univers LT'; src: url('/vendor/webfonts/univers/univers_lt_std_bold.woff') format('woff'); font-weight: normal; font-style: normal; }
#footer-amrize { margin-top: 30px; padding-top: 30px; background: #fff; color: #011e6a; font-family: 'Univers LT', Helvetica, Arial, sans-serif; }


/* Media Queries */

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {}

@media (max-width: 576px) {
    .dropdown-item { font-size: 0.75em; }
}

@media (max-width: 768px) {
    /* Overlay Boxes */
    .wg-box { position: relative; margin: auto; overflow: hidden; }
    .wg-box .wg-box-overlay { background: rgba(0,0,0,0.7); position: absolute; height: 100%; width: 100%; left: 0; top: 0; bottom: 0; right: 0; opacity: 1; -webkit-transition: none; -moz-transition: none; transition: none; }
    .wg-box:hover .wg-box-overlay { opacity: 1; }
    .wg-box-image { width: 100%; }
    .wg-box-details { position: absolute; text-align: center; padding-left: 1em; padding-right: 1em; width: 100%; top: 50%; left: 0%; opacity: 1; -webkit-transform: none; -moz-transform: none; transform: none; -webkit-transition: none; -moz-transition: none; transition: none; }
    .wg-box:hover .wg-box-details { top: 50%; left: 0%; opacity: 1; }
    .wg-box-details h3 { color: #fff; font-weight: 500; letter-spacing: 0.15em; margin-bottom: 0.5em; text-transform: uppercase; font-size: 1em; }
    .wg-box-details p { color: #fff; font-size: 0.8em; }
    .wg-box-fadeIn-bottom { top: 50%; }

    /* Header Videos */
    #home-jumbotron h1 { font-size: 2.5rem; }
    #home-jumbotron p { font-size: 1rem; }
}


/*==========  Print-Specific  ==========*/
@media print {
    .no-print, .no-print * { display: none !important; }
}
