/* Archive */
.entry-title {
font-size: 22px;
line-height: 1.5;
a {
color: inherit;
display: block;
&:hover {
color: #555;
}
}
}
.entry-date {
position: absolute;
top: 18px;
left: 18px;
width: 60px;
min-width: 60px;
height: 70px;
background-color: $primary_color;
text-align: center;
color: #fff;
span {
display: block;
}
span:nth-child(1) {
font-size: 24px;
font-weight: 700;
@include font-family-heading($heading_default_font);
height: 40px;
line-height: 40px;
}
span:nth-child(2) {
height: 30px;
line-height: 30px;
background-color: $secondary_color;
font-size: 14px;
}
}
.entry-meta, .item--meta-default {
margin-bottom: 0;
list-style: none;
display: flex;
flex-wrap: wrap;
font-size: 14px;
line-height: 24px;
color: #939393;
@include font-family-heading($heading_default_font);
li {
margin-right: 20px;
&:last-child {
margin-right: 0;
}
&.item-author {
text-transform: capitalize;
}
}
i {
margin-right: 4px;
}
a {
color: inherit;
&:hover {
color: inherit;
}
}
}
.single-hentry.archive {
margin-bottom: 50px;
@include box-shadow(0 6px 24px rgba(#0b0b0b, 0.08));
border: 1px solid #eeeeef;
@include border-radius(4px);
overflow: hidden;
background-color: #fff;
display: flex;
flex-wrap: wrap;
@include transition(all 300ms linear 0ms);
.entry-featured {
position: relative;
overflow: hidden;
min-height: 300px;
width: 52%;
@media #{$mm-lg} {
width: 48%;
}
@media #{$max-xs} {
width: 100%;
}
a {
display: block;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
img {
opacity: 0;
position: absolute;
z-index: -999;
}
&:hover {
@include transform(scale(1.1) rotate(3deg));
}
}
+ .entry-body {
width: 48%;
@media #{$mm-lg} {
width: 52%;
}
@media #{$max-xs} {
width: 100%;
}
}
}
.entry-excerpt {
font-size: 15px;
line-height: 26px;
margin-bottom: 7px;
}
.entry-body {
padding: 30px;
display: flex;
flex-wrap: wrap;
align-items: center;
.entry-title {
margin-bottom: 7px;
}
.entry-meta {
margin-bottom: 16px;
}
}
&:hover {
@include box-shadow(0 21px 51px rgba(#0b0b0b, 0.11));
}
}
/* End Archive */
/* Single Details */
.single-post {
.site-content {
background-repeat: no-repeat;
background-position: top left;
}
.gallery {
margin-top: 0;
margin-left: -15px;
margin-right: -15px;
.gallery-item {
padding: 0 15px;
img {
@include border-radius(7px);
}
}
}
.single-title {
font-size: 26px;
margin-bottom: 14px;
}
.entry-featured {
position: relative;
img {
width: 100%;
}
}
.entry-meta {
display: flex;
flex-wrap: wrap;
align-items: center;
margin: 0 0 37px;
list-style: none;
border-bottom: 1px solid #ececf0;
padding-bottom: 16px;
position: relative;
&:before {
content: '';
width: 40px;
height: 3px;
@include background-horizontal($gradient_color_from, $gradient_color_to);
position: absolute;
bottom: -1px;
left: 0;
@include box-shadow(0 7px 16px rgba(#0c0c0c, 0.22));
}
li {
font-size: 15px;
line-height: 20px;
margin-right: 0;
&:after {
content: '/';
margin: 0 8px;
}
&:last-child {
&:after {
display: none;
}
}
}
}
.entry-category {
display: flex;
flex-wrap: wrap;
position: absolute;
bottom: 30px;
right: 35px;
a {
padding: 0 22px;
line-height: 40px;
color: #fff;
font-size: 15px;
font-weight: 600;
margin-left: 4px;
@include border-radius(4px);
@include background-gradient-button(90deg, $gradient_color_from 0%, $gradient_color_to 50%, $gradient_color_from);
background-size: 300%, 1px;
background-position: 0%;
color: #fff;
@include box-shadow(0 8px 9px rgba($secondary_color, 0.34));
&:hover, &:focus {
background-position: 100%;
}
}
}
.entry-body {
width: 100%;
padding: 32px 32px 40px 32px;
@media #{$max-xs} {
padding-left: 20px;
padding-right: 20px;
}
}
.entry-blog {
border: 1px solid #e8edf5;
@include border-radius(7px);
background-color: #fff;
overflow: hidden;
}
.entry-content {
p {
margin-bottom: 24px;
&:last-child {
margin-bottom: 0;
}
}
}
.entry-footer {
margin-top: 55px;
padding-bottom: 20px;
border-bottom: 1px solid #ececf0;
display: flex;
flex-wrap: wrap;
align-items: center;
> div {
margin-bottom: 10px;
}
label {
font-size: 15px;
font-weight: 500;
color: #222222;
margin-right: 17px;
}
.entry-tags {
flex-grow: 1;
}
.entry-social {
a {
font-size: 18px;
height: 32px;
width: 32px;
background-color: $primary_color;
@include border-radius(32px);
line-height: 32px;
text-align: center;
color: #fff;
display: inline-block;
&.fb-social {
background-color: #3b5998;
}
&.tw-social {
background-color: #55acee;
}
&.g-social {
background-color: #dd4b39;
}
&.pin-social {
background-color: #bd081c;
}
&.in-social {
background-color: #0077B5;
}
+ a {
margin-left: 2px;
}
}
}
}
}
.entry-tags, .comment-reply, .ct-navigation-menu1.default li, .item--download {
a {
position: relative;
overflow: hidden;
z-index: 1;
&:before, &:after {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
@include border-radius(inherit);
z-index: -1;
@include transition(all 300ms linear 0ms);
}
&:before {
background-color: #f0f0f0;
}
&:after {
@include background-horizontal($gradient_color_from, $gradient_color_to);
opacity: 0;
}
&:hover {
color: #fff;
&:before {
opacity: 0;
}
&:after {
opacity: 1;
@include transform(translateX(0%));
@include transition(all 180ms linear 0ms);
}
}
}
}
.entry-tags {
display: flex;
flex-wrap: wrap;
align-items: center;
a {
font-size: 15px;
color: #222222;
display: inline-block;
line-height: 40px;
padding: 0 22px;
@include border-radius(7px);
margin: 5px 5px 5px 0;
}
}
.post-previous-next {
display: flex;
flex-wrap: wrap;
align-items: center;
border-bottom: 1px solid #ececf0;
padding: 21px 0;
.post-previous {
flex-grow: 1;
margin-right: 30px;
}
a {
font-size: 15px;
font-weight: 600;
position: relative;
@include transition(all 0ms linear 0ms);
span {
color: #222222;
display: inline-block;
&:nth-child(1) {
@extend .text-gradient;
@include background-horizontal($gradient_color_from, $gradient_color_to);
opacity: 0;
}
&:nth-child(2) {
position: absolute;
top: 50%;
left: 50%;
@include transform(translate(-50%, -50%));
width: 100%;
}
}
&:hover {
color: #3a505f;
span {
&:nth-child(1) {
opacity: 1;
}
&:nth-child(2) {
opacity: 0;
}
}
}
}
}
/* End Single Details */
.entry-content .page-links {
clear: left;
padding-top: 10px;
span {
text-align: center;
display: inline-block;
height: 26px;
width: 26px;
line-height: 26px;
color: #fff;
@include border-radius(26px);
background-color: $primary_color;
font-size: 14px;
font-weight: 500;
margin: 0 3px;
@include transition(all 0.3s cubic-bezier(0.39, 0.575, 0.565, 1) 0s);
}
a span {
background-color: #e0e3e8;
color: #000;
&:hover {
background-color: $primary_color;
color: #fff;
}
}
.post-page-numbers {
margin: 0 3px;
span {
margin: 0;
}
}
}
.single-post, .page-template-blog-classic {
#primary.col-12 {
max-width: 840px;
margin: auto;
}
}
.post-type-archive-portfolio, .post-type-archive-service, .post-type-archive-case-study, .tax-portfolio-category, .tax-service-category, .tax-case-study-category {
#primary.col-12 {
max-width: 960px;
margin: auto;
}
}
.posts-pagination {
margin-bottom: -10px;
.posts-page-links {
display: flex;
flex-wrap: nowrap;
justify-content: center;
}
.page-numbers {
text-align: center;
height: 51px;
width: 51px;
line-height: 51px;
font-size: 15px;
font-weight: 600;
color: #222;
background-color: #fff;
display: inline-block;
margin: 0 6px 10px 6px;
@include border-radius(6px);
@include transition(all 300ms linear 0ms);
position: relative;
z-index: 1;
&:before, &:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
@include transition(all 300ms linear 0ms);
}
&:before {
border: 2px solid #eeecec;
@include border-radius(51px);
z-index: -2;
}
&:after {
@include background-horizontal($gradient_color_from, $gradient_color_to);
@include border-radius(51px);
z-index: -1;
opacity: 0;
}
&.current, &:hover, &:focus {
color: #fff;
&:before {
opacity: 0;
}
&:after {
opacity: 1;
}
}
&.next, &.prev {
font-size: 18px;
}
}
}
.entry-navigation {
border-bottom: 1px solid #ececf0;
padding: 29px 0 29px;
.nav-post-img {
width: 70px;
min-width: 70px;
margin-right: 20px;
margin-top: 6px;
img {
@include border-radius(0px);
}
}
.nav-links {
display: flex;
flex-wrap: wrap;
align-items: center;
margin: 0 -15px;
}
.nav-item {
display: flex;
flex-wrap: nowrap;
width: 50%;
padding: 0 15px;
@media #{$min-md} {
&.nav-post-next {
flex-direction: row-reverse;
text-align: right;
.nav-post-img {
margin-right: 0;
margin-left: 20px;
}
}
}
@media #{$max-xs} {
width: 100%;
align-items: flex-start;
+ .nav-item {
margin-top: 30px;
}
}
}
.nav-post-meta {
label {
font-size: 13px;
display: block;
margin-bottom: 3px;
}
a {
font-size: 19px;
line-height: 23px;
font-weight: 700;
@include font-family-heading($heading_default_font);
color: #0e0e0e;
&:hover {
color: $primary_color;
}
}
}
}
/* 404 Page */
body.error404 .site-content {
background-image: url(../images/bg-404.jpg);
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
}
.error-404 {
max-width: 820px;
padding: 0 15px 150px 15px;
margin: auto;
text-align: center;
@media #{$max-sm} {
padding-bottom: 100px;
}
.btn {
padding: 0 39px;
font-size: 16px;
line-height: 65px;
}
.error-404-content {
margin: 0 -30px;
display: flex;
flex-wrap: wrap;
align-items: center;
> div {
padding: 0 30px;
}
.error-404-holder {
flex-grow: 1;
}
.error-404-title {
font-size: 60px;
line-height: 1;
margin-top: 6px;
margin-bottom: 26px;
@media #{$max-sm} {
font-size: 45px;
}
}
.error-404-sub {
margin-bottom: 350px;
span {
font-size: 26px;
color: #0e0e0e;
background-color: #e7ecf3;
display: inline-block;
@include border-radius(4px);
padding: 0 30px;
line-height: 57px;
@media #{$max-sm} {
font-size: 18px;
}
}
}
}
}
body.error404.site-404-custom .site-content {
background-image: none;
}
.elementor_library-template-default {
.entry-meta, .entry-footer, .post-previous-next, #secondary {
display: none;
}
#content #primary {
padding-left: 15px;
padding-right: 15px;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
}
.no-results .searchform-wrap {
position: relative;
.search-submit {
position: absolute;
top: 0;
right: 0;
@include border-radius(0px);
}
} |