my emo layout

<style>

@import url('https://fonts.googleapis.com/css2?family=Potta+One&display=swap');

body{font-family: "potta one" ;}

 



TO ADD YOUTUBE VIDEO CLICK SHARE, EMBED, COPY THEN PASTE HERE ONLY CHANGING THE WIDTH AND HEIGHT TO 350 AND 215

</style>



<style>

body {

    background: url(https://i6.glitter-graphics.org/pub/156/156996u4vu4loeqc.gif);

     background-repeat: repeat;

}

.profile {

background-image:url(https://i6.glitter-graphics.org/pub/60/60626mz5ralzd5b.gif);

  background-repeat: repeat;

    border-radius: 12px;

}

/*the username glow and shadow*/

h1

{

color: /*the username glow and shadow*/

h1

{         color: turquoise; 

//text-shadow: 1px 1px #ffd1dc;

};

text-shadow: 2px 2px 3px #ffd1dc, 0 0 25px #ffd1dc, 0 0 5px black;

}

h1, h2, h3, h4,h5,a, p, nav label, .section

{

main, top, links, nav .top, nav .links, details-table

{

    background:  !important;

background-image:url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQxglB6HuuVwjaIOwdfBEXxvtDkuWJ2ehpAJg&usqp=CAU);

background-size: cover !important;

    padding: 0 !important;

    /*font-size: small;*/

    color: #00FFEF;

{


.mood

text-transform:uppercase !important;

}


table, td

}

/* border: 1px solid var(--url-pink-bg)!important; */

border-spacing: 2px;

}


.profile .contact, .profile .url-info, .profile .table-section, .home-actions

{

    width: 100%;

    border: 2px solid var(--#ffd1dc);

}

table, th, td


}

   border: 1px solid #ffd1dc;

   border-spacing: 2px;

}

.blog

}   

   border: 10px solid #ffd1dc;

}

.profile .contact, .profile .url-info, .profile .table-section, .home-actions

}

   width: 100%;

   border: 4px outset #ffd1dc;

   margin 10px 2;

}


.online

{

  color: gold!important; 

  //text-shadow: 1px 1px turquoise;

}


:root 

{

--logo-blue: ;

  --darker-blue: ;

--lighter-blue: purple 55;

--even-lighter-blue: ;

--lightest-blue: ;

--dark-orange: ;

--light-orange: ;

--even-lighter-orange: ;

--turquoise: ;

        

        --table-header:#ffd1dc;

--table-color: white;

--link-text: white;

--main-text: white;


    }   

main 

{

  /* changes made to stuff outside of columns */

    background: black;

    padding: 0;

    font-size: small;

    color: #00FFEF;

text color: turquoise;

  text-shadow: 1px 1px 2px #000000, 0 0 25px #000000, 0 0 3px #000000; 

}

footer 

{

    background: turquoise!important;

}

.comments-table{

display: block;

height: 500px;

overflow-y: scroll;

Border-radius: 15px; 

color: turquoise;

  text-shadow: 1px 1px 2px #000000, 0 0 25px #000000, 0 0 3px #000000; 

}

.contact {

  border-radius: 8px;

  background-image: url(https://i.ibb.co/VLWSLPS/tumblr-c663acddb9292fea0820d5938f5a8483-1f21e250-540.gif);

  background-position: right top;

  background-repeat: repeat;

background-attachment: scroll;

Width: 310px;

Height:180px;


color: black;

  text-shadow: 1px 1px 2px #39ff14, 0 0 25px #39ff14, 0 0 3px #39ff14; 

}

.friends th, tr, .friends td, th, .icon, main, .comments-table, .friends, .profile-info, .table, .table-section,  .url-info, .mood, .blurbs, .blog-preview, .details, 

{

border: 1px curve #000000 !important;

outline: curve !important;

}

img

{

border-radius: 12px;

}


main {

background:  black;

border-radius: 14px;

padding: 0;

font-size: 85%;

color: #000000;

}


nav, footer, .profile .contact {

display: inherit !important;

opacity: 1 !important;

border-radius: 12px;

}

main {

background:  ;

border-radius: 12px;

border: 12px solid #000000;

padding: 0;

font-size: 90%;

color: #00FFEF;

}

nav .top {

  background: transparent;

}


nav .links {

  background: rgba(0, 0, 0, 0.3);

}


nav { background-image: url(https://64.media.tumblr.com/b305a18f19862af6acf46fdad8949649/b5987e3961527536-94/s2048x3072/a25f22fd8a7d5c893f8edb36aab4fdc807234922.gif) 

}



/*customising interests box*/

  .profile .table-section{

    border:2px solid #c50576;

    border-radius: 15px;

  }

  .profile .table-section .heading{

    background:#000000;

    border: 1px solid #c50576;

    border-radius: 15px 15px 0px 0px;

    text-align: center;

  }

  .profile .table-section .heading h4{

    color: #c50576;

    text-shadow: 1px 1px 2px black;

  }

  .profile .table-section .details-table td{

    background-image:url(https://64.media.tumblr.com/1e2598616e90eb0f6b243be1b9642ae1/5583e57f872090cb-79/s2048x3072_c0,21726,100000,77976/ccaa0b27eaa3ea333eeb0df8a6838f4600d3117c.gif);

    padding-right: 10%;

  }

 /*customising friend space heading*/

  .profile .friends .heading{

    background: #c50576;

    color: #ffffff;

    text-shadow: 1px 1px 2px black;

    text-align: center;

  }

  .profile .friends .heading h4{

    text-align: center;

    color: #ffffff;

    text-shadow: 1px 1px 2px black

  }

.general-about {

background-image: url(https://64.media.tumblr.com/1e2598616e90eb0f6b243be1b9642ae1/5583e57f872090cb-79/s2048x3072_c0,21726,100000,77976/ccaa0b27eaa3ea333eeb0df8a6838f4600d3117c.gif);

padding: 20px;

border-radius: 10px;

box-shadow: 4px 4px 0 #2d1157;

text-align: center;

animation: nineties2 2s ease 0s infinite normal none;

animation-delay: .46s;

}

.profile .blurbs .section :nth-child(2) {

background-image: url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQxglB6HuuVwjaIOwdfBEXxvtDkuWJ2ehpAJg&usqp=CAU);

     /* margin-top: -5px; */

padding: 18px;

box-shadow: 4px 4px 0 #000;

}


.profile .profile-info .inner h3 {

filter: drop-shadow(3px 3px 0 #000000);

margin: 0!important;

color:#FFF;

}

.profile .profile-info .inner h3 a {

color: #FFFFFF;

}

.profile .profile-info {

background-image: url(https://64.media.tumblr.com/d62f9c09497fe39ad002fb18c45bf61b/2c14b464e52d1596-fa/s400x600/db8362b0df0aae30ad31efa61ff058b9f1b91317.jpg);

padding: 20px;

border: none;

border-radius: 10px;

box-shadow: 4px 4px 0 #2d1157;

text-align: center;

animation: nineties2 2s ease 0s infinite normal none;

animation-delay: .15s;

border: none;

}


.scroll {

width: 400px;

height: 300px;

overflow: scroll;

overflow-x: hidden;

overflow-y: scroll;

}

.scroll::-webkit-scrollbar {

width: 16px;

height: 16px;

}


.scroll::-webkit-scrollbar-track {

background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAAFElEQVQIW2M4fPz0////GYAYyAIASnoKpV3w4kgAAAAASUVORK5CYII=");

image-rendering: pixelated;

-webkit-filter: grayscale(100%);

-moz-filter: grayscale(100%);

-ms-filter: grayscale(100%);

-o-filter: grayscale(100%);

filter: grayscale(100%);

}


.scroll::-webkit-scrollbar-track:active {

background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAAEElEQVQIW2No6+pjgAAgCwAWogM9VKrgGQAAAABJRU5ErkJggg==");

-webkit-filter: grayscale(100%);

-moz-filter: grayscale(100%);

-ms-filter: grayscale(100%);

-o-filter: grayscale(100%);

filter: grayscale(100%);

}


.scroll::-webkit-scrollbar-thumb {

border-top: 1px solid #cccccc;

border-left: 1px solid #cccccc;

border-right: 1px solid black;

border-bottom: 1px solid black;

box-shadow: inset 1px 1px 0 0 white, inset -1px -1px 0 0 #868a8e;

width: 16px;

height: 16px;

background-color: #cccccc;

z-index: 1;

}


.scroll::-webkit-scrollbar-corner {

background-color: #cccccc;

}


.scroll::-webkit-resizer {

width: 16px;

height: 16px;

background-color: #cccccc;

background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAN0lEQVR4Ae3MgQUAMBRDwU5fFF05lb/CARTBw2Ulof0DxPtcwp3hNuEYnjbcEW4TjuFpwx3h9gMWGgZ2Y/PT2gAAAABJRU5ErkJggg==");

background-position: bottom right;

background-repeat: no-repeat;

image-rendering: pixelated;

}


.scroll::-webkit-scrollbar-button, .scroll::-webkit-scrollbar-button {

border-top: 1px solid #cccccc;

border-left: 1px solid #cccccc;

border-right: 1px solid black;

border-bottom: 1px solid black;

box-shadow: inset 1px 1px 0 0 white, inset -1px -1px 0 0 #868a8e;

display: block;

width: 16px;

height: 16px;

background-color: #cccccc;

image-rendering: pixelated;

background-repeat: no-repeat;

background-position: center center;

}


.scroll::-webkit-scrollbar-button:active, .scroll::-webkit-scrollbar-button:active {

background-position: 2px 2px;

}


.scroll::-webkit-scrollbar-button:horizontal:decrement, .scroll::-webkit-scrollbar-button:horizontal:decrement {

background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAQAAAD8fJRsAAAAHklEQVQY02NgoBT8xyX8H5fwf1zCpOjAYwceV1EEAAO2D/HsQ4vsAAAAAElFTkSuQmCC");

}


.scroll::-webkit-scrollbar-button:horizontal:increment, .scroll::-webkit-scrollbar-button:horizontal:increment {

background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAQAAAD8fJRsAAAAHUlEQVQY02NgIB/8xy3xH7fEf9wS/0nUQZqrKAYAK44P8ZRmzLQAAAAASUVORK5CYII=");

}


.scroll::-webkit-scrollbar-button:vertical:decrement, .scroll::-webkit-scrollbar-button:vertical:decrement {

background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGklEQVR4AWMYxuA/SYphmETFhDX9x4mHGQAAcL4P8dQiMq8AAAAASUVORK5CYII=");

}


.scroll::-webkit-scrollbar-button:vertical:increment, .scroll::-webkit-scrollbar-button:vertical:increment {

background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAQAAAD8fJRsAAAAF0lEQVQY02NgoBf4jwJxSOHQhcNAOgMAWWAP8Rv2U3UAAAAASUVORK5CYII=");

}


.scroll::-webkit-scrollbar-button:horizontal:increment:start, .scroll::-webkit-scrollbar-button:horizontal:increment:start {

display: none;

}


.scroll::-webkit-scrollbar-button:horizontal:decrement:end, .scroll::-webkit-scrollbar-button:horizontal:decrement:end {

display: none;

}


.scroll::-webkit-scrollbar-button:vertical:increment:start, .scroll::-webkit-scrollbar-button:vertical:increment:start {

display: none;

}


.scroll::-webkit-scrollbar-button:vertical:decrement:end, .scroll::-webkit-scrollbar-button:vertical:decrement:end {

display: none;

}


::-webkit-scrollbar-button:active, ::-webkit-scrollbar-button:active {

border-top: 1px solid #868a8e;

border-left: 1px solid #868a8e;

border-bottom: 1px solid #868a8e;

border-right: 1px solid #868a8e;

box-shadow: none;

}

</style>



0 Kudos

Comments

Displaying 0 of 0 comments ( View all | Add Comment )