Posting a layout I coded on here becasue I can't upload on the normal thingy

Baby pink and white dove mourette/angel inspired layout! 


Time taken: 1 hour


<style>

    body{

        background-image: url("https://i.pinimg.com/736x/97/fe/b2/97feb2c71c23956943a6edd3b198ac70.jpg");

font-family: times new roman;

    }

    .container{

        box-shadow: 0px 1px 10px black;

        width: 970px;

    }

    nav .top{

background: #FCF7F5;

        background-image: url("https://i.pinimg.com/1200x/7d/14/5b/7d145b35c57b99f5ea2c0b1ab0b1006a.jpg");

    }


    nav .top .left .logo{

        display: none;

    }

    nav .top{

        height: 80px;

        border: ridge #fff9f7 4px;

    }

    nav .top .center form{

        text-align: left;

text-shadow: 0px 5px 5px black;

font-family: rocketpop;

    }

    [id='q']{

        border-radius: 3px;

        border: 2px ridge white;

    }

    nav .links{

        text-align: center;

        background: #FCF7F5;

        border: ridge #F2C2C9 4px;

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

font-family: rocketpop;

    }

    main .right{

        width: 30%;

    }

    main .left{

        background:#FCF7F5;

    }

    .general-about .profile-pic img{

        margin-left: 180px;

        margin-top: 15px;

        box-shadow: 0px 1px 10px black;

        border: ridge #FCF7F5 3px;

        border-radius: 3px;

    }

    main .right{

        box-shadow: 0px 1px 10px;

    }

    

     .general-about{

    background: linear-gradient(to left, #FCEDF1, #FAD7E0, #FCF7F5);

    background-color: transparent;

    border-radius: 5px;

    border: ridge #fcf7f5 6px;

    text-align: left;

    height: 200px;

    font-family: rocketpop;

    }

    

    .profile h1{

        font-size: 55px;

        color: white;

        text-shadow: 0px 5px 5px #FF7DB6;

        border: ridge 4px #FF7DB6;

        border-radius: 5px;

        background-image: url("https://i.pinimg.com/736x/17/9e/c5/179ec51a9394262378eaf5da05b2ce07.jpg");

        text-align: center;

        height: 90px;

    font-family: rocketpop;

    }

    

    main .right{

        background: linear-gradient(to bottom, #fcedf1, #FAD7E0, #FCF7F5);

    }

    FORM > BUTTON{

        border: ridge #fcedf1 2px;

        border-radius: 3px;

    }

    .profile .blurbs .heading{

        background: linear-gradient(to right, #fcedf1, #FAD7E0, #FCF7F5);

        border: ridge 3px #e9edee;

        border-radius: 3px;

    }

    .profile .blurbs .heading h4{

        color: white;

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

    font-family: rocketpop;

    }

    .profile .blurbs .inner{

        background: #fcedf1;

        border: ridge 3px #fcedf1;

        border-radius: 3px;

        margin-top: 10px;

        text-align: center;

font-family: times new roman;

    }

    DIV.blog-preview{

        text-align: center;

        border: ridge 6px #fcedf1;

        background-image: ;

        border-radius: 5px;

         box-shadow: 2px 5px 5px grey;

            font-family: times new roman;

font-size: 16px;

    }

    .profile .blurbs .section h4{

        text-align: center;

        text-shadow: 0px 2px 2px white;

        color: black;

            font-family: rocketpop;

    }

    .profile .mood{

width: 100%

display: inline-block;

background-image: url('<a href="http://www.gigaglitters.com/"><img src="http://www.gigaglitters.com/created/VUQepNUFox.gif" width="203"  height="67" border="0" alt="http://www.rasaint.net/ - Glitter Graphics"><br><a href="http://www.gigaglitters.com/">http://www.gigaglitters.com/ - Glitter Graphics') !important;

background-position: !important;

background-repeat: no-repeat !important;

background-size: 20% !important;

        border: ridge 6px #fcedf1;

        border-radius: 5px;

        margin-top: 5px;

        margin-bottom: 5px;

        text-align: center;

    font-family: times new roman;

font-size: 18px;

    }

    .profile .friends .heading{

        background: linear-gradient(to left, #fcedf1, #FAD7E0, #FCF7F5);

        border: ridge 3px #fcedf1,

        border-radius: 3px;

         text-align: left;

    }

    .profile .friends .heading h4{

        color: white;

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

    font-family: rocketpop;

    }

    .profile .friends .inner{

        text-align: center;

        background:#fcedf1;

        border: ridge 3px #fcedf1;

        border-radius: 3px;

        margin-top: 10px;

        margin-bottom: 10px;

font-family: times new roman;

font-size: 17px;

    }

    

    .profile .friends .person p{

        display: none;

    }

    .profile .friends .person img:not(.icon){

        border: ridge 3px #fcedf1;

        border-radius: 3px;

         box-shadow: 2px 5px 5px black;

    font-family: rocketpop;

    }

    .profile .contact{

        border: ridge 6px #fcedf1;

        border-radius: 3px;

        box-shadow: 2px 5px 5px gray;

        background-image: ;

        background-size: 500px;

        background-position: center;

        background-image: linear-gradient(#fcedf1, #FCF7F5);

        text-align: center;

        font-size: 20px;

font-family: times new roman;

    }

    

    .profile .contact .heading{

        background: linear-gradient(to left, #FCF7F5, #fcedf1, #FCF7F5);

        border-bottom: ridge 6px #fcedf1;     

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

    font-family: rocketpop; 

    }

    .icon{

        display: none;

    }

    a{

        color: #E0C3D0;

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


    }

    .profile .url-info{

display: none;

    }

    .profile .table-section .heading{

        background: linear-gradient(to left, #FCF7F5, #fcedf1, #FCF7F5);

        text-align: center;

border-bottom: 6px ridge #fcedf1

    font-family: rocketpop;

    }

    .profile .table-section{

        border: ridge 6px #fcedf1;

        border-radius: 3px;

        box-shadow: 2px 5px 5px black;

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

        font-size: 20px;

    font-family: rocketpop;

    }

    .details-table td{

        background-color: #fcedf1;

        border-radius: 2px;

        box-shadow: 2px 2px 5px gray;

            font-family: times new roman;

        font-size: 25px;

    }

       :root {

    --light-orange: ;

       --even-lighter-blue: #fcedf1;

       }

       table.comments-table{

           border: 4px ridge #fcedf1 ;

           border-radius: 5px;

           box-shadow: 2px 2px 5px gray;

    font-family: times new roman;

       }

       .comments-table td *{

           border-radius: 3px;

           border: none;

font-family: times new roman;

       }

       .count{

           color: #E0C3D0;

       }

       

       .details-table td *{

           color: black ;

       }

       footer{

           border: ridge 6px #fcedf1;

           border-radius: 3px;

           background: linear-gradient(to bottom,  #FCF7F5, #fcedf1, #FCF7F5);

font-family: times new roman;

        font-size: 20px;

       }

</style>


<style>

    .comments-table td{

        background: #E0C3D0;

font-family: times new roman;

    }

    

    

</style>


<style>

    .profile{

        

    direction: rtl;

    

    }

    .blurbs{

    

    direction: ltr;

        

    }

    .blog-preview{

        

    direction: ltr;

        

    }

    .friends{

    

    direction: ltr;

        

    }

    .general-info{

        

    direction: ltr;

        

    }

    .contact{

        

    direction: ltr;

    

    }

    .url-info{

        

    direction: ltr;

        

    }

    .details-table{

        

    direction: ltr;

        

    }

    .profile .table-section .heading{

    

    direction: ltr;

        

    }

    .details p{


    direction: ltr;


   }

   .mood{


       direction: ltr;


   }

</style>

 


<style>

             ::-webkit-scrollbar {

    width: 10px;

    height: 10px;

    }


    ::-webkit-scrollbar-thumb {

    background: white;

    border: outset 5px;

    }


    ::-webkit-scrollbar-track {

    background-image: linear-gradient(white, gray);

    border: outset 5px;

    }

</style>


<style>

table.comments-table{

display: block;

height: 250px!important;

overflow-y: scroll;

font-family: times new roman;

}

</style>


<style>

  DIV.blog-preview:before {

  content: "";

  white-space: pre-wrap;

  display: block;

  height: 180px;

  width: 350px;

  background-image: url(https://i.pinimg.com/736x/c7/e9/ad/c7e9ad7eb90280c630da1c892c6d04f1.jpg);

  background-repeat: no-repeat;

  background-position: center;

  background-size: 100%;

  align-content: center;

  border: ridge #fcedf1 4px;

  margin-left: 17px;

  margin-top: 10px;

    

</style>


<style>

  .profile .mood:after {

  content: "";

  white-space: pre-wrap;

  display: block;

  height: 180px;

  width: 500px;

  background-image: url(https://i.pinimg.com/736x/5c/14/44/5c14440534808421cceb9584546f3765.jpg);

  background-repeat: no-repeat;

  background-position: center;

  background-size: 100%;

  align-content: center;

  border: ridge #fcedf1 4px;

  margin-left: 7px;

  margin-top: 10px;

  margin-bottom: 10px;

  

</style>


<style>main:before {

  content: "";

  white-space: pre-wrap;

  display: block;

  height: 100px;

  width:;

  background-image: url("https://i.pinimg.com/736x/be/de/66/bede666b7a874133f1b41e68712cbf01.jpg");

  background-repeat: repeat-x;

  background-position: center;

background-size: 11%;

    }

<style>


   a:hover {

     color: black; 

   } 


   }

   

   nav .links {


}

nav .links a:hover {

color: black;

}

@font-face{

font-family: times new roman;

src: url("https://file.garden/ZigDp5GcT02HZKGt/ROMANTIC.TTF");

   } 


@font-face{

font-family: rocketpop;

src: url("https://dl.dropbox.com/s/p8myuwadcoisrjq/RocketPop.otf");

font-size: 16px;

   }


.profile .blurbs .section p{

    color: black;

}


</style>



<style>


.online{

content:url("https://pomelo.lol/pix/272679lz7b9hcea1.gif");

margin-right: 80px;

}


</style>



<style>


.profile .profile-info {

background-image: url(https://i.pinimg.com/1200x/20/8a/52/208a521cfee6c96bc31210c4afe4e461.jpg);

border: ridge;

        border-color: #fcedf1;

        border-width: 4px;

border-radius: 3px;

text-align: center;

box-shadow: 0px 3px 5px gray;

    font-family: rocketpop;

        font-size: 15px;

}

</style>


<style>

.links .special a:link, .links .special a:visited  {

  color: white;

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

    font-family: times new roman;

}


.links .special a:hover {

  color: white;

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

    font-family: times new roman;

}


.contact .inner a img {

    font-size: 0;

}


.contact .inner a img:before {

    font-size: 2em;

    display: block;

}


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

/* Add to Friends */

content: url("http://i122.photobucket.com/albums/o260/mhilka/minigifs/estrelinhaa.gif")

}


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

/* Add to Favorites */

content: url("http://i122.photobucket.com/albums/o260/mhilka/minigifs/estrelinhaa.gif")

}


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

/* Send Message */

content: url("http://i122.photobucket.com/albums/o260/mhilka/minigifs/estrelinhaa.gif")

}


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

/* Forward to Friend */

content: url("http://i122.photobucket.com/albums/o260/mhilka/minigifs/estrelinhaa.gif")

}


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

/* Instant Message */

content: url("http://i122.photobucket.com/albums/o260/mhilka/minigifs/estrelinhaa.gif")

}


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

/* Block User */

content: url("http://i122.photobucket.com/albums/o260/mhilka/minigifs/estrelinhaa.gif")

}


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

/* Add to Group */

content: url("http://i122.photobucket.com/albums/o260/mhilka/minigifs/estrelinhaa.gif")

}


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

/* Report Profile */

content: url("http://i122.photobucket.com/albums/o260/mhilka/minigifs/estrelinhaa.gif")

}


:root {

    --topic1: "General";  

    --topic2: "Music";

    --topic3: "Movies & TV";

    --topic4: "Fandoms";

    --topic5: "Books";

    --topic6: "Random";

 }


.table-section:not(:last-child) .details-table tr td:first-child p{

color: transparent; !important;

text-shadow: none !important;

letter-spacing: -100px;

}



.details-table tr td:first-child p::after{

   color: white !important;

   letter-spacing:normal !important;

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

   filter: brightness(95%) !important;

}


.table-section:not(:last-child) .details-table tr:nth-child(1) td:first-child p::after{

    content: var(--topic1);

}

.table-section:not(:last-child) .details-table tr:nth-child(2) td:first-child p::after{

    content: var(--topic2);

}

.table-section:not(:last-child) .details-table tr:nth-child(3) td:first-child p::after{

    content: var(--topic3);

}

.table-section:not(:last-child) .details-table tr:nth-child(4) td:first-child p::after{

    content: var(--topic4);

}

.table-section:not(:last-child) .details-table tr:nth-child(5) td:first-child p::after{

    content: var(--topic5);

}

.table-section:not(:last-child) .details-table tr:nth-child(6) td:first-child p::after{

    content: var(--topic6);

}



</style>


2 Kudos

Comments

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

robbinscatter

robbinscatter's profile picture

I am in love with your profile


Report Comment



AWWW TYSMMMM!

by Nora ♡; ; Report