/** blog-sidebar **/ .blog-sidebar{ position: relative; background: #fff; box-shadow: 0px 10px 80px 0px #0000000A; padding: 50px 40px 60px 40px; border-radius: 10px; overflow: hidden; } .blog-sidebar .widget-title{ position: relative; display: block; } .blog-sidebar .widget-title h3{ font-size: 24px; line-height: 32px; } .blog-sidebar .search-widget .search-inner .form-group{ position: relative; margin-bottom: 0px; } .blog-sidebar .search-widget .search-inner .form-group input[type='search']{ position: relative; display: block; width: 100%; height: 60px; background: #fff; border: 1px solid rgba(229, 229, 229, 1); border-radius: 5px; font-size: 16px; color: #6A6A6A; padding: 10px 50px 10px 30px; } .blog-sidebar .search-widget .search-inner .form-group button[type='submit']{ position: absolute; top: 18px; right: 26px; font-size: 18px; color: #909092; cursor: pointer; transition: all 500ms ease; } .blog-sidebar .search-widget .search-inner .form-group input:focus{ border-color: var(--theme-color); } .blog-sidebar .search-widget .search-inner .form-group input:focus + button, .blog-sidebar .search-widget .search-inner .form-group button:hover{ color: var(--theme-color); } .blog-sidebar .category-widget .category-list li{ position: relative; display: block; font-size: 16px; line-height: 28px; margin-bottom: 20px; } .blog-sidebar .category-widget .category-list li:last-child{ margin-bottom: 0px; } .blog-sidebar .category-widget .category-list li a{ position: relative; display: inline-block; color: #111; } .blog-sidebar .category-widget .category-list li a:hover{ padding-left: 17px; color: var(--theme-color); } .blog-sidebar .category-widget .category-list li a:before{ position: absolute; content: '\e90b'; font-family: 'icomoon'; font-size: 12px; left: 0px; top: 0px; opacity: 0; transform: rotate(-90deg); transition: all 500ms ease; } .blog-sidebar .category-widget .category-list li a:hover:before{ opacity: 1; } .blog-sidebar .post-widget .post{ position: relative; display: block; padding-left: 110px; padding-bottom: 35px; margin-bottom: 25px; border-bottom: 1px solid #E5E5E5; min-height: 118px; } .blog-sidebar .post-widget .post:last-child{ border-bottom: none; margin-bottom: 0px; } .blog-sidebar .post-widget .post .post-thumb{ position: absolute; left: 0px; top: 0px; width: 90px; height: 90px; border-radius: 10px; } .blog-sidebar .post-widget .post .post-thumb img{ width: 100%; border-radius: 10px; } .blog-sidebar .post-widget .post h5{ position: relative; display: block; font-size: 18px; line-height: 22px; margin-bottom: 10px; } .blog-sidebar .post-widget .post h5 a{ display: inline-block; color: var(--title-color); } .blog-sidebar .post-widget .post h5 a:hover{ color: var(--theme-color); } .blog-sidebar .post-widget .post .post-date{ position: relative; display: block; font-size: 15px; color: #6A6A6A; padding-left: 24px; } .blog-sidebar .post-widget .post .post-date i{ position: absolute; left: 0px; top: 4px; font-size: 16px; color: var(--theme-color); } .blog-sidebar .gallery-widget .image-list{ position: relative; margin: 0px -5px; } .blog-sidebar .gallery-widget .image-list li{ position: relative; display: inline-block; float: left; margin: 0px 5px 10px 5px; border-radius: 5px; } .blog-sidebar .gallery-widget .image-list li img{ width: 100%; border-radius: 5px; } .blog-sidebar .tags-widget .tags-list{ position: relative; margin: 0px -5px; } .blog-sidebar .tags-widget .tags-list li{ position: relative; display: inline-block; float: left; margin: 0px 5px 10px 5px; } .blog-sidebar .tags-widget .tags-list li a{ position: relative; display: inline-block; font-size: 15px; line-height: 28px; color: rgba(106, 106, 106, 1); background: #fff; border: 1px solid rgba(229, 229, 229, 1); padding: 3px 17px; border-radius: 5px; } .blog-sidebar .tags-widget .tags-list li a:hover{ color: #fff; background: var(--theme-color); border-color: var(--theme-color); } /** rtl-css **/ .rtl .blog-sidebar .post-widget .post{ padding-left: 0px; padding-right: 110px; } .rtl .blog-sidebar .post-widget .post .post-thumb{ left: inherit; right: 0px; } .rtl .blog-sidebar .post-widget .post .post-date{ padding-left: 0px; padding-right: 24px; } .rtl .blog-sidebar .post-widget .post .post-date i{ left: inherit; right: 0px; } .rtl .blog-sidebar .gallery-widget .image-list li{ float: right; } .rtl .blog-sidebar .tags-widget .tags-list li{ float: right; } /** responsive-css **/ @media only screen and (max-width: 1200px){ } @media only screen and (max-width: 991px){ .blog-sidebar{ margin-left: 0px; margin-top: 30px; } } @media only screen and (max-width: 767px){ } @media only screen and (max-width: 599px){ } @media only screen and (max-width: 499px){ .blog-sidebar{ padding-left: 30px; padding-right: 30px; } }