2020-03-11 14:44:42 +01:00
/ *
Theme Name : Magaziner
Theme URI : http : / / alx . media / themes / magaziner /
2022-12-22 13:52:22 +01:00
Version : 3 . 2 . 1
2020-07-12 11:17:58 +02:00
Requires at least : 5 . 0
Requires PHP : 5 . 6
2022-11-21 12:20:09 +01:00
Tested up to : 6 . 1
2022-12-22 13:52:22 +01:00
Description : < a href = "http://alx.media/themes/magaziner/" > Magaziner < / a > is a responsive 100 % high resolution theme for blogs and magazines . Unique toggle sidebars give a great browsing and reading experience on both tablet and mobile . The feature list is long : Unlimited accent colors , unlimited widget areas , 0-2 sidebars to the left or right that can be uniquely specified for each page or post , 0-4 footer widget columns , almost zero layout images , related posts and post nav , featured stories and carousel , 5 post formats , good SEO , 2 flexible custom widgets , localisation support , social links , logo upload and many more useful admin panel features . Demo : http : / / demo . alx . media / x / ? theme = Magaziner
2020-03-11 14:44:42 +01:00
Author : Alexander Agnarson
Author URI : http : / / alx . media
2022-11-21 12:20:09 +01:00
Tags : blog , one-column , two-columns , three-columns , right-sidebar , left-sidebar , custom-colors , custom-menu , featured-images , flexible-header , full-width-template , post-formats , sticky-post , theme-options , threaded-comments , translation-ready , custom-logo , custom-header , custom-background , news , entertainment , footer-widgets
2020-03-11 14:44:42 +01:00
Text Domain : magaziner
Copyright : ( c ) 2019 Alexander "Alx" Agnarson
License : GNU General Public License v3 . 0
License URI : http : / / www . gnu . org / licenses / gpl-3 . 0 . html
* /
/ *
WARNING ! DO NOT EDIT THIS FILE !
To make it easy to update your theme , you should not edit the styles in this file . Instead use a child theme
to add your styles . You can copy a style from this file and paste it in the child theme ' s style . css and it
will override the style in this file . You have been warned ! : )
* /
/ * ------------------------------------------------------------------------- *
* Table of contents
1 . Reset
2 . Base Styles
- Fonts
- Forms
- Entry Text
-- Image Position & Caption
-- Table
-- Default Gallery
- Headings
3 . Base Structure
- Layout
- Layout Columns
- Sidebar
- Grid
4 . Common Elements
- Responsive Videos
- Responsive Image
- Social Links
- Page Title
- Notebox
- Pagination
- Thumb Icon
- Nav
5 . Header
- Search
- Nav Topbar
- Nav Header
6 . Subheader
7 . Page
8 . Footer
- Nav Footer
9 . Post Entry
10 . Post Formats
11 . Widgets
12 . Comments
13 . Child Menu
14 . Plugins
- WP-Pagenavi
- Contact Form 7
- Social Count Plus
15 . Flexslider
16 . Owl Carousel
/* ------------------------------------------------------------------------- */
/ * ------------------------------------------------------------------------- *
* Reset - http : / / meyerweb . com / eric / tools / css / reset / v2 . 0 | 20110126
* ------------------------------------------------------------------------- * /
html , body , div , span , applet , object , iframe , h1 , h2 , h3 , h4 , h5 , h6 , p , blockquote ,
pre , a , abbr , acronym , address , big , cite , code , del , dfn , em , img , ins , kbd , q , s ,
samp , small , strike , strong , sub , sup , tt , var , b , u , i , center , dl , dt , dd , ol , ul , li ,
fieldset , form , label , legend , table , caption , tbody , tfoot , thead , tr , th , td , article , aside ,
canvas , details , embed , figure , figcaption , footer , header , hgroup , menu , nav , output , ruby ,
section , summary , time , mark , audio , video { margin : 0 ; padding : 0 ; border : 0 ; font-size : 100 % ; font : inherit ; vertical-align : baseline ; }
article , aside , details , figcaption , figure , footer , header , hgroup , menu , nav , section { display : block ; }
ol , ul { list-style : none ; }
blockquote , q { quotes : none ; }
blockquote : before , blockquote : after , q : before , q : after { content : '' ; content : none ; }
table { border-collapse : collapse ; border-spacing : 0 ; }
/ * ------------------------------------------------------------------------- *
* Base Styles
/* ------------------------------------------------------------------------- */
html { box-sizing : border-box ; }
* , * : before , * : after { box-sizing : inherit ; }
body { background : #fff ; font-size : 16 px ; line-height : 1.5 em ; color : #555 ; font-weight : 300 ; }
:: selection { background : #5299eb ; color : #fff ; }
:: -moz-selection { background : #5299eb ; color : #fff ; }
2020-08-26 16:50:22 +02:00
a { color : #5299eb ; text-decoration : none ; }
2020-03-11 14:44:42 +01:00
a : hover { color : #555 ; }
img { max-width : 100 % ; height : auto ; border-radius : 30 px ; }
a ,
a : before ,
a : after {
-webkit-transition : all 0 . 2s ease ;
-moz-transition : all 0 . 2s ease ;
-o-transition : all 0 . 2s ease ;
transition : all 0 . 2s ease ; }
a img {
-webkit-transition : opacity 0 . 2s ease ;
-moz-transition : opacity 0 . 2s ease ;
-o-transition : opacity 0 . 2s ease ;
transition : opacity 0 . 2s ease ; }
address , cite , em { font-style : italic ; }
strong { font-weight : 600 ; }
2022-05-30 09:41:18 +02:00
ol , ul { box-sizing : content-box ; }
2020-03-11 14:44:42 +01:00
. left , . alignleft { float : left ; }
. right , . alignright { float : right ; }
. aligncenter { margin-left : auto ; margin-right : auto ; }
hr { border : 0 ; background : #eee ; height : 3 px ; margin : 30 px 0 ; }
/ * base : clear
/* ------------------------------------ */
. clear { clear : both ; display : block ; overflow : hidden ; visibility : hidden ; width : 0 ; height : 0 ; }
. group : before , . group : after { content : "" ; display : table ; }
. group : after { clear : both ; }
. group { zoom : 1 ; }
/ * base : font awesome square size
/* ------------------------------------ */
. fa , . fab , . fal , . far , . fas { width : 1 em ; text-align : center ; }
/ * base : fonts
/* ------------------------------------ */
body { font-family : "Titillium" , Arial , sans-serif ; }
@ font-face {
font-family : 'Titillium' ;
src : url ( 'fonts/titillium-light-webfont.eot' ) ;
src : url ( 'fonts/titillium-light-webfont.svg#titillium-light-webfont' ) format ( 'svg' ) ,
url ( 'fonts/titillium-light-webfont.eot?#iefix' ) format ( 'embedded-opentype' ) ,
url ( 'fonts/titillium-light-webfont.woff' ) format ( 'woff' ) ,
url ( 'fonts/titillium-light-webfont.ttf' ) format ( 'truetype' ) ;
font-weight : 300 ;
font-style : normal ;
}
@ font-face {
font-family : 'Titillium' ;
src : url ( 'fonts/titillium-lightitalic-webfont.eot' ) ;
src : url ( 'fonts/titillium-lightitalic-webfont.svg#titillium-lightitalic-webfont' ) format ( 'svg' ) ,
url ( 'fonts/titillium-lightitalic-webfont.eot?#iefix' ) format ( 'embedded-opentype' ) ,
url ( 'fonts/titillium-lightitalic-webfont.woff' ) format ( 'woff' ) ,
url ( 'fonts/titillium-lightitalic-webfont.ttf' ) format ( 'truetype' ) ;
font-weight : 300 ;
font-style : italic ;
}
@ font-face {
font-family : 'Titillium' ;
src : url ( 'fonts/titillium-regular-webfont.eot' ) ;
src : url ( 'fonts/titillium-regular-webfont.svg#titillium-regular-webfont' ) format ( 'svg' ) ,
url ( 'fonts/titillium-regular-webfont.eot?#iefix' ) format ( 'embedded-opentype' ) ,
url ( 'fonts/titillium-regular-webfont.woff' ) format ( 'woff' ) ,
url ( 'fonts/titillium-regular-webfont.ttf' ) format ( 'truetype' ) ;
font-weight : 400 ;
font-style : normal ;
}
@ font-face {
font-family : 'Titillium' ;
src : url ( 'fonts/titillium-regularitalic-webfont.eot' ) ;
src : url ( 'fonts/titillium-regularitalic-webfont.svg#titillium-regular-webfont' ) format ( 'svg' ) ,
url ( 'fonts/titillium-regularitalic-webfont.eot?#iefix' ) format ( 'embedded-opentype' ) ,
url ( 'fonts/titillium-regularitalic-webfont.woff' ) format ( 'woff' ) ,
url ( 'fonts/titillium-regularitalic-webfont.ttf' ) format ( 'truetype' ) ;
font-weight : 400 ;
font-style : italic ;
}
@ font-face {
font-family : 'Titillium' ;
src : url ( 'fonts/titillium-semibold-webfont.eot' ) ;
src : url ( 'fonts/titillium-semibold-webfont.svg#titillium-semibold-webfont' ) format ( 'svg' ) ,
url ( 'fonts/titillium-semibold-webfont.eot?#iefix' ) format ( 'embedded-opentype' ) ,
url ( 'fonts/titillium-semibold-webfont.woff' ) format ( 'woff' ) ,
url ( 'fonts/titillium-semibold-webfont.ttf' ) format ( 'truetype' ) ;
font-weight : 600 ;
font-style : normal ;
}
/ * base : forms
/* ------------------------------------ */
input , textarea , button , select , label { font-family : inherit ; }
. themeform input ,
. themeform select ,
. themeform textarea ,
. themeform button ,
. themeform label { font-size : 14 px ; }
. themeform input :: -moz-focus-inner ,
. themeform button :: -moz-focus-inner { border : 0 ; padding : 0 ; }
. themeform input [ type = "search" ] ,
. themeform input [ type = "text" ] ,
. themeform input [ type = "password" ] ,
. themeform input [ type = "email" ] ,
. themeform input [ type = "url" ] ,
. themeform input [ type = "tel" ] ,
. themeform input [ type = "number" ] ,
. themeform input [ type = "submit" ] ,
. themeform select ,
. themeform button ,
. themeform textarea { margin : 0 ; -moz- box-sizing : border-box ; -webkit- box-sizing : border-box ; box-sizing : border-box ; border-radius : 30 px ; }
. themeform input ,
. themeform select ,
. themeform textarea ,
. themeform button { -moz- appearance : none ; -webkit- appearance : none ; -moz- transition : all .2 s ease ; -webkit- transition : all .2 s ease ; transition : all .2 s ease ; }
. themeform select { appearance : normal ; -moz- appearance : menulist ; -webkit- appearance : menulist ; }
. themeform input [ type = "checkbox" ] { -moz- appearance : checkbox ; -webkit- appearance : checkbox ; }
. themeform input [ type = "radio" ] { -moz- appearance : radio ; -webkit- appearance : radio ; }
. themeform label { font-weight : 600 ; color : #333 ; }
. themeform input [ type = "search" ] ,
. themeform input [ type = "text" ] ,
. themeform input [ type = "password" ] ,
. themeform input [ type = "email" ] ,
. themeform input [ type = "url" ] ,
. themeform input [ type = "tel" ] ,
. themeform input [ type = "number" ] ,
. themeform select ,
. themeform textarea { background : #fff ; border : 2 px solid #eee ; color : #777 ; display : block ; max-width : 100 % ; outline : none ; padding : 7 px 8 px ; }
. themeform input [ type = "search" ] : focus ,
. themeform input [ type = "text" ] : focus ,
. themeform input [ type = "password" ] : focus ,
. themeform input [ type = "email" ] : focus ,
. themeform input [ type = "url" ] : focus ,
. themeform input [ type = "tel" ] : focus ,
. themeform input [ type = "number" ] : focus ,
. themeform select : focus ,
. themeform textarea : focus { border-color : #ccc ; color : #333 ; -webkit- box-shadow : 0 0 3 px rgba ( 0 , 0 , 0 , 0.1 ) ; box-shadow : 0 0 3 px rgba ( 0 , 0 , 0 , 0.1 ) ; }
. themeform label . required { color : #5299eb ; }
. themeform input [ type = "button" ] ,
. themeform input [ type = "reset" ] ,
. themeform input [ type = "submit" ] ,
. themeform button [ type = "button" ] ,
. themeform button [ type = "reset" ] ,
. themeform button [ type = "submit" ] { background : #5299eb ; color : #fff ; padding : 8 px 14 px ; font-weight : 600 ; display : inline-block ; border : none ; cursor : pointer ; border-radius : 30 px ; }
. themeform input [ type = "button" ] : hover ,
. themeform input [ type = "reset" ] : hover ,
. themeform input [ type = "submit" ] : hover ,
. themeform button [ type = "button" ] : hover ,
. themeform button [ type = "reset" ] : hover ,
. themeform button [ type = "submit" ] : hover { background : #333 ; }
. themeform . searchform div { position : relative ; }
. themeform . searchform div input { padding-left : 26 px ; line-height : 20 px ; }
. themeform . searchform div : after { color : #ccc ; line-height : 24 px ; font-size : 14 px ; content : "\f002" ; position : absolute ; left : 10 px ; top : 6 px ; font-family : "Font Awesome 5 Free" ; font-weight : 900 ; }
/ * base : entry
/* ------------------------------------ */
. entry { font-size : 17 px ; line-height : 1.6 em ; }
. entry . excerpt { font-size : 16 px ; color : #333 ; }
2022-11-21 12:20:09 +01:00
. entry a { text-decoration : underline ; }
2020-03-11 14:44:42 +01:00
. entry p ,
. entry dd { margin-bottom : 1 em ; }
. entry dt { color : #333 ; }
. entry ol ,
. entry ul { margin : 0 0 15 px 30 px ; }
. entry ol ol ,
. entry ol ul ,
. entry ul ul ,
. entry ul ol { margin-bottom : 0 ; }
. entry li { margin : 0 ; }
. entry ul li ,
. entry ol ul li { list-style : square ; }
. entry ol li ,
. entry ol ul ol li { list-style : decimal ; }
. entry dt { font-weight : 600 ; }
. entry address { margin-bottom : 1 em ; }
2020-03-24 14:08:19 +01:00
. entry blockquote { position : relative ; font-style : italic ; margin : 0 0 20 px 0 ; padding-left : 50 px ; }
2020-03-11 14:44:42 +01:00
. entry blockquote p { margin-bottom : 0.75 em ; }
. entry blockquote : before { content : "\f10d" ; color : #ccc ; font-size : 32 px ; font-style : normal ; font-family : "Font Awesome 5 Free" ; font-weight : 900 ; text-align : center ; position : absolute ; left : 0 ; top : 0 ; }
. entry blockquote . twitter-tweet : before { content : "\f099" ; }
. entry code , . entry pre { font-family : Monaco , "Courier New" , "DejaVu Sans Mono" , "Bitstream Vera Sans Mono" , monospace ; font-size : 11 px ; }
. entry pre { background : url ( img/pre.png ) repeat top ; padding : 18 px 20 px ; margin : 30 px 0 ; border : 1 px solid #ddd ; line-height : 19 px ; white-space : pre-wrap ; word-wrap : break-word ; overflow-x : auto ; overflow-y : hidden ; }
. entry code { background : #f2f2f2 ; padding : 0 3 px ; }
. entry ins { background : #fff486 ; }
. entry sub ,
. entry sup { font-size : 62.5 % ; }
. entry sub { vertical-align : sub ; }
. entry sup { vertical-align : super ; }
/* image position & caption */
. entry img . size-auto ,
. entry img . size-large ,
. entry img . size-medium ,
. entry attachment img { max-width : 100 % ; height : auto ; }
. entry img . alignleft { margin : 18 px 20 px 18 px 0 ; }
. entry img . alignright { margin : 18 px 0 18 px 20 px ; }
. entry img . aligncenter { margin : 18 px auto ; clear : both ; display : block ; }
. entry img . size-full { width : 100 % !important ; }
. entry . gallery img , . entry img . wp-smiley { margin : 0 ; }
. entry . wp-caption { max-width : 100 % ; margin-bottom : 14 px ; padding-top : 5 px ; text-align : center ; }
. entry . wp-caption-text { font-style : italic ; }
. entry . wp-caption a { border-bottom : none ; }
. entry . wp-caption img { margin : 0 ; max-width : 100 % ; height : auto ; }
. entry . wp-caption . alignleft { margin-right : 20 px ; }
. entry . wp-caption . alignright { margin-left : 20 px ; }
. entry . wp-caption . alignnone { width : 100 % !important ; overflow : hidden ; }
. entry . wp-caption . alignnone img { margin : 0 auto ; max-width : 100 % !important ; }
. entry . wp-caption-text { color : #999 ; font-size : 13 px ; padding : 0 0 8 px 0 ; margin : 0 ; }
/* table */
. entry table { font-size : 14 px ; margin-bottom : 1.5 em ; width : 100 % ; text-align : center ; }
. entry table tr . alt { background : #fff ; }
. entry table td { border : 1 px solid #ddd ; text-align : center ; padding : 5 px ; vertical-align : middle ; }
. entry table th { border : 1 px solid #ddd ; font-weight : 600 ; text-align : center ; padding : 10 px 5 px ; }
/* default gallery */
. entry . gallery ,
. widget . gallery { clear : both ; overflow : hidden ; width : 100 % ; margin : 15 px 0 !important ; }
. entry . gallery img ,
. widget . gallery img { display : block ; width : 100 % ; height : auto ; border-width : 1 px 2 px !important ; border-color : transparent !important ; }
. entry . gallery . gallery-item ,
. widget . gallery . gallery-item { position : relative ; overflow : hidden ; border-color : transparent ; margin-top : 0 !important ; }
. entry . gallery . gallery-caption ,
. widget . gallery . gallery-caption { background : rgba ( 255 , 255 , 255 , 0.8 ) ; color : #333 ; font-size : 13 px ; line-height : 1.4 em ; padding : 10 px 0 ; text-align : left ; text-indent : 10 px ; font-style : normal ; margin : 0 ; bottom : -44 px ; left : 2 px ; right : 2 px ; overflow : hidden ; position : absolute ; text-overflow : ellipsis ; white-space : nowrap ; width : 100 % ;
border-radius : 0 0 30px 30px ;
transition : all . 2s ease ;
-o-transition : all . 2s ease ;
-moz-transition : all . 2s ease ;
-webkit-transition : all . 2s ease ; }
. entry . gallery . gallery-item : hover . gallery-caption { bottom : 0 ; }
. entry . gallery-columns-5 . gallery-caption ,
. entry . gallery-columns-6 . gallery-caption ,
. entry . gallery-columns-7 . gallery-caption ,
. entry . gallery-columns-8 . gallery-caption ,
. entry . gallery-columns-9 . gallery-caption ,
. widget . gallery-columns-2 . gallery-caption ,
. widget . gallery-columns-3 . gallery-caption ,
. widget . gallery-columns-4 . gallery-caption ,
. widget . gallery-columns-5 . gallery-caption ,
. widget . gallery-columns-6 . gallery-caption ,
. widget . gallery-columns-7 . gallery-caption ,
. widget . gallery-columns-8 . gallery-caption ,
. widget . gallery-columns-9 . gallery-caption { display : none !important ; }
/ * base : headings
/* ------------------------------------ */
h1 , h2 , h3 , h4 , h5 , h6 { color : #333 ; font-weight : 600 ; -ms- word-wrap : break-word ; word-wrap : break-word ; }
. entry h1 span , . entry h2 span , . entry h3 span , . entry h4 span , . entry h5 span , . entry h6 span { color : #bbb ; }
. entry h1 , . entry h2 , . entry h3 , . entry h4 , . entry h5 , . entry h6 { margin-bottom : 14 px ; font-weight : 600 ; line-height : 1.3 em ; }
. entry h1 { font-size : 34 px ; letter-spacing : -1 px ; }
. entry h2 { font-size : 30 px ; letter-spacing : -0.7 px ; }
. entry h3 { font-size : 26 px ; letter-spacing : -0.5 px ; }
. entry h4 { font-size : 22 px ; letter-spacing : -0.3 px ; }
. entry h5 { font-size : 18 px ; font-weight : 600 ; }
. entry h6 { font-size : 14 px ; font-weight : 600 ; }
. heading ,
# reply-title { font-weight : normal ; font-size : 18 px ; font-weight : 600 ; margin-bottom : 1 em ; }
. heading i { font-size : 22 px ; margin-right : 6 px ; }
2020-03-24 14:08:19 +01:00
/ * ------------------------------------------------------------------------- *
* Gutenberg
/* ------------------------------------------------------------------------- */
. entry . wp-block-image figcaption ,
. entry . wp-block-audio figcaption ,
. entry . wp-block-embed figcaption { font-size : 14 px ; text-align : center ; }
. entry . wp-block-gallery { padding : 0 ; margin-left : 0 ; }
. entry . wp-block-gallery . blocks-gallery-grid { margin : 0 ; padding : 0 ; }
. entry . wp-block-gallery . blocks-gallery-item figcaption { box-sizing : border-box ; }
. entry . wp-block-quote { margin-bottom : 20 px ; }
. entry . wp-block-quote . is-large { padding-left : 50 px ; }
. entry . wp-block-pullquote . alignleft { margin-right : 2 em ; }
. entry . wp-block-pullquote . alignright { margin-left : 2 em ; }
. entry . wp-block-pullquote blockquote { padding-left : 50 px ; text-align : left ; }
. entry . wp-block-pullquote blockquote p { line-height : 1.4 em ; }
2020-03-11 14:44:42 +01:00
/ * ------------------------------------------------------------------------- *
* Base Structure
/* ------------------------------------------------------------------------- */
/ * base : layout
/* ------------------------------------ */
# wrapper { background : #f4f4f4 ; min-width : 1024 px ; height : 100 % ; }
. container { position : relative ; margin : 0 auto ; max-width : 1680 px ; }
# page . container { }
. main { position : relative ; }
2020-08-26 16:50:22 +02:00
. main-inner { position : relative ; min-height : 1100 px ; /* instead of sticky footer */ }
2020-03-11 14:44:42 +01:00
. content { width : 100 % ; position : relative ; min-height : 800 px ; }
. content-inner ,
. page-title-inner { margin : 0 auto ; }
. pad { padding : 30 px 30 px 20 px ; }
/* boxed */
body . boxed { background : #ddd ; }
. boxed # wrapper { background : #fff ; max-width : 1680 px ; margin : 0 auto ; -webkit- box-shadow : 0 0 20 px rgba ( 0 , 0 , 0 , 0.1 ) ; box-shadow : 0 0 20 px rgba ( 0 , 0 , 0 , 0.1 ) ; }
/ * base : layout columns
/* ------------------------------------ */
/* 2 column, content left */
. col-2cl . main-inner { padding-right : 340 px ; }
. col-2cl . s1 { float : right ; margin-right : -340 px ; }
. col-2cl . content { float : left ; }
/* 2 column, content right */
. col-2cr . main-inner { padding-left : 340 px ; }
. col-2cr . s1 { float : left ; margin-left : -340 px ; }
. col-2cr . content { float : right ; }
/* 3 column, content middle */
. col-3cm . main { }
. col-3cm . main-inner { padding-left : 340 px ; padding-right : 340 px ; }
. col-3cm . s1 { float : left ; margin-left : -340 px ; }
. col-3cm . s2 { float : right ; margin-right : -340 px ; /* ingenuity! */ position : relative ; right : -100 % ; }
. col-3cm . content { float : right ; }
/* 3 column, content left */
. col-3cl . main { background-image : none ; }
. col-3cl . main-inner { padding-right : 680 px ; }
. col-3cl . s1 { float : right ; margin-right : -680 px ; }
. col-3cl . s2 { float : right ; margin-right : -340 px ; }
. col-3cl . content { float : left ; }
/* 3 column, content right */
. col-3cr . main { background-image : none ; }
. col-3cr . main-inner { padding-left : 680 px ; }
. col-3cr . s1 { float : left ; margin-left : -680 px ; }
. col-3cr . s2 { float : left ; margin-left : -340 px ; }
. col-3cr . content { float : right ; }
/ * base : sidebar
/* ------------------------------------ */
. sidebar { position : relative ; z-index : 2 ; }
. sidebar . pad { padding-left : 20 px ; padding-right : 20 px ; }
. sidebar-toggle { background : #5299eb ; display : none ; text-align : center ; cursor : pointer ; width : 100 % ; margin-top : 30 px ;
-webkit-box-shadow : inset 1px 0 0 rgba ( 0 , 0 , 0 , 0 . 1 ) ;
box-shadow : inset 1px 0 0 rgba ( 0 , 0 , 0 , 0 . 1 ) ; }
. sidebar-toggle i { font-size : 24 px ; color : #fff ; padding : 13 px 0 ; }
. s1-expand . s1 ,
. s2-expand . s2 { border-top : 0 ; -moz- transition : width .2 s ease ; -webkit- transition : width .2 s ease ; transition : width .2 s ease ; }
/* toggle icon */
. icon-sidebar-toggle : before { font-family : "Font Awesome 5 Free" ; font-weight : 900 ; }
. col-2cl . s1 . icon-sidebar-toggle : before ,
. col-3cl . s1 . icon-sidebar-toggle : before ,
. col-3cm . s2 . icon-sidebar-toggle : before ,
. col-3cl . s2 . icon-sidebar-toggle : before { content : "\f060" ; }
. col-2cr . s1 . icon-sidebar-toggle : before ,
. col-3cm . s1 . icon-sidebar-toggle : before ,
. col-3cr . s1 . icon-sidebar-toggle : before ,
. col-3cr . s2 . icon-sidebar-toggle : before { content : "\f061" ; }
. sidebar-toggle { width : 70 px ; height : 50 px ; }
. col-2cr . s1 . sidebar-toggle { margin-left : 0 ; margin-right : -20 px ; border-radius : 0 30 px 30 px 0 ; }
. col-2cr . s1-expand . sidebar-toggle { float : right ; margin-right : 0 ; border-radius : 30 px 0 0 30 px ; }
. col-2cl . sidebar-toggle { margin-left : -40 px ; border-radius : 30 px 0 0 30 px ; }
. col-2cl . s1-expand . sidebar-toggle { margin-left : 0 ; border-radius : 0 30 px 30 px 0 ; }
. col-3cl . sidebar-toggle { width : 70 px ; margin-left : -40 px ; border-radius : 30 px 0 0 30 px ; }
. col-3cl . s1-expand . sidebar-toggle { float : left ; border-radius : 0 30 px 30 px 0 ; }
. col-3cl . s1-expand . s1 . sidebar-toggle { margin-left : 0 ; margin-top : 30 px ; }
. col-3cl . s2-expand . s2 . sidebar-toggle { margin-left : 0 ; border-radius : 0 30 px 30 px 0 ; margin-top : 30 px ; }
. col-3cl . s1 . sidebar-toggle { margin-top : 90 px ; }
. col-3cr . sidebar-toggle { width : 70 px ; margin-right : -20 px ; border-radius : 0 30 px 30 px 0 ; }
. col-3cr . s1-expand . sidebar-toggle ,
. col-3cr . s2-expand . sidebar-toggle { float : right ; margin-right : 0 ; border-radius : 30 px 0 0 30 px ; }
. col-3cr . s1-expand . s1 . sidebar-toggle { margin-top : 30 px ; }
. col-3cr . s2-expand . s1 . sidebar-toggle { margin-right : -10 px ; }
. col-3cr . s1 . sidebar-toggle { margin-top : 90 px ; }
. col-3cm . s1 . sidebar-toggle { margin-left : 0 ; margin-right : -20 px ; border-radius : 0 30 px 30 px 0 ; }
. col-3cm . s1-expand . sidebar-toggle { float : right ; margin-right : 0 ; }
. col-3cm . s2 . sidebar-toggle { margin-left : -40 px ; }
. col-3cm . s2-expand . sidebar-toggle { margin-left : 0 ; }
. col-3cm . s1-expand . s1 . sidebar-toggle { border-radius : 30 px 0 0 30 px ; }
. col-3cm . s2-expand . s2 . sidebar-toggle { border-radius : 0 30 px 30 px 0 ; }
. col-3cm . s2 . sidebar-toggle { border-radius : 30 px 0 0 30 px ; }
/* sidebar primary */
. s1 { width : 340 px ; z-index : 2 ; }
/* sidebar secondary */
. s2 { width : 340 px ; z-index : 1 ; }
/ * base : grid
/* ------------------------------------ */
. grid { margin-right : 3.2 % ; float : left ; display : inline ; position : relative ; }
. last { clear : right ; margin-right : 0 !important ; }
. one-full { margin-right : 0 ; width : 100 % ; overflow : hidden ; }
. one-half { width : 48.4 % ; }
. one-third { width : 31.2 % ; }
. two-third { width : 65.6 % ; }
. one-fourth { width : 22.6 % ; }
. three-fourth { width : 74.2 % ; }
. one-fifth { width : 17.4 % ; }
. two-fifth { width : 38.1 % ; }
. three-fifth { width : 58.7 % ; }
. four-fifth { width : 79.4 % ; }
/ * ------------------------------------------------------------------------- *
* Common Elements
/* ------------------------------------------------------------------------- */
/ * common : responsive videos
/* ------------------------------------ */
embed , object , iframe { max-width : 100 % ; }
. video-container { height : auto !important ; max-width : 100 % !important ; text-align : center ; }
. video-container iframe { margin : 0 auto ; }
. video-container > div { margin : 0 auto ; }
/ * common : responsive image + caption
/* ------------------------------------ */
. image-container { position : relative ; }
. image-container img { display : block ; width : 100 % ; height : auto ; margin-bottom : 30 px ; }
. image-caption { background : rgba ( 0 , 0 , 0 , 0.7 ) ; color : #fff ; font-size : 13 px ; line-height : 1.3 em ; font-style : italic ; padding : 8 px 10 px ; position : absolute ; z-index : 1 ; bottom : 8 px ; left : 8 px ; margin-right : 8 px ;
border-radius : 2px ;
-webkit-box-shadow : inset 0 1px 1px rgba ( 0 , 0 , 0 , 0 . 4 ) , 0 1px 0 rgba ( 255 , 255 , 255 , 0 . 03 ) ;
box-shadow : inset 0 1px 1px rgba ( 0 , 0 , 0 , 0 . 4 ) , 0 1px 0 rgba ( 255 , 255 , 255 , 0 . 03 ) ; }
/ * common : social links
/* ------------------------------------ */
. social-links { float : right ; position : relative ; padding-top : 5 px ; }
. social-links li { display : inline-block ; margin-left : 8 px ; line-height : 16 px ; font-size : 0 ; }
. social-links li a { display : block !important ; position : relative ; text-align : center ; }
. social-links . social-tooltip { color : #fff ; color : rgba ( 255 , 255 , 255 , 0.7 ) ; font-size : 24 px ; display : inline ; position : relative ; z-index : 9 ; }
. social-links . social-tooltip : hover { color : #fff ; text-decoration : none ; }
. social-links . social-tooltip : hover : after { top : -36 px ; background : #fff ; font-size : 14 px ; color : #666 ; content : attr ( title ) ; display : block ; right : 0 ; padding : 5 px 15 px ; position : absolute ; white-space : nowrap ;
border-radius : 3px ;
-webkit-box-shadow : 0 0 2px rgba ( 0 , 0 , 0 , 0 . 2 ) ; box-shadow : 0 0 2px rgba ( 0 , 0 , 0 , 0 . 2 ) ; }
. social-links . social-tooltip : hover : before { top : -10 px ; right : 8 px ; border : solid ; border-color : #fff transparent ; border-width : 5 px 5 px 0 5 px ; content : "" ; display : block ; position : absolute ; z-index : 1 ; }
/ * common : page title
/* ------------------------------------ */
. page-title { background : #262626 ; color : rgba ( 255 , 255 , 255 , 0.9 ) ; font-size : 17 px ; position : relative ; padding : 30 px 0 30 px ; }
. home . page-title ,
. category . page-title { padding-bottom : 100 px ; }
. category . paged . page-title { padding-bottom : 30 px ; }
. page-title . pad { padding-top : 0 ; padding-bottom : 0 ; }
. page-title span { color : rgba ( 255 , 255 , 255 , 0.6 ) ; }
. page-title a ,
. page-title a : hover { color : #333 ; }
. page-title h1 i ,
. page-title h2 i ,
2020-12-05 12:38:48 +01:00
. page-title h4 i { font-weight : 900 ; margin-right : 6 px ; color : rgba ( 255 , 255 , 255 , 0.2 ) ; }
2020-03-11 14:44:42 +01:00
. page-title h1 ,
. page-title h2 ,
. page-title h4 { color : rgba ( 255 , 255 , 255 , 0.9 ) ; font-weight : 600 ; }
/ * common : notebox
/* ------------------------------------ */
. notebox { background : #fff ; padding : 20 px ; border-radius : 30 px ; margin-bottom : 30 px ; font-weight : 400 ; color : rgba ( 0 , 0 , 0 , 0.5 ) ; position : relative ; box-shadow : 0 3 px 5 px rgba ( 0 , 0 , 0 , 0.03 ) , 0 1 px 1 px rgba ( 0 , 0 , 0 , 0.05 ) ; }
. notebox span { font-weight : 600 ; }
. notebox . search-again { margin-top : 10 px ; }
. notebox input [ type = "text" ] { width : 100 % ; }
/ * common : pagination
/* ------------------------------------ */
. pagination { margin : 30 px 0 ; }
. pagination a { font-size : 18 px ; font-weight : 600 ; }
/ * common : thumb icon
/* ------------------------------------ */
. thumb-icon { background : rgba ( 0 , 0 , 0 , 0.5 ) ; color : #fff ; text-align : center ; display : block ; width : 32 px ; height : 32 px ; position : absolute ; bottom : 50 % ; left : 50 % ; margin : 0 0 -16 px -16 px ; border-radius : 3 px ;
-moz-transition : all 0 . 7s ease ; -webkit-transition : all 0 . 7s ease ; transition : all 0 . 7s ease ;
-webkit-box-shadow : 0 0 2px rgba ( 255 , 255 , 255 , 0 . 4 ) ;
box-shadow : 0 0 2px rgba ( 255 , 255 , 255 , 0 . 4 ) ;
-webkit-transform : rotate ( 45deg ) ;
-moz-transform : rotate ( 45deg ) ;
-ms-transform : rotate ( 45deg ) ;
-o-transform : rotate ( 45deg ) ;
transform : rotate ( 45deg ) ; }
. thumb-icon i { font-size : 18 px ; padding : 7 px 0 ;
-webkit-transform : rotate ( -45deg ) ;
-moz-transform : rotate ( -45deg ) ;
-ms-transform : rotate ( -45deg ) ;
-o-transform : rotate ( -45deg ) ;
transform : rotate ( -45deg ) ; }
. thumb-icon . fa-play { margin : -1 px 0 0 2 px ; }
. thumb-icon . small { width : 24 px ; height : 24 px ; position : absolute ; bottom : 50 % ; left : 50 % ; margin : 0 0 -12 px -12 px ; border-radius : 2 px ; }
. thumb-icon . small i { font-size : 14 px ; line-height : 16 px ; padding : 5 px 0 ; }
. thumb-icon . small . f-play { margin : -1 px 0 0 2 px ; }
/ * ------------------------------------------------------------------------- *
* Section : Header
/* ------------------------------------------------------------------------- */
# header-ads { background : #fff ; text-align : center ; padding : 10 px 0 ; border-bottom : 1 px solid #eee ; }
# header-ads . widget { padding-bottom : 0 ; font-size : 0 ; line-height : 0 ; }
# header-ads h3 { display : none ; }
# header-bottom { background : #262626 ; border-bottom : 1 px solid rgba ( 255 , 255 , 255 , 0.1 ) ; position : relative ; z-index : 9 ; }
# header { position : relative ; z-index : 99 ; }
# header . pad { padding-top : 0 ; padding-bottom : 0 ; }
# header-top { background : #fff ; border-bottom : 1 px solid rgba ( 0 , 0 , 0 , 0.1 ) ; z-index : 99 ; position : relative ; }
@ media only screen and ( min-width : 1025px ) {
# header-top . fixed { background : rgba ( 255 , 255 , 255 , 0.95 ) ; position : fixed ; top : 0 ; left : 0 ; right : 0 ; z-index : 99 ; border-bottom : 1 px solid rgba ( 0 , 0 , 0 , 0.1 ) ; -webkit- box-shadow : 0 0 10 px rgba ( 0 , 0 , 0 , 0.1 ) ; box-shadow : 0 0 10 px rgba ( 0 , 0 , 0 , 0.1 ) ; }
. admin-bar # header-top . fixed { top : 32 px ; }
}
# header-top . searchform { display : none ; padding : 0 15 px 15 px ; }
# header-top . searchform input { width : 100 % ; }
# header-middle . social-links { float : right ; margin-top : 14 px ; }
# header-middle . social-links li { margin-right : 10 px ; margin-left : 0 ; border-right : 1 px solid rgba ( 0 , 0 , 0 , 0.05 ) ; padding-right : 10 px ; margin-top : 10 px ; }
# header-middle . social-links li : last-child { border-right : 0 ; }
# header-middle . social-links li a { color : rgba ( 0 , 0 , 0 , 0.7 ) ; font-size : 20 px ; }
# header-middle . social-links li a : hover { color : rgba ( 0 , 0 , 0 , 0.9 ) ; }
# header-middle . social-links . social-tooltip : hover : after { background : #333 ; color : #fff ; top : auto ; bottom : -3 px ; right : 26 px ; }
# header-middle . social-links . social-tooltip : hover : before { top : auto ; bottom : 5 px ; right : 21 px ; border-color : transparent #333 ; border-width : 5 px 0 5 px 5 px ; }
. site-title { font-size : 30 px ; font-weight : 600 ; float : left ; line-height : 60 px ; }
. site-title a { display : block ; padding : 10 px 0 ; color : #333 ; max-width : 100 % ; }
. site-title a img { display : block ; max-width : 100 % ; max-height : 60 px ; height : auto ; padding : 0 ; margin : 0 auto ; -webkit- box-shadow : none ; box-shadow : none ; border-radius : 0 ; }
. site-description { font-size : 14 px ; font-weight : 400 ; color : rgba ( 0 , 0 , 0 , 0.4 ) ; float : left ; margin-left : 20 px ; line-height : 60 px ; padding : 10 px 0 ; }
. site-image { display : block ; margin : 0 auto ; max-height : 400 px ; }
# sticky-header-logo { display : none ; float : left ; margin-right : 30 px ; padding : 10 px 0 ; }
# sticky-header-logo img { display : block ; max-height : 60 px ; height : auto ; border-radius : 0 ; }
. sticky-element-sticky # sticky-header-logo { display : block ; }
/ * header : search
/* ------------------------------------ */
. header-menu . toggle-search { display : block ; }
2020-08-26 17:02:26 +02:00
. toggle-search { display : none ; outline : none ; z-index : 101 ; background : rgba ( 255 , 255 , 255 , 0.1 ) ; color : #fff ; font-size : 18 px ; border : 0 ; line-height : 24 px ; cursor : pointer ; padding : 6 px 16 px ; position : absolute ; right : 30 px ; top : 20 px ;
2020-08-26 16:50:22 +02:00
border-radius : 30px ; }
2020-03-11 14:44:42 +01:00
. search-expand { display : none ; z-index : 101 ; background : rgba ( 255 , 255 , 255 , 0.2 ) ; border-radius : 30 px ; position : absolute ; top : 20 px ; right : 94 px ; width : 340 px ;
-webkit-box-shadow : 0 1px 0 rgba ( 255 , 255 , 255 , 0 . 1 ) ;
box-shadow : 0 1px 0 rgba ( 255 , 255 , 255 , 0 . 1 ) ; }
. search-expand-inner { padding : 3 px ; }
. search-expand . themeform input { border-radius : 30 px ; width : 100 % ; border : 0 ; }
. search-expand . themeform input : focus { }
2020-08-26 16:50:22 +02:00
. toggle-search . active { padding-top : 9 px ; padding-bottom : 9 px ; }
. toggle-search . svg-icon { fill : #fff ; margin : 0 auto ; }
. toggle-search # svg-close { display : none ; }
. toggle-search . active # svg-search { display : none ; }
2022-11-21 12:20:09 +01:00
. toggle-search . active # svg-close { display : block ; fill : rgba ( 255 , 255 , 255 , 0.5 ) ; }
. toggle-search : focus # svg-search { fill : rgba ( 255 , 255 , 255 , 0.5 ) ; }
. toggle-search : focus # svg-close { fill : #fff ; }
2020-03-11 14:44:42 +01:00
2020-08-26 16:50:22 +02:00
/ * ------------------------------------------------------------------------- *
* Section : Navigation
/* ------------------------------------------------------------------------- */
2020-03-11 14:44:42 +01:00
2020-08-26 16:50:22 +02:00
/* menu hamburger */
. menu-toggle-icon { float : right ; width : 30 px ; height : 20 px ; position : relative ; transform : rotate ( 0 deg ) ; transition : .5 s ease-in-out ; cursor : pointer ; }
. menu-toggle-icon span { display : block ; position : absolute ; height : 2 px ; width : 100 % ; background : #333 ; border-radius : 2 px ; opacity : 1 ; left : 0 ; transform : rotate ( 0 deg ) ; transition : .25 s ease-in-out ; }
. menu-toggle-icon span : nth-child ( 1 ) { top : 0 px ; transform-origin : left center ; }
. menu-toggle-icon span : nth-child ( 2 ) { top : 8 px ; transform-origin : left center ; }
. menu-toggle-icon span : nth-child ( 3 ) { top : 16 px ; transform-origin : left center ; }
. toggled . menu-toggle-icon span : nth-child ( 1 ) { transform : rotate ( 45 deg ) ; top : -2 px ; left : 5 px ; }
. toggled . menu-toggle-icon span : nth-child ( 2 ) { width : 0 % ; opacity : 0 ; }
. toggled . menu-toggle-icon span : nth-child ( 3 ) { transform : rotate ( -45 deg ) ; top : 19 px ; left : 5 px ; }
/* menu hide and display */
2020-03-11 14:44:42 +01:00
@ media only screen and ( min-width : 720px ) {
2020-08-26 16:50:22 +02:00
. mobile-menu # wrap-nav-mobile { display : none ; }
2020-03-11 14:44:42 +01:00
}
@ media only screen and ( max-width : 719px ) {
2020-08-26 16:50:22 +02:00
. mobile-menu # wrap-nav-topbar ,
. mobile-menu # wrap-nav-header ,
. mobile-menu . toggle-search { display : none ; }
# nav-mobile ,
# nav-topbar ,
# nav-header ,
# nav-footer { display : none ; }
. mobile # nav-mobile ,
. mobile # nav-topbar ,
. mobile # nav-header ,
. mobile # nav-footer { display : block ; }
2020-03-11 14:44:42 +01:00
}
2020-08-26 16:50:22 +02:00
/* menu base */
. nav-menu > . menu-toggle { display : none ; }
. nav-menu . mobile > . menu-toggle { display : block ; }
. nav-menu . mobile > . menu-toggle ~ * { max-height : 4000 px ; overflow : hidden ; width : 100 % ; transition : max-height 0.5 s cubic-bezier ( 1 , 0 , 1 , 0 ) ; }
. nav-menu . mobile > . menu-toggle [ aria-expanded = "false" ] ~ * { max-height : 0 ; transition : max-height 0.5 s cubic-bezier ( 0 , 1.05 , 0 , 1 ) ; }
. nav-menu . menu ,
. nav-menu . menu ul { display : flex ; list-style : none ; list-style-type : none ; margin : 0 ; padding : 0 ; }
. nav-menu a { display : block ; text-decoration : none ; width : 100 % ; }
. nav-menu . mobile ul { flex-direction : column ; }
. nav-menu . menu ul { flex-direction : column ; max-width : 0 ; max-height : 0 ; overflow : hidden ; }
. nav-menu . menu ul . active ,
. nav-menu : not ( . mobile ) . menu li . hover > ul { max-width : 100 vw ; max-height : 300 vh ; }
. nav-menu : not ( . mobile ) . menu . sub-menu { position : absolute ; }
. nav-menu . screen-reader-text { display : none ; }
. nav-menu . menu-item-wrapper { display : flex ; }
. nav-menu { line-height : 20 px ; }
. nav-menu button { color : inherit ; cursor : pointer ; font-family : inherit ; position : relative ; text-align : inherit ; user-select : none ; background : none ; border : none ; box-shadow : none ; border-radius : 0 ; font-size : inherit ; font-weight : 400 ; letter-spacing : inherit ; padding : 0 ; text-transform : none ; }
. nav-menu . mobile . menu ul { transition : max-height 500 ms ; max-width : 100 % ; }
. nav-menu : not ( . mobile ) . menu { flex-wrap : wrap ; justify-content : flex-start ; }
. nav-menu : not ( . mobile ) . menu ul . active ,
2021-03-05 16:01:43 +01:00
. nav-menu : not ( . mobile ) . menu li . hover > ul { overflow : visible ; width : 200 px ; opacity : 1 ; transform : translateY ( 0 ) ; transition : opacity 0.15 s linear , transform 0.15 s linear ; }
. nav-menu : not ( . mobile ) . menu ul . sub-menu { left : 220 px ; top : 0 ; }
2020-08-26 16:50:22 +02:00
. nav-menu : not ( . mobile ) . menu { position : relative ; }
. nav-menu : not ( . mobile ) . menu ul { font-size : 15 px ; opacity : 0 ; padding : 10 px 0 ; position : absolute ; top : calc ( 100 % + 20 px ) ; transition : opacity 0.15 s linear , transform 0.15 s linear , right 0 s 0.15 s ; transform : translateY ( 6 px ) ; z-index : 1 ; }
. nav-menu : not ( . mobile ) . menu ul li { position : relative ; }
. nav-menu : not ( . mobile ) . menu ul a { display : block ; padding : 10 px 20 px ; transition : all 0.3 s ease ; width : 100 % ; }
2021-03-05 16:01:43 +01:00
. nav-menu : not ( . mobile ) . menu li . menu-item-has-children . focus > ul { min-width : 200 px ; max-width : 200 px ; max-height : 300 vh ; overflow : visible ; opacity : 1 ; transform : translateY ( 0 ) ; transition : opacity 0.15 s linear , transform 0.15 s linear ; }
2020-08-26 16:50:22 +02:00
. nav-menu : not ( . mobile ) . menu li . menu-item-has-children . focus > ul : focus-within { opacity : 1 !important ; }
. nav-menu : not ( . mobile ) . menu li ul . sub-menu : not ( . active ) { opacity : 0 ; }
. nav-menu : not ( . mobile ) . menu li . hover ul . sub-menu : not ( . active ) { opacity : 1 ; }
. nav-menu : not ( . mobile ) . menu li . focus ul ul . sub-menu : not ( . active ) { opacity : 0 ; }
. nav-menu : not ( . mobile ) . menu li . focus ul li . hover ul . sub-menu { opacity : 1 ; }
. nav-menu : not ( . mobile ) . menu ul : before ,
. nav-menu : not ( . mobile ) . menu ul : after { content : "" ; display : block ; position : absolute ; bottom : 100 % ; }
. nav-menu : not ( . mobile ) . menu ul : before { left : 0 ; right : 0 ; height : 20 px ; }
. nav-menu : not ( . mobile ) . menu ul : after { border : 8 px solid transparent ; border-bottom-color : transparent ; left : 18 px ; }
. nav-menu : not ( . mobile ) . menu ul ul { left : calc ( 100 % + 20 px ) ; top : -10 px !important ; }
. nav-menu : not ( . mobile ) . menu ul ul : before { bottom : 0 ; height : auto ; left : auto ; left : -20 px ; top : 0 ; width : 22 px ; }
. nav-menu : not ( . mobile ) . menu ul ul : after { border-bottom-color : transparent ; bottom : auto ; left : -16 px ; top : 20 px ; }
. nav-menu-dropdown-left . nav-menu : not ( . mobile ) . menu ul ul : before { left : auto ; right : -20 px ; }
. nav-menu-dropdown-left . nav-menu : not ( . mobile ) . menu ul ul { right : calc ( 100 % + 20 px ) ; left : auto ; }
. nav-menu-dropdown-left . nav-menu : not ( . mobile ) . menu ul ul : after { border-right-color : transparent ; right : -16 px ; left : auto ; }
. nav-menu-dropdown-left . nav-menu : not ( . mobile ) ul ul button . svg-icon { transform : none ; }
. nav-menu : not ( . mobile ) a ,
. nav-menu : not ( . mobile ) span { transition : all 0.3 s ease ; }
. nav-menu . mobile { padding : 0 ; }
. nav-menu . mobile button : focus { outline : none ; }
2020-08-26 17:02:26 +02:00
. nav-menu . mobile > button { padding : 12 px 20 px ; float : right ; }
2020-08-26 16:50:22 +02:00
. nav-menu . mobile button . svg-icon { transition : all 250 ms ; }
. nav-menu . mobile button . active . svg-icon { transform : rotate ( 180 deg ) ; }
. nav-menu . mobile ul { border : 0 ; }
. nav-menu . mobile ul li . menu-item-wrapper { justify-content : space-between ; width : 100 % ; }
. nav-menu . mobile > div > ul > li : last-child { margin-bottom : 52 px ; }
2020-08-26 17:02:26 +02:00
. nav-menu . mobile ul li a { font-size : 16 px ; font-weight : 600 ; padding : 12 px 20 px ; }
2020-08-26 16:50:22 +02:00
. nav-menu . mobile ul ul li a { font-size : 14 px ; }
. nav-menu . mobile ul ul li a { padding : 12 px 0 12 px 40 px ; }
. nav-menu . mobile ul ul ul li a { padding : 12 px 0 12 px 60 px ; }
. nav-menu . mobile ul button { margin : 10 px 0 ; padding : 0 20 px ; }
2021-03-05 16:01:43 +01:00
/* menu mobile fix */
. nav-menu . mobile > div > ul . menu ,
. nav-menu . mobile . toggled > div > ul . menu ul . sub-menu { visibility : hidden ; transition : all 0.3 s ease ; }
. nav-menu . mobile . toggled > div > ul . menu ,
. nav-menu . mobile . toggled > div > ul . menu ul . sub-menu . active { visibility : visible ; }
2022-11-21 12:20:09 +01:00
. nav-menu . mobile button : focus ,
. menu-toggle : focus { background : rgba ( 0 , 0 , 0 , 0.04 ) ; }
2021-03-05 16:01:43 +01:00
2020-08-26 16:50:22 +02:00
/* menu styling */
. nav-menu a { color : #fff ; }
. nav-menu . svg-icon { fill : #333 ; }
. nav-menu : not ( . mobile ) . menu ul { background : #333 ; color : #fff ; border-radius : 4 px ; }
. nav-menu : not ( . mobile ) . menu ul : after { border-bottom-color : #333 ; }
. nav-menu : not ( . mobile ) . menu ul ul : after { border-right-color : #333 ; }
. nav-menu-dropdown-left . nav-menu : not ( . mobile ) . menu ul ul : after { border-left-color : #333 ; }
. nav-menu : not ( . mobile ) { font-size : 16 px ; font-weight : 400 ; float : right ; padding : 12 px 0 20 px 0 ; }
. nav-menu : not ( . mobile ) a { color : #666 ; }
. nav-menu : not ( . mobile ) a : hover { color : #333 ; }
. nav-menu : not ( . mobile ) ul ul a : hover { color : #ccc ; }
. nav-menu : not ( . mobile ) ul ul > li : hover > span { background : rgba ( 255 , 255 , 255 , 0.1 ) ; }
. nav-menu : not ( . mobile ) ul ul a { color : #eee ; }
. nav-menu : not ( . mobile ) button { background : none ; color : #666 ; padding : 0 4 px ; margin-left : 2 px ; border-radius : 4 px ; }
. nav-menu : not ( . mobile ) button . active { background : #eee ; color : #333 ; }
. nav-menu : not ( . mobile ) button . svg-icon { fill : #bbb ; }
. nav-menu : not ( . mobile ) ul ul button { background : none ; color : #eee ; padding : 0 5 px ; margin : 0 10 px 0 0 ; }
. nav-menu : not ( . mobile ) ul ul button . active { background : #444 ; color : #eee ; }
. nav-menu : not ( . mobile ) ul ul button . svg-icon { transform : rotate ( -90 deg ) ; }
. nav-menu : not ( . mobile ) . menu > li { margin : 16 px 20 px 0 0 ; position : relative ; }
. nav-menu : not ( . mobile ) . menu > li : last-child { margin-right : 0 ; }
. nav-menu : not ( . mobile ) . menu a { padding : 0 ; }
. nav-menu : not ( . mobile ) li . current_page_item > span > a ,
. nav-menu : not ( . mobile ) li . current-menu-item > span > a ,
. nav-menu : not ( . mobile ) li . current-menu-ancestor > span > a ,
. nav-menu : not ( . mobile ) li . current-post-parent > span > a { color : #333 ; }
. nav-menu : not ( . mobile ) ul ul li . current_page_item > span > a ,
. nav-menu : not ( . mobile ) ul ul li . current-menu-item > span > a ,
. nav-menu : not ( . mobile ) ul ul li . current-menu-ancestor > span > a ,
. nav-menu : not ( . mobile ) ul ul li . current-post-parent > span > a { color : #aaa ; }
. nav-menu . mobile button . active . svg-icon { fill : #333 ; }
. nav-menu . mobile ul ul { background : rgba ( 0 , 0 , 0 , 0.03 ) ; }
. nav-menu . mobile ul li . menu-item-wrapper ,
. nav-menu . mobile ul ul li . menu-item-wrapper { border-bottom : 1 px solid rgba ( 0 , 0 , 0 , 0.07 ) ; }
. nav-menu . mobile ul li a { color : #333 ; }
. nav-menu . mobile ul button ,
. nav-menu . mobile ul ul button { border-left : 1 px solid rgba ( 0 , 0 , 0 , 0.07 ) ; }
. nav-menu . mobile > div > ul { border-top : 1 px solid rgba ( 0 , 0 , 0 , 0.07 ) ; }
/* menu mobile styling */
# wrap-nav-mobile . menu-toggle-icon span { background : #333 ; }
# wrap-nav-mobile . nav-menu . svg-icon { fill : #333 ; }
# wrap-nav-mobile . nav-menu . mobile { background : transparent ; }
# wrap-nav-mobile . nav-menu . mobile button . active . svg-icon { fill : #333 ; }
# wrap-nav-mobile . nav-menu . mobile ul ul { background : rgba ( 0 , 0 , 0 , 0.04 ) ; }
# wrap-nav-mobile . nav-menu . mobile ul li . menu-item-wrapper ,
# wrap-nav-mobile . nav-menu . mobile ul ul li . menu-item-wrapper { border-bottom : 1 px solid rgba ( 0 , 0 , 0 , 0.07 ) ; }
# wrap-nav-mobile . nav-menu . mobile ul li a { color : #333 ; }
# wrap-nav-mobile . nav-menu . mobile ul button ,
# wrap-nav-mobile . nav-menu . mobile ul ul button { border-left : 1 px solid rgba ( 0 , 0 , 0 , 0.07 ) ; }
# wrap-nav-mobile . nav-menu . mobile > div > ul { border-top : 1 px solid rgba ( 0 , 0 , 0 , 0.07 ) ; }
/* menu topbar styling */
# wrap-nav-topbar { background : transparent ; border-bottom : 1 px solid rgba ( 255 , 255 , 255 , 0.15 ) ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) { font-size : 13 px ; font-weight : 600 ; text-transform : uppercase ; float : none ; padding : 0 0 10 px 0 ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) a { color : rgba ( 0 , 0 , 0 , 0.7 ) ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) a : hover { color : rgba ( 0 , 0 , 0 , 0.9 ) ; }
2020-08-27 13:33:28 +02:00
# wrap-nav-topbar . nav-menu : not ( . mobile ) . menu { justify-content : flex-end ; }
2020-08-26 16:50:22 +02:00
# wrap-nav-topbar . nav-menu : not ( . mobile ) . menu > li { margin-top : 10 px ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) . menu ul { background : #fff ; top : calc ( 100 % + 10 px ) ; font-size : 13 px ; z-index : 10 ; box-shadow : 0 2 px 2 px rgba ( 0 , 0 , 0 , 0.15 ) ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) . menu ul : after { border-bottom-color : #fff ; }
2020-08-26 17:02:26 +02:00
# wrap-nav-topbar . nav-menu : not ( . mobile ) > div > . menu > li > ul : before { height : 10 px ; }
2020-08-26 16:50:22 +02:00
# wrap-nav-topbar . nav-menu : not ( . mobile ) ul ul a { color : rgba ( 0 , 0 , 0 , 0.6 ) ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) ul ul a : hover { color : rgba ( 0 , 0 , 0 , 0.9 ) ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) . menu ul ul : after { border-left-color : #fff ; border-right-color : transparent ; border-bottom-color : transparent ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) . menu ul span { border-bottom : 1 px solid rgba ( 0 , 0 , 0 , 0.06 ) ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) . menu ul li : last-child span { border-bottom : 0 ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) button . svg-icon { fill : rgba ( 0 , 0 , 0 , 0.2 ) ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) button . active { background : rgba ( 0 , 0 , 0 , 0.1 ) ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) ul ul button . svg-icon { fill : rgba ( 0 , 0 , 0 , 0.2 ) ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) ul ul button . active { background : rgba ( 0 , 0 , 0 , 0.05 ) ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) li . current_page_item > span > a ,
# wrap-nav-topbar . nav-menu : not ( . mobile ) li . current-menu-item > span > a ,
# wrap-nav-topbar . nav-menu : not ( . mobile ) li . current-menu-ancestor > span > a ,
# wrap-nav-topbar . nav-menu : not ( . mobile ) li . current-post-parent > span > a { color : rgba ( 0 , 0 , 0 , 0.9 ) ; }
# wrap-nav-topbar . nav-menu : not ( . mobile ) ul ul li . current_page_item > span > a ,
# wrap-nav-topbar . nav-menu : not ( . mobile ) ul ul li . current-menu-item > span > a ,
# wrap-nav-topbar . nav-menu : not ( . mobile ) ul ul li . current-menu-ancestor > span > a ,
# wrap-nav-topbar . nav-menu : not ( . mobile ) ul ul li . current-post-parent > span > a { color : rgba ( 0 , 0 , 0 , 0.9 ) ; }
# wrap-nav-topbar . menu-toggle-icon span { background : #333 ; }
# wrap-nav-topbar . nav-menu . svg-icon { fill : #333 ; }
# wrap-nav-topbar . nav-menu . mobile { background : transparent ; }
# wrap-nav-topbar . nav-menu . mobile button . active . svg-icon { fill : #333 ; }
# wrap-nav-topbar . nav-menu . mobile ul ul { background : rgba ( 0 , 0 , 0 , 0.04 ) ; }
# wrap-nav-topbar . nav-menu . mobile ul li . menu-item-wrapper ,
# wrap-nav-topbar . nav-menu . mobile ul ul li . menu-item-wrapper { border-bottom : 1 px solid rgba ( 0 , 0 , 0 , 0.07 ) ; }
# wrap-nav-topbar . nav-menu . mobile ul li a { color : #333 ; }
# wrap-nav-topbar . nav-menu . mobile ul button ,
# wrap-nav-topbar . nav-menu . mobile ul ul button { border-left : 1 px solid rgba ( 0 , 0 , 0 , 0.07 ) ; }
# wrap-nav-topbar . nav-menu . mobile > div > ul { border-top : 1 px solid rgba ( 0 , 0 , 0 , 0.07 ) ; }
/* menu header styling */
# wrap-nav-header { }
# wrap-nav-header . nav-menu : not ( . mobile ) { font-size : 17 px ; font-weight : 600 ; padding : 14 px 0 30 px 0 ; float : none ; }
# wrap-nav-header . nav-menu : not ( . mobile ) a { color : rgba ( 255 , 255 , 255 , 0.6 ) ; }
# wrap-nav-header . nav-menu : not ( . mobile ) a : hover { color : rgba ( 255 , 255 , 255 , 0.9 ) ; }
# wrap-nav-header . nav-menu : not ( . mobile ) . menu ul { background : #fff ; text-transform : uppercase ; border-radius : 4 px ; font-size : 13 px ; box-shadow : 0 2 px 2 px rgba ( 0 , 0 , 0 , 0.15 ) ; }
# wrap-nav-header . nav-menu : not ( . mobile ) . menu ul : after { border-bottom-color : #fff ; }
# wrap-nav-header . nav-menu : not ( . mobile ) . menu ul ul { border-radius : 4 px ; }
# wrap-nav-header . nav-menu : not ( . mobile ) . menu ul ul : after { border-right-color : #fff ; border-bottom-color : transparent ; }
# wrap-nav-header . nav-menu : not ( . mobile ) . menu ul span { border-bottom : 1 px solid rgba ( 0 , 0 , 0 , 0.06 ) ; }
# wrap-nav-header . nav-menu : not ( . mobile ) . menu ul li : last-child span { border-bottom : 0 ; }
# wrap-nav-header . nav-menu : not ( . mobile ) ul ul a { color : rgba ( 0 , 0 , 0 , 0.6 ) ; }
# wrap-nav-header . nav-menu : not ( . mobile ) ul ul a : hover { color : rgba ( 0 , 0 , 0 , 0.9 ) ; }
# wrap-nav-header . nav-menu : not ( . mobile ) button . svg-icon { fill : rgba ( 255 , 255 , 255 , 0.4 ) ; }
# wrap-nav-header . nav-menu : not ( . mobile ) button . active { background : rgba ( 255 , 255 , 255 , 0.1 ) ; }
# wrap-nav-header . nav-menu : not ( . mobile ) ul ul button . svg-icon { fill : rgba ( 0 , 0 , 0 , 0.2 ) ; }
# wrap-nav-header . nav-menu : not ( . mobile ) ul ul button . active { background : rgba ( 0 , 0 , 0 , 0.05 ) ; }
# wrap-nav-header . nav-menu : not ( . mobile ) li . current_page_item > span > a ,
# wrap-nav-header . nav-menu : not ( . mobile ) li . current-menu-item > span > a ,
# wrap-nav-header . nav-menu : not ( . mobile ) li . current-menu-ancestor > span > a ,
# wrap-nav-header . nav-menu : not ( . mobile ) li . current-post-parent > span > a { color : rgba ( 255 , 255 , 255 , 0.9 ) ; }
# wrap-nav-header . nav-menu : not ( . mobile ) ul ul li . current_page_item > span > a ,
# wrap-nav-header . nav-menu : not ( . mobile ) ul ul li . current-menu-item > span > a ,
# wrap-nav-header . nav-menu : not ( . mobile ) ul ul li . current-menu-ancestor > span > a ,
# wrap-nav-header . nav-menu : not ( . mobile ) ul ul li . current-post-parent > span > a { color : rgba ( 0 , 0 , 0 , 0.9 ) ; }
# wrap-nav-header . menu-toggle-icon span { background : #fff ; }
# wrap-nav-header . nav-menu . mobile { background : transparent ; border-top : none ; }
# wrap-nav-header . nav-menu . mobile . svg-icon { fill : #fff ; }
# wrap-nav-header . nav-menu . mobile button . active . svg-icon { fill : #fff ; }
# wrap-nav-header . nav-menu . mobile ul ul { background : rgba ( 255 , 255 , 255 , 0.04 ) ; }
# wrap-nav-header . nav-menu . mobile ul li . menu-item-wrapper ,
# wrap-nav-header . nav-menu . mobile ul ul li . menu-item-wrapper { border-bottom : 1 px solid rgba ( 255 , 255 , 255 , 0.07 ) ; }
# wrap-nav-header . nav-menu . mobile ul li a { color : rgba ( 255 , 255 , 255 , 0.7 ) ; }
# wrap-nav-header . nav-menu . mobile ul button ,
# wrap-nav-header . nav-menu . mobile ul ul button { border-left : 1 px solid rgba ( 255 , 255 , 255 , 0.07 ) ; }
# wrap-nav-header . nav-menu . mobile > div > ul { border-top : 1 px solid rgba ( 255 , 255 , 255 , 0.07 ) ; }
/* menu footer styling */
# wrap-nav-footer { background : #222 ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) { font-size : 14 px ; font-weight : 600 ; text-transform : uppercase ; border-top : 0 ; float : none ; padding-top : 5 px ; padding-left : 30 px ; padding-right : 30 px ; position : relative ; z-index : 2 ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) a { color : rgba ( 255 , 255 , 255 , 0.65 ) ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) a : hover { color : #fff ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) button { transform : rotate ( -180 deg ) ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) . menu ul button { transform : none ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) . menu { justify-content : left ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) . menu ul { background : #222 ; top : auto ; bottom : calc ( 100 % + 19 px ) ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) . menu ul a { font-size : 13 px ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) . menu ul span { border-bottom : 1 px solid rgba ( 255 , 255 , 255 , 0.06 ) ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) . menu ul li : last-child span { border-bottom : 0 ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) . menu ul ul { bottom : auto ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) . menu > li > ul : before ,
# wrap-nav-footer . nav-menu : not ( . mobile ) . menu > li > ul : after { bottom : auto ; top : 100 % ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) . menu ul : after { border-bottom-color : transparent ; border-top-color : #222 ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) . menu ul ul : after { border-right-color : #222 ; border-top-color : transparent ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) li . current_page_item > span > a ,
# wrap-nav-footer . nav-menu : not ( . mobile ) li . current-menu-item > span > a ,
# wrap-nav-footer . nav-menu : not ( . mobile ) li . current-menu-ancestor > span > a ,
# wrap-nav-footer . nav-menu : not ( . mobile ) li . current-post-parent > span > a { color : #fff ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) ul ul li . current_page_item > span > a ,
# wrap-nav-footer . nav-menu : not ( . mobile ) ul ul li . current-menu-item > span > a ,
# wrap-nav-footer . nav-menu : not ( . mobile ) ul ul li . current-menu-ancestor > span > a ,
# wrap-nav-footer . nav-menu : not ( . mobile ) ul ul li . current-post-parent > span > a { color : #fff ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) button . svg-icon { fill : rgba ( 255 , 255 , 255 , 0.2 ) ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) button . active { background : rgba ( 255 , 255 , 255 , 0.06 ) ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) ul ul button . svg-icon { fill : rgba ( 255 , 255 , 255 , 0.3 ) ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) ul ul button . active { }
# wrap-nav-footer . nav-menu : not ( . mobile ) ul ul a { transition : all 0.3 s ease ; }
# wrap-nav-footer . nav-menu : not ( . mobile ) ul ul > li : hover > span { background : none ; }
# wrap-nav-footer . menu-toggle-icon span { background : #fff ; }
# wrap-nav-footer . nav-menu . mobile { background : #222 ; border-top : none ; }
# wrap-nav-footer . nav-menu . mobile . svg-icon { fill : #fff ; }
# wrap-nav-footer . nav-menu . mobile button . active . svg-icon { fill : #fff ; }
# wrap-nav-footer . nav-menu . mobile ul ul { background : rgba ( 255 , 255 , 255 , 0.04 ) ; }
# wrap-nav-footer . nav-menu . mobile ul li . menu-item-wrapper ,
# wrap-nav-footer . nav-menu . mobile ul ul li . menu-item-wrapper { border-bottom : 1 px solid rgba ( 255 , 255 , 255 , 0.07 ) ; }
# wrap-nav-footer . nav-menu . mobile ul li a { color : rgba ( 255 , 255 , 255 , 0.7 ) ; }
# wrap-nav-footer . nav-menu . mobile ul button ,
# wrap-nav-footer . nav-menu . mobile ul ul button { border-left : 1 px solid rgba ( 255 , 255 , 255 , 0.07 ) ; }
# wrap-nav-footer . nav-menu . mobile > div > ul { border-top : 1 px solid rgba ( 255 , 255 , 255 , 0.07 ) ; }
2020-03-11 14:44:42 +01:00
/ * ------------------------------------------------------------------------- *
* Section : Subheader
/* ------------------------------------------------------------------------- */
. category . paged . featured-posts { display : none ; }
. paged . page-title ,
. home . paged . page-title { padding-bottom : 30 px ; }
. bg-line { background : #ddd ; border-bottom : 1 px solid #ccc ; box-shadow : inset 0 1 px 3 px rgba ( 0 , 0 , 0 , 0.05 ) ; border-radius : 30 px ; position : relative ; z-index : 1 ; float : left ; width : 100 % ; height : 120 px ; margin : 30 px 0 -90 px 0 ; }
/* featured / highlight posts disable */
. featured-posts-disable . bg-line { display : none ; }
. highlight-posts-disable . home . paged . page-title ,
. highlight-posts-disable . featured-posts-disable . home . page-title { padding-bottom : 30 px ; }
. highlight-posts-disable . featured-posts-disable . home . featured-posts { padding-bottom : 0 ; }
. owl-carousel { position : relative ; z-index : 2 ; }
. owl-wrapper { }
. owl-wrapper-outer { }
. owl-carousel . owl-item { padding-bottom : 10 px ; }
. owl-item . post { margin : 0 2 px 0 !important ; }
. owl-item . post-title { z-index : 2 ; position : relative ; min-height : 100 px ; font-size : 16 px ; line-height : 1.5 em ; color : #fff ; padding : 0 15 px ; margin : 0 ; }
# owl-featured . owl-buttons { pointer-events : none ; position : absolute ; left : 0 ; right : 0 ; top : 50 % ; margin-top : -42 px ; }
# owl-featured . owl-buttons div { pointer-events : auto ; font-family : "Font Awesome 5 Free" ; font-weight : 900 ; background : #5299eb ; width : 40 px ; opacity : 1 ; text-indent : -9999 px ; position : relative ;
-webkit-transition : all 0 . 2s ease ;
-moz-transition : all 0 . 2s ease ;
-o-transition : all 0 . 2s ease ;
transition : all 0 . 2s ease ; }
# owl-featured . owl-buttons . owl-prev { float : left ; margin-left : -10 px ; border-radius : 30 px ; }
# owl-featured . owl-buttons . owl-prev : hover { padding-left : 40 px ; }
# owl-featured . owl-buttons . owl-prev : after { font-size : 16 px ; color : #fff ; content : "\f053" ; position : absolute ; left : 0 ; top : 0 ; right : 0 ; bottom : 0 ; text-indent : 0 ; line-height : 30 px ; display : block ; }
# owl-featured . owl-buttons . owl-next { float : right ; margin-right : -10 px ; border-radius : 30 px ; }
# owl-featured . owl-buttons . owl-next : hover { padding-right : 40 px ; }
# owl-featured . owl-buttons . owl-next : after { font-size : 16 px ; color : #fff ; content : "\f054" ; position : absolute ; left : 0 ; top : 0 ; right : 0 ; bottom : 0 ; text-indent : 0 ; line-height : 30 px ; display : block ; }
# owl-featured . owl-carousel . owl-wrapper { display : flex !important ; flex : 1 1 auto ; flex-wrap : wrap ; }
. post-thumbnail { position : relative ; overflow : hidden ; }
. featured-posts { background : #eee ; position : relative ; padding-bottom : 10 px ; }
. featured-wrap { position : relative ; float : left ; width : 100 % ; display : flex ; flex : 1 1 auto ; flex-wrap : wrap ; }
. featured-inner { margin-top : -100 px ; }
. featured-large-inner ,
. featured-large-inner img ,
. featured-small ,
. featured-small img { border-radius : 30 px ; }
. featured-highlights { margin : 0 -15 px ; }
. featured-large { box-sizing : border-box ; }
. featured-large-inner { background : #fff ; overflow : hidden ; position : relative ; height : 100 % ; width : 100 % ; }
. featured-large : nth-child ( 1 ) { width : 60 % ; }
. featured-large : nth-child ( 1 ) . featured-o-thumb { width : 50 % ; float : left ; }
. featured-large : nth-child ( 1 ) . featured-o { float : left ; box-sizing : border-box ; width : 50 % ; padding-left : 30 px ; }
. featured-large : nth-child ( 2 ) { width : 20 % ; padding-left : 30 px ; }
. featured-large : nth-child ( 3 ) { width : 20 % ; padding-left : 30 px ; }
. featured-large { position : relative ; width : 33.33 % ; float : left ; }
. featured-small { background : #fff ; overflow : hidden ; height : 100 % ; position : relative ; margin : 0 15 px ; }
. featured-large-inner img ,
. featured-small img { width : 100 % ; display : block ; border : 2 px solid #fff ; transition : transform 0.3 s ease 0 s , opacity 0.3 s ease 0 s ; }
. featured-large-inner : hover img ,
. featured-small : hover img { }
. featured-o { display : block ; color : #333 ; padding : 20 px ; z-index : 1 ; }
. featured-o-title { display : block ; font-size : 22 px ; font-weight : 600 ; line-height : 1.3 em ; margin-bottom : 10 px ; transition : all 0.2 s ease-in ; }
. featured-large-inner : hover . featured-o-title ,
. featured-small : hover . featured-o-title { color : #5299eb ; }
. featured-o-date { display : block ; font-size : 13 px ; font-weight : 600 ; text-transform : uppercase ; color : rgba ( 0 , 0 , 0 , 0.3 ) ; }
. featured-o-date i { margin-right : 4 px ; }
. featured-large : nth-child ( 1 ) . featured-o-title { font-size : 38 px ; letter-spacing : -1 px ; line-height : 1.2 em ; padding : 10 px ; }
. featured-large : nth-child ( 1 ) . featured-o-date { padding : 0 10 px ; }
. featured-large-inner . featured-o-title { font-size : 20 px ; }
. featured-small . featured-o-title { font-size : 17 px ; }
. featured-o-thumb { position : relative ; border-radius : 30 px ; overflow : hidden ; transition : all 1 s ease ; }
. featured-large-inner : hover . featured-o-thumb ,
. featured-small : hover . featured-o-thumb { opacity : 0.75 ; }
. featured-large-inner : hover . thumb-icon ,
. featured-small : hover . thumb-icon { background : #fff ; color : #333 ; }
/ * ------------------------------------------------------------------------- *
* Section : Page
/* ------------------------------------------------------------------------- */
# page { background : #262626 ; }
. content { background : #f4f4f4 ; margin-top : 10 px ; margin-bottom : 10 px ; border-radius : 0 30 px 30 px 0 ; }
. content : before { background : #f4f4f4 ; content : "" ; height : 100 % ; width : 9999 px ; position : absolute ; right : 100 % ; top : 0 ; bottom : 0 ; }
. boxed . content : before { background : none ; }
. col-3cr . content ,
. col-2cr . content ,
. col-3cm . content { border-radius : 30 px ; }
. col-3cr . content : before ,
. col-2cr . content : before ,
. col-3cm . content : before { background : #262626 ; z-index : -1 ; }
. col-3cr . sidebar . widget ,
. col-2cr . sidebar . widget ,
. col-3cm . sidebar . s1 . widget { margin : 30 px 0 30 px 30 px ; border-radius : 30 px 4 px 4 px 30 px ; }
. col-3cr . post-nav li ,
. col-2cr . post-nav li ,
. col-3cm . post-nav li { padding : 0 0 0 30 px ; }
. stripe { background : #fff ; border-top : 1 px solid #ddd ; }
. stripe . pad { padding-top : 20 px ; padding-bottom : 30 px ; }
. stripe-title { color : rgba ( 0 , 0 , 0 , 0.7 ) ; position : relative ; z-index : 2 ; font-size : 17 px ; font-weight : 600 ; width : 100 % ; float : left ; margin-bottom : 20 px ; }
. stripe-title i { font-size : 17 px ; color : rgba ( 0 , 0 , 0 , 0.3 ) ; float : left ; margin-right : 6 px ; }
. stripe-title span { display : block ; float : left ; padding : 12 px 0 ; }
. stripe-comments { background : #eee ; width : 100 % ; float : left ; border-radius : 30 px ; }
. stripe-comments li { float : left ; width : 33.33 % ; position : relative ; }
. stripe-comments li a { padding : 10 px ; display : block ; color : rgba ( 0 , 0 , 0 , 0.7 ) ; font-size : 15 px ; border-radius : 30 px ; }
. stripe-comments li a : hover { background : #5299eb ; color : #fff ; }
. stripe-comments li a : hover . stripe-comments-excerpt { color : rgba ( 255 , 255 , 255 , 0.6 ) ; }
. stripe-comments li img { border-radius : 30 px ; width : 60 px ; height : 60 px ; position : absolute ; left : 0 ; top : -7 px ; border : 2 px solid #eee ; }
. stripe-comments li . stripe-comments-inner { display : block ; float : left ; padding : 0 10 px 0 58 px ; height : 24 px ; width : 100 % ; overflow : hidden ; text-overflow : ellipsis ; white-space : nowrap ; }
. stripe-comments li . stripe-comments-excerpt { color : rgba ( 0 , 0 , 0 , 0.5 ) ; }
. stripe-popular { width : 100 % ; float : left ; border-radius : 30 px ; }
. stripe-popular li { float : left ; width : 33.33 % ; position : relative ; counter-increment : step-counter ; }
. stripe-popular li : before { position : absolute ; left : 0 ; top : 0 ; text-align : center ; content : counter ( step - counter ) ; font-size : 60 px ; line-height : 60 px ; height : 60 px ; width : 50 px ; color : #ddd ; font-weight : 700 ; float : left ; }
. stripe-popular li . stripe-popular-category { padding-left : 60 px ; font-weight : 600 ; text-transform : uppercase ; font-size : 13 px ; margin-bottom : 4 px ; }
. stripe-popular li . stripe-popular-title { padding-left : 60 px ; color : #333 ; display : block ; font-size : 20 px ; line-height : 1.4 em ; font-weight : 600 ; margin-bottom : 4 px ; }
. stripe-popular li . stripe-popular-title : hover { color : #5299eb ; }
. stripe-popular li . stripe-popular-date { padding-left : 60 px ; color : rgba ( 0 , 0 , 0 , 0.3 ) ; font-size : 13 px ; text-transform : uppercase ; font-weight : 600 ; }
. stripe-popular li . stripe-popular-date i { margin-right : 4 px ; }
/ * ------------------------------------------------------------------------- *
* Section : Footer
/* ------------------------------------------------------------------------- */
# footer { background : #262626 ; color : #777 ; width : 100 % ; border-top : 1 px solid rgb ( 255 , 255 , 255 , 0.1 ) ; }
# footer . pad { padding-bottom : 30 px ; }
# footer-ads { text-align : center ; padding : 10 px 0 ; border-bottom : 1 px solid rgb ( 255 , 255 , 255 , 0.1 ) ; }
# footer # footer-ads . widget { padding-top : 0 ; padding-bottom : 0 ; font-size : 0 ; line-height : 0 ; }
# footer-ads h3 { display : none ; }
# footer # footer-ads . widget { margin-bottom : 0 ; }
# footer-widgets . pad { padding-top : 40 px ; padding-bottom : 40 px ; }
# footer-bottom { border-top : 1 px solid rgba ( 255 , 255 , 255 , 0.1 ) ; }
# footer-bottom . pad { padding-top : 30 px ; }
# footer-bottom a { color : #fff ; color : rgba ( 255 , 255 , 255 , 0.9 ) ; }
# footer-bottom a : hover { color : #fff ; }
# footer-bottom # footer-logo { display : block ; margin-bottom : 20 px ; max-height : 60 px ; -webkit- box-shadow : none ; box-shadow : none ; border-radius : 0 ; }
# footer-bottom # copyright ,
# footer-bottom # credit { color : #fff ; color : rgba ( 255 , 255 , 255 , 0.6 ) ; font-size : 14 px ; line-height : 1.5 em ; }
# footer-bottom # back-to-top { background : #333 ; color : rgba ( 255 , 255 , 255 , 0.5 ) ; overflow : hidden ; text-align : center ; width : 120 px ; height : 30 px ; display : block ; margin : 0 auto ; margin : 0 auto -30 px ; border-radius : 0 0 3 px 3 px ; }
# footer-bottom # back-to-top i { font-size : 38 px ; position : relative ; top : -7 px ; }
# footer-bottom # back-to-top : hover { color : rgba ( 255 , 255 , 255 , 0.9 ) ; }
# footer-bottom . social-links { padding-top : 10 px ; }
# footer-bottom . social-links a { color : rgba ( 255 , 255 , 255 , 0.6 ) ; }
# footer-bottom . social-links a : hover { color : #fff ; }
# footer-bottom . social-links . social-tooltip { font-size : 24 px ; }
/ * ------------------------------------------------------------------------- *
* Post Entry
/* ------------------------------------------------------------------------- */
/ * post : common
/* ------------------------------------ */
. post-inner { position : relative ; overflow : hidden ; }
. post-thumbnail { margin : 2 px ; -webkit- transition : all 1 s ease ; -moz- transition : all 1 s ease ; transition : all 1 s ease ; }
. post-thumbnail { position : relative ; }
. post-thumbnail img { display : block ; width : 100 % ; height : auto ; border-radius : 30 px ; }
. post-hover : hover . post-thumbnail { opacity : 0.75 ; }
. post-hover : hover . post-title a { color : #5299eb ; }
. post-hover : hover . thumb-icon { background : #fff ; color : #333 ; }
. post-comments { background : rgba ( 0 , 0 , 0 , 0.6 ) ; font-size : 12 px ; line-height : 20 px ; color : rgba ( 255 , 255 , 255 , 0.8 ) ; display : block ; position : absolute ; top : 14 px ; right : 14 px ; z-index : 1 ; border-radius : 15 px ; }
. post-comments > span { display : block ; position : relative ; padding : 2 px 7 px ; }
. post-comments i { font-size : 18 px ; margin-right : 6 px ; }
. post-comments : hover { background : #fff ; color : #333 ; padding-right : 4 px ; }
. post-title { font-size : 24 px ; letter-spacing : -0.5 px ; line-height : 1.3 em ; font-weight : 600 ; margin-bottom : 20 px ; }
. post-title a { color : #333 ; }
. post-title a : hover { color : #5299eb ; }
. post-date { display : block ; font-size : 13 px ; font-weight : 600 ; text-transform : uppercase ; color : rgba ( 0 , 0 , 0 , 0.3 ) ; }
. post-date i { margin-right : 4 px ; }
/* sticky */
. sticky-icon { color : #999 ; padding : 0 20 px 20 px 0 ; position : absolute ; right : 0 ; bottom : 0 ; }
/* custom more link */
. more-link-custom { opacity : 0 ; background : #5299eb ; color : #fff ; font-size : 16 px ; padding : 8 px 10 px ; border-radius : 30 px 0 0 0 ; position : absolute ; right : 0 ; bottom : 0 ; transition : all 0.5 s ease ; }
. more-link-custom : hover { color : #fff ; padding-right : 20 px ; }
. post-inner : hover . more-link-custom ,
. featured-large : hover . more-link-custom ,
. featured-small : hover . more-link-custom ,
. related-posts li : hover . more-link-custom { opacity : 1 ; }
/* post box hover */
. post-inner ,
. featured-large-inner ,
. featured-small ,
. related-posts li { transition : all 0.5 s ease ; box-shadow : 0 3 px 5 px rgba ( 0 , 0 , 0 , 0.03 ) , 0 1 px 1 px rgba ( 0 , 0 , 0 , 0.05 ) ; }
. post-inner : hover ,
. featured-large-inner : hover ,
. featured-small : hover ,
. related-posts li : hover { box-shadow : 0 5 px 7 px rgba ( 0 , 0 , 0 , 0.10 ) , 0 1 px 1 px rgba ( 0 , 0 , 0 , 0.10 ) ; }
/* password form */
. post-password-form { margin-bottom : 30 px ; float : left ; width : 100 % ; }
. post-password-form p { float : left ; width : 100 % ; }
. post-password-form label { float : left ; }
. post-password-form input [ type = "password" ] { }
. post-password-form input [ type = "submit" ] { display : inline-block ; margin : 28 px 0 0 6 px ; }
/ * post : no thumbnails
/* ------------------------------------ */
. post-grid . no-thumbnail . post-comments { display : none ; }
. post-grid . no-thumbnail . post-content { padding-top : 20 px ; }
. post-list . no-thumbnail . post-inner { padding-left : 20 px ; }
. post-list . no-thumbnail . post-thumbnail ,
. post-list . no-thumbnail . post-comments { display : none ; }
/ * post : search loop
/* ------------------------------------ */
. search . page . post-content { margin : 0 ; }
. search . page . post-standard { padding-bottom : 0 ; }
/ * post : standard loop
/* ------------------------------------ */
. post-standard { }
. post-standard . post-inner { background : #fff ; border-radius : 30 px ; margin-bottom : 30 px ; float : left ; width : 100 % ; }
. post-standard . post-content { padding : 20 px ; }
. post-standard . post-title { font-size : 42 px ; margin-bottom : 10 px ; }
. post-standard . post-category { margin-bottom : 10 px ; }
. post-standard . entry { color : #666 ; }
/ * post : grid loop
/* ------------------------------------ */
. post-grid { }
. post-grid . post-row { padding : 0 0 10 px ; margin-right : -30 px ; margin-bottom : 30 px ; float : left ; position : relative ; display : flex ; flex : 1 1 auto ; flex-wrap : wrap ; }
. post-grid . post-row : last-child { border : none ; margin-bottom : 0 ; }
. post-grid . post ,
. post-grid . page { width : 50 % ; float : left ; border : none ; }
. post-grid . post-inner { background : #fff ; border-radius : 30 px ; margin-right : 30 px ; height : 100 % ; }
. post-grid . post-content { padding : 20 px 20 px 20 px ; }
. post-grid . post-title { margin-bottom : 0 ; }
. post-grid . post-category { padding-top : 10 px ; padding-bottom : 10 px ; }
. post-grid . entry { color : #666 ; }
/ * post : list loop
/* ------------------------------------ */
. post-list { }
. post-list . post-thumbnail { width : auto ; }
. post-list . post-inner { background : #fff ; border-radius : 30 px ; padding : 20 px 20 px 20 px 320 px ; float : left ; width : 100 % ; margin-bottom : 30 px ; position : relative ; }
. post-list . post-thumbnail { margin : -18 px 0 0 -318 px ; max-width : 290 px ; float : left ; }
. post-list . post-content { float : left ; width : 100 % ; }
. post-list . post-title { margin-bottom : 10 px ; }
. post-category { color : #ccc ; text-transform : uppercase ; font-size : 14 px ; font-weight : 600 ; }
. post-list . entry { color : #666 ; }
/ * post : front widgets
/* ------------------------------------ */
. front-widgets { margin-right : -30 px ; margin-bottom : 30 px ; }
. front-widget-col { width : 50 % ; float : left ; }
. front-widget-inner { margin-right : 30 px ; }
. front-widgets . widget { padding-bottom : 20 px ; }
/ * ------------------------------------------------------------------------- *
* Single
/* ------------------------------------------------------------------------- */
. single . post { }
. single . post-category { margin-bottom : 10 px ; }
. single . post-title { font-size : 42 px ; letter-spacing : -0.5 px ; font-weight : 600 ; color : #333 ; line-height : 1.3 em ; margin-bottom : 0 ; }
. single . post-byline { font-size : 14 px ; text-transform : uppercase ; font-weight : 600 ; padding : 10 px 0 24 px ; color : #bbb ; }
. single . post-byline img { width : 32 px ; margin-right : 10 px ; border-radius : 100 % ; position : relative ; bottom : -10 px ; }
. single . entry { margin-bottom : 40 px ; overflow : hidden ; }
. single . entry-inner { max-width : 720 px ; }
/ * single : sharrre
/* ------------------------------------ */
. sharrre-header { background : #fff ; padding : 10 px 10 px 0 ; border-radius : 30 px ; margin-bottom : 30 px ; box-shadow : 0 3 px 5 px rgba ( 0 , 0 , 0 , 0.03 ) , 0 1 px 1 px rgba ( 0 , 0 , 0 , 0.05 ) ; }
. sharrre-header span { float : left ; color : #aaa ; display : none ; text-align : left ; text-transform : uppercase ; font-size : 18 px ; }
. sharrre-header . sharrre { padding : 0 ; float : none ; margin : 0 ; display : inline-block ; }
. sharrre-header . sharrre . box { display : block ; }
. sharrre-header . sharrre . count { float : left ; width : 40 px ; background : #eee ; color : #333 ; text-transform : uppercase ; display : block ; font-size : 15 px ; font-weight : 600 ; line-height : 30 px ; position : relative ; text-align : center ; border-radius : 20 px 4 px 4 px 20 px ; }
. sharrre-header . sharrre . count : after { content : '' ; display : block ; position : absolute ; right : -12 px ; width : 0 ; height : 0 ; border : solid 6 px transparent ; border-left-color : #eee ; margin-left : -6 px ; bottom : 9 px ; }
. sharrre-header . sharrre . share { float : left ; width : 50 px ; display : block ; font-size : 28 px ; font-weight : 600 ; line-height : 32 px ; padding : 0 ; text-align : center ; text-decoration : none ; }
. sharrre-header . sharrre . share i { position : relative ; top : -2 px ; }
. sharrre-header . sharrre . box . share ,
. sharrre-header . sharrre . box . count { -webkit- transition : all .3 s ease ; transition : all .3 s ease ; }
. sharrre-header . sharrre . box : hover . share ,
. sharrre-header . sharrre . box : hover . count { color : #333 !important ; }
. sharrre-header . sharrre # twitter . share ,
. sharrre-header . sharrre # twitter . box . count { color : #00acee ; }
. sharrre-header . sharrre # facebook . share ,
. sharrre-header . sharrre # facebook . box . count { color : #3b5999 ; }
. sharrre-header . sharrre # googleplus . share ,
. sharrre-header . sharrre # googleplus . box . count { color : #cd483c ; }
. sharrre-header . sharrre # pinterest . share ,
. sharrre-header . sharrre # pinterest . box . count { color : #ca2128 ; }
. sharrre-header . sharrre # linkedin . share ,
. sharrre-header . sharrre # linkedin . box . count { color : #0077b5 ; }
/ * single : sharrre footer
/* ------------------------------------ */
. sharrre-footer { display : flex ; flex : 0 1 auto ; margin : 40 px -10 px 0 ; }
. sharrre-footer . sharrre { width : 50 % ; float : left ; flex-basis : 50 % ; max-width : 50 % ; padding : 10 px ; }
. sharrre-footer . sharrre . box { display : block ; padding : 10 px 20 px ; color : #fff ; font-size : 13 px ; border-radius : 30 px ; box-shadow : 0 3 px 5 px rgba ( 0 , 0 , 0 , 0.03 ) , 0 1 px 1 px rgba ( 0 , 0 , 0 , 0.05 ) ; }
. sharrre-footer . sharrre . box : hover { opacity : 0.85 ; padding-left : 30 px ; }
. sharrre-footer . sharrre # twitter-footer . box { background : #24a5db ; }
. sharrre-footer . sharrre # facebook-footer . box { background : #3b5998 ; }
. sharrre-footer . sharrre . share { font-weight : 600 ; text-transform : uppercase ; }
. sharrre-footer . sharrre . share span { color : rgba ( 255 , 255 , 255 , 0.7 ) ; }
. sharrre-footer . sharrre . share i { font-size : 22 px ; margin-right : 6 px ; float : left ; position : relative ; bottom : -2 px ; }
. sharrre-footer . sharrre . count { background : rgba ( 255 , 255 , 255 , 0.15 ) ; float : right ; min-width : 10 px ; padding : 0 10 px ; text-align : center ; border-radius : 30 px ; }
. sharrre-footer . sharrre . count i { font-size : 18 px ; margin : 3 px 0 0 ; float : none ; }
/ * single : post pages
/* ------------------------------------ */
. post-pages { font-weight : 600 ; font-size : 22 px ; margin-bottom : 20 px ; }
/ * single : tags
/* ------------------------------------ */
. post-tags { margin : 40 px 0 ; }
. post-tags span { font-size : 14 px ; color : #999 ; display : inline-block ; margin : 0 7 px 0 0 ; }
. post-tags a { background : #e5e5e5 ; display : inline-block ; line-height : 16 px ; white-space : nowrap ; font-size : 12 px ; color : #888 ; padding : 6 px 12 px ; margin : 0 5 px 2 px 0 ; border-radius : 30 px ; }
. post-tags a : hover { background-color : #5299eb ; color : #fff ; }
/ * single : author bio
/* ------------------------------------ */
. author-bio { background : #fff ; border-radius : 30 px ; position : relative ; padding : 20 px 30 px ; margin-bottom : 30 px ; float : left ; width : 100 % ; box-shadow : 0 3 px 5 px rgba ( 0 , 0 , 0 , 0.03 ) , 0 1 px 1 px rgba ( 0 , 0 , 0 , 0.05 ) ; }
. author-bio . bio-avatar { float : left ; margin : 0 20 px 0 0 ; width : 64 px ; height : auto ; position : relative ; }
. author-bio . bio-avatar img { display : block ; width : 100 % ; height : auto ; border-radius : 30 px ; }
. author-bio p { margin-bottom : 8 px ; }
. author-bio . bio-name { color : #333 ; font-size : 16 px ; font-weight : 600 ; margin-bottom : 10 px ; }
. author-bio . bio-desc { color : #777 ; font-size : 16 px ; line-height : 1.5 em ; }
/ * single : related posts
/* ------------------------------------ */
. related-posts { margin-bottom : 40 px ; position : relative ; display : flex ; flex : 1 1 auto ; flex-wrap : wrap ; }
. related-posts li { width : 33.33 % ; position : relative ; float : left ; display : inline ; background : #fff ; border-radius : 30 px ; overflow : hidden ; }
. related-posts . post { margin-bottom : 0 ; padding-bottom : 6 px ; }
. related-posts li : nth-child ( 4 ) article { display : none ; }
. related-posts li : nth-child ( 3 ) article { border-right-color : transparent ; }
. related-posts . related-inner { padding : 15 px ; }
. single . related-posts . post-title { margin-bottom : 10 px ; font-size : 16 px ; font-weight : 600 ; line-height : 1.4 em ; border : 0 ; padding : 0 ; margin : 0 ; letter-spacing : 0 ; display : block ; }
/ * single : post-nav
/* ------------------------------------ */
. post-nav li { padding : 0 30 px 0 0 ; width : 100 % ; display : inline ; float : left ; text-align : center ; }
. post-nav li a { position : relative ; line-height : 1.4 em ; display : block ; padding : 16 px 40 px 24 px ; }
. post-nav li i { color : rgba ( 0 , 0 , 0 , 0.7 ) ; font-size : 18 px ; position : absolute ; top : 50 % ; margin-top : -10 px ; }
. post-nav li a strong { display : block ; font-size : 12 px ; color : rgba ( 0 , 0 , 0 , 0.3 ) ; letter-spacing : 0.5 px ; font-weight : normal ; text-transform : uppercase ; }
. post-nav li a span { font-size : 14 px ; font-weight : 600 ; color : rgba ( 0 , 0 , 0 , 0.7 ) ; }
. post-nav li a : hover span ,
. post-nav li a : hover i { color : #5299eb ; }
. post-nav li . previous i { left : 10 px ; }
. post-nav li . next i { right : 10 px ; }
. post-nav li a span ,
. post-nav li a i {
-webkit-transition-property : background color ; -webkit-transition-duration : 0 . 2s ; -webkit-transition-timing-function : ease-out ;
-moz-transition-property : background color ; -moz-transition-duration : 0 . 2s ; -moz-transition-timing-function : ease-out ;
transition-property : background color ; transition-duration : 0 . 2s ; transition-timing-function : ease-out ; }
/* sidebar-specific */
. sidebar . post-nav { padding-top : 20 px ; }
. sidebar . post-nav li a { border-bottom : 1 px solid rgba ( 0 , 0 , 0 , 0.05 ) ; }
. dark . sidebar . post-nav li a { border-bottom : 1 px solid rgba ( 255 , 255 , 255 , 0.1 ) ; }
. dark . sidebar . post-nav li i { color : rgba ( 255 , 255 , 255 , 0.7 ) ; }
. dark . sidebar . post-nav li a strong { color : rgba ( 255 , 255 , 255 , 0.3 ) ; }
. dark . sidebar . post-nav li a span { color : rgba ( 255 , 255 , 255 , 0.7 ) ; }
. dark . sidebar . post-nav li a : hover span ,
. dark . sidebar . post-nav li a : hover i { color : #5299eb ; }
/* content-specific */
. content . post-nav { float : left ; width : 100 % ; border-top : 1 px solid #ddd ; border-bottom : 1 px solid #ddd ; margin-bottom : 40 px ; }
. content . post-nav li { width : 50 % ; }
. content . post-nav li . next { float : right ; -webkit- box-shadow : -1 px 0 0 #ddd , inset 1 px 0 0 #ddd ; box-shadow : -1 px 0 0 #ddd , inset 1 px 0 0 #ddd ; }
. content . post-nav li . next a { padding-left : 24 px ; }
. content . post-nav li . previous { float : left ; -webkit- box-shadow : 1 px 0 0 #ddd , inset -1 px 0 0 #ddd ; box-shadow : 1 px 0 0 #ddd , inset -1 px 0 0 #ddd ; }
. content . post-nav li . previous a { padding-right : 24 px ; }
/ * ------------------------------------------------------------------------- *
* Post Formats
/* ------------------------------------------------------------------------- */
. post-format { position : relative ; margin : -28 px -28 px 20 px ; border-radius : 30 px ; overflow : hidden ; }
. post-format img { display : block ; width : 100 % ; height : auto ; }
/ * format : image
/* ------------------------------------ */
/ * format : gallery
/* ------------------------------------ */
/ * format : video
/* ------------------------------------ */
/ * format : audio
/* ------------------------------------ */
. format-audio . post-format iframe { height : 166 px ; width : 100 % ; }
/ * ------------------------------------------------------------------------- *
* Widgets
/* ------------------------------------------------------------------------- */
. widget { color : #777 ; font-size : 14 px ; overflow : hidden ; transition : background 0.2 s ease-in ; }
. widget a { font-weight : 600 ; color : #333 ; }
. widget a : hover { color : #5299eb ; }
. widget > h3 { font-size : 16 px ; color : rgba ( 0 , 0 , 0 , 0.7 ) ; font-weight : 600 ; margin : -20 px -20 px 20 px ; padding : 20 px ; border-bottom : 1 px solid rgba ( 0 , 0 , 0 , 0.05 ) ; }
. widget > h3 a ,
. widget > h3 a : hover { color : rgba ( 255 , 255 , 255 , 0.3 ) ; }
. widget > h3 a img { display : none ; float : left ; margin : 3 px 7 px 0 0 ; }
. widget select { border : 1 px solid #eee ; color : #777 ; font-size : 15 px ; padding : 7 px ; width : 100 % ; max-width : 100 % ; }
. widget label . screen-reader-text { display : none ; }
. sidebar . widget { background : #fff ; border : 1 px solid rgba ( 255 , 255 , 255 , 0.1 ) ; padding : 20 px ; margin : 30 px 30 px 30 px 0 ; border-radius : 4 px 30 px 30 px 4 px ; }
# footer . widget { margin-bottom : 40 px ; }
/ * widgets : icons
/* ------------------------------------ */
. widget > ul li : before ,
. widget > ul li a : before ,
. widget > div > ul li a : before ,
. widget_calendar caption : before { font-family : "Font Awesome 5 Free" ; font-weight : 900 ; font-size : 12 px ; margin-right : 6 px ; color : rgba ( 0 , 0 , 0 , 0.3 ) ; display : inline-block !important ; width : 1 em ; text-align : center ; }
. widget > ul li a : hover : before { color : #5299eb ; }
. widget_archive > ul > li a : before { content : "\f073" ; }
. widget_categories > ul > li a : before { content : "\f07c" ; }
. widget_links > ul > li a : before { content : "\f08e" ; }
. widget_meta > ul > li a : before { content : "\f0da" ; }
. widget_recent_comments > ul > li : before { content : "\f075" ; }
. widget_recent_entries > ul > li a : before { content : "\f017" ; }
. widget_calendar caption : before { content : "\f073" ; }
. widget_pages ul li a : before ,
. widget_nav_menu ul li a : before { content : "\f068" ; }
/ * widgets : title icons
/* ------------------------------------ */
. widget > h3 { position : relative ; }
. widget > h3 > span { display : inline-block ; position : relative ; }
. widget > h3 : before { font-family : "Font Awesome 5 Free" ; font-weight : 900 ; content : "\f067" ; float : right ; color : rgba ( 255 , 255 , 255 , 0.3 ) ; display : inline-block !important ; width : 1 em ; text-align : center ; }
. widget_archive > h3 : before { content : "\f073" ; }
. widget_categories > h3 : before { content : "\f07c" ; }
. widget_links > h3 : before { content : "\f08e" ; }
. widget_meta > h3 : before { content : "\f0da" ; }
. widget_recent_comments > h3 : before { content : "\f075" ; }
. widget_recent_entries > h3 : before { content : "\f017" ; }
. widget_calendar > h3 : before { content : "\f073" ; }
. widget_pages > h3 : before ,
. widget_nav_menu > h3 : before { content : "\f068" ; }
/ * widgets : common
/* ------------------------------------ */
. widget_search > h3 ,
. widget_text > h3 ,
. widget_tag_cloud > h3 ,
. widget_calendar > h3 { margin-bottom : 1 em ; }
. widget_archive ul li ,
. widget_categories ul li ,
. widget_links ul li ,
. widget_meta ul li ,
. widget_recent_comments ul li ,
. widget_recent_entries ul li ,
. widget_rss ul li ,
. widget_pages ul li a ,
. widget_nav_menu ul li a ,
. alx-tab li ,
. alx-posts li { padding : 6 px 20 px 6 px 0 ; transition : all 0.2 s ease ; }
. sidebar . widget_archive ul li : hover ,
. sidebar . widget_categories ul li : hover ,
. sidebar . widget_meta ul li : hover ,
. sidebar . widget_recent_comments ul li : hover ,
. sidebar . widget_recent_entries ul li : hover ,
. sidebar . widget_rss ul li : hover ,
. sidebar . widget_pages ul li a : hover ,
. sidebar . widget_nav_menu ul li a : hover { padding-left : 40 px ; background : rgba ( 0 , 0 , 0 , 0.1 ) ; border-radius : 0 20 px 20 px 0 ; margin-left : -40 px ; }
. sidebar . widget_pages li li a : hover ,
. sidebar . widget_nav_menu li li a : hover { padding-left : 55 px ; }
. sidebar . widget_pages li li li a : hover ,
. sidebar . widget_nav_menu li li li a : hover { padding-left : 70 px ; }
. widget_archive ul li ,
. widget_categories ul li ,
. widget_links ul li { color : #888 ; }
. widget_recent_comments ul li ,
. widget_recent_entries ul li { color : #666 ; }
. widget_recent_entries . post-date { display : block ; }
/ * widget : pages / custom menu
/* ------------------------------------ */
. widget_pages ul li a ,
. widget_nav_menu ul li a { display : block ; }
. widget_pages li li a ,
. widget_nav_menu li li a { padding-left : 15 px ; }
. widget_pages li li li a ,
. widget_nav_menu li li li a { padding-left : 30 px ; }
. widget_pages ul ul ,
. widget_pages ul ul ul ,
. widget_nav_menu ul ul ,
. widget_nav_menu ul ul ul { border : 0 ; }
/ * widget : categories
/* ------------------------------------ */
. widget_categories li li { padding-left : 15 px ; border-bottom : 0 ; padding-bottom : 0 ; }
. widget_categories li li li { padding-left : 15 px ; border-bottom : 0 ; }
. widget_categories li li a { font-size : 13 px ; font-weight : 400 ; }
/ * widget : rss
/* ------------------------------------ */
. widget_rss ul li a { color : #5299eb ; display : block ; }
. widget_rss ul li span . rss-date { color : #333 ; font-weight : 600 ; display : block ; text-transform : uppercase ; font-size : 12 px ; }
. widget_rss ul li cite { color : #999 ; }
/ * widget : search
/* ------------------------------------ */
. widget_search input . search { color : #999 ; padding-left : 26 px ; width : 100 % ; }
. widget_search . screen-reader-text ,
. widget_search # searchsubmit { display : none ; }
/ * widget : text
/* ------------------------------------ */
. widget_text . textwidget p { margin-bottom : 1 em ; }
/ * widget : calendar
/* ------------------------------------ */
. widget_calendar a { color : #5299eb ; font-weight : 600 ; }
. widget_calendar a : hover { color : #333 !important ; }
. widget_calendar # wp-calendar { width : 100 % ; }
. widget_calendar caption { background : #5299eb ; color : #fff ; padding : 5 px 10 px ; }
. widget_calendar caption : before { color : #fff ; color : rgba ( 255 , 255 , 255 , 0.7 ) ; font-size : 15 px ; }
. widget_calendar thead { background : #f2f2f2 ; -webkit- box-shadow : 0 1 px 0 #e5e5e5 ; box-shadow : inset 0 -1 px 0 #e5e5e5 ; }
. widget_calendar th { font-weight : 600 ; }
. widget_calendar th ,
. widget_calendar td { padding : 3 px 0 ; text-align : center ; border : 1 px solid #f2f2f2 ; }
. widget_calendar . pad { padding : 0 !important ; }
/ * custom widget : alxtabs / alxposts
/* ------------------------------------ */
. alx-tabs-nav { padding : 0 ; text-align : center ; margin-bottom : 20 px ; }
. alx-tabs-nav . tab-count-1 li { width : 100 % ; }
. alx-tabs-nav . tab-count-2 li { width : 50 % ; }
. alx-tabs-nav . tab-count-3 li { width : 33.333 % ; }
. alx-tabs-nav . tab-count-4 li { width : 25 % ; }
. alx-tabs-nav li { display : block ; float : left ; }
. alx-tabs-nav li a { font-size : 18 px ; display : block ; padding : 10 px 0 ; border-bottom : 1 px solid #ddd ; }
. alx-tabs-nav li : last-child a { border-right : 0 ; }
. alx-tabs-nav li a : hover { }
. alx-tabs-nav li . active a { color : #5299eb ; border-bottom-color : #5299eb ; }
. alx-tabs-nav li a span { display : none ; }
. alx-posts li { background : rgba ( 0 , 0 , 0 , 0.04 ) ; border-radius : 30 px ; padding : 2 px ; }
. alx-posts li . post-item-inner { padding : 0 20 px 20 px ; }
. alx-tab li ,
. alx-posts li { font-weight : 400 ; line-height : 1.4 em ; overflow : hidden ; }
. alx-tab a ,
. alx-posts a { -webkit- transition : all 0.2 s ease ; -moz- transition : all 0.2 s ease ; transition : all 0.2 s ease ; }
. alx-tab img ,
. alx-posts img { display : block ; width : 100 % ; height : auto ; border-radius : 30 px ; }
. alx-tab img { }
. alx-tab . thumbs-enabled li { padding-left : 94 px ; }
. alx-tab . tab-item-thumbnail { width : 80 px ; margin-left : -94 px ; float : left ; }
. alx-tab . tab-item-thumbnail ,
. alx-posts . post-item-thumbnail { position : relative ; -webkit- transition : all 1 s ease ; -moz- transition : all 1 s ease ; transition : all 1 s ease ; }
. alx-tab . avatars-enabled li { padding-left : 62 px ; }
. alx-tab . tab-item-avatar { margin-left : -62 px ; width : 48 px ; float : left ; -webkit- transition : all 1 s ease ; -moz- transition : all 1 s ease ; transition : all 1 s ease ; }
. alx-tab . tab-item-category ,
. alx-posts . post-item-category { color : #aaa ; text-transform : uppercase ; font-size : 12 px ; }
. alx-tab . tab-item-title a ,
. alx-tab . tab-item-comment a ,
. alx-posts . post-item-title a { font-weight : 600 ; color : #333 ; }
. alx-tab . tab-item-category a : hover ,
. alx-posts . post-item-category a : hover { color : #333 !important ; }
. alx-tab . tab-item-title ,
. alx-tab . tab-item-comment ,
. alx-posts . post-item-title { font-size : 14 px ; line-height : 1.4 em ; margin : 2 px 0 ; -ms- word-wrap : break-word ; word-wrap : break-word ; }
. alx-tab . tab-item-date ,
. alx-tab . tab-item-name ,
. alx-posts . post-item-date { text-transform : uppercase ; color : #aaa ; font-size : 13 px ; }
. alx-tab li : hover . tab-item-thumbnail ,
. alx-tab li : hover . tab-item-avatar ,
. alx-posts li : hover . post-item-thumbnail { opacity : 0.75 ; }
. alx-tab li : hover . thumb-icon ,
. alx-posts li : hover . thumb-icon { background : #fff ; color : #111 ; }
. alx-tab . tab-item-category a ,
. alx-posts . post-item-category a ,
. alx-tab li : hover . tab-item-title a ,
. alx-tab li : hover . tab-item-comment a ,
. alx-posts li : hover . post-item-title a { color : #5299eb ; }
. alx-posts . post-item-thumbnail { margin-bottom : 10 px ; }
. alx-posts . post-item-title { font-size : 14 px ; line-height : 1.4 em ; font-weight : 400 ; }
. alx-posts . post-item-category ,
. alx-posts . post-item-date { font-size : 12 px ; }
. alx-posts li { padding-top : 0 ; padding-right : 0 ; margin-bottom : 15 px ; }
. alx-posts li : last-child { margin-bottom : 0 ; }
/ * ------------------------------------------------------------------------- *
* Dark Widgets
/* ------------------------------------------------------------------------- */
. dark . widget { color : rgba ( 255 , 255 , 255 , 0.6 ) ; }
. dark . sidebar . widget { background : rgba ( 255 , 255 , 255 , 0.1 ) ; border : 1 px solid rgba ( 255 , 255 , 255 , 0.05 ) ; transition : all 0.3 s ease ; }
. dark . sidebar . widget : hover { background : rgba ( 255 , 255 , 255 , 0.14 ) ; border : 1 px solid rgba ( 255 , 255 , 255 , 0.1 ) ; }
. dark . widget a { color : rgba ( 255 , 255 , 255 , 0.8 ) ; }
. dark . widget a : hover { color : #5299eb ; }
. dark . widget > h3 { border-bottom : 1 px solid rgba ( 255 , 255 , 255 , 0.05 ) ; }
. dark . widget > h3 ,
. dark . widget > h3 a ,
. dark . widget > h3 a : hover { color : #fff ; }
. dark . widget select { background : rgba ( 0 , 0 , 0 , 0.25 ) ; border-color : rgba ( 255 , 255 , 255 , 0.1 ) ; color : rgba ( 255 , 255 , 255 , 0.8 ) ; }
/ * widgets : icons
/* ------------------------------------ */
. dark . widget > ul li : before ,
. dark . widget > ul li a : before ,
. dark . widget > div > ul li a : before { color : rgba ( 255 , 255 , 255 , 0.6 ) ; opacity : 0.5 ; }
. dark . widget_calendar caption : before ,
. dark . widget > ul li a : hover : before { color : #fff ; }
/ * widgets : common
/* ------------------------------------ */
. dark . widget_archive ul li ,
. dark . widget_categories ul li ,
. dark . widget_links ul li ,
. dark . widget_meta ul li ,
. dark . widget_recent_comments ul li ,
. dark . widget_recent_entries ul li ,
. dark . widget_rss ul li ,
. dark . widget_pages ul li a ,
. dark . widget_nav_menu ul li a ,
. dark . alx-tab li ,
. dark . alx-posts li ,
. dark . widget_calendar th ,
. dark . widget_calendar td { border-color : #333 ; }
. dark . widget_archive ul li ,
. dark . widget_categories ul li ,
. dark . widget_links ul li ,
. dark . widget_recent_comments ul li ,
. dark . widget_recent_entries ul li { color : rgba ( 255 , 255 , 255 , 0.6 ) ; }
/ * widget : pages / custom menu
/* ------------------------------------ */
/ * widget : rss
/* ------------------------------------ */
. dark . widget_rss ul li a { color : #5299eb ; }
. dark . widget_rss ul li span . rss-date { color : rgba ( 255 , 255 , 255 , 0.8 ) ; }
. dark . widget_rss ul li cite { color : rgba ( 255 , 255 , 255 , 0.5 ) ; }
/ * widget : search
/* ------------------------------------ */
. dark . widget_search input . search { background : transparent ; color : rgba ( 255 , 255 , 255 , 0.7 ) ; border : 1 px solid rgba ( 255 , 255 , 255 , 0.1 ) ; }
. dark . widget_search input . search : focus { color : rgba ( 255 , 255 , 255 , 0.9 ) ; }
/ * widget : calendar
/* ------------------------------------ */
. dark . widget_calendar a : hover { color : rgba ( 255 , 255 , 255 , 0.8 ) !important ; }
. dark . widget_calendar a { color : #5299eb ; }
. dark . widget_calendar thead { background : rgba ( 0 , 0 , 0 , 0.1 ) ; color : #ccc ; -webkit- box-shadow : 0 1 px 0 rgba ( 0 , 0 , 0 , 0.1 ) ; box-shadow : inset 0 -1 px 0 rgba ( 0 , 0 , 0 , 0.1 ) ; }
. dark . widget_calendar caption { background : #5299eb ; }
. dark . widget_calendar th ,
. dark . widget_calendar td { border-color : rgba ( 255 , 255 , 255 , 0.1 ) ; }
/ * custom widget : alxtabs / alxposts
/* ------------------------------------ */
. dark . alx-tabs-nav li a { border-color : rgba ( 255 , 255 , 255 , 0.1 ) ; }
. dark . alx-tabs-nav li . active a { color : #5299eb ; border-bottom-color : #5299eb ; }
. dark . alx-tab . tab-item-category a ,
. dark . alx-posts . post-item-category a ,
. dark . alx-tab li : hover . tab-item-title a ,
. dark . alx-tab li : hover . tab-item-comment a ,
. dark . alx-posts li : hover . post-item-title a { color : #5299eb ; }
. dark . alx-tab . tab-item-category a : hover ,
. dark . alx-posts . post-item-category a : hover { color : rgba ( 255 , 255 , 255 , 0.8 ) !important ; }
. dark . alx-tab . tab-item-date ,
. dark . alx-tab . tab-item-name ,
. dark . alx-posts . post-item-date { color : rgba ( 255 , 255 , 255 , 0.3 ) ; }
. dark . alx-posts li { background : rgba ( 0 , 0 , 0 , 0.1 ) ; }
/ * ------------------------------------------------------------------------- *
* Comments
/* ------------------------------------------------------------------------- */
# comments { margin-top : 20 px ; }
# pinglist-container { display : none ; }
. comment-tabs { border-bottom : 2 px solid #e5e5e5 ; margin-bottom : 20 px ; }
. comment-tabs li { float : left ; margin-bottom : -2 px ; }
. comment-tabs li a { font-size : 14 px ; font-weight : 600 ; padding : 0 10 px 10 px ; display : block ; color : #aaa ; border-bottom : 2 px solid #e5e5e5 ; }
. comment-tabs li a : hover { color : #333 ; border-color : #ccc ; }
. comment-tabs li span { background-color : #e5e5e5 ; padding : 0 6 px ; margin-left : 8 px ; border-radius : 4 px ; }
. comment-tabs li i { margin-right : 6 px ; }
. comment-tabs li . active a { color : #5299eb ; border-bottom-color : #5299eb ; }
. commentlist , . pinglist { margin-bottom : 20 px ; }
. commentlist li , . pinglist li { padding-left : 60 px ; font-size : 14 px ; line-height : 22 px ; font-weight : 400 ; }
. commentlist . comment-body , . pinglist li { clear : both ; position : relative ; padding-bottom : 15 px ; }
. commentlist . comment-author ,
. commentlist . comment-meta ,
. commentlist . comment-awaiting-moderation { font-size : 13 px ; display : inline-block ; line-height : 20 px ; }
. commentlist . comment-author { margin-right : 6 px ; }
. commentlist . fn , . pinglist . ping-link { color : #333 ; font-size : 13 px ; font-style : normal ; font-weight : 600 ; }
. commentlist . says { display : none ; }
. commentlist . avatar { position : absolute ; left : -60 px ; top : 0 ; width : 48 px ; height : 48 px ; border-radius : 3 px ; }
. commentlist . comment-meta : before , . pinglist . ping-meta : before { color : #ccc ; content : "\f017" ; font-family : "Font Awesome 5 Free" ; font-weight : 900 ; font-size : 10 px ; margin-right : 3 px ; vertical-align : 4 % ; }
. commentlist . comment-meta a , . pinglist . ping-meta { color : #aaa ; }
. commentlist . reply { font-size : 13 px ; line-height : 16 px ; font-weight : 300 ; }
. commentlist . reply a { color : #aaa ; }
. commentlist . reply a : hover { color : #333 ; }
. comment-awaiting-moderation { color : #5299eb ; font-style : normal ; }
/* pings */
. pinglist li { padding-left : 0 ; }
/* comment text */
. commentlist . comment-body { font-size : 14 px ; font-weight : 300 ; color : #777 ; line-height : 1.6 em ; }
. commentlist . comment-body p ,
. commentlist . comment-body dd { margin-bottom : 8 px ; }
. commentlist . comment-body dt { color : #333 ; }
. commentlist . comment-body ol ,
. commentlist . comment-body ul { margin : 0 0 15 px 30 px ; }
. commentlist . comment-body ol ol ,
. commentlist . comment-body ol ul ,
. commentlist . comment-body ul ul ,
. commentlist . comment-body ul ol { margin-bottom : 0 ; }
. commentlist . comment-body li { font-weight : 300 ; margin : 0 ; }
. commentlist . comment-body ul li ,
. commentlist . comment-body ol ul li { list-style : square ; padding : 0 ; }
. commentlist . comment-body ol li ,
. commentlist . comment-body ol ul ol li { list-style : decimal ; padding : 0 ; }
. commentlist . comment-body dt { font-weight : 600 ; }
. commentlist . comment-body address { margin-bottom : 1 em ; }
. commentlist . comment-body blockquote { position : relative ; color : #777 ; font-style : italic ; margin : 0 0 20 px 0 ; padding-left : 50 px ; }
. commentlist . comment-body blockquote p { margin-bottom : 0.75 em ; }
. commentlist . comment-body blockquote : before { content : "\f10d" ; color : #ccc ; font-size : 32 px ; font-style : normal ; font-family : "Font Awesome 5 Free" ; font-weight : 900 ; text-align : center ; position : absolute ; left : 0 ; top : 0 ; }
. commentlist . comment-body code , . commentlist . comment-body pre { font-family : Monaco , "Courier New" , "DejaVu Sans Mono" , "Bitstream Vera Sans Mono" , monospace ; font-size : 11 px ; }
. commentlist . comment-body pre { background : url ( img/pre.png ) repeat top ; padding : 18 px 20 px ; margin : 30 px 0 ; border : 1 px solid #ddd ; line-height : 19 px ; white-space : pre-wrap ; word-wrap : break-word ; overflow-x : auto ; overflow-y : hidden ; }
. commentlist . comment-body code { background : #f2f2f2 ; padding : 0 3 px ; }
. commentlist . comment-body ins { background : #fff486 ; }
. commentlist . comment-body sub ,
. commentlist . comment-body sup { font-size : 62.5 % ; }
. commentlist . comment-body sub { vertical-align : sub ; }
. commentlist . comment-body sup { vertical-align : super ; }
. commentlist . comment-body table { font-size : 13 px ; margin-bottom : 1.5 em ; width : 100 % ; text-align : center ; }
. commentlist . comment-body table tr . alt { background : #f2f2f2 ; }
. commentlist . comment-body table td { border-bottom : 1 px solid #f2f2f2 ; text-align : center ; padding : 5 px ; vertical-align : middle ; }
. commentlist . comment-body table th { font-weight : 600 ; text-align : center ; border-top : 1 px solid #f2f2f2 ; border-bottom : 1 px solid #f2f2f2 ; padding : 10 px 5 px ; }
. commentlist . comment-body h1 , . commentlist . comment-body h2 , . commentlist . comment-body h3 , . commentlist . comment-body h4 , . commentlist . comment-body h5 , . commentlist . comment-body h6 { margin-bottom : 14 px ; font-weight : 600 ; line-height : 1.3 em ; }
. commentlist . comment-body h1 { font-size : 24 px ; }
. commentlist . comment-body h2 { font-size : 22 px ; }
. commentlist . comment-body h3 { font-size : 20 px ; }
. commentlist . comment-body h4 { font-size : 18 px ; }
. commentlist . comment-body h5 { font-size : 16 px ; }
. commentlist . comment-body h6 { font-size : 14 px ; }
/* pingback text */
. ping-content { color : #777 ; font-weight : 300 ; }
/* post author & admin comment */
. commentlist li . bypostauthor > . comment-body : after ,
. commentlist li . comment-author-admin > . comment-body : after { box-sizing : content-box ; background : #5299eb ; display : block ; position : absolute ; content : "\f303" ; color : #fff ; line-height : 12 px ; width : 12 px ; font-style : normal ; font-family : "Font Awesome 5 Free" ; font-weight : 900 ; text-align : center ; }
. commentlist li . comment-author-admin > . comment-body : after { content : "\f005" ; /* star for admin */ }
. commentlist li . bypostauthor > . comment-body : after ,
. commentlist li . comment-author-admin > . comment-body : after { top : 32 px ; left : -28 px ; font-size : 8 px ; padding : 2 px ; border-radius : 3 px ; }
. commentlist li li . bypostauthor > . comment-body : after ,
. commentlist li li . comment-author-admin > . comment-body : after { top : 22 px ; left : -26 px ; font-size : 8 px ; padding : 1 px ; border-radius : 2 px ; }
/* child comment */
. commentlist li ul { }
. commentlist li li { padding-left : 48 px ; margin : 0 ; }
. commentlist li li . avatar { width : 36 px ; height : 36 px ; left : -48 px ; top : 0 ; }
. commentlist li li . comment-meta { left : 70 px ; }
/ * comments : nav
/* ------------------------------------ */
. comments-nav { margin-bottom : 20 px ; }
. comments-nav a { font-weight : 600 ; }
. comments-nav . nav-previous { float : left ; }
. comments-nav . nav-next { float : right ; }
/ * comments : form
/* ------------------------------------ */
. logged-in-as ,
. comment-notes ,
. form-allowed-tags { display : none ; }
# respond { position : relative ; }
# reply-title { margin-bottom : 20 px ; }
li # reply-title { font-size : 0 ; margin : 0 !important ; padding : 0 ; height : 0 ; border-top : 0 ; }
# cancel-comment-reply-link { color : #999 ; display : block ; position : absolute ; bottom : 26 px ; right : 20 px ; font-size : 12 px ; }
# cancel-comment-reply-link : hover { color : #777 ; }
# commentform { background : #eee ; box-shadow : 0 3 px 5 px rgba ( 0 , 0 , 0 , 0.03 ) , 0 1 px 1 px rgba ( 0 , 0 , 0 , 0.1 ) ; padding : 10 px 20 px 20 px ; margin-bottom : 15 px ; border-radius : 30 px ; }
# commentform p . comment-form-author { width : 48 % ; float : left ; }
# commentform p . comment-form-email { width : 48 % ; float : right ; }
# commentform p . comment-form-url ,
# commentform p . comment-form-comment { clear : both ; }
# commentform label { padding : 6 px 0 ; font-weight : 600 ; display : block ; }
# commentform input [ type = "text" ] ,
# commentform textarea { max-width : 100 % ; width : 100 % ; }
# commentform textarea { height : 100 px ; }
# commentform p . form-submit { margin-top : 10 px ; }
. logged-in # reply-title { margin-bottom : 20 px ; }
. logged-in # commentform p . comment-form-comment { margin-top : 10 px ; }
. logged-in # commentform p . comment-form-comment label { display : none ; }
# commentform . comment-form-cookies-consent { padding : 10 px 0 ; }
# commentform . comment-form-cookies-consent label { display : inline ; }
/ * ------------------------------------------------------------------------- *
* Child Menu
/* ------------------------------------------------------------------------- */
. child-menu { zoom : 1 ; position : relative ; background : #fff ; border : 1 px solid rgba ( 255 , 255 , 255 , 0.1 ) ; padding : 20 px ; margin : 30 px 30 px 30 px 0 ; border-radius : 4 px 30 px 30 px 4 px ; }
. dark . child-menu { background : rgba ( 255 , 255 , 255 , 0.1 ) ; border : 1 px solid rgba ( 255 , 255 , 255 , 0.05 ) ; }
. col-2cr . child-menu ,
. col-3cr . child-menu ,
. col-3cm . child-menu { margin : 30 px 0 30 px 30 px ; border-radius : 30 px 4 px 4 px 30 px ; }
. child-menu a { color : #666 ; font-weight : 600 ; display : block ; padding : 0 44 px ; }
. dark . child-menu a { color : rgba ( 255 , 255 , 255 , 0.7 ) ; }
. child-menu a : hover { color : #5299eb ; }
. child-menu . current_page_item > a { color : #5299eb ; }
/* show only current page items */
. child-menu > li { display : none ; }
. child-menu > li . current_page_item ,
. child-menu > li . current_page_parent ,
. child-menu > li . current_page_ancestor { display : block ; }
. child-menu > li . current_page_item > ul ul ,
. child-menu > li . current_page_parent > ul ul ,
. child-menu > li . current_page_ancestor > ul ul { display : none ; }
. child-menu > li ul li . current_page_item ul ,
. child-menu > li ul li . current_page_parent ul ,
. child-menu > li ul li . current_page_ancestor ul { display : block ; }
/* level 1 */
. child-menu > li > a { display : block ; font-size : 16 px ; color : rgba ( 0 , 0 , 0 , 0.7 ) ; font-weight : 600 ; margin : -20 px -20 px 20 px ; padding : 20 px ; border-bottom : 1 px solid rgba ( 0 , 0 , 0 , 0.05 ) ; }
. dark . child-menu > li > a { color : #fff ; border-bottom : 1 px solid rgba ( 255 , 255 , 255 , 0.05 ) ; }
/* level 2 */
. child-menu > li > ul { border-top : 1 px solid #f2f2f2 ; border-bottom : 1 px solid #f2f2f2 ; }
. dark . child-menu > li > ul { border-color : rgba ( 255 , 255 , 255 , 0.1 ) ; }
. child-menu > li > ul > li > a { font-size : 15 px ; border-bottom : 1 px solid #f2f2f2 ; border-left : 1 px solid #f2f2f2 ; border-right : 1 px solid #f2f2f2 ; padding : 11 px 20 px ; }
. dark . child-menu > li > ul > li > a { border-color : rgba ( 255 , 255 , 255 , 0.1 ) ; }
. child-menu > li > ul > li > a : before { font-family : "Font Awesome 5 Free" ; font-weight : 900 ; content : "\f067" ; font-size : 18 px ; margin-right : 8 px ; opacity : 0.3 ; }
/* level 3 */
. child-menu > li ul ul { padding : 6 px 0 ; border-left : 10 px solid #f2f2f2 ; border-right : 1 px solid #f2f2f2 ; border-bottom : 1 px solid #f2f2f2 ; }
. dark . child-menu > li ul ul { border-color : rgba ( 255 , 255 , 255 , 0.1 ) ; }
. child-menu > li ul ul a { font-size : 15 px ; font-weight : 300 ; padding-top : 7 px ; padding-bottom : 7 px ; margin-bottom : 1 px ; }
. child-menu > li ul ul a : hover ,
. child-menu > li ul ul li . current_page_item > a { background : #f2f2f2 ; }
. dark . child-menu > li ul ul a : hover ,
. dark . child-menu > li ul ul li . current_page_item > a { background : rgba ( 255 , 255 , 255 , 0.1 ) ; }
/ * ------------------------------------------------------------------------- *
* Plugins
/* ------------------------------------------------------------------------- */
/ * plugin : wp-pagenavi
/* ------------------------------------ */
. wp-pagenavi { overflow : hidden ; text-align : right ; font-weight : 600 ; line-height : 20 px ; float : none ; margin-right : -2 px ; text-align : center ; }
. wp-pagenavi a ,
. wp-pagenavi span { color : #aaa ; font-size : 16 px ; padding : 7 px 8 px ; display : inline-block ; margin : 0 2 px 10 px ; }
. wp-pagenavi span . pages { font-size : 17 px ; font-weight : 300 ; display : block ; margin-bottom : 1 em !important ; border : none !important ; }
. wp-pagenavi span . pages : before { content : "\f15c" ; font-family : "Font Awesome 5 Free" ; font-weight : 900 ; margin-right : 6 px ; }
. wp-pagenavi span . extend { border : none !important ; border-bottom : 3 px solid transparent ; border-top : 1 px solid transparent ; }
. wp-pagenavi a : hover ,
. wp-pagenavi a : active ,
. wp-pagenavi span . current { color : #333 ; }
. wp-pagenavi a { display : inline-block ; color : #5299eb ; border : none ; border-bottom : 3 px solid #e5e5e5 ; border-top : 1 px solid #e5e5e5 ; }
. wp-pagenavi a : hover ,
. wp-pagenavi a : active ,
. wp-pagenavi span . current { display : inline-block ; background : none ; border : none ; border-bottom : 3 px solid #5299eb ; border-top : 1 px solid #e5e5e5 ; }
/ * plugin : social count plus
/* ------------------------------------ */
. social-count-plus > ul { font-weight : 600 ; font-size : 12 px ; text-transform : uppercase ; }
. social-count-plus > ul > li { display : block ; float : none ; width : 100 % ; position : relative ; margin-bottom : 10 px ; }
. social-count-plus > ul > li : last-child { margin-bottom : 0 ; }
. social-count-plus > ul > li > a . icon { height : 40 px ; background : #999 ; display : block ; width : 100 % ; border-radius : 30 px ; }
. social-count-plus > ul > li > a . icon : hover { opacity : 0.8 ; }
. social-count-plus > ul > li > span . items { position : absolute ; left : 0 ; right : 0 ; bottom : 0 ; top : 0 ; pointer-events : none ; }
. social-count-plus > ul > li > span . items > span . count { font-size : 16 px ; display : inline-block ; margin : 8 px 0 8 px 50 px ; padding-left : 10 px ; border-left : 1 px solid rgba ( 255 , 255 , 255 , 0.2 ) ; color : #fff !important ; }
. social-count-plus > ul > li > span . items > span . label { margin-left : 10 px ; color : #fff ; position : relative ; top : -1 px ; }
. social-count-plus > ul > li > a : after { font-family : "Font Awesome 5 Brands" ; font-weight : 400 ; color : #fff ; position : absolute ; font-size : 18 px ; left : 14 px ; text-align : center ; width : 20 px ; top : 0 ; bottom : 0 ; line-height : 40 px ; }
. social-count-plus > ul > li > a : before { font-family : "Font Awesome 5 Free" ; font-weight : 900 ; content : "\f067" ; opacity : 0.5 ; color : #fff !important ; position : absolute ; font-size : 18 px ; right : 6 px ; text-align : center ; width : 20 px ; top : 0 ; bottom : 0 ; line-height : 40 px ; }
. social-count-plus > ul > li > a : hover : before { opacity : 1 ; }
. social-count-plus > ul > li . count-comments > a : after ,
. social-count-plus > ul > li . count-posts > a : after ,
. social-count-plus > ul > li . count-users > a : after { font-family : "Font Awesome 5 Free" ; font-weight : 900 ; }
. social-count-plus > ul > li . count-comments > a { background : #bbb ; }
. social-count-plus > ul > li . count-comments > a : after { content : "\f086" ; }
. social-count-plus > ul > li . count-facebook > a { background : #516eab ; }
. social-count-plus > ul > li . count-facebook > a : after { content : "\f09a" ; }
. social-count-plus > ul > li . count-github > a { background : #2a2b2d ; }
. social-count-plus > ul > li . count-github > a : after { content : "\f09b" ; }
. social-count-plus > ul > li . count-googleplus > a { background : #dc4e41 ; }
. social-count-plus > ul > li . count-googleplus > a : after { content : "\f0d5" ; }
. social-count-plus > ul > li . count-instagram > a { background : #674538 ; }
. social-count-plus > ul > li . count-instagram > a : after { content : "\f16d" ; }
. social-count-plus > ul > li . count-linkedin > a { background : #0077b5 ; }
. social-count-plus > ul > li . count-linkedin > a : after { content : "\f0e1" ; }
. social-count-plus > ul > li . count-pinterest > a { background : #bd081c ; }
. social-count-plus > ul > li . count-pinterest > a : after { content : "\f0d2" ; }
. social-count-plus > ul > li . count-posts > a { background : #bbb ; }
. social-count-plus > ul > li . count-posts > a : after { content : "\f303" ; }
. social-count-plus > ul > li . count-soundcloud > a { background : #ff8800 ; }
. social-count-plus > ul > li . count-soundcloud > a : after { content : "\f1be" ; }
. social-count-plus > ul > li . count-steam > a { background : #222222 ; }
. social-count-plus > ul > li . count-steam > a : after { content : "\f1b6" ; }
. social-count-plus > ul > li . count-tumblr > a { background : #35465c ; }
. social-count-plus > ul > li . count-tumblr > a : after { content : "\f173" ; }
. social-count-plus > ul > li . count-twitch > a { background : #6441a5 ; }
. social-count-plus > ul > li . count-twitch > a : after { content : "\f1e8" ; }
. social-count-plus > ul > li . count-twitter > a { background : #29c5f6 ; }
. social-count-plus > ul > li . count-twitter > a : after { content : "\f099" ; }
. social-count-plus > ul > li . count-users > a { background : #bbb ; }
. social-count-plus > ul > li . count-users > a : after { content : "\f0c0" ; }
. social-count-plus > ul > li . count-vimeo > a { background : #00acee ; }
. social-count-plus > ul > li . count-vimeo > a : after { content : "\f27d" ; }
. social-count-plus > ul > li . count-youtube > a { background : #cd201f ; }
. social-count-plus > ul > li . count-youtube > a : after { content : "\f167" ; }
/ * plugin : woocommerce
/* ------------------------------------ */
/ * ------------------------------------------------------------------------- *
* Flexslider
/* ------------------------------------------------------------------------- */
/ * flexslider : resets
/* ------------------------------------ */
. flex-container a : active ,
. flexslider a : active ,
. flex-container a : focus ,
. flexslider a : focus { outline : none ; }
. slides ,
. flex-control-nav ,
. flex-direction-nav { margin : 0 ; padding : 0 ; list-style : none ; }
/ * flexslider : necessary styles
/* ------------------------------------ */
. flexslider { margin : 0 ; padding : 0 ; }
. flexslider . slides > li { display : none ; -webkit- backface-visibility : hidden ; } /* Hide the slides before the JS is loaded. Avoids image jumping */
. flexslider . slides img { width : 100 % ; height : auto ; display : block ; margin : 0 auto ; }
. flex-pauseplay span { text-transform : capitalize ; }
. slides : after { content : "." ; display : block ; clear : both ; visibility : hidden ; line-height : 0 ; height : 0 ; }
html { -webkit- font-smoothing : antialiased ; /* safari font rendering issue fix */ }
html [ xmlns ] . slides { display : block ; }
* html . slides { height : 1 % ; }
. no-js . slides > li : first-child { display : block ; }
/ * flexslider : default theme
/* ------------------------------------ */
. flexslider { margin : 0 ; position : relative ; zoom : 1 ; }
. flex-viewport { max-height : 2000 px ; -webkit- transition : all 1 s ease ; -moz- transition : all 1 s ease ; transition : all 1 s ease ; }
. loading . flex-viewport { max-height : 300 px ; }
. flexslider . slides { zoom : 1 ; }
. flexslider . slides > li { position : relative ; }
. carousel li { margin-right : 5 px ; }
/* direction nav */
. flex-direction-nav { * height : 0 ; position : absolute ; top : 50 % ; right : 10 px ; left : 10 px ; margin-top : -20 px ; z-index : 2 ; }
. flex-direction-nav li { float : left ; margin-left : 4 px ; }
. flex-direction-nav li : first-child { float : left ; }
. flex-direction-nav li : last-child { float : right ; }
. flex-direction-nav a { background : rgba ( 0 , 0 , 0 , 0.7 ) ; opacity : 0.6 ; position : relative ; width : 40 px ; height : 40 px ; margin : 0 0 0 ; display : block ; cursor : pointer ; text-indent : -999 px ; overflow : hidden ;
-webkit-transition : all . 3s ease ; transition : all . 3s ease ; border-radius : 3px ; }
. flexslider : hover . flex-next ,
. flexslider : hover . flex-prev { opacity : 0.8 ; }
. flexslider : hover . flex-next : hover , . flexslider : hover . flex-prev : hover { opacity : 1 ; }
. flex-direction-nav . flex-disabled { opacity : .3 !important ; filter : alpha ( opacity = 30 ) ; cursor : default ; }
/* direction nav arrows */
. flex-direction-nav a : before { color : #fff ; font-family : "Font Awesome 5 Free" ; font-weight : 900 ; font-size : 20 px ; line-height : 24 px ; position : absolute ; text-align : center ; left : 0 ; right : 0 ; top : 9 px ; text-indent : 0 ; }
. flex-direction-nav . flex-next : before { content : "\f054" ; }
. flex-direction-nav . flex-prev : before { content : "\f053" ; }
/* control nav */
. flex-control-nav { width : 100 % ; position : absolute ; bottom : -30 px ; text-align : center ; }
. flex-control-nav li { margin : 0 3 px ; display : inline-block ; zoom : 1 ; * display : inline ; }
. flex-control-nav li a { background : rgba ( 0 , 0 , 0 , 0.15 ) ; width : 10 px ; height : 10 px ; display : block ; cursor : pointer ; text-indent : -999 px ; overflow : hidden ; border-radius : 100 % ; }
. flex-control-nav li a : hover { background : rgba ( 0 , 0 , 0 , 0.15 ) ; }
. flex-control-nav li a . flex-active { background : rgba ( 0 , 0 , 0 , 0.25 ) ; cursor : default ; }
. flex-control-thumbs { margin : 5 px 0 0 ; position : static ; overflow : hidden ; }
. flex-control-thumbs li { width : 25 % ; float : left ; margin : 0 ; }
. flex-control-thumbs img { width : 100 % ; display : block ; opacity : .7 ; cursor : pointer ; }
. flex-control-thumbs img : hover { opacity : 1 ; }
. flex-control-thumbs . flex-active { opacity : 1 ; cursor : default ; }
@ media screen and ( max-width : 860px ) {
. flex-direction-nav . flex-prev { opacity : .7 ; right : 0 ; }
. flex-direction-nav . flex-next { opacity : .7 ; right : 0 ; }
}
/ * ------------------------------------------------------------------------- *
* Owl Carousel v1 . 3 . 3
/* ------------------------------------------------------------------------- */
/* owl carousel */
. owl-carousel . owl-wrapper : after { content : "." ; display : block ; clear : both ; visibility : hidden ; line-height : 0 ; height : 0 ; }
. owl-carousel { display : none ; position : relative ; width : 100 % ; -ms- touch-action : pan-y ; }
. owl-carousel . owl-wrapper { display : none ; position : relative ; -webkit- transform : translate3d ( 0 px , 0 px , 0 px ) ; }
. owl-carousel . owl-wrapper-outer { overflow : hidden ; position : relative ; width : 100 % ; }
. owl-carousel . owl-wrapper-outer . autoHeight {
-webkit-transition : height 500ms ease-in-out ;
-moz-transition : height 500ms ease-in-out ;
-ms-transition : height 500ms ease-in-out ;
-o-transition : height 500ms ease-in-out ;
transition : height 500ms ease-in-out ; }
. owl-carousel . owl-item { overflow : hidden ; float : left ; }
. owl-controls . owl-page ,
. owl-controls . owl-buttons div { cursor : pointer ; }
. owl-controls {
-webkit-user-select : none ;
-khtml-user-select : none ;
-moz-user-select : none ;
-ms-user-select : none ;
user-select : none ;
-webkit-tap-highlight-color : rgba ( 0 , 0 , 0 , 0 ) ; }
. grabbing { cursor : url ( grabbing.png ) 8 8 , move ; }
. owl-carousel . owl-wrapper ,
. owl-carousel . owl-item {
-webkit-backface-visibility : hidden ;
-moz-backface-visibility : hidden ;
-ms-backface-visibility : hidden ;
-webkit-transform : translate3d ( 0 , 0 , 0 ) ;
-moz-transform : translate3d ( 0 , 0 , 0 ) ;
-ms-transform : translate3d ( 0 , 0 , 0 ) ; }
/* owl theme */
. owl-theme . owl-controls { margin-top : 10 px ; text-align : center ; }
. owl-theme . owl-controls . owl-buttons div { color : #FFF ; display : inline-block ; zoom : 1 ; * display : inline ; margin : 5 px ; padding : 3 px 10 px ; font-size : 12 px ; -webkit- border-radius : 30 px ; -moz- border-radius : 30 px ; border-radius : 30 px ; background : #869791 ; filter : Alpha ( Opacity = 50 ) ; /*IE7 fix*/ opacity : 0.5 ; }
. owl-theme . owl-controls . clickable . owl-buttons div : hover { filter : Alpha ( Opacity = 100 ) ; /*IE7 fix*/ opacity : 1 ; text-decoration : none ; }
. owl-theme . owl-controls . owl-page { display : inline-block ; zoom : 1 ; * display : inline ; /*IE7 life-saver */ }
. owl-theme . owl-controls . owl-page span { display : block ; width : 12 px ; height : 12 px ; margin : 5 px 7 px ; filter : Alpha ( Opacity = 50 ) ; /*IE7 fix*/ opacity : 0.5 ; -webkit- border-radius : 20 px ; -moz- border-radius : 20 px ; border-radius : 20 px ; background : #869791 ; }
. owl-theme . owl-controls . owl-page . active span ,
. owl-theme . owl-controls . clickable . owl-page : hover span { filter : Alpha ( Opacity = 100 ) ; /*IE7 fix*/ opacity : 1 ; }
. owl-theme . owl-controls . owl-page span . owl-numbers { height : auto ; width : auto ; color : #FFF ; padding : 2 px 10 px ; font-size : 12 px ; -webkit- border-radius : 30 px ; -moz- border-radius : 30 px ; border-radius : 30 px ; }
. owl-item . loading { min-height : 150 px ; background : url ( AjaxLoader.gif ) no-repeat center center ; }
/ * ------------------------------------------------------------------------- *
* Accessibility
/* ------------------------------------------------------------------------- */
/* Text meant only for screen readers. */
. screen-reader-text { border : 0 ; clip : rect ( 1 px , 1 px , 1 px , 1 px ) ; clip-path : inset ( 50 % ) ; height : 1 px ; margin : -1 px ; overflow : hidden ; padding : 0 ; position : absolute !important ; width : 1 px ; word-wrap : normal !important ; }
2022-11-21 12:20:09 +01:00
. screen-reader-text : focus { background-color : #fff ; border-radius : 3 px ; box-shadow : 0 0 2 px 2 px rgba ( 0 , 0 , 0 , 0.1 ) ; clip : auto !important ; clip-path : none ; color : #333 ; display : block ; font-size : 14 px ; font-size : 0.875 rem ; font-weight : bold ; height : auto ; right : 5 px ; left : auto ; line-height : normal ; padding : 15 px 23 px 14 px ; text-decoration : none ; top : 5 px ; width : auto ; z-index : 100000 ; }
2020-03-11 14:44:42 +01:00
/* Do not show the outline on the skip link target. */
# page [ tabindex = "-1" ] : focus { outline : 0 ; }