{"id":1980,"date":"2025-08-15T13:03:11","date_gmt":"2025-08-15T11:03:11","guid":{"rendered":"https:\/\/gsl.rs\/?page_id=1980"},"modified":"2025-08-15T14:24:56","modified_gmt":"2025-08-15T12:24:56","slug":"%e5%90%88%e4%bd%9c%e4%bc%99%e4%bc%b4","status":"publish","type":"page","link":"https:\/\/www.gsl.rs\/zh\/%e5%90%88%e4%bd%9c%e4%bc%99%e4%bc%b4\/","title":{"rendered":"\u5408\u4f5c\u4f19\u4f34"},"content":{"rendered":"
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n GSL DOO \u2013 \u5408\u4f5c\u4f19\u4f34<\/title>\r\n <style>\r\n \/* Globalne promenljive za konzistentnost sa prethodnim dizajnom *\/\r\n :root {\r\n --brand: #2e7cff;\r\n --brand-2: #1a92d1;\r\n --bg: #f7f9fc;\r\n --bg-soft: #ffffff;\r\n --text: #1b2a3a;\r\n --muted: #5c6f82;\r\n --ok: #2fbf71;\r\n --warn: #ffae42;\r\n --danger: #ff6b6b;\r\n --radius: 18px;\r\n --shadow: 0 10px 30px rgba(15, 39, 74, .10);\r\n --shadow-soft: 0 8px 24px rgba(15, 39, 74, .08);\r\n --border: 1px solid rgba(15, 39, 74, .10);\r\n --maxw: 1180px;\r\n }\r\n\r\n \/* Osnovni reset i tipografija *\/\r\n * { box-sizing: border-box }\r\n html, body {\r\n margin: 0;\r\n color: var(--text);\r\n font: 16px\/1.6 \"Inter\", \"Segoe UI\", Roboto, system-ui, -apple-system, sans-serif;\r\n background: var(--bg);\r\n overflow-x: hidden;\r\n }\r\n img { max-width: 100%; display: block }\r\n a { color: inherit; text-decoration: none }\r\n\r\n \/* Kontejner i sekcija *\/\r\n .container { max-width: var(--maxw); margin: 0 auto; padding: clamp(16px, 2.5vw, 28px) }\r\n .section { padding: clamp(32px, 5vw, 72px) 0 }\r\n .eyebrow { letter-spacing: .12em; text-transform: uppercase; font-weight: 700; font-size: clamp(1.5rem, 3vw, 2rem); color: #ffffff; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) }\r\n .title { font-size: clamp(28px, 4vw, 46px); line-height: 1.2; margin: 8px 0 18px }\r\n .lead { font-size: clamp(16px, 1.65vw, 20px); color: var(--muted); max-width: 800px; margin: 0 auto }\r\n .subtitle { font-size: clamp(20px, 2.5vw, 24px); margin: 24px 0 16px; font-weight: 600; color: var(--text) }\r\n\r\n \/* Particles animacija *\/\r\n #particles-js {\r\n position: absolute;\r\n top: 0;\r\n left: 50%; \/* Centriranje za celu \u0161irinu *\/\r\n transform: translateX(-50%); \/* Pomeranje ulevo za punu \u0161irinu *\/\r\n width: 100vw; \/* Cela \u0161irina stranice *\/\r\n height: 300px; \/* Pove\u0107ana visina *\/\r\n background: #0e70a1;\r\n z-index: 1; \/* Iznad pozadine, ispod sadr\u017eaja *\/\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n\r\n \/* Tekst unutar particles animacije *\/\r\n #particles-js .eyebrow {\r\n position: absolute;\r\n top: 70%;\r\n transform: translateY(-50%);\r\n }\r\n\r\n \/* Spacer sa prostorom za header *\/\r\n .particles-spacer {\r\n height: 320px; \/* Ista visina kao #particles-js *\/\r\n margin-top: 60px; \/* Pretpostavljena visina header-a, prilago\u0111ena za spu\u0161tanje *\/\r\n }\r\n\r\n \/* Partneri sekcija *\/\r\n #partneri {\r\n text-align: center;\r\n background: var(--bg-soft);\r\n position: relative;\r\n z-index: 2; \/* Iznad particles animacije *\/\r\n }\r\n #partneri .partners-grid {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));\r\n gap: clamp(16px, 2vw, 24px);\r\n max-width: 1000px;\r\n margin: 32px auto 0;\r\n padding: 0 clamp(16px, 2vw, 24px);\r\n }\r\n #partneri .partner {\r\n background: var(--bg-soft);\r\n border: var(--border);\r\n border-radius: var(--radius);\r\n padding: 20px;\r\n box-shadow: var(--shadow-soft);\r\n transition: transform 0.3s ease, box-shadow 0.3s ease;\r\n opacity: 0;\r\n transform: translateY(20px);\r\n animation: fadeInUp 0.6s ease forwards;\r\n }\r\n #partneri .partner img {\r\n max-width: 100%;\r\n height: auto;\r\n filter: grayscale(100%);\r\n transition: filter 0.3s ease, transform 0.3s ease;\r\n }\r\n #partneri .partner:hover {\r\n transform: translateY(-4px);\r\n box-shadow: var(--shadow);\r\n }\r\n #partneri .partner:hover img {\r\n filter: grayscale(0%);\r\n transform: scale(1.05);\r\n }\r\n \/* Nova klasa za zadr\u017eavanje boje i fade out *\/\r\n #partneri .partner.hovered img {\r\n filter: grayscale(0%);\r\n animation: fadeOutGrayscale 0.2s ease forwards 0.5s; \/* Fade out nakon 1s *\/\r\n }\r\n\r\n \/* Fade out animacija za grayscale *\/\r\n @keyframes fadeOutGrayscale {\r\n to {\r\n filter: grayscale(100%);\r\n }\r\n }\r\n\r\n \/* Staggered animacija za ulazak *\/\r\n #partneri .partner:nth-child(1) { animation-delay: 0.1s; }\r\n #partneri .partner:nth-child(2) { animation-delay: 0.2s; }\r\n #partneri .partner:nth-child(3) { animation-delay: 0.3s; }\r\n #partneri .partner:nth-child(4) { animation-delay: 0.4s; }\r\n #partneri .partner:nth-child(5) { animation-delay: 0.5s; }\r\n #partneri .partner:nth-child(6) { animation-delay: 0.6s; }\r\n #partneri .partner:nth-child(7) { animation-delay: 0.7s; }\r\n #partneri .partner:nth-child(8) { animation-delay: 0.8s; }\r\n #partneri .partner:nth-child(9) { animation-delay: 0.9s; }\r\n #partneri .partner:nth-child(10) { animation-delay: 1.0s; }\r\n #partneri .partner:nth-child(11) { animation-delay: 1.1s; }\r\n #partneri .partner:nth-child(12) { animation-delay: 1.2s; }\r\n #partneri .partner:nth-child(13) { animation-delay: 1.3s; }\r\n #partneri .partner:nth-child(14) { animation-delay: 1.4s; }\r\n #partneri .partner:nth-child(15) { animation-delay: 1.5s; }\r\n\r\n @keyframes fadeInUp {\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n }\r\n\r\n \/* Responzivni dizajn *\/\r\n @media (max-width: 768px) {\r\n #particles-js {\r\n height: 200px;\r\n }\r\n .particles-spacer {\r\n height: 200px;\r\n margin-top: 50px; \/* Manji margin za tablete *\/\r\n }\r\n #particles-js .eyebrow {\r\n font-size: clamp(1.2rem, 2.5vw, 1.5rem);\r\n }\r\n }\r\n @media (max-width: 480px) {\r\n #particles-js {\r\n height: 150px;\r\n }\r\n .particles-spacer {\r\n height: 150px;\r\n margin-top: 40px; \/* Jo\u0161 manji margin za mobilne *\/\r\n }\r\n #particles-js .eyebrow {\r\n font-size: clamp(1rem, 2vw, 1.2rem);\r\n }\r\n #partneri .partners-grid {\r\n grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));\r\n }\r\n #partneri .partner {\r\n padding: 10px;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <!-- Particles animacija sa tekstom -->\r\n <div id=\"particles-js\">\r\n <div class=\"eyebrow\">\u6211\u4eec\u7684\u5408\u4f5c\u4f19\u4f34<\/div>\r\n <\/div>\r\n <div class=\"particles-spacer\"><\/div>\r\n\r\n <!-- Partneri sekcija -->\r\n <section class=\"section\" id=\"partneri\">\r\n <div class=\"container\">\r\n <h2 class=\"title\">\u57fa\u4e8e\u4fe1\u4efb\u548c\u521b\u65b0\u7684\u5408\u4f5c<\/h2>\r\n <p class=\"lead\">\r\n GSL DOO \u975e\u5e38\u8363\u5e78\u80fd\u4e0e\u4f17\u591a\u516c\u53f8\u3001\u673a\u6784\u548c\u7ec4\u7ec7\u5408\u4f5c\uff0c\u4ed6\u4eec\u90fd\u8ba4\u53ef\u6211\u4eec\u6bcf\u9879\u89e3\u51b3\u65b9\u6848\u7684\u5353\u8d8a\u54c1\u8d28\u3001\u53ef\u9760\u6027\u548c\u6280\u672f\u4e13\u957f\u3002\u6211\u4eec\u7684\u5408\u4f5c\u5173\u7cfb\u5efa\u7acb\u5728\u4fe1\u4efb\u3001\u957f\u671f\u5408\u4f5c\u548c\u5bf9\u521b\u65b0\u5171\u540c\u627f\u8bfa\u7684\u57fa\u7840\u4e4b\u4e0a\u3002 <br><br>\r\n \u5f97\u76ca\u4e8e\u8fd9\u4e9b\u5408\u4f5c\u4f19\u4f34\u5173\u7cfb\uff0c\u6211\u4eec\u7684\u7cfb\u7edf\u548c\u4ea7\u54c1\u5df2\u878d\u5165\u585e\u5c14\u7ef4\u4e9a\u5404\u5730\u7684\u4f17\u591a\u57fa\u7840\u8bbe\u65bd\u3001\u5de5\u4e1a\u548c\u6280\u672f\u89e3\u51b3\u65b9\u6848\u4e2d\u3002\u6bcf\u4e2a\u9879\u76ee\u90fd\u4e3a\u6211\u4eec\u63d0\u4f9b\u4e86\u4e00\u4e2a\u65b0\u7684\u5951\u673a\uff0c\u8ba9\u6211\u4eec\u80fd\u591f\u901a\u8fc7\u521b\u65b0\u7684\u7535\u5b50\u7cfb\u7edf\u6765\u6539\u5584\u4eba\u4eec\u7684\u751f\u6d3b\u548c\u5de5\u4f5c\u8d28\u91cf\u3002\r\n <\/p>\r\n\r\n <h3 class=\"subtitle\">\u6211\u4eec\u91cd\u70b9\u4ecb\u7ecd\u90e8\u5206\u5408\u4f5c\u4f19\u4f34\uff1a<\/h3>\r\n <div class=\"partners-grid\">\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/04\/vik-novi-sad.png\" alt=\"\u8bfa\u7ef4\u8428\u5fb7\u7684\u4f9b\u6c34\u548c\u6c61\u6c34\u5904\u7406\"><\/div>\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/04\/vode_vojvodine_logo_150px.png\" alt=\"\u4f0f\u4f0a\u4f0f\u4e01\u90a3\u6cb3\u6c34\"><\/div>\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/04\/gspns_logo_150px.png\" alt=\"GSP \u8bfa\u7ef4\u8428\u5fb7\"><\/div>\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/04\/novosadska-toplana-logo.png\" alt=\"\u8bfa\u7ef4\u8428\u5fb7\u4f9b\u70ed\u5382\"><\/div>\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/08\/NIS_LOGO.png\" alt=\"\u56fd\u5bb6\u4fe1\u606f\u7cfb\u7edf\"><\/div>\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/08\/Continental_logo2.png\" alt=\"\u5927\u9646\"><\/div>\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/04\/Idvorsky_logo_150px.png\" alt=\"\u4f0a\u5fb7\u6c83\u65af\u57fa\"><\/div>\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/04\/OpenFyle_logo_150px.png\" alt=\"\u6253\u5f00\u6587\u4ef6\"><\/div>\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/04\/Yo1solution.png\" alt=\"Yo1\u89e3\u51b3\u65b9\u6848\"><\/div>\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/04\/Yo1Engineering.png\" alt=\"Yo1 \u5de5\u7a0b\"><\/div>\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/04\/Enterprise_Europe_Network_Logo.png\" alt=\"\u6b27\u6d32\u4f01\u4e1a\u7f51\u7edc\"><\/div>\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/04\/pyron_test.png\" alt=\"\u6d3e\u9f99\"><\/div>\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/08\/Tehnolink_logo.png\" alt=\"Technolink\"><\/div>\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/08\/150xstrentex.png\" alt=\"\u65af\u7279\u4f26\u6cf0\u514b\u65af\"><\/div>\r\n <div class=\"partner\"><img decoding=\"async\" src=\"https:\/\/gsl.rs\/wp-content\/uploads\/2025\/04\/green_energy_logo_150px.png\" alt=\"\u7eff\u8272\u80fd\u6e90\"><\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- U\u010ditavanje particles.js -->\r\n <script src=\"https:\/\/cdn.jsdelivr.net\/particles.js\/2.0.0\/particles.min.js\"><\/script>\r\n <script>\r\n document.addEventListener(\"DOMContentLoaded\", () => {\r\n \/\/ Inicijalizacija particles.js\r\n particlesJS(\"particles-js\", {\r\n \"particles\": {\r\n \"number\": {\r\n \"value\": 156,\r\n \"density\": {\r\n \"enable\": true,\r\n \"value_area\": 685\r\n }\r\n },\r\n \"color\": {\r\n \"value\": \"#ffffff\"\r\n },\r\n \"shape\": {\r\n \"type\": \"circle\",\r\n \"stroke\": {\r\n \"width\": 0,\r\n \"color\": \"#000000\"\r\n },\r\n \"polygon\": {\r\n \"nb_sides\": 5\r\n },\r\n \"image\": {\r\n \"src\": \"img\/github.svg\",\r\n \"width\": 100,\r\n \"height\": 100\r\n }\r\n },\r\n \"opacity\": {\r\n \"value\": 0.5,\r\n \"random\": false,\r\n \"anim\": {\r\n \"enable\": false,\r\n \"speed\": 10,\r\n \"opacity_min\": 0.1,\r\n \"sync\": false\r\n }\r\n },\r\n \"size\": {\r\n \"value\": 3,\r\n \"random\": true,\r\n \"anim\": {\r\n \"enable\": false,\r\n \"speed\": 40,\r\n \"size_min\": 0.1,\r\n \"sync\": false\r\n }\r\n },\r\n \"line_linked\": {\r\n \"enable\": true,\r\n \"distance\": 150,\r\n \"color\": \"#ffffff\",\r\n \"opacity\": 0.4,\r\n \"width\": 1\r\n },\r\n \"move\": {\r\n \"enable\": true,\r\n \"speed\": 3.2,\r\n \"direction\": \"none\",\r\n \"random\": false,\r\n \"straight\": false,\r\n \"out_mode\": \"out\",\r\n \"bounce\": false,\r\n \"attract\": {\r\n \"enable\": false,\r\n \"rotateX\": 600,\r\n \"rotateY\": 1200\r\n }\r\n }\r\n },\r\n \"interactivity\": {\r\n \"detect_on\": \"canvas\",\r\n \"events\": {\r\n \"onhover\": {\r\n \"enable\": true,\r\n \"mode\": \"repulse\"\r\n },\r\n \"onclick\": {\r\n \"enable\": true,\r\n \"mode\": \"push\"\r\n },\r\n \"resize\": true\r\n },\r\n \"modes\": {\r\n \"grab\": {\r\n \"distance\": 400,\r\n \"line_linked\": {\r\n \"opacity\": 1\r\n }\r\n },\r\n \"bubble\": {\r\n \"distance\": 400,\r\n \"size\": 40,\r\n \"duration\": 2,\r\n \"opacity\": 8,\r\n \"speed\": 3\r\n },\r\n \"repulse\": {\r\n \"distance\": 200,\r\n \"duration\": 0.4\r\n },\r\n \"push\": {\r\n \"particles_nb\": 4\r\n },\r\n \"remove\": {\r\n \"particles_nb\": 2\r\n }\r\n }\r\n },\r\n \"retina_detect\": true\r\n });\r\n\r\n \/\/ Inicijalizacija animacija za partnere\r\n const partners = document.querySelectorAll(\"#partneri .partner\");\r\n partners.forEach(partner => {\r\n partner.style.opacity = \"0\";\r\n partner.style.transform = \"translateY(20px)\";\r\n });\r\n\r\n \/\/ Hover efekat sa zadr\u017eavanjem boje i fade out\r\n partners.forEach(partner => {\r\n partner.addEventListener(\"mouseenter\", () => {\r\n const img = partner.querySelector(\"img\");\r\n img.style.filter = \"grayscale(0%)\"; \/\/ Ukloni grayscale odmah\r\n img.style.animation = \"none\"; \/\/ Zaustavi prethodnu animaciju\r\n partner.classList.add(\"hovered\"); \/\/ Dodaj klasu za zadr\u017eavanje boje\r\n });\r\n\r\n partner.addEventListener(\"mouseleave\", () => {\r\n const img = partner.querySelector(\"img\");\r\n \/\/ Zadr\u017ei boju 1 sekund, zatim pokreni fade out\r\n setTimeout(() => {\r\n if (partner.classList.contains(\"hovered\")) {\r\n img.style.animation = \"fadeOutGrayscale 1s ease forwards\";\r\n partner.classList.remove(\"hovered\"); \/\/ Ukloni klasu nakon animacije\r\n }\r\n }, 1000); \/\/ Zadr\u017ei boju 1 sekund\r\n });\r\n });\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>GSL DOO - \u5408\u4f5c\u4f19\u4f34 \u57fa\u4e8e\u4fe1\u4efb\u4e0e\u521b\u65b0\u7684\u5408\u4f5c GSL DOO \u975e\u5e38\u8363\u5e78\u80fd\u4e0e\u4f17\u591a\u516c\u53f8\u3001\u673a\u6784\u548c\u7ec4\u7ec7\u5f00\u5c55\u5408\u4f5c\uff0c\u4ed6\u4eec\u8ba4\u53ef\u6211\u4eec\u6bcf\u9879\u89e3\u51b3\u65b9\u6848\u7684\u54c1\u8d28\u3001\u53ef\u9760\u6027\u548c\u6280\u672f\u4e13\u957f\u3002\u6211\u4eec\u7684\u5408\u4f5c\u5173\u7cfb\u5efa\u7acb\u5728\u4fe1\u4efb\u3001\u957f\u671f\u5408\u4f5c\u548c\u5bf9\u521b\u65b0\u7684\u5171\u540c\u627f\u8bfa\u4e4b\u4e0a\u3002\u5f97\u76ca\u4e8e\u8fd9\u4e9b\u5408\u4f5c\u5173\u7cfb\uff0c\u6211\u4eec\u7684\u7cfb\u7edf\u548c\u4ea7\u54c1\u5df2\u6210\u4e3a [\u2026]<\/p>","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"content-type":"","footnotes":""},"class_list":["post-1980","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.gsl.rs\/zh\/wp-json\/wp\/v2\/pages\/1980","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.gsl.rs\/zh\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.gsl.rs\/zh\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.gsl.rs\/zh\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.gsl.rs\/zh\/wp-json\/wp\/v2\/comments?post=1980"}],"version-history":[{"count":0,"href":"https:\/\/www.gsl.rs\/zh\/wp-json\/wp\/v2\/pages\/1980\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.gsl.rs\/zh\/wp-json\/wp\/v2\/media?parent=1980"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}