/* Fonts face  */
@font-face {
font-family: 'Satoshi Regular';
font-style: normal;
font-weight: normal;
src: local('Satoshi Regular'), url('/common/Fonts/Satoshi-Regular.woff') format('woff');
}


@font-face {
font-family: 'Satoshi Italic';
font-style: normal;
font-weight: normal;
src: local('Satoshi Italic'), url('/common/Fonts/Satoshi-Italic.woff') format('woff');
}


@font-face {
font-family: 'Satoshi Light';
font-style: normal;
font-weight: normal;
src: local('Satoshi Light'), url('/common/Fonts/Satoshi-Light.woff') format('woff');
}


@font-face {
font-family: 'Satoshi Light Italic';
font-style: normal;
font-weight: normal;
src: local('Satoshi Light Italic'), url('/common/Fonts/Satoshi-LightItalic.woff') format('woff');
}


@font-face {
font-family: 'Satoshi Medium';
font-style: normal;
font-weight: normal;
src: local('Satoshi Medium'), url('/common/Fonts/Satoshi-Medium.woff') format('woff');
}


@font-face {
font-family: 'Satoshi Medium Italic';
font-style: normal;
font-weight: normal;
src: local('Satoshi Medium Italic'), url('/common/Fonts/Satoshi-MediumItalic.woff') format('woff');
}


@font-face {
font-family: 'Satoshi Bold';
font-style: normal;
font-weight: normal;
src: local('Satoshi Bold'), url('/common/Fonts/Satoshi-Bold.woff') format('woff');
}


@font-face {
font-family: 'Satoshi Bold Italic';
font-style: normal;
font-weight: normal;
src: local('Satoshi Bold Italic'), url('/common/Fonts/Satoshi-BoldItalic.woff') format('woff');
}


@font-face {
font-family: 'Satoshi Black';
font-style: normal;
font-weight: normal;
src: local('Satoshi Black'), url('/common/Fonts/Satoshi-Black.woff') format('woff');
}


@font-face {
font-family: 'Satoshi Black Italic';
font-style: normal;
font-weight: normal;
src: local('Satoshi Black Italic'), url('/common/Fonts/Satoshi-BlackItalic.woff') format('woff');
}

/* body  default */

body{
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    color: #4B4D67;
    background-image: url(/common/images/body-footer-bg.png);
    background-repeat: no-repeat;
    background-position: bottom left;
    font-size: 18px;
    line-height: 27px;
}
body.dark-mode{
    background-color: #101620;
    color: #C0CAFD;
}

.btn{
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 18px;
    color: #111111;
    padding: 18px 32px !important;

    border: 1px solid #31313140;
    border-radius: 48px;
}
.btn-primary {
    background: #ffffff;
    color: #101620 !important;
    border: 1px solid #FFFFFF40 !important;
}
.btn-primary:hover {
    background: transparent !important;
    color: #ffffff !important;
}
.dark-mode .btn{
    color: #ffffff;
    border: 1px solid #FFFFFF40;
    z-index: 99;
    position: relative;
}
.dark-mode .btn:hover {
    background: white;
    color: #101620;
}
.btn:hover {
    background: #101620;
    color: #ffffff;
}
.h1{
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 72px;
    line-height: 72px;
    color: #FFFFFF;
    word-break: break-word;
}

.h2{
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 56px;
    line-height: 56px;
    color: #111111;
    word-break: break-word;
}
.dark-mode .h2{
    color: #ffffff;
}
.h6{
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 24px;
    line-height: 30px;
    color: #ffffff;
    word-break: break-word;
}

.mobile-only{
    display: none;
}
.navbar-toggler:focus {
    box-shadow: none !important;
}


/* Homepage */
/* header */
a.nav-link {
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    color: #000000;
    font-size: 15px;
    line-height: 22px;
    padding: 0px 15px !important;
}
.dark-mode a.nav-link{
    color: #ffffff;
}
a.nav-link:hover{
    color: #C0CAFD !important;
}

li.nav-item img {
    padding-left: 15px;
    height: 17px;

}
.navbar-toggler-icon {
    background-image: url(/common/images/Menu-Light.svg);
    background-size: auto;

}
.dark-mode .navbar-toggler-icon {
    background-image: url(/common/images/menu-icon.svg);
    background-size: auto;
}

button.navbar-toggler {
    padding: 0 !important;
    border: 0;
}


/* Hero area */
.dark-mode .hero-heading {
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 72px;
    line-height: 78px;
    color: #ffffff;
    word-break: break-all;
}
.hero-img img {
    border-radius: 19px;
    width: 100%;
}
.home-hero {
    background: url(/common/images/herobg.png);
    background-size: cover;
    margin-top: -124px;
    padding-top: 111px;
    padding-bottom: 140px;
    background-position: bottom center;
}
.overly-img{
    position: absolute;
    top:0;
    right: 0;
}
.hero-text-block {
    max-width: 762px;
    margin: auto;
}
.hero-text-block a.btn.btn-primary {
    background: #ffffff;
    color: #101620;
    border: 1px solid #FFFFFF40;
}
.hero-text-block a.btn.btn-primary:hover {
    background: transparent;
    color: #ffffff;
}
.hero-text-block a.btn.btn-secondary {
    background: transparent;
}
.hero-text-block a.btn.btn-secondary:hover {
    background: #ffffff;
    color: #101620;
}

/* white hero */
.home-hero-white {
    background: url(/common/images/wht-herobg.png);
    background-size: auto;
    margin-top: 0;
    padding-top: 160px;
    padding-bottom: 160px;
    background-repeat: no-repeat;
    background-position: right center;
}
img.hero-shp-lft {
    top:-20%;
    right: 5%;
}

.white-area {
    display: none;
}
.banner-area {
    margin: 60px 0px 150px 0px;
}
.hero-heading {
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 72px;
    line-height: 78px;
    color: #111111;
    word-break: break-word;
}
.home-hero-white a.btn.btn-secondary {
    background: #181F44;
    color: #ffffff;
}
.home-hero-white a.btn.btn-secondary:hover {
    background: #111111;
}



 /* ajan slider */


 .ajan-slider {
    background: url(/common/images/ajan-shape.png);
    background-position: 0;
    background-repeat: no-repeat;
    padding: 100px 0px;
    background-size: contain;
}
.dark-mode .ajan-slider {
    background: none !important;
 }
 .dark-mode .direction-btns i {
    padding: 20px 24px;
    border: 1px solid #c0cafd52;
    border-radius: 100%;
    color: #ffffff;

}
.direction-btns i {
    padding: 20px 24px;
    border: 1px solid #50515445;
    border-radius: 100%;
    color: #171D32;
}
.direction-btns i:hover {
    background: #101620;
    color: #ffffff;

}
.dark-mode .direction-btns i:hover {
    background: #ffffff;
    color: #101620;

}

.feature.col {
    padding: 32px;
    border-radius: 16px;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-position: left top !important;
    height: 100%;
}
.custom-swiper  .swiper-slide:nth-child(n) .feature{
    background: transparent linear-gradient(148deg, #3042D6 0%, #142081 100%) 0% 0% no-repeat padding-box;

}
.custom-swiper  .swiper-slide:nth-child(2n) .feature{
    background: transparent linear-gradient(148deg, #AB30D6 0%, #371481 100%) 0% 0% no-repeat padding-box;

}
.custom-swiper  .swiper-slide:nth-child(3) .feature{
    background: transparent linear-gradient(148deg, #3FCFAD 0%, #00517E 100%) 0% 0% no-repeat padding-box;

}
.custom-swiper  .swiper-slide:nth-child(4) .feature{
    background: transparent linear-gradient(147deg, #D64E30 0%, #811414 100%) 0% 0% no-repeat padding-box;

}

.swiper-slide {
    width: 27%;
    border-radius: 16px;
    text-align: left;
    opacity: 1;
}
.swiper-slide p{
    color: #C0CAFD;
}
.swiper-slide .btn{
    border: 0 !important;
    padding: 0 !important;
    color: #ffffff;
}

/* two col 1 */


.dark-mode .two-col-1 {
    padding: 200px 0px 75px 0px;
}
.two-col-1 {
    padding: 50px 0px 75px 0px;
}

/* two col 2 */

.two-col-2{
    padding-top: 237px;
    margin-top: -237px;
    padding-bottom: 100px;
}


 /* palve slider */

.palve-slider{
    display: none;
	height: 720px;
}
.dark-mode .palve-slider{
    display: block;
}

.palve-swiper  .swiper-slide:nth-child(n) .feature{
    background: url(/common/images/list-1.png);

}
.palve-swiper  .swiper-slide:nth-child(2n) .feature{
    background: url(/common/images/list-2bg.png);

}
.palve-swiper  .swiper-slide:nth-child(3) .feature{
    background: url(/common/images/list-3.png);

}
.palve-swiper  .swiper-slide:nth-child(4) .feature{
    background: url(/common/images/list-8.png);

}

/* .swiper-wrapper {
    width: 1440px;

} */

.swiper-slide .btn:hover {
    background: transparent;
    color: #C0CAFD;
}


/* offer-area */
.dark-mode .offer-area {
    background: url(/common/images/list-areabg.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left center;
    padding: 100px 0px;
    margin: 100px 0px;
}
.offer-area {
    background: url(/common/images/liasi-shape.png);
    background-size: auto;
    background-repeat: no-repeat;
    background-position: left top;
    padding: 248px 0px 0px 0px;
    margin: 100px 0px;
    margin-top: -214px;
}
.offer-area h6{
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 24px;
    line-height: 24px;
}
.offer-area a.list-group-item {
    background-size: cover !important;
    border-radius: 16px;
    padding: 34px !important;
}
a.list-group-item:nth-child(1) {
    background: url(/common/images/list-1.png);

}
a.list-group-item:nth-child(2) {
    background: url(/common/images/list-2bg.png);

}
a.list-group-item:nth-child(3) {
    background: url(/common/images/list-3.png);

}
.offer-area a.list-group-item p{
    color: #C0CAFD;
}


/* blog area */
.blog-img img{
    border-radius: 16px;
}
.blog-title{
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 24px;
    line-height: 24px;
    padding: 30px 0px 18px 0px;
    color: #111111;
}
.dark-mode .blog-title{
    color: #ffffff;
}

/* bottom two col */
.dark-mode .bottom-two-col{
    background-image: url('/common/images/bg-23.png') ;
}
.bottom-two-col{
    background-image: url('/common/images/bg-23wht.png');
    background-position: left center;
    background-size: auto;
    background-repeat: no-repeat;
    padding: 150px 0px;
    margin: 50px 0px;
}
.blog-area a.btn{
    display: none;
}
.dark-mode .blog-area a.btn{
    display: inline-block;
    border: 0 !important;
    padding: 0 !important;
}
.dark-mode .blog-area a.btn:hover{
    background: transparent;
    color: #C0CAFD;
}



/* Moonsoft - Palvelumme: Auditointi */
body.inner-page {
    background-image: url(/common/images/iner-pge-back.png) !important;
    background-position: bottom;
    background-size: contain;
}
.page-hero {
    background: url(/common/images/page-hero-back.png);
    margin-top: -122px;
    padding: 282px 0px 380px 0px;
    background-size: cover;
    background-position: bottom center;
}

.page-hero-two {
    background: url(/common/images/page-hero-back.png);
    margin-top: -122px;
    padding: 282px 0px 200px 0px;
    background-size: cover;
    background-position: bottom center;
}

.page-hero-three {
    background: url(/common/images/page-hero-back.png);
    margin-top: -122px;
    padding: 282px 0px 100px 0px;
    background-size: cover;
    background-position: bottom center;
}

.page-hero-four {
    background: url(/common/images/page-hero-back.png);
    margin-top: -122px;
    padding: 282px 0px 320px 0px;
    background-size: cover;
    background-position: bottom center;
}

.current-lang,.selecting-lang{
    display: flex;
    align-items: center;
    gap: 7px;
}
.lang-dropdown {
    display: none;
    position: absolute;
}
.current-lang i.bi.bi-chevron-down {
    font-size: 13px;
}
.switch-lang:hover .lang-dropdown {
    display: block;
}
.inner-page li.nav-item.inner-switch {
    pointer-events: none;
}
p.lang-tex{
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    color: #FFFFFF;
    font-size: 15px;
    line-height: 22px;
}
.accordion-area {
    margin-top: -280px;
    margin-bottom: 120px;
}

.accordion-button {
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 28px;
    line-height: 38px;
    color: #ffffff !important;
    gap:30px;
    padding: 32px;
}
.accordion-button:focus {
    box-shadow: none !important;
}

.accordion-button::after {
    background-image: url(/common/images/pharrow-right-light.svg);
    width: 30px;
    background-size: contain;
}
.accordion-button:not(.collapsed)::after {
    background-image: url(/common/images/pharrow-right-light.svg);
    transform: rotate(90deg);
}

.accordion-item {
    background-color: transparent;
    border: 0;
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    color: #C0CAFD;
    font-size: 18px;
    line-height: 27px;
    border: 2px solid transparent;
    border-radius: 16px;
    margin-bottom: 36px;
}
.accordion-body {
    padding: 27px 67px 67px;
}
.accordion-body ul {
    padding-left: 15px;
}
.accordion-header {
    background: url(/common/images/ac-head.png);
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 16px;

}
button.accordion-button,.accordion-button:not(.collapsed) {
    height: 100%;
    border-radius: 16px;
    background: transparent;
    box-shadow: none;
}
.accordion-item:has(.show) {
    border-radius: 16px;
    background: #171D32 0% 0% no-repeat padding-box;
    border: 2px solid #707070;
}


/* Moonsoft - Palvelumme */
.accr-area {
    border-bottom: 1px solid #C0CAFD;
    padding: 0px 30px 20px;
    margin-bottom: 30px;
}
.accr-area:last-child {
    border-bottom: 0px;
    padding-bottom: 0;
    margin-bottom: 0;
}
.accr-area h3 {
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 24px;
    line-height: 36px;
    color: #ffffff !important;
    position: relative;
}
.accr-area h3:before {
    content: '';
    background: url(/common/images/accordion-title-arrow.svg);
    width: 18px;
    position: absolute;
    height: 18px;
    background-repeat: no-repeat;
    left: -30px;
    top: 50%;
    transform: translateY(-50%);
}
.accr-area li{
    word-break: break-word;
}


/* faq */
.faq-accordion-section {
    margin-top: -400px;
}
.search-area h1{
    max-width: 800px;
}
.search-items {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    max-width: 990px;
    margin-top: 50px;
}
.search-box {
    position: relative;
    display: flex;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}
.search-area p {
    margin: 35px 0px 30px;
}
.search-input {
    width: 100%;
    padding: 16px 16px 16px 66px;
    border-radius: 16px;
    background: #171D32 0% 0% no-repeat padding-box;
    border: 2px solid #707070;
    max-width: 637px;
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    color: #C0CAFD !important;
}
input.search-input:hover {
    border-color: #C0CAFD !important;
}
.search-input::placeholder {
    color: #C0CAFD80;
  }
.search-btn {
    background-color: transparent;
    border: none;
    transition: all .4s;
    z-index: 10;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 15px;
}
span.s-item {
    padding: 16px 22px;
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 24px;
    color: #ffffff;
    border-radius: 36px;
}
span.s-item:nth-child(1){
    background: transparent linear-gradient(122deg, #3042D6 0%, #142081 100%) 0% 0%;

}
span.s-item:nth-child(2){
    background: transparent linear-gradient(132deg, #AB30D6 0%, #371481 100%) 0% 0% no-repeat padding-box;
}
span.s-item:nth-child(3){
    background: transparent linear-gradient(131deg, #3FCFAD 0%, #00517E 100%) 0% 0% no-repeat padding-box;
}
span.s-item:nth-child(4){
    background: transparent linear-gradient(108deg, #D64E30 0%, #811414 100%) 0% 0% no-repeat padding-box;
}
span.s-item:nth-child(5){
    background: transparent linear-gradient(115deg, #D64E30 0%, #811414 100%) 0% 0% no-repeat padding-box;
}
span.s-item:nth-child(6){
    background: transparent linear-gradient(114deg, #3042D6 0%, #142081 100%) 0% 0% no-repeat padding-box;
}
span.s-item:nth-child(7){
    background: transparent linear-gradient(123deg, #AB30D6 0%, #371481 100%) 0% 0% no-repeat padding-box;
}
span.s-item:nth-child(8){
    background: transparent linear-gradient(131deg, #3FCFAD 0%, #00517E 100%) 0% 0% no-repeat padding-box;
}

.faq-page .accordion-area {
    margin-top: 0px;
    margin-bottom: 0px;
}
.faq-page .accordion-button {
    font-family: 'Satoshi Medium';
    font-style: normal;
    font-weight: normal;
    font-size: 22px;
    line-height: 30px;
}
.faq-page .faq-area-title {
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 28px;
    line-height: 32px;
    color: #FFFFFF;
    margin: 35px 0px;
}
.faq-page .accordion-body {
    padding: 27px 32px 32px;
}

.faq-btm-area{
    background: transparent linear-gradient(117deg, #AB30D6 0%, #371481 100%) 0% 0% no-repeat padding-box;
    border-radius: 16px;
    padding: 32px;
    margin-top: 60px;
}
.faq-btm a.btn-primary{
    margin: 35px 0px 70px;
}


/* blog page */
body.dark-mode.blog-page {
    background-image: url(/common/images/blogp-bg.png) !important;
    background-position: bottom center;
    background-size: cover;
}
.blog-page .search-area {
    max-width: 686px;

}
.article-section {
    margin-top: -300px;
}
.blog-list-area  .blog-img img{
    width: 100%;
}
.blog-list-area .blog-title {
    padding: 20px 0px 10px 0px;
}
span.date {
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    color: #C0CAFD;
    font-size: 16px;
    line-height: 24px;
    padding-top: 20px;
    display: block;
}

.blog-pagination .next-btn {
    background: #ffffff;
    color: #101620;
}
.blog-pagination .next-btn:hover{
    background: transparent;
    color: #FFFFFF;
}


/* blog page 2 */
.blog-list-area-2 .blog-card {
	/* max-height: 500px; */
	max-width: 580px;
    background: #101620 0% 0% no-repeat padding-box;
    border: 2px solid #707070;
    border-radius: 8px;
    opacity: 1;
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
    padding: 20px;
	margin-bottom: 10px;
}
.blog-list-area-2 span.date{
    padding: 0;
}


/* yrits */
body.yritys {
    background-image: none !important;
}
.yritus-content-area {
    margin-top: -255px;
}

.banner-1 {
    padding: 39px;
    background: url(/common/images/ban-bg-1.png);
    background-size: cover;
    background-position: left center;
    border-radius: 16px;
}
.banner-1 .txt {
    font-family: 'Satoshi Medium Italic';
    font-style: normal;
    font-weight: normal;
    font-size: 22px;
    line-height: 30px;
    color: #ffffff;
}
.banner-2 {
    padding: 39px;
    background: transparent linear-gradient(114deg, #AB30D6 0%, #371481 100%) 0% 0% no-repeat padding-box;
    border-radius: 16px;
}
.banner-2 .txt {
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 24px;
    line-height: 30px;
    color: #ffffff;
}

.icon-shape {
    width: 25%;
    max-width: 325px;
}

.icon-shape h6{
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 24px;
    line-height: 28px;
    color: #ffffff;
    text-transform: uppercase;
    min-width: 196px;
}

.yritys .two-col-1 {
    padding: 130px 0px 75px 0px;
}

.yritys .two-col-1 h2,.yritys .two-col-2 h2{
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 36px;
    line-height: 41px;
    color: #ffffff;
}
.yritys .two-col-2 p a{
    color: #C6CAFD;
}
.yritys .two-col-2 img.right-shape {
    top: 21% !important;
}
.yritys a.btn {
    background: #ffffff;
    color: #101620 !important;
}
.yritys a.btn:hover {
    background: transparent;
    color: #FFFFFF !important;
}

/* yhteys */
body.inner-page.Yhteystiedot ,body.inner-page.sertificates,body.inner-page.tuotehaku.fontit,body.inner-page.tuotehaku.Valmistajat{
    background-image: url(/common/images/yhtebg.png) !important;
    background-position: bottom left;
    background-size: cover;
}
.card {
    background: transparent;
    border: 0;
}

.khuinka-card-list img.card-img-top {
    width: 36px !important;
    height: 36px;
}

.khuinka-card-list .cards{
    padding: 28px 28px;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    flex: none;
    width: 20%;
    border-radius: 16px;
}

.khuinka-card-list .cards:nth-child(1){
    background: url(/common/images/cbg-1.png);
}

.khuinka-card-list .cards:nth-child(2) {
    background: url(/common/images/cbg-2.png);
}

.khuinka-card-list .cards:nth-child(3) {
    background: url(/common/images/cbg-3.png);
}
.khuinka-card-list .cards:nth-child(4) {
    background: url(/common/images/cbg-4.png);
}
.khuinka-card-list .cards:nth-child(5) {
    background: url(/common/images/cbg-1.png);
}

.khuinka-card-list  .card-body {
    padding: 49px 0px 0px 0px;
}

.khuinka-card-list h5.card-title ,.album .card-title{
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 24px;
    line-height: 24px;
    color: #ffffff;
    margin-bottom: 20px;
}

.khuinka-card-list .card-text,.khuinka-card-list .card-text a,.card-text ul li ,.khuinka-card-list .card-text span ,.album .card-text a {
    color: #C0CAFD;
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 27px;
    text-decoration: none;
}
.khuinka-card-list .card-list-2 .cards:nth-child(4){
    width: 40%;
}
.khuinka-card-list .card-list-2 .card-body {
    padding:  0px;
}
.card-body  ul {
    padding-left: 15px;
}


.album .card {
    padding: 46px 28px 70px 28px;
    height: 100%;
}

.album .cards:nth-child(1) .card {
    background: transparent linear-gradient(158deg, #3042D6 0%, #142081 100%) 0% 0% no-repeat padding-box;
}

.album .cards:nth-child(2) .card {
    background: transparent linear-gradient(158deg, #AB30D6 0%, #371481 100%) 0% 0% no-repeat padding-box;
}

.album .cards:nth-child(3) .card,.album .cards:nth-child(5) .card,.album .cards:nth-child(11) .card  {
    background: transparent linear-gradient(158deg, #3FCFAD 0%, #00517E 100%) 0% 0% no-repeat padding-box;
}

.album .cards:nth-child(4) .card ,.album .cards:nth-child(6) .card,.album .cards:nth-child(10) .card{
    background: transparent linear-gradient(158deg, #D64E30 0%, #811414 100%) 0% 0% no-repeat padding-box;
}

.album .cards:nth-child(7) .card ,.album .cards:nth-child(9) .card{
    background: transparent linear-gradient(158deg, #3FCFAD 0%, #00517E 100%) 0% 0% no-repeat padding-box;
}

.album .cards:nth-child(8) .card {
    background: transparent linear-gradient(158deg, #AB30D6 0%, #371481 100%) 0% 0% no-repeat padding-box;
}

.album .card-body{
    padding: 0;
}

.album .card-title{
    min-height: 48px;
}



.map-area {
    padding: 36px;
}

.map-box {
    background: transparent linear-gradient(112deg, #171D32 0%, #171D3200 100%) 0% 0% no-repeat padding-box;
    border-radius: 16px;
    padding-left: 50px;
    padding-right: 50px;
}
.map-area a{
    color: #932BC4;
    text-decoration: none;
}
.map-area iframe{
    border-radius: 16px;
}
.logo-list li {
    padding: 13px 0px;
    margin-bottom: 16px;
    display: inline-flex;
}
.logo-list li a{
    background: #C0CAFD1F 0% 0% no-repeat padding-box !important;
    border: 1px solid #7C87BE;
    border-radius: 10px !important;
    font-family: 'Satoshi Medium';
    font-style: normal;
    font-weight: normal;
    color: #ffffff;
    font-size: 18px;
    line-height: 27px;
    padding: 13px 26px;
    text-decoration: none;

}
ul.logo-list {
    padding-left: 0;
}


/* certificates */

.sertificates .hero-txt {
    width: 50%;
}

.sertificates-content-area {
    margin-top: -276px;
}

.sertificates h5.card-title{
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 24px;
    color: #ffffff;
    width: 40%;
}

.sertificates .card{
    padding: 34px;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    border-radius: 16px;
    height: 100%;
}

.sertificates .card img{
    border-radius: 6px;
    width: 242px;
}

.sertificates .cards:nth-child(1) .card,.sertificates .cards:nth-child(5) .card,.sertificates .cards:nth-child(6) .card,.sertificates .cards:nth-child(7) .card,.sertificates .cards:nth-child(11) .card,.sertificates .cards:nth-child(13) .card,.sertificates .cards:nth-child(15) .card,.sertificates .cards:nth-child(19) .card,.sertificates .cards:nth-child(21) .card,.sertificates .cards:nth-child(25) .card{
    background: url(/common/images/s-bg-1.png);
}

.sertificates .cards:nth-child(2) .card,.sertificates .cards:nth-child(8) .card,.sertificates .cards:nth-child(12) .card,.sertificates .cards:nth-child(14) .card,.sertificates .cards:nth-child(16) .card,.sertificates .cards:nth-child(20) .card,.sertificates .cards:nth-child(22) .card,.sertificates .cards:nth-child(26) .card{
    background: url(/common/images/s-bg-2.png);
}

.sertificates .cards:nth-child(3) .card,.sertificates .cards:nth-child(9) .card,.sertificates .cards:nth-child(17) .card,.sertificates .cards:nth-child(23) .card{
    background: url(/common/images/s-bg-4.png);
}

.sertificates .cards:nth-child(4) .card,.sertificates .cards:nth-child(10) .card,.sertificates .cards:nth-child(18) .card,.sertificates .cards:nth-child(24) .card{
    background: url(/common/images/s-bg-3.png);
}

/* tuotehaku */
.accordion-button {
    font-family: 'Satoshi Medium';
    font-style: normal;
    font-weight: normal;
    font-size: 26px;
    line-height: 30px;
}

span.t-item {
    font-family: 'Satoshi Medium';
    font-style: normal;
    font-weight: normal;
    font-size: 26px;
    line-height: 38px;
    color: #FFFFFF;
}

.tuotehaku .accordion-item:has(.show) {
    border-radius: 0;
    background: transparent;
    border: 0;
}

.tuotehaku .accordion-item {
    border-bottom: 1px solid #5B6FA7 !important;
    border-radius: 0 !important;
    padding-bottom: 18px;
}

.tuotehaku .accordion-item li.list-group-item {
    border: 0;
    background: transparent;
    padding: 0 !important;
    margin: 9px 0px;
}

.tuotehaku .accordion-item li.list-group-item a{
    font-family: 'Satoshi Medium';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 30px;
    color: #FFFFFF;
    text-decoration: none;
}

.tuotehaku .accordion-header {
    background: none;
    border-radius: 0;
}

.tuotehaku  button.accordion-button {
    padding: 0;
}

.tuotehaku .accordion-body {
    padding: 0;
}

.tuotehaku .accordion-body .col-right{
    border-left: 1px solid #536598;
    padding-left: 10px !important;
}

.tuotehaku .accordion-body ul {
    padding-left: 11px;
}


.tuotehaku .accordion-button::after {
    background-image: url(/common/images/pharrow-right-light-accor.svg);
    width: 30px;
    background-size: auto;
    background-position: center;
}

.tuotehaku .accordion-button:not(.collapsed)::after {
    background-image: url(/common/images/pharrow-right-light-accor.svg);
    transform: rotate(180deg);
}


.products-slider .swiper-slide h3 {
    font-size: 20px;
    line-height: 24px;
}

.products-slider .swiper-slide .box {

    background-size: cover !important;
    background-position: top left !important;
    padding: 22px;
    display: flex;
    flex-direction: column;
    border-radius: 16px;
}

.products-slider .swiper-slide:nth-child(1) .box,.products-slider .swiper-slide:nth-child(6) .box{
    background: url(/common/images/pro1-bg.png);
}

.products-slider .swiper-slide:nth-child(2) .box,.products-slider .swiper-slide:nth-child(5) .box{
    background: url(/common/images/pro-2-bg.png);
}

.products-slider .swiper-slide:nth-child(3) .box{
    background: url(/common/images/pro-bg-3.png);
}

.products-slider .swiper-slide:nth-child(4) .box{
    background: url(/common/images/pro-bg-4.png);
}

.pro-swiper-button-prev i,.pro-swiper-button-next i{
    font-size: 40px;
    color: #FFFFFF;
}
.swiper-button-disabled {
    opacity: 0;
}

.pro-swiper-button-prev {
    position: absolute;
    left: 0px;
    top: 50%;
    z-index: 99;
    background: #36398C9E 0% 0% no-repeat padding-box;
    border: 1px solid #C0CAFD40;
    height: 72px;
    width: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    transform: translateY(-50%);
}

.pro-swiper-button-next {
    position: absolute;
    right: 0px;
    top: 50%;
    z-index: 99;
    background: #36398C9E 0% 0% no-repeat padding-box;
    border: 1px solid #C0CAFD40;
    height: 72px;
    width: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    transform: translateY(-50%);
}


/* product-single */

.product-details {
    background: #171D32 0% 0% no-repeat padding-box;
    border: 2px solid #707070;
    border-radius: 16px;
}

.pro-details-heading {
    background: transparent linear-gradient(97deg, #AB30D6 0%, #371481 100%) 0% 0% no-repeat padding-box;
    border-radius: 16px 16px 0px 0px;
    padding: 20px 32px;

}

.product-details .accordion-button {
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 27px;
    padding: 20px 32px;
    border-radius: 0;
}

.product-details .accordion-item {
    border: 0;
    background: transparent;
    border-radius: 0 !important;
    margin: 0;
}

.pro-details-heading .dt {
    font-family: 'Satoshi Medium';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 23px;
    color: #FFFFFF;
}

.product-details h2.accordion-header {
    background: none !important;
    border-bottom: 1px solid #7070707d;
    border-radius: 0px;
}
.product-details .accordion-item:last-child h2.accordion-header{
    border-bottom: 0;
}


.tuotehaku-single .page-hero h1{
    font-size: 52px;
}

h4.single-subtitle {
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 32px;
    line-height: 36px;
    color: #ffffff;
}

.tuotehaku-single .page-hero ul {
    list-style-type: none;
    padding-left: 0px;
    color: #fff;
    font-size: 18px;
    line-height: 30px;
    font-family: 'Satoshi Medium';
    font-style: normal;
    font-weight: normal;
}

.tuotehaku-single .page-hero p span {
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    color: #ffffff;
}

.area-box {
    background: #18244F 0% 0% no-repeat padding-box;
    border: 2px solid #707070;
    border-radius: 16px;
    padding: 22px 30px;
}

.tuotehaku-single .accordion-body {
    padding: 35px 32px;
}

h4.pro-variation-title {
    font-family: 'Satoshi Medium';
    font-style: normal;
    font-weight: normal;
    font-size: 24px;
    line-height: 30px;
}

h6.pro-variation-title {
    font-family: 'Satoshi Medium';
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 24px;
    color: #ffffff;
    margin: 0;
}

h4.pro-variation-title span {
    color: #ffffff;
}

.ele {
    width: 79%;
    padding-bottom: 10px;
}

.ele:first-child{
    border-right: 1px solid #3D4558;
    width: 21%;
}

.tuotehaku-single .accordion-body  a.btn{
    border: 0;
    padding-left: 0 !important;
}

.tuotehaku-single .accordion-body a.btn:hover{
    background: transparent;
    color: #FFFFFF;
}

.tuotehaku-single .accordion-button::after {
    background-image: url(/common/images/arrow-down.svg);
    width: 24px;
    background-size: 100%;
}

.tuotehaku-single .accordion-button:not(.collapsed)::after {
    background-image: url(/common/images/arrow-down.svg);
    transform: rotate(180deg);
}

.tuotehaku-single  .accordion-button:not(.collapsed) {
    background: transparent linear-gradient(141deg, #171D32 0%, #18204A 100%) 0% 0% no-repeat padding-box !important;
}

.tuotehaku-single .dt{
    word-break:break-word;
}

.dt:nth-child(1) {
    width: 7%;
    color: #2FA6FF;
}

.dt:nth-child(2) {
    width: 10%;
    color: #2FA6FF;
}

.dt:nth-child(3) {
    width: 49%;
}

.dt:nth-child(4) {
    width: 12%;
}

.dt:nth-child(5) {
    width: 11%;
}

.dt:nth-child(6) {
    width: 11%;
}

.custom-row-top .dt{
    font-family: 'Satoshi Medium';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 24px;
    color: #ffffff;
}

.custom-row-top {
    width: 100%;
    padding-right: 0px;
}

.custom-row-content {
    width: 100%;
}

.cover-area {
    background: transparent linear-gradient(107deg, #171D32 0%, #171D3200 100%) 0% 0% no-repeat ;
    border-radius: 16px;
    padding-top: 78px;
}

.Tuotehaku-single-accordion-section .cover-area a{
    display: flex;
    margin-bottom: 10px;
    align-items: center;
}

.Tuotehaku-single-accordion-section .album .card-title {
    min-height: auto;
}

.Tuotehaku-single-accordion-section .album a.btn {
    display: inline-flex !important;
    padding: 13px 24px !important;
    margin-top: 20px;
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    color: #ffffff;
}

.Tuotehaku-single-accordion-section .album .col.cards:nth-child(3) a{
    color: #ffffff;
}

/* valmistajat */
.valmistajat-details-box {
    background: #18244F 0% 0% no-repeat padding-box;
    border: 2px solid #707070;
    padding: 30px;
    border-radius: 16px;
}

div#accordion-iner  .accordion-button::after {

    background-image: none !important;
}

div#accordion-iner .accordion-item {
    border-bottom: 0 !important;
    border-radius: 0 !important;
    padding-bottom: 0px;
    margin-bottom: 18px;
}

div#accordion-iner .accordion-button {
    font-family: 'Satoshi Medium';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 30px;
}

.valmistajat-details-box div.title{
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    color: #ffffff;
    font-size: 24px;
    line-height: 30px;
}

.valmistajat-details-box div.heading{
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    color: #ffffff;
    font-size: 18px;
    line-height: 24px;
}

.valmistajat-details-box p,.valmistajat-details-box li {
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
}

.valmistajat-details-box  a{
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 27px;
    color: #2FA6FF;
    text-decoration: none;
    word-break: break-word;
}

.valmistajat-details-box ul {
    padding-left: 0 !important;
    list-style-type: none;
}

.valmistajat-details-box a.btn {
    padding: 0 !important;
    border: 0 !important;
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 18px;

}

.Valmistajat .Tuotehaku-accordion-section {
    margin-top: -380px;
}


/* fontit*/
.fontit .Tuotehaku-accordion-section {
    margin-top: -380px;
}

.fontit .Tuotehaku-accordion-section .accordion-item{
    margin-bottom: 18px;
}

/* fontit single*/
h6{
    font-family: 'Satoshi Medium';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 27px;
    color: #FFFFFF;
}
.modal-header {
    border: 0;
}

.modal-dialog {
    max-width: 1320px;
}

.modal-content {
    background: #18244F 0% 0% no-repeat padding-box;
    border: 2px solid #707070;
    border-radius: 13px;
    padding: 70px;
}

.modal-body p{
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 27px;
    color: #C0CAFD;
}

.modal-body input[type="text"] {
    background: #171D32 0% 0% no-repeat padding-box;
    border: 2px solid #707070;
    max-width: 573px;
    width: 100%;
    padding: 16px 22px 16px 22px;
    border-radius: 16px;
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    color: #C0CAFD;
}

::placeholder{
    color: #C0CAFD80;
}

.modal-title{
    font-family: 'Satoshi Medium';
    font-style: normal;
    font-weight: normal;
    font-size: 23px;
    line-height: 27px;
    color: #FFFFFF;
}

.modal-body .sample-title{
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 38px;
    line-height: 27px;
    color: #FFFFFF;
}

.btn-close {
    opacity: 1;
    background: none;
    width: 36px;
    padding: 0;
    height: 47px;
    margin-left: auto;
    position: absolute;
    right: 40px;
    top: 30px;

}

.modal-footer a.btn {
    border: 0 !important;
    padding: 0 !important;
}

.modal-footer a.btn:hover {
    background: transparent;
}


/* verkkokaupan */
body.inner-page.verkkokaupan {
    background-image: url(/common/images/order-page-bg.png) !important;
    background-position: bottom;
    background-size: cover;
}

.verkkokaupan-content-area {
    margin-top: -300px;
}

.verkkokaupan .page-hero h1 {
    width: 50%;
}

.verkkokaupan-content-area h3{
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 46px;
    line-height: 52px;
    color: #FFFFFF;
    word-break: break-word;
}

.verkkokaupan-content-area .delivery p span{
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
}

.verkkokaupan-content-area .delivery p a {
    color: #2FA6FF;
    text-decoration: none;
}

.verkkokaupan-content-area .cards:nth-child(1) .card {
    background: url(/common/images/s-bg-2.png);
    padding: 34px;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    border-radius: 30px;
    height: 100%;
}

.verkkokaupan-content-area .cards:nth-child(2) .card {
    background: url(/common/images/s-bg-4.png);
    padding: 34px;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    border-radius: 30px;
    height: 100%;
}

.verkkokaupan-content-area .orders .card-body {
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    color: #C0CAFD;
    font-size: 16px;
    line-height: 24px;
}

.verkkokaupan-content-area .orders h5.card-title {
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 24px;
    line-height: 34px;
    color: #FFFFFF;
    word-break: break-word;
}

.verkkokaupan-content-area .orders .card-body a {
    color: #2FA6FF;
    text-decoration: none;
}

/* checkout */


.checkout .search-area p {
    max-width: 58%;
}

.checkout-content-area .form-control ,.checkout-content-area .form-select{
    background-color: #FFFFFF0D !important;
    border: 1px solid #C0CAFD66;
    border-radius: 10px;
    height: 52px;
    color: #C0CAFD;
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 27px;
    padding-left: 18px;
    padding-right: 18px;
}

.checkout-content-area  label.col-form-label ,.checkout-content-area label.form-check-label{
    font-family: 'Satoshi Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 27px;
    color: #C0CAFD;
    word-break: break-word;
}

.checkout-content-area label.form-check-label a{
    color:#2FA6FF ;
    text-decoration: none;
}

h4.form-area-title {
    font-family: 'Satoshi Bold';
    font-style: normal;
    font-weight: normal;
    font-size: 32px;
    line-height: 48px;
    color: #ffffff;
}

.checkout-content-area .form-field-area {
    width: 70%;
}

.checkout-content-area input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;
    margin: 0;
    width: 31px;
    height: 31px;
    background: #FFFFFF0D 0% 0% no-repeat padding-box;
    border: 1px solid #C0CAFD66;
    border-radius: 10px !important;
    transform: translateY(-0.075em);
    display: grid;
    place-content: center;
    margin-right: 15px;
}

.checkout-content-area p.required {
    font-size: 16px;
}


.checkout-content-area input[type="checkbox"]::before {
    content: "";
    width: 13px;
    height: 12px;
    transform: scale(0);
    transform-origin: bottom left;
    transition: 120ms transform ease-in-out;
    background-color: #C0CAFD;
    clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}

.checkout-content-area select {
    background: url(../common/image/arrow-down.svg);
    background-size: 24px;
    background-position: right 16px center !important;
    background-repeat: no-repeat;
}

.checkout-content-area select option{
    color: #000000 !important;
}

.checkout-content-area input[type="checkbox"]:checked::before {
    transform: scale(1);
}

.checkout-content-area button.btn.btn-primary {
    color: #101620 !important;
    padding: 18px 23px !important;
    margin-bottom: 100px;
}

.checkout-content-area button.btn.btn-primary:hover {
    color: #FFFFFF !important;
}

.checkout-content-area {
    margin-top: -300px;
}


/* thank you */

body.inner-page.thank {
    background-image: none !important;
}

.thank .page-hero {
    padding: 282px 0px 300px 0px;
}


/* footer */

p.copywrite {
    font-family: Segoe UI-MONOSPACE;
    font-size: 16px;
    line-height: 21px;
    opacity: 0.5;
}

.copywrite-area a.nav-link {
    line-height: 15px;
    border-right: 1px solid #000000;
    padding: 0px 8px !important;
}

.copywrite-area li.nav-item:last-child a {
    border-right: 0px !important;
}

.dark-mode .copywrite-area a.nav-link {
    border-right: 1px solid #FFFFFF;
}



/* media quaries */
@media only screen and (min-width: 1025px) and (max-width: 1200px) {

    /* Homepage */
    .blog-img img{
        width: 100%;
    }

    .bottom-two-col {
        background-size: 50%;
    }

    .home-hero-white{
        background-size: 50%;
    }


    /* yhted */
    .album .g-lg-5 {
        --bs-gutter-x: 1rem;
    }

    .khuinka-card-list .cards {
        padding: 28px 20px;
    }

    /* sertificates */
    .sertificates .hero-txt {
        width: 70%;
    }

    .sertificates h5.card-title {
        width: 50%;
    }

    .sertificates .card img {
        width: 100%;
    }

    /* product-single */
    .dt:nth-child(1) {
        width: 8%;
    }

    .dt:nth-child(2) {
        width: 12%;
    }

    .dt:nth-child(3) {
        width: 44%;
    }

    .dt:nth-child(4) {
        width: 15%;
    }

    .dt:nth-child(5) {
        width: 10%;
    }

    .dt:nth-child(6) {
        width: 11%;
    }

    /* product-single */
    .ele {
        width: 70%;
        padding-bottom: 10px;
    }

    .ele:first-child{
        width: 30%;
    }

    /* fontit single */

    .modal-body .sample-title {
        line-height: 40px;

    }

    /* verkkokaupan */
    .verkkokaupan .page-hero h1 {
        width: 70%;
    }


}

@media only screen and (min-width: 881px) and (max-width: 1024px) {

    /* Homepage */
    .blog-img img{
        width: 100%;
    }

    .bottom-two-col {
        background-size: 50%;
    }

    .home-hero-white{
        background-size: 50%;
    }

    .banner-area {
        margin: 60px 0px 54px 0px;
    }

    /* yritys */
    .icon-shape {
        width: 50%;
    }

    /* yhted */
    .album .g-lg-5 {
        --bs-gutter-x: 1rem;
    }

    .khuinka-card-list .cards {
        width: 33%;
        min-height: 238px;
        margin-bottom: 2rem;
        padding: 28px 20px;

    }

    /* sertificates */
    .sertificates .hero-txt {
        width: 100%;
    }

    .sertificates h5.card-title {
        width: 50%;
    }

    .sertificates .card img {
        width: 100%;
    }

    /* product-single */
    .dt:nth-child(1) {
        width: 8%;
    }

    .dt:nth-child(2) {
        width: 12%;
    }

    .dt:nth-child(3) {
        width: 44%;
    }

    .dt:nth-child(4) {
        width: 15%;
    }

    .dt:nth-child(5) {
        width: 10%;
    }

    .dt:nth-child(6) {
        width: 11%;
    }

    .ele {
        width: 65%;
        padding-bottom: 10px;
    }

    .ele:first-child{
        width: 35%;
    }

    /* fontit single */

    .modal-body .sample-title {
        line-height: 40px;

    }

    /* verkkokaupan */
    .verkkokaupan .page-hero h1 {
        width: 83%;
    }

    /* checkout */

    .checkout-content-area .form-field-area {
        width: 100%;
    }



}
@media only screen and (min-width: 768px) and (max-width: 880px) {

    a.navbar-brand img {
        width: 137px;
    }

    a.nav-link {
        padding: 0px 12px !important;
    }

    /* Homepage */
    .blog-img img{
        width: 100%;
    }

    .bottom-two-col {
        background-size: 50%;
    }

    .home-hero-white{
        background-size: 50%;
    }

    .banner-area {
        margin: 60px 0px 54px 0px;
    }

    .bottom-two-col {
        padding: 70px 0px;
        margin: 50px 0px;
    }

    /* yritys */
    .icon-shape {
        width: 50%;
    }

     /* yhted */
    .khuinka-card-list .cards {
        width: 33%;
        min-height: 238px;
        margin-bottom: 1rem;

    }

    /* sertificates */
    .sertificates .hero-txt {
        width: 100%;
    }

    .sertificates h5.card-title {
        width: 60%;
    }
    .icon-square {
        width: 40%;
    }

    .sertificates .card img {
        width: 100%;
    }

    /*  */
    .dt:nth-child(1) {
        width: 11%;
    }

    .dt:nth-child(2) {
        width: 17%;
    }

    .dt:nth-child(3) {
        width: 22%;
    }

    .dt:nth-child(4) {
        width: 21%;
    }

    .dt:nth-child(5) {
        width: 14%;
    }

    .dt:nth-child(6) {
        width: 15%;
    }

    .ele {
        width: 65%;
    }

    .ele:first-child{
        width: 35%;
    }

    /* fontit single */

    .modal-body .sample-title {
        line-height: 40px;

    }

    /* verkkokaupan */
    .verkkokaupan .page-hero h1 {
        width: 100%;
    }

    /* checkout */

    .checkout-content-area .form-field-area {
        width: 100%;
    }

    .checkout .search-area p {
        max-width: 100%;
    }

    /*  */



}

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

    .mobile-only{
        display: block;
    }

    .mobile-hide{
        display: none !important;
    }

    /* default */
    .h1{

        font-size: 38px;
        line-height: 42px;

    }

    .h2{
        font-size: 32px;
        line-height: 40px;
        text-align: center;
    }

    body {
        background-position: 100% 93%;
    }

    .container{
        padding: 0px 20px;
        max-width: 767px;
    }
    /* header */

    div#navbars04 {
        background: #111111;
        position: absolute;
        top: 100px;
        width: 100%;
        left: 0;
        padding: 20px;
    }

    a.nav-link {
        font-size: 12px;
        line-height: 22px;
    }

    .main-menu a.nav-link {
        color: #FFFFFF;
    }
    /* button.navbar-toggler {
        background: #111111;
    }
    .dark-mode button.navbar-toggler {
        background:transparent;
    } */

    /* homepage */
    .hero-heading {
        font-size: 38px !important;
        line-height: 42px !important;
    }

    .home-hero {
        background: url(/common/images/mob-herong.png);
        background-size: contain;
        background-position: top right;
        background-repeat: no-repeat;
        padding-top: 150px;
        padding-bottom: 50px;
    }

    .dark-mode .ajan-slider {
        background: url(/common/images/ajan-mob.png) !important;
        background-size: 100% !important;
        background-repeat: no-repeat;
    }

    .home-hero-white {
        background: none !important;
        padding-top: 80px;
        padding-bottom: 0;
    }

    .hero-img img {
        position: relative;
        right: -20px;
    }

    .banner-area {
        margin: 50px 0px 50px 0px;
    }


    .dark-mode .two-col-1 {
        padding: 0px 0px 100px 0px !important;
    }

    .bottom-two-col{
        background-image: none !important;
        padding: 50px 0px;
    }

    .mb-banner {
        background: transparent linear-gradient(178deg, #FFFFFF 35%, #10007D 65%) 0% 0% no-repeat padding-box;
        border: 1px solid #707070;
        border-radius: 5px;
        padding: 22px;
    }

    .mb-banner h6 {
        font-family: 'Satoshi Bold';
        font-style: normal;
        font-weight: normal;
        font-size: 20px;
        line-height: 37px;
        color: #FFFFFF;
    }

    .percent{
        font-family: 'Satoshi Bold';
        font-style: normal;
        font-weight: normal;
        font-size: 82px;
        line-height: 82px;
        color: #FFFFFF;
    }

    .mb-banner a.btn {
        background: #10007D 0% 0% no-repeat padding-box;
        border: 1px solid #707070 !important;
        border-radius: 9px;
    }

    .btn {
        font-size: 16px;
        line-height: 22px;
        padding: 14px 22px !important;
    }

    .bottom-two-col .container img{
       margin-left: -20px;
    }

    p.copywrite {
        font-size: 12px;
        line-height: 16px;

    }

    .dark-mode .offer-area {
        padding: 50px 0px;
        margin: 0px 0px 50px 0px;
    }

    .dark-mode .two-col-2 .poly03{
        height: 399px;
        top: 23% !important;
    }

    .blog-img img {
        width: 100%;
    }

    .mob-blog-slider .swiper-slide p {
        color: #4B4D67;
    }

    .dark-mode .mob-blog-slider .swiper-slide p {
        color: #C0CAFD;
    }

    /* palvelumma */
    .page-hero {
        padding: 204px 0px 375px 0px;
    }

    .ac-title {
        width: 68%;
        word-break: break-word;
    }

    .accordion-button {
        gap:15px;
        padding: 32px 15px;
        font-size: 22px;
        line-height: 32px;
    }

    .accordion-body {
        padding: 27px;
    }

    /* faq */
    .faq-accordion-section {
        margin-top: -285px;
    }

    /* yritys */
    .icon-shape {
        width: 100%;
        max-width: 324px;
    }

    /* yhte */
    .khuinka-card-list .cards {
        width: 100%;
        border-radius: 44px;
        margin-bottom: 1.5rem;
        min-height: 238px;
    }

    .khuinka-card-list .card-list-2 .cards:nth-child(4) {
        width: 100%;
    }

    ul.logo-list {
        padding-top: 30px;
    }

    .logo-list li {
        margin-bottom: 0;
    }

    .map-box {
        padding-left: 0px;
        padding-right: 0px;
    }

    /* sertificates */
    .sertificates .hero-txt {
        width: 100%;
    }

    .sertificates h5.card-title {
        width: 60%;
    }

    .icon-square {
        width: 40%;
    }

    .sertificates .card img {
        width: 100%;
    }

     /* tuotehaku */

    .tuotehaku .accordion-body .col-right {
        border-left: 0;
        padding-left: 0 !important;
    }

    /* pro-single */

    .tuotehaku-single .page-hero h1 {
        font-size: 42px;
        line-height: 52px;
    }

    .dt:nth-child(1) {
        width: 11%;
    }

    .dt:nth-child(2) {
        width: 17%;
    }

    .dt:nth-child(3) {
        width: 22%;
    }

    .dt:nth-child(4) {
        width: 21%;
    }

    .dt:nth-child(5) {
        width: 14%;
    }

    .dt:nth-child(6) {
        width: 15%;
    }

    .ele:first-child ,.ele{
        width: 100%;
    }

    .tuotehaku-single .dt {
        width: 100% !important;
    }

    /* Valmistajat */
      .Valmistajat .Tuotehaku-accordion-section {
        margin-top: -335px;
    }

    /* fontit */
    .fontit .Tuotehaku-accordion-section {
        margin-top: -322px;
    }

    /* fontit single */
    .modal-content {
        padding: 70px 0px;
    }
    .btn-close {
        width: 22px;
        right: 12px;
        top: 18px;
    }

    .modal-body .sample-title {
        line-height: 40px;

    }

    /* verkkokaupan */
    .verkkokaupan .page-hero h1 {
        width: 100%;
    }

    .verkkokaupan-content-area h3 {
        font-size: 32px;
        line-height: 42px;
    }

    /* checkout */

    .checkout-content-area .form-field-area {
        width: 100%;
    }

    .checkout-content-area .form-select {
        padding-right: 39px;
    }

    .checkout .search-area p {
        max-width: 100%;
    }
    .nobr {
        white-space: nowrap;

    }


}