@font-face {
       font-family: 'Segoe UI';
       font-style: normal;
       font-weight: 300;
       font-display: swap;
       src: url(../fonts/SegoeUI.ttf) format('truetype');
   }

   @font-face {
       font-family: 'Segoe UI';
       font-style: normal;
       font-weight: bold;
       font-display: swap;
       src: url(../fonts/SegoeUI-bold.ttf) format('truetype');
   }

   :root {
       --bs-nav-link-color: #000 !important;
       --bs-navbar-color: #000 !important;
       --bs-emphasis-color-rgb: #000 !important;
       --bs-nav-link-hover-color: #007bff !important;
       --bs-btn-active-bg: #0067B8 !important;
       --bs-btn-border-color: #0067B8 !important;
       --bs-btn-hover-bg: #0067B8 !important;
       --bs-btn-bg: #0067B8 !important;
   }

   .btn-primary {
       background-color: #0067B8;
       border-color: #0067B8;
   }

   body {
       font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
       background-color: #FFF;

   }

   header {
       position: sticky;
   }

   /* Components START */

   ul,
   li {
       margin: 0;
   }

   /* Headings */
   .h2,
   h2 {
       font-size: 37px;
   }

   .h3,
   h3 {
       font-size: 29px;
   }

   @media screen and (max-width: 767px) {

       .h2,
       h2 {
           font-size: 24px;
       }
   }

   /* Margins */
   .mb-14 {
       margin-bottom: 14px;
   }

   .mb-40 {
       margin-bottom: 40px;
   }

   .mb-60 {
       margin-bottom: 60px;
   }

   .mb-70 {
       margin-bottom: 70px;
   }

   .mb-80 {
       margin-bottom: 80px;
   }

   .my-100 {
       margin-block: 100px;
   }

   .my-180 {
       margin-block: 180px;
   }

   @media screen and (max-width: 767px) {
       .mb-40 {
           margin-bottom: 16px;
       }

       .mb-60 {
           margin-bottom: 50px;
       }

       .mb-70 {
           margin-bottom: 40px;
       }

       .my-180 {
           margin-block: 70px;
       }
   }

   /* Paddings */
   .py-64 {
       padding-block: 64px;
   }

   .py-74 {
       padding-block: 74px;
   }

   .py-124 {
       padding-block: 124px;
   }

   .py-140 {
       padding-block: 140px;
   }

   @media screen and (max-width: 767px) {
       .py-124 {
           padding-block: 60px;
       }
   }


   /* Gaps */
   .gap-60 {
       gap: 60px;
   }

   @media screen and (max-width: 767px) {

       .gap-100 {
           gap: 40px;
       }
   }

   /* Font Sizes */

   .fs-60 {
       font-size: 60px;
   }

   /* Buttons */
   .btn {
       border-radius: 3px;
       font-weight: 600;
   }

   /* Background Colors */
   @media screen and (max-width: 767px) {
       .bg-grey {
           background: #F2F2F2;
       }
   }

   /* Components END */


   header .navbar {
       height: 95px;
   }

   .navbar-expand-lg .navbar-nav {
       gap: 34px;
   }

   .hero .container::after {
       content: '';
       position: absolute;
       top: 0;
       bottom: 0;
       left: -50px;
       right: -50px;
       background: linear-gradient(to bottom right, #cbcbcb, #e9eff5);
       border-bottom-right-radius: 5px;
       border-bottom-left-radius: 5px;
       z-index: -1;
   }

   .copilot-logo {
       bottom: -50px;
       right: -95px;
   }

   .logo {
       max-height: 23px;
   }

   .logo-wrapper:first-child {
       margin-right: 50px;
   }


   .logo-wrapper:first-child::after {
       content: '';
       position: absolute;
       top: 0;
       right: -22px;
       display: block;
       background-color: #70707075;
       width: 1px;
       height: 35px;
   }

   .video-image {
       border-radius: 8px;
       overflow: hidden;
       cursor: pointer;
   }

   .video-overlay {
       position: absolute;
       top: 50%;
       left: 50%;
       transform: translate(-50%, -50%);
       font-size: 3rem;
       color: white;
   }

   .hero-buttons .btn {
       margin-right: 1rem;
   }

   @media screen and (max-width: 1525px) {
       .copilot-logo {
           bottom: -50px;
           right: 50%;
           transform: translateX(50%);
       }
   }

   [id] {
       scroll-margin-top: 115px;
   }

   @media screen and (max-width: 1350px) {
       section .special-container::after {
           left: -15px !important;
           right: -15px !important;
           overflow: hidden;
       }
   }

   @media screen and (max-width: 1199px) {
       .logo {
           max-height: 17px;
       }

       .navbar-expand-lg .navbar-nav {
           gap: 20px;
       }
   }

   @media screen and (max-width: 1010px) {
       section .special-container::after {
           left: 0 !important;
           right: 0 !important;
       }

   }

   @media screen and (max-width: 991px) {
       header .navbar {
           max-width: calc(100% - 20px);
           background-color: #f2f2f2;
           height: unset;
           border-bottom: 0.20000000298023224px solid #cdcdcd;
       }

       .logo {
           max-height: 21px;
       }

       .hero {
           max-width: calc(100% - 20px);
           background-color: #f2f2f2;
       }

       .hero .container::after {
           content: unset;
       }

       .navbar-expand-lg .navbar-nav {
           gap: 30px;
       }

       .nav-link {
           padding-block: 0;
       }

       .navbar-expand-lg .navbar-nav .nav-item:not(:last-child)::after {
           content: '';
           position: absolute;
           top: 0;
           right: -15px;
           display: block;
           background-color: #707070;
           width: 1px;
           height: 100%;
       }

       .hero {
           border-bottom-right-radius: 8px;
           border-bottom-left-radius: 8px;
       }
   }

   @media screen and (max-width: 767px) {
       #uvod .container {
           padding-block: 50px 140px;
       }

       .logo {
           max-width: 100%;
       }
   }


   @media screen and (max-width: 500px) {
       .navbar-brand {
           display: flex;
           flex-direction: column;
           gap: 20px;
           align-items: center;
           margin-bottom: 25px !important;
       }

       .logo-wrapper:first-child {
           margin-right: 0;
       }

       .logo-wrapper:first-child::after {
           content: unset;

       }

       .logo {
           max-height: 24px;
           margin-inline: auto;

       }


       .navbar-expand-lg .navbar-nav {
           row-gap: 12px;
       }

       [id] {
           scroll-margin-top: 180px;
       }

   }

   @media screen and (min-width: 453px) and (max-width: 500px) {
       .navbar-nav li:nth-child(4)::after {
           content: unset !important;
       }
   }

   @media screen and (max-width: 452px) {
       .navbar-nav li:nth-child(3)::after {
           content: unset !important;
       }
   }

   @media screen and (max-width: 401px) {
       .navbar-nav li:nth-child(3)::after {
           content: unset !important;
       }
   }



   /* End of Support Section  START*/

   .end-support ul {
       max-width: 450px;
   }

   .end-support .col-center:after {
       content: '';
       position: absolute;
       top: 0;
       right: 50%;
       transform: translateX(-50%);
       display: block;
       background-color: #707070;
       width: 1px;
       height: 100px;
   }

   .countdown {
       text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
       letter-spacing: 2px;
   }

   .countdown-display {
       min-width: 370px;
   }

   .countdown-label {
       color: rgba(255, 255, 255, 0.8);
       font-size: 1.2rem;
       margin-top: 20px;
       font-weight: 300;
   }

   .time-unit {
       display: inline-block;
       margin: 0 10px;
       text-align: center;
   }

   .time-number {
       display: block;
       font-size: 3.5rem;
       font-weight: 600;
       line-height: 1;
   }

   .time-label {
       display: block;
       font-size: 0.9rem;
       margin-top: 5px;
       text-transform: uppercase;
       letter-spacing: 1px;
   }

   @media screen and (min-width: 992px) and (max-width: 1199px) {
       .time-unit {
           width: 76px;
       }

       .time-unit:first-child,
       .time-unit:nth-child(2) {
           margin-bottom: 20px;
       }
   }

   @media (max-width: 991px) {
       .countdown-display {
           min-width: unset;
       }
   }

   @media (max-width: 767px) {

       .my-100 {
           margin-block: 50px;
       }

       .fs-60,
       .time-number {
           font-size: 2.5rem !important;
       }

       .countdown-container {
           padding: 20px;
           margin: 20px;
       }

       #end-support {
           margin-block: 100px 40px;
       }
   }

   /* End of Support Section  END*/

   /* Mirek a Pavel Section START*/

   .mirek-pavel .container::after {
       content: '';
       position: absolute;
       top: 0;
       bottom: 0;
       left: -50px;
       right: -50px;
       background: #F2F2F2;
       z-index: -1;
   }


   .pavel-img {
       position: relative;
   }

   @media screen and (min-width: 768px) {

       .pavel-col {
           position: relative;
           z-index: 1;
           top: -150px;
       }

       .mirek-img {
           width: calc(100% + 20px);
           position: relative;
       }


   }

   @media screen and (max-width: 767px) {
       .mobile-bg-holder {
           max-width: calc(100% - 20px);
           background-color: #f2f2f2;
           margin-inline: auto;
       }

       .mirek-pavel .container::after {
           content: unset;
       }

       .mirek-col,
       .pavel-col {
           padding-inline: 35px
       }
   }

   /* Mirek a Pavel Section END */

   /* Jak přejít Section START */

   .prechod .container::after {
       content: '';
       position: absolute;
       top: 0;
       bottom: 0;
       left: -50px;
       right: -50px;
       background: #F2F2F2;
       z-index: -1;
   }


   .prechod .col-md-4:not(:first-child)::after {
       content: '';
       position: absolute;
       top: 0;
       left: -65px;
       width: 1px;
       height: 99%;
       background-color: #cdcdcd;
   }

   .prechod p {
       max-width: 200px;
   }

   @media screen and (min-width: 1200px) {
       .prechod .col-md-4:first-child {
           width: 30%;
       }

   }

   @media screen and (max-width: 1199px) {


       .prechod .col-md-4:nth-child(2)::after {
           left: -40px;
       }

       .prechod .col-md-4:last-child::after {
           left: -23px;
       }
   }

   @media screen and (min-width: 991px) and (max-width: 1199px) {
       .prechod .col-md-4:first-child {
           width: 36%;
       }
   }

   @media screen and (max-width: 991px) {


       .prechod .col-md-4::after {
           content: unset !important
       }
   }


   @media screen and (max-width: 767px) {
       .prechod .container::after {
           content: unset;
       }
   }


   /* Jak přejít Section END */

   /* Konzultace + Značky Section START */
   #konzultace small {
       display: block;
   }

   .info-box::after {
       content: '';
       position: absolute;
       top: 0;
       bottom: 0;
       left: -50px;
       right: 10px;
       background: #F2F2F2;
       z-index: -1;
   }

   .info-box::before {
       content: '';
       position: absolute;
       top: 0;
       bottom: 0;
       left: -50px;
       width: 4px;
       background: #0067B8;
       z-index: 1;
   }

   .form-control {
       font-size: 14px;
       border: 0;
       border-radius: 0;
       background-color: #F2F2F2;
       padding: 20px 16px;
   }

   @media screen and (max-width: 1525px) {
       .copilot-logo {
           bottom: -50px;
           right: 50%;
           transform: translateX(50%);
       }

       .info-box::before,
       .info-box::after {
           left: -20px;
       }
   }

   @media screen and (max-width: 767px) {
       #konzultace {
           background-color: transparent;
           margin-bottom: 80px;
       }

       #konzultace .col-md-7 .info-box {
           background-color: #f2f2f2;
           border-left: 4px solid #0067B8;
       }

       .info-box::before,
       .info-box::after {
           content: unset;
       }

       .form-control {
           padding: 15px 10px;
       }

   }


   /* Konzultace + Značky Section END */

   /* Výběr značky Section START */

   .slider-container {
       overflow: hidden;
       position: relative;
   }

   .slider-wrapper {
       display: flex;
       transition: transform 0.3s ease-in-out;
       padding-block: 25px;
   }

   .slider-item {
       min-width: 33.333%;
       padding: 0 15px;
       box-sizing: border-box;
   }

   .slider-item img {
       max-width: 200px;
       max-height: 160px;
       height: 100% !important;
       margin-inline: auto;
   }

   @media (max-width: 768px) {
       .slider-item {
           min-width: 100%;
       }
   }

   @media (min-width: 769px) and (max-width: 1024px) {
       .slider-item {
           min-width: 50%;
       }
   }

   .card {
       transition: all 0.3s ease;
   }

   .card-title {
       min-height: 58px;
   }

   .card:hover {
       transform: translateY(-5px);
       box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
   }

   .btn-link {
       color: #0d6efd;
       text-decoration: none;
       height: 40px;
       padding: 10px;
       border-radius: 50%;
       transition: all 0.3s ease;
   }

   .btn-link:hover {
       color: #0a58ca;
       background-color: #f8f9fa;
       transform: scale(1.1);
   }

   .btn-link:active {
       background-color: aliceblue !important;
   }

   .btn-link img {
       max-width: 20px;
       height: 20px;
   }

   .slider-arrows {
       z-index: 1;
   }

   #nextBtn {
       right: -25px;
   }

   #prevBtn {
       left: -25px;
   }

   #prevBtn img {
       transform: rotate(90deg);
   }

   #nextBtn img {
       transform: rotate(270deg);
   }

   .product-dots {
       display: flex;
       justify-content: center;
       gap: 10px;
       margin-top: 30px;
   }

   #dotsContainer {
       display: none;
   }

   .dot {
       width: 12px;
       height: 12px;
       border-radius: 50%;
       background-color: #dee2e6;
       cursor: pointer;
       transition: all 0.3s ease;
   }

   .dot.active {
       background-color: #0d6efd;
       transform: scale(1.2);
   }

   @media screen and (max-width: 1525px) {
       #prevBtn {
           left: -20px;
       }

       #nextBtn {
           right: -20px;
       }
   }

   @media screen and (max-width: 1199px) {
       #zarizeni .container {
           width: 90%;
       }

       #prevBtn {
           left: -40px;
       }

       #nextBtn {
           right: -40px;
       }
   }

   @media screen and (max-width: 991px) {
       #zarizeni .container {
           width: 75%;
       }
   }

   /* Výběr značky Section END */

   /* Výběr konkrétního produktu Section START */

   .card {
       border: 0;
   }

   /* Výběr konkrétního produktu Section END */


   /* Footer START */

   footer .container {
       padding-block: 100px 54px;
   }

   .footer-links a {
       color: #000000;
       text-decoration: none;
   }

   .list-inline-item:not(:last-child)::after {
       content: '';
       position: absolute;
       top: 0;
       right: -25px;
       display: block;
       background-color: #707070;
       width: 1px;
       height: 100%;
   }

   .list-inline-item:not(:last-child) {
       margin-right: 50px;
   }

   .grecaptcha-badge {
       visibility: hidden !important;
   }

   @media screen and (max-width: 567px) {
       footer .container {
           padding-block: 70px 54px;
       }
   }

   @media screen and (max-width: 567px) {
       footer img {
           max-width: 100%;
       }
   }

   /* Footer END */