* {
    -webkit-tap-highlight-color: rgba(0,0,0,0); /* make transparent link selection, adjust last value opacity 0 to 1.0 */
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;

}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}

html, body {
    position: relative;
    height: 100%;
}

body {
    -webkit-touch-callout: none;                /* prevent callout to copy image, etc when tap to hold */
    -webkit-text-size-adjust: none;             /* prevent webkit from resizing text to fit */
    -webkit-user-select: text;                  /* prevent copy paste, to allow, change 'none' to 'text' */
    color:#333;
    background:#f9f9f9;
    font-family:"Source Sans Pro", sans-serif; /* 200 = ExtraLight, 300 = Light, 400 = regular, 600 = semi-bold, 700 = bold, 900 = black */
    font-weight:400;
    font-size:18px;
    margin:0px;
    padding:0px;
}

main {
    clear:both;
    padding-top:85px;
    margin:0;
}

.flag-word {
    border: 1px solid #999;
    border-radius: 5px;
    padding: 2px 7px;
    background-color: #999;
    color: #fff;
    font-size: 14px;
}

.standoutColor {
    color:#77c11f;
}

.newLabel {
    margin:10px 0 5px;
    color:#ea5741;
    font-weight: bold;
}

.centered {
    margin:0 auto;
}

/** font definitions **/
.font-extra-light {
    font-weight:200;
}

.font-light {
    font-weight:300;
}

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

.font-semi-bold, b {
    font-weight:600;
}

.font-bold {
    font-weight:700;
}

.font-black {
    font-weight:900;
}

a {
    color:#333;
    text-decoration: none;
}

a:hover {
    color:#000;
}

/** offsets in page anchors to accomdate for the fixed header **/
a.anchor {
    display: block;
    position: relative;
    top: -150px;
    visibility: hidden;
}

.underline {
    text-decoration: underline;
}

.cta a, a.cta {
    color:#ea5741;
}

a.blue-cta  {
    color: #3986c6;
}

a.blue-cta:hover {
    color: #eb5344;
}

a.white {
    color:#fff;
}


code, pre {
    background:#ededed;
    font-family: "Source Code Pro", Consolas, "Andale Mono", Monaco, monospace;
    font-size: 0.8em;
}

pre {
    font-size:14px;
    padding:30px;
    white-space: pre-wrap;       /* css-3 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

#blog .singleEntry pre {
	margin-bottom:20px;
}

#blog .comment {
    padding:20px;
    border:1px solid #333;
    border-radius:5px;
    font-style:italic;
}

#blog code .comment {
    border: none;
}

#blog figure img {
    width:100%;
    height:auto;
}

#blog strong {
    font-weight: 600;
}

#blog i {
    font-style:italic;
}

hr {
    clear:both;
    border: 0;
    height: 1px;
    background: #333;
    background-image: linear-gradient(to right, #ccc, #333, #ccc);
    margin-top:40px;
}

hr.new {
    background: #a3a2d0;
    background-image: linear-gradient(to right, #c0c0c0);
    margin-top:20px;
    margin-bottom:20px;
}

h1 {
    font-size:40px;
    font-weight:300;
}

h2 {
    font-weight:300;
    font-size:28px;
}

h3 {
    font-weight:700;
    font-size:24px;
}

h4 {
    font-weight:600;
    font-size:20px;
}

h5 {
    font-weight:400;
    font-size:20px;
}

.20pxSplitter {
    display:block;
    clear:both;
    position:relative;
    width:100%;
    min-height:20px;
   
}

.normal30 {
    font-weight:300;
    font-size:30px;
}

.semiHeavy {
    font-weight:400;
}

.heavy30 {
    font-weight:600;
    font-size:30px;
    color:#77c11f;
}

.heavy40 {
    font-weight:600;
    font-size:40px;
    color:#77c11f;
}

.white {
    color:#fff;
}

.dark {
    color:#333;
}

ul {
    margin:10px auto 30px;
 
}

li {
    line-height:1.5;
    margin:0px 0 10px 20px;
    font-weight:400;
}

li.light {
    
}

p, .block .textBody {
    line-height:1.5;
    margin:10px 0 30px;
}

p.casestudy {
    font-size:22px;
}

.contact.addresses {
    margin:0px 20px;
}

.contact.addresses p {
    margin:0px;
}

.contact.addresses p.name {
    font-weight:600;
}

.contact.addresses p.title {
    font-weight:500;
}

.contact.addresses p.sub-division {
    font-weight:600;
    font-size:20px;
    color:#888;
}

/**
 * Contact form
 */
 
input[type=text], textarea  {
    width: 100%;
    padding: 12px 10px;
    margin: 4px 0;
    border:2px solid #ccc;
    font-size:16px;
}

input[type=text]:focus, textarea:focus {
    border:2px solid #333;
    outline: none;
}

input[type="checkbox"] {
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline:2px solid #ccc;
  background: #fff;
  height:40px;
  width:40px;
  border:0px;
  margin: 8px 0;
}

input[type="checkbox"]:checked {
  background: #00b3e3;
  outline:2px solid #00b3e3;
}

input[type="checkbox"]:disabled {
  background: #e6e6e6;
  opacity: 0.6;
  pointer-events: none;
}

/* this handles the check mark styling */
input[type="checkbox"]:after {
  content:'';
  position: relative;
  left: 40%;
  top: 20%;
  width: 15%;
  height: 40%;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  display: none;
}

input[type="checkbox"]:checked:after {
  display: block;
}

input[type="checkbox"]:disabled:after {
  border-color: #7b7b7b;
}

input[type="checkbox"] + span {
    position:relative;
    top:-22px;
    left:20px;
}

textarea {
    height:140px;
}

.checkbox-holder {
    margin:0px 0 10px;
}

header {
    position: fixed;
    width:100%;
    height:85px;
    background: #fefefe;
    z-index:2000;
    border-bottom:1px solid #c0c0c0;
}

header .left {
    width:calc(100% - 700px);/*calc(65% - 280px);*/
    float:left;
    display:flex;
    flex-direction:row;
    justify-content:flex-end;
}

header .right {
    margin:0 10px 0 0;
    width:400px;/*calc(34% - 10px);*/
    float:right;
}

header .left nav {
    margin:15px 10px 0px 10px;
    display:block;
    height:70px;
    line-height:50px;
    width:75px;
}

header .right .item.navigation {
    float:right;
}

header nav.logo {
    margin:18px 20px;
    width:123px;
    height:45px;
    background: url(/images/header/artifex-logo-by-lode.png) 0px 0 no-repeat;
    background-size: 123px 45px;
    float:left;
}

header nav a {
    display:block;
    width:inherit;
    height:inherit;
    text-align:center;
    font-size:16px;
    text-decoration: none;
}

button {
    -webkit-appearance: none;
    -moz-appearance: none;
    border:0;
    text-transform:uppercase;
    border-radius:5px;
    font-size:16px;
    font-weight:500;
    min-height:40px;
    line-height:40px;
    padding: 0 15px;
    color:#fff;
    cursor:pointer;
}

button:focus {
    outline:0;
}

button.item.navigation {

}

button.item.navigation a {
    color:#fff;
}

button.item.navigation.search {
    padding:0;
    width:40px;
    margin:20px 10px 20px 0px;
    background: url(/images/header/icon-search.png) center center no-repeat;
    background-size: 18px 18px;
}

.search {
    display:none;
}

button.cta.orange {
    width:auto;
    background-image: linear-gradient(to right, #ea5842, #ec6343, #ed6d45, #ef7747, #f0804a);
}

button.cta.neon {
    width:auto;
    background-image: linear-gradient(to right, #ff4848, #ff4848, #ff4848, #ff4848, #ff4848);
}

button.cta.orange:hover {
    background:#ea5842;
}

button.cta.white {
    width:auto;
    background:#fff;
}

button.cta.orange.w200 {
    width:200px;
}

button.cta.orange.w250 {
    width:250px;
}

button.cta.orange.w300 {
    width:300px;
}

button.cta.orange.w350 {
    width:350px;
}

.button-holder {
    display:flex;
    align-items:center;
}

button.cta.orange.largeFixedWidth {
    width:160px;
    max-width:160px;
}

.inline-holder {
    display:block;
}

.inline-holder button.inline.b {
    margin:0px 0px 0px 20px;
}


/* Non-Retina-specific stuff here */
/*
@media 
(-webkit-min-device-pixel-ratio: 1), 
(min-resolution: 96dpi) { 
    
    button.cta.orange {
        width:auto;
        background:#ea5842;
    }
}
*/

button.cta a {
    color:#fff;
    text-decoration: none;
}

header nav a + div {
    
}

header nav a:hover, footer .inner a:hover {
    color:#ea5842;
}

header nav a:hover + div {
    
}

header nav:hover .revealed {
    visibility: visible;
    display: block;
}

header nav .revealed {
    visibility: hidden;
    margin-left:0px;
    background: #F0F0F0;
    width:400px;
    height:auto;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.2);
}

header nav .revealed .item.revealedNavigation {
    padding:15px;
    line-height:20px;
    width:100%;
    text-align:left;
}

header nav .revealed .item.revealedNavigation a {
    
}

/*** burger menu ***/
header .mobile-nav {
    position:fixed;
    visibility: hidden;
}

header .burger-icon {
    position:fixed;
    width:85px;
    height:85px;
    visibility:hidden;
    background: transparent url('/images/header/icon-burger-menu.png') center center no-repeat;
    background-size: contain;
    left:calc(100% - 85px);
}

header .burger-icon.on {
    background: transparent url('/images/header/icon-burger-menu-x.png') center center no-repeat;
    background-size: contain;
}

header .burger-menu {
    display:none;
    visibility:hidden;
    margin-top:85px;
    position:fixed;
    right:0;
    width:300px;
    height:100vh;
    background-color:rgba(255,255,255,0.95);
    border-left: 1px #c0c0c0 solid;
    overflow:scroll;
}

header .burger-menu nav a {
    width:100%;
    padding:20px 20px;
    text-align:left;
}

footer {
    margin:120px 0 0;
    width:100%;
    height:auto;
    min-height:300px;
    display:block;
    clear:both;
    background: #e2e2e2 url(/images/footer/artifex-a.png) left 0 no-repeat;
    background-size: contain;
}

footer .container {
    padding:60px 0 20px;
    height:inherit;
    min-height: inherit;
    display:flex;
    flex-direction:row;
}

footer .left {
    width:30%;
    height:inherit;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
}

footer .middle {
    width:50%;
    height:inherit;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
}

footer .right {
    width:20%;
    /*background: transparent url(/images/header/artifex-logo-by-lode.png) 0px 0 no-repeat;
    background-size: 123px 45px;*/
}

footer .left .inner {
    margin:0 50px 0 50px;
}

footer .left .inner div {
    margin-bottom: 20px;
}

footer .middle .inner {
    display:flex;
    flex-direction:row;
    align-items:flex-start;
    align-content:center;
}

footer .middle .inner .folder {
    width:30%;
}

footer .middle .inner .folder.a {
    margin:0 0 0 2.5%;
}

footer .middle .inner .folder.b {
    margin:0 2.5% 0 2.5%;
}

footer .middle .inner .folder.c {
    margin:0 2.5% 0 0;
}

footer .middle .inner .folder .title {
    color:#ea5842;
    font-size:15px;
    font-weight:600;
    margin:0 0 10px 0;
}

footer .middle .inner .folder .link {
    font-size: 14px;
    margin:5px 0 0 0;
}

footer .social {
    width:230px;
    margin:50px 0 0 0;
    display:flex;
    flex-direction:row;
    justify-content:space-between;
}

footer .social .icon {
    width:50px;
    height:50px;
    background-color: red;
}

footer .social .icon.linkedIn {
    background:transparent url(/images/logos/icon-linkedin.png) center center no-repeat;
    background-size:40px 40px;
}

footer .social .icon.facebook {
    background:transparent url(/images/logos/icon-fb.png) center center no-repeat;
    background-size:40px 40px;
}

footer .social .icon.twitter {
    background:transparent url(/images/logos/icon-twitter.png) center center no-repeat;
    background-size:40px 40px;
}

footer .social .icon.youtube {
    background:transparent url(/images/logos/icon-youtube.png) center center no-repeat;
    background-size:40px 40px;
}

footer .copyright {
    clear:both;
    color:#333;
    background-color: transparent;
    width:100%;
    height:30px;
    margin:-30px 0px 0px 0px;
    padding-right:25px;
    font-size:12px;
    text-align:right;
}

.pageMargined {
    margin:0 20px;
}

/*** hero ***/
.hero {
    width:100%;
    height:auto;
}

.hero .container {
    margin:0 auto;
    width:100%;
    max-width:1280px;
    min-height:350px;
    height:auto;
    display:flex;
    flex-direction:row;
    justify-content:left;
    align-items:center;
}

.hero .container .icon {
    width:30%;
}

.hero .container .icon img {
    width:100%;
}

.hero .container .left {
    width:120%;
    padding:20px 0 20px 20px; 
}

.hero .container .bg {
    width:100%;
    min-height:inherit;
    height:auto;
}

.hero .container .left .flex-container {
    height:auto; /* .hero .container height -40px */
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.hero .container h1 {
    position:relative;
    width:100%;
    font-size:50px;
    line-height:60px;
}

.hero .container h2 {
    font-size: 28px;
    line-height:36px;
    margin:20px 0 40px;
    width:100%;
}

.hero .container.small {
    min-height:100px;
}

.hero.header {
    z-index:100;
    margin:0;
    padding:0;
    background-image: linear-gradient(to right, rgb(0, 117, 207), rgb(0, 133, 215), rgb(0, 149, 220), rgb(0, 164, 224), rgb(0, 178, 226)); 
    background-position: initial initial; 
    background-repeat: initial initial;
}

.hero.header .small {
    min-height:100px;
}

.hero.header .container.small .left .flex-container {
    height:inherit;
}

.hero.header .container.small .left h1 {
    padding-top:0px;
}

.hero.header .bg {
    background-image:url(/images/heros/illustration-mesh.png);
    width: inherit; 
    height: inherit; 
    background-color: transparent; 
    background-size: contain; 
    background-position: 20px 0px;/*calc(100% - 20px) 0px; */
    background-repeat: no-repeat no-repeat;
}

.hero-image-holder-left {
    width:60%;
}

/** Block rows **/
.block-row {
    clear:both;
    width:auto;
    height:auto;
}

.block-holder {
    float:left;
}

.block-holder.one-third-width {
    width:33.33333333333333333333333333333%;
}

.block-holder.one-third-width.a {
    clear:both;
    padding:20px 10px 0px 20px;
}

.block-holder.one-third-width.b {
    padding:20px 10px 0px 10px;
}

.block-holder.one-third-width.c {
    padding:20px 20px 0px 10px;
}

/**** note: so far only used on GS products page ***/
.block-holder.quarter-width {
    width:25%; 
}

.block-holder.quarter-width .block {
    min-height:300px;
    max-height:300px;
}

.block-holder.quarter-width.a {
    clear:both;
    padding:20px 10px 0px 20px;
}

.block-holder.quarter-width.b {
    padding:20px 10px 0px 10px;
}

.block-holder.quarter-width.c {
    padding:20px 10px 0px 10px;
}

.block-holder.quarter-width.d {
    padding:20px 20px 0px 10px;
}

/**** note: so far only used on GS products page ***/
.block-holder.fifth-width {
    width:20%;
}

.block-holder.fifth-width .block {

}

.block-holder.fifth-width.a {
    clear:both;
    padding:20px 10px 0px 20px;
}

.block-holder.fifth-width.b, .block-holder.fifth-width.c, .block-holder.fifth-width.d  {
    padding:20px 10px 0px 10px;
}

.block-holder.fifth-width.e {
    padding:20px 20px 0px 10px;
}

.block-holder.half-width {
    width:50%;
}

.block-holder.half-width.a {
    clear:both;
    padding:20px 10px 0px 0px;
}

.block-holder.half-width.b {
    padding:20px 0px 0px 10px;
}

.block-holder.forty-percent {
    width:40%;
}

.block-holder.sixty-percent {
    width:60%;
}

.block-holder.forty-percent.a {
    clear:both;
}

.block-holder.sixty-percent.a {
    clear:both;
}

.block-holder.full-width {
    width:100%;
    padding:20px 0px;
}

.block-holder.thirty-five-percent-centered {
    width: 35%;
    margin-top: 20px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 20px;
}

.block-holder.thirty-five-percent-centered.a {
    margin:0 0 0 15%;
    padding:0 10px 0 0;
}

.block-holder.thirty-five-percent-centered.b {
    margin:0 15% 0 0;
    padding:0 0 0 10px;
}

.block-holder.sixteen-twenty-eightx3.a {
    width:16%;
}

.block-holder.sixteen-twenty-eightx3.b, 
.block-holder.sixteen-twenty-eightx3.c, 
.block-holder.sixteen-twenty-eightx3.d {
    width:28%;
}

.block-holder.sixteen-twenty-eightx3.b {
    padding:0 10px;
}

.block-holder.sixteen-twenty-eightx3.c {
    padding:0 10px;
}

.block-holder.sixteen-twenty-eightx3.d {
    padding:0 0px 0 10px;
}

.block-holder.ten-thirtyx3.a {
    width:10%;
}

.block-holder.ten-thirtyx3.b, 
.block-holder.ten-thirtyx3.c, 
.block-holder.ten-thirtyx3.d {
    width:30%;
}

.block-holder.ten-thirtyx3.b, .block-holder.ten-thirtyx3.c, .block-holder.ten-thirtyx3.d {
    padding:20px 20px 20px 0;
}

.block-holder .block.rounded {
    border-radius:20px;
}

.block-holder .block.border {
    border:1px solid #666;
}

.block-holder.one-third-width .block, .block-holder.ten-thirtyx3 .block {
    display:flex;
    flex-direction: column;
    height:auto;
    min-height:350px;
    padding:15px; /* this is the text padding */
}

.block-holder.ten-thirtyx3 .block {
    min-height:400px;
}

.block-holder.one-third-width .block.large {
    min-height:470px;
}

.block-holder.one-third-width .block.small {
    min-height:270px;
    max-height:270px;
}

.block-holder.one-third-width .block.tiny {
    min-height:170px;
    max-height:170px;
}

.block-holder.one-third-width .block.auto {
    height: auto;
    min-height:auto;
    max-height:auto;
}

/* use when we want the block height to match the content */
.block-holder.one-third-width .block.minHeightAuto {
    min-height:initial;
}

.block {
    height:auto;
    padding:25px; /* this is the text padding for a full width block */
}

.block .textBody {
    margin: 5px 0;
    text-align:left;
}

.block .arrowLink {
    margin-top: auto;
    align-self:flex-end; /* this right aligns the object */
}

.block .testimonial .quote {
    font-size: 20px;
    line-height: 30px;
    font-weight: 400;
    font-style: italic;
}

.block .testimonial .person {
    margin-top: 10px;
    font-size:20px;
    color:#999;
}

/*** Stuff we define in the JSON layout under "classes" - quickly styles blocks for layout tweaks ***/
.block.rounded {
    border-radius: 20px;
}

.block.paddingTopZero {
    padding-top:0;
}

.block.justifySpaceBetween {
    justify-content: space-between;
}

.block.zeroPadding {
    padding:0;
}

.block.hoverAnimate {
   /* -webkit-animation: scaleBlockDown 1s;
    -moz-animation: scaleBlockDown 1s;
    animation: scaleBlockDown 1s;*/
}

.block.hoverAnimate:hover {
    /* see: https://stackoverflow.com/questions/14677490/blurry-text-after-using-css-transform-scale-in-chrome */
    backface-visibility: hidden;
    transform: translateZ(0);
    /*-webkit-font-smoothing: subpixel-antialiased;*/
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    animation-delay: 0.25s;
    -webkit-animation: scaleBlockUp 0.5s;
    -moz-animation: scaleBlockUp 0.5s;
    animation: scaleBlockUp 0.5s;
    animation-fill-mode: forwards;  
}

.block img {
    max-width:100%;
}

.block-container {
    display: block;
    overflow: auto;
    height:auto;
    clear:both;
    position: relative;
    margin:0 auto;
    max-width:1280px;
}

.row-flex-centered {
    display:flex;
    align-items:center;
}

/* this is important for block containers where there is no content but the height causes a mini scroller */
.fillOverflow:after {
    opacity:0;
    content:".";
}

.full-bleed-promo-container {
    clear:both;
    position: relative;
    width:100%;
    margin:0 auto;
    background-color: #fff;
}

.full-bleed-promo-container .outer {
    position: relative;
}

.full-bleed-promo-container .outer img {
    width:75%;
}

.full-bleed-promo-container .inner {
    position:absolute;
    font-size: 22px;
    top: 57%;
    left: 57.5%;
    transform: translate(-57.5%, 0%);
}

.textAlignCenter {
    text-align:center;
}

/***** arrow links ******/
.arrowLink {
   font-size: 18px;
   height:30px;
   line-height:30px;
}

.arrowLink a {
    padding:10px 0;
    text-decoration:none;
    color:#ea5741;
}

.arrowLink .chevron {
    width:20px;
    height:30px;
    background: url(/images/icons/icon-arrow.png) right center no-repeat;
    background-size: 15px 15px;
}

.arrowLink .cta div {
    float:left;
}

.arrowLink .cta {
    align-self: flex-start;
}


/**** product icons ****/

/** in header revealed navigation **/
header nav .revealed .item.revealedNavigation.ghostscript {
    padding:15px 50px;
    background: url(../images/logos/ghostscript.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.mupdf {
    padding:15px 50px;
    background: url(/images/logos/muPDF.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.smartoffice {
    padding:15px 50px;
    background: url(/images/logos/smart-office.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.pdf_co {
    padding:15px 50px;
    background: url(/images/logos/pdf-co-logo-small.png) 5px center no-repeat;
    background-size: 30px 30px;
}

header nav .revealed .item.revealedNavigation.pymupdf {
    padding:15px 50px;
    background: url(/images/logos/py-mupdf-logo-small.png) 10px center no-repeat;
    background-size: 30px 30px;
}

header nav .revealed .item.revealedNavigation.pymupdf-pro {
    padding:15px 50px;
    background: url(/images/logos/py-mupdf-pro-logo-small.png) 10px center no-repeat;
    background-size: 30px 30px;
}

header nav .revealed .item.revealedNavigation.appkit {
    padding:15px 50px;
    background: url(/images/logos/appkit-logo-small.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.scanskew {
    padding:15px 50px;
    background: url(/images/logos/scan-skew.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.mujs {
    padding:15px 50px;
    background: url(/images/logos/muJS.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.jbig2dec {
    padding:15px 50px;
    background: url(/images/logos/jbig2dec.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.aspen {
    padding:15px 50px;
    background: url(/images/logos/aspen.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.llm {
    padding:15px 50px;
    background: url(/images/icons/icon-llm.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.mobile {
    padding:15px 50px;
    background: url(/images/icons/icon-mobile.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.pdf {
    padding:15px 50px;
    background: url(/images/icons/icon-pdf-toolkit.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.cloud {
    padding:15px 50px;
    background: url(/images/icons/icon-cloud.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.saas {
    padding:15px 50px;
    background: url(/images/icons/icon-saas.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.docmanagement {
    padding:15px 50px;
    background: url(/images/icons/icon-document-management.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.docrendering {
    padding:15px 50px;
    background: url(/images/icons/icon-document-rendering.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.rip {
    padding:15px 50px;
    background: url(/images/icons/icon-rip.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.printer {
    padding:15px 50px;
    background: url(/images/icons/icon-printers.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.open-source {
    padding:15px 50px;
    background: url(/images/icons/icon-open-source.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.commercial {
    padding:15px 50px;
    background: url(/images/icons/icon-commercial-license.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.leadership-team {
    padding:15px 50px;
    background: url(/images/icons/icon-leadership-team.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.news {
    padding:15px 50px;
    background: url(/images/icons/icon-news.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.blog {
    padding:15px 50px;
    background: url(/images/icons/icon-blog.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.events {
    padding:15px 50px;
    background: url(/images/icons/icon-events.png) 5px center no-repeat;
    background-size: 40px 40px;
}

header nav .revealed .item.revealedNavigation.legal {
    padding:15px 50px;
    background: url(/images/icons/icon-legal.png) 5px center no-repeat;
    background-size: 40px 40px;
}


/** in panels **/
.product.icon {
    margin-top:5px;
}

.product.icon.ghostscript {
    width:100%;
    height:130px;
    background: url(/images/logos/ghostscript-plus-text.png) center top no-repeat;
    background-size: auto 130px;
}

.product.icon.ghostscript.trimmed {
    width:100%;
    height:200px;
    background: url(/images/logos/ghostscript-plus-text-trimmed.png) center top no-repeat;
    background-size: contain;
}

.product.icon.mupdf {
    width:100%;
    height:130px;
    background: url(/images/logos/muPDF-plus-text.png) center top no-repeat;
    background-size: auto 130px;
}

.product.icon.pymupdf {
    width:100%;
    height:130px;
    background: url(/images/logos/py-mupdf-full-logo-with-text.png) center top no-repeat;
    background-size: auto 130px;
}

.product.icon.pymupdf-pro {
    width:100%;
    height:130px;
    background: url(/images/logos/py-mupdf-pro-full-logo-with-text.png) center top no-repeat;
    background-size: auto 130px;
}

.product.icon.appkit {
    width:100%;
    height:130px;
    background: url(/images/logos/appkit-full-logo-with-text.png) center top no-repeat;
    background-size: auto 130px;
}

.product.icon.mupdf.trimmed {
    width:100%;
    height:200px;
    background: url(/images/logos/muPDF-plus-text-trimmed.png) center top no-repeat;
    background-size:contain;
}

.product.icon.smartoffice {
    width:100%;
    height:130px;
    background: url(/images/logos/smart-office-plus-text.png) center top no-repeat;
    background-size: auto 130px;
}

.product.icon.smartoffice.trimmed {
    width:100%;
    height:200px;
    background: url(/images/logos/smart-office-plus-text-trimmed.png) center top no-repeat;
    background-size: contain;
}

.product.icon.scanskew {
    width:100%;
    height:120px;
    background: url(/images/logos/scan-skew-plus-text.png) center top no-repeat;
    background-size: auto 120px;
}

.product.icon.mujs {
    width:100%;
    height:120px;
    background: url(/images/logos/muJS-plus-text.png) center top no-repeat;
    background-size: auto 120px;
}

.product.icon.cobaltprint {
    width:100%;
    height:120px;
    background: url(/images/logos/cobalt-print.png) center top no-repeat;
    background-size: auto 120px;
}

.product.icon.jbig2dec {
    width:100%;
    height:120px;
    background: url(/images/logos/jbig2dec-plus-text.png) center top no-repeat;
    background-size: auto 120px;
}

.product.icon.aspen {
    width:100%;
    height:120px;
    background: url(/images/logos/aspen-plus-text.png) center top no-repeat;
    background-size: auto 120px;
}

.product.icon.pdf_co {
    width:100%;
    height:130px;
    background: url(/images/logos/pdf-co-logo.png) center top no-repeat;
    background-size: auto 130px;
}

.product.icon.placeholder {
    width:100%;
    height:130px;
    background: url(/images/icons/icon-placeholder.png) center top no-repeat;
    background-size: auto 130px;
}


/*** Homepage ***/
#partners {
    display: block;
}

#partners .partners-wrap {
    display:block;
    width:100%;
    height:120px;
    margin:0;
    overflow:hidden;
}

#partners .partners-wrap ul {
    display: block;
    list-style: none;
    position: relative;
    margin-left: auto;
    margin-right: auto;
}

#partners .partners-wrap ul li {
    display: block;
    float: left;
    position: relative;
    width: 200px;
    height: 100px;
}

#partners-list .logo {
    margin:0 20px;
}

#partners-list .logo.dropbox {
    background: url(/images/logos/partners/dropbox.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.adobe {
    background: url(/images/logos/partners/adobe.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.google {
    background: url(/images/logos/partners/google.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.blackberry {
    background: url(/images/logos/partners/blackberry.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.hp {
    background: url(/images/logos/partners/hp.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.hypori {
    background: url(/images/logos/partners/hypori.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.active-pdf {
    background: url(/images/logos/partners/active-pdf.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.brother {
    background: url(/images/logos/partners/brother.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.docusign {
    background: url(/images/logos/partners/docusign.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.everlaw {
    background: url(/images/logos/partners/everlaw.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.garmin {
    background: url(/images/logos/partners/garmin.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.gerber {
    background: url(/images/logos/partners/gerber.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.intuit {
    background: url(/images/logos/partners/intuit.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.kahua {
    background: url(/images/logos/partners/kahua.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.konica-minolta {
    background: url(/images/logos/partners/konica-minolta.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.kyocera {
    background: url(/images/logos/partners/kyocera.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.nasdaq {
    background: url(/images/logos/partners/nasdaq.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.notion {
    background: url(/images/logos/partners/notion.jpg) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.oce {
    background: url(/images/logos/partners/oce.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.oracle {
    background: url(/images/logos/partners/oracle.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.ricoh {
    background: url(/images/logos/partners/ricoh.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.siemens {
    background: url(/images/logos/partners/siemens.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.togal-ai {
    background: url(/images/logos/partners/togal-ai.png) center center no-repeat;
    background-size: contain;
}

#partners-list .logo.turnitin {
    background: url(/images/logos/partners/turnitin.png) center center no-repeat;
    background-size: contain;
}

/**** tables ****/
.table.sixCols {
    background-color: #fff;
    font-size:14px;
}

.table.sixCols .row {
    clear:both;
    width:100%;
    font-weight:600;
}

.table.sixCols .row.header .blank {
    background-color: transparent;/*#f6f7f9;*/
}

.table.sixCols .row.header div {
    height:60px;
}

.table.sixCols .row div{
    float:left;
    width:18.75%;
    height:22px;/*45px;*/
    line-height:13px;/*32px;*/
    padding:5px;
    text-align:center;
    border-bottom:0.5px solid #dedfe0;
    color:#9fb4c9;
}

.table.sixCols .row.regular.last div {
    border-bottom: 0;
}

.table.sixCols .row div:nth-of-type(1) {
    text-align:left;
    width:25%;
    background-color: #fff;
    color:#333;
}

.table.sixCols .row.regular div:nth-of-type(2) {
    background-color: #e8f5ff;
    color:#0075cf;
}

.table.sixCols .row.splitter div {
    background-color: #d1dae3;
    width:100%;
}

.table.sixCols .row .cell.value.yes {
    background: transparent url(/images/products/comparison-table/tick-grey.png) center center no-repeat;
    background-size: contain;
}

.table.sixCols .row .cell.value.yes.gs {
    background: transparent url(/images/products/comparison-table/tick-blue.png) center center no-repeat;
    background-size: contain;
}

.table .icon-ghostscript {
    background: #0075cf url(/images/products/comparison-table/ghostscript-white.png) center center no-repeat;
    background-size: contain;
}

.table .icon-adobe {
    background: transparent url(/images/products/comparison-table/adobe.png) center 80% no-repeat;
    background-size: contain;
}

.table .icon-harlequin {
    background: transparent url(/images/products/comparison-table/harlequin.png) center 80% no-repeat;
    background-size: contain;
}

.table .icon-jawsrip {
    background: transparent url(/images/products/comparison-table/jawsrip.png) center 80% no-repeat;
    background-size: contain;
}

.table .icon-qualcomm {
    background: transparent url(/images/products/comparison-table/qualcomm.png) center 80% no-repeat;
    background-size: contain;
}

/*** License Table ***/
.licenseTable .col {
    float:left;
    padding:15px 30px 15px 0;
}

.licenseTable .col.a {
    clear:both;
    width:15%;
}

.licenseTable .col.b {
    width:25%;
}

.licenseTable .col.c {
    width:20%;
}

.licenseTable .col.d {
    width:20%;
}

.licenseTable .col.e {
    width:20%;
}

/*** licensing ***/
.youTubeContainer {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.22%;
}

.video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* required due to pixel render glitches in the youtube iframe */
    background-color:#666;
    padding:1px;
}


/** legal **/
.policyTimestamp {
    font-size:16px;
    text-transform: uppercase;
}



/**** blog *****/
#blog, .blogLike {
    width:calc(100% - 40px);
    margin:20px auto 0;
}

.frontPageNewsBlogOrItem {

}

.frontPageNewsBlogOrItem .block-holder {

}

#front-page-news .blogLike, #front-page-blog .blogLike {
    margin:0px auto;
    min-height: 160px;
}

#front-page-news .blogLike div, #front-page-blog .blogLike div {
    margin:0px auto 0px;
}

#front-page-news .singleEntry .hero, #front-page-blog .singleEntry .hero {
    height:100px;
}

#front-page-news .singleEntry .hero img, #front-page-blog .singleEntry .hero img {
    height:inherit;
}

#blog .title, .blogLike .title {
    font-weight:600;
    font-size:22px;
    color:#77c11f;
}

#blog .author, .blogLike .author {
    font-size:16px;
    text-transform: uppercase;
    margin:5px 0 10px;
}

#blog .body, .blogLike .body {
    font-size:20px;
}

#blog .left img, .blogLike .left img {
    width:100%;
}

#blog .item, .blogLike .item {
    width:100%;
    clear:both;
    position:relative;
}

#blog a, .blogLike a {
    color:#ea5741;
    text-decoration: none;
}

#blog a:hover, .blogLike a:hover {
    text-decoration: underline;
}

#blog .item .left, .blogLike .item .left {
    float:left;
    width:10%;
    height:auto;
    margin:0 0 30px 0;
}

#blog .item .right, .blogLike .item .right {
    float:left;
    width:calc(90% - 20px);
    margin:0 0 30px 20px;
}

#blog .item .right .body, .blogLike .item .right .body {
    margin:10px 0 0 0;
}

#blog .singleEntry, .blogLike .singleEntry {
    display:block;
    clear:both;
}

#blog .singleEntry .hero, .blogLike .singleEntry .hero{
    width:20%;
    height:auto;
    float:left;
}

#blog .singleEntry .hero img, .blogLike .singleEntry .hero img{
    width:90%;
    margin:0 auto;
    object-fit:contain;
}

#blog .singleEntry .body, .blogLike .singleEntry .body {
    display:block;
    width:80%;
    float:left;
    margin-bottom:20px;
}

#blog .singleEntry .body p, .blogLike .singleEntry .body p {
    margin-top:0;
}

/*** SECURITY ADVISORIES ***/
/*** used in security advisories ***/
.blogLike .verticalList .child .date {
    color:#333;
    font-weight:600;
    font-size:24px;
    margin-bottom: 20px;
}

.blogLike .verticalList .child .entry {
    margin-bottom: 10px;
}

.blogLike .verticalList .child .title {
    color:#333;
}

.blogLike .verticalList .child p {
    margin-top: 10px;
    margin-bottom: 10px;
}
/*** end security advisories ***/

.product-icon.imageHolder {
    width:37.5%;
    float:right;
    margin:50px 20% 0 0;
}

.product-icon.description {
    width:82%;
    margin-top:0px;
    height:300px;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.imageHolder img {
    height: auto; /* Make sure images are scaled correctly. */
    width: 100%; /* Adhere to container width. */
    display:block;
}

.imageHolder.half-width img {
    margin:0 25%;
    height: auto; /* Make sure images are scaled correctly. */
    width: 50%; /* Adhere to container width. */
    display:block;
}

.imageHolder.smart-office-sdk {
    min-width:200px;
    width:200px;
    margin-right:60px;
}

.blog-footer {
    clear:both;
    height:120px;
}

.features-navg-container {
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    justify-content:space-around;
    width:100%;
    background:#f9f9f9;
}

.navg-icon-holder {
    display: inline-block;
}

.navg-icon-holder .title {
    width:100%;
    font-size:14px;
    text-align:center;
    margin-bottom:10px;
}


/*** Company ***/



/**
 * Map stuff
 */
#map {
    margin-top:150px;
    position:relative;
    width:100%;
}

#map .mapHolder {
    width:100%;
}

#map .mapHolder img {
    width:100%;
}

#map .mapHolder .pin {
    position:absolute;
    width:2.28%;
    height:5%;
    background:transparent url(/images/map/icon-map-pin.png) center center no-repeat;
    background-size:contain;
}

#map .mapHolder .pin.hq {
    position:absolute;
    width:10%;
    height:5%;
    background:transparent url(/images/map/icon-map-pin-hq.png) center center no-repeat;
    background-size:contain;
}

#map .mapHolder .mapPanel {
    display:none;
    position:absolute;
    width:auto;
    height:30px;
    line-height:30px;
    text-align:center;
    color:#fff;
    z-index:100;
}

#map .mapHolder .mapPanel .regionText {
    font-weight: bold;
}

#map .mapHolder .mapPanel .left {
    float:left;
    width:9px;
    height:inherit;
    background:transparent url(/images/map/panel/blue/map-panel-left.png) 0 0 no-repeat;
    background-size:9px 100%;
}

#map .mapHolder .mapPanel .middle {
    float:left;
    width:auto;
    padding:0 10px;
    height:inherit;
    background:transparent url(/images/map/panel/blue/map-panel-middle.png) 0 0 repeat-x;
    background-size:1px 100%;
}

#map .mapHolder .mapPanel .right {
    float:left;
    width:5px;
    height:inherit;
    background:transparent url(/images/map/panel/blue/map-panel-right.png) 0 0 no-repeat;
    background-size:5px 100%;
}

#map .mapHolder .mapPanel.onLeft .left {
    width:5px;
    background:transparent url(/images/map/panel/blue/map-panel-left-alt.png) 0 0 no-repeat;
    background-size:5px 100%;
}

#map .mapHolder .mapPanel.onLeft .right {
    width:9px;
    background:transparent url(/images/map/panel/blue/map-panel-right-alt.png) 0 0 no-repeat;
    background-size:9px 100%;
}

/** Developer portal **/
.portal-panel-image {
    width:220px;
    margin:0 auto 0px;
}

.portal-panel-image img {
    margin-bottom:20px;
}

.portal-panel-text {
    margin:0 auto;
}

@-webkit-keyframes scaleBlockUp {
    100% {
        -webkit-transform: scale(1.02);
    }
}

@keyframes scaleBlockUp {
    100% {
        transform: scale(1.02);
    }
}

@-webkit-keyframes scaleBlockDown {
    0% {
        -webkit-transform: scale(1.02);
    }

    100% {
        -webkit-transform: scale(1.0);
    }
}

@keyframes scaleBlockDown {
    0% {
        -webkit-transform: scale(1.02);
    }

    100% {
        transform: scale(1.0);
    }
}

.contact.form .panel {
    background: white;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
    border: 1px #333 solid;
    border-radius: 5px;
    margin-bottom: 20px;
    background: url(../images/icons/icon-arrow.png) 97% center no-repeat;
    background-size: 15px 15px;
}

.contact.form .panel h2 {
    font-size: 24px;

}

.contact.form .panel .text {
    width: 77%;
}

.contact.form .panel .text .desc {
    margin: 10px 0 0 0px;
    padding-right: 10px;
}

/* <= 3000 */
@media all and (max-width : 3000px)  {

}

/* <= 1400 */
@media all and (max-width : 1400px)  {
    /*header nav.logo {
        margin-top:24px;
        width:200px;
        height:36px;
        background:url(/images/header/artifex-logo.png) 20px 0 no-repeat;
        background-size: 172px 27px;
    }*/
}

/* <= 1200  */
@media all and (max-width : 1200px)  {

    header .left {

    }

    header .right {
        margin:0 10px 0 0;
    }

    header .left nav {
        display:block;
        height:70px;
        line-height:50px;
        width:75px;/*calc(15% - 20px);*/
        float:left;
    }
    
    /*footer .right {
        background: url(/images/header/artifex-logo.png) 0px 0 no-repeat;
        background-size: 172px 27px;
    }*/

    footer .social {
        width:172px;
    }

    .hero .container h1 {
        font-size:40px;
        line-height:50px;
    }

    .hero .container h2 {
        font-size:22px;
        line-height:28px;
        margin:20px 0 40px;
    }

    /**** 1/4 width ****/
    /**** note: so far only used on GS products page ***/
    .block-holder.quarter-width {
        width:50%;
    }


    .block-holder.quarter-width .block {
        min-height:250px;
        max-height:250px;
    }

    .block-holder.quarter-width.a {
        clear:both;
        padding:20px 10px 0px 20px;
    }

    .block-holder.quarter-width.b {
        padding:20px 20px 0px 10px;
    }

    .block-holder.quarter-width.c {
        padding:20px 10px 0px 20px;
    }

    .block-holder.quarter-width.d {
        padding:20px 20px 0px 10px;
    }

	/**** note: so far only used on GS products page ***/
    .block-holder.fifth-width {
        width:50%;
    }

    .block-holder.fifth-width .block {
        min-height:250px;
        max-height:250px;
    }

    .block-holder.fifth-width.a {
        clear:both;
        padding:20px 10px 0px 20px;
    }

    .block-holder.fifth-width.b, {
        padding:20px 20px 0px 10px;
    }

    .block-holder.fifth-width.c {
        padding:20px 10px 0px 20px;
    }

    .block-holder.fifth-width.d {
        padding:20px 20px 0px 10px;
    }

    .block-holder.fifth-width.e {
        padding:20px 10px 0px 20px;
    }


}

@media all and (max-width : 1100px)  {

    button.item.navigation.pdf-co, button.item.navigation.solution-explorer, button.item.navigation.contact {
        font-size: 11px;
    }

}

/*** At this breakpoint we show the burger menu ***/
/* < Tablet landscape */
@media all and (max-width : 1023px)  {

    header .mobile-nav {
        display:flex;
    }

    header .desktop-nav {
        display:none;
    }

    header .burger-icon {
        visibility: visible;
        cursor:pointer;
    }

    footer .container {
        padding:60px 0 20px;
        height:inherit;
        min-height: inherit;
        display:flex;
        flex-direction:column;
    }

    footer .left {
        width:100%;
        height:inherit;
        display:flex;
        flex-direction:column;
        align-self:center;
        align-items:stretch;
    }

    footer .middle {
        width:100%;
        height:inherit;
        display:flex;
        flex-direction:column;
        justify-content:center
    }

    footer .right {
        width:90%;
        /*background: transparent url(/images/header/artifex-logo-by-lode.png) 0px 0 no-repeat;
        background-size: 165px 60px;*/
        margin:0 auto 20px;
    }

    footer .social {
        width:230px;
    }

    footer .left .inner {
        width:90%;
        margin:0 auto 20px;
    }

    footer .middle .inner {
        width:90%;
        margin:0 auto 20px;
    }

    footer .middle .inner .folder div {
        /*text-align: center;*/
    }

    .full-bleed-promo-container {
        min-height: 160px;
    }

    .full-bleed-promo-container .outer img {
        width:100%;
    }

    .full-bleed-promo-container .inner {
        font-size: 18px;
        left:70%;
        width:45%;
    }

    .product-icon.imageHolder {
        width:30%;
        float:none;
        margin:0 auto;
    }

    .product-icon.description {
        width:100%;
        margin:0px;
        height:auto;
        display:block;
    }

    /**** one third width ****/
    .block-holder.one-third-width {
        width:50%;
    }

    .block-holder.one-third-width.a {
        clear:none;
    }

    .block-holder.one-third-width.b {
        clear:none;
    }

    .block-holder.one-third-width.c {
        clear:none;
    }

    /* modulo every 1st */
    .block-holder.one-third-width:nth-child(1n+0) {
        padding:20px 10px 0px 20px;
    }

    /* modulo every 2nd */
    .block-holder.one-third-width:nth-child(2n+0) {
        padding:20px 20px 0px 10px;
    }

    /***** half width ****/

    .block-holder.half-width {
        width:100%;
    }

    .block-holder.forty-percent, .block-holder.sixty-percent {
        width:100%;
    }

	.block-row.mobile-flex-reverse {
        display:flex;
        flex-direction:column-reverse;
    }

    .row-flex-centered {
        display:block;
    }

    .block-holder.half-width.a {
        padding:20px 20px 0;
    }

    .block-holder.half-width.b {
        padding:0px 20px 0px;
    }

    #map {
        margin-top:0px;
    }

    h2.spacer {
        display: none;
    }

    .block {
        padding:0 auto;
    }

    .block-holder.ten-thirtyx3.a {
        width:50%;
        padding:20px;
    }

    .block-holder.ten-thirtyx3.b, 
    .block-holder.ten-thirtyx3.c, 
    .block-holder.ten-thirtyx3.d {
        width:50%;
        padding:20px;
    }

    .imageHolder.half-width img {
        margin:0 0%;
        width: 100%; 
    }

  

}


/* < Tablet portrait */
/* NOTE: At this size we don't show hero images */
@media all and (max-width : 767px)  {


    .hero .container .bg {
        display:none;
    }

    .hero .container .left .flex-container, .hero .container.small .left .flex-container {
        height:auto;
    }

    .hero-image-holder-left {
        width:80%;
        margin:0 auto;
    }

    .hero .container, .hero .container.small {
        height:auto;
        padding:20px 0;
    }

    .hero .container h1 {
        width:calc(100% - 20px);
    }

    .hero .container h2 {
        width:calc(100% - 20px);
    }

    .product-icon.imageHolder {
        width:50%;
        float:none;
        margin:0 auto;
    }

    .block-holder.thirty-five-percent-centered {
        width:100%;
    }

    .block-holder.thirty-five-percent-centered.a, .block-holder.thirty-five-percent-centered.b {
        margin:0 auto;
        padding:10px 20px 20px 20px;
    }

    .full-bleed-promo-container .inner {
        font-size: 16px;
        left:70%;
        width:60%;
    }

    .block-holder.ten-thirtyx3.a {
        width:100px;
        height:100px;
        padding:0px;
        margin:0px 0px 10px 20px;
    }

    .block-holder.ten-thirtyx3.b, 
    .block-holder.ten-thirtyx3.c, 
    .block-holder.ten-thirtyx3.d {
        clear:both;
        width:100%;
        padding:20px;
    }

    .block-holder.ten-thirtyx3.a .hideOnMobile {
        display:none;
        width:0px;
        height:0px;
    }

    .features-navg-container {
        justify-content:flex-start;
    }

    .imageHolder.smart-office-sdk {
        min-width:100px;
        width:100px;
        margin-right:30px;
    }

    .inline-holder {
        display:flex;
        flex-direction:column;
        align-items:center;
    }

    .inline-holder button.inline.b {
        margin:20px 0px 0px 0px;
    }
}

/* <= Phones */
@media all and (max-width : 640px)  {

   /* header nav.logo {
        margin-top:28px;
        width:230px;
        height:36px;
        background: url(/images/header/artifex-logo.png) 20px 0 no-repeat;
        background-size: 172px 27px;
    }*/

	/**** quarter width ****/
    .block-holder.quarter-width {
        width:100%;
    }

    /* modulo every 1st */
    .block-holder.quarter-width:nth-child(1n+0) {
        padding:20px 20px 0px;
    }

    /* modulo every 2nd */
    .block-holder.quarter-width:nth-child(2n+0) {
        padding:20px 20px 0px;
    }

    /**** one third width ****/
    .block-holder.one-third-width {
        width:100%;
    }

    /* modulo every 1st */
    .block-holder.one-third-width:nth-child(1n+0) {
        padding:20px 20px 0px;
    }

    /* modulo every 2nd */
    .block-holder.one-third-width:nth-child(2n+0) {
        padding:20px 20px 0px;
    }

    .block .partners {
        flex-direction:column;
    } 

    .partners .logo {
        width:70%;
        margin:20px;
    }

    .full-bleed-promo-container .inner {
        font-size: 12px;
    }

    .button-holder {
        display:flex;
        align-items:center;
        flex-direction:column;
    }

    button.cta.orange.largeFixedWidth {
        width:100%;
        min-width:100%;
        max-width:100%;
    }

    
    
}

@media all and (max-width : 550px)  {

    .hero .container .left {
        padding-top:30px;
    }
}

/* <= Small Phones portrait */
@media all and (max-width : 320px)  {

}


/** important that this is at the end so it definitely registers last and overrides previous paddings **/
.block-holder.one-third-width:last-child {
    padding-bottom:20px;
}

.block-container.sticky {
    position:-webkit-sticky; /* Safari */
    position:sticky;
    top:60px;
    z-index:1000;
}

.block-container.stretch {
    max-width:100%;
    min-width:100%;
    width:100%;
}