/*
Theme Name: Blankslate Child
Theme URL: https://appscard.com
Description: Blankslate Child Theme
Author: Appscard
Author URL: https://appscard.com
Template: blankslate 
Version: 1.0.0
Text Domain: blankslate-child
Custom CSS goes after this line 
*/


/* ==========================================================================
UTILITY CLASSES
========================================================================== */


/* Debug/Help styles *
div { border: 1px solid red; }
a { border: 1px solid blue; }
section { border: 1px solid green; }
ul { border: 1px solid orange; }
ol { border: 1px solid orange; }
li { border: 1px solid gray; }
main { border: 1px solid green; }
h1, h2, h3, h4 { border: 1px solid pink; }
p { border: 1px solid lightblue; }


/* Hide elements */
body.archive aside#sidebar,
.page-template-Landingpage-template aside#sidebar,
.widget-title, 
.hide,
.inlineFooter,
#site-description, 
.bottom,
br,
a.hide, 
#search, 
.home header.header, 
.home #breadcrumbs,
#abovemain,
.expandbtn,
.faq-container,
.tab-container,
footer.entry-footer,
footer.footer{
display: none;
}


/* ==========================================================================
CSS VARIABLES
========================================================================== */

:root {
/* Colors */
--white: #fff;
--black: #000;
--gray: #555;
--darkgray: #333;
--lightgray: #888;
--lightergray: #ccc;
--brightgray: #eee;
--brightergray: #f5f5f5;
--beige: beige;
--green: green;
--lightgreen: #00b300;
--red: #cc0000;
--lightred: #ff4d4d;
--darkred: #990000;
--blue: blue;
--gold: goldenrod;
--purple: purple;
--link: #888;  
--linkhover: #333;  
--bgdark: #384c4b /*#292e33*/;
--bggreen:#334345;

/* Typography - Screen */
--screenh1: 60px;
--screenh2: 32px;
--screenh3: 24px;
--screenh4: 20px;
--screenh5: 15px;
--screenText: 15px;

/* Typography - Tablet */
--padh1: 34px;
--padh2: 24px;
--padh3: 20px;
--padh4: 18px;
--padh5: 15px;
--padText: 14px;

/* Typography - Phone */
--phoneh1: 28px;
--phoneh2: 22px;
--phoneh3: 18px;
--phoneh4: 16px;
--phoneh5: 14px;
--phoneText: 14px;
}


/* ==========================================================================
BASE STYLES / RESETS
========================================================================== */

/* Reset vertical alignment */
a, abbr, acronym, address, applet, big, blockquote, body, caption, cite, code, dd, del, dfn, div, dl, dt, em, fieldset, font, form, h1, h2, h3, h4, h5, h6, html, iframe, ins, kbd, label, legend, li, object, ol, p, pre, q, s, samp, small, span, strike, strong, sub, sup, table, tbody, td, tfoot, th, thead, tr, tt, ul, var {
vertical-align: top;
}

/* Base typography */
body {
position: relative;
font-family: "Roboto", sans-serif;
font-optical-sizing: auto;
font-style: normal;
font-weight: 300;
font-size: 1em;
line-height: 1.6em;
text-align: center;
color: var(--black);
}

/* Headings */
h2, h3, h4, h5, h6 {
font-family: "Roboto Condensed", sans-serif;
font-weight: 300;
line-height: normal;
padding: 20px 0 10px;
color:var(--bgdark);
}

h1 {
font-family: "Roboto Condensed", sans-serif;
/*font-weight: 200;*/
line-height: normal;
padding: 20px 0 10px;
color:var(--bgdark);
}

h1 { font-size: var(--screenh1); }
h2 { font-size: var(--screenh2); }
h3 { font-size: var(--screenh3); }
h4 { font-size: var(--screenh4); }

/* Paragraphs */
p {
font-size: var(--screenText);
padding: 10px 0px 15px 0px;
}

/* Links */
a {
color: var(--link);
font-weight: 400;
text-decoration: none;
position: relative;
}

a:hover {
color: var(--linkhover);
}

/* Text Links */
p a {
color: var(--red);
}

a.cta {
display: inline-block;
padding: 10px;
border: 1px solid var(--black);
}

/* Text formatting */
b, strong, .bold { font-weight: 600; }
em { font-style: italic; }

/* Media elements */
img, .wp-caption {
width: 100%;
height: auto;
}

iframe, video, embed, object {
width: 100%;
}

/* Table */
table {
    width: 100%;
}
td,
th {
  padding: 7px;
  border: 2px solid var(--brightgray);
}

/* Lists */
ul, ol {
padding: 10px 20px;
}

ul li { list-style: disc; }
ol li { list-style: decimal; }
ul li ol li { list-style: decimal; }
ol li ul li { list-style: disc; } 

.menu ul li,
#sidebar ul li {
list-style: none;
}

/* Block elements */
div { position: relative; }

hr {
width: 100%;
display: block;
height: 1px;
border: 0;
margin: 20px 0;
background: lightgray;
}

figure { margin: 40px 0; }

blockquote {
display: block;
margin: 30px 0px;
font-size: 2em;
line-height: 1.2em;
font-family: 'georgia', serif;
font-style: italic;
}

/* Alignment classes */
.aligncenter {
width: 100% !important;
margin: 0 auto !important;
}

.alignnone, 
.alignleft, 
.alignright {
width: 100% !important;
}

.aligncenter img,
.alignleft img, 
.alignright img,
.alignnone img {
width: 100% !important;
height: auto;
}

/* Custom elements */
preamble { display: block; }

.uppercase {
text-transform:uppercase;
}

/* ==========================================================================
LAYOUT COMPONENTS
========================================================================== */

/* Header */
header#header {
display: block;
position: fixed;
width: 100%;
top: 0;
z-index: 2;
background: white;
/* box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1); */
border-bottom: 0px solid var(--lightergray);
transition:0.2s;
}

header#header:hover {
border-bottom: 0px solid var(--gray);
}

header .headerContainer {
position: static;
display: inline-block;
width: 100%;
max-width: 1600px;
text-align: left;
padding: 0px 40px;
}

/* Logo */
header#header ul { 
  padding: 0 20px; 
}

#branding { 
  display: inline-block; 
  margin-top:15px;
  z-index:3;
}

a.logo img { 
  width: 180px; 
}

/* Navigation */

.navHeader #menu {
float: right;
}


.navHeader ul.menu,
.navHeader #menu,
.navHeader #menu .menu-main-menu-container,
.navHeader #menu .menu-main-menu-container ul.menu,
.navHeader #menu .menu-main-menu-container ul.menu li {
position:relative;
display: inline-block;
padding: 0;
}

/* Dropdown expand icon *
.navHeader #menu ul.menu li:has(li) a:after {
content: " +";
}

.navHeader #menu ul.menu li:has(li) ul li a:after  {
content: none!important;
}

.navHeader #menu ul.menu li:has(li) ul li:has(li) a:after {
content: " +";
}

.navHeader #menu ul.menu li:has(li) ul li:has(li) ul li a:after {
content: none!important;
}

/* NAV styling */
.navHeader #menu ul.menu li a {
display: block;
padding: 20px 10px;
}

.navHeader #menu ul.menu li ul li a {
display: block;
padding: 0px 0px;
color:var(--black);
}

.navHeader #menu ul.menu li ul li ul li a {
color:var(--link);
margin-top:0px;
}

.navHeader #menu ul.menu li ul li ul li a:hover {
color:var(--linkhover);
}

.navHeader #menu .navlinks,
.navHeader .sub-menu-wrapper,
/*.navHeader ul li ul li,*/
strong.contact-btn,
strong.search-btn {
display: none;
}

.navHeader #menu ul.menu li:hover .sub-menu-wrapper {
position:absolute;
display:inline-block;
width:350px;
padding:20px;
right:0px;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
background:var(--bgdark);
}

.navHeader #menu ul.menu li.company:hover .sub-menu-wrapper {
width:220px;
}

.navHeader #menu ul.menu li:hover .sub-menu-wrapper .sub-menu{
padding:0px;
}

.navHeader .sub-menu-wrapper .sub-menu-wrapper {
width:auto!important;
position:relative!important;
display: block;
padding:0px!important;
left:0px!important;
}

.navHeader #menu ul.menu li:hover .sub-menu-wrapper ul.submenu {
padding:0px;
}

.navHeader #menu ul.menu li:hover .sub-menu-wrapper ul li {
display:block;
}

.navHeader #menu ul.menu li:hover .sub-menu-wrapper a {
padding:5px 10px;
color:var(--white);
font-size: 14px;
}

.navHeader #menu ul.menu .sub-menu-wrapper a:hover {
text-decoration:underline;
}

.navHeader #menu ul.menu .sub-menu-wrapper li.nolink a {
padding:5px 0px;
color:var(--brightgray);
cursor:text;
}

.navHeader #menu ul.menu .sub-menu-wrapper li.nolink a:hover {
text-decoration:none;
}

.navHeader #menu ul.menu .sub-menu-wrapper li.nolink ul li a:hover {
text-decoration:underline;
}

.navHeader #menu ul.menu .sub-menu-wrapper li.nolink ul li a {
padding:5px 10px;
color:var(--white);
cursor:pointer;
}

/* Navbar CTA */
.navHeader .cta { float: right; }

/* Search */
.navHeader #search { float: right; }

.navHeader #search form {
padding: 6px;
border: 1px solid var(--lightgray);
font-size: 16px;
border-radius: 24px;
}

.navHeader #search input[type="search"] {
-webkit-appearance: none;
padding: 10px;
box-sizing: border-box;
border: none;
}

.navHeader #search input[type="search"]::-webkit-search-cancel-button {
-webkit-appearance: none;
}

.navHeader #search input[type="search"]::focus-visible {
border: none;
}

.navHeader #search input[type="submit"] {
-webkit-appearance: none;
color: transparent;
width: 34px;
height: 34px;
font-size: 0;
border: none;
border-radius: 14px;
cursor: pointer;
background: url(icon-search.png) center center no-repeat;
background-size: 20px;
}

/* Category Menu */

/*Hide until further notice */
.category-posts-navigation {
display:none;
}

#categories {
position:sticky;
top:0px;
z-index:1;
display: none;
width: auto;
padding: 0px 0px;
text-align: center;
border-bottom:1px solid var(--lightergray);
background:var(--white);
}

#categories:hover {
border-bottom:1px solid var(--lightgray);
}

#categories .category-posts-menu {
display: inline-block;
width: 100%;
max-width: 1600px;
padding: 0px 40px;
text-align: left;
}

#categories .category-posts-menu ul {
padding:0px;
}

#categories .category-posts-menu li {
display:inline-block;
list-style:none;
}

#categories .category-posts-menu ul li a {
display:block;
padding:10px 10px;
border-top:2px solid var(--white);
}

#categories .category-posts-menu ul li a:hover {
border-top:2px solid var(--lightgray);
}
#categories .category-posts-menu ul li.active a {
border-top:2px solid var(--lightgray);
}

#categories .category-header {
display:none;
}


/* Hide Breadcrumbs */
.page #categories,
#categories .breadcrumbs {
display: none;
}

/* Main content */
#container {
text-align: center;
padding: 0px 0;
}

/* set content and article display content width */
#content,
section.articles-section {
display: inline-block;
width: 100%;
max-width: 1600px;
padding: 20px 20px;
text-align:left;
}

#content article {
text-align: left;
padding: 0px 20px;
}

#content h2,
section.articles-section h2 {
margin: 10px 20px 0px 20px;
}

#content h4,
section.articles-section h4 {
margin: 10px 20px 10px 20px;
padding: 20px 0px;
}

/* Posts/pages */
#content article h3 {
 scroll-margin-top: 80px; 
}

#content article h2 {
margin: 10px 0px 0px 0px;
 scroll-margin-top: 80px; 
}

#content article h4 {
margin: 10px 0px 0px 0px;
}


#content h4 {
margin: 10px 20px 10px 20px;
padding: 20px 0px;
}

/* Footer */
footer#footer {
background: #ddd;
color:var(--brightgray);
padding: 20px 0px;
}

footer#footer a {
font-weight:300;
color:var(--linkhover);
}

footer#footer a:hover {
color:var(--red);
}

footer#footer .footerContainer {
display: inline-block;
width: 100%;
max-width: 1600px;
padding: 60px 40px;
text-align:left;
}

footer#footer .section-left,
footer#footer .section-center,
footer#footer .section-right{
display:inline-block;
}

footer#footer .section-left {
width:29%;
padding-right:5%;
margin-bottom:40px;
}

footer#footer .section-center{
width:39%;
padding-right:5%;
}

footer#footer .section-center a {
display:block;
margin: 20px 0px 0px 0px;
}

footer#footer .section-center h3 {
padding: 0px 0px 24px 0px;
margin:0px;
}

footer#footer .section-right{
width:31%;
padding-left:0%;
margin-bottom:60px;
}

footer#footer .section-right ul {
columns:2;
padding:0px;
margin:0px;
}

footer#footer .section-right ul li {
display: block;
list-style:none;
break-inside:avoid;
}

footer#footer .section-right ul li a {
float:none;
display:block;
padding:5px 0px;
}

footer#footer #copyright {
display: block;
width: 100%;
padding: 20px 0px 0px 0px;
text-align: left;
border-top:1px solid var(--gray);
color: var(--gray);
}

footer#footer #copyright a {
float: right;
margin-left:20px;
}

footer#footer .socials {
  padding:10px 0px;
  margin:10px 0px;
  border-bottom:2px solid var(--lightergray)
}

footer#footer li.footermenutop a {
  display:block;
  cursor:text;
  font-size:1.1em;
  margin-bottom:10px;
  color:var(--link);
}

footer#footer li.footermenutop a:hover {
color:var(--link);
}





/* ==========================================================================
PAGE-SPECIFIC STYLES
========================================================================== */

/*****
/* Home page
**********************************/

/* Hero Section */

.home #abovemain { 
color: var(--white);
display: block; 
height: 550px;
border-bottom:0px solid var(--lightergray);
padding:20px 20px 20px 20px;
/* background: 
 url(/wp-content/uploads/2025/11/bkg_blurred.jpg) center center no-repeat;*/
background-size: 130%; 
background-color:var(--white);
}

.home #abovemain #custom-widget-container .widget {
display: inline-block;
width: 100%;
padding: 40px 20px 20px 20px;
text-align:left;
max-width: 1200px;
}

.home #abovemain h1 {
color:var(--bgdark);
padding:140px 10% 0px 20px;
font-size:90px;
font-weight:700;
line-height: 90px;
text-align:left;
position:relative;
z-index:2;
opacity: 0;
/*text-shadow:3px 3px 12px rgba(0,0,0,0.7);*/
/* Animation with 1-second delay */
animation: fadeInh1 0.5s ease-in-out 0.5s forwards;
}

@keyframes fadeInh1 {
from {margin-top:-130px; margin-bottom:130; opacity: 0; }
to { margin-top:0px;  margin-bottom:0; opacity: 1; }
}

.card-hand {
position: absolute;
display: inline-block;
width: 540px;
top: 90px;
right: -110px;
opacity: 0;
/* Animation with 1-second delay */
animation: fadeInRight 0.5s ease-in-out 1s forwards;
}

@keyframes fadeInRight {
from { opacity: 0; right: -200px;}
to { opacity: 1; right: -110px; }
}

.home #abovemain h3 {
padding:10px 10px 0px 20px;
margin-top:0px;
color:var(--bgdark);
font-size:30px;
width: 100%;
font-weight:500;
}

.home #abovemain h3 {
font-size:28px;
}

.home #abovemain a.cta {
margin: 50px 10px 50px 0px;
padding:10px 50px 10px 10px;
color:var(--white);
background:url(img/icon-arrow-white.png) 95% center no-repeat var(--gray);
border:1px solid var(--gray);
transition:.2s;
background-size: 22px;
}

.home #abovemain a.cta:hover {
background:url(img/icon-arrow-white.png) 95% center no-repeat var(--red);
border:1px solid var(--red);
text-decoration:none;
background-size: 22px;
} 

.home #abovemain a.cta.second {
display:none;
color:var(--link);
background:url(img/icon-arrow-gray.png) 95% center no-repeat transparent;
border:1px solid var(--gray);
background-size: 22px;
}

.home #abovemain a.cta.second:hover {
color:var(--red);
background:url(img/icon-arrow-red.png) 95% center no-repeat transparent;
border:1px solid var(--red);
background-size: 22px;
}


/* Content Section */
/****************************/

.home #container  {
display: inline-block;
width: 100%;
padding: 0px;
z-index: 0;
}

.home #content {
display: block;
width: 100%;
max-width:100%;
padding: 0px;
text-align:center;
}

.home #container .section {
text-align:center;
}

.home #container .section.bglightergray {
color:var(--white);
background:var(--brightgray);
}

.home #container .section.bgdark {
color:var(--white);
background:var(--bgdark);
}


/* Update 13. nov */
/**********************************************/

.home #container .section.bgwhite {
text-align:center;
padding:50px 10px;
background:var(--white);
}

/* section sellingpoints */
.home #container .section div.row {
display: inline-block;
padding:15px 10px;
}

.home #container .section div.row p a {
display:inline-block;
padding-right:30px;
background:url(/wp-content/uploads/2025/11/icon-arrow-red.png) right center no-repeat;
background-size:18px;
transition:0.2s;
}

.home #container .section div.row p a:hover {
padding-right:35px;
}

.home #container .section div.row div {
display: inline-block;
height: 360px;
background:var(--brightergray);
text-align:left;
padding:0px;
}


.home #container .section div.row.first div {
height: 450px;
}

.home #container .section div.row div.big {
width:55%;
padding:50px 40px;
margin:0px 1%;
}

.home #container .section div.row div.small a {
display:block;
padding:0px;
margin:0px;
background:none!important;
border:none!important;
}

.home #container .section div.row div.small {
width:40%;
padding:0px;
margin:0px 1%;
overflow: hidden;
}

.home #container .section div.row div h2 {
width:auto;
padding:0px;
margin:0px;
text-transform:uppercase;
}

.home #container .section div.row div.small img {
width:100%;
height:360px;
object-fit:cover;
transition:.2s;
}

.home #container .section div.row.first div.small img {
height:450px;
}

.home #container .section div.row div.small img:hover {
transform: scale(1.2);
}


/* section image story */
.home #container .section.story div.row {
padding:0px 10px ;
}

.home #container .section.story div.row div {
height:310px;
margin: 10px 1%;
}

.home #container .section.story div.row div img {
height:310px;
width:100%;
object-fit:cover;
}

.home #container .section.story div.row div.three-two {
width:65%;
}

.home #container .section.story div.row div.three-one {
width:30%;
}


.home #container .section div {
display: inline-block;
width: 100%;
max-width:1200px;
padding: 10px 10px;
text-align:center;
}

.home #content article {
text-align: left;
padding: 0px 0px;
}

.home #content h2 {
margin: 0px 20px 0px 20px;
padding: 0px 0px 20px 0px;
font-weight:600;
}

.home #content h4 {
width:50%;
margin: 10px auto;
padding: 0px;
}

.home #content article li {
list-style: none;
}

.home #content p {
display: block;
margin: 10px 0px;
}

.home #content a {
display: block;
margin: 10px 0px;
padding: 0px 30px 0px 0px;
color:var(--red);
}

/* Lists container with 2 items */
.home #content ul:has(li:nth-child(2):not(:nth-child(3))), 
.home #content ol:has(li:nth-child(2):not(:nth-child(3))) {
columns:2;
column-gap: 30px;
}

/* Lists container with 3 items */
.home #content ul:has(li:nth-child(3):not(:nth-child(4))), 
.home #content ol:has(li:nth-child(3):not(:nth-child(4))) {
columns:3;
column-gap: 30px;
}

/* Lists container with 4 items */
.home #content ul:has(li:nth-child(4):not(:nth-child(5))), 
.home #content ol:has(li:nth-child(4):not(:nth-child(5))) {
columns:4;
column-gap: 30px;
}

/* Lists container with 5 items or more */
.home #content ul:has(li:nth-child(5)),
.home #content ol:has(li:nth-child(5)){
columns:3;
column-gap: 30px;
}

/* Lists container basics */
.home #content ul,
.home #content ol {
padding: 20px;
margin-bottom: 20px;
}

/* Lists item basics */
.home #content ul li,
.home #content ol li {
display:block;
break-inside:avoid;
}

/* UL Lists specifics */
.home #content ul li {
padding:20px 0px;
text-align:center;
}

/* UL Lists specifics Problem */
.home #content ul li.icon {
padding:0px;
color:var(--gray);
background:var(--white);
border-radius:0px;
border:0px dotted var(--gray);
overflow:hidden;
box-shadow: 1px 1px 15px rgba(0, 0, 0, 0.3);
}

.home #content ul.markets li.icon {
padding:0px;
margin-bottom: 20px;
transition: 0.2s;
text-align:center;
}

.home #content ul.markets li.icon a {
font-family: "Roboto Condensed", sans-serif;
font-size:var(--screenh3);
text-transform:uppercase;
height: 410px;
position:relative;
color:var(--white);
text-shadow:0px 2px 7px var(--black);
margin: 0px;
padding: 0px;
}

.home #content ul.markets li.icon a img {
display:block;
width:100%;
height: 410px;
padding: 0px;
margin: 0px;
filter: brightness(0.75);
object-fit:cover;
transition:0.2s;
}

.home #content ul.markets li.icon a img:hover {
filter: brightness(0.6);
transform: scale(1.2);
}

.home #content ul.markets li.icon a em {
font-style:normal;
display:block;
position:absolute;
top:20px;
left:20px;
right:20px;
}

.home #content ul.markets li.icon.gov {}
.home #content ul.markets li.icon.corp {}
.home #content ul.markets li.icon.trust {}


.home #content ul li.icon div {
padding:0px;
margin:0px;
max-width:auto;
}

.home #content ul li.icon div .wp-caption-text{
display:none;
}

.home #content ul li.icon div img {
padding:0px;
margin:0px;
width:100%;
}

.home #content ul li.icon img {
display: block;
width: -webkit-fill-available;
margin:-20px -20px 0px -20px;
}

.home #content ul li p {
position:relative;
padding:0px 0px;
margin:0px 0px;
}

.home #content ul li p a,
.home #content ol li p a {
display: block;
padding:10px 20px;
background:;
border-radius: 10px;
width: 150px;
margin: 10px auto;
color: var(--bgdark);
border:2px solid var(--bgdark);
}

.home #content ul li p a:hover,
.home #content ol li p a:hover {
background:var(--black);
color:var(--white);
}

/* UL/OL Lists specifics EM */
.home #content ul li em,
.home #content ol li em {
display:block;
}

/* Solution section */
.home #content .section.solution {
background:/*url(/wp-content/uploads/2025/11/bkg_blurred.jpg) center center no-repeat*/ var(--white);
background-size:cover;
color:var(--bgdark);
border-top:0px dotted var(--white);
border-bottom:0px dotted var(--white);
}

.home #content .section.solution div.real {
display:inline-block;
width:68%;
padding:0px;
}

.home #content .section.solution div.real div {
padding:0px;
}

.home #content .section.solution div.real h3 {
text-transform:uppercase;
padding:100px 0px;
text-shadow:1px 1px 10px rgba(0,0,0,1);
}

.home #content .section.solution div.real.image {
width:30%;
}
	
.home #content .section.solution div.real.image img {
min-height:240px;
max-height:240px;
width:100%;
object-fit:cover;
border-radius:20px;
border:2px dotted var(--white);
box-shadow:1px 1px 15px rgba(0,0,0,1);
}

.home #content .section.solution div.real.image p {
display:none;
}
	
.home #content .section ol li {
min-height: 280px;
padding:20px;
margin-bottom:20px;
background:#333/*var(--bggreen)*/;
border-radius:20px;
border:0px dotted var(--white);
box-shadow: 1px 1px 15px rgba(0, 0, 0, 0);
}

/* fully centralized section */	
.home #content .section ol.central li {
background:var(--white);
color:var(--bgdark);
min-height: 360px;
}
.home #content .section ol li.icon h3 {
font-size: var(--screenh2);
}

.home #content .section ol.central li h3 {
font-size: var(--screenh3);
}

.home #content .section ol li.icon h3 em {
display:none;
font-style:normal;
font-size:var(--screenh4);
margin:3px 0px;
}

.home #content .section ol li.icon p {
padding:0px;
margin:0px;
}
	
/* About section */
.home #content .section.about div ul {
}

.home #content .section.about div ul li {
min-height:500px;
padding:40px;
text-align:left;
background:var(--white);
color:var(--lightgray);
border:2px solid var(--white);
overflow:hidden;
box-shadow:0px 5px 15px rgba(0,0,0,0.5);
}

.home #content .section.about div ul li.quote img {
padding:0px 0px;
margin:0px 0px 10px 0px;
height: 100px;
min-height: 100px;
width: 100px;
filter: opacity(0.4);
object-fit: contain;
}

.home #content .section.about div ul li h2 {
padding:0px;
margin:0px;
}

.home #content .section.about div ul li img {
min-height:500px;
width:auto;
object-fit:cover;
margin:-40px -40px -50px -40px;
width:-webkit-fill-available;
}

.home #content .section ol li img {
width:90px;
margin:20px auto 0px auto;
}

.home h5, 
.home h6 {
font-size: var(--screenh5);
display:inline-block;
}
.home h5 {
width: 20%;
padding: 30px 0px 30px 0px;
margin-left:20px;
border-top:1px solid var(--lightergray);
}

.home h6 {
width: 77%;
padding: 30px 0px 30px 5%;
border-top:1px solid var(--lightergray);
}

.home #content h6 a {
display: inline;
}


/*****
/* Page specifics
**********************************/


/* About Page / Company */

.single #sidebar .reachout{
display:none;
}

.single .entry-content ol li a {
display:inline;
}

.single.category-company #container {
background: var(--brightgray);
padding: 50px 0px;
}

.single.category-company .custom-fields-wrapper,
.single.category-company #sidebar #indepth,
.single.category-company #sidebar #specialist,
.single.category-company .entry-meta {display:none;}

.single.category-company #content section.sidebar-section aside {
background: var(--white);
}

.single.category-company section.articles-section ul li {
background: var(--white);
}

.single.category-company #sidebar .reachout{
display:block;
}

.single.category-company #sidebar .reachout img {
width:100%;
}

.single.category-company .entry-content {
  margin: 100px 0px 0px 0px;
}

.single.postid-999 .entry-content p {
padding:0px 0px;
}


.single.category-company .entry-content .boardmember {
margin:20px 0px 30px 0px;
}

.single.category-company .entry-content .boardmember div {
display:inline-block;
}

.single.category-company .entry-content .img {
width:23%;
margin-right:6%;
}

.single.category-company .entry-content .text {
width:70%;
}

/* hide author on sales pages */
.single.tag-sales-page span.author.vcard,
.single.tag-sales-page span.meta-sep {display:none;}


/* Pricing page*/
ul#pricingmodels{
columns:3;
padding:20px 0px;
}

ul#pricingmodels li{
break-inside:avoid;
display:block;
padding:20px;
border:1px solid var(--lightergray);
transition:.2s;
}

ul#pricingmodels li p em {
display:block;
font-size:var(--screenh3);
line-height:auto;
font-style:normal;
}

ul#pricingmodels li p em strong{
font-size:var(--screenh2);
}

ul#pricingmodels li p a{
display:block;
}

ul#pricingmodels li ul li{
break-inside:avoid;
display:block;
padding:0px;
border:0px solid var(--lightergray);
}

ol#pricingfaq{
columns:2;
padding:20px 0px;
}

ol#pricingfaq li{
break-inside:avoid;
display:block;
padding:20px;
margin-bottom:20px;
background:var(--brightgray);
}


/*****
/* Preview articles (blog.php)
**********************************/

.blog #container {
background:var(--brightgray);
min-height: 100vh;
}

/* container */
.blog #content,
.archive #content {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  overflow-y: auto;
  max-width: 1560px;
  padding: 70px 20px;
  margin: 20px auto;
}

/* article box */
.blog #content article,
.archive #content article {
  break-inside: avoid;
  height: 500px;
  padding:20px;
  background:var(--white);
  border-radius: 20px;
  transition:.2s;
}

.blog #content article img {
border-radius:10px;
border-radius: 10px;
height: 180px;
object-fit: cover;
width: 100%;
}

.blog #content article .entry-summary a {
display:none;
}

.blog #content article:hover,
.archive #content article:hover {
 box-shadow:0px 0px 15px rgba(0,0,0,0.5);
}

.blog #content article h2,
.archive #content article h2 {
height: 40px;
padding: 0px 0px;
margin: 10px 0px;
line-height: inherit;
}

.blog #content article h2 a,
.archive #content article h2 a {
  padding: 0px 0px;
  margin: 0px 0px;
  font-size: var(--screenh3);
  color:var(--black)
}

.blog #content article:hover h2 a,
.archive #content article:hover h2 a {
  color:var(--red)
}

.blog #content article .entry-meta,
.archive #content article .entry-meta {
font-size: 13px;
color: var(--gray);
padding-top: 20px;
border-bottom: 1px solid var(--lightgray);
}


/* Ensure FAQ and navigation maintain normal flow 
*************************************************/

.blog .posts-navigation,
.faq-container,
.tab-container {
  grid-column: 1 / -1;
}

/* Hide footer articles on blog page */
.blog section.articles-section,
.archive section.articles-section {
display: none;
}

/*****
/* Article/Post (single.php)
**********************************/

/* Article page setup */
.single #content {
max-width:1600px;
margin-top: 50px;
}

/* Aritcle layout */
.single article {
  display: inline-block;
  width: 70%;
  float: left;
}

.single article li a {
color: var(--red);
}

/* Remove link from h1 */
.single h1.entry-title a {cursor:text;color:inherit;}
.single h1.entry-title a:hover {text-decoration:none;}

/* Article post-image */
.single .wp-post-image {
  width: 100%;
  height:auto;
  max-height:500px;
  object-fit:cover;
  margin: 20px 0px;
  border-radius: 20px;
}

/* Article entry-content placement */
.single .entry-content {
  width: auto;
  margin: 0px 0px 0px 350px;
}

/* Article blockquote */
.single .entry-content blockquote {
  display:block;
  width: auto;
  padding: 30px 0px 30px 130px;
  background:url(quotes.png) left 20px no-repeat;
  background-size:100px;
}

/* Table of contents container */
.single ol#contents {
  position:sticky;
  top:100px;
  padding:10px 20px 20px 0px;
  margin: 20px 0px 0px -350px;
  left:0px;
  float:left;
  max-width:300px;
  background:var(--white)
}

/* Table of contents header */
.single ol#contents:before {
content:"Table of contents";
font-size:var(--screenh4);
font-weight:300;
margin: -10px 0px 20px 0px;
display: block;
}

.single article ul li ul li,
.single article ul li ol li,
.single article ol li ul li,
.single article ul li ol li,
.single article ol li ol li {
margin-bottom:10px;
}

.single ol#contents li {
  padding:0px 0px;
  list-style:none;
}

.single ol#contents li a {
/*  white-space: nowrap; */
  display: inline-block;
  padding:5px 20px;
  border-left:2px solid var(--brightgray);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  color:var(--link)
}

.single ol#contents li a:hover {
  text-decoration:none;
  color:var(--linkhover)	
  border-left:2px solid var(--red);
}


.single ol#contents li a.active {
  border-left:2px solid var(--red);
}

/* Article FAQ */
/************************************************/


.custom-fields-wrapper {
border-bottom:1px solid var(--lightergray);
margin-bottom:60px;
margin-top:90px;
}

h2#faqsection {
display:none;
}

.custom-fields-wrapper div:first-of-type:before {
content:'Frequently Asked Questions';
Font-family: "Roboto Condensed", sans-serif;
display:block;
font-size:var(--screenh2);
font-weight:300;
position: absolute;
margin-top: -70px;
margin-left: -20px;
}

.custom-fields-wrapper .custom-field[class*=" question"], 
.custom-fields-wrapper .custom-field[class*=" Question"] {
  font-weight:500;
  padding:20px 20px 10px 20px;
  border-top:1px solid var(--lightergray);
  border-right:1px solid var(--lightergray);
  border-left:1px solid var(--lightergray);
}

.custom-fields-wrapper .custom-field[class*=" answer"], 
.custom-fields-wrapper .custom-field[class*=" Answer"] {
  padding:10px 20px 20px 20px;
  border-right:1px solid var(--lightergray);
  border-left:1px solid var(--lightergray);
  margin-top:-1px;
}

/* hide FAQ colons */
.custom-fields-wrapper .custom-field span.last-letter {
display:none;
}

/* Sidebar layout*/
.single #content section.sidebar-section {
  display: inline-block;
  width: 29%;
  float: right;
  position:sticky;
  top:100px;
}

.single #content section.sidebar-section aside {
  padding:20px 20px;
  background:var(--brightgray);
  border-radius:10px;
}

.single #content section.sidebar-section h2,
.single #content section.sidebar-section h3,
.single #content section.sidebar-section h4,
.single #content section.sidebar-section ul,
.single #content section.sidebar-section p {
padding:10px 0px;
margin:0px 0px;
}

.single #content section.sidebar-section ul{
margin:0px 0px 30px 0px;
}
.single #content section.sidebar-section h2,
.single #content section.sidebar-section h3 {
  font-size:var(--screenh4);
}

.single #content section.sidebar-section li{
list-style: none;
margin:0px 0px;
}

.single #content section.sidebar-section li.article-item{
  display:block;
  padding:0px 0px;
  margin:0px 0px;
}

.single #content section.sidebar-section li.article-item a {
  padding:0px 0px;
  margin:0px 0px;
}

.single #content section.sidebar-section .article-meta {
  font-size: 12px;
}


/* Sidebar cta section 
*********************************/

.single #content section.sidebar-section aside#sidebar a {
display:block;
margin-top:0px;
padding-top:10px;
color:var(--black);
border-top:3px dotted var(--lightergray);
}

.single #content section.sidebar-section aside#sidebar a:hover {
text-decoration:underline;
}

.single #content section.sidebar-section h4.pushdown {
 margin-top:0px;
}

.single #content section.sidebar-section aside#sidebar a.sidebar-contact {
position:relative;
display:inline-block!important;
color:var(--red);
width: auto!important;
padding-right:30px;
background:url(img/icon-arrow-red.png) right 15px no-repeat;
background-size:16px;
border-top:0px solid var(--gray)
transition:0.2s;
}

.single #content section.sidebar-section aside#sidebar a.sidebar-contact:hover {
padding-right:35px;
text-decoration:none!important;
}

/* vis/skjul relevante kategorier  */
/************************************************/

/* skjul lenker */
.single #content section.sidebar-section aside#sidebar a {
display:none;
}

/* vis lenker etter kategori */
.single.category-secure-multipurpose-architecture #content section.sidebar-section aside#sidebar a.category-secure-multipurpose-architecture,

.single.category-government-grade-biometrics #content section.sidebar-section aside#sidebar a.category-government-grade-biometrics,

.single.category-secure-multipurpose-architecture #content section.sidebar-section aside#sidebar a.category-trusted-enrollment-and-operations,

.single.category-desentralised-architecture #content section.sidebar-section aside#sidebar a.category-desentralised-architecture,

.single.category-trusted-enrollment-and-operations #content section.sidebar-section aside#sidebar a.category-trusted-enrollment-and-operations,

.single.category-human-nature-resilience  #content section.sidebar-section aside#sidebar 
a.category-enabling-true-zero-trust,

.single.category-enabling-true-zero-trust #content section.sidebar-section aside#sidebar a.category-enabling-true-zero-trust,

.single #content section.sidebar-section aside#sidebar a.sidebar-contact {
  display:block;
}

.single.category-core-markets  #content section.sidebar-section aside#sidebar h4.idr,
.single.category-core-markets  #content section.sidebar-section aside#sidebar div.article-posts-list {
  display:none;
}

.single #content section.sidebar-section aside#sidebar a.sidebar-contact {
  color:var(--red);
}

.single #content section.sidebar-section aside#sidebar a.sidebar-contact:hover {
  text-decoration:underline;
}

/*****
/** Article Category spescifics  
/******************************************************/

/* Hide button menu */
.single.category-articles #categories .category-posts-menu {
  display:none;
}

.single.category-articles #categories .breadcrumbs {
  width:100%;
  max-width:1560px;
  padding:10px 20px;
  display:inline-block;
  text-align:left;
}

/*****
/** Article preview post page bottom  
/******************************************************/

.single section.articles-section {
max-width: 1600px;
}

section.articles-section ul {
max-width: 1600px;
columns:4;
gap:20px;
}

section.articles-section ul li {
break-inside:avoid;
display:block;
width:auto;
list-style:none;  
padding:20px;
background:var(--brightgray);
height:510px;
transition:.2s;
border-radius:20px;
overflow:hidden;
box-shadow:0px 2px 15px rgba(0,0,0,0.0);
}

section.articles-section ul li:hover {
box-shadow:0px 2px 15px rgba(0,0,0,0.3);
}

section.articles-section ul li a {
display:block;
padding:0px;
margin:0px;
transition:.2s;
}

section.articles-section img.wp-post-image {
height: 180px;
object-fit: cover;
margin: 0px 0px;
width: -webkit-fill-available;
border-radius:10px;
}

section.articles-section ul li a.article-link {
display:none;
}

section.articles-section ul li:hover {
text-decoration:none;
}

section.articles-section ul li span {
display:block;
font-size:12px;
}

section.articles-section ul li .entry-meta-bottom{
display:block;
margin: 10px 0px 0px 0px;
border-bottom:1px solid var(--lightgray);
}

section.articles-section ul li span.article-date,
section.articles-section ul li span.article-author {
display:inline-block;
margin: 0px 5px 0px 0px;
}


section.articles-section ul li span.article-category {
display:none;
}

section.articles-section ul li span.article-title {
height: 60px;
font-family:'Roboto Condensed', sans-serif;
font-weight:500;
font-size:22px;
color:var(--black);
margin:10px 0px;
}

section.articles-section ul li:hover span.article-title {
color:var(--red);
}

section.articles-section ul li span.article-excerpt {
font-size:var(--screentext);
color:var(--black);
margin:10px 0px 10px 0px;
line-height: normal;
}

section.articles-section ul li span.article-read {
  display:none;
}


/*****
/** FAQ Open/Collapse  
/******************************************************/

.faq-container{
  text-align:left;
  padding:0px 20px;
}

.home #content .faq-container p {
  margin: 10px 0px;
}

.faq-item {
  margin:0px 0px;
}

.faq-question {
  width: 100%;
  padding: 15px 20px;
  text-align: left;
  background: none;
  border: none;
  cursor: pointer;
  position: relative;
  font-size: 16px;
  border: 1px solid var(--brightgray);
}

.faq-question:hover {
  border: 1px solid var(--lightgray);
}

.faq-question.active {
  border: 1px solid var(--lightgray);
}

.faq-question:after {
  content: '+';
  position: absolute;
  right: 20px;
  font-size: 20px;
}

.faq-question.active:after {
  content: '-';
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  padding: 0px 20px;
}

.faq-answer.open {
  max-height: 500px; /* Adjust based on your content */
  border-right: 1px solid var(--lightgray);
  border-bottom: 1px solid var(--lightgray);
  border-left: 1px solid var(--lightgray);
}

/* Hide empty FAQs */
.custom-fields-wrapper .custom-field[class*=" question"] span:contains("Question #5") {
display:none
}

/*******
/** TABS 
/******************************************************/

.tabs-header {
display: flex;
padding: 0 20px;
}

.tabs-header h2 {
padding: 20px 0;
}

.tabs-container {
display: flex;
min-height: 400px;
text-align:left;
}

.tab-buttons {
width: 250px;
display: flex;
flex-direction: column;
}

.tab-btn {
padding: 16px 20px;
background: none;
border: none;
text-align: left;
cursor: pointer;
transition: all 0.3s ease;
position: relative;
display: flex;
align-items: center;
}

.tab-btn:last-child {
border-bottom: none;
}

.tab-btn:hover {
background: #e9ecef;
}

.tab-btn.active {
background: white;
}

.tab-content {
flex: 1;
padding: 30px;
background: white;
}

.tab-pane {
display: none;
animation: fadeIn 0.5s ease;
}

.tab-pane.active {
display: block;
padding:0px 0px;
}

.tab-pane h3 {
margin-bottom: 15px;
}

.tab-pane p {
margin-bottom: 15px;
}

@keyframes fadeIn {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}


/* ==========================================================================
MEDIA QUERIES
========================================================================== */


/* ############################################## */
/* Large screens (max-width: 1120px) */
/* ############################################## */

@media (max-width: 1120px) {


/* Footer */  
footer#footer .section-left {
width:39.5%;
padding-right:5%;
}

footer#footer .section-center{
width:59%;
padding-right:0%;
}

footer#footer .section-right{
width:60%;
margin-left:40%;
padding-left:0%;
}

footer#footer .section-right ul {
columns:2;
}

footer#footer .section-right ul li {
display: block;
}
  
/* Home Page 
**************************************/  
  
.home #abovemain { 
display: block; 
border-bottom:1px solid var(--lightergray);
padding:20px 20px 20px 20px;
background-size: 180%;
overflow: hidden;
}
  
.home #abovemain h1 {
  font-size: 80px;
  text-shadow:0px 2px 10px rgba(0,0,0,0);
}

.home #abovemain h3 {
  font-size: 26px;
  width: 50%;
  text-shadow:0px 1px 6px rgba(0,0,0,0);
}

.home #content h3 {
  font-size: var(--padh3);
}
  
.home #content h4 {
  font-size: var(--padh4);
  width: auto;
  margin: 10px auto;
}
  
.card-hand {
position: absolute;
display: inline-block;
width: 540px;
top: 200px;
transform: rotate(40deg);
}

@keyframes fadeInRight {
from { opacity: 0; right: -300px;}
to { opacity: 1; right: -200px; }
}

/* Columns layout */
.home #content ul:has(li:nth-child(3):not(:nth-child(4))), 
.home #content ol:has(li:nth-child(3):not(:nth-child(4))) {
  columns: 1;
  column-gap: 0px;
}  
	
.home #content ul.problems:has(li:nth-child(3):not(:nth-child(4))),
.home #content ul.markets:has(li:nth-child(3):not(:nth-child(4))) {
columns: 3;
column-gap: 20px;
}
	
.home #content ul.markets li em { 
text-align: left;
}

.home #content .section ol.central li {
min-height: 300px;
}
	
.home #content ul li {
max-height: 300px;
margin-bottom: 20px;
}
  
/* Problems Columns *
.home #content ul.problems:has(li:nth-child(3):not(:nth-child(4))) {
  columns: 3;
  column-gap: 10px;
}  

/* Columns styling */
.home #content ul li {
  min-height:auto;
  padding: 10px 30px 30px 30px;
  margin: -1px 0px 0px 0px;
}

/* lined boxes */  
.home #content ul li.icon {
}  

.home #content ul li p {
  min-height: auto;
} 

/* unlined boxes */  
.home #content ol li {
  min-height:auto;
}
  
/* Market Section */
.home #content ol#markets li.icon {
padding: 20px  10px;
}

.home #content ol li.icon {
  min-height: auto;
  padding: 0px 40px 20px 40px;
}
  
.home #content ol li.icon {
  padding-top: 0px;
  margin-bottom:20px;
}  
.home #content .section ol li.icon h3 em {
display:block;
width:auto;
padding:0px 10px;
}
  
.home #content .section ol li.icon h3 strong {
display:block;
}
  
.home #content ul li p a {
  position: relative;
  display: block;
  width: 120px;
  margin: 10px 0px;
}

/* page bottom article preview */  
section.articles-section ul li {
}  
  
section.articles-section ul li a {
}  
  
  
/* Article preview page (blog) 
**************************************/  
  
.blog #content,
.archive #content {
  grid-template-columns: repeat(3, 1fr);
}
    
/* Branding / Logo */
/******************************************/
div#branding { 
  margin-left:0px;
}
  
/* Mobile top navigation 
******************************************/

.navHeader nav#menu {
  position: relative;
  display: block;
  background: transparent;
  margin:0px 0px;
  height: 10px;
}
    
.navHeader #menu .navlinks {
display:inline-block;
}
  
.navHeader #menu .menu-main-menu-container{
display:block;
}
  
.navHeader #menu ul.menu li a, 
.navHeader #menu ul.menu li:hover .sub-menu-wrapper a {
  display: block;
  padding: 5px 0px;
  text-decoration:none;
  font-size: inherit;
  color:var(--white);
}
  
.navHeader #menu ul.menu li a {
text-transform:uppercase;    
}
  
.navHeader #menu ul.menu li:hover .sub-menu-wrapper a {
padding: 8px 10px;
text-transform: math-auto;
background:var(--darkgray);
margin-top:2px;
border-radius:6px;
}
  
.navHeader #menu ul.menu li:hover .sub-menu-wrapper a:hover {
background:var(--gray);
}

.navHeader #menu ul.menu li:hover .sub-menu-wrapper .sub-menu-wrapper a {
padding: 5px 20px;
}

.navHeader #menu ul.menu li:hover .sub-menu-wrapper .sub-menu-wrapper a:hover {
text-decoration:none;
}
  
.navHeader #menu .menu-main-menu-container ul.menu {
  position: absolute;
  display: block;
  background: var(--black);
  width: 100vw;
  border: 1px solid;
  top: -80px;
  left: -40px;
  right:-400px;
  padding: 100px 35px 20px 35px;
  margin-top:-1000px;
  transition:0.35s
}

.navHeader #menu .menu-main-menu-container ul.menu.active {
  margin-top:0px;
  transition:0.35s
}

.navHeader #menu .menu-main-menu-container ul.menu li {
display: block;
}

.navHeader #menu .menu-main-menu-container ul.menu li:hover > ul {
width: auto;
display: block;
padding: 0px;
position: relative;
top: 0px;
left: 0px;
}

.navHeader #menu ul.menu li:hover .sub-menu-wrapper {
position: relative;
display: block;
width: auto;
padding: 0px;
left: 0px;
}
 
/* Burger icon*/
.hamburger {
display: inline-block;
position: absolute;
  top: 20px;
  right: 30px;
  z-index: 2;
  transition: 0.3s;
  cursor: pointer
}
  
.hamburger div {
width: 25px;
display: block;
padding: 2px;
margin: 4px 3px;
background: #999;
transition: 0.3s
}

.navHeader .navMenu {
width: 100%;
height: auto;
display: block;
float: none;
margin-top: -800px;
text-align: left;
position: absolute;
z-index: 1;
padding-top: 110px;
padding-bottom: 0;
top: 0;
left: 0;
background: ;
transition: 0.3s
}

.navHeader .navMenu ul li {
display: block;
border-bottom: 0px solid #ddd;
}

.navHeader .navMenu ul li a {
display: block;
padding: 10px;
}

.navHeader .navMenu ul li a:hover {
padding: 10px;
}

.navHeader .showNavMenu {
margin-top: 0;
transition: 0.3s;
box-shadow: 3px 3px 6px rgb(0 0 0 / .6)
}

.navHeader .showNavMenu #menuLineCenter {
opacity: 1;
transition: 0.3s
}

.navHeader .cross #menuLineTop {
transform: rotate(45deg);
transition: 0.3s;
margin-top: 20px
}

.navHeader .cross #menuLineCenter {
opacity: 0;
transition: 0.3s
}

.navHeader .cross #menuLinebottom {
transform: rotate(-45deg);
transition: 0.3s;
margin-top: -16px
}

.sub-menu {
position: relative;
background: rgb(0 0 0 / .1)
}
  


/* hide category links */
#categories .category-posts-menu {
  display: none;
  }

/*****
/* Article/Post (single.php)
**********************************/

/*****
/** Article Category spescifics  
/******************************************************/

/* Hide Breadcrumbs */
.single.category-articles #categories .breadcrumbs {
  display:none;
}

/* Aritcle layout */
.single article {
  display: block;
  width: 100%;
  float: none;
}

/* Article entry-content placement */
.single .entry-content {
  width: auto;
  margin: 0px;
}

.single ol#contents {
display:none;  
position:sticky;
  top:0px;
  z-index:1;
  padding:20px 20px;
  margin: 0px 0px 20px 0px;
  left:0px;
  float:none;
  max-width:100%;
  border:1px solid var(--lightgray);
  height:70px;
  overflow:hidden;
  transition:0.3s;
  border-radius: 10px;
}

.single ol#contents.active {
  height:auto;
  transition:0.3s;
}
  
.single ol#contents:before {
  font-size: var(--padh4);
  margin: 0px 0px 20px 0px;
}

.single ol#contents li a {
  padding: 5px 0px;
  border-left: 0px solid var(--lightgray);
}
  
.single ol#contents li a:hover {
  border-left: 0px solid var(--red);
  color:var(--red);
}

.single ol#contents li a.active {
  border-left: 0px solid var(--red);
  color:var(--red);
}
  
/* Table of contents expand/collaps button */ 
div.expandbtn {
display:none;  
  position:sticky;
  top:10px;
  right:0px;
  z-index:2;
  text-align:right;
  padding:10px 20px;
  margin: 60px 0px -60px 0px;
}

div.expandbtn img {
  display: inline-block;
  width:20px;
  transition:.2s
}
  
div.expandbtn.active img {
  display: inline-block;
  width:20px;
  transform:rotate(180deg);
  transition:.2s
}
  
/* Article sidebar CTA section */
.single #content section.sidebar-section{
  display: inline-block;
  padding: 0px 20px;
  width: 100%;
  float: none;
  position: relative;
  top: 0px;
}  
  
/* Article sidebar CTA button */
.single #content section.sidebar-section aside#sidebar li#custom_html-4 a {
  display: inline-block;
  width: 120px;
}

}


/* ############################################## */
/* Tablets (max-width: 960px) */
/* ############################################## */


@media (max-width: 960px) {
  
.home #abovemain { 
padding:20px 20px 20px 20px;
height: 480px;
}

  
.home #abovemain h1 {
font-size: 80px;
padding:40px 20px 0px 20px;
}

.home #abovemain h3 {
 margin-bottom:30px;
}
  
.home #abovemain a.cta {
  margin: 10px 40% 10px 0px;
}

/* Update 13. nov */
/**********************************************/

.home #container .section.bgwhite {
text-align:center;
padding:20px 0px 0px 0px;
background:var(--white);
}

/* section sellingpoints */
.home #container .section div.row {
display: inline-block;
padding:15px 0px;
}

.home #container .section div.row div {
display: inline-block;
height: 310px;
background:var(--brightgray);
text-align:left;
padding:0px;
}

.home #container .section div.row div.big {
width:47%;
padding:30px 25px;
margin:0px 1%;
}

.home #container .section div.row div.small {
width:47%;
padding:0px;
margin:0px 1%;
}

.home #container .section div.row div h2 {
width:auto;
padding:0px;
margin:0px;
}

.home #container .section div.row div.small img {
width:100%;
height:310px;
object-fit:cover;
}

/* section image story */
.home #container .section.story div.row {
padding:0px 20px;
}

.home #container .section.story div.row div {
height:32vh;
margin: 20px 0px;
background:var(--white);
}

.home #container .section.story div.row div img {
height:32vh;
width:100%;
}

.home #container .section.story div.row div.three-two {
width:100%;
}

.home #container .section.story div.row div.three-one {
width:100%;
}

	
/* Objections */  
.home h6 {
    width: 74%;
    padding: 30px 0px 30px 30px;
    border-top: 1px solid var(--lightergray);
    margin-right: 20px;
}
  
/* page bottom article preview */  
section.articles-section ul {
    max-width: 1600px;
    columns: 2;
    gap: 20px;
}
    
section.articles-section ul li {
margin-bottom:20px;
}
  
.blog #content,
.archive #content{
  grid-template-columns: repeat(2, 1fr);
}

}


/* ############################################## */
/* Small tablets/phones (max-width: 780px) */
/* ############################################## */


@media (max-width: 780px) {

/* Format */

h1 { font-size: var(--padh1); }
h2 { font-size: var(--padh2); }
h3 { font-size: var(--padh3); }
h4 { font-size: var(--padh4); }

/* Paragraphs */
p {
font-size: var(--screenText);
padding: 10px 0 20px;
}

/* Footer */  
footer#footer .section-left {
display:block;
width:auto;
padding-right:0%;
}

footer#footer .section-center{
display:block;
width:auto;
padding-right:0%;
}

footer#footer .section-right{
display:block;
width:auto;
padding-right:0%;
margin-left:0%;
padding-left:0%;
}

/* Hero section */

.home #abovemain { 
height: 380px;
padding:20px 20px 20px 20px;
}

.home #abovemain h1 {
font-size: 60px;
text-shadow:0px 2px 10px rgba(0,0,0,0);
line-height: 60px;
}

.card-hand {
width: 380px;
top: 80px;
}

@keyframes fadeInRight {
from { opacity: 0; right: -200px;}
to { opacity: 1; right: -130px; }
}

/* Core markets */

.home #content ul.problems:has(li:nth-child(3):not(:nth-child(4))),
.home #content ul.markets:has(li:nth-child(3):not(:nth-child(4))) {
columns: 1;
column-gap:0px;
}
	
.home #content ul.problems li{
margin-bottom:20px;
}
	
.home #content ul.markets li em { 
text-align: left;
}


/* Objections */  
.home h5, .home h6 {
  display: block;
  width:auto;
  padding: 30px 0px 0px 0px;
  margin-left: 20px;
  margin-right: 20px;
  }  
  
.home h6 {
  border-top:0px solid ;
  margin-right: 20px;
  margin-bottom:30px;
  }  
  
.home #content ol:has(li:nth-child(2):not(:nth-child(3))) {
  columns: 1;
}

.home #content ol:has(li:nth-child(2):not(:nth-child(3))) li {
margin-bottom:20px;
}

/* About section */
.home #content .section.about div ul {
  columns: 1;
}
  
.home #content .section.about div ul li {
  min-height: 320px;
  max-height: 320px;
  height: 320px;
  margin-bottom:20px;
}

.home #content .section.about div ul li img {
  min-height: 320px;
  max-height: 320px;
  height: 320px;
  }
    
section.articles-section ul li {
height: 480px;
}

.custom-fields-wrapper div:first-of-type:before {
font-size:var(--padh2);
}
    
}
  

/* ############################################## */
/* Normal phones (max-width: 620px) */
/* ############################################## */

@media (max-width: 620px) {

/* Format */
body {
font-weight: 400;
font-size: 1em;
}

/* Headings */
h2, h3, h4, h5, h6 {
font-weight: 500;
}


/* Hero section */

.home #abovemain { 
height:320px;
padding:60px 20px 0px 20px ;
background-size: 300%;
}

.home #abovemain #custom-widget-container .widget {
padding:40px 20px;
}

.home #abovemain h1 {
font-size: 40px;
text-shadow:0px 2px 10px rgba(0,0,0,0);
padding: 0px 0px;
line-height: 40px;
}

.home #abovemain h3 {
font-size: 20px;
padding: 10px 0px;
}

.card-hand {
width: 350px;
top: 60px;
}

@keyframes fadeInRight {
from { opacity: 0; right: -200px;}
to { opacity: 1; right: -130px; }
}

/* Update 13. nov */
/**********************************************/

.home #container .section.bgwhite {
text-align:center;
padding:20px 0px 0px 0px;
background:var(--white);
}

/* section sellingpoints */
.home #container .section div.row {
display: block;
padding:20px;
}

.home #container .section div.row div {
display: block;
width:100%;
padding:10px 0px;
}

.home #container .section div.row div.big {
width:auto;
padding:30px 20px;
margin:0px 0%;
height:auto;
}

.home #container .section div.row div.small {
width:auto;
height: 32vh;
padding:0px;
margin:0px 0%;
}

.home #container .section div.row div.small img {
width:100%;
height: 32vh;
}

/* Article preview */  
.blog #content article img {
height: 50vw;
}
  
/* page bottom article preview */  
section.articles-section ul {
  columns: 1;
  gap: 0px;
}

section.articles-section ul li {
display:block;
width: auto;
height:auto;
}  
  
section.articles-section ul li a {
  min-height: auto;
}  

section.articles-section img.wp-post-image {
height: 50vw;
}  

section.articles-section ul li a span.article-read {
  position: relative;
  display: block;
  width: 100px;
  left: 0px;
  bottom:0px;
  margin-top: 40px;
  margin-right: 0px;
}
  
.blog #content,
.archive #content{
  grid-template-columns: 1fr;
  }
  
.blog #content article, 
.archive #content article {
  height: auto;
 }

.custom-fields-wrapper div:first-of-type:before {
font-size:20px;
font-weight:500;
}
	
div.row.phone-hide {
display:none!important;
}

/* Company pages */
.single.category-company .entry-content {
    margin: 20px 0px 0px 0px;
}	
	
	
}

  
/* ############################################## */
/* Small phones (max-width: 480px) */
/* ############################################## */

@media (max-width: 480px) {
  
/* Format */
body { font-size: 14px; }
h1 { font-size: 26px; }
h2 { font-size: 20px; }
h3 { font-size: 17px; }
h4 { font-size: 16px; }

/* Hero section */

.home #abovemain { 
height:320px;
padding:20px 20px 0px 20px ;
}

.home #abovemain #custom-widget-container .widget {
padding:20px 0px;
}

.home #abovemain h1 {
font-size: 30px;
padding: 60px 0px 0px 0px;
line-height: 30px;
}

.home #abovemain h3 {
font-size: 20px;
padding: 10px 0px;
}

.card-hand {
width: 320px;
top: 130px;
}

@keyframes fadeInRight {
from { opacity: 0; right: -200px;}
to { opacity: 1; right: -120px; }
}


/* Articles */
/* Add article styles for small phones here */
}