/*! Typebase.less v0.1.0 | MIT License */
/* Setup */
html, body {
    /* Change default typefaces here */
    font-family: var(--font);
    font-size: var(--font-size);
    -webkit-font-smoothing: antialiased;
    color: var(--font-dark);
  }

  /* Copy & Lists */
  p {
    line-height: 1.8rem;
    margin-top: 1.5rem;
    margin-bottom: 0;
    font-size: 1.1rem;
    color: var(--gray-middle);
    font-weight: 500;

  }
  footer p, .footermap nav {
    margin-top: .5rem;
  }
  footer p, .footermap, footer a {
    font-size: var(--font-size--footer);
    color: var(--font-lightest);
    font-family: var(--font--footer);
  }

  .fuuteri2 a, .fuuteri3 a {
    color: var(--white);
    font-weight:  700;
    background-color: var(--primary-color);
    padding:  2px 0px;
  }

  .fuuteri2 a:hover, .fuuteri3 a:hover {
    color: var(--primary-color);
    font-weight:  700;
    background-color: var(--white);
    padding:  2px 0px;
  }


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

  ul,
  ol {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }
  ul li,
  ol li {
    line-height: 1.5rem;
  }
  ul ul,
  ol ul,
  ul ol,
  ol ol {
    margin-top: 0;
    margin-bottom: 0;
  }
  blockquote {
    line-height: 1.5rem;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }

  /* Headings */
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    /* Change heading typefaces here */
    font-family: var(--font--heading);
    font-weight: var(--font-weight--heading);
    margin-top: 1.5rem;
    margin-bottom: 0;
    line-height: 1.5rem;
    color: var(--gray-light);
  }
  .hero h4{
    color: var(--white);
  }
  h1 {
    font-size: 2.8rem;
    line-height: 3.5rem;
    margin-top: 0;
    color: var(--primary-color);
  }
  .hero h1{
    color: var(--white);
    text-align: center;
    text-shadow: 3px 3px 7px var(--gray-dark);
    font-size: 2.5rem;
    line-height: 3rem;
  }
  h2 {
    font-size: 2.2rem;
    line-height: 2.8rem;
    margin-top: 3rem;
  }
  .hero h2, footer h2 {
    margin-top: 0;
  }
  .hero h2 {
    color: var(--font-lightest);
  }
  .block .field--name-field-title, footer h2 {
    font-size: var(--font-size--footer-title);
    font-family: var(--font--heading);
    font-weight: var(--font-weight--heading);
    color: var(--font-darkest);
    line-height: 1.5rem;
  }

  footer h2 {
    font-family: var(--font--footer);
  }
  h3 {
    font-size: 1.8rem;
    line-height: 2.4rem;
  }
  h4 {
    font-size: 1.5rem;
    line-height: 1.9rem;
  }
  h5 {
    font-size: 1.4rem;
    line-height: 1.8rem;
  }
  h6 {
    font-size: 1.2rem;
    line-height: 1.6rem;
  }

  /* Tables */
  table {
    margin-top: 1.5rem;
    border-spacing: 0px;
    border-collapse: collapse;
  }
  table td,
  table th {
    padding: 0;
    line-height: 33px;
  }

  /* Code blocks */
  code {
    vertical-align: bottom;
  }

  /* Links */
  a {
    color: var(--link-color);
    text-decoration: none;
  }
  a:hover {
    color: var(--link-color--hover);
  }
  .content p a {
    text-decoration: underline;
  }

  .horizontal-menu > li:last-child {
    background-color: var(--primary-color) !important;
    color: var(--white);
    font-weight: bold;
    transition: all 0.2s ease-in-out;
    color: rgba(255, 255, 255, 0.8);
  }

  .horizontal-menu > li:last-child:hover {
    color: rgba(255, 255, 255, 1);
    box-shadow: 0 0px 8px rgba(255, 255, 255, .4);
    background-color: var(--black);
    border-radius: 50px !important;

  }

  .horizontal-menu > li:last-child > a:hover {
    color: white;
    background-color: var(--primary-color);
    border-radius: 50px !important;

  }

  .horizontal-menu > li > a {
    font-family: var(--font--footer);
  }

  .view-referenssit .views-field-view-node span a {
    font-family: var(--font--footer);
    color: var(--white);
    font-weight: 800;
  }

  .view-referenssit .views-field-view-node span:hover {
    background-color: var(--primary-color);
  }

  .view-footer span a {
    font-family: var(--font--footer);
    color: var(--white);
    font-weight: 800;
  }

  .view-footer span:hover {
    background-color: var(--primary-color);

  }
  #block-views-block-testimonials-block-1 .views-field-body p {
    color: var(--white);
  }

.view-referenssit .views-field-title h2 a {
    font-family: var(--font--footer);
  }

p.small {
  font-size: 0.9rem;
  }


  .referenssit h3 {
    color:  var(--primary-color);
  }


  @media (max-width: 960px) {

    h4 {
    font-size: 1.2rem
}

  }
