Magenta Cyber Tech V2

Tags: magenta, cyber, y2k, 2000s, tech, code
Description:

Magenta variation :)
Preview:

click on the image for a larger preview
Code:

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

<style>

@font-face {
  font-family: 'Astron Boy Video';
  src: url('https://dl.dropbox.com/s/uyofwenkjvs3p7d/astron%20boy%20video.woff2');
}

@font-face {
  font-family: 'We Are Alien';
  src: url('https://dl.dropbox.com/s/elp9x37vek8l97z/wearealien.woff2');
}


.logo {
  filter: sepia(100%) hue-rotate(240deg) saturate(200);
}

body {
  background: url(https://i.imgur.com/rIpdK2H.gif);
   background-size: 100%;
}

nav .top {
  background: transparent;
   color: white;
    border-style: dashed;
     border-width: 2px;
      border-radius: 10px;
       border-color: magenta;
}

nav .links {
  background-color: transparent;
}

nav .links a {
  color: white;
}

nav .links a:hover {
  color: magenta;
}

.profile {
  background: transparent;
   border-style: dashed;
    border-width: 2px;
     border-radius: 10px;
      border-color: magenta;
       background-size: 100%;
}

.profile h1 {
  color: magenta;
   font-family: 'Astron Boy Video';
    font-size: 50px;
}
.online {
  color: white;
   font-family: 'We Are Alien';
}

.online img {
  content: url("https://i.pinimg.com/originals/c3/97/7d/c3977d7be06576701fd39950123b13d6.gif");
   animation-name: none;
    visibility: visible;
     height: 60px;
      width: 60px;
}

time.ago {
  color: magenta;
}

a {
  color: white;
   text-decoration: none;
    font-family: 'We Are Alien';
     font-size: 15px;
}

a:hover, a:active, .blog-entry .kudos-btn:hover, .blog-entry .kudos-btn:active {
  color: magenta;
   text-decoration: underline;
}

.profile .blurbs .section h4 {
  color: white;
   margin: 0;
    font-family: 'We Are Alien';
     font-size: 15px;
}

.profile .blurbs .heading, .profile .friends .heading {
  background: black;
   color: magenta;
    font-family: 'Astron Boy Video';
     font-size: 18px;
}

.profile .contact .heading, .profile .table-section .heading, .home-actions .heading {
  background: black;
   color: magenta;
    font-family: 'Astron Boy Video';
     font-size: 18px;
}

.profile .contact, .profile .url-info, .profile .table-section, .home-actions {
  width: 100%;
   border: 2px solid black;
    margin: 10px 0;
}

.details-table td:first-child {
  background: black;
   color: magenta;
    width: 33%;
     font-family: 'Astron Boy Video';
      font-size: 18px;
}

.details-table td {
  background: black;
   color: white;
    font-family: 'We Are Alien';
     font-size: 15px;
      vertical-align: top;
}

.comments-table td:first-child, .music-table td:first-child {
  background: black;
}

.comments-table td, .music-table td {
  background: black;
}

main {
  color: magenta;
   font-family: 'Astron Boy Video';
    font-size: 15px;
     background: transparent;
}

.count {
  color: white;
}

footer {
  background: transparent;
}

.friends a p {
  color: magenta;
   font-family: 'Astron Boy Video';
}

.comments-table td {
  color: magenta;
   font-family: 'We Are Alien';
}

.general-about .details {
  font-family: 'We Are Alien';
   color: white;
}

.profile .mood p {
  color: white;
   font-family: 'We Are Alien';
}

.profile .mood p b {
  color: magenta;
   font-family: 'Astron Boy Video';
}

.blog-preview p {
  font-weight: bold;
}

.links .special a:link, .links .special a:visited {
  color: white;
}

.links .special a:hover {
  color: magenta;
}

.logout-btn, .logout-form {
  color: white;
   font-family: 'We Are Alien';
}

.profile .blurbs .section p {
  color: white;
   font-family: 'We Are Alien';
}

.profile .url-info p {
  color: white;
   font-family: 'We Are Alien';
}

.profile .url-info p b {
  color: magenta;
   font-family: 'Astron Boy Video';
}

.profile .blurbs .section {
  color: black;
}

.profile .contact .icon {
  display: none;
}

.profile-info {
  background: black;
   border-style: dashed;
    border-width: 2px;
     border-radius: 10px;
      border-color: magenta;
}

.blog-preview {
  background: black;
   border-style: dashed;
    border-width: 2px;
     border-radius: 10px;
      border-color: magenta;
}

.profile .blurbs {
  background: black;
   border-style: dashed;
    border-width: 2px;
     border-radius: 10px;
      border-color: magenta;
}

.friends {
  background: black;
   border-style: dashed;
    border-width: 2px;
     border-radius: 10px;
      border-color: magenta;
}

.general-about {
  background: black;
   border-style: dashed;
    border-width: 2px;
     border-radius: 10px;
      border-color: magenta;
}

.profile .mood {
  background: black;
   border-style: dashed;
    border-width: 2px;
     border-radius: 10px;
      border-color: magenta;
}

.profile .contact {
  background: black;
   border-style: dashed;
    border-width: 2px;
     border-radius: 10px;
      border-color: magenta;
}

.profile .url-info {
  background: black;
   border-style: dashed;
    border-width: 2px;
     border-radius: 10px;
      border-color: magenta;
}

.profile .table-section {
  background: black;
   border-style: dashed;
    border-width: 2px;
     border-radius: 10px;
      border-color: magenta;
}

.details-table td:first-child {
  border-style: dashed;
   border-width: 2px;
    border-radius: 10px;
     border-color: magenta;
}

.details-table td {
  border-style: dashed;
   border-width: 2px;
    border-radius: 10px;
     border-color: magenta;
}

.profile .table-section .heading {
  border-style: dashed;
   border-width: 2px;
    border-radius: 10px;
     border-color: magenta;
}

.profile .contact .heading {
  border-style: dashed;
   border-width: 2px;
    border-radius: 10px;
     border-color: magenta;
}

.profile .blurbs .heading {
  border-style: dashed;
   border-width: 2px;
    border-radius: 10px;
     border-color: magenta;
}

.profile .friends .heading {
  border-style: dashed;
   border-width: 2px;
    border-radius: 10px;
     border-color: magenta;
}

table.comments-table {
 border-width: 2px;
  border-color: magenta;
}

}
.contact .inner a img {
       font-size: 0;

}
   .contact .inner a img:before {
       font-size: 1em;
    display: block

}
   .contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
   	/* Add to Friends */
	content: "☆"

}
   .contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
   	/* Add to Favorites */
	content: "☆"

}
   .contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
	/* Send Message */
	content: "☆"

}
   .contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
	/* Forward to Friend */
	content: "☆"

}
   .contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
	/* Instant Message */
	content: "☆"

}
   .contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
	/* Block User */
	content: "☆"

}
   .contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
	/* Add to Group */
	content: "☆"

}
   .contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
	/* Report Profile */
	content: "☆"

}

</style>

<style>
* {
  cursor: url("https://i.imgur.com/5IUJBMw.png"), auto;
}

input {
  cursor: url("https://i.imgur.com/Rk3uX1W.png"), auto;
}

a {
  cursor: url("https://i.imgur.com/140RLqB.png"), auto;
}

button {
  cursor: url("https://i.imgur.com/140RLqB.png"), auto;
}

.logout-btn {
  cursor: url("https://i.imgur.com/140RLqB.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 2 of 2 comments ( View all | Add Comment )
N30?!
1756551819
using :D
Report Comment
MISS FEMI9
1731902990
the matrix background didnt load for me :(
Report Comment
Same but i fixed it by finding the same gif online. Just go to google imgs, type in what gif u want n just experiment until u achieve ur profile goal! :D
by N30?!; 1756551907; Report