/* Author */ .box-author { background-image: url("../../assets/img/black-paper.webp"); background-color: rgba(0, 0, 0, 0.25); padding: 0 !important; /* box-shadow: 5px 5px 0px 0px rgba(0, 0, 0, 0.5); */ margin: 50px -25px; } .author { width: 55%; padding: 30px; float: left; position: relative; overflow: hidden; margin-bottom: 0 !important; background-color: rgba(0, 0, 0, 0.25); } .author:before, .author:after { content: ""; display: block; position: absolute; left: 30px; } .author:before { z-index: 100; top: 0; width: 40px; height: 70px; background: #6442a5 url("../../assets/img/icons/1x/author-w.png") no-repeat center 29px; background-size: 22px auto; } .author:after { top: 50px; border: 20px solid transparent; border-left-color: #6442a5; border-right-color: #6442a5; } .author-content { margin-left: 70px; } .author-links { margin-top: 18px; } .author-links a { display: inline-block; width: 36px; height: 36px; background-color: rgba(255, 255, 255, 0.1); background-repeat: no-repeat; background-position: center; background-size: 16px auto; margin-left: 5px; border-radius: 999px; text-indent: -9999px; } .author-links a:first-child { margin-left: 0; } .author-links a.author-link-posts { background-image: url("../../assets/img/icons/1x/archive-w.png"); } .author-links a.author-link-website { background-image: url("../../assets/img/icons/1x/home-w.png"); } .author-links a.author-link-mail { background-image: url("../../assets/img/icons/1x/social/mail-w.png"); } .author-links a.author-link-twitter { background-image: url("../../assets/img/icons/1x/social/twitter-w.png"); } .author-links a:hover { background-color: #6442a5; } /* single post meta */ .single .post-meta-container { position: relative; background: #2b3542; } .single .post-meta-container:after { content: ""; display: block; background: #3f4854; position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 60%; } .single .post-meta { float: right; width: 45%; padding: 30px; position: relative; z-index: 10; } .single .post-meta p, .single .post-meta > a, .post-nav a { display: block; margin-top: 12px; font-size: 0.85em; line-height: 120%; font-weight: 700; min-height: 20px; /* padding: 1px 0 1px 23px; */ background: no-repeat left center; background-size: 16px auto; color: #9499a0; } .single .post-meta p:first-child { margin-top: 0; } .single .post-meta a { color: #9499a0; } .single .post-meta a:hover { color: #6442a5; } /* post navigation */ .post-nav { padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, 0.1); margin-top: 20px; } .post-nav a { background-position: left 3px; } .post-nav a:first-child { margin-top: 0; } .single a.post-edit-link { background-image: url("../../assets/img/icons/1x/edit-g.png"); background-position: left 5px; } .single a.post-edit-link:hover { background-image: url("../../assets/img/icons/1x/edit-c.png"); } .icon-padding { padding: 0 10px 0 0; } /* -------------------------------------------------------------------------------- */ /* 8. Comments /* -------------------------------------------------------------------------------- */ .content .comments, div#disqus_thread { padding: 4%; } .nocomments { padding: 10%; text-align: center; text-transform: uppercase; font-weight: 700; color: #999; } .comments + .nocomments { border-top: 1px solid #eee; } .comments-title-container { padding-bottom: 20px; border-bottom: 1px solid #eee; margin-bottom: 40px; } .comments-title { font-size: 1.75em; font-weight: 700; } .add-comment-title { font-size: 1rem; text-transform: uppercase; font-weight: 700; margin-top: 14px; } .add-comment-title a:hover { text-decoration: underline; } /* comment */ .comments div.comment { margin-top: 40px; } .comments .commentlist > li.comment:first-child > div.comment:first-child { margin-top: 0; } .comments div.comment { position: relative; } .comments .children { margin-left: 5%; } .comment-inner { margin-left: 110px; padding: 20px; background: #eeeeee24; position: relative; } .comment-inner:after { content: ""; display: block; border: 12px solid transparent; border-right-color: #eeeeee24; position: absolute; top: 28px; left: 0; margin-left: -24px; } .comment .avatar { float: left; width: 80px; } .comment.bypostauthor { position: relative; } /* .comment.bypostauthor:after { content: ""; display: block; width: 32px; height: 32px; background: #13c4a5 url(../../assets/img/icons/1x/author-w.png) no-repeat center 8px; background-size: 14px auto; border-radius: 999px; position: absolute; top: 0; left: 0; margin-top: -8px; margin-left: -8px; } */ .comment-header { margin-bottom: 25px; } .comment-header cite { display: block; font-size: 1em; font-weight: 700; margin-bottom: 8px; } .comment-header p { font-size: 0.85em; } .comment-header p, .comment-header p a { color: #999; } .comment-header p a:hover { color: #666; } /* comment-content */ .comment-content { font-size: 0.9em; } .comment-content a:hover { text-decoration: underline; } .comment-content p, .comment-content li, .comment-content blockquote { line-height: 150%; margin-top: 1em; -ms-word-wrap: break-word; word-wrap: break-word; } .comment-content *:first-child { margin-top: 0; } .comment-content *:last-child { margin-bottom: 0; } .comment-content h1, .comment-content h2, .comment-content h3, .comment-content h4, .comment-content h5, .comment-content h6 { margin: 50px 0 20px; font-weight: 400; font-size: 1.2em; } .comment-content blockquote { padding: 20px; background: #ddd; } .comment-content ul { list-style: disc; margin-left: 1.5em; } .comment-content ul ul { list-style: circle; } .comment-content ul ul ul { list-style: square; } .comment-content ol { list-style: decimal; margin-left: 1.5em; } .comment-content ol ol { list-style: lower-alpha; } .comment-content ol ol ol { list-style: lower-roman; } .comment-content ul ul, .comment-content ul ol, .comment-content ol ul, .comment-content ol ol { margin-bottom: 0; } .comment-content li { margin-top: 0.5em; line-height: 170%; } .comment-content ol > li:last-child, .comment-content ul > li:last-child { margin-bottom: 0; } .comment-content address { padding: 20px; background: #ddd; line-height: 140%; } .comment-content pre { padding: 20px; background: #ddd; line-height: 150%; overflow-x: scroll; } /* comment actions */ .comment-actions { position: absolute; top: 22px; right: 20px; } .comment-actions a { display: block; position: relative; float: left; width: 32px; height: 32px; background: #2b3542 no-repeat center; background-size: 16px auto; border-radius: 999px; text-indent: -9999px; margin-right: 12px; } .comment-actions a + a { margin-left: -8px; } .comment-actions .comment-reply-link { background-image: url("../../assets/img/icons/1x/reply-w.png"); } .comment-actions .comment-edit-link { background-image: url("../../assets/img/icons/1x/edit-w.png"); } .comment-actions a:hover { background-color: #6441a5; color: #fff; z-index: 10; } /* comment navigation */ .comment-nav-below { margin-top: 40px; border-top: 1px solid #eee; padding-top: 20px; font-size: 0.9em; font-weight: 700; } .comment-nav-below a { color: #666; } /* pingbacks */ .comments .pingbacks { padding-top: 40px; border-top: 1px solid #eee; margin-top: 40px; } .pingbacks-title { font-size: 1.25em; margin-bottom: 20px; color: #2b3542; } .pingbacklist .pingback { padding: 15px; line-height: 130%; } .pingbacklist .pingback a { color: #767676; } .pingbacklist .pingback a:hover { color: #13c4a5; } .pingbacklist .pingback:nth-child(2n) { background-color: #eee; } /* Comments fix */ .bypostauthor { border-left: none !important; padding: 0 !important; } /* Heart achievement */ .heart-container { background-image: url("../../assets/img/black-paper.webp"); background-color: rgba(0, 0, 0, 0.25); padding: 30px !important; /* box-shadow: 5px 5px 0px 0px rgba(0, 0, 0, 0.5); */ margin: 50px -25px; text-align: center; } .heart { font-size: 28px; cursor: pointer; color: red; } .heart-count { font-size: 24px; } /* .heart-text { } */ /* -------------------------------------------------------------------------------- */ /* 9. Respond /* -------------------------------------------------------------------------------- */ .comment-respond { padding: 10%; border-top: 1px solid #eee; } .comments .comment-respond { padding: 10% 0; border-top: none; } .comment-reply-title { font-size: 1.75em; font-weight: 700; } .comment-reply-title #cancel-comment-reply-link { font-size: 0.9rem; text-transform: uppercase; font-weight: 700; margin-left: 5px; } .comment-reply-title #cancel-comment-reply-link:hover { text-decoration: underline; } .comment-notes, .logged-in-as { color: #666; line-height: 130%; margin-bottom: 40px; margin-top: 25px; } .logged-in-as a:hover { text-decoration: underline; } .comment-form { margin-top: 10px; } .comment-form p { margin-top: 18px; position: relative; } .comment-form p:first-child { margin-top: 0; } .comment-form label { display: block; font-size: 16px; margin-bottom: 0.5rem; } .comment-form input[type="checkbox"] + label { display: inline; font-size: 14px; margin: 0 0 0 0.5rem; } .comment-form input[type="text"], .comment-form input[type="email"], .comment-form textarea { display: block; width: 100%; padding: 16px 18px; border-radius: 3px; color: #cacaca; border: 1px solid #eee; font-size: 1em; -webkit-font-smoothing: antialiased; margin: 0; background: transparent; } .comment-form-author, .comment-form-email, .comment-form-url { width: 75%; } .comment-form input[type="text"], .comment-form input[type="email"] { position: relative; padding-right: 60px; background-repeat: no-repeat; background-position: 96% center; background-size: auto 24px; } input#author { background-image: url("../../assets/img/icons/1x/author-g.png"); } input#email { background-image: url("../../assets/img/icons/1x/social/mail-g.png"); } input#url { background-image: url("../../assets/img/icons/1x/home-g.png"); background-size: 24px auto; } .comment-form textarea { height: 250px; } .comment-form input[type="text"]:focus, .comment-form input[type="email"]:focus, .comment-form textarea:focus { color: #fff; background-color: #2b3542; } input#author:focus { background-image: url("../../assets/img/icons/1x/author-w.png"); } input#email:focus { background-image: url("../../assets/img/icons/1x/social/mail-w.png"); } input#url:focus { background-image: url("../../assets/img/icons/1x/home-w.png"); } .form-allowed-tags, .form-allowed-tags code { line-height: 160%; } .comment-notes, .form-allowed-tags, .logged-in-as { font-size: 0.9em; color: #666; } p.form-submit { margin-top: 30px; } .form-submit #submit { padding: 16px 20px; border: none; margin: 0; font-size: 0.9em; font-weight: 400; color: #fff; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); background: #2b3542; border-radius: 3px; -webkit-font-smoothing: antialiased; } .form-submit #submit:hover { cursor: pointer; background: #6441a5; } /* Custom komment ikon */ .custom-comment-icon-wrapper { position: fixed; z-index: 99; text-align: center; opacity: 0.9; bottom: 80px; left: 672.5px; display: block; } @media only screen and (max-width: 1200px){ .custom-comment-icon-wrapper { display: none; } } .custom-comment-icon-wrapper::before { border: 1px solid #fff; box-shadow: 0px 0px 15px #aaa; width: 64px; height: 64px; border-radius: 50%; color: #fff; align-items: center; justify-content: center; position: relative; } .custom-comment-icon { background-image: url("../../assets/img/small-logo.webp"); display: flex; cursor: pointer; background-size: contain; width: 80px; height: 80px; } .custom-tooltip { position: absolute; background-color: rgba(0, 0, 0); color: #6441a5; padding: 5px 10px; border-radius: 5px; font-size: 16px; z-index: 1000; }