| Server IP : 172.24.0.40 / Your IP : 216.73.216.10 Web Server : Apache System : Linux dbweb26.ust.edu.ph 4.18.0-513.5.1.el8_9.x86_64 #1 SMP Fri Sep 29 05:21:10 EDT 2023 x86_64 User : apache ( 48) PHP Version : 8.2.18 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : OFF | Sudo : ON | Pkexec : ON Directory : /home/actamanilana.dbweb26.goldcopy/public_html/wp-content/themes/rife-free/ |
Upload File : |
/* Done with RTLCSS playground https://rtlcss.com/playground/ */
/* ==========================================================================
TABLE OF CONTENTS:
General styles
Preloader
Forms
Buttons
WordPress default styles
General layout
Header tools
Header menu general
Header menu horizontal
Header menu vertical
Logo
Header vertical
Header vertical variant right
Header horizontal general
Header horizontal variants
Top bar in header
Top closable message
Header search
Menu overlay
Footer
Footer unravel effect
Sidebar & widgets
Colors in dark sidebars
Title bar
Content layout variants
General content styles
Post meta
Posts navigation
Comments & about author
Add comment form
Attachment page
Posts list
Pagination
Works/Albums list
Category filter
Sidebar filter
Single albums
Works/Albums Navigation
Single work
Post lightbox
Flickity
A13 slider
A13 sticky one page
Things added to fullpage.js
Image carousel tweak
Typed js effect
Visual Composer - various things
Visual Composer extend
Counter shortcode
Visual Composer progress bar shortcode tweak
Visual Composer tab shortcode tweak
Post grid variants
Testimonial shortcode
Grid element for posts
Grid element for products
Grid element for works & albums
Side menu effects
Social icons
Some group Transitions
Post styles globals
Responsive design
========================================================================== */
/* ==========================================================================
General styles
========================================================================== */
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}
a{
color: #222;
text-decoration:none;
}
a:hover{
color: #222;
text-decoration: underline;
}
table{
border: 1px solid #ccc;
}
th, td{
text-align: right;
padding: 5px;
border-top: 1px solid #ccc;
}
/* =============================================================================
Preloader
========================================================================== */
#preloader{
direction: ltr;
position: fixed;
top:0;
right:0;
left:0;
bottom:0;
background-color:#fff;
z-index: 31999; /* makes sure it stays on top */
}
.no-js #preloader{
display: none;
}
.preload-content{
height: 80px;
width: 300px;
/*padding-top: 120px;*/
position:absolute;
right:50%;
top:50%;
margin: -40px -150px 0 0;
text-align: center;
}
.preloader-animation{
height: 120px;
width: 100%;
}
a.skip-preloader,
a.skip-preloader:hover{
display: none;
color: #fff;
text-shadow: 0 -2px 1px #000;
font-size: 24px;
transition: text-shadow .3s;
}
a.skip-preloader:hover{
text-shadow: 0 2px 1px #000;
}
/* =============================================================================
Forms
========================================================================== */
/*
* Remove default fieldset styles.
*/
fieldset {
border: 0;
margin: 0;
padding: 0;
}
select{
border: 1px solid #d4d4d4;
color: #5b5b5b;
padding: 9px 15px 7px;
height: 40px;
width: 100%;
max-width: 450px;
box-sizing: border-box;
}
input[type="text"],
input[type="password"],
input[type="search"],
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="number"],
input[type="range"],
input[type="date"],
textarea{
border: 1px solid transparent;
background-color: #f5f5f5;
color: #5b5b5b;
font-size: 12px;
padding: 9px 15px 7px;
height: 40px;
width: 100%;
max-width: 450px;
box-sizing: border-box;
-webkit-border-radius: 0;
border-radius: 0;
}
textarea{
display: block;
height: 136px;
width: 100%;
resize: vertical; /* Allow only vertical resizing of textareas. */
}
/* FOCUS COLORS */
input[type="text"]:hover,
input[type="password"]:hover,
input[type="search"]:hover,
input[type="email"]:hover,
input[type="url"]:hover,
input[type="tel"]:hover,
input[type="number"]:hover,
input[type="range"]:hover,
input[type="date"]:hover,
textarea:hover,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
textarea:focus{
border-color: #d4d4d4;
outline: none;
}
input.cptch_number{
text-align: center;
}
.error input,
.error textarea{
border-color: #ea4f3b;
}
/* captcha plugin */
input[name=cptch_number]{
width: 40px !important;
}
/* contact form 7 full width inputs */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="password"],
.wpcf7-form input[type="search"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="url"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="number"],
.wpcf7-form input[type="range"],
.wpcf7-form input[type="date"],
.wpcf7-form select,
.wpcf7-form textarea{
max-width: none;
}
/* wpForms full width inputs */
.wpforms-form input[type="text"],
.wpforms-form input[type="password"],
.wpforms-form input[type="search"],
.wpforms-form input[type="email"],
.wpforms-form input[type="url"],
.wpforms-form input[type="tel"],
.wpforms-form input[type="number"],
.wpforms-form input[type="range"],
.wpforms-form input[type="date"],
.wpforms-form select,
.wpforms-form textarea{
max-width: none;
}
/* =============================================================================
Buttons
========================================================================== */
input[type="submit"],
button[type="submit"]{
background: #4E82F1 none;
display: inline-block;
border: none;
box-shadow: none;
cursor: pointer;
color: #fff;
font-size: 11px;
font-weight: bold;
text-align: center;
text-transform: uppercase;
text-shadow: none;
line-height: 42px;
white-space: nowrap;
height: 40px;
padding: 0 30px;
-webkit-border-radius: 20px;
border-radius: 20px;
}
input[type="submit"]:hover,
input[type="submit"]:focus,
button[type="submit"]:hover,
button[type="submit"]:focus{
background: #4E6BD6 none;
color: #fff;
}
/* =============================================================================
WordPress default styles
========================================================================== */
.alignnone {
clear: both;
margin: 5px 0 20px 20px;
}
.aligncenter,
div.aligncenter {
clear: both;
display: block;
margin: 5px auto;
}
.alignright{
float:right;
margin: 5px 20px 20px 0;
}
.alignleft{
float: left;
margin: 5px 0 20px 20px;
}
.wp-caption {
background-color: #fff;
max-width: 100%; /* Image does not overflow the content area */
text-align: center;
box-sizing: border-box;
}
.wp-caption-text {
line-height: 1.7;
font-size: .85em;
color: #999;
padding: 0.5em 0;
}
/* gallery */
.gallery-item{
display: inline-block;
text-align: right;
vertical-align: top;
margin: 0 0 1.5em;
width: 50%;
}
.gallery-item a{
display: inline-block;
max-width: 100%;
}
.gallery-item img {
display: block;
border: 2px solid #cfcfcf;
opacity: 1;
box-sizing: border-box;
transition: opacity .5s;
}
.gallery-item a:hover img,
.gallery-item a:focus img {
opacity: .6;
}
.gallery-caption{
text-align: right;
}
.gallery-columns-1 .gallery-caption{
text-align: center;
}
/* gallery columns */
.gallery-columns-1 .gallery-item {
width: 100%;
}
.gallery-columns-2 .gallery-item {
max-width: 50%;
}
.gallery-columns-3 .gallery-item {
max-width: 33.33%;
}
.gallery-columns-4 .gallery-item {
max-width: 25%;
}
.gallery-columns-5 .gallery-item {
max-width: 20%;
}
.gallery-columns-6 .gallery-item {
max-width: 16.66%;
}
.gallery-columns-7 .gallery-item {
max-width: 14.28%;
}
.gallery-columns-8 .gallery-item {
max-width: 12.5%;
}
.gallery-columns-9 .gallery-item {
max-width: 11.11%;
}
blockquote{
margin: 1em 0 1em 0;
padding-right: 40px;
position: relative;
}
blockquote::before{
content: "\201C";
display: block;
color: #7a7a7a;
font-family: Georgia, serif;
font-size: 60px;
line-height: 1;
position: absolute;
right: 0;
top: -8px;
}
blockquote cite {
color: #999999;
font-size: 16px;
display: block;
margin-top: 5px;
}
blockquote cite::before{
content: "\2014 \2009";
}
hr{
border: none;
border-bottom: 1px solid #dfdfdf;
margin: .5em 0;
}
.sticky { /*Empty*/ }
/* ==========================================================================
General layout
========================================================================== */
html.show-scroll{
overflow-y: scroll;
}
html.show-scroll body{
overflow-y: auto;
}
html.post-lightbox-active body{
overflow-y: hidden;
}
body{
height: 100%;
background-color: #444;/* dark background looks better then white when side menu is moving */
color: #7f7f7f;
overflow-x: hidden;
}
.page-background{
overflow: hidden;
position: fixed;
top: 0;
right: 0;
left: 0;
bottom: 0;
z-index: 1;
-webkit-transform: translate3d(0px, 0, 0);/* fix for scroll jiggling */
transform: translate3d(0px, 0, 0);/* fix for scroll jiggling */
}
#mid{
overflow-x: hidden; /* Revo Slider fancy effects extending */
overflow-y: hidden; /* Revo Slider fancy effects extending */
position: relative;
z-index: 2; /* above background */ /* padding is for full screen, rest for "to-move" class */
transition: transform .5s;
}
#header,
#header.a13-light-variant,
#header.a13-dark-variant{
box-shadow: 0 0 12px rgba(0, 0, 0, 0.09);
background-color: #fff;
}
.mobile-menu-open.header-vertical #header,
.mobile-menu-open.header-horizontal #header{
z-index: 21;
}
#footer{
position: relative;
z-index: 10;
}
.default404 .page-background,
.password-protected .page-background{
background-size: cover;
background-color: #000;
}
/* elements printed AFTER FOOTER(positioned absolute) and plugins styles */
#content-overlay{
position: fixed;
top: 0;
right: 0;
width: 0;
height: 0;
background: rgba(0,0,0,0.5);
opacity: 0;
z-index: 20;
transition: opacity .5s, transform .5s, width .1s .5s, height .1s .5s;
}
.mobile-menu-open #content-overlay,
.side-menu-open #content-overlay{
width: 100%;
height: 100%;
opacity: 1;
transition: opacity .5s, transform .5s;
}
#basket-menu{
position: absolute;
top: 0;
z-index: 19; /* above header, footer, content */
width: 240px;
padding: 40px;
display: none;
background: #fff;
box-shadow: 0 0 12px rgba(0, 0, 0, 0.09);
transform: translateY(-50px);
opacity: 0;
visibility: hidden;
transition: opacity .5s, visibility 0s .5s, transform .5s;
}
#basket-menu.show{
transform: translateY(0);
opacity: 1;
visibility: visible;
transition: opacity .5s, transform .5s;
}
@media only screen and (min-width: 1025px) {
.header-vertical #basket-menu{
transform: translateX(100%);
}
.header-side-right #basket-menu{
transform: translateX(-100%);
}
.header-vertical #basket-menu.show{
transform: translateX(0);
}
}
#side-menu{
position: fixed;
top: 0;
bottom: 0;
left: 0;
z-index: 30; /* above header, footer, content, overlay */
width: 320px;
background-color: #000;
height: 100%;
overflow: auto;
overscroll-behavior: contain;
}
.admin-bar #side-menu{
top: 32px;
height: calc(100% - 32px);
}
#side-menu.at-right{
left: auto;
right: 0;
}
#side-menu div.scroll-wrap{
padding: 40px;
}
body.side-menu-open #mid{
overflow-x: hidden;/* #col-mask was affecting opened sidebar if it was one of those that appear from "under" page(z-index: 0) */
}
/* layout bordered */
.theme-borders{
display: none;
}
.site-layout-bordered .theme-borders{
display: block;
}
.theme-borders div{
position: fixed;
z-index: 1003; /* below lightbox but above most elements */
}
.theme-borders .top-border{
top: 0;
right: 0;
width: 100%;
height: 30px;
}
.admin-bar .theme-borders .top-border{
top: 32px;
}
.theme-borders .right-border{
top: 0;
right: 0;
height: 100%;
width: 30px;
}
.theme-borders .bottom-border{
bottom: 0;
right: 0;
width: 100%;
height: 30px;
}
.theme-borders .left-border{
top: 0;
left: 0;
height: 100%;
width: 30px;
}
.no-border-top .theme-borders .top-border,
.no-border-right .theme-borders .right-border,
.no-border-bottom .theme-borders .bottom-border,
.no-border-left .theme-borders .left-border{
display: none;
height: auto; /* so JavaScript will not return dumb results */
width: auto;
}
.theme-borders .right-border{
top: 0;
right: 0;
height: 100%;
width: 30px;
}
.theme-borders .bottom-border{
bottom: 0;
right: 0;
width: 100%;
height: 30px;
}
.theme-borders .left-border{
top: 0;
left: 0;
height: 100%;
width: 30px;
}
.site-layout-bordered .whole-layout{
padding: 30px;
box-sizing: border-box; /* mainly for slider in album */
}
.no-border-top .whole-layout{ padding-top: 0; }
.no-border-right .whole-layout{padding-right: 0; }
.no-border-bottom .whole-layout{ padding-bottom: 0; }
.no-border-left .whole-layout{padding-left: 0; }
.site-layout-bordered #side-menu{
margin-left: 30px;
margin-top: 30px;
margin-bottom: 30px;
height: calc(100% - 60px);
}
.admin-bar.site-layout-bordered #side-menu{
height: calc(100% - 92px);
}
.site-layout-bordered.no-border-top #side-menu{
margin-top: 0;
height: calc(100% - 30px);
}
.site-layout-bordered.no-border-bottom #side-menu{
margin-bottom: 0;
height: calc(100% - 30px);
}
.admin-bar.site-layout-bordered.no-border-top #side-menu,
.admin-bar.site-layout-bordered.no-border-bottom #side-menu{
height: calc(100% - 62px);
}
.admin-bar.site-layout-bordered.no-border-top.no-border-bottom #side-menu{
height: calc(100% - 32px);
}
.site-layout-bordered.no-border-left #side-menu{
margin-left: 0;
}
.site-layout-bordered #side-menu.at-right{
margin-left: 0;
margin-right: 30px;
}
.site-layout-bordered.no-border-right #side-menu.at-right{
margin-right: 0;
}
/* layout boxed */
.site-layout-boxed .whole-layout{
max-width: 1240px;
margin: 0 auto;
}
/* when admin bar */
.admin-bar .whole-layout{
margin-top: 32px;
}
/* cursors */
.cursor-grab{
cursor: -webkit-grab;
cursor: grab;
}
.cursor-grabbing{
cursor: move;/* fallback */
cursor: -webkit-grabbing;
cursor: grabbing;
}
/* to top */
a.to-top{
background-color: #524F51;
outline: none !important;
width: 40px;
height: 40px;
position: fixed;
bottom: 100px;
left: 40px;
z-index: 1000;
-webkit-border-radius: 20px;
border-radius: 20px;
color: #ccc;
text-align: center;
line-height: 38px;
font-size: 13px;
opacity: 0;
visibility: hidden;
transition: background-color 0.3s, color 0.3s, opacity 0.5s, visibility 0s 0.5s;
}
a.to-top.show{
opacity: 1;
visibility: visible;
transition: background-color 0.3s, color 0.3s, opacity 0.5s;
}
a.to-top::after {
content: '';
position: absolute;
top: -20px;
right: -20px;
bottom: -20px;
left: -20px;
background: inherit;
-webkit-border-radius: 40px;
border-radius: 40px;
z-index: -1;
opacity: 0.4;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
a.to-top:hover {
transition: background-color 0.1s 0.3s, color 0.1s 0.3s, opacity 0.5s, visibility 0s 0.5s;
color: #fff;
text-decoration: none;
background-color: #000;
-webkit-animation: anim-moema-1 0.3s forwards;
animation: anim-moema-1 0.3s forwards;
}
a.to-top:hover::after {
-webkit-animation: anim-moema-2 0.3s 0.3s forwards;
animation: anim-moema-2 0.3s 0.3s forwards;
}
.lt-ie10 a.to-top::after{
display: none;
}
@-webkit-keyframes anim-moema-1 {
60% {
-webkit-transform: scale3d(0.8, 0.8, 1);
transform: scale3d(0.8, 0.8, 1);
}
85% {
-webkit-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes anim-moema-1 {
60% {
-webkit-transform: scale3d(0.8, 0.8, 1);
transform: scale3d(0.8, 0.8, 1);
}
85% {
-webkit-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@-webkit-keyframes anim-moema-2 {
to {
opacity: 0;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes anim-moema-2 {
to {
opacity: 0;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
/* PLUGINS */
#qm{ /* Query monitor visibility in this kind of layout */
z-index: 101;
position: relative;
}
/* Elementor editing */
html.elementor-html #mid:hover{
z-index: 20;
}
#masthead,
.container-elementor-header{
position: relative;
z-index: 11;
}
#colophon,
.container-elementor-footer{
position: relative;
z-index: 10;
}
/* Elementor 3.x fix */
.elementor-element.elementor-products-grid ul.products .grid-master {
display: none;
}
/* lightGallery ligthbox */
.lg-sub-html{
background-color: transparent;
}
.lg-sub-html .customHtml h4,
.lg-sub-html .customHtml .description{
background-color: rgba(0,0,0,0.78);
display: block;
max-width: 300px;
margin: 0 auto;
padding: 10px;
border-radius: 3px;
}
.lg-sub-html .customHtml .description{
max-width: 500px;
}
.lg-sub-html .customHtml h4:empty,
.lg-sub-html .customHtml .description:empty{
display: none;
}
.customHtml > h4{
color: #fff;
}
.customHtml{
height: auto;
}
div.vc-mg-item-desc{
display: none;
}
/* center too small thumbs */
.lg-outer .lg-thumb-item img {
position: relative;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
top: 50%;
height: auto;
}
/* admin bar interferes when lightbox is open */
.lg-backdrop{
z-index: 100000!important;
}
.lg-outer{
direction: ltr;/* rtl support */
z-index: 100010!important;;
}
/* ==========================================================================
Header tools
========================================================================== */
#header-tools{
min-height: 26px;
color: #444;
}
#header-tools.only-menu{
/* we don't want to touch display property, but still hide it */
clip: rect(1px, 1px, 1px, 1px);
position: absolute;
top: 0;
right: 0;
visibility: hidden;
height: 1px;
overflow: hidden;
opacity: 0;
}
#header-tools .tool{
display: inline-block;
vertical-align: middle;
color: #e5e5e5;
text-align: center;
font-size: 16px;
line-height: 26px;
cursor: pointer;
transition: background-color .3s, color .3s;
}
#header-tools .tool a{
transition: color .3s;
}
#header-tools button{
height: 26px;
width: 36px;
background-color: transparent;
border: none;
padding: 0 5px;
}
/* FireFox 63 loses focus styles on button, when button styles are changed */
#header-tools button:-moz-focusring{
outline: 1px dotted;
}
#header-tools .tool:hover,
#header-tools .tool.highlight,
#header-tools .tool.active{
color: #4d4d4d;
}
#header-tools .tool::before{
display: block;
}
#header-tools #mobile-menu-opener{
font-size: 18px;
display: none;
}
/* basket counter */
#basket-menu-switch{
position: relative;
}
#basket-items-count{
position: absolute;
top: -5px;
right: 18px;
min-width: 15px;
line-height: 15px;
font-size: 9px;
font-weight: bold;
text-align: center;
color: #fff;
font-family: 'Open Sans', arial, sans-serif;
background-color: #F64747;
-webkit-border-radius: 2px;
border-radius: 2px;
}
#basket-items-count.zero{
display: none;
}
/* language switcher */
#header-tools .language-switcher{
position: relative;
}
#header-tools .languages{
display: none;
position: absolute;
z-index: 10;
top: 100%;
right: 0;
list-style-type: none;
min-width: 26px;
padding: 0 5px;
margin: 0;
text-transform: uppercase;
outline: 1px solid;
background-color: #fff;
transition: background-color 0.3s;
}
#header-tools .open .languages{
display: block;
}
#header-tools .language-switcher button{
min-width: 36px;
width: auto;
text-transform: uppercase;
}
#header-tools .language-switcher.codes img{
margin-left: 5px;
}
/* button */
.tools_button{
display: inline-block;
height: 27px;
line-height: 27px;
text-transform: uppercase;
text-align: center;
font-size: 12px;
font-weight: bold;
padding: 0 10px;
margin-right: 10px;
border: 1px solid #E5E5E5;
-webkit-border-radius: 3px;
border-radius: 3px;
transition: all .3s;
box-sizing: border-box;
}
.tools_button:hover{
text-decoration: none;
}
/* animated icons */
#header-tools .tool.hamburger{
position: relative;
margin: 0 5px;
}
.hamburger i{
display: block;
position: absolute;
top: 50%;
right: 5px;
left: 5px;
height: 2px;
width: calc(100% - 10px);
background-color: #000;
transition: background-color 0.3s;
}
.hamburger i::before,
.hamburger i::after{
position: absolute;
display: block;
right: 0;
width: 100%;
height: 2px;
background-color: #000;
content: "";
transition: background-color 0.3s;
}
.hamburger i::before{
top: -6px;
}
.hamburger i::after{
bottom: -6px;
}
/* transform to X effect */
.hamburger--efx i::before,
.hamburger--efx i::after{
transition-duration: 0.3s;
transition-delay: 0.3s, 0s, 0s;
}
.hamburger--efx i::before{
transition-property: top, background-color, transform;
}
.hamburger--efx i::after{
transition-property: bottom, background-color, transform;
}
/* active state */
.hamburger--efx.active i{
background-color: transparent !important;
}
.hamburger--efx.active i::before{
top: 0;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.hamburger--efx.active i::after{
bottom: 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.hamburger--efx.active i::before,
.hamburger--efx.active i::after{
transition-delay: 0s, 0.3s, 0.3s;
}
/* transform to X2 effect */
.hamburger--efx2 i::before,
.hamburger--efx2 i::after{
transition-duration: .3s;
transition-delay: .3s, 0s, 0s;
}
.hamburger--efx2 i::before{
transition-property: top, background-color, transform;
}
.hamburger--efx2 i::after{
transition-property: bottom, background-color, transform;
}
/* active state */
.hamburger--efx2 i{
background-color: transparent !important;
}
.hamburger--efx2.active i::before{
-webkit-transform: rotateZ(135deg) scaleX(1.1) translate(4px, -4px);
-ms-transform: rotateZ(135deg) scaleX(1.1) translate(4px, -4px);
transform: rotateZ(135deg) scaleX(1.1) translate(4px, -4px);
}
.hamburger--efx2.active i::after{
-webkit-transform: rotateZ(-135deg) scaleX(1.1) translate(4px, 4px);
-ms-transform: rotateZ(-135deg) scaleX(1.1) translate(4px, 4px);
transform: rotateZ(-135deg) scaleX(1.1) translate(4px, 4px);
}
/* transform to X3 effect */
.hamburger--efx3 i::before,
.hamburger--efx3 i::after{
transition-duration: .3s;
transition-delay: .3s, 0s, 0s;
}
.hamburger--efx3 i::before,
.hamburger--efx3 i::after{
transition-property: background-color, transform;
}
/* active state */
.hamburger--efx3 i{
background-color: transparent !important;
}
.hamburger--efx3.active i::before{
-webkit-transform: rotateZ(45deg) scaleX(1.1) translate(4px, 3px);
-ms-transform: rotateZ(45deg) scaleX(1.1) translate(4px, 3px);
transform: rotateZ(45deg) scaleX(1.1) translate(4px, 3px);
}
.hamburger--efx3.active i::after{
-webkit-transform: rotateZ(-45deg) scaleX(1.1) translate(5px, -4px);
-ms-transform: rotateZ(-45deg) scaleX(1.1) translate(5px, -4px);
transform: rotateZ(-45deg) scaleX(1.1) translate(5px, -4px);
}
/* transform to Slider effect */
.hamburger--efslider i{
top: 7px;
transition-timing-function: ease;
transition-duration: .3s;
transition-property: transform, background-color;
}
.hamburger--efslider i::before{
top: 12px;
}
.hamburger--efslider i::after{
bottom: -6px;
transform-origin: 100% 100%;
}
.hamburger--efslider i::before,
.hamburger--efslider i::after{
transition-duration: .3s;
transition-property: background-color, transform, width, height;
}
/* active state */
.hamburger--efslider.active i{
-webkit-transform: rotateZ(-45deg) translate(-4px, 4px);
-ms-transform: rotateZ(-45deg) translate(-4px, 4px);
transform: rotateZ(-45deg) translate(-4px, 4px);
}
.hamburger--efslider.active i::before{
-webkit-transform: rotateZ(90deg) scaleX(1.05) translate(-11px, 0);
-ms-transform: rotateZ(90deg) scaleX(1.05) translate(-11px, 0);
transform: rotateZ(90deg) scaleX(1.05) translate(-11px, 0);
}
.hamburger--efslider.active i::after{
-webkit-transform: rotateZ(45deg) translate(-60px, -7px);
-ms-transform: rotateZ(45deg) translate(-60px, -7px);
transform: rotateZ(45deg) translate(-60px, 3px);
background-color: transparent !important;
width: 0;
height: 0;
}
/* transform to <-- effect */
.hamburger--efla i{
transition: background-color 0.3s, transform 0.3s;
}
.hamburger--efla i::before{
right: auto;
left: 0;
-webkit-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
transition: background-color 0.3s, transform 0.3s, width 0.3s, top 0.3s;
}
.hamburger--efla i::after{
right: auto;
left: 0;
-webkit-transform-origin: bottom left;
-ms-transform-origin: bottom left;
transform-origin: bottom left;
transition: background-color 0.3s, transform 0.3s, width 0.3s, bottom 0.3s;
}
/* active state, i.e. menu open */
.hamburger--efla.active i{
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.hamburger--efla.active i::before,
.hamburger--efla.active i::after{
width: 32%;
}
.hamburger--efla.active i::before{
top: 0;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.hamburger--efla.active i::after{
bottom: 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
/* transform to --> effect */
.hamburger--efra i{
transition: background-color 0.3s, transform 0.3s;
}
.hamburger--efra i::before{
-webkit-transform-origin: bottom right;
-ms-transform-origin: bottom right;
transform-origin: bottom right;
transition: background-color 0.3s, transform 0.3s, width 0.3s, top 0.3s;
}
.hamburger--efra i::after{
-webkit-transform-origin: top right;
-ms-transform-origin: top right;
transform-origin: top right;
transition: background-color 0.3s, transform 0.3s, width 0.3s, bottom 0.3s;
}
/* active state, i.e. menu open */
.hamburger--efra.active i{
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.hamburger--efra.active i::before,
.hamburger--efra.active i::after{
width: 32%;
}
.hamburger--efra.active i::before{
top: 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.hamburger--efra.active i::after{
bottom: 0;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
/* ==========================================================================
Header menu general
========================================================================== */
.top-menu, .top-menu ul{
list-style: none;
margin: 0;
padding: 0;
}
.top-menu li {
position: relative;
min-height: 22px; /* place for sub-mark */
font-size: 14px;
}
.top-menu li a,
.top-menu li span.title{ /* span.title only to gain color and block */
color: #000;
display: block;
text-decoration: none;
}
.top-menu > li > a,
.top-menu > li > span.title{
position: relative;
transition: background-color .5s, color .5s, line-height .5s, height .5s;
}
/* hover and active */
.top-menu a:hover,
.top-menu li.menu-parent-item:hover > span.title,
.top-menu li.open > a,
.top-menu li.open > span.title,
.top-menu li.current-menu-item > a,
.top-menu li.current-menu-ancestor > a,
.top-menu li.current-menu-item > span.title,
.top-menu li.current-menu-ancestor > span.title{
color: #444;
}
.top-menu li a i { /* icon */
width: 15px;
text-align: center;
}
/* margin for icon */
.top-menu span i + span, .top-menu a i + span{
margin-right: 8px;
}
.top-menu span span i, .top-menu a span i{
margin-left: 8px;
}
/* sub menu mark */
.top-menu i.sub-mark{
height: 26px;
width: 26px;
display: inline-block;
position: absolute;
top: 0;
cursor: pointer;
color: #666;
}
.top-menu i.sub-mark::before{
line-height: 16px;
height: 16px;
width: 100%;
display: block;
text-align: center;
font-size: 14px;
position: absolute;
left: 0;
top: 50%;
margin-top: -8px;
}
.top-menu.opener-icons-off i.sub-mark{
display: none;
}
.top-menu li.menu-parent-item:hover > span.title + i.sub-mark,
.top-menu i.sub-mark:hover,
.top-menu li.open > i.sub-mark{
color: #fff;
}
/* not linkable sub parent */
.top-menu li.menu-parent-item > span.title{
cursor: pointer;
}
/* when effect for menu is added */
.top-menu.with-effect a em,
.top-menu.with-effect span.title em{
font-style: normal;
}
/* next levels */
.top-menu ul{
display: none;
padding: 30px 0;
}
.top-menu li li{
font-size: 12px;
}
/* keep submenu open */
.top-menu .current-menu-ancestor.to-open > ul{
display: block;
}
/* menu item with rollover icon */
.top-menu > li.hidden-icon > span.title,
.top-menu > li.hidden-icon > a{
overflow: hidden;
height: 30px; /* needed for hidden icons to behave proper */
}
.top-menu > li.hidden-icon > span.title i,
.top-menu > li.hidden-icon > a i{
position: absolute;
top: -50%;
right: 50%;
transform: translate(50%, -50%);
transition: top .3s;
}
.top-menu > li.hidden-icon > span.title span,
.top-menu > li.hidden-icon > a span{
position: relative;
top: 0;
transition: top .3s;
}
.top-menu li.hidden-icon > span i + span,
.top-menu li.hidden-icon > a i + span {
margin-right: 0;
}
.top-menu li.hidden-icon:hover > a i,
.top-menu li.hidden-icon.menu-parent-item:hover > span.title i,
.top-menu li.hidden-icon.open > a i,
.top-menu li.hidden-icon.open > span.title i,
.top-menu li.hidden-icon.current-menu-item > a i,
.top-menu li.hidden-icon.current-menu-ancestor > a i,
.top-menu li.hidden-icon.current-menu-item > span.title i,
.top-menu li.hidden-icon.current-menu-ancestor > span.title i{
top: 50%;
}
.top-menu li.hidden-icon:hover > a span,
.top-menu li.hidden-icon.menu-parent-item:hover > span.title span,
.top-menu li.hidden-icon.open > a span,
.top-menu li.hidden-icon.open > span.title span,
.top-menu li.hidden-icon.current-menu-item > a span,
.top-menu li.hidden-icon.current-menu-ancestor > a span,
.top-menu li.hidden-icon.current-menu-item > span.title span,
.top-menu li.hidden-icon.current-menu-ancestor > span.title span{
top: 200%;
}
/********/
/* END OF TOP MENU */
/* WPML FLAGS IN MENU */
.menu-item-language img.iclflag {
margin-left: 7px;
margin-bottom: -1px;
}
/********/
/* MEGA MENU STYLE */
.mega-menu > ul{
position: absolute;
z-index: 250;
min-width: 200px;
width: 840px;
padding: 0;
}
.mega-menu.mm_columns_3 > ul{
width: 630px;
}
.mega-menu.mm_columns_2 > ul{
width: 420px;
}
.mega-menu > ul > li{
background-color: transparent !important;
float: right;
width: 25%;
box-sizing: border-box;
}
.mega-menu > ul > li::before{
content: "";
width: 1px;
background-color: #fff;
display: block;
position: absolute;
top: 30px;
bottom: 30px;
}
.mega-menu > ul > li:first-child::before{
display: none;
}
.top-menu li.mega-menu > ul > li{ /* stronger selector */
padding-left: 0;
}
.mm_columns_2 > ul > li{ width: 50%; }
.mm_columns_3 > ul > li{ width: 33.33%; }
.mega-menu > ul > li.mm_new_row{
clear: right;
}
.mega-menu > ul ul{
position: static;
display: block!important;
margin: 0;
box-shadow: none;
min-width: 0;
padding-top: 0;
}
.top-menu .mega-menu > ul > li > span.title,
.top-menu .mega-menu > ul > li > a{
font-size: 14px;
font-weight: bold;
margin: 30px 0 10px;
}
.top-menu .mega-menu > ul > li > span.title{
cursor: default;
}
.top-menu .mega-menu > ul > li > span.title,
.top-menu .mega-menu ul li > a{ /* both group titles and links in submenu of megamenu*/
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.top-menu .mm_dont_show > span.title,
.top-menu .mm_dont_show > a,
.top-menu .mega-menu > ul > li > span.title .sub-mark,
.top-menu .mega-menu > ul > li > .sub-mark{
display: none;
}
/* HTML ITEM */
.mega-menu .html_item{
padding: 0;
}
.mega-menu > ul .html_item ul{
display: none !important;
}
.top-menu .mega-menu > ul > li.html_item > a{
padding: 0;
}
/********/
/* END OF MEGA MENU STYLE */
/* ==========================================================================
Header menu horizontal
========================================================================== */
.header-horizontal .navigation-bar{
width: 100%;
padding: 0 15px;
position: relative; /* so submenus can be positioned properly */
}
.header-horizontal .top-menu{
text-align: left;
font-size: 0;/* no space between items */
}
.header-horizontal .top-menu li {
white-space: nowrap;
}
/* sub menu mark */
.header-horizontal .top-menu i.sub-mark{
left: 0;
height: 100%;
}
/* First level */
.header-horizontal .top-menu > li{
float: none;
display: inline-block;
vertical-align: bottom;
text-align: right;
}
.header-horizontal .top-menu > li > a,
.header-horizontal .top-menu > li > span.title{
padding: 0 10px; /* spacing in most top level */
}
.header-horizontal .top-menu.opener-icons-on li.menu-parent-item{
padding-left: 26px; /* menu opener */
}
.header-horizontal .top-menu.opener-icons-on > li.menu-parent-item > a,
.header-horizontal .top-menu.opener-icons-on > li.menu-parent-item > span.title{
padding-left: 4px;
}
/* next levels */
.header-horizontal .top-menu ul{
position: absolute;
top: 100%;
right: 0;
z-index: 250;
min-width: 200px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.07);
}
.header-horizontal .desktop_menu .top-menu ul{
visibility: hidden;
opacity: 0;
transform: translateY(-50px);
transition: opacity 0.5s, visibility 0s 0.5s, transform 0.5s;
}
.header-horizontal .desktop_menu .top-menu ul.measure{
visibility: hidden;
opacity: 0;
transition: none;
display: block;
}
.header-horizontal .desktop_menu .menu-parent-item.open > ul{
visibility: visible;
opacity: 1;
transform: translateY(0);
transition: opacity 0.5s, transform 0.5s;
}
.header-horizontal .desktop_menu .mega-menu > ul ul{
visibility: visible;
opacity: 1;
transform: none;
}
.header-horizontal .top-menu ul ul{
top: -30px;
right: 100%;
border-top: none;
margin-top: 0;
}
.header-horizontal .mega-menu > ul ul{
position: static;
box-shadow: none;
}
.header-horizontal .top-menu li li{
padding: 0; /* reset side padding */
}
.header-horizontal .top-menu.opener-icons-on li li.menu-parent-item{
padding-left: 51px; /* 25px of link side padding + 26px for arrow */
}
.header-horizontal .top-menu li li a,
.header-horizontal .top-menu li li span.title{ /* span.title only to gain color and block */
line-height: 25px;
padding: 0 30px;
}
.header-horizontal .top-menu ul i.sub-mark{
left: 25px;
}
/* submenu opened other way */
.header-horizontal .top-menu ul.otherway{
right: auto;
left: 0;
}
.header-horizontal .top-menu ul ul.otherway{
right: auto;
left: 100%;
}
/* ==========================================================================
Header menu vertical
========================================================================== */
.header-vertical .top-menu ul{
padding: 10px 0;
}
.header-vertical .top-menu li a,
.header-vertical .top-menu li span.title{
min-height: 27px;
line-height: 27px;
padding: 0 40px;
}
.header-vertical .top-menu > li.hidden-icon > a,
.header-vertical .top-menu > li.hidden-icon > span.title{
height: 1.5em; /* so we have height that we can relate to in effects */
}
.header-vertical .top-menu.with-effect > li > a > span,
.header-vertical .top-menu.with-effect > li > span.title > span{
display: inline-block;
}
/* sub menu mark */
.header-vertical .top-menu i.sub-mark{
left: 14px;
}
/* next levels */
.header-vertical .top-menu li li a,
.header-vertical .top-menu li li span.title{ /* span.title only to gain color and block */
min-height: 17px;
line-height: 17px;
}
.header-vertical .top-menu li li i.sub-mark{
height: 17px;
line-height: 17px;
}
.header-vertical .top-menu li li li a,
.header-vertical .top-menu li li li span.title{ /* span.title only to gain color and block */
padding-right: 50px;
}
/********/
/* MEGA MENU STYLE */
.header-vertical .mega-menu > ul{
right: 100%;
top: 0;
}
.header-vertical .top-menu .mega-menu li a,
.header-vertical .top-menu .mega-menu li span.title{
padding: 0 30px;
line-height: 25px;
}
.header-vertical .mega-menu > ul ul{
padding: 0 0 30px;
}
/* ==========================================================================
Logo
========================================================================== */
a.logo{
display: block;
max-width: 200px;
word-wrap: break-word;
white-space: nowrap;
padding: 10px 0;
opacity: 1;
vertical-align: middle;
background: transparent 50% 50% no-repeat;
background-size: contain;
background-origin: content-box;
transition: max-width .5s, padding .5s, color .5s, opacity .5s;
}
a.logo img{
opacity: 0;/* we have image so its display when no styles are applied */
width: 100%;
height: auto;
display: block;
}
a.logo.text-logo{
/* reset user.css styles */
background-image: none;
height: auto;
line-height: 40px; /* min height of header part */
}
a.logo.image-logo{
/* reset user.css styles */
font-size: 0;
}
/* SVG logos */
.svg-logo .scaling-svg{
display: block;
width: 100%;
height: 0;
padding: 0;
position: relative;
}
.svg-logo svg{
position: absolute;
top: 0;
right: 0;
max-width: 100%;
width: 100%;
}
a.logo.svg-logo{
background: none!important;
}
a.hidden-logo{
clip: rect(1px, 1px, 1px, 1px);
height: 1px;
overflow: hidden;
position: absolute !important;
width: 1px;
opacity: 0;
}
/* ==========================================================================
Header vertical
========================================================================== */
.header-vertical #header{
position: absolute;
top: 0;
right: 0;
width: 280px;
min-height: 100%;
color: #000;
z-index: 9;/* below footer */ /* bg-color is for hover, rest for "to-move" class */
transition: transform .5s, background-color .5s;
}
.header-vertical.site-layout-bordered #header{
margin-top: 30px;
margin-left: 30px;
margin-bottom: 30px;
}
.header-vertical.site-layout-bordered.no-border-left #header{margin-left: 0; }
.header-vertical.site-layout-bordered.no-border-top #header{ margin-top: 0; }
.header-vertical.site-layout-bordered.no-border-bottom #header{ margin-bottom: 0; }
.header-vertical #header.stick_to_bottom,
.admin-bar.header-vertical #header.stick_to_bottom{
position: fixed;
bottom: 0;
top: auto;
}
.header-vertical #header.stick_to_top{
position: fixed;
bottom: auto;
top: 0;
}
.admin-bar.header-vertical #header{
top: 32px;
}
.header-vertical.site-layout-bordered.no-border-bottom.no-border-top #header{
min-height: 100%;
}
.header-vertical.site-layout-bordered.no-border-top #header,
.header-vertical.site-layout-bordered.no-border-bottom #header{
min-height: calc(100% - 30px);
}
.header-vertical.site-layout-bordered #header{
min-height: calc(100% - 60px);
}
.admin-bar.header-vertical #header,
.admin-bar.header-vertical.site-layout-bordered.no-border-bottom.no-border-top #header{
min-height: calc(100% - 32px);
}
.admin-bar.header-vertical.site-layout-bordered.no-border-top #header,
.admin-bar.header-vertical.site-layout-bordered.no-border-bottom #header{
min-height: calc(100% - 62px);
}
.admin-bar.header-vertical.site-layout-bordered #header{
min-height: calc(100% - 92px);
}
.header-vertical .logo-container .logo{
display: inline-block;
}
.header-vertical .logo-container .logo.svg-logo{
width: 200px;
}
.header-vertical #header-tools{
padding: 0 30px 0 40px;
margin-top: 20px;
}
.header-vertical #mid{
padding: 0 280px 0 0;
}
.header-vertical #header.scrollable-menu{
position: absolute;
}
.header-vertical .navigation-bar{
position: relative;
}
.header-vertical .logo-container{
padding: 0 40px;
}
.header-widgets{
padding: 0 40px;
}
.header-vertical #header.centered,
#header.centered .widget h3.title{
text-align: center;
}
/* vertical mid */
.header-vertical .variant-content_in_mid .navigation-bar{
display: table;
width: 100%;
}
.variant-content_in_mid div.menu-container{
display: table-cell;
vertical-align: middle;
}
/* ==========================================================================
Header vertical variant right
========================================================================== */
/* GENERAL LAYOUT */
.header-side-right.header-vertical #header{
left: auto;
right: 0;
}
.header-side-right.header-vertical.site-layout-bordered #header{
margin-left: 0;
margin-right: 30px;
}
.header-side-right.header-vertical.site-layout-bordered.no-border-right #header{
margin-right: 0;
}
.header-side-right #mid{
padding: 0 280px 0 0;
}
/* HEADER MENU */
.header-side-right .mega-menu > ul{
left: auto;
right: 100%;
}
/* =============================================================================
Header horizontal general
========================================================================== */
.header-horizontal #header{
width: 100%;
position: fixed;
top: 0;
right: 0;
z-index: 11;/* above footer */ /* bg-color is for hover, rest for "to-move" class */
transition: transform .5s, background-color .5s;
}
.header-horizontal #header.no-fixed,
.header-horizontal #header.default-sticky{/* overwritten in JS */
position: absolute;
}
.mobile-menu-open.header-horizontal #header.default-sticky{
position: fixed;
/* if we are at top of page we don't want header to jump around while scrolling down */
}
#header.a13-horizontal{ /* removed from above rules too be easier overwritten */
border-bottom: 1px solid #E5E5E5;
}
.admin-bar.header-horizontal #header{
margin-top: 32px;
}
.header-horizontal #header .head{
padding: 0 40px;
margin: 0 auto;
width: 100%;
box-sizing: border-box;
}
.header-horizontal #header.narrow-header{
max-width: 1240px;
right: 50%;
-webkit-transform: translateX(50%);
-ms-transform: translateX(50%);
transform: translateX(50%);
}
#header.narrow .head,
#header.narrow .top-bar{
max-width: 1240px;
}
.header-horizontal .logo-container{
transition: max-width .5s, min-width .5s;
}
.header-horizontal .logo-container,
.header-horizontal .navigation-bar,
.header-horizontal #header-tools,
.header-horizontal header .socials {
display: table-cell;
vertical-align: middle;
}
.header-horizontal #header-tools,
.header-horizontal header .socials {
white-space: nowrap;
text-align: left;
}
.header-horizontal #header-tools{
padding-left: 15px;
}
.header-horizontal #header-tools::before,
.header-horizontal .head .socials::before{
content: "";
display: inline-block;
height: 25px;
width: 1px;
background-color: #E5E5E5;
margin-left: 15px;
vertical-align: middle;
}
.header-horizontal .head .socials a{
vertical-align: middle;
}
/* STICKY HEADER */
#header.sticky-values{
box-shadow: 0 0 12px rgba(0, 0, 0, 0.09);
}
.header-horizontal #header.sticky-hide,
.header-horizontal #header.hide-until-scrolled-to{
-webkit-transform: translateY(-102%);
-ms-transform: translateY(-102%);
transform: translateY(-102%);
/* 102% cause it leaves one pixel behind when doing 3d transforms */
}
.mobile-menu-open.header-horizontal #header.sticky-hide{
-webkit-transform: none !important;
-ms-transform: none !important;
transform: none !important;
/* it makes sure menu will not run away while scrolling on mobile menu */
}
.site-layout-bordered.header-horizontal #header{
top: 30px;
right: 30px;
left: 30px;
width: auto;
}
.no-border-top.header-horizontal #header{ top: 0; }
.no-border-right.header-horizontal #header{right: 0; }
.no-border-left.header-horizontal #header{left: 0; }
/* narrow overwrites */
.header-horizontal #header.narrow-header{
right: 50%;
-webkit-transform: translateX(50%);
-ms-transform: translateX(50%);
transform: translateX(50%);
}
.header-horizontal #header.sticky-hide.narrow-header,
.header-horizontal #header.hide-until-scrolled-to.narrow-header{
-webkit-transform: translate(50%, -102%);
-ms-transform: translate(50%, -102%);
transform: translate(50%, -102%);
/* 102% cause it leaves one pixel behind when doing 3d transforms */
}
.site-layout-bordered.header-horizontal #header.narrow-header{
width: 100%;
left: auto;
}
.no-border-right.header-horizontal #header.narrow-header,
.no-border-left.header-horizontal #header.narrow-header{
/* not fully supported, as no one should use such configuration */
left: 50%;
right: auto;
}
/* header scrollable menu */
.header-horizontal #header.scrollable-menu{
position: absolute !important;/* so it overwrites any inline style for hiding sticky header */
}
/* =============================================================================
Header horizontal variants
========================================================================== */
/* ONE LINE */
.header-type-one_line .head{
display: table;
}
/* ONE LINE MENU CENTERED */
.header-variant-one_line_menu_centered .top-menu{
text-align: center;
}
/* ONE LINE LOGO CENTERED */
.header-variant-one_line_centered .socials-cell,
.header-variant-one_line_centered .tools-cell{
width: 15%;
display: table-cell;
vertical-align: middle;
}
.header-variant-one_line_centered .tools-cell{
text-align: left;
}
.header-variant-one_line_centered #header-tools,
header.header-variant-one_line_centered .socials{
white-space: normal;
padding: 0;
display: block;
}
header.header-variant-one_line_centered .socials{
text-align: right;
}
.header-variant-one_line_centered #header-tools::before,
.header-variant-one_line_centered .head .socials::before {
display: none;
}
.header-variant-one_line_centered .menu-cell{
width: 70%;
display: table-cell;
vertical-align: middle;
text-align: center;
position: relative;
}
.header-variant-one_line_centered .navigation-bar{
display: block;
box-sizing: border-box;
/* for JS operation */
transition: min-height .5s;
}
.header-variant-one_line_centered .logo-container{
display: block;
max-width: 200px;
z-index: 1;
position: absolute;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
.header-variant-one_line_centered .logo-container a.logo{
margin: 0 auto;
}
.header-variant-one_line_centered .menu-cell .top-menu{
width: calc(50% - 100px);
float: right;
text-align: left;
/* for JS operation */
transition: width .5s, line-height .5s;
}
.header-variant-one_line_centered .menu-cell .right-part{
float: left;
text-align: right;
}
.header-variant-one_line_centered .top-menu > li,
.header-variant-one_line_centered .top-menu > li > a,
.header-variant-one_line_centered .top-menu > li > span.title{
line-height: inherit;
}
/* ONE LINE LOGO CENTERED WITH SHIELD */
.header-variant-one_line_centered .logo-container.shield{
transition: max-width .5s, min-width .5s, transform .5s;
}
.header-variant-one_line_centered .logo-container .scaling-svg-container{
width: 100%;
height: 0;
padding: 0;
padding-bottom: 125.6%;
z-index: -1;
position: absolute;
top: 0;
right: 0;
}
.header-variant-one_line_centered .logo-container > .scaling-svg-container svg{
width: 100%;
height: auto;
position: absolute;
top: 0;
right: 0;
}
.header-variant-one_line_centered.with-shield .top-menu > li > a,
.header-variant-one_line_centered.with-shield .top-menu > li > span.title{
padding-top: 20px;
padding-bottom: 20px;
/* below are needed for "show icons" Hover effect of menu */
height: 25px; /* so icons will move properly in FireFox */
line-height: 25px; /* text aligned with icons */
}
/* MULTI LINE */
#header.header-type-multi_line.narrow .head{
max-width: none;
}
#header.header-type-multi_line.narrow .top-head{
max-width: 1240px;
margin: 0 auto;
}
#header.header-type-multi_line .head{
padding: 0;
display: block;
}
.header-type-multi_line .top-head{
width: 100%;
padding: 0 340px;
box-sizing: border-box;
position: relative;
min-height: 40px;
}
.header-type-multi_line .bottom-head{
padding: 0 40px;
border-color: #E5E5E5;
border-top: 1px solid;
}
/*noinspection CssOptimizeSimilarProperties*/
.header-type-multi_line.header-variant-menu_above .bottom-head{
/* not optimized cause color is set in user.css */
border-top: none;
border-bottom-style: solid;
border-bottom-width: 1px;
}
.header-type-multi_line .logo-container{
display: block;
text-align: center;
}
.header-type-multi_line a.logo{
margin: auto;
}
.header-type-multi_line .navigation-bar,
.header-type-multi_line #header-tools,
.header-type-multi_line .head .socials{
display: block;
}
.header-type-multi_line #header-tools,
.header-type-multi_line .head .socials{
position: absolute;
padding: 0;
left: 40px;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.header-type-multi_line .head .socials{
left: auto;
right: 40px;
}
.header-type-multi_line #header-tools::before,
.header-type-multi_line .head .socials::before{
display: none;
}
.header-type-multi_line.narrow .navigation-bar{
max-width: 1160px;
margin: 0 auto;
}
.header-type-multi_line .top-menu{
text-align: center;
}
.header-type-multi_line .top-menu > li > a,
.header-type-multi_line .top-menu > li > span.title{
line-height: 40px;
height: 40px;
min-height: 40px;
}
/* ==========================================================================
Top bar in header
========================================================================== */
.top-bar-container{
border-bottom: 1px solid #E5E5E5;
overflow: hidden;/* for animating from sticky header to normal */
transition: background-color .5s, color .5s, opacity .7s, height .5s;/* height is .5 to match animation of other size propeties in header */
visibility: visible;
opacity: 1;
}
.top-bar-container.hide{
visibility: hidden;
opacity: 0;
height: 0;
transition: background-color .5s, color .5s, opacity .7s, visibility 0s .7s, height .5s;
}
.top-bar-container.measure{
visibility: hidden;
opacity: 0;
height: auto;
transition: none;
}
.top-bar-container .top-bar{
margin: 0 auto;
width: 100%;
padding: 7px 40px;
display: table;
line-height: 26px;
font-size: 12px;
box-sizing: border-box;
/* for header color variant switching */
transition: color .5s;
}
.top-bar .top-bar-msg a:hover{
text-decoration: underline;
}
.top-bar > div{
display: table-cell;
height: 26px; /* works as min-height */
width: 50%;
vertical-align: top;
}
.top-bar .part2{
text-align: left;
}
.top-bar .part1:empty,
.top-bar .part2:empty{
width: 0;
display: none;
}
.top-bar ul{
margin: 0;
padding: 0;
list-style: none;
}
.top-bar li{
display: inline-block;
position: relative;
}
.top-bar li a i{
margin-left: 8px;
}
.top-bar-menu li{
padding: 0 10px;
}
.top-bar-menu li:first-child{
padding-right: 0;
}
.top-bar .part2 .socials,
.top-bar .part2 .language-switcher{
display: inline-block;
}
.top-bar .part2 .socials{
margin-right: 15px;
}
.top-bar .language-switcher a{
padding: 0 10px;
display: inline-block;
}
.top-bar .language-switcher li::before{
content: "";
height: 13px;
width: 1px;
background-color: #E5E5E5;
display: inline-block;
vertical-align: middle;
}
.top-bar .language-switcher li:first-child::before{
display: none;
}
/* ==========================================================================
Top closable message
========================================================================== */
.top-message-container{
position: fixed;
z-index: 10000;
top: 0;
right: 0;
width: 100%;
text-transform: uppercase;
transform: none;
opacity: 1;
transition: opacity .5s, transform .5s;
}
.top-message-container.hide{
transform: translateY(-100%);
opacity: 0;
}
.top-message-container.bottom-screen.hide{
transform: translateY(100%);
}
.admin-bar .top-message-container{
top: 32px;
}
.top-message-container.bottom-screen{
top: auto;
bottom: 0;
}
.top-message{
margin: 0 auto;
max-width: 1240px;
width: 100%;
min-height: 40px;
padding: 8px 40px 6px;
display: table;
line-height: 26px;
font-size: 11px;
box-sizing: border-box;
}
.top-message .message{
display: table-cell;
height: 26px; /* works as min-height */
vertical-align: top;
width: 100%;
}
.top-message .message a:hover{
text-decoration: underline;
}
/* button */
.top-message .button span{
display: inline-block;
height: 26px;
line-height: 26px;
text-transform: uppercase;
text-align: center;
font-size: 11px;
font-weight: bold;
white-space: nowrap;
padding: 0 10px;
margin-right: 10px;
border: 1px solid #E5E5E5;
cursor: pointer;
-webkit-border-radius: 3px;
border-radius: 3px;
transition: border-color .3s, color .3s;
box-sizing: border-box;
}
/* when there is no button */
.top-message.no-button{
display: block;
position: relative;
}
.top-message.no-button > div{
display: block;
}
.top-message .close-sidebar{
top: 5px;
}
/* ==========================================================================
Header search
========================================================================== */
.search-container{
position: absolute;
z-index: 1;
top: 0;
bottom: 0;
right: 0;
width: 100%;
min-height: 100px;
background-color: #fff;
box-shadow: 0 0 12px rgba(0, 0, 0, 0.09);
display: none;
-webkit-transform: translateY(-100%);
-ms-transform: translateY(-100%);
transform: translateY(-100%);
opacity: 0;
visibility: hidden;
transition: opacity .3s, visibility 0s .3s, transform .3s;
}
.header-vertical .search-container{
right: 100%;
bottom: auto;
width: 640px;
}
.header-side-right.header-vertical .search-container{
left: auto;
right: 100%;
}
.search-container.open{
display: block;
}
.search-container.show{
opacity: 1;
visibility: visible;
transition: opacity .3s, transform .3s;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
.search-container .search{
margin: 0 auto;
max-width: 1160px;
padding: 0 40px;
position: relative;
}
.lt-ie10 .search-container input[type="text"],
.search-container input[type="search"]{
border: none;
background-color: transparent;
height: 100px;
width: 100%;
max-width: none;
padding: 38px 40px;
color: #aaa;
font-size: 18px;
text-align: right;
transition: color .5s;
}
.lt-ie10 .search-container input[type="text"]:focus,
.search-container input[type="search"]:focus{
color: #444;
}
.search-container .a13icon-search,
.search-container .close{
color: #c5c5c5;
font-size: 18px;
position: absolute;
right: 40px;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.search-container .close{
right: auto;
left: 34px;
padding: 6px;/* bigger click area */
cursor: pointer;
transition: color .5s;
}
.search-container .close:hover{
color: #444;
}
.search-container input[type="submit"]{
background: none;
height: 0;
width: 0;
position: absolute;
border: none;
}
#search-results-header{
margin: 0 auto;
max-width: 1240px;
width: 100%;
position: relative;
background-color: inherit;
box-shadow: 0 6px 6px -3px rgba(0, 0, 0, 0.09);
}
.header-vertical #search-results-header{
box-shadow: none;
}
.searchwp-live-search-results{
border-top: 1px solid #F2F2F2;
padding: 40px 0 90px;
}
.searchwp-live-search-results:empty{
display: none;
}
.searchwp-live-search-results .all-results{
display: block;
position: absolute;
bottom: 30px;
right: 50%;
-webkit-transform: translateX(50%);
-ms-transform: translateX(50%);
transform: translateX(50%);
height: 26px;
line-height: 28px;
text-transform: uppercase;
text-align: center;
color: #444;
font-size: 12px;
font-weight: bold;
padding: 0 10px;
border: 1px solid #E5E5E5;
-webkit-border-radius: 3px;
border-radius: 3px;
transition: background-color .3s, color .3s;
}
.searchwp-live-search-results .all-results:hover,
.searchwp-live-search-result--focused .all-results{
background-color: #222;
border-color: #222;
color: #fff;
}
.searchwp-live-search-result{
min-height: 112px;
font-size: 12px;
transition: background-color .35s;
}
.searchwp-live-search-result:hover,
.searchwp-live-search-result.searchwp-live-search-result--focused{
background-color: rgba(0, 0, 0, 0.03);
}
.searchwp-live-search-result a{
display: block;
padding: 22px 40px 10px
}
.searchwp-live-search-result a:hover{
text-decoration: none;
}
.searchwp-live-search-result .icon{
height: 80px;
width: 80px;
float: right;
background: #f6f6f6 no-repeat 50% 50%;
background-size: cover;
color: #666;
text-align: center;
font-size: 20px;
line-height: 80px;
-webkit-border-radius: 40px;
border-radius: 40px;
transition: box-shadow .35s;
}
.searchwp-live-search-result:hover .icon,
.searchwp-live-search-result.searchwp-live-search-result--focused .icon{
box-shadow: 0 0 14px #bbb;
}
.searchwp-live-search-result .title{
margin: 0 100px 10px 0;
display: block;
color: #444;
font-size: 14px;
font-weight: bold;
}
.searchwp-live-search-result time{
margin: 0 100px 10px 0;
display: block;
color: #B2B2B2;
}
.searchwp-live-search-result .excerpt{
margin: 0 100px 10px 0;
display: block;
color: #848484;
}
/* no results */
.searchwp-live-search-no-results{
text-align: center;
margin-bottom: -40px;
}
.searchwp-live-search-no-results h2{
color: #444;
font-size: 18px;
font-weight: bold;
text-transform: none;
margin: 0 0 5px;
}
.searchwp-live-search-no-results em{
color: #848484;
font-size: 14px;
font-style: normal;
}
/* ==========================================================================
Menu overlay
========================================================================== */
#menu-overlay{
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%; /* needed for proper position of nav */
z-index: 1002;
padding: 60px;
background-color: #000;
box-sizing: border-box;
}
.admin-bar #menu-overlay{
top: 32px;
}
.site-layout-bordered #menu-overlay{
top: 30px;
right: 30px;
left: 30px;
bottom: 30px;
height: calc(100% - 60px);
}
.site-layout-bordered.no-border-bottom.no-border-top #menu-overlay{
height: 100%;
}
.site-layout-bordered.no-border-top #menu-overlay,
.site-layout-bordered.no-border-bottom #menu-overlay{
height: calc(100% - 30px);
}
.admin-bar #menu-overlay,
.admin-bar.site-layout-bordered.no-border-bottom.no-border-top #menu-overlay{
height: calc(100% - 32px);
}
.admin-bar.site-layout-bordered.no-border-top #menu-overlay,
.admin-bar.site-layout-bordered.no-border-bottom #menu-overlay{
height: calc(100% - 62px);
}
.admin-bar.site-layout-bordered #menu-overlay{
top: 62px;
height: calc(100% - 92px);
}
.site-layout-bordered.no-border-top #menu-overlay{ top: 0; }
.admin-bar.site-layout-bordered.no-border-top #menu-overlay{ top: 32px; }
.site-layout-bordered.no-border-left #menu-overlay{left: 0; }
.site-layout-bordered.no-border-right #menu-overlay{right: 0; }
.site-layout-bordered.no-border-bottom #menu-overlay{ bottom: 0; }
#menu-overlay nav{
text-align: center;
position: relative;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
#menu-overlay.align-left nav{
text-align: left;
}
#menu-overlay.align-right nav{
text-align: right;
}
#menu-overlay.big-content nav{
max-height: 100%;
overflow: auto;
}
#menu-overlay ul {
list-style: none;
padding: 0;
margin: 0 auto;
display: inline-block;
height: 100%;
position: relative;
}
#menu-overlay ul li {
display: block;
}
#menu-overlay ul a{
line-height: 2em;
transition: color .5s;
}
.close-menu{
position: absolute;
top: 25px;
left: 25px;
cursor: pointer;
width: 25px;
height: 25px;
transition: transform .3s;
}
.close-menu::before,
.close-menu::after{
content: "";
width: 141.42%; /* a*scrt(2)*/
height: 1px;
position: absolute;
right: 0;
}
.close-menu::before{
top: 0;
-webkit-transform-origin: right center;
-ms-transform-origin: right center;
transform-origin: right center;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.close-menu::after{
bottom: 0;
-webkit-transform-origin: right center;
-ms-transform-origin: right center;
transform-origin: right center;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.close-menu:hover{
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
/* default effect*/
#menu-overlay.eff-default{
opacity: 0;
visibility: hidden;
transition: opacity 0.5s, visibility 0s 0.5s;
}
#menu-overlay.open.eff-default{
opacity: 1;
visibility: visible;
transition: opacity 0.5s;
}
#menu-overlay.eff-default ul {
opacity: 0.4;
-webkit-transform: translateY(-25%) rotateX(35deg);
transform: translateY(-25%) rotateX(35deg);
transition: transform 0.5s, opacity 0.5s;
}
#menu-overlay.open.eff-default ul{
opacity: 1;
-webkit-transform: rotateX(0deg);
transform: rotateX(0deg);
}
#menu-overlay.close.eff-default ul{
-webkit-transform: translateY(25%) rotateX(-35deg);
transform: translateY(25%) rotateX(-35deg);
}
/* slide down effect*/
#menu-overlay.eff-slide-top{
visibility: hidden;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
transition: transform .4s ease-in-out, visibility 0s .4s;
}
#menu-overlay.open.eff-slide-top{
visibility: visible;
-webkit-transform: translateY(0%);
transform: translateY(0%);
transition: transform .4s ease-in-out;
}
/* slide left/right effect*/
#menu-overlay.eff-slide-left,
#menu-overlay.eff-slide-right{
visibility: hidden;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
transition: transform .4s ease-in-out, visibility 0s .4s;
}
#menu-overlay.eff-slide-right{
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
#menu-overlay.open.eff-slide-left,
#menu-overlay.open.eff-slide-right{
visibility: visible;
-webkit-transform: translateX(0%);
transform: translateX(0%);
transition: transform 0.4s ease-in-out;
}
/* scale effect*/
#menu-overlay.eff-scale{
visibility: hidden;
opacity: 0;
-webkit-transform: scale(0.9);
transform: scale(0.9);
transition: transform 0.2s, opacity 0.2s, visibility 0s 0.2s;
}
#menu-overlay.open.eff-scale{
visibility: visible;
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
transition: transform 0.4s, opacity 0.4s;
}
/* circle effect*/
#menu-overlay.eff-circle{
visibility: hidden;
-webkit-transform: scale(0);
transform: scale(0);
transition: transform 0.4s, visibility 0s 0.4s;
background-color: transparent;
}
#menu-overlay.eff-circle::before{
content: "";
height: 200vw;
width: 200vw;
top: 50%;
right: 50%;
position: absolute;
-webkit-transform: translate(50%,-50%);
transform: translate(50%,-50%);
-webkit-border-radius: 50%;
border-radius: 50%;
}
#menu-overlay.open.eff-circle{
visibility: visible;
-webkit-transform: scale(1);
transform: scale(1);
transition: transform 0.75s;
}
#menu-overlay.eff-circle nav{
opacity: 0;
transition: opacity .4s;
}
#menu-overlay.open.eff-circle nav{
opacity: 1;
transition: opacity .4s .4s;
}
/* ==========================================================================
Footer
========================================================================== */
#footer{
font-size: 10px;
background-color: #1E1E1E;
width: 100%;
box-sizing: border-box;
}
.foot-items,
#footer .foot-widgets{
margin: 0 auto;
padding: 0 70px;
}
#footer.narrow .foot-items .foot-content{
margin: 0 auto;
}
#footer.narrow .foot-items .foot-content,
#footer.narrow .foot-widgets{
max-width: 1160px;
}
.foot-items{
color: #989898;
background-color: #101010;
}
.foot-widgets .foot-content{
padding: 15px 0 60px;
margin-right: -3%;
}
.foot-items .foot-content{
padding: 15px 0;
}
.footer-separator .foot-items .foot-content{
border-top: 1px solid transparent;
}
.foot-widgets .widget{
margin: 60px 3% 0 0;
float: right;
width: 30.3%;
box-sizing: border-box;
}
.widgets_margin_top_off .foot-widgets .widget{
margin-top: 60px; /* make sure widgets in footer wont be affected */
}
.one-col .widget{
width: 97%;
}
.two-col .widget{
width: 46.95%;
}
.four-col .widget{
width: 21.95%;
}
.five-col .widget{
width: 16.95%;
}
.two-col .widget:nth-child(2n+1),
.three-col .widget:nth-child(3n+1),
.four-col .widget:nth-child(4n+1),
.five-col .widget:nth-child(5n+1){
clear: both;
}
/* content */
.f-links{
float: left;
text-align: left;
max-width: 50%;
}
.foot-text {
line-height: 26px;
max-width: 50%;
float: right;
}
/* centered footer */
#footer.centered,
#footer.centered .widget h3.title,
#footer.centered .widget .socials{
text-align: center;
}
#footer.centered .f-links,
#footer.centered .foot-text {
float: none;
text-align: center;
max-width: none;
}
#footer.centered .f-links + .foot-text{
margin-top: 25px;
}
#footer.centered .foot-widgets .widget {
display: inline-block;
float: none;
vertical-align: top;
}
/* footer in vertical header */
.header-vertical .whole-layout > #footer{
display: none; /* hide footer while it is not moved to header */
}
#header #footer{
position: absolute;
bottom: 0;
right: 0;
min-height: 40px;
width: 280px;
background-color: transparent!important;
padding: 0;
text-align: inherit;
margin-top: 20px;
}
#header .foot-items{
background-color: transparent!important;
padding: 0 40px 30px;
}
#header .foot-items .foot-content{
padding: 0;
}
#header .footer-separator .foot-items .foot-content{
padding-top: 30px;
}
#header #footer .f-links, /* double id selector to overwrite footer .centered styles */
#header #footer .foot-text{
float: none;
max-width: none;
text-align: inherit;
}
#header .foot-text{
line-height: 1.5em;
}
#header .f-links + .foot-text{
margin-top: 30px;
}
/* =============================================================================
Footer unravel effect
========================================================================== */
#footer.unravel{
position: fixed;
right: 0;
bottom: 0;
z-index: 1;
opacity: 1;
visibility: visible;
transition: opacity 0.3s;
}
#footer.unravel.hide-it{
visibility: hidden;
opacity: 0;
transition: opacity 0.3s, visibility 0s 0.3s;
}
.site-layout-boxed #footer.unravel{
max-width: 1240px;
margin: 0 auto;
right: auto;
}
.site-layout-bordered #footer.unravel{
left: 30px;
right: 30px;
bottom: 30px;
width: auto;
}
.site-layout-bordered.no-border-left #footer.unravel{left: 0; }
.site-layout-bordered.no-border-right #footer.unravel{right: 0; }
.site-layout-bordered.no-border-bottom #footer.unravel{ bottom: 0; }
/* =============================================================================
Sidebar & widgets
========================================================================== */
.widget{
margin: 35px 0 40px;
font-size: 12px;
line-height: 1.6667em;
}
#secondary .widget:nth-last-child(2),
.widget:last-child{
margin-bottom: 0;
}
.widgets_margin_top_off .widget{
margin-top: 0;
}
.widget h3.title{
margin: 0 0 25px;
font-size: 14px;
line-height: 1.4em;
color: #222;
text-align: right; /* WooCommerce was overwriting this */
}
/* COLORS */
.widget a{
color: #535353;
}
.widget a:hover{
color: #222;
text-decoration: underline;
}
/* lists in widgets */
.widget ul{
list-style-type: none;
margin: 0;
padding: 0;
}
.widget ul ul{
margin: 0 25px 0 0;
}
.widget_nav_menu li a{
display: block;
}
.widget_nav_menu li a i{
margin-left: 8px;
}
.widget_nav_menu ul ul{
margin: 0;
}
.widget_nav_menu li li a{
padding-right: 10px;
}
.widget_nav_menu li li li a{
padding-right: 20px;
}
/* RECENT/POPULAR/RELATED POSTS WIDGET */
/* RECENT COMMENTS WIDGET */
.widget_about_posts .item{
margin: 0 0 10px;
}
.widget_about_posts .post-title{
margin-left: 10px;
}
.widget_about_posts .entry-date,
.widget_about_posts .comments{
display: block;
opacity: 0.6;
}
.widget_about_posts .entry-date i{
margin-left: 5px;
}
.widget_about_posts .content{
display: block;
clear: both;
margin: 5px 0 15px;
}
.widget_recent_comments .recentcomments{
color: #999;
display: block;
margin: 0 0 4px;
}
/* CALENDAR WIDGET */
#wp-calendar{
width: 100%;
}
#wp-calendar caption{
padding-bottom: 10px;
}
#wp-calendar td{
text-align: center;
}
#wp-calendar tfoot td{
padding-top: 10px;
}
#wp-calendar tfoot td#prev{
text-align: right;
}
#wp-calendar tfoot td#next{
text-align: left;
}
/* RSS WIDGET */
a.rsswidget{
display: inline;
}
.rsswidget img{
margin-top: -2px;
}
.widget_rss >ul >li{
margin-top: 20px;
}
.rss-date{
display: block;
}
/* TAG CLOUD WIDGET */
.under_content_tags{
margin: 20px 0 0 0;
}
.tagcloud a,
.under_content_tags a{
border: none;
background-color: #f7f7f7;
padding: 0 10px;
margin: 4px 0 0;
display: inline-block;
color: #535353;
line-height: 25px;
font-weight: bold;
}
.tagcloud a:hover,
.under_content_tags a:hover{
color: #fff;
border-color: #222;
background-color: #222;
text-decoration: none;
}
.tagcloud a:hover{
color: #fff !important; /* so predefined color scheme wont overwrite it */
}
.widget_tag_cloud a,
.under_content_tags a{
font-size: 10px !important; /* tag cloud insert inline font-size style */
letter-spacing: 1px;
text-transform: uppercase;
}
/* TEXT WIDGET Limits */
.widget_text img{
max-width: 100%;
height: auto;
}
.widget_text .wp-caption{
margin: 0;
}
/* ALBUMS WIDGET*/
.widget_recent_cpt .items{
margin: -6% -6% 0 0;
line-height: 0;
}
.widget_recent_cpt .item{
display: inline-block;
margin: 6% 6% 0 0;
width: 27.33%;
height: auto; /* was 27.33% but it doesn't work that way ;-) */
position: relative; /* for hover */
}
.widget_recent_cpt a{
display: block;
height: auto; /* was 100% but it doesn't work that way ;-) */
width: 100%;
}
.widget_recent_cpt img{
display: block;
position: relative;
top: 0;
right: 0;
height: 100%;
width: 100%;
transition: opacity .5s;
}
.widget_recent_cpt .item:hover img{
opacity: 0.5;
}
/* Socials WIDGET */
.widget .socials{
text-align: right;
}
/* CONTACT INFO */
.widget_contact_info .info{
margin-top: 0;
}
.widget_contact_info .content-text{
margin-bottom: 20px;
}
.widget_contact_info .with_icon{
padding-right: 25px;
position: relative;
}
.widget_contact_info .with_icon > i{
color: #bcbcbc;
position: absolute;
top: 0;
right: 0;
line-height: 24px;
}
.widget_contact_info .email,
.widget_contact_info .www{
display: block;
}
/* WIDGET SLIDER CONTROLS */
.js div.widget_rss li{
display: none;
}
.slider-ctrls{
position: relative;
}
.slider-ctrls .title{
padding-left: 40px;
}
.widget-slider-ctrls{
position: absolute;
top: 0;
left: 0;
line-height: 20px;
height: 20px;
background-color: rgba(0, 0, 0, 0.6);
direction: ltr;
}
.widget-slider-ctrls span{
cursor: pointer;
display: inline-block;
height: 20px;
width: 20px;
line-height: 20px;
color: #fff;
text-align: center;
font-size: 14px;
opacity: 0.5;
filter: alpha(opacity=50); /* IE 8 */
}
.widget-slider-ctrls span:hover{
opacity: 1;
filter: alpha(opacity=100); /* IE 8 */
}
/* SEARCH FORM WIDGET */
.widget form[role="search"]{
position: relative;
}
.widget form[role="search"] input[type="search"]{
border: 1px solid #eee;
-webkit-border-radius: 2px;
border-radius: 2px;
font-size: 12px;
background-color: #fff;
padding-left: 50px;
}
.widget form[role="search"] input[type="search"]:hover,
.widget form[role="search"] input[type="search"]:focus{
background-color: #f9f9f9;
border-color: #c0c0c0;
}
.widget form[role="search"] input[type="submit"],
.widget form[role="search"] button[type="submit"]{
background: none;
height: 40px;
width: 40px;
position: absolute;
top: 0;
left: 0;
border: none;
opacity: 0;
z-index: 5;
}
.widget form[role="search"]::before{
/* use !important to prevent issues with browser extensions that change fonts */
/*noinspection CssNoGenericFontName*/
font-family: 'a13-icomoon' !important;
/*noinspection CssUnknownProperty*/
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
/*noinspection CssUnknownProperty*/
-moz-osx-font-smoothing: grayscale;
content: "\e036";
height: 40px;
width: 40px;
line-height: 40px;
position: absolute;
top: 0;
left: 0;
z-index: 4;
color: #aaa;
font-size: 14px;
text-align: center;
}
/* Gallery widget */
.widget .gallery img{
max-width: 100%;
height: auto;
box-sizing: border-box;
}
/* =============================================================================
Colors in dark sidebars
========================================================================== */
.dark-sidebar,
.dark-sidebar .widget{
color: #666;
}
.dark-sidebar a,
.dark-sidebar .widget_filter li a {
color: #777;
}
.dark-sidebar a:hover{
color: #aaa;
}
.dark-sidebar .widget h3.title{
color: #fff;
}
.dark-sidebar .tagcloud a{
background-color: #1d1d1d;
color: #777;
}
.dark-sidebar .tagcloud a:hover{
background-color: #777;
color: #2c2c2c;
}
.lt-ie10 .dark-sidebar .widget_search input[type="text"],
.dark-sidebar .widget_search form[role="search"] input[type="search"]{
background-color: #161616;
border: 1px solid #222;
color: #fff;
}
.lt-ie10 .dark-sidebar .widget_search input[type="text"]:hover,
.lt-ie10 .dark-sidebar .widget_search input[type="text"]:focus,
.dark-sidebar .widget_search form[role="search"] input[type="search"]:hover,
.dark-sidebar .widget_search form[role="search"] input[type="search"]:focus{
background-color: #161616;
border-color: #333;
}
.dark-sidebar .widget_filter .selected a,
.dark-sidebar .widget_filter a:hover {
background-color: #fff;
color: #222;
text-decoration: none;
}
/* ==========================================================================
Title bar
========================================================================== */
.title-bar{
overflow: hidden; /* for scrolling out titles */
}
.title-bar .in{
max-width: 1160px;
margin: 0 auto;
text-align: center;
}
.page-title{
word-wrap: break-word;
margin: 0;
line-height: 1.2;
font-size: 36px;
}
.title-bar .in h2{
font-size: 12px;
font-weight: bold;
margin: 0 0 25px 0;
letter-spacing: 6px;
opacity: 0.5;
text-transform: uppercase;
}
.title-bar .breadcrumbs,
.title-bar .post-meta{
font-size: 16px;
}
.title-bar .post-meta{
margin-bottom: 20px;
}
.title-bar .breadcrumbs{
margin-top: 10px;
}
.title-bar .breadcrumbs a:hover,
.title-bar .post-meta a:hover{
opacity: 0.8;
}
.title-bar .page-title{
color: #222;
}
/* INSIDE VERSION */
.title-bar.inside{
margin: 0 0 60px;
}
.post-media + .title-bar.inside{
margin-top: 60px;
}
.title-bar.inside .in h2{
color: #A9A9A9;
}
/* OUTSIDE VERSION */
.title-bar.outside .overlay-color{
background: transparent;
padding: 40px;
}
.title-bar.outside h2 {
color: #222;
font-size: 12px;
}
.title-bar.outside h2 a{
color: #666;
}
.title-bar.outside h2 a:hover{
color: #222;
}
/* CLASSIC VARIANT */
.title_bar_variant_classic .in{
text-align: right;
display: table;
width: 100%;
}
.title_bar_variant_classic.title_bar_width_full .in{
max-width: none;
}
.title_bar_variant_classic .titles,
.title_bar_variant_classic .breadcrumbs{
display: table-cell;
vertical-align: middle;
}
.title_bar_variant_classic .breadcrumbs{
text-align: left;
margin-top: 0;
}
/* ==========================================================================
Content layout variants
========================================================================== */
.content-limiter{
max-width: 1160px;
margin: 0 auto;
}
#col-mask{
float: left;
position: relative;
width: 100%;
right: 25%;
}
.content-box{
float: left;
position: relative;
left: 25%;
width: calc(75% - 10px);
margin-right: 10px;
}
.left-sidebar .content-box{
float: right;
margin-left: 10px;
margin-right: 0;
}
.layout-full .content-box,
.layout-full_fixed .content-box,
.layout-full_padding .content-box{
width: 75%;
margin-right: 0;
margin-left: 0;
}
.no-sidebars #col-mask,
.no-sidebars .content-box{
float: none;
position: static;
left: auto;
width: auto;
margin-right: 0;
}
.no-sidebars .content-box{
left: 0;
}
#secondary{
float: left;
left: 25%;
padding: 25px 40px 60px;/* top 25 + 35 margin of widget = 60px top padding ;) */
position: relative;
width: 25%;
box-sizing: border-box;
}
.left-sidebar #secondary{
float: right;
}
.layout-full #content,
.layout-full_fixed #content,
.layout-full_padding #content{
background-color: #fff;
}
.layout-full .content-limiter,
.layout-full_padding .content-limiter{
max-width: none;
}
.layout-padding #content{
margin: 0 40px;
}
.layout-parted .content-box,
.layout-parted #secondary{
background-color: #fff;
}
.layout-edge .content-limiter{
max-width: 1000px;
margin: 0;
}
.layout-edge.no-sidebars .content-limiter{
max-width: 700px;
}
.layout-edge .title-bar.inside .in{
text-align: right;
}
.layout-right #content,
.layout-right_padding #content{
direction: rtl;
}
.layout-right .content-limiter,
.layout-right_padding .content-limiter{
direction: ltr;
}
/* ==========================================================================
General content styles
========================================================================== */
.formatter{
padding: 60px;
}
.no-bottom-space .content-box > .formatter{
padding-bottom: 0 !important;
}
.no-top-space .content-box > .formatter{
padding-top: 0 !important;
}
.no-side-space .content-box > .formatter{
padding-left: 0 !important;
padding-right: 0 !important;
}
.formatter.no-content{
padding: 0;
}
.titles h2 {
font-size: 14px;
font-weight: normal;
margin-top: 5px;
}
.post-media > a{
display: block;
}
.post-media img{
display: block;
height: auto;
margin: 0 auto;
max-width: 100%;
width: auto;
}
.post-media.animated-gif img{
width: 100%;
}
.post-media iframe,
.real-content iframe{
border: none;
display: block;
margin: 0 auto;
max-width: 100%;
}
.post-hatom-fix{
display: none;
}
.real-content{
line-height: 1.7;
margin-top: 15px;
}
.real-content:first-child,
.post-hatom-fix:first-child + *{
margin-top: 0;
}
.real-content > p,
.entry-summary > p,
.wpb_text_column p{
margin: 0;
padding: .85em 0;
}
.real-content > p:first-child{
padding-top: 0;
font-size: 1.1em;
color: #444;
}
.real-content h6{
font-size: 1em;
}
.real-content h5{
font-size: 1.1em;
}
.real-content h4{
font-size: 1.2em;
line-height: 1.22;
}
.real-content h3{
font-size: 1.625em;
line-height: 1.15;
}
.real-content h2{
font-size: 2em;
line-height: 1.1;
}
.real-content h1{
font-size: 2.2em;
line-height: 1.05;
}
.real-content > h1,
.real-content > h2,
.real-content > h3,
.real-content > h4,
.real-content > h5,
.real-content > h6,
.wpb_text_column h1,
.wpb_text_column h2,
.wpb_text_column h3,
.wpb_text_column h4,
.wpb_text_column h5,
.wpb_text_column h6{
padding: 1.5em 0 .5em;
margin: 0;
}
.real-content > h1:first-child,
.real-content > h2:first-child,
.real-content > h3:first-child,
.real-content > h4:first-child,
.real-content > h5:first-child,
.real-content > h6:first-child,
.wpb_text_column h1:first-child,
.wpb_text_column h2:first-child,
.wpb_text_column h3:first-child,
.wpb_text_column h4:first-child,
.wpb_text_column h5:first-child,
.wpb_text_column h6:first-child{
padding-top: .5em;
}
.real-content h1 + h2,
.real-content h2 + h3,
.real-content h3 + h4,
.real-content h4 + h5,
.real-content h5 + h6{
padding-top: 0;
}
.real-content ol,
.real-content ul{
margin: .5em 1.5em;
padding: 0;
}
.real-content li {
padding: .2em 0;
}
.real-content img{
height: auto;
max-width: 100%;
box-sizing: border-box;
}
/* 404 TEMPLATE */
.default404 .page-background{
background-color: #fff;
}
.default404 .title-bar.outside h2 a{
color: #666;
}
.default404 .title-bar.outside .page-title,
.default404 .title-bar.outside h2,
.default404 .title-bar.outside h2 a:hover {
color: #000;
}
.default404 .title-bar.outside .page-title{
line-height: 3em;
}
.default404 .emblem{
display: block;
font-size: 3em;
line-height: 1em;
}
.default404 .title-bar .overlay-color{
padding: 150px 0;
}
/* PASSWORD FORM TEMPLATE */
/* body.password-protected is used to overwrite user.css rules */
body.password-protected .page-background{
background-color: #fff;
}
body.password-protected .title-bar.outside{
background-image: none;
}
body.password-protected .title-bar.outside .overlay-color{
padding: 150px 0 30px;
background-color: transparent;
}
body.password-protected .title-bar.outside .page-title{
line-height: 1.5em;
color: #000;
font-size: 36px; /* predefined */
}
.password-protected .emblem{
display: block;
font-size: 5em;
}
/* password form */
.post-password-form {
max-width: 490px;
margin: 20px auto 0;
}
.password-protected .post-password-form{
padding-bottom: 100px;
}
.post-password-form p{
font-size: 13px !important; /* overwrite content styles for p */
}
.password-form .inputs{
margin: 0;
}
.post-password-form input{
display: inline-block;
vertical-align: top;
width: auto;
min-width: 60%;
}
.post-password-form input[type="submit"]{
min-width: 29.9%;
}
/* page links if post is divided into parts */
#page-links{
margin-top: 1em;
}
/* COLUMNS */
.left50{
width: 47%;
float: right;
margin-left: 3%;
}
.right50{
width: 47%;
float: right;
margin-right: 3%;
}
/* special lists */
ul.styled, .styled ul, ol.styled, .styled ol{
list-style-type: none;
margin: 0 25px 0 0;
padding: 0;
}
/* ==========================================================================
Post meta
========================================================================== */
.post .post-meta{
font-size: .778em;
color: #A7A7A7;
}
.post .post-meta a{
color: #A7A7A7;
}
.post .post-meta a:hover{
color: #222;
}
.post-meta-categories {
display: inline-block;
}
.post-meta .separator::before{
content: '/';
margin: 0 10px;
}
.post-meta span[itemprop="interactionStatistic"]{
font-size: 0;
}
/* =============================================================================
Posts navigation
========================================================================== */
.posts-nav{
margin: 50px 0;
display: table;
width: 100%;
}
.posts-nav a{
display: table-cell;
width: 47.5%;
padding: 0 0 0 2.5%;
height: 140px;
vertical-align: middle;
text-align: center;
font-size: 11px;
}
.posts-nav a.next{
padding-right: 2.5%;
padding-left: 0;
}
.posts-nav a span{
font-size: 10px;
color: #6A6A6A;
display: block;
text-transform: uppercase;
}
.posts-nav a span.title{
line-height: 20px;
font-size: 15px;
font-weight: bold;
word-wrap: break-word;
color: #333;
margin-top: 10px;
}
.posts-nav a:hover span.title{
color: #000;
}
.posts-nav .image{
margin-top: 15px;
position: relative;
display: inline-block;
overflow: hidden;
}
.posts-nav .image::before {
position: absolute;
top: 0;
right: -75%;
z-index: 2;
display: block;
content: '';
width: 50%;
height: 100%;
background: -webkit-linear-gradient(right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
background: linear-gradient(to left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
-webkit-transform: skewX(25deg);
transform: skewX(25deg);
}
.posts-nav .image:hover::before {
-webkit-animation: shine .75s;
animation: shine .75s;
}
@-webkit-keyframes shine {
100% {
right: 125%;
}
}
@keyframes shine {
100% {
right: 125%;
}
}
/* =============================================================================
Comments & about author
========================================================================== */
/** ABOUT AUTHOR */
div.about-author{ /* div selector to overwrite .comment style */
background-color: #FAFAFA;
margin: 0 -60px -60px;
padding: 80px 60px 40px;
}
.about-author .comment-author{
display: block;
font-size: 15px;
color: #222;
}
/* COMMENTS */
.comments-area{
/* almost no styles cause when no comments
* then comment form area takes over styling
*/
margin: 60px -60px -60px;
padding: 40px 60px;
background-color: #FAFAFA;
}
.formatter.no-content .comments-area{
margin: 0;
}
.layout-full_fixed .comments-area,
.layout-full_fixed div.about-author{
position: relative;
}
.layout-full_fixed div.about-author::before,
.layout-full_fixed div.about-author::after,
.layout-full_fixed .comments-area::before,
.layout-full_fixed .comments-area::after{
content: "";
position: absolute;
background-color: #FAFAFA;
width: 3000px;
top: 0;
bottom: 0;
right: 100%;
}
.layout-full_fixed div.about-author::after,
.layout-full_fixed .comments-area::after{
left: 100%;
right: auto;
}
#comments-title{
margin: 0;
}
h2.comments-title {
color: #222;
font-size: 16px;
border-bottom: 1px solid #eee;
margin: 0;
padding-bottom: 20px;
}
.comment{
min-height: 90px;
padding: 50px 0 0;
}
.pingback{
padding-top: 20px;
}
.comment-body,
.author-inside{
position: relative;
padding-right: 120px;
line-height: 1.5;
word-wrap: break-word;
}
.pingback .comment-body{
padding-right: 0;
}
.comment .comment{
margin-right: 40px;
}
img.avatar{
-webkit-border-radius: 45px;
border-radius: 45px;
display: block;
position: absolute;
right: 0;
transition: all .5s;
}
.comment > .comment-body:hover img.avatar{
-webkit-transform: scale(0.8);
-ms-transform: scale(0.8);
transform: scale(0.8);
}
.says, .screen-reader-text {
clip: rect(1px, 1px, 1px, 1px);
height: 1px;
overflow: hidden;
position: absolute !important;
width: 1px;
}
.comment-metadata{
font-size: 12px;
margin-top: 4px;
}
.comment-metadata a{
color: #AFAFAF;
}
.comment-metadata .edit-link{
margin-right: 1em;
}
.comment-author{
color: #484848;
font-size: 15px;
font-weight: bold;
}
.comment-author a{
color: #484848;
}
.comment-author a:hover{
color: #222;
}
.bypostauthor > .comment-body .comment-author .fn::after{
content: "";
background: transparent url(images/author.png) 100% 0 no-repeat;
height: 23px;
width: 43px;
margin-right: 15px;
display: inline-block;
}
.comment-content{
padding: 15px 0;
}
.comment-content p{
margin: 1em 0 0;
}
.comment-content > p:first-child{
margin-top: 0;
}
a.comment-reply-link{
color: #6A6A6A;
font-size: 11px;
letter-spacing: 2px;
text-transform: uppercase;
}
a.comment-reply-link::before{
content: "\f112";
font-family: FontAwesome, monospace;
margin-left: 10px;
}
em.comment-awaiting-moderation{
border-bottom: 1px dashed;
}
.comment-navigation{
margin-top: 25px;
}
/* =============================================================================
Add comment form
========================================================================== */
#respond{
margin: 50px 0 0;
}
#respond:first-child{ /* no comments yet */
margin-top: 0;
}
#reply-title{
color: #222;
font-size: 16px;
margin: 0;
padding-bottom: 20px;
border-bottom: 1px solid #eee;
}
#cancel-comment-reply-link{
padding-right: 4px;
display: inline;
border-right: 1px solid #000;
color: #000;
}
.comment-form-author,
.comment-form-email,
.comment-form-url{
float: right;
width: 32%;
margin: 15px 2% 0 0;
}
.comment-form-cookies-consent{
padding-top: 15px;
clear: both;
}
.comment-form-cookies-consent{
padding-top: 15px;
clear: both;
}
.comment-form-author{
margin-right: 0;
}
.comment-form-comment,
.cptch_block{
float: none;
width: auto;
margin: 0;
padding-top: 15px;
clear: both;
}
.comment-form-comment textarea{
max-width: none;
}
.form-submit{
clear: both;
}
.form-submit::before{
content: "";
clear: both;
display: block;
}
.form-submit input[type="submit"]{
margin: 15px 0 0;
}
.comment-form p label{
display: block;
margin-bottom: 12px;
color: #222;
font-size: 12px;
}
.comment-form p.comment-form-cookies-consent label{
display: inline-block;
margin: 0 12px 0 0;
}
.form-info,
span.wpcf7-not-valid-tip,
div.wpcf7-response-output{
background-color: #e9fdd5;
border: 1px solid #a6e368;
padding: 6px;
margin: 12px 0 0;
color: #3dcb05;
font-size: 13px;
line-height: 20px;
text-align: center;
/*cursor: pointer;*//*there is no action on this div*/
}
.form-info.error,
span.wpcf7-not-valid-tip,
div.wpcf7-validation-errors{
background-color: #ffeaea;
border-color: #feabab;
color: #eb1515;
}
div.wpcf7-response-output{
margin-bottom: 20px;
}
span.wpcf7-not-valid-tip{
position: static;
display: block;
margin-top: 5px;
max-width: 280px;
width: auto;
}
/* captcha plugin */
.cptch_block br{
display: none;
}
/* =============================================================================
Attachment page
========================================================================== */
p.attachment img,
div.attachment .wp-video{
display: block;
margin: 0 auto;
}
.attachment-info{
margin-top: 20px;
}
/* ==========================================================================
Posts list
========================================================================== */
.posts-list .layout-full #content,
.posts-list .layout-full_fixed #content,
.posts-list .layout-full_padding #content,
.posts-list .layout-parted .content-box{
background-color: transparent;
}
.posts-list.search-no-results .layout-full #content,
.posts-list.search-no-results .layout-full_fixed #content,
.posts-list.search-no-results .layout-full_padding #content,
.posts-list.search-no-results .layout-parted .content-box,
.posts-list .layout-full #secondary,
.posts-list .layout-full_fixed #secondary,
.posts-list .layout-full_padding #secondary{
background-color: #fff;
}
.bricks-frame{
margin: 0 auto;
overflow: hidden; /* fix for horizontal scroll when bricks take full width */
}
.posts-list .content-box{
padding-top: 40px;
padding-bottom: 40px;
}
.posts-list .no-bottom-padding .content-box{
padding-bottom: 0;
}
.posts-list .no-top-padding .content-box{
padding-top: 0;
}
.posts-list #secondary{
margin-top: 40px;
}
.posts-list .no-top-padding #secondary{
margin-top: 0;
}
.archive-item,
.grid-master{
float: right;
}
.posts-list .sticky{
border-top: 4px solid #ff0000;
}
.bricks-frame .formatter,
.post_theme_options .formatter{
padding: 40px;
}
.bricks-frame .formatter{
background-color: #fff;
}
.post-media {
position: relative;
}
.item-image a{
position: relative;
height: 100%;
}
.item-image a::before{
content: "";
opacity: 0;
background-color: #000;
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
z-index: 4;
transition: opacity .5s;
}
.item-image:hover a::before{
opacity: .7;
}
.item-image a::after{
/* use !important to prevent issues with browser extensions that change fonts */
/*noinspection CssNoGenericFontName*/
font-family: 'a13-icomoon' !important;
/*noinspection CssUnknownProperty*/
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
/*noinspection CssUnknownProperty*/
-moz-osx-font-smoothing: grayscale;
/* position and look */
content: "\e114";
opacity: 0;
position: absolute;
z-index: 5;
top: 50%;
right: 50%;
font-size: 48px;
color: #fff;
-webkit-transform: translate(50%, -50%);
-ms-transform: translate(50%, -50%);
transform: translate(50%, -50%);
transition: opacity .5s;
}
.item-image:hover a::after{
opacity: 1;
}
h2.post-title {
color: #222;
font-size: 1.57em;
line-height: 1.3;
word-wrap: break-word;
}
h2.post-title:hover a {
color: #000;
}
.post-meta + h2.post-title{
padding-top: .5em;
}
.archive-item .post-title:first-child{
margin-top: 0;
}
.post-format-link-icon{
margin-right: 10px;
}
.format-link .post-title a{
text-decoration: underline;
}
/* in quote/link post format*/
.cite-author{
margin-top: 25px;
display: block;
}
/* post layouts on posts list */
.posts_vertical_no_padding .formatter{
padding-right: 0;
padding-left: 0;
}
.posts_vertical_centered .formatter{
text-align: center;
}
.posts_horizontal .archive-item{
background-color: #fff;
/*float: none;*/
/*margin-bottom: 10px;*/
}
.posts_horizontal .post-media{
width: 420px;
float: right;
}
.posts_horizontal .post-media + .formatter{
margin-right: 420px;
}
.posts_horizontal .real-content > .clear{
clear: none;
}
/* RESPONSIVE WP VIDEO */
.item-video div.wp-video{
width: 100% !important;
}
.item-video .mejs-container,
.posts-list .item-video .mejs-container,
.gallery-frame .archive-item .mejs-container,
.single-album .archive-item .mejs-container{
width: 100% !important;
height: auto !important;
padding-top: 56.25%;
}
.item-video .mejs-overlay,
.item-video .mejs-poster,
.gallery-frame .archive-item .mejs-overlay,
.gallery-frame .archive-item .mejs-poster,
.single-album .archive-item .mejs-overlay,
.single-album .archive-item .mejs-poster {
width: 100% !important;
height: 100% !important;
}
.item-video .mejs-mediaelement video,
.gallery-frame .archive-item .mejs-mediaelement video,
.single-album .archive-item .mejs-mediaelement video{
position: absolute;
top: 0; right: 0; left: 0; bottom: 0;
width: 100% !important;
height: 100% !important;
}
/* images slider */
.item-slider{
overflow: hidden;
position: relative; /* slider pagination on posts list */
}
.item-slider img{
display: block;
}
.slidesjs-container{
z-index: 0;
}
.slidesjs-pagination {
padding: 0;
margin: 0 40px 30px 0;
position: absolute;
bottom: 0;
right: 0;
z-index: 12;
list-style: none;
}
.single-post .slidesjs-pagination,
.page .slidesjs-pagination{
margin: 0 60px 40px 0;
}
.slidesjs-pagination li {
float: right;
margin: 0 2px;
}
.slidesjs-pagination li a {
display: block;
width: 7px;
height: 0;
padding-top: 7px;
background-color: transparent;
border: 2px solid #fff;
-webkit-border-radius: 8px;
border-radius: 8px;
float: right;
overflow: hidden;
transition: background-color .35s;
}
.slidesjs-pagination li a:hover,
.slidesjs-pagination li a.active{
background-color: #fff;
}
.more-link{
display: inline-block;
line-height: 1.5em;
font-size: .889em;
font-weight: bold;
}
/* =============================================================================
Pagination
========================================================================== */
.navigation{
margin: 40px 0;
padding: 0 120px;/* for next prev in pagination*/
text-transform: uppercase;
background-color: #fff;
text-align: center;
position: relative;
}
.lazy-load-on .navigation{
display: none;
}
.navigation .nav-links{
font-size: 0;/* no space between links */
}
.navigation a,
.navigation span{
font-size: 10px;
letter-spacing: 2px;
text-transform: uppercase;
background-color: transparent;
display: inline-block;
height: 40px;
padding: 0 9px;
margin: 0;
color: #3D3D3D;
line-height: 40px;
}
.navigation .next,
.navigation .prev{
color: #222;
padding: 0 20px;
max-width: 80px;
position: absolute;
top: 0;
right: 0;
}
.navigation .next{
right: auto;
left: 0;
}
.navigation .current,
.navigation a:hover{
color: #fff;
background-color: #bbb;
}
.navigation .next:hover,
.navigation .prev:hover{
background-color: #222;
}
/* Infinite scroll*/
#infscr-loading{
text-align: center;
margin-top: 40px;
}
.load-more-button i{
margin-right: 10px;
}
.load-more-button{
background-color: #f2f2f2;
color: #222;
text-align: center;
text-transform: uppercase;
font-weight: bold;
font-size: 11px;
height: 40px;
line-height: 43px;
padding: 0 10px;
margin: 40px;
cursor: pointer;
position: relative;
-webkit-border-radius: 4px;
border-radius: 4px;
transition: background-color .5s, color .5s;
}
.posts-list .load-more-button,
.products-list .load-more-button{
margin: 30px 0 80px;
}
span.result-count{
display: none;
}
.load-more-button span.result-count{
display: block;
position: absolute;
left: 15px;
top: 0;
line-height: 43px;
}
.load-more-button.loading,
.load-more-button:hover{
background-color: #222;
color: #fff;
}
.load-more-button .ll-animation{
display: none;
}
.load-more-button.loading .ll-animation{
display: block;
}
.load-more-button.loading .text{
display: none;
}
#lazyload-indicator{
background-color: rgba(0,0,0,0.8);
display: block;
height: 40px;
width: 40px;
margin-bottom: 40px;
-webkit-border-radius: 20px;
border-radius: 20px;
color: #fff;
position: fixed;
z-index: 125;
bottom: 40px;
right: 50%;
-webkit-transform: translateX(50%);
-ms-transform: translateX(50%);
transform: translateX(50%);
/* for showing/hiding */
visibility: visible;
opacity: 1;
transition: opacity 0.3s;
}
#lazyload-indicator.idle{
opacity: 0;
visibility: hidden;
transition: opacity 0.3s, visibility 0s 0.3s;
}
.ll-animation{
z-index: 2000;
width: 24px;
height: 24px;
position: absolute;
top: 6px;
right: 50%;
margin-right: -14px;
display: block;
border: solid 2px transparent;
border-top-color: #fff;
border-right-color: #fff;
-webkit-border-radius: 14px;
border-radius: 14px;
-webkit-animation: ll-animation 400ms linear infinite;
animation: ll-animation 400ms linear infinite;
opacity: 1;
transition: opacity .2s;
}
.idle .ll-animation{
-webkit-animation: none;
animation: none;
opacity: 0;
}
@-webkit-keyframes ll-animation {
0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
100% { -webkit-transform: rotate(-360deg); transform: rotate(-360deg); }
}
@keyframes ll-animation {
0% { transform: rotate(0deg);}
100% { transform: rotate(-360deg);}
}
.lt-ie10 #lazyload-indicator{
padding-top: 0;
}
.lt-ie10 .ll-animation{
display: none;
}
/* =============================================================================
Works/Albums/People list
========================================================================== */
.single-album .layout-full #content,
.albums-list-page .layout-full #content,
.works-list-page .layout-full #content{
background-color: transparent;
}
.albums-list-page .pre-content-box,
.works-list-page .pre-content-box{
background-color: #fff;
}
.object-item{
overflow: hidden;
margin: 0;
position: relative; /* fix flash on click in AJAX mode */
}
.people-grid-container .object-item{
cursor: pointer; /* fix for hover on iOS */
}
.variant-overlay .object-item .caption,
.variant-overlay .object-item .cover,
.variant-overlay .object-item .covering-image,
.object-item > a,
.gallery-frame .object-item .caption > a,
.single-album .object-item .caption > a{
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
}
.object-item > a,
.object-item .caption > a{
z-index: 3;
}
.lt-ie10 .variant-overlay .object-item .caption > a{
background: url(images/ie9saver.gif) repeat;
}
.object-item .caption{
padding: 40px;
box-sizing: border-box;
}
.variant-overlay .object-item .cover{
background-color: rgba(0,0,0,0.7);
}
.variant-overlay .object-item.type-video .cover{
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 200 200' width='100px' height='100px'><path transform='rotate(90, 117, 103.291)' d='m43.501953,167.602753l73.499603,-128.624222l73.499359,128.624222l-146.998962,0z' stroke-width='5' stroke='rgb(255,255,255)' fill='none'></path></svg>");
background-repeat: no-repeat;
background-position: 50% 50%;
}
.variant-overlay .object-item .cover,
.variant-overlay .object-item .covering-image{
transition: opacity .35s;
opacity: 0;
}
.object-item .covering-image{
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.9)); /* For Chrome 25 and Safari 6, iOS 6.1, Android 4.3 */
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.9)); /* Standard syntax; must be last */
}
.title-top .object-item .covering-image{
background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.9)); /* For Chrome 25 and Safari 6, iOS 6.1, Android 4.3 */
background-image: linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.9)); /* Standard syntax; must be last */
}
.title-mid .object-item .covering-image{
background-image: radial-gradient(farthest-corner, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 100%);
}
.title-mid.title-left .object-item .covering-image{
background-image: radial-gradient(farthest-corner at 0 50%, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 100%);
}
.title-mid.title-right .object-item .covering-image{
background-image: radial-gradient(farthest-corner at 100% 50%, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 100%);
}
.object-item > img{
display: block;
height: auto;
width: 100%;
}
.object-item .texts_group{
transition: transform .5s, opacity .5s;
}
.variant-overlay .texts_group{
position: absolute;
right: 40px;
left: 40px;
opacity: 0;
}
.cover-no-hover .object-item .cover,
.gradient-no-hover .object-item .covering-image,
.texts-no-hover .object-item .texts_group{
opacity: 1;
}
.cover-no-hover .object-item:hover .cover,
.gradient-no-hover .object-item:hover .covering-image,
.texts-no-hover .object-item:hover .texts_group{
opacity: 0;
}
.cover-hover .object-item:hover .cover,
.gradient-hover .object-item:hover .covering-image,
.texts-hover .object-item:hover .texts_group{
opacity: 1;
}
.title-top .texts_group{
top: 40px;
}
.title-bottom .texts_group{
bottom: 40px;
}
.title-left .texts_group{
text-align: left;
}
.title-center .texts_group{
text-align: center;
}
.title-right .texts_group{
text-align: right;
}
.title-mid .texts_group{
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.center_group{
position: relative;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.object-item h2{
color: #fff;
font-size: 26px;
line-height: 24px;
margin: 0 0 5px 0;
}
/* lock icon */
.object-item h2 span{
padding: 2px 8px;
}
.object-item .subtitle{
opacity: 0.7;
font-size: 10px;
letter-spacing: 2px;
margin-bottom: 10px;
text-transform: uppercase;
font-weight: bold;
}
.cpt-categories{
font-size: 11px;
margin-bottom: 10px;
}
.object-item .cpt-categories{
color: #b0b0b0;
text-transform: uppercase;
}
.object-item .cpt-categories a{
color: #b0b0b0;
}
.object-item .excerpt{
line-height: 20px;
color: #fff;
font-size: 10px;
font-weight: bold;
letter-spacing: 3px;
margin: 10px 0 0;
opacity: 0.6;
text-transform: uppercase;
}
.object-item .people-desc{
font-size: 12px;
font-weight: bold;
line-height: 1.5;
max-height: 100px;
overflow: hidden;
opacity: 0.7;
margin-top: 20px;
}
.object-item .socials{
margin-top: 30px;
}
.variant-overlay .object-item .icon,
.variant-under .object-item .icon{
font-size: 44px;
color: #fff;
text-align: center;
position: absolute;
z-index: 2;
top: 50%;
right: 0;
width: 100%;
opacity: 0;
transition: opacity .3s;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
/* social icons plugin */
.object-item .social{
position: absolute;
top: 40px;
left: 40px;
z-index: 5;
opacity: 0;
transition: transform .5s, opacity .3s;
}
.object-item:hover .social{
opacity: 1;
}
.social a.dot-irecommendthis{
color: #fff; /* need some default color */
line-height: 1;
font-size: 16px;
}
/* cross effect */
.hover-effect-cross .object-item:hover .icon{
opacity: 1;
}
/* drop effect */
.hover-effect-drop .object-item > img{
-webkit-transform: scale(1.05);
-ms-transform: scale(1.05);
transform: scale(1.05);
transition: transform .5s;
}
.hover-effect-drop .object-item:hover > img{
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
/* shift effect */
.hover-effect-shift .object-item > img{
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
transition: transform .5s;
}
.hover-effect-shift .object-item:hover > img{
-webkit-transform: translateX(-5%) scale(1.1);
-ms-transform: translateX(-5%) scale(1.1);
transform: translateX(-5%) scale(1.1);
}
/* pop text effect */
.hover-effect-pop .object-item .texts_group{
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
.hover-effect-pop .object-item:hover .texts_group {
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
/* border effect */
.variant-overlay.hover-effect-border .object-item .caption{
border: 0 solid #fff;
transition: border-width .5s;
}
.variant-overlay.hover-effect-border .object-item:hover .caption{
border-width: 25px;
}
.variant-under.hover-effect-border .object-item > a{
border: 0 solid #fff;
box-sizing: border-box;
transition: border-width .5s;
}
.variant-under.hover-effect-border .object-item:hover > a{
border-width: 25px;
}
/* scale down effect */
.hover-effect-scale-down .object-item{
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
transition: transform .5s;
}
.hover-effect-scale-down .object-item:hover{
-webkit-transform: scale(0.95);
-ms-transform: scale(0.95);
transform: scale(0.95);
}
.variant-under .caption{
background-color: #fff;
}
.variant-under .object-item h2,
.variant-under .object-item .excerpt{
color: #141414;
}
/* =============================================================================
Category filter
========================================================================== */
.category-filter{
background-color: #fff;
text-align: center;
}
.category-filter,
.real-content .category-filter{/* when used in shortcode */
list-style-type: none;
margin: 0;
padding: 40px;
}
.category-filter li{
display: inline-block;
}
.category-filter a{
display: block;
line-height: 1.8em;
font-size: 14px;
color: #aaa;
text-transform: uppercase;
text-decoration: none;
font-weight: bold;
margin: 0 10px;
cursor: pointer;
}
.category-filter .selected a,
.category-filter a:hover{
color: #000;
text-decoration: none;
}
/* =============================================================================
Sidebar filter
========================================================================== */
.widget_filter li{
margin: 0 -40px;
}
.widget_filter li a{
display: block;
line-height: 17px;
font-size: 10px;
font-weight: bold;
color: #aaa;
text-transform: uppercase;
text-decoration: none;
padding: 0 40px;
}
.widget_filter .selected a,
.widget_filter a:hover{
background-color: #000;
color: #fff;
text-decoration: none;
}
.widget_filter li i{
margin-left: 7px;
}
.widget_filter li.selected i::before{
content: "\f14a";
}
/* ==========================================================================
Single albums
========================================================================== */
.js #gallery-media-collection{
margin: 0;
padding: 0;
list-style: none;
}
.loadingSpace,
#loadingSpace{
clip: rect(1px, 1px, 1px, 1px);
height: 1px;
overflow: hidden;
position: absolute !important;
bottom: 0;
width: 100%;
z-index: -5;
}
.gallery-frame .object-item,
.single-album .object-item,
.single-work .object-item{
cursor: pointer;
}
.gallery-frame iframe,
.loadingSpace iframe,
.single-album iframe{
border: none;
display: block;
margin: 0 auto;
max-width: 100%;
/* ratio 16:9 */
width: 480px;
height: 270px;
}
.gallery-frame,
.single-album .bricks-frame{
position: relative;
}
.single-album .album-content,
.single-album .formatter{
background-color: #fff;
}
.custom-password-page.single-album .album-content,
.custom-password-page.single-album .formatter{
background-color: transparent;
}
.album-content{
width: 460px;
position: absolute;
top: 0;
left: 0;
height: 100%;
transition: right .5s;
}
.album-content-on-the-right .album-content{
left: auto;
right: 0;
}
.album-content .inside{
padding: 60px;
}
.albums-nav{
margin: -10px -10px 40px 0;
}
.albums-nav a{
font-size: 14px;
line-height: 30px;
width: 30px;
text-align: center;
display: inline-block;
}
.albums-nav a.to-cpt-list{
padding: 0 10px;
}
.custom-fields a,
.meta-data .cpt-categories a{
text-decoration: underline;
}
.real-content .cpt-categories,
.meta-data .cpt-categories{
margin: 20px 0;
}
/* meta data */
.meta-data{
margin-top: 25px;
font-size: 12px;
}
.custom-fields span{
display: block;
margin-bottom: 20px;
line-height: 1.6;
word-wrap: break-word;
}
.custom-fields em{
font-weight: bold;
text-transform: uppercase;
display: block;
font-style: normal;
}
/* share buttons */
.real-content .addtoany_share_save_container,
.meta-data .addtoany_share_save_container{
margin-top: 35px;
}
/* bricks */
.object-item .center_group h2{
text-align: center;
font-size: 14px;
}
.object-item .center_group .excerpt{
text-align: center;
}
/* proofing */
.object-item .proofing{
position: absolute;
top: 20px;
left: 20px;
z-index: 3;/* above .object-item .icon */
}
.object-item .proofing .p-id,
.object-item .proofing i{
display: inline-block;
vertical-align: top;
padding: 0 7px;
line-height: 50px;
min-width: 36px;
background-color: rgba(0,0,0,0.6);
-webkit-border-radius: 25px;
border-radius: 25px;
color: #fff;
cursor: text;
text-align: center;
transition: background-color 0.5s;
}
.object-item .proofing i:hover{
background-color: rgba(0,0,0,0.9);
}
.object-item .proofing .p-id:hover{
background-color: #000;
}
.object-item .proofing i{
position: relative;
cursor: pointer;
font-size: 20px;
width: 50px;
padding: 0;
}
.object-item .proofing i.p-comment{
right: 5px;
}
.object-item .proofing i.filled,
.object-item .proofing i.filled:hover{
background-color: #20C063;
}
.object-item .proofing i.filled.p-check{
box-shadow: 0 0 3px rgba(0,0,0,0.5);
}
.object-item .proofing textarea{
position: absolute;
top: 100%;
left: 0;
width: 250px;
height: 80px;
background-color: #fff;
transition: opacity 0.3s;
}
.object-item .proofing textarea[readonly]{
opacity: .8;
}
/* finish proofing button */
#done-with-proofing{
position: fixed;
z-index: 100;
bottom: 50px;
right: 50%;
-webkit-transform: translateX(50%);
-ms-transform: translateX(50%);
transform: translateX(50%);
display: block;
height: 50px;
background-color: rgba(0,0,0,0.6);
box-shadow: 0 0 3px rgba(0,0,0,0.5);
overflow: hidden;
visibility: visible;
opacity: 1;
cursor: pointer;
-webkit-border-radius: 25px;
border-radius: 25px;
transition: opacity 0.3s, background-color 0.5s;
}
#done-with-proofing.idle{
opacity: 0;
visibility: hidden;
transition: opacity 0.3s, background-color 0.5s, visibility 0s 0.9s;
}
#done-with-proofing:hover,
#done-with-proofing.done{
background-color: #20C063;
}
#done-with-proofing div{
position: relative;
top: 0;
opacity: 1;
height: 50px;
padding: 0 40px;
min-width: 30px;
color: #fff;
font-size: 20px;
white-space: nowrap;
line-height: 50px;
text-align: center;
transition: top .3s, opacity .3s;
}
#done-with-proofing.loading,
.object-item .proofing i.loading{
cursor: wait;
transition: none;
-webkit-animation: proof-blink 2s infinite;
animation: proof-blink 2s infinite;
}
#done-with-proofing.loading div{
top: -100%
}
#done-with-proofing.done div{
top: -200%
}
#done-with-proofing.done .not-done{
top: -100%
}
#done-with-proofing.loading .done,
#done-with-proofing.loading .not-done,
#done-with-proofing .done,
#done-with-proofing .loading,
#done-with-proofing.done .not-done{
opacity: 0;
}
#done-with-proofing.loading .loading,
#done-with-proofing.done .done{
opacity: 1;
}
@-webkit-keyframes proof-blink{
0% { background-color: #20C063; }
50% { background-color: rgba(0,0,0,0.6); }
100% { background-color: #20C063; }
}
@keyframes proof-blink{
0% { background-color: #20C063; }
50% { background-color: rgba(0,0,0,0.6); }
100% { background-color: #20C063; }
}
/* ==========================================================================
Works/Albums Navigation
========================================================================== */
.cpt-nav{
background-color: #FAFAFA;
height: 110px;
position: relative;
}
.cpt-nav a{
color: #7A7A7A;
font-size: 12px;
font-weight: bold;
text-transform: uppercase;
text-align: center;
position: absolute;
top: 0;
right: 0;
line-height: 110px;
min-width: 33.33%;
transition: color .5s;
}
.cpt-nav a:hover{
color: #000;
}
.cpt-nav .to-cpt-list{
right: 33.33%;
font-size: 14px;
}
.cpt-nav a[rel="prev"]{
right: 66.66%;
}
.layout-full_fixed .cpt-nav::before,
.layout-full_fixed .cpt-nav::after{
content: "";
position: absolute;
background-color: #FAFAFA;
width: 3000px;
top: 0;
bottom: 0;
right: 100%;
}
.layout-full_fixed .cpt-nav::after{
left: 100%;
right: auto;
}
/* ==========================================================================
Single work
========================================================================== */
.with-meta-fields .inside{
float: left;
width: calc(100% - 250px);
}
.work-content .meta-data{
float: right;
width: 210px;
margin-top: 0;
}
/* similar works */
.similar-works{
margin-top: 50px;
}
.similar-works-frame{
margin-right: -10px;
margin-bottom: 80px;
}
.similar-works .object-item{
width: calc(33.3333333% - 10px);
margin: 10px 10px 0 0;
}
.similar-works h3{
text-align: center;
margin: 0 0 25px;
font-size: 14px;
color: #222;
}
/* =============================================================================
Post lightbox
========================================================================== */
.a13-post-lightbox{
z-index: 123456;
position: fixed;
top: 0;
right: 0;
width: 100%;
height: 100%;
background-color: #ddd;
overflow: auto;
-webkit-overflow-scrolling: touch;
opacity: 0;
visibility: hidden;
transition: opacity 0.3s, visibility 0s 0.3s;
}
.a13-post-lightbox.show{
opacity: 1;
visibility: visible;
transition: opacity 0.6s;
}
.a13-post-lightbox-content{
max-width: 1160px;
width: 100%;
margin: 0 auto;
opacity: 1;
visibility: visible; /* delay cause we wait for preloader to hide */
transition: opacity 0.3s 0.3s, transform 0.3s;
}
.loading .a13-post-lightbox-content{
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(100px) scaleX(0.95);
transform: translateY(100px) scaleX(0.95);
transition: opacity 0.9s, visibility 0s 0.9s, transform 0.9s;
}
.a13-post-lightbox-preloader{
opacity: 0;
visibility: hidden;
position: fixed;
z-index: 2000;
top: 50%;
right: 50%;
margin: -40px -40px 0 0;
width: 80px;
height: 80px;
transition: opacity 0.3s, visibility 0s 0.3s;
}
.loading .a13-post-lightbox-preloader{
opacity: 1;
visibility: visible;
transition: opacity 0.3s;
}
.a13-post-lightbox-preloader::before{
position: absolute;
top: 0;
right: 50%;
display: block;
border: 5px solid transparent;
border-radius: 50%;
content: '';
margin-right: -40px;
width: 70px;
height: 70px;
border-top-color: #000;
border-right-color: #000;
-webkit-animation: a13-post-lightbox-rotation 1.3s linear infinite;
animation: a13-post-lightbox-rotation 1.3s linear infinite;
}
@-webkit-keyframes a13-post-lightbox-rotation {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(-360deg); }
}
@keyframes a13-post-lightbox-rotation {
0% { transform: rotate(0deg); }
100% { transform: rotate(-360deg); }
}
.a13-post-lightbox .controls span{
position: fixed;
top: 0;
left: 0;
background-color: rgba(0,0,0,0.3);
color: #fff;
cursor: pointer;
font-size: 48px;
text-align: center;
line-height: 100px;
height: 100px;
width: 100px;
opacity: 1;
z-index: 15;
transition: background-color 0.5s, opacity 1s;
}
.a13-post-lightbox .controls span.inactive{
pointer-events: none;
opacity: 0.2;
}
.a13-post-lightbox .controls span:hover{
background-color: #000;
}
.a13-post-lightbox .controls .close{
left: 0;
}
.a13-post-lightbox .controls .next{
right: 100px;
}
.a13-post-lightbox .controls .prev{
right: 0;
}
.a13-post-lightbox-content .page-title{
color: #222;
text-align: center;
margin: 100px 0 80px;
}
.a13-post-lightbox-content .subtitle{
color: #888;
font-size: 12px;
letter-spacing: 6px;
margin: -60px 0 60px;
text-align: center;
}
/* =============================================================================
Flickity
========================================================================== */
body.single-album-scroller{
height: 100%;
box-sizing: border-box; /* when slider is below header */
}
body.single-album-scroller.admin-bar{
height: calc(100% - 32px);
}
body.single-album-scroller .whole-layout,
body.single-album-scroller #mid{
height: 100%; /* pushes footer lower on smaller screens */
}
body.single-album-scroller.site-layout-boxed #mid{
height: auto;
}
.a13-scroller-stuff{
position: relative;
padding-top: 56.25%;/* 16:9 */
}
.a13-scroller{
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
}
.scroll-below{
color: #fff;
text-align: center;
line-height: 30px;
white-space: nowrap;
background-color: #20C063;
border: none;
box-shadow: 0 0 3px rgba(0,0,0,0.5);
padding: 10px 20px;
cursor: pointer;
-webkit-border-radius: 3px;
border-radius: 3px;
opacity: 0;
visibility: hidden;
position:absolute;
z-index: 100;
bottom: 20px;
right: 50%;
-webkit-transform: translateX(50%);
-ms-transform: translateX(50%);
transform: translateX(50%);
transition: opacity 3s, visibility 0s 3s;
}
.scroll-below.active,
.scroll-below:hover{
visibility: visible;
opacity: 1;
transition: opacity 0.3s;
}
/* Flickity v2.0.8 https://flickity.metafizzy.co */
.flickity-enabled:focus { outline: none; }
.flickity-viewport {
overflow: hidden;
position: relative;
height: 100%;
}
.flickity-slider {
position: absolute;
width: 100%;
height: 100%;
}
/* draggable */
.flickity-enabled.is-draggable {
-webkit-tap-highlight-color: transparent;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.flickity-enabled.is-draggable .flickity-viewport {
cursor: move;
cursor: -webkit-grab;
cursor: grab;
}
.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
cursor: -webkit-grabbing;
cursor: grabbing;
}
/* ---- previous/next buttons ---- */
.flickity-prev-next-button {
position: absolute;
top: 50%;
width: 44px;
height: 44px;
border: none;
border-radius: 10%;
background: #000;
background: rgba(0, 0, 0, 0.75);
cursor: pointer;
opacity: 1;
/* vertically center */
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
transition: opacity .5s , background-color .5s ;
}
.flickity-prev-next-button:hover { background: #000; }
.flickity-prev-next-button:focus {
outline: none;
box-shadow: 0 0 0 5px #09F;
}
.flickity-prev-next-button:active {
opacity: 0.6;
}
.flickity-prev-next-button.previous { right: 40px; }
.flickity-prev-next-button.next { left: 40px; }
/* right to left */
.flickity-rtl .flickity-prev-next-button.previous {
left: auto;
right: 40px;
}
.flickity-rtl .flickity-prev-next-button.next {
right: auto;
left: 40px;
}
.flickity-prev-next-button:disabled {
opacity: 0.3;
cursor: auto;
}
.flickity-prev-next-button svg {
position: absolute;
right: 20%;
top: 20%;
width: 60%;
height: 60%;
}
.flickity-prev-next-button .arrow {
fill: #fff;
}
/* ---- page dots ---- */
.flickity-page-dots {
position: absolute;
width: 100%;
bottom: 25px;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
line-height: 1;
}
.flickity-rtl .flickity-page-dots {
direction: rtl;
}
.flickity-page-dots .dot {
display: inline-block;
width: 10px;
height: 10px;
margin: 0 8px;
padding: 0 !important;
background: #333;
border: 2px solid #ddd;
border-radius: 50%;
opacity: 0.25;
cursor: pointer;
transition: opacity .5s;
}
.flickity-page-dots .dot:hover {
opacity: .6;
}
.flickity-page-dots .dot.is-selected {
opacity: 1;
}
/* ---- cells ---- */
.carousel-cell {
width: 33%;
height: 100%;
margin-left: 0;
overflow: hidden;
position: relative;
}
.carousel-cell div.img{
background: no-repeat 50% 50% / cover;
height: 100%;
width: auto;
position: relative;
opacity: 0;
transition: opacity .3s;
}
.closed-contain .carousel-cell div.img{
background-size: auto 100%;
}
/*lazy load*/
.carousel-cell div.img.flickity-bg-lazyloaded{
opacity: 1;
}
/* enlarged cell */
.carousel-cell.enlarge{
width: 100% !important;
}
.parallax .carousel-cell.enlarge div.img{
width: 100% !important;
right: 0 !important;
}
.opened-contain .carousel-cell.enlarge div.img{
background-size: contain;
}
.opened-cover .carousel-cell.enlarge div.img{
background-size: cover;
}
/* text content */
.carousel-cell > a{
position: absolute;
width: 100%;
top: 0;
right: 0;
bottom: 0;
}
.carousel-cell .texts_group{
position: absolute;
max-width: 100%;
right: 20px;
bottom: 20px;
padding: 25px;
}
.page-dots .carousel-cell .texts_group{
bottom: 50px;
}
.carousel-cell strong.name{
font-size: 34px;
color: #fff;
letter-spacing: -1px;
display: block;
margin-bottom: 5px;
}
.carousel-cell strong.name:only-child{
margin-bottom: 0;
}
.carousel-cell .texts_group .excerpt{
font-size: 18px;
color: #fff;
}
/* socials */
.carousel-cell .social{
position: absolute;
top: 40px;
left: 40px;
z-index: 5;
opacity: 0;
transition: transform .5s, opacity .3s;
}
.carousel-cell:hover .social{
opacity: 1;
}
/* columns */
/* how to calculate below numbers - still unknown :-( */
.cells_20 .carousel-cell {
width: 20%;
}
.cells_20.parallax .carousel-cell div.img{
width: 232%;
right: -66%;
}
.cells_25 .carousel-cell {
width: 25%;
}
.cells_25.parallax .carousel-cell div.img{
width: 199%;
right: -49.5%;
}
.cells_33 .carousel-cell {
width: 33%;
}
.cells_33.parallax .carousel-cell div.img{
width: 166%;
right: -33%;
}
.cells_50 .carousel-cell {
width: 50%;
}
.cells_50.parallax .carousel-cell div.img{
width: 133%;
right: -16.5%;
}
.cells_66 .carousel-cell {
width: 66%;
}
.cells_66.parallax .carousel-cell div.img{
width: 116.5%;
right: -8.25%;
}
.cells_75 .carousel-cell {
width: 75%;
}
.cells_75.parallax .carousel-cell div.img{
width: 110.8%;
right: -5.4%;
}
.cells_90 .carousel-cell {
width: 90%;
}
.cells_90.parallax .carousel-cell div.img{
width: 103.5%;
right: -1.75%;
}
/* effects*/
.effect-opacity .carousel-cell div.img.flickity-bg-lazyloaded {
opacity: 0.7;
}
.effect-opacity .carousel-cell.is-selected div.img.flickity-bg-lazyloaded {
opacity: 1;
}
.effect-blur .carousel-cell div.img {
-webkit-filter: blur(5px);
filter: blur(5px);
transition: opacity .3s, filter 0.3s;
}
.effect-grayscale .carousel-cell div.img {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
transition: opacity .3s, filter 0.3s;
}
.effect-blur .carousel-cell.is-selected div.img,
.effect-grayscale .carousel-cell.is-selected div.img {
-webkit-filter: none;
filter: none;
}
.effect-scale-down .carousel-cell{
-webkit-transform: scale(0.8);
-ms-transform: scale(0.8);
transform: scale(0.8);
transition: transform 0.3s;
}
.effect-scale-down .carousel-cell.is-selected{
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
/* =============================================================================
A13 slider
========================================================================== */
body.single-album-slider{
height: 100%;
box-sizing: border-box; /* when slider is below header */
}
body.single-album-slider.admin-bar{
height: calc(100% - 32px);
}
body.single-album-slider .whole-layout,
body.single-album-slider #mid{
height: 100%; /* pushes footer lower on smaller screens */
}
body.single-album-slider.site-layout-boxed #mid{
height: auto;
}
.a13-slider{
overflow: hidden;
position: relative;
padding-top: 56.25%;/* 16:9 */
}
.a13-slider:focus{
outline: none!important;
}
.site-layout-boxed .a13-slider{
position: relative;
padding-top: 56.25%;/* 16:9 */
}
.slider-slides{
display: block;
margin: 0!important;
padding: 0;
position: absolute;
right: 0;
width: 100%;
top: 0;
bottom: 0;
opacity: 0;
}
.show-with-slider{
opacity: 0;
}
.slider-slides,
.show-with-slider{
transition: opacity 1s;
}
.show-with-slider.show,
.slider-slides.show{
opacity: 1;
}
.slider-slides img{
border: none;
display: block;
height: auto;
outline: none;
position: relative;
width: auto;
max-width: none !important; /* if any plugins want mess up slider */
}
.slider-slides > li{ /* > prevents style interfering in slide description */
display: block;
list-style: none;
overflow: hidden;
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 100%;
z-index: 0;
padding: 0 !important;
/*visibility: visible!important;*/
}
.slider-slides > li.prevslide{
z-index: 2;
}
.slider-slides > li.activeslide{
z-index: 3;
}
.slider-slides a.slide{
display: block;
height: 100%;
width: 100%;
direction: ltr;
}
.slider-slides li.image-loading {
background: transparent url(images/ajax-loader.gif) no-repeat center center;
height: 100%;
width: 100%;
}
.slider-slides li.image-loading img{
visibility: hidden;
}
.slider-slides li iframe,
.slider-slides div.wp-video{
border: none;
width: 100%;
height: 100%;
position: relative;
}
.slider-slides div.video-poster{
background-size: cover;
background-position: 50% 50%;
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 100%;
z-index: 10;
cursor: pointer;
}
.slider-slides div.video-poster::before{
content: "\e901";
position: absolute;
top: 50%;
right: 50%;
z-index: 11;
margin: -50px -50px 0 0;
width: 150px;
height: 100px;
line-height: 100px;
font-size: 48px;
text-align: center;
background-color: rgba(0, 0, 0, 0.8);
-webkit-border-radius: 6px;
border-radius: 6px;
color: #A7A7A7;
font-family: "a13-icomoon", monospace;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
}
.slider-slides div.mejs-container{
width: 100% !important;
height: 100% !important;
}
/* SLIDER CONTROLS */
.slider-arrow{
position: absolute;
top: 50%;
left: 0;
z-index: 5;
margin-top: -20px;
width: 150px;
line-height: 40px;
font-size: 40px;
text-align: center;
color: #fff;
text-shadow: 0 0 3px rgba(0,0,0,0.5); /* make sure it will be visible on white background */
cursor: pointer;
transition: opacity .5s;
opacity: 0.6;
}
.slider-arrow:hover{
opacity: 1;
}
.next-slide-control{
left: auto;
right: 0;
}
.hide-items .slider-arrow{
opacity: 0;
}
.slider-controls{
position: absolute;
bottom: 40px;
left: 65px;
z-index: 5;
transition: bottom .5s, margin .5s, opacity .5s;
}
.thumbs-open .slider-controls{
bottom: 140px;
}
.hide-items .slider-controls{
opacity: 0;
}
.slider-play-button{
position: relative;
display: inline-block;
vertical-align: top;
width: 42px;
height: 42px;
border: 1px solid rgba(255,255,255,0.5);
-webkit-border-radius: 22px;
border-radius: 22px;
transition: border-color .5s;
margin-left: 30px;
cursor: pointer;
color: #fff;
text-shadow: 0 0 3px rgba(0,0,0,0.5);/* make sure it will be visible on white background */
}
.slider-play-button:hover{
border-color: #fff;
}
.slider-play-button .circle{
position: absolute;
z-index: 2;
top: 50%;
right: 50%;
width: 42px;
height: 42px;
margin: -21px -21px 0 0;
-webkit-border-radius: 22px;
border-radius: 22px;
background-color: rgba(255,255,255,0.2);
}
.slider-play-button::before{
position: absolute;
top: 0;
right: 0;
height: 100%;
width: 100%;
line-height: 42px;
text-align: center;
}
.slider-play-button.play::before{
content: "\e900"; /* when slider is playing we display pause symbol button */
}
span.slides-count{
color: #fff;
display: inline-block;
font-size: 16px;
font-weight: bold;
height: 40px;
line-height: 16px;
min-width: 40px;
position: relative;
}
span.slides-count::after{
content: '';
height: 1px;
width: 57px; /* 40px * sqrt(2)*/
position: absolute;
bottom: 0;
right: 50%;
margin-right: -20px; /* not half of width of this element, but half of height of parent element */
background-color: rgba(255,255,255,0.5);
box-shadow: 0 0 3px rgba(0,0,0,0.5);/* make sure it will be visible on white background */
-webkit-transform-origin: 100% 0;
-ms-transform-origin: 100% 0;
transform-origin: 100% 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
span.slides-count span{
display: block;
height: 20px;
text-align: right;
text-shadow: 0 0 3px rgba(0,0,0,0.5); /* make sure it will be visible on white background */
}
span.slides-count span.num{
padding-left: calc(50% + 5px);
text-align: left; /* so it will be always close to divider line */
}
span.slides-count span.of{
padding-right: calc(50% + 5px);
padding-top: 4px;
height: 16px;
}
/* SLIDE DESCRIPTION */
.slide-caption{
overflow: hidden;
color: #B9B9B9;
font-size: 13px;
line-height: 20px;
max-width: 45%;
position: absolute;
bottom: 40px;
right: 65px;
z-index: 30;
transition: bottom .5s, margin .5s;
}
.thumbs-open .slide-caption{
bottom: 140px;
}
.slide-caption h2.title{
color: #fff;
font-size: 22px;
line-height: 24px;
letter-spacing: -1px;
margin: 0;
}
.slide-caption h2.title span{
padding: 15px;
display: inline-block;
}
.slide-caption.with-description h2.title span{
padding-bottom: 0;
}
.slide-caption .description{
margin-top: 20px;
}
.slide-caption.with-color .description{
padding: 15px;
margin-top: 0;
max-height: 200px;
overflow: auto;
}
.slide-caption.with-color .description .addtoany_list a > span {
vertical-align: top;
}
.texts-opener{
display: none;
width: 42px;
height: 42px;
margin-top: 30px; /* space from text that will show up */
border: 1px solid rgba(255,255,255,0.5);
color: #fff;
font-family: Georgia,sans-serif;
font-weight: bold;
text-align: center;
line-height: 40px;
font-size: 20px;
cursor: pointer;
-webkit-border-radius: 22px;
border-radius: 22px;
transition: border-color .5s;
}
.texts-opener:hover,
.texts-opener.open{
border-color: #fff;
}
.slider-play-animation {
height: 100px;
width: 100px;
margin: -50px -50px 0 0;
position: absolute;
pointer-events: none;
z-index: 5;
top: 50%;
right: 50%;
}
.slider-play-animation svg{
height: 100%;
width: 100%;
}
/* Thumbnail Tray */
.thumb-tray-button{
display: inline-block;
vertical-align: top;
width: 42px;
height: 42px;
margin-left: 30px;
border: 1px solid rgba(255,255,255,0.5);
color: #fff;
text-shadow: 0 0 3px rgba(0,0,0,0.5);/* make sure it will be visible on white background */
text-align: center;
line-height: 42px !important;
font-size: 14px;
cursor: pointer;
-webkit-border-radius: 22px;
border-radius: 22px;
transition: border-color .5s;
}
.thumb-tray-button:hover,
.thumb-tray-button.active{
border-color: #fff;
}
.slider-thumb-tray{
height: 100px;
overflow: hidden;
position: absolute;
bottom: -100px;
right: 0;
width: 100%;
z-index: 40;
transition: bottom .5s;
}
.thumbs-open .slider-thumb-tray{
bottom: 0;
}
.slider-thumb-tray .inner{
height: 100px;
position: absolute;
width: 100%;
top: 15px;
transition: top .3s;
}
.slider-thumb-list{
display: block;
list-style: none;
height: 100%;
margin: 0 !important;
padding: 0 !important;
position: absolute;
left: 0;
}
.slider-thumb-tray li{
cursor: pointer;
float: left;
height: 100%;
overflow: hidden;
width: 150px;
position: relative;
}
.slider-thumb-tray.cursor-grab li,
.slider-thumb-tray.cursor-grabbing li{
cursor: inherit;
}
.slider-thumb-list li.current-thumb,
.slider-thumb-list li:hover{
-webkit-transform: translate(0, -15px);
transform: translate(0, -15px);
}
.slider-thumb-list li div{
height: 100%;
width: 100%;
-webkit-transform: translate(-50%, 50%);
transform: translate(-50%, 50%);
}
.slider-thumb-list img{
-webkit-transform: translate(50%, -50%);
transform: translate(50%, -50%);
min-height: 100%;
min-width: 100%;
}
.slider-thumb-list li::before{
content: "";
background-color: rgba(0,0,0,0.3);
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
opacity: 1;
z-index: 10;
}
.slider-thumb-list li.current-thumb::before,
.slider-thumb-list li:hover::before{
opacity: 0;
}
.slider-thumb-list li.video::after{
content: "\e901";
position: absolute;
top: 10px;
left: 10px;
z-index: 11;
width: 40px;
height: 30px;
line-height: 30px;
font-size: 16px;
text-align: center;
background-color: rgba(0, 0, 0, 0.8);
-webkit-border-radius: 6px;
border-radius: 6px;
color: #A7A7A7;
font-family: "a13-icomoon", monospace;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
}
/* Gradient */
.a13-slider.gradient a.slide::after{
content: '';
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
z-index: 10;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.8+100 */
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.8) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.8) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
/* PATTERNS */
.a13-slider.pattern a.slide::before{
content: '';
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
z-index: 20;
background: transparent url(images/overlays/pattern.png) 100% 0 repeat;
}
.a13-slider.pattern-2 a.slide::before{
background-image: url(images/overlays/pattern2.png);
}
.a13-slider.pattern-3 a.slide::before{
background-image: url(images/overlays/pattern3.png);
}
.a13-slider.pattern-4 a.slide::before{
background-image: url(images/overlays/pattern4.png);
}
.a13-slider.pattern-5 a.slide::before{
background-image: url(images/overlays/pattern5.png);
}
/* ==========================================================================
A13 sticky one page
========================================================================== */
/*!
* fullPage 2.7.9
* https://github.com/alvarotrigo/fullPage.js
* MIT licensed
*
* Copyright (C) 2013 alvarotrigo.com - A project by Alvaro Trigo
*/
html.fp-enabled,
.fp-enabled body {
margin: 0;
padding: 0;
overflow:hidden;
/*Avoid flicker on slides transitions for mobile phones #336 */
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
#superContainer {
height: 100%;
position: relative;
/* Touch detection for Windows 8 */
-ms-touch-action: none;
/* IE 11 on Windows Phone 8.1*/
touch-action: none;
}
.fp-section {
position: relative;
/* Safari<=5 Android<=3 */
box-sizing: border-box;
}
.fp-slide {
float: right;
}
.fp-slide, .fp-slidesContainer {
height: 100%;
display: block;
}
.fp-slides {
z-index:1;
height: 100%;
overflow: hidden;
position: relative; /* Safari<=6 Android<=4.3 */
transition: all .3s ease-out;
}
.fp-section.fp-table, .fp-slide.fp-table {
display: table;
table-layout:fixed;
width: 100%;
}
.fp-tableCell {
display: table-cell;
vertical-align: middle;
width: 100%;
height: 100%;
}
.fp-slidesContainer {
float: right;
position: relative;
}
.fp-controlArrow {
-webkit-user-select: none; /* webkit (safari, chrome) browsers */
-moz-user-select: none; /* mozilla browsers */
-khtml-user-select: none; /* webkit (konqueror) browsers */
-ms-user-select: none; /* IE10+ */
position: absolute;
z-index: 4;
top: 50%;
cursor: pointer;
width: 0;
height: 0;
border-style: solid;
margin-top: -38px;
-webkit-transform: translate3d(0,0,0);
-ms-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
.fp-controlArrow.fp-prev {
right: 15px;
width: 0;
border-width: 39px 0 39px 34px;
border-color: transparent transparent transparent #fff;
}
.fp-controlArrow.fp-next {
left: 15px;
border-width: 39px 34px 39px 0;
border-color: transparent #fff transparent transparent;
}
.fp-scrollable {
overflow: scroll;
}
.fp-notransition {
transition: none !important;
}
#fp-nav {
position: fixed;
z-index: 100;
margin-top: -32px;
top: 50%;
opacity: 1;
-webkit-transform: translate3d(0,0,0);
}
#fp-nav.right{
right: 17px;
}
#fp-nav.left{
left: 17px;
}
.fp-slidesNav{
position: absolute;
z-index: 4;
right: 50%;
opacity: 1;
}
.fp-slidesNav.bottom {
bottom: 17px;
}
.fp-slidesNav.top {
top: 17px;
}
#fp-nav ul{
display:none;
}
#fp-nav ul,
.fp-slidesNav ul {
margin: 0;
padding: 0;
}
#fp-nav ul li,
.fp-slidesNav ul li {
display: block;
width: 14px;
height: 20px;
margin: 7px;
position:relative;
}
.fp-slidesNav ul li {
display: inline-block;
}
#fp-nav ul li a,
.fp-slidesNav ul li a {
display: block;
position: relative;
z-index: 1;
width: 100%;
height: 100%;
cursor: pointer;
text-decoration: none;
}
#fp-nav ul li a.active:not(.custom) span,
.fp-slidesNav ul li a.active:not(.custom) span,
#fp-nav ul li:hover a.active:not(.custom) span,
.fp-slidesNav ul li:hover a.active:not(.custom) span{
height: 12px;
width: 12px;
margin: -6px -6px 0 0;
border-radius: 100%;
}
#fp-nav ul li a:not(.custom) span,
.fp-slidesNav ul li a span {
border-radius: 50%;
position: absolute;
z-index: 1;
height: 4px;
width: 4px;
border: 0;
background: #333;
right: 50%;
top: 50%;
margin: -2px -2px 0 0;
transition: all .1s ease-in-out;
}
#fp-nav ul li a.custom span{
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
font-size: 20px;
height: 20px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
position: relative;
top: -5px;
}
#fp-nav ul li:hover a.custom span,
#fp-nav ul li a.custom.active span{
font-size: 28px;
}
#fp-nav ul li a span {
transition: all .1s ease-in-out;
}
#fp-nav ul li:hover a:not(.custom) span,
.fp-slidesNav ul li:hover a:not(.custom) span{
width: 10px;
height: 10px;
margin: -5px -5px 0 0;
}
#fp-nav ul li .fp-tooltip {
position: absolute;
top: -2px;
color: #fff;
font-size: 14px;
font-family: arial, helvetica, sans-serif;
white-space: nowrap;
max-width: 220px;
overflow: hidden;
display: block;
opacity: 0;
width: 0;
cursor: pointer;
}
#fp-nav ul li:hover .fp-tooltip,
#fp-nav.fp-show-active a.active + .fp-tooltip {
transition: opacity .2s ease-in;
width: auto;
opacity: 1;
}
#fp-nav ul li .fp-tooltip.right {
right: 25px;
}
#fp-nav ul li .fp-tooltip.left{
left: 20px;
}
.fp-auto-height.fp-section,
.fp-auto-height .fp-slide,
.fp-auto-height .fp-tableCell{
height: auto !important;
}
/* ==========================================================================
Things added to fullpage.js and overwrites
========================================================================== */
/* overwrites */
#fp-nav ul li{
color: #fff;
}
#fp-nav ul li a,
#fp-nav ul li .fp-tooltip{
color: inherit;
}
/* different position for default and custom bullet */
#fp-nav ul li .fp-tooltip{
top: 0;
}
#fp-nav ul li a.custom + .fp-tooltip{
top: -2px;
}
/* /overwrites */
/* additional styling */
.a13-sticky-one-page .formatter{
padding: 0;
}
.a13-sticky-one-page .vc_row:not(.vc_inner){
margin-right: 0;
margin-left: 0;
}
body.a13-body-sticky-one-page.admin-bar .whole-layout{
margin-top: 0;
}
body.a13-body-sticky-one-page #header{
position: absolute;
}
body.a13-body-sticky-one-page .content-limiter{
max-width: 100%;
}
/* move fp-nav according to current layout */
.site-layout-bordered #fp-nav{
right: 47px;
}
.no-border-right #fp-nav{
right: 17px;
}
.header-side-right.header-vertical #fp-nav,
.site-layout-bordered.no-border-right.header-side-right.header-vertical #fp-nav{
right: 297px;
}
.site-layout-bordered.header-side-right.header-vertical #fp-nav{
right: 327px;
}
/* ==========================================================================
Image carousel tweak
========================================================================== */
.owl-carousel .owl-item .vc_item .vc_inner img{
display: table;
margin: 0 auto;
max-width: 100%;
width: auto;
}
/* ==========================================================================
Typed js effect
========================================================================== */
.a13-to-type .sentences-to-type{
display: none;
}
.a13-to-type.disabled-writing .sentences-to-type,
.no-js .a13-to-type .sentences-to-type{
display: block;
}
.a13-to-type.disabled-writing .sentences-to-type span,
.no-js .a13-to-type .sentences-to-type span{
display: block;/* separate lines */
}
.typed-cursor{
opacity: 1;
-webkit-animation: blink 0.7s infinite;
animation: blink 0.7s infinite;
}
@keyframes blink{
0% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
@-webkit-keyframes blink{
0% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
/* ==========================================================================
Visual Composer - various things
========================================================================== */
/* filter in post grid */
.vc_grid-filter {
font-weight: bold;
color: rgba(187, 187, 187, 1);
margin-bottom: 40px;
text-transform: uppercase;
}
/* buttons */
.vc_btn3.vc_btn3-size-xs {
font-size: 11px;
padding: 8px 24px 7px;
}
.vc_general.vc_btn3 {
font-weight:bold;
}
/* ==========================================================================
Visual Composer extend
========================================================================== */
.a13_gitem_team_member1 .vc_grid-item-mini,
.a13_gitem_team_member2 .vc_grid-item-mini{
position: relative;
}
.a13_gitem_team_member1.center,
.a13_gitem_team_member2.center{
text-align: center;
}
.a13_gitem_team_member1.left,
.a13_gitem_team_member2.left{
text-align: left;
}
.team_grid_item_top_panel {
text-transform: uppercase;
font-weight: bold;
}
.team_grid_item_top_panel,
.team_grid_item_bottom_panel{
height: 50%;
font-weight: bold;
position: relative;
}
.team_grid_item_content_box > div div{
width: 100%;
}
.a13_gitem_team_member1.variant2 .team_grid_item_bottom_panel {
padding: 30px;
top: 35%;
}
.a13_gitem_team_member1 .vc_is-hover .title_block_fade_out {
display: none;
}
.gitem_full_height_zone .vc_gitem-row-position-middle,
.gitem_full_height_zone .team_grid_item_content_box,
.gitem_full_height_zone .vc_gitem-col{
height: 100%;
}
.gitem_full_height_zone .vc_gitem-col{
padding:0;
}
.a13_gitem_team_member1 .vc_gitem-zone-b,
.a13_gitem_team_member2 .vc_gitem-zone-b{
transition: all .3s 0s !important;
}
.grid_item_subtitle {
opacity: 0.7;
position: relative;
top: 68%;
font-size: 10px;
letter-spacing: 2px;
}
.grid_item_title {
font-size: 19px;
position: relative;
top: 70%;
}
.grid_item_content {
display: block;
font-size: 12px;
line-height: 1.5;
max-height: 100px;
overflow: hidden;
opacity: 0.7;
}
.grid_item_socials {
position: relative;
top: 30px;
}
.a13_gitem_team_member2.variant2 .team_grid_item_bottom_panel {
top: 43%;
}
.a13_gitem_team_member2.variant2 .vc_gitem-zone-c {
background-color: #fff;
color: #171717;
text-transform: uppercase;
}
.a13_gitem_team_member2.variant2 .vc_gitem-zone-c .vc_gitem-post-meta-field-_subtitle {
opacity: 0.6;
}
.a13_gitem_team_member2.variant2 .vc_gitem-zone-c h4 {
text-transform: uppercase;
}
.a13_gitem_team_member1 .vc_gitem-zone-a::before {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.9));
content: "";
display: block;
height: 100%;
width: 100%;
}
.a13_gitem_team_member1 .vc_gitem-zone-a .team_grid_item_content_box {
background-color: transparent !important;
}
.team_grid_item_content_box {
padding: 30px;
}
.a13_gitem_team_member1 .vc_gitem-zone-a .team_grid_item_content_box {
padding: 10px;
}
/* CountDown shortcode*/
.a13_count_down {
display: table;
margin: 0 auto;
}
.a13_count_down.simple {
align-items: center;
display: flex;
justify-content: center;
}
.a13_count_down.simple .block {
display: flex;
flex-wrap: wrap;
justify-content: center;
width: 100px;
}
.a13_count_down.simple .label {
font-size: 14px;
position: relative;
text-align: center;
text-transform: uppercase;
top: -10px;
width: 100%;
}
.a13_count_down.simple .value {
text-align: center;
width: 100%;
font-size: 50px;
font-weight: 700;
}
.a13_count_down .countdown-container {
height: 130px;
}
.a13_count_down .time {
border-radius: 5px;
box-shadow: 0 0 10px 0 rgba(0,0,0,0.5);
display: inline-block;
text-align: center;
position: relative;
height: 95px;
width: 65px;
-webkit-perspective: 479px;
perspective: 479px;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform: translate3d(0,0,0);
-ms-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
.a13_count_down .count {
background: #202020;
color: #f8f8f8;
display: block;
font-family: 'Oswald', sans-serif;
font-size: 40px;
line-height: 95px;
overflow: hidden;
position: absolute;
text-align: center;
text-shadow: 0 0 10px rgba(0, 0, 0, 0.8);
top: 0;
width: 100%;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
-webkit-transform-style: flat;
transform-style: flat;
}
.a13_count_down .count.top {
border-top: 1px solid rgba(255,255,255,0.2);
border-bottom: 1px solid rgba(255,255,255,0.1);
border-radius: 5px 5px 0 0;
height: 50%;
-webkit-transform-origin: 50% 100%;
-ms-transform-origin: 50% 100%;
transform-origin: 50% 100%;
}
.a13_count_down .count.bottom {
background-image: -webkit-linear-gradient(rgba(255,255,255,0.1), transparent);
background-image: linear-gradient(rgba(255,255,255,0.1), transparent);
border-top: 1px solid #000;
border-bottom: 1px solid #000;
border-radius: 0 0 5px 5px;
line-height: 0;
height: 50%;
top: 50%;
-webkit-transform-origin: 50% 0;
-ms-transform-origin: 50% 0;
transform-origin: 50% 0;
}
.a13_count_down .count.next {
}
.a13_count_down.flipping .label {
display: flex;
font-size: 20px;
justify-content: center;
margin-top: 5px;
position: relative;
top: 95px;
width: 100%;
}
/* Animation start */
.a13_count_down .count.curr.top {
-webkit-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
transform: rotateX(0deg);
z-index: 3;
}
.a13_count_down .count.next.bottom {
-webkit-transform: rotateX(90deg);
-ms-transform: rotateX(90deg);
transform: rotateX(90deg);
z-index: 2;
}
/* Animation end */
.a13_count_down .flip .count.curr.top {
transition: all 250ms ease-in-out;
-webkit-transform: rotateX(-90deg);
-ms-transform: rotateX(-90deg);
transform: rotateX(-90deg);
}
.a13_count_down .flip .count.next.bottom {
transition: all 250ms ease-in-out 250ms;
-webkit-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
transform: rotateX(0deg);
}
/* ==========================================================================
Counter shortcode
========================================================================== */
.a13_counter{
text-align: center;
}
.a13_counter .number{
display: block;
letter-spacing: -2px;
}
.a13_counter .finish-text{
visibility: hidden;
margin-top: 15px;
position: relative;
}
/* ==========================================================================
Visual Composer progress bar shortcode tweak
========================================================================== */
.vc_progress_bar .vc_single_bar {
border-radius: 0;
box-shadow: none;
height: 5px;
margin-bottom: 40px;
}
.vc_progress_bar .vc_bar {
border-radius: 0 !important;
}
.vc_progress_bar .vc_label {
top: -30px;
}
.vc_progress_bar .vc_label_units {
right: 0;
margin-right: -20px;
opacity: 0;
position: absolute;
transition: opacity .3s linear 0s, right 1s linear 0s;
}
.vc_progress_bar .vc_general.vc_single_bar .vc_label {
color: #222222;
padding: 0.5em 0;
text-shadow: none !important;
}
/* ==========================================================================
Visual Composer tab shortcode tweak
========================================================================== */
.vc_tta-style-a13_framework_tabs .vc_tta-tab > a {
align-items: center;
color: #dadada !important;
display: flex !important;
flex-wrap: wrap !important;
justify-content: center;
}
.vc_tta-style-a13_framework_tabs .vc_tta-tab > a > * {
text-transform: uppercase;
width: 100%;
}
.vc_tta-style-a13_framework_tabs .vc_tta-tab > a > i {
font-size: 40px !important;
margin: 20px 0 !important;
}
.vc_tta-style-a13_framework_tabs .vc_tta-tab > a > span {
font-size: 14px !important;
letter-spacing: 4px;
margin: 20px 0 0 !important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-blue .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-blue .vc_tta-tab:hover > a{
color: #5472D2!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-turquoise .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-turquoise .vc_tta-tab:hover > a{
color: #00C1CF!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-pink .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-pink .vc_tta-tab:hover > a{
color: #FE6C61!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-violet .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-violet .vc_tta-tab:hover > a{
color: #8D6DC4!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-peacoc .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-peacoc .vc_tta-tab:hover > a{
color: #4CADC9!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-chino .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-chino .vc_tta-tab:hover > a{
color: #CEC2AB!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-mulled-wine .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-mulled_wine .vc_tta-tab:hover > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-mulled-wine .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-mulled_wine .vc_tta-tab:hover > a{
color: #50485B!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-vista-blue .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-vista_blue .vc_tta-tab:hover > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-vista-blue .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-vista_blue .vc_tta-tab:hover > a {
color: #75D69C!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-black .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-black .vc_tta-tab:hover > a{
color: #2A2A2A!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-grey .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-grey .vc_tta-tab:hover > a{
color: #EBEBEB!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-orange .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-orange .vc_tta-tab:hover > a{
color: #F7BE68!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-sky .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-sky .vc_tta-tab:hover > a{
color: #5AA1E3!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-green .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-green .vc_tta-tab:hover > a{
color: #6DAB3C!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-juicy-pink .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-juicy_pink .vc_tta-tab:hover > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-juicy-pink .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-juicy_pink .vc_tta-tab:hover > a {
color: #F4524D!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-sandy-brown .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-sandy_brown .vc_tta-tab:hover > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-sandy-brown .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-sandy_brown .vc_tta-tab:hover > a {
color: #F79468!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-purple .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-purple .vc_tta-tab:hover > a{
color: #B97EBB!important;
}
.vc_tta-style-a13_framework_tabs.vc_tta-color-white .vc_tta-tab.vc_active > a,
.vc_tta-style-a13_framework_tabs.vc_tta-color-white .vc_tta-tab:hover > a{
color: #FFF!important;
}
/* ==========================================================================
Post grid variants
========================================================================== */
.a13_post_grid_center{
text-align: center;
}
.a13_post_grid_left .vc_gitem-zone-c{
margin: -10px;
}
.a13_post_grid_left .a13_post_meta_data{
margin: 10px 0;
}
.a13_post_grid_full_row .vc_gitem-animated-block {
width: 35%;
}
.a13_post_grid_full_row .vc_gitem-zone.vc_gitem-zone-c {
width: 62%;
}
.a13_post_grid_simple_row,
.a13_post_grid_simple_row2{
text-align: center;
}
.a13_post_grid_simple_row2{
border-top: 1px solid #F1F1F1;
border-bottom: 1px solid #F1F1F1;
margin-top: -1px;
}
/* ==========================================================================
Testimonial shortcode
========================================================================== */
.a13_gitem_testimonial1 {
display: table !important;
margin: 0 auto;
}
.a13_gitem_testimonial1 .vc_gitem-zone-a{
border-radius: 70px;
margin: 0 auto;
width: 140px;
}
.a13_gitem_testimonial1 .fa {
display: table;
font-size: 25px;
margin: 0 auto;
opacity: 0.2;
}
.vc_gitem-post-meta-field-_testimonial {
font-size: 16px;
line-height: 1.3;
margin-bottom: 25px;
}
.a13_testimonial_signature {
font-size: 13px;
font-weight: bold;
letter-spacing: 1px;
margin-top: 25px;
color: #333;
text-align: center;
text-transform: uppercase;
}
/* ==========================================================================
Grid element for posts
========================================================================== */
.post_theme_options.vc_gitem-zone-a .vc_gitem-row-position-top{
position: static;
}
.post_theme_options.vc-gitem-zone-height-mode-auto::before{
padding-top: 0;
}
/* ==========================================================================
Grid element for products
========================================================================== */
.product_theme_options.vc_gitem-zone-a .vc_gitem-row-position-top{
position: static;
}
.product_theme_options.vc-gitem-zone-height-mode-auto::before{
display: none;
}
.product_theme_options .vc_gitem-link{
display: none;
}
.product_theme_options .woocommerce ul.products{
margin: 0;
}
.product_theme_options .woocommerce ul.products li.product{
float: none !important;/* 1 item per container */
margin: 0;
padding: 0;
position: relative;
width: auto;
}
/* ==========================================================================
Grid element for works & albums
========================================================================== */
/* take full width of grid element */
.album_theme_options .object-item,
.work_theme_options .object-item{
float: none;
}
/* remove strange VC padding */
.album_theme_options .vc_gitem_row .vc_gitem-col,
.work_theme_options .vc_gitem_row .vc_gitem-col{
padding: 0;
}
/* size Original */
.album_theme_options .vc_gitem_row,
.work_theme_options .vc_gitem_row{
position: static;
}
/* ==========================================================================
Main demo fly out
========================================================================== */
.flyout-box{
box-shadow: 0 0 12px rgba(0, 0, 0, 0.09);
width: 170px;
position: fixed;
z-index: 2222;
top: 43%;
left: -170px;
-webkit-border-radius: 0 0 5px 0;
border-radius: 0 0 5px 0;
transition: left .5s;
}
.flyout-box.open{
left: 0;
}
.flyout-box .links{
text-align: center;
background: #fff;
padding: 10px;
min-height: 20px;
position: relative;
z-index: 1;
-webkit-border-radius: 0 0 5px 0;
border-radius: 0 0 5px 0;
}
.demo-flyout.flyout-box .links{
background: #fff url(images/apollo13.png) 50% 20px no-repeat;
padding-top: 54px;
}
.demo-flyout.flyout-box .links::before{
content: "";
display: block;
background-color: #E5E5E5;
width: 50px;
height: 1px;
margin: 0 auto 10px;
}
.flyout-box a{
display: block;
color: #858585;
font-weight: bold;
line-height: 2em;
letter-spacing: 0;
font-size: 12px;
margin-bottom: 4px;
transition: color .3s;
}
.flyout-box a.buy{
color: #E82626;
}
.flyout-box a:hover{
text-decoration: underline;
color: #000;
}
.flyout-box .drag-out{
position: absolute;
top: 0;
right: -35px;
width: 35px;
height: 35px;
background-color: #fff;
box-shadow: 0 0 12px rgba(0, 0, 0, 0.09);
text-align: center;
line-height: 35px;
color: #838388;
cursor: pointer;
-webkit-border-radius: 0 5px 5px 0;
border-radius: 0 5px 5px 0;
transition: color .3s;
}
.flyout-box .drag-out:hover{
color: #000;
}
/* ==========================================================================
Side menu effects
========================================================================== */
.close-sidebar{
position: absolute;
top: 15px;
left: 15px;
cursor: pointer;
color: #ccc;
font-size: 20px;
padding: 5px;
transition: color .3s;
}
.dark-sidebar .close-sidebar{
color: #fff;
}
.close-sidebar:hover{
color: #222;
}
.dark-sidebar .close-sidebar:hover{
color: #ccc;
}
/* Effects. 1-6 from left side, 7-12 from right side
1,7: Slide in on top
2,8: Reveal
3,9: Push
4,10: Slide along
5,11: Reverse slide out
6,12: Fall down */
.side-menu-eff-1 #side-menu,
.side-menu-eff-3 #side-menu{
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
.side-menu-eff-7 #side-menu,
.side-menu-eff-9 #side-menu{
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
.side-menu-eff-2.side-menu-open .to-move,
.side-menu-eff-3.side-menu-open .to-move,
.side-menu-eff-4.side-menu-open .to-move,
.side-menu-eff-5.side-menu-open .to-move,
.side-menu-eff-6.side-menu-open .to-move{
-webkit-transform: translate3d(320px, 0, 0);
transform: translate3d(320px, 0, 0);
}
.side-menu-eff-8.side-menu-open .to-move,
.side-menu-eff-9.side-menu-open .to-move,
.side-menu-eff-10.side-menu-open .to-move,
.side-menu-eff-11.side-menu-open .to-move,
.side-menu-eff-12.side-menu-open .to-move{
-webkit-transform: translate3d(-320px, 0, 0);
transform: translate3d(-320px, 0, 0);
}
.side-menu-eff-1.side-menu-open #side-menu,
.side-menu-eff-3.side-menu-open #side-menu,
.side-menu-eff-4.side-menu-open #side-menu,
.side-menu-eff-5.side-menu-open #side-menu,
.side-menu-eff-6.side-menu-open #side-menu,
.side-menu-eff-7.side-menu-open #side-menu,
.side-menu-eff-9.side-menu-open #side-menu,
.side-menu-eff-10.side-menu-open #side-menu,
.side-menu-eff-11.side-menu-open #side-menu,
.side-menu-eff-12.side-menu-open #side-menu{
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
visibility: visible;
}
.side-menu-eff-2 #side-menu,
.side-menu-eff-8 #side-menu{
z-index: 0;
visibility: hidden;
}
.side-menu-eff-2.side-menu-open #side-menu,
.side-menu-eff-8.side-menu-open #side-menu{
visibility: visible;
}
.side-menu-eff-4 #side-menu,
.side-menu-eff-11 #side-menu{
z-index: 0;
-webkit-transform: translate3d(-50%, 0, 0);
transform: translate3d(-50%, 0, 0);
visibility: hidden;
}
.side-menu-eff-5 #side-menu,
.side-menu-eff-10 #side-menu{
z-index: 0;
-webkit-transform: translate3d(50%, 0, 0);
transform: translate3d(50%, 0, 0);
visibility: hidden;
}
/* shadow effect */
.side-menu-eff-5 #side-menu::after,
.side-menu-eff-6 #side-menu::after,
.side-menu-eff-11 #side-menu::after,
.side-menu-eff-12 #side-menu::after{
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.8);
content: '';
opacity: 1;
transition: opacity .5s;
}
.side-menu-eff-5.side-menu-open #side-menu::after,
.side-menu-eff-6.side-menu-open #side-menu::after,
.side-menu-eff-11.side-menu-open #side-menu::after,
.side-menu-eff-12.side-menu-open #side-menu::after{
width: 0;
height: 0;
opacity: 0;
transition: opacity .5s, width .1s .5s, height .1s .5s;
}
.side-menu-eff-6 #side-menu,
.side-menu-eff-12 #side-menu{
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
z-index: 0;
}
/* fix of bottom padding, cause sidebar is hiding under footer*/
.side-menu-eff-2 #side-menu div.scroll-wrap,
.side-menu-eff-4 #side-menu div.scroll-wrap,
.side-menu-eff-5 #side-menu div.scroll-wrap,
.side-menu-eff-6 #side-menu div.scroll-wrap,
.side-menu-eff-8 #side-menu div.scroll-wrap,
.side-menu-eff-10 #side-menu div.scroll-wrap,
.side-menu-eff-11 #side-menu div.scroll-wrap,
.side-menu-eff-12 #side-menu div.scroll-wrap{
padding-bottom: 80px;
}
/* IE 9 */
/* left side */
.lt-ie10 .side-menu-eff-1 #side-menu,
.lt-ie10 .side-menu-eff-2 #side-menu,
.lt-ie10 .side-menu-eff-3 #side-menu,
.lt-ie10 .side-menu-eff-4 #side-menu,
.lt-ie10 .side-menu-eff-5 #side-menu,
.lt-ie10 .side-menu-eff-6 #side-menu{
left: -320px;
z-index: 30;
}
.lt-ie10 .side-menu-eff-1.side-menu-open #side-menu,
.lt-ie10 .side-menu-eff-2.side-menu-open #side-menu,
.lt-ie10 .side-menu-eff-3.side-menu-open #side-menu,
.lt-ie10 .side-menu-eff-4.side-menu-open #side-menu,
.lt-ie10 .side-menu-eff-5.side-menu-open #side-menu,
.lt-ie10 .side-menu-eff-6.side-menu-open #side-menu{
left: 0;
}
/* right side */
.lt-ie10 .side-menu-eff-7 #side-menu,
.lt-ie10 .side-menu-eff-8 #side-menu,
.lt-ie10 .side-menu-eff-9 #side-menu,
.lt-ie10 .side-menu-eff-10 #side-menu,
.lt-ie10 .side-menu-eff-11 #side-menu,
.lt-ie10 .side-menu-eff-12 #side-menu{
right: -320px;
z-index: 30;
}
.lt-ie10 .side-menu-eff-7.side-menu-open #side-menu,
.lt-ie10 .side-menu-eff-8.side-menu-open #side-menu,
.lt-ie10 .side-menu-eff-9.side-menu-open #side-menu,
.lt-ie10 .side-menu-eff-10.side-menu-open #side-menu,
.lt-ie10 .side-menu-eff-11.side-menu-open #side-menu,
.lt-ie10 .side-menu-eff-12.side-menu-open #side-menu{
right: 0;
}
/* ==========================================================================
Social icons
========================================================================== */
.socials{
margin: 0;
vertical-align: top;
line-height: 0; /*remove white space*/
}
.socials a{
display: inline-block;
margin-right: 4px;
height: 26px;
width: 26px;
line-height: 26px;
color: #fff;
text-align: center;
text-decoration: none !important;
font-size: 16px;
transition: background-color .5s, color .5s, opacity .5s !important;;
}
.socials a:first-child{
margin-right: 0;
}
/* icons with background */
.socials.circles a{
-webkit-border-radius: 13px;
border-radius: 13px;
}
.socials.white a{
background-color: #fff;
color: #000;
}
.socials.black a{
background-color: #000;
color: #fff;
}
.socials.semi-transparent a{
background-color: #fff;
color: #000;
opacity: 0.5;
}
.socials.color a{
background-color: #3498DB;
color: #fff;
}
.color a.a13_soc-500px{ background-color: #A5A6A8; }
.color a.a13_soc-behance{ background-color: #1769FF; }
.color a.a13_soc-delicious{ background-color: #205CC0; }
.color a.a13_soc-deviantart{ background-color: #768C82; }
.color a.a13_soc-digg{ background-color: #1F6EBA; }
.color a.a13_soc-dribbble{ background-color: #EB5991; }
.color a.a13_soc-dropbox{ background-color: #007EE6; }
.color a.a13_soc-facebook{ background-color: #4A73C9; }
.color a.a13_soc-flickr{ background-color: #FF0084; }
.color a.a13_soc-foursquare{ background-color: #25A0CA; }
.color a.a13_soc-github{ background-color: #5D5D5D; }
.color a.a13_soc-googleplus{ background-color: #E1695B; }
.color a.a13_soc-instagram{ background-color: #3F729B; }
.color a.a13_soc-lastfm{ background-color: #DE2539; }
.color a.a13_soc-linkedin{ background-color: #0E76A8; }
.color a.a13_soc-mailto{ background-color: #565656; }
.color a.a13_soc-paypal{ background-color: #175C85; }
.color a.a13_soc-pinterest{ background-color: #C8232C; }
.color a.a13_soc-reddit{ background-color: #FF4500; }
.color a.a13_soc-rss{ background-color: #EE802F; }
.color a.a13_soc-sharethis{ background-color: #206E00; }
.color a.a13_soc-skype{ background-color: #00AFF0; }
.color a.a13_soc-spotify{ background-color: #80B719; }
.color a.a13_soc-stumbleupon{ background-color: #27A036; }
.color a.a13_soc-telegram{ background-color: #1E96C8; }
.color a.a13_soc-tripadvisor{ background-color: #00a680; }
.color a.a13_soc-tumblr{ background-color: #34526F; }
.color a.a13_soc-twitter{ background-color: #00A0D1; }
.color a.a13_soc-vimeo{ background-color: #86C9EF; }
.color a.a13_soc-wordpress{ background-color: #21759B; }
.color a.a13_soc-yahoo{ background-color: #8B39AF; }
.color a.a13_soc-youtube{ background-color: #C4302B; }
.color a.a13_soc-yelp{ background-color: #C41200; }
.color a.a13_soc-vkontakte{ background-color: #4C75A3; }
/* hovers after normal for proper overwrites */
.socials.white_hover a:hover{
background-color: #fff;
color: #000;
opacity: 1;
}
.socials.black_hover a:hover{
background-color: #000;
color: #fff;
opacity: 1;
}
.socials.semi-transparent_hover a:hover{
background-color: #fff;
color: #000;
opacity: 0.5;
}
.socials.color_hover a:hover{
background-color: #3498DB;
color: #fff;
opacity: 1;
}
.color_hover a.a13_soc-500px:hover{ background-color: #A5A6A8; }
.color_hover a.a13_soc-behance:hover{ background-color: #1769FF; }
.color_hover a.a13_soc-delicious:hover{ background-color: #205CC0; }
.color_hover a.a13_soc-deviantart:hover{ background-color: #768C82; }
.color_hover a.a13_soc-digg:hover{ background-color: #1F6EBA; }
.color_hover a.a13_soc-dribbble:hover{ background-color: #EB5991; }
.color_hover a.a13_soc-dropbox:hover{ background-color: #007EE6; }
.color_hover a.a13_soc-facebook:hover{ background-color: #4A73C9; }
.color_hover a.a13_soc-flickr:hover{ background-color: #FF0084; }
.color_hover a.a13_soc-foursquare:hover{ background-color: #25A0CA; }
.color_hover a.a13_soc-github:hover{ background-color: #5D5D5D; }
.color_hover a.a13_soc-googleplus:hover{ background-color: #E1695B; }
.color_hover a.a13_soc-instagram:hover{ background-color: #3F729B; }
.color_hover a.a13_soc-lastfm:hover{ background-color: #DE2539; }
.color_hover a.a13_soc-linkedin:hover{ background-color: #0E76A8; }
.color_hover a.a13_soc-mailto:hover{ background-color: #565656; }
.color_hover a.a13_soc-paypal:hover{ background-color: #175C85; }
.color_hover a.a13_soc-pinterest:hover{ background-color: #C8232C; }
.color_hover a.a13_soc-reddit:hover{ background-color: #FF4500; }
.color_hover a.a13_soc-rss:hover{ background-color: #EE802F; }
.color_hover a.a13_soc-sharethis:hover{ background-color: #206E00; }
.color_hover a.a13_soc-skype:hover{ background-color: #00AFF0; }
.color_hover a.a13_soc-spotify:hover{ background-color: #80B719; }
.color_hover a.a13_soc-stumbleupon:hover{ background-color: #27A036; }
.color_hover a.a13_soc-telegram:hover{ background-color: #1E96C8; }
.color_hover a.a13_soc-tripadvisor:hover{ background-color: #00a680; }
.color_hover a.a13_soc-tumblr:hover{ background-color: #34526F; }
.color_hover a.a13_soc-twitter:hover{ background-color: #00A0D1; }
.color_hover a.a13_soc-vimeo:hover{ background-color: #86C9EF; }
.color_hover a.a13_soc-wordpress:hover{ background-color: #21759B; }
.color_hover a.a13_soc-yahoo:hover{ background-color: #8B39AF; }
.color_hover a.a13_soc-youtube:hover{ background-color: #C4302B; }
.color_hover a.a13_soc-yelp:hover{ background-color: #C41200; }
.color_hover a.a13_soc-vkontakte:hover{ background-color: #4C75A3; }
/* icons without background */
.socials.icons-only a,
.socials.icons-only a:hover{
background-color: transparent;
}
.socials.icons-only.white a{
color: #fff;
}
.socials.icons-only.black a{
color: #000;
}
.socials.icons-only.semi-transparent a{
color: #000;
opacity: 0.5;
}
.socials.icons-only.color a{
color: #3498DB;
}
.icons-only.color a.a13_soc-500px{ color: #A5A6A8; }
.icons-only.color a.a13_soc-behance{ color: #1769FF; }
.icons-only.color a.a13_soc-delicious{ color: #205CC0; }
.icons-only.color a.a13_soc-deviantart{ color: #768C82; }
.icons-only.color a.a13_soc-digg{ color: #1F6EBA; }
.icons-only.color a.a13_soc-dribbble{ color: #EB5991; }
.icons-only.color a.a13_soc-dropbox{ color: #007EE6; }
.icons-only.color a.a13_soc-facebook{ color: #4A73C9; }
.icons-only.color a.a13_soc-flickr{ color: #FF0084; }
.icons-only.color a.a13_soc-foursquare{ color: #25A0CA; }
.icons-only.color a.a13_soc-github{ color: #5D5D5D; }
.icons-only.color a.a13_soc-googleplus{ color: #E1695B; }
.icons-only.color a.a13_soc-instagram{ color: #3F729B; }
.icons-only.color a.a13_soc-lastfm{ color: #DE2539; }
.icons-only.color a.a13_soc-linkedin{ color: #0E76A8; }
.icons-only.color a.a13_soc-mailto{ color: #565656; }
.icons-only.color a.a13_soc-paypal{ color: #175C85; }
.icons-only.color a.a13_soc-pinterest{ color: #C8232C; }
.icons-only.color a.a13_soc-reddit{ color: #FF4500; }
.icons-only.color a.a13_soc-rss{ color: #EE802F; }
.icons-only.color a.a13_soc-sharethis{ color: #206E00; }
.icons-only.color a.a13_soc-skype{ color: #00AFF0; }
.icons-only.color a.a13_soc-spotify{ color: #80B719; }
.icons-only.color a.a13_soc-stumbleupon{ color: #27A036; }
.icons-only.color a.a13_soc-telegram{ color: #1E96C8; }
.icons-only.color a.a13_soc-tripadvisor{ color: #00a680; }
.icons-only.color a.a13_soc-tumblr{ color: #34526F; }
.icons-only.color a.a13_soc-twitter{ color: #00A0D1; }
.icons-only.color a.a13_soc-vimeo{ color: #86C9EF; }
.icons-only.color a.a13_soc-wordpress{ color: #21759B; }
.icons-only.color a.a13_soc-yahoo{ color: #8B39AF; }
.icons-only.color a.a13_soc-youtube{ color: #C4302B; }
.icons-only.color a.a13_soc-yelp{ color: #C41200; }
.icons-only.color a.a13_soc-vkontakte{ color: #4C75A3; }
/* hovers after normal for proper overwrites */
.socials.icons-only.white_hover a:hover{
color: #fff;
opacity: 1;
}
.socials.icons-only.black_hover a:hover{
color: #000;
opacity: 1;
}
.socials.icons-only.semi-transparent_hover a:hover{
color: #fff;
opacity: 0.5;
}
.socials.icons-only.color_hover a:hover{
color: #3498DB;
opacity: 1;
}
.icons-only.color_hover a.a13_soc-500px:hover{ color: #A5A6A8; }
.icons-only.color_hover a.a13_soc-behance:hover{ color: #1769FF; }
.icons-only.color_hover a.a13_soc-delicious:hover{ color: #205CC0; }
.icons-only.color_hover a.a13_soc-deviantart:hover{ color: #768C82; }
.icons-only.color_hover a.a13_soc-digg:hover{ color: #1F6EBA; }
.icons-only.color_hover a.a13_soc-dribbble:hover{ color: #EB5991; }
.icons-only.color_hover a.a13_soc-dropbox:hover{ color: #007EE6; }
.icons-only.color_hover a.a13_soc-facebook:hover{ color: #4A73C9; }
.icons-only.color_hover a.a13_soc-flickr:hover{ color: #FF0084; }
.icons-only.color_hover a.a13_soc-foursquare:hover{ color: #25A0CA; }
.icons-only.color_hover a.a13_soc-github:hover{ color: #5D5D5D; }
.icons-only.color_hover a.a13_soc-googleplus:hover{ color: #E1695B; }
.icons-only.color_hover a.a13_soc-instagram:hover{ color: #3F729B; }
.icons-only.color_hover a.a13_soc-lastfm:hover{ color: #DE2539; }
.icons-only.color_hover a.a13_soc-linkedin:hover{ color: #0E76A8; }
.icons-only.color_hover a.a13_soc-mailto:hover{ color: #565656; }
.icons-only.color_hover a.a13_soc-paypal:hover{ color: #175C85; }
.icons-only.color_hover a.a13_soc-pinterest:hover{ color: #C8232C; }
.icons-only.color_hover a.a13_soc-reddit:hover{ color: #FF4500; }
.icons-only.color_hover a.a13_soc-rss:hover{ color: #EE802F; }
.icons-only.color_hover a.a13_soc-sharethis:hover{ color: #206E00; }
.icons-only.color_hover a.a13_soc-skype:hover{ color: #00AFF0; }
.icons-only.color_hover a.a13_soc-spotify:hover{ color: #80B719; }
.icons-only.color_hover a.a13_soc-stumbleupon:hover{ color: #27A036; }
.icons-only.color_hover a.a13_soc-telegram:hover{ color: #1E96C8; }
.icons-only.color_hover a.a13_soc-tripadvisor:hover{ color: #00a680; }
.icons-only.color_hover a.a13_soc-tumblr:hover{ color: #34526F; }
.icons-only.color_hover a.a13_soc-twitter:hover{ color: #00A0D1; }
.icons-only.color_hover a.a13_soc-vimeo:hover{ color: #86C9EF; }
.icons-only.color_hover a.a13_soc-wordpress:hover{ color: #21759B; }
.icons-only.color_hover a.a13_soc-yahoo:hover{ color: #8B39AF; }
.icons-only.color_hover a.a13_soc-youtube:hover{ color: #C4302B; }
.icons-only.color_hover a.a13_soc-yelp:hover{ color: #C41200; }
.icons-only.color_hover a.a13_soc-vkontakte:hover{ color: #4C75A3; }
/* ==========================================================================
Some group Transitions
========================================================================== */
.to-move,
#side-menu,
.slider-thumb-list li{
transition: transform .5s, visibility .5s;
}
/* For elements that are also manipulated by JS */
.slider-slides li iframe,
.slider-slides div.wp-video,
.widget-slider-ctrls span,
.slider-thumb-list li::before,
.a13-slider.gradient a.slide::after,
.a13-slider.pattern a.slide::before{
transition: opacity .5s;
}
h1 a,h2 a,h3 a,h4 a,h5 a, h6 a,
a.post-title,
.category-filter a,
.navigation a,
.foot-text a,
.top-menu li,
.top-menu a,
.top-menu span.title,
.top-menu i.sub-mark,
.top-menu > li > a::before,
.top-bar-container a,
.posts-nav a span,
.formatter a,
.widget li a{
transition: background-color .5s, color .5s;
}
input,
button[type="submit"],
textarea{
transition: background-color .5s, border-color .5s, color .5s;
}
.tagcloud a,
.under_content_tags a{
transition: all .4s;
}
/* ==========================================================================
Post styles globals
========================================================================== */
.clearfix::before,
.clearfix::after {
content: " ";
display: table;
}
.clearfix::after {
clear: both;
}
.clear {
clear: both;
display: block;
font-size: 0;
height: 0;
line-height: 0;
}
/* ==========================================================================
Responsive design
========================================================================== */
@media only screen and (min-width: 1560px) {
/* make sure that sidebar wont get too wide */
.layout-full .content-box{
width: calc(100% - 320px);
}
.no-sidebars .content-box{
width: auto;
}
.layout-full #secondary{
width: 320px;
}
}
@media only screen and (min-width: 1640px) {
/* make sure that sidebar wont get too wide */
.layout-full_padding .content-box{
width: calc(100% - 320px);
}
.no-sidebars .content-box{
width: auto;
}
.layout-full_padding #secondary{
width: 320px;
}
}
@media only screen and (min-width: 1301px) {
/* we return number much above any breakpoints that we use in JS - need for not null values */
body::after {
content: 'narrow1500'; /* info for JS */
display: none;
}
}
@media only screen and (max-width: 1400px) and (min-width: 1025px) {
/* make sure that sidebar wont get too narrow */
.layout-full_padding.with-sidebar #col-mask{
right: 30%;
}
.page .layout-full_padding.with-sidebar .content-box .formatter,
.single-post .layout-full_padding.with-sidebar .content-box .formatter{
padding: 60px 40px;
}
.layout-full_padding.with-sidebar .content-box{
width: 70%;
left: 30%;
}
.layout-full_padding.with-sidebar #secondary{
left: 30%;
width: 30%;
}
}
@media only screen and (max-width: 1320px) and (min-width: 1025px) {
/* make sure that sidebar wont get too narrow */
.layout-parted.with-sidebar #col-mask,
.layout-full.with-sidebar #col-mask{
right: 30%;
}
.page .layout-parted.with-sidebar .content-box .formatter,
.page .layout-full.with-sidebar .content-box .formatter,
.single-post .layout-parted.with-sidebar .content-box .formatter,
.single-post .layout-full.with-sidebar .content-box .formatter{
padding: 60px 40px;
}
.layout-parted.with-sidebar .content-box{
width: calc(70% - 10px);
left: 30%;
}
.layout-full.with-sidebar .content-box{
width: 70%;
left: 30%;
}
.layout-parted.with-sidebar #secondary,
.layout-full.with-sidebar #secondary{
left: 30%;
width: 30%;
}
.layout-padding #content{
margin: 0 20px;
}
}
@media only screen and (max-width: 1150px) and (min-width: 1025px) {
/* make sure that sidebar wont get too narrow */
.layout-full.left-sidebar #secondary{
padding-right: 10px;
}
.layout-full.right-sidebar #secondary{
padding-left: 10px;
}
}
@media only screen and (max-width: 1300px) {
body::after {
content: 'narrow1300'; /* info for JS */
display: none;
}
/* remove bordered layout */
.site-layout-bordered .theme-borders,
.site-layout-bordered .theme-borders > div{
display: none;
height: auto;
}
.site-layout-bordered .whole-layout{
padding: 0;
}
.site-layout-bordered.no-border-top #side-menu,
.site-layout-bordered.no-border-bottom #side-menu,
.site-layout-bordered #side-menu,
.site-layout-bordered #side-menu.at-right{
margin: 0;
height: 100%;
}
.admin-bar.site-layout-bordered #side-menu,
.admin-bar.site-layout-bordered.no-border-top #side-menu,
.admin-bar.site-layout-bordered.no-border-bottom #side-menu,
.admin-bar.site-layout-bordered.no-border-top.no-border-bottom #side-menu{
height: calc(100% - 32px);
}
.header-vertical.site-layout-bordered #header,
.header-side-right.header-vertical.site-layout-bordered #header{
margin: 0;
}
.site-layout-bordered.header-horizontal #header{
top: 0;
right: 0;
left: 0;
}
.header-horizontal #header.narrow-header {
right: 50%;
}
body.single-album-slider.header-horizontal.site-layout-bordered #footer{
margin-bottom: 0;
}
/* fix positioning of fp-nav according to current layout */
.site-layout-bordered #fp-nav{
left: 17px;
}
.site-layout-bordered.header-side-right.header-vertical #fp-nav{
right: 297px;
}
/* vertical header */
.header-vertical.site-layout-bordered #header,
.header-vertical.site-layout-bordered.no-border-top #header,
.header-vertical.site-layout-bordered.no-border-bottom #header,
.header-vertical.site-layout-bordered.no-border-bottom.no-border-top #header{
min-height: 100vh;
}
.admin-bar.header-vertical.site-layout-bordered #header,
.admin-bar.header-vertical.site-layout-bordered.no-border-top #header,
.admin-bar.header-vertical.site-layout-bordered.no-border-bottom #header{
min-height: calc(100vh - 32px);
}
/* footer with unravel effect */
.site-layout-bordered #footer.unravel{
left: 0;
right: 0;
bottom: 0;
}
/* menu overlay */
.site-layout-bordered #menu-overlay{
top: 0;
right: 0;
left: 0;
bottom: 0;
}
.admin-bar.site-layout-bordered #menu-overlay{ top: 32px; }
.site-layout-bordered #menu-overlay,
.site-layout-bordered.no-border-top #menu-overlay,
.site-layout-bordered.no-border-bottom #menu-overlay{
height: 100%;
}
.admin-bar #menu-overlay,
.admin-bar.site-layout-bordered #menu-overlay,
.admin-bar.site-layout-bordered.no-border-top #menu-overlay,
.admin-bar.site-layout-bordered.no-border-bottom #menu-overlay,
.admin-bar.site-layout-bordered.no-border-bottom.no-border-top #menu-overlay{
height: calc(100% - 32px);
}
}
@media only screen and (max-width: 1240px) {
/* fix narrow horizontal header */
.header-horizontal #header.narrow-header{
right: 0;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
.header-horizontal #header.sticky-hide.narrow-header,
.header-horizontal #header.hide-until-scrolled-to.narrow-header{
-webkit-transform: translate(0, -102%);
-ms-transform: translate(0, -102%);
transform: translate(0, -102%);
/* 102% cause it leaves one pixel behind when doing 3d transforms */
}
.site-layout-bordered.header-horizontal #header.narrow-header{
width: 100%;
left: auto;
}
.no-border-right.header-horizontal #header.narrow-header,
.no-border-left.header-horizontal #header.narrow-header{
left: 0;
}
}
@media only screen and (max-width: 1024px) {
body::after {
content: 'narrow1024'; /* info for JS */
display: none;
}
/* general layout */
a.to-top {
left: 20px;
}
#side-menu{
-webkit-overflow-scrolling: touch; /* better scroll on iOS */
}
/* header */
#header-tools.only-menu{
/* we reset our hiding */
clip: auto;
position: static;
top: auto;
right: auto;
visibility: visible;
height: auto;
overflow: visible;
opacity: 1;
}
#header-tools #mobile-menu-opener{
display: inline-block;
}
#basket-items-count{
right: 0;
}
a.logo{
white-space: normal; /* for text logo */
}
/* vertical header */
.header-vertical #header{
position: fixed;
width: 100%;
}
.header-vertical #header,
.admin-bar.header-vertical #header,
.header-vertical.site-layout-bordered #header,
.header-vertical.site-layout-bordered.no-border-top #header,
.header-vertical.site-layout-bordered.no-border-bottom #header,
.header-vertical.site-layout-bordered.no-border-bottom.no-border-top #header,
.admin-bar.header-vertical.site-layout-bordered #header,
.admin-bar.header-vertical.site-layout-bordered.no-border-top #header,
.admin-bar.header-vertical.site-layout-bordered.no-border-bottom #header,
.admin-bar.header-vertical.site-layout-bordered.no-border-bottom.no-border-top #header{
min-height: 0;
}
.header-widgets{
display: none;
}
.header-vertical #header #footer{
display: none;/* for instant proper size header */
}
.header-vertical .whole-layout > #footer{
display: block;
}
.header-vertical #header .head{
width: 100%;
display: table;
text-align: center;
padding-bottom: 0 !important;/* for instant proper size header */
}
.header-vertical #header .logo-container,
.header-vertical #header #header-tools{
display: table-cell;
vertical-align: middle;
}
.header-vertical #header .logo-container{
text-align: right;
padding-left: 10px;
}
.header-vertical #header #header-tools{
text-align: left;
padding-right: 10px;
padding-top: 5px; /* some space when logo is small */
padding-bottom: 5px;
}
/* header search */
.header-vertical .search-container,
.header-side-right.header-vertical .search-container{
top: 0;
bottom: 0;
right: auto;
left: 0;
width: 100%;
}
/* header horizontal */
.header-horizontal .mobile-menu .navigation-bar{
width: 0;
padding: 0;
position: static;
}
.header-horizontal .mobile-menu .logo-container{
width: 100%;
}
/* header multi line */
.header-type-multi_line .top-head{
display: table;
padding: 0 40px;
}
.header-type-multi_line .logo-container{
display: table-cell;
width: 100%;
text-align: right;
}
.header-type-multi_line #header-tools,
.header-type-multi_line .head .socials{
position: static;
display: table-cell;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
.header-type-multi_line #header-tools{
padding-left: 15px;
}
.header-type-multi_line #header-tools::before,
.header-type-multi_line .head .socials::before{
display: inline-block;
}
.header-type-multi_line.mobile-menu .bottom-head{
border-top: none;
}
.header-type-multi_line.header-variant-menu_above.mobile-menu .bottom-head{
border-bottom: none;
}
/* ONE LINE LOGO CENTERED */
.header-variant-one_line_centered.mobile-menu .socials-cell, .header-variant-one_line_centered.mobile-menu .tools-cell {
width: 40%;
}
.header-variant-one_line_centered.mobile-menu .menu-cell{
width: 20%;
position: static;
}
header.header-variant-one_line_centered.mobile-menu .socials{
position: static;
}
.header-variant-one_line_centered.no-shield .logo-container {
display: inline-block;
position: static;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
.header-variant-one_line_centered.mobile-menu .menu-cell .top-menu,
.header-variant-one_line_centered.sticky-values.mobile-menu .menu-cell .top-menu{
width: auto;
float: none;
text-align: right;
padding-bottom: 0;
}
.header-variant-one_line_centered.mobile-menu .menu-cell .right-part{
float: none;
padding-top: 0;
padding-bottom: 25px;
}
/* ONE LINE LOGO CENTERED WITH SHIELD */
.header-variant-one_line_centered.mobile-menu.with-shield .menu-cell {
height: 40px; /* acts as min-height */
}
/* MOBILE MENU */
.header-vertical .navigation-bar{
position: static;
}
.navigation-bar .menu-container{
display: none; /* so no flash of menu till we decide that menu should be visible */
}
.desktop_menu .navigation-bar .menu-container{
display: block;
}
.mobile-menu .navigation-bar .menu-container{
width: 100%;
position: absolute;
right: 0;
top: 100%;
transition: background-color .5s;
}
.mobile-menu .navigation-bar ul{
display: none;
opacity: 1;
visibility: visible;
position: static;
border-top: none;
padding: 10px 0;
min-width: 0;
box-shadow: none;
overflow: hidden;
}
.mobile-menu .navigation-bar .top-menu{
padding: 25px 0;
}
/* all items */
.mobile-menu .navigation-bar .top-menu li{
white-space: normal;
display: block;
text-align: center;
}
.mobile-menu .navigation-bar .top-menu li a,
.mobile-menu .navigation-bar .top-menu li span.title,
.mobile-menu .navigation-bar .top-menu li li a,
.mobile-menu .navigation-bar .top-menu li li span.title{
line-height: 36px;
padding: 0 40px;
}
.mobile-menu .navigation-bar .top-menu li li a,
.mobile-menu .navigation-bar .top-menu li li span.title{
line-height: 26px;
}
/* first level items */
.mobile-menu .navigation-bar .top-menu > li > a,
.mobile-menu .navigation-bar .top-menu > li > span.title{
min-height: 36px; /* overwrite height from vertical header */
}
/* parents items with openers */
.mobile-menu .navigation-bar .top-menu.opener-icons-on li.menu-parent-item,
.mobile-menu .navigation-bar .top-menu.opener-icons-on li li.menu-parent-item{
padding-left: 0;
}
.mobile-menu .navigation-bar .top-menu.opener-icons-on li.menu-parent-item > a,
.mobile-menu .navigation-bar .top-menu.opener-icons-on li.menu-parent-item > span.title {
padding: 0 66px;
}
/* submenu openers */
.mobile-menu .navigation-bar .top-menu i.sub-mark{
height: 26px;
left: 38px;
margin-top: 6px;
background-color: rgba(255,255,255,0.1);
}
.mobile-menu .navigation-bar .top-menu ul i.sub-mark{
height: 17px;
line-height: 17px;
}
/* needed for vertical header when hover effect is added */
.mobile-menu .navigation-bar .top-menu.with-effect > li > a > span,
.mobile-menu .navigation-bar .top-menu.with-effect > li > span.title > span {
display: inline;
}
/* animate first level menu items after opening menu */
.mobile-menu .navigation-bar .top-menu > li{
opacity: 0;
padding: 0;
pointer-events: none;
-webkit-transform: scale(1.1) translateY(-50%);
-ms-transform: scale(1.1) translateY(-50%);
transform: scale(1.1) translateY(-50%);
transition: opacity .35s ease-out, transform .35s ease-out;
}
.mobile-menu .navigation-bar .open .top-menu > li{
opacity: 1;
pointer-events: auto;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
.mobile-menu .navigation-bar .open .top-menu > li:nth-child(1){transition-delay:.15s}
.mobile-menu .navigation-bar .open .top-menu > li:nth-child(2){transition-delay:.2s}
.mobile-menu .navigation-bar .open .top-menu > li:nth-child(3){transition-delay:.25s}
.mobile-menu .navigation-bar .open .top-menu > li:nth-child(4){transition-delay:.3s}
.mobile-menu .navigation-bar .open .top-menu > li:nth-child(5){transition-delay:.35s}
.mobile-menu .navigation-bar .open .top-menu > li:nth-child(6){transition-delay:.4s}
.mobile-menu .navigation-bar .open .top-menu > li:nth-child(7){transition-delay:.45s}
.mobile-menu .navigation-bar .open .top-menu > li:nth-child(8){transition-delay:.5s}
.mobile-menu .navigation-bar .open .top-menu > li:nth-child(9){transition-delay:.55s}
.mobile-menu .navigation-bar .open .top-menu > li:nth-child(10){transition-delay:.6s}
.mobile-menu .navigation-bar .open .top-menu > li:nth-child(11){transition-delay:.65s}
/* MEGA MENU OVERWRITES */
/* borders in section mega menu */
.mobile-menu .navigation-bar .mega-menu > ul > li::before{
display: none;
}
.mobile-menu .navigation-bar .mega-menu > ul{
width: auto;
}
.mobile-menu .navigation-bar .mega-menu > ul > li{
float: none;
border-right: none;
width: auto;
}
/* END OF MOBILE MENU */
/* DYNAMIC SEARCH RESULTS */
.searchwp-live-search-result{
min-height: 70px;
}
.searchwp-live-search-result a{
padding-top: 10px;
}
.searchwp-live-search-result .icon{
height: 50px;
width: 50px;
line-height: 50px;
-webkit-border-radius: 25px;
border-radius: 25px;
}
.searchwp-live-search-result .title{
margin-right: 70px;
}
.searchwp-live-search-result time{
display: none;
}
.searchwp-live-search-result .excerpt{
margin-right: 70px;
}
/* footer */
#footer{
z-index: 8; /* below header */
}
#footer.unravel{
position: relative;
right: auto;
bottom: auto;
z-index: 8;
}
.site-layout-bordered.no-border-left #footer.unravel,
.site-layout-bordered.no-border-right #footer.unravel,
.site-layout-bordered.no-border-bottom #footer.unravel,
.site-layout-bordered #footer.unravel{
right: auto;
left: auto;
bottom: auto;
width: 100%;
}
.foot-items,
#footer .foot-widgets{
padding: 0 60px;
}
.five-col .widget{
width: 30.3%;
}
.four-col .widget{
width: 46.99%;
}
.four-col .widget:nth-child(4n+1),
.five-col .widget:nth-child(5n+1){
clear: none;
}
.five-col .widget:nth-child(3n+1),
.four-col .widget:nth-child(2n+1){
clear: both;
}
/* content layouts */
.header-vertical #mid{
padding: 0;
}
.layout-padding #content{
margin: 0;
}
.with-sidebar .formatter{
padding: 40px;
}
.with-sidebar #col-mask{
right: 30%;
}
.with-sidebar .content-box{
left: 30%;
width: calc(70% - 10px);
}
#secondary{
left: 30%;
width: 30%;
}
/* comments */
.with-sidebar .comments-area{
margin: 40px -40px -40px;
padding: 40px;
}
.comment .comment {
margin-right: 20px;
}
/* single album slider */
.header-vertical.single-album .a13-slider{
right: 0;
}
.header-vertical.header-side-right.single-album .a13-slider{
right: 0;
}
/* single album bricks */
.album-content {
right: 0;
}
.album-content{
position: static;
width: auto;
height: auto;
float: none;
}
.custom-fields em{
display: inline;
}
.custom-fields em::after{
content: ":";
margin-left: 5px;
}
/* single album slider */
.a13-slider{
right: 0;
}
.header-side-right .a13-slider{
right: 0;
}
/* single work */
.with-meta-fields .inside{
float: none;
width: auto;
}
.work-content .meta-data{
float: none;
width: auto;
margin-top: 40px;
}
/* Post lightbox */
.a13-post-lightbox .controls span{
font-size: 36px;
line-height: 60px;
height: 60px;
width: 60px;
}
.a13-post-lightbox .controls .next{
right: 60px;
}
.a13-post-lightbox-content .page-title{
margin-top: 60px;
}
/* move fp-nav according to current layout */
.site-layout-bordered #fp-nav,
.header-side-right.header-vertical #fp-nav,
.site-layout-bordered.header-side-right.header-vertical #fp-nav,
.site-layout-bordered.no-border-right.header-side-right.header-vertical #fp-nav{
right: 17px;
}
}
@media only screen and (max-width: 782px) {
/* header */
.admin-bar.header-horizontal #header{
margin-top: 46px;
}
.admin-bar.header-vertical #header{
top: 46px;
}
/* TOP CLOSABLE MESSAGE */
.admin-bar .top-message-container.top-screen{
top: 46px;
}
/* menu overlay */
.admin-bar #menu-overlay,
.admin-bar.site-layout-bordered #menu-overlay,
.admin-bar.site-layout-bordered.no-border-top #menu-overlay,
.admin-bar.site-layout-bordered.no-border-bottom #menu-overlay,
.admin-bar.site-layout-bordered.no-border-bottom.no-border-top #menu-overlay{
height: 100%;
}
.admin-bar #menu-overlay {
top: 46px;
}
/* content */
.admin-bar .whole-layout{
margin-top: 46px;
}
body.single-album-slider.admin-bar{
height: calc(100% - 46px);
}
.admin-bar #side-menu {
top: 46px;
}
.admin-bar.site-layout-bordered #side-menu,
.admin-bar.site-layout-bordered.no-border-top #side-menu,
.admin-bar.site-layout-bordered.no-border-bottom #side-menu,
.admin-bar.site-layout-bordered.no-border-top.no-border-bottom #side-menu{
height: calc(100% - 46px);
}
}
@media only screen and (max-width: 768px) {
body::after {
content: 'narrow768'; /* info for JS */
display: none;
}
/* wp-gallery */
.gallery-columns-5 .gallery-item,
.gallery-columns-6 .gallery-item,
.gallery-columns-7 .gallery-item,
.gallery-columns-8 .gallery-item,
.gallery-columns-9 .gallery-item{
max-width: 25%;
}
/* menu */
.mobile-menu .navigation-bar .top-menu{
padding: 10px 0;
}
.header-variant-one_line_centered.mobile-menu .menu-cell .right-part{
padding-bottom: 10px;
}
/* title bar */
.title_bar_variant_classic .in{
text-align: center;
display: block;
}
.title_bar_variant_classic .titles,
.title_bar_variant_classic .breadcrumbs{
display: block;
}
.title-bar .breadcrumbs{
margin-top: 10px;
text-align: center;
}
/* content layouts */
.with-sidebar .formatter{
padding: 60px;
}
#col-mask,
.with-sidebar #col-mask{
right: auto;
float: none;
}
#secondary,
.left-sidebar #secondary,
.content-box,
.with-sidebar .content-box{
float: none;
left: auto;
width: auto;
margin-left: 0;
margin-right: 0;
}
/* main sidebar */
#secondary{
padding-left: 60px;
padding-right: 60px;
}
#secondary .widget{
width: 48%;
float: right;
}
#secondary .widget:nth-child(even){
margin-right: 3.9%;
}
#secondary .widget:nth-child(odd){
clear: right;
}
/* bricks blog */
.bricks-frame .formatter{
padding: 40px;
}
.posts_horizontal .post-media{
float: none;
width: auto;
max-width: 420px;
margin: 0 auto;
}
.posts_horizontal .post-media + .formatter{
margin-right: 0;
}
/* comments */
.with-sidebar .comments-area{
margin: 50px -60px -60px;
padding: 40px 60px;
}
/* single album slider */
.thumb-tray-button{
margin-left: 15px;
}
.slider-play-button{
margin-left: 0;
}
span.slides-count{
display: none;
}
.slide-caption{
right: 40px;
left: 40px;
max-width: none;
max-height: none;
}
.slide-caption.with-color .description{
max-height: 150px;
overflow: auto;
}
.slider-controls{
left: 40px;
}
.thumbs-open .slide-caption,
.thumbs-open .slider-controls{
bottom: 120px;
}
.texts-opener{
display: block;
}
.slide-caption h2.title,
.slide-caption .description{
display: none;
}
/* single work */
/* similar works */
.similar-works .object-item{
width: calc(50% - 10px);
}
.similar-works .object-item:nth-child(1){
width: calc(100% - 10px);
}
}
@media only screen and (max-width: 600px) {
body::after {
content: 'narrow600'; /* info for JS */
display: none;
}
/* general layout */
a.to-top {
bottom: 40px;
}
/* 404 TEMPLATE */
.default404 .title-bar.outside .page-title{
line-height: 1.1em;
}
/* HEADER */
.admin-bar.header-horizontal #header{
transition: transform .8s cubic-bezier(0.645, 0.045, 0.355, 1), background-color .5s, margin-top .8s;
}
/* flexbox header */
.header-type-multi_line .top-head,
.header-horizontal .head{
display: flex;
align-items: center;
flex-flow: row nowrap;
justify-content: space-between;
}
.header-horizontal .mobile-menu .logo-container{
width: auto;
flex: initial;
display: block;
}
.header-horizontal #header-tools{
padding-left: 0;
margin-right: auto;
display: flex;
flex-flow: row wrap;
justify-content: space-around;
align-items: center;
align-self: stretch;
}
.header-horizontal .head .socials{
padding-right: 10px;
display: flex;
flex-flow: row wrap;
justify-content: space-around;
align-items: center;
align-self: stretch;
}
/* IE 9 overwrites for flex-box */
.lt-ie10 .header-type-multi_line .top-head,
.lt-ie10 .header-horizontal .head{
display: block;
}
.lt-ie10 .header-horizontal .mobile-menu .logo-container{
display: table-cell;
width: 100%;/* We need 100% here so header tools will be pushed to edge */
}
.lt-ie10 .header-horizontal #header-tools {
display: table-cell;
width: calc(100% - 10px);
/*white-space: normal;*/ /* don't break line unless someone will need it */
}
.lt-ie10 .header-horizontal .head .socials{
display: block;
text-align: center;
margin: 5px 0;
}
/* variants different behaviour */
.header-variant-one_line_centered .head{
display: table;
}
.header-variant-one_line_centered #header-tools{
display: block;
}
.header-variant-one_line_centered .head .socials{
padding-right: 0;
display: block;
}
/* the same is defined in desktop styles with #header.header-type-multi_line .head ~1799 */
/*.header-type-multi_line .head{
display: block;
}*/
/* other header changes */
.header-horizontal .head .socials.hide_on_mobile{
display: none;
}
.head .socials a{
margin-right: 3px;
}
.header-horizontal #header-tools::before, .header-horizontal .head .socials::before{
display: none;
}
.tools_button.hide_on_mobile{
display: none;
}
/* vertical header */
.header-vertical #header{
position: relative;
}
.admin-bar.header-vertical #header{
top: 0;
}
/* top bar */
.top-bar-container.hide_on_mobile{
display: none !important;
}
/*noinspection ALL*/
.admin-bar.header-horizontal #header.sticky-hide,
.admin-bar.header-horizontal #header.sticky-hide.narrow-header,
.header-horizontal #header.hide-until-scrolled-to,
.header-horizontal #header.hide-until-scrolled-to.narrow-header{
-webkit-transform: translateY(calc(-102% - 46px));
-ms-transform: translateY(calc(-102% - 46px));
transform: translateY(calc(-102% - 46px));
}
.admin-bar.header-horizontal #header.sticky-values{
margin-top: 0;
/* when scrolled down there is no more admin bar */
}
/* menu overlay */
.admin-bar #menu-overlay,
.admin-bar.site-layout-bordered #menu-overlay,
.admin-bar.site-layout-bordered.no-border-top #menu-overlay{
top: 0;
}
#menu-overlay {
padding: 20px 45px;
}
.admin-bar #menu-overlay {
padding: 45px;
}
.close-menu {
left: 10px;
}
.admin-bar .close-menu{
top: 56px;
}
/* top closable message */
.top-message{
display: block;
}
.top-message .message{
display: block;
min-height: 26px;
height: auto;
}
.top-message .button span{
margin-right: 0;
margin-top: 10px;
}
/* footer */
.foot-items,
#footer .foot-widgets{
padding: 0 40px;
}
.five-col .widget,
.three-col .widget{
width: 46.99%;
}
.three-col .widget:nth-child(3n+1),
.five-col .widget:nth-child(3n+1){
clear: none;
}
.three-col .widget:nth-child(2n+1),
.five-col .widget:nth-child(2n+1){
clear: both;
}
.f-links,
.foot-text {
float: none;
text-align: center;
max-width: none;
}
.f-links + .foot-text{
margin-top: 25px;
}
/* content layouts */
#secondary,
.formatter,
.with-sidebar .formatter{
padding: 40px;
}
.single-post .slidesjs-pagination,
.page .slidesjs-pagination{
margin: 0 40px 20px 0;
}
/* password form */
.post-password-form input{
min-width: 50%;
width: 50%;
}
.post-password-form input[type="submit"]{
min-width: 49.99%;
}
/* posts navigation */
.posts-nav,
.posts-nav a{
display: block;
width: auto;
}
.posts-nav a{
height: auto;
padding: 15px 0;
}
/* comments */
.comments-area,
.with-sidebar .comments-area{
margin: 40px -40px -40px;
padding: 40px;
}
img.avatar{
-webkit-border-radius: 20px;
border-radius: 20px;
height: 40px;
width: 40px;
}
.comment-body, .author-inside{
padding-right: 60px;
}
.comment .comment {
margin-right: 0;
}
/* single album bricks */
.album-content .inside {
padding: 40px !important;
}
/* proofing */
#done-with-proofing div{
padding: 0 20px;
font-size: 16px;
}
/* single album slider */
.slider-controls,
.slide-caption{
bottom: 20px;
}
.slider-arrow{
width: 100px;
}
/* scroller */
.flickity-prev-next-button {
display: none;
}
/* works/albums naviagtion */
.cpt-nav{
height: 60px;
}
.cpt-nav a {
line-height: 60px;
}
/* similar works */
.similar-works .object-item{
width: calc(100% - 10px);
}
/* Post lightbox */
.a13-post-lightbox .controls span{
font-size: 24px;
line-height: 40px;
height: 40px;
width: 40px;
}
.a13-post-lightbox .controls .next{
right: 40px;
}
.a13-post-lightbox-content .page-title{
margin-top: 40px;
}
}
@media only screen and (max-width: 480px) {
/* wp-gallery */
.gallery .gallery-item{
max-width: 50%;
}
.gallery-columns-1 .gallery-item{
max-width: 100%;
}
/* footer */
.foot-widgets .foot-content{
margin-right: 0;
}
/* full width widgets */
#secondary .widget:nth-child(n),
.foot-widgets .widget{
width: 100%;
margin-right: 0;
float: none;
}
/* center widgets content */
.widget{
text-align: center;
}
.widget h3.title{
text-align: center;
}
.widget_contact_info .with_icon{
padding-right: 0;
}
.widget_contact_info .with_icon > i{
position: static;
display: inline-block;
margin-left: 10px;
}
.widget_nav_menu li li a,
.widget_nav_menu li li li a{
padding-right: 0;
}
.widget .socials{
text-align: center;
}
/* COLUMNS */
.left50,
.right50{
width: auto;
float: none;
margin: 0;
}
}
@media only screen and (max-width: 400px) {
/* header */
.header-vertical .logo-container {
padding: 0 20px;
max-width: 50%;
}
.header-vertical #header .logo-container{
padding-right: 20px;
}
.header-vertical #header #header-tools{
padding-left: 20px;
}
.top-bar-container .top-bar,
.header-horizontal #header .head{
padding-left: 20px;
padding-right: 20px;
}
.header-type-multi_line .top-head{
padding: 0;
}
/* MOBILE MENU */
.mobile-menu .navigation-bar .top-menu li a,
.mobile-menu .navigation-bar .top-menu li span.title,
.mobile-menu .navigation-bar .top-menu li li a,
.mobile-menu .navigation-bar .top-menu li li span.title{
padding: 0 20px;
}
.mobile-menu .navigation-bar .top-menu.opener-icons-on li.menu-parent-item > a,
.mobile-menu .navigation-bar .top-menu.opener-icons-on li.menu-parent-item > span.title {
padding-right: 46px;
padding-left: 46px;
}
.mobile-menu .navigation-bar .top-menu i.sub-mark{
left: 18px;
}
/* header search */
.search-container .search{
padding: 0 20px;
}
.search-container .close{
left: 20px;
}
.search-container .a13icon-search{
right: 20px;
}
/* title bar */
.title-bar.outside .overlay-color {
padding: 20px;
}
/* footer */
.foot-items,
#footer .foot-widgets{
padding: 0 20px;
}
/* content layouts */
.formatter,
.with-sidebar .formatter{
padding: 20px;
}
#secondary,
#side-menu div.scroll-wrap{
padding: 40px 20px;
}
.single-post .slidesjs-pagination,
.page .slidesjs-pagination{
margin-right: 20px;
}
/* comments */
.comments-area,
.with-sidebar .comments-area{
margin: 40px -20px -20px;
padding: 20px;
}
/* single album bricks */
.album-content .inside {
padding: 20px !important;
}
.object-item .caption{
padding: 20px;
}
.variant-overlay .texts_group{
right: 20px;
left: 20px;
}
.title-top .texts_group{
top: 20px;
}
.title-bottom .texts_group{
bottom: 20px;
}
/* single album slider */
.slide-caption{
right: 20px;
left: 20px;
}
.slider-controls{
left: 20px;
}
.slider-arrow{
width: 70px;
}
}