toypaj layout . . . again

Tags: blink-182, red, green, yellow, music, punk, black, 2000s
Description:

red / yellow / green themed layout based on the album take off your pants and jacket by blink-182, includes the song reckless abandon and hides your url . paste into your about me
Code:

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

<style>

      
    .search-wrapper input[type=text] {
        font-family: Garamond;
        background-color: white!important;
        border: 1px solid!important;
        border-radius: 10px !important;
    }
    
    button{
        border-radius: 0px !important;
        border: 1px solid white!important;
        text-transform: lowercase; 
        font-family: josefin ssns;
        font-size: 15px!important;
        background-color:green!important;
        width:;
        color: black!important}
       
body {
  background-image: url(https://i.pinimg.com/originals/b2/5f/2f/b25f2fc9abe52b2d559a8e3c9a337a0a.jpg);
  background-position: ;
}
main {
    background-image: url(https://magma.com/shared/wwHTTmPde44DeBf7yVQAuw);
    background-size:contain;
    border-radius:20px;
    border-left: 2px solid darkred;
    border-top: 2px solid yellow;
        border-right: 2px solid darkgreen;
        background-opacity: ;
}
    
    .container {
        border-radius: 0px 0px 0 0;
        overflow: hidden;
        padding: 30px;
        margin-top: 0px;
    }
    .profile .contact, .profile .url-info, .profile .table-section, .home-actions {
        border:;
    }
    
    .contact {
        background: rgba(0, 0, 0, 0.8);
        border-radius: 10px;
    
}
profile {
    background-color: #fff;
} 
    
    .online img {
        content: url(https://64.media.tumblr.com/c15e1b19b3a28703251e3d8bf1a19cd7/6a9f82c7ed6d0c50-94/s1280x1920/9fdd39982a95a62dd8892ac16732156f41d98dfe.pnj);
        height: 2.9em;
        margin-right: 5px;
        animation-name: blink;
        animation-iteration-count: infinite;
        animation-duration: 1s;
    }
     @keyframes blinkingText{
        0%{     color: #eb3434;    }
        12.5%{    color: #eb3434; }
        37.5%{    color: #eb3434; }
        50%{    color: #ebd834; }
        62.5%{    color: #ebd834; }
        75%{    color: #ebd834; }
        87.5%{    color: #1ee33e; }
        100%{    color: #1ee33e; }
    }
    .count {
        color: red;
        text-shadow: 0px 0px 6px;
        animation:blinkingText 0.5s infinite;
    } .profile .friends .person p {
        color: blueviolet;
        text-shadow: 0px 0px e;
        font-weight: bold;
        width: 100%;
        word-break: break-word;
        font-size: 100%;
        text-align: center;
        animation:blinkingText 3.2s infinite;
}
 .profile-pic {
        border: 3px solid darkred;
        box-shadow: 0px 0px 7px black;
        border-radius: 30px;
        overflow: hidden;
    
     }
    
    a {
        color: rgba(10, 182, 12, 0.72);
    }
    
    a:hover {
        animation:blinkingText 1.5s infinite;
    }
      
    .blog-preview p {
        font-size: 1.2rem;
    }
    
    .online {
        color: green;
        font-weight: bold;
        font-size: 80%;
    }
    
    .online img {
        content: url(https://64.media.tumblr.com/c15e1b19b3a28703251e3d8bf1a19cd7/6a9f82c7ed6d0c50-94/s1280x1920/9fdd39982a95a62dd8892ac16732156f41d98dfe.pnj);
        height: 2.9em;
        margin-right: 5px;
        animation-name: blink;
        animation-iteration-count: infinite;
        animation-duration: 1s;
    }
    .contact {
        font-size: 11px;
        font-family: helvetica;
        border: dotted 0px!important;
        background-image: url("")!important;
        background: ;
        border-top: 0px;
    }
        
 .icon, .award img {
        content: url(https://64.media.tumblr.com/184db5a7337d3fe790ca29aafcc52ffd/224a089e58d83c00-e2/s2048x3072/f9e6f2df3c5c75adbfa76db26ffde9bc2b465a89.pnj);
        height: 10px;
        width: 10px;
    }
    /* HEADINGS SETTINGS */

.profile .table-section, .profile .url-info, .profile .contact {
    border: 1px solid black;
}
.profile .table-section .heading, .profile .contact .heading {
    color: black;
    text-shadow: -1px 1px 1px white;
    background: linear-gradient(#3f840d,#e4b746,#9f1b26);
    border-radius: 5px;
    border-bottom: 1px solid black;
}
.profile .blurbs .heading, .profile .friends .heading
 {
    color: black;
    text-shadow: -1px 1px 1px white;
    background: linear-gradient(#9f1b26,#e4b746,#3f840d);
    border-radius: 5px;
    border: 1px solid black;
}
.url-info {display: none !important;} /* to hide the url */
.blurbs .heading{display: none !important;} /* to hide the blurbs heading */

</style>
    <style>
    
/* this adjusts the size/font of your name */
  @import url('https://fonts.googleapis.com/css2?family=EB+Garamond:wght@800&display=swap');
h1{
font-size: 30px !important;
font-family: 'josefin sans', sans-serif;	
text-transform:lowercase !important;
padding-left: 2px !important;
}
</style> 

<style> 
/* this changes the color of your name */
.profile h1{
background: -webkit-linear-gradient(#9f1b26,#e4b746,#3f840d);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
/* this is what makes the text bold/look bigger */
p{
font-size: 14px !important;
font-weight: bold;
 text-transform:none !important;
}/* links in the navigation bar @ the top */
nav{ 
font-size: 13px !important;
font-family: 'Paytone One', sans-serif;
text-shadow: 1px 1px black;
text-transform:none;
padding-left:3px;
text-align: center;
}
</style>
<style> 
/* this is the box that says "_'s latest blog entries" */
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@700&family=Roboto:wght@700&display=swap');
DIV.blog-preview{
text-align: center;
font-family: 'Josefin Sans', sans-serif;
background-color:rgba(0, 0, 0, 0.7);
text-transform:lowercase !important;
color: white;
border-radius:15px;
border: 1px solid darkred
}
</style>
<style>
   
    .friends {
        border-radius: 20px;
        background: rgba(0, 0, 0, 0.82);
        margin-bottom: 20px;
    }

/* friend comments */
.profile .friends .comments-table td {
background-color: rgba(0, 0, 0, 0.7);
border: 1px solid darkred;  
}
.comments-table td*{
    
    
}
</style>
<style>
/* colors for interest section */
.profile .table-section .details-table td {
background-color:rgba(0, 0, 0, 0.7);
}
</style>
<style> 
/* these are the colors for headers */
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@700&family=Roboto:wght@700&display=swap');
p{
font-family: 'Josefin Sans', sans-serif;
text-transform:lowercase !important;
color:#fff;
}
</style>
<style>


main:after {
 width: 100%;
 height: 180px;
 display: block;
 content: "";
 background-image: url('https://th.bing.com/th/id/R.e5e1790a1d0e75680a400a8d7e87bcbd?rik=ckYr4k7EalnlMQ&pid=ImgRaw&r=0&adlt=strict');
 background-position: center;
 background-size: cover;
 border-radius: 10px;
}{
    background:  !important;
	background-image:   !important;
	background-size: cover !important;
    padding: 0 !important;
    /*font-size: small;*/
    color: #00FFEF;
{
	
main, top, links, nav .top, nav .links, details-table
{
    background:  !important;
	background-image:   !important;
	background-size: cover !important;
    padding: 0 !important;
    /*font-size: small;*/
    color: #00FFEF;
{

.m
 </style>
<style>
    
</style>




<style>
/* change logo color at https://codepen.io/sosuke/pen/Pjoqqp */

nav {
    background: black;
    border-radius:15px;
}

nav .top {
    background: #000 ;
    border-radius: 15px;
    
}

nav .top a {
    color: gold!important;
}

nav .links {
    background: transparent!important;
    text-align: center;
}

nav img.logo {
  filter: invert(70%) sepia(50%) saturate(3091%) hue-rotate(334deg) brightness(85%) contrast(104%);
}

nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
    content: " | ";
    color: var(--headers);
    
</style>
<style>
}
@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}
@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}
.profile-pic img:hover{
  animation: rotation 1s infinite ;
  /*makes your pfp spin when you hover. put your avatar in the blender, for absolutely no cost !!*/
}
</style>
<style>
/* this centers your friend space */
    .profile .friends .inner, .profile .blurbs .section h4{
    text-align: center;
    }   

table.comments-table{
    display: block;
    height: 250px!important;
    overflow-y: scroll;
    background: url(http://images6.fanpop.com/image/photos/43100000/Game-Over-saw-43192012-540-367.gif);
    color: #ffffff;
   }
.footer {display: none !important;} /* to hide the url */
</style>

<iframe width="560" height="315" src="https://www.youtube.com/embed/csO9ZNuqiMY" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen=""></iframe>
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.