body {
  --ai-dark: #103050;
  --ai-light: #B09050;
  --ai-link: #907040;
  font-family: 'Noto Sans',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif !important;
  color: #103050;
}

h1, h2, h3, p {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  font-weight: normal;
}

h1 {
  font-size: 350%;
}

h2 {
  font-size: 250%;
}

h3 {
  font-size: 170%;
}

b, strong {
    font-weight: bold;
}

li {
  text-align: left;
}

img, iframe {
  max-width: 100%;
  max-height: 100%;
}

img.lazy {
  visibility: hidden;
}

img.lazy.loaded {
  visibility: visible;
}

.form-group textarea {
  width: 100%;
  border: 1px solid #cccccc;
}

.landing ul {
  list-style: none;
  margin: 1em 0 1em 0.9em;
  padding: 0;
}

.landing li {
  padding: 0.19em;
  padding-left: 1em;
  text-indent: -0.9em;
  text-align: left;
}

.currency {
  display: none;
}

/*
.language-menu > li {
  display: inline-block;
  padding: 0;
}

.language-menu {
  padding-left: 0;
  margin-bottom: 0;
}

.language {
  display: inline-block;
  padding: 0 10px;
}

.language a {
  line-height: 80px;
  color: #d1bb90;
}

.language a:hover {
  color: var(--ai-light);
}

.language li:nth-child(n+2) a {
  border-left: 1px solid #d1bb90;
}

.language li.active a {
  font-weight: bold;
  color: var(--ai-light);
}

.language li a {
  padding: 0 10px;
}

.language li:first-of-type a {
  padding-left: 0;
}
*/

.block .container:not(:empty) {
  padding-top: 4em;
  padding-bottom: 4em;
  text-align: center;
}

.btn,
.btn:link,
.btn:visited {
  display: inline-block;
  text-transform: uppercase;
  font-weight: bold;
  margin: 1em auto;
  padding: 0.75em;
  min-width: 16em;
  max-width: 20em;
  width: 100%;
  background-color: #103050;
  border: solid 1px #103050;
  color: #FFFFFF;
}

.btn:hover {
  background-color: transparent;
  border: solid 1px #103050;
  color: #103050;
}

.btn-group {
  margin: 0 auto;
}

.block h3 {
  margin-left: auto;
  margin-right: auto;
}

p.lead {
  max-width: 34em;
  text-align: center;
  font-size: 175%;
  margin: 16px auto;
}

.block-text {
  max-width: 45em;
  text-align: left;
  font-size: 120%;
  margin: 16px auto;
}

.block-text a {
  color: var(--ai-link);
  text-decoration: underline;
}

figure.image {
  text-align: center;
}

figure.image img {
  margin: 2.25em auto;
}

.gallery-item img, .gallery-item picture {
  max-width: 100%;
  width: auto;
  height: auto;
}

.numbers, .numbers h2 {
  text-align: center !important;
}

.numbers img.star {
  vertical-align: baseline;
  height: 0.75em;
  width: 0.75em;
}

.number {
  font-size: 250%;
}


.welcome-box .box-detail {
  display: inline-block;
  margin: 3em 3.5%;
  width: 15em;
}

.welcome-box .box-detail .detail-image {
  height: 5em;
}


@media(max-width: 420px) {
  h1 {
    font-size: 250%;
  }

  h2 {
    font-size: 200%;
  }

  h3 {
    font-size: 150%;
  }
}


/* Navigation */

header.navbar {
  position: fixed;
  box-shadow: none;
  border-bottom: 1px solid var(--ai-light);
  width: calc(100% - 20px);
  margin: 0 10px;
  z-index: 10;
}

header.navbar > .container {
  max-width: 100%;
  width: 100%;
}

.navbar-mainnavigation .navbar-brand-image {
  height: 100%;
  padding: 0;
}

.navbar-mainnavigation .navbar-brand-image > .navbar-brand-logo-normal {
  display: block;
  max-height: 100%;
  transform: none;
  margin: 0;
  top: 0;
}

.navbar-mainnavigation .navbar-nav:first-of-type {
  align-items: center;
  width: 100%;
}

.navbar-mainnavigation .navbar-nav .dropdown-menu {
  width: 100%;
}

.navbar-mainnavigation .navbar-nav .nav-item {
  width: 100%;
}

.navbar-mainnavigation .navbar-nav .nav-item.active {
  background-color: #103050;
}

.navbar-mainnavigation .navbar-nav .nav-link {
  color: #103050;
}

.navbar-mainnavigation .navbar-nav .nav-item.active .nav-link {
  color: #ffffff;
}

.navbar-mainnavigation .navbar-nav > li > .nav-link:hover {
  color: var(--ai-light);
}

.navbar-mainnavigation .navbar-nav > li > .nav-link::before,
.navbar-mainnavigation .navbar-nav > li.active > .nav-link::before,
.navbar-mainnavigation .navbar-nav > li > .nav-link:hover::before,
.navbar-mainnavigation .navbar-nav > li > .nav-link:focus::before {
  opacity: 0;
}

.navbar-mainnavigation .navbar-nav .nav-link[title="Star Repo"] {
    padding: 0.25rem 0.75rem;
    background-color: #e02020;
    color: #ffffff;
    margin: auto;
    width: fit-content;
}

.navbar-mainnavigation .navbar-nav .nav-link[title="Star Repo"]:hover {
  color: #103050;
}

@media (min-width: 992px) {
  .navbar-mainnavigation .navbar-nav .nav-item {
    text-align: center;
  }
  .navbar-mainnavigation .navbar-nav .nav-link {
    display: block;
  }
}


/* Common elements */

video {
  max-width: 100%;
}

.card {
  border: none;
  color: #103050;
}

a, .card-body a:not(.btn) {
  color: var(--ai-link);
}

.accordion-body {
  text-align: left;
}

div.block:nth-of-type(2n) {
  background-color: #ffffff;
}

.head .headicon,
.landing .headicon {
  display: block;
  font-size: 200%;
  color: var(--ai-light);
  text-shadow: -4px 3px #c2e0ff;
}

.head h2,
.landing h2,
.landing .header {
  text-transform: uppercase;
  font-weight: bold;
  font-size: 133%;
  margin: 2em 0;
}

.landing a:hover, .landing a:focus {
  text-decoration: none;
}

.landing .btn, .landing .btn:link, .landing .btn:visited {
  font-weight: bold;
  margin: 1em auto;
  padding: 0.75em;
  margin: 0.5em;
  min-width: 8em;
  max-width: 11.5em;
  background-color: #103050;
  border: solid 1px #103050;
}

.landing .btn:hover {
  background-color: #ffffff;
  border: solid 1px #103050;
  color: #103050;
}

.landing img.screen,
.landing .screen {
  max-width: 800px;
  width: 100%;
}


/* Welcome */

.landing.welcome .logo {
  display: block;
  margin: 2.5em auto;
  width: auto;
  max-width: 100%;
}

.landing.welcome h1 {
  text-transform: uppercase;
  font-size: 250%;
}

.landing.welcome h2.claim {
  font-size: 150%;
  margin-bottom: 2.5em;
  text-transform: none;
}

.landing .btn-landing, .landing .btn-landing:link, .landing .btn-landing:visited {
  display: block;
  margin: 1em auto;
  min-width: 12em;
  max-width: 16em;
  padding: 0.75em 1em;
  background-color: var(--ai-link);
  border: solid 1px var(--ai-link);
}

.landing .btn-landing:hover {
  background-color: #ffffff;
  color: var(--ai-light);
}

.landing.welcome .screens {
  height: 20em;
}

.landing.welcome img.screen {
  display: none;
  margin: auto;
  max-width: 37.5em;
  max-height: 350px;
}

.landing.welcome .screen {
  max-width: 37.5em;
  max-height: 350px;
  margin: auto;
}

.landing.welcome .screen img {
  display: block;
  margin: auto;
  width: 100%;
  max-width: 37.5em;
  transform: translateY(-50%);
  position: relative;
  top: 50%;
}

.landing.welcome .screen.active {
  display: block;
}

/* Users */

.landing.users {
  background-color: #eaedef;
}

.landing.users .userlogo {
  display: inline-block;
  width: 20%;
}

.landing.users .userlogo img {
  max-width: 100%;
  max-height: 80px;
}


/* How it works */

.landing.explain video {
  box-shadow: 2em 2em 2em #D0D0D0;
}

a.explain {
  margin-top: 2em !important;
}


/* Highlights */

ul.highlight {
  list-style-type: none;
  margin: 0 auto;
  padding: 0;
}

ul.highlight li {
  padding: 0.25em;
  padding-left: 2em;
  text-indent: -2em;
}

ul.highlight li:before {
  font: normal normal normal 14px/1 FontAwesome;
  content: "\f17d";
  padding-right: 0.5em;
  font-size: 133%;
  color: var(--ai-light);
}

.landing.highlights ul.highlight {
  padding-left: 2em;
  max-width: 45em;
}

.landing.highlights ul.highlight li {
  font-size: 133%;
  padding: 0.5em;
}


/* Highlights with image */

.highlight-image {
  text-align: left;
  padding: 3em 0;
  clear: both;
}

.highlight-image h3 {
  font-size: 140%;
  font-weight: bold;
  margin: 1.25em 0;
}

.highlight-image .header {
  font-size: 120%;
  font-weight: bold;
  margin: 1.25em 0;
}

.highlight-image p {
  font-size: 120%;
}

.highlight-image img {
  max-width: 20em;
  width: 100%;
}

.highlight-image:nth-of-type(2n+1) img {
  margin-right: 2em;
  float: left;
}

.highlight-image:nth-of-type(2n) img {
  margin-left: 2em;
  float: right;
}

@media(max-width: 575px) {
  .highlight-image img {
    float: none !important;
    display: block;
    margin: auto;
  }
}


/* Trust */

.landing.qualities a {
  display: block;
  padding: 1.5em 0;
}

.landing.qualities .quality img {
  height: 4rem;
}

.landing.qualities .header {
  max-width: 25rem;
  padding: 1rem 0;
  margin: 1.5rem auto;
  border-bottom: 1.25px solid var(--ai-light);
}

.landing.qualities .stars {
  margin: 2rem 0;
  font-weight: bold;
  font-size: 120%;
  color: var(--ai-link);
}

.landing.qualities .stars .fa {
  font-size: 120%;
}

.landing.qualities .number {
  font-size: 100%;
  font-weight: normal;
  margin-left: 1rem;
  color: #103050;
}

.landing.qualities .button {
  display: inline-block;
  border: 1px solid var(--ai-light);
  text-transform: uppercase;
  font-weight: bold;
  padding: 0 0.5rem;
  color: #103050;
}

@keyframes landing-trust-button {
  from { background-color: #ffffff; }
  to { background-color: var(--ai-light); }
}

.landing.qualities a:hover .button {
  animation-name: landing-trust-button;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
  animation-duration: 1s;
  background-color: var(--ai-light);
  color: #ffffff;
}


/* Distributions */

.landing.dists a {
  display: block;
  padding: 1.5em 0;
}

.landing.dists .dist img {
  height: 10rem;
}

.landing.dists .header {
  max-width: 25rem;
  padding: 1rem 0;
  margin: 1.5rem auto;
  border-bottom: 1.25px solid var(--ai-light);
}

.landing.dists .button {
  display: inline-block;
  border: 1px solid var(--ai-light);
  text-transform: uppercase;
  font-weight: bold;
  padding: 0 0.5rem;
  color: #103050;
}

@keyframes landing-dists-button {
  from { background-color: #ffffff; }
  to { background-color: var(--ai-light); }
}

.landing.dists a:hover .button {
  animation-name: landing-dists-button;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
  animation-duration: 1s;
  background-color: var(--ai-light);
  color: #ffffff;
}


/* Demo */

.landing.demo .header {
  text-transform: none;
  line-height: 1.5;
  margin: 2em;
  margin-top: 3em;
  font-size: 150%;
}

.landing.demo .buttons {
  margin: 2em 0;
}

.landing.demo img {
  width: 100%;
}


/* Case studies */

.casestudies .casestudy {
  font-size: 100%;
  padding: 1%;
  margin: 0 1%;
}

.casestudies .casestudy .image {
  margin: 0;
}

.casestudies .casestudy img {
  width: 100%;
}

.casestudies .casestudy .text {
  padding-bottom: 2%;
  padding-top: 2%;
}

.casestudies .casestudy .description {
  padding: 0.5em 0;
}

.casestudies .casestudy .segment,
.casestudies .casestudy .url,
.casestudies .casestudy h3 {
  color: #103050;
}

.landing.casestudies .casestudy {
  display: none;
}

.landing.casestudies .casestudy.active {
  display: flex;
}

.landing.casestudies .indicators {
  display: inline-block;  
  padding: 0;
  margin: 0;
}

.landing.casestudies .indicators li {
  display: inline-block;
  padding: 0.5em;
  text-indent: 0;
  cursor: pointer;
}

.landing.casestudies .indicator a {
  width: 1.5em;
  height: 1.5em;
  border: 1px solid var(--ai-light);
  display: inline-block;
  border-radius: 50%;
}

.landing.casestudies .indicator.active a {
  background-color: var(--ai-light);
}


/* Showcases */

.landing.showcases .showcase {
  font-size: 100%;
  display: none;
  padding: 2em;
  margin: 0 2%;
}

.landing.showcases .showcase.active {
  min-height: 315px;
  display: flex;
}

.landing.showcases .showcase .image {
  margin: 0;
}

.landing.showcases .showcase .image a {
  padding-top: calc(530 / 914 * 100%);
  position: relative;
  display: block;
}

.landing.showcases .showcase img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.landing.showcases .showcase .text {
  padding-bottom: 4%;
  padding-top: 4%;
}

.landing.showcases .showcase .segment,
.landing.showcases .showcase .url,
.landing.showcases .showcase h3 {
  color: #103050;
}

.landing.showcases .showcase hr {
  border-top: 1px solid var(--ai-light);
  width: 10em;
}

.landing.showcases .showcase:hover hr {
  width: 15em;
}

.landing.showcases .showcase .url {
  font-size: 100%;
}

.landing.showcases .showcase .segment,
.landing.showcases .showcase h3 {
  text-transform: uppercase;
  font-weight: bold;
  font-size: 120%;
  margin-bottom: 1em;
}

@media(max-width: 575px) {
  .landing.showcases .showcase .box {
    font-size: 80%;
  }
}

.landing.showcases .indicators {
  display: inline-block;  
  padding: 0;
  margin: 0;
}

.landing.showcases .indicators li {
  display: inline-block;
  padding: 0.5em;
  text-indent: 0;
  cursor: pointer;
}

.landing.showcases .indicator a {
  width: 1.5em;
  height: 1.5em;
  border: 1px solid var(--ai-light);
  display: inline-block;
  border-radius: 50%;
}

.landing.showcases .indicator.active a {
  background-color: var(--ai-light);
}


/* Integrations */

.landing.integrations .integration {
  display: inline-block;
  width: 7.5em;
  margin: 1em;
}

.landing.integrations .integration-logo {
  max-width: 90%;
  max-height: 5em;
}

  
/* Links */

.landing.links {
  padding: 4em 0 2em 0;
}

.landing.links .link {
  display: inline-block;
  border: 1px solid #103050;
  border-radius: 50%;
  font-size: 125%;
  color: #103050;
  margin: 2em;
  width: 10em;
  height: 10em;
  padding: 1em;
  line-height: 3;
  font-weight: bold;
  text-transform: uppercase;
}

.landing.links .link i.fa {
  font-weight: normal;
  font-size: 450%;
  display: block;
}

.landing.links .link:hover i.fa {
  text-shadow: -8px 6px #c2e0ff;
}


/* Partnering */

.partnering {
  margin: 0;
  padding: 2.5rem;
  box-shadow: 4px 16px 20px 4px #e6eaee;
}

.partnering .header,
.partnering .intro {
  text-align: left;
}

/* Footer */

.footer-section {
  background-color: #f0f0f0;
  color: #103050;
  border: none;
}

.footer-section .col-sm-4 {
  margin: 2em 0;
}

.footer-section h2,
.footer-section .header {
  font-size: 100%;
  font-weight: bold;
  margin: 0.5em auto;
  width: 12em;
}

.footer-section ul {
  margin: auto;
  width: 12em;
}

.footer-section li {
  padding: 0.19em 0;
}

.footer-section a {
  color: #103050;
}

.footer-section .capterra {
  width: 15rem;
  padding: 2.5rem 0;
  margin: auto;
}

.footer-section .capterra > a {
    display: block;
    max-width: 10rem;
}

.footer-section div:nth-of-type(3) {
  text-align: center;
}

.footer-section .logo-footer {
  display: block;
}

.footer-section .logo-footer img {
  width: 10rem;
}

.footer-section .intouch {
  width: 10rem;
  margin: auto;
  text-align: left;
  margin-top: 2rem;
}

.footer-section .sm {
  font-size: 275%;
  padding: 0.5rem 0;
  display: block;
  text-decoration: none;
}

.footer-section .sm span.text {
  font-family: 'Noto Sans', 'Helvetica', 'Arial', 'sans serif' !important;
  display: inline-block;
  vertical-align: middle;
  margin-left: 0.5rem;
  font-size: 33%;
}

.footer-section .sm img {
  max-width: 2.75rem;
  max-height: 2.75rem;
}

.meta-section {
  display: none;
}

.section-column {
  padding-top: 20px;
  padding-bottom: 20px;
}
.footer-section-content {
  background-color: #cad2d9;
  border-top: 1px solid var(--ai-light);
  padding: 2em 0;
}

.footer-section h2,
.footer-section .header {
  color: #103050 !important;
  font-size: 125%;
}

.footer-section ul {
  margin: auto;
  width: 15em;
}

.footer-section .logo-footer {
  display: block;
}

.footer-section figure {
  margin: auto;
  width: 15em;  
}


/* Page specific */

.page-1 .block:first-of-type,
.page-21 .block:first-of-type,
.page-24 .block:first-of-type,
.page-23 .block:first-of-type,
.page-25 .block:first-of-type,
.page-121 .block:first-of-type {
  background-size: cover;
  background-color: #103050;
  background-image: url('/fileadmin/aimeos.org/images/background-dark-small.jpg');
  border-bottom: 0.66em solid #d2c5ab;
  color: #fff;
}

.page-1 .block:first-of-type .landing.welcome h1,
.page-1 .block:first-of-type .landing.welcome h2.claim,
.page-24 .block:first-of-type .landing.welcome h1,
.page-24 .block:first-of-type .landing.welcome h2.claim {
  color: #fff;
}

.page-1 .block:nth-of-type(2) .container,
.page-25 .block:nth-of-type(2) .container {
  max-width: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
}

.page-1 .block:nth-of-type(5) {
  background-color: #f4f0ea;
}

.page-1 .block:nth-of-type(8) {
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: left top, right bottom, left top;
  background-image: url('/fileadmin/aimeos.org/images/triangle.svg'), url('/fileadmin/aimeos.org/images/triangle2.svg'), url('/fileadmin/aimeos.org/images/background-light-small.jpg');
  background-size: 100%, 100%, cover;
  transform: scaleX(-1);
}

.page-1 .block:nth-of-type(8) .container {
  transform: scaleX(-1);
  padding: 2em;
}

.page-21 .block:nth-of-type(4),
.page-22 .block:nth-of-type(4),
.page-23 .block:nth-of-type(4),
.page-24 .block:nth-of-type(4),
.page-25 .block:nth-of-type(5),
.page-25 .block:nth-of-type(7),
.page-108 .block:nth-of-type(5),
.page-111 .block:nth-of-type(6),
.page-121 .block:nth-of-type(7) {
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: left top, right bottom, left top;
  background-image: url('/fileadmin/aimeos.org/images/triangle.svg'), url('/fileadmin/aimeos.org/images/triangle2.svg'), url('/fileadmin/aimeos.org/images/background-light-small.jpg');
  background-size: 100%, 100%, cover;
}

.page-21 .block:nth-of-type(4) .container,
.page-22 .block:nth-of-type(4) .container,
.page-23 .block:nth-of-type(4) .container,
.page-24 .block:nth-of-type(4) .container,
.page-25 .block:nth-of-type(5) .container {
  padding: 2em;
}

.page-1 .block:nth-of-type(12),
.page-21 .block:nth-of-type(8),
.page-22 .block:nth-of-type(8),
.page-23 .block:nth-of-type(8),
.page-24 .block:nth-of-type(9),
.page-25 .block:nth-of-type(10),
.page-108 .block:nth-of-type(7),
.page-111 .block:nth-of-type(9),
.page-118 .block:nth-of-type(4),
.page-121 .block:nth-of-type(10) {
  background-repeat: no-repeat, repeat-y;
  background-position: left top, left top;
  background-image: url('/fileadmin/aimeos.org/images/triangle.svg'), url('/fileadmin/aimeos.org/images/background-light-small.jpg');
  background-size: 100%, cover;
}

.page-108 .block:nth-of-type(1),
.page-115 .block:nth-of-type(1),
.page-111 .block:nth-of-type(1),
.page-118 .block:nth-of-type(1) {
  background-repeat: no-repeat, repeat-y;
  background-position: right bottom, left top;
  background-image: url('/fileadmin/aimeos.org/images/triangle2.svg'), url('/fileadmin/aimeos.org/images/background-light-small.jpg');
  background-size: 100%, cover;
}

.page-108 .block:nth-of-type(1) p,
.page-111 .block:nth-of-type(1) p,
.page-118 .block:nth-of-type(1) p {
  font-size: 133%;
}

.page-108 .highlights-image,
.page-111 .highlights-image,
.page-118 .highlights-image {
  margin-top: -2em;  
}