@charset "UTF-8";

/* Fonts */

@font-face {
  font-family: "Exo 2";
  src: url('../fonts/Exo2-Regular.ttf') format('truetype');
  font-weight: 400; /* Normal / Regular */
  font-style: normal;
}

@font-face {
  font-family: "Exo 2";
  src: url('../fonts/Exo2-SemiBold.ttf') format('truetype');
  font-weight: 600; /* Semi-Bold */
  font-style: normal;
}

@font-face {
  font-family: "Exo 2";
  src: url('../fonts/Exo2-Bold.ttf') format('truetype');
  font-weight: 700; /* Bold */
  font-style: normal;
}

@font-face {
  font-family: "joesecurity";
  src: url("../fonts/joesecurity.woff2") format("woff2"),
       url("../fonts/joesecurity.woff") format("woff"),
       url("../fonts/joesecurity.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

/*-- Root ----------*/

:root {
  --font-heading: "Exo 2", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-body: Arial, "Helvetica Neue", Helvetica, sans-serif;
  --font-base: 1rem;
  --bold: 700;
  --semibold: 600;
  --regular: 400;
  --blue-hue: 205;
  --blue-900: hsl(var(--blue-hue), 65%, 8%);
  --blue-800: hsl(var(--blue-hue), 65%, 16%);
  --blue-700: hsl(var(--blue-hue), 65%, 24%);
  --blue-600: hsl(var(--blue-hue), 65%, 28%);
  --blue-500: hsl(var(--blue-hue), 65%, 34%); /* Joe blue */
  --blue-400: hsl(var(--blue-hue), 50%, 54%); 
  --blue-300: hsl(var(--blue-hue), 50%, 64%);
  --blue-200: hsl(var(--blue-hue), 50%, 74%);
  --blue-100: hsl(var(--blue-hue), 49%, 84%);
  --blue-50:  hsl(var(--blue-hue), 51%, 96%);
  --blue-link: hsl(var(--blue-hue), 70%, 40%);
  --red-hue: 359;
  --red-900: hsl(var(--red-hue), 80%, 12%);
  --red-800: hsl(var(--red-hue), 80%, 20%);
  --red-700: hsl(var(--red-hue), 80%, 28%);
  --red-600: hsl(var(--red-hue), 80%, 40%);
  --red-500: hsl(var(--red-hue), 80%, 52%); /* Joe red */
  --red-400: hsl(var(--red-hue), 80%, 64%);
  --red-300: hsl(var(--red-hue), 80%, 76%);
  --red-200: hsl(var(--red-hue), 80%, 88%);
  --red-100: hsl(var(--red-hue), 80%, 96%);
  --red-50:  hsl(var(--red-hue), 80%, 98%);
  --black-900: #010101;
  --black-800: #343434;
  --black-700: #484848;
  --black-600: #5D5D5D;
  --black-500: #858585;
  --black-400: #ADADAD;
  --black-300: #C2C2C2;
  --black-200: #D6D6D6;
  --black-100: #EBEBEB;
  --black-50: #F5F5F5;
  --white: #ffffff;
	--nav-h: 155px;
}

:target { scroll-margin-top: var(--nav-h); }

.text-black900 {
	color: var(--black-900)
}
.text-white {
	color: var(--white)
}


/*-- Native ----------*/

html {
  color: var(--black-800);
  font-family: var(--sans-body);
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
html, body {
  height: 100%;
}
a {
  color: var(--blue-link);
}
a:hover {
  color: var(--blue-600);
}
a:focus { 
    outline: none; 
}
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
}
p {
  /*font-size: 1rem;
  line-height: 1.5rem;
  margin: 0 0 1rem;*/
  text-align: left;
}

@media (max-width: 767px) {
  html {overflow-x: hidden;}
}

/*-- Top nav ----------*/

#grey-top-nav{
  background-color: var(--black-200);
  padding: 0;
}
#grey-top-nav ul{
  margin: 0;
}
#grey-top-nav ul li{
  font-family: var(--font-heading);
  font-weight: var(--semibold);
  list-style: none;
  background-color: var(--black-100);
  float: left;
}
#grey-top-nav ul li:hover{
  background-color: var(--black-50);
}
#grey-top-nav ul li a{
  display: inline-block;
  color: #5e717f;
}
#grey-top-nav-left li a{
  padding: 12px 28px;
  font-size: 14px;
}
#grey-top-nav ul li a:hover{
  color: var(--blue-link);
  text-decoration: none;
}
#grey-top-nav-right{
  float: right;
}
#grey-top-nav #grey-top-nav-right li{
  background-color: initial;
}
#grey-top-nav #grey-top-nav-right li a{
  padding: 9px 0px 5px 15px;
}
#grey-top-nav-left li{
  margin-right: 3px;
}
#grey-top-nav-right .icon:hover{
  color: #00253e;
}
#grey-top-nav-right .icon{
  color: #5e717f;
  font-size: 19px;
  margin: 0px 8px;
}

@media (max-width: 1030px) {
  #grey-top-nav-left li {
    border-bottom: 1px solid grey;
    display: table;
    height: 61px;
    flex-basis: auto;
    width: 48%;
  }
  #grey-top-nav-left {
    align-items: stretch;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  #grey-top-nav-right{
    display: none;
  }
  #grey-top-nav ul li a{
    vertical-align:middle;
    display: table-cell;
  }
}
@media (max-width: 480px) {
  #grey-top-nav-left li {
    height: 48px;
  }
  #grey-top-nav-left li a{
    padding: 0px 28px;
  }
}

/*-- Navbar ----------*/

.navbar .btn-navbar:hover,
.navbar .btn-navbar:active,
.navbar .btn-navbar.active,
.navbar .btn-navbar.disabled,
.navbar .btn-navbar[disabled] {
    background-color: var(--blue-500);
}
.navbar-fixed-top,
.navbar-fixed-bottom {
  position: fixed;
  position: sticky;
}
.navbar-inner {
  padding: .75rem 0;
  background: white;
  box-shadow: none;
  border-bottom: 1px solid #dbdbdb;
}
.navbar .nav > li > a {
  font-size: 1rem;
  text-align: right;
  color: #929292;
  -webkit-transition: color 1s linear;
  -moz-transition: color 1s linear;
  -o-transition: color 1s linear;
  transition: color 1s linear;
}
.navbar .nav > li > a:hover {
  color: var(--blue-link);
}
.navbar .nav .active > a,
.navbar .nav .active > a:hover {
  color: var(--blue-link);
}

.navbar .nav.pull-right {
    margin-left: 0;
}
.navbar .nav.pull-right > li > a {
  padding: 4px 0;
}

/*-- Subnav ----------*/

.bigger-subnav{
  font-size: 18px;
  margin-bottom: 15px;
  display: inline-block;
}
#subnav-line1, #subnav-line2, #subnav-line3{
  position: absolute;
  left: 244px;
  top: 20px;
  height: 194px;
  width: 1px;
  background-color: var(--black-100);
}
#nav2 #subnav-line1, #nav2 #subnav-line2, #nav2 #subnav-line3{
  height: 303px;
}
#subnav-line2{
  left: 519px;
}
#subnav-line3{
  left: 739px;
}
#productsSubnav,
#technologySubnav,
#solutionsSubnav{
  display: none;
  position: relative;
}
li#technologyNav:hover #technologySubnav{
  display: block;
}
li#productsNav:hover #productsSubnav{
  display: block;
}
li#solutionsNav:hover #solutionsSubnav{
  display: block;
}
#productsSubnav a,
#technologySubnav a,
#solutionsSubnav a{
  text-decoration: none;
  color: var(--blue-link);
}
#productsSubnav a:hover,
#technologySubnav a:hover,
#solutionsSubnav a:hover{
  text-decoration: underline;
  color: var(--blue-link);
}
#productsSubnav,
#technologySubnav,
#solutionsSubnav{
  box-shadow: 0px 2px 2px rgba(0,0,0,0.20);
  color: var(--black-900);
  padding: 20px;
  padding-left: 39px;
  left: -312px;
  top: 58px;
  width: 900px;
  height: 200px;
  background: white;
  border: #dbdbdb 1px solid;
  position: absolute;
  -webkit-border-bottom-right-radius: 11px;
  -webkit-border-bottom-left-radius: 11px;
  -moz-border-radius-bottomright: 11px;
  -moz-border-radius-bottomleft: 11px;
  border-bottom-right-radius: 11px;
  border-bottom-left-radius: 11px;
}
#nav2 #productsSubnav{
  height: 300px;
}
#technologySubnav{
  left: 288px;
  width: 251px;
  height: 145px;
}
#solutionsSubnav{
  left: -105px;
  width: 263px;
  height: 145px;
}
.subnavTitle{
  border: #dbdbdb 1px solid;
  border-bottom: none;
  top: -69px;
  left: 420px;
  position: absolute;
  width: 100px;
  height: 68px;
  background: white;
  color: var(--black-900);
  -webkit-border-top-left-radius: 11px;
  -webkit-border-top-right-radius: 11px;
  -moz-border-radius-topleft: 11px;
  -moz-border-radius-topright: 11px;
  border-top-left-radius: 11px;
  border-top-right-radius: 11px;
}
#technologyNav .subnavTitle{
  left: 88px;
  width: 122px;
}
#solutionsNav .subnavTitle{
  left: 111px;
  width: 106px;
}
.subnavTitle a{
  color: var(--black-900);
  font-size: 16px;
  display: block;
  margin-top: 14px;
  margin-left: 16px;
  font-weight: bold;
}
.subnavTitle a:hover{
  text-decoration: none;
}
.left-text{
  width: 363px;
}
.technology-block p.left-text{
  width: 550px;
}
.product-page .tab-content{
  width: 940px;
}

@media (max-width: 1030px) {
  .navbar-fixed-top{
    margin-bottom: 0;
    position: relative;
    z-index: 99;
  }
  .navbar .btn-navbar {
      margin-top: 16px;
  }
  li#technologyNav:hover #technologySubnav{
    display: none;
  }
  li#productsNav:hover #productsSubnav{
    display: none;
  }
  li#solutionsNav:hover #solutionsSubnav{
    display: none;
  }
  li:hover #technologySubnav{
    display: none;
  }
  li:hover #productsSubnav{
    display: none;
  }
  li:hover #solutionsSubnav{
    display: none;
  }
  .nav-collapse.collapse.in, .nav-collapse.collapsing{
    border-top: 1px solid #f1f1f1;
  }
  .navbar .nav > li > a{
    text-align: center;
  }
  .nav li {
    text-align: center;
  }
  .nav li a {
    display: inline-block;
  }
  .navbar .nav > li > a {
    width: 80%;
  }
}

@media (max-width: 767px) {
  li#technologyNav:hover #technologySubnav{
    display: none;
  }
  li#productsNav:hover #productsSubnav{
    display: none;
  }
  li#solutionsNav:hover #solutionsSubnav{
    display: none;
  }
  li:hover #technologySubnav{
    display: none;
  }
  li:hover #productsSubnav{
    display: none;
  }
  li:hover #solutionsSubnav{
    display: none;
  }
}

@media (max-width: 480px) {
  .nav:not(.nav-tabs) li{
    border-bottom: 1px solid #ededed;
  }
  .nav:not(.pull-right){
    margin-bottom: 32px;
  }
  .nav.pull-right li{
    border: none;
  }
  .nav-collpase{
    margin-right: 10px;
  }
  li#technologyNav:hover #technologySubnav{
    display: none;
  }
  li#productsNav:hover #productsSubnav{
    display: none;
  }
  li#solutionsNav:hover #solutionsSubnav{
    display: none;
  }
  li:hover #technologySubnav{
    display: none;
  }
  li:hover #productsSubnav{
    display: none;
  }
  li:hover #solutionsSubnav{
    display: none;
  }
  .navbar-fixed-top .navbar-inner .nav-collpase{
    width: 85%;
    margin: 0 auto;
  }
  .navbar .brand{
    width: 200px;
  }
}

@media (max-width: 320px) {
  li#technologyNav:hover #technologySubnav{
    display: none;
  }
  li#productsNav:hover #productsSubnav{
    display: none;
  }
  li#solutionsNav:hover #solutionsSubnav{
    display: none;
  }
  li:hover #technologySubnav{
    display: none;
  }
  li:hover #productsSubnav{
    display: none;
  }
  li:hover #solutionsSubnav{
    display: none;
  }
}

/*-- Container ----------*/

@media (max-width: 767px) {
  .container {width: 100%;}
}

/*-- Flex grid ----------*/

.flex {display: flex}
.flex-row {flex-direction: row}
.flex-column {flex-direction: column}
.flex-wrap {flex-wrap: wrap}
.flex-nowrap {flex-wrap: nowrap}

/*-- Grid grid ----------*/

.grid {
  display: grid;
}
.grid-af-column {
  grid-auto-flow: column;
}
.grid-4 {
  grid-template-columns: repeat(4, 1fr);
}
.grid-3 {
  grid-template-columns: repeat(3, 1fr);
}
.grid-2 {
  grid-template-columns: repeat(2, 1fr);
}

/* Tablet */
@media (max-width: 768px) {
  .grid-4 {
    grid-template-columns: repeat(2, 1fr); /* 2 columns */
  }
  .grid-3 {
    grid-template-columns: repeat(2, 1fr); /* 2 columns */
  }
}

/* Mobile */
@media (max-width: 480px) {
  .grid-4 {
    grid-template-columns: 1fr; /* 1 column */
  }
  .grid-3 {
    grid-template-columns: repeat(1, 1fr); /* 2 columns */
  }
}

/*-- Helpers ----------*/

/*-- Helpers: icon ----------*/

/*-- Helpers: font ----------*/

.font-primary {font-family: var(--font-heading)}
.font-normal {font-weight: 400}
.font-bold {font-weight: 600}
.font-semibold {font-weight: 700}

/*-- Helpers: text ----------*/

.text-xs {font-size: 0.75rem;line-height: 1rem;}
.text-sm {font-size: 0.875rem;line-height: 1.25rem;}
.text-base {font-size: 1rem;line-height: 1.5rem;}
.text-lg {font-size: 1.125rem;line-height: 1.75rem;}
.text-xl {font-size: 1.25rem;line-height: 1.75rem;}
.text-2xl {font-size: 1.375rem;line-height: 1.75rem;}
.text-3xl {font-size: 1.5rem;line-height: 2rem;}
.text-4xl {font-size: 1.875rem;line-height: 2.25rem;}
.text-5xl {font-size: 2.25rem;line-height: 2.5rem;}
.text-6xl {font-size: 3rem;line-height: 1;}
.text-7xl {font-size: 3.75rem;line-height: 1;}
.text-8xl {font-size: 4.5rem;line-height: 1;}
.text-9xl {font-size: 6rem;line-height: 1;}

.text-center {text-align: center}
.text-left {text-align: left}
.text-right {text-align: right}

/*-- Helpers: color ----------*/

.text-primary {color: var(--black-900)}
.text-white {color: var(--white)}

.bg-primary {background-color: var(--blue-500)}
.bg-white {background-color: var(--white)}

/*-- Helpers: width ----------*/

.w-full {width: 100%}
.w-half {width: 50%}

.fit-content {width: -moz-fit-content;width: fit-content}

.max-w-xs {max-width: 20rem}
.max-w-sm {max-width: 24rem}
.max-w-md {max-width: 28rem}
.max-w-lg {max-width: 32rem}
.max-w-xl {max-width: 36rem}
.max-w-2xl {max-width: 42rem}
.max-w-3xl {max-width: 48rem} 
.max-w-4xl {max-width: 56rem}
.max-w-5xl {max-width: 64rem} 
.max-w-6xl {max-width: 72rem}
.max-w-7xl {max-width: 80rem}
.max-w-full {max-width: 100%}

.max-w-screen-sm {max-width: 640px}
.max-w-screen-md{max-width: 768px} 
.max-w-screen-lg{max-width: 1024px}
.max-w-screen-xl{max-width: 1280px}

/*-- Helpers: height ----------*/

.h-full {height: 100%;}

/*-- Helpers: overflow ----------*/

.overflow-x-hidden {overflow-x: hidden;}
.overflow-y-hidden {overflow-y: hidden;}

/*-- Helpers: margin ----------*/

.ml-0 {margin-left: 0px;}
.mt-0 {margin-top: 0px;}
.mr-0 { margin-right: 0px;}
.mb-0 {margin-bottom: 0px;}

.ml-4 {margin-left: 4px;}
.mt-4 {margin-top: 4px;}
.mr-4 {margin-right: 4px;}
.mb-4 {margin-bottom: 4px;}

.ml-8 {margin-left: 8px;}
.mt-8 {margin-top: 8px;}
.mr-8 {margin-right: 8px;}
.mb-8 {margin-bottom: 8px;}

.ml-12 {margin-left: 12px;}
.mt-12 {margin-top: 12px;}
.mr-12 {margin-right: 12px;}
.mb-12 {margin-bottom: 12px;}

.ml-16 {margin-left: 16px;}
.mt-16 {margin-top: 16px;}
.mr-16 {margin-right: 16px;}
.mb-16 {margin-bottom: 16px;}

.ml-20 {margin-left: 20px;}
.mt-20 {margin-top: 20px;}
.mr-20 {margin-right: 20px;}
.mb-20 {margin-bottom: 20px;}

.ml-24 {margin-left: 24px;}
.mt-24 {margin-top: 24px;}
.mr-24 {margin-right: 24px;}
.mb-24 {margin-bottom: 24px;}

.ml-32 {margin-left: 32px;}
.mt-32 {margin-top: 32px;}
.mr-32 {margin-right: 32px;}
.mb-32 {margin-bottom: 32px;}

.ml-48 {margin-left: 48px;}
.mt-48 {margin-top: 48px;}
.mr-48 {margin-right: 48px;}
.mb-48 {margin-bottom: 48px;}

.ml-64 {margin-left: 64px;}
.mt-64 {margin-top: 64px;}
.mr-64 {margin-right: 64px;}
.mb-64 {margin-bottom: 64px;}

/*-- Helpers: padding ----------*/

.pl-0 {padding-left: 0}
.pt-0 {padding-top: 0}
.pr-0 {padding-right: 0}
.pb-0 {padding-bottom: 0}

.pl-4 {padding-left: 4px}
.pt-4 {padding-top: 4px}
.pr-4 {padding-right: 4px}
.pb-4 {padding-bottom: 4px}

.pl-8 {padding-left: 8px}
.pt-8 {padding-top: 8px}
.pr-8 {padding-right: 8px}
.pb-8 {padding-bottom: 8px}

.pl-12 {padding-left: 12px}
.pt-12 {padding-top: 12px}
.pr-12 {padding-right: 12px}
.pb-12 {padding-bottom: 12px}

.pl-16 {padding-left: 16px}
.pt-16 {padding-top: 16px}
.pr-16 {padding-right: 16px}
.pb-16 {padding-bottom: 16px}

.pl-20 {padding-left: 20px}
.pt-20 {padding-top: 20px}
.pr-20 {padding-right: 20px}
.pb-20 {padding-bottom: 20px}

.pl-24 {padding-left: 24px}
.pt-24 {padding-top: 24px}
.pr-24 {padding-right: 24px}
.pb-24 {padding-bottom: 24px}

.pl-32 {padding-left: 32px}
.pt-32 {padding-top: 32px}
.pr-32 {padding-right: 32px}
.pb-32 {padding-bottom: 32px}

/*-- Helpers: list ----------*/

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

/*-- Helpers: gap ----------*/

.gap-0 {gap: 0;}
.gap-4 {gap: .25rem;}
.gap-8 {gap: .5rem;}
.gap-12 {gap: 1rem;}
.gap-16 {gap: 1rem;}
.gap-24 {gap: 1.5rem;}
.gap-32 {gap: 2rem;}
.gap-48 {gap: 3rem;}

/*-- Helpers: flex align ----------*/

.items-center {align-items: center}
.justify-center {justify-content: center}
.justify-between {justify-content: space-between}
.justify-end {justify-content: flex-end}

/*-- Helpers: position ----------*/

.relative {position: relative}
.absolute {position: absolute}
.fixed {position: fixed}
.sticky {position: sticky}

.z-1 {z-index: 1}

/*-- Helpers: display ----------*/

.display-block {display: block;}
.display-none {display: none;}
.display-table {display: table;}

/*-- Helpers: border-radius ----------*/

.rounded-full {border-radius: 50%}
.rounded-xxl {border-radius: 32px}
.rounded-xl {border-radius: 24px}
.rounded-lg {border-radius: 20px}
.rounded-md {border-radius: 16px}
.rounded-sm {border-radius: 12px}
.rounded-xs {border-radius: 8px}
.rounded-xxs {border-radius: 4px}

.rounded-tl-lg {border-top-left-radius: 20px;}
.rounded-tr-lg {border-top-right-radius: 20px;}
.rounded-bl-lg {border-bottom-left-radius: 20px;}
.rounded-br-lg {border-bottom-right-radius: 20px;}

/*-- Helpers: border ----------*/

.border-b-solid {border-bottom-style: solid}
.border-l {border-left-width: 1px}
.border-t {border-top-width: 1px}
.border-b {border-bottom-width: 1px}
.border-r {border-right-width: 1px}
.border-none {border: none}
.border-collapse {border-collapse: collapse}
.border-spacing-0 {border-spacing: 0}
.border-gray {border-color: var(--black-200)}

/*-- Helpers: table ----------*/

.table-fixed {table-layout: fixed}
.table-row {display: table-row}
.table-cell {display: table-cell}

/*-- Helpers: transition ----------*/

.transition-colors {transition-property: background-color, border-color, color, fill, stroke}
.duration-500 {transition-duration: 500ms}

/*-- pricingTable ----------*/

.pricingTable-header label {
	margin: 0;
}
.pricingTable-header input {
	height: 28px;
	margin: 0;
	max-width: 80px;
	text-align: center;
	width: auto;
}

@media not all and (min-width: 64rem) {
	.pricingCalculation {
		flex-direction: column;
		width: 100%;
	}
}

.pricingTable * {
  box-sizing: border-box;
}

.pricingTable-grid {
  grid-template-rows: repeat(2, auto);
  grid-template-columns: repeat(4, minmax(0, 4in));
}

@media not all and (min-width: 64rem) {
	.pricingTable-grid {
		flex-direction: column;
		display: flex;
		width: 100%;
	}
}

.pricingTable-plan {
	border-left: 1px solid var(--black-300);
	border-top: 1px solid var(--black-300);
  width: 100%;
}

@media not all and (min-width: 64rem) {
	.pricingTable-plan {
		border-top-left-radius: 20px;
		border-top-right-radius: 20px;
		border-right: 1px solid #b7b9be;
	}
}

.pricingTable-plan:nth-last-child(2) {
	border-right: 1px solid var(--black-300);	
}

.pricingTable-info:nth-last-child(1) {
	border-right: 1px solid var(--black-300);	
}

.pricingPlan-recommended {
  height: 28px;
  width: 100%;
}

.pricingPlan-recommended > div {
	background-color: var(--black-900);
  color: var(--white);
	display: flex;
	justify-content: center;
	align-items: center;
  font-family: var(--font-heading);
  font-weight: var(--bold);
  font-size: .75rem;
	height: 100%;
  line-height: 1.25rem;
  text-transform: uppercase;
	width: 100%;
  word-wrap: break-word;
	visibility: hidden;
}

.pricingPlan-content {
  align-items: center;
  gap: 1.25rem;
  height: 100%;
  padding-top: 1.25rem;
  padding-left: 1.25rem;
  padding-bottom: 1.25rem;
  padding-right: 1.25rem;
}

.pricingPlan-info h2 {
  line-height: 26px;
}

.pricingPlan-details {
  gap: 1.25rem;
  margin-block-start: auto;
}

.pricingPlan-billing {
  font-family: var(--font-heading);
	height: 56px;
}

.pricingPlan-price {
  font-weight: var(--bold);
	text-transform: uppercase;
}

.pricingPlan-price span {
  font-size: 24px;
}

.pricingPlan-frequency {
  font-size: .75rem;
  line-height: 1.25rem;
}
.button-pricing {
  align-items: center;
  border-color: var(--black-900);
  border-radius: 1.5rem;
	border-style: solid;
	border-width: 2px;
  color: var(--black-900);
  display: inline-flex;
  justify-content: center;
  text-decoration: none;
}
.button-pricing:hover {
  background-color: var(--black-50);
  color: var(--black-900);
  text-decoration: none;
}
.pricingTable-plan.recommended--js {
  border-left: 1px solid var(--black-900);
  border-top: 1px solid var(--black-900);
  border-right: 1px solid var(--black-900);
}
.pricingTable-plan.recommended--js .pricingPlan-recommended--js {
	visibility: visible;
}
.pricingTable-info.recommended--js  {
	border-top: 1px solid var(--black-900);
	border-left: 1px solid var(--black-900);
	border-bottom: 1px solid var(--black-900);
	border-right: 1px solid var(--black-900);
}
.recommended--js .button-pricing {
  background-color: var(--blue-500);
  border-color: var(--blue-500);
  color: #fff;
  justify-content: center;
}
.recommended--js .button-pricing:hover {
  background-color: var(--blue-700);
	border-color: var(--blue-700);
  color: #fff;
}


/* pricingTable: Pricing plan info / includes */

.pricingTable-info {
	border-top: 1px solid var(--black-300);
	border-left: 1px solid var(--black-300);
	border-bottom: 1px solid var(--black-300);
}
.pricingTable-info:first-child {
	border-bottom-left-radius: 20px;
}

@media (min-width: 64rem) {
  .pricingTable--info {
      border-bottom-left-radius: 20px;
  }
}
@media not all and (min-width: 64rem) {
	.pricingTable-info {
		border-right: 1px solid var(--black-300);
		border-bottom-right-radius: 20px;
		margin-block-end: 24px;
		border-bottom-left-radius: 20px
	}
	.pricingTable-info.recommended--js  {
		border-bottom-left-radius: 20px;
	}
}
.pricingTable-includes li:first-of-type {
    margin-block-start: 0;
} 
.pricingTable-includes li {
    margin-block-start: 1rem;
} 

/*-- compareTable: Compare Pricing Plan Features ----------*/

.compareTable .icon {
	line-height: 0;
	height: 24px;
	width: 24px;
}

@media only screen and (min-width: 1400px) {
	.compareTable thead {
		top: 155px
	}
}

@media (min-width: 1030px) and (max-width: 1400px) {
	.compareTable thead {
		top: 187px;
	}
}
@media (min-width: 769px) and (max-width: 1030px) {
	.compareTable thead {
		top: 0;
	}
}
@media and (max-width: 769px) {
	.compareTable thead {
		top: 0;
	}
}

.comparePlan-description {
	font-family: var(--font-heading);
}

@media not all and (min-width: 48rem) {
	.compareTable tbody tr {
		border: 1px solid var(--black-300);
		border-radius: 20px;
		overflow: hidden;
	}
	.compareTable tbody tr:last-child {
		margin-bottom: 0;
	}
	.compareTable tbody tr td {
		justify-content: space-between;
	}
	.compareTable tbody tr td:first-child {
		background: var(--blue-50);
		border-bottom: 1px solid var(--black-300);
		border-radius: 20px 20px 0 0;
	}
	.compareTable tbody tr td:not(:first-child):hover {
		background-color: var(--black-50);
	}	
	.comparePlan-value {
		flex-basis: 50%;
	}
}

@media (min-width: 48rem) {
	.compareTable table {
		display: table;
	}
	.compareTable thead {
		display: table-header-group;
	}
	.compareTable th {
		border-right: 1px solid var(--black-300);
		display: table-cell;
		padding-bottom: 16px;
		padding-top: 16px;
		vertical-align: bottom;
	}
	.compareTable tbody tr {
		display: table-row;
	}
	.compareTable tbody tr:hover {
		background-color: var(--black-50);
	}	
	.compareTable tbody tr td {
		border-right: 1px solid var(--black-300);
		display: table-cell;
		vertical-align: top;
	}
	.compareTable .comparePlan {
		display: none;
	}
}

/*-- Buttons ----------*/

.button {
  font-family: var(--font-heading);
  font-weight: var(--regular);
  font-size: 1rem;
  min-height: auto;
  min-width: 8rem;
}
.button-lg {
  line-height: 1.5rem;
  padding: .75rem 1.25rem .875rem;
}
.button-md {
  line-height: 1.5rem;
  padding: .5rem 1.25rem .625rem;
}
.button-sm {
  line-height: 1.5rem;
  padding: .75rem 1.25rem .875rem;
}
.button-primary {
  align-items: center;
  background-color: var(--blue-500);
  border-color: var(--blue-500);
  border-radius: 1.5rem;
	border-style: solid;
	border-width: 2px;
  color: #fff;
  display: inline-flex;
  justify-content: center;
  text-decoration: none;
}
.button-primary:hover {
  background-color: var(--blue-700);
	border-color: var(--blue-700);
  color: #fff;
  text-decoration: none;
}
.button-tertiary {
  align-items: center;
  border-color: var(--black-900);
  border-radius: 1.5rem;
	border-style: solid;
	border-width: 2px;
  color: var(--black-900);
  display: inline-flex;
  justify-content: center;
  text-decoration: none;
}
.button-tertiary:hover {
  background-color: var(--black-50);
  color: var(--black-900);
  text-decoration: none;
}

/*-- Slogan ----------*/

#slogan {
  background-color: var(--blue-500);
  padding: .25rem 0;
  text-align: center;
}
#slogan h5{
  color: #fff;
  font-weight: var(--regular);
  font-size: 1rem;
  letter-spacing: 4px;
  margin-bottom: 2px;
  word-spacing: 5px;
}

/*-- Home ----------*/

#hero-header {
  margin: 1rem auto 0;
}
#hero-header h1 {
  font-size: 2.5rem;
  line-height: 3rem;
  margin: 3.5rem 0 .75rem;
}
#hero-header h1 strong {
  color: var(--red-500);
}
#hero-header h4 {
  font-weight: var(--regular);
  font-size: 1.5rem;
  line-height: 2rem;
}
#top-image {
  margin-left: -60px;
  margin-top: 180px;
}
#showErrors {
  list-style: none;
  margin: 2rem 0rem 0;
}
#showErrors li {
  height: auto;
  margin-left: 2rem;
  margin-bottom: 1.25rem;
  padding-top: 0;
  position: relative;
}
#showErrors li img {
  left: -2rem;
  margin-top: -.675rem;
  position: absolute;
  top: 50%;
}
#showErrors li .alert-text {
  display: inline-block;
  font-size: 1rem;
  height: 100%;
  line-height: 1.5rem;
  text-align: left;
  vertical-align: middle;
}

@media (min-width: 1030px) {
  #hero-header h1 span {
    display: block;
  }
}
@media (max-width: 490px) {
  #hero-header h1 span {
    display: block;
  }
}
@media (min-width: 768px) and (max-width: 1030px) {
  #hero-header h1 {
    font-size: 2rem;
    line-height: 2.5rem;
    margin: 1.5rem 0 .75rem;
  }
}
@media (max-width: 768px) {
  #hero-header {
    margin: 1rem auto 0;
  }
  #hero-header h1 {
    font-size: 2rem;
    line-height: 2.5rem;
    margin: .5rem 0 .75rem;
  }
  #hero-header h4 {
    font-size: 1.25rem;
    line-height: 1.75rem;
    margin: 1rem 0 0rem;
  }
}

/*-- Particle collider ----------*/

#particlesWrapper{
  position: relative;
}
#particlesWrapper:before{
  content: "";
  background-image: url(../img/assets/bg.jpg);
  opacity: 0.75;
  transform: scale(1);
  position: absolute;
  left: -20px;
  top: 0;
  right: -20px;
  bottom: 0;
  background-size: contain;
  background-position: center;
  z-index: -1;
}
#particlesContainer {
  aspect-ratio: 1 / 1;
  display: flex;
  justify-content: center;
  margin: auto;
  max-height: 560px;
  overflow: hidden; 
  width: 100%; 
}
#particlesContainer canvas{
  aspect-ratio: 1 / 1;
  display: block;
}
#arcs {
  position: absolute;
  left: 390px;
  top: 10px;
}
#arcs-image {
  position: absolute;
  left: 390px;
  top: 10px;
}

@media (max-width: 480px) {
  #particlesWrapper {
    width: 100%;
  }
  #particlesLoading{
    font-size: .75rem;
  }
}

@media (max-width: 769px) {
  #particlesWrapper:before {
    background-size: cover;
  }
}


/*-- JoeSandbox CTA ----------*/

#sandbox-cta {
  margin: 3rem 0;
}
.sandbox-cta--wrapper {
  border: 1px solid var(--black-200);
  border-radius: 2rem;
  display:flex;
  flex-direction: row;
  overflow: hidden;
}
#sandbox-cta .cta-content {
  box-sizing: border-box;
  padding: 2rem;
  width: 50%;
}
#sandbox-cta .cta-content li {
  line-height: 1.5rem;
}
#sandbox-cta .cta-image {
  box-sizing: border-box;
  width: 50%;
}
#sandbox-cta h2 {
  font-size: 1.5rem;
  line-height: 2rem;
}
#sandbox-cta p {
  font-size: 1rem;
  line-height: 1.5rem;
  margin: .5rem 0 1rem;
  text-align: left;
}
.joesandbox-cta {
  background-color: var(--black-900);
  border-radius: 1rem;
  box-sizing: border-box;
  color:#c9c9c9;
  display: flex;
  flex-direction: column;
  font-size: 1rem;
  justify-content: center;
  line-height: 1.5rem;
  margin: 0;
  padding: 1rem; 
  text-align: center;
}
.joesandbox-cta span {
  color: #c9c9c9;
  font-size: .75rem;
  line-height: 1.5rem;
}
.joesandbox-cta:hover {
  background-color: #232323;
  color: #c9c9c9;
  text-decoration: none;
}
.joesandbox-cta > img {
  margin: 0 auto .25rem;
  max-width: 400px;
}

@media (min-width: 1030px) {
  .joesandbox-cta {
    width: 400px;
  }
}

@media (max-width: 1030px) {
  #sandbox-cta .sandbox-cta--wrapper {
    border-radius: 1rem;
    flex-direction: column;
  }
  #sandbox-cta .cta-image {
    order: 1;
    width: 100%;
  }
  #sandbox-cta .cta-content {
    order: 2;
    padding: 1.25rem;
    width: 100%;
  }
  #sandbox-cta .joesandbox-cta {
    border-radius: 1rem 1rem 0 0;
    padding: 2rem 1.75rem;
    width: 100%;
  }
  #sandbox-cta .joesandbox-cta span {
    font-size: .75rem;
    line-height: 1rem;
  }
  #sandbox-cta h4 {
    font-size: 1.25rem;
    line-height: 1.5rem;
  }
}
@media (max-width: 769px) {
  #sandbox-cta h2 {
    font-size: 1.25rem;
    line-height: 1.75rem;
  } 
  #sandbox-cta {
    margin: 2rem 0;
  }
}


/*-- Home Features ----------*/

#home-features{
}

#home-features p {
  text-align: left;
  font-size: 1rem;
  line-height: 1.5rem;
}
.bring-to-front {
  position: relative;
  z-index: 1;
}
.span-home{
  width: 450px;
  margin-bottom: 30px;
}
.span-home .margin-left{
  margin-left: 165px;
}
.span-home h3{
  margin-bottom: 5px;
}
.offset-home {
  margin-left: 40px;
}
.span-home .front {
  float: left;
}

@media (max-width: 1030px) {
  .span-home{
    width: 100%;
  }
  .offset-home{
    margin-left: 20px;
  }
}

@media (max-width: 767px) {
  
  .front {
    width: 120px;
    height: 120px;
  }  .span-home .margin-left{
    margin-left: 130px;
    margin-right: 5px;
  }
}


/*-- Footer ----------*/

#joe-footer {
  background-color: #dedede;
  background-image: url(../img/footer/bg.gif);
  background-repeat: no-repeat;
  background-position: center;
  border-top: 1px solid #d1d1d1;
  font-size: .75rem;
  height: 10rem;
  margin-top: 3rem;
  padding-top: 2rem;
}
#joe-footer address {
  margin: 0;
}
#joe-footer h4 {
  color: var(--blue-500);
  display: block;
  font-size: 1rem;
  margin-bottom: .25rem;
}
#joe-footer a {
  font-size: .75rem;
}
.footermenu .icon{
  color: var(--blue-500);
  font-size: 20px;
  margin: 0px 12px;
}
.footermenu .icon:hover{
  color: var(--blue-700);
}

/*-- Page title ----------*/

#top-title {
  margin-top: 0;
  margin-bottom: 4rem;
  padding-top: 1.5rem;
  position: relative;
}
#top-title h1 {
  margin-top: 1.5rem;
  text-align: right;
  position: relative;
  z-index: 39;  
}
#top-title h2 {
  color: var(--black-700);
  font-weight: var(--regular);
}
#top-title #top-title-image {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
}

@media (max-width: 767px) {
  #top-title h1 {
    font-size: 2rem;
  }
}

@media (max-width: 480px) {
  #top-title{
    margin-bottom: 2rem;
  }
}

/*-- Nav Tabs ----------*/

.nav-tabs{
  margin: 0;
  margin-bottom: 20px;
}
@media (max-width: 480px) {
  .nav-tabs a{
    display: inline-block;
  }
  .nav.nav-tabs li{
    float: none;
  }
  .nav-tabs .active{
    border: none;
  }
  .nav-tabs{
    border-bottom: none;
  }
  .nav-tabs > li, .nav-pills > li {
    padding-top: 3px;
    padding-bottom: 1px;
  }
  .nav-tabs > .active > a, .nav-tabs > .active > a:hover {
    border-radius: 4px;
    border: 1px solid #ddd;
    padding-left: 20px;
    padding-right: 20px;
  }
  .nav-tabs li a {
    padding-left: 7px;
    padding-right: 7px;
    padding-top: 7px;
  }
  .nav-tabs li a h3 {
    font-size: 15px;
    font-weight: 600;
  }
}

@media (max-width: 320px) {
  .nav.nav-tabs li{
    display: block;
  }
}

.nav-tabs li a h3 {
  color: var(--blue-link);
}
.nav-tabs li a:hover h3 {
  color: var(--blue-600);
}
.nav-tabs li.active a h3 {
  color: var(--black-700);
}

/* Features */ 

.feature-row {
	padding: 0;
	margin-bottom: 2rem
}
.feature-row:last-child {
	margin-bottom: 0
}
.feature-row .hero-unit {
	padding: 0;
}
.feature-row p {
	font-size: 15px;
	line-height: 24px;
	margin-bottom: 0;
	min-height: 108px;
	padding: 12px 16px;
}

.feature-container {
	display: flex;
	flex-wrap: wrap; /* For responsiveness */
	align-items: center;
	justify-content: space-between;
	gap: 20px;
}

.feature-text {
	flex: 1 1 60%; /* Grow, shrink, basis */
}

.feature-image {
	box-sizing: border-box;
}

.feature-image img {
	width: 100%;
	max-width: 139px;
	height: auto;
}

@media (max-width: 768px) {
	.feature-row {
		background: #ededed;
		/* Old browsers */
		 background: -moz-linear-gradient(left,  #ededed 0%, #ffffff 100%);
		/* FF3.6+ */
		 background: -webkit-gradient(linear, left top, right top, color-stop(0%,#ededed), color-stop(100%,#ffffff));
		/* Chrome,Safari4+ */
		 background: -webkit-linear-gradient(left,  #ededed 0%,#ffffff 100%);
		/* Chrome10+,Safari5.1+ */
		 background: -o-linear-gradient(left,  #ededed 0%,#ffffff 100%);
		/* Opera 11.10+ */
		 background: -ms-linear-gradient(left,  #ededed 0%,#ffffff 100%);
		/* IE10+ */
		 background: linear-gradient(to right,  #ededed 0%,#ffffff 100%);
		/* W3C */
		 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#ffffff',GradientType=1 );
		/* IE6-9 */;
	}
	.feature-title {
		padding: 12px 16px;
	}
	.feature-container {
		flex-direction: column;
		gap: 0;
		text-align: center;
	}
	.feature-text {
		min-width: auto;
		order: 2;
	}
	.feature-row p {
		min-height: auto;
	}
	.feature-image {
		order: 1;
		text-align: left;
		padding: 0 16px;
		width: 100%;
	}
}

/* Product introduction */

.product-introduction,
.product-introduction p,
.product-explained,
.product-explained p {
	font-size: 16px;
	line-height: 24px;
}
.product-introduction {
	margin-bottom: 32px;
	padding: 20px;
}
.product-introduction-item {
  flex: 1 1 50%;
}
.product-introduction-image img {
  width: 100%;
  max-width: 240px;
  height: auto;
  display: block;
  margin: 0 auto;
}
@media (max-width: 768px) {
  .product-introduction-container {
    flex-direction: column;
  }
  .product-introduction-item {
    flex: 1 1 100%;
  }
  .product-introduction-text {
    order: 2;
  }
  .product-introduction-image {
    order: 1;
  }
}

/* Product explained */

.product-explained {
	padding: 20px;
	margin-bottom: 32px
}
.product-explained-item {
  flex: 1 1 50%;
}
.product-explained-image img {
  width: 100%;
  max-width: 400px;
  height: auto;
  display: block;
  margin: 0 auto;
}
@media (max-width: 768px) {
  .product-explained-container {
  	flex-direction: column;
  }
  .product-explained-item {
    flex: 1 1 100%;
  }
  .product-explained-text {
    order: 2;
  }
  .product-explained-image {
    order: 1;
  }
}

/* Hiring */ 

.hiring {}

.hiring h2 {
  margin-bottom: 1rem;
}
.hiring p {
  font-size: 1rem;
  line-height: 1.5rem;
  margin: 0 0 1rem;
}
.hiring--googlemaps {
  height: 0;
  margin-bottom: 1rem;
  overflow: hidden;
  padding-bottom: 56.25%; /* Aspect Ratio 16:9 */
  position: relative;
  width: 100%;
}
.hiring--googlemaps iframe {
  border: 0;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
}
.hiring--small {
  margin: 0 auto;
  max-width: 960px;
}
.hiring--benefits {
  margin: 2rem 0;
}
.hiring--benefit {
  margin: 1rem 0;
}
.hiring--benefit h3 {
  font-weight: var(--semibold);
}
.hiring--benefits-aditional {
  margin: 2rem 0;
}
.hiring--benefits-aditional ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.hiring--benefits-aditional ul li {
  display: flex;
  align-items: center;
  font-size: 1rem;
  margin: 1rem 0;
}
.hiring--benefits-aditional ul li img {
  margin-right: .5rem;
}
.hiring--impressions .carousel h3 {
  color: var(--white);
}
.hiring--positions-open {
  margin: 1rem 0;
}

@media (max-width: 769px) {
  .hiring--googlemaps {
    padding-bottom: 75%; /* Aspect Ratio 4:3 */
  }
  .hiring--benefit {
    flex-direction: column;
    gap: 1rem;
    width: 100%;
  }
  .hiring--benefit .w-half {
    width: 100%;
  }
  .hiring--benefit img {
    height: 120px;
    width: 120px;
  }
}

/* Security */

.security p,
.security li {
  font-size: var(--font-base);
  line-height: 1.5rem;
}
.security-lists h2 {
  font-size: 1.25rem;
  font-weight: var(--semibold);
  line-height: 1.75rem;
}
.security-lists ul {
  margin-left: 40px;
}
.security-lists ul li {
  list-style-type: none;
  background-image: url(../img/check.svg);
  background-size: 16px;
  background-repeat: no-repeat;
  background-position: left 4px;
  font-size: 14px;
  padding-left: 20px;
}
.security-icon {
  background-image: url(../img/security.png);
  display: inline-block;
  flex: none;
  margin-left: -6px;
  margin-right: 0;
  height: 40px;
  width: 40px;
}
.security-icon-compliance {
  background-position: 0 0px;
}
.security-icon-data-protection {
  background-position: 0 -40px;
}
.security-icon-application-security {
  background-position: 0 -80px;
}
.security-icon-customer-data-control {
  background-position: 0 -120px;
}
.security-icon-cloud-security {
  background-position: 0 -160px;
}
.security-icon-privacy {
  background-position: 0 -200px;
}
.security-icon-sustainability {
  background-position: 0 -240px;
}


#message-wrapper{
  height: 540px;
  width: 420px;
}
#searchWrapper {
  width: 640px;
  position: relative;
}
#searchResults {
  position: absolute;
  z-index: 9999;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  margin: 0px 5px;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  margin-top: -9px;
}
#searchResults div {
  background: white;
  border: 1px solid var(--black-900);
  font-size: 12px;
  cursor: pointer;
  border-top: none;
  padding: 5px;
}
#searchResults div:last-child {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}
#searchInput {
  width: 100%;
  padding: 15px 13px;
  border-radius: 4px;
  box-sizing: border-box;
  border: 1px solid grey;
}
#searchResults > div:hover {
  background-color: #f1f1f1;
}
#searchResults .videoTitle {
  background: var(--black-900);
  color: white;
  margin: -5px;
  margin-bottom: 5px;
  padding: 3px 5px;
  font-size: 11px;
}
.highlight {
  background: yellow;
}
input:focus {
  outline: none;
}
video{
  border: 1px solid grey;
}

.form-dropdown{
  width:  210px!important;
}
.jotform-form .form-textbox{
  margin-bottom:  0px;
  padding: 15px 10px;
}
.jotform-form *{
	box-sizing: border-box;
}
.norow td, .norow{
  background-color:  transparent!important;
  border:  none!important;
}
.button-cloud-purchase {
  white-space: nowrap;
   background: #F7FCFD;
   background: linear-gradient(180deg, #F7FCFD, #73CEF0);
   border-radius: 7px;
   color: #004455;
   padding: 5px 10px;
   font-weight:  bold;
   box-shadow: inset 0px -2px 8px 0 #ffffff;
   text-shadow: 1px 1px 0 #FFFFFF;
   border: solid #83E4FF 1px;
   text-decoration: none;
   display: inline-block;
   cursor: pointer;
   text-align: center;
}
.button-cloud-purchase:hover {
   background: linear-gradient(180deg, #d2f7ff, #65c8ed);
   box-shadow: box-shadow: inset 0px 0px 2px 0 #ffffff;
   text-decoration: none;
}
.button-cloud-contact {
   background: #ffce00;
   background: linear-gradient(180deg, #ffce00, #ffce00);
   border-radius: 7px;
   color: var(--black-900);
   padding: 5px 10px;
   font-weight:  bold;
   box-shadow: inset 0px 4px 10px 0 #ffffff, inset 0px 1px 0px 0 #ffffff;
   border: solid #ffce00 1px;
   text-decoration: none;
   display: inline-block;
   cursor: pointer;
   text-align: center;
}
.button-cloud-contact:hover {
  color: var(--black-900);
  background: linear-gradient(180deg, #ffee77, #ffee77);
  text-decoration: none;
}
.button-cloud-contact{
  display:  inline-block;
}
.list-item-inside-key-feature{
  display: list-item;
  list-style-type: disc;
  margin-left: 18px;
}
#solutionsNav{
  width: 100px;
}
#productsNav{
  width: 95px;
}
#whyJoeSandboxNav{
  width: 175px;
}
#technologyNav{
  width: 120px;
}
#blogNav{
  width: 80px;
}
#basicModal .form-sub-label{
	margin-top: -4px;
}
#basicModal .form-all{
	padding-top: 0px;	
}
#basicModal form.jotform-form{
	margin: 0px;
}
body.modal-open{
	overflow: hidden;
}
#versions .product-overview thead tr th:first-child{
  width: 400px;
}
#versions .product-overview thead tr th:not(:first-child){
	width: 50px;
}
#versions .product-overview{
	width: 95.4%;
}
.download-trace-basic-button{
  padding: 12px 17px;
  font-size: 17px;
}
#versions img{
	max-width: initial;
}
#basicModal .jotform-form{
	padding: 0px 0;
}
#isMobile{
	display: none;
}
[data-icon]:before {
	font-family: "joesecurity" !important;
	content: attr(data-icon);
	font-style: normal !important;
	font-weight: normal !important;
	font-variant: normal !important;
	text-transform: none !important;
	speak: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

[class^="icon-"]:before,
[class*=" icon-"]:before {
	font-family: "joesecurity" !important;
	font-style: normal !important;
	font-weight: normal !important;
	font-variant: normal !important;
	text-transform: none !important;
	speak: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-windows:before {
  content: "\61";
}
.icon-apple:before {
  content: "\63";
}
.icon-android:before {
  content: "\64";
}
.icon-ios:before {
  content: "\62";
}
.icon-facebook:before {
  content: "\65";
}
.icon-linkedin:before {
  content: "\67";
}
.icon-twitter:before {
  content: "\68";
}
.icon-github:before {
  content: "\69";
}
.icon-linux:before {
  content: "\66";
}

img:-moz-loading {
    visibility: hidden;
}

.arch-icon-x, .arch-icon-mobile, .arch-icon-desktop, .arch-icon-a1, .arch-icon-linux{
	display: inline-block;
	background-image: url(../img/architecture-icons.png);
	width: 16px;
	height: 16px;
	float: right;
	margin-top: 2px;
}
.arch-icon-desktop{
	background-position: 0 -16px;
}
.arch-icon-a1{
	background-position: 0 -16px;
}
.arch-icon-mobile{
	background-position: 0 -32px;
}
.arch-icon-linux{
	background-position: 0 -51px;
}

tr.clickable:hover td{
	background-color: #f1f1f1!important;
}

/*-- Prism ----------*/

pre.line-numbers {
  position: relative;
  padding-left: 3.8em;
  counter-reset: linenumber;
}
pre.line-numbers > code {
  position: relative;
}
.line-numbers .line-numbers-rows {
  position: absolute;
  pointer-events: none;
  top: 0;
  font-size: 100%;
  left: -5.2em;
  width: 3em;
  letter-spacing: -1px;
  border-right: 1px solid #D0D0D0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.line-numbers-rows > span {
  pointer-events: none;
  display: block;
  counter-increment: linenumber;
}
.line-numbers-rows > span:before {
  content: counter(linenumber);
  color: #999;
  display: block;
  padding-right: 0.8em;
  text-align: right;
}
code[class*="language-"],
pre[class*="language-"] {
  color: var(--black-900);
  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
  direction: ltr;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  line-height: 1.5;
  -moz-tab-size: 4;
  -o-tab-size: 4;
  tab-size: 4;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
}
pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
  background: #b3d4fc;
}
pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
code[class*="language-"]::selection, code[class*="language-"] ::selection {
  background: #b3d4fc;
}
pre[class*="language-"] {
  padding: 1em;
  margin: .5em 0;
  padding-left: 60px;
  overflow: hidden;
}
:not(pre) > code[class*="language-"] {
  padding: .1em;
  border-radius: .3em;
}
.token.prolog,
.token.doctype,
.token.cdata {
  color: slategray;
}
.token.comment{
  color: #a64b00;
  background-color: #f9d1b0;
}
.token.punctuation {
  color: #999;
}
.namespace {
  opacity: .7;
}
.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
  color: #19661f;
}
.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
  color: #690;
}
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
  color: #a67f59;
  background: hsla(0, 0%, 100%, .5);
}
.token.atrule,
.token.attr-value,
.token.keyword {
  color: #07a;
}
.token.statement{
  color: #9f0025;
}
.token.function {
  color: var(--black-900);
  font-weight: bold;
}
.token.regex,
.token.important,
.token.variable {
  color: #e90;
}
.token.important,
.token.bold {
  font-weight: bold;
}
.token.italic {
  font-style: italic;
}
.token.entity {
  cursor: help;
}
.code-address{
  color: red;
}
.code-wrapper{
  position: relative;
}
.address-block{
  position: absolute;
  top: 0;
  left: 0;
  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
  line-height: 1.5;
  font-size: 12px;
  margin-top: 1em;
  margin-left: 60px;
}
.address-block .code-address{
  color: #a0a6ad;
}



/*-- To Be Sorted ----------*/

.footermenu a:hover{
	text-decoration: none!important;
}
.product-overview{
	width: 97%;
	border-bottom: 2px solid #e9e9e9;
}
.product-overview thead tr{
	background-color: #f0f0f0;
}
.product-overview tbody tr:nth-child(even){
	background-color: #fafafa;
}
.product-overview thead tr th{
	padding: 7px 0;
	color: #3B3B3B;
	text-shadow: -1px -1px #ffffff;
	font-size: 12px;
	font-weight: normal;
}
.product-overview tbody tr{
	cursor: pointer;
	cursor: hand;
}
.product-overview tbody tr:hover{
	background-color: #f7f9fa!important;
	outline: 1px solid #e2f0ff;
}
.product-overview tbody td:not(:last-child){
	border-right: 1px solid #e2e2e2;
}
.product-overview tbody td{
	padding: 10px 15px;
}
.products-sprite{
	height: 75px;
	width: 325px;
	background-image: url(../img/products-sprite.png);
}
.products-sprite.ai{
	background-position: 0 -1886px;
}
.products-sprite.trace{
	background-position: 0 -1811px;
}
.products-sprite.lab{
	background-position: 0 -1730px;
}
.products-sprite.linux{
	background-position: 0 -1421px;
}
.products-sprite.light{
	background-position: 0 -966px;
}
.products-sprite.dec{
	background-position: 0 0;
}
.products-sprite.class{
	background-position: 0 -74px;
}
.products-sprite.filter{
	background-position: 0 -147px;
}
.products-sprite.isim{
	background-position: 0 -220px;
}
.products-sprite.desktop{
	background-position: 0 -295px;
}
.products-sprite.mobile{
	background-position: 0 -368px;
}
.products-sprite.ultimate, .products-sprite.ultimatenomobile, .products-sprite.ultimatewithlinux{
	background-position: 0 -442px;
}
.products-sprite.x{
	background-position: 0 -515px;
}
.products-sprite.complete, 
.products-sprite.completenox, 
.products-sprite.completenomobile, 
.products-sprite.completewithlinux, 
.products-sprite.completewithlinuxnoxnomobile{
	background-position: 0 -589px;
}
.products-sprite.mail{
	background-position: 0 -1036px;
}
.products-sprite.cloud{
	background-position: 0 -663px;
}
.products-sprite.cloud-basic{
	background-position: 0 -1268px;
}
.products-sprite.hypervisor{
	background-position: 0 -1117px;
}
.products-sprite.appliance{
	background-position: 0 -1195px;
}
.products-sprite.mailmonitor{
	background-position: 0 -1349px;
}
.products-sprite.userguide{
	background-position: 0 -1496px;
}
.products-sprite.ML{
	background-position: 0 -1574px;
}
.products-sprite.ml{
	background-position: 0 -1574px;
}
.products-sprite.detect{
	background-position: 0 -1651px;
}
.products-sprite.basic{
	height: 37px;
}
.products-sprite.basic.file{
	background-position: 0 -737px;
}
.products-sprite.basic.apk{
	background-position: 0 -774px;
}
.products-sprite.basic.document{
	background-position: 0 -813px;
}
.products-sprite.basic.url{
	background-position: 0 -851px;
}
.products-sprite.basic.yara{
	background-position: 0 -889px;
}
.products-sprite.basic.mail{
	background-position: 0 -925px;
}
.architectures-sprite{
	height: 25px;
	width: 23px;
	background-image: url(../img/architectures.png);
	display: inline-block;
}
.architectures-sprite.windows{
	margin-bottom: -4px;
}
.architectures-sprite.android{
	background-position: 0 -24px;
}
.architectures-sprite.apple{
	background-position: 0 -51px;
}
.architectures-sprite.ios{
	background-position: 0 -79px;
}
.architectures-sprite.linux{
	background-position: 0 -108px;
}
.plugins-hover{
	z-index: 987;
	position: absolute;
	right: 20px;
	top: 9px;
	cursor: pointer; cursor: hand;
	height: 24px;
	width: 28px;
	background-image: url(../img/plugins.png);
}
.plugins-hover:hover{
	width: 88px;
	margin-left: -60px;
	background-position: 0 -27px;
}
.analysis-scope{
	margin-top: 18px;
	margin-bottom: -6px;
	display: inline-block;
	width: 115px;
	height: 40px;
	background-image: url(../img/scope.png);
}
.analysis-scope.hundert{
	background-position: 0 0px;
}
.analysis-scope.ninety{
	background-position: 0 -43px;
}
.analysis-scope.eighty{
	background-position: 0 -88px;
}
.analysis-scope.sixty{
	background-position: 0 -131px;
}
.analysis-scope.ten{
	background-position: 0 -175px;
}
.analysis-scope.thirty{
	background-position: 0 -219px;
}
.analysis-scope.seventy{
	background-position: 0 -265px;
}
.scope-number{
	font-size: 11px;
	font-weight: bold;
}
.scope-number.hundert{
	color: #7a026b;
}
.scope-number.ninety{
	color: #681583;
}
.scope-number.eigthy{
	color: #542b9f;
}
.scope-number.sixty{
	color: #2164e6;
}
.scope-number.thirty{
	color: #08b48d;
}
.scope-number.ten{
	color: #04da45;
}
.scope-number.seventy{
	color: #364cc8;
}
.product-page h2{
	font-size: 26px;
	margin-top: 22px;
	margin-bottom: 12px;
}
.product-page .intro{
	margin-top: 30px;
	font-size: 16px;
}


/*-- Blog Styling ----------*/

#custom-search-form {
    margin:0;
    margin-top: 5px;
    padding: 0;
}

#custom-search-form .search-query {
    padding-right: 3px;
    padding-right: 4px \9;
    padding-left: 3px;
    padding-left: 4px \9;
    /* IE7-8 doesn't have border-radius, so don't indent the padding */

    margin-bottom: 0;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

#custom-search-form button {
    border: 0;
    background: none;
    /** belows styles are working good */
    padding: 2px 5px;
    margin-top: 2px;
    position: relative;
    left: -28px;
    /* IE7-8 doesn't have border-radius, so don't indent the padding */
    margin-bottom: 0;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.search-query:focus + button {
    z-index: 3;   
}
.postsHistoryLink:first-child {
	border-top: 1px solid #dddddd;
}
.postsHistory {
	padding: 11px 20px;
    border-bottom: 1px solid #dddddd;
    border-left: 1px solid #dddddd;
    border-right: 1px solid #dddddd;
}
.postsHistoryLink:nth-child(even){
	background-color: #f1f1f1;
}
.postsHistoryLink{
	display: block;
}
.topPostsText .abrevation{
	text-align: left;
	font-weight: normal;
}
.topPosts{
	margin-left: 0px;
	background-color: #f1f1f1;
	display: block;
	margin-bottom: 10px;
	margin-top: 10px;
	color: var(--black-900);
}
.topPostsText{
	padding: 20px 30px;
}
.topPostsText{
	display: block;
	text-align: left;
	word-wrap: break-word;
	text-overflow: ellipsis;
	overflow: hidden;
	max-height: 139px;
	position: relative;
}
.topPostsText .fadeOut{
	background-image: url(../img/abrevation.png);
	position: absolute;
	width: 346px;
	height: 19px;
	bottom: 0;
	right: 0;
}
.topPostsTextWrapper{
	position: relative;
	height: 215px;
}
.topPostsTextWrapper .seeMore{
	position: absolute;
	bottom: 0px;
	right: 30px;
	font-size: 13px;
}
.topPostsText h2{
	line-height: 35px;
	margin-bottom: 5px;
}

/*-- Collapse ----------*/

.collapsed.closed{
	display: none;
}
.collapsed.open{
	display: block;
}
.collapsable{
	margin-top: 20px;
	padding: 10px 20px;
background-color: #f1f1f1;
font-size: 16px;
font-weight: bold;
color: var(--black-900);
cursor: hand;
cursor: pointer;
border: 1px solid #dddddd;
border-radius: 7px 7px 0px 0px;
-moz-border-radius: 7px 7px 0px 0px;
-webkit-border-radius: 7px 7px 0px 0px;
}
.collapsable.closed{
	border-radius: 7px;
}
.collapsable .indicator{
	float: right;
	display: inline-block;
	height: 19px;
	width: 27px;
	background-image: url(../img/collapse.png);
}
.collapsable.open .indicator{
	background-position: 0px 0px;
}
.collapsable.closed .indicator{
	background-position: -32px 0px;
}
.collapsed.closed {
  display: none;
}
.cloudbasic-table-cell{
	background-color: #cccccc;
	border-right: 1px solid #d3d3d3;
}
.table-striped tbody tr:nth-child(odd) td.cloudbasic-table-cell{
	background-color: #e3e3e3;
}
.table tbody tr:nth-child(odd):hover td.cloudbasic-table-cell{
	background-color: #f1f1f1;
}
.table tbody tr:nth-child(even):hover td.cloudbasic-table-cell{
	background-color: #f2f2f2;
}
.no-border th{
	border: 0px!important;
}

#integrations .int-wrapper div {
  position: relative;
  display: inline-block;
  background-color: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.0);
  -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  -webkit-transform: scale(0.95, 0.95);
  transform: scale(0.95, 0.95);
}

#integrations .int-wrapper div:hover {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

#integrations .int-wrapper div:hover::after {
    opacity: 1;
}

#integrations .int-wrapper{
	float: left;
	width: 20%;
	height: 100px;
	box-shadow: 0 0px 2px rgba(0, 0, 0, 0.5);
	margin-right: 20px;
	text-align: center;
	margin-bottom: 20px;
	position: relative;
	border: 11px solid white;
}
#integrations .int-wrapper div{
  background-size: contain;
  position: absolute;
  top: 0;
  left: 0;
  background-position: center;
  background-repeat: no-repeat;
  height: 100%;
  width: 100%;
}

.svg.plugins{
	background-image: url(../img/svg/plugins1.svg);
	height: 75px;
	width: 377px;
	/* top: 0px; */
	/* right: 3px; */
	background-size: 378px 2042px;
	background-repeat: no-repeat;
	background-position: right top;
	transition: all .2s ease-in-out;
	/*border: 1px solid red;*/
}
.svg.products{
	background-image: url(../img/svg/products1.svg);
	height: 75px;
	width: 325px;
	top: 0px;
	right: 3px;
	background-size: 330px 1970px;
	background-repeat: no-repeat;
	background-position: right top;
	transition: all .2s ease-in-out;
	/*border: 1px solid red;*/
}
.svg.plugins:hover, .svg.products:hover{
	transform: scale(1.2);
}
.svg.plugins.dec{
	background-position: -0px -20px;
}
.svg.plugins.AI{
  background-position: -0px -538px;
}
.svg.plugins.class{
	background-position: -0px -95px;
}
.svg.plugins.filter{
	background-position: -0px -167px;
}
.svg.plugins.isim{
	background-position: -0px -242px;
}
.svg.plugins.hypervisor{
	background-position: -0px -315px;
}
.svg.plugins.mailmonitor{
	background-position: -0px -389px;
}
.svg.plugins.ml{
	background-position: -0px -463px;
}

/*-- Products ----------*/

.svg.products.desktop{
	background-position: -0px -10px;
}
.svg.products.mobile{
	background-position: -0px -89px;
}
.svg.products.ultimate{
	background-position: -0px -169px;
}
.svg.products.x{
	background-position: -0px -248px;
}
.svg.products.complete{
	background-position: -0px -327px;
}
.svg.products.cloudpro{
	background-position: -0px -406px;
}
.svg.products.light{
	background-position: -0px -485px;
}
.svg.products.appliance{
	background-position: -0px -564px;
}
.svg.products.cloudbasic{
	background-position: -0px -643px;
}
.svg.products.linux{
	background-position: -0px -722px;
}
.svg.products.userguide{
	background-position: -0px -801px;
}
.svg.products.detect{
	background-position: -0px -882px;
}
.svg.products.lab{
	background-position: -0px -964px;
}
.svg.products.trace{
	background-position: -0px -1042px;
}

/* Joe security font end */


.productSpecialWidth{
	width: 250px; 
	padding: 0px;
}
.product-overview .icon{
	font-size: 26px;
	margin: 0px 8px;
	color: var(--black-900);
}
.newLabelWrapper{
	color: white;
	font-weight: bold;
	width: 100%;
	position: absolute;
	top: 32px;
	left: 0px;
}
.newLabelWrapper.newLabelSmall{
	transform: scale(0.8);
	transform-origin: top left;
	top: 26px;
}
.newLabelWrapper span, .newLabelWrapper img{
	position: absolute;
	top: 0;
	left: 0;
}
.newLabelWrapper span{
	text-shadow: 1px 1px rgba(0,0,0,0.7);
	top: 4px;
	left: 13px;
}
.newLabel{
	background-color: #de0000;
	color: white;
	text-shadow: 1px 1px rgba(0,0,0,0.5);
	border-radius: 4px;
	border: 1px solid #d30000;
	font-size: 10px;
	font-weight: bold;
	padding: 0px 3px 1px 3px;
	vertical-align: 1px;
}
#main-gfx{
	position: absolute; 
	top: -70px; 
	left: 190px;
}
.integration-nav{
	cursor: pointer; cursor: hand;
}
#integrations ul li a{
	cursor: pointer; cursor: hand;
}
#integrations h2{
	margin-bottom: 5px;
	margin-top: 10px;
}

#twitterNewsline{
	z-index: 15;
	position: relative;
}
#top-image{
	opacity: 0;
}
.cc-window.cc-floating{
	max-width: none!important;
	width: 100%!important;
}


/* To sort */


#download-userguide-sprite{
	display: inline-block; 
}
#download-userguide{
	text-align: center; 
	width: 157px;
}
.blogPost h3{
	margin-top: 25px;
	margin-bottom: 10px;
}
.blogPost img{
	padding: 10px;
	box-shadow: 0 2px 5px rgba(0,0,0,0.3);
}
#twitterNewsline{
	overflow: hidden;
	height: 60px;
	background-color: rgba(241,241,241,0.6);
	color: #282828;
	-webkit-border-bottom-right-radius: 8px;
	-webkit-border-bottom-left-radius: 8px;
	-moz-border-radius-bottomright: 8px;
	-moz-border-radius-bottomleft: 8px;
	border-bottom-right-radius: 8px;
	border-bottom-left-radius: 8px;
}
.scroll-text .timePosted{
	display: none;
}
.scroll-text{
	margin: 15px 0 0 0;
	padding-top: 10px;
	white-space: nowrap;
	overflow: hidden;
}
.tweet{
	line-height: 30px;
}
.scroll-text li, .scroll-text p{
	display: inline;
}
#noscript-warning{
	margin-left: -470px;
	width: 940px;
	background: #f6d2d2;
	color: var(--black-900);
	text-align: center;
	position: fixed;
	top: 85px;
	left: 50%;
	height: 24px;
	padding-top: 7px;
	font-size: 14px;
	z-index: 99999;
	font-weight: bold;
}


.clickable{
	cursor: pointer;
	cursor: hand;
}

.alignright {
	float: right;
}
li.footermenu {
	padding-top: 5px;
	padding-bottom: 5px;
}
i.icon-white {
	color: white;
}
.nav i {
	margin-top: 2px;
}
.hero-unit-small {
	margin: 0;
	padding: 30px;
}
td.tdcenter {
	text-align: center;
}
th.thcenter {
	text-align: center;
}
.img-rounded {
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	z-index: -1;
}
.img-polaroid {
	padding: 4px;
	background-color: #fff;
	border: 1px solid #ccc;
	border: 1px solid rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.img-circle {
	-webkit-border-radius: 500px;
	-moz-border-radius: 500px;
	border-radius: 500px;
}
.product-hero-unit {
	padding-top: 20px;
	font-size: 15px;
}
.font-size-big{
	font-size: 15px;
	line-height: 22px;
}
.hand-pointer {
	cursor: pointer;
}
.about-company .hero-unit , .about-team.hero-unit {
	padding: 30px;
}
.team-member {
	border-bottom: 1px solid #ccc;
	margin-bottom: 20px;
	padding-bottom: 10px;
}
.team-member:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
	border: none;
}

.biglist {
	font-size: 18px;
	font-weight: 200;
	line-height: 27px;
}
.glyphicon-ok {
	color: green;
	font-size: 18px;
}
.glyphicon-circle-arrow-down {
	color: green;
	font-size: 20px;
}
.grey-gradient {
	background: #ededed;
 /* Old browsers */
	background: -moz-linear-gradient(left,  #ededed 0%, #ffffff 100%);
 /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#ededed), color-stop(100%,#ffffff));
 /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  #ededed 0%,#ffffff 100%);
 /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  #ededed 0%,#ffffff 100%);
 /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  #ededed 0%,#ffffff 100%);
 /* IE10+ */
	background: linear-gradient(to right,  #ededed 0%,#ffffff 100%);
 /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#ffffff',GradientType=1 );
 /* IE6-9 */;
 	font-family: Arial, sans-serif!important;
}
#faq{
	padding-left: 15px;
}
#faq h3{
	font-size: 16px;
	font-family: arial;
	font-weight: bold;
}
#faq p{
	margin-bottom: 25px;
	line-height: 21px;
}
.create-link-block {
	position: relative;
}
.link-block {
	position: absolute;
	z-index: 9999;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.joe-unit {
	padding-top: 20px;
	padding-left: 20px;
	padding-bottom: 20px;
	margin-left: 0px;
}
.joe-unit h3 {
	font-size: 19px;
	margin-bottom: 12px;
}
.joe-unit img {
	float: right;
}
.technology-block {
	margin-bottom: 22px;
}
.technology-block p {
	font-size: 15px;
	line-height: 24px;
}
.technology-block img {
	margin-left: 40px;
	margin-right: 37px;
}

p.intro{
	font-size: 17px;
}


.span-special {
	width: 430px;
}
.call-for-action p {
	text-align: center;
	line-height: 21px;
	font-size: 15px;
}
.call-for-action a {
	text-decoration: underline;
}
.call-for-action a:hover {
	color: var(--black-900);
	text-decoration: none;
}
.call-for-action {
	margin-top: 24px;
	color: white;
	border: 2px solid var(--black-900);
	padding: 20px 70px 24px 70px;
	text-align: center;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
.call-for-action h3 {
	font-size: 24px;
	margin-bottom: 12px;
}
.call-for-action.ISIM a {
	color: #bdf5ff;
}
.call-for-action.lab {
	border: 2px solid #0036AF;
	background: #0037D1;
	color: white;
}
.call-for-action.lab a{
	color: #70ff56;
}
.call-for-action.ISIM {
	border: 2px solid #124c56;
	background: #1e5e69;
}
.call-for-action.ML a{
	color: #FFFCEB;
}
.call-for-action.ML {
	border: 2px solid #A8115D;
	background: #BC1964;
}
.call-for-action.AI {
  border: 2px solid #19A576;
  background: #23B584;
}
.call-for-action.AI a{
  color: #defff4;
}
.call-for-action.dec {
	border: 2px solid #dd8700;
	background: #e5a400;
}
.call-for-action.class {
	border: 2px solid #5f2b26;
	background: #7c3f3a;
}
.call-for-action.filter {
	border: 2px solid #053156;
	background: #004077;
}
.call-for-action.cloud {
	border: 1px solid var(--black-200);
	background: none;
	color: var(--black-900);
	padding: 64px 24px;
	margin-top: 32px;
	margin-bottom: 0;
}
.call-for-action.complete {
	border: 2px solid #dc7c00;
	background: #ff7200;
}
.call-for-action.ultimate {
	border: 2px solid #2d2d2d;
	background: #181818;
}
.call-for-action.desktop {
	border: 2px solid #26005f;
	background: #3f009e;
}
.call-for-action.prodx {
	border: 2px solid #00a599;
	background: #00c1b7;
}
.call-for-action.prodlinux{
	border: 2px solid #edca1a;
	background: #f4d418;
	color: var(--black-900);
}
.call-for-action.light {
	border: 2px solid #4c4c4c;
	background: #606060;
}
.call-for-action.trace {
	border: 2px solid #bf0000;
	background: #ff0000;
}
.call-for-action.mobile {
	border: 2px solid #6d9100;
	background: #98ba1c;
}
.call-for-action.mailmonitor {
	border: 2px solid #ad8f12;
	background: #c7a127;
	color: #33240e;
}
.call-for-action.mail {
	border: 2px solid #ffc20e;
	background: #ffcc00;
	color: #33240e;
}
.call-for-action.hypervisor {
	border: 2px solid #3f0038;
	background: #60004e;
}
.call-for-action.a1 {
	border: 2px solid #003c62;
	background: #004e7f;
}
.call-for-action.a1 a{
	color: #c5f7ff;
}
.call-for-action.hypervisor a{
	color: #ffc0ff;
}
.call-for-action.mail a{
	color: #282c44;
}
.call-for-action.dec a {
	color: #fffeaa;
}
.call-for-action.filter a {
	color: #cfe9ff;
}
.call-for-action.class a {
	color: #ffdacb;
}
.call-for-action.cloud a {
	color: var(--blue-link);
}
.call-for-action.cloud a:hover {
	background: none;
	color: var(--blue-600);
	text-decoration: none;
}
.call-for-action.complete a {
	color: #ffdd68;
}
.call-for-action.ultimate a {
	color: #fff9c9;
}
.call-for-action.mailmonitor a {
	color: #33240e;
}
.call-for-action.trace a {
	color: #ffe1e1;
}
.call-for-action.desktop a {
	color: #cdcad8;
}
.call-for-action.prodx a {
	color: #abfcf4;
}
.call-for-action.light a {
	color: #d6d9ea;
}
.call-for-action.mobile a {
	color: #fffeda;
}
.call-for-action ul{
	list-style: none;
}

/* -------------------------------------------------- */

#wrap {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0px auto -210px;
}
#push {
	height: 206px;
}
/* --- PRODUCT OVERVIEW --- */

#product-overview-wrapper{
	width: 940px;
	height: 700px;
	position: relative;
}
#product-overview-background{
	background-image: url('../img/background.png');
	width: 940px;
	height: 700px;
	position: relative;
	z-index: 9;
}
#product-overview-background2{
	background-image: url('../img/background2.png');
	width: 940px;
	height: 700px;
	position: relative;
	z-index: 9;
}
#product-overview-column-titles{
	position: absolute;
	top: 50px;
}
#product-overview-column-titles h3{
	float: left;
	font-size: 17px;
}
#product-overview-column-titles #architecture{
	margin-left: 230px;
}
#product-overview-column-titles #scale{
	margin-left: 183px;
}
#product-overview-column-titles #plugins{
	margin-left: 183px;
}
#product-overview-column-titles #classification{
	margin-left: 157px;
}
.product-package{
	cursor: hand; cursor: pointer;
	width: 127px;
	height: 164px;
	background: url('../img/sprite.png') -7px -455px no-repeat;
	position: relative;
}
.product-package:hover{
	background: url('../img/sprite.png') -154px -455px no-repeat;
}
.product-package h2{
	width: 127px;
	text-align: center;
	bottom: 12px;
	position: absolute;
	margin: 0px;
	font-size: 20px;
}
.rotate-container{
	position: absolute;
	display: inline-block;
	z-index: 11;
}
.rotate-img {
	width: 95px;
	height: 98px;
	overflow: hidden;
	cursor: hand; cursor: pointer;
	-webkit-transform: rotate(0rad) scale(0.87);
	transform: rotate(0rad) scale(0.87);
}
.rotate-container:hover .rotate-img, .product-package:hover .rotate-img {
	opacity: 0.8;
	-webkit-transition: all 1s linear;
	-webkit-transform: rotate(1rad) scale(1);
    transition: all 1s;
	transform: rotate(1.4rad) scale(1);
}
.scale-img {
	width: 91px;
	height: 94px;
	overflow: hidden;
	cursor: hand; cursor: pointer;
	-webkit-transform: scale(0.87);
	transform: scale(0.87);
	-webkit-transition: all 0.4s;
	transition: all 0.4s;
}
.rotate-container:hover .scale-img {
	opacity: 0.8;
	-webkit-transition: all 1s linear;
	-webkit-transform: scale(1);
    transition: all 1s;
	transform: scale(1);
}
.product-icon{
	position: absolute;
}
.rotate-img{
	-webkit-transition: all 1s;
	transition: all 1s;
	position: relative;
}
#product-overview-ultimate{
	top: 98px;
	position: absolute;
	width: 930px;
}
#product-overview-cloud{
	top: 266px;
	position: absolute;
	width: 930px;
}
#product-overview-cloud h2{
	color: #0074bc;
}
#product-overview-complete{
	top: 434px;
	position: absolute;
	width: 930px;
}
#product-overview-complete h2{
	color: #f27e00;
}
.desktop.rotate-container{
	left: 136px;
	top: 34px;
}
.mobile.rotate-container{
	left: 231px;
	top: 34px;
}
.prodx.rotate-container{
	left: 326px;
	top: 34px;
}
.filter.rotate-container{
	left: 446px;
	top: 36px;
}
.filter.rotate-container.new{
	left: 440px;
	top: 36px;
}
.dec.rotate-container{
	left: 533px;
	top: 36px;
}
.light.rotate-container{
	left: 543px;
	top: 36px;
}
.class.rotate-container{
	left: 660px;
	top: 36px;
}
.class.rotate-container.new{
	left: 626px;
	top: 36px;
}
.desktop .product-icon{
	width: 32px;
	height: 26px;
	background: url('../img/sprite.png') -246px -7px no-repeat;
	top: 36px;
	left: 31px;
}
.desktop .rotate-img{
	background: url('../img/sprite.png') -122px -120px no-repeat;
}
.mobile .product-icon{
	width: 22px;
	height: 33px;
	background: url('../img/sprite.png') -298px -7px no-repeat;
	top: 32px;
	left: 37px;
}
.mobile .rotate-img{
	background: url('../img/sprite.png') -229px -120px no-repeat;
}
.ultimate.rotate-container, .complete.rotate-container, .cloud.rotate-container{
	margin-top: 34px;
	margin-left: 15px;
}
.ultimate .product-icon{
	width: 40px;
	height: 31px;
	background: url('../img/sprite.png') -194px -7px no-repeat;
	top: 31px;
	left: 26px;
}
.ultimate .rotate-img{
	background: url('../img/sprite.png') -11px -120px no-repeat;
}
.prodx .product-icon{
	width: 32px;
	height: 27px;
	background: url('../img/sprite.png') -151px -7px no-repeat;
	top: 35px;
	left: 31px;
}
.prodx .rotate-img{
	background: url('../img/sprite.png') -10px -341px no-repeat;
}
.light .product-icon{
	width: 32px;
	height: 32px;
	background: url('../img/sprite.png') -56px -7px no-repeat;
	top: 32px;
	left: 29px;
}
.light .rotate-img{
	background: url('../img/sprite.png') -12px -229px no-repeat;
}
.cloud .product-icon{
	width: 44px;
	height: 32px;
	background: url('../img/sprite.png') -98px -7px no-repeat;
	top: 32px;
	left: 27px;
}
.cloud .rotate-img{
	background: url('../img/sprite.png') -122px -229px no-repeat;
}
.complete .product-icon{
	width: 40px;
	height: 32px;
	background: url('../img/sprite.png') -5px -7px no-repeat;
	top: 32px;
	left: 28px;
}
.complete .rotate-img{
	background: url('../img/sprite.png') -230px -229px no-repeat;
}
.filter .product-icon{
	width: 45px;
	height: 55px;
	background: url('../img/sprite.png') -95px -53px no-repeat;
	top: 18px;
	left: 24px;
}
.dec .product-icon{
	width: 61px;
	height: 55px;
	background: url('../img/sprite.png') -163px -53px no-repeat;
	top: 22px;
	left: 19px;
}
.filter .scale-img{
	background: url('../img/sprite.png') -125px -343px no-repeat;
}
.dec .scale-img{
	background: url('../img/sprite.png') -338px -343px no-repeat;
}
.class .product-icon{
	width: 56px;
	height: 51px;
	background: url('../img/sprite.png') -14px -55px no-repeat;
	top: 19px;
	left: 17px;
}
.class .scale-img{
	background: url('../img/sprite.png') -231px -343px no-repeat;
}
#product-overview-right2, #product-overview-right{
	position: absolute;
	right: 20px;
	bottom: 110px;
	width: 330px;
	height: 200px;
	z-index: 10;
}
.rotate-container.big{
	padding: 0;
	margin-top: -68px;
	margin-left: 150px;
	left: 0;
	top: 0;
}
.rotate-container.big .rotate-img, .rotate-container.big .scale-img{
	transform: scale(1)!important;
}
#product-overview-right2 h2, #product-overview-right h2{
	text-align: right;
	margin-top: 50px;
	margin-bottom: 5px;
}

#product-overview-right2, #product-overview-right{
	position: absolute;
	right: 20px;
	bottom: 110px;
	width: 330px;
	height: 200px;
	z-index: 10;
}
.rotate-container.big2, .rotate-container.big{
	padding: 0;
	margin-top: -68px;
	margin-left: 150px;
	left: 0;
	top: 0;
}
#product-overview-right2 h2, #product-overview-right h2{
	text-align: right;
	margin-top: 50px;
	margin-bottom: 5px;
}

#product-overview-right2 p, #product-overview-right p{
	font-family: var(--font-heading);
	font-size: 15px;
	padding-top: 0px;
	margin-top: 0px;
	line-height: 22px;
}
#mobile{
	display: none;
}
/* --- PRODUCT OVERVIEW END --- */


/* REPORTS START */

.reports-grid {
  display: grid;
  gap: 32px; 
  grid-template-columns: repeat(1, 1fr);
}

/* Tablet: 3 columns */
@media (min-width: 768px) {
  .reports-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Desktop: 5 columns */
@media (min-width: 1024px) {
  .reports-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.report-box{
  position: relative;
	height: 200px;
	overflow: hidden;
	border: 1px solid #dee4e4;
}
.report-box:hover{
  border: 1px solid #cdd8dd;
  box-shadow: 0 0 11px rgba(0,0,0,0.08)
}
.report-box .top .productlogo{      
  margin-right: 8px;
  float: left;
  height: 50px;
  width: 50px;
  background-image: url('../img/reports-product-sprite.png');
}
.report-box .top .productlogo.ultimate{
  background-position: 0px -4px;
}
.productlogo.ultimate + h5 a{
	color: #212121;
}
.report-box .top .productlogo.desktop{
  background-position: 0px -62px;
}
.productlogo.desktop + h5 a{
	color: #3f009e;
}
.report-box .top .productlogo.mobile{
  background-position: 0px -120px;
}
.productlogo.mobile + h5 a{
	color: #99cc00;
}
.report-box .top .productlogo.x{
  background-position: 0px -178px;
}
.productlogo.x + h5 a{
	color: #00a599;
}
.report-box .top .productlogo.cloud{
  background-position: 0px -236px;
}
.productlogo.cloud + h5 a{
	color: #0074bc;
}
.report-box .top .productlogo.complete{
  background-position: 0px -294px;
}
.productlogo.complete + h5 a{
	color: #ff8b00;
}
.report-box .top .productlogo.filter{
  background-position: 0px -352px;
}
.productlogo.filter + h5 a{
	color: #024c73;
}
.report-box .top .productlogo.class{
  background-position: 0px -410px;
}
.productlogo.class + h5 a{
	color: #7c3f3a;
}
.report-box .top .productlogo.scale{
  background-position: 0px -468px;
}
.productlogo.scale + h5 a{
	color: #5b5b5b;
}
.report-box .link-box{
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.report-box .top{
  position: relative;
  padding: 8px 7px;
  background-color: #f6f6f6;
  border-bottom: 1px solid #eaeaea;
}
.report-box .top .date{
  color: #4a4a4a;
  font-size: 12px;
}
.report-box .top a{
  text-decoration: none;
  color: #0088cc;
}
.report-box .top a:hover{
  text-decoration: underline;
}
.report-box .top h5{
  font-weight: bold;
  font-size: 13px;
  margin: 0px;
  margin-top: 10px;
}
.report-box .center{
  text-align: left;
  height: 90px;
  line-height: 18px;
  padding: 8px 7px;
  font-size: 14px;
  margin: 0;
	overflow: hidden;
  background-color: white;
}
.report-box .bottom{
	align-items: center;
	background-color: #f6f6f6;
  border-top: 1px solid #eaeaea;
	display: flex;
  font-size: 10px;
	height: 22px;
  line-height: 11px;
  margin: 0;
  padding: 2px 2px;
  word-break: break-all;
	width: 100%;
}
.reports-switch-button{
  margin: 40px auto;
  width: 320px;
}
.reports-switch-button a:hover{
  border: 1px solid #c9d5da;
  border-left: 1px solid #f2f2f2;
  text-decoration: underline;
}
.reports-switch-button a{
  padding: 6px 0;
  margin: 0;
  display: inline-block;
  width: 155px;
  text-align: center;
  font-size: 14px;
  border: 1px solid #f2f2f2;
  background-color: #f2f2f2;
  color: #0096da;
  text-decoration: none;
}
.reports-switch-button a.active{
  border: 1px solid #dddddd;
  background-color: white;
  color: var(--black-900);
  text-decoration: none;
}
.reports-switch-button a.switch-left{
  -webkit-border-top-left-radius: 10px;
  -webkit-border-bottom-left-radius: 10px;
  -moz-border-radius-topleft: 10px;
  -moz-border-radius-bottomleft: 10px;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}
.reports-switch-button a.switch-right{
  -webkit-border-top-right-radius: 10px;
  -webkit-border-bottom-right-radius: 10px;
  -moz-border-radius-topright: 10px;
  -moz-border-radius-bottomright: 10px;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}


.class-description{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ebebeb+0,f6f6f6+100 */
	background: #ebebeb; /* Old browsers */
	background: -moz-linear-gradient(left, #ebebeb 0%, #f6f6f6 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #ebebeb 0%,#f6f6f6 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #ebebeb 0%,#f6f6f6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebebeb', endColorstr='#f6f6f6',GradientType=1 ); /* IE6-9 */
	position: absolute;
	right: 66px;
	font-weight: bold;
	width: 0;
	top: 0;
	left:0;
	height: 100%;
	display: flex;
	align-items: center;
	transition: width 0.5s ease;
}
.type .class-description span{
	vertical-align: middle; 
	line-height: 64px;
}

.class-description span {
  display: inline-block;
  opacity: 0;
  transition: opacity 0.03s ease;
}

.type:hover + .class-description {
  width: calc(100% - 71px); 
	padding-left: 8px;
}

.type:hover + .class-description span {
  opacity: 1;
  transition: opacity 0.5s ease 0.5s; /* Fade in after width expands */
}

/* Optional: Ensure span fades out before width contracts */
.type:not(:hover) + .class-description span {
  transition: opacity 0.03s ease 0s;
}


.type{
	background-image: url(../img/type.png);
	height: 64px;
	width: 64px;
	position: absolute;
	top: 0px;
	right: 3px;
	cursor: pointer;
}
.type.miner{
	background-position: 0px 0px;
}
.type.rat{
	background-position: 0px -64px;
}
.type.trojan{
	background-position: 0px -128px;
}
.type.apt{
	background-position: 0px -192px;
}
.type.phishing{
	background-position: 0px -256px;
}
.type.info-stealer{
	background-position: 0px -320px;
}
.type.ransomware{
	background-position: 0px -384px;
}
.type.e-banking-trojan{
	background-position: 0px -448px;
}
.type.adware{
	background-position: 0px -512px;
}
.type.spyware{
	background-position: 0px -576px;
}
.type.spreading{
	background-position: 0px -640px;
}
.type.exploiter{
	background-position: 0px -704px;
}
.type.country-detection{
	background-position: 0px -768px;
}
.type.vm-detection{
	background-position: 0px -832px;
}
.type.debugger-detection{
	background-position: 0px -896px;
}
.type.sandbox-detection{
	background-position: 0px -960px;
}
.type.user-behavior-detection{
	background-position: 0px -1024px;
}
.type.time-detection{
	background-position: 0px -1088px;
}
.type.language-detection{
	background-position: 0px -1152px;
}
.type.sleep-evasion{
	background-position: 0px -1216px;
}

/* Animation classes */


@media (max-width: 320px) {
	.reports-switch-button {
	    width: 283px;
	}
	.reports-switch-button a{
		width: 139px;
	}

}
/* evasive reports */
#evasive .report-box{
	height: 250px;
}
#evasive .report-box .center{
	height: 140px;
}
#evasive{
	width: 972px;
}
/* REPORTS END */

#legal-notices{
	background: #f1f1f1;
	font-size: 12px;
}

.threecolumn{
	-webkit-column-count: 2;
	-moz-column-count: 2;
	column-count: 2;
	-webkit-column-gap: 75px;
	-moz-column-gap: 75px;
	column-gap: 75px;
	line-height: 27px;
	margin-bottom: 30px;
}
/*-- PRODUCTS SUBNAV END ----*/
.social-sprite{
	background-image: url(../img/social-sprite.png);
	width: 28px;
	height: 20px;
}
.social-sprite.youtube{
	background-position: 0 0;
}
.social-sprite.youtube:hover{
	background-position: 0 -32px;
}
.social-sprite.github{
	background-position: -32px 0;
}
.social-sprite.github:hover{
	background-position: -32px -32px;
}
.social-sprite.twitter{
	background-position: -64px 0px;
}
.social-sprite.linkedin{
	background-position: -96px 0px;
}
.social-sprite.facebook{
	background-position: -128px 0px;
}
.social-sprite.twitter:hover{
	background-position: -64px -32px;
}
.social-sprite.linkedin:hover{
	background-position: -96px -32px;
}
.social-sprite.facebook:hover{
	background-position: -128px -32px;
}
.imageSubText{
  text-align: center;
  margin-top:  -50px;
  font-size:  11px;
}
.imageandimagesubtextwrapper{
  float: right;
  margin-left: 40px;
  margin-right: 40px;
  margin-top: -20px;
}
.imageandimagesubtextwrapper img{
  float:  none;
}
/* Responsive for Joe */
@media (max-width: 1800px){
	#trace-comparison-wrapper img, #trace-comparison-wrapper .span3{
		float: inherit!important;
		width: auto;
	}
}

@media (max-width: 1030px) {
	#freeServices{
		display: none;
	}
	#twitterNewsline{
		display: none;
	}
	#product-overview-wrapper{
		display: none;
	}
	.grey-gradient{
		margin-top: 0!important;
	}
	#mobile{
		display: block;
	}
	body{
		overflow-x: hidden;
	}
	.technology-block img {
		width: 60%;
		margin-top: 5px!important;
		margin-left: 20px!important;
		margin-right: 0!important;
		margin-bottom: 0px;
	}
	.left-text{
	width: auto;
	}
	.technology-block .span12 {
		width: 95%;
	}
	.technology-block img {
		margin-left: 10px;
		margin-right: 50px;
	}
	#showErrors, #top-image {
		display: none;
	}
	.header {
		height: 400px;
		margin-top: -65px;
	}
	.span-special {
		width: 350px;
	}
}
@media (max-width: 767px) {
  .joesandboxcloudbasicwrapperad{
    margin-top: 200px;
    margin-bottom: -200px;
  }
	.imageSubText{
    margin-bottom:  30px;
  }
  .imageandimagesubtextwrapper{
    margin-top: 10px;
  }
	.table-responsive {
		width: 115%;
		padding-top: 25px;
		overflow: visible;
		overflow-x: scroll;
		-webkit-overflow-scrolling: touch;
	}
	.threecolumn{
		-webkit-column-count: 1;
		-moz-column-count: 1;
		column-count: 1;
	}
	.ring-mobile{
		margin-right: 20px;
	}
	.offset-home{
		margin-left: 0;
	}
	#joe-footer {
		background-image: none;
		height: auto;
		margin-left: -20px;
		margin-right: -20px;
		padding-left: 20px;
		padding-right: 20px;
	}
	#joe-footer .span4{
		width: 30%;
		float: left;
	}
	.technology-block img {
		float: none!important;
		width: 90%;
		height: auto;
		margin: 0;
		margin-top: 5px!important;
		margin-bottom: 20px;
	}
	.product-block .span9 {
		width: 60%;
		float: left;
	}
	.product-block .span9 p {
		font-size: 14px;
		line-height: 19px;
	}
	.product-block .span3 {
		width: 30%;
		float: right;
	}
	.product-block .product-hero-unit {
		height: auto;
	}
	.span6:after, .product-block:after, .span-home:after {
		content: ".";
		display: block;
		clear: both;
		visibility: hidden;
		line-height: 0;
		height: 0;
	}
}
@media (max-width: 480px) {

  #joe-footer{
    bottom: -7px;
    position: relative;
  }
  #why-joe-sandbox h2{
    line-height: 24px;
  }

  #why-joe-sandbox.container{
    width: 85%;
    margin-left: 0px;
  }
	.technology-block p.left-text {
		width: 100%;
	}
	#versions img{
		height: 30px;
		padding: 0px 10px;
		width: auto;
	}
	.blogPost img {
		height: auto;
		margin-left: -23px;
	}
	#trace-explained-wrapper .row.popup-gallery{
		margin: 0!important;
		margin-bottom: 20px!important;
	}
	.productintroductiondescription{
		width: 100%;
	}
	#trace-comparison-wrapper .product-introduction img {
		max-width: 100%;
	}
	#main-gfx{
		transform: scale(1.8);
		margin-top: -178px;
		position: relative;
		margin-left: -197px;
	}
	#evasive{
		width: 500px;
	}
	#home{
		overflow-x: hidden;
	}
  .download-button-wrapper .btn-success{
    margin-bottom: 20px;
    margin-top: -20px;
  }
  .download-button-wrapper{
    margin-bottom: 35px!important;
  }
	.form-textbox, .form-textarea, .form-captcha input{
		padding: 14px!important;
	}
	.joe-unit img{
		float: none;
		width: 100%;
		margin-bottom: 20px;
	}
	#cloud .product-overview tr{
		margin-bottom: 40px;
		display: block;
	}
	.product-overview tr td{
		font-size: 14px;
		line-height: 19px;
	}
	p.intro{
		font-size: 15px;
		line-height: 24px;
	}
	.titleImage div{
		height: 150px!important;
	}
	.post-title{
		float: right;
		width: 50%;
	}
	.blog-post-image{
		width: 89px!important;
		height: 47px!important;
		margin-top: 1px!important;
	}
	#custom-search-form .btn{
		margin-right: 5px;
		top: -34px;
		left: unset;
		float: right;
	}
	#custom-search-form .search-query{
		padding: 10px 15px;
		width: 250px;
	}
	.container{
		width: 100%;
		margin: 0 auto;
	}
	#basicModal #basicModalLabel{
		width: 70%;
	}
	#basicModal .form-textbox{
		padding: 15px 10px;
	}
	#basicModal {
	    width: 347px;
	    margin: -288px 0 0 3px;
	}
	#basicModal .modal-body{
		padding-top: 0px;
	}
	#basicModal .form-line.jf-required{
		margin-top: 5px;
	}
	#basicModal.modal.fade.in{
		top: 50%;
	}
	.product-page .product-overview #productFeaturesThead{
		display: table-header-group;
	}
	#productFeaturesMobileReplace td{
		display: table-cell;
	}
	#isMobile{
		display: block;
	}

	.svg.plugins {
		transform: scale(0.85);
		margin-left: -82px;
	}
	.cc-color-override-1830989329.cc-window{
		margin-left: -20px;
	}
	.span-home h3{
		width: 220px;
		line-height: 25px;
		font-size: 18px;
	}
	.product-page .product-overview tbody td:not(:last-child), .product-page .product-overview tbody td{
		/* text-align: center; */
		display: block;
		border-right: 0px;
		border-bottom: 1px solid #e2e2e2;
		width: 300px!important;
	}
	.svg.products{
		/* margin-right: 100px; */
	}
	#productFeaturesMobileReplace .svg.products{
		margin-right: 0px;
	}
	.analysis-scope{
		margin-top: 22px!important;
	}
	.product-page .product-overview tbody td:last-child{
		border-bottom: 3px solid #e2e2e2;
	}
	.products-sprite{
		margin-left: -10px;
	}
	.plugins-hover{
		width: 88px!important;
	    margin-left: -60px;
	    background-position: 0 -27px;
	    top: 6px;
	}
	.product-page thead{
		display: none;
	}
	.product-page .tab-content{
		width: 320px;
	}
	.header {
		height: 515px;
	}
	.header.home #arcs-image{
		left:25px;
		top: 275px;
		width: 250px;
	}
	.span-home .front {
		float: right;
		margin: 27px 0 0px 15px;
		width: 100px;
		height: 100px;
	}
	.span-home .margin-left{
		margin-left: 5px;
	}
	.product-block .span3 img {
		margin-top: 15px;
	}
	.call-for-action {
		padding: 20px 30px 25px 30px;
	}
	.header.home .headermsgbig {
		font-size: 34px;
		line-height: 39px;
		top: 0px;
	}
	.header.home .subtitle {
		top: 180px;
		font-size: 15px;
		margin-right: 0px;
	}
	.header.home .subtitle br {
		display: none;
	}
	#arcs3 {
		display: none;
	}
	.product-block .span3{
		margin-right: 20px;
	}
	.product-block .product-hero-unit{
		padding-left: 10px;
	}
}
@media (max-width: 320px) {
	.products-sprite {
	    margin-left: -20px;
	}
	.products-sprite {
	    transform: scale(0.9, 0.9);
	}
	.svg.products {
		transform: scale(0.85);
		 margin-left: -45px; 
	}

	.product-page .product-overview tbody td:not(:last-child), .product-page .product-overview tbody td{
		width: 250px!important;
	}
	.header.home #arcs-image{
		left:10px;
		top: 300px;
		width: 200px;
		
	}
	.header.home .subtitle {
		top: 210px;
		font-size: 15px;
		margin-right: 0px;
	}
	.technology-block img{
		width: 100%;
		margin: 0 0 30px 0!important;
	}
}
/* Wide Layout */
@media (min-width: 1800px) {
	#evasive{
		width: 1230px;
	}
	.container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {
		width: 1200px!important;
	}
	.span-home{
		width: 570px;
		margin-top: 30px;
	}
	.header.home #arcs {
		left: 450px;
	}
	.header.home #showErrors {
		left: 1000px;
	}
	.span6 {
		width: 590px;
	}
	.header.home #top-image {
		margin-left: 90px;
	}
	.span-home .margin-left p{
		margin-top: 15px;
	}
	.span-home .front {
		margin-top: 0px;
	}
	.offset-home {
	    margin-left: 60px;
	}
	.span12{
		width: 1200px;
	}
	.product-page .tab-content{
		width: 1200px;
	}
	.jotform-form{
		margin-left: 210px;
	}
	.span8 {
		width: 880px;
	}
	#key-features .span9{
		width: 890px;
	}
	.span9{
		width: 970px;
	}
	#integrations .int-wrapper{
		margin-right: 37px!important;
	}
	#faq{
		width: 1190px;
	}
	.technology-block p.left-text{
		width: 430px;
	}
	.header.home #showErrors li .alert-text {
	    width: 150px;
	}
	.header.home #showErrors {
		top: 70px;
	}
	.span10.offset1{
		margin-left: 260px;
	}
	.span6.topPostsTextWrapper{
		width: 720px;
	}
	.span6.titleImage{
		width: 460px;
	}
	.technology-block p.left-text{
		width: 560px;
	}
	#partner p{
		margin-left: 130px;
		margin-right: 130px;
	}
	#partner .form-all{
		margin-left: 53px;
	}
	#events .row{
		margin-left: 0px;
	}
	#download-userguide{
		width: 207px;
	}
}

/* New width design for xtra length */
@media only screen and (min-width: 1400px) {
	/*New width of container*/
  #why-joe-sandbox .span3{
    width: 200px;
  }
	.container, .navbar-fixed-top .container, .navbar-fixed-bottom .container, .product-page .tab-content, #evasive {
		width: 1200px;
	}
	.span6{
		width: 590px;
	}
	.span12 {
	    width: 1200px;
	}
	.span-home {
		width: 570px;
	}
	.span8{
		width: 800px;
	}
	.span3{
		width: 300px;
	}
	.span6.titleImage{
		width: 460px;
		float: right;
	}
	.span6.topPostsTextWrapper{
		width: 720px;
	}
}
@media only screen and (min-width: 1400px) {
  #why-joe-sandbox .span9 {
    width: 975px;
  }
}
/* Mobile */
@media only screen and (min-width : 320px) and (orientation: portrait) {
  .nav-collapse .nav > li{
    width: auto!important;
  }
}


@media screen and (max-width: 1400px) and (min-width: 1070px) {
	.nav-collapse .nav > li {
	    width: auto !important;
	}
	.navbar .nav > li > a {
		padding: 6px 0px 6px 22px;
	}
}
@media screen and (max-width: 1400px){
	#productsSubnav{
		left: -333px;
	}
	#solutionsSubnav {
	    left: -111px;
	}
	#technologySubnav {
	    left: 236px;
	}
	#showErrors{
		display: none;
	}
}