<!-- (c) Layout created by Bela (https://layouts.spacehey.com/layout?id=4342) --> <style> /* font */ @import url('https://fonts.googleapis.com/css2?family=Nothing+You+Could+Do&amp;display=swap'); @import url('https://fonts.googleapis.com/css2?family=Rock+Salt&amp;display=swap'); :root{ --gray: transparent; /* background color */ --logo-blue: transparent; /* navigation background color */ --lighter-blue: transparent; /* nav links background */ --lightest-blue: transparent; /*sidebar background */ --light-orange: transparent; /* comments table first child background */ --even-lighter-orange: transparent; /* comments table second child background */ --borders: 0px solid #000; --font-family: 'Nothing You Could Do', cursive; /* this applies to the whole page. */ --header: #9E1363; /* color of titles */ --text: #fff; /* color of regular text */ --othertext: #D1208F; /* color of line that appears under the Kudos */ --links: #AC1876; /* color of links */ --hover: plum; /* color of links on hover */ } /*custom cursor */ * {cursor: url('https://img.icons8.com/material-rounded/24/ffffff/cursor.png'), auto !important;} a:hover {cursor: url('https://cdn.custom-cursor.com/db/8358/32/neon-angel-and-devil-cursor.png'), auto!important;} body{ background-color: var(--gray); background-image: url('https://i.imgur.com/wk5zg75.jpg'); background-size: 100%100%; background-attachment: fixed; font-family: var(--font-family); font-size: 16px!important; } main{ background: transparent; color: var(--text); } .icon{ font-size: 12px!important; border: none!important; } a{ color: var(--links); font-size: 16px!important; } a:hover{ color: var(--hover); text-decoration: none!important; text-shadow: 0px 0px 5px black; } h2,h3,h4,h5{ font-size: 16px!important; } nav{ color: var(--links); border: var(--borders); background-color: var(--logo-blue); text-align: center; } /* this is the line that appears between links in the header and footer. you can add an emoji or symbol instead of the default line it has */ nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after{ content: " 𝕩 "; color: var(--othertext); font-family: 'Rock Salt', cursive; } nav .links a{ color: var(--links); } nav .links a:hover{ color: var(--hover); } /* this is where you edit your blog entry */ .kudos{ text-align: right; } .blog-entry .comments .heading{ border-top: 2px solid var(--othertext); /* this is the line that appears under the kudos */ text-align: right; } .blog-entry .title{ background-color: var(--gray); color: var(--header); border: var(--borders); font-size: 40px!important; font-weight: 1; text-align: center; font-family: 'Rock Salt', cursive; } .blog-entry .content{ background-color: var(--gray); border: none; font-family: var(--font-family); letter-spacing: 1px; font-size: 16px; text-align: center; } /* this is the spacehey logo color. you can change it at https://codepen.io/sosuke/pen/Pjoqqp */ nav img.logo{ max-width: 120px; filter: brightness(0) saturate(100%) invert(13%) sepia(87%) saturate(3802%) hue-rotate(309deg) brightness(94%) contrast(91%)!important; } /* the search wrapper and button */ .search-wrapper input[type=text] { background-color: transparent !important; border-bottom: 1px solid var(--links)!important; border-top:none;border-left:none;border-right:none; color: var(--links) !important; } button{ border: 0px solid var(--links) !important; background-color: transparent !important; color: var(--links) !important; font-size: 13px!important; } .count{ color: var(--links); } footer{ color: var(--text); background: var(--logo-blue); border: var(--borders); text-align: center; font-size: 16px!important; } footer .links{ text-align: center; } /* side bar with your profile image */ .edit-info{ background: var(--lightest-blue); border: var(--borders); } .edit-info img{ border-width: 3px 4px 3px 5px; border-radius:95% 4% 92% 5%/4% 95% 6% 95%; transform: rotate(2deg); border: 3px solid #D1208F; } /* comments table */ #comments p:not(.comments-table p){ text-align: right; /* Displaying 2 of 2 comments ( View all | Add Comment ) */ font-size: 16px!important; } .comment-replies{ border-top: 1px solid #D1208F; border-bottom: none;border-left:none;border-right:none; background-color: transparent; } table.comments-table{ border: none; background-color: none; border-spacing: 10px; direction: rtl; } .comments-table td{ background: transparent; border: 3px solid var(--header); direction: ltr; border-width: 3px 4px 3px 5px; border-radius:95% 4% 92% 5%/4% 95% 6% 95%; transform: rotate(2deg); padding:7px; } .comments-table td p{ transform: rotate(-2deg); } .comments-table td:first-child{ border: none; filter: drop-shadow(-1px 4px 4px var(--header)); } .comments-table td:first-child img{ clip-path:polygon(7% 0, 0 89%, 37% 86%, 38% 100%, 52% 86%, 94% 82%, 100% 6%); } /* mobile code DON'T DELETE */ @media(max-width: 600px){ body{ background-size: contain; } .edit-info, .blog-entry .content, footer{ padding:50px; } #comments{ padding:50px; } nav .links{ padding-left:50px; padding-right:50px; padding-bottom:none; padding-top: none; } } </style>