{"id":23135,"date":"2025-06-30T12:33:16","date_gmt":"2025-06-30T10:33:16","guid":{"rendered":"http:\/\/sionbartoszyce.pl\/?page_id=23135"},"modified":"2025-07-02T17:51:11","modified_gmt":"2025-07-02T15:51:11","slug":"test125","status":"publish","type":"page","link":"http:\/\/sionbartoszyce.pl\/en\/test125\/","title":{"rendered":"test125"},"content":{"rendered":"\n\n\n\n \n \n Stowarzyszenie Integracji Os\u00f3b Niepe\u0142nosprawnych SION w Bartoszycach<\/title>\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n <style>\n :root {\n --primary: #cd7f32; \/* br\u0105z *\/\n --secondary: #ffd700; \/* z\u0142oty\/\u017c\u00f3\u0142ty *\/\n --accent: #cd7f32; \/* br\u0105z *\/\n --light: #fffaf0; \/* delikatny kremowy *\/\n --dark: #2a2118; \/* ciemny br\u0105z *\/\n --text: #333;\n --bg-gradient: linear-gradient(135deg, #ffd700 0%, #cd7f32 100%);\n }\n \n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;\n }\n \n body {\n color: var(--text);\n line-height: 1.7;\n background-color: var(--light);\n overflow-x: hidden;\n }\n \n \/* Floating Navigation *\/\n .floating-nav {\n position: fixed;\n bottom: 2rem;\n left: 50%;\n transform: translateX(-50%);\n background: rgba(255, 255, 255, 0.9);\n border-radius: 50px;\n padding: 0.5rem 1rem;\n box-shadow: 0 10px 30px rgba(0,0,0,0.15);\n z-index: 1000;\n display: flex;\n gap: 0.5rem;\n backdrop-filter: blur(10px);\n border: 1px solid rgba(255, 215, 0, 0.3);\n }\n \n .nav-item {\n width: 40px;\n height: 40px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.3s ease;\n position: relative;\n }\n \n .nav-item i {\n color: var(--dark);\n font-size: 1.1rem;\n }\n \n .nav-item.active {\n background: var(--bg-gradient);\n }\n \n .nav-item.active i {\n color: white;\n }\n \n .nav-item .tooltip {\n position: absolute;\n top: -40px;\n left: 50%;\n transform: translateX(-50%);\n background: var(--dark);\n color: white;\n padding: 0.3rem 0.8rem;\n border-radius: 20px;\n font-size: 0.8rem;\n opacity: 0;\n visibility: hidden;\n transition: all 0.3s;\n white-space: nowrap;\n }\n \n .nav-item:hover .tooltip {\n opacity: 1;\n visibility: visible;\n top: -45px;\n }\n \n \/* Hero Section *\/\n .hero {\n height: 100vh;\n display: flex;\n align-items: center;\n position: relative;\n overflow: hidden;\n }\n \n .hero::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: linear-gradient(rgba(205, 127, 50, 0.8), rgba(255, 215, 0, 0.6));\n z-index: 1;\n }\n \n .hero-video {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n z-index: 0;\n }\n \n .hero-content {\n position: relative;\n z-index: 2;\n color: white;\n padding: 0 2rem;\n max-width: 1200px;\n margin: 0 auto;\n width: 100%;\n text-shadow: 1px 1px 3px rgba(0,0,0,0.3);\n }\n \n .logo {\n position: absolute;\n top: 2rem;\n left: 2rem;\n z-index: 3;\n display: flex;\n align-items: center;\n font-size: 1.5rem;\n font-weight: 700;\n color: white;\n }\n \n .logo i {\n margin-right: 0.5rem;\n font-size: 1.8rem;\n color: var(--secondary);\n }\n \n .hero h1 {\n font-size: clamp(2.5rem, 5vw, 4.5rem);\n font-weight: 800;\n line-height: 1.2;\n margin-bottom: 1.5rem;\n }\n \n .hero p {\n font-size: 1.2rem;\n max-width: 600px;\n margin-bottom: 2rem;\n opacity: 0.9;\n }\n \n .btn {\n display: inline-flex;\n align-items: center;\n padding: 0.8rem 2rem;\n border-radius: 50px;\n font-weight: 600;\n text-decoration: none;\n transition: all 0.3s;\n margin-right: 1rem;\n margin-bottom: 1rem;\n }\n \n .btn-primary {\n background: var(--secondary);\n color: var(--dark);\n box-shadow: 0 5px 15px rgba(0,0,0,0.1);\n }\n \n .btn-primary:hover {\n transform: translateY(-3px);\n box-shadow: 0 8px 20px rgba(0,0,0,0.2);\n background: #ffdf00;\n }\n \n .btn-outline {\n border: 2px solid white;\n color: white;\n }\n \n .btn-outline:hover {\n background: white;\n color: var(--primary);\n }\n \n .btn i {\n margin-left: 0.5rem;\n }\n \n \/* Content Sections *\/\n .section {\n padding: 6rem 2rem;\n position: relative;\n }\n \n .section-title {\n text-align: center;\n margin-bottom: 4rem;\n }\n \n .section-title h2 {\n font-size: clamp(1.8rem, 3vw, 2.5rem);\n font-weight: 800;\n color: var(--dark);\n position: relative;\n display: inline-block;\n }\n \n .section-title h2::after {\n content: '';\n position: absolute;\n bottom: -10px;\n left: 50%;\n transform: translateX(-50%);\n width: 60px;\n height: 4px;\n background: var(--primary);\n border-radius: 2px;\n }\n \n \/* News Section *\/\n .news-container {\n max-width: 1200px;\n margin: 0 auto;\n position: relative;\n }\n \n .news-carousel {\n position: relative;\n overflow: hidden;\n margin: 0 auto;\n }\n \n .news-grid {\n display: flex;\n transition: transform 0.5s ease;\n gap: 2rem;\n padding: 1rem 0;\n }\n \n .news-card {\n background: white;\n border-radius: 15px;\n overflow: hidden;\n box-shadow: 0 5px 15px rgba(0,0,0,0.1);\n transition: all 0.3s ease;\n min-width: calc(33.333% - 1.33rem);\n flex: 0 0 calc(33.333% - 1.33rem);\n }\n \n .news-card:hover {\n transform: translateY(-5px);\n box-shadow: 0 10px 25px rgba(0,0,0,0.15);\n }\n \n .news-img {\n height: 200px;\n background-size: cover;\n background-position: center;\n }\n \n .news-content {\n padding: 1.5rem;\n }\n \n .news-date {\n color: var(--primary);\n font-size: 0.9rem;\n margin-bottom: 0.5rem;\n }\n \n .news-title {\n font-size: 1.2rem;\n margin-bottom: 0.8rem;\n color: var(--dark);\n }\n \n .news-excerpt {\n color: #666;\n margin-bottom: 1rem;\n font-size: 0.95rem;\n }\n \n .news-excerpt p {\n margin-bottom: 0.5rem;\n }\n \n .read-more {\n display: inline-flex;\n align-items: center;\n color: var(--primary);\n font-weight: 600;\n text-decoration: none;\n }\n \n .read-more i {\n margin-left: 0.5rem;\n transition: transform 0.3s;\n }\n \n .read-more:hover i {\n transform: translateX(5px);\n }\n \n .carousel-nav {\n display: flex;\n justify-content: center;\n margin-top: 2rem;\n gap: 1rem;\n }\n \n .carousel-btn {\n width: 40px;\n height: 40px;\n border-radius: 50%;\n background: var(--bg-gradient);\n color: white;\n border: none;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 0.3s;\n }\n \n .carousel-btn:hover {\n transform: scale(1.1);\n }\n \n .carousel-btn:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n \n .all-news-link {\n display: inline-block;\n margin-top: 1rem;\n color: var(--primary);\n font-weight: 600;\n text-decoration: none;\n text-align: center;\n width: 100%;\n }\n \n .all-news-link i {\n margin-left: 0.5rem;\n transition: transform 0.3s;\n }\n \n .all-news-link:hover i {\n transform: translateX(5px);\n }\n \n .loading {\n text-align: center;\n padding: 2rem;\n color: var(--primary);\n width: 100%;\n }\n \n \/* About Section *\/\n .about-section {\n background: white;\n }\n \n .about-container {\n max-width: 1200px;\n margin: 0 auto;\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n gap: 3rem;\n align-items: center;\n }\n \n .about-img {\n border-radius: 15px;\n overflow: hidden;\n box-shadow: 0 20px 40px rgba(205, 127, 50, 0.1);\n }\n \n .about-img img {\n width: 100%;\n height: auto;\n display: block;\n }\n \n .about-content h3 {\n font-size: 1.8rem;\n font-weight: 700;\n margin-bottom: 1.5rem;\n color: var(--dark);\n }\n \n .about-content p {\n margin-bottom: 1.5rem;\n color: #555;\n }\n \n \/* Services *\/\n .services-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 2rem;\n max-width: 1200px;\n margin: 0 auto;\n }\n \n .service-card {\n background: white;\n border-radius: 15px;\n padding: 2rem;\n text-align: center;\n box-shadow: 0 10px 30px rgba(0,0,0,0.05);\n transition: all 0.3s;\n border: 1px solid rgba(205, 127, 50, 0.1);\n }\n \n .service-card:hover {\n transform: translateY(-10px);\n box-shadow: 0 15px 40px rgba(205, 127, 50, 0.1);\n }\n \n .service-icon {\n width: 80px;\n height: 80px;\n background: var(--bg-gradient);\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 0 auto 1.5rem;\n color: white;\n font-size: 1.8rem;\n }\n \n .service-title {\n font-size: 1.3rem;\n font-weight: 700;\n margin-bottom: 1rem;\n color: var(--dark);\n }\n \n .service-desc {\n color: #666;\n font-size: 0.95rem;\n }\n \n \/* Contact Section *\/\n .contact-section {\n background: var(--light);\n }\n \n .contact-container {\n max-width: 1200px;\n margin: 0 auto;\n }\n \n .contact-row {\n display: flex;\n flex-wrap: wrap;\n gap: 2rem;\n justify-content: center;\n }\n \n .contact-item {\n display: flex;\n align-items: center;\n gap: 1.5rem;\n background: white;\n padding: 1.5rem;\n border-radius: 15px;\n box-shadow: 0 5px 15px rgba(0,0,0,0.05);\n min-width: 300px;\n flex-grow: 1;\n }\n \n .contact-icon {\n width: 60px;\n height: 60px;\n background: var(--bg-gradient);\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n color: white;\n font-size: 1.5rem;\n flex-shrink: 0;\n }\n \n .contact-text h4 {\n font-size: 1.2rem;\n margin-bottom: 0.3rem;\n color: var(--dark);\n }\n \n .contact-text p, .contact-text a {\n color: #666;\n text-decoration: none;\n }\n \n .contact-text a:hover {\n color: var(--primary);\n }\n \n .map-container {\n height: 400px;\n border-radius: 15px;\n overflow: hidden;\n box-shadow: 0 10px 30px rgba(0,0,0,0.1);\n margin-top: 3rem;\n }\n \n \/* Footer *\/\n footer {\n background: var(--dark);\n color: white;\n padding: 4rem 2rem 2rem;\n }\n \n .footer-container {\n max-width: 1200px;\n margin: 0 auto;\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 3rem;\n }\n \n .footer-col h3 {\n font-size: 1.3rem;\n font-weight: 700;\n margin-bottom: 1.5rem;\n position: relative;\n padding-bottom: 0.8rem;\n color: var(--secondary);\n }\n \n .footer-col h3::after {\n content: '';\n position: absolute;\n bottom: 0;\n left: 0;\n width: 40px;\n height: 3px;\n background: var(--secondary);\n }\n \n .footer-col p {\n opacity: 0.8;\n margin-bottom: 1.5rem;\n line-height: 1.6;\n }\n \n .footer-links {\n list-style: none;\n }\n \n .footer-links li {\n margin-bottom: 0.8rem;\n }\n \n .footer-links a {\n color: white;\n opacity: 0.8;\n text-decoration: none;\n transition: all 0.3s;\n }\n \n .footer-links a:hover {\n opacity: 1;\n color: var(--secondary);\n padding-left: 5px;\n }\n \n .social-links {\n display: flex;\n gap: 1rem;\n margin-top: 1.5rem;\n justify-content: center;\n }\n \n .social-links a {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 40px;\n height: 40px;\n background: rgba(255, 215, 0, 0.1);\n border-radius: 50%;\n color: var(--secondary);\n transition: all 0.3s;\n }\n \n .social-links a:hover {\n background: var(--secondary);\n color: var(--dark);\n transform: translateY(-3px);\n }\n \n .copyright {\n text-align: center;\n margin-top: 4rem;\n padding-top: 2rem;\n border-top: 1px solid rgba(255, 215, 0, 0.1);\n opacity: 0.7;\n }\n \n \/* Animations *\/\n @keyframes fadeIn {\n from { opacity: 0; transform: translateY(20px); }\n to { opacity: 1; transform: translateY(0); }\n }\n \n .fade-in {\n opacity: 0;\n transform: translateY(20px);\n animation: fadeIn 0.5s ease forwards;\n }\n \n .delay-1 { animation-delay: 0.2s; }\n .delay-2 { animation-delay: 0.4s; }\n .delay-3 { animation-delay: 0.6s; }\n \n \/* Responsive *\/\n @media (max-width: 768px) {\n .floating-nav {\n bottom: 1rem;\n padding: 0.5rem;\n }\n \n .nav-item {\n width: 36px;\n height: 36px;\n }\n \n .hero {\n height: auto;\n padding: 8rem 1rem;\n text-align: center;\n }\n \n .hero-content {\n display: flex;\n flex-direction: column;\n align-items: center;\n }\n \n .hero p {\n margin-left: auto;\n margin-right: auto;\n }\n \n .btn-group {\n display: flex;\n flex-direction: column;\n align-items: center;\n }\n \n .btn {\n margin-right: 0;\n width: 100%;\n text-align: center;\n justify-content: center;\n }\n \n .about-container, .contact-container {\n grid-template-columns: 1fr;\n text-align: center;\n }\n \n .contact-item {\n flex-direction: column;\n text-align: center;\n }\n \n .news-card {\n min-width: calc(100% - 1rem);\n flex: 0 0 calc(100% - 1rem);\n }\n }\n <\/style>\n<\/head>\n<body>\n <!-- Floating Navigation -->\n <div class=\"floating-nav\">\n <div class=\"nav-item active\" data-section=\"home\">\n <i class=\"fas fa-home\"><\/i>\n <span class=\"tooltip\">Strona G\u0142\u00f3wna<\/span>\n <\/div>\n <div class=\"nav-item\" data-section=\"news\">\n <i class=\"fas fa-newspaper\"><\/i>\n <span class=\"tooltip\">Aktualno\u015bci<\/span>\n <\/div>\n <div class=\"nav-item\" data-section=\"about\">\n <i class=\"fas fa-info-circle\"><\/i>\n <span class=\"tooltip\">O Nas<\/span>\n <\/div>\n <div class=\"nav-item\" data-section=\"wtz\">\n <i class=\"fas fa-hands-helping\"><\/i>\n <span class=\"tooltip\">WTZ<\/span>\n <\/div>\n <div class=\"nav-item\" data-section=\"contact\">\n <i class=\"fas fa-envelope\"><\/i>\n <span class=\"tooltip\">Kontakt<\/span>\n <\/div>\n <\/div>\n\n <!-- Hero Section -->\n <section class=\"hero\" id=\"home\">\n <video autoplay muted loop class=\"hero-video\">\n <source src=\"https:\/\/assets.mixkit.co\/videos\/preview\/mixkit-group-of-people-socializing-4433-large.mp4\" type=\"video\/mp4\">\n <\/video>\n <div class=\"logo\">\n <i class=\"fas fa-hands-helping\"><\/i>\n <span>SION Bartoszyce<\/span>\n <\/div>\n <div class=\"hero-content fade-in\">\n <h1>Stowarzyszenie Integracji Os\u00f3b Niepe\u0142nosprawnych<\/h1>\n <p>Od ponad 20 lat dzia\u0142amy na rzecz integracji i terapii os\u00f3b z niepe\u0142nosprawno\u015bciami w Bartoszycach i okolicach.<\/p>\n <div class=\"btn-group\">\n <a href=\"#about\" class=\"btn btn-primary\">Poznaj nas bli\u017cej <i class=\"fas fa-arrow-right\"><\/i><\/a>\n <a href=\"#contact\" class=\"btn btn-outline\">Skontaktuj si\u0119 z nami<\/a>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- News Section -->\n <section class=\"section\" id=\"news\">\n <div class=\"section-title fade-in\">\n <h2>Aktualno\u015bci<\/h2>\n <\/div>\n <div class=\"news-container\">\n <div class=\"news-carousel\">\n <div class=\"news-grid\" id=\"news-grid\">\n <div class=\"loading\">\n <i class=\"fas fa-spinner fa-spin\"><\/i> \u0141adowanie aktualno\u015bci…\n <\/div>\n <\/div>\n <\/div>\n <div class=\"carousel-nav\">\n <button class=\"carousel-btn\" id=\"prev-btn\" disabled>\n <i class=\"fas fa-chevron-left\"><\/i>\n <\/button>\n <button class=\"carousel-btn\" id=\"next-btn\">\n <i class=\"fas fa-chevron-right\"><\/i>\n <\/button>\n <\/div>\n <a href=\"http:\/\/sionbartoszyce.pl\/aktualnosci\" class=\"all-news-link\">Zobacz wszystkie aktualno\u015bci <i class=\"fas fa-arrow-right\"><\/i><\/a>\n <\/div>\n <\/section>\n\n <!-- About Section -->\n <section class=\"section about-section\" id=\"about\">\n <div class=\"section-title fade-in\">\n <h2>O Nas<\/h2>\n <\/div>\n <div class=\"about-container\">\n <div class=\"about-img fade-in\">\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1529333166437-7750a6dd5a70?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1469&q=80\" alt=\"O nas\">\n <\/div>\n <div class=\"about-content fade-in delay-1\">\n <h3>Stowarzyszenie SION w Bartoszycach<\/h3>\n <p>Jeste\u015bmy organizacj\u0105 pozarz\u0105dow\u0105 dzia\u0142aj\u0105c\u0105 od 2001 roku na rzecz os\u00f3b z niepe\u0142nosprawno\u015bciami i ich rodzin w regionie bartoszyckim. Nasza misja to tworzenie warunk\u00f3w do pe\u0142nego uczestnictwa w \u017cyciu spo\u0142ecznym.<\/p>\n <p>Prowadzimy Warsztat Terapii Zaj\u0119ciowej, wypo\u017cyczalni\u0119 sprz\u0119tu rehabilitacyjnego oraz organizujemy liczne projekty integracyjne i szkoleniowe dla naszych podopiecznych.<\/p>\n <a href=\"http:\/\/sionbartoszyce.pl\/o-nas\" class=\"btn btn-primary\" style=\"margin-top: 1rem;\">Wi\u0119cej o nas <i class=\"fas fa-arrow-right\"><\/i><\/a>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- WTZ Section -->\n <section class=\"section\" id=\"wtz\">\n <div class=\"section-title fade-in\">\n <h2>Warsztat Terapii Zaj\u0119ciowej<\/h2>\n <\/div>\n <div class=\"services-grid\">\n <div class=\"service-card fade-in\">\n <div class=\"service-icon\">\n <i class=\"fas fa-paint-brush\"><\/i>\n <\/div>\n <h3 class=\"service-title\">Zaj\u0119cia artystyczne<\/h3>\n <p class=\"service-desc\">Terapia przez sztuk\u0119, rozwijanie kreatywno\u015bci i umiej\u0119tno\u015bci manualnych.<\/p>\n <\/div>\n \n <div class=\"service-card fade-in delay-1\">\n <div class=\"service-icon\">\n <i class=\"fas fa-dumbbell\"><\/i>\n <\/div>\n <h3 class=\"service-title\">Rehabilitacja ruchowa<\/h3>\n <p class=\"service-desc\">Zaj\u0119cia dostosowane do indywidualnych potrzeb i mo\u017cliwo\u015bci podopiecznych.<\/p>\n <\/div>\n \n <div class=\"service-card fade-in delay-2\">\n <div class=\"service-icon\">\n <i class=\"fas fa-laptop\"><\/i>\n <\/div>\n <h3 class=\"service-title\">Terapia komputerowa<\/h3>\n <p class=\"service-desc\">Nauka obs\u0142ugi komputera i rozw\u00f3j umiej\u0119tno\u015bci cyfrowych.<\/p>\n <\/div>\n \n <div class=\"service-card fade-in delay-3\">\n <div class=\"service-icon\">\n <i class=\"fas fa-users\"><\/i>\n <\/div>\n <h3 class=\"service-title\">Trening spo\u0142eczny<\/h3>\n <p class=\"service-desc\">Rozwijanie kompetencji spo\u0142ecznych i komunikacyjnych.<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Contact Section -->\n <section class=\"section contact-section\" id=\"contact\">\n <div class=\"section-title fade-in\">\n <h2>Kontakt<\/h2>\n[sion_kontaktowy_blok]\n <\/div>\n <div class=\"contact-container\">\n <div class=\"contact-row fade-in\">\n <div class=\"contact-item\">\n <div class=\"contact-icon\">\n <i class=\"fas fa-map-marker-alt\"><\/i>\n <\/div>\n <div class=\"contact-text\">\n <h4>Adres<\/h4>\n <p>ul. Bohater\u00f3w Warszawy 15<br>11-200 Bartoszyce<\/p>\n <\/div>\n <\/div>\n \n <div class=\"contact-item\">\n <div class=\"contact-icon\">\n <i class=\"fas fa-phone-alt\"><\/i>\n <\/div>\n <div class=\"contact-text\">\n <h4>Telefon<\/h4>\n <p><a href=\"tel:+48897456567\">+48 89 745 65 67<\/a><\/p>\n <\/div>\n <\/div>\n \n <div class=\"contact-item\">\n <div class=\"contact-icon\">\n <i class=\"fas fa-envelope\"><\/i>\n <\/div>\n <div class=\"contact-text\">\n <h4>Email<\/h4>\n <p><a href=\"mailto:sion@bartoszyce.pl\">sion@bartoszyce.pl<\/a><\/p>\n <\/div>\n <\/div>\n \n <div class=\"contact-item\">\n <div class=\"contact-icon\">\n <i class=\"fas fa-clock\"><\/i>\n <\/div>\n <div class=\"contact-text\">\n <h4>Godziny otwarcia<\/h4>\n <p>Pon-Pt: 7:30-15:30<\/p>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"map-container\">\n <iframe src=\"https:\/\/www.google.com\/maps\/embed?pb=!1m18!1m12!1m3!1d2339.071782814031!2d20.80860331585679!3d54.25022398015942!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x46e1c3a6f5d0f2e5%3A0x4a3b8a8e9a8e9a8e!2sStowarzyszenie%20Integracji%20Os%C3%B3b%20Niepe%C5%82nosprawnych%20SION!5e0!3m2!1spl!2spl!4v1623760000000!5m2!1spl!2spl\" width=\"100%\" height=\"100%\" style=\"border:0;\" allowfullscreen=\"\" loading=\"lazy\"><\/iframe>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Footer -->\n <footer>\n <div class=\"footer-container\">\n <div class=\"footer-col\">\n <h3>O Stowarzyszeniu<\/h3>\n <p>Dzia\u0142amy na rzecz os\u00f3b z niepe\u0142nosprawno\u015bciami od 2001 roku, oferuj\u0105c kompleksowe wsparcie i terapi\u0119 w Bartoszycach.<\/p>\n <div class=\"social-links\">\n <a href=\"#\"><i class=\"fab fa-facebook-f\"><\/i><\/a>\n <a href=\"#\"><i class=\"fab fa-instagram\"><\/i><\/a>\n <\/div>\n <\/div>\n \n <div class=\"footer-col\">\n <h3>Wa\u017cne linki<\/h3>\n <ul class=\"footer-links\">\n <li><a href=\"http:\/\/sionbartoszyce.pl\/statut\">Statut Stowarzyszenia<\/a><\/li>\n <li><a href=\"http:\/\/sionbartoszyce.pl\/1-5-podatku\">1,5% Podatku<\/a><\/li>\n <li><a href=\"http:\/\/sionbartoszyce.pl\/zapytania-ofertowe\">Zapytania ofertowe<\/a><\/li>\n <li><a href=\"http:\/\/sionbartoszyce.pl\/sprawozdania\">Sprawozdania finansowe<\/a><\/li>\n <\/ul>\n <\/div>\n \n <div class=\"footer-col\">\n <h3>Dokumenty<\/h3>\n <ul class=\"footer-links\">\n <li><a href=\"http:\/\/sionbartoszyce.pl\/standardy-ochrony\">Standardy ochrony ma\u0142oletnich<\/a><\/li>\n <li><a href=\"http:\/\/sionbartoszyce.pl\/wladze\">W\u0142adze Stowarzyszenia<\/a><\/li>\n <li><a href=\"http:\/\/sionbartoszyce.pl\/projekty\">Projekty<\/a><\/li>\n <li><a href=\"http:\/\/sionbartoszyce.pl\/zajecia-klubowe\">Zaj\u0119cia klubowe<\/a><\/li>\n <\/ul>\n <\/div>\n <\/div>\n \n <div class=\"copyright\">\n <p>© 2023 Stowarzyszenie Integracji Os\u00f3b Niepe\u0142nosprawnych SION w Bartoszycach. Wszelkie prawa zastrze\u017cone.<\/p>\n <\/div>\n <\/footer>\n\n <script>\n \/\/ Konfiguracja WordPress REST API\n const WORDPRESS_URL = 'http:\/\/sionbartoszyce.pl';\n const POSTS_PER_PAGE = 15; \/\/ Pobieramy od razu 15 post\u00f3w\n let currentPage = 1;\n let totalPosts = 0;\n let isLoading = false;\n let currentPosition = 0;\n let postsPerSlide = 3; \/\/ Domy\u015blnie pokazujemy 3 posty na raz\n let allPosts = [];\n\n \/\/ Funkcja do pobierania losowego obrazu z galerii posta\n async function getRandomPostImage(postId) {\n try {\n \/\/ Najpierw sprawd\u017a czy post ma galeri\u0119 w tre\u015bci\n const postResponse = await fetch(`${WORDPRESS_URL}\/wp-json\/wp\/v2\/posts\/${postId}`);\n if (!postResponse.ok) return null;\n \n const post = await postResponse.json();\n \n \/\/ Proste parsowanie galerii z tre\u015bci posta\n const imgRegex = \/<img[^>]+src=\"([^\">]+)\"\/g;\n const images = [];\n let match;\n \n while ((match = imgRegex.exec(post.content.rendered)) !== null) {\n images.push(match[1]);\n }\n \n \/\/ Je\u015bli znaleziono obrazy w tre\u015bci, wybierz losowy\n if (images.length > 0) {\n const randomIndex = Math.floor(Math.random() * images.length);\n return images[randomIndex];\n }\n \n \/\/ Je\u015bli nie ma obraz\u00f3w w tre\u015bci, spr\u00f3buj pobra\u0107 za\u0142\u0105czone media\n const mediaResponse = await fetch(`${WORDPRESS_URL}\/wp-json\/wp\/v2\/media?parent=${postId}`);\n if (!mediaResponse.ok) return null;\n \n const media = await mediaResponse.json();\n if (media.length > 0) {\n const randomIndex = Math.floor(Math.random() * media.length);\n return media[randomIndex].source_url;\n }\n \n return null;\n } catch (error) {\n console.error('B\u0142\u0105d podczas pobierania obraz\u00f3w:', error);\n return null;\n }\n }\n\n \/\/ Funkcja do pobierania post\u00f3w z WordPressa\n async function fetchPosts(page = 1) {\n isLoading = true;\n \n try {\n const response = await fetch(`${WORDPRESS_URL}\/wp-json\/wp\/v2\/posts?_embed&per_page=${POSTS_PER_PAGE}&page=${page}`);\n \n totalPosts = parseInt(response.headers.get('X-WP-Total'));\n if (!response.ok) throw new Error('B\u0142\u0105d podczas pobierania danych');\n \n return await response.json();\n } catch (error) {\n console.error('B\u0142\u0105d podczas pobierania post\u00f3w:', error);\n return [];\n } finally {\n isLoading = false;\n }\n }\n\n \/\/ Funkcja do wy\u015bwietlania post\u00f3w w karuzeli\n async function displayPosts(posts) {\n const newsGrid = document.getElementById('news-grid');\n \n if (currentPage === 1) {\n newsGrid.innerHTML = '';\n allPosts = [];\n }\n \n if (posts.length === 0 && currentPage === 1) {\n newsGrid.innerHTML = '<p class=\"no-posts\">Brak aktualno\u015bci do wy\u015bwietlenia.<\/p>';\n return;\n }\n \n \/\/ Dodaj nowe posty do wszystkich post\u00f3w\n allPosts = [...allPosts, ...posts];\n \n \/\/ Wy\u015bwietl posty w karuzeli\n updateCarousel();\n \n \/\/ Sprawd\u017a czy mo\u017cna za\u0142adowa\u0107 wi\u0119cej post\u00f3w\n if ((currentPage * POSTS_PER_PAGE) < totalPosts) {\n currentPage++;\n const morePosts = await fetchPosts(currentPage);\n allPosts = [...allPosts, ...morePosts];\n updateCarousel();\n }\n \n \/\/ Aktualizuj przyciski nawigacyjne\n updateNavButtons();\n }\n\n \/\/ Funkcja aktualizuj\u0105ca karuzel\u0119\n function updateCarousel() {\n const newsGrid = document.getElementById('news-grid');\n newsGrid.innerHTML = '';\n \n \/\/ Sprawd\u017a ile post\u00f3w pokazywa\u0107 na raz w zale\u017cno\u015bci od szeroko\u015bci ekranu\n const screenWidth = window.innerWidth;\n postsPerSlide = screenWidth < 768 ? 1 : 3;\n \n \/\/ Wy\u015bwietl posty w karuzeli\n allPosts.forEach((post, index) => {\n const postCard = document.createElement('div');\n postCard.className = 'news-card fade-in';\n postCard.style.minWidth = `calc(${100 \/ postsPerSlide}% - ${2 - (2\/postsPerSlide)}rem)`;\n postCard.style.flex = `0 0 calc(${100 \/ postsPerSlide}% - ${2 - (2\/postsPerSlide)}rem)`;\n \n \/\/ U\u017cyj tymczasowego obrazka, a nast\u0119pnie zast\u0105p go prawdziwym\n postCard.innerHTML = `\n <div class=\"news-img\" style=\"background-image: url('https:\/\/via.placeholder.com\/600x400?text=\u0141adowanie...');\"><\/div>\n <div class=\"news-content\">\n <div class=\"news-date\">\u0141adowanie...<\/div>\n <h3 class=\"news-title\">${post.title.rendered}<\/h3>\n <div class=\"news-excerpt\">\u0141adowanie tre\u015bci...<\/div>\n <a href=\"${post.link}\" class=\"read-more\">Czytaj wi\u0119cej <i class=\"fas fa-arrow-right\"><\/i><\/a>\n <\/div>\n `;\n \n newsGrid.appendChild(postCard);\n \n \/\/ Pobierz szczeg\u00f3\u0142y posta i obrazki\n loadPostDetails(post, postCard);\n });\n \n \/\/ Ustaw pozycj\u0119 karuzeli\n moveCarousel();\n \n animateOnScroll();\n }\n\n \/\/ Funkcja do \u0142adowania szczeg\u00f3\u0142\u00f3w posta\n async function loadPostDetails(post, postCard) {\n const postDate = new Date(post.date);\n const formattedDate = postDate.toLocaleDateString('pl-PL', {\n day: 'numeric',\n month: 'long',\n year: 'numeric'\n });\n \n let imageUrl = 'https:\/\/via.placeholder.com\/600x400?text=Brak+obrazka';\n \n \/\/ Najpierw sprawd\u017a obrazek wyr\u00f3\u017cniaj\u0105cy\n if (post._embedded && post._embedded['wp:featuredmedia'] && post._embedded['wp:featuredmedia'][0]) {\n imageUrl = post._embedded['wp:featuredmedia'][0].source_url;\n } else {\n \/\/ Je\u015bli nie ma, spr\u00f3buj pobra\u0107 losowy obraz z galerii posta\n const randomImage = await getRandomPostImage(post.id);\n if (randomImage) {\n imageUrl = randomImage;\n }\n }\n \n \/\/ Zaktualizuj kart\u0119 posta\n const newsImg = postCard.querySelector('.news-img');\n const newsDate = postCard.querySelector('.news-date');\n const newsExcerpt = postCard.querySelector('.news-excerpt');\n \n newsImg.style.backgroundImage = `url('${imageUrl}')`;\n newsDate.textContent = formattedDate;\n newsExcerpt.innerHTML = post.excerpt.rendered;\n }\n\n \/\/ Funkcja do przesuwania karuzeli\n function moveCarousel() {\n const newsGrid = document.getElementById('news-grid');\n const itemWidth = newsGrid.children[0]?.offsetWidth || 0;\n const gap = 32; \/\/ 2rem w pikselach\n const offset = currentPosition * (itemWidth + gap);\n \n newsGrid.style.transform = `translateX(-${offset}px)`;\n updateNavButtons();\n }\n\n \/\/ Funkcja aktualizuj\u0105ca przyciski nawigacyjne\n function updateNavButtons() {\n const prevBtn = document.getElementById('prev-btn');\n const nextBtn = document.getElementById('next-btn');\n \n prevBtn.disabled = currentPosition === 0;\n \n const maxPosition = Math.ceil(allPosts.length \/ postsPerSlide) - 1;\n nextBtn.disabled = currentPosition >= maxPosition;\n }\n\n \/\/ Obs\u0142uga przycisk\u00f3w nawigacyjnych\n document.getElementById('prev-btn').addEventListener('click', () => {\n if (currentPosition > 0) {\n currentPosition--;\n moveCarousel();\n }\n });\n\n document.getElementById('next-btn').addEventListener('click', () => {\n const maxPosition = Math.ceil(allPosts.length \/ postsPerSlide) - 1;\n if (currentPosition < maxPosition) {\n currentPosition++;\n moveCarousel();\n }\n });\n\n \/\/ Obs\u0142uga zmiany rozmiaru okna\n window.addEventListener('resize', () => {\n \/\/ Zapami\u0119taj kt\u00f3ry post jest teraz pierwszy\n const firstVisibleIndex = currentPosition * postsPerSlide;\n \n \/\/ Zaktualizuj liczb\u0119 post\u00f3w na slajd\n const screenWidth = window.innerWidth;\n const newPostsPerSlide = screenWidth < 768 ? 1 : 3;\n \n if (newPostsPerSlide !== postsPerSlide) {\n postsPerSlide = newPostsPerSlide;\n \/\/ Przelicz now\u0105 pozycj\u0119\n currentPosition = Math.floor(firstVisibleIndex \/ postsPerSlide);\n updateCarousel();\n }\n });\n\n \/\/ Za\u0142aduj pierwsze posty przy \u0142adowaniu strony\n window.addEventListener('DOMContentLoaded', async () => {\n const posts = await fetchPosts(currentPage);\n displayPosts(posts);\n });\n\n \/\/ Funkcja do animacji przy przewijaniu\n function animateOnScroll() {\n const elements = document.querySelectorAll('.fade-in');\n const windowHeight = window.innerHeight;\n \n elements.forEach(element => {\n const elementPosition = element.getBoundingClientRect().top;\n \n if (elementPosition < windowHeight - 100) {\n element.style.opacity = '1';\n element.style.transform = 'translateY(0)';\n }\n });\n }\n\n window.addEventListener('scroll', animateOnScroll);\n window.addEventListener('load', animateOnScroll);\n\n \/\/ Floating navigation\n const navItems = document.querySelectorAll('.nav-item');\n const sections = document.querySelectorAll('section');\n \n \/\/ Set active nav item based on scroll position\n window.addEventListener('scroll', () => {\n let current = '';\n \n sections.forEach(section => {\n const sectionTop = section.offsetTop;\n const sectionHeight = section.clientHeight;\n \n if (pageYOffset >= (sectionTop - 300)) {\n current = section.getAttribute('id');\n }\n });\n \n navItems.forEach(item => {\n item.classList.remove('active');\n if (item.dataset.section === current) {\n item.classList.add('active');\n }\n });\n });\n \n \/\/ Smooth scroll for nav items\n navItems.forEach(item => {\n item.addEventListener('click', (e) => {\n e.preventDefault();\n const targetId = item.dataset.section;\n const targetSection = document.getElementById(targetId);\n \n window.scrollTo({\n top: targetSection.offsetTop,\n behavior: 'smooth'\n });\n \n \/\/ Update active nav item\n navItems.forEach(navItem => navItem.classList.remove('active'));\n item.classList.add('active');\n });\n });\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Stowarzyszenie Integracji Os\u00f3b Niepe\u0142nosprawnych SION w Bartoszycach Strona G\u0142\u00f3wna Aktualno\u015bci O Nas WTZ Kontakt SION Bartoszyce Stowarzyszenie Integracji Os\u00f3b Niepe\u0142nosprawnych Od ponad 20 lat dzia\u0142amy na rzecz integracji i terapii os\u00f3b z niepe\u0142nosprawno\u015bciami w Bartoszycach i okolicach. Poznaj nas bli\u017cej Skontaktuj si\u0119 z nami Aktualno\u015bci \u0141adowanie aktualno\u015bci… Zobacz wszystkie aktualno\u015bci O Nas Stowarzyszenie SION w […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ngg_post_thumbnail":0,"footnotes":""},"class_list":["post-23135","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/pages\/23135","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/comments?post=23135"}],"version-history":[{"count":11,"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/pages\/23135\/revisions"}],"predecessor-version":[{"id":23980,"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/pages\/23135\/revisions\/23980"}],"wp:attachment":[{"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/media?parent=23135"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}