Files
aritmija/aritmija_devTemplate/v3/index.html
2026-05-13 17:11:09 +02:00

545 lines
20 KiB
HTML
Raw Permalink Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="icon" type="image/x-icon" href="assets/img/love.svg">
<link rel="stylesheet" href="assets/css/bootstrap.min.css" />
<link rel="stylesheet" href="assets/css/owl.carousel.min.css" />
<link rel="stylesheet" href="assets/css/owl.theme.default.min.css" />
<link rel="stylesheet" href="assets/css/style.css" />
<link rel="stylesheet" href="assets/css/responsive.css" />
<title>Home</title>
</head>
<body>
<div class="page-reveal"></div>
<!------ Header Area Start ----->
<header class="header">
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<nav class="header-wrapper nav-desktop">
<a href="index.html">Home</a>
<a href="work.html">Work</a>
<div class="site-logo">
<a href="index.html"><img src="assets/img/logo.svg" alt=""></a>
</div>
<a href="about.html">About</a>
<a href="contact.html">Contact</a>
</nav>
<!-- Mobile Menu -->
<div class="mobile-nav">
<div class="love-sm">
<a href="#"><img src="assets/img/love.svg" alt=""></a>
</div>
<div class="logo-sm">
<a href="index.html"><img src="assets/img/logo.svg" alt=""></a>
</div>
<div class="menu-trigger">
<span></span>
<span></span>
</div>
</div>
<!-- Mobile Menu -->
</div>
</div>
</div>
</header>
<!------ Header Area End ----->
<!------ Slide Mobile Menu Area Start ----->
<div class="slide-menu">
<div class="menu-close">
<span></span>
<span></span>
</div>
<div class="menu_item">
<ul>
<li class="active"><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="work.html">Work</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
<div class="info-bottom">
<span>En</span>
<img src="assets/img/love.svg" alt="">
<span>Sl</span>
</div>
</div>
<!------ Slide Mobile Menu Area End ----->
<!------ Hero Area Start ----->
<!------ Hero Area End ----->
<section class="about-area_home">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<div class="about-title-wrap5">
<h2>Strateško-kreativni studio za <span class="pink-text2">znamke</span>, ki ne želijo biti povprečne.</h2>
</div>
</div>
</div>
</div>
</div>
</section>
<!------ Showcase Area Start ----->
<section class="showcase-area">
<div class="portfolio-slider-wrap">
<div class="portfolio-slider">
<a href="#" class="portfolio-slide klasik-sirina">
<img src="assets/img/show-1.jpg" alt="">
<span class="portfolio-slide-link">Golden Drum 2025</span>
</a>
<a href="#" class="portfolio-slide ozki-sirina">
<img src="assets/img/show-2.jpg" alt="">
<span class="portfolio-slide-link">Golden Drum 2025</span>
</a>
<a href="#" class="portfolio-slide klasik-sirina">
<video autoplay muted loop playsinline>
<source src="assets/video/hero.mp4" type="video/mp4">
</video>
<span class="portfolio-slide-link">Golden Drum 2025</span>
</a>
<a href="#" class="portfolio-slide mini-sirina">
<img src="assets/img/show-4.jpg" alt="">
<span class="portfolio-slide-link">Golden Drum 2025</span>
</a>
<a href="#" class="portfolio-slide siroki-sirina">
<img src="assets/img/show-5.jpg" alt="">
<span class="portfolio-slide-link">Golden Drum 2025</span>
</a>
</div>
</div>
</section>
<!------ Showcase Area End ----->
<!------ Opis storitev ----->
<section class="about-area_home about_area_home2">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="about-title-wrap5">
<div class="kakodelamo-title">
Ne delamo vsega.<br>
Zato se lahko bolj poglobimo v tisto, kar delamo najbolje.
</div>
<div class="services-story-mobile-wrap">
<div class="services-word-cloud">
<img class="mobile-service-preview" src="" alt="">
<div class="service-word">
<img src="assets/img/portfolio-1.jpg" alt="">
<span>Strategije</span>
</div>
<div class="service-word">
<img src="assets/img/portfolio-2.jpg" alt="">
<span>Znamčenje</span>
</div>
<div class="service-word">
<img src="assets/img/portfolio-3.jpg" alt="">
<span>Identitete</span>
</div>
<div class="service-word">
<img src="assets/img/portfolio-4.jpg" alt="">
<span>Komunikacije</span>
</div>
<div class="service-word">
<img src="assets/img/portfolio-5.jpg" alt="">
<span>Embalaže</span>
</div>
<div class="service-word">
<img src="assets/img/show-1.jpg" alt="">
<span>Oblikovanje</span>
</div>
<div class="service-word">
<img src="assets/img/show-2.jpg" alt="">
<span>Digital</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!------ video ----->
<section class="hero-area">
<div class="video-hero">
<video class="hero-video" autoplay muted loop playsinline>
<source src="assets/video/hero.mp4" type="video/mp4">
</video>
</div>
<a href="#" class="lets-talk-btn">Lets talk</a>
<div class="language-action">
<ul>
<li><button class="active">EN</button></li>
<li><button>SL</button></li>
</ul>
</div>
</section>
<!------ kako delamo ----->
<section class="working-together-area4">
<div class="container">
<div class="row align-items-end">
<div class="kakodelamo-title">Kako delamo</div>
<div class="col-lg-12">
<div class="together-content together-content3">
<h2>Navdih brez temeljev hitro zbledi, temelji brez navdiha pa nič ne premaknejo. Zato vedno združimo oboje.</h2>
<div class="kakodelamo-opis kakodelamo-opis5"><a href="#" class="common-btn">Več o nas <span><img src="assets/img/arrow_white3.svg" alt=""></span></a></div>
</div>
</div>
<div class="col-lg-12">
<div class="together-content2">
<h2>Navijamo za ambiciozne ekipe.  Za tiste, ki čutijo, da njihova znamka zmore več.</h2>
<div class="kakodelamo-opis2 kakodelamo-opis5"><a href="#" class="common-btn">Pišite nam <span><img src="assets/img/arrow_white3.svg" alt=""></span></a></div>
</div>
</div>
</div>
</div>
</section>
<!------ Brand Slider Area Start MOBILE VERSION ----->
<section class="about-area2">
<div class="awards-cursor-flair">
<img class="flair" src="assets/img/brand-2.png" alt="" style="translate: none; rotate: none; scale: none; transform: translate(-50%, -50%) translate3d(0px, 44.0962px, 0px) rotate(-360deg); top: 552px; left: 538px; opacity: 0;">
<img class="flair" src="assets/img/brand-2.png" alt="" style="translate: none; rotate: none; scale: none; transform: translate(-50%, -50%) translate3d(0px, 34.1137px, 0px) rotate(357.5794deg); top: 441px; left: 462px; opacity: 0;">
<img class="flair" src="assets/img/brand-2.png" alt="" style="translate: none; rotate: none; scale: none; transform: translate(-50%, -50%) translate3d(0px, 25.5799px, 0px) rotate(-350.0798deg); top: 334px; left: 426px; opacity: 0;">
<img class="flair" src="assets/img/brand-2.png" alt="" style="opacity: 0;">
<img class="flair" src="assets/img/brand-2.png" alt="" style="opacity: 0;">
<img class="flair" src="assets/img/brand-2.png" alt="" style="opacity: 0;">
<img class="flair" src="assets/img/brand-2.png" alt="" style="opacity: 0;">
<img class="flair" src="assets/img/brand-2.png" alt="" style="opacity: 0;">
</div>
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<div class="brief-title">
<div class="blagovne-title nagrade-title">Nagrade niso naš cilj. So pa priznanje delu,&nbsp;v katerega smo vložili dušo in srce.</div>
</div>
</div>
</div>
</div>
<div class="awards-cloud">
<span class="award-item">SOF <sup>15</sup></span>
<span class="award-item">Outstanding <sup>5</sup></span>
<span class="award-item">Golden Drum <sup>1</sup></span>
<span class="award-item">Packaging of the world <sup>1</sup></span>
<span class="award-item">Sporto <sup>1</sup></span>
<span class="award-item blue">ADC*E <sup>1</sup></span>
<span class="award-item">White square <sup>1</sup></span>
<span class="award-item">Brumen <sup>5</sup></span>
</div>
</section>
<!------ Brand Slider Area End ----->
<!------ Brief Area Start ----->
<section class="brief-area3 light">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<div class="brief-title3">
<h2>Začutite naš utrip.</h2>
</div>
</div>
</div>
</div>
<div class="team-slider">
<div class="team-track" style="translate: none; rotate: none; scale: none; transform: translate3d(-426.92px, 0px, 0px); touch-action: pan-y; cursor: grab; -webkit-user-select: none;">
<div class="team-card" style="touch-action: pan-y;">
<div class="card-thumb" style="touch-action: pan-y;">
<img src="assets/img/team-1.jpg" alt="" style="touch-action: pan-y;">
</div>
<div class="team-info" style="touch-action: pan-y;">
<span style="touch-action: pan-y;">Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card" style="touch-action: pan-y;">
<div class="card-thumb" style="touch-action: pan-y;">
<img src="assets/img/team-2.jpg" alt="" style="touch-action: pan-y;">
</div>
<div class="team-info" style="touch-action: pan-y;">
<span style="touch-action: pan-y;">Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card" style="touch-action: pan-y; translate: none; rotate: none; scale: none; transform: rotate(-0.99986deg);">
<div class="card-thumb" style="touch-action: pan-y;">
<img src="assets/img/team-3.jpg" alt="" style="touch-action: pan-y;">
</div>
<div class="team-info" style="touch-action: pan-y;">
<span style="touch-action: pan-y;">Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card" style="touch-action: pan-y;">
<div class="card-thumb" style="touch-action: pan-y;">
<img src="assets/img/team-5.jpg" alt="" style="touch-action: pan-y;">
</div>
<div class="team-info" style="touch-action: pan-y;">
<span style="touch-action: pan-y;">Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card" style="touch-action: pan-y;">
<div class="card-thumb" style="touch-action: pan-y;">
<img src="assets/img/team-6.jpg" alt="" style="touch-action: pan-y;">
</div>
<div class="team-info" style="touch-action: pan-y;">
<span style="touch-action: pan-y;">Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card" style="touch-action: pan-y;">
<div class="card-thumb" style="touch-action: pan-y;">
<img src="assets/img/team-7.jpg" alt="" style="touch-action: pan-y;">
</div>
<div class="team-info" style="touch-action: pan-y;">
<span style="touch-action: pan-y;">Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card" style="touch-action: pan-y;">
<div class="card-thumb" style="touch-action: pan-y;">
<img src="assets/img/team-1.jpg" alt="" style="touch-action: pan-y;">
</div>
<div class="team-info" style="touch-action: pan-y;">
<span style="touch-action: pan-y;">Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card" style="touch-action: pan-y;">
<div class="card-thumb" style="touch-action: pan-y;">
<img src="assets/img/team-2.jpg" alt="" style="touch-action: pan-y;">
</div>
<div class="team-info" style="touch-action: pan-y;">
<span style="touch-action: pan-y;">Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card" style="touch-action: pan-y;">
<div class="card-thumb" style="touch-action: pan-y;">
<img src="assets/img/team-3.jpg" alt="" style="touch-action: pan-y;">
</div>
<div class="team-info" style="touch-action: pan-y;">
<span style="touch-action: pan-y;">Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card" style="touch-action: pan-y;">
<div class="card-thumb" style="touch-action: pan-y;">
<img src="assets/img/team-5.jpg" alt="" style="touch-action: pan-y;">
</div>
<div class="team-info" style="touch-action: pan-y;">
<span style="touch-action: pan-y;">Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card" style="touch-action: pan-y;">
<div class="card-thumb" style="touch-action: pan-y;">
<img src="assets/img/team-6.jpg" alt="" style="touch-action: pan-y;">
</div>
<div class="team-info" style="touch-action: pan-y;">
<span style="touch-action: pan-y;">Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card" style="touch-action: pan-y;">
<div class="card-thumb" style="touch-action: pan-y;">
<img src="assets/img/team-7.jpg" alt="" style="touch-action: pan-y;">
</div>
<div class="team-info" style="touch-action: pan-y;">
<span style="touch-action: pan-y;">Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
</div>
</div> <div class="row veonas">
<div class="col-lg-12 text-center">
<div class="cta-btn">
<a href="#" class="common-btn">Več o nas <span><img src="assets/img/arrow_black.svg" alt=""></span></a>
</div>
</div>
</div>
</section>
<!------ Brief Area End ----->
<!------ CTA Area Start ----->
<section class="cta-area">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-8 col-md-8">
<div class="cta-content">
<h2>Če imate občutek, da lahko vaša znamka naredi več — imate prav.</h2>
<h3>Pišite nam, da se spoznamo. Morda nastane dober projekt. Morda samo dober pogovor.</h3>
</div>
</div>
<div class="col-lg-4 col-md-4">
<div class="cta-btn">
<a href="#" class="common-btn">Lets talk <span><img src="assets/img/arrow_white3.svg" alt=""></span></a>
</div>
</div>
</div>
</div>
</section>
<!------ CTA Area End ----->
<!------ Footer Area Start ----->
<footer class="footer">
<svg preserveAspectRatio="none" id="footer-img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2278 683">
<defs>
<linearGradient id="grad-1" x1="0" y1="0" x2="2278" y2="683" gradientUnits="userSpaceOnUse">
<stop offset="0.2" stop-color="#121212"></stop>
<stop offset="0.8" stop-color="#121212"></stop>
</linearGradient>
</defs>
<path class="footer-svg" id="bouncy-path" fill="url(#grad-1)" d="M0-0.3C0-0.3,464,156,1139,156S2278-0.3,2278-0.3V683H0V-0.3z"/>
</svg>
<div class="container">
<div class="row">
<div class="col-xl-6 col-lg-5 col-md-5">
<div class="social-links">
<h4>Follow us on</h4>
<ul>
<li><a href="#"><img src="assets/img/fb.svg" alt=""></a></li>
<li><a href="#"><img src="assets/img/Instagram.svg" alt=""></a></li>
<li><a href="#"><img src="assets/img/Behance.svg" alt=""></a></li>
<li><a href="#"><img src="assets/img/Linkedin.svg" alt=""></a></li>
</ul>
</div>
</div>
<div class="col-xl-6 col-lg-7 col-md-7">
<div class="row">
<h4>Contact us</h4>
<div class="col-lg-6 col-md-6">
<div class="widget-links">
<div class="footer-info">
<ul>
<li><a href="mailto:office@aritmija.si">office@aritmija.si</a></li>
<li><a href="tel:+38626209877">+386 2 620 98 77 </a></li>
</ul>
</div>
</div>
</div>
<div class="col-lg-6 col-md-6">
<div class="widget-links">
<div class="footer-info">
<p>Cesta XIV. divizije 20a </p>
<p>Maribor, Slovenija</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="footer-love">
<img src="assets/img/love.svg" alt="">
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="copyright-wrap">
<div class="copyright-left">
<p>aritmija d.o.o. All rights reserved.</p>
</div>
<div class="copyright-center">
<p>Dobra motnja povprečnosti.</p>
</div>
<div class="copyright-right">
<p>Cookies. Splošni pogoji.</p>
</div>
</div>
</div>
</div>
</div>
</footer>
<!------ Footer Area End ----->
<!-- Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/lenis@1.3.13/dist/lenis.min.js"></script>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/Popper.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/owl.carousel.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/gsap@3/dist/Draggable.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/ScrollTrigger.min.js"></script>
<script src="https://unpkg.com/gsap@3/dist/MorphSVGPlugin.min.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>