:root {
	--color-primary-rgb: 79, 144, 233;
    --color-primary: rgb(var(--color-primary-rgb));  
    --color-primary-dark-rgb: 55, 115, 194;
    --color-primary-dark: rgb(var(--color-primary-dark-rgb));      
    --color-secondary-rgb: 132, 132, 132;
    --color-secondary: rgb(var(--color-secondary-rgb));      
    --color-dark-rgb: 51, 51, 51;
    --color-dark: rgb(var(--color-dark-rgb));      
    --color-white-rgb: 255, 255, 255;
    --color-white: rgb(var(--color-white-rgb));      
    --color-muted-rgb: 193, 193, 193;
    --color-muted: rgb(var(--color-muted-rgb));      
    --color-border-rgb: 226, 226, 226;
    --color-border: rgb(var(--color-border-rgb));     
    --color-light-rgb: 248, 248, 248;
    --color-light: rgb(var(--color-light-rgb));     
    --color-danger-rgb: 235, 73, 73;
    --color-danger: rgb(var(--color-danger-rgb));     
}

::-webkit-scrollbar {
   width: 10px;
}

::-webkit-scrollbar-thumb {
   border: 2px solid transparent;
   background-clip: padding-box;
   border-radius: 9999px;
   background-color: var(--color-secondary);
}

::placeholder {
   color: var(--color-muted);
   opacity: 1;
   white-space: nowrap;
   text-overflow: ellipsis;
   max-width: 100%;
   width: 100%;
   overflow: hidden;
}

* {
   padding: 0; margin: 0;
   box-sizing: border-box;
   font-family: "Helvetica", sans-serif;
   font-weight: 400;
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-smoothing: antialiased;
   line-height: 140%;   
}

@-moz-document url-prefix() {
   /* Note: becouse FF has problem with lineheight on Helvetica */
   * {
      font-family: "Arial", sans-serif;
      text-rendering: auto;
   }
}

html, body { min-height: 100% !important; height: 100%; color: var(--color-dark);  }
body { background: var(--color-white); padding: 0; margin: 0; font-size: 16px; line-height: 140%; color: var(--color-black); }
a { color: var(--color-primary); cursor: pointer; }
a:hover { color: var(--color-primary-dark); }
footer { background: var(--color-primary); font-size: 13px; color: var(--color-white); padding: 20px 0; flex-grow: 1; }
footer a { color: var(--color-white); }
footer a.footer-link { color: var(--color-white); }
footer a.footer-link:hover { color: var(--color-light); text-decoration: none; }

footer .brands { margin-top: 10px; }
footer .brands a { font-size: 20px; transition: .2s all; height: 44px; width: 44px; display: inline-block; padding: 9px 0 0 0; border-radius: 44px; background: transparent; }
footer .brands a:hover { background: rgba(var(--color-white-rgb), .25); color: var(--color-white) }
b, strong { font-weight: 600; }

.header { display: flex; }
.header .nav { display: flex; align-items: center; padding: 20px 0; }
.header .nav .page-nav { flex-grow: 1; }
.header .nav ul { display: flex; list-style-type: none; justify-content: center; }
.header .nav ul a { font-size: 16px; color: var(--color-secondary); text-decoration: none; padding: 10px 20px; white-space: nowrap; transition: .2s all; border-radius: 44px;s}
.header .nav ul a:hover { color: var(--color-dark); }
.header .nav ul li a.active { color: var(--color-dark); }

.page { min-height: 100%; display: flex; flex-flow: column; position: relative; z-index: 0; transition: .2s all; }
.page .cta { background: var(--color-light); padding: 60px 0; font-size: 25px; }
.page .hero .container { background-size: 50%; background: url('../images/hero-doc-white.webp'); background-size: contain; background-repeat: no-repeat; background-position: top 30px right; padding: 100px 400px 80px 40px; }

.page .hero { margin-top: -20px; }
.page .hero h1 { font-size: 145px; line-height: 80%; font-weight: 100; position: relative; left: -7px; text-shadow: 1px 2px 3px var(--color-white), -1px -2px 3px var(--color-white); }
.page .hero .hero-content { font-size: 25px; color: var(--color-secondary); padding: 30px 0 30px 0; }
.page .hero .hero-content p { line-height: 125%; padding-right: 200px; }
.page .hero .hero-nav { display: flex; column-gap: 10px; }
.page-nav-extra a { white-space: nowrap; }

.container { margin: 0 auto; width: 100%; max-width: 1280px; padding: 0 40px; }
.container-sm { max-width: 880px; }
.container-xs { max-width: 625px; }
.center { text-align: center; }
.page .container.image .picture { margin-block-start: 40px; margin-block-end: 40px; }
.page .container.image h2 { margin-block-start: 15px; }

.page .article { padding: 20px 0 40px 0; }
.page .article h1 { font-size: 75px; margin-block-start: 40px; margin-block-end: 30px; position: relative; left: -4px; font-weight: 100; line-height: 100%; }
.page .article h2 { font-size: 35px; margin-block-start: 40px; margin-block-end: 20px; position: relative; left: -2px; font-weight: 400; line-height: 120%; }
.page .article h3 { font-size: 25px; color: var(--color-secondary); margin-block-start: 40px; margin-block-end: 20px; position: relative; left: -2px; font-weight: 400; line-height: 110%; }
.page .article p { margin-block-end: 20px; margin-block-start: 20px; }
.page .article ul { list-style-type: none;  margin-block-end: 20px; margin-block-start: 20px;  }
.page .article ol ul { margin-block-end: 10px; margin-block-start: 10px;  }
.page .article ul > li { padding-left: 15px; margin-block-start: 10px;  }
.page .article ul > li:before { content: "-"; text-indent: -15px; position: absolute;  }
.page .article ul.download li { padding-left: 0px; }
.page .article ul.download li:before { content: ""; text-indent: 0px; } 
.page .article ul.download li i.fa-paperclip { margin-right: 5px; color: var(--color-secondary); }
.page .article ol { margin-block-end: 20px; margin-block-start: 20px; list-style-position: outside; padding-left: 20px; }
.page .article ol > li { padding-left: 0px; margin-block-start: 10px; }
.page .article img { max-width: 100%; }

.page .accordeon { margin-left: -20px; margin-right: -20px; width: calc(100% + 40px); }
.page .accordeon-item.open .question i { transform: rotate(45deg); }
.page .accordeon-item .question { padding: 15px 20px 15px 20px; display: flex; column-gap: 20px; width: 100%; }
.page .accordeon-item .question i { position: relative; top: 7px; color: var(--color-primary); transition: .2s all; width: 44px; height: 44px; border-radius: 44px; display: flex; align-items: center; justify-content: center; position: relative;  margin: -15px; cursor: pointer; }
.page .accordeon-item .question i:hover { background: rgba(var(--color-muted-rgb), .25); color: var(--color-primary-dark);  }
.page .accordeon-item .question .question-title { flex-grow: 1;  }
.page .accordeon-item .question a { margin: 0; font-size: 25px; display: block; text-decoration: none; }
.page .accordeon-item .answer { padding: 0 20px 0 20px; }
.page .accordeon-item:not(.open) .answer { display: none; }
.page .accordeon-item .answer p { margin-block-start: 0px; }
.page .accordeon-item.open .answer { height: 100%; }

.page .gallery { display: flex; column-gap: 20px; row-gap: 20px; margin-block-start: 40px; margin-block-end: 40px; flex-flow: row; justify-content: center; max-width: 100%; width: 100%; flex-wrap: wrap; }
.page .gallery a { display: block; width: 200px; max-width: 200px; min-width: 200px; }
.page .gallery a img { display: block; }
.page .gallery a:hover { box-shadow: 0 0 0 3px rgba(var(--color-primary-rgb), .5) } 

.accordeon-item + .accordeon-item { border-top: 1px solid var(--color-muted); }
.fixed { z-index: 50; position: fixed; height: 0px; width: 100%; overflow: visible; display: none; }
.fixed .btn { top: 20px; position: absolute; right: 20px; }

.btn {
  min-height: 44px; border: none; font-size: 16px; display: inline-flex; justify-content: center; align-items: center; padding: 10px 20px; border-radius: 22px; text-decoration: none; transition: .2s all; position: relative; line-height: 16px;
}

.btn.btn-primary {
  color: var(--color-white);
  background: var(--color-primary);
}

.btn.btn-primary:hover {
  background: var(--color-primary-dark);
}

.btn.btn-secondary {
  color: var(--color-primary);
  background: var(--color-white);
}

.btn.btn-secondary:hover {
  color: var(--color-primary-dark);
  background: rgba(var(--color-muted-rgb),.2);
}

.btn.btn-loading {
   transition: background-color 0.2s, border-color 0.2s;
   color: transparent !important;
   opacity: .75;
}

@keyframes loading-animation {
   0% {
      transform: rotate(0);
   }
   100% {
      transform: rotate(360deg);
   }
}

.btn.btn-loading::after {
   content: ' ';
   display: block;
   position: absolute;
   top: calc(50% - 12px);
   left: calc(50% - 12px);
   border-radius: 40px;
   border: 4px solid rgba(var(--color-white-rgb), .5);
   border-right: 4px solid transparent;
   width: 16px;
   height: 16px;
   animation: loading-animation 1.5s infinite;
   animation-timing-function: linear;
}

.input-field + .input-field { margin-top: 10px; }
.input-field input, .input-field textarea { border: 2px solid var(--color-muted); width: 100%; border-radius: 4px; padding: 20px; font-size: 20px; box-shadow: 2px 2px 2px rgba(var(--color-muted-rgb), .5); transition: .2s all; margin: 0; display: block; }
.input-field input:focus, .input-field textarea:focus, 
.input-field input:focus-visible, .input-field textarea:focus-visible, 
.input-field input:active, .input-field textarea:active { border-color: var(--color-primary); outline: none; }
.input-field .error { text-align: left; color: var(--color-danger); font-size: 13px; margin-top: 5px; display: none; }
.input-field.has-error .error { display: block; }
.input-field.has-error input, .input-field.has-error textarea { border-color: var(--color-danger) !important; }
.input-captcha .g-recaptcha > div { margin: auto; margin-top: 30px; margin-bottom: 20px; }
.input-captcha .error { text-align: center; }

.page .article form { margin-block-end: 40px; }
.page .article .blog { margin-block-end: 40px; }
.page .article .blog h2 { margin-block-end: 15px;  }
.page .article .blog p { margin-block-start: 15px; margin-block-end: 15px;  }
.page .article .blog h2 a { text-decoration: none;  } 
.page .article .blog-empty { border: 1px dashed var(--color-border); display: block; padding: 40px; margin-block-start: 40px; font-size: 17px; background: var(--color-light); }

body .btn-close { display: none; }

.fixed .btn { width: 44px; }
.mobile-nav { position: fixed; width: 300px; border-left: 1px solid var(--color-muted); height: 100%; right: -300px; transition: .2s right; display: none; }
.mobile-nav * { user-select: none; }

@media only screen and (max-width: 991px)
{
  .mobile-nav { display: block; }
  body.nav-open .mobile-nav { right: 0px; }
  body.nav-open .btn-open { display: none; }
  body.nav-open .btn-close { display: flex; }
  body.nav-open { overflow: hidden; auto}
  body.nav-open .page { transform: translateX(-300px); }
}

.mobile-nav ul { list-style-type: none; padding: 80px 20px 20px 20px; }
.mobile-nav ul li a { text-decoration: none; }
.mobile-nav ul li { display: block; }
.mobile-nav ul li a { display: block; padding: 15px 10px; user-select: none; -webkit-user-select: none; }
.mobile-nav ul li + li { border-top: 1px solid var(--color-muted); }
.mobile-nav ul li a:hover { background: rgba(var(--color-muted-rgb), .2) }

@media only screen and (max-width: 1199px)
{
  .page .hero .container { background-position: top 50px right -50px; padding: 80px 300px 80px 40px; }
  .page .hero h1 { font-size: 115px; left: -2px; }
  .page .hero .hero-content p { padding-right: 150px;  }
}

@media only screen and (max-width: 999px)
{
  .page .hero .container { background-position: top 50px right -50px: }  
}

@media only screen and (max-width: 991px)
{
  .fixed { display: block; }
  .header .nav .page-nav, .header .nav .page-nav-extra { display: none; }
  .page .hero h1 { font-size: 80px; line-height: 90%; }
  .page .hero .hero-content p { padding-right: 30px; }
}

@media only screen and (max-width: 767px)
{
  .container { padding: 0 20px; }
  .page .hero .hero-content p { padding-right: 200px; font-size: 22px; }
  .page .cta { font-size: 22px; padding: 40px 0; }
  .page .hero h1 { font-size: 80px; }
  .page .hero .container { padding: 40px 40px 40px 20px; background-size: 628px 500px; background-position: top 50px right -100px; }  
  .page .article h1 { font-size: 50px; left: -1px; line-height: 105%; margin-block-start: 30px; }
  .page .article h2 { font-size: 30px; left: -1px; line-height: 125%; margin-block-start: 30px; }
  .page .article h3 { font-size: 28px; }
  
  .page .article { padding: 0 0 30px 0; }
  .page .accordeon-item .question a  { font-size: 22px; }
  .page .accordeon-item .question i { right: 5px; top:8px; }
  .page .cta br { display: none; }
}


@media only screen and (max-width: 677px)
{
  .page .hero h1 { font-size: 60px; line-height: 90%; }
}

@media only screen and (max-width: 566px)
{
  .page .hero .container { background-position: top 180px right -100px; }
}


.carousel .carousel-cell {
  width: 100%;
  text-align: center;
  font-size: 25px;
  font-style: italic;
  padding: 60px 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100%;
}

.cta.cta-dark { background: rgba(var(--color-secondary-rgb),.1); }

@media only screen and (max-width: 767px)
{
  .carousel .carousel-cell {
    font-size: 20px;
    padding: 40px 60px;
  }
}
/*
567, 768, 992, 1200  
*/