/* All Widget Templates ************************************************************************************************ ***********************************************************************************************************************/ body.blog-page { --color-white: #ffffff; --color-green: #28a745; --color-yellow: #ffc107; --color-blue: #4db2ec; --color-black: #222222; --color-gray: #6c757d; --color-red: #dc3545; --border-color: #d5d6da; } /* Buttons */ .btn-white {background-color: #fff !important;color: #7d7d7d !important;border: 1px solid #bbb !important;} .btn-white:hover {background-color: #4db2ec !important;color: #fff !important; border: 1px solid #4db2ec !important;} .btn-black {background-color: #222 !important;color: #fff !important;border: 1px solid #222 !important;} .btn-black:hover {background-color: #4db2ec !important;color: #fff !important;border: 1px solid #4db2ec !important;} .btn-blue {background-color: #4db2ec !important;color: #fff !important;border: 1px solid #4db2ec !important;} .btn-blue:hover {background-color: #222 !important;color: #fff !important;border: 1px solid #222 !important;} /* Slider *************************************************************************************************************/ .post-slider .post-block .image-wrap {padding-bottom: 450px;} /* END Slider *********************************************************************************************************/ .clearfix:after {content:"";display:table;clear:both;} .post-holder {margin-bottom: 40px;border-radius: 0;} /* Blog Post List *****************************************************************************************************/ .post-list {margin-top: 0;margin-bottom: 20px;list-style: none;padding-left: 0} .post-list .post-item.post-holder {margin: 0 0 30px 0;padding: 0;display: block;} .post-list .post-container {display: -ms-flexbox;display: flex;} /* Post Image ************************************/ .post-list .post-image {-ms-flex: 0 0 30%;flex: 0 0 30%;width: 30%;order: 0;} .post-list .post-image .image-container {position: relative;} .post-list .post-image .image-wrap {display: block;line-height: 0;overflow: hidden;position: relative;padding-bottom: 70%;} .post-list .post-image .image-wrap .bg-img {position: absolute;display: block;width: 100%;height: 100%;background-size: cover;background-position: center;} .post-list .post-image .image-wrap img {width: 100%;height: auto;vertical-align: middle;} /* Post Category */ .post-list .post-image .post-category {position: absolute;left: 0;bottom: 0;display: block;font-size: 0;line-height: 1;} .post-list .post-image .post-category a {display: inline-block;margin: 0 5px 0 0;padding: 5px 10px;background: #000;color: #fff;font-size: 11px;line-height: 12px;font-weight: 500;text-decoration: none;text-transform: uppercase; /*-webkit-transition: all 0.3s;-ms-transition: all 0.3s;transition: all .3s ease;*/} .post-list .post-image .post-category a:hover {background: #4db2ec;} /* Post Info **************************************/ .post-list.modern .post-info {padding: 0 0 0 25px;flex: 0 0 70%;max-width: 70%;width: 70%;order: 1;box-sizing: border-box;} /* Post Title */ .post-list .post-info .post-title-wrap h3 {margin: 0;} .post-list .post-info .post-title-wrap h3 a {font-size: 20px;line-height: 25px;font-weight: 500;} /* Post Data */ .post-list .post-info .post-data-wrap {font-size: 11px;font-family: sans-serif;} .post-list .post-info .post-data-wrap .post-date {font-size: 11px; margin: 0;padding: 0;box-shadow: none;float: none;width: auto;} .post-list .post-info .post-data-wrap a {font-weight: 600;} /* Post Description */ .post-list .post-description {line-height: 21px;font-size: 13px;} /* Post View */ .post-list .post-view {display: block;background: #000;color: #fff;font-size: 10px;font-weight: 600;text-align: center;line-height: 11px;position: relative;top: -5px;padding: 4px 6px;} .post-list .post-view:after {position: absolute;left: 0;bottom: -3px;content: '';width: 0;height: 0;border-style: solid;border-width: 3px 3px 0 0;border-color: #000 transparent transparent;} /* Read More */ .post-read-more a.post-read {display: inline-block;color: #fff;background-color: #4db2ec;font-size: 13px;font-weight: 500;line-height: 1;padding: 10px 15px;} .post-read-more a.post-read:hover {color: #fff; text-decoration: none;} @media (max-width: 768px) { .post-list .post-item.post-holder {margin-bottom: 1.5rem;} } @media (max-width: 767px) { .post-list .post-image .post-category {display: none;} .post-list .post-info {padding: 0 0 0 15px;} .post-list.modern .post-description {display: none;} .post-read-more a.post-read {display: none;} } @media (max-width: 640px) { .post-list .post-info .post-title-wrap h3 a {font-size: 14px;font-weight: 600;line-height: 1.4;display: inline-block; /*max-height: 39px;overflow: hidden;*/} } /* Images Format *******************************************/ .post-image .image-wrap._16x9 {padding-bottom: 35% !important;} .post-image .image-wrap._4x3 {padding-bottom: 67% !important;} .post-image .image-wrap._3x2 {padding-bottom: 55% !important;} .post-image .image-wrap._1x1 {padding-bottom: 100% !important;} @media (max-width: 768px) { } /* Blog Post List *****************************************************************************************************/ /* Blog Post List Modern **********************************************************************************************/ .post-list.modern .post-item.post-holder {margin: 0 0 30px 0;padding: 0 0 30px 0;} .post-list.modern .post-info .post-title-wrap h3 a:hover {text-decoration: none;transition: all .2s ease;} .post-list.modern .post-info .post-data-wrap a:hover {text-decoration: none;transition: all .2s ease;} /* Blog Post List Modern **********************************************************************************************/ /* Post View **********************************************************************************************************/ /* Page Title */ /*.blog-post-view .page-title-wrapper .page-title {font-size: 35px;line-height: 1.2;margin-bottom: 20px;}*/ /* Category */ .blog-post-view .post-category a {display: inline-block;margin: 0 5px 0 0;padding: 5px 10px;background: #000;color: #fff;font-size: 11px;line-height: 12px;font-weight: 500;text-decoration: none;text-transform: uppercase;} /* Post Data */ .blog-post-view .post-data-wrap {font-size: 13px;font-family: sans-serif;margin-bottom: 30px;} .blog-post-view .post-data-wrap a {font-weight: 600;} .blog-post-view .post-data {color: #bbbbbb;} /* Post View */ /* Post Comments */ .blog-post-view .post-comments {margin-right: 20px;} /* Social */ .blog-post-view .post-sharing {margin-bottom: 20px;} /* Image */ .blog-post-view .post-featured-image {font-size: 0;margin-bottom: 20px;} /* Tags */ .blog-post-view .post-tag {margin-bottom: 20px;} .blog-post-view .post-tag .post-tag-title {display: inline-block;padding: 7px 12px;border: 1px solid #222;background: #222;color: #fff;line-height: 1;margin: 0 10px 10px 0;text-transform: uppercase;font-size: 11px;} .blog-post-view .post-tag .post-tags a {display: inline-block;border: 1px solid var(--border-color); /*color: #222; */background: #fff;padding: 7px 12px;margin-right: 10px;line-height: 1;font-weight: 600;letter-spacing: 1px;font-size: 11px;text-transform: capitalize;} .blog-post-view .post-tag .post-tags a.current, .blog-post-view .post-tag .post-tags a:hover {text-decoration: none;opacity: .9;background: #333;color: #fff;} /* Post Text */ .blog-post-view .post-description {margin-bottom: 30px;} .blog-post-view .post-description p {font-size: 1.4rem;line-height: 1.7;} /* Post Bottom *****************************************/ .post-view .post-bottom {margin-top:30px;} /* Post Sharing Bottom */ .post-view-modern .post-sharing-bottom {} .post-sharing-bottom {padding: 30px 0;margin-bottom: 30px;border-top: 1px solid var(--border-color);border-bottom: 1px solid var(--border-color);} .post-sharing-bottom .share-elements {text-align: center;} .post-sharing-bottom .share-elements .icon-wrapper {display: inline-block;cursor: pointer;margin: 0 5px 5px 0;overflow: hidden;border: 0;text-decoration: none;text-transform: none;background-color: transparent;color: inherit;transition: all .2s ease-in-out;border-radius: 0;} .post-sharing-bottom .share-elements .icon-wrapper.icon-facebook {background-color: rgb(59, 89, 152);} .post-sharing-bottom .share-elements .icon-wrapper.icon-twitter {background-color: rgb(0, 0, 0);} .post-sharing-bottom .share-elements .icon-wrapper.icon-pinterest {background-color: rgb(203, 32, 39);} .post-sharing-bottom .share-elements .icon-wrapper .icon {line-height: 48px;height: 48px;width: 48px;display: inline-block;overflow: hidden;vertical-align: top;} .post-sharing-bottom .share-elements .icon-wrapper .label {font-size: 13px;line-height: 48px;height: 48px;color: #ffffff;display: inline-block;padding: 0 15px 0 3px;vertical-align: top;} .post-sharing-bottom .share-elements .icon-wrapper:hover {transform: translateY(-4px);} /* Post Gallery */ /*.blog-post-view .post-gallery {display: flex;flex-wrap: wrap;}*/ .blog-post-view .post-gallery {display: grid;grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));grid-gap: 1rem;margin-bottom: 20px;} .blog-post-view .post-gallery .gallery-image-hld {display: inline-block;} .blog-post-view .post-gallery .gallery-image-hld img {} /* Post Navigation */ .blog-post-view .post-nextprev {display: flex;padding: 20px 0;margin-bottom: 30px;border-top: 1px solid var(--border-color);border-bottom: 1px solid var(--border-color);} .blog-post-view .post-nextprev .nextprev-link {display: block;font-size: 20px;/*color: #222222;*/font-weight: 600;text-align: right;opacity: 0.7;} .blog-post-view .post-nextprev .nextprev-link:hover {text-decoration: none;} .blog-post-view .post-nextprev .nextprev-link span {display: block;color: #bbbbbb;font-size: 14px;font-weight: normal;} /* Block Related */ .blog-post-view .post-bottom .block.related {margin-bottom: 0;} .blog-post-view .post-bottom .block.related .block-title {margin: 0 0 25px;padding: 5px 0;border-bottom: 1px solid #222222;line-height: 1.42857143;} .blog-post-view .post-bottom .block.related .block-title strong {border-bottom: 3px solid #222222;padding-bottom: 2px;font-weight: 400;font-size: 18px;} /* Related Posts */ .mfblog-related-posts-block.block.related .post-list {display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap; position: relative;overflow: hidden;margin-left: -10px;margin-right: -10px;} .mfblog-related-posts-block.block.related .post-list .post-item {-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;margin-bottom: 2rem !important;-ms-flex: 0 0 25%;flex: 0 0 25%;max-width: 25%;padding-left: 10px;padding-right: 10px;width: 25%; box-sizing: border-box;} .mfblog-related-posts-block.block.related .post-list .post-item .image-container { -ms-flex: 0 0;flex: 0 0;width: 100%;display: block;order: 0;margin-bottom: 10px;} .mfblog-related-posts-block.block.related .post-list .image-container .image-wrap {display: block;line-height: 0;overflow: hidden;position: relative;padding-bottom: 70%;} .mfblog-related-posts-block.block.related .post-list .image-container .image-wrap .bg-img {position: absolute;display: block;width: 100%;height: 100%;background-size: cover;background-position: center;} .mfblog-related-posts-block.block.related .post-list .post-item .block-info {padding-left: 0 !important;padding-right: 0 !important;} .mfblog-related-posts-block.block.related .post-list .block-info h3.post-title a {font-size: 14px !important;line-height: 20px !important;font-weight: 600 !important; /*color: #222222; */} @media (max-width: 767px) { .mfblog-related-posts-block.block.related .post-list .post-item {flex: 0 0 50%;max-width: 50%;} } /* Related Products */ .mfblog-related-products-block.block.related .block-title {margin: 0 0 25px;padding: 5px 0;border-bottom: 1px solid #222222;line-height: 1.42857143;} .mfblog-related-products-block.block.related .block-title strong {border-bottom: 3px solid #222222;padding-bottom: 2px;font-weight: 400;font-size: 18px;} /* Block Comments */ .block.comments .c-count {margin: 0 0 20px;padding: 0;border-bottom: 1px solid #222222;font-weight: 400;} .block.comments .c-count strong {border-bottom: 3px solid #222222;padding-bottom: 2px;font-weight: 400;font-size: 18px;display: inline-block;} /* END Post Bottom *************************************/ @media (max-width: 767px) { .blog-post-view .page-title-wrapper .page-title {font-size: 20px;} .blog-post-view .post-nextprev .nextprev-link {font-size: 14px;line-height: 1.4;} } /* END Post View ******************************************************************************************************/ /* Animation Zoom */ .image-wrap .animation-type-zoom {display: block;line-height: 0;overflow: hidden;position: relative;} .image-container .animation-type-zoom {-webkit-transition: transform .3s ease,opacity .3s;transition: transform .3s ease,opacity .3s;} .image-container:hover .animation-type-zoom {transform: scale3d(1.1,1.1,1); -webkit-transform: scale3d(1.1,1.1,1);} /* Sidebar ************************************************************************************************************/ /* Block Search */ .widget.blog-search {width:100%;margin-bottom: 40px;position: relative;float: right;} .widget.blog-search .block-content {margin-bottom: 0;} .widget.blog-search .block-content .form {position: relative;} .widget.blog-search label {border: 0;clip: rect(0, 0, 0, 0);height: 1px;margin: -1px;overflow: hidden;padding: 0;position: absolute;width: 1px;text-decoration: none;display: inline-block;float: right;} .widget.blog-search .control {border-top: 0;margin: 0;padding: 0;clear: both;} .widget.blog-search input {position: static;padding-right: 35px;margin: 0;left: -300%;} .widget.blog-search .action.search {position: absolute;top: 0;right: 0;bottom: 0;height: 100%;z-index: 1;display: inline-block;-moz-box-sizing: content-box;border: 0;box-shadow: none;line-height: inherit;margin: 0;padding: 0 10px;text-decoration: none;text-shadow: none;font-weight: 400;border-radius: 0;} .widget.blog-search .action.search:before {-webkit-font-smoothing: antialiased;content: '';margin: 0;vertical-align: top;display: inline-block;overflow: hidden;speak: none;width: 16px;height: 32px;background: url(../images/search-icon-white.svg) no-repeat -10px -7px;background-size: 35px;opacity: 1;} .widget.blog-search .action.search > span {border: 0;clip: rect(0, 0, 0, 0);height: 1px;margin: -1px;overflow: hidden;padding: 0;position: absolute;width: 1px;} .blog-search .actions .action.search {background: #222222;right: 0;padding: 0 10px;border-radius: 0;} /* Posts List */ .widget.block-list-posts .post-list .post-item .image-container {flex: 0 0 30%;width: 30%;display: block;order: 0;} /* Images */ /* Span Background */ .widget.block-list-posts .post-list .image-container .image-wrap {display: block;line-height: 0;overflow: hidden;position: relative;padding-bottom: 70%;} .widget.block-list-posts .post-list .image-container .image-wrap .bg-img {position: absolute;display: block;width: 100%;height: 100%;background-size: cover;background-position: center;} /* Post Info */ .widget.block-list-posts .post-list .post-item .block-info .post-item-name {font-size: 14px;line-height: 20px;font-weight: 600;text-decoration: none;color: #333333;} .widget.block-list-posts .post-list .post-item .block-info .block-date {color: #bbbbbb;} .widget.block-list-posts .post-list .post-item .block-info .block-date .post-data {font-size: 11px;} /* Post Grid */ .widget.block-list-posts .post-list .post-item {-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;margin-bottom: 2rem !important;} .widget.block-list-posts .post-list .post-item .image-container {-ms-flex: 0 0;flex: 0 0;width: 100%;display: block;order: 0;margin-bottom: 10px;} .widget.block-list-posts .post-list .post-item .block-info {padding-left: 0 !important;padding-right: 0 !important;} /* END Posts List */ /* New Post List */ .widget.block-posts-list .post-item {display: flex;gap: 1.5rem;} .widget.block-posts-list .post-item .image-container {flex: 0 0 33.333333%;width: 33.333333%;align-self: flex-start;display: block;order: 0;margin-bottom: 10px;} .widget.block-posts-list .post-item .image-container .image-wrap {display: block;position: relative;overflow: hidden;} .widget.block-posts-list .post-item .image-container .image-wrap._4x3 {padding-bottom: 70%;} .widget.block-posts-list .post-item .image-container .image-wrap .bg-img {display: block;position: absolute;width: 100%;height: 100%;max-width: 100%;background-size: cover;background-position: center;} .widget.block-posts-list .post-item .block-info .post-title {margin: 0 0 0.5rem 0 !important;} .widget.block-posts-list .post-item .block-info .post-title .post-item-name {display: block;font-size: 16px;line-height: 22px;font-weight: 500;text-decoration: none;-webkit-transition: all 300ms ease-in-out;-moz-transition: all 300ms ease-in-out;-o-transition: all 300ms ease-in-out;transition: all 300ms ease-in-out;} .widget.block-posts-list .post-item .block-info .block-date {line-height: 1rem;} .widget.block-posts-list .post-item .block-info .block-date .post-date {font-size: 11px;line-height: 1.2rem;color: #bbbbbb;font-family: sans-serif;} .widget.block-posts-list .post-item .block-info .post-description {display: none;line-height: 21px;font-size: 13px;} .widget.block-posts-list .post-item .block-info .read-more {display: none;} /* END New Post List */ /* Archive */ .widget.block-archive .archive-item-link {font-weight: 600} /* RSS Feed */ .widget.block-rss .rss-icon {width: 23px;filter: grayscale(100%);vertical-align: middle;} /* End Sidebar ********************************************************************************************************/