MERMAID GROTTO LAYOUT

Copy and Paste into your "Who I'd Like to Meet"



<style>
.blog-preview {
border: 1px dotted #FFFFFF!important; 
background: rgba(190, 190, 190);
background: url(https://64.media.tumblr.com/c5ce1fcb981fe334f617134e2ced1cc0/c9d9f42dbc91664b-ef/s500x750/a6768028237c2062c51057c7993e4c6d8a265408.gifv);
opacity: 0.5
border-radius: 10px;
box-shadow: 1px 1px 2px rgba(190, 190, 190,);
height: 77px!important;


</style>
<style>
.blurbs {
border: 1px solid #FFFFFF!important; 
background: rgba(190, 190, 190);
background: url(https://64.media.tumblr.com/ba28ef08ea06a3a2b818708b0cadf983/934ed98e3deb2f4c-e4/s2048x3072/bc0855554c7c8a4c39208aac4d50e328e733651b.png);
border-radius: 10px;
box-shadow: 1px 1px 2px rgba(190, 190, 190,);
height: 300px!important;
overflow-y: scroll;


}
.friends-grid img{
outline:none !important;
filter: opacity(90%) !important;
border-radius: var(--curve) !important;

</style>

<style>

.profile .url-info {
border: 0;
color: #FFF;
background:url(https://giffiles.alphacoders.com/398/39891.gif);
background-position: center;
text-align: center;
}

</style>

<style>



body {
background-color: #ffffff;
background-image: url(https://64.media.tumblr.com/ba28ef08ea06a3a2b818708b0cadf983/934ed98e3deb2f4c-e4/s1280x1920/7cf16633b058a2f28bd53dc385c6f594007d0b49.png);
background-position: top left;
background-repeat: repeat;
background-attachment: fixed;
}


  a:active, a:visited, a:link, a.searchlinksmall:active, a.searchlinksmall:visited, a.searchlinksmall:link, a.navbar:active, a.navbar:visited, a.navbar:link, a.redlink:active, a.redlink:visited, a.redlink:link  { 
  color: #ff8da1; 
 } 


nav .links {
    background-image:url(https://64.media.tumblr.com/a6c382bfa44d924fd6670549a4b02b4a/a0737dd2f534d4c9-a7/s400x600/c09c0b4c0a680fa3a236732c1c504b706d1ce502.jpg);
    padding: 3.5px 16px 5.5px 16px;
}



</style>

<style>
     * {margin: 0; padding: 0;}

     body {
        background-color: #000000;
     }

    #container {
        width:70%;
        overflow: hidden;
        margin: 50px auto;
        background: black;
    }

    /*header*/
    header {
        width: 800px;
        margin: 40px auto;
    }

    header h1 {
        text-align: center;
        font: 100 60px/1.5 Helvetica, Verdana, sans-serif;

    }

    header p {
        font: 100 15px/1.5 Helvetica, Verdana, sans-serif;
        text-align: justify;
    }


</style>
<style>

footer {
        border-radius: 2px;
background-image: url(https://cdn.shopify.com/s/files/1/0209/4147/1808/products/il_fullxfull.1851205845_l0eq_1024x1024@2x.jpg?v=1556124622); 

</style>

<style>


h1, h2, h3, h4, h5, a, p, nav label, .section{ 
font-family: var(--font-family) !important; 
 text-shadow: pink; !important;
 text-transform:!important;
}


h1, h2, h3, h4,h5,a, p, nav label, .section {color: #000000;}

h1 {
  color: pink;
  text-shadow: 1px 1px 2px pink, 0 0 25px yellow, 0 0 5px yellow;
}


</style>

<style>

main {
  /* changes made to stuff outside of columns */
    background: url(https://64.media.tumblr.com/a6c382bfa44d924fd6670549a4b02b4a/a0737dd2f534d4c9-a7/s400x600/c09c0b4c0a680fa3a236732c1c504b706d1ce502.jpg);
   background-attachment: fixed;
    padding: 0;
    font-size: 80%;
    color: var(--light-orange);
  }
</style>

<style>

table {
  border-spacing: 2px;
width: 100%;
  /* sets background */
    background-image: url(https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fimg1.picmix.com%2Foutput%2Fstamp%2Fnormal%2F2%2F0%2F5%2F6%2F316502_7f4ce.gif&f=1&nofb=1);
    background-repeat: repeat;
    background-size: 25% ;
  }  

</style>

<style>


:root {
        --logo-blue: url(https://giffiles.alphacoders.com/398/39891.gif);
        --darker-blue: purple;
        --lighter-blue: h ;
        --even-lighter-blue: rgba(255, 192, 203, 0.5);
        --lightest-blue: #FEEEEC;
        --dark-orange: purple;
        --light-orange: rgba(255, 192, 203, 0.5);
        --even-lighter-orange: url(https://i.pinimg.com/originals/23/7e/74/237e74d08782cb53aa565794257a7b60.jpg);
        --green: Aliceblue;
        

  

}



</style>

<style>

@import 
url('https://fonts.googleapis.com/css2?family=Alice&display=swap');
  /* gotta fetch the font for phone users */


:root {
  --font-family: 'Alice', serif;
  --mynamesize: 25px
  --urlInfoBox: url(https://i.pinimg.com/originals/11/46/f0/1146f06783e280ed21dbbf435789df49.png);

;}

  h1, h2, h3, h4, h5, a, p, nav label, .section{ 
font-family: var(--font-family) !important; 
 text-shadow: !important;
 text-transform:!important;
}

table, th, td {
  border: 1px dotted #ff8da1;
}

</style>

<style>

    .profile-pic {
        border-radius: 500px;        
overflow: hidden;
background: url('https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fimg1.picmix.com%2Foutput%2Fstamp%2Fnormal%2F2%2F0%2F5%2F6%2F316502_7f4ce.gif&f=1&nofb=1');
    background-size: 30%30%;
    padding:5px;
outline:none !important;
border: none!important;
filter:hue-rotate(var(--hue)) drop-shadow(0px 0px 0px black)!important;
box-shadow:calc((400px + (25px * 2)) * 0.025) calc((400px + (25px * 2)) * 0.025) #f6e3e3;
}

  }

.comments-table td:first-child img {
        width: 80px;
        border-radius: 500px;


    }

    .profile .friends .person img {
        border-radius: 500px;


    }

</style>


<style>

.online{content:url("https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/d25ffe6f-4b3a-40c3-87f2-2d9f1512bf8e/d4ocb14-00d48d84-972a-436c-980f-078c908f04c7.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOiIsImlzcyI6InVybjphcHA6Iiwib2JqIjpbW3sicGF0aCI6IlwvZlwvZDI1ZmZlNmYtNGIzYS00MGMzLTg3ZjItMmQ5ZjE1MTJiZjhlXC9kNG9jYjE0LTAwZDQ4ZDg0LTk3MmEtNDM2Yy05ODBmLTA3OGM5MDhmMDRjNy5naWYifV1dLCJhdWQiOlsidXJuOnNlcnZpY2U6ZmlsZS5kb3dubG9hZCJdfQ.IhhgbjHAbcU8pk1rLsuXgYrAdxq9n3WMJhJPBxo_368");}

</style>

 <style>
     * {margin: 0; padding: 0;}

     body {
        background-color: #000000;
     }

    #container {
        width:70%;
        overflow: hidden;
        margin: 50px auto;
        background: white;
    }

    /*header*/
    header {
        width: 800px;
        margin: 40px auto;
    }

    header h1 {
        text-align: center;
        font: 100 60px/1.5 Helvetica, Verdana, sans-serif;

    }

    header p {
        font: 100 15px/1.5 Helvetica, Verdana, sans-serif;
        text-align: justify;
    }

    /*photobanner*/

    .photobanner {
        height: 233px;
        width: 3550px;
        margin-bottom: -45px;
    }

    /*keyframe animations*/
    .first {
        -webkit-animation: bannermove 30s linear infinite;
           -moz-animation: bannermove 30s linear infinite;
            -ms-animation: bannermove 30s linear infinite;
             -o-animation: bannermove 30s linear infinite;
                animation: bannermove 30s linear infinite;
    }

    @keyframes "bannermove" {
     0% {
        margin-left: 0px;
     }
     100% {
        margin-left: -2125px;
     }

    }

    @-moz-keyframes bannermove {
     0% {
       margin-left: 0px;
     }
     100% {
       margin-left: -2125px;
     }

    }

    @-webkit-keyframes "bannermove" {
     0% {
       margin-left: 0px;
     }
     100% {
       margin-left: -2125px;
     }

    }

    @-ms-keyframes "bannermove" {
     0% {
       margin-left: 0px;
     }
     100% {
       margin-left: -2125px;
     }

    }

    @-o-keyframes "bannermove" {
     0% {
       margin-left: 0px;
     }
     100% {
       margin-left: -2125px;
     }

    }



    .photobanner img {
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        -ms-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }

    .photobanner img:hover {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -o-transform: scale(1.1);
        -ms-transform: scale(1.1);
        transform: scale(1.1);
        cursor: pointer;

        -webkit-box-shadow: 0px 3px 5px rgba(0,0,0,0.2);
        -moz-box-shadow: 0px 3px 5px rgba(0,0,0,0.2);
        box-shadow: 0px 3px 5px rgba(0,0,0,0.2);
    }
    </style>


0 Kudos

Comments

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