ocean layout (shells, sharks, ocean)

Tags: shark, ocean, seal, shell, water, blue, light blue

Description:

hey this is one of my firsts layouts and im a noob in css :P i hope this is fine and maybe i will update this when i improve my programming skills lol...

Preview:

click on the image for a larger preview

Code:

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

<style>
body {
background: url(https://tenor.com/pt-BR/view/water-pool-ocean-sea-gif-5306795.gif)
}
</style>

<style>
main:before {
	width: 100%;
	height: 300px;
	display: block;
	content: '';
	background-image: url(https://tenor.com/pt-BR/view/ocean-shark-gif-20676612.gif);
	background-position: center center;
	background-size: cover;
}
@media only screen and (max-width: 600px) {
	main:before{
		height: 200px;
	}
}
</style>

<style>
body::before {
  content: ' ';
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%);
  z-index: 100;
  background-size: 100% 2px, 3px 100%;
  pointer-events: none;
}
</style>

<style>
  @import url("https://fonts.googleapis.com/css2?family=Patrick+Hand&display=swap'");
  * {
    font-family: 'Patrick Hand', cursive;;
    font-size: 105%;
  }
</style>

<style>
:root {
    --logo-blue:#c9f9ff;
    --darker-blue: #ff9eb6;
    --lighter-blue: #a4e2eb;
    --even-lighter-blue: ;
    --lightest-blue: ;
    --dark-orange: #235163;
    --light-orange: #a4e2eb;
    --even-lighter-orange: #def6ffk;
    --green: pink;
}
</style>

<style>
  .profile {
    background: url(https://i.pinimg.com/564x/8c/58/2b/8c582bd0b0c03ce884fc53589e0787b7.jpg);
  }
</style>

<style>

.profile .contact, .profile .table-section, .profile .url-info, .profile .friends, .profile .blurbs, table.comments-table, DIV.blog-preview { 
border-style:Double;
 border-width:10px; 
 border-color:#ffddd1; ;
background:#a4e2eb;
}

</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 3 of 3 comments ( View all | Add Comment )

Calvin K

1738724043

Using!

Report Comment

OxyMoron

1721271224

yo I yoinked that dope shark gif, thanks!!

Report Comment

cami

1706498526

hola, sabes como puedo poner solo la parte de los tiburones?

Report Comment

copia esto en tu "about me"

main:before {
width: 100%;
height: 300px;
display: block;
content: '';
background-image: url(https://tenor.com/pt-BR/view/ocean-shark-gif-20676612.gif);
background-position: center center;
background-size: cover;

by cuponoodleking; 1715516626; Report