#blog-page-content {
position: relative;
box-sizing: border-box;
width: 100%;
margin: 0 auto;
opacity:0;
}
.blog-template-content #hero {
z-index:0;
}
article {
position:relative;
display:block;	
width:100%;
margin:0 auto;
}
.article-wrap {
position:relative;
display:block;
box-sizing:border-box;
opacity:1;
}
.active .article-wrap {
opacity: 1;
}
.article-content {
display: block;
position: relative;
}
article .hover-reveal {
position: relative;
width: 100%;
height: auto;
pointer-events: initial;
opacity: 1;
}
article .post-title {
font-weight:500;
font-size: 48px;
line-height: 64px;	
-ms-word-wrap: break-word;
word-wrap: break-word;
word-wrap: anywhere;
text-align:left;
box-sizing:border-box;
padding:0;
}
.entry-meta-wrap {
position:relative;
display:block;
box-sizing:border-box;
width:100%;
}
.entry-meta-wrap::after {
clear: both;
content: " ";
display: table;
}
.entry-meta {
position:relative;
display:block;
box-sizing:border-box;
padding:0;
margin:0;
margin-bottom:20px;
overflow:hidden;
}
.entry-meta ul {
position:relative;
display:block;
box-sizing:border-box;
padding:0;
margin:0;
}
.entry-meta li {
position:relative;
display:inline-flex;
line-height:28px;		
list-style:none;
padding:0;
margin:0;
margin-right: 10px;	
}
.uppercase-text .entry-meta li {
text-transform: uppercase;
}
.entry-meta li:last-child {
margin-right:0;
}
.entry-meta li:hover::after {
opacity:1;
}
.entry-meta li a {
color:#000;
display:inline-block;		
overflow:hidden;
opacity:1;
font-size: 16px;
line-height: 30px;
font-weight: 500;
}
.light-content .entry-meta li a {
opacity:1;
}
.light-content .entry-meta li a, .light-content .entry-meta li {
color:#fff;
}
.entry-meta li a:hover {
opacity:1;
}
.entry-meta li a span {
position: relative;
display: block;
-webkit-transition: -webkit-transform 0.2s;
transition: transform 0.2s;
transform-origin: 100% 0%;
}
.entry-meta li a span::before {
position: absolute;
top: 100%;
width:100%;
left:0;
content: attr(data-hover);
}
.entry-meta li:hover a span {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
transform-origin: 0% 0%;
}
.entry-categories li::after {
content: ",";
width: 10px;
height: 10px;
top:0px;
right: -11px;
opacity:1;
position: absolute;
border-radius: 10px;
}
.entry-categories li:last-child:after {
display:none;
}
.entry-tags li:first-child {
width: 30px;
position: relative;
color: transparent;
margin-right:10px;
overflow:hidden;
}
.entry-tags li {
margin-right:20px;
}
.entry-tags li:first-child:after {
font: var(--fa-font-solid);
content: "\f02b";
width:20px;
height:28px;
font-size:18px;
line-height:28px;
text-align:left;
position:absolute;
left:0px;
top:2px;
color:#000;
}
.light-content .entry-tags li:first-child:after {
color:#fff;
}
.page-links {
position:relative;
padding:0;
margin:0;
margin-top:20px;
clear: both;
}
.post-page-numbers {
background-color: rgba(0,0,0,0.1);
display: inline-block;
height: 28px;
width: 28px;
text-align: center;
line-height: 30px;
border-radius: 3px;
-webkit-transition: background-color 0.15s ease-in-out;
transition: background-color 0.15s ease-in-out;
}
.post-page-numbers:hover {
background-color: rgba(0,0,0,0.2);
}
.light-content .post-page-numbers {
background-color: rgba(255,255,255,0.1);
}
.light-content .post-page-numbers:hover {
background-color: rgba(255,255,255,0.2);
}
.post-page-numbers:first-child {
margin-left:10px;
}
.post-page-numbers::before {
display:none;
}
.search_results {
text-align:center;
margin-bottom:100px;
}
.post.sticky {
background-color: rgba(0,0,0,0.05);
}
.light-content .post.sticky {
background-color: rgba(255,255,255,0.05);
}
.blog-excerpt {
padding-top:20px;
} #blog-effects {
position: relative;
z-index: 15;
width: 100%;
box-sizing: border-box;
margin: 0 auto;
}
#blog-effects article {
display: flex;
width:100%;
box-sizing:border-box;
padding:0;
pointer-events: initial;
opacity: 1;
}
#blog-effects.clapat-blog-expand-on-scroll  article {
pointer-events: none;
opacity: 0.2;
}
#blog-effects article.in-view {
pointer-events: initial;
}
article::after {
clear: both;
content: " ";
display: table;
}
#blog-effects article .article-bg {
position: relative;
display: flex;
width: 100%;
justify-content: center;
padding-top:6vw;
padding-bottom:5vw;
border-bottom: 1px solid rgba(0,0,0,0.1);
}
#blog-effects article:first-child .article-bg {
border-top: 1px solid rgba(0,0,0,0.1);
}
.light-content #blog-effects article .article-bg {
border-bottom: 1px solid rgba(255,255,255,0.15);
}
.light-content #blog-effects article:first-child .article-bg {
border-top: 1px solid rgba(255,255,255,0.15);
}
.news-shortcode #blog-effects article:first-child .article-bg {
border-top: none!important;
}
.news-shortcode #blog-effects article:last-child .article-bg {
border-bottom: none!important;
}
article .hover-reveal {
position: fixed;
width:440px;
height: 280px;
left:auto;
right:auto;
pointer-events: none;
opacity:0;
z-index:0;
}
.article-wrap .hover-reveal::after {
display: block;
content: "";
clear: both;
}
.rounded-borders #blog-effects .article-wrap .hover-reveal {
border-radius:8px;
}
.article-wrap .hover-reveal__inner {
width: 100%;
height: 100%;
transform: translateX(0);
-webkit-transform: translateX(0);
position: relative;
}
article .hover-reveal img {
object-position: center;
object-fit: cover;
width: 100%;
height: 100%;
}
article:hover .hover-reveal img {
-webkit-transform:scale(1);
transform: scale(1);			
}
.article-wrap {
position: relative;
box-sizing: border-box;
display: block;
width: calc(50% - 80px);
display: flex;
flex-direction: column;
align-content: center;
}
.article-show-image {
position: relative;
display: table;
width: auto;
margin: 0 auto;
}
.article-content {
width: 100%;
box-sizing: border-box;
padding-top: 5px;
position:absolute;
display: flex;
justify-content: space-between;
}
article .content-max-width {
margin:0 auto;
z-index:10;
position:relative;
}
article .post-title {
position:relative;
width:auto;
font-weight:500;
font-size: calc(1rem + 1vw);
line-height: calc(1rem + 1.6vw);
text-align: center;
display: block;
-webkit-transition: all 0.6s cubic-bezier(0.38, 0.005, 0.215, 1);
transition: all 0.6s cubic-bezier(0.38, 0.005, 0.215, 1);
max-width: 100%;
z-index:10;
}
a.post-title.link::before {
display:none;
}
article .entry-meta-wrap {
padding-top: 0px;
width: 25%;
font-size: 14px;
line-height: 28px;
top: 0;
z-index: 0;
height: auto;
padding-right: 20px;
}
article .entry-date {
width: auto;
text-align: right;
margin-top:0px;
margin-bottom:0px;
}
article .entry-categories {
width: 100%;
float: none;
margin-top:0px;
margin-bottom:0px;
}
article .button-box {
margin: auto;
margin-top:40px;		
}
#hero .entry-meta li {
opacity: 0;
transform: translateY(30px);
-webkit-transform: translateY(30px);
}
article .article-links {
position: relative;
width: 100%;
box-sizing: border-box;
text-align: left;
overflow: hidden;
height: 0;
}
.page-links {
box-sizing: border-box;
}
article .page-links {
margin-top:0;
}
article .page-links p {
margin-top:20px;
margin-bottom:0px;
}
.blog-excerpt a {
display:none;
}
.read-more {
width: 40px;
height: 40px;
top:30px;
right:30px;
display: flex;
position: absolute;
justify-content: center;
align-items: center;
opacity:0.15;
-webkit-transition: opacity 0.15s ease-in-out;
transition: opacity 0.15s ease-in-out;
}
.read-more:hover {
opacity:1;
}
#blog-effects article.has-post-thumbnail .read-more {
display:none;
}
.read-more .parallax-element {
height: 40px;
width: 40px;
color: #fff;
text-align: center;
line-height: 40px;
font-size: 18px;
background-color:#000;
border-radius:40px;
}
.light-content .read-more .parallax-element {
color: #000;
background-color:#fff;
} #blog-page-nav {
position:relative;
display:table;
width: 100%;
box-sizing:border-box;
padding-top:100px;
padding-bottom:100px;
margin:0;
}
#blog-page-nav-wrap.content-max-width {
box-sizing: border-box;
padding-left: 0px;
padding-right: 0px;
max-width: 1280px;
}
.page-numbers {
text-align:center;
font-size: clamp(48px, 8.5vw, 130px);
line-height: clamp(48px, 8.5vw, 130px);
font-weight: 500;
letter-spacing: -0.2vw;
padding:0;
margin:0;
}
.page-numbers li {
display:inline-block;
list-style:none;
min-width: 1vw;
text-align: center;
color:#000;
padding-right:10px;
margin:0;
}
.light-content .page-numbers li {
color:#fff;
}
.page-numbers li:last-child {
padding-right: 0px;
display:inline-block;
}
.page-numbers li .page-numbers.dots {
opacity:0.5;
}
.page-numbers li a {
position: relative;
display: block;
opacity:0.5;
}
.uppercase-titles .page-numbers li a {
text-transform: uppercase;
}
.light-content .page-numbers li a {
position: relative;
display: block;
}
.page-numbers:hover li a:hover {
opacity:1;		
}
.page-numbers li a:before {
display:none;
}
.prev.page-numbers {
margin-left: 2px;
margin-right: 10px;
text-align: left;
}
.next.page-numbers {
margin-left:10px;
}
#blog-nav-minimal {
position:relative;
display:table;
width:500px;
height:auto;
box-sizing:border-box;
padding:0;	
}
#blog-nav-minimal::after {
content: "";
width: 80px;
height: 1px;
background-color: #000;
opacity:0.1;
position: absolute;
top: 50%;
left: 0;
right: 0;
margin: 0 auto;
display: block;
}
.light-content #blog-nav-minimal::after {
background-color: #fff;
opacity:0.15;
}
.blog-prev-wrap, .blog-next-wrap {
width: 80px;
height: 80px;
display: flex;
position: relative;
justify-content: center;
align-items: center;
float:left;
overflow:hidden;
z-index:1;
-webkit-transition: width 0.2s ease-in-out, opacity 0.2s ease-in-out;
transition: width 0.2s ease-in-out, opacity 0.2s ease-in-out;		
}
.blog-prev, .blog-next {
display: block;
width: 40px;
height: 40px;
text-align: center;
z-index: 10;
position: relative;
}
.blog-prev-wrap {
float:left;
}
.blog-next-wrap {
float:right;
}
#blog-navigation i {
line-height:40px;
width:40px;
color:#ddd;
position:relative;
-webkit-transition: all 0.15s ease-in-out;
transition: all 0.15s ease-in-out;
}
.light-content #blog-navigation i {
color:#fff;
opacity:0.2;
}
#blog-navigation a i {
color:#000;
}
.light-content #blog-navigation a i {
color:#fff;
opacity:1;
}
#blog-navigation .blog-prev a i, #blog-navigation .blog-prev i {
left:0px;
}
#blog-navigation .blog-next a i {
right:0px;
}
.blog-numbers {
font-weight: 500;
position: absolute;
width: 100%;
box-sizing: border-box;
padding: 0 80px;
height: inherit;
z-index:0;
color: #000;
font-size: 48px;
line-height: 64px;
font-weight:500;
font-family: 'Poppins', sans-serif;
left:0;
z-index:0;
}
.light-content .blog-numbers {
color: #fff;
}
.blog-numbers .blog-active {
width:30%;
float:left;
text-align:center;
line-height:80px;
}
.blog-numbers .blog-total {
width:30%;
float:right;
text-align:center;
line-height:80px;
} #blog-page-nav {
margin:0 auto;
padding-top: 200px;
padding-bottom: 120px;
}
#blog-nav-minimal {
margin:0 auto;
max-width:700px;
width:100%;
}
.blog-numbers {
font-size: clamp(48px, 8.5vw, 130px);
line-height: clamp(48px, 8.5vw, 130px);
font-weight: 500;
} #blog-post-content {
position: relative;
display: block;
box-sizing:border-box;
padding-bottom:40px;
margin: 0 auto;
width: 100%;
opacity:0;
}
.post-template-content  #hero {
z-index:0;
}
.post-template-content  #hero #hero-caption {
max-width: 1020px;
padding-top: 140px;
padding-bottom: 80px;  
}
.post-template-content .hero-title {
font-size: calc(1rem + 4.15vw);
line-height: calc(1rem + 4.5vw);
margin-top: 10px;
margin-bottom: 30px;
max-width: 860px;
word-wrap: break-word;
white-space: initial;
margin-left: -0.1vw;
}
.post-template-content .inline-title .hero-title span {
display: block;
}
.post-template-content .post-max-width {
max-width:860px;
position:relative;
margin:0 auto;
padding:0 80px;
}
.post-max-width::after {
clear: both;
content: " ";
display: table;
} #post-image {
position: relative;
display: block;
margin: 0 auto;
margin-bottom:60px;
width: 100%;
max-width:1000px;
} #post-content {
position: relative;
display: block;
margin: 0 auto;
width: 100%;
}
#post-content p > a	{
position:relative;
}
#post-content p > a::before {
content: '';
position: absolute;
bottom: -1px;
left: 0;
width: 100%;
height: 2px;
background: rgba(0,0,0,1);
transform: scaleX(0);
transform-origin: right;
transition: transform .2s ease-out;
}
.light-content #post-content p > a::before {
background: rgba(255,255,255,1);
}
#post-content p > a:hover::before {
transform: scaleX(1);
transform-origin: left;
}
#post-content footer {
position: relative;
width: 100%;
height: auto;
z-index: 900;
box-sizing: border-box;
text-align: left;
bottom: 0;
left: 0;
overflow: visible;
pointer-events: initial;
} #post-meta-data {
position: relative;
display: block;
width: 100%;
box-sizing: border-box;
padding-top: 20px;
margin: 0 auto;
} #post-navigation {
position: relative;
display: block;
box-sizing: border-box;
padding: 70px 0 100px 0;
margin:0 auto;		
}
.post-prev, .post-next {
width:50%;
float:left;
text-align:left;
color:#000;
}
.post-next {
text-align:right;
}
.light-content .post-prev, .light-content .post-next {		
color:#fff;
}
.post-prev-caption, .post-next-caption {
font-size: calc(1rem + 4.15vw);
line-height: calc(1rem + 4.5vw);
font-weight: 500;
margin-bottom:20px;
}
.uppercase-titles .post-prev-caption, .uppercase-titles .post-next-caption {
text-transform:uppercase;
}
.post-prev-title, .post-next-title {
font-size: 16px;
line-height: 28px;
font-weight: 500;
}
.uppercase-text .post-prev-title, .uppercase-text .post-next-title {
text-transform:uppercase;
line-height: 20px;
}
.disabled .post-prev-title, .disabled .post-next-title {
pointer-events:none;
}
.post-prev-title a, .post-next-title a {
position: relative;
display: inline-block;
}
.post-prev-title a em, .post-next-title a em {
font-family:inherit;
}
.post-prev-title span, .post-next-title span {
background-image: linear-gradient(transparent calc(100% - 2px), #000 1px);
background-size: 0;
background-repeat: no-repeat;
display: inline;
transition: 0.3s ease;
word-wrap: anywhere;
padding: 4px 0;
box-sizing: border-box;
}
.light-content .post-prev-title span, .light-content .post-next-title span {
background-image: linear-gradient(transparent calc(100% - 2px), #fff 1px);
}
.post-prev-title:hover span, .post-next-title:hover span {    
background-size: 100%;
} #post-navigation {
position: relative;
display: block;
box-sizing: border-box;
padding: 80px 0 80px 0;
margin: 0 auto;
margin-top: 0px;
margin-bottom: 0px;
border-bottom: 1px solid rgba(0,0,0,0.1);
border-top: 1px solid rgba(0,0,0,0.1);
margin-bottom: 80px;
margin-top: 80px;
}
.light-content #post-navigation {
border-bottom: 1px solid rgba(255,255,255,0.1);
border-top: 1px solid rgba(255,255,255,0.1);
} #post-comments {
position: relative;
display: block;
margin: 0 auto;
margin-bottom:15px;
width: 100%;
}
#post-comments:after {
clear: both;
content: " ";
display: table;
}
#post-comments .entry-meta li {
font-size: 20px;
font-weight: 500;
line-height: 30px;
}
.comments-navigation {
display:block;
position:relative;
}
.comments-navigation:after {
clear: both;
content: " ";
display: table;
}
.comments-navigation a {
padding-top: 8px;
margin-bottom: 40px;
position: relative;
display: block;
opacity:0.75;
-webkit-transition:opacity 0.15s ease 0s;
transition:opacity 0.15s ease 0s;
}
.light-content .comments-navigation a {
opacity:0.55;
}
.comments-navigation a:hover {
opacity:1;
}
.comments-navigation a::before {
content: '';
position: absolute;
bottom: 1px;
left: 0;
width: 100%;
height: 2px;
background: rgba(0,0,0,1);
transform: scaleX(0);
transform-origin: right;
transition: transform .2s ease-out;
}
.light-content .comments-navigation a::before {
background: rgba(255,255,255,1);
}
.comments-navigation a:hover::before {
transform: scaleX(1);
transform-origin: left;
}
.user_comment {
margin-bottom:35px;
padding-left: 75px;
position:relative;
}
.user-image {		
height: 60px;
width: 60px;
position:absolute;
left:0px;
top:0px;
}
.comment-head {
margin-bottom:5px;
}
.comment-head a {
position:relative;
display:inline-block;
}
.comment-head a::before {
content: '';
position: absolute;
bottom: 1px;
left: 0;
width: 100%;
height: 2px;
background: rgba(0,0,0,1);
transform: scaleX(0);
transform-origin: right;
transition: transform .2s ease-out;
}
.light-content .comment-head a::before {
background: rgba(255,255,255,1);
}
.comment-head a:hover::before {
transform: scaleX(1);
transform-origin: left;
}
.user_comment_reply .user-image:after {
content: '';
position: absolute;
width: 25px;
height: 1px;
background-color: rgba(0,0,0,0.2);
left: -44px;
bottom: 20px;
}
.user_comment_reply .user-image:before {
content: '';
position: absolute;
width: 1px;
height: 25px;
background-color: rgba(0,0,0,0.2);
left: -45px;
bottom: 20px;
}
.light-content .user_comment_reply .user-image:after, .light-content  .user_comment_reply .user-image:before {
background-color:rgba(255,255,255,0.2);
}
.user-image img {
width:100%;
height:auto;
border-radius: 3px;
}
.user_comment_reply {
position:relative;
padding-left: 75px;
margin-top: 35px;
display:block;
}
.user_comment_reply .user-image:after {
content: '';
position: absolute;
width: 25px;
height: 1px;
background-color: rgba(0,0,0,0.2);
left: -50px;
bottom: 25px;
}
.user_comment_reply .user-image:before {
content: '';
position: absolute;
width: 1px;
height: 25px;
background-color: rgba(0,0,0,0.2);
left: -51px;
bottom: 25px;
}
.light-content .user_comment_reply .user-image:after, .light-content  .user_comment_reply .user-image:before {
background-color:rgba(255,255,255,0.2);
}
.pingback, .trackback {
padding-left: 0;
}
.bypostauthor {
position:relative;
} #post-form {
position: relative;
display: block;
margin: 0 auto;
width: 100%;
max-width:860px;
}
#post-form .entry-meta li {
font-weight:500;
font-size: 20px;
}
#post-form .message-box, #respond .message-box {
margin-top: 10px;
}
#post-form textarea, #respond textarea {
margin-bottom: 0px;
}
.comment_area_loggedin.message-box {
margin-bottom:40px;
}
.wp-block-latest-comments__comment-link {
line-height:28px;
}
.cancel-reply {
position:relative;
display:inline-block;
margin-bottom:10px;
line-height: 22px;
opacity:0.75;
-webkit-transition:opacity 0.15s ease 0s;
transition:opacity 0.15s ease 0s;
}
.light-content .cancel-reply {
opacity:0.55;
}
.cancel-reply:hover {
opacity:1;
}
.cancel-reply::before {
content: '';
position: absolute;
bottom: 1px;
left: 0;
width: 100%;
height: 2px;
background: rgba(0,0,0,1);
transform: scaleX(0);
transform-origin: right;
transition: transform .2s ease-out;
}
.light-content .cancel-reply::before {
background: rgba(255,255,255,1);
}
.cancel-reply:hover::before {
transform: scaleX(1);
transform-origin: left;
}
.logged-in-as a {
position:relative;
display:inline-block;
opacity:1;
-webkit-transition:opacity 0.15s ease 0s;
transition:opacity 0.15s ease 0s;
}
.light-content .logged-in-as a {
opacity:1;
}
.logged-in-as a:hover {
opacity:1;
}
.logged-in-as a::before {
content: '';
position: absolute;
bottom: 1px;
left: 0;
width: 100%;
height: 2px;
background: rgba(0,0,0,1);
transform: scaleX(0);
transform-origin: right;
transition: transform .2s ease-out;
}
.light-content .logged-in-as a::before {
background: rgba(255,255,255,1);
}
.logged-in-as a:hover::before {
transform: scaleX(1);
transform-origin: left;
}
.comment-form-cookies-consent {
display: block;
float: left;
margin-top: 10px;
margin-bottom: 20px;
position: relative;
width: 100%;
height: autox;
}
#wp-comment-cookies-consent, .comment-form-cookies-consent input {
width: 20px;
height: 20px;
margin: 0;
border: 0;
top: 2px;
position: absolute;
}
.comment-form-cookies-consent label {
height: auto;
display: block;
line-height: 24px;
position: relative;
top: 0;
padding-left: 32px;
font-size: 14px;
} #post-notification {
position: relative;
display: block;
margin: 0 auto;
width: 100%;
max-width:860px;
} #black-fade {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #000;
opacity: 0;
z-index: 1100;
visibility:hidden;
-webkit-transition: all 400ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
-moz-transition: all 400ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
-o-transition: all 400ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
transition: all 400ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
-webkit-transform: translate3d(0, 0, 0);
-webkit-perspective: 1000;
}
#black-fade.fade-in {
opacity: 0.9;
visibility:visible;
}
.magic-cursor-disabled #black-fade.fade-in {
position: fixed;
height: 100vh;
width: 100vw;
top: 0;
left: 0;
right: 0;
bottom: 0;
cursor: url(//ango.lu/wp-content/themes/nanotech/images/close.png), e-resize;
}
#sidebar {
position: fixed;
top: 0px;
right: -370px;
width: 400px;
height: 100%;
background-color: #ddd;
z-index: 1200;
overflow: hidden;
-webkit-transition: transform 400ms cubic-bezier(0.645, 0.045, 0.355, 1.000), background-color 400ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
transition: transform 400ms cubic-bezier(0.645, 0.045, 0.355, 1.000), background-color 400ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
-webkit-transform: translateX(0);
transform: translateX(0);
opacity:0;
}
#sidebar .before-span {
opacity: 1!important;
transform: translate(0px, 0px)!important;
}
.load-post-page #sidebar {
opacity:1!important;
}
.light-content #sidebar {
background-color: #222;
}
#sidebar.open {
-webkit-transform: translateX(-370px)!important;
transform: translateX(-370px)!important;
background-color: #fff;
}
.light-content #sidebar.open {
background-color: #222;
}
#open-sidebar {
cursor:pointer;
width: 30px;
height: 30px;
line-height:30px;
position: absolute;
top: 50%;
margin-top: -15px;
left: 0;
font-size: 14px;
text-align: center;
color:#000;
opacity:0.5;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;		
}
.light-content #open-sidebar {
color:#fff;
}
#open-sidebar:hover, #open-sidebar-nav:hover {
opacity:1
}
#open-sidebar-nav {
cursor:pointer;
width: 30px;
height: 30px;
line-height:30px;
position: absolute;
font-size: 14px;
text-align: center;
color:#000;
opacity:0.2;
display:none;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;		
}
.light-content #open-sidebar-nav {
color:#fff;
}
#open-sidebar.open {
opacity:0;
visibility:hidden;
}
#open-sidebar i {
width: 30px;
height: 30px;
line-height:30px;
}
.sidebar-content {
box-sizing: border-box;
padding: 80px 50px;
padding-right: 60px;
width: calc(100% + 30px);
height:100%;
overflow: hidden;
overflow-y: scroll;
}
.clapat-sidebar-widget {
display:block;
position:relative;
margin-bottom:70px;
line-height:28px;
font-weight:500;
}
.clapat-sidebar-widget em {
font-family:inherit;
}
.clapat-sidebar-widget article {
padding:0;
border:none!important;
}
.widgettitle a {
color:#000;
}
.light-content .widgettitle a {
color:#fff;
}
.clapat-sidebar-widget footer {
position: relative !important;
width: 100%;
height: auto;
z-index: 0;
box-sizing: border-box;
text-align: left;
bottom: 0;
left: 0;
overflow: visible;
pointer-events: initial;
}
.clapat-sidebar-widget ul {
margin: 0;
margin-top: 10px;
}
.clapat-sidebar-widget ul li {
position: relative;
width: 100%;
list-style: none;		
display: inline-block;
margin: 8px 0;
line-height:28px;		
}
.clapat-sidebar-widget ul ul {
margin-left: 20px;
}
.clapat-sidebar-widget a {
position: relative;
opacity: 0.7;
-webkit-transition: all 0.15s ease-in-out;
transition: all 0.15s ease-in-out;
}
.clapat-sidebar-widget a:hover {
opacity:1;
} .wp-block-button.aligncenter, .wp-block-calendar {
text-align:left;
margin-bottom:25px;		
}
#wp-calendar {
width: 100%; 
border:0;
}
#wp-calendar caption {
text-align: left;
color: #000;
font-size: 16px;
margin-top: 15px;
margin-bottom: 15px;
}
.light-content #wp-calendar caption {
color:#fff;
}
#wp-calendar thead { 
font-size: 10px; 
}
#wp-calendar thead th {
padding-bottom: 10px;
border: 0;
text-align: center;
padding-top: 10px;
font-size: 12px;
}
#wp-calendar tbody { 
color: #aaa; 
}
#wp-calendar tbody td {
background: #fff;
border: 1px solid #eee;
text-align: center;
padding: 8px;
border-radius: 0px;
font-size: 12px;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.light-content #wp-calendar tbody td {
background: #333;
border: 1px solid #222;
}
.light-content #wp-calendar a {
color:#fff;
}
#wp-calendar tbody td:hover { 
background: #222; 
color:#fff;
}
#wp-calendar tbody td:hover a {
color:#fff;
}
#wp-calendar tbody .pad { 
background: none; 
}
#wp-calendar tfoot #next { 
font-size: 10px; 
text-transform: uppercase; 
text-align: right; 
}
#wp-calendar tfoot #prev { 
font-size: 10px; 
text-transform: uppercase; 
padding-top: 10px; 
}
#wp-calendar tfoot td {	
border:0
}
#wp-calendar .pad {
background-color:transparent!important;
}
.wp-calendar-nav {
background-color:transparent!important;
pointer-events:initial;
} .select, .wp-block-archives-dropdown, .wp-block-categories-dropdown {
position: relative;
display: block;
width: 100%;
height: 40px;
background: transparent;
line-height: 40px;
margin-top: 25px;
margin-bottom: 25px;
}
.light-content .select, .light-content .wp-block-archives-dropdown, .light-content .wp-block-categories-dropdown {
background: #333;
}
.clapat-sidebar-widget select {
position:relative;
width:100%;
}
.clapat-sidebar-widget select option {
position:relative;
width:100%;
}
select {
width: 100%;
height: 100%;
margin: 0;
padding: 0 0 0 1em;
color: #000;
cursor: pointer;
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
appearance: none;
outline: 0;
box-shadow: none;
border: 0 !important;
background-image: none;
font-size: 14px !important;
font-family: inherit !important;
}
select::-ms-expand {
display: none;
}
.select::after, .wp-block-archives-dropdown::after, .wp-block-categories-dropdown::after {
content: '\25BC';
position: absolute;
top: 0;
right: 0;
bottom: 0;
padding: 0 1.6em;
background: #000;
pointer-events: none;
height: 40px;
line-height: 40px;
color: rgba(255,255,255,1);
font-size: 10px;
z-index: 20;
}
.light-content .select::after, .light-content .wp-block-archives-dropdown::after, .light-content .wp-block-categories-dropdown::after {
height: 41px;
line-height: 41px;
}
.select:hover::after {
color: #fff;
}
.select::after {
-webkit-transition: .25s all ease;
-o-transition: .25s all ease;
transition: .25s all ease;
} .wp-block-latest-posts {
margin:0;		
}
.wp-block-latest-posts li a, .wp-block-latest-comments__comment-meta a, .clapat-sidebar-widget a {
background-image: linear-gradient(transparent calc(100% - 2px), #000 1px);
background-size: 0;
background-repeat: no-repeat;
display: inline;
transition: 0.3s ease;
word-wrap: anywhere;
padding: 1px 0;
box-sizing: border-box;
font-size:14px;
}
.light-content .wp-block-latest-posts li a, .light-content .wp-block-latest-comments__comment-meta a, .light-content .clapat-sidebar-widget a {
background-image: linear-gradient(transparent calc(100% - 2px), #fff 1px);
}
.wp-block-latest-posts li:hover a, .wp-block-latest-comments__comment-meta a:hover, .clapat-sidebar-widget a:hover {    
background-size: 100%;
} .wp-block-search, .wp-block-search .wp-block-search__inside-wrapper {
position: relative;
display: block;
}
.wp-block-search {
margin-bottom:25px;
}
.wp-block-search .wp-block-search__input {
border: none;
border-bottom: 1px solid rgba(0,0,0,0.3);
padding-left: 70px;
font-size:14px;
font-weight:400;
}
.light-content .wp-block-search .wp-block-search__input {
color:rgba(255,255,255,1);
border-bottom:1px solid rgba(255,255,255,0.3);
}
.wp-block-search .wp-block-search__label {
width: auto;
position: absolute;
height: 100%;
line-height: 50px;
color:#444;
font-size:14px;
font-weight:400;
}
.light-content .wp-block-search .wp-block-search__label {
color:#aaa;
}
.wp-block-search .wp-block-search__label::after {
content: ":";
width: 3px;
height: 50px;
font-size: 16px;
line-height: 50px;
text-align: left;
position: absolute;
right: -6px;
top: 0;
}
.wp-block-search__inside-wrapper:after {
font: var(--fa-font-solid);
content: "\f002";
width:20px;
height:20px;
font-size:14px;
line-height:20px;
text-align:left;
position:absolute;
right:0px;
top:14px;
color:#000;
}
.light-content .wp-block-search__inside-wrapper:after {
color:#fff;
}
.wp-block-search .wp-block-search__button {
position: absolute;
right: 0;
height: 100%;
width: 40px;
opacity: 0;
z-index: 10;
overflow:hidden;
}
.search {
position:relative;
} .post-password-form label {
width: 100%;
position: relative;
height: 100%;
line-height: 50px;
color: #444;
display: block;
margin-bottom:25px;
}
.light-content .post-password-form label {
color:#aaa;
}
.post-password-form input {
position: absolute;
display: block;
width: 100%;
top: 0;
padding-left: 90px;
}
.post-password-form input[type="submit"] {
height: 50px;
position:relative;
width: auto;
border: solid 3px #000;
color: #000;
background-color: transparent;
border-radius: 5px;
cursor: pointer;
font-size: 16px;
font-weight: 500;
line-height: 20px;
overflow: hidden;
text-align: center;
-webkit-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
}
.light-content .post-password-form input[type="submit"] {
border: solid 3px #fff;
color: #fff;
background-color: transparent;
}
.post-password-form input[type="submit"]:hover {
color: #fff;
background-color: #fff;
}
.light-content .post-password-form input[type="submit"]:hover {
color: #000;
background-color: #fff;
} @media only screen and (max-width: 1466px) {
.post-template-content .post-max-width {
max-width: 900px;
padding:0 60px;
}
#post-form {
max-width: 900px;
box-sizing:border-box;
}
#post-navigation {
clip-path: inset(0 60px 0 60px);
}
}
@media only screen and (max-width: 1024px) {
article {
padding: 50px 0 30px 0;
}
#blog-effects.clapat-blog-expand-on-scroll article {
pointer-events: initial;
opacity: 1;
}
.article-wrap  .hover-reveal {
position: relative;
width: 100%;
height: auto;
pointer-events: none;
opacity:1!important;
margin-bottom:40px;		
box-sizing:border-box;
left: 0!important;
top: 0!important;
}
.article-wrap:hover .hover-reveal {
width:100%;
}
.article-wrap .hover-reveal__inner {
width: 100%;
height: auto;
transform: translateX(0%)!important;
-webkit-transform: translateX(0%)!important;
}
.article-wrap .hover-reveal__inner .hover-reveal__img {
transform: translateX(0%)!important;
-webkit-transform: translateX(0%)!important;
}
#blog-effects article .article-bg {
display: block;
width: 100%;
height:auto;
}
.article-content {
position:relative;
padding: 0;
margin-bottom: 30px;
}
.article-wrap {
width: 100%;
margin-bottom:20px;
}
article .post-title, article .article-links {
width: auto;
}
article .button-wrap {
margin-left: 50%;
}
.post.sticky {
width: calc(100% + 80px);
margin-left: -40px;
padding: 50px 40px 30px 40px;
box-sizing: border-box;
border: none;
}
.post.sticky .article-wrap {
border: none!important;
}
.post.sticky .article-wrap::before {
display:none;
}
.has-post-thumbnail .article-wrap:hover .post-title {
transform: translateX(00px);
-webkit-transform: translateX(00px);
max-width: 100%;
}
.post-template-content .post-max-width, #post-form {
max-width: 900px;
padding:0 40px;
}
#post-navigation {
clip-path: inset(0 40px 0 40px);
}
.post-template-content .hero-title {
font-size: calc(1rem + 10vw);
line-height: calc(1rem + 9.5vw);
}
}
@media only screen and (max-width: 767px) {
.article-content {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
article .entry-meta-wrap {
width: auto;
}
article .post-title {
font-size: calc(1rem + 2vw);
line-height: calc(1rem + 2.6vw);
}
article .button-wrap {
margin: 0 auto;
}
article .button-wrap .icon-wrap {
display: none;
}
article .button-wrap .button-text {
padding:0;
display:block;
}
.post.sticky {
width: calc(100% + 60px);
margin-left: -30px;
padding: 50px 30px 30px 30px;
}
.blog-excerpt {
box-sizing: border-box;
padding-left: 30px;
padding-right: 30px;
}
#blog-page-nav {
padding-top: 100px;
padding-bottom: 80px;
}
#blog-nav-minimal {
width: 100%;
}
.post-prev, .post-next {
width: 100%;
float: left;
text-align: left;
color: #000;
}
.post-next {
text-align: left;
margin-top: 20px;
}
#post-comments h5 {
font-size: 28px;
line-height: 44px;
}
.user_comment {
padding-left: 55px;
margin-bottom: 25px;
}
.user-image {
height: 40px;
width: 40px;
}
.user_comment_reply {
padding-left: 55px;
margin-top: 25px;
}
.user_comment_reply .user-image::before {
width: 1px;
height: 20px;
left: -41px;
bottom: 20px;
}
.user_comment_reply .user-image::after {
width: 20px;
height: 1px;
left: -40px;
bottom: 20px;
}
#open-sidebar-nav {
display: block;
right: 70px;
top: 26px;
opacity: 1;
pointer-events: initial;
z-index:0;
}
#sidebar.open {
-webkit-transform: translateX(-400px)!important;
transform: translateX(-400px)!important;
}
#sidebar {
right: -400px;
width: 400px;
height: 100%;
}
#post-navigation {
clip-path: inset(0 30px 0 30px);
}
.post-template-content .post-max-width, #post-form {
max-width: 900px;
padding:0 30px;
}
.post-template-content .hero-title {
font-size: calc(1rem + 12vw);
line-height: calc(1rem + 11.5vw);
}
}
@media only screen and (max-width: 479px) {
.post.sticky {
width: calc(100% + 40px);
margin-left: -20px;
padding: 50px 20px 30px 20px;
}
.blog-excerpt {
box-sizing: border-box;
padding-left: 20px;
padding-right: 20px;
}
#blog-page-nav {
padding-top: 100px;
padding-bottom: 80px;
}
.page-numbers li {
padding-right: 4px;
}
.user_comment {
padding-left: 0px;
margin-bottom: 25px;
}
.user-image {
display:none;
}
.user_comment_reply {
padding-left: 20px;
}
#open-sidebar-nav {
right: 60px;
}
#sidebar.open {
-webkit-transform: translateX(-300px)!important;
transform: translateX(-300px)!important;
}
#sidebar {
right: -300px;
width: 300px;
height: 100%;
}
.sidebar-content {
padding: 60px 30px;
padding-right: 30px;
padding-right: 40px;
}
#post-navigation {
clip-path: inset(0 20px 0 20px);
}
.post-template-content .post-max-width, #post-form {
max-width: 900px;
padding:0 20px;
}
}