@font-face {
    font-family: karla;
    src: url('./Karla-VariableFont_wght.ttf');
}
html, body {
  overflow-x: hidden;
}
body {
  position: relative;
}
#header {
  background-color: #f8f8f8;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 0;
  padding-bottom: 0;
  min-height: calc(170px + 6rem);
  height: calc(170px + 6rem);
  max-height: calc(170px + 6rem);
  border-top: 5px solid rgb(240, 88, 90);
}
#subheader {
  background-image: url("../img/bg-atoms-2.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: left top;
  margin-top: calc(170px + 6rem);
}
#main, .first-section {
  margin-top: calc(170px + 6rem);
}
body, html {
  background-color: #f8f8f8;
  font-family: 'karla';
}
.uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6, .uk-heading-2xlarge, .uk-heading-large, .uk-heading-medium, .uk-heading-small, .uk-heading-xlarge, h1, h2, h3, h4, h5, h6, p {
  font-family: 'karla';
}
#header h1 { transition: all 0.1s ease-in-out; }
#header .uk-container {
  /* transition: all 0.1s ease-in-out; */
  padding-top: 3rem;
  padding-bottom: 3rem;
}
#header.uk-sticky.uk-active .uk-container {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
#header #logo {
  /* transition: all 0.1s ease-in-out; */
  max-height: 170px;
}
#header.uk-sticky.uk-active {
  max-height: calc(60px + 2rem);
  border-top: 0;
  min-height: calc(60px + 2rem);
}
#header.uk-sticky.uk-active #logo {
  max-height: 60px;
}
.uk-heading-bullet::before {
  border-left-color: #bbb;
}
#aboutus {
  background-image: url("../img/bg-atoms-3.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center bottom;
}
#aboutus img:not(.linkedin) {
  filter: grayscale(100%);
  max-width: 200px;
  width: 100%;
  transition: all 0.2s ease-in-out;
}
#aboutus img:hover {
  transform: scale(1.1);
}
.uk-button-danger {
  background-color: #f0585a;
}
.uk-button-danger:hover {
  background-color: #d64f52;
}
#header a.uk-button {
  border-bottom: 3px solid transparent;
}
#header a.uk-button:hover {
  /* border-bottom: 3px solid rgb(15, 66, 112); */
  /* background-color: rgb(15, 66, 112, 0.1); */
}
.menu-dropdown {
  scale: 2;
  cursor: pointer;
  min-width: 40px;
}
#main-nav .uk-button {
  font-size: 110%;
}
#selenium_wrap {
  background-color: #ddd;
  /* background-image: url("../img/bg-atoms-5.jpg"); */
  background-repeat: no-repeat;
  background-position: 100% center;
}
#selenium {
  background-image: url("../img/selenium.png");
  background-repeat: no-repeat;
  background-position: 20% 20%;
}
#footer {
  padding-top: 7rem;
  padding-bottom: 7rem;
}
.patented {
  background-color: rgb(240, 88, 90);
  background-image: url("../img/bg-atoms-4.jpg");
  background-repeat: no-repeat;
  background-position: right bottom;
}
.platform {
  background-color: #0f4270;
  background-image: url("../img/bg-atoms-6.jpg");
  background-repeat: no-repeat;
  background-position: left bottom;
}
.about-us-photo {
  filter: grayscale(100%);
  max-height: 300px;
  margin-top: -60px;
  margin-left: -60px;
}
.about-us-photo-odd {
  margin-left: 0;
  margin-right: -60px;
}
.from-the-article {
  font-style: italic;
}
.more-active {
  max-height: 5px;
  margin-bottom: 1rem;
  width: 100%;
  background-color: #666 !important;
  color: #666 !important;
  border-color: #666 !important;
}
.linkedin {
  padding: 3px;
  background-color: #fff;
  max-height: 25px;
}
@media screen and (max-width: 639px) {
  .about-us-photo {
    filter: grayscale(100%);
    max-height: 300px;
    margin-top: -60px;
    margin-left: -60px;
  }
  .about-us-photo-odd {
    margin-right: 0;
    margin-left: -60px;
  }
}
@media screen and (min-width: 640px) and (max-width:959px) {
  .about-us-photo {
    filter: grayscale(100%);
    max-height: 300px;
    margin-top: -60px;
    margin-left: -40px;
  }
  .about-us-photo-odd {
    margin-right: 0;
    margin-left: -40px;
  }
}
@media screen and (min-width: 960px) and (max-width:1199px) {
  .about-us-photo {
    filter: grayscale(100%);
    max-height: 300px;
    margin-top: -40px;
    margin-left: -40px;
  }
  .about-us-photo-odd {
    margin-left: 0;
    margin-right: -40px;
  }
}