Green and black profile layout

preview:

Code:










<style>


  font-size: 150%;


}


h1,h2,h3,h4,h5{


  font-size: 200%; 


}


 body {

background-image: url('https://i.pinimg.com/736x/da/d7/99/dad79974d1e8dd7973e61f42b7e29d98.jpg');

background-size: cover;

background-position: center;

background-attachment: fixed;

}


.profile {


   background-color: rgb(no need); 


}


/* change all headings on page to different colors. */


  .profile .blurbs .heading,


  .profile .friends .heading{


   background-color: rgb();


   color: #98e632;


}


/* change all headings on page to different colors. */


  .profile .contact .heading,


  .profile .table-section .heading{


   background-color: #98e632;


   color: rgb();


}




main:before {


    width: auto;


    margin-bottom: 25px;


    border: 1px solid black;


    height: 120px;


    display: block;


    content: "";


    background-image: url(https://i.pinimg.com/736x/eb/ae/37/ebae3798d460eb8f4cfc0d0fad480069.jpg);


    background-position: center center;


    background-size: cover;


}




footer {


    border-radius: 15px;


    background-image: url(https://i.pinimg.com/736x/ea/64/9b/ea649bb7674e4f4431842c9a08dddf68.jpg);


    color: ;


}




table.comments-table td {


    color: rgb(#8ee339);


}




:root {


    --logo-blue: #171716;


    --darker-blue: #527d32;


    --lighter-blue: #527d32;


    --even-lighter-blue: ;


    --lightest-blue: ;


    --dark-orange: #171716;


    --light-orange: #171716;


    --even-lighter-orange: #9ce340;


    --green: pink;


}




main{


background-color: #c0eb63 !important;


background-image: url('https://i.pinimg.com/736x/ea/64/9b/ea649bb7674e4f4431842c9a08dddf68.jpg') !important;


background-attachment: fixed !important;


background-repeat: repeat !important;


background-position: top left !important;


}




.top{


background-color: #c0eb63 !important;


background-image: url(https://i.pinimg.com/736x/6b/7f/c8/6b7fc872f9dc60dd4533dba383c36f74.jpg) !important;


background-attachment: fixed !important;


background-repeat: repeat !important;


background-position: top left !important;


}











.profile-info {

    border: 2px solid #6f9e1c;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 15px 5px;

    margin-bottom: 10px;

    background: url(https://i.pinimg.com/736x/70/1b/91/701b9189f6b520c056787f0b2a5cbfa6.jpg);

}









.logo{content: url(https://seeklogo.com/images/M/MySpace-logo-709DE2C3F8-seeklogo.com.png);width: 165px !important; height: 42px !important;}


.top input{


background-color: #6f9e1c !important;


background-image: url('picture url') !important;


background-attachment: fixed !important;


background-repeat: repeat !important;


background-position: top left !important;


}




.links{


background-color: #6f9e1c !important;


background-image: url('picture url') !important;


background-attachment: fixed !important;


background-repeat: repeat !important;


background-position: top left !important;


}






/*CONTACT ICONS*/


.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: url(https://external-media.spacehey.net/media/sMswBUahH5EoPafQE4ZcRjyKbo1xEZURyuzoKgSKifAo=/https://autism.crd.co/assets/images/gallery02/45f68246_original.png?v=aaa3f39)}




.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {


/* ADD TO FAVOURITE */


content: url(https://external-media.spacehey.net/media/sMswBUahH5EoPafQE4ZcRjyKbo1xEZURyuzoKgSKifAo=/https://autism.crd.co/assets/images/gallery02/45f68246_original.png?v=aaa3f39)}




.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {


/*SEND A MESSAGE */


content: url(https://external-media.spacehey.net/media/sMswBUahH5EoPafQE4ZcRjyKbo1xEZURyuzoKgSKifAo=/https://autism.crd.co/assets/images/gallery02/45f68246_original.png?v=aaa3f39)}







    


.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {


/*FORWARD TO FRIEND*/


content: url(https://external-media.spacehey.net/media/sMswBUahH5EoPafQE4ZcRjyKbo1xEZURyuzoKgSKifAo=/https://autism.crd.co/assets/images/gallery02/45f68246_original.png?v=aaa3f39)}




.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {


/*INSTANT MESSAGE*/


content: url(https://external-media.spacehey.net/media/sMswBUahH5EoPafQE4ZcRjyKbo1xEZURyuzoKgSKifAo=/https://autism.crd.co/assets/images/gallery02/45f68246_original.png?v=aaa3f39)}




.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {


/*BLOCK USER*/


content: url(https://external-media.spacehey.net/media/sMswBUahH5EoPafQE4ZcRjyKbo1xEZURyuzoKgSKifAo=/https://autism.crd.co/assets/images/gallery02/45f68246_original.png?v=aaa3f39)}




.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {


/*ADD 2 GROUP*/


content: url(https://external-media.spacehey.net/media/sMswBUahH5EoPafQE4ZcRjyKbo1xEZURyuzoKgSKifAo=/https://autism.crd.co/assets/images/gallery02/45f68246_original.png?v=aaa3f39)}




.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {


/*REPORT*/


content: url(https://external-media.spacehey.net/media/sMswBUahH5EoPafQE4ZcRjyKbo1xEZURyuzoKgSKifAo=/https://autism.crd.co/assets/images/gallery02/45f68246_original.png?v=aaa3f39)}






.online{content: url(“https://blinkies.cafe/b/display/0206-nyancat.gif”)!important;}


/* this is the online img*/


.online {content:url('‘https://adriansblinkiecollection.neocities.org/stamps/a7.gif'); background-repeat: no-repeat; background-position: -15% 75%; z-index: 2; 


}


          </style>




<style>h1{color: #171716 !important;}</style>


<style>h1{font-size: 50px !important;}</style>


<style>h1{font-family: arial !important;}</style>




<style>


h1{


border: 1px black !important;


}




.contact {


  border-radius: 8px;


  background-image: url(https://i.pinimg.com/736x/eb/ae/37/ebae3798d460eb8f4cfc0d0fad480069.jpg);


  background-position: right top;


  background-repeat: repeat;


background-attachment: scroll;


Width: 310px;


Height:180px;


}




</style>















Tell me if there's any issues with the coding.



2 Kudos

Comments

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