/* Theme Name: Bloga Theme URI: http://www.xltheme.com/product/bloga/ Author: XL Theme Author URI: http://www.xltheme.com/ Description: Bloga is a responsive personal blogging template. Version: 1.0.6 */ /** * Table of Contents * * 1.0 Google Font * 2.0 Global * 2.1 Headings * 2.2 Section * 2.3 Button * 3.0 Header * 4.0 Blog * 4.1 Blog Page * 4.2 Single Blog * 4.3 Comment Respond * 5.0 Sidebar * 5.1 Calendar * 6.0 Footer Widget * 7.0 Footer * 8.0 Accessibility * */ /** * 1.0 Google Font */ @import url(https://fonts.googleapis.com/css?family=Ubuntu:400,300,500,700); /** * 2.0 Global */ html,body { font-family: 'Ubuntu', sans-serif; color: #5c6c82; font-size: 14px; font-weight: 400; } a { color: #2b3747; -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -ms-transition: all .25s ease; -o-transition: all .25s ease; transition: all .25s ease; } a:hover { color: #ef6767; text-decoration: none; } a:focus { text-decoration: none; outline:none; outline-offset:0; } p { line-height: 25px; margin-bottom: 20px; } article tr, article th, article td { border: 1px solid #ddd; padding: 10px; } img, figure, select { max-width: 100%; } select { padding: 12px 10px; } blockquote { border-left: 5px solid #ef6767; } blockquote.alignleft, .wp-caption.alignleft, img.alignleft { margin: 0.4211em 1.6842em 1.6842em 0; } blockquote.alignright, .wp-caption.alignright, img.alignright { margin: 0.4211em 0 1.6842em 1.6842em; } .alignright { display: inline; float: right; } .alignleft { display: inline; float: left; } blockquote.aligncenter, .wp-caption.aligncenter, img.aligncenter { margin-top: 0.4211em; margin-bottom: 1.6842em; } .aligncenter { display: block; margin-right: auto; margin-left: auto; } .wp-caption-text { color: rgba(51, 51, 51, 0.6); font-size: 1rem; line-height: 1.5; padding: 0.5em 0; } .wp-caption, .gallery { margin-bottom: 1.6842em; } .bypostauthor { display: block; } .gallery-caption { display: block; } .sticky { display: block; background-color: rgb(221, 221, 221); padding: 30px; } /** * 2.1 Headings */ h1, h2, h3, h4, h5, h6 { font-weight: 700; text-transform: uppercase; } h1 { font-size: 2em; } h2 { font-size: 1.8em; } h3 { font-size: 1.3em; } h4 { font-size: 1.1em; } h5 { font-size: 1em; } h6 { font-size: 0.8em; } /** * 2.2 Section */ .separator { border-bottom: 1px solid #e3e3e3; margin: 15px 0px; } .blank { display: block; height: 99px; } .section-padding { padding: 80px 0; } .tm0 { margin-top: 0px; } .bm30 { margin-bottom: 30px; } .ptop { padding-top: 0px !important; } .pbottom-0 { padding-bottom: 0px !important; } .fa-mobile { font-size: 20px; } /** * 2.3 Button */ .btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus { outline: none; outline-offset: 0; } .btn:active, .btn.active { background-image: none; outline: 0; box-shadow: none; } .btn:hover, .btn:focus, .btn.focus { color: #ffffff; outline:none; } .btn { border-radius: 0; } .custom-btn, .submit { background: transparent; color: #ffffff; border: 1px solid #ffffff; font-size: .8em; font-weight: 700; text-transform: uppercase; padding: 10px 25px; position: relative; z-index: 0; -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -ms-transition: all .25s ease; -o-transition: all .25s ease; transition: all .25s ease; } .custom-btn:hover, .submit:hover { background: #ef6767; color: #ffffff; border-color: #ef6767; } .submit { color: #2b3747; border-color: #b8c3d2; } /** * 3.0 Header */ .header-area { background: #ffffff; } .navbar-default { background-color: transparent; border-color: transparent; z-index: 9999; } .navbar { min-height: inherit; margin-bottom: 0; } .navbar-brand { float: left; height: inherit; padding: 0; font-size: inherit; line-height: inherit; } .navbar-brand .site-title { font-size: 2.5em; margin: 26px 0; } .navbar-brand .site-description { margin-top: 10px; line-height: 0; } .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus { background-color: transparent; color: #ef6767; } .navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:hover, .navbar-default .navbar-nav>.open>a:focus { background-color: transparent; color: #ef6767; } .nav .open>a, .nav .open>a:hover, .nav .open>a:focus { background-color: #ef6767; border-color: transparent; } .navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus { color: #ef6767; } .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { background-color: #ef6767; } .navbar-default .navbar-toggle:hover .icon-bar, .navbar-default .navbar-toggle:focus .icon-bar { background-color: #ffffff; } .navbar-default .navbar-toggle .icon-bar { background-color: #ef6767; } .navbar-default .navbar-toggle { border-color: #ef6767; } .navbar-collapse { padding-right: 0px; padding-left: 0px; } .collapse.navbar-collapse { border-color: transparent; } .menu ul a { font-size: 0.9em; } .main-menu { margin: 0; } .navbar-nav>li>a { padding-top: 35px; padding-bottom: 35px; } .sub-menu li a { font-size: 0.937em; } .sub-menu.sm-nowrap { min-width: 200px !important; margin-top: 2px !important; left: 50px !important; border-top: 2px solid #BA4646; } .sub-menu.sm-nowrap ul { margin-top: -40px !important; left: 0px !important; } .navbar-default .navbar-collapse, .navbar-default .navbar-form { border-color: transparent; } .navbar-default .navbar-nav>li>a { color: #2b3747; text-transform: uppercase; } .menu { -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -ms-transition: all .25s ease; -o-transition: all .25s ease; transition: all .25s ease; } .menu.padding-0 { padding: 0; } .menu.padding-0 .sub-menu.sm-nowrap { margin-top: 14px !important; } .menu.padding-0 .sub-menu.sm-nowrap ul { margin-top: -40px !important; } .navbar-fixed-top { box-shadow: 0 0 0px 1px rgba(221, 221, 221, 0.41); } .logged-in.admin-bar .navbar-fixed-top { top: inherit; } /** * 4.0 Blog */ .post-thumbnail { display: block; overflow: hidden; border: 2px solid #e3e3e3; padding: 3px; } .entry-meta { font-size: 0.875em; margin: 15px 0; display: block; overflow: hidden; } .more-post { text-align: center; margin-top: 50px; } .more-btn { color: #2b3747; border-color: #b8c3d2; } .comments-link, .tags-links, .cat-links { margin-right: 10px; } /** * 4.1 Blog Page */ .blog-page .post-thumbnail { display: block; overflow: hidden; border: 0; border-radius: 0; padding: 0; max-height: 350px; } .blog-page .entry-meta { border-bottom: 1px solid #e3e3e3; padding-bottom: 15px; } .blog-page .single-post { margin-bottom: 80px; } #blog-slider .carousel-inner .item { text-align: center; padding: 0; margin-bottom: 80px; } #blog-slider .carousel-inner { height: 350px; } .blog-page .post-thumbnail iframe { border: none; height: 350px; } .blog-page .post-thumbnail audio { width: 100%; } .entry-format { margin-right: 10px; font-family: FontAwesome; } .format-standard .entry-format:before { content: "\f08d"; } .format-aside .entry-format:before { content: "\f0c6"; } .format-image .entry-format:before { content: "\f03e"; } .format-gallery .entry-format:before { content: "\f03e"; } .format-video .entry-format:before { content: "\f03d"; } .format-status .entry-format:before { content: "\f070"; } .format-quote .entry-format:before { content: "\f10d"; } .format-link .entry-format:before { content: "\f0c1"; } .format-chat .entry-format:before { content: "\f0e6"; } .format-audio .entry-format:before { content: "\f001"; } .pagination li a { margin-left: 10px; } .pagination>li:first-child>a, .pagination>li:first-child>span { border-top-left-radius: 0; border-bottom-left-radius: 0; } .pagination>li:last-child>a, .pagination>li:last-child>span { border-top-right-radius: 0; border-bottom-right-radius: 0; } .pagination>li>a, .pagination>li>span { padding: 7px 13px; } .pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus { background-color: #ef6767; border-color: #ef6767; } .pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus { color: #ffffff; background-color: #ef6767; border-color: #ef6767; } .pagination>li>a, .pagination>li>span { color: #2b3747; border: 1px solid #ddd; } /** * 4.2 Single Blog */ .post-navigation { margin: 45px 0 20px; } .comment-area { margin-top: 80px; display: block; overflow: hidden; } .comment-area ol { list-style: none; padding-left: 0; } .comment-body { border: 1px solid #ddd; margin-bottom: 15px; padding: 20px; } .comment-meta { clear: both; overflow: hidden; } .children { padding-left: 40px !important; } .comment-author { margin-bottom: 10px; float: left; } .comment-metadata { float: right; margin-top: 5px; } .fn { margin-right: 10px; } .comment-date { margin-left: 10px; } .reply { margin-top: -10px; font-weight: bold; } .comment-awaiting-moderation { clear: both; } /** * 4.3 Comment Respond */ .comment-respond { display: block; overflow: hidden; } .comment-reply-title { margin-bottom: 25px; } .comment-form .form-control { margin-bottom: 10px; } .comment-area textarea { height: 210px; } .byline.comment-author-link { font-size: 0.75em; color: #7d8ca1; } /** * 5.0 Sidebar */ input:focus, textarea:focus, keygen:focus, select:focus, .form-control:focus { outline: 0; box-shadow: none; } .form-control { border-radius: 0px; } .form-control:focus { border-color: #ef6767; } .widget { margin-bottom: 80px; } .widget-title { margin: 0 0 25px 0; } .sidebar-widget .widget li { border-bottom: 1px solid #e3e3e3; } .sidebar-widget .widget li:last-child { border-bottom: 0; } .sidebar-widget .widget.categories li { border-bottom: 0; padding-bottom: 0; position: relative; } .sidebar-widget .widget.categories li a { -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -ms-transition: all .25s ease; -o-transition: all .25s ease; transition: all .25s ease; } .blog-search-button:focus { outline: none; } .search-form { position: relative; } .widget_search .search-box { padding-right: 43px; } input.form-control { padding: 20px 12px; border-radius: 0; } .blog-search-button { position: absolute; right: 0px; top: 0px; padding: 10px 15px; background: transparent; border: none; } /** * 5.1 Calendar */ #wp-calendar { width: 100%; } #wp-calendar caption { border: 1px solid #dddddd; text-align: center; margin-bottom: 18px; text-transform: uppercase; font-weight: 700; } #wp-calendar tbody td, #wp-calendar thead th { text-align: center; } #wp-calendar table, #wp-calendar th, #wp-calendar td { border: 1px solid #dddddd; line-height: 40px; } #wp-calendar td a { font-weight: 900; display: block; } #wp-calendar tbody td { -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -ms-transition: all .25s ease; -o-transition: all .25s ease; transition: all .25s ease; } #wp-calendar td a:hover { background: #ef6767; color: #ffffff; } td#prev, td#next { text-align: center; } /** * 6.0 Footer Widget */ .footer-widget { background: #2b3747; color: #f5f5f5; } .widget-title { margin-bottom: 25px; } .footer-widget a { color: #ffffff; } .footer-widget a:hover { color: #ef6767; } .widget ul{ list-style: none; padding-left: 0; } .widget li { border-bottom: 1px solid #414f62; margin: 15px 0; padding-bottom: 15px; } .widget li:last-child { border-bottom: 0; } /** * 7.0 Footer */ .footer-area { padding: 50px 0 30px; background: #ffffff; min-height: 80px; } /** * 8.0 Accessibility */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; } .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: 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; }