Silent Hill 2 layout

Tags: silent hill, gaming, simple, horror

Description:

a simple SH2 layout

I made it very transparent (unhovered) to go for a "foggy" vibe :]

and the fog at the bottom of the background moves!

if you like/use it, please comment! I'd love to see it on others profiles.

this is what is looked like when hovered over;

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by JDevil  (https://layouts.spacehey.com/layout?id=1812) -->

<style>
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,700;1,600&display=swap');
</style>
<style>
nav .top{
   background: rgba(0, 0, 0, 0.8);
}
nav .links{
   background: rgba(0, 0, 0, 0.8); 
   font: georgia;
   color: #c4c4c4;
}
nav .links a:hover{
   color: #c63800;
   text-decoration: none;
}

body {         
   background-image: url(https://64.media.tumblr.com/185b358e666a2deee0e4dd8156142156/64e799d2cbd5e21a-d8/s640x960/f31baa79df1a2b0a327fef6e6029eb24ac9fec84.gif);
   background-color: rgba(0, 0, 0);   
   background-repeat: no-repeat;
   background-size: 100%;   
   background-attachment: fixed; 
   opacity: 0.65;
}  
p {
  font-family: georgia;
  font-size: 12px;
  color: #d3d3d3;
} 
b {
  font-weight: normal;
  font-family: georgia;
}

h1{
   font-size: 40px!important;
   font-family: 'Cormorant Garamond', serif;
   color: #91b1b7;
   text-shadow: 0 0 3px #b8d8dd;
   line-height: 80px;
   background: none;
   background-image:url(https://64.media.tumblr.com/e1b241d04e68209fdd7b8e12a61fa74f/93eec88b6c306a68-3b/s100x200/0bc6d54af3bb0777c71178e4e9859cb2bde1e37a.png);
  background-repeat: no-repeat;
  background-position: right;
}
main {   
   background-image:url(https://www.silenthillmemories.net/shm/wallpapers/pics/sh_the_movie_wallp_03_1600.jpg);
   background-color: rgba(0, 0, 0, 0);
   background-repeat: repeat;
   background-attachment: fixed;   
   padding: 10px;
      opacity:0.45;
    transition: opacity 0.45s ease-out;
    -moz-transition: opacity 0.45s ease-out;
    -webkit-transition: opacity 0.45s ease-out;
    -o-transition: opacity 0.45s ease-out;
} 
main:hover {
  background-image:url(https://www.silenthillmemories.net/shm/wallpapers/pics/sh_the_movie_wallp_03_1600.jpg);
  background-color: #000000;
  opacity:1.0;
  filter:alpha(opacity=100);
}  

a {
  color: #bce3ff;
}
a:hover {
  color: #cc4000;
}
.general-about {                        
   text-align: left;  
} 


.online{content:url("https://dl.glitter-graphics.com/pub/944/944811pepyacdzo7.gif");
}
.profile .mood {  
   border: solid 1px #c63800; 
   background-image: (none); 
   background-color: rgba(0, 0, 0, 0.2);      
   text-align: center; 
   text-transformation: lowercase;
} 

.profile .contact .heading {     
    background: rgba(0, 0, 0, 0.08);     
    text-align: left; 
    color: #87a6bc;  
}  
 .profile .contact {             
    background-image: url(https://hdwallpaperim.com/wp-content/uploads/2017/09/17/62415-Silent_Hill__2-james_sunderland-748x421.jpg);   
    background-position: center;  
    background-repeat: none;    
    background-attachment: scroll;
    background-size: 100%;  
    Height:150px;    
    font-size: 12px;
    font-family: georgia;
    border: none;  
}
.contact a{      
   font-family: 'Cormorant Garamond', serif;
   text-transformation: lowercase;
   font-size: 12px; 
   color: #c4c4c4; 
}
.contact a:hover{     
   color: #87a6bc;   
}
.icon {
   height:0px;
   width:0px;
}
.profile .url-info {
   border:none;
}
.profile .table-section{
   border: solid 0px #000; 
}

.profile .table-section .heading {
   background-color: rgba(0, 0, 0, 0.6);
   text-align: left;  
   font-color: #c4c4c4;
   font-family: georgia;
   text-transform: lowercase;
}

.details-table td {   
   background-color: rgba(0, 0, 0, 0.8);  
   color: #bce3ff;         
   padding: 5px; 
}
.details-table td:first-child {  
   background-color: rgba(0, 0, 0, 0.6);      
   color: #c4c4c4;  
   padding: 5px; 
} 
.blog-preview  {       
    border: solid 1px #000000;
   -moz-border-radius: 5px; 
   -webkit-border-radius: 5px; 
   background-color: rgba(115, 192, 214, 0.8);  
   background-image:url(https://64.media.tumblr.com/96dcb589db6e402a71a69516eb1241ef/f4b080ed810d9bff-42/s500x750/b890079f6dac0b92012f7d6cd230f5c7e50ce988.png);
   background-position: center;
   background-size: 100%; 
   opacity:0.5;
    transition: opacity .5s ease-out;
    -moz-transition: opacity .5s ease-out;
    -webkit-transition: opacity .5s ease-out;
    -o-transition: opacity .5s ease-out;
} 
.blog-preview:hover {
    opacity:1.0;
  filter:alpha(opacity=100);
}
h4 {
     font-family:georgia;
     font-size: 11px;
     color: #c4c4c4;
}

.profile-info {
     height: 50px;
     font-family:georgia;
     font-size: 11px;
}
.profile .blurbs .heading {
    background: rgba(0, 0, 0, 0.4);
    font-family: 'Cormorant Garamond', serif;
    color: #c4c4c4;
    font-size: 11px;
}

.profile .blurbs .section h4{
    background-color:rgba(198, 56, 0, 0.4);
    color: #ffffff;
}

.profile .blurbs .section p {
   word-wrap: break-word;
}
.profile .friends .heading {
   background: rgba(0, 0, 0, 0.4);
    font-family: 'Cormorant Garamond', serif;
    color: #c4c4c4;
    font-size: 11px;
}

.comments-table td {   
   background: rgba(0, 0, 0, 0.4);              
   font: verdana;        
   font-size: 10px;   
   padding: 10px; 
} 
.comments-table td p {   
   text-align: left!important;
   background: rgba(0, 0, 0, 0.4);   
} 

:root {
--light-orange: rgba(0, 0, 0, 0.6);
}
.count {
   color: #1c63800;
}
   /*scrollbar*/
/* width */
::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #c4c4c4; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #78add3; 
  border-radius: 5px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #c63800;
  border-radius: 5px; 
}
footer {
    height:80px;
    background: rgba(0, 0,0, 0.8);  
    
}
footer a {
    color: #78add3;
}
</style>

<!-- Cursor -->
<style>body { cursor: url('https://64.media.tumblr.com/61e7056b4c9f2be60693cd9fd88e93e5/b3ad292faaa7e0c6-04/s75x75_c1/d33b6bf48b39d0497286e28873fcb46177edd4a8.png'), auto; }</style>

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.

Comments

Displaying 20 of 117 comments ( View all | Add Comment )

Shero	1732463571 Using Report Comment
Daniar	1732124824 using Report Comment
Ethan_Shiff	1731898770 Thank you soooo much :) Report Comment
𝘸𝘪𝘻𝘢𝘳𝘥𝘮𝘪𝘻𝘦𝘳	1731606628 Using Report Comment
𝓧𝓪𝓿𝓲𝓮𝓻 ☦︎	1731546701 USING! THEM :3 Report Comment
KoffeKatt	1730834536 using :3 Report Comment
☆ Elliott	1729643305 using Report Comment
𝚊𝚕𝚎𝚜𝚜𝚊∘°∘♡∘°∘	1729638367 using Report Comment
Lust	1729207968 Using Report Comment
Lust	1729207968 Using Report Comment
dvdz	1729206330 maybe using!! Report Comment
cubixtwist	1728835253 using Report Comment
charlie	1728219884 using Report Comment
radikrill	1727874330 using!! Report Comment
unknown	1727430743 using Report Comment
Ripperdoc	1725930482 using :) Report Comment
percy !!!!!!!!!	1725895446 using! Report Comment
FINNSTER	1724898857 using! Report Comment
\pierce, $\pierce,'s profile picture$	1723261612 using!! Report Comment
The_Unloveable	1723244872 Using! Report Comment