:root {
  --primary-color: #ffffff;
  --secondary-color: #212121;
  --lightgrey: #efefef;
  --darkgrey: #333;
  --purple:#8246af;
  --yellow:#ffd100;
  --silver:#F8F8F8;
  --light-yellow:#fff8dc; /* cornsilk */
  --bgyellow:#fff8dc; /* cornsilk */
  --light-blue:#DCF8FF;
  --light-green:#F6F9F3;
  --light-purple:#eee7f4;
  --HeadingFont: 'Inter',serif;
  --HeadingFontWeight: 400;  
  --BodyFont:'Inter',sans-serif;
  --BodyFontWeight:300; 
  --highlight-color:#8246af;
} @font-face {
  font-family:"Inter";
  src:url("https://dwvt5wwshu97q.cloudfront.net/uploads/2/themes/209/fonts/Inter_Light.woff2?v=63893914839") format("woff2"),
      url("https://dwvt5wwshu97q.cloudfront.net/uploads/2/themes/209/fonts/Inter_Light.ttf?v=63893914818") format("ttf");
  font-display:swap;font-style:normal;font-weight:300;font-stretch:normal;
}

@font-face {
  font-family:"Inter-Bold";
  src:url("https://dwvt5wwshu97q.cloudfront.net/uploads/2/themes/209/fonts/Inter_Bold.woff2?v=63893917040") format("woff2"),
      url("https://dwvt5wwshu97q.cloudfront.net/uploads/2/themes/209/fonts/Inter_Bold.ttf?v=63893917028") format("ttf");
  font-display:swap;font-style:normal;font-weight:700;font-stretch:normal;
}

html {
  font-size: 62.5%; /* base font size is 10px = 1 rem) */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body {
  font-family: 'Inter', Helvetica, Arial, sans-serif; /* Google Font Inter Light 300 */
  font-weight:300;
  font-style:normal;
  font-size:1.6rem;
  line-height:1.5;
  color:#121212;
  font-feature-settings: zero; /* Low-level setting for all browsers */
}

a {
  text-decoration-thickness: .1rem;
  text-underline-offset: 1.5px;
}
@supports (font-variant-numeric: slashed-zero) {
  body {
    font-feature-settings: normal; /* Reset the low level, then... */
    font-variant-numeric: slashed-zero; /* ... use the better code */
  }
}

h1,h2,h3 ,h4,h5 {
  font-family: "museo-slab", serif;
  font-style: normal;
  font-weight: 900;
  line-height:1.2;
  margin-top:1em; /* reset margins on headings */
  margin-bottom:0.5em;
}

h1 {font-size:4rem; }
h1.hero {font-size:5rem;}
h2 {font-size:3rem;}
h3 {font-size:2.5rem;}
h4 {font-size:2rem;}
h5 {font-size:1.8rem;}
p  {font-size:1.6rem;}
p b,p bold,p strong,p.strong {font-family: 'Inter-Bold', sans-serif; font-weight:700;}
/* increase size to call out important text relative to parent font-size */
.pitch,.hero,.lead {
  font-size:1.25em; 
  margin-top:1em;
}
small,.small {font-size:0.8em!important;}
.lite {opacity:0.25;}
sub {text-transform:initial; margin:0;}
blockquote,cite,.footnote,.caption,.comment,.figcaption {
  font-size:0.8em;
  font-style:italic;
}
blockquote {
  padding:1em 0; 
  text-align:center;
}
blockquote cite {
  font-size:0.8em;
  font-style:normal;
}
blockquote img.avatar {
  display: block;
  width: 200px;
  border-radius: 100px;
  margin: 1em auto;
}
blockquote p {
	font-size:1.5em;
    font-weight:bold;
}

.thousand-pictures {margin:2em auto;}

ul li {line-height:1.5;}
mark {
  padding: 0.5em 1em;
  background-color: #f9d147;
  color: black;
}
highlight,.highlight {color:var(--highlight-color);}

.center {text-align:center;}

pre {background-color:var(--light-yellow);}
code {white-space:pre-wrap;}
.purple {color:var(--purple);}
.strike {text-decoration:line-through;}
.dim {opacity:0.4;}
h2 sup {font-size:50%; top:-1em;}
h1 sup {font-size:33%; top:-2em;}
.with-sub {margin-bottom:0;}
h1 ~ p.lead, h2 ~ p.lead {margin-top:0;}
/* desktop - reset font size a little larger for screens wider than 48em x 16 px = 768px) */
@media (min-width:48em) {
  .main {font-size:2rem;}
  h1 {font-size:6rem;}
  .asset-details-section h1 {font-size:4rem;}
  h1.hero {font-size:7rem;}
  h2 {font-size:5rem;}
  h3 {font-size:4rem;}
  h4 {font-size:3rem;}
  h5 {font-size:2rem;}
  p {font-size:1.8rem;}
  .breadcrumb-item {font-size:1.6rem;}
}
@media (min-width:75em) {
  h1.hero {font-size:8rem;}
}
@media (min-width:100em) {
  h1.hero {font-size:9rem;}
}

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

.navbar-section {
  padding-top: 0;
  padding-bottom: 0;
  /* navbar account name color */
  color: var(--darkgrey);
  color:#fff;
  /* navbar color */
  background-color: white;
  background-color: #000;
  /* navbar border at the bottom */
  border-bottom: 5px solid #222;
}

/* navbar icons text color */
.navbar-section .selection-count,
.navbar-section .avatar-user-dropdown{
  color: var(--darkgrey);
  color: #fff;
}

/* navbar user dropdown border color */
.navbar-section .avatar-user-dropdown{
  border-color: var(--darkgrey);
  border-color: #fff;
}

/* navbar icons color */
.navbar-section .svg-stroke path,
.navbar-section .svg-stroke line{
  stroke: var(--darkgrey);
  stroke: #fff;

}

/* navbar icons color */
.navbar-section .svg-fill path{
  fill: var(--darkgrey);
  fill: #fff;
}

svg.caret-down-icon path {
    stroke:#fff;
}
/* navbar icons text */
span.nav-icon-text {
  display:none;
}

/* mobile menu bg color */
.navbar-section-content {
  background-color: white;
  background-color: #000;
  gap: 3rem;
}


/* navbar links */
.navbar-section-content a { 
  color: var(--darkgrey);
  color: #fff;
  
}
.caret-down-icon {
  margin-left: 0;
}

.dropdown-button {color:#fff;}

/* Hide logo and account name on mobile */
.account-logo .logo {
  display: none; 
  max-height: 4rem;
}

span.account-name {
  font-size: 1.6rem;
  display: none;
}
/* desktop - for screens wider than 62em x 16 px = 992px) */
@media (min-width: 62em) {
  /* Display logo and account name on desktop */
  .account-logo .logo,
  span.account-name {
    display:block;
    max-height: 10rem;
    min-height: 6rem;
  }
  .navbar-section {
    height: 12rem;
  }
  .main {margin-top:12rem;}
  .preview-mode .main {
    padding-top:6rem
  }
}

/* Navbar grid 4 column
.navbar-grid {
display:grid;
grid-template-columns: 1fr;
grid-auto-rows: minmax(min-content, max-content);
grid-column-gap: 3em;
grid-row-gap: 3em;
font-size:1.5rem;
padding:0.5rem 1rem;
}
.navbar-grid article {
display: grid;
grid-auto-rows: minmax(min-content, max-content);
grid-template-columns: -webkit-max-content;
}

@media (min-width:48em) {
.navbar-grid {
display:grid;
grid-template-columns: 1fr 1fr;
grid-column-gap: 4em;
grid-row-gap: 4em;   
}
}

@media (min-width:100em) {
.navbar-grid {
display:grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-column-gap: 6em;
grid-column-gap: 6em;
}
}  
/* end nav bar grid */

/* style nav drop downs */
.dropdown-menu-item .dropdown-content {
  position: relative;
  background-color: #666;
  min-width: 30rem;
  max-height:calc(100vh - 140px);
  overflow: auto;
  z-index: 1;
  margin-top: 1rem
}

.dropdown-menu-item .dropdown-content a {
  color: #fff;
  font-size:1.4rem;
  padding: 1em;
  text-decoration: none;
  display: block
}

.dropdown-menu-item .dropdown-content a:hover {
  background-color: #efefef;
  color:#000;
}

.dropdown-menu-item .dropdown-content {
  position: absolute;
  box-shadow: 0 .5em 1em #000033;
}


.navbar-section-content a.demo-button {
  background-color:var(--purple);
  padding:.5rem 1rem;
  color:#fff;
  border-radius:0.5rem;
}

/* fix - download modal inherits navbar color */
.download-modal-content {
  color: var(--darkgrey);
}/* Footer styles */
.footer-section {
  /* footer background color */
  background-color: black;
  /* footer text */
  color: white;
  font-size:1.4rem;
}

/* color of links in the footer */
.footer-menu-links li a {
  color: var(--lightgrey);
}

.footer-section {
  background-color: #121212;
  color: white;
}
.footer-top {
    padding-bottom: 1em;
    padding-top: 1em;
    flex-direction: column;
    justify-content: start;
    align-items: start;
  }

.footer-links {
    display:grid;
    grid-template-columns: 1fr;
    grid-auto-rows: minmax(min-content, max-content);
    grid-column-gap: 2em;
}

.footer-links article {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
  font-size:1.4rem;
}
.footer-links article p {
  font-size:1.4rem; 
  text-align:center;
}
.footer-links article a {
  font-size:1.4rem;
  line-height:2;
  margin-bottom:0.5em;
  text-decoration:none;
  text-align:center;
}
.footer-links article a.header {font-weight:bold;}

.footer-middle {
  display:block;
  width:100%;
  padding:1em;
}
.footer-middle p {
  font-size:1.4rem;
  text-align:center;
}

/* breakpoint use ems not rems at 48em x 16px = 768px */ 
@media (min-width:48em) {
  .footer-links {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  }
  .footer-links article p {font-size:1.4rem;}
  .footer-links article:nth-child(4) p {text-align:left;}
  .footer-links article a, .footer-links article p {
    padding-right:1em;
    margin-right:0.5em;
    width:fit-content;
    text-align:left;
    display:inline-block;
  }
  .footer-links article li:last-child {border:none;}

  .imprint {
    display:block;
    position:relative;
    text-align:center;
    font-size:1.4rem;
    width:100%;
  }
}

ul.footer-social-media, ul.affiliations {text-align:center; margin:4em 0;}
ul.footer-social-media li, ul.affiliations li  {
  list-style: none;
  display: inline;
  margin:0.5em;
}
ul.footer-social-media li a, ul.affiliations li a {
  padding:0.5em;
  text-decoration:none;
}
ul.affiliations li a {min-width:24rem;}
ul.affiliations li a img { max-width:12rem; max-height:10rem;}


.powered-by-brandkit {
  font-size: 1.4rem;
  margin-bottom: 1em;
}

/* css icons */
.css-icon-twitter,
.css-icon-facebook,
.css-icon-linkedin,
.css-icon-instagram {
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  display: inline-block;
}

.css-icon-twitter {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" height="24" width="24"><path d="M23.32,6.44a.5.5,0,0,0-.2-.87l-.79-.19A.49.49,0,0,1,22,5.1a.5.5,0,0,1,0-.43l.45-.89a.5.5,0,0,0-.59-.7l-2,.56a.48.48,0,0,1-.43-.09,5,5,0,0,0-8,4v.36a.25.25,0,0,1-.22.25c-2.81.33-5.5-1.1-8.4-4.44a.5.5,0,0,0-.51-.16A.49.49,0,0,0,2,4a7.52,7.52,0,0,0,.46,4.92.27.27,0,0,1,0,.26.24.24,0,0,1-.25.1L1.08,9.06a.52.52,0,0,0-.44.15.51.51,0,0,0-.13.44,5.15,5.15,0,0,0,2.37,3.78.25.25,0,0,1,.12.23.24.24,0,0,1-.15.22l-.54.21a.53.53,0,0,0-.28.29.51.51,0,0,0,0,.4,4.36,4.36,0,0,0,3.2,2.48.27.27,0,0,1,.19.22.26.26,0,0,1-.15.26A11,11,0,0,1,1,18.56a.49.49,0,0,0-.2,1,19.92,19.92,0,0,0,8.14,1.93,12.6,12.6,0,0,0,7-2A12.48,12.48,0,0,0,21.5,9.06V8.19a.49.49,0,0,1,.18-.38Z" fill="%23ffffff"></path></svg>');
}

.css-icon-facebook {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" height="24" width="24"><path d="M18.14,7.17A.5.5,0,0,0,17.77,7H14V5.59c0-.28.06-.6.51-.6h3a.42.42,0,0,0,.35-.15A.47.47,0,0,0,18,4.5V.5a.5.5,0,0,0-.5-.5H13.17C8.37,0,8,4.1,8,5.35V7H5.5a.5.5,0,0,0-.5.5v4a.5.5,0,0,0,.5.5H8V23.5a.5.5,0,0,0,.5.5h5a.5.5,0,0,0,.5-.5V12h3.35a.5.5,0,0,0,.5-.45l.41-4A.47.47,0,0,0,18.14,7.17Z" fill="%23ffffff"></path></svg>');
}

.css-icon-linkedin {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" height="24" width="24"><g><rect x="2" y="8.5" width="5" height="14" rx="0.5" fill="%23ffffff"></rect><path d="M4.48,6.5A2.5,2.5,0,1,0,2,4,2.49,2.49,0,0,0,4.48,6.5Z" fill="%23ffffff"></path><path d="M18.5,22.5h3A.5.5,0,0,0,22,22V13.6C22,9.83,19.87,8,16.89,8a4.22,4.22,0,0,0-3.18,1.28.39.39,0,0,1-.45.09A.4.4,0,0,1,13,9a.5.5,0,0,0-.5-.5h-3A.5.5,0,0,0,9,9V22a.5.5,0,0,0,.5.5h3A.5.5,0,0,0,13,22V14.5a2.5,2.5,0,0,1,5,0V22A.5.5,0,0,0,18.5,22.5Z" fill="%23ffffff"></path></g></svg>');
}

.css-icon-instagram {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14" height="24" width="24"><path fill="%23ffffff" fill-rule="evenodd" d="M7.00007 0.421143C5.90664 0.421143 4.8394 0.518935 3.81576 0.632163C2.14332 0.817155 0.798567 2.16087 0.620803 3.83632C0.512774 4.8545 0.421143 5.91442 0.421143 7.00007C0.421143 8.08572 0.512774 9.14563 0.620803 10.1638C0.798568 11.8393 2.14332 13.183 3.81576 13.368C4.8394 13.4812 5.90664 13.579 7.00007 13.579C8.0935 13.579 9.16073 13.4812 10.1844 13.368C11.8568 13.183 13.2016 11.8393 13.3793 10.1638C13.4874 9.14564 13.579 8.08572 13.579 7.00007C13.579 5.91442 13.4874 4.8545 13.3793 3.83632C13.2016 2.16087 11.8568 0.817155 10.1844 0.632163C9.16074 0.518935 8.0935 0.421143 7.00007 0.421143ZM6.99997 9.60956C8.44114 9.60956 9.60944 8.44126 9.60944 7.00009C9.60944 5.55892 8.44114 4.39062 6.99997 4.39062C5.5588 4.39062 4.3905 5.55892 4.3905 7.00009C4.3905 8.44126 5.5588 9.60956 6.99997 9.60956ZM11.2469 3.11426C11.2469 2.76908 10.9671 2.48926 10.6219 2.48926C10.2768 2.48926 9.99695 2.76908 9.99695 3.11426V3.55211C9.99695 3.89729 10.2768 4.17711 10.6219 4.17711C10.9671 4.17711 11.2469 3.89729 11.2469 3.55211V3.11426Z" clip-rule="evenodd"></path></svg>');
}/* ---------------------
Main Elements
--------------------- */
.body {
  background-color: #fff;
}

.welcome-paragraph {
  font-size:2rem;
}

p.main-links {padding:2em;}
p.main-links a.link {color:var(--purple);}

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

hr.thin,hr.dashed {
	border:none;
  	margin: 4em;
    width:auto;
  	border-top-style: dashed;
    border-width:1px;
  	color:inherit;
    opacity:0.5; 
  
}
hr.dotted {
	border:none;
  	margin: 4em;
    width:auto;
  	border-top-style: dotted;
    border-width:1px;
  	color:inherit;
    opacity:0.5; 
}

/* fix code wrapping on mobile */
pre {
  font-family: monospace,monospace;
  font-size: 1em;
  max-width: 100%;
  overflow: auto;
  white-space: normal;
  background-color:var(light-yellow);
  padding:1em;
  border:1px solid #ccc;
}


/* ----------------
Search widget
---------------- */

.search-section {
  max-width: 120rem;
  margin: 5rem auto; 
}

/*.search-label{
  display: none;*/
}
.search-box {
  border: 1px solid #000;
}

.change-grid-view .icon-text {
  display: none;
}
.filters{
  justify-content: center;
}

.search-grid-section .page-actions, 
.search-grid-section .grid, 
.search-grid-section .assets-pagination {
  background-color: var(--primary-color);
  padding-bottom:4rem;  
}

.file-icon::before{
  border-color: var(--primary-color) var(--primary-color) rgba(255, 255, 255, .3) rgba(255, 255, 255, .35);
}

/* ----------------
Masonry view 
----------------- */
.masonry-asset {
  margin-bottom: 2rem;
  background-color: white;
  padding: 0;
  float: left;
}
.masonry-asset:hover {opacity:0.6;}
.masonry-asset .asset-grid-icon {position:relative;}
.masonry-asset .asset-grid-name {margin-left:0;}

.masonry-asset .asset-grid-name, .feed-asset .asset-grid-name {font-family:"museo-slab", serif;}

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

.button,.normal-button {
  color: white;
  background-color: var(--purple);
  padding: 0.5em 1em;
  margin:0.25rem 0;
}
.button.reverse-button, .reverse-button {
  border: 2px solid var(--purple);
  background-color: white;
  color:var(--purple);
  padding: 0.5em 1em;
}

.button.hollow-button, .hollow-button {
  border: 2px solid var(--purple);
  background-color: transparent;
  color:var(--purple);
  padding: 0.5em 1em;
}

.button.white-hollow-button, .white-hollow-button {
  border: 2px solid #fff;
  background-color: transparent;
  color:#fff;
  padding: 0.5em 1em;
}



.button.cancel-button, .cancel-button {
  color: red;
  background-color: transparent;
}

.button-with-border{
  border-color: black;
}

a:hover,
.asset-add-to-basket-button:hover,
.clear-search-btn:hover {
  opacity:0.6;
}

.ProfileView .edit-profile-button {width:100%;}

/* ------------
Gallery 
------------ */

/*-- Mobile --*/
.gallery-link,
.gallery-image {
  height: 8rem;
}

/*-- Desktop --*/
@media (min-aspect-ratio: 1/1) {
  .gallery-link,
  .gallery-image {
    height: 16rem;
  }
}


/* --------------
Home Page 
-------------- */
.intro-logo {
  max-width:20rem;
}

#customer-logos article {
  padding-top:0.5em;
  padding-bottom:1em;
} 
#customer-logos article a {
  display:inline-block;
  max-width:calc(100% / 5);
  height:auto;
  margin:0;
  padding:0;
}
#customer-logos article a img {max-width:100%;}
/* breakpoint use ems not rems at 48em x 16px = 768px */ 
@media (min-width:48em) {
  #customer-logos article a {
    max-width:calc(100% / 9);
  }   
}
/* end customer logos */
/* Albums widget */
.album-cover {border:5px solid #ccc;}
.album-cover:hover {border:5px solid #f9d147;}
/* custom social links article */
.social-links {margin-top:5em;}
.social-links a {font-size:2rem;padding:1rem 2rem;}
/* end */

/* FAQ styles */

dl {
  column-count:1;
  column-gap:0;
}

/* breakpoint use ems not rems at 48em x 16px = 768px */ 
@media (min-width:48em) {

  dl {
    column-count: 2;
    column-gap: 6rem;
  }
  .fw dl {
    column-count: 3;
    column-gap: 6rem;
  }
}

dt {font-weight:bold;}
dt.subtitle {border-bottom: 2px solid #000;margin:2rem 0;}
dt.subtitle:first-child {border-bottom: 2px solid #000;margin:0 0 2rem 0;}
dd {margin-bottom:1rem;}

/* end FAQ */

/* columns */
.columns {
  column-count:1; 
  column-gap:3em;
  text-align:left;
}
/* breakpoint use em (not rem) at 62em x 16px = 992px */ 
@media (min-width:62em) {
  .columns {
    column-count:2; 
    column-gap:4em;
  }
}
/* breakpoint use em (not rem) at 75em x 16px = 1200px */ 
@media (min-width:75em) {
  .columns {
    column-count:3; 
    column-gap:4em;
  }
  .columns.two {
    column-count:2!important; 
    column-gap:4em;
  }
}
/* end columns */

/* me section */

.me-section {
  max-width: 100%;
  background-color: #fff;
  margin:4rem auto
}

.me-section.show-profile-section {
  margin-top: 7rem;
  max-width:100%
}

.assets-action-box {
  max-width: 100%;
  margin: 4rem auto;
  background-color:#fff
}
/* breakpoint use em (not rem) at 48em x 16px = 768px */ 
@media (min-width:48em) {
  .me-section {
    max-width: 48em;
  }
  .me-section.show-profile-section {
    max-width:48em;
  }
  .assets-action-box {
    max-width: 48em;
  }
}
/* alt index page */
div.vertical-line {
  width: 50%;
  height: 200px;
  border-right: 5px #ccc dashed;
  margin-bottom: 30px;
}

/* Feed icons */
.feed-asset-type-icon {
    display: none;
}

section.feed-view .asset .asset-name {
    justify-content: left;
    font-family:"museo-slab", serif;
    font-size:2rem;
}
.feed-view .asset-grid-name {
    font-family:"museo-slab", serif;
    font-size: 2rem;
}/* Layout and basic styles of Asset Detail Page 
.albums-section-title{
display: none;
}

.asset-page-wrapper {
padding: 6rem 10rem;
}

.asset-data{
margin-top: 1rem;
}

.asset-data,
.asset-buttons{
text-align: center;
}

.asset-info span:not(.asset-id, .asset-source):before {
content: ' | ';
}

.asset-source:before {
content: 'src: ';
}


.asset-tags-title,
.asset-type-title,
.asset-size-title,
.asset-filename-title,
.asset-dimensions-title,
.asset-type-value,
.asset-extension-title,
.asset-release-date,
.asset-created-at,
.asset-id-title,
.asset-licence-title,
.asset-word-count-title{
display:none;
}

.asset-licence-value:before{
content: ' -';
margin-right: 0.5rem;
}

.asset-licence-subtitle:after,
.asset-expiry-date-title:after,
.asset-created-at-title:after,
.asset-release-date-title:after,
.asset-credit-title:after,
.asset-usage-title:after{
content:':';
}

.AssetView .asset-title {
font-size: 2rem;
flex: 0 0 100%;
}

.asset-page-main .asset-type,
.asset-page-main .asset-size,
.asset-page-main .asset-extension,
.asset-page-main .asset-id{
width: 33%;
display: inline;
}

.asset-details-section {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}

.asset-details-section article {
flex: 1;
flex: 0 0 100%;
}

.asset-details-section .asset-type,
.asset-details-section .asset-size,
.asset-details-section .asset-dimensions,
.asset-details-section .asset-extension,
.asset-details-section .asset-id,
.asset-details-section .asset-word-count{
flex: 0 0 content;
}

.asset-type-icon,
.asset-license-icon,
.asset-expiry-date-icon,
.asset-created-at-icon,
.asset-release-date-icon,
.asset-credit-icon,
.asset-usage-icon,
.asset-reference-icon,
.asset-location-icon {
float: left;
margin-right: 1rem;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
}

.AssetView .asset-extension:before,
.AssetView .asset-id:before,
.AssetView .asset-size:before,
.AssetView .asset-dimensions:before,
.AssetView .asset-word-count:before{
content: ' | ';
margin-left: 0.5rem;
}

.AssetView .asset-id:before {
content: '#';
margin-right: -0.4rem;
}

/* Margins and paddings 
.AssetView .asset-details-section article {
margin-bottom: 1.2rem;
}

.asset-page-wrapper .section{
padding: 0;
}

.asset-proxy-section{
margin-right: 5rem
}

.asset-tags{
margin-top: 3rem;
}

/* added to solve tag wrapping 
.asset-tags-section .asset-tags a {
float:left;
}

.asset-term-of-use{
margin-top: 1rem;
}

.AssetView .asset-body {
margin-bottom: 1.8rem;
}

.asset-body p {
margin: 0;
}

.AssetView .asset-type-icon {
order: 2;
margin-bottom: 0.8rem;
flex: unset;
}

.AssetView .asset-name {
order: 1;
width: 100%;
}

.AssetView .asset-id {
order: 3;
}

.AssetView .asset-extension {
order: 4;
}

.AssetView .asset-word-count {
order: 4;
}

.AssetView .asset-size {
order: 5;
}

.AssetView .asset-dimensions {
order: 6;
}

.AssetView .asset-description {
order: 7;
}

.AssetView .asset-licence {
order: 8;
}

.AssetView .asset-terms-of-use {
order: 9;
padding-bottom: 1rem;
}

.AssetView .asset-expiry-date {
order: 10;
}

.AssetView .asset-release-date {
order: 11;
}

.AssetView .asset-created-at {
order: 12;
}

.AssetView .asset-credit {
order: 13;
}

.AssetView .asset-usage {
order: 14;
}

.AssetView .asset-reference {
order: 15;
}

.AssetView .asset-account {
order: 15;
}

.AssetView .asset-location {
order: 16;
}
.AssetView h1.asset-name {font-size:2em; width:100%;}

.asset-page-wrapper .breadcrumb-section {
display:none;
}

.proxy-preview {
width:100%;
max-height: 1280px;  
max-width:1280px;  
object-fit: contain;
align-content: center;
margin: 0 auto;
display: block;
}


/* posts

.asset-page-wrapper.post .asset-proxy-section,
.asset-page-wrapper.post .asset-details-section,
.asset-page-wrapper.post .asset-tags-section{
max-width: 90rem;
margin: auto;
width: 100%;
}

.asset-page-wrapper.post .asset-proxy-section {
margin-top:2rem;
}/*

/* Layout and basic styles of Asset Detail Page */
.albums-section-title{
  display: none;
}

.asset-page-wrapper {
  padding: 2rem 2em;
}
@media (min-width:768px) {
  .asset-page-wrapper {
    padding: 6rem 6em;
  }
}

.asset-data{
  margin-top: 1rem;
}

.asset-data,
.asset-buttons{
  text-align: center;
}

button.asset-action {color:#000;}

.asset-info span:not(.asset-id, .asset-source):before {
  content: ' | ';
}

.asset-source:before {
  content: 'src: ';
}

.asset-page-wrapper.post .asset-proxy-section,
.asset-page-wrapper.post .asset-details-section,
.asset-page-wrapper.post .asset-tags-section{
  max-width: 90rem;
  margin: auto;
  width: 100%;
}

.asset-page-wrapper.post .asset-proxy-section{
  margin-top:2rem;
}


.asset-tags-title,
.asset-type-title,
.asset-size-title,
.asset-filename-title,
.asset-dimensions-title,
.asset-type-value,
.asset-extension-title,
.asset-release-date,
.asset-created-at,
.asset-id-title,
.asset-licence-title,
.asset-word-count-title{
  display:none;
}

.asset-licence-value:before{
  content: ' -';
  margin-right: 0.5rem;
}

.asset-licence-subtitle:after,
.asset-expiry-date-title:after,
.asset-created-at-title:after,
.asset-release-date-title:after,
.asset-credit-title:after,
.asset-usage-title:after{
  content:':';
}

.AssetView .asset-title {
  font-size: 2rem;
  flex: 0 0 100%;
}

.asset-page-main .asset-type,
.asset-page-main .asset-size,
.asset-page-main .asset-extension,
.asset-page-main .asset-id{
  width: 33%;
  display: inline;
}

.asset-details-section {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.asset-details-section article {
  flex: 1;
  flex: 0 0 100%;
}

.asset-details-section .asset-type,
.asset-details-section .asset-size,
.asset-details-section .asset-dimensions,
.asset-details-section .asset-extension,
.asset-details-section .asset-id,
.asset-details-section .asset-word-count{
  flex: 0 0 content;
}

.asset-type-icon,
.asset-license-icon,
.asset-expiry-date-icon,
.asset-created-at-icon,
.asset-release-date-icon,
.asset-credit-icon,
.asset-usage-icon,
.asset-reference-icon,
.asset-location-icon {
  float: left;
  margin-right: 1rem;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
}

.AssetView .asset-extension:before,
.AssetView .asset-id:before,
.AssetView .asset-size:before,
.AssetView .asset-dimensions:before,
.AssetView .asset-word-count:before{
  content: ' | ';
  margin-left: 0.5rem;
}

.AssetView .asset-id:before {
  content: '#';
  margin-right: -0.4rem;
}

/* removed 10 Jun as now appears to be added as HTML by the server
.AssetView  .asset-placename:after,
.AssetView  .asset-city:after,
.AssetView  .asset-region:after {content:','}
*/

.AssetView .asset-latitude:before {
  content:'Latitude: ';
}
.AssetView .asset-longitude:before {
  content:'Longitude: ';
}

/* Margins and paddings */
.AssetView .asset-details-section article {
  margin-bottom: 1.2rem;
}

.asset-page-wrapper .section{
  padding: 0;
}

.asset-proxy-section{
  margin-right: 5rem
}

.asset-tags{
  margin-top: 3rem;
}

/* added to solve tag wrapping */
.asset-tags a {
  font-size: 1.2rem;
  line-height: 1.8rem;
  float: left;
  margin: 0 0.8rem 1.2rem 0;
}

.asset-term-of-use{
  margin-top: 1rem;
}

.AssetView .asset-body {
  margin-bottom: 1.8rem;
}

.asset-body p {
  margin: 0;
}

.AssetView .asset-type-icon {
  order: 2;
  margin-bottom: 0.8rem;
  flex: unset;
}

.AssetView .asset-name {
  order: 1;
  width: 100%;
}

.AssetView .asset-id {
  order: 3;
}

.AssetView .asset-extension {
  order: 4;
}

.AssetView .asset-word-count {
  order: 4;
}

.AssetView .asset-size {
  order: 5;
}

.AssetView .asset-dimensions {
  order: 6;
}

.AssetView .asset-description {
  order: 7;
}

.AssetView .asset-licence {
  order: 8;
}

.AssetView .asset-terms-of-use {
  order: 9;
  padding-bottom: 1rem;
}

.AssetView .asset-expiry-date {
  order: 10;
}

.AssetView .asset-release-date {
  order: 11;
}

.AssetView .asset-created-at {
  order: 12;
}

.AssetView .asset-credit {
  order: 13;
}

.AssetView .asset-usage {
  order: 14;
}

.AssetView .asset-reference {
  order: 15;
}

.AssetView .asset-account {
  order: 15;
}

.AssetView .asset-location {
  order: 16;
}

/* adds some separation to the related assets section in Portal */
.related-assets-section {
  border-top:1px dotted #ccc;
  margin-bottom:5em;
}

/* asset page layout */

.asset-page-wrapper .section.breadcrumb-section {padding:1em 0;}

.asset-page-wrapper {
  grid-template-areas: "breadcrumb breadcrumb breadcrumb" "proxy proxy proxy" "details details details"  "tags tags tags" "actions actions actions";
}
.asset-page-wrapper.post {
  grid-template-areas: "breadcrumb breadcrumb breadcrumb" "proxy proxy proxy" "tags tags tags" "actions actions actions";
}

.asset-proxy-section {
  margin-right: 0;
}

@media screen and (min-width: 36em) {
  .asset-page-wrapper .section.breadcrumb-section {padding:0;}
  .asset-page-wrapper {
    grid-template-areas: "breadcrumb actions actions" "proxy proxy details" "proxy proxy tags";
  }
  .asset-page-wrapper.post {
    grid-template-areas: "breadcrumb actions actions" "proxy proxy proxy" "tags tags tags";
  }
  .asset-proxy-section {
    margin-right: 5rem;
  }
}
/* stop right click save */
img.proxy-preview {
  pointer-events: none;
  -webkit-touch-callout: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}/* Sign Up Page styles */
.new-account-section .form-section {
    background-color:transparent;
    padding:0;
  }

.new-account-hint {font-size:2.5rem;}

.new-account-section .form-section form {
  background-color:antiquewhite;
  border-radius:1em;
  padding:1em;
}

/* breakpoint use em (not rem) at 75em x 16px = 1200px */ 
@media screen and (min-width: 75em) {
  .new-account-section .form-section {
    width: 33vw;
    min-width:30em;
    margin:1em auto;
    background-color:transparent;
  }
  .new-account-section .form-section form {
    background-color:antiquewhite;
    border-radius:1em;
    padding:2em;
  }
  .new-account-section .new-account-embeded-image {
    padding:3rem;
    max-width:40vw;
    width: 40vw;
  }
  .signup-faq {margin:2.5%; text-align:left!important; padding-top:1em;}
}
/* show hide mobile and desktop specific content */
/* breakpoint use em (not rem) at 62em x 16px = 992px */ 
@media (max-width:48em) {
  .mobile {display:block!important;}
  .desktop {display:none!important;}
}
@media (min-width:48.1em) {
.mobile {display:none!important;}
  .desktop {display:block!important;}
}
.bluebg {background-color:var(--light-blue);}
.purplebg {background-color:var(--light-purple); color:#000;}
.yellowbg {background-color:var(--light-yellow); color:#000;}

/* html section */
.html-section {
  width:100vw;
  padding-top:6rem;
  padding-left:2em;
  padding-right:2em;
  padding-bottom:6em;
}
.tight-bottom, .html-section.tight-bottom {padding-bottom:0.5rem;}
.tight-top, .html-section.tight-top {padding-top:0.5rem;}
.tight-left, .html-section.tight-left {padding-left:0;}
.tight-right, .html-section.tight-right {padding-right:0;}

.html-section img {margin:2em auto;}
.html-section p img {margin:0 auto;}
.html-section:first-child {padding-top:12rem;}

@media (min-width:768px) {
  .html-section {
    padding-left:6rem; 
    padding-right:6rem;  
  }
}  
@media (min-width:1040px) {
  .html-section {
    padding-left:6rem; 
    padding-right:6rem;  
  }
}  
@media (min-width:1200px) {
  .html-section {
    /*--padding-left:calc(50% - 550px); 
    padding-right:calc(50% - 550px);  --*/
    padding-left:20%;
    padding-right:20%;
  }
}  
/* @media (min-width:1600px) {
.html-section {
padding-left:calc(50vw - 720px); 
padding-right:calc(50vw - 720px);  
}
}  
@media (min-width:1920px) {
.html-section {
padding-left:calc(50% - 720px); 
padding-right:calc(50% - 720px);  
}  */

/* backgrounds */
.blackbg {
  background-color:#000;color:#fff!important;
}
@media (min-width:768px) {
  /*.blackbg {
    padding-bottom:5%!important;
    border-radius:0 0 60% 60% / 5%;
  }*/
}

.blackbg a.button {
  background-color: var(--purple);
  color: #fff;
}

.blackbg .button.reverse-button, .blackbg .reverse-button {
  border: 2px solid #fff;
  background-color: transparent;
  color:#fff;
  padding: 0.5em 1em;
}

.button.hollow-button, .hollow-button {
  border: 2px solid var(--purple);
  background-color: transparent;
  color:var(--purple);
  padding: 0.5em 1em;
}

.yellowbg,.credit-section {
  background-color:var(--light-yellow);
  padding-bottom: 5%!important;
  border-radius: 0 0 60% 60% / 5%;
}

.goldbg {
  background-color:var(--yellow);
  /* background-image:url('https://dwvt5wwshu97q.cloudfront.net/accounts/2/static_files/01GRT7P0M2NRMMM43PZ46SJB4F/kier-in-sight-shLU6SZfIQY-unsplash.jpg?v=63843136922');
  background-size:cover;
  background-repeat:no-repeat;*/
  padding-bottom: 5%!important;
  border-radius: 0 0 60% 60% / 5%;
}

h2.credit-assets-header {
  font-size:2em;
}

.silverbg {
  background-color: var(--silver);
  padding-bottom: 5%!important;
  border-radius: 0 0 60% 60% / 5%;
}

.common-cta-bg {
  background-color:var(--silver);
}  

/* full width section */
.fw {width:100vw;padding-left:0;padding-right:0;}
.fwfh {width:100vw;padding:0;}
.pad-top:{padding-top:4em;}
.padright {padding-right:4em;}
.padbottom {padding-bottom:4em;}
.padleft {padding-left:4em;}
.fw img {max-width:100%;}
.fw img.padded {max-width:80%; margin:auto;}
.wide {width:100vw;padding-left:6em;padding-right:6em;}
.narrow {width:60vw;padding-left:20vw;padding-right:20vw;}

/* full height section */
.fh {
  padding-top:0;
  padding-bottom:0;
}

/*. .vertical-line:after {
content:"";
display:block;
width:50%;
border-right:2px dashed #ccc;
height:10em;
margin:5em 0;
} */
/* two column grids used throughout site */
.two-col-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 2em;
  grid-row-gap:2em;
}
.two-col-grid article {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
}

@media (min-width:62em) {
  .two-col-grid {
    display:grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 6em;
    grid-row-gap:6em;
  }
  .two-col-grid h1, .two-col-grid h2 {
  }
}  
/* end 2 col grid */

/* one two column grids used throughout site */
.one-two-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 10em;
  grid-row-gap:4em;
}
.one-two-grid article {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
}

@media (min-width:62em) {
  .one-two-grid {
    display:grid;
    grid-template-columns: 1fr 2fr;
    grid-column-gap: 4em;
    grid-row-gap:4em;
  }
  .one-two-grid h1, .one-two-grid h2 {
  }
}  
/* end one two grid */

/* two + one column grids used throughout site */
.two-one-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 10em;
  grid-row-gap:4em;
}
.two-one-grid article {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
}

@media (min-width:62em) {
  .two-one-grid {
    display:grid;
    grid-template-columns: 2fr 1fr;
    grid-column-gap: 4em;
    grid-row-gap:4em;
  }
  .two-one-grid h1, .two-one-grid h2 {
  }
}  
/* end 2 col grid */

/* three column grids used throughout site */
.three-col-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 4em;
}
.three-col-grid article {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
}

@media (min-width:62em) {
  .three-col-grid {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 4em;
    grid-row-gap:4em;
  }
  .three-col-grid h1, .three-col-grid h2 {
  }
}  
/* end 3 col grid */

/* 4 column grids used throughout site */
.four-col-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 3em;
  grid-row-gap: 3em;
}
.four-col-grid article {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
}

@media (min-width:48em) {
  .four-col-grid {
    display:grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 4em;
    grid-row-gap: 4em;   
  }
  .four-col-grid h1, .three-col-grid h2 {
  }
}
@media (min-width:75em) {
  .four-col-grid {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-column-gap: 6em;
    grid-column-gap: 6em;
  }
  .four-col-grid h1, .three-col-grid h2 {
  }
}  

@media (min-width:100em) {
  .four-col-grid {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-column-gap: 6em;
    grid-column-gap: 6em;
  }
  .four-col-grid h1, .three-col-grid h2 {
  }
}  
/* end 4 col grid */

/* 5 column grids used throughout site */
.five-col-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 3em;
  grid-row-gap: 3em;
}
.five-col-grid article {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
}

@media (min-width:48em) {
  .five-col-grid {
    display:grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 4em;
    grid-row-gap: 4em;   
  }
  .five-col-grid h1, .three-col-grid h2 {
  }
}

@media (min-width:100em) {
  .five-col-grid {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-column-gap: 6em;
    grid-column-gap: 6em;
  }
  .five-col-grid h1, .three-col-grid h2 {
  }
}  
/* end 5 col grid */


/* pricing plans grid */
.plans-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 3rem;
  grid-row-gap:3rem;
}
article.plan {
  background-color:#eee;
  padding:3rem;  
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
}

.most-pop-plan {
  position:absolute;
  top:-1rem;
  border-radius:1rem;
}

.price, .start-for-free {
  margin:0;
  padding:0;
  line-height:1.3;
}
.annual-vs-monthly {
  margin:0;
  padding:0;
  font-size:0.7em;
}

#one-price-plan {
  padding-bottom:0;
}
#add-ons {
  padding-top:0;
}  

.plan ul, .before ul {padding:0;}
.plan ul li, .before ul li {
  list-style: none;
}
.plan ul li.divider {
  margin-bottom:1em;
  border-bottom:1px dashed #000;
}

.plan ul li:before {
  content: '\2713';
  color:green;
  padding-right:0.5em;
} 

.plan ul li.divider:before {
  content: '';
}

.before ul li:before,
ul.not li:before, 
.plan ul li.strike:before {
  content: '\2717';
  padding-right: 0.6em;
  color:red;
}

.plan ul li.addon:before {
  content: '+';
  padding-right: 0.6em;
  color:black;
}
.plan ul li.tier:before {
  content: '\2217';
  padding-right: 0.6em;
  color:black;
}

@media (min-width:768px) {

  .plan ul li, .before ul li {font-size:0.8em;}
  .plan .small, .before .small {margin-bottom:0.3em;}
  .price small {font-size:0.6em!important;}

  .plans-grid {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 1rem;
  }
  .plans-grid.add-ons {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 1rem;
  }
  .plans-grid article, article.free-plan {
    background-color:#eee;
    padding:3rem;  
  }
  .plans-grid article.before {
    background-color:#fff;
    border:0px solid #ccc;
    padding:3rem;  
  }
  #one-price-plan {
    padding-top:10em;
    padding-bottom:0;
  }
  #add-ons {
    padding-top:0;
  }
}
/* end pricing grid */

/* feature grid used on bk2 page */
.feature-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 4rem;
  grid-row-gap: 4rem;
}
.feature-grid article {
  background-color:var(--bgYellow);
  padding:1rem;  
  display:grid;
  text-align:center;
  grid-auto-rows: minmax(min-content, max-content);
  text-align:left;
}
.feature-grid article.new-feature {
  background-color:var(--bgPurple);
}
.feature-grid article.new-feature:before {
  display:block;
  content:'New in Bk2';
  position: relative;
  text-align:right;
  color:red;
  font-weight:700;
  padding:0 1rem;
  border:1px dotted red;
  border-radius:2rem;
  width:fit-content;
  margin:1rem 0 auto auto;
}

.feature-grid article h2 {
  font-size:3rem;
}
.feature-grid article p {}

.feature-grid article span.feature-icon {
  width:100%;
  display:block;
  margin-bottom:2rem;
}

.feature-icon svg {
  max-width: 4rem;
  max-height: 4rem;
  vertical-align: bottom;
  margin: 0 1rem 0 0;
}

span.feature-name {font-weight:700;}

@media (min-width:48em) {
  .feature-grid {
    grid-template-columns: 1fr 1fr;  
  }
}
@media (min-width:62em) {
  .feature-grid {
    grid-template-columns: 1fr 1fr 1fr;  
  }
}
@media (min-width:75em) {
  .feature-grid {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;  
  }
}
/* end feature grid */

/* quotes grid used on bk2 page */
.quotes-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 4rem;
  grid-row-gap: 4rem;
}
.quotes-grid blockquote {
  padding:1rem;  
  display:grid;
  text-align:left;
  grid-auto-rows: minmax(min-content, max-content);
  font-size: 2rem;
  font-style: italic;
  font-weight: 400;
}
.quotes-grid blockquote cite {
  font-size: 1.5rem;
  margin-top:1rem;
}

@media (min-width:768px) {
  .quotes-grid {
    grid-template-columns: 1fr 1fr;  
  }
}
@media (min-width:992px) {
  .quotes-grid {
    grid-template-columns: 1fr 1fr 1fr;  
  }
}
@media (min-width:1200px) {
  .quotes-grid {
    grid-template-columns: 1fr 1fr 1fr;  
  }
}
@media (min-width:1600px) {
  .quotes-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media (min-width:1900px) {
  .quotes-grid {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}
/* end quotes grid */

/* solutions */
.solution-tiles {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 3em;
  grid-row-gap: 6em;
  list-style:none;
}
.solution-tiles li {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
  list-style:none;
  margin-bottom:2em;
}
.solution-tiles a {
  text-decoration:none;
} 

@media (min-width:48em) {
  .solution-tiles {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 3em;
    grid-row-gap: 3em;   
  }
  #studies .solution-tiles {
    grid-template-columns: 1fr 1fr 1fr;   
  }
}

@media (min-width:100em) {
  .solution-tiles {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 3em;
    grid-column-gap: 3em;
  }
  #studies .solution-tiles {
    grid-template-columns: 1fr 1fr 1fr;
  }
}  
/* end solutions */

/* customer logos grid */

.customer-logos-grid {
  display:grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 2em;
  grid-row-gap: 2em;
  padding:0 4em;
}
.customer-logos-grid a {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
}

@media (min-width:48em) {
  .customer-logos-grid {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;  
  }
}

@media (min-width:62em) {
  .customer-logos-grid {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  }
}  

/* feature card grid used throughout site */
.feature-card-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 0;
  grid-row-gap: 0;
}
.feature-card-grid article {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
}
.feature-card-grid article .title {padding:1em;}

.feature-card-grid article .details {
  padding:1em;
}

@media (min-width:48em) {
  .feature-card-grid {
    display:grid;
    grid-template-columns: 1fr 1fr;
  }
}

@media (min-width:100em) {
  .feature-card-grid {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  }
}  

.feature-card {
  background-color: #444;
  color:#fff; 
  overflow:hidden;
}
.feature-card:nth-child(2) {
  background-color: #555;
}
.feature-card:nth-child(3) {
  background-color: #666;
}
.feature-card:nth-child(4) {
  background-color: #777;
}

.feature-card .image-card {
  aspect-ratio:3/4;
}

.feature-card:hover img {
  -webkit-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05);
  -webkit-transform-origin: right;
  -ms-transform-origin: right;
  transform-origin: right;
  -webkit-transition: -webkit-transform .3s ease;
  transition: -webkit-transform .3s ease;
  -o-transition: transform .3s ease;
  transition: transform .3s ease;
  transition: transform .3s ease,
    -webkit-transform .3s ease;
  overflow:hidden;
}

/* feature well */
.well {
  background-color: #eee;
  padding:1em;
  border-radius:1em;
}

/* editions grid */
.editions-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 3em;
  grid-row-gap: 3em;
}
.editions-grid article {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
}
.editions-grid article h2 {
	font-size:2em;
}
.editions-grid article .button {
	width:100%;
}

@media (min-width:48em) {
  .editions-grid {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 2em;
    grid-row-gap: 2em;   
  }
  .editions-grid article {
    background-color:#eee;
    border-radius:0.5em;
    padding:2em;
  }
}
/* end editions col grid */

/* badges grids used throughout site */
.badges-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 1em;
}
.badges-grid article {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
}
.badges-grid img {max-width:200px;} 

@media (min-width:62em) {
  .badges-grid {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 1em;
    grid-row-gap:1em;
    max-width:35em;
  }
}  
/* end badges grid *//* features tour controls */

@media (max-width:768px) {
  #tour-controls {
      display:none;
  }
}
@media (min-width:769px) {
  #tour-controls {
display:block;
}
  .features-control {
  display: block;
  position: fixed;
  top: calc(50vh - 30px);
  z-index: 103;  
  }
  .features-control--prev {
  left: -2px;  
  }
  .features-control--next {
  right: -2px;
  }
  .features-control a svg path {
    fill:var(--purple);
  }
  .features-control a svg#casual-arrow-right path {
    fill:#333;
  }
 }

.big-feature-list {
  line-height:2;
  padding-inline-start: 1em; 
  padding-left:1em;
}
.big-feature-list li:after {
  content: '.';
}
.big-feature-list a, .big-feature-list b {
  font-family: 'Inter',serif;
  font-weight: bold;
  font-style: normal;
}
@media (min-width:769px) {
  .big-feature-list {
    line-height:2;
    padding-left:0;
  }
  .big-feature-list.horizontal-list li {
    list-style: none;
    display: inline;
  }
  .big-feature-list.horizontal-list li:after {
  content: '; ';
  }
  .big-feature-list.horizontal-list li:last-child:after {
    content: '.';
  }
}
#next-up a, #next a {
	color:var(--purple)
}.video-container {
  width:100%;
  min-height:40%;
  background-color:var(--purple);
}
/* indent post and tags from Credit on post page */
.proxy-body.post {
    padding-top: 0;
    padding-left:2em;
}
.asset-page-wrapper.post .asset-tags {
    margin-top: 2em;
    padding-left: 2em;
}
/* end */

.proxy-body.post img {
    width:auto;
  	max-width:100%;
    margin:inherit auto;
}	
.proxy-body.post hr.thin {
	margin: 4em;
    width:auto;
  	border-top-style: dashed;
}
li {margin-bottom:1em;}

.post table {
	width:100%;
}
.post table tr td {
  border-bottom:1px solid #ccc;
}

.credit-avatar-thumbnail {
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #efefef;
    height: 7.5rem;
    width: 7.5rem;
    margin-top: -0.5em;
}

/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
  font-weight:normal;
  font-size:1.5rem;
  width: 30rem;
  height:auto;
  background-color: #8246af;
  color: #fff;
  text-align: left;
  padding: 2em;
  border-radius: 2em;
  
  /* Position the tooltip text - see examples below! */
  position: absolute;
  bottom:4.5em;
  left:-50%;
  margin-left:-115px;  
  z-index: 1;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
  visibility: visible;
 
}
/* tooltip arrows */
.tooltip .tooltiptext::after {
  content: " ";
  position: absolute;
  top: 100%; /* At the bottom of the tooltip */
  left: 50%;
  margin-left: -10px;
  border-width: 10px;
  border-style: solid;
  border-color: #8246af transparent transparent transparent;
}
.bk-wall.bk-wall-share {
  margin:7em auto;
  background-color:#ffffffee;
}

@media screen and (min-width: 48em){
  .bk-wall {margin: 15rem 4rem 4rem;}
  .bk-wall.bk-wall-share {
    margin:10em auto;
    background-color:#ffffffee;
  }
}
.dropdown-content svg.icon {width:1em;height:1em;}.marketing-nav {
  display:flex;
  flex-direction: row;
  justify-content: space-between;
  background-color: var(--purple);
  color:#fff;
  text-align: left;
  padding:0;
  margin:0;
}
.marketing-nav img.logo {
  max-width:20rem;
  margin:0;
  padding:0;
}
.marketing-nav .menu {
  display: flex;
  flex-direction: row;
  align-items: center;
  column-gap: 2.4rem;
  height:fit-content;
  background-color:transparent;
  padding:1em;
}
.marketing-nav .menu a {
  text-transform: uppercase;
  font-weight: 400;
  font-size: 1.6rem;
  text-decoration: none;
  color: white;
}
.marketing-nav .menu a.nav-button {
  background-color:white;
  color:var(--purple);
}
.marketing-nav svg.caret-down-icon path {stroke: #fff;}/* carousel */

section.carousel-section {    
  position: relative;    
  line-height: 0;    
  height: 100%;    
  padding: 0;    
}

/* image overlay 
section.carousel-section .carousel-slide::after {
  content: '';
  background: linear-gradient(360deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,.2) 100%);
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
}
*/

.carousel-container {    
  display: flex;    
  transition: transform 1s ease;
} 

.carousel-slide {    
  flex: 0 0 100%; /* Ensure each slide takes full width */
  position: relative;
}

.carousel-slide img {    
  width: 100%;
  margin: 0 auto;
  filter: drop-shadow(10px 10px 10px rgba(130, 70, 175, 0.4));
}

/* left and right navigation (hidden) */
.prev,.next {    
  position: absolute;    
  top: 0;    
  background-color: red;    
  cursor: pointer;    
  height: 94.5%;    
  width: 10%;    
  z-index: 2;    
  opacity: 0;
}

.prev {    
  left: 0;
}

.next {    
  right: 0;
}

/* slide indicators */
.carousel-dots {  
  position: absolute;  
  bottom: 10%;   
  left: 50%;  
  transform: 
  translateX(-50%); /* Corrects horizontal centering */
  z-index: 2;
}

.dot {    
  display: inline-block;    
  width: 10px;    
  height: 10px;    
  background-color: #ccc;    
  border-radius: 50%;    
  margin: 0 5px;    
  cursor: pointer;
}

/* active slide indicator */
.dot.active {    
opacity: 100%;
}

/* inactive slide indicator */
.dot:not(.active) {    
opacity: 50%;
}

.carousel-slide .caption {
  position: relative;
  bottom: 4rem;
  left: 4rem;
  padding-top:2em;
  z-index: 2;
  text-decoration: none;
  color: #fff;
  opacity: 0.7;
  margin-bottom: 1em;
  font-size:0.8em;
}

.carousel-hero-text {
  position: relative;
  width: 100%;
  margin-top: calc(-100vw / 3);
  height: calc(100vw / 3);
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-align: center;
  z-index: 1;
  line-height: 1.6;
}

@media screen and (min-width: 62em){
  .carousel-hero-text {
    display: flex;
  }
}section#chatbot . {padding 0;margin:0;}

#chatbot.html-section {
    width: auto;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}a.review-badge img {width:100%; max-width: 125px;}
.asset-modal-details .asset-tags {display:none;}

/*second CTA button no longer needed */
.portal-modal .modal .asset-call-to-action {
    margin-bottom: .8rem;
    display: flex;
    align-items: flex-start;
    width: 100%;
  display:none;
}
/* Modal overlay */
  .subscribe-modal, .demo-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5); /* semi-transparent dark overlay */
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
  }
  /* Modal content styling */
  .subscribe-modal-content, .demo-modal-content {
    position: relative; /* to position the close button */
    background-color: #8246af; /* purple background */
    color: #fff;              /* white text */
    padding: 20px;
    border-radius: 8px;
    text-align: center;
    width: 800px;
    max-width:90%;
    box-sizing: border-box;
  }

.demo-modal-content
	{
      background-color: #ffd100; /* yellow background */
      color:#000;
	}
  /* Close button styling */
  .close-btn {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 24px;
    font-weight: bold;
    color: #fff;
    cursor: pointer;
  }

.demo-modal-content .close-btn {
	color: #000;
}
  /* Subscribe button styling */
  .subscribe-btn {
    display: inline-block;
    background-color: green;
    color: #fff;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 4px;
    margin-top: 15px;
  }

/* set font size for download modal Licennce text */
.download-modal-content {
	font-size:1.6rem;
    line-height:inherit;
    margin-bottom:1em;
}
.asset-card-licence-value {margin-bottom:1em;}
.asset-card-licence {font-weight:bold;}
.asset-card-credit {margin-top:1em;}.bk-wall-share .logo, .bk-wall-transfer .logo {
    max-height: 16rem;
    margin: 0 auto;
    display: block;
}
 h1.transfer-title,h1.share-title {font-size:3.5rem;}
.me-section h1 {font-size:4rem;}/* body {background-color:#eee;}*/
.brand-mood-board .search-section {display:none;}
.brand-mood-board .page-actions {display:none;}
.logo-canvas {
  width: 100%;
  height: auto;
}
@media (min-width:48em) {
  .two-thirds {max-width:66%; margin-bottom:4em; text-align:center;}
  .two-thirds:nth-child(odd) {margin-left:33%; border-top:1px dashed #ccc;border-bottom:1px dashed #ccc;}
  .third {max-width:33%;margin-bottom:3em;}
  .third:nth-child(odd) {margin-left:66%;}
}

.guide {padding-top:0;padding-bottom:0;}
/*.guide:last-child {margin-bottom:5em;}*/
/*  styling details and summary elements */
details {background-color:#efefef; padding:1em; margin-bottom:1em;}
details summary {
  list-style:none;
  display:flex;
  justify-content:space-between;
  font-size:3rem; 
  font-weight:bold;
}
details summary::-webkit-details-marker {display:none;} 
details summary::after {
  content:'+';
  transition:0.2s;
}
details[open] summary::after {
  content:'-';
  transition:0.2s;
}
detail summary::marker {list-style-type: "+"}
details[open] summary::marker {{list-style-type: "-"}}

.colour-swatches article {
  text-align: center;
}
span.swatch {
  width: 100%;
  aspect-ratio: 4/3;
}
.color-grid article {
  text-align:center;
  border:1px solid #ccc;
}
/* swatch colours */
.yellow {background-color: #FFD700;}
.blue {background-color: #87CEEB;}

.color-spec {background-color:#fff; border:1px solid #000;}
.color-spec .canvas {padding:5%;}
.color-spec .text {font-size:0.8em;}
.color-spec .name {padding:5%; text-align:center;}

.color-spec.black .canvas {background-color: #000;}
.color-spec.black .text {color: #fff;}
.color-spec.black .name {color: #000;}

.color-spec.purple .canvas {background-color: #8246af;}
.color-spec.purple .text {color: #fff;}
.color-spec.purple .name {color: #000;}

.color-spec.yellow .canvas {background-color: #ffd100;}
.color-spec.yellow .text {color: #000;}
.color-spec.yellow .name {color: #000;}

.color-spec.silver .canvas {background-color: #f8f8f8;}
.color-spec.silver .text {color: #000;}
.color-spec.silver .name {color: #000;}

.color-spec.light-yellow .canvas {background-color: #eee7f4;}
.color-spec.light-yellow .text {color: #000;}
.color-spec.light-yellow .name {color: #000;}

.color-spec.light-purple .canvas {background-color: #fff8dc;}
.color-spec.light-purple .text {color: #000;}
.color-spec.light-purple .name {color: #000;}


/* .guideline-details img {max-width:50%; margin:0 auto;} */
.guideline-answer {padding:1em 2em;}

.guideline-answer ul, .guideline-answer ol {
    margin: inherit;
    padding-left: inherit;
}iframe {border:0;}div.bk-embed-container {} /*--Gallery container--*/

span.bk-embed-heading {
  font-family: "museo-slab", serif;
  font-size:3rem; 
  font-weight: 900;
  font-style: normal;
  line-height: 2;
  margin-top: 1em;
  margin-bottom: 1em;} /*--Gallery Heading text--*/

span.bk-embed-footer {} /*--Gallery Footer text--*/
.credits-viewport {
  height: 520px;
  overflow: hidden;
  position: relative;
  background: transparent;
}

.credits-viewport::before,
.credits-viewport::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  height: 80px;
  z-index: 2;
  pointer-events: none;
}

/* .credits-viewport::before { top: 0; background: linear-gradient(to bottom, #000, transparent); }
.credits-viewport::after  { bottom: 0; background: linear-gradient(to top, #000, transparent); }
*/

.credits-track {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 120px 48px 120px;
  text-align: center;
  animation: bk-scroll 90s linear forwards;
  opacity: 0.6;
}

.credits-track:hover { animation-play-state: paused; }

@keyframes bk-scroll {
  0%   { transform: translateY(0); }
  100% { transform: translateY(calc(-100% + 520px)); }
}

.credits-track h1,
.credits-track h2,
.credits-track h3,
.credits-track h4,
.credits-track h5,
.credits-track h6,
.credits-track p,
.credits-track hr { width: 100%; max-width: 480px; }

.credits-track hr {
  border: none;
  border-top: 1px solid rgba(255,255,255,0.1);
  margin: 48px auto;
}

.credits-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 14px 0;
}