article{
    padding: 1em 2em;
    box-sizing: border-box;
    border-radius: 10px;
    width: 50vw;
    margin: 5em auto;
    line-height: 1.5;
}
article img{width:100%;height:auto;}
.post-top{
    height: 650px;
}
/* .post-top.faq{background-color: var(--c4);} */
.faq-top-bg{position: absolute;}
.post-top .featured-image{
    width:100%;
    height: 650px;
    position:absolute;
    background:linear-gradient( rgba(0,0,0,0.6), rgba(0,0,0,0.6) ),url(https://getenergie.co.id/wp-content/uploads/2024/04/solar-house-rawpixel.jpg);
    background-color:var(--c4);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%;
}
.post-properties {
    position: relative;
    top: 60%;
    width: 50vw;
    margin: auto;
    padding: 0.7em 1em 1em 1em;
    border-radius: 10px;
    color: var(--c2);
}

h1.post-title {
    margin-top: 0;
    margin-bottom: 0.4rem;
    font-size: 45pt;
    line-height: 1.2;
}
.sharebuttons{
    position:fixed;
    left:0;
    top:50vh;
    bottom:50vh;
    display:flex;
    flex-direction:column;
    background-color:white;
    height:max-content;
}
.sharebutton{
    padding:1em;
    box-sizing: border-box;
    /* border-bottom:1px solid #bbb; */
}
.share-title {
    text-align: center;
    font-size: 10pt;
    font-weight: bold;
}
.share-fb:hover{
    color:white;
    background-color:#1778F2;
}
.share-fb{
    background-color:white;
    color:#1778F2;
}
.share-x{
    color:#1DA1F2;
    background-color: #F5F8FA;
}
.share-x:hover{
    background-color:#1DA1F2;
    color: #F5F8FA;
}
.share-ig{
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
    -webkit-background-clip: text;
          /* Also define standard property for compatibility */
          background-clip: text;
    -webkit-text-fill-color: transparent;
}
.share-ig:hover{
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
    color:white;
    /* -webkit-background-clip: content-box;
    background-clip: content-box; */
    -webkit-text-fill-color: white;
}
.question{font-size:19pt;font-weight:bold;margin-bottom:0.5em;}
@media(max-width:1300px){
    article {width: 70vw;
    }
}
@media(max-width:800px){
    h1.post-title {
        font-size: 18pt;
    }
    .post-properties {
        width: 80vw;
        padding: 0.7em;
    }
    
    article {width: 100vw;padding: 1em;
        margin: 2em auto;
    }
    .sharebuttons {
        position: relative;
        top: 0;
        flex-direction: row;
        align-items: center;
    }
    .sharebutton{border-bottom:none;}
    .post-prop-line2 {
        font-size: 10pt;
        margin-bottom: 1em;
    }
}