/*================== Template Name: blogbit Author : PxelCode Author URI : https://profiles.wordpress.org/pxelcode/ Description: Blog Portfolio Theme for developers, designers marketer etc Version : 1.0 ================================*/ /*------------------------------------------------------------------ [Table of contents] 1. Common 2. Typography 3. Navigation / #navbar 4. Banner 5. About 6. Service 7. Testimonials 8. Blog 9. Contact 10. Footer / #footer -------------------------------------------------------------------*/ :root { --theme-primary-color:#F96703; --theme-secondary-color:#0d43b6; --theme-primary-font:'Urbanist', sans-serif; --theme-secondary-font:'DM Sans', sans-serif; --theme-white-color:#fff; --theme-heading-color:#14133b; --theme-font-color:#5b6674; } body, html { width: 100%; max-width: 100%; } body{ overflow-x: hidden; } html { font-family: sans-serif; line-height: 1.15; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -ms-overflow-style: scrollbar; -webkit-tap-highlight-color: rgba(238, 122, 122, 0); overflow-x: hidden; } body { font-family: var(--theme-secondary-font); font-size: 16px; line-height:1.6; margin: 0; text-align: left; background-color: #fff; font-weight: 400; color: var(--theme-font-color); } p { color: var(--theme-font-color); font-family: var(--theme-secondary-font); font-size: 16px; line-height: 1.6em; margin-bottom: 0px; } /*-------------------- TYPOGRAPHY -----------------*/ .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { font-family: var(--theme-primary-font); font-weight: 700; line-height: 1.3; color: var(--theme-heading-color); margin-bottom: 0px; transition: all 0.3s ease-in-out; } .h1, h1 { font-size: 46px; line-height: 56px; } .h2, h2 { font-size: 32px; } .h3, h3 { font-size: 28px; } .h4, h4 { font-size: 22px; } .h5, h5 { font-size: 18px; } .h6, h6 { font-size: 16px; } .text-sm { font-size: 14px; } .h1 a, .h2 a, .h3 a, .h4 a, .h5 a, .h6 a, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; transition: all 0.3s ease-in-out; text-decoration: none; } .h1 a:hover, .h2 a:hover, .h3 a:hover, .h4 a:hover, .h5 a:hover, .h6 a:hover, h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover { color: var(--theme-primary-color); } a { color: var(--theme-primary-color); outline: none; transition: all 0.3s ease-in-out; } a:hover { color: var(--theme-secondary-color); outline: none; text-decoration: none; } .form-control { transition: all 0.3s ease-in-out; } .form-control:focus { box-shadow: none; } button{ transition: all .4s ease; } img{ max-width:100%; height:auto; } /*===================================== Spacing ===================================*/ .section-padding { padding: 100px 0px; } .section-padding-top { padding-top: 100px; } .section-padding-btm { padding-bottom: 100px; } .pb-70 { padding-bottom: 70px; } .mb-10 { margin-bottom: 10px !important; } .mb-20 { margin-bottom: 20px !important; } .mb-25 { margin-bottom: 25px !important; } .mb-30 { margin-bottom: 30px !important; } .mb-40 { margin-bottom: 40px !important; } .mb-50 { margin-bottom: 50px !important; } .mb-60 { margin-bottom: 60px !important; } .mb-70 { margin-bottom: 70px !important; } .mb-80 { margin-bottom: 80px !important; } .mb-100 { margin-bottom: 100px; } .mb-120 { margin-bottom: 120px; } .mb--120 { margin-bottom: -120px; } .mb--200 { margin-bottom: -200px; } .mt--200 { margin-top: -200px; } .mt--300 { margin-top: -300px; } .pt-60 { padding-top: 60px; } .pt-80 { padding-top: 80px; } .pb-80 { padding-bottom: 80px; } .pb-90 { padding-bottom: 90px; } .pt-110 { padding-top: 210px; } .mt-10 { margin-top: 10px; } .mt-20 { margin-top: 20px; } .mt-30 { margin-top: 30px; } .mt-40 { margin-top: 40px; } .mt-50 { margin-top: 50px; } .mt-60 { margin-top: 60px; } .pb-20 { padding-bottom: 20px; } .pb-30 { padding-bottom: 30px; } .pb-40 { padding-bottom: 40px; } .pb-50 { padding-bottom: 50px; } .pb-60 { padding-bottom: 60px; } .pt-150 { padding-top: 150px; } .pt-250 { padding-top: 250px !important; } .pt-200 { padding-top: 200px !important; } .mb--120 { margin-bottom: -120px; } /*===================================== Utitlies ===================================*/ .container-padding { padding: 0px 80px; } .letter-spacing-2 { letter-spacing: 2px; } .font-sm-14 { font-size: 14px; } .bg-gray { background: #F4F7FC; } .font-lg { font-size: 42px; line-height: 52px; } .page-wrapper { padding: 100px 0px; } textarea.form-control { height: auto; } .heading .subheading { display: inline-block; margin-bottom: 15px; } .heading h2 { text-transform: capitalize; } .subheading { text-transform: uppercase; letter-spacing: 2px; font-size: 12px; font-weight: 600; font-family: var(--theme-primary-font); display: inline-block; color: #777; } .subheading i { margin-right: 10px; } .section-heading { position: relative; } .section-heading .big-title { font-size: 150px; color: #222; opacity: .04; position: absolute; bottom: -87px; text-transform: uppercase; left: 0px; right: 0px; text-align: center; } .section-heading h2 { text-transform: capitalize; } .font-primary { font-family: var(--theme-primary-font); } .font-secondary { font-family: var(--theme-secondary-font); } .bg-magenta { background: #1B202F; } .mb--100 { margin-bottom: -100px; } /*------------------- BUTTONS STYLE ----------------=----*/ .btn { font-weight: 700; position: relative; padding: 14px 35px; border-radius: 0px; font-size: 16px; text-transform: capitalize; font-family: var(--theme-primary-font); border: 2px solid transparent; z-index: 1; overflow: hidden; transition: all 0.6s ease; } .btn:before { position: absolute; content: ""; left: 0px; top: 0px; width: 40%; height: 100%; background: rgba(255, 255, 255, 0.06); transition: all 0.6s ease; } .btn:hover:before { width: 100%; } .btn:focus { box-shadow: none !important; } .rounded-radius { border-radius: 35px; } .btn-theme { background: var(--theme-primary-color); color: #fff; border-color: var(--theme-primary-color); } .btn-theme:hover { border-color: var(--theme-secondary-color); color: #fff; background: var(--theme-secondary-color); } .btn-theme-outline { background: transparent; color: var(--theme-primary-color); border-color: var(--theme-primary-color); } .btn-theme-outline:hover { background: var(--theme-primary-color); color: #fff; border-color: var(--theme-primary-color); } .btn-theme-2 { border-color: var(--theme-secondary-color); color: #fff; background: var(--theme-secondary-color); } .btn-theme-2:hover { background: var(--theme-primary-color); color: #fff; border-color: var(--theme-primary-color); } .btn-white { background: #fff; border-color: #fff; color: #000; } .btn-white:hover { border-color: var(--theme-primary-color); color: #fff; background: var(--theme-primary-color); } .btn-white-outline { background: transparent; border-color: #fff; color: #fff; } .btn-white-outline:hover { border-color: var(--theme-primary-color); color: #fff; background: var(--theme-primary-color); } .btn-black { background: #000; color: #fff; } .btn-black:hover { background: var(--theme-primary-color); border-color: var(--theme-primary-color); color: #fff; } .btn-dark-outline { color: #333; background: transparent; border-color: #333; } .btn-dark-outline:hover { border-color: #000; background: #000; color: #fff; } .btn-grey { border-color: #ddd; color: #222; background: #ddd; } .btn-grey:hover { border-color: var(--theme-primary-color); color: #fff; background: var(--theme-primary-color); } .btn-grey-outline { border-color: #ddd; background: transparent; } .btn-grey-outline:hover { border-color: var(--theme-primary-color); color: #fff; background: var(--theme-primary-color); } .btn-sm { padding: 8px 22px; } .btn-sm-2 { padding: 6px 22px; } .btn-radius { border-radius: 45px; } /*------------------------- Main Menu header -------------------------*/ .header-navbar .site-logo { width: 15%; } .header-navbar .site-logo a { max-width: 140px; } .mobile-logo { width: 50%; margin-left: 20px; margin-bottom: 30px; } .header-style-1 .site-logo h2 { color: #222; } .header-navbar .primary-menu li { position: relative; display: inline-block; } .header-style-1 .header-navbar{ border-bottom:1px solid #eee; padding: 10px 0px; } .header-navbar .primary-menu li a { font-size: 16px; font-weight: 600; color: #222; line-height: 1.4; text-transform: capitalize; font-family: var(--theme-primary-font); padding: 25px 0px; display: block; } .header-navbar .primary-menu li a:hover { opacity: 1; } .header-navbar .primary-menu li .menu-trigger { font-size: 12px; font-weight: 500; position: absolute; right: -10px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); line-height: 1; transition: all 0.3s ease-out 0s; } .header-navbar .primary-menu li:not(:last-child) { margin-right: 40px; } @media (max-width: 1199px) { .header-navbar .primary-menu li:not(:last-child) { margin-right: 40px; } } .header-navbar .primary-menu li .sub-menu { position: absolute; left: 0; min-width: 250px; z-index: 99; height: auto; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); opacity: 0; visibility: hidden; background: #fff; transition: 0.3s; top: 100%; border-top: 5px solid var(--theme-primary-color); } .header-navbar .primary-menu li .sub-menu li:hover .sub-menu { visibility: visible; opacity: 1; } .header-navbar .primary-menu li .sub-menu li .menu-trigger { right: 20px; } .header-navbar .primary-menu li .sub-menu li a { padding: 12px 20px 12px 10px; margin: 0px 20px; display: block; color: #000; border-radius: 3px; } .header-navbar .primary-menu li .sub-menu li a:hover { color: var(--theme-primary-color); } .header-navbar .primary-menu li .sub-menu li { line-height: 1; margin: 0; display: block; } .header-navbar .primary-menu li .sub-menu li:not(:last-child) { border-bottom: 1px solid rgba(0, 0, 0, 0.05); } .header-navbar .primary-menu li:hover > .sub-menu { visibility: visible; top: 100%; opacity: 1; -webkit-transform: scaleY(1); transform: scaleY(1); } .header-navbar .primary-menu li .sub-menu li .sub-menu { left: 100%; top: 20%; } .header-navbar .primary-menu li .sub-menu li:hover > .sub-menu { top: 0; } .header-navbar .primary-menu li .sub-menu li .menu-trigger { color: #222; } .header-navbar .nav-toggler { width: 53px; height: 53px; background: #fff; display: inline-block; text-align: center; line-height: 53px; font-size: 20px; text-align: center; } .header-navbar .nav-toggler:hover { background: #d90429; color: #fff; } .header-navbar.mobile-menu .site-navbar { position: fixed; right: 0; top: 0; width: 280px; margin-right: -280px; height: 100vh; background-color: #00000a; z-index: 999; display: block; padding: 80px 0 40px; overflow-x: hidden; overflow-y: scroll; transition: all 0.3s ease-out 0s; } .header-navbar.mobile-menu .site-navbar.menu-on { margin-right: 0; } @media (max-width: 991px) { .header-navbar.mobile-menu .primary-menu li:not(:last-child) { margin-right: 0; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } } .header-navbar.mobile-menu .primary-menu { display: block; } .header-navbar.mobile-menu .primary-menu li .sub-menu { position: unset; width: 100%; opacity: 1; visibility: visible; background-color: #00000a; border: none; transition: none; box-shadow: none; display: none; } .header-navbar a.nav-close { display: none; } .header-navbar.mobile-menu .site-navbar a.nav-close { position: absolute; top: 20px; right: 10px; font-size: 18px; line-height: 1; padding: 5px; color: #fff; z-index: 2; display: block; } .header-navbar.mobile-menu .primary-menu li .menu-trigger { position: absolute; right: 0; top: 0; height: 45px; width: 45px; display: flex; align-items: center; justify-content: center; -webkit-transform: translate(0); transform: translate(0); border-left: 1px solid rgba(255, 255, 255, 0.1); cursor: pointer; z-index: 2; } .header-navbar.mobile-menu .primary-menu li { display: block; } .header-navbar.mobile-menu .primary-menu li a { display: block; color: rgba(255, 255, 255, 0.8); padding: 12px 20px; font-size: 15px; } .header-navbar.mobile-menu .primary-menu li .sub-menu li { border: none; border-top: 1px solid rgba(255, 255, 255, 0.1); transition: all .4s; display: block; } .header-navbar.mobile-menu .primary-menu li .sub-menu li:hover { background: #232323; } .nav-logo { left: 20px; position: absolute; top: 20px; } .header-navbar.mobile-menu .site-navbar.menu-on .sub-menu li a { color: #fff; } .header-navbar.mobile-menu .site-navbar.menu-on .sub-menu li a:hover { border-color: transparent; } .header-navbar.mobile-menu .site-navbar.menu-on .sub-menu li a:hover { color: #fff; } .offcanvas-icon .nav-toggler { background: #000; color: #fff; display: inline-block; width: 50px; height: 50px; text-align: center; line-height: 50px; } .offcanvas-icon .nav-toggler:hover { background: #d90429; } /*------------------------- Main Menu header -------------------------*/ /* Navigation Toggle ------------------------- */ .site-header{ position: relative; padding: 20px 10px; } .site-logo{ max-width: 200px; } .nav-toggle { position: absolute; bottom: 0; right: 0; top: 0; width: 6.6rem; } .nav-toggle .toggle-inner { padding-top: 0.8rem; } .header-navbar .site-logo a { max-width: 140px; } .header-navbar .primary-menu { display: flex; align-items: center; justify-content: end; } .header-navbar .primary-menu li { position: relative; } .header-navbar .primary-menu li a { font-size: 16px; font-weight: 600; color: #222; line-height: 1.4; text-transform: capitalize; font-family: var(--theme-heading-font); } .header-navbar .primary-menu li a:hover { color: var(--theme-primary-color); } .header-navbar .primary-menu li .menu-trigger { font-size: 12px; font-weight: 500; color: #222; position: absolute; right: -10px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); line-height: 1; transition: all 0.3s ease-out 0s; } .header-navbar .primary-menu li:not(:last-child) { margin-right: 40px; } @media (max-width: 1199px) { .header-navbar .primary-menu li:not(:last-child) { margin-right: 40px; } } .header-navbar .primary-menu li .submenu { position: absolute; left: 0; top: 120%; min-width: 250px; transition: all 0.3s ease-out 0s; z-index: 99; height: auto; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); opacity: 0; visibility: hidden; background: #fff; padding-left: 5px; padding-top: 10px; padding-bottom: 10px; } .header-navbar .primary-menu li .submenu li:hover .submenu { visibility: visible; top: 100%; opacity: 1; } .header-navbar .primary-menu li .submenu li .menu-trigger { right: 20px; } .header-navbar .primary-menu li .submenu li a { padding: 10px 20px; display: block; color: #000; opacity: .6; } .header-navbar .primary-menu li .submenu li a:hover { color: var(--theme-primary-color); opacity: 1; } .header-navbar .primary-menu li .submenu li { line-height: 1; margin: 0; } .header-navbar .primary-menu li:hover > .submenu { visibility: visible; top: 100%; opacity: 1; } .header-navbar .primary-menu li .submenu li .submenu { left: 100%; top: 20%; } .header-navbar .primary-menu li .submenu li:hover > .submenu { top: 0; } .header-navbar .primary-menu li .submenu li .menu-trigger { color: #222; } .header-navbar .nav-toggler { width: 53px; height: 53px; background: #fff; display: inline-block; text-align: center; line-height: 53px; font-size: 20px; text-align: center; } .header-navbar .nav-toggler:hover { background: var(--theme-primary-color); color: #fff; } .header-navbar.mobile-menu .site-navbar { position: fixed; right: 0; top: 0; width: 280px; margin-right: -280px; height: 100vh; background-color: #00000a; z-index: 999; display: block; padding: 80px 0 40px; overflow-x: hidden; overflow-y: scroll; transition: all 0.3s ease-out 0s; } .header-navbar.mobile-menu .site-navbar.menu-on { margin-right: 0; } @media (max-width: 991px) { .header-navbar.mobile-menu .primary-menu li:not(:last-child) { margin-right: 0; border-bottom: 1px solid rgba(255, 255, 255, 0.2); } } .header-navbar.mobile-menu .primary-menu { display: block; } .header-navbar.mobile-menu .primary-menu li .submenu { position: unset; width: 100%; opacity: 1; visibility: visible; background-color: #00000a; border: none; transition: none; box-shadow: none; display: none; } .header-navbar a.nav-close { display: none; } .header-navbar.mobile-menu .site-navbar a.nav-close { position: absolute; top: 20px; right: 10px; font-size: 18px; line-height: 1; padding: 5px; color: #fff; z-index: 2; display: block; } .header-navbar.mobile-menu .primary-menu { display: block; } .header-navbar.mobile-menu .primary-menu li a { display: block; color: rgba(255, 255, 255, 0.8); padding: 12px 20px; font-size: 15px; } .header-navbar.mobile-menu .primary-menu li .menu-trigger { position: absolute; right: 0; top: 0; height: 45px; width: 45px; display: flex; align-items: center; justify-content: center; -webkit-transform: translate(0); transform: translate(0); border-left: 1px solid rgba(255, 255, 255, 0.2); cursor: pointer; z-index: 2; } .header-navbar.mobile-menu .primary-menu li a { display: block; color: rgba(255, 255, 255, 0.8); padding: 12px 20px; font-size: 15px; } .header-navbar.mobile-menu .primary-menu li .submenu li { border: none; border-top: 1px solid rgba(255, 255, 255, 0.2); } .nav-logo { left: 20px; position: absolute; top: 20px; } .header-navbar.mobile-menu .site-navbar.menu-on .submenu li a { color: #fff; } .header-navbar.mobile-menu .site-navbar.menu-on .submenu li a:hover { border-color: transparent; } .border-bottom { border-bottom: 1px solid #dee2e6 !important; } .header-navbar.mobile-menu .site-navbar.menu-on .submenu li a:hover { color: #fff; } .offcanvas-icon .nav-toggler { background: #000; color: #fff; display: inline-block; width: 50px; height: 50px; text-align: center; line-height: 50px; } .offcanvas-icon .nav-toggler:hover { background: var(--theme-primary-color); } .menu_fixed { position: fixed; top: 0px; left: 0px; width: 100%; z-index: 999; background: #fff; box-shadow: 0px 16px 32px 0px rgba(196, 203, 255, 0.3); } .header-navbar .primary-menu{ padding-left:0px; margin-bottom:0px; } .header-navbar .primary-menu a{ text-decoration: none; } .header-navbar .primary-menu li .sub-menu{ padding-left:0px; } .header-navbar .primary-menu li .sub-menu{ min-width:200px; right:0px; left:auto; } .header-navbar .primary-menu ul li.menu-item-has-children:hover > ul, .header-navbar .primary-menu ul li.menu-item-has-children:focus > ul, .header-navbar .primary-menu ul li.menu-item-has-children.focus > ul { right: calc(100% + 2rem); } .header-navbar .primary-menu li.menu-item-has-children:hover > ul, .header-navbar .primary-menu li.menu-item-has-children:focus > ul, .header-navbar .primary-menu li.menu-item-has-children.focus > ul { right: 0; opacity: 1; transform: translateY(0); transition: opacity 0.15s linear, transform 0.15s linear; } /* ================== Page Banner =====================*/ /* Page Banner style */ .main-page-header{ padding: 90px 40px; } .banner-solid{ background: #EDF7FF; } .banner-title { margin-top: 15px; font-size: 36px; } .banner-bg{ position: relative; background: url("../images/bg/bg-2.jpg"); background-size: cover; background-position: center center; z-index: 1; padding: 70px 0px; overflow: hidden; } .banner-bg:after{ position: absolute; content: ""; left: 0px; top: 0px; width: 100%; height: 100%; background: #000; opacity: .8; z-index: -1; } .banner-bg .page-banner-content ul li{ color: #fff; } .banner-bg .page-banner-content .banner-title{ color: #fff; } /* Blog banener section style */ .blog-layout-2 .post-thumb img{ border-radius: 0px; } .blog-layout-2 .post-thumb{ position: relative; z-index: 1; } .blog-layout-2 .post-thumb:after{ position: absolute; width: 100%; height: 100%; content: ""; z-index: -1; bottom: -30px; left: 30px; background: #f2f3f3; } .blog-layout-2 .post-content{ padding-left: 40px; } /* Blog banner layout 3 */ .blog-layout-3{ padding: 90px 0px 60px; } .blog-layout-3 .post-thumb{ position: relative; z-index: 1; } .blog-layout-3 .post-thumb:after{ position: absolute; width: 100%; height: 100%; content: ""; z-index: -1; bottom: -30px; left: 30px; background: #f2f3f3; } .blog-layout-3 .subtitle{ color: var(--theme-primary-color); } .blog-layout-3 .post-content h1{ margin-top: 10px; font-size: 60px; line-height: 1; } .blog-layout-3 .post-content{ padding-left: 50px; } .blog-layout-3 .post-content p{ margin: 20px 0px 25px 0px; } /* blog layout grid banner */ .blog-top-padding { padding-top: 60px; } .blog-layout-1 .post-title{ font-size: 26px; } /* Footer style */ .footer-top{ padding-bottom: 80px; } .copyright p{ color: #fff; } .footer-widget .textwidget{ color: rgba(255,255,255,.8); } .footer-widget img{ margin-bottom: 20px; } .widget_nav_menu li { margin-bottom: 10px; } .widget_nav_menu li a{ color: rgba(255,255,255,.8); text-transform: capitalize; } .widget_nav_menu li a:hover{ color: var(--theme-primary-color); padding-left: 10px; } /* sidebar Padding */ .sidebar-left-padding{ padding-left: 0px; padding-right: 15px; } /* single blog post style */ .single-post-header .post-cat{ text-transform: capitalize; } .single-post-header .post-title{ margin: 15px 0px; font-size: 45px; } .single-post-meta ul{ padding-left: 0px; list-style-type: none; } .single-post-meta ul li{ display: inline-block; margin-right: 20px; text-transform:capitalize; } .single-post-meta ul li a{ color: rgb(62, 60, 60); } .single-post-meta ul li a:hover{ color: var(--theme-primary-color); } .single-post-meta ul li i{ margin-right: 10px; color: rgb(62, 60, 60); } .post-single ul li{ position: relative; padding-left: 0; margin-bottom: 7px; line-height: 2; font-size: 1em; letter-spacing: .1px; } .post-single p{ margin-bottom: 25px; } .wp-block-table thead tr{ background: #eee; color: #000; } .post-single h1, .post-single h2, .post-single h3, .post-single h4, .post-single h5, .post-single h6 { margin-bottom: 20px; } .post-single img { margin-bottom: 20px; } /* Related POst ========= */ .related-post{ border-top: 1px solid #eee; padding-top: 60px; } .related-post .post-cat{ text-transform: capitalize; } .related-post .post-title{ margin-top: 10px; font-size: 22px; margin-bottom: 10px; } /* Post Navigation ========= */ .post-navigation-area a,.comment-form a{ text-decoration: none; } .post-navigation-area { padding: 40px; background: #EDF7FF; margin: 20px 0px; clear: both; } .post-navigation-area span{ color: var(--theme-secondary-color); } .post-navigation-area h5{ transition: all .4s ease; } .post-navigation-area h5:hover{ color: var(--theme-primary-color); } .post-navigation-area .next-post{ border-left: 5px solid #fff; padding-left: 30px; text-align: right; } .post-navigation-area h5{ margin-top: 15px; font-size: 24px; margin-bottom: 0px; } /*===================== Author Info ==========================*/ .single-post-author { margin: 40px 0px; padding: 40px; position: relative; } .single-author-wrapper{ display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: flex-start; align-items: flex-start; } .single-author-wrapper .author-name{ text-transform: capitalize; } .single-author-wrapper .author-img img { width: 100px; height: 100xp; -webkit-border-radius: 50%; border-radius: 50%; object-fit: cover; min-height: unset; min-width: unset; vertical-align: top; } .single-author-wrapper .author-meta { width: calc(100% - 130px); width: -webkit-calc(100% - 130px); width: -moz-calc(100% - 130px); padding-left: 35px; padding-right: 0; } .single-author-wrapper .view-all-auth { font-size: .88889em; font-weight: 400; color: var(--theme-secondary-color); text-decoration: none; margin-top: 15px; text-transform: capitalize; } .single-author-wrapper .view-all-auth:hover{ color: var(--theme-primary-color); } /* ==================== Footer Section ======================*/ .footer { padding: 0px 20px; position: relative; background: #000000; } .footer-top{ padding-top: 100px; } .footer .footer-widget .widget-title { text-transform: capitalize; font-size: 18px; color: #fff; margin-bottom: 20px; font-weight: 600; } .footer .footer-widget p { color: rgba(255, 255, 255, 0.7); } .footer .footer-links li { padding: 5px 0px; } .footer .footer-links a { color: #fff; position: relative; padding-bottom: 5px; transition: all .4s ease; font-family: var(--theme-primary-font); } .footer .footer-links a:before { position: absolute; content: ""; left: 0px; bottom: 0px; width: 0%; height: 2px; background: #fff; opacity: 0; transition: all .4s ease; } .footer .footer-links a:hover { color: #fff; } .footer .footer-links a:hover:before { width: 100%; opacity: 1; } .footer .footer-socials a { font-size: 16px; text-align: center; margin-right: 10px; width: 40px; height: 40px; border: 1px solid rgba(255, 255, 255, 0.09); display: inline-block; border-radius: 100%; line-height: 40px; background: #222; color: #fff; } .footer .footer-socials a:hover { color: #fff; background: var(--theme-primary-color); border-color: var(--theme-primary-color); } .footer-mid { padding-bottom: 80px; } .footer-btm { padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, 0.04); } .footer-logo h2 { color: #fff; } .copyright { color: #e5e5e5; } .copyright a { color: #fff; } .copyright a:hover { color: var(--theme-primary-color); } /* ==================== Footer Section ======================*/ .footer { position: relative; background: #000000; } .footer .footer-widget .widget-title { text-transform: capitalize; font-size: 18px; color: #fff; margin-bottom: 20px; font-weight: 600; } .footer .footer-widget p { color: rgba(255, 255, 255, 0.7); } .footer .footer-links li { padding: 5px 0px; } .footer .footer-links a { color: #fff; position: relative; padding-bottom: 5px; transition: all .4s ease; font-family: var(--theme-primary-font); } .footer .footer-links a:before { position: absolute; content: ""; left: 0px; bottom: 0px; width: 0%; height: 2px; background: #fff; opacity: 0; transition: all .4s ease; } .footer .footer-links a:hover { color: #fff; } .footer .footer-links a:hover:before { width: 100%; opacity: 1; } .footer .footer-socials a { font-size: 16px; text-align: center; margin-right: 10px; width: 40px; height: 40px; border: 1px solid rgba(255, 255, 255, 0.09); display: inline-block; border-radius: 100%; line-height: 40px; background: #222; color: #fff; } .footer .footer-socials a:hover { color: #fff; background: var(--theme-primary-color); border-color: var(--theme-primary-color); } .footer-mid { padding-bottom: 80px; } .footer-btm { padding-top: 20px; padding-bottom: 20px; border-top: 1px solid rgba(255, 255, 255, 0.04); } .footer-logo h2 { color: #fff; } .copyright { color: #e5e5e5; } .copyright a { color: #fff; } .copyright a:hover { color: var(--theme-primary-color); } /*---------------------- Fixed top top bottom --------------------*/ .fixed-btm-top a { width: 50px; height: 50px; position: fixed; right: 20px; bottom: 50px; text-align: center; padding-top: 10px; width: 50px; background: #000; color: #fff; border: 1px solid rgba(255, 255, 255, 0.2); z-index: 3; opacity: 0; visibility: hidden; } .fixed-btm-top a:hover { background: var(--theme-primary-color); color: #fff; } .fixed-btm-top.reveal a { opacity: 1; visibility: visible; }