CSS Shop (Open)

Creatures · Post by **Merkwerkee** » October 13th, 2016, 12:32:09 pm

crystalwings wrote:username: Crystalwings
Colors: (using the link you provided) Dark Orchid-7D137E, Purple Flower-A74Ac7 (purples)
Theme: I'm am now referring to my keep as Crystal Caves (which is what I want in the header)
Header: This photo if possible;
Spoiler
and put Crystal Caves somewhere on it in a fancy (but readable font)

And as a background;
Spoiler
In the all about me box, is it possible to put an image. If yes (and if you think it doesn't look funny, you could use this
Spoiler
If its not possible (or it looks funny just use a light purple-maybe the purple flower color above)

Thank you so much I know I have already asked you for one, but I have finally figured out an actually theme I would like I would really appreciate you do this for me I really did try my best to do it myself.... Lets just say it didn't turn out very well

Thank you!!

No problem, you are far from the first repeat requester

I did a little experimentation with this code because of reasons, so let me know if anything needs changing or looks funky

Spoiler

Code: Select all

dl.left-box.details{
    background-image: url(http://starlightbiomat.com/wp-content/uploads/2015/06/photodune-1462591-amethyst-bacground-l-e1434741260554.jpg);
    -moz-border-radius: 0px !important;
    -webkit-border-radius: 0px !important;
    border-radius: 0px !important;
    margin-top: 5px;
}

ul.navlinks{padding-bottom:1px;margin-bottom:1px; border-bottom: transparent !important;}

.bg2{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 3px double #7D1B7E;
    background-color: rgba(128, 5, 23,0.3) !important;
    float: left;
    text-decoration: none !important;
    padding: 3px;
    margin: 3px;
    background-image: none;
}
.bg1{
    text-align: center !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none !important;
    border: 1px groove #7D1B7E;
    background-color: rgba(128, 5, 23,0.3) !important;
    float: right;
    padding: 5px;
    margin-right: -5px;
    margin-left: 5px;
    background-image: none;
}
.bg1:hover, .bg2:hover{
    background-color: rgba(45, 0, 46, 0.6) !important;
    transition: background-color .7s !important;
}

.headerbar.nonmobile{
    background-image: url(http://i779.photobucket.com/albums/yy76/Merkwerkee/cryshdr.png) !important;
    background-repeat:no-repeat !important;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: 1px groove #7D1B7E;
    background-size: cover !important;
    background-color: rgb(255,255,255);
    height:250px !important;
}

.headerbar.nonmobile img{
    opacity:0.0;
    height:250px;
    width:850px;
}


.header_nav.nonmobile{
    margin-top:-51px;
    margin-left:2px
}


.header_nav.nonmobile img{
    opacity:0.0;
    margin-top:-4px;
    margin-bottom: 2px;
}

#page-footer .navbar{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #7D1B7E;
    background-color: transparent !important;
    background-image: none;
}
#page-header .navbar{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #7D1B7E;
    margin: auto !important;
    background-color: rgba(40, 47, 76, 0.3) !important;
    background-image: none !important;
}
#page-body{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #7D1B7E;
    background-color: rgba(40, 47, 76, 0.3);
    width: 100% !important;
    margin-top: 5px;
    margin-bottom: 5px;
    text-decoration: none !important;
}
#page-footer{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-color: rgba(40, 47, 76, 0.3);
    width: 100% !important;
}
#page-header{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    width: 100% !important;
    padding-bottom: 5px;
}


input.button2{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #7D1B7E;
    background-color: rgba(80, 69, 55,0.4);
    background-image: url(http://www.treasuremountainmining.com/catalog/images/EB0112QAU1E.jpg) !important;
}

* {
    font-family: Garamond !important;
    color: #BB5EDB !important;
    text-align: center !important;
    text-decoration: none !important;
}

#wrap{
    background-image: none;
    background-color: rgba(75, 0, 130, 0.4) !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding-top: 20px !important;
    border-radius: 5px;
    margin: auto;
    border: 1px groove #7D1B7E;
}
body{
    background-image:url(http://static.tumblr.com/f6376e76f4127a30dc9ae9642a4b0d85/k6daz6k/Hrgne4mcc/tumblr_static_4a7ketwvmz40w4k0okgkgk4sc.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-color: #7D1B7E;
    padding-top: 15px !important;
    background-position: center;
    background-attachment: fixed !important;
}
span{
    background-image: none !important;
}
.spoiler .inner{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    background-color: rgba(75, 0, 130,0.5);
    border: 1px groove #7D1B7E !important;
}
.codebox{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    background-color: rgba(75, 0, 130,0.5);
    border: 1px groove #7D1B7E;
}

.border-right, .border-left, .border-top, .border-top-left, .border-top-right, .border-bottom{
    background: none;
}
dl.left-box.details{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    text-align: center !important;
}
.jumpbox{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #7D1B7E;
    margin-left: 3px;
    margin-right: 3px;
    background-color: rgba(128, 5, 23,0.3);
}

.icon-gold{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    color: transparent !important;
    background:url(https://ae01.alicdn.com/kf/HTB1Lf7uLpXXXXcnXpXXq6xXFXXXx/Natural-Brazilian-Amethyst-Crystal-Stone-Bead-Square-Shape-polished-crystal-beads-4mm-Full-Hole-DIY-Jewelry.jpg_50x50.jpg) no-repeat, url(http://thumbnail.image.rakuten.co.jp/@0_mall/masuki/cabinet/ikou_20090729_002/img10614544125.jpg?_ex=50x50) no-repeat;
    background-position: 2px 2px, 57px 2px;
    background-size: 13px 13px, 12px 12px;
}
.icon-gold img{opacity:0.0;
    margin-top:0 !important;
    font-color: transparent !important;
    margin-bottom:0 !important;}

.custom_css_avatar img{
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    border: 1px groove #7D1B7E;
}


h3{
    background-image:url(https://cdn0.iconfinder.com/data/icons/weather-meteorology-4/64/weather-rain-storm-48.png);
    background-size: 15px 15px;
    background-repeat: no-repeat;
    border-bottom: 1px groove #7D1B7E;
}

.icon-ucp, .icon-logout, .leftside icon-home, .icon-home{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 5px;
    border-radius: 5px;
    border: 1px groove #7D1B7E;
    background-color: rgba(128, 5, 23,0.3);
    background-image: none;
    margin-top: 3px;
    margin-bottom: 3px;
    width: 100%;
}

dl.left-box{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    float: right;
}
h2{
    display: none;
}
a:link, a.postlink:link{
    text-decoration: none !important;
    transition: font-size .7s;
}

a:visited, a.postlink:visited{
    color: darkred;
    text-decoration: none !important;
}
a:hover, a.postlink:hover{
    text-decoration: none !important;
    background-color: rgba(27, 27, 27, 0.3);
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    transition: background-color .7s;
}


blockquote{
    -moz-border-radius: 2em 2em !important;
    -webkit-border-radius: 2em 2em !important;
    border-radius: 2em 2em !important;
    border:1px groove #7D1B7E !important;
    background-color: rgba(75, 0, 130 ,0.6) !important;
}

.custom_css_rank{
    border-bottom: transparent;
}
.postlink{border-bottom-color: #7D1B7E;}.postlink:visited{border-bottom-color: #7D1B7E;}

.inner{
    padding: -3px !important;
    margin: -3px !important;}

Also, I used neither picture you linked me because they were too small and would have gotten very funky if resized or tiled

Creatures · Post by **crystalwings** » October 13th, 2016, 10:43:07 pm

Oh wow, it looks amazing! I am actually glad the photos I chose were to small, the ones you chose are way nicer

Also the font you chose is totally perfect

I am glad I am not the only repeater through

I was feeling guilty asking you to make me a whole new one. Don't worry, I won't be back anytime soon, I'm going to be using this one for a long time!

I really cannot thank you enough

This CSS defiantly turned out how I was trying to imagine in my head

Creatures · October 18th, 2016, 2:05:37 pm

Hello! I read through your post a bunch, but I didn't see anything about payment. Just wanted to know how you handled that ^-^

I'm also really looking for a Night Vale themed CSS, if that's alright with you? Qould love to have the background image as something like This, perhaps with a header of something like

Code: Select all

this?

As for the colors, just the black and purples, maybe white text, if it's hard to see?

Anyhow, thank you for the opportunity!

Creatures · Post by **Merkwerkee** » November 10th, 2016, 2:25:07 pm

CalhounsKitten wrote:Hello! I read through your post a bunch, but I didn't see anything about payment. Just wanted to know how you handled that ^-^

I'm also really looking for a Night Vale themed CSS, if that's alright with you? Qould love to have the background image as something like This, perhaps with a header of something like
Code: Select all
this?
As for the colors, just the black and purples, maybe white text, if it's hard to see?

Anyhow, thank you for the opportunity!

Spoiler

Code: Select all

/*dl.left-box.details{
    background-image: url(http://starlightbiomat.com/wp-content/uploads/2015/06/photodune-1462591-amethyst-bacground-l-e1434741260554.jpg);
    -moz-border-radius: 0px !important;
    -webkit-border-radius: 0px !important;
    border-radius: 0px !important;
    margin-top: 5px;
}
*/
ul.navlinks{padding-bottom:1px;margin-bottom:1px; border-bottom: transparent !important;}

.bg2{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 3px double black;
    background-color: rgba(125, 5, 82,0.3) !important;
    float: left;
    text-decoration: none !important;
    padding: 3px;
    margin: 3px;
    background-image: none;
}
.bg1{
    text-align: center !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none !important;
    border: 1px groove black;
    background-color: rgba(125, 5, 82,0.3) !important;
    float: right;
    padding: 5px;
    margin-right: -5px;
    margin-left: 5px;
    background-image: none;
}
.bg1:hover, .bg2:hover{
    background-color: rgba(45, 0, 46, 0.6) !important;
    transition: background-color .7s !important;
}

.headerbar.nonmobile{
    background-image: url(http://i779.photobucket.com/albums/yy76/Merkwerkee/wtnvhdr.png) !important;
    background-repeat:no-repeat !important;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: 1px groove black;
    background-size: cover !important;
    background-color: rgb(255,255,255);
    height:250px !important;
}

.headerbar.nonmobile img{
    opacity:0.0;
    height:250px;
    width:850px;
}


.header_nav.nonmobile{
    margin-top:-51px;
    margin-left:2px
}


.header_nav.nonmobile img{
    opacity:0.0;
    margin-top:-4px;
    margin-bottom: 2px;
}

#page-footer .navbar{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove black;
    background-color: transparent !important;
    background-image: none;
}
#page-header .navbar{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove black;
    margin: auto !important;
    background-color: rgba(45, 0, 2, 0.3) !important;
    background-image: none !important;
}
#page-body{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove black;
    background-color: rgba(45, 0, 2, 0.3);
    width: 100% !important;
    margin-top: 5px;
    margin-bottom: 5px;
    text-decoration: none !important;
}
#page-footer{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-color: rgba(45, 0, 2, 0.3);
    width: 100% !important;
}
#page-header{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    width: 100% !important;
    padding-bottom: 5px;
}


input.button2{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove black;
    background-color: rgba(80, 69, 55,0.4);
    background-image: url(http://www.newsarama.com/images/i/000/130/251/i02/Night-Vale-Condos-Official-Art-by-Kate-Leth.jpg) !important;
}

* {
    font-family: Garamond !important;
    color: white !important;
    text-align: center !important;
    text-decoration: none !important;
}

#wrap{
    background-image: none;
    background-color: rgba(65, 0, 22, 0.4) !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding-top: 20px !important;
    border-radius: 5px;
    margin: auto;
    border: 1px groove black;
}
body{
    background-image:url(https://www.wired.com/wp-content/uploads/2016/09/nightvalelogo-web4.jpg);
    background-repeat: no-repeat;
    background-color: black;
    padding-top: 15px !important;
    background-position: center;
    background-attachment: fixed !important;
}
span{
    background-image: none !important;
}
.spoiler .inner{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    background-color: rgba(65, 0, 22,0.5);
    border: 1px groove black !important;
}
.codebox{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    background-color: rgba(65, 0, 22,0.5);
    border: 1px groove black;
}

.border-right, .border-left, .border-top, .border-top-left, .border-top-right, .border-bottom{
    background: none;
}
dl.left-box.details{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    text-align: center !important;
}
.jumpbox{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove black;
    margin-left: 3px;
    margin-right: 3px;
    background-color: rgba(125, 5, 82,0.3);
}

.icon-gold{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    color: transparent !important;
    background:url(https://65.media.tumblr.com/avatar_0dec9981ade4_128.png) no-repeat, url(https://65.media.tumblr.com/avatar_d3bdfc7e0614_128.png) no-repeat;
    background-position: 2px 2px, 57px 2px;
    background-size: 13px 13px, 12px 12px;
}
.icon-gold img{opacity:0.0;
    margin-top:0 !important;
    font-color: transparent !important;
    margin-bottom:0 !important;}

.custom_css_avatar img{
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    border: 1px groove black;
}


h3{
    background-image:url(https://s-media-cache-ak0.pinimg.com/favicons/258fc3cd6edfec1fbac7eb05fc5578b013c817701ad1af23e44480f2.png?8ff85204b5f450be9e8afc1f9b0ccaf1);
    background-size: 15px 15px;
    background-repeat: no-repeat;
    border-bottom: 1px groove black;
}

.icon-ucp, .icon-logout, .leftside icon-home, .icon-home{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 5px;
    border-radius: 5px;
    border: 1px groove black;
    background-color: rgba(125, 5, 82,0.3);
    background-image: none;
    margin-top: 3px;
    margin-bottom: 3px;
    width: 100%;
}

dl.left-box{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    float: right;
}
h2{
    display: none;
}
a:link, a.postlink:link{
    text-decoration: none !important;
    transition: font-size .7s;
}

a:visited, a.postlink:visited{
    color: darkred;
    text-decoration: none !important;
}
a:hover, a.postlink:hover{
    text-decoration: none !important;
    background-color: rgba(27, 27, 27, 0.3);
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    transition: background-color .7s;
}


blockquote{
    -moz-border-radius: 2em 2em !important;
    -webkit-border-radius: 2em 2em !important;
    border-radius: 2em 2em !important;
    border:1px groove black !important;
    background-color: rgba(65, 0, 22 ,0.6) !important;
}

.custom_css_rank{
    border-bottom: transparent;
}
.postlink{border-bottom-color: black;}.postlink:visited{border-bottom-color: black;}

.inner{
    padding: -3px !important;
    margin: -3px !important;}

Sorry it took me so long!
Anyway, the CSSs are free. Sometimes people give me gold, other times people give me ibex. In both cases, I am grateful.
But the CSSs themselves don't cost anything

Let me know if you want anything changed

Creatures · Post by **magestream** » November 11th, 2016, 5:27:26 pm

Username: magestream
Three Colors: Sky Blue, White, Sandy Tan
Theme: Tropical Beach under a pretty Sky (img)

Not sure how this one will turn out.

Just chose this to match my current avatar.

I cannot thank you enough for my previous CSS! It's perfect, actually, even better than what I previously thought! *goes off to collect some Ibex for you*

Creatures · Post by **sunsprite** » November 12th, 2016, 12:32:42 am

{{I just copied Crystalwings' form a bit if you don't mind~}}

username: IceRiver
Colors: Butterfly blue (#38ACEC), Kelly green (#4CC552), and Dark orchid (#7D1B7E)
Theme: A underwater forest, sandy beach and purple flowers
Header: This photo if possible;

Spoiler

and could you put this and this (images only) somewhere on the header? And could the words, .:The Golden Wolf:. , be in a semi-fancy font and the words could be on the left? Thanks!
Navigation Bar: Could you use this as the navigation bar?

Spoiler

If it doesn't work, just use the normal Magistream Navi-bar.
Background: for the background, could you use this?

Spoiler

And for the about-me and avatar boxes, could you use this?

Spoiler

Thank you so much!!

Creatures · Post by **LokiWolfbane** » November 21st, 2016, 1:29:18 pm

Username : LokiWolfbane
Theme : runes
Colors : black, icy blue, and red

yep

Creatures · Post by **Merkwerkee** » December 8th, 2016, 10:37:55 am

Just a heads-up, I see all of the requests currently outstanding and I'll get to them when I can, but Finals are here and I'm about to lose my shit over some portions thereof so I'll get to these when I can but probably not before Dec 15th (last day of finals). Sorry for the wait folks!

Also, IceRiver I will do my best to incorporate what images I can from your request but a lot of those are poorly sized for the positions you want them in.

Headers are 250px tall and 850px wide (or at least, the ones I work with are). Just a heads up for everyone in general for that one; if you want to provide your own header because you got it from someplace else or just think I didn't do a good enough job (hey, I freely admit that I'm not good with photoshop) that's the dimensions for whatever you want to replace it with

Creatures · Post by **Merkwerkee** » January 17th, 2017, 3:47:52 pm

magestream wrote:Username: magestream
Three Colors: Sky Blue, White, Sandy Tan
Theme: Tropical Beach under a pretty Sky (img)

Not sure how this one will turn out.
Just chose this to match my current avatar.

I cannot thank you enough for my previous CSS! It's perfect, actually, even better than what I previously thought! *goes off to collect some Ibex for you*

Spoiler

Code: Select all

/*dl.left-box.details{
    background-image: url(http://starlightbiomat.com/wp-content/uploads/2015/06/photodune-1462591-amethyst-bacground-l-e1434741260554.jpg);
    -moz-border-radius: 0px !important;
    -webkit-border-radius: 0px !important;
    border-radius: 0px !important;
    margin-top: 5px;
}
*/
ul.navlinks{padding-bottom:1px;margin-bottom:1px; border-bottom: transparent !important;}

.bg2{
    transition: background-color .7s !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 3px double white;
    background-color: rgba(102, 152, 255,0.3) !important;
    float: left;
    text-decoration: none !important;
    padding: 3px;
    margin: 3px;
    background-image: none;
}
.bg1{
    transition: background-color .7s !important;
    text-align: center !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none !important;
    border: 1px groove white;
    background-color: rgba(102, 152, 255,0.3) !important;
    float: right;
    padding: 5px;
    margin-right: -5px;
    margin-left: 5px;
    background-image: none;
}
.bg1:hover, .bg2:hover{
    background-color: rgba(72, 122, 225, 0.6) !important;
    transition: background-color .7s !important;
}

.headerbar.nonmobile{
    background-image: url(http://i779.photobucket.com/albums/yy76/Merkwerkee/mgshdr.png) !important;
    background-repeat:no-repeat !important;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: 1px groove white;
    background-size: cover !important;
    background-color: rgb(255,255,255);
    height:250px !important;
}

.headerbar.nonmobile img{
    opacity:0.0;
    height:250px;
    width:850px;
}


.header_nav.nonmobile{
    margin-top:-51px;
    margin-left:2px
}


.header_nav.nonmobile img{
    opacity:0.0;
    margin-top:-4px;
    margin-bottom: 2px;
}

#page-footer .navbar{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #BCC6CC;
    background-color: transparent !important;
    background-image: none;
}
#page-header .navbar{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #BCC6CC;
    margin: auto !important;
    background-color: rgba(120, 199, 199, 0.1) !important;
    background-image: none !important;
}
#page-body{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #BCC6CC;
    background-color: rgba(0, 6, 36, 0.1);
    width: 100% !important;
    margin-top: 5px;
    margin-bottom: 5px;
    text-decoration: none !important;
}
#page-footer{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-color: rgba(0, 6, 36, 0.1);
    width: 100% !important;
}
#page-header{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    width: 100% !important;
    padding-bottom: 5px;
}


input.button2{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove white;
    background-color: rgba(80, 69, 55,0.4);
    background-image: url(http://cache.lovethispic.com/uploaded_images/184298-Waves-At-The-Beach.jpg) !important;
}

* {
    font-family: Garamond !important;
    color: #FFCC66 !important;
    text-align: center !important;
    text-decoration: none !important;
}

#wrap{
    background-image: none;
    background-color: rgba(52, 102, 205 , 0.2) !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding-top: 20px !important;
    border-radius: 5px;
    margin: auto;
    border: 1px groove #BCC6CC;
}
body{
    background-image:url(http://cdn.wallpapersafari.com/21/79/WzyARo.jpg);
    background-repeat: no-repeat;
    background-color: white;
    padding-top: 15px !important;
    background-position: center;
    background-attachment: fixed !important;
}
span{
    background-image: none !important;
}
.spoiler .inner{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    background-color: rgba(52, 102, 205 ,0.5);
    border: 1px groove white !important;
}
.codebox{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    background-color: rgba(52, 102, 205 ,0.5);
    border: 1px groove white;
}

.border-right, .border-left, .border-top, .border-top-left, .border-top-right, .border-bottom{
    background: none;
}
dl.left-box.details{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    text-align: center !important;
}
.jumpbox{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove white;
    margin-left: 3px;
    margin-right: 3px;
    background-color: rgba(102, 152, 255,0.3);
}

.icon-gold{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    color: transparent !important;
    background:url(http://thewaveserver.com/wave.jpg) no-repeat, url(https://pbs.twimg.com/profile_images/575232502974951426/m5rQ2Sdf_reasonably_small.jpeg) no-repeat;
    background-position: 2px 2px, 57px 2px;
    background-size: 13px 13px, 12px 12px;
}
.icon-gold img{opacity:0.0;
    margin-top:0 !important;
    font-color: transparent !important;
    margin-bottom:0 !important;}

.custom_css_avatar img{
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    border: 1px groove white;
}


h3{
    background-image:url(http://coverphoto.erth.biz/wp-content/uploads/coverphotos/Ocean-wave-abstract-design-twitter-cover-photos-128x128.jpg);
    background-size: 15px 15px;
    background-repeat: no-repeat;
    border-bottom: 1px groove white;
}

.icon-ucp, .icon-logout, .leftside icon-home, .icon-home{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 5px;
    border-radius: 5px;
    border: 1px groove white;
    background-color: rgba(102, 152, 255,0.3);
    background-image: none;
    margin-top: 3px;
    margin-bottom: 3px;
    width: 100%;
}

dl.left-box{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    float: right;
}
h2{
    display: none;
}
a:link, a.postlink:link{
    text-decoration: none !important;
    transition: font-size .7s;
}

a:visited, a.postlink:visited{
    color: darkred;
    text-decoration: none !important;
}
a:hover, a.postlink:hover{
    text-decoration: none !important;
    background-color: rgba(255, 255, 255, 0.3);
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    transition: background-color .7s;
}


blockquote{
    -moz-border-radius: 2em 2em !important;
    -webkit-border-radius: 2em 2em !important;
    border-radius: 2em 2em !important;
    border:1px groove white !important;
    background-color: rgba(52, 102, 205  ,0.6) !important;
}

.custom_css_rank{
    border-bottom: transparent;
}
.postlink{border-bottom-color: white;}.postlink:visited{border-bottom-color: white;}

.inner{
    padding: -3px !important;
    margin: -3px !important;}

IceRiver wrote:{{I just copied Crystalwings' form a bit if you don't mind~}}

username: IceRiver
Colors: Butterfly blue (#38ACEC), Kelly green (#4CC552), and Dark orchid (#7D1B7E)
Theme: A underwater forest, sandy beach and purple flowers
Header: This photo if possible;
Spoiler
and could you put this and this (images only) somewhere on the header? And could the words, .:The Golden Wolf:. , be in a semi-fancy font and the words could be on the left? Thanks!
Navigation Bar: Could you use this as the navigation bar?
Spoiler
If it doesn't work, just use the normal Magistream Navi-bar.
Background: for the background, could you use this?
Spoiler
And for the about-me and avatar boxes, could you use this?
Spoiler
Thank you so much!!

Spoiler

Code: Select all

/*dl.left-box.details{
    background-image: url(http://starlightbiomat.com/wp-content/uploads/2015/06/photodune-1462591-amethyst-bacground-l-e1434741260554.jpg);
    -moz-border-radius: 0px !important;
    -webkit-border-radius: 0px !important;
    border-radius: 0px !important;
    margin-top: 5px;
}
*/
ul.navlinks{padding-bottom:1px;margin-bottom:1px; border-bottom: transparent !important;}

.bg2{
    transition: background-color .7s !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 3px double #4CC552;
    background-color: rgba(56, 172, 236,0.3) !important;
    float: left;
    text-decoration: none !important;
    padding: 3px;
    margin: 3px;
    background-image: none;
}
.bg1{
    transition: background-color .7s !important;
    text-align: center !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none !important;
    border: 1px groove #4CC552;
    background-color: rgba(56, 172, 236,0.3) !important;
    float: right;
    padding: 5px;
    margin-right: -5px;
    margin-left: 5px;
    background-image: none;
}
.bg1:hover, .bg2:hover{
    background-color: rgba(72, 122, 225, 0.6) !important;
    transition: background-color .7s !important;
}

.headerbar.nonmobile{
    background-image: url(http://i779.photobucket.com/albums/yy76/Merkwerkee/icehdr.png) !important;
    background-repeat:no-repeat !important;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: 1px groove #4CC552;
    background-size: cover !important;
    background-color: rgb(255,255,255);
    height:250px !important;
}

.headerbar.nonmobile img{
    opacity:0.0;
    height:250px;
    width:850px;
}


.header_nav.nonmobile{
    margin-top:-51px;
    margin-left:2px
}


.header_nav.nonmobile img{
    opacity:0.0;
    margin-top:-4px;
    margin-bottom: 2px;
}

#page-footer .navbar{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #4CC552;
    background-color: transparent !important;
    background-image: none;
}
#page-header .navbar{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #4CC552;
    margin: auto !important;
    background-color: rgba(125, 27, 126, 0.1) !important;
    background-image: none !important;
}
#page-body{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #4CC552;
    background-color: rgba(0, 6, 36, 0.1);
    width: 100% !important;
    margin-top: 5px;
    margin-bottom: 5px;
    text-decoration: none !important;
}
#page-footer{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-color: rgba(0, 6, 36, 0.1);
    width: 100% !important;
}
#page-header{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    width: 100% !important;
    padding-bottom: 5px;
}


input.button2{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #4CC552;
    background-color: rgba(80, 69, 55,0.4);
    background-image: url(http://cdn.tourismontheedge.com/wp-content/uploads/2013/08/underwater-forest-lake-kaindy.jpg) !important;
}

* {
    font-family: Garamond !important;
    color: #4CC552 !important;
    text-align: center !important;
    text-decoration: none !important;
}

#wrap{
    background-image: none;
    background-color: rgba(52, 102, 205 , 0.2) !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding-top: 20px !important;
    border-radius: 5px;
    margin: auto;
    border: 1px groove #4CC552;
}
body{
    background-image:url(http://i.dailymail.co.uk/i/pix/2014/11/26/2374619D00000578-2847258-The_Green_Lake_in_the_village_of_Trag_in_Styria_is_only_around_a-1_1417016261345.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #4CC552;
    padding-top: 15px !important;
    background-position: center;
    background-attachment: fixed !important;
}
span{
    background-image: none !important;
}
.spoiler .inner{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    background-color: rgba(125, 27, 126,0.5);
    border: 1px groove #4CC552 !important;
}
.codebox{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    background-color: rgba(125, 27, 126,0.5);
    border: 1px groove #4CC552;
}

.border-right, .border-left, .border-top, .border-top-left, .border-top-right, .border-bottom{
    background: none;
}
dl.left-box.details{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    text-align: center !important;
}
.jumpbox{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #4CC552;
    margin-left: 3px;
    margin-right: 3px;
    background-color: rgba(56, 172, 236,0.3);
}

.icon-gold{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    color: transparent !important;
    background:url(http://findicons.com/files/icons/2198/dark_glass/128/gnome_fish.png) no-repeat, url(http://preloaders.net/preloaders/724/colored/5.png) no-repeat;
    background-position: 2px 2px, 57px 2px;
    background-size: 13px 13px, 12px 12px;
}
.icon-gold img{opacity:0.0;
    margin-top:0 !important;
    font-color: transparent !important;
    margin-bottom:0 !important;}

.custom_css_avatar img{
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    border: 1px groove #4CC552;
}


h3{
    background-image:url(http://cdn.mysitemyway.com/etc-mysitemyway/icons/legacy-previews/icons-256/3d-transparent-glass-icons-culture/022047-3d-transparent-glass-icon-culture-astrology2-fish.png);
    background-size: 15px 15px;
    background-repeat: no-repeat;
    border-bottom: 1px groove #4CC552;
}

.icon-ucp, .icon-logout, .leftside icon-home, .icon-home{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 5px;
    border-radius: 5px;
    border: 1px groove #4CC552;
    background-color: rgba(56, 172, 236,0.3);
    background-image: none;
    margin-top: 3px;
    margin-bottom: 3px;
    width: 100%;
}

dl.left-box{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    float: right;
}
h2{
    display: none;
}
a:link, a.postlink:link{
    text-decoration: none !important;
    transition: font-size .7s;
}

a:visited, a.postlink:visited{
    text-decoration: none !important;
}
a:hover, a.postlink:hover{
    text-decoration: none !important;
    background-color: rgba(125, 27, 126, 0.3);
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    transition: background-color .7s;
}


blockquote{
    -moz-border-radius: 2em 2em !important;
    -webkit-border-radius: 2em 2em !important;
    border-radius: 2em 2em !important;
    border:1px groove #4CC552 !important;
    background-color: rgba(52, 102, 205  ,0.6) !important;
}

.custom_css_rank{
    border-bottom: transparent;
}
.postlink{border-bottom-color: #4CC552;}.postlink:visited{border-bottom-color: #4CC552;}

.inner{
    padding: -3px !important;
    margin: -3px !important;}

LokiWolfbane wrote:Username : LokiWolfbane
Theme : runes
Colors : black, icy blue, and red

yep

Spoiler

Code: Select all

/*dl.left-box.details{
    background-image: url(http://starlightbiomat.com/wp-content/uploads/2015/06/photodune-1462591-amethyst-bacground-l-e1434741260554.jpg);
    -moz-border-radius: 0px !important;
    -webkit-border-radius: 0px !important;
    border-radius: 0px !important;
    margin-top: 5px;
}
*/
ul.navlinks{padding-bottom:1px;margin-bottom:1px; border-bottom: transparent !important;}

.bg2{
    transition: background-color .7s !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 3px double black;
    background-color: rgba(44, 53, 57,0.3) !important;
    float: left;
    text-decoration: none !important;
    padding: 3px;
    margin: 3px;
    background-image: none;
}
.bg1{
    transition: background-color .7s !important;
    text-align: center !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none !important;
    border: 1px groove black;
    background-color: rgba(44, 53, 57,0.3) !important;
    float: right;
    padding: 5px;
    margin-right: -5px;
    margin-left: 5px;
    background-image: none;
}
.bg1:hover, .bg2:hover{
    background-color: rgba(0, 0, 0, 0.6) !important;
    transition: background-color .7s !important;
}

.headerbar.nonmobile{
    background-image: url(http://i779.photobucket.com/albums/yy76/Merkwerkee/lkwhdr.png) !important;
    background-repeat:no-repeat !important;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: 1px groove black;
    background-size: cover !important;
    background-color: rgb(255,255,255);
    height:250px !important;
}

.headerbar.nonmobile img{
    opacity:0.0;
    height:250px;
    width:850px;
}


.header_nav.nonmobile{
    margin-top:-51px;
    margin-left:2px
}


.header_nav.nonmobile img{
    opacity:0.0;
    margin-top:-4px;
    margin-bottom: 2px;
}

#page-footer .navbar{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #BDEDFF;
    background-color: transparent !important;
    background-image: none;
}
#page-header .navbar{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #BDEDFF;
    margin: auto !important;
    background-color: rgba(0, 6, 36, 0.1) !important;
    background-image: none !important;
}
#page-body{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove #BDEDFF;
    background-color: rgba(0, 6, 36, 0.1);
    width: 100% !important;
    margin-top: 5px;
    margin-bottom: 5px;
    text-decoration: none !important;
}
#page-footer{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-color: rgba(0, 6, 36, 0.1);
    width: 100% !important;
}
#page-header{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    width: 100% !important;
    padding-bottom: 5px;
}


input.button2{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove black;
    background-color: rgba(80, 69, 55,0.4);
    background-image: url(http://i5.photobucket.com/albums/y184/Angel_Kerrigan/Pokemon/FloatingSpinningUnknown.gif) !important;
}

* {
    font-family: Garamond !important;
    color: darkred !important;
    text-align: center !important;
    text-decoration: none !important;
}

#wrap{
    background-image: none;
    background-color: rgba(4, 13, 17 , 0.2) !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding-top: 20px !important;
    border-radius: 5px;
    margin: auto;
    border: 1px groove #BDEDFF;
}
body{
    background-image:url(http://orig00.deviantart.net/15b3/f/2010/041/7/2/runes_of_arcane_by_melbuframa.jpg);
    background-repeat: no-repeat;
    background-color: black;
    padding-top: 15px !important;
    background-position: center;
    background-attachment: fixed !important;
}
span{
    background-image: none !important;
}
.spoiler .inner{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    background-color: rgba(4, 13, 17 ,0.5);
    border: 1px groove black !important;
}
.codebox{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    background-color: rgba(4, 13, 17 ,0.5);
    border: 1px groove black;
}

.border-right, .border-left, .border-top, .border-top-left, .border-top-right, .border-bottom{
    background: none;
}
dl.left-box.details{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    text-align: center !important;
}
.jumpbox{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px groove black;
    margin-left: 3px;
    margin-right: 3px;
    background-color: rgba(44, 53, 57,0.3);
}

.icon-gold{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    color: transparent !important;
    background:url(https://68.media.tumblr.com/avatar_22aba574275d_128.png) no-repeat, url(https://redice.tv/a/i/n/14/31629RunicH.jpg) no-repeat;
    background-position: 2px 2px, 57px 2px;
    background-size: 13px 13px, 12px 12px;
}
.icon-gold img{opacity:0.0;
    margin-top:0 !important;
    font-color: transparent !important;
    margin-bottom:0 !important;}

.custom_css_avatar img{
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    border: 1px groove black;
}


h3{
    background-image:url(http://68.media.tumblr.com/avatar_b7e46d992595_128.png);
    background-size: 15px 15px;
    background-repeat: no-repeat;
    border-bottom: 1px groove black;
}

.icon-ucp, .icon-logout, .leftside icon-home, .icon-home{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 5px;
    border-radius: 5px;
    border: 1px groove black;
    background-color: rgba(44, 53, 57,0.3);
    background-image: none;
    margin-top: 3px;
    margin-bottom: 3px;
    width: 100%;
}

dl.left-box{
    -moz-border-radius: 1em 1em;
    -webkit-border-radius: 1em 1em;
    border-radius: 1em 1em;
    float: right;
}
h2{
    display: none;
}
a:link, a.postlink:link{
    text-decoration: none !important;
    transition: font-size .7s;
}

a:visited, a.postlink:visited{
    text-decoration: none !important;
}
a:hover, a.postlink:hover{
    text-decoration: none !important;
    background-color: rgba(27, 27, 27, 0.3);
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    transition: background-color .7s;
}


blockquote{
    -moz-border-radius: 2em 2em !important;
    -webkit-border-radius: 2em 2em !important;
    border-radius: 2em 2em !important;
    border:1px groove black !important;
    background-color: rgba(4, 13, 17  ,0.6) !important;
}

.custom_css_rank{
    border-bottom: transparent;
}
.postlink{border-bottom-color: black;}.postlink:visited{border-bottom-color: black;}

.inner{
    padding: -3px !important;
    margin: -3px !important;}

Creatures · Post by **Icefall** » January 17th, 2017, 5:40:31 pm

Username: Asherion
Colours: Ice blue, black and Grey
Theme: Underwater
Just do as you want and for my header could you do like a Ice blue version?

MagiStream

CSS Shop (Open)

Re: CSS Shop (Open; Current backlog: 0)

Re: CSS Shop (Open; Current backlog: 0)

Re: CSS Shop (Open; Current backlog: 0)

Re: CSS Shop (Open; Current backlog: 0)

Re: CSS Shop (Open; Current backlog: 0)

Re: CSS Shop (Open; Current backlog: 0)

Re: CSS Shop (Open; Current backlog: 0)

Re: CSS Shop (Open; Current backlog: 0)

Re: CSS Shop (Open; Current backlog: 0)

Re: CSS Shop (Open; Current backlog: 0)