<turbo-stream action="append" target="courses"><template>
    <a class="h-full isolate" title="JavaScript Games 2: Arkády" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/javascript-games-2-arkady">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="JavaScript Games 2: Arkády - Ľuboš Jaroš" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/1-55a12ef4b7fa1908b9eb611045c9fc4a76d929ba5e598348598ee29ceecc904d.png" loading="lazy" />

          <img alt="JavaScript Games 2: Arkády - Ľuboš Jaroš" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt3WXpjd05tRTNNUzFrWWpZMUxUUmlZek10WVRsbVpTMDROakUxT0RVM09HUmpNV0lHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--45c9f4c43fd72e06f7ef1bd795abcff420a14b0d/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/javascript-games-2-arkady.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="JavaScript Games 2: Arkády - Ľuboš Jaroš" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWs1Tm1NeFl6WmhaaTAzWm1VeUxUUmhNVEV0T1RJME1pMHpOak5oTXpWbFpURmlOR0VHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--b3338f3abb02630b44ed9c35ddf8378fd446d4d1/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/javascript-games-2.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            4.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            4h 43min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          JavaScript Games 2: Arkády
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Ľuboš Jaroš</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Spring Framework základy" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/online-kurz-spring-framework">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Spring Framework základy - Jaroslav Beňo" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/2-b730f55eaf265b78f1f69b6c85c26b4d2d6384b96811dd25855981b6414de390.png" loading="lazy" />

          <img alt="Spring Framework základy - Jaroslav Beňo" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWs0TldNNU5qVTFOQzB4TXpReUxUUTNOelV0T0RnMU55MDRPVFUyWm1OaFpHRm1OekVHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--b72d5afc1a0a1664d2061ae811b1ba5d060bf442/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/online-kurz-spring-framework.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Spring Framework základy - Jaroslav Beňo" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxrTnpaaE5tUXpOeTFpTW1FNUxUUmlOMkl0T1dVMFlpMDJaVE01TVdKaU4yRmxaVFVHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--614c0f82c83aee8320b8834e34445d65eff20005/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/Spring-Framework.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            4.8
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            5h 40min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Spring Framework základy
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Jaroslav Beňo</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Literatúra pre stredné školy" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/literatura-pre-stredne-skoly">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Literatúra pre stredné školy - Matúš Metes" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/2-b730f55eaf265b78f1f69b6c85c26b4d2d6384b96811dd25855981b6414de390.png" loading="lazy" />

          <img alt="Literatúra pre stredné školy - Matúš Metes" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxqTWpReVpqZ3haQzFtTURkbUxUUmtNVE10WWpjME5pMWtaalpsTVdFNU9EWTJOR1lHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--9c5d58665880a21b5452c83ada915427de033298/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/literatura-pre-stredne-skoly.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Literatúra pre stredné školy - Matúš Metes" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt6Wm1NM05HWXlPUzAyT0RkakxUUTVOR0V0T1RRMlpDMW1ZelJtWVRZeU9EWTVaVFVHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--3e438cff76a7bc6a3a585bdccdd2fe47938633b5/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/literatura-ikona-skillmea.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            5h 10min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Literatúra pre stredné školy
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Matúš Metes</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="App Inventor plus AI/ML – projekt Pac-Man" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/app-inventor-plus-ai-ml-projekt-pac-man">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-lg hover:shadow  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card " data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="App Inventor plus AI/ML – projekt Pac-Man - Petr Hájek" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/0-e1f7ce7f07672e4a995b4c50f78b1549d84abec6a80dbaad002b301dc812cbb7.png" loading="lazy" />

          <img alt="App Inventor plus AI/ML – projekt Pac-Man - Petr Hájek" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWs1WVRjellXRmtNeTFtTURRNUxUUXlOamN0T0RJeVppMWpOR000T0dWaE1EVmtaR0lHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--a1156de0c353a9fbbc40ca540fd689f0dfdb3c1a/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/app-inventor-plus-ai-ml-projekt-pac-man.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="App Inventor plus AI/ML – projekt Pac-Man - Petr Hájek" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxoTVRRek1ESTJZeTAxT1RRekxUUmpOVGd0WVdSaE9TMWxaVFk1TkRRNE56TmxORFlHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--df56973bf213d500ccd6421c825a56b981383018/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJYW5CbkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--f5c45aeeef55f344da1109b3d2e5495440e99913/mit-app-inventor-ml-for-kids.jpg" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            -
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            1h 33min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          App Inventor plus AI/ML – projekt Pac-Man
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Petr Hájek</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Matematika pre stredné školy IV. - Pravdepodobnosť, kombinatorika a štatistika" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/matematika-pre-stredne-skoly-iv-pravdepodobnost-kombinatorika-a-statistika">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Matematika pre stredné školy IV. - Pravdepodobnosť, kombinatorika a štatistika - Matúš Metes" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/6-796225ed8a3508fed218013681775afbb9dc95fcc76251aa4ea0d39b6a31e6de.png" loading="lazy" />

          <img alt="Matematika pre stredné školy IV. - Pravdepodobnosť, kombinatorika a štatistika - Matúš Metes" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWs1TTJSak1qQXlOQzB5WWpReExUUXlOR010T0RVeE9DMDROakppTkdZek0ySmlZV0VHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--f300086a6dfc7cfe551af5bae370ff9219274158/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/matematika-pre-stredne-skoly-iv-pravdepodobnost-kombinatorika-a-statistika.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Matematika pre stredné školy IV. - Pravdepodobnosť, kombinatorika a štatistika - Matúš Metes" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxpTldOak9URmlOeTFrTlRWbExUUTJaV010WW1NNFlpMDVOemRsTURoaE56VmhOeklHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--14f19db352402a55c65ea8d5f65c3efb1108e63f/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/matika-pre-vs-ikona.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            6h 39min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Matematika pre stredné školy IV. - Pravdepodobnosť, kombinatorika a štatistika
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Matúš Metes</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Lokálny marketing online" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/lokalny-marketing">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Lokálny marketing online - Ján Laurenčík" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/5-9ede3f7f722ef695a6c9f2681f8e5a811605d67238b1850ebad924ca51b5b4fd.png" loading="lazy" />

          <img alt="Lokálny marketing online - Ján Laurenčík" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxsT0RCbE56UTFNeTB4WWpnMkxUUTVNVGt0WWpKallpMDFNakE0WXpjMU1HUXhNR1VHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--adc0a870585ce6435a6af02f5498c0509a28a395/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/lokalny%20marketing%202.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Lokálny marketing online - Ján Laurenčík" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWsyTnprMk5EbGpOaTAwWVdVeUxUUTVPRFl0WVRZNE5pMDNNMlV3WVRFNFpqTTFZV1lHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--735dd4f45a0c372521eaca17fe3986bafd82560f/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/lokalny%20marketing-01.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            2h 19min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Lokálny marketing online
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Ján Laurenčík</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Certifikácia MO-211 Excel-Expert" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/certifikace-mo-211-excel-expert">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Certifikácia MO-211 Excel-Expert - Robin Hrabina" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/1-55a12ef4b7fa1908b9eb611045c9fc4a76d929ba5e598348598ee29ceecc904d.png" loading="lazy" />

          <img alt="Certifikácia MO-211 Excel-Expert - Robin Hrabina" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWsyTlRFMlpUaGpZaTB6TkRNeUxUUTRaak10T1dNeVpDMHdabVF6TURVMFpqZGhORGtHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--83c6d93e477e87608dfdb5ad6e70254e2c1edbde/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/excel%20ceritifkace%20expert%202.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Certifikácia MO-211 Excel-Expert - Robin Hrabina" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxoTm1VMFkyUmlNaTAyTmpneExUUTJObVF0WWpZMU55MWhaakF6WWpZME5ERm1OR0lHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--eff240d9a280a3a61e9be93469fc9edf4d3ccc70/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/excel%20expert-01.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            5h 43min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Certifikácia MO-211 Excel-Expert
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Robin Hrabina</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Sieť Lightning network na platby v Bitcoinoch" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/ako-pouzivat-siet-lightning-network-na-platby-v-bitcoinoch">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Sieť Lightning network na platby v Bitcoinoch - Juraj Bednár" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/0-e1f7ce7f07672e4a995b4c50f78b1549d84abec6a80dbaad002b301dc812cbb7.png" loading="lazy" />

          <img alt="Sieť Lightning network na platby v Bitcoinoch - Juraj Bednár" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWswWTJJNFpHSTNNUzB4TnpneUxUUmxZbUl0T0RBeE5pMWxOREV4WkdFNVlUUXpaVFFHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--f2f4106523a542519dd216572c017cece4c40049/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/ako-pouzivat-siet-lightning-network-na-platby-v-bitcoinoch.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Sieť Lightning network na platby v Bitcoinoch - Juraj Bednár" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt5Wm1Kak5ERmxNaTFqWmpsa0xUUXlPV1V0WVdZMU9TMDVZams0TldKaU5USTRaVEVHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--7eee862efbbe9346ac409294e6e46c66b22b5094/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/lightning-network.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            4.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            1h 31min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Sieť Lightning network na platby v Bitcoinoch
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Juraj Bednár</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Talianske slovesá v praxi" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/talianske-slovesa">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Talianske slovesá v praxi - Adriána Tišťanová" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/0-e1f7ce7f07672e4a995b4c50f78b1549d84abec6a80dbaad002b301dc812cbb7.png" loading="lazy" />

          <img alt="Talianske slovesá v praxi - Adriána Tišťanová" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt3TW1abE16SmtZaTA0TmpoakxUUmxOR0V0T1dVeVppMDNORFpoTnprelpEWTNOVGdHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--b1612eb69bb968b51f603ee366a9bad219cc6b80/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/Talianske%20slovesa%CC%81%202.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Talianske slovesá v praxi - Adriána Tišťanová" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt3TjJOaE1EQXlOUzAyWldOaUxUUXhNREF0WVdabVlTMDVZekJpTm1JNE5UWmlPV01HT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--bcade7de0aae2740c6f9d44198d466b39e7243ea/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/tliancina%20slovesa-01.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            26min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Talianske slovesá v praxi
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Adriána Tišťanová</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Microsoft Outlook: Prehľadný sprievodca e-mailovým nástrojom" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/microsoft-outlook">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-lg hover:shadow  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card " data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Microsoft Outlook: Prehľadný sprievodca e-mailovým nástrojom - Peter Hanuštiak" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/0-e1f7ce7f07672e4a995b4c50f78b1549d84abec6a80dbaad002b301dc812cbb7.png" loading="lazy" />

          <img alt="Microsoft Outlook: Prehľadný sprievodca e-mailovým nástrojom - Peter Hanuštiak" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxpWTJGbFkyUmpOeTFsWVRNMExUUmxZelV0WVRobVlpMWtOek0xWXpoak9UVXpOVGtHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--8b6ad377676b8ec801e394e99731093da244084c/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/microsoft-outlook.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Microsoft Outlook: Prehľadný sprievodca e-mailovým nástrojom - Peter Hanuštiak" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWswTTJWbU0yRTROUzFpTWpReExUUXpaREl0WVdKaU9TMWhNR1UxWkRFMU1ETTVPVEVHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--ca930449609b04e8ce576b7c00e1a70d78c377d4/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/microsoft-outlook-hanustiak.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            4.8
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            2h 40min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Microsoft Outlook: Prehľadný sprievodca e-mailovým nástrojom
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Peter Hanuštiak</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Francúzština na cesty" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/francuzstina-na-cesty">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card " data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Francúzština na cesty - OUI! francúzština" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/7-cfa636aad6d758af36bc71455661b9c8d8526e341baf8f7236441f4d1878c2c3.png" loading="lazy" />

          <img alt="Francúzština na cesty - OUI! francúzština" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWszT0RNd05EWmlPUzFrWmpKakxUUm1aR0V0T1dReFppMHpOVEE1TnpSaU1qWmtORElHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--822e53d7bd60e5eef25b4eb89374a417183cb8e1/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/francuzstina%202.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Francúzština na cesty - OUI! francúzština" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWs1TURRek1qWmlZaTFrTTJJNUxUUXlZMll0WVRRd1lpMHpPRFUxWkdFeU4yUXhaV1FHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--5b985f7d40cb6cd9308972530bab06cdf6091ec1/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/francuz%C5%A1tina.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            2h 34min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Francúzština na cesty
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">OUI! francúzština</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Webrebel 3: OOP a Laravel" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/webrebel-3-oop-a-laravel">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Webrebel 3: OOP a Laravel - Yablko (Roman Hraška)" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/7-cfa636aad6d758af36bc71455661b9c8d8526e341baf8f7236441f4d1878c2c3.png" loading="lazy" />

          <img alt="Webrebel 3: OOP a Laravel - Yablko (Roman Hraška)" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxpWWpFNVpXRTFNeTAxTVRZeExUUmtZVFF0T1RSbE5DMWtOMk5qWW1RMFpUWmxObUVHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--c5616c04f2f46647ac2118df469d979e41f68a5a/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/webrebel-3-oop-a-laravel.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Webrebel 3: OOP a Laravel - Yablko (Roman Hraška)" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt3T1RsaE1tVXdOQzFtTkRWakxUUmxOREV0WW1RM1lpMWpNMlppWTJKbFpUTTJNbUVHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--7f2f4533bb46226450dd43c76f073a86a0091dbc/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/Webrebel-3.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            4.8
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            24h 56min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Webrebel 3: OOP a Laravel
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Yablko (Roman Hraška)</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Node.js základy" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/node-js-express">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Node.js základy - Mária Sejnová" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/8-2ae6572ab0d4d7f7d39a15be83dcbc34301b699f615917f703250f1fcddd3c5b.png" loading="lazy" />

          <img alt="Node.js základy - Mária Sejnová" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWsyWWpCbU4yVXlZaTB5WkdKakxUUmtZelF0T0Rnek5DMW1aakpqWmpsbVpUWmxObU1HT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--d55eb65e8ed0f15aa8170bc1e8a5b23167b6cbda/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/node%20js%20express%202.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Node.js základy - Mária Sejnová" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxtWldVME5qWTBPUzAzT0RreExUUXpNelF0WVRWbE5pMWhOamt3TVdRNE16Z3dZelVHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--8fae0031bc2237930f134a026eda88f4159e5229/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/node%20js%20express-01.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            4h 40min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Node.js základy
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Mária Sejnová</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Word - Pre stredne pokročilých" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/word-pre-stredne-pokrocilych">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-lg hover:shadow  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card " data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Word - Pre stredne pokročilých - Petr Kohoutek" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/0-e1f7ce7f07672e4a995b4c50f78b1549d84abec6a80dbaad002b301dc812cbb7.png" loading="lazy" />

          <img alt="Word - Pre stredne pokročilých - Petr Kohoutek" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWs1TVRFd1lUUm1NQzA1WTJWbUxUUXhNVGN0WVRKak15MDFOVGsxWlRJNU5XRmtZamtHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--0c0c14e6dcb5b68582d1ad6e3a50c2bb43bd4c18/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/Word%20-%20Pro%20st%C5%99edn%C4%9B%20pokro%C4%8Dil%C3%A9%202.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Word - Pre stredne pokročilých - Petr Kohoutek" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt3TlRFMU9Ua3paaTA1T1RFekxUUTRNVEF0WW1RNFl5MHhNMlpsTXpGaFpHUmtaVGdHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--73539fd2f4ba13016dbd36577272e9cf8687d776/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/ikona-word-za%C4%8D%C3%A1te%C4%8Dn%C3%ADky.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            1h 45min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Word - Pre stredne pokročilých
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Petr Kohoutek</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Maven základy" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/online-kurz-maven">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-lg hover:shadow  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card " data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Maven základy - Jaroslav Beňo" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/0-e1f7ce7f07672e4a995b4c50f78b1549d84abec6a80dbaad002b301dc812cbb7.png" loading="lazy" />

          <img alt="Maven základy - Jaroslav Beňo" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt3TURkbE4ySm1OeTAxTW1RekxUUmhZakF0WWpGall5MHhPVGRoWVdSaU5tUmxNVE1HT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--a6c9d409fad054ce6a710c389e12b525563fd6b3/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/online-kurz-maven.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Maven základy - Jaroslav Beňo" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt3WWpobU9UaGlOQzFsTnpnMkxUUmtZVGd0T0RrMFlTMHhZVGs0TnpFeE1EVTVaV0VHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--4e70917438c5c076564b0608b06cf3f99ca397ff/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/maven.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            4.9
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            1h 48min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Maven základy
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Jaroslav Beňo</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Business etiketa" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/business-etiketa">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-lg hover:shadow  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card " data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Business etiketa - Kateřina Braithwaite" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/0-e1f7ce7f07672e4a995b4c50f78b1549d84abec6a80dbaad002b301dc812cbb7.png" loading="lazy" />

          <img alt="Business etiketa - Kateřina Braithwaite" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt6TldFM01XVTRPUzFtT1dJM0xUUTRaV0V0WWpVd015MDFNRGsxTXpOaE1qUmtPV1VHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--9463186dd7f3b3f4273626b7ffdeb2ad200f959c/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/business-etiketa%202.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Business etiketa - Kateřina Braithwaite" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWsyTkRSak16RmhNeTA1T0RSbExUUTBNREV0T0RaaE1DMDVaVGd6WlRsbE5qTmpNakVHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--aa02e44df08619fb9aed4623b5d1519a7d73836b/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/biznis-etiketa.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            52min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Business etiketa
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Kateřina Braithwaite</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Selenide  - stručné UI testy" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/selenide-ui-testovanie">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Selenide  - stručné UI testy - Furby (Martin Škarbala)" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/8-2ae6572ab0d4d7f7d39a15be83dcbc34301b699f615917f703250f1fcddd3c5b.png" loading="lazy" />

          <img alt="Selenide  - stručné UI testy - Furby (Martin Škarbala)" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt4TjJJeE9URmpaQzA1TVRZd0xUUmxPVGd0T1dVME1DMHdaRFF5TlRZd1pUVXpNelFHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--efad081034319b4f2f037d0d2a0d9c519a456dfe/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/selenide-ui-testovanie.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Selenide  - stručné UI testy - Furby (Martin Škarbala)" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxqWXpabVlUUTVOeTFpTldVeUxUUTJaVGN0WVdZMll5MDJORGN6TWpVM01qZzBOakVHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--075c45bde5b79cf386e05b6f420427266a88f95d/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/selenide-a-ui-testy.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            3h 33min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Selenide  - stručné UI testy
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Furby (Martin Škarbala)</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Framer pre začiatočníkov" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/framer">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Framer pre začiatočníkov - Ľudovít Nastišin" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/7-cfa636aad6d758af36bc71455661b9c8d8526e341baf8f7236441f4d1878c2c3.png" loading="lazy" />

          <img alt="Framer pre začiatočníkov - Ľudovít Nastišin" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxsT1dJeFpEQmtOUzB3WTJReUxUUXdaRGd0T0dJNU15MDVOelExWW1GbU56QTNaak1HT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--80f8ac47e5a25a7bf0261d2cc11fc6086122de3a/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/framer%202.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Framer pre začiatočníkov - Ľudovít Nastišin" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt3TWpnNE5UTTROQzFsWXpOaUxUUTFaRFF0WVRGak5pMDNObUZrWWpKak5qUTJPV01HT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--56cff2605dda6204f192464b119dc3b36ac02aa8/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/framer-01.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            1h 1min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Framer pre začiatočníkov
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Ľudovít Nastišin</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Obchodovanie na Forexe od A po Z" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/obchodovanie-na-forexe-od-a-po-z">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-lg hover:shadow  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card " data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Obchodovanie na Forexe od A po Z - Martin Novák" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/0-e1f7ce7f07672e4a995b4c50f78b1549d84abec6a80dbaad002b301dc812cbb7.png" loading="lazy" />

          <img alt="Obchodovanie na Forexe od A po Z - Martin Novák" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxqTlRZMVptRTFOUzFpTUdKaUxUUXlaV1V0T0RsbE15MWlOall3TlRNeE16QXhZbVlHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--9d84357667797ece0ed84ff3f771a250dd695bae/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/Forex%202.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Obchodovanie na Forexe od A po Z - Martin Novák" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxqWmpWak5HWTFaaTA0T1RKaExUUmlabU10WWpJell5MHlZbVE0TUdZeU5UWmhZbVVHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--28b4b11853ee9a933003a10f3a117400c1ee3bab/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/obchodovani-forex.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            2h 7min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Obchodovanie na Forexe od A po Z
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Martin Novák</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Word – Hromadná korešpondencia" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/word-hromadna-korespondencia">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Word – Hromadná korešpondencia - Petr Kohoutek" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/0-e1f7ce7f07672e4a995b4c50f78b1549d84abec6a80dbaad002b301dc812cbb7.png" loading="lazy" />

          <img alt="Word – Hromadná korešpondencia - Petr Kohoutek" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxpTnpVMFl6RXdaaTFrTkRWbUxUUXlORFl0T1dOa05TMWhNemMzWkRBMFlqYzBOMklHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--e45ea463abdb29a1653d0ab9046954c27a5fcd00/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/word%20korespondencia%202.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Word – Hromadná korešpondencia - Petr Kohoutek" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWs0WW1Vd1pUZzJNaTAwTmpneUxUUmlZVFl0T0daa1lTMHdZVEZpWW1JeE16SmlaRGtHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--523c26fbb8e64e58824b43f9cc0b6b38f5312346/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/word%20icon%20v2.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            -
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            40min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Word – Hromadná korešpondencia
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Petr Kohoutek</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="ASP.NET Web Pages - kompletný web pre začiatočníkov " data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/asp-net-web-pages-kompletny-web-pre-zaciatocnikov">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="ASP.NET Web Pages - kompletný web pre začiatočníkov  - Jaroslav Beňo" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/0-e1f7ce7f07672e4a995b4c50f78b1549d84abec6a80dbaad002b301dc812cbb7.png" loading="lazy" />

          <img alt="ASP.NET Web Pages - kompletný web pre začiatočníkov  - Jaroslav Beňo" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWsyWmpJNVpqRmpPQzA0TVRZM0xUUTBaR0V0T1RaaU5TMDFOell3TURrek1tWm1ZalFHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--caf9284e57c613b9d09d0cd97a55f80374d98d07/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/asp-net-web-pages-kompletny-web-pre-zaciatocnikov.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="ASP.NET Web Pages - kompletný web pre začiatočníkov  - Jaroslav Beňo" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxpWm1Zd1pXSm1NUzFqT0RBM0xUUmhNMll0T0dNeU1TMDNPV1U1TnpJNFlXTmtPVEVHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--a319cdcb6354478700df7a9222d072c3fe96a518/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/asp.net-web-pages.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            10h 35min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          ASP.NET Web Pages - kompletný web pre začiatočníkov 
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Jaroslav Beňo</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Career Expo Praha 2024" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/career-expo-praha-2024">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          <div class="rounded-full text-xs bg-corporate text-white px-3 py-1.5 h-auto  ">
  Free
</div>

        </div>


        <img alt="Career Expo Praha 2024 - Skillmea" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/3-8da6a38229f90d08c120143d2ff80af705a3825b4eca09b3f8eff836f66a371d.png" loading="lazy" />

          <img alt="Career Expo Praha 2024 - Skillmea" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://cdn.skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWsyWWpjMFkySm1NUzA1WWpGakxUUmtOVGd0T1RjMk55MW1NemRpTjJZMlptVTFZelVHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--534f7cff740e28ae29dfc61f7d927d651ac9d47a/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/career%20expo%20prague%202.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Career Expo Praha 2024 - Skillmea" data-test-id="course_card_course_image" src="https://cdn.skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxpT0dObU9XUXpNUzFqTWpVd0xUUTJZekV0T0dSbE5TMHhZMlE0WWpRek16VTJaREVHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--63da1196a426bbf86b7378a2e36ee1875fd70355/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/carer%20expo-01.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            -
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            8h 31min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Career Expo Praha 2024
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Skillmea</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Java + MySQL CRUD aplikácia" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/java-mysql-crud-aplikacia">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-lg hover:shadow  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card " data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Java + MySQL CRUD aplikácia - Jakub Jahič" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/0-e1f7ce7f07672e4a995b4c50f78b1549d84abec6a80dbaad002b301dc812cbb7.png" loading="lazy" />

          <img alt="Java + MySQL CRUD aplikácia - Jakub Jahič" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt4T0RRd1lqRm1aaTB3TW1ObUxUUXdOREV0WW1VNFl5MDJZelUwWWpCa05EaGtOR01HT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--1978c879e0e2004f1431339ce82f974cbba3fe8d/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/sql%20crud%20operacie%202.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Java + MySQL CRUD aplikácia - Jakub Jahič" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWsyT1RGbFlUSm1NaTFrTldJMkxUUXlNbVV0WWpBME5TMDBZMkZtT0dJME56bGtaREFHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--f77f5f445b0464a6f08679ecbe63dbce1372186a/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/my%20sql%20crud-01%20(1).png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            1h 27min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Java + MySQL CRUD aplikácia
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Jakub Jahič</span></span>
      </div>

</div>
</a>
  <a class="h-full isolate" title="Kreatívne rozhodovanie o kariére" data-turbo="false" data-test-id="course_card_course_link" href="/online-kurzy/kreativne-rozhodovanie-o-kariere">
    <div id="" class="flex flex-col bg-white relative z-10 h-full shadow-xl hover:shadow-lg  transition-all will-change-transform duration-300 rounded-3xl p-6 group/card hover:translate-y-1" data-test-id="card_component">
  
      <div class="relative aspect-video bg-skillmea-green-200 rounded-t-3xl -mt-6 -mx-6 mb-12">
        <div class="absolute z-10 w-1/2 my-4 lg:my-7 ml-6 lg:ml-7 flex flex-wrap items-start gap-1">
          
        </div>


        <img alt="Kreatívne rozhodovanie o kariére - Veronika Čiefová" class="w-full h-full object-cover rounded-t-3xl absolute" src="https://cdn.skillmea.sk/assets/bg-course-card/0-e1f7ce7f07672e4a995b4c50f78b1549d84abec6a80dbaad002b301dc812cbb7.png" loading="lazy" />

          <img alt="Kreatívne rozhodovanie o kariére - Veronika Čiefová" class="w-full h-full rounded-t-3xl object-contain absolute" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWszTm1JMU16WTVOeTAwWVRNeUxUUmhZVFl0WW1WaE1pMDFNVGN6TURVNFptWXhOVGdHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--3c2fc1381a628404ee51e03b799e573c6732fba7/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVFJc0FXa0Jwdz09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--1f8f55a2556140473b100956f39c0b0224bca55d/kreativne-rozhodovanie-o-kariere.png" loading="lazy" />

        <img width="96" height="96" class="absolute bottom-0 left-6 translate-y-1/2 w-14 h-14 rounded-xl shadow-xl  border-4 border-white z-20" alt="Kreatívne rozhodovanie o kariére - Veronika Čiefová" data-test-id="course_card_course_image" src="https://skillmea.sk/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt6TWpabFpETmtaQzFqWVdJeExUUTRNRGd0WVRNM1pDMDRNVFEwTlRFNU16WXlOVFFHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--1e568a985ef13377fbb4678131ed28058f763e18/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2RTNKbGMybDZaVjkwYjE5bWFXeHNXd2RwWldsbCIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--99d81b4414601e1d56c36eddb75c4f7987731909/kreativne-rozhodovanie-ikona.png" loading="lazy" />
      </div>

      <div class="flex justify-between mb-2 text-corporate">
        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewbox="0 0 20 20" fill="currentColor">
  <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>

          <span class="text-sm -translate-y-0.5 font-semibold">
            5.0
          </span>
        </div>

        <div class="flex gap-1 items-center text-xs">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
          <span class="text-sm -translate-y-0.5 font-semibold">
            1h 10min
          </span>
        </div>
      </div>

      <div class="mb-2 text-xs flex flex-col">
        <h3 class="text-base font-semibold leading-tight line-clamp-2 mb-2 h-10" data-test-id="course_card_course_title">
          Kreatívne rozhodovanie o kariére
        </h3>
        <span class="text-slate-400 mt-auto">od <span class="text-slate-500">Veronika Čiefová</span></span>
      </div>

</div>
</a>

</template></turbo-stream>
<turbo-stream action="update" target="pagination"><template>
  
  <nav class="mx-auto max-w-min">
    <ul class="flex flex-row items-center gap-2">
      <li>
  <a class="flex font-light items-center justify-center text-xs text-slate-500 w-6 h-6 transition duration-300 rounded-lg hover:bg-slate-100" data-action="click-&gt;courses--filter#filter" data-filter-params="{&quot;sort&quot;:&quot;trends&quot;,&quot;page&quot;:1}" href="/online-kurzy?sort=trends"><svg xmlns="http://www.w3.org/2000/svg" class="w-3 h-3 text-slate-500 pointer-events-none" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M11 19l-7-7 7-7m8 14l-7-7 7-7"></path>
</svg>
</a>
</li>

      <li>
  <a rel="prev" class="flex font-light items-center justify-center text-xs text-slate-500 w-6 h-6 transition duration-300 rounded-lg hover:bg-slate-100" data-action="click-&gt;courses--filter#filter" data-filter-params="{&quot;sort&quot;:&quot;trends&quot;,&quot;page&quot;:&quot;&quot;}" href="/online-kurzy?page=22&amp;sort=trends">
    <svg xmlns="http://www.w3.org/2000/svg" class="w-3 h-3 text-slate-500 pointer-events-none" fill="none" viewbox="0 0 24 24" stroke="currentColor">
  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path>
</svg>

</a></li>


          <li class="items-center justify-center hidden w-6 h-6 text-xs font-light text-slate-500 transition duration-300 rounded-lg hover:bg-slate-100 sm:flex">
  <a class="page-link" href="#">
    <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor">
  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 12h.01M12 12h.01M19 12h.01M6 12a1 1 0 11-2 0 1 1 0 012 0zm7 0a1 1 0 11-2 0 1 1 0 012 0zm7 0a1 1 0 11-2 0 1 1 0 012 0z"></path>
</svg>

</a></li>

            <li>
    <a class="flex font-light items-center justify-center text-xs text-slate-500 w-6 h-6 transition duration-300 rounded-lg hover:bg-slate-100" data-action="click-&gt;courses--filter#filter" data-filter-params="{&quot;sort&quot;:&quot;trends&quot;,&quot;page&quot;:&quot;21&quot;}" href="/online-kurzy?page=21&amp;sort=trends">21</a>
  </li>

            <li>
    <a rel="prev" class="flex font-light items-center justify-center text-xs text-slate-500 w-6 h-6 transition duration-300 rounded-lg hover:bg-slate-100" data-action="click-&gt;courses--filter#filter" data-filter-params="{&quot;sort&quot;:&quot;trends&quot;,&quot;page&quot;:&quot;22&quot;}" href="/online-kurzy?page=22&amp;sort=trends">22</a>
  </li>

            <li>
    <a class="flex items-center justify-center font-bold text-white text-xs w-6 h-6 bg-gradient-to-tr from-skillmea-green-700 to-corporate rounded-lg" data-action="click-&gt;courses--filter#filter" data-filter-params="{&quot;sort&quot;:&quot;trends&quot;,&quot;page&quot;:&quot;23&quot;}">23</a>
  </li>

            <li>
    <a rel="next" class="flex font-light items-center justify-center text-xs text-slate-500 w-6 h-6 transition duration-300 rounded-lg hover:bg-slate-100" data-action="click-&gt;courses--filter#filter" data-filter-params="{&quot;sort&quot;:&quot;trends&quot;,&quot;page&quot;:&quot;24&quot;}" href="/online-kurzy?page=24&amp;sort=trends">24</a>
  </li>

            <li>
    <a class="flex font-light items-center justify-center text-xs text-slate-500 w-6 h-6 transition duration-300 rounded-lg hover:bg-slate-100" data-action="click-&gt;courses--filter#filter" data-filter-params="{&quot;sort&quot;:&quot;trends&quot;,&quot;page&quot;:&quot;25&quot;}" href="/online-kurzy?page=25&amp;sort=trends">25</a>
  </li>

          <li class="items-center justify-center hidden w-6 h-6 text-xs font-light text-slate-500 transition duration-300 rounded-lg hover:bg-slate-100 sm:flex">
  <a class="page-link" href="#">
    <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor">
  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 12h.01M12 12h.01M19 12h.01M6 12a1 1 0 11-2 0 1 1 0 012 0zm7 0a1 1 0 11-2 0 1 1 0 012 0zm7 0a1 1 0 11-2 0 1 1 0 012 0z"></path>
</svg>

</a></li>


      <li>
  <a rel="next" class="flex font-light items-center justify-center text-xs text-slate-500 w-6 h-6 transition duration-300 rounded-lg hover:bg-slate-100" data-action="click-&gt;courses--filter#filter" data-filter-params="{&quot;sort&quot;:&quot;trends&quot;,&quot;page&quot;:&quot;&quot;}" href="/online-kurzy?page=24&amp;sort=trends">
    <svg xmlns="http://www.w3.org/2000/svg" class="w-3 h-3 text-slate-500 pointer-events-none" fill="none" viewbox="0 0 24 24" stroke="currentColor">
  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
</svg>

</a></li>

      <li>
  <a class="flex font-light items-center justify-center text-xs text-slate-500 w-6 h-6 transition duration-300 rounded-lg hover:bg-slate-100" href="/online-kurzy?page=27&amp;sort=trends"><svg xmlns="http://www.w3.org/2000/svg" class="w-3 h-3 text-slate-500 pointer-events-none" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path stroke-linecap="round" stroke-linejoin="round" d="M13 5l7 7-7 7M5 5l7 7-7 7"></path>
</svg>
</a>
</li>

    </ul>
  </nav>

</template></turbo-stream>
<turbo-stream action="update" target="load_more"><template>
  <div class="text-center">
  
</div>

</template></turbo-stream>
<turbo-stream action="update" target="sidebar"><template>
  <div class="bg-white/0 w-full h-full rounded-r-xl bg-corporate relative top-3">
  <div x-ref="categoriesIcons" class="flex flex-col gap-2 sticky top-10 w-full transition-all duration-300">
    <header class="flex items-center mb-4 h-12">
      <span x-show="sidebarOpen" class="block uppercase text-xs text-slate-400 w-full font-bold">
        Kategórie
      </span>

      <div @click="sidebarOpen = !sidebarOpen" :class="{ 'm-4' : !sidebarOpen }" class="w-8 aspect-square flex items-center justify-center text-slate-400 rounded-lg cursor-pointer relative">
        <div :class="{'-rotate-180': sidebarOpen}">
          <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewbox="0 0 24 24" stroke="currentColor" stroke-width="2">
  <path d="M12.5556 7L18 12M18 12L12.5556 17M18 12L4 12" stroke-linecap="round" stroke-linejoin="round"></path>
  <path d="M20 17L20 7" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>


        </div>
      </div>
    </header>

      <div class="flex items-center gap-4">
        <a class="flex items-center gap-4 group w-full relative" data-turbo-frame="_top" href="/online-kurzy">
          <div class="category-icon flex-none flex items-center justify-center w-14 rounded-lg aspect-square transition duration-300 bg-skillmea-green-200 text-corporate">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="size-8">
  <path d="M9.61 2 L3.09 2 C2.49 2 2 2.49 2 3.09 L2 9.61 C2 10.21 2.49 10.7 3.09 10.7 L9.61 10.7 C10.21 10.7 10.7 10.21 10.7 9.61 L10.7 3.09 C10.7 2.49 10.21 2 9.61 2 Z"></path>
  <path d="M20.91 2 L14.39 2 C13.79 2 13.3 2.49 13.3 3.09 L13.3 9.61 C13.3 10.21 13.79 10.7 14.39 10.7 L20.91 10.7 C21.51 10.7 22 10.21 22 9.61 L22 3.09 C22 2.49 21.51 2 20.91 2 Z"></path>
  <path d="M9.61 13.3 L3.09 13.3 C2.49 13.3 2 13.79 2 14.39 L2 20.91 C2 21.51 2.49 22 3.09 22 L9.61 22 C10.21 22 10.7 21.51 10.7 20.91 L10.7 14.39 C10.7 13.79 10.21 13.3 9.61 13.3 Z"></path>
  <path d="M15.87 13.3 L13.67 13.3 C13.47 13.3 13.3 13.47 13.3 13.67 L13.3 15.87 C13.3 16.07 13.47 16.24 13.67 16.24 L15.87 16.24 C16.07 16.24 16.24 16.07 16.24 15.87 L16.24 13.67 C16.24 13.47 16.07 13.3 15.87 13.3 Z"></path>
  <path d="M21.42 13.3 L19.21 13.3 C19.01 13.3 18.85 13.47 18.85 13.67 L18.85 15.87 C18.85 16.07 19.01 16.24 19.21 16.24 L21.42 16.24 C21.62 16.24 21.78 16.07 21.78 15.87 L21.78 13.67 C21.78 13.47 21.62 13.3 21.42 13.3 Z"></path>
  <path d="M15.87 18.85 L13.67 18.85 C13.47 18.85 13.3 19.01 13.3 19.21 L13.3 21.42 C13.3 21.62 13.47 21.78 13.67 21.78 L15.87 21.78 C16.07 21.78 16.24 21.62 16.24 21.42 L16.24 19.21 C16.24 19.01 16.07 18.85 15.87 18.85 Z"></path>
  <path d="M21.42 18.85 L19.21 18.85 C19.01 18.85 18.85 19.01 18.85 19.21 L18.85 21.42 C18.85 21.62 19.01 21.78 19.21 21.78 L21.42 21.78 C21.62 21.78 21.78 21.62 21.78 21.42 L21.78 19.21 C21.78 19.01 21.62 18.85 21.42 18.85 Z"></path>
</svg>

          </div>
          <div x-show="sidebarOpen" class="transition will-change-transform w-full duration-300 group-hover:translate-x-1 line-clamp-1">
            Všetky kurzy
          </div>
          <div class="absolute -right-4 translate-x-full pointer-events-none">
            <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
              Všetky kurzy
            </span>
          </div>
</a>      </div>

      <div x-data="{submenuOpen: false}">
          <div class="flex items-center gap-4">
            <a class="flex items-center gap-4 group w-full relative" data-turbo-frame="_top" href="/online-kurzy/online/programovanie">
              <div class="category-icon flex-none flex items-center justify-center w-14 rounded-lg aspect-square transition duration-300 group-hover:bg-skillmea-green-200/50 text-corporate">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="size-8">
  <path d="m7 11 2-2-2-2"></path>
  <path d="M11 13h4"></path>
  <rect width="18" height="18" x="3" y="3" rx="2" ry="2"></rect>
</svg>

              </div>
              <div x-show="sidebarOpen" class="transition will-change-transform w-full duration-300 group-hover:translate-x-1 line-clamp-1">
                Programovanie
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Programovanie
                </span>
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Programovanie
                </span>
              </div>

</a>
              <div @click="submenuOpen = !submenuOpen" x-show="sidebarOpen"  :class="{'rotate-180' : submenuOpen }" class="ml-auto transition-all duration-300 w-8 h-8 flex-none text-corporate flex items-center justify-center bg-skillmea-green-200 rounded-lg" >
                <span x-show="!submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor">
  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path>
</svg>
</span>
                <span x-show="submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4">
  <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 12h-15"></path>
</svg>

</span>
              </div>
          </div>

          <div x-show="submenuOpen && sidebarOpen" x-collapse>
            <div class="text-sm text-slate-500 overflow-hidden">
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/front-end">Front-end</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/back-end">Back-end</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/mobile">Mobile</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/data-science">Data Science</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/testovanie">Testovanie softwaru</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/javascript">JavaScript</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/java">Java</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/c-sharp-c-plus-plus">C# a C++</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/python">Python</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/devops">DevOps</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/machine-learning-ai">Machine Learning a AI</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/game-development">Game Development</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/no-code">No-Code</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/linux-servery">Linux a Servery</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/security">Security</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/programovanie-pre-deti">Pre deti</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/devtools">DevTools</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/databazy">Databázy</a>
            </div>
          </div>
      </div>
      <div x-data="{submenuOpen: false}">
          <div class="flex items-center gap-4">
            <a class="flex items-center gap-4 group w-full relative" data-turbo-frame="_top" href="/online-kurzy/online/dizajn-video">
              <div class="category-icon flex-none flex items-center justify-center w-14 rounded-lg aspect-square transition duration-300 group-hover:bg-skillmea-green-200/50 text-corporate">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="size-8">
  <path d="M12.05 6.25 L12.05 12.02 M3.85 10.2 C3.85 5.67 7.51 2 12.05 2 C16.58 2 20.25 5.67 20.25 10.2 M10.02 17.01 L14.07 17.01 C14.52 17.01 14.88 17.38 14.88 17.82 L14.88 21.19 C14.88 21.64 14.52 22 14.07 22 L10.02 22 C9.58 22 9.21 21.64 9.21 21.19 L9.21 17.82 C9.21 17.38 9.58 17.01 10.02 17.01 Z M15.91 12.75 C15.62 13.5 13.74 15.35 13.67 16.88 C13.67 16.91 13.64 16.92 13.62 16.92 C12.38 16.92 11.65 16.93 10.29 16.93 C10.26 15.06 8.48 13.51 8.18 12.73 L11.97 5.63 L15.91 12.75 Z M2.08 10.49 L5.59 10.49 L5.59 13.99 L2.08 13.99 L2.08 10.49 Z M18.41 10.49 L21.92 10.49 L21.92 13.99 L18.41 13.99 L18.41 10.49 Z"></path>
</svg>

              </div>
              <div x-show="sidebarOpen" class="transition will-change-transform w-full duration-300 group-hover:translate-x-1 line-clamp-1">
                Dizajn a Video
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Dizajn a Video
                </span>
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Dizajn a Video
                </span>
              </div>

</a>
              <div @click="submenuOpen = !submenuOpen" x-show="sidebarOpen"  :class="{'rotate-180' : submenuOpen }" class="ml-auto transition-all duration-300 w-8 h-8 flex-none text-corporate flex items-center justify-center bg-skillmea-green-200 rounded-lg" >
                <span x-show="!submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor">
  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path>
</svg>
</span>
                <span x-show="submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4">
  <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 12h-15"></path>
</svg>

</span>
              </div>
          </div>

          <div x-show="submenuOpen && sidebarOpen" x-collapse>
            <div class="text-sm text-slate-500 overflow-hidden">
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/grafika-design">Grafika a dizajn</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/ui-ux-design">UI/UX Design</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/3d-grafika-animacie">3D grafika a animácie</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/video">Video</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/foto">Foto</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/adobe">Adobe</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/figma">Figma</a>
            </div>
          </div>
      </div>
      <div x-data="{submenuOpen: false}">
          <div class="flex items-center gap-4">
            <a class="flex items-center gap-4 group w-full relative" data-turbo-frame="_top" href="/online-kurzy/online/marketing">
              <div class="category-icon flex-none flex items-center justify-center w-14 rounded-lg aspect-square transition duration-300 group-hover:bg-skillmea-green-200/50 text-corporate">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="size-8">
  <path d="M19.28 9.38 C19.74 10.46 19.98 11.64 19.98 12.88 C19.98 17.86 15.96 21.88 10.99 21.88 C6.02 21.88 2 17.86 2 12.88 C2 7.91 6.02 3.89 11 3.89 C12.13 3.89 13.22 4.1 14.22 4.48 M15.58 12.88 C15.58 15.41 13.53 17.47 11 17.47 C8.46 17.47 6.41 15.41 6.41 12.88 C6.41 10.35 8.46 8.3 11 8.3 M11.56 12.29 L18.23 5.82 L19.41 2.12 L22 4.7 L18.41 5.78"></path>
</svg>

              </div>
              <div x-show="sidebarOpen" class="transition will-change-transform w-full duration-300 group-hover:translate-x-1 line-clamp-1">
                Marketing
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Marketing
                </span>
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Marketing
                </span>
              </div>

</a>
              <div @click="submenuOpen = !submenuOpen" x-show="sidebarOpen"  :class="{'rotate-180' : submenuOpen }" class="ml-auto transition-all duration-300 w-8 h-8 flex-none text-corporate flex items-center justify-center bg-skillmea-green-200 rounded-lg" >
                <span x-show="!submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor">
  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path>
</svg>
</span>
                <span x-show="submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4">
  <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 12h-15"></path>
</svg>

</span>
              </div>
          </div>

          <div x-show="submenuOpen && sidebarOpen" x-collapse>
            <div class="text-sm text-slate-500 overflow-hidden">
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/digitalny-marketing">Digitálny marketing</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/ppc-performance">PPC a performance marketing</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/seo">SEO</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/social-media">Social media &amp; Community</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/pr">PR</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/influencer">Influencer</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/e-commerce">e-Commerce</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/analytika-reporting">Analytika &amp; Reporting</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/branding">Branding</a>
            </div>
          </div>
      </div>
      <div x-data="{submenuOpen: false}">
          <div class="flex items-center gap-4">
            <a class="flex items-center gap-4 group w-full relative" data-turbo-frame="_top" href="/online-kurzy/online/podnikanie-financie">
              <div class="category-icon flex-none flex items-center justify-center w-14 rounded-lg aspect-square transition duration-300 group-hover:bg-skillmea-green-200/50 text-corporate">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="size-8">
  <path d="M6 12 L6.01 12 M18 12 L18.01 12 M4 6 L20 6 C21.1 6 22 6.9 22 8 L22 16 C22 17.1 21.1 18 20 18 L4 18 C2.9 18 2 17.1 2 16 L2 8 C2 6.9 2.9 6 4 6 Z M14 12 C14 13.11 13.1 14 12 14 C10.9 14 10 13.11 10 12 C10 10.9 10.9 10 12 10 C13.1 10 14 10.9 14 12 Z"></path>
</svg>

              </div>
              <div x-show="sidebarOpen" class="transition will-change-transform w-full duration-300 group-hover:translate-x-1 line-clamp-1">
                Business &amp; Finance
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Business &amp; Finance
                </span>
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Business &amp; Finance
                </span>
              </div>

</a>
              <div @click="submenuOpen = !submenuOpen" x-show="sidebarOpen"  :class="{'rotate-180' : submenuOpen }" class="ml-auto transition-all duration-300 w-8 h-8 flex-none text-corporate flex items-center justify-center bg-skillmea-green-200 rounded-lg" >
                <span x-show="!submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor">
  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path>
</svg>
</span>
                <span x-show="submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4">
  <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 12h-15"></path>
</svg>

</span>
              </div>
          </div>

          <div x-show="submenuOpen && sidebarOpen" x-collapse>
            <div class="text-sm text-slate-500 overflow-hidden">
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/hr">HR</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/management">Management</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/projektovy-management">Projektový management</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/obchod">Obchod</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/business-intelligence">Business Intelligence</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/financie">Financie</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/uctovnictvo-dane">Účtovníctvo a dane</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/pravo">Právo</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/podnikanie">Podnikanie</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/customer-success">Customer Success</a>
            </div>
          </div>
      </div>
      <div x-data="{submenuOpen: false}">
          <div class="flex items-center gap-4">
            <a class="flex items-center gap-4 group w-full relative" data-turbo-frame="_top" href="/online-kurzy/online/office">
              <div class="category-icon flex-none flex items-center justify-center w-14 rounded-lg aspect-square transition duration-300 group-hover:bg-skillmea-green-200/50 text-corporate">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="size-8">
  <path d="M3.58 16.48 L3.58 6.95 C3.58 6.48 3.86 6.06 4.29 5.89 L13.99 2.08 C14.22 1.99 14.48 1.97 14.73 2.05 L19.62 3.52 C20.1 3.67 20.42 4.11 20.42 4.61 L20.42 19.23 C20.42 19.72 20.11 20.15 19.65 20.3 L14.58 22 L6.33 19.25 L13.78 18.63 C14.37 18.59 14.82 18.1 14.82 17.51 L14.82 7.62 C14.82 6.85 14.07 6.31 13.34 6.55 L7.91 8.33 C7.44 8.48 7.13 8.92 7.13 9.41 L7.13 14.88 L3.58 16.48 Z"></path>
</svg>

              </div>
              <div x-show="sidebarOpen" class="transition will-change-transform w-full duration-300 group-hover:translate-x-1 line-clamp-1">
                Office
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Office
                </span>
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Office
                </span>
              </div>

</a>
              <div @click="submenuOpen = !submenuOpen" x-show="sidebarOpen"  :class="{'rotate-180' : submenuOpen }" class="ml-auto transition-all duration-300 w-8 h-8 flex-none text-corporate flex items-center justify-center bg-skillmea-green-200 rounded-lg" >
                <span x-show="!submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor">
  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path>
</svg>
</span>
                <span x-show="submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4">
  <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 12h-15"></path>
</svg>

</span>
              </div>
          </div>

          <div x-show="submenuOpen && sidebarOpen" x-collapse>
            <div class="text-sm text-slate-500 overflow-hidden">
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/ms-office">Microsoft Office</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/google-apps">Google Apps</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/online-n%C3%A1stroje">Online nástroje</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/excel">Excel</a>
            </div>
          </div>
      </div>
      <div x-data="{submenuOpen: false}">
          <div class="flex items-center gap-4">
            <a class="flex items-center gap-4 group w-full relative" data-turbo-frame="_top" href="/online-kurzy/online/sebarozvoj">
              <div class="category-icon flex-none flex items-center justify-center w-14 rounded-lg aspect-square transition duration-300 group-hover:bg-skillmea-green-200/50 text-corporate">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="size-8">
  <path d="M12 18 L12 5 M12 18 C12 18.55 12.11 19.09 12.33 19.59 C12.55 20.09 12.87 20.54 13.27 20.92 C13.67 21.29 14.14 21.58 14.65 21.76 C15.17 21.95 15.71 22.03 16.26 21.99 C16.8 21.95 17.34 21.81 17.82 21.56 C18.31 21.31 18.74 20.96 19.09 20.54 C19.44 20.12 19.69 19.63 19.84 19.1 C20 18.58 20.04 18.03 19.97 17.49 M12 18 C12 18.55 11.89 19.09 11.67 19.59 C11.45 20.09 11.13 20.54 10.73 20.92 C10.33 21.29 9.86 21.58 9.35 21.76 C8.83 21.95 8.29 22.03 7.74 21.99 C7.2 21.95 6.66 21.81 6.18 21.56 C5.69 21.31 5.26 20.96 4.91 20.54 C4.56 20.12 4.31 19.63 4.16 19.1 C4 18.58 3.96 18.03 4.03 17.49 M12 5 C12 4.54 12.11 4.09 12.31 3.68 C12.51 3.26 12.81 2.9 13.17 2.62 C13.54 2.34 13.96 2.15 14.41 2.06 C14.87 1.97 15.33 1.99 15.78 2.1 C16.22 2.22 16.63 2.44 16.98 2.75 C17.32 3.05 17.6 3.43 17.77 3.85 C17.95 4.28 18.02 4.74 17.99 5.2 C17.96 5.66 17.83 6.1 17.6 6.5 M12 5 C12 4.54 11.89 4.09 11.69 3.68 C11.49 3.26 11.19 2.9 10.83 2.62 C10.46 2.34 10.04 2.15 9.59 2.06 C9.13 1.97 8.67 1.99 8.22 2.1 C7.78 2.22 7.37 2.44 7.02 2.75 C6.68 3.05 6.4 3.43 6.23 3.85 C6.05 4.28 5.98 4.74 6.01 5.2 C6.04 5.66 6.17 6.1 6.4 6.5 M15 13 C14.13 12.75 13.37 12.22 12.83 11.5 C12.29 10.78 12 9.9 12 9 C12 9.9 11.71 10.78 11.17 11.5 C10.63 12.22 9.87 12.75 9 13 M18 5.13 C18.58 5.28 19.13 5.56 19.59 5.95 C20.06 6.35 20.42 6.84 20.67 7.4 C20.91 7.95 21.02 8.56 21 9.16 C20.97 9.77 20.81 10.36 20.52 10.9 M18 18 C18.88 18 19.74 17.71 20.44 17.18 C21.13 16.64 21.64 15.89 21.86 15.04 C22.09 14.19 22.03 13.29 21.7 12.47 C21.36 11.66 20.76 10.98 20 10.54 M6 18 C5.12 18 4.26 17.71 3.56 17.18 C2.87 16.64 2.36 15.89 2.14 15.04 C1.91 14.19 1.97 13.29 2.3 12.47 C2.64 11.66 3.24 10.98 4 10.54 M6 5.13 C5.42 5.28 4.87 5.56 4.41 5.95 C3.94 6.35 3.58 6.84 3.33 7.4 C3.09 7.95 2.98 8.56 3 9.16 C3.03 9.77 3.19 10.36 3.48 10.9"></path>
</svg>

              </div>
              <div x-show="sidebarOpen" class="transition will-change-transform w-full duration-300 group-hover:translate-x-1 line-clamp-1">
                Sebarozvoj
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Sebarozvoj
                </span>
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Sebarozvoj
                </span>
              </div>

</a>
              <div @click="submenuOpen = !submenuOpen" x-show="sidebarOpen"  :class="{'rotate-180' : submenuOpen }" class="ml-auto transition-all duration-300 w-8 h-8 flex-none text-corporate flex items-center justify-center bg-skillmea-green-200 rounded-lg" >
                <span x-show="!submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor">
  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path>
</svg>
</span>
                <span x-show="submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4">
  <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 12h-15"></path>
</svg>

</span>
              </div>
          </div>

          <div x-show="submenuOpen && sidebarOpen" x-collapse>
            <div class="text-sm text-slate-500 overflow-hidden">
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/leadership">Leadership</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/osobny-rozvoj">Osobný rozvoj</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/karierny-rozvoj">Kariérny rozvoj</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/zdravie-fitness">Zdravie &amp; Fitness</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/produktivita">Produktivita</a>
            </div>
          </div>
      </div>
      <div x-data="{submenuOpen: false}">
          <div class="flex items-center gap-4">
            <a class="flex items-center gap-4 group w-full relative" data-turbo-frame="_top" href="/online-kurzy/online/crypto">
              <div class="category-icon flex-none flex items-center justify-center w-14 rounded-lg aspect-square transition duration-300 group-hover:bg-skillmea-green-200/50 text-corporate">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="size-8">
  <path d="M12.18 19.86 C17.53 20.8 18.85 13.32 13.5 12.38 M12.18 19.86 L5.77 18.73 M12.18 19.86 L11.81 22 M9.22 11.62 L13.5 12.38 C18.85 13.32 20.17 5.84 14.82 4.89 L8.41 3.76 M14.82 4.89 L15.2 2.75 M7.53 21.25 L10.92 2"></path>
</svg>

              </div>
              <div x-show="sidebarOpen" class="transition will-change-transform w-full duration-300 group-hover:translate-x-1 line-clamp-1">
                Kryptomeny a blockchain
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Kryptomeny a blockchain
                </span>
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Kryptomeny a blockchain
                </span>
              </div>

</a>
          </div>

      </div>
      <div x-data="{submenuOpen: false}">
          <div class="flex items-center gap-4">
            <a class="flex items-center gap-4 group w-full relative" data-turbo-frame="_top" href="/online-kurzy/online/ai">
              <div class="category-icon flex-none flex items-center justify-center w-14 rounded-lg aspect-square transition duration-300 group-hover:bg-skillmea-green-200/50 text-corporate">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="size-8">
  <path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path>
  <path d="M20 2v4"></path>
  <path d="M22 4h-4"></path>
  <circle cx="4" cy="20" r="2"></circle>
</svg>

              </div>
              <div x-show="sidebarOpen" class="transition will-change-transform w-full duration-300 group-hover:translate-x-1 line-clamp-1">
                Umelá inteligencia (AI)
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Umelá inteligencia (AI)
                </span>
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Umelá inteligencia (AI)
                </span>
              </div>

</a>
          </div>

      </div>
      <div x-data="{submenuOpen: false}">
          <div class="flex items-center gap-4">
            <a class="flex items-center gap-4 group w-full relative" data-turbo-frame="_top" href="/online-kurzy/online/jazykove-kurzy">
              <div class="category-icon flex-none flex items-center justify-center w-14 rounded-lg aspect-square transition duration-300 group-hover:bg-skillmea-green-200/50 text-corporate">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="size-8">
  <path d="M5 8 L11 14 M4 14 L10 8 L12 5 M2 5 L14 5 M7 2 L8 2 M22 22 L17 12 L12 22 M14 18 L20 18"></path>
</svg>

              </div>
              <div x-show="sidebarOpen" class="transition will-change-transform w-full duration-300 group-hover:translate-x-1 line-clamp-1">
                Jazyky
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Jazyky
                </span>
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Jazyky
                </span>
              </div>

</a>
              <div @click="submenuOpen = !submenuOpen" x-show="sidebarOpen"  :class="{'rotate-180' : submenuOpen }" class="ml-auto transition-all duration-300 w-8 h-8 flex-none text-corporate flex items-center justify-center bg-skillmea-green-200 rounded-lg" >
                <span x-show="!submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor">
  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path>
</svg>
</span>
                <span x-show="submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4">
  <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 12h-15"></path>
</svg>

</span>
              </div>
          </div>

          <div x-show="submenuOpen && sidebarOpen" x-collapse>
            <div class="text-sm text-slate-500 overflow-hidden">
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/anglictina">Angličtina</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/nemcina">Nemčina</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/spanielcina">Španielčina</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/taliancina">Taliančina</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/francuzstina">Francúzština</a>
            </div>
          </div>
      </div>
      <div x-data="{submenuOpen: false}">
          <div class="flex items-center gap-4">
            <a class="flex items-center gap-4 group w-full relative" data-turbo-frame="_top" href="/online-kurzy/online/ine">
              <div class="category-icon flex-none flex items-center justify-center w-14 rounded-lg aspect-square transition duration-300 group-hover:bg-skillmea-green-200/50 text-corporate">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="size-8">
  <path d="M2 7 L2 17 M6 5 L6 19 M12 3 L20 3 C21.1 3 22 3.9 22 5 L22 19 C22 20.1 21.1 21 20 21 L12 21 C10.9 21 10 20.1 10 19 L10 5 C10 3.9 10.9 3 12 3 Z"></path>
</svg>

              </div>
              <div x-show="sidebarOpen" class="transition will-change-transform w-full duration-300 group-hover:translate-x-1 line-clamp-1">
                Iné
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Iné
                </span>
              </div>
              <div class="absolute -right-4 translate-x-full pointer-events-none">
                <span x-show="!sidebarOpen" class="block bg-white transition-all duration-300 rounded-lg relative text-sm pointer-events-none opacity-0 shadow-xl whitespace-nowrap -ml-4 group-hover:-ml-0 group-hover:opacity-100 p-3">
                  Iné
                </span>
              </div>

</a>
              <div @click="submenuOpen = !submenuOpen" x-show="sidebarOpen"  :class="{'rotate-180' : submenuOpen }" class="ml-auto transition-all duration-300 w-8 h-8 flex-none text-corporate flex items-center justify-center bg-skillmea-green-200 rounded-lg" >
                <span x-show="!submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewbox="0 0 24 24" stroke="currentColor">
  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path>
</svg>
</span>
                <span x-show="submenuOpen" ><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4">
  <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 12h-15"></path>
</svg>

</span>
              </div>
          </div>

          <div x-show="submenuOpen && sidebarOpen" x-collapse>
            <div class="text-sm text-slate-500 overflow-hidden">
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/pre-deti">Kids</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/pre-studentov">Pre študentov</a>
                <a class="flex items-center whitespace-nowrap will-change-transform h-8 pl-16 ml-2 transition duration-300 hover:translate-x-1 " data-turbo-frame="_top" href="/online-kurzy/online/zadarmo">Kurzy zadarmo</a>
            </div>
          </div>
      </div>
  </div>
</div>

</template></turbo-stream>