first commit
This commit is contained in:
parent
99d54737de
commit
1932509066
@ -3,8 +3,8 @@ root = true
|
||||
[*]
|
||||
charset = utf-8
|
||||
end_of_line = lf
|
||||
indent_size = 4
|
||||
indent_style = space
|
||||
indent_size = 4
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
|
||||
@ -14,5 +14,8 @@ trim_trailing_whitespace = false
|
||||
[*.{yml,yaml}]
|
||||
indent_size = 2
|
||||
|
||||
[*.{js,json,ts,vue}]
|
||||
indent_size = 2
|
||||
|
||||
[docker-compose.yml]
|
||||
indent_size = 4
|
||||
|
||||
56
.gitattributes
vendored
56
.gitattributes
vendored
@ -1,24 +1,40 @@
|
||||
# Normaliza los saltos de línea en diferentes SO
|
||||
# Normaliza los saltos de línea para todos los sistemas operativos
|
||||
* text=auto eol=lf
|
||||
|
||||
# Reglas para archivos específicos
|
||||
# Reglas de diferencia por tipo de archivo
|
||||
*.blade.php diff=html
|
||||
*.css diff=css
|
||||
*.html diff=html
|
||||
*.md diff=markdown
|
||||
*.php diff=php
|
||||
*.css diff=css
|
||||
*.html diff=html
|
||||
*.js diff=javascript
|
||||
*.ts diff=typescript
|
||||
*.vue diff=html
|
||||
*.md diff=markdown
|
||||
*.php diff=php
|
||||
*.json diff=json
|
||||
*.yml diff=yaml
|
||||
*.yaml diff=yaml
|
||||
*.stub diff=php
|
||||
|
||||
# Evitar que estos archivos se exporten con Composer create-project
|
||||
/.github export-ignore
|
||||
/.gitignore export-ignore
|
||||
/.git export-ignore
|
||||
.gitattributes export-ignore
|
||||
.editorconfig export-ignore
|
||||
.prettierrc.json export-ignore
|
||||
.prettierignore export-ignore
|
||||
.eslintrc.json export-ignore
|
||||
CHANGELOG.md export-ignore
|
||||
CONTRIBUTING.md export-ignore
|
||||
README.md export-ignore
|
||||
composer.lock export-ignore
|
||||
package-lock.json export-ignore
|
||||
# Archivos que NO deben exportarse con Composer create-project
|
||||
/.github export-ignore
|
||||
/.gitignore export-ignore
|
||||
/.git export-ignore
|
||||
.gitattributes export-ignore
|
||||
.editorconfig export-ignore
|
||||
.prettierrc.json export-ignore
|
||||
.prettierignore export-ignore
|
||||
.eslintrc.json export-ignore
|
||||
CHANGELOG.md export-ignore
|
||||
CONTRIBUTING.md export-ignore
|
||||
README.md export-ignore
|
||||
phpunit.xml export-ignore
|
||||
phpunit.xml.dist export-ignore
|
||||
composer.lock export-ignore
|
||||
package-lock.json export-ignore
|
||||
vite.config.js export-ignore
|
||||
tailwind.config.js export-ignore
|
||||
webpack.mix.js export-ignore
|
||||
tests/ export-ignore
|
||||
resources/assets/ export-ignore
|
||||
resources/sass/ export-ignore
|
||||
node_modules export-ignore
|
||||
|
||||
25
.github/CODEOWNERS
vendored
Normal file
25
.github/CODEOWNERS
vendored
Normal file
@ -0,0 +1,25 @@
|
||||
# CODEOWNERS para koneko/laravel-vuexy-admin
|
||||
|
||||
# Asignar todos los archivos a Arturo Corro Pacheco (mantenedor principal)
|
||||
* @koneko-mx
|
||||
|
||||
# Archivos legales y de documentación
|
||||
/LICENSE* @koneko-mx
|
||||
/NOTICE.md @koneko-mx
|
||||
/README* @koneko-mx
|
||||
/CHANGELOG* @koneko-mx
|
||||
/.github/SECURITY.md @koneko-mx
|
||||
/.github/CODE_OF_CONDUCT.md @koneko-mx
|
||||
/.github/ISSUE_TEMPLATE/ @koneko-mx
|
||||
/.github/PULL_REQUEST_TEMPLATE.md @koneko-mx
|
||||
|
||||
# Código principal
|
||||
/src/ @koneko-mx
|
||||
/config/ @koneko-mx
|
||||
/resources/ @koneko-mx
|
||||
/routes/ @koneko-mx
|
||||
/tests/ @koneko-mx
|
||||
|
||||
# Archivos del paquete
|
||||
/composer.json @koneko-mx
|
||||
/package.json @koneko-mx
|
||||
24
.github/CODE_OF_CONDUCT.md
vendored
Normal file
24
.github/CODE_OF_CONDUCT.md
vendored
Normal file
@ -0,0 +1,24 @@
|
||||
# Código de Conducta de Contribuyentes
|
||||
|
||||
Como participantes y colaboradores de este proyecto, nos comprometemos a fomentar una comunidad abierta, inclusiva, y respetuosa.
|
||||
|
||||
## Comportamiento Esperado
|
||||
|
||||
- Usar un lenguaje amable e inclusivo.
|
||||
- Respetar diferentes puntos de vista y experiencias.
|
||||
- Aceptar con gracia las críticas constructivas.
|
||||
- Enfocarse en lo que es mejor para la comunidad.
|
||||
|
||||
## Comportamiento Inaceptable
|
||||
|
||||
- Uso de lenguaje ofensivo o insultante.
|
||||
- Conducta de acoso en público o privado.
|
||||
- Comentarios despectivos relacionados con género, raza, orientación, religión, discapacidad o condición médica.
|
||||
|
||||
## Aplicación
|
||||
|
||||
Las violaciones a este código pueden ser reportadas a: **arturo@koneko.mx**
|
||||
|
||||
Nos reservamos el derecho de advertir, suspender o expulsar a cualquier contribuyente que no respete este código.
|
||||
|
||||
Inspirado en el [Contributor Covenant](https://www.contributor-covenant.org/)
|
||||
10
.github/FUNDING.yml
vendored
Normal file
10
.github/FUNDING.yml
vendored
Normal file
@ -0,0 +1,10 @@
|
||||
---
|
||||
name: "FUNDING.yml"
|
||||
about: "Opciones de patrocinio del proyecto"
|
||||
title: "Patrocinio"
|
||||
labels: [funding]
|
||||
assignees: []
|
||||
|
||||
---
|
||||
|
||||
Opciones de patrocinio del proyecto
|
||||
30
.github/ISSUE_TEMPLATE/bug_report.md
vendored
Normal file
30
.github/ISSUE_TEMPLATE/bug_report.md
vendored
Normal file
@ -0,0 +1,30 @@
|
||||
---
|
||||
name: "🐛 Bug Report"
|
||||
about: Reporta un error, fallo o comportamiento inesperado.
|
||||
title: "[BUG] "
|
||||
labels: [bug]
|
||||
assignees: []
|
||||
|
||||
---
|
||||
|
||||
## Descripción
|
||||
Describe claramente el problema.
|
||||
|
||||
## Pasos para reproducir
|
||||
1. Ir a '...'
|
||||
2. Hacer clic en '...'
|
||||
3. Ver error '...'
|
||||
|
||||
## Comportamiento esperado
|
||||
Una descripción clara y concisa de lo que debería pasar.
|
||||
|
||||
## Capturas de pantalla
|
||||
(Si aplica, añade imágenes para ayudar a explicar tu problema.)
|
||||
|
||||
## Entorno
|
||||
- Versión de Laravel:
|
||||
- Versión del componente:
|
||||
- Navegador / Sistema operativo:
|
||||
|
||||
## Información adicional
|
||||
Agrega cualquier otro dato que consideres relevante.
|
||||
51
.github/ISSUE_TEMPLATE/feature_request.md
vendored
Normal file
51
.github/ISSUE_TEMPLATE/feature_request.md
vendored
Normal file
@ -0,0 +1,51 @@
|
||||
---
|
||||
name: "🧩 Feature Request"
|
||||
about: Proponer una nueva funcionalidad o mejora para el sistema
|
||||
title: "[Feature] "
|
||||
labels: ["feature", "enhancement"]
|
||||
assignees: []
|
||||
|
||||
---
|
||||
|
||||
## 📌 Descripción
|
||||
|
||||
Por favor, proporciona una descripción clara y concisa de la funcionalidad que deseas agregar.
|
||||
|
||||
---
|
||||
|
||||
## 🤔 Motivación
|
||||
|
||||
¿Cuál es el problema que esta nueva funcionalidad resolverá o qué mejora ofrecerá?
|
||||
|
||||
---
|
||||
|
||||
## 🧩 Solución Propuesta
|
||||
|
||||
Describe cómo debería funcionar la nueva característica. Si tienes una idea de la implementación técnica, inclúyela.
|
||||
|
||||
---
|
||||
|
||||
## 🛠️ Requisitos Técnicos (opcional)
|
||||
|
||||
- ¿Requiere cambios en base de datos?
|
||||
- ¿Afecta al rendimiento?
|
||||
- ¿Involucra cambios en la UI o API?
|
||||
- ¿Es compatible con la versión actual del sistema?
|
||||
|
||||
---
|
||||
|
||||
## 💡 Alternativas consideradas
|
||||
|
||||
Si evaluaste otras soluciones, por favor menciónalas y explica por qué las descartaste.
|
||||
|
||||
---
|
||||
|
||||
## 📎 Recursos adicionales
|
||||
|
||||
Agrega enlaces, capturas de pantalla o documentación que respalden tu solicitud.
|
||||
|
||||
---
|
||||
|
||||
## 👤 Autor(a)
|
||||
|
||||
- GitHub: @<tu-usuario>
|
||||
55
.github/PULL_REQUEST_TEMPLATE.md
vendored
Normal file
55
.github/PULL_REQUEST_TEMPLATE.md
vendored
Normal file
@ -0,0 +1,55 @@
|
||||
# 📝 Pull Request
|
||||
|
||||
Gracias por tu contribución a **Koneko Laravel Vuexy Admin**.
|
||||
|
||||
Por favor, completa la siguiente información para ayudarnos a revisar tu PR.
|
||||
|
||||
---
|
||||
|
||||
## 📋 Descripción
|
||||
|
||||
<!-- Explica brevemente qué problema resuelve este PR o qué funcionalidad agrega -->
|
||||
|
||||
---
|
||||
|
||||
## 🚀 Cambios realizados
|
||||
|
||||
- [ ] Bugfix 🐞
|
||||
- [ ] Nueva característica ✨
|
||||
- [ ] Mejora/refactorización 🔧
|
||||
- [ ] Documentación 📚
|
||||
- [ ] Tests 🧪
|
||||
- [ ] Otro (especificar):
|
||||
|
||||
---
|
||||
|
||||
## ✅ Checklist
|
||||
|
||||
- [ ] He probado los cambios localmente
|
||||
- [ ] He ejecutado las migraciones correctamente (si aplica)
|
||||
- [ ] No he incluido datos sensibles ni secretos
|
||||
- [ ] Los tests existentes no fallan
|
||||
- [ ] He actualizado documentación relevante (si aplica)
|
||||
- [ ] Incluye etiquetas útiles (`good first issue`, `bug`, `enhancement`, etc.)
|
||||
|
||||
---
|
||||
|
||||
## 📎 Referencias
|
||||
|
||||
<!-- Indica si este PR está relacionado a algún issue o tarea -->
|
||||
Closes #
|
||||
|
||||
---
|
||||
|
||||
## 🌍 Idioma base
|
||||
|
||||
- [ ] Español 🇲🇽
|
||||
- [ ] Inglés 🌐
|
||||
- [ ] Ambos
|
||||
|
||||
---
|
||||
|
||||
## 👤 Autor(a)
|
||||
|
||||
- GitHub: @<tu-usuario>
|
||||
- Nombre opcional:
|
||||
11
.github/SECURITY.md
vendored
Normal file
11
.github/SECURITY.md
vendored
Normal file
@ -0,0 +1,11 @@
|
||||
# Reporte de Vulnerabilidades de Seguridad
|
||||
|
||||
Agradecemos el interés por ayudarnos a mantener este proyecto seguro.
|
||||
|
||||
Si encuentras una vulnerabilidad de seguridad, por favor repórtala de manera responsable enviando un correo a:
|
||||
|
||||
**arturo@koneko.mx**
|
||||
|
||||
No abras un issue público hasta que hayamos tenido tiempo de analizar el reporte y preparar una solución.
|
||||
|
||||
Gracias por apoyar la seguridad del ecosistema Koneko ERP.
|
||||
68
.gitignore
vendored
68
.gitignore
vendored
@ -1,10 +1,60 @@
|
||||
/node_modules
|
||||
/vendor
|
||||
/.vscode
|
||||
/.nova
|
||||
/.fleet
|
||||
/.phpactor.json
|
||||
# ⚙️ Laravel Package Defaults
|
||||
/vendor/
|
||||
composer.lock
|
||||
|
||||
# 🧪 PHPUnit
|
||||
.phpunit.result.cache
|
||||
/.phpunit.cache
|
||||
/.phpunit.result.cache
|
||||
/.zed
|
||||
/.idea
|
||||
phpunit.xml
|
||||
phpunit.xml.dist
|
||||
|
||||
# 🧹 Cache y logs
|
||||
/.cache
|
||||
/storage/*.key
|
||||
/storage/pail
|
||||
*.log
|
||||
*.dump
|
||||
*.bak
|
||||
*.tmp
|
||||
*.swp
|
||||
|
||||
# 🔐 Entornos y configuraciones
|
||||
.env
|
||||
.env.*
|
||||
auth.json
|
||||
.phpactor.json
|
||||
.php-cs-fixer.cache
|
||||
phpstan.neon.local
|
||||
homestead.yaml
|
||||
Homestead.json
|
||||
|
||||
# 🧱 Compilación frontend (Vite, Mix, Webpack, Tailwind)
|
||||
/node_modules/
|
||||
node_modules
|
||||
public/build/
|
||||
public/hot/
|
||||
public/storage/
|
||||
.vite
|
||||
|
||||
# 🧪 Tests y mocks (solo si generas temporalmente)
|
||||
/coverage/
|
||||
*.test.*
|
||||
*.spec.*
|
||||
|
||||
# 🛠️ IDEs y herramientas de desarrollo
|
||||
/.idea/
|
||||
/.vscode/
|
||||
/.nova/
|
||||
/.zed/
|
||||
/.fleet/
|
||||
*.sublime-workspace
|
||||
*.sublime-project
|
||||
|
||||
# 📦 Archivos del sistema
|
||||
.DS_Store
|
||||
Thumbs.db
|
||||
|
||||
# 🚀 Entornos de staging / producción
|
||||
*.local.*
|
||||
*.production.*
|
||||
*.staging.*
|
||||
|
||||
60
CHANGELOG.md
60
CHANGELOG.md
@ -1,39 +1,43 @@
|
||||
# 📜 CHANGELOG - Laravel Vuexy Website Layout Porto
|
||||
# 📦 CHANGELOG
|
||||
|
||||
Este documento sigue el formato [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
|
||||
|
||||
## [0.1.0] - ALPHA - 2024-03-05
|
||||
|
||||
### ✨ Added (Agregado)
|
||||
- 🚀 Primera versión alpha de la librería.
|
||||
- 🔹 Implementación inicial de [funcionalidad clave 1].
|
||||
- 🔹 Integración con [dependencia o servicio principal].
|
||||
- 🔹 Soporte para [Laravel/Vuexy Admin, si aplica].
|
||||
|
||||
### 🛠 Changed (Modificado)
|
||||
- 🔄 Optimización de [código o estructura interna].
|
||||
|
||||
### 🐛 Fixed (Correcciones)
|
||||
- 🐞 Correcciones iniciales en [migraciones, modelos, servicios, etc.].
|
||||
Todos los cambios relevantes de este proyecto se documentan en este archivo.
|
||||
Este proyecto sigue [Semantic Versioning](https://semver.org/lang/es/).
|
||||
|
||||
---
|
||||
|
||||
## 📅 Próximos Cambios Planeados
|
||||
- 📊 **Mejoras en [feature futuro]**.
|
||||
- 🏪 **Compatibilidad con [Laravel 11, Vuexy, etc.]**.
|
||||
- 📍 **Integración con [API o funcionalidad esperada]**.
|
||||
## 🚧 En desarrollo (`dev-develop`)
|
||||
|
||||
Este layout se encuentra en fase activa de desarrollo. Aún no se ha publicado una versión beta ni estable.
|
||||
|
||||
**🆕 Añadido**
|
||||
|
||||
- Compatibilidad total con `laravel-vuexy-website-admin`
|
||||
- Integración con el sistema de contenidos dinámicos, menús y perfiles SEO
|
||||
- Soporte para más de 85 variantes visuales basadas en el template HTML de **Porto**
|
||||
- Estructura flexible de vistas por template (`views/templates/{template}`)
|
||||
- Componentes Blade reutilizables por template (`components/banner.blade.php`, etc.)
|
||||
- Publicación de assets con `vendor:publish`
|
||||
- Compatibilidad con SCSS y Vite para personalización de estilos
|
||||
- Integración con controlador dinámico vía `slug` para renderizado de contenidos
|
||||
- Registro automático en el sistema como layout visual del sitio
|
||||
- Soporte para `hreflang` y sitios multilenguaje
|
||||
- Soporte para `website_seo_profiles`, `website_menus`, `website_contents`
|
||||
|
||||
**📌 Notas**
|
||||
|
||||
- Esta versión **no es estable** y puede cambiar sin previo aviso.
|
||||
- Se recomienda su uso exclusivamente con la rama `dev-develop` de `vuexy-website-admin`.
|
||||
- El template Porto **no se incluye** y debe adquirirse legalmente para uso en producción.
|
||||
|
||||
---
|
||||
|
||||
**📌 Nota:** Esta es una versión **ALPHA**, aún en desarrollo.
|
||||
## 🛣️ Planeación futura
|
||||
|
||||
- `1.0.0-beta`: Versión beta funcional con estructura de navegación, compatibilidad completa y documentación.
|
||||
- `1.0.0`: Versión estable con fallback de vistas, mejoras SEO y validaciones automáticas de layout.
|
||||
|
||||
---
|
||||
|
||||
## 🔄 Sincronización de Cambios
|
||||
Este `CHANGELOG.md` se actualiza primero en nuestro repositorio principal en **[Tea - Koneko Git](https://git.koneko.mx/koneko/laravel-vuexy-website-layout-porto)** y luego se refleja en GitHub.
|
||||
Los cambios recientes pueden verse antes en **Tea** que en **GitHub** debido a la sincronización automática.
|
||||
|
||||
---
|
||||
|
||||
📅 Última actualización: **2024-03-05**.
|
||||
## 📁 Histórico
|
||||
|
||||
*Ninguna versión anterior registrada.*
|
||||
|
||||
@ -1,9 +1,77 @@
|
||||
## 🔐 Acceso al Repositorio Privado
|
||||
# 🤝 Guía para Contribuidores
|
||||
|
||||
Nuestro servidor Git en **Tea** tiene un registro cerrado. Para contribuir:
|
||||
¡Gracias por tu interés en colaborar con **Koneko ERP**!
|
||||
Este proyecto busca ofrecer una suite profesional de administración web y ERP orientado al mercado mexicano y LATAM, bajo licencia **Business Source License 1.1** con transición futura a MIT.
|
||||
|
||||
1. Abre un **Issue** en [GitHub](https://github.com/koneko-mx/laravel-vuexy-website-layout-porto/issues) indicando tu interés en contribuir.
|
||||
2. Alternativamente, envía un correo a **contacto@koneko.mx** solicitando acceso.
|
||||
3. Una vez aprobado, recibirás una invitación para registrarte y clonar el repositorio.
|
||||
---
|
||||
|
||||
Si solo necesitas acceso de lectura, puedes clonar la versión pública en **GitHub**.
|
||||
## 📌 Requisitos básicos
|
||||
|
||||
* Conocimiento de **PHP 8.2+** y **Laravel 11**
|
||||
* Respeto por las buenas prácticas, código limpio y trabajo en equipo
|
||||
* Preferentemente, experiencia en:
|
||||
|
||||
* Livewire
|
||||
* Spatie Permissions & Roles
|
||||
* Laravel Fortify y Sanctum
|
||||
* Desarrollo modular con Composer
|
||||
|
||||
---
|
||||
|
||||
## 🌱 Primeros pasos
|
||||
|
||||
1. **Forkea** este repositorio y clónalo localmente.
|
||||
|
||||
2. Instala las dependencias con Composer:
|
||||
|
||||
```bash
|
||||
composer install
|
||||
```
|
||||
|
||||
3. Copia el archivo `.env.example` a `.env` y ajusta tus credenciales locales:
|
||||
|
||||
```bash
|
||||
cp .env.example .env
|
||||
php artisan key:generate
|
||||
```
|
||||
|
||||
4. Ejecuta las migraciones y seeders (si aplica):
|
||||
|
||||
```bash
|
||||
php artisan migrate --seed
|
||||
```
|
||||
|
||||
5. Inicia el servidor:
|
||||
|
||||
```bash
|
||||
php artisan serve
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📀 Convenciones del Proyecto
|
||||
|
||||
Antes de contribuir, asegúrate de leer nuestras
|
||||
📁 [Convenciones de Componentes](CONVENTIONS.md),
|
||||
donde definimos estructura de carpetas, estilo de código y otras buenas prácticas clave para mantener la consistencia del ecosistema **Koneko ERP**.
|
||||
|
||||
---
|
||||
|
||||
## 📝 Código de Conducta
|
||||
|
||||
Consulta nuestro [Código de Conducta](CODE_OF_CONDUCT.md) para conocer las expectativas y reglas que garantizan un ambiente colaborativo, profesional y respetuoso.
|
||||
|
||||
---
|
||||
|
||||
## 🚀 ¡Listo para colaborar!
|
||||
|
||||
Una vez que tengas tu entorno configurado:
|
||||
|
||||
* Busca issues etiquetados como `good first issue` o `help wanted`
|
||||
* Lee el archivo [`CONTRIBUTING.md`](CONTRIBUTING.md) del módulo específico si estás trabajando en un subpaquete
|
||||
* No olvides seguir las convenciones de estilo PSR-12 y usar `php-cs-fixer` si lo tienes disponible
|
||||
|
||||
---
|
||||
|
||||
Gracias por ser parte de **Koneko ERP** 💙
|
||||
¡Esperamos tu contribución!
|
||||
|
||||
105
CONVENTIONS.md
Normal file
105
CONVENTIONS.md
Normal file
@ -0,0 +1,105 @@
|
||||
#  Convenciones de Estructura de Componentes
|
||||
|
||||
📅 *Última actualización:* 2025-04-03
|
||||
🔧 *Aplicable a todos los módulos Composer de Koneko ERP*
|
||||
|
||||
---
|
||||
|
||||
## 📁 Estructura General de un Componente
|
||||
|
||||
```plaintext
|
||||
component-root/
|
||||
├── config/ ← Configuraciones del módulo
|
||||
├── Database/
|
||||
│ ├── data/ ← Archivos JSON, CSV, XLSX
|
||||
│ ├── factories/ ← Factories para testing y seeders
|
||||
│ ├── migrations/ ← Migraciones del esquema del módulo
|
||||
│ └── Seeders/ ← Seeders base y de datos fake
|
||||
├── Enums/ ← Enums (PSR-4) usados por el módulo
|
||||
├── Events/ ← Eventos del módulo
|
||||
├── Http/
|
||||
│ ├── Controllers/ ← Controladores
|
||||
│ └── Middleware/ ← Middlewares específicos del módulo
|
||||
├── Livewire/ ← Componentes Livewire organizados por dominio
|
||||
├── Models/ ← Modelos Eloquent
|
||||
├── Notifications/ ← Notificaciones personalizadas
|
||||
├── Providers/ ← Service Providers del módulo
|
||||
├── Services/ ← Servicios (lógica de negocio)
|
||||
├── Support/
|
||||
│ ├── Base/ ← Clases base abstractas
|
||||
│ ├── Builders/ ← Configuradores de vistas tipo índice
|
||||
│ ├── Macros/ ← Macros de Str, Collection, etc.
|
||||
│ ├── Queries/ ← Query Builders avanzados
|
||||
│ ├── Registries/ ← Registro dinámico de configuración
|
||||
│ └── Validation/ ← Validaciones personalizadas
|
||||
├── Traits/
|
||||
│ ├── Audit/ ← Traits para auditoría y tracking
|
||||
│ ├── Metadata/ ← Traits para metadatos del modelo
|
||||
│ ├── Users/ ← Traits relacionados con usuarios
|
||||
│ └── Indexing/ ← Traits usados por configuradores de índices
|
||||
├── resources/
|
||||
│ ├── assets/ ← JS, SCSS, íconos o fuentes específicos
|
||||
│ ├── faker-images/ ← Imágenes utilizadas en datos de prueba
|
||||
│ ├── lang/ ← Archivos de traducción
|
||||
│ └── views/ ← Vistas Blade
|
||||
├── routes/
|
||||
│ └── admin.php ← Rutas internas del módulo
|
||||
├── storage/ ← Recursos adicionales (ej. fuentes)
|
||||
└── README.md ← Documentación del componente
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🧠 Convenciones Generales
|
||||
|
||||
- Todos los módulos deben seguir PSR-4.
|
||||
- Los archivos deben nombrarse en *PascalCase* excepto `config/*.php` y rutas.
|
||||
- Los `Seeder` deben ser agrupados por módulo si el componente los agrupa (ej. `vuexyAdmin`, `vuexyWarehouse`).
|
||||
- Los `Factory` deben ser compatibles con `SeederWithFakeImages`.
|
||||
|
||||
---
|
||||
|
||||
## 🖼️ Imágenes Faker
|
||||
|
||||
- Carpeta: `resources/faker-images/<dominio>`
|
||||
- Subcarpetas válidas: `users/`, `stores/`, `products/`, etc.
|
||||
- Las imágenes se usan exclusivamente para entornos de testing/demostración.
|
||||
- Nunca se publican al frontend ni se exponen directamente.
|
||||
|
||||
---
|
||||
|
||||
## 🧪 Factories
|
||||
|
||||
- Todas las `factories` deben estar en `Database/factories/`.
|
||||
- Si se extiende un modelo (`Koneko\VuexyAdmin\Models\User`), usar `new (User::class)` dinámico.
|
||||
- Compatible con `SeederOrchestrator` y `config/seeder.php`.
|
||||
|
||||
---
|
||||
|
||||
## 📊 Configuradores de Índice
|
||||
|
||||
- Los index deben implementar `BaseModelIndexConfig` o su extensión.
|
||||
- Pueden usar Traits como `HandlesFactory`, `HandlesIndexColumns`, `HandlesQueryBuilder`, etc.
|
||||
- Se recomienda usar `Support/Builders/` para los configuradores y `Support/Registries/` si son extendibles.
|
||||
|
||||
---
|
||||
|
||||
## 📚 Traducciones
|
||||
|
||||
- Usar `resources/lang/es/` con archivos separados por dominio (`auth.php`, `validation.php`, etc.).
|
||||
- `es_MX.json` puede usarse para traducciones inline.
|
||||
|
||||
---
|
||||
|
||||
## 📌 Tips
|
||||
|
||||
- Si un componente tiene `Service`, `Seeder`, `Factory` y `Livewire`, deben estar todos organizados en sus carpetas respectivas.
|
||||
- La estructura del componente debe ser lo suficientemente clara para no depender de documentación externa.
|
||||
|
||||
---
|
||||
|
||||
## 🤝 ¿Dudas o sugerencias?
|
||||
|
||||
Este documento está en constante mejora. Si tienes sugerencias o deseas proponer mejoras, por favor abre un [issue de tipo mejora](.github/ISSUE_TEMPLATE/feature_request.md) o contribuye con un Pull Request.
|
||||
|
||||
---
|
||||
73
LICENSE
73
LICENSE
@ -1,9 +1,74 @@
|
||||
Business Source License 1.1 (Koneko Custom Edition)
|
||||
|
||||
Licensor: Koneko Soluciones Tecnológicas
|
||||
Licensed Work: laravel-vuexy-admin
|
||||
License Effective Date: 2025-05-29
|
||||
Change Date: 2028-05-29 (3 years after the Effective Date)
|
||||
|
||||
---
|
||||
|
||||
## 1. Definitions
|
||||
|
||||
**"Licensor"** refers to Koneko Soluciones Tecnológicas, represented legally by Arturo Corro Pacheco (RFC: COPA810622V65).
|
||||
|
||||
**"Licensed Work"** refers to the source code of the repository `koneko/laravel-vuexy-admin` hosted at [https://github.com/koneko-mx](https://github.com/koneko-mx) and [https://git.koneko.mx](https://git.koneko.mx).
|
||||
|
||||
**"Change Date"** is the date on which this license automatically transitions to the MIT license.
|
||||
|
||||
**"Use"**, **"Commercial Use"**, and other terms are interpreted according to common software licensing practices.
|
||||
|
||||
---
|
||||
|
||||
## 2. Usage Permissions
|
||||
|
||||
This software is provided under the Business Source License 1.1 with the following additional conditions:
|
||||
|
||||
* **Personal, Educational, Community, and Internal Development Use**: ALLOWED without restrictions.
|
||||
* **Commercial Deployment**: ALLOWED ONLY under an active commercial license or a specific agreement with the Licensor.
|
||||
* **Profit-oriented Projects (clients, product sales, SaaS, services)**: REQUIRE a commercial license.
|
||||
* **Redistribution as part of a commercial product or automated service**: REQUIRES a commercial license.
|
||||
|
||||
---
|
||||
|
||||
## 3. Automatic Transition to MIT License
|
||||
|
||||
On the **Change Date**, this license automatically transitions to the standard MIT License:
|
||||
|
||||
```
|
||||
MIT License
|
||||
Copyright (c) 2025 Koneko Soluciones Tecnológicas
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy...
|
||||
```
|
||||
|
||||
Copyright (c) 2025 koneko
|
||||
---
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
||||
## 4. Contact and Commercial Licensing
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||
For commercial licenses, partnerships, contributions, or specific agreements:
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
**Official Email:** [opensource@koneko.mx](mailto:opensource@koneko.mx)
|
||||
**Website:** [https://koneko.mx](https://koneko.mx) / [https://erp.koneko.mx](https://erp.koneko.mx)
|
||||
|
||||
---
|
||||
|
||||
## 5. Important Disclaimers
|
||||
|
||||
* This project integrates the **Vuexy template**, which is a paid product. A **valid Themeforest license** is required to legally use it in production.
|
||||
* This project does NOT distribute the template, it only facilitates its integration.
|
||||
* The licensee is responsible for complying with the terms of use of said template and other third-party dependencies.
|
||||
|
||||
---
|
||||
|
||||
## 6. Disclaimer of Warranty
|
||||
|
||||
This software is provided "AS IS", without any warranty. The Licensor is not liable for any direct or indirect damages resulting from the use of this software.
|
||||
|
||||
---
|
||||
|
||||
## 7. Contributions
|
||||
|
||||
Contributions to this repository must follow the policies defined in `CONTRIBUTING.md`. By submitting code, you agree to license it under the same terms of this license.
|
||||
|
||||
---
|
||||
|
||||
Copyright (c) 2025 - Koneko Soluciones Tecnológicas
|
||||
|
||||
74
LICENSE.es.md
Normal file
74
LICENSE.es.md
Normal file
@ -0,0 +1,74 @@
|
||||
Licencia Business Source 1.1 (Edición Personalizada de Koneko)
|
||||
|
||||
Licenciante: Koneko Soluciones Tecnológicas
|
||||
Trabajo Licenciado: laravel-vuexy-admin
|
||||
Fecha de Entrada en Vigencia de la Licencia: 2025-05-29
|
||||
Fecha de Cambio: 2028-05-29 (3 años después de la fecha de vigencia)
|
||||
|
||||
---
|
||||
|
||||
## 1. Definiciones
|
||||
|
||||
**"Licenciante"** se refiere a Koneko Soluciones Tecnológicas, representada legalmente por Arturo Corro Pacheco (RFC: COPA810622V65).
|
||||
|
||||
**"Trabajo Licenciado"** se refiere al código fuente del repositorio `koneko/laravel-vuexy-admin` alojado en [https://github.com/koneko-mx](https://github.com/koneko-mx) y [https://git.koneko.mx](https://git.koneko.mx).
|
||||
|
||||
**"Fecha de Cambio"** es la fecha en la que esta licencia se convierte automáticamente en la licencia MIT.
|
||||
|
||||
**"Uso"**, **"Uso Comercial"** y otros términos se interpretan conforme a las prácticas comunes en licenciamiento de software.
|
||||
|
||||
---
|
||||
|
||||
## 2. Permisos de Uso
|
||||
|
||||
Este software se proporciona bajo la Licencia Business Source 1.1 con las siguientes condiciones adicionales:
|
||||
|
||||
* **Uso Personal, Educativo, Comunitario o de Desarrollo Interno**: PERMITIDO sin restricciones.
|
||||
* **Implementación Comercial**: PERMITIDO SOLO bajo una licencia comercial activa o un acuerdo específico con el Licenciante.
|
||||
* **Proyectos con Fines de Lucro (clientes, ventas de productos, SaaS, servicios)**: REQUIEREN una licencia comercial.
|
||||
* **Redistribución como parte de un producto comercial o servicio automatizado**: REQUIERE una licencia comercial.
|
||||
|
||||
---
|
||||
|
||||
## 3. Transición Automática a Licencia MIT
|
||||
|
||||
En la **Fecha de Cambio**, esta licencia se convierte automáticamente en la Licencia MIT estándar:
|
||||
|
||||
```
|
||||
Licencia MIT
|
||||
Copyright (c) 2025 Koneko Soluciones Tecnológicas
|
||||
Se concede permiso, sin cargo, a cualquier persona que obtenga una copia...
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 4. Contacto y Licenciamiento Comercial
|
||||
|
||||
Para licencias comerciales, asociaciones, contribuciones o acuerdos específicos:
|
||||
|
||||
**Correo Oficial:** [opensource@koneko.mx](mailto:opensource@koneko.mx)
|
||||
**Sitio Web:** [https://koneko.mx](https://koneko.mx) / [https://erp.koneko.mx](https://erp.koneko.mx)
|
||||
|
||||
---
|
||||
|
||||
## 5. Avisos Importantes
|
||||
|
||||
* Este proyecto integra el **template Vuexy**, que es un producto de pago. Se requiere una **licencia válida de Themeforest** para utilizarlo legalmente en producción.
|
||||
* Este proyecto NO distribuye dicho template, solo facilita su integración.
|
||||
* El licenciatario es responsable de cumplir con los términos de uso de dicho template y otras dependencias de terceros.
|
||||
|
||||
---
|
||||
|
||||
## 6. Renuncia de Garantía
|
||||
|
||||
Este software se proporciona "TAL CUAL", sin garantía de ningún tipo. El Licenciante no se hace responsable de ningún daño directo o indirecto derivado del uso de este software.
|
||||
|
||||
---
|
||||
|
||||
## 7. Contribuciones
|
||||
|
||||
Las contribuciones a este repositorio deben seguir las políticas definidas en `CONTRIBUTING.md`. Al enviar código, aceptas licenciarlo bajo los mismos términos de esta licencia.
|
||||
|
||||
---
|
||||
|
||||
Copyright (c) 2025 - Koneko Soluciones Tecnológicas
|
||||
@ -1,51 +0,0 @@
|
||||
<?php
|
||||
|
||||
namespace Koneko\VuexyWebsiteLayoutPorto\Providers;
|
||||
|
||||
use Illuminate\Support\ServiceProvider;
|
||||
use Livewire\Livewire;
|
||||
|
||||
class VuexyWebsiteLayoutPortoServiceProvider extends ServiceProvider
|
||||
{
|
||||
/**
|
||||
* Register any application services.
|
||||
*/
|
||||
public function register(): void
|
||||
{
|
||||
//
|
||||
}
|
||||
|
||||
/**
|
||||
* Bootstrap any application services.
|
||||
*/
|
||||
public function boot(): void
|
||||
{
|
||||
// Register the module's routes
|
||||
$this->loadRoutesFrom(__DIR__.'/../routes/admin.php');
|
||||
|
||||
|
||||
// Cargar vistas del paquete
|
||||
$this->loadViewsFrom(__DIR__.'/../resources/views', 'vuexy-website-layout-porto');
|
||||
|
||||
|
||||
// Registrar Livewire Components
|
||||
$components = [
|
||||
// Porto template
|
||||
'vuexy-website-layout-porto::template-index' => TemplateIndex::class,
|
||||
|
||||
// Banners
|
||||
'vuexy-website-layout-porto::banners-index' => BannersIndex::class,
|
||||
|
||||
// Widgets
|
||||
'vuexy-website-layout-porto::widgets-index' => WidgetsIndex::class,
|
||||
|
||||
// Custom CSS
|
||||
'vuexy-website-layout-porto::custom-css-index' => CustomCssIndex::class,
|
||||
];
|
||||
|
||||
foreach ($components as $alias => $component) {
|
||||
Livewire::component($alias, $component);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
139
README.en.md
Normal file
139
README.en.md
Normal file
@ -0,0 +1,139 @@
|
||||
# 🧩 Laravel Vuexy Website Layout: Porto
|
||||
|
||||
<p align="center">
|
||||
<a href="https://koneko.mx" target="_blank">
|
||||
<img src="https://git.koneko.mx/Koneko-ST/koneko-st/raw/branch/main/logo-images/horizontal-05.png" width="400" alt="Koneko Soluciones Tecnológicas Logo">
|
||||
</a>
|
||||
</p>
|
||||
|
||||
<p align="center">
|
||||
<a href="https://koneko.mx"><img src="https://img.shields.io/badge/Website-koneko.mx-blue" alt="Website"></a>
|
||||
<a href="https://github.com/koneko-mx/laravel-vuexy-website-layout-porto"><img src="https://img.shields.io/github/license/koneko-mx/laravel-vuexy-website-layout-porto" alt="License"></a>
|
||||
<a href="https://github.com/koneko-mx/laravel-vuexy-website-layout-porto/issues"><img src="https://img.shields.io/github/issues/koneko-mx/laravel-vuexy-website-layout-porto" alt="Issues"></a>
|
||||
</p>
|
||||
|
||||
---
|
||||
|
||||
## 📌 Description
|
||||
|
||||
**Laravel Vuexy Website Layout: Porto** is a professional, modular website layout designed to work with the [Vuexy Website Admin](https://github.com/koneko-mx/laravel-vuexy-website-admin) module within the Koneko ERP ecosystem.
|
||||
|
||||
Based on the well-known **Porto HTML Template**, this package offers support for over 85 unique visual variants, including corporate websites, blogs, portfolios, product landings, and more — all integrated with Laravel Blade components and dynamic content blocks.
|
||||
|
||||
---
|
||||
|
||||
### ⚠️ Legal
|
||||
|
||||
This repository **does not include premium template files**. For production, you must acquire a legal license of the template through the following link:
|
||||
|
||||
👉 [https://themeforest.net/item/porto-responsive-html5-template/4106987](https://themeforest.net/item/porto-responsive-html5-template/4106987)
|
||||
|
||||
---
|
||||
|
||||
## 🚀 Quick Installation
|
||||
|
||||
```bash
|
||||
composer require koneko/laravel-vuexy-website-layout-porto:dev-develop
|
||||
php artisan vendor:publish --tag=vuexy-website-layout-porto-assets
|
||||
```
|
||||
|
||||
This will publish the public assets under:
|
||||
|
||||
```
|
||||
/public/vendor/vuexy-layout-porto/
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📦 Features
|
||||
|
||||
* ⚡ Over 85 Porto-based templates ready to use
|
||||
* 🧹 Blade-based components for every template
|
||||
* 🎨 Template switching via Vuexy Website Admin UI
|
||||
* 🖼️ Banners, widgets and dynamic sections
|
||||
* 🧠 Fully compatible with Koneko CMS and multilingual content
|
||||
* 📁 SCSS-ready with Vite and Blade optimization
|
||||
* 🔌 Designed for performance and SEO
|
||||
|
||||
---
|
||||
|
||||
## 📁 Folder Structure Highlights
|
||||
|
||||
```
|
||||
resources/
|
||||
├── views/templates/
|
||||
│ ├── accounting-1/
|
||||
│ ├── digital-agency/
|
||||
│ ├── real-estate/
|
||||
│ ├── ...
|
||||
│ └── vuexy-website-layout-porto/
|
||||
│
|
||||
├── views/templates/{template}/components/
|
||||
├── public/
|
||||
│ └── vendor/vuexy-layout-porto/
|
||||
└── img/module-cover.png
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📎 Visual Templates Included
|
||||
|
||||
Some of the included variants:
|
||||
|
||||
* Architecture & Interior Design
|
||||
* Digital Agency (dark and light)
|
||||
* Finance & Accounting
|
||||
* Cleaning Services
|
||||
* Church, Barber, Restaurant, Coffee Shop
|
||||
* Construction & Renewable Energy
|
||||
* Education, Wedding, Portfolio, Resume
|
||||
* Product Landing, App Landing, SaaS
|
||||
* SEO-focused and Event-based layouts
|
||||
|
||||
See the full list in the `views/templates/` directory.
|
||||
|
||||
---
|
||||
|
||||
## ⚙️ Integration with Koneko Ecosystem
|
||||
|
||||
This layout automatically registers itself in the **Koneko Vuexy Admin** UI as a visual module. From the admin interface, you can:
|
||||
|
||||
* Select the Porto layout for your site
|
||||
* Configure specific banners and variants
|
||||
* Activate or deactivate blocks per page
|
||||
* Use multilingual variants with `hreflang` support
|
||||
|
||||
It is fully compatible with the `website_contents`, `website_seo_profiles`, and `website_menus` modules.
|
||||
|
||||
---
|
||||
|
||||
## 🛠️ Requirements
|
||||
|
||||
* PHP `^8.2`
|
||||
* Laravel `^11.31`
|
||||
* [koneko/laravel-vuexy-website-admin](https://github.com/koneko-mx/laravel-vuexy-website-admin)
|
||||
* Node + Vite for SCSS customization (optional but recommended)
|
||||
|
||||
---
|
||||
|
||||
## 📄 License
|
||||
|
||||
This package is licensed under the [custom Business Source License 1.1](LICENSE), transitioning to MIT after 3 years. For commercial usage, redistribution, or extended usage, please contact:
|
||||
|
||||
📧 [opensource@koneko.mx](mailto:opensource@koneko.mx)
|
||||
|
||||
---
|
||||
|
||||
## 📚 More Information
|
||||
|
||||
* [Vuexy Website Admin Module](https://github.com/koneko-mx/laravel-vuexy-website-admin)
|
||||
* [Vuexy Admin Core](https://github.com/koneko-mx/laravel-vuexy-admin)
|
||||
* [Documentation in Spanish](README.md)
|
||||
* [Koneko ST Official Website](https://koneko.mx)
|
||||
* [Contact Email](mailto:opensource@koneko.mx)
|
||||
|
||||
---
|
||||
|
||||
<p align="center">
|
||||
Made with ❤️ in Mexico by <a href="https://koneko.mx">Koneko Soluciones Tecnológicas</a>
|
||||
</p>
|
||||
164
README.md
164
README.md
@ -1,133 +1,139 @@
|
||||
# 🎨 Laravel Vuexy Website Layout Porto - Vuexy Website Admin
|
||||
# 🧩 Laravel Vuexy Website Layout: Porto
|
||||
|
||||
<p align="center">
|
||||
<a href="https://koneko.mx" target="_blank"> <img src="https://git.koneko.mx/Koneko-ST/koneko-st/raw/branch/main/logo-images/horizontal-05.png" width="400" alt="Koneko Soluciones Tecnológicas Logo"> </a>
|
||||
<a href="https://koneko.mx" target="_blank">
|
||||
<img src="https://git.koneko.mx/Koneko-ST/koneko-st/raw/branch/main/logo-images/horizontal-05.png" width="400" alt="Logo de Koneko Soluciones Tecnológicas">
|
||||
</a>
|
||||
</p>
|
||||
|
||||
<p align="center">
|
||||
<a href="https://koneko.mx"><img src="https://img.shields.io/badge/Website-koneko.mx-blue" alt="Sitio Web"></a>
|
||||
<a href="https://packagist.org/packages/koneko/laravel-vuexy-website-layout-porto"><img src="https://img.shields.io/packagist/v/koneko/laravel-vuexy-website-layout-porto" alt="Latest Stable Version"></a>
|
||||
<a href="https://packagist.org/packages/koneko/laravel-vuexy-website-layout-porto"><img src="https://img.shields.io/packagist/l/koneko/laravel-vuexy-website-layout-porto" alt="License"></a>
|
||||
<a href="https://git.koneko.mx/koneko"><img src="https://img.shields.io/badge/Git%20Server-Koneko%20Git-orange" alt="Servidor Git"></a>
|
||||
<a href="https://github.com/koneko-mx/laravel-vuexy-website-layout-porto/actions/workflows/tests.yml"><img src="https://github.com/koneko-mx/laravel-vuexy-website-layout-porto/actions/workflows/tests.yml/badge.svg" alt="Build Status"></a>
|
||||
<a href="https://github.com/koneko-mx/laravel-vuexy-website-layout-porto/issues"><img src="https://img.shields.io/github/issues/koneko/laravel-vuexy-website-layout-porto" alt="Issues"></a>
|
||||
<a href="https://koneko.mx"><img src="https://img.shields.io/badge/Sitio%20Web-koneko.mx-blue" alt="Sitio Web"></a>
|
||||
<a href="https://github.com/koneko-mx/laravel-vuexy-website-layout-porto"><img src="https://img.shields.io/github/license/koneko-mx/laravel-vuexy-website-layout-porto" alt="Licencia"></a>
|
||||
<a href="https://github.com/koneko-mx/laravel-vuexy-website-layout-porto/issues"><img src="https://img.shields.io/github/issues/koneko-mx/laravel-vuexy-website-layout-porto" alt="Issues"></a>
|
||||
</p>
|
||||
|
||||
---
|
||||
|
||||
## 📌 Descripción
|
||||
|
||||
**Laravel Vuexy Website Layout Porto** es un módulo diseñado para **Laravel Vuexy Website Admin**, proporcionando [breve descripción de la funcionalidad].
|
||||
**Laravel Vuexy Website Layout: Porto** es un layout profesional y modular para sitios web, diseñado para funcionar con el módulo [Vuexy Website Admin](https://github.com/koneko-mx/laravel-vuexy-website-admin) dentro del ecosistema ERP de Koneko.
|
||||
|
||||
### ✨ Características:
|
||||
- 🔹 Integración completa con Vuexy Website Admin.
|
||||
- 🔹 Funcionalidad clave 1.
|
||||
- 🔹 Funcionalidad clave 2.
|
||||
Basado en el reconocido **template HTML Porto**, este paquete incluye soporte para más de 85 variantes visuales listas para usar, incluyendo sitios corporativos, blogs, portafolios, landings de productos y mucho más. Todo ello integrado mediante componentes Blade y bloques de contenido dinámicos.
|
||||
|
||||
---
|
||||
|
||||
## 📦 Instalación
|
||||
### ⚠️ Legal
|
||||
|
||||
Instalar vía **Composer**:
|
||||
Este repositorio **no incluye archivos de plantillas premium**. Para producción debes adquirir una licencia legal del template a través del siguiente enlace:
|
||||
|
||||
👉 [https://themeforest.net/item/porto-responsive-html5-template/4106987](https://themeforest.net/item/porto-responsive-html5-template/4106987)
|
||||
|
||||
---
|
||||
|
||||
## 🚀 Instalación Rápida
|
||||
|
||||
```bash
|
||||
composer require koneko/laravel-vuexy-website-layout-porto
|
||||
composer require koneko/laravel-vuexy-website-layout-porto:dev-develop
|
||||
php artisan vendor:publish --tag=vuexy-website-layout-porto-assets
|
||||
```
|
||||
|
||||
Publicar archivos de configuración y migraciones (si aplica):
|
||||
Esto publicará los assets en:
|
||||
|
||||
```bash
|
||||
php artisan vendor:publish --tag=laravel-vuexy-website-layout-porto-config
|
||||
php artisan migrate
|
||||
```
|
||||
/public/vendor/vuexy-layout-porto/
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🚀 Uso básico
|
||||
## 📦 Características
|
||||
|
||||
```php
|
||||
use Koneko\NombreLibreria\Models\Model;
|
||||
* ⚡ Más de 85 plantillas Porto listas para usar
|
||||
* 🧹 Componentes Blade para cada plantilla
|
||||
* 🎨 Cambio de plantilla desde la UI de Vuexy Website Admin
|
||||
* 🖼️ Banners, widgets y secciones dinámicas
|
||||
* 🧠 Integrado con el CMS Koneko y contenido multilenguaje
|
||||
* 📁 Preparado para SCSS, Vite y optimización con Blade
|
||||
* 🔌 Diseñado para rendimiento y SEO
|
||||
|
||||
$model = Model::create([
|
||||
'campo1' => 'Valor',
|
||||
'campo2' => 'Otro valor',
|
||||
]);
|
||||
---
|
||||
|
||||
## 📁 Estructura de Carpetas Destacada
|
||||
|
||||
```
|
||||
resources/
|
||||
├── views/templates/
|
||||
│ ├── accounting-1/
|
||||
│ ├── digital-agency/
|
||||
│ ├── real-estate/
|
||||
│ ├── ...
|
||||
│ └── vuexy-website-layout-porto/
|
||||
│
|
||||
├── views/templates/{template}/components/
|
||||
├── public/
|
||||
│ └── vendor/vuexy-layout-porto/
|
||||
└── img/module-cover.png
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📚 Configuración adicional
|
||||
## 📎 Plantillas Visuales Incluidas
|
||||
|
||||
Si necesitas personalizar la configuración del módulo, publica el archivo de configuración:
|
||||
Algunas de las variantes disponibles:
|
||||
|
||||
```bash
|
||||
php artisan vendor:publish --tag=laravel-vuexy-website-layout-porto-config
|
||||
```
|
||||
* Arquitectura e Interiorismo
|
||||
* Agencia Digital (oscura y clara)
|
||||
* Finanzas y Contabilidad
|
||||
* Servicios de Limpieza
|
||||
* Iglesia, Barbería, Restaurante, Cafetería
|
||||
* Construcción y Energía Renovable
|
||||
* Educación, Boda, Portafolio, CV
|
||||
* Landing de Productos, Aplicaciones y SaaS
|
||||
* Diseños enfocados en SEO y eventos
|
||||
|
||||
Esto generará `config/nombre_libreria.php`, donde puedes modificar valores predeterminados.
|
||||
Consulta el listado completo en el directorio `views/templates/`.
|
||||
|
||||
---
|
||||
|
||||
## 🛠 Dependencias
|
||||
## ⚙️ Integración con el Ecosistema Koneko
|
||||
|
||||
Este paquete requiere las siguientes dependencias:
|
||||
- Laravel 11
|
||||
- `koneko/laravel-vuexy-website-layout-porto`
|
||||
- Dependencias específicas de la librería
|
||||
Este layout se registra automáticamente en la interfaz de **Koneko Vuexy Admin** como un módulo visual. Desde la interfaz administrativa puedes:
|
||||
|
||||
* Seleccionar Porto como plantilla para tu sitio
|
||||
* Configurar banners y variantes específicas
|
||||
* Activar o desactivar bloques por página
|
||||
* Usar variantes multilenguaje con soporte para `hreflang`
|
||||
|
||||
Es totalmente compatible con los módulos `website_contents`, `website_seo_profiles` y `website_menus`.
|
||||
|
||||
---
|
||||
|
||||
## 📦 Publicación de Assets y Configuraciones
|
||||
## 🛠️ Requisitos
|
||||
|
||||
Para publicar configuraciones y seeders:
|
||||
|
||||
```bash
|
||||
php artisan vendor:publish --tag=laravel-vuexy-website-layout-porto-config
|
||||
php artisan vendor:publish --tag=laravel-vuexy-website-layout-porto-seeders
|
||||
php artisan migrate --seed
|
||||
```
|
||||
|
||||
Para publicar imágenes del tema:
|
||||
|
||||
```bash
|
||||
php artisan vendor:publish --tag=laravel-vuexy-website-layout-porto-images
|
||||
```
|
||||
* PHP `^8.2`
|
||||
* Laravel `^11.31`
|
||||
* [koneko/laravel-vuexy-website-admin](https://github.com/koneko-mx/laravel-vuexy-website-admin)
|
||||
* Node + Vite para personalización con SCSS (opcional pero recomendado)
|
||||
|
||||
---
|
||||
|
||||
## 🛠 Pruebas
|
||||
## 📄 Licencia
|
||||
|
||||
Ejecuta los tests con:
|
||||
|
||||
```bash
|
||||
php artisan test
|
||||
```
|
||||
Este paquete se distribuye bajo la [Licencia Business Source 1.1 personalizada](LICENSE.es), con transición automática a MIT a los 3 años. Para uso comercial, redistribución o integraciones ampliadas, contacta a:
|
||||
|
||||
📧 [opensource@koneko.mx](mailto:opensource@koneko.mx)
|
||||
|
||||
---
|
||||
|
||||
## 🌍 Repositorio Principal y Sincronización
|
||||
## 📚 Más Información
|
||||
|
||||
Este repositorio es una **copia sincronizada** del repositorio principal alojado en **[Tea - Koneko Git](https://git.koneko.mx/koneko/laravel-vuexy-website-layout-porto)**.
|
||||
|
||||
### 🔄 Sincronización con GitHub
|
||||
- **Repositorio Principal:** [git.koneko.mx](https://git.koneko.mx/koneko/laravel-vuexy-website-layout-porto)
|
||||
- **Repositorio en GitHub:** [github.com/koneko/laravel-vuexy-website-layout-porto](https://github.com/koneko/laravel-vuexy-website-layout-porto)
|
||||
- **Los cambios pueden reflejarse primero en Tea antes de GitHub.**
|
||||
|
||||
### 🤝 Contribuciones
|
||||
Si deseas contribuir:
|
||||
1. Puedes abrir un **Issue** en [GitHub Issues](https://github.com/koneko/laravel-vuexy-website-layout-porto/issues).
|
||||
2. Para Pull Requests, **preferimos contribuciones en Tea**. Contacta a `admin@koneko.mx` para solicitar acceso.
|
||||
|
||||
⚠️ **Nota:** Algunos cambios pueden tardar en reflejarse en GitHub, ya que este repositorio se actualiza automáticamente desde Tea.
|
||||
|
||||
---
|
||||
|
||||
## 🏅 Licencia
|
||||
|
||||
Este paquete es de código abierto bajo la licencia [MIT](LICENSE).
|
||||
* [Módulo Website Admin](https://github.com/koneko-mx/laravel-vuexy-website-admin)
|
||||
* [Core Vuexy Admin](https://github.com/koneko-mx/laravel-vuexy-admin)
|
||||
* [Documentación en inglés](README.en.md)
|
||||
* [Sitio Oficial Koneko ST](https://koneko.mx)
|
||||
* [Correo de Contacto](mailto:opensource@koneko.mx)
|
||||
|
||||
---
|
||||
|
||||
<p align="center">
|
||||
Hecho con ❤️ por <a href="https://koneko.mx">Koneko Soluciones Tecnológicas</a>
|
||||
Hecho con ❤️ en México por <a href="https://koneko.mx">Koneko Soluciones Tecnológicas</a>
|
||||
</p>
|
||||
|
||||
30
SECURITY.md
Normal file
30
SECURITY.md
Normal file
@ -0,0 +1,30 @@
|
||||
# 🛡️ Política de Seguridad
|
||||
|
||||
Koneko Soluciones Tecnológicas se toma muy en serio la seguridad de este proyecto y de sus usuarios.
|
||||
|
||||
## 🔒 Reporte responsable de vulnerabilidades
|
||||
|
||||
Si encuentras alguna vulnerabilidad de seguridad, **no abras un issue público**. En lugar de ello, por favor repórtala de forma privada por cualquiera de los siguientes medios:
|
||||
|
||||
- 📧 Correo oficial: [opensource@koneko.mx](mailto:opensource@koneko.mx)
|
||||
|
||||
Por favor incluye los siguientes detalles:
|
||||
|
||||
- Descripción del problema
|
||||
- Versión afectada del paquete
|
||||
- Instrucciones claras para reproducir el fallo (si es posible)
|
||||
|
||||
Nos comprometemos a responder dentro de **5 días hábiles**.
|
||||
|
||||
## 🛡️ Alcance
|
||||
|
||||
Este procedimiento aplica únicamente al paquete:
|
||||
|
||||
- `koneko/laravel-vuexy-admin`
|
||||
Y a sus repositorios relacionados dentro del ecosistema oficial Koneko.
|
||||
|
||||
## ✅ Reconocimientos
|
||||
|
||||
Se podrá otorgar reconocimiento público (con tu permiso) en futuras notas de versión a quienes reporten vulnerabilidades de manera responsable.
|
||||
|
||||
Gracias por ayudar a hacer más seguro el ecosistema de Koneko ERP.
|
||||
@ -1,17 +1,20 @@
|
||||
{
|
||||
"name": "koneko/laravel-vuexy-website-layout-porto",
|
||||
"description": "Laravel Vuexy Website Layout Porto, template Porto para Laravel Vuexy Website Admin.",
|
||||
"keywords": ["laravel", "koneko", "framework", "vuexy", "website", "admin", "mexico"],
|
||||
"description": "Website layout based on the Porto HTML template, integrated with Vuexy Website Admin for Laravel. Ideal for corporate, blog, and landing pages.",
|
||||
"keywords": [
|
||||
"laravel", "porto", "template", "vuexy", "website-layout", "blog", "landing-page",
|
||||
"corporate-site", "sitio web", "koneko", "mexico"
|
||||
],
|
||||
"type": "library",
|
||||
"license": "MIT",
|
||||
"license": "BUSL-1.1-custom",
|
||||
"require": {
|
||||
"php": "^8.2",
|
||||
"koneko/laravel-vuexy-website-admin": "dev-main",
|
||||
"koneko/laravel-vuexy-website-admin": "dev-develop",
|
||||
"laravel/framework": "^11.31"
|
||||
},
|
||||
"autoload": {
|
||||
"psr-4": {
|
||||
"Koneko\\VuexyWebsiteLayoutPorto\\": "./"
|
||||
"Koneko\\VuexyWebsiteLayoutPorto\\": "src/"
|
||||
}
|
||||
},
|
||||
"extra": {
|
||||
@ -31,5 +34,6 @@
|
||||
"source": "https://github.com/koneko-mx/laravel-vuexy-website-layout-porto",
|
||||
"issues": "https://github.com/koneko-mx/laravel-vuexy-website-layout-porto/issues"
|
||||
},
|
||||
"minimum-stability": "dev",
|
||||
"prefer-stable": true
|
||||
}
|
||||
|
||||
42
config/vuexy_website_layout_porto_menu.php
Normal file
42
config/vuexy_website_layout_porto_menu.php
Normal file
@ -0,0 +1,42 @@
|
||||
<?php
|
||||
|
||||
declare(strict_types=1);
|
||||
|
||||
// Este archivo **NO se registra como config**, es usado por VuexyMenuRegistry
|
||||
|
||||
return [
|
||||
'Plantillas' => [
|
||||
'submenu' => [
|
||||
'Porto Template' => [
|
||||
'icon' => 'ti ti-template',
|
||||
'description' => 'Gestiona la plantilla Porto, sus widgets y elementos de diseño.',
|
||||
'route' => 'admin.website-layout-porto.settings.template.index',
|
||||
'can' => 'admin.website-layout-porto.settings.template.view',
|
||||
],
|
||||
],
|
||||
],
|
||||
'Porto Template' => [
|
||||
'_meta' => [
|
||||
'icon' => 'ti ti-template',
|
||||
'description' => 'Gestiona la plantilla Porto, sus widgets y elementos de diseño.',
|
||||
'after_to' => 'Web & SEO',
|
||||
],
|
||||
'submenu' => [
|
||||
'Banners' => [
|
||||
'icon' => 'ti ti-slideshow',
|
||||
'route' => 'admin.website-layout-porto.settings.banners.index',
|
||||
'can' => 'admin.website-layout-porto.settings.banners.view',
|
||||
],
|
||||
'Porto Widgets' => [
|
||||
'icon' => 'ti ti-fidget-spinner',
|
||||
'route' => 'admin.website-layout-porto.settings.widgets.index',
|
||||
'can' => 'admin.website-layout-porto.settings.widgets.view',
|
||||
],
|
||||
'CSS personalizado' => [
|
||||
'icon' => 'ti ti-file-type-css',
|
||||
'route' => 'admin.website-layout-porto.settings.custom-css.index',
|
||||
'can' => 'admin.website-layout-porto.settings.custom-css.view',
|
||||
],
|
||||
]
|
||||
],
|
||||
];
|
||||
178
database/data/rbac/permissions.json
Normal file
178
database/data/rbac/permissions.json
Normal file
@ -0,0 +1,178 @@
|
||||
{
|
||||
"module": "admin.website-layout-porto",
|
||||
"name": {
|
||||
"es": "Porto Template",
|
||||
"en": "Porto Template"
|
||||
},
|
||||
"_meta": {
|
||||
"description": {
|
||||
"es": "Gestiona la plantilla Porto, sus widgets y elementos de diseño.",
|
||||
"en": "Manage the Porto template, its widgets and design elements."
|
||||
},
|
||||
"icon": "ti ti-template"
|
||||
},
|
||||
"priority": 100,
|
||||
"after_to": "website-admin",
|
||||
"groups": {
|
||||
"website-layout-porto": {
|
||||
"name": {
|
||||
"es": "Porto Template",
|
||||
"en": "Porto Template"
|
||||
},
|
||||
"_meta": {
|
||||
"description": {
|
||||
"es": "Gestiona la plantilla Porto, sus widgets y elementos de diseño.",
|
||||
"en": "Manage the Porto template, its widgets and design elements."
|
||||
},
|
||||
"icon": "ti ti-template"
|
||||
},
|
||||
"priority": 100,
|
||||
"sub_groups": {
|
||||
"template": {
|
||||
"name": {
|
||||
"es": "Porto Template",
|
||||
"en": "Porto Template"
|
||||
},
|
||||
"_meta": {
|
||||
"description": {
|
||||
"es": "Configuración base de la plantilla.",
|
||||
"en": "Base configuration of the template."
|
||||
},
|
||||
"icon": "ti ti-template"
|
||||
},
|
||||
"priority": 100,
|
||||
"permissions": [
|
||||
{
|
||||
"action": "view",
|
||||
"label": {
|
||||
"es": "Ver configuración de plantilla",
|
||||
"en": "View template configuration"
|
||||
},
|
||||
"key": "website-layout-porto.settings.template.view"
|
||||
},
|
||||
{
|
||||
"action": "update",
|
||||
"label": {
|
||||
"es": "Actualizar configuración de plantilla",
|
||||
"en": "Update template configuration"
|
||||
},
|
||||
"key": "website-layout-porto.settings.template.update"
|
||||
}
|
||||
]
|
||||
},
|
||||
"banners": {
|
||||
"name": {
|
||||
"es": "Banners",
|
||||
"en": "Banners"
|
||||
},
|
||||
"_meta": {
|
||||
"description": {
|
||||
"es": "Gestión de banners visuales del sitio.",
|
||||
"en": "Management of site visual banners."
|
||||
},
|
||||
"icon": "ti ti-slideshow"
|
||||
},
|
||||
"priority": 200,
|
||||
"permissions": [
|
||||
{
|
||||
"action": "view",
|
||||
"label": {
|
||||
"es": "Ver banners",
|
||||
"en": "View banners"
|
||||
},
|
||||
"key": "website-layout-porto.settings.banners.view"
|
||||
},
|
||||
{
|
||||
"action": "create",
|
||||
"label": {
|
||||
"es": "Crear banner",
|
||||
"en": "Create banner"
|
||||
},
|
||||
"key": "website-layout-porto.settings.banners.create"
|
||||
},
|
||||
{
|
||||
"action": "update",
|
||||
"label": {
|
||||
"es": "Actualizar banner",
|
||||
"en": "Update banner"
|
||||
},
|
||||
"key": "website-layout-porto.settings.banners.update"
|
||||
},
|
||||
{
|
||||
"action": "delete",
|
||||
"label": {
|
||||
"es": "Eliminar banner",
|
||||
"en": "Delete banner"
|
||||
},
|
||||
"key": "website-layout-porto.settings.banners.delete"
|
||||
}
|
||||
]
|
||||
},
|
||||
"widgets": {
|
||||
"name": {
|
||||
"es": "Porto Widgets",
|
||||
"en": "Porto Widgets"
|
||||
},
|
||||
"_meta": {
|
||||
"description": {
|
||||
"es": "Gestión de widgets personalizados de Porto.",
|
||||
"en": "Management of Porto custom widgets."
|
||||
},
|
||||
"icon": "ti ti-fidget-spinner"
|
||||
},
|
||||
"priority": 300,
|
||||
"permissions": [
|
||||
{
|
||||
"action": "view",
|
||||
"label": {
|
||||
"es": "Ver widgets de Porto",
|
||||
"en": "View Porto widgets"
|
||||
},
|
||||
"key": "website-layout-porto.settings.widgets.view"
|
||||
},
|
||||
{
|
||||
"action": "update",
|
||||
"label": {
|
||||
"es": "Actualizar widget de Porto",
|
||||
"en": "Update Porto widget"
|
||||
},
|
||||
"key": "website-layout-porto.settings.widgets.update"
|
||||
}
|
||||
]
|
||||
},
|
||||
"custom-css": {
|
||||
"name": {
|
||||
"es": "CSS personalizado",
|
||||
"en": "Custom CSS"
|
||||
},
|
||||
"_meta": {
|
||||
"description": {
|
||||
"es": "Edita el CSS personalizado del sitio.",
|
||||
"en": "Edit the site's custom CSS."
|
||||
},
|
||||
"icon": "ti ti-file-type-css"
|
||||
},
|
||||
"priority": 400,
|
||||
"permissions": [
|
||||
{
|
||||
"action": "view",
|
||||
"label": {
|
||||
"es": "Ver CSS personalizado",
|
||||
"en": "View custom CSS"
|
||||
},
|
||||
"key": "website-layout-porto.settings.custom-css.view"
|
||||
},
|
||||
{
|
||||
"action": "update",
|
||||
"label": {
|
||||
"es": "Actualizar CSS personalizado",
|
||||
"en": "Update custom CSS"
|
||||
},
|
||||
"key": "website-layout-porto.settings.custom-css.update"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
38
database/data/rbac/roles.json
Normal file
38
database/data/rbac/roles.json
Normal file
@ -0,0 +1,38 @@
|
||||
{
|
||||
"SuperAdmin" : {
|
||||
"permissions" : [
|
||||
"website-layout-porto.website-layout-porto.settings.template.view",
|
||||
"website-layout-porto.website-layout-porto.settings.template.update",
|
||||
"website-layout-porto.website-layout-porto.settings.banners.view",
|
||||
"website-layout-porto.website-layout-porto.settings.banners.create",
|
||||
"website-layout-porto.website-layout-porto.settings.banners.update",
|
||||
"website-layout-porto.website-layout-porto.settings.banners.delete",
|
||||
"website-layout-porto.website-layout-porto.settings.widgets.view",
|
||||
"website-layout-porto.website-layout-porto.settings.widgets.update",
|
||||
"website-layout-porto.website-layout-porto.settings.custom-css.view",
|
||||
"website-layout-porto.website-layout-porto.settings.custom-css.update"
|
||||
]
|
||||
},
|
||||
"WebsiteAdmin" : {
|
||||
"permissions" : [
|
||||
"website-layout-porto.website-layout-porto.settings.template.view",
|
||||
"website-layout-porto.website-layout-porto.settings.template.update",
|
||||
"website-layout-porto.website-layout-porto.settings.banners.view",
|
||||
"website-layout-porto.website-layout-porto.settings.banners.create",
|
||||
"website-layout-porto.website-layout-porto.settings.banners.update",
|
||||
"website-layout-porto.website-layout-porto.settings.banners.delete",
|
||||
"website-layout-porto.website-layout-porto.settings.widgets.view",
|
||||
"website-layout-porto.website-layout-porto.settings.widgets.update",
|
||||
"website-layout-porto.website-layout-porto.settings.custom-css.view",
|
||||
"website-layout-porto.website-layout-porto.settings.custom-css.update"
|
||||
]
|
||||
},
|
||||
"Auditor" : {
|
||||
"permissions" : [
|
||||
"website-layout-porto.website-layout-porto.settings.template.view",
|
||||
"website-layout-porto.website-layout-porto.settings.banners.view",
|
||||
"website-layout-porto.website-layout-porto.settings.widgets.view",
|
||||
"website-layout-porto.website-layout-porto.settings.custom-css.view"
|
||||
]
|
||||
}
|
||||
}
|
||||
12
database/rbac copy/permissions.json
Normal file
12
database/rbac copy/permissions.json
Normal file
@ -0,0 +1,12 @@
|
||||
[
|
||||
"admin.website-layout-porto.settings.template.view",
|
||||
"admin.website-layout-porto.settings.template.update",
|
||||
"admin.website-layout-porto.settings.banners.view",
|
||||
"admin.website-layout-porto.settings.banners.create",
|
||||
"admin.website-layout-porto.settings.banners.update",
|
||||
"admin.website-layout-porto.settings.banners.delete",
|
||||
"admin.website-layout-porto.settings.widgets.view",
|
||||
"admin.website-layout-porto.settings.widgets.update",
|
||||
"admin.website-layout-porto.settings.custom-css.view",
|
||||
"admin.website-layout-porto.settings.custom-css.update"
|
||||
]
|
||||
38
database/rbac copy/roles.json
Normal file
38
database/rbac copy/roles.json
Normal file
@ -0,0 +1,38 @@
|
||||
{
|
||||
"SuperAdmin" : {
|
||||
"permissions" : [
|
||||
"admin.website-layout-porto.settings.template.view",
|
||||
"admin.website-layout-porto.settings.template.update",
|
||||
"admin.website-layout-porto.settings.banners.view",
|
||||
"admin.website-layout-porto.settings.banners.create",
|
||||
"admin.website-layout-porto.settings.banners.update",
|
||||
"admin.website-layout-porto.settings.banners.delete",
|
||||
"admin.website-layout-porto.settings.widgets.view",
|
||||
"admin.website-layout-porto.settings.widgets.update",
|
||||
"admin.website-layout-porto.settings.custom-css.view",
|
||||
"admin.website-layout-porto.settings.custom-css.update"
|
||||
]
|
||||
},
|
||||
"Admin" : {
|
||||
"permissions" : [
|
||||
"admin.website-layout-porto.settings.template.view",
|
||||
"admin.website-layout-porto.settings.template.update",
|
||||
"admin.website-layout-porto.settings.banners.view",
|
||||
"admin.website-layout-porto.settings.banners.create",
|
||||
"admin.website-layout-porto.settings.banners.update",
|
||||
"admin.website-layout-porto.settings.banners.delete",
|
||||
"admin.website-layout-porto.settings.widgets.view",
|
||||
"admin.website-layout-porto.settings.widgets.update",
|
||||
"admin.website-layout-porto.settings.custom-css.view",
|
||||
"admin.website-layout-porto.settings.custom-css.update"
|
||||
]
|
||||
},
|
||||
"Auditor" : {
|
||||
"permissions" : [
|
||||
"admin.website-layout-porto.settings.template.view",
|
||||
"admin.website-layout-porto.settings.banners.view",
|
||||
"admin.website-layout-porto.settings.widgets.view",
|
||||
"admin.website-layout-porto.settings.custom-css.view"
|
||||
]
|
||||
}
|
||||
}
|
||||
20
docs/porto/README.md
Normal file
20
docs/porto/README.md
Normal file
@ -0,0 +1,20 @@
|
||||
# Porto Corporate
|
||||
|
||||
Este template incluye:
|
||||
|
||||
- Diseño responsive
|
||||
- Sliders animados
|
||||
- Integración con CMS Koneko
|
||||
- Compatibilidad multisite
|
||||
- Bloques tipo Blade cacheables
|
||||
|
||||
## Layouts disponibles
|
||||
|
||||
- `master.blade.php` (con zonas `header`, `content`, `footer`)
|
||||
- `landing.blade.php` (zonas reducidas para campañas)
|
||||
|
||||
## Recomendaciones
|
||||
|
||||
- Instalar `website-admin`
|
||||
- Activar `hero-slider` como bloque por defecto
|
||||
- Usar bloque `footer` fijo para todas las páginas
|
||||
0
resources/assets/css/custom.css
Normal file
0
resources/assets/css/custom.css
Normal file
318
resources/assets/css/demos/demo-accounting-1.css
Normal file
318
resources/assets/css/demos/demo-accounting-1.css
Normal file
@ -0,0 +1,318 @@
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-family: "Lexend", sans-serif;
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
.custom-font-secondary {
|
||||
font-family: "Lexend", sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-font-tertiary {
|
||||
font-family: "Playfair Display", serif !important;
|
||||
}
|
||||
|
||||
p {
|
||||
line-height: 1.8;
|
||||
font-size: 16px;
|
||||
font-size: 1rem;
|
||||
letter-spacing: -0.015em;
|
||||
}
|
||||
|
||||
.badge {
|
||||
font-weight: 500;
|
||||
font-family: "Lexend", sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-graph-svg-color-primary {
|
||||
fill: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-graph-svg-color-secondary {
|
||||
fill: var(--secondary) !important;
|
||||
}
|
||||
|
||||
.btn {
|
||||
font-family: "Lexend", sans-serif !important;
|
||||
padding: 16px 35.2px;
|
||||
padding: 1rem 2.2rem;
|
||||
font-size: 14.4px;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.custom-text-color-1 {
|
||||
color: #df0b0b;
|
||||
}
|
||||
|
||||
.custom-text-color-2 {
|
||||
color: #e3993f;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li > a {
|
||||
font-family: "Lexend", sans-serif !important;
|
||||
font-size: 17px;
|
||||
font-weight: 500;
|
||||
letter-spacing: -0.6px;
|
||||
color: var(--dark);
|
||||
}
|
||||
#header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li > a:hover {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
#header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li > a.active {
|
||||
color: var(--dark-rgba-50) !important;
|
||||
}
|
||||
#header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li.dropdown:not(.dropdown-mega) .dropdown-menu {
|
||||
transition: all 300ms;
|
||||
opacity: 0;
|
||||
transform: translate3d(-5px, 0, 0) !important;
|
||||
border: 1px solid var(--grey-200);
|
||||
border-radius: var(--border-radius2x) !important;
|
||||
overflow: hidden;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
#header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li.dropdown:not(.dropdown-mega) .dropdown-menu li a {
|
||||
padding-top: 12px !important;
|
||||
padding-bottom: 12px !important;
|
||||
padding-right: 22px !important;
|
||||
padding-left: 22px !important;
|
||||
}
|
||||
#header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li:hover.dropdown:not(.dropdown-mega) .dropdown-menu {
|
||||
opacity: 1;
|
||||
transform: translate3d(-5px, -10px, 0) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Mask Image */
|
||||
.custom-mask-img {
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-repeat: no-repeat;
|
||||
-webkit-mask-size: 100%;
|
||||
mask-size: 100%;
|
||||
-webkit-mask-position: center;
|
||||
mask-position: center;
|
||||
}
|
||||
|
||||
.custom-mask-img-1 {
|
||||
-webkit-mask-image: url(../../img/demos/accounting-1/generic/mask-image-1.png);
|
||||
mask-image: url(../../img/demos/accounting-1/generic/mask-image-1.png);
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-repeat: no-repeat;
|
||||
-webkit-mask-size: 100%;
|
||||
mask-size: 100%;
|
||||
-webkit-mask-position: center;
|
||||
mask-position: center;
|
||||
}
|
||||
|
||||
.custom-mask-img-2 {
|
||||
-webkit-mask-image: url(../../img/demos/accounting-1/generic/mask-image-2.png);
|
||||
mask-image: url(../../img/demos/accounting-1/generic/mask-image-2.png);
|
||||
}
|
||||
|
||||
.custom-mask-img-3 {
|
||||
-webkit-mask-image: url(../../img/demos/accounting-1/generic/mask-image-3.png);
|
||||
mask-image: url(../../img/demos/accounting-1/generic/mask-image-3.png);
|
||||
}
|
||||
|
||||
.custom-mask-img-4 {
|
||||
-webkit-mask-image: url(../../img/demos/accounting-1/generic/mask-image-4.png);
|
||||
mask-image: url(../../img/demos/accounting-1/generic/mask-image-4.png);
|
||||
}
|
||||
|
||||
/* Cascading Wrapper */
|
||||
.custom-cascading-images-wrapper-1 {
|
||||
padding: 40% 0% 0 30%;
|
||||
}
|
||||
|
||||
/* Stamp */
|
||||
.custom-stamp-1 {
|
||||
width: 180px;
|
||||
height: 180px;
|
||||
left: -90px;
|
||||
top: 55%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.custom-stamp-1 svg {
|
||||
position: relative;
|
||||
left: 4px;
|
||||
top: 1px;
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
.custom-stamp-1:after {
|
||||
opacity: 0.2;
|
||||
position: absolute;
|
||||
content: "";
|
||||
width: 105px;
|
||||
height: 105px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
border: 1px solid #FFF;
|
||||
border-radius: 50%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
.custom-stamp-1 {
|
||||
top: 30%;
|
||||
transform: scale(0.5);
|
||||
}
|
||||
}
|
||||
|
||||
/* Custom Elements */
|
||||
.custom-el-1 {
|
||||
bottom: 13%;
|
||||
right: 7%;
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.custom-el-1 {
|
||||
right: 0;
|
||||
bottom: 8%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-el-1 {
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-el-1 p {
|
||||
font-size: clamp(35px, -1.6666666667px + 0.0763888889 * 100vw, 90px);
|
||||
letter-spacing: -5px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
margin: 0;
|
||||
line-height: 1;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-el-1 p {
|
||||
letter-spacing: -2px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-el-1 em {
|
||||
font-size: clamp(18px, 11.3333333333px + 0.0138888889 * 100vw, 28px);
|
||||
position: relative;
|
||||
bottom: 2px;
|
||||
display: inline-flex;
|
||||
letter-spacing: -2px;
|
||||
}
|
||||
|
||||
.custom-el-1 em mark {
|
||||
padding: 0 7px 5px !important;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-el-1 em {
|
||||
bottom: 5px;
|
||||
right: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-el-2 {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.custom-el-2 img {
|
||||
height: 150%;
|
||||
min-width: 1200px !important;
|
||||
min-height: 1200px !important;
|
||||
}
|
||||
|
||||
@media (max-width: 1400px) {
|
||||
.custom-el-2 img {
|
||||
min-height: 1500px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-el-3 {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
|
||||
.custom-el-3 img {
|
||||
height: 100%;
|
||||
min-width: 1200px !important;
|
||||
min-height: 1200px !important;
|
||||
}
|
||||
|
||||
.custom-el-4 svg {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.custom-el-5 {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.custom-el-5 img {
|
||||
height: 100%;
|
||||
min-width: 1000px !important;
|
||||
min-height: 1000px !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-el-6 {
|
||||
margin-bottom: -70px;
|
||||
margin-left: 7px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-el-7 {
|
||||
max-height: 32px;
|
||||
width: auto !important;
|
||||
max-width: 150px !important;
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
/* Custom Pos */
|
||||
.custom-pos-1 {
|
||||
right: -37%;
|
||||
top: -33%;
|
||||
}
|
||||
|
||||
.custom-pos-2 {
|
||||
left: -75%;
|
||||
top: -33%;
|
||||
}
|
||||
|
||||
.custom-pos-3 {
|
||||
margin-top: -80px;
|
||||
}
|
||||
|
||||
.custom-pos-4 {
|
||||
right: -40%;
|
||||
top: -57%;
|
||||
}
|
||||
|
||||
.custom-pos-5 {
|
||||
top: -85%;
|
||||
}
|
||||
|
||||
.custom-pos-6 {
|
||||
left: -75%;
|
||||
bottom: -10%;
|
||||
}
|
||||
|
||||
/* Gradient */
|
||||
.custom-bg-gradient-1 {
|
||||
background-image: linear-gradient(to right, var(--secondary-rgba-30) 30%, var(--dark) 200%) !important;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-bg-gradient-1 {
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
}
|
||||
299
resources/assets/css/demos/demo-app-landing.css
Normal file
299
resources/assets/css/demos/demo-app-landing.css
Normal file
@ -0,0 +1,299 @@
|
||||
html, body, .body {
|
||||
max-width: 100%;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.custom-font-size-1 {
|
||||
font-size: 50px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-font-size-1 {
|
||||
font-size: 70px;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-outline {
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-stroke-text-effect-1 {
|
||||
-webkit-text-fill-color: transparent;
|
||||
-webkit-text-stroke-width: 1px;
|
||||
-webkit-text-stroke-color: var(--default);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.custom-carousel-1 {
|
||||
position: relative;
|
||||
background: url(../../img/demos/app-landing/backgrounds/bg-smartphone.png);
|
||||
width: 344px;
|
||||
height: 636px;
|
||||
}
|
||||
|
||||
.custom-carousel-1 .owl-carousel {
|
||||
padding: 72px 0 0 3px;
|
||||
}
|
||||
|
||||
.custom-carousel-1 .owl-carousel .owl-nav button.owl-next:before {
|
||||
font-size: 32px !important;
|
||||
}
|
||||
|
||||
.custom-carousel-1 .owl-carousel .owl-nav button.owl-prev {
|
||||
left: -12px;
|
||||
}
|
||||
|
||||
.custom-carousel-1 .owl-carousel .owl-nav button.owl-prev:before {
|
||||
font-size: 32px !important;
|
||||
}
|
||||
|
||||
.custom-call-to-action {
|
||||
margin-left: 50px;
|
||||
margin-right: 50px;
|
||||
border-radius: 70px;
|
||||
}
|
||||
|
||||
.custom-feature-box-1 .feature-box-icon {
|
||||
width: 4.5em;
|
||||
height: 4.5em;
|
||||
}
|
||||
|
||||
.custom-feature-box-1 .feature-box-icon:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-img-1 {
|
||||
position: absolute;
|
||||
top: -35%;
|
||||
right: -25px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-svg-1 {
|
||||
position: absolute;
|
||||
right: -200%;
|
||||
top: -60%;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-svg-1 {
|
||||
right: -78%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-svg-1 {
|
||||
right: -45%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1440px) {
|
||||
.custom-svg-1 {
|
||||
right: -35%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1680px) {
|
||||
.custom-svg-1 {
|
||||
right: -21%;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-svg-2 {
|
||||
position: absolute;
|
||||
left: -120%;
|
||||
top: -207%;
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-svg-2 {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-svg-2 {
|
||||
left: -100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1440px) {
|
||||
.custom-svg-2 {
|
||||
left: -75%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1680px) {
|
||||
.custom-svg-2 {
|
||||
left: -55%;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-svg-3 {
|
||||
position: absolute;
|
||||
right: -120%;
|
||||
top: 12%;
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-svg-3 {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-svg-3 {
|
||||
right: -100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1440px) {
|
||||
.custom-svg-3 {
|
||||
right: -75%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1680px) {
|
||||
.custom-svg-3 {
|
||||
right: -55%;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-svg-4 {
|
||||
position: absolute;
|
||||
left: -120%;
|
||||
top: 0%;
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-svg-4 {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-svg-4 {
|
||||
left: -100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1440px) {
|
||||
.custom-svg-4 {
|
||||
left: -75%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1680px) {
|
||||
.custom-svg-4 {
|
||||
left: -55%;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-el {
|
||||
position: absolute;
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-el {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-el-circle {
|
||||
border: 2px solid var(--grey-500);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.custom-el-rounded-rectangle {
|
||||
border: 2px solid var(--grey-500);
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.custom-el-blur-1 {
|
||||
filter: blur(1px);
|
||||
}
|
||||
|
||||
.custom-el-blur-2 {
|
||||
filter: blur(2px);
|
||||
}
|
||||
|
||||
.custom-rotate-45 {
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-steps-icons {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-steps-icons .custom-steps-icon {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.custom-steps-icons .custom-steps-icon .animated-icon {
|
||||
border: 1px solid #d9d9d9;
|
||||
padding: 14px;
|
||||
border-radius: 50%;
|
||||
max-width: 105px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.custom-steps-icons .custom-steps-icon h4 {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
letter-spacing: -0.5px;
|
||||
display: inline-block;
|
||||
margin-top: 5px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-steps-icons .custom-steps-icon h4 {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-steps-icons .custom-steps-connect {
|
||||
position: relative;
|
||||
min-width: 115px;
|
||||
}
|
||||
|
||||
.custom-steps-icons .custom-steps-connect-dots {
|
||||
position: absolute;
|
||||
top: 15%;
|
||||
left: 5px;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-steps-icons .custom-steps-connect-dots {
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-steps-icons .custom-steps-connect-point {
|
||||
position: absolute;
|
||||
top: 15%;
|
||||
left: 98px;
|
||||
margin-top: 15px;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-steps-icons .custom-steps-connect-point {
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
639
resources/assets/css/demos/demo-architecture-2.css
Normal file
639
resources/assets/css/demos/demo-architecture-2.css
Normal file
@ -0,0 +1,639 @@
|
||||
body {
|
||||
font-family: 'Poppins', sans-serif;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6, .btn {
|
||||
font-family: 'Overpass', sans-serif;
|
||||
}
|
||||
|
||||
.custom-container-style {
|
||||
max-width: 90%;
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-container-style {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-container-style-2 {
|
||||
max-width: 78%;
|
||||
}
|
||||
|
||||
.custom-container-style-3 {
|
||||
min-width: 85vw;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.custom-container-style-3 {
|
||||
min-width: 540px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.custom-container-style-3 {
|
||||
min-width: 720px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-container-style-3 {
|
||||
min-width: 960px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-container-style-3 {
|
||||
min-width: 1140px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1440px) {
|
||||
.custom-container-style-3 {
|
||||
min-width: 1440px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-container-position-1 {
|
||||
position: relative;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.custom-bg-grey-1 {
|
||||
background: #747473 !important;
|
||||
}
|
||||
|
||||
.custom-margin-top {
|
||||
margin-top: 170px;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.custom-margin-top {
|
||||
margin-top: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-margin-top {
|
||||
margin-top: -80px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-page-wrapper {
|
||||
padding-left: 6.4vw;
|
||||
padding-right: 6.4vw;
|
||||
}
|
||||
|
||||
.custom-font-secondary {
|
||||
font-family: 'Overpass', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-font-tertiary {
|
||||
font-family: 'PT Serif', serif !important;
|
||||
}
|
||||
|
||||
.custom-btn-style-1 {
|
||||
position: relative;
|
||||
border-radius: 0;
|
||||
left: 5px;
|
||||
}
|
||||
|
||||
.custom-btn-style-1:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
right: -5px;
|
||||
bottom: -5px;
|
||||
left: -5px;
|
||||
border: 1px solid var(--grey-500);
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
.custom-btn-style-1:hover:before {
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.custom-btn-style-1.custom-btn-style-1-right {
|
||||
left: auto;
|
||||
right: 5px;
|
||||
}
|
||||
|
||||
.custom-box-shadow-1 {
|
||||
box-shadow: 0px 20px 30px -20px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.custom-stroke-text-effect-1 {
|
||||
-webkit-text-fill-color: var(--light);
|
||||
-webkit-text-stroke-width: 1px;
|
||||
-webkit-text-stroke-color: var(--grey-500);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.custom-big-font-size-1 {
|
||||
font-size: 147.2px;
|
||||
font-size: 9.2rem;
|
||||
}
|
||||
|
||||
.custom-big-font-size-2 {
|
||||
font-size: 187.2px;
|
||||
font-size: 11.7rem;
|
||||
}
|
||||
|
||||
.custom-big-font-size-3 {
|
||||
font-size: 115.2px;
|
||||
font-size: 7.2rem;
|
||||
}
|
||||
|
||||
.custom-img-thumbnail-style-1:before {
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
.custom-ls-1 {
|
||||
letter-spacing: 4px;
|
||||
}
|
||||
|
||||
.custom-link-effect-1 {
|
||||
position: relative;
|
||||
padding-bottom: 4px;
|
||||
}
|
||||
|
||||
.custom-link-effect-1:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 0;
|
||||
height: 1px;
|
||||
border-bottom: 2px solid var(--grey-500);
|
||||
transition: ease width 300ms;
|
||||
}
|
||||
|
||||
.custom-link-effect-1:hover:after, .custom-link-effect-1.active:after {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@keyframes customFadeFlipAnim {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(-20px) perspective(600px) rotateX(10deg);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0) perspective(600px) rotateX(0);
|
||||
}
|
||||
}
|
||||
|
||||
.customFadeFlipAnim {
|
||||
animation-name: customFadeFlipAnim;
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
html.sticky-header-active #header .header-body {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#header .header-nav-main nav > ul > li .dropdown-menu {
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav {
|
||||
flex: 0 auto;
|
||||
}
|
||||
#header .header-nav.header-nav-line nav > ul:not(:hover) li > a.active {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
#header .header-nav.header-nav-line nav > ul:not(:hover) li > a.active:before {
|
||||
background: #FFF !important;
|
||||
}
|
||||
#header .header-nav.header-nav-line nav > ul li:hover > a {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
#header .header-nav.header-nav-line nav > ul li:hover > a:before {
|
||||
background: #FFF !important;
|
||||
}
|
||||
#header .header-nav.header-nav-line.header-nav-bottom-line nav > ul > li > a:before,
|
||||
#header .header-nav.header-nav-line.header-nav-bottom-line nav > ul > li:hover > a:before {
|
||||
transform: none;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
font-family: 'Overpass', sans-serif;
|
||||
letter-spacing: 1px;
|
||||
text-transform: none;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li.dropdown .dropdown-menu li a {
|
||||
font-size: 14px;
|
||||
font-family: 'Overpass', sans-serif;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
#header .header-container {
|
||||
padding: 0 6.5vw;
|
||||
}
|
||||
#header.header-transparent .header-nav-main nav {
|
||||
padding: 0 6.4vw !important;
|
||||
}
|
||||
html.sticky-header-active #header.header-transparent .header-nav-main nav {
|
||||
padding: 0 6.4vw !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Header Search
|
||||
*/
|
||||
#header .header-nav-features .header-nav-features-search-reveal-big-search .form-control {
|
||||
border-bottom-color: var(--light) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Slider
|
||||
*/
|
||||
.custom-slider-background {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 6.4vw;
|
||||
right: 6.4vw;
|
||||
bottom: 0;
|
||||
transform: translate3d(0, 103px, 0);
|
||||
opacity: 0;
|
||||
transition: ease box-shadow 300ms;
|
||||
}
|
||||
|
||||
.custom-slider-background .custom-slider-background-image-stage-outer {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
position: relative;
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.custom-slider-background .custom-slider-background-image-stage-outer .custom-slider-background-image-stage {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.custom-slider-background .custom-slider-background-image-stage-outer .custom-slider-background-image-stage .custom-slider-background-image-item {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.custom-slider-background.show {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.custom-slider-background.show .custom-slider-background-image-stage-outer .custom-slider-background-image-stage {
|
||||
transition: ease transform 1s;
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-slider-background .custom-slider-background-image-stage-outer {
|
||||
width: 100%;
|
||||
}
|
||||
.custom-slider-background .custom-slider-background-image-stage-outer:nth-child(2) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#slider .owl-nav {
|
||||
transition: ease opacity 1s;
|
||||
}
|
||||
|
||||
#slider .owl-nav.hide {
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
#slider .owl-nav.show {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.has-sticky-header-transform .custom-slider-background {
|
||||
transform: translate3d(0, 136px, 0);
|
||||
}
|
||||
|
||||
.has-sticky-header-transform + #footer {
|
||||
margin-top: -33px !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Breadcrumb
|
||||
*/
|
||||
.custom-breadcrumb-style-1.breadcrumb > li + li:before {
|
||||
content: "\f054";
|
||||
font-size: 14.4px;
|
||||
font-size: 0.9rem;
|
||||
padding-right: 10px;
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Card
|
||||
*/
|
||||
.custom-card-style-1 {
|
||||
transition: ease background-color 300ms;
|
||||
}
|
||||
|
||||
.custom-card-style-1:hover {
|
||||
background-color: var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-card-style-1:hover p {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
/*
|
||||
* Owl Carousel
|
||||
*/
|
||||
@media (max-width: 767px) {
|
||||
.custom-dots-position .owl-dots {
|
||||
top: calc(50% + 275px) !important;
|
||||
transform: translate3d(0px, 0, 0px) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) and (max-width: 991px) {
|
||||
.custom-dots-position .owl-dots {
|
||||
top: calc(50% + 225px) !important;
|
||||
transform: translate3d(0px, 0, 0px) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots {
|
||||
margin-top: 20px !important;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot span {
|
||||
background: transparent;
|
||||
border: 1px solid var(--grey-500);
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot:hover span, .custom-dots-style-1 .owl-dots .owl-dot.active span {
|
||||
background: var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-dots-style-1.custom-dots-style-1-light .owl-dots .owl-dot span {
|
||||
border-color: var(--light);
|
||||
}
|
||||
|
||||
.custom-dots-style-1.custom-dots-style-1-light .owl-dots .owl-dot:hover span, .custom-dots-style-1.custom-dots-style-1-light .owl-dots .owl-dot.active span {
|
||||
background: #FFF !important;
|
||||
}
|
||||
|
||||
.custom-hide-prev-nav .owl-nav .owl-prev {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.custom-nav-grey.owl-carousel.nav-style-1 .owl-nav .owl-prev,
|
||||
.custom-nav-grey.owl-carousel.nav-style-1 .owl-nav .owl-next {
|
||||
color: #aaaaaa !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Section
|
||||
*/
|
||||
.custom-section {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.custom-section .custom-section-left-content,
|
||||
.custom-section .custom-section-right-content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.custom-section .custom-section-middle-content {
|
||||
width: 100%;
|
||||
margin: 0 -70px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.custom-section .custom-section-left-content,
|
||||
.custom-section .custom-section-right-content {
|
||||
display: block;
|
||||
width: 34vw;
|
||||
}
|
||||
.custom-section .custom-section-middle-content {
|
||||
width: 50vw;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-section .custom-section-left-content,
|
||||
.custom-section .custom-section-right-content {
|
||||
width: 34vw;
|
||||
}
|
||||
.custom-section .custom-section-middle-content {
|
||||
width: 40vw;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Heading Style
|
||||
*/
|
||||
.custom-heading-style-1 {
|
||||
position: relative;
|
||||
color: var(--light);
|
||||
}
|
||||
|
||||
.custom-heading-style-1 .custom-heading-style-1-step {
|
||||
position: absolute;
|
||||
font-size: 4.5em;
|
||||
font-weight: 900;
|
||||
font-family: 'Overpass', sans-serif;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
opacity: 0.1;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-heading-style-1 .custom-heading-style-1-text {
|
||||
position: relative;
|
||||
letter-spacing: 4.5px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/*
|
||||
* Testimonial
|
||||
*/
|
||||
.custom-testimonial-quote.testimonial.testimonial-with-quotes blockquote:before {
|
||||
content: '\f10d';
|
||||
font-family: "Font Awesome 6 Free";
|
||||
font-weight: 900;
|
||||
font-size: 22.4px;
|
||||
font-size: 1.4rem;
|
||||
color: var(--light);
|
||||
}
|
||||
|
||||
/*
|
||||
* Page Header
|
||||
*/
|
||||
.custom-page-header-1 {
|
||||
padding: 0 6.4vw !important;
|
||||
}
|
||||
|
||||
.custom-page-header-1 .custom-page-header-1-wrapper {
|
||||
transform: translate3d(0, 103px, 0);
|
||||
transition: ease box-shadow 300ms;
|
||||
}
|
||||
|
||||
/*
|
||||
* Load More
|
||||
*/
|
||||
.load-more-loader {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* Sort Navigation
|
||||
*/
|
||||
.custom-nav-filter > li > a {
|
||||
color: #212121 !important;
|
||||
background: transparent !important;
|
||||
border-radius: 0 !important;
|
||||
padding: 0 4px;
|
||||
font-weight: 600;
|
||||
font-size: 14.4px;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.custom-nav-filter > li.active > a {
|
||||
border-bottom: 1px solid var(--grey-500) !important;
|
||||
}
|
||||
|
||||
.custom-nav-filter > li + li {
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Contact Form
|
||||
*/
|
||||
.custom-form-style-1 .form-control {
|
||||
height: calc(1.8em + 1.85rem + 2px);
|
||||
padding: 15.6px 20px;
|
||||
padding: 0.975rem 1.25rem;
|
||||
background: var(--grey-100);
|
||||
border-color: var(--grey-100);
|
||||
line-height: 1.5 !important;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:focus {
|
||||
border-color: var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-webkit-input-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-moz-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:-ms-input-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select {
|
||||
color: #495057;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select option {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select option[selected] {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 textarea.form-control {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer p, #footer li, #footer span, #footer a:not(.btn):not(.no-footer-css) {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
#footer .footer-copyright p {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
.custom-btn-style-1:before {
|
||||
border-color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-btn-style-1.btn-light:before {
|
||||
border-color: rgba(255, 255, 255, 0.5) !important;
|
||||
}
|
||||
|
||||
.custom-stroke-text-effect-1 {
|
||||
-webkit-text-stroke-color: var(--primary);
|
||||
}
|
||||
|
||||
/*
|
||||
* Card
|
||||
*/
|
||||
.custom-card-style-1:hover {
|
||||
background-color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-card-style-1:hover h2, .custom-card-style-1:hover p {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
.custom-card-style-1:hover .animated-icon svg path, .custom-card-style-1:hover .animated-icon svg rect {
|
||||
fill: #FFF !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Owl Carousel
|
||||
*/
|
||||
.custom-dots-style-1 .owl-dots .owl-dot span {
|
||||
border-color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot:hover span, .custom-dots-style-1 .owl-dots .owl-dot.active span {
|
||||
background: var(--primary) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Sort Navigation
|
||||
*/
|
||||
.custom-nav-filter > li.active > a {
|
||||
color: var(--primary) !important;
|
||||
border-bottom-color: var(--primary) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Link Effect
|
||||
*/
|
||||
.custom-link-effect-1:after {
|
||||
border-bottom-color: var(--primary);
|
||||
}
|
||||
239
resources/assets/css/demos/demo-architecture-interior.css
Normal file
239
resources/assets/css/demos/demo-architecture-interior.css
Normal file
@ -0,0 +1,239 @@
|
||||
body {
|
||||
font-family: 'Poppins', sans-serif;
|
||||
}
|
||||
|
||||
.custom-font-primary {
|
||||
font-family: 'Poppins', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-font-secondary {
|
||||
font-family: 'Montserrat', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-negative-margin-top {
|
||||
margin-top: -150px;
|
||||
}
|
||||
|
||||
.custom-box-shadow-1 {
|
||||
box-shadow: 0px 0px 100px -27px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.custom-btn-pos-1 {
|
||||
transform: translate3d(0, 100%, 0);
|
||||
margin-top: -37px;
|
||||
}
|
||||
|
||||
.custom-text-size-1 {
|
||||
font-size: 6.4em;
|
||||
}
|
||||
|
||||
.custom-text-color-grey-1 {
|
||||
color: var(--default) !important;
|
||||
}
|
||||
|
||||
.custom-border-color-grey {
|
||||
border-color: #43474A !important;
|
||||
}
|
||||
|
||||
.custom-transition-1 rect {
|
||||
transition: ease all 3s !important;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) and (max-width: 1530px) {
|
||||
.custom-responsive-text-size-1 {
|
||||
font-size: 0.8rem !important;
|
||||
line-height: 1.5 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1440px) {
|
||||
.custom-responsive-m-p-x {
|
||||
margin-right: 3rem !important;
|
||||
margin-left: 3rem !important;
|
||||
padding-right: 3rem !important;
|
||||
padding-left: 3rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-plus {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-plus:before {
|
||||
content: '+';
|
||||
position: absolute;
|
||||
top: 30px;
|
||||
right: -23px;
|
||||
font-size: 0.4em;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.custom-square-1 {
|
||||
position: absolute;
|
||||
top: -10px;
|
||||
left: -10px;
|
||||
}
|
||||
|
||||
.custom-square-1 rect {
|
||||
fill-opacity: 0;
|
||||
stroke-dasharray: 1550;
|
||||
stroke-dashoffset: 1550;
|
||||
transition: ease all 2000ms;
|
||||
}
|
||||
|
||||
.custom-square-1 rect.appear-animation-visible {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
.custom-square-1.custom-square-top-right {
|
||||
right: -10px;
|
||||
left: auto;
|
||||
}
|
||||
|
||||
.custom-square-1.custom-square-1-no-pos {
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.custom-square-1.custom-square-1-no-pos rect.appear-animation-visible {
|
||||
fill-opacity: 1;
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-mobile-square-thickness rect {
|
||||
stroke-width: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.lineProgressFrom {
|
||||
stroke-dashoffset: 1550 !important;
|
||||
transition: ease stroke-dashoffset 8s !important;
|
||||
}
|
||||
|
||||
.lineProgressTo {
|
||||
stroke-dashoffset: 0 !important;
|
||||
}
|
||||
|
||||
.lineProgressAndFillFrom {
|
||||
stroke-dashoffset: 1550;
|
||||
fill-opacity: 0;
|
||||
transition: ease stroke-dashoffset 3s, ease fill-opacity 1s 2s !important;
|
||||
}
|
||||
|
||||
.lineProgressAndFillTo {
|
||||
stroke-dashoffset: 300;
|
||||
fill-opacity: 1;
|
||||
}
|
||||
|
||||
.custom-btn-color-1 {
|
||||
border-color: #43474A !important;
|
||||
}
|
||||
|
||||
.custom-btn-color-1:hover {
|
||||
border-color: var(--dark) !important;
|
||||
}
|
||||
|
||||
.custom-btn-style-1.btn-dark {
|
||||
background: #FFF !important;
|
||||
}
|
||||
|
||||
.custom-btn-style-1.btn-dark:hover {
|
||||
background: var(--dark) !important;
|
||||
}
|
||||
|
||||
.active-revslide .custom-square-1 rect {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
.custom-featured-boxes-style-1 .featured-box .box-content {
|
||||
padding: 60.8px 28.8px;
|
||||
padding: 3.8rem 1.8rem;
|
||||
border: 7px solid #43474A;
|
||||
transition: ease border-color 300ms;
|
||||
}
|
||||
|
||||
.custom-featured-boxes-style-1 .featured-box .box-content svg {
|
||||
width: 88px;
|
||||
height: auto;
|
||||
fill: #FFF;
|
||||
transition: ease fill 300ms;
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1.thumb-info-bottom-info-dark-linear .thumb-info-title {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1.thumb-info-bottom-info .thumb-info-title {
|
||||
padding: 36.8px;
|
||||
padding: 2.3rem;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-nav-size-1 .owl-nav .owl-prev, .owl-carousel.custom-nav-size-1 .owl-nav .owl-next {
|
||||
font-size: 22.4px;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
.card:hover .custom-square-1 rect {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
.card.custom-card-style-1 {
|
||||
background: transparent;
|
||||
border: 7px solid #43474A;
|
||||
}
|
||||
|
||||
.inner-page .main {
|
||||
padding-top: 100px;
|
||||
}
|
||||
|
||||
#header.side-header-hide [data-plugin-scrollable] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
.custom-square-1 rect {
|
||||
stroke: var(--primary);
|
||||
fill: var(--primary);
|
||||
}
|
||||
|
||||
.custom-featured-boxes-style-1 .featured-box:hover .box-content {
|
||||
border: 7px solid var(--primary);
|
||||
}
|
||||
|
||||
.custom-featured-boxes-style-1 .featured-box:hover .box-content svg {
|
||||
fill: var(--primary);
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1 .thumb-info-wrapper:after {
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
.custom-testimonial-colored-quotes.testimonial-with-quotes blockquote:before, .custom-testimonial-colored-quotes.testimonial-with-quotes blockquote:after {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
@keyframes customTextColored {
|
||||
from {
|
||||
color: var(--light);
|
||||
}
|
||||
to {
|
||||
color: var(--primary);
|
||||
}
|
||||
}
|
||||
|
||||
.customTextColored {
|
||||
animation-name: customTextColored;
|
||||
}
|
||||
|
||||
@keyframes customBorderColored {
|
||||
from {
|
||||
border-color: #43474A;
|
||||
}
|
||||
to {
|
||||
border-color: var(--primary);
|
||||
}
|
||||
}
|
||||
|
||||
.customBorderColored {
|
||||
animation-name: customBorderColored;
|
||||
}
|
||||
616
resources/assets/css/demos/demo-auto-services.css
Normal file
616
resources/assets/css/demos/demo-auto-services.css
Normal file
@ -0,0 +1,616 @@
|
||||
body {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.container:not(.container-bs):not(.container-xl-custom):not(.container-xxl-custom) {
|
||||
max-width: 1200px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-border-radius-1 {
|
||||
border-radius: 7px !important;
|
||||
}
|
||||
|
||||
.custom-text-underline-1 {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.7);
|
||||
}
|
||||
|
||||
.custom-btn-border-radius {
|
||||
border-radius: var(--border-radius2x);
|
||||
}
|
||||
|
||||
.custom-btn-arrow-effect-1 > svg {
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-btn-arrow-effect-1:hover > svg {
|
||||
transform: translate3d(8px, 0, 0);
|
||||
}
|
||||
|
||||
.custom-select-1.custom-select-1-arrow-position:before {
|
||||
right: 30px;
|
||||
}
|
||||
|
||||
.custom-svg-1 {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: -100px;
|
||||
width: 640px;
|
||||
}
|
||||
|
||||
.custom-svg-2 {
|
||||
position: absolute;
|
||||
top: 43%;
|
||||
left: -260px;
|
||||
width: 190px;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
|
||||
.custom-svg-3 {
|
||||
display: none;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.custom-svg-3 {
|
||||
display: block;
|
||||
bottom: -80px;
|
||||
width: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1440px) {
|
||||
.custom-svg-3 {
|
||||
bottom: -150px;
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-bg-color-grey-1 {
|
||||
background-color: #f4f4f4 !important;
|
||||
}
|
||||
|
||||
.custom-alert-bg-color-1 {
|
||||
background-color: var(--light) cd6 !important;
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-section-background {
|
||||
background-color: var(--light) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-section-background .container:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 85%;
|
||||
width: 100vw;
|
||||
height: calc( 100% + 150px);
|
||||
background: var(--light);
|
||||
z-index: 0;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-section-background .container:before {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1920px) {
|
||||
.custom-background-style-1 {
|
||||
background-size: cover;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-background-style-1 {
|
||||
background-image: none !important;
|
||||
background-color: var(--light);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 2050px), (max-width: 991px) {
|
||||
.custom-background-size-1 {
|
||||
background-size: cover !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 2050px) {
|
||||
.custom-background-size-1 {
|
||||
background-position: 14vw 50% !important;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-svg-background-1 {
|
||||
position: absolute;
|
||||
width: 1000%;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
height: 100.2%;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-svg-background-1 {
|
||||
left: 77%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-svg-background-1 {
|
||||
left: 82%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-remove-mobile-border-left {
|
||||
border-left: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-remove-mobile-xs-border-left {
|
||||
border-left: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-divider > hr {
|
||||
height: 4px !important;
|
||||
}
|
||||
|
||||
@keyframes customLineAnim {
|
||||
from {
|
||||
stroke-dasharray: 1600;
|
||||
stroke-dashoffset: 1600;
|
||||
}
|
||||
to {
|
||||
stroke-dasharray: 2500;
|
||||
stroke-dashoffset: 1600;
|
||||
}
|
||||
}
|
||||
|
||||
.customLineAnim {
|
||||
animation-name: customLineAnim;
|
||||
}
|
||||
|
||||
@keyframes customLineAnim2 {
|
||||
from {
|
||||
stroke-dasharray: 2650;
|
||||
stroke-dashoffset: 2650;
|
||||
}
|
||||
to {
|
||||
stroke-dasharray: 2650;
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.customLineAnim2 {
|
||||
animation-name: customLineAnim2;
|
||||
}
|
||||
|
||||
@keyframes customLineProgressAnim {
|
||||
from {
|
||||
width: 0;
|
||||
}
|
||||
to {
|
||||
width: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
.customLineProgressAnim {
|
||||
animation-name: customLineProgressAnim;
|
||||
}
|
||||
|
||||
/*
|
||||
* Social Icons
|
||||
*/
|
||||
.custom-social-icons-divider > li + li {
|
||||
position: relative;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.custom-social-icons-divider > li + li:before {
|
||||
content: '';
|
||||
border-left: 1px solid #dadcdd;
|
||||
height: 80%;
|
||||
position: absolute;
|
||||
left: -13px;
|
||||
top: 50%;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
#header .header-container {
|
||||
height: 110px;
|
||||
}
|
||||
|
||||
#header .header-nav-main nav > ul > li.dropdown .dropdown-menu {
|
||||
border-radius: 5px !important;
|
||||
}
|
||||
|
||||
#header .header-nav-features .header-nav-feature.px-4 .header-nav-features-dropdown.show {
|
||||
right: calc( 100% - 30px) !important;
|
||||
}
|
||||
|
||||
.custom-left-border-1 {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-left-border-1:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: -22px;
|
||||
height: 60%;
|
||||
border-left: 1px solid var(--grey-500);
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
|
||||
/*
|
||||
* Icon Style
|
||||
*/
|
||||
.custom-icon-style-1 {
|
||||
position: relative;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 95px;
|
||||
height: 95px;
|
||||
}
|
||||
|
||||
.custom-icon-style-1:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
border: 2px solid var(--grey-500);
|
||||
border-radius: 7px;
|
||||
transform: rotate(45deg);
|
||||
z-index: 0;
|
||||
transition: ease background 300ms;
|
||||
}
|
||||
|
||||
.custom-icon-style-1 svg {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-icon-box-style-1 h3 {
|
||||
transition: ease color 300ms;
|
||||
}
|
||||
|
||||
/*
|
||||
* Thumb Info
|
||||
*/
|
||||
.custom-thumb-info-style-1 .thumb-info-wrapper {
|
||||
border-radius: 25px !important;
|
||||
border: 5px solid transparent !important;
|
||||
transition: ease border 300ms;
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1 h3 {
|
||||
transition: ease color 300ms;
|
||||
}
|
||||
|
||||
.custom-img-thumbnail-style-1.img-thumbnail.img-thumbnail-hover-icon:before {
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Testimonial
|
||||
*/
|
||||
.custom-testimonial-style-1 blockquote {
|
||||
padding: 5px 20px !important;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1 blockquote p {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1.testimonial-with-quotes blockquote:before {
|
||||
content: "\f10d";
|
||||
font-family: "Font Awesome 6 Free";
|
||||
font-weight: 900;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-carousel-box-shadow-1 {
|
||||
position: relative;
|
||||
}
|
||||
.custom-carousel-box-shadow-1:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 65%;
|
||||
height: 0px;
|
||||
box-shadow: 0 0 40px 120px rgba(0, 0, 0, 0.07);
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
z-index: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Accordion
|
||||
*/
|
||||
.custom-accordion-style-1 > .card {
|
||||
border: 1px solid transparent !important;
|
||||
transition: ease border-color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a {
|
||||
position: relative;
|
||||
padding: 23px 30px;
|
||||
background-color: #f4f4f4;
|
||||
transition: ease background-color 300ms, ease color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a:after {
|
||||
content: '+';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 25px;
|
||||
font-size: inherit;
|
||||
font-weight: inherit;
|
||||
transform: translate3d(0, -50%, 0) rotate(45deg);
|
||||
transform-origin: 50% 50%;
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a.collapsed:after {
|
||||
transform: translate3d(0, -50%, 0) rotate(0deg);
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header + .collapse.show,
|
||||
.custom-accordion-style-1 > .card .card-header + .collapsing {
|
||||
border: 1px solid var(--grey-500);
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card + .card {
|
||||
margin-top: 17px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Services Detail
|
||||
*/
|
||||
.custom-nav-list-effect-1 > li > a {
|
||||
position: relative;
|
||||
transition: ease padding 300ms, ease color 300ms;
|
||||
}
|
||||
|
||||
.custom-nav-list-effect-1 > li > a:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: 4px solid var(--grey-500);
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
transition: ease opacity 300ms, ease width 300ms;
|
||||
}
|
||||
|
||||
.custom-nav-list-effect-1 > li.active > a, .custom-nav-list-effect-1 > li.open > a, .custom-nav-list-effect-1 > li:hover > a {
|
||||
padding-left: 45px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.custom-nav-list-effect-1 > li.active > a:before, .custom-nav-list-effect-1 > li.open > a:before, .custom-nav-list-effect-1 > li:hover > a:before {
|
||||
width: 30px;
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.custom-feature-box-justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.custom-feature-box-justify-center .feature-box-icon,
|
||||
.custom-feature-box-justify-center .feature-box-info {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
/*
|
||||
* Contact
|
||||
*/
|
||||
.custom-form-style-1 .form-control {
|
||||
border: 0;
|
||||
background: #f4f4f4;
|
||||
border-radius: 35px;
|
||||
height: auto;
|
||||
padding: 20px 25px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Datepicker
|
||||
*/
|
||||
.datepicker {
|
||||
padding: 10px;
|
||||
margin: 0 auto;
|
||||
line-height: 1.1em;
|
||||
}
|
||||
|
||||
.datepicker.datepicker-inline {
|
||||
line-height: 1.7em;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.datepicker table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.datepicker table tr td {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.datepicker table thead tr th {
|
||||
cursor: pointer;
|
||||
font-size: 12.8px;
|
||||
font-size: 0.8rem;
|
||||
text-align: center;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.datepicker table thead tr th.prev {
|
||||
content: '\f0d9';
|
||||
font-family: 'Font Awesome 6 Free';
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.datepicker table thead tr th.next {
|
||||
content: '\f0da';
|
||||
font-family: 'Font Awesome 6 Free';
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.datepicker table thead tr th:hover {
|
||||
color: var(--light);
|
||||
}
|
||||
|
||||
.datepicker table thead tr:last-child th {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.datepicker table thead tr:last-child th:hover {
|
||||
color: var(--grey-500);
|
||||
}
|
||||
|
||||
.datepicker table td {
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.datepicker table td.day {
|
||||
transition: background-color .1s ease-in .1s, color .1s ease-in .1s;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer {
|
||||
background: #333333;
|
||||
}
|
||||
|
||||
#footer a:not(.btn):not(.no-footer-css), #footer li, #footer span, #footer p {
|
||||
color: #888888;
|
||||
}
|
||||
|
||||
.custom-list-style-1 > li {
|
||||
margin-bottom: 0;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.custom-list-style-1 > li + li {
|
||||
border-top: 1px solid #46474a;
|
||||
}
|
||||
|
||||
.custom-list-style-1 > li:first-child {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.custom-list-style-1 > li:last-child {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
/*
|
||||
* Icon Style
|
||||
*/
|
||||
.custom-icon-style-1:before {
|
||||
border-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-icon-box-style-1:hover .custom-icon-style-1:before {
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
.custom-icon-box-style-1:hover .custom-icon-style-1 svg path {
|
||||
fill: var(--primary-inverse) !important;
|
||||
}
|
||||
|
||||
.custom-icon-box-style-1:hover h3 {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Thumb Info
|
||||
*/
|
||||
.custom-thumb-info-style-1:hover .thumb-info-wrapper {
|
||||
border-color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1:hover h3 {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Testimonial
|
||||
*/
|
||||
.custom-testimonial-style-1.testimonial-with-quotes blockquote:before {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
/*
|
||||
* Accordion
|
||||
*/
|
||||
.custom-accordion-style-1 > .card .card-header a:not(.collapsed) {
|
||||
background-color: var(--primary);
|
||||
color: var(--primary-inverse) !important;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card:hover .card-header a.collapsed {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Services Detail - Nav List
|
||||
*/
|
||||
.custom-nav-list-effect-1 > li > a:before {
|
||||
border-top-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-nav-list-effect-1 > li.active > a, .custom-nav-list-effect-1 > li.open > a, .custom-nav-list-effect-1 > li:hover > a {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Datepicker
|
||||
*/
|
||||
.datepicker thead tr:first-child th:hover,
|
||||
.datepicker tfoot tr th:hover,
|
||||
.datepicker table tr td span:hover {
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
.datepicker .datepicker-switch:hover,
|
||||
.datepicker .prev:hover,
|
||||
.datepicker .next:hover {
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
.datepicker table thead tr:last-child th:hover {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
.datepicker table tbody tr td.day:hover {
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
.datepicker table tbody tr td.day.active {
|
||||
background: var(--primary-300);
|
||||
}
|
||||
205
resources/assets/css/demos/demo-band.css
Normal file
205
resources/assets/css/demos/demo-band.css
Normal file
@ -0,0 +1,205 @@
|
||||
h1, h2, h3, h4, h5, h6, span, a {
|
||||
font-family: 'Josefin Sans', sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
}
|
||||
|
||||
.custom-font-primary {
|
||||
font-family: 'Josefin Sans', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-font-secondary {
|
||||
font-family: 'Montserrat', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-border-color-1 {
|
||||
border-color: #424549 !important;
|
||||
}
|
||||
|
||||
.custom-font-size-1 {
|
||||
font-size: 22.4px !important;
|
||||
font-size: 1.4rem !important;
|
||||
}
|
||||
|
||||
.custom-font-size-2 {
|
||||
font-size: 12.8px !important;
|
||||
font-size: 0.8rem !important;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav .header-nav-line nav > ul:not(:hover) li > a.active {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li {
|
||||
margin-right: 1.2rem;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Custom Porto SVG Logo (initial state for animation inside slide) */
|
||||
.custom-porto-svg-logo path {
|
||||
fill-opacity: 0;
|
||||
stroke-width: 1px;
|
||||
stroke: #FFF;
|
||||
stroke-dasharray: 630;
|
||||
stroke-dashoffset: 630;
|
||||
transition: ease stroke-dashoffset 5s, ease fill-opacity 1s 1.7s;
|
||||
}
|
||||
|
||||
.custom-porto-svg-logo.active path {
|
||||
stroke-dashoffset: 0;
|
||||
fill-opacity: 1;
|
||||
}
|
||||
|
||||
/* Custom Borders Divider */
|
||||
.custom-borders-divider-style-1 > div[class*="col"] {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-color: var(--dark);
|
||||
border-top-width: 0;
|
||||
border-right-width: 0;
|
||||
border-left-width: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.custom-borders-divider-style-1 > div[class*="col"] {
|
||||
border-right-width: 1px;
|
||||
}
|
||||
.custom-borders-divider-style-1 > div[class*="col"]:nth-child(1), .custom-borders-divider-style-1 > div[class*="col"]:nth-child(3) {
|
||||
border-left-width: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-borders-divider-style-1 > div[class*="col"] {
|
||||
border-left-width: 0;
|
||||
}
|
||||
.custom-borders-divider-style-1 > div[class*="col"]:nth-child(1) {
|
||||
border-left-width: 1px;
|
||||
}
|
||||
.custom-borders-divider-style-1 > div[class*="col"]:nth-child(3) {
|
||||
border-left-width: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* Custom Brands Colors */
|
||||
.custom-spotify-hover-effect {
|
||||
transition: ease background 300ms;
|
||||
}
|
||||
|
||||
.custom-spotify-hover-effect:hover {
|
||||
background: #24cf5f;
|
||||
}
|
||||
|
||||
.custom-itunes-hover-effect {
|
||||
transition: ease background 300ms;
|
||||
}
|
||||
|
||||
.custom-itunes-hover-effect:hover {
|
||||
background: #d948dd;
|
||||
}
|
||||
|
||||
.custom-amazon-hover-effect {
|
||||
transition: ease background 300ms;
|
||||
}
|
||||
|
||||
.custom-amazon-hover-effect:hover {
|
||||
background: #ff9b00;
|
||||
}
|
||||
|
||||
.custom-googlemusic-hover-effect {
|
||||
transition: ease background 300ms;
|
||||
}
|
||||
|
||||
.custom-googlemusic-hover-effect:hover {
|
||||
background: #f4522b;
|
||||
}
|
||||
|
||||
/* Custom Tour Items Hover Effect */
|
||||
.custom-tour-wrapper {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.custom-tour-wrapper .custom-tour-stage {
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-tour-wrapper .custom-tour-stage > .custom-tour-item + .custom-tour-item {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
transform: translate3d(0, 100%, 0);
|
||||
}
|
||||
|
||||
.custom-tour-wrapper:not(.custom-tour-wrapper-static):hover > .custom-tour-stage {
|
||||
transform: translate3d(0, -100%, 0);
|
||||
}
|
||||
|
||||
/* Custom Thumb Info */
|
||||
.custom-thumb-info-style-1 .overlay:before {
|
||||
transition: ease all 300ms 0ms !important;
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1:hover .overlay:before {
|
||||
opacity: 0.8 !important;
|
||||
background: #0c0c0c !important;
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1 .thumb-info-title {
|
||||
padding: 28.8px 44.8px 36.8px 33.6px !important;
|
||||
padding: 1.8rem 2.8rem 2.3rem 2.1rem !important;
|
||||
}
|
||||
|
||||
/* Custom Card Style */
|
||||
.custom-card-style-1 .custom-card-img-top-wrapper .post-date {
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 35px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.custom-card-style-1 .custom-card-img-top-wrapper .post-date .month {
|
||||
display: block;
|
||||
background: var(--grey-500);
|
||||
border-radius: 0 0 2px 2px;
|
||||
color: var(--light);
|
||||
font-size: 0.8em;
|
||||
line-height: 1.8;
|
||||
padding: 1px 10px;
|
||||
text-transform: uppercase;
|
||||
font-family: "Poppins", Arial, sans-serif;
|
||||
}
|
||||
|
||||
.custom-card-style-1 .custom-card-img-top-wrapper .post-date .day {
|
||||
background: var(--grey-100);
|
||||
border-radius: 2px 2px 0 0;
|
||||
color: var(--grey-500);
|
||||
display: block;
|
||||
font-size: 18px;
|
||||
font-weight: 900;
|
||||
padding: 10px;
|
||||
font-family: "Poppins", Arial, sans-serif;
|
||||
}
|
||||
|
||||
/* Custom SVG Line Animation */
|
||||
@keyframes customSVGLineAnim {
|
||||
from {
|
||||
stroke-dasharray: 40;
|
||||
stroke-dashoffset: 40;
|
||||
}
|
||||
to {
|
||||
stroke-dasharray: 40;
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.customSVGLineAnim {
|
||||
animation-name: customSVGLineAnim;
|
||||
}
|
||||
389
resources/assets/css/demos/demo-barber.css
Normal file
389
resources/assets/css/demos/demo-barber.css
Normal file
@ -0,0 +1,389 @@
|
||||
@charset "UTF-8";
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-family: 'Poppins', sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
}
|
||||
|
||||
.custom-primary-font {
|
||||
font-family: 'Poppins', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-secondary-font {
|
||||
font-family: 'Montserrat', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-tertiary-font {
|
||||
font-family: 'Playfair Display', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-padding-1 {
|
||||
padding: 11.2px 12.8px !important;
|
||||
padding: 0.7rem 0.8rem !important;
|
||||
}
|
||||
|
||||
.custom-font-weight-medium {
|
||||
font-weight: 500 !important;
|
||||
}
|
||||
|
||||
.custom-font-weight-extra-light {
|
||||
font-weight: 200 !important;
|
||||
}
|
||||
|
||||
.custom-fs-1 {
|
||||
font-size: 1.3em !important;
|
||||
}
|
||||
|
||||
.custom-fs-2 {
|
||||
font-size: 53.44px !important;
|
||||
font-size: 3.34rem !important;
|
||||
}
|
||||
|
||||
.text-3 {
|
||||
font-size: 1.1em !important;
|
||||
}
|
||||
|
||||
.custom-btn-style-1 {
|
||||
background-color: #000 !important;
|
||||
border-color: #000 !important;
|
||||
font-family: 'Poppins', sans-serif;
|
||||
font-size: 17.6px;
|
||||
font-size: 1.1rem;
|
||||
color: var(--light) !important;
|
||||
padding: 8px 24px !important;
|
||||
padding: 0.5rem 1.5rem !important;
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-mobile-scale-1 {
|
||||
transform: scale(0.6);
|
||||
}
|
||||
}
|
||||
|
||||
.custom-slider-dot {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
@keyframes lineProgress {
|
||||
from {
|
||||
stroke-dashoffset: 1550;
|
||||
}
|
||||
to {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.lineProgress {
|
||||
animation-name: lineProgress;
|
||||
}
|
||||
|
||||
@keyframes lineProgressAndFill {
|
||||
0% {
|
||||
stroke-dasharray: 1440;
|
||||
stroke-dashoffset: 1440;
|
||||
fill-opacity: 0;
|
||||
}
|
||||
75% {
|
||||
fill-opacity: 0.5;
|
||||
}
|
||||
90% {
|
||||
stroke-dasharray: 1440;
|
||||
stroke-dashoffset: 0;
|
||||
fill-opacity: 0.5;
|
||||
}
|
||||
100% {
|
||||
stroke-dasharray: 1440;
|
||||
stroke-dashoffset: 0;
|
||||
fill-opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.lineProgressAndFill {
|
||||
animation-name: lineProgressAndFill;
|
||||
}
|
||||
|
||||
.custom-side-dots {
|
||||
position: relative;
|
||||
padding-left: 19.2px;
|
||||
padding-left: 1.2rem;
|
||||
padding-right: 19.2px;
|
||||
padding-right: 1.2rem;
|
||||
}
|
||||
|
||||
.custom-side-dots:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
background-color: var(--grey-500);
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 100%;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
|
||||
.custom-side-dots:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0;
|
||||
background-color: var(--grey-500);
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 100%;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
|
||||
.custom-side-dots.custom-side-dots-rm-right {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.custom-side-dots.custom-side-dots-rm-right:after {
|
||||
content: none;
|
||||
}
|
||||
|
||||
.custom-side-dots.custom-side-dots-rm-left {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.custom-side-dots.custom-side-dots-rm-left:before {
|
||||
content: none;
|
||||
}
|
||||
|
||||
.custom-side-dots.custom-side-dots-at-top {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
.custom-side-dots.custom-side-dots-at-top:before, .custom-side-dots.custom-side-dots-at-top:after {
|
||||
top: 44px;
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.custom-side-dots.custom-side-dots-big:before, .custom-side-dots.custom-side-dots-big:after {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
.custom-side-dots.custom-side-dots-outside:before {
|
||||
left: -20px;
|
||||
}
|
||||
|
||||
.custom-side-dots.custom-side-dots-outside:after {
|
||||
right: -20px;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-side-dots.custom-side-dots-rm-sm:before, .custom-side-dots.custom-side-dots-rm-sm:after {
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-images-position-1 div:nth-child(2) {
|
||||
transform: translate3d(-50%, -30%, 0);
|
||||
}
|
||||
|
||||
.custom-images-position-1 div:nth-child(3) {
|
||||
transform: translate3d(76%, 30%, 0);
|
||||
}
|
||||
|
||||
.custom-images-position-1 div:nth-child(4) {
|
||||
transform: translate3d(-13%, 147%, 0);
|
||||
}
|
||||
|
||||
.custom-circle-pos-1 {
|
||||
top: -170px !important;
|
||||
}
|
||||
|
||||
.custom-circle-pos-2 {
|
||||
bottom: -210px !important;
|
||||
right: -170px !important;
|
||||
}
|
||||
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-family: 'Poppins', sans-serif;
|
||||
font-size: 14.4px;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
letter-spacing: -0.5px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
padding: 0 1.2rem !important;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li > a:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50.7%;
|
||||
right: -5px;
|
||||
background-color: var(--light) !important;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-radius: 100%;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
#header .header-nav-main nav > ul > li:last-child > a:before {
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-blockquote-style-1 {
|
||||
position: relative;
|
||||
border: 0;
|
||||
padding: 8px 44.8px;
|
||||
padding: 0.5rem 2.8rem;
|
||||
}
|
||||
|
||||
.custom-blockquote-style-1:before {
|
||||
content: "“";
|
||||
position: absolute;
|
||||
left: -2px;
|
||||
top: -24px;
|
||||
font-size: 75px;
|
||||
font-style: normal;
|
||||
font-family: 'Playfair Display', sans-serif;
|
||||
line-height: 1;
|
||||
color: var(--default);
|
||||
}
|
||||
|
||||
.custom-blockquote-style-1 p {
|
||||
font-family: 'Playfair Display', sans-serif;
|
||||
font-size: 20.8px;
|
||||
font-size: 1.3rem;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1 .custom-testimonial-quote > span {
|
||||
font-family: 'Playfair Display', sans-serif;
|
||||
font-size: 192px;
|
||||
font-size: 12rem;
|
||||
line-height: 1;
|
||||
display: block;
|
||||
max-height: 94.4px;
|
||||
max-height: 5.9rem;
|
||||
}
|
||||
|
||||
.custom-working-hours {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.custom-working-hours .custom-working-hours-item {
|
||||
flex-basis: 14.2857%;
|
||||
max-width: 14.2857%;
|
||||
text-align: center;
|
||||
box-shadow: 0px 0px 38px -3px rgba(111, 111, 111, 0.15);
|
||||
margin-left: 7px;
|
||||
margin-right: 7px;
|
||||
padding: 40px 8px;
|
||||
padding: 2.5rem 0.5rem;
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
.custom-working-hours .custom-working-hours-item:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.custom-working-hours .custom-working-hours-item:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.custom-working-hours .custom-working-hours-item:hover, .custom-working-hours .custom-working-hours-item.active {
|
||||
background-color: var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-working-hours .custom-working-hours-item:hover *, .custom-working-hours .custom-working-hours-item.active * {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-working-hours {
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
}
|
||||
.custom-working-hours .custom-working-hours-item {
|
||||
flex-basis: 23.1857%;
|
||||
max-width: 23.1857%;
|
||||
}
|
||||
.custom-working-hours .custom-working-hours-item:nth-child(5), .custom-working-hours .custom-working-hours-item:nth-child(6), .custom-working-hours .custom-working-hours-item:nth-child(7) {
|
||||
margin-top: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-working-hours .custom-working-hours-item {
|
||||
flex-basis: 30.4857%;
|
||||
max-width: 30.4857%;
|
||||
}
|
||||
.custom-working-hours .custom-working-hours-item:nth-child(4) {
|
||||
margin-top: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-working-hours .custom-working-hours-item {
|
||||
flex-basis: 44.9857%;
|
||||
max-width: 44.9857%;
|
||||
}
|
||||
.custom-working-hours .custom-working-hours-item:nth-child(3) {
|
||||
margin-top: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-title,
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-price {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-price strong {
|
||||
font-size: 20.8px;
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-price strong > span {
|
||||
font-size: 0.6em;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-line {
|
||||
width: 100%;
|
||||
border-bottom: dashed 1px #777;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-webkit-input-placeholder {
|
||||
color: var(--default);
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-moz-placeholder {
|
||||
color: var(--default);
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:-ms-input-placeholder {
|
||||
color: var(--default);
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:-moz-placeholder {
|
||||
color: var(--default);
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
.svg-primary circle {
|
||||
stroke: var(--primary);
|
||||
fill: var(--primary);
|
||||
}
|
||||
|
||||
.custom-side-dots:before, .custom-side-dots:after {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-working-hours .custom-working-hours-item:hover, .custom-working-hours .custom-working-hours-item.active {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
114
resources/assets/css/demos/demo-beauty-salon.css
Normal file
114
resources/assets/css/demos/demo-beauty-salon.css
Normal file
@ -0,0 +1,114 @@
|
||||
.custom-container-style-1 {
|
||||
min-width: 85vw;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.custom-container-style-1 {
|
||||
min-width: 540px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.custom-container-style-1 {
|
||||
min-width: 720px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-container-style-1 {
|
||||
min-width: 960px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-container-style-1 {
|
||||
min-width: 1140px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1440px) {
|
||||
.custom-container-style-1 {
|
||||
min-width: 1440px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-container-position-1 {
|
||||
position: relative;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-family: 'Playfair Display', sans-serif;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.custom-primary-font {
|
||||
font-family: 'Poppins', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-secondary-font {
|
||||
font-family: 'Playfair Display', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-tertiary-font {
|
||||
font-family: 'Rouge Script', cursive !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-text-lg-1 {
|
||||
font-size: 6em !important;
|
||||
line-height: 1 !important;
|
||||
}
|
||||
.custom-text-lg-2 {
|
||||
font-size: 380px !important;
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
background: #e7e7e7;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav.header-nav-line.header-nav-bottom-line nav > ul > li > a:before, #header .header-nav.header-nav-line.header-nav-bottom-line nav > ul > li:hover > a:before {
|
||||
height: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1400px) {
|
||||
#header .header-nav.header-nav-line nav > ul > li {
|
||||
margin: 0 14px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav.header-nav-line nav > ul > li > a, #header .header-nav.header-nav-line nav > ul > li:hover > a {
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
letter-spacing: -0.3px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-card-services .card-body {
|
||||
min-height: 345px;
|
||||
}
|
||||
|
||||
.custom-card-services .custom-card-services-icon {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
top: 20px;
|
||||
}
|
||||
|
||||
.custom-card-services .custom-card-services-icon svg {
|
||||
opacity: 0.05 !important;
|
||||
}
|
||||
|
||||
.block-follow-instagram {
|
||||
width: 480px;
|
||||
height: 240px;
|
||||
}
|
||||
|
||||
footer.border-top {
|
||||
border-top-color: #e7e7e7 !important;
|
||||
}
|
||||
905
resources/assets/css/demos/demo-business-consulting-2.css
Normal file
905
resources/assets/css/demos/demo-business-consulting-2.css
Normal file
@ -0,0 +1,905 @@
|
||||
body {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
/*
|
||||
* Container
|
||||
*/
|
||||
@media (min-width: 1240px) {
|
||||
.container {
|
||||
max-width: 1240px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* BG
|
||||
*/
|
||||
.custom-bg-color-lighter-grey {
|
||||
background: #fafafc !important;
|
||||
}
|
||||
|
||||
.custom-bg-color-light-grey {
|
||||
background: #dde2ea !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Button
|
||||
*/
|
||||
.custom-btn {
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/*
|
||||
* Half Section
|
||||
*/
|
||||
.col-half-section {
|
||||
max-width: 590px;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.col-half-section {
|
||||
max-width: 455px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.col-half-section {
|
||||
max-width: 750px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.col-half-section {
|
||||
max-width: 570px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.col-half-section {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Letter Spacing
|
||||
*/
|
||||
.custom-letter-spacing-1 {
|
||||
letter-spacing: -0.5px !important;
|
||||
}
|
||||
|
||||
.custom-letter-spacing-2 {
|
||||
letter-spacing: -0.8px !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Font Size
|
||||
*/
|
||||
.custom-text-1 {
|
||||
font-size: 32px !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Line Pre
|
||||
*/
|
||||
.line-pre-title {
|
||||
width: 50px;
|
||||
height: 3px;
|
||||
margin-right: 20px;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
html[dir="rtl"] .slider-container .line-pre-title {
|
||||
margin-right: 20px;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Circular Bar
|
||||
*/
|
||||
.custom-circular-bar .circular-bar-chart {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
height: 175px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Card
|
||||
*/
|
||||
.card-accordion-our-services-container {
|
||||
border: 1px solid #eef0f4;
|
||||
}
|
||||
|
||||
.card-accordion-our-services-container .card-accordion-our-services {
|
||||
border: 9px solid #eef0f4;
|
||||
border-top: 0;
|
||||
margin: -2px -1px 0 -1px;
|
||||
}
|
||||
|
||||
.custom-cards {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-cards.custom-cards-slider .cards-container {
|
||||
margin: -250px auto 0;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-cards {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-cards .cards-container:before {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-cards .cards-container {
|
||||
position: static;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-cards .cards-container > div:nth-child(1) .card, .custom-cards .cards-container > div:nth-child(2) .card {
|
||||
margin-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-cards .cards-container .card {
|
||||
padding: 70px 0;
|
||||
box-shadow: 0 0 50px rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.custom-cards .cards-container .card:before {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.custom-cards .cards-container .card .card-body {
|
||||
padding: 0 50px;
|
||||
border-right: 1px solid #eef0f4;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-cards .cards-container .card .card-body {
|
||||
border-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-cards .cards-container .card .card-body img {
|
||||
padding-bottom: 35px;
|
||||
}
|
||||
|
||||
.custom-cards .cards-container .card .card-body .card-title {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.custom-cards .cards-container .card .card-body .card-text, .custom-cards .cards-container .card .card-body .card-title {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
.header-top .header-top-phone {
|
||||
font-size: 16px !important;
|
||||
padding: 6px 17px 6px 0 !important;
|
||||
}
|
||||
|
||||
.header-top .header-top-phone > span {
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
line-height: 31px;
|
||||
background-color: #dde2ea;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.header-top .header-top-email,
|
||||
.header-top .header-top-opening-hours {
|
||||
font-size: 12px !important;
|
||||
letter-spacing: -0.3px;
|
||||
}
|
||||
|
||||
.header-top .header-top-email > span,
|
||||
.header-top .header-top-opening-hours > span {
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
line-height: 31px;
|
||||
background-color: #dde2ea;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
.header-top .header-top-email {
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.header-top .nav-item-header-top-socials .header-top-socials ul li {
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.header-top .nav-item-header-top-socials .header-top-socials ul li i {
|
||||
font-size: 15px !important;
|
||||
}
|
||||
|
||||
.header-top .header-top-button-make-as-appoitment {
|
||||
width: 230px;
|
||||
}
|
||||
|
||||
.header-top .header-top-button-make-as-appoitment a {
|
||||
font-size: 12px;
|
||||
border-radius: 0 0 4px 4px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.header-container .header-nav .nav li > a {
|
||||
text-transform: none !important;
|
||||
font-size: 14px !important;
|
||||
}
|
||||
.header-container .header-nav .nav li .dropdown-menu a {
|
||||
font-size: 0.8em !important;
|
||||
}
|
||||
.header-container .header-nav .nav li:hover > a {
|
||||
background: #fff !important;
|
||||
}
|
||||
.header-container .header-nav .nav li:hover > a:before {
|
||||
border-bottom: 0 !important;
|
||||
}
|
||||
.header-container .header-nav .nav li:hover > a + ul.dropdown-menu {
|
||||
border-top: 0 !important;
|
||||
margin-top: -5px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.header-column-search {
|
||||
flex-grow: 0.14 !important;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.header-column-search {
|
||||
flex-grow: 0.3 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.header-column-search {
|
||||
order: 2;
|
||||
flex-grow: 0.1 !important;
|
||||
align-items: center !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.header-column-logo {
|
||||
order: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.header-column-nav-menu {
|
||||
order: 3;
|
||||
flex-grow: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.header-nav-features {
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.header-nav-features:not(.header-nav-features-no-border):before {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Slider
|
||||
*/
|
||||
.slider-container .custom-bottom-label {
|
||||
width: 200px;
|
||||
height: 60px;
|
||||
letter-spacing: -0.35px !important;
|
||||
font-size: 14px !important;
|
||||
line-height: 60px !important;
|
||||
border-radius: 4px !important;
|
||||
}
|
||||
|
||||
.slider-container .section-funnel-layer-bottom {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 96px 0;
|
||||
padding: 6rem 0;
|
||||
transform: translate3d(0, 50%, 0);
|
||||
z-index: 20;
|
||||
}
|
||||
|
||||
.slider-container .section-funnel-layer-bottom .section-funnel-layer:nth-child(1) {
|
||||
transform: skewY(4.7deg);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--light);
|
||||
z-index: 6;
|
||||
}
|
||||
|
||||
.slider-container .section-funnel-layer-bottom .section-funnel-layer:nth-child(2) {
|
||||
transform: skewY(-4.7deg);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--light);
|
||||
z-index: 6;
|
||||
}
|
||||
|
||||
.slider-container .tparrows {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.slider-container .tparrows:hover {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.slider-container .tparrows:before {
|
||||
color: var(--dark) !important;
|
||||
font-size: 22px;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.custom-slider-container:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
background-color: #fafafc;
|
||||
top: -75px;
|
||||
width: 200%;
|
||||
z-index: 21;
|
||||
height: 75px;
|
||||
transform: rotate(-1deg);
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-slider-container:before {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-slider-container:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
background-color: #fafafc;
|
||||
bottom: -75px;
|
||||
width: 200%;
|
||||
z-index: 21;
|
||||
height: 75px;
|
||||
transform: rotate(1deg);
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-slider-container:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-tp-caption-right-side {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.tp-bullet {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
box-shadow: 0 0 0 2px var(--dark) !important;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.tp-bullet.selected {
|
||||
opacity: 1;
|
||||
box-shadow: 0 0 0 2px var(--dark) !important;
|
||||
}
|
||||
|
||||
.tp-bullet.selected .tp-bullet-inner {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.tp-bullet .tp-bullet-inner, .tp-bullet .tp-bullet-inner:hover {
|
||||
transform: scale(0.5) !important;
|
||||
}
|
||||
|
||||
.tp-bullet .tp-bullet-inner {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* Social Icons
|
||||
*/
|
||||
.custom-social-icons li {
|
||||
box-shadow: none !important;
|
||||
margin: -1px 13px 0 0;
|
||||
}
|
||||
|
||||
.custom-social-icons li a {
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
line-height: 41px;
|
||||
}
|
||||
|
||||
.custom-social-icons li:hover a {
|
||||
color: var(--dark--200) !important;
|
||||
}
|
||||
|
||||
.custom-social-icons li:hover a > i[class*="text-color-"] {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Circular Bar
|
||||
*/
|
||||
.circular-bar strong {
|
||||
top: 49%;
|
||||
font-size: 22px !important;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Counters
|
||||
*/
|
||||
.custom-counters .counter:first-child {
|
||||
margin-right: 70px !important;
|
||||
}
|
||||
|
||||
.custom-counters .counter strong {
|
||||
font-size: 40px !important;
|
||||
}
|
||||
|
||||
.custom-counters .counter label {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Our Services
|
||||
*/
|
||||
.col-img-our-services:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
display: block;
|
||||
background-color: #fafafc;
|
||||
top: -78px;
|
||||
left: -10px;
|
||||
width: 200%;
|
||||
z-index: 21;
|
||||
height: 75px;
|
||||
transform: rotate(-2deg);
|
||||
}
|
||||
|
||||
.col-img-our-services:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
display: block;
|
||||
background-color: #fafafc;
|
||||
bottom: -78px;
|
||||
left: -10px;
|
||||
width: 200%;
|
||||
z-index: 21;
|
||||
height: 75px;
|
||||
transform: rotate(2deg);
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.col-img-our-services {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.our-services {
|
||||
background-position-y: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: auto;
|
||||
height: auto;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.our-services {
|
||||
min-height: 850px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.our-services {
|
||||
background: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.our-services:after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
background-color: var(--light);
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Coaching Consulting
|
||||
*/
|
||||
.coaching-consulting .col-coaching-consulting-imgs .card {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.coaching-consulting .col-coaching-consulting-imgs .card:nth-child(1) {
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
right: 20px;
|
||||
}
|
||||
|
||||
.coaching-consulting .col-coaching-consulting-imgs .card:nth-child(2) {
|
||||
z-index: 3;
|
||||
bottom: 30px;
|
||||
left: 60%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.coaching-consulting .col-coaching-consulting-imgs .card:nth-child(3) {
|
||||
z-index: 2;
|
||||
left: 40px;
|
||||
bottom: 10%;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.coaching-consulting .col-coaching-consulting-imgs .card {
|
||||
position: relative;
|
||||
max-width: 30%;
|
||||
margin-top: 30px;
|
||||
transform: none !important;
|
||||
top: 0 !important;
|
||||
left: 0 !important;
|
||||
bottom: 0 !important;
|
||||
right: 0 !important;
|
||||
float: left;
|
||||
margin-right: 3.33%;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Real Word Stories
|
||||
*/
|
||||
.real-word-stories:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
display: block;
|
||||
background-color: #fafafc;
|
||||
top: -75px;
|
||||
width: 200%;
|
||||
z-index: 21;
|
||||
height: 75px;
|
||||
transform: rotate(-1deg);
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.real-word-stories:before {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.real-word-stories .owl-dots {
|
||||
display: flex;
|
||||
margin-top: 30px !important;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.real-word-stories .owl-dots button {
|
||||
border: 2px solid var(--dark) !important;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
border-radius: 50%;
|
||||
line-height: 15px !important;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.real-word-stories .owl-dots button:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.real-word-stories .owl-dots button span {
|
||||
display: none !important;
|
||||
margin: 0 auto !important;
|
||||
width: 7px !important;
|
||||
height: 7px !important;
|
||||
background-color: var(--dark) !important;
|
||||
}
|
||||
|
||||
.real-word-stories .owl-dots button.active span {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.real-word-stories .custom-testimonial-container {
|
||||
width: 72.5%;
|
||||
padding-right: 150px;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.real-word-stories .custom-testimonial-container {
|
||||
padding-right: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.real-word-stories .custom-testimonial-container {
|
||||
padding-right: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.real-word-stories .custom-testimonial-container {
|
||||
padding-right: 120px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.real-word-stories .custom-testimonial-container {
|
||||
width: 100%;
|
||||
padding-right: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.real-word-stories .custom-testimonial-container .custom-testimonial {
|
||||
padding: 45px 0 45px 40px;
|
||||
}
|
||||
|
||||
.real-word-stories .custom-testimonial-container .custom-testimonial blockquote p, .real-word-stories .custom-testimonial-container .custom-testimonial blockquote h4 {
|
||||
font-family: Poppins;
|
||||
}
|
||||
|
||||
.real-word-stories .custom-testimonial-container .custom-testimonial .testimonial-author strong {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.real-word-stories .custom-testimonial-container .custom-testimonial .testimonial-author img {
|
||||
max-width: 70px;
|
||||
max-height: 70px;
|
||||
}
|
||||
|
||||
.real-word-stories .custom-testimonial-container .custom-testimonial .custom-testimonial-right {
|
||||
width: 45%;
|
||||
height: 210px;
|
||||
right: 30px;
|
||||
top: 65px;
|
||||
box-shadow: 0 0 30px rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
|
||||
.real-word-stories .custom-testimonial-container .custom-testimonial .custom-testimonial-right img {
|
||||
max-width: 130px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.real-word-stories .custom-testimonial-container .custom-testimonial .custom-testimonial-right .custom-button-testimonial-right {
|
||||
width: 165px;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
bottom: -25px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Are You Lookng For
|
||||
*/
|
||||
.are-you-looking-for {
|
||||
padding: 70px 0;
|
||||
}
|
||||
|
||||
.are-you-looking-for .are-you-looking-for-phone {
|
||||
margin-right: 37px;
|
||||
}
|
||||
|
||||
.are-you-looking-for .are-you-looking-for-phone > span {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
line-height: 46px;
|
||||
background-color: #dde2ea;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Page Header
|
||||
*/
|
||||
.custom-page-header {
|
||||
padding: 75px 0;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-page-header {
|
||||
padding: 35px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-page-header:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
background-color: #fafafc;
|
||||
top: -75px;
|
||||
width: 200%;
|
||||
z-index: 21;
|
||||
height: 75px;
|
||||
transform: rotate(-1deg);
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-page-header:before {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-page-header:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
background-color: #fafafc;
|
||||
bottom: -75px;
|
||||
width: 200%;
|
||||
z-index: 21;
|
||||
height: 75px;
|
||||
transform: rotate(1deg);
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-page-header:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Contact Form
|
||||
*/
|
||||
.custom-form-style-1 .form-control {
|
||||
border: 0;
|
||||
padding: 19.2px;
|
||||
padding: 1.2rem;
|
||||
box-shadow: none !important;
|
||||
height: auto;
|
||||
background: #fafafc !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
#footer:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
display: block;
|
||||
background-color: #fafafc;
|
||||
top: -75px;
|
||||
width: 200%;
|
||||
z-index: 21;
|
||||
height: 75px;
|
||||
transform: rotate(-1deg);
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
#footer:before {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) and (max-width: 1240px) {
|
||||
#footer .custom-container-info-socials {
|
||||
justify-content: flex-end !important;
|
||||
}
|
||||
}
|
||||
|
||||
#footer .footer-nav-phone {
|
||||
font-size: 16px !important;
|
||||
padding: 0 17px 0 0 !important;
|
||||
}
|
||||
|
||||
#footer .footer-nav-phone > span {
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
line-height: 31px;
|
||||
background-color: #dde2ea;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
#footer .footer-nav-email,
|
||||
#footer .footer-nav-opening-hours {
|
||||
font-size: 12px !important;
|
||||
letter-spacing: -0.3px;
|
||||
}
|
||||
|
||||
#footer .footer-nav-email > span,
|
||||
#footer .footer-nav-opening-hours > span {
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
line-height: 31px;
|
||||
background-color: #dde2ea;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
#footer .footer-nav-email {
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
#footer .footer-nav-opening-hours {
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
#footer .footer-copyright {
|
||||
border-top: 1px solid #ced6e1;
|
||||
padding: 60px 0;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
#footer .footer-column-get-in-touch {
|
||||
margin: 1rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
#footer .nav-footer > ul {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#footer .nav-footer > ul li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
#footer .nav-footer .dropdown-secondary a {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#footer .custom-row-footer {
|
||||
padding-top: 150px !important;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
#footer .custom-row-footer {
|
||||
padding-top: 60px !important;
|
||||
}
|
||||
}
|
||||
|
||||
#footer .custom-row-footer .custom-footer-column-logo img {
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
.bg-color-primary-darken-1 {
|
||||
background-color: var(--primary-100) !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li > a {
|
||||
color: var(--secondary);
|
||||
}
|
||||
#header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li > a:hover {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
}
|
||||
386
resources/assets/css/demos/demo-business-consulting-3.css
Normal file
386
resources/assets/css/demos/demo-business-consulting-3.css
Normal file
@ -0,0 +1,386 @@
|
||||
.custom-font-size-1 {
|
||||
font-size: 0.6em;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-big-font-size-1 {
|
||||
font-size: 6.9rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1600px) {
|
||||
.custom-big-font-size-1 {
|
||||
font-size: 8.5rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-blockquote-style-1 {
|
||||
border-left-width: 12px;
|
||||
border-left-color: #f3f3f3;
|
||||
}
|
||||
|
||||
.custom-bg-color-grey-1 {
|
||||
background-color: #5a6267;
|
||||
}
|
||||
|
||||
.custom-border-color-grey-1 {
|
||||
border-color: #404040 !important;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-ws-mobile-wrap {
|
||||
white-space: normal !important;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-box-shadow-1 {
|
||||
box-shadow: 0 0px 40px 0px rgba(187, 187, 187, 0.3);
|
||||
}
|
||||
|
||||
/*
|
||||
* Text Background
|
||||
*/
|
||||
@media (min-width: 992px) {
|
||||
.custom-text-background {
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
background-position: 20% 30%;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-text-background {
|
||||
background-image: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Text Highlight
|
||||
*/
|
||||
.custom-highlight-text-1 {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-highlight-text-1:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 5px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
border-bottom: 7px solid #d20d0d;
|
||||
opacity: 0.2;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Buttons
|
||||
*/
|
||||
.custom-btn-style-1 {
|
||||
position: relative;
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-btn-style-1 > span {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-btn-style-1:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: inherit;
|
||||
opacity: 0.7;
|
||||
border-radius: inherit;
|
||||
transform: translate3d(5px, 5px, 0);
|
||||
transition: ease transform 300ms;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-btn-style-1:hover {
|
||||
transform: translate3d(2.5px, 2.5px, 0);
|
||||
}
|
||||
|
||||
.custom-btn-style-1:hover:before {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
/*
|
||||
* Crooked Line
|
||||
*/
|
||||
.custom-crooked-line {
|
||||
display: inline-block;
|
||||
width: 77px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Link Effects
|
||||
*/
|
||||
@keyframes crookedLineAnim {
|
||||
from {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
to {
|
||||
transform: translate3d(-48%, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.custom-link-hover-effects .custom-view-more svg {
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-link-hover-effects:hover .custom-crooked-line svg {
|
||||
animation-name: crookedLineAnim;
|
||||
animation-duration: 2s;
|
||||
animation-iteration-count: infinite;
|
||||
animation-timing-function: linear;
|
||||
}
|
||||
|
||||
.custom-link-hover-effects:hover .custom-view-more svg {
|
||||
transform: translate3d(7px, 0, 0);
|
||||
}
|
||||
|
||||
.custom-link-hover-effects:hover .custom-date-style-1 {
|
||||
transform: translate3d(2.5px, 2.5px, 0);
|
||||
}
|
||||
|
||||
.custom-link-hover-effects:hover .custom-date-style-1:before {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
.custom-header-top-nav-background {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-header-top-nav-background:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 100vw;
|
||||
height: 100%;
|
||||
background: var(--grey-500);
|
||||
transform: skewX(-25deg);
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-header-top-nav-background:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 7px;
|
||||
right: -7px;
|
||||
width: 100vw;
|
||||
height: 100%;
|
||||
background: var(--grey-500);
|
||||
transform: skewX(-25deg);
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
padding: 0px 1.2rem !important;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Carousel
|
||||
*/
|
||||
.custom-carousel-box-shadow-1 {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-carousel-box-shadow-1:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 65%;
|
||||
height: 0px;
|
||||
box-shadow: 0 40px 40px 120px rgba(0, 0, 0, 0.03);
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots,
|
||||
.custom-dots-style-2 .owl-dots {
|
||||
margin-top: 30px !important;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot > span,
|
||||
.custom-dots-style-2 .owl-dots .owl-dot > span {
|
||||
background: #9e9e9e !important;
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot.active > span,
|
||||
.custom-dots-style-2 .owl-dots .owl-dot.active > span {
|
||||
background: #3e3e3e !important;
|
||||
width: 18px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-dots-style-2 .owl-dots {
|
||||
transform: translate3d(0, -50px, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.custom-carousel-vertical-center-items .owl-stage {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.custom-nav-style-1 .owl-nav {
|
||||
left: 50%;
|
||||
width: 105%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
|
||||
.owl-carousel.carousel-center-active-item .owl-item {
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
/*
|
||||
* Tabs
|
||||
*/
|
||||
.custom-tabs-style-1 .nav-tabs {
|
||||
border-bottom: 1px solid #f1f1f1 !important;
|
||||
margin-bottom: 35px !important;
|
||||
}
|
||||
|
||||
.custom-tabs-style-1 .nav-tabs > li {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.custom-tabs-style-1 .nav-tabs > li .nav-link {
|
||||
border-bottom-width: 1px !important;
|
||||
}
|
||||
|
||||
.custom-tabs-style-1 .nav-tabs > li .nav-link.active {
|
||||
border-bottom-width: 2px !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Accordion
|
||||
*/
|
||||
.custom-accordion-style-1 > .card {
|
||||
border: 1px solid transparent !important;
|
||||
transition: ease border-color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a {
|
||||
position: relative;
|
||||
padding: 23px 30px;
|
||||
background-color: #f4f4f4;
|
||||
transition: ease background-color 300ms, ease color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a:after {
|
||||
content: '+';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 25px;
|
||||
font-size: inherit;
|
||||
font-weight: inherit;
|
||||
transform: translate3d(0, -50%, 0) rotate(45deg);
|
||||
transform-origin: 50% 50%;
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a.collapsed:after {
|
||||
transform: translate3d(0, -50%, 0) rotate(0deg);
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header + .collapse.show,
|
||||
.custom-accordion-style-1 > .card .card-header + .collapsing {
|
||||
border: 1px solid #efefef;
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card + .card {
|
||||
margin-top: 17px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Read More
|
||||
*/
|
||||
.custom-read-more-style-1 .readmore-overlay {
|
||||
background: linear-gradient(rgba(2, 0, 36, 0) 0%, white 60%) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Blog Post Date
|
||||
*/
|
||||
.custom-date-style-1 {
|
||||
position: relative;
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-date-style-1:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: inherit;
|
||||
opacity: 0.7;
|
||||
transform: translate3d(5px, 5px, 0);
|
||||
transition: ease transform 300ms;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer p, #footer li, #footer a:not(.btn):not(.no-footer-css), #footer span {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
#footer .footer-copyright p {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
/*
|
||||
* Text Highlight
|
||||
*/
|
||||
.custom-highlight-text-1:before {
|
||||
border-bottom-color: var(--primary);
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
.custom-header-top-nav-background {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-header-top-nav-background:before {
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
.custom-header-top-nav-background:after {
|
||||
background: var(--primary--300);
|
||||
}
|
||||
|
||||
/*
|
||||
* Accordion
|
||||
*/
|
||||
.custom-accordion-style-1 > .card .card-header a:not(.collapsed) {
|
||||
background-color: var(--primary);
|
||||
color: var(--primary-inverse) !important;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card:hover .card-header a.collapsed {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
221
resources/assets/css/demos/demo-business-consulting-4.css
Normal file
221
resources/assets/css/demos/demo-business-consulting-4.css
Normal file
@ -0,0 +1,221 @@
|
||||
/* Custom Hero Row */
|
||||
.custom-hero-row {
|
||||
min-height: calc(100vh - 100px);
|
||||
}
|
||||
|
||||
/* Custom Elements */
|
||||
.custom-element-wrapper {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-1 {
|
||||
top: 25%;
|
||||
left: 45%;
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-1 .custom-element {
|
||||
background: transparent;
|
||||
border: 3px solid var(--primary);
|
||||
opacity: 0.05;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 25px;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-2 {
|
||||
top: 45%;
|
||||
left: 62%;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-2 .custom-element {
|
||||
background: var(--primary);
|
||||
opacity: 0.05;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 25px;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-3 {
|
||||
top: 57%;
|
||||
left: 70%;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-3 .custom-element {
|
||||
background: transparent;
|
||||
border: 3px solid var(--primary);
|
||||
opacity: 0.05;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 25px;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-4 {
|
||||
top: 57%;
|
||||
left: 44%;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-4 .custom-element {
|
||||
background: var(--primary);
|
||||
opacity: 0.03;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 25px;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-5 {
|
||||
top: 18%;
|
||||
left: 7%;
|
||||
width: 450px;
|
||||
height: 450px;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-5 .custom-element {
|
||||
background: var(--secondary);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 25px;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.custom-element-wrapper.custom-element-5 {
|
||||
top: 18%;
|
||||
left: 15%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-element-wrapper.custom-element-5 {
|
||||
top: 27%;
|
||||
left: 22%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-element-wrapper.custom-element-5 {
|
||||
top: 22%;
|
||||
left: 22%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1400px) {
|
||||
.custom-element-wrapper.custom-element-5 {
|
||||
top: 27%;
|
||||
left: 78%;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-6 {
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
top: 22.2%;
|
||||
right: -8%;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-7 {
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
top: 58.2%;
|
||||
right: -38%;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-8 {
|
||||
top: -5%;
|
||||
left: -6%;
|
||||
clip-path: polygon(0 0, 100% 0, 100% 100%, 77.2% 100%, 0 54%);
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.custom-element-wrapper.custom-element-8 {
|
||||
top: -5%;
|
||||
left: 5%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-element-wrapper.custom-element-8 {
|
||||
top: 5%;
|
||||
left: 5%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-element-wrapper.custom-element-8 {
|
||||
top: 0%;
|
||||
left: 10%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1400px) {
|
||||
.custom-element-wrapper.custom-element-8 {
|
||||
top: 5%;
|
||||
left: 63%;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-9 {
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
top: 5%;
|
||||
left: 7%;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-10 {
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
top: 65%;
|
||||
right: 10%;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-11 {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-11 img {
|
||||
border-radius: 25px;
|
||||
}
|
||||
|
||||
.custom-element-wrapper.custom-element-11:before {
|
||||
display: block;
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 30px;
|
||||
left: -30px;
|
||||
background: var(--primary);
|
||||
border-radius: 25px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
/* Page Header */
|
||||
.page-header {
|
||||
padding-top: 153px;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.page-header .container:before {
|
||||
content: "";
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background: rgba(0, 0, 0, 0.06);
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
/* Breadcrumb */
|
||||
.breadcrumb li {
|
||||
font-weight: 600;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.breadcrumb > li + li:before {
|
||||
padding: 0 7px 0 7px;
|
||||
}
|
||||
189
resources/assets/css/demos/demo-business-consulting-5.css
Normal file
189
resources/assets/css/demos/demo-business-consulting-5.css
Normal file
@ -0,0 +1,189 @@
|
||||
@media (min-width: 1440px) {
|
||||
.container {
|
||||
max-width: 1440px !important;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.hero {
|
||||
background-size: cover;
|
||||
max-width: 1100px;
|
||||
width: 100%;
|
||||
max-height: 770px;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 1800px) {
|
||||
.hero {
|
||||
right: -13%;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-el-pos-1 {
|
||||
left: 15%;
|
||||
top: 17%;
|
||||
}
|
||||
|
||||
.custom-el-pos-2 {
|
||||
right: 11%;
|
||||
top: 17%;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-el-pos-3 {
|
||||
margin-top: -100px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-col-1 {
|
||||
padding-top: 120px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) and (max-width: 1399px) {
|
||||
.custom-col-1 {
|
||||
padding-top: 500px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-wrapper-1 > .container > .row {
|
||||
min-height: 935px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
text-transform: none;
|
||||
font-size: 2.4em;
|
||||
font-weight: 600;
|
||||
line-height: 1.1em;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
p {
|
||||
line-height: 1.6em;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.max-width-custom-1 {
|
||||
max-width: 485px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes btnDashEffect {
|
||||
0% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
51% {
|
||||
transform: translateX(20px);
|
||||
opacity: 1;
|
||||
}
|
||||
52% {
|
||||
opacity: 0;
|
||||
transform: translateX(-20px);
|
||||
}
|
||||
53% {
|
||||
opacity: 0;
|
||||
}
|
||||
54% {
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-dash:before {
|
||||
content: "";
|
||||
width: 20px;
|
||||
height: 2px;
|
||||
display: inline-block;
|
||||
background: var(--light);
|
||||
margin-right: 10px;
|
||||
position: relative;
|
||||
top: -3px;
|
||||
}
|
||||
|
||||
.btn-dash:hover:before {
|
||||
animation: btnDashEffect ease-out .3s;
|
||||
}
|
||||
|
||||
.btn-dash.text-color-primary:before {
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
#header .header-container {
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 18px;
|
||||
margin-left: 6px !important;
|
||||
margin-right: 6px !important;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li.dropdown-mega .dropdown-mega-content {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1480px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 16px;
|
||||
margin-left: 0px !important;
|
||||
margin-right: 0px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-navigation-custom .nav-tabs .nav-item {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.tabs-navigation-custom .nav-tabs .nav-item .nav-link {
|
||||
border: 0 !important;
|
||||
font-size: 18px;
|
||||
padding-left: 25px !important;
|
||||
}
|
||||
|
||||
.tabs-navigation-custom .nav-tabs .nav-item .nav-link:not(.active) {
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
.tabs-navigation-custom .nav-tabs .nav-item .nav-link:before {
|
||||
content: "";
|
||||
width: 20px;
|
||||
height: 2px;
|
||||
display: inline-block;
|
||||
background: var(--dark);
|
||||
margin-right: 10px;
|
||||
position: relative;
|
||||
top: -3px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.tabs-navigation-custom .nav-tabs .nav-item .nav-link.active:before {
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
.custom-marquee {
|
||||
bottom: -30%;
|
||||
}
|
||||
|
||||
.custom-marquee p {
|
||||
font-size: 500px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.custom-outline-text-style-1 {
|
||||
text-shadow: -1px 1px 0 #000,
1px 1px 0 #000,
1px -1px 0 #000,
-1px -1px 0 #000;
|
||||
letter-spacing: 0;
|
||||
color: var(--light);
|
||||
opacity: 0.08;
|
||||
}
|
||||
1117
resources/assets/css/demos/demo-business-consulting.css
Normal file
1117
resources/assets/css/demos/demo-business-consulting.css
Normal file
File diff suppressed because it is too large
Load Diff
1210
resources/assets/css/demos/demo-church.css
Normal file
1210
resources/assets/css/demos/demo-church.css
Normal file
File diff suppressed because it is too large
Load Diff
569
resources/assets/css/demos/demo-cleaning-services.css
Normal file
569
resources/assets/css/demos/demo-cleaning-services.css
Normal file
@ -0,0 +1,569 @@
|
||||
body {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.container {
|
||||
max-width: 1200px !important;
|
||||
}
|
||||
}
|
||||
|
||||
[class*="text-color-hover-"] {
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
[class*="bg-color-hover-"] {
|
||||
transition: ease background 300ms;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.custom-max-width-1 {
|
||||
max-width: 387px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-font-secondary {
|
||||
font-family: 'Roboto Slab', serif !important;
|
||||
}
|
||||
|
||||
.custom-font-size-1 {
|
||||
font-size: 1.4em !important;
|
||||
}
|
||||
|
||||
.custom-font-size-2 {
|
||||
font-size: 1.35em !important;
|
||||
}
|
||||
|
||||
.custom-font-size-3 {
|
||||
font-size: 1.15em !important;
|
||||
}
|
||||
|
||||
.custom-font-size-4 {
|
||||
font-size: 50% !important;
|
||||
}
|
||||
|
||||
.custom-text-color-1 {
|
||||
color: #93bae4 !important;
|
||||
}
|
||||
|
||||
.box-shadow-1 .card-body {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-box-shadow-1 {
|
||||
box-shadow: 0 0px 90px -55px rgba(0, 0, 0, 0.25) !important;
|
||||
}
|
||||
|
||||
.custom-border-radius-1 {
|
||||
border-radius: 0.5rem !important;
|
||||
}
|
||||
|
||||
.custom-line {
|
||||
display: inline-block;
|
||||
width: 50px;
|
||||
border-bottom: 3px solid var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-card-style-1 {
|
||||
border: 2px solid transparent;
|
||||
transition: ease border 300ms;
|
||||
}
|
||||
|
||||
.custom-card-style-1 .custom-card-style-1-image-wrapper img {
|
||||
transform: translate3d(5px, -5px, 0);
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-card-style-1 .custom-card-style-1-title,
|
||||
.custom-card-style-1 .custom-card-style-1-link {
|
||||
transition: ease color 300ms;
|
||||
}
|
||||
|
||||
.custom-card-style-1:hover .custom-card-style-1-image-wrapper img {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
.owl-carousel {
|
||||
display: block;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.owl-carousel.owl-loaded {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-carousel-box-shadow-1 {
|
||||
position: relative;
|
||||
}
|
||||
.custom-carousel-box-shadow-1:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 65%;
|
||||
height: 0px;
|
||||
box-shadow: 0 0 110px 180px rgba(0, 0, 0, 0.07);
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
z-index: 0;
|
||||
}
|
||||
.custom-carousel-box-shadow-2 {
|
||||
position: relative;
|
||||
}
|
||||
.custom-carousel-box-shadow-2:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 57%;
|
||||
height: 0px;
|
||||
box-shadow: 0 0 160px 240px rgba(0, 0, 0, 0.07);
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
z-index: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-highlight-1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.custom-highlight-1:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 0%;
|
||||
height: 100%;
|
||||
background-color: var(--dark);
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
.customHighlightAnim:after {
|
||||
animation-name: customHighlightAnim;
|
||||
animation-duration: 2s;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
.customHighlightAnimDelay:after {
|
||||
animation-delay: 3s;
|
||||
}
|
||||
|
||||
@keyframes customHighlightAnim {
|
||||
0% {
|
||||
width: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
width: 100%;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.clean-animation-1 svg g:nth-child(1) {
|
||||
animation: cleanAnimation 3s;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.clean-animation-1 svg g:nth-child(2) {
|
||||
animation: cleanAnimation 3s;
|
||||
animation-iteration-count: infinite;
|
||||
animation-delay: 400ms;
|
||||
}
|
||||
|
||||
.clean-animation-1 svg g:nth-child(3) {
|
||||
animation: cleanAnimation 3s;
|
||||
animation-iteration-count: infinite;
|
||||
animation-delay: 800ms;
|
||||
}
|
||||
|
||||
@keyframes cleanAnimation {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: scale(0.8);
|
||||
transform-origin: 50% 50%;
|
||||
}
|
||||
85% {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
transform-origin: 50% 50%;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: scale(1);
|
||||
transform-origin: 50% 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.customLineAnimation {
|
||||
animation-name: customLineAnimation;
|
||||
}
|
||||
|
||||
@keyframes customLineAnimation {
|
||||
0% {
|
||||
width: 0px;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
width: 50px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 2000px) {
|
||||
.shape-divider svg {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-col-half-section.col-half-section {
|
||||
max-width: 727px;
|
||||
}
|
||||
|
||||
.fluid-col-lg-5 .fluid-col {
|
||||
left: 50%;
|
||||
width: 100vw;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.fluid-col-lg-5 {
|
||||
min-height: 0;
|
||||
}
|
||||
.fluid-col-lg-5 .fluid-col {
|
||||
width: calc(44.2vw - 15px);
|
||||
left: 15px;
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.fluid-col-lg-5 {
|
||||
min-height: 400px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
.custom-header-top-btn-style-1 {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-header-top-btn-style-1:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
right: 0;
|
||||
width: calc( 100% + 20px);
|
||||
height: 10px;
|
||||
z-index: 1;
|
||||
background: var(--light);
|
||||
}
|
||||
|
||||
html.sticky-header-active #header .header-top {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
padding: 0 0.8rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
padding: 0 1.3rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Contact Form
|
||||
*/
|
||||
.custom-form-style-1 .form-control {
|
||||
height: calc(1.8em + 1.85rem + 2px);
|
||||
padding: 15.6px 20px;
|
||||
padding: 0.975rem 1.25rem;
|
||||
background: var(--grey-100);
|
||||
border-color: var(--grey-100);
|
||||
line-height: 1.5 !important;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:focus {
|
||||
border-color: var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-webkit-input-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-moz-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:-ms-input-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select {
|
||||
color: #495057;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select option {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select option[selected] {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 textarea.form-control {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.custom-svg-stars {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 100%;
|
||||
width: 300px;
|
||||
opacity: 0.1;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Home Why Choose Us Section - Custom Accordion Style
|
||||
*/
|
||||
.custom-accordion-style-1 > .card {
|
||||
border: 1px solid transparent !important;
|
||||
transition: ease border-color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a {
|
||||
position: relative;
|
||||
padding: 23px 30px;
|
||||
background-color: var(--light);
|
||||
transition: ease background-color 300ms, ease color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a:after {
|
||||
content: '+';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 25px;
|
||||
font-size: inherit;
|
||||
font-weight: inherit;
|
||||
transform: translate3d(0, -50%, 0) rotate(45deg);
|
||||
transform-origin: 50% 50%;
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a.collapsed:after {
|
||||
transform: translate3d(0, -50%, 0) rotate(0deg);
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card + .card {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Home Section Our Process - Custom Featured Icon
|
||||
*/
|
||||
.custom-featured-icon-wrapper {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 110px;
|
||||
height: 110px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.custom-featured-icon-wrapper .icon-featured {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Home Section Happy Clients - Custom Testimonial
|
||||
*/
|
||||
.testimonial.testimonial-style-3.custom-testimonial-style-1 blockquote {
|
||||
background: #FFF !important;
|
||||
padding: 45px 40px 35px 40px;
|
||||
}
|
||||
|
||||
.testimonial.testimonial-style-3.custom-testimonial-style-1 blockquote:before {
|
||||
content: '\f10d';
|
||||
font-family: "Font Awesome 6 Free";
|
||||
font-weight: 900;
|
||||
font-size: 19.2px;
|
||||
font-size: 1.2rem;
|
||||
top: 15px;
|
||||
left: 15px;
|
||||
}
|
||||
|
||||
.testimonial.testimonial-style-3.custom-testimonial-style-1 .testimonial-author {
|
||||
margin: 19px 0 0 0;
|
||||
}
|
||||
|
||||
.testimonial.testimonial-style-3.custom-testimonial-style-1 .testimonial-author img {
|
||||
max-width: 67px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Portfolio Detail
|
||||
*/
|
||||
.custom-list-icons-icon-size li {
|
||||
padding-left: 50px !important;
|
||||
}
|
||||
|
||||
.custom-list-icons-icon-size li > [class*="fa-"]:first-child,
|
||||
.custom-list-icons-icon-size li > .icons:first-child, .custom-list-icons-icon-size li a:first-child > [class*="fa-"]:first-child,
|
||||
.custom-list-icons-icon-size li a:first-child > .icons:first-child {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 40px !important;
|
||||
height: 40px !important;
|
||||
font-size: 14.4px !important;
|
||||
font-size: 0.9rem !important;
|
||||
top: 1px !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Services Detail
|
||||
*/
|
||||
.custom-nav-list-effect-1 > li > a {
|
||||
position: relative;
|
||||
transition: ease padding 300ms, ease color 300ms;
|
||||
}
|
||||
|
||||
.custom-nav-list-effect-1 > li > a:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: 6px solid transparent;
|
||||
border-bottom: 6px solid transparent;
|
||||
border-left: 6px solid var(--grey-500);
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
transition: ease opacity 300ms;
|
||||
}
|
||||
|
||||
.custom-nav-list-effect-1 > li.active > a, .custom-nav-list-effect-1 > li.open > a, .custom-nav-list-effect-1 > li:hover > a {
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.custom-nav-list-effect-1 > li.active > a:before, .custom-nav-list-effect-1 > li.open > a:before, .custom-nav-list-effect-1 > li:hover > a:before {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
/*
|
||||
* Blog
|
||||
*/
|
||||
.blog-sidebar .form-control.bg-color-grey {
|
||||
background-color: var(--light) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer p, #footer a:not(.btn), #footer span, #footer li, #footer .footer-copyright p {
|
||||
color: #a3b2c7;
|
||||
}
|
||||
|
||||
#footer .social-icons li a {
|
||||
color: #a3b2c7 !important;
|
||||
}
|
||||
|
||||
#footer .social-icons li:hover a {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
#footer a:not(.btn):not(.no-footer-css) {
|
||||
color: #a3b2c7;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
.custom-svg-fill-color-tertiary {
|
||||
fill: var(--tertiary);
|
||||
}
|
||||
|
||||
.custom-svg-fill-color-tertiary-darken {
|
||||
fill: var(--tertiary-100);
|
||||
}
|
||||
|
||||
.custom-highlight-1.custom-highlight-1-primary:after {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-line {
|
||||
border-bottom-color: var(--primary);
|
||||
}
|
||||
|
||||
.owl-carousel.nav-arrows-1 .owl-nav .owl-prev, .owl-carousel.nav-arrows-1 .owl-nav .owl-next {
|
||||
color: var(--secondary);
|
||||
}
|
||||
|
||||
.custom-card-style-1:hover {
|
||||
border-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-card-style-1:hover .custom-card-style-1-title {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-card-style-1:hover .custom-card-style-1-link {
|
||||
color: var(--secondary) !important;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a:not(.collapsed) {
|
||||
color: var(--primary-inverse) !important;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a.collapsed {
|
||||
background-color: var(--primary-inverse);
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card:hover {
|
||||
border-color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card:hover .card-header a.collapsed {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-social-icons li a {
|
||||
background: var(--secondary);
|
||||
}
|
||||
|
||||
.custom-social-icons li a i {
|
||||
color: var(--secondary-inverse);
|
||||
}
|
||||
|
||||
.testimonial.testimonial-style-3.custom-testimonial-style-1 blockquote:before {
|
||||
color: var(--tertiary);
|
||||
}
|
||||
|
||||
.custom-nav-list-effect-1 > li > a:before {
|
||||
border-left-color: var(--primary);
|
||||
border-right-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-nav-list-effect-1 > li.active > a, .custom-nav-list-effect-1 > li.open > a, .custom-nav-list-effect-1 > li:hover > a {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.blog-sidebar button.bg-color-grey {
|
||||
background-color: var(--primary) !important;
|
||||
color: var(--primary-inverse) !important;
|
||||
}
|
||||
155
resources/assets/css/demos/demo-coffee.css
Normal file
155
resources/assets/css/demos/demo-coffee.css
Normal file
@ -0,0 +1,155 @@
|
||||
body {
|
||||
font-family: 'Poppins', sans-serif;
|
||||
}
|
||||
|
||||
.custom-primary-font {
|
||||
font-family: 'Poppins', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-secondary-font {
|
||||
font-family: 'Poppins', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-tertiary-font {
|
||||
font-family: 'Playfair Display', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-bg-color-1 {
|
||||
background-color: #F6F3EF !important;
|
||||
}
|
||||
|
||||
.custom-h-1 {
|
||||
height: 4px !important;
|
||||
}
|
||||
|
||||
@keyframes customFadeInRightShorter {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translate(-50px, -50%);
|
||||
}
|
||||
to {
|
||||
opacity: 0.1;
|
||||
transform: translate(0, -50%);
|
||||
}
|
||||
}
|
||||
|
||||
.customFadeInRightShorter {
|
||||
animation-name: customFadeInRightShorter;
|
||||
}
|
||||
|
||||
@keyframes customHeaderAnimOne {
|
||||
from {
|
||||
height: 100%;
|
||||
}
|
||||
to {
|
||||
height: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.customHeaderAnimOne:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 0;
|
||||
background: var(--light);
|
||||
animation-name: customHeaderAnimOne;
|
||||
animation-duration: inherit;
|
||||
animation-fill-mode: inherit;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details {
|
||||
display: flex;
|
||||
justify-content: between;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-title,
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-price {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-price strong {
|
||||
font-size: 20.8px;
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-price strong > span {
|
||||
font-size: 0.6em;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-line {
|
||||
width: 100%;
|
||||
border-bottom: dashed 1px #777;
|
||||
}
|
||||
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-family: 'Poppins', sans-serif;
|
||||
font-size: 14.4px;
|
||||
font-size: 0.9rem;
|
||||
letter-spacing: 0;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
html.sticky-header-active .header-logo img {
|
||||
width: 140px;
|
||||
height: auto;
|
||||
top: 16px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-section-halfbar-bg {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0;
|
||||
width: 50vw;
|
||||
height: 40%;
|
||||
border-radius: 10px 0 0 10px;
|
||||
background: var(--grey-500);
|
||||
opacity: 0.1;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-section-halfbar-bg {
|
||||
height: 20%;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-column-bg {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-column-bg:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0;
|
||||
width: 50vw;
|
||||
height: 100%;
|
||||
border-radius: 0 10px 10px 0;
|
||||
background: var(--dark);
|
||||
opacity: 0.6;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-column-bg:before {
|
||||
width: 100%;
|
||||
border-radius: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-column-bg:before {
|
||||
width: calc(100% - 30px);
|
||||
margin-right: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
.custom-section-halfbar-bg {
|
||||
background: var(--primary);
|
||||
}
|
||||
521
resources/assets/css/demos/demo-construction-2.css
Normal file
521
resources/assets/css/demos/demo-construction-2.css
Normal file
@ -0,0 +1,521 @@
|
||||
body {
|
||||
font-family: "Poppins", sans-serif !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Col
|
||||
*/
|
||||
@media (min-width: 1400px) {
|
||||
.custom-col {
|
||||
flex: 79% !important;
|
||||
max-width: 79% !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1900px) {
|
||||
.custom-col {
|
||||
flex: 74.5% !important;
|
||||
max-width: 74.5% !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Btn White
|
||||
*/
|
||||
.custom-btn-white {
|
||||
border-color: var(--light) !important;
|
||||
border-width: 3px !important;
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
.custom-btn-white:hover {
|
||||
background-color: var(--light) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Btn
|
||||
*/
|
||||
.custom-btn {
|
||||
border-width: 1px !important;
|
||||
border-color: var(--grey-500) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
#header .dropdown-item {
|
||||
text-transform: capitalize !important;
|
||||
font-size: 15px !important;
|
||||
}
|
||||
|
||||
#header .simple-search .form-control {
|
||||
border-radius: 1.3rem 0 0 1.3rem !important;
|
||||
}
|
||||
|
||||
#header .header-nav-features-light:before, #header .header-nav-features-light:after {
|
||||
content: none !important;
|
||||
}
|
||||
|
||||
#header .header-container {
|
||||
height: 113px;
|
||||
}
|
||||
|
||||
#header .header-top {
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Carousel Slider Navigation
|
||||
*/
|
||||
[data-carousel-navigate] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
[data-carousel-navigate] p {
|
||||
line-height: 26px !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
[data-carousel-navigate].active:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 3px;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Page Header
|
||||
*/
|
||||
.custom-page-header.page-header-background-sm {
|
||||
padding: 95px 0 !important;
|
||||
}
|
||||
|
||||
.custom-page-header .parallax-background {
|
||||
height: 150% !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Portfolio
|
||||
*/
|
||||
.load-more-loader {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.portfolio-load-more-loader {
|
||||
min-height: 61px;
|
||||
}
|
||||
|
||||
.load-more-btn-wrapper {
|
||||
min-height: 53px;
|
||||
}
|
||||
|
||||
.custom-portfolio .nav-link {
|
||||
font-weight: 600;
|
||||
padding: 8px 23px;
|
||||
font-size: 12.32px;
|
||||
font-size: 0.77rem;
|
||||
}
|
||||
|
||||
.custom-portfolio .nav-item {
|
||||
margin-right: 1px;
|
||||
}
|
||||
|
||||
.custom-portfolio .nav-item:hover .nav-link {
|
||||
color: var(--light);
|
||||
}
|
||||
|
||||
.custom-thumb-info.thumb-info {
|
||||
max-width: 80% !important;
|
||||
border-radius: 100% !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Img
|
||||
*/
|
||||
.custom-img {
|
||||
box-shadow: 0 0 50px rgba(0, 0, 0, 0.07);
|
||||
border-radius: 1%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Line Height
|
||||
*/
|
||||
.custom-line-height {
|
||||
line-height: 12.8px !important;
|
||||
line-height: 0.8rem !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Featured Box
|
||||
*/
|
||||
.custom-featured-box .icon-featured {
|
||||
width: 100px !important;
|
||||
height: 100px !important;
|
||||
display: flex !important;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.custom-featured-box .icon-featured:before {
|
||||
transform: scale(1) !important;
|
||||
}
|
||||
|
||||
.custom-featured-box:hover .icon-featured:before {
|
||||
transform: scale(1.2) !important;
|
||||
}
|
||||
|
||||
.custom-featured-box i {
|
||||
margin-top: auto !important;
|
||||
margin-bottom: auto !important;
|
||||
}
|
||||
|
||||
.custom-featured-box i::before {
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Max Width
|
||||
*/
|
||||
.max-w-90 {
|
||||
max-width: 90%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Img About
|
||||
*/
|
||||
.custom-img-about {
|
||||
right: 0;
|
||||
top: 12%;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-img-about {
|
||||
max-width: 45%;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Breadcrumb
|
||||
*/
|
||||
.custom-breadcrumb li, .custom-breadcrumb a {
|
||||
color: var(--default) 77 !important;
|
||||
}
|
||||
|
||||
.custom-breadcrumb > li + li:before {
|
||||
content: "/" !important;
|
||||
font-size: 17.6px;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
/*
|
||||
* Cards
|
||||
*/
|
||||
.custom-card:hover {
|
||||
box-shadow: 0px 0px 20px -5px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.custom-card:hover:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 0;
|
||||
height: 3px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.custom-card .icon-animated {
|
||||
max-width: 80px;
|
||||
}
|
||||
|
||||
/*
|
||||
* HR
|
||||
*/
|
||||
.custom-hr {
|
||||
background: var(--grey-500) !important;
|
||||
width: 140%;
|
||||
margin-left: -20%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Card
|
||||
*/
|
||||
.custom-card-style-2 {
|
||||
box-shadow: 0px 0px 35px -5px rgba(0, 0, 0, 0.1);
|
||||
border-left: 1px solid #e8e8e8;
|
||||
border-bottom: 1px solid #e8e8e8;
|
||||
border-right: 1px solid #e8e8e8;
|
||||
margin-top: 16px;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.custom-card-style-2 h3, .custom-card-style-2 h4 {
|
||||
letter-spacing: inherit;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.custom-card-style-2 hr {
|
||||
background: rgba(0, 0, 0, 0.15) !important;
|
||||
}
|
||||
|
||||
.custom-card-style-2:before {
|
||||
content: "";
|
||||
display: block;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 3px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.custom-card-style-2.card-contact-us {
|
||||
margin-top: 6.4px !important;
|
||||
margin-top: 0.4rem !important;
|
||||
}
|
||||
|
||||
.custom-card-style-3 {
|
||||
border: 1px solid var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-card-style-3 h4 {
|
||||
letter-spacing: inherit;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.custom-card-style-3:hover {
|
||||
cursor: pointer;
|
||||
box-shadow: 0px 0px 20px -5px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
/*
|
||||
* Map
|
||||
*/
|
||||
.custom-map {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Tabs
|
||||
*/
|
||||
.custom-tabs {
|
||||
margin-bottom: 50px !important;
|
||||
}
|
||||
|
||||
.custom-tabs .nav-item.active .nav-link, .custom-tabs .nav-item:hover .nav-link {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
.custom-tabs .nav-item .nav-link {
|
||||
font-weight: 600;
|
||||
border: none !important;
|
||||
padding: 12px 24px !important;
|
||||
padding: 0.75rem 1.5rem !important;
|
||||
}
|
||||
|
||||
.custom-tabs .nav-item .nav-link:before {
|
||||
content: none !important;
|
||||
}
|
||||
|
||||
.custom-tabs .nav-item .nav-link:hover {
|
||||
padding: 12px 24px !important;
|
||||
padding: 0.75rem 1.5rem !important;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Contact Form
|
||||
*/
|
||||
.custom-form-style-1 .form-control {
|
||||
border: 0;
|
||||
padding: 19.2px;
|
||||
padding: 1.2rem;
|
||||
box-shadow: none !important;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/*
|
||||
* Progress Bar
|
||||
*/
|
||||
.custom-progress-bar.progress {
|
||||
background-color: var(--grey-500) ccc;
|
||||
border-radius: 25px !important;
|
||||
height: 8px !important;
|
||||
padding-left: 0;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.custom-progress-bar .progress-bar {
|
||||
border-radius: 25px !important;
|
||||
}
|
||||
|
||||
.custom-progress-bar .progress-bar-tooltip {
|
||||
color: var(--default) !important;
|
||||
background-color: transparent !important;
|
||||
font-size: 14px;
|
||||
right: -10px;
|
||||
}
|
||||
|
||||
.custom-progress-bar .progress-bar-tooltip::after {
|
||||
content: none !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Testimonial
|
||||
*/
|
||||
.custom-testimonial blockquote {
|
||||
background: transparent !important;
|
||||
padding: 11.2px 28.8px;
|
||||
padding: 0.7rem 1.8rem;
|
||||
}
|
||||
|
||||
.custom-testimonial blockquote:before, .custom-testimonial blockquote:after {
|
||||
font-family: "Font Awesome 6 Free";
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.custom-testimonial blockquote:before {
|
||||
content: "\f10d";
|
||||
font-size: 17px !important;
|
||||
left: -12px !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Owl Carousel - Custom Dots
|
||||
*/
|
||||
.owl-carousel.custom-dots .owl-dots {
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots button.owl-dot span {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border: 2px solid;
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots button.owl-dot.active span, .owl-carousel.custom-dots button.owl-dot:hover span {
|
||||
position: relative;
|
||||
border: 2px solid;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots button.owl-dot.active span:before, .owl-carousel.custom-dots button.owl-dot:hover span:before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
border-radius: 100%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots button.owl-dot:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Angled
|
||||
*/
|
||||
.custom-angled .section-angled-layer-bottom,
|
||||
.custom-angled .section-angled-layer-top {
|
||||
padding: 72px 0 !important;
|
||||
padding: 4.5rem 0 !important;
|
||||
}
|
||||
|
||||
.custom-angled:not(.section-angled-reverse) .section-angled-layer-top {
|
||||
transform: skewY(-3deg) translate3d(0, -50%, 0) !important;
|
||||
}
|
||||
|
||||
.custom-angled:not(.section-angled-reverse) .section-angled-layer-bottom {
|
||||
transform: skewY(3deg) translate3d(0, 50%, 0) !important;
|
||||
}
|
||||
|
||||
.custom-angled.section-angled-reverse .section-angled-layer-top {
|
||||
transform: skewY(3deg) translate3d(0, -50%, 0) !important;
|
||||
}
|
||||
|
||||
.custom-angled.section-angled-reverse .section-angled-layer-bottom {
|
||||
transform: skewY(-3deg) translate3d(0, 50%, 0) !important;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
a.text-primary:hover {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
a.text-secondary:hover {
|
||||
color: var(--secondary) !important;
|
||||
}
|
||||
|
||||
a.text-tertiary:hover {
|
||||
color: var(--tertiary) !important;
|
||||
}
|
||||
|
||||
.custom-btn:hover {
|
||||
border-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-button-white:hover {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-portfolio .nav-link {
|
||||
color: var(--secondary);
|
||||
}
|
||||
|
||||
.custom-portfolio .nav-item:hover {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
[data-carousel-navigate]:hover h4, [data-carousel-navigate].active h4 {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
[data-carousel-navigate]:hover:before, [data-carousel-navigate].active:before {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
/*
|
||||
* Cards
|
||||
*/
|
||||
.custom-card:hover:before {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-card-style-2:before {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
/*
|
||||
* Testimonial
|
||||
*/
|
||||
.custom-testimonial blockquote:before {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Tabs
|
||||
*/
|
||||
.custom-tabs .nav-item.active, .custom-tabs .nav-item:hover {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-tabs .nav-item .nav-link {
|
||||
color: var(--secondary) !important;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots button.owl-dot span {
|
||||
border-color: var(--quaternary);
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots button.owl-dot.active span, .owl-carousel.custom-dots button.owl-dot:hover span {
|
||||
border-color: var(--secondary);
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots button.owl-dot.active span:before, .owl-carousel.custom-dots button.owl-dot:hover span:before {
|
||||
background: var(--secondary);
|
||||
}
|
||||
655
resources/assets/css/demos/demo-construction.css
Normal file
655
resources/assets/css/demos/demo-construction.css
Normal file
@ -0,0 +1,655 @@
|
||||
/*
|
||||
* General
|
||||
*/
|
||||
.custom-big-text-style-1 {
|
||||
font-size: 137.6px;
|
||||
font-size: 8.6rem;
|
||||
letter-spacing: 5px;
|
||||
line-height: 0.85;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-big-text-style-1 {
|
||||
font-size: 7.8rem;
|
||||
}
|
||||
.custom-big-text-style-1.custom-big-text-style-1-variation {
|
||||
font-size: 5.8rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-big-text-style-1 {
|
||||
font-size: 5.6rem;
|
||||
}
|
||||
.custom-big-text-style-1.custom-big-text-style-1-variation {
|
||||
font-size: 4rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-big-text-style-1 {
|
||||
font-size: 4.3rem;
|
||||
}
|
||||
.custom-big-text-style-1.custom-big-text-style-1-variation {
|
||||
font-size: 2.7rem;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-outline-text-style-1 {
|
||||
-webkit-text-fill-color: transparent;
|
||||
-webkit-text-stroke-color: white;
|
||||
-webkit-text-stroke-width: 0.3px;
|
||||
letter-spacing: 5px;
|
||||
}
|
||||
|
||||
.custom-view-more svg {
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-view-more:hover svg {
|
||||
transform: translate3d(7px, 0, 0);
|
||||
}
|
||||
|
||||
/*
|
||||
* Spacement
|
||||
*/
|
||||
.custom-margin-1 {
|
||||
margin-top: 73.6px !important;
|
||||
margin-top: 4.6rem !important;
|
||||
margin-bottom: 73.6px !important;
|
||||
margin-bottom: 4.6rem !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Square
|
||||
*/
|
||||
.custom-square-1 {
|
||||
width: 216px;
|
||||
height: 216px;
|
||||
background-color: var(--grey-500);
|
||||
transform: rotate(48deg);
|
||||
transform-origin: 0% 100%;
|
||||
}
|
||||
|
||||
.custom-square-1.custom-square-1-big {
|
||||
width: 626px;
|
||||
height: 626px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom SVG Position
|
||||
*/
|
||||
.custom-svg-position-1 {
|
||||
position: absolute;
|
||||
top: -38px;
|
||||
left: -90px;
|
||||
max-height: none;
|
||||
width: 50vw;
|
||||
}
|
||||
|
||||
.custom-svg-position-1 > svg {
|
||||
height: 5.3vw;
|
||||
min-height: 96px;
|
||||
}
|
||||
|
||||
@media (min-width: 1950px) {
|
||||
.custom-svg-position-1 {
|
||||
left: -121px;
|
||||
width: 51vw;
|
||||
top: -41px !important;
|
||||
}
|
||||
.custom-svg-position-1 > svg {
|
||||
height: 110px;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Navigation Buttons
|
||||
*/
|
||||
.custom-navigation-buttons-1 > a {
|
||||
position: relative;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.custom-navigation-buttons-1 > a:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
transform: rotate(45deg);
|
||||
transition: ease background 300ms;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-navigation-buttons-1 > a:hover:before {
|
||||
background: rgba(0, 0, 0, 0.8);
|
||||
}
|
||||
|
||||
/*
|
||||
* Font Size
|
||||
*/
|
||||
.custom-font-size-1 {
|
||||
font-size: 0.6em;
|
||||
}
|
||||
|
||||
/*
|
||||
* SVG Line Divider
|
||||
*/
|
||||
@keyframes customLineDividerAnim {
|
||||
from {
|
||||
stroke-dasharray: 170;
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
to {
|
||||
stroke-dasharray: 170;
|
||||
stroke-dashoffset: -170;
|
||||
}
|
||||
}
|
||||
|
||||
.customLineDividerAnim {
|
||||
animation-name: customLineDividerAnim;
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
html #header .header-body {
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
html #header .header-logo.custom-header-logo {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
html #header .header-logo.custom-header-logo:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -87px;
|
||||
left: 40px;
|
||||
width: 170px;
|
||||
height: 350px;
|
||||
background-color: var(--grey-500);
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
transform: rotate(45deg);
|
||||
transition: ease opacity 300ms, ease transform 300ms;
|
||||
}
|
||||
|
||||
html #header .header-logo .logo {
|
||||
transition: ease opacity 300ms, ease transform 300ms;
|
||||
}
|
||||
|
||||
html #header .header-logo .logo-sticky {
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transition: ease opacity 300ms, ease transform 300ms;
|
||||
}
|
||||
|
||||
html #header .header-container {
|
||||
height: 120px;
|
||||
transition: ease height 300ms;
|
||||
}
|
||||
|
||||
html #header .header-nav-main nav > ul > li > a {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
html #header .header-nav-main nav > ul > li > a {
|
||||
padding: 0 1.1rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
html #header .header-nav-features:before,
|
||||
html #header .header-nav-features:after {
|
||||
background: rgba(0, 0, 0, 0.04);
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
html.sticky-header-active #header .header-body {
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
html.sticky-header-active #header .header-logo.custom-header-logo {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
html.sticky-header-active #header .header-logo.custom-header-logo:before {
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transform: rotate(45deg) translate3d(0, -20px, 0);
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
html.sticky-header-active #header .header-logo .logo {
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transform: translate3d(20px, -20px, 0);
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
html.sticky-header-active #header .header-logo .logo-sticky {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
transform: translate3d(-100%, 0, 0);
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
html.sticky-header-active #header .header-container {
|
||||
height: 90px;
|
||||
}
|
||||
|
||||
html:not(.sticky-header-active) #header.header-semi-transparent-light .header-body {
|
||||
background-color: var(--light) !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
html:not(.sticky-header-active) #header .header-body {
|
||||
transform: translate3d(0, 50px, 0);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
html #header .header-nav-main nav > ul > li.dropdown .dropdown-menu {
|
||||
border-top: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) and (max-width: 1199px) {
|
||||
html #header .header-nav-main nav > ul > li > a {
|
||||
padding: 0 0.5rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
html #header .header-logo.custom-header-logo:before {
|
||||
content: none;
|
||||
}
|
||||
html #header .header-logo .logo {
|
||||
display: none;
|
||||
}
|
||||
html #header .header-logo .logo-sticky {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
transform: translate3d(0, 0, 0) !important;
|
||||
}
|
||||
html #header .header-nav-main nav > ul > li > a {
|
||||
text-transform: none;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Diamonds SVG Line
|
||||
*/
|
||||
@keyframes customDiamondsLineAnim {
|
||||
from {
|
||||
stroke-dasharray: 1330;
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
to {
|
||||
stroke-dasharray: 1330;
|
||||
stroke-dashoffset: -1300;
|
||||
}
|
||||
}
|
||||
|
||||
.customDiamondsLineAnim {
|
||||
animation-name: customDiamondsLineAnim;
|
||||
}
|
||||
|
||||
/*
|
||||
* Diamonds
|
||||
*/
|
||||
.diamonds {
|
||||
font-size: 0;
|
||||
margin: 40px auto 85px;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 50px 0 0 57px;
|
||||
}
|
||||
|
||||
.diamonds > li {
|
||||
display: inline-block;
|
||||
font-size: 18px;
|
||||
margin-right: 135px;
|
||||
}
|
||||
|
||||
.diamonds .diamond {
|
||||
background: transparent;
|
||||
display: block;
|
||||
height: 243px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
text-decoration: none;
|
||||
width: 245px;
|
||||
overflow: hidden;
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
|
||||
.diamonds .diamond:after {
|
||||
transition: all 0.2s ease;
|
||||
content: " ";
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: #000;
|
||||
opacity: 0;
|
||||
transform: scale(0);
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.diamonds .diamond:before {
|
||||
transition: all 0.2s ease;
|
||||
color: var(--light);
|
||||
content: "\e091";
|
||||
font-family: "simple-line-icons";
|
||||
font-size: 28px;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
opacity: 0;
|
||||
z-index: 1000;
|
||||
transform-origin: 50% 50%;
|
||||
transform: translate3d(-50%, -50%, 0) rotate(45deg) scale(2);
|
||||
}
|
||||
|
||||
.diamonds .diamond:hover:after {
|
||||
opacity: 0.3;
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
.diamonds .diamond:hover:before {
|
||||
opacity: 1;
|
||||
transform: translate3d(-50%, -50%, 0) rotate(45deg) scale(1);
|
||||
}
|
||||
|
||||
.diamonds .content {
|
||||
display: table-cell;
|
||||
height: 255px;
|
||||
padding: 0 8px 0 6px;
|
||||
transform: rotate(45deg);
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
width: 255px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.diamonds .content img {
|
||||
max-width: 375px;
|
||||
margin-left: -50%;
|
||||
}
|
||||
|
||||
.diamonds .diamond-sm {
|
||||
height: 123px;
|
||||
width: 123px;
|
||||
}
|
||||
|
||||
.diamonds .diamond-sm .content {
|
||||
height: 123px;
|
||||
width: 123px;
|
||||
}
|
||||
|
||||
.diamonds .diamond-sm .content:after {
|
||||
left: 24%;
|
||||
top: 48%;
|
||||
}
|
||||
|
||||
@media (min-width: 1199px) {
|
||||
.diamonds > li:nth-child(3) {
|
||||
margin-right: 0;
|
||||
}
|
||||
.diamonds > li:nth-child(4) {
|
||||
right: 143px;
|
||||
top: 9px;
|
||||
position: absolute;
|
||||
}
|
||||
.diamonds > li:nth-child(5) {
|
||||
margin-left: 516px;
|
||||
margin-top: -70px;
|
||||
}
|
||||
.diamonds > li:nth-child(6) {
|
||||
position: absolute;
|
||||
margin: -8px 0 0 -27px;
|
||||
right: -14px;
|
||||
}
|
||||
.diamonds > li:nth-child(7) {
|
||||
position: absolute;
|
||||
margin: 93px 0 0 -133px;
|
||||
right: 90px;
|
||||
}
|
||||
.diamonds .diamond-sm {
|
||||
height: 123px;
|
||||
width: 123px;
|
||||
}
|
||||
.diamonds .diamond-sm .content {
|
||||
height: 123px;
|
||||
width: 123px;
|
||||
}
|
||||
.diamonds .diamond-sm .content img {
|
||||
max-width: 195px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1198px) {
|
||||
.diamonds {
|
||||
text-align: center;
|
||||
width: 748px;
|
||||
margin: 0 auto;
|
||||
padding: 75px 0 0 75px;
|
||||
}
|
||||
.diamonds::after {
|
||||
clear: both;
|
||||
content: "";
|
||||
display: block;
|
||||
}
|
||||
.diamonds > li {
|
||||
margin: 0;
|
||||
position: static;
|
||||
float: left;
|
||||
}
|
||||
.diamonds > li:nth-child(2n+2) {
|
||||
margin-bottom: -50px;
|
||||
margin-left: 55px;
|
||||
margin-top: 200px;
|
||||
}
|
||||
.diamonds > li:nth-child(2n+1) {
|
||||
clear: both;
|
||||
}
|
||||
.diamonds > li:nth-child(4) {
|
||||
float: left;
|
||||
}
|
||||
.diamonds > li:nth-child(5), .diamonds > li:nth-child(6), .diamonds > li:nth-child(7) {
|
||||
float: right;
|
||||
}
|
||||
.diamonds > li:nth-child(7) {
|
||||
margin-top: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 748px) {
|
||||
.diamonds {
|
||||
margin: 0 auto;
|
||||
padding: 25px 0 0 0;
|
||||
text-align: center;
|
||||
width: 445px;
|
||||
}
|
||||
.diamonds > li {
|
||||
float: none !important;
|
||||
clear: both !important;
|
||||
margin: 45px 0 115px 95px !important;
|
||||
display: block;
|
||||
}
|
||||
.diamonds > li:nth-child(4), .diamonds > li:nth-child(6), .diamonds > li:nth-child(7) {
|
||||
margin-left: 158px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.diamonds-wrapper {
|
||||
min-height: 2290px;
|
||||
}
|
||||
.diamonds-wrapper .diamonds {
|
||||
margin: 0 auto;
|
||||
padding: 25px 0 0;
|
||||
text-align: center;
|
||||
width: 445px;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
margin-left: -222px;
|
||||
}
|
||||
.diamonds-wrapper .diamonds .diamond {
|
||||
margin: 130px auto 0;
|
||||
}
|
||||
.diamonds-wrapper .diamonds > li {
|
||||
text-align: center;
|
||||
margin: 0 !important;
|
||||
}
|
||||
.diamonds-wrapper .diamonds > li:first-child .diamond {
|
||||
margin-top: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Testimonials
|
||||
*/
|
||||
.testimonial.testimonial-with-quotes.custom-testimonial-quote-position-1 blockquote:before {
|
||||
left: -28px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Tabs
|
||||
*/
|
||||
.tabs.tabs-simple .nav-tabs > li .nav-link:not(.active) {
|
||||
border-bottom: 0 !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Accordion
|
||||
*/
|
||||
.custom-accordion-style-1 > .card {
|
||||
border: 1px solid transparent !important;
|
||||
transition: ease border-color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a {
|
||||
position: relative;
|
||||
padding: 23px 30px;
|
||||
background-color: #f4f4f4;
|
||||
transition: ease background-color 300ms, ease color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a:after {
|
||||
content: '+';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 25px;
|
||||
font-size: inherit;
|
||||
font-weight: inherit;
|
||||
transform: translate3d(0, -50%, 0) rotate(45deg);
|
||||
transform-origin: 50% 50%;
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a.collapsed:after {
|
||||
transform: translate3d(0, -50%, 0) rotate(0deg);
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header + .collapse.show,
|
||||
.custom-accordion-style-1 > .card .card-header + .collapsing {
|
||||
background: #f4f4f4;
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card + .card {
|
||||
margin-top: 17px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Process
|
||||
*/
|
||||
.custom-process-style-1.process.process-vertical .process-step-circle {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border-color: var(--grey-500);
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.custom-process-style-1.process.process-vertical .process-step:after {
|
||||
width: 3px;
|
||||
height: calc(100% - 110px);
|
||||
top: 95px;
|
||||
left: 39px;
|
||||
background-color: #d4d4d4;
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer {
|
||||
background: #f4f4f4;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
html #header .header-logo.custom-header-logo:before {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
/*
|
||||
* Sticky Sidebar
|
||||
*/
|
||||
#sidebar a.active {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Thumb Gallery Wrapper
|
||||
*/
|
||||
.thumb-gallery-wrapper .thumb-gallery-thumbs .owl-item:hover,
|
||||
.thumb-gallery-wrapper .thumb-gallery-thumbs .owl-item.selected {
|
||||
border-color: var(--primary) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Accordion
|
||||
*/
|
||||
.custom-accordion-style-1 > .card .card-header a:not(.collapsed) {
|
||||
background-color: var(--primary);
|
||||
color: var(--primary-inverse) !important;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card:hover .card-header a.collapsed {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Process
|
||||
*/
|
||||
.custom-process-style-1.process.process-vertical .process-step-circle .process-step-circle-content {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-process-style-1.process.process-vertical .process-step:hover .process-step-circle {
|
||||
border-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-process-style-1.process.process-vertical .process-step:hover .process-step-circle .process-step-circle-content {
|
||||
color: var(--primary-inverse);
|
||||
}
|
||||
1211
resources/assets/css/demos/demo-creative-agency-1.css
Normal file
1211
resources/assets/css/demos/demo-creative-agency-1.css
Normal file
File diff suppressed because it is too large
Load Diff
395
resources/assets/css/demos/demo-creative-agency-2.css
Normal file
395
resources/assets/css/demos/demo-creative-agency-2.css
Normal file
@ -0,0 +1,395 @@
|
||||
/* Body */
|
||||
.body {
|
||||
max-width: 100vw;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
/* Container */
|
||||
@media (min-width: 1440px) {
|
||||
.container {
|
||||
max-width: 1440px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Header */
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
padding-left: 1.3rem !important;
|
||||
padding-right: 1.3rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1280px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
padding-left: 1rem !important;
|
||||
padding-right: 1rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Font Size */
|
||||
.custom-font-size-1 {
|
||||
font-size: clamp(28px, 4px + 0.05 * 100vw, 64px);
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
/* Hero */
|
||||
.custom-hero-bg {
|
||||
position: absolute;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
transition: opacity 300ms;
|
||||
}
|
||||
|
||||
.custom-hero-bg svg {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.custom-hero-bg:after {
|
||||
content: "";
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
position: absolute;
|
||||
opacity: 0.8;
|
||||
background-color: var(--dark);
|
||||
}
|
||||
|
||||
.custom-hero-bg.loaded {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.custom-stop-color-1 {
|
||||
stop-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-hero-font-1 {
|
||||
font-size: clamp(28px, 0px + 0.0583333333 * 100vw, 70px);
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
.custom-hero-heading {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
bottom: 0;
|
||||
text-align: center;
|
||||
-webkit-mask-image: linear-gradient(to bottom, black 0%, rgba(0, 0, 0, 0) 100%);
|
||||
mask-image: linear-gradient(to bottom, black 0%, rgba(0, 0, 0, 0) 100%);
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-hero-heading {
|
||||
bottom: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-hero-heading strong {
|
||||
text-transform: uppercase;
|
||||
font-size: 13cqw;
|
||||
line-height: 13cqw;
|
||||
}
|
||||
|
||||
/* Page Header */
|
||||
.page-header .custom-hero-bg {
|
||||
height: 500px;
|
||||
}
|
||||
|
||||
.page-header .custom-hero-bg svg {
|
||||
height: 500px;
|
||||
}
|
||||
|
||||
@keyframes arrowMove {
|
||||
0% {
|
||||
margin-top: 0;
|
||||
}
|
||||
50% {
|
||||
margin-top: -30px;
|
||||
}
|
||||
100% {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* Elements */
|
||||
.custom-el-1 {
|
||||
opacity: 0.1;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
animation: arrowMove 3000ms linear;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.custom-el-1 img {
|
||||
margin-bottom: -100px;
|
||||
}
|
||||
|
||||
.custom-el-pos-1 {
|
||||
top: 55%;
|
||||
left: -60px;
|
||||
}
|
||||
|
||||
.custom-el-2 {
|
||||
opacity: 0.1;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
animation: arrowMove 3000ms linear;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.custom-el-2 img {
|
||||
margin-bottom: -47px;
|
||||
}
|
||||
|
||||
.custom-el-pos-2 {
|
||||
top: 80%;
|
||||
right: -30px;
|
||||
}
|
||||
|
||||
.custom-el-3 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-width: 220px;
|
||||
max-height: 220px;
|
||||
min-height: 220px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.custom-el-3 .custom-el-3-img {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.custom-el-3 .custom-el-3-img img {
|
||||
transition: transform 2s;
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
.custom-el-3-pos-1 {
|
||||
top: 30%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-el-3-pos-2 {
|
||||
top: -30%;
|
||||
}
|
||||
|
||||
.custom-el-4-pos {
|
||||
margin-top: -15px;
|
||||
}
|
||||
|
||||
.custom-el-pos-5 {
|
||||
left: -60px;
|
||||
top: 35%;
|
||||
}
|
||||
|
||||
/* Custom Marquee */
|
||||
.custom-marquee-1 .js-marquee-wrapper,
|
||||
.custom-marquee-1 .js-marquee,
|
||||
.custom-marquee-1 .js-marquee > span {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
/* Custom Avatar */
|
||||
.custom-avatar-1 {
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-avatar-1-info {
|
||||
position: absolute;
|
||||
top: -30px;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
white-space: nowrap;
|
||||
letter-spacing: -0.5px;
|
||||
font-weight: 600;
|
||||
margin-left: -15px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.custom-avatar-1-info .animated-icon {
|
||||
transform: rotate(120deg);
|
||||
float: left;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
/* Custom Popover */
|
||||
.custom-popover-1 {
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
letter-spacing: -1px;
|
||||
}
|
||||
|
||||
/* Custom Btn */
|
||||
.custom-btn-1 {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
line-height: 190px;
|
||||
border-radius: 100%;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* Custom Grid */
|
||||
.custom-grid-1 {
|
||||
margin-top: -70px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-grid-1 .container {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.custom-grid-1 .container .row {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.custom-grid-1 .container .row > * {
|
||||
padding: 0;
|
||||
background-color: var(--light);
|
||||
min-height: 220px;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-grid-1 .container .row > * {
|
||||
border: 1px solid var(--grey-100);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-grid-1 .container .row > *:nth-child(1),
|
||||
.custom-grid-1 .container .row > *:nth-child(3),
|
||||
.custom-grid-1 .container .row > *:nth-child(6),
|
||||
.custom-grid-1 .container .row > *:nth-child(8) {
|
||||
background-color: var(--grey-100);
|
||||
}
|
||||
}
|
||||
|
||||
.custom-grid-1 .custom-grid-1-item {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-grid-1 .custom-grid-1-item .custom-grid-1-img {
|
||||
transition: opacity 300ms;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.custom-grid-1 .custom-grid-1-item .custom-grid-1-img img {
|
||||
transition: transform 2s;
|
||||
will-change: transform;
|
||||
transform: scale(0.75);
|
||||
}
|
||||
|
||||
.custom-grid-1 .custom-grid-1-item .custom-grid-1-img:after {
|
||||
content: "";
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
position: absolute;
|
||||
opacity: 0.7;
|
||||
background-color: var(--dark);
|
||||
}
|
||||
|
||||
.custom-grid-1 .custom-grid-1-item .custom-grid-1-text {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-grid-1 .custom-grid-1-item:hover .custom-grid-1-img {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.custom-grid-1 .custom-grid-1-item:hover .custom-grid-1-img img {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
.custom-grid-1 .custom-grid-1-item:hover h3 {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
/* Custom Projects */
|
||||
@media (max-width: 991px) {
|
||||
.custom-projects-1 .border-end {
|
||||
border: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Custom Border Radius */
|
||||
.custom-border-radius-1 {
|
||||
border-radius: 0 100px 0 100px;
|
||||
}
|
||||
|
||||
.custom-border-radius-2 {
|
||||
border-radius: 100px 0 0 0;
|
||||
}
|
||||
|
||||
.custom-border-radius-3 {
|
||||
border-radius: 100px 100px 100px 0;
|
||||
}
|
||||
|
||||
.custom-border-radius-4 {
|
||||
border-radius: 200px 10px 10px 10px;
|
||||
}
|
||||
|
||||
.custom-border-radius-5 {
|
||||
border-radius: 0 0 100px 0;
|
||||
}
|
||||
|
||||
/* Custom Section */
|
||||
.custom-section-1 {
|
||||
margin-top: -70px;
|
||||
padding-top: 70px;
|
||||
}
|
||||
|
||||
/* Custom Carousel */
|
||||
@media (min-width: 1200px) {
|
||||
.custom-carousel-1 > .owl-carousel {
|
||||
width: calc( 100vw - ( ( 100vw - 1400px ) / 2 ));
|
||||
}
|
||||
}
|
||||
|
||||
/* Custom Content */
|
||||
.custom-page-content {
|
||||
margin-top: -70px;
|
||||
}
|
||||
|
||||
/* Custom Padding */
|
||||
.custom-padding-top-1 {
|
||||
padding-top: 70px;
|
||||
}
|
||||
|
||||
.custom-padding-bottom-1 {
|
||||
padding-bottom: 70px;
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
#footer {
|
||||
margin-top: -70px;
|
||||
}
|
||||
106
resources/assets/css/demos/demo-dentist.css
Normal file
106
resources/assets/css/demos/demo-dentist.css
Normal file
@ -0,0 +1,106 @@
|
||||
.body {
|
||||
background-color: var(--light);
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li > a {
|
||||
color: var(--dark);
|
||||
font-weight: 600;
|
||||
}
|
||||
#header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li > a:before {
|
||||
height: 1px !important;
|
||||
}
|
||||
#header .header-nav-features .header-nav-top-icon {
|
||||
color: var(--dark);
|
||||
}
|
||||
#header .header-nav-features .header-nav-top-icon-img {
|
||||
color: var(--dark);
|
||||
}
|
||||
}
|
||||
|
||||
.custom-el-pos-1 {
|
||||
bottom: -260px;
|
||||
left: -15%;
|
||||
}
|
||||
|
||||
@media (min-width: 1600px) {
|
||||
.custom-el-pos-1 {
|
||||
left: -65px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-el-pos-2 {
|
||||
bottom: -155px;
|
||||
right: -145px;
|
||||
}
|
||||
|
||||
.custom-min-height-1 {
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
html .btn-quaternary:hover {
|
||||
background: #F0F2FC !important;
|
||||
}
|
||||
|
||||
.owl-carousel-light {
|
||||
z-index: initial !important;
|
||||
}
|
||||
|
||||
.owl-carousel-light .owl-stage {
|
||||
background: var(--light);
|
||||
}
|
||||
|
||||
.owl-carousel.custom-nav-1 .owl-nav .owl-prev, .owl-carousel.custom-nav-1 .owl-nav .owl-next {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: var(--quaternary) !important;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-nav-1 .owl-nav .owl-prev:before, .owl-carousel.custom-nav-1 .owl-nav .owl-next:before {
|
||||
color: var(--dark);
|
||||
left: 0 !important;
|
||||
top: 1px !important;
|
||||
font-size: 16px !important;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-nav-1-pos-1 .owl-nav {
|
||||
z-index: 5;
|
||||
top: 100%;
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-nav-1-pos-1 .owl-nav .owl-prev {
|
||||
transform: none !important;
|
||||
left: auto;
|
||||
top: -62px;
|
||||
right: 63px;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-nav-1-pos-1 .owl-nav .owl-next {
|
||||
transform: none !important;
|
||||
top: -62px;
|
||||
right: 12px;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-nav-1-pos-2 .owl-nav .owl-prev {
|
||||
margin-left: -25px;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-nav-1-pos-3 .owl-nav {
|
||||
margin-top: -45px;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-nav-1-pos-3 .owl-nav .owl-prev {
|
||||
margin-left: -25px;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-nav-1-pos-3 .owl-nav .owl-next {
|
||||
margin-right: -25px;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.owl-carousel.custom-nav-1-pos-4 .owl-nav {
|
||||
bottom: 33px;
|
||||
top: auto;
|
||||
}
|
||||
}
|
||||
935
resources/assets/css/demos/demo-digital-agency-2-dark.css
Normal file
935
resources/assets/css/demos/demo-digital-agency-2-dark.css
Normal file
@ -0,0 +1,935 @@
|
||||
body {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
@media (min-height: 1200px) {
|
||||
.body {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Font Tertiary
|
||||
*/
|
||||
.custom-font-tertiary {
|
||||
font-family: "Lora", serif !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Font Icons
|
||||
*/
|
||||
@font-face {
|
||||
font-family: "Fontello";
|
||||
src: url("../../css/fonts/demos/digital-agency-2/fontello.woff2") format("woff2"), url("../../css/fonts/demos/digital-agency-2/fontello.woff") format("woff"), url("../../css/fonts/demos/digital-agency-2/fontello.ttf") format("ttf"), url("../../css/fonts/demos/digital-agency-2/fontello.eot") format("eot");
|
||||
}
|
||||
|
||||
/*
|
||||
* Container
|
||||
*/
|
||||
@media (min-width: 1240px) {
|
||||
.container {
|
||||
max-width: 1240px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Text
|
||||
*/
|
||||
.custom-text-1 {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
|
||||
.custom-text-2 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
|
||||
.custom-text-3 {
|
||||
font-size: 15px !important;
|
||||
}
|
||||
|
||||
.custom-text-4 {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
|
||||
.custom-text-5 {
|
||||
font-size: 18px !important;
|
||||
}
|
||||
|
||||
.custom-text-6 {
|
||||
font-size: 20px !important;
|
||||
}
|
||||
|
||||
.custom-text-7 {
|
||||
font-size: 22px !important;
|
||||
}
|
||||
|
||||
.custom-text-8 {
|
||||
font-size: 26px !important;
|
||||
}
|
||||
|
||||
.custom-text-9 {
|
||||
font-size: 32px !important;
|
||||
}
|
||||
|
||||
.custom-text-10 {
|
||||
font-size: 40px !important;
|
||||
line-height: 40px !important;
|
||||
}
|
||||
|
||||
.custom-text-11 {
|
||||
font-size: 55px !important;
|
||||
line-height: 72px !important;
|
||||
}
|
||||
|
||||
.custom-text-12 {
|
||||
font-size: 60px !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Buttons
|
||||
*/
|
||||
.custom-btn-outline {
|
||||
border-width: 3px;
|
||||
}
|
||||
|
||||
@keyframes arrowMove {
|
||||
0% {
|
||||
position: relative;
|
||||
left: -1px;
|
||||
}
|
||||
50% {
|
||||
position: relative;
|
||||
left: 3px;
|
||||
}
|
||||
100% {
|
||||
position: relative;
|
||||
left: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow:after {
|
||||
content: '\E800';
|
||||
font-family: 'Fontello';
|
||||
font-size: 18px;
|
||||
margin-left: 17px;
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow:hover:after {
|
||||
animation: arrowMove 600ms ease;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
* Titles
|
||||
*/
|
||||
.custom-title-with-icon:before {
|
||||
content: '\E801';
|
||||
font-family: 'Fontello';
|
||||
font-size: 15px;
|
||||
display: block;
|
||||
line-height: 15px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-center:before {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-right:before {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/*
|
||||
* Circles
|
||||
*/
|
||||
.custom-circle {
|
||||
position: absolute;
|
||||
display: block;
|
||||
border-radius: 50%;
|
||||
display: block;
|
||||
z-index: 100;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.custom-circle-blur {
|
||||
filter: blur(3px);
|
||||
}
|
||||
|
||||
.custom-circle-1 {
|
||||
width: 68px;
|
||||
height: 67px;
|
||||
}
|
||||
|
||||
@media (max-width: 1799px) {
|
||||
.custom-circle-1 {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-circle-2 {
|
||||
width: 33px;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
@media (max-width: 1799px) {
|
||||
.custom-circle-2 {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-circle-3 {
|
||||
width: 21px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
@media (max-width: 1799px) {
|
||||
.custom-circle-3 {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-circle-4 {
|
||||
width: 14px;
|
||||
height: 13px;
|
||||
}
|
||||
|
||||
@media (max-width: 1799px) {
|
||||
.custom-circle-4 {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
#header.header-effect-shrink .header-container {
|
||||
min-height: 120px;
|
||||
}
|
||||
|
||||
#header.header-effect-shrink .header-container .header-column-social-icons {
|
||||
flex-grow: 0 !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header.header-effect-shrink .header-container .header-nav nav ul li.dropdown:hover .dropdown-menu {
|
||||
margin-top: -20px !important;
|
||||
}
|
||||
}
|
||||
|
||||
html.mobile-menu-opened.sticky-header-active #header.header-transparent .header-body .header-nav-main:before {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Slider
|
||||
*/
|
||||
.custom-circles-container .custom-circle-1:nth-child(1) {
|
||||
top: 40%;
|
||||
left: 5%;
|
||||
}
|
||||
|
||||
.custom-circles-container .custom-circle-2:nth-child(2) {
|
||||
top: 20%;
|
||||
left: 5%;
|
||||
}
|
||||
|
||||
.custom-circles-container .custom-circle-3:nth-child(3) {
|
||||
top: 27%;
|
||||
left: 12%;
|
||||
}
|
||||
|
||||
.custom-circles-container .custom-circle-1:nth-child(4) {
|
||||
top: 50%;
|
||||
right: 5%;
|
||||
}
|
||||
|
||||
.custom-circles-container .custom-circle-2:nth-child(5) {
|
||||
top: 70%;
|
||||
right: 5%;
|
||||
}
|
||||
|
||||
.custom-circles-container .custom-circle-3:nth-child(6) {
|
||||
top: 60%;
|
||||
right: 12%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Cards
|
||||
*/
|
||||
.custom-cards {
|
||||
margin-top: -345px;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-cards {
|
||||
margin-top: 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-cards .col-custom-cards .card {
|
||||
bottom: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-cards .col-custom-cards .card {
|
||||
position: static;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-cards .col-custom-cards:nth-child(2) {
|
||||
transform: translateY(45px);
|
||||
}
|
||||
|
||||
.custom-cards .col-custom-cards:nth-child(3) {
|
||||
transform: translateY(90px);
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom List
|
||||
*/
|
||||
.custom-list li:before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 30px;
|
||||
height: 3px;
|
||||
margin-right: 17px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Approach Img
|
||||
*/
|
||||
.approach-img {
|
||||
position: relative;
|
||||
display: block;
|
||||
background-image: url("../../img/demos/digital-agency-2/bg/bg-3.png");
|
||||
background-repeat: no-repeat;
|
||||
border-radius: 50%;
|
||||
min-width: 355px;
|
||||
min-height: 360px;
|
||||
max-width: 355px;
|
||||
max-height: 360px;
|
||||
margin: auto;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.approach-img .custom-circle-1 {
|
||||
display: block;
|
||||
width: 50%;
|
||||
height: 50%;
|
||||
background-color: white;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
border-radius: 113px;
|
||||
}
|
||||
|
||||
.approach-img .custom-circle-2 {
|
||||
display: block;
|
||||
width: 25%;
|
||||
height: 25%;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
background-image: url(../../img/demos/digital-agency-2/bg/bg-3.png);
|
||||
background-position: center;
|
||||
background-size: 500px;
|
||||
}
|
||||
|
||||
.approach-img .custom-circle-our-approach-deco-1 {
|
||||
width: 33px;
|
||||
height: 31px;
|
||||
border-radius: 50%;
|
||||
top: 30px;
|
||||
left: 30px;
|
||||
}
|
||||
|
||||
.approach-img .custom-circle-our-approach-deco-2 {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border-radius: 50%;
|
||||
top: 25%;
|
||||
right: 2%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.approach-img .custom-circle-our-approach-deco-3 {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border-radius: 50%;
|
||||
bottom: 0;
|
||||
left: 20%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
/*
|
||||
* Section Our Work
|
||||
*/
|
||||
.our-work .isotope-item {
|
||||
position: static !important;
|
||||
transition: .3s opacity;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work img {
|
||||
min-height: 280px;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work .custom-our-work-text {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work .custom-our-work-text h4, .our-work .custom-our-work .custom-our-work-text p, .our-work .custom-our-work .custom-our-work-text span {
|
||||
position: relative;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work .custom-our-work-text h4 {
|
||||
transition: .2s left;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work .custom-our-work-text p {
|
||||
transition: .5s left;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work .custom-our-work-text span {
|
||||
transition: .9s left;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work:hover:before {
|
||||
opacity: 0.8 !important;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work:hover .custom-our-work-text h4, .our-work .custom-our-work:hover .custom-our-work-text p, .our-work .custom-our-work:hover .custom-our-work-text span {
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Side menu Our Work
|
||||
*/
|
||||
.side-menu-our-work .sort-source li a:before {
|
||||
content: '';
|
||||
width: 15px;
|
||||
height: 3px;
|
||||
background-color: var(--grey-500);
|
||||
display: inline-block;
|
||||
margin-right: 16px;
|
||||
vertical-align: middle;
|
||||
transition: .5s width;
|
||||
}
|
||||
|
||||
.side-menu-our-work .sort-source li a:hover:before {
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.side-menu-our-work .sort-source li.active a {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
.side-menu-our-work .sort-source.sort-source-light li.active a {
|
||||
color: #000 !important;
|
||||
font-weight: bold !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Section Our Services
|
||||
*/
|
||||
.our-services .custom-circle-2 {
|
||||
top: 10%;
|
||||
right: 7%;
|
||||
}
|
||||
|
||||
.our-services .service-card {
|
||||
padding: 65px 0 65px 35px;
|
||||
}
|
||||
|
||||
.our-services .service-card:before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 30px;
|
||||
height: 3px;
|
||||
margin-right: 10px;
|
||||
transition: .5s width;
|
||||
}
|
||||
|
||||
.our-services .service-card:hover:before {
|
||||
width: 45px;
|
||||
background-color: white !important;
|
||||
}
|
||||
|
||||
.our-services .service-card.bg-color-dark:before, .our-services .service-card.active:before {
|
||||
background-color: white !important;
|
||||
}
|
||||
|
||||
.our-services .col-our-services-bottom .col-our-services-bottom-img {
|
||||
min-height: 377px;
|
||||
}
|
||||
|
||||
.our-services .col-our-services-bottom .col-our-services-bottom-img img {
|
||||
max-width: 300px;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.our-services .col-our-services-bottom .col-our-services-bottom-img .square-1 {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
left: 0;
|
||||
transform: translateY(-50%);
|
||||
width: 253px;
|
||||
height: 140px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.our-services .col-our-services-bottom .col-our-services-bottom-img .square-2 {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 253px;
|
||||
height: 178px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.our-services .col-our-services-bottom .col-our-services-bottom-img .square-3 {
|
||||
border: 3px solid #000;
|
||||
position: absolute;
|
||||
top: 43%;
|
||||
left: 45%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 299px;
|
||||
height: 285px;
|
||||
}
|
||||
|
||||
.our-services .col-our-services-bottom .col-our-services-bottom-img .custom-circle-1 {
|
||||
position: absolute;
|
||||
top: 70%;
|
||||
left: -5%;
|
||||
transform: translateY(-50%);
|
||||
width: 26px;
|
||||
height: 24px;
|
||||
opacity: 0.5;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Section Our Insights
|
||||
*/
|
||||
.our-insights .custom-circle-2 {
|
||||
top: 8%;
|
||||
left: 5%;
|
||||
}
|
||||
|
||||
.our-insights .custom-circle-3 {
|
||||
top: 18%;
|
||||
left: 12%;
|
||||
}
|
||||
|
||||
/*
|
||||
* About Us Featured Block
|
||||
*/
|
||||
.about-us-featured-block {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
top: -50%;
|
||||
transform: translate(-70px, -50%);
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.about-us-featured-block {
|
||||
position: static;
|
||||
transform: translate(0);
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Page Our Work Detail
|
||||
*/
|
||||
.project-details {
|
||||
border-bottom: 1px solid #e7e7e7;
|
||||
}
|
||||
|
||||
/*
|
||||
* Page Our Services Detail
|
||||
*/
|
||||
.custom-accordion .custom-card-default {
|
||||
border-width: 20px !important;
|
||||
border-top: 0 !important;
|
||||
border-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.custom-accordion .custom-card-body-collapse {
|
||||
border-bottom: 20px solid;
|
||||
}
|
||||
|
||||
/*
|
||||
* Section Contact Us - Where You Are
|
||||
*/
|
||||
.where-you-are-postal-cards .custom-circle-2:nth-child(1) {
|
||||
top: -10px;
|
||||
left: 30px;
|
||||
}
|
||||
|
||||
.where-you-are-postal-cards .custom-circle-3:nth-child(2) {
|
||||
top: -10px;
|
||||
right: 30px;
|
||||
}
|
||||
|
||||
.where-you-are-postal-cards .custom-circle-3:nth-child(3) {
|
||||
bottom: -40px;
|
||||
right: 60px;
|
||||
}
|
||||
|
||||
.where-you-are-postal-cards .col-where-you-are-postal {
|
||||
min-height: 380px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.where-you-are-postal-cards .col-where-you-are-postal {
|
||||
min-height: unset;
|
||||
}
|
||||
}
|
||||
|
||||
.where-you-are-postal-cards .col-where-you-are-postal img {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.where-you-are-postal-cards .col-where-you-are-postal img {
|
||||
position: static;
|
||||
}
|
||||
}
|
||||
|
||||
.where-you-are-postal-cards .col-where-you-are-postal .col-where-you-are-postal-text {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.where-you-are-postal-cards .col-where-you-are-postal .col-where-you-are-postal-text {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Section Get in Touch
|
||||
*/
|
||||
.get-in-touch {
|
||||
padding: 90px 0 150px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.get-in-touch {
|
||||
padding: 90px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.get-in-touch:after {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 120%;
|
||||
height: 100px;
|
||||
position: absolute;
|
||||
bottom: -48px;
|
||||
left: -5%;
|
||||
transform: rotate(2deg);
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.get-in-touch:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.get-in-touch .custom-circle-1 {
|
||||
top: 20%;
|
||||
right: 10%;
|
||||
}
|
||||
|
||||
.get-in-touch .custom-circle-2 {
|
||||
top: 70%;
|
||||
right: 5%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Page Header
|
||||
*/
|
||||
.page-header.page-header-modern.page-header-background {
|
||||
padding: 185px 0 245px;
|
||||
margin-bottom: 0;
|
||||
background-position: 0 100%;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.page-header.page-header-modern.page-header-background {
|
||||
padding: 100px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.page-header.page-header-modern.page-header-background:after {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
background-color: var(--light);
|
||||
position: absolute;
|
||||
bottom: -48px;
|
||||
left: 0;
|
||||
transform: rotate(2deg);
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.page-header.page-header-modern.page-header-background:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.page-header.page-header-modern.page-header-background .custom-circle-1:nth-child(1) {
|
||||
top: 40%;
|
||||
right: 5%;
|
||||
}
|
||||
|
||||
.page-header.page-header-modern.page-header-background .custom-circle-2:nth-child(2) {
|
||||
top: 70%;
|
||||
right: 5%;
|
||||
}
|
||||
|
||||
.page-header.page-header-modern.page-header-background .custom-circle-3:nth-child(3) {
|
||||
top: 60%;
|
||||
right: 12%;
|
||||
}
|
||||
|
||||
.page-header.page-header-modern.page-header-background .breadcrumb:before {
|
||||
content: '\E801';
|
||||
font-family: 'Fontello';
|
||||
font-size: 15px;
|
||||
display: block;
|
||||
line-height: 15px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
.overlay:before {
|
||||
background-color: var(--secondary) !important;
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow-primary:after {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow-secondary:after {
|
||||
color: var(--secondary) !important;
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow-tertiary:after {
|
||||
color: var(--tertiary) !important;
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow-quaternary:after {
|
||||
color: var(--quaternary) !important;
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow-dark:after {
|
||||
color: var(--dark) !important;
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow-light:after {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-primary:before {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-secondary:before {
|
||||
color: var(--secondary) !important;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-tertiary:before {
|
||||
color: var(--tertiary) !important;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-quaternary:before {
|
||||
color: var(--quaternary) !important;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-dark:before {
|
||||
color: var(--dark) !important;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-light:before {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
#header .header-nav-main.header-nav-main-mobile-dark:before {
|
||||
background-color: var(--secondary);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav.header-nav-links nav > ul li:hover > a {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.our-services .service-card:before {
|
||||
background-color: var(--secondary);
|
||||
}
|
||||
|
||||
.our-services .col-our-services-bottom .col-our-services-bottom-img .square-3 {
|
||||
border-color: var(--secondary);
|
||||
}
|
||||
|
||||
.custom-list li:before {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-accordion .custom-card-body-collapse {
|
||||
border-bottom-color: var(--tertiary);
|
||||
}
|
||||
|
||||
.side-menu-our-work .sort-source li a:before {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
#footer {
|
||||
background-color: var(--secondary) !important;
|
||||
}
|
||||
|
||||
#footer .custom-newsletter {
|
||||
border-bottom: 1px solid var(--quaternary);
|
||||
}
|
||||
|
||||
/*
|
||||
* Text Color
|
||||
*/
|
||||
body {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
p {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/*
|
||||
* BG Dark
|
||||
*/
|
||||
html,
|
||||
html.dark body,
|
||||
html.dark .body {
|
||||
background-color: #252525;
|
||||
}
|
||||
|
||||
html.dark .bg-color-darken {
|
||||
background-color: #252525;
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
@media (min-width: 992px) {
|
||||
html.dark #header .header-nav.header-nav-dropdowns-dark nav > ul > li > a, html.dark #header .header-nav.header-nav-dropdowns-dark nav > ul > li:hover > a {
|
||||
color: #FFF;
|
||||
}
|
||||
html.dark #header .header-nav-main:not(.header-nav-main-light) nav > ul > li.dropdown:not(.dropdown-full-color) .dropdown-menu {
|
||||
background: #252525;
|
||||
}
|
||||
html.dark #header .header-nav-main:not(.header-nav-main-light) nav > ul > li.dropdown:not(.dropdown-full-color) .dropdown-menu li:hover > a, html.dark #header .header-nav-main:not(.header-nav-main-light) nav > ul > li.dropdown:not(.dropdown-full-color) .dropdown-menu li:focus > a, html.dark #header .header-nav-main:not(.header-nav-main-light) nav > ul > li.dropdown:not(.dropdown-full-color) .dropdown-menu li.active > a, html.dark #header .header-nav-main:not(.header-nav-main-light) nav > ul > li.dropdown:not(.dropdown-full-color) .dropdown-menu li:active > a {
|
||||
background: #323232;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
html.dark #header.header-transparent .header-body.bg-dark .header-nav-main:before,
|
||||
html #header.header-transparent .header-body.bg-color-dark .header-nav-main:before {
|
||||
background-color: #252525;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Slider
|
||||
*/
|
||||
html.dark .slider-container:after {
|
||||
background-color: #252525;
|
||||
}
|
||||
|
||||
/*
|
||||
* Page Header
|
||||
*/
|
||||
.page-header.page-header-modern.page-header-background:after {
|
||||
background-color: #252525;
|
||||
}
|
||||
|
||||
/*
|
||||
* Sort Source
|
||||
*/
|
||||
html.dark .side-menu-our-work .sort-source.sort-source-light li.active a {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
html.dark .side-menu-our-work .sort-source.sort-source-light li:hover a, html.dark .side-menu-our-work .sort-source.sort-source-light li:hover a:hover {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Project Details
|
||||
*/
|
||||
html.dark .project-details {
|
||||
border-color: #323232;
|
||||
}
|
||||
|
||||
/*
|
||||
* Blog
|
||||
*/
|
||||
html.dark ul.comments .comment-block {
|
||||
background: #323232;
|
||||
}
|
||||
|
||||
html.dark ul.comments .comment-block .comment-arrow {
|
||||
border-right-color: #323232;
|
||||
}
|
||||
|
||||
/*
|
||||
* Accordion
|
||||
*/
|
||||
html.dark .accordion .card-default {
|
||||
border-color: #323232 !important;
|
||||
}
|
||||
|
||||
html.dark .accordion .card,
|
||||
html.dark .accordion .card-header {
|
||||
background-color: #323232 !important;
|
||||
}
|
||||
|
||||
html.dark .accordion .custom-card-body-collapse {
|
||||
border-bottom-color: #323232 !important;
|
||||
}
|
||||
|
||||
html.dark .accordion .card-body {
|
||||
background-color: #2a2a2a !important;
|
||||
}
|
||||
|
||||
html.dark .pagination > li > a,
|
||||
html.dark .pagination > li > span {
|
||||
background-color: #2d2d2d;
|
||||
border-color: #323232;
|
||||
}
|
||||
820
resources/assets/css/demos/demo-digital-agency-2.css
Normal file
820
resources/assets/css/demos/demo-digital-agency-2.css
Normal file
@ -0,0 +1,820 @@
|
||||
body {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
@media (min-height: 1200px) {
|
||||
.body {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Font Tertiary
|
||||
*/
|
||||
.custom-font-tertiary {
|
||||
font-family: "Lora", serif !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Font Icons
|
||||
*/
|
||||
@font-face {
|
||||
font-family: "Fontello";
|
||||
src: url("../../css/fonts/demos/digital-agency-2/fontello.woff2") format("woff2"), url("../../css/fonts/demos/digital-agency-2/fontello.woff") format("woff"), url("../../css/fonts/demos/digital-agency-2/fontello.ttf") format("ttf"), url("../../css/fonts/demos/digital-agency-2/fontello.eot") format("eot");
|
||||
}
|
||||
|
||||
/*
|
||||
* Container
|
||||
*/
|
||||
@media (min-width: 1240px) {
|
||||
.container {
|
||||
max-width: 1240px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Text
|
||||
*/
|
||||
.custom-text-1 {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
|
||||
.custom-text-2 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
|
||||
.custom-text-3 {
|
||||
font-size: 15px !important;
|
||||
}
|
||||
|
||||
.custom-text-4 {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
|
||||
.custom-text-5 {
|
||||
font-size: 18px !important;
|
||||
}
|
||||
|
||||
.custom-text-6 {
|
||||
font-size: 20px !important;
|
||||
}
|
||||
|
||||
.custom-text-7 {
|
||||
font-size: 22px !important;
|
||||
}
|
||||
|
||||
.custom-text-8 {
|
||||
font-size: 26px !important;
|
||||
}
|
||||
|
||||
.custom-text-9 {
|
||||
font-size: 32px !important;
|
||||
}
|
||||
|
||||
.custom-text-10 {
|
||||
font-size: 40px !important;
|
||||
line-height: 40px !important;
|
||||
}
|
||||
|
||||
.custom-text-11 {
|
||||
font-size: 55px !important;
|
||||
line-height: 72px !important;
|
||||
}
|
||||
|
||||
.custom-text-12 {
|
||||
font-size: 60px !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Buttons
|
||||
*/
|
||||
.custom-btn-outline {
|
||||
border-width: 3px;
|
||||
}
|
||||
|
||||
@keyframes arrowMove {
|
||||
0% {
|
||||
position: relative;
|
||||
left: -1px;
|
||||
}
|
||||
50% {
|
||||
position: relative;
|
||||
left: 3px;
|
||||
}
|
||||
100% {
|
||||
position: relative;
|
||||
left: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow:after {
|
||||
content: '\E800';
|
||||
font-family: 'Fontello';
|
||||
font-size: 18px;
|
||||
margin-left: 17px;
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow:hover:after {
|
||||
animation: arrowMove 600ms ease;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
* Titles
|
||||
*/
|
||||
.custom-title-with-icon:before {
|
||||
content: '\E801';
|
||||
font-family: 'Fontello';
|
||||
font-size: 15px;
|
||||
display: block;
|
||||
line-height: 15px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-center:before {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-right:before {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/*
|
||||
* Circles
|
||||
*/
|
||||
.custom-circle {
|
||||
position: absolute;
|
||||
display: block;
|
||||
border-radius: 50%;
|
||||
display: block;
|
||||
z-index: 100;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.custom-circle-blur {
|
||||
filter: blur(3px);
|
||||
}
|
||||
|
||||
.custom-circle-1 {
|
||||
width: 68px;
|
||||
height: 67px;
|
||||
}
|
||||
|
||||
@media (max-width: 1799px) {
|
||||
.custom-circle-1 {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-circle-2 {
|
||||
width: 33px;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
@media (max-width: 1799px) {
|
||||
.custom-circle-2 {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-circle-3 {
|
||||
width: 21px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
@media (max-width: 1799px) {
|
||||
.custom-circle-3 {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-circle-4 {
|
||||
width: 14px;
|
||||
height: 13px;
|
||||
}
|
||||
|
||||
@media (max-width: 1799px) {
|
||||
.custom-circle-4 {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
#header.header-effect-shrink .header-container {
|
||||
min-height: 120px;
|
||||
}
|
||||
|
||||
#header.header-effect-shrink .header-container .header-column-social-icons {
|
||||
flex-grow: 0 !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header.header-effect-shrink .header-container .header-nav nav ul li.dropdown:hover .dropdown-menu {
|
||||
margin-top: -20px !important;
|
||||
}
|
||||
}
|
||||
|
||||
html.mobile-menu-opened.sticky-header-active #header.header-transparent .header-body .header-nav-main:before {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Slider
|
||||
*/
|
||||
.custom-circles-container .custom-circle-1:nth-child(1) {
|
||||
top: 40%;
|
||||
left: 5%;
|
||||
}
|
||||
|
||||
.custom-circles-container .custom-circle-2:nth-child(2) {
|
||||
top: 20%;
|
||||
left: 5%;
|
||||
}
|
||||
|
||||
.custom-circles-container .custom-circle-3:nth-child(3) {
|
||||
top: 27%;
|
||||
left: 12%;
|
||||
}
|
||||
|
||||
.custom-circles-container .custom-circle-1:nth-child(4) {
|
||||
top: 50%;
|
||||
right: 5%;
|
||||
}
|
||||
|
||||
.custom-circles-container .custom-circle-2:nth-child(5) {
|
||||
top: 70%;
|
||||
right: 5%;
|
||||
}
|
||||
|
||||
.custom-circles-container .custom-circle-3:nth-child(6) {
|
||||
top: 60%;
|
||||
right: 12%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Cards
|
||||
*/
|
||||
.custom-cards {
|
||||
margin-top: -345px;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-cards {
|
||||
margin-top: 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-cards .col-custom-cards .card {
|
||||
bottom: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-cards .col-custom-cards .card {
|
||||
position: static;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-cards .col-custom-cards:nth-child(2) {
|
||||
transform: translateY(45px);
|
||||
}
|
||||
|
||||
.custom-cards .col-custom-cards:nth-child(3) {
|
||||
transform: translateY(90px);
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom List
|
||||
*/
|
||||
.custom-list li:before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 30px;
|
||||
height: 3px;
|
||||
margin-right: 17px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Approach Img
|
||||
*/
|
||||
.approach-img {
|
||||
position: relative;
|
||||
display: block;
|
||||
background-image: url("../../img/demos/digital-agency-2/bg/bg-3.png");
|
||||
background-repeat: no-repeat;
|
||||
border-radius: 50%;
|
||||
min-width: 355px;
|
||||
min-height: 360px;
|
||||
max-width: 355px;
|
||||
max-height: 360px;
|
||||
margin: auto;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.approach-img .custom-circle-1 {
|
||||
display: block;
|
||||
width: 50%;
|
||||
height: 50%;
|
||||
background-color: white;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
border-radius: 113px;
|
||||
}
|
||||
|
||||
.approach-img .custom-circle-2 {
|
||||
display: block;
|
||||
width: 25%;
|
||||
height: 25%;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
background-image: url(../../img/demos/digital-agency-2/bg/bg-3.png);
|
||||
background-position: center;
|
||||
background-size: 500px;
|
||||
}
|
||||
|
||||
.approach-img .custom-circle-our-approach-deco-1 {
|
||||
width: 33px;
|
||||
height: 31px;
|
||||
border-radius: 50%;
|
||||
top: 30px;
|
||||
left: 30px;
|
||||
}
|
||||
|
||||
.approach-img .custom-circle-our-approach-deco-2 {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border-radius: 50%;
|
||||
top: 25%;
|
||||
right: 2%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.approach-img .custom-circle-our-approach-deco-3 {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border-radius: 50%;
|
||||
bottom: 0;
|
||||
left: 20%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
/*
|
||||
* Section Our Work
|
||||
*/
|
||||
.our-work .isotope-item {
|
||||
position: static !important;
|
||||
transition: .3s opacity;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work img {
|
||||
min-height: 280px;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work .custom-our-work-text {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work .custom-our-work-text h4, .our-work .custom-our-work .custom-our-work-text p, .our-work .custom-our-work .custom-our-work-text span {
|
||||
position: relative;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work .custom-our-work-text h4 {
|
||||
transition: .2s left;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work .custom-our-work-text p {
|
||||
transition: .5s left;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work .custom-our-work-text span {
|
||||
transition: .9s left;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work:hover:before {
|
||||
opacity: 0.8 !important;
|
||||
}
|
||||
|
||||
.our-work .custom-our-work:hover .custom-our-work-text h4, .our-work .custom-our-work:hover .custom-our-work-text p, .our-work .custom-our-work:hover .custom-our-work-text span {
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Side menu Our Work
|
||||
*/
|
||||
.side-menu-our-work .sort-source li a:before {
|
||||
content: '';
|
||||
width: 15px;
|
||||
height: 3px;
|
||||
background-color: var(--grey-500);
|
||||
display: inline-block;
|
||||
margin-right: 16px;
|
||||
vertical-align: middle;
|
||||
transition: .5s width;
|
||||
}
|
||||
|
||||
.side-menu-our-work .sort-source li a:hover:before {
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.side-menu-our-work .sort-source li.active a {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
.side-menu-our-work .sort-source.sort-source-light li.active a {
|
||||
color: #000 !important;
|
||||
font-weight: bold !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Section Our Services
|
||||
*/
|
||||
.our-services .custom-circle-2 {
|
||||
top: 10%;
|
||||
right: 7%;
|
||||
}
|
||||
|
||||
.our-services .service-card {
|
||||
padding: 65px 0 65px 35px;
|
||||
}
|
||||
|
||||
.our-services .service-card:before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 30px;
|
||||
height: 3px;
|
||||
margin-right: 10px;
|
||||
transition: .5s width;
|
||||
}
|
||||
|
||||
.our-services .service-card:hover:before {
|
||||
width: 45px;
|
||||
background-color: white !important;
|
||||
}
|
||||
|
||||
.our-services .service-card.bg-color-dark:before, .our-services .service-card.active:before {
|
||||
background-color: white !important;
|
||||
}
|
||||
|
||||
.our-services .col-our-services-bottom .col-our-services-bottom-img {
|
||||
min-height: 377px;
|
||||
}
|
||||
|
||||
.our-services .col-our-services-bottom .col-our-services-bottom-img img {
|
||||
max-width: 300px;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.our-services .col-our-services-bottom .col-our-services-bottom-img .square-1 {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
left: 0;
|
||||
transform: translateY(-50%);
|
||||
width: 253px;
|
||||
height: 140px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.our-services .col-our-services-bottom .col-our-services-bottom-img .square-2 {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 253px;
|
||||
height: 178px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.our-services .col-our-services-bottom .col-our-services-bottom-img .square-3 {
|
||||
border: 3px solid #000;
|
||||
position: absolute;
|
||||
top: 43%;
|
||||
left: 45%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 299px;
|
||||
height: 285px;
|
||||
}
|
||||
|
||||
.our-services .col-our-services-bottom .col-our-services-bottom-img .custom-circle-1 {
|
||||
position: absolute;
|
||||
top: 70%;
|
||||
left: -5%;
|
||||
transform: translateY(-50%);
|
||||
width: 26px;
|
||||
height: 24px;
|
||||
opacity: 0.5;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Section Our Insights
|
||||
*/
|
||||
.our-insights .custom-circle-2 {
|
||||
top: 8%;
|
||||
left: 5%;
|
||||
}
|
||||
|
||||
.our-insights .custom-circle-3 {
|
||||
top: 18%;
|
||||
left: 12%;
|
||||
}
|
||||
|
||||
/*
|
||||
* About Us Featured Block
|
||||
*/
|
||||
.about-us-featured-block {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
top: -50%;
|
||||
transform: translate(-70px, -50%);
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.about-us-featured-block {
|
||||
position: static;
|
||||
transform: translate(0);
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Page Our Work Detail
|
||||
*/
|
||||
.project-details {
|
||||
border-bottom: 1px solid #e7e7e7;
|
||||
}
|
||||
|
||||
/*
|
||||
* Page Our Services Detail
|
||||
*/
|
||||
.custom-accordion .custom-card-default {
|
||||
border-width: 20px !important;
|
||||
border-top: 0 !important;
|
||||
border-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.custom-accordion .custom-card-body-collapse {
|
||||
border-bottom: 20px solid;
|
||||
}
|
||||
|
||||
/*
|
||||
* Section Contact Us - Where You Are
|
||||
*/
|
||||
.where-you-are-postal-cards .custom-circle-2:nth-child(1) {
|
||||
top: -10px;
|
||||
left: 30px;
|
||||
}
|
||||
|
||||
.where-you-are-postal-cards .custom-circle-3:nth-child(2) {
|
||||
top: -10px;
|
||||
right: 30px;
|
||||
}
|
||||
|
||||
.where-you-are-postal-cards .custom-circle-3:nth-child(3) {
|
||||
bottom: -40px;
|
||||
right: 60px;
|
||||
}
|
||||
|
||||
.where-you-are-postal-cards .col-where-you-are-postal {
|
||||
min-height: 380px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.where-you-are-postal-cards .col-where-you-are-postal {
|
||||
min-height: unset;
|
||||
}
|
||||
}
|
||||
|
||||
.where-you-are-postal-cards .col-where-you-are-postal img {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.where-you-are-postal-cards .col-where-you-are-postal img {
|
||||
position: static;
|
||||
}
|
||||
}
|
||||
|
||||
.where-you-are-postal-cards .col-where-you-are-postal .col-where-you-are-postal-text {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.where-you-are-postal-cards .col-where-you-are-postal .col-where-you-are-postal-text {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Section Get in Touch
|
||||
*/
|
||||
.get-in-touch {
|
||||
padding: 90px 0 150px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.get-in-touch {
|
||||
padding: 90px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.get-in-touch:after {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 120%;
|
||||
height: 100px;
|
||||
position: absolute;
|
||||
bottom: -48px;
|
||||
left: -5%;
|
||||
transform: rotate(2deg);
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.get-in-touch:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.get-in-touch .custom-circle-1 {
|
||||
top: 20%;
|
||||
right: 10%;
|
||||
}
|
||||
|
||||
.get-in-touch .custom-circle-2 {
|
||||
top: 70%;
|
||||
right: 5%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Page Header
|
||||
*/
|
||||
.page-header.page-header-modern.page-header-background {
|
||||
padding: 185px 0 245px;
|
||||
margin-bottom: 0;
|
||||
background-position: 0 100%;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.page-header.page-header-modern.page-header-background {
|
||||
padding: 100px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.page-header.page-header-modern.page-header-background:after {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
background-color: var(--light);
|
||||
position: absolute;
|
||||
bottom: -48px;
|
||||
left: 0;
|
||||
transform: rotate(2deg);
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.page-header.page-header-modern.page-header-background:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.page-header.page-header-modern.page-header-background .custom-circle-1:nth-child(1) {
|
||||
top: 40%;
|
||||
right: 5%;
|
||||
}
|
||||
|
||||
.page-header.page-header-modern.page-header-background .custom-circle-2:nth-child(2) {
|
||||
top: 70%;
|
||||
right: 5%;
|
||||
}
|
||||
|
||||
.page-header.page-header-modern.page-header-background .custom-circle-3:nth-child(3) {
|
||||
top: 60%;
|
||||
right: 12%;
|
||||
}
|
||||
|
||||
.page-header.page-header-modern.page-header-background .breadcrumb:before {
|
||||
content: '\E801';
|
||||
font-family: 'Fontello';
|
||||
font-size: 15px;
|
||||
display: block;
|
||||
line-height: 15px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
.overlay:before {
|
||||
background-color: var(--secondary) !important;
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow-primary:after {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow-secondary:after {
|
||||
color: var(--secondary) !important;
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow-tertiary:after {
|
||||
color: var(--tertiary) !important;
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow-quaternary:after {
|
||||
color: var(--quaternary) !important;
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow-dark:after {
|
||||
color: var(--dark) !important;
|
||||
}
|
||||
|
||||
.custom-btn-with-arrow-light:after {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-primary:before {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-secondary:before {
|
||||
color: var(--secondary) !important;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-tertiary:before {
|
||||
color: var(--tertiary) !important;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-quaternary:before {
|
||||
color: var(--quaternary) !important;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-dark:before {
|
||||
color: var(--dark) !important;
|
||||
}
|
||||
|
||||
.custom-title-with-icon-light:before {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
#header .header-nav-main.header-nav-main-mobile-dark:before {
|
||||
background-color: var(--secondary);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav.header-nav-links nav > ul li:hover > a {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.our-services .service-card:before {
|
||||
background-color: var(--secondary);
|
||||
}
|
||||
|
||||
.our-services .col-our-services-bottom .col-our-services-bottom-img .square-3 {
|
||||
border-color: var(--secondary);
|
||||
}
|
||||
|
||||
.custom-list li:before {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-accordion .custom-card-body-collapse {
|
||||
border-bottom-color: var(--tertiary);
|
||||
}
|
||||
|
||||
.side-menu-our-work .sort-source li a:before {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
#footer {
|
||||
background-color: var(--secondary) !important;
|
||||
}
|
||||
|
||||
#footer .custom-newsletter {
|
||||
border-bottom: 1px solid var(--quaternary);
|
||||
}
|
||||
346
resources/assets/css/demos/demo-digital-agency.css
Normal file
346
resources/assets/css/demos/demo-digital-agency.css
Normal file
@ -0,0 +1,346 @@
|
||||
.custom-big-text-1 {
|
||||
font-size: 152px;
|
||||
font-size: 9.5rem;
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-big-text-1 {
|
||||
font-size: 5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-big-text-2 {
|
||||
font-size: 124.8px;
|
||||
font-size: 7.8rem;
|
||||
line-height: 112px;
|
||||
line-height: 7rem;
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-big-text-2 {
|
||||
font-size: 3.8rem;
|
||||
line-height: 3.8rem;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-stroke-text-effect-1 {
|
||||
-webkit-text-fill-color: transparent;
|
||||
-webkit-text-stroke-width: 0.5px;
|
||||
-webkit-text-stroke-color: var(--light);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.custom-svg-reverse > svg {
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
|
||||
.custom-svg-style-1 {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: 1920px) {
|
||||
.custom-svg-style-1 {
|
||||
width: 1920px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-svg-style-1 {
|
||||
width: 1920px;
|
||||
left: 100% !important;
|
||||
}
|
||||
.custom-svg-style-1.custom-svg-style-1-variation {
|
||||
left: 0% !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav.header-nav-line nav > ul:not(:hover) li > a.active:before {
|
||||
background: #FFF !important;
|
||||
height: 1px !important;
|
||||
}
|
||||
#header .header-nav.header-nav-line nav > ul li:hover > a:before {
|
||||
background: #FFF !important;
|
||||
height: 1px !important;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li {
|
||||
margin-left: 25px;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-read-more svg {
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-read-more:hover svg {
|
||||
transform: translate3d(6px, 0, 0);
|
||||
}
|
||||
|
||||
/*
|
||||
* Tabs
|
||||
*/
|
||||
.custom-tabs-style-1.tabs .nav-tabs .nav-link {
|
||||
border-bottom-width: 1px !important;
|
||||
}
|
||||
|
||||
.custom-tabs-style-1.tabs .nav-tabs .nav-link h4 {
|
||||
color: var(--default);
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-tabs-style-1.tabs .nav-tabs .nav-item {
|
||||
width: auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Carousel
|
||||
*/
|
||||
@media (min-width: 768px) {
|
||||
.custom-half-carousel-style-1.carousel-half-full-width-wrapper > .owl-carousel {
|
||||
width: calc( 100vw - ( ( 100vw - 960px ) / 2 ));
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-half-carousel-style-1.carousel-half-full-width-wrapper > .owl-carousel {
|
||||
width: calc( 100vw - ( ( 100vw - 1300px ) / 2 ));
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-half-carousel-style-1.carousel-half-full-width-wrapper > .owl-carousel {
|
||||
width: calc( 100vw - ( ( 100vw - 1600px ) / 2 ));
|
||||
}
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot {
|
||||
transition: ease transform 150ms;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot.active, .custom-dots-style-1 .owl-dots .owl-dot:hover {
|
||||
transform: scale(1.4);
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot span {
|
||||
margin: 5px 6px;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot:first-child span {
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
.owl-carousel .owl-item .custom-bg-slider-left,
|
||||
.owl-carousel .owl-item .custom-bg-slider-right {
|
||||
position: absolute;
|
||||
width: 130%;
|
||||
max-width: initial;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.owl-carousel .owl-item .custom-bg-slider-left,
|
||||
.owl-carousel .owl-item .custom-bg-slider-right {
|
||||
width: 105%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.owl-carousel .owl-item .custom-bg-slider-left,
|
||||
.owl-carousel .owl-item .custom-bg-slider-right {
|
||||
width: 85%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1600px) {
|
||||
.owl-carousel .owl-item .custom-bg-slider-left,
|
||||
.owl-carousel .owl-item .custom-bg-slider-right {
|
||||
width: 65%;
|
||||
}
|
||||
}
|
||||
|
||||
.owl-carousel .owl-item .custom-bg-slider-left {
|
||||
right: auto;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Thumb Info
|
||||
*/
|
||||
.thumb-info.thumb-info-no-borders.thumb-info-no-borders-rounded,
|
||||
.thumb-info.thumb-info-no-borders.thumb-info-no-borders-rounded img,
|
||||
.thumb-info.thumb-info-no-borders.thumb-info-no-borders-rounded .thumb-info-wrapper,
|
||||
.thumb-info.thumb-info-no-borders.thumb-info-no-borders-rounded .thumb-info-wrapper:after {
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Page Header
|
||||
*/
|
||||
.custom-page-header.page-header-modern {
|
||||
height: 400px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.custom-page-header.page-header-modern .custom-big-text-1 {
|
||||
font-size: 64px;
|
||||
font-size: 4rem;
|
||||
line-height: 64px;
|
||||
line-height: 4rem;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.custom-page-header.page-header-modern .custom-big-text-2 {
|
||||
font-size: 48px;
|
||||
font-size: 3rem;
|
||||
line-height: 48px;
|
||||
line-height: 3rem;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-page-header.page-header-modern .custom-big-text-1 {
|
||||
font-size: 6rem;
|
||||
line-height: 6rem;
|
||||
}
|
||||
.custom-page-header.page-header-modern .custom-big-text-2 {
|
||||
font-size: 5rem;
|
||||
line-height: 4rem;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Accordion
|
||||
*/
|
||||
.custom-accordion-style-1 > .card {
|
||||
border: 1px solid transparent !important;
|
||||
transition: ease border-color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a {
|
||||
position: relative;
|
||||
padding: 23px 30px;
|
||||
background-color: #f4f4f4;
|
||||
transition: ease background-color 300ms, ease color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a:after {
|
||||
content: '+';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 25px;
|
||||
font-size: inherit;
|
||||
font-weight: inherit;
|
||||
transform: translate3d(0, -50%, 0) rotate(45deg);
|
||||
transform-origin: 50% 50%;
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a.collapsed:after {
|
||||
transform: translate3d(0, -50%, 0) rotate(0deg);
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header + .collapse.show,
|
||||
.custom-accordion-style-1 > .card .card-header + .collapsing {
|
||||
background: #f4f4f4;
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card + .card {
|
||||
margin-top: 17px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Por
|
||||
*/
|
||||
.custom-sort-source.sort-source.sort-source-style-3 {
|
||||
border-bottom: 1px solid #EEE;
|
||||
}
|
||||
|
||||
.custom-sort-source.sort-source.sort-source-style-3 > li {
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
|
||||
.custom-sort-source.sort-source.sort-source-style-3 > li > a {
|
||||
border-bottom: 1px solid #EEE;
|
||||
border-radius: 0;
|
||||
padding: 20px 12px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Contact Form
|
||||
*/
|
||||
.custom-form-style-1 .form-control {
|
||||
height: calc(1.8em + 1.85rem + 2px);
|
||||
padding: 15.6px 20px;
|
||||
padding: 0.975rem 1.25rem;
|
||||
background: var(--grey-100);
|
||||
border-color: var(--grey-100);
|
||||
line-height: 1.5 !important;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:focus {
|
||||
border-color: var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-webkit-input-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-moz-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:-ms-input-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select {
|
||||
color: #495057;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select option {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select option[selected] {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 textarea.form-control {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
/*
|
||||
* Tabs
|
||||
*/
|
||||
.custom-tabs-style-1.tabs .nav-tabs .nav-link.active h4 {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
/*
|
||||
* Accordion
|
||||
*/
|
||||
.custom-accordion-style-1 > .card .card-header a:not(.collapsed) {
|
||||
background-color: var(--primary);
|
||||
color: var(--primary-inverse) !important;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card:hover .card-header a.collapsed {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
255
resources/assets/css/demos/demo-education.css
Normal file
255
resources/assets/css/demos/demo-education.css
Normal file
@ -0,0 +1,255 @@
|
||||
.custom-bg-color-grey-1 {
|
||||
background-color: #f4f4f4 !important;
|
||||
}
|
||||
|
||||
.custom-font-1 {
|
||||
font-family: Georgia, serif !important;
|
||||
}
|
||||
|
||||
/* Slider */
|
||||
.custom-slider-el-1 {
|
||||
max-width: 30%;
|
||||
right: 12%;
|
||||
}
|
||||
|
||||
.custom-slider-el-2 {
|
||||
max-width: 30%;
|
||||
left: 12%;
|
||||
}
|
||||
|
||||
.custom-slider-text-1 {
|
||||
font-size: 100px;
|
||||
text-transform: none;
|
||||
letter-spacing: 0.01em;
|
||||
}
|
||||
|
||||
.custom-slider-text-1 em {
|
||||
display: inline-block;
|
||||
font-style: normal;
|
||||
color: transparent;
|
||||
font-size: 155px;
|
||||
transform: rotate(-15deg);
|
||||
position: relative;
|
||||
top: 37px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-slider-text-1 {
|
||||
font-size: 40px;
|
||||
}
|
||||
.custom-slider-text-1 em {
|
||||
font-size: 45px;
|
||||
top: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Header Nav Main */
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Feature Boxes */
|
||||
.feature-box-steps .feature-box-step-number {
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.feature-box-steps .feature-box-step-number em {
|
||||
font-size: 44px;
|
||||
font-style: normal;
|
||||
display: block;
|
||||
margin-top: 32px;
|
||||
margin-right: 10px;
|
||||
color: var(--light);
|
||||
font-weight: bold;
|
||||
transform: rotate(-15deg);
|
||||
}
|
||||
|
||||
/* Courses */
|
||||
.custom-card-courses {
|
||||
border: 0 !important;
|
||||
}
|
||||
|
||||
.custom-card-courses .custom-card-courses-author {
|
||||
position: absolute;
|
||||
bottom: -30px;
|
||||
right: 20px;
|
||||
}
|
||||
|
||||
.custom-card-courses .custom-card-courses-author img {
|
||||
height: 60px;
|
||||
width: 60px;
|
||||
border-radius: 50% !important;
|
||||
}
|
||||
|
||||
/* Countdown */
|
||||
.countdown {
|
||||
min-height: 88px;
|
||||
}
|
||||
|
||||
/* Custom Elements */
|
||||
.custom-element {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.custom-element.custom-element-pos-1 {
|
||||
top: 30%;
|
||||
left: -35%;
|
||||
}
|
||||
|
||||
.custom-element.custom-element-pos-2 {
|
||||
bottom: -15%;
|
||||
right: -35%;
|
||||
}
|
||||
|
||||
.custom-element.custom-element-pos-3 {
|
||||
top: 30%;
|
||||
left: -35%;
|
||||
}
|
||||
|
||||
.custom-element.custom-element-pos-4 {
|
||||
top: -20%;
|
||||
right: -20%;
|
||||
}
|
||||
|
||||
/* Section Bacgrkound */
|
||||
@media (max-width: 991px) {
|
||||
.custom-section-background-1 {
|
||||
padding-bottom: 35% !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-section-background-2 {
|
||||
padding-bottom: 35% !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Breadcrumb */
|
||||
.breadcrumb > li {
|
||||
font-size: 0.9em;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/* Course Details */
|
||||
.custom-course-detail .custom-course-detail-avatar {
|
||||
max-height: 80px;
|
||||
max-width: 80px;
|
||||
border-radius: 50% !important;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-course-detail .border-right {
|
||||
border: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Course Details */
|
||||
@media (max-width: 767px) {
|
||||
.custom-instructor-details .border-right {
|
||||
border: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Custom Accordion Style */
|
||||
.custom-accordion-style-1 > .card {
|
||||
border: 1px solid transparent !important;
|
||||
transition: ease border-color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a {
|
||||
position: relative;
|
||||
padding: 23px 30px;
|
||||
background-color: var(--light);
|
||||
transition: ease background-color 300ms, ease color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a:after {
|
||||
content: '+';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 25px;
|
||||
font-size: inherit;
|
||||
font-weight: inherit;
|
||||
transform: translate3d(0, -50%, 0) rotate(45deg);
|
||||
transform-origin: 50% 50%;
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a.collapsed:after {
|
||||
transform: translate3d(0, -50%, 0) rotate(0deg);
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card + .card {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
/* Form */
|
||||
.custom-form-style-1 .form-control {
|
||||
height: calc(1.8em + 1.85rem + 2px);
|
||||
padding: 15.6px 20px;
|
||||
padding: 0.975rem 1.25rem;
|
||||
background: var(--grey-100) !important;
|
||||
border-color: var(--grey-100) !important;
|
||||
line-height: 1.5 !important;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:focus {
|
||||
border-color: var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-webkit-input-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-moz-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:-ms-input-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select {
|
||||
color: #495057;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select option {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select option[selected] {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 textarea.form-control {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li > a,
|
||||
#header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li > a {
|
||||
color: var(--secondary);
|
||||
}
|
||||
}
|
||||
|
||||
/* Slider */
|
||||
.custom-slider-text-1 em {
|
||||
-webkit-text-stroke: 2px var(--primary);
|
||||
text-stroke: 2px var(--primary);
|
||||
}
|
||||
|
||||
/* Feature Boxes */
|
||||
.feature-box-steps .feature-box-step-number em {
|
||||
-webkit-text-stroke: 2px var(--primary);
|
||||
text-stroke: 2px var(--primary);
|
||||
}
|
||||
|
||||
/* Custom Nav */
|
||||
.custom-nav-secondary.owl-carousel.nav-style-1 .owl-nav .owl-prev,
|
||||
.custom-nav-secondary.owl-carousel.nav-style-1 .owl-nav .owl-next {
|
||||
color: var(--secondary) !important;
|
||||
}
|
||||
292
resources/assets/css/demos/demo-event.css
Normal file
292
resources/assets/css/demos/demo-event.css
Normal file
@ -0,0 +1,292 @@
|
||||
h2 {
|
||||
text-transform: uppercase;
|
||||
color: var(--default);
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 16px;
|
||||
margin: 0 0 5px 0;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
text-transform: none;
|
||||
font-weight: 700;
|
||||
font-size: 32px;
|
||||
line-height: 32px;
|
||||
margin: 0 0 5px 0;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
text-transform: none;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-hero {
|
||||
background-size: auto;
|
||||
background-position: 100% 0;
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.custom-hero-play {
|
||||
position: relative;
|
||||
top: -18px;
|
||||
}
|
||||
|
||||
.custom-hero-heading {
|
||||
font-size: 4.2vw;
|
||||
text-transform: uppercase;
|
||||
color: var(--light);
|
||||
font-weight: bold;
|
||||
line-height: 4.2vw;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.custom-hero-heading em {
|
||||
font-style: normal;
|
||||
color: transparent;
|
||||
-webkit-text-stroke: 1.2px #FFF;
|
||||
text-stroke: 2px #FFF;
|
||||
}
|
||||
|
||||
@media (max-width: 1400px) {
|
||||
.custom-hero-heading {
|
||||
font-size: 6.5vw;
|
||||
line-height: 6.5vw;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-hero-heading {
|
||||
font-size: 8.5vw;
|
||||
line-height: 8.5vw;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-row-about .col-12 {
|
||||
height: 520px;
|
||||
}
|
||||
|
||||
.custom-col-about-bg {
|
||||
height: 520px;
|
||||
background-size: auto;
|
||||
background-position: 100% 0;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-col-about-bg {
|
||||
background-size: cover;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-col-about-carousel {
|
||||
height: auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-col-about-bg-text,
|
||||
.custom-about-play-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.custom-about-play-icon {
|
||||
left: 50%;
|
||||
transform: translate(50%, -50%);
|
||||
margin: 0 0 0 -62px;
|
||||
}
|
||||
|
||||
.custom-carousel-bg {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100% !important;
|
||||
top: 0;
|
||||
left: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-carousel-bg img {
|
||||
width: auto !important;
|
||||
min-height: 520px !important;
|
||||
}
|
||||
}
|
||||
|
||||
section.custom-timeline {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
section.custom-timeline {
|
||||
padding-left: 90px;
|
||||
}
|
||||
}
|
||||
|
||||
section.custom-timeline:before {
|
||||
left: 145px;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
section.custom-timeline:before {
|
||||
left: 55px;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
section.custom-timeline .timeline-date {
|
||||
margin: 0 0 30px 0;
|
||||
width: 115px;
|
||||
height: 115px;
|
||||
text-align: center;
|
||||
line-height: 115px;
|
||||
border-radius: 100%;
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
padding: 0;
|
||||
margin-left: -3px;
|
||||
}
|
||||
|
||||
section.custom-timeline .timeline-date h3 {
|
||||
display: block;
|
||||
font-size: 22px;
|
||||
line-height: 22px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
transform: translateY(-50%);
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
section.custom-timeline .timeline-date h3 span {
|
||||
font-size: 12px;
|
||||
display: block;
|
||||
opacity: 0.7;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
section.custom-timeline .timeline-box {
|
||||
min-height: 90px;
|
||||
background: #f4f4f4;
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
section.custom-timeline .timeline-box.right {
|
||||
margin-top: 0;
|
||||
width: 80%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
section.custom-timeline .timeline-box.right {
|
||||
width: 88%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
section.custom-timeline .timeline-box.right {
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
section.custom-timeline .timeline-box.right {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
section.custom-timeline .timeline-box.right:before {
|
||||
left: 55px;
|
||||
}
|
||||
|
||||
section.custom-timeline .timeline-box.right .timeline-box-arrow {
|
||||
background: #f4f4f4;
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
section.custom-timeline .timeline-box.right .timeline-box-arrow {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
section.custom-timeline .timeline-box-time {
|
||||
font-size: 14px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
section.custom-timeline .timeline-box-time {
|
||||
position: absolute;
|
||||
left: -20px;
|
||||
margin-top: 22px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
section.custom-timeline .timeline-box-content {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
section.custom-timeline .timeline-box-content p {
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
section.custom-timeline .timeline-box-content-img {
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
overflow: hidden;
|
||||
border-radius: 100%;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
section.custom-timeline .timeline-box-content-img img {
|
||||
width: 115px;
|
||||
max-width: initial;
|
||||
position: relative;
|
||||
left: -25%;
|
||||
}
|
||||
|
||||
.custom-venue-info {
|
||||
border-radius: 10px;
|
||||
background: var(--light);
|
||||
height: 350px;
|
||||
box-shadow: 0px 20px 100px 0 rgba(0, 0, 0, 0.1);
|
||||
margin-bottom: -175px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.custom-venue-info img {
|
||||
border-radius: 10px 0 0 10px;
|
||||
min-height: 350px;
|
||||
}
|
||||
|
||||
.custom-venue-info:after {
|
||||
transform: rotate(45deg);
|
||||
content: '';
|
||||
display: block;
|
||||
background: var(--light);
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
z-index: 0;
|
||||
position: absolute;
|
||||
bottom: -25px;
|
||||
left: 50%;
|
||||
margin-left: -25px;
|
||||
}
|
||||
91
resources/assets/css/demos/demo-finance.css
Normal file
91
resources/assets/css/demos/demo-finance.css
Normal file
@ -0,0 +1,91 @@
|
||||
.custom-font-size-1 {
|
||||
font-size: 12.8px;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-mobile-remove-divider-left-border {
|
||||
border-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* Header */
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
/* Parallax*/
|
||||
.custom-parallax-bg-pos-left {
|
||||
background-position-x: 0% !important;
|
||||
}
|
||||
|
||||
.custom-parallax-medium-padding {
|
||||
padding: 128px 0 !important;
|
||||
}
|
||||
|
||||
.custom-parallax-big-padding {
|
||||
padding: 25vh 0 !important;
|
||||
}
|
||||
|
||||
/* Overlay */
|
||||
.custom-overlay-opacity-95:before {
|
||||
opacity: 0.95 !important;
|
||||
}
|
||||
|
||||
/* Process */
|
||||
.process.custom-process .process-step:hover .process-step-circle .process-step-circle-content svg path, .process.custom-process .process-step:hover .process-step-circle .process-step-circle-content svg polyline, .process.custom-process .process-step:hover .process-step-circle .process-step-circle-content svg line {
|
||||
stroke: #FFF !important;
|
||||
}
|
||||
|
||||
.process.custom-process .process-step:hover .process-step-circle .process-step-circle-content svg[data-filename="people.svg"] path, .process.custom-process .process-step:hover .process-step-circle .process-step-circle-content svg[data-filename="people.svg"] polyline, .process.custom-process .process-step:hover .process-step-circle .process-step-circle-content svg[data-filename="people.svg"] line {
|
||||
stroke: inherit !important;
|
||||
fill: #FFF !important;
|
||||
}
|
||||
|
||||
.process.custom-process .process-step .process-step-circle {
|
||||
width: 115px;
|
||||
height: 115px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.process .process-step:before {
|
||||
background-color: #d6dde5;
|
||||
}
|
||||
}
|
||||
|
||||
/* Testimonial */
|
||||
.custom-testimonial-style-1.testimonial-style-2 .testimonial-author > img {
|
||||
max-width: 120px;
|
||||
max-height: none;
|
||||
height: auto;
|
||||
-o-object-fit: cover;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1.testimonial-with-quotes blockquote:before {
|
||||
top: -15px;
|
||||
}
|
||||
|
||||
/* Progress Bars */
|
||||
.custom-progress-bars-style-1 .progress {
|
||||
background-color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
#footer p, #footer span, #footer li, #footer a:not(.btn):not(.no-footer-css) {
|
||||
color: #888888;
|
||||
}
|
||||
|
||||
#footer p:hover, #footer span:hover, #footer li:hover, #footer a:not(.btn):not(.no-footer-css):hover {
|
||||
color: #212121;
|
||||
}
|
||||
|
||||
#footer .footer-copyright p {
|
||||
color: #888888;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
/* Footer */
|
||||
#footer p:hover, #footer span:hover, #footer li:hover, #footer a:not(.btn):not(.no-footer-css):hover {
|
||||
color: var(--primary);
|
||||
}
|
||||
694
resources/assets/css/demos/demo-gym.css
Normal file
694
resources/assets/css/demos/demo-gym.css
Normal file
@ -0,0 +1,694 @@
|
||||
body {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin: 0 0 17px 0;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1.6em;
|
||||
letter-spacing: -1px;
|
||||
}
|
||||
|
||||
.btn-join-now {
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
flex-direction: column;
|
||||
padding: 24px;
|
||||
padding: 1.5rem;
|
||||
margin-right: -24px;
|
||||
}
|
||||
|
||||
.col-5ths,
|
||||
.col-sm-5ths,
|
||||
.col-md-5ths,
|
||||
.col-lg-5ths {
|
||||
position: relative;
|
||||
min-height: 1px;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.col-5ths {
|
||||
width: 20%;
|
||||
float: left;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.col-sm-5ths {
|
||||
width: 20%;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.col-md-5ths {
|
||||
width: 20%;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.col-lg-5ths {
|
||||
width: 20%;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-font-weight-medium {
|
||||
font-weight: 500 !important;
|
||||
}
|
||||
|
||||
.custom-text-color-1 {
|
||||
color: #ebebeb !important;
|
||||
}
|
||||
|
||||
.custom-font-style-1 {
|
||||
font-size: 2.7em;
|
||||
letter-spacing: -1px;
|
||||
margin: 40px 0px 20px;
|
||||
}
|
||||
|
||||
.custom-font-style-2 {
|
||||
font-size: 1.3em;
|
||||
letter-spacing: -1px;
|
||||
margin-bottom: 50px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.custom-btn-style-1 {
|
||||
padding: 13px 25px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.custom-btn-style-2 {
|
||||
width: 100%;
|
||||
padding: 10px 25px;
|
||||
}
|
||||
|
||||
.custom-btn-style-3 {
|
||||
padding: 10px 40px;
|
||||
}
|
||||
|
||||
.custom-btn-style-4 {
|
||||
position: absolute !important;
|
||||
bottom: 45px;
|
||||
left: 45px;
|
||||
padding: 10px 40px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-position-style-1 {
|
||||
position: absolute;
|
||||
top: 86px;
|
||||
z-index: 1;
|
||||
right: 15px;
|
||||
}
|
||||
|
||||
.custom-title-position-1 {
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
padding: 45px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-position-style-2 {
|
||||
position: static;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-position-style-1 {
|
||||
position: static;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-sm-margin-1 {
|
||||
margin-top: 30px;
|
||||
}
|
||||
.custom-sm-margin-2 {
|
||||
margin-top: 60px;
|
||||
}
|
||||
.custom-sm-mb-0 {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-xs-margin-1 {
|
||||
margin-top: 30px;
|
||||
}
|
||||
.custom-xs-margin-2 {
|
||||
margin-top: 60px;
|
||||
}
|
||||
.custom-xs-margin-3 {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-padding-top-1 {
|
||||
padding-top: 110px !important;
|
||||
}
|
||||
|
||||
.custom-squared-section {
|
||||
height: 22vw;
|
||||
min-height: 390px;
|
||||
}
|
||||
|
||||
.custom-wide-section {
|
||||
height: 16.6vw;
|
||||
min-height: 290px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-squared-section {
|
||||
height: 44vw;
|
||||
max-height: 350px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-squared-section {
|
||||
height: 82vw;
|
||||
max-height: 330px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-small-section-padding {
|
||||
padding: 45px;
|
||||
}
|
||||
|
||||
.custom-small-section-padding-2 {
|
||||
padding: 8%;
|
||||
}
|
||||
|
||||
.custom-overlay-style-1 {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.custom-overlay-style-1:before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
box-shadow: 30px 0px 220px 220px rgba(244, 84, 76, 0.9);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.custom-overlay-style-1:after {
|
||||
content: '';
|
||||
display: block;
|
||||
background: rgba(244, 84, 76, 0.4);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.custom-overlay-style-1 > * {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-overlay-style-2 {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.custom-overlay-style-2:before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: rgba(17, 17, 19, 0.6);
|
||||
}
|
||||
|
||||
.custom-overlay-style-2 > * {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#header .header-nav-main.header-nav-main-slide nav > ul > li > span > a {
|
||||
text-transform: none;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#header .header-nav-main.header-nav-main-slide nav > ul > li > span > a i {
|
||||
margin-left: 5px;
|
||||
font-size: 0.7em;
|
||||
}
|
||||
|
||||
#header.header-floating-bar-static-sticky .header-body {
|
||||
position: fixed !important;
|
||||
border-bottom: none !important;
|
||||
width: 100% !important;
|
||||
max-width: 100% !important;
|
||||
top: 0 !important;
|
||||
}
|
||||
|
||||
.owl-carousel .owl-item > div {
|
||||
width: calc(100% + 2px);
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots-style-1 .owl-dots button.owl-dot span {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
background: transparent !important;
|
||||
border: 2px solid #FFF;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots-style-1 .owl-dots button.owl-dot span:before {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 3px;
|
||||
height: 3px;
|
||||
background: var(--light);
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots-style-1 .owl-dots button.owl-dot:hover span, .owl-carousel.custom-dots-style-1 .owl-dots button.owl-dot.active span {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots-style-2 .owl-dots button.owl-dot span {
|
||||
width: 20px;
|
||||
height: 12px;
|
||||
background: #FFF !important;
|
||||
border-radius: 25px;
|
||||
margin: 2px;
|
||||
transition: ease width 300ms, ease opacity 300ms;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots-style-2 .owl-dots button.owl-dot.active span {
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots-style-2 .owl-dots button.owl-dot:hover span {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots-position-1 .owl-dots {
|
||||
position: absolute;
|
||||
top: 259px;
|
||||
left: 82px;
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots-bottom-left-1 .owl-dots {
|
||||
text-align: left;
|
||||
padding-left: 40px;
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-dots-bottom-center-1 .owl-dots {
|
||||
position: relative;
|
||||
margin-top: -30px !important;
|
||||
padding-bottom: 10px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-arrows-style-1 .owl-nav {
|
||||
margin-top: -10px;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-arrows-style-1 .owl-nav button.owl-prev, .owl-carousel.custom-arrows-style-1 .owl-nav button.owl-next {
|
||||
height: 80px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.owl-carousel.custom-arrows-style-1 .owl-nav button.owl-prev::before, .owl-carousel.custom-arrows-style-1 .owl-nav button.owl-next::before {
|
||||
font-family: simple-line-icons;
|
||||
top: auto;
|
||||
content: "\e605";
|
||||
}
|
||||
|
||||
.owl-carousel.custom-arrows-style-1 .owl-nav button.owl-next::before {
|
||||
content: "\e606";
|
||||
}
|
||||
|
||||
/*
|
||||
* Rev Slider
|
||||
*/
|
||||
.custom-tp-bullets {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.custom-tp-bullets .tp-bullet {
|
||||
position: static;
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 12px;
|
||||
border-radius: 25px;
|
||||
margin-left: 4px;
|
||||
transition: ease width 300ms;
|
||||
}
|
||||
|
||||
.custom-tp-bullets .tp-bullet.selected {
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
/*
|
||||
* About Us
|
||||
*/
|
||||
.custom-join-now-form form .form-control {
|
||||
font-size: 12px;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.custom-thumb-info-1 {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.custom-thumb-info-1:hover .thumb-info-wrapper {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.custom-thumb-info-1:hover .thumb-info-wrapper .thumb-info-plus {
|
||||
opacity: 1;
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.custom-thumb-info-1:hover .thumb-info-wrapper .thumb-info-plus:after {
|
||||
transform: translate3d(-50%, -50%, 0) rotate(90deg);
|
||||
}
|
||||
|
||||
.custom-thumb-info-1 .thumb-info-wrapper {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.custom-thumb-info-1 .thumb-info-wrapper .thumb-info-plus {
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
width: 10%;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
z-index: 2;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
transition: ease all 0.3s;
|
||||
}
|
||||
|
||||
.custom-thumb-info-1 .thumb-info-wrapper .thumb-info-plus:before, .custom-thumb-info-1 .thumb-info-wrapper .thumb-info-plus:after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
border-top: 2px solid #F4544C;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
|
||||
.custom-thumb-info-1 .thumb-info-wrapper .thumb-info-plus:after {
|
||||
transform: translate3d(-50%, -50%, 0) rotate(0deg);
|
||||
}
|
||||
|
||||
/*
|
||||
* Packages / Classes / Facility / Working Hours
|
||||
*/
|
||||
.custom-list-style-1 {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.custom-list-style-1 li {
|
||||
list-style: none;
|
||||
line-height: 36px;
|
||||
}
|
||||
|
||||
.custom-list-style-1 li .custom-list-item {
|
||||
display: inline-block;
|
||||
width: 210px;
|
||||
}
|
||||
|
||||
.custom-list-style-1 li .custom-list-item.custom-list-item-spacing-2 {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.custom-list-style-1 li .custom-list-item img.custom-icon {
|
||||
width: auto;
|
||||
margin-right: 15px;
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.custom-list-style-1 li .custom-list-item.custom-spacing-1 {
|
||||
width: 130px;
|
||||
}
|
||||
|
||||
.custom-list-style-1.custom-space-1 {
|
||||
margin-top: 55px;
|
||||
}
|
||||
|
||||
@media (max-width: 1360px) {
|
||||
.custom-list-style-1 li .custom-list-item {
|
||||
width: 140px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-thumb-info-2 {
|
||||
border: none;
|
||||
overflow: visible;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.custom-thumb-info-2 .thumb-info-caption {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.custom-thumb-info-2 .thumb-info-caption a.btn {
|
||||
position: absolute;
|
||||
bottom: -25px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
/*
|
||||
* Classes Detail
|
||||
*/
|
||||
.custom-item-detail-gallery li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* Pricing
|
||||
*/
|
||||
.custom-pricing-list {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.custom-pricing-list li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* Testimonial
|
||||
*/
|
||||
.custom-section-featured-image {
|
||||
position: relative;
|
||||
padding: 90px 0px !important;
|
||||
margin: 50px 0px 0px 0px !important;
|
||||
}
|
||||
|
||||
.custom-section-featured-image .custom-image-container {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-width: 1170px;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.custom-section-featured-image .custom-image-container img {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
height: 100%;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1 blockquote {
|
||||
padding: 36px 20px !important;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1 blockquote:before, .custom-testimonial-style-1 blockquote:after {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1 blockquote p {
|
||||
font-family: "Poppins", sans-serif;
|
||||
font-size: 17px;
|
||||
font-weight: 300;
|
||||
font-style: normal;
|
||||
line-height: 1.8;
|
||||
color: #c4c7ca !important;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1 .testimonial-author p {
|
||||
color: #c4c7ca;
|
||||
font-size: 19px;
|
||||
text-align: left !important;
|
||||
padding-left: 60px !important;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1 .testimonial-author span {
|
||||
font-size: 17px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Contact Us
|
||||
*/
|
||||
.custom-location {
|
||||
padding-left: 50px;
|
||||
}
|
||||
|
||||
.custom-location > img {
|
||||
position: absolute;
|
||||
top: 17px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control {
|
||||
font-size: 12px;
|
||||
border: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* Resources / Instagram
|
||||
*/
|
||||
.custom-resources-style .number {
|
||||
position: absolute;
|
||||
left: 1px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 100%;
|
||||
text-align: center;
|
||||
line-height: 33px;
|
||||
}
|
||||
|
||||
.custom-resources-style .content {
|
||||
display: block;
|
||||
padding-left: 40px;
|
||||
}
|
||||
|
||||
.custom-resources-style .content .title {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.custom-resources-style .content p {
|
||||
color: #ebebeb;
|
||||
}
|
||||
|
||||
.instagram-button {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: #5081aa;
|
||||
padding: 10px;
|
||||
font-size: 24px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/*
|
||||
* Map
|
||||
*/
|
||||
.map-info-box .map-info-box-image {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 120%;
|
||||
top: 50%;
|
||||
right: -107%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.gm-style .gm-style-iw {
|
||||
overflow: visible !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer {
|
||||
margin-top: 0;
|
||||
padding: 50px 0px;
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
#footer p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#footer .container .row > div {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.social-icons.custom-social-icons li {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.social-icons.custom-social-icons li a {
|
||||
background: transparent !important;
|
||||
font-size: 17px;
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
.social-icons.custom-social-icons li:hover a {
|
||||
background: transparent !important;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
html #header.custom-header-style-1 .header-body .header-nav-main nav > ul > li > span .item-two {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
html #header.custom-header-style-1 .custom-sm-btn-header-style-1 > .btn:not(.header-btn-collapse-nav) {
|
||||
color: var(--primary);
|
||||
}
|
||||
html #header.custom-header-style-1 .custom-sm-btn-header-style-1 > .btn:not(.header-btn-collapse-nav):hover {
|
||||
color: var(--light);
|
||||
}
|
||||
html #header.custom-header-style-1 .header-body .header-nav-main nav > ul > li > a.item-original.active {
|
||||
color: var(--primary);
|
||||
}
|
||||
}
|
||||
|
||||
.custom-overlay-style-1:before {
|
||||
box-shadow: 30px 0px 220px 220px var(--primary-rgba-90);
|
||||
}
|
||||
|
||||
.custom-overlay-style-1:after {
|
||||
background: var(--primary-rgba-40);
|
||||
}
|
||||
|
||||
.custom-overlay-style-2:before {
|
||||
background: var(--quaternary-rgba-60);
|
||||
}
|
||||
|
||||
.custom-thumb-info-1 .thumb-info-wrapper:after {
|
||||
background: var(--quaternary-rgba-80);
|
||||
}
|
||||
|
||||
.owl-carousel.custom-arrows-style-1 .owl-nav button[class*="owl-"] {
|
||||
background-color: var(--quaternary);
|
||||
}
|
||||
|
||||
.owl-carousel.custom-arrows-style-1 .owl-nav button[class*="owl-"]:active:hover, .owl-carousel.custom-arrows-style-1 .owl-nav button[class*="owl-"]:active:focus {
|
||||
background-color: var(--quaternary);
|
||||
}
|
||||
376
resources/assets/css/demos/demo-hotel.css
Normal file
376
resources/assets/css/demos/demo-hotel.css
Normal file
@ -0,0 +1,376 @@
|
||||
html.boxed {
|
||||
background-image: url("../../img/demos/hotel/patterns/pattern.jpg") !important;
|
||||
}
|
||||
|
||||
h3 {
|
||||
text-transform: none;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
html.boxed .body {
|
||||
border: 0 !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
@media (min-width: 999px) {
|
||||
html.boxed .body {
|
||||
margin-top: 90px;
|
||||
}
|
||||
}
|
||||
|
||||
#header .header-container {
|
||||
min-height: 125px !important;
|
||||
background: var(--light);
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
#header .header-container {
|
||||
padding: 0 .75rem !important;
|
||||
max-width: 1200px !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
#header .header-top .container {
|
||||
padding: 0 .75rem !important;
|
||||
max-width: 1200px !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
#header .header-body {
|
||||
border-bottom: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-body {
|
||||
overflow: visible !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
html.boxed #header {
|
||||
top: -65px;
|
||||
margin-bottom: -65px;
|
||||
}
|
||||
html.boxed #header .header-top {
|
||||
position: relative;
|
||||
top: -10px;
|
||||
background: transparent !important;
|
||||
}
|
||||
html.boxed #header .header-top .container {
|
||||
max-width: 1200px;
|
||||
}
|
||||
}
|
||||
|
||||
html.boxed #header .header-container {
|
||||
max-width: 100%;
|
||||
padding: 0 42.4px;
|
||||
padding: 0 2.65rem;
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
html.boxed #header .header-container {
|
||||
padding: 0 .75rem !important;
|
||||
max-width: 1200px !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 999px) {
|
||||
html.sticky-header-active #header .header-body {
|
||||
background: var(--light);
|
||||
}
|
||||
}
|
||||
|
||||
html.boxed.sticky-header-active #header .header-container {
|
||||
padding: 0 26.4px;
|
||||
padding: 0 1.65rem;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav nav > ul > li.dropdown-mega-book-now {
|
||||
position: relative !important;
|
||||
}
|
||||
#header .header-nav nav > ul > li.dropdown-mega-book-now .dropdown-menu {
|
||||
right: 0 !important;
|
||||
left: auto !important;
|
||||
max-width: 365px;
|
||||
width: 100%;
|
||||
transform: translate3d(0, -53px, 0) !important;
|
||||
margin: 0 !important;
|
||||
min-width: 300px;
|
||||
}
|
||||
#header .header-nav nav > ul > li:hover.dropdown-mega-book-now .dropdown-menu, #header .header-nav nav > ul > li.open.dropdown-mega-book-now .dropdown-menu {
|
||||
transform: translate3d(0, -44px, 0) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li.dropdown-mega-book-now > a > span,
|
||||
#header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li.dropdown-mega-book-now > a > span {
|
||||
color: var(--light);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
#header .header-container {
|
||||
min-height: 134px;
|
||||
}
|
||||
#header .header-nav nav > ul > li.dropdown-mega-book-now .form-control-custom .form-control {
|
||||
color: var(--default);
|
||||
margin-bottom: 5px;
|
||||
border: 1px solid #DDD !important;
|
||||
padding-left: 5px;
|
||||
}
|
||||
#header .header-nav nav > ul > li.dropdown-mega-book-now .form-control-custom .form-control::-webkit-input-placeholder {
|
||||
color: #777;
|
||||
}
|
||||
#header .header-nav nav > ul > li.dropdown-mega-book-now .form-control-custom .form-control::-moz-placeholder {
|
||||
color: #777;
|
||||
}
|
||||
#header .header-nav nav > ul > li.dropdown-mega-book-now .form-control-custom .form-control:-ms-input-placeholder {
|
||||
color: #777;
|
||||
}
|
||||
#header .header-nav nav > ul > li.dropdown-mega-book-now .dropdown-mega-content {
|
||||
padding: 10px 0;
|
||||
color: var(--default);
|
||||
margin-left: -20px;
|
||||
}
|
||||
}
|
||||
|
||||
.rev_slider:after {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
pointer-events: none;
|
||||
z-index: 99;
|
||||
background: rgba(34, 37, 41, 0.3);
|
||||
}
|
||||
|
||||
.owl-carousel-mini-dots .owl-dots button.owl-dot span {
|
||||
background: transparent;
|
||||
border: 1px solid #FFF;
|
||||
}
|
||||
|
||||
.owl-carousel-mini-dots .owl-dots button.owl-dot.active span,
|
||||
.owl-carousel-mini-dots .owl-dots button.owl-dot:hover span {
|
||||
background: #FFF !important;
|
||||
}
|
||||
|
||||
.form-control-custom .form-control {
|
||||
background: transparent;
|
||||
border: 0;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.25) !important;
|
||||
box-shadow: none !important;
|
||||
color: var(--light);
|
||||
padding-left: 0;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.form-control-custom .form-control::-webkit-input-placeholder {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.form-control-custom .form-control::-moz-placeholder {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.form-control-custom .form-control:-ms-input-placeholder {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.form-control-custom .form-control option {
|
||||
background: var(--light);
|
||||
color: var(--default);
|
||||
}
|
||||
|
||||
.form-control-datepicker-custom {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.form-control-datepicker-custom:before {
|
||||
position: absolute;
|
||||
font-family: simple-line-icons;
|
||||
content: "\e075";
|
||||
font-size: 10px;
|
||||
top: 3px;
|
||||
font-size: 14px;
|
||||
color: var(--light);
|
||||
z-index: 1;
|
||||
right: 3px;
|
||||
}
|
||||
|
||||
.form-control-datepicker-custom input {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.form-control-custom-dark .form-control {
|
||||
border-bottom: 1px solid var(--grey-500) !important;
|
||||
color: var(--default);
|
||||
}
|
||||
|
||||
.form-control-custom-dark .form-control::-webkit-input-placeholder {
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.form-control-custom-dark .form-control::-moz-placeholder {
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.form-control-custom-dark .form-control:-ms-input-placeholder {
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.form-control-custom-dark .form-control option {
|
||||
background: #DDD;
|
||||
color: var(--default);
|
||||
}
|
||||
|
||||
.form-control-custom-dark.form-control-datepicker-custom:before {
|
||||
color: var(--default);
|
||||
}
|
||||
|
||||
.datepicker .disabled, .datepicker .disabled:hover {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.box-shadow-custom {
|
||||
box-shadow: 10px 10px 100px -15px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.micro-map .micro-map-map {
|
||||
float: left;
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.micro-map .micro-map-info {
|
||||
float: left;
|
||||
width: 60%;
|
||||
min-height: 260px;
|
||||
}
|
||||
|
||||
.micro-map .micro-map-info-detail {
|
||||
clear: both;
|
||||
padding: 25px;
|
||||
}
|
||||
|
||||
.custom-room-suite-info::after {
|
||||
clear: both;
|
||||
content: "";
|
||||
display: block;
|
||||
}
|
||||
|
||||
.custom-room-suite-info ul {
|
||||
margin: 10px 0 30px;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.custom-room-suite-info ul li {
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
}
|
||||
|
||||
.custom-room-suite-info ul li label {
|
||||
display: inline-block;
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
margin: 0;
|
||||
opacity: 0.7;
|
||||
padding: 0;
|
||||
text-align: left;
|
||||
text-transform: uppercase;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.custom-room-suite-info ul li span {
|
||||
display: inline-block;
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
line-height: 14px;
|
||||
margin: 0 -10px 0 -5px;
|
||||
padding: 0;
|
||||
width: 50%;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.custom-room-suite-info ul li strong {
|
||||
display: inline-block;
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
line-height: 14px;
|
||||
margin: 0 -10px 0 -5px;
|
||||
padding: 0;
|
||||
width: 50%;
|
||||
text-align: right;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
padding: 15px 0;
|
||||
}
|
||||
|
||||
.custom-room-suite-info ul li .room-suite-info-detail {
|
||||
float: left;
|
||||
font-size: 11px;
|
||||
margin: 7px 0 0;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.custom-room-suite-info ul li .room-suite-info-book {
|
||||
float: right;
|
||||
font-size: 12px;
|
||||
margin: 7px 0 0;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.custom-room-suite-info ul li .room-suite-info-book-now {
|
||||
float: right;
|
||||
margin: 7px 0 50px;
|
||||
}
|
||||
|
||||
.custom-room-suite-info ul li:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
#footer {
|
||||
border: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
#footer .feature-box .feature-box-icon {
|
||||
min-width: auto;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
html.boxed .footer-copyright {
|
||||
padding-top: 0;
|
||||
}
|
||||
html.boxed .footer-copyright .container:not(.container-bs):not(.container-xl-custom):not(.container-xxl-custom) {
|
||||
max-width: 1200px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li.dropdown-mega-book-now > a > span,
|
||||
#header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li.dropdown-mega-book-now > a > span {
|
||||
background: var(--primary);
|
||||
}
|
||||
}
|
||||
|
||||
.custom-nav-sidebar > li > a.active {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
569
resources/assets/css/demos/demo-industry-factory.css
Normal file
569
resources/assets/css/demos/demo-industry-factory.css
Normal file
@ -0,0 +1,569 @@
|
||||
body {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.container {
|
||||
max-width: 1200px !important;
|
||||
}
|
||||
}
|
||||
|
||||
[class*="text-color-hover-"] {
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
[class*="bg-color-hover-"] {
|
||||
transition: ease background 300ms;
|
||||
}
|
||||
|
||||
.bg-color-hover-primary:hover [class*="opacity-"] {
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
.custom-font-secondary {
|
||||
font-family: 'Playfair Display', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-bg-lighten-grey-1 {
|
||||
background: #4d4e50 !important;
|
||||
}
|
||||
|
||||
.custom-font-size-1 {
|
||||
font-size: 1.4em !important;
|
||||
}
|
||||
|
||||
.custom-font-size-2 {
|
||||
font-size: 1.35em !important;
|
||||
}
|
||||
|
||||
.custom-font-size-3 {
|
||||
font-size: 1.15em !important;
|
||||
}
|
||||
|
||||
.custom-positive-ls-5px {
|
||||
letter-spacing: 5px !important;
|
||||
}
|
||||
|
||||
.custom-svg-btn-style-1 {
|
||||
position: relative;
|
||||
padding: 19px 60px 19px 50px;
|
||||
font-weight: 700;
|
||||
font-size: 13.6px;
|
||||
font-size: 0.85rem;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-svg-btn-style-1 .custom-svg-btn-background {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
z-index: 0;
|
||||
width: 107%;
|
||||
height: 120%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.custom-svg-btn-style-1 .custom-svg-btn-background polygon {
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
.custom-svg-btn-style-1 .custom-svg-btn-arrow {
|
||||
margin-left: 6px;
|
||||
}
|
||||
|
||||
.custom-svg-btn-style-1.custom-svg-btn-style-1-small {
|
||||
padding: 18px 31px 18px 25px;
|
||||
font-size: 12.8px;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.custom-svg-btn-style-1.custom-svg-btn-style-1-light .custom-svg-btn-background polygon {
|
||||
fill: transparent;
|
||||
stroke: #FFF;
|
||||
}
|
||||
|
||||
.custom-svg-btn-style-1.custom-svg-btn-style-1-light:hover .custom-svg-btn-background polygon {
|
||||
fill: #FFF;
|
||||
}
|
||||
|
||||
.custom-svg-btn-style-1.custom-svg-btn-style-1-light.custom-svg-btn-style-1-light-solid .custom-svg-btn-background {
|
||||
transition: ease opacity 300ms;
|
||||
}
|
||||
|
||||
.custom-svg-btn-style-1.custom-svg-btn-style-1-light.custom-svg-btn-style-1-light-solid .custom-svg-btn-background polygon {
|
||||
fill: #FFF;
|
||||
}
|
||||
|
||||
.custom-svg-btn-style-1.custom-svg-btn-style-1-light.custom-svg-btn-style-1-light-solid:hover .custom-svg-btn-background {
|
||||
opacity: 0.95;
|
||||
}
|
||||
|
||||
.custom-read-more > svg {
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-read-more:hover > svg {
|
||||
transform: translate3d(6px, 0, 0);
|
||||
}
|
||||
|
||||
.custom-container-absolute-centered-x {
|
||||
position: absolute !important;
|
||||
left: 50%;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
}
|
||||
|
||||
.custom-min-height-1 {
|
||||
min-height: 277px;
|
||||
}
|
||||
|
||||
.owl-carousel.custom-stage-outer-box-shadow .owl-stage-outer {
|
||||
box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
|
||||
.custom-table-style-1 thead tr {
|
||||
background: #4d4e50;
|
||||
}
|
||||
|
||||
.custom-table-style-1 thead th {
|
||||
border-top: 0;
|
||||
border-bottom: 0;
|
||||
color: var(--light);
|
||||
font-weight: 700;
|
||||
font-size: 17.6px;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
.custom-table-style-1 th, .custom-table-style-1 td {
|
||||
padding: 15px 20px;
|
||||
}
|
||||
|
||||
.custom-table-style-1 td:first-child {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@media (min-width: 2000px) {
|
||||
.shape-divider svg {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.featured-box.custom-featured-box-with-video > .custom-featured-box-video {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
z-index: 1;
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
.featured-box.custom-featured-box-with-video > .custom-featured-box-video.active {
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.featured-box.custom-featured-box-with-video .featured-box-background {
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.featured-box.custom-featured-box-with-video .featured-box-background.hide {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.featured-box.custom-featured-box-with-video .box-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 301px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.featured-box.custom-featured-box-with-video .box-content {
|
||||
height: 227px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.featured-box.custom-featured-box-with-video .box-content {
|
||||
height: 386px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.featured-box.custom-featured-box-with-video .box-content {
|
||||
height: 285px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.featured-box.custom-featured-box-with-video .box-content {
|
||||
height: 0;
|
||||
padding-top: 28%;
|
||||
padding-bottom: 28%;
|
||||
}
|
||||
}
|
||||
|
||||
.featured-box.custom-featured-box-with-video .box-content.hide {
|
||||
opacity: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
padding: 0 1.3rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
#header.header-effect-shrink .header-container {
|
||||
min-height: 110px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Home Section - Hero
|
||||
*/
|
||||
.custom-hero-sub-images-style-1 {
|
||||
position: absolute;
|
||||
top: 65%;
|
||||
left: 100%;
|
||||
width: 100%;
|
||||
min-height: 323px;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.custom-hero-sub-images-style-1:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 339px;
|
||||
height: 100%;
|
||||
background: var(--grey-500);
|
||||
opacity: 0.7;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-hero-sub-images-style-1:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 100%;
|
||||
width: 40vw;
|
||||
height: 100%;
|
||||
background: var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-hero-sub-images-style-1 .custom-hero-sub-images-shadow {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 0px;
|
||||
height: 60%;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-hero-sub-images-style-1 img {
|
||||
width: 640px;
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* Home Section - What We Do
|
||||
*/
|
||||
.custom-thumb-info-style-1 .custom-thumb-info-icon {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 40px 0;
|
||||
padding: 2.5rem 0;
|
||||
background: #4d4e50;
|
||||
transition: ease background 300ms;
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1 .custom-thumb-info-icon > img {
|
||||
width: auto;
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1 .thumb-info-wrapper {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1 .thumb-info-wrapper:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: #4d4e50;
|
||||
opacity: 0.7;
|
||||
transition: ease opacity 300ms;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1 .thumb-info-wrapper > img {
|
||||
filter: grayscale(1);
|
||||
transform: scale(1) !important;
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1:hover .custom-thumb-info-icon > img, .custom-thumb-info-style-1.active .custom-thumb-info-icon > img {
|
||||
animation: toRightFromLeftNoScale 0.3s forwards;
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1:hover .thumb-info-wrapper:after, .custom-thumb-info-style-1.active .thumb-info-wrapper:after {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1:hover .thumb-info-wrapper > img, .custom-thumb-info-style-1.active .thumb-info-wrapper > img {
|
||||
filter: grayscale(0);
|
||||
}
|
||||
|
||||
@keyframes toRightFromLeftNoScale {
|
||||
49% {
|
||||
transform: translate(100%) scale(1);
|
||||
}
|
||||
50% {
|
||||
opacity: 0;
|
||||
transform: translate(-100%) scale(1);
|
||||
}
|
||||
51% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Home Section - Special Services
|
||||
*/
|
||||
.custom-section-shape-background {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.custom-section-shape-background:before, .custom-section-shape-background:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 47.5%;
|
||||
width: 50vw;
|
||||
height: 100%;
|
||||
background: var(--light);
|
||||
transform: skewX(21deg);
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-section-shape-background:after {
|
||||
left: 49.5%;
|
||||
transform: skewX(-21deg);
|
||||
}
|
||||
|
||||
.custom-section-shape-background .custom-shape-divider {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-section-shape-background .custom-shape-divider:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -150px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 150%;
|
||||
background: var(--grey-100);
|
||||
transform: skewY(-4deg);
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-section-shape-background.custom-section-shape-background-reverse:before {
|
||||
left: auto;
|
||||
right: 49.5%;
|
||||
transform: skewX(21deg) rotate(180deg);
|
||||
}
|
||||
|
||||
.custom-section-shape-background.custom-section-shape-background-reverse:after {
|
||||
left: auto;
|
||||
right: 50.5%;
|
||||
transform: skewX(-21deg) rotate(180deg);
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-section-shape-background:before, .custom-section-shape-background:after {
|
||||
width: 100vw;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-list-icons-icon-size li > [class*="fa-"]:first-child,
|
||||
.custom-list-icons-icon-size li > .icons:first-child, .custom-list-icons-icon-size li a:first-child > [class*="fa-"]:first-child,
|
||||
.custom-list-icons-icon-size li a:first-child > .icons:first-child {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Home Section - How We Work
|
||||
*/
|
||||
.custom-process-style-1 .process-step-circle {
|
||||
width: 110px;
|
||||
height: 110px;
|
||||
border-color: #d4d4d4 !important;
|
||||
}
|
||||
|
||||
.custom-process-style-1 .process-step-circle-content {
|
||||
font-size: 2.2em;
|
||||
}
|
||||
|
||||
/*
|
||||
* Home Section - Testimonials
|
||||
*/
|
||||
.custom-testimonial-style-1.testimonial.testimonial-style-3 blockquote {
|
||||
background: transparent !important;
|
||||
padding: 12px 40px;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1.testimonial.testimonial-style-3 blockquote:before {
|
||||
content: '\f10d';
|
||||
font-family: "Font Awesome 6 Free";
|
||||
font-weight: 900;
|
||||
font-size: 19.2px;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1.testimonial.testimonial-style-3 .testimonial-author {
|
||||
margin-left: 40px;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1.testimonial.testimonial-style-3 .testimonial-author img {
|
||||
max-width: 85px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Home Section - Contact Us / Send Message
|
||||
*/
|
||||
.custom-form-style-1 {
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control {
|
||||
height: calc(1.5em + 1.85rem + 2px);
|
||||
padding: 15.6px 20px;
|
||||
padding: 0.975rem 1.25rem;
|
||||
background: var(--grey-100);
|
||||
border-color: var(--grey-100);
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:focus {
|
||||
border-color: var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-form-style-1 textarea.form-control {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer p,
|
||||
#footer a:not(.btn),
|
||||
#footer li,
|
||||
#footer strong,
|
||||
#footer .footer-copyright p,
|
||||
#footer a:not(.btn):not(.no-footer-css) {
|
||||
color: #b5b5b5;
|
||||
}
|
||||
|
||||
.custom-list-style-1 > li {
|
||||
margin-bottom: 0;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.custom-list-style-1 > li + li {
|
||||
border-top: 1px solid #5c5d5f;
|
||||
}
|
||||
|
||||
.custom-list-style-1 > li:first-child {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.custom-list-style-1 > li:last-child {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.custom-footer-top-light-border {
|
||||
border-top: 1px solid var(--light-rgba-10) !important;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
.featured-icon.rounded-circle {
|
||||
border-radius: 100% !important;
|
||||
}
|
||||
|
||||
.custom-btn-style-1:after {
|
||||
border-left-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-btn-style-1:hover:after, .custom-btn-style-1.hover:after {
|
||||
border-left-color: var(--primary--200);
|
||||
}
|
||||
|
||||
.custom-btn-style-1:focus:after, .custom-btn-style-1.focus:after {
|
||||
border-left-color: var(--primary-200);
|
||||
}
|
||||
|
||||
.custom-btn-style-1.disabled:after, .custom-btn-style-1:disabled:after {
|
||||
border-left-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-btn-style-1:active:after, .custom-btn-style-1.active:after {
|
||||
border-left-color: var(--primary-200) !important;
|
||||
}
|
||||
|
||||
.custom-svg-btn-style-1:not(.custom-svg-btn-style-1-light):hover .custom-svg-btn-background polygon {
|
||||
stroke: var(--primary);
|
||||
}
|
||||
|
||||
.custom-svg-btn-style-1:not(.custom-svg-btn-style-1-light).custom-svg-btn-style-1-solid .custom-svg-btn-background polygon {
|
||||
fill: var(--primary);
|
||||
stroke: var(--primary);
|
||||
}
|
||||
|
||||
.custom-svg-btn-style-1:not(.custom-svg-btn-style-1-light).custom-svg-btn-style-1-solid:hover .custom-svg-btn-background polygon, .custom-svg-btn-style-1:not(.custom-svg-btn-style-1-light).custom-svg-btn-style-1-solid:focus .custom-svg-btn-background polygon {
|
||||
fill: var(--primary--200);
|
||||
stroke: var(--primary--200);
|
||||
}
|
||||
|
||||
.btn-link > svg polygon {
|
||||
stroke: var(--primary);
|
||||
fill: var(--primary);
|
||||
}
|
||||
|
||||
/*
|
||||
* Home Section - Hero
|
||||
*/
|
||||
.custom-hero-sub-images-style-1:before, .custom-hero-sub-images-style-1:after {
|
||||
background: var(--primary-200);
|
||||
}
|
||||
|
||||
.custom-hero-sub-images-style-1 .custom-hero-sub-images-shadow {
|
||||
box-shadow: 0px 0px 80px 68px var(--primary-200);
|
||||
}
|
||||
|
||||
/*
|
||||
* Home Section - What We Do
|
||||
*/
|
||||
.custom-thumb-info-style-1:hover .custom-thumb-info-icon {
|
||||
background: var(--primary) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Home Section - Testimonials
|
||||
*/
|
||||
.custom-testimonial-style-1.testimonial.testimonial-style-3 blockquote:before {
|
||||
color: var(--primary);
|
||||
}
|
||||
292
resources/assets/css/demos/demo-insurance.css
Normal file
292
resources/assets/css/demos/demo-insurance.css
Normal file
@ -0,0 +1,292 @@
|
||||
@media (max-width: 991px) {
|
||||
.background-image-wrapper {
|
||||
background-position: 0% !important;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-big-text-1 {
|
||||
font-size: 59.2px;
|
||||
font-size: 3.7rem;
|
||||
letter-spacing: 0.8px;
|
||||
position: relative;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.custom-big-text-1 {
|
||||
font-size: 5.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.custom-big-text-1 {
|
||||
font-size: 7.3rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-big-text-1 {
|
||||
font-size: 9.7rem;
|
||||
left: -214px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-container-background {
|
||||
position: relative;
|
||||
margin-top: -100px;
|
||||
}
|
||||
|
||||
.custom-container-background:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
width: 125%;
|
||||
height: 300px;
|
||||
background: var(--light);
|
||||
}
|
||||
|
||||
.custom-form-control-group-style-1 .form-control {
|
||||
height: 60px;
|
||||
line-height: 1;
|
||||
padding: 10px 30px;
|
||||
border-width: 2px;
|
||||
border-color: var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-form-control-group-style-1 .form-control:first-child {
|
||||
background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/></svg>");
|
||||
border-radius: 35px 0 0 35px;
|
||||
border-right: 0;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 11px;
|
||||
background-position: 92% center;
|
||||
}
|
||||
|
||||
.custom-form-control-group-style-1 .form-control:last-child {
|
||||
border-radius: 0 35px 35px 0;
|
||||
}
|
||||
|
||||
.custom-divider {
|
||||
height: 60px;
|
||||
width: 0.5px;
|
||||
border-left: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.custom-view-more svg {
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-view-more:hover svg {
|
||||
transform: translate3d(7px, 0, 0);
|
||||
}
|
||||
|
||||
.custom-z-index-1 {
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.custom-svg-position-1 {
|
||||
position: absolute;
|
||||
top: -190px;
|
||||
left: -330px;
|
||||
}
|
||||
|
||||
.custom-svg-position-2 {
|
||||
position: absolute;
|
||||
top: 210px;
|
||||
right: -47px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.custom-svg-position-3 {
|
||||
position: absolute;
|
||||
left: -30px;
|
||||
top: -40px;
|
||||
}
|
||||
|
||||
.custom-svg-position-4 {
|
||||
position: absolute;
|
||||
top: -430px;
|
||||
right: -100px;
|
||||
}
|
||||
|
||||
.page-header-svg-container {
|
||||
transform: rotate(280deg);
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
left: 10%;
|
||||
}
|
||||
|
||||
.custom-svg-position-5 {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: -48%;
|
||||
left: 33%;
|
||||
}
|
||||
|
||||
.breadcrumb > li {
|
||||
text-transform: none;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@keyframes customLines1anim {
|
||||
from {
|
||||
stroke-dasharray: 1600;
|
||||
stroke-dashoffset: 1600;
|
||||
}
|
||||
to {
|
||||
stroke-dasharray: 1600;
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.customLines1anim {
|
||||
animation-name: customLines1anim;
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
#header .header-nav-features:before, #header .header-nav-features:after {
|
||||
background: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 14px;
|
||||
padding: 0 1.5rem !important;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li:first-child > a {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li.dropdown .dropdown-menu {
|
||||
border-radius: 4px !important;
|
||||
margin-left: 5px !important;
|
||||
}
|
||||
}
|
||||
|
||||
#header .header-nav-features-search .header-nav-features-dropdown {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Accordion
|
||||
*/
|
||||
.custom-accordion-style-1 > .card {
|
||||
border: 1px solid transparent !important;
|
||||
transition: ease border-color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a {
|
||||
position: relative;
|
||||
padding: 23px 30px;
|
||||
background-color: var(--light);
|
||||
transition: ease background-color 300ms, ease color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a:after {
|
||||
content: '+';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 25px;
|
||||
font-size: inherit;
|
||||
font-weight: inherit;
|
||||
transform: translate3d(0, -50%, 0) rotate(45deg);
|
||||
transform-origin: 50% 50%;
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a.collapsed:after {
|
||||
transform: translate3d(0, -50%, 0) rotate(0deg);
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .accordion-toggle {
|
||||
background-color: #f4f4f4 !important;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card + .card {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Testimonial
|
||||
*/
|
||||
.custom-testimonial-style-1 blockquote {
|
||||
position: relative;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1 blockquote:before {
|
||||
content: "\f10d";
|
||||
font-family: "Font Awesome 6 Free";
|
||||
font-weight: 900;
|
||||
font-size: 18px;
|
||||
color: #212121;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1 blockquote p {
|
||||
font-family: 'Playfair Display', sans-serif;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/*
|
||||
* Newsletter
|
||||
*/
|
||||
.custom-form-control-newsletter-field {
|
||||
border-radius: 35px 0 0 35px;
|
||||
}
|
||||
|
||||
.custom-form-control-newsletter-btn {
|
||||
border-radius: 0 35px 35px 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Contact Form
|
||||
*/
|
||||
.custom-form-style-1 .form-control {
|
||||
height: calc(1.8em + 1.85rem + 2px);
|
||||
padding: 15.6px 20px;
|
||||
padding: 0.975rem 1.25rem;
|
||||
background: transparent;
|
||||
border-width: 2px;
|
||||
border-color: var(--grey-500);
|
||||
border-radius: 35px;
|
||||
line-height: 1.5 !important;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:focus {
|
||||
border-color: var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-webkit-input-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-moz-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:-ms-input-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select {
|
||||
color: #495057;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select option {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select option[selected] {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 textarea.form-control {
|
||||
height: auto;
|
||||
}
|
||||
564
resources/assets/css/demos/demo-it-services.css
Normal file
564
resources/assets/css/demos/demo-it-services.css
Normal file
@ -0,0 +1,564 @@
|
||||
.custom-font-secondary {
|
||||
font-family: "Lora", sans-serif !important;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
.body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 1440px) {
|
||||
.body {
|
||||
margin: 0 50px 50px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1440px) and (max-width: 1600px) {
|
||||
.container-xl-custom {
|
||||
padding: 0 80px;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Text Size
|
||||
*/
|
||||
.custom-text-size-1 {
|
||||
font-size: 1.1em !important;
|
||||
}
|
||||
|
||||
.custom-text-size-2 {
|
||||
font-size: 1.35em !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Colors
|
||||
*/
|
||||
.custom-text-color-light-1 {
|
||||
color: #cbd5f1 !important;
|
||||
}
|
||||
|
||||
.custom-text-color-light-2 {
|
||||
color: #e0e1e5 !important;
|
||||
}
|
||||
|
||||
.custom-text-color-light-3 {
|
||||
color: #bfbfbf !important;
|
||||
}
|
||||
|
||||
.custom-text-color-grey-1 {
|
||||
color: #acb4be !important;
|
||||
}
|
||||
|
||||
.custom-bg-color-grey-1 {
|
||||
color: #f9f7f4 !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Position
|
||||
*/
|
||||
.custom-position-center-x-y {
|
||||
position: absolute;
|
||||
top: 46%;
|
||||
left: 45%;
|
||||
max-width: 130%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Box Shadow
|
||||
*/
|
||||
.custom-box-shadow-1 {
|
||||
box-shadow: 0px 0px 37px -4px rgba(0, 0, 0, 0.1) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* "Remove" body left and right margins on sections
|
||||
*/
|
||||
@media (min-width: 576px) {
|
||||
.custom-section-full-width {
|
||||
margin-left: -50px !important;
|
||||
margin-right: -50px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Heading Bar
|
||||
*/
|
||||
.custom-heading-bar {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-heading-bar:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: calc( 100% + 15px);
|
||||
width: 50px;
|
||||
border-top: 5px solid var(--grey-500);
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
|
||||
.custom-heading-bar.custom-heading-bar-right:before {
|
||||
right: auto;
|
||||
left: calc( 100% + 15px);
|
||||
}
|
||||
|
||||
.custom-heading-bar.custom-heading-bar-with-padding {
|
||||
padding-left: 65px;
|
||||
}
|
||||
|
||||
.custom-heading-bar.custom-heading-bar-with-padding:before {
|
||||
right: auto;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Icon
|
||||
*/
|
||||
.custom-arrow-icon {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
}
|
||||
|
||||
.custom-arrow-icon:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
border-top: 1px solid var(--grey-500);
|
||||
border-color: inherit;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
|
||||
.custom-arrow-icon:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0;
|
||||
width: 50%;
|
||||
height: 50%;
|
||||
border-top: 1px solid var(--grey-500);
|
||||
border-right: 1px solid var(--grey-500);
|
||||
border-color: inherit;
|
||||
transform: translate3d(0, -50%, 0) rotate(45deg);
|
||||
}
|
||||
|
||||
.custom-icon-wrapper {
|
||||
max-height: 100px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Link Effect
|
||||
*/
|
||||
.custom-link-effect-1 > i {
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
.custom-link-effect-1:hover > i {
|
||||
transform: translate3d(10px, 0, 0);
|
||||
}
|
||||
|
||||
.custom-link-effect-1.btn {
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
.custom-link-effect-1.btn:hover {
|
||||
padding-right: 35px !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
#header.header-effect-shrink .header-container {
|
||||
min-height: 138px;
|
||||
}
|
||||
|
||||
#header .header-body {
|
||||
left: 0;
|
||||
border-bottom-color: transparent !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 13px;
|
||||
letter-spacing: 0.3px;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li > a.active {
|
||||
color: #444 !important;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li > a.active:before {
|
||||
background-color: #444 !important;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li.active > a, #header .header-nav-main nav > ul > li:hover > a, #header .header-nav-main nav > ul > li:focus > a {
|
||||
color: #444 !important;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li.active > a:before, #header .header-nav-main nav > ul > li:hover > a:before, #header .header-nav-main nav > ul > li:focus > a:before {
|
||||
background-color: #444 !important;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1440px) {
|
||||
#header .header-nav-main nav > ul > li {
|
||||
margin-left: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Home - Intro
|
||||
*/
|
||||
.custom-section-svg {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-section-svg > svg {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.custom-section-svg > .container {
|
||||
position: absolute;
|
||||
top: 43%;
|
||||
left: 50%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-section-svg > svg {
|
||||
background-attachment: fixed;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-section-svg > svg {
|
||||
width: 230%;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Home - Who We Are
|
||||
*/
|
||||
.custom-section-pull-top-1 {
|
||||
margin-top: -111px !important;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-section-pull-top-1 {
|
||||
margin-top: -70px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-section-pull-top-1 {
|
||||
margin-top: -57px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-section-pull-top-1 {
|
||||
margin-top: -105px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-section-pull-top-1 {
|
||||
margin-top: -14vw !important;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-overlapping-cards {
|
||||
display: flex;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-overlapping-cards > div {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-overlapping-cards > div:nth-child(1) {
|
||||
max-width: 47%;
|
||||
}
|
||||
|
||||
.custom-overlapping-cards > div:nth-child(1) img {
|
||||
transform: translate3d(-20px, -20px, 0);
|
||||
}
|
||||
|
||||
.custom-overlapping-cards > div:nth-child(2) {
|
||||
z-index: 0;
|
||||
transform: translate3d(-50px, 50px, 0);
|
||||
}
|
||||
|
||||
.custom-overlapping-cards > div:nth-child(2) img {
|
||||
max-width: 89%;
|
||||
transform: translate3d(70px, -20px, 0);
|
||||
}
|
||||
|
||||
.custom-overlapping-cards .custom-overlapping-cards-puzzle-background {
|
||||
position: absolute;
|
||||
top: -80px;
|
||||
left: -158px;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-overlapping-cards {
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
}
|
||||
.custom-overlapping-cards > .card:nth-child(1) {
|
||||
max-width: 80%;
|
||||
}
|
||||
.custom-overlapping-cards > .card:nth-child(2) {
|
||||
margin-top: 50px;
|
||||
max-width: 80%;
|
||||
transform: none;
|
||||
}
|
||||
.custom-overlapping-cards > .card:nth-child(2) img {
|
||||
max-width: 100%;
|
||||
transform: translate3d(20px, -20px, 0);
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Home - We Provide
|
||||
*/
|
||||
.featured-icon.custom-featured-icon-style-1 {
|
||||
width: 115px;
|
||||
height: 115px;
|
||||
border-radius: 100% !important;
|
||||
}
|
||||
|
||||
.custom-section-half-background-color-light {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-section-half-background-color-light:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 30%;
|
||||
background-color: var(--light);
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-section-half-background-color-light:after {
|
||||
height: 60%;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Testimonial
|
||||
*/
|
||||
.testimonial.custom-testimonial-style-1.testimonial-style-4 blockquote {
|
||||
padding-top: 25px;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.testimonial.custom-testimonial-style-1.testimonial-style-4 blockquote:before {
|
||||
top: -5px;
|
||||
left: -5px;
|
||||
font-size: 90px;
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
.testimonial.custom-testimonial-style-1.testimonial-style-4 .testimonial-author {
|
||||
position: relative;
|
||||
margin-left: 70px;
|
||||
}
|
||||
|
||||
.testimonial.custom-testimonial-style-1.testimonial-style-4 .testimonial-author:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
right: calc( 100% + 10px);
|
||||
width: 30px;
|
||||
border-top: 4px solid #000;
|
||||
}
|
||||
|
||||
/*
|
||||
* Process
|
||||
*/
|
||||
.process.custom-process-style-1 .process-step-circle {
|
||||
border-color: #e2e5e8;
|
||||
width: 110px;
|
||||
height: 110px;
|
||||
}
|
||||
|
||||
.process.custom-process-style-1 .process-step-content {
|
||||
padding-top: 32px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.process.custom-process-style-1:before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: calc( 100vw - 120px);
|
||||
height: 2px;
|
||||
top: 53px;
|
||||
left: 50%;
|
||||
background-color: #EDEDED;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
}
|
||||
.process.custom-process-style-1 .process-step .process-step-circle {
|
||||
background-color: var(--light);
|
||||
}
|
||||
.process.custom-process-style-1 .process-step .process-step-circle:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: calc( 100% + 30px);
|
||||
background-color: var(--light);
|
||||
height: 100%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
z-index: -1;
|
||||
}
|
||||
.process.custom-process-style-1 .process-step:before {
|
||||
content: none;
|
||||
}
|
||||
.process.custom-process-style-1 .process-step:nth-child(1) .process-step-circle, .process.custom-process-style-1 .process-step:nth-child(3) .process-step-circle {
|
||||
margin-top: -75px;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Nav
|
||||
*/
|
||||
.custom-nav-style-1 > li {
|
||||
margin-left: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.custom-nav-style-1 > li:hover > a, .custom-nav-style-1 > li:focus > a {
|
||||
border-color: var(--dark) !important;
|
||||
}
|
||||
|
||||
.custom-nav-style-1 > li:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-nav-style-1 > li {
|
||||
margin-right: 20px;
|
||||
margin-left: 0;
|
||||
}
|
||||
.custom-nav-style-1 > li:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-nav-style-1 > li {
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Blog
|
||||
*/
|
||||
.custom-post-style-1:hover .overlay:before {
|
||||
opacity: 0.2;
|
||||
}
|
||||
|
||||
/*
|
||||
* Social Icons
|
||||
*/
|
||||
.social-icons.custom-social-icons-icon-light li a {
|
||||
color: #a3b6e7 !important;
|
||||
}
|
||||
|
||||
.social-icons.custom-social-icons-icon-light li:hover a {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Page Header - Internal Pages
|
||||
*/
|
||||
@media (max-width: 767px) {
|
||||
.page-header.custom-page-header-style-1 h1 {
|
||||
font-size: 32px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.page-header.custom-page-header-style-1 .breadcrumb > li {
|
||||
font-size: 1em;
|
||||
font-weight: 600;
|
||||
color: #acb4be;
|
||||
}
|
||||
|
||||
.page-header.custom-page-header-style-1 .breadcrumb > li > a {
|
||||
color: #acb4be;
|
||||
}
|
||||
|
||||
.page-header.custom-page-header-style-1 .breadcrumb > li > a:hover {
|
||||
color: var(--light);
|
||||
}
|
||||
|
||||
.page-header.custom-page-header-style-1 .breadcrumb > li + li:before {
|
||||
content: "/";
|
||||
}
|
||||
|
||||
/*
|
||||
* Pagination
|
||||
*/
|
||||
.custom-pagination-style-1 .page-item .page-link {
|
||||
border: 2px solid #999999;
|
||||
box-sizing: content-box;
|
||||
color: #999999;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.custom-pagination-style-1 .page-item.active .page-link, .custom-pagination-style-1 .page-item:hover .page-link {
|
||||
color: var(--light);
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer p, #footer li, #footer span, #footer a:not(.btn):not(.no-footer-css), #footer .footer-copyright p {
|
||||
color: #a3b6e7;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
/* Buttons (force text color) */
|
||||
.btn-secondary:hover {
|
||||
color: var(--secondary-inverse) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Heading Bar
|
||||
*/
|
||||
.custom-heading-bar:before {
|
||||
border-color: var(--secondary);
|
||||
}
|
||||
|
||||
/*
|
||||
* Testimonial
|
||||
*/
|
||||
.testimonial.custom-testimonial-style-1.testimonial-style-4 blockquote:before {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
/*
|
||||
* Pagination
|
||||
*/
|
||||
.custom-pagination-style-1 .page-item.active .page-link, .custom-pagination-style-1 .page-item:hover .page-link {
|
||||
border-color: var(--primary);
|
||||
background-color: var(--primary) !important;
|
||||
}
|
||||
365
resources/assets/css/demos/demo-landing.css
Normal file
365
resources/assets/css/demos/demo-landing.css
Normal file
@ -0,0 +1,365 @@
|
||||
/* Grid */
|
||||
@media (min-width: 1236px) {
|
||||
.container {
|
||||
max-width: 1236px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.container-fluid {
|
||||
padding-left: 3%;
|
||||
padding-right: 3%;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
letter-spacing: -0.05em;
|
||||
font-size: 16px;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.custom-counter-1 h3 {
|
||||
font-size: 3.571em;
|
||||
line-height: 1;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.custom-counter-1 p {
|
||||
font-size: 0.9286em;
|
||||
margin: 5px 0 0;
|
||||
font-weight: 600;
|
||||
line-height: 19.2px;
|
||||
line-height: 1.2rem;
|
||||
color: var(--light);
|
||||
opacity: 0.7;
|
||||
letter-spacing: -0.02em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.custom-counter-1 a {
|
||||
font-size: 18px;
|
||||
font-size: 1.125rem;
|
||||
letter-spacing: -0.05em;
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
.custom-header-min-height-1 {
|
||||
min-height: 68vh;
|
||||
}
|
||||
|
||||
.custom-header-max-width-1 {
|
||||
max-width: 703px;
|
||||
}
|
||||
|
||||
.custom-banner-content-1 {
|
||||
background: var(--light);
|
||||
border-radius: var(--border-radius2x);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.custom-banner-content-item-1 {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
top: 48.3% !important;
|
||||
left: -9%;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.custom-banner-content-item-2 {
|
||||
border-radius: var(--border-radius);
|
||||
position: absolute;
|
||||
bottom: -6%;
|
||||
left: -4%;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.custom-banner-content-slider-1 {
|
||||
position: relative;
|
||||
margin: 0 10px 10px 10px;
|
||||
}
|
||||
|
||||
.section-concept p,
|
||||
.custom-text-color-1 {
|
||||
color: rgba(255, 255, 255, 0.6) !important;
|
||||
}
|
||||
|
||||
.color-inherit {
|
||||
color: inherit !important;
|
||||
}
|
||||
|
||||
.custom-header-bar:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 10px;
|
||||
width: 50vw;
|
||||
background-image: linear-gradient(150deg, var(--primary) 0%, var(--primary) 30%, var(--secondary) 70%, var(--secondary) 100%);
|
||||
border-radius: var(--border-radius);
|
||||
box-shadow: 0 0 60px rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.custom-header-bar:before {
|
||||
width: 110vw;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-font-size-1 {
|
||||
font-size: 17.6px;
|
||||
font-size: 1.1rem;
|
||||
line-height: 28.8px;
|
||||
line-height: 1.8rem;
|
||||
}
|
||||
|
||||
.custom-font-size-2 {
|
||||
font-size: 18px;
|
||||
font-size: 1.125rem;
|
||||
}
|
||||
|
||||
.custom-nav-link {
|
||||
font-size: 13px;
|
||||
font-size: .8125rem;
|
||||
letter-spacing: -0.025em;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
padding: 4px 0 !important;
|
||||
padding: .25rem 0 !important;
|
||||
margin: 0 20px;
|
||||
margin: 0 1.25rem;
|
||||
border-bottom: 4px solid transparent;
|
||||
}
|
||||
|
||||
.custom-nav-link:not(.active).nav-link {
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
.owl-carousel.carousel-center-active-item-2 .owl-item.active > div {
|
||||
background-image: linear-gradient(150deg, var(--primary) 0%, var(--primary) 30%, var(--secondary) 70%, var(--secondary) 100%) !important;
|
||||
}
|
||||
|
||||
/* Landing Page Text Reasons */
|
||||
.text-reasons {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
transform: rotate(-10deg);
|
||||
}
|
||||
|
||||
.text-reasons h3 {
|
||||
padding: 12px 56px;
|
||||
padding: .75rem 3.5rem;
|
||||
text-transform: uppercase;
|
||||
border-radius: var(--border-radius);
|
||||
margin-bottom: 6.4px;
|
||||
margin-bottom: .4rem;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.text-reasons h3:nth-child(2) {
|
||||
background: rgba(25, 25, 25, 0.15);
|
||||
margin-left: -10%;
|
||||
}
|
||||
|
||||
.text-reasons h3:nth-child(3) {
|
||||
background: rgba(25, 25, 25, 0.57);
|
||||
font-size: 28px;
|
||||
font-size: 1.75rem;
|
||||
line-height: 1.5;
|
||||
padding-left: 80px;
|
||||
padding-left: 5rem;
|
||||
margin-left: 32px;
|
||||
margin-left: 2rem;
|
||||
}
|
||||
|
||||
.text-reasons h3:nth-child(4) {
|
||||
background: var(--dark);
|
||||
font-size: 36px;
|
||||
font-size: 2.25rem;
|
||||
padding: 8px 20px;
|
||||
padding: .5rem 1.25rem;
|
||||
margin-left: 15%;
|
||||
}
|
||||
|
||||
.text-reasons label {
|
||||
font-size: 200px;
|
||||
font-size: 12.5rem;
|
||||
line-height: .8;
|
||||
font-weight: 800;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.text-reasons .highlighted-word {
|
||||
letter-spacing: -.025em;
|
||||
}
|
||||
|
||||
.text-reasons .highlighted-word:after {
|
||||
bottom: -0.33em;
|
||||
left: 10%;
|
||||
transform: scaleY(-1);
|
||||
}
|
||||
|
||||
/* Strong Shadow */
|
||||
.strong-shadow {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.strong-shadow:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: #494b4e;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.strong-shadow.strong-shadow-top-right:before {
|
||||
top: -25px;
|
||||
left: 25px;
|
||||
right: -25px;
|
||||
bottom: 25px;
|
||||
}
|
||||
|
||||
.strong-shadow.rounded:before {
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
/* SVG Background */
|
||||
.background-svg-style-1 {
|
||||
position: absolute;
|
||||
top: 31px;
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
.background-svg-style-1 .dots {
|
||||
filter: url(#shadow);
|
||||
}
|
||||
|
||||
.background-svg-style-1 .dots.dots-animation {
|
||||
filter: url(#shadow);
|
||||
}
|
||||
|
||||
/* Video Open Icon */
|
||||
.video-open-icon {
|
||||
display: inline-block;
|
||||
width: 64px;
|
||||
width: 4rem;
|
||||
height: 64px;
|
||||
height: 4rem;
|
||||
padding: 6px;
|
||||
padding: .375rem;
|
||||
transition: padding .2s;
|
||||
border-radius: 2rem;
|
||||
background: rgba(255, 255, 255, 0.07);
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
margin-right: 8px;
|
||||
margin-right: .5rem;
|
||||
box-shadow: 0 0 40px rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
.video-open-icon:before {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 2rem;
|
||||
background: var(--light);
|
||||
}
|
||||
|
||||
.video-open-icon:after {
|
||||
content: '';
|
||||
border-left: 12px solid #08c;
|
||||
border-top: 7px solid transparent;
|
||||
border-bottom: 7px solid transparent;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin: -6px 0 0 -5px;
|
||||
}
|
||||
|
||||
.video-open-icon:hover {
|
||||
padding: 4px;
|
||||
padding: .25rem;
|
||||
}
|
||||
|
||||
/* Filter */
|
||||
.filter-wrapper.sticky-active {
|
||||
padding: 0 58px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.filter-wrapper.sticky-active:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background: rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
.filter-wrapper .search-form {
|
||||
position: relative;
|
||||
border: 2px solid #e7e7e7;
|
||||
border-radius: 3rem;
|
||||
display: inline-block;
|
||||
margin: -10px 0;
|
||||
}
|
||||
|
||||
.filter-wrapper .search-form input[type="search"]::-webkit-search-decoration,
|
||||
.filter-wrapper .search-form input[type="search"]::-webkit-search-cancel-button,
|
||||
.filter-wrapper .search-form input[type="search"]::-webkit-search-results-button,
|
||||
.filter-wrapper .search-form input[type="search"]::-webkit-search-results-decoration {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.filter-wrapper .search-form input {
|
||||
padding: 12.8px 48px 12.8px 19.2px;
|
||||
padding: 0.8rem 3rem 0.8rem 1.2rem;
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
font-size: 16px;
|
||||
font-size: 1rem;
|
||||
font-weight: 500;
|
||||
letter-spacing: -0.05em;
|
||||
color: var(--dark);
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.filter-wrapper .search-form .btn {
|
||||
position: absolute;
|
||||
top: 53%;
|
||||
right: -11.2px;
|
||||
right: -0.7rem;
|
||||
font-size: 19.2px;
|
||||
font-size: 1.2rem;
|
||||
min-width: 80px;
|
||||
min-width: 5rem;
|
||||
transform: translateY(-50%);
|
||||
padding: 0;
|
||||
background: none;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
|
||||
/* List Icons */
|
||||
.custom-list-icons-1 .custom-list-icon {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border-radius: 2px;
|
||||
margin-right: 3px;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
line-height: 28px;
|
||||
}
|
||||
|
||||
.custom-letter-spacing-1 {
|
||||
letter-spacing: 5px;
|
||||
}
|
||||
543
resources/assets/css/demos/demo-law-firm-2.css
Normal file
543
resources/assets/css/demos/demo-law-firm-2.css
Normal file
@ -0,0 +1,543 @@
|
||||
body {
|
||||
font-family: 'Poppins', sans-serif;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-family: 'Lora', sans-serif;
|
||||
}
|
||||
|
||||
.custom-box-shadow-1 {
|
||||
box-shadow: 0px 0px 31px -5px rgba(0, 0, 0, 0.14) !important;
|
||||
}
|
||||
|
||||
.custom-box-shadow-2 {
|
||||
box-shadow: 0px 8px 31px -5px rgba(0, 0, 0, 0.07) !important;
|
||||
}
|
||||
|
||||
.custom-container-position-1 {
|
||||
position: relative;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.custom-container-style-1 {
|
||||
min-width: 85vw;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.custom-container-style-1 {
|
||||
min-width: 540px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.custom-container-style-1 {
|
||||
min-width: 720px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-container-style-1 {
|
||||
min-width: 960px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-container-style-1 {
|
||||
min-width: 1140px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1440px) {
|
||||
.custom-container-style-1 {
|
||||
min-width: 1440px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-font-secondary {
|
||||
font-family: 'Lora', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-font-size-1 {
|
||||
font-size: 112px;
|
||||
font-size: 7rem;
|
||||
line-height: 0.4;
|
||||
}
|
||||
|
||||
.fluid-col-lg-5 .fluid-col {
|
||||
left: 50%;
|
||||
width: 100vw;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.fluid-col-lg-5 {
|
||||
min-height: 0;
|
||||
}
|
||||
.fluid-col-lg-5 .fluid-col {
|
||||
width: calc(44.2vw - 15px);
|
||||
left: 15px;
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.fluid-col-lg-5 {
|
||||
min-height: 400px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-read-more-link svg {
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-read-more-link:hover svg {
|
||||
transform: translate3d(7px, 0, 0);
|
||||
}
|
||||
|
||||
.custom-shape-1 {
|
||||
position: absolute;
|
||||
top: 25px;
|
||||
left: -30px;
|
||||
bottom: 25px;
|
||||
right: 30px;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-stroke-width-1 svg path {
|
||||
stroke-width: 1.5 !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
@media (min-width: 992px) {
|
||||
#header .header-top {
|
||||
border-bottom-width: 1px;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
padding: 0 1.2rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Cards
|
||||
*/
|
||||
.custom-card-style-1 .custom-read-more svg,
|
||||
.custom-card-style-2 .custom-read-more svg {
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-card-style-1:hover .custom-read-more svg,
|
||||
.custom-card-style-2:hover .custom-read-more svg {
|
||||
transform: translate3d(7px, 0, 0);
|
||||
}
|
||||
|
||||
.custom-card-style-1 {
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-card-style-1 .card-title {
|
||||
transition: ease color 300ms;
|
||||
}
|
||||
|
||||
.custom-card-style-1:hover {
|
||||
transform: scale(1.03);
|
||||
}
|
||||
|
||||
.custom-card-style-2 .card-img-top {
|
||||
padding-left: 35px;
|
||||
}
|
||||
|
||||
.custom-card-style-2 .card-body {
|
||||
position: relative;
|
||||
background: var(--light);
|
||||
margin-top: -70px;
|
||||
max-width: 83%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Owl Carousel
|
||||
*/
|
||||
.custom-dots-style-1 .owl-dots {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot span {
|
||||
background: transparent;
|
||||
border: 1px solid var(--grey-500);
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot:hover span, .custom-dots-style-1 .owl-dots .owl-dot.active span {
|
||||
background: var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-dots-style-1.dots-dark .owl-dots .owl-dot span {
|
||||
border-color: var(--dark);
|
||||
}
|
||||
|
||||
.custom-dots-style-1.dots-dark .owl-dots .owl-dot:hover span, .custom-dots-style-1.dots-dark .owl-dots .owl-dot.active span {
|
||||
background: var(--dark) !important;
|
||||
}
|
||||
|
||||
.custom-dots-style-1.dots-light .owl-dots .owl-dot span {
|
||||
border-color: var(--light);
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.custom-dots-style-1.dots-light .owl-dots .owl-dot:hover span, .custom-dots-style-1.dots-light .owl-dots .owl-dot.active span {
|
||||
background: #FFF !important;
|
||||
}
|
||||
|
||||
.custom-carousel-style-1 {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.custom-carousel-style-1:before, .custom-carousel-style-1:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 0;
|
||||
height: 30%;
|
||||
box-shadow: -10px 0px 30px 50px white;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-carousel-style-1:before {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.custom-carousel-style-1:after {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.custom-carousel-style-1 .custom-carousel-style-1-icon-wrapper {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
border: 3px solid var(--grey-500);
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.custom-carousel-style-1 .custom-carousel-style-1-icon-wrapper:before, .custom-carousel-style-1 .custom-carousel-style-1-icon-wrapper:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
width: 85%;
|
||||
border-bottom: 2px solid var(--grey-500);
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
|
||||
.custom-carousel-style-1 .custom-carousel-style-1-icon-wrapper:before {
|
||||
left: calc( 100% + 25px);
|
||||
}
|
||||
|
||||
.custom-carousel-style-1 .custom-carousel-style-1-icon-wrapper:after {
|
||||
right: calc( 100% + 25px);
|
||||
}
|
||||
|
||||
.custom-carousel-style-2 .owl-item:not(.active) {
|
||||
opacity: 0;
|
||||
transition: ease opacity 300ms;
|
||||
}
|
||||
|
||||
.custom-carousel-style-2 .owl-item.active .custom-card-style-2 .card-body {
|
||||
box-shadow: 0px 8px 31px -5px rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.custom-carousel-style-2.owl-grab .owl-item:not(.active) {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/*
|
||||
* Accordion
|
||||
*/
|
||||
.custom-accordion-style-1 > .card {
|
||||
border: 0 !important;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a {
|
||||
position: relative;
|
||||
font-family: 'Poppins', sans-serif;
|
||||
padding: 23px 30px;
|
||||
background-color: var(--light);
|
||||
transition: ease background-color 300ms, ease color 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a:after {
|
||||
content: '+';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 25px;
|
||||
font-size: inherit;
|
||||
font-weight: inherit;
|
||||
transform: translate3d(0, -50%, 0) rotate(45deg);
|
||||
transform-origin: 50% 50%;
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a.collapsed:after {
|
||||
transform: translate3d(0, -50%, 0) rotate(0deg);
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header + .collapse.show,
|
||||
.custom-accordion-style-1 > .card .card-header + .collapsing {
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card + .card {
|
||||
margin-top: 17px;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1.custom-accordion-style-1-grey > .card .card-header a {
|
||||
background-color: #f4f4f4;
|
||||
}
|
||||
|
||||
/*
|
||||
* Contact Form
|
||||
*/
|
||||
.custom-form-style-1 .form-control {
|
||||
height: calc(1.8em + 1.75rem + 2px);
|
||||
padding: 15.6px 20px;
|
||||
padding: 0.975rem 1.25rem;
|
||||
background: var(--grey-100);
|
||||
border-color: var(--grey-100);
|
||||
line-height: 1.5 !important;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:focus {
|
||||
border-color: var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-webkit-input-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-moz-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:-ms-input-placeholder {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select {
|
||||
color: #495057;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select option {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 select option[selected] {
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.custom-form-style-1 textarea.form-control {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/*
|
||||
* Social Icons
|
||||
*/
|
||||
.custom-social-icons-style-1 li a {
|
||||
font-size: 22.4px;
|
||||
font-size: 1.4rem;
|
||||
width: auto;
|
||||
height: auto;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.custom-social-icons-style-1 li:hover.social-icons-instagram a {
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
.custom-social-icons-style-1 li:hover.social-icons-facebook a {
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
.custom-social-icons-style-1 li:hover.social-icons-x a {
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* List
|
||||
*/
|
||||
.custom-list-style-1 > li {
|
||||
margin-bottom: 17px;
|
||||
}
|
||||
|
||||
.custom-list-style-1 > li > a {
|
||||
font-size: 1.1em;
|
||||
transition: ease padding 300ms;
|
||||
}
|
||||
|
||||
.custom-list-style-1 > li.active > a, .custom-list-style-1 > li:hover > a {
|
||||
position: relative;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.custom-list-style-1 > li.active > a:before, .custom-list-style-1 > li:hover > a:before {
|
||||
content: '\f054';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
font-family: 'Font Awesome 6 Free';
|
||||
font-weight: 900;
|
||||
font-size: 0.7em;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
|
||||
.custom-list-style-1 > li:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Process
|
||||
*/
|
||||
@media (min-width: 768px) {
|
||||
.custom-process-style-1.process-vertical .process-step:after {
|
||||
width: 3px;
|
||||
height: calc(100% - 110px);
|
||||
top: 97px;
|
||||
left: 41px;
|
||||
}
|
||||
.custom-process-style-1.process-vertical .process-step-circle {
|
||||
flex: 0 0 auto;
|
||||
width: 85px;
|
||||
height: 85px;
|
||||
}
|
||||
.custom-process-style-1.process-vertical .process-step-circle-content {
|
||||
font-size: 1.3em;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-process-style-1.process-vertical .process-step:after {
|
||||
top: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-process-style-1.process-vertical .process-step:after {
|
||||
top: 93px;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom See More Overlay
|
||||
*/
|
||||
.custom-seemore-overlay {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.custom-seemore-overlay .custom-seemore-overlay-button {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
text-align: center;
|
||||
padding: 35px 0 5px;
|
||||
width: 100%;
|
||||
opacity: 1;
|
||||
transition: ease opacity 300ms;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-seemore-overlay .custom-seemore-overlay-button:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #020024;
|
||||
background: linear-gradient(180deg, rgba(2, 0, 36, 0) 0%, #ad9263 100%);
|
||||
transition: ease background 300ms;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-seemore-overlay.active .custom-seemore-overlay-button {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer p, #footer li, #footer span, #footer a:not(.btn):not(.no-footer-css) {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
#footer .footer-copyright p {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
/*
|
||||
* Accordion
|
||||
*/
|
||||
.custom-accordion-style-1 > .card .card-header a:not(.collapsed) {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card .card-header a:not(.collapsed):after {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card:hover .card-header a {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-accordion-style-1 > .card:hover .card-header a:after {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
/*
|
||||
* Background
|
||||
*/
|
||||
.bg-primary-darken {
|
||||
background-color: var(--primary-300) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Buttons
|
||||
*/
|
||||
.custom-btn-primary-darken {
|
||||
color: var(--primary-inverse);
|
||||
background-color: var(--primary-300);
|
||||
}
|
||||
|
||||
.custom-btn-primary-darken.active, .custom-btn-primary-darken:focus, .custom-btn-primary-darken:hover {
|
||||
color: var(--primary-inverse);
|
||||
background-color: var(--primary-300);
|
||||
}
|
||||
|
||||
/*
|
||||
* Cards
|
||||
*/
|
||||
.custom-card-style-1:hover .card-title {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Social Icons
|
||||
*/
|
||||
.social-icons.custom-social-icons-style-1 li a {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom See More Overlay
|
||||
*/
|
||||
.custom-seemore-overlay .custom-seemore-overlay-button:before {
|
||||
background: var(--primary);
|
||||
background: linear-gradient(180deg, rgba(2, 0, 36, 0) 0%, var(--primary) 100%);
|
||||
}
|
||||
158
resources/assets/css/demos/demo-law-firm.css
Normal file
158
resources/assets/css/demos/demo-law-firm.css
Normal file
@ -0,0 +1,158 @@
|
||||
.custom-font-primary {
|
||||
font-family: 'Poppins', Arial, sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-font-secondary {
|
||||
font-family: 'Merriweather', serif !important;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-family: 'Merriweather', serif !important;
|
||||
}
|
||||
|
||||
.bg-color-light-grey {
|
||||
background-color: #F8F8F8 !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-bar .header-nav-main {
|
||||
left: -15px;
|
||||
top: -2px;
|
||||
position: relative;
|
||||
}
|
||||
#header .header-nav-bar .header-nav-main nav > ul > li > a {
|
||||
text-transform: none !important;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
#header .header-nav-bar .header-nav-main nav > ul > li > a:before {
|
||||
height: 2px !important;
|
||||
}
|
||||
}
|
||||
|
||||
#header .header-nav-bar {
|
||||
border-top: 1px solid #e6e6e6;
|
||||
padding: 3px 0;
|
||||
}
|
||||
|
||||
#header .header-nav-bar .simple-search {
|
||||
background: #f4f4f4;
|
||||
padding: 3px 0;
|
||||
}
|
||||
|
||||
#header .header-nav-bar .simple-search input[type="search"]::-webkit-search-decoration,
|
||||
#header .header-nav-bar .simple-search input[type="search"]::-webkit-search-cancel-button,
|
||||
#header .header-nav-bar .simple-search input[type="search"]::-webkit-search-results-button,
|
||||
#header .header-nav-bar .simple-search input[type="search"]::-webkit-search-results-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
#header .simple-search {
|
||||
border-radius: 4px !important;
|
||||
}
|
||||
|
||||
#header .simple-search .form-control {
|
||||
border-radius: 4px !important;
|
||||
}
|
||||
|
||||
.custom-font-slider-1 {
|
||||
font-size: 46px;
|
||||
line-height: 46px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-font-slider-1 {
|
||||
font-size: 76px;
|
||||
line-height: 76px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-font-slider-2 {
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
letter-spacing: 2px;
|
||||
font-weight: 600;
|
||||
margin: 0 0 5px 0;
|
||||
}
|
||||
|
||||
.custom-dots-modern-1 .owl-dots {
|
||||
margin: 30px 0 0 60px !important;
|
||||
}
|
||||
|
||||
.custom-sort-source.sort-source.sort-source-style-3 {
|
||||
flex-direction: column;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
|
||||
.custom-sort-source.sort-source.sort-source-style-3 li a, .custom-sort-source.sort-source.sort-source-style-3 li.active a {
|
||||
border-bottom: 1px solid #E7E7E7 !important;
|
||||
border-radius: 0 !important;
|
||||
text-transform: none;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.custom-sort-source.sort-source.sort-source-style-3 li a:before, .custom-sort-source.sort-source.sort-source-style-3 li.active a:before {
|
||||
font-family: 'Font Awesome 6 Free';
|
||||
font-weight: 900;
|
||||
content: "\f105";
|
||||
display: inline-block;
|
||||
padding-right: 7px;
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
|
||||
.custom-sort-source.sort-source.sort-source-style-3 li:last-child a, .custom-sort-source.sort-source.sort-source-style-3 li.active:last-child a {
|
||||
border-bottom: 0 !important;
|
||||
}
|
||||
|
||||
#footer {
|
||||
background: #222;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
#footer .custom-footer-label-1 {
|
||||
display: block;
|
||||
margin: 0;
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
font-size: 0.75rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
#footer .custom-footer-strong-1 {
|
||||
display: block;
|
||||
margin: 0;
|
||||
color: var(--dark--200);
|
||||
font-size: 14.4px;
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
#footer .custom-social-icons-style-1 li a {
|
||||
font-size: 22.4px;
|
||||
font-size: 1.4rem;
|
||||
width: auto;
|
||||
height: auto;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
#footer .custom-social-icons-style-1 li:hover a {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
#footer .custom-social-icons-style-1 li:hover.social-icons-instagram a {
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
#footer .custom-social-icons-style-1 li:hover.social-icons-facebook a {
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
#footer .custom-social-icons-style-1 li:hover.social-icons-x a {
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
#footer .footer-copyright.footer-copyright-style-2 {
|
||||
background: #202020;
|
||||
border: 0;
|
||||
}
|
||||
506
resources/assets/css/demos/demo-marketing-1.css
Normal file
506
resources/assets/css/demos/demo-marketing-1.css
Normal file
@ -0,0 +1,506 @@
|
||||
body {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.cursor-outer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.cursor-inner {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
left: 13px;
|
||||
top: 14px;
|
||||
background-color: var(--primary) !important;
|
||||
background-image: linear-gradient(to right, var(--primary) 0%, var(--secondary) 100%) !important;
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.cursor-inner {
|
||||
display: none !important;
|
||||
opacity: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-modern {
|
||||
padding: 17.6px 35.2px;
|
||||
padding: 1.1rem 2.2rem;
|
||||
}
|
||||
|
||||
p,
|
||||
.custom-font-secondary {
|
||||
font-family: "Poppins", sans-serif !important;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 16px;
|
||||
font-size: 1rem;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
.custom-font-1 {
|
||||
font-size: clamp(28px, 6.6666666667px + 0.0444444444 * 100vw, 60px);
|
||||
line-height: 1.1;
|
||||
font-weight: 400;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
.custom-font-2 {
|
||||
font-size: clamp(28px, 14.6666666667px + 0.0277777778 * 100vw, 48px);
|
||||
line-height: 1.1;
|
||||
font-weight: 400;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/* Colors */
|
||||
.custom-bg-color-1 {
|
||||
background: #f7f7FF !important;
|
||||
}
|
||||
|
||||
.custom-border-color-1 {
|
||||
border-color: #e7e7e7 !important;
|
||||
}
|
||||
|
||||
/* Border Radius */
|
||||
.custom-border-radius-1 {
|
||||
border-radius: 10px !important;
|
||||
}
|
||||
|
||||
/* Body */
|
||||
.body {
|
||||
font-family: "Lexend", sans-serif !important;
|
||||
}
|
||||
|
||||
/* Container */
|
||||
@media (min-width: 1440px) {
|
||||
.container {
|
||||
max-width: 1440px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Mark */
|
||||
.mark.mark-color:before {
|
||||
height: 25%;
|
||||
width: 105%;
|
||||
bottom: 5%;
|
||||
}
|
||||
|
||||
.appear-animation .mark.mark-color:before {
|
||||
width: 0%;
|
||||
transition: width 2s cubic-bezier(0.55, 0, 0.1, 1);
|
||||
}
|
||||
|
||||
.appear-animation.animated .mark.mark-color:before {
|
||||
width: 105%;
|
||||
}
|
||||
|
||||
/* Skew */
|
||||
.custom-skewY-1,
|
||||
section.section.section-angled.section-angled-reverse .section-angled-layer-bottom {
|
||||
transform: skewY(-3deg) translate3d(0, 50%, 0);
|
||||
transform-style: preserve-3d;
|
||||
}
|
||||
|
||||
/* Position */
|
||||
.custom-pos-1 {
|
||||
margin: -48px -5% 0 -5%;
|
||||
margin: -3rem -5% 0 -5%;
|
||||
transform: perspective(1px) rotate(-3deg);
|
||||
}
|
||||
|
||||
.custom-pos-1 .marquee > div {
|
||||
transform-style: preserve-3d !important;
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
.custom-pos-2 {
|
||||
margin-bottom: -13%;
|
||||
}
|
||||
|
||||
.custom-pos-3 {
|
||||
top: -16px;
|
||||
top: -1rem;
|
||||
left: -16px;
|
||||
left: -1rem;
|
||||
}
|
||||
|
||||
.custom-pos-4 {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.custom-pos-5 {
|
||||
top: -48px;
|
||||
top: -3rem;
|
||||
left: 16px;
|
||||
left: 1rem;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-pos-5 {
|
||||
top: -6rem;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-pos-6 {
|
||||
top: -2em;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-pos-6 {
|
||||
top: -4em;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-pos-7 {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.custom-pos-8 {
|
||||
top: 1em;
|
||||
left: -1em;
|
||||
}
|
||||
|
||||
@media (min-width: 1400px) {
|
||||
.custom-pos-8 {
|
||||
left: -2em;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-pos-9 {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.custom-pos-10 {
|
||||
top: -11em;
|
||||
left: 2em;
|
||||
}
|
||||
|
||||
.custom-pos-11 {
|
||||
top: -10em;
|
||||
left: -1em;
|
||||
}
|
||||
|
||||
@media (min-width: 1400px) {
|
||||
.custom-pos-11 {
|
||||
top: -11em;
|
||||
left: -6em;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-pos-12 {
|
||||
top: auto !important;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.custom-pos-13 {
|
||||
margin: -96px -5% 0 -5%;
|
||||
margin: -6rem -5% 0 -5%;
|
||||
transform: perspective(1px) rotate(3deg);
|
||||
}
|
||||
|
||||
.custom-pos-13 .marquee > div {
|
||||
transform-style: preserve-3d !important;
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
/* Custom Decoration */
|
||||
.custom-decoration-1 {
|
||||
background: url(../../img/demos/marketing-1/svg/generic-1.svg) no-repeat 100% 0%;
|
||||
padding-right: 4%;
|
||||
background-size: 12%;
|
||||
}
|
||||
|
||||
.custom-decoration-2 {
|
||||
background: url(../../img/demos/marketing-1/svg/generic-7.svg) no-repeat 100% 0%;
|
||||
padding-right: 3%;
|
||||
background-size: 10%;
|
||||
}
|
||||
|
||||
/* Hero */
|
||||
.hero {
|
||||
background: url(../../img/demos/marketing-1/backgrounds/bg-1.jpg) no-repeat 100% 0% !important;
|
||||
background-color: #F7F7FF !important;
|
||||
}
|
||||
|
||||
.custom-hero-font-1 {
|
||||
font-size: clamp(42px, 23.3333333333px + 0.0388888889 * 100vw, 70px);
|
||||
line-height: 1.1;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.custom-hero-font-1 strong {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Heading */
|
||||
.custom-heading-1 {
|
||||
opacity: 0.07;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
top: 15%;
|
||||
text-align: center;
|
||||
-webkit-mask-image: linear-gradient(to bottom, black 0%, rgba(0, 0, 0, 0) 100%);
|
||||
mask-image: linear-gradient(to bottom, black 0%, rgba(0, 0, 0, 0) 100%);
|
||||
}
|
||||
|
||||
.custom-heading-1 strong {
|
||||
text-transform: uppercase;
|
||||
font-size: 13cqw;
|
||||
line-height: 13cqw;
|
||||
}
|
||||
|
||||
/* Gradient */
|
||||
.custom-bg-gradient-1 {
|
||||
background-color: var(--tertiary) !important;
|
||||
background-image: linear-gradient(to right, var(--tertiary) 0%, var(--quaternary) 100%) !important;
|
||||
}
|
||||
|
||||
/* Margins */
|
||||
.custom-margin-top-1 {
|
||||
margin-top: 150px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-margin-top-1 {
|
||||
margin-top: 75px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-margin-bottom-1 {
|
||||
margin-bottom: 150px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-margin-bottom-1 {
|
||||
margin-bottom: 75px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Elements */
|
||||
.custom-el-1 {
|
||||
animation-duration: 30s;
|
||||
top: -17%;
|
||||
}
|
||||
|
||||
.custom-el-2 {
|
||||
background: url(../../img/demos/marketing-1/svg/generic-6.svg);
|
||||
background-size: 40%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 15% 40%;
|
||||
}
|
||||
|
||||
.custom-el-2 .row {
|
||||
min-height: 600px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
.sticky-header-active #header .header-body {
|
||||
-webkit-backdrop-filter: blur(5px);
|
||||
backdrop-filter: blur(5px);
|
||||
background-color: rgba(247, 247, 255, 0.9) !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-body {
|
||||
transition: all 0.5s ease-in-out;
|
||||
}
|
||||
#header .header-nav-main.header-nav-main-text-size-4 nav > ul > li > a {
|
||||
font-size: 1rem;
|
||||
font-weight: 500;
|
||||
letter-spacing: -0.5px;
|
||||
padding: 0 1.4rem !important;
|
||||
}
|
||||
#header .header-nav-main.header-nav-main-text-size-4 nav > ul > li > a.nav-link-custom-1 {
|
||||
font-weight: 600;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
#header .header-nav-main.header-nav-main-text-size-4 nav > ul > li > a.nav-link-custom-1 span {
|
||||
display: inline-block;
|
||||
border-bottom: 2px solid var(--dark);
|
||||
transition: border-color .15s ease-in-out;
|
||||
}
|
||||
#header .header-nav-main.header-nav-main-text-size-4 nav > ul > li > a.nav-link-custom-1:hover span {
|
||||
border-bottom-color: var(--primary);
|
||||
}
|
||||
#header .header-nav-main.header-nav-main-text-size-4 nav > ul > li.dropdown:not(.dropdown-mega) .dropdown-menu li a {
|
||||
padding: 10px 24px 10px 24px;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Box */
|
||||
.custom-box-1 {
|
||||
will-change: transform;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
|
||||
/* Custom Section */
|
||||
.custom-section-1 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.custom-section-1 .custom-section-1-box {
|
||||
position: relative;
|
||||
margin-bottom: -80px;
|
||||
min-height: 70vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.custom-section-1 .custom-section-1-box:before {
|
||||
content: "";
|
||||
background-color: rgba(255, 255, 255, 0.1) !important;
|
||||
border-radius: 10px;
|
||||
width: calc(100% + 40px);
|
||||
height: calc(100% + 40px);
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
/* Highlight */
|
||||
.custom-word-highlight-1 img {
|
||||
width: auto;
|
||||
max-width: 100%;
|
||||
position: absolute;
|
||||
left: 10%;
|
||||
margin-top: 20%;
|
||||
}
|
||||
|
||||
.custom-highlight-text-1 {
|
||||
display: block;
|
||||
margin: 5% 0 -5% 0;
|
||||
font-family: "Poppins", sans-serif !important;
|
||||
color: var(--dark);
|
||||
font-size: clamp(80px, 26.6666666667px + 0.1111111111 * 100vw, 160px) !important;
|
||||
font-weight: 600;
|
||||
line-height: 1em !important;
|
||||
-webkit-text-stroke-width: 3px;
|
||||
letter-spacing: -0.02em;
|
||||
stroke-width: 3px;
|
||||
-webkit-text-stroke-color: #00000000;
|
||||
stroke: #00000000;
|
||||
background-color: transparent;
|
||||
background-image: linear-gradient(180deg, var(--secondary) 0%, var(--dark) 80%);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
}
|
||||
|
||||
/* Lists */
|
||||
.custom-list-services-1 {
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
.custom-list-services-1 li {
|
||||
padding: 1.5em 0;
|
||||
font-size: 24px;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
/* Gsap Content */
|
||||
.gsap-content-images img {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
/* Project Item */
|
||||
.custom-project-list-item-1 {
|
||||
padding: 3em 0 2em;
|
||||
border-bottom: 2px solid var(--grey-200);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-project-list-item-1 .custom-project-list-item-num-1 {
|
||||
font-size: 22.4px;
|
||||
font-size: 1.4rem;
|
||||
letter-spacing: -0.03em;
|
||||
font-weight: 500;
|
||||
transition: ease all 300ms;
|
||||
opacity: 0;
|
||||
display: inline-block;
|
||||
transform: translate3d(0, 100%, 0);
|
||||
}
|
||||
|
||||
.custom-project-list-item-1 .custom-project-list-item-type-1 {
|
||||
font-size: 22.4px;
|
||||
font-size: 1.4rem;
|
||||
letter-spacing: -0.03em;
|
||||
font-weight: 500;
|
||||
transition: ease all 300ms;
|
||||
opacity: 0;
|
||||
display: inline-block;
|
||||
transform: translate3d(0, -100%, 0);
|
||||
}
|
||||
|
||||
.custom-project-list-item-1:hover .custom-project-list-item-num-1 {
|
||||
opacity: 1;
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
.custom-project-list-item-1:hover .custom-project-list-item-type-1 {
|
||||
opacity: 1;
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
.thumb-info-floating-element {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/* Owl Carousel */
|
||||
.custom-owl-carousel-1 .owl-prev {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.custom-owl-carousel-1 .owl-next {
|
||||
background-color: #FFF !important;
|
||||
color: var(--dark) !important;
|
||||
box-shadow: 0 15px 30px -15px rgba(0, 0, 0, 0.45);
|
||||
border-color: #e7e7e7 !important;
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
#footer a:not(.btn):not(.no-footer-css) {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
#footer .btn-social {
|
||||
min-width: 190px;
|
||||
}
|
||||
|
||||
#footer .btn-social:not(:hover):not(:active) {
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
#footer .cascading-images-wrapper {
|
||||
padding: 4rem 8rem 0 !important;
|
||||
position: relative;
|
||||
left: -10%;
|
||||
}
|
||||
}
|
||||
|
||||
/* Overlay */
|
||||
.overlay-gradient-bottom-content:before {
|
||||
opacity: 0.3 !important;
|
||||
}
|
||||
|
||||
/* Thumb Info */
|
||||
.custom-thumb-info.thumb-info.thumb-info-show-button-hover .thumb-info-title {
|
||||
transform: translate3d(0, 50px, 0);
|
||||
}
|
||||
|
||||
.custom-thumb-info.thumb-info.thumb-info-show-button-hover:hover .thumb-info-title {
|
||||
transform: translate3d(0, 0px, 0);
|
||||
}
|
||||
635
resources/assets/css/demos/demo-medical-2.css
Normal file
635
resources/assets/css/demos/demo-medical-2.css
Normal file
@ -0,0 +1,635 @@
|
||||
body {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
/*
|
||||
* Container
|
||||
*/
|
||||
@media (min-width: 1240px) {
|
||||
.container {
|
||||
max-width: 1240px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
.header-top {
|
||||
border-bottom: 1px solid var(--grey-100) !important;
|
||||
}
|
||||
|
||||
.header-top .header-top-phone {
|
||||
font-size: 16px !important;
|
||||
padding: 6px 40px 6px 0 !important;
|
||||
}
|
||||
|
||||
.header-top .header-top-phone img {
|
||||
margin-right: 7px;
|
||||
}
|
||||
|
||||
.header-top .header-top-email,
|
||||
.header-top .header-top-opening-hours {
|
||||
font-size: 12px !important;
|
||||
letter-spacing: -0.3px;
|
||||
}
|
||||
|
||||
.header-top .header-top-email i,
|
||||
.header-top .header-top-opening-hours i {
|
||||
margin-right: 6px !important;
|
||||
}
|
||||
|
||||
.header-top .header-top-email {
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.header-top .nav-item-header-top-socials {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.header-top .nav-item-header-top-socials .header-top-socials ul li {
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.header-top .nav-item-header-top-socials .header-top-socials ul li i {
|
||||
font-size: 15px !important;
|
||||
}
|
||||
|
||||
.header-top .header-top-button-make-as-appoitment {
|
||||
width: 195px;
|
||||
}
|
||||
|
||||
.header-top .header-top-button-make-as-appoitment a {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Header Container
|
||||
*/
|
||||
.header-container .header-nav .nav li > a {
|
||||
text-transform: none !important;
|
||||
font-size: 14px !important;
|
||||
}
|
||||
|
||||
.header-container .header-nav .nav li .dropdown-menu a {
|
||||
font-size: 0.8em !important;
|
||||
}
|
||||
|
||||
.header-container .header-nav .nav li:hover > a {
|
||||
background: #fff !important;
|
||||
}
|
||||
|
||||
.header-container .header-nav .nav li:hover > a:before {
|
||||
border-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.header-container .header-nav .nav li:hover > a + ul.dropdown-menu {
|
||||
border-top: 0 !important;
|
||||
margin-top: -5px !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Header Search
|
||||
*/
|
||||
.header-column-search {
|
||||
flex-grow: 0.14 !important;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.header-column-search {
|
||||
flex-grow: 0.3 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.header-column-search {
|
||||
order: 2;
|
||||
flex-grow: 0.1 !important;
|
||||
width: 100%;
|
||||
padding-right: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.header-column-logo {
|
||||
order: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.header-column-nav-menu {
|
||||
order: 3;
|
||||
flex-grow: 0.1 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.header-nav-features {
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.header-nav-features:not(.header-nav-features-no-border):before {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Carousel Slider
|
||||
*/
|
||||
.custom-dots-style-1 .owl-dots .owl-dot {
|
||||
background: transparent;
|
||||
border-radius: 100%;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 2px solid #212121;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot > span {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot.active > span {
|
||||
background: #212121 !important;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot + .owl-dot {
|
||||
margin-left: 6px !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Cards
|
||||
*/
|
||||
.custom-cards {
|
||||
position: relative;
|
||||
min-height: 300px;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-cards {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-cards .cards-container {
|
||||
position: absolute;
|
||||
top: -70%;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.custom-cards .cards-container {
|
||||
position: static;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-cards .cards-container .card {
|
||||
min-height: 420px;
|
||||
}
|
||||
|
||||
.custom-cards .cards-container .card .card-body {
|
||||
padding: 50px;
|
||||
}
|
||||
|
||||
.custom-cards .cards-container .card .card-body img {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.custom-cards .cards-container .card .card-body .card-title {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.custom-cards .cards-container .card .card-body .card-text,
|
||||
.custom-cards .cards-container .card .card-body .card-title {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom List Icons
|
||||
*/
|
||||
.custom-list-icons li {
|
||||
line-height: 35px !important;
|
||||
padding-left: 52px !important;
|
||||
}
|
||||
|
||||
.custom-list-icons li i {
|
||||
border-color: var(--grey) !important;
|
||||
width: 40px !important;
|
||||
height: 40px !important;
|
||||
line-height: 33px !important;
|
||||
top: 0 !important;
|
||||
}
|
||||
|
||||
.custom-list-icons:first-child li {
|
||||
padding-right: 60px !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Carousel
|
||||
*/
|
||||
.custom-owl-carousel .owl-next:before {
|
||||
content: "\f061" !important;
|
||||
color: var(--dark) !important;
|
||||
font-size: 20px !important;
|
||||
}
|
||||
|
||||
.custom-owl-carousel .owl-prev:before {
|
||||
content: "\f060" !important;
|
||||
color: var(--dark) !important;
|
||||
font-size: 20px !important;
|
||||
}
|
||||
|
||||
.custom-owl-carousel .owl-carousel .owl-nav {
|
||||
top: 40%;
|
||||
}
|
||||
|
||||
/*
|
||||
* About Me
|
||||
*/
|
||||
.more-about {
|
||||
background-color: var(--light);
|
||||
background-position-y: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
height: auto;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
margin-bottom: 70px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.more-about {
|
||||
padding-top: 70%;
|
||||
position: static;
|
||||
background-size: 100%;
|
||||
background-position: 0 0;
|
||||
background-color: var(--light);
|
||||
margin-bottom: 0;
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.more-about .col-cuttin-more-about:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -35%;
|
||||
right: -90%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--light);
|
||||
z-index: 0;
|
||||
transform: rotate(75deg);
|
||||
}
|
||||
.more-about .col-cuttin-more-about:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 35%;
|
||||
right: -90%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--light);
|
||||
z-index: 0;
|
||||
transform: rotate(-75deg);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) and (max-width: 1200px) {
|
||||
.more-about {
|
||||
background-size: 130%;
|
||||
}
|
||||
.more-about .col-cuttin-more-about:before {
|
||||
right: -127%;
|
||||
top: -38%;
|
||||
}
|
||||
.more-about .col-cuttin-more-about:after {
|
||||
right: -127%;
|
||||
top: 38%;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Patient Reviews
|
||||
*/
|
||||
.patient-reviews {
|
||||
background-position: right;
|
||||
background-repeat: no-repeat;
|
||||
background-color: var(--light);
|
||||
background-size: contain;
|
||||
height: auto;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.patient-reviews {
|
||||
padding-top: 51%;
|
||||
position: static;
|
||||
background-size: 100%;
|
||||
background-position: 0 0;
|
||||
background-color: var(--light);
|
||||
margin-bottom: 0;
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.patient-reviews .col-cutting-patient-reviews:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -50%;
|
||||
left: -68%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--light);
|
||||
z-index: 0;
|
||||
transform: rotate(-70deg);
|
||||
}
|
||||
.patient-reviews .col-cutting-patient-reviews:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: -68%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--light);
|
||||
z-index: 0;
|
||||
transform: rotate(70deg);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.patient-reviews {
|
||||
padding-top: 54%;
|
||||
}
|
||||
}
|
||||
|
||||
.patient-reviews section.section {
|
||||
padding: 90px 0 !important;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.patient-reviews section.section {
|
||||
padding: 30px 0 70px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.patient-reviews section.section .owl-carousel .owl-nav {
|
||||
top: 19%;
|
||||
}
|
||||
|
||||
.patient-reviews section.section p.lead {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.patient-reviews section.section h4.review-signature {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.patient-reviews .owl-stage-outer .owl-item {
|
||||
padding: 0 60px;
|
||||
}
|
||||
|
||||
.patient-reviews .owl-next {
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
.patient-reviews .owl-next:before {
|
||||
content: "\f060" !important;
|
||||
color: var(--dark) !important;
|
||||
font-family: 'Font Awesome 6 Free' !important;
|
||||
font-weight: 900 !important;
|
||||
font-size: 20px !important;
|
||||
left: 1px !important;
|
||||
top: -1px !important;
|
||||
border: none !important;
|
||||
position: static !important;
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
.patient-reviews .owl-next:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.patient-reviews .owl-prev {
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
.patient-reviews .owl-prev:before {
|
||||
content: "\f060" !important;
|
||||
color: var(--dark) !important;
|
||||
font-family: 'Font Awesome 6 Free' !important;
|
||||
font-weight: 900 !important;
|
||||
font-size: 20px !important;
|
||||
left: 1px !important;
|
||||
top: -1px !important;
|
||||
border: none !important;
|
||||
position: static !important;
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
.patient-reviews .owl-prev:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.patient-reviews .review-quotes {
|
||||
left: 0;
|
||||
width: 10%;
|
||||
}
|
||||
|
||||
.patient-reviews .review-quotes + .lead {
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Medical Services
|
||||
*/
|
||||
.medical-services {
|
||||
background-repeat: no-repeat;
|
||||
background-attachment: fixed;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.medical-services .cards-medical-services {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.medical-services .cards-medical-services .card {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.medical-services .section-funnel-layer-bottom {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 96px 0;
|
||||
padding: 6rem 0;
|
||||
transform: translate3d(0, 99%, 0);
|
||||
z-index: 20;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.medical-services .section-funnel-layer-bottom {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.medical-services .section-funnel-layer-bottom .section-funnel-layer:nth-child(1) {
|
||||
transform: skewY(-4.7deg);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -50%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 6;
|
||||
}
|
||||
|
||||
.medical-services .section-funnel-layer-bottom .section-funnel-layer:nth-child(2) {
|
||||
transform: skewY(-175.3deg);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 6;
|
||||
}
|
||||
|
||||
/*
|
||||
* Google Maps
|
||||
*/
|
||||
#googlemaps {
|
||||
min-height: 480px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Contact Form
|
||||
*/
|
||||
.custom-form-style-1 .form-control {
|
||||
border: 0;
|
||||
padding: 19.2px;
|
||||
padding: 1.2rem;
|
||||
box-shadow: none !important;
|
||||
height: auto;
|
||||
background: var(--grey-100) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer Top Info
|
||||
*/
|
||||
.footer-top-info {
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
.footer-top-info .footer-top-info-detail {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding-right: 190px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.footer-top-info .footer-top-info-detail {
|
||||
margin: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.footer-top-info .footer-top-info-detail {
|
||||
margin: 0;
|
||||
margin-left: -10px;
|
||||
}
|
||||
}
|
||||
|
||||
.footer-top-info .footer-top-info-desc {
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.footer-top-info .btn-footer-top-info {
|
||||
width: 180px;
|
||||
height: 55px;
|
||||
line-height: 51px;
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
}
|
||||
|
||||
.footer-top-info .btn-footer-top-info:hover {
|
||||
border-color: var(--light) !important;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.footer-top-info .btn-footer-top-info {
|
||||
margin-right: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.footer-top-info .btn-footer-top-info {
|
||||
margin-right: -5px;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer .custom-info .custom-info-block span {
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#footer .custom-info .custom-info-block span.title-custom-info-block {
|
||||
letter-spacing: -0.35px;
|
||||
}
|
||||
|
||||
#footer .custom-info .custom-info-block span.text-custom-info-block {
|
||||
letter-spacing: -0.35px;
|
||||
}
|
||||
|
||||
#footer .nav-footer > ul {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#footer .nav-footer > ul li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
#footer .social-icons li {
|
||||
margin: -1px 13px 0 0;
|
||||
}
|
||||
|
||||
#footer .social-icons li a {
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
line-height: 41px;
|
||||
}
|
||||
|
||||
#footer .social-icons li:hover a {
|
||||
color: var(--dark--200) !important;
|
||||
}
|
||||
|
||||
#footer .footer-copyright {
|
||||
border-top: 1px solid rgba(225, 225, 225, 0.1);
|
||||
}
|
||||
|
||||
#footer .footer-column-opening-hours .custom-info {
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid rgba(225, 225, 225, 0.1);
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
.border-color-active-primary:active {
|
||||
border-color: var(--primary) !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li.dropdown .dropdown-menu li:hover > a,
|
||||
#header .header-nav-main nav > ul > li.dropdown .dropdown-menu li:focus > a,
|
||||
#header .header-nav-main nav > ul > li.dropdown .dropdown-menu li.active > a,
|
||||
#header .header-nav-main nav > ul > li.dropdown .dropdown-menu li:active > a {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
}
|
||||
497
resources/assets/css/demos/demo-medical.css
Normal file
497
resources/assets/css/demos/demo-medical.css
Normal file
@ -0,0 +1,497 @@
|
||||
.box-shadow-custom {
|
||||
box-shadow: 10px 10px 74px -15px rgba(0, 0, 0, 0.33);
|
||||
}
|
||||
|
||||
.custom-button {
|
||||
border-radius: 30px !important;
|
||||
padding: 10px 30px;
|
||||
}
|
||||
|
||||
.custom-border-bottom-1 {
|
||||
border-bottom: 1px solid #FFF;
|
||||
padding-bottom: 3px;
|
||||
}
|
||||
|
||||
.rev_slider .slotholder:after {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
pointer-events: none;
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-radius: 100%;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 2px solid rgba(255, 255, 255, 0.7);
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot > span {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot.active > span {
|
||||
background: #FFF !important;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot + .owl-dot {
|
||||
margin-top: 6px !important;
|
||||
}
|
||||
|
||||
.medical-schedules {
|
||||
margin: -47px 0 0 0;
|
||||
}
|
||||
|
||||
.medical-schedules h4 {
|
||||
line-height: 23px;
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
||||
.medical-schedules h4, .medical-schedules h5, .medical-schedules a, .medical-schedules i {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
.medical-schedules h5 {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.medical-schedules .box-one, .medical-schedules .box-two, .medical-schedules .box-three, .medical-schedules .box-four {
|
||||
cursor: pointer;
|
||||
height: 94px;
|
||||
position: relative;
|
||||
animation-duration: 0.6s;
|
||||
}
|
||||
|
||||
.medical-schedules .box-one {
|
||||
z-index: 4;
|
||||
}
|
||||
|
||||
.medical-schedules .box-two {
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.medical-schedules .box-three {
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.medical-schedules .box-three:hover {
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.medical-schedules .box-four {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.medical-schedules .box-one::after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: -40px;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: 47px solid transparent;
|
||||
border-bottom: 47px solid transparent;
|
||||
border-left: 40px solid #008fe2;
|
||||
z-index: 5;
|
||||
}
|
||||
|
||||
.medical-schedules .box-two, .medical-schedules .box-three {
|
||||
padding: 38px 38px 38px 70px;
|
||||
}
|
||||
|
||||
.medical-schedules .box-two a, .medical-schedules .box-three a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.medical-schedules .box-two:hover .expanded-info, .medical-schedules .box-three:hover .expanded-info {
|
||||
opacity: 1;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.medical-schedules .box-two:hover .expanded-info .info, .medical-schedules .box-three:hover .expanded-info .info {
|
||||
opacity: 1;
|
||||
transform: translateY(0%);
|
||||
}
|
||||
|
||||
.medical-schedules .box-two:hover i, .medical-schedules .box-three:hover i {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.medical-schedules .box-two .expanded-info, .medical-schedules .box-three .expanded-info {
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 99%;
|
||||
width: 100%;
|
||||
box-shadow: 0 -12px 30px rgba(0, 0, 0, 0.2);
|
||||
z-index: -1;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.medical-schedules .box-two .expanded-info .info, .medical-schedules .box-three .expanded-info .info {
|
||||
opacity: 0;
|
||||
transform: translateY(-40%);
|
||||
}
|
||||
|
||||
.medical-schedules .box-two .expanded-info .info:nth-child(1), .medical-schedules .box-three .expanded-info .info:nth-child(1) {
|
||||
transition: all 0.3s ease 0.4s;
|
||||
}
|
||||
|
||||
.medical-schedules .box-two .expanded-info .info:nth-child(2), .medical-schedules .box-three .expanded-info .info:nth-child(2) {
|
||||
transition: all 0.3s ease 0.5s;
|
||||
}
|
||||
|
||||
.medical-schedules .box-two .expanded-info .info:nth-child(3), .medical-schedules .box-three .expanded-info .info:nth-child(3) {
|
||||
transition: all 0.3s ease 0.6s;
|
||||
}
|
||||
|
||||
.medical-schedules .box-two i, .medical-schedules .box-three i {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: -30px;
|
||||
font-size: 1.44em;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.medical-schedules .box-two:hover i {
|
||||
transform: translateY(-50%) translateX(50%);
|
||||
}
|
||||
|
||||
.medical-schedules .box-two i {
|
||||
transform: translateY(-50%) translateX(0%);
|
||||
}
|
||||
|
||||
.medical-schedules .box-three:hover i {
|
||||
transform: translateY(-50%) rotate(-90deg);
|
||||
}
|
||||
|
||||
.medical-schedules .box-three i {
|
||||
transform: translateY(-50%) rotate(0deg);
|
||||
}
|
||||
|
||||
.medical-schedules .box-four label {
|
||||
display: block;
|
||||
margin: -3px 0 0;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.medical-schedules .box-four strong {
|
||||
font-size: 1.6em;
|
||||
}
|
||||
|
||||
.medical-schedules .box-four .feature-box {
|
||||
padding: 23.7px;
|
||||
}
|
||||
|
||||
.medical-schedules .box-four .feature-box-icon {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.medical-schedules h4 {
|
||||
margin-top: 10px !important;
|
||||
}
|
||||
.medical-schedules .box-one::after {
|
||||
content: none;
|
||||
}
|
||||
.medical-schedules .box-two, .medical-schedules .box-three {
|
||||
padding: 38px 38px 38px 38px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-info span:nth-child(1) {
|
||||
display: inline-block;
|
||||
color: #90c9ea;
|
||||
min-width: 68px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.custom-info span:nth-child(1)::after {
|
||||
content: ':';
|
||||
display: block;
|
||||
float: right;
|
||||
color: var(--light);
|
||||
}
|
||||
|
||||
.custom-info span:nth-child(2) {
|
||||
color: var(--light);
|
||||
}
|
||||
|
||||
.feature-box.feature-box-style-2 .feature-box-icon {
|
||||
top: 3px;
|
||||
}
|
||||
|
||||
.team .thumb-info:hover .thumb-info-caption {
|
||||
background: #008fe2;
|
||||
}
|
||||
|
||||
.team .thumb-info:hover .thumb-info-caption span, .team .thumb-info:hover .thumb-info-caption i {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
.team .thumb-info .thumb-info-caption {
|
||||
position: relative;
|
||||
padding: 10px 0;
|
||||
display: block;
|
||||
background: var(--light);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.team .thumb-info .thumb-info-caption .custom-thumb-info-title span {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.team .thumb-info .thumb-info-caption .custom-thumb-info-title span:nth-child(1) {
|
||||
color: #8e8e8e;
|
||||
}
|
||||
|
||||
.team .thumb-info .thumb-info-caption .custom-thumb-info-title span:nth-child(2) {
|
||||
color: #28292d;
|
||||
}
|
||||
|
||||
.team .thumb-info .thumb-info-caption .custom-thumb-info-title i {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 20px;
|
||||
font-size: 1.9em !important;
|
||||
color: #28292d;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.team .owl-carousel.nav-bottom .owl-nav {
|
||||
position: absolute;
|
||||
top: -60px;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.team .owl-carousel.nav-bottom .owl-nav button.owl-prev, .team .owl-carousel.nav-bottom .owl-nav button.owl-next {
|
||||
border: none !important;
|
||||
font-size: 2em;
|
||||
padding: 0;
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.team .owl-carousel.nav-bottom .owl-nav button.owl-prev:active, .team .owl-carousel.nav-bottom .owl-nav button.owl-next:active {
|
||||
background-color: none;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.team .owl-carousel.nav-bottom .owl-nav button.owl-prev {
|
||||
color: #0092e3;
|
||||
}
|
||||
|
||||
.team .owl-carousel.nav-bottom .owl-nav button.owl-prev::before {
|
||||
font-family: simple-line-icons;
|
||||
content: "\e07a";
|
||||
font-size: 28.8px;
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
|
||||
.team .owl-carousel.nav-bottom .owl-nav button.owl-next {
|
||||
color: #2d529f;
|
||||
}
|
||||
|
||||
.team .owl-carousel.nav-bottom .owl-nav button.owl-next::before {
|
||||
font-family: simple-line-icons;
|
||||
content: "\e079";
|
||||
font-size: 28.8px;
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
|
||||
.thumb-info-side-image-custom {
|
||||
border: 0 none;
|
||||
color: var(--default);
|
||||
margin: 0 0 35px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.thumb-info-side-image-custom .thumb-info-side-image-wrapper {
|
||||
padding: 0;
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.thumb-info-side-image-custom .thumb-info-caption {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.thumb-info-side-image-custom .thumb-info-caption h4 {
|
||||
margin: 30px 0 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.thumb-info-side-image-custom .thumb-info-caption p {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 15px;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.thumb-info-side-image-custom:hover {
|
||||
box-shadow: 10px 10px 74px -15px rgba(0, 0, 0, 0.33) !important;
|
||||
}
|
||||
|
||||
.thumb-info-side-image-custom.thumb-info-side-image-custom-highlight .thumb-info-side-image-wrapper {
|
||||
margin: 0 0 10px 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.thumb-info-side-image-custom.thumb-info-side-image-custom-highlight .thumb-info-caption {
|
||||
padding: 0 10px;
|
||||
display: block;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.thumb-info-side-image-custom.thumb-info-side-image-custom-highlight .thumb-info-caption h4 {
|
||||
margin: 3px 0 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.thumb-info-side-image-custom.thumb-info-side-image-custom-highlight .thumb-info-caption p {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.thumb-info-side-image-custom.thumb-info-side-image-custom-highlight .thumb-info-side-image-wrapper {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.content-grid .content-grid-item {
|
||||
min-height: 150px;
|
||||
border: 1px solid #e4e4e4;
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
.content-grid .content-grid-item:first-child {
|
||||
border-left: 1px solid #e4e4e4;
|
||||
}
|
||||
|
||||
.content-grid .content-grid-item::before, .content-grid .content-grid-item::after {
|
||||
content: none;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.content-grid .content-grid-item:nth-child(4) {
|
||||
border-left: 1px solid #e4e4e4;
|
||||
}
|
||||
.content-grid .content-grid-item:nth-child(4), .content-grid .content-grid-item:nth-child(5), .content-grid .content-grid-item:nth-child(6) {
|
||||
border-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.content-grid .content-grid-item {
|
||||
border-top: 0;
|
||||
border-left: 1px solid #e4e4e4;
|
||||
}
|
||||
.content-grid .content-grid-item:first-child {
|
||||
border-top: 1px solid #e4e4e4;
|
||||
}
|
||||
}
|
||||
|
||||
.testimonial .testimonial-quote {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
color: var(--light);
|
||||
font-size: 50px;
|
||||
line-height: 1;
|
||||
font-family: Georgia, serif;
|
||||
}
|
||||
|
||||
.testimonial .testimonial-quote::before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 25%;
|
||||
left: 50%;
|
||||
border: 1px solid #fff;
|
||||
border-radius: 100%;
|
||||
padding: 25px;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
}
|
||||
|
||||
.testimonial blockquote::before, .testimonial blockquote::after {
|
||||
color: var(--light) !important;
|
||||
font-size: 40px !important;
|
||||
}
|
||||
|
||||
.testimonial blockquote p {
|
||||
color: var(--light) !important;
|
||||
font-family: "Poppins", Arial, sans-serif;
|
||||
font-size: 15px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.testimonial .testimonial-author p strong {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
.testimonial .testimonial-author p strong::before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 35%;
|
||||
top: -21px;
|
||||
left: 50%;
|
||||
border-top: 2px solid #80c9f2;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
}
|
||||
|
||||
#footer {
|
||||
background: #34383d;
|
||||
border: none;
|
||||
}
|
||||
|
||||
#footer p, #footer a, #footer strong {
|
||||
color: #95989c;
|
||||
}
|
||||
|
||||
#footer a strong {
|
||||
display: block;
|
||||
font-size: 30px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
#footer a label {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
#footer .custom-info span:nth-child(1) {
|
||||
color: #95989c;
|
||||
}
|
||||
|
||||
#footer .footer-copyright {
|
||||
background: #34383d;
|
||||
border-top: 1px solid #53585e;
|
||||
}
|
||||
|
||||
#footer .footer-copyright p {
|
||||
color: #95989c;
|
||||
}
|
||||
|
||||
.social-icons li {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.social-icons li:hover a {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.social-icons li a {
|
||||
border-radius: 0;
|
||||
}
|
||||
286
resources/assets/css/demos/demo-one-page-agency.css
Normal file
286
resources/assets/css/demos/demo-one-page-agency.css
Normal file
@ -0,0 +1,286 @@
|
||||
/*
|
||||
* RTL
|
||||
*/
|
||||
/*
|
||||
* General
|
||||
*/
|
||||
.custom-font-secondary {
|
||||
font-family: "Lora", serif !important;
|
||||
}
|
||||
|
||||
.custom-highlight-text-1 {
|
||||
position: absolute;
|
||||
right: -64px;
|
||||
bottom: -41px;
|
||||
font-size: 36.8px;
|
||||
font-size: 2.3rem;
|
||||
transform: rotate(-15deg);
|
||||
}
|
||||
|
||||
.custom-border-radius-1 {
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
.custom-container-style-3 {
|
||||
min-width: 85vw;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.custom-container-style-3 {
|
||||
min-width: 540px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.custom-container-style-3 {
|
||||
min-width: 720px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-container-style-3 {
|
||||
min-width: 960px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-container-style-3 {
|
||||
min-width: 1140px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-container-position-1 {
|
||||
position: relative;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Buttons
|
||||
*/
|
||||
@keyframes toBottomFromTop {
|
||||
49% {
|
||||
transform: translate3d(0, 100%, 0) scale(1);
|
||||
}
|
||||
50% {
|
||||
opacity: 0;
|
||||
transform: translate3d(0, -100%, 0) scale(1);
|
||||
}
|
||||
51% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-btn-effect-1:hover > .animated-icon,
|
||||
.custom-btn-effect-1:hover > img,
|
||||
.custom-btn-effect-1:hover > i,
|
||||
.custom-link-effect-1:hover > .animated-icon,
|
||||
.custom-link-effect-1:hover > img,
|
||||
.custom-link-effect-1:hover > i {
|
||||
animation: toBottomFromTop 0.3s forwards;
|
||||
}
|
||||
|
||||
/*
|
||||
* Main
|
||||
*/
|
||||
.main {
|
||||
margin-top: -78px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
#header {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
top: calc(100vh - 78px);
|
||||
left: 0;
|
||||
height: 78px;
|
||||
}
|
||||
|
||||
#header .header-btn-collapse-nav {
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
#header .container {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#header .header-body {
|
||||
background: transparent;
|
||||
border-top: 0;
|
||||
border-bottom: 0;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
#header .header-container {
|
||||
min-height: 78px;
|
||||
}
|
||||
|
||||
#header .header-nav {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#header .header-nav-main:before {
|
||||
content: none;
|
||||
}
|
||||
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
position: relative;
|
||||
background: transparent !important;
|
||||
font-size: 13.6px;
|
||||
font-size: 0.85rem;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0;
|
||||
color: var(--light) !important;
|
||||
transition: ease color 300ms;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) and (max-width: 1060px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
padding: 27px 7px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1061px) and (max-width: 1199px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
padding: 27px 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
padding: 27px 16px;
|
||||
}
|
||||
}
|
||||
|
||||
#header .header-nav-main nav > ul > li > a.active:before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
border-bottom: 3px solid var(--grey-500);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
#header .header-nav-main nav > ul > li > a.active:before {
|
||||
bottom: 0;
|
||||
border-width: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
#header .header-nav-main nav > ul li {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
html.sticky-header-active #header .header-body {
|
||||
top: 0;
|
||||
background: var(--quaternary);
|
||||
border-bottom-color: var(--quaternary);
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
html:not(.sticky-header-active) #header .header-body {
|
||||
background: var(--quaternary);
|
||||
border-bottom-color: var(--quaternary);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
height: 100%;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li > a.active {
|
||||
color: var(--grey-500) !important;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li:hover > a, #header .header-nav-main nav > ul > li.open > a {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Owl Carousel
|
||||
*/
|
||||
.custom-dots-style-1 .owl-dots {
|
||||
bottom: 55px !important;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot {
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot.active, .custom-dots-style-1 .owl-dots .owl-dot:hover {
|
||||
transform: scale(1.3);
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot + .owl-dot {
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Testimonials
|
||||
*/
|
||||
.custom-testimonial-style-1 blockquote > p {
|
||||
font-family: "Lora", sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1.testimonial-with-quotes blockquote:before, .custom-testimonial-style-1.testimonial-with-quotes blockquote:after {
|
||||
font-family: "Lora", sans-serif;
|
||||
font-weight: bold;
|
||||
color: #212121;
|
||||
}
|
||||
|
||||
/*
|
||||
* Sort
|
||||
*/
|
||||
.sort-destination-loader.sort-destination-loader-showing {
|
||||
max-height: none;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
/*
|
||||
* Buttons
|
||||
*/
|
||||
.btn.custom-btn-style-1 {
|
||||
border: 1px solid var(--quaternary-rgba-20);
|
||||
}
|
||||
|
||||
.btn.custom-btn-style-1:hover {
|
||||
background: var(--quaternary-rgba-10);
|
||||
}
|
||||
|
||||
.btn.custom-btn-style-1._color-2 {
|
||||
border: 1px solid var(--secondary-rgba-50);
|
||||
}
|
||||
|
||||
.btn.custom-btn-style-1._color-2:hover {
|
||||
background: var(--secondary-rgba-40);
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
#header .header-nav-main nav > ul > li > a.active {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
#header .header-nav-main nav > ul > li > a.active:before {
|
||||
border-color: var(--primary);
|
||||
}
|
||||
|
||||
#header .header-nav-main nav > ul > li:hover > a.active, #header .header-nav-main nav > ul > li.open > a.active {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
#header .header-nav-main nav > ul > li:hover > a.active:before, #header .header-nav-main nav > ul > li.open > a.active:before {
|
||||
border-color: var(--primary);
|
||||
}
|
||||
|
||||
/*
|
||||
* Thumb Info
|
||||
*/
|
||||
.thumb-info.custom-thumb-info-style-1 .thumb-info-wrapper:after {
|
||||
background-color: var(--primary-rgba-80);
|
||||
}
|
||||
234
resources/assets/css/demos/demo-personal-portfolio-1.css
Normal file
234
resources/assets/css/demos/demo-personal-portfolio-1.css
Normal file
@ -0,0 +1,234 @@
|
||||
.custom-font-1 {
|
||||
font-family: 'Cormorant', serif !important;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: 'Cormorant', serif !important;
|
||||
}
|
||||
|
||||
h1 {
|
||||
line-height: 100%;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.1em;
|
||||
font-weight: 500;
|
||||
letter-spacing: 0;
|
||||
color: var(--primary);
|
||||
padding-left: 90px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
h3:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 80px;
|
||||
height: 1px;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
display: block;
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
h3.short {
|
||||
padding-left: 50px;
|
||||
}
|
||||
|
||||
h3.short:before {
|
||||
width: 40px;
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
h1 {
|
||||
font-size: 4vw;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes blinker {
|
||||
50% {
|
||||
opacity: 0.4;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-list-1 li {
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
.sticky-wrapper.sticky-wrapper-effect-1.sticky-wrapper-effect-1-dark.sticky-effect-active .sticky-body {
|
||||
background: var(--dark);
|
||||
}
|
||||
|
||||
html.side-header-overlay-full-screen #header {
|
||||
background: var(--dark);
|
||||
}
|
||||
|
||||
.custom-available-bullet {
|
||||
padding-left: 18px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-available-bullet:before {
|
||||
animation: blinker 1s linear infinite;
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
top: 3px;
|
||||
left: 0;
|
||||
display: block;
|
||||
border-radius: 100%;
|
||||
background-color: #39b54a;
|
||||
}
|
||||
|
||||
.custom-circle-section-1 {
|
||||
z-index: 100;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-curved-text-1 {
|
||||
max-width: 130px;
|
||||
left: 0 !important;
|
||||
top: auto !important;
|
||||
bottom: 0 !important;
|
||||
background: var(--light);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.custom-curved-text-1 svg {
|
||||
position: relative;
|
||||
left: 4px;
|
||||
top: 1px;
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
.custom-curved-text-2 {
|
||||
max-width: 130px;
|
||||
margin: 50px;
|
||||
background: var(--dark--100);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.custom-curved-text-2 svg {
|
||||
position: relative;
|
||||
left: 4px;
|
||||
top: 1px;
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
.horizontal-scroller-wrapper {
|
||||
z-index: 100;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
.horizontal-scroller-scroll {
|
||||
height: 100vh;
|
||||
}
|
||||
.horizontal-scroller-scroll .horizontal-scroller-item {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.horizontal-scroller-image {
|
||||
max-height: 90vh;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.custom-date-1 {
|
||||
padding-left: 50px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-date-1:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 40px;
|
||||
height: 1px;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
display: block;
|
||||
background-color: var(--dark);
|
||||
}
|
||||
|
||||
.spotlight-cursor-text {
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.spotlight-cursor-text .shape {
|
||||
will-change: transform;
|
||||
position: absolute;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.spotlight-cursor-text .shape.shape-1 {
|
||||
background: #1EA6EA;
|
||||
width: 650px;
|
||||
height: 650px;
|
||||
margin: -325px 0 0 -325px;
|
||||
}
|
||||
|
||||
.spotlight-cursor-text .shape.shape-2 {
|
||||
background: #3CC4FF;
|
||||
width: 440px;
|
||||
height: 440px;
|
||||
margin: -220px 0 0 -220px;
|
||||
}
|
||||
|
||||
.spotlight-cursor-text .shape.shape-3 {
|
||||
background: #5AE2FF;
|
||||
width: 270px;
|
||||
height: 270px;
|
||||
margin: -135px 0 0 -135px;
|
||||
}
|
||||
|
||||
.spotlight-cursor-text .content {
|
||||
top: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
background: var(--light);
|
||||
mix-blend-mode: screen;
|
||||
}
|
||||
|
||||
.spotlight-cursor-text .title {
|
||||
font-size: 200px;
|
||||
line-height: 200px;
|
||||
letter-spacing: 0;
|
||||
font-weight: bolder;
|
||||
color: var(--dark);
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.spotlight-cursor-text .title {
|
||||
font-size: 75px;
|
||||
line-height: 75px;
|
||||
}
|
||||
}
|
||||
|
||||
.spotlight-cursor-text .overlay:before {
|
||||
top: -1px;
|
||||
right: -1px;
|
||||
bottom: -1px;
|
||||
left: -1px;
|
||||
}
|
||||
|
||||
.spotlight-cursor-text .thumb-info.thumb-info-no-borders .thumb-info-wrapper:after {
|
||||
top: -1px;
|
||||
right: -1px;
|
||||
bottom: -1px;
|
||||
left: -1px;
|
||||
}
|
||||
|
||||
.contact-info {
|
||||
padding-top: 100px;
|
||||
}
|
||||
110
resources/assets/css/demos/demo-personal-portfolio-2.css
Normal file
110
resources/assets/css/demos/demo-personal-portfolio-2.css
Normal file
@ -0,0 +1,110 @@
|
||||
.custom-perspective {
|
||||
perspective: 1000px;
|
||||
}
|
||||
|
||||
.custom-available-bullet {
|
||||
padding-left: 18px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-available-bullet:before {
|
||||
animation: blinker 1s linear infinite;
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
top: 3px;
|
||||
left: 0;
|
||||
display: block;
|
||||
border-radius: 100%;
|
||||
background-color: #39b54a;
|
||||
}
|
||||
|
||||
@keyframes blinker {
|
||||
50% {
|
||||
opacity: 0.4;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-hero-font-1 {
|
||||
font-size: calc(40px + 50 * ((100vw - 300px) / (1200 - 300)));
|
||||
line-height: calc(40px + 50 * ((100vw - 300px) / (1200 - 300)));
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.custom-border-bottom-1 {
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.custom-border-bottom-2 {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.custom-hero-text-1 {
|
||||
padding: 0 0 0 15px;
|
||||
display: block;
|
||||
max-width: 430px;
|
||||
font-size: 20.8px;
|
||||
font-size: 1.3rem;
|
||||
line-height: 1.7;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.custom-hero-text-1 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-hero-text-1 {
|
||||
max-width: 95%;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-stroke-text-effect-1 {
|
||||
-webkit-text-fill-color: transparent;
|
||||
-webkit-text-stroke-width: 1.5px;
|
||||
-webkit-text-stroke-color: var(--dark);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.custom-stroke-text-effect-2 {
|
||||
-webkit-text-fill-color: transparent;
|
||||
-webkit-text-stroke-width: 1px;
|
||||
-webkit-text-stroke-color: var(--light);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.custom-hero-img-1 {
|
||||
max-width: 100px;
|
||||
max-height: 100px;
|
||||
margin: 15px;
|
||||
}
|
||||
|
||||
.custom-footer-font-1 {
|
||||
font-size: calc(40px + 50 * ((100vw - 300px) / (1200 - 300)));
|
||||
line-height: calc(40px + 50 * ((100vw - 300px) / (1200 - 300)));
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.custom-footer-font-1 em {
|
||||
padding: 0 40px;
|
||||
border-radius: 20px;
|
||||
font-style: normal;
|
||||
zoom: 0.52;
|
||||
position: relative;
|
||||
top: -40px;
|
||||
}
|
||||
|
||||
.custom-footer-img-1 {
|
||||
max-width: 100px;
|
||||
max-height: 100px;
|
||||
margin: 15px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-disable-scroll-mobile-1 {
|
||||
transform: none !important;
|
||||
}
|
||||
}
|
||||
152
resources/assets/css/demos/demo-personal-portfolio-3.css
Normal file
152
resources/assets/css/demos/demo-personal-portfolio-3.css
Normal file
@ -0,0 +1,152 @@
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
color: var(--light);
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
h4 {
|
||||
text-transform: uppercase;
|
||||
font-weight: 500;
|
||||
letter-spacing: 3px;
|
||||
opacity: 0.7;
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
.custom-hero-font-1 {
|
||||
padding: 0;
|
||||
line-height: 1;
|
||||
font-size: clamp(16px, 8vw, 90px);
|
||||
font-weight: 500;
|
||||
letter-spacing: 12px;
|
||||
text-transform: uppercase;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.custom-perspective {
|
||||
perspective: 1000px;
|
||||
}
|
||||
|
||||
.sticky-wrapper.sticky-wrapper-effect-1.sticky-wrapper-effect-1-dark.sticky-effect-active .sticky-body {
|
||||
background: var(--dark);
|
||||
}
|
||||
|
||||
html.side-header-overlay-full-screen #header {
|
||||
background: var(--dark);
|
||||
}
|
||||
|
||||
.custom-hero .custom-el-2:nth-child(1) {
|
||||
opacity: 0.9;
|
||||
transition: all 1s;
|
||||
}
|
||||
|
||||
.custom-hero .custom-el-2:nth-child(2) {
|
||||
mix-blend-mode: hard-light;
|
||||
opacity: 0;
|
||||
transition: all 1s;
|
||||
}
|
||||
|
||||
.custom-hero:hover .custom-el-2:nth-child(1) {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.custom-hero:hover .custom-el-2:nth-child(2) {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.custom-el-1,
|
||||
.custom-el-2,
|
||||
.custom-el-2-wrapper {
|
||||
width: 425px;
|
||||
height: 500px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
.custom-el-1,
|
||||
.custom-el-2,
|
||||
.custom-el-2-wrapper {
|
||||
width: 340px;
|
||||
height: 400px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-el-1 {
|
||||
margin: -10px;
|
||||
}
|
||||
|
||||
.custom-el-2 {
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.custom-el-2 img {
|
||||
opacity: 0;
|
||||
transition: all 300ms;
|
||||
}
|
||||
|
||||
.custom-el-2 img.lazyloaded {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.thumb-info-floating-element {
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.bg-color-changer {
|
||||
transition: background-color 700ms cubic-bezier(0.25, 1, 0.5, 1);
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
min-height: 100vh;
|
||||
min-width: 100vw;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.custom-portfolio-item-1 .custom-portfolio-item-1-img {
|
||||
border-radius: 4px 0px 0px 4px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-portfolio-item-1 .custom-portfolio-item-1-img {
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
}
|
||||
|
||||
.custom-portfolio-item-1 .custom-portfolio-item-1-type {
|
||||
padding: 10px;
|
||||
width: 60px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.custom-portfolio-item-1 .custom-portfolio-item-1-type span {
|
||||
display: block;
|
||||
white-space: nowrap;
|
||||
transform-origin: 0 0;
|
||||
transform: translate3d(32px, 10px, 0) rotate(90deg);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-portfolio-item-1 .custom-portfolio-item-1-type {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes arrowMove {
|
||||
0% {
|
||||
transform: translateY(5px);
|
||||
}
|
||||
50% {
|
||||
transform: translateY(10px);
|
||||
}
|
||||
100% {
|
||||
transform: translateY(5px);
|
||||
}
|
||||
}
|
||||
|
||||
.custom-arrow-anim {
|
||||
animation: arrowMove 600ms ease;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
2814
resources/assets/css/demos/demo-photography-2.css
Normal file
2814
resources/assets/css/demos/demo-photography-2.css
Normal file
File diff suppressed because it is too large
Load Diff
2672
resources/assets/css/demos/demo-photography-3.css
Normal file
2672
resources/assets/css/demos/demo-photography-3.css
Normal file
File diff suppressed because it is too large
Load Diff
2274
resources/assets/css/demos/demo-photography.css
Normal file
2274
resources/assets/css/demos/demo-photography.css
Normal file
File diff suppressed because it is too large
Load Diff
286
resources/assets/css/demos/demo-product-landing.css
Normal file
286
resources/assets/css/demos/demo-product-landing.css
Normal file
@ -0,0 +1,286 @@
|
||||
@charset "UTF-8";
|
||||
body {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.container:not(.container-bs):not(.container-xl-custom):not(.container-xxl-custom) {
|
||||
max-width: 1200px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-absolute-y-center {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
|
||||
.custom-border-color-1 {
|
||||
border-color: #31363c !important;
|
||||
}
|
||||
|
||||
.custom-border-color-2 {
|
||||
border-color: #44494e !important;
|
||||
}
|
||||
|
||||
.custom-border-color-3 {
|
||||
border-color: #f4f4f4 !important;
|
||||
}
|
||||
|
||||
.custom-filter-grayscale-1 {
|
||||
filter: grayscale(1);
|
||||
}
|
||||
|
||||
@media (min-width: 500px) {
|
||||
.custom-ws-nowrap {
|
||||
white-space: nowrap !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-remove-left-divider {
|
||||
border-left: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-bg-color-grey-1 {
|
||||
background-color: #eff1f3 !important;
|
||||
}
|
||||
|
||||
.custom-font-size-1 {
|
||||
font-size: 0.55em;
|
||||
}
|
||||
|
||||
.custom-font-size-2 {
|
||||
font-size: 0.35em;
|
||||
}
|
||||
|
||||
.custom-letter-spacing-1 {
|
||||
letter-spacing: 5px;
|
||||
}
|
||||
|
||||
.custom-letter-spacing-2 {
|
||||
letter-spacing: 3px;
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.custom-xs-margin-top-1 {
|
||||
margin-top: -80px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-xl-margin-top-1 {
|
||||
margin-top: -70px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Header */
|
||||
#header {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-weight: 600;
|
||||
font-size: 13.6px;
|
||||
font-size: 0.85rem;
|
||||
letter-spacing: 0;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
#header .list > li > a {
|
||||
font-weight: 400;
|
||||
font-size: 13.6px;
|
||||
font-size: 0.85rem;
|
||||
letter-spacing: 0.5px;
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
#header .header-nav.header-nav-line .header-nav-main nav > ul > li:hover.no-line-effect > a:before, #header .header-nav.header-nav-line .header-nav-main nav > ul > li.active.no-line-effect > a:before {
|
||||
content: none;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) and (max-width: 1199px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
padding: 0 1rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
padding: 0 1.1rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
html:not(.sticky-header-active) #header .header-body.header-border-bottom {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
/* Custom Section Padding */
|
||||
@media (min-width: 992px) {
|
||||
.custom-section-padding-1 {
|
||||
padding: 10vw 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Custom Product Image Styles */
|
||||
@media (min-width: 1200px) {
|
||||
.custom-product-image-style-1 {
|
||||
position: absolute;
|
||||
top: 81%;
|
||||
left: 130px;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
.custom-product-image-style-1 img {
|
||||
max-width: calc(100% + 740px);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) and (max-width: 1199px) {
|
||||
.custom-product-image-style-1 img {
|
||||
margin-left: 140px;
|
||||
max-width: 170%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-product-image-style-2 {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
max-width: none;
|
||||
width: 47vw;
|
||||
}
|
||||
}
|
||||
|
||||
/* Custom Icons */
|
||||
.custom-icon-left-arrows,
|
||||
.custom-icon-right-arrows {
|
||||
position: relative;
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
}
|
||||
|
||||
.custom-icon-left-arrows:before,
|
||||
.custom-icon-right-arrows:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: -35%;
|
||||
top: 50%;
|
||||
width: 90%;
|
||||
height: 90%;
|
||||
border-top: 1px solid var(--dark);
|
||||
border-left: 1px solid var(--dark);
|
||||
opacity: 0.6;
|
||||
transform: translate3d(0, -50%, 0) rotate(-45deg);
|
||||
}
|
||||
|
||||
.custom-icon-left-arrows:after,
|
||||
.custom-icon-right-arrows:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
right: -35%;
|
||||
top: 50%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-top: 1px solid var(--dark);
|
||||
border-left: 1px solid var(--dark);
|
||||
transform: translate3d(0, -50%, 0) rotate(-45deg);
|
||||
}
|
||||
|
||||
.custom-icon-right-arrows {
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
|
||||
/* Custom Min Width */
|
||||
.custom-min-width {
|
||||
display: inline-block;
|
||||
min-width: 170px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) and (max-width: 1199px) {
|
||||
.custom-min-width {
|
||||
min-width: 140px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Custom Play Button */
|
||||
.custom-play-button-1 {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border-radius: 100%;
|
||||
background: var(--light);
|
||||
color: var(--dark);
|
||||
transition: ease transform 300ms;
|
||||
font-size: 20.8px;
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
.custom-play-button-1:hover {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
/* Custom List Styles */
|
||||
.custom-list-style-1 > li {
|
||||
margin: 0 !important;
|
||||
padding-right: 16px;
|
||||
padding-right: 1rem;
|
||||
padding-left: 16px;
|
||||
padding-left: 1rem;
|
||||
border-right: 1px solid #414346;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.custom-list-style-1 > li:last-child {
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
/* Custom SVG Line Animation */
|
||||
@keyframes customSVGLineAnim {
|
||||
from {
|
||||
stroke-dasharray: 380;
|
||||
stroke-dashoffset: 170;
|
||||
}
|
||||
to {
|
||||
stroke-dasharray: 310;
|
||||
stroke-dashoffset: 340;
|
||||
}
|
||||
}
|
||||
|
||||
.customSVGLineAnim {
|
||||
animation-name: customSVGLineAnim;
|
||||
}
|
||||
|
||||
@keyframes customSVGLineAnimTwo {
|
||||
from {
|
||||
stroke-dasharray: 820;
|
||||
stroke-dashoffset: 500;
|
||||
}
|
||||
to {
|
||||
stroke-dasharray: 1120;
|
||||
stroke-dashoffset: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.customSVGLineAnimTwo {
|
||||
animation-name: customSVGLineAnimTwo;
|
||||
}
|
||||
|
||||
/* 360º Product Viewer */
|
||||
.cd-product-viewer-handle .handle {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.cd-product-viewer-handle .fill {
|
||||
background-color: #e8e9e9;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
/* Product Carousel Thumb Gallery */
|
||||
.thumb-gallery-wrapper .thumb-gallery-thumbs .owl-item:hover, .thumb-gallery-wrapper .thumb-gallery-thumbs .owl-item.selected {
|
||||
border-color: var(--primary);
|
||||
}
|
||||
193
resources/assets/css/demos/demo-real-estate.css
Normal file
193
resources/assets/css/demos/demo-real-estate.css
Normal file
@ -0,0 +1,193 @@
|
||||
h2 {
|
||||
text-transform: none;
|
||||
font-weight: 600;
|
||||
font-size: 2.2em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
text-transform: none;
|
||||
font-weight: 600;
|
||||
font-size: 1.6em;
|
||||
}
|
||||
|
||||
h4, h5, h6 {
|
||||
text-transform: none;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
#header .header-top {
|
||||
border-bottom-width: 1px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
text-transform: capitalize;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
#header .header-nav-main.header-nav-main-dropdown-modern nav > ul > li.dropdown .dropdown-menu li a {
|
||||
font-weight: 500;
|
||||
color: var(--default);
|
||||
}
|
||||
}
|
||||
|
||||
.custom-card-info {
|
||||
background: transparent;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.custom-card-info.custom-card-info-shadow:before {
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
opacity: 0;
|
||||
content: '';
|
||||
box-shadow: 0 30px 110px #bbb;
|
||||
border-radius: .25rem;
|
||||
transition: opacity 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.custom-card-info .custom-card-info-arrow {
|
||||
transition: all 0.2s ease-in-out;
|
||||
right: 0 !important;
|
||||
}
|
||||
|
||||
.custom-card-info:hover.custom-card-info-shadow:before {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.custom-card-info:hover .custom-card-info-arrow {
|
||||
right: -7px !important;
|
||||
}
|
||||
|
||||
.custom-card-info .card-body {
|
||||
padding: 0;
|
||||
border-radius: .25rem;
|
||||
background: var(--light);
|
||||
}
|
||||
|
||||
.custom-card-info .featured-tag {
|
||||
color: var(--light);
|
||||
text-transform: uppercase;
|
||||
padding: 15px 102px;
|
||||
position: absolute;
|
||||
right: -24%;
|
||||
top: 6%;
|
||||
transform: rotate(45deg);
|
||||
transition: none 0s ease 0s;
|
||||
text-align: inherit;
|
||||
line-height: 24px;
|
||||
border-width: 0px;
|
||||
margin: 0px;
|
||||
letter-spacing: -0.5px;
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.custom-card-info .custom-card-info-header {
|
||||
border-bottom: 1px solid #E7E7E7;
|
||||
padding: 16px;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.custom-card-info .custom-card-info-content {
|
||||
padding: 16px;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.custom-card-info-slider {
|
||||
max-width: 390px;
|
||||
}
|
||||
|
||||
.custom-card-info-slider .custom-card-info-header {
|
||||
padding: 32px;
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.custom-card-info-slider .custom-card-info-content {
|
||||
padding: 32px;
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.custom-card-info-locations img {
|
||||
transition: ease all 300ms;
|
||||
filter: grayscale(100%);
|
||||
}
|
||||
|
||||
.custom-card-info-locations .card-body:before {
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
.custom-card-info-locations:hover img {
|
||||
filter: none;
|
||||
}
|
||||
|
||||
.custom-card-info-locations:hover .card-body:before {
|
||||
opacity: 0.4 !important;
|
||||
}
|
||||
|
||||
.custom-card-info-locations .custom-card-info-desc {
|
||||
top: 50%;
|
||||
position: absolute;
|
||||
transform: translateY(-50%);
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
display: block;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.custom-card-info-special-offers .custom-card-info-desc {
|
||||
top: 50%;
|
||||
position: absolute;
|
||||
transform: translateY(-50%);
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
display: block;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.custom-view-more svg {
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-view-more:hover svg {
|
||||
transform: translate3d(7px, 0, 0);
|
||||
}
|
||||
|
||||
.btn.custom-btn-search-page-header {
|
||||
padding-top: 16px;
|
||||
padding-top: 1rem;
|
||||
padding-bottom: 16px;
|
||||
padding-bottom: 1rem;
|
||||
position: relative;
|
||||
bottom: 5px;
|
||||
}
|
||||
|
||||
.page-header .form-style-3 {
|
||||
margin-top: -30px;
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
#footer {
|
||||
border: 0;
|
||||
background: #333;
|
||||
}
|
||||
|
||||
#footer .footer-copyright {
|
||||
border-top: 1px solid #454545;
|
||||
background: #333;
|
||||
}
|
||||
|
||||
#footer .footer-copyright p {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
@media (min-width: 992px) {
|
||||
html #header .header-nav:not(.header-nav-line):not(.header-nav-links) .header-nav-main nav > ul:not(:hover) > li.dropdown-full-color.dropdown-quaternary > a.active {
|
||||
color: var(--primary);
|
||||
}
|
||||
}
|
||||
247
resources/assets/css/demos/demo-renewable-energy.css
Normal file
247
resources/assets/css/demos/demo-renewable-energy.css
Normal file
@ -0,0 +1,247 @@
|
||||
body {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li {
|
||||
margin: 0 20px;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 18px;
|
||||
padding: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
h3 {
|
||||
text-transform: none;
|
||||
font-weight: bold;
|
||||
font-size: 2.3em;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
|
||||
p {
|
||||
font-weight: 500;
|
||||
font-size: 18px;
|
||||
line-height: 30px;
|
||||
}
|
||||
|
||||
.custom-el-pos-1 {
|
||||
margin-top: -100px;
|
||||
}
|
||||
|
||||
.custom-el-pos-2 {
|
||||
top: 25px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-el-pos-2 {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-el-pos-3 {
|
||||
bottom: -25px !important;
|
||||
}
|
||||
|
||||
@media (max-width: 1919px) {
|
||||
.custom-shape-divider-1 {
|
||||
min-width: 1920px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-shape-divider-1.custom-shape-divider-1-flip-horizonal {
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
|
||||
.hero {
|
||||
height: 750px;
|
||||
}
|
||||
|
||||
.hero-el-1 {
|
||||
width: 1400px;
|
||||
height: 1400px;
|
||||
position: absolute;
|
||||
border-radius: 100%;
|
||||
top: -62%;
|
||||
left: -21%;
|
||||
}
|
||||
|
||||
.hero-el-2 {
|
||||
width: 1400px;
|
||||
height: 1400px;
|
||||
position: absolute;
|
||||
border-radius: 100%;
|
||||
top: -65%;
|
||||
left: -20.3%;
|
||||
background: var(--primary-100);
|
||||
}
|
||||
|
||||
.custom-text-1 {
|
||||
font-size: 200px;
|
||||
position: relative;
|
||||
top: 100px;
|
||||
}
|
||||
|
||||
.custom-text-1 em {
|
||||
font-size: 0.7em;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-text-1 {
|
||||
font-size: 180px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1400px) {
|
||||
.custom-text-1 {
|
||||
font-size: 300px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-svg-position-1 {
|
||||
position: absolute;
|
||||
top: -500px;
|
||||
left: 100px;
|
||||
opacity: 0.2;
|
||||
}
|
||||
|
||||
.custom-svg-position-2 {
|
||||
position: absolute;
|
||||
top: 300px;
|
||||
left: -62%;
|
||||
opacity: 0.2;
|
||||
z-index: 0;
|
||||
max-width: 2000px;
|
||||
}
|
||||
|
||||
.custom-svg-position-3 {
|
||||
position: absolute;
|
||||
top: 395px;
|
||||
right: -60%;
|
||||
opacity: 0.2;
|
||||
z-index: 0;
|
||||
max-width: 2000px;
|
||||
}
|
||||
|
||||
@keyframes customLines1anim {
|
||||
from {
|
||||
stroke-dasharray: 1600;
|
||||
stroke-dashoffset: 1600;
|
||||
}
|
||||
to {
|
||||
stroke-dasharray: 1600;
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.customLines1anim {
|
||||
animation-name: customLines1anim;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-highlight-1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.custom-highlight-1:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 60%;
|
||||
left: 50%;
|
||||
width: 0%;
|
||||
height: 25%;
|
||||
background-color: var(--primary);
|
||||
z-index: -1;
|
||||
right: 0;
|
||||
}
|
||||
.custom-highlight-1-tertiary:after {
|
||||
background-color: var(--tertiary);
|
||||
}
|
||||
}
|
||||
|
||||
.custom-highlight-anim:after {
|
||||
animation-name: customHighlightAnim;
|
||||
animation-duration: 2s;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
.custom-highlight-anim-delay:after {
|
||||
animation-delay: 1s;
|
||||
}
|
||||
|
||||
@keyframes customHighlightAnim {
|
||||
0% {
|
||||
width: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
width: 52%;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.carousel-half-full-width-wrapper > .owl-carousel .owl-stage-outer {
|
||||
padding-top: 40px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.carousel-half-full-width-wrapper > .owl-carousel .owl-nav {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: auto;
|
||||
transform: none;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.carousel-half-full-width-wrapper > .owl-carousel .owl-nav button.owl-prev, .carousel-half-full-width-wrapper > .owl-carousel .owl-nav button.owl-next {
|
||||
position: static;
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.carousel-half-full-width-wrapper > .owl-carousel .owl-nav button.owl-prev {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.carousel-half-full-width-wrapper > .owl-carousel .owl-nav button.owl-next {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.custom-block-1:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
background: var(--quaternary);
|
||||
display: block;
|
||||
top: -40px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.custom-block-1 h4 {
|
||||
position: relative;
|
||||
top: -20px;
|
||||
}
|
||||
|
||||
.custom-block-1.custom-block-1-bottom:after {
|
||||
top: auto;
|
||||
bottom: -40px;
|
||||
}
|
||||
|
||||
.custom-block-1.custom-block-1-bottom h4 {
|
||||
top: 20px;
|
||||
}
|
||||
|
||||
.custom-min-width-1 {
|
||||
min-width: 195px;
|
||||
}
|
||||
252
resources/assets/css/demos/demo-restaurant.css
Normal file
252
resources/assets/css/demos/demo-restaurant.css
Normal file
@ -0,0 +1,252 @@
|
||||
/*
|
||||
* Typography
|
||||
*/
|
||||
.custom-font-secondary {
|
||||
font-family: "Lora", serif !important;
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
font-family: "Lora", serif;
|
||||
}
|
||||
|
||||
.custom-big-font-size-1 {
|
||||
font-size: 56px;
|
||||
font-size: 3.5rem;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.custom-big-font-size-1 {
|
||||
font-size: 5.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Spacement
|
||||
*/
|
||||
@media (min-width: 992px) {
|
||||
.custom-negative-margin-top-1 {
|
||||
margin-top: -360px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.pl-xs-1 {
|
||||
padding-left: .25rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Border
|
||||
*/
|
||||
.custom-border-radius-1 {
|
||||
border-radius: 7px !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Buttons
|
||||
*/
|
||||
.custom-btn-style-1 {
|
||||
position: relative;
|
||||
border-radius: 7px;
|
||||
padding: 10px 20px;
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-btn-style-1 > span {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-btn-style-1:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: inherit;
|
||||
opacity: 0.4;
|
||||
border-radius: inherit;
|
||||
transform: translate3d(5px, 5px, 0);
|
||||
transition: ease transform 300ms;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-btn-style-1:hover {
|
||||
transform: translate3d(2.5px, 2.5px, 0);
|
||||
}
|
||||
|
||||
.custom-btn-style-1:hover:before {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
/*
|
||||
* Overlay
|
||||
*/
|
||||
.overlay:before {
|
||||
background: #2C2C2C;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Line
|
||||
*/
|
||||
.custom-line {
|
||||
width: 50px;
|
||||
border-bottom: 2px solid var(--grey-500);
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Divider Size
|
||||
*/
|
||||
.custom-divider-size-1 {
|
||||
height: 3px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) and (max-width: 1199px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Testimonials
|
||||
*/
|
||||
.custom-testimonial-style-1.testimonial-with-quotes blockquote:before, .custom-testimonial-style-1.testimonial-with-quotes blockquote:after {
|
||||
font-family: "Lora", sans-serif;
|
||||
font-weight: bold;
|
||||
font-size: 40px;
|
||||
font-size: 2.5rem;
|
||||
color: #212121;
|
||||
top: 10px;
|
||||
}
|
||||
|
||||
.custom-testimonial-style-1.testimonial-with-quotes.custom-testimonial-style-1-quote-big blockquote:before, .custom-testimonial-style-1.testimonial-with-quotes.custom-testimonial-style-1-quote-big blockquote:after {
|
||||
font-size: 64px;
|
||||
font-size: 4rem;
|
||||
top: -6px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Menu Item
|
||||
*/
|
||||
.custom-menu-item .custom-menu-item-details {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-title {
|
||||
position: relative;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-price {
|
||||
position: relative;
|
||||
top: -5px;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-price strong {
|
||||
font-size: 20.8px;
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-price strong > span {
|
||||
font-size: 0.6em;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-details .custom-menu-item-line {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
bottom: 0;
|
||||
border-bottom: dashed 1px #777;
|
||||
}
|
||||
|
||||
.custom-menu-item .custom-menu-item-desc {
|
||||
position: relative;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.custom-menu-item + .custom-menu-item {
|
||||
margin-top: 25px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Blog Post Date
|
||||
*/
|
||||
.custom-date-style-1 {
|
||||
position: relative;
|
||||
border-radius: 7px;
|
||||
transition: ease transform 300ms;
|
||||
}
|
||||
|
||||
.custom-date-style-1:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: inherit;
|
||||
background: inherit;
|
||||
opacity: 0.7;
|
||||
transform: translate3d(5px, 5px, 0);
|
||||
transition: ease transform 300ms;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-date-style-1 > span > span {
|
||||
font-size: 0.5em;
|
||||
letter-spacing: 3px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Link Effects
|
||||
*/
|
||||
.custom-link-hover-effects:hover .custom-date-style-1 {
|
||||
transform: translate3d(2.5px, 2.5px, 0);
|
||||
}
|
||||
|
||||
.custom-link-hover-effects:hover .custom-date-style-1:before {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
/*
|
||||
* Breadcrumb
|
||||
*/
|
||||
.breadcrumb > li + li:before {
|
||||
opacity: 0.8;
|
||||
font-size: 0.8em;
|
||||
padding: 0 13px 0 7px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer {
|
||||
background: #2c2c2c;
|
||||
}
|
||||
|
||||
#footer p, #footer span, #footer li, #footer a:not(.btn):not(.no-footer-css) {
|
||||
color: #969696;
|
||||
}
|
||||
|
||||
#footer .footer-copyright {
|
||||
background: #2c2c2c;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
/*
|
||||
* Custom Line
|
||||
*/
|
||||
.custom-line {
|
||||
border-bottom-color: var(--primary);
|
||||
}
|
||||
1346
resources/assets/css/demos/demo-resume-dark.css
Normal file
1346
resources/assets/css/demos/demo-resume-dark.css
Normal file
File diff suppressed because it is too large
Load Diff
1227
resources/assets/css/demos/demo-resume.css
Normal file
1227
resources/assets/css/demos/demo-resume.css
Normal file
File diff suppressed because it is too large
Load Diff
230
resources/assets/css/demos/demo-sass.css
Normal file
230
resources/assets/css/demos/demo-sass.css
Normal file
@ -0,0 +1,230 @@
|
||||
body {
|
||||
min-width: 100%;
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
.custom-secondary-font {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
.custom-box-shadow-1 {
|
||||
box-shadow: 0 15px 30px -15px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
/* Header */
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul:not(:hover) > li > a.active {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
#header .header-nav-main nav > ul:not(:hover) > li > a.active:before {
|
||||
background: #FFF !important;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li:hover > a {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li:hover > a:before {
|
||||
background: #FFF !important;
|
||||
}
|
||||
html.sticky-header-active #header .header-nav-main nav > ul:not(:hover) > li > a.active {
|
||||
color: var(--dark) !important;
|
||||
}
|
||||
html.sticky-header-active #header .header-nav-main nav > ul:not(:hover) > li > a.active:before {
|
||||
background: var(--dark) !important;
|
||||
}
|
||||
html.sticky-header-active #header .header-nav-main nav > ul > li > a {
|
||||
color: var(--dark) !important;
|
||||
}
|
||||
html.sticky-header-active #header .header-nav-main nav > ul > li:hover > a {
|
||||
color: var(--dark) !important;
|
||||
}
|
||||
html.sticky-header-active #header .header-nav-main nav > ul > li:hover > a:before {
|
||||
background: var(--dark) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Header Social Icons */
|
||||
html.sticky-header-active #header .header-social-icons > li > a:hover > i {
|
||||
color: var(--light) !important;
|
||||
}
|
||||
|
||||
html.sticky-header-active #header .header-social-icons > li > a > i {
|
||||
color: var(--dark) !important;
|
||||
}
|
||||
|
||||
/* Animated Circles */
|
||||
.custom-animated-circles {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
transform: translate3d(-55%, 25%, 0);
|
||||
}
|
||||
|
||||
.custom-animated-circles .circle {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 50%;
|
||||
height: 50%;
|
||||
border-radius: 100%;
|
||||
border: 1px solid #FFF;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
animation-name: customAnimatedCircles;
|
||||
animation-iteration-count: infinite;
|
||||
animation-fill-mode: both;
|
||||
animation-timing-function: linear;
|
||||
animation-duration: 2.5s;
|
||||
animation-delay: 500ms;
|
||||
}
|
||||
|
||||
.custom-animated-circles .circle:nth-child(2) {
|
||||
width: 70%;
|
||||
height: 70%;
|
||||
animation-delay: 1000ms;
|
||||
}
|
||||
|
||||
.custom-animated-circles .circle:nth-child(3) {
|
||||
width: 90%;
|
||||
height: 90%;
|
||||
animation-delay: 1500ms;
|
||||
}
|
||||
|
||||
.custom-animated-circles .circle:nth-child(4) {
|
||||
width: 110%;
|
||||
height: 110%;
|
||||
animation-delay: 2000ms;
|
||||
}
|
||||
|
||||
.custom-animated-circles.custom-animated-circles-pos-2 {
|
||||
bottom: auto;
|
||||
top: 0;
|
||||
transform: translate3d(-55%, -25%, 0);
|
||||
}
|
||||
|
||||
.custom-animated-circles.custom-animated-circles-pos-3 {
|
||||
bottom: auto;
|
||||
left: auto;
|
||||
right: 0;
|
||||
transform: translate3d(65%, -50%, 0);
|
||||
top: 0;
|
||||
}
|
||||
|
||||
@keyframes customAnimatedCircles {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translate3d(-50%, -50%, 0) scale(0.8);
|
||||
}
|
||||
50% {
|
||||
opacity: 0.5;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: translate3d(-50%, -50%, 0) scale(1.1);
|
||||
}
|
||||
}
|
||||
|
||||
/* Custom Screens */
|
||||
.custom-screens-carousel {
|
||||
position: relative;
|
||||
z-index: 30;
|
||||
margin-top: -250px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-screens-carousel {
|
||||
margin-top: -90px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Carousel Ipad */
|
||||
.carousel-ipad {
|
||||
border-radius: 35px;
|
||||
border: 1px solid #FFF;
|
||||
padding: 50px;
|
||||
background: #F9F9F9;
|
||||
box-shadow: 0px 5px 50px rgba(0, 0, 0, 0.1);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.carousel-ipad {
|
||||
padding: 25px;
|
||||
border-radius: 17px;
|
||||
}
|
||||
}
|
||||
|
||||
.carousel-ipad img {
|
||||
border: 1px solid #FFF;
|
||||
}
|
||||
|
||||
.carousel-ipad .carousel-ipad-camera {
|
||||
background: #3c3d3d;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
margin-left: 20px;
|
||||
bottom: 50%;
|
||||
margin-bottom: -5px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.carousel-ipad .carousel-ipad-home {
|
||||
background: #F9F9F9;
|
||||
box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12);
|
||||
border-radius: 28px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
margin-right: 5px;
|
||||
bottom: 50%;
|
||||
margin-bottom: -20px;
|
||||
}
|
||||
|
||||
.carousel-ipad .carousel-ipad-home:after {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
margin-top: -8px;
|
||||
margin-left: -8px;
|
||||
border: 1px solid rgba(0, 0, 0, 0.12);
|
||||
border-radius: var(--border-radius);
|
||||
position: absolute;
|
||||
display: block;
|
||||
content: '';
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.carousel-ipad .carousel-ipad-camera, .carousel-ipad .carousel-ipad-home {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.carousel-ipad.carousel-ipad-sm {
|
||||
padding: 40px;
|
||||
border-radius: 25px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.carousel-ipad.carousel-ipad-sm {
|
||||
padding: 20px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Custom Form Style */
|
||||
.custom-form-style-1 .form-control {
|
||||
padding: 20.8px;
|
||||
padding: 1.3rem;
|
||||
height: 45px;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
/* Animated Circles */
|
||||
.custom-animated-circles-primary .circle {
|
||||
border-color: var(--primary) !important;
|
||||
}
|
||||
897
resources/assets/css/demos/demo-seo-2.css
Normal file
897
resources/assets/css/demos/demo-seo-2.css
Normal file
@ -0,0 +1,897 @@
|
||||
.body {
|
||||
max-width: 100vw;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
/*
|
||||
* Demo Fonts
|
||||
*/
|
||||
body {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
@media (min-width: 1240px) {
|
||||
.container {
|
||||
max-width: 1240px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Animations
|
||||
*/
|
||||
@keyframes expandInWithBlur {
|
||||
from {
|
||||
opacity: 0;
|
||||
filter: blur(10px);
|
||||
transform: scale(0.8);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
filter: blur(0px);
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.expandInWithBlur {
|
||||
animation-name: expandInWithBlur;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Text Colors
|
||||
*/
|
||||
.custom-text-color-grey-1 {
|
||||
color: var(--default) !important;
|
||||
}
|
||||
|
||||
.custom-text-color-grey-2 {
|
||||
color: #c0c1cc !important;
|
||||
}
|
||||
|
||||
.custom-text-color-light-1 {
|
||||
color: #e0e0e0 !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Background Colors
|
||||
*/
|
||||
.custom-bg-color-light-1 {
|
||||
background-color: #eff1f3 !important;
|
||||
}
|
||||
|
||||
.custom-bg-color-light-2 {
|
||||
background-color: #eff1f3 !important;
|
||||
}
|
||||
|
||||
.custom-bg-color-grey-1 {
|
||||
background-color: #b9b9b9 !important;
|
||||
}
|
||||
|
||||
.custom-bg-color-grey-2 {
|
||||
background-color: #e4e4e4 !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* General Custom Styles
|
||||
*/
|
||||
.custom-box-shadow-1 {
|
||||
box-shadow: 0px 0px 32px -7px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.custom-border-radius-1 {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Spacement Styles
|
||||
*/
|
||||
@media (min-width: 768px) {
|
||||
.custom-negative-margin-1 {
|
||||
margin-top: -390px;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Sizes
|
||||
*/
|
||||
.custom-font-size-1 {
|
||||
font-size: 1.3em !important;
|
||||
}
|
||||
|
||||
.custom-height-1 {
|
||||
height: calc(100% + 7px) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Curved Sections Top and Bottom
|
||||
*/
|
||||
.custom-section-curved-top-1 {
|
||||
position: absolute;
|
||||
top: -590px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.custom-section-curved-top-2 {
|
||||
position: absolute;
|
||||
top: -255px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.custom-section-curved-top-3 {
|
||||
position: absolute;
|
||||
top: -210px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.custom-section-curved-top-4 {
|
||||
position: absolute;
|
||||
top: -260px;
|
||||
left: 0;
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
|
||||
.custom-section-curved-top-5 {
|
||||
position: absolute;
|
||||
top: -236px;
|
||||
left: -60px;
|
||||
width: 115%;
|
||||
}
|
||||
|
||||
.custom-section-curved-top-6 {
|
||||
position: absolute;
|
||||
top: -560px;
|
||||
left: 0;
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
|
||||
.custom-section-curved-top-7 {
|
||||
position: absolute;
|
||||
top: -269px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.custom-page-header-curved-top-1 {
|
||||
position: absolute;
|
||||
top: -575px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
#header.header-transparent .header-body:not(.header-border-bottom) {
|
||||
border-bottom: 1px solid #e1e3e5 !important;
|
||||
}
|
||||
|
||||
#header .header-nav-features .header-nav-features-dropdown.show {
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-top {
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
#header .header-nav.header-nav-links nav > ul > li.dropdown.open > .dropdown-menu, #header .header-nav.header-nav-links nav > ul > li.dropdown:hover > .dropdown-menu {
|
||||
border-top: 0;
|
||||
border-radius: 7px !important;
|
||||
padding: 5px;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li {
|
||||
margin-left: 22px;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
#header .header-nav-main nav > ul > li.dropdown .dropdown-menu li a {
|
||||
padding: 6px 10px 6px 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
#header .header-nav-main nav > ul > li.dropdown a {
|
||||
color: #707070;
|
||||
}
|
||||
#header .header-nav-main:not(.header-nav-main-mobile-dark) nav > ul > li > a {
|
||||
color: #444 !important;
|
||||
}
|
||||
#header .header-nav-main:not(.header-nav-main-mobile-dark) nav > ul > li > a.active {
|
||||
background: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
html.sticky-header-active #header.header-transparent .header-body:not(.header-border-bottom) {
|
||||
border-bottom-color: rgba(234, 234, 234, 0.5) !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Feature Box Icon
|
||||
*/
|
||||
.feature-box .feature-box-icon.custom-feature-box-icon-size-1 {
|
||||
width: 3em;
|
||||
height: 3em;
|
||||
font-size: 20.8px;
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
/*
|
||||
* Form
|
||||
*/
|
||||
.custom-form-style-1 .form-control {
|
||||
padding: 10px 20px;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:not(textarea) {
|
||||
height: 55px;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-webkit-input-placeholder {
|
||||
color: var(--default);
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-moz-placeholder {
|
||||
color: var(--default);
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:-ms-input-placeholder {
|
||||
color: var(--default);
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:-moz-placeholder {
|
||||
color: var(--default);
|
||||
}
|
||||
|
||||
/*
|
||||
* Progress Bars
|
||||
*/
|
||||
.custom-progress-bars-style-1 .progress {
|
||||
position: relative;
|
||||
height: 7px;
|
||||
background: var(--grey-500);
|
||||
}
|
||||
|
||||
.custom-progress-bars-style-1 .progress-bar-tooltip {
|
||||
background-color: transparent;
|
||||
color: var(--default);
|
||||
font-size: 14px;
|
||||
top: -30px;
|
||||
right: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.custom-progress-bars-style-1 .progress-bar-tooltip:after {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Circles & Counters
|
||||
*/
|
||||
.custom-circles-group-1 {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.custom-circles-group-1 .circle-1 {
|
||||
width: 250px;
|
||||
height: 250px;
|
||||
border-radius: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 96px;
|
||||
margin-bottom: 6rem;
|
||||
}
|
||||
|
||||
.custom-circles-group-1 .circle-2,
|
||||
.custom-circles-group-1 .circle-3 {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
border-radius: 100%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
|
||||
.custom-circles-group-1 .circle-2 {
|
||||
top: 56%;
|
||||
left: 76%;
|
||||
width: 190px;
|
||||
height: 190px;
|
||||
}
|
||||
|
||||
.custom-circles-group-1 .circle-3 {
|
||||
top: 75%;
|
||||
left: 53%;
|
||||
width: 170px;
|
||||
height: 170px;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.custom-circles-group-1 .circle-2 {
|
||||
left: 84%;
|
||||
}
|
||||
.custom-circles-group-1 .circle-3 {
|
||||
left: 40%;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-circle {
|
||||
position: absolute;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-big {
|
||||
width: 52px;
|
||||
height: 52px;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-medium {
|
||||
width: 23px;
|
||||
height: 23px;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-small {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-extra-small {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-1 {
|
||||
top: 25%;
|
||||
left: -13%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-1.custom-circle-pos-1-1 {
|
||||
top: 45%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-2 {
|
||||
top: 43%;
|
||||
left: -4%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-2.custom-circle-pos-2-2 {
|
||||
top: 77%;
|
||||
left: -1%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-3 {
|
||||
top: 9%;
|
||||
left: 17%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-3.custom-circle-pos-3-3 {
|
||||
top: 35%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-4 {
|
||||
top: 53%;
|
||||
left: 20%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-4.custom-circle-pos-4-4 {
|
||||
left: 107%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-5 {
|
||||
top: 61%;
|
||||
left: 39%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-5.custom-circle-pos-5-5 {
|
||||
top: 21%;
|
||||
left: 96%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-6 {
|
||||
top: 41%;
|
||||
left: 46%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-6.custom-circle-pos-6-6 {
|
||||
top: 28%;
|
||||
left: 119%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-7 {
|
||||
top: 30%;
|
||||
left: 104%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-8 {
|
||||
top: 7%;
|
||||
left: 114%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-9 {
|
||||
top: 76%;
|
||||
left: 27%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-10 {
|
||||
top: 10%;
|
||||
left: 114%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-11 {
|
||||
top: 6%;
|
||||
left: 117%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-12 {
|
||||
top: 9%;
|
||||
left: 119.3%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-13 {
|
||||
top: 6%;
|
||||
left: 120%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-14 {
|
||||
left: 60%;
|
||||
top: -15%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-15 {
|
||||
top: -11%;
|
||||
left: 60.7%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-16 {
|
||||
top: -13.9%;
|
||||
left: 62%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-17 {
|
||||
top: 6%;
|
||||
left: 105%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-18 {
|
||||
top: 8%;
|
||||
left: 106.9%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-19 {
|
||||
top: 9.5%;
|
||||
left: 108.4%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-20 {
|
||||
bottom: 5.5%;
|
||||
left: -7%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-21 {
|
||||
bottom: 4.5%;
|
||||
left: -8.6%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-22 {
|
||||
bottom: 2.7%;
|
||||
left: -6.8%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-23 {
|
||||
bottom: 2.5%;
|
||||
left: -8.5%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-24 {
|
||||
top: 38%;
|
||||
left: -14.5%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-25 {
|
||||
top: 12.5%;
|
||||
left: -8.5%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-26 {
|
||||
top: 25.5%;
|
||||
left: 0.5%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-27 {
|
||||
top: 46%;
|
||||
left: 44.5%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-28 {
|
||||
top: 26%;
|
||||
left: 107%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-29 {
|
||||
top: 6.5%;
|
||||
left: 110%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-30 {
|
||||
top: 36.5%;
|
||||
left: 119.5%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-31 {
|
||||
top: 66.5%;
|
||||
left: 23.7%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-32 {
|
||||
top: 79%;
|
||||
left: 20%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-33 {
|
||||
top: 82%;
|
||||
left: 24.2%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-34 {
|
||||
top: 86%;
|
||||
left: 20.2%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-35 {
|
||||
top: 84%;
|
||||
left: 69.5%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-36 {
|
||||
top: 89.3%;
|
||||
left: 74.3%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-37 {
|
||||
top: 13.1%;
|
||||
left: 69.5%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-38 {
|
||||
top: 11.5%;
|
||||
left: 80.7%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-39 {
|
||||
top: 5.4%;
|
||||
left: 75.7%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-40 {
|
||||
top: 5.4%;
|
||||
left: 82.7%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-41 {
|
||||
top: 86%;
|
||||
left: 103%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-42 {
|
||||
top: 88.8%;
|
||||
left: 104.6%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-43 {
|
||||
top: 91%;
|
||||
left: 105.8%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-44 {
|
||||
left: 103%;
|
||||
top: 10%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-45 {
|
||||
left: 104.7%;
|
||||
top: 14.1%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-46 {
|
||||
left: 106.2%;
|
||||
top: 10.4%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-47 {
|
||||
top: 86%;
|
||||
left: -3%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-48 {
|
||||
top: 95%;
|
||||
left: -2.5%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-49 {
|
||||
top: 93%;
|
||||
left: -4.5%;
|
||||
}
|
||||
|
||||
.custom-circle.custom-circle-pos-50 {
|
||||
top: 97%;
|
||||
left: -4.3%;
|
||||
}
|
||||
|
||||
.custom-dots-rect-1 {
|
||||
width: 103px;
|
||||
height: 138px;
|
||||
position: absolute;
|
||||
bottom: 50px;
|
||||
left: -104px;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-dots-rect-2 {
|
||||
width: 79px;
|
||||
height: 75px;
|
||||
position: absolute;
|
||||
bottom: -43px;
|
||||
right: -39px;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-dots-rect-3 {
|
||||
width: 99px;
|
||||
height: 119px;
|
||||
position: absolute;
|
||||
top: -77px;
|
||||
left: -71px;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-dots-rect-4 {
|
||||
position: absolute;
|
||||
top: -50px;
|
||||
right: -388px;
|
||||
width: 144px;
|
||||
height: 100px;
|
||||
transform: rotateX(180deg);
|
||||
}
|
||||
|
||||
.custom-dots-rect-5 {
|
||||
position: absolute;
|
||||
bottom: -80px;
|
||||
left: -38px;
|
||||
width: 144px;
|
||||
height: 100px;
|
||||
transform: rotateX(180deg);
|
||||
}
|
||||
|
||||
/*
|
||||
* Testimonials
|
||||
*/
|
||||
.testimonial.testimonial-style-3.custom-testimonial-style-1 {
|
||||
padding: 20px 20px;
|
||||
}
|
||||
|
||||
.testimonial.testimonial-style-3.custom-testimonial-style-1 blockquote {
|
||||
padding: 39px 20px 27px 41px;
|
||||
background: #FFF !important;
|
||||
box-shadow: 0px 0px 20px -3px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.testimonial.testimonial-style-3.custom-testimonial-style-1 blockquote:before {
|
||||
top: 10px;
|
||||
left: 12px;
|
||||
font-size: 78px;
|
||||
font-family: Poppins;
|
||||
}
|
||||
|
||||
.testimonial.testimonial-style-3.custom-testimonial-style-1 blockquote p {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
.testimonial.testimonial-style-3.custom-testimonial-style-1 .testimonial-author {
|
||||
margin: 20px 0 0 0;
|
||||
}
|
||||
|
||||
.testimonial.testimonial-style-3.custom-testimonial-style-1 .testimonial-author img {
|
||||
max-width: 70px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Carousel
|
||||
*/
|
||||
.custom-carousel-style-1 {
|
||||
margin-top: -20px;
|
||||
}
|
||||
|
||||
.custom-carousel-dots-style-1 .owl-dots {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
padding-left: 20.8px;
|
||||
padding-left: 1.3rem;
|
||||
margin-top: -7px !important;
|
||||
}
|
||||
|
||||
.custom-carousel-dots-style-1 .owl-dots .owl-dot {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
box-shadow: 0px 0px 0px 2px var(--grey-500);
|
||||
border-radius: 100%;
|
||||
border: 2px solid #FFF;
|
||||
background: transparent;
|
||||
margin-right: 8px;
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
.custom-carousel-dots-style-1 .owl-dots .owl-dot > span {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.custom-carousel-dots-style-1 .owl-dots .owl-dot:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.custom-carousel-dots-style-1 .owl-dots .owl-dot.active {
|
||||
background: var(--grey-500);
|
||||
}
|
||||
|
||||
/*
|
||||
* Pricing Table
|
||||
*/
|
||||
.pricing-table.custom-pricing-table-style-1 .plan {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.pricing-table.custom-pricing-table-style-1 .plan .plan-header {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.pricing-table.custom-pricing-table-style-1 .plan .plan-features {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.pricing-table.custom-pricing-table-style-1 .plan .plan-features ul li {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.pricing-table.custom-pricing-table-style-1 .plan .plan-footer {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.pricing-table.custom-pricing-table-style-1 .plan.plan-featured {
|
||||
overflow: hidden;
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
.pricing-table.custom-pricing-table-style-1 .plan.plan-featured .plan-features ul li {
|
||||
border-bottom-color: rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
.pricing-table.custom-pricing-table-style-1 .plan.plan-featured .plan-popular-tag {
|
||||
position: absolute;
|
||||
line-height: 2.3;
|
||||
top: 20px;
|
||||
right: -55px;
|
||||
background: var(--grey-500);
|
||||
width: 55%;
|
||||
transform: rotate(36deg);
|
||||
}
|
||||
|
||||
/*
|
||||
* Blog Post
|
||||
*/
|
||||
.custom-post-style-1 .custom-post-meta > a {
|
||||
border-right: 1px solid #a5a7b5;
|
||||
padding-right: 8px;
|
||||
margin-right: 8px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.custom-post-style-1 .custom-post-meta > a:last-child {
|
||||
border-right: 0;
|
||||
margin-right: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Pagination
|
||||
*/
|
||||
.custom-pagination-style-1 .page-item .page-link {
|
||||
border: 2px solid #999999;
|
||||
box-sizing: content-box;
|
||||
color: #999999;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.custom-pagination-style-1 .page-item.active .page-link, .custom-pagination-style-1 .page-item:hover .page-link {
|
||||
color: var(--light);
|
||||
}
|
||||
|
||||
/*
|
||||
* Social Icons
|
||||
*/
|
||||
.custom-social-icons-style-1 li a {
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
line-height: 38px;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
/* Custom Colors For SVG's */
|
||||
.custom-fill-color-primary,
|
||||
.custom-fill-color-primary > svg path {
|
||||
fill: var(--primary) !important;
|
||||
}
|
||||
|
||||
.custom-fill-color-secondary,
|
||||
.custom-fill-color-secondary > svg path {
|
||||
fill: var(--secondary) !important;
|
||||
}
|
||||
|
||||
.custom-fill-color-tertiary,
|
||||
.custom-fill-color-tertiary > svg path {
|
||||
fill: var(--tertiary) !important;
|
||||
}
|
||||
|
||||
.custom-fill-color-quaternary,
|
||||
.custom-fill-color-quaternary > svg path {
|
||||
fill: var(--quaternary) !important;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
#header .header-btn-collapse-nav {
|
||||
background: var(--tertiary);
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav.header-nav-links nav > ul:not(:hover) > li > a.active {
|
||||
color: var(--tertiary);
|
||||
}
|
||||
#header .header-nav.header-nav-links nav > ul li:hover > a {
|
||||
color: var(--tertiary);
|
||||
}
|
||||
#header .header-nav-main nav > ul > li.dropdown .dropdown-menu {
|
||||
border-top-color: var(--tertiary);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
#header .header-nav-main:not(.header-nav-main-mobile-dark) nav > ul > li > a.active {
|
||||
color: var(--tertiary) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Testimonial blockquote */
|
||||
.testimonial.testimonial-style-3.custom-testimonial-style-1 blockquote:before {
|
||||
color: var(--secondary);
|
||||
}
|
||||
|
||||
/* Pricing Table */
|
||||
.pricing-table.custom-pricing-table-style-1 .plan.plan-featured .plan-popular-tag {
|
||||
background: var(--secondary);
|
||||
}
|
||||
|
||||
/* Carousel */
|
||||
.custom-carousel-dots-style-1 .owl-dots .owl-dot {
|
||||
box-shadow: 0px 0px 0px 2px var(--quaternary);
|
||||
}
|
||||
|
||||
.custom-carousel-dots-style-1 .owl-dots .owl-dot.active {
|
||||
background: var(--quaternary);
|
||||
}
|
||||
|
||||
/*
|
||||
* Pagination
|
||||
*/
|
||||
.custom-pagination-style-1 .page-item.active .page-link, .custom-pagination-style-1 .page-item:hover .page-link {
|
||||
border-color: var(--secondary);
|
||||
background-color: var(--secondary) !important;
|
||||
}
|
||||
45
resources/assets/css/demos/demo-seo-3.css
Normal file
45
resources/assets/css/demos/demo-seo-3.css
Normal file
@ -0,0 +1,45 @@
|
||||
@media (min-width: 1440px) {
|
||||
.container-xl-custom {
|
||||
max-width: 1420px;
|
||||
}
|
||||
}
|
||||
|
||||
#header .header-body {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
#header .header-main {
|
||||
background: var(--light);
|
||||
}
|
||||
|
||||
.sticky-header-active #header .header-main {
|
||||
-webkit-backdrop-filter: blur(30px);
|
||||
backdrop-filter: blur(30px);
|
||||
background: linear-gradient(white 0%, rgba(255, 255, 255, 0.5) 100%);
|
||||
}
|
||||
|
||||
.mouse-hover-split {
|
||||
min-height: 710px;
|
||||
}
|
||||
|
||||
.mouse-hover-split .side {
|
||||
display: grid;
|
||||
min-height: 710px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mouse-hover-split .side .side-content {
|
||||
margin: 0px;
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
.mouse-hover-split .side-left {
|
||||
width: 60%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
section.section.section-angled .section-angled-layer-bottom {
|
||||
transform: skewY(-0.7deg) translate3d(0, 50%, 0);
|
||||
}
|
||||
128
resources/assets/css/demos/demo-seo.css
Normal file
128
resources/assets/css/demos/demo-seo.css
Normal file
@ -0,0 +1,128 @@
|
||||
.custom-mw-1 {
|
||||
max-width: 110px !important;
|
||||
}
|
||||
|
||||
.custom-fs-1 {
|
||||
font-size: 19.2px !important;
|
||||
font-size: 1.2rem !important;
|
||||
}
|
||||
|
||||
.custom-bg-color-1 {
|
||||
background-color: #2c3b43 !important;
|
||||
}
|
||||
|
||||
.custom-image-position-1 {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 100%;
|
||||
min-width: 250px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.custom-image-position-1 .featured-box {
|
||||
height: 100% !important;
|
||||
}
|
||||
|
||||
/* SVG Style */
|
||||
.custom-svg-style-1 {
|
||||
background-color: var(--light);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100vw;
|
||||
height: 100%;
|
||||
left: 50%;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
}
|
||||
|
||||
/* Form Styles */
|
||||
.custom-form-style-1 .form-control {
|
||||
border-radius: 0;
|
||||
padding: 14.4px 24px;
|
||||
padding: 0.9rem 1.5rem;
|
||||
height: 47.2px;
|
||||
height: 2.95rem;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-moz-placeholder {
|
||||
color: #536f78;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::placeholder {
|
||||
color: #536f78;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control:-ms-input-placeholder {
|
||||
color: #536f78;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control::-ms-input-placeholder {
|
||||
color: #536f78;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.custom-form-style-1.custom-form-style-1-rounded .form-control {
|
||||
border-radius: 35px;
|
||||
height: 52px;
|
||||
height: 3.25rem;
|
||||
}
|
||||
|
||||
/* Pricing */
|
||||
.custom-plan-featured-style-1 .plan-header {
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
|
||||
/* Thumb Info */
|
||||
.custom-thumb-info-style-1 .thumb-info-wrapper .custom-thumb-info-date {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
font-size: 27.2px;
|
||||
font-size: 1.7rem;
|
||||
line-height: 1;
|
||||
text-align: center;
|
||||
padding: 11.2px 19.2px;
|
||||
padding: 0.7rem 1.2rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1 .thumb-info-wrapper .custom-thumb-info-date > span {
|
||||
display: block;
|
||||
font-size: 0.4em;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
/* Carousel */
|
||||
.custom-carousel-nav-style-1 .owl-nav button[class*="owl-"] {
|
||||
background: transparent !important;
|
||||
border: 1px solid var(--grey-500);
|
||||
border-radius: 0;
|
||||
color: var(--grey-500);
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
#footer {
|
||||
background-color: #111c22;
|
||||
}
|
||||
|
||||
#footer li, #footer a:not(.btn), #footer p {
|
||||
color: #96a1b1;
|
||||
}
|
||||
|
||||
#footer .footer-copyright {
|
||||
background-color: #111c22 !important;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
/* Carousel */
|
||||
.custom-carousel-nav-style-1 .owl-nav button[class*="owl-"] {
|
||||
border-color: var(--primary);
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-carousel-nav-style-1 .owl-nav button[class*="owl-"]:hover {
|
||||
background: var(--primary) !important;
|
||||
}
|
||||
404
resources/assets/css/demos/demo-startup-agency.css
Normal file
404
resources/assets/css/demos/demo-startup-agency.css
Normal file
@ -0,0 +1,404 @@
|
||||
body {
|
||||
font-family: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
.body {
|
||||
max-width: 100vw;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
[class*="text-color-hover-"] {
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
.custom-font-secondary {
|
||||
font-family: 'Playfair Display', sans-serif !important;
|
||||
}
|
||||
|
||||
.custom-bg-color-1 {
|
||||
background-color: #eff1f3 !important;
|
||||
}
|
||||
|
||||
.custom-font-size-1 {
|
||||
font-size: 1.4em !important;
|
||||
}
|
||||
|
||||
.custom-font-size-2 {
|
||||
font-size: 1.15em !important;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.container {
|
||||
max-width: 1200px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-divider-1 {
|
||||
padding: 0 10px;
|
||||
margin: 0 10px;
|
||||
border-right: 1px solid #777;
|
||||
border-left: 1px solid #777;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom SVG Wrappers
|
||||
*/
|
||||
.custom-svg-wrapper-1 {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-svg-wrapper-1 > svg {
|
||||
position: absolute;
|
||||
top: 60%;
|
||||
left: 43%;
|
||||
width: 150%;
|
||||
height: 170%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-svg-wrapper-1 > img {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-svg-wrapper-2 {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-svg-wrapper-2 > svg {
|
||||
position: absolute;
|
||||
top: 60%;
|
||||
left: 50%;
|
||||
width: 144%;
|
||||
height: 80%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-svg-wrapper-2 > .owl-carousel {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-svg-wrapper-3 {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-svg-wrapper-3 > svg {
|
||||
position: absolute;
|
||||
top: 60%;
|
||||
left: 50%;
|
||||
width: 144%;
|
||||
height: 80%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-svg-wrapper-3 > .pricing-table {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-svg-wrapper-4 {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-svg-wrapper-4 > svg {
|
||||
position: absolute;
|
||||
top: 46%;
|
||||
left: 50%;
|
||||
width: 144%;
|
||||
height: 112%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.custom-svg-wrapper-4 > .container {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.custom-thumb-info-hover-1 {
|
||||
transition: ease box-shadow 300ms;
|
||||
}
|
||||
|
||||
.custom-thumb-info-hover-1:hover {
|
||||
box-shadow: 0px 0px 70px -10px #000;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot > span {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border-radius: 100%;
|
||||
border: 2px solid #c5c5c5;
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot.active > span, .custom-dots-style-1 .owl-dots .owl-dot:hover > span, .custom-dots-style-1 .owl-dots .owl-dot:focus > span {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-color: #36393d;
|
||||
}
|
||||
|
||||
.custom-dots-style-1 .owl-dots .owl-dot.active > span:before, .custom-dots-style-1 .owl-dots .owl-dot:hover > span:before, .custom-dots-style-1 .owl-dots .owl-dot:focus > span:before {
|
||||
content: '';
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
background: #36393d;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.custom-dots-style-1.custom-dots-style-1-light .owl-dots .owl-dot > span {
|
||||
border: 2px solid #FFF;
|
||||
}
|
||||
|
||||
.custom-dots-style-1.custom-dots-style-1-light .owl-dots .owl-dot.active > span, .custom-dots-style-1.custom-dots-style-1-light .owl-dots .owl-dot:hover > span, .custom-dots-style-1.custom-dots-style-1-light .owl-dots .owl-dot:focus > span {
|
||||
border-color: var(--light);
|
||||
}
|
||||
|
||||
.custom-dots-style-1.custom-dots-style-1-light .owl-dots .owl-dot.active > span:before, .custom-dots-style-1.custom-dots-style-1-light .owl-dots .owl-dot:hover > span:before, .custom-dots-style-1.custom-dots-style-1-light .owl-dots .owl-dot:focus > span:before {
|
||||
background: var(--light);
|
||||
}
|
||||
|
||||
.custom-carousel-backward-shape {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.custom-carousel-backward-shape:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
max-width: 1200px;
|
||||
top: 0px;
|
||||
left: 50%;
|
||||
right: auto;
|
||||
bottom: 60px;
|
||||
background-color: var(--grey-500);
|
||||
opacity: 0.15;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
}
|
||||
|
||||
.custom-carousel-backward-shape .owl-dots {
|
||||
margin-top: 30px !important;
|
||||
}
|
||||
|
||||
@media (min-width: 2000px) {
|
||||
.shape-divider svg {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
@media (min-width: 1200px) {
|
||||
#header .header-nav-main nav > ul > li {
|
||||
margin-left: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-main nav > ul > li > a {
|
||||
font-size: 14px;
|
||||
padding: 0 1rem !important;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Home - Intro
|
||||
*/
|
||||
.custom-section-svg {
|
||||
position: relative;
|
||||
background: #EFF1F3;
|
||||
}
|
||||
|
||||
.custom-section-svg .custom-section-svg-background {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.custom-section-svg > svg {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.custom-section-svg > .container {
|
||||
position: absolute;
|
||||
top: 43%;
|
||||
left: 50%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
|
||||
@media (max-width: 1400px) {
|
||||
.custom-section-svg > svg {
|
||||
left: 70px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-section-svg > svg {
|
||||
width: 180%;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Pricing Table
|
||||
*/
|
||||
.custom-pricing-table-style-1 .plan {
|
||||
box-shadow: 0px 0px 40px rgba(200, 200, 200, 0.3);
|
||||
}
|
||||
|
||||
.custom-pricing-table-style-1 .plan .plan-header {
|
||||
background-color: #f1f3f7;
|
||||
padding: 27.2px 16px;
|
||||
padding: 1.7rem 1rem;
|
||||
}
|
||||
|
||||
.custom-pricing-table-style-1 .plan .plan-header h3 {
|
||||
color: #999999;
|
||||
font-size: 16px;
|
||||
font-size: 1rem;
|
||||
font-weight: 400;
|
||||
letter-spacing: 4px;
|
||||
}
|
||||
|
||||
.custom-pricing-table-style-1 .plan .plan-price {
|
||||
background: transparent;
|
||||
padding-bottom: 3.2px;
|
||||
padding-bottom: 0.2rem;
|
||||
}
|
||||
|
||||
.custom-pricing-table-style-1 .plan .plan-price .price {
|
||||
font-size: 48px;
|
||||
font-size: 3rem;
|
||||
font-weight: 800;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.custom-pricing-table-style-1 .plan .plan-price .price .price-unit {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.custom-pricing-table-style-1 .plan .plan-price .price-label {
|
||||
text-transform: none;
|
||||
font-size: 20.8px;
|
||||
font-size: 1.3rem;
|
||||
font-family: 'Playfair Display', sans-serif;
|
||||
margin-top: 16px;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.custom-pricing-table-style-1 .plan .plan-features ul li {
|
||||
font-size: 1em !important;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.custom-pricing-table-style-1 .plan .plan-footer {
|
||||
padding: 11.2px 12.8px 40px;
|
||||
padding: 0.7rem 0.8rem 2.5rem;
|
||||
}
|
||||
|
||||
.custom-pricing-table-style-1 .plan .plan-price,
|
||||
.custom-pricing-table-style-1 .plan .plan-features,
|
||||
.custom-pricing-table-style-1 .plan .plan-footer {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.custom-pricing-table-style-1 .plan.plan-featured {
|
||||
transform: scale(1) translate3d(0, -11px, 0);
|
||||
}
|
||||
|
||||
.custom-pricing-table-style-1 .plan.plan-featured .plan-header {
|
||||
padding: 36.8px 16px;
|
||||
padding: 2.3rem 1rem;
|
||||
}
|
||||
|
||||
.custom-pricing-table-style-1 .plan.plan-featured .plan-header h3 {
|
||||
color: var(--light);
|
||||
font-size: 16px;
|
||||
font-size: 1rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.custom-pricing-table-style-1 .plan.plan-featured .plan-price {
|
||||
padding-top: 25.6px;
|
||||
padding-top: 1.6rem;
|
||||
}
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
#footer {
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
.custom-form-style-1 {
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
.custom-form-style-1 .form-control {
|
||||
height: calc(1.5em + 1.85rem + 2px);
|
||||
padding: 15.6px 20px;
|
||||
padding: 0.975rem 1.25rem;
|
||||
}
|
||||
|
||||
.custom-form-style-1 textarea.form-control {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
.custom-carousel-backward-shape .owl-stage-outer:before {
|
||||
background-color: var(--primary--300);
|
||||
}
|
||||
|
||||
.custom-svg-linear-gradient stop:nth-child(1) {
|
||||
stop-color: var(--secondary) !important;
|
||||
}
|
||||
|
||||
.custom-svg-linear-gradient stop:nth-child(2) {
|
||||
stop-color: var(--primary) !important;
|
||||
}
|
||||
|
||||
path.custom-svg-fill-color-primary,
|
||||
circle.custom-svg-fill-color-primary {
|
||||
fill: var(--primary) !important;
|
||||
}
|
||||
|
||||
path.custom-svg-fill-color-secondary,
|
||||
circle.custom-svg-fill-color-secondary {
|
||||
fill: var(--secondary) !important;
|
||||
}
|
||||
|
||||
path.custom-svg-fill-color-tertiary,
|
||||
circle.custom-svg-fill-color-tertiary {
|
||||
fill: var(--tertiary) !important;
|
||||
}
|
||||
|
||||
path.custom-svg-fill-color-quaternary,
|
||||
circle.custom-svg-fill-color-quaternary {
|
||||
fill: var(--quaternary) !important;
|
||||
}
|
||||
|
||||
path.custom-svg-fill-color-dark,
|
||||
circle.custom-svg-fill-color-dark {
|
||||
fill: var(--dark) !important;
|
||||
}
|
||||
|
||||
path.custom-svg-fill-color-light,
|
||||
circle.custom-svg-fill-color-light {
|
||||
fill: var(--light) !important;
|
||||
}
|
||||
137
resources/assets/css/demos/demo-transportation-logistic.css
Normal file
137
resources/assets/css/demos/demo-transportation-logistic.css
Normal file
@ -0,0 +1,137 @@
|
||||
.custom-bg-color-grey-1 {
|
||||
background-color: #f8f9fb;
|
||||
}
|
||||
|
||||
.overlay-tertiary:before {
|
||||
background: var(--tertiary);
|
||||
}
|
||||
|
||||
.custom-font-size-1 {
|
||||
font-size: 80px;
|
||||
}
|
||||
|
||||
p {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.custom-heading-1 {
|
||||
-webkit-text-fill-color: transparent;
|
||||
-webkit-text-stroke-width: 0.5px;
|
||||
-webkit-text-stroke-color: var(--grey-500);
|
||||
white-space: nowrap;
|
||||
font-size: 80px;
|
||||
font-weight: bold;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-heading-1 {
|
||||
font-size: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-stroke-text-effect-1 {
|
||||
-webkit-text-fill-color: transparent;
|
||||
-webkit-text-stroke-width: 1px;
|
||||
-webkit-text-stroke-color: var(--light);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.custom-text-pos-1 {
|
||||
left: -80px;
|
||||
}
|
||||
|
||||
.custom-text-pos-2 {
|
||||
right: -80px;
|
||||
}
|
||||
|
||||
.custom-text-pos-3 {
|
||||
left: -10%;
|
||||
top: 45%;
|
||||
}
|
||||
|
||||
.custom-el-pos-1 {
|
||||
margin-top: -160px;
|
||||
}
|
||||
|
||||
.custom-el-pos-2 {
|
||||
margin-top: -73px;
|
||||
}
|
||||
|
||||
.custom-el-pos-3 {
|
||||
margin-top: -73px;
|
||||
}
|
||||
|
||||
.custom-drop-caps .custom-drop-caps-number {
|
||||
font-weight: bold;
|
||||
float: left;
|
||||
font-size: 90px;
|
||||
line-height: 90px;
|
||||
padding: 0;
|
||||
margin-right: 15px;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.custom-vr-1 {
|
||||
width: 6px;
|
||||
height: 70px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
#header .header-logo img {
|
||||
max-width: 245px;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.section-intro {
|
||||
background: url(../../img/demos/transportation-logistic/generic/generic-1.png) no-repeat 12% 100%;
|
||||
min-height: 400px;
|
||||
}
|
||||
|
||||
.custom-carousel-1-wrapper {
|
||||
margin-top: -48px;
|
||||
margin-bottom: -100px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
min-height: 300px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.custom-carousel-1-wrapper {
|
||||
margin-top: -143px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-carousel-1 .owl-stage-outer .owl-item {
|
||||
padding: 20px 2px 40px 18px;
|
||||
}
|
||||
|
||||
.custom-carousel-1 .owl-stage-outer .owl-item .card {
|
||||
transition: all 0.1s ease-in-out;
|
||||
}
|
||||
|
||||
.custom-carousel-1 .owl-stage-outer .owl-item.active .card {
|
||||
box-shadow: 0 0px 20px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.custom-carousel-1 .owl-carousel.nav-bottom.nav-bottom-align-left {
|
||||
position: relative;
|
||||
top: 20px;
|
||||
width: 100% !important;
|
||||
padding-right: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-carousel-1 .owl-carousel.nav-bottom.nav-bottom-align-left .owl-nav {
|
||||
position: absolute;
|
||||
top: 73px;
|
||||
left: -78px;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.custom-parallax-1 .parallax-background {
|
||||
background-size: 100% !important;
|
||||
}
|
||||
}
|
||||
359
resources/assets/css/demos/demo-wedding.css
Normal file
359
resources/assets/css/demos/demo-wedding.css
Normal file
@ -0,0 +1,359 @@
|
||||
.custom-font-1 {
|
||||
font-family: "Tangerine", cursive;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.custom-font-size-1 {
|
||||
font-size: 70px !important;
|
||||
}
|
||||
|
||||
.custom-font-size-2 {
|
||||
font-size: 50px !important;
|
||||
}
|
||||
|
||||
.custom-font-size-3 {
|
||||
font-size: 40px !important;
|
||||
}
|
||||
|
||||
.custom-font-size-4 {
|
||||
font-size: 0.6em !important;
|
||||
}
|
||||
|
||||
.custom-logo {
|
||||
font-family: "Tangerine", cursive;
|
||||
font-size: 50px;
|
||||
font-weight: 700;
|
||||
display: block;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav-bar .header-nav {
|
||||
min-height: 80px;
|
||||
}
|
||||
#header .header-nav.header-nav-line.header-nav-bottom-line nav > ul > li > a {
|
||||
letter-spacing: 3px;
|
||||
font-weight: 400;
|
||||
padding: 0 0.9rem !important;
|
||||
margin: 0 0.9rem !important;
|
||||
}
|
||||
#header .header-nav.header-nav-line.header-nav-bottom-line nav > ul > li > a:before {
|
||||
height: 1px;
|
||||
transform: translateX(-2px);
|
||||
}
|
||||
#header .header-nav.header-nav-line.header-nav-bottom-line nav > ul > li:hover > a:before {
|
||||
height: 1px;
|
||||
transform: translateX(-2px);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
#header .header-logo {
|
||||
top: 26px;
|
||||
}
|
||||
#header .header-btn-collapse-nav {
|
||||
top: -23px;
|
||||
}
|
||||
}
|
||||
|
||||
.slider .slotholder:after {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
pointer-events: none;
|
||||
opacity: 0.4;
|
||||
background: #333;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.tp-caption-custom-1 {
|
||||
font-family: "Tangerine", cursive;
|
||||
color: transparent;
|
||||
-webkit-text-stroke: 1px #FFF;
|
||||
text-stroke: 1px #FFF;
|
||||
opacity: 0.3 !important;
|
||||
}
|
||||
|
||||
.tp-caption-custom-2 {
|
||||
font-family: "Tangerine", cursive;
|
||||
color: var(--light);
|
||||
}
|
||||
|
||||
.tp-caption-custom-3-el-1 {
|
||||
color: var(--dark--200);
|
||||
display: inline-block;
|
||||
letter-spacing: 2.5px;
|
||||
padding: 15px 80px;
|
||||
background: url(../../img/demos/wedding/backgrounds/bg-1.svg) no-repeat 0 0;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.custom-bg-1 {
|
||||
position: absolute;
|
||||
width: 1200px;
|
||||
left: -800px;
|
||||
top: -285px;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
.custom-bg-2 {
|
||||
position: relative;
|
||||
background: url(../../img/demos/wedding/backgrounds/bg-2.svg) no-repeat 0 0;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.custom-bg-3 {
|
||||
position: absolute;
|
||||
width: 1200px;
|
||||
right: -45%;
|
||||
transform: rotate(40deg);
|
||||
}
|
||||
|
||||
.custom-bg-4 {
|
||||
position: absolute;
|
||||
width: 1200px;
|
||||
}
|
||||
|
||||
.custom-countdown-1 .days span, .custom-countdown-1 .hours span, .custom-countdown-1 .minutes span, .custom-countdown-1 .seconds span {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.custom-text-1 {
|
||||
font-family: "Tangerine", cursive;
|
||||
color: transparent;
|
||||
-webkit-text-stroke: 1px #f4f0ed;
|
||||
text-stroke: 1px #FFF;
|
||||
font-size: 23vw;
|
||||
white-space: nowrap;
|
||||
position: absolute;
|
||||
bottom: 3%;
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1:hover .thumb-info-wrapper:after {
|
||||
opacity: 0.5 !important;
|
||||
}
|
||||
|
||||
.mfp-wrap.wedding-portfolio-gallery {
|
||||
opacity: 0;
|
||||
transition: ease opacity 300ms;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox {
|
||||
position: absolute;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
|
||||
#ourHistoryLightbox .mfp-close {
|
||||
background-color: #60635c;
|
||||
color: var(--light);
|
||||
top: 0;
|
||||
right: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox .mfp-close:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox .thumb-gallery {
|
||||
position: absolute;
|
||||
width: 100vw;
|
||||
height: 95vh;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
|
||||
#ourHistoryLightbox .owl-carousel .owl-item > div {
|
||||
position: relative;
|
||||
height: 95vh;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox .owl-carousel .owl-item > div .img-thumbnail {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
border: none;
|
||||
background: transparent;
|
||||
text-align: center;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
|
||||
#ourHistoryLightbox .owl-carousel .owl-item img {
|
||||
display: inline-block !important;
|
||||
width: auto;
|
||||
max-width: 95vw;
|
||||
max-height: 90vh;
|
||||
box-shadow: 0px 0px 40px -10px #000;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox .owl-carousel .owl-nav button.owl-prev,
|
||||
#ourHistoryLightbox .owl-carousel .owl-nav button.owl-next {
|
||||
border: 0 none;
|
||||
border-radius: 0;
|
||||
color: var(--light);
|
||||
height: 80px;
|
||||
line-height: 68px;
|
||||
margin-top: -20px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox .owl-carousel .owl-nav button.owl-prev:before,
|
||||
#ourHistoryLightbox .owl-carousel .owl-nav button.owl-next:before {
|
||||
font-family: simple-line-icons;
|
||||
content: "\e605";
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox .owl-carousel .owl-nav button.owl-next::before {
|
||||
font-family: simple-line-icons;
|
||||
content: "\e606";
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs {
|
||||
width: 98%;
|
||||
height: 13vh;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs:hover .owl-stage-outer, #ourHistoryLightbox #thumbGalleryThumbs.show-thumbs .owl-stage-outer {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs.boxed-thumbs:hover .owl-stage-outer {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs.boxed-thumbs .owl-item > div {
|
||||
height: 20vh;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs.boxed-thumbs .owl-item > div .img-thumbnail {
|
||||
height: 5.3vw;
|
||||
overflow: hidden;
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs.boxed-thumbs .owl-item img {
|
||||
width: auto;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs.full-proportion-thumbs:hover .owl-stage-outer {
|
||||
opacity: 1;
|
||||
transform: translateY(-32%);
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs.full-proportion-thumbs .owl-item.active-thumb {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs.full-proportion-thumbs .owl-item > div {
|
||||
height: 20vh;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs.full-proportion-thumbs .owl-item > div .img-thumbnail {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs.full-proportion-thumbs .owl-item img {
|
||||
max-height: 20vh;
|
||||
box-shadow: none;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs .owl-stage-outer {
|
||||
opacity: 0;
|
||||
transform: translateY(100%);
|
||||
transition: ease all 300ms;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs .owl-stage {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs .owl-item.active-thumb {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs .owl-item > div {
|
||||
height: 20vh;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs .owl-item > div .img-thumbnail {
|
||||
height: 5.3vw;
|
||||
box-shadow: 0px 0px 50px -10px #000;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#ourHistoryLightbox #thumbGalleryThumbs .owl-item img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
max-height: none;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
#ourHistoryLightbox .thumb-gallery {
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
#ourHistoryLightbox .owl-carousel .owl-item img {
|
||||
box-shadow: 0px 0px 20px #000;
|
||||
max-width: 89vw;
|
||||
}
|
||||
#ourHistoryLightbox #thumbGalleryThumbs .owl-item img {
|
||||
box-shadow: none;
|
||||
}
|
||||
#ourHistoryLightbox #thumbGalleryThumbs .owl-stage-outer {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
#ourHistoryLightbox .owl-carousel .owl-item img {
|
||||
max-width: 80vw;
|
||||
}
|
||||
}
|
||||
|
||||
/* Skin */
|
||||
@media (min-width: 992px) {
|
||||
#header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li > a {
|
||||
color: var(--primary);
|
||||
}
|
||||
#header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li:hover > a {
|
||||
color: var(--primary--100);
|
||||
}
|
||||
}
|
||||
|
||||
.slider .slotholder:after {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
.custom-thumb-info-style-1 .thumb-info-wrapper:after {
|
||||
background: var(--primary);
|
||||
}
|
||||
29
resources/assets/css/examples/examples-mouse-hover-split.css
Normal file
29
resources/assets/css/examples/examples-mouse-hover-split.css
Normal file
@ -0,0 +1,29 @@
|
||||
/*
|
||||
Name: Examples - Mouse Hover Split
|
||||
Written by: Okler Themes - (http://www.okler.net)
|
||||
Theme Version: 12.1.0
|
||||
*/
|
||||
.mouse-hover-split {
|
||||
min-height: 300px;
|
||||
}
|
||||
|
||||
.mouse-hover-split .side {
|
||||
display: grid;
|
||||
min-height: 300px;
|
||||
overflow: hidden;
|
||||
place-items: center;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.mouse-hover-split .side h2 {
|
||||
margin: 0px 10vw;
|
||||
width: 80vw;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.mouse-hover-split .side-left {
|
||||
width: 60%;
|
||||
z-index: 2;
|
||||
}
|
||||
@ -0,0 +1,68 @@
|
||||
/*
|
||||
Name: Examples - Spotlight Cursor Text
|
||||
Written by: Okler Themes - (http://www.okler.net)
|
||||
Theme Version: 12.1.0
|
||||
*/
|
||||
.spotlight-cursor-text {
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
background: var(--primary);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.spotlight-cursor-text .shape {
|
||||
will-change: transform;
|
||||
position: absolute;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.spotlight-cursor-text .shape.shape-1 {
|
||||
background: #1EA6EA;
|
||||
width: 650px;
|
||||
height: 650px;
|
||||
margin: -325px 0 0 -325px;
|
||||
}
|
||||
|
||||
.spotlight-cursor-text .shape.shape-2 {
|
||||
background: #3CC4FF;
|
||||
width: 440px;
|
||||
height: 440px;
|
||||
margin: -220px 0 0 -220px;
|
||||
}
|
||||
|
||||
.spotlight-cursor-text .shape.shape-3 {
|
||||
background: #5AE2FF;
|
||||
width: 270px;
|
||||
height: 270px;
|
||||
margin: -135px 0 0 -135px;
|
||||
}
|
||||
|
||||
.spotlight-cursor-text .content {
|
||||
top: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
background: var(--light);
|
||||
mix-blend-mode: screen;
|
||||
}
|
||||
|
||||
.spotlight-cursor-text .title {
|
||||
font-size: 150px;
|
||||
line-height: 150px;
|
||||
font-weight: bolder;
|
||||
color: #000;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.spotlight-cursor-text .title {
|
||||
font-size: 75px;
|
||||
line-height: 75px;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,38 @@
|
||||
/*
|
||||
Name: Examples - Text Background Clip Animation
|
||||
Written by: Okler Themes - (http://www.okler.net)
|
||||
Theme Version: 12.1.0
|
||||
*/
|
||||
.text-bg-clip-animation {
|
||||
font-size: 150px;
|
||||
line-height: 200px;
|
||||
font-weight: bolder;
|
||||
color: #000;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
background-size: 40%;
|
||||
background-position: 50% 50%;
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
color: rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.text-bg-clip-animation {
|
||||
font-size: 75px;
|
||||
line-height: 100px;
|
||||
}
|
||||
}
|
||||
|
||||
.text-bg-clip-animation.appear-animation-visible {
|
||||
animation: textBgZoom 10s ease 500ms forwards;
|
||||
}
|
||||
|
||||
@keyframes textBgZoom {
|
||||
from {
|
||||
background-size: 40%;
|
||||
}
|
||||
to {
|
||||
background-size: 10%;
|
||||
}
|
||||
}
|
||||
BIN
resources/assets/css/fonts/demos/digital-agency-2/fontello.eot
Normal file
BIN
resources/assets/css/fonts/demos/digital-agency-2/fontello.eot
Normal file
Binary file not shown.
@ -0,0 +1,14 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<metadata>Copyright (C) 2020 by original authors @ fontello.com</metadata>
|
||||
<defs>
|
||||
<font id="fontello" horiz-adv-x="1000" >
|
||||
<font-face font-family="fontello" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
|
||||
<missing-glyph horiz-adv-x="1000" />
|
||||
<glyph glyph-name="iconfinder_arrow_forward_1063879" unicode="" d="M1000 350c0 8-3 16-9 22l-309 313c-13 12-32 12-45 0-12-13-12-33 0-45l256-259h-862c-17 0-31-14-31-31s14-32 31-32h862l-256-258c-12-13-12-33 0-45 13-12 32-12 45 0l309 312c6 6 9 14 9 23z" horiz-adv-x="1000" />
|
||||
|
||||
<glyph glyph-name="icon" unicode="" d="M5230 28l-141-141-656 655-655-655-45 44-44-44-689 688-688-688-45 44-45-44-655 655-655-655-45 44-45-44-785 785 141 141 689-688 688 688 12-11 11 11 689-688 688 688 45-44 45 44 688-688 689 688 11-11 12 11 785-785z" horiz-adv-x="5267" />
|
||||
</font>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.0 KiB |
BIN
resources/assets/css/fonts/demos/digital-agency-2/fontello.ttf
Normal file
BIN
resources/assets/css/fonts/demos/digital-agency-2/fontello.ttf
Normal file
Binary file not shown.
BIN
resources/assets/css/fonts/demos/digital-agency-2/fontello.woff
Normal file
BIN
resources/assets/css/fonts/demos/digital-agency-2/fontello.woff
Normal file
Binary file not shown.
BIN
resources/assets/css/fonts/demos/digital-agency-2/fontello.woff2
Normal file
BIN
resources/assets/css/fonts/demos/digital-agency-2/fontello.woff2
Normal file
Binary file not shown.
BIN
resources/assets/css/fonts/minicart-font.eot
Normal file
BIN
resources/assets/css/fonts/minicart-font.eot
Normal file
Binary file not shown.
12
resources/assets/css/fonts/minicart-font.svg
Normal file
12
resources/assets/css/fonts/minicart-font.svg
Normal file
@ -0,0 +1,12 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<metadata>Copyright (C) 2015 by original authors @ fontello.com</metadata>
|
||||
<defs>
|
||||
<font id="minicart-font" horiz-adv-x="1000" >
|
||||
<font-face font-family="minicart-font" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
|
||||
<missing-glyph horiz-adv-x="1000" />
|
||||
<glyph glyph-name="glyph" unicode="" d="m225 600c0 25 19 45 43 45 25 0 45-20 45-45 0-23-20-43-45-43-24 0-43 20-43 43z m478 0c0 25 20 45 43 45 24 0 43-20 43-45 0-23-19-43-43-43-23 0-43 20-43 43z m-488 121c-65 0-115-55-115-121l-67-566c0-67 51-122 114-122l707 0c62 0 113 55 113 122l-67 566c0 66-50 121-115 121z m553 0c-26 110-135 192-266 192-131 0-240-82-266-192l80 0c24 70 98 123 186 123 88 0 162-53 186-123z" horiz-adv-x="1000" />
|
||||
</font>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 933 B |
BIN
resources/assets/css/fonts/minicart-font.ttf
Normal file
BIN
resources/assets/css/fonts/minicart-font.ttf
Normal file
Binary file not shown.
BIN
resources/assets/css/fonts/minicart-font.woff
Normal file
BIN
resources/assets/css/fonts/minicart-font.woff
Normal file
Binary file not shown.
BIN
resources/assets/css/fonts/star.eot
Normal file
BIN
resources/assets/css/fonts/star.eot
Normal file
Binary file not shown.
19
resources/assets/css/fonts/star.svg
Normal file
19
resources/assets/css/fonts/star.svg
Normal file
@ -0,0 +1,19 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<metadata>
|
||||
This is a custom SVG font generated by IcoMoon.
|
||||
<iconset grid="16"></iconset>
|
||||
</metadata>
|
||||
<defs>
|
||||
<font id="icomoon" horiz-adv-x="512" >
|
||||
<font-face units-per-em="512" ascent="480" descent="-32" />
|
||||
<missing-glyph horiz-adv-x="512" />
|
||||
<glyph unicode="S" d="M 269.474,480.00L 352.509,311.757L 538.171,284.777L 403.822,153.824L 435.54-31.095L 269.474,56.21L 103.408-31.095L 135.119,153.824L 0.771,284.777L 186.438,311.757 z" horiz-adv-x="538.9473684210526" />
|
||||
<glyph unicode="s" d="M 269.474,406.94l 54.04-109.487l 7.524-15.247l 16.821-2.447l 120.827-17.559L 381.251,176.982l-12.18-11.868l 2.873-16.756l 20.647-120.336
|
||||
L 284.521,84.833L 269.474,92.745l-15.047-7.912L 146.351,28.017l 20.642,120.336l 2.873,16.756l-12.175,11.868L 70.263,262.201l 120.827,17.559
|
||||
l 16.826,2.447l 7.524,15.247L 269.474,406.94 M 269.474,480.00L 186.438,311.757l-185.667-26.98l 134.349-130.953l-31.717-184.918L 269.474,56.21l 166.066-87.304
|
||||
l-31.722,184.918l 134.354,130.953l-185.662,26.98L 269.474,480.00L 269.474,480.00z" horiz-adv-x="538.9473684210526" />
|
||||
<glyph unicode=" " horiz-adv-x="256" />
|
||||
<glyph class="hidden" unicode="" d="M0,480L 512 -32L0 -32 z" horiz-adv-x="0" />
|
||||
</font></defs></svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
BIN
resources/assets/css/fonts/star.ttf
Normal file
BIN
resources/assets/css/fonts/star.ttf
Normal file
Binary file not shown.
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user