www_veda2/web/static/theme.css
2024-10-07 04:37:16 +03:00

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);
}