/* Theme Name: ablog Theme URI: Author: pandorapark Author URI: Description: ablog is responsive theme which is designed subtle and prevailing. Ideal for featuring ablog products and techniques. It has ablog optimized for best practice SEO with visual page builder integration. Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: ablog Tags: blog, custom-background, custom-colors, custom-menu, featured-images, post-formats, translation-ready, theme-options, threaded-comments, custom-logo, footer-widgets, sticky-post */ /*-------------------------------------------------------------- # Normalize --------------------------------------------------------------*/ body{ background-color: #ebeeed; line-height: 30px; } .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{ line-height: 1.3; } a:focus { outline: thin dotted; } a:hover, a:active { outline: 0; } table { width: 100%; } th, td { border: 1px solid #eee; padding: 6px; text-align: center; } a,.btn,button,input,textarea,select{ -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } img{ max-width: 100%; height: auto; } dl dt{ padding: 5px 0; } textarea { width: 100%; padding: 15px 20px; } .btn{ font-size: 12px; font-weight: 700; letter-spacing: 2px; padding: 12px 20px; text-transform: uppercase; } input, select, textarea{ outline: none; } /*-------------------------------------------------------------- # Header / Navigation --------------------------------------------------------------*/ .primary-menu ul.nav li.dropdown:hover > ul.dropdown-menu { display: block; padding: 0; border-radius: 0; margin: 0; border: 0; } .primary-menu .dropdown-menu>li>a { letter-spacing: 1px; padding: 15px; border-top: 1px solid #f5f5f5; } .dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover{ background-color: #f5f5f5; color: #000; } .site-title a,.site-description,.header-social a,.header-search a{ color: #000; } .site-title a:hover,.header-social a:hover,.header-search a:hover{ color: #666666; } .navbar-default{ border: 0; border-radius: 0; min-height: inherit; margin-bottom: 0; } .header-social,.header-search{ margin-top: 45px; } .header-social ul{ margin-bottom: 0; } .header-social li{ padding: 0 8px; } .header-social li a, .header-search a{ font-size: 18px; } .primary-menu{ margin-top: 20px; } .navbar-default { background-color: transparent; } .primary-menu .navbar-default .navbar-nav>li>a{ padding: 17px; letter-spacing: 2px; font-weight: 700; } .primary-menu .navbar-nav{ margin: 0 auto; float: none; } .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover { background: transparent; } .primary-menu .navbar-nav>li { float: none; display: inline-block; } .primary-menu ul.nav li.dropdown:hover > ul.dropdown-menu ul.dropdown-menu { top: 0; left: 100%; } /*-------------------------------------------------------------- # Accessibility --------------------------------------------------------------*/ /* Text meant only for screen readers. */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */ } .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. */ } /* Do not show the outline on the skip link target. */ #content[tabindex="-1"]:focus { outline: 0; } /*-------------------------------------------------------------- # Alignments --------------------------------------------------------------*/ .alignleft { display: inline; float: left; margin-right: 1.5em; } .alignright { display: inline; float: right; margin-left: 1.5em; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; } /*-------------------------------------------------------------- # Clearings --------------------------------------------------------------*/ .clear:before, .clear:after, .entry-content:before, .entry-content:after, .comment-content:before, .comment-content:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after { content: ""; display: table; table-layout: fixed; } .clear:after, .entry-content:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after { clear: both; } /*-------------------------------------------------------------- # Widgets --------------------------------------------------------------*/ .widget { background: #fff; padding: 30px; width: 100%; margin: 0 0 2.5em; } /* Make sure select elements fit in widgets. */ .widget select { max-width: 100%; } .search-field{ width: 100%; } .calendar_wrap td,.calendar_wrap th{ padding: 3px; } /*-------------------------------------------------------------- ## Pages --------------------------------------------------------------*/ .sticky { display: block; } .hentry { margin: 0 0 1.5em; background: #fff; padding: 30px; } .updated:not(.published) { display: none; } .page-content, .entry-content, .entry-summary { margin: 20px 0 0; } .page-links { clear: both; margin: 0 0 1.5em; } /*-------------------------------------------------------------- ## Blog & Article Page --------------------------------------------------------------*/ .comments-area{ background: #fff; padding: 30px; margin-top: 60px; } .comment-author .avatar { position: absolute; } .comment-author .fn, .comment-metadata { margin-left: 80px; } .comment-metadata { font-size: 12px; margin-bottom: 20px; } .reply { text-align: right; } .comment-list > li ,.no-comments{ background: #fff; padding: 30px; margin-bottom: 30px; } .comment-list .children{ list-style: none; } .comment-list{ list-style: none; margin-top: 30px; padding: 0; } .masonry{ width: 100%; padding: 0; } .masonry .hentry{ width: 50%; float: left; background: transparent; padding: 0 15px; } .article-post-fix{ margin-bottom: 30px; } .classic .article-post{ padding: 0; } .article-post{ background: #fff; padding: 30px; } .posts-navigation,.post-navigation{ width: 100%; display: block; background: #fff; padding: 15px 30px; text-transform: uppercase; letter-spacing: 1px; font-weight: bold; overflow: hidden; } .posts-navigation .nav-previous,.posts-navigation .nav-next,.post-navigation .nav-previous,.post-navigation .nav-next{ width: 50%; float: left; } .posts-navigation .nav-next,.post-navigation .nav-next{ text-align: right; float: right; } .profile-title,.profile-short-note { font-weight: 400; } .blog-profile-wrap{ background: #fff; padding: 150px 0; margin-bottom: 60px; } .blog-profile{ max-width: 760px; margin: 0 auto 60px; } .blog-profile img{ margin-bottom: 20px; } .cat-links,.tags-links a,.comments-link{ font-size: 13px; letter-spacing: 1px; font-weight: 700; } .cat-links a,.posted-on a, .byline a,.entry-title a{ color: #333; } .entry-title a:hover,.cat-links a:hover,.posted-on a:hover, .byline a:hover{ color: #b4b4b4; } .entry-title { margin-top: 10px; margin-bottom: 5px; } .tags-links { margin-right: 30px; font-size: 16px; font-weight: 700; letter-spacing: 1px; } .tags-links a{ text-transform: uppercase; } .post-edit-link{ display: block; font-weight: 700; text-transform: uppercase; color: #333; font-size: 16px; letter-spacing: 1px; margin-top: 15px; } .read-more{ margin-bottom: 30px; } .entry-content p{ margin-bottom: 30px; } .author{ font-weight: 700; } .posted-on,.byline { display: inline-block; font-size: 14px; font-weight: 400; letter-spacing: 0.7px; text-transform: uppercase; color: #000000; margin-right: 15px; } .entry-thumb{ margin: 30px 0 0; } .format-image p, .format-image .entry-content,.format-video p, .format-video .entry-content,.format-audio p, .format-audio .entry-content,.format-link p, .format-link .entry-content,.format-gallery p, .format-gallery .entry-content,.format-gallery .gallery{ margin: 0; } /*-------------------------------------------------------------- ## Comments --------------------------------------------------------------*/ .comment-content a { word-wrap: break-word; } .bypostauthor { display: block; } .comment-form input{ width: 100%; } .comment-form .form-submit input{ width: auto; } /*-------------------------------------------------------------- ## Contact From --------------------------------------------------------------*/ .header-search-form{ position: relative; } .header-search-submit{ font-size: 12px; font-weight: 700; letter-spacing: 2px; padding: 5px 25px; text-transform: uppercase; line-height: inherit; border-radius: 4px; } .form-control,input, select, textarea, button{ height: inherit; border: 2px solid #333; background: transparent; padding: 7px 15px; } button{ border-radius: 4px; } .widget-title{ border-bottom: 2px solid #90dfaa; padding-bottom: 10px; letter-spacing: 3px; text-transform: uppercase; font-weight: 700; margin: 0 0 15px; } .widget-area ul{ list-style: none; padding: 0; } .widget-area ul li a { color: #000; line-height: 1; } .widget-area ul li { padding: 5px 0; color: #000; } .widget_categories{ text-transform: uppercase; letter-spacing: 1px; } /*-------------------------------------------------------------- # Infinite scroll --------------------------------------------------------------*/ /* Globally hidden elements when Infinite Scroll is supported and in use. */ .infinite-scroll .posts-navigation, /* Older / Newer Posts Navigation (always hidden) */ .infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */ display: none; } /* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */ .infinity-end.neverending .site-footer { display: block; } /*-------------------------------------------------------------- # Footer --------------------------------------------------------------*/ .site-footer{ padding: 30px 0; background: #30373b; } .site-info ,.site-info a{ color: #fff; } /*-------------------------------------------------------------- # Media --------------------------------------------------------------*/ .page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } /* Make sure embeds and iframes fit their containers. */ embed, iframe, object { max-width: 100%; } /* Make sure logo link wraps around logo image. */ .custom-logo-link{ display: inline-block; } /*-------------------------------------------------------------- ## Captions --------------------------------------------------------------*/ .wp-caption { margin-bottom: 1.5em; max-width: 100%; } .wp-caption img[class*="wp-image-"] { display: block; margin-left: auto; margin-right: auto; } .wp-caption .wp-caption-text { margin: 0.8075em 0; } .wp-caption-text { text-align: center; } /*-------------------------------------------------------------- ## Galleries --------------------------------------------------------------*/ .gallery { margin-bottom: 1.5em; } .gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; } .gallery-columns-2 .gallery-item { max-width: 50%; } .gallery-columns-3 .gallery-item { max-width: 33.33333%; } .gallery-columns-4 .gallery-item { max-width: 25%; } .gallery-columns-5 .gallery-item { max-width: 20%; } .gallery-columns-6 .gallery-item { max-width: 16.66667%; } .gallery-columns-7 .gallery-item { max-width: 14.28571%; } .gallery-columns-8 .gallery-item { max-width: 12.5%; } .gallery-columns-9 .gallery-item { max-width: 11.11111%; } .gallery-caption { display: block; } /*-------------------------------------------------------------- ## Breadcrumb --------------------------------------------------------------*/ .breadcrumb{ margin-bottom: 0; border-radius: 0; text-align: center; padding: 100px 15px; margin-top: 60px; background: #90dfaa; color: #fff; text-transform: capitalize; } .breadcrumb h1{ margin-top: 0; } .breadcrumb a{ color: #fff; } .breadcrumb span{ padding-right: 10px; } /*-------------------------------------------------------------- ## modal --------------------------------------------------------------*/ .modal-content { box-shadow: none; border: 0; } .position-relative { position: relative; } .search-fix .form-control { background: none; border: 0; border-bottom: 2px solid #90dfaa; font-size: 45px; box-shadow: none; } .search-fix .btn { position: absolute; bottom: 15px; right: 0; background: none; color: #90dfaa; } .modal-dialog { margin: 250px auto; }