/** * Theme Name: Auberge * Theme URI: http://www.webmandesign.eu/auberge-wordpress-theme/ * Author: WebMan * Author URI: http://www.webmandesign.eu/ * Description: Auberge is responsive, retina-ready, modern restaurant and café WordPress theme. Supports Jetpack plugin to create a food menu, Schema.org markup, Theme Hook Alliance action hooks, translation-ready code, header slideshow, customizable colors and layout, and other cool features. The theme is compatible with Chrome, Safari, Opera, Firefox, Internet Explorer 9+ browsers. Thank you for using one of WebMan's themes (more cool WordPress themes can be found at www.webmandesign.eu). Theme demo at http://themedemos.webmandesign.eu/auberge/ * Version: 1.2 * License: GNU General Public License v2 or later * License URI: http://www.gnu.org/licenses/gpl-2.0.html * Tags: black, gray, green, silver, white, light, dark, one-column, two-columns, three-columns, four-columns, right-sidebar, responsive-layout, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-image-header, featured-images, flexible-header, full-width-template, microformats, sticky-post, theme-options, threaded-comments, translation-ready * Text Domain: wm_domain * * This theme, like WordPress, is licensed under the GPL. * Use it to make something cool, have fun, and share what you've learned with others. * * @todo Try using improved WordPress 4.1+ page templates body classes. */ /** * CONTENT: * * 0. CSS reset * 1. Font icons basics * 2. Core styles * 3. Typography * 4. WordPress styles * 5. Forms * 6. Headings * 7. Site header * 8. Site content * 9. Comments * 10. Sidebar and widgets * 11. Site footer * 100. Plugins integration * 200. Responsive styles */ /** * 0. CSS reset */ /** * ! normalize.css v3.0.2 | MIT License | git.io/normalize */ html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:0.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0} /** * WebMan CSS reset modifications */ html { box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; } menu, ol, ul { padding: 0; margin: 0; } ul { list-style: disc; } figure { margin: 0; } ::-webkit-input-placeholder { line-height: normal; } /** * 1. Font icons basics */ pre:before, #cancel-comment-reply-link:before, .menu-toggle:before, .main-navigation .menu-item-has-children > a:after, .search-toggle:before, .social-links a:before, .posts .type-page:before, .posts .type-nova_menu_item:before, .search-results .type-post:before, .entry-meta-element:before, .entry-meta .comments-link a:before, .entry-meta .entry-likes a:before, .post-table-of-contents a:before, .bypostauthor .comment-author:before, .post-navigation .meta-nav:after, .post-navigation .meta-nav:before, .comment-edit-link:before, .comment-reply-link:before, .widget_archive li:before, .widget_categories li:before, .widget_nav_menu li:before, .widget_pages li:before, .widget_recent_comments li:before, .widget_recent_entries li:before, .widget_zilla_likes_widget li:before { font-family: 'Genericons'; font-style: normal; font-weight: normal; font-variant: normal; text-decoration: inherit; text-transform: none; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; speak: none; } .genericon.vertical-align-middle:before { vertical-align: middle; } .genericon.vertical-align-baseline:before { vertical-align: baseline; } .genericon.vertical-align-bottom:before { vertical-align: bottom; } /** * 2. Core styles */ /** * Main layout */ body { padding-left: 4%; padding-right: 4%; } .site { width: 100%; max-width: 1640px; margin: 0 auto; -webkit-box-shadow: 0 0 3.62rem rgba(0,0,0, .07); box-shadow: 0 0 3.62rem rgba(0,0,0, .07); } .site-content, .site-footer-area, .front-page-widgets, .breadcrumbs { width: 1020px; max-width: 88%; margin: 0 auto; } /** * Global elements and classes */ a { text-decoration: none; -ms-word-wrap: break-word; word-wrap: break-word; } a:hover { text-decoration: underline; } a:hover, a:active { outline: 0; } a:focus { outline: thin dotted; } a:visited {} hr { clear: both; height: 2px; margin: 3.62em 0; border: 0; } abbr[title], acronym[title] { cursor: help; } blockquote { clear: both; position: relative; padding: 1em 0; margin: 1.62em 0; text-align: center; } blockquote:before, blockquote:after { content: ''; display: block; position: absolute; width: 38%; height: 100%; left: 31%; top: 0; pointer-events: none; border-top: 1px solid; border-bottom: 1px solid; } blockquote:after { width: 2%; left: 49%; border-top: .19em solid; border-bottom: .19em solid; } blockquote p { margin: 1em 0 0; } blockquote p:first-child { margin: 0; } cite { border: 0; } cite:before { content: '\2014\2002'; } blockquote cite { display: block; margin-top: .62em; } q:before { content: '\201C'; } q:after { content: '\201D'; } mark, ins, .highlight { padding: .19em 0; margin: 0 .38em; -webkit-box-decoration-break: clone; -ms-box-decoration-break: clone; box-decoration-break: clone; } del, strike { text-decoration: line-through; color: inherit; opacity: .5; } img, iframe { vertical-align: middle; } img[width], img[height] { height: auto; } iframe { border: 0; outline: 0; } code { position: relative; display: inline-block; padding: 0 .62em; margin: 0 .19em; } mark code, ins code, .form-allowed-tags code, .taxonomy-description code { display: inline; padding: 0 .38em; background: transparent; color: inherit; } pre { position: relative; max-width: 100%; padding: 4% 8% 4% 4%; margin-bottom: 1.62em; border-radius: .38em; overflow: auto; -moz-tab-size: 2; tab-size: 2; } pre:before { content: '\f462'; position: absolute; height: 100%; right: 0; top: 0; padding: 0 3px; font-size: 1.38em; line-height: 1.62; z-index: 5; } ul, ol { margin: 0 1.62em 1em 1.38em; } ol ol { list-style: upper-alpha; } ol ol ol { list-style: upper-roman; } ol ol ol ol { list-style: lower-alpha; } li > ul, li > ol { margin-bottom: 0; } dl { margin-bottom: 1.62em; } dd { margin-left: 1.62em; } ::selection { text-shadow: none; } ::-moz-selection { text-shadow: none; } /** * Tables */ table { width: 100%; margin: 0 0 1.62em; border: 1px solid; border-collapse: separate; border-radius: .38em; } caption { padding: 1em 0; text-align: left; } td, th { padding: .62em 1em; border-bottom: 1px solid; border-left: 1px solid; } th:first-child, td:first-child { border-left: 0; } th, tfoot td { text-align: left; } caption + thead tr:first-child th, caption + thead tr:first-child td, colgroup + thead tr:first-child th, colgroup + thead tr:first-child td, thead:first-child tr:first-child th, thead:first-child tr:first-child td { border-top: 0; } thead + tbody tr:first-child td, thead + tbody tr:first-child th { border-top-width: .19em; } /** * Classes */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; } .screen-reader-text:hover, .screen-reader-text:active, .screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } .text-center { text-align: center; } /** * Clearing */ .clear:before, .clear:after, .clearfix:before, .clearfix:after, .entry-content:before, .entry-content:after, .comment-content:before, .comment-content:after, .menu-items:before, .menu-items:after, .gallery:before, .gallery:after, .tagcloud:before, .tagcloud:after, .widget_text:before, .widget_text:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after { content: ' '; display: table; } .clear, .clear:after, .clearfix:after, .entry-content:after, .comment-content:after, .menu-items:after, .gallery:after, .tagcloud:after, .widget_text:after, .site-header:after, .site-content:after, .site-footer:after { clear: both; } .clear-left { clear: left; } .clear-right { clear: right; } /** * Pagination */ .pagination { clear: both; margin-top: 1.62rem; text-align: center; } .pagination a, .pagination span { display: inline-block; width: 3em; padding: .62em 0; margin: .19em .19em .19em 0; text-align: center; text-decoration: none; } .pagination a { opacity: .5; } .pagination > span, .pagination a:active, .pagination a:hover, .pagination .current { opacity: 1; } /* Dots */ .pagination > span.dots, .pagination .extend { width: auto; background: transparent; color: inherit; } /** * Scrollbars */ ::-webkit-scrollbar { width: 8px; } /* Track */ ::-webkit-scrollbar-track { background: rgba(255,255,255, .5); -webkit-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 0 0 0 1px rgba(255,255,255, .3), inset 0 0 6px rgba(0,0,0, .3); } /* Handle */ ::-webkit-scrollbar-thumb { background: rgba(0,0,0, .5); -webkit-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0, .3); } ::-webkit-scrollbar-thumb:window-inactive { background: rgba(0,0,0, .25); } /** * MediaElement player custom styles */ /* Player */ .site .mejs-container { min-height: 50px; margin: 1.62em 0; } .site .mejs-video { width: 100% !important; } .site .mejs-overlay-button { margin: -50px 0 0 -50px !important; } .site .mejs-container .mejs-controls { height: 50px; padding: 0 20px; background: #2a2c2e; } .site .mejs-container .mejs-controls div { margin-top: 10px; } .site .mejs-container .mejs-controls button { -webkit-box-shadow: none; box-shadow: none; } .site .mejs-container .mejs-controls .mejs-time-rail .mejs-time-total { background: #1a1c1e; } .site .mejs-container .mejs-controls .mejs-time-rail .mejs-time-loaded { height: 6px; margin-top: 2px; background: #3a3c3e; border-radius: 0; } .site .mejs-container .mejs-controls .mejs-time-rail .mejs-time-current { background: #6a6c6e; } /* Playlist */ .site .wp-playlist { padding: 1.62em; margin: 1.62em 0; background-color: #eaecee; border: 0; } .site .wp-playlist-current-item { margin-bottom: 1em; } .site .wp-playlist .mejs-container { width: 100% !important; } .site .wp-playlist-tracks { margin-top: 1em; } .site .wp-playlist-item { padding: .62em 0; border-color: #caccce; } .site .wp-playlist .wp-playlist-playing { background: transparent; } .site .wp-playlist-item-length { margin-top: .62em; } /* WP Audio modifications */ .site .wp-audio-playlist .mejs-container { height: 50px !important; } /* WP Video modifications */ .mejs-container video { height: auto; } .entry-media .mejs-container, .entry-media .wp-playlist { margin: 0; } .wp-video .mejs-controls, .wp-video-playlist .mejs-controls { visibility: hidden; } .wp-video:hover .mejs-controls, .wp-video-playlist:hover .mejs-controls { visibility: visible; } .wp-video .mejs-layer, .wp-video-playlist .mejs-layer { width: 100% !important; height: 100% !important; } /** * 3. Typography * * Tips from: * @link http://goo.gl/Hhb0jD * @link http://typeplate.com * @link http://www.pearsonified.com/typography/ */ /** * Base */ html { font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 100%; line-height: 1.62; } pre, code, kbd, tt, var { font-family: 'Lucida Console', Monaco, 'Courier New', monospace; font-size: 1em; font-style: normal; font-weight: 400; text-transform: none; text-decoration: none; } pre, pre code { white-space: -moz-pre-wrap; white-space: pre-wrap; /* http://css-tricks.com/almanac/properties/w/whitespace */ -ms-word-wrap: normal; word-wrap: normal; } p, address { padding: 0; margin: 0 0 1.62em; -ms-word-wrap: break-word; word-wrap: break-word; } sup, sub { position: relative; height: 0; line-height: 0; font-size: .81em; vertical-align: baseline; } sup { bottom: 1ex; } sub { top: .5ex; } .uppercase { text-transform: uppercase; } /** * Font sizes */ /** * Basic font size setup */ html { font-size: 16px; } /** * Relative font sizes: */ /* Relative to root */ .breadcrumbs, .widget-title { font-size: .81rem; } /* basic: */ input, select, textarea, blockquote blockquote { font-size: 1rem; } .site-title { font-size: 1.9rem; } .site-banner h1 { font-size: 3.62rem; } /* Relative to container */ .entry-title .entry-edit { font-size: .62em; } /* basic: */ small, /* custom: */ pre, code, blockquote cite, .small, .menu-item-description, .comment-metadata, .pingback .edit-link, .comment .reply, .comments-title .add-comment-link, #cancel-comment-reply-link, .comment-form label, .gallery-caption, .wp-caption .wp-caption-text, .sidebar, .menu-group-nav-link { font-size: .81em; } .main-navigation .menu, .nav-search-form, .food-menu-item-description, .posts .entry-meta, .site-footer { font-size: .9em; } h4, h5, h6, .h4, .h5, .h6, .food-menu-item-header h3 { font-size: 1.15em; } h3, .h3, .posts .entry-title, .comments-title, .social-links { font-size: 1.24em; } h2, .h2, blockquote, .post-navigation a { font-size: 1.38em; } h1, .h1, .nav-search-form .search-field { font-size: 1.62em; } .error-404 .page-title, .not-found .page-title { font-size: 2.24em; } /** * Font weights */ body, blockquote, .entry-title .entry-edit, .site-title, .items .food-menu-item-description .post-excerpt, .pagination, .post-navigation .meta-nav { font-weight: 300; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, blockquote cite, .site-banner .post .entry-title, #cancel-comment-reply-link, #back-to-top { font-weight: 400; } abbr { font-weight: 600; } /* basic: */ b, strong, /* custom: */ dt, th, tfoot td, .pagination .current, .active-menu-item > a, .post .entry-title, .menu-group-title, .comment-form label, .widget .current-menu-item > a, .widget .current_page_item > a, .site-info a { font-weight: 700; } /** * Font styles */ /* basic: */ cite, dfn, em, i, /* custom: */ blockquote, .taxonomy-description, .gallery-caption, .recentcomments a { font-style: italic; } cite { font-style: normal; } /** * Line heights */ body, .site-description, .sidebar, .tagcloud, .form-allowed-tags { line-height: 1.62; } pre { line-height: 1.5; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, blockquote, table, .gallery-caption, .wp-caption .wp-caption-text, .post-navigation a { line-height: 1.38; } .food-menu-item-header h3 { line-height: 1.19; } .site-title, .site-footer .social-links { line-height: 1; } /** * 4. WordPress styles */ /** * Make WordPress embeds responsive */ .twitter-tweet-rendered { width: 100% !important; margin: 1.62em 0 !important; } /** * Alignment */ .alignleft, .wp-caption.alignleft, img.alignleft { float: left; margin-right: 1.62em; margin-bottom: 1.62em; } .alignright, .wp-caption.alignright, img.alignright { float: right; margin-left: 1.62em; margin-bottom: 1.62em; } .aligncenter, .wp-caption.aligncenter, img.aligncenter { display: block; margin-left: auto; margin-right: auto; } .alignnone, img.alignnone { margin: 0; } /** * Pullquotes */ blockquote.alignleft, blockquote.alignright { clear: none; width: 38%; padding: 0 6%; margin-top: 0; margin-left: 6%; margin-right: 6%; text-align: left; } blockquote.alignleft { padding-left: 0; margin-left: -19%; text-align: right; } blockquote.alignright { padding-right: 0; margin-right: -19%; } blockquote.alignleft:before, blockquote.alignleft:after, blockquote.alignright:before, blockquote.alignright:after { width: 1px; height: 62%; left: 0; top: 19%; border: 0; border-left: 1px solid; } blockquote.alignleft:after, blockquote.alignright:after { width: 1px; height: 6%; left: 0; top: 47%; border: 0; border-left: .19em solid; } blockquote.alignleft:before, blockquote.alignleft:after { left: auto; right: 0; border: 0; border-right: 1px solid; } blockquote.alignleft:after { left: auto; right: 0; border: 0; border-right: .19em solid; } /** * Image captions */ .wp-caption { position: relative; display: inline-block; max-width: 100%; padding: 0; margin: 0 auto 1.62em; text-align: center; text-transform: uppercase; overflow: hidden; } .wp-caption .wp-caption-text { padding: 1em 0 0; overflow: hidden; opacity: .75; } /** * Gallery */ .gallery { clear: both; margin: 0 0 1.62em; overflow: hidden; } .gallery a { display: block; } .gallery img { width: 100%; } .gallery-item { float: left; position: relative; padding: 0; margin: 0 1% 2%; } .gallery-columns-1 .gallery-item { float: none; width: 100%; } .gallery-columns-2 .gallery-item { width: 48%; } .gallery-columns-3 .gallery-item { width: 31.333%; } .gallery-columns-4 .gallery-item { width: 23%; } .gallery-columns-5 .gallery-item { width: 18%; } .gallery-columns-6 .gallery-item { width: 14.666%; } .gallery-columns-7 .gallery-item { width: 12.285%; } .gallery-columns-8 .gallery-item { width: 10.5%; } .gallery-columns-9 .gallery-item { width: 9.111%; } .gallery-icon { display: block; } .gallery-item, .tiled-gallery-item, .gallery-icon, .gallery-caption { overflow: hidden; } .gallery-caption { display: block; position: absolute; width: 100%; max-height: 50%; left: 0; bottom: 0; padding: .62em 1em; opacity: 0; -webkit-transition: all .3s; transition: all .3s; } .gallery-item:hover .gallery-caption { opacity: 1; } .gallery-columns-6 .gallery-caption, .gallery-columns-7 .gallery-caption, .gallery-columns-8 .gallery-caption, .gallery-columns-9 .gallery-caption { display: none; } /** * Smilies */ .page-content img.wp-smiley, .entry-content img.wp-smiley, .comment-content img.wp-smiley { display: inline; width: auto; max-height: 1em; margin: 0; border: 0; } /** * Sticky posts */ .sticky {} .label-sticky { position: absolute; display: block; width: 32px; height: 32px; right: 0; top: 0; line-height: 28px; text-align: center; z-index: 10; } .label-sticky .genericon { margin-left: -.38em; font-size: 18px; vertical-align: bottom; } .label-sticky:before, .label-sticky:after { content: ''; position: absolute; display: block; border: 16px solid transparent; } .label-sticky:before { right: 100%; top: 0; } .label-sticky:after { right: 0; top: 100%; } /** * 5. Forms */ /** * Forms reset */ form { margin: 0 0 1.62em; } fieldset { padding: 0; margin: 0; border: 0; } button, input, select, textarea { max-width: 100%; padding: .62em; line-height: normal; font-size: 1em; font-family: inherit; color: inherit; border: 2px solid; outline: 0; vertical-align: baseline; } textarea, select[multiple], select[size] { height: auto; line-height: 1.62; } textarea, input:not([type]), input[type="email"], input[type="password"], input[type="search"], input[type="tel"] , input[type="text"], input[type="url"] { -webkit-appearance: none; } input[type="search"] { box-sizing: border-box; } :invalid { box-shadow: none; } /** * Basic form styles */ /* Labels */ label { display: inline-block; padding-bottom: .19em; } label[for] { cursor: pointer; } /* Text inputs */ select, input:not([type]), input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"] { width: 17em; } textarea { vertical-align: top; -ms-word-wrap: break-word; word-wrap: break-word; overflow-y: auto; resize: vertical; } /* Checkboxes and radio buttons */ input[type="checkbox"], input[type="radio"] { position: relative; width: 1em; height: 1em; bottom: -.19em; margin-right: .38em; vertical-align: baseline; } label + input[type="checkbox"] { margin-left: .38em; } /* Select */ select { position: relative; height: auto; line-height: 1.62; } /* Buttons */ .button, button, input[type="button"], input[type="reset"], input[type="submit"] { padding: 1em; white-space: nowrap; border: 0; -webkit-transition: all .3s; transition: all .3s; } .button:hover, button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { text-decoration: none; opacity: .75; } .button:hover, button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover, .button:focus, button:focus, input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus, .button:active, button:active, input[type="button"]:active, input[type="reset"]:active, input[type="submit"]:active { text-decoration: none; opacity: .75; } .button:active, button:active, input[type="button"]:active, input[type="reset"]:active, input[type="submit"]:active { opacity: .9; } /* Disabled inputs */ input[disabled] { cursor: none; opacity: .66; } /** * Comments form */ .comment-respond { padding: 1.62em 0 0; border-top: 2px solid; } .comment-list .comment-respond { margin: 1.62em 0; border-bottom: 2px solid; } .comment-reply-title { margin-bottom: .62em; } #cancel-comment-reply-link { float: right; } #cancel-comment-reply-link:before { content: '\f405'; margin-right: .19em; font-size: 1.38em; vertical-align: middle; } .comment-form {} .comment-form p { margin-bottom: 1em; } .comment-form label { display: block; } .comment-form-author input, .comment-form-email input, .comment-form-url input, .comment-form-comment textarea { width: 100%; } .comment-form-author, .comment-form-email { float: left; width: 48%; margin-left: 4%; } .comment-form-author { margin-left: 0; } .comment-form-url { clear: both; } /** * Search form */ .form-search { display: block; position: relative; max-width: 100%; margin: 0; text-align: left; } .form-search .search-field { position: relative; width: 100%; text-align: inherit; z-index: 0; } /** * 6. Headings */ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { clear: both; padding: 0; margin: 6% 0 4%; text-transform: uppercase; -ms-word-wrap: break-word; word-wrap: break-word; text-rendering: optimizeLegibility; /* https://developer.mozilla.org/en-US/docs/CSS/text-rendering */ } h1, h2, h3, .h1, .h2, .h3 { letter-spacing: .1em; } h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child, .h1:first-child, .h2:first-child, .h3:first-child, .h4:first-child, .h5:first-child, .h6:first-child { margin-top: 0; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .h1 a, .h2 a, .h3 a, .h4 a, .h5 a, .h6 a { text-decoration: none; color: inherit; } /** * Entry title */ .entry-title, .page-title { padding: 0; margin: 0 0 6%; text-transform: uppercase; -ms-word-wrap: break-word; word-wrap: break-word; } .entry-title .entry-edit { display: block; margin-top: .62em; } .entry-title .entry-edit:before { content: '\2014\2002'; } .page-title { padding: 3.62rem 0; margin: 0; text-align: center; border-top: 2px solid; } .archive .page-title, .search .page-title, .error404 .page-title { padding-top: 0; border: 0; } /** * Widget title */ .widget-title { margin: 0 0 1.62rem; letter-spacing: .1em; } /** * 7. Site header */ .site-header { position: relative; padding: 0 4%; line-height: 5rem; z-index: 999; } /** * Site branding (logo) */ .site-branding { float: left; display: inline-block; margin: 0; color: inherit; } .site-title { display: inline-block; position: relative; top: -.09em; margin: 0; letter-spacing: .19em; text-transform: uppercase; vertical-align: middle; } .site-description { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; } .site-title, .site-branding a, .site-branding a:hover, .site-branding a:active { text-decoration: none; color: inherit; } .site-branding img { display: inline-block; vertical-align: top; } /** * Navigation */ .main-navigation { float: left; position: relative; display: inline-block; margin-left: 4%; } .main-navigation a:hover, .main-navigation a:active { color: inherit; } .main-navigation .menu { float: left; } .main-navigation ul { padding: 0; margin: 0; text-transform: uppercase; list-style: none; } .main-navigation li { float: left; position: relative; padding: 0; margin: 0 2em 0 0; white-space: nowrap; } .main-navigation ul a { display: inline-block; max-width: 100%; /* fix for FF and IE */ padding: 0; text-decoration: none; color: inherit; opacity: .5; -webkit-transition: all .4s ease-in-out; transition: all .4s ease-in-out; } .menu-item-description { display: block; text-transform: uppercase; opacity: .5; } .main-navigation .menu > ul > li > a .menu-item-description { display: none; } /* Arrows for menu item with submenu */ .main-navigation .menu-item-has-children > a:after { content: '\f510'; display: inline-block; position: relative; height: 8px; top: 0; margin: 0 -.38em 0 .62em; font-size: 10px; opacity: .5; } /** * Submenu */ .main-navigation li ul { position: absolute; visibility: hidden; min-width: 100%; min-width: calc( 100% + 3.24em ); left: -1.62em; top: 138%; padding: 0 0 .38em; margin: 0; text-transform: none; opacity: 0; z-index: 99; border-radius: 0 0 .38em .38em; -webkit-box-shadow: 0 5px 20px 0 rgba(0,0,0, .4); box-shadow: 0 5px 20px 0 rgba(0,0,0, .4); -webkit-transition: all .4s ease-in-out; transition: all .4s ease-in-out; } .main-navigation li:hover > ul { visibility: visible; top: 100%; opacity: 1; } .main-navigation li li, .main-navigation li li a { -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .main-navigation li li { float: none; display: block; margin: 0; line-height: 1.62; border-top: 1px solid; } .main-navigation li li:first-child { border: 0; } .main-navigation li li > a { display: block; min-width: 10em; padding: .62em 1.62em; color: inherit; } /* Arrows for menu item with submenu */ .main-navigation li .menu-item-has-children > a:after { content: '\f510'; position: absolute; top: 50%; right: 10px; margin: 0; line-height: 1; -webkit-transform: translateY( -50% ); -ms-transform: translateY( -50% ); transform: translateY( -50% ); } .main-navigation li .menu-item-has-children > a { padding-right: 2em; } /** * Sub-submenu */ .main-navigation li li ul { visibility: hidden; padding-top: .38em; left: 119%; right: auto; border-radius: .38em; -webkit-transition: opacity .4s, left .4s ease-in-out; transition: opacity .4s, left .4s ease-in-out; } .main-navigation li li:hover > ul { left: 100%; right: auto; top: -.38em; } /** * Active menu item */ .main-navigation .menu a:hover, .main-navigation .menu li:hover > a, .main-navigation .menu li.active-menu-item > a { opacity: 1; } /** * Mobile menu toggle */ .menu-toggle { display: none; } /** * Navigation search form */ .nav-search-form { float: right; padding: 0; vertical-align: top; } .search-toggle { display: inline-block; position: relative; font-size: 1.62rem; color: inherit; vertical-align: top; } .search-toggle:before { content: '\f400'; vertical-align: top; } .nav-search-form.active .search-toggle:before { content: '\f406'; } .search-toggle:hover { text-decoration: none; } .nav-search-form .form-search { position: absolute; width: 100%; max-width: 100%; top: -100%; right: 0; padding: 1rem; text-align: center; line-height: 1; opacity: 0; z-index: -1; overflow: hidden; -webkit-box-shadow: 0 5px 20px 0 rgba(0,0,0, .2); box-shadow: 0 5px 20px 0 rgba(0,0,0, .2); -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .nav-search-form.active .form-search, .no-js .nav-search-form:hover .form-search { top: 100%; opacity: 1; } .nav-search-form .search-field, .nav-search-form .search-field:focus { padding: 4% 2%; vertical-align: top; } /** * Social links menu */ .social-links { float: right; } .social-links a { opacity: .5; } .social-links ul { margin: 0; list-style: none; overflow: hidden; } .social-links li { float: left; } .social-links a { padding-left: .62em; color: inherit; -webkit-transition: all .4s; transition: all .4s; } .social-links a:hover { text-decoration: none; opacity: 1; } .social-links a:before { content: ''; display: inline-block; vertical-align: top; } .social-links a[href^="http"]:before, .social-links .website a:before { content: '\f475'; } .social-links a[href*="mailto:"]:before, .social-links .email a:before { content: '\f410'; } .social-links a[href*="/feed/"]:before, .social-links .rss a:before { content: '\f413'; } .social-links a[href*="codepen.io"]:before, .social-links .codepen a:before { content: '\f216'; } .social-links a[href*="digg.com"]:before, .social-links .digg a:before { content: '\f221'; } .social-links a[href*="dribbble.com"]:before, .social-links .dribbble a:before { content: '\f201'; } .social-links a[href*="dropbox.com"]:before, .social-links .dropbox a:before { content: '\f225'; } .social-links a[href*="facebook.com"]:before, .social-links .facebook a:before { content: '\f204'; } .social-links a[href*="flickr.com"]:before, .social-links .flickr a:before { content: '\f211'; } .social-links a[href*="foursquare.com"]:before, .social-links .foursquare a:before { content: '\f226'; } .social-links a[href*="github.com"]:before, .social-links .github a:before { content: '\f200'; } .social-links a[href*="instagram.com"]:before, .social-links .instagram a:before { content: '\f215'; } .social-links a[href*="linkedin.com"]:before, .social-links .linkedin a:before { content: '\f207'; } .social-links a[href*="pinterest.com"]:before, .social-links .pinterest a:before { content: '\f209'; } .social-links a[href*="plus.google.com"]:before, .social-links .google-plus a:before { content: '\f218'; } .social-links a[href*="getpocket.com"]:before, .social-links .pocket a:before { content: '\f224'; } .social-links a[href*="polldaddy.com"]:before, .social-links .polldaddy a:before { content: '\f217'; } .social-links a[href*="reddit.com"]:before, .social-links .reddit a:before { content: '\f222'; } .social-links a[href*="skype:"]:before, .social-links .skype a:before { content: '\f220'; } .social-links a[href*="spotify.com"]:before, .social-links .spotify a:before { content: '\f515'; } .social-links a[href*="stumbleupon.com"]:before, .social-links .stumbleupon a:before { content: '\f223'; } .social-links a[href*="tumblr.com"]:before, .social-links .tumblr a:before { content: '\f214'; } .social-links a[href*="twitch.tv"]:before, .social-links .twitch a:before { content: '\f516'; } .social-links a[href*="twitter.com"]:before, .social-links .twitter a:before { content: '\f202'; } .social-links a[href*="vimeo.com"]:before, .social-links .vimeo a:before { content: '\f212'; } .social-links a[href*="wordpress.org"]:before, .social-links a[href*="wordpress.com"]:before, .social-links .wordpress a:before { content: '\f205'; } .social-links a[href*="youtube.com"]:before, .social-links .youtube a:before { content: '\f213'; } /** * Site banner (featured content) */ .site-banner { clear: both; position: relative; } .no-js .site-banner.enable-slider .hentry, .enable-slider .site-banner-inner:not(.slick-slider) .hentry { display: none; } .no-js .site-banner.enable-slider .hentry:first-child, .enable-slider .site-banner-inner:not(.slick-slider) .hentry:first-child { display: block; } .site-banner-header { position: absolute; width: 100%; bottom: 19%; } .site-banner a, .site-banner a:hover { text-decoration: none; } .site-banner h1, .site-banner .slider-nav, .site-banner .slick-dots { width: 1020px; max-width: 88%; padding: 0 19rem 0 0; margin: 0 auto; text-transform: none; letter-spacing: 2px; color: inherit; } .site-banner-media { position: relative; z-index: 0; } .site-banner-media:before { content: ''; position: absolute; display: block; width: 100%; height: 38%; left: 0; bottom: 0; z-index: 1; } /** * 8. Site content */ .site-content { padding: 6% 0; } .home .site-content { padding: 4% 0; } /** * Main content area */ .is-singular .site-main > .hentry { position: relative; float: left; width: 62%; } .single-post .entry-header { margin-bottom: 1.62em; } .single-post .main-heading.entry-header { margin-bottom: 0; } /** * Post excerpt */ .entry-summary, .more-tag-excerpt { margin: 1.62em 0; } .single .post-excerpt, .post-excerpt.has-more-tag { text-transform: uppercase; } /** * Media */ /* Images */ .is-singular.not-front-page .entry-media { margin-bottom: 6%; } .entry-media img { width: 100%; vertical-align: top; } a img { -webkit-transition: all .4s ease-in-out; transition: all .4s ease-in-out; } a img:hover { -webkit-box-shadow: 0 1rem .62rem -.62rem rgba(0,0,0, .25); box-shadow: 0 1rem .62rem -.62rem rgba(0,0,0, .25); } /* Videos */ .video-container, .wp-video .mejs-container, .wp-video-playlist .mejs-container { position: relative; max-width: 100%; height: 0 !important; padding: 0 0 56.25%; /* 16:9 ratio only */ } .video-container iframe, .video-container object, .video-container embed, .wp-video .mejs-container .mejs-inner, .wp-video-playlist .mejs-container .mejs-inner { position: absolute; width: 100%; height: 100%; left: 0; top: 0; } .wp-video { width: 100% !important; height: auto !important; } /** * Content columns */ .column { float: left; margin: 0 6% 0 0; } .column.last { margin-right: 0; } .column-12 { width: 47%; } .column-13 { width: 29.33%; } .column-23 { width: 64.66%; } .column-14 { width: 21%; } .column-34 { width: 73%; } /** * Page sections */ /* Page section basic elements */ .page-section:first-child .page-title { padding-top: 0; border-top: 0; } .archive-link { clear: both; padding: 0 0 6%; text-align: center; } .archive-link a { display: inline-block; } /* Posts list in page section */ .page-section .posts .hentry { z-index: 0; -webkit-transition: padding .4s, height .4s, -webkit-transform .4s, -webkit-box-shadow .4s; transition: padding .4s, height .4s, transform .4s, box-shadow .4s; } .page-section .posts .hentry:hover { padding: 1.62rem; z-index: 9; -webkit-box-shadow: 0 .38rem 1.62rem rgba(0,0,0, .2); box-shadow: 0 .38rem 1.62rem rgba(0,0,0, .2); } .page-section .posts .has-post-thumbnail { padding: 0; } .page-section .posts .has-post-thumbnail:hover { -webkit-transform: translateY( -1.62rem ); -ms-transform: translateY( -1.62rem ); transform: translateY( -1.62rem ); } .page-section .posts .entry-media + .entry-inner { max-height: 0; padding-left: 1.62rem; padding-right: 1.62rem; margin-top: 0; opacity: 0; overflow: hidden; -webkit-transition: all .4s; transition: all .4s; } .page-section .posts .hentry:hover .entry-media + .entry-inner { max-height: 400px; padding-left: 0; padding-right: 0; margin-top: 1.62rem; opacity: 1; } /* Page content after page section */ .page-section + .hentry { padding-top: 6%; border-top: 2px solid; } .page-section + .hentry .entry-media { margin-bottom: 6%; } /* Page section after page content */ .clear + .page-section, .hentry + .page-section, .sidebar + .page-section { margin-top: 6%; } /** * Posts parts (post table of contents) */ .post-table-of-contents { padding: 1.62em 0 0; margin: 1.62em 0; border-top: 2px solid; } .post-table-of-contents.top { float: left; max-width: 38%; padding: 0 1em 1em 0; margin: 0 1.62em 1em 0; border: 0; border-right: 2px solid; border-bottom: 2px solid; } .post-table-of-contents.bottom { clear: both; } .post-table-of-contents ol { margin: 0; list-style: none; } .post-table-of-contents li { padding: .19em 0; } .post-table-of-contents a { display: block; line-height: 1.38; } .post-table-of-contents a:before { content: '\f404'; margin-right: .38em; vertical-align: middle; } .post-table-of-contents .passed a:before { content: '\f418'; } .post-table-of-contents .current a, .post-table-of-contents .passed a { color: inherit; } .post-table-of-contents .current a:before { content: '\f403'; } /** * Posts list */ .posts { margin: 0 -1%; } .posts .hentry { float: left; position: relative; width: 31.333%; padding: 1.62rem; margin: 0 1% 2%; border: 2px solid; -webkit-transition: border-color .6s; transition: border-color .6s; } .posts .entry-title { margin-bottom: 1rem; letter-spacing: 0; } .posts .entry-inner { padding: 0; } .posts .entry-media + .entry-inner { margin-top: 1.62rem; } .posts .entry-inner p { margin-bottom: 1rem; } .link-more { margin-bottom: 1.62em; } /* Search list */ .posts .type-page .post-excerpt, .posts .type-nova_menu_item .post-excerpt { margin-bottom: 0; } .posts .type-page:before, .posts .type-nova_menu_item:before, .search-results .type-post:before { display: inline-block; width: 2rem; height: 2rem; margin-bottom: 1rem; line-height: 2rem; text-align: center; font-size: 1.38rem; border: 1px solid; border-radius: 50%; } .search-results .type-post:before { content: '\f411'; } .posts .type-page:before { content: '\f443'; } .posts .type-nova_menu_item:before { content: '\e603'; font-family: 'nova-font'; } /* Archives tax description */ .taxonomy-description { padding: 0 19%; margin-bottom: 3.62rem; text-align: center; } /** * Items list (Food Menu items) */ .items {} .items section { clear: both; width: 62%; padding-bottom: 1em; margin-left: 38%; margin-bottom: 3.62em; border-bottom: 2px solid; } .items section:last-child { padding-bottom: 0; margin-bottom: 1em; border: 0; } .menu-group-header { float: left; width: 50%; padding-top: 3.62rem; margin-top: -3.62rem; margin-left: -61.29%; } .menu-group-header:focus { outline: 0; } .items .hentry { float: left; width: 46%; margin: 0 6% 2% 0; } .items .hentry:nth-child(2n+1) { margin-right: 0; } .items .entry-media { margin-bottom: 1rem; } .home .items .entry-media { display: none; } .food-menu-item-header { margin-bottom: .38em; overflow: hidden; } .food-menu-item-header .entry-title, .single-nova_menu_item .food-menu-item-header { margin: 0; overflow: hidden; } .single-nova_menu_item .food-menu-item-header .entry-title { margin-bottom: 6%; } .food-menu-item-title { float: left; max-width: 80%; letter-spacing: 0; } .food-menu-item-price { float: right; margin-left: 1em; letter-spacing: 0; } /* Food menu groups (sections) navigation */ .menu-group-nav { list-style: none; padding: 3.62rem 0; margin: -3.62rem 0 0; text-align: center; outline: 0; } .menu-group-nav li { display: inline-block; margin-right: 1.62em; } .menu-group-nav a { display: inline-block; padding: .38em 1em; } .menu-group-nav-link { display: inline-block; padding: .62em 1em; margin-top: 1rem; text-transform: uppercase; border: 2px solid; } /** * Entry meta * * JetPack plugin support (@link http://jetpack.me/) * ZillaLikes plugin support (@link http://www.themezilla.com/plugins/zillalikes/) */ .entry-meta { padding: 1em 0 0; margin: 1.62em 0 0; border-top: 2px solid; } .posts .entry-meta { margin-top: 0; } .single .entry-meta { padding: 1em 0; margin-top: 0; border-bottom: 2px solid; } .single .entry-meta-top { margin-bottom: 1.62em; } .entry-meta a { color: inherit; } .entry-meta-element { margin-right: .38em; opacity: .5; } .single .entry-meta-element { margin-right: 1em; } .entry-date { cursor: help; } .entry-meta-element:before, .entry-meta .comments-link a:before, .entry-meta .entry-likes a:before { content: ''; position: relative; margin: -.09em .09em 0 0; font-size: 1.38em; vertical-align: middle; } .entry-meta .author:before { content: '\f304'; } .entry-meta .cat-links:before { content: '\f301'; } .entry-meta .comments-link a:before { content: '\f300'; } .entry-meta .entry-date:before { content: '\f303'; } .entry-meta .tags-links:before { content: '\f302'; } .entry-meta .entry-likes a:before { content: '\f461'; } .entry-meta .entry-edit:before { content: '\f411'; } .entry-meta .zilla-likes, .entry-meta .zilla-likes:hover, .entry-meta .zilla-likes.active { background: transparent; margin: 0 !important; padding-left: 0 !important; } .comments-link .comments-title { position: absolute; clip: rect(1px, 1px, 1px, 1px); } .entry-meta .tags-links a { margin: 0 .19em; text-transform: lowercase; } .entry-meta .tags-links a:before { content: '#'; } .entry-meta .entry-edit { font-variant: small-caps; } /* JetPack plugin support */ div.sharedaddy { padding: 1.62em 0; margin: 1.62em 0 0; border-top: 2px solid; } .site-content div.sharedaddy h3.sd-title:before { display: none; } .entry-content .sd-content ul { margin: 0 !important; } .site-content div.sharedaddy .sd-content ul li a.sd-button { margin: .19em .62em .19em 0; } .site-content div.sharedaddy .sd-content ul li a.sd-button:not(.no-text) { padding: .62em 1em; line-height: normal; border: 0; border-radius: 0; cursor: pointer; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: all .4s; transition: all .4s; } .site-content div.sharedaddy .sd-content ul li a.sd-button:not(.no-text):hover { opacity: .75; } /** * Previous/next post link */ .post-navigation { padding-top: 2px; margin: 0; border-bottom: 2px solid; } .post-navigation .nav-previous, .post-navigation .nav-next { position: relative; background-position: 50% 50%; background-size: cover; } .post-navigation .nav-next { text-align: right; } .post-navigation .has-post-thumbnail:before { content: ''; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: .85; z-index: 0; -webkit-transition: all .4s; transition: all .4s; } .post-navigation .has-post-thumbnail:hover:before { opacity: 1; } .post-navigation a { display: block; position: relative; padding: 10% 38% 4% 8%; margin-bottom: 2px; color: inherit; z-index: 1; } .post-navigation .nav-next a { padding-left: 38%; padding-right: 4%; } .post-navigation a:hover { text-decoration: none; } .post-navigation .meta-nav { display: block; margin-bottom: .62em; text-transform: uppercase; font-size: .5em; } .post-navigation .nav-next .meta-nav:after { content: '\f429'; margin-left: .62em; } .post-navigation .nav-previous .meta-nav:before { content: '\f430'; margin-right: .62em; } /** * Special pages */ /** * Error 404 page */ .error-404, .not-found { text-align: center; font-size: 1.62em; } .error-404 h1, .not-found h1 { padding-bottom: .62em; } .error-404 p, .not-found p, .error-404 a, .not-found a { color: inherit; } .error-404 form, .not-found form { display: inline-block; width: 62%; text-align: center; } /** * Page templates */ /** * Food menu page */ .page-template-page-template_menu-php .hentry + .page-section { margin-top: 0; } /** * Fullwidth page */ .is-singular .site-main > .attachment.hentry, .page-template-page-template_fullwidth-php .site-main > .hentry, .page-template-page-template_menu-php .site-main > .hentry { float: none; width: 100%; } .home.page-template-page-template_fullwidth-php .page .entry-title { text-align: center; } /** * 9. Comments */ .comments-area { position: relative; padding: 6% 0; margin: 0; } .comments-title .add-comment-link { float: right; } /** * Comments list */ .comment-list { padding: 0; margin: 0 0 1.62em; } .comments-closed + .comment-list { margin-top: 1.62em; } .comment-list > li, .comment-list .children > li { position: relative; min-height: 100px; padding: 1.62em 0 0 80px; margin: 0; background: none; overflow: hidden; } .comment-list .children { clear: both; margin: 0 0 0 -60px; } .comment-list .pingback { min-height: 0; padding: 20px 0; overflow: hidden; } .comment-body { padding: 1.62em; } /** * Author details */ .comment-meta { clear: both; padding-bottom: .62em; margin-bottom: 1em; border-bottom: 2px solid; overflow: hidden; } /* Avatar */ .comment-meta .avatar { position: absolute; left: 0; top: 1.62em; width: 90px; border-radius: 50%; } /* Name */ .comment-author { float: left; } .bypostauthor > .comment-body .comment-author:before { content: '\f304'; position: absolute; display: block; width: 30px; height: 30px; left: 30px; top: 75px; margin-top: 1.62em; line-height: 28px; text-align: center; font-size: 1.17em; border-radius: 50%; z-index: 1; } /* Metadata */ .comment-metadata, .pingback .edit-link { float: right; opacity: .6; } .comment-metadata .edit-link, .pingback .edit-link { padding-left: 1.62em; font-variant: small-caps; } /** * Comment content */ .comment-content a { -ms-word-wrap: break-word; word-wrap: break-word; } .comment-content p, .comment-content blockquote, .comment-content table { margin-bottom: 1em; } .comment-edit-link:before, .comment-reply-link:before { content: '\f467'; margin-right: .19em; font-size: 1.38em; vertical-align: middle; } .comment-edit-link:before { content: '\f411'; } /** * Comments pagination */ .comment-navigation { display: block; position: relative; clear: both; padding: 8% 0; overflow: hidden; } .comment-navigation .nav-previous { float: left; margin: 0; } .comment-navigation .nav-next { float: right; margin: 0; } .comment-navigation a { padding: .62em 1em; line-height: normal; cursor: pointer; -webkit-transition: all .4s; transition: all .4s; } .comment-navigation a:hover { text-decoration: none; opacity: .75; } /** * 10. Sidebar and widgets */ .sidebar { float: right; width: 38%; padding-left: 8%; } .toggle-mobile-sidebar { display: none; } /** * Front page widgets area */ .home .front-page-widgets-wrapper { padding: 3.62rem 0 0; border-bottom: 2px solid; } .home .front-page-widgets-container { padding: 0; } .front-page-widgets .widget-title { color: inherit; } .front-page-widgets .widget li, .front-page-widgets .widget table { border-color: inherit; } /** * Widgets */ /* widget forms */ .widget input, .widget select, .widget textarea { width: 100%; } /* widget lists */ .widget ul { margin: 0; list-style: none; } .widget ul li { padding: .38em 0; border-top: 1px solid #caccce; border-bottom: 1px solid #caccce; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .widget ul li + li { margin-top: -1px; } .widget ul li:hover { -webkit-transform: translateX( .62em ); -ms-transform: translateX( .62em ); transform: translateX( .62em ); } .widget ul li ul { position: relative; bottom: -.38em; margin: 0 0 -1px; } .widget ul li li { padding-left: 1em; } /* sidebar widgets */ .sidebar .widget { margin: 3.62rem 0 0; } .sidebar .toggle-mobile-sidebar + .widget, .sidebar .widget:first-child { margin: 0; } /** * Archives, Categories, Menu, Pages, Recent Comments, Recent Posts and ZillaLikes widget */ .widget_recent_comments ul li, .widget_recent_entries ul li, .widget_zilla_likes_widget ul li { position: relative; padding-left: 1.62em; } .widget_archive li:before, .widget_categories li:before, .widget_nav_menu li:before, .widget_pages li:before, .widget_recent_comments li:before { content: '\f307'; margin-right: .38em; vertical-align: middle; } .widget_categories li:before { content: '\f301'; } .widget_nav_menu li:before, .widget_pages li:before { content: '\f443'; } .widget_recent_comments li:before, .widget_recent_entries li:before, .widget_zilla_likes_widget li:before { content: '\f300'; position: absolute; left: 0; top: .38em; margin: 0; } .widget_recent_entries li:before { content: '\f411'; } .widget_zilla_likes_widget li:before { content: '\f461'; } .widget_recent_entries .post-date { display: block; } /** * Calendar */ .widget_calendar table { margin: 0; } .widget_calendar caption { padding-top: 0; } .widget_calendar tr th, .widget_calendar tr td { width: auto; height: 2.62em; padding: 0; text-align: center; } .widget_calendar tbody a { display: block; width: 100%; height: 100%; line-height: 2.62; } .widget_calendar tfoot a { color: inherit; } /** * Tag cloud widget */ .widget .tagcloud a { float: left; position: relative; display: inline-block; width: auto; padding: .19em .62em; margin: 2px 2px 0 0; white-space: nowrap; font-size: 1em !important; background-color: transparent; color: inherit; border: 1px solid; z-index: 0; -webkit-transition: all .3s; transition: all .3s; } .widget .tagcloud:hover a { opacity: .33; } .widget .tagcloud a:hover { text-decoration: none; z-index: 1; opacity: 1; } .widget .tagcloud a:before { content: attr(title); position: absolute; display: none; left: 100%; top: -1px; padding: .19em .62em; pointer-events: none; border: 1px solid; } .widget .tagcloud a:hover:before { display: block; } /** * 11. Site footer */ .site-footer, .front-page-widgets-wrapper { padding: 6% 0; } /** * Footer widgets */ .footer-widgets, .front-page-widgets-container { padding-bottom: 4%; margin: 0 -2%; } .footer-widgets .widget, .front-page-widgets-container .widget { float: left; width: 21%; margin: 0 2% 3.62rem; } .columns-1 .widget { float: none; width: 96%; } .columns-2 .widget { width: 46%; } .columns-3 .widget { width: 29.333%; } .footer-widgets .widget-title { color: inherit; } .footer-widgets .widget li, .footer-widgets .widget table { border-color: inherit; } /** * Site info (credits area) */ .site-info-container { overflow: hidden; } .site-info { float: left; } .site-info a { color: inherit; } /** * 100. Plugins integration */ /** * Beaver Builder */ .fl-builder.is-singular .site-content { width: 100%; max-width: 100%; padding: 0; } .fl-builder.is-singular .entry-header { display: none; } .fl-row-content { padding: 3% 0; } .fl-col-group { margin: 0 -1.62rem; } .fl-col-group .fl-col { padding: 1.62rem; } /** * Content max width is 1020px. It starts shrinking under 1260px screen width. * 1260 = 1020 / 88%_of_max_content_width / 92%_of_max_site_width */ @media only screen and (max-width: 1260px) { .fl-row-content { max-width: 88%; } } /* /(max-width: 1260px) */ /** * Breadcrumbs */ .breadcrumbs-container { padding: 1rem 0; border-bottom: 2px solid; } .breadcrumbs-title { margin-right: 1.62em; } .breadcrumbs .sep { margin: 0 .62em; opacity: .33; } /** * Jetpack */ /* Responsive videos */ .jetpack-video-wrapper { margin: 1.62em 0; } .entry-media .jetpack-video-wrapper { margin: 0; } /* Contact form */ .site .contact-form textarea, .site .contact-form input[type=email], .site .contact-form input[type=text] { width: 100%; max-width: 100%; } /* Infinite scroll */ .infinite-scroll.neverending .footer-area-footer-widgets { display: none; } /* Theme Footer (when set to scrolling) */ /* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before */ .infinity-end.neverending .footer-area-footer-widgets { display: block; } .infinite-scroll .posts.masonry { margin-bottom: 4.25rem; } #infinite-handle { clear: both; text-align: center; } .masonry #infinite-handle { position: absolute; width: 100%; bottom: -4.25rem; } .site #infinite-handle span { display: inline-block; padding: 1em; font-size: 1em; border-radius: 0; } .infinite-loader { clear: both; text-align: center; } .infinite-loader .spinner { left: auto !important; margin: 0 auto; } .infinite-loader .spinner > div > div { width: 1.62em !important; } .infinite-wrap { clear: both; } /* Related posts */ .site div#jp-relatedposts { padding-top: 1.62em; margin: 0 0 1.62em; border-top: 2px solid; } .site div#jp-relatedposts a:before { display: none; } .site div#jp-relatedposts h3.jp-relatedposts-headline { display: block; float: none; font-size: 1em; } .site div#jp-relatedposts h3.jp-relatedposts-headline em:before { display: none; } .site div#jp-relatedposts div.jp-relatedposts-items-visual { margin: 0; } .site div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post { width: 32%; padding: 0; margin: 0 0 0 2%; opacity: 1; } .site div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post:first-child { margin: 0; } .site div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post img { width: 100%; } .site div#jp-relatedposts div.jp-relatedposts-items-visual h4.jp-relatedposts-post-title { margin: .62em 0 .38em; font-size: 1em; } /* Videopress */ .video-player, .videopress-placeholder, .videopress-placeholder img { width: 100% !important; height: auto !important; } .video-player object { width: 100%; } .videopress-placeholder .play-button + div { display: none; } .is-singular .video-player { position: relative; height: 0 !important; padding: 0 0 56.25%; /* 16:9 ratio only */ } .is-singular .video-player object, .is-singular .video-placeholder { position: absolute; width: 100%; height: 100%; left: 0; top: 0; } /* Widgets */ .widget .widgets-list-layout li { margin-bottom: 0; } .widget .widgets-list-layout .widgets-list-layout-blavatar { width: 40px; margin-right: 1em; } .widget .widgets-list-layout-links { float: none; width: auto; } /** * 200. Responsive styles * * Responsive breakpoints set up according to http://www.browserstack.com/responsive */ /** * Not the Standard You're Looking For * * The viewport metatag was Apple's solution to the problem. It was adopted quickly * by other platforms, but it was never put forward by the W3C. Microsoft brought * this to light when they chose for IE10 to ignore the viewport metatag under certain * circumstances. Instead, they opted to use CSS Device Adaptation, which is what * the W3C are leaning on. * * @link http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/quick-tip-dont-forget-the-viewport-meta-tag/ */ @-webkit-viewport { width: device-width; } @-moz-viewport { width: device-width; } @-ms-viewport { width: device-width; } @-o-viewport { width: device-width; } @viewport { width: device-width; } /** * Responsive media */ img, embed, iframe, object, video { max-width: 100%; /*height: auto;*/ } embed, iframe, object, video { width: 100% !important; } /** * 1200px max */ @media only screen and (max-width: 1200px) { body { padding-left: 2%; padding-right: 2%; } /** * Site header */ /* Navigation */ .main-navigation li { margin-right: 1em; } /* Social links */ .social-links a { padding-left: .38em; } } /* /(max-width: 1200px) */ /** * 961px min */ @media only screen and (min-width: 961px) { /** * Site header */ @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d( 0, -100%, 0 ); transform: translate3d( 0, -100%, 0 ); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d( 0, -100%, 0 ); transform: translate3d( 0, -100%, 0 ); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translate3d( 0, 100%, 0 ); transform: translate3d( 0, 100%, 0 ); } 100% { opacity: 0; -webkit-transform: none; transform: none; } } @keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translate3d( 0, 100%, 0 ); transform: translate3d( 0, 100%, 0 ); } 100% { opacity: 0; -webkit-transform: none; transform: none; } } .sticky-header .site-header, .hide-sticky-header .site-header { position: fixed; width: 100%; left: 0; line-height: 3.62rem; -webkit-backface-visibility: hidden; /* Fixes Webkit element jumping when JS slider used on page */ } .admin-bar.sticky-header .site-header, .admin-bar.sticky-header .hide-site-header { top: 32px; } .sticky-header .site-header { top: 0; -webkit-animation: fadeInDown 1s; animation: fadeInDown 1s; } .hide-sticky-header .site-header { top: -3.62rem; -webkit-animation: fadeOutUp .4s; animation: fadeOutUp .4s; } .sticky-header .site { padding-top: 5rem; } } /* /(min-width: 961px) */ /** * 960px max */ @media only screen and (max-width: 960px) { body { -webkit-text-size-adjust: none; -ms-text-size-adjust: none; } /** * Site header */ .site-header { padding: 1.62rem 1rem 1.62rem 5.24rem; line-height: 2; } /* Navigation */ .main-navigation { position: absolute; width: 92%; width: calc(100% - 2rem); left: 1rem; top: 0; padding: 0; margin: 0; opacity: 1; z-index: 9; } .main-navigation-inner { display: none; position: relative; padding: 8em 4% 1em; } /* Navigation menu */ .main-navigation .menu { float: none; } .main-navigation li, .main-navigation li li, .main-navigation li li:first-child { float: none; display: block; margin: -1px 0 0; line-height: 1.62; white-space: normal; border-top: 1px solid #4a4c4e; border-bottom: 1px solid #4a4c4e; } .main-navigation ul a { opacity: 1; } .main-navigation li > a, .main-navigation li li > a { display: block; min-width: 0; padding: .62em; } .main-navigation li li > a { padding-left: 1.62em; } .main-navigation li li li > a { padding-left: 2.62em; } /* Submenu */ .main-navigation li .menu-item-has-children > a:after { display: none; } .main-navigation li ul, .main-navigation li li ul, .main-navigation li:hover > ul, .main-navigation li li:hover > ul { position: relative; visibility: visible; left: auto; top: auto; padding: 0; border-radius: 0; opacity: 1; -webkit-box-shadow: none; box-shadow: none; } .main-navigation li ul { margin-bottom: -1px; } /* Navigation search form */ .nav-search-form { float: none; position: absolute; width: 92%; height: 2.62em; left: 4%; top: 1em; } .search-toggle { display: none; } .nav-search-form .form-search, .nav-search-form.active .form-search, .no-js .nav-search-form:hover .form-search { position: relative; top: auto; right: auto; opacity: 1; z-index: 0; } .nav-search-form .search-field { font-size: 1em; } /* Mobile menu toggle */ .menu-toggle, .menu-toggle:hover, .menu-toggle:active, .menu-toggle:focus { display: block; position: absolute; width: 3.24rem; height: 3.24rem; padding: 0; line-height: 3.24rem; text-indent: -999em; font-size: 1.62rem; border: 0; opacity: 1; } .menu-toggle:before { content: '\f419'; position: absolute; width: 100%; height: 100%; left: 0; top: 0; text-align: center; text-indent: 0; } .active .menu-toggle:before { content: '\f406'; } /* Site banner */ .site-banner-header { bottom: 1rem; } .site-banner h1 { padding-right: 5rem; font-size: 2.38rem; } .site-banner .slick-prev, .site-banner .slick-next { width: 2em; height: 2em; bottom: 1rem; } .site-banner .slick-prev { right: 2.62em; } .slick-dots { display: none !important; } /** * Site content */ .is-singular .site-main > .hentry { float: none; width: 100%; } /* Page sections */ /* Posts list in page section */ .page-section .posts .hentry { -webkit-transition: none; transition: none; } .page-section .posts .hentry:hover { -webkit-box-shadow: none; box-shadow: none; } .page-section .posts .has-post-thumbnail { padding: 1.62rem; } .page-section .posts .has-post-thumbnail:hover { -webkit-transform: none; -ms-transform: none; transform: none; } .page-section .posts .entry-media + .entry-inner { max-height: 400px; padding-left: 0; padding-right: 0; margin-top: 1.62rem; opacity: 1; } /* Error 404 and not found */ .error-404 form, .not-found form { width: 86%; max-width: 86%; } /* Items list */ .items section { width: 100%; margin-left: 0; } .menu-group-header { float: none; width: 46%; margin-left: 0; margin-bottom: 2.62em; } /* Posts list */ .posts .hentry { width: 48%; } /* Content elements */ blockquote.alignleft, blockquote.alignright { padding: 0; } blockquote.alignleft { margin-left: 0; } blockquote.alignright { margin-right: 0; } blockquote.alignleft:before, blockquote.alignleft:after, blockquote.alignright:before, blockquote.alignright:after { display: none; } .gallery-columns-4 .gallery-item, .gallery-columns-5 .gallery-item, .gallery-columns-6 .gallery-item, .gallery-columns-7 .gallery-item, .gallery-columns-8 .gallery-item, .gallery-columns-9 .gallery-item { width: 31.333%; } /* Comments */ .comments-title .add-comment-link { float: none; display: block; margin: 1em 0; } /** * Sidebar and widgets */ .sidebar { float: none; width: 100%; margin: 1.62rem 0 0; padding: 1.62rem 0 0; border-top: 2px solid; } .toggle-mobile-sidebar { display: block; width: 100%; text-align: center; } /* Widgets */ .sidebar .widget, .sidebar .toggle-mobile-sidebar + .widget { margin-top: 2.62rem; display: none; } /** * Site footer */ /* Footer widgets */ .footer-widgets .widget { width: 46% !important; } .columns-1 .widget { width: 96% !important; } } /* /(max-width: 960px) */ /** * 680px max */ @media only screen and (max-width: 680px) { body { padding-left: 0; padding-right: 0; } /** * Site header */ /* Site branding */ .site-branding { float: none; display: block; } /* Social links */ .social-links, .site-header .social-links { float: none; clear: both; margin-top: 1em; } .site-header .social-links { margin-top: .38em; } .site-header .social-links li { float: none; display: inline; } .site-header .social-links a { padding: 0 .38em 0 0; } /* Site banner */ .site-banner h1 { font-size: 1.38rem; } /** * Site content */ /* Content columns */ .column { float: none; width: 100%; margin-bottom: 1.62em; } /* Items list */ .menu-group-header { width: 100%; } .items .hentry { float: none; width: 100%; margin: 0 0 2% 0; } /* Posts list */ .posts .hentry { float: none; width: 96%; margin-bottom: 8%; } /* Content elements */ .post-table-of-contents.top { display: none; } .gallery-columns-3 .gallery-item, .gallery-columns-4 .gallery-item, .gallery-columns-5 .gallery-item, .gallery-columns-6 .gallery-item, .gallery-columns-7 .gallery-item, .gallery-columns-8 .gallery-item, .gallery-columns-9 .gallery-item { width: 48%; } /* Comments */ .comment-list .children { margin-left: -40px; } .comment-list > li, .comment-list .children > li { padding-left: 50px; } .comment-meta .avatar { width: 60px; } .bypostauthor > .comment-body .comment-author:before { left: 15px; top: 45px; } .comment-navigation div { float: none; width: 100%; padding: 1em 0 0; text-align: center; } .comment-navigation a { display: block; } /** * Site footer */ /* Footer widgets */ .footer-widgets .widget, .front-page-widgets-container .widget { width: 96% !important; } /* Site info (credits area) */ .site-info { float: none; } /** * Jetpack */ .site div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post { width: 100%; margin: 1.62em 0 0 0; } } /* /(max-width: 680px) */ /** * 420px max */ @media only screen and (max-width: 420px) { /** * Pagination */ .pagination a, .pagination span { display: none; } .pagination .prev, .pagination .next { display: inline-block; opacity: 1; } /** * Site content */ /* Comments form */ .comment-form-author, .comment-form-email { float: none; width: 100%; margin-left: 0; } } /* /(max-width: 420px) */ /* End of file */