« Web, HTML, Tech Forum

My Black and white and gray layout just copy and paste!

Posted by Alex

posted 1776527230

Forum: Web, HTML, Tech

View Topics View Profile

<style>

.col, main, footer, nav::before, .online, nav .links, nav .top {

animation: float 3s;

animation-iteration-count: infinite;

animation-timing-function: ease-in-out;

}

.col, main, footer, nav::before, .online, nav .links, nav .top {

animation: float 3s;

animation-iteration-count: infinite;

animation-timing-function: ease-in-out;

}

@keyframes float {

0% { transform: translate(0, 0px);

}

50% {

transform: translate(0, 8px);

}

100% {

transform: translate(0, -0px);

}

</style>

<style>

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

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

</style>

<style>

body {

background: url("https://i.pinimg.com/originals/33/ea/82/33ea82ae04a395016e2a3e21bb78c20e.gif");

}

.profile {

background-image:url(https://i.pinimg.com/736x/cd/a4/93/cda493ec2838cece79d371254f65cb5b.jpg);

background-repeat: repeat;

border-radius: 8px;

}

{

color:

{ color: white;

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

};

text-shadow: 2px 2px 3px #ffffff, 0 0 25px #ffffff, 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: !important;

background-size: cover !important;

padding: 0 !important;

/*font-size: small;*/

color: #ffffff;

{

.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(--#FB9E00);

}

table, th, td

}

border: 1px solid #ffffff;

border-spacing: 2px;

}

.blog

}

border: 10px solid #ffffff;

}

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

}

width: 100%;

border: 4px outset #ffffff;

margin 10px 2;

}

.online

{

color: gold!important;

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

}

:root

{

--logo-blue: ;

--darker-blue: ;

--lighter-blue: #000000;

--even-lighter-blue: ;

--lightest-blue: ;

--dark-orange: ;

--light-orange: ;

--even-lighter-orange: ;

--turquoise: ;

--table-header: white;

--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: #ffffff;

text color: white;

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

}

footer

{

background: white!important;

}

.comments-table{

display: block;

height: 500px;

overflow-y: scroll;

Border-radius: 8px;

color: #ffffff;

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

}

.contact {

border-radius: 8px;

background-image: url(https://i.pinimg.com/originals/a1/77/59/a1775993ba14a592ff9825089bcd842d.gif);

background-position: right top;

background-repeat: repeat;

background-attachment: scroll;

Width: 310px;

Height:180px;

color: #ffffff;

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

}

.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 none !important;

outline: none !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: #ffffff;

}

nav .top {

background: transparent;

}

nav .links {

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

}

nav { background-image: url(https://i.pinimg.com/564x/bf/5c/40/bf5c40f038483e9f4c32d6fb0912f767.jpg)

}

/*customising interests box*/

.profile .table-section{

border:2px solid #000000;

border-radius: 15px;

}

.profile .table-section .heading{

background:#000000;

border: 1px solid #000000;

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

text-align: center;

}

.profile .table-section .heading h4{

color: #ffffff;

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

}

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

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

padding-right: 10%;

}

.profile .friends .heading{

background: #ffffff;

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://i.pinimg.com/736x/3b/03/3a/3b033aab201ce6c3d00b19f6c1f13717.jpg);

padding: 20px;

border-radius: 10px;

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

text-align: center;

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

animation-delay: .46s;

}

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

background-image: url(https://i.pinimg.com/originals/36/19/8b/36198b95d50aab4db748e61b2bf28a6d.gif);

/* 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:#ffffff;

}

.profile .profile-info .inner h3 a {

color: #ffffff ;

}

.profile .profile-info {

background-image: url(https://i.pinimg.com/736x/3f/5f/49/3f5f49ba975ec5d16943703b542b4e6a.jpg);

padding: 20px;

border: none;

border-radius: 10px;

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

text-align: center;

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

animation-delay: .15s;

border: none;

}

</style>

<style>

.online{

content: url("https://64.media.tumblr.com/d98dd17b27ee12f3f7bda3e7741fa757/1e1dfad25fc22e16-90/s100x200/1cc4ffbf7667e4cc4cba0bff074393322ec8ee15.gifv") !important;

}

</style>

Report Topic

« Web, HTML, Tech Forum

My Black and white and gray layout just copy and paste!

Posted by Alex

0 Replies