10726 lines
245 KiB
CSS
10726 lines
245 KiB
CSS
|
/* --------------------------------------------------------------------
|
||
|
|
* Template Master CSS
|
||
|
|
*
|
||
|
|
* Template: Sepia - Photography Portfolio HTML Website Template
|
||
|
|
* Author: Themetorium
|
||
|
|
* URL: https://themetorium.net
|
||
|
|
*
|
||
|
|
* Template main color: #08c1b8;
|
||
|
|
* Global font family (Google font): 'Poppins', sans-serif;
|
||
|
|
----------------------------------------------------------------------- */
|
||
|
|
|
||
|
|
|
||
|
|
/* Table of Content
|
||
|
|
====================
|
||
|
|
# General
|
||
|
|
# Page preloader
|
||
|
|
# Page boxed layout
|
||
|
|
# Body content
|
||
|
|
# Headings
|
||
|
|
# tt-heading
|
||
|
|
# Header
|
||
|
|
# Logo
|
||
|
|
# Menu
|
||
|
|
# Menu tools
|
||
|
|
# Intro
|
||
|
|
# Isotope
|
||
|
|
# Gallery list section
|
||
|
|
# Gallery list carousel
|
||
|
|
# Gallery thumbnails section
|
||
|
|
# Gallery single section
|
||
|
|
# Gallery single carousel
|
||
|
|
# Gallery single section with sidebar
|
||
|
|
# Add to favorites button
|
||
|
|
# Lightgallery
|
||
|
|
# Search results section
|
||
|
|
# Prices section
|
||
|
|
# FAQ section
|
||
|
|
# Content carousel
|
||
|
|
# Project carousel
|
||
|
|
# Latest work section
|
||
|
|
# Latest news section
|
||
|
|
# More projects section
|
||
|
|
# Blog list carousel section
|
||
|
|
# Blog list section
|
||
|
|
# Blog single
|
||
|
|
# Blog sidebar
|
||
|
|
# Blog sidebar widgets
|
||
|
|
# Archive
|
||
|
|
# About me section
|
||
|
|
# Contact section
|
||
|
|
# Page section
|
||
|
|
# Password protected section
|
||
|
|
# Page header
|
||
|
|
# Split box
|
||
|
|
# Pagination
|
||
|
|
# Thumbnail list
|
||
|
|
# YTP Player
|
||
|
|
# Panels
|
||
|
|
# Accordion
|
||
|
|
# Blockquote
|
||
|
|
# Testimonials section
|
||
|
|
# Begin call to action section
|
||
|
|
# Forms
|
||
|
|
# Modal
|
||
|
|
# Buttons
|
||
|
|
# Social buttons
|
||
|
|
# Follow me buttons
|
||
|
|
# Footer
|
||
|
|
*/
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* General
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
html, body {
|
||
|
|
padding: 0;
|
||
|
|
margin: 0;
|
||
|
|
overflow-x: hidden;
|
||
|
|
overflow-y: auto;
|
||
|
|
}
|
||
|
|
body {
|
||
|
|
position: relative;
|
||
|
|
background-color: #FFF;
|
||
|
|
font-family: 'Poppins', sans-serif;
|
||
|
|
line-height: 1.5;
|
||
|
|
font-size: 16px;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
|
||
|
|
a {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
a:hover, a:focus {
|
||
|
|
color: #1de2d9;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
a:focus {
|
||
|
|
outline: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
p {
|
||
|
|
margin: 0 0 1em;
|
||
|
|
}
|
||
|
|
|
||
|
|
img {
|
||
|
|
max-width: 100%;
|
||
|
|
height: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
b, strong {
|
||
|
|
font-weight: bold;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
|
||
|
|
::selection {
|
||
|
|
color: #fff;
|
||
|
|
text-shadow: none;
|
||
|
|
background: #08c1b8;
|
||
|
|
}
|
||
|
|
::-moz-selection {
|
||
|
|
color: #fff;
|
||
|
|
text-shadow: none;
|
||
|
|
background: #08c1b8; /* Firefox */
|
||
|
|
}
|
||
|
|
::-webkit-selection {
|
||
|
|
color: #fff;
|
||
|
|
text-shadow: none;
|
||
|
|
background: #08c1b8; /* Safari */
|
||
|
|
}
|
||
|
|
|
||
|
|
/* cover */
|
||
|
|
.cover {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
background-color: rgba(0, 0, 0, 0.2);
|
||
|
|
z-index: 2;
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* lead */
|
||
|
|
.lead {
|
||
|
|
margin-bottom: 20px;
|
||
|
|
font-size: 17px;
|
||
|
|
font-weight: 300;
|
||
|
|
line-height: 1.4;
|
||
|
|
}
|
||
|
|
@media (min-width: 768px) {
|
||
|
|
.lead {
|
||
|
|
font-size: 20px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* hr short */
|
||
|
|
hr.hr-short {
|
||
|
|
position: relative;
|
||
|
|
max-width: 45px;
|
||
|
|
margin-top: 20px;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
margin-left: 0;
|
||
|
|
margin-right: auto;
|
||
|
|
border: 0;
|
||
|
|
border-top: 6px solid #08c1b8;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
hr.hr-short.hr-center, .text-center hr.hr-short {
|
||
|
|
margin-left: auto;
|
||
|
|
margin-right: auto;
|
||
|
|
}
|
||
|
|
hr.hr-short.hr-right, .text-right hr.hr-short {
|
||
|
|
margin-left: auto;
|
||
|
|
margin-right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* section */
|
||
|
|
section {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* page background */
|
||
|
|
.page-background {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
.page-background:before {
|
||
|
|
position: absolute;
|
||
|
|
content: "";
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
background-color: #FFF;
|
||
|
|
opacity: .93;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* --------------------------------------------------------------------------------------- *
|
||
|
|
* Page transitions / preloader (Animsition). Display loading animation while page loads
|
||
|
|
* More info: http://git.blivesta.com/animsition/
|
||
|
|
/* --------------------------------------------------------------------------------------- */
|
||
|
|
|
||
|
|
/* circle loader */
|
||
|
|
.animsition-loading {
|
||
|
|
border-top: 3px solid rgba(130, 130, 130, 0.3);
|
||
|
|
border-right: 3px solid rgba(130, 130, 130, 0.3);
|
||
|
|
border-bottom: 3px solid rgba(130, 130, 130, 0.3);
|
||
|
|
border-left: 3px solid #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ----------------------------------------------------------------------------------------- *
|
||
|
|
* Page boxed layout
|
||
|
|
* Note: Class "boxed" in <body> tag is connected with class "tt-wrap" in several places!
|
||
|
|
/* ----------------------------------------------------------------------------------------- */
|
||
|
|
|
||
|
|
body.tt-boxed .tt-wrap {
|
||
|
|
margin-left: auto;
|
||
|
|
margin-right: auto;
|
||
|
|
padding-left: 15px;
|
||
|
|
padding-right: 15px;
|
||
|
|
}
|
||
|
|
body.tt-boxed .tt-wrap {
|
||
|
|
max-width: 1440px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Body content
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#body-content {
|
||
|
|
position: relative;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Headings
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
|
||
|
|
color: inherit;
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
.h1, .h2, .h3, h1, h2, h3 {
|
||
|
|
line-height: 1.2;
|
||
|
|
margin-top: 0px;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
.h4, .h5, .h6, h4, h5, h6 {
|
||
|
|
line-height: 1.4;
|
||
|
|
margin-top: 10px;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.h1, h1 { font-size: 36px; }
|
||
|
|
.h2, h2 { font-size: 30px; }
|
||
|
|
.h3, h3 { font-size: 24px; }
|
||
|
|
.h4, h4 { font-size: 18px; }
|
||
|
|
.h5, h5 { font-size: 14px; }
|
||
|
|
.h6, h6 { font-size: 12px; }
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* tt-heading
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.tt-heading {
|
||
|
|
position: relative;
|
||
|
|
z-index: 1;
|
||
|
|
}
|
||
|
|
.tt-heading.padding-on {
|
||
|
|
padding: 6% 3% 5% 3%;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.tt-heading.padding-on {
|
||
|
|
padding: 15% 3% 12% 3%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.tt-heading-inner {
|
||
|
|
position: relative;
|
||
|
|
z-index: 2;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* tt-heading title */
|
||
|
|
.tt-heading-title {
|
||
|
|
max-width: 800px;
|
||
|
|
margin: 0;
|
||
|
|
font-size: 32px;
|
||
|
|
}
|
||
|
|
.tt-heading-subtitle {
|
||
|
|
max-width: 800px;
|
||
|
|
margin-top: 5px;
|
||
|
|
font-size: 16px;
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
.tt-heading.text-center .tt-heading-title,
|
||
|
|
.tt-heading.text-center .tt-heading-subtitle {
|
||
|
|
margin-left: auto;
|
||
|
|
margin-right: auto;
|
||
|
|
}
|
||
|
|
.tt-heading.text-right .tt-heading-title,
|
||
|
|
.tt-heading.text-right .tt-heading-subtitle {
|
||
|
|
margin-left: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* tt-heading hr-short */
|
||
|
|
.tt-heading .hr-short {
|
||
|
|
}
|
||
|
|
.tt-heading.text-center hr.hr-short {
|
||
|
|
margin-left: auto;
|
||
|
|
margin-right: auto;
|
||
|
|
}
|
||
|
|
.tt-heading.text-right hr.hr-short {
|
||
|
|
margin-left: auto;
|
||
|
|
margin-right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* tt-heading sizes
|
||
|
|
==================== */
|
||
|
|
/* tt-heading xs */
|
||
|
|
.tt-heading.tt-heading-xs .tt-heading-title {
|
||
|
|
font-size: 24px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* tt-heading sm */
|
||
|
|
.tt-heading.tt-heading-sm .tt-heading-title {
|
||
|
|
font-size: 28px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* tt-heading lg */
|
||
|
|
.tt-heading.tt-heading-lg .tt-heading-title {
|
||
|
|
font-size: 38px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* tt-heading xlg */
|
||
|
|
.tt-heading.tt-heading-xlg .tt-heading-title {
|
||
|
|
font-size: 42px;
|
||
|
|
}
|
||
|
|
.tt-heading.tt-heading-xlg .tt-heading-subtitle {
|
||
|
|
margin-top: 5px;
|
||
|
|
font-size: 17px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.tt-heading.tt-heading-xlg .tt-heading-title {
|
||
|
|
font-size: 38px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* tt-heading xxlg */
|
||
|
|
.tt-heading.tt-heading-xxlg .tt-heading-title {
|
||
|
|
font-size: 62px;
|
||
|
|
}
|
||
|
|
.tt-heading.tt-heading-xxlg .tt-heading-subtitle {
|
||
|
|
font-size: 19px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.tt-heading.tt-heading-xxlg .tt-heading-title {
|
||
|
|
font-size: 38px;
|
||
|
|
}
|
||
|
|
.tt-heading.tt-heading-xxlg .tt-heading-subtitle {
|
||
|
|
font-size: 17px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Header
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#header {
|
||
|
|
position: relative;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
width: 100%;
|
||
|
|
max-width: 100%;
|
||
|
|
background-color: #FFF;
|
||
|
|
z-index: 9999;
|
||
|
|
-webkit-transition: all 0.4s ease-in-out;
|
||
|
|
-moz-transition: all 0.4s ease-in-out;
|
||
|
|
-o-transition: all 0.4s ease-in-out;
|
||
|
|
-ms-transition: all 0.4s ease-in-out;
|
||
|
|
transition: all 0.4s ease-in-out;
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
#header {
|
||
|
|
z-index: 99999;
|
||
|
|
box-shadow: 0 2px 0 rgba(0, 0, 0, 0.05);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* header inner */
|
||
|
|
.header-inner {
|
||
|
|
position: relative;
|
||
|
|
padding-left: 2%;
|
||
|
|
padding-right: 2%;
|
||
|
|
}
|
||
|
|
.header-inner:after {
|
||
|
|
content: "";
|
||
|
|
display: block;
|
||
|
|
clear: both;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* header fixed top */
|
||
|
|
#header.header-fixed-top {
|
||
|
|
position: fixed !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* hide header on scroll down and show on scroll up */
|
||
|
|
#header.header-show-hide-on-scroll {
|
||
|
|
position: fixed !important;
|
||
|
|
}
|
||
|
|
#header.header-show-hide-on-scroll.fly-up {
|
||
|
|
top: -150px;
|
||
|
|
}
|
||
|
|
body.tt-m-menu-open #header.header-show-hide-on-scroll { /* disable hide/show header on scroll if mobile menu is open */
|
||
|
|
top: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* header transparent */
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
#header.header-transparent {
|
||
|
|
position: absolute;
|
||
|
|
background-color: transparent;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
#header.header-transparent .tt-menu-nav > li > a,
|
||
|
|
#header.header-transparent .tt-menu-tools > ul > li > a {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
#header.header-transparent .tt-menu-nav > li > a:hover {
|
||
|
|
}
|
||
|
|
|
||
|
|
#header.header-transparent #logo .logo-dark {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
#header.header-transparent #logo .logo-light {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Header filled */
|
||
|
|
#header.header-filled {
|
||
|
|
padding: 0;
|
||
|
|
box-shadow: 0 2px 0 rgba(0, 0, 0, 0.05);
|
||
|
|
}
|
||
|
|
#header.header-transparent.header-filled {
|
||
|
|
background-color: #FFF;
|
||
|
|
box-shadow: 0 2px 0 rgba(0, 0, 0, 0.07);
|
||
|
|
}
|
||
|
|
#header.header-transparent.header-filled .tt-menu-nav > li > a,
|
||
|
|
#header.header-transparent.header-filled .tt-menu-tools > ul > li > a {
|
||
|
|
color: inherit;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
#header.header-transparent.header-filled #logo .logo-dark {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
#header.header-transparent.header-filled #logo .logo-light {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Logo
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#logo {
|
||
|
|
position: relative;
|
||
|
|
z-index: 9;
|
||
|
|
}
|
||
|
|
#header #logo img {
|
||
|
|
max-height: 50px
|
||
|
|
}
|
||
|
|
|
||
|
|
#logo .logo-light {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
#logo .logo-light-m,
|
||
|
|
#logo .logo-dark-m {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
#header #logo {
|
||
|
|
position: relative;
|
||
|
|
float: left !important;
|
||
|
|
top: 13px !important;
|
||
|
|
}
|
||
|
|
#header #logo img {
|
||
|
|
max-height: 34px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#logo .logo-dark {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
#logo .logo-dark-m {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Menu
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.tt-main-menu {
|
||
|
|
display: inline-block;
|
||
|
|
min-height: 80px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* menu collapse */
|
||
|
|
.tt-menu-collapse {
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.tt-menu-collapse {
|
||
|
|
display: inline-block !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* menu nav */
|
||
|
|
.tt-menu-nav {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
}
|
||
|
|
.tt-menu-nav > li {
|
||
|
|
display: inline-block;
|
||
|
|
margin: 0 10px;
|
||
|
|
}
|
||
|
|
.tt-menu-nav > li:first-child {
|
||
|
|
margin-left: 0;
|
||
|
|
}
|
||
|
|
.tt-menu-nav > li:last-child {
|
||
|
|
margin-right: 0;
|
||
|
|
}
|
||
|
|
@media (max-width: 1400px) {
|
||
|
|
.tt-menu-nav > li {
|
||
|
|
margin-left: 5px;
|
||
|
|
margin-right: 5px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.tt-menu-nav > li > a {
|
||
|
|
position: relative;
|
||
|
|
display: block;
|
||
|
|
margin: 0;
|
||
|
|
padding: 30px 0;
|
||
|
|
text-decoration: none;
|
||
|
|
font-size: 15px;
|
||
|
|
font-weight: 500;
|
||
|
|
color: #222;
|
||
|
|
-webkit-transition: all 0.1s ease-in-out;
|
||
|
|
-moz-transition: all 0.1s ease-in-out;
|
||
|
|
-o-transition: all 0.1s ease-in-out;
|
||
|
|
-ms-transition: all 0.1s ease-in-out;
|
||
|
|
transition: all 0.1s ease-in-out;
|
||
|
|
}
|
||
|
|
.tt-menu-nav > li > a:after {
|
||
|
|
position: absolute;
|
||
|
|
content: "";
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
width: 0;
|
||
|
|
height: 3px;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.tt-menu-nav > li > a:hover:after {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
.tt-menu-nav > li.active > a:after {
|
||
|
|
position: absolute;
|
||
|
|
content: "";
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
width: 100%;
|
||
|
|
height: 3px;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Submenu
|
||
|
|
============ */
|
||
|
|
.tt-submenu-wrap {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tt-submenu {
|
||
|
|
position: relative;
|
||
|
|
display: none;
|
||
|
|
top: 100%;
|
||
|
|
left: 0;
|
||
|
|
min-width: 200px;
|
||
|
|
background-color: #FFF;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
z-index: 999;
|
||
|
|
text-align: left;
|
||
|
|
box-shadow: inset 0 0 0 1px rgba(99, 99, 99, 0.1);
|
||
|
|
-webkit-box-shadow: inset 0 0 0 1px rgba(99, 99, 99, 0.1);
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.tt-submenu {
|
||
|
|
position: absolute;
|
||
|
|
display: block !important;
|
||
|
|
top: 110%;
|
||
|
|
padding-top: 10px;
|
||
|
|
padding-bottom: 10px;
|
||
|
|
visibility: hidden;
|
||
|
|
opacity: 0;
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.tt-submenu-wrap.tt-submenu-open > .tt-submenu {
|
||
|
|
top: 100%;
|
||
|
|
visibility: visible;
|
||
|
|
opacity: 1;
|
||
|
|
-webkit-transition-delay: 0.1s;
|
||
|
|
-moz-transition-delay: 0.1s;
|
||
|
|
transition-delay: 0.1s;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* sub-sub menu */
|
||
|
|
.tt-submenu > .tt-submenu-wrap > .tt-submenu {
|
||
|
|
left: 100%;
|
||
|
|
right: auto;
|
||
|
|
margin-top: -36px;
|
||
|
|
margin-left: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* submenu links */
|
||
|
|
.tt-submenu li {
|
||
|
|
margin-top: 2px;
|
||
|
|
margin-bottom: 2px;
|
||
|
|
}
|
||
|
|
.tt-submenu li:first-child {
|
||
|
|
margin-top: 0;
|
||
|
|
}
|
||
|
|
.tt-submenu li:last-child {
|
||
|
|
margin-bottom: 0;
|
||
|
|
}
|
||
|
|
.tt-submenu li > a {
|
||
|
|
position: relative;
|
||
|
|
display: block;
|
||
|
|
padding: 10px 25px 7px 20px;
|
||
|
|
text-decoration: none;
|
||
|
|
font-size: 14px;
|
||
|
|
line-height: 19px;
|
||
|
|
color: #888;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.tt-submenu li > a:hover {
|
||
|
|
background-color: rgba(132, 132, 132, 0.1);
|
||
|
|
color: #000;
|
||
|
|
-webkit-box-shadow: inset 3px 0 0 0 #08c1b8;
|
||
|
|
box-shadow: inset 3px 0 0 0 #08c1b8;
|
||
|
|
}
|
||
|
|
.tt-submenu > li.active > a {
|
||
|
|
background-color: rgba(132, 132, 132, 0.1);
|
||
|
|
color: #000;
|
||
|
|
-webkit-box-shadow: 3px 0 0 0 #08c1b8;
|
||
|
|
box-shadow: inset 3px 0 0 0 #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* submenu right position */
|
||
|
|
.tt-menu-nav > li:last-child > .tt-submenu {
|
||
|
|
left: auto;
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
.tt-submenu-master.tt-submenu-right > .tt-submenu { /* you can add class "tt-submenu-right" manually if needed (works in dropdown master only!) */
|
||
|
|
left: auto;
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* caret (requires FontAwesome: https://fontawesome.com/) */
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.tt-caret {
|
||
|
|
position: relative;
|
||
|
|
top: 1px;
|
||
|
|
margin-left: 5px;
|
||
|
|
font-size: 12px;
|
||
|
|
line-height: 0;
|
||
|
|
}
|
||
|
|
.tt-caret::after {
|
||
|
|
font-family: "Font Awesome 5 Free";
|
||
|
|
content: "\f107";
|
||
|
|
font-weight: 900;
|
||
|
|
display: inline-block;
|
||
|
|
font-style: normal;
|
||
|
|
font-variant: normal;
|
||
|
|
text-rendering: auto;
|
||
|
|
-webkit-font-smoothing: antialiased;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* caret in dropdowns */
|
||
|
|
.tt-submenu .tt-caret {
|
||
|
|
position: absolute;
|
||
|
|
right: 8px;
|
||
|
|
top: 50%;
|
||
|
|
-moz-transform: translateY(-50%) rotate(-90deg);
|
||
|
|
-ms-transform: translateY(-50%) rotate(-90deg);
|
||
|
|
-webkit-transform: translateY(-50%) rotate(-90deg);
|
||
|
|
transform: translateY(-50%) rotate(-90deg);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Submenu dark style
|
||
|
|
====================== */
|
||
|
|
.tt-submenu-dark .tt-submenu {
|
||
|
|
background-color: #111;
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.tt-submenu-dark .tt-submenu {
|
||
|
|
background-color: rgba(25, 25, 25, 0.95);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.tt-submenu-dark .tt-submenu li > a {
|
||
|
|
color: #CCC;
|
||
|
|
}
|
||
|
|
.tt-submenu-dark .tt-submenu li > a:hover {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.tt-submenu-dark .tt-submenu > li.active > a {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Menu aligns
|
||
|
|
=============== */
|
||
|
|
/* menu align left */
|
||
|
|
#header.menu-align-left .tt-main-menu {
|
||
|
|
display: block;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
#header.menu-align-left #logo {
|
||
|
|
top: 15px;
|
||
|
|
float: left;
|
||
|
|
margin: 0 4% 0 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* menu align right */
|
||
|
|
#header.menu-align-right .tt-main-menu {
|
||
|
|
float: right;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
#header.menu-align-right #logo {
|
||
|
|
top: 15px;
|
||
|
|
float: left;
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* menu align center */
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
#header.menu-align-center {
|
||
|
|
text-align: center;
|
||
|
|
margin-bottom: 2.5%;
|
||
|
|
}
|
||
|
|
#header.menu-align-center #logo {
|
||
|
|
padding: 40px 0 30px 0;
|
||
|
|
}
|
||
|
|
#header.menu-align-center #logo img {
|
||
|
|
max-height: 80px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#header.menu-align-center .tt-menu-nav > li > a:after {
|
||
|
|
left: 50%;
|
||
|
|
}
|
||
|
|
#header.menu-align-center .tt-menu-nav > li > a:hover:after {
|
||
|
|
left: 0;
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
#header.menu-align-center .tt-menu-nav > li.active > a:after {
|
||
|
|
left: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Mobile menu toggle button
|
||
|
|
============================= */
|
||
|
|
#tt-m-menu-toggle-btn {
|
||
|
|
position: relative;
|
||
|
|
display: none;
|
||
|
|
float: right;
|
||
|
|
top: 20px;
|
||
|
|
cursor: pointer;
|
||
|
|
padding: 8px 25px 11px 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* hamburger */
|
||
|
|
#tt-m-menu-toggle-btn span,
|
||
|
|
#tt-m-menu-toggle-btn span:before,
|
||
|
|
#tt-m-menu-toggle-btn span:after {
|
||
|
|
position: absolute;
|
||
|
|
display: block;
|
||
|
|
content: '';
|
||
|
|
height: 4px;
|
||
|
|
width: 25px;
|
||
|
|
background-color: #222;
|
||
|
|
cursor: pointer;
|
||
|
|
border-radius: 0;
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
#tt-m-menu-toggle-btn span:before {
|
||
|
|
top: -8px;
|
||
|
|
}
|
||
|
|
#tt-m-menu-toggle-btn span:after {
|
||
|
|
bottom: -8px;
|
||
|
|
}
|
||
|
|
body.tt-m-menu-open #tt-m-menu-toggle-btn span {
|
||
|
|
background-color: transparent !important;
|
||
|
|
}
|
||
|
|
body.tt-m-menu-open #tt-m-menu-toggle-btn span:before {
|
||
|
|
top: 0;
|
||
|
|
-webkit-transform: rotate(45deg);
|
||
|
|
-moz-transform: rotate(45deg);
|
||
|
|
-o-transform: rotate(45deg);
|
||
|
|
-ms-transform: rotate(45deg);
|
||
|
|
transform: rotate(45deg);
|
||
|
|
}
|
||
|
|
body.tt-m-menu-open #tt-m-menu-toggle-btn span:after {
|
||
|
|
top: 0;
|
||
|
|
-webkit-transform: rotate(-45deg);
|
||
|
|
-moz-transform: rotate(-45deg);
|
||
|
|
-o-transform: rotate(-45deg);
|
||
|
|
-ms-transform: rotate(-45deg);
|
||
|
|
transform: rotate(-45deg);
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Mobile menu
|
||
|
|
================ */
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
#tt-m-menu-toggle-btn {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tt-main-menu {
|
||
|
|
display: block;
|
||
|
|
float: none !important;
|
||
|
|
min-height: 60px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* mobile menu collapse */
|
||
|
|
.tt-menu-collapse {
|
||
|
|
position: absolute;
|
||
|
|
display: none;
|
||
|
|
top: 100%;
|
||
|
|
left: 0;
|
||
|
|
width: 100%;
|
||
|
|
max-height: calc(100vh - 60px);
|
||
|
|
overflow-y: auto;
|
||
|
|
background-color: #1F1F1F;
|
||
|
|
text-align: left;
|
||
|
|
border-top: 1px solid #000;
|
||
|
|
box-shadow: inset 0 22px 7px -20px rgba(0, 0, 0, 0.8);
|
||
|
|
-webkit-box-shadow: inset 0 22px 7px -20px rgba(0, 0, 0, 0.8);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* menu nav */
|
||
|
|
.tt-menu-nav {
|
||
|
|
}
|
||
|
|
.tt-menu-nav > li {
|
||
|
|
display: block;
|
||
|
|
float: none;
|
||
|
|
margin: 0;
|
||
|
|
border-bottom: 1px solid #000;
|
||
|
|
}
|
||
|
|
.tt-menu-nav > li > a {
|
||
|
|
background-color: transparent;
|
||
|
|
margin: 0;
|
||
|
|
padding: 10px 20px;
|
||
|
|
color: #CCC !important;
|
||
|
|
}
|
||
|
|
.tt-menu-nav > li > a:hover {
|
||
|
|
background-color: transparent;
|
||
|
|
box-shadow: none;
|
||
|
|
color: #FFF !important;
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
.tt-menu-nav > li.active > a {
|
||
|
|
background-color: transparent;
|
||
|
|
color: #FFF !important;
|
||
|
|
box-shadow: inset 4px 0 0 0 #08c1b8;
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
.tt-menu-nav > li > a:after {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* mobile submnu */
|
||
|
|
.tt-submenu {
|
||
|
|
display: none;
|
||
|
|
position: relative;
|
||
|
|
top: auto;
|
||
|
|
left: 0 !important;
|
||
|
|
min-width: 100%;
|
||
|
|
background-color: #111;
|
||
|
|
text-align: left;
|
||
|
|
box-shadow: none;
|
||
|
|
-webkit-box-shadow: none;
|
||
|
|
border-top: 1px solid rgba(134, 134, 134, 0.15);
|
||
|
|
box-shadow: inset 0 22px 10px -20px rgba(0, 0, 0, 0.8), inset 0 -22px 10px -20px rgba(0, 0, 0, 0.8) !important;
|
||
|
|
-webkit-box-shadow: inset 0 22px 10px -20px rgba(0, 0, 0, 0.8), inset 0 -22px 10px -20px rgba(0, 0, 0, 0.8) !important;
|
||
|
|
}
|
||
|
|
.tt-submenu > .tt-submenu-wrap > .tt-submenu {
|
||
|
|
left: 0 !important;
|
||
|
|
margin-top: 0;
|
||
|
|
padding-left: 5%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* mobile submnu links */
|
||
|
|
.tt-submenu > li {
|
||
|
|
margin-top: 0;
|
||
|
|
margin-bottom: 0;
|
||
|
|
border-top: 1px solid #000;
|
||
|
|
}
|
||
|
|
.tt-submenu > li:first-child {
|
||
|
|
border-top: none;
|
||
|
|
}
|
||
|
|
.tt-submenu li > a {
|
||
|
|
padding: 11px 55px 11px 30px;
|
||
|
|
color: #CCC;
|
||
|
|
}
|
||
|
|
.tt-submenu > li > a:hover {
|
||
|
|
background-color: transparent;
|
||
|
|
padding-left: 30px;
|
||
|
|
box-shadow: none;
|
||
|
|
color: #FFF;
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
.tt-submenu > li.active > a {
|
||
|
|
background-color: transparent;
|
||
|
|
color: #FFF;
|
||
|
|
box-shadow: inset 4px 0 0 0 #08c1b8;
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* mobile menu link caret */
|
||
|
|
.tt-submenu-wrap .tt-m-submenu-toggle {
|
||
|
|
width: 45px;
|
||
|
|
height: 100%;
|
||
|
|
line-height: 44px;
|
||
|
|
background-color: rgba(128, 128, 128, 0.12);
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
right: 0;
|
||
|
|
cursor: pointer;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 18px;
|
||
|
|
color: #DDD;
|
||
|
|
border-left: 1px solid rgba(134, 134, 134, 0.06);
|
||
|
|
}
|
||
|
|
.tt-submenu-wrap .tt-m-submenu-toggle::after {
|
||
|
|
position: relative;
|
||
|
|
top: -1px;
|
||
|
|
margin-left: 2px;
|
||
|
|
line-height: 0;
|
||
|
|
|
||
|
|
font-family: "Font Awesome 5 Free";
|
||
|
|
content: "\f107";
|
||
|
|
font-weight: 900;
|
||
|
|
display: inline-block;
|
||
|
|
font-style: normal;
|
||
|
|
font-variant: normal;
|
||
|
|
text-rendering: auto;
|
||
|
|
-webkit-font-smoothing: antialiased;
|
||
|
|
}
|
||
|
|
.tt-submenu-wrap .tt-m-submenu-toggle.tt-m-dropdown-open::after {
|
||
|
|
font-size: 16px;
|
||
|
|
|
||
|
|
font-family: "Font Awesome 5 Free";
|
||
|
|
content: "\f00d";
|
||
|
|
font-weight: 900;
|
||
|
|
display: inline-block;
|
||
|
|
font-style: normal;
|
||
|
|
font-variant: normal;
|
||
|
|
text-rendering: auto;
|
||
|
|
-webkit-font-smoothing: antialiased;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Menu tools
|
||
|
|
================= */
|
||
|
|
.tt-menu-tools {
|
||
|
|
float: right;
|
||
|
|
margin-left: 15px;
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.tt-menu-tools {
|
||
|
|
margin-left: 0;
|
||
|
|
margin-right: 20px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.tt-menu-tools > ul {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
}
|
||
|
|
.tt-menu-tools > ul > li {
|
||
|
|
float: left;
|
||
|
|
margin-left: 8px;
|
||
|
|
}
|
||
|
|
.tt-menu-tools > ul > li > a {
|
||
|
|
position: relative;
|
||
|
|
display: block;
|
||
|
|
margin: 20px 0;
|
||
|
|
padding: 10px 5px;
|
||
|
|
font-size: 15px;
|
||
|
|
font-weight: normal;
|
||
|
|
color: #222;
|
||
|
|
z-index: 9;
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.tt-menu-tools > ul > li > a {
|
||
|
|
margin: 0;
|
||
|
|
padding: 20px 8px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* tt dropdown
|
||
|
|
=============== */
|
||
|
|
.tt-dropdown-wrap {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tt-dropdown {
|
||
|
|
position: absolute;
|
||
|
|
display: block;
|
||
|
|
top: 110%;
|
||
|
|
left: 0;
|
||
|
|
min-width: 180px;
|
||
|
|
background-color: #FFF;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
z-index: 999;
|
||
|
|
text-align: left;
|
||
|
|
visibility: hidden;
|
||
|
|
opacity: 0;
|
||
|
|
box-shadow: inset 0 0 0 1px rgba(99, 99, 99, 0.1);
|
||
|
|
-webkit-box-shadow: inset 0 0 0 1px rgba(99, 99, 99, 0.1);
|
||
|
|
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.tt-dropdown-wrap.tt-dropdown-open > .tt-dropdown {
|
||
|
|
top: 100%;
|
||
|
|
visibility: visible;
|
||
|
|
opacity: 1;
|
||
|
|
-webkit-transition-delay: 0.1s;
|
||
|
|
-moz-transition-delay: 0.1s;
|
||
|
|
transition-delay: 0.1s;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* tt dropdown links */
|
||
|
|
.tt-dropdown li {
|
||
|
|
}
|
||
|
|
.tt-dropdown li:last-child {
|
||
|
|
}
|
||
|
|
.tt-dropdown li > a {
|
||
|
|
position: relative;
|
||
|
|
display: block;
|
||
|
|
padding: 10px 25px 10px 20px;
|
||
|
|
text-decoration: none;
|
||
|
|
font-size: 14px;
|
||
|
|
line-height: 20px;
|
||
|
|
color: #888;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.tt-dropdown li > a:hover {
|
||
|
|
background-color: rgba(130, 130, 130, 0.09);
|
||
|
|
color: #000;
|
||
|
|
}
|
||
|
|
.tt-dropdown > li.active > a {
|
||
|
|
background-color: rgba(130, 130, 130, 0.09);
|
||
|
|
color: #000;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* tt dropdown right position */
|
||
|
|
.tt-menu-tools-menu-nav li:last-child > .tt-dropdown {
|
||
|
|
left: auto;
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
.tt-dropdown-master.tt-dropdown-right > .tt-dropdown { /* you can add class "tt-dropdown-right" manually if needed (works in dropdown master only!) */
|
||
|
|
left: auto;
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* tt dropdown dark style */
|
||
|
|
.tt-dropdown-dark .tt-dropdown {
|
||
|
|
background-color: #111;
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.tt-dropdown-dark .tt-dropdown {
|
||
|
|
background-color: rgba(25, 25, 25, 0.95);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.tt-dropdown-dark .tt-dropdown li > a {
|
||
|
|
color: #CCC;
|
||
|
|
}
|
||
|
|
.tt-dropdown-dark .tt-dropdown li > a:hover {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.tt-dropdown-dark .tt-dropdown > li.active > a {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* tt clobal search
|
||
|
|
==================== */
|
||
|
|
.tt-clobal-search {
|
||
|
|
position: fixed;
|
||
|
|
display: none;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
bottom: 0;
|
||
|
|
z-index: 99998;
|
||
|
|
background-color: rgba(0, 0, 0, 0.93);
|
||
|
|
}
|
||
|
|
@media (max-width : 1200px) {
|
||
|
|
.tt-clobal-search {
|
||
|
|
left: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.tt-clobal-search-inner {
|
||
|
|
position: absolute;
|
||
|
|
top: 40%;
|
||
|
|
left: 50%;
|
||
|
|
width: 100%;
|
||
|
|
height: auto;
|
||
|
|
max-width: 800px;
|
||
|
|
padding: 0 40px;
|
||
|
|
z-index: 99999;
|
||
|
|
-moz-transform: translate(-50%, -50%);
|
||
|
|
-ms-transform: translate(-50%, -50%);
|
||
|
|
-webkit-transform: translate(-50%, -50%);
|
||
|
|
transform: translate(-50%, -50%);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* tt clobal search trigger */
|
||
|
|
.tt-clobal-search-trigger {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* tt clobal search title */
|
||
|
|
.tt-clobal-search-title {
|
||
|
|
line-height: 1;
|
||
|
|
font-size: 195px;
|
||
|
|
font-weight: bold;
|
||
|
|
color: #FFF;
|
||
|
|
opacity: .25;
|
||
|
|
z-index: 1;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.tt-clobal-search-title {
|
||
|
|
left: 5%;
|
||
|
|
font-size: 180px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.tt-clobal-search-title {
|
||
|
|
font-size: 84px;
|
||
|
|
font-size: 20vw;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* tt clobal search form */
|
||
|
|
#tt-clobal-search-form {
|
||
|
|
}
|
||
|
|
.tt-clobal-search #tt-clobal-search-input {
|
||
|
|
position: relative;
|
||
|
|
width: 100%;
|
||
|
|
height: 80px;
|
||
|
|
background-color: transparent;
|
||
|
|
padding: 0;
|
||
|
|
font-size: 22px;
|
||
|
|
color: #FFF;
|
||
|
|
border: none;
|
||
|
|
border-bottom: 2px solid #fff;
|
||
|
|
}
|
||
|
|
.tt-clobal-search #tt-clobal-search-input:focus {
|
||
|
|
outline: none;
|
||
|
|
box-shadow: none;
|
||
|
|
border-bottom-color: #08c1b8;
|
||
|
|
}
|
||
|
|
@media (max-width : 767px) {
|
||
|
|
.tt-clobal-search #tt-clobal-search-input {
|
||
|
|
height: 60px;
|
||
|
|
font-size: 21px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.tt-clobal-search .form-btn-inside button {
|
||
|
|
color: #CCC;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* tt clobal search close */
|
||
|
|
.tt-clobal-search-close {
|
||
|
|
position: absolute;
|
||
|
|
top: 40px;
|
||
|
|
right: 60px;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #FFF;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.tt-clobal-search-close {
|
||
|
|
top: 20px;
|
||
|
|
right: 30px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Menu tools languages
|
||
|
|
======================== */
|
||
|
|
.tt-tools-lang > a > img {
|
||
|
|
position: relative;
|
||
|
|
top: -1px;
|
||
|
|
}
|
||
|
|
.tt-tools-lang .tt-dropdown {
|
||
|
|
min-width: 80px;
|
||
|
|
}
|
||
|
|
.tt-tools-lang .tt-dropdown li > a {
|
||
|
|
padding: 8px 20px;
|
||
|
|
}
|
||
|
|
.tt-tools-lang .tt-dropdown li > a > img {
|
||
|
|
position: relative;
|
||
|
|
top: -1px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Menu tools call to action button
|
||
|
|
==================================== */
|
||
|
|
.tt-tools-button {
|
||
|
|
background-color: #08c1b8;
|
||
|
|
margin: 22px 0 22px 20px !important;
|
||
|
|
padding: 8px 15px !important;
|
||
|
|
font-size: 14px !important;
|
||
|
|
color: #FFF !important;
|
||
|
|
}
|
||
|
|
.tt-tools-button:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
@media (max-width: 1400px) {
|
||
|
|
.tt-tools-button {
|
||
|
|
margin-left: 10px !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.tt-tools-button {
|
||
|
|
display: none;
|
||
|
|
margin: 13px 0 13px 8px !important;
|
||
|
|
padding: 7px 10px !important;
|
||
|
|
margin-top: 13px !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* --------------------------------------------------- *
|
||
|
|
* Intro
|
||
|
|
/* --------------------------------------------------- */
|
||
|
|
|
||
|
|
#tt-intro {
|
||
|
|
min-height: 400px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tt-intro-inner {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
@media (max-width: 1440px) {
|
||
|
|
.tt-intro-inner {
|
||
|
|
padding-left: 0 !important;
|
||
|
|
padding-right: 0 !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Intro variations
|
||
|
|
==================== */
|
||
|
|
|
||
|
|
/* video intro */
|
||
|
|
.video-intro {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* image intro */
|
||
|
|
.image-intro {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* slideshow intro */
|
||
|
|
.slideshow-intro {
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Intro full height offset
|
||
|
|
============================ */
|
||
|
|
#tt-intro .full-height-vh {
|
||
|
|
min-height: calc(100vh - 82px) !important;
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
body.footer-minimal-on #tt-intro .full-height-vh {
|
||
|
|
min-height: calc(100vh - 162px) !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
#tt-intro .full-height-vh {
|
||
|
|
min-height: calc(100vh - 62px) !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if header-transparent enabled */
|
||
|
|
body.header-transparent-on #tt-intro .full-height-vh {
|
||
|
|
height: 100vh;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Intro caption
|
||
|
|
================= */
|
||
|
|
#tt-intro .intro-caption {
|
||
|
|
position: absolute;
|
||
|
|
max-width: 800px;
|
||
|
|
z-index: 9;
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* intro caption title */
|
||
|
|
#tt-intro .intro-title {
|
||
|
|
display: block;
|
||
|
|
margin: 0;
|
||
|
|
font-size: 68px;
|
||
|
|
font-weight: bold;
|
||
|
|
color: #FFF;
|
||
|
|
text-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
#tt-intro .intro-title {
|
||
|
|
font-size: 52px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
#tt-intro .intro-title {
|
||
|
|
font-size: 42px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* intro caption subtitle */
|
||
|
|
#tt-intro .intro-subtitle {
|
||
|
|
display: block;
|
||
|
|
margin: 10px 0 0 0;
|
||
|
|
font-size: 24px;
|
||
|
|
font-weight: bold;
|
||
|
|
color: #FFF;
|
||
|
|
text-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* intro caption description */
|
||
|
|
#tt-intro .intro-description {
|
||
|
|
margin: 15px auto 0 auto;
|
||
|
|
font-weight: normal;
|
||
|
|
color: #FFF;
|
||
|
|
text-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* intro caption category */
|
||
|
|
#tt-intro .cc-category {
|
||
|
|
display: inline-block;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
padding: 0 5px;
|
||
|
|
margin: 10px 0 0 0;
|
||
|
|
font-size: 14px;
|
||
|
|
font-weight: normal;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Intro caption sizes
|
||
|
|
======================= */
|
||
|
|
|
||
|
|
/* intro caption xs */
|
||
|
|
#tt-intro .intro-caption.intro-caption-xs .intro-title {
|
||
|
|
font-size: 48px;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.intro-caption-xs .intro-subtitle {
|
||
|
|
font-size: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* intro caption sm */
|
||
|
|
#tt-intro .intro-caption.intro-caption-sm .intro-title {
|
||
|
|
font-size: 58px;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.intro-caption-sm .intro-subtitle {
|
||
|
|
font-size: 21px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
#tt-intro .intro-caption.intro-caption-sm .intro-title {
|
||
|
|
font-size: 52px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
#tt-intro .intro-caption.intro-caption-sm .intro-title {
|
||
|
|
font-size: 42px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* intro caption lg */
|
||
|
|
#tt-intro .intro-caption.intro-caption-lg .intro-title {
|
||
|
|
font-size: 78px;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.intro-caption-lg .intro-subtitle {
|
||
|
|
margin: 15px 0 0 0;
|
||
|
|
font-size: 26px;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.intro-caption-lg .intro-description {
|
||
|
|
font-size: 18px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
#tt-intro .intro-caption.intro-caption-lg .intro-title {
|
||
|
|
font-size: 72px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
#tt-intro .intro-caption.intro-caption-lg .intro-title {
|
||
|
|
font-size: 42px;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.intro-caption-lg .intro-subtitle {
|
||
|
|
font-size: 24px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* intro caption xlg */
|
||
|
|
#tt-intro .intro-caption.intro-caption-xlg .intro-title {
|
||
|
|
font-size: 92px;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.intro-caption-xlg .intro-subtitle {
|
||
|
|
margin: 15px 0 0 0;
|
||
|
|
font-size: 28px;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.intro-caption-xlg .intro-description {
|
||
|
|
font-size: 18px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
#tt-intro .intro-caption.intro-caption-xlg .intro-title {
|
||
|
|
font-size: 74px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
#tt-intro .intro-caption.intro-caption-xlg .intro-title {
|
||
|
|
font-size: 48px;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.intro-caption-xlg .intro-subtitle {
|
||
|
|
font-size: 24px;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.intro-caption-xlg .intro-description {
|
||
|
|
font-size: 18px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* intro caption xxlg */
|
||
|
|
#tt-intro .intro-caption.intro-caption-xxlg .intro-title {
|
||
|
|
font-size: 110px;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.intro-caption-xxlg .intro-subtitle {
|
||
|
|
margin: 15px 0 0 0;
|
||
|
|
font-size: 28px;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.intro-caption-xxlg .intro-description {
|
||
|
|
font-size: 20px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
#tt-intro .intro-caption.intro-caption-xxlg .intro-title {
|
||
|
|
font-size: 78px;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.intro-caption-xxlg .intro-description {
|
||
|
|
font-size: 18px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
#tt-intro .intro-caption.intro-caption-xxlg .intro-title {
|
||
|
|
font-size: 48px;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.intro-caption-xxlg .intro-subtitle {
|
||
|
|
font-size: 24px;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.intro-caption-xxlg .intro-description {
|
||
|
|
font-size: 18px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Intro caption positions
|
||
|
|
=========================== */
|
||
|
|
/* position top */
|
||
|
|
#tt-intro .intro-caption.top-left {
|
||
|
|
top: 10%;
|
||
|
|
left: 5%;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.top-center {
|
||
|
|
top: 10%;
|
||
|
|
left: 50%;
|
||
|
|
width: 100% !important;
|
||
|
|
max-width: 800px !important;
|
||
|
|
padding: 0 15px;
|
||
|
|
text-align: center;
|
||
|
|
-moz-transform: translateX(-50%) !important;
|
||
|
|
-ms-transform: translateX(-50%) !important;
|
||
|
|
-webkit-transform: translateX(-50%) !important;
|
||
|
|
transform: translateX(-50%) !important;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.top-right {
|
||
|
|
top: 10%;
|
||
|
|
right: 5%;
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* position center */
|
||
|
|
#tt-intro .intro-caption.center-left {
|
||
|
|
top: 50%;
|
||
|
|
left: 13%;
|
||
|
|
margin-right: 5%;
|
||
|
|
text-align: left;
|
||
|
|
-moz-transform: translateY(-50%) !important;
|
||
|
|
-ms-transform: translateY(-50%) !important;
|
||
|
|
-webkit-transform: translateY(-50%) !important;
|
||
|
|
transform: translateY(-50%) !important;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
#tt-intro .intro-caption.center-left {
|
||
|
|
left: 10%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.center {
|
||
|
|
top: 50%;
|
||
|
|
left: 50%;
|
||
|
|
width: 100% !important;
|
||
|
|
max-width: 800px;
|
||
|
|
padding: 0 15px;
|
||
|
|
text-align: center;
|
||
|
|
-moz-transform: translate(-50%, -50%) !important;
|
||
|
|
-ms-transform: translate(-50%, -50%) !important;
|
||
|
|
-webkit-transform: translate(-50%, -50%) !important;
|
||
|
|
transform: translate(-50%, -50%) !important;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.center-right {
|
||
|
|
top: 50%;
|
||
|
|
right: 13%;
|
||
|
|
margin-left: 5%;
|
||
|
|
text-align: right;
|
||
|
|
-moz-transform: translateY(-50%) !important;
|
||
|
|
-ms-transform: translateY(-50%) !important;
|
||
|
|
-webkit-transform: translateY(-50%) !important;
|
||
|
|
transform: translateY(-50%) !important;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
#tt-intro .intro-caption.center-right {
|
||
|
|
right: 10%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* position bottom */
|
||
|
|
#tt-intro .intro-caption.bottom-left {
|
||
|
|
bottom: 10%;
|
||
|
|
left: 5%;
|
||
|
|
margin-right: 5%;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
#tt-intro .intro-caption.bottom-left {
|
||
|
|
bottom: 45px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.bottom-center {
|
||
|
|
bottom: 10%;
|
||
|
|
left: 50%;
|
||
|
|
width: 100% !important;
|
||
|
|
max-width: 800px;
|
||
|
|
padding: 0 15px;
|
||
|
|
text-align: center;
|
||
|
|
-moz-transform: translateX(-50%) !important;
|
||
|
|
-ms-transform: translateX(-50%) !important;
|
||
|
|
-webkit-transform: translateX(-50%) !important;
|
||
|
|
transform: translateX(-50%) !important;
|
||
|
|
}
|
||
|
|
#tt-intro .intro-caption.bottom-right {
|
||
|
|
bottom: 10%;
|
||
|
|
left: auto;
|
||
|
|
right: 5%;
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Intro caption animated (for content carousel)
|
||
|
|
================================================= */
|
||
|
|
#tt-intro .owl-carousel .intro-caption.caption-animate {
|
||
|
|
opacity: 0;
|
||
|
|
-webkit-transition: all 0.4s ease-in-out;
|
||
|
|
-moz-transition: all 0.4s ease-in-out;
|
||
|
|
-o-transition: all 0.4s ease-in-out;
|
||
|
|
-ms-transition: all 0.4s ease-in-out;
|
||
|
|
transition: all 0.4s ease-in-out;
|
||
|
|
|
||
|
|
-webkit-transform: translateY(10px);
|
||
|
|
-moz-transform: translateY(10px);
|
||
|
|
-o-transform: translateY(10px);
|
||
|
|
-ms-transform: translateY(10px);
|
||
|
|
transform: translateY(10px);
|
||
|
|
}
|
||
|
|
#tt-intro .owl-carousel .owl-item.active .intro-caption.caption-animate {
|
||
|
|
opacity: 1;
|
||
|
|
-webkit-transform: translateY(0);
|
||
|
|
-moz-transform: translatey(0);
|
||
|
|
-o-transform: translateY(0);
|
||
|
|
-ms-transform: translateY(0);
|
||
|
|
transform: translateY(0);
|
||
|
|
|
||
|
|
-webkit-transition-delay: 0.5s;
|
||
|
|
-moz-transition-delay: 0.5s;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* --------------------------------------------------- *
|
||
|
|
* Isotope (more info: http://isotope.metafizzy.co/)
|
||
|
|
/* --------------------------------------------------- */
|
||
|
|
|
||
|
|
.isotope-wrap {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.isotope {
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* isotope top content
|
||
|
|
======================= */
|
||
|
|
.isotope-top-content {
|
||
|
|
position: relative;
|
||
|
|
padding: 50px 3% 50px 3%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if gutter enabled */
|
||
|
|
.isotope.gutter-1 .isotope-top-content {
|
||
|
|
margin-left: 6px;
|
||
|
|
}
|
||
|
|
.isotope.gutter-2 .isotope-top-content {
|
||
|
|
margin-left: 1.5%;
|
||
|
|
}
|
||
|
|
.isotope.gutter-3 .isotope-top-content {
|
||
|
|
margin-left: 2.5%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if boxed layout enabled */
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope-top-content {
|
||
|
|
padding-left: 0;
|
||
|
|
padding-right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ================
|
||
|
|
isotope filter
|
||
|
|
=================== */
|
||
|
|
|
||
|
|
.isotope-filter {
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.isotope-filter {
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope filter links */
|
||
|
|
ul.isotope-filter-links {
|
||
|
|
list-style: none;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
ul.isotope-filter-links > li {
|
||
|
|
display: inline-block;
|
||
|
|
margin: 0 8px;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
ul.isotope-filter-links > li {
|
||
|
|
margin-top: 5px;
|
||
|
|
margin-bottom: 5px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
ul.isotope-filter-links > li:first-child {
|
||
|
|
margin-left: 0;
|
||
|
|
}
|
||
|
|
ul.isotope-filter-links > li:last-child {
|
||
|
|
margin-right: 0;
|
||
|
|
}
|
||
|
|
ul.isotope-filter-links > li > a {
|
||
|
|
position: relative;
|
||
|
|
display: block;
|
||
|
|
padding: 5px 0;
|
||
|
|
font-size: 16px;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
ul.isotope-filter-links > li > a:after {
|
||
|
|
position: absolute;
|
||
|
|
content: "";
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
width: 0;
|
||
|
|
height: 3px;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
ul.isotope-filter-links > li > a:hover:after,
|
||
|
|
ul.isotope-filter-links > li > a.active:after {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* isotope filter aligns */
|
||
|
|
.isotope-filter.fi-center {
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.isotope-filter.fi-right {
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.isotope-filter.fi-right {
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* change isotope filter to button (use class "fi-to-button")
|
||
|
|
============================================================== */
|
||
|
|
.isotope-filter.fi-to-button {
|
||
|
|
position: absolute;
|
||
|
|
top: 50px;
|
||
|
|
left: 3%;
|
||
|
|
right: auto;
|
||
|
|
z-index: 9998;
|
||
|
|
padding: 0 !important;
|
||
|
|
margin: 0 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.isotope.gutter-1 .isotope-filter.fi-to-button {
|
||
|
|
top: 60px;
|
||
|
|
}
|
||
|
|
.isotope.gutter-2 .isotope-filter.fi-to-button {
|
||
|
|
top: 80px;
|
||
|
|
}
|
||
|
|
.isotope.gutter-3 .isotope-filter.fi-to-button {
|
||
|
|
top: 100px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope filter button */
|
||
|
|
.isotope-filter-button {
|
||
|
|
position: relative;
|
||
|
|
display: none;
|
||
|
|
width: 55px;
|
||
|
|
height: 55px;
|
||
|
|
line-height: 57px;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 19px;
|
||
|
|
color: #FFF;
|
||
|
|
cursor: pointer;
|
||
|
|
z-index: 2;
|
||
|
|
border-radius: 60px;
|
||
|
|
-webkit-box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.25);
|
||
|
|
-moz-box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.25);
|
||
|
|
box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.25);
|
||
|
|
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.isotope-filter.fi-to-button .isotope-filter-button {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
.isotope-filter.fi-to-button:hover .isotope-filter-button,
|
||
|
|
.isotope-filter.fi-to-button:focus .isotope-filter-button {
|
||
|
|
color: #FFF;
|
||
|
|
-webkit-box-shadow: 0 4px 6px -2px rgba(0, 0, 0, 0.46);
|
||
|
|
-moz-box-shadow: 0 4px 6px -2px rgba(0, 0, 0, 0.46);
|
||
|
|
box-shadow: 0 4px 6px -2px rgba(0, 0, 0, 0.46);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope filter button icons */
|
||
|
|
.isotope-filter-button .ifb-icon-close {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.isotope-filter-button .ifb-icon-close,
|
||
|
|
.isotope-filter.fi-to-button.iso-filter-open .isotope-filter-button .ifb-icon {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
.isotope-filter.fi-to-button.iso-filter-open .isotope-filter-button .ifb-icon-close {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope filter links */
|
||
|
|
.isotope-filter.fi-to-button ul.isotope-filter-links {
|
||
|
|
position: absolute;
|
||
|
|
top: 100%;
|
||
|
|
left: 0;
|
||
|
|
min-width: 160px;
|
||
|
|
list-style: none;
|
||
|
|
background-color: #111;
|
||
|
|
padding: 25px 0 15px 0;
|
||
|
|
margin: -25px 0 0 0;
|
||
|
|
text-align: left;
|
||
|
|
z-index: 1;
|
||
|
|
visibility: hidden;
|
||
|
|
opacity: 0;
|
||
|
|
-webkit-box-shadow: 0 7px 5px -6px rgba(0, 0, 0, 0.15);
|
||
|
|
-moz-box-shadow: 0 7px 5px -6px rgba(0, 0, 0, 0.15);
|
||
|
|
box-shadow: 0 7px 5px -6px rgba(0, 0, 0, 0.15);
|
||
|
|
|
||
|
|
-moz-transform: translateY(5px);
|
||
|
|
-ms-transform: translateY(5px);
|
||
|
|
-webkit-transform: translateY(5px);
|
||
|
|
transform: translateY(5px);
|
||
|
|
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.isotope-filter.fi-to-button ul.isotope-filter-links {
|
||
|
|
top: auto !important;
|
||
|
|
bottom: 100% !important;
|
||
|
|
left: auto !important;
|
||
|
|
right: 0 !important;
|
||
|
|
padding: 15px 0 30px 0 !important;
|
||
|
|
margin: 0 0 -30px 0 !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.isotope-filter.fi-to-button.iso-filter-open ul.isotope-filter-links {
|
||
|
|
visibility: visible;
|
||
|
|
opacity: 1;
|
||
|
|
-moz-transform: translateY(0);
|
||
|
|
-ms-transform: translateY(0);
|
||
|
|
-webkit-transform: translateY(0);
|
||
|
|
transform: translateY(0);
|
||
|
|
|
||
|
|
-webkit-transition-delay: 0.1s;
|
||
|
|
-moz-transition-delay: 0.1s;
|
||
|
|
transition-delay: 0.1s;
|
||
|
|
}
|
||
|
|
.isotope-filter.fi-to-button ul.isotope-filter-links > li {
|
||
|
|
display: block;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0 20px;
|
||
|
|
line-height: 1.2;
|
||
|
|
}
|
||
|
|
.isotope-filter.fi-to-button ul.isotope-filter-links > li > a {
|
||
|
|
display: block;
|
||
|
|
padding: 8px 0;
|
||
|
|
font-size: 15px;
|
||
|
|
color: #DDD;
|
||
|
|
}
|
||
|
|
.isotope-filter.fi-to-button ul.isotope-filter-links > li > a:after,
|
||
|
|
.isotope-filter.fi-to-button ul.isotope-filter-links > li > a.active:after {
|
||
|
|
content: none;
|
||
|
|
}
|
||
|
|
.isotope-filter.fi-to-button ul.isotope-filter-links > li > a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.isotope-filter.fi-to-button ul.isotope-filter-links > li > a.active {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope filter aligns */
|
||
|
|
.isotope-filter.fi-to-button.fi-right {
|
||
|
|
left: auto;
|
||
|
|
right: 3%;
|
||
|
|
}
|
||
|
|
.isotope-filter.fi-to-button.fi-right ul.isotope-filter-links {
|
||
|
|
left: auto;
|
||
|
|
right: 0;
|
||
|
|
padding: 15px 0;
|
||
|
|
margin: -27px 0 0 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if ".isotope-top-content" contains class "fi-to-button-on" */
|
||
|
|
.isotope-top-content.fi-to-button-on {
|
||
|
|
margin-top: 0 !important;
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.isotope.gutter-1 .isotope-top-content.fi-to-button-on {
|
||
|
|
padding-top: 6px;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
.isotope.gutter-2 .isotope-top-content.fi-to-button-on {
|
||
|
|
padding-top: 1.5%;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
.isotope.gutter-3 .isotope-top-content.fi-to-button-on {
|
||
|
|
padding-top: 2.5%;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if page header enabled */
|
||
|
|
body.page-header-on .isotope-filter.fi-to-button,
|
||
|
|
body.page-header-on .isotope.gutter-1 .isotope-filter.fi-to-button,
|
||
|
|
body.page-header-on .isotope.gutter-2 .isotope-filter.fi-to-button,
|
||
|
|
body.page-header-on .isotope.gutter-3 .isotope-filter.fi-to-button {
|
||
|
|
top: -28px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if page boxed layout enabled */
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope-filter.fi-to-button {
|
||
|
|
left: 0;
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope-filter.fi-to-button.fi-right {
|
||
|
|
left: auto;
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 768px) {
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope-top-content.fi-to-button-on,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-1 .isotope-top-content.fi-to-button-on,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-2 .isotope-top-content.fi-to-button-on,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-3 .isotope-top-content.fi-to-button-on {
|
||
|
|
padding-top: 50px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope-filter.fi-to-button,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-1 .isotope-filter.fi-to-button,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-2 .isotope-filter.fi-to-button,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-3 .isotope-filter.fi-to-button {
|
||
|
|
top: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
body.tt-boxed.page-header-on .isotope-wrap.tt-wrap .isotope-top-content.fi-to-button-on {
|
||
|
|
padding-top: 40px;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
body.tt-boxed.page-header-on .isotope-wrap.tt-wrap .isotope.gutter-1 .isotope-top-content.fi-to-button-on {
|
||
|
|
padding-top: 40px;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
body.tt-boxed.page-header-on .isotope-wrap.tt-wrap .isotope.gutter-2 .isotope-top-content.fi-to-button-on {
|
||
|
|
padding-top: 40px;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
body.tt-boxed.page-header-on .isotope-wrap.tt-wrap .isotope.gutter-3 .isotope-top-content.fi-to-button-on {
|
||
|
|
padding-top: 40px;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* move "fi-to-button" to bottom on small screens
|
||
|
|
================================================== */
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.isotope-filter.fi-to-button,
|
||
|
|
|
||
|
|
body.page-header-on .isotope-filter.fi-to-button,
|
||
|
|
body.page-header-on .isotope.gutter-1 .isotope-filter.fi-to-button,
|
||
|
|
body.page-header-on .isotope.gutter-2 .isotope-filter.fi-to-button,
|
||
|
|
body.page-header-on .isotope.gutter-3 .isotope-filter.fi-to-button,
|
||
|
|
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope-filter.fi-to-button,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-1 .isotope-filter.fi-to-button,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-2 .isotope-filter.fi-to-button,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-3 .isotope-filter.fi-to-button {
|
||
|
|
position: fixed;
|
||
|
|
top: auto !important;
|
||
|
|
bottom: 15px !important;
|
||
|
|
left: auto !important;
|
||
|
|
right: 15px !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ====================
|
||
|
|
isotope items wrap
|
||
|
|
======================= */
|
||
|
|
.isotope-items-wrap {
|
||
|
|
-webkit-transition: all 0.6s ease-in-out;
|
||
|
|
-moz-transition: all 0.6s ease-in-out;
|
||
|
|
-o-transition: all 0.6s ease-in-out;
|
||
|
|
-ms-transition: all 0.6s ease-in-out;
|
||
|
|
transition: all 0.6s ease-in-out;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope items wrap (if gutter enabled) */
|
||
|
|
.isotope.gutter-1 .isotope-items-wrap {
|
||
|
|
margin-top: 6px;
|
||
|
|
margin-left: 6px;
|
||
|
|
margin-right: 6px;
|
||
|
|
}
|
||
|
|
.isotope.gutter-2 .isotope-items-wrap {
|
||
|
|
margin-top: 1.5%;
|
||
|
|
margin-left: 1.5%;
|
||
|
|
margin-right: 1.5%;
|
||
|
|
}
|
||
|
|
.isotope.gutter-3 .isotope-items-wrap {
|
||
|
|
margin-top: 2.5%;
|
||
|
|
margin-left: 2.5%;
|
||
|
|
margin-right: 2.5%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if boxed layout enabled */
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope-items-wrap,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-3 .isotope-items-wrap {
|
||
|
|
margin-top: 40px;
|
||
|
|
margin-left: 0;
|
||
|
|
margin-right: 0;
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope-items-wrap,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-3 .isotope-items-wrap {
|
||
|
|
margin-top: 20px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if "isotope-top-content" exist */
|
||
|
|
body.iso-top-content-on .isotope .isotope-items-wrap {
|
||
|
|
margin-top: 0 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* isotope item
|
||
|
|
================ */
|
||
|
|
.isotope-item {
|
||
|
|
float: left;
|
||
|
|
width: 25%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope last item (it makes last item to 100% wide). Class: "iso-last-item" */
|
||
|
|
@media (max-width : 991px) {
|
||
|
|
.isotope-item.iso-last-item {
|
||
|
|
width: 100% !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* isotope item heights
|
||
|
|
======================== */
|
||
|
|
/* isotope item height-1 (use class "iso-height-1") */
|
||
|
|
.isotope-item.iso-height-1 > div,
|
||
|
|
.isotope-item.iso-height-1 > a,
|
||
|
|
.isotope-item.iso-height-1 > article {
|
||
|
|
display: block;
|
||
|
|
padding-bottom: 70%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope item height-2 (use class "iso-height-2") */
|
||
|
|
.isotope-item.iso-height-2 > div,
|
||
|
|
.isotope-item.iso-height-2 > a,
|
||
|
|
.isotope-item.iso-height-2 > article {
|
||
|
|
display: block;
|
||
|
|
padding-bottom: 140%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope item height-2 if "gutter-1" enabled */
|
||
|
|
.isotope.col-2.gutter-1 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-2.gutter-1 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-2.gutter-1 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 140.6%;
|
||
|
|
}
|
||
|
|
.isotope.col-3.gutter-1 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-3.gutter-1 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-3.gutter-1 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 140.9%;
|
||
|
|
}
|
||
|
|
.isotope.col-4.gutter-1 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-4.gutter-1 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-4.gutter-1 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 141.4%;
|
||
|
|
}
|
||
|
|
.isotope.col-5.gutter-1 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-5.gutter-1 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-5.gutter-1 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 141.4%;
|
||
|
|
}
|
||
|
|
.isotope.col-6.gutter-1 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-6.gutter-1 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-6.gutter-1 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 141.8%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope item height-2 if "gutter-2" enabled */
|
||
|
|
.isotope.col-2.gutter-2 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-2.gutter-2 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-2.gutter-2 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 143.1%;
|
||
|
|
}
|
||
|
|
.isotope.col-3.gutter-2 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-3.gutter-2 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-3.gutter-2 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 144.7%;
|
||
|
|
}
|
||
|
|
.isotope.col-4.gutter-2 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-4.gutter-2 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-4.gutter-2 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 146.2%;
|
||
|
|
}
|
||
|
|
.isotope.col-5.gutter-2 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-5.gutter-2 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-5.gutter-2 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 148%;
|
||
|
|
}
|
||
|
|
.isotope.col-6.gutter-2 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-6.gutter-2 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-6.gutter-2 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 150%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope item height-2 if "gutter-3" enabled */
|
||
|
|
.isotope.col-2.gutter-3 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-2.gutter-3 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-2.gutter-3 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 145.2%;
|
||
|
|
}
|
||
|
|
.isotope.col-3.gutter-3 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-3.gutter-3 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-3.gutter-3 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 148%;
|
||
|
|
}
|
||
|
|
.isotope.col-4.gutter-3 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-4.gutter-3 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-4.gutter-3 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 150.9%;
|
||
|
|
}
|
||
|
|
.isotope.col-5.gutter-3 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-5.gutter-3 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-5.gutter-3 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 154%;
|
||
|
|
}
|
||
|
|
.isotope.col-6.gutter-3 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-6.gutter-3 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-6.gutter-3 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 158%;
|
||
|
|
}
|
||
|
|
@media (max-width : 1600px) {
|
||
|
|
/* isotope item height-2 if "gutter-2" enabled */
|
||
|
|
.isotope.col-5.gutter-2 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-5.gutter-2 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-5.gutter-2 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 146.2%;
|
||
|
|
}
|
||
|
|
.isotope.col-6.gutter-2 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-6.gutter-2 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-6.gutter-2 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 146.4%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope item height-2 if "gutter-3" enabled */
|
||
|
|
.isotope.col-5.gutter-3 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-5.gutter-3 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-5.gutter-3 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 151%;
|
||
|
|
}
|
||
|
|
.isotope.col-6.gutter-3 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-6.gutter-3 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-6.gutter-3 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 151%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
/* isotope item height-2 if "gutter-2" enabled */
|
||
|
|
.isotope.col-5.gutter-2 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-5.gutter-2 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-5.gutter-2 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 143%;
|
||
|
|
}
|
||
|
|
.isotope.col-6.gutter-2 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-6.gutter-2 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-6.gutter-2 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 143%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope item height-2 if "gutter-3" enabled */
|
||
|
|
.isotope.col-3.gutter-3 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-3.gutter-3 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-3.gutter-3 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 145.1%;
|
||
|
|
}
|
||
|
|
.isotope.col-4.gutter-3 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-4.gutter-3 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-4.gutter-3 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 145.1%;
|
||
|
|
}
|
||
|
|
.isotope.col-5.gutter-3 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-5.gutter-3 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-5.gutter-3 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 145.1%;
|
||
|
|
}
|
||
|
|
.isotope.col-6.gutter-3 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-6.gutter-3 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-6.gutter-3 .isotope-item.iso-height-2 > article {
|
||
|
|
padding-bottom: 145.1%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope col-1 if "iso-height-1" enabled */
|
||
|
|
.isotope.col-1 .isotope-item.iso-height-1 > div,
|
||
|
|
.isotope.col-1 .isotope-item.iso-height-1 > a,
|
||
|
|
.isotope.col-1 .isotope-item.iso-height-1 > article {
|
||
|
|
display: block;
|
||
|
|
padding-bottom: 30%;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.isotope.col-1 .isotope-item.iso-height-1 > div,
|
||
|
|
.isotope.col-1 .isotope-item.iso-height-1 > a,
|
||
|
|
.isotope.col-1 .isotope-item.iso-height-1 > article {
|
||
|
|
padding-bottom: 48%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
/* isotope col-1 if "iso-height-2" enabled */
|
||
|
|
.isotope.col-1 .isotope-item.iso-height-2 > div,
|
||
|
|
.isotope.col-1 .isotope-item.iso-height-2 > a,
|
||
|
|
.isotope.col-1 .isotope-item.iso-height-2 > article {
|
||
|
|
display: block;
|
||
|
|
padding-bottom: 48%;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* isotope gutter (add more space between isotope items)
|
||
|
|
=========================================================*/
|
||
|
|
/* gutter-1 */
|
||
|
|
.isotope.gutter-1 .isotope-item { padding: 0 0 6px 6px; }
|
||
|
|
.isotope.gutter-1 { margin-left: -6px; }
|
||
|
|
|
||
|
|
/* gutter-2 */
|
||
|
|
.isotope.gutter-2 .isotope-item { padding: 0 0 1.5% 1.5%; }
|
||
|
|
.isotope.gutter-2 { margin-left: -1.5%; }
|
||
|
|
|
||
|
|
/* gutter-3 */
|
||
|
|
.isotope.gutter-3 .isotope-item { padding: 0 0 2.5% 2.5%; }
|
||
|
|
.isotope.gutter-3 { margin-left: -2.5%; }
|
||
|
|
|
||
|
|
|
||
|
|
/* isotope columns
|
||
|
|
=================== */
|
||
|
|
.isotope.col-1 .isotope-item {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
.isotope.col-2 .isotope-item {
|
||
|
|
width: 50%;
|
||
|
|
}
|
||
|
|
.isotope.col-3 .isotope-item {
|
||
|
|
width: 33.33333333%;
|
||
|
|
}
|
||
|
|
.isotope.col-4 .isotope-item {
|
||
|
|
width: 25%;
|
||
|
|
}
|
||
|
|
.isotope.col-5 .isotope-item {
|
||
|
|
width: 20%;
|
||
|
|
}
|
||
|
|
.isotope.col-6 .isotope-item {
|
||
|
|
width: 16.66666666666667%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope grid sizer */
|
||
|
|
.grid-sizer {
|
||
|
|
width: 25%;
|
||
|
|
}
|
||
|
|
.isotope.col-1 .grid-sizer {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
.isotope.col-2 .grid-sizer {
|
||
|
|
width: 50%;
|
||
|
|
}
|
||
|
|
.isotope.col-3 .grid-sizer {
|
||
|
|
width: 33.33333333%;
|
||
|
|
}
|
||
|
|
.isotope.col-4 .grid-sizer {
|
||
|
|
width: 25%;
|
||
|
|
}
|
||
|
|
.isotope.col-5 .grid-sizer {
|
||
|
|
width: 20%;
|
||
|
|
}
|
||
|
|
.isotope.col-6 .grid-sizer {
|
||
|
|
width: 16.66666666666667%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope item width (alternative width) */
|
||
|
|
.isotope.col-2 .width-2 { width: 100%; }
|
||
|
|
.isotope.col-3 .width-2 { width: 66.66666666%; }
|
||
|
|
.isotope.col-4 .width-2 { width: 50%; }
|
||
|
|
.isotope.col-5 .width-2 { width: 40%; }
|
||
|
|
.isotope.col-6 .width-2 { width: 33.33333333%; }
|
||
|
|
|
||
|
|
|
||
|
|
/* isotope columns on smaller screens
|
||
|
|
====================================== */
|
||
|
|
@media (max-width : 1600px) {
|
||
|
|
.isotope.col-5 .isotope-item,
|
||
|
|
.isotope.col-6 .isotope-item,
|
||
|
|
|
||
|
|
.isotope.col-5 .grid-sizer,
|
||
|
|
.isotope.col-6 .grid-sizer {
|
||
|
|
width: 25%;
|
||
|
|
}
|
||
|
|
.isotope.col-5 .width-2,
|
||
|
|
.isotope.col-6 .width-2 {
|
||
|
|
width: 50%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (max-width : 1200px) {
|
||
|
|
.isotope.col-4 .isotope-item,
|
||
|
|
.isotope.col-5 .isotope-item,
|
||
|
|
.isotope.col-6 .isotope-item,
|
||
|
|
|
||
|
|
.isotope.col-4 .grid-sizer,
|
||
|
|
.isotope.col-5 .grid-sizer,
|
||
|
|
.isotope.col-6 .grid-sizer {
|
||
|
|
width: 33.33333333%;
|
||
|
|
}
|
||
|
|
.isotope.col-4 .width-2,
|
||
|
|
.isotope.col-5 .width-2,
|
||
|
|
.isotope.col-6 .width-2 {
|
||
|
|
width: 66.66666666%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (max-width : 991px) {
|
||
|
|
.isotope.col-3 .isotope-item,
|
||
|
|
.isotope.col-4 .isotope-item,
|
||
|
|
.isotope.col-5 .isotope-item,
|
||
|
|
.isotope.col-6 .isotope-item,
|
||
|
|
|
||
|
|
.isotope.col-3 .grid-sizer,
|
||
|
|
.isotope.col-4 .grid-sizer,
|
||
|
|
.isotope.col-5 .grid-sizer,
|
||
|
|
.isotope.col-6 .grid-sizer,
|
||
|
|
|
||
|
|
.isotope.col-3 .width-2,
|
||
|
|
.isotope.col-4 .width-2,
|
||
|
|
.isotope.col-5 .width-2,
|
||
|
|
.isotope.col-6 .width-2 {
|
||
|
|
width: 50%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (max-width : 480px) {
|
||
|
|
.isotope.col-2 .isotope-item,
|
||
|
|
.isotope.col-3 .isotope-item,
|
||
|
|
.isotope.col-4 .isotope-item,
|
||
|
|
.isotope.col-5 .isotope-item,
|
||
|
|
.isotope.col-6 .isotope-item {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* isotope pagination
|
||
|
|
====================== */
|
||
|
|
.isotope-pagination {
|
||
|
|
padding-top: 60px;
|
||
|
|
padding-bottom: 60px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.isotope.gutter-1 .isotope-pagination {
|
||
|
|
margin-left: 6px;
|
||
|
|
}
|
||
|
|
.isotope.gutter-2 .isotope-pagination {
|
||
|
|
margin-left: 1.5%;
|
||
|
|
}
|
||
|
|
.isotope.gutter-3 .isotope-pagination {
|
||
|
|
margin-left: 2.5%;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* if isotope item contains content carousel
|
||
|
|
============================================= */
|
||
|
|
.isotope-item.iso-height-1 .iso-carousel-wrap,
|
||
|
|
.isotope-item.iso-height-2 .iso-carousel-wrap {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.isotope-item.iso-height-1 .owl-carousel,
|
||
|
|
.isotope-item.iso-height-2 .owl-carousel {
|
||
|
|
position: absolute;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
.isotope-item .owl-stage-outer,
|
||
|
|
.isotope-item .owl-stage,
|
||
|
|
.isotope-item .owl-item,
|
||
|
|
.isotope-item .cc-item {
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Gallery list section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#gallery-list-section {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Gallery list item
|
||
|
|
===================== */
|
||
|
|
.gallery-list-item {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.gallery-list-item {
|
||
|
|
margin-bottom: 30px;
|
||
|
|
}
|
||
|
|
.iso-height-1 .gallery-list-item,
|
||
|
|
.iso-height-2 .gallery-list-item {
|
||
|
|
margin-bottom: 90px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery list item if isotope gutters enabled */
|
||
|
|
.isotope.gutter-2 .gallery-list-item {
|
||
|
|
margin-bottom: 10px;
|
||
|
|
}
|
||
|
|
.isotope.gutter-3 .gallery-list-item {
|
||
|
|
margin-bottom: 0;
|
||
|
|
}
|
||
|
|
.isotope.gutter-2 .iso-height-1 .gallery-list-item,
|
||
|
|
.isotope.gutter-2 .iso-height-2 .gallery-list-item {
|
||
|
|
margin-bottom: 70px;
|
||
|
|
}
|
||
|
|
.isotope.gutter-3 .iso-height-1 .gallery-list-item,
|
||
|
|
.isotope.gutter-3 .iso-height-2 .gallery-list-item {
|
||
|
|
margin-bottom: 55px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery list item image */
|
||
|
|
.gallery-list-item .gl-item-image-wrap {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-list-item .gl-item-image-inner {
|
||
|
|
display: block;
|
||
|
|
position: relative;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
.gallery-list-item .gl-item-image-inner:before {
|
||
|
|
position: absolute;
|
||
|
|
content: "";
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
background-color: transparent;
|
||
|
|
z-index: 2;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.gallery-list-item .gl-item-image-inner:hover:before {
|
||
|
|
background-color: #FFF;
|
||
|
|
opacity: .85;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-list-item .gl-item-image {
|
||
|
|
}
|
||
|
|
.gallery-list-item .gl-item-image-inner img {
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-list-item .gl-item-image-zoom,
|
||
|
|
.gallery-list-item .gl-item-image-lock {
|
||
|
|
position: absolute;
|
||
|
|
right: 20px;
|
||
|
|
bottom: -20px;
|
||
|
|
width: 25px;
|
||
|
|
height: 25px;
|
||
|
|
opacity: 0;
|
||
|
|
z-index: 4;
|
||
|
|
font-size: 24px;
|
||
|
|
color: #222;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gallery-list-item .gl-item-image-zoom,
|
||
|
|
.gallery-list-item .gl-item-image-lock {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.gallery-list-item .gl-item-image-zoom:hover {
|
||
|
|
-webkit-transform: rotate(90deg);
|
||
|
|
-moz-transform: rotate(90deg);
|
||
|
|
-o-transform: rotate(90deg);
|
||
|
|
-ms-transform: rotate(90deg);
|
||
|
|
transform: rotate(90deg);
|
||
|
|
}
|
||
|
|
.gallery-list-item .gl-item-image-zoom:before,
|
||
|
|
.gallery-list-item .gl-item-image-zoom:after {
|
||
|
|
content: '';
|
||
|
|
position: absolute;
|
||
|
|
background-color: #111;
|
||
|
|
}
|
||
|
|
.gallery-list-item .gl-item-image-zoom:before {
|
||
|
|
left: 0;
|
||
|
|
top: 11px;
|
||
|
|
width: 100%;
|
||
|
|
height: 3px;
|
||
|
|
}
|
||
|
|
.gallery-list-item .gl-item-image-zoom:after {
|
||
|
|
left: 11px;
|
||
|
|
top: 0;
|
||
|
|
width: 3px;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
.gallery-list-item .gl-item-image-inner:hover .gl-item-image-zoom,
|
||
|
|
.gallery-list-item .gl-item-image-inner:hover .gl-item-image-lock {
|
||
|
|
bottom: 20px;
|
||
|
|
opacity: 1;
|
||
|
|
-webkit-transition-delay: 0.2s;
|
||
|
|
-moz-transition-delay: 0.2s;
|
||
|
|
transition-delay: 0.2s;
|
||
|
|
}
|
||
|
|
.gallery-list-item .gl-item-image-inner:hover .gl-item-image-zoom:hover {
|
||
|
|
-webkit-transition-delay: 0s;
|
||
|
|
-moz-transition-delay: 0s;
|
||
|
|
transition-delay: 0s;
|
||
|
|
}
|
||
|
|
|
||
|
|
.iso-height-1 .gallery-list-item .gl-item-image-wrap,
|
||
|
|
.iso-height-2 .gallery-list-item .gl-item-image-wrap,
|
||
|
|
.iso-height-1 .gallery-list-item .gl-item-image-inner,
|
||
|
|
.iso-height-2 .gallery-list-item .gl-item-image-inner,
|
||
|
|
.iso-height-1 .gallery-list-item .gl-item-image,
|
||
|
|
.iso-height-2 .gallery-list-item .gl-item-image {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
.gallery-list-item .gl-item-image,
|
||
|
|
.iso-height-1 .gallery-list-item .gl-item-image,
|
||
|
|
.iso-height-2 .gallery-list-item .gl-item-image {
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.gallery-list-item .gl-item-image-inner:hover .gl-item-image,
|
||
|
|
.iso-height-1 .gallery-list-item .gl-item-image-inner:hover .gl-item-image,
|
||
|
|
.iso-height-2 .gallery-list-item .gl-item-image-inner:hover .gl-item-image {
|
||
|
|
-webkit-transform: scale(1.07);
|
||
|
|
-moz-transform: scale(1.07);
|
||
|
|
-o-transform: scale(1.07);
|
||
|
|
-ms-transform: scale(1.07);
|
||
|
|
transform: scale(1.07);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery list item info */
|
||
|
|
.gl-item-info {
|
||
|
|
position: relative;
|
||
|
|
width: 100%;
|
||
|
|
height: 55px;
|
||
|
|
line-height: 1.4;
|
||
|
|
padding: 15px 75px 0 20px;
|
||
|
|
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
@media (max-width: 480px) {
|
||
|
|
.gl-item-info {
|
||
|
|
padding-left: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.iso-height-1 .gl-item-info,
|
||
|
|
.iso-height-2 .gl-item-info {
|
||
|
|
position: absolute;
|
||
|
|
left: 0;
|
||
|
|
top: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery list item info if isotope gutters enabled */
|
||
|
|
@media (min-width: 768px) {
|
||
|
|
.isotope.gutter-2 .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gl-item-info {
|
||
|
|
padding-left: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery list item title */
|
||
|
|
.gl-item-title {
|
||
|
|
margin: 0;
|
||
|
|
color: #333;
|
||
|
|
font-size: 18px;
|
||
|
|
font-weight: 500;
|
||
|
|
line-height: 1.2;
|
||
|
|
overflow: hidden;
|
||
|
|
white-space: nowrap;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
}
|
||
|
|
.gl-item-title a {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.gl-item-title a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery list item category */
|
||
|
|
.gl-item-category {
|
||
|
|
display: block;
|
||
|
|
margin-top: 6px;
|
||
|
|
font-size: 13px;
|
||
|
|
color: #AAA;
|
||
|
|
}
|
||
|
|
.gl-item-category a {
|
||
|
|
color: #AAA;
|
||
|
|
}
|
||
|
|
.gl-item-category a:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery list item meta */
|
||
|
|
.gli-meta {
|
||
|
|
position: absolute;
|
||
|
|
display: inline-block;
|
||
|
|
bottom: -36px;
|
||
|
|
right: 20px;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #a7a7a7;
|
||
|
|
z-index: 9;
|
||
|
|
}
|
||
|
|
@media (max-width: 480px) {
|
||
|
|
.gli-meta {
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.gli-meta > li {
|
||
|
|
display: inline-block;
|
||
|
|
margin-left: 5px;
|
||
|
|
}
|
||
|
|
.gli-meta > li a {
|
||
|
|
font-size: 14px;
|
||
|
|
color: #a7a7a7;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery list item meta if isotope gutters enabled */
|
||
|
|
.isotope.gutter-2 .gli-meta,
|
||
|
|
.isotope.gutter-3 .gli-meta {
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Gallery list item alter styles
|
||
|
|
================================== */
|
||
|
|
/* alter style 1 */
|
||
|
|
.gli-alter-1 .gallery-list-item,
|
||
|
|
.isotope.gutter-2 .gli-alter-1 .gallery-list-item,
|
||
|
|
.isotope.gutter-3 .gli-alter-1 .gallery-list-item {
|
||
|
|
margin-bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-1 .gallery-list-item .gl-item-image-inner:before,
|
||
|
|
.gli-alter-1 .gallery-list-item .gl-item-image-inner:hover:before {
|
||
|
|
content: none;
|
||
|
|
}
|
||
|
|
.gli-alter-1 .gallery-list-item .gl-item-image,
|
||
|
|
.gli-alter-1 .iso-height-1 .gallery-list-item .gl-item-image,
|
||
|
|
.gli-alter-1 .iso-height-2 .gallery-list-item .gl-item-image {
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.gli-alter-1 .gallery-list-item:hover .gl-item-image-wrap .gl-item-image,
|
||
|
|
.gli-alter-1 .iso-height-1 .gallery-list-item:hover .gl-item-image-wrap .gl-item-image,
|
||
|
|
.gli-alter-1 .iso-height-2 .gallery-list-item:hover .gl-item-image-wrap .gl-item-image {
|
||
|
|
-webkit-transform: scale(1.07);
|
||
|
|
-moz-transform: scale(1.07);
|
||
|
|
-o-transform: scale(1.07);
|
||
|
|
-ms-transform: scale(1.07);
|
||
|
|
transform: scale(1.07);
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-1 .gl-item-info,
|
||
|
|
.isotope.gutter-2 .gli-alter-1 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-alter-1 .gallery-list-item .gl-item-info {
|
||
|
|
position: absolute;
|
||
|
|
top: auto;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
height: auto;
|
||
|
|
padding: 25px 60px 15px 5%;
|
||
|
|
z-index: 3;
|
||
|
|
background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(17,17,17,0.8) 100%);
|
||
|
|
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(17,17,17,0.8) 100%);
|
||
|
|
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(17,17,17,0.8) 100%);
|
||
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc111111',GradientType=0 );
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gli-alter-1 .gl-item-info
|
||
|
|
.isotope.gutter-2 .gli-alter-1 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-alter-1 .gallery-list-item .gl-item-info {
|
||
|
|
padding-right: 5%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-1 .gl-item-title {
|
||
|
|
color: #FFF;
|
||
|
|
font-size: 20px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gli-alter-1 .gl-item-title {
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.gli-alter-1 .gl-item-title a {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.gli-alter-1 .gl-item-title a:hover {
|
||
|
|
opacity: .9;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-1 .gl-item-category,
|
||
|
|
.gli-alter-1 .gl-item-category a {
|
||
|
|
color: #CCC;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-1 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-2 .gli-alter-1 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-3 .gli-alter-1 .gallery-list-item .gli-meta {
|
||
|
|
bottom: 14px;
|
||
|
|
right: 15px;
|
||
|
|
color: #FFF;
|
||
|
|
z-index: 9;
|
||
|
|
}
|
||
|
|
.gli-alter-1 .gallery-list-item .gli-meta a {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-1 .gallery-list-item .gl-item-image-zoom,
|
||
|
|
.gli-alter-1 .gallery-list-item .gl-item-image-lock {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* alter style 2 */
|
||
|
|
.gli-alter-2 .gallery-list-item,
|
||
|
|
.isotope.gutter-2 .gli-alter-2 .gallery-list-item,
|
||
|
|
.isotope.gutter-3 .gli-alter-2 .gallery-list-item {
|
||
|
|
margin-bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-2 .gallery-list-item .gl-item-image-inner:before,
|
||
|
|
.gli-alter-2 .gallery-list-item .gl-item-image-inner:hover:before {
|
||
|
|
content: none;
|
||
|
|
}
|
||
|
|
.gli-alter-2 .gallery-list-item .gl-item-image,
|
||
|
|
.gli-alter-2 .iso-height-1 .gallery-list-item .gl-item-image,
|
||
|
|
.gli-alter-2 .iso-height-2 .gallery-list-item .gl-item-image {
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.gli-alter-2 .gallery-list-item:hover .gl-item-image,
|
||
|
|
.gli-alter-2 .iso-height-1 .gallery-list-item:hover .gl-item-image,
|
||
|
|
.gli-alter-2 .iso-height-2 .gallery-list-item:hover .gl-item-image {
|
||
|
|
-webkit-transform: scale(1.07);
|
||
|
|
-moz-transform: scale(1.07);
|
||
|
|
-o-transform: scale(1.07);
|
||
|
|
-ms-transform: scale(1.07);
|
||
|
|
transform: scale(1.07);
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-2 .gl-item-info,
|
||
|
|
.isotope.gutter-2 .gli-alter-2 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-alter-2 .gallery-list-item .gl-item-info {
|
||
|
|
position: absolute;
|
||
|
|
top: auto;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
height: auto;
|
||
|
|
padding: 15px 5% 15px 5%;
|
||
|
|
z-index: 3;
|
||
|
|
background-color: rgba(255, 255, 255, 0.9);
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gli-alter-2 .gl-item-info
|
||
|
|
.isotope.gutter-2 .gli-alter-2 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-alter-2 .gallery-list-item .gl-item-info {
|
||
|
|
padding-right: 5%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.gli-alter-2 .gl-item-title {
|
||
|
|
color: #333;
|
||
|
|
font-size: 18px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gli-alter-2 .gl-item-title {
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.gli-alter-2 .gl-item-title a {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.gli-alter-2 .gl-item-title a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-2 .gl-item-category,
|
||
|
|
.gli-alter-2 .gl-item-category a {
|
||
|
|
color: #666;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-2 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-2 .gli-alter-2 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-3 .gli-alter-2 .gallery-list-item .gli-meta {
|
||
|
|
bottom: 14px;
|
||
|
|
right: 15px;
|
||
|
|
color: #888;
|
||
|
|
z-index: 9;
|
||
|
|
}
|
||
|
|
.gli-alter-2 .gallery-list-item .gli-meta a {
|
||
|
|
color: #888;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-2 .gallery-list-item .gl-item-image-zoom,
|
||
|
|
.gli-alter-2 .gallery-list-item .gl-item-image-lock {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* alter style 3 */
|
||
|
|
.gli-alter-3 .gallery-list-item,
|
||
|
|
.isotope.gutter-2 .gli-alter-3 .gallery-list-item,
|
||
|
|
.isotope.gutter-3 .gli-alter-3 .gallery-list-item {
|
||
|
|
margin-bottom: 0;
|
||
|
|
overflow: hidden;
|
||
|
|
-webkit-transition: all 0.25s ease-in-out;
|
||
|
|
-moz-transition: all 0.25s ease-in-out;
|
||
|
|
-o-transition: all 0.25s ease-in-out;
|
||
|
|
-ms-transition: all 0.25s ease-in-out;
|
||
|
|
transition: all 0.25s ease-in-out;
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.isotope.gutter-2 .gli-alter-3 .gallery-list-item:hover,
|
||
|
|
.isotope.gutter-3 .gli-alter-3 .gallery-list-item:hover {
|
||
|
|
-webkit-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, .4);
|
||
|
|
-moz-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, .4);
|
||
|
|
box-shadow: 0 20px 50px 0 rgba(0, 0, 0, .4);
|
||
|
|
|
||
|
|
-webkit-transform: translateY(-7px) translateZ(0);
|
||
|
|
-moz-transform: translateY(-7px) translateZ(0);
|
||
|
|
-o-transform: translateY(-7px) translateZ(0);
|
||
|
|
-ms-transform: translateY(-7px) translateZ(0);
|
||
|
|
transform: translateY(-7px) translateZ(0);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.isotope.gutter-2 .gli-alter-3 .gallery-list-item,
|
||
|
|
.isotope.gutter-3 .gli-alter-3 .gallery-list-item {
|
||
|
|
-webkit-box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.2);
|
||
|
|
-moz-box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.2);
|
||
|
|
box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.2);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-3 .gallery-list-item .gl-item-image-inner:before,
|
||
|
|
.gli-alter-3 .gallery-list-item .gl-item-image-inner:hover:before {
|
||
|
|
content: none;
|
||
|
|
}
|
||
|
|
.gli-alter-3 .gallery-list-item:hover .gl-item-image-wrap .gl-item-image {
|
||
|
|
-webkit-transform: scale(1);
|
||
|
|
-moz-transform: scale(1);
|
||
|
|
-o-transform: scale(1);
|
||
|
|
-ms-transform: scale(1);
|
||
|
|
transform: scale(1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-3 .gl-item-info,
|
||
|
|
.isotope.gutter-2 .gli-alter-3 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-alter-3 .gallery-list-item .gl-item-info {
|
||
|
|
position: absolute;
|
||
|
|
top: auto;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
height: auto;
|
||
|
|
padding: 15px 65px 15px 5%;
|
||
|
|
z-index: 3;
|
||
|
|
background-color: #FFF;
|
||
|
|
opacity: 0;
|
||
|
|
visibility: hidden;
|
||
|
|
-webkit-transition: all 0.25s ease-in-out;
|
||
|
|
-moz-transition: all 0.25s ease-in-out;
|
||
|
|
-o-transition: all 0.25s ease-in-out;
|
||
|
|
-ms-transition: all 0.25s ease-in-out;
|
||
|
|
transition: all 0.25s ease-in-out;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gli-alter-3 .gl-item-info,
|
||
|
|
.isotope.gutter-2 .gli-alter-3 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-alter-3 .gallery-list-item .gl-item-info {
|
||
|
|
position: absolute;
|
||
|
|
top: auto;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
height: auto;
|
||
|
|
padding: 10px 5% 8px 5%;
|
||
|
|
opacity: 1;
|
||
|
|
visibility: visible;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.gli-alter-3 .gallery-list-item:hover .gl-item-info,
|
||
|
|
.isotope.gutter-2 .gli-alter-3 .gallery-list-item:hover .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-alter-3 .gallery-list-item:hover .gl-item-info {
|
||
|
|
opacity: 1;
|
||
|
|
visibility: visible;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-3 .gl-item-title {
|
||
|
|
color: #333;
|
||
|
|
font-size: 18px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gli-alter-3 .gl-item-title {
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.gli-alter-3 .gl-item-title a {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.gli-alter-3 .gl-item-title a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-3 .gl-item-category,
|
||
|
|
.gli-alter-3 .gl-item-category a {
|
||
|
|
color: #888;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-3 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-2 .gli-alter-3 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-3 .gli-alter-3 .gallery-list-item .gli-meta {
|
||
|
|
bottom: 14px;
|
||
|
|
right: 15px;
|
||
|
|
color: #888;
|
||
|
|
z-index: 9;
|
||
|
|
opacity: 0;
|
||
|
|
visibility: hidden;
|
||
|
|
-webkit-transition: all 0.25s ease-in-out;
|
||
|
|
-moz-transition: all 0.25s ease-in-out;
|
||
|
|
-o-transition: all 0.25s ease-in-out;
|
||
|
|
-ms-transition: all 0.25s ease-in-out;
|
||
|
|
transition: all 0.25s ease-in-out;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gli-alter-3 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-2 .gli-alter-3 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-3 .gli-alter-3 .gallery-list-item .gli-meta {
|
||
|
|
opacity: 1;
|
||
|
|
visibility: visible;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.gli-alter-3 .gallery-list-item .gli-meta a {
|
||
|
|
color: #888;
|
||
|
|
}
|
||
|
|
.gli-alter-3 .gallery-list-item:hover .gli-meta,
|
||
|
|
.isotope.gutter-2 .gli-alter-3 .gallery-list-item:hover .gli-meta,
|
||
|
|
.isotope.gutter-3 .gli-alter-3 .gallery-list-item:hover .gli-meta {
|
||
|
|
opacity: 1;
|
||
|
|
visibility: visible;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-3 .gallery-list-item .gl-item-image-zoom,
|
||
|
|
.gli-alter-3 .gallery-list-item .gl-item-image-lock {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* alter style 4 */
|
||
|
|
.gli-alter-4 .gallery-list-item,
|
||
|
|
.isotope.gutter-2 .gli-alter-4 .gallery-list-item,
|
||
|
|
.isotope.gutter-3 .gli-alter-4 .gallery-list-item {
|
||
|
|
margin-bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-4 .gallery-list-item .gl-item-image,
|
||
|
|
.gli-alter-4 .iso-height-1 .gallery-list-item .gl-item-image,
|
||
|
|
.gli-alter-4 .iso-height-2 .gallery-list-item .gl-item-image {
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.gli-alter-4 .gallery-list-item:hover .gl-item-image-wrap .gl-item-image,
|
||
|
|
.gli-alter-4 .iso-height-1 .gallery-list-item:hover .gl-item-image-wrap .gl-item-image,
|
||
|
|
.gli-alter-4 .iso-height-2 .gallery-list-item:hover .gl-item-image-wrap .gl-item-image {
|
||
|
|
-webkit-transform: scale(1.07);
|
||
|
|
-moz-transform: scale(1.07);
|
||
|
|
-o-transform: scale(1.07);
|
||
|
|
-ms-transform: scale(1.07);
|
||
|
|
transform: scale(1.07);
|
||
|
|
}
|
||
|
|
.gli-alter-4 .gallery-list-item:hover .gl-item-image-inner:before,
|
||
|
|
.gli-alter-4 .gallery-list-item:hover .gl-item-image-inner:hover:before {
|
||
|
|
background-color: #FFF;
|
||
|
|
opacity: .9;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gli-alter-4 .gallery-list-item:hover .gl-item-image-inner:before,
|
||
|
|
.gli-alter-4 .gallery-list-item:hover .gl-item-image-inner:hover:before {
|
||
|
|
content: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-4 .gl-item-info,
|
||
|
|
.isotope.gutter-2 .gli-alter-4 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-alter-4 .gallery-list-item .gl-item-info {
|
||
|
|
position: absolute;
|
||
|
|
top: auto;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
height: auto;
|
||
|
|
padding: 0 60px 5% 6%;
|
||
|
|
z-index: 3;
|
||
|
|
opacity: 0;
|
||
|
|
background-color: transparent;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gli-alter-4 .gl-item-info,
|
||
|
|
.isotope.gutter-2 .gli-alter-4 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-alter-4 .gallery-list-item .gl-item-info {
|
||
|
|
position: absolute;
|
||
|
|
top: auto;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
height: auto;
|
||
|
|
padding: 8px 5% 12px 5%;
|
||
|
|
background-color: transparent;
|
||
|
|
opacity: 1;
|
||
|
|
background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(17,17,17,0.8) 100%);
|
||
|
|
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(17,17,17,0.8) 100%);
|
||
|
|
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(17,17,17,0.8) 100%);
|
||
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc111111',GradientType=0 );
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.gli-alter-4 .gallery-list-item:hover .gl-item-info,
|
||
|
|
.isotope.gutter-2 .gli-alter-4 .gallery-list-item:hover .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-alter-4 .gallery-list-item:hover .gl-item-info {
|
||
|
|
opacity: 1;
|
||
|
|
-webkit-box-shadow: none;
|
||
|
|
-moz-box-shadow: none;
|
||
|
|
box-shadow: none;
|
||
|
|
|
||
|
|
-webkit-transition-delay: 0.1s;
|
||
|
|
-moz-transition-delay: 0.1s;
|
||
|
|
transition-delay: 0.1s;
|
||
|
|
}
|
||
|
|
.gli-alter-4 .gl-item-title {
|
||
|
|
font-size: 22px;
|
||
|
|
white-space: normal;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gli-alter-4 .gl-item-title {
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.gli-alter-4 .gl-item-title a {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-4 .gl-item-category {
|
||
|
|
margin-top: 8px;
|
||
|
|
}
|
||
|
|
.gli-alter-4 .gl-item-category,
|
||
|
|
.gli-alter-4 .gl-item-category a {
|
||
|
|
color: #666;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gli-alter-4 .gl-item-category,
|
||
|
|
.gli-alter-4 .gl-item-category a {
|
||
|
|
color: #CCC;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-4 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-2 .gli-alter-4 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-3 .gli-alter-4 .gallery-list-item .gli-meta {
|
||
|
|
top: 20px;
|
||
|
|
bottom: auto;
|
||
|
|
right: 20px;
|
||
|
|
padding: 10px;
|
||
|
|
color: #666;
|
||
|
|
z-index: 9;
|
||
|
|
opacity: 0;
|
||
|
|
visibility: hidden;
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gli-alter-4 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-2 .gli-alter-4 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-3 .gli-alter-4 .gallery-list-item .gli-meta {
|
||
|
|
top: auto;
|
||
|
|
bottom: 0;
|
||
|
|
left: auto;
|
||
|
|
right: 0;
|
||
|
|
opacity: 1;
|
||
|
|
visibility: visible;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.gli-alter-4 .gallery-list-item:hover .gli-meta,
|
||
|
|
.isotope.gutter-2 .gli-alter-4 .gallery-list-item:hover .gli-meta,
|
||
|
|
.isotope.gutter-3 .gli-alter-4 .gallery-list-item:hover .gli-meta {
|
||
|
|
opacity: 1;
|
||
|
|
visibility: visible;
|
||
|
|
}
|
||
|
|
.gli-alter-4 .gallery-list-item .gli-meta a {
|
||
|
|
color: #666;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-4 .gallery-list-item .gl-item-image-zoom,
|
||
|
|
.gli-alter-4 .gallery-list-item .gl-item-image-lock {
|
||
|
|
right: 20px;
|
||
|
|
}
|
||
|
|
.gli-alter-4 .gallery-list-item:hover .gl-item-image-zoom,
|
||
|
|
.gli-alter-4 .gallery-list-item:hover .gl-item-image-lock {
|
||
|
|
bottom: 20px;
|
||
|
|
opacity: 1;
|
||
|
|
-webkit-transition-delay: 0.3s;
|
||
|
|
-moz-transition-delay: 0.3s;
|
||
|
|
transition-delay: 0.3s;
|
||
|
|
}
|
||
|
|
.gli-alter-4 .gallery-list-item .gl-item-image-zoom:hover {
|
||
|
|
-webkit-transition-delay: 0s;
|
||
|
|
-moz-transition-delay: 0s;
|
||
|
|
transition-delay: 0s;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* alter style 5 */
|
||
|
|
.gli-alter-5 .gallery-list-item,
|
||
|
|
.isotope.gutter-2 .gli-alter-5 .gallery-list-item,
|
||
|
|
.isotope.gutter-3 .gli-alter-5 .gallery-list-item {
|
||
|
|
margin-bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-5:hover .gallery-list-item .gl-item-image-inner:before {
|
||
|
|
opacity: .5 !important;
|
||
|
|
}
|
||
|
|
.gli-alter-5 .gallery-list-item .gl-item-image-inner:before {
|
||
|
|
background-color: #000 !important;
|
||
|
|
opacity: .2 !important;
|
||
|
|
}
|
||
|
|
.gli-alter-5 .gallery-list-item:hover .gl-item-image-inner:before {
|
||
|
|
opacity: .1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-5 .gallery-list-item .gl-item-image,
|
||
|
|
.gli-alter-5 .iso-height-1 .gallery-list-item .gl-item-image,
|
||
|
|
.gli-alter-5 .iso-height-2 .gallery-list-item .gl-item-image {
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.gli-alter-5 .gallery-list-item:hover .gl-item-image,
|
||
|
|
.gli-alter-5 .iso-height-1 .gallery-list-item:hover .gl-item-image,
|
||
|
|
.gli-alter-5 .iso-height-2 .gallery-list-item:hover .gl-item-image {
|
||
|
|
-webkit-transform: scale(1.07);
|
||
|
|
-moz-transform: scale(1.07);
|
||
|
|
-o-transform: scale(1.07);
|
||
|
|
-ms-transform: scale(1.07);
|
||
|
|
transform: scale(1.07);
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-5 .gl-item-info,
|
||
|
|
.isotope.gutter-2 .gli-alter-5 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-alter-5 .gallery-list-item .gl-item-info {
|
||
|
|
position: absolute;
|
||
|
|
top: auto;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
height: auto;
|
||
|
|
padding: 0 15% 5% 5%;
|
||
|
|
z-index: 3;
|
||
|
|
background-color: transparent;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-5 .gl-item-title {
|
||
|
|
color: #FFF;
|
||
|
|
font-size: 26px;
|
||
|
|
font-weight: bold;
|
||
|
|
font-weight: 600;
|
||
|
|
white-space: normal;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gli-alter-5 .gl-item-title {
|
||
|
|
font-size: 22px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.gli-alter-5 .gl-item-title a {
|
||
|
|
color: #FFF !important;
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
.gli-alter-5 .gl-item-title a:hover {
|
||
|
|
color: #FFF !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-5:hover .gallery-list-item .gl-item-title {
|
||
|
|
opacity: .4;
|
||
|
|
}
|
||
|
|
.gli-alter-5 .gallery-list-item:hover .gl-item-title {
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-5 .gl-item-category {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-5 .gallery-list-item .gli-meta {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-alter-5 .gallery-list-item .gl-item-image-zoom,
|
||
|
|
.gli-alter-5 .gallery-list-item .gl-item-image-lock {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* alter style - hover dark overlay */
|
||
|
|
.gli-dark .gallery-list-item .gl-item-image-inner:hover:before,
|
||
|
|
.gli-dark.gli-alter-4 .gallery-list-item:hover .gl-item-image-inner:before,
|
||
|
|
.gli-dark.gli-alter-4 .gallery-list-item:hover .gl-item-image-inner:hover:before,
|
||
|
|
.gli-dark.gli-alter-5 .gallery-list-item:hover .gl-item-image-inner:before {
|
||
|
|
background-color: #000 !important;
|
||
|
|
opacity: .75 !important;
|
||
|
|
}
|
||
|
|
.gli-dark.gli-alter-5 .gallery-list-item .gl-item-image-inner:before {
|
||
|
|
background-color: #000 !important;
|
||
|
|
opacity: .2 !important;
|
||
|
|
}
|
||
|
|
.gli-dark.gli-alter-5:hover .gallery-list-item .gl-item-title {
|
||
|
|
opacity: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-dark.gli-alter-4 .gl-item-title,
|
||
|
|
.gli-dark.gli-alter-4 .gl-item-title a {
|
||
|
|
color: #FFF !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-dark.gli-alter-4 .gl-item-category,
|
||
|
|
.gli-dark.gli-alter-4 .gl-item-category a {
|
||
|
|
color: #EEE !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-dark.gli-alter-4 .gallery-list-item .gli-meta,
|
||
|
|
.gli-dark.gli-alter-4 .gallery-list-item .gli-meta a,
|
||
|
|
.gli-dark.gli-alter-4 .gallery-list-item .gli-meta .favorite-btn.active .icon-heart-filled {
|
||
|
|
color: #FFF !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-dark .gallery-list-item .gl-item-image-zoom:before,
|
||
|
|
.gli-dark .gallery-list-item .gl-item-image-zoom:after,
|
||
|
|
.gli-dark.gli-alter-4 .gallery-list-item .gl-item-image-zoom:before,
|
||
|
|
.gli-dark.gli-alter-4 .gallery-list-item .gl-item-image-zoom:after {
|
||
|
|
background-color: #FFF;
|
||
|
|
}
|
||
|
|
.gli-dark.gli-alter-2 .gallery-list-item .gl-item-image-zoom:before,
|
||
|
|
.gli-dark.gli-alter-2 .gallery-list-item .gl-item-image-zoom:after,
|
||
|
|
.gli-dark.gli-alter-3 .gallery-list-item .gl-item-image-zoom:before,
|
||
|
|
.gli-dark.gli-alter-3 .gallery-list-item .gl-item-image-zoom:after {
|
||
|
|
background-color: #111;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-dark.gli-alter-2 .gallery-list-item .gl-item-image-lock,
|
||
|
|
.gli-dark.gli-alter-3 .gallery-list-item .gl-item-image-lock {
|
||
|
|
color: #111;
|
||
|
|
}
|
||
|
|
.gli-dark .gallery-list-item .gl-item-image-lock {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* alter style - hover colored overlay */
|
||
|
|
.gli-colored .gallery-list-item .gl-item-image-inner:hover:before,
|
||
|
|
.gli-colored.gli-alter-4 .gallery-list-item:hover .gl-item-image-inner:before,
|
||
|
|
.gli-colored.gli-alter-4 .gallery-list-item:hover .gl-item-image-inner:hover:before,
|
||
|
|
.gli-colored.gli-alter-5 .gallery-list-item:hover .gl-item-image-inner:before {
|
||
|
|
background-color: #08c1b8 !important;
|
||
|
|
opacity: .85 !important;
|
||
|
|
}
|
||
|
|
.gli-colored.gli-alter-5 .gallery-list-item .gl-item-image-inner:before {
|
||
|
|
background-color: #000 !important;
|
||
|
|
opacity: .2 !important;
|
||
|
|
}
|
||
|
|
.gli-colored.gli-alter-5:hover .gallery-list-item .gl-item-title {
|
||
|
|
opacity: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-colored.gli-alter-4 .gl-item-title,
|
||
|
|
.gli-colored.gli-alter-4 .gl-item-title a {
|
||
|
|
color: #FFF !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-colored.gli-alter-4 .gl-item-category,
|
||
|
|
.gli-colored.gli-alter-4 .gl-item-category a {
|
||
|
|
color: #EEE !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-colored.gli-alter-4 .gallery-list-item .gli-meta,
|
||
|
|
.gli-colored.gli-alter-4 .gallery-list-item .gli-meta a {
|
||
|
|
color: #FFF !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-colored.gli-alter-4 .gallery-list-item .gli-meta .favorite-btn .icon-heart-empty:before {
|
||
|
|
color: rgba(255, 255, 255, 0.5);
|
||
|
|
}
|
||
|
|
.gli-colored.gli-alter-4 .gallery-list-item .gli-meta .favorite-btn.active .icon-heart-filled:before {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-colored .gallery-list-item .gl-item-image-zoom:before,
|
||
|
|
.gli-colored .gallery-list-item .gl-item-image-zoom:after,
|
||
|
|
.gli-colored.gli-alter-4 .gallery-list-item .gl-item-image-zoom:before,
|
||
|
|
.gli-colored.gli-alter-4 .gallery-list-item .gl-item-image-zoom:after {
|
||
|
|
background-color: #FFF;
|
||
|
|
}
|
||
|
|
.gli-colored.gli-alter-2 .gallery-list-item .gl-item-image-zoom:before,
|
||
|
|
.gli-colored.gli-alter-2 .gallery-list-item .gl-item-image-zoom:after,
|
||
|
|
.gli-colored.gli-alter-3 .gallery-list-item .gl-item-image-zoom:before,
|
||
|
|
.gli-colored.gli-alter-3 .gallery-list-item .gl-item-image-zoom:after {
|
||
|
|
background-color: #111;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gli-colored.gli-alter-2 .gallery-list-item .gl-item-image-lock,
|
||
|
|
.gli-colored.gli-alter-3 .gallery-list-item .gl-item-image-lock {
|
||
|
|
color: #111;
|
||
|
|
}
|
||
|
|
.gli-colored .gallery-list-item .gl-item-image-lock {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* alter style - image frame */
|
||
|
|
.isotope.gutter-1 .gli-frame .gl-item-image-wrap,
|
||
|
|
.isotope.gutter-2 .gli-frame .gl-item-image-wrap,
|
||
|
|
.isotope.gutter-3 .gli-frame .gl-item-image-wrap {
|
||
|
|
background-color: #FFF;
|
||
|
|
border: 1px solid #e5e5e5;
|
||
|
|
border-radius: 3px;
|
||
|
|
}
|
||
|
|
.isotope.gutter-1 .gli-alter-3.gli-frame .gallery-list-item,
|
||
|
|
.isotope.gutter-2 .gli-alter-3.gli-frame .gallery-list-item,
|
||
|
|
.isotope.gutter-3 .gli-alter-3.gli-frame .gallery-list-item {
|
||
|
|
border-radius: 3px;
|
||
|
|
-webkit-box-shadow: 0 11px 10px -5px rgba(0, 0, 0, 0.08);
|
||
|
|
-moz-box-shadow: 0 11px 10px -5px rgba(0, 0, 0, 0.08);
|
||
|
|
box-shadow: 0 11px 10px -5px rgba(0, 0, 0, 0.08);
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.isotope.gutter-1 .gli-alter-3.gli-frame .gallery-list-item:hover,
|
||
|
|
.isotope.gutter-2 .gli-alter-3.gli-frame .gallery-list-item:hover,
|
||
|
|
.isotope.gutter-3 .gli-alter-3.gli-frame .gallery-list-item:hover {
|
||
|
|
-webkit-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, .4);
|
||
|
|
-moz-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, .4);
|
||
|
|
box-shadow: 0 20px 50px 0 rgba(0, 0, 0, .4);
|
||
|
|
-webkit-transform: translateY(-7px) translateZ(0);
|
||
|
|
-moz-transform: translateY(-7px) translateZ(0);
|
||
|
|
-o-transform: translateY(-7px) translateZ(0);
|
||
|
|
-ms-transform: translateY(-7px) translateZ(0);
|
||
|
|
transform: translateY(-7px) translateZ(0);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.isotope.gutter-1 .gli-frame .gallery-list-item .gl-item-image-inner,
|
||
|
|
.isotope.gutter-2 .gli-frame .gallery-list-item .gl-item-image-inner,
|
||
|
|
.isotope.gutter-3 .gli-frame .gallery-list-item .gl-item-image-inner {
|
||
|
|
margin-top: 15px;
|
||
|
|
margin-bottom: 15px;
|
||
|
|
margin-left: 15px;
|
||
|
|
margin-right: 15px;
|
||
|
|
}
|
||
|
|
.isotope.gutter-1 .gli-frame.gli-alter-1 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-1 .gli-frame.gli-alter-2 .gallery-list-item .gli-meta,
|
||
|
|
|
||
|
|
.isotope.gutter-2 .gli-frame.gli-alter-1 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-2 .gli-frame.gli-alter-2 .gallery-list-item .gli-meta,
|
||
|
|
|
||
|
|
.isotope.gutter-3 .gli-frame.gli-alter-1 .gallery-list-item .gli-meta,
|
||
|
|
.isotope.gutter-3 .gli-frame.gli-alter-2 .gallery-list-item .gli-meta {
|
||
|
|
bottom: 25px;
|
||
|
|
right: 30px;
|
||
|
|
}
|
||
|
|
.isotope.gutter-1 .gli-frame.gli-alter-1 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-1 .gli-frame.gli-alter-2 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-1 .gli-frame.gli-alter-4 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-1 .gli-frame.gli-alter-5 .gallery-list-item .gl-item-info,
|
||
|
|
|
||
|
|
.isotope.gutter-2 .gli-frame.gli-alter-1 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-2 .gli-frame.gli-alter-2 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-2 .gli-frame.gli-alter-4 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-2 .gli-frame.gli-alter-5 .gallery-list-item .gl-item-info,
|
||
|
|
|
||
|
|
.isotope.gutter-3 .gli-frame.gli-alter-1 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-frame.gli-alter-2 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-frame.gli-alter-4 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-frame.gli-alter-5 .gallery-list-item .gl-item-info {
|
||
|
|
width: auto;
|
||
|
|
bottom: 15px;
|
||
|
|
left: 15px;
|
||
|
|
right: 15px;
|
||
|
|
}
|
||
|
|
.isotope.gutter-1 .gli-frame.gli-alter-3 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-2 .gli-frame.gli-alter-3 .gallery-list-item .gl-item-info,
|
||
|
|
.isotope.gutter-3 .gli-frame.gli-alter-3 .gallery-list-item .gl-item-info {
|
||
|
|
width: auto;
|
||
|
|
bottom: 1px;
|
||
|
|
left: 1px;
|
||
|
|
right: 1px;
|
||
|
|
border-radius: 3px 0 3px 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Gallery list categories
|
||
|
|
=========================== */
|
||
|
|
.gl-categories {
|
||
|
|
}
|
||
|
|
.gl-categories .gl-item-title,
|
||
|
|
.gl-categories .gli-alter-4 .gl-item-title {
|
||
|
|
font-size: 26px;
|
||
|
|
}
|
||
|
|
.gl-categories .gli-alter-1 .gl-item-title,
|
||
|
|
.gl-categories .gli-alter-2 .gl-item-title,
|
||
|
|
.gl-categories .gli-alter-3 .gl-item-title {
|
||
|
|
font-size: 22px;
|
||
|
|
}
|
||
|
|
.gl-categories .gl-item-category,
|
||
|
|
.gl-categories .gli-meta {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Isotope items in gallery list section
|
||
|
|
========================================= */
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
#gallery-list-section .isotope-item {
|
||
|
|
margin-bottom: 15px;
|
||
|
|
}
|
||
|
|
#gallery-list-section .gli-alter-1 .isotope-item,
|
||
|
|
#gallery-list-section .gli-alter-2 .isotope-item,
|
||
|
|
#gallery-list-section .gli-alter-3 .isotope-item,
|
||
|
|
#gallery-list-section .gli-alter-4 .isotope-item,
|
||
|
|
#gallery-list-section .gli-alter-5 .isotope-item {
|
||
|
|
margin-bottom: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.gl-categories .isotope.col-2 .isotope-item,
|
||
|
|
.gl-categories .isotope.col-3 .isotope-item,
|
||
|
|
.gl-categories .isotope.col-4 .isotope-item,
|
||
|
|
.gl-categories .isotope.col-5 .isotope-item,
|
||
|
|
.gl-categories .isotope.col-6 .isotope-item {
|
||
|
|
width: 50%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Gallery list carousel
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.gallery-list-carousel {
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-list-carousel-inner {
|
||
|
|
}
|
||
|
|
|
||
|
|
.gl-carousel-wrap {
|
||
|
|
position: relative;
|
||
|
|
background-color: rgba(128, 128, 128, 0.1);
|
||
|
|
padding: 40px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gl-carousel-wrap {
|
||
|
|
padding: 15px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery list carousel no crop */
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.glc-no-crop .owl-carousel .owl-stage-outer {
|
||
|
|
margin-left: -1px;
|
||
|
|
padding-left: 60px;
|
||
|
|
}
|
||
|
|
.glc-no-crop .gl-carousel-wrap {
|
||
|
|
padding: 40px 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery list carousel cover (for slider center) */
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.gallery-list-carousel.glc-center .cc-item .cover {
|
||
|
|
background-color: rgba(255, 255, 255, 0.7);
|
||
|
|
}
|
||
|
|
.gallery-list-carousel.glc-center .owl-item.center .cc-item .cover {
|
||
|
|
background-color: transparent;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Gallery list carousel full height offsets
|
||
|
|
============================================= */
|
||
|
|
.gallery-list-carousel .owl-carousel.cc-height-full,
|
||
|
|
.gallery-list-carousel .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 161px);
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.gallery-list-carousel .owl-carousel.cc-height-full,
|
||
|
|
.gallery-list-carousel .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 92px);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
body.footer-minimal-on .gallery-list-carousel .owl-carousel.cc-height-full,
|
||
|
|
body.footer-minimal-on .gallery-list-carousel .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 242px);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if class "no-padding" enabled */
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.gl-carousel-wrap.no-padding .owl-carousel.cc-height-full,
|
||
|
|
.gl-carousel-wrap.no-padding .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 82px);
|
||
|
|
}
|
||
|
|
|
||
|
|
body.footer-minimal-on .gl-carousel-wrap.no-padding .owl-carousel.cc-height-full,
|
||
|
|
body.footer-minimal-on .gl-carousel-wrap.no-padding .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 162px);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.gl-carousel-wrap.no-padding .owl-carousel.cc-height-full,
|
||
|
|
.gl-carousel-wrap.no-padding .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 62px);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if header-transparent enabled */
|
||
|
|
body.header-transparent-on .gallery-list-carousel .owl-carousel.cc-height-full,
|
||
|
|
body.header-transparent-on .gallery-list-carousel .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 82px);
|
||
|
|
}
|
||
|
|
body.header-transparent-on .gl-carousel-wrap.no-padding .owl-carousel.cc-height-full,
|
||
|
|
body.header-transparent-on .gl-carousel-wrap.no-padding .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: 100vh;
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
body.header-transparent-on .gl-carousel-wrap.no-padding .owl-carousel.cc-height-full,
|
||
|
|
body.header-transparent-on .gl-carousel-wrap.no-padding .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 62px); /* offset = same as mobile header heigt */
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Gallery list item inside "cc-item" (in case you want to use it)
|
||
|
|
====================================== */
|
||
|
|
.gallery-list-carousel .gallery-list-item,
|
||
|
|
.gallery-list-carousel .gallery-list-item .gl-item-image {
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
.gallery-list-carousel .gl-item-info {
|
||
|
|
position: absolute;
|
||
|
|
left: 0;
|
||
|
|
bottom: 0;
|
||
|
|
}
|
||
|
|
.gallery-list-carousel .gli-alter-3 .gl-item-info {
|
||
|
|
top: 10%;
|
||
|
|
bottom: 10%;
|
||
|
|
left: 10%;
|
||
|
|
right: 10%;
|
||
|
|
}
|
||
|
|
.gallery-list-carousel .gli-alter-2 .gl-item-title {
|
||
|
|
font-size: 22px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* If thumb-list inside gallery list carousel
|
||
|
|
============================================== */
|
||
|
|
.gallery-list-carousel .thumb-list {
|
||
|
|
position: absolute;
|
||
|
|
top: 50%;
|
||
|
|
right: 9%;
|
||
|
|
width: 40%;
|
||
|
|
padding: 40px;
|
||
|
|
z-index: 2;
|
||
|
|
opacity: 0;
|
||
|
|
-moz-transform: translateY(-50%);
|
||
|
|
-ms-transform: translateY(-50%);
|
||
|
|
-webkit-transform: translateY(-50%);
|
||
|
|
transform: translateY(-50%);
|
||
|
|
|
||
|
|
-webkit-transition: all 0.5s ease-in-out;
|
||
|
|
-moz-transition: all 0.5s ease-in-out;
|
||
|
|
-o-transition: all 0.5s ease-in-out;
|
||
|
|
-ms-transition: all 0.5s ease-in-out;
|
||
|
|
transition: all 0.5s ease-in-out;
|
||
|
|
}
|
||
|
|
@media (max-width: 1024px) { /* disable thumb-list on smaller screens */
|
||
|
|
.gallery-list-carousel .thumb-list {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.gallery-list-carousel .owl-carousel .owl-item.active .thumb-list {
|
||
|
|
right: 9%;
|
||
|
|
opacity: 1;
|
||
|
|
-webkit-transition-delay: 0.7s;
|
||
|
|
-moz-transition-delay: 0.7s;
|
||
|
|
transition-delay: 0.7s;
|
||
|
|
}
|
||
|
|
@media (max-width: 1400px) {
|
||
|
|
.gallery-list-carousel .thumb-list,
|
||
|
|
.gallery-list-carousel .owl-carousel .owl-item.active .thumb-list{
|
||
|
|
right: 5%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-list-carousel .thumb-list > li {
|
||
|
|
padding: 1%;
|
||
|
|
}
|
||
|
|
.gallery-list-carousel .thumb-list .thumb-list-item {
|
||
|
|
padding-bottom: 65%;
|
||
|
|
border: 12px solid #fff;
|
||
|
|
}
|
||
|
|
@media (max-width: 1400px) {
|
||
|
|
.gallery-list-carousel .thumb-list .thumb-list-item {
|
||
|
|
border-width: 8px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.gallery-list-carousel .thumb-list .thumb-list-item:hover {
|
||
|
|
opacity: 1;
|
||
|
|
-webkit-transform: scale(1.08);
|
||
|
|
-moz-transform: scale(1.08);
|
||
|
|
-o-transform: scale(1.08);
|
||
|
|
-ms-transform: scale(1.08);
|
||
|
|
transform: scale(1.08);
|
||
|
|
box-shadow: 0 10px 10px -5px rgba(0, 0, 0, 0.5);
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Gallery thumbnails section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#gallery-thumbnails-section {
|
||
|
|
padding-top: 5%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gts-inner {
|
||
|
|
padding: 0 3%;
|
||
|
|
}
|
||
|
|
.gts-inner.tt-wrap {
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery thumbnails list block */
|
||
|
|
.gallery-thumbnails-block {
|
||
|
|
margin-bottom: 70px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gtb heading */
|
||
|
|
.gtb-heading {
|
||
|
|
margin-bottom: 30px;
|
||
|
|
}
|
||
|
|
.gtb-heading-title {
|
||
|
|
margin: 0;
|
||
|
|
font-size: 28px;
|
||
|
|
}
|
||
|
|
.gtb-heading-category {
|
||
|
|
margin-bottom: 15px;
|
||
|
|
font-size: 12px;
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
.gtb-heading-category a,
|
||
|
|
.gtb-heading-category span {
|
||
|
|
background-color: #08c1b8;
|
||
|
|
padding: 1px 5px 0px 5px;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.gtb-heading-category a:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
.gtb-heading-date {
|
||
|
|
margin-top: 5px;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery thumbnails list */
|
||
|
|
.gallery-thumbnails-list {
|
||
|
|
list-style: none;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
font-size: 0;
|
||
|
|
}
|
||
|
|
.gallery-thumbnails-list > li {
|
||
|
|
display: inline-block;
|
||
|
|
width: 140px;
|
||
|
|
vertical-align: top;
|
||
|
|
font-size: inherit;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gallery-thumbnails-list > li {
|
||
|
|
width: 100px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.gallery-thumbnails-list > li {
|
||
|
|
width: 80px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery thumbnails list item */
|
||
|
|
.gtl-item-link {
|
||
|
|
}
|
||
|
|
.gtl-item {
|
||
|
|
background-color: rgba(138, 138, 138, 0.13);
|
||
|
|
padding-bottom: 80%;
|
||
|
|
margin: 3px;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.gtl-item:hover {
|
||
|
|
opacity: .85;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Gallery single section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#gallery-single-section {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope items in gallery single section */
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
#gallery-single-section .isotope.col-2 .isotope-item,
|
||
|
|
#gallery-single-section .isotope.col-3 .isotope-item,
|
||
|
|
#gallery-single-section .isotope.col-4 .isotope-item,
|
||
|
|
#gallery-single-section .isotope.col-5 .isotope-item,
|
||
|
|
#gallery-single-section .isotope.col-6 .isotope-item {
|
||
|
|
width: 50%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-single-inner {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* gallery single item
|
||
|
|
======================= */
|
||
|
|
.gallery-single-item {
|
||
|
|
position: relative;
|
||
|
|
display: block;
|
||
|
|
overflow: hidden;
|
||
|
|
background-color: rgba(138, 138, 138, 0.11);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery single item image */
|
||
|
|
.gallery-single-item .gs-item-image {
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.gallery-single-item:hover .gs-item-image,
|
||
|
|
.iso-height-1 .gallery-single-item:hover .gs-item-image,
|
||
|
|
.iso-height-2 .gallery-single-item:hover .gs-item-image {
|
||
|
|
-webkit-transform: scale(1.08);
|
||
|
|
-moz-transform: scale(1.08);
|
||
|
|
-o-transform: scale(1.08);
|
||
|
|
-ms-transform: scale(1.08);
|
||
|
|
transform: scale(1.08);
|
||
|
|
}
|
||
|
|
|
||
|
|
.iso-height-1 .gallery-single-item .gs-item-image,
|
||
|
|
.iso-height-2 .gallery-single-item .gs-item-image {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-single-item img {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery single item cover */
|
||
|
|
.gallery-single-item:before {
|
||
|
|
position: absolute;
|
||
|
|
content: "";
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
background-color: #000;
|
||
|
|
z-index: 2;
|
||
|
|
opacity: 0;
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.gallery-single-item:hover:before {
|
||
|
|
opacity: .5;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery single item info */
|
||
|
|
.gallery-single-item .gsi-image-caption {
|
||
|
|
position: absolute;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
width: 100%;
|
||
|
|
padding: 0 80px 0 8%;
|
||
|
|
z-index: 9;
|
||
|
|
font-size: 16px;
|
||
|
|
color: #FFF;
|
||
|
|
opacity: 0;
|
||
|
|
overflow: hidden;
|
||
|
|
white-space: nowrap;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.gallery-single-item:hover .gsi-image-caption {
|
||
|
|
bottom: 30px;
|
||
|
|
opacity: 1;
|
||
|
|
|
||
|
|
-webkit-transition-delay: 0.5s;
|
||
|
|
-moz-transition-delay: 0.5s;
|
||
|
|
transition-delay: 0.5s;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery single item icon */
|
||
|
|
.gallery-single-item .gs-item-icon {
|
||
|
|
position: absolute;
|
||
|
|
display: block;
|
||
|
|
right: 35px;
|
||
|
|
bottom: 10px;
|
||
|
|
font-size: 22px;
|
||
|
|
color: #FFF;
|
||
|
|
opacity: 0;
|
||
|
|
z-index: 2;
|
||
|
|
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.gallery-single-item:hover .gs-item-icon {
|
||
|
|
opacity: 1;
|
||
|
|
-webkit-transform: translateY(-50%);
|
||
|
|
-moz-transform: translateY(-50%);
|
||
|
|
-o-transform: translateY(-50%);
|
||
|
|
-ms-transform: translateY(-50%);
|
||
|
|
transform: translateY(-50%);
|
||
|
|
|
||
|
|
-webkit-transition-delay: 0.3s;
|
||
|
|
-moz-transition-delay: 0.3s;
|
||
|
|
transition-delay: 0.3s;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* gallery single item styles
|
||
|
|
============================== */
|
||
|
|
|
||
|
|
/* gsi-color */
|
||
|
|
#gallery.gsi-color .gallery-single-item:before {
|
||
|
|
background-color: #08c1b8;
|
||
|
|
}
|
||
|
|
#gallery.gsi-color .gallery-single-item:hover:before {
|
||
|
|
opacity: .65;
|
||
|
|
}
|
||
|
|
#gallery.gsi-color .gs-item-info .gs-item-icon {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gsi-zoom */
|
||
|
|
#gallery.gsi-zoom .gsi-image-caption,
|
||
|
|
#gallery.gsi-zoom .gs-item-icon,
|
||
|
|
#gallery.gsi-zoom .gallery-single-item:before {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gsi-simple */
|
||
|
|
#gallery.gsi-simple .gsi-image-caption,
|
||
|
|
#gallery.gsi-simple .gs-item-icon,
|
||
|
|
#gallery.gsi-simple .gallery-single-item:before {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
#gallery.gsi-simple .iso-height-1 .gallery-single-item:hover .gs-item-image,
|
||
|
|
#gallery.gsi-simple .iso-height-2 .gallery-single-item:hover .gs-item-image {
|
||
|
|
-webkit-transform: scale(1);
|
||
|
|
-moz-transform: scale(1);
|
||
|
|
-o-transform: scale(1);
|
||
|
|
-ms-transform: scale(1);
|
||
|
|
transform: scale(1);
|
||
|
|
}
|
||
|
|
#gallery.gsi-simple .gallery-single-item {
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
#gallery.gsi-simple .gallery-single-item:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* gallery single share
|
||
|
|
======================== */
|
||
|
|
.gallery-share {
|
||
|
|
position: absolute;
|
||
|
|
left: 3%;
|
||
|
|
top: 50px;
|
||
|
|
width: 55px;
|
||
|
|
height: 55px;
|
||
|
|
line-height: 57px;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 18px;
|
||
|
|
color: #FFF;
|
||
|
|
cursor: pointer;
|
||
|
|
z-index: 9;
|
||
|
|
border-radius: 60px;
|
||
|
|
-webkit-box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.25);
|
||
|
|
-moz-box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.25);
|
||
|
|
box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.25);
|
||
|
|
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.gallery-share:hover,
|
||
|
|
.gallery-share:focus {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.gallery-share:hover {
|
||
|
|
-webkit-transform: rotate(180deg);
|
||
|
|
-moz-transform: rotate(180deg);
|
||
|
|
-o-transform: rotate(180deg);
|
||
|
|
-ms-transform: rotate(180deg);
|
||
|
|
transform: rotate(180deg);
|
||
|
|
}
|
||
|
|
|
||
|
|
.isotope.gutter-1 .gallery-share {
|
||
|
|
top: 60px;
|
||
|
|
}
|
||
|
|
.isotope.gutter-2 .gallery-share {
|
||
|
|
top: 80px;
|
||
|
|
}
|
||
|
|
.isotope.gutter-3 .gallery-share {
|
||
|
|
top: 100px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery single share align right */
|
||
|
|
.gallery-share.gs-right {
|
||
|
|
left: auto;
|
||
|
|
right: 3%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if ".isotope-top-content" contains class "fi-to-button-on" */
|
||
|
|
.isotope-top-content.gallery-share-on {
|
||
|
|
margin-top: 0 !important;
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.isotope.gutter-1 .isotope-top-content.gallery-share-on {
|
||
|
|
padding-top: 6px;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
.isotope.gutter-2 .isotope-top-content.gallery-share-on {
|
||
|
|
padding-top: 1.5%;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
.isotope.gutter-3 .isotope-top-content.gallery-share-on {
|
||
|
|
padding-top: 2.5%;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if page header enabled */
|
||
|
|
body.page-header-on .gallery-share,
|
||
|
|
body.page-header-on .isotope.gutter-1 .gallery-share,
|
||
|
|
body.page-header-on .isotope.gutter-2 .gallery-share,
|
||
|
|
body.page-header-on .isotope.gutter-3 .gallery-share {
|
||
|
|
top: -28px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if page boxed layout enabled */
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .gallery-share {
|
||
|
|
left: 0;
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .gallery-share.gs-right {
|
||
|
|
left: auto;
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 768px) {
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope-top-content.gallery-share-on,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-1 .isotope-top-content.gallery-share-on,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-2 .isotope-top-content.gallery-share-on,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-3 .isotope-top-content.gallery-share-on {
|
||
|
|
padding-top: 50px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .gallery-share,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-1 .gallery-share,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-2 .gallery-share,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-3 .gallery-share {
|
||
|
|
top: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
body.tt-boxed.page-header-on .isotope-wrap.tt-wrap .isotope-top-content.gallery-share-on {
|
||
|
|
padding-top: 40px;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
body.tt-boxed.page-header-on .isotope-wrap.tt-wrap .isotope.gutter-1 .isotope-top-content.gallery-share-on {
|
||
|
|
padding-top: 40px;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
body.tt-boxed.page-header-on .isotope-wrap.tt-wrap .isotope.gutter-2 .isotope-top-content.gallery-share-on {
|
||
|
|
padding-top: 40px;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
body.tt-boxed.page-header-on .isotope-wrap.tt-wrap .isotope.gutter-3 .isotope-top-content.gallery-share-on {
|
||
|
|
padding-top: 40px;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* move gallery share button to bottom on small screens
|
||
|
|
======================================================== */
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.isotope-filter.fi-to-button,
|
||
|
|
|
||
|
|
body.page-header-on .gallery-share,
|
||
|
|
body.page-header-on .isotope.gutter-1 .gallery-share,
|
||
|
|
body.page-header-on .isotope.gutter-2 .gallery-share,
|
||
|
|
body.page-header-on .isotope.gutter-3 .gallery-share,
|
||
|
|
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .gallery-share,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-1 .gallery-share,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-2 .gallery-share,
|
||
|
|
body.tt-boxed .isotope-wrap.tt-wrap .isotope.gutter-3 .gallery-share {
|
||
|
|
position: fixed;
|
||
|
|
top: auto !important;
|
||
|
|
bottom: 15px !important;
|
||
|
|
left: auto !important;
|
||
|
|
right: 15px !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Gallery single meta
|
||
|
|
======================= */
|
||
|
|
ul.gallery-meta {
|
||
|
|
display: inline-block;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
font-size: 18px;
|
||
|
|
color: #a7a7a7;
|
||
|
|
}
|
||
|
|
ul.gallery-meta > li {
|
||
|
|
float: left;
|
||
|
|
margin-right: 12px;
|
||
|
|
}
|
||
|
|
ul.gallery-meta > li:last-child {
|
||
|
|
margin-right: 0 !important;
|
||
|
|
}
|
||
|
|
ul.gallery-meta > li a {
|
||
|
|
color: #a7a7a7;
|
||
|
|
}
|
||
|
|
ul.gallery-meta > li a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* content share trigger */
|
||
|
|
.content-share-trigger {
|
||
|
|
}
|
||
|
|
.content-share-trigger a {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* content info trigger */
|
||
|
|
.content-info-trigger {
|
||
|
|
}
|
||
|
|
.content-info-trigger a {
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* gallery single simple item
|
||
|
|
============================== */
|
||
|
|
.gs-simple-item {
|
||
|
|
margin-bottom: 40px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gs-simple-item {
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.gs-simple-item .gss-item-image {
|
||
|
|
display: block;
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.gs-simple-item .gss-item-image:hover {
|
||
|
|
opacity: .9;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gs-simple-item .gss-image-caption {
|
||
|
|
margin-top: 7px;
|
||
|
|
font-style: italic;
|
||
|
|
font-size: 13px;
|
||
|
|
color: #888;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Gallery single credits
|
||
|
|
========================== */
|
||
|
|
.gallery-single-credits {
|
||
|
|
}
|
||
|
|
.gallery-single-credits dl {
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
.gallery-single-credits dt {
|
||
|
|
font-weight: bold;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
.gallery-single-credits dd {
|
||
|
|
font-weight: normal;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #888
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Gallery single nav
|
||
|
|
====================== */
|
||
|
|
.gallery-single-nav {
|
||
|
|
}
|
||
|
|
.gallery-single-nav a {
|
||
|
|
display: inline-block;
|
||
|
|
width: 20px;
|
||
|
|
height: 20px;
|
||
|
|
line-height: 20px;
|
||
|
|
color: #222;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.gallery-single-nav a:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-single-nav .gsn-prew {
|
||
|
|
margin-right: 10px;
|
||
|
|
font-size: 25px;
|
||
|
|
}
|
||
|
|
.gallery-single-nav .gsn-next {
|
||
|
|
margin-left: 10px;
|
||
|
|
font-size: 25px;
|
||
|
|
}
|
||
|
|
.gallery-single-nav .gsn-back {
|
||
|
|
font-size: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if gallery single nav in page header */
|
||
|
|
#page-header .gallery-single-nav {
|
||
|
|
position: absolute;
|
||
|
|
right: 60px;
|
||
|
|
bottom: 80px;
|
||
|
|
z-index: 9;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
#page-header .gallery-single-nav {
|
||
|
|
bottom: 30px;
|
||
|
|
right: 15px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
#page-header .gallery-single-nav a {
|
||
|
|
color: #222;
|
||
|
|
}
|
||
|
|
#page-header.ph-image-on .gallery-single-nav a {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
body.iso-tt-wrap-on #page-header .gallery-single-nav {
|
||
|
|
right: 15px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Gallery single carousel
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.gallery-single-carousel {
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-single-carousel-inner {
|
||
|
|
}
|
||
|
|
|
||
|
|
.gs-carousel-wrap {
|
||
|
|
position: relative;
|
||
|
|
background-color: rgba(128, 128, 128, 0.12);
|
||
|
|
padding: 40px 0;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gs-carousel-wrap {
|
||
|
|
padding: 15px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.gallery-single-carousel .owl-carousel .owl-stage-outer {
|
||
|
|
margin-left: -1px;
|
||
|
|
padding-left: 60px;
|
||
|
|
}
|
||
|
|
.gs-carousel-center .owl-carousel .owl-stage-outer {
|
||
|
|
margin-left: 0;
|
||
|
|
padding-left: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Gallery single full height carousel offsets
|
||
|
|
=============================================== */
|
||
|
|
.gallery-single-carousel .owl-carousel.cc-height-full,
|
||
|
|
.gallery-single-carousel .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 162px);
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.gallery-single-carousel .owl-carousel.cc-height-full,
|
||
|
|
.gallery-single-carousel .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 92px);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
body.footer-minimal-on .gallery-single-carousel .owl-carousel.cc-height-full,
|
||
|
|
body.footer-minimal-on .gallery-single-carousel .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 242px);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if class "no-padding" enabled */
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.gs-carousel-wrap.no-padding .owl-carousel.cc-height-full,
|
||
|
|
.gs-carousel-wrap.no-padding .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 82px);
|
||
|
|
}
|
||
|
|
body.footer-minimal-on .gs-carousel-wrap.no-padding .owl-carousel.cc-height-full,
|
||
|
|
body.footer-minimal-on .gs-carousel-wrap.no-padding .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 162px);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.gs-carousel-wrap.no-padding .owl-carousel.cc-height-full,
|
||
|
|
.gs-carousel-wrap.no-padding .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 62px);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if header-transparent enabled */
|
||
|
|
body.header-transparent-on .gallery-single-carousel .owl-carousel.cc-height-full,
|
||
|
|
body.header-transparent-on .gallery-single-carousel .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 82px);
|
||
|
|
}
|
||
|
|
body.header-transparent-on .gs-carousel-wrap.no-padding .owl-carousel.cc-height-full,
|
||
|
|
body.header-transparent-on .gs-carousel-wrap.no-padding .owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: 100vh;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Gallery single carousel item
|
||
|
|
================================ */
|
||
|
|
.gallery-single-carousel .cc-item {
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-single-carousel .cc-item.gs-carousel-item {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery single carousel item image caption */
|
||
|
|
.gallery-single-carousel .cc-item .gsi-image-caption {
|
||
|
|
position: absolute;
|
||
|
|
left: 5%;
|
||
|
|
bottom: 3%;
|
||
|
|
max-width: 600px;
|
||
|
|
background-color: rgba(255, 255, 255, 0.85);
|
||
|
|
margin-right: 10%;
|
||
|
|
padding: 10px;
|
||
|
|
font-size: 14px;
|
||
|
|
font-style: italic;
|
||
|
|
color: #222;
|
||
|
|
z-index: 3;
|
||
|
|
opacity: 0;
|
||
|
|
visibility: hidden;
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.gallery-single-carousel .cc-item:hover .gsi-image-caption {
|
||
|
|
bottom: 5%;
|
||
|
|
opacity: 1;
|
||
|
|
visibility: visible;
|
||
|
|
|
||
|
|
-webkit-transition-delay: 0.2s;
|
||
|
|
-moz-transition-delay: 0.2s;
|
||
|
|
transition-delay: 0.2s;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) { /* disable captions on small screens */
|
||
|
|
.gallery-single-carousel .cc-item .gsi-image-caption {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* video play icon for gallery single carousel item */
|
||
|
|
.gallery-single-carousel .cc-item.gs-carousel-item .video-play-icon:before {
|
||
|
|
position: absolute;
|
||
|
|
display: block;
|
||
|
|
height: 70px;
|
||
|
|
width: 70px;
|
||
|
|
line-height: 70px;
|
||
|
|
left: 50%;
|
||
|
|
top: 50%;
|
||
|
|
margin-left: -35px;
|
||
|
|
margin-top: -35px;
|
||
|
|
background-color: rgba(0, 0, 0, 0.7);
|
||
|
|
padding-left: 5px;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 24px;
|
||
|
|
color: #FFF;
|
||
|
|
cursor: pointer;
|
||
|
|
opacity: 1;
|
||
|
|
z-index: 1;
|
||
|
|
border-radius: 50%;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
|
||
|
|
font-family: "Font Awesome 5 Free";
|
||
|
|
content: "\f04b";
|
||
|
|
font-weight: 900;
|
||
|
|
display: inline-block;
|
||
|
|
font-style: normal;
|
||
|
|
font-variant: normal;
|
||
|
|
text-rendering: auto;
|
||
|
|
-webkit-font-smoothing: antialiased;
|
||
|
|
}
|
||
|
|
.gallery-single-carousel .cc-item.gs-carousel-item:hover .video-play-icon:before {
|
||
|
|
-webkit-transform: scale(1.1);
|
||
|
|
-moz-transform: scale(1.1);
|
||
|
|
-o-transform: scale(1.1);
|
||
|
|
-ms-transform: scale(1.1);
|
||
|
|
transform: scale(1.1);
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* gallery single carousel meta
|
||
|
|
================================ */
|
||
|
|
.gallery-single-carousel ul.gallery-meta {
|
||
|
|
position: absolute;
|
||
|
|
right: 27px;
|
||
|
|
bottom: 60px;
|
||
|
|
background-color: rgba(255, 255, 255, 0.9);
|
||
|
|
padding: 10px 20px 8px 20px;
|
||
|
|
z-index: 2;
|
||
|
|
color: #333;
|
||
|
|
/* border-radius: 50px; */
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gallery-single-carousel ul.gallery-meta {
|
||
|
|
right: 30px;
|
||
|
|
bottom: 30px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-single-carousel ul.gallery-meta > li {
|
||
|
|
margin-right: 20px;
|
||
|
|
}
|
||
|
|
.gallery-single-carousel ul.gallery-meta > li a {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.gallery-single-carousel ul.gallery-meta > li a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.gallery-single-carousel ul.gallery-meta .favorite-btn {
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* gallery single carousel nav-bottom-right
|
||
|
|
============================================ */
|
||
|
|
.gallery-single-carousel .nav-bottom-right .owl-nav {
|
||
|
|
position: absolute;
|
||
|
|
top: auto;
|
||
|
|
bottom: 150px;
|
||
|
|
right: 35px;
|
||
|
|
width: 133px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gallery-single-carousel .nav-bottom-right .owl-nav {
|
||
|
|
bottom: 135px;
|
||
|
|
right: 20px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* gallery single carousel center
|
||
|
|
================================== */
|
||
|
|
|
||
|
|
/* gallery single carousel item cover (for carousel center) */
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.gallery-single-carousel.gs-carousel-center .cc-item .gsi-image-caption {
|
||
|
|
opacity: 0;
|
||
|
|
visibility: hidden;
|
||
|
|
}
|
||
|
|
.gallery-single-carousel.gs-carousel-center .owl-item.center .cc-item .gsi-image-caption {
|
||
|
|
bottom: 5%;
|
||
|
|
opacity: 1;
|
||
|
|
visibility: visible;
|
||
|
|
-webkit-transition-delay: 0.5s;
|
||
|
|
-moz-transition-delay: 0.5s;
|
||
|
|
transition-delay: 0.5s;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* deactivate inactive slides. */
|
||
|
|
.gs-carousel-center .owl-item:before {
|
||
|
|
position: absolute;
|
||
|
|
display: block;
|
||
|
|
content: "";
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
z-index: 9;
|
||
|
|
}
|
||
|
|
.gs-carousel-center .owl-item.center:before {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Gallery single carousel info
|
||
|
|
================================ */
|
||
|
|
.gs-carousel-info {
|
||
|
|
position: relative;
|
||
|
|
width: inherit; /* width handled by "theme.js" file */
|
||
|
|
background-color: #FFF;
|
||
|
|
padding: 8% 8% 80px 8%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery single full height carousel info offsets */
|
||
|
|
.gallery-single-carousel .owl-carousel.cc-height-full .gs-carousel-info {
|
||
|
|
height: calc(100vh - 162px);
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.gallery-single-carousel .owl-carousel.cc-height-full .gs-carousel-info {
|
||
|
|
height: calc(100vh - 112px);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 767px) {
|
||
|
|
.gallery-single-carousel .owl-carousel.cc-height-full .gs-carousel-info {
|
||
|
|
height: calc(100vh - 92px);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
body.footer-minimal-on .gallery-single-carousel .owl-carousel.cc-height-full .gs-carousel-info {
|
||
|
|
height: calc(100vh - 242px);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if class "no-padding" enabled on "gs-carousel-wrap" */
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.gs-carousel-wrap.no-padding .owl-carousel.cc-height-full .gs-carousel-info {
|
||
|
|
height: calc(100vh - 162px);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.gs-carousel-wrap.no-padding .owl-carousel.cc-height-full .gs-carousel-info {
|
||
|
|
height: calc(100vh - 62px);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* callery single carousel info inner */
|
||
|
|
.gsc-info-inner {
|
||
|
|
height: 100%;
|
||
|
|
overflow-y: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gs-carousel-info .gallery-single-nav {
|
||
|
|
position: absolute;
|
||
|
|
left: 8%;
|
||
|
|
bottom: 25px;
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
.gallery-single-carousel .gs-carousel-info ul.gallery-meta {
|
||
|
|
position: absolute;
|
||
|
|
right: 8%;
|
||
|
|
bottom: 25px;
|
||
|
|
padding: 0;
|
||
|
|
background-color: transparent;
|
||
|
|
z-index: 2;
|
||
|
|
font-size: 18px;
|
||
|
|
color: #a7a7a7;
|
||
|
|
}
|
||
|
|
.gallery-single-carousel .gs-carousel-info ul.gallery-meta .favorite-btn {
|
||
|
|
font-size: 14px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Gallery single section with sidebar
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.gallery-single-with-sidebar {
|
||
|
|
padding-top: 20px;
|
||
|
|
padding-left: 3%;
|
||
|
|
padding-right: 3%;
|
||
|
|
}
|
||
|
|
@media (max-width: 1600px) {
|
||
|
|
.gallery-single-with-sidebar {
|
||
|
|
padding-left: 15px;
|
||
|
|
padding-right: 15px;
|
||
|
|
}
|
||
|
|
body.tt-boxed .gallery-single-with-sidebar .gallery-single-inner.tt-wrap {
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* If header-transparent enabled */
|
||
|
|
body.header-transparent-on .gallery-single-with-sidebar {
|
||
|
|
padding-top: 90px;
|
||
|
|
}
|
||
|
|
@media (max-width: 1200px) {
|
||
|
|
body.header-transparent-on .gallery-single-with-sidebar {
|
||
|
|
padding-top: 90px;
|
||
|
|
padding-left: 15px;
|
||
|
|
padding-right: 15px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* If page header enabled */
|
||
|
|
body.page-header-on .gallery-single-with-sidebar {
|
||
|
|
padding-top: 40px;
|
||
|
|
}
|
||
|
|
@media (max-width: 1200px) {
|
||
|
|
body.page-header-on .gallery-single-with-sidebar {
|
||
|
|
padding-top: 20px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
body.page-header-on .gallery-single-with-sidebar .gallery-single-inner.tt-wrap {
|
||
|
|
padding-top: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Gallery single sidebar
|
||
|
|
========================== */
|
||
|
|
.gs-sidebar {
|
||
|
|
position: relative;
|
||
|
|
margin-bottom: 30px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gs-sidebar-left .gs-sidebar {
|
||
|
|
padding: 0 10px 0 0;
|
||
|
|
}
|
||
|
|
.gs-sidebar-right .gs-sidebar {
|
||
|
|
padding: 0 0 0 10px;
|
||
|
|
}
|
||
|
|
@media (max-width: 1200px) {
|
||
|
|
.gs-sidebar-left .gs-sidebar,
|
||
|
|
.gs-sidebar-right .gs-sidebar {
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery single sidebar info */
|
||
|
|
.gs-sidebar-info {
|
||
|
|
padding: 30px;
|
||
|
|
border: 1px solid rgba(138, 138, 138, 0.16);
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gs-sidebar-info {
|
||
|
|
padding: 20px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery single sidebar title */
|
||
|
|
.gs-sidebar-title {
|
||
|
|
margin-bottom: 30px;
|
||
|
|
font-size: 34px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery single sidebar info description */
|
||
|
|
.gs-sidebar-description {
|
||
|
|
margin-top: 30px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* gallery single sidebar meta */
|
||
|
|
.gs-sidebar ul.gallery-meta {
|
||
|
|
position: absolute;
|
||
|
|
top: 15px;
|
||
|
|
right: 30px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.gs-sidebar ul.gallery-meta {
|
||
|
|
top: 10px;
|
||
|
|
right: 15px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* if isotope gutters enabled
|
||
|
|
============================== */
|
||
|
|
.gallery-single-with-sidebar .isotope.gutter-1 .isotope-items-wrap,
|
||
|
|
.gallery-single-with-sidebar .isotope.gutter-2 .isotope-items-wrap,
|
||
|
|
.gallery-single-with-sidebar .isotope.gutter-3 .isotope-items-wrap {
|
||
|
|
padding-top: 0;
|
||
|
|
margin-top: 0 !important;
|
||
|
|
margin-left: 0;
|
||
|
|
margin-right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Add to favorites button
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.favorite-btn {
|
||
|
|
font-size: 14px;
|
||
|
|
font-weight: normal;
|
||
|
|
}
|
||
|
|
.fav-inner {
|
||
|
|
position: relative;
|
||
|
|
display: inline-block;
|
||
|
|
width: 16px;
|
||
|
|
cursor: pointer;
|
||
|
|
z-index: 2;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* icon-heart (FontAwesome: https://fontawesome.com/) */
|
||
|
|
.icon-heart {
|
||
|
|
color: rgba(183, 183, 183, 0.45);
|
||
|
|
}
|
||
|
|
.icon-heart-filled {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
.favorite-btn.active .icon-heart-filled {
|
||
|
|
display: inline-block;
|
||
|
|
}
|
||
|
|
.favorite-btn.active .icon-heart-empty {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* call icons */
|
||
|
|
.icon-heart-filled:before {
|
||
|
|
color: #08c1b8;
|
||
|
|
|
||
|
|
font-family: "Font Awesome 5 Free";
|
||
|
|
content: "\f004";
|
||
|
|
font-weight: 900;
|
||
|
|
display: inline-block;
|
||
|
|
font-style: normal;
|
||
|
|
font-variant: normal;
|
||
|
|
text-rendering: auto;
|
||
|
|
-webkit-font-smoothing: antialiased;
|
||
|
|
}
|
||
|
|
.icon-heart-empty:before {
|
||
|
|
font-family: "Font Awesome 5 Free";
|
||
|
|
content: "\f004";
|
||
|
|
font-weight: 900;
|
||
|
|
display: inline-block;
|
||
|
|
font-style: normal;
|
||
|
|
font-variant: normal;
|
||
|
|
text-rendering: auto;
|
||
|
|
-webkit-font-smoothing: antialiased;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* fav-count */
|
||
|
|
.fav-count {
|
||
|
|
display: inline-block;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ----------------------------------------------------------------------- *
|
||
|
|
* Lightgallery: (more info: http://sachinchoolur.github.io/lightGallery)
|
||
|
|
/* ----------------------------------------------------------------------- */
|
||
|
|
|
||
|
|
body.lg-on {
|
||
|
|
overflow: hidden !important;
|
||
|
|
}
|
||
|
|
.lg-backdrop {
|
||
|
|
z-index: 99999;
|
||
|
|
}
|
||
|
|
.lg-outer {
|
||
|
|
z-index: 99999;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Lightgallery sub html (image caption) */
|
||
|
|
.lg-sub-html {
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
@media (max-width : 992px) {
|
||
|
|
.lg-sub-html {
|
||
|
|
padding: 10px 10px 40px 10px;
|
||
|
|
font-size: 14px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.lg-sub-html p {
|
||
|
|
display: inline-block;
|
||
|
|
max-width: 800px;
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Lightgallery thumbnails improvements */
|
||
|
|
.lg-outer .lg-thumb {
|
||
|
|
margin-left: auto;
|
||
|
|
margin-right: auto;
|
||
|
|
}
|
||
|
|
.lg-outer .lg-thumb-item {
|
||
|
|
position: relative;
|
||
|
|
border: 2px solid #FFF;
|
||
|
|
border-radius: 0;
|
||
|
|
}
|
||
|
|
.lg-outer .lg-thumb-item img {
|
||
|
|
position: absolute;
|
||
|
|
left: 50%;
|
||
|
|
top: 50%;
|
||
|
|
max-width: inherit;
|
||
|
|
width: 150%;
|
||
|
|
height: auto;
|
||
|
|
-moz-transform: translate(-50%, -50%);
|
||
|
|
-ms-transform: translate(-50%, -50%);
|
||
|
|
-webkit-transform: translate(-50%, -50%);
|
||
|
|
transform: translate(-50%, -50%);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Lightgallery autoplay progress bar improvements */
|
||
|
|
.lg-progress-bar {
|
||
|
|
background-color: #333;
|
||
|
|
height: 2px;
|
||
|
|
}
|
||
|
|
.lg-progress-bar .lg-progress {
|
||
|
|
background-color: #a90707;
|
||
|
|
height: 2px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* hide next/prev buttons on small screens */
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.lg-actions .lg-next, .lg-actions .lg-prev {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Search results section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#search-results-section {
|
||
|
|
padding-top: 5%;
|
||
|
|
}
|
||
|
|
.srs-inner {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Big search box
|
||
|
|
================== */
|
||
|
|
.big-search-box {
|
||
|
|
position: relative;
|
||
|
|
background-color: rgba(255, 255, 255, 0.11);
|
||
|
|
background-color: rgba(0, 0, 0, 0.5);
|
||
|
|
padding: 50px 3% 30px 3%;
|
||
|
|
margin-top: 40px;
|
||
|
|
z-index: 9;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.big-search-box {
|
||
|
|
padding-left: 20px;
|
||
|
|
padding-right: 20px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
#big-search-form {
|
||
|
|
}
|
||
|
|
.big-search-input-wrap {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
#big-search-input {
|
||
|
|
width: 100%;
|
||
|
|
height: 58px;
|
||
|
|
background-color: #FFF;
|
||
|
|
padding: 5px 50px 5px 10px;
|
||
|
|
font-size: 18px;
|
||
|
|
color: #333;
|
||
|
|
border: 0 solid rgba(136, 136, 136, 0.26);
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
#big-search-input {
|
||
|
|
height: 48px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
#big-search-input:focus {
|
||
|
|
outline: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.big-search-options-wrap {
|
||
|
|
margin-top: 15px;
|
||
|
|
}
|
||
|
|
.big-search-options-wrap label {
|
||
|
|
position: relative;
|
||
|
|
top: -2px;
|
||
|
|
font-size: 16px;
|
||
|
|
font-weight: bold;
|
||
|
|
font-weight: 500;
|
||
|
|
}
|
||
|
|
.big-search-option {
|
||
|
|
display: inline-block;
|
||
|
|
}
|
||
|
|
.big-search-option label {
|
||
|
|
margin: 0;
|
||
|
|
font-size: 16px;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Search results items wrap
|
||
|
|
============================= */
|
||
|
|
.sr-items-wrap {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* search results head */
|
||
|
|
.search-results-head {
|
||
|
|
margin-bottom: 50px;
|
||
|
|
padding-bottom: 10px;
|
||
|
|
border-bottom: 1px solid rgba(132, 132, 132, 0.15);
|
||
|
|
}
|
||
|
|
.search-results-head .srh-title {
|
||
|
|
margin-bottom: 10px;
|
||
|
|
font-size: 28px;
|
||
|
|
}
|
||
|
|
.search-results-head .srh-subtitle {
|
||
|
|
font-size: 14px;
|
||
|
|
color: #888;
|
||
|
|
}
|
||
|
|
.search-results-head .sr-count {
|
||
|
|
display: block;
|
||
|
|
margin-top: 45px;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #888;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.search-results-head .sr-count {
|
||
|
|
margin-top: 20px;
|
||
|
|
margin-bottom: 15px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.search-results-head .sr-count span {
|
||
|
|
font-size: 18px;
|
||
|
|
font-weight: bold;
|
||
|
|
font-weight: 500;
|
||
|
|
color: #666;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* search results item */
|
||
|
|
.search-results-item {
|
||
|
|
margin-bottom: 40px;
|
||
|
|
padding-bottom: 40px;
|
||
|
|
border-bottom: 1px dotted rgba(138, 138, 138, 0.2);
|
||
|
|
}
|
||
|
|
.search-results-item:after {
|
||
|
|
content: "";
|
||
|
|
display: table;
|
||
|
|
clear: both;
|
||
|
|
}
|
||
|
|
.search-results-item ul.bl-item-attr {
|
||
|
|
top: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* search results item image */
|
||
|
|
.sr-item-img {
|
||
|
|
position: relative;
|
||
|
|
float: left;
|
||
|
|
display: block;
|
||
|
|
width: 340px;
|
||
|
|
height: 274px;
|
||
|
|
background-color: rgba(130, 130, 130, 0.1);
|
||
|
|
margin-right: 30px;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.sr-item-img {
|
||
|
|
float: none;
|
||
|
|
width: 100%;
|
||
|
|
height: auto;
|
||
|
|
padding-bottom: 60%;
|
||
|
|
margin-right: 0;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.sr-item-img.glc-gallery {
|
||
|
|
height: auto;
|
||
|
|
padding-bottom: 0;
|
||
|
|
}
|
||
|
|
.sr-item-img.glc-gallery .thumb-list .thumb-list-item:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* search results item info */
|
||
|
|
.sr-item-info {
|
||
|
|
position: relative;
|
||
|
|
display: table;
|
||
|
|
max-width: 800px;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.sr-item-info {
|
||
|
|
padding-left: 3%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.sr-item-category {
|
||
|
|
margin-bottom: 15px;
|
||
|
|
}
|
||
|
|
.sr-item-category a,
|
||
|
|
.sr-item-category span {
|
||
|
|
display: inline-block;
|
||
|
|
padding: 2px 4px 0 4px;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
font-size: 12px;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.sr-item-category a:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sr-item-title {
|
||
|
|
margin: 0 0 10px 0;
|
||
|
|
font-size: 32px;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.sr-item-title > a {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.sr-item-title:hover,
|
||
|
|
.sr-item-title > a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sr-item-meta {
|
||
|
|
margin-top: 15px;
|
||
|
|
font-size: 13px;
|
||
|
|
color: #AAA;
|
||
|
|
}
|
||
|
|
.sr-item-meta a {
|
||
|
|
padding-bottom: 2px;
|
||
|
|
color: #AAA;
|
||
|
|
}
|
||
|
|
.sr-item-meta a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sr-item-description {
|
||
|
|
margin-top: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* no search results found */
|
||
|
|
.no-search-results {
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Search results item attributes
|
||
|
|
================================== */
|
||
|
|
ul.sr-item-attr {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
right: 20px;
|
||
|
|
display: inline-block;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #a7a7a7;
|
||
|
|
}
|
||
|
|
ul.sr-item-attr > li {
|
||
|
|
float: left;
|
||
|
|
margin-right: 10px;
|
||
|
|
}
|
||
|
|
ul.sr-item-attr > li:last-child {
|
||
|
|
margin-right: 0 !important;
|
||
|
|
}
|
||
|
|
ul.sr-item-attr > li a {
|
||
|
|
color: #a7a7a7;
|
||
|
|
}
|
||
|
|
ul.sr-item-attr > li a:hover {
|
||
|
|
color: #08c1b8
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Prices section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#prices-section {
|
||
|
|
padding: 0 3%;
|
||
|
|
}
|
||
|
|
.prices-section-inner {
|
||
|
|
position: relative;
|
||
|
|
z-index: 2;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Price box */
|
||
|
|
.price-box {
|
||
|
|
position: relative;
|
||
|
|
background-color: rgba(255, 255, 255, 0.04);
|
||
|
|
margin: 20px 0;
|
||
|
|
padding-bottom: 30px;
|
||
|
|
text-align: center;
|
||
|
|
z-index: 2;
|
||
|
|
border: 0px solid rgba(130, 130, 130, 0.2);
|
||
|
|
box-shadow: 0 30px 40px -20px rgba(0, 0, 0, 0.25);
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.price-box:hover {
|
||
|
|
}
|
||
|
|
.price-box .pr-box {
|
||
|
|
padding: 20px 15px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Price box heading */
|
||
|
|
.price-box .price-heading {
|
||
|
|
position: relative;
|
||
|
|
padding: 60px 15px;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.pr-box.price-heading:after {
|
||
|
|
content: "";
|
||
|
|
position: absolute;
|
||
|
|
top: 0px;
|
||
|
|
left: 0px;
|
||
|
|
right: 0px;
|
||
|
|
bottom: 0px;
|
||
|
|
background-color: rgba(0, 0, 0, 0.4);
|
||
|
|
}
|
||
|
|
.price-box .price-heading-inner {
|
||
|
|
position: relative;
|
||
|
|
z-index: 2;
|
||
|
|
}
|
||
|
|
.price-box .price-heading i {
|
||
|
|
margin-bottom: 20px;
|
||
|
|
font-size: 32px;
|
||
|
|
}
|
||
|
|
.price-box .price-heading .price-title {
|
||
|
|
margin: 0;
|
||
|
|
font-size: 32px;
|
||
|
|
}
|
||
|
|
@media (max-width: 1400px) {
|
||
|
|
.price-box .price-heading .price-title {
|
||
|
|
font-size: 24px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.price-box .price-heading .price-heading-text {
|
||
|
|
margin-top: 5px;
|
||
|
|
font-size: 14px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Price box price */
|
||
|
|
.price-box .price-box-price {
|
||
|
|
border-bottom: 0px solid rgba(130, 130, 130, 0.15);
|
||
|
|
}
|
||
|
|
.price-box .price-box-price .price {
|
||
|
|
position: relative;
|
||
|
|
display: inline-block;
|
||
|
|
font-size: 62px;
|
||
|
|
font-weight: bold;
|
||
|
|
font-weight: 500;
|
||
|
|
}
|
||
|
|
.price-box .price-box-price .price-currency {
|
||
|
|
position: absolute;
|
||
|
|
top: 10px;
|
||
|
|
left: -15px;
|
||
|
|
font-size: 19px;
|
||
|
|
font-weight: 500;
|
||
|
|
}
|
||
|
|
.price-box .price-box-price .price-tenure {
|
||
|
|
font-size: 14px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Price box features */
|
||
|
|
.price-box .price-features {
|
||
|
|
padding-top: 0;
|
||
|
|
padding-bottom: 0;
|
||
|
|
border-bottom: 0px solid rgba(130, 130, 130, 0.15);
|
||
|
|
}
|
||
|
|
.price-box .price-features > ul > li {
|
||
|
|
padding: 5px 0;
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Price box featured
|
||
|
|
====================== */
|
||
|
|
.price-box.price-box-featured {
|
||
|
|
background: rgba(138, 138, 154, 0.17);
|
||
|
|
}
|
||
|
|
@media (min-width: 1200px) {
|
||
|
|
.price-box.price-box-featured {
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.price-box.price-box-featured:after {
|
||
|
|
position: absolute;
|
||
|
|
display: block;
|
||
|
|
top: 0px;
|
||
|
|
right: 0px;
|
||
|
|
width: 50px;
|
||
|
|
height: 50px;
|
||
|
|
line-height: 50px;
|
||
|
|
background-color: rgba(255, 255, 255, 0.24);
|
||
|
|
text-align: center;
|
||
|
|
font-size: 21px;
|
||
|
|
color: #FFF;
|
||
|
|
/* border-radius: 50px; */
|
||
|
|
|
||
|
|
font-family: "Font Awesome 5 Free";
|
||
|
|
content: "\f164";
|
||
|
|
font-weight: 900;
|
||
|
|
display: inline-block;
|
||
|
|
font-style: normal;
|
||
|
|
font-variant: normal;
|
||
|
|
text-rendering: auto;
|
||
|
|
-webkit-font-smoothing: antialiased;
|
||
|
|
}
|
||
|
|
.price-box:hover.price-box-featured {
|
||
|
|
}
|
||
|
|
.price-box.price-box-featured .price-box-price .price {
|
||
|
|
}
|
||
|
|
.price-box.price-box-featured .btn-price-box {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
border-color: #08c1b8;
|
||
|
|
}
|
||
|
|
.price-box.price-box-featured .btn-price-box:hover {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #03afa6;
|
||
|
|
border-color: #03afa6;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* FAQ section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#faq-section {
|
||
|
|
padding: 5% 3% 0 3%;
|
||
|
|
}
|
||
|
|
.faq-section-inner {
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ---------------------------------------------------------------------- *
|
||
|
|
* Content carousel - CC
|
||
|
|
* Based on OWL Carousel: http://owlcarousel2.github.io/OwlCarousel2/
|
||
|
|
/* ---------------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.owl-carousel {
|
||
|
|
}
|
||
|
|
|
||
|
|
.owl-carousel .owl-item {
|
||
|
|
z-index: 9;
|
||
|
|
overflow: hidden;
|
||
|
|
/* image flickering fix */
|
||
|
|
-webkit-transform: translate3d(0, 0, 0);
|
||
|
|
-moz-transform: translate3d(0, 0, 0);
|
||
|
|
transform: translate3d(0, 0, 0);
|
||
|
|
}
|
||
|
|
.owl-carousel .owl-item .cc-image {
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* OWL controls */
|
||
|
|
.owl-carousel .owl-nav button.owl-prev,
|
||
|
|
.owl-carousel .owl-nav button.owl-next {
|
||
|
|
position: absolute;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Page swiping fix on mobile devices */
|
||
|
|
.owl-carousel.owl-drag .owl-item {
|
||
|
|
-ms-touch-action: pan-y;
|
||
|
|
touch-action: pan-y;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Prev/Next buttons
|
||
|
|
===================== */
|
||
|
|
.owl-nav {
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
.owl-carousel .owl-nav button.owl-prev,
|
||
|
|
.owl-carousel .owl-nav button.owl-next {
|
||
|
|
top: 50%;
|
||
|
|
width: 42px;
|
||
|
|
height: 90px;
|
||
|
|
line-height: 90px;
|
||
|
|
background-color: rgba(0, 0, 0, 0.3);
|
||
|
|
background-size: 78%;
|
||
|
|
padding: 0;
|
||
|
|
margin: 0;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 19px;
|
||
|
|
color: #FFF;
|
||
|
|
opacity: 0;
|
||
|
|
-webkit-border-radius: 0px;
|
||
|
|
-moz-border-radius: 0px;
|
||
|
|
border-radius: 0px;
|
||
|
|
-moz-transform: translateY(-50%);
|
||
|
|
-ms-transform: translateY(-50%);
|
||
|
|
-webkit-transform: translateY(-50%);
|
||
|
|
transform: translateY(-50%);
|
||
|
|
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.owl-carousel .owl-nav button.owl-prev {
|
||
|
|
background-image: url(../vendor/owl-carousel/img/arrow-left-light.png);
|
||
|
|
background-repeat: no-repeat;
|
||
|
|
background-position: center;
|
||
|
|
}
|
||
|
|
.owl-carousel .owl-nav button.owl-next {
|
||
|
|
background-image: url(../vendor/owl-carousel/img/arrow-right-light.png);
|
||
|
|
background-repeat: no-repeat;
|
||
|
|
background-position: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.owl-carousel:hover .owl-nav button.owl-prev,
|
||
|
|
.owl-carousel:hover .owl-nav button.owl-next {
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
.owl-carousel .owl-nav button.owl-prev:hover,
|
||
|
|
.owl-carousel .owl-nav button.owl-next:hover {
|
||
|
|
width: 60px;
|
||
|
|
background-color: rgba(0, 0, 0, 0.6);
|
||
|
|
}
|
||
|
|
.owl-carousel .owl-nav button.owl-prev:focus,
|
||
|
|
.owl-carousel .owl-nav button.owl-next:focus {
|
||
|
|
outline: none;
|
||
|
|
}
|
||
|
|
.owl-carousel .owl-nav button.owl-prev {
|
||
|
|
left: 0px;
|
||
|
|
}
|
||
|
|
.owl-carousel .owl-nav button.owl-next {
|
||
|
|
right: 0px;
|
||
|
|
}
|
||
|
|
.owl-carousel:hover .owl-nav button.owl-prev {
|
||
|
|
left: 0px;
|
||
|
|
}
|
||
|
|
.owl-carousel:hover .owl-nav button.owl-next {
|
||
|
|
right: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Prev/Next buttons disabled (no loop) */
|
||
|
|
.owl-carousel .owl-nav button.owl-prev.disabled {
|
||
|
|
opacity: 0;
|
||
|
|
visibility: hidden;
|
||
|
|
cursor: default;
|
||
|
|
}
|
||
|
|
.owl-carousel .owl-nav button.owl-next.disabled {
|
||
|
|
opacity: 0;
|
||
|
|
visibility: hidden;
|
||
|
|
cursor: default;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Prev/Next nav buttons styles
|
||
|
|
================================ */
|
||
|
|
/* Prev/Next buttons light */
|
||
|
|
.nav-light .owl-nav button.owl-prev, .nav-light .owl-nav button.owl-next,
|
||
|
|
.nav-light.nav-bottom-right .owl-nav button.owl-prev, .nav-light.nav-bottom-right .owl-nav button.owl-next {
|
||
|
|
background-color: #FFF;
|
||
|
|
}
|
||
|
|
.nav-light .owl-nav button.owl-prev {
|
||
|
|
background-image: url(../vendor/owl-carousel/img/arrow-left-dark.png);
|
||
|
|
}
|
||
|
|
.nav-light .owl-nav button.owl-next {
|
||
|
|
background-image: url(../vendor/owl-carousel/img/arrow-right-dark.png);
|
||
|
|
}
|
||
|
|
.nav-light .owl-nav button.owl-prev:hover, .nav-light .owl-nav button.owl-next:hover,
|
||
|
|
.nav-light.nav-bottom-right .owl-nav button.owl-prev:hover, .nav-light.nav-bottom-right .owl-nav button.owl-next:hover {
|
||
|
|
background-color: rgba(255, 255, 255, 0.7);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Prev/Next buttons rounded */
|
||
|
|
.nav-rounded .owl-nav button.owl-prev, .nav-rounded .owl-nav button.owl-next {
|
||
|
|
width: 60px;
|
||
|
|
height: 60px;
|
||
|
|
line-height: 60px;
|
||
|
|
-webkit-border-radius: 50px;
|
||
|
|
-moz-border-radius: 50px;
|
||
|
|
border-radius: 50px;
|
||
|
|
}
|
||
|
|
.nav-rounded:hover .owl-nav button.owl-prev {
|
||
|
|
left: 20px;
|
||
|
|
}
|
||
|
|
.nav-rounded:hover .owl-nav button.owl-next {
|
||
|
|
right: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Prev/Next nav buttons positions
|
||
|
|
=================================== */
|
||
|
|
/* Prev/Next buttons position outside (left/right) */
|
||
|
|
.owl-carousel.nav-outside .owl-nav button.owl-prev, .owl-carousel.nav-outside .owl-nav button.owl-next {
|
||
|
|
width: 40px;
|
||
|
|
height: 40px;
|
||
|
|
line-height: 40px;
|
||
|
|
-webkit-background-size: 80%;
|
||
|
|
background-size: 80%;
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
.owl-carousel.nav-outside .owl-nav button.owl-prev:hover, .owl-carousel.nav-outside .owl-nav button.owl-next:hover {
|
||
|
|
width: 40px;
|
||
|
|
}
|
||
|
|
.owl-carousel.nav-outside .owl-nav button.owl-prev.disabled, .owl-carousel.nav-outside .owl-nav button.owl-next.disabled {
|
||
|
|
opacity: 0;
|
||
|
|
visibility: hidden;
|
||
|
|
}
|
||
|
|
.owl-carousel.nav-outside .owl-nav button.owl-prev {
|
||
|
|
left: -70px;
|
||
|
|
}
|
||
|
|
.owl-carousel.nav-outside .owl-nav button.owl-next {
|
||
|
|
right: -70px;
|
||
|
|
}
|
||
|
|
@media (max-width: 1540px) {
|
||
|
|
.owl-carousel.nav-outside .owl-nav button.owl-prev,
|
||
|
|
.owl-carousel.nav-outside .owl-nav button.owl-next {
|
||
|
|
width: 34px;
|
||
|
|
height: 34px;
|
||
|
|
line-height: 34px;
|
||
|
|
-webkit-background-size: 70%;
|
||
|
|
background-size: 70%;
|
||
|
|
}
|
||
|
|
.owl-carousel.nav-outside .owl-nav button.owl-prev:hover, .owl-carousel.nav-outside .owl-nav button.owl-next:hover {
|
||
|
|
width: 34px;
|
||
|
|
}
|
||
|
|
.owl-carousel.nav-outside .owl-nav button.owl-prev {
|
||
|
|
left: 15px;
|
||
|
|
}
|
||
|
|
.owl-carousel.nav-outside .owl-nav button.owl-next {
|
||
|
|
right: 15px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Prev/Next nav buttons position outside top */
|
||
|
|
.nav-outside-top .owl-nav {
|
||
|
|
position: absolute;
|
||
|
|
top: -50px;
|
||
|
|
right: 30px;
|
||
|
|
width: 72px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.nav-outside-top .owl-nav {
|
||
|
|
right: 15px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.tt-wrap .nav-outside-top .owl-nav {
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.nav-outside-top .owl-nav button.owl-prev, .nav-outside-top .owl-nav button.owl-next {
|
||
|
|
width: 32px;
|
||
|
|
height: 32px;
|
||
|
|
line-height: 32px;
|
||
|
|
background-color: transparent;
|
||
|
|
-webkit-background-size: 100%;
|
||
|
|
background-size: 100%;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #FFF;
|
||
|
|
opacity: 1;
|
||
|
|
-moz-transform: translateY(0);
|
||
|
|
-ms-transform: translateY(0);
|
||
|
|
-webkit-transform: translateY(0);
|
||
|
|
transform: translateY(0);
|
||
|
|
}
|
||
|
|
.nav-outside-top .owl-nav button.owl-prev:hover, .nav-outside-top .owl-nav button.owl-next:hover {
|
||
|
|
width: 32px;
|
||
|
|
background-color: #08c1b8 !important;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.nav-outside-top .owl-nav button.owl-prev.disabled, .nav-outside-top .owl-nav button.owl-next.disabled {
|
||
|
|
background-color: transparent !important;
|
||
|
|
visibility: visible;
|
||
|
|
opacity: .2;
|
||
|
|
color: #A4AAAD;
|
||
|
|
}
|
||
|
|
.nav-outside-top .owl-nav button.owl-prev {
|
||
|
|
background-image: url(../vendor/owl-carousel/img/arrow-left-dark.png);
|
||
|
|
}
|
||
|
|
.nav-outside-top .owl-nav button.owl-next {
|
||
|
|
background-image: url(../vendor/owl-carousel/img/arrow-right-dark.png);
|
||
|
|
}
|
||
|
|
.nav-outside-top .owl-nav button.owl-prev:hover {
|
||
|
|
background-image: url(../vendor/owl-carousel/img/arrow-left-light.png);
|
||
|
|
}
|
||
|
|
.nav-outside-top .owl-nav button.owl-next:hover {
|
||
|
|
background-image: url(../vendor/owl-carousel/img/arrow-right-light.png);
|
||
|
|
}
|
||
|
|
|
||
|
|
.nav-outside-top:hover .owl-nav button.owl-prev {
|
||
|
|
left: 0;
|
||
|
|
}
|
||
|
|
.nav-outside-top:hover .owl-nav button.owl-next {
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Prev/Next nav buttons position bottom right */
|
||
|
|
.nav-bottom-right .owl-nav {
|
||
|
|
position: absolute;
|
||
|
|
top: auto;
|
||
|
|
bottom: 103px;
|
||
|
|
right: 3%;
|
||
|
|
width: 128px;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.nav-bottom-right .owl-nav {
|
||
|
|
right: 20px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.nav-bottom-right .owl-nav button.owl-prev, .nav-bottom-right .owl-nav button.owl-next {
|
||
|
|
width: 60px;
|
||
|
|
height: 60px;
|
||
|
|
line-height: 60px;
|
||
|
|
background-color: rgba(0, 0, 0, 0.4);
|
||
|
|
font-size: 14px;
|
||
|
|
color: #FFF;
|
||
|
|
opacity: 1;
|
||
|
|
-moz-transform: translateY(0);
|
||
|
|
-ms-transform: translateY(0);
|
||
|
|
-webkit-transform: translateY(0);
|
||
|
|
transform: translateY(0);
|
||
|
|
}
|
||
|
|
.nav-bottom-right .owl-nav button.owl-prev:hover, .nav-bottom-right .owl-nav button.owl-next:hover {
|
||
|
|
width: 60px;
|
||
|
|
background-color: rgba(0, 0, 0, 0.6);
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.nav-bottom-right .owl-nav button.owl-prev.disabled, .nav-bottom-right .owl-nav button.owl-next.disabled {
|
||
|
|
visibility: visible;
|
||
|
|
opacity: .2;
|
||
|
|
color: #A4AAAD;
|
||
|
|
}
|
||
|
|
.nav-bottom-right:hover .owl-nav button.owl-prev {
|
||
|
|
left: 0;
|
||
|
|
}
|
||
|
|
.nav-bottom-right:hover .owl-nav button.owl-next {
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Dots
|
||
|
|
======== */
|
||
|
|
.owl-dots, .owl-nav.disabled + .owl-dots {
|
||
|
|
position: absolute;
|
||
|
|
bottom: 5%;
|
||
|
|
margin-top: 0px;
|
||
|
|
left: 50%;
|
||
|
|
-moz-transform: translateX(-50%);
|
||
|
|
-ms-transform: translateX(-50%);
|
||
|
|
-webkit-transform: translateX(-50%);
|
||
|
|
transform: translateX(-50%);
|
||
|
|
}
|
||
|
|
|
||
|
|
.owl-dots button.owl-dot {
|
||
|
|
display: inline-block;
|
||
|
|
}
|
||
|
|
.owl-dots button.owl-dot:focus {
|
||
|
|
outline: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.owl-dots button.owl-dot span {
|
||
|
|
display: inline-block;
|
||
|
|
width: 4px;
|
||
|
|
height: 15px;
|
||
|
|
margin: 0px 4px;
|
||
|
|
background-color: #BBB;
|
||
|
|
-webkit-border-radius: 0;
|
||
|
|
-moz-border-radius: 0;
|
||
|
|
border-radius: 0;
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.owl-dots button.owl-dot.active span,
|
||
|
|
.owl-dots button.owl-dot:hover span {
|
||
|
|
height: 20px;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
}
|
||
|
|
.owl-dots button.owl-dot.active span {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Dots rounded */
|
||
|
|
.dots-rounded .owl-dots button.owl-dot span {
|
||
|
|
width: 8px;
|
||
|
|
height: 8px;
|
||
|
|
-webkit-border-radius: 10px;
|
||
|
|
-moz-border-radius: 10px;
|
||
|
|
border-radius: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Dots positions
|
||
|
|
=================== */
|
||
|
|
/* Dots position outside */
|
||
|
|
.dots-outside {
|
||
|
|
margin-bottom: 50px;
|
||
|
|
}
|
||
|
|
.dots-outside .owl-dots, .dots-outside .owl-nav.disabled + .owl-dots {
|
||
|
|
bottom: -35px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Dots position left */
|
||
|
|
.dots-left .owl-dots, .dots-left .owl-nav.disabled + .owl-dots {
|
||
|
|
left: 3%;
|
||
|
|
-moz-transform: translateX(0);
|
||
|
|
-ms-transform: translateX(0);
|
||
|
|
-webkit-transform: translateX(0);
|
||
|
|
transform: translateX(0);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Dots position right */
|
||
|
|
.dots-right .owl-dots, .dots-right .owl-nav.disabled + .owl-dots {
|
||
|
|
left: inherit;
|
||
|
|
right: 3%;
|
||
|
|
-moz-transform: translateX(0);
|
||
|
|
-ms-transform: translateX(0);
|
||
|
|
-webkit-transform: translateX(0);
|
||
|
|
transform: translateX(0);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Dots position center right */
|
||
|
|
.dots-center-right .owl-dots {
|
||
|
|
position: absolute;
|
||
|
|
top: 50%;
|
||
|
|
bottom: auto !important;
|
||
|
|
left: auto !important;
|
||
|
|
right: 15px;
|
||
|
|
text-align: right;
|
||
|
|
-moz-transform: translateY(-50%) !important;
|
||
|
|
-ms-transform: translateY(-50%) !important;
|
||
|
|
-webkit-transform: translateY(-50%) !important;
|
||
|
|
transform: translateY(-50%) !important;
|
||
|
|
}
|
||
|
|
.dots-center-right .owl-dots button.owl-dot {
|
||
|
|
display: block;
|
||
|
|
line-height: 0;
|
||
|
|
}
|
||
|
|
.dots-center-right .owl-dots button.owl-dot span {
|
||
|
|
margin: 5px 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* if page boxed layout enabled
|
||
|
|
================================ */
|
||
|
|
@media (max-width: 1440px) {
|
||
|
|
.owl-carousel.tt-wrap {
|
||
|
|
padding-left: 0 !important;
|
||
|
|
padding-right: 0 !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* CC item
|
||
|
|
=========== */
|
||
|
|
.owl-carousel .cc-item {
|
||
|
|
position: relative;
|
||
|
|
display: block;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
.owl-carousel .cc-item.bg-image { /* if CC item contains background image */
|
||
|
|
min-height: 300px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* CC item hover
|
||
|
|
================= */
|
||
|
|
|
||
|
|
/* CC item cover */
|
||
|
|
.owl-carousel .cc-item:before {
|
||
|
|
position: absolute;
|
||
|
|
content: "";
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
z-index: 2;
|
||
|
|
opacity: 0;
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* CC item hover light */
|
||
|
|
.owl-carousel.cc-hover-light .cc-item:before {
|
||
|
|
background-color: #FFF;
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.owl-carousel.cc-hover-light:hover .cc-item:before {
|
||
|
|
background-color: #FFF;
|
||
|
|
opacity: .7;
|
||
|
|
}
|
||
|
|
.owl-carousel.cc-hover-light .cc-item:hover:before {
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.owl-carousel.cc-hover-light:hover .cc-item .cc-caption {
|
||
|
|
opacity: .4;
|
||
|
|
}
|
||
|
|
.owl-carousel.cc-hover-light .cc-item:hover .cc-caption {
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* CC item hover dark */
|
||
|
|
.owl-carousel.cc-hover-dark .cc-item:before {
|
||
|
|
background-color: #000;
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.owl-carousel.cc-hover-dark:hover .cc-item:before {
|
||
|
|
opacity: .6;
|
||
|
|
}
|
||
|
|
.owl-carousel.cc-hover-dark .cc-item:hover:before {
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.owl-carousel.cc-hover-dark:hover .cc-item .cc-caption {
|
||
|
|
opacity: .2;
|
||
|
|
}
|
||
|
|
.owl-carousel.cc-hover-dark .cc-item:hover .cc-caption {
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* CC item hover zoom */
|
||
|
|
.owl-carousel.cc-hover-zoom .cc-item {
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
.owl-carousel.cc-hover-zoom .cc-item .cc-image {
|
||
|
|
-webkit-transition: all 3s ease-in-out;
|
||
|
|
-moz-transition: all 3s ease-in-out;
|
||
|
|
-o-transition: all 3s ease-in-out;
|
||
|
|
-ms-transition: all 3s ease-in-out;
|
||
|
|
transition: all 3s ease-in-out;
|
||
|
|
}
|
||
|
|
.owl-carousel.cc-hover-zoom .cc-item:hover .cc-image {
|
||
|
|
-webkit-transform: scale(1.03);
|
||
|
|
-moz-transform: scale(1.03);
|
||
|
|
-o-transform: scale(1.03);
|
||
|
|
-ms-transform: scale(1.03);
|
||
|
|
transform: scale(1.03);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if CC item contains "cc-caption" (makes item cover a bit darker) */
|
||
|
|
.owl-carousel .cc-item.cc-caption-on:before {
|
||
|
|
|
||
|
|
background-color: #000;
|
||
|
|
opacity: .15;
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.owl-carousel .cc-item.cc-caption-on:hover:before {
|
||
|
|
background-color: #000;
|
||
|
|
opacity: .1;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* CC item cover (for carousel center) */
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.gs-carousel-center .owl-carousel.cc-hover-light .cc-item:before,
|
||
|
|
.gs-carousel-center .owl-carousel.cc-hover-dark .cc-item:before {
|
||
|
|
opacity: .8 !important;
|
||
|
|
}
|
||
|
|
.gs-carousel-center .owl-carousel.cc-hover-light .owl-item.center .cc-item:before,
|
||
|
|
.gs-carousel-center .owl-carousel.cc-hover-dark .owl-item.center .cc-item:before {
|
||
|
|
opacity: 0 !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* CC auto width image
|
||
|
|
======================= */
|
||
|
|
.owl-carousel .cc-auto-width-img {
|
||
|
|
width: auto !important;
|
||
|
|
}
|
||
|
|
.owl-carousel .cc-auto-width-img-bg { /* for small devices */
|
||
|
|
display: none;
|
||
|
|
width: 100vw;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.owl-carousel .cc-auto-width-img {
|
||
|
|
display: none !important;
|
||
|
|
}
|
||
|
|
.owl-carousel .cc-auto-width-img-bg { /* for small devices */
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* CC item heights
|
||
|
|
=================== */
|
||
|
|
.owl-carousel, .owl-carousel .cc-item { min-height: 300px; } /* CC item minimum height */
|
||
|
|
|
||
|
|
.owl-carousel.cc-height-1, .owl-carousel.cc-height-1 .cc-item { height: 40vh; }
|
||
|
|
.owl-carousel.cc-height-2, .owl-carousel.cc-height-2 .cc-item { height: 50vh; }
|
||
|
|
.owl-carousel.cc-height-3, .owl-carousel.cc-height-3 .cc-item { height: 60vh; }
|
||
|
|
.owl-carousel.cc-height-4, .owl-carousel.cc-height-4 .cc-item { height: 70vh; }
|
||
|
|
.owl-carousel.cc-height-5, .owl-carousel.cc-height-5 .cc-item { height: 80vh; }
|
||
|
|
.owl-carousel.cc-height-6, .owl-carousel.cc-height-6 .cc-item { height: 90vh; }
|
||
|
|
.owl-carousel.cc-height-full, .owl-carousel.cc-height-full .cc-item { height: 100vh; }
|
||
|
|
|
||
|
|
.owl-carousel.cc-height-1 .owl-stage-outer,
|
||
|
|
.owl-carousel.cc-height-1 .owl-stage,
|
||
|
|
.owl-carousel.cc-height-1 .owl-item,
|
||
|
|
|
||
|
|
.owl-carousel.cc-height-2 .owl-stage-outer,
|
||
|
|
.owl-carousel.cc-height-2 .owl-stage,
|
||
|
|
.owl-carousel.cc-height-2 .owl-item,
|
||
|
|
|
||
|
|
.owl-carousel.cc-height-3 .owl-stage-outer,
|
||
|
|
.owl-carousel.cc-height-3 .owl-stage,
|
||
|
|
.owl-carousel.cc-height-3 .owl-item,
|
||
|
|
|
||
|
|
.owl-carousel.cc-height-4 .owl-stage-outer,
|
||
|
|
.owl-carousel.cc-height-4 .owl-stage,
|
||
|
|
.owl-carousel.cc-height-4 .owl-item,
|
||
|
|
|
||
|
|
.owl-carousel.cc-height-5 .owl-stage-outer,
|
||
|
|
.owl-carousel.cc-height-5 .owl-stage,
|
||
|
|
.owl-carousel.cc-height-5 .owl-item,
|
||
|
|
|
||
|
|
.owl-carousel.cc-height-6 .owl-stage-outer,
|
||
|
|
.owl-carousel.cc-height-6 .owl-stage,
|
||
|
|
.owl-carousel.cc-height-6 .owl-item,
|
||
|
|
|
||
|
|
.owl-carousel.cc-height-full .owl-stage-outer,
|
||
|
|
.owl-carousel.cc-height-full .owl-stage,
|
||
|
|
.owl-carousel.cc-height-full .owl-item, {
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* CC item full height offsets (same as header height)
|
||
|
|
======================================================= */
|
||
|
|
.owl-carousel.cc-height-full,
|
||
|
|
.owl-carousel.cc-height-full .cc-item {
|
||
|
|
height: calc(100vh - 82px);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* CC item full height on small screen */
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.owl-carousel.cc-height-full,
|
||
|
|
.owl-carousel.cc-height-full .cc-item,
|
||
|
|
.owl-carousel.cc-height-m,
|
||
|
|
.owl-carousel.cc-height-m .cc-item {
|
||
|
|
height: calc(100vh - 62px); /* full height minus mobile header height */
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* CC item inner
|
||
|
|
================= */
|
||
|
|
.owl-carousel .cc-item-inner {
|
||
|
|
position: relative;
|
||
|
|
height: 100%;
|
||
|
|
min-height: 300px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* CC caption
|
||
|
|
============== */
|
||
|
|
.owl-carousel .cc-caption {
|
||
|
|
position: absolute;
|
||
|
|
width: auto !important;
|
||
|
|
padding: 0 15px;
|
||
|
|
z-index: 9;
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.owl-carousel .cc-caption.caption-animate {
|
||
|
|
opacity: 0;
|
||
|
|
-webkit-transition: all 0.4s ease-in-out;
|
||
|
|
-moz-transition: all 0.4s ease-in-out;
|
||
|
|
-o-transition: all 0.4s ease-in-out;
|
||
|
|
-ms-transition: all 0.4s ease-in-out;
|
||
|
|
transition: all 0.4s ease-in-out;
|
||
|
|
|
||
|
|
-webkit-transform: translateY(10px);
|
||
|
|
-moz-transform: translateY(10px);
|
||
|
|
-o-transform: translateY(10px);
|
||
|
|
-ms-transform: translateY(10px);
|
||
|
|
transform: translateY(10px);
|
||
|
|
}
|
||
|
|
.owl-carousel .owl-item.active .cc-caption.caption-animate {
|
||
|
|
opacity: 1;
|
||
|
|
-webkit-transform: translateY(0);
|
||
|
|
-moz-transform: translatey(0);
|
||
|
|
-o-transform: translateY(0);
|
||
|
|
-ms-transform: translateY(0);
|
||
|
|
transform: translateY(0);
|
||
|
|
|
||
|
|
-webkit-transition-delay: 0.4s;
|
||
|
|
-moz-transition-delay: 0.4s;
|
||
|
|
transition-delay: 0.4s;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* CC title */
|
||
|
|
.owl-carousel .cc-title {
|
||
|
|
display: block;
|
||
|
|
margin: 0;
|
||
|
|
font-size: 24px;
|
||
|
|
font-weight: bold;
|
||
|
|
color: #FFF;
|
||
|
|
text-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
|
||
|
|
}
|
||
|
|
.owl-carousel .cc-title a {
|
||
|
|
color: #FFF;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.owl-carousel .cc-title a:hover {
|
||
|
|
text-decoration: underline;
|
||
|
|
/* color: #08c1b8; */
|
||
|
|
}
|
||
|
|
|
||
|
|
/* CC description */
|
||
|
|
.owl-carousel .cc-description {
|
||
|
|
margin: 10px 0 0 0;
|
||
|
|
font-weight: normal;
|
||
|
|
color: #FFF;
|
||
|
|
text-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* CC category */
|
||
|
|
.owl-carousel .cc-category {
|
||
|
|
display: block;
|
||
|
|
margin-top: 15px;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
font-size: 12px;
|
||
|
|
font-weight: normal;
|
||
|
|
color: #EEE;
|
||
|
|
}
|
||
|
|
.owl-carousel .cc-category a,
|
||
|
|
.owl-carousel .cc-category span {
|
||
|
|
background-color: #08c1b8;
|
||
|
|
padding: 0 5px;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.owl-carousel .cc-category a:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* CC meta */
|
||
|
|
.cc-meta {
|
||
|
|
margin-top: 15px;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #DDD;
|
||
|
|
}
|
||
|
|
.cc-meta a {
|
||
|
|
padding-bottom: 2px;
|
||
|
|
color: #DDD;
|
||
|
|
}
|
||
|
|
.cc-meta a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* CC item attributes
|
||
|
|
====================== */
|
||
|
|
.owl-carousel ul.cc-item-attr {
|
||
|
|
position: absolute;
|
||
|
|
top: 30px;
|
||
|
|
right: 40px;
|
||
|
|
display: inline-block;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #EEE;
|
||
|
|
z-index: 2;
|
||
|
|
text-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
|
||
|
|
-webkit-transition: all 0.4s ease-in-out;
|
||
|
|
-moz-transition: all 0.4s ease-in-out;
|
||
|
|
-o-transition: all 0.4s ease-in-out;
|
||
|
|
-ms-transition: all 0.4s ease-in-out;
|
||
|
|
transition: all 0.4s ease-in-out;
|
||
|
|
|
||
|
|
-webkit-transform: translateY(10px);
|
||
|
|
-moz-transform: translateY(10px);
|
||
|
|
-o-transform: translateY(10px);
|
||
|
|
-ms-transform: translateY(10px);
|
||
|
|
transform: translateY(10px);
|
||
|
|
}
|
||
|
|
.owl-carousel ul.cc-item-attr > li {
|
||
|
|
float: left;
|
||
|
|
margin-right: 10px;
|
||
|
|
}
|
||
|
|
.owl-carousel ul.cc-item-attr > li:last-child {
|
||
|
|
margin-right: 0 !important;
|
||
|
|
}
|
||
|
|
.owl-carousel ul.cc-item-attr > li a {
|
||
|
|
color: #EEE;
|
||
|
|
}
|
||
|
|
.owl-carousel ul.cc-item-attr > li a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list item favorite-btn */
|
||
|
|
.owl-carousel ul.cc-item-attr .favorite-btn {
|
||
|
|
font-size: 14px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list item comments count */
|
||
|
|
.owl-carousel .cc-item-comments-count {
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* blog list item attributes animated */
|
||
|
|
.owl-carousel ul.cc-item-attr.attr-animated {
|
||
|
|
opacity: 0;
|
||
|
|
visibility: hidden;
|
||
|
|
-webkit-transition: all 0.4s ease-in-out;
|
||
|
|
-moz-transition: all 0.4s ease-in-out;
|
||
|
|
-o-transition: all 0.4s ease-in-out;
|
||
|
|
-ms-transition: all 0.4s ease-in-out;
|
||
|
|
transition: all 0.4s ease-in-out;
|
||
|
|
|
||
|
|
-webkit-transform: translateY(10px);
|
||
|
|
-moz-transform: translateY(10px);
|
||
|
|
-o-transform: translateY(10px);
|
||
|
|
-ms-transform: translateY(10px);
|
||
|
|
transform: translateY(10px);
|
||
|
|
}
|
||
|
|
.owl-carousel .owl-item.active ul.cc-item-attr.attr-animated {
|
||
|
|
opacity: 1;
|
||
|
|
visibility: visible;
|
||
|
|
-webkit-transform: translateY(0);
|
||
|
|
-moz-transform: translatey(0);
|
||
|
|
-o-transform: translateY(0);
|
||
|
|
-ms-transform: translateY(0);
|
||
|
|
transform: translateY(0);
|
||
|
|
|
||
|
|
-webkit-transition-delay: 0.6s;
|
||
|
|
-moz-transition-delay: 0.6s;
|
||
|
|
transition-delay: 0.6s;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* CC caption sizes
|
||
|
|
=================== */
|
||
|
|
|
||
|
|
/* cc caption xs */
|
||
|
|
.cc-caption.cc-caption-xs .cc-title {
|
||
|
|
font-size: 17px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* cc caption sm */
|
||
|
|
.cc-caption.cc-caption-sm .cc-title {
|
||
|
|
font-size: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* cc caption lg */
|
||
|
|
.cc-caption.cc-caption-lg .cc-title {
|
||
|
|
font-size: 32px;
|
||
|
|
}
|
||
|
|
.cc-caption.cc-caption-lg .cc-description {
|
||
|
|
margin: 8px 0 0 0;
|
||
|
|
font-size: 18px;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.cc-caption.cc-caption-lg .cc-title {
|
||
|
|
font-size: 28px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* cc caption xlg */
|
||
|
|
.cc-caption.cc-caption-xlg .cc-title {
|
||
|
|
font-size: 48px;
|
||
|
|
}
|
||
|
|
.cc-caption.cc-caption-xlg .cc-description {
|
||
|
|
margin: 5px 0 0 0;
|
||
|
|
font-size: 20px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.cc-caption.cc-caption-xlg .cc-title {
|
||
|
|
font-size: 38px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.cc-caption.cc-caption-xlg .cc-title {
|
||
|
|
font-size: 28px;
|
||
|
|
}
|
||
|
|
.cc-caption.cc-caption-xlg .cc-description {
|
||
|
|
font-size: 18px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* cc caption xxlg */
|
||
|
|
.cc-caption.cc-caption-xxlg .cc-title {
|
||
|
|
font-size: 92px;
|
||
|
|
line-height: 1.1;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
.cc-caption.cc-caption-xxlg .cc-description {
|
||
|
|
margin: 5px 0 0 0;
|
||
|
|
font-size: 20px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.cc-caption.cc-caption-xxlg .cc-title {
|
||
|
|
font-size: 72px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.cc-caption.cc-caption-xxlg .cc-title {
|
||
|
|
font-size: 42px;
|
||
|
|
}
|
||
|
|
.cc-caption.cc-caption-xxlg .cc-description {
|
||
|
|
font-size: 18px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* CC caption positions
|
||
|
|
======================== */
|
||
|
|
/* position top */
|
||
|
|
.owl-carousel .cc-caption.top-left {
|
||
|
|
top: 10%;
|
||
|
|
left: 5%;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
.owl-carousel .cc-caption.top-center {
|
||
|
|
top: 10%;
|
||
|
|
left: 50%;
|
||
|
|
width: 100% !important;
|
||
|
|
max-width: 800px !important;
|
||
|
|
padding: 0 15px;
|
||
|
|
text-align: center;
|
||
|
|
-moz-transform: translateX(-50%) !important;
|
||
|
|
-ms-transform: translateX(-50%) !important;
|
||
|
|
-webkit-transform: translateX(-50%) !important;
|
||
|
|
transform: translateX(-50%) !important;
|
||
|
|
}
|
||
|
|
.owl-carousel .cc-caption.top-right {
|
||
|
|
top: 10%;
|
||
|
|
right: 5%;
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* position center */
|
||
|
|
.owl-carousel .cc-caption.center-left {
|
||
|
|
top: 50%;
|
||
|
|
left: 13%;
|
||
|
|
text-align: left;
|
||
|
|
-moz-transform: translateY(-50%) !important;
|
||
|
|
-ms-transform: translateY(-50%) !important;
|
||
|
|
-webkit-transform: translateY(-50%) !important;
|
||
|
|
transform: translateY(-50%) !important;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.owl-carousel .cc-caption.center-left {
|
||
|
|
left: 8%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.owl-carousel .cc-caption.center {
|
||
|
|
top: 50%;
|
||
|
|
left: 50%;
|
||
|
|
width: 100% !important;
|
||
|
|
max-width: 800px;
|
||
|
|
padding: 0 15px;
|
||
|
|
text-align: center;
|
||
|
|
-moz-transform: translate(-50%, -50%) !important;
|
||
|
|
-ms-transform: translate(-50%, -50%) !important;
|
||
|
|
-webkit-transform: translate(-50%, -50%) !important;
|
||
|
|
transform: translate(-50%, -50%) !important;
|
||
|
|
}
|
||
|
|
.owl-carousel .cc-caption.center-right {
|
||
|
|
top: 50%;
|
||
|
|
right: 13%;
|
||
|
|
text-align: right;
|
||
|
|
-moz-transform: translateY(-50%) !important;
|
||
|
|
-ms-transform: translateY(-50%) !important;
|
||
|
|
-webkit-transform: translateY(-50%) !important;
|
||
|
|
transform: translateY(-50%) !important;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.owl-carousel .cc-caption.center-right {
|
||
|
|
right: 8%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* position bottom */
|
||
|
|
.owl-carousel .cc-caption.bottom-left {
|
||
|
|
bottom: 10%;
|
||
|
|
left: 5%;
|
||
|
|
margin-right: 8%;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.owl-carousel .cc-caption.bottom-left {
|
||
|
|
bottom: 45px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.owl-carousel .cc-caption.bottom-center {
|
||
|
|
bottom: 10%;
|
||
|
|
left: 50%;
|
||
|
|
width: 100% !important;
|
||
|
|
max-width: 800px;
|
||
|
|
padding: 0 15px;
|
||
|
|
text-align: center;
|
||
|
|
-moz-transform: translateX(-50%) !important;
|
||
|
|
-ms-transform: translateX(-50%) !important;
|
||
|
|
-webkit-transform: translateX(-50%) !important;
|
||
|
|
transform: translateX(-50%) !important;
|
||
|
|
}
|
||
|
|
.owl-carousel .cc-caption.bottom-right {
|
||
|
|
bottom: 10%;
|
||
|
|
left: auto;
|
||
|
|
right: 5%;
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if "nav-bottom-right" enabled */
|
||
|
|
.owl-carousel.nav-bottom-right .cc-caption.bottom-center,
|
||
|
|
.owl-carousel.nav-bottom-right .cc-caption.bottom-right {
|
||
|
|
bottom: 110px;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.owl-carousel.nav-bottom-right .cc-caption.bottom-left,
|
||
|
|
.owl-carousel.nav-bottom-right .cc-caption.bottom-center,
|
||
|
|
.owl-carousel.nav-bottom-right .cc-caption.bottom-right {
|
||
|
|
bottom: 110px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* owl elements
|
||
|
|
================ */
|
||
|
|
/* owl video */
|
||
|
|
.owl-carousel .owl-video-wrapper {
|
||
|
|
z-index: 2;
|
||
|
|
}
|
||
|
|
/* owl video play icon */
|
||
|
|
.owl-carousel .owl-video-play-icon {
|
||
|
|
position: absolute;
|
||
|
|
height: 80px;
|
||
|
|
width: 80px;
|
||
|
|
left: 50%;
|
||
|
|
top: 50%;
|
||
|
|
margin-left: -40px;
|
||
|
|
margin-top: -40px;
|
||
|
|
background-color: rgba(0, 0, 0, 0.7);
|
||
|
|
background-position: center;
|
||
|
|
cursor: pointer;
|
||
|
|
z-index: 1;
|
||
|
|
border-radius: 80px;
|
||
|
|
-webkit-backface-visibility: hidden;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.owl-carousel .owl-video-play-icon:hover {
|
||
|
|
-webkit-transform: scale(1.1);
|
||
|
|
-moz-transform: scale(1.1);
|
||
|
|
-o-transform: scale(1.1);
|
||
|
|
-ms-transform: scale(1.1);
|
||
|
|
transform: scale(1.1);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* cursor grab icon */
|
||
|
|
.owl-carousel.cursor-grab {
|
||
|
|
cursor: -webkit-grab;
|
||
|
|
cursor: grab;
|
||
|
|
}
|
||
|
|
.owl-carousel.cursor-grab:active {
|
||
|
|
cursor: -webkit-grabbing;
|
||
|
|
cursor: grabbing;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* owl fadeIn / fadeOut animations
|
||
|
|
=================================== */
|
||
|
|
|
||
|
|
.owl-item.fadeIn {
|
||
|
|
-webkit-animation-name: fadeIn;
|
||
|
|
animation-name: fadeIn;
|
||
|
|
}
|
||
|
|
.owl-item.fadeOut {
|
||
|
|
-webkit-animation-name: fadeOut;
|
||
|
|
animation-name: fadeOut;
|
||
|
|
}
|
||
|
|
|
||
|
|
@-webkit-keyframes fadeIn {
|
||
|
|
from { opacity: 0; }
|
||
|
|
to { opacity: 1; }
|
||
|
|
}
|
||
|
|
@-webkit-keyframes fadeOut {
|
||
|
|
from { opacity: 1; }
|
||
|
|
to { opacity: 0; }
|
||
|
|
}
|
||
|
|
@keyframes fadeIn {
|
||
|
|
from { opacity: 0; }
|
||
|
|
to { opacity: 1; }
|
||
|
|
}
|
||
|
|
@keyframes fadeOut {
|
||
|
|
from { opacity: 1; }
|
||
|
|
to { opacity: 0; }
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------------------------------ *
|
||
|
|
* Project carousel (related with "Latest work section" and "More projects section")
|
||
|
|
/* ------------------------------------------------------------------------------------ */
|
||
|
|
|
||
|
|
.project-carousel {
|
||
|
|
position: relative;
|
||
|
|
z-index: 9;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Latest work section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#latest-work-section {
|
||
|
|
margin-bottom: -1px;
|
||
|
|
}
|
||
|
|
.latest-work-inner {
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Latest news section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#latest-news-section {
|
||
|
|
}
|
||
|
|
.latest-news-section-inner {
|
||
|
|
}
|
||
|
|
|
||
|
|
.latest-news-carousel {
|
||
|
|
position: relative;
|
||
|
|
padding: 0 3%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.latest-news-carousel .owl-carousel .cc-item:before {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* More projects section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#more-projects-section {
|
||
|
|
margin-bottom: -1px;
|
||
|
|
}
|
||
|
|
.more-projects-inner {
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Blog list carousel section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#blog-list-carousel-section {
|
||
|
|
background-color: #0a0a0a;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (max-width: 767px) {
|
||
|
|
#blog-list-carousel-section .bl-carousel-wrap {
|
||
|
|
padding: 0 !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if page boxed layout enabled */
|
||
|
|
@media (max-width: 1440px) {
|
||
|
|
body.tt-boxed #blog-list-carousel-section .bl-carousel-wrap.tt-wrap {
|
||
|
|
padding-left: 0;
|
||
|
|
padding-right: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list carousel category */
|
||
|
|
#blog-list-carousel-section .owl-carousel .cc-category a,
|
||
|
|
#blog-list-carousel-section .owl-carousel .cc-category span {
|
||
|
|
background-color: rgba(255, 255, 255, 0.15);
|
||
|
|
padding: 0 5px;
|
||
|
|
color: #DCDCDC;
|
||
|
|
}
|
||
|
|
#blog-list-carousel-section .owl-carousel .cc-category a:hover {
|
||
|
|
opacity: 1;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* blog list carousel featured */
|
||
|
|
#blog-list-carousel-section.blc-featured {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list carousel slideshow */
|
||
|
|
#blog-list-carousel-section.blc-featured-slideshow {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list carousel categories */
|
||
|
|
#blog-list-carousel-section.blc-categories {
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Blog list section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#blog-list-section {
|
||
|
|
padding-top: 50px;
|
||
|
|
}
|
||
|
|
@media (max-width : 1600px) {
|
||
|
|
#blog-list-section {
|
||
|
|
padding-top: 3%;
|
||
|
|
padding-bottom: 3%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width : 1000px) {
|
||
|
|
#blog-list-section {
|
||
|
|
padding-top: 4%;
|
||
|
|
padding-bottom: 4%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list inner */
|
||
|
|
.blog-list-inner {
|
||
|
|
padding-left: 4%;
|
||
|
|
padding-right: 4%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if page boxed layout enabled */
|
||
|
|
body.tt-boxed .blog-list-inner.tt-wrap {
|
||
|
|
padding-left: 15px;
|
||
|
|
padding-right: 15px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* isotope in blog list section */
|
||
|
|
#blog-list-section .isotope-items-wrap {
|
||
|
|
padding-top: 0;
|
||
|
|
}
|
||
|
|
@media (max-width : 768px) {
|
||
|
|
#blog-list-section .isotope.col-2 .isotope-item,
|
||
|
|
#blog-list-section .isotope.col-3 .isotope-item,
|
||
|
|
#blog-list-section .isotope.col-4 .isotope-item,
|
||
|
|
#blog-list-section .isotope.col-5 .isotope-item,
|
||
|
|
#blog-list-section .isotope.col-6 .isotope-item {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list classic */
|
||
|
|
.blog-list-classic {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list grid */
|
||
|
|
.blog-list-grid {
|
||
|
|
}
|
||
|
|
.blog-list-grid .blog-list-inner {
|
||
|
|
padding-left: 2%;
|
||
|
|
padding-right: 2%;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* blog list item
|
||
|
|
================== */
|
||
|
|
.blog-list-item {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.blog-list-item {
|
||
|
|
margin-bottom: 15px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list item image */
|
||
|
|
.bl-item-image {
|
||
|
|
display: block;
|
||
|
|
background-repeat: no-repeat;
|
||
|
|
background-position: 50% 50%;
|
||
|
|
-webkit-background-size: cover;
|
||
|
|
background-size: cover;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.bl-item-image:hover {
|
||
|
|
opacity: .9;
|
||
|
|
}
|
||
|
|
.iso-height-1 .blog-list-item .bl-item-image,
|
||
|
|
.iso-height-2 .blog-list-item .bl-item-image {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* blog list item info
|
||
|
|
======================= */
|
||
|
|
.bl-item-info {
|
||
|
|
position: relative;
|
||
|
|
background-color: #FFF;
|
||
|
|
padding: 6% 5% 50px 5%;
|
||
|
|
z-index: 2;
|
||
|
|
}
|
||
|
|
@media (min-width: 768px) {
|
||
|
|
.bl-item-info {
|
||
|
|
margin: -7% 5% 0 5%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list item category */
|
||
|
|
.bl-item-category {
|
||
|
|
margin-right: 90px;
|
||
|
|
margin-bottom: 15px;
|
||
|
|
font-size: 12px;
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
.bl-item-category a,
|
||
|
|
.bl-item-category span {
|
||
|
|
display: inline-block;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
padding: 2px 5px 0 5px;
|
||
|
|
color: #FFF;
|
||
|
|
margin-bottom: 3px;
|
||
|
|
}
|
||
|
|
.bl-item-category a:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list item title */
|
||
|
|
.bl-item-title {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
.bl-item-title, .bl-item-title h2 {
|
||
|
|
display: block;
|
||
|
|
margin: 0;
|
||
|
|
font-weight: bold;
|
||
|
|
font-size: 22px;
|
||
|
|
color: #333;
|
||
|
|
line-height: 1.3;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.bl-item-title:hover, .bl-item-title:focus,
|
||
|
|
.bl-item-title h2:hover, .bl-item-title h2:focus {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.bl-item-title, .bl-item-title h2 {
|
||
|
|
font-size: 24px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list item meta */
|
||
|
|
.bl-item-meta {
|
||
|
|
margin-top: 15px;
|
||
|
|
font-size: 13px;
|
||
|
|
color: #AAA;
|
||
|
|
}
|
||
|
|
.bl-item-meta a {
|
||
|
|
padding-bottom: 2px;
|
||
|
|
color: #AAA;
|
||
|
|
}
|
||
|
|
.bl-item-meta a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list item description */
|
||
|
|
.bl-item-desc {
|
||
|
|
margin-top: 20px;
|
||
|
|
font-size: 15px;
|
||
|
|
color: #666;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list item read more */
|
||
|
|
.bl-item-read-more {
|
||
|
|
position: absolute;
|
||
|
|
right: 20px;
|
||
|
|
bottom: 15px;
|
||
|
|
width: 32px;
|
||
|
|
height: 20px;
|
||
|
|
line-height: 16px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.bl-item-read-more span {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.bl-item-read-more span,
|
||
|
|
.bl-item-read-more span:before,
|
||
|
|
.bl-item-read-more span:after {
|
||
|
|
display: inline-block;
|
||
|
|
width: 5px;
|
||
|
|
height: 5px;
|
||
|
|
background-color: #CCC;
|
||
|
|
border-radius: 20px;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.blog-list-item .bl-item-read-more:hover span,
|
||
|
|
.blog-list-item .bl-item-read-more:hover span:before,
|
||
|
|
.blog-list-item .bl-item-read-more:hover span:after {
|
||
|
|
background-color: #08c1b8;
|
||
|
|
}
|
||
|
|
.bl-item-read-more span:before {
|
||
|
|
position: absolute;
|
||
|
|
bottom: 0;
|
||
|
|
content: "";
|
||
|
|
left: -10px;
|
||
|
|
}
|
||
|
|
.bl-item-read-more span:after {
|
||
|
|
position: absolute;
|
||
|
|
bottom: 0;
|
||
|
|
content: "";
|
||
|
|
left: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* blog list item attributes
|
||
|
|
============================= */
|
||
|
|
ul.bl-item-attr {
|
||
|
|
position: absolute;
|
||
|
|
top: 15px;
|
||
|
|
right: 20px;
|
||
|
|
display: inline-block;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #a7a7a7;
|
||
|
|
}
|
||
|
|
ul.bl-item-attr > li {
|
||
|
|
float: left;
|
||
|
|
margin-right: 10px;
|
||
|
|
}
|
||
|
|
ul.bl-item-attr > li:last-child {
|
||
|
|
margin-right: 0 !important;
|
||
|
|
}
|
||
|
|
ul.bl-item-attr > li a {
|
||
|
|
color: #a7a7a7;
|
||
|
|
}
|
||
|
|
ul.bl-item-attr > li a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list item favorite-btn */
|
||
|
|
ul.bl-item-attr .favorite-btn {
|
||
|
|
font-size: 14px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog list item comments count */
|
||
|
|
.bl-item-comments-count {
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* blog list item if isotope "col-1" is enabled
|
||
|
|
================================================ */
|
||
|
|
#blog-list-section .isotope.col-1 .isotope-items-wrap {
|
||
|
|
max-width: 1140px;
|
||
|
|
margin: 0 auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
#blog-list-section .isotope.col-1 .iso-height-1 .blog-list-item,
|
||
|
|
#blog-list-section .isotope.col-1 .iso-height-2 .blog-list-item {
|
||
|
|
display: block;
|
||
|
|
padding-bottom: 50%;
|
||
|
|
}
|
||
|
|
|
||
|
|
#blog-list-section .isotope.col-1 .bl-item-info {
|
||
|
|
padding-bottom: 5%;
|
||
|
|
}
|
||
|
|
@media (min-width: 768px) {
|
||
|
|
#blog-list-section .isotope.col-1 .bl-item-info {
|
||
|
|
margin: -7% 5% 3% 5%;
|
||
|
|
padding: 5% 5% 5% 5%;
|
||
|
|
border: none;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
#blog-list-section .isotope.col-1 .bl-item-title,
|
||
|
|
#blog-list-section .isotope.col-1 .bl-item-title h2 {
|
||
|
|
font-size: 38px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
#blog-list-section .isotope.col-1 .bl-item-title,
|
||
|
|
#blog-list-section .isotope.col-1 .bl-item-title h2 {
|
||
|
|
font-size: 24px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
#blog-list-section .isotope.col-1 .bl-item-desc {
|
||
|
|
font-size: inherit;
|
||
|
|
}
|
||
|
|
|
||
|
|
#blog-list-section .isotope.col-1 ul.bl-item-attr {
|
||
|
|
top: 20px;
|
||
|
|
right: 25px;
|
||
|
|
left: auto;
|
||
|
|
bottom: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* blog list simple
|
||
|
|
==================== */
|
||
|
|
#blog-list-section.blog-list-simple {
|
||
|
|
padding-top: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 991px) {
|
||
|
|
#blog-list-section.blog-list-simple .bl-item-info {
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
#blog-list-section.blog-list-simple .bl-item-info .bl-item-category {
|
||
|
|
margin-right: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Blog single
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#blog-single-cection {
|
||
|
|
padding: 50px 0;
|
||
|
|
}
|
||
|
|
@media (max-width : 1600px) {
|
||
|
|
#blog-single-cection {
|
||
|
|
padding-top: 3%;
|
||
|
|
padding-bottom: 3%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width : 1000px) {
|
||
|
|
#blog-single-cection {
|
||
|
|
padding-top: 4%;
|
||
|
|
padding-bottom: 4%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog single simple */
|
||
|
|
.blog-single-simple {
|
||
|
|
}
|
||
|
|
body.tt-boxed .blog-single-simple .tt-wrap {
|
||
|
|
max-width: 1140px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog single inner */
|
||
|
|
.blog-single-inner {
|
||
|
|
position: relative;
|
||
|
|
padding-left: 5%;
|
||
|
|
padding-right: 5%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if page boxed layout enabled */
|
||
|
|
body.tt-boxed .blog-single-inner.tt-wrap {
|
||
|
|
padding-left: 15px;
|
||
|
|
padding-right: 15px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Blog single post
|
||
|
|
==================== */
|
||
|
|
.blog-single-post {
|
||
|
|
}
|
||
|
|
.blog-single-post-inner {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
#blog-single-cection.blog-single-simple {
|
||
|
|
max-width: 1140px;
|
||
|
|
margin: 0 auto;
|
||
|
|
padding-top: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog single post featured image */
|
||
|
|
.blog-single-featured-image {
|
||
|
|
}
|
||
|
|
.blog-single-featured-image.bg-image { /* for background image height */
|
||
|
|
padding-bottom: 60%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog single post heading */
|
||
|
|
.blog-single-post-heading {
|
||
|
|
position: relative;
|
||
|
|
background-color: #FFF;
|
||
|
|
padding: 5%;
|
||
|
|
z-index: 1;
|
||
|
|
}
|
||
|
|
.blog-single-post-title {
|
||
|
|
margin: 0;
|
||
|
|
font-size: 42px;
|
||
|
|
font-weight: bold;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.blog-single-featured-image + .blog-single-post-heading {
|
||
|
|
margin: -10% 5% 0 5%;
|
||
|
|
}
|
||
|
|
@media (max-width : 992px) {
|
||
|
|
.blog-single-post-title {
|
||
|
|
font-size: 28px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.blog-single-post-category {
|
||
|
|
font-size: 12px;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.blog-single-post-category a {
|
||
|
|
display: inline-block;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
margin-top: 20px;
|
||
|
|
margin-bottom: 3px;
|
||
|
|
padding: 2px 5px 0 5px;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.blog-single-post-category a:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog single post content */
|
||
|
|
.post-content {
|
||
|
|
}
|
||
|
|
|
||
|
|
.post-content .single-post-image {
|
||
|
|
margin: 30px 0;
|
||
|
|
}
|
||
|
|
.single-post-image-caption {
|
||
|
|
margin-top: 5px;
|
||
|
|
font-size: 13px;
|
||
|
|
font-style: italic;
|
||
|
|
color: #C0C0C0;
|
||
|
|
}
|
||
|
|
.single-post-image-caption a {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.single-post-image-caption a:hover {
|
||
|
|
}
|
||
|
|
|
||
|
|
.post-content .owl-carousel {
|
||
|
|
margin: 30px 0 30px 0;
|
||
|
|
}
|
||
|
|
.post-content .cc-item {
|
||
|
|
display: block;
|
||
|
|
padding-bottom: 60%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Blog single attributes
|
||
|
|
============================ */
|
||
|
|
.blog-single-attributes {
|
||
|
|
margin-top: 20px;
|
||
|
|
margin-bottom: 40px;
|
||
|
|
}
|
||
|
|
.blog-single-meta-wrap {
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
.blog-single-post .author-avatar {
|
||
|
|
position: relative;
|
||
|
|
display: block;
|
||
|
|
width: 40px;
|
||
|
|
height: 40px;
|
||
|
|
}
|
||
|
|
.blog-single-post .author-avatar:before {
|
||
|
|
position: absolute;
|
||
|
|
content: "";
|
||
|
|
top: 50%;
|
||
|
|
right: -21px;
|
||
|
|
width: 21px;
|
||
|
|
height: 1px;
|
||
|
|
border-bottom: 1px dotted rgba(136, 136, 136, 0.16);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog single meta */
|
||
|
|
.blog-single-meta {
|
||
|
|
margin-left: 20px;
|
||
|
|
padding: 0 0 0 15px;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #999;
|
||
|
|
overflow: hidden;
|
||
|
|
float: left;
|
||
|
|
border-left: 1px dotted rgba(136, 136, 136, 0.16);
|
||
|
|
}
|
||
|
|
.blog-single-meta .article-author {
|
||
|
|
font-size: 16px;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.blog-single-meta .article-author a {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.blog-single-meta .article-author a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.blog-single-meta .article-time-cat {
|
||
|
|
font-size: 14px;
|
||
|
|
color: #b1b1b1;
|
||
|
|
}
|
||
|
|
.blog-single-meta .article-time-cat a {
|
||
|
|
color: #b1b1b1;
|
||
|
|
}
|
||
|
|
.blog-single-meta .article-time-cat a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.blog-single-meta .article-time {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog single links */
|
||
|
|
.blog-single-links {
|
||
|
|
margin: 6px 0 0 0;
|
||
|
|
text-align: right;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #333;
|
||
|
|
line-height: 1.5;
|
||
|
|
}
|
||
|
|
@media (max-width: 420px) {
|
||
|
|
.blog-single-links {
|
||
|
|
margin-top: 20px;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.blog-single-links > li {
|
||
|
|
margin-left: 3px;
|
||
|
|
}
|
||
|
|
.blog-single-links a {
|
||
|
|
display: inline-block;
|
||
|
|
font-weight: bold;
|
||
|
|
font-weight: 600;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.blog-single-links a:hover, .blog-single-links a:focus, .blog-single-links .favorite-btn:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
.leave-comment-btn {
|
||
|
|
}
|
||
|
|
.blog-single-comment-count {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog single tags */
|
||
|
|
.blog-single-tags {
|
||
|
|
margin-top: 10px;
|
||
|
|
font-size: 14px;
|
||
|
|
font-weight: bold;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
.blog-single-tags span {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.blog-single-tags > ul {
|
||
|
|
list-style: none;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
.blog-single-tags > ul > li {
|
||
|
|
float: left;
|
||
|
|
margin: 3px;
|
||
|
|
}
|
||
|
|
.blog-single-tags a {
|
||
|
|
display: block;
|
||
|
|
background-color: rgba(138, 138, 154, 0.15);
|
||
|
|
padding: 2px 8px;
|
||
|
|
font-size: 13px;
|
||
|
|
font-weight: normal;
|
||
|
|
color: #333;
|
||
|
|
-webkit-transition: all .2s ease-in-out;
|
||
|
|
-moz-transition: all .2s ease-in-out;
|
||
|
|
-ms-transition: all .2s ease-in-out;
|
||
|
|
-o-transition: all .2s ease-in-out;
|
||
|
|
transition: all .2s ease-in-out;
|
||
|
|
}
|
||
|
|
.blog-single-tags a:hover {
|
||
|
|
background-color: #08c1b8;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog single post share */
|
||
|
|
.blog-single-share {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
right: 100%;
|
||
|
|
padding: 0 30px 0 0;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.blog-single-share > ul {
|
||
|
|
list-style: none;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
.blog-single-share > ul > li {
|
||
|
|
}
|
||
|
|
.blog-single-share > ul > li > .btn {
|
||
|
|
margin: 5px 0;
|
||
|
|
}
|
||
|
|
.bss-text {
|
||
|
|
font-size: 13px;
|
||
|
|
}
|
||
|
|
@media (max-width: 1585px) {
|
||
|
|
.blog-single-share {
|
||
|
|
position: static;
|
||
|
|
background-color: transparent !important;
|
||
|
|
padding: 0;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
.blog-single-share > ul > li {
|
||
|
|
display: inline-block;
|
||
|
|
margin: 0 3px;
|
||
|
|
}
|
||
|
|
.bss-text {
|
||
|
|
font-size: inherit;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.blog-single-share {
|
||
|
|
position: fixed;
|
||
|
|
top: auto;
|
||
|
|
bottom: -1px;
|
||
|
|
right: 60px;
|
||
|
|
left: 60px;
|
||
|
|
background-color: rgba(255, 255, 255, 0.85);
|
||
|
|
padding: 0 !important;
|
||
|
|
text-align: center;
|
||
|
|
z-index: 999;
|
||
|
|
}
|
||
|
|
.blog-single-share > ul > li {
|
||
|
|
display: inline-block;
|
||
|
|
margin: 0 3%;
|
||
|
|
}
|
||
|
|
.blog-single-share > ul > li > .btn {
|
||
|
|
border-radius: 50px;
|
||
|
|
}
|
||
|
|
.bss-text {
|
||
|
|
display: none !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.blog-single-share > ul > li {
|
||
|
|
margin: 0 2px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Blog single nav
|
||
|
|
=================== */
|
||
|
|
.blog-single-nav {
|
||
|
|
margin-top: 60px;
|
||
|
|
padding-top: 40px;
|
||
|
|
overflow: hidden;
|
||
|
|
border-top: 1px dotted rgba(150, 150, 150, 0.3);
|
||
|
|
}
|
||
|
|
|
||
|
|
.bs-nav-col {
|
||
|
|
float: left;
|
||
|
|
width: 50%;
|
||
|
|
}
|
||
|
|
.bs-nav-left {
|
||
|
|
padding-right: 5%;
|
||
|
|
border-right: 1px solid rgba(136, 136, 136, 0.16);
|
||
|
|
}
|
||
|
|
.bs-nav-right {
|
||
|
|
padding-left: 5%;
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
|
||
|
|
.bs-nav-text {
|
||
|
|
margin-bottom: 10px;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
.bs-nav-title, .bs-nav-title h4 {
|
||
|
|
margin: 0;
|
||
|
|
font-size: 18px;
|
||
|
|
color: #333;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.bs-nav-title, .bs-nav-title h4 {
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.bs-nav-title:hover, .bs-nav-title h4:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Blog single related posts
|
||
|
|
============================= */
|
||
|
|
.related-posts {
|
||
|
|
margin-top: 60px;
|
||
|
|
padding-top: 60px;
|
||
|
|
overflow: hidden;
|
||
|
|
border-top: 1px dotted rgba(150, 150, 150, 0.3);
|
||
|
|
}
|
||
|
|
.related-posts-heading {
|
||
|
|
font-size: 21px;
|
||
|
|
margin: 0 0 30px 0;
|
||
|
|
padding: 0 0 0 16px;
|
||
|
|
border-left-width: 4px;
|
||
|
|
border-left-style: solid;
|
||
|
|
border-color: #08c1b8;
|
||
|
|
}
|
||
|
|
.related-posts-item {
|
||
|
|
}
|
||
|
|
.related-posts-item .rp-item-image {
|
||
|
|
display: block;
|
||
|
|
padding-bottom: 70%;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.related-posts-item .rp-item-image:hover {
|
||
|
|
opacity: .9;
|
||
|
|
}
|
||
|
|
.rp-item-info {
|
||
|
|
}
|
||
|
|
.related-posts-item .rp-item-title,
|
||
|
|
.related-posts-item .rp-item-title h4 {
|
||
|
|
margin: 10px 0 10px 0;
|
||
|
|
font-size: 18px;
|
||
|
|
color: #333;
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.related-posts-item .rp-item-title:hover,
|
||
|
|
.related-posts-item .rp-item-title h4:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.related-posts-item .rp-item-category {
|
||
|
|
font-size: 12px;
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
.related-posts-item .rp-item-category a {
|
||
|
|
display: inline-block;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
padding: 2px 5px 0 5px;
|
||
|
|
color: #FFF;
|
||
|
|
margin-bottom: 3px;
|
||
|
|
}
|
||
|
|
.related-posts-item .rp-item-category a:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
|
||
|
|
.related-posts .owl-carousel {
|
||
|
|
min-height: 0;
|
||
|
|
}
|
||
|
|
/* disable nav-outside on small screens */
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.related-posts .nav-outside-top .owl-nav {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Blog single post comments
|
||
|
|
============================= */
|
||
|
|
#blog-post-comments {
|
||
|
|
margin-top: 60px;
|
||
|
|
padding-top: 60px;
|
||
|
|
border-top: 1px dotted rgba(150, 150, 150, 0.3);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog single comments heading */
|
||
|
|
.comments-heading {
|
||
|
|
margin: 0 0 50px 0;
|
||
|
|
font-size: 28px;
|
||
|
|
}
|
||
|
|
.comments-heading span {
|
||
|
|
font-size: 48px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog single comments */
|
||
|
|
.media-list {
|
||
|
|
margin-top: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.media {
|
||
|
|
margin-top: 30px;
|
||
|
|
}
|
||
|
|
.media-object {
|
||
|
|
position: relative;
|
||
|
|
display: block;
|
||
|
|
width: 50px;
|
||
|
|
height: 50px;
|
||
|
|
-webkit-transition: all .2s ease-in-out;
|
||
|
|
-moz-transition: all .2s ease-in-out;
|
||
|
|
-ms-transition: all .2s ease-in-out;
|
||
|
|
-o-transition: all .2s ease-in-out;
|
||
|
|
transition: all .2s ease-in-out;
|
||
|
|
}
|
||
|
|
.media-object:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
.media-object:before {
|
||
|
|
position: absolute;
|
||
|
|
content: "";
|
||
|
|
top: 50%;
|
||
|
|
right: -21px;
|
||
|
|
width: 21px;
|
||
|
|
height: 1px;
|
||
|
|
border-bottom: 1px solid rgba(136, 136, 136, 0.16);
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.media-object {
|
||
|
|
margin-top: 5px;
|
||
|
|
margin-left: 5px;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
.media-object:before {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
.media-object:after {
|
||
|
|
position: absolute;
|
||
|
|
content: "";
|
||
|
|
bottom: -21px;
|
||
|
|
right: 50%;
|
||
|
|
width: 1px;
|
||
|
|
height: 21px;
|
||
|
|
border-left: 1px dotted rgba(136, 136, 136, 0.16);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.media-left, .media > .pull-left {
|
||
|
|
padding: 0;
|
||
|
|
margin-right: 20px;
|
||
|
|
}
|
||
|
|
.media-right, .media > .pull-right {
|
||
|
|
padding: 0;
|
||
|
|
margin-left: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.media-heading {
|
||
|
|
text-transform: none;
|
||
|
|
letter-spacing: 0;
|
||
|
|
font-size: 15px;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.media-heading a {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.media-heading a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.media, .media-body {
|
||
|
|
overflow: inherit;
|
||
|
|
}
|
||
|
|
.media-body {
|
||
|
|
width: 100%;
|
||
|
|
padding: 20px;
|
||
|
|
margin-bottom: 2px;
|
||
|
|
border: 1px solid rgba(136, 136, 136, 0.16);
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.media-body {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.media-body .article-time {
|
||
|
|
display: block;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
font-size: 13px;
|
||
|
|
color: #BBB;
|
||
|
|
}
|
||
|
|
.media-text {
|
||
|
|
clear: both;
|
||
|
|
padding-top: 12px;
|
||
|
|
font-size: 15px;
|
||
|
|
border-top: 1px dotted rgba(150, 150, 150, 0.18);
|
||
|
|
}
|
||
|
|
.media-reply {
|
||
|
|
text-align: right;
|
||
|
|
font-size: 13px;
|
||
|
|
}
|
||
|
|
.media-reply a {
|
||
|
|
color: #BBB;
|
||
|
|
}
|
||
|
|
.media-reply a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.media-reply .btn-xs {
|
||
|
|
border-width: 1px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* blog single post comment form */
|
||
|
|
#post-comment-form {
|
||
|
|
background-color: rgba(131, 131, 146, 0.13);
|
||
|
|
margin-top: 100px;
|
||
|
|
padding: 5%;
|
||
|
|
border: 1px solid rgba(136, 136, 136, 0.09);
|
||
|
|
}
|
||
|
|
#post-comment-form .reminder {
|
||
|
|
margin: 20px 0 0 0;
|
||
|
|
padding-left: 20px;
|
||
|
|
font-size: 14px;
|
||
|
|
font-weight: normal;
|
||
|
|
color: #999;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
#post-comment-form .reminder-checkbox {
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Blog sidebar
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.sidebar {
|
||
|
|
}
|
||
|
|
.sidebar.sidebar-left {
|
||
|
|
padding-right: 60px;
|
||
|
|
}
|
||
|
|
.sidebar.sidebar-right {
|
||
|
|
padding-left: 60px;
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.sidebar {
|
||
|
|
margin-left: 0 !important;
|
||
|
|
margin-right: 0 !important;
|
||
|
|
padding-left: 0 !important;
|
||
|
|
padding-right: 0 !important;
|
||
|
|
border-left: none !important;
|
||
|
|
border-right: none !important;
|
||
|
|
|
||
|
|
margin-top: 30px;
|
||
|
|
padding-top: 40px;
|
||
|
|
border-top: 1px dotted rgba(150, 150, 150, 0.18);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Blog sidebar widgets
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.sidebar-widget {
|
||
|
|
margin-top: 50px;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Sidebar headings */
|
||
|
|
.sidebar-heading {
|
||
|
|
margin-bottom: 30px;
|
||
|
|
padding: 0 0 0 16px;
|
||
|
|
font-size: 21px;
|
||
|
|
font-weight: bold;
|
||
|
|
border-left-width: 4px;
|
||
|
|
border-left-style: solid;
|
||
|
|
border-color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Sidebar hr */
|
||
|
|
.sidebar-heading + hr {
|
||
|
|
margin-top: -17px !important;
|
||
|
|
margin-bottom: 35px !important;
|
||
|
|
}
|
||
|
|
.sidebar hr {
|
||
|
|
width: 30px;
|
||
|
|
text-align: left;
|
||
|
|
margin-left: 0;
|
||
|
|
border-top: 2px solid #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Blog author (about me) */
|
||
|
|
.blog-author {
|
||
|
|
}
|
||
|
|
.blog-author-img {
|
||
|
|
display: block;
|
||
|
|
float: left;
|
||
|
|
width: 105px;
|
||
|
|
height: 105px;
|
||
|
|
margin-right: 20px;
|
||
|
|
}
|
||
|
|
.blog-author-img:hover {
|
||
|
|
opacity: .9;
|
||
|
|
}
|
||
|
|
@media (max-width: 1200px) {
|
||
|
|
.sidebar .blog-author-img {
|
||
|
|
float: none;
|
||
|
|
margin: 0 0 20px 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.sidebar .blog-author-img {
|
||
|
|
float: left;
|
||
|
|
width: 105px;
|
||
|
|
height: 105px;
|
||
|
|
padding: 0;
|
||
|
|
margin: 0 20px 0 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 440px) {
|
||
|
|
.sidebar .blog-author-img {
|
||
|
|
float: none;
|
||
|
|
margin: 0 0 20px 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.blog-author-info {
|
||
|
|
display: table;
|
||
|
|
}
|
||
|
|
.blog-author-name {
|
||
|
|
text-transform: none;
|
||
|
|
letter-spacing: 0;
|
||
|
|
margin: 0;
|
||
|
|
font-size: 17px;
|
||
|
|
}
|
||
|
|
.blog-author-name a {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.blog-author-name a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.blog-author-sub {
|
||
|
|
margin-bottom: 5px;
|
||
|
|
font-size: 13px;
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
.blog-author-text {
|
||
|
|
margin: 0;
|
||
|
|
font-size: 14px;
|
||
|
|
}
|
||
|
|
.blog-author-more {
|
||
|
|
display: block;
|
||
|
|
margin-top: 15px;
|
||
|
|
text-align: right;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #BBB;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Blog sidebar search */
|
||
|
|
.sidebar-search {
|
||
|
|
}
|
||
|
|
#blog-search-form {
|
||
|
|
}
|
||
|
|
#blog-search-form button {
|
||
|
|
}
|
||
|
|
#blog-search-form .form-control {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Blog sidebar socia */
|
||
|
|
.sidebar-social {
|
||
|
|
}
|
||
|
|
.sidebar-social .btn-social-min {
|
||
|
|
width: 55px;
|
||
|
|
height: 55px;
|
||
|
|
line-height: 55px;
|
||
|
|
font-size: 21px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Blog sidebar subscribe */
|
||
|
|
#sidebar-subscribe-form {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
#sidebar-subscribe {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Blog sidebar categories */
|
||
|
|
.sidebar-categories {
|
||
|
|
}
|
||
|
|
.sidebar-categories > ul > li {
|
||
|
|
padding: 5px 0;
|
||
|
|
border-top: 1px dotted rgba(150, 150, 150, 0.18);
|
||
|
|
}
|
||
|
|
.sidebar-categories > ul > li > a {
|
||
|
|
display: block;
|
||
|
|
padding: 6px 0;
|
||
|
|
text-decoration: none;
|
||
|
|
font-size: 16px;
|
||
|
|
color: #333;
|
||
|
|
line-height: 1;
|
||
|
|
}
|
||
|
|
.sidebar-categories > ul > li > a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.sidebar-categories > ul > li:first-child {
|
||
|
|
padding-top: 0;
|
||
|
|
border: 0;
|
||
|
|
}
|
||
|
|
.sidebar-categories > ul > li > a span {
|
||
|
|
position: relative;
|
||
|
|
float: right;
|
||
|
|
top: -3px;
|
||
|
|
background-color: #ececec;
|
||
|
|
padding: 8px 6px 4px 6px;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 12px;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.sidebar-categories > ul > li > a:hover span {
|
||
|
|
background-color: #08c1b8;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Blog sidebar recent post list */
|
||
|
|
.sidebar-post-list {
|
||
|
|
}
|
||
|
|
.sidebar-post-list > ul > li {
|
||
|
|
list-style: none;
|
||
|
|
overflow: hidden;
|
||
|
|
margin-bottom: 30px;
|
||
|
|
}
|
||
|
|
.sidebar-post-list > ul > li:last-child {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
border: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sidebar-post-list .post-thumb {
|
||
|
|
float: left;
|
||
|
|
display: block;
|
||
|
|
margin: 0 15px 0 0;
|
||
|
|
width: 80px;
|
||
|
|
height: 65px;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
.sidebar-post-list .post-thumb:hover {
|
||
|
|
}
|
||
|
|
|
||
|
|
.sidebar-post-list .post-data {
|
||
|
|
display: table;
|
||
|
|
}
|
||
|
|
.sidebar-post-list .post-data .post-title {
|
||
|
|
margin: 0 0 2px 0;
|
||
|
|
font-size: 16px;
|
||
|
|
font-weight: bold;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
.sidebar-post-list .post-data .post-title a {
|
||
|
|
display: block;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.sidebar-post-list .post-data .post-title a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.sidebar-post-list .post-data .author {
|
||
|
|
display: block;
|
||
|
|
font-size: 14px;
|
||
|
|
line-height: 15px;
|
||
|
|
}
|
||
|
|
.sidebar-post-list .post-data .author a {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.sidebar-post-list .post-data .author a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.sidebar-post-list .post-data .date {
|
||
|
|
display: block;
|
||
|
|
font-size: 13px;
|
||
|
|
color: #b1b1b1;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Blog sidebar post comments list */
|
||
|
|
.sidebar-comments-list {
|
||
|
|
}
|
||
|
|
|
||
|
|
.sidebar-comment-wrap {
|
||
|
|
margin-bottom: 25px;
|
||
|
|
}
|
||
|
|
.sidebar-comment-wrap:last-child {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
.sidebar-comment-meta {
|
||
|
|
display: table;
|
||
|
|
}
|
||
|
|
.sidebar-comment-avatar {
|
||
|
|
float: left;
|
||
|
|
display: block;
|
||
|
|
margin: 0 15px 0 0;
|
||
|
|
overflow: hidden;
|
||
|
|
width: 40px;
|
||
|
|
height: 40px;
|
||
|
|
-webkit-transition: all .2s ease-in-out;
|
||
|
|
-moz-transition: all .2s ease-in-out;
|
||
|
|
-ms-transition: all .2s ease-in-out;
|
||
|
|
-o-transition: all .2s ease-in-out;
|
||
|
|
transition: all .2s ease-in-out;
|
||
|
|
}
|
||
|
|
.sidebar-comment-avatar:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
.sidebar-comment-data {
|
||
|
|
}
|
||
|
|
.sidebar-comment-data .author {
|
||
|
|
display: block;
|
||
|
|
font-size: 14px;
|
||
|
|
}
|
||
|
|
.sidebar-comment-data .author a {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.sidebar-comment-data .author a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.sidebar-comment-data .date {
|
||
|
|
display: block;
|
||
|
|
font-size: 13px;
|
||
|
|
color: #b1b1b1;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sidebar-comment-wrap .sidebar-comment {
|
||
|
|
clear: both;
|
||
|
|
margin-top: 10px;
|
||
|
|
font-size: 14px;
|
||
|
|
font-style: italic;
|
||
|
|
}
|
||
|
|
.sidebar-comment-wrap .sidebar-comment a {
|
||
|
|
display: block;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.sidebar-comment-wrap .sidebar-comment a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.sidebar-comment-wrap .sidebar-comment p {
|
||
|
|
margin-bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Blog sidebar tags */
|
||
|
|
.sidebar-tags {
|
||
|
|
}
|
||
|
|
.sidebar-tags > ul {
|
||
|
|
list-style: none;
|
||
|
|
padding: 0;
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
.sidebar-tags > ul > li {
|
||
|
|
float: left;
|
||
|
|
margin: 3px;
|
||
|
|
}
|
||
|
|
.sidebar-tags a {
|
||
|
|
display: block;
|
||
|
|
background-color: rgba(138, 138, 154, 0.15);
|
||
|
|
padding: 2px 8px;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #333;
|
||
|
|
-webkit-transition: all .2s ease-in-out;
|
||
|
|
-moz-transition: all .2s ease-in-out;
|
||
|
|
-ms-transition: all .2s ease-in-out;
|
||
|
|
-o-transition: all .2s ease-in-out;
|
||
|
|
transition: all .2s ease-in-out;
|
||
|
|
}
|
||
|
|
.sidebar-tags a:hover {
|
||
|
|
background-color: #08c1b8;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Blog sidebar photo stream */
|
||
|
|
.sidebar-photo-stream {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Blog sidebar meta */
|
||
|
|
.sidebar-meta {
|
||
|
|
}
|
||
|
|
.sidebar-meta ul > li > a {
|
||
|
|
display: block;
|
||
|
|
padding: 3px 0;
|
||
|
|
font-size: 15px;
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
.sidebar-meta ul > li > a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Archive
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.archive-items-wrap {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* archive info box */
|
||
|
|
.archive-info-box {
|
||
|
|
background-color: rgba(138, 138, 154, 0.14);
|
||
|
|
padding: 5%;
|
||
|
|
margin-bottom: 60px;
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.archive-info-box {
|
||
|
|
padding: 8%;
|
||
|
|
margin-bottom: 30px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.ai-box-subtitle {
|
||
|
|
margin-bottom: 15px;
|
||
|
|
font-size: 16px;
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
.ai-box-title {
|
||
|
|
margin: 0;
|
||
|
|
font-size: 32px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* About me section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#about-me-section {
|
||
|
|
}
|
||
|
|
.about-me-inner {
|
||
|
|
padding-top: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if page boxed layout enabled */
|
||
|
|
body.tt-boxed #about-me-section .about-me-inner.tt-wrap {
|
||
|
|
padding-top: 3%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* signature */
|
||
|
|
.signature {
|
||
|
|
margin-top: 50px;
|
||
|
|
}
|
||
|
|
.signature img {
|
||
|
|
}
|
||
|
|
.signature .signature-dark {
|
||
|
|
}
|
||
|
|
.signature .signature-light {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* About me simple
|
||
|
|
=================== */
|
||
|
|
#about-me-section.about-me-simple {
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* about me simple full height ofset */
|
||
|
|
@media (max-width: 1199px) {
|
||
|
|
#about-me-section.about-me-simple .sbi-height.full-height-vh {
|
||
|
|
min-height: 60vh !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
body.footer-minimal-on .about-me-simple .sbi-height.full-height-vh {
|
||
|
|
min-height: calc(100vh - 162px) !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Contact section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#contact-section {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
.contact-section-inner {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
#contact-section .cover {
|
||
|
|
background-color: transparent;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* If boxed layout enabled
|
||
|
|
=========================== */
|
||
|
|
body.tt-boxed .contact-section-inner.tt-wrap {
|
||
|
|
padding-top: 3%;
|
||
|
|
padding-bottom: 5%;
|
||
|
|
}
|
||
|
|
body.tt-boxed .contact-section-inner.tt-wrap #map {
|
||
|
|
margin-top: 4%;
|
||
|
|
}
|
||
|
|
body.tt-boxed .contact-section-inner.tt-wrap .full-height-vh {
|
||
|
|
min-height: auto !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Contact info
|
||
|
|
================= */
|
||
|
|
.contact-info-wrap {
|
||
|
|
width: 100%;
|
||
|
|
max-width: 600px;
|
||
|
|
background-color: rgba(255, 255, 255, 0.94);
|
||
|
|
padding: 7% 7%;
|
||
|
|
z-index: 2;
|
||
|
|
}
|
||
|
|
@media (min-width: 768px) {
|
||
|
|
.contact-info-wrap {
|
||
|
|
margin-left: 50%;
|
||
|
|
-moz-transform: translateX(-50%);
|
||
|
|
-ms-transform: translateX(-50%);
|
||
|
|
-webkit-transform: translateX(-50%);
|
||
|
|
transform: translateX(-50%);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.contact-info {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* contact form */
|
||
|
|
#contact-form {
|
||
|
|
}
|
||
|
|
|
||
|
|
.contact-form-info {
|
||
|
|
margin-bottom: 40px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* map */
|
||
|
|
#map {
|
||
|
|
width: 100%;
|
||
|
|
min-height: 320px;
|
||
|
|
padding-bottom: 25%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Contact simple
|
||
|
|
================== */
|
||
|
|
.contact-simple {
|
||
|
|
}
|
||
|
|
|
||
|
|
.contact-simple .contact-section-inner {
|
||
|
|
}
|
||
|
|
|
||
|
|
#contact-section.contact-simple .cover {
|
||
|
|
background-color: transparent;
|
||
|
|
}
|
||
|
|
|
||
|
|
.contact-simple .contact-info-wrap {
|
||
|
|
position: absolute;
|
||
|
|
top: 50%;
|
||
|
|
bottom: auto;
|
||
|
|
left: 50%;
|
||
|
|
right: auto;
|
||
|
|
width: 100%;
|
||
|
|
max-width: 680px;
|
||
|
|
background-color: rgba(255, 255, 255, 0.93);
|
||
|
|
padding: 80px 5%;
|
||
|
|
margin: 0;
|
||
|
|
z-index: 2;
|
||
|
|
-moz-transform: translate(-50%, -50%);
|
||
|
|
-ms-transform: translate(-50%, -50%);
|
||
|
|
-webkit-transform: translate(-50%, -50%);
|
||
|
|
transform: translate(-50%, -50%);
|
||
|
|
-webkit-box-shadow: 0 7px 5px -6px rgba(0,0,0,0.08);
|
||
|
|
-moz-box-shadow: 0 7px 5px -6px rgba(0,0,0,0.08);
|
||
|
|
box-shadow: 0 7px 5px -6px rgba(0,0,0,0.08);
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.contact-simple .contact-info-wrap {
|
||
|
|
padding: 10% 5%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.contact-simple .contact-info-wrap {
|
||
|
|
padding: 15% 5%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 768px) {
|
||
|
|
.contact-simple .contact-info {
|
||
|
|
font-size: 19px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* contact simple full height ofset */
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.contact-simple .full-height-vh { min-height: calc(100vh - 162px) !important; }
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Page section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#page-section {
|
||
|
|
}
|
||
|
|
|
||
|
|
.page-section-inner {
|
||
|
|
padding-top: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if page boxed layout enabled */
|
||
|
|
body.tt-boxed #page-section .page-section-inner.tt-wrap {
|
||
|
|
padding-top: 3%;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Page classic
|
||
|
|
================ */
|
||
|
|
.page-classic {
|
||
|
|
}
|
||
|
|
|
||
|
|
.page-classic .page-section-inner {
|
||
|
|
padding: 3% 3% 0 3%;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.page-classic .page-section-inner {
|
||
|
|
padding: 7% 3% 0 3%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if page boxed layout enabled */
|
||
|
|
body.tt-boxed #page-section.page-classic .page-section-inner.tt-wrap {
|
||
|
|
padding-top: 3%;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
body.tt-boxed #page-section.page-classic .page-section-inner.tt-wrap {
|
||
|
|
padding-top: 7%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* page content */
|
||
|
|
.page-content {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* page sidebar */
|
||
|
|
.page-sidebar {
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.page-sidebar.sidebar-left {
|
||
|
|
padding-right: 60px;
|
||
|
|
}
|
||
|
|
.page-sidebar.sidebar-right {
|
||
|
|
padding-left: 60px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Password protected section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#password-protected-section {
|
||
|
|
}
|
||
|
|
.password-protected-inner {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Password protected full height offset
|
||
|
|
========================================= */
|
||
|
|
#password-protected-section .full-height-vh {
|
||
|
|
height: calc(100vh - 82px) !important;
|
||
|
|
min-height: calc(100vh - 82px) !important;
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
body.footer-minimal-on #password-protected-section .full-height-vh {
|
||
|
|
height: calc(100vh - 162px) !important;
|
||
|
|
min-height: calc(100vh - 162px) !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
#password-protected-section .full-height-vh {
|
||
|
|
height: calc(100vh - 62px) !important;
|
||
|
|
min-height: calc(100vh - 62px) !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if header-transparent enabled */
|
||
|
|
body.header-transparent-on #password-protected-section .full-height-vh {
|
||
|
|
height: 100vh;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Post password
|
||
|
|
================= */
|
||
|
|
.tt-post-password {
|
||
|
|
position: relative;
|
||
|
|
display: table;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
padding: 5% 3%;
|
||
|
|
z-index: 3;
|
||
|
|
}
|
||
|
|
.tt-post-password-inner {
|
||
|
|
position: relative;
|
||
|
|
display: table-cell;
|
||
|
|
vertical-align: middle;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
text-align: center;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.tt-post-password-icon {
|
||
|
|
font-size: 68px;
|
||
|
|
}
|
||
|
|
.tt-post-password-text {
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#tt-post-password-form {
|
||
|
|
max-width: 400px;
|
||
|
|
margin: 0 auto;
|
||
|
|
}
|
||
|
|
#tt-post-password-form input {
|
||
|
|
}
|
||
|
|
#tt-post-password-form button {
|
||
|
|
background-color: #08c1b8;
|
||
|
|
font-size: 16px;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Page header
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#page-header {
|
||
|
|
position: relative;
|
||
|
|
background-color: rgba(101, 101, 101, 0.1);
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
.page-header-inner {
|
||
|
|
position: relative;
|
||
|
|
padding: 100px 8%;
|
||
|
|
}
|
||
|
|
@media (max-width: 1280px) {
|
||
|
|
.page-header-inner {
|
||
|
|
padding-top: 10% !important;
|
||
|
|
padding-bottom: 10% !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Page header caption
|
||
|
|
======================= */
|
||
|
|
.page-header-caption {
|
||
|
|
position: relative;
|
||
|
|
margin: 0 auto;
|
||
|
|
z-index: 3;
|
||
|
|
}
|
||
|
|
@media (max-width : 1440px) {
|
||
|
|
.page-header-caption {
|
||
|
|
padding-left: 8%;
|
||
|
|
padding-right: 8%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* page header title */
|
||
|
|
.page-header-title {
|
||
|
|
max-width: 900px;
|
||
|
|
margin: 0;
|
||
|
|
font-size: 52px;
|
||
|
|
color: #222;
|
||
|
|
}
|
||
|
|
@media (max-width : 991px) {
|
||
|
|
.page-header-title {
|
||
|
|
font-size: 42px ;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width : 768px) {
|
||
|
|
.page-header-title {
|
||
|
|
font-size: 32px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* page header subtitle */
|
||
|
|
.page-header-subtitle {
|
||
|
|
max-width: 900px;
|
||
|
|
margin: 20px 0;
|
||
|
|
font-size: 24px;
|
||
|
|
color: #222;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* page header category */
|
||
|
|
.page-header-category {
|
||
|
|
margin-top: 10px;
|
||
|
|
}
|
||
|
|
.page-header-category > a {
|
||
|
|
display: inline-block;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
padding: 2px 4px 0 4px;
|
||
|
|
font-size: 12px;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.page-header-category > a:hover {
|
||
|
|
opacity: .9;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* page header description */
|
||
|
|
.page-header-description {
|
||
|
|
max-width: 760px;
|
||
|
|
margin: 30px 0 0 0;
|
||
|
|
line-height: inherit;
|
||
|
|
font-size: 17px;
|
||
|
|
font-weight: 300;
|
||
|
|
color: #111;
|
||
|
|
}
|
||
|
|
.page-header-description p {
|
||
|
|
}
|
||
|
|
@media (max-width : 767px) {
|
||
|
|
.page-header-description {
|
||
|
|
font-size: 15px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Page header more info trigger
|
||
|
|
================================= */
|
||
|
|
.ph-more-info-trigger {
|
||
|
|
display: inline-block;
|
||
|
|
margin-top: 15px;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.ph-more-info-trigger:hover,
|
||
|
|
.ph-more-info-trigger:focus {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
|
||
|
|
.ph-more-info-trigger-icon {
|
||
|
|
position: relative;
|
||
|
|
display: inline-block;
|
||
|
|
top: 7px;
|
||
|
|
width: 24px;
|
||
|
|
height: 24px;
|
||
|
|
margin-right: 3px;
|
||
|
|
border: 2px solid #08c1b8;
|
||
|
|
border-radius: 50px;
|
||
|
|
-webkit-transition: all 0.4s ease-in-out;
|
||
|
|
-moz-transition: all 0.4s ease-in-out;
|
||
|
|
-o-transition: all 0.4s ease-in-out;
|
||
|
|
-ms-transition: all 0.4s ease-in-out;
|
||
|
|
transition: all 0.4s ease-in-out;
|
||
|
|
}
|
||
|
|
.ph-more-info-trigger:hover .ph-more-info-trigger-icon {
|
||
|
|
-webkit-transform: rotate(180deg);
|
||
|
|
-moz-transform: rotate(180deg);
|
||
|
|
-o-transform: rotate(180deg);
|
||
|
|
-ms-transform: rotate(180deg);
|
||
|
|
transform: rotate(180deg);
|
||
|
|
}
|
||
|
|
.ph-more-info-trigger-icon:before,
|
||
|
|
.ph-more-info-trigger-icon:after {
|
||
|
|
content: '';
|
||
|
|
position: absolute;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
}
|
||
|
|
.ph-more-info-trigger-icon:before {
|
||
|
|
left: 3px;
|
||
|
|
right: 3px;
|
||
|
|
top: 50%;
|
||
|
|
margin-top: -1px;
|
||
|
|
height: 2px;
|
||
|
|
}
|
||
|
|
.ph-more-info-trigger-icon:after {
|
||
|
|
left: 50%;
|
||
|
|
margin-left: -1px;
|
||
|
|
top: 3px;
|
||
|
|
bottom: 3px;
|
||
|
|
width: 2px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Page header caption sizes
|
||
|
|
============================= */
|
||
|
|
.page-header-caption.ph-caption-xs .page-header-title {
|
||
|
|
font-size: 32px;
|
||
|
|
}
|
||
|
|
.page-header-caption.ph-caption-xs .page-header-subtitle {
|
||
|
|
font-size: 18px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.page-header-caption.ph-caption-sm .page-header-title {
|
||
|
|
font-size: 44px;
|
||
|
|
}
|
||
|
|
.page-header-caption.ph-caption-sm .page-header-subtitle {
|
||
|
|
font-size: 22px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.page-header-caption.ph-caption-lg .page-header-title {
|
||
|
|
font-size: 68px;
|
||
|
|
}
|
||
|
|
.page-header-caption.ph-caption-lg .page-header-subtitle {
|
||
|
|
font-size: 28px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.page-header-caption.ph-caption-xlg .page-header-title {
|
||
|
|
font-size: 98px;
|
||
|
|
}
|
||
|
|
.page-header-caption.ph-caption-xlg .page-header-subtitle {
|
||
|
|
font-size: 32px;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (max-width : 991px) {
|
||
|
|
.page-header-caption.ph-caption-sm .page-header-title,
|
||
|
|
.page-header-caption.ph-caption-lg .page-header-title,
|
||
|
|
.page-header-caption.ph-caption-xlg .page-header-title {
|
||
|
|
font-size: 62px;
|
||
|
|
}
|
||
|
|
.page-header-caption.ph-caption-lg .page-header-subtitle,
|
||
|
|
.page-header-caption.ph-caption-xlg .page-header-subtitle {
|
||
|
|
font-size: 28px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width : 768px) {
|
||
|
|
.page-header-caption.ph-caption-sm .page-header-title,
|
||
|
|
.page-header-caption.ph-caption-lg .page-header-title,
|
||
|
|
.page-header-caption.ph-caption-xlg .page-header-title {
|
||
|
|
font-size: 38px;
|
||
|
|
}
|
||
|
|
.page-header-caption .page-header-subtitle,
|
||
|
|
.page-header-caption.ph-caption-sm .page-header-subtitle,
|
||
|
|
.page-header-caption.ph-caption-lg .page-header-subtitle,
|
||
|
|
.page-header-caption.ph-caption-xlg .page-header-subtitle {
|
||
|
|
font-size: 22px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Page header aligns
|
||
|
|
====================== */
|
||
|
|
|
||
|
|
/* page header align right */
|
||
|
|
.ph-right .page-header-caption {
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
.ph-right .page-header-caption .page-header-title,
|
||
|
|
.ph-right .page-header-caption .page-header-description {
|
||
|
|
margin-left: auto;
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
.ph-right .page-header-caption .hr-short {
|
||
|
|
margin-left: auto;
|
||
|
|
margin-right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* page header align center */
|
||
|
|
.ph-center .page-header-caption {
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.ph-center .page-header-caption .page-header-title {
|
||
|
|
margin-left: auto;
|
||
|
|
margin-right: auto;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.ph-center .page-header-caption .page-header-description {
|
||
|
|
margin-left: auto;
|
||
|
|
margin-right: auto;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.ph-center .page-header-caption .hr-short {
|
||
|
|
margin-left: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* If page header contains background image
|
||
|
|
============================================ */
|
||
|
|
.page-header-image {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.page-header-image.hide-ph-image { /* if page header is hidden */
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
#page-header.ph-image-on {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
#page-header.ph-image-on .page-header-title {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
#page-header.ph-image-on .page-header-subtitle {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
#page-header.ph-image-on .page-header-description {
|
||
|
|
color: #EEE;
|
||
|
|
}
|
||
|
|
|
||
|
|
#page-header.ph-image-on .ph-more-info-trigger {
|
||
|
|
color: #EEE;
|
||
|
|
}
|
||
|
|
#page-header.ph-image-on .ph-more-info-trigger:hover,
|
||
|
|
#page-header.ph-image-on .ph-more-info-trigger:focus {
|
||
|
|
color: #EEE;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Page header sizes
|
||
|
|
====================== */
|
||
|
|
#page-header.ph-xs .page-header-inner {
|
||
|
|
padding-top: 40px;
|
||
|
|
padding-bottom: 40px;
|
||
|
|
}
|
||
|
|
#page-header.ph-sm .page-header-inner {
|
||
|
|
padding-top: 80px;
|
||
|
|
padding-bottom: 80px;
|
||
|
|
}
|
||
|
|
#page-header.ph-lg .page-header-inner {
|
||
|
|
padding-top: 140px;
|
||
|
|
padding-bottom: 140px;
|
||
|
|
}
|
||
|
|
#page-header.ph-xlg .page-header-inner {
|
||
|
|
padding-top: 200px;
|
||
|
|
padding-bottom: 200px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* If header-transparent enabled
|
||
|
|
================================= */
|
||
|
|
body.header-transparent-on #page-header.page-header-inner {
|
||
|
|
padding-top: 150px;
|
||
|
|
padding-bottom: 50px;
|
||
|
|
}
|
||
|
|
body.header-transparent-on #page-header.ph-sm .page-header-inner {
|
||
|
|
padding-top: 80px;
|
||
|
|
padding-bottom: 80px;
|
||
|
|
}
|
||
|
|
body.header-transparent-on #page-header.ph-lg .page-header-inner {
|
||
|
|
padding-top: 220px;
|
||
|
|
padding-bottom: 100px;
|
||
|
|
}
|
||
|
|
body.header-transparent-on #page-header.ph-xlg .page-header-inner {
|
||
|
|
padding-top: 300px;
|
||
|
|
padding-bottom: 100px;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (max-width: 1280px) {
|
||
|
|
body.header-transparent-on #page-header.page-header-inner,
|
||
|
|
body.header-transparent-on #page-header.ph-sm .page-header-inner,
|
||
|
|
body.header-transparent-on #page-header.ph-lg .page-header-inner,
|
||
|
|
body.header-transparent-on #page-header.ph-xlg .page-header-inner {
|
||
|
|
padding-top: 30% !important;
|
||
|
|
padding-bottom: 10% !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* If page header contains a slideshow
|
||
|
|
======================================= */
|
||
|
|
#page-header.slideshow .cc-item {
|
||
|
|
/* height handled by "theme.js" file */
|
||
|
|
min-height: 300px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------------------------------------------------------------------- *
|
||
|
|
* Split box
|
||
|
|
* based on - Bootstrap 3 responsive columns of same height
|
||
|
|
* source and tutorial: http://www.minimit.com/articles/solutions-tutorials/bootstrap-3-responsive-columns-of-same-height
|
||
|
|
* Note: look into "helper.css" file to find source code.
|
||
|
|
/* ------------------------------------------------------------------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.split-box {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Split box content
|
||
|
|
==================== */
|
||
|
|
.split-box-content {
|
||
|
|
position: relative;
|
||
|
|
padding: 10% 10%;
|
||
|
|
z-index: 9;
|
||
|
|
}
|
||
|
|
@media (max-width: 1199px) {
|
||
|
|
.split-box-content {
|
||
|
|
padding: 10% 4% 10% 4%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* split box content shifted left/right */
|
||
|
|
@media (min-width: 1200px) {
|
||
|
|
.split-box-content.shifted-left {
|
||
|
|
background-color: #FFF;
|
||
|
|
margin-left: -15%;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
.split-box-content.shifted-right {
|
||
|
|
background-color: #FFF;
|
||
|
|
margin-right: -15%;
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* if page boxed layout enabled */
|
||
|
|
@media (min-width: 1200px) {
|
||
|
|
body.tt-boxed .tt-wrap .split-box-content.sb-content-left {
|
||
|
|
padding-left: 0;
|
||
|
|
}
|
||
|
|
body.tt-boxed .tt-wrap .split-box-content.sb-content-right {
|
||
|
|
padding-right: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Split box image
|
||
|
|
=================== */
|
||
|
|
.split-box-image {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* split box image height */
|
||
|
|
.sbi-height {
|
||
|
|
}
|
||
|
|
@media (max-width: 1199px) {
|
||
|
|
.sbi-height {
|
||
|
|
padding-bottom: 60% !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 767px) {
|
||
|
|
.sbi-height {
|
||
|
|
padding-bottom: 80% !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Pagination
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.pagination-wrap {
|
||
|
|
text-align: center;
|
||
|
|
padding: 40px 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.pagination {
|
||
|
|
display: inline-block;
|
||
|
|
padding: 0;
|
||
|
|
margin: 0;
|
||
|
|
border-radius: 0;
|
||
|
|
color: #888;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* pagination links */
|
||
|
|
.pagination > li {
|
||
|
|
display: inline-block;
|
||
|
|
}
|
||
|
|
.pagination > li > a, .pagination > li > span {
|
||
|
|
position: relative;
|
||
|
|
display: inline-block;
|
||
|
|
float: none;
|
||
|
|
padding: 5px 13px;
|
||
|
|
margin: 5px 0;
|
||
|
|
font-size: 14px;
|
||
|
|
font-weight: 400;
|
||
|
|
color: #333;
|
||
|
|
text-decoration: none;
|
||
|
|
background-color: #FFF;
|
||
|
|
border: 1px solid #e0e0e0;
|
||
|
|
-webkit-box-shadow: 0 7px 5px -6px rgba(0,0,0,0.04);
|
||
|
|
-moz-box-shadow: 0 7px 5px -6px rgba(0,0,0,0.04);
|
||
|
|
box-shadow: 0 7px 5px -6px rgba(0,0,0,0.04);
|
||
|
|
}
|
||
|
|
.pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover {
|
||
|
|
color: #333;
|
||
|
|
background-color: #FFF;
|
||
|
|
border-color: #E0E0E0;
|
||
|
|
-webkit-box-shadow: 0 7px 5px -6px rgba(0,0,0,0.15);
|
||
|
|
-moz-box-shadow: 0 7px 5px -6px rgba(0,0,0,0.15);
|
||
|
|
box-shadow: 0 7px 5px -6px rgba(0,0,0,0.15);
|
||
|
|
}
|
||
|
|
.pagination > li:first-child > a, .pagination > li:first-child > span {
|
||
|
|
margin-left: 0;
|
||
|
|
border-top-left-radius: 0;
|
||
|
|
border-bottom-left-radius: 0;
|
||
|
|
}
|
||
|
|
.pagination > li:last-child > a, .pagination > li:last-child > span {
|
||
|
|
border-top-right-radius: 0;
|
||
|
|
border-bottom-right-radius: 0;
|
||
|
|
}
|
||
|
|
.pagination > .active > a,
|
||
|
|
.pagination > .active > a:focus,
|
||
|
|
.pagination > .active > a:hover,
|
||
|
|
.pagination > .active > span,
|
||
|
|
.pagination > .active > span:focus,
|
||
|
|
.pagination > .active > span:hover {
|
||
|
|
z-index: 2;
|
||
|
|
color: #FFF;
|
||
|
|
cursor: default;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
border-color: #08c1b8;
|
||
|
|
-webkit-box-shadow: 0 7px 5px -6px rgba(0,0,0,0.15);
|
||
|
|
-moz-box-shadow: 0 7px 5px -6px rgba(0,0,0,0.15);
|
||
|
|
box-shadow: 0 7px 5px -6px rgba(0,0,0,0.15);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* pagination info */
|
||
|
|
.pagination-info {
|
||
|
|
margin-top: 30px;
|
||
|
|
font-size: 14px;
|
||
|
|
line-height: 18px;
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
.pagination-info span {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Thumbnail list
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.thumb-list {
|
||
|
|
display: block;
|
||
|
|
width: 100%;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
.thumb-list > li {
|
||
|
|
float: left;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* thumbnail list item */
|
||
|
|
.thumb-list .thumb-list-item {
|
||
|
|
display: block;
|
||
|
|
background-color: rgba(146, 146, 146, 0.5);
|
||
|
|
padding-bottom: 100%;
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.thumb-list .thumb-list-item:hover {
|
||
|
|
opacity: .7;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* thumbnail list columns */
|
||
|
|
.thumb-list.col-2 > li { width: 50%; }
|
||
|
|
.thumb-list.col-3 > li { width: 33.33333333%; }
|
||
|
|
.thumb-list.col-4 > li { width: 25%; }
|
||
|
|
.thumb-list.col-5 > li { width: 20%; }
|
||
|
|
.thumb-list.col-6 > li { width: 16.66666666666667%; }
|
||
|
|
|
||
|
|
/* thumbnail list gutter (more space between items) */
|
||
|
|
.thumb-list.gutter-1 > li { padding: 1px; }
|
||
|
|
.thumb-list.gutter-2 > li { padding: 2px; }
|
||
|
|
.thumb-list.gutter-3 > li { padding: 3px; }
|
||
|
|
.thumb-list.gutter-4 > li {padding: 4px;}
|
||
|
|
.thumb-list.gutter-5 > li { padding: 5px; }
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* YTP Player: https://github.com/pupunzi/jquery.mb.YTPlayer;
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.youtube-bg {
|
||
|
|
position: relative;
|
||
|
|
background-repeat: no-repeat;
|
||
|
|
-webkit-background-size: cover;
|
||
|
|
background-size: cover;
|
||
|
|
}
|
||
|
|
.YTPOverlay {
|
||
|
|
background-color: transparent;
|
||
|
|
}
|
||
|
|
.YTPOverlay.raster {
|
||
|
|
background: url("../vendor/ytplayer/images/raster.png"); /* "raster.png" or "raster_dot.png" */
|
||
|
|
background-color: transparent;
|
||
|
|
}
|
||
|
|
.youtube-bg.YTPFullscreen .YTPOverlay, .youtube-bg.YTPFullscreen .YTPOverlay.raster, .youtube-bg.YTPFullscreen .cover {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Video control bar */
|
||
|
|
.mb_YTPBar, .mb_YTPBar.visible {
|
||
|
|
opacity: .2;
|
||
|
|
z-index: 9;
|
||
|
|
}
|
||
|
|
.mb_YTPBar .buttonBar {
|
||
|
|
top: -40px;
|
||
|
|
height: 40px;
|
||
|
|
padding: 10px 10px 0px 10px;
|
||
|
|
}
|
||
|
|
.mb_YTPBar, .mb_YTPBar .mb_YTPProgress, .mb_YTPBar .mb_YTPLoaded, .mb_YTPBar .mb_YTPseekbar {
|
||
|
|
height: 4px;
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
.mb_YTPBar .mb_YTPProgress, .mb_YTPBar .mb_YTPLoaded {
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
.mb_YTPBar .mb_YTPseekbar {
|
||
|
|
background: #F20000;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Video control elements */
|
||
|
|
.mb_YTPBar span.mb_OnlyYT {
|
||
|
|
left: 250px;
|
||
|
|
top: 10px;
|
||
|
|
right: auto;
|
||
|
|
}
|
||
|
|
@media (min-width: 480px) {
|
||
|
|
.mb_YTPBar span.mb_OnlyYT {
|
||
|
|
left: 330px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* YTPlayer full size cover
|
||
|
|
============================ */
|
||
|
|
.youtube-bg-wrap.ytp-full,
|
||
|
|
.youtube-bg-wrap.ytp-full .inline-YTPlayer,
|
||
|
|
.youtube-bg-wrap.ytp-full .youtube-bg {
|
||
|
|
position: absolute !important;
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
.youtube-bg-wrap.ytp-full .youtube-bg {
|
||
|
|
padding-bottom: 0 !important;
|
||
|
|
height: auto !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Panels
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.panel-group .panel {
|
||
|
|
border-radius: 0px;
|
||
|
|
}
|
||
|
|
.panel {
|
||
|
|
background-color: transparent;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* panel default */
|
||
|
|
.panel-default {
|
||
|
|
border-color: #EDEDED;
|
||
|
|
}
|
||
|
|
.panel-default > .panel-heading {
|
||
|
|
background-color: transparent;
|
||
|
|
color: #333;
|
||
|
|
border-color: #EDEDED;
|
||
|
|
}
|
||
|
|
.panel-title {
|
||
|
|
font-size: 19px;
|
||
|
|
}
|
||
|
|
.panel-default > .panel-heading + .panel-collapse > .panel-body {
|
||
|
|
border-top-color: #EDEDED;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Accordion
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.accordion-wrap {
|
||
|
|
margin-bottom: 40px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.accordion-wrap .panel {
|
||
|
|
}
|
||
|
|
.accordion-wrap .panel + .panel {
|
||
|
|
margin-top: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.accordion-wrap .panel-group .panel-heading + .panel-collapse > .list-group, .panel-group .panel-heading + .panel-collapse > .panel-body {
|
||
|
|
}
|
||
|
|
|
||
|
|
.accordion-wrap .panel-heading {
|
||
|
|
padding: 0;
|
||
|
|
-webkit-border-radius: 0;
|
||
|
|
-moz-border-radius: 0;
|
||
|
|
border-radius: 0;
|
||
|
|
}
|
||
|
|
.accordion-wrap .panel-heading a {
|
||
|
|
position: relative;
|
||
|
|
display: block;
|
||
|
|
background-color: transparent;
|
||
|
|
padding: 20px 40px 20px 20px;
|
||
|
|
overflow: hidden;
|
||
|
|
text-decoration: none;
|
||
|
|
font-weight: 500;
|
||
|
|
color: inherit;
|
||
|
|
}
|
||
|
|
.accordion-wrap .panel-heading a:hover,
|
||
|
|
.accordion-wrap .panel-heading a:focus {
|
||
|
|
}
|
||
|
|
.accordion-wrap .panel-heading a.collapsed {
|
||
|
|
color: inherit;
|
||
|
|
}
|
||
|
|
|
||
|
|
.accordion-wrap .panel-heading a > .acc-arrow {
|
||
|
|
position: absolute;
|
||
|
|
content: "";
|
||
|
|
right: 10px;
|
||
|
|
top: 50%;
|
||
|
|
margin-top: -10px;
|
||
|
|
width: 20px;
|
||
|
|
height: 20px;
|
||
|
|
line-height: 20px;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 12px;
|
||
|
|
color: #ccc;
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.accordion-wrap .panel-heading a.collapsed > .acc-arrow {
|
||
|
|
-webkit-transform: rotate(180deg);
|
||
|
|
-ms-transform: rotate(180deg);
|
||
|
|
-o-transform: rotate(180deg);
|
||
|
|
transform: rotate(180deg);
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Blockquote
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
blockquote {
|
||
|
|
position: relative;
|
||
|
|
padding: 0 30px;
|
||
|
|
margin: 30px 0;
|
||
|
|
font-size: 18px;
|
||
|
|
font-weight: bold;
|
||
|
|
font-weight: 500;
|
||
|
|
font-style: italic;
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
blockquote:before {
|
||
|
|
position: absolute;
|
||
|
|
content: open-quote;
|
||
|
|
top: -8px;
|
||
|
|
left: -5px;
|
||
|
|
font-size: 42px;
|
||
|
|
color: #D2D2D2;
|
||
|
|
}
|
||
|
|
blockquote .small,
|
||
|
|
blockquote footer,
|
||
|
|
blockquote small {
|
||
|
|
display: block;
|
||
|
|
font-size: 85%;
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Testimonials section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#testimonials-section {
|
||
|
|
}
|
||
|
|
.testimonials-section-inner {
|
||
|
|
}
|
||
|
|
|
||
|
|
.testimonials-carousel {
|
||
|
|
position: relative;
|
||
|
|
max-width: 1000px;
|
||
|
|
margin: 0 auto;
|
||
|
|
padding: 6% 0 8% 0;
|
||
|
|
z-index: 3;
|
||
|
|
}
|
||
|
|
|
||
|
|
.testimonials-carousel .owl-carousel,
|
||
|
|
.testimonials-carousel .owl-carousel .cc-item {
|
||
|
|
min-height: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Testimonial item
|
||
|
|
==================== */
|
||
|
|
.testimonial-item {
|
||
|
|
position: relative;
|
||
|
|
padding: 60px 5%;
|
||
|
|
z-index: 9;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* testimonial item img/image */
|
||
|
|
.testimonial-item img {
|
||
|
|
display: inline-block !important;
|
||
|
|
float: left;
|
||
|
|
max-width: 100px;
|
||
|
|
margin: 0 25px 20px 0;
|
||
|
|
}
|
||
|
|
.testimonial-item .tm-image {
|
||
|
|
display: inline-block !important;
|
||
|
|
float: left;
|
||
|
|
width: 90px;
|
||
|
|
height: 90px;
|
||
|
|
margin: 0 25px 20px 0;
|
||
|
|
border-radius: 100px;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
.tm-hide-image .testimonial-item img,
|
||
|
|
.tm-hide-image .testimonial-item .tm-image { /* Hiding testimonial image if class "tm-hide-image" is used. */
|
||
|
|
display: none !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* testimonial blockquote */
|
||
|
|
.testimonial-item blockquote {
|
||
|
|
position: relative;
|
||
|
|
overflow: hidden;
|
||
|
|
padding: 0 0 0 25px;
|
||
|
|
margin: 0 0 15px 0;
|
||
|
|
font-size: 17.5px;
|
||
|
|
font-style: italic;
|
||
|
|
border-left: 5px solid rgba(121, 121, 121, 0.18);
|
||
|
|
}
|
||
|
|
.testimonial-item blockquote:before {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
.testimonial-item blockquote p {
|
||
|
|
}
|
||
|
|
.testimonial-item blockquote .small,
|
||
|
|
.testimonial-item blockquote footer,
|
||
|
|
.testimonial-item blockquote small {
|
||
|
|
margin-top: 20px;
|
||
|
|
color: #b1b1b1;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* align testimonial item to center on small devices */
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.testimonial-item {
|
||
|
|
text-align: center !important;
|
||
|
|
}
|
||
|
|
.testimonial-item blockquote {
|
||
|
|
padding: 0 !important;
|
||
|
|
text-align: center !important;
|
||
|
|
border: none !important;
|
||
|
|
}
|
||
|
|
.testimonial-item img,
|
||
|
|
.testimonial-item .tm-image {
|
||
|
|
float: none !important;
|
||
|
|
margin: 0 0 40px 0 !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* testimonial align center */
|
||
|
|
.tm-center .testimonial-item {
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.tm-center .testimonial-item blockquote {
|
||
|
|
padding: 0;
|
||
|
|
text-align: center;
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
.tm-center .testimonial-item img,
|
||
|
|
.tm-center .testimonial-item .tm-image {
|
||
|
|
float: none;
|
||
|
|
margin: 0 0 40px 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* testimonial align right */
|
||
|
|
.blockquote-reverse,
|
||
|
|
.testimonial-item blockquote.pull-right,
|
||
|
|
.tm-right .testimonial-item blockquote {
|
||
|
|
padding: 0 30px 0 0;
|
||
|
|
text-align: right;
|
||
|
|
border-left: 0;
|
||
|
|
border-right: 5px solid rgba(121, 121, 121, 0.18);
|
||
|
|
}
|
||
|
|
.tm-right .testimonial-item img,
|
||
|
|
.tm-right .testimonial-item .tm-image {
|
||
|
|
float: right;
|
||
|
|
margin: 0 0 0 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* disable owl nav-outside on small screens */
|
||
|
|
@media (max-width: 1540px) {
|
||
|
|
.testimonials-carousel .owl-carousel.nav-outside .owl-nav {
|
||
|
|
display: none !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Begin call to action section
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.call-to-action-section {
|
||
|
|
position: relative;
|
||
|
|
padding: 5% 3%;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.call-to-action-section {
|
||
|
|
padding: 10% 3%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.call-to-action-inner {
|
||
|
|
position: relative;
|
||
|
|
z-index: 2;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Forms
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.form-group {
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.form-control {
|
||
|
|
height: 48px;
|
||
|
|
background-color: #FFF;
|
||
|
|
padding: 6px 12px;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #333;
|
||
|
|
border-radius: 0;
|
||
|
|
border: 1px solid rgba(148, 148, 148, 0.25);
|
||
|
|
-webkit-box-shadow: none;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
.form-control:focus {
|
||
|
|
border-color: #08c1b8 !important;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* select */
|
||
|
|
select {
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
select:required:invalid {
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
option[value=""][disabled] {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
option {
|
||
|
|
color: black;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* label */
|
||
|
|
label {
|
||
|
|
display: inline-block;
|
||
|
|
max-width: 100%;
|
||
|
|
margin-bottom: 5px;
|
||
|
|
font-size: 17px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* placeholder */
|
||
|
|
::-webkit-input-placeholder {
|
||
|
|
color: #999 !important;
|
||
|
|
}
|
||
|
|
:-moz-placeholder {
|
||
|
|
color: #999 !important;
|
||
|
|
}
|
||
|
|
::-moz-placeholder {
|
||
|
|
color: #999 !important;
|
||
|
|
}
|
||
|
|
:-ms-input-placeholder {
|
||
|
|
color: #999 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* form with button inside */
|
||
|
|
.form-btn-inside {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.form-btn-inside .form-control {
|
||
|
|
padding-right: 50px;
|
||
|
|
}
|
||
|
|
.form-btn-inside button {
|
||
|
|
position: absolute;
|
||
|
|
top: 50%;
|
||
|
|
right: 0;
|
||
|
|
width: auto;
|
||
|
|
height: 100%;
|
||
|
|
line-height: 40px;
|
||
|
|
background-color: transparent;
|
||
|
|
padding: 0 15px 0 15px;
|
||
|
|
font-size: 18px;
|
||
|
|
color: #333;
|
||
|
|
border: none;
|
||
|
|
-moz-transform: translateY(-50%);
|
||
|
|
-ms-transform: translateY(-50%);
|
||
|
|
-webkit-transform: translateY(-50%);
|
||
|
|
transform: translateY(-50%);
|
||
|
|
}
|
||
|
|
.form-btn-inside button:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
.form-btn-inside button:focus {
|
||
|
|
outline: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* input */
|
||
|
|
input[type=radio] {
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* input sizes */
|
||
|
|
.input-sm, select.input-sm {
|
||
|
|
height: 35px;
|
||
|
|
line-height: 35px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Modal
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
body.modal-open {
|
||
|
|
overflow-y: hidden !important;
|
||
|
|
padding-right: 0 !important;
|
||
|
|
}
|
||
|
|
.modal-open .modal {
|
||
|
|
padding-right: 0 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.modal {
|
||
|
|
background-color: rgba(0, 0, 0, 0.85);
|
||
|
|
z-index: 99999;
|
||
|
|
}
|
||
|
|
.modal.fade {
|
||
|
|
-webkit-transition: opacity .2s linear;
|
||
|
|
-o-transition: opacity .2s linear;
|
||
|
|
transition: opacity .2s linear;
|
||
|
|
}
|
||
|
|
.modal-backdrop.in, .modal-backdrop.fade.in {
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.modal-dialog {
|
||
|
|
background-color: #FFF;
|
||
|
|
background-repeat: no-repeat;
|
||
|
|
background-position: 50% 50%;
|
||
|
|
-webkit-background-size: cover;
|
||
|
|
background-size: cover;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* modal background image */
|
||
|
|
.modal-bg-image {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* modal header */
|
||
|
|
.modal-header {
|
||
|
|
background-color: rgba(111, 111, 111, 0.09);
|
||
|
|
padding: 15px;
|
||
|
|
text-align: left;
|
||
|
|
border-bottom: none;
|
||
|
|
}
|
||
|
|
.modal-header .close {
|
||
|
|
margin-top: -7px;
|
||
|
|
opacity: 1;
|
||
|
|
font-size: 14px;
|
||
|
|
font-weight: normal;
|
||
|
|
text-shadow: none;
|
||
|
|
}
|
||
|
|
.modal-header .close:hover {
|
||
|
|
}
|
||
|
|
.modal-header .close:active,
|
||
|
|
.modal-header .close:focus {
|
||
|
|
outline: none;
|
||
|
|
}
|
||
|
|
.modal-title {
|
||
|
|
font-size: 13px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* modal body */
|
||
|
|
.modal-body {
|
||
|
|
padding: 1px 0 30px 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.modal-body-image-1 {
|
||
|
|
width: 120px;
|
||
|
|
height: 120px;
|
||
|
|
margin: 20px auto 0 auto;
|
||
|
|
overflow: hidden;
|
||
|
|
border-radius: 100px;
|
||
|
|
}
|
||
|
|
.modal-body-image-2 {
|
||
|
|
height: 140px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* modal body content */
|
||
|
|
.modal-body-content {
|
||
|
|
padding: 30px 20px 20px 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.modal-body .modal-body-heading {
|
||
|
|
font-size: 21px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* modal footer */
|
||
|
|
.modal-footer {
|
||
|
|
padding: 15px;
|
||
|
|
text-align: left;
|
||
|
|
font-size: 13px;
|
||
|
|
color: #888;
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* modal content */
|
||
|
|
.modal-content {
|
||
|
|
position: relative;
|
||
|
|
background-color: transparent;
|
||
|
|
z-index: 2;
|
||
|
|
border: none;
|
||
|
|
border-radius: 2px;
|
||
|
|
}
|
||
|
|
@media (min-width: 768px) {
|
||
|
|
.modal-content {
|
||
|
|
-webkit-box-shadow: 0 1px 15px rgba(0,0,0,0.2);
|
||
|
|
box-shadow: 0 1px 15px rgba(0,0,0,0.2);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Modal position senter
|
||
|
|
========================= */
|
||
|
|
@media (min-width : 768px) {
|
||
|
|
.modal-center .modal-dialog {
|
||
|
|
position: absolute;
|
||
|
|
top: 45%;
|
||
|
|
left: 50%;
|
||
|
|
-moz-transform: translate(-50%, -50%) !important;
|
||
|
|
-ms-transform: translate(-50%, -50%) !important;
|
||
|
|
-webkit-transform: translate(-50%, -50%) !important;
|
||
|
|
transform: translate(-50%, -50%) !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Modal sidebar left/right
|
||
|
|
============================= */
|
||
|
|
.modal.modal-left .modal-dialog,
|
||
|
|
.modal.modal-right .modal-dialog {
|
||
|
|
position: fixed;
|
||
|
|
margin: auto;
|
||
|
|
width: 40%;
|
||
|
|
height: 100%;
|
||
|
|
border-radius: 0;
|
||
|
|
-webkit-transform: translate3d(0%, 0, 0);
|
||
|
|
-ms-transform: translate3d(0%, 0, 0);
|
||
|
|
-o-transform: translate3d(0%, 0, 0);
|
||
|
|
transform: translate3d(0%, 0, 0);
|
||
|
|
}
|
||
|
|
@media (max-width: 1440px) {
|
||
|
|
.modal.modal-left .modal-dialog,
|
||
|
|
.modal.modal-right .modal-dialog {
|
||
|
|
width: 50%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.modal.modal-left .modal-dialog,
|
||
|
|
.modal.modal-right .modal-dialog {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Left */
|
||
|
|
.modal.modal-left.fade .modal-dialog{
|
||
|
|
left: -40%;
|
||
|
|
-webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
|
||
|
|
-moz-transition: opacity 0.3s linear, left 0.3s ease-out;
|
||
|
|
-o-transition: opacity 0.3s linear, left 0.3s ease-out;
|
||
|
|
transition: opacity 0.3s linear, left 0.3s ease-out;
|
||
|
|
}
|
||
|
|
.modal.modal-left.fade.in .modal-dialog{
|
||
|
|
left: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Right */
|
||
|
|
.modal.modal-right.fade .modal-dialog {
|
||
|
|
right: -40%;
|
||
|
|
-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
|
||
|
|
-moz-transition: opacity 0.3s linear, right 0.3s ease-out;
|
||
|
|
-o-transition: opacity 0.3s linear, right 0.3s ease-out;
|
||
|
|
transition: opacity 0.3s linear, right 0.3s ease-out;
|
||
|
|
}
|
||
|
|
.modal.modal-right.fade.in .modal-dialog {
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Modal sidebar style
|
||
|
|
======================== */
|
||
|
|
.modal.modal-left,
|
||
|
|
.modal.modal-right {
|
||
|
|
background-color: rgba(0, 0, 0, 0.7);
|
||
|
|
}
|
||
|
|
|
||
|
|
.modal.modal-left .modal-content,
|
||
|
|
.modal.modal-right .modal-content {
|
||
|
|
height: 100%;
|
||
|
|
padding-bottom: 104px;
|
||
|
|
border-radius: 0;
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.modal.modal-left .modal-header,
|
||
|
|
.modal.modal-right .modal-header {
|
||
|
|
background-color: transparent;
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
.modal.modal-left .modal-title,
|
||
|
|
.modal.modal-right .modal-title {
|
||
|
|
font-size: 14px;
|
||
|
|
}
|
||
|
|
.modal.modal-left .modal-header .close,
|
||
|
|
.modal.modal-right .modal-header .close {
|
||
|
|
}
|
||
|
|
|
||
|
|
.modal.modal-left .modal-footer,
|
||
|
|
.modal.modal-right .modal-footer {
|
||
|
|
font-size: 13px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.modal.modal-left .modal-body,
|
||
|
|
.modal.modal-right .modal-body {
|
||
|
|
height: 100%;
|
||
|
|
overflow-y: auto;
|
||
|
|
}
|
||
|
|
.modal.modal-left .modal-body-content,
|
||
|
|
.modal.modal-right .modal-body-content {
|
||
|
|
padding: 5% 5% 20px 5%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.modal.modal-left .modal-body .modal-body-heading,
|
||
|
|
.modal.modal-right .modal-body .modal-body-heading {
|
||
|
|
max-width: 590px;
|
||
|
|
font-size: 38px;
|
||
|
|
}
|
||
|
|
@media (max-width: 1200px) {
|
||
|
|
.modal.modal-left .modal-body .modal-body-heading,
|
||
|
|
.modal.modal-right .modal-body .modal-body-heading {
|
||
|
|
font-size: 32px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.modal.modal-left .modal-body .modal-body-heading,
|
||
|
|
.modal.modal-right .modal-body .modal-body-heading {
|
||
|
|
font-size: 24px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.modal.modal-left .modal-body .modal-body-image-1,
|
||
|
|
.modal.modal-right .modal-body .modal-body-image-1 {
|
||
|
|
width: 120px;
|
||
|
|
height: 120px;
|
||
|
|
margin: 0 auto 20px auto;
|
||
|
|
}
|
||
|
|
.modal.modal-left .modal-body .modal-body-image-2,
|
||
|
|
.modal.modal-right .modal-body .modal-body-image-2 {
|
||
|
|
height: 160px;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.modal.modal-left .modal-body .modal-body-image-2,
|
||
|
|
.modal.modal-right .modal-body .modal-body-image-2 {
|
||
|
|
height: 140px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* modal share
|
||
|
|
=============== */
|
||
|
|
.modal-share {
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* modal share social buttons */
|
||
|
|
.modal-share .social-buttons {
|
||
|
|
}
|
||
|
|
|
||
|
|
/* modal share grab link */
|
||
|
|
.modal-share .grab-link {
|
||
|
|
display: block;
|
||
|
|
width: 80%;
|
||
|
|
height: 48px;
|
||
|
|
background-color: rgba(255, 255, 255, 0.25);
|
||
|
|
margin: 30px auto 0 auto;
|
||
|
|
text-align: center;
|
||
|
|
padding: 0 20px;
|
||
|
|
font-size: 15px;
|
||
|
|
box-sizing: border-box;
|
||
|
|
border-radius: 0;
|
||
|
|
border: 1px solid rgba(125, 125, 125, 0.2);
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.modal-share .grab-link {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Buttons
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.btn {
|
||
|
|
position: relative;
|
||
|
|
margin: 8px 0;
|
||
|
|
padding: 10px 17px;
|
||
|
|
font-size: 16px;
|
||
|
|
z-index: 9;
|
||
|
|
-webkit-border-radius: 0;
|
||
|
|
-moz-border-radius: 0;
|
||
|
|
border-radius: 0;
|
||
|
|
border: 2px solid rgba(0, 0, 0, 0);
|
||
|
|
-webkit-transition: all 0.2s ease-in-out;
|
||
|
|
-moz-transition: all 0.2s ease-in-out;
|
||
|
|
-o-transition: all 0.2s ease-in-out;
|
||
|
|
-ms-transition: all 0.2s ease-in-out;
|
||
|
|
transition: all 0.2s ease-in-out;
|
||
|
|
}
|
||
|
|
.btn:hover,
|
||
|
|
.btn.focus,
|
||
|
|
.btn:focus,
|
||
|
|
.btn.active,
|
||
|
|
.btn:active,
|
||
|
|
.btn.active.focus,
|
||
|
|
.btn.active:focus,
|
||
|
|
.btn.active:hover,
|
||
|
|
.btn:active.focus,
|
||
|
|
.btn:active:focus,
|
||
|
|
.btn:active:hover {
|
||
|
|
-webkit-box-shadow: none;
|
||
|
|
box-shadow: none;
|
||
|
|
outline: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button styles
|
||
|
|
================= */
|
||
|
|
|
||
|
|
/* Button default */
|
||
|
|
.btn-default {
|
||
|
|
color: #000;
|
||
|
|
background-color: rgba(189, 189, 189, 0.25);
|
||
|
|
border-color: transparent;
|
||
|
|
}
|
||
|
|
.btn-default:hover,
|
||
|
|
.btn-default.focus,
|
||
|
|
.btn-default:focus,
|
||
|
|
.btn-default.active,
|
||
|
|
.btn-default:active,
|
||
|
|
.btn-default.active.focus,
|
||
|
|
.btn-default.active:focus,
|
||
|
|
.btn-default.active:hover,
|
||
|
|
.btn-default:active.focus,
|
||
|
|
.btn-default:active:focus,
|
||
|
|
.btn-default:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-default,
|
||
|
|
.open > .dropdown-toggle.btn-default.focus,
|
||
|
|
.open > .dropdown-toggle.btn-default:focus,
|
||
|
|
.open > .dropdown-toggle.btn-default:hover {
|
||
|
|
color: #000;
|
||
|
|
background-color: rgba(189, 189, 189, 0.56);
|
||
|
|
border-color: transparent;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-default.btn-link {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.btn-default.btn-link:hover,
|
||
|
|
.btn-default.btn-link.focus,
|
||
|
|
.btn-default.btn-link:focus,
|
||
|
|
.btn-default.btn-link.active,
|
||
|
|
.btn-default.btn-link:active,
|
||
|
|
.btn-default.btn-link.active.focus,
|
||
|
|
.btn-default.btn-link.active:focus,
|
||
|
|
.btn-default.btn-link.active:hover,
|
||
|
|
.btn-default.btn-link:active.focus,
|
||
|
|
.btn-default.btn-link:active:focus,
|
||
|
|
.btn-default.btn-link:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-default.btn-link,
|
||
|
|
.open > .dropdown-toggle.btn-default.btn-link.focus,
|
||
|
|
.open > .dropdown-toggle.btn-default.btn-link:focus,
|
||
|
|
.open > .dropdown-toggle.btn-default.btn-link:hover {
|
||
|
|
color: #000;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-default-bordered {
|
||
|
|
color: #333;
|
||
|
|
background-color: transparent;
|
||
|
|
border-color: rgba(136, 136, 136, 0.35);
|
||
|
|
-webkit-box-shadow: none;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
.btn-default-bordered:hover,
|
||
|
|
.btn-default-bordered.focus,
|
||
|
|
.btn-default-bordered:focus,
|
||
|
|
.btn-default-bordered.active,
|
||
|
|
.btn-default-bordered:active,
|
||
|
|
.btn-default-bordered.active.focus,
|
||
|
|
.btn-default-bordered.active:focus,
|
||
|
|
.btn-default-bordered.active:hover,
|
||
|
|
.btn-default-bordered:active.focus,
|
||
|
|
.btn-default-bordered:active:focus,
|
||
|
|
.btn-default-bordered:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-default-bordered,
|
||
|
|
.open > .dropdown-toggle.btn-default-bordered.focus,
|
||
|
|
.open > .dropdown-toggle.btn-default-bordered:focus,
|
||
|
|
.open > .dropdown-toggle.btn-default-bordered:hover {
|
||
|
|
color: #000;
|
||
|
|
background-color: rgba(189, 189, 189, 0.56);
|
||
|
|
border-color: transparent;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button primary */
|
||
|
|
.btn-primary { /* same as template main color */
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #08c1b8;
|
||
|
|
border-color: #08c1b8;
|
||
|
|
}
|
||
|
|
.btn-primary:hover,
|
||
|
|
.btn-primary.focus,
|
||
|
|
.btn-primary:focus,
|
||
|
|
.btn-primary.active,
|
||
|
|
.btn-primary:active,
|
||
|
|
.btn-primary.active.focus,
|
||
|
|
.btn-primary.active:focus,
|
||
|
|
.btn-primary.active:hover,
|
||
|
|
.btn-primary:active.focus,
|
||
|
|
.btn-primary:active:focus,
|
||
|
|
.btn-primary:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-primary,
|
||
|
|
.open > .dropdown-toggle.btn-primary.focus,
|
||
|
|
.open > .dropdown-toggle.btn-primary:focus,
|
||
|
|
.open > .dropdown-toggle.btn-primary:hover {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #03afa6;
|
||
|
|
border-color: #03afa6
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-primary.btn-link {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.btn-primary.btn-link:hover,
|
||
|
|
.btn-primary.btn-link.focus,
|
||
|
|
.btn-primary.btn-link:focus,
|
||
|
|
.btn-primary.btn-link.active,
|
||
|
|
.btn-primary.btn-link:active,
|
||
|
|
.btn-primary.btn-link.active.focus,
|
||
|
|
.btn-primary.btn-link.active:focus,
|
||
|
|
.btn-primary.btn-link.active:hover,
|
||
|
|
.btn-primary.btn-link:active.focus,
|
||
|
|
.btn-primary.btn-link:active:focus,
|
||
|
|
.btn-primary.btn-link:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-primary.btn-link,
|
||
|
|
.open > .dropdown-toggle.btn-primary.btn-link.focus,
|
||
|
|
.open > .dropdown-toggle.btn-primary.btn-link:focus,
|
||
|
|
.open > .dropdown-toggle.btn-primary.btn-link:hover {
|
||
|
|
color: #03afa6;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-primary-bordered {
|
||
|
|
color: #08c1b8;
|
||
|
|
background-color: transparent;
|
||
|
|
border-color: #08c1b8;
|
||
|
|
-webkit-box-shadow: none;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
.btn-primary-bordered:hover,
|
||
|
|
.btn-primary-bordered.focus,
|
||
|
|
.btn-primary-bordered:focus,
|
||
|
|
.btn-primary-bordered.active,
|
||
|
|
.btn-primary-bordered:active,
|
||
|
|
.btn-primary-bordered.active.focus,
|
||
|
|
.btn-primary-bordered.active:focus,
|
||
|
|
.btn-primary-bordered.active:hover,
|
||
|
|
.btn-primary-bordered:active.focus,
|
||
|
|
.btn-primary-bordered:active:focus,
|
||
|
|
.btn-primary-bordered:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-primary-bordered,
|
||
|
|
.open > .dropdown-toggle.btn-primary-bordered.focus,
|
||
|
|
.open > .dropdown-toggle.btn-primary-bordered:focus,
|
||
|
|
.open > .dropdown-toggle.btn-primary-bordered:hover {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #03afa6;
|
||
|
|
border-color: #03afa6
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button success */
|
||
|
|
.btn-success {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #41b541;
|
||
|
|
border-color: #41b541;
|
||
|
|
}
|
||
|
|
.btn-success:hover,
|
||
|
|
.btn-success.focus,
|
||
|
|
.btn-success:focus,
|
||
|
|
.btn-success.active,
|
||
|
|
.btn-success:active,
|
||
|
|
.btn-success.active.focus,
|
||
|
|
.btn-success.active:focus,
|
||
|
|
.btn-success.active:hover,
|
||
|
|
.btn-success:active.focus,
|
||
|
|
.btn-success:active:focus,
|
||
|
|
.btn-success:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-success,
|
||
|
|
.open > .dropdown-toggle.btn-success.focus,
|
||
|
|
.open > .dropdown-toggle.btn-success:focus,
|
||
|
|
.open > .dropdown-toggle.btn-success:hover {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #449d44;
|
||
|
|
border-color: #449d44;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-success.btn-link {
|
||
|
|
color: #41b541;
|
||
|
|
}
|
||
|
|
.btn-success.btn-link:hover,
|
||
|
|
.btn-success.btn-link.focus,
|
||
|
|
.btn-success.btn-link:focus,
|
||
|
|
.btn-success.btn-link.active,
|
||
|
|
.btn-success.btn-link:active,
|
||
|
|
.btn-success.btn-link.active.focus,
|
||
|
|
.btn-success.btn-link.active:focus,
|
||
|
|
.btn-success.btn-link.active:hover,
|
||
|
|
.btn-success.btn-link:active.focus,
|
||
|
|
.btn-success.btn-link:active:focus,
|
||
|
|
.btn-success.btn-link:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-success.btn-link,
|
||
|
|
.open > .dropdown-toggle.btn-success.btn-link.focus,
|
||
|
|
.open > .dropdown-toggle.btn-success.btn-link:focus,
|
||
|
|
.open > .dropdown-toggle.btn-success.btn-link:hover {
|
||
|
|
color: #5cb85c;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-success-bordered {
|
||
|
|
color: #41b541;
|
||
|
|
background-color: transparent;
|
||
|
|
border-color: #41b541;
|
||
|
|
-webkit-box-shadow: none;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
.btn-success-bordered:hover,
|
||
|
|
.btn-success-bordered.focus,
|
||
|
|
.btn-success-bordered:focus,
|
||
|
|
.btn-success-bordered.active,
|
||
|
|
.btn-success-bordered:active,
|
||
|
|
.btn-success-bordered.active.focus,
|
||
|
|
.btn-success-bordered.active:focus,
|
||
|
|
.btn-success-bordered.active:hover,
|
||
|
|
.btn-success-bordered:active.focus,
|
||
|
|
.btn-success-bordered:active:focus,
|
||
|
|
.btn-success-bordered:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-success-bordered,
|
||
|
|
.open > .dropdown-toggle.btn-success-bordered.focus,
|
||
|
|
.open > .dropdown-toggle.btn-success-bordered:focus,
|
||
|
|
.open > .dropdown-toggle.btn-success-bordered:hover {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #41b541;
|
||
|
|
border-color: #41b541;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button info */
|
||
|
|
.btn-info {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #31B0D5;
|
||
|
|
border-color: #31B0D5;
|
||
|
|
}
|
||
|
|
.btn-info:hover,
|
||
|
|
.btn-info.focus,
|
||
|
|
.btn-info:focus,
|
||
|
|
.btn-info.active,
|
||
|
|
.btn-info:active,
|
||
|
|
.btn-info.active.focus,
|
||
|
|
.btn-info.active:focus,
|
||
|
|
.btn-info.active:hover,
|
||
|
|
.btn-info:active.focus,
|
||
|
|
.btn-info:active:focus,
|
||
|
|
.btn-info:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-info,
|
||
|
|
.open > .dropdown-toggle.btn-info.focus,
|
||
|
|
.open > .dropdown-toggle.btn-info:focus,
|
||
|
|
.open > .dropdown-toggle.btn-info:hover {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #2398BB;
|
||
|
|
border-color: #2398BB;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-info.btn-link {
|
||
|
|
color: #31B0D5;
|
||
|
|
}
|
||
|
|
.btn-info.btn-link:hover,
|
||
|
|
.btn-info.btn-link.focus,
|
||
|
|
.btn-info.btn-link:focus,
|
||
|
|
.btn-info.btn-link.active,
|
||
|
|
.btn-info.btn-link:active,
|
||
|
|
.btn-info.btn-link.active.focus,
|
||
|
|
.btn-info.btn-link.active:focus,
|
||
|
|
.btn-info.btn-link.active:hover,
|
||
|
|
.btn-info.btn-link:active.focus,
|
||
|
|
.btn-info.btn-link:active:focus,
|
||
|
|
.btn-info.btn-link:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-info.btn-link,
|
||
|
|
.open > .dropdown-toggle.btn-info.btn-link.focus,
|
||
|
|
.open > .dropdown-toggle.btn-info.btn-link:focus,
|
||
|
|
.open > .dropdown-toggle.btn-info.btn-link:hover {
|
||
|
|
color: #31B0D5;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-info-bordered {
|
||
|
|
color: #5BC0DE;
|
||
|
|
background-color: transparent;
|
||
|
|
border-color: #5BC0DE;
|
||
|
|
-webkit-box-shadow: none;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
.btn-info-bordered:hover,
|
||
|
|
.btn-info-bordered.focus,
|
||
|
|
.btn-info-bordered:focus,
|
||
|
|
.btn-info-bordered.active,
|
||
|
|
.btn-info-bordered:active,
|
||
|
|
.btn-info-bordered.active.focus,
|
||
|
|
.btn-info-bordered.active:focus,
|
||
|
|
.btn-info-bordered.active:hover,
|
||
|
|
.btn-info-bordered:active.focus,
|
||
|
|
.btn-info-bordered:active:focus,
|
||
|
|
.btn-info-bordered:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-info-bordered,
|
||
|
|
.open > .dropdown-toggle.btn-info-bordered.focus,
|
||
|
|
.open > .dropdown-toggle.btn-info-bordered:focus,
|
||
|
|
.open > .dropdown-toggle.btn-info-bordered:hover {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #31B0D5;
|
||
|
|
border-color: #31B0D5;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button warning */
|
||
|
|
.btn-warning {
|
||
|
|
color: #333;
|
||
|
|
background-color: #FBD320;
|
||
|
|
border-color: #FBD320;
|
||
|
|
}
|
||
|
|
.btn-warning:hover,
|
||
|
|
.btn-warning.focus,
|
||
|
|
.btn-warning:focus,
|
||
|
|
.btn-warning.active,
|
||
|
|
.btn-warning:active,
|
||
|
|
.btn-warning.active.focus,
|
||
|
|
.btn-warning.active:focus,
|
||
|
|
.btn-warning.active:hover,
|
||
|
|
.btn-warning:active.focus,
|
||
|
|
.btn-warning:active:focus,
|
||
|
|
.btn-warning:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-warning,
|
||
|
|
.open > .dropdown-toggle.btn-warning.focus,
|
||
|
|
.open > .dropdown-toggle.btn-warning:focus,
|
||
|
|
.open > .dropdown-toggle.btn-warning:hover {
|
||
|
|
color: #333;
|
||
|
|
background-color: #ECC71F;
|
||
|
|
border-color: #ECC71F;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-warning.btn-link {
|
||
|
|
color: #d8b411;
|
||
|
|
}
|
||
|
|
.btn-warning.btn-link:hover,
|
||
|
|
.btn-warning.btn-link.focus,
|
||
|
|
.btn-warning.btn-link:focus,
|
||
|
|
.btn-warning.btn-link.active,
|
||
|
|
.btn-warning.btn-link:active,
|
||
|
|
.btn-warning.btn-link.active.focus,
|
||
|
|
.btn-warning.btn-link.active:focus,
|
||
|
|
.btn-warning.btn-link.active:hover,
|
||
|
|
.btn-warning.btn-link:active.focus,
|
||
|
|
.btn-warning.btn-link:active:focus,
|
||
|
|
.btn-warning.btn-link:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-warning.btn-link,
|
||
|
|
.open > .dropdown-toggle.btn-warning.btn-link.focus,
|
||
|
|
.open > .dropdown-toggle.btn-warning.btn-link:focus,
|
||
|
|
.open > .dropdown-toggle.btn-warning.btn-link:hover {
|
||
|
|
color: #bd9c08;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-warning-bordered {
|
||
|
|
color: #d8b411;
|
||
|
|
background-color: transparent;
|
||
|
|
border-color: #ECC71F;
|
||
|
|
-webkit-box-shadow: none;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
.btn-warning-bordered:hover,
|
||
|
|
.btn-warning-bordered.focus,
|
||
|
|
.btn-warning-bordered:focus,
|
||
|
|
.btn-warning-bordered.active,
|
||
|
|
.btn-warning-bordered:active,
|
||
|
|
.btn-warning-bordered.active.focus,
|
||
|
|
.btn-warning-bordered.active:focus,
|
||
|
|
.btn-warning-bordered.active:hover,
|
||
|
|
.btn-warning-bordered:active.focus,
|
||
|
|
.btn-warning-bordered:active:focus,
|
||
|
|
.btn-warning-bordered:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-warning-bordered,
|
||
|
|
.open > .dropdown-toggle.btn-warning-bordered.focus,
|
||
|
|
.open > .dropdown-toggle.btn-warning-bordered:focus,
|
||
|
|
.open > .dropdown-toggle.btn-warning-bordered:hover {
|
||
|
|
color: #333;
|
||
|
|
background-color: #ECC71F;
|
||
|
|
border-color: #ECC71F;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button danger */
|
||
|
|
.btn-danger {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #EC3A35;
|
||
|
|
border-color: #EC3A35;
|
||
|
|
}
|
||
|
|
.btn-danger:hover,
|
||
|
|
.btn-danger.focus,
|
||
|
|
.btn-danger:focus,
|
||
|
|
.btn-danger.active,
|
||
|
|
.btn-danger:active,
|
||
|
|
.btn-danger.active.focus,
|
||
|
|
.btn-danger.active:focus,
|
||
|
|
.btn-danger.active:hover,
|
||
|
|
.btn-danger:active.focus,
|
||
|
|
.btn-danger:active:focus,
|
||
|
|
.btn-danger:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-danger,
|
||
|
|
.open > .dropdown-toggle.btn-danger.focus,
|
||
|
|
.open > .dropdown-toggle.btn-danger:focus,
|
||
|
|
.open > .dropdown-toggle.btn-danger:hover {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #C9302C;
|
||
|
|
border-color: #C9302C;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-danger.btn-link {
|
||
|
|
color: #EC3A35;
|
||
|
|
}
|
||
|
|
.btn-danger.btn-link:hover,
|
||
|
|
.btn-danger.btn-link.focus,
|
||
|
|
.btn-danger.btn-link:focus,
|
||
|
|
.btn-danger.btn-link.active,
|
||
|
|
.btn-danger.btn-link:active,
|
||
|
|
.btn-danger.btn-link.active.focus,
|
||
|
|
.btn-danger.btn-link.active:focus,
|
||
|
|
.btn-danger.btn-link.active:hover,
|
||
|
|
.btn-danger.btn-link:active.focus,
|
||
|
|
.btn-danger.btn-link:active:focus,
|
||
|
|
.btn-danger.btn-link:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-danger.btn-link,
|
||
|
|
.open > .dropdown-toggle.btn-danger.btn-link.focus,
|
||
|
|
.open > .dropdown-toggle.btn-danger.btn-link:focus,
|
||
|
|
.open > .dropdown-toggle.btn-danger.btn-link:hover {
|
||
|
|
color: #EC3A35;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-danger-bordered {
|
||
|
|
color: #EC3A35;
|
||
|
|
background-color: transparent;
|
||
|
|
border-color: #EC3A35;
|
||
|
|
-webkit-box-shadow: none;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
.btn-danger-bordered:hover,
|
||
|
|
.btn-danger-bordered.focus,
|
||
|
|
.btn-danger-bordered:focus,
|
||
|
|
.btn-danger-bordered.active,
|
||
|
|
.btn-danger-bordered:active,
|
||
|
|
.btn-danger-bordered.active.focus,
|
||
|
|
.btn-danger-bordered.active:focus,
|
||
|
|
.btn-danger-bordered.active:hover,
|
||
|
|
.btn-danger-bordered:active.focus,
|
||
|
|
.btn-danger-bordered:active:focus,
|
||
|
|
.btn-danger-bordered:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-danger-bordered,
|
||
|
|
.open > .dropdown-toggle.btn-danger-bordered.focus,
|
||
|
|
.open > .dropdown-toggle.btn-danger-bordered:focus,
|
||
|
|
.open > .dropdown-toggle.btn-danger-bordered:hover {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #EC3A35;
|
||
|
|
border-color: #EC3A35;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button dark */
|
||
|
|
.btn-dark {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #222;
|
||
|
|
border-color: #222;
|
||
|
|
}
|
||
|
|
.btn-dark:hover,
|
||
|
|
.btn-dark.focus,
|
||
|
|
.btn-dark:focus,
|
||
|
|
.btn-dark.active,
|
||
|
|
.btn-dark:active,
|
||
|
|
.btn-dark.active.focus,
|
||
|
|
.btn-dark.active:focus,
|
||
|
|
.btn-dark.active:hover,
|
||
|
|
.btn-dark:active.focus,
|
||
|
|
.btn-dark:active:focus,
|
||
|
|
.btn-dark:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-dark,
|
||
|
|
.open > .dropdown-toggle.btn-dark.focus,
|
||
|
|
.open > .dropdown-toggle.btn-dark:focus,
|
||
|
|
.open > .dropdown-toggle.btn-dark:hover {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #333;
|
||
|
|
border-color: #333;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-dark.btn-link {
|
||
|
|
color: #222;
|
||
|
|
}
|
||
|
|
.btn-dark.btn-link:hover,
|
||
|
|
.btn-dark.btn-link.focus,
|
||
|
|
.btn-dark.btn-link:focus,
|
||
|
|
.btn-dark.btn-link.active,
|
||
|
|
.btn-dark.btn-link:active,
|
||
|
|
.btn-dark.btn-link.active.focus,
|
||
|
|
.btn-dark.btn-link.active:focus,
|
||
|
|
.btn-dark.btn-link.active:hover,
|
||
|
|
.btn-dark.btn-link:active.focus,
|
||
|
|
.btn-dark.btn-link:active:focus,
|
||
|
|
.btn-dark.btn-link:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-dark.btn-link,
|
||
|
|
.open > .dropdown-toggle.btn-dark.btn-link.focus,
|
||
|
|
.open > .dropdown-toggle.btn-dark.btn-link:focus,
|
||
|
|
.open > .dropdown-toggle.btn-dark.btn-link:hover {
|
||
|
|
color: #000;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-dark-bordered {
|
||
|
|
color: #222;
|
||
|
|
background-color: transparent;
|
||
|
|
border: 2px solid #222;
|
||
|
|
-webkit-box-shadow: none;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
.btn-dark-bordered:hover,
|
||
|
|
.btn-dark-bordered.focus,
|
||
|
|
.btn-dark-bordered:focus,
|
||
|
|
.btn-dark-bordered.active,
|
||
|
|
.btn-dark-bordered:active,
|
||
|
|
.btn-dark-bordered.active.focus,
|
||
|
|
.btn-dark-bordered.active:focus,
|
||
|
|
.btn-dark-bordered.active:hover,
|
||
|
|
.btn-dark-bordered:active.focus,
|
||
|
|
.btn-dark-bordered:active:focus,
|
||
|
|
.btn-dark-bordered:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-dark-bordered,
|
||
|
|
.open > .dropdown-toggle.btn-dark-bordered.focus,
|
||
|
|
.open > .dropdown-toggle.btn-dark-bordered:focus,
|
||
|
|
.open > .dropdown-toggle.btn-dark-bordered:hover {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #222;
|
||
|
|
border-color: #222;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button white */
|
||
|
|
.btn-white {
|
||
|
|
color: #333;
|
||
|
|
background-color: #FFF;
|
||
|
|
border-color: #FFF;
|
||
|
|
}
|
||
|
|
.btn-white:hover,
|
||
|
|
.btn-white.focus,
|
||
|
|
.btn-white:focus,
|
||
|
|
.btn-white.active,
|
||
|
|
.btn-white:active,
|
||
|
|
.btn-white.active.focus,
|
||
|
|
.btn-white.active:focus,
|
||
|
|
.btn-white.active:hover,
|
||
|
|
.btn-white:active.focus,
|
||
|
|
.btn-white:active:focus,
|
||
|
|
.btn-white:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-white,
|
||
|
|
.open > .dropdown-toggle.btn-white.focus,
|
||
|
|
.open > .dropdown-toggle.btn-white:focus,
|
||
|
|
.open > .dropdown-toggle.btn-white:hover {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: transparent;
|
||
|
|
border-color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-white.btn-link {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.btn-white.btn-link:hover,
|
||
|
|
.btn-white.btn-link.focus,
|
||
|
|
.btn-white.btn-link:focus,
|
||
|
|
.btn-white.btn-link.active,
|
||
|
|
.btn-white.btn-link:active,
|
||
|
|
.btn-white.btn-link.active.focus,
|
||
|
|
.btn-white.btn-link.active:focus,
|
||
|
|
.btn-white.btn-link.active:hover,
|
||
|
|
.btn-white.btn-link:active.focus,
|
||
|
|
.btn-white.btn-link:active:focus,
|
||
|
|
.btn-white.btn-link:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-white.btn-link,
|
||
|
|
.open > .dropdown-toggle.btn-white.btn-link.focus,
|
||
|
|
.open > .dropdown-toggle.btn-white.btn-link:focus,
|
||
|
|
.open > .dropdown-toggle.btn-white.btn-link:hover {
|
||
|
|
color: #DDD;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn-white-bordered {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: transparent;
|
||
|
|
border: 2px solid #FFF;
|
||
|
|
-webkit-box-shadow: none;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
.btn-white-bordered:hover,
|
||
|
|
.btn-white-bordered.focus,
|
||
|
|
.btn-white-bordered:focus,
|
||
|
|
.btn-white-bordered.active,
|
||
|
|
.btn-white-bordered:active,
|
||
|
|
.btn-white-bordered.active.focus,
|
||
|
|
.btn-white-bordered.active:focus,
|
||
|
|
.btn-white-bordered.active:hover,
|
||
|
|
.btn-white-bordered:active.focus,
|
||
|
|
.btn-white-bordered:active:focus,
|
||
|
|
.btn-white-bordered:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-white-bordered,
|
||
|
|
.open > .dropdown-toggle.btn-white-bordered.focus,
|
||
|
|
.open > .dropdown-toggle.btn-white-bordered:focus,
|
||
|
|
.open > .dropdown-toggle.btn-white-bordered:hover {
|
||
|
|
color: #333;
|
||
|
|
background-color: #FFF;
|
||
|
|
border-color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button link */
|
||
|
|
.btn-link {
|
||
|
|
background-color: transparent !important;
|
||
|
|
margin: 0;
|
||
|
|
padding: 5px;
|
||
|
|
color: #08c1b8; /* same as template main link color */
|
||
|
|
border-color: transparent !important;
|
||
|
|
}
|
||
|
|
.btn-link:hover,
|
||
|
|
.btn-link.focus,
|
||
|
|
.btn-link:focus,
|
||
|
|
.btn-link.active,
|
||
|
|
.btn-link:active,
|
||
|
|
.btn-link.active.focus,
|
||
|
|
.btn-link.active:focus,
|
||
|
|
.btn-link.active:hover,
|
||
|
|
.btn-link:active.focus,
|
||
|
|
.btn-link:active:focus,
|
||
|
|
.btn-link:active:hover,
|
||
|
|
.open > .dropdown-toggle.btn-link,
|
||
|
|
.open > .dropdown-toggle.btn-link.focus,
|
||
|
|
.open > .dropdown-toggle.btn-link:focus,
|
||
|
|
.open > .dropdown-toggle.btn-link:hover {
|
||
|
|
opacity: .8;
|
||
|
|
color: #08c1b8;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button with dropdown
|
||
|
|
======================== */
|
||
|
|
.btn-group > .btn + .dropdown-toggle {
|
||
|
|
padding-right: 10px;
|
||
|
|
padding-left: 10px;
|
||
|
|
}
|
||
|
|
.btn-group .btn + .btn,
|
||
|
|
.btn-group .btn + .btn-group,
|
||
|
|
.btn-group .btn-group + .btn,
|
||
|
|
.btn-group .btn-group + .btn-group {
|
||
|
|
margin-left: -2px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Button social
|
||
|
|
================= */
|
||
|
|
.btn-social {
|
||
|
|
position: relative;
|
||
|
|
padding-left: 55px;
|
||
|
|
text-align: left;
|
||
|
|
color: #fff;
|
||
|
|
white-space: nowrap;
|
||
|
|
overflow: hidden;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button social icon */
|
||
|
|
.btn-social > .btn-social-icon {
|
||
|
|
position: absolute;
|
||
|
|
left: 0;
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
width: 42px;
|
||
|
|
line-height: 40px;
|
||
|
|
font-size: 1.4em;
|
||
|
|
text-align: center;
|
||
|
|
border-right: 1px solid rgba(0,0,0,0.12);
|
||
|
|
}
|
||
|
|
.btn-social > .btn-social-icon > i {
|
||
|
|
position: absolute;
|
||
|
|
top: 50%;
|
||
|
|
left: 50%;
|
||
|
|
text-align: center;
|
||
|
|
padding-right: 0;
|
||
|
|
-moz-transform: translate(-50%, -50%);
|
||
|
|
-ms-transform: translate(-50%, -50%);
|
||
|
|
-webkit-transform: translate(-50%, -50%);
|
||
|
|
transform: translate(-50%, -50%);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button social sizes */
|
||
|
|
.btn-social.btn-xs { padding-left: 55px; }
|
||
|
|
.btn-social.btn-sm { padding-left: 55px; }
|
||
|
|
.btn-social.btn-lg { padding-left: 60px; }
|
||
|
|
.btn-social.btn-xlg { padding-left: 65px; }
|
||
|
|
|
||
|
|
/* Button social min */
|
||
|
|
.btn-social-min {
|
||
|
|
position: relative;
|
||
|
|
width: 46px;
|
||
|
|
height: 46px;
|
||
|
|
line-height: 44px;
|
||
|
|
padding: 0 !important;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
.btn-social-min.btn-xs {
|
||
|
|
width: 26px;
|
||
|
|
height: 26px;
|
||
|
|
line-height: 24px;
|
||
|
|
}
|
||
|
|
.btn-social-min.btn-sm {
|
||
|
|
width: 35px;
|
||
|
|
height: 35px;
|
||
|
|
line-height: 33px;
|
||
|
|
}
|
||
|
|
.btn-social-min.btn-lg {
|
||
|
|
width: 55px;
|
||
|
|
height: 55px;
|
||
|
|
line-height: 53px;
|
||
|
|
}
|
||
|
|
.btn-social-min.btn-xlg {
|
||
|
|
width: 69px;
|
||
|
|
height: 69px;
|
||
|
|
line-height: 67px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button facebook */
|
||
|
|
.btn-facebook {
|
||
|
|
background-color: #3b5998;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.btn-facebook:hover, .btn-facebook:focus, .btn-facebook:active, .btn-facebook.active, .open > .dropdown-toggle.btn-facebook {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #2d4373;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button twitter */
|
||
|
|
.btn-twitter {
|
||
|
|
background-color: #55acee;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.btn-twitter:hover, .btn-twitter:focus, .btn-twitter:active, .btn-twitter.active, .open > .dropdown-toggle.btn-twitter {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #2795e9;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button dropbox */
|
||
|
|
.btn-dropbox {
|
||
|
|
background-color: #1087dd;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.btn-dropbox:hover, .btn-dropbox:focus, .btn-dropbox:active, .btn-dropbox.active, .open > .dropdown-toggle.btn-dropbox {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #0d6aad;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button linkedin */
|
||
|
|
.btn-linkedin {
|
||
|
|
background-color: #007bb6;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.btn-linkedin:hover, .btn-linkedin:focus, .btn-linkedin:active, .btn-linkedin.active, .open > .dropdown-toggle.btn-linkedin {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #005983;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button pinterest */
|
||
|
|
.btn-pinterest {
|
||
|
|
background-color: #cb2027;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.btn-pinterest:hover, .btn-pinterest:focus, .btn-pinterest:active, .btn-pinterest.active, .open > .dropdown-toggle.btn-pinterest {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #9f191f;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button google */
|
||
|
|
.btn-google {
|
||
|
|
background-color: #dd4b39;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.btn-google:hover, .btn-google:focus, .btn-google:active, .btn-google.active, .open > .dropdown-toggle.btn-google {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #c23321;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button instagram */
|
||
|
|
.btn-instagram {
|
||
|
|
background-color: #3f729b;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.btn-instagram:hover, .btn-instagram:focus, .btn-instagram:active, .btn-instagram.active, .open > .dropdown-toggle.btn-instagram {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #2b6492;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button linkedin */
|
||
|
|
.btn-linkedin {
|
||
|
|
background-color: #3f729b;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.btn-linkedin:hover, .btn-linkedin:focus, .btn-linkedin:active, .btn-linkedin.active, .open > .dropdown-toggle.btn-linkedin {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #305777;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button tumblr */
|
||
|
|
.btn-tumblr {
|
||
|
|
background-color: #2c4762;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.btn-tumblr:hover, .btn-tumblr:focus, .btn-tumblr:active, .btn-tumblr.active, .open > .dropdown-toggle.btn-tumblr {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #1c2d3f;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button vk */
|
||
|
|
.btn-vk {
|
||
|
|
background-color: #587ea3;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.btn-vk:hover, .btn-vk:focus, .btn-vk:active, .btn-vk.active, .open > .dropdown-toggle.btn-vk {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #466482;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button flickr */
|
||
|
|
.btn-flickr {
|
||
|
|
background-color: #ff0084;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.btn-flickr:hover, .btn-flickr:focus, .btn-flickr:active, .btn-flickr.active, .open > .dropdown-toggle.btn-flickr {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #cc006a;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button soundcloud */
|
||
|
|
.btn-soundcloud {
|
||
|
|
background-color: #f50;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.btn-soundcloud:hover, .btn-soundcloud:focus, .btn-soundcloud:active, .btn-soundcloud.active, .open > .dropdown-toggle.btn-soundcloud {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #c40;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button yahoo */
|
||
|
|
.btn-yahoo {
|
||
|
|
background-color: #720e9e;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.btn-yahoo:hover, .btn-yahoo:focus, .btn-yahoo:active, .btn-yahoo.active, .open > .dropdown-toggle.btn-yahoo {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #500a6f;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button dribbble */
|
||
|
|
.btn-dribbble {
|
||
|
|
background-color: #333;
|
||
|
|
color: #ea4c89;
|
||
|
|
}
|
||
|
|
.btn-dribbble:hover, .btn-dribbble:focus, .btn-dribbble:active, .btn-dribbble.active, .open > .dropdown-toggle.btn-dribbble {
|
||
|
|
color: #ea4c89;
|
||
|
|
background-color: #111;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button youtube */
|
||
|
|
.btn-youtube {
|
||
|
|
background-color: #cc181e;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
.btn-youtube:hover, .btn-youtube:focus, .btn-youtube:active, .btn-youtube.active, .open > .dropdown-toggle.btn-youtube {
|
||
|
|
color: #FFF;
|
||
|
|
background-color: #b5090f;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Button close
|
||
|
|
================= */
|
||
|
|
.tt-close-btn {
|
||
|
|
position: relative;
|
||
|
|
display: inline-block;
|
||
|
|
top: 6px;
|
||
|
|
width: 21px;
|
||
|
|
height: 21px;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
-webkit-transform: rotate(45deg);
|
||
|
|
-moz-transform: rotate(45deg);
|
||
|
|
-o-transform: rotate(45deg);
|
||
|
|
-ms-transform: rotate(45deg);
|
||
|
|
transform: rotate(45deg);
|
||
|
|
|
||
|
|
-webkit-transition: all 0.3s ease-in-out;
|
||
|
|
-moz-transition: all 0.3s ease-in-out;
|
||
|
|
-o-transition: all 0.3s ease-in-out;
|
||
|
|
-ms-transition: all 0.3s ease-in-out;
|
||
|
|
transition: all 0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.tt-close-btn:hover {
|
||
|
|
-webkit-transform: rotate(135deg);
|
||
|
|
-moz-transform: rotate(135deg);
|
||
|
|
-o-transform: rotate(135deg);
|
||
|
|
-ms-transform: rotate(135deg);
|
||
|
|
transform: rotate(135deg);
|
||
|
|
}
|
||
|
|
.tt-close-btn:before,
|
||
|
|
.tt-close-btn:after {
|
||
|
|
content: '';
|
||
|
|
position: absolute;
|
||
|
|
background-color: #222;
|
||
|
|
}
|
||
|
|
.tt-close-btn:before {
|
||
|
|
left: 0;
|
||
|
|
top: 9px;
|
||
|
|
width: 100%;
|
||
|
|
height: 3px;
|
||
|
|
}
|
||
|
|
.tt-close-btn:after {
|
||
|
|
left: 9px;
|
||
|
|
top: 0;
|
||
|
|
width: 3px;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button close light color*/
|
||
|
|
.tt-close-btn.tt-close-light:before,
|
||
|
|
.tt-close-btn.tt-close-light:after {
|
||
|
|
background-color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Button rounded
|
||
|
|
================== */
|
||
|
|
.btn-rounded {
|
||
|
|
-webkit-border-radius: 4px;
|
||
|
|
-moz-border-radius: 4px;
|
||
|
|
border-radius: 4px;
|
||
|
|
}
|
||
|
|
.btn-rounded-2x {
|
||
|
|
-webkit-border-radius: 8px;
|
||
|
|
-moz-border-radius: 8px;
|
||
|
|
border-radius: 8px;
|
||
|
|
}
|
||
|
|
.btn-rounded-3x {
|
||
|
|
-webkit-border-radius: 12px;
|
||
|
|
-moz-border-radius: 12px;
|
||
|
|
border-radius: 12px;
|
||
|
|
}
|
||
|
|
.btn-rounded-4x {
|
||
|
|
-webkit-border-radius: 20px;
|
||
|
|
-moz-border-radius: 20px;
|
||
|
|
border-radius: 20px;
|
||
|
|
}
|
||
|
|
.btn-rounded-5x {
|
||
|
|
-webkit-border-radius: 40px;
|
||
|
|
-moz-border-radius: 40px;
|
||
|
|
border-radius: 40px;
|
||
|
|
}
|
||
|
|
.btn-rounded-full {
|
||
|
|
-webkit-border-radius: 50%;
|
||
|
|
-moz-border-radius: 50%;
|
||
|
|
border-radius: 50%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Button sizes
|
||
|
|
================ */
|
||
|
|
.btn-group-xs > .btn, .btn-xs {
|
||
|
|
padding: 0 6px 0 6px;
|
||
|
|
font-size: 13px;
|
||
|
|
}
|
||
|
|
.btn-group-sm > .btn, .btn-sm {
|
||
|
|
padding: 5px 10px;
|
||
|
|
font-size: 14px;
|
||
|
|
}
|
||
|
|
.btn-group-lg > .btn, .btn-lg {
|
||
|
|
padding: 13px 25px;
|
||
|
|
}
|
||
|
|
.btn-group-xlg > .btn, .btn-xlg { /* Extra size */
|
||
|
|
padding: 20px 30px;
|
||
|
|
font-size: 19px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Social buttons
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.social-buttons {
|
||
|
|
}
|
||
|
|
.social-buttons ul {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
}
|
||
|
|
.social-buttons ul > li {
|
||
|
|
display: inline-block;
|
||
|
|
margin: 0 2px;
|
||
|
|
}
|
||
|
|
.social-buttons ul > li:first-child {
|
||
|
|
margin-left: 0;
|
||
|
|
}
|
||
|
|
.social-buttons ul > li:last-child {
|
||
|
|
margin-right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Follow me buttons
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
.follow-me-buttons {
|
||
|
|
}
|
||
|
|
.follow-me-buttons ul {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
}
|
||
|
|
.follow-me-buttons ul > li {
|
||
|
|
display: inline-block;
|
||
|
|
margin: 4px;
|
||
|
|
}
|
||
|
|
.follow-me-buttons ul > li:first-child {
|
||
|
|
margin-left: 0;
|
||
|
|
}
|
||
|
|
.follow-me-buttons ul > li:last-child {
|
||
|
|
margin-right: 0;
|
||
|
|
}
|
||
|
|
.follow-me-buttons a {
|
||
|
|
font-size: 16px;
|
||
|
|
color: #222;
|
||
|
|
}
|
||
|
|
.follow-me-buttons a:hover {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* ------------------------------------------------------------- *
|
||
|
|
* Footer
|
||
|
|
/* ------------------------------------------------------------- */
|
||
|
|
|
||
|
|
#footer {
|
||
|
|
position: relative;
|
||
|
|
height: 100%;
|
||
|
|
background-color: #F3F3F3;
|
||
|
|
margin-top: 80px;
|
||
|
|
margin-left: auto;
|
||
|
|
margin-right: auto;
|
||
|
|
padding: 80px 0 0 0;
|
||
|
|
border-top: 1px solid rgba(134, 134, 134, 0.05);
|
||
|
|
}
|
||
|
|
@media (max-width: 1200px) {
|
||
|
|
#footer {
|
||
|
|
margin-top: 60px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
#footer {
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 767px) {
|
||
|
|
#footer {
|
||
|
|
margin-top: 60px;
|
||
|
|
padding-top: 40px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.footer-inner {
|
||
|
|
}
|
||
|
|
|
||
|
|
.footer-container {
|
||
|
|
padding-left: 15px;
|
||
|
|
padding-right: 15px;
|
||
|
|
}
|
||
|
|
@media (min-width: 1440px) {
|
||
|
|
.footer-container {
|
||
|
|
padding-left: 5%;
|
||
|
|
padding-right: 5%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* footer logo */
|
||
|
|
#footer-logo {
|
||
|
|
margin: 15px 0 35px 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer-logo .logo-light {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer-logo .logo-light-m,
|
||
|
|
#footer-logo .logo-dark-m {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (max-width: 767px) {
|
||
|
|
#footer-logo .logo-dark {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
#footer-logo .logo-dark-m {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* footer text */
|
||
|
|
.footer-text {
|
||
|
|
padding-right: 30px;
|
||
|
|
font-size: 15px;
|
||
|
|
font-weight: 300;
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.footer-text {
|
||
|
|
padding-right: 0;
|
||
|
|
margin-bottom: 30px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* footer social buttons */
|
||
|
|
#footer .social-buttons {
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
#footer .social-buttons {
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* footer footer subscribe form */
|
||
|
|
#footer-subscribe-form {
|
||
|
|
max-width: 320px;
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
#footer-subscribe-form {
|
||
|
|
margin-left: auto;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
#footer-subscribe-form {
|
||
|
|
margin-left: auto;
|
||
|
|
margin-right: auto;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* footer bottom
|
||
|
|
================= */
|
||
|
|
.footer-bottom {
|
||
|
|
background-color: #FFF;
|
||
|
|
margin-top: 40px;
|
||
|
|
padding: 20px 0;
|
||
|
|
border-top: 1px solid rgba(128, 128, 128, 0.15);
|
||
|
|
}
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.footer-bottom {
|
||
|
|
padding: 20px 0 40px 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* footer copyright */
|
||
|
|
.footer-copyright {
|
||
|
|
font-size: 12px;
|
||
|
|
color: #888;
|
||
|
|
}
|
||
|
|
.footer-copyright p {
|
||
|
|
margin-bottom: 0;
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.footer-copyright p {
|
||
|
|
margin-bottom: 5px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.footer-copyright a {
|
||
|
|
color: #08c1b8;
|
||
|
|
}
|
||
|
|
.footer-copyright a:hover {
|
||
|
|
opacity: .8;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* footer menu */
|
||
|
|
.footer-menu {
|
||
|
|
margin: 6px 0 0 0;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
}
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
.footer-menu {
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
.footer-menu {
|
||
|
|
margin-bottom: 30px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.footer-menu > li {
|
||
|
|
display: inline-block;
|
||
|
|
margin: 0 5px;
|
||
|
|
}
|
||
|
|
.footer-menu > li > a {
|
||
|
|
position: relative;
|
||
|
|
display: block;
|
||
|
|
font-size: 13px;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.footer-menu > li > a:hover {
|
||
|
|
color: #000;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Scroll to top button
|
||
|
|
======================== */
|
||
|
|
.scrolltotop {
|
||
|
|
position: fixed;
|
||
|
|
display: none;
|
||
|
|
bottom: 20px;
|
||
|
|
right: 20px;
|
||
|
|
width: 34px;
|
||
|
|
height: 34px;
|
||
|
|
line-height: 34px;
|
||
|
|
background-color: rgba(169, 169, 169, 0.4);
|
||
|
|
text-align: center;
|
||
|
|
font-size: 16px;
|
||
|
|
color: #FFF;
|
||
|
|
text-decoration: none;
|
||
|
|
border-radius: 50px;
|
||
|
|
z-index: 99999;
|
||
|
|
}
|
||
|
|
@media (max-width: 1560px) {
|
||
|
|
.scrolltotop {
|
||
|
|
bottom: 70px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (max-width: 992px) {
|
||
|
|
.scrolltotop {
|
||
|
|
bottom: 20px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.scrolltotop:hover,
|
||
|
|
.scrolltotop:focus {
|
||
|
|
background-color: #08c1b8;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* footer simple
|
||
|
|
================= */
|
||
|
|
#footer.footer-simple {
|
||
|
|
padding: 100px 0 80px 0;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
#footer.footer-simple {
|
||
|
|
padding: 80px 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer.footer-simple #footer-logo {
|
||
|
|
margin-top: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer.footer-simple .footer-menu {
|
||
|
|
margin-bottom: 30px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer.footer-simple .social-buttons {
|
||
|
|
margin-bottom: 30px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer.footer-simple #footer-subscribe-form {
|
||
|
|
max-width: 400px;
|
||
|
|
margin-left: auto;
|
||
|
|
margin-right: auto;
|
||
|
|
margin-bottom: 40px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer.footer-simple .footer-copyright {
|
||
|
|
font-size: 13px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
#footer.footer-simple .footer-copyright p {
|
||
|
|
margin-bottom: 5px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* footer minimal
|
||
|
|
================== */
|
||
|
|
#footer.footer-minimal {
|
||
|
|
height: 80px;
|
||
|
|
padding: 22px 0;
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
#footer.footer-minimal {
|
||
|
|
height: auto;
|
||
|
|
padding: 60px 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 1440px) {
|
||
|
|
#footer.footer-minimal .footer-container {
|
||
|
|
padding-left: 2%;
|
||
|
|
padding-right: 2%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
body.tt-boxed #footer.footer-minimal .footer-container {
|
||
|
|
padding-left: 15px;
|
||
|
|
padding-right: 15px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer.footer-minimal .social-buttons {
|
||
|
|
margin-bottom: 0;
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
@media (max-width: 991px) {
|
||
|
|
#footer.footer-minimal .social-buttons {
|
||
|
|
margin-bottom: 30px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer.footer-minimal .social-buttons .btn-link {
|
||
|
|
width: 30px;
|
||
|
|
height: 35px;
|
||
|
|
line-height: 35px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* footer dark
|
||
|
|
================= */
|
||
|
|
#footer.footer-dark {
|
||
|
|
background-color: #121212;
|
||
|
|
color: #CCC;
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer.footer-dark .footer-menu > li > a {
|
||
|
|
color: #888;
|
||
|
|
}
|
||
|
|
#footer.footer-dark .footer-menu > li > a:hover {
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer.footer-dark .btn-default {
|
||
|
|
color: #DDD;
|
||
|
|
background-color: rgba(189, 189, 189, 0.13);
|
||
|
|
}
|
||
|
|
#footer.footer-dark .btn-default:hover {
|
||
|
|
background-color: rgba(189, 189, 189, 0.35);
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer.footer-dark .form-control {
|
||
|
|
background-color: #191919;
|
||
|
|
color: #CCC;
|
||
|
|
}
|
||
|
|
#footer.footer-dark .form-btn-inside button {
|
||
|
|
color: #CCC;
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer.footer-dark #footer-logo .logo-dark {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
#footer.footer-dark #footer-logo .logo-light {
|
||
|
|
display: inline-block;
|
||
|
|
}
|
||
|
|
@media (max-width: 767px) {
|
||
|
|
#footer.footer-dark #footer-logo .logo-light {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
#footer.footer-dark #footer-logo .logo-dark-m {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
#footer.footer-dark #footer-logo .logo-light-m {
|
||
|
|
display: inline-block;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer.footer-dark .footer-bottom {
|
||
|
|
background-color: #0a0a0a;
|
||
|
|
border-top-color: rgba(128, 128, 128, 0.08);
|
||
|
|
}
|