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

431 lines
18 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters
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.
<html lang="en" style="scroll-behavior: smooth;"><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 style="">
<!------ Header Area Start ----->
<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 ----->
<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>
</section>
<!------ Hero Area End ----->
<!------ Showcase Area Start ----->
<section class="showcase-area">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="section-title showcase-title">
<h2>We create <b>inspiring and meaningful <br> <span>communications </span> <br> </b> to move people.</h2>
</div>
</div>
</div>
</div>
<div class="showcase-slider">
<div class="slider-wrap" style="">
<div class="showcase-item" style="translate: none; rotate: none; scale: none; transform: rotate(3.43981deg); opacity: 1;">
<img src="assets/img/show-1.jpg" alt="">
</div>
<div class="showcase-item" style="translate: none; rotate: none; scale: none; transform: rotate(-4.78001deg); opacity: 1;">
<img src="assets/img/show-2.jpg" alt="">
</div>
<div class="showcase-item center" style="translate: none; rotate: none; scale: none; transform: rotate(-1.84983deg); opacity: 1;">
<img src="assets/img/show-3.jpg" alt="">
</div>
<div class="showcase-item" style="translate: none; rotate: none; scale: none; transform: rotate(1.70021deg); opacity: 1;">
<img src="assets/img/show-4.jpg" alt="">
</div>
<div class="showcase-item" style="translate: none; rotate: none; scale: none; transform: rotate(-7.74992deg); opacity: 1;">
<img src="assets/img/show-5.jpg" alt="">
</div>
</div>
<!---- showcase slider Mobile Version --->
<div class="showcase-gellary-wrap">
<div class="showcase-gellary owl-carousel owl-loaded owl-drag owl-hidden">
<div class="owl-stage-outer"><div class="owl-stage" style="transform: translate3d(-888px, 0px, 0px); transition: all; width: 4984px; padding-left: 50px; padding-right: 50px;"><div class="owl-item cloned" style="width: 429px; margin-right: 15px;"><img src="assets/img/show-3.jpg" alt=""></div><div class="owl-item cloned" style="width: 429px; margin-right: 15px;"><img src="assets/img/show-4.jpg" alt=""></div><div class="owl-item cloned" style="width: 429px; margin-right: 15px;"><img src="assets/img/show-5.jpg" alt=""></div><div class="owl-item" style="width: 429px; margin-right: 15px;"><img src="assets/img/show-1.jpg" alt=""></div><div class="owl-item active" style="width: 429px; margin-right: 15px;"><img src="assets/img/show-2.jpg" alt=""></div><div class="owl-item" style="width: 429px; margin-right: 15px;"><img src="assets/img/show-3.jpg" alt=""></div><div class="owl-item" style="width: 429px; margin-right: 15px;"><img src="assets/img/show-4.jpg" alt=""></div><div class="owl-item" style="width: 429px; margin-right: 15px;"><img src="assets/img/show-5.jpg" alt=""></div><div class="owl-item cloned" style="width: 429px; margin-right: 15px;"><img src="assets/img/show-1.jpg" alt=""></div><div class="owl-item cloned" style="width: 429px; margin-right: 15px;"><img src="assets/img/show-2.jpg" alt=""></div><div class="owl-item cloned" style="width: 429px; margin-right: 15px;"><img src="assets/img/show-3.jpg" alt=""></div></div></div><div class="owl-nav disabled"><button type="button" role="presentation" class="owl-prev"><span aria-label="Previous"></span></button><button type="button" role="presentation" class="owl-next"><span aria-label="Next"></span></button></div><div class="owl-dots disabled"></div></div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="btn-wrapper">
<a href="#" class="common-btn">Go to Showcase <span><img src="assets/img/arrow.svg" alt=""></span></a>
</div>
</div>
<div class="col-lg-12">
<div class="bottom-title">
<h4>Shiny awards <span>that followed </span><br> great work.</h4>
</div>
<div class="awards-wrap" style="translate: none; rotate: none; scale: none; transform: translate(0px, 50px); opacity: 0;">
<img src="assets/img/b-w-1.png" alt="">
<img src="assets/img/b-w-2.png" alt="">
<img src="assets/img/b-w-3.png" alt="">
<img src="assets/img/b-w-4.png" alt="">
<img src="assets/img/b-w-6.png" alt="">
<img src="assets/img/b-w-2.png" alt="">
</div>
</div>
</div>
</div>
</section>
<!------ Showcase Area End ----->
<!------ Brief Area Start ----->
<section class="brief-area">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<div class="brief-title">
<h2><b>Beyond</b> the Brief</h2>
</div>
</div>
</div>
</div>
<div class="team-slider">
<div class="team-track" style="translate: none; rotate: none; scale: none; transform: translate(0px, 0px);">
<div class="team-card">
<div class="card-thumb">
<img src="assets/img/team-1.jpg" alt="">
</div>
<div class="team-info">
<span>Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card">
<div class="card-thumb">
<img src="assets/img/team-2.jpg" alt="">
</div>
<div class="team-info">
<span>Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card">
<div class="card-thumb">
<img src="assets/img/team-3.jpg" alt="">
</div>
<div class="team-info">
<span>Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card">
<div class="card-thumb">
<img src="assets/img/team-5.jpg" alt="">
</div>
<div class="team-info">
<span>Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card">
<div class="card-thumb">
<img src="assets/img/team-6.jpg" alt="">
</div>
<div class="team-info">
<span>Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card">
<div class="card-thumb">
<img src="assets/img/team-7.jpg" alt="">
</div>
<div class="team-info">
<span>Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card">
<div class="card-thumb">
<img src="assets/img/team-1.jpg" alt="">
</div>
<div class="team-info">
<span>Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card">
<div class="card-thumb">
<img src="assets/img/team-2.jpg" alt="">
</div>
<div class="team-info">
<span>Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card">
<div class="card-thumb">
<img src="assets/img/team-3.jpg" alt="">
</div>
<div class="team-info">
<span>Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card">
<div class="card-thumb">
<img src="assets/img/team-5.jpg" alt="">
</div>
<div class="team-info">
<span>Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card">
<div class="card-thumb">
<img src="assets/img/team-6.jpg" alt="">
</div>
<div class="team-info">
<span>Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
<div class="team-card">
<div class="card-thumb">
<img src="assets/img/team-7.jpg" alt="">
</div>
<div class="team-info">
<span>Beer tasting in Vienna on the street in front bla bla card</span>
</div>
</div>
</div>
</div>
</section>
<!------ Brief Area End ----->
<!------ Brand Slider Area Start ----->
<section class="brand-slider-area">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-5 text-center">
<div class="brief-title">
<h2>Brands that <b>moved forward</b> with us. </h2>
</div>
</div>
</div>
</div>
<div class="infinite-slider">
<div class="slider-track" style="translate: none; rotate: none; scale: none; transform: translate3d(-724.3344px, 0px, 0px);">
<div class="brand-logo logo-squre"><img src="assets/img/brand-1.png" alt=""></div>
<div class="brand-logo logo-squre"><img src="assets/img/brand-2.png" alt=""></div>
<div class="brand-logo"><img src="assets/img/brand-3.png" alt=""></div>
<div class="brand-logo"><img src="assets/img/brand-4.png" alt=""></div>
<div class="brand-logo min-h"><img src="assets/img/brand-5.png" alt=""></div>
<div class="brand-logo min-h"><img src="assets/img/brand-6.png" alt=""></div>
<div class="brand-logo max-h"><img src="assets/img/brand-7.png" alt=""></div>
<div class="brand-logo logo-squre"><img src="assets/img/brand-1.png" alt=""></div>
<div class="brand-logo logo-squre"><img src="assets/img/brand-2.png" alt=""></div>
<div class="brand-logo"><img src="assets/img/brand-3.png" alt=""></div>
<div class="brand-logo"><img src="assets/img/brand-4.png" alt=""></div>
<div class="brand-logo min-h"><img src="assets/img/brand-5.png" alt=""></div>
<div class="brand-logo min-h"><img src="assets/img/brand-6.png" alt=""></div>
<div class="brand-logo max-h"><img src="assets/img/brand-7.png" alt=""></div>
</div>
</div>
</section>
<!------ Brand Slider Area End ----->
<!------ Branding Area Start ----->
<section class="branding-area branding-home">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<div class="brief-title">
<h2>We know what we're <br class="for-mobile"> <b>good at!</b></h2>
</div>
</div>
<div class="col-lg-12">
<div class="branding-wrapper">
<div class="branding-list">
<h2 data-img="assets/img/portfolio-1.jpg">BRANDING</h2>
<h2 data-img="assets/img/portfolio-2.jpg">ART DIRECTION</h2>
<h2 data-img="assets/img/portfolio-3.jpg">STRATEGY</h2>
<h2 data-img="assets/img/portfolio-4.jpg">IDENTITY</h2>
<h2 data-img="assets/img/portfolio-5.jpg">DIGITAL</h2>
</div>
<div class="hover-image">
<img src="" alt="">
</div>
</div>
</div>
</div>
</div>
</section>
<!------ Branding 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>Ready to move forward? <br> <span>Lets talk!</span></h2>
</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.svg" alt=""></span></a>
</div>
</div>
</div>
</div>
</section>
<!------ CTA Area End ----->
<!------ Footer Area Start ----->
<footer>
<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="tell: +386 2 620 98 77">+386 2 620 98 77&nbsp;</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 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">
<p>aritmija d.o.o. All rights reserved.</p>
<p>Cookies. Splošni pogoji.</p>
</div>
</div>
</div>
</div>
</footer>
<!------ Footer Area End ----->
<!-- Bootstrap Bundle with Popper -->
<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://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/ScrollTrigger.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/gsap@3/dist/Draggable.min.js"></script>
<script src="assets/js/main.js"></script>
</body></html>