/*
Theme Name: Armor Alloy
Author: Stevens & Stevens
Description: Donate: https://opencollective.com/blankslate. Learn: https://blankslate.me/. BlankSlate is the definitive WordPress boilerplate starter theme. I've carefully constructed the most clean and minimalist theme possible for designers and developers to use as a base to build websites for clients or to build completely custom themes from scratch. Clean, simple, unstyled, semi-minified, unformatted, and valid code, SEO-friendly, jQuery-enabled, no programmer comments, standardized and as white label as possible, and most importantly, the CSS is reset for cross-browser-compatability, with no intrusive visual CSS styles added whatsoever. A perfect skeleton theme. For support and suggestions, go to: https://github.com/webguyio/blankslate/issues. Thank you.
Tags: accessibility-ready, one-column, two-columns, custom-menu, featured-images, microformats, sticky-post, threaded-comments, translation-ready
Version: 2025
Requires at least: 5.2
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v3 or Later
License URI: https://www.gnu.org/licenses/gpl.html
Text Domain: blankslate

BlankSlate WordPress Theme 2011-2025
BlankSlate is distributed under the terms of the GNU GPL
*/


		
		   :root {
      --bs-primary: #00aeef; /* Replace with your desired color */
    }


html {
  scroll-padding-top: 90px; /* height of sticky header */
}


    .btn-outline-primary {
    --bs-btn-color: #00aeef;
    --bs-btn-border-color: #00aeef;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #00aeef;
    --bs-btn-hover-border-color: #00aeef;
    --bs-btn-focus-shadow-rgb: 13, 110, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #00aeef;
    --bs-btn-active-border-color: #00aeef;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #00aeef;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #00aeef;
    --bs-gradient: none;
}

.btn {
	transition: all .5s ease-in;
}

section.black-bg.flyer-section-bg.sticky-menu {
  background-size: 150%;
}

@media (min-width: 992px) {
  section.black-bg.flyer-section-bg.sticky-menu {
  background-size: 100%;
}

}


.section {
  overflow-x: hidden;
}
		body {
overflow-x: hidden;
  overflow-y: scroll;
  font-size: 1.3rem;

}

.animated-background {
  background-image: url('your-image.jpg');
  background-size: 100% 100%; /* Initial size */
  animation: zoomBackground 10s infinite alternate; /* Animation details */
}

@keyframes zoomBackground {
  0% {
    background-size: 100% 100%;
  }
  100% {
    background-size: 120% 120%; /* Scales to 120% of its original size */
  }
}


a {
  color: #f5821f;
}

html, body {
  margin: 0;
  
 -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
}

button.wpforms-submit {
	background-color: #00aeef!important;
	transition: all .5s ease-in;
}

.wpforms-field-label {
	color: #fff!important;
}

.wrapper {
  height: 100%;
}

.sticky-menu {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 99;
}
/*.sticky-menu {
  position: sticky;
  top: 0;
  z-index: 99;
}*/

.panel {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 600;
  font-size: 1.5em;
  text-align: center;
  color: white;
  position: relative;
  box-sizing: border-box;
  padding: 10px;

}

.panel-normal {
  min-height: 100vh;
  
}



.section-padding {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.pt-vh {
  margin-top: 100vh;
}



h1, h2, h3, h4 {
  font-family: "Saira", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

h1 {
  font-size: 2rem;
  letter-spacing: .05rem;
}

h2 {
  font-size: 1.6rem;
  letter-spacing: .05rem;
}

h3 {
  font-size: 1.2rem;
  letter-spacing: .05rem;
}

.no-underline {
  text-decoration: none;
}

.no-underline:hover {
  text-decoration: underline;
}

a.nav-link {
   font-family: "Saira", sans-serif;
  font-optical-sizing: auto;
  text-transform: uppercase;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

.opacity-hover:hover {
  opacity: .8;
}

.btn.btn-general {
    background-color: #4c4a4b;
    color: #fff;
}

.main-logo {
  width: 200px;
}

.btn.btn-general:hover {
    background-color: #000;
   
}

.footer {
  font-size: 1.2rem;
  color: #7e7e7e;
}

.large-5x {
  font-size: 4rem;
    line-height: 3rem;
}

.tech-bg-data {
  position: absolute;
  bottom: 0;
  width: 100%;
  z-index: 0;
}

.flyer-section-bg {
  background-image: url(/assets/images/flyer-section-bg.jpg);
      background-size: auto;
      background-position-x: center;
    background-repeat: no-repeat;
}

.panel-wrapper {
  max-width: 100vw; 
  height: 100vh;
  overflow-x: hidden;
}

/* BREAKPOINT */

@media (min-width: 768px) {

  .hp-infographic-area-right-border {
    border-right: 1px solid #ffffff50;
  }

}

/*BREAKPOINT*/

@media (min-width: 992px) {

  body {
    font-size: 1.5rem;
    line-height: 2.4rem;
}


.large-5x {
  font-size: 4rem;
    line-height: 4rem;
}



.infographic-text {
  font-size: 1.3rem;
  line-height: 2.2rem
}

.infographic-text hr {
   display: block;
  height: 1px;
  border: 0;
  border-top: 2px solid #fff;
  margin: 1em 0;
  padding: 0;
}

h1 {
  font-size: 3.0rem;
}

h2 {
  font-size: 2.4rem;
}

h3 {
  font-size: 1.9rem;
}

a.nav-link {
  font-size: 1.0rem;
}

}

/*BREAKPOINT*/

@media (min-width: 1400px) {
 

.infographic-text {
  font-size: 1.5rem;
  line-height: 2.4rem
}

html {
  font-size: 20px;
}

  body {
    font-size: 1.5rem;
    line-height: 2.4rem;
}




.flyer-section-bg {
 
      background-size: contain;
    
}

}

/*BREAKPOINT*/

@media (min-width: 2000px) {


html {
  font-size: 25px;
}

a.nav-link {
  font-size: 1.5rem;
}

.large-5x {
  font-size: 5rem;
    line-height: 4rem;
}



.section-padding {
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.infographic-text {
  font-size: 1.8rem;
  line-height: 2.7rem
}

.main-logo {
    width: 250px;
}

  }

.grey-bg {
	background-color: #ccc;
}

.bright-blue {
  color: #00aeef;
}

.orange {
  color: #ed7422;
}

.white-bg {
	background-color: #fff;
}

.black-background {
  background-color: #000;
  color: #fff;
}

.black-background .wpforms-field {
  color: #000!important;}


.black {
  color: #000!important;
}

.white {
  color: #fff!important;
}

.vert-center {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.u-case {
  text-transform: uppercase;
}

.w-65 {
  width: 65%;
}

.fw-400 {
  font-weight: 400;
}

.fw-800 {
  font-weight: 800;
}

.list-none {
  list-style: none;
}

.img-notchUp {
  position: relative;
  top: -15%;
}

.blog-cat-line {
	font-size: 1rem;
}

.flyer-column {
  display: flex;
  flex-direction: column;
  justify-content: end;
}

ul.large-carat-bullet {
  list-style: none;
}

ul.large-carat-bullet li {
background-image: url(/assets/images/carat-bullet-image.png);
    background-repeat: no-repeat;
    padding-left: 3rem;
    margin-top: 15px;
    background-size: 2.2rem;

}

.orange-tech-background {
  background-image: url(/assets/images/orange-tech-bg.jpg);
  background-size: cover;
}

.light-grey-stripe-bg {
  background-image: url(/assets/images/light-grey-stripe-background.jpg);
  background-size: cover;
}

.bg-cover {
  background-size: cover!important;
}
#background-video {
    width: 100vw;
    height: 100vh;
    object-fit: cover;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 2;
    min-height: 800px;
    opacity: 1;
}

.wrapper {
  height: 100vh;
  width: 100vw;

}

.panel.align-top {
  align-items: flex-start;
}

.panel h1 {
  font-size: 1.0em;
  color: white;
  font-weight: 300;
  margin: 0 auto;
  text-shadow: 2px 2px 6px #000000;
  padding-left: 25%;
  padding-right: 25%;
  font-weight: 700;
  text-transform: uppercase;
      font-weight: 600;
    text-transform: uppercase;
    letter-spacing: -.03rem;
}

.panel.description {
  padding-bottom: 60px;
}
.panel p, .panel li {
  color: black;
  font-weight: 400;
  text-align: left;
  font-size: 0.8em;
  line-height: 1.5em;
  margin: 0.3em 0 1em 0;
}
.panel p strong, .panel li strong {
  color: white;
  font-weight: 400;
}
.panel p code, .panel li code {
  background-color: rgba(255,255,255,0.15);
  padding: 2px 4px;
  border-radius: 5px;
}
.panel li {
  margin: 0;
}


.bgOne {
	background-size: cover;
  background-position: center top;
  background-image: url(/assets/images/panel1-mobile.jpg);
}

.bgTwo{
	background-size: cover;
  background-position: center top;
  background-image: url(/assets/images/panel2-mobile.jpg);
}

.bgThree{
	background-image: url(/assets/images/aa-bg3-mobile.jpg);
	background-size: cover;
	background-position: center top;
}



.bgFour{
	background-image: url(/assets/images/aa-bg4-mobile.jpg);
	background-size: cover;
	background-position: center center;
}



@media (min-width: 500px) {

.bgOne {
   background-image: url(/assets/images/panel1-tablet.jpg);
}

.bgTwo {
   background-image: url(/assets/images/panel2-tablet.jpg);
}

.bgThree{
  background-image: url(/assets/images/aa-bg3-tablet.jpg);
 
}

.bgFour {
  background-image: url(/assets/images/aa-bg4-tablet.jpg);
}

}

@media (min-width: 900px) {

.bgOne {
   background-image: url(/assets/images/panel1.jpg);
}

.bgTwo {
   background-image: url(/assets/images/panel2.jpg);
}

.bgThree{
  background-image: url(/assets/images/aa-bg3.jpg);
 
}

.bgFour {
  background-image: url(/assets/images/aa-bg4.jpg);
}

}

@media (min-width: 992px) {
  .navbar-nav li {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
}

@media (max-width: 500px) {
.container-fluid {
  overflow-x: hidden;
  width: 100vw;
}
}





.wpforms-field input {
  color: #000;
}

.text-shadow {
  text-shadow: 2px 2px 7px #000000;
}

.background-vid-cont {
  position: relative;
    z-index: 0;
    min-height: 700px; 
    height: 90vh;
    overflow: hidden;
    margin-top:32px;
    aspect-ratio:16/9;
    background-color: #000;
}

.hero-title-cont {
  position: relative;
  height:90vh;
  min-height: 700px;
}

.fade-in1 {
  opacity: 1;
  animation-name: fadeInOpacity;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in;
  animation-duration: 25s;
}

@keyframes fadeInOpacity {
  0% {
    opacity: 0;
   
    
  }
   2% {
    opacity: 0;
    transform: translateY(-70px)
    
  }
 3% {
    opacity: 1;
    transform: translateY(0)
  }
  16% {
    opacity: 1;
    
  }
  20% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

.fade-in2 {
  opacity: 1;
  animation-name: fadeInOpacity2;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in;
  animation-duration: 25s;
}

@keyframes fadeInOpacity2 {
0% {
    opacity: 0;
  }
  22% {
    opacity: 0;
    transform: translateY(-70px)
  }
 23% {
    opacity: 1;
    transform: translateY(0)
  }
  29% {
    opacity: 1;
  }
  32% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

.fade-in3 {
  opacity: 1;
  animation-name: fadeInOpacity3;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in;
  animation-duration: 25s;
}

@keyframes fadeInOpacity3 {
0% {
    opacity: 0;
  }
  34% {
    opacity: 0;
    transform: translateY(-70px)
  }
 35% {
    opacity: 1;
    transform: translateY(0)
  }
  45% {
    opacity: 1;
  }
  47% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

.fade-in4 {
  opacity: 1;
  animation-name: fadeInOpacity4;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in;
  animation-duration: 25s;
}

@keyframes fadeInOpacity4 {
0% {
    opacity: 0;
  }
  46% {
    opacity: 0;
    transform: translateY(-70px)
  }
 47% {
    opacity: 1;
    transform: translateY(0)
  }
  56% {
    opacity: 1;
  }
 59% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

.bounce {
  opacity: 1;
  animation-name: bounce;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in;
  animation-duration: 2s;
}

@keyframes bounce {
0% {
    transform: translateY(0)
  }
  25% {
    opacity: .5;
    transform: translateY(-20px)
  }

  100% {
    transform: translateY(0)
  }
}

@media (max-width: 991px) {
  #background-video {
    
    object-fit: contain;
    min-height: unset;
    height: unset;

    
}

.background-vid-cont {
  height: auto;
  min-height: unset;
  margin-top: 68px;

}

    .hero-title-cont {
        position: relative;
        height: unset;
        min-height: unset;
        aspect-ratio: 16 / 6;
        top: 65px;
    }

   .hero-title-cont h1 {
    font-size: 1.5rem;
    
}

}



