@font-face {
    font-family: 'Trade Gothic Next LT Pro Cn';
    src: url('../fonts/TradeGothicNextLTPro-Cn.eot');
    src: local('Trade Gothic Next LT Pro Cn'), local('TradeGothicNextLTPro-Cn'),
        url('../fonts/TradeGothicNextLTPro-Cn.eot?#iefix') format('embedded-opentype'),
        url('../fonts/TradeGothicNextLTPro-Cn.woff2') format('woff2'),
        url('../fonts/TradeGothicNextLTPro-Cn.woff') format('woff'),
        url('../fonts/TradeGothicNextLTPro-Cn.ttf') format('truetype'),
        url('../fonts/TradeGothicNextLTPro-Cn.svg#TradeGothicNextLTPro-Cn') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Trade Gothic Next LT Pro Cn';
    src: url('../fonts/TradeGothicNextLTPro-BdCn.eot');
    src: local('Trade Gothic Next LT Pro BdCn'), local('TradeGothicNextLTPro-BdCn'),
        url('../fonts/TradeGothicNextLTPro-BdCn.eot?#iefix') format('embedded-opentype'),
        url('../fonts/TradeGothicNextLTPro-BdCn.woff2') format('woff2'),
        url('../fonts/TradeGothicNextLTPro-BdCn.woff') format('woff'),
        url('../fonts/TradeGothicNextLTPro-BdCn.ttf') format('truetype'),
        url('../fonts/TradeGothicNextLTPro-BdCn.svg#TradeGothicNextLTPro-BdCn') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

:root {
  --bs-blue: #0d6efd;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #d63384;
  --bs-red: #dc3545;
  --bs-orange: #fd7e14;
  --bs-yellow: #F2C143;
  --bs-green: #16BB58;
  --bs-teal: #20c997;
  --bs-cyan: #0dcaf0;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #6c757d;
  --bs-gray-700: #495057;
  --bs-gray-800: #343a40;
  --bs-gray-900: #212529;
  --bs-primary: #03C0AD;
  --bs-primary-hover: #00B19F;
  --bs-primary-gradient-1: #14D0BD;
  --bs-primary-gradient-2: #0BA092;
  --bs-primary-gradient-3: #026057;
  --bs-primary-gradient-border: #58BAB2;
  --bs-secondary: #000000;
  --bs-secondary-hover: #222222;
  --bs-success: #026E02;
  --bs-success-hover: #006000;
  --bs-info: #7FCFD6;
  --bs-info-hover: #70C2C4;
  --bs-warning: #ffc107;
  --bs-danger: #e64040;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;
  --bs-primary-rgb: 0, 200, 209;
  --bs-primary-hover-rgb: 2, 179, 187;
  --bs-secondary-rgb: 0, 0, 0;
  --bs-secondary-hover-rgb: 34, 34, 34;
  --bs-success-rgb: 2, 110, 2;
  --bs-success-hover-rgb: 0, 96, 0;
  --bs-info-rgb: 127, 207, 214;
  --bs-info-hover-rgb: 112, 194, 196;
  --bs-warning-rgb: 255, 193, 7;
  --bs-danger-rgb: 142, 0, 0;
  --bs-danger-hover-rgb: 116, 0, 0;
  --bs-light-rgb: 248, 249, 250;
  --bs-dark-rgb: 33, 37, 41;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-body-color-rgb: 16, 40, 64;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family: 'Trade Gothic Next LT Pro Cn', sans-serif;
  --bs-body-font-size: 1.375rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.35;
  --bs-body-color: #211F1F;
  --bs-body-bg: #F9FAFB;
  --bs-border-width: 1px;
  --bs-border-style: solid;
  --bs-border-color: #CBCBCB;
  --bs-border-color-translucent: #CBCBCB;
  --bs-border-radius: 0.375rem;
  --bs-border-radius-sm: 0.25rem;
  --bs-border-radius-lg: 0.5rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-2xl: 2rem;
  --bs-border-radius-pill: 50rem;
  --bs-link-color: var(--bs-primary);
  --bs-link-hover-color: var(--bs-primary-hover);
  --bs-code-color: #d63384;
  --bs-highlight-bg: #fff3cd;
  --bs-section-bg: #D8E2E7;
  --bs-text-font-weight: 600;
  --input-border-color: rgba(112,112,112,.1);
  --input-border-color-focus: var(--bs-primary);
  --input-bg: #fff;
  --input-color: var(--bs-body-color);
  --input-placeholder: var(--input-color);
}

html{ font-size: 16px;}

a,
.page-link{ color: var(--bs-body-color); text-decoration: none; transition: all 0.1s ease-in-out;}
a:hover,
.page-link:hover{ color: #07C0AD; text-decoration: none;}
.page-link:focus{ box-shadow: none;}
img{ max-width: 100%;}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 { font-weight: 700; margin-bottom: 1rem;}
h1, .h1{ font-size: 5.625rem; line-height: 6.25rem;} /* 90px */
h2, .h2{ font-size: 2.8125rem; line-height: 3.5rem;} /* 45px */
h3, .h3{ font-size: 2.0625rem; line-height: 2.5rem;} /* 33px */
h4, .h4{ font-size: 1.875rem; line-height: 2.375rem;} /* 30px */
h5, .h5{ font-size: 1.5625rem; line-height: 2rem;} /* 25px */
h6, .h6{ font-size: 1.25rem; line-height: 1.5rem;} /* 20px */

.fw-sbold{ font-weight: 600;}
.fw-medium{ font-weight: 500;}
.text-dark-blue{ color: #071753;}

/* Header */
.header{ position: fixed; top: 0; left: 0; width: 100%; z-index: 9;}
.header .navbar{ min-height: 140px; width: 100%; background: transparent; transition: all .3s ease;}
/*.navbar-brand{ mix-blend-mode: difference;}*/
.navbar-nav{ flex-direction: row; --bs-nav-link-font-size: 1.375rem; --bs-nav-link-font-weight: 700; --bs-nav-link-color: var(--bs-body-color); --bs-nav-link-hover-color: #07C0AD;}
.navbar-nav .nav-item.active .nav-link{ color: #07C0AD;}
.navbar-toggler{ border: none; padding: 0; margin-left: 1.875rem; outline: none; box-shadow: none;}
.navbar-toggler:focus{ outline: none; box-shadow: none;}

.header-light:not(.active) .navbar-nav{ --bs-nav-link-color: var(--bs-white);}
.header-light:not(.active) .navbar-toggler svg path{ stroke: #fff;}

.header.active .navbar{ min-height: 80px; background: #fff; box-shadow: 0 3px 6px rgba(0,0,0,.16);}
.header-light:not(.active) .logo-dark,
.header.active .logo-white,
.header:not(.header-light) .logo-white{ display: none;}

.navbar-collapse{ width: 100%; position: absolute; right: 0; top: 120px; transition: all .3s ease;}
.header.active .navbar-collapse{ top: 80px;}
.toggle-navbar{ padding: 5rem; width: 100%; background-color: #fff; box-shadow: 0 3px 6px rgba(0,0,0,.16); border-radius: 1.25rem;}
.toggle-navbar ul{ list-style: none; margin-bottom: 0; padding: 0;}
.toggle-navbar ul li a{ font-size: 1.5625rem; line-height: 2.1875rem; font-weight: 700; display: flex; align-items: center;}
.toggle-navbar ul li a .nav-icon{ margin-right: 1.25rem;}

/* Button */
.btn{ font-family: var(--bs-body-font-family); font-size: 1.75rem; line-height: 2.25rem; font-weight: 700; color: var(--bs-primary); padding: .875rem 1.25rem 1.125rem; border-radius: 3rem; box-shadow: 0 3px 6px rgba(0,0,0,.16); transition: all .15s ease-in-out;}
.btn:hover { color: #000000; text-decoration: none;}
.btn:focus { outline: 0; box-shadow: 0 3px 6px rgba(0,0,0,.16);}
.btn:disabled,
.btn.disabled { pointer-events: none; opacity: 0.75;}

.btn-xl,
.btn-group-xl > .btn { padding: 1.875rem 3rem; font-size: 2.1875rem; line-height: 2.25rem;}
.btn-lg,
.btn-group-lg > .btn { padding: 1rem 2rem; font-size: 1.25rem; line-height: 1.5rem; font-weight: bolder;}
.btn-sm,
.btn-group-sm > .btn { padding: .375rem 1.125rem .625rem; font-size: 1.375rem; line-height: 1.75rem;}

.link-primary,
.link-primary:focus{ color: #07C0AD !important; text-decoration: underline;}
.link-primary:hover{ color: var(--bs-body-color) !important; text-decoration: none;}
.link-dark-blue,
.link-dark-blue:focus{ color: #071753 !important; text-decoration: none;}
.link-dark-blue:hover{ color: var(--bs-body-color) !important; text-decoration: none;}
.link-dark-border{ text-decoration: none; border-bottom: 1px solid var(--bs-body-color);}
.link-arrow{ display: inline-block; width: 1.875rem; height: 1.875rem; background: url(../images/link-arrow.png) right center no-repeat;}

.w-230{ width: 230px; max-width: 100%;}
.btn-text-25{ font-size: 1.5625rem;}

.btn-primary,
.btn-primary:focus{ color: #fff; background-color: var(--bs-primary); border-color: var(--bs-primary);}
.btn-primary:hover,
.btn-primary:active,
.btn-primary.active,
.show > .btn-primary.dropdown-toggle,
.btn-primary:first-child:active,
:not(.btn-check) + .btn-primary:active{ color: #fff; background-color: var(--bs-primary-hover); border-color: var(--bs-primary-hover);}
.btn-primary:focus,
.btn-primary:active:focus,
.btn-primary.active:focus,
.show > .btn-primary.dropdown-toggle:focus { box-shadow: 0 3px 6px rgba(0,0,0,.16);}
.btn-primary:disabled,
.btn-primary.disabled { color: #fff; background-color: var(--bs-primary); border-color: var(--bs-primary);}

.btn-primary.gradient,
.btn-primary.gradient:focus{ color: #fff; background: linear-gradient(180deg, var(--bs-primary-gradient-1) 0%, var(--bs-primary-gradient-2) 50%, var(--bs-primary-gradient-2) 50%, var(--bs-primary-gradient-2) 100%); border-color: var(--bs-primary-gradient-border); background-size: 100% 200%; background-position: 0 0;}
.btn-primary.gradient:hover,
.btn-primary.gradient:active,
.btn-primary.gradient.active,
.btn-primary.gradient:first-child:active,
:not(.btn-check) + .btn-primary.gradient:active{ color: #fff; background: linear-gradient(180deg, var(--bs-primary-gradient-1) 0%, var(--bs-primary-gradient-2) 50%, var(--bs-primary-gradient-2) 50%, var(--bs-primary-gradient-2) 100%); border-color: var(--bs-primary-gradient-2); background-size: 100% 200%; background-position: 0 100%;}
.btn-primary.gradient:focus,
.btn-primary.gradient:active:focus,
.btn-primary.gradient.active:focus { box-shadow: 0 3px 6px rgba(0,0,0,.16);}
.btn-primary.gradient:disabled,
.btn-primary.gradient.disabled { color: #fff; background: linear-gradient(180deg, var(--bs-primary-gradient-1) 0%, var(--bs-primary-gradient-2) 100%); border-color: var(--bs-primary-gradient-border);}

.btn-primary.gradient-alt,
.btn-primary.gradient-alt:focus{ color: #fff; background: linear-gradient(180deg, var(--bs-primary) 0%, var(--bs-primary-gradient-3) 100%); border-color: var(--bs-primary-gradient-border);}
.btn-primary.gradient-alt:hover,
.btn-primary.gradient-alt:active,
.btn-primary.gradient-alt.active { color: #fff; background: linear-gradient(180deg, var(--bs-primary-hover) 0%, var(--bs-primary-hover) 100%); border-color: var(--bs-primary-hover);}
.btn-primary.gradient-alt:focus,
.btn-primary.gradient-alt:active:focus,
.btn-primary.gradient-alt.active:focus { box-shadow: 0 3px 6px rgba(0,0,0,.16);}
.btn-primary.gradient-alt:disabled,
.btn-primary.gradient-alt.disabled { color: #fff; background-color: var(--bs-primary); border-color: var(--bs-primary);}

/* Form */
.form-control,
.form-select{ height: 3.5rem; font-family: var(--bs-body-font-family); padding: .75rem 2rem; font-size: 1.125rem; line-height: 1.5rem; font-weight: 400; color: var(--input-color); background-color: var(--input-bg); border-color: var(--input-border-color); border-radius: 2rem; box-shadow: 0 3px 6px rgba(112,112,112,.16);}
.form-select{ padding-right: 2rem; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 7'%3e%3cpath fill='%237A7D80' d='M0,1.06L1.071,0L6,4.88L10.93,0L12,1.06L6,7L0,1.06z'/%3e%3c/svg%3e"); background-size: 12px 7px; background-position: right .75rem center;}
textarea.form-control{ height: auto; min-height: 130px; resize: none; border-radius: 1.25rem}
.form-control:focus,
.form-select:focus{ color: var(--input-color); background-color: var(--input-bg); border-color: var(--input-border-color-focus); box-shadow: 2px 2px 4px rgba(var(--bs-primary-rgb), .4);}
.form-control:disabled,
.form-control[readonly],
.form-select:disabled,
.form-select[readonly]{ background-color: #F6F6F6; opacity: 1; cursor: not-allowed;}
.form-control.error{ border-color: var(--bs-danger); box-shadow: 2px 2px 4px rgba(var(--bs-danger-rgb), .4);}

.form-control::-webkit-input-placeholder{ color: var(--input-placeholder); opacity:.9;}
.form-control::-moz-placeholder{ color: var(--input-placeholder); opacity:.9;}
.form-control:-ms-input-placeholder{ color: var(--input-placeholder); opacity:.9;}
.form-control::-ms-input-placeholder{ color: var(--input-placeholder); opacity:.9;}
.form-control::placeholder{ color: var(--input-placeholder); opacity:.9;}

label.error{ font-size: 1rem; line-height: 1.125rem; color: var(--bs-danger); margin-top: .25rem; margin-left: calc(1rem + 1px);}

/* Selectbox */
.chosen-container{ position: relative; width: 100% !important;}
.chosen-container-single .chosen-single{ height: 3.5rem; font-family: var(--bs-body-font-family); padding: .875rem 3.5rem .75rem 2rem; font-size: 1.125rem; font-weight: 400; line-height: 1.5rem; color: var(--input-color); background-color: var(--input-bg); border: 1px solid var(--input-border-color); border-radius: 2rem; box-shadow: 0 3px 6px rgba(112,112,112,.16); display: inline-block; width: 100%; max-width: 100%; position: relative; vertical-align: top; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round' d='M19.11,5.06l-9.042,9.881L0.89,5.06'/%3e%3c/svg%3e"); background-position: right 1.5rem center; background-size: 1.25rem 1.25rem; background-repeat: no-repeat; -webkit-appearance:none; -moz-appearance:none; -o-appearance:none; appearance:none; cursor:pointer; overflow: hidden; text-decoration: none; white-space: nowrap;}
.chosen-container-single .chosen-single:hover{ color: var(--input-color);}
.chosen-container-single .chosen-single span{ margin-right: 0;}
.chosen-container-active.chosen-with-drop .chosen-single div{ display: none;}
.chosen-container-single .chosen-search{ display: none;}
.chosen-container .chosen-drop{ position: absolute; right: 0; top: 100%; width: 16.5rem; max-width: 100%; margin-top: -1px; background: #fff; display: inline-block; border: 1px solid var(--input-border-color); border-radius: 1.25rem; box-shadow: 0 3px 6px rgba(0,0,0,.16); z-index: 1010; clip: rect(0, 0, 0, 0); -webkit-clip-path: inset(100% 100%); clip-path: inset(100% 100%);}
.chosen-container .chosen-results{ color: var(--input-color); margin: 0; padding: 1.375rem 0; max-height: 274px; position: relative; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch;}
.chosen-container .chosen-results li{ display: none; font-size: 1.125rem; line-height: 1.5rem; padding: .375rem 2.125rem; margin: 0; list-style: none; word-wrap: break-word; -webkit-touch-callout: none;}
.chosen-container .chosen-results li.active-result{ display: list-item; cursor: pointer;}
.chosen-container .chosen-results li.highlighted{ color: var(--bs-primary);}
.chosen-container.chosen-with-drop .chosen-drop{ clip: auto; -webkit-clip-path: none; clip-path: none;}

.checkbox{ padding: 0; position: relative;}
.checkbox input[type=checkbox]{ visibility:hidden; position: absolute; left: 0; top: 0; margin: 0; opacity: 0;}
.checkbox label{ margin: 0; display: inline-block;}
.checkbox .lbl{ padding-left: 3.25rem; font-size: 1.125rem; line-height: 1.25rem; display: flex; min-height: 2.125rem; align-items: center;}
.checkbox input[type="checkbox"] + .lbl:before{ content: ""; position: absolute; left: 0; top: 0; width: 2.125rem; height: 2.125rem; background-color: var(--input-bg); border: 1px solid var(--input-border-color); border-radius: 1.25rem; box-shadow: 0 3px 6px rgba(0,0,0,.16); background-position: center center; background-repeat: no-repeat; background-size: 1rem 1rem;}
.checkbox input[type="checkbox"]:checked + .lbl:before{ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' d='M14.733,3.512l-8.967,8.977l-4.5-4.435'/%3e%3c/svg%3e");}

/* Section */
.section{ padding: 5rem 0;}
.section-title{ text-align: center; margin-bottom: 4rem;}

/* Home */
.section-hero{ padding: 12rem 0 2.5rem; min-height: 100vh; position: relative;}
.hero-bg{ position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.hero-bg video{ width: 100%; height: 100%; object-fit: cover;}
.hero-bg .hero-cover{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-size: 100% auto;}
.hero-gray-bg{ background: url(../images/hero-gray-bg.png) center bottom no-repeat; background-size: 100% 100%;}
.hero-white-bg{ background: url(../images/hero-white-bg.png) center bottom no-repeat; background-size: 100% 100%;}
.hero-content{ margin-top: 4rem; position: relative; z-index: 1;}

.home-hero{ color: #fff;}
.home-hero .hero-bg .hero-cover{ background-image: url(../images/hero-cover-home.png); background-position: center bottom;}
.home-hero .hero-image{ position: absolute; right: 0; top: 10rem; bottom: 4.5rem; max-width: 50%; display: flex; align-items: center; justify-content: flex-end;}
.home-hero .hero-image img{ max-height: 100%;}
.home-hero .items-hero h1,
.home-hero .items-hero .h3,
.home-hero .items-hero .h4{ font-weight: 700;}
.home-hero .items-hero p{ font-weight: 700; margin-bottom: 1.875rem; width: 380px; max-width: 100%;}

.items-reasons{ padding-left: 7.75rem; position: relative;}
.items-reasons .item-icon{ position: absolute; left: 0; top: 0; display: inline-block;}
.items-reasons .item-icon .icon-png,
.items-reasons .item-icon .icon-gif{ width: 6.25rem; mix-blend-mode: darken;}
.items-reasons .item-icon:hover .icon-png,
.items-reasons .item-icon .icon-gif{ display: none;}
.items-reasons .item-icon .icon-png,
.items-reasons .item-icon:hover .icon-gif{ display: block;}
.items-reasons .item-title{ font-weight: bold; margin-bottom: .625rem;}
.items-reasons p{ font-size: 1.25rem; margin-bottom: 0;}

.section-nettiaika{ padding-top: 3rem;}
.section-nettiaika h4{ padding-left: 5rem; margin-bottom: 2.5rem;}
.items-list{ list-style: none; margin: 0; padding: 0;}
.items-list li{ padding: .125rem 0 .375rem 5rem; margin-bottom: 1.5rem; position: relative; font-size: 1.5625rem; line-height: 2rem;}
.items-list li:last-child{ margin-bottom: 0;}
.items-list li .icon{ position: absolute; left: 0; top: 0;}
.items-list-wrap{ text-align: left;}
.items-links{ text-align: center; margin-top: 2rem;}
.item-bubble .bubble-link{ padding: 1.5rem 3.5rem 2.5rem 1.5rem; font-size: 1.25rem; line-height: 1.5rem; font-weight: 800; color: var(--bs-body-color); display: inline-flex; align-items: center; justify-content: center; text-align: center; background: url(../images/bubble-link.png) center center no-repeat; background-size: contain; width: 230px; height: 150px;}
.item-bubble img{ width: 120px; margin-top: 7rem; margin-left: 1rem; vertical-align: top;}
.item-links{ display: flex; justify-content: space-around; width: 600px; max-width: 100%; margin: 2rem auto 0;}
.item-links .arrow-link{ margin: 1rem 1rem 0;}
.arrow-link{ font-size: 1.25rem; line-height: 1.5rem; font-weight: 800; color: var(--bs-body-color); transition: all .3s ease-in-out;}
.arrow-link:hover{ color: var(--bs-body-color);}

.slider-build{ padding: 0 2.5rem;}
.slider-build .item-image{ padding: 0 1.875rem 1.25rem; text-align: center;}
.slider-build .item-image img{ /*max-height: 1018px;*/ display: inline-block; box-shadow: 0 3px 6px rgba(0,0,0,.16); /*max-height: 70vh; width: 100%; object-fit: cover; object-position: center 0; transition: all 1.5s ease;*/}
/*.slider-build .item-image img:hover{ object-position: center 100%;}*/
.slider-build:not(.slick-initialized){ opacity: 0; max-height: 100px; overflow: hidden;}
.slider-build .slick-arrow{ width: 1.5rem; height: 2.25rem; background-position: center center; background-repeat: no-repeat;}
.slider-build .slick-arrow:before{ display: none;}
.slider-build .slick-prev{ left: 0; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 36'%3e%3cpath fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' d='M20.621,33.9 L3.379,17.881L20.621,2.1'/%3e%3c/svg%3e");}
.slider-build .slick-next{ right: 0; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 36'%3e%3cpath fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' d='M3.379,2.1 l17.242,15.781L3.379,33.9'/%3e%3c/svg%3e");}

.section-customers{ padding-top: 2rem; background-color: #fff;}
.items-cst-logo{ text-align: center;}
.items-cst-logo .item-logo img{ max-height: 4.75rem;}

/*Contact Section*/
.section-contacts{ padding-top: 1rem; /* background-color: rgba(var(--bs-body-color-rgb), .03);*/ position: relative;}
.contact-form{ padding: 160px 0 130px; background: url(../images/contact-form-bg.png) center top no-repeat; background-size: contain;}
.items-contact{ padding: 1.5rem 2rem 2rem; width: 420px; min-height: 670px; max-width: 100%; margin: 0 auto; background: var(--bs-white) url(../images/icon-contact-notification.png) 48% 4px no-repeat; background-size: 3.5rem auto; border: 1px solid rgba(112,112,112,.2); border-radius: 2.125rem; box-shadow: 0 3px 6px rgba(0,0,0,.16);}
.items-contact .h5{ font-weight: 700; margin-bottom: 0;}
.items-contact p{ font-size: 1.25rem; line-height: 1.5rem; font-weight: 400; margin: .25rem 0 1rem;}
.items-contact .h5:not(:first-child){ margin-bottom: 1.5rem;}
.items-contact .mb-3{ margin-top: .125rem;}
.free-trial-wrap{ padding: 2rem; min-height: calc(100vh - 4rem); position: relative; z-index: 1; background-color: #fff; border-radius: 1.25rem; box-shadow: 0 3px 6px rgba(0,0,0,.16);}
.free-trial-wrap .btn-close{ outline: none; box-shadow: none; padding: 0; opacity: 1; width: 1.625rem; height: 1.625rem; padding: 0; position: absolute; right: 1.75rem; top: 1.5rem; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3e%3cpath fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' d='M1,1l16,16 M17,1L1,17'/%3e%3c/svg%3e") center center no-repeat; background-size: 1.125rem 1.125rem;}
.free-trial-wrap h6,
.free-trial-wrap .h6{ font-weight: 700;}
.free-trial-form{ margin-bottom: 0;}
.free-trial-form .h6{ color: #071753;}
.free-trial-form p{ margin: .25rem 0 1rem; font-size: 1.125rem;}
.free-trial-form .btn{ width: 275px; max-width: 100%;}
.free-trial-modal-body{ padding: 2rem 0; width: 100%; overflow: hidden; position: relative;}
.free-trial-modal-body .item-animate{ width: 58.33333333%; position: absolute; right: -5%; top: 50%; transform: translateY(-50%);}
.free-trial-modal-body .btn{ font-size: 1.5625rem; line-height: 2rem;}

/* Modal */
.modal{ --bs-modal-bg: #f7f9fa; --bs-modal-border-color: transparent; --bs-modal-title-line-height: 1.5rem; --bs-modal-border-radius: .5rem;}
.modal-header{ padding: 1.25rem 1.875rem;}
h4.modal-title{ color: #071753; margin-bottom: 1rem; font-weight: bold;}
h6.modal-title{ padding-right: 2rem; color: #071753; margin-bottom: 0;}
.modal-body{ padding: 0;}

/* Ajanvarausjärjestelmä */
.app-system-hero .hero-image{ position: absolute; right: 0; top: 8rem; bottom: 4rem; width: 50%; display: flex; align-items: center; justify-content: center;}
.app-system-hero .hero-image img{ max-height: 100%;}
.section-hero .items-hero h1{ font-weight: 700;}
.app-system-hero .items-hero p{ width: 530px; max-width: 100%;}

.items-app-system{ position: relative; color: #fff; display: block; text-decoration: none;}
.items-app-system:hover{ color: #fff;}
.app-system-hero .hero-content{ margin-top: 1rem;}
.items-app-system .item-image img{ width: 100%; border-radius: 2.5rem;}
.items-app-system .item-wrap{ position: absolute; left: 0; bottom: 0; width: 100%; padding: 0 1rem 4rem;}
.items-app-system .item-btn{ margin-top: 1.5rem;}

.nettiajanvaraus-hero .hero-image{ position: absolute; right: 0; top: 10rem; bottom: 4.5rem; width: 80%; display: flex; align-items: center; justify-content: center;}
.nettiajanvaraus-hero .hero-image img{ max-height: 100%;}
.nettiajanvaraus-hero .items-hero p{ width: 530px; max-width: 100%;}

.items-nettiajan{ width: 270px; max-width: 100%; display: inline-block; text-align: left;}
.items-nettiajan .item-icon{ margin-bottom: .5rem; display: inline-block;}
.items-nettiajan .item-icon .icon-png,
.items-nettiajan .item-icon .icon-gif{ width: 9.375rem; mix-blend-mode: darken;}
.items-nettiajan .item-icon:hover .icon-png,
.items-nettiajan .item-icon .icon-gif{ display: none;}
.items-nettiajan .item-icon .icon-png,
.items-nettiajan .item-icon:hover .icon-gif{ display: block;}
.items-nettiajan .item-title{ margin-bottom: .75rem;}
.items-nettiajan .item-text{ font-size: 1.25rem;}

.item-animate lottie-player{ max-width: 100%;}

.section-content-20 p{ font-size: 1.25rem; line-height: 1.875rem;}
.p-mb-4 p{ margin-bottom: 1.5rem;}

.section-inner-hero{ position: relative;}
.section-inner-hero .item-title{ padding-top: 1.5rem;}
.section-inner-hero .item-title h1{ margin-bottom: 0;}

.section-nettiajanvaraus .item-text{ font-size: 1.875rem; line-height: 2.25rem; font-weight: 500;}
.section-nettiajanvaraus-1{ position: relative;}
.section-nettiajanvaraus-1 .item-body{ position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%;}
.section-nettiajanvaraus-1 .item-links{ justify-content: flex-start; width: 100%; margin-top: 0;}
.section-nettiajanvaraus-1 .item-links .arrow-link{ margin-top: .75rem;}

.yritys-hero .hero-image{ position: absolute; right: 0; top: 10rem; bottom: 4.5rem; width: 54%; display: flex; align-items: center; justify-content: center;}
.yritys-hero .hero-image img{ max-height: 100%;}
.yritys-hero .items-hero p{ width: 380px; max-width: 100%;}

.section-text{ font-size: 1.5625rem; line-height: 2rem; margin-bottom: 5rem;}
.items-yt{ padding-left: 5.625rem; min-height: 4.125rem; font-size: 1.5625rem; line-height: 2rem; font-weight: 700; display: flex; align-items: center; position: relative;}
.items-yt .icon{ position: absolute; left: 0; top: 50%; transform: translateY(-50%);}

.tietosuojalauseke-hero .hero-image{ position: absolute; right: 1.25rem; top: 10rem; bottom: 4.5rem; width: 50%; display: flex; align-items: center; justify-content: center;}
.tietosuojalauseke-hero .hero-image img{ max-height: 100%;}
.tietosuojalauseke-hero .items-hero p{ width: 390px; max-width: 100%;}

.items-ps{ padding-left: 12rem; position: relative;}
.items-ps .item-icon{ width: 7.5rem; position: absolute; left: 0; top: 0;}
.items-ps .item-number{ position: absolute; left: 9.25rem; top: 0;}

.rekisteriseloste-hero .hero-image{ position: absolute; right: 0; top: 10rem; bottom: 4.5rem; width: 70%; display: flex; align-items: center; justify-content: center;}
.rekisteriseloste-hero .hero-image img{ max-height: 100%;}
.rekisteriseloste-hero .items-hero p{ width: 580px; max-width: 100%;}

.items-rs{ padding-left: 10.5rem; position: relative;}
.items-rs .item-icon{ width: 5.625rem; position: absolute; left: 0; top: 0;}
.items-rs .item-number{ position: absolute; left: 7.5rem; top: 0;}

.useinkysyttya-hero{ min-height: 40vh;}
.useinkysyttya-hero .hero-bg{ height: 90vh;}
.useinkysyttya-hero .hero-content{ margin-top: 0;}
.useinkysyttya-hero + .section { position: relative;}

/* Hinnasto / Pricing */
.pricing-hero{ min-height: 35vh;}
.pricing-hero .hero-bg{ height: 90vh;}
.pricing-hero .hero-content{ margin-top: 0;}
.pricing-hero .items-hero{ text-align: center;}
.pricing-hero .items-hero p{ width: 720px; max-width: 100%; margin-left: auto; margin-right: auto;}

.section-eyebrow{ display: inline-block; font-size: .9375rem; line-height: 1.25rem; font-weight: 700; color: var(--bs-primary); text-transform: uppercase; letter-spacing: .125rem; margin-bottom: .75rem;}

.section-plans{ padding-top: 1rem; position: relative;}

.plans-table-wrap{ overflow-x: auto;}
.plans-table{ min-width: 100%; display: table;}
.plans-row{ display: grid; background-color: var(--bs-white); overflow: hidden; grid-template-columns: minmax(240px, 1fr); grid-auto-columns: minmax(300px, 340px); grid-auto-flow: column; align-items: stretch;}
.plans-row + .plans-row{ border-top: 1px solid #eee;}
.plans-cell{ padding: 0.75rem 2rem; display: flex; align-items: center;}
.plan-cell{ padding: 0.75rem 1rem; justify-content: center; text-align: center; border-left: 1px solid #eee;}
.feature-cell{ gap: 1rem; align-items: center;}
.feature-cell .feature-icon{ flex-shrink: 0; width: 2.5rem; height: 2.5rem; border-radius: .75rem; background-color: rgba(var(--bs-primary-rgb), .12); color: var(--bs-primary); display: inline-flex; align-items: center; justify-content: center;}
.feature-cell .feature-icon svg{ width: 1.375rem; height: 1.375rem; fill: none; stroke: currentColor; stroke-width: 1.75;}
.feature-cell .feature-content{ flex: 1; min-width: 0;}
.feature-cell .feature-name{ font-size: 1.125rem; line-height: 1.5rem; font-weight: 700; color: var(--bs-body-color);}

.plan-check{ width: 2rem; height: 2rem; border-radius: 50%; background-color: var(--bs-primary); color: var(--bs-white); display: inline-flex; align-items: center; justify-content: center;}
.plan-check svg{ width: 1.125rem; height: 1.125rem; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round;}
.plan-cross{ width: 2rem; height: 2rem; color: var(--bs-gray-400); display: inline-flex; align-items: center; justify-content: center;}
.plan-cross svg{ width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round;}
.feature-limited{ font-size: .875rem; line-height: 1.25rem; font-weight: 600; color: var(--bs-gray-700); padding: .375rem .875rem; border-radius: 1.25rem; background-color: var(--bs-body-bg); border: 1px solid var(--bs-border-color); white-space: nowrap;}

.plans-row-head { background: none; }
.plans-row-head .plans-cell{ padding: 0;}
.plans-row-head .feature-cell{ padding: 1.5rem 2rem; align-items: flex-end; font-size: 1rem; font-weight: 700; color: var(--bs-gray-700); text-transform: uppercase; letter-spacing: .0625rem;}
.plans-row-head .plan-cell-head{ border-left: 0; padding: 0 5px; align-items: stretch; margin-bottom: 10px;}
.plan-head{ width: 100%; padding: 1rem 1.5rem; border-radius: 1.25rem; border: 1px solid #eee; background-color: var(--bs-white); position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; text-align: center;}
.plan-head .plan-top{ position: absolute; top: 0; left: 0; right: 0; height: .5rem; background-color: var(--bs-primary);}
.plan-head .plan-head-body{ width: 100%;}
.plan-head .plan-name{ font-size: 1.75rem; line-height: 2.25rem; font-weight: 700; color: var(--bs-body-color); margin-bottom: 0.25rem;}
.plan-head .plan-price-line{ display: flex; align-items: baseline; flex-wrap: wrap; justify-content: center; gap: .375rem;}
.plan-head .plan-amount{ font-size: 2.5rem; line-height: 2.75rem; font-weight: 700; color: var(--bs-body-color);}
.plan-head .plan-suffix{ font-size: 1rem; color: var(--bs-gray-700);}
.plan-head .plan-vat{ font-size: .9375rem; color: var(--bs-gray-700); margin-top: .375rem; margin-bottom: 0.5rem;}

.accordion {
  --bs-accordion-color: var(--bs-body-color);
  --bs-accordion-bg: #fff;
  --bs-accordion-border-color: #DFDFDF;
  --bs-accordion-border-width: 0;
  --bs-accordion-border-radius: 1.25rem;
  --bs-accordion-inner-border-radius: calc(1.25rem - 1px);
  --bs-accordion-btn-padding-x: 2rem;
  --bs-accordion-btn-padding-y: 1.25rem;
  --bs-accordion-btn-color: #071753;
  --bs-accordion-btn-bg: #fff;
  --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -1000 960 960' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M480-357.85 253.85-584 296-626.15l184 184 184-184L706.15-584 480-357.85Z'/%3e%3c/svg%3e");
  --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -1000 960 960' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M480-357.85 253.85-584 296-626.15l184 184 184-184L706.15-584 480-357.85Z'/%3e%3c/svg%3e");
  --bs-accordion-btn-icon-width: 2.5rem;
  --bs-accordion-btn-focus-border-color: #86b7fe;
  --bs-accordion-btn-focus-box-shadow: none;
  --bs-accordion-body-padding-x: 2rem;
  --bs-accordion-body-padding-y: .5rem;
  --bs-accordion-active-color: #071753;
  --bs-accordion-active-bg: #fff;
}
.accordion-item{ margin-bottom: 1rem; overflow: hidden; border-radius: var(--bs-accordion-border-radius); box-shadow: 0 3px 6px rgba(0, 0, 0, .16);}
.accordion-button { font-size: 1.5625rem; line-height: 1.15; font-weight: bold;}
.accordion-button:not(.collapsed):focus{ box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);}
.accordion-button:after{ background-color: #fff; background-size: 2rem; background-position: center; border-radius: 50%; box-shadow: 0 0 3px rgba(0, 0, 0, .1);}
.accordion-button:not(.collapsed):after{ background-color: var(--bs-primary);}

.footer{ padding: 5rem 0 3rem; background: #fff; position: relative;}
.footer > .container{ position: relative; z-index: 1;}
.footer-logo{ text-align: center;}
.footer-logo img{ max-height: 1.75rem;}
/*.footer-top{ padding-top: 5rem;}*/
/*.footer .items-nav{ margin-bottom: 3rem;}*/
.footer .items-nav .item-title{ margin-bottom: 1rem;}
.footer .items-nav .item-list{ list-style: none; margin: 0; padding: 0;}
.footer .items-nav .item-list li{ padding: .75rem 0; font-size: 1.25rem; line-height: 1.5rem; font-weight: 400; display: flex; align-items: center;}
.footer .items-nav .item-list li a{ display: flex; align-items: center;}
.footer .items-nav .item-list li a:hover{}
.footer .items-nav .item-list li .icon{ width: 2rem; height: 2rem; margin-right: 1.25rem; display: inline-block; background-repeat: no-repeat; background-position: center center; background-size: 1.875rem 1.875rem;}
.footer .items-nav .item-list li .icon-phone{ background-image: url(../images/icon-phone.png);}
.footer .items-nav .item-list li .icon-email{ background-image: url(../images/icon-email.png);}
.footer .items-nav .item-list li .icon-facebook{ background-image: url(../images/icon-facebook.png);}

.footer-bottom{ padding-top: 1.75rem;}
.footer-bottom .text-copy{ font-size: calc(1rem - 1px); line-height: 1.125rem; color: rgba(33,31,31,.3); text-align: center; margin-top: 3rem;}
.footer-image{ text-align: center;}
.footer-image img{ width: 150px; border-radius: .75rem;}

.section-build,
.section-customers,
.section-contacts{ position: relative;}
#rakennasinunoma,
#asiakkaitamme,
#yhteydenotto{ position: absolute; left: 0; top: -100px; width: 100%; height: 1px; opacity: 0;}
.windowHeight{ position: fixed; left: 0; top: 0; width: 1px; height: 100%; opacity: 0;}

#CookiebotWidget { display: none !important;}

/* @media CSS */

@media (max-width: 1199.98px) {
  h1, .h1{ font-size: 3.75rem; line-height: 4.5rem;} /* 60px */
  h2, .h2{ font-size: 2.5rem; line-height: 3.125rem;} /* 40px */
  h3, .h3{ font-size: 1.875rem; line-height: 2.375rem;} /* 30px */
  h4, .h4{ font-size: 1.5625rem; line-height: 2rem;} /* 25px */
  h5, .h5{ font-size: 1.375rem; line-height: 1.75rem;} /* 22px */
  h6, .h6{ font-size: 1.125rem; line-height: 1.5rem;} /* 18px */

  .btn{ font-size: 1.5rem; line-height: 1.875rem; padding: .75rem 1.25rem 1rem;}
  .btn-sm{ padding: .375rem 1.125rem .625rem; font-size: 1.25rem; line-height: 1.5rem;}
  .btn-text-25{ font-size: 1.375rem;}

  .section-nettiaika h4{ padding-left: 4rem;}
  .items-list li{ padding: 0 0 .125rem 3rem; margin-bottom: 1.25rem; font-size: 1.25rem; line-height: 1.875rem;}
  .items-list li .icon{ width: 2rem;}

  .contact-form{ /*padding: 190px 0 164px;*/ background-size: auto 100%;}
  /*.items-contact{ width: 510px; padding: 3rem 2.5rem 2.5rem; min-height: 808px;}*/

  .hero-content{ margin-top: 0;}
  .app-system-hero .hero-content{ margin-top: 0;}

  .yritys-hero{ min-height: 70vh;}
  .items-yt{ padding-left: 4.5rem; min-height: 3.5rem; font-size: 1.375rem;}
  .items-yt .icon{ width: 3.5rem;}

  .tietosuojalauseke-hero{ min-height: 80vh;}
  .items-ps{ padding-left: 10rem;}
  .items-ps .item-icon{ width: 6rem;}
  .items-ps .item-number{ left: 7.5rem;}

  .items-rs{ padding-left: 8rem;}
  .items-rs .item-icon{ width: 4.25rem;}
  .items-rs .item-number{ left: 5.5rem;}

  .free-trial-wrap{ padding: 1.25rem 1.5rem 1.5rem;}
  .free-trial-wrap .btn-close{ width: 1.25rem; height: 1.25rem; right: 1rem; top: 1rem; background-size: 1rem 1rem;}

  .pricing-hero{ min-height: 25vh;}
  .plans-row{ grid-template-columns: minmax(280px, 1fr); grid-auto-columns: minmax(200px, 300px);}
  .plans-cell{ padding: 1.25rem 1.5rem;}
  .plan-cell{ padding: 1.25rem .75rem;}
  .plans-row-head .feature-cell{ padding: 1.25rem 1.5rem;}
  .plan-head{ padding: 1.5rem 1.25rem;}
  .plan-head .plan-name{ font-size: 1.5rem; line-height: 2rem;}
  .plan-head .plan-amount{ font-size: 2.125rem; line-height: 2.5rem;}
}
@media (max-width: 991.98px) {
  .navbar-nav{ display: none;}

  .header .navbar{ min-height: 100px;}
  .header.active .navbar{ min-height: 80px;}
  .navbar-brand img{ max-height: 1.5rem; width: auto;}
  .navbar-collapse{ position: fixed; right: -320px; top: 100px; width: 320px; height: calc(100% - 100px) !important; display: block !important; overflow-y: auto; visibility: hidden; background-color: #fff; box-shadow: inset 0 5px 5px #ABC2D436, 0 5px 5px #ABC2D436; transition: all .3s ease;}
  .header.active .navbar-collapse{ top: 80px; height: calc(100% - 80px) !important;}
  .navbar-toggler[aria-expanded="true"] + .navbar-collapse{ right: 0; visibility: visible;}
  .toggle-navbar{ padding: 1.5rem; border-radius: 0; box-shadow: none;}
  .toggle-navbar ul li a{ font-size: 1.25rem; line-height: 1.75rem;}
  .toggle-navbar ul li a .nav-icon{ width: 1.5rem; margin-top: .125rem; margin-right: 1rem;}

  .section-hero{ padding-top: 9rem;}

  #rakennasinunoma,
  #asiakkaitamme,
  #yhteydenotto{ top:-56px;}

  .section-hero{ min-height: 0;}
  .yritys-hero{ min-height: 45vh;}

  .tietosuojalauseke-hero{ min-height: 60vh;}
  .tietosuojalauseke-hero .items-hero p{ width: 320px;}

  .rekisteriseloste-hero{ min-height: 60vh;}
}

@media (max-width: 767.98px) {
  :root {
    --bs-body-font-size: 1.25rem;
  }
  h1, .h1{ font-size: 2.5rem; line-height: 3.125rem;} /* 40px */
  h2, .h2{ font-size: 1.875rem; line-height: 2.25rem;} /* 30px */
  h3, .h3{ font-size: 1.5625rem; line-height: 2rem;} /* 25px */
  h4, .h4{ font-size: 1.375rem; line-height: 1.75rem} /* 22px */
  h5, .h5{ font-size: 1.25rem; line-height: 1.5rem;} /* 20px */
  h6, .h6{ font-size: 1rem; line-height: 1.25rem;} /* 16px */

  .header .navbar{ min-height: 80px;}
  .header.active .navbar{ min-height: 60px;}
  .navbar-brand img{ max-height: 1.25rem;}
  .navbar-collapse{ top: 80px; height: calc(100% - 80px) !important;}
  .header.active .navbar-collapse{ top: 60px; height: calc(100% - 60px) !important;}

  .form-control,
  .form-select,
  .chosen-container-single .chosen-single{ height: 2.875rem; padding: .625rem 1rem; font-size: 1rem;}
  .chosen-container-single .chosen-single{ padding-right: 2.75rem;}
  .chosen-container .chosen-results{ padding: 1rem 0;}
  .chosen-container .chosen-results li{ padding: .375rem 1.5rem;}

  .btn{ font-size: 1.125rem; line-height: 1.75rem; padding: .5rem 1.25rem .625rem;}
  .btn-sm{ padding: .25rem 1.125rem .5rem; font-size: 1rem; line-height: 1.25rem;}
  .btn-text-25{ font-size: 1.125rem;}

  .section{ padding: 2.5rem 0 0;}
  .section-title{ margin-bottom: 2rem;}
  .section.p-mb-4{ padding-bottom: 1.5rem;}
  .section-content-20 p{ font-size: 1rem; line-height: 1.5rem;}
  .p-mb-4 p{ margin-bottom: 1rem;}

  .section-hero{ padding-top: 6rem;}
  .section-hero .hero-image{ position: relative; top: 0; max-width: 100%; width: 100%; margin-top: 1.5rem;}

  .section-customers{ padding: 2rem 0;}

  .section-nettiaika h4{ margin-bottom: 1.25rem; padding-left: 3rem;}
  .items-list li{ padding: 0 0 .125rem 3rem; margin-bottom: 1rem; font-size: 1.125rem; line-height: 1.5rem;}
  .items-list li .icon{ width: 1.5rem;}

  .slider-build{ padding: 0 1.5rem;}
  .slider-build .item-image{ padding: 0 .375rem .5rem;}

  .items-reasons{ padding-left: 5.75rem; min-height: 4rem;}
  .items-reasons .item-icon .icon-png,
  .items-reasons .item-icon .icon-gif{ width: 4rem;}

  .section-contacts{ padding: 2.5rem 1.5rem;}
  .contact-form{ padding: 0; background: none;}
  .items-contact{ padding: 1rem 1.5rem 1.5rem; background-size: 2.5rem auto; min-height: 100px; border-radius: 1rem;}
  .items-contact p{ font-size: 1rem; line-height: 1.5rem;}

  .free-trial-wrap{ min-height: calc(100vh - 2.5rem);}
  .free-trial-form p{ margin: .25rem 0 .75rem; font-size: 1rem;}
  .free-trial-modal-body{ padding: 1.25rem 0;}
  .free-trial-modal-body .item-animate{ display: none;}
  .free-trial-modal-body .btn{ font-size: 1.125rem; line-height: 1.75rem;}

  .modal{ --bs-modal-title-line-height: 1.5rem;}
  .modal-title{ padding-right: 1rem;}
  /*.modal-body{ padding: 1.25rem 1.5rem 1.5rem;}*/
  /*.modal-body .btn-close{ width: 2rem; height: 2rem; background-size: 2rem 2rem; top: .75rem; right: 1rem;}*/

  .items-nettiajan{ text-align: center;}

  .section-app-system{ padding-top: 0; padding-bottom: 2.5rem;}

  .yritys-hero .hero-image{ padding: 0 1.25rem;}
  .section-text{ font-size: 1.375rem; line-height: 1.75rem; margin-bottom: 2.5rem;}
  .items-yt{ padding-left: 3.5rem; min-height: 2.5rem; font-size: 1.25rem; line-height: 1.75rem;}
  .items-yt .icon{ width: 2.5rem;}

  .tietosuojalauseke-hero .hero-image{ padding-left: 1.25rem; padding-right: 1.25rem; right: 0;}
  .items-ps{ padding-left: 0; padding-top: 6rem;}
  .items-ps .item-icon{ width: 5rem;}
  .items-ps .item-number{ left: 0; top: 6rem;}
  .items-ps .item-title:not(.not-number){ padding-left: 1.5rem;}

  .rekisteriseloste-hero .hero-image{ padding-left: 1.25rem; padding-right: 1.25rem;}

  .accordion {
      --bs-accordion-border-radius: 1rem;
      --bs-accordion-inner-border-radius: calc(1rem - 1px);
      --bs-accordion-btn-padding-x: 1.25rem;
      --bs-accordion-btn-padding-y: 1rem;
      --bs-accordion-btn-icon-width: 2rem;
      --bs-accordion-body-padding-x: 1.25rem;
      --bs-accordion-body-padding-y: .25rem;
    }
  .accordion-button { font-size: 1.125rem;}
  .accordion-body{ font-size: 1.125rem;}

  .pricing-hero{ min-height: 0;}
  .section-plans{ padding-bottom:2rem;}
  .plans-row{ grid-template-columns: minmax(180px, 1fr); grid-auto-columns: 150px;}
  .plans-cell{ padding: .5rem 1rem;}
  .plan-cell{ padding: .5rem;}
  .plans-row-head .feature-cell{ padding: 1rem 1.25rem; font-size: .8125rem;}
  .feature-cell{ gap: .75rem;}
  .feature-cell .feature-icon{ width: 2rem; height: 2rem; border-radius: .5rem;}
  .feature-cell .feature-icon svg{ width: 1.125rem; height: 1.125rem;}
  .feature-cell .feature-name{ font-size: .875rem; line-height: 1rem;}
  .plan-head{ padding: 1rem .5rem;}
  .plan-head .plan-name{ font-size: 1rem; line-height: 1.25rem; margin-bottom: .25rem;}
  .plan-head .plan-amount{ font-size: 1.5rem; line-height: 1.75rem;}
  .plan-head .plan-suffix{ font-size: .75rem;}
  .plan-head .plan-vat{ font-size: .75rem; margin-bottom: .5rem;}
  .plan-check{ width: 1.625rem; height: 1.625rem;}
  .plan-check svg{ width: .9375rem; height: .9375rem;}
  .feature-limited{ font-size: .75rem; padding: .25rem .5rem;}

  .footer{ padding: 2rem 0 2rem;}
  .footer-logo img{ max-height: 1.25rem;}
  /*.footer-top{ padding-top: 2rem;}*/
  .footer .items-nav{ margin-bottom: 2rem;}
  .footer .items-nav .item-title{ margin-bottom: 1rem;}
  .footer .items-nav .item-list li{ padding: .5rem 0; font-size: 1rem; line-height: 1.25rem;}
  .footer .items-nav .item-list li .icon{ width: 1.25rem; height: 1.25rem; margin-right: 1rem; background-size: contain;}
  .footer-bottom{ padding-top: 0;}
  .footer-bottom .text-copy{ margin-top: 2rem;}
}

@media (max-width: 575.98px) {
  .container{ padding-left: 1.5rem; padding-right: 1.5rem;}
  .chosen-container .chosen-drop{ width: 100%;}

  .home-hero .hero-image img{ max-width: calc(100% - 1.5rem);}

  .items-list-wrap{ width: 267px; max-width: 100%; margin: 0 auto;}

  .section-inner-hero ~ section{ padding-top: 1.5rem;}
  .section-nettiajanvaraus .item-text{ padding: 0 1.5rem; font-size: 1.125rem;}

  .items-rs{ padding-left: 0; padding-top: 5.25rem;}
  .items-rs .item-icon{ width: 4.25rem;}
  .items-rs .item-number{ left: 0; top: 5.25rem;}
  .items-rs .item-title:not(.not-number){ padding-left: 1.5rem;}
}

@media (min-width: 576px) {
  .modal-md{ --bs-modal-width: 540px;}

  .section-inner-hero .item-title{ position: absolute; left: 0; top: 0; width: 100%; padding: 5.5vw 0 30px;}
  .section-nettiajanvaraus .item-text{ position: absolute; right: 9%; bottom: 18%;}
}
@media (min-width: 768px) {
  .items-list-wrap{ display: inline-block;}

  .arrow-link{ background: url(../images/icon-arrow-right.png) right .5rem center no-repeat; background-size: 1.75rem auto; padding-right: 3.25rem;}
  .arrow-link:hover{ background-position: right 0 center;}

  .section-contacts .section-title{ margin-bottom: -3.75rem;}

  .items-nettiajan .item-icon{ margin-left: -1rem;}

  .nettiajanvaraus-hero .hero-image{ width: 56%;}
  .rekisteriseloste-hero .hero-image{ width: 50%;}

  .items-contact .mb-3,
  .free-trial-form .mb-3{ position: relative;}
  .items-contact label.error,
  .free-trial-form label.error{ position: absolute; left: 100%; top: .25rem; width: auto; background: var(--bs-danger); color: #fff; font-size: 1rem; padding: .75rem 1rem; margin: 0 0 0 .625rem; font-weight: 400; white-space: nowrap; border-radius: .4375rem;}
  .items-contact label.error:before,
  .free-trial-form label.error:before{ content: ""; border-top: 7px solid transparent; border-bottom: 7px solid transparent; border-right: 9px solid var(--bs-danger); position: absolute; left: -9px; top: 50%; margin-top: -7px;}
}

@media (min-width: 992px) {
  .navbar-brand{ margin-right: 0;}
  .navbar-nav{ --bs-nav-link-font-size: 1.25rem;}
  .navbar-nav .nav-item{ margin: 0 1rem;}
  .navbar-collapse{ width: 950px;}
  /*.toggle-navbar ul{ opacity: 0; transition: all .5s ease;}
  .navbar-collapse.show .toggle-navbar ul{ opacity: 1;}*/

  .nettiajanvaraus-hero .hero-image{ width: 80%; right: 2rem;}
}

@media (min-width: 1200px) {
  h1, h2, h3, h4, h5, h6,
  .h1, .h2, .h3, .h4, .h5, .h6 { font-weight: 400;}
  h1, .h1{ font-size: 4.5rem; line-height: 5.125rem;} /* 72px */

  .gx-xl-40{ --bs-gutter-x: 2.5rem;}

  .navbar-nav{ --bs-nav-link-font-size: 1.375rem; --bs-nav-link-font-weight: 400;}
  .navbar-nav .nav-item{ margin: 0 1.5rem;}
  .navbar-collapse{ width: 950px;}
  .toggle-navbar ul li a{ font-weight: 400;}

  .btn{ font-weight: 400;}

  .items-cst-logo .item-logo{ margin-top: .75rem;}

  .home-hero{ padding: 10rem 0 7.75%; display: flex; align-items: end;}
  .home-hero .hero-content{ width: 100%;}
  .hero-content{ margin-top: 2rem;}
  .nettiajanvaraus-hero .hero-image{ right: 0;}
  .yritys-hero .hero-image{ bottom: 4.5rem; width: 63%;}

  .items-reasons .item-title{ font-weight: 400;}
  .items-yt{ font-weight: 400;}
  .items-ps .item-text b{ font-weight: 400;}

  .rekisteriseloste-hero .hero-content{ margin-top: 4rem;}

  .section-build .section-title{ margin-bottom: 2rem;}
}

@media (min-width: 1440px) {
  h1, .h1{ font-size: 5rem; line-height: 5.625rem;} /* 80px */

  .container-xl{ max-width: 1144px;}
  .navbar-nav .nav-item{ margin: 0 1.875rem;}

  .hero-content{ margin-top: 3rem;}

  .rekisteriseloste-hero .hero-content{ margin-top: 6rem;}
  .rekisteriseloste-hero .hero-image{ width: 70%;}
}

@media (min-width: 1681px) {
  h1, .h1{ font-size: 5.625rem; line-height: 6.25rem;} /* 90px */

  .container-xxxl{ max-width: 1600px;}
  .home-hero .hero-image{ max-width: 50%;}

  .section-nettiajanvaraus .item-text{ bottom: 37%;}
}

@media (min-width: 2200px) {
  .home-hero{ align-items: center;}
}

@media (min-width: 1200px) and (max-height: 800px) {
  html{ font-size: 15px;}
  .toggle-navbar{ padding: 3rem 4rem;}
  .toggle-navbar .gy-lg-5{ --bs-gutter-y: 2rem;}
  .toggle-navbar .pt-lg-5{ padding-top: 2rem !important;}
}

@media (resolution: 1.25dppx) {
  .home-hero{ padding: 8rem 0 5.75%;}
}

@media (resolution: 1.5dppx) {
  .home-hero{ padding: 8rem 0 5.75%;}
}