Add new HTML templates and CSS styles: Introduced multiple HTML pages including demo templates, a README file, and a comprehensive Tailwind CSS stylesheet. Enhanced the overall design and structure of the web application.
This commit is contained in:
Ümit Tunç
@@ -0,0 +1,361 @@
|
||||
# Trunçgil - Modern & Multipurpose Tailwind CSS Template
|
||||
|
||||
Modern ve çok amaçlı bir HTML template koleksiyonu. Tailwind CSS kullanılarak geliştirilmiş, profesyonel ve responsive web siteleri için hazır bir şablon setidir.
|
||||
|
||||
## 📋 İçindekiler
|
||||
|
||||
- [Özellikler](#-özellikler)
|
||||
- [Demo Sayfaları](#-demo-sayfaları)
|
||||
- [Kurulum](#-kurulum)
|
||||
- [Yapı](#-yapı)
|
||||
- [Renk Şemaları](#-renk-şemaları)
|
||||
- [Yazı Tipleri](#-yazı-tipleri)
|
||||
- [Kullanım](#-kullanım)
|
||||
- [Dokümantasyon](#-dokümantasyon)
|
||||
- [Lisans](#-lisans)
|
||||
|
||||
## ✨ Özellikler
|
||||
|
||||
- 🎨 **Modern Tasarım**: Güncel ve profesyonel tasarım anlayışı
|
||||
- 📱 **Tam Responsive**: Tüm cihazlarda mükemmel görünüm
|
||||
- 🎯 **Çok Amaçlı**: Kurumsal, e-ticaret, blog, portfolio ve daha fazlası
|
||||
- ⚡ **Hızlı**: Optimize edilmiş kod ve performans
|
||||
- 🎭 **10 Farklı Renk Şeması**: Kolayca değiştirilebilir tema renkleri
|
||||
- 🔤 **4 Farklı Yazı Tipi**: Space Grotesk, THICCCBOI, Urbanist, DM
|
||||
- 🧩 **Hazır Bloklar**: Kolayca kullanılabilir UI bileşenleri
|
||||
- 📦 **Zengin İçerik**: 34 demo sayfası, blog, portfolio, e-ticaret ve daha fazlası
|
||||
|
||||
## 🎨 Demo Sayfaları
|
||||
|
||||
### Ana Sayfalar
|
||||
- `index.html` - Ana sayfa (Space Grotesk, Grape)
|
||||
- `onepage.html` - Tek sayfa versiyonu
|
||||
- `page-loader.html` - Yükleme animasyonlu sayfa
|
||||
|
||||
### Demo Sayfaları (34 Adet)
|
||||
- `demo1.html` - demo34.html arası çeşitli tasarım seçenekleri
|
||||
- Farklı yazı tipleri, renk şemaları ve düzenler
|
||||
|
||||
### Blog Sayfaları
|
||||
- `blog.html`, `blog2.html`, `blog3.html` - Blog listesi sayfaları
|
||||
- `blog-post.html`, `blog-post2.html`, `blog-post3.html` - Blog detay sayfaları
|
||||
|
||||
### Portfolio Sayfaları
|
||||
- `projects.html`, `projects2.html`, `projects3.html`, `projects4.html` - Proje listesi
|
||||
- `single-project.html`, `single-project2.html`, `single-project3.html`, `single-project4.html` - Proje detay
|
||||
|
||||
### Hizmet Sayfaları
|
||||
- `services.html`, `services2.html` - Hizmet sayfaları
|
||||
|
||||
### Hakkında Sayfaları
|
||||
- `about.html`, `about2.html` - Hakkında sayfaları
|
||||
|
||||
### İletişim Sayfaları
|
||||
- `contact.html`, `contact2.html`, `contact3.html` - İletişim formları
|
||||
|
||||
### Kariyer Sayfaları
|
||||
- `career.html`, `career2.html` - Kariyer sayfaları
|
||||
- `career-job.html` - İş ilanı detay
|
||||
|
||||
### E-Ticaret Sayfaları
|
||||
- `shop.html`, `shop2.html` - Ürün listesi
|
||||
- `shop-product.html` - Ürün detay
|
||||
- `shop-cart.html` - Sepet
|
||||
- `shop-checkout.html` - Ödeme
|
||||
|
||||
### Fiyatlandırma
|
||||
- `pricing.html` - Fiyatlandırma tabloları
|
||||
|
||||
### Kimlik Doğrulama
|
||||
- `signin.html`, `signin2.html` - Giriş sayfaları
|
||||
- `signup.html`, `signup2.html` - Kayıt sayfaları
|
||||
|
||||
### Diğer Sayfalar
|
||||
- `404.html` - Hata sayfası
|
||||
- `terms.html` - Kullanım koşulları
|
||||
|
||||
## 🚀 Kurulum
|
||||
|
||||
### Gereksinimler
|
||||
- Modern bir web tarayıcı
|
||||
- (Opsiyonel) Yerel sunucu (Live Server, XAMPP, WAMP, vb.)
|
||||
|
||||
### Adımlar
|
||||
|
||||
1. **Projeyi İndirin**
|
||||
```bash
|
||||
git clone <repository-url>
|
||||
cd templates
|
||||
```
|
||||
|
||||
2. **Dosyaları Açın**
|
||||
- Doğrudan tarayıcıda `index.html` dosyasını açabilirsiniz
|
||||
- Veya yerel sunucu kullanarak çalıştırabilirsiniz
|
||||
|
||||
3. **Yerel Sunucu ile Çalıştırma** (Önerilen)
|
||||
```bash
|
||||
# Python ile
|
||||
python -m http.server 8000
|
||||
|
||||
# Node.js ile (http-server)
|
||||
npx http-server
|
||||
|
||||
# PHP ile
|
||||
php -S localhost:8000
|
||||
```
|
||||
|
||||
4. **Tarayıcıda Açın**
|
||||
- `http://localhost:8000` adresine gidin
|
||||
|
||||
## 📁 Yapı
|
||||
|
||||
```
|
||||
templates/
|
||||
├── assets/
|
||||
│ ├── css/
|
||||
│ │ ├── colors/ # 10 farklı renk şeması
|
||||
│ │ │ ├── aqua.css
|
||||
│ │ │ ├── grape.css
|
||||
│ │ │ ├── leaf.css
|
||||
│ │ │ ├── navy.css
|
||||
│ │ │ ├── orange.css
|
||||
│ │ │ ├── pink.css
|
||||
│ │ │ ├── purple.css
|
||||
│ │ │ ├── sky.css
|
||||
│ │ │ ├── violet.css
|
||||
│ │ │ └── yellow.css
|
||||
│ │ ├── fonts/ # Yazı tipi tanımlamaları
|
||||
│ │ │ ├── dm.css
|
||||
│ │ │ ├── space.css
|
||||
│ │ │ ├── thicccboi.css
|
||||
│ │ │ └── urbanist.css
|
||||
│ │ ├── icon.css
|
||||
│ │ └── plugins.css
|
||||
│ ├── fonts/ # Web fontları
|
||||
│ │ ├── custom/
|
||||
│ │ ├── space/
|
||||
│ │ ├── thicccboi/
|
||||
│ │ ├── unicons/
|
||||
│ │ └── urbanist/
|
||||
│ ├── img/ # Görseller
|
||||
│ │ ├── avatars/
|
||||
│ │ ├── brands/
|
||||
│ │ ├── demos/
|
||||
│ │ ├── docs/
|
||||
│ │ ├── icons/
|
||||
│ │ ├── illustrations/
|
||||
│ │ ├── photos/
|
||||
│ │ └── svg/
|
||||
│ ├── js/
|
||||
│ │ ├── plugins.js
|
||||
│ │ └── theme.js
|
||||
│ └── media/ # Video ve medya dosyaları
|
||||
├── docs/ # Dokümantasyon
|
||||
│ ├── blocks/ # Hazır bloklar
|
||||
│ ├── elements/ # UI elementleri
|
||||
│ ├── styleguide/ # Stil kılavuzu
|
||||
│ ├── blog-post.html
|
||||
│ ├── changelog.html
|
||||
│ ├── credits.html
|
||||
│ ├── faq.html
|
||||
│ └── forms.html
|
||||
├── *.html # Ana sayfa dosyaları
|
||||
├── style.css # Ana stil dosyası
|
||||
└── README.md # Bu dosya
|
||||
```
|
||||
|
||||
## 🎨 Renk Şemaları
|
||||
|
||||
Template, 10 farklı renk şeması ile gelir:
|
||||
|
||||
1. **Aqua** - Mavi tonları
|
||||
2. **Grape** - Mor tonları
|
||||
3. **Leaf** - Yeşil tonları
|
||||
4. **Navy** - Lacivert tonları
|
||||
5. **Orange** - Turuncu tonları
|
||||
6. **Pink** - Pembe tonları
|
||||
7. **Purple** - Mor tonları
|
||||
8. **Sky** - Açık mavi tonları
|
||||
9. **Violet** - Eflatun tonları
|
||||
10. **Yellow** - Sarı tonları
|
||||
|
||||
### Renk Şeması Değiştirme
|
||||
|
||||
HTML dosyasının `<head>` bölümünde renk şemasını değiştirebilirsiniz:
|
||||
|
||||
```html
|
||||
<!-- Mevcut -->
|
||||
<link rel="stylesheet" href="assets/css/colors/grape.css">
|
||||
|
||||
<!-- Yeni renk şeması -->
|
||||
<link rel="stylesheet" href="assets/css/colors/aqua.css">
|
||||
```
|
||||
|
||||
## 🔤 Yazı Tipleri
|
||||
|
||||
Template, 4 farklı yazı tipi seçeneği sunar:
|
||||
|
||||
1. **Space Grotesk** - Modern ve okunabilir
|
||||
2. **THICCCBOI** - Kalın ve dikkat çekici
|
||||
3. **Urbanist** - Şehirli ve profesyonel
|
||||
4. **DM** - Minimal ve şık
|
||||
|
||||
### Yazı Tipi Değiştirme
|
||||
|
||||
HTML dosyasının `<head>` bölümünde yazı tipini değiştirebilirsiniz:
|
||||
|
||||
```html
|
||||
<!-- Mevcut -->
|
||||
<link rel="stylesheet" type="text/css" href="assets/css/fonts/space.css">
|
||||
|
||||
<!-- Yeni yazı tipi -->
|
||||
<link rel="stylesheet" type="text/css" href="assets/css/fonts/thicccboi.css">
|
||||
```
|
||||
|
||||
Ve `<body>` etiketine font sınıfı ekleyin:
|
||||
|
||||
```html
|
||||
<body class="font-THICCCBOI">
|
||||
```
|
||||
|
||||
## 💻 Kullanım
|
||||
|
||||
### 1. Sayfa Oluşturma
|
||||
|
||||
Mevcut demo sayfalarından birini kopyalayarak başlayabilirsiniz:
|
||||
|
||||
```bash
|
||||
cp demo1.html yeni-sayfa.html
|
||||
```
|
||||
|
||||
### 2. İçerik Düzenleme
|
||||
|
||||
HTML dosyasını düzenleyerek:
|
||||
- Başlıkları değiştirin
|
||||
- Metinleri güncelleyin
|
||||
- Görselleri değiştirin
|
||||
- Renk şemasını seçin
|
||||
|
||||
### 3. Hazır Blokları Kullanma
|
||||
|
||||
`docs/blocks/` klasöründeki hazır blokları sayfalarınıza ekleyebilirsiniz:
|
||||
- Hero bölümleri
|
||||
- Özellikler
|
||||
- Testimonials
|
||||
- Pricing
|
||||
- FAQ
|
||||
- Footer
|
||||
- vb.
|
||||
|
||||
### 4. UI Elementlerini Keşfetme
|
||||
|
||||
`docs/elements/` klasöründe tüm UI elementlerini bulabilirsiniz:
|
||||
- Butonlar
|
||||
- Form elemanları
|
||||
- Kartlar
|
||||
- Modals
|
||||
- Tabs
|
||||
- Accordion
|
||||
- vb.
|
||||
|
||||
## 📚 Dokümantasyon
|
||||
|
||||
Detaylı dokümantasyon için:
|
||||
|
||||
- `docs/index.html` - Genel bakış
|
||||
- `docs/changelog.html` - Değişiklik geçmişi
|
||||
- `docs/credits.html` - Krediler ve kaynaklar
|
||||
- `docs/faq.html` - Sık sorulan sorular
|
||||
- `docs/styleguide/` - Kapsamlı stil kılavuzu
|
||||
|
||||
### Hazır Bloklar
|
||||
|
||||
`docs/blocks/` klasöründe kullanıma hazır bölümler:
|
||||
- `about.html` - Hakkında bölümleri
|
||||
- `blog.html` - Blog bölümleri
|
||||
- `call-to-action.html` - CTA bölümleri
|
||||
- `clients.html` - Müşteri logoları
|
||||
- `contact.html` - İletişim formları
|
||||
- `facts.html` - İstatistikler
|
||||
- `faq.html` - SSS bölümleri
|
||||
- `features.html` - Özellikler
|
||||
- `footer.html` - Footer şablonları
|
||||
- `hero.html` - Hero bölümleri
|
||||
- `misc.html` - Çeşitli bölümler
|
||||
- `navbar.html` - Navigasyon menüleri
|
||||
- `portfolio.html` - Portfolio galerileri
|
||||
- `pricing.html` - Fiyatlandırma tabloları
|
||||
- `process.html` - Süreç adımları
|
||||
- `team.html` - Takım üyeleri
|
||||
- `testimonials.html` - Müşteri yorumları
|
||||
|
||||
### UI Elementleri
|
||||
|
||||
`docs/elements/` klasöründe detaylı örnekler:
|
||||
- Accordion, Alerts, Animations
|
||||
- Avatars, Backgrounds, Badges
|
||||
- Buttons, Cards, Carousels
|
||||
- Dividers, Form Elements
|
||||
- Image Hover, Image Mask
|
||||
- Lightbox, Modal, Pagination
|
||||
- Player, Progressbar, Shadows
|
||||
- Shapes, Tables, Tabs
|
||||
- Text Animations, Tooltips
|
||||
- Typography ve daha fazlası
|
||||
|
||||
## 🎯 Özelleştirme İpuçları
|
||||
|
||||
### Logo Değiştirme
|
||||
|
||||
```html
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/logo-dark.png" alt="Logo">
|
||||
</a>
|
||||
```
|
||||
|
||||
### Favicon Değiştirme
|
||||
|
||||
```html
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
```
|
||||
|
||||
### Meta Bilgileri
|
||||
|
||||
```html
|
||||
<meta name="description" content="Sitenizin açıklaması">
|
||||
<meta name="keywords" content="anahtar, kelimeler">
|
||||
<meta name="author" content="Yazar Adı">
|
||||
<title>Sayfa Başlığı</title>
|
||||
```
|
||||
|
||||
## 🌐 Tarayıcı Desteği
|
||||
|
||||
- Chrome (son 2 versiyon)
|
||||
- Firefox (son 2 versiyon)
|
||||
- Safari (son 2 versiyon)
|
||||
- Edge (son 2 versiyon)
|
||||
- Opera (son 2 versiyon)
|
||||
|
||||
## 📞 Destek
|
||||
|
||||
Sorularınız için:
|
||||
- Dokümantasyonu inceleyin: `docs/index.html`
|
||||
- FAQ sayfasını ziyaret edin: `docs/faq.html`
|
||||
- GitHub issues kullanın
|
||||
|
||||
## 📄 Lisans
|
||||
|
||||
Bu template, [elemis](https://themeforest.net/user/elemis) tarafından geliştirilmiştir.
|
||||
|
||||
## 🙏 Teşekkürler
|
||||
|
||||
- [Tailwind CSS](https://tailwindcss.com/)
|
||||
- [Unicons](https://iconscout.com/unicons)
|
||||
- Tüm açık kaynak kütüphaneler
|
||||
|
||||
---
|
||||
|
||||
**Not**: Bu template, modern web standartlarına uygun olarak geliştirilmiştir ve tüm cihazlarda mükemmel performans sağlar.
|
||||
|
||||
**Güncelleme**: Template, düzenli olarak güncellenmekte ve yeni özellikler eklenmektedir.
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,814 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/demo24 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 10:58:40 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="stylesheet" href="assets/css/colors/yellow.css">
|
||||
<link rel="preload" href="assets/css/fonts/urbanist.css" as="style" onload="this.rel='stylesheet'">
|
||||
<style>
|
||||
@media (min-width: 992px) {
|
||||
.navbar-nav>.nav-item>.nav-link {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.navbar-nav>.nav-item+.nav-item>.nav-link:before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 3px;
|
||||
height: 3px;
|
||||
top: 50%;
|
||||
left: -2px;
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
.filter:not(.basic-filter) ul li a.active,
|
||||
.filter:not(.basic-filter) ul li a:hover,
|
||||
.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
|
||||
color: #fab758 !important;
|
||||
}
|
||||
.navbar-stick:not(.navbar-dark) {
|
||||
box-shadow: 0 0 1.25rem rgba(30,34,40,.06) !important;
|
||||
background: rgba(255,255,255,.97) !important;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body class="onepage">
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-[rgba(246,247,249,1)] ">
|
||||
<nav class="navbar navbar-expand-lg extended extended-alt navbar-light !bg-[#ffffff]">
|
||||
<div class="container xl:!flex-col lg:!flex-col">
|
||||
<div class="topbar flex flex-row lg:!justify-center xl:!justify-center items-center">
|
||||
<div class="navbar-brand"><a href='index.html'><img src="assets/img/truncgil-yatay.svg" alt="image"></a></div>
|
||||
</div>
|
||||
<!-- /.flex -->
|
||||
<div class="navbar-collapse-wrapper bg-[rgba(255,255,255)] opacity-100 flex flex-row items-center justify-between">
|
||||
<div class="navbar-other w-full hidden lg:block xl:block">
|
||||
<nav class="nav social social-muted">
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-twitter before:content-['\ed59'] text-[1rem] !text-[#5daed5]"></i></a>
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] text-[1rem] !text-[#4470cf]"></i></a>
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] text-[1rem] !text-[#d53581]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item"><a class="nav-link scroll hover:!text-[#fab758] active" href="#home">Home</a></li>
|
||||
<li class="nav-item"><a class="nav-link scroll hover:!text-[#fab758]" href="#services">Services</a></li>
|
||||
<li class="nav-item"><a class="nav-link scroll hover:!text-[#fab758]" href="#portfolio">Portfolio</a></li>
|
||||
<li class="nav-item"><a class="nav-link scroll hover:!text-[#fab758]" href="#testimonials">Testimonials</a></li>
|
||||
<li class="nav-item"><a class="nav-link scroll hover:!text-[#fab758]" href="#about">About</a></li>
|
||||
<li class="nav-item"><a class="nav-link scroll hover:!text-[#fab758]" href="#pricing">Pricing</a></li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full flex">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item"><a class="nav-link hover:!text-[#fab758] focus:!text-[#fab758]" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-info"><i class="uil uil-info-circle before:content-['\eb99'] !text-[1.1rem]"></i></a></li>
|
||||
<li class="nav-item"><a class="nav-link hover:!text-[#fab758] focus:!text-[#fab758]" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-search"><i class="uil uil-search before:content-['\eca5'] !text-[1.1rem]"></i></a></li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse-wrapper -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
<!--/.modal -->
|
||||
<div class="offcanvas offcanvas-end text-inverse !text-[#cacaca] opacity-100" id="offcanvas-info" data-bs-scroll="true">
|
||||
<div class="offcanvas-header flex flex-row items-center justify-between p-[1.5rem]">
|
||||
<h3 class="!text-white xl:!text-[1.5rem] !text-[calc(1.275rem_+_0.3vw)] !leading-[1.4] !mb-0">Trunçgil</h3>
|
||||
<button type="button" class="btn-close btn-close-white !mr-[-0.5rem] m-0 p-0" data-bs-dismiss="offcanvas" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="offcanvas-body !pb-[1.5rem]">
|
||||
<div class="widget !mb-8">
|
||||
<p>Trunçgil is a multipurpose HTML5 template with various layouts which will be a great solution for your business.</p>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
<div class="widget !mb-8">
|
||||
<h4 class="widget-title !text-white !mb-[0.75rem] !text-[1rem] !tracking-[normal] font-semibold !leading-[1.45]">Contact Info</h4>
|
||||
<address class=" not-italic !leading-[inherit] !mb-[1rem]"> Moonshine St. 14/05 <br> Light City, London </address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#fab758]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
<div class="widget !mb-8">
|
||||
<h4 class="widget-title !text-white !mb-[0.75rem] !text-[1rem] !tracking-[normal] font-semibold !leading-[1.45]">Learn More</h4>
|
||||
<ul class="list-unstyled !pl-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#fab758]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#fab758]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#fab758]" href="#">Privacy Policy</a></li>
|
||||
<li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#fab758]" href="#">Contact Us</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
<div class="widget">
|
||||
<h4 class="widget-title !text-white !mb-[0.75rem] !text-[1rem] !tracking-[normal] font-semibold !leading-[1.45]">Follow Us</h4>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.offcanvas -->
|
||||
<div class="offcanvas offcanvas-top !bg-[#ffffff] " id="offcanvas-search" data-bs-scroll="true">
|
||||
<div class="container flex flex-row py-6">
|
||||
<form class=" search-form relative before:content-['\eca5'] before:block before:absolute before:-translate-y-2/4 before:text-[1rem] before:!text-[#343f52] before:z-[1] before:right-auto before:top-2/4 before:font-Unicons w-full before:left-0 focus:!outline-offset-0 ">
|
||||
<input id="search-form1" type="text" class="form-control text-[0.8rem] !shadow-none !pl-[1.75rem] !pr-[.75rem] border-0 bg-inherit m-0 block w-full font-medium !leading-[1.7] !text-[#60697b] px-4 py-[0.6rem] rounded-[0.4rem] focus:!outline-offset-0 " placeholder="Type keyword and hit enter">
|
||||
</form>
|
||||
<button type="button" class="btn-close leading-none !text-[#343f52] transition-all duration-[0.2s] ease-in-out p-0 border-0 motion-reduce:transition-none before:text-[1.05rem] before:content-['\ed3b'] before:w-[1.8rem] before:h-[1.8rem] before:leading-[1.8rem] before:shadow-none before:transition-[background] before:duration-[0.2s] before:ease-in-out before:!flex before:justify-center before:items-center before:m-0 before:p-0 before:rounded-[100%] hover:no-underline bg-inherit before:bg-[rgba(0,0,0,.08)] before:font-Unicons hover:before:bg-[rgba(0,0,0,.11)] " data-bs-dismiss="offcanvas" aria-label="Close"></button>
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.offcanvas -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section id="home">
|
||||
<div class="wrapper bg-[rgba(246,247,249,1)] overflow-hidden">
|
||||
<div class="container-fluid xl:!px-0 pt-6 pb-10">
|
||||
<div class="swiper-container swiper-auto relative z-10" data-margin="30" data-dots="true" data-nav="true" data-centered="true" data-loop="true" data-iteml-auto="true">
|
||||
<div class="swiper overflow-visible">
|
||||
<div class="swiper-wrapper">
|
||||
<div class="swiper-slide group">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/cf1.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="assets/img/photos/cf1.jpg" data-glightbox data-gallery="gallery-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide group">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/cf2.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="assets/img/photos/cf2.jpg" data-glightbox data-gallery="gallery-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide group">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/cf3.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="assets/img/photos/cf3.jpg" data-glightbox data-gallery="gallery-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide group">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/cf4.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="assets/img/photos/cf4.jpg" data-glightbox data-gallery="gallery-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide group">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/cf5.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="assets/img/photos/cf5.jpg" data-glightbox data-gallery="gallery-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide group">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/cf6.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="assets/img/photos/cf6.jpg" data-glightbox data-gallery="gallery-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
</div>
|
||||
<!--/.swiper-wrapper -->
|
||||
</div>
|
||||
<!-- /.swiper -->
|
||||
</div>
|
||||
<!-- /.swiper-container -->
|
||||
</div>
|
||||
<!-- /.cotnainer -->
|
||||
</div>
|
||||
<!-- /.overflow-hidden -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section id="services">
|
||||
<div class="wrapper bg-[rgba(246,247,249,1)] ">
|
||||
<div class="container py-[5rem] xl:!py-[7rem] lg:!py-[7rem] md:!py-[7rem]">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-0 lg:mx-0 !mt-[-50px] items-center">
|
||||
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:px-0 lg:px-0 !mt-[50px]">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] !text-center">
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] !mb-6">
|
||||
<figure class="card-img-top overlay overlay-1 group">
|
||||
<a href="#"><img class="max-w-full h-auto" src="assets/img/photos/fs4.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">View Gallery</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
<div class="card-body p-4">
|
||||
<h3 class="h4 !mb-0">Products</h3>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
<div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
|
||||
<figure class="card-img-top overlay overlay-1 group">
|
||||
<a href="#"><img class="max-w-full h-auto" src="assets/img/photos/fs6.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">View Gallery</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
<div class="card-body p-4">
|
||||
<h3 class="h4 !mb-0">Recipes</h3>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] xl:!mt-6 lg:!mt-6 md:!mt-6 !mb-6">
|
||||
<figure class="card-img-top overlay overlay-1 group">
|
||||
<a href="#"><img class="max-w-full h-auto" src="assets/img/photos/fs5.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">View Gallery</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
<div class="card-body p-4">
|
||||
<h3 class="h4 !mb-0">Restaurants</h3>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
<div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
|
||||
<figure class="card-img-top overlay overlay-1 group">
|
||||
<a href="#"><img class="max-w-full h-auto" src="assets/img/photos/fs7.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">View Gallery</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
<div class="card-body p-4">
|
||||
<h3 class="h4 !mb-0">Still Life</h3>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] xl:px-0 lg:px-0 !mt-[50px]">
|
||||
<h2 class="xl:!text-[1.7rem] !text-[calc(1.295rem_+_0.54vw)] !leading-[1.25] !font-semibold !mb-3">My Services</h2>
|
||||
<p class="lead !text-[1.1rem] !leading-[1.55] font-medium">I would like to give you a unique photography experience, capture your products with excellent composition and lighting skills.</p>
|
||||
<p>Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo. Nullam quis risus eget urna mollis ornare vel eu leo. Maecenas faucibus mollis elit interdum. Duis mollis, est non commodo luctus, nisi erat ligula mollis metus auctor fringilla.</p>
|
||||
<a href="#" class="btn btn-yellow !text-white !bg-[#fab758] border-[#fab758] hover:text-white hover:bg-[#fab758] hover:!border-[#fab758] active:text-white active:bg-[#fab758] active:border-[#fab758] disabled:text-white disabled:bg-[#fab758] disabled:border-[#fab758] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">More Details</a>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.wrapper -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<div class="wrapper image-wrapper bg-image bg-overlay !text-white !bg-fixed bg-no-repeat bg-[center_center] bg-cover relative z-0 before:content-[''] before:block before:absolute before:z-[1] before:w-full before:h-full before:left-0 before:top-0 before:bg-[rgba(30,34,40,.5)]" data-image-src="./assets/img/photos/bg34.jpg">
|
||||
<div class="container py-[6rem] xl:!py-[9rem] lg:!py-[9rem] md:!py-[9rem] !text-center">
|
||||
<h2 class="xl:!text-[2.5rem] !text-[calc(1.375rem_+_1.5vw)] !leading-[1.15] font-semibold !text-white !mb-0">I take photographs with <br class="hidden xl:block lg:block md:block"> creativity, concept & passion</h2>
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.wrapper -->
|
||||
<section id="portfolio">
|
||||
<div class="wrapper bg-[rgba(246,247,249,1)] ">
|
||||
<div class="container py-20 xl:!py-[7rem] lg:!py-[7rem] md:!py-[7rem] !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="lg:w-10/12 xl:w-8/12 xxl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !mb-8">
|
||||
<h2 class="xl:!text-[1.7rem] !text-[calc(1.295rem_+_0.54vw)] !leading-[1.25] !font-semibold !mb-3">My Selected Shots</h2>
|
||||
<p class="lead !text-[1.1rem] !leading-[1.55] font-medium">Photography is my passion and I love to turn ideas into beautiful things.</p>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
<div class="itemgrid grid-view projects-masonry">
|
||||
<div class="isotope-filter !relative z-[5] filter !mb-10">
|
||||
<ul class=" inline m-0 p-0 list-none">
|
||||
<li class="inline"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] cursor-pointer hover:!text-[#fab758] active" data-filter="*">All</a></li>
|
||||
<li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] cursor-pointer hover:!text-[#fab758]" data-filter=".foods">Foods</a></li>
|
||||
<li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] cursor-pointer hover:!text-[#fab758]" data-filter=".drinks">Drinks</a></li>
|
||||
<li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] cursor-pointer hover:!text-[#fab758]" data-filter=".events">Events</a></li>
|
||||
<li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] cursor-pointer hover:!text-[#fab758]" data-filter=".pastries">Pastries</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="flex flex-wrap mx-[-15px] md:mx-[-15px] !mt-[-30px] isotope">
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full drinks events">
|
||||
<figure class="overlay overlay-1 rounded group relative"><a class="relative block z-[3] cursor-pointer inset-0" href="assets/img/photos/pf1-full.jpg" data-glightbox data-gallery="shots-group"> <img src="assets/img/photos/pf1.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">Fringilla Nullam</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full events">
|
||||
<figure class="overlay overlay-1 rounded group relative"><a class="relative block z-[3] cursor-pointer inset-0" href="assets/img/photos/pf2-full.jpg" data-glightbox data-gallery="shots-group"> <img src="assets/img/photos/pf2.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">Ridiculus Parturient</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full drinks foods">
|
||||
<figure class="overlay overlay-1 rounded group relative"><a class="relative block z-[3] cursor-pointer inset-0" href="assets/img/photos/pf3-full.jpg" data-glightbox data-gallery="shots-group"> <img src="assets/img/photos/pf3.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">Ornare Ipsum</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full events">
|
||||
<figure class="overlay overlay-1 rounded group relative"><a class="relative block z-[3] cursor-pointer inset-0" href="assets/img/photos/pf4-full.jpg" data-glightbox data-gallery="shots-group"> <img src="assets/img/photos/pf4.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">Nullam Mollis</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full pastries events">
|
||||
<figure class="overlay overlay-1 rounded group relative"><a class="relative block z-[3] cursor-pointer inset-0" href="assets/img/photos/pf5-full.jpg" data-glightbox data-gallery="shots-group"> <img src="assets/img/photos/pf5.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">Euismod Risus</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full foods">
|
||||
<figure class="overlay overlay-1 rounded group relative"><a class="relative block z-[3] cursor-pointer inset-0" href="assets/img/photos/pf6-full.jpg" data-glightbox data-gallery="shots-group"> <img src="assets/img/photos/pf6.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">Ridiculus Tristique</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full foods drinks">
|
||||
<figure class="overlay overlay-1 rounded group relative"><a class="relative block z-[3] cursor-pointer inset-0" href="assets/img/photos/pf7-full.jpg" data-glightbox data-gallery="shots-group"> <img src="assets/img/photos/pf7.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">Sollicitudin Pharetra</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full pastries">
|
||||
<figure class="overlay overlay-1 rounded group relative"><a class="relative block z-[3] cursor-pointer inset-0" href="assets/img/photos/pf8-full.jpg" data-glightbox data-gallery="shots-group"> <img src="assets/img/photos/pf8.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">Tristique Venenatis</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full events">
|
||||
<figure class="overlay overlay-1 rounded group relative"><a class="relative block z-[3] cursor-pointer inset-0" href="assets/img/photos/pf9-full.jpg" data-glightbox data-gallery="shots-group"> <img src="assets/img/photos/pf9.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">Cursus Fusce</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full foods">
|
||||
<figure class="overlay overlay-1 rounded group relative"><a class="relative block z-[3] cursor-pointer inset-0" href="assets/img/photos/pf10-full.jpg" data-glightbox data-gallery="shots-group"> <img src="assets/img/photos/pf10.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">Consectetur Malesuada</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full drinks">
|
||||
<figure class="overlay overlay-1 rounded group relative"><a class="relative block z-[3] cursor-pointer inset-0" href="assets/img/photos/pf11-full.jpg" data-glightbox data-gallery="shots-group"> <img src="assets/img/photos/pf11.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">Ultricies Aenean</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full foods">
|
||||
<figure class="overlay overlay-1 rounded group relative"><a class="relative block z-[3] cursor-pointer inset-0" href="assets/img/photos/pf12-full.jpg" data-glightbox data-gallery="shots-group"> <img src="assets/img/photos/pf12.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">Pellentesque Commodo</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full drinks">
|
||||
<figure class="overlay overlay-1 rounded group relative"><a class="relative block z-[3] cursor-pointer inset-0" href="assets/img/photos/pf13-full.jpg" data-glightbox data-gallery="shots-group"> <img src="assets/img/photos/pf13.jpg" alt="image"></a>
|
||||
<figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
|
||||
<h5 class="from-top !mb-0 absolute w-full translate-y-[-80%] px-4 py-3 left-0 top-2/4 group-hover:-translate-y-2/4">Ultricies Aenean</h5>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.grid -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.wrapper -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section id="testimonials">
|
||||
<div class="wrapper image-wrapper bg-image bg-overlay bg-fixed bg-no-repeat bg-[center_center] bg-cover relative z-0 before:content-[''] before:block before:absolute before:z-[1] before:w-full before:h-full before:left-0 before:top-0 before:bg-[rgba(30,34,40,.5)]" data-image-src="./assets/img/photos/bg35.jpg">
|
||||
<div class="container py-[5rem] xl:!py-[7rem] lg:!py-[7rem] md:!py-[7rem]">
|
||||
<h2 class="xl:!text-[1.7rem] !text-[calc(1.295rem_+_0.54vw)] !leading-[1.25] !font-semibold !mb-4 !text-center !text-white">Happy Customers</h2>
|
||||
<div class="swiper-container dots-closer dots-light dots-light-75" data-margin="0" data-dots="true" data-items-xl="3" data-items-md="2" data-items-xs="1">
|
||||
<div class="swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<div class="swiper-slide">
|
||||
<div class="item-inner">
|
||||
<div class="card border-0 !bg-[rgba(255,255,255,.9)]">
|
||||
<div class="card-body flex-[1_1_auto] p-[40px]">
|
||||
<span class="ratings inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five !mb-3"></span>
|
||||
<blockquote class="border-0 !mb-0 !text-[.9rem] !leading-[1.7] font-medium m-[0_0_1rem]">
|
||||
<p>“Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vestibulum id ligula porta felis euismod semper. Cras justo odio dapibus facilisis sociis natoque penatibus.”</p>
|
||||
<div class="flex items-center text-left">
|
||||
<div class="info p-0">
|
||||
<h5 class="!mb-0">Coriss Ambady</h5>
|
||||
<p class="!mb-0 text-[.85rem]">Financial Analyst</p>
|
||||
</div>
|
||||
</div>
|
||||
</blockquote>
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.item-inner -->
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<div class="item-inner">
|
||||
<div class="card border-0 !bg-[rgba(255,255,255,.9)]">
|
||||
<div class="card-body flex-[1_1_auto] p-[40px]">
|
||||
<span class="ratings inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five !mb-3"></span>
|
||||
<blockquote class="border-0 !mb-0 !text-[.9rem] !leading-[1.7] font-medium m-[0_0_1rem]">
|
||||
<p>“Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vestibulum id ligula porta felis euismod semper. Cras justo odio dapibus facilisis sociis natoque penatibus.”</p>
|
||||
<div class="flex items-center text-left">
|
||||
<div class="info p-0">
|
||||
<h5 class="!mb-0">Cory Zamora</h5>
|
||||
<p class="!mb-0 text-[.85rem]">Marketing Specialist</p>
|
||||
</div>
|
||||
</div>
|
||||
</blockquote>
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.item-inner -->
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<div class="item-inner">
|
||||
<div class="card border-0 !bg-[rgba(255,255,255,.9)]">
|
||||
<div class="card-body flex-[1_1_auto] p-[40px]">
|
||||
<span class="ratings inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five !mb-3"></span>
|
||||
<blockquote class="border-0 !mb-0 !text-[.9rem] !leading-[1.7] font-medium m-[0_0_1rem]">
|
||||
<p>“Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vestibulum id ligula porta felis euismod semper. Cras justo odio dapibus facilisis sociis natoque penatibus.”</p>
|
||||
<div class="flex items-center text-left">
|
||||
<div class="info p-0">
|
||||
<h5 class="!mb-0">Nikolas Brooten</h5>
|
||||
<p class="!mb-0 text-[.85rem]">Sales Manager</p>
|
||||
</div>
|
||||
</div>
|
||||
</blockquote>
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.item-inner -->
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<div class="item-inner">
|
||||
<div class="card border-0 !bg-[rgba(255,255,255,.9)]">
|
||||
<div class="card-body flex-[1_1_auto] p-[40px]">
|
||||
<span class="ratings inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five !mb-3"></span>
|
||||
<blockquote class="border-0 !mb-0 !text-[.9rem] !leading-[1.7] font-medium m-[0_0_1rem]">
|
||||
<p>“Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vestibulum id ligula porta felis euismod semper. Cras justo odio dapibus facilisis sociis natoque penatibus.”</p>
|
||||
<div class="flex items-center text-left">
|
||||
<div class="info p-0">
|
||||
<h5 class="!mb-0">Coriss Ambady</h5>
|
||||
<p class="!mb-0 text-[.85rem]">Financial Analyst</p>
|
||||
</div>
|
||||
</div>
|
||||
</blockquote>
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.item-inner -->
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<div class="item-inner">
|
||||
<div class="card border-0 !bg-[rgba(255,255,255,.9)]">
|
||||
<div class="card-body flex-[1_1_auto] p-[40px]">
|
||||
<span class="ratings inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five !mb-3"></span>
|
||||
<blockquote class="border-0 !mb-0 !text-[.9rem] !leading-[1.7] font-medium m-[0_0_1rem]">
|
||||
<p>“Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vestibulum id ligula porta felis euismod semper. Cras justo odio dapibus facilisis sociis natoque penatibus.”</p>
|
||||
<div class="flex items-center text-left">
|
||||
<div class="info p-0">
|
||||
<h5 class="!mb-0">Jackie Sanders</h5>
|
||||
<p class="!mb-0">Investment Planner</p>
|
||||
</div>
|
||||
</div>
|
||||
</blockquote>
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.item-inner -->
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<div class="item-inner">
|
||||
<div class="card border-0 !bg-[rgba(255,255,255,.9)]">
|
||||
<div class="card-body flex-[1_1_auto] p-[40px]">
|
||||
<span class="ratings inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five !mb-3"></span>
|
||||
<blockquote class="border-0 !mb-0 !text-[.9rem] !leading-[1.7] font-medium m-[0_0_1rem]">
|
||||
<p>“Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vestibulum id ligula porta felis euismod semper. Cras justo odio dapibus facilisis sociis natoque penatibus.”</p>
|
||||
<div class="flex items-center text-left">
|
||||
<div class="info p-0">
|
||||
<h5 class="!mb-0">Laura Widerski</h5>
|
||||
<p class="!mb-0">Sales Specialist</p>
|
||||
</div>
|
||||
</div>
|
||||
</blockquote>
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.item-inner -->
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
</div>
|
||||
<!--/.swiper-wrapper -->
|
||||
</div>
|
||||
<!-- /.swiper -->
|
||||
</div>
|
||||
<!-- /.swiper-container -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.wrapper -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section id="about">
|
||||
<div class="wrapper bg-[rgba(246,247,249,1)] ">
|
||||
<div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
|
||||
<div class="flex flex-wrap mx-[-15px] md:mx-[-20px] lg:mx-[-20px] xl:mx-[-35px] !mt-[-30px] items-center">
|
||||
<div class="md:w-8/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!order-2 lg:!order-2 !mx-auto md:!px-[20px] lg:!px-[20px] xl:!px-[35px] !mt-[30px]">
|
||||
<div class="img-mask mask-2"><img src="assets/img/photos/about30.jpg" alt="image"></div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full md:!px-[20px] lg:!px-[20px] xl:!px-[35px] !mt-[30px]">
|
||||
<h2 class="xl:!text-[1.7rem] !text-[calc(1.295rem_+_0.54vw)] !leading-[1.25] !font-semibold !mb-3">About Me</h2>
|
||||
<p class="lead !text-[1.1rem] !leading-[1.55] font-medium">I'm Caitlyn Trunçgil, a photographer specializing in food, drink and product photography.</p>
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Vestibulum id ligula.</p>
|
||||
<p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Aenean lacinia bibendum nulla sed consectetur. Curabitur blandit tempus porttitor. Lorem ipsum dolor sit amet, consectetur.</p>
|
||||
<a href="#" class="btn btn-yellow !text-white !bg-[#fab758] border-[#fab758] hover:text-white hover:bg-[#fab758] hover:!border-[#fab758] active:text-white active:bg-[#fab758] active:border-[#fab758] disabled:text-white disabled:bg-[#fab758] disabled:border-[#fab758] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Learn More</a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] md:mx-[-20px] lg:mx-[-20px] xl:mx-[-35px] !mt-10 xl:!mt-16 lg:!mt-16 md:!mt-16">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full md:!px-[20px] lg:!px-[20px] xl:!px-[35px]">
|
||||
<h2 class="xl:!text-[1.7rem] !text-[calc(1.295rem_+_0.54vw)] !leading-[1.25] !font-semibold !mb-3">My Working Process</h2>
|
||||
<p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Fusce dapibus, tellus ac cursus. Aenean eu leo quam.</p>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full md:!px-[20px] lg:!px-[20px] xl:!px-[35px]">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] md:mx-[-20px] lg:mx-[-20px] xl:mx-[-35px]">
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px] md:!px-[20px] lg:!px-[20px] xl:!px-[35px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<span class="icon btn btn-circle btn-yellow !text-white !bg-[#fab758] border-[#fab758] hover:text-white hover:bg-[#fab758] hover:!border-[#fab758] active:text-white active:bg-[#fab758] active:border-[#fab758] disabled:text-white disabled:bg-[#fab758] disabled:border-[#fab758] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">1</span></span>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Concept</h4>
|
||||
<p class="!mb-0">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px] md:!px-[20px] lg:!px-[20px] xl:!px-[35px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<span class="icon btn btn-circle btn-yellow !text-white !bg-[#fab758] border-[#fab758] hover:text-white hover:bg-[#fab758] hover:!border-[#fab758] active:text-white active:bg-[#fab758] active:border-[#fab758] disabled:text-white disabled:bg-[#fab758] disabled:border-[#fab758] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">2</span></span>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Prepare</h4>
|
||||
<p class="!mb-0">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px] md:!px-[20px] lg:!px-[20px] xl:!px-[35px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<span class="icon btn btn-circle btn-yellow !text-white !bg-[#fab758] border-[#fab758] hover:text-white hover:bg-[#fab758] hover:!border-[#fab758] active:text-white active:bg-[#fab758] active:border-[#fab758] disabled:text-white disabled:bg-[#fab758] disabled:border-[#fab758] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">3</span></span>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Retouch</h4>
|
||||
<p class="!mb-0">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px] md:!px-[20px] lg:!px-[20px] xl:!px-[35px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<span class="icon btn btn-circle btn-yellow !text-white !bg-[#fab758] border-[#fab758] hover:text-white hover:bg-[#fab758] hover:!border-[#fab758] active:text-white active:bg-[#fab758] active:border-[#fab758] disabled:text-white disabled:bg-[#fab758] disabled:border-[#fab758] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">4</span></span>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Finalize</h4>
|
||||
<p class="!mb-0">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.wrapper -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section id="pricing">
|
||||
<div class="wrapper image-wrapper bg-image bg-overlay bg-fixed bg-no-repeat bg-[center_center] bg-cover relative z-0 before:content-[''] before:block before:absolute before:z-[1] before:w-full before:h-full before:left-0 before:top-0 before:bg-[rgba(30,34,40,.5)]" data-image-src="./assets/img/photos/bg36.jpg">
|
||||
<div class="container py-[5rem] xl:!py-[7rem] lg:!py-[7rem] md:!py-[7rem]">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="xl:w-9/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<div class="card border-0 !bg-[rgba(255,255,255,.9)]">
|
||||
<div class="card-body xl:!py-16 xl:!px-24 lg:!py-16 lg:!px-24 p-[40px]">
|
||||
<h2 class="xl:!text-[1.7rem] !text-[calc(1.295rem_+_0.54vw)] !leading-[1.25] !font-semibold !mb-3 !text-center">Request Photography Pricing</h2>
|
||||
<p class="lead !text-[1.1rem] !leading-[1.55] font-medium !mb-10">For more information please get in touch using the form below:</p>
|
||||
<form class="contact-form needs-validation" method="post" action="https://Trunçgil-tailwind-template.netlify.app/assets/php/contact.php" novalidate>
|
||||
<div class="messages"></div>
|
||||
<div class="flex flex-wrap mx-[-10px]">
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full">
|
||||
<div class="form-floating relative !mb-4">
|
||||
<input id="form_name" type="text" name="name" class="form-control bg-[rgba(255,255,255,.7)] border-0 relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:bg-[rgba(255,255,255,.7)] focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus:!border-0 focus-visible:!border-0 placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" required>
|
||||
<label for="form_name" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Name *</label>
|
||||
<div class="valid-feedback"> Looks good! </div>
|
||||
<div class="invalid-feedback"> Please enter your name. </div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full">
|
||||
<div class="form-floating relative !mb-4">
|
||||
<input id="form_email" type="email" name="email" class="form-control bg-[rgba(255,255,255,.7)] border-0 relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:bg-[rgba(255,255,255,.7)] focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus:!border-0 focus-visible:!border-0 placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" required>
|
||||
<label for="form_email" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Email *</label>
|
||||
<div class="valid-feedback"> Looks good! </div>
|
||||
<div class="invalid-feedback"> Please provide a valid email address. </div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="w-full flex-[0_0_auto] !px-[15px] max-w-full">
|
||||
<div class="form-floating relative !mb-4">
|
||||
<textarea id="form_message" name="message" class="form-control bg-[rgba(255,255,255,.7)] border-0 relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:bg-[rgba(255,255,255,.7)] focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus:!border-0 focus-visible:!border-0 placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" style="height: 150px" required></textarea>
|
||||
<label for="form_message" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Message *</label>
|
||||
<div class="valid-feedback"> Looks good! </div>
|
||||
<div class="invalid-feedback"> Please enter your messsage. </div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center">
|
||||
<input type="submit" class="btn btn-yellow !text-white !bg-[#fab758] border-[#fab758] hover:text-white hover:bg-[#fab758] hover:!border-[#fab758] active:text-white active:bg-[#fab758] active:border-[#fab758] disabled:text-white disabled:bg-[#fab758] disabled:border-[#fab758] !rounded-[50rem] btn-send" value="Send message">
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</form>
|
||||
<!-- /form -->
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.card -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.wrapper -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="bg-[rgba(246,247,249,1)]">
|
||||
<div class="container pt-[4rem] pb-7">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-0 lg:mx-0 !mt-[-30px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:px-0 lg:px-0 !mt-[30px]">
|
||||
<div class="widget">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
<p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">I'm Caitlyn Trunçgil, a photographer specializing in food, drink and product photography.</p>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-[16.66666667%] lg:!ml-[16.66666667%] xl:px-0 lg:px-0 !mt-[30px]">
|
||||
<div class="widget">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon !text-[#fab758] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="!mb-1">Phone</h5>
|
||||
<p class="!mb-0">00 (123) 456 78 90 <br>00 (987) 654 32 10</p>
|
||||
</div>
|
||||
</div>
|
||||
<!--/div -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:px-0 lg:px-0 !mt-[30px]">
|
||||
<div class="widget">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon !text-[#fab758] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
|
||||
</div>
|
||||
<div class="!self-start !justify-start">
|
||||
<h5 class="!mb-1">Address</h5>
|
||||
<address class=" not-italic !leading-[inherit] !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
</div>
|
||||
</div>
|
||||
<!--/div -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<hr class="!mt-[3rem] xl:!mt-[3.5rem] lg:!mt-[3.5rem] md:!mt-[3.5rem] !mb-7">
|
||||
<div class="xl:!flex lg:!flex md:!flex items-center justify-between">
|
||||
<p class="!mb-2 xl:!mb-0 lg:!mb-0">© 2025 Trunçgil. All rights reserved.</p>
|
||||
<nav class="nav social social-muted !mb-0 xl:!text-right lg:!text-right md:!text-right">
|
||||
<a class="m-[0_0_0_.7rem] max-md:m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-twitter before:content-['\ed59'] text-[1rem] !text-[#5daed5]"></i></a>
|
||||
<a class="m-[0_0_0_.7rem] max-md:m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] text-[1rem] !text-[#4470cf]"></i></a>
|
||||
<a class="m-[0_0_0_.7rem] max-md:m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] text-[1rem] !text-[#e94d88]"></i></a>
|
||||
<a class="m-[0_0_0_.7rem] max-md:m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] text-[1rem] !text-[#d53581]"></i></a>
|
||||
<a class="m-[0_0_0_.7rem] max-md:m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-youtube before:content-['\edb5'] text-[1rem] !text-[#c8312b]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<!-- progress wrapper -->
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#fab758] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#fab758] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/demo24 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 10:59:03 GMT -->
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,990 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/demo26 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 10:59:15 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="stylesheet" href="assets/css/colors/grape.css">
|
||||
<link rel="preload" href="assets/css/fonts/urbanist.css" as="style" onload="this.rel='stylesheet'">
|
||||
<style>
|
||||
.navbar.navbar-light.fixed .btn:not(.btn-expand):not(.btn-gradient) {
|
||||
background: #e31e24 !important;
|
||||
border-color: #e31e24 !important;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
@media (max-width: 991.98px){
|
||||
.navbar-expand-lg .navbar-collapse .dropdown-toggle:after {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper !bg-[#f0f0f8]">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent navbar-light">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle font-bold !tracking-[-0.01rem] hover:!text-[#e31e24] after:!text-[#e31e24]" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle font-bold !tracking-[-0.01rem] hover:!text-[#e31e24] after:!text-[#e31e24]" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle font-bold !tracking-[-0.01rem] hover:!text-[#e31e24] after:!text-[#e31e24]" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header !text-[#e31e24]">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header !text-[#e31e24]">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle font-bold !tracking-[-0.01rem] hover:!text-[#e31e24] after:!text-[#e31e24]" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle font-bold !tracking-[-0.01rem] hover:!text-[#e31e24] after:!text-[#e31e24]" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle font-bold !tracking-[-0.01rem] hover:!text-[#e31e24] after:!text-[#e31e24]" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header !text-[#e31e24]">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header !text-[#e31e24] xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header !text-[#e31e24]">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a href="#" class="btn btn-sm btn-grape !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24] active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded">Free Trial</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="wrapper !bg-[#f0f0f8]">
|
||||
<div class="container pt-10 lg:pt-14 xl:!pt-14 xxl:!pt-10 lg:pb-10 xl:pb-10 xxl:pb-0">
|
||||
<div class="flex flex-wrap mx-[-15px] md:mx-[-20px] lg:mx-[-20px] xl:mx-[-35px] !mt-[-50px] items-center text-center lg:text-left xl:text-left">
|
||||
<div class="lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full md:!px-[20px] lg:!px-[20px] xl:!px-[35px] !mt-[50px]" data-cues="slideInDown" data-group="page-title" data-delay="900">
|
||||
<h1 class="xl:!text-[2.5rem] !text-[calc(1.375rem_+_1.5vw)] !leading-[1.15] font-semibold !mb-4 xl:!mr-5 xl:!mt-[-2.5rem] lg:!mt-[-2.5rem]">Grow Your Business with <br class="hidden md:block xl:!hidden lg:!hidden"><span class="!text-[#e31e24] ">Our Marketing Solutions</span></h1>
|
||||
<p class="lead !text-[1.2rem] !leading-[1.5] !mb-7 xxl:!pr-20">We help our clients to increase their website <br class="hidden md:block xl:!hidden lg:!hidden"> traffic, rankings and visibility in search results.</p>
|
||||
<div class="inline-flex !mr-2"><a href="#" class="btn btn-lg btn-grape !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24] active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded">Try it for Free</a></div>
|
||||
<div class="inline-flex"><a href="#" class="btn btn-lg btn-outline-grape !text-[#e31e24] bg-[#e31e24] !border-[#e31e24] !border-[2px] hover:!text-white hover:!bg-[#e31e24] hover:!border-[#e31e24] focus:shadow-[rgba(96,93,186,1)] active:!text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:!text-white disabled:bg-transparent disabled:border-[#e31e24] rounded">Explore Now</a></div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="w-10/12 md:w-7/12 lg:w-6/12 xl:w-5/12 !mx-auto flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-5 md:!px-[20px] lg:!px-[20px] xl:!px-[35px] !mt-[50px]">
|
||||
<img class="max-w-full h-auto !mb-[-3.5rem] md:!mb-[-4.5rem] lg:!mb-[-9rem] xl:!mb-[-9rem]" src="assets/img/illustrations/3d11.png" data-cue="fadeIn" data-delay="300" alt="image">
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
<figure class="m-0 p-0"><img class="w-full max-w-full !h-auto" src="assets/img/photos/clouds.png" alt="image"></figure>
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper bg-[rgba(255,255,255)] opacity-100">
|
||||
<div class="container pt-20 pb-20 xl:pb-28 lg:pb-28 md:pb-28">
|
||||
<div class="flex flex-wrap mx-[-15px] !text-center">
|
||||
<div class="md:w-10/12 md:!ml-[8.33333333%] lg:w-10/12 lg:!ml-[8.33333333%] xl:w-10/12 xl:!ml-[8.33333333%] xxl:w-8/12 xxl:!ml-[16.66666667%] flex-[0_0_auto] !px-[15px] max-w-full">
|
||||
<h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35 !tracking-[0.02rem]">What We Do?</h2>
|
||||
<h3 class="xl:!text-[1.9rem] !text-[calc(1.315rem_+_0.78vw)] !leading-[1.25] font-semibold !mb-9">The full service we are offering is specifically designed to meet your business needs.</h3>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-20px] lg:mx-[-20px] md:mx-[-20px] !mt-[-40px] !mb-20 xl:!mb-[7rem] lg:!mb-[7rem] md:!mb-[7rem] !text-center">
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[20px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
|
||||
<div class="md:!px-3 lg:!px-0 xl:!px-3">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.01 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/globe-2.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] solid-mono text-[#e31e24] text-grape !mb-5 m-[0_auto]"><path class="fill-secondary" d="M128.11 256h-.24a126.37 126.37 0 01-22-1.84 8 8 0 112.72-15.76A114.68 114.68 0 00128 240a8.06 8.06 0 018.07 8 8 8 0 01-7.94 8zm33.52-12.5a8 8 0 014.77-10.25 112.18 112.18 0 0017.66-8.25 8 8 0 018 13.85 128.36 128.36 0 01-20.19 9.46 8 8 0 01-10.26-4.79zm-97.5-4.56a128.83 128.83 0 01-18.27-12.78 8 8 0 1110.25-12.27 114.33 114.33 0 0016 11.2 8 8 0 11-8 13.85zm150.69-27.71a8 8 0 01-1-11.26A112.91 112.91 0 00225 184a8 8 0 0113.86 8 130.3 130.3 0 01-12.78 18.26 8 8 0 01-11.28 1zm-197.59-19A128.41 128.41 0 017.76 172a8 8 0 1115-5.49 112.8 112.8 0 008.29 17.67 8 8 0 11-13.84 8zM244.8 156.7a8 8 0 01-6.5-9.26A112.3 112.3 0 00240 128a8.23 8.23 0 018-8.26 7.81 7.81 0 018 8.76 124.89 124.89 0 01-1.92 21.72 8 8 0 01-9.26 6.48zM8 136.13a7.89 7.89 0 01-8-7.87s.61-15 1.86-22.18a8 8 0 1115.76 2.7A114.47 114.47 0 0016 128a8.09 8.09 0 01-8 8.13zm225.1-46.88a110.41 110.41 0 00-8.32-17.63 8 8 0 0113.83-8.08 129 129 0 019.52 20.17 8 8 0 01-15 5.54zM19.9 75.18A8 8 0 0117 64.26 126.41 126.41 0 0129.73 46 8 8 0 1142 56.21a112.72 112.72 0 00-11.17 16 8 8 0 01-10.93 3zm179.76-33.24a113.17 113.17 0 00-16-11.16 8 8 0 117.95-13.87 127.39 127.39 0 0118.3 12.75 8 8 0 01-10.24 12.28zM60.78 28.26a8 8 0 012.88-11 128 128 0 0120.18-9.44 8 8 0 115.52 15 112.17 112.17 0 00-17.63 8.31 8 8 0 01-11-2.88zm86.29-10.64A112.4 112.4 0 00128 16a8.17 8.17 0 01-8.19-8 7.84 7.84 0 017.81-8h.38a127.72 127.72 0 0121.8 1.86 8 8 0 01-2.71 15.76z"></path><path class="fill-primary" d="M128 32a96 96 0 1096 96 96.11 96.11 0 00-96-96zm62.61 145.66a103 103 0 00-14.49-7.76 160.22 160.22 0 005-33.9h26.48a79.47 79.47 0 01-17.01 41.66zM48.4 136h26.48a161.6 161.6 0 005 33.9 104.11 104.11 0 00-14.5 7.76A79.47 79.47 0 0148.4 136zm17-57.66a103.14 103.14 0 0014.5 7.76 160.2 160.2 0 00-5 33.9H48.4a79.47 79.47 0 0117-41.66zM120 79.7a106.49 106.49 0 01-20-3.43c5.41-13 12.6-22.11 20-26zm0 16V120H90.86A145.12 145.12 0 0195 91.49a122.72 122.72 0 0025 4.21zm0 40.3v24.3a121.26 121.26 0 00-25 4.23A144.37 144.37 0 0190.86 136H120zm0 40.3v29.48c-7.4-3.94-14.59-13-20-26a104.12 104.12 0 0120-3.44zm16 0a106.21 106.21 0 0120 3.43c-5.4 13-12.59 22.11-20 26zm0-16V136h29.1a144.37 144.37 0 01-4.16 28.51 122.49 122.49 0 00-25-4.21zm0-40.3V95.7a121.14 121.14 0 0025-4.23 142.91 142.91 0 014.1 28.53H136zm0-40.3V50.24c7.41 3.94 14.6 13 20 26a104.36 104.36 0 01-20 3.46zm27.94-23.08a80.19 80.19 0 0115.25 10 88.15 88.15 0 01-8.19 4.21 98.1 98.1 0 00-7.12-14.21zm-79 14.21a86.72 86.72 0 01-8.12-4.25 80.12 80.12 0 0115.24-10 95.14 95.14 0 00-7.12 14.25zm0 114.34a98.11 98.11 0 007.12 14.21 80.12 80.12 0 01-15.24-10 86.72 86.72 0 018.12-4.21zm86.1 0a88.15 88.15 0 018.13 4.25 80.19 80.19 0 01-15.25 10 99.14 99.14 0 007.08-14.25zM181.1 120a161 161 0 00-5-33.9 104.57 104.57 0 0014.49-7.76 79.47 79.47 0 0117 41.66z"></path></svg>
|
||||
<h4>SEO Services</h4>
|
||||
<p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida eget metus cras justo.</p>
|
||||
<a href="#" class="more hover !text-[#e31e24]">Learn More</a>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[20px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
|
||||
<div class="md:!px-3 lg:!px-0 xl:!px-3">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 213.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/code.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] solid-mono text-[#e31e24] text-grape !mb-5 m-[0_auto]"><path class="fill-secondary" d="M104 213.34a11 11 0 01-2.59-.32 10.64 10.64 0 01-7.76-12.93l48-192a10.66 10.66 0 0120.68 5.17l-48 192a10.66 10.66 0 01-10.33 8.08z"></path><path class="fill-primary" d="M74.66 181.34a10.57 10.57 0 01-7.54-3.12l-64-64a10.67 10.67 0 010-15.08l64-64a10.67 10.67 0 0115.09 15.08l-56.46 56.47 56.46 56.46a10.65 10.65 0 01-7.55 18.19zm106.65 0a10.55 10.55 0 01-7.53-3.12 10.67 10.67 0 010-15.08l56.46-56.47-56.46-56.46a10.67 10.67 0 1115.08-15.09l64 64a10.68 10.68 0 010 15.09l-64 64a10.58 10.58 0 01-7.55 3.13z"></path></svg>
|
||||
<h4>Web Design</h4>
|
||||
<p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida eget metus cras justo.</p>
|
||||
<a href="#" class="more hover !text-[#e31e24]">Learn More</a>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[20px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
|
||||
<div class="md:!px-3 lg:!px-0 xl:!px-3">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/team.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] solid-mono text-[#e31e24] text-grape !mb-5 m-[0_auto]"><circle class="fill-primary" cx="128" cy="26.67" r="26.67"></circle><circle class="fill-primary" cx="202.67" cy="176" r="26.67"></circle><circle class="fill-primary" cx="53.33" cy="176" r="26.67"></circle><path class="fill-primary" d="M173.33 106.67H82.66a8 8 0 01-8-8v-5.33A29.35 29.35 0 01104 64h48a29.35 29.35 0 0129.33 29.32v5.33a8 8 0 01-8 8.02zM248 256h-90.67a8 8 0 01-8-8v-5.33a29.36 29.36 0 0129.33-29.33h48A29.36 29.36 0 01256 242.67V248a8 8 0 01-8 8zm-149.33 0H8a8 8 0 01-8-8v-5.33a29.36 29.36 0 0129.33-29.33h48a29.37 29.37 0 0129.33 29.33V248a8 8 0 01-8 8z"></path><path class="fill-secondary" d="M29.33 136.13a8 8 0 01-8-8 107.1 107.1 0 0161.73-96.77 8 8 0 116.73 14.51 91 91 0 00-52.48 82.26 8 8 0 01-7.98 8zm197.34 0a8 8 0 01-8-8 91 91 0 00-52.48-82.26 8 8 0 116.74-14.51 107.09 107.09 0 0161.73 96.77 8 8 0 01-8 8zM128 234.8a105.08 105.08 0 01-11.15-.58 8 8 0 011.66-15.9 93.73 93.73 0 0019.6-.06 8 8 0 011.76 15.9 110.68 110.68 0 01-11.87.64z"></path></svg>
|
||||
<h4>Social Engagement</h4>
|
||||
<p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida eget metus cras justo.</p>
|
||||
<a href="#" class="more hover !text-[#e31e24]">Learn More</a>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[20px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
|
||||
<div class="md:!px-3 lg:!px-0 xl:!px-3">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/devices.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] solid-mono text-[#e31e24] text-grape !mb-5 m-[0_auto]"><path class="fill-primary" d="M226.67 0H80a29.35 29.35 0 00-29.33 29.33v13.33H72v-8a13.34 13.34 0 0113.33-13.33h136a13.34 13.34 0 0113.33 13.33v186.67a13.35 13.35 0 01-13.33 13.33h-82.74A44.07 44.07 0 01132.7 256h94a29.33 29.33 0 0029.3-29.33V29.33A29.35 29.35 0 00226.67 0z"></path><path class="fill-secondary" d="M97.17 64h-77C9 64 0 73.87 0 86v148c0 12.13 9 22 20.16 22h77c11.12 0 20.16-9.87 20.16-22V86c.01-12.13-9.03-22-20.15-22zm5.5 168c0 4.42-3.28 8-7.33 8H22c-4.05 0-7.33-3.58-7.33-8V85.33c0-4.42 3.28-8 7.33-8h3.66c4.05 0 7.33 3.58 7.33 8s3.28 8 7.33 8H77c4.05 0 7.33-3.59 7.33-8s3.28-8 7.33-8h3.66c4 0 7.33 3.58 7.33 8V232z"></path><path class="fill-primary" d="M154.67 186.67A13.33 13.33 0 10168 200a13.35 13.35 0 00-13.33-13.33z"></path></svg>
|
||||
<h4>App Development</h4>
|
||||
<p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida eget metus cras justo.</p>
|
||||
<a href="#" class="more hover !text-[#e31e24]">Learn More</a>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<div class="flex flex-wrap mx-[-7.5px] !mt-[-50px] !mb-[4.5rem] xl:!mb-[6rem] lg:!mb-[6rem] md:!mb-[6rem] items-center">
|
||||
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] max-w-full px-[7.5px] !mt-[50px]">
|
||||
<figure class="m-0 p-0"><img class="w-auto" src="assets/img/illustrations/3d8.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] max-w-full !ml-auto px-[7.5px] !mt-[50px]">
|
||||
<h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35 !tracking-[0.02rem]">Why Choose Us?</h2>
|
||||
<h3 class="xl:!text-[1.9rem] !text-[calc(1.315rem_+_0.78vw)] !leading-[1.25] font-semibold !mb-8">So here a few reasons why our valued customers choose us.</h3>
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px]">
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/lamp.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] solid-mono text-[#e31e24] text-grape !mr-4"><path class="fill-secondary" d="M128 36.86a8 8 0 01-8-8V8a8 8 0 0116 0v20.86a8 8 0 01-8 8zm70.1 29.04a8 8 0 01-5.67-13.64l14.77-14.77a8 8 0 1111.31 11.31l-14.77 14.77a8 8 0 01-5.64 2.33zM248 136h-20.86a8 8 0 010-16H248a8 8 0 010 16zm-35.15 84.85a8.06 8.06 0 01-5.67-2.34l-14.76-14.77a8 8 0 0111.31-11.31l14.77 14.77a8 8 0 010 11.31 7.92 7.92 0 01-5.65 2.34zm-169.7 0a8 8 0 01-5.66-13.65l14.77-14.77a8 8 0 0111.31 11.31L48.8 218.51a7.93 7.93 0 01-5.65 2.34zM28.86 136H8a8 8 0 010-16h20.86a8 8 0 110 16zM57.9 65.9a8 8 0 01-5.66-2.33L37.47 48.8a8 8 0 1111.31-11.31l14.77 14.77A8 8 0 0157.9 65.9z"></path><path class="fill-primary" d="M160 224v13.33A18.76 18.76 0 01141.33 256h-26.67c-9 0-18.66-6.83-18.66-21.76V224zm15-154a74.93 74.93 0 00-63-15c-28.27 5.91-51.2 29-57.07 57.21a74.74 74.74 0 0028.16 75.41A32.19 32.19 0 0195.25 208v.12A2 2 0 0196 208h64a.93.93 0 01.53.11V208c1.49-8.11 6.29-15.57 13.65-21.33A74.72 74.72 0 00175 70zm-7 63.36a8.06 8.06 0 01-8-8A29.32 29.32 0 00130.67 96a8 8 0 110-16A45.43 45.43 0 01176 125.33a8.06 8.06 0 01-8 8z"></path><path class="fill-secondary" d="M95.25 208H96a1.8 1.8 0 00-.75.11z"></path><path class="fill-primary" d="M160.53 208v.11a.93.93 0 00-.53-.11z"></path></svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Creativity</h4>
|
||||
<p class="!mb-0">Curabitur blandit lacus porttitor ridiculus mus.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 255.98" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/bulb.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] solid-mono text-[#e31e24] text-grape !mr-4"><circle class="fill-primary" cx="58.67" cy="149.31" r="32"></circle><path class="fill-primary" d="M88 202.65H29.33A29.36 29.36 0 000 232v16a8 8 0 008 8h101.33a8 8 0 008-8v-16A29.36 29.36 0 0088 202.65z"></path><circle class="fill-primary" cx="197.33" cy="149.31" r="32"></circle><path class="fill-primary" d="M226.67 202.65H168A29.36 29.36 0 00138.67 232v16a8 8 0 008 8H248a8 8 0 008-8v-16a29.36 29.36 0 00-29.33-29.35z"></path><path class="fill-secondary" d="M149.76 108.48v7.68A11.9 11.9 0 01137.81 128h-19.63c-5.76 0-12-4.27-12-13.76v-5.76zM176 47.68a47.26 47.26 0 01-17.6 36.91 22.89 22.89 0 00-8.32 13.23H106a20 20 0 00-7.79-12.69A47.13 47.13 0 0180 46.73C80.53 21.34 101.76.33 127.25 0a47.34 47.34 0 0134.56 13.88A46.82 46.82 0 01176 47.68z"></path></svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Innovative Thinking</h4>
|
||||
<p class="!mb-0">Curabitur blandit lacus porttitor ridiculus mus.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.97 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/puzzle.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] solid-mono text-[#e31e24] text-grape !mr-4"><path class="fill-secondary" d="M221.86 91a33.65 33.65 0 01-22.72-8.75v40.21h-27.2a43.26 43.26 0 003.73-17.71 44.8 44.8 0 10-86 17.71H56.85v-111A11.42 11.42 0 0168.26 0h119.47a11.42 11.42 0 0111.41 11.41v20.05A34.1 34.1 0 11221.86 91z"></path><path class="fill-primary" d="M142.79 181.25a34.13 34.13 0 0033.55 40.62 33.66 33.66 0 0022.75-8.77v31.52A11.41 11.41 0 01187.72 256H68.28a11.41 11.41 0 01-11.38-11.38V213.1a34.12 34.12 0 11-22.75-59.5 33.71 33.71 0 0122.75 8.77v-29.2H112a34.12 34.12 0 1137.76 0h49.37v29.2a34.09 34.09 0 00-56.3 18.88z"></path></svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Rapid Solutions</h4>
|
||||
<p class="!mb-0">Curabitur blandit lacus porttitor ridiculus mus.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 244.09" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/headphone.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] solid-mono text-[#e31e24] text-grape !mr-4"><path class="fill-secondary" d="M35.72 92.28a92.28 92.28 0 01184.56 0v47.63a8.93 8.93 0 01-17.86 0V92.28a74.42 74.42 0 10-148.84 0v47.63a8.93 8.93 0 11-17.86 0zm175.63 62.51a8.93 8.93 0 018.93 8.93v35.72a32.75 32.75 0 01-32.75 32.75h-35.72a8.94 8.94 0 010-17.87h35.72a14.88 14.88 0 0014.89-14.88v-35.72a8.93 8.93 0 018.93-8.93z"></path><path class="fill-secondary" d="M107.16 223.26A20.84 20.84 0 01128 202.42h11.91a20.84 20.84 0 010 41.67H128a20.84 20.84 0 01-20.84-20.83zm20.84-3a3 3 0 100 5.95h11.91a3 3 0 000-5.95z"></path><path class="fill-primary" d="M32.74 107.16A32.74 32.74 0 000 139.91v23.81a32.75 32.75 0 0032.74 32.75h11.91a8.93 8.93 0 008.93-8.94v-71.44a8.93 8.93 0 00-8.93-8.93zm190.52 0A32.74 32.74 0 01256 139.91v23.81a32.75 32.75 0 01-32.74 32.75h-11.91a8.93 8.93 0 01-8.93-8.94v-71.44a8.93 8.93 0 018.93-8.93z"></path></svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Top-Notch Support</h4>
|
||||
<p class="!mb-0">Curabitur blandit lacus porttitor ridiculus mus.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<div class="flex flex-wrap mx-[-7.5px] !mt-[-50px] xl:!mt-0 lg:!mt-0 !mb-20 xl:!mb-[7rem] lg:!mb-[7rem] md:!mb-[7rem] items-center">
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] max-w-full !mx-auto xl:!order-2 lg:!order-2 px-[7.5px] !mt-[50px] xl:!mt-0 lg:!mt-0">
|
||||
<figure class="m-0 p-0"><img class="w-auto" src="assets/img/illustrations/3d5.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] max-w-full !mr-auto px-[7.5px] !mt-[50px] xl:!mt-0 lg:!mt-0">
|
||||
<h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35 !tracking-[0.02rem] !mb-3">Our Solutions</h2>
|
||||
<h3 class="xl:!text-[1.9rem] !text-[calc(1.315rem_+_0.78vw)] !leading-[1.25] font-semibold !mb-5 xxl:!pr-5">Just sit & relax while we take care of your business needs.</h3>
|
||||
<p class="!mb-6">Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Praesent commodo cursus. Maecenas sed diam eget risus varius blandit sit amet non magna. Praesent commodo cursus magna.</p>
|
||||
<div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-30px]">
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none xl:!text-[2.2rem] !mb-1">99.7%</h3>
|
||||
<h6 class="!text-[0.85rem] !mb-1">Customer Satisfaction</h6>
|
||||
<span class="ratings inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five"></span>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none xl:!text-[2.2rem] !mb-1">4x</h3>
|
||||
<h6 class="!text-[0.85rem] !mb-1">New Visitors</h6>
|
||||
<span class="ratings inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five"></span>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<div class="card !bg-[#f0f0f8] !rounded-[0.8rem] !mb-20 xl:!mb-[7rem] lg:!mb-[7rem] md:!mb-[7rem]">
|
||||
<div class="card-body py-[4.5rem] xl:!px-0 lg:!px-0 px-[40px]">
|
||||
<div class="flex flex-wrap mx-[-15px] !text-center">
|
||||
<div class="lg:w-8/12 xl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-[16.66666667%] lg:!ml-[16.66666667%]">
|
||||
<h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35] !tracking-[0.02rem]">Happy Customers</h2>
|
||||
<h3 class="xl:!text-[1.9rem] !text-[calc(1.315rem_+_0.78vw)] !leading-[1.25] font-semibold !mb-10 xxl:!px-10">Don't take our word for it. See what customers are saying about us.</h3>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] items-center">
|
||||
<div class="lg:w-5/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !ml-auto hidden xl:!flex lg:!flex xl:!px-[35px] lg:!px-[20px]">
|
||||
<div class="img-mask mask-3"><img src="assets/img/photos/about28.jpg" alt="image"></div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="lg:w-6/12 xl:w-6/12 xxl:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mr-auto xl:!px-[35px] lg:!px-[20px]">
|
||||
<div class="swiper-container dots-start dots-closer !mb-6 relative z-10" data-margin="30" data-dots="true">
|
||||
<div class="swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<div class="swiper-slide">
|
||||
<span class="ratings inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five !mb-3"></span>
|
||||
<blockquote class="pl-0 text-[1.05rem] !mb-0 border-0 !leading-[1.7] font-medium m-[0_0_1rem]">
|
||||
<p>“Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vestibulum ligula porta felis euismod semper. Cras justo odio consectetur nulla dapibus curabitur blandit faucibus.”</p>
|
||||
<div class="flex items-center text-left">
|
||||
<div class="info !pl-0">
|
||||
<h5 class="!mb-1 text-[.95rem] !leading-[1.5]">Coriss Ambady</h5>
|
||||
<p class="!mb-0 text-[.85rem]">Financial Analyst</p>
|
||||
</div>
|
||||
</div>
|
||||
</blockquote>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<span class="ratings inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five !mb-3"></span>
|
||||
<blockquote class="pl-0 text-[1.05rem] !mb-0 border-0 !leading-[1.7] font-medium m-[0_0_1rem]">
|
||||
<p>“Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vestibulum ligula porta felis euismod semper. Cras justo odio consectetur nulla dapibus curabitur blandit faucibus.”</p>
|
||||
<div class="flex items-center text-left">
|
||||
<div class="info !pl-0">
|
||||
<h5 class="!mb-1 text-[.95rem] !leading-[1.5]">Cory Zamora</h5>
|
||||
<p class="!mb-0 text-[.85rem]">Marketing Specialist</p>
|
||||
</div>
|
||||
</div>
|
||||
</blockquote>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<span class="ratings inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five !mb-3"></span>
|
||||
<blockquote class="pl-0 text-[1.05rem] !mb-0 border-0 !leading-[1.7] font-medium m-[0_0_1rem]">
|
||||
<p>“Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vestibulum ligula porta felis euismod semper. Cras justo odio consectetur nulla dapibus curabitur blandit faucibus.”</p>
|
||||
<div class="flex items-center text-left">
|
||||
<div class="info !pl-0">
|
||||
<h5 class="!mb-1 text-[.95rem] !leading-[1.5]">Nikolas Brooten</h5>
|
||||
<p class="!mb-0 text-[.85rem]">Sales Manager</p>
|
||||
</div>
|
||||
</div>
|
||||
</blockquote>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
</div>
|
||||
<!--/.swiper-wrapper -->
|
||||
</div>
|
||||
<!-- /.swiper -->
|
||||
</div>
|
||||
<!-- /.swiper-container -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.card -->
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] !mb-20 xl:!mb-[7rem] lg:!mb-[7rem] md:!mb-[7rem]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35] !tracking-[0.02rem] xl:!mt-[8rem] lg:!mt-[8rem]">Our Pricing</h2>
|
||||
<h3 class="xl:!text-[1.9rem] !text-[calc(1.315rem_+_0.78vw)] !leading-[1.25] font-semibold !mb-3">We offer great and premium prices.</h3>
|
||||
<p>Enjoy a <a href="#" class="hover !text-[#e31e24]">free 30-day trial</a> and experience the full service. No credit card required!</p>
|
||||
<a href="#" class="btn btn-grape !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24] active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded !mt-2">See All Prices</a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] pricing-wrapper !mt-[30px]">
|
||||
<div class="flex flex-wrap items-center switcher xl:!justify-end lg:!justify-end">
|
||||
<p class="!mb-0 !pr-[.75rem]">Monthly</p>
|
||||
<div class="pricing-switchers w-8 h-4 clear-both !text-center !relative bg-[rgba(30,34,40,0.07)] !box-content rounded-3xl border-[0.2rem] border-solid border-transparent">
|
||||
<div class="pricing-switcher pricing-switcher-active cursor-pointer w-full float-left h-4 leading-4 !relative z-[888] transition-[0.3s] duration-[ease-in-out] uppercase !text-white"></div>
|
||||
<div class="pricing-switcher cursor-pointer w-full float-left h-4 leading-4 !relative z-[888] transition-[0.3s] duration-[ease-in-out] uppercase"></div>
|
||||
<div class="h-4 w-4 block absolute z-[555] transition-[0.3s] duration-[ease-in-out] m-0 rounded-[100%] border-[none] left-0 top-0 !bg-[#e31e24] opacity-100 switcher-button"></div>
|
||||
</div>
|
||||
<p class="!mb-0 !pl-3 !relative">Yearly <span class="!text-[#e2626b]">(Save 30%)</span></p>
|
||||
</div>
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[25px] !relative">
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="pricing card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] !border-[#cfceea] after:border-b-[calc(0.4rem_-_6px)] after:border-t-[6px] after:content-[''] after:absolute after:rounded-t-[0.4rem] after:border-t-inherit after:border-b-transparent after:top-0 after:inset-x-0">
|
||||
<div class="card-body !p-[3rem_40px_3.5rem_40px]">
|
||||
<div class="prices !text-[#343f52]">
|
||||
<div class="price price-show !justify-start"><span class="price-currency">$</span><span class="price-value">19</span> <span class="price-duration">mo</span></div>
|
||||
<div class="price price-hide price-hidden !justify-start"><span class="price-currency">$</span><span class="price-value">199</span> <span class="price-duration">yr</span></div>
|
||||
</div>
|
||||
<!--/.prices -->
|
||||
<h4 class="card-title !mt-2">Premium Plan</h4>
|
||||
<ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
|
||||
<li class="relative !pl-[1.25rem]"><i class="uil uil-check absolute left-0 text-[1.05rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
|
||||
<li class="relative !pl-[1.25rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 text-[1.05rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
|
||||
<li class="relative !pl-[1.25rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 text-[1.05rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
|
||||
<li class="relative !pl-[1.25rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 text-[1.05rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
|
||||
<li class="relative !pl-[1.25rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 text-[1.05rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
|
||||
</ul>
|
||||
<a href="#" class="btn btn-grape !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24] active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !text-[.85rem] !rounded-[.4rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.pricing -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full popular !mt-[30px]">
|
||||
<div class="pricing card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] !border-[#cfceea] after:border-b-[calc(0.4rem_-_6px)] after:border-t-[6px] after:content-[''] after:absolute after:rounded-t-[0.4rem] after:border-t-inherit after:border-b-transparent after:top-0 after:inset-x-0">
|
||||
<div class="card-body !p-[3rem_40px_3.5rem_40px]">
|
||||
<div class="prices !text-[#343f52]">
|
||||
<div class="price price-show !justify-start"><span class="price-currency">$</span><span class="price-value">49</span> <span class="price-duration">mo</span></div>
|
||||
<div class="price price-hide price-hidden !justify-start"><span class="price-currency">$</span><span class="price-value">499</span> <span class="price-duration">yr</span></div>
|
||||
</div>
|
||||
<!--/.prices -->
|
||||
<h4 class="card-title !mt-2">Corporate Plan</h4>
|
||||
<ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
|
||||
<li class="relative !pl-[1.25rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 text-[1.05rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
|
||||
<li class="relative !pl-[1.25rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 text-[1.05rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
|
||||
<li class="relative !pl-[1.25rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 text-[1.05rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
|
||||
<li class="relative !pl-[1.25rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 text-[1.05rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
|
||||
<li class="relative !pl-[1.25rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 text-[1.05rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
|
||||
</ul>
|
||||
<a href="#" class="btn btn-grape !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24] active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !text-[.85rem] !rounded-[.4rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.pricing -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<div class="flex flex-wrap mx-[-7.5px] !mt-[-50px] xl:!mt-0 lg:!mt-0 items-center">
|
||||
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] px-[7.5px] !mt-[50px] xl:!mt-0 lg:!mt-0 max-w-full">
|
||||
<figure class="m-0 p-0"><img class="w-auto" src="assets/img/illustrations/3d3.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] px-[7.5px] !mt-[50px] xl:!mt-0 lg:!mt-0 max-w-full !ml-auto">
|
||||
<h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35] !tracking-[0.02rem]">Let’s Talk</h2>
|
||||
<h3 class="xl:!text-[1.9rem] !text-[calc(1.315rem_+_0.78vw)] !leading-[1.25] font-semibold !mb-3">Let's make something great together. We are trusted by over 5000+ clients.</h3>
|
||||
<p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
|
||||
<a href="#" class="btn btn-grape !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24] active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded !mt-2">Join Us</a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#f0f0f8]">
|
||||
<div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
|
||||
<div class="flex flex-wrap mx-[-15px] !mb-8">
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
|
||||
<h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35] !tracking-[0.02rem]">Analyze Now</h2>
|
||||
<h3 class="xl:!text-[1.9rem] !text-[calc(1.315rem_+_0.78vw)] !leading-[1.25] font-semibold !mb-0">Wonder how much faster your website can go? Easily check your SEO Score now.</h3>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<form action="#">
|
||||
<div class="form-floating input-group relative">
|
||||
<input type="url" class="form-control border-0 relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" id="analyze">
|
||||
<label class="inline-block !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope" for="analyze">Enter Website URL</label>
|
||||
<button class="btn btn-grape !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24] active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)] hover:!translate-none" type="button">Analyze</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
<figure class="m-0 p-0"><img class="w-full max-w-full !h-auto" src="assets/img/photos/clouds.png" alt="image"></figure>
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="bg-[rgba(255,255,255)] opacity-100">
|
||||
<div class="container pt-8 xl:pt-10 lg:pt-10 md:pt-10 pb-7">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-0 lg:mx-0 !mt-[-30px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:px-0 lg:px-0 !mt-[30px]">
|
||||
<div class="widget">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
<p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">We are trusted by over 5000+ clients. Join them by using our services and grow your business.</p>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-[16.66666667%] lg:!ml-[16.66666667%] xl:px-0 lg:px-0 !mt-[30px]">
|
||||
<div class="widget">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="!mb-1">Phone</h5>
|
||||
<p class="!mb-0">00 (123) 456 78 90 <br>00 (987) 654 32 10</p>
|
||||
</div>
|
||||
</div>
|
||||
<!--/div -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:px-0 lg:px-0 !mt-[30px]">
|
||||
<div class="widget">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
|
||||
</div>
|
||||
<div class="!self-start !justify-start">
|
||||
<h5 class="!mb-1">Address</h5>
|
||||
<address class=" not-italic !leading-[inherit] !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
</div>
|
||||
</div>
|
||||
<!--/div -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<hr class="!mt-13 xl:!mt-[4.5rem] lg:!mt-[4.5rem] md:!mt-[4.5rem] !mb-7">
|
||||
<div class="xl:!flex lg:!flex md:!flex items-center justify-between">
|
||||
<p class="!mb-2 xl:!mb-0 lg:!mb-0">© 2025 Trunçgil. All rights reserved.</p>
|
||||
<nav class="nav social social-muted !mb-0 xl:!text-right lg:!text-right md:!text-right">
|
||||
<a class="m-[0_0_0_.7rem] max-md:m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-twitter before:content-['\ed59'] text-[1rem] !text-[#5daed5]"></i></a>
|
||||
<a class="m-[0_0_0_.7rem] max-md:m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] text-[1rem] !text-[#4470cf]"></i></a>
|
||||
<a class="m-[0_0_0_.7rem] max-md:m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] text-[1rem] !text-[#e94d88]"></i></a>
|
||||
<a class="m-[0_0_0_.7rem] max-md:m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] text-[1rem] !text-[#d53581]"></i></a>
|
||||
<a class="m-[0_0_0_.7rem] max-md:m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-youtube before:content-['\edb5'] text-[1rem] !text-[#c8312b]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<!-- progress wrapper -->
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/demo26 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 10:59:18 GMT -->
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,613 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/onepage by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:29 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body class="onepage">
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-gray ! bg-[rgba(246,247,249,1)] ">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent navbar-light">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item"><a class="nav-link scroll active" href="#home">Home</a></li>
|
||||
<li class="nav-item"><a class="nav-link scroll" href="#services">Services</a></li>
|
||||
<li class="nav-item"><a class="nav-link scroll" href="#process">Process</a></li>
|
||||
<li class="nav-item"><a class="nav-link scroll" href="#about">About</a></li>
|
||||
<li class="nav-item"><a class="nav-link scroll" href="#testimonials">Testimonials</a></li>
|
||||
<li class="nav-item"><a class="nav-link scroll" href="#contact">Contact</a></li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section id="home">
|
||||
<div class="wrapper bg-[rgba(246,247,249,1)] ">
|
||||
<div class="container pt-10 xl:pt-[4.5rem] lg:pt-[4.5rem] md:pt-[4.5rem] pb-[4.5rem] xl:pb-28 lg:pb-28 md:pb-28 !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px] !text-center">
|
||||
<div class="xl:w-9/12 lg:w-9/12 xxl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto" data-cues="zoomIn" data-group="welcome" data-interval="-200">
|
||||
<h2 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-4">Creative. Smart. Awesome.</h2>
|
||||
<p class="lead !text-[1.2rem] leading-normal md:!px-5 lg:!px-5 xl:!px-20 xxl:!px-10">We are an award winning web & mobile design agency that strongly believes in the power of creative ideas.</p>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] !text-center !mt-10">
|
||||
<div class="md:w-10/12 xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-[16.66666667%] lg:!ml-[16.66666667%] md:!ml-[8.33333333%]">
|
||||
<figure class="m-0 p-0"><img class="w-auto m-[0_auto]" src="assets/img/illustrations/i8.png" alt="image"></figure>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.wrapper -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section id="services">
|
||||
<div class="wrapper !bg-[#ffffff] ">
|
||||
<div class="container py-[4.5rem] xl:!py-28 lg:!py-28 md:!py-28">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-30px] !mb-10 items-center">
|
||||
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[30px] max-w-full xl:!order-2 lg:!order-2">
|
||||
<ul class="progress-list m-0 p-0 list-none">
|
||||
<li class="!mb-4">
|
||||
<p class="!mb-1">Marketing</p>
|
||||
<div class="progressbar line relative blue" data-value="100"></div>
|
||||
</li>
|
||||
<li class="!mb-4">
|
||||
<p class="!mb-1">Strategy</p>
|
||||
<div class="progressbar line relative yellow" data-value="80"></div>
|
||||
</li>
|
||||
<li class="!mb-4">
|
||||
<p class="!mb-1">Development</p>
|
||||
<div class="progressbar line relative orange" data-value="85"></div>
|
||||
</li>
|
||||
<li class="!mb-4">
|
||||
<p class="!mb-1">Data Analysis</p>
|
||||
<div class="progressbar line relative green" data-value="90"></div>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.progress-list -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[30px] max-w-full">
|
||||
<h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-5">The full service we are offering is specifically designed to meet your business needs and projects.</h3>
|
||||
<p>Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna, vel scelerisque nisl consectetur duis mollis commodo.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-30px] xl:!mt-0 lg:!mt-0 md:!mt-0 !text-center">
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] max-w-full max-md:!mt-[30px]">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 362.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/megaphone.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#3f78e0] text-blue !mb-3 m-[0_auto]"><path class="lineal-stroke" d="M343.4 302.9L61 302.5c-25.3-.2-47.5-16.8-54.8-40.9l-3.9-12.9c-7.1-24.2 2.5-50.3 23.5-64.2L262.1 29.8c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.3 249.8c2.4 6.4-.9 13.5-7.3 15.8-1.3.5-2.8.7-4.2.7zM261.8 59.4L39.3 205c-12 7.9-17.4 22.8-13.4 36.6l3.8 12.9c4.2 13.8 16.8 23.3 31.2 23.4l265.8.4-64.9-218.9z"></path><path class="lineal-stroke" d="M138 362.5c-40.4 0-72.8-31.1-73.6-70.8 0-6.8 5.5-12.3 12.3-12.3 6.6 0 12.1 5.2 12.3 11.8.6 26.2 22.1 46.7 49 46.7 14.2 0 27.7-6.2 37-16.9 4.5-5.1 12.2-5.7 17.4-1.2 5.1 4.5 5.7 12.2 1.2 17.4-14 16.1-34.3 25.3-55.6 25.3z"></path><path class="lineal-fill" d="M183.4 96l57.8 194.5 102.1.1-74.5-250.5L183.4 96z"></path><path class="lineal-stroke" d="M343.4 302.9l-102.1-.1c-5.4 0-10.2-3.6-11.8-8.8L171.6 99.5c-1.6-5.2.5-10.8 5.1-13.8l85.4-55.9c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.5 250.6c1.9 6.5-1.8 13.4-8.3 15.3-1.1.2-2.3.4-3.4.4zm-92.9-24.7l76.4.1-65.1-218.9-63.9 41.8 52.6 177z"></path><path class="lineal-stroke" d="M351.8 330.6c-5.4 0-10.2-3.6-11.8-8.8l-91-306c-2.1-6.5 1.3-13.4 7.8-15.6 6.5-2.1 13.4 1.3 15.6 7.8.1.3.2.5.2.8l91 305.9c1.9 6.5-1.8 13.4-8.3 15.3-1.1.4-2.3.6-3.5.6zM338 91.7c-6.8 0-12.3-5.5-12.3-12.3 0-1.8.4-3.6 1.2-5.3l13.4-28.5c2.9-6.2 10.2-8.8 16.4-5.9 6.2 2.9 8.8 10.2 5.9 16.4l-13.4 28.5c-2.1 4.3-6.4 7.1-11.2 7.1zm28.2 64.9c-6.8 0-12.3-5.5-12.3-12.3 0-5.7 3.9-10.6 9.4-12l31.1-7.5c6.6-1.5 13.2 2.6 14.7 9.3 1.5 6.5-2.5 13-9 14.7l-31.2 7.4c-.8.3-1.8.4-2.7.4zm29.1 90c-2.7 0-5.4-.9-7.5-2.6l-24.9-19.4c-5.4-4.2-6.3-11.9-2.2-17.3s11.9-6.3 17.3-2.2l24.9 19.4c5.4 4.2 6.3 11.9 2.1 17.3-2.3 3-5.9 4.7-9.7 4.8z"></path></svg>
|
||||
<h4>Marketing</h4>
|
||||
<p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus. Cras justo cum sociis natoque magnis.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] max-w-full max-md:!mt-[30px]">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/target.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#45c4a0] text-green !mb-3 m-[0_auto]"><circle class="lineal-fill" cx="283.8" cy="283.8" r="143"></circle><path class="lineal-stroke" d="M283.8 441.8c-87.1 0-158-70.9-158-158s70.9-158 158-158 158 70.9 158 158-70.9 158-158 158zm0-286.1c-70.7 0-128.1 57.3-128.1 128.1S213 411.9 283.8 411.9s128.1-57.3 128.1-128.1c-.1-70.7-57.4-128-128.1-128.1z"></path><path class="lineal-fill" d="M283.8 210.5c40.5 0 73.3 32.8 73.3 73.3s-32.8 73.3-73.3 73.3-73.3-32.8-73.3-73.3"></path><path class="lineal-stroke" d="M283.8 372.1c-48.7-.1-88.2-39.5-88.2-88.3.2-8.2 7.1-14.8 15.3-14.5 7.9.2 14.3 6.6 14.5 14.5 0 32.2 26.1 58.4 58.4 58.4s58.4-26.1 58.4-58.4-26.1-58.4-58.4-58.4c-8.2-.2-14.8-7.1-14.5-15.3.2-7.9 6.6-14.3 14.5-14.5 48.7-.5 88.7 38.6 89.2 87.3s-38.6 88.7-87.3 89.2h-1.9z"></path><path class="lineal-fill" d="M107.9 55.1l-5.3 47.5-47.5 5.3-40.2-40.1 52.9-52.9z"></path><path class="lineal-stroke" d="M283.8 55.7c-55.3 0-108.8 20.1-150.4 56.7l-15.2-15.2 4.5-40.4c.5-4.5-1.1-9-4.3-12.2L78.3 4.4c-5.8-5.8-15.3-5.8-21.1 0L4.4 57.2c-5.8 5.8-5.8 15.3 0 21.1l40.1 40.1c2.8 2.8 6.6 4.4 10.6 4.4.5 0 1.1 0 1.6-.1l40.4-4.5 15.2 15.2c-36.6 41.5-56.7 95-56.7 150.4C55.7 409.6 158 512 283.8 512c66.2 0 129.1-28.7 172.4-78.7 5.6-6.1 5.1-15.6-1-21.1s-15.6-5.1-21.1 1l-.5.5c-37.7 43.4-92.3 68.4-149.8 68.4-109.3 0-198.3-89-198.3-198.3 0-47.4 17-93.3 48-129.2l140.2 140.2c5.8 5.8 15.3 5.8 21.1 0s5.8-15.3 0-21.1L154.6 133.5c35.9-31 81.8-48 129.2-48 109.4 0 198.3 89 198.3 198.3 0 8.3 6.7 14.9 14.9 14.9s14.9-6.7 14.9-14.9C512 158 409.6 55.7 283.8 55.7zM36.1 67.8l31.7-31.7 24.5 24.5-3.2 28.5-28.5 3.2-24.5-24.5z"></path></svg>
|
||||
<h4>Strategy</h4>
|
||||
<p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus. Cras justo cum sociis natoque magnis.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] max-w-full max-md:!mt-[30px]">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 427.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/settings-3.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#fab758] text-yellow !mb-3 m-[0_auto]"><path class="lineal-fill" d="M186.9 353.4h138.3V413H186.9z"></path><path class="lineal-stroke" d="M460.2 0H51.8C23.2 0 0 23.2 0 51.7v264.4c0 28.6 23.2 51.7 51.8 51.8h120.6v30.7h-28.8c-8 0-14.5 6.5-14.5 14.5s6.5 14.5 14.5 14.5h224.9c8 0 14.5-6.5 14.5-14.5s-6.5-14.5-14.5-14.5h-28.8v-41.9c.3-1.2.4-2.4.4-3.6-.2-8-6.9-14.3-14.8-14.1H51.8C39.2 339 29 328.8 29 316.2V51.7c0-12.6 10.2-22.8 22.8-22.8h408.5c12.6 0 22.8 10.2 22.8 22.8v264.4c0 12.6-10.2 22.8-22.8 22.8h-46.7c-8 .2-14.3 6.9-14.1 14.8.2 8 6.9 14.3 14.8 14.1h45.9c28.6 0 51.7-23.2 51.8-51.7V51.7C512 23.2 488.8 0 460.2 0zM310.7 367.9v30.7H201.3v-30.7h109.4z"></path><path class="lineal-fill" d="M220.1 271.6c-12.7-19.8-6.9-46.3 12.9-59s46.3-6.9 59 12.9c9 14 9 32 0 46.1h100.6v-50.3l-30.4-4.9c-4.9-16.3-13.6-31.3-25.3-43.7l11-28.7-47.3-27.3-19.4 23.8c-16.6-3.9-33.9-3.9-50.5 0l-19.4-23.8-47.2 27.3 11 28.7c-11.7 12.4-20.3 27.4-25.3 43.7l-30.3 4.9v50.3h100.6z"></path><path class="lineal-stroke" d="M392.5 286.1H291.9c-8 0-14.5-6.5-14.5-14.5 0-2.8.8-5.5 2.3-7.8 8.4-13.1 4.6-30.6-8.6-39-13.1-8.4-30.6-4.6-39 8.6-5.9 9.3-5.9 21.1 0 30.4 4.3 6.7 2.4 15.7-4.3 20-2.3 1.5-5.1 2.3-7.8 2.3H119.4c-8 0-14.5-6.5-14.4-14.5v-50.3c0-7.1 5.2-13.1 12.2-14.3l21.8-3.5c4.7-12.2 11.3-23.6 19.5-33.7l-7.9-20.6c-2.5-6.6.1-14.1 6.3-17.7l47.3-27.3c6.2-3.5 14-2.1 18.5 3.4l13.9 17.1c12.9-2 26.1-2 39 0l13.9-17.1c4.5-5.5 12.3-7 18.5-3.4l47.3 27.3c6.2 3.6 8.8 11.1 6.3 17.7l-7.9 20.6c8.2 10.2 14.7 21.5 19.4 33.7l21.8 3.5c7 1.1 12.2 7.2 12.2 14.3v50.3c-.1 8-6.6 14.5-14.6 14.5zm-80-29h65.6v-23.5l-18.2-2.9c-5.5-.9-10-4.8-11.6-10.1-4.3-14.2-11.9-27.2-22-38-3.8-4-5-9.9-3-15.1l6.6-17.2-25.9-15-11.6 14.3c-3.5 4.3-9.1 6.2-14.5 5-14.5-3.3-29.5-3.3-43.9 0-5.4 1.2-11-.7-14.5-5l-11.6-14.3-25.9 15 6.6 17.2c2 5.2.8 11-3 15.1-10.1 10.8-17.7 23.8-22 38-1.6 5.3-6.1 9.2-11.6 10.1l-18.2 2.9v23.5h65.6c-.4-2.8-.6-5.7-.6-8.6.4-31.6 26.3-56.8 57.9-56.4 31 .4 56 25.4 56.4 56.4 0 2.9-.2 5.8-.6 8.6z"></path></svg>
|
||||
<h4>Development</h4>
|
||||
<p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus. Cras justo cum sociis natoque magnis.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] max-w-full max-md:!mt-[30px]">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 431.2" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/bar-chart.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#f78b77] text-orange !mb-3 m-[0_auto]"><path class="lineal-fill" d="M125.8 121.3h86.6v296.4h-86.6zM299 13.5h86.6v404.2H299z"></path><path class="lineal-stroke" d="M498.5 404.2h-11.8V161.7c0-7.5-6-13.5-13.5-13.5s-13.5 6-13.5 13.5v242.5h-59.6V94.3h73.1c7.4 0 13.5-6 13.5-13.5s-6-13.5-13.5-13.5h-74.1V13.5c0-7.4-6-13.5-13.5-13.5H299c-7.4 0-13.5 6-13.5 13.5v134.8h-59.7v-27c0-7.4-6-13.5-13.5-13.5h-73.6V33.7c0-7.4-6-13.5-13.5-13.5H38.7c-7.4 0-13.5 6-13.5 13.5v294.4c0 7.5 6 13.5 13.5 13.5s13.5-6 13.5-13.5V47.2h59.7v357.1H13.5c-7.4.2-13.3 6.4-13.1 13.8.2 7.2 6 12.9 13.1 13.1h485.1c7.4-.2 13.3-6.4 13.1-13.8-.3-7.2-6-13-13.2-13.2zM139.3 134.7H199v269.5h-59.7V134.7zm86.6 40.5h59.7v229h-59.7v-229zm86.6 229V27h59.7v377.2h-59.7z"></path></svg>
|
||||
<h4>Data Analysis</h4>
|
||||
<p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus. Cras justo cum sociis natoque magnis.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.wrapper -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section id="process">
|
||||
<div class="wrapper bg-[rgba(246,247,249,1)] ">
|
||||
<div class="container py-[4.5rem] xl:!py-28 lg:!py-28 md:!py-28">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] !mb-[4.5rem] xl:!mb-24 lg:!mb-24 md:!mb-24 items-center">
|
||||
<div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
|
||||
<figure class="m-0 p-0"><img class="w-auto" src="assets/img/illustrations/i3.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
|
||||
<h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">How It Works?</h2>
|
||||
<h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7 xxl:!pr-5">Everything you need on creating a business process.</h3>
|
||||
<div class="flex flex-row !mb-4">
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] text-[#3f78e0] !mr-4"><path class="lineal-fill" d="M160.9 221.3c-19.1 0-37.4-7.3-51.3-20.4l51.3 127.2 51.3-127.2c-13.9 13.1-32.3 20.4-51.3 20.4z"></path><path class="lineal-stroke" d="M160.9 339.9c-4.8 0-9.1-2.9-10.9-7.4L98.6 205.3c-2.5-6 .3-12.9 6.3-15.4 4.3-1.8 9.3-.9 12.7 2.4 24.3 22.9 62.2 22.9 86.5 0 4.7-4.5 12.1-4.3 16.6.3 3.2 3.4 4.2 8.3 2.4 12.7l-51.4 127.2c-1.7 4.5-6 7.4-10.8 7.4zm-27.5-111.3l27.5 68.1 27.5-68.1c-17.9 5.9-37.2 5.9-55 0z"></path><path class="lineal-stroke" d="M86.7 316.1c-5.9 0-10.9-4.4-11.7-10.2-2.2-16.6-9.8-23.9-22.3-36.1l-2.9-2.8C28.8 246.5 0 218.4 0 151.6c0-42.9 17.1-81.9 48-110C77.7 14.8 117.7 0 160.9 0s83.2 14.8 112.8 41.6c6.7 6.1 12.8 12.7 18.3 19.9 3.1 4.1 6 8.3 8.6 12.6 1.3 2.2 2.6 4.4 3.8 6.6 2.4 4.5 4.6 9.1 6.5 13.8 1.4 3.5 2.7 7.2 3.9 10.8 4.7 14.9 7 30.5 7 46.2 0 27.9-4.9 51.2-15 71.2-.6 1.2-1.2 2.4-1.8 3.5-1.8 3.3-3.8 6.5-5.9 9.6-.7 1-1.4 2-2 3-2.6 3.6-5.3 7.1-8.5 10.7-5.6 6.5-11.5 12.2-16.6 17.2-4.7 4.5-12.1 4.4-16.6-.2-4.5-4.7-4.4-12.1.2-16.6 5-4.9 10.2-9.9 15.2-15.7 2.6-3 4.9-6 7.1-9 .6-.8 1.1-1.6 1.7-2.4 1.7-2.5 3.3-5.2 4.7-7.8.5-.9 1-1.9 1.5-2.8 8.4-16.6 12.5-36.4 12.5-60.6 0-13.2-2-26.4-5.9-39.1-1-3.1-2.1-6.1-3.3-9.1-1.6-3.9-3.4-7.8-5.4-11.6-1-1.9-2.1-3.8-3.2-5.6-6.2-10.2-13.8-19.4-22.6-27.3-25.3-22.9-59.8-35.5-97-35.5S89.1 36.1 63.8 59c-26 23.5-40.3 56.4-40.3 92.5 0 56.9 22.7 79.1 42.8 98.6l2.8 2.7c13.4 13 26.1 25.2 29.3 49.9.9 6.4-3.7 12.4-10.1 13.2-.6.2-1.1.2-1.6.2z"></path><path class="lineal-fill" d="M141.9 397.8h38c3.8 0 7.4-1.5 10.1-4.2l13-13c2-2 3.4-4.6 3.9-7.4l12.4-63.7h-117l12.4 63.7c.6 2.8 2 5.4 4 7.4l13 13c2.7 2.7 6.3 4.2 10.2 4.2z"></path><path class="lineal-stroke" d="M179.8 409.6h-37.9c-6.9 0-13.6-2.7-18.5-7.7l-13-13c-3.7-3.7-6.2-8.4-7.2-13.5l-12.4-63.7c-1.2-6.4 2.9-12.5 9.3-13.8.7-.1 1.5-.2 2.2-.2h117c6.5 0 11.8 5.3 11.8 11.8 0 .8-.1 1.5-.2 2.2l-12.4 63.7c-1 5.1-3.5 9.8-7.2 13.5l-13 13c-4.8 4.9-11.5 7.7-18.5 7.7zm-63.2-88.4l9.7 49.7c.1.5.4 1 .7 1.4l13 13c.5.5 1.2.8 1.9.8h38c.7 0 1.4-.3 1.9-.8l13-13c.4-.4.6-.9.7-1.4l9.6-49.7h-88.5z"></path><path class="lineal-stroke" d="M241.5 321H80.2c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h161.4c6.5-.2 11.9 4.9 12.1 11.4.2 6.5-4.9 11.9-11.4 12.1h-.8zm-14.8 44.3H95c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h131.7c6.5.2 11.6 5.6 11.4 12.1-.2 6.2-5.2 11.2-11.4 11.4z"></path></svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Collect Ideas</h4>
|
||||
<p class="!mb-1">Nulla vitae elit libero pharetra augue dapibus.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-row !mb-4">
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 408.1 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/pie-chart-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] text-[#45c4a0] text-green !mr-4"><path class="lineal-stroke" d="M396.3 192.3h-33.4c-6.4 0-11.6-5.2-11.6-11.6 0-6.4 5.2-11.6 11.6-11.6h19.7C363.2 71.1 268.1 7.3 170.1 26.6c-4.2.8-8.4 1.8-12.6 2.9L235.1 169h72c6.4 0 11.6 5.2 11.6 11.6 0 6.4-5.2 11.6-11.6 11.6h-78.9c-4.2 0-8.1-2.3-10.1-6l-87.9-158c-3.1-5.6-1.1-12.6 4.5-15.7.7-.4 1.5-.7 2.3-1l8.1-2.5c107.8-33.1 222 27.4 255.1 135.2 2.7 8.7 4.8 17.6 6.3 26.6l1.3 8c1.1 6.3-3.2 12.3-9.5 13.3-.7.2-1.3.2-2 .2zM204.6 409.6c-20.4-.1-40.6-3.2-60.1-9.2l-8.1-2.5c-6.1-1.9-9.6-8.4-7.7-14.5.2-.8.6-1.5 1-2.2l88.4-158.3c2.1-3.7 5.9-5.9 10.1-5.9h33.2c6.4.2 11.4 5.5 11.2 11.9-.2 6.1-5.1 11.1-11.2 11.2H235l-78 139.8c96.8 26.3 196.6-30.9 222.9-127.8 1.1-4 2-8 2.8-12h-65.4c-6.4.2-11.7-4.8-11.9-11.2-.2-6.4 4.8-11.7 11.2-11.9h79.8c6.4 0 11.6 5.2 11.6 11.6 0 .6-.1 1.3-.2 1.9l-1.3 7.9C390 337 304.7 409.4 204.6 409.6z"></path><path class="lineal-fill" d="M93 361.8C6 300.1-14.5 179.6 47.1 92.6c12.7-17.9 28.4-33.5 46.3-46.2l6.2-4.4 90 161.7-90.4 162.5-6.2-4.4z"></path><path class="lineal-stroke" d="M99.2 377.8c-2.4 0-4.7-.7-6.7-2.1l-6.2-4.4C-5.9 305.9-27.7 178.2 37.7 86c13.5-19 30-35.5 49.1-48.9l6.2-4.4c5.2-3.7 12.4-2.4 16.1 2.8.2.3.5.7.7 1.1l90 161.7c1.9 3.5 1.9 7.8 0 11.3L109.4 372c-1.6 2.9-4.3 4.9-7.6 5.7-.8 0-1.7.1-2.6.1zM95.8 59C15.6 119.1-.7 232.9 59.4 313.1c10.2 13.7 22.4 25.8 36 36.1l81-145.4L95.8 59z"></path></svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Data Analysis</h4>
|
||||
<p class="!mb-1">Vivamus sagittis lacus augue laoreet vel.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 332.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/design.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] text-[#fab758] text-yellow !mr-4"><path class="lineal-stroke" d="M350.9 54.2H58.7c-6.2.2-11.4-4.7-11.5-10.9S51.8 31.9 58 31.7h292.9c6.2-.2 11.4 4.7 11.5 10.9s-4.7 11.4-10.9 11.5c-.2.1-.4.1-.6.1zM239.8 328.9a11.182 11.182 0 01-10.6-14.8c2.8-8.3 16.2-47.4 25.6-63.6-9.5-10.1-37-40.3-49.9-66.1-12.1 23.4-39.5 54.4-50.1 66 10.1 16.5 22.7 54.9 25.4 63.6.4 1.2.6 2.4.6 3.7 0 6.2-5 11.2-11.2 11.2-4.9 0-9.3-3.2-10.7-7.9v-.1c-6.6-20.7-18.4-52.9-24.3-60.3-4.8-6.1-3.4-14.5-.8-19.8.5-.9 1.1-1.8 1.8-2.6 20.6-22.3 50.7-59.4 52.7-72.4.6-3.7 3.3-10.1 14.8-10.7 12.5-.7 16.6 4.8 17.8 9.4 5.7 21.5 40 60.3 52.7 73.4.8.8 1.5 1.8 2 2.8 2.6 5.1 4 13.3-.5 19.5-5.7 7.7-18.2 41.6-24.8 61.1-1.3 4.6-5.6 7.7-10.5 7.6z"></path><path class="lineal-stroke" d="M204.8 254.9c-6.2 0-11.2-5-11.2-11.2V167c.3-6.2 5.6-10.9 11.8-10.6 5.7.3 10.3 4.9 10.6 10.6v76.7c0 6.2-5 11.2-11.2 11.2z"></path><path class="lineal-stroke" d="M366.6 244.6c-6.2 0-11.2-5-11.2-11.2v-28.6c0-83.1-67.6-150.6-150.6-150.6S54.2 121.7 54.2 204.8v28.6c-.2 6.2-5.4 11.1-11.5 10.9-5.9-.2-10.7-4.9-10.9-10.9v-28.6c-.1-95.5 77.2-172.9 172.7-173 46 0 90.1 18.2 122.6 50.8 32.6 32.3 50.9 76.3 50.9 122.2v28.6c-.1 6.2-5.2 11.2-11.4 11.2z"></path><path class="lineal-fill" d="M220 74.7h-30.4c-9.1 0-16.5-7.4-16.5-16.5V27.7c0-9.1 7.4-16.5 16.5-16.5H220c9.1 0 16.5 7.4 16.5 16.5v30.5c0 9.1-7.4 16.5-16.5 16.5z"></path><path class="lineal-stroke" d="M220 85.9h-30.4c-15.3 0-27.7-12.4-27.7-27.7V27.7c0-15.3 12.4-27.7 27.7-27.7H220c15.3 0 27.7 12.4 27.7 27.7v30.5c0 15.3-12.4 27.7-27.7 27.7zm-30.4-63.5c-2.9 0-5.3 2.4-5.3 5.3v30.5c0 2.9 2.4 5.3 5.3 5.3H220c2.9 0 5.3-2.4 5.3-5.3V27.7c0-2.9-2.4-5.3-5.3-5.3h-30.4z"></path><path class="lineal-fill" d="M381.9 275.4h-30.5c-9.1 0-16.5-7.4-16.5-16.5v-30.5c0-9.1 7.4-16.5 16.5-16.5h30.5c9.1 0 16.5 7.4 16.5 16.5v30.5c0 9.1-7.4 16.5-16.5 16.5z"></path><path class="lineal-stroke" d="M381.9 286.6h-30.5c-15.3 0-27.7-12.4-27.7-27.7v-30.5c0-15.3 12.4-27.7 27.7-27.7h30.5c15.3 0 27.7 12.4 27.7 27.7v30.5c0 15.3-12.4 27.7-27.7 27.7zm-30.5-63.4c-2.9 0-5.3 2.4-5.3 5.3V259c0 2.9 2.4 5.3 5.3 5.3h30.5c2.9 0 5.3-2.4 5.3-5.3v-30.5c0-2.9-2.4-5.3-5.3-5.3h-30.5z"></path><path class="lineal-fill" d="M58.2 275.4H27.7c-9.1 0-16.5-7.4-16.5-16.5v-30.5c0-9.1 7.4-16.5 16.5-16.5h30.5c9.1 0 16.5 7.4 16.5 16.5V259c0 9.1-7.4 16.5-16.5 16.4z"></path><path class="lineal-stroke" d="M58.2 286.6H27.7C12.4 286.6 0 274.2 0 258.9v-30.5c0-15.3 12.4-27.7 27.7-27.7h30.5c15.3 0 27.7 12.4 27.7 27.7v30.5c0 15.3-12.4 27.7-27.7 27.7zm-30.5-63.4c-2.9 0-5.3 2.4-5.3 5.3V259c0 2.9 2.4 5.3 5.3 5.3h30.5c2.9 0 5.3-2.4 5.3-5.3v-30.5c0-2.9-2.4-5.3-5.3-5.3H27.7zm234.1 109.5h-114c-6.2 0-11.2-5-11.2-11.2 0-6.2 5-11.2 11.2-11.2h114c6.2 0 11.2 5 11.2 11.2 0 6.2-5 11.2-11.2 11.2z"></path></svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Magic Touch</h4>
|
||||
<p class="!mb-0">Cras mattis consectetur purus sit amet.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center">
|
||||
<div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full xl:!order-2 lg:!order-2">
|
||||
<figure class="m-0 p-0"><img class="w-auto" src="assets/img/illustrations/i2.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
|
||||
<h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">Why Choose Us?</h2>
|
||||
<h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7">A few reasons why our valued customers choose us.</h3>
|
||||
<div class="accordion accordion-wrapper" id="accordionExample">
|
||||
<div class="card plain accordion-item">
|
||||
<div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingOne">
|
||||
<button class="accordion-button hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> Professional Design </button>
|
||||
</div>
|
||||
<!--/.card-header -->
|
||||
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
|
||||
<div class="card-body flex-[1_1_auto] pb-4">
|
||||
<p>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel.</p>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.accordion-collapse -->
|
||||
</div>
|
||||
<!--/.accordion-item -->
|
||||
<div class="card plain accordion-item">
|
||||
<div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingTwo">
|
||||
<button class="collapsed hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> Top-Notch Support </button>
|
||||
</div>
|
||||
<!--/.card-header -->
|
||||
<div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
|
||||
<div class="card-body flex-[1_1_auto] pb-4">
|
||||
<p>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel.</p>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.accordion-collapse -->
|
||||
</div>
|
||||
<!--/.accordion-item -->
|
||||
<div class="card plain accordion-item">
|
||||
<div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingThree">
|
||||
<button class="collapsed hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"> Header and Slider Options </button>
|
||||
</div>
|
||||
<!--/.card-header -->
|
||||
<div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
|
||||
<div class="card-body flex-[1_1_auto] pb-4">
|
||||
<p>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel.</p>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.accordion-collapse -->
|
||||
</div>
|
||||
<!--/.accordion-item -->
|
||||
</div>
|
||||
<!--/.accordion -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.wrapper -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section id="about">
|
||||
<div class="wrapper !bg-[#ffffff] ">
|
||||
<div class="container py-[4.5rem] xl:!py-28 lg:!py-28 md:!py-28">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
|
||||
<h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">Meet the Team</h2>
|
||||
<h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-5">Save your time and money by choosing our professional team.</h3>
|
||||
<p>Donec id elit non mi porta gravida at eget metus. Morbi leo risus, porta ac consectetur ac, vestibulum at eros tempus porttitor.</p>
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Members</a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
|
||||
<div class="swiper-container !text-center !mb-6" data-margin="30" data-dots="true" data-items-xl="3" data-items-md="2" data-items-xs="1">
|
||||
<div class="swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<div class="swiper-slide">
|
||||
<img class="rounded-[50%] w-40 !mx-auto !mb-4" src="assets/img/avatars/t1.jpg" alt="image">
|
||||
<h4 class="!mb-1">Cory Zamora</h4>
|
||||
<div class="!text-[0.65rem] uppercase !tracking-[0.02rem] font-bold !text-[#aab0bc] !mb-2">Marketing Specialist</div>
|
||||
<p class="!mb-2">Etiam porta sem magna malesuada mollis.</p>
|
||||
<nav class="nav social justify-center !text-center !mb-0">
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-twitter before:content-['\ed59'] text-[1rem] !text-[#5daed5]"></i></a>
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-slack before:content-['\ecdd'] text-[1rem] !text-[#d4135c]"></i></a>
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-linkedin before:content-['\ebd1'] text-[1rem] !text-[#3393c1]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<img class="rounded-[50%] w-40 !mx-auto !mb-4" src="assets/img/avatars/t2.jpg" alt="image">
|
||||
<h4 class="!mb-1">Coriss Ambady</h4>
|
||||
<div class="!text-[0.65rem] uppercase !tracking-[0.02rem] font-bold !text-[#aab0bc] !mb-2">Financial Analyst</div>
|
||||
<p class="!mb-2">Aenean eu leo quam. Pellentesque ornare lacinia.</p>
|
||||
<nav class="nav social justify-center !text-center !mb-0">
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-youtube before:content-['\edb5'] text-[1rem] !text-[#c8312b]"></i></a>
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] text-[1rem] !text-[#4470cf]"></i></a>
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] text-[1rem] !text-[#e94d88]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<img class="rounded-[50%] w-40 !mx-auto !mb-4" src="assets/img/avatars/t3.jpg" alt="image">
|
||||
<h4 class="!mb-1">Nikolas Brooten</h4>
|
||||
<div class="!text-[0.65rem] uppercase !tracking-[0.02rem] font-bold !text-[#aab0bc] !mb-2">Sales Manager</div>
|
||||
<p class="!mb-2">Donec ornare elit quam porta gravida at eget.</p>
|
||||
<nav class="nav social justify-center !text-center !mb-0">
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-linkedin before:content-['\ebd1'] text-[1rem] !text-[#3393c1]"></i></a>
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-tumblr-square before:content-['\ed54'] text-[1rem] !text-[#5d82a4]"></i></a>
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] text-[1rem] !text-[#4470cf]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<img class="rounded-[50%] w-40 !mx-auto !mb-4" src="assets/img/avatars/t4.jpg" alt="image">
|
||||
<h4 class="!mb-1">Jackie Sanders</h4>
|
||||
<div class="!text-[0.65rem] uppercase !tracking-[0.02rem] font-bold !text-[#aab0bc] !mb-2">Investment Planner</div>
|
||||
<p class="!mb-2">Nullam risus eget urna mollis ornare vel eu leo.</p>
|
||||
<nav class="nav social justify-center !text-center !mb-0">
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-twitter before:content-['\ed59'] text-[1rem] !text-[#5daed5]"></i></a>
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] text-[1rem] !text-[#4470cf]"></i></a>
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] text-[1rem] !text-[#e94d88]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<img class="rounded-[50%] w-40 !mx-auto !mb-4" src="assets/img/avatars/t5.jpg" alt="image">
|
||||
<h4 class="!mb-1">Tina Geller</h4>
|
||||
<div class="!text-[0.65rem] uppercase !tracking-[0.02rem] font-bold !text-[#aab0bc] !mb-2">Assistant Buyer</div>
|
||||
<p class="!mb-2">Vivamus sagittis lacus vel augue laoreet rutrum.</p>
|
||||
<nav class="nav social justify-center !text-center !mb-0">
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] text-[1rem] !text-[#4470cf]"></i></a>
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-slack before:content-['\ecdd'] text-[1rem] !text-[#d4135c]"></i></a>
|
||||
<a class="m-[0_.7rem_0_0] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] text-[1rem] !text-[#e94d88]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
</div>
|
||||
<!--/.swiper-wrapper -->
|
||||
</div>
|
||||
<!-- /.swiper -->
|
||||
</div>
|
||||
<!-- /.swiper-container -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.wrapper -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section id="testimonials">
|
||||
<div class="wrapper bg-[rgba(246,247,249,1)] ">
|
||||
<div class="container py-[4.5rem] xl:!py-28 lg:!py-28 md:!py-28">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-30px] !mb-20 items-center">
|
||||
<div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[70px] max-w-full xl:!order-2 lg:!order-2">
|
||||
<figure class="m-0 p-0"><img class="w-auto" src="assets/img/illustrations/i4.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[70px] max-w-full xl:!mt-[4.5rem] lg:!mt-[4.5rem]">
|
||||
<div class="swiper-container dots-closer !mb-6" data-margin="30" data-dots="true">
|
||||
<div class="swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<div class="swiper-slide">
|
||||
<blockquote class="icon icon-top text-[1rem] !text-center relative pt-[3.75rem] p-0 border-0 !leading-[1.7] font-medium m-[0_0_1rem] before:translate-x-[-52%] before:left-2/4 before:content-['\201c'] before:!text-[#aab0bc] before:opacity-30 before:text-[6.5rem] before:font-normal before:absolute before:leading-none before:z-[1] before:top-0">
|
||||
<p>“Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vestibulum ligula porta felis euismod semper. Cras justo odio consectetur.”</p>
|
||||
<div class="flex items-center justify-center !text-center">
|
||||
<div class="info !pl-0">
|
||||
<h5 class="!mb-1 text-[.95rem] !leading-[1.5]">Coriss Ambady</h5>
|
||||
<p class="!mb-0 text-[0.8rem]">Financial Analyst</p>
|
||||
</div>
|
||||
</div>
|
||||
</blockquote>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<blockquote class="icon icon-top text-[1rem] !text-center relative pt-[3.75rem] p-0 border-0 !leading-[1.7] font-medium m-[0_0_1rem] before:translate-x-[-52%] before:left-2/4 before:content-['\201c'] before:!text-[#aab0bc] before:opacity-30 before:text-[6.5rem] before:font-normal before:absolute before:leading-none before:z-[1] before:top-0">
|
||||
<p>“Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vestibulum ligula porta felis euismod semper. Cras justo odio consectetur.”</p>
|
||||
<div class="flex items-center justify-center !text-center">
|
||||
<div class="info !pl-0">
|
||||
<h5 class="!mb-1 text-[.95rem] !leading-[1.5]">Cory Zamora</h5>
|
||||
<p class="!mb-0 text-[0.8rem]">Marketing Specialist</p>
|
||||
</div>
|
||||
</div>
|
||||
</blockquote>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<blockquote class="icon icon-top text-[1rem] !text-center relative pt-[3.75rem] p-0 border-0 !leading-[1.7] font-medium m-[0_0_1rem] before:translate-x-[-52%] before:left-2/4 before:content-['\201c'] before:!text-[#aab0bc] before:opacity-30 before:text-[6.5rem] before:font-normal before:absolute before:leading-none before:z-[1] before:top-0">
|
||||
<p>“Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vestibulum ligula porta felis euismod semper. Cras justo odio consectetur.”</p>
|
||||
<div class="flex items-center justify-center !text-center">
|
||||
<div class="info !pl-0">
|
||||
<h5 class="!mb-1 text-[.95rem] !leading-[1.5]">Nikolas Brooten</h5>
|
||||
<p class="!mb-0 text-[0.8rem]">Sales Manager</p>
|
||||
</div>
|
||||
</div>
|
||||
</blockquote>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
</div>
|
||||
<!--/.swiper-wrapper -->
|
||||
</div>
|
||||
<!-- /.swiper -->
|
||||
</div>
|
||||
<!-- /.swiper-container -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<div class="xl:!px-5 lg:!px-5">
|
||||
<div class="flex flex-wrap mx-0 md:mx-[-20px] lg:mx-[-20px] xl:mx-[-35px] !mt-[-40px] items-center">
|
||||
<div class="w-4/12 xl:w-2/12 lg:w-2/12 md:w-2/12 flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
|
||||
<figure class="px-5 md:!px-0 lg:!px-2 xl:!px-3 xxl:!px-4"><img src="assets/img/brands/c1.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="w-4/12 xl:w-2/12 lg:w-2/12 md:w-2/12 flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
|
||||
<figure class="px-5 md:!px-0 lg:!px-2 xl:!px-3 xxl:!px-4"><img src="assets/img/brands/c2.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="w-4/12 xl:w-2/12 lg:w-2/12 md:w-2/12 flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
|
||||
<figure class="px-5 md:!px-0 lg:!px-2 xl:!px-3 xxl:!px-4"><img src="assets/img/brands/c3.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="w-4/12 xl:w-2/12 lg:w-2/12 md:w-2/12 flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
|
||||
<figure class="px-5 md:!px-0 lg:!px-2 xl:!px-3 xxl:!px-4"><img src="assets/img/brands/c4.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="w-4/12 xl:w-2/12 lg:w-2/12 md:w-2/12 flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
|
||||
<figure class="px-5 md:!px-0 lg:!px-2 xl:!px-3 xxl:!px-4"><img src="assets/img/brands/c5.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="w-4/12 xl:w-2/12 lg:w-2/12 md:w-2/12 flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
|
||||
<figure class="px-5 md:!px-0 lg:!px-2 xl:!px-3 xxl:!px-4"><img src="assets/img/brands/c6.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /div -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.wrapper -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section id="contact">
|
||||
<div class="wrapper !bg-[#ffffff] ">
|
||||
<div class="container py-[4.5rem] xl:!py-28 lg:!py-28 md:!py-28">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center">
|
||||
<div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
|
||||
<figure class="m-0 p-0"><img class="w-auto" src="assets/img/illustrations/i5.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
|
||||
<h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">Get In Touch</h2>
|
||||
<h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7">Got any questions? Don't hesitate to get in touch.</h3>
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="!mb-1">Address</h5>
|
||||
<address class=" not-italic !leading-[inherit] !mb-4">Moonshine St. 14/05 Light City, London</address>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="!mb-1">Phone</h5>
|
||||
<p>00 (123) 456 78 90</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="!mb-1">E-mail</h5>
|
||||
<p class="!mb-0"><a href="mailto:Trunçgil@email.com" class="!text-[#60697b]">Trunçgil@email.com</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.wrapper -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/onepage by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:29 GMT -->
|
||||
</html>
|
||||
@@ -0,0 +1,954 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/page-loader by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:27 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-soft-primary !bg-[#edf2fc]">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent navbar-light">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="wrapper !bg-[#edf2fc]">
|
||||
<div class="container pt-10 pb-36 xl:pt-[4.5rem] lg:pt-[4.5rem] md:pt-[4.5rem] xl:pb-40 lg:pb-40 md:pb-40 !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="md:w-8/12 lg:w-7/12 xl:w-6/12 xxl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !mb-14">
|
||||
<h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3">Page Loader</h1>
|
||||
<p class="lead text-[0.9rem] font-medium !mb-3">To enable page loader, after body tag, add:</p>
|
||||
<mark class="doc"><div class="page-loader"></div></mark>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff] angled upper-end !relative border-0 before:top-[-4rem] before:border-l-transparent before:border-r-[100vw] before:border-t-[4rem] before:border-[#fefefe] before:content-[''] before:block before:absolute before:z-0 before:!border-y-transparent before:border-0 before:border-solid before:right-0 after:top-[-4rem] after:border-l-transparent after:border-r-[100vw] after:border-t-[4rem] after:border-[#fefefe] after:content-[''] after:block after:absolute after:z-0 after:!border-y-transparent after:border-0 after:border-solid after:right-0">
|
||||
<div class="container !pb-[4.5rem] xl:!pb-24 lg:!pb-24 md:!pb-24">
|
||||
<div class="flex flex-wrap mx-[-15px] !mb-8">
|
||||
<div class="w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[-10rem]">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/about5.jpg" alt="image"></figure>
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="xl:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<div class="card image-wrapper bg-full bg-image bg-overlay bg-overlay-400 !text-white !mt-[-1.25rem] xl:!mt-0 lg:!mt-0 xl:-translate-y-2/4 lg:-translate-y-2/4 bg-cover [background-size:100%] bg-[center_center] bg-no-repeat !bg-scroll !relative z-0 before:rounded-[0.4rem] before:bg-[rgba(30,34,40,.4)] before:content-[''] before:block before:absolute before:z-[1] before:w-full before:h-full before:left-0 before:top-0" data-image-src="assets/img/photos/bg3.jpg">
|
||||
<div class="card-body p-[2.25rem] xl:!p-[2.5rem]">
|
||||
<div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-20px] !text-center">
|
||||
<div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
|
||||
<h3 class="counter counter-lg !text-white xl:!text-[2.2rem] !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2">7518</h3>
|
||||
<p class="!text-[0.8rem] font-medium !mb-0 !text-white">Completed Projects</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
|
||||
<h3 class="counter counter-lg !text-white xl:!text-[2.2rem] !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2">3472</h3>
|
||||
<p class="!text-[0.8rem] font-medium !mb-0 !text-white">Satisfied Customers</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
|
||||
<h3 class="counter counter-lg !text-white xl:!text-[2.2rem] !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2">2184</h3>
|
||||
<p class="!text-[0.8rem] font-medium !mb-0 !text-white">Expert Employees</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
|
||||
<h3 class="counter counter-lg !text-white xl:!text-[2.2rem] !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2">4523</h3>
|
||||
<p class="!text-[0.8rem] font-medium !mb-0 !text-white">Awards Won</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.card -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-20px] lg:mx-[-20px] !mt-[25px] md:!mt-[4.5rem] lg:!mt-0 xl:!mt-0 !mb-20 items-center">
|
||||
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] px-[20px] !mt-[40px] max-w-full xl:!order-2 lg:!order-2">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !mt-[25px] max-w-full xl:!ml-[16.66666667%] lg:!ml-[16.66666667%] md:!ml-[16.66666667%] !self-end">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/g1.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !mt-[25px] max-w-full !self-end">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/g2.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !mt-[25px] max-w-full xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] md:!ml-[8.33333333%]">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/g3.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !mt-[25px] max-w-full !self-start">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/g4.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[20px] lg:!px-[20px] !px-[15px] !mt-[40px] max-w-full">
|
||||
<h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3">What We Do?</h2>
|
||||
<p class="lead !mb-8 xxl:!pr-2 !text-[1.05rem] !leading-[1.6]">The full service we are offering is <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">specifically</span> designed to meet your business needs and projects.</p>
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-25px] !mt-[-30px]">
|
||||
<div class="md:w-6/12 lg:w-full xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[25px] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon btn btn-circle btn-lg btn-soft-primary pointer-events-none !mr-5 xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none p-0 !rounded-[100%]"> <i class="!text-[calc(1.255rem_+_0.06vw)] before:content-['\ec50'] uil uil-phone-volume"></i> </div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">24/7 Support</h4>
|
||||
<p class="!mb-0">Nulla vitae elit libero pharetra augue dapibus.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-full xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[25px] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon btn btn-circle btn-lg btn-soft-primary pointer-events-none !mr-5 xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none p-0 !rounded-[100%]"> <i class="!text-[calc(1.255rem_+_0.06vw)] before:content-['\ecb3'] uil uil-shield-exclamation"></i> </div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Secure Payments</h4>
|
||||
<p class="!mb-0">Vivamus sagittis lacus augue laoreet vel.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-full xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[25px] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon btn btn-circle btn-lg btn-soft-primary pointer-events-none !mr-5 xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none p-0 !rounded-[100%]"> <i class="!text-[calc(1.255rem_+_0.06vw)] before:content-['\ebb2'] uil uil-laptop-cloud"></i> </div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Daily Updates</h4>
|
||||
<p class="!mb-0">Cras mattis consectetur purus sit amet.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-full xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[25px] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon btn btn-circle btn-lg btn-soft-primary pointer-events-none !mr-5 xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none p-0 !rounded-[100%]"> <i class="!text-[calc(1.255rem_+_0.06vw)] before:content-['\e9d3'] uil uil-chart-line"></i> </div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Market Research</h4>
|
||||
<p class="!mb-0">Aenean lacinia bibendum nulla sed consectetur.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3">How We Do It?</h2>
|
||||
<p class="lead !mb-8 !text-[1.05rem] !leading-[1.6]">We make your spending <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">stress-free</span> for you to have the perfect control.</p>
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-30px] process-wrapper line">
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full !relative after:w-full after:absolute after:content-[''] after:h-px after:z-[1] after:border-t-[rgba(164,174,198,0.2)] after:border-t after:border-solid after:left-[3rem] after:top-6 after:bg-inherit max-lg:after:!hidden"> <span class="icon btn btn-circle btn-lg btn-soft-primary pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none !p-0 !rounded-[100%]"><span class="number">01</span></span>
|
||||
<h4 class="!mb-1">Concept</h4>
|
||||
<p>Nulla vitae elit libero elit non porta gravida eget metus cras. Aenean eu leo quam. Pellentesque ornare.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full !relative after:w-full after:absolute after:content-[''] after:h-px after:z-[1] after:border-t-[rgba(164,174,198,0.2)] after:border-t after:border-solid after:left-[3rem] after:top-6 after:bg-inherit max-lg:after:!hidden"> <span class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none p-0 !rounded-[100%]"><span class="number">02</span></span>
|
||||
<h4 class="!mb-1">Prepare</h4>
|
||||
<p>Vestibulum id ligula porta felis euismod semper. Sed posuere consectetur est at lobortis.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full !relative after:w-full after:absolute after:content-[''] after:h-px after:z-[1] after:border-t-[rgba(164,174,198,0.2)] after:border-t after:border-solid after:left-[3rem] after:top-6 after:bg-inherit max-lg:after:!hidden"> <span class="icon btn btn-circle btn-lg btn-soft-primary pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none !p-0 !rounded-[100%]"><span class="number">03</span></span>
|
||||
<h4 class="!mb-1">Retouch</h4>
|
||||
<p>Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Nulla vitae elit libero.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full"> <span class="icon btn btn-circle btn-lg btn-soft-primary pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none !p-0 !rounded-[100%]"><span class="number">04</span></span>
|
||||
<h4 class="!mb-1">Finalize</h4>
|
||||
<p>Integer posuere erat, consectetur adipiscing elit. Fusce dapibus, tellus ac cursus commodo.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper image-wrapper bg-image bg-overlay bg-no-repeat bg-[center_center] bg-cover !relative z-0 !bg-fixed before:content-[''] before:block before:absolute before:z-[1] before:w-full before:h-full before:left-0 before:top-0 before:bg-[rgba(30,34,40,.5)]" data-image-src="assets/img/photos/bg1.jpg">
|
||||
<div class="container py-[8rem] !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="lg:w-10/12 xl:w-10/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<a href="https://www.youtube.com/watch?v=26TbMXXOe0I" class="btn btn-circle btn-white btn-play ripple !mx-auto !mb-5 !relative z-[2] xl:!text-[2.3rem] !w-[3.5rem] !h-[3.5rem] !text-[calc(1.355rem_+_1.26vw)] hover:translate-y-0 inline-flex items-center justify-center leading-none p-0 !rounded-[100%] before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#ffffff] after:content-[''] after:block after:absolute after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#ffffff]" data-glightbox><i class="icn-caret-right !ml-[0.15rem] !relative z-[2] before:content-['\e900'] !text-[calc(1.355rem_+_1.26vw)]"></i></a>
|
||||
<h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] lg:!px-10 xl:!px-16 xxl:!px-10 !mb-10 !text-white !relative z-[2]">Find out everything you need to know about creating a business process model.</h2>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff] angled upper-end !relative border-0 before:top-[-4rem] before:border-l-transparent before:border-r-[100vw] before:border-t-[4rem] before:border-[#fefefe] before:content-[''] before:block before:absolute before:z-0 before:!border-y-transparent before:border-0 before:border-solid before:right-0 after:border-[#fefefe] after:content-[''] after:block after:absolute after:z-0 after:!border-y-transparent after:border-0 after:border-solid after:right-0">
|
||||
<div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-30px] !mb-10 xl:!mb-[8rem] lg:!mb-[8rem] md:!mb-[8rem]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[30px]">
|
||||
<h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] xl:!mt-32 lg:!mt-32 !mb-3">Our Pricing</h2>
|
||||
<p class="lead !text-[1.05rem] !leading-[1.6] font-medium">We offer <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">great prices</span>, premium and quality products for your business.</p>
|
||||
<p>Enjoy a <a href="#" class="hover">free 30-day trial</a> and experience the full service. No credit card required!</p>
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Prices</a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] pricing-wrapper !mt-[30px]">
|
||||
<div class="flex flex-wrap items-center switcher xl:!justify-end lg:!justify-end">
|
||||
<p class="!mb-0 !pr-[.75rem]">Monthly</p>
|
||||
<div class="pricing-switchers w-8 h-4 clear-both !text-center !relative bg-[rgba(30,34,40,0.07)] !box-content rounded-3xl border-[0.2rem] border-solid border-transparent">
|
||||
<div class="pricing-switcher pricing-switcher-active cursor-pointer w-full float-left h-4 leading-4 !relative z-[888] transition-[0.3s] duration-[ease-in-out] uppercase !text-white"></div>
|
||||
<div class="pricing-switcher cursor-pointer w-full float-left h-4 leading-4 !relative z-[888] transition-[0.3s] duration-[ease-in-out] uppercase"></div>
|
||||
<div class="h-4 w-4 block absolute z-[555] transition-[0.3s] duration-[ease-in-out] m-0 rounded-[100%] border-[none] left-0 top-0 !bg-[rgba(63,120,224)] opacity-100 switcher-button"></div>
|
||||
</div>
|
||||
<p class="!mb-0 !pl-3 !relative">Yearly <span class="!text-[#e2626b]">(Save 30%)</span></p>
|
||||
</div>
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[25px] !relative">
|
||||
<div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] !absolute z-[1] opacity-50 !px-[15px] !mt-[30px]" data-rellax-speed="1" style="bottom: -0.5rem; right: -1.6rem;"></div>
|
||||
<div class="shape !rounded-[50%] bg-line red rellax !w-[8rem] !h-[8rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -1rem; left: -2rem;"></div>
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="pricing card">
|
||||
<div class="card-body pb-14">
|
||||
<div class="prices !text-[#343f52]">
|
||||
<div class="price price-show !justify-start"><span class="price-currency">$</span><span class="price-value">19</span> <span class="price-duration">mo</span></div>
|
||||
<div class="price price-hide price-hidden !justify-start"><span class="price-currency">$</span><span class="price-value">199</span> <span class="price-duration">yr</span></div>
|
||||
</div>
|
||||
<!--/.prices -->
|
||||
<h4 class="card-title !mt-2">Premium Plan</h4>
|
||||
<ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
|
||||
</ul>
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.pricing -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full popular !mt-[30px]">
|
||||
<div class="pricing card">
|
||||
<div class="card-body pb-14">
|
||||
<div class="prices !text-[#343f52]">
|
||||
<div class="price price-show !justify-start"><span class="price-currency">$</span><span class="price-value">49</span> <span class="price-duration">mo</span></div>
|
||||
<div class="price price-hide price-hidden !justify-start"><span class="price-currency">$</span><span class="price-value">499</span> <span class="price-duration">yr</span></div>
|
||||
</div>
|
||||
<!--/.prices -->
|
||||
<h4 class="card-title !mt-2">Corporate Plan</h4>
|
||||
<ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
|
||||
</ul>
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.pricing -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-50px] xl:mx-[-35px] lg:mx-[-20px] items-center">
|
||||
<div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative">
|
||||
<div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"></div>
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] px-[12.5px] !mt-[25px] max-w-full">
|
||||
<figure class="!rounded-[.4rem] xl:!mt-10 lg:!mt-10 md:!mt-10 !relative"><img class="!rounded-[.4rem]" src="assets/img/photos/g5.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] px-[12.5px] !mt-[25px] max-w-full">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
|
||||
<div class="w-full flex-[0_0_auto] px-[12.5px] !mt-[25px] max-w-full xl:!order-2 lg:!order-2 md:!order-2">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/g6.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-10/12 lg:w-10/12 md:w-10/12 w-full flex-[0_0_auto] px-[12.5px] !mt-[25px] max-w-full">
|
||||
<div class="card !bg-[#e0e9fa] !text-center">
|
||||
<div class="card-body !py-12 !px-[2rem] counter-wrapper">
|
||||
<h3 class="counter !whitespace-nowrap xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">5000+</h3>
|
||||
<p class="!mb-0 text-[0.8rem] font-medium">Satisfied Customers</p>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.card -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
|
||||
<h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3">Let’s Talk</h2>
|
||||
<p class="lead !text-[1.05rem] !leading-[1.6] font-medium">Let's make something great together. We are <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">trusted by</span> over 5000+ clients. Join them by using our services and grow your business.</p>
|
||||
<p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/page-loader by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:27 GMT -->
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,866 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/projects by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:29 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-soft-primary !bg-[#edf2fc]">
|
||||
<nav class="navbar navbar-expand-lg center-nav navbar-light navbar-bg-light">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="section-frame overflow-hidden xl:mx-6 xl:rounded-2xl lg:mx-6 lg:rounded-2xl md:mx-6 md:rounded-2xl">
|
||||
<div class="wrapper bg-[rgba(246,247,249,1)] ">
|
||||
<div class="container py-16 xl:!py-28 lg:!py-28 md:!py-28 !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="lg:w-10/12 xl:w-10/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-1">Check out some of our awesome projects with creative ideas.</h1>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.wrapper -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff]">
|
||||
<div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-6">
|
||||
<div class="xl:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<div class="projects-tiles">
|
||||
<div class="project itemgrid grid-view">
|
||||
<div class="flex flex-wrap mx-[-15px] isotope !mt-[-30px]">
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#e2626b] !mb-3">Ideas</div>
|
||||
<h2 class="post-title !mb-3 !leading-[1.35]">Cras Fermentum Sem</h2>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
<div class="!relative">
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</p>
|
||||
<a href="#" class="more hover !text-[#e2626b] focus:!text-[#e2626b] hover:!text-[#e2626b]">See Project</a>
|
||||
</div>
|
||||
<!-- /.post-content -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Cursus Inceptos Sit</h5>'><a href="assets/img/photos/cs1-full.jpg" data-glightbox="title: Cursus Inceptos Sit" data-gallery="project-1"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs1.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Ipsum Egestas Porta</h5>'><a href="assets/img/photos/cs2-full.jpg" data-glightbox="title: Ipsum Egestas Porta" data-gallery="project-1"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs2.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Ultricies Cras Tortor</h5>'><a href="assets/img/photos/cs3-full.jpg" data-glightbox="title: Ultricies Cras Tortor" data-gallery="project-1"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs3.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project itemgrid grid-view">
|
||||
<div class="flex flex-wrap mx-[-15px] isotope !mt-[-30px]">
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#fab758] !mb-3">Concept</div>
|
||||
<h2 class="post-title !mb-3 !leading-[1.35]">Vulputate Sollicitudin</h2>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
<div class="!relative">
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</p>
|
||||
<a href="#" class="more hover !text-[#fab758] focus:!text-[#fab758] hover:!text-[#fab758]">See Project</a>
|
||||
</div>
|
||||
<!-- /.post-content -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Purus Tellus Magna</h5>'><a href="assets/img/photos/cs4-full.jpg" data-glightbox="title: Purus Tellus Magna" data-gallery="project-2"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs4.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Fusce Ipsum Vestibulum</h5>'><a href="assets/img/photos/cs5-full.jpg" data-glightbox="title: Fusce Ipsum Vestibulum" data-gallery="project-2"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs5.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Condimentum Parturient Ligula</h5>'><a href="assets/img/photos/cs6-full.jpg" data-glightbox="title: Condimentum Parturient Ligula" data-gallery="project-2"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs6.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project itemgrid grid-view">
|
||||
<div class="flex flex-wrap mx-[-15px] isotope !mt-[-30px]">
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#45c4a0] !mb-3">Still Life</div>
|
||||
<h2 class="post-title !mb-3 !leading-[1.35]">Vulputate Sollicitudin</h2>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
<div class="!relative">
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</p>
|
||||
<a href="#" class="more hover !text-[#45c4a0] focus:!text-[#45c4a0] hover:!text-[#45c4a0]">See Project</a>
|
||||
</div>
|
||||
<!-- /.post-content -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Venenatis Amet Ipsum</h5>'><a href="assets/img/photos/cs7-full.jpg" data-glightbox="title: Venenatis Amet Ipsum" data-gallery="project-3"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs7.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Quam Vehicula Condimentum</h5>'><a href="assets/img/photos/cs8-full.jpg" data-glightbox="title: Quam Vehicula Condimentum" data-gallery="project-3"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs8.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Commodo Fusce Dapibus</h5>'><a href="assets/img/photos/cs9-full.jpg" data-glightbox="title: Commodo Fusce Dapibus" data-gallery="project-3"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs9.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project itemgrid grid-view">
|
||||
<div class="flex flex-wrap mx-[-15px] isotope !mt-[-30px]">
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#7cb798] !mb-3">Workshop</div>
|
||||
<h2 class="post-title !mb-3 !leading-[1.35]">Ornare Commodo Mollis</h2>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
<div class="!relative">
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</p>
|
||||
<a href="#" class="more hover !text-[#7cb798] focus:!text-[#7cb798] hover:!text-[#7cb798]">See Project</a>
|
||||
</div>
|
||||
<!-- /.post-content -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Cras Ullamcorper Tellus</h5>'><a href="assets/img/photos/cs10-full.jpg" data-glightbox="title: Cras Ullamcorper Tellus" data-gallery="project-4"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs10.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Quam Bibendum Ornare</h5>'><a href="assets/img/photos/cs11-full.jpg" data-glightbox="title: Quam Bibendum Ornare" data-gallery="project-4"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs11.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Ullamcorper Etiam Malesuada</h5>'><a href="assets/img/photos/cs12-full.jpg" data-glightbox="title: Ullamcorper Etiam Malesuada" data-gallery="project-4"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs12.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project itemgrid grid-view">
|
||||
<div class="flex flex-wrap mx-[-15px] isotope !mt-[-30px]">
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#f78b77] !mb-3">Tools & Toys</div>
|
||||
<h2 class="post-title !mb-3 !leading-[1.35]">Porta Tortor Vulputate</h2>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
<div class="!relative">
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</p>
|
||||
<a href="#" class="more hover !text-[#f78b77] focus:!text-[#f78b77] hover:!text-[#f78b77]">See Project</a>
|
||||
</div>
|
||||
<!-- /.post-content -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Aenean Dolor Tristique</h5>'><a href="assets/img/photos/cs13-full.jpg" data-glightbox="title: Aenean Dolor Tristique" data-gallery="project-5"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs13.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Magna Ipsum Euismod</h5>'><a href="assets/img/photos/cs14-full.jpg" data-glightbox="title: Magna Ipsum Euismod" data-gallery="project-5"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs14.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="itooltip itooltip-light hover-scale rounded group" title='<h5 class="!mb-0">Fusce Mollis</h5>'><a href="assets/img/photos/cs15-full.jpg" data-glightbox="title: Fusce Mollis" data-gallery="project-5"> <img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/cs15.jpg" alt="image"></a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /.item -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
</div>
|
||||
<!-- /.projects-tiles -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/projects by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:44 GMT -->
|
||||
</html>
|
||||
@@ -0,0 +1,874 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/projects2 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:44 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-light !bg-[rgba(254,254,254)] opacity-100">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent navbar-light xl:pt-[.3rem] lg:pt-[.3rem]">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="wrapper !bg-[#ffffff]">
|
||||
<div class="container pt-10 xl:pt-[4.5rem] lg:pt-[4.5rem] md:pt-[4.5rem] !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="md:w-8/12 lg:w-7/12 xl:w-6/12 xxl:w-5/12 flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3">Projects</h1>
|
||||
<p class="lead !text-[1.05rem] !leading-[1.6] lg:!px-10 xl:!px-10 xxl:!px-8">Check out some of our awesome projects with creative ideas and great design.</p>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff]">
|
||||
<div class="container pt-9 xl:pt-12 lg:pt-12 md:pt-12 pb-[4.5rem] xl:pb-24 lg:pb-24 md:pb-24">
|
||||
<div class="projects-overflow !mb-10 xl:!mb-20 lg:!mb-20 xl:!mt-10 lg:!mt-10 md:!mt-10">
|
||||
<div class="project item">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<figure class="lg:w-8/12 xl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-[8.33333333%] rounded"> <img src="assets/img/photos/cs16.jpg" alt="image"></figure>
|
||||
<div class="project-details flex justify-center flex-col !px-[15px]" style="right: 10%; bottom: 25%;">
|
||||
<div class="card shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rellax" data-rellax-xs-speed="0" data-rellax-mobile-speed="0">
|
||||
<div class="card-body flex-[1_1_auto] p-[40px]">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#747ed1] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#747ed1] !mb-3">Cosmetic</div>
|
||||
<h2 class="post-title !mb-3 !leading-[1.35]">Cras Fermentum Sem</h2>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
<div class="!relative">
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</p>
|
||||
<a href="#" class="more hover !text-[#747ed1] focus:!text-[#747ed1] hover:!text-[#747ed1]">See Project</a>
|
||||
</div>
|
||||
<!-- /.post-content -->
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<figure class="xl:w-6/12 lg:w-7/12 xl:!ml-[41.66666667%] lg:!ml-[41.66666667%] w-full flex-[0_0_auto] !px-[15px] max-w-full rounded"> <img src="assets/img/photos/cs17.jpg" alt="image"></figure>
|
||||
<div class="project-details flex justify-center flex-col !px-[15px]" style="left: 18%; bottom: 25%;">
|
||||
<div class="card shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rellax" data-rellax-xs-speed="0" data-rellax-mobile-speed="0">
|
||||
<div class="card-body flex-[1_1_auto] p-[40px]">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#7cb798] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#7cb798] !mb-3">Coffee</div>
|
||||
<h2 class="post-title !mb-3 !leading-[1.35]">Mollis Ipsum Mattis</h2>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
<div class="!relative">
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Nullam id dolor id nibh ultricies vehicula.</p>
|
||||
<a href="#" class="more hover !text-[#7cb798] focus:!text-[#7cb798] hover:!text-[#7cb798]">See Project</a>
|
||||
</div>
|
||||
<!-- /.post-content -->
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<figure class="lg:w-9/12 xl:w-7/12 xl:!ml-[16.66666667%] w-full flex-[0_0_auto] !px-[15px] max-w-full rounded"> <img src="assets/img/photos/cs18.jpg" alt="image"></figure>
|
||||
<div class="project-details flex justify-center flex-col !px-[15px]" style="right: 3%; bottom: 25%;">
|
||||
<div class="card shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rellax" data-rellax-xs-speed="0" data-rellax-mobile-speed="0">
|
||||
<div class="card-body flex-[1_1_auto] p-[40px]">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#a07cc5] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#a07cc5] !mb-3">Still Life</div>
|
||||
<h2 class="post-title !mb-3 !leading-[1.35]">Ipsum Ultricies Cursus</h2>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
<div class="!relative">
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</p>
|
||||
<a href="#" class="more hover !text-[#a07cc5] focus:!text-[#a07cc5] hover:!text-[#a07cc5]">See Project</a>
|
||||
</div>
|
||||
<!-- /.post-content -->
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<figure class="lg:w-9/12 lg:!ml-[25%] xl:w-7/12 xl:!ml-[33.33333333%] w-full flex-[0_0_auto] !px-[15px] max-w-full rounded"> <img src="assets/img/photos/cs19.jpg" alt="image"></figure>
|
||||
<div class="project-details flex justify-center flex-col !px-[15px]" style="left: 12%; bottom: 25%;">
|
||||
<div class="card shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rellax" data-rellax-xs-speed="0" data-rellax-mobile-speed="0">
|
||||
<div class="card-body flex-[1_1_auto] p-[40px]">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#fab758] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#fab758] !mb-3">Product</div>
|
||||
<h2 class="post-title !mb-3 !leading-[1.35]">Sollicitudin Ornare Porta</h2>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
<div class="!relative">
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</p>
|
||||
<a href="#" class="more hover !text-[#fab758] focus:!text-[#fab758] hover:!text-[#fab758]">See Project</a>
|
||||
</div>
|
||||
<!-- /.post-content -->
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<figure class="lg:w-8/12 xl:w-6/12 xl:!ml-[8.33333333%] w-full flex-[0_0_auto] !px-[15px] max-w-full rounded"> <img src="assets/img/photos/cs20.jpg" alt="image"></figure>
|
||||
<div class="project-details flex justify-center flex-col !px-[15px]" style="right: 15%; bottom: 25%;">
|
||||
<div class="card shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rellax" data-rellax-xs-speed="0" data-rellax-mobile-speed="0">
|
||||
<div class="card-body flex-[1_1_auto] p-[40px]">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#f78b77] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#f78b77] !mb-3">Product</div>
|
||||
<h2 class="post-title !mb-3 !leading-[1.35]">Inceptos Euismod Egestas</h2>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
<div class="!relative">
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Nullam id dolor id nibh ultricies vehicula.</p>
|
||||
<a href="#" class="more hover !text-[#f78b77] focus:!text-[#f78b77] hover:!text-[#f78b77]">See Project</a>
|
||||
</div>
|
||||
<!-- /.post-content -->
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<figure class="lg:w-9/12 lg:!ml-[25%] xl:w-7/12 xl:!ml-[41.66666667%] w-full flex-[0_0_auto] !px-[15px] max-w-full rounded"> <img src="assets/img/photos/cs21.jpg" alt="image"></figure>
|
||||
<div class="project-details flex justify-center flex-col ms-lg-n150 xl:!ml-0" style="left: 18%; bottom: 25%;">
|
||||
<div class="card shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rellax" data-rellax-xs-speed="0" data-rellax-mobile-speed="0">
|
||||
<div class="card-body flex-[1_1_auto] p-[40px]">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#45c4a0] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#45c4a0] !mb-3">Workshop</div>
|
||||
<h2 class="post-title !mb-3 !leading-[1.35]">Ipsum Mollis Vulputate</h2>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
<div class="!relative">
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</p>
|
||||
<a href="#" class="more hover !text-[#45c4a0] focus:!text-[#45c4a0] hover:!text-[#45c4a0]">See Project</a>
|
||||
</div>
|
||||
<!-- /.post-content -->
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<figure class="lg:w-8/12 xl:w-6/12 xl:!ml-[8.33333333%] w-full flex-[0_0_auto] !px-[15px] max-w-full rounded"> <img src="assets/img/photos/cs22.jpg" alt="image"></figure>
|
||||
<div class="project-details flex justify-center flex-col !px-[15px]" style="right: 15%; bottom: 25%;">
|
||||
<div class="card shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rellax" data-rellax-xs-speed="0" data-rellax-mobile-speed="0">
|
||||
<div class="card-body flex-[1_1_auto] p-[40px]">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#e2626b] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e2626b] !mb-3">Concept</div>
|
||||
<h2 class="post-title !mb-3 !leading-[1.35]">Porta Ornare Cras</h2>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
<div class="!relative">
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</p>
|
||||
<a href="#" class="more hover !text-[#e2626b] focus:!text-[#e2626b] hover:!text-[#e2626b]">See Project</a>
|
||||
</div>
|
||||
<!-- /.post-content -->
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
</div>
|
||||
<!-- /.projects-overflow -->
|
||||
<nav class="flex justify-center" aria-label="pagination">
|
||||
<ul class="pagination">
|
||||
<li class="page-item disabled">
|
||||
<a class="page-link" href="#" aria-label="Previous">
|
||||
<span aria-hidden="true"><i class="uil uil-arrow-left before:content-['\e949']"></i></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="page-item active"><a class="page-link" href="#">1</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">2</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">3</a></li>
|
||||
<li class="page-item">
|
||||
<a class="page-link" href="#" aria-label="Next">
|
||||
<span aria-hidden="true"><i class="uil uil-arrow-right before:content-['\e94c']"></i></span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.pagination -->
|
||||
</nav>
|
||||
<!-- /nav -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/projects2 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:48 GMT -->
|
||||
</html>
|
||||
@@ -0,0 +1,805 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/projects3 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:48 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-light !bg-[rgba(254,254,254)] opacity-100">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent navbar-light xl:pt-[.3rem] lg:pt-[.3rem]">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="wrapper !bg-[#ffffff]">
|
||||
<div class="container pt-10 xl:pt-[4.5rem] lg:pt-[4.5rem] md:pt-[4.5rem]">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="lg:w-10/12 xl:w-10/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full">
|
||||
<h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-0">Check out some of our awesome projects with creative ideas.</h1>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff]">
|
||||
<div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
|
||||
<div class="itemgrid grid-view projects-masonry">
|
||||
<div class="isotope-filter !relative !z-[5] filter !mb-10">
|
||||
<p class=" inline m-[0_1rem_0_0] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc]">Filter:</p>
|
||||
<ul class=" inline m-0 p-0 list-none">
|
||||
<li class="inline"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer active" data-filter="*">All</a></li>
|
||||
<li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".concept">Concept</a></li>
|
||||
<li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".product">Product</a></li>
|
||||
<li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".workshop">Workshop</a></li>
|
||||
<li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".still-life">Still Life</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-25px] lg:mx-[-25px] md:mx-[-25px] !mt-[-50px] xl:!mt-[-80px] lg:!mt-[-80px] md:!mt-[-80px] isotope">
|
||||
<div class="project item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[25px] lg:!mt-[80px] lg:!px-[25px] md:!mt-[80px] md:!px-[25px] !px-[15px] !mt-[50px] max-w-full product">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project.html'> <img src="assets/img/photos/cs16.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#747ed1] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#747ed1] !mb-2">Cosmetic</div>
|
||||
<h3 class="post-title">Cras Fermentum Sem</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[25px] lg:!mt-[80px] lg:!px-[25px] md:!mt-[80px] md:!px-[25px] !px-[15px] !mt-[50px] max-w-full workshop">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project2.html'> <img src="assets/img/photos/cs17.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#7cb798] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#7cb798] !mb-2">Coffee</div>
|
||||
<h3 class="post-title">Mollis Ipsum Mattis</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[25px] lg:!mt-[80px] lg:!px-[25px] md:!mt-[80px] md:!px-[25px] !px-[15px] !mt-[50px] max-w-full still-life">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project3.html'> <img src="assets/img/photos/cs18.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#a07cc5] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#a07cc5] !mb-2">Still Life</div>
|
||||
<h3 class="post-title">Ipsum Ultricies Cursus</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[25px] lg:!mt-[80px] lg:!px-[25px] md:!mt-[80px] md:!px-[25px] !px-[15px] !mt-[50px] max-w-full product">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project.html'> <img src="assets/img/photos/cs19.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#fab758] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#fab758] !mb-2">Product</div>
|
||||
<h3 class="post-title">Sollicitudin Ornare Porta</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[25px] lg:!mt-[80px] lg:!px-[25px] md:!mt-[80px] md:!px-[25px] !px-[15px] !mt-[50px] max-w-full product">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project2.html'> <img src="assets/img/photos/cs20.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#f78b77] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#f78b77] !mb-2">Product</div>
|
||||
<h3 class="post-title">Inceptos Euismod Egestas</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[25px] lg:!mt-[80px] lg:!px-[25px] md:!mt-[80px] md:!px-[25px] !px-[15px] !mt-[50px] max-w-full workshop">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project3.html'> <img src="assets/img/photos/cs21.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#45c4a0] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#45c4a0] !mb-2">Workshop</div>
|
||||
<h3 class="post-title">Ipsum Mollis Vulputate</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[25px] lg:!mt-[80px] lg:!px-[25px] md:!mt-[80px] md:!px-[25px] !px-[15px] !mt-[50px] max-w-full concept">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project.html'> <img src="assets/img/photos/cs22.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#e2626b] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e2626b] !mb-2">Concept</div>
|
||||
<h3 class="post-title">Porta Ornare Cras</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[25px] lg:!mt-[80px] lg:!px-[25px] md:!mt-[80px] md:!px-[25px] !px-[15px] !mt-[50px] max-w-full concept still-life">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project2.html'> <img src="assets/img/photos/cs23.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#54a8c7] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#54a8c7] !mb-2">Concept</div>
|
||||
<h3 class="post-title">Vulputate Sollicitudin</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[25px] lg:!mt-[80px] lg:!px-[25px] md:!mt-[80px] md:!px-[25px] !px-[15px] !mt-[50px] max-w-full product">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project3.html'> <img src="assets/img/photos/cs24.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#747ed1] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#747ed1] !mb-2">Product</div>
|
||||
<h3 class="post-title">Magna Tristique Inceptos</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[25px] lg:!mt-[80px] lg:!px-[25px] md:!mt-[80px] md:!px-[25px] !px-[15px] !mt-[50px] max-w-full product">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project.html'> <img src="assets/img/photos/cs25.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#d16b86] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#d16b86] !mb-2">Product</div>
|
||||
<h3 class="post-title">Ridiculus Elit</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.grid -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/projects3 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:50 GMT -->
|
||||
</html>
|
||||
@@ -0,0 +1,794 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/projects4 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:50 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-light !bg-[rgba(254,254,254)] opacity-100">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent navbar-light xl:pt-[.3rem] lg:pt-[.3rem]">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="wrapper !bg-[#ffffff]">
|
||||
<div class="container pt-10 xl:pt-[4.5rem] lg:pt-[4.5rem] md:pt-[4.5rem]">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="md:w-8/12 lg:w-7/12 xl:w-6/12 xxl:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full">
|
||||
<h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3">Projects</h1>
|
||||
<p class="lead text-[1.05rem] !leading-[1.6] xl:!pr-20 lg:!pr-20 xxl:!pr-14">Check out some of our awesome projects with creative ideas and great design.</p>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff]">
|
||||
<div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
|
||||
<div class="itemgrid grid-view projects-masonry">
|
||||
<div class="isotope-filter !relative !z-[5] filter !mb-10">
|
||||
<p class=" inline m-[0_1rem_0_0] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc]">Filter:</p>
|
||||
<ul class=" inline m-0 p-0 list-none">
|
||||
<li class="inline"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer active" data-filter="*">All</a></li>
|
||||
<li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".concept">Concept</a></li>
|
||||
<li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".product">Product</a></li>
|
||||
<li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".workshop">Workshop</a></li>
|
||||
<li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".still-life">Still Life</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-20px] lg:mx-[-20px] md:mx-[-20px] !mt-[-50px] xl:!mt-[-80px] lg:!mt-[-80px] md:!mt-[-80px] isotope">
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[20px] lg:!mt-[80px] lg:!px-[20px] md:!mt-[80px] md:!px-[20px] !px-[15px] !mt-[50px] max-w-full product">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project.html'> <img src="assets/img/photos/cs16.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#747ed1] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#747ed1] !mb-2">Cosmetic</div>
|
||||
<h3 class="post-title">Cras Fermentum Sem</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[20px] lg:!mt-[80px] lg:!px-[20px] md:!mt-[80px] md:!px-[20px] !px-[15px] !mt-[50px] max-w-full workshop">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project2.html'> <img src="assets/img/photos/cs17.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#7cb798] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#7cb798] !mb-2">Coffee</div>
|
||||
<h3 class="post-title">Mollis Ipsum Mattis</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[20px] lg:!mt-[80px] lg:!px-[20px] md:!mt-[80px] md:!px-[20px] !px-[15px] !mt-[50px] max-w-full still-life">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project3.html'> <img src="assets/img/photos/cs18.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#a07cc5] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#a07cc5] !mb-2">Still Life</div>
|
||||
<h3 class="post-title">Ipsum Ultricies Cursus</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[20px] lg:!mt-[80px] lg:!px-[20px] md:!mt-[80px] md:!px-[20px] !px-[15px] !mt-[50px] max-w-full product">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project.html'> <img src="assets/img/photos/cs20.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#fab758] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#fab758] !mb-2">Product</div>
|
||||
<h3 class="post-title">Inceptos Euismod Egestas</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[20px] lg:!mt-[80px] lg:!px-[20px] md:!mt-[80px] md:!px-[20px] !px-[15px] !mt-[50px] max-w-full product">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project2.html'> <img src="assets/img/photos/cs19.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#f78b77] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#f78b77] !mb-2">Product</div>
|
||||
<h3 class="post-title">Sollicitudin Ornare Porta</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[20px] lg:!mt-[80px] lg:!px-[20px] md:!mt-[80px] md:!px-[20px] !px-[15px] !mt-[50px] max-w-full workshop">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project3.html'> <img src="assets/img/photos/cs21.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#45c4a0] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#45c4a0] !mb-2">Workshop</div>
|
||||
<h3 class="post-title">Ipsum Mollis Vulputate</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[20px] lg:!mt-[80px] lg:!px-[20px] md:!mt-[80px] md:!px-[20px] !px-[15px] !mt-[50px] max-w-full concept">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project.html'> <img src="assets/img/photos/cs22.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#e2626b] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e2626b] !mb-2">Concept</div>
|
||||
<h3 class="post-title">Porta Ornare Cras</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[20px] lg:!mt-[80px] lg:!px-[20px] md:!mt-[80px] md:!px-[20px] !px-[15px] !mt-[50px] max-w-full concept still-life">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project2.html'> <img src="assets/img/photos/cs23.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#54a8c7] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#54a8c7] !mb-2">Concept</div>
|
||||
<h3 class="post-title">Vulputate Sollicitudin</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!mt-[80px] xl:!px-[20px] lg:!mt-[80px] lg:!px-[20px] md:!mt-[80px] md:!px-[20px] !px-[15px] !mt-[50px] max-w-full product">
|
||||
<figure class="lift rounded !mb-6"><a href='single-project3.html'> <img src="assets/img/photos/cs24.jpg" alt="image"></a></figure>
|
||||
<div class="project-details flex justify-center flex-col">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold relative align-top !pl-[1.4rem] opacity-100 !text-[#747ed1] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#747ed1] !mb-2">Product</div>
|
||||
<h3 class="post-title">Magna Tristique Inceptos</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.project-details -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.grid -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/projects4 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:50 GMT -->
|
||||
</html>
|
||||
@@ -0,0 +1,953 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/services by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:06 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-soft-primary !bg-[#edf2fc]">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent navbar-light">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="wrapper !bg-[#edf2fc]">
|
||||
<div class="container pt-10 pb-36 xl:pt-[4.5rem] lg:pt-[4.5rem] md:pt-[4.5rem] xl:pb-40 lg:pb-40 md:pb-40 !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="md:w-8/12 lg:w-7/12 xl:w-6/12 xxl:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !mb-12">
|
||||
<h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3">Our Services</h1>
|
||||
<p class="lead !leading-[1.65] text-[0.9rem] font-medium lg:!px-7 xl:!px-7 xxl:!px-6">We are a creative company that focuses on establishing <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">long-term relationships</span> with customers.</p>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff] angled upper-end !relative border-0 before:top-[-4rem] before:border-l-transparent before:border-r-[100vw] before:border-t-[4rem] before:border-[#fefefe] before:content-[''] before:block before:absolute before:z-0 before:!border-y-transparent before:border-0 before:border-solid before:right-0 after:top-[-4rem] after:border-l-transparent after:border-r-[100vw] after:border-t-[4rem] after:border-[#fefefe] after:content-[''] after:block after:absolute after:z-0 after:!border-y-transparent after:border-0 after:border-solid after:right-0">
|
||||
<div class="container !pb-[4.5rem] xl:!pb-24 lg:!pb-24 md:!pb-24">
|
||||
<div class="flex flex-wrap mx-[-15px] !mb-8">
|
||||
<div class="w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[-10rem]">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/about5.jpg" alt="image"></figure>
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="xl:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<div class="card image-wrapper bg-full bg-image bg-overlay bg-overlay-400 !text-white !mt-[-1.25rem] xl:!mt-0 lg:!mt-0 xl:-translate-y-2/4 lg:-translate-y-2/4 bg-cover [background-size:100%] bg-[center_center] bg-no-repeat !bg-scroll !relative z-0 before:rounded-[0.4rem] before:bg-[rgba(30,34,40,.4)] before:content-[''] before:block before:absolute before:z-[1] before:w-full before:h-full before:left-0 before:top-0" data-image-src="assets/img/photos/bg3.jpg">
|
||||
<div class="card-body p-[2.25rem] xl:!p-[2.5rem]">
|
||||
<div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-20px] !text-center">
|
||||
<div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
|
||||
<h3 class="counter counter-lg !text-white xl:!text-[2.2rem] !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2">7518</h3>
|
||||
<p class="!text-[0.8rem] font-medium !mb-0 !text-white">Completed Projects</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
|
||||
<h3 class="counter counter-lg !text-white xl:!text-[2.2rem] !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2">3472</h3>
|
||||
<p class="!text-[0.8rem] font-medium !mb-0 !text-white">Satisfied Customers</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
|
||||
<h3 class="counter counter-lg !text-white xl:!text-[2.2rem] !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2">2184</h3>
|
||||
<p class="!text-[0.8rem] font-medium !mb-0 !text-white">Expert Employees</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
|
||||
<h3 class="counter counter-lg !text-white xl:!text-[2.2rem] !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2">4523</h3>
|
||||
<p class="!text-[0.8rem] font-medium !mb-0 !text-white">Awards Won</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.card -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-20px] lg:mx-[-20px] !mt-[25px] md:!mt-[4.5rem] lg:!mt-0 xl:!mt-0 !mb-20 items-center">
|
||||
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] px-[20px] !mt-[40px] max-w-full xl:!order-2 lg:!order-2">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-[16.66666667%] lg:!ml-[16.66666667%] md:!ml-[16.66666667%] !self-end !mt-[25px]">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/g1.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] px-[12.5px] max-w-full !self-end !mt-[25px]">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/g2.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] px-[12.5px] max-w-full xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] md:!ml-[8.33333333%] !mt-[25px]">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/g3.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !self-start !mt-[25px]">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/g4.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[20px] lg:!px-[20px] !px-[15px] !mt-[40px] max-w-full">
|
||||
<h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3">What We Do?</h2>
|
||||
<p class="lead !mb-8 xxl:!pr-2 !text-[1.05rem] !leading-[1.6]">The full service we are offering is <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">specifically</span> designed to meet your business needs and projects.</p>
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-25px] !mt-[-30px]">
|
||||
<div class="md:w-6/12 lg:w-full xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[25px] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon btn btn-circle btn-lg btn-soft-primary pointer-events-none !mr-5 xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none p-0 !rounded-[100%]"> <i class="!text-[calc(1.255rem_+_0.06vw)] before:content-['\ec50'] uil uil-phone-volume"></i> </div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">24/7 Support</h4>
|
||||
<p class="!mb-0">Nulla vitae elit libero pharetra augue dapibus.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-full xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[25px] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon btn btn-circle btn-lg btn-soft-primary pointer-events-none !mr-5 xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none p-0 !rounded-[100%]"> <i class="!text-[calc(1.255rem_+_0.06vw)] before:content-['\ecb3'] uil uil-shield-exclamation"></i> </div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Secure Payments</h4>
|
||||
<p class="!mb-0">Vivamus sagittis lacus augue laoreet vel.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-full xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[25px] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon btn btn-circle btn-lg btn-soft-primary pointer-events-none !mr-5 xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none p-0 !rounded-[100%]"> <i class="!text-[calc(1.255rem_+_0.06vw)] before:content-['\ebb2'] uil uil-laptop-cloud"></i> </div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Daily Updates</h4>
|
||||
<p class="!mb-0">Cras mattis consectetur purus sit amet.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-full xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[25px] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<div class="icon btn btn-circle btn-lg btn-soft-primary pointer-events-none !mr-5 xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none p-0 !rounded-[100%]"> <i class="!text-[calc(1.255rem_+_0.06vw)] before:content-['\e9d3'] uil uil-chart-line"></i> </div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Market Research</h4>
|
||||
<p class="!mb-0">Aenean lacinia bibendum nulla sed consectetur.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3">How We Do It?</h2>
|
||||
<p class="lead !mb-8 !text-[1.05rem] !leading-[1.6]">We make your spending <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">stress-free</span> for you to have the perfect control.</p>
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-30px] process-wrapper line">
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full !relative after:w-full after:absolute after:content-[''] after:h-px after:z-[1] after:border-t-[rgba(164,174,198,0.2)] after:border-t after:border-solid after:left-[3rem] after:top-6 after:bg-inherit max-lg:after:!hidden"> <span class="icon btn btn-circle btn-lg btn-soft-primary pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none !p-0 !rounded-[100%]"><span class="number">01</span></span>
|
||||
<h4 class="!mb-1">Concept</h4>
|
||||
<p>Nulla vitae elit libero elit non porta gravida eget metus cras. Aenean eu leo quam. Pellentesque ornare.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full !relative after:w-full after:absolute after:content-[''] after:h-px after:z-[1] after:border-t-[rgba(164,174,198,0.2)] after:border-t after:border-solid after:left-[3rem] after:top-6 after:bg-inherit max-lg:after:!hidden"> <span class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none p-0 !rounded-[100%]"><span class="number">02</span></span>
|
||||
<h4 class="!mb-1">Prepare</h4>
|
||||
<p>Vestibulum id ligula porta felis euismod semper. Sed posuere consectetur est at lobortis.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full !relative after:w-full after:absolute after:content-[''] after:h-px after:z-[1] after:border-t-[rgba(164,174,198,0.2)] after:border-t after:border-solid after:left-[3rem] after:top-6 after:bg-inherit max-lg:after:!hidden"> <span class="icon btn btn-circle btn-lg btn-soft-primary pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none !p-0 !rounded-[100%]"><span class="number">03</span></span>
|
||||
<h4 class="!mb-1">Retouch</h4>
|
||||
<p>Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Nulla vitae elit libero.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full"> <span class="icon btn btn-circle btn-lg btn-soft-primary pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none !p-0 !rounded-[100%]"><span class="number">04</span></span>
|
||||
<h4 class="!mb-1">Finalize</h4>
|
||||
<p>Integer posuere erat, consectetur adipiscing elit. Fusce dapibus, tellus ac cursus commodo.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper image-wrapper bg-image bg-overlay bg-no-repeat bg-[center_center] bg-cover !relative z-0 !bg-fixed before:content-[''] before:block before:absolute before:z-[1] before:w-full before:h-full before:left-0 before:top-0 before:bg-[rgba(30,34,40,.5)]" data-image-src="assets/img/photos/bg1.jpg">
|
||||
<div class="container py-[8rem] !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="lg:w-10/12 xl:w-10/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<a href="https://www.youtube.com/watch?v=26TbMXXOe0I" class="btn btn-circle btn-white btn-play ripple !mx-auto !mb-5 !relative z-[2] xl:!text-[2.3rem] !w-[3.5rem] !h-[3.5rem] !text-[calc(1.355rem_+_1.26vw)] hover:translate-y-0 inline-flex items-center justify-center leading-none p-0 !rounded-[100%] before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#ffffff] after:content-[''] after:block after:absolute after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#ffffff]" data-glightbox><i class="icn-caret-right !ml-[0.15rem] !relative z-[2] before:content-['\e900'] !text-[calc(1.355rem_+_1.26vw)]"></i></a>
|
||||
<h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] lg:!px-10 xl:!px-16 xxl:!px-10 !mb-10 !text-white !relative z-[2]">Find out everything you need to know about creating a business process model.</h2>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff] angled upper-end !relative border-0 before:top-[-4rem] before:border-l-transparent before:border-r-[100vw] before:border-t-[4rem] before:border-[#fefefe] before:content-[''] before:block before:absolute before:z-0 before:!border-y-transparent before:border-0 before:border-solid before:right-0 after:border-[#fefefe] after:content-[''] after:block after:absolute after:z-0 after:!border-y-transparent after:border-0 after:border-solid after:right-0">
|
||||
<div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-30px] !mb-10 xl:!mb-[8rem] lg:!mb-[8rem] md:!mb-[8rem]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[30px]">
|
||||
<h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] xl:!mt-32 lg:!mt-32 !mb-3">Our Pricing</h2>
|
||||
<p class="lead !text-[1.05rem] !leading-[1.6] font-medium">We offer <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">great prices</span>, premium and quality products for your business.</p>
|
||||
<p>Enjoy a <a href="#" class="hover">free 30-day trial</a> and experience the full service. No credit card required!</p>
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Prices</a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] pricing-wrapper !mt-[30px]">
|
||||
<div class="flex flex-wrap items-center switcher xl:!justify-end lg:!justify-end">
|
||||
<p class="!mb-0 !pr-[.75rem]">Monthly</p>
|
||||
<div class="pricing-switchers w-8 h-4 clear-both !text-center !relative bg-[rgba(30,34,40,0.07)] !box-content rounded-3xl border-[0.2rem] border-solid border-transparent">
|
||||
<div class="pricing-switcher pricing-switcher-active cursor-pointer w-full float-left h-4 leading-4 !relative z-[888] transition-[0.3s] duration-[ease-in-out] uppercase !text-white"></div>
|
||||
<div class="pricing-switcher cursor-pointer w-full float-left h-4 leading-4 !relative z-[888] transition-[0.3s] duration-[ease-in-out] uppercase"></div>
|
||||
<div class="h-4 w-4 block absolute z-[555] transition-[0.3s] duration-[ease-in-out] m-0 rounded-[100%] border-[none] left-0 top-0 !bg-[rgba(63,120,224)] opacity-100 switcher-button"></div>
|
||||
</div>
|
||||
<p class="!mb-0 !pl-3 !relative">Yearly <span class="!text-[#e2626b]">(Save 30%)</span></p>
|
||||
</div>
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[25px] !relative">
|
||||
<div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] !absolute z-[1] opacity-50 !px-[15px] !mt-[30px]" data-rellax-speed="1" style="bottom: -0.5rem; right: -1.6rem;"></div>
|
||||
<div class="shape !rounded-[50%] bg-line red rellax !w-[8rem] !h-[8rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -1rem; left: -2rem;"></div>
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="pricing card">
|
||||
<div class="card-body pb-14">
|
||||
<div class="prices !text-[#343f52]">
|
||||
<div class="price price-show !justify-start"><span class="price-currency">$</span><span class="price-value">19</span> <span class="price-duration">mo</span></div>
|
||||
<div class="price price-hide price-hidden !justify-start"><span class="price-currency">$</span><span class="price-value">199</span> <span class="price-duration">yr</span></div>
|
||||
</div>
|
||||
<!--/.prices -->
|
||||
<h4 class="card-title !mt-2">Premium Plan</h4>
|
||||
<ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
|
||||
</ul>
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.pricing -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full popular !mt-[30px]">
|
||||
<div class="pricing card">
|
||||
<div class="card-body pb-14">
|
||||
<div class="prices !text-[#343f52]">
|
||||
<div class="price price-show !justify-start"><span class="price-currency">$</span><span class="price-value">49</span> <span class="price-duration">mo</span></div>
|
||||
<div class="price price-hide price-hidden !justify-start"><span class="price-currency">$</span><span class="price-value">499</span> <span class="price-duration">yr</span></div>
|
||||
</div>
|
||||
<!--/.prices -->
|
||||
<h4 class="card-title !mt-2">Corporate Plan</h4>
|
||||
<ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
|
||||
</ul>
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.pricing -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-50px] xl:mx-[-35px] lg:mx-[-20px] items-center">
|
||||
<div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative">
|
||||
<div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"></div>
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] px-[12.5px] !mt-[25px] max-w-full">
|
||||
<figure class="!rounded-[.4rem] xl:!mt-10 lg:!mt-10 md:!mt-10 !relative"><img class="!rounded-[.4rem]" src="assets/img/photos/g5.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] px-[12.5px] !mt-[25px] max-w-full">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
|
||||
<div class="w-full flex-[0_0_auto] px-[12.5px] !mt-[25px] max-w-full xl:!order-2 lg:!order-2 md:!order-2">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/g6.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-10/12 lg:w-10/12 md:w-10/12 w-full flex-[0_0_auto] px-[12.5px] !mt-[25px] max-w-full">
|
||||
<div class="card !bg-[#e0e9fa] !text-center">
|
||||
<div class="card-body !py-12 !px-[2rem] counter-wrapper">
|
||||
<h3 class="counter !whitespace-nowrap xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">5000+</h3>
|
||||
<p class="!mb-0 text-[0.8rem] font-medium">Satisfied Customers</p>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.card -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
|
||||
<h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3">Let’s Talk</h2>
|
||||
<p class="lead !text-[1.05rem] !leading-[1.6] font-medium">Let's make something great together. We are <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">trusted by</span> over 5000+ clients. Join them by using our services and grow your business.</p>
|
||||
<p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/services by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:07 GMT -->
|
||||
</html>
|
||||
@@ -0,0 +1,993 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/services2 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:07 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-soft-primary !bg-[#edf2fc]">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent position-absolute navbar-dark xl:pt-[.3rem] lg:pt-[.3rem]">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img class="logo-dark" src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
<img class="logo-light" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle hover:!text-[#ffffffb3]" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-white !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="wrapper image-wrapper bg-image bg-overlay !text-white bg-no-repeat bg-[center_center] bg-cover relative z-0 !bg-fixed before:content-[''] before:block before:absolute before:z-[1] before:w-full before:h-full before:left-0 before:top-0 before:bg-[rgba(30,34,40,.5)]" data-image-src="assets/img/photos/bg1.jpg">
|
||||
<div class="container pt-36 xl:pt-[12.5rem] lg:pt-[12.5rem] md:pt-[12.5rem] pb-32 xl:pb-40 lg:pb-40 md:pb-40 !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="md:w-10/12 lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !text-white !mb-3">Our Services</h1>
|
||||
<p class="lead text-[1.05rem] !leading-[1.6] font-medium md:!px-3 lg:!px-7 xl:!px-9 xxl:!px-10">We are a creative company that focuses on establishing long-term relationships with customers.</p>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff]">
|
||||
<div class="container pt-[4.5rem] pb-14 xl:pt-24 lg:pt-24 md:pt-24 xl:pb-[4.5rem] lg:pb-[4.5rem] md:pb-[4.5rem]">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] lg:!mb-60 xl:!mb-80 items-center">
|
||||
<div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full xl:!order-2 lg:!order-2 !mt-[50px]">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
|
||||
<div class="xl:w-5/12 lg:w-5/12 md:w-5/12 w-full flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] md:!ml-[8.33333333%] !self-end !mt-[25px]">
|
||||
<div class="card !bg-[#fef3e4]">
|
||||
<div class="card-body p-[40px]">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 507 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/telephone-3.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#fab758] text-yellow !mb-3 "><path class="lineal-fill" d="M402.4 437.9c0-10.5-4.4-20.4-12.6-28.7-5.1-5.6-10.6-11-16-16.1-2.7-2.6-5.5-5.3-8.1-8l-23.4-23.4c-18-18-41.3-18-59.4 0-2.4 2.4-4.9 4.8-7.3 7.2-6.4 6.4-13.1 12.9-19.6 19.9-11.6-5.2-23-12.4-36.5-23.2-13.4-10.9-62.2-59.7-73.2-73.2-10.7-13.5-17.9-25-23.2-36.5 7-6.4 13.5-13.1 19.9-19.6 2.4-2.4 4.8-4.9 7.2-7.3 18-18 18-41.3 0-59.4l-23.4-23.4c-2.7-2.7-5.4-5.4-8-8.1-5.2-5.3-10.6-10.8-16.1-16-8.3-8.2-18.3-12.6-28.7-12.6s-20.5 4.5-29.1 12.7l-.2.2L33.4 134c-10.8 10.6-17.4 24.8-18.6 39.9-2.1 25 5.3 48.4 11 63.6C39.6 275 60.4 309.7 91.3 347c11.2 13.3 23.2 26 35.9 37.8 11.8 12.7 24.4 24.7 37.8 35.8 37.2 31 72 51.7 109.5 65.6 15.3 5.7 38.6 13 63.6 11 15.1-1.2 29.3-7.8 39.9-18.6l11.6-11.4.2-.2c8.2-8.5 12.6-18.6 12.6-29.1z"></path><path class="lineal-stroke" d="M507 237.1C507 106.4 400.7 0 270 0c-54.9 0-108.2 19.1-150.6 54-6.1 5.1-7 14.2-1.9 20.3 5.1 6.1 14.1 7 20.2 2 37.3-30.6 84-47.4 132.3-47.4 114.9 0 208.3 93.4 208.3 208.3-.1 63.1-28.7 122.8-77.8 162.4l-.2-.2c-5.4-5.8-11.1-11.4-16.4-16.5l-.2-.1c-2.5-2.3-5-4.8-7.4-7.3l-23.8-23.8c-11.6-11.6-25.4-17.7-39.9-17.7s-28.3 6.1-39.9 17.7l-3.4 3.4c-1.1 1.1-2.6 2.5-3.8 3.7l-1.8 1.7c-3.5 3.5-7.1 7-10.8 10.7-8.6-4.9-16.8-10.5-24.4-16.7-12.9-10.5-60.4-58.1-71-71-6.2-7.7-11.8-15.8-16.8-24.4 3.7-3.6 7.2-7.2 10.7-10.7l1.7-1.8c1.3-1.3 2.6-2.6 3.8-3.9 1.1-1.1 2.2-2.3 3.4-3.4 23.5-23.5 23.5-56.2 0-79.7L149 148.3c4.5-6.1 9.4-11.8 14.8-17.1 58.5-58.5 153.6-58.5 212 0 44.9 45 56.6 113.4 29.3 170.8-3.4 7.2-.4 15.8 6.8 19.2s15.8.4 19.2-6.8c32.6-68.4 18.7-149.9-34.9-203.5-69.7-69.7-183.1-69.7-252.7 0-5.3 5.3-10.3 10.9-14.9 16.8-5-5.2-10.3-10.6-16-15.8-10.9-11-24.3-16.7-38.6-16.7s-27.8 5.7-39.1 16.6l-.2.2-.2.2-.1.1-11.3 11.6C9.9 136.9 1.8 154.2.4 172.7c-2.3 27.8 5.7 53.2 11.8 69.8 14.5 39.2 36.1 75.3 68.1 113.7C91.7 369.9 104 382.8 117 395c12.2 13 25.1 25.3 38.8 36.8 38.4 31.9 74.5 53.5 113.6 68 14.2 5.2 35.8 12.2 60 12.2 3.3 0 6.7-.1 10-.4 18.5-1.5 35.8-9.5 48.7-22.7l11.6-11.3.1-.1.2-.2.2-.2c10.9-11.3 16.6-24.9 16.6-39.1 0-4.5-.6-9-1.8-13.4 58-45 91.9-114.2 92-187.5zM379.5 457L368 468.4l-.1.1c-8.2 8.4-19.2 13.6-30.9 14.4-2.5.2-5 .3-7.5.3-19.5 0-37.8-6-49.9-10.4-36-13.4-69.5-33.4-105.2-63.1-12.9-10.8-25.1-22.3-36.6-34.6-.2-.3-.5-.5-.7-.7-12.3-11.4-23.8-23.6-34.6-36.5-29.8-35.9-49.9-69.4-63.3-105.4-5.2-14.1-11.9-35.3-10.1-57.4.9-11.8 6-22.8 14.5-31l.1-.1L55 132.5c5.8-5.6 12.4-8.5 19.1-8.5s13 2.9 18.6 8.4l.4.4c5.3 4.9 10.6 10.3 15.5 15.3 2.6 2.7 5.2 5.4 7.8 8l23.8 23.8c12.4 12.4 12.4 26.6 0 39l-3.6 3.6c-1.2 1.2-2.4 2.5-3.7 3.8l-1.9 1.8c-5.6 5.7-11.5 11.6-17.6 17.2-4.6 4.2-6 10.9-3.4 16.5 5.7 12.7 13.7 25.2 25 39.5l.1.2c11.7 14.4 60.9 63.6 75.3 75.3l.1.1c14.3 11.3 26.9 19.3 39.5 25 5.7 2.6 12.3 1.2 16.5-3.4 5.6-6.1 11.5-12 17.3-17.6l1.9-1.8c1.2-1.2 2.4-2.4 3.7-3.6s2.4-2.4 3.6-3.6c6.1-6.1 12.8-9.3 19.5-9.3s13.4 3.2 19.5 9.3l23.8 23.8c2.6 2.6 5.3 5.2 8 7.8 5 4.9 10.4 10.1 15.3 15.5l.4.4c3.9 3.9 8.4 10.3 8.4 18.6.1 6.6-2.8 13.2-8.4 19z"></path><path class="lineal-stroke" d="M274.8 258.4h-36.5c.1-4.4 6.9-9 14.7-14.3 13.4-9.2 30-20.6 30-40.4 0-20.4-18.1-31.4-35.1-31.4-16.6 0-34.1 10.2-34.1 29.2 0 8.7 3.9 13.2 11.6 13.2 8.6 0 13.3-5 13.3-9.7 0-7.8 5.1-9.4 9.4-9.4 7.1 0 9.6 4.8 9.6 8.8 0 8-9.9 15.2-20.4 22.9-12.4 9.1-25.2 18.5-25.2 31.2v14c0 5.2 6.6 8.4 11.3 8.4h51.5c4.4 0 8.2-5.3 8.2-11.4s-3.8-11.1-8.3-11.1z"></path><path class="lineal-stroke" d="M351.9 234.9h-4.8v-8.7c0-5-5-8.2-12.7-8.2s-12.7 3.2-12.7 8.2v8.7H313l24.6-49.3c.5-1 .8-2.2.8-3.3 0-6.2-8.2-10-12.7-10-4.6-.1-8.8 2.5-10.7 6.6l-33.4 65.5c-.8 1.5-1.3 3.2-1.3 5 0 5.5 3.6 9.3 9 9.3h32.4v13.9c0 5.8 6.6 8.4 12.7 8.4s12.7-2.6 12.7-8.4v-13.9h4.8c4.3 0 8.4-5.8 8.4-11.9 0-5.7-2.6-11.9-8.4-11.9z"></path></svg>
|
||||
<h4>24/7 Support</h4>
|
||||
<p class="!mb-0">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta.</p>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.card -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !self-end !mt-[25px]">
|
||||
<div class="card !bg-[#fae6e7]">
|
||||
<div class="card-body p-[40px]">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 339.8 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shield.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#e2626b] text-red !mb-3 "><path class="lineal-stroke" d="M169.9 409.6c-5.5 0-10.9-1.2-15.8-3.5C107.8 384.8 0 327.5 0 255.5V72.1c0-10.7 8.7-19.4 19.4-19.5 2.1 0 4.2.3 6.1 1 9.2 3.1 18.9 4.7 28.6 4.6 31.5.1 60.7-16.3 76.9-43.3C136.6 5.7 146.6 0 157.4 0h25c10.8.1 20.8 5.7 26.4 14.9 16.2 27 45.4 43.4 76.9 43.3 9.7 0 19.4-1.6 28.6-4.6 10.2-3.4 21.2 2.1 24.6 12.3.7 2 1 4.1 1 6.1v48c0 6.5-5.3 11.8-11.7 11.8-6.5 0-11.8-5.3-11.8-11.7V77.6c-10 2.8-20.3 4.2-30.6 4.2-39.7.2-76.5-20.6-97-54.6-1.3-2.2-3.7-3.6-6.3-3.6h-25c-2.6 0-5 1.4-6.3 3.6-20.5 34-57.3 54.8-97 54.6-10.3 0-20.6-1.4-30.6-4.2v178c0 47.7 72.5 98 140.4 129.3 3.8 1.7 8.2 1.7 12 0 67.9-31.3 140.4-81.6 140.4-129.3v-74.9c0-6.5 5.3-11.8 11.8-11.7 6.5 0 11.7 5.3 11.7 11.7v74.9c0 72-107.8 129.3-154.1 150.6-5 2.2-10.4 3.4-15.9 3.4z"></path><path class="lineal-fill" d="M156 269l-62.2-31.1c-11.8-5.9-16.6-20.2-10.7-32 5.9-11.8 20.2-16.6 32-10.7l44.9 22.5 56.6-70.7c8.2-10.3 23.2-12 33.5-3.7 10.3 8.2 12 23.2 3.7 33.5l-68.6 85.8c-6.9 8.8-19.1 11.5-29.2 6.4z"></path><path class="lineal-stroke" d="M166.7 283.3c-5.5 0-11-1.3-15.9-3.8l-62.2-31.1c-17.6-8.8-24.7-30.2-15.9-47.8s30.2-24.7 47.8-15.9l36.4 18.2 50.6-63.3c12.3-15.4 34.7-17.9 50.1-5.6 15.4 12.3 17.9 34.7 5.6 50.1l-68.6 85.8c-6.8 8.5-17.1 13.4-27.9 13.4zm-62.2-78.8c-6.7 0-12.1 5.4-12.1 12.1 0 4.6 2.6 8.8 6.7 10.8l62.2 31.1c5.1 2.6 11.3 1.2 14.9-3.3l68.6-85.8c4.3-5.1 3.7-12.8-1.4-17.1-5.1-4.3-12.8-3.7-17.1 1.4-.1.2-.3.3-.4.5l-56.6 70.7c-3.5 4.3-9.5 5.6-14.4 3.2L110 205.6c-1.7-.7-3.6-1.1-5.5-1.1z"></path></svg>
|
||||
<h4>Secure Payments</h4>
|
||||
<p class="!mb-0">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta.</p>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.card -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-5/12 lg:w-5/12 md:w-5/12 w-full flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !mt-[25px]">
|
||||
<div class="card !bg-[#eaf3ef]">
|
||||
<div class="card-body p-[40px]">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 361.2" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/cloud-computing-3.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#7cb798] text-leaf !mb-3 "><path class="lineal-stroke" d="M309.9 231h-12.7c-6.1.2-11.3-4.6-11.5-10.8-.2-6.1 4.6-11.3 10.8-11.5h13.4c23 0 41.6-18.7 41.6-41.6 0-20-14.3-37.1-33.9-40.8-6-1.1-10-6.9-8.9-13 0-.3.1-.5.2-.7 10-38.6-13.2-78-51.8-88-5.9-1.5-11.9-2.3-18-2.3-24.7-.1-47.7 12.6-60.9 33.5-3 4.7-8.9 6.5-14 4.2-23.4-10.6-50.9-.2-61.5 23.2-2.7 6-4.1 12.5-4.1 19.1 0 3.6.4 7.2 1.3 10.7 1.4 6-2.3 12-8.3 13.4-.1 0-.2 0-.3.1-22.5 4.7-36.9 26.7-32.2 49.2 4 19.3 21 33.1 40.7 33.1h138.4c6.1.2 11 5.3 10.8 11.5-.2 5.9-4.9 10.6-10.8 10.8H99.8c-35.3 0-63.8-28.6-63.8-63.9 0-26.3 16.1-49.8 40.5-59.4-.1-1.8-.2-3.6-.2-5.4 0-38 30.8-68.7 68.8-68.7 6.6 0 13.2 1 19.5 2.8C196.6-4.7 255.9-12 297 20.1c26.6 20.7 40.1 54 35.4 87.4 33 12.4 49.6 49.3 37.2 82.3-9.3 24.8-33.2 41.2-59.7 41.2z"></path><path class="lineal-stroke" d="M204.8 334.3c-6.1 0-11.1-5-11.1-11.1V220.8c-.2-6.1 4.6-11.3 10.8-11.5 6.1-.2 11.3 4.6 11.5 10.8v103.1c-.1 6.1-5.1 11.1-11.2 11.1z"></path><path class="lineal-stroke" d="M398.5 334.3H11.1C5 334.1.1 329 .3 322.8c.2-5.9 4.9-10.6 10.8-10.8h387.4c6.1.2 11 5.3 10.8 11.5-.2 5.9-4.9 10.6-10.8 10.8z"></path><path class="lineal-fill" d="M234.8 350.1h-60.1c-8 0-14.5-6.5-14.5-14.4v-25c0-8 6.5-14.5 14.4-14.5h60.1c8 0 14.5 6.5 14.5 14.5v25c.1 7.9-6.4 14.4-14.4 14.4z"></path><path class="lineal-stroke" d="M234.8 361.2h-60.1c-14.1 0-25.6-11.5-25.6-25.6v-25c0-14.1 11.5-25.6 25.6-25.6h60.1c14.1 0 25.6 11.5 25.6 25.6v25c0 14.2-11.4 25.6-25.6 25.6zm-60-53.9c-1.8 0-3.3 1.5-3.3 3.3v25c0 1.8 1.5 3.3 3.3 3.3h60.1c1.8 0 3.3-1.5 3.3-3.3v-25c0-1.8-1.5-3.3-3.3-3.3h-60.1zM71.3 356.5c-6.1 0-11.1-5-11.1-11.1v-44.5c.2-6.1 5.3-11 11.5-10.8 5.9.2 10.6 4.9 10.8 10.8v44.5c-.1 6.1-5.1 11.1-11.2 11.1zm267 0c-6.1 0-11.1-5-11.1-11.1v-44.5c.2-6.1 5.3-11 11.5-10.8 5.9.2 10.6 4.9 10.8 10.8v44.5c-.1 6.1-5.1 11.1-11.2 11.1z"></path></svg>
|
||||
<h4>Daily Updates</h4>
|
||||
<p class="!mb-0">Nulla vitae elit libero, a pharetra augue.</p>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.card -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !self-start !mt-[25px]">
|
||||
<div class="card !bg-[#e0e9fa]">
|
||||
<div class="card-body p-[40px]">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 427.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/analytics.svg" class="svg-inject icon-svg icon-svg-md text-[#3f78e0] text-primary !mb-3 !w-[2.6rem] !h-[2.6rem]"><path class="lineal-fill" d="M186.9 353.4h138.3V413H186.9z"></path><path class="lineal-stroke" d="M460.2 0H51.8C23.2 0 0 23.2 0 51.8v264.4c0 28.6 23.2 51.7 51.8 51.8h120.6v30.6h-28.8c-8 0-14.5 6.5-14.5 14.5s6.5 14.5 14.5 14.5h224.9c8 0 14.5-6.5 14.5-14.5s-6.5-14.5-14.5-14.5h-28.8v-45.1c0-8-6.5-14.5-14.5-14.5H51.8C39.2 339 29 328.8 29 316.2V51.8C29 39.2 39.2 29 51.8 29h408.5c12.6 0 22.8 10.2 22.8 22.8v264.4c0 12.6-10.2 22.8-22.8 22.8h-45.9c-8-.2-14.6 6.1-14.8 14.1-.2 8 6.1 14.6 14.1 14.8h46.7c28.6 0 51.7-23.2 51.8-51.8V51.8C512 23.2 488.8 0 460.2 0zM201.3 398.5v-30.6h109.4v30.6H201.3z"></path><path class="lineal-fill" d="M218.2 291.3h-75.6v-90.6c0-20.9 16.9-37.8 37.8-37.8s37.8 16.9 37.8 37.8v90.6zm75.6 0h-75.6V155.4c0-20.9 16.9-37.8 37.8-37.8s37.8 16.9 37.8 37.8v135.9z"></path><path class="lineal-stroke" d="M369.4 215.4c8 0 14.4-6.4 14.5-14.4v-91c0-28.9-23.5-52.2-52.3-52.2-28.3 0-51.4 22.6-52.2 50.8-25.8-12.9-57.1-2.5-70.1 23.3-3.4 6.9-5.3 14.4-5.5 22.1-25.8-12.9-57.2-2.5-70.1 23.3-3.6 7.3-5.5 15.3-5.5 23.4v90.6c0 8 6.5 14.5 14.5 14.5h226.7c8 .2 14.6-6.1 14.8-14.1.2-8-6.1-14.6-14.1-14.8h-61.9V110c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v91c.1 8 6.6 14.4 14.6 14.4zm-212.3-14.7c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v76.1h-46.6v-76.1zm75.6 0v-45.4c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v121.5h-46.6v-76.1z"></path></svg>
|
||||
<h4>Market Research</h4>
|
||||
<p class="!mb-0">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget.</p>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.card -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
|
||||
<h2 class="!text-[.75rem] uppercase !text-[#aab0bc] !mb-3 !tracking-[0.02rem] !leading-[1.35]">What We Do?</h2>
|
||||
<h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-5">The service we offer is specifically designed to meet your needs.</h3>
|
||||
<p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Maecenas sed diam eget risus varius blandit sit amet non magna. Maecenas faucibus mollis interdum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
|
||||
<a href="#" class="btn btn-navy !text-white !bg-[#343f52] border-[#343f52] hover:text-white hover:bg-[#343f52] hover:!border-[#343f52] focus:shadow-[rgba(82,92,108,1)] active:text-white active:bg-[#343f52] active:border-[#343f52] disabled:text-white disabled:bg-[#343f52] disabled:border-[#343f52] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">More Details</a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#edf2fc]">
|
||||
<div class="container py-[4.5rem] md:pt-24 lg:pt-0 xl:pt-0 xl:pb-24 lg:pb-24 md:pb-24">
|
||||
<div class="flex flex-wrap mx-[-15px] !text-center">
|
||||
<div class="xl:w-10/12 lg:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<div class="lg:!mt-[-10rem] xl:!mt-[-15rem] !relative">
|
||||
<div class="shape bg-dot red rellax !w-[6rem] !h-[8rem] absolute opacity-50 bg-[radial-gradient(#e2626b_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: 1rem; left: -3.9rem;"></div>
|
||||
<div class="shape !rounded-[50%] bg-line primary rellax !w-[8rem] !h-[8rem] absolute opacity-50" data-rellax-speed="1" style="bottom: 2rem; right: -3rem;"></div>
|
||||
<video poster="assets/img/photos/movie.jpg" class="player relative z-[2] rounded-[0.4rem]" playsinline controls preload="none">
|
||||
<source src="assets/media/movie.mp4" type="video/mp4">
|
||||
<source src="assets/media/movie.html" type="video/webm">
|
||||
</video>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] !text-center">
|
||||
<div class="xl:w-9/12 lg:w-9/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<h2 class="!text-[.75rem] uppercase !text-[#aab0bc] !mb-3 !mt-[3.5rem] !tracking-[0.02rem]">Our Process</h2>
|
||||
<h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-0 !text-center xl:!px-10 xxl:!px-20">Find out everything you need to know about creating a business process model</h3>
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] process-wrapper !text-center !mt-9">
|
||||
<div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-fill" d="M160.9 221.3c-19.1 0-37.4-7.3-51.3-20.4l51.3 127.2 51.3-127.2c-13.9 13.1-32.3 20.4-51.3 20.4z"></path><path class="lineal-stroke" d="M160.9 339.9c-4.8 0-9.1-2.9-10.9-7.4L98.6 205.3c-2.5-6 .3-12.9 6.3-15.4 4.3-1.8 9.3-.9 12.7 2.4 24.3 22.9 62.2 22.9 86.5 0 4.7-4.5 12.1-4.3 16.6.3 3.2 3.4 4.2 8.3 2.4 12.7l-51.4 127.2c-1.7 4.5-6 7.4-10.8 7.4zm-27.5-111.3l27.5 68.1 27.5-68.1c-17.9 5.9-37.2 5.9-55 0z"></path><path class="lineal-stroke" d="M86.7 316.1c-5.9 0-10.9-4.4-11.7-10.2-2.2-16.6-9.8-23.9-22.3-36.1l-2.9-2.8C28.8 246.5 0 218.4 0 151.6c0-42.9 17.1-81.9 48-110C77.7 14.8 117.7 0 160.9 0s83.2 14.8 112.8 41.6c6.7 6.1 12.8 12.7 18.3 19.9 3.1 4.1 6 8.3 8.6 12.6 1.3 2.2 2.6 4.4 3.8 6.6 2.4 4.5 4.6 9.1 6.5 13.8 1.4 3.5 2.7 7.2 3.9 10.8 4.7 14.9 7 30.5 7 46.2 0 27.9-4.9 51.2-15 71.2-.6 1.2-1.2 2.4-1.8 3.5-1.8 3.3-3.8 6.5-5.9 9.6-.7 1-1.4 2-2 3-2.6 3.6-5.3 7.1-8.5 10.7-5.6 6.5-11.5 12.2-16.6 17.2-4.7 4.5-12.1 4.4-16.6-.2-4.5-4.7-4.4-12.1.2-16.6 5-4.9 10.2-9.9 15.2-15.7 2.6-3 4.9-6 7.1-9 .6-.8 1.1-1.6 1.7-2.4 1.7-2.5 3.3-5.2 4.7-7.8.5-.9 1-1.9 1.5-2.8 8.4-16.6 12.5-36.4 12.5-60.6 0-13.2-2-26.4-5.9-39.1-1-3.1-2.1-6.1-3.3-9.1-1.6-3.9-3.4-7.8-5.4-11.6-1-1.9-2.1-3.8-3.2-5.6-6.2-10.2-13.8-19.4-22.6-27.3-25.3-22.9-59.8-35.5-97-35.5S89.1 36.1 63.8 59c-26 23.5-40.3 56.4-40.3 92.5 0 56.9 22.7 79.1 42.8 98.6l2.8 2.7c13.4 13 26.1 25.2 29.3 49.9.9 6.4-3.7 12.4-10.1 13.2-.6.2-1.1.2-1.6.2z"></path><path class="lineal-fill" d="M141.9 397.8h38c3.8 0 7.4-1.5 10.1-4.2l13-13c2-2 3.4-4.6 3.9-7.4l12.4-63.7h-117l12.4 63.7c.6 2.8 2 5.4 4 7.4l13 13c2.7 2.7 6.3 4.2 10.2 4.2z"></path><path class="lineal-stroke" d="M179.8 409.6h-37.9c-6.9 0-13.6-2.7-18.5-7.7l-13-13c-3.7-3.7-6.2-8.4-7.2-13.5l-12.4-63.7c-1.2-6.4 2.9-12.5 9.3-13.8.7-.1 1.5-.2 2.2-.2h117c6.5 0 11.8 5.3 11.8 11.8 0 .8-.1 1.5-.2 2.2l-12.4 63.7c-1 5.1-3.5 9.8-7.2 13.5l-13 13c-4.8 4.9-11.5 7.7-18.5 7.7zm-63.2-88.4l9.7 49.7c.1.5.4 1 .7 1.4l13 13c.5.5 1.2.8 1.9.8h38c.7 0 1.4-.3 1.9-.8l13-13c.4-.4.6-.9.7-1.4l9.6-49.7h-88.5z"></path><path class="lineal-stroke" d="M241.5 321H80.2c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h161.4c6.5-.2 11.9 4.9 12.1 11.4.2 6.5-4.9 11.9-11.4 12.1h-.8zm-14.8 44.3H95c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h131.7c6.5.2 11.6 5.6 11.4 12.1-.2 6.2-5.2 11.2-11.4 11.4z"></path></svg>
|
||||
<h4 class="!mb-1">1. Concept</h4>
|
||||
<p>Nulla vitae elit libero elit non porta gravida eget metus cras.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 427.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/settings-3.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#e2626b] text-red !mb-3 m-[0_auto]"><path class="lineal-fill" d="M186.9 353.4h138.3V413H186.9z"></path><path class="lineal-stroke" d="M460.2 0H51.8C23.2 0 0 23.2 0 51.7v264.4c0 28.6 23.2 51.7 51.8 51.8h120.6v30.7h-28.8c-8 0-14.5 6.5-14.5 14.5s6.5 14.5 14.5 14.5h224.9c8 0 14.5-6.5 14.5-14.5s-6.5-14.5-14.5-14.5h-28.8v-41.9c.3-1.2.4-2.4.4-3.6-.2-8-6.9-14.3-14.8-14.1H51.8C39.2 339 29 328.8 29 316.2V51.7c0-12.6 10.2-22.8 22.8-22.8h408.5c12.6 0 22.8 10.2 22.8 22.8v264.4c0 12.6-10.2 22.8-22.8 22.8h-46.7c-8 .2-14.3 6.9-14.1 14.8.2 8 6.9 14.3 14.8 14.1h45.9c28.6 0 51.7-23.2 51.8-51.7V51.7C512 23.2 488.8 0 460.2 0zM310.7 367.9v30.7H201.3v-30.7h109.4z"></path><path class="lineal-fill" d="M220.1 271.6c-12.7-19.8-6.9-46.3 12.9-59s46.3-6.9 59 12.9c9 14 9 32 0 46.1h100.6v-50.3l-30.4-4.9c-4.9-16.3-13.6-31.3-25.3-43.7l11-28.7-47.3-27.3-19.4 23.8c-16.6-3.9-33.9-3.9-50.5 0l-19.4-23.8-47.2 27.3 11 28.7c-11.7 12.4-20.3 27.4-25.3 43.7l-30.3 4.9v50.3h100.6z"></path><path class="lineal-stroke" d="M392.5 286.1H291.9c-8 0-14.5-6.5-14.5-14.5 0-2.8.8-5.5 2.3-7.8 8.4-13.1 4.6-30.6-8.6-39-13.1-8.4-30.6-4.6-39 8.6-5.9 9.3-5.9 21.1 0 30.4 4.3 6.7 2.4 15.7-4.3 20-2.3 1.5-5.1 2.3-7.8 2.3H119.4c-8 0-14.5-6.5-14.4-14.5v-50.3c0-7.1 5.2-13.1 12.2-14.3l21.8-3.5c4.7-12.2 11.3-23.6 19.5-33.7l-7.9-20.6c-2.5-6.6.1-14.1 6.3-17.7l47.3-27.3c6.2-3.5 14-2.1 18.5 3.4l13.9 17.1c12.9-2 26.1-2 39 0l13.9-17.1c4.5-5.5 12.3-7 18.5-3.4l47.3 27.3c6.2 3.6 8.8 11.1 6.3 17.7l-7.9 20.6c8.2 10.2 14.7 21.5 19.4 33.7l21.8 3.5c7 1.1 12.2 7.2 12.2 14.3v50.3c-.1 8-6.6 14.5-14.6 14.5zm-80-29h65.6v-23.5l-18.2-2.9c-5.5-.9-10-4.8-11.6-10.1-4.3-14.2-11.9-27.2-22-38-3.8-4-5-9.9-3-15.1l6.6-17.2-25.9-15-11.6 14.3c-3.5 4.3-9.1 6.2-14.5 5-14.5-3.3-29.5-3.3-43.9 0-5.4 1.2-11-.7-14.5-5l-11.6-14.3-25.9 15 6.6 17.2c2 5.2.8 11-3 15.1-10.1 10.8-17.7 23.8-22 38-1.6 5.3-6.1 9.2-11.6 10.1l-18.2 2.9v23.5h65.6c-.4-2.8-.6-5.7-.6-8.6.4-31.6 26.3-56.8 57.9-56.4 31 .4 56 25.4 56.4 56.4 0 2.9-.2 5.8-.6 8.6z"></path></svg>
|
||||
<h4 class="!mb-1">2. Prepare</h4>
|
||||
<p>Nulla vitae elit libero elit non porta gravida eget metus cras.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 332.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/design.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#7cb798] text-leaf !mb-3 m-[0_auto]"><path class="lineal-stroke" d="M350.9 54.2H58.7c-6.2.2-11.4-4.7-11.5-10.9S51.8 31.9 58 31.7h292.9c6.2-.2 11.4 4.7 11.5 10.9s-4.7 11.4-10.9 11.5c-.2.1-.4.1-.6.1zM239.8 328.9a11.182 11.182 0 01-10.6-14.8c2.8-8.3 16.2-47.4 25.6-63.6-9.5-10.1-37-40.3-49.9-66.1-12.1 23.4-39.5 54.4-50.1 66 10.1 16.5 22.7 54.9 25.4 63.6.4 1.2.6 2.4.6 3.7 0 6.2-5 11.2-11.2 11.2-4.9 0-9.3-3.2-10.7-7.9v-.1c-6.6-20.7-18.4-52.9-24.3-60.3-4.8-6.1-3.4-14.5-.8-19.8.5-.9 1.1-1.8 1.8-2.6 20.6-22.3 50.7-59.4 52.7-72.4.6-3.7 3.3-10.1 14.8-10.7 12.5-.7 16.6 4.8 17.8 9.4 5.7 21.5 40 60.3 52.7 73.4.8.8 1.5 1.8 2 2.8 2.6 5.1 4 13.3-.5 19.5-5.7 7.7-18.2 41.6-24.8 61.1-1.3 4.6-5.6 7.7-10.5 7.6z"></path><path class="lineal-stroke" d="M204.8 254.9c-6.2 0-11.2-5-11.2-11.2V167c.3-6.2 5.6-10.9 11.8-10.6 5.7.3 10.3 4.9 10.6 10.6v76.7c0 6.2-5 11.2-11.2 11.2z"></path><path class="lineal-stroke" d="M366.6 244.6c-6.2 0-11.2-5-11.2-11.2v-28.6c0-83.1-67.6-150.6-150.6-150.6S54.2 121.7 54.2 204.8v28.6c-.2 6.2-5.4 11.1-11.5 10.9-5.9-.2-10.7-4.9-10.9-10.9v-28.6c-.1-95.5 77.2-172.9 172.7-173 46 0 90.1 18.2 122.6 50.8 32.6 32.3 50.9 76.3 50.9 122.2v28.6c-.1 6.2-5.2 11.2-11.4 11.2z"></path><path class="lineal-fill" d="M220 74.7h-30.4c-9.1 0-16.5-7.4-16.5-16.5V27.7c0-9.1 7.4-16.5 16.5-16.5H220c9.1 0 16.5 7.4 16.5 16.5v30.5c0 9.1-7.4 16.5-16.5 16.5z"></path><path class="lineal-stroke" d="M220 85.9h-30.4c-15.3 0-27.7-12.4-27.7-27.7V27.7c0-15.3 12.4-27.7 27.7-27.7H220c15.3 0 27.7 12.4 27.7 27.7v30.5c0 15.3-12.4 27.7-27.7 27.7zm-30.4-63.5c-2.9 0-5.3 2.4-5.3 5.3v30.5c0 2.9 2.4 5.3 5.3 5.3H220c2.9 0 5.3-2.4 5.3-5.3V27.7c0-2.9-2.4-5.3-5.3-5.3h-30.4z"></path><path class="lineal-fill" d="M381.9 275.4h-30.5c-9.1 0-16.5-7.4-16.5-16.5v-30.5c0-9.1 7.4-16.5 16.5-16.5h30.5c9.1 0 16.5 7.4 16.5 16.5v30.5c0 9.1-7.4 16.5-16.5 16.5z"></path><path class="lineal-stroke" d="M381.9 286.6h-30.5c-15.3 0-27.7-12.4-27.7-27.7v-30.5c0-15.3 12.4-27.7 27.7-27.7h30.5c15.3 0 27.7 12.4 27.7 27.7v30.5c0 15.3-12.4 27.7-27.7 27.7zm-30.5-63.4c-2.9 0-5.3 2.4-5.3 5.3V259c0 2.9 2.4 5.3 5.3 5.3h30.5c2.9 0 5.3-2.4 5.3-5.3v-30.5c0-2.9-2.4-5.3-5.3-5.3h-30.5z"></path><path class="lineal-fill" d="M58.2 275.4H27.7c-9.1 0-16.5-7.4-16.5-16.5v-30.5c0-9.1 7.4-16.5 16.5-16.5h30.5c9.1 0 16.5 7.4 16.5 16.5V259c0 9.1-7.4 16.5-16.5 16.4z"></path><path class="lineal-stroke" d="M58.2 286.6H27.7C12.4 286.6 0 274.2 0 258.9v-30.5c0-15.3 12.4-27.7 27.7-27.7h30.5c15.3 0 27.7 12.4 27.7 27.7v30.5c0 15.3-12.4 27.7-27.7 27.7zm-30.5-63.4c-2.9 0-5.3 2.4-5.3 5.3V259c0 2.9 2.4 5.3 5.3 5.3h30.5c2.9 0 5.3-2.4 5.3-5.3v-30.5c0-2.9-2.4-5.3-5.3-5.3H27.7zm234.1 109.5h-114c-6.2 0-11.2-5-11.2-11.2 0-6.2 5-11.2 11.2-11.2h114c6.2 0 11.2 5 11.2 11.2 0 6.2-5 11.2-11.2 11.2z"></path></svg>
|
||||
<h4 class="!mb-1">3. Retouch</h4>
|
||||
<p>Nulla vitae elit libero elit non porta gravida eget metus cras.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff]">
|
||||
<div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] !mb-[4.5rem] xl:!mb-24 lg:!mb-24 md:!mb-24 items-center">
|
||||
<div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
|
||||
<figure class="m-0 p-0"><img class="w-auto" src="assets/img/illustrations/i8.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
|
||||
<h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-6 xxl:!pr-6">We bring rapid solutions to make the life of our customers easier.</h3>
|
||||
<ul class="progress-list !mt-3 m-0 p-0">
|
||||
<li class="!mb-4">
|
||||
<p class="!mb-1">Marketing</p>
|
||||
<div class="progressbar line relative blue" data-value="100"></div>
|
||||
</li>
|
||||
<li class="!mb-4">
|
||||
<p class="!mb-1">Strategy</p>
|
||||
<div class="progressbar line relative yellow" data-value="80"></div>
|
||||
</li>
|
||||
<li class="!mb-4">
|
||||
<p class="!mb-1">Development</p>
|
||||
<div class="progressbar line relative orange" data-value="85"></div>
|
||||
</li>
|
||||
<li class="!mb-4">
|
||||
<p class="!mb-1">Data Analysis</p>
|
||||
<div class="progressbar line relative green" data-value="90"></div>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.progress-list -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center">
|
||||
<div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full xl:!order-2 lg:!order-2">
|
||||
<figure class="m-0 p-0"><img class="w-auto" src="assets/img/illustrations/i7.png" alt="image"></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
|
||||
<h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-5">We make your spending stress-free for you to have the perfect control.</h3>
|
||||
<p class="!mb-6">Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-15px]">
|
||||
<div class="xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[15px] max-w-full">
|
||||
<ul class="pl-0 list-none bullet-bg bullet-soft-primary !mb-0">
|
||||
<li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean quam ornare. Curabitur blandit.</span></li>
|
||||
<li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare.</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[15px] max-w-full">
|
||||
<ul class="pl-0 list-none bullet-bg bullet-soft-primary !mb-0">
|
||||
<li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta euismod malesuada mollis.</span></li>
|
||||
<li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Vivamus sagittis lacus vel augue rutrum.</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#edf2fc]">
|
||||
<div class="container pt-[4.5rem] pb-32 xl:pt-24 lg:pt-24 md:pt-24 xl:pb-60 lg:pb-60 md:pb-60 !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="lg:w-10/12 xl:w-9/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<h2 class="!text-[.75rem] uppercase !text-[#aab0bc] !mb-3 !tracking-[0.02rem] !leading-[1.35]">Our Pricing</h2>
|
||||
<h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-[5rem] xl:!mb-6 lg:!mb-6 md:!mb-6 lg:!px-10 xl:!px-10">We offer great prices, premium products and quality service for your business.</h3>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff]">
|
||||
<div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
|
||||
<div class="pricing-wrapper !relative z-[3] !mt-[-15rem] xl:!mt-[-20rem] lg:!mt-[-20rem] md:!mt-[-20rem]">
|
||||
<div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 2rem; right: -2.4rem;"></div>
|
||||
<div class="shape !rounded-[50%] bg-line red rellax !w-[8rem] !h-[8rem] hidden xl:block lg:block absolute z-[1] opacity-50" data-rellax-speed="1" style="bottom: 0.5rem; left: -2.5rem;"></div>
|
||||
<div class="flex flex-wrap items-center justify-center pricing-switcher-wrapper switcher">
|
||||
<p class="!mb-0 !pr-[.75rem]">Monthly</p>
|
||||
<div class="pricing-switchers w-8 h-4 clear-both !text-center !relative bg-[rgba(30,34,40,0.07)] !box-content rounded-3xl border-[0.2rem] border-solid border-transparent">
|
||||
<div class="pricing-switcher pricing-switcher-active cursor-pointer w-full float-left h-4 leading-4 !relative z-[888] transition-[0.3s] duration-[ease-in-out] uppercase !text-white"></div>
|
||||
<div class="pricing-switcher cursor-pointer w-full float-left h-4 leading-4 !relative z-[888] transition-[0.3s] duration-[ease-in-out] uppercase"></div>
|
||||
<div class="h-4 w-4 block absolute z-[555] transition-[0.3s] duration-[ease-in-out] m-0 rounded-[100%] border-[none] left-0 top-0 !bg-[rgba(63,120,224)] opacity-100 switcher-button"></div>
|
||||
</div>
|
||||
<p class="!mb-0 !pl-3 !relative">Yearly</p>
|
||||
</div>
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-3 xl:!mt-5 lg:!mt-5 md:!mt-5">
|
||||
<div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<div class="pricing card !text-center">
|
||||
<div class="card-body flex-[1_1_auto] pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 412.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shopping-basket.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-fill" d="M453.8 238.1l-9.6 76.3H67.8l-9.6-76.3z"></path><circle class="lineal-fill" cx="178.1" cy="149.9" r="35.1"></circle><circle class="lineal-fill" cx="333.9" cy="149.9" r="35.1"></circle><path class="lineal-stroke" d="M498.6 136.5h-60.2c-7.4-.2-13.6 5.7-13.8 13.1-.2 7.4 5.7 13.6 13.1 13.8h11.8l-7.5 61.3H70.1l-7.5-61.3h68.9c7.4 25.7 34.3 40.6 60 33.1 16-4.6 28.5-17.1 33.1-33.1h62.6c7.4 25.7 34.3 40.6 60 33.2 25.7-7.4 40.6-34.3 33.2-60-4.9-17.1-18.9-30.1-36.3-33.9l-39-94.2c-2.8-6.9-10.7-10.1-17.6-7.3s-10.1 10.7-7.3 17.6l35.7 86.2c-14 5.5-24.6 17.2-28.8 31.6h-62.6c-4.2-14.4-14.8-26.1-28.8-31.7l35.7-86.2c2.8-6.9-.4-14.7-7.3-17.6s-14.7.4-17.6 7.3l-39.1 94.2c-17.4 3.8-31.3 16.9-36.2 33.9H13.4C6 136.7.1 142.9.3 150.3c.2 7.1 5.9 12.9 13.1 13.1h22.1l29.8 237.8c.9 6.7 6.6 11.8 13.3 11.8h354.8c6.8 0 12.5-5 13.3-11.8l29.8-237.8h22c7.4-.2 13.3-6.4 13.1-13.8-.2-7.2-5.9-12.9-13-13.1zm-165-8.2c.4 0 .9.1 1.3.1h.7c11.9.9 20.8 11.3 19.9 23.2-.9 11.9-11.3 20.8-23.2 19.9-11.9-.9-20.8-11.3-19.9-23.2.8-11.1 10-19.7 21.2-20zm-157.1.1h.7c.4 0 .9-.1 1.3-.1 11.9.2 21.4 10 21.3 22-.2 11.9-10 21.4-22 21.3-11.9-.2-21.4-10-21.3-22 .2-11.2 8.9-20.4 20-21.2zm-103 123.1h365.1l-6.3 49.5H79.7l-6.2-49.5zM90.4 386L83 327.9h345.9l-7.4 58.1H90.4z"></path></svg>
|
||||
<h4 class="card-title">Basic Plan</h4>
|
||||
<div class="prices !text-[#343f52]">
|
||||
<div class="price price-show"><span class="price-currency">$</span><span class="price-value">9</span> <span class="price-duration">mo</span></div>
|
||||
<div class="price price-hide price-hidden"><span class="price-currency">$</span><span class="price-value">99</span> <span class="price-duration">yr</span></div>
|
||||
</div>
|
||||
<!--/.prices -->
|
||||
<ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
|
||||
<li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>1</strong> Project </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100MB</strong> Storage </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong> </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
|
||||
</ul>
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.pricing -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full popular !mt-[30px]">
|
||||
<div class="pricing card !text-center">
|
||||
<div class="card-body flex-[1_1_auto] pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 479.8 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/home.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M308 512H61.9c-8 0-14.4-6.5-14.4-14.4V227.2c0-4.3 2-8.4 5.4-11.2l178-143.7c5.3-4.3 12.8-4.3 18.1 0L427 216c3.4 2.7 5.4 6.9 5.4 11.2v269.6c-.2 8-6.8 14.3-14.8 14-7.7-.2-13.8-6.4-14-14V234.1L239.9 102 76.3 234.1v249.1H308c8 .2 14.3 6.8 14 14.8-.2 7.6-6.3 13.8-14 14z"></path><path class="lineal-stroke" d="M465.4 209.8c-3.3 0-6.4-1.1-9-3.2L239.9 32.9 23.5 206.7c-6.2 5-15.3 4-20.3-2.2s-4-15.3 2.2-20.3l225.5-181c5.3-4.2 12.8-4.2 18.1 0l225.5 181c6.2 5 7.2 14.1 2.2 20.3-2.8 3.3-6.9 5.3-11.3 5.3z"></path><ellipse transform="rotate(-80.781 239.904 207.686)" class="lineal-fill" cx="239.9" cy="207.7" rx="42.9" ry="43"></ellipse><path class="lineal-stroke" d="M239.9 265.1c-31.7 0-57.4-25.7-57.4-57.4s25.7-57.4 57.4-57.4 57.4 25.7 57.4 57.4c-.1 31.7-25.7 57.3-57.4 57.4zm0-85.9c-15.8 0-28.5 12.8-28.5 28.5s12.8 28.5 28.5 28.5 28.5-12.8 28.5-28.5c0-15.8-12.8-28.5-28.5-28.5z"></path><path class="lineal-fill" d="M171.8 325.7h136.1v171.9H171.8z"></path><path class="lineal-stroke" d="M308 512H171.8c-8 0-14.4-6.5-14.4-14.4V325.7c0-8 6.5-14.4 14.4-14.4H308c8 0 14.4 6.5 14.4 14.4v171.9c0 7.9-6.4 14.4-14.4 14.4zm-121.8-28.9h107.3v-143H186.2v143zm234.2-317.7c-7.9 0-14.4-6.5-14.4-14.4V73.3h-28.6c-8 0-14.4-6.5-14.4-14.4s6.5-14.4 14.4-14.4h43c8 0 14.4 6.5 14.4 14.4v92c0 8-6.4 14.4-14.4 14.5 0-.1 0 0 0 0z"></path></svg>
|
||||
<h4 class="card-title">Premium Plan</h4>
|
||||
<div class="prices !text-[#343f52]">
|
||||
<div class="price price-show"><span class="price-currency">$</span><span class="price-value">19</span> <span class="price-duration">mo</span></div>
|
||||
<div class="price price-hide price-hidden"><span class="price-currency">$</span><span class="price-value">199</span> <span class="price-duration">yr</span></div>
|
||||
</div>
|
||||
<!--/.prices -->
|
||||
<ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
|
||||
</ul>
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.pricing -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-4/12 xl:w-4/12 md:!ml-[25%] w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-0 lg:!ml-0 !mt-[30px]">
|
||||
<div class="pricing card !text-center">
|
||||
<div class="card-body flex-[1_1_auto] pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
|
||||
<h4 class="card-title">Corporate Plan</h4>
|
||||
<div class="prices !text-[#343f52]">
|
||||
<div class="price price-show"><span class="price-currency">$</span><span class="price-value">49</span> <span class="price-duration">mo</span></div>
|
||||
<div class="price price-hide price-hidden"><span class="price-currency">$</span><span class="price-value">499</span> <span class="price-duration">yr</span></div>
|
||||
</div>
|
||||
<!--/.prices -->
|
||||
<ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
|
||||
<li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
|
||||
</ul>
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.pricing -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!--/.pricing-wrapper -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper image-wrapper bg-auto no-overlay bg-image !text-center bg-map bg-[center_center] bg-no-repeat !bg-scroll relative z-[0]" data-image-src="assets/img/map.png">
|
||||
<div class="container pt-0 pb-[4.5rem] xl:pt-24 lg:pt-24 md:pt-24 xl:pb-32 lg:pb-32 md:pb-32">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="lg:w-10/12 xl:w-9/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<h2 class="!text-[.75rem] uppercase !text-[#aab0bc] !mb-3 !tracking-[0.02rem] !leading-[1.35]">Join Our Community</h2>
|
||||
<h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-8 lg:!px-14 xl:!px-14">We are trusted by over 5000+ clients. Join them now and grow your business.</h3>
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="md:w-10/12 lg:w-9/12 xl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
|
||||
<div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
|
||||
<h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem] !text-[#3f78e0]">7518</h3>
|
||||
<p class=" text-[0.8rem] font-medium !mb-0">Completed Projects</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
|
||||
<h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem] !text-[#3f78e0]">5472</h3>
|
||||
<p class=" text-[0.8rem] font-medium !mb-0">Satisfied Customers</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
|
||||
<h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem] !text-[#3f78e0]">2184</h3>
|
||||
<p class=" text-[0.8rem] font-medium !mb-0">Expert Employees</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0 !mt-0 xl:!mt-[6rem] lg:!mt-[6rem] md:!mt-[6rem]">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/services2 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:07 GMT -->
|
||||
</html>
|
||||
@@ -0,0 +1,982 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/shop-cart by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:26 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-soft-primary !bg-[#edf2fc]">
|
||||
<nav class="navbar navbar-expand-lg center-nav navbar-light navbar-bg-light">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item"><a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-search"><i class="uil uil-search before:content-['\eca5'] !text-[1.1rem]"></i></a></li>
|
||||
<li class="nav-item !ml-[.8rem]">
|
||||
<a class="nav-link !relative !flex !flex-row !items-center" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-cart">
|
||||
<i class="uil uil-shopping-cart !text-[1.1rem] before:content-['\ecbd']"></i>
|
||||
<span class="badge badge-cart bg-[#3f78e0] w-[0.9rem] h-[0.9rem] !flex items-center justify-center !text-[0.55rem] p-0 rounded-[100%] !bg-[rgba(63,120,224)] opacity-100">3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
<div class="offcanvas offcanvas-end bg-light" id="offcanvas-cart" data-bs-scroll="true">
|
||||
<div class="offcanvas-header flex items-center justify-between p-[1.5rem]">
|
||||
<h3 class="!mb-0">Your Cart</h3>
|
||||
<button type="button" class="btn-close m-0 p-0 !mr-[-.5rem] leading-none !text-[#343f52] transition-all duration-[0.2s] ease-in-out border-0 motion-reduce:transition-none before:text-[1.05rem] before:content-['\ed3b'] before:w-[1.8rem] before:h-[1.8rem] before:leading-[1.8rem] before:shadow-none before:transition-[background] before:duration-[0.2s] before:ease-in-out before:!flex before:justify-center before:items-center before:m-0 before:p-0 before:rounded-[100%] hover:no-underline bg-inherit before:bg-[rgba(0,0,0,.08)] before:font-Unicons hover:before:bg-[rgba(0,0,0,.11)]
|
||||
" data-bs-dismiss="offcanvas" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="offcanvas-body flex flex-col">
|
||||
<div class="shopping-cart">
|
||||
<div class="shopping-cart-item flex justify-between !mb-4">
|
||||
<div class="flex flex-row">
|
||||
<figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="assets/img/photos/sth1.jpg" alt="image"></a></figure>
|
||||
<div class="!w-full !ml-[1rem]">
|
||||
<h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Nike Air Sneakers</a></h3>
|
||||
<p class="price !text-[.7rem]"><del class="!text-[#9499a3]"><span class="amount">$55.00</span></del> <ins class="no-underline !text-[#e2626b]"><span class="amount">$45.99</span></ins></p>
|
||||
<div class="form-select-wrapper">
|
||||
<select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
|
||||
<option value="1" selected>1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
</select>
|
||||
</div>
|
||||
<!--/.form-select-wrapper -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
|
||||
</div>
|
||||
<!--/.shopping-cart-item -->
|
||||
<div class="shopping-cart-item flex justify-between !mb-4">
|
||||
<div class="flex flex-row">
|
||||
<figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="assets/img/photos/sth2.jpg" alt="image"></a></figure>
|
||||
<div class="!w-full !ml-[1rem]">
|
||||
<h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Colorful Sneakers</a></h3>
|
||||
<p class="price !text-[.7rem]"><span class="amount">$45.00</span></p>
|
||||
<div class="form-select-wrapper">
|
||||
<select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
|
||||
<option value="1" selected>1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
</select>
|
||||
</div>
|
||||
<!--/.form-select-wrapper -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
|
||||
</div>
|
||||
<!--/.shopping-cart-item -->
|
||||
<div class="shopping-cart-item flex justify-between !mb-4">
|
||||
<div class="flex flex-row">
|
||||
<figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="assets/img/photos/sth3.jpg" alt="image"></a></figure>
|
||||
<div class="!w-full !ml-[1rem]">
|
||||
<h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Polaroid Camera</a></h3>
|
||||
<p class="price !text-[.7rem]"><span class="amount">$45.00</span></p>
|
||||
<div class="form-select-wrapper">
|
||||
<select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
|
||||
<option value="1" selected>1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
</select>
|
||||
</div>
|
||||
<!--/.form-select-wrapper -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
|
||||
</div>
|
||||
<!--/.shopping-cart-item -->
|
||||
</div>
|
||||
<!-- /.shopping-cart-->
|
||||
<div class="offcanvas-footer flex-col text-center">
|
||||
<div class="flex !w-full justify-between !mb-4">
|
||||
<span>Subtotal:</span>
|
||||
<span class="h6 !mb-0">$135.99</span>
|
||||
</div>
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-start rounded !w-full !mb-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"><i class="uil uil-credit-card !text-[.9rem] !mr-[0.3rem] before:content-['\ea74']"></i> Checkout</a>
|
||||
<p class="!text-[.7rem] !mb-0">Free shipping on all orders over $50</p>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer-->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.offcanvas -->
|
||||
|
||||
<div class="offcanvas offcanvas-top bg-light" id="offcanvas-search" data-bs-scroll="true">
|
||||
<div class="container flex !flex-row py-6">
|
||||
<form class="search-form relative before:content-['\eca5'] before:block before:absolute before:-translate-y-2/4 before:text-[1rem] before:!text-[#343f52] before:z-[1] before:right-auto before:top-2/4 before:font-Unicons w-full before:left-0 focus:!outline-offset-0 ">
|
||||
<input id="search-form1" type="text" class="form-control text-[0.8rem] !shadow-none !pl-[1.75rem] !pr-[.75rem] border-0 bg-inherit m-0 block w-full font-medium !leading-[1.7] !text-[#60697b] px-4 py-[0.6rem] rounded-[0.4rem] focus:!outline-offset-0 " placeholder="Type keyword and hit enter">
|
||||
</form>
|
||||
<button type="button" class="btn-close leading-none !text-[#343f52] transition-all duration-[0.2s] ease-in-out p-0 border-0 motion-reduce:transition-none before:text-[1.05rem] before:content-['\ed3b'] before:w-[1.8rem] before:h-[1.8rem] before:leading-[1.8rem] before:shadow-none before:transition-[background] before:duration-[0.2s] before:ease-in-out before:!flex before:justify-center before:items-center before:m-0 before:p-0 before:rounded-[100%] hover:no-underline bg-inherit before:bg-[rgba(0,0,0,.08)] before:font-Unicons hover:before:bg-[rgba(0,0,0,.11)] " data-bs-dismiss="offcanvas" aria-label="Close"></button>
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /.offcanvas -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<div class="wrapper bg-[rgba(246,247,249,1)] ">
|
||||
<div class="container py-3 xl:!py-5 lg:!py-5 md:!py-5">
|
||||
<nav class="inline-block" aria-label="breadcrumb">
|
||||
<ol class="breadcrumb flex flex-wrap bg-[none] p-0 !rounded-none list-none !mb-0">
|
||||
<li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Home</a></li>
|
||||
<li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Shop</a></li>
|
||||
<li class="breadcrumb-item flex !text-[#aab0bc] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons active" aria-current="page">Cart</li>
|
||||
</ol>
|
||||
</nav>
|
||||
<!-- /nav -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff]">
|
||||
<div class="container pt-14 xl:pt-[4.5rem] lg:pt-[4.5rem] md:pt-[4.5rem] pb-[4.5rem] xl:pb-24 lg:pb-24 md:pb-24">
|
||||
<div class="flex flex-wrap mx-[-15px] md:mx-[-20px] xl:mx-[-35px] !mt-[-70px]">
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] !mt-[70px] max-w-full">
|
||||
<div class="table-responsive">
|
||||
<table class="table !text-center shopping-cart">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="!pl-0 !w-[22.5rem]">
|
||||
<div class="h4 !mb-0 text-left">Product</div>
|
||||
</th>
|
||||
<th>
|
||||
<div class="h4 !mb-0">Price</div>
|
||||
</th>
|
||||
<th>
|
||||
<div class="h4 !mb-0">Quantity</div>
|
||||
</th>
|
||||
<th>
|
||||
<div class="h4 !mb-0">Total</div>
|
||||
</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="option text-left flex flex-row items-center !pl-0">
|
||||
<figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="assets/img/photos/sth1.jpg" alt="image"></a></figure>
|
||||
<div class="w-full !ml-4">
|
||||
<h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Nike Air Sneakers</a></h3>
|
||||
<div class="small">Color: Black</div>
|
||||
<div class="small">Size: 43</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<p class="price !m-0"><del class="!text-[#9499a3]"><span class="amount">$55.00</span></del> <ins class="no-underline !text-[#e2626b]"><span class="amount">$45.99</span></ins></p>
|
||||
</td>
|
||||
<td>
|
||||
<div class="form-select-wrapper">
|
||||
<select class="form-select !w-auto !min-w-[2.5rem] !p-[.2rem_.5rem] !bg-[right_0.4rem_center] !mx-auto">
|
||||
<option value="1" selected>1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
</select>
|
||||
</div>
|
||||
<!--/.form-select-wrapper -->
|
||||
</td>
|
||||
<td>
|
||||
<p class="price !m-0"><span class="amount">$45.99</span></p>
|
||||
</td>
|
||||
<td class="!pr-0">
|
||||
<a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="option text-left flex flex-row items-center !pl-0">
|
||||
<figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="assets/img/photos/sth2.jpg" alt="image"></a></figure>
|
||||
<div class="w-full !ml-4">
|
||||
<h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Colorful Sneakers</a></h3>
|
||||
<div class="small">Color: Misc</div>
|
||||
<div class="small">Size: 43</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<p class="price !m-0"><span class="amount">$45.00</span></p>
|
||||
</td>
|
||||
<td>
|
||||
<div class="form-select-wrapper">
|
||||
<select class="form-select !w-auto !min-w-[2.5rem] !p-[.2rem_.5rem] !bg-[right_0.4rem_center] !mx-auto">
|
||||
<option value="1" selected>1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
</select>
|
||||
</div>
|
||||
<!--/.form-select-wrapper -->
|
||||
</td>
|
||||
<td>
|
||||
<p class="price !m-0"><span class="amount">$45.00</span></p>
|
||||
</td>
|
||||
<td class="!pr-0">
|
||||
<a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="option text-left flex flex-row items-center !pl-0">
|
||||
<figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="assets/img/photos/sth3.jpg" alt="image"></a></figure>
|
||||
<div class="w-full !ml-4">
|
||||
<h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Polaroid Camera</a></h3>
|
||||
<div class="small">Color: Black</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<p class="price !m-0"><span class="amount">$45.00</span></p>
|
||||
</td>
|
||||
<td>
|
||||
<div class="form-select-wrapper">
|
||||
<select class="form-select !w-auto !min-w-[2.5rem] !p-[.2rem_.5rem] !bg-[right_0.4rem_center] !mx-auto">
|
||||
<option value="1" selected>1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
</select>
|
||||
</div>
|
||||
<!--/.form-select-wrapper -->
|
||||
</td>
|
||||
<td>
|
||||
<p class="price !m-0"><span class="amount">$45.00</span></p>
|
||||
</td>
|
||||
<td class="!pr-0">
|
||||
<a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<!-- /.table-responsive -->
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-0">
|
||||
<div class="md:w-8/12 lg:w-7/12 xl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
|
||||
<div class="form-floating relative input-group">
|
||||
<input type="url" class="form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus-visible:!border-[rgba(63,120,224,0.5)] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" id="seo-check">
|
||||
<label for="seo-check" class="inline-block !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope
|
||||
">Enter promo code</label>
|
||||
<button class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" type="button">Apply</button>
|
||||
</div>
|
||||
<!-- /.input-group -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 lg:w-5/12 xl:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !ml-auto lg:!ml-0 xl:!ml-0 xl:!text-right lg:!text-right md:!text-right !mt-[20px]">
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Update Cart</a>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] !mt-[70px] max-w-full">
|
||||
<h3 class="!mb-4">Order Summary</h3>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-order">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="!pl-0"><strong class="!text-[#343f52]">Subtotal</strong></td>
|
||||
<td class="!pr-0 text-right">
|
||||
<p class="price !m-0">$135.99</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="!pl-0"><strong class="!text-[#343f52]">Discount (5%)</strong></td>
|
||||
<td class="!pr-0 text-right">
|
||||
<p class="price !text-[#e2626b] !m-0">-$6.8</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="!pl-0"><strong class="!text-[#343f52]">Shipping</strong></td>
|
||||
<td class="!pr-0 text-right">
|
||||
<p class="price !m-0">$10</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="!pl-0"><strong class="!text-[#343f52]">Grand Total</strong></td>
|
||||
<td class="!pr-0 text-right">
|
||||
<p class="price !text-[#343f52] font-bold !m-0">$152.79</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded w-full !mt-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Proceed to Checkout</a>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper bg-[rgba(246,247,249,1)]">
|
||||
<div class="container py-14 xl:!py-[4.5rem] lg:!py-[4.5rem] md:!py-[4.5rem]">
|
||||
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-40px]">
|
||||
<div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px] xl:!px-[35px] lg:!px-[20px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 202.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/shipment.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] solid-mono text-[#343f52] text-navy !mr-4"><path class="fill-primary" d="M235.33 170.66h-13a10.68 10.68 0 110-21.35h12.33V115l-29.94-40.65-34.05.29v74.69H176a10.67 10.67 0 110 21.33h-16A10.68 10.68 0 01149.33 160V73.58A20.49 20.49 0 01170 53.31h35.12a20.88 20.88 0 0116.82 8.47l30.19 41.44A19.87 19.87 0 01256 115v35.4a20.48 20.48 0 01-20.67 20.26z"></path><path class="fill-primary" d="M160 170.66H89.81a10.68 10.68 0 010-21.35h59.52V20.59l-128.71.74.71 128.72 19.67-.72a10.67 10.67 0 110 21.34H20.62A20.66 20.66 0 010 150.05V20.62A20.64 20.64 0 0120.62 0h129.43a20.64 20.64 0 0120.62 20.62V160A10.67 10.67 0 01160 170.66z"></path><path class="fill-primary" d="M200 202.66a32 32 0 1132-32 32 32 0 01-32 32zm-136 0a32 32 0 1132-32 32 32 0 01-32 32z"></path><path class="fill-secondary" d="M41.47 89.33A9.29 9.29 0 0136 87.52 9.84 9.84 0 0133.76 74l23.71-33.94a9.35 9.35 0 0113.22-2.25 9.85 9.85 0 012.21 13.52L49.18 85.26a9.35 9.35 0 01-7.71 4.07zm64 32a9.29 9.29 0 01-5.5-1.81A9.86 9.86 0 0197.76 106l23.71-33.93a9.36 9.36 0 0113.22-2.26 9.87 9.87 0 012.21 13.54l-23.72 33.93a9.35 9.35 0 01-7.71 4.07zm-42.3 0a9.65 9.65 0 01-5.6-1.79 10.17 10.17 0 01-2.5-14l44.31-65.22a9.7 9.7 0 0113.69-2.54 10.16 10.16 0 012.5 14L71.26 117a9.73 9.73 0 01-8.09 4.33z"></path></svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">Free Shipping</h4>
|
||||
<p class="!mb-0">Duis mollis gravida commodo id luctus erat porttitor ligula, eget lacinia odio sem.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px] xl:!px-[35px] lg:!px-[20px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/push-cart.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] solid-mono text-[#343f52] text-navy !mr-4"><path class="fill-secondary" d="M216 101.33H82.67a8.06 8.06 0 00-8 8v75.2a41.94 41.94 0 0120.91 18.13H216a8.07 8.07 0 008-8v-85.33a8.06 8.06 0 00-8-8zm-21.33 69.34h-32a8 8 0 010-16h32a8 8 0 010 16zM173.33 0H82.66a8 8 0 00-8 8v74.67a8 8 0 008 8h90.67a8 8 0 008-8V8a8 8 0 00-8-8zM152 74.67h-21.33a8 8 0 110-16H152a8 8 0 010 16z"></path><path class="fill-primary" d="M252.43 237.38l-14.33-12.79a31.8 31.8 0 00-24.35-11.25H88.7A31.94 31.94 0 0064 192.51V21.76A21.38 21.38 0 0042.91.43L10.82 0h-.15a10.67 10.67 0 00-.16 21.33l32.15.43v174.66a31.91 31.91 0 1046 38.25h125.09a10.63 10.63 0 018.33 4 11.38 11.38 0 001.22 1.33l14.93 13.33a10.69 10.69 0 007.1 2.7 10.67 10.67 0 007.1-18.62z"></path></svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">30 Days Return</h4>
|
||||
<p class="!mb-0">Duis mollis gravida commodo id luctus erat porttitor ligula, eget lacinia odio sem.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px] xl:!px-[35px] lg:!px-[20px]">
|
||||
<div class="flex flex-row">
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/verify.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] solid-mono text-[#343f52] text-navy !mr-4"><path class="fill-secondary" d="M186.67 117.33A69.34 69.34 0 10256 186.68a69.43 69.43 0 00-69.33-69.35zm37.34 55L186.68 215a10.65 10.65 0 01-7.68 3.63h-.35a10.67 10.67 0 01-7.53-3.12l-21.33-21.33a10.67 10.67 0 0115.09-15.09l13.26 13.27L208 158.3a10.67 10.67 0 1116 14.07z"></path><path class="fill-primary" d="M177.92 32.32L92.58.32a5.88 5.88 0 00-3.84 0l-85.35 32a5.36 5.36 0 00-3.39 5v68.59c0 97.28 88.64 117.76 89.5 118a6.28 6.28 0 002.34 0 73.48 73.48 0 0010.77-3.41A89.34 89.34 0 0196 186.68a90.78 90.78 0 0185.34-90.56V37.35a5.38 5.38 0 00-3.42-5z"></path></svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="!mb-1">2-Years Warranty</h4>
|
||||
<p class="!mb-0">Duis mollis gravida commodo id luctus erat porttitor ligula, eget lacinia odio sem.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/shop-cart by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:26 GMT -->
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,712 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/signin by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:27 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-soft-primary !bg-[#edf2fc]">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent position-absolute navbar-light xl:pt-[6px] lg:pt-[6px]">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="wrapper image-wrapper bg-image bg-overlay bg-overlay-light-600 !text-white !bg-fixed bg-no-repeat bg-[center_center] bg-cover relative z-0 before:content-[''] before:block before:absolute before:z-[1] before:w-full before:h-full before:left-0 before:top-0 before:bg-[rgba(255,255,255,.6)]" data-image-src="assets/img/photos/bg18.png">
|
||||
<div class="container pt-28 pb-40 xl:pt-36 lg:pt-36 md:pt-36 xl:pb-[12.5rem] lg:pb-[12.5rem] md:pb-[12.5rem] !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3">Sign In</h1>
|
||||
<nav class="inline-block" aria-label="breadcrumb">
|
||||
<ol class="breadcrumb flex flex-wrap bg-[none] !mb-4 p-0 !rounded-none list-none">
|
||||
<li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Home</a></li>
|
||||
<li class="breadcrumb-item active flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons" aria-current="page">Sign In</li>
|
||||
</ol>
|
||||
</nav>
|
||||
<!-- /nav -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper bg-light !bg-[#ffffff] ">
|
||||
<div class="container !pb-[4.5rem] xl:!pb-24 lg:!pb-24 md:!pb-24">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="lg:w-7/12 xl:w-6/12 xxl:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !mt-[-10rem]">
|
||||
<div class="card">
|
||||
<div class="card-body !p-12 !text-center">
|
||||
<h2 class="!mb-3 text-left">Welcome Back</h2>
|
||||
<p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-6 text-left">Fill your email and password to sign in.</p>
|
||||
<form class="text-left !mb-3">
|
||||
<div class="form-floating !relative !mb-4">
|
||||
<input id="loginEmail" type="email" name="email" class=" form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus-visible:!border-[rgba(63,120,224,0.5)] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="">
|
||||
<label for="loginEmail" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Email</label>
|
||||
</div>
|
||||
<div class="form-floating !relative password-field !mb-4">
|
||||
<input id="loginPassword" type="password" class=" form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus-visible:!border-[rgba(63,120,224,0.5)] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="">
|
||||
<span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
|
||||
<label for="loginPassword" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Password</label>
|
||||
</div>
|
||||
<a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
|
||||
</form>
|
||||
<!-- /form -->
|
||||
<p class="!mb-1"><a href="#" class="hover">Forgot Password?</a></p>
|
||||
<p class="!mb-0">Don't have an account? <a class='hover' href='signup.html'>Sign up</a></p>
|
||||
<div class="divider-icon !my-4">or</div>
|
||||
<nav class="nav social justify-center !text-center">
|
||||
<a href="#" class="btn btn-circle btn-sm btn-google hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)] !text-white !bg-[#e44134] !w-[1.8rem] !h-[1.8rem] !text-[0.8rem] !inline-flex !items-center !justify-center !leading-none !mx-[0.35rem] !my-0 !p-0 !rounded-[100%] !border-transparent"><i class="uil uil-google text-[0.85rem] before:content-['\eb50']"></i></a>
|
||||
<a href="#" class="btn btn-circle btn-sm btn-facebook-f hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)] !text-white !bg-[#4470cf] !w-[1.8rem] !h-[1.8rem] !text-[0.8rem] !inline-flex !items-center !justify-center !leading-none !mx-[0.35rem] !my-0 !p-0 !rounded-[100%] !border-transparent"><i class="uil uil-facebook-f text-[0.85rem] before:content-['\eae2']"></i></a>
|
||||
<a href="#" class="btn btn-circle btn-sm btn-twitter hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)] !text-white !bg-[#5daed5] !w-[1.8rem] !h-[1.8rem] !text-[0.8rem] !inline-flex !items-center !justify-center !leading-none !mx-[0.35rem] !my-0 !p-0 !rounded-[100%] !border-transparent"><i class="uil uil-twitter text-[0.85rem] before:content-['\ed59']"></i></a>
|
||||
</nav>
|
||||
<!--/.social -->
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.card -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/signin by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:28 GMT -->
|
||||
</html>
|
||||
@@ -0,0 +1,722 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/signin2 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:28 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-soft-primary !bg-[#edf2fc]">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent position-absolute xl:pt-[6px] lg:pt-[6px] navbar-dark">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img class="logo-dark" src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
<img class="logo-light" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-white !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="wrapper bg-[#21262c] opacity-100 !text-white">
|
||||
<div class="container pt-32 xl:pt-40 lg:pt-40 md:pt-40 pb-[12.5rem] xl:pb-[12.5rem] lg:pb-[12.5rem] md:pb-[12.5rem] !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3 !text-white">Sign In</h1>
|
||||
<nav class="inline-block" aria-label="breadcrumb">
|
||||
<ol class="breadcrumb flex flex-wrap bg-[none] !mb-4 p-0 !rounded-none list-none">
|
||||
<li class="breadcrumb-item flex !text-[#60697b]"><a class=" text-inherit !text-white hover:!text-white" href="#">Home</a></li>
|
||||
<li class="breadcrumb-item active flex !text-white !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(255,255,255,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons" aria-current="page">Sign In</li>
|
||||
</ol>
|
||||
</nav>
|
||||
<!-- /nav -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff]">
|
||||
<div class="container !pb-[4.5rem] xl:!pb-24 lg:!pb-24 md:!pb-24">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="!mt-[-9rem] w-full flex-[1_0_0%] !px-[15px] max-w-full !relative z-[3]">
|
||||
<div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
|
||||
<div class="flex flex-wrap mx-0 !text-center">
|
||||
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] max-w-full image-wrapper bg-image rounded-t-[0.4rem] rounded-lg-start max-sm:!hidden !block bg-cover bg-[center_center] bg-no-repeat !bg-scroll md:min-h-[25rem]" data-image-src="assets/img/photos/tm3.jpg">
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<div class="!p-10 md:!p-12 xl:!p-[4rem] lg:!p-[4rem]">
|
||||
<h2 class="!mb-3 text-left">Welcome Back</h2>
|
||||
<p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-6 text-left">Fill your email and password to sign in.</p>
|
||||
<form class="text-left !mb-3">
|
||||
<div class="form-floating !relative !mb-4">
|
||||
<input id="loginEmail" type="email" name="email" class=" form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus-visible:!border-[rgba(63,120,224,0.5)] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="">
|
||||
<label for="loginEmail" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Email</label>
|
||||
</div>
|
||||
<div class="form-floating !relative password-field !mb-4">
|
||||
<input id="loginPassword" type="password" class=" form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus-visible:!border-[rgba(63,120,224,0.5)] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="">
|
||||
<span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
|
||||
<label for="loginPassword" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Password</label>
|
||||
</div>
|
||||
<a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
|
||||
</form>
|
||||
<!-- /form -->
|
||||
<p class="!mb-1"><a href="#" class="hover">Forgot Password?</a></p>
|
||||
<p class="!mb-0">Don't have an account? <a class='hover' href='signup.html'>Sign up</a></p>
|
||||
<div class="divider-icon !my-4">or</div>
|
||||
<nav class="nav social justify-center !text-center">
|
||||
<a href="#" class="btn btn-circle btn-sm btn-google hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)] !text-white !bg-[#e44134] !w-[1.8rem] !h-[1.8rem] !text-[0.8rem] !inline-flex !items-center !justify-center !leading-none !mx-[0.35rem] !my-0 !p-0 !rounded-[100%] !border-transparent"><i class="uil uil-google text-[0.85rem] before:content-['\eb50']"></i></a>
|
||||
<a href="#" class="btn btn-circle btn-sm btn-facebook-f hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)] !text-white !bg-[#4470cf] !w-[1.8rem] !h-[1.8rem] !text-[0.8rem] !inline-flex !items-center !justify-center !leading-none !mx-[0.35rem] !my-0 !p-0 !rounded-[100%] !border-transparent"><i class="uil uil-facebook-f text-[0.85rem] before:content-['\eae2']"></i></a>
|
||||
<a href="#" class="btn btn-circle btn-sm btn-twitter hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)] !text-white !bg-[#5daed5] !w-[1.8rem] !h-[1.8rem] !text-[0.8rem] !inline-flex !items-center !justify-center !leading-none !mx-[0.35rem] !my-0 !p-0 !rounded-[100%] !border-transparent"><i class="uil uil-twitter text-[0.85rem] before:content-['\ed59']"></i></a>
|
||||
</nav>
|
||||
<!--/.social -->
|
||||
</div>
|
||||
<!--/div -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/signin2 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:28 GMT -->
|
||||
</html>
|
||||
@@ -0,0 +1,720 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/signup by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:28 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-soft-primary !bg-[#edf2fc]">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent position-absolute navbar-light xl:pt-[6px] lg:pt-[6px]">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="wrapper image-wrapper bg-image bg-overlay bg-overlay-light-600 !text-white !bg-fixed bg-no-repeat bg-[center_center] bg-cover relative z-0 before:content-[''] before:block before:absolute before:z-[1] before:w-full before:h-full before:left-0 before:top-0 before:bg-[rgba(255,255,255,.6)]" data-image-src="assets/img/photos/bg18.png">
|
||||
<div class="container pt-28 pb-40 xl:pt-36 lg:pt-36 md:pt-36 xl:pb-[12.5rem] lg:pb-[12.5rem] md:pb-[12.5rem] !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3">Sign Up</h1>
|
||||
<nav class="inline-block" aria-label="breadcrumb">
|
||||
<ol class="breadcrumb flex flex-wrap bg-[none] !mb-4 p-0 !rounded-none list-none">
|
||||
<li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Home</a></li>
|
||||
<li class="breadcrumb-item active flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons" aria-current="page">Sign Up</li>
|
||||
</ol>
|
||||
</nav>
|
||||
<!-- /nav -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper bg-light !bg-[#ffffff] ">
|
||||
<div class="container !pb-[4.5rem] xl:!pb-24 lg:!pb-24 md:!pb-24">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="lg:w-7/12 xl:w-6/12 xxl:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !mt-[-10rem]">
|
||||
<div class="card">
|
||||
<div class="card-body !p-12 !text-center">
|
||||
<h2 class="!mb-3 text-left">Sign up to Trunçgil</h2>
|
||||
<p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-6 text-left">Registration takes less than a minute.</p>
|
||||
<form class="text-left !mb-3">
|
||||
<div class="form-floating !relative !mb-4">
|
||||
<input id="loginName" type="text" class=" form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus-visible:!border-[rgba(63,120,224,0.5)] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="">
|
||||
<label for="loginName" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Name</label>
|
||||
</div>
|
||||
<div class="form-floating !relative !mb-4">
|
||||
<input id="loginEmail" type="email" name="email" class=" form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus-visible:!border-[rgba(63,120,224,0.5)] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="">
|
||||
<label for="loginEmail" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Email</label>
|
||||
</div>
|
||||
<div class="form-floating !relative password-field !mb-4">
|
||||
<input id="loginPassword" type="password" class=" form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus-visible:!border-[rgba(63,120,224,0.5)] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="">
|
||||
<span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
|
||||
<label for="loginPassword" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Password</label>
|
||||
</div>
|
||||
<div class="form-floating !relative password-field !mb-4">
|
||||
<input id="loginPasswordConfirm" type="password" class=" form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus-visible:!border-[rgba(63,120,224,0.5)] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="">
|
||||
<span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
|
||||
<label for="loginPasswordConfirm" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Confirm Password</label>
|
||||
</div>
|
||||
<a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
|
||||
</form>
|
||||
<!-- /form -->
|
||||
<p class="!mb-0">Already have an account? <a class='hover' href='signin.html'>Sign in</a></p>
|
||||
<div class="divider-icon !my-4">or</div>
|
||||
<nav class="nav social justify-center !text-center">
|
||||
<a href="#" class="btn btn-circle btn-sm btn-google hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)] !text-white !bg-[#e44134] !w-[1.8rem] !h-[1.8rem] !text-[0.8rem] !inline-flex !items-center !justify-center !leading-none !mx-[0.35rem] !my-0 !p-0 !rounded-[100%] !border-transparent"><i class="uil uil-google text-[0.85rem] before:content-['\eb50']"></i></a>
|
||||
<a href="#" class="btn btn-circle btn-sm btn-facebook-f hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)] !text-white !bg-[#4470cf] !w-[1.8rem] !h-[1.8rem] !text-[0.8rem] !inline-flex !items-center !justify-center !leading-none !mx-[0.35rem] !my-0 !p-0 !rounded-[100%] !border-transparent"><i class="uil uil-facebook-f text-[0.85rem] before:content-['\eae2']"></i></a>
|
||||
<a href="#" class="btn btn-circle btn-sm btn-twitter hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)] !text-white !bg-[#5daed5] !w-[1.8rem] !h-[1.8rem] !text-[0.8rem] !inline-flex !items-center !justify-center !leading-none !mx-[0.35rem] !my-0 !p-0 !rounded-[100%] !border-transparent"><i class="uil uil-twitter text-[0.85rem] before:content-['\ed59']"></i></a>
|
||||
</nav>
|
||||
<!--/.social -->
|
||||
</div>
|
||||
<!--/.card-body -->
|
||||
</div>
|
||||
<!--/.card -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/signup by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:28 GMT -->
|
||||
</html>
|
||||
@@ -0,0 +1,730 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/signup2 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:28 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-soft-primary !bg-[#edf2fc]">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent position-absolute xl:pt-[6px] lg:pt-[6px] navbar-dark">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img class="logo-dark" src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
<img class="logo-light" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-white !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="wrapper bg-[#21262c] opacity-100 !text-white">
|
||||
<div class="container pt-32 xl:pt-40 lg:pt-40 md:pt-40 pb-[12.5rem] xl:pb-[12.5rem] lg:pb-[12.5rem] md:pb-[12.5rem] !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3 !text-white">Sign Up</h1>
|
||||
<nav class="inline-block" aria-label="breadcrumb">
|
||||
<ol class="breadcrumb flex flex-wrap bg-[none] !mb-4 p-0 !rounded-none list-none">
|
||||
<li class="breadcrumb-item flex !text-[#60697b]"><a class="text-inherit !text-white hover:!text-white" href="#">Home</a></li>
|
||||
<li class="breadcrumb-item active flex !text-white !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(255,255,255,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons" aria-current="page">Sign Up</li>
|
||||
</ol>
|
||||
</nav>
|
||||
<!-- /nav -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff]">
|
||||
<div class="container !pb-[4.5rem] xl:!pb-24 lg:!pb-24 md:!pb-24">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="!mt-[-9rem] w-full flex-[1_0_0%] !px-[15px] max-w-full !relative z-[3]">
|
||||
<div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
|
||||
<div class="flex flex-wrap mx-0 !text-center">
|
||||
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] max-w-full image-wrapper bg-image rounded-t-[0.4rem] rounded-lg-start max-sm:!hidden !block bg-cover bg-[center_center] bg-no-repeat !bg-scroll md:min-h-[25rem]" data-image-src="assets/img/photos/tm3.jpg">
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<div class="!p-10 md:!p-12 xl:!p-[4rem] lg:!p-[4rem]">
|
||||
<h2 class="!mb-3 text-left">Sign up to Trunçgil</h2>
|
||||
<p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-6 text-left">Registration takes less than a minute.</p>
|
||||
<form class="text-left !mb-3">
|
||||
<div class="form-floating !relative !mb-4">
|
||||
<input id="loginName" type="text" class=" form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus-visible:!border-[rgba(63,120,224,0.5)] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="">
|
||||
<label for="loginName" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Name</label>
|
||||
</div>
|
||||
<div class="form-floating !relative !mb-4">
|
||||
<input id="loginEmail" type="email" name="email" class=" form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus-visible:!border-[rgba(63,120,224,0.5)] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="">
|
||||
<label for="loginEmail" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Email</label>
|
||||
</div>
|
||||
<div class="form-floating !relative password-field !mb-4">
|
||||
<input id="loginPassword" type="password" class=" form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus-visible:!border-[rgba(63,120,224,0.5)] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="">
|
||||
<span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
|
||||
<label for="loginPassword" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Password</label>
|
||||
</div>
|
||||
<div class="form-floating !relative password-field !mb-4">
|
||||
<input id="loginPasswordConfirm" type="password" class=" form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus-visible:!border-[rgba(63,120,224,0.5)] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="">
|
||||
<span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
|
||||
<label for="loginPasswordConfirm" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Confirm Password</label>
|
||||
</div>
|
||||
<a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
|
||||
</form>
|
||||
<!-- /form -->
|
||||
<p class="!mb-0">Already have an account? <a class='hover' href='signin2.html'>Sign in</a></p>
|
||||
<div class="divider-icon !my-4">or</div>
|
||||
<nav class="nav social justify-center !text-center">
|
||||
<a href="#" class="btn btn-circle btn-sm btn-google hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)] !text-white !bg-[#e44134] !w-[1.8rem] !h-[1.8rem] !text-[0.8rem] !inline-flex !items-center !justify-center !leading-none !mx-[0.35rem] !my-0 !p-0 !rounded-[100%] !border-transparent"><i class="uil uil-google text-[0.85rem] before:content-['\eb50']"></i></a>
|
||||
<a href="#" class="btn btn-circle btn-sm btn-facebook-f hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)] !text-white !bg-[#4470cf] !w-[1.8rem] !h-[1.8rem] !text-[0.8rem] !inline-flex !items-center !justify-center !leading-none !mx-[0.35rem] !my-0 !p-0 !rounded-[100%] !border-transparent"><i class="uil uil-facebook-f text-[0.85rem] before:content-['\eae2']"></i></a>
|
||||
<a href="#" class="btn btn-circle btn-sm btn-twitter hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)] !text-white !bg-[#5daed5] !w-[1.8rem] !h-[1.8rem] !text-[0.8rem] !inline-flex !items-center !justify-center !leading-none !mx-[0.35rem] !my-0 !p-0 !rounded-[100%] !border-transparent"><i class="uil uil-twitter text-[0.85rem] before:content-['\ed59']"></i></a>
|
||||
</nav>
|
||||
<!--/.social -->
|
||||
</div>
|
||||
<!--/div -->
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/signup2 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:29 GMT -->
|
||||
</html>
|
||||
@@ -0,0 +1,772 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/single-project by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:50 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-soft-primary !bg-[#edf2fc]">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent navbar-light xl:pt-[.3rem] lg:pt-[.3rem]">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="wrapper !bg-[#edf2fc]">
|
||||
<div class="container pt-10 pb-36 xl:pt-[4.5rem] lg:pt-[4.5rem] md:pt-[4.5rem] xl:pb-60 lg:pb-60 md:pb-60 !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="md:w-10/12 lg:w-8/12 xl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
|
||||
<a href="#" class="hover" rel="category">Identity</a>
|
||||
</div>
|
||||
<!-- /.post-category -->
|
||||
<h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3">Commodo Dolor Bibendum Parturient Cursus Mollis</h1>
|
||||
<p class="lead !leading-[1.65] text-[.9rem] font-medium md:!px-14 lg:!px-14 xl:!px-20 xxl:!px-32">Integer posuere erat a ante venenatis dapibus posuere. Maecenas faucibus mollis interdum.</p>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<div class="wrapper !bg-[#ffffff] border-b-[rgba(164,174,198,0.2)] border-b border-solid">
|
||||
<div class="container !pb-[4.5rem] xl:!pb-24 lg:!pb-24 md:!pb-24">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="w-full flex-[0_0_auto] !px-[15px] max-w-full">
|
||||
<article class="!mt-[-12.5rem]">
|
||||
<figure class="!rounded-[.4rem] !mb-8 xl:!mb-[3.5rem] lg:!mb-[3.5rem] md:!mb-[3.5rem]"><img class="!rounded-[.4rem]" src="assets/img/photos/pp1.jpg" alt="image"></figure>
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="xl:w-10/12 xl:!ml-[8.33333333%] lg:w-10/12 lg:!ml-[8.33333333%] w-full flex-[0_0_auto] !px-[15px] max-w-full">
|
||||
<h2 class="!text-[calc(1.265rem_+_0.18vw)] font-bold xl:!text-[1.4rem] !leading-[1.35] !mb-4">About the Project</h2>
|
||||
<div class="flex flex-wrap mx-0">
|
||||
<div class="xl:w-9/12 lg:w-9/12 md:w-9/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<p>Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Integer posuere erat a ante venenatis. Etiam porta sem malesuada magna mollis euismod. Aenean lacinia bibendum.</p>
|
||||
<p>Donec id elit non mi porta gravida at eget metus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consectetur est at lobortis. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-2/12 lg:w-2/12 md:w-2/12 w-full flex-[0_0_auto] max-w-full !ml-auto">
|
||||
<ul class="pl-0 list-none">
|
||||
<li>
|
||||
<h5 class="!mb-1">Date</h5>
|
||||
<p>17 May 2018</p>
|
||||
</li>
|
||||
<li>
|
||||
<h5 class="!mb-1">Client Name</h5>
|
||||
<p>Cool House</p>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="#" class="more hover">See Project</a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] md:mx-[-15px] !mt-[25px]">
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="overflow-hidden translate-y-0 group rounded cursor-dark"><a href="assets/img/photos/pp2.jpg" data-glightbox data-gallery="project-1"><img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/pp2.jpg" alt="image"></a></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="overflow-hidden translate-y-0 group rounded cursor-dark"><a href="assets/img/photos/pp3.jpg" data-glightbox data-gallery="project-1"><img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/pp3.jpg" alt="image"></a></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="overflow-hidden translate-y-0 group rounded cursor-dark"><a href="assets/img/photos/pp4.jpg" data-glightbox data-gallery="project-1"><img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/pp4.jpg" alt="image"></a></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="item xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="overflow-hidden translate-y-0 group rounded cursor-dark"><a href="assets/img/photos/pp5.jpg" data-glightbox data-gallery="project-1"><img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/pp5.jpg" alt="image"></a></figure>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-8 xl:!mt-[4.5rem] lg:!mt-[4.5rem] md:!mt-[4.5rem]">
|
||||
<div class="xl:w-10/12 xl:!ml-[8.33333333%] lg:w-10/12 lg:!ml-[8.33333333%] md:w-10/12 md:!ml-[8.33333333%] flex-[0_0_auto] !px-[15px] max-w-full">
|
||||
<h2 class="!mb-4">Quam Mollis Bibendum</h2>
|
||||
<p>Maecenas sed diam eget risus varius blandit sit amet non magna. Donec ullamcorper nulla non metus auctor fringilla. Cras mattis consectetur purus sit amet fermentum. Aenean lacinia bibendum nulla sed consectetur. Curabitur blandit tempus porttitor. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec id elit non mi porta gravida at eget metus. Donec id elit non mi porta gravida at eget metus. Cras mattis consectetur purus sit amet fermentum.</p>
|
||||
<p>Aenean lacinia bibendum nulla sed consectetur. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Maecenas faucibus mollis interdum. Maecenas sed diam eget risus varius blandit sit amet non magna. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Nulla vitae elit libero, a pharetra augue. Maecenas faucibus mollis interdum etiam porta.</p>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</article>
|
||||
<!-- /.project -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /section -->
|
||||
<div class="wrapper !bg-[#ffffff]">
|
||||
<div class="container py-10">
|
||||
<div class="flex flex-wrap mx-[-15px] md:mx-[-15px] !mt-[-15px] xl:!mt-0 lg:!mt-0 md:!mt-0">
|
||||
<div class="xl:w-8/12 lg:w-8/12 md:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full self-center text-center xl:text-left lg:text-left md:text-left navigation">
|
||||
<a href="#" class="btn btn-soft-ash !rounded-[50rem] btn-icon btn-icon-start !mb-0 !mr-[.25rem] hover:translate-y-[-0.15rem]"><i class="uil uil-arrow-left before:content-['\e949']"></i> Prev Post</a>
|
||||
<a href="#" class="btn btn-soft-ash !rounded-[50rem] btn-icon btn-icon-end hover:translate-y-[-0.15rem] !mb-0">Next Post <i class="uil uil-arrow-right before:content-['\e94c']"></i></a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<aside class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full max-md:!mt-[15px] sidebar text-center xl:text-right lg:text-right md:text-right">
|
||||
<!--/.share-dropdown -->
|
||||
<div class="dropdown share-dropdown btn-group">
|
||||
<button class="btn btn-red !text-white !bg-[#e2626b] border-[#e2626b] hover:text-white hover:bg-[#e2626b] hover:!border-[#e2626b] active:text-white active:bg-[#e2626b] active:border-[#e2626b] disabled:text-white disabled:bg-[#e2626b] disabled:border-[#e2626b] !rounded-[50rem] btn-icon btn-icon-start dropdown-toggle !mb-0 !mr-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<i class="uil uil-share-alt !mr-[0.3rem] text-[0.8rem] before:content-['\ecb0']"></i> Share </button>
|
||||
<div class="dropdown-menu !shadow-[rgba(30,34,40,0.06)_0px_0px_25px_0px]" style="">
|
||||
<a class="dropdown-item text-[0.7rem] !p-[.25rem_1.15rem]" href="#"><i class="uil uil-twitter w-4 text-[0.8rem] pr-[0.4rem] align-[-.1rem] before:content-['\ed59']"></i>Twitter</a>
|
||||
<a class="dropdown-item text-[0.7rem] !p-[.25rem_1.15rem]" href="#"><i class="uil uil-facebook-f w-4 text-[0.8rem] pr-[0.4rem] align-[-.1rem] before:content-['\eae2']"></i>Facebook</a>
|
||||
<a class="dropdown-item text-[0.7rem] !p-[.25rem_1.15rem]" href="#"><i class="uil uil-linkedin w-4 text-[0.8rem] pr-[0.4rem] align-[-.1rem] before:content-['\ebd1']"></i>Linkedin</a>
|
||||
</div>
|
||||
<!--/.dropdown-menu -->
|
||||
</div>
|
||||
</aside>
|
||||
<!-- /column .sidebar -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/single-project by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:53 GMT -->
|
||||
</html>
|
||||
@@ -0,0 +1,782 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/single-project2 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:53 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-soft-primary !bg-[rgba(254,254,254)]">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent navbar-light xl:pt-[.3rem] lg:pt-[.3rem]">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="wrapper !bg-[rgba(254,254,254)]">
|
||||
<div class="container pt-10 pb-9 xl:pt-[4.5rem] lg:pt-[4.5rem] md:pt-[4.5rem] xl:pb-[3rem] lg:pb-[3rem] md:pb-[3rem] !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="md:w-10/12 lg:w-8/12 xl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
|
||||
<a href="#" class="hover" rel="category">Identity</a>
|
||||
</div>
|
||||
<!-- /.post-category -->
|
||||
<h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3">Commodo Dolor Bibendum Parturient Cursus Mollis</h1>
|
||||
<p class="lead !leading-[1.65] text-[.9rem] font-medium md:!px-14 lg:!px-14 xl:!px-20 xxl:!px-32">Integer posuere erat a ante venenatis dapibus posuere. Maecenas faucibus mollis interdum.</p>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<div class="wrapper !bg-[#ffffff] border-b-[rgba(164,174,198,0.2)] border-b border-solid">
|
||||
<div class="container !pb-[4.5rem] xl:!pb-24 lg:!pb-24 md:!pb-24">
|
||||
<article>
|
||||
<div class="post-slider !mb-8 xl:!mb-14 lg:!mb-14 md:!mb-14">
|
||||
<div class="swiper-container dots-over relative !z-10" data-margin="5" data-dots="true" data-nav="true" data-autoheight="true">
|
||||
<div class="swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<div class="swiper-slide !rounded-[.4rem]">
|
||||
<img class="!rounded-[.4rem]" src="assets/img/photos/pp7.jpg" alt="image">
|
||||
<div class="caption-wrapper p-14">
|
||||
<div class="caption bg-[rgba(255,255,255)] opacity-100 !rounded-[.4rem] px-4 py-3 !ml-auto !mt-auto animate__animated animate__slideInDown animate__delay-1s">
|
||||
<h5 class="!mb-0">Vivamus sagittis lacus augue</h5>
|
||||
</div>
|
||||
<!--/.caption -->
|
||||
</div>
|
||||
<!--/.caption-wrapper -->
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide !rounded-[.4rem]">
|
||||
<img class="!rounded-[.4rem]" src="assets/img/photos/pp8.jpg" alt="image">
|
||||
<div class="caption-wrapper p-14">
|
||||
<div class="caption bg-[rgba(255,255,255)] opacity-100 !rounded-[.4rem] px-4 py-3 !mx-auto !mt-auto animate__animated animate__slideInDown animate__delay-1s">
|
||||
<h5 class="!mb-0">Vivamus sagittis lacus augue</h5>
|
||||
</div>
|
||||
<!--/.caption -->
|
||||
</div>
|
||||
<!--/.caption-wrapper -->
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide !rounded-[.4rem]">
|
||||
<img class="!rounded-[.4rem]" src="assets/img/photos/pp9.jpg" alt="image">
|
||||
<div class="caption-wrapper p-14">
|
||||
<div class="caption bg-[rgba(255,255,255)] opacity-100 !rounded-[.4rem] px-4 py-3 !mt-auto animate__animated animate__slideInDown animate__delay-1s">
|
||||
<h5 class="!mb-0">Vivamus sagittis lacus augue</h5>
|
||||
</div>
|
||||
<!--/.caption -->
|
||||
</div>
|
||||
<!--/.caption-wrapper -->
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
</div>
|
||||
<!--/.swiper-wrapper -->
|
||||
</div>
|
||||
<!-- /.swiper -->
|
||||
</div>
|
||||
<!-- /.swiper-container -->
|
||||
</div>
|
||||
<!-- /.post-slider -->
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="xl:w-10/12 xl:!ml-[8.33333333%] lg:w-10/12 lg:!ml-[8.33333333%] w-full flex-[0_0_auto] !px-[15px] max-w-full">
|
||||
<h2 class="!text-[calc(1.265rem_+_0.18vw)] font-bold xl:!text-[1.4rem] !leading-[1.35] !mb-4">About the Project</h2>
|
||||
<div class="flex flex-wrap mx-0">
|
||||
<div class="xl:w-9/12 lg:w-9/12 md:w-9/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<p>Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Integer posuere erat a ante venenatis. Etiam porta sem malesuada magna mollis euismod. Aenean lacinia bibendum.</p>
|
||||
<p>Donec id elit non mi porta gravida at eget metus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consectetur est at lobortis. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-2/12 lg:w-2/12 md:w-2/12 w-full flex-[0_0_auto] max-w-full !ml-auto">
|
||||
<ul class="pl-0 list-none">
|
||||
<li>
|
||||
<h5 class="!mb-1">Date</h5>
|
||||
<p>17 May 2018</p>
|
||||
</li>
|
||||
<li>
|
||||
<h5 class="!mb-1">Client Name</h5>
|
||||
<p>Cool House</p>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="#" class="more hover">See Project</a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</article>
|
||||
<!-- /.project -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /section -->
|
||||
<div class="wrapper !bg-[#ffffff]">
|
||||
<div class="container py-10">
|
||||
<div class="flex flex-wrap mx-[-15px] md:mx-[-15px] !mt-[-15px] xl:!mt-0 lg:!mt-0 md:!mt-0">
|
||||
<div class="xl:w-8/12 lg:w-8/12 md:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full self-center text-center xl:text-left lg:text-left md:text-left navigation">
|
||||
<a href="#" class="btn btn-soft-ash !rounded-[50rem] btn-icon btn-icon-start !mb-0 !mr-[.25rem] hover:translate-y-[-0.15rem]"><i class="uil uil-arrow-left before:content-['\e949']"></i> Prev Post</a>
|
||||
<a href="#" class="btn btn-soft-ash !rounded-[50rem] btn-icon btn-icon-end hover:translate-y-[-0.15rem] !mb-0">Next Post <i class="uil uil-arrow-right before:content-['\e94c']"></i></a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<aside class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full max-md:!mt-[15px] sidebar text-center xl:text-right lg:text-right md:text-right">
|
||||
<!--/.share-dropdown -->
|
||||
<div class="dropdown share-dropdown btn-group">
|
||||
<button class="btn btn-red !text-white !bg-[#e2626b] border-[#e2626b] hover:text-white hover:bg-[#e2626b] hover:!border-[#e2626b] active:text-white active:bg-[#e2626b] active:border-[#e2626b] disabled:text-white disabled:bg-[#e2626b] disabled:border-[#e2626b] !rounded-[50rem] btn-icon btn-icon-start dropdown-toggle !mb-0 !mr-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<i class="uil uil-share-alt !mr-[0.3rem] text-[0.8rem] before:content-['\ecb0']"></i> Share </button>
|
||||
<div class="dropdown-menu !shadow-[rgba(30,34,40,0.06)_0px_0px_25px_0px]" style="">
|
||||
<a class="dropdown-item text-[0.7rem] !p-[.25rem_1.15rem]" href="#"><i class="uil uil-twitter w-4 text-[0.8rem] pr-[0.4rem] align-[-.1rem] before:content-['\ed59']"></i>Twitter</a>
|
||||
<a class="dropdown-item text-[0.7rem] !p-[.25rem_1.15rem]" href="#"><i class="uil uil-facebook-f w-4 text-[0.8rem] pr-[0.4rem] align-[-.1rem] before:content-['\eae2']"></i>Facebook</a>
|
||||
<a class="dropdown-item text-[0.7rem] !p-[.25rem_1.15rem]" href="#"><i class="uil uil-linkedin w-4 text-[0.8rem] pr-[0.4rem] align-[-.1rem] before:content-['\ebd1']"></i>Linkedin</a>
|
||||
</div>
|
||||
<!--/.dropdown-menu -->
|
||||
</div>
|
||||
</aside>
|
||||
<!-- /column .sidebar -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/single-project2 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:55 GMT -->
|
||||
</html>
|
||||
@@ -0,0 +1,775 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/single-project3 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:55 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-soft-primary !bg-[#edf2fc]">
|
||||
<nav class="navbar navbar-expand-lg center-nav transparent position-absolute navbar-dark xl:pt-[.3rem] lg:pt-[.3rem]">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img class="logo-dark" src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
<img class="logo-light" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle hover:!text-[#ffffffb3]" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-white !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<section class="wrapper image-wrapper bg-image bg-overlay !text-white bg-no-repeat bg-[center_center] bg-cover relative z-0 !bg-fixed before:content-[''] before:block before:absolute before:z-[1] before:w-full before:h-full before:left-0 before:top-0 before:bg-[rgba(30,34,40,0.5)]" data-image-src="assets/img/photos/bg6.jpg">
|
||||
<div class="container pt-28 pb-14 xl:pt-36 lg:pt-36 md:pt-36 xl:pb-24 lg:pb-24 md:pb-24 !text-center">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="md:w-10/12 lg:w-8/12 xl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<div class="post-header">
|
||||
<div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-white relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#ffffff]">
|
||||
<a href="#" class="text-inherit hover:!text-white" rel="category">Identity</a>
|
||||
</div>
|
||||
<!-- /.post-category -->
|
||||
<h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3 !text-white">Commodo Dolor Bibendum Parturient Cursus Mollis</h1>
|
||||
<p class="lead !leading-[1.65] text-[.9rem] font-medium md:!px-14 lg:!px-14 xl:!px-20 xxl:!px-32">Integer posuere erat a ante venenatis dapibus posuere. Maecenas faucibus mollis interdum.</p>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<section class="wrapper !bg-[#ffffff] border-b-[rgba(164,174,198,0.2)] border-b border-solid">
|
||||
<div class="container pt-[4.5rem] xl:pt-24 lg:pt-24 md:pt-24 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="xl:w-10/12 xl:!ml-[8.33333333%] lg:w-10/12 lg:!ml-[8.33333333%] w-full flex-[0_0_auto] !px-[15px] max-w-full">
|
||||
<h2 class="!text-[calc(1.265rem_+_0.18vw)] font-bold xl:!text-[1.4rem] !leading-[1.35] !mb-4">About the Project</h2>
|
||||
<div class="flex flex-wrap mx-0">
|
||||
<div class="xl:w-9/12 lg:w-9/12 md:w-9/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<p>Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Integer posuere erat a ante venenatis. Etiam porta sem malesuada magna mollis euismod. Aenean lacinia bibendum.</p>
|
||||
<p>Donec id elit non mi porta gravida at eget metus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consectetur est at lobortis. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-2/12 lg:w-2/12 md:w-2/12 w-full flex-[0_0_auto] max-w-full !ml-auto">
|
||||
<ul class="pl-0 list-none">
|
||||
<li>
|
||||
<h5 class="!mb-1">Date</h5>
|
||||
<p>17 May 2018</p>
|
||||
</li>
|
||||
<li>
|
||||
<h5 class="!mb-1">Client Name</h5>
|
||||
<p>Cool House</p>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="#" class="more hover">See Project</a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
<div class="container-fluid xl:!px-6 lg:!px-6 md:!px-6">
|
||||
<div class="swiper-container blog grid-view !mb-[7rem] xl:!mb-[9rem] lg:!mb-[9rem] md:!mb-[9rem]" data-margin="30" data-nav="true" data-dots="true" data-items-xxl="3" data-items-md="2" data-items-xs="1">
|
||||
<div class="swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<div class="swiper-slide">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/pp10.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/pp11.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/pp12.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/pp13.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/pp14.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/pp15.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
<div class="swiper-slide">
|
||||
<figure class="rounded-[0.4rem]"><img class="rounded-[0.4rem]" src="assets/img/photos/pp16.jpg" alt="image"></figure>
|
||||
</div>
|
||||
<!--/.swiper-slide -->
|
||||
</div>
|
||||
<!--/.swiper-wrapper -->
|
||||
</div>
|
||||
<!-- /.swiper -->
|
||||
</div>
|
||||
<!-- /.swiper-container -->
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<div class="wrapper !bg-[#ffffff]">
|
||||
<div class="container py-10">
|
||||
<div class="flex flex-wrap mx-[-15px] md:mx-[-15px] !mt-[-15px] xl:!mt-0 lg:!mt-0 md:!mt-0">
|
||||
<div class="xl:w-8/12 lg:w-8/12 md:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full self-center text-center xl:text-left lg:text-left md:text-left navigation">
|
||||
<a href="#" class="btn btn-soft-ash !rounded-[50rem] btn-icon btn-icon-start !mb-0 !mr-[.25rem] hover:translate-y-[-0.15rem]"><i class="uil uil-arrow-left before:content-['\e949']"></i> Prev Post</a>
|
||||
<a href="#" class="btn btn-soft-ash !rounded-[50rem] btn-icon btn-icon-end hover:translate-y-[-0.15rem] !mb-0">Next Post <i class="uil uil-arrow-right before:content-['\e94c']"></i></a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<aside class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full max-md:!mt-[15px] sidebar text-center xl:text-right lg:text-right md:text-right">
|
||||
<!--/.share-dropdown -->
|
||||
<div class="dropdown share-dropdown btn-group">
|
||||
<button class="btn btn-red !text-white !bg-[#e2626b] border-[#e2626b] hover:text-white hover:bg-[#e2626b] hover:!border-[#e2626b] active:text-white active:bg-[#e2626b] active:border-[#e2626b] disabled:text-white disabled:bg-[#e2626b] disabled:border-[#e2626b] !rounded-[50rem] btn-icon btn-icon-start dropdown-toggle !mb-0 !mr-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<i class="uil uil-share-alt !mr-[0.3rem] text-[0.8rem] before:content-['\ecb0']"></i> Share </button>
|
||||
<div class="dropdown-menu !shadow-[rgba(30,34,40,0.06)_0px_0px_25px_0px]" style="">
|
||||
<a class="dropdown-item text-[0.7rem] !p-[.25rem_1.15rem]" href="#"><i class="uil uil-twitter w-4 text-[0.8rem] pr-[0.4rem] align-[-.1rem] before:content-['\ed59']"></i>Twitter</a>
|
||||
<a class="dropdown-item text-[0.7rem] !p-[.25rem_1.15rem]" href="#"><i class="uil uil-facebook-f w-4 text-[0.8rem] pr-[0.4rem] align-[-.1rem] before:content-['\eae2']"></i>Facebook</a>
|
||||
<a class="dropdown-item text-[0.7rem] !p-[.25rem_1.15rem]" href="#"><i class="uil uil-linkedin w-4 text-[0.8rem] pr-[0.4rem] align-[-.1rem] before:content-['\ebd1']"></i>Linkedin</a>
|
||||
</div>
|
||||
<!--/.dropdown-menu -->
|
||||
</div>
|
||||
</aside>
|
||||
<!-- /column .sidebar -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/single-project3 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:56 GMT -->
|
||||
</html>
|
||||
@@ -0,0 +1,785 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/single-project4 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:00:56 GMT -->
|
||||
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
|
||||
<meta name="keywords" content="Tailwind CSS, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
|
||||
<meta name="author" content="elemis">
|
||||
<title>Trunçgil - Modern & Multipurpose Tailwind CSS Template</title>
|
||||
<link rel="shortcut icon" href="assets/img/favicon.png">
|
||||
<link rel="stylesheet" type="text/css" href="assets/fonts/unicons/unicons.css">
|
||||
<link rel="stylesheet" href="assets/css/plugins.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="grow shrink-0">
|
||||
<header class="relative wrapper bg-soft-primary !bg-[rgba(246,247,249)]">
|
||||
<nav class="navbar navbar-expand-lg center-nav navbar-light navbar-bg-light">
|
||||
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
|
||||
<div class="navbar-brand w-full">
|
||||
<a href='index.html'>
|
||||
<img src="assets/img/truncgil-yatay.svg" alt="image">
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
|
||||
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
|
||||
|
||||
|
||||
</div>
|
||||
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content mega-menu-scroll">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-10px] lg:mx-[-10px] xl:!mt-[-10px] lg:!mt-[-10px] !pl-0 list-none">
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo1.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi1.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 1</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo2.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi2.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 2</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo3.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi3.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 3</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo4.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi4.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 4</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo5.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi5.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 5</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo6.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi6.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 6</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo7.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi7.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 7</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo8.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi8.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 8</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo9.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi9.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 9</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo10.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi10.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 10</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo11.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi11.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 11</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo12.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi12.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 12</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo13.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi13.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 13</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo14.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi14.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 14</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo15.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi15.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 15</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo16.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi16.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 16</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo17.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi17.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 17</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo18.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi18.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 18</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo19.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi19.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 19</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo20.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi20.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 20</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo21.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi21.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 21</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo22.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi22.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 22</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo23.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi23.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 23</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo24.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi24.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 24</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo25.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi25.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 25</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo26.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi26.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 26</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo27.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi27.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 27</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo28.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi28.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 28</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo29.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi29.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 29</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo30.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi30.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 30</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo31.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi31.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 31</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo32.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi32.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 32</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo33.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi33.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 33</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[10px] xl:!mt-[10px] lg:!px-[10px] lg:!mt-[10px]">
|
||||
<a class='dropdown-item' href='demo34.html'>
|
||||
<figure class="!rounded-[.4rem] lift hidden xl:block lg:block"><img class="!rounded-[.4rem]" src="assets/img/demos/mi34.jpg" alt="image"></figure>
|
||||
<span class="xl:!hidden lg:!hidden">Demo 34</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
<span class="hidden xl:!flex lg:!flex"><i class="uil uil-direction before:content-['\ea93']"></i><strong>Scroll to view more</strong></span>
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='services.html'>Services I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='services2.html'>Services II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='about.html'>About I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='about2.html'>About II</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop.html'>Shop I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop2.html'>Shop II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-product.html'>Product Page</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-cart.html'>Shopping Cart</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='shop-checkout.html'>Checkout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact.html'>Contact I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact2.html'>Contact II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='contact3.html'>Contact III</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='career.html'>Job Listing I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career2.html'>Job Listing II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='career-job.html'>Job Description</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='404.html'>404 Not Found</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='page-loader.html'>Page Loader</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin.html'>Sign In I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signin2.html'>Sign In II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup.html'>Sign Up I</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='signup2.html'>Sign Up II</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='terms.html'>Terms</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='pricing.html'>Pricing</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='onepage.html'>One Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
|
||||
<div class="dropdown-menu dropdown-lg">
|
||||
<div class="dropdown-lg-content">
|
||||
<div>
|
||||
<h6 class="dropdown-header">Project Pages</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='projects.html'>Projects I</a></li>
|
||||
<li><a class='dropdown-item' href='projects2.html'>Projects II</a></li>
|
||||
<li><a class='dropdown-item' href='projects3.html'>Projects III</a></li>
|
||||
<li><a class='dropdown-item' href='projects4.html'>Projects IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
<div>
|
||||
<h6 class="dropdown-header">Single Projects</h6>
|
||||
<ul class="pl-0 list-none">
|
||||
<li><a class='dropdown-item' href='single-project.html'>Single Project I</a></li>
|
||||
<li><a class='dropdown-item' href='single-project2.html'>Single Project II</a></li>
|
||||
<li><a class='dropdown-item' href='single-project3.html'>Single Project III</a></li>
|
||||
<li><a class='dropdown-item' href='single-project4.html'>Single Project IV</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.column -->
|
||||
</div>
|
||||
<!-- /auto-column -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog.html'>Blog without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog2.html'>Blog with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog3.html'>Blog with Left Sidebar</a></li>
|
||||
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post.html'>Post without Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post2.html'>Post with Sidebar</a></li>
|
||||
<li class="nav-item"><a class='dropdown-item' href='blog-post3.html'>Post with Left Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
|
||||
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
|
||||
<li class="mega-menu-content">
|
||||
<ul class="grid grid-cols-1 xl:grid-cols-6 lg:grid-cols-6 mx-0 xl:mx-[-15px] lg:mx-[-15px] xl:!mt-[-20px] lg:!mt-[-20px] !pl-0 list-none">
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/about.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block1.svg" alt="image"></div>
|
||||
<span>About</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/blog.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block2.svg" alt="image"></div>
|
||||
<span>Blog</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/call-to-action.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block3.svg" alt="image"></div>
|
||||
<span>Call to Action</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/clients.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block4.svg" alt="image"></div>
|
||||
<span>Clients</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/contact.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block5.svg" alt="image"></div>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/facts.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block6.svg" alt="image"></div>
|
||||
<span>Facts</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/faq.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block7.svg" alt="image"></div>
|
||||
<span>FAQ</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/features.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block8.svg" alt="image"></div>
|
||||
<span>Features</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/footer.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block9.svg" alt="image"></div>
|
||||
<span>Footer</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/hero.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block10.svg" alt="image"></div>
|
||||
<span>Hero</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/misc.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block17.svg" alt="image"></div>
|
||||
<span>Misc</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/navbar.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block11.svg" alt="image"></div>
|
||||
<span>Navbar</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/portfolio.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block12.svg" alt="image"></div>
|
||||
<span>Portfolio</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/pricing.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block13.svg" alt="image"></div>
|
||||
<span>Pricing</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/process.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block14.svg" alt="image"></div>
|
||||
<span>Process</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/team.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block15.svg" alt="image"></div>
|
||||
<span>Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="xl:!px-[15px] xl:!mt-[20px] lg:!px-[15px] lg:!mt-[20px]"><a class='dropdown-item' href='docs/blocks/testimonials.html'>
|
||||
<div class="rounded img-svg hidden xl:block lg:block p-4 xl:!mb-2 lg:!mb-2"><img class="rounded-none" src="assets/img/demos/block16.svg" alt="image"></div>
|
||||
<span>Testimonials</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
<li class="nav-item dropdown dropdown-mega">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
|
||||
<ul class="dropdown-menu mega-menu">
|
||||
<li class="mega-menu-content">
|
||||
<div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
|
||||
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<h6 class="dropdown-header">Usage</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 xl:pb-1 lg:pb-1">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/index.html'>Get Started</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/forms.html'>Forms</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/faq.html'>FAQ</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/changelog.html'>Changelog</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/credits.html'>Credits</a></li>
|
||||
</ul>
|
||||
<h6 class="dropdown-header xl:!mt-6 lg:!mt-6">Styleguide</h6>
|
||||
<ul class="pl-0 list-none xl:columns-2 lg:columns-2 ">
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/colors.html'>Colors</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/fonts.html'>Fonts</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
|
||||
<li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item' href='docs/styleguide/misc.html'>Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
|
||||
<h6 class="dropdown-header">Elements</h6>
|
||||
<ul class="pl-0 list-none xl:columns-3 lg:columns-3 ">
|
||||
<li><a class='dropdown-item' href='docs/elements/accordion.html'>Accordion</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/alerts.html'>Alerts</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/animations.html'>Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/avatars.html'>Avatars</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/background.html'>Background</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/badges.html'>Badges</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/buttons.html'>Buttons</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/card.html'>Card</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/carousel.html'>Carousel</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/dividers.html'>Dividers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/form-elements.html'>Form Elements</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-hover.html'>Image Hover</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/image-mask.html'>Image Mask</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/lightbox.html'>Lightbox</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/player.html'>Media Player</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/modal.html'>Modal</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/pagination.html'>Pagination</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/progressbar.html'>Progressbar</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shadows.html'>Shadows</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/shapes.html'>Shapes</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tables.html'>Tables</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tabs.html'>Tabs</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-animations.html'>Text Animations</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tiles.html'>Tiles</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
|
||||
<li><a class='dropdown-item' href='docs/elements/typography.html'>Typography</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</li>
|
||||
<!--/.mega-menu-content-->
|
||||
</ul>
|
||||
<!--/.dropdown-menu -->
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
<div class="offcanvas-footer xl:!hidden lg:!hidden">
|
||||
<div>
|
||||
<a href="mailto:first.last@email.com" class="link-inverse">info@truncgil.com</a>
|
||||
<br> 00 (123) 456 78 90 <br>
|
||||
<nav class="nav social social-white !mt-4">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.offcanvas-footer -->
|
||||
</div>
|
||||
<!-- /.offcanvas-body -->
|
||||
</div>
|
||||
<!-- /.navbar-collapse -->
|
||||
<div class="navbar-other w-full !flex !ml-auto">
|
||||
<ul class="navbar-nav !flex-row !items-center !ml-auto">
|
||||
<li class="nav-item dropdown language-select uppercase group">
|
||||
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
|
||||
<ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
|
||||
<li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item hidden xl:block lg:block md:block">
|
||||
<a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
|
||||
</li>
|
||||
<li class="nav-item xl:!hidden lg:!hidden">
|
||||
<button class="hamburger offcanvas-nav-btn"><span></span></button>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /.navbar-nav -->
|
||||
</div>
|
||||
<!-- /.navbar-other -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
</header>
|
||||
<!-- /header -->
|
||||
<div class="wrapper image-wrapper bg-image h-[30rem] max-lg:h-[25rem] bg-cover bg-[center_center] bg-no-repeat !bg-scroll relative z-0" data-image-src="assets/img/photos/pp23.jpg"></div>
|
||||
<section class="wrapper !bg-[#ffffff] border-b-[rgba(164,174,198,0.2)] border-b border-solid">
|
||||
<div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
|
||||
<div class="flex flex-wrap mx-[-15px]">
|
||||
<div class="xl:w-10/12 xl:!ml-[8.33333333%] lg:w-10/12 lg:!ml-[8.33333333%] w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<h1 class="!text-[calc(1.305rem_+_.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-4">Memphis Brand Design</h1>
|
||||
<div class="flex flex-wrap mx-0 !mb-[3.5rem]">
|
||||
<div class="xl:w-9/12 lg:w-9/12 md:w-9/12 w-full flex-[0_0_auto] max-w-full">
|
||||
<p>Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Integer posuere erat a ante venenatis. Etiam porta sem malesuada magna mollis euismod. Aenean lacinia bibendum.</p>
|
||||
<p>Donec id elit non mi porta gravida at eget metus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<div class="xl:w-2/12 lg:w-2/12 md:w-2/12 w-full flex-[0_0_auto] max-w-full !ml-auto">
|
||||
<ul class="pl-0 list-none">
|
||||
<li>
|
||||
<h5 class="!mb-1">Date</h5>
|
||||
<p>17 May 2018</p>
|
||||
</li>
|
||||
<li>
|
||||
<h5 class="!mb-1">Client Name</h5>
|
||||
<p>Cool House</p>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="#" class="more hover">See Project</a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] !mb-14">
|
||||
<div class="w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="overflow-hidden translate-y-0 group rounded cursor-dark">
|
||||
<a href="assets/img/photos/pp24%402x.jpg" data-glightbox data-gallery="project-4">
|
||||
<img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/pp24.jpg" alt="image">
|
||||
</a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="overflow-hidden translate-y-0 group rounded cursor-dark">
|
||||
<a href="assets/img/photos/pp25%402x.jpg" data-glightbox data-gallery="project-4">
|
||||
<img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/pp25.jpg" alt="image">
|
||||
</a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="overflow-hidden translate-y-0 group rounded cursor-dark">
|
||||
<a href="assets/img/photos/pp26%402x.jpg" data-glightbox data-gallery="project-4">
|
||||
<img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/pp26.jpg" alt="image">
|
||||
</a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] !mb-14">
|
||||
<div class="xl:w-10/12 lg:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
|
||||
<h2 class="!text-[calc(1.265rem_+_0.18vw)] font-bold xl:!text-[1.4rem] !leading-[1.35] !mb-4">About the Project</h2>
|
||||
<p>Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Integer posuere erat a ante venenatis. Etiam porta sem malesuada magna mollis euismod. Aenean lacinia bibendum.</p>
|
||||
<p class="!mb-0">Donec id elit non mi porta gravida at eget metus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consectetur est at lobortis. Vivamus sagittis lacus vel augue laoreet rutrum faucibus.</p>
|
||||
</div>
|
||||
<!--/column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px]">
|
||||
<div class="w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="overflow-hidden translate-y-0 group rounded cursor-dark">
|
||||
<a href="assets/img/photos/pp27%402x.jpg" data-glightbox data-gallery="project-4">
|
||||
<img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/pp27.jpg" alt="image">
|
||||
</a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="overflow-hidden translate-y-0 group rounded cursor-dark">
|
||||
<a href="assets/img/photos/pp28%402x.jpg" data-glightbox data-gallery="project-4">
|
||||
<img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/pp28.jpg" alt="image">
|
||||
</a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="overflow-hidden translate-y-0 group rounded cursor-dark">
|
||||
<a href="assets/img/photos/pp29%402x.jpg" data-glightbox data-gallery="project-4">
|
||||
<img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/pp29.jpg" alt="image">
|
||||
</a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="xl:w-8/12 lg:w-8/12 md:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
||||
<figure class="overflow-hidden translate-y-0 group rounded cursor-dark">
|
||||
<a href="assets/img/photos/pp30%402x.jpg" data-glightbox data-gallery="project-4">
|
||||
<img class=" transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="assets/img/photos/pp30.jpg" alt="image">
|
||||
</a>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</section>
|
||||
<!-- /section -->
|
||||
<div class="wrapper !bg-[#ffffff]">
|
||||
<div class="container py-10">
|
||||
<div class="flex flex-wrap mx-[-15px] md:mx-[-15px] !mt-[-15px] xl:!mt-0 lg:!mt-0 md:!mt-0">
|
||||
<div class="xl:w-8/12 lg:w-8/12 md:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full self-center text-center xl:text-left lg:text-left md:text-left navigation">
|
||||
<a href="#" class="btn btn-soft-ash !rounded-[50rem] btn-icon btn-icon-start !mb-0 !mr-[.25rem] hover:translate-y-[-0.15rem]"><i class="uil uil-arrow-left before:content-['\e949']"></i> Prev Post</a>
|
||||
<a href="#" class="btn btn-soft-ash !rounded-[50rem] btn-icon btn-icon-end hover:translate-y-[-0.15rem] !mb-0">Next Post <i class="uil uil-arrow-right before:content-['\e94c']"></i></a>
|
||||
</div>
|
||||
<!--/column -->
|
||||
<aside class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full max-md:!mt-[15px] sidebar text-center xl:text-right lg:text-right md:text-right">
|
||||
<!--/.share-dropdown -->
|
||||
<div class="dropdown share-dropdown btn-group">
|
||||
<button class="btn btn-red !text-white !bg-[#e2626b] border-[#e2626b] hover:text-white hover:bg-[#e2626b] hover:!border-[#e2626b] active:text-white active:bg-[#e2626b] active:border-[#e2626b] disabled:text-white disabled:bg-[#e2626b] disabled:border-[#e2626b] !rounded-[50rem] btn-icon btn-icon-start dropdown-toggle !mb-0 !mr-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<i class="uil uil-share-alt !mr-[0.3rem] text-[0.8rem] before:content-['\ecb0']"></i> Share </button>
|
||||
<div class="dropdown-menu !shadow-[rgba(30,34,40,0.06)_0px_0px_25px_0px]" style="">
|
||||
<a class="dropdown-item text-[0.7rem] !p-[.25rem_1.15rem]" href="#"><i class="uil uil-twitter w-4 text-[0.8rem] pr-[0.4rem] align-[-.1rem] before:content-['\ed59']"></i>Twitter</a>
|
||||
<a class="dropdown-item text-[0.7rem] !p-[.25rem_1.15rem]" href="#"><i class="uil uil-facebook-f w-4 text-[0.8rem] pr-[0.4rem] align-[-.1rem] before:content-['\eae2']"></i>Facebook</a>
|
||||
<a class="dropdown-item text-[0.7rem] !p-[.25rem_1.15rem]" href="#"><i class="uil uil-linkedin w-4 text-[0.8rem] pr-[0.4rem] align-[-.1rem] before:content-['\ebd1']"></i>Linkedin</a>
|
||||
</div>
|
||||
<!--/.dropdown-menu -->
|
||||
</div>
|
||||
</aside>
|
||||
<!-- /column .sidebar -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</div>
|
||||
<!-- /section -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
<footer class="!bg-[#21262c] shrink-0">
|
||||
<div class="container py-16 xl:!py-20 lg:!py-20 md:!py-20">
|
||||
<div class="flex flex-wrap mx-[-15px] !mt-[-30px] xl:!mt-0 lg:!mt-0">
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<img class="!mb-4" src="assets/img/truncgil-yatay-dark.svg" alt="image">
|
||||
<p class="!mb-4">© 2025 Trunçgil. <br class="hidden xl:block lg:block !text-[#cacaca]">All rights reserved.</p>
|
||||
<nav class="nav social social-white">
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-dribbble before:content-['\eaa2'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]"></i></a>
|
||||
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 motion-reduce:transition-none hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="#"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]"></i></a>
|
||||
</nav>
|
||||
<!-- /.social -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
|
||||
<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
|
||||
<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-4/12 xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Learn More</h4>
|
||||
<ul class="pl-0 list-none !mb-0">
|
||||
<li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
|
||||
<li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
<div class="md:w-full xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!mt-0 lg:!mt-0 !mt-[30px]">
|
||||
<div class="widget !text-[#cacaca]">
|
||||
<h4 class="widget-title !text-white !mb-3">Our Newsletter</h4>
|
||||
<p class="!mb-5">Subscribe to our newsletter to get our news & deals delivered to you.</p>
|
||||
<div class="newsletter-wrapper">
|
||||
<!-- Begin Mailchimp Signup Form -->
|
||||
<div id="mc_embed_signup2">
|
||||
<form action="https://elemisfreebies.us20.list-manage.com/subscribe/post?u=aa4947f70a475ce162057838d&id=b49ef47a9a" method="post" id="mc-embedded-subscribe-form2" name="mc-embedded-subscribe-form" class="validate dark-fields" target="_blank" novalidate>
|
||||
<div id="mc_embed_signup_scroll2">
|
||||
<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
|
||||
<input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)] " placeholder="" id="mce-EMAIL2">
|
||||
<label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
|
||||
<input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
|
||||
</div>
|
||||
<div id="mce-responses2" class="clear">
|
||||
<div class="response" id="mce-error-response2" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response2" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ddc180777a163e0f9f66ee014_4b1bcfa0bc" tabindex="-1" value=""></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
</div>
|
||||
<!-- /.newsletter-wrapper -->
|
||||
</div>
|
||||
<!-- /.widget -->
|
||||
</div>
|
||||
<!-- /column -->
|
||||
</div>
|
||||
<!--/.row -->
|
||||
</div>
|
||||
<!-- /.container -->
|
||||
</footer>
|
||||
<div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
|
||||
</svg>
|
||||
</div>
|
||||
<script src="assets/js/plugins.js"></script>
|
||||
<script src="assets/js/theme.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
<!-- Mirrored from Trunçgil-tailwind-template.netlify.app/single-project4 by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 18 Oct 2025 11:01:05 GMT -->
|
||||
</html>
|
||||
+31862
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user