@charset "utf-8";
/* CSS Document */

/* reset marginesów i dopełnień */
html, body, ul, li { margin: 0; padding: 0; }

/* reset wysokości linii i fontu */
h1, h1, h2, h3, h4, ul, li, ol, p { margin:0; padding:0; font-size: 1em; line-height: 1.7em; }

/* ustawienia ogólne */
body { background: #fff top left repeat; font: 0.625em/1.5em 'Poppins', sans-serif; color: #0c2a34; }

/* szerokość strony */
.content { margin: 0 auto; padding-left: 4%; padding-right: 4%; max-width: 1520px; width: 100%; }

/* reset ramek obrazków */
a img { border: none; }

h1, h1, h2, h3, h4, h5, h6, .banner .response p, .banner .response input, .fw, .accordion-header, .checkbox-cnt span, span.button, .banner .advantages .col-3 p:nth-child(2) { font-family: 'Oswald', sans-serif; }
h1, h1, h2, h3, h4, h5, h6 { font-weight: 700; line-height: 1.15em; letter-spacing: -.01em; }

p, input { font-family: 'Poppins', sans-serif; font-size: 1.6em; }

a { color: #0c2a34; line-height: 1em; outline: none; text-decoration: none; }
a:hover { text-decoration: none; }

li { list-style: none; font-size: 1.6em; }

a, header, #myLinks, .mobile_btn a:after, .splide__track li, span.button, .splide__arrow, #acceptPolicy, .banner .advantages .col-3 p, header .logo img, .offer-more img { transition: all 200ms ease-in-out; }

.container { position: relative; width: 100%; }
/*.container_a { overflow: hidden; }*/

/*html { scroll-behavior: smooth; }*/

/* header */

header { position: fixed; top: 0; padding-top: 30px; padding-bottom: 30px; width: 100%; z-index: 33333;  }

header.fixed, .pp header { position: fixed; padding-top: 5px; padding-bottom: 11px; background: rgba(12,42,52,.9); }
header .logo img { margin-top: 15px; }

header .content .topnav .col-3:nth-child(1), header .content .col-3:nth-child(3) { width: 25%; }
header .content .topnav .col-3:nth-child(1) { min-width: 250px; }
header .content .topnav .col-3:nth-child(2) { width: 50%; }
header .content .topnav .col-3:nth-child(3) { text-align: right; }


nav{ position: relative; margin-top: 22px; z-index: 2; }
nav, nav ul { float: left; width: 100%; }
nav ul li { font-size: 1.4em; }
nav ul li a { display: block; padding: 13px 0; width: 100%; color: #fff; font-weight: 700; text-align: center; text-decoration: none; }
/*li.active a { color: #fff; }*/
nav ul li a:hover, .fixed li.active a { color: #06fb85; }


.mobile_btn { margin-top: 3px; font-size: 1.7em; }
#main .mobile_btn { padding-bottom: 20px; }
.mobile_btn a { position: relative; display: inline-block; margin-top: 14px; padding: 17px 50px; color: #0c2a34; font-weight: 600; text-align: center; background: #06fb85; outline: 3px solid transparent; border-bottom: 3px solid #00b860; border-radius: 50px; }
header .mobile_btn a { padding: 14px 40px; }
.mobile_btn a:hover { color: #fff; background: #00b860; outline: 3px solid #06fb85; box-shadow: 0px 1px 18px 1px rgba(6,251,133,.9); }
.mobile_btn a i { position: relative; left: 0; transition: all 250ms ease-in-out; }
.mobile_btn a:hover i { left: 5px; }


/* banner */

.banner { position: relative; color: #fff; min-height: 959px; text-align: center; background: #0c2a34 url(images/tworzenie-stron-i-sklepow-internetowych-banner.webp) top center no-repeat fixed; z-index: 1 }
.banner .content { padding-top: 260px; }
.banner h1 { margin-bottom: 30px; font-size: 6em; color: #fff; }
.banner h1 span { color: #06fb85; }
.banner h1 sup { font-size: .6em; }
.banner h2 { font-size: 4.8em; font-weight: 100; }
.banner .response { margin-top: 90px;  }
.banner .response p { color: #06fb85; font-size: 1.4em; font-weight: 400; }
.banner .response strong { font-weight: bold; }
.banner .response input { margin: 0 auto; padding: 25px; max-width: 475px; color: #fff; font-size: 1.35em; font-weight: 400; background: transparent; border: 1px solid #dfe4eb; border-radius: 50px; outline: none; }
.banner .advantages { margin: 220px auto 0; max-width: 58rem; }
.banner .advantages .col-3 { position: relative; margin: 0 1%; /*padding: 0 1%;*/ padding: 0 15px 20px; top: 0; width: 31.33%; background: rgba(12,42,52,.8); border-radius: 20px; transition: all 250ms ease-in-out; }
.banner .advantages .col-3:hover { top: -10px; }
.banner .advantages .col-3 p { margin-top: 17px; font-weight: 700; line-height: 1.5em; font-size: 1.8em; }
.banner .advantages .col-3 p:nth-child(2) { font-size: 2.1em; color: #06fb85; }
.banner .advantages .col-3 p:nth-child(3) { line-height: 1.3; }
.banner .advantages .col-3 i, .fa-thumbs-up, .contact-row i, .contact-information i { padding: 19px 10px; width: 80px; text-align: center; color: #06fb85; background: #fff; border-radius: 100px; box-shadow: 0 5px 30px -5px #0c2a34; }
.banner .advantages .col-3 i { margin-top: -50px; }
.banner .advantages .col-3 i:hover, .contact-information i:hover { transform: scale(1.1,1.1)!important }

#wrapp .checkbox-cnt { margin: 15px auto 0; max-width: 29rem; text-align: left; color: #dfe4eb; }
#wrapp .checkbox-cnt a { color: #dfe4eb; font-weight: bold; }
#wrapp .checkbox-cnt a:hover { color: #06fb85; }


/* main */

#main { background: url(images/offer.webp) top center no-repeat;}

#one { margin-top: -20px; padding-top: 60px; }
#two-cooperation { padding-top: 90px; }
#three, #four {  padding-top: 120px; }
#six { position: relative; margin-top: 0; padding-top: 120px; z-index: 1; }

header, #one, #two-cooperation, #two, #three, #four, #five, #footer { overflow: hidden;  }

/*#four ,*/ .cooperation-section { position: relative; padding-bottom: 4rem; }

.faq-section { position: relative; }

#six::before, .cooperation-section::before { content:''; position: absolute; top: -150px; width: 660px; height: 996px; background: url(images/footer-left.webp) top left no-repeat; z-index: -1; }
#six::after, .cooperation-section::after, .faq-section:before { content:''; position: absolute; top: -100px; right: 0; width: 660px; height: 996px; background: url(images/footer-right.webp) top left no-repeat; z-index: -1; }
.cooperation-section::before{ top: auto; bottom: 0; background: url(images/footer-right.webp) top left no-repeat; transform: scaleX(-1); }
.cooperation-section::after { top: auto; bottom: 0; background: url(images/footer-left.webp) top left no-repeat; transform: scaleX(-1); }

#main h2 { position: relative; margin-bottom: 100px; font-size: 4.5em; }
/*#main h2:after, .contact h5:after,*/ .bb { position: absolute; left: 50%; margin: -70px auto 0; padding: 5px 15px; font-weight: bold; font-size: 1.3em; color: #0c2a34; text-align: center; background: #06fb85; border-radius: 50px; transform: translateX(-50%)!important; }
.bb.sec { left: 0; transform: none !important; }

.about { position: relative; } 
/*.about:after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 65px; z-index: -1; background: #f4f4f4; }*/
.about .content { padding-top: 60px; }
.about span { font-weight: 800; }
#main span.fcw { font-weight: 700; color: #06fb85; }
.about .row { width: auto; }
.about h2 { text-align: center; }
.about h2 .bb { left: 0; right: 0; }

.nns #main { text-align: center; }
.pp.nns #main h2 { margin-top: 70px !important; font-size: 2em!important; }
.nns h2 a { padding: 10px 20px; background: #fff; border: 2px solid #06fb85; border-radius: 50px; }
.nns h2 a:hover { color: #fff; background: #06fb85; }


@keyframes animacja
{
0% { top: 0; }
25% { top: 5px; }
50% { top: 0; }
75% { top: 5px; }
100% { top: 0; }
}

.offer { display: flow-root; }
#main .offer h2 { margin-bottom: 70px; }
.carousel .splide__track li { padding-top: 5rem!important; padding-bottom: 4rem!important; }
#main .carousel .splide__slide h3 { font-size: 2.2em; }
.carousel .splide__slide strong { color: #06fb85; }
.carousel .splide__slide .number { position: relative; float: left; top: -20px; margin-right: 25px; }
.carousel .splide_back { padding: 10px 50px 45px; background: #fff; border-radius: 50px; box-shadow: 0px 12px 40px -15px rgba(12,42,52,.3); }
.carousel .splide_top { position: relative; top: -25px; display: inline-block; width: 100%; }
.carousel .splide_bottom { position: relative; top: -12px; font-size: 1.15em; line-height: 1.6em; }

.carousel2 { position: relative; margin: 0 auto; max-width: 1920px; background: #edfbf8; }
.carousel2 ul { display: flex; }
.carousel2 img { width: 100%; height: auto; }

.carousel .splide li .splide_top .number  { position: relative; padding: 20px 17px; width: 67px; color: #fff; font-weight: 800; font-size: 3em; background: #94d0b3; text-align: center; border-radius: 50px; box-shadow: 0 5px 20px -10px #0c2a34; }
.carousel .splide li.is-active:hover .splide_top .number { animation: animacja2 .5s ease-out 1 normal none; }


@keyframes animacja2
{
0% { top: -20px; }
50% { top: -30px; }
100% { top: -20px; }
}

.is-style-delay1 { animation: delay 1s linear; }
.is-style-delay2 { animation: delay2 1.5s linear; }

@keyframes delay {
  0% {
    opacity: 0;
  }
  25% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}


@keyframes delay2 {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}


/*.col-2 { float: left; margin-bottom: 30px; width: 50%; }*/
.col-2 img { width: 100%; height: auto; }
.col-3 { float: left; width: 33.33%; }


.carousel .splide__track { z-index: 2!important; }
.splide__arrow { width: 3.5em!important; height: 3.5em!important; background: #fbfbfb!important; z-index: 3!important; border: 3px solid #06fb85!important; box-shadow: 0px 10px 30px -7px rgba(12,42,52,.3); }
.splide__arrow:hover { background: #fff!important; }
.carousel .splide__track li { opacity: .7; /*transform: scale(.9,.9);*/ }
.carousel .splide__track li, .carousel .splide__track li strong { color: #7a8d89; }
.carousel .splide__track li img { filter: grayscale(100%); }
.carousel .splide__track li.is-active { opacity: 1; /*transform: scale(1,1);*/ }
.carousel .splide__track li.is-active strong { color: #06fb85; }
.carousel .splide__track li.is-active { color: #0c2a34; }
.carousel .splide__track li.is-active img { filter: grayscale(0%); }
.carousel .splide__track li.is-active .splide_top .number { background: #06fb85; }

.offer-more { margin-top: -4rem; padding-top: 130px; }
.offer-more .content:nth-child(1) { margin-top: 30px; margin-bottom: 30px; }
.offer-more .content { display: flow-root; }
.offer-more .col-2.img-block { text-align: center; }
.offer-more .col-2.img-block img.bri:nth-child(1):hover, .offer-more .col-2.img-block img.bri:nth-child(3):hover { transform: scale(1.1,1.1); }
.offer-more img { width: 100%; max-width: 664px; height: auto; /*box-shadow: 0 5px 30px -5px rgba(51,61,75,.3);*/ transition: all 600ms ease-in-out; }
/*.offer-more img:hover { box-shadow: 0 5px 35px -5px rgba(7,252,134,.5); }*/
.offer-more h4 { margin-top: 5px; margin-bottom: 50px; font-size: 4.2em; }
.offer-more a { color: #06fb85; font-size: 1.1em; font-weight: bold; text-transform: uppercase; line-height: 3em; }
.offer-more a:hover { color: #0c2a34; }
/*.offer-more .col-2 { float: left; width: 50%; }*/
.offer-more .col-2 .fs, .offer-more .col-3 .fs { font-size: 5em; color: #06fb85; }
.fw { margin-top: 5px; font-size: 2em; font-weight: bold; line-height: 1.2em; }
.offer-more .fs { line-height: .5em; }
.offer-more .row .col-2, .offer-more .row .col-3 { margin-right: 20px; margin-bottom: 28px; }
.offer-more .row .col-2 { float: left; margin-right: 0!important; width: 50%; }
.fsd { display: block; padding-left: 20px; line-height: 1.5; font-size: 1.2em; border-left: 3px solid #06fb85; }
#main .offer-more .grid h2 { margin-bottom: 100px; }
ul.list-color { margin-top: 2em; margin-left: 1.25em; }
ul.list-color li { padding-left: 12px; list-style: disc; list-style-position: outside; }
ul.list-color li::marker { color: #06fb85; }
ul.list-color.sec li::marker { color: #0c2a34; }

#two-cooperation .bb { margin-top: -35px; }

.bri { border-radius: 40px; }

.other { /*margin-top: 130px;*/ background: #fff url(images/other.webp) top center no-repeat fixed; }
.other h2, .cooperation h2, .contact h2 { width: 100%; text-align: center; }
.other .row { text-align: center; }
.other .content { display: flow-root; padding-bottom: 130px; }
.other .blocks { padding-top: 80px; }
.other .block { padding: 0 50px 60px; color: #fff; border-radius: 50px; box-shadow: 0 5px 30px -5px rgba(51,61,75,.5); }
.bl { background: #0c2a34 url(images/db.png) right 30px top 63px no-repeat; }
.br { background: #06fb85 url(images/db2.png) right 30px top 63px no-repeat; color: #0c2a34!important; }
.other i { position: relative; display: block; top: -45px; margin: 0 auto; padding: 20px 10px; width: 90px; text-align: center; background: #fff; border-radius: 50px; box-shadow: 0 5px 30px -5px rgba(51,61,75,.5); }
.other i:hover { transform: scale(1.1,1.1)!important; }
.bl i { color:#06fb85; border: 5px solid #06fb85; }
.br i { color:#0c2a34; border: 5px solid #0c2a34; }
.other .block h3 { margin-bottom: 30px; font-size: 3.3em; }

/*.cooperation { background: url(images/cooperation.webp) center 3em no-repeat; }*/
.cooperation .col-4 { margin-bottom: 4%; padding: 40px 30px; border: 6px solid #ebf3f2; border-radius: 50px; }
.cooperation .col-4:hover { border-color: #06fb85; }
.cooperation .bh { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 2px solid #ebeff3; }
.cooperation h3 { margin-bottom: 15px; font-size: 2.75em; }
.cooperation p.fs, .about p.fs { font-size: 2em; line-height: 1.4em; }
.cooperation p.fw { font-weight: bold; }
.cooperation .col-4 i { margin-bottom: 20px; color: #06fb85; }
.cooperation .col-4 i:hover { transform: scale(1.2,1.2); }
#main .cooperation .sec h2 { font-size: 2.5em; }
.cooperation .sec .col-4 { padding: 30px 30px 20px; background: #f3f6f9; }
.cooperation .sec h3 { margin-bottom: 0; font-size: 2em; text-align: center; }

#five { margin-top: -1rem; padding-top: 8rem; padding-bottom: 4rem; outline: none; }
.faq { max-width: 790px; margin: 0 auto; }

.afs p { margin-bottom: 5.5%; font-size: 1.4em; }

.row { display: inline-table; width: 100%; }


.contact { margin-top: 90px; padding-bottom: 70px; color: #fff; background: #0c2a34 url(images/footer.webp) bottom center no-repeat fixed; }
.contact .grid .fs, .contact-information p { font-size: 2.4em; }
.contact .grid .row { margin-bottom: 50px; }
.contact h3 { margin-bottom: 20px; font-size: 2.4em; }
.contact .fs a { font-weight: 800; color: #fff; hyphens: auto; }
.contact .fs a:hover { color: #06fb85; }
.tc { color: #06fb85; font-size: 1.4em; }

.contact h5 { position: relative; margin-top: 0; margin-bottom: 60px; font-size: 2.4em; line-height: 1.2em; }

.contact .form-row { margin-bottom: 20px; display: grid; grid-template-columns: 50% 50%; }
.contact .form-row div:nth-child(1) { margin-right: 4%; }
.contact .form-row div:nth-child(2) { margin-left: 4%; }
.contact .form-row.full { grid-template-columns: 100%; }

.contact-row, .contact-information { padding: 40px 0 5px; }
.contact-row i. .contact-information i { margin-right: 15px; padding: 13px 10px; width: 58px; }
.contact-row p { padding-top: 7px; }

.contact .sfrow { display: grid; grid-template-columns: 80% 20%; }
.contact .sfrow dic:nth-child(1) { margin-right: 20%; }


.footer { position: relative; padding-top: 110px; color: #bfd4d2; font-size: .85em; }
.footer a { color: #bfd4d2 }
.footer a:hover { color: #fff; }
.footer .content { text-align: center; }
.footer .content .col-2:nth-child(2) { text-align: right; }

#acceptPolicy { font-weight: 700; background: #fff; border: 3px solid #06fb85; border-radius: 50px; cursor: pointer; }
#acceptPolicy:hover { color: #fff; background: #06fb85; border-color: #06fb85; }
.edu-cookie-info a:hover { color: #06fb85; }

#website, #website2 { display:none; }

.txt_button { margin-top: 30px; }

.message a { font-weight: bold; }

.pp .logo img { top: -5px; }
.pp #main { padding-top: 150px; padding-bottom: 80px; }
.pp h1 {margin-bottom: 30px; font-size: 4em; }
.pp #main h2 { margin: 50px 0 30px!important; font-size: 3em!important; }
.pp li ul li, .pp li ol li { margin-left: 15px; margin-padding: 10px; font-size: inherit; list-style: disc; }
.pp .footer { padding-bottom: 30px; background: #144485; }

.icon-block { width: 22%; text-align: center; }
.fa-thumbs-up { padding: 25px 10px; width: 110px; box-shadow: 0 5px 30px -5px rgba(51,61,75,.2); }
.fa-thumbs-up:hover { transform: scale(1.1,1.1)!important }
.txt-block { width: 70%; }

.contact-row i { float: left; }

::placeholder { color: #a4b9c3; opacity: 1; }

.sc { display: flex; position: relative; height: 175px; margin: 6rem auto auto; background: #06fb85; overflow: hidden; z-index: 2; }
.sct { position: absolute; top: 0; left: 0; width: 100%; height: 100%; white-space: nowrap; transition: all 1s ease; }
.sci { display: flex;  align-items: center; justify-content: flex-start; width: max-content; height: 100%; animation: scrollText 50s infinite linear; }
.sci p { margin: 0; max-width: 100%!important; font-family: "Poppins",sans-serif; font-size: 10em; font-weight: 800; color: #06fb85; text-transform: uppercase; -webkit-text-stroke: 2px #0c2a34; transition: all 2s ease; }

@keyframes scrollText {
  from   { transform: translateX(0%); }
  to { transform: translateX(-50%); }
}

.accordion { padding-bottom: 1px; border-radius: 8px; overflow: hidden; }
.accordion-item { border-bottom: 1px solid; border-image: linear-gradient(to right, #b3c8c7, #0c2a34, #b3c8c7) 1; border-left: 0; border-right: 0; border-top: 0; }
.accordion-header { padding: 1rem 4rem 1rem 0; width: 100%; font-weight: bold; font-size: 2em; text-align: left; background: none; border: none; cursor: pointer; transition: all 0.4s ease; }
.accordion-header::after { position: absolute; right: 1px; font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f061"; display: block; width: 20px; height: 20px; top: 20px; padding: 10px; text-align: center; background: #fff; border: 2px solid #06fb85; border-radius: 100%; transition: all 0.3s ease; }
.accordion-header:hover::after { color: #06fb85; }
.active .accordion-header::after { color: #06fb85; transform: rotate(90deg); }
.accordion-header span { font-size: 1.75em; color: #b3c8c7; }
.accordion-content { max-height: 0; overflow: hidden; transition: max-height 0.5s ease, padding 0.4s ease; padding: 0 1rem; }
.accordion-content p { margin: 1rem 0; }
.accordion-item .accordion-content { padding: 0; }
.accordion-item.active .accordion-content { padding: 0 0 1rem; }

.cooperation-block { position: relative; }
.cooperation-block::after { position: absolute; font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f013"; top: -170px; left: 50%; transform: translateX(-50%); color: #edfbf8; font-size: 40rem; transition: all 0.3s ease; animation: roll 25s linear infinite; z-index: -1; }

@keyframes roll {
  0% {
    transform: translateX(-50%) rotate(0deg);
  }
  100% {
    transform: translateX(-50%) rotate(360deg);
  }
}

.align-center { margin: 0 auto; text-align: center; }

.lang-img { display: block; float: left; margin-top: 22px; width: 40px; height: 40px; border: 3px solid transparent; border-radius: 100%; }
.lang-img:hover { border-color: #06fb85; }
.lang-img img { width: 100%; height: auto; }

a.gtt { position: absolute; display: flex; justify-content: center; bottom: -100px; left: 0; right: 0; margin: 0 auto; padding-top: 10px; width: 70px; height: 70px; font-size: 24px; background-color: #06fb85; color: #0c2a34; border: 3px solid #06fb85; border-radius: 50%; cursor: pointer; pointer-events: auto;  transition: all 0.3s; }
a.gtt:hover { color: #fff; background-color: #0c2a34; }







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

#myLinks { display: block!important; }
nav ul li { float: left; width: 20%; }
#myLinks .mobile_btn { display: none; }

header .content .col-3:nth-child(2) { width: 44%; padding: 0px 2%; }

header .content .topnav .col-3:nth-child(2) .lang-img { display: none; }

.logo img:hover { transform: scale(1.075); }

.ddn { display: none; }

.banner h1 { max-width: 800px; text-align: left; }
.banner .banner-desc { width: 50%; text-align: left; font-size: 1.7em; }
.banner .advantages { margin-top: 200px; }

.contact .grid { display: grid; grid-template-columns: 50% 50%; }

}
	
	


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

/*.offer-more .grid-top .col-2:nth-child(2) { margin-left: 50px; }
.offer-more .grid .col-2:nth-child(1) { margin-right: 55px; }*/

.about .row { display: flex; margin-bottom: 30px; }

.offer-more { background: url(images/offer-more.webp) bottom center no-repeat; }
.offer-more .content:nth-child(1) { margin-top: 0; margin-bottom: 100px; }
.offer-more .content { display: grid; grid-template-columns: 1fr 1fr; gap: 5.5em; align-items: center; }

.blocks { display: flex; }
.bl { margin-right: 30px; }
.br { margin-left: 30px; }
.other .block { width: 50%; }

.cooperation .content .row { display: flex; }
.cooperation .content .row:nth-child(1) { margin-bottom: 40px; }
.cooperation .col-2 { float: left; width: 50%; }
.cooperation .col-4 { float: left; margin-right: 1.9%; width: 23.5%; }
.cooperation .col-4:nth-child(4) { margin-right: 0; }
.cooperation .col-4:hover { transform: scale(1.05,1.05)!important; }


.cooperation-section::after { background-position: top 5px left; }

.cooperation-block .row:nth-child(2) { display: flex!important; margin-bottom: 100px; gap: 9em; }

.faq-section::before { display: none; }
.accordion-header:hover, .active .accordion-header { padding-left: .5em; }

.contact .grid .col-2:nth-child(1) { margin-right: 5%; }

.contact .f-bottom { width: 50%; text-align: center; }
.contact .contact-information { display: grid; grid-template-columns: 50% 50%; gap: 2em; }
.contact-information p { margin-top: 15px; }

}




@media screen and (min-width: 801px) and (max-width: 1401px) {

.cooperation .content .row { display: inline-block; }
.cooperation .col-4 { margin-right: 6%; margin-bottom: 5%; width: 47%; }
.cooperation .col-4:nth-child(2), .cooperation .col-4:nth-child(4) { margin-right: 0; }
.cooperation .sec .col-4 { padding: 25px 30px 25px; }
.afs p { margin-bottom: 7%; }

.other .block { padding: 0 40px 60px; }

}








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

.about .row.sec { position: relative; top: 50px; margin-top: 0; margin-left: 415px; } 

.carousel #splide01 { margin-right: 35%; max-width: 62%!important; padding: 0 3%; }
.carousel #splide01-track { position: relative; overflow: inherit; }
/*#splide01-track:after { content:''; position: absolute; top: 0; left: -5em; width: 5rem; height: 100%; background: linear-gradient(90deg, rgba(255,255,255,.9) 0%, rgba(255,255,255,0) 100%); }*/
.carousel .splide__track li { padding-left: 5rem!important; padding-right: 5rem!important; }
.carousel .splide__arrow--next { right: 1.5em!important; }
.carousel .splide__arrow--prev { right: 1.5em!important; }


}




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

.carousel .splide__track li { padding-left: 3rem!important; padding-right: 3rem!important; }

.offer-more .txt { padding-bottom: 0; }

}





@media screen and (min-width: 1000px) { 
	
	.carousel { float: right; max-width: 79%!important; width: 100%; overflow: hidden; }
	
}



@media screen and (min-width: 1201px) { .offer-more .content:nth-child(1) { margin-bottom: 80px; }}



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

header { padding-top: 0; padding-bottom: 10px; background: rgba(12,42,52,.9); } 
header.fixed, .pp header { padding-top: 0; background: rgba(12,42,52,.9); } 
header .content .topnav .col-3:nth-child(3) { display: none; }
nav ul .mobile_btn a:hover { color: #fff; }
nav ul li { font-size: 1.5em; }
nav ul li a { font-weight: 600; line-height: 1.3; }

.mobile_btn a { padding: 14px 35px; }

header .content .topnav .col-3:nth-child(1) { margin-right: 20px; }
header .content .topnav .col-3:nth-child(2) { width: 100%; }
.lang-img { position: absolute; right: 70px; margin-top: 21px; }

.banner .content { padding-top: 210px; }

.about { background: none; }

.offer-more { margin-top: -80px; padding-top: 120px; }

.logo a { position: relative; z-index: 111; }

.contact .grid .col-2:nth-child(1) { margin-bottom: 60px; }



.menu-icon {
  display: inline-block;
  cursor: pointer;
}

.bar1, .bar2, .bar3 {
  width: 35px;
  height: 5px;
  background-color: #06fb85;
  margin: 0 0 6px;
  transition: 0.4s;
  border-radius: 5px;
}


/* Gdy kliknięte – zmiana w "X" */
.change .bar1 {
  transform: rotate(-45deg) translate(-7px, 7px);
}

.change .bar2 {
  opacity: 0;
}

.change .bar3 {
  transform: rotate(45deg) translate(-8px, -9px);
}


#myLinks {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height .55s ease-in-out, opacity .75s ease-in-out;
}

/* po kliknięciu menu */
#myLinks.show {
  max-height: 1000px; /* większe niż wysokość menu */
  opacity: 1;
}

nav, nav ul { float: none; }
.mobile_btn { margin: 0 30px; padding-bottom: 20px; text-align: center; }



.topnav {
  overflow: hidden;
  position: relative;
}

.topnav a { display: block; }

/* Style the hamburger menu */
.topnav a.icon {
  background: transparent;
  display: block;
  position: absolute;
  right: 0;
  top: 27px;
  height: 27px;
}

.topnav a:hover { color: #06fb85; }
.topnav .mobile_btn a:hover { color: #fff; }
	
}





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

h1, h1, h2, h3, h4, h5, h6 { line-height: 1.25em; }

p, input { font-size: 1.5em; }
li { font-size: 1.5em; }

.content { padding-left: 6%; padding-right: 6%; }
#four .content { overflow: visible; }

.banner { background: #0c2a34 url(images/tworzenie-stron-i-sklepow-internetowych-banner-mobile.webp) bottom center no-repeat fixed; background-size: 100% auto; }
.banner .content { padding-top: 150px; height: 900px; }
.banner h1, .banner h2 { font-size: 3.7em; }
.banner .advantages { display: flex; margin-top: 110px; position: sticky; top: 125px; height: fit-content; }
.banner .advantages .col-3 p { font-size: 1.4em; }

.carousel .splide__track li { padding-left: 2rem!important; padding-right: 2rem!important; }
span.button { margin-top: 20px; }

#one { margin-top: -60px; padding-top: 120px; background: url(images/back-2.webp) top 3rem right no-repeat; }
.about .content { padding-top: 0; }
.about img { margin: 0 auto 40px; display: block; }

#two .sc { margin-top: 3rem; }

.sc { height: 150px; }
.sci p { font-size: 7em; }

#main { background: url(images/offer-mobile.webp) top center no-repeat; }

#main h2, .offer-more h4, .pp h1, .pp h2 { font-size: 3.3em; }
#main .carousel .splide__slide h3 { font-size: 1.8em; }
.carousel .splide_bottom { font-size: 1.1em; }
#main .about h2 { margin-bottom: 85px; }
.carousel .splide_top { position: relative; top: -30px; }
.carousel .splide li.is-active:hover .splide_top img { animation: animacja2 .5s ease-out 1 normal none; }

.banner .advantages .col-3 p:nth-child(2) { font-size: 1.8em; }

.banner .response { display: inline-block; margin-top: 70px; margin-bottom: 20px; }


.about .row.sec { margin-bottom: 30px; }

.carousel .splide__track li { padding-bottom: 2rem!important; }

.banner .advantages .col-3 i { padding: 17px 10px; width: 60px; font-size: 2.5em; }

.icon-block, .txt-block { width: 100%; }
.icon-block { margin-bottom: 40px; }
.icon-block i { padding: 20px 10px; width: 90px; font-size: 5em; }

.offer-more .content:nth-child(1) { margin-top: 10px; }
.offer-more { position: relative; z-index: 1; }
.offer-more::before { content:''; position: absolute; top: 0; right: 0; width: 800px; height: 1280px; background: url(images/offer-more-left.webp) top left no-repeat; z-index: -1; }
.offer-more::after { content:''; position: absolute; bottom: 0; right: 0; width: 800px; height: 1280px; background: url(images/offer-more-right.webp) top left no-repeat; z-index: -1; }
.offer-more .grid { display: flex; flex-direction: column-reverse; }
.offer-more .col-2 { width: 100%; }
.offer-more .grid-top .col-2:nth-child(2), .offer-more .grid .col-2:nth-child(1) { margin-top: 20px; }
.offer-more img { margin-top: 30px; margin-bottom: 25px; }

.other { background: url(images/other-mobile.webp) top center no-repeat fixed; }
.other .content { padding-bottom: 80px; }
.other .blocks { padding-top: 40px; }
.other .block { padding: 0 30px 50px; box-shadow: 0 5px 25px -8px rgba(51,61,75,.5); }
.bl { margin-bottom: 100px; }
.other .block h3, .cooperation h3 { font-size: 2.5em; }


.cooperation-section { padding-bottom: 2rem; }
.cooperation-block::after { top: -110px; font-size: 25rem; }

.cooperation-block .row:nth-child(2) { margin-bottom: 40px; }
.cooperation .col-4 { padding: 30px 30px 40px; }
#main .cooperation .sec h2 { margin-top: 50px; margin-bottom: 90px; }
.cooperation .sec .col-4 { padding: 20px 30px; }
.cooperation p.fs, .about p.fs { margin-bottom: 1.5rem; font-size: 1.8em; }

.faq-section::before { height: 650px; }
#six::after { top: -150px; bottom: auto; right: -80px; background: url(images/footer-left.webp) top 1.5rem left no-repeat; transform: scaleX(-1); }
#six::before, .cooperation-section::before, .cooperation-section::after { display: none; }

#two-cooperation { margin-top: -2rem; }
.offer-more { margin-top: -5rem; }
#three, #four { margin-top: -3rem; padding-top: 100px; }
#six { margin-top: -1.5rem; }

#two-cooperation .bb { margin-top: -40px; }


.contact-information div { display: grid; grid-template-columns: 56px 1fr; gap: 1em; align-items: center; margin-bottom: 1rem; }
.contact-information i { padding: 12px 10px; width: 52px; }
.contact-information i.fa-4x { font-size: 2.75em; }
.contact-information p { font-size: 1.8em; }

.accordion-header { font-size: 1.85em; }
.accordion-header span { font-size: 1.8em; }

.footer { padding-top: 90px; }

.contact { background: #0c2a34 url(images/footer-mobile.webp) bottom center no-repeat fixed; background-size: 100% auto; }

.pp #main { padding-bottom: 40px; }
.pp #main h2 { font-size: 2.5em !important; }

.pp.nns #main h2 { font-size: 1.5em!important; }
	
.cooperation .col-4 { margin-bottom: 30px; }
.afs p { margin-bottom: 3.5%; }

}




@media screen and (min-width: 510px) and (max-width: 800px) {

#main { background-position: center -20em; }

}




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

.carousel .splide__slide .number { float: none; }
.col-3 { width: 100%; }
.offer-more .row .col-3  { width: 40%; }
.banner .col-3 { width: 33.33%; }
.lang-img { right: 55px; }

}


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

header, header.fixed { padding-bottom: 12px; }
header .logo a { max-width: 170px; }
header .logo img { margin-top: 13px; width: 100%; height: auto; }

.lang-img { margin-top: 19px; width: 35px; height: 35px; }
.topnav a.icon { top: 22px; }

.banner .content { padding-top: 120px; height: 900px;  }
.banner .advantages .col-3 { padding: 0 10px 20px; }

#one { margin-top: -40px; padding-top: 100px; }
#two-cooperation { margin-top: -2rem; }
.offer-more { margin-top: -4rem; padding-top: 80px; }
#three, #four { margin-top: -2rem; padding-top: 100px; }
#five { margin-top: 0; padding-top: 6rem; }
#six { padding-top: 120px; }

.cooperation-section { padding-bottom: 1rem; }

.contact .grid .grid { grid-template-columns: 100%; }
.contact .grid .grid .col-2:nth-child(2) { margin-top: 40px; }
.contact .grid .row { margin-bottom: 20px; }

.offer-more .img-block img:nth-child(1), .offer-more .img-block img:nth-child(3) { max-width: 200px; }

}



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

#main { background-position: center -4em; }

}







/* Contact Form */


    * {
        box-sizing: border-box;
    }
	form {
        margin:0 auto;
	}
	form form-row {
        margin-bottom:1rem;
    }
    form form-row:last-child {
        margin-bottom: 0;
    }
    form input[type=text],
    form input[type=email],
	form input[type=tel],
    form textarea,
    form .checkbox-cnt .state {
        box-shadow:inset 0 1px 5px rgba(12,42,52,0.07);
    }
	form input[type=text], 
	form input[type=email],
	form input[type=tel],
    form textarea {
        border-radius:0.2rem;
        font-family:sans-serif;
		padding:1rem;
		border:1px solid #dfe4eb;
        display: block;
        width:100%;
        color:#fff;
		border-radius: 50px;
		background: transparent;
		font-size: 1.25em;
	}
	form textarea {
		border-radius: 25px;
	}
    form input[type=text]:focus,
    form input[type=email]:focus,
	form input[type=tel]:focus,
    form textarea:focus {
        border-color:#9DC9F5;
        box-shadow:inset 0 0 0 1px #9DC9F5, inset 0 1px 5px rgba(12,42,52,0.07);
        outline:none;
    }
    form textarea {
        max-height:6rem;
		max-width: 100%;
    }
	form label {
        font-weight:bold;
		display: block;
		font-size:0.9rem;
		margin-bottom:0.5rem;
	}
    form .submit-btn {
        font-family: sans-serif;
        padding:.7em .4em;
        background: #fff;
        border:0;
        border-radius:50px;
        color:#0c2a34;
        font-size:.9rem;
        font-weight: bold;
        transition: 0.3s background-color;
        cursor: pointer;
		text-transform: uppercase;
		width: 100%;
    }
    form .submit-btn:hover {
		color: #fff; background: #06fb85; box-shadow: 0px 2px 17px -7px #efad89; filter: drop-shadow(0px 2px 4px #193d6c);
    }
    .checkbox-cnt {
        padding-left:2rem;
        position: relative;
        font-weight: normal;
        font-size:0.85rem;
        line-height: 1.1rem;
        color:#fff;
        cursor: pointer;
    }
    .checkbox-cnt .state {
        width:1.2rem;
        height: 1.2rem;
        display: block;
        position: absolute;
        left:0;
        top:0;
        border:1px solid #aeb9c8;
        border-radius:50px;
    }
    .checkbox-cnt .state:before {
        width:1.2rem;
        height: 1.2rem;
        border-radius:50px;
        background: #06fb85;
        display: block;
        position: absolute;
        left:50%;
        top:50%;
        content:'';
        transform:translate(-50%, -50%) scale(1);
        opacity:0;
    }
    .checkbox-cnt input:checked ~ .state:before {
        animation: checkboxShowAnim 0.5s 1;
        opacity: 1;
    }
    .checkbox-cnt input {
        position:absolute;
        top:0; left:0;
        width:2rem;
        height: 2rem;
        z-index: 2;
        cursor:pointer;
        padding:0;
        margin:0;
        opacity: 0;
    }
	.checkbox-cnt span { position: relative; top: -3px; font-size: .8em; color: #fff; line-height: .9em; }
	.checkbox-cnt a { color: #fff; font-weight: bold; }
	.checkbox-cnt a:hover { color: #06fb85; }
    form input[type=text].error,
    form input[type=email].error,
	form input[type=tel].error,
    form textarea.error,
    form .checkbox-cnt input.error ~ .state {
        border-color:#E01546;
    }
    .field-error {
        color:#E01546;
        padding:0.5rem 0;
        font-size:0.8rem;
    }
    @keyframes checkboxShowAnim {
        0%  { border-radius:50%; transform:translate(-50%, -50%) scale(0.2); }
        50% { transform:translate(-50%, -50%) scale(1.2); }
        100% { transform:translate(-50%, -50%) scale(1); }
    }

    .element-is-busy {
        position: relative;
        pointer-events: none;
        opacity:0.5;
    }
    .element-is-busy::after {
        position: absolute;
        left: 50%;
        top: 50%;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        border: 2px solid rgba(0, 0, 0, 0.2);
        border-right-color: rgba(12,42,52,0.7);
        transform: translate(-50%, -50%) rotate(0deg);
        content:'';
        animation: rotateSingleLoading 0.3s infinite linear;
        z-index: 100;
    }
    @keyframes rotateSingleLoading {
        from {
            transform: translate(-50%, -50%) rotate(0deg);
        }
        to {
            transform: translate(-50%, -50%) rotate(360deg);
        }
    }
    form .send-error {
        display:inline-block;
        font-family: sans-serif;
        font-size:0.9rem;
        padding:1rem .5rem;
        color:#E01546;
    }
    form-send-success {
        font-family: sans-serif;
        text-align:center;
        font-size:2rem;
        font-weight:bold;
        border:1px solid #eee;
        color:#333;
        padding:10rem 0;
        margin:3rem auto;
        max-width:40rem;
    }
    form-send-success strong {
        display:block;
        margin-bottom:0.5rem;
    }
    form-send-success span {
        font-size:1rem;
        color:#888;
        font-weight:normal;
        display: block;
    }
    @media screen and (max-width:500px) {
        form .submit-btn {
            display: block;
            width: 100%;
        }
        form .send-error {
            text-align:center;
            display: block;
        }
    }