@charset "UTF-8";
:root {
  --main-color: white;
  --action-color: #0B2E4A;
  --nav-color: #051D31;
  --accent-color: #0B67B2;
  --max-width: 1400px;
  --label-color: #4E91C7;
  --special-menu-color: #E4ECF4;
  --theme-color: transparent;
  --bronze-color: #BD7C44;
  --silver-color: #8b8b8b;
  --gold-color: #d4ae37;
  --platinum-color: #acbec4;
}
header {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  user-select: none;
	background-color: #FFF;
	position: relative;
	overflow: visible;
	z-index: 1001;
}
header a, header a:visited {
  text-decoration: none;
  color: var(--main-color)
}
header .top {
  width: 100%;
  display: flex;
  height: 190px;
  position: relative
}
header .top .logo-container {
  background: #fff0;
  width: 50%;
  padding-left: max(10px, calc(50vw - (var(--max-width) / 2)));
  z-index: 100
}
header .top .logo-container img {
  margin-top: 50px;
  width: 480px;
  margin-left: 25px
}
header .top .action-container {
  width: 50%;
  padding-right: max(10px, calc(50vw - (var(--max-width) / 2)));
  z-index: 200;
  height: 160px;
  top: 30px
}
header .account-container .username {
  display: flex;
  gap: 10px;
  align-items: center
}
header .account-container .username i {
  font-size: 1.4em
}
header .top .account-container {
  width: 100%;
  z-index: 200;
  height: 50px;
  top: -30px;
  position: absolute;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  justify-content: space-between;
  padding-right: max(10px, calc(50vw - (var(--max-width) / 2)));
  padding-left: 120px;
  color: var(--main-color)
}
header .main-menu .account-container {
  width: 100%;
  height: 50px;
  align-items: center;
  box-sizing: border-box;
  justify-content: space-between;
  padding: 10px 20px;
  display: none;
  color: var(--main-color)
}
header .account-container a:hover {
  text-decoration: underline;
	color: #FFF;
}
header .account-container a:visited {
	color: #FFF;
}
header .top .action-container .account-container .background {
  background: var(--accent-color);
  clip-path: polygon(70px 100%, 94px 0, 100% 0, 100% 100%);
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -1;
  top: 0;
  left: 0
}
header .top .action-container .background {
  background: var(--action-color);
  clip-path: polygon(0 100%, 80px 0, 100% 0, 100% 100%);
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -1;
  top: 0;
  left: 0
}
header .top .action-container .account-info {
  height: 60px;
  width: 50vw;
  background: var(--accent-color);
  display: none
}
header .top .logo-container, header .top .action-container {
  box-sizing: border-box;
  position: relative
}
header nav {
  width: 100%;
 /* height: 85px;*/
  box-sizing: border-box;
  padding: 0 max(10px, calc(50vw - (var(--max-width) / 2)));
  background: var(--nav-color);
  z-index: 150;
  display: block;
 /* padding-top: 1px;*/
	font-size: 14px;
	line-height: 1.1;
	position: sticky;
	top: 0;
}
header nav .main-menu {
  width: 100%;
  display: flex;
  color: #fff;
  height: 76px;
  margin: 0;
  justify-content: center;
  list-style: none;
  box-sizing: border-box;
  padding: 0
}
header nav .sub-menu {
  list-style: none;
  width: 100%;
  padding: 0 10px;
}
header nav .sub-menu:first-of-type {
  text-align: right
}
header nav .sub-menu .label {
  color: var(--label-color)
}
header nav .sub-menu .url-main:has(+.url-main), header nav .sub-menu .url-sub:has(+.url-main), header nav .sub-menu .label {
  margin-bottom: 16px
}
header nav .sub-menu .label {
  font-size: 13px;
  font-weight: 600
}
header nav .main-menu > li {
  padding: 10px;
  padding-left: 30px;
  box-sizing: border-box;
  min-width: 140px;
  transition: background-color 150ms
}
header nav .main-menu > li > a {
  display: inline-block;
  position: relative;
  font-weight: 500;
  text-transform: uppercase;
  font-size: .85rem
}
header nav .main-menu > li > a:before {
  content: '>';
  display: block;
  position: absolute;
  left: -15px;
  transform: rotate(90deg) scale(.7, 1.5);
  color: var(--accent-color);
  font-weight: 400;
  transition: transform 300ms
}
header nav .main-menu > li:hover > a:before {
  color: var(--main-color)
}
header nav .main-menu > li:hover {
  background: var(--accent-color)
}
header nav .submenu-container {
  display: none;
  background: var(--accent-color);
  position: absolute;
  width: 100%;
  left: 0;
  top: 76px;
  padding: 40px max(10px, calc(50vw - (var(--max-width) / 2)));
  justify-content: center;
  gap: 30px;
  box-sizing: border-box;
	z-index: 9999;
}
header nav .submenu-container .separator {
  height: 200px;
  background: var(--nav-color);
  opacity: .5;
  width: 1px;
  filter: blur(.5px)
}
header .url-sub {
  font-weight: 200;
  padding-left: 18px;
  display: block
}
header .url-sub:before {
  content: '-';
  position: absolute;
  transform: translateX(-14px)
}
header nav .submenu-container li {
  margin-bottom: 8px;
	padding-bottom: 0
}
header .url-main {
  font-weight: 500
}
header .buttons {
  height: 160px;
  flex: auto;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: flex-end;
  align-items: center;
  justify-content: flex-end;
  gap: 10px
}
header .main-menu .buttons {
  padding: 10px;
  justify-content: flex-start;
  height: auto;
  display: none
}
header .main-menu .search-button {
  left: initial;
  right: 10px;
  font-size: 1.6em
}
header .buttons button {
  transition: background-color 200ms;
  position: relative
}
header .buttons button:hover {
  background: var(--accent-color);
  color: var(--nav-color)
}
header button {
  background: var(--accent-color);
  padding: 9px 19px;
  color: var(--main-color);
  font-family: 'Montserrat';
  border: 0;
  outline: 0;
  cursor: pointer;
  font-size: 16px;
  transition: background-color 200ms, color 200ms
}
header button.join-button {
  background: #c85252
}
header button.who-button:after {
  content: '<';
  transform: rotate(270deg) scale(.8, 1.3);
  display: inline-block;
  margin-left: 10px
}
header .search-button {
  font-size: 1.8em;
  float: left;
  position: absolute;
  left: 90px
}
header .top .mobile-button {
  top: 50%;
  position: absolute;
  left: 50%;
  transform: translate(-5px, -50%);
  color: var(--main-color);
  font-size: 26px;
  border: 2px solid;
  padding: 5px 6px;
  display: none;
  cursor: pointer;
  /*width: 28px;*/
	width: 50px;
  text-align: center
}
header .top .mobile-button .fa-bars {
  display: inline
}
header .top .mobile-button .fa-x {
  display: none
}
header .top .mobile-button.active .fa-bars {
  display: none
}
header .top .mobile-button.active .fa-x {
  display: inline
}
header .main-menu .special-option {
  display: none
}
header .special-menu-container ul li a {
  color: #FFF
}
header .special-menu-container ul {
  list-style: none
}
header .special-menu-container {
  text-align: left;
  background: var(--accent-color);
  color: #FFF;
  position: absolute;
  right: 0;
  width: 350px;
  top: 100%;
  display: none
}
header .who-button:hover .special-menu-container {
  display: block;
  font-size: .9em
}
.special-menu-container li {
  margin: 15px 0;
	padding:0;
}
.special-menu-container li.url-sub {
  font-weight: 400
}
.special-menu-container ul {
  padding: 0 10px
}
header li.url-sub:hover > a, header li.url-main:hover > a, header li.url-mobile:hover > a {
  text-decoration: underline;
	color: #FFF;
}
header .decorator {
  position: absolute;
  width: 100%;
  background: #0B67B2;
  height: 10px;
  bottom: 0
}
header .decorator.robotics {
	background: #a71f23;
}
header .decorator.vision {
	background: #4cb74d;
}
header .decorator.motion {
	background: #f15a25;
}
header .decorator.ai {
	background: #4F1C54;
}
header .decorator.mexico {
	background: #30c7ab;
}
header .decorator.a3 {
	background: #FFF;
}
header .upgrade-button {
  display: flex;
  align-items: center;
  padding: 5px 12px;
  text-align: left;
  height: 37px;
  box-sizing: border-box;
  gap: 8px
}
header .bronze-button {
  background: var(--bronze-color)
}
header .silver-button {
  background: var(--silver-color)
}
header .gold-button {
  background: var(--gold-color)
}
header .platinum-button {
  background: var(--platinum-color)
}
header .upgrade-button div {
  display: flex;
  flex-direction: column
}
header .upgrade-button span {
  font-size: .6em
}
header .upgrade-button i {
  font-size: 1.2em
}
header.logged-in .join-button, header.logged-in .login-button {
  display: none
}
header.logged-out .upgrade-button, header.logged-out .account-container {
  display: none
}
.fa-magnifying-glass {
  transition: color 150ms
}
.fa-magnifying-glass:hover {
  color: var(--accent-color)
}
@media (width < 1400px) {
  header nav .main-menu > li {
    min-width: initial
  }
}
@media (width>1080px) {
  header nav .main-menu > li:hover .submenu-container {
    display: flex
  }
}
@media (width <=1080px) {
	header {position: fixed;
	width: 100%;
	}
  header nav {
    height: auto;
    padding: 0;
    background: var(--action-color)
  }
  header nav .main-menu {
    flex-direction: column;
    height: auto;
    padding: 0;
    margin-top: 0;
    margin-bottom: 0
  }
  header nav .submenu-container {
    position: relative;
    display: block;
    padding: 0;
    top: 0;
    overflow: hidden;
    max-height: 0;
    transition: max-height 300ms, background-color 150ms;
    background: var(--action-color)
  }
  header nav .submenu-container .separator {
    display: none
  }
  header nav .main-menu > li:hover {
    background: initial
  }
  header nav .main-menu > li {
    width: 100%;
    max-width: 100%;
    padding: 0
  }
  header nav .main-menu > li.active .submenu-container {
    display: block;
    padding: 0;
    max-height: 200vh;
    transition: max-height 600ms, background-color 150ms;
    background: var(--accent-color)
  }
  header .top .logo-container img {
    max-height: 70px;
    margin: 0;
    width: initial
  }
  header .top .action-container {
    top: 0;
    width: 120px;
    height: 100%
  }
  header .action-container .buttons, .account-info {
    display: none
  }
  header .top .logo-container {
    width: calc(100% - 120px);
    display: flex;
    align-items: center;
    justify-content: flex-start
  }
  header .top {
    height: 100px;
    box-shadow: 0 10px var(--theme-color)
  }
  header nav .main-menu > li > a {
    text-transform: initial;
    font-size: 1rem !important;
    padding: 10px 30px !important;
    width: 100%;
    box-sizing: border-box;
    user-select: none;
	  line-height: 1.1 !important;
  }
  header nav .main-menu > li {
    transition: background-color 150ms
  }
  header nav .main-menu > li.active {
    background: var(--accent-color)
  }
  header .top .action-container .background {
    clip-path: polygon(0 100%, 40px 0, 100% 0, 100% 100%)
  }
  header nav .main-menu > li > a:before {
    left: 10px;
    font-weight: 500;
    color: var(--main-color);
    font-size: .8em;
    top: .9em
  }
  header nav .main-menu > li.active > a:before {
    transform: rotate(270deg) scale(.7, 1.5)
  }
  header nav .sub-menu:first-of-type {
    text-align: left
  }
  header nav .sub-menu {
    padding: 0 20px
  }
  header nav .sub-menu li:first-of-type, header nav .sub-menu li:first-of-type:hover {
    padding-top: 5px !important;
    border-top: 1px solid var(--label-color) !important;
  }
  header nav .main-menu {
    overflow: hidden;
    max-height: 0;
    transition: max-height 200ms;
    justify-content: flex-start
  }
  header nav .main-menu.active {
    max-height: calc(100vh);
    max-height: calc(100dvh - 100px);
    overflow: auto;
    padding-bottom: 15px
  }
  header .top .mobile-button {
    display: block
  }
  header .main-menu .special-option {
    display: block
  }
  header .main-menu .buttons {
    display: block;
    position: relative
  }
  header .decorator {
    display: none
  }
  header .main-menu .account-container {
    display: flex
  }
  header .action-container .account-container {
    display: none
  }
  header.logged-out .main-menu .account-container {
    display: none
  }
  header nav .submenu-container li {
    margin-bottom: 10px;
    font-size: .95em
  }
  header nav .sub-menu .label {
    font-size: 11px;
    margin-bottom: 7px
  }
  header .url-sub, header .url-main, header .url-mobile, header .label {
    font-size: .95em;
    margin-left: 10px
  }
  header .url-sub {
    margin-left: 3px
  }
  header .url-sub:before {
    transform: translateX(-10px)
  }
  header nav .sub-menu {
    box-sizing: border-box
  }
}


/****added****/
.submenu-short .submenu-container ul:nth-of-type(5) {
	display: none;
}
.logo-container img {
	width: 100% !important;
}
.url-mobile {display:none;}
@media (max-width:1080px) {
	.url-mobile {display:block; font-weight: 500; margin-left: 0 !important;}
}
a.cta-txt {
	background-color: #1c4f8c;
	border-radius: 3px;
	border: 1px solid #11417c;
	display: block;
	text-align: center;
	padding: 6px 3px;
	box-shadow: 0 1px 0 0 #4c83c5;
	margin-bottom: 6px;
}
a.cta-txt span {
	font-weight: 700;
}
a.cta-txt:hover {
	background-color: #123b6b;
}
a.cta-img-link-mobile {display: none;}
@media (max-width:1080px) {
	a.cta-img-link-desktop { display: none; }
	a.cta-txt, a.cta-img-link-mobile { display: inline-block;padding: 6px 10px; margin: 4px 0 }
	a.cta-img-link-mobile { background-color: #1c4f8c; border-radius: 3px; border: 1px solid #11417c; text-align: center; box-shadow: 0 1px 0 0 #4c83c5;}
}