/* Theme Name: Apricot Blog Theme URI: http://ncrafts.net/ Description: Simple, elegant WordPress blogging theme. Author: Nishant Agrawal Author URI: https://twitter.com/nish_crafts Version: 1.1.5 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: pink, two-columns, responsive-layout, translation-ready, post-formats Text Domain: apricot Table of Contents for This CSS File 1. CSS Normalize 2. KeyFrame Animations 3. Basic Layout / Site Frame Styling 4. Article and Widget Styling 5. Footer Styling 6. Theme Multiple-Column Layout Styling 7. Comments Styling 8. Media Queries / Responsive Stuff 9. Header Position Layout Styling */ /* 1. CSS Normalize */ /*! 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:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-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 silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}img{max-width: 100%;} /* 2. KeyFrame Animations */ @-moz-keyframes social-show { 0% { -webkit-transform: translate3D(0,-20px,0) rotate(0); -moz-transform: translate3D(0,-20px,0) rotate(0); transform: translate3D(0,-20px,0) rotate(0); opacity: 0; } 100% { -webkit-transform: translate3D(0,0,0) rotate(0); -moz-transform: translate3D(0,0,0) rotate(0); transform: translate3D(0,0,0) rotate(0); opacity: 1; } } @-webkit-keyframes social-show { 0% { -webkit-transform: translate3D(0,-20px,0) rotate(0); -moz-transform: translate3D(0,-20px,0) rotate(0); transform: translate3D(0,-20px,0) rotate(0); opacity: 0; } 100% { -webkit-transform: translate3D(0,0,0) rotate(0); -moz-transform: translate3D(0,0,0) rotate(0); transform: translate3D(0,0,0) rotate(0); opacity: 1; } } @-o-keyframes social-show { 0% { -webkit-transform: translate3D(0,-20px,0) rotate(0); -moz-transform: translate3D(0,-20px,0) rotate(0); transform: translate3D(0,-20px,0) rotate(0); opacity: 0; } 100% { -webkit-transform: translate3D(0,0,0) rotate(0); -moz-transform: translate3D(0,0,0) rotate(0); transform: translate3D(0,0,0) rotate(0); opacity: 1; } } @-ms-keyframes social-show { 0% { -webkit-transform: translate3D(0,-20px,0) rotate(0); -moz-transform: translate3D(0,-20px,0) rotate(0); transform: translate3D(0,-20px,0) rotate(0); opacity: 0; } 100% { -webkit-transform: translate3D(0,0,0) rotate(0); -moz-transform: translate3D(0,0,0) rotate(0); transform: translate3D(0,0,0) rotate(0); opacity: 1; } } @keyframes social-show { 0% { -webkit-transform: translate3D(0,-20px,0) rotate(0); -moz-transform: translate3D(0,-20px,0) rotate(0); transform: translate3D(0,-20px,0) rotate(0); opacity: 0; } 100% { -webkit-transform: translate3D(0,0,0) rotate(0); -moz-transform: translate3D(0,0,0) rotate(0); transform: translate3D(0,0,0) rotate(0); opacity: 1; } } @-moz-keyframes h-show { 0% { -webkit-transform: translate3D(0,-20px,0); -moz-transform: translate3D(0,-20px,0); transform: translate3D(0,-20px,0); opacity: 0; } 100% { -webkit-transform: translate3D(0,0,0); -moz-transform: translate3D(0,0,0); transform: translate3D(0,0,0); opacity: 1; } } @-webkit-keyframes h-show { 0% { -webkit-transform: translate3D(0,-20px,0); -moz-transform: translate3D(0,-20px,0); transform: translate3D(0,-20px,0); opacity: 0; } 100% { -webkit-transform: translate3D(0,0,0); -moz-transform: translate3D(0,0,0); transform: translate3D(0,0,0); opacity: 1; } } @-o-keyframes h-show { 0% { -webkit-transform: translate3D(0,-20px,0); -moz-transform: translate3D(0,-20px,0); transform: translate3D(0,-20px,0); opacity: 0; } 100% { -webkit-transform: translate3D(0,0,0); -moz-transform: translate3D(0,0,0); transform: translate3D(0,0,0); opacity: 1; } } @-ms-keyframes h-show { 0% { -webkit-transform: translate3D(0,-20px,0); -moz-transform: translate3D(0,-20px,0); transform: translate3D(0,-20px,0); opacity: 0; } 100% { -webkit-transform: translate3D(0,0,0); -moz-transform: translate3D(0,0,0); transform: translate3D(0,0,0); opacity: 1; } } @keyframes h-show { 0% { -webkit-transform: translate3D(0,-20px,0); -moz-transform: translate3D(0,-20px,0); transform: translate3D(0,-20px,0); opacity: 0; } 100% { -webkit-transform: translate3D(0,0,0); -moz-transform: translate3D(0,0,0); transform: translate3D(0,0,0); opacity: 1; } } @-moz-keyframes search-show { 0% { -webkit-transform: scalex(.7) scaley(1); -moz-transform: scalex(.7) scaley(1); transform: scalex(.7) scaley(1); opacity: 0; } 100% { -webkit-transform: scalex(1) scaley(1); -moz-transform: scalex(1) scaley(1); transform: scalex(1) scaley(1); opacity: 1; } } @-webkit-keyframes search-show { 0% { -webkit-transform: scalex(.7) scaley(1); -moz-transform: scalex(.7) scaley(1); transform: scalex(.7) scaley(1); opacity: 0; } 100% { -webkit-transform: scalex(1) scaley(1); -moz-transform: scalex(1) scaley(1); transform: scalex(1) scaley(1); opacity: 1; } } @-o-keyframes search-show { 0% { -webkit-transform: scalex(.7) scaley(1); -moz-transform: scalex(.7) scaley(1); transform: scalex(.7) scaley(1); opacity: 0; } 100% { -webkit-transform: scalex(1) scaley(1); -moz-transform: scalex(1) scaley(1); transform: scalex(1) scaley(1); opacity: 1; } } @-ms-keyframes search-show { 0% { -webkit-transform: scalex(.7) scaley(1); -moz-transform: scalex(.7) scaley(1); transform: scalex(.7) scaley(1); opacity: 0; } 100% { -webkit-transform: scalex(1) scaley(1); -moz-transform: scalex(1) scaley(1); transform: scalex(1) scaley(1); opacity: 1; } } @keyframes search-show { 0% { -webkit-transform: scalex(.7) scaley(1); -moz-transform: scalex(.7) scaley(1); transform: scalex(.7) scaley(1); opacity: 0; } 100% { -webkit-transform: scalex(1) scaley(1); -moz-transform: scalex(1) scaley(1); transform: scalex(1) scaley(1); opacity: 1; } } @-moz-keyframes mobile-show { 0% { -webkit-transform: scalex(.5) scaley(.5); -moz-transform: scalex(.5) scaley(.5); transform: scalex(.5) scaley(.5); opacity: .5; } 100% { -webkit-transform: scalex(1) scaley(1); -moz-transform: scalex(1) scaley(1); transform: scalex(1) scaley(1); opacity: 1; } } @-webkit-keyframes mobile-show { 0% { -webkit-transform: scalex(.5) scaley(.5); -moz-transform: scalex(.5) scaley(.5); transform: scalex(.5) scaley(.5); opacity: .5; } 100% { -webkit-transform: scalex(1) scaley(1); -moz-transform: scalex(1) scaley(1); transform: scalex(1) scaley(1); opacity: 1; } } @-o-keyframes mobile-show { 0% { -webkit-transform: scalex(.5) scaley(.5); -moz-transform: scalex(.5) scaley(.5); transform: scalex(.5) scaley(.5); opacity: .5; } 100% { -webkit-transform: scalex(1) scaley(1); -moz-transform: scalex(1) scaley(1); transform: scalex(1) scaley(1); opacity: 1; } } @-ms-keyframes mobile-show { 0% { -webkit-transform: scalex(.5) scaley(.5); -moz-transform: scalex(.5) scaley(.5); transform: scalex(.5) scaley(.5); opacity: .5; } 100% { -webkit-transform: scalex(1) scaley(1); -moz-transform: scalex(1) scaley(1); transform: scalex(1) scaley(1); opacity: 1; } } @keyframes mobile-show { 0% { -webkit-transform: scalex(.5) scaley(.5); -moz-transform: scalex(.5) scaley(.5); transform: scalex(.5) scaley(.5); opacity: .5; } 100% { -webkit-transform: scalex(1) scaley(1); -moz-transform: scalex(1) scaley(1); transform: scalex(1) scaley(1); opacity: 1; } } @-moz-keyframes submenu-show { 0% { -webkit-transform: scale(1) translate3d(0,-5px,0); -moz-transform: scale(1) translate3d(0,-5px,0); transform: scale(1) translate3d(0,-5px,0); } 100% { -webkit-transform: scale(1) translate3d(0,0px,0); -moz-transform: scale(1) translate3d(0,0px,0); transform: scale(1) translate3d(0,0px,0); } } @-webkit-keyframes submenu-show { 0% { -webkit-transform: scale(1) translate3d(0,-5px,0); -moz-transform: scale(1) translate3d(0,-5px,0); transform: scale(1) translate3d(0,-5px,0); } 100% { -webkit-transform: scale(1) translate3d(0,0px,0); -moz-transform: scale(1) translate3d(0,0px,0); transform: scale(1) translate3d(0,0px,0); } } @-o-keyframes submenu-show { 0% { -webkit-transform: scale(1) translate3d(0,-5px,0); -moz-transform: scale(1) translate3d(0,-5px,0); transform: scale(1) translate3d(0,-5px,0); } 100% { -webkit-transform: scale(1) translate3d(0,0px,0); -moz-transform: scale(1) translate3d(0,0px,0); transform: scale(1) translate3d(0,0px,0); } } @-ms-keyframes submenu-show { 0% { -webkit-transform: scale(1) translate3d(0,-5px,0); -moz-transform: scale(1) translate3d(0,-5px,0); transform: scale(1) translate3d(0,-5px,0); } 100% { -webkit-transform: scale(1) translate3d(0,0px,0); -moz-transform: scale(1) translate3d(0,0px,0); transform: scale(1) translate3d(0,0px,0); } } @keyframes submenu-show { 0% { -webkit-transform: scale(1) translate3d(0,-5px,0); -moz-transform: scale(1) translate3d(0,-5px,0); transform: scale(1) translate3d(0,-5px,0); } 100% { -webkit-transform: scale(1) translate3d(0,0px,0); -moz-transform: scale(1) translate3d(0,0px,0); transform: scale(1) translate3d(0,0px,0); } } @-moz-keyframes submenu2-show { 0% { -webkit-transform: scale(1) translate3d(-5px,0px,0); -moz-transform: scale(1) translate3d(-5px,0px,0); transform: scale(1) translate3d(-5px,0px,0); } 100% { -webkit-transform: scale(1) translate3d(0,0px,0); -moz-transform: scale(1) translate3d(0,0px,0); transform: scale(1) translate3d(0,0px,0); } } @-webkit-keyframes submenu2-show { 0% { -webkit-transform: scale(1) translate3d(-5px,0px,0); -moz-transform: scale(1) translate3d(-5px,0px,0); transform: scale(1) translate3d(-5px,0px,0); } 100% { -webkit-transform: scale(1) translate3d(0,0px,0); -moz-transform: scale(1) translate3d(0,0px,0); transform: scale(1) translate3d(0,0px,0); } } @-o-keyframes submenu2-show { 0% { -webkit-transform: scale(1) translate3d(-5px,0px,0); -moz-transform: scale(1) translate3d(-5px,0px,0); transform: scale(1) translate3d(-5px,0px,0); } 100% { -webkit-transform: scale(1) translate3d(0,0px,0); -moz-transform: scale(1) translate3d(0,0px,0); transform: scale(1) translate3d(0,0px,0); } } @-ms-keyframes submenu2-show { 0% { -webkit-transform: scale(1) translate3d(-5px,0px,0); -moz-transform: scale(1) translate3d(-5px,0px,0); transform: scale(1) translate3d(-5px,0px,0); } 100% { -webkit-transform: scale(1) translate3d(0,0px,0); -moz-transform: scale(1) translate3d(0,0px,0); transform: scale(1) translate3d(0,0px,0); } } @keyframes submenu2-show { 0% { -webkit-transform: scale(1) translate3d(-5px,0px,0); -moz-transform: scale(1) translate3d(-5px,0px,0); transform: scale(1) translate3d(-5px,0px,0); } 100% { -webkit-transform: scale(1) translate3d(0,0px,0); -moz-transform: scale(1) translate3d(0,0px,0); transform: scale(1) translate3d(0,0px,0); } } /* 3. Basic Layout / Site Frame Styling */ h1,h2,h3,h4,h5,h6,p { } h1,h2,h3,h4 { color: #555; } p { font-size: 1em; } html { background: white; } body { margin: 0; font-family: Georgia, serif; font-size: 1em; color: #444; } #container { display: block; margin: 0 auto; background: #f7f7f7; } #content, #header, #footer, #header > div, #footer > div, .copyrights > div, #social-footer > div { width: 100%; max-width: 1024px; margin: 0 auto; position: relative; } #content { margin-bottom: 48px; } #header > div { height: 100%; position: static; } #header { text-align: center; max-width: none; position: relative; background: #fff; box-shadow: 0px 0px 3px #aaa; z-index: 999; } body #header .small-logo { display: none; -webkit-animation: h-show .7s cubic-bezier(.6,.4,0,1); -moz-animation: h-show .7s cubic-bezier(.6,.4,0,1); animation: h-show .7s cubic-bezier(.6,.4,0,1); left: 24px; font-weight: bold; letter-spacing: -1px; font-size: 1.2em; line-height: 45px; position: absolute; } #content { padding-top: 48px; min-height: 500px; } #header:after { position: absolute; left: 0px; bottom: -9px; top: 0; background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,0))); width: 35%; } #header:before { position: absolute; right: 0px; bottom: -9px; top: 0; background: -webkit-gradient(linear, left top, right top, color-stop(100%,rgba(255,255,255,1)), color-stop(0,rgba(255,255,255,0))); width: 35%; } #header .search-form-cover { position: absolute; bottom: 0px; line-height: 45px; right: 0px; height: 45px; z-index: 999; } #header .search-form-cover input { background-color: white; } #header .search-form-cover > span { cursor: pointer; display: block; padding: 0 18px; position: absolute; right: 0px; z-index: 101; font-size: .9em; transition: right .35s cubic-bezier(.6,.4,0,1.05); -webkit-transition: right .35s cubic-bezier(.6,.4,0,1.05); } #header .social-links { position: absolute; right: 18px; top: 0px; padding-top: 9px; font-size: 1.1em; } #header .social-links a { padding: 2px 0; } #header .social-links a:hover { opacity: 1; } #header.show-search .search-form-cover > span { right: 145px; } #header .search-form-cover form button { display: none; } #header .search-form-cover form { display: none; position: absolute; right: 0; top: 0; transform-origin: 100% 0%; -webkit-transform-origin: 100% 0%; -webkit-animation: search-show .35s cubic-bezier(.6,.4,0,1.2); -moz-animation: search-show .35s cubic-bezier(.6,.4,0,1.2); animation: search-show .35s cubic-bezier(.6,.4,0,1.2); } #header .search-form-cover form input { padding: 5px 10px; padding-left: 28px; border-radius: 20px; border: 1px solid #aaa; outline: none; width: 190px; font-size: .95em; } #header.show-search .search-form-cover form { display: block; } #header h1 { font-weight: 600; font-size: 42px; padding-top: 36px; padding-bottom: 18px; margin: 0; } .header-layout-left #header h1 { margin-bottom: 24px; } #header h1, #header .small-logo { letter-spacing: -1px; font-weight: bold; -webkit-font-smoothing: antialiased; } #header #site_logo { max-height: 47px; width: auto; } #header p { margin: 0; margin-bottom: 18px; position: relative; display: none; } a { color: inherit; text-decoration: none; } #top-nav { display: block; margin: 0 auto; padding: 0; position: relative; z-index: 999; max-width: 900px; } #top-nav li a { display: block; background-color: white; padding: 15px; line-height: 100%; font-size: 14px; color: #666; font-weight: 600; text-transform: uppercase; letter-spacing: .6px; } #top-nav li { list-style: none; display: inline-block; padding: 0; position: relative; margin: 0; } #top-nav li .sub-menu { display: none; position: absolute; width: auto; background: #eee; white-space: nowrap; text-align: left; transform-origin: 50% 0%; -webkit-transform-origin: 50% 0%; -webkit-animation: submenu-show .1s linear; -moz-animation: submenu-show .1s linear; animation: submenu-show .1s linear; } #top-nav li .sub-menu .sub-menu { transform-origin: 0% 0%; -webkit-transform-origin: 0% 0%; -webkit-animation: submenu2-show .1s linear; -moz-animation: submenu2-show .1s linear; animation: submenu2-show .1s linear; } #top-nav li .sub-menu li { display: block; } body #top-nav .sub-menu li > a { transition: padding .15s ease; -webkit-transition: padding .15s ease; -moz-transition: padding .15s ease; position: relative; } #top-nav li .sub-menu li a { padding: 7px 15px; font-size: .8em; } .header-layout-top #top-nav > li { z-index: 102; position: relative; } .header-layout-top #top-nav > li:hover { z-index: 101; position: relative; } .header-layout-top #top-nav .sub-menu > li { z-index: 102; position: relative; } .header-layout-top #top-nav .sub-menu > li:hover { z-index: 101; position: relative; } #top-nav > li.menu-item-has-children:hover { box-shadow: 0px 1px 3px #888; } #top-nav li.menu-item-has-children:hover a { background: white; z-index: 102; position: relative; } #top-nav li:hover .sub-menu { display: block; margin: 0; padding: 0; left: 0; z-index: 101; background: white; box-shadow: 0px 1px 2px #999; -webkit-box-shadow: 0px 1px 2px #999; } /* 4. Article and Widget Styling */ .page-links { display: block; text-align: right; margin-bottom: 10px; font-size: 13px; letter-spacing: .4px; text-transform: uppercase; font-weight: 600; color: #999; } .page-links a { } .widget_search .search-submit { display: none; } .widget_search .search-field { box-shadow: none; border-radius: 100px; outline: none; border: 1px solid #aaa; padding: 5px 10px; font-size: .95em; width: 100%; box-sizing: border-box; -moz-box-sizing: border-box; } .single .entry-time { color: #999; text-transform: uppercase; font-size: 14px; text-align: center; letter-spacing: 1px; font-weight: 600; display: inline; } .header-cover { margin: 10px; position: relative; } .featured-post { display: inline-block; position: relative; } #content .featured-post .bubble-date, #content .featured-post .comments-nos-cover { background: url("assets/image-background.png") repeat scroll 0 0 / 12px 12px rgba(0, 0, 0, 0.3); } .featured-post .article-content { display: none; } #content .featured-post .comments-nos-cover { right: 0; left: auto; } .featured-0 { width: 66.7%; display: block; } #content .featured-cover article.card { padding: 10px; } #content .featured-cover .featured-1 article.card, #content .featured-cover .featured-2 article.card { padding-left: 0; } #content .featured-cover .featured-1 article.card { padding-bottom: 5px; } #content .featured-cover .featured-2 article.card { padding-top: 5px; } .featured-1,.featured-2 { width: 33.3%; position: absolute; top: 0; right: 0px; height: 50%; } .featured-2 { top: 50%; bottom: 0px; } .featured-post article, .featured-post .header-cover { max-height: 100%; height: 100%; } #content .featured-post .entry-time, #content .featured-post .entry-author { display: inline-block; color: white; margin: 0; text-shadow: 1px 1px 3px #444; text-transform: uppercase; font-size: inherit; } #content .featured-post .format-quote .entry-time, #content .featured-post .format-quote .entry-author { display: none; } #content .featured-post .article-info { font-size: 12px; } #content .featured-post.featured-0 .article-info { font-size: 12px; } #content .featured-post .category-link a:hover, #content .featured-post .entry-author a:hover { color: #fff; text-decoration: underline; } .bg-layer { position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 102; } .featured-post .article-info { position: absolute; white-space: nowrap; bottom: 0; left: 0; right: 0; padding: 15px; padding-bottom: 10px; z-index: 104; } .featured-post .format-quote .post-title { display: none; } #content .featured-post .post-title { color: white; font-size: 1.3em; text-align: left; margin: 0; text-shadow: 1px 1px 3px #444; position: absolute; left: 0px; padding: 10px 15px; padding-bottom: 32px; bottom: 0; right: 0; z-index: 103; background: url("assets/image-background.png") repeat scroll 0 0 / 12px 12px rgba(0, 0, 0, 0.2); } #content .featured-post.featured-0 .post-title { font-size: 2.4em; } .featured-post .post-title a:hover { color: #fff; } .featured-post article .header-cover { display: block; width: 100%; overflow: hidden; margin: 0; max-height: 100%; } .featured-post article.format-quote.no-content .header-cover { position: relative; width: auto; } .featured-post article .bubble-date { font-size: 14px; top: 0; color: rgba(255,255,255,.9); bottom: auto; } #content .featured-post article .comments-nos-cover { font-size: 14px; top: 0; bottom: auto; color: rgba(255,255,255,.9); z-index: 103; } #content .featured-post.featured-0 article .comments-nos-cover { font-size: 1.7em; background: none; } .featured-post img { transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); transition: transform 10s linear; -webkit-transition: -webkit-transform 10s linear; -moz-transition: -moz-transform 10s linear; } .featured-post:hover img { transform: scale(1.15); -webkit-transform: scale(1.15); -moz-transform: scale(1.15); } .featured-post article.format-quote.no-content .header-cover img { width: 115%; height: auto; } #content .featured-post article.format-quote.no-content .header-cover .embed-quote { font-size: 1.2em; } .featured-cover { margin-bottom: 48px; } .featured-cover > div { position: relative; } .featured-cover article.card { box-shadow: none; margin: 0; } .featured-post article .header-cover img { height: auto; width: 100%; max-width: none; } .featured-post article { position: relative; } article.list .header-cover { color: #888; left: 0; padding: 0; min-height: 22px; font-weight: 600; overflow: hidden; } article.list.has-post-thumbnail .header-cover { color: rgba(255,255,255,1); font-weight: 600; font-size: 14px; letter-spacing: 1px; border-bottom: 0px; padding: 0; min-height: none; } article.list footer { color: #999; text-align: center; font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: 2px; } .bubble-date { position: absolute; bottom: 0; right: 0; z-index: 101; text-align: center; overflow: hidden; text-transform: uppercase; padding: 1px 6px; z-index: 103; } article.list.has-post-thumbnail .bubble-date { background-color: rgba(50,50,50,.3); } article.list.has-post-thumbnail.format-quote .bubble-date { background: none; font-size: 13px; } article.list.has-post-thumbnail.has-gallery .bubble-date, article.list.has-post-thumbnail.has-gallery .comments-nos-cover { background-color: inherit; } #container article.list.format-video .bubble-date, #container article.list.format-video .comments-nos-cover, #container article.list.format-audio .bubble-date, #container article.list.format-audio .comments-nos-cover { background-color: inherit; } article.list.format-video .header-cover, article.list.format-audio .header-cover { padding-bottom: 20px; color: #888; } article.list.has-post-thumbnail .comments-nos-cover { background-color: rgba(50,50,50,.3); } article.list .comments-nos-cover { position: absolute; bottom: 0px; left: 0; padding: 1px 6px; } article.list .comments-nos-cover span { z-index: 102; } article.list .comments-nos-cover .icon-comment-empty { vertical-align: top; font-weight: bold; position: relative; z-index: 101; } article.list footer div { display: inline-block; } article.list .author { color: #999; text-transform: uppercase; font-size: 13px; text-align: center; letter-spacing: 1px; margin-bottom: 24px; font-weight: 600; display: block; } .sticky-pin { display: none; } .home article.sticky { position: relative; } .home .sticky .sticky-pin { position: absolute; top: -4px; display: block; z-index: 101; color: white; right: -28px; padding: 7px; transform: rotate(45deg); -webkit-transform: rotate(45deg); background-color: rgba(0,0,0,.3); width: 80px; text-align: center; } blockquote { border-left: 4px solid #aaa; color: #888; margin-left: 0; padding-left: .8em; font-style: italic; } article .article-content table { margin: .5em 0; } article .article-content table td, article .article-content table th { border: 1px solid #ddd; padding: .7em .8em; } article hr { border-top: 1px solid #bbb; border-bottom: 0px; } #archive-head { padding: 24px; position: relative; } #archive-head .author-left { position: absolute; left: 0px; padding-left: 24px; } #archive-head .author-left .circle-author { overflow: hidden; } #archive-head .author-left img { width: 92px; background-color: #eee; height: 92px; border-radius: 100px; } #archive-head .author-right { position: relative; padding-left: 116px; min-height: 80px; text-align: left; display: block; } .widget .widget-easy-twitter-feed-widget-container .row { margin-left: 0; margin-right: 0; } .widget .widget-easy-twitter-feed-widget-row { margin-top: -12px; } #archive-head .label-right { position: absolute; top: 13px; right: -25px; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); background-color: #555; color: white; letter-spacing: .6px; text-transform: uppercase; font-weight: bold; font-size: 12px; width: 104px; display: block; height: 28px; line-height: 28px; text-align: center; } #archive-head .author-right .entry-author { font-weight: 600; font-size: 1.1em; } .about-page img.alignleft { border-radius: 4px; box-shadow: 1px 1px 1px #666; margin-right: 15px; } .about-page .portfolio .small-4 { text-align: justify; } blockquote.alignleft, .wp-caption.alignleft, img.alignleft { margin: 0.4em 1.6em 1.6em 0; } .wp-caption-text{} .sticky{} .bypostauthor{} .alignleft { display: inline; float: left; } .alignright { display: inline; float: right; } .aligncenter { display: block; margin-right: auto; margin-left: auto; } .single .apricot_gallery .gallery-item { margin: 0; position: relative; } .tiled-gallery img { cursor: pointer; } article .tiled-gallery { margin-bottom: 0px; } .category-link { display: block; margin-top: 18px; margin-bottom: 5px; } .home .category-link, .archive .category-link, .search .category-link { margin-top: 0px; } .single .tags-single { float: left; text-transform: uppercase; font-size: 13px; letter-spacing: -4px; } .single .tags-single > span { letter-spacing: .6px; color: #999; margin-right: 1px; padding: 2px 7px 2px 7px; font-weight: 600; display: inline-block; } .single .tags-single > span:first-child { padding-left: 0; } .category-link a { text-transform: uppercase; font-size: 14px; font-weight: 600; letter-spacing: .6px; text-align: center; } .apricot_gallery .gallery-caption { bottom: 0px; left: 0; right: 0; line-height: 30px; background-color: rgba(100,100,100,.6); color: white; text-align: center; } .gallery .slider-arrow { position: absolute; top: 50%; margin-top: -21px; z-index: 101; color: #fff; font-size: 28px; text-align: center; cursor: pointer; } article.list .slider-arrow { font-size: 21px; margin-top: -15px; } .apricot_gallery .slick-dots { position: absolute; bottom: 0px; padding-left: 0; text-align: center; width: 100%; transform: translate3d(0,70px,0) rotate(15deg); transition: transform .5s ease; -webkit-transform: translate3d(0,70px,0) rotate(15deg); transition: -webkit-transform .5s ease; } .gallery .arrow-left { left: 10px; right: auto; } .gallery .arrow-right { right: 10px; left: auto; } .apricot_gallery .gallery { display: block; } .apricot_gallery .gallery { overflow: hidden; } .apricot_gallery .gallery:hover .slick-dots { transform: translate3d(0,0,0) rotate(0deg); -webkit-transform: translate3d(0,0,0) rotate(0deg); } .apricot_gallery .slick-dots li { display: inline-block; list-style-type: none; margin-left: 4px; margin-right: 4px; } .apricot_gallery .slick-dots li button { color: #555; background-color: white; box-shadow: none; border-radius: 50px; font-size: 12px; border: 0px; outline: none; padding: 0px 6px; box-shadow: 0px 1px 1px #777; font-weight: bold; transform: scale(1); transition: transform .2s ease; -webkit-transform: scale(1); transition: -webkit-transform .2s ease; } .apricot_gallery .slick-dots li.slick-active button { transform: scale(1.2); -webkit-transform: scale(1.2); } .single article footer { border-top: 1px solid #e5e5e5; font-size: .95em; } .single .author-left { text-align: center; position: absolute; left: 36px; top: 36px; width: 64px; } .single .author-left img { border-radius: 100px; width: 64px; background-color: #eee; height: 64px; } .single .author-right { position: relative; margin-left: 88px; min-height: 64px; display: block; } .single .related-links { border-top: 1px solid #e5e5e5; padding: 0px 36px; color: #999; } .single .related-links a { padding: 24px 0; display: inline-block; } .author-right .social-links { font-size: 105%; color: #999; } .author-right .social-links [class^="icon-"]:before, .author-right .social-links [class*=" icon-"]:before { margin-left: 0; margin-top: 5px; width: auto; padding: 4px 6px 4px 0; } .single .author-right .author { font-weight: 600; font-size: 1.1em; margin-bottom: 5px; } .single .article-content p, .page .article-content p { margin: 15px 0; font-size: 1.05em; } .article-content h2,h3,h4 { margin-bottom: 0; margin-top: 1.6em; } .single .footer { color: #999; position: relative; } .single #content article footer { padding: 36px 36px; } .single #content .content-cover, .page #content .content-cover { padding: 18px 36px; } .single #content .content-cover .post-title, .page #content .content-cover .post-title { font-size: 2em; margin-top: 18px; margin-bottom: 36px; } .single #content .content-cover .post-title { margin-top: 12px; } .single #content .content-cover iframe, .single #content .content-cover img { max-width: 100%; } #wp-calendar { width: 100%; } #wp-calendar caption { font-weight: bold; margin-bottom: 5px; } .widgettitle { font-size: 1em; font-weight: 600; margin-top: 0; line-height: 110%; } .site_author .social-links { text-align: center; color: #999; font-size: 1.15em; border-top: 1px solid #eee; } .site_author .social-links a { display: inline-block; padding: 4px 4px; border-right: 1px solid #eee; } .site_author .social-links a:last-child { border-right: 0px; } .site_author_content { font-size: .9em; } .site_author_bio { padding: 15px 18px; } .site_author_image { text-align: center; width: 100%; margin: 0 auto; margin-bottom: 0px; background-color: #FEFEF5; position: relative; z-index: 101; box-shadow: 0px -2px 1px -1px #ddd inset; } .site_author_image.red { background: rgb(255,246,246); /* Old browsers */ background: -moz-radial-gradient(center, ellipse cover, rgba(255,246,246,1) 0%, rgba(255,237,237,1) 100%); /* FF3.6+ */ background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(255,246,246,1)), color-stop(100%,rgba(255,237,237,1))); /* Chrome,Safari4+ */ background: -webkit-radial-gradient(center, ellipse cover, rgba(255,246,246,1) 0%,rgba(255,237,237,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-radial-gradient(center, ellipse cover, rgba(255,246,246,1) 0%,rgba(255,237,237,1) 100%); /* Opera 12+ */ background: -ms-radial-gradient(center, ellipse cover, rgba(255,246,246,1) 0%,rgba(255,237,237,1) 100%); /* IE10+ */ background: radial-gradient(ellipse at center, rgba(255,246,246,1) 0%,rgba(255,237,237,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff6f6', endColorstr='#ffeded',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ } .site_author_image.aliceblue { background: rgb(248,252,255); background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNmOGZjZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZGRlY2Y5IiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-radial-gradient(center, ellipse cover, rgba(248,252,255,1) 0%, rgba(225,241,249,1) 100%); background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(248,252,255,1)), color-stop(100%,rgba(225,241,249,1))); background: -webkit-radial-gradient(center, ellipse cover, rgba(248,252,255,1) 0%,rgba(225,241,249,1) 100%); background: -o-radial-gradient(center, ellipse cover, rgba(248,252,255,1) 0%,rgba(225,241,249,1) 100%); background: -ms-radial-gradient(center, ellipse cover, rgba(248,252,255,1) 0%,rgba(225,241,249,1) 100%); background: radial-gradient(ellipse at center, rgba(248,252,255,1) 0%,rgba(225,241,249,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8fcff', endColorstr='#ddecf9',GradientType=1 ); } .site_author_image.lime { background: rgb(235,251,231); background: -moz-radial-gradient(center, ellipse cover, rgba(235,251,231,1) 0%, rgba(225,249,218,1) 100%); background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(235,251,231,1)), color-stop(100%,rgba(225,249,218,1))); background: -webkit-radial-gradient(center, ellipse cover, rgba(235,251,231,1) 0%,rgba(225,249,218,1) 100%); background: -o-radial-gradient(center, ellipse cover, rgba(235,251,231,1) 0%,rgba(225,249,218,1) 100%); background: -ms-radial-gradient(center, ellipse cover, rgba(235,251,231,1) 0%,rgba(225,249,218,1) 100%); background: radial-gradient(ellipse at center, rgba(235,251,231,1) 0%,rgba(225,249,218,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebfbe7', endColorstr='#e1f9da',GradientType=1 ); } .site_author_image.beige { background: rgb(246,246,234); background: -moz-radial-gradient(center, ellipse cover, rgba(246,246,234,1) 0%, rgba(247,247,220,1) 100%); background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(246,246,234,1)), color-stop(100%,rgba(247,247,220,1))); background: -webkit-radial-gradient(center, ellipse cover, rgba(246,246,234,1) 0%,rgba(247,247,220,1) 100%); background: -o-radial-gradient(center, ellipse cover, rgba(246,246,234,1) 0%,rgba(247,247,220,1) 100%); background: -ms-radial-gradient(center, ellipse cover, rgba(246,246,234,1) 0%,rgba(247,247,220,1) 100%); background: radial-gradient(ellipse at center, rgba(246,246,234,1) 0%,rgba(247,247,220,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6ea', endColorstr='#f7f7dc',GradientType=1 ); } .site_author_content { position: relative; } .site_author_image img { max-width: 75%; height: auto; display: block; margin: 0 auto; } .site_author_name { letter-spacing: 1px; font-weight: 600; font-size: 14px; text-transform: uppercase; color: #999; padding: 18px 0 0 0; display: block; } .site_author_tag { letter-spacing: 1px; margin-bottom: 18px; font-weight: 600; font-size: 12px; text-transform: uppercase; color: #999; } .not-found { text-align: center; } .not-found-404 { font-size: 125%; padding-top: 54px; } .not-found-404 h2 { margin-top: 24px; } #archive-head h2 span { display: block; margin-bottom: 9px; color: #666; text-transform: uppercase; letter-spacing: .6px; font-weight: 600; font-size: 15px; } .not-found-404 { color: #888; } .not-found .icon-emo-unhappy { font-size: 2em; } #archive-head { text-align: center; font-weight: normal; } #archive-head.card { margin-bottom: 48px; } #archive-head p { font-size: 1.1em; color: #555; } #archive-head h2 { font-size: 1.5em; margin: 0 auto; padding: 0; } .post-title { text-align: center; font-size: 1.8em; margin-bottom: 10px; margin-top: 6px; } .home article .post-title { margin-top: 0; } .post-title a:hover { color: #222; } .widget > ul > li { list-style-type: none; } .widget_subtitle { margin: 0 auto; margin-bottom: 18px; font-size: 90%; color: #666; text-align: left; display: block; } .widgettitle { padding-bottom: 5px; margin-bottom: 18px; border-bottom: 1px solid #aaa; } .apricot_recent_posts .widgettitle > span { margin-right: 14px; margin-left: -1px; opacity: .6; cursor: pointer; } .apricot_recent_posts .widgettitle > span.active { opacity: 1; } .apricot_recent_posts_list { display: none; padding-left: 0; margin-bottom: 0; margin-top: 0; } .apricot_recent_posts_list.active { display: block; } .apricot_recent_posts li a > span .post-date { font-size: .85em; padding-top: 2px; text-align: center; } .pagination.navigation { text-align: center; margin-bottom: 48px; } .pagination .nav-links { border-radius: 2px; background: white; display: inline-block; margin: 0 auto; box-shadow: 0px 1px 2px #aaa; letter-spacing: -4px; overflow: hidden; white-space: nowrap; } .pagination .nav-links span, .pagination .nav-links a { padding: 8px 16px; letter-spacing: 0px; display: inline-block; text-align: center; color: #888; border-left: 1px solid #e5e5e5; } .pagination .nav-links span:first-child, .pagination .nav-links a:first-child { border-left: 0px; } .pagination .nav-links span { color: #333; } .pagination .nav-links a:hover { background: #f7f7f7; } article { margin-bottom: 48px; } #sidebar1 .widget { margin-bottom: 48px; } #sidebar1 .tagcloud { letter-spacing: -4px; line-height: 20px; } #sidebar1 .tagcloud > a { letter-spacing: 0px; color: white; margin: 0; margin-right: 1px; margin-bottom: 1px; display: inline-block; font-size: 12px !important; text-transform: uppercase; padding: 4px 10px; font-weight: 600; letter-spacing: .6px; background: lightcoral; position: relative; } #sidebar1 .widget > ul, #sidebar2 .widget > ul { padding: 0; } #sidebar1 .widget_categories li { list-style-type: none; } .apricot_recent_posts, .apricot_recent_comments { margin: 0; padding: 0; } ul.apricot_recent_comments { margin-top: 18px; } ul.apricot_recent_comments li { padding: 18px 0; position: relative; } ul.apricot_recent_comments li img { position: absolute; left: 0; width: 38px; height: 38px; top: 18px; background-color: #ddd; border-radius: 100px; } ul.apricot_recent_comments li:nth-child(odd) img { left: auto; right: 0; } ul.apricot_recent_comments li > span { margin-left: 50px; display: block; position: relative; background: white; border-radius: 2px; padding: 5px 9px 7px 9px; line-height: 125%; font-size: .9em; margin-right: 2px; color: #999; box-shadow: 0px 1px 2px #aaa; } ul.apricot_recent_comments li > span a { color: #555; } ul.apricot_recent_comments li:nth-child(odd) > span { margin-left: 2px; margin-right: 50px; box-shadow: 0px 1px 2px #aaa; } ul.apricot_recent_comments li > span:before { width: 0; height: 0; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-right:6px solid #ccc; position: absolute; left: -7px; top: 14px; content: ''; } ul.apricot_recent_comments li > span:after { width: 0; height: 0; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-right:6px solid #fff; position: absolute; left: -6px; top: 14px; content: ''; } ul.apricot_recent_comments li:nth-child(odd) > span:before { left: auto; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-right: 0px solid transparent; border-left: 6px solid #ccc; right: -7px; } ul.apricot_recent_comments li:nth-child(odd) > span:after { left: auto; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-right: 0px solid transparent; border-left: 6px solid #fff; right: -6px; } ul.apricot_recent_posts { margin-top: 4px; } .apricot_recent_posts li { list-style-type: none; margin-bottom: 18px; } .apricot_recent_posts li:last-child { margin-bottom: 0; } .apricot_recent_posts li span.img { width: 30%; max-width: 62px; display: inline-block; vertical-align: top; overflow: hidden; background: #d6d7d8; height: 62px; } .apricot_recent_posts li a { display: block; } .apricot_recent_posts li a > span { display: inline-block; } .apricot_recent_posts li a > span.text { float: right; width: 70%; padding-left: 8px; } .apricot_recent_posts li a > span .post-head { display: block; line-height: 120%; font-size: .95em; text-align: left; margin-bottom: 3px; } .apricot_recent_posts li a > span .post-date, .widget li .post-date { display: block; font-size: .85em; color: #666; text-align: left; } .contact-form-cover { position: relative; } .email-sign { font-size: 140px; position: absolute; z-index: -1; right: 0; opacity: .8; font-family: Arial; } div.embed iframe { width: 100%; min-height: 420px; } article.list div.embed iframe { height: 280px; min-height: 280px; } div.embed-audio iframe { width: 100%; height: 240px; } body #content .embed-quote { position: absolute; top: 18%; left: 10%; width: 85%; color: white; font-size: 28px; margin: 0; font-weight: 300; padding: 5%; line-height: 140%; } body.column-layout-two #content .embed-quote { font-size: 16px; } body.single #container .embed-quote { font-size: 24px; left: 13%; line-height: 150%; top: 22%; } .embed-quote-quote { position: absolute; top: 0%; line-height: 90px; opacity: .5; font-size: 100px; font-family: 'Georgia', Arial; left: 5px; } .column-layout-one .embed-quote-quote { font-size: 250px; line-height: 250px; } .single .embed-quote-quote { font-size: 300px; line-height: 200px; top: 30%; left: 7%; } .single article { position: relative; } .quote-author { display: block; text-transform: uppercase; letter-spacing: 2px; font-size: 13px; margin-top: 8px; font-weight: 700; font-family: 'Source Sans Pro', Arial; } .quote-cover { position: absolute; left: 0; right: 0; bottom: 0; color: white; font-weight: 300; letter-spacing: .2px; font-family: 'Helvetica Neue', Arial; top: 0; background: url("assets/image-background.png") repeat scroll 0 0 / 12px 12px rgba(0, 0, 0, .2); } .home .quote-author { font-size: 11px; } .home .quote-cover { color: #eee; } article.featured .article-content { -webkit-columns: 2; -webkit-column-gap: 18px; } article .article-content { margin-top: -1px; } .home article .article-content .tiled-gallery, .search article .article-content .tiled-gallery, .archive article .article-content .tiled-gallery { display: none; } .more-link { display: block; text-align: center; margin: 0 auto; font-size: 13px; letter-spacing: .6px; font-weight: 600; text-transform: uppercase; margin: 33px auto 0 auto; padding: 5px 0; border: 1px solid #aaa; border-radius: 2px; width: 160px; } article.featured .image-cover { position: relative; height: 205px; } article.featured .image-cover img { height: 100%; width: auto; max-width: 200%; } article.featured .image-cover h2 { position: absolute; color: white; font-weight: 700; font-size: 2em; bottom: -1px; left: -0px; line-height: 90%; text-transform: capitalize; text-align: left; } article.featured { width: 33.1%; overflow: hidden; display: inline-block; vertical-align: top; } div.side-banner { height: 232px; width: 100%; border: 1px dashed #888; position: relative; } div.side-banner > span { display: block; width: 100%; color: #888; text-align: center; position: absolute; top: 116px; margin-top: -16px; } .divider { height: 1px; width: 100%; border-bottom: 1px solid #aaa; position: relative; } .divider:before { content: ''; position: absolute; left: 0; background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,0))); width: 100px; height: 2px; } .divider:after { content: ''; position: absolute; right: 0; background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1))); width: 100px; height: 2px; } .content-cover, article footer { padding: 18px 36px; position: relative; } .content-cover .category-link { text-align: center; } .home article footer, .archive article footer, .search article footer { padding: 20px 30px; padding-top: 0; } .comment-pagination { display: block; margin-top: 10px; text-align: center; border-top: 1px solid #e5e5e5; padding: 20px; } .comment-pagination a, .comment-pagination span { padding: 5px 10px; border: 1px solid #ddd; border-radius: 2px; } .card, .comment-respond form { box-shadow: 0px 1px 2px #aaa; -moz-box-shadow: 0px 1px 2px #aaa; -webkit-box-shadow: 0px 1px 2px #aaa; border-radius: 0px; background-color: white; overflow: hidden; } .backslash { padding: 0 5px; } .article-section-head, .comment-reply-title { display: block; padding: 24px 0; margin: 0; color: #666; text-transform: uppercase; letter-spacing: .6px; font-weight: 600; font-size: 15px; text-align: center; } .relatedposts { margin-bottom: 48px; padding: 24px 0 20px 0; } .relatedposts > div { padding-right: 24px; } .relatedposts .relatedthumb { padding: 0 12px; padding-right: 0; padding-left: 24px; } .relatedposts .relatedthumb a { display: block; overflow: hidden; min-height: 150px; } .relatedposts .relatedthumb h4 { margin: 0; margin-top: 5px; font-weight: 600; color: #555; line-height: 125%; font-size: .95em; } .relatedposts .relatedthumb time { color: #888; font-size: .9em; } .relatedposts .relatedthumb a span { height: 150px; width: 150px; display: block; background: #eee; } .relatedposts .relatedthumb a img { margin: 0 auto; height: 150px; max-width: none; width: auto; } /* 5. Footer Styling */ #footer { max-width: none; background-color: #585C60; padding: 36px 18px; padding-top: 0; padding-bottom: 0; text-align: center; } #social-footer { background-color: #4E5358; border-bottom: 1px solid #434343; padding: 18px 0; line-height: 28px; min-height: 59px; color: #999; } #social-footer span, .copyrights { letter-spacing: 2px; font-size: 12px; text-transform: uppercase; color: #999; font-weight: 600; } #social-footer span { padding-left: 24px; padding-right: 24px; } #social-footer .social-links { float: right; font-size: 1.2em; } #social-footer .social-links a { margin: 0; } #social-footer .social-links a:hover { color: #fff; } .copyrights { width: 100%; text-align: center; padding: 18px 0; line-height: 28px; border-top: 1px solid #434343; background-color: #4E5358; } #sidebar2 .card { box-shadow: 0px 1px 2px #111; -webkit-box-shadow: 0px 1px 2px #111; color: #555; font-weight: normal; } #sidebar2 .apricot_recent_posts .widgettitle > span { opacity: .3; } #sidebar2 .apricot_recent_posts .widgettitle > span.active { color: #ddd; opacity: 1; } #sidebar2 .apricot_recent_posts .apricot_recent_posts_cover { font-size: 1.05em; } #sidebar2 .widget li .post-date { color: #aaa; } #sidebar2 .widget { text-align: left; vertical-align: top; margin-bottom: 0; padding-bottom: 24px; padding-top: 24px; font-size: .89em; color: #bbb; font-weight: 400; border-left: 1px solid transparent; } #sidebar2 .widget:last-child { border-right: 1px solid transparent; } #sidebar2 .widgettitle { letter-spacing: 0; font-weight: bold; font-size: 1.4em; border: 0px; text-transform: none; } #sidebar2 .widget a { color: #ddd; } #sidebar2 .widget a:hover { color: #eee; } #sidebar2 .widget .widgettitle { color: #ddd; border-bottom-color: #ddd; } #sidebar2 .textwidget p:first-child { margin-top: 0; } #sidebar2 .widget > ul li { margin-bottom: 7px; } #sidebar2 .widget > ul li:last-child, #sidebar2 .widget > ul { margin-bottom: 0; } .newsletter input { border: 0px; border-radius: 2px; padding: 9px 10px; width: 100%; font-size: .9em; margin-bottom: 12px; background-color: #4E5358; box-shadow: 1px 1px 2px #444 inset; outline: none; } .newsletter > div { position: relative; } .newsletter button { position: absolute; top: 3px; border: 0px; color: #999; right: 3px; width: auto; font-size: 12px; letter-spacing: .5px; text-transform: uppercase; display: inline-block; padding: 5px 9px; font-weight: 600; border-radius: 2px; outline: none; background: none; box-shadow: none; background-color: #585C60; box-shadow: 0px 1px 2px #444; } .newsletter button:hover { color: #aaa; background-color: #585C60; } /* 6. Theme Multiple-Column Layout Styling */ body.column-layout-two article .post-title { line-height: 140%; margin-top: 0; } body.column-layout-two .content-cover { padding: 18px 24px; } body.column-layout-two article { margin-bottom: 48px; font-size: 95%; } /* 7. Comments Styling */ .single #content .comment footer { padding: 0; border: 0px; } .comment-form-author, .comment-form-email { display: inline-block; width: 50%; } .comment-form-email { float: right; } .comment-form-author { padding-right: 36px; } #reply-title small { font-size: 100%; padding-left: 12px; } #reply-title small a:before { content: '/'; position: relative; left: -8px; } .comment-form > p { position: relative; margin-bottom: 36px; margin-top: 0; } .comment-form > p.form-submit { margin-bottom: 0; } .comment-form > p.form-submit input, .comment-form > p.form-submit button { display: inline-block; background: none; width: auto; padding-left: 24px; padding-right: 24px; } .comment-form > p label { position: absolute; text-transform: uppercase; letter-spacing: .6px; font-size: 15px; top: -14px; background: white; left: 12px; font-weight: 600; } .comment-form > p input, .comment-form > p textarea { width: 100%; display: block; border: 1px solid #ccc; border-radius: 2px; padding: 9px 12px; outline: none; } .comment-respond form { padding: 36px; margin-bottom: 48px; } #form-allowed-tags { display: none; } .comments-title { display: block; padding: 24px 0; margin: 0; color: #666; text-transform: uppercase; letter-spacing: .6px; font-weight: 600; font-size: 15px; text-align: center; } .must-log-in { text-align: center; margin-bottom: 48px; } .comment-list { padding-left: 0; margin-top: 0px; margin-bottom: 48px; background: white; } .comment-list .children { padding-left: 110px; } .comment-list .children > li:first-child { border-top: 1px solid #ddd; position: relative; } .comment-list .children > li:first-child:before { width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top:10px solid #bababa; position: absolute; left: 45px; top: 0px; content: ''; z-index: 101; } .comment-list .children > li:first-child:after { width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top:10px solid #fff; position: absolute; left: 45px; top: -1px; content: ''; z-index: 101; } .comment-list .children > li { } .comment-list li { list-style-type: none; position: relative; } .comment-author .fn { font-style: normal; font-weight: 600; color: #777; text-transform: uppercase; letter-spacing: .4px; font-size: 12px; display: inline-block; padding-top: 5px; } .comment-list li .says { display: none; } .comment-list li div.comment-author { position: absolute; left: -110px; width: 110px; text-align: center; top: 0; } .comment-list li div.comment-author img { display: block; width: 48px; height: 48px; margin: 0 auto; border-radius: 100px; background-color: #eee; } .comment-list .comment-meta { color: #888; } .comment-list .comment-body { position: relative; padding: 24px 36px; padding-left: 110px; background: white; margin-bottom: 0; } .comment-list .children .comment-body { padding-left: 55px; margin-left: 55px; } .comment-list > li > .comment-body { border-top: 1px solid #ddd; } .comment-list > li:first-child > .comment-body { border-top: 0px; } /* 8. Media Queries / Responsive Stuff */ /* Desktops and Laptops */ @media (min-width : 1024px) { } @media (max-width : 1023px) { .apricot_recent_posts li a > span.text { float: none; } body.fixed.header-layout-top #container #header .small-logo, body.fixed.header-layout-top #header .social-links { display: none; } } @media (max-width : 1224px) { #content { padding: 48px 24px; } } @media (max-width : 767px) { .featured-cover { margin-bottom: 24px; } body.column-layout-two article { margin-bottom: 24px; } body #content .featured-post { display: block; width: 100%; position: static; } #content .featured-post .article-info { font-size: 12px; } #content .featured-post.featured-0 .article-info { font-size: 12px; } body #container #content .featured-post article.card .post-title { font-size: 1.4em; } body #container #content .featured-post article.card { padding: 10px; } body #container #content .featured-post.featured-1 article.card, body #container #content .featured-post.featured-2 article.card { padding-top: 0; } .single .header-cover { margin: 0; } #social-footer span { padding-left: 42px; padding-right: 42px; display: block; } .comment-list .children .comment-body { padding-left: 0; margin-left: 31px; } .featured-post article .content-cover { display: block; width: 100%; margin: 0; } .featured-post article .header-cover { display: block; width: auto; position: relative; } body.single #container .embed-quote { font-size: 18px; } #archive-head .author-left { position: static; padding-left: 0; } #archive-head .author-right { padding-left: 0; } #archive-head.card { margin-bottom: 24px; } body.single .list-posts, body.page .list-posts { box-shadow: none; padding: 0; background-color: none; } form .comment-form-author, form .comment-form-email { display: block; width: 100%; padding: 0; } .relatedposts .relatedthumb { margin-bottom: 12px; } .relatedposts { padding-bottom: 0; } #header h1 { font-size: 34px; } #top-nav li .sub-menu li a { font-size: 85%; } .post-title { font-size: 1.6em; } .content-cover, article footer { padding: 18px; } #top-nav li .sub-menu .sub-menu li { position: relative; padding-left: 8px; } #top-nav li .sub-menu .sub-menu li a { font-size: 75%; padding-right: 0; width: 100%; } #top-nav li .sub-menu li a { width: 100%; } #top-nav li .sub-menu .sub-menu li a { width: auto; } #top-nav li .sub-menu .sub-menu li:before { content: '-'; position: absolute; left: 15px; z-index: 999; height: 30px; width: 10px; } .single #content .content-cover, .page #content .content-cover, .comment-respond form { padding: 18px; } .single #content article footer { padding: 18px; } .single .author-left { left: 18px; top: 18px; } .home #content { padding-top: 24px; } #content { padding: 0; padding-top: 0px; } .comment-list .comment-body { padding-left: 36px; } .comment-list li div.comment-author { position: static; text-align: left; margin-bottom: 12px; } .comment-list .children, .comment-list .comment-body { padding-left: 24px; } .comment-list .comment-body { padding: 24px; } .comment-list li div.comment-author img { margin-left: 0; } .apricot_recent_posts li a > span.text { float: none; } #header .social-links { display: none; } #header h1 { padding-top: 18px; } #mobile-menu { display: block; position: fixed; top: 8px; right: 8px; font-size: 24px; background: white; padding: 2px 5px; z-index: 9990; } body.mobile-fixed #header .search-form-cover, body #header.show-search .search-form-cover { box-shadow: 0px 1px 2px #999; border-top-left-radius: 2px; border-bottom-left-radius: 2px; } #header.show-search .search-form-cover > span { right: 159px; } body.mobile-fixed #header #mobile-menu, body #header.show-search #mobile-menu { box-shadow: 1px 1px 2px #999; border-top-right-radius: 2px; border-bottom-right-radius: 2px; } #header .search-form-cover { position: fixed; top: 8px; bottom: auto; right: 50px; background: white; z-index: 9991; height: 40px; min-width: 40px; } #header .search-form-cover form { position: static; line-height: 40px; } #header .search-form-cover form input { border: 0px; margin-left: 10px; } #header .search-form-cover > span { font-size: 22px; padding: 6px 5px; line-height: normal; right: 0px; } #header .search-form-cover.active > span { right: 160px; } #top-nav { display: none; padding: 12px 0; max-height: 96%; position: fixed; top: 8px; right: 8px; background: white; box-shadow: 0px 1px 3px #999; overflow: auto; transform-origin: 100% 0%; -webkit-transform-origin: 100% 0%; -webkit-animation: mobile-show .2s cubic-bezier(.6,.4,0,1); -moz-animation: mobile-show .2s cubic-bezier(.6,.4,0,1); animation: mobile-show .2s cubic-bezier(.6,.4,0,1); z-index: 9992; } body.admin-bar #top-nav, body.admin-bar #mobile-menu, body.admin-bar #header .search-form-cover { cursor: pointer; } #top-nav li .sub-menu { display: block; box-shadow: none; position: static; padding: 0px; background: none; -webkit-animation: none; -moz-animation: none; animation: none; } #top-nav li .sub-menu li a { padding-right: 8px; } #top-nav li .sub-menu, body #top-nav li:hover .sub-menu { margin-right: 8px; padding-right: 8px; width: auto; border-right: 2px solid #666; padding-top: 0; } #top-nav li .sub-menu .sub-menu li:before { content: none; } #top-nav li:hover .sub-menu { padding-bottom: 0px; box-shadow: none; } #top-nav li.menu-item-has-children:hover { box-shadow: none; } #top-nav li { display: block; text-align: right; } #top-nav li a { padding: 8px 15px; } #top-nav.active { display: block; } } /* iPads */ @media (min-width : 768px) { #top-nav li.current-menu-item-fake > a:before { content: '✓'; left: 4px; position: absolute; line-height: 15px; font-size: 10px; } body #container #top-nav li:hover .sub-menu { border-color: #eee; } #top-nav li:hover .sub-menu > li:last-child > a { padding-bottom: 12px; } #top-nav li:hover .sub-menu > li:first-child > a { padding-top: 12px; } #top-nav li:hover .sub-menu { min-width: 100%; } body #container #top-nav .sub-menu .sub-menu { position: absolute; display: none; box-shadow: 0px 1px 3px #aaa; border: 0px; left: 100%; margin-left: -3px; top: 0px; border-top-left-radius: 0px; } body.header-layout-left #container #top-nav .sub-menu .sub-menu { display: block; } body #top-nav .sub-menu li > a:hover { padding-left: 17px; padding-right: 13px; } body #top-nav .sub-menu li.menu-item-has-children > a { width: 100%; } body #container #top-nav .sub-menu li:hover > .sub-menu { display: block; } body.header-layout-top.admin-bar #header { top: 32px; } #top-nav li:hover .sub-menu { border-top: 1px solid #f0f0f0; } html body.header-layout-top { padding-top: 162px; } body.header-layout-top #header { position: absolute; top: 0; left: 0; right: 0; } body.header-layout-top #top-nav { display: inline-block; vertical-align: top; position: relative; transition: all .3s cubic-bezier(.6,.4,0,1.1); -webkit-transition: all .3s cubic-bezier(.6,.4,0,1.1); -webkit-transform: translate3D(0,0,0); transform: translate3D(0,0,0); } body.header-layout-top #header .search-form-cover { position: relative; display: inline-block; width: 50px; } body.header-layout-top #header.show-search #top-nav { -webkit-transform: translate3D(-150px,0,0); transform: translate3D(-150px,0,0); } body.header-layout-top #header { height: 162px; } body.fixed.header-layout-top #header { position: fixed; top: -117px; left: 0; right: 0; } body.fixed #header > div { text-align: right; } body.fixed.header-layout-top #header .small-logo { display: block; } body.fixed.header-layout-top.admin-bar #header .social-links { top: 42px; } body.fixed.header-layout-top #header .social-links { position: fixed; -webkit-animation: social-show .7s cubic-bezier(.6,.4,0,1); -moz-animation: social-show .7s cubic-bezier(.6,.4,0,1); animation: social-show .7s cubic-bezier(.6,.4,0,1); top: 10px; padding-top: 0; } body.fixed.header-layout-top.admin-bar #header { top: -85px; } body.fixed.header-layout-top #content { } #mobile-menu { display: none; } /* 9. Header Position Layout Styling */ .header-layout-left #header { position: fixed; left: 0; bottom: 0; top: 0; width: 240px; padding-top: 36px; text-align: center; } .header-layout-left #header #site_logo { max-height: none; max-width: 160px; } .header-layout-left #header .social-links { display: block; position: static; padding: 0; } .header-layout-left #header .social-links a { margin-bottom: 18px; } .header-layout-left #top-nav { margin-bottom: 18px; } .header-layout-left #top-nav li a { padding: 9px 15px; } .header-layout-left #top-nav > li > a { min-width: 130px; } .header-layout-left #header .search-form-cover { position: static; line-height: normal; height: 34px; margin-bottom: 18px; } .header-layout-left #header .search-form-cover > span, .header-layout-left #header.show-search .search-form-cover form { display: inline-block; position: static; } .header-layout-left #header .search-form-cover > span { padding: 0 2px; line-height: 34px; cursor: pointer; position: absolute; left: 50%; right: auto; background: none; margin-left: -13px; transition: left .2s ease; -webkit-transition: left .2s ease; } .header-layout-left #header.show-search .search-form-cover > span { left: 16%; } .header-layout-left #header.show-search .search-form-cover form { width: 80%; margin-top: 1px; } .header-layout-left #header.show-search .search-form-cover, .header-layout-left #header.show-search .search-form-cover form { box-shadow: none; } .header-layout-left #header .search-form-cover input { margin: 0px; padding: 6px 10px; border: 1px solid #aaa; border-radius: 20px; padding-left: 28px; width: 100%; } .header-layout-left #header #top-nav li { display: block; max-width: 80%; margin: 0 auto; } .header-layout-left #header #top-nav li .sub-menu .sub-menu, .header-layout-left #header #top-nav li .sub-menu li:hover .sub-menu, .header-layout-left #top-nav .sub-menu li.menu-item-has-children:hover { position: static; box-shadow: none; } .header-layout-left #header #top-nav li .sub-menu .sub-menu li { } .header-layout-left #content, .header-layout-left #footer, .header-layout-left .copyrights { padding-left: 268px; padding-right: 24px; margin-top: 18px; max-width: none; } .header-layout-left #footer, .header-layout-left #footer > div { max-width: none; } .header-layout-left #content { margin-top: 0; padding-top: 54px; } } /* iPads */ @media (min-width : 768px) and (max-width : 1023px) { body.fixed.header-layout-top #header .small-logo { display: none; } body.header-layout-left.single .list-posts { box-shadow: none; padding: 0; background-color: none; } body.header-layout-left.single #content, body.header-layout-left.single #footer, body.header-layout-left.single .copyrights { padding-left: 238px; padding-right: 0px; padding-top: 0; max-width: none; } body.header-layout-left .block-one, body.header-layout-left .block-two { width: 100%; } } /* Phones */ @media (max-width : 480px) { }