.main-contaier{ padding: 70px 0; } /*-------------------------- 1.HEADER ---------------------------*/ /*Header Top*/ .header-top{ border-bottom: 1px solid #eee; padding: 5px 0; } .header-top-content { display: flex; justify-content: space-between; align-items: center; } /*Top bar*/ .header-main{ display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 40px 0; } .header-main .header-social, .header-main .search-header{ width: 25%; min-width: 300px; } .header-main .search-header{ display: -webkit-flex; display: flex; justify-content: flex-end; } .social-network a{ display: inline-block; color: var(--color-headding); margin: 0 5px; } .footer-social a { width: 40px; height: 40px; line-height: 38px; text-align: center; border: 1px solid #eee; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; } .footer-social a:hover{ color: var(--recent-color); border-color: var(--recent-color); } .social-network a:first-child{margin-left: 0px;} .social-network a:last-child{margin-right: 0px;} .header-social a{margin: 0 8px} .search-header{margin-left: auto;} .search-header .searchform{ max-width: 280px; } .searchform{ display: -webkit-flex; display: flex; justify-content: space-between; } .searchform input[type="text"]{ border: none; padding: 5px 15px; min-width: 0; width: auto; background: transparent; } .searchform .button-search { padding: 0; width: 40px; height: 40px; text-align: center; line-height: 40px; background: transparent; color: var(--color-headding); border-left: 1px solid #eee; } /*Logo*/ .calanthalite-logo{ padding: 40px 0; } .calanthalite-logo .inner-logo{ text-align: center; max-width: 450px; margin: 0 auto; } /*Main Menu*/ .header-content{ border-top: 1px solid var(--color-headding); border-bottom: 1px solid var(--color-headding); text-align: center; } .calanthalite-main-menu{ padding: 0; } .calanthalite-main-menu li{ -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; position: relative; } .calanthalite-main-menu > li, div.calanthalite-main-menu > ul > li{ display: inline-block; font-size: 14px; } .calanthalite-main-menu > li > a, div.calanthalite-main-menu > ul > li > a{ font-family: var(--font-heading); font-weight: 600; color: var(--color-headding); text-transform: uppercase; line-height: 30px; display: inline-block; padding: 15px 1.5em; font-size: 12px; letter-spacing: 1px; } .calanthalite-main-menu > li:first-child, div.calanthalite-main-menu > ul > li:first-child{margin-left: 0} .calanthalite-main-menu > li:last-child, div.calanthalite-main-menu > ul > li:last-child{margin-right: 0} .calanthalite-main-menu a{ color: inherit; } .calanthalite-main-menu .sub-menu{ position: absolute; top: 100%; left: 0; opacity: 0; visibility: hidden; -webkit-transform: scaleY(0); -ms-transform: scaleY(0); -o-transform: scaleY(0); transform: scaleY(0); -webkit-transform-origin: center top; -moz-transform-origin: center top; -ms-transform-origin: center top; -o-transform-origin: center top; transform-origin: center top; -webkit-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; background: #fff; -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.1); box-shadow: 0 0 15px rgba(0,0,0,0.1); padding: 0; min-width: 200px; z-index: 50; text-align: left; border-top: 2px solid var(--recent-color); } .calanthalite-main-menu li:focus-within > .sub-menu, .calanthalite-main-menu li:hover > .sub-menu, .calanthalite-main-menu .show-submenu > .sub-menu, .calanthalite-main-menu .show-submenu > .children, .calanthalite-main-menu li:hover > .children, .calanthalite-main-menu li:focus-within > .children{ visibility: visible; -webkit-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1); height: auto; opacity: 1; } .calanthalite-main-menu .sub-menu .sub-menu{ top: -2px; left: 100%; } .calanthalite-main-menu .sub-menu li{ list-style: none; display: block; white-space: nowrap; } .calanthalite-main-menu .sub-menu li a{ padding: 1em 1.5em; border-bottom: 1px solid #eee; display: -webkit-flex; display: flex; justify-content: space-between; } .calanthalite-main-menu .sub-menu li a:hover, .calanthalite-main-menu .sub-menu li.current_page_item > a{ color: var(--recent-color); } .calanthalite-main-menu .sub-menu li:last-child > a{ border-bottom: none; } .calanthalite-main-menu > li > a:hover, div.calanthalite-main-menu > ul > li > a:hover, .calanthalite-main-menu > li.current_page_item > a, div.calanthalite-main-menu > ul > li.current_page_item > a, .calanthalite-main-menu > li:focus-within > a, div.calanthalite-main-menu > ul > li:focus-within > a{ color: #fff; background: var(--recent-color); outline: none; } .calanthalite-main-menu div.icon-dropdown { display: inline-block; padding-left: 5px; font-size: 14px; line-height: 28px; } /*-------------------------------- 2.MAIN CONTAINER ---------------------------------*/ /*-------- 2.3 Page -----*/ .wrapper-main-content .has-sidebar{ padding-right: 50px; } .page-title{margin-bottom: 40px} .page-title:after{ content: ""; display: block; width: 50px; height: 2px; background: var(--recent-color); margin: 15px auto 0; } .page-image{margin-bottom: 30px;} .page-excerpt ul{margin-bottom: 30px} .wpcf7-form .wpcf7-form-control-wrap{ margin-bottom: 30px; display: inline-block; width: 100%; } .calanthalite-page-error{ text-align: center; max-width: 850px; margin: 0 auto; padding: 70px 0; } /*-------- 2.4 BLog -----*/ .post-title a{color: inherit;} .post-title{ margin-bottom: 10px; font-size: 35px; } .post-title a{ color: inherit; } .post-title a:hover{color: var(--recent-color)} .calanthalite-blogs .post { margin-bottom: 50px; } /*Post date, post format*/ .post-header{ position: relative; } .post-header .date-post{ background: var(--recent-color); color: #fff; padding: 7px 12px; display: inline-block; } .has-post-thumbnail .post-header .date-post, .post.item-relate .post-header .date-post{ position: absolute; left: 0; top: 0; z-index: 2; } .post-header .date-post span{ display: block; line-height: 20px; } .post-header .date-post .day{ font-weight: 600; line-height: 1em; font-size: 24px; } .post-header{ margin-bottom: 30px; } .post .post-format a.post-image{ display: block; background-color: #f5f5f5; } /*Post meta*/ .post-meta{margin-bottom: 25px} .post-meta .calanthalite-like-post{font-size: 14px;} .post-meta div{ display: inline-block; padding-right: 15px; font-size: 14px; } .post-meta i{ margin-right: 6px; font-size: 12px; } .post-meta div:last-child{ padding-right: 0; } .post-meta a{color: inherit;} /*Post share, tags, cats*/ .post-footer{ display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; margin-top: 25px; } .post-cats{margin-bottom: 10px;} .post-tags a, .post-cats a{ font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-headding); font-weight: 600; } .post-tags a:hover, .post-cats a:hover{ color: var(--recent-color); } .post-tags i, .post-cats i{ color: var(--recent-color); margin-right: 11px; font-size: 13px; } .post-share a{ display: inline-block; margin-left: 20px; font-size: 14px; } .post-share span{color: var(--color-headding);font-weight: 600;} /*Blog Standard*/ .blog-standard .post { margin-bottom: 70px; } /*Blog Grid - Masonry*/ .blog-grid .post-title{ font-size: 22px; } /*Pagination*/ .pagination .screen-reader-text{display: none;} .pagination .page-numbers{ display: inline-block; width: 40px; height: 40px; border:1px solid #ddd; color: var(--color-headding); line-height: 38px; text-align: center; margin-right: 10px; } .pagination .page-numbers:hover, .pagination .page-numbers.current{ color: #fff; background: var(--recent-color); border-color: var(--recent-color); } /*----------2.5 Single Post----------*/ .post-related .post-title{ font-size: 16px; } .post-related .post-cats{margin-bottom: 10px} .calanthalite-single-post .post-footer{ padding: 10px 0; border-top: 1px solid #eee; border-bottom: 1px solid #eee; } .post-related, .comment-respond, .comments-area{margin-top: 50px;} .post-related-title,.comment-reply-title, .comments-title{font-size: 26px;} .comment-form .input-form, .comment-form .textarea-form{margin-bottom: 30px} .comment-form input[type="checkbox"]{margin-right: 10px} .comment-list{ padding: 0; list-style: none; } .comment-body{margin-bottom: 30px;} .comment-body .comment-author{ float: left; margin-right: 20px; } .comment-body .comment-content{ overflow: hidden; } .comment-content .author-name{ font-size: inherit; display: inline-block; margin-bottom: 0px; } .comment-content .date-comment{ font-size: 12px; display: inline-block; margin-left: 10px; } .comment-content .date-comment a{color: inherit;} .comment-content .reply{ float: right; } .comment-content .reply .comment-reply-link:after{ content: "\f3e5"; display: inline-block; margin-left: 5px; font-family: 'Font Awesome 5 Free'; font-weight: 900; } .comment-content .comment-text { margin-top: 15px; } .comment-list ol.children{ list-style: none; } .comment-respond .logged-in-as{margin-bottom: 10px} /*--------- 2.6 Widget -----------*/ .widget-title { text-transform: capitalize; font-size: 20px; text-align: center; } .sidebar .widget-title:after{ content: ""; width: 45px; height: 2px; display: block; background-color: var(--recent-color); margin: 15px auto 0; } .widget_block .wp-block-group{ display: flex; } .widget ul{padding: 0} .widget ul ul,.widget ol ol{padding-left: 20px} .widget ul li{ list-style: none; } .wpb_widgetised_column .widget, .sidebar .widget{ margin-bottom: 50px; } .wpb_widgetised_column .widget:last-child, .sidebar .widget:last-child{ margin-bottom: 0 } .widget_recent_entries li a, .widget_archive li a,.widget_recent_comments li a, .widget_categories li a, .widget_meta li a, .widget_pages li a, .widget_nav_menu li a{ color: inherit; display: inline-block; } .widget_recent_entries li a:hover, .widget_archive li a:hover,.widget_nav_menu li a:hover, .widget_categories li a:hover, .widget_meta li a:hover, .widget_pages li a:hover, .widget_recent_comments li a:hover{ color: var(--recent-color); } .widget_recent_entries li, .widget_archive li, .widget_categories li, .widget_meta li, .widget_pages li, .widget_nav_menu li, .widget_recent_comments li{ line-height: 40px; border-bottom: 1px solid #eee; } .widget_recent_entries li:last-child, .widget_archive li:last-child, .widget_categories li:last-child, .widget_meta li:last-child, .widget_pages li:last-child, .widget_nav_menu li:last-child,.widget_recent_comments li:last-child{ border-bottom: none; } .widget_rss li{margin-bottom: 20px;} .widget_rss li cite:before{ content: ""; width: 20px; height: 1px; background: #999; display: inline-block; margin-right: 5px; } .widget_rss li .rsswidget{display: block;} .widget_rss li .rss-date{font-style: italic;} .tagcloud a, .tag-cloud-link{ font-size: 13px !important; color: inherit; border: 1px solid #eee; padding: 3px 20px; border-radius: 25px; margin: 0 5px 10px 0; display: inline-block; } .tagcloud a:hover, .tag-cloud-link:hover{ background: var(--recent-color); border-color: var(--recent-color); color: #fff; } .widget_media_gallery .gallery{margin: 0 -5px} .widget_media_gallery .gallery .gallery-item{ margin-bottom: 0; border: none; padding: 0 5px; } .widget_media_gallery .gallery .gallery-item img{border: none!important;} /*Category Image*/ .list-cats-image li{ list-style: none; margin-bottom: 20px; padding: 20px; color: #fff; background-size: cover; background-repeat: no-repeat; background-position: center; position: relative; } .list-cats-image li:after{ content: ""; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(0,0,0,0.2); } .list-cats-image .cat-count { background: var(--color-headding); color: #fff; position: absolute; top: 0; bottom: 0; right: 0; padding: 0 15px; display: flex; align-items: center; z-index: 2; } .list-cats-image .cat-name { position: relative; z-index: 2; color: #fff; text-transform: uppercase; font-weight: 600; letter-spacing: 2px; } /*widget-blog-list*/ .widget-blog-list .post{ margin-bottom: 20px; overflow: hidden; } .widget-blog-list .post:last-child{margin-bottom: 0;} .widget-blog-list .post-title{ font-size: 14px; letter-spacing: 0; text-transform: capitalize; } .widget-blog-list .post-image{ float: left; margin-right: 20px; margin-bottom: 0; position: relative; width: 110px; } .widget-blog-list .post-content{overflow: hidden;} .widget-blog-list .date-post{display: block;} .widget-blog-list .big-post .post-image{ float: none; width: 100%; margin-bottom: 15px; } .widget-blog-list .big-post .post-content{ display: block; width: 100%; } .widget-blog-list .post-image .number { position: absolute; left: 0; bottom: 0; width: 25px; height: 25px; line-height: 25px; background: var(--color-headding); color: #fff; text-align: center; font-size: 12px; } /*Newsletter*/ .form-newsletter input[type="email"]{ margin-bottom: 20px; } .calanthalite-newsletter{ text-align: center; padding: 25px 20px; background: #eee; } .calanthalite-newsletter button[type="submit"]{width: 100%} /* Latest post */ .wp-block-latest-posts__list .wp-block-latest-posts__post-title{ font-weight: var(--font-weight-heading); font-family: var(--font-family); line-height: 30px; display: block; } .wp-block-latest-posts__post-author, .wp-block-latest-posts__post-date{ font-size: 14px; display: inline-block; margin-right: 5px; } .wp-block-latest-posts__list .wp-block-latest-posts__post-author + .wp-block-latest-posts__post-date:before{ content:"-"; display: inline-block; margin-right: 5px; } .wp-block-latest-posts__featured-image.alignleft, .wp-block-latest-posts__featured-image.alignright{ margin-bottom: 0; } .wp-block-latest-posts.wp-block-latest-posts__list li{ border-bottom: none; margin-bottom: 20px; } /*------------------------------- FOOTER -------------------------------*/ .ab-signature img{max-width: 160px} .footer-ins .widget-title{ text-align: center; padding: 30px 0; margin-bottom: 0; text-transform: uppercase; letter-spacing: 0.2em; } #calanthalite-footer{border-top: 1px solid #eee;} .logo-footer img{ max-width: 50%; } .main-footer { padding: 45px 0 50px; text-align: center; } .footer-copyright{ background: #f5f5f5; padding: 25px 0; text-align: center; border-top: 1px solid #eee; } .tag-line{ font-size: 14px; color: var(--color-text); line-height: normal; display: block; text-transform: none; font-weight: 300; letter-spacing: 0 } .footer-social{margin-top: 20px;} /*-------------------------------- 4.RESPONSIVE --------------------------------*/ /*MENU MOBILE*/ .admin-bar .calanthalite-menu-touch{top: 32px;} @media (max-width: 783px){ .admin-bar .calanthalite-menu-touch{top: 46px;} } .menu-toggle span{ width: 23px; height: 2px; background: var(--color-headding); margin: 3px 0; display: block; } .mobile-header .header-content-mobile{ display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--color-headding); border-top: 1px solid var(--color-headding); } .mobile-header .calanthalite-logo{ margin: 0 auto; padding: 25px 0; } .navbar-toggle span{ display: block; width: 20px; height: 2px; background: var(--color-headding); margin: 4px 0; -webkit-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } @media (min-width : 1330px){ .container{ max-width: 1300px } } @media (min-width: 992px) and (max-width: 1199.98px){ .post-tags {width: 100%; margin-bottom: 10px;} .wrapper-main-content .has-sidebar{padding-right: 30px;} .header-social a{margin: 0 5px;} .search-header .searchform{max-width: 250px} .calanthalite-logo .inner-logo{max-width: 35%} } @media (max-width: 991.98px){ .main-contaier{padding: 40px 0 50px} .calanthalite-logo img{max-width: 350px} .search-header .searchform input[type="text"] {max-width: 200px;} .header-content{position: relative;} .sidebar{margin-top: 50px;} .wrapper-main-content .has-sidebar{padding-right: 15px;} div.calanthalite-main-menu > ul, ul.calanthalite-main-menu{ display: flex; flex-direction: column; } .header-content .icon-touch{ display: flex; justify-content: center; padding: 10px 0; } .main-menu-horizontal { position: absolute; top: 100%; display: none; width: 100%; left: 0; background: #fff; z-index: 5; margin-top: 1px; } .calanthalite-main-menu li a{ display: flex; justify-content: space-between; border-bottom: 1px solid #eee; } .calanthalite-main-menu .sub-menu{ position: relative; box-shadow: none; height: 0; border-top: none; } .calanthalite-main-menu .sub-menu .sub-menu { top: 0; left: 0; padding-left: 25px; } .calanthalite-main-menu div.icon-dropdown{ width: 30px; text-align: right; } } @media (min-width: 768px) and (max-width: 991.98px){} @media (max-width: 767.98px){} @media (max-width: 575.98px){ .post-tags {width: 100%;margin-bottom: 10px;} }