:root {
  --blue: #4AA2E2;
}

.btn {
    --bs-btn-border-color: var(--blue);
    --bs-btn-hover-bg: var(--blue);
    --bs-btn-hover-border-color: var(--blue);
    --bs-btn-active-bg: var(--blue);
    --bs-btn-active-border-color: var(--blue);
    --bs-btn-disabled-color: var(--blue);
    --bs-btn-disabled-border-color: var(--blue);
}

.btn-outline-primary {
    --bs-btn-color: var(--blue);
}

.page-link {
    color: var(--blue);
}
.active>.page-link,
.page-link.active {
    background-color: var(--blue);
    border-color: var(--blue);
}

/* header */

body {
    min-height: 100vh;
    margin: 0;
}



#header {

    padding-top: 30px;

    .toggle-menu-close {


        filter: invert(28%) sepia(30%) saturate(7499%) hue-rotate(187deg) brightness(92%) contrast(102%);
    }


    @media (max-width: 992px) {
        .start-investing:hover {
            padding-top: 50px !important;
        }
    }


}

.container {
    position: relative;
}

.change-language {
    display: none;
}

.mobile-change-language {
    margin: auto;
    margin-right: 0 !important;

    .dropdown-toggle::after {
        content: unset;
        background: none;
    }

}

.mobile-change-language::after {

    content: unset;
    background: none;
}

.mobile-change-language:hover {
    padding-top: 0;

    color: var(--blue);
    border-bottom: none;
}

.navbar {
    animation: slideInTop .3s ease-in;
    margin-bottom: 30px;
}

.nav-item .active,
.nav-link:hover {
    color: var(--blue) !important;
    border-bottom: 1px solid var(--blue);
}


.dropdown-menu.show {
    .dropdown-item:hover,
    li:hover {
        border-radius: 0.375rem;
    }
}

.nav-link.start-investing {
    color: var(--blue);
}

.nav-link.start-investing:hover {
    color: #015a94;
    border: none;
}

.navbar-collapse {
    justify-content: flex-end;
}

.nav-link {
    color: #000000;
    font-weight: 500;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.dropdown-menu {
    min-width: auto;
    width: auto;
    padding: 0;
}

.dropdown-item {
    white-space: nowrap;
    padding: 0.5rem 1rem;
}

body{
    display: flex;
    flex-direction: column;
}
main{
    flex-grow: 1;
}


.hsubmenu {
    background-color: var(--blue);
    color: #fff;
}

.page_title {
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    font-size: 22px;
    line-height: 46px;
    margin: 0;
}

.logo-container-mobile {
    margin-bottom: 20px;
}

/* footer */

#footer {
    background-color: var(--blue);
    color: #fff;
    padding-top: 2rem;

    .social {
        img, svg {
            margin-right: 2rem;
        }
    }

    .second-row {
        margin-top: 8px;
        padding: 24px 0;
        border-top: 1px solid;

        .footer-bottom {
            text-align: right;
        }
    }

    a,
    p {
        color: #fff;
        text-decoration: none;
    }

    .img-fluid {
        max-width: 170px;
    }

    .footer-content-logo {
        text-align: end;
    }

    @media (min-width: 768px) and (max-width: 992px) {
        .footer-bottom {
            margin-top: 1.125rem;
        }
    }

    @media (min-width: 1140px) {
        .container {
            max-width: 1140px;
        }
    }
    @media (min-width: 992px) and (max-width: 1139px) {
        .footer-content-logo {
            a {
                font-size: .9375rem;
            }
        }
    }
    @media (max-width: 768px) {
        .social {
            img[alt="linkedin"] {
                margin-left: 0 !important;

            }
        }

        .social:first-child {
            a {
                margin-left: 0;
            }
        }

        .footer-bottom {
            text-align: center !important;

            a {
                font-size: 1rem;
            }

            .col-12.col-md-4 {
                padding-top: .625rem;
            }

        }
    }

    @media (max-width: 576px) {
        .footer-logo {
            order: 2;
            text-align: center;
            margin-top: 1.25rem;
        }
        .footer-content-logo {
            order: 1;
        }
        .footer-bottom {
            .col-4 {
                text-align: left;
                font-size: .8125rem
            }
        }
    }
}

/* sidebar */

.search-bar-wrap {
    margin-bottom: 16px;
}

#search-product:focus {
    box-shadow: none !important;
}

.product-sidebar {
    color: #626262;
    font-family: 'Open Sans', sans-serif;
}

input:focus {
    outline: none;
}

#search-product,
.price-input {
    border: 1px solid #eaeaea;
    border-radius: 3px;
    padding: 8px;
    width: 100%;
    height: 40px;
}

#search-product {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.custom-btn {
    color: #fff;
    background-color: var(--blue);
    border: 1px solid var(--blue);
    border-radius: 3px;
    transition: background-color 0.3s ease, border 0.3s ease;
    height: 40px;
}

.custom-btn:hover {
    background-color:#0775a1;
    border: 1px solid #0775a1;
    color: #fff;
}

#search-btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.clear-search {
    border-radius: 0;
}

.price-input {
    margin-bottom: 16px;
}

#sidebar h3 {
    font-weight: bold;
    font-size: 18px;
    margin-bottom: 10px;
    margin-top: 9px;
}

.categories,
.filtering-list {
    padding-left: 0;
}

.categories li,
.filtering-list li {
    list-style: none;
    margin-left: 0;
    border-bottom: 1px solid #f0f0f0;
}

.categories a {
    display: block;
    color: #6a6a6a;
    font-size: 13px;
    padding: 7px 0;
    transition: color 0.3s ease, transform 0.3s ease;
}

.categories a:hover {
    color: var(--blue);
    transform: translateX(10px);
}

.btn-secondary {
    background-color: #E7E7E7;
    border: #E7E7E7 1px solid;
    color: #7D7D7D;
    border-radius: 3px;
}

/* categories */

.categories-select {
    display: none;
    width: 100%;
    border-color: #e3e3e3;
    margin: 6px 0;
    padding: 8px;
    border-radius: 3px;
}

/* filter */

.filter-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.filter-header #close-filter {
    font-size: 12px;
}
.close-filter-text {
    vertical-align: middle;
    cursor: pointer;
}

.filter-group {
    margin: 20px 0;
}

.filtering-title {
    font-size: 14px;
    font-weight: bold;
}

.filtering-title svg {
    float: right;
}

.filtering-list {
    padding-top: 10px;
}

.filtering-list li {
    display: flex;
    padding: 7px 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 12px;
    line-height: 14px;
}

.filtering-list label {
    display: inline-block;
    font-size: 12px;
    margin-left: .5rem;
    margin-right: 1rem;
    margin-bottom: 0;
    vertical-align: baseline;
}

/* price */

.price-filter {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.price-input {
    width: 32%;
    margin: 0;
}

#price-search-btn {
    padding: 8px !important;
    border-radius: 3px !important;
}



.btns-block {
    display: flex;
    flex-direction: column;
}



.range-block {
    margin-bottom: 12px;
}

.range-text {
    font-size: 12px;
    margin-bottom: 8px;
}

.noUi-connect {
    background-color: var(--blue) !important;
}

.noUi-horizontal .noUi-handle {
    width: 20px !important;
    height: 22px !important;
    right: -10px !important;
    top: -3px !important;
}

.noUi-handle:before {
    left: 7px !important;
    top: 3px !important;
}

.noUi-handle:after {
    left: 11px !important;
    top: 3px !important;
}

/* breadcrumb */

a {
    text-decoration: none;
    color: var(--blue);
    transition: all 200ms ease-in-out;
}

.breadcrumb {
    background-color: white;
    margin-bottom: 30px;
    padding: 9px 2px;
    border: 0;
    border-bottom: 1px solid #e6e6e6;
}

.breadcrumb * {
    margin: 0;
    float: left;
    font-size: .6875rem;
    line-height: .6875rem;
    text-transform: uppercase;
}

.breadcrumb-item a {
    color: #0992c9;
    transition: color .3s ease-out;
}

.breadcrumb-item a:hover {
    color: #2F5B7B;
}

.breadcrumb .active span {
    color: #757575;
}



/* index page */

section {
    background-color: #fff;
}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

.main-container {
    padding-top: 48px;
}

.groups {
    font-family: 'Open Sans', sans-serif;
    color: #6b6b6b;
    /* font-weight: bold; */
    margin: 0;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    line-height: 40px;
    font-size: 18px;
    padding-left: 10px;
    margin-bottom: 1rem;
    background-color: #ececec;
    text-align: left;
}


.product-cover {
    max-height: 140px;
    object-fit: contain;
}

.badge {
    font-size: 11px;
    vertical-align: middle;
    background-color: #088FC7;
}



/* View page */

hr {
    border-width: 1px 0 0;
    margin: 1.25rem 0 1.1875rem;
    height: 0;
}

h2 {
    font-size: 22px;
    font-family: 'Open Sans', sans-serif;
    font-weight: normal;
    margin-bottom: 18px;
    margin-top: 26px;
    color: #626262;
}

.pull-right {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

#contact-info {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}


.product-image-block {
    background-color: #2a3850;
    height: 260px;
    width: 100%;
}

.product-main-image {
    height: 260px;
    width: 100%;
    object-fit: cover;
    object-position: right;
}

.youtube-video-container {
    position: relative;
    width: 560px;
    height: 315px;
    background-color: #000;
}
.youtube-preview {
    width: 100%;
    height: 100%;
    object-fit: cover;
    cursor: pointer;
}

.product-title-block {
    height: 260px;
    width: 100%;
    box-sizing: border-box;
    display: table;
    margin-top: -260px;
    position: relative;
    margin-bottom: 40px;
}

.product-title-text {
    margin-top: -260px;
    display: table-cell;
    vertical-align: middle;
}

.product-title,
.product-description {
    color: white;
    display: block;
    font-family: "Open sans", arial, sans-serif;
    font-weight: 300;
}

.product-title {
    font-size: 48px;
}

.product-description {
    font-size: 14px;
    width: 50%;
    margin-bottom: 0;
}



.clien-sub-tabs {
    margin-top: 30px;
    margin-bottom: 12px;
    border-bottom: 1px solid #ccc;
    height: 36px;
    padding-left: 0;
}

.clien-sub-tabs .tab-title {
    display: list-item;
    width: auto;
    float: left;
    background: none;
    list-style: none;
    text-align: center;
    min-width: 150px;
    line-height: 22.5px;
    cursor: pointer;
}

.clien-sub-tabs .tab-title a {
    text-decoration: none;
    margin-bottom: 0;
    font-size: 14px;
    font-family: arial, sans-serif;
}
.clien-sub-tabs .tab-title a:hover {
    padding: 8px 0 !important;
}

.tab-pane {
    display: none;
}
.tab-pane.show {
    display: block;
}

.table-wrapper {
    overflow-x: auto;
}

table {
    margin-bottom: 20px;
    width: 100%;
    border: 0;
    border-collapse: collapse;
    background: #fff;
    table-layout: auto;
}

table tr {
    border-bottom: 1px solid #e2e2e2;
}

table thead tr {
    background: none !important;
    border-top: 1px solid #e2e2e2;
}

table tr:nth-child(odd) {
    background: #f9f9f9;
}

table thead td {
    background: #f9f9f9 !important;
    font-weight: 700;
}

p,
span,
table td,
.meta-test {
    color: #757575;
}

table tr th,
table tr td {
    font-size: 12px;
    padding: 6px 8px;
    display: table-cell;
    line-height: 1.125rem;
    text-align: left;
}

.product-table tr td:first-child {
    width: 282px;
}

#test-results table tr {
    background-color: #fff;
}

.gallery-img {
    max-height: 200px;
    max-width: 200px;
    object-fit: contain;
}

.downloadObj {
    border: 1px solid #dfdfdf;
    overflow: hidden;
    padding: 15px;
    margin-bottom: -1px;
}

.downloadObj span {
    vertical-align: middle;
}

.downloadObj a {
    margin-bottom: 0;
    padding: 7px 25px !important;
    height: auto !important;
    float: right !important;
    min-width: 150px;
    background-color: #0992c9;
    border-color: #0775a1;
    transition: background-color .3s ease-out;
    border-radius: 3px;
    color: #fff;
    font-size: 13px;
    text-decoration: none;
    text-align: center;
}

.downloadObj a:hover {
    background-color: #0775a1;
}

.meta-test {
    font-size: 11px;
    margin-left: 13px;
    padding-left: 0;
}

.included-parts {
    font-size: 13px;
    text-align: center;
    margin-bottom: 10px;
}

.parts-img {
    max-height: 100px;
    max-width: 100px;
    object-fit: contain;
}

.cta-text{
    font-size: 24px;
}
#contact_form_submit{
    background-color: var(--blue);
    width: 270px;
    max-height: 38px;
}
.btn-contact-svg {
    display: none;
}

.swal2-styled {
    background-color: var(--blue) !important;
}

#myTab .nav-link {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Gallery */

#imageModal .modal-body,
#partModal .modal-body {
    background-color: #113050;
}

#carouselModal,
#carouselPartModal {
    display: flex;
    align-items: center;
    height: 100%;
}
.carousel-item {
    text-align: center;
}
.carousel-img {
    max-width: 100%;
    max-height: 42rem;
}
.carousel-inner {
    text-align: center;
}

.carousel-control-prev {
    justify-content: start;
}
.carousel-control-next {
    justify-content: end;
}



/* Preloader */

.loader {
    overflow:hidden;
    font-size: 10px;
    text-indent: -9999em;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #65abf8;
    background: -moz-linear-gradient(left, #65abf8 10%, rgba(101,171,248, 0) 42%);
    background: -webkit-linear-gradient(left, #65abf8 10%, rgba(101,171,248, 0) 42%);
    background: -o-linear-gradient(left, #65abf8 10%, rgba(101,171,248, 0) 42%);
    background: -ms-linear-gradient(left, #65abf8 10%, rgba(101,171,248, 0) 42%);
    background: linear-gradient(to right, #65abf8 10%, rgba(101,171,248, 0) 42%);
    position: relative;
    -webkit-animation: load3 1.4s infinite linear;
    animation: load3 1.4s infinite linear;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}
.loader:before {
    width: 50%;
    height: 50%;
    background: #65abf8;
    border-radius: 100% 0 0 0;
    position: absolute;
    top: 0;
    left: 0;
    content: '';
}
.loader:after {
    background: white;
    width: 75%;
    height: 75%;
    border-radius: 50%;
    content: '';
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
@-webkit-keyframes load3 {
    0% {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
    }
}
@keyframes load3 {
    0% {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
    }
}

/* Custom */

.nav-item {
    margin-right: 60px;

    a {
        font-size: 18px;
    }
}

/* Media */

@media (max-width: 350px) {
    .nav-item a {
        font-size: 0.8rem;
    }
}

@media (max-width: 576px) {

    #mobileMenu {
        transition: all 0s;
    }

    #header {
        .investing-btn {
            margin-top: 5rem;
        }
    }
}

@media (max-width: 768px) {
    iframe,
    .youtube-video-container {
        width: 100%;
    }

    .contact-title {
        margin-bottom: 12px;
    }

    .btn-contact-svg {
        display: block;
    }
    .btn-contact-text {
        display: none;
    }
    #contact_form_submit {
        width: auto;
    }

    .product-full-description{
        font-size: 14px;
    }
    .product-title-text {
        padding: 0 !important;
    }
    .product-description {
        background: RGBA(0, 0, 0, .5);
        width: 100%;
    }
    .product-title {
        background: RGBA(0, 0, 0, .5);
        margin-bottom: 0;
        padding: 12px;
        font-size: 24px;
    }
    .product-description {
        font-size: 12px;
        padding: 12px;
    }
    
    .clien-sub-tabs {
        border-bottom: 0;
        height: 140px;
        margin-bottom: 30px;
    }
    .clien-sub-tabs .tab-title {
        width: 100%;
    }
    .clien-sub-tabs .tab-title:last-child {
        border-bottom: 1px solid #CCC;
    }

    .gallery-img {
        max-height: 80px;
    }

    .nav-tabs .nav-link {
        border: 0;
    }
    .tabs .nav-link.active {
        color: var(--blue);
    }

    .footer-content-logo,
    .footer-logo {
        text-align: center !important;
    }
    .footer-content-logo {
        padding-top: 16px;
    }
}

@media (max-width: 991px) {
    .navbar-brand.logo {
        margin: 0;
        padding: 0;
        display: flex;
        justify-content: left;

        img {
            max-width: 170px;
        }
    }

    #mobileMenu {


        .dropdown-menu {
            border: none;
        }

        .close-menu {
            filter: brightness(0) saturate(100%) invert(23%) sepia(80%) saturate(4418%) hue-rotate(189deg) brightness(97%) contrast(181%) !important;
            position: fixed;
            right: 25px;
            top: 60px;
        }
    }

    #mobileMenu.show {
        transform: translateY(0px);

    }

    #mobileMenu {
        transform: translateY(-1400px);
        transition: transform .3s ease-out;
        display: flex;
        position: fixed;
        flex-direction: column;
        justify-content: start;
        align-items: center;
        width: 100%;
        height: 100% !important;


        left: 0;
        bottom: 0;
        background: #fff;
        padding: 1.25rem;
        padding-top: 60px;
        z-index: 1000;


    }

    .nav-item {
        a {
            font-size: 1.125rem;
        }
    }
}

@media (max-width: 992px) {
    .start-investing {
        padding-top: 3.125rem;
    }

    .nav-link.dropdown-toggle {
        padding-top: 1px;
    }

    .nav-link.dropdown-toggle:hover {
        padding-top: 0;
        color: var(--blue);
        border-bottom: none;

    }

    .navbar-toggler {
        position: relative;
        border: none !important;

        span {
            filter: brightness(0) saturate(100%) invert(23%) sepia(80%) saturate(4418%) hue-rotate(189deg) brightness(97%) contrast(181%) !important

        }
    }


    .navbar-toggler:hover, .navbar-toggler:focus, .navbar-toggler:focus-visible {
        border: none !important;
        box-shadow: none !important;
    }

    .categories-select {
        display: block;
    }
    .categories {
        display: none;
    }

    .filter-header {
        margin-top: 20px;
    }


    .main-container {
        padding: 24px;
        padding-bottom: 0;
    }

    .products-container {
        margin-top: 24px;
    }

    .product-cover {
        max-height: 200px;
    }

    .pagination {
        padding: 0 !important;
    }
    .page-link {
        padding: 6px 10px;
    }
}

@media (min-width: 992px) {
    .navbar-brand.logo {
        img {
            max-width: 170px;
        }
    }

    .mobile-menu {
        .close-menu {
            display: none;
        }
    }

    .logo-container-mobile {
        display: none;
    }
}

@media (min-width: 992px) and (max-width: 1139px) {
    .footer-content-logo {
        a {
            font-size: .9375rem;
        }
    }
}

@media (min-width: 1140px) {
    .container {
        max-width: 1140px;
    }
}