Follower and Donation

[Graffixg]

Donation Alert

Image Link: http://s7.postimg.org/81d24n9az/New_Follower_Alert.png
Font Style/Link: http://www.dafont.com/search.php?q=overseer
Font Color: Red
Any text fill/boarder?: Black thin border
Marquee/Scroll Effect?:no
Currency Type: usd
Where do you want text located?(Donator Name, Donation Amount, Message) Name and amount on the image, message below
Example (If applicable):Porgeland $20.00 thank you for a good stream!


Follower Alert

Image Link: http://s7.postimg.org/81d24n9az/New_Follower_Alert.png
Font Style/Link: http://www.dafont.com/search.php?q=overseer
Font Color: Red
Any text fill/boarder?: Black thin border
Marquee/Scroll Effect?:no
Where do you want text located? (Follower Name): On image
Anything else: I would like Welcome to the Steakhouse across the top of the image curving with the image. if possible. if the curve isn't possible just leave it off.

[TheNumbLock]

Curve is a bit hard, since I have to do every single letter. But if you can do it yourself in photoshop or something I can redo the CSS.

Requested by: Graffixg

Follower:

Link: http://deepbot.tv/notifications/follownotification1.htm
Width: 550
Height: 220

CSS Code:

Code: [Select]

@font-face {
font-family: "OS";
src: url("http://download1500.mediafire.com/yyy7etx789lg/9s64z90lv06b00s/Overseer.otf");
}

#follow-notification {
display: none;
position: absolute;
width: 550px !important;
height: 198px !important;
background-image: url("http://s7.postimg.org/81d24n9az/New_Follower_Alert.png") !important;
background-repeat: no-repeat;
}

#follow-notification .followname {
position: absolute !important;
margin-top: 0px !important;
margin-left: 70px !important;
width: 400px !important;
font-size: 40px !important;
font-weight: normal !important;
font-family: OS !important;
color: blue !important;
-webkit-text-fill-color: red;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 1.5px;
}

.followname:before {
content: "Welcome to the Steakhouse ";
}

Preview: (If there is a black background, it is just my background.)




Donation:

Link: http://deepbot.tv/notifications/donationnotification2.htm
Width: 550
Height: 220

CSS Code:

Code: [Select]

@font-face {
font-family: "OS";
src: url("http://download1500.mediafire.com/yyy7etx789lg/9s64z90lv06b00s/Overseer.otf");
}

#donor-notification {
width: 550px !important;
height: 198px !important;
background-color: transparent !important;
background-image:url("http://s7.postimg.org/81d24n9az/New_Follower_Alert.png") !important;
background-repeat: no-repeat !important;
background-size: initial !important;
}
 
#donor-notification .header {
visibility: hidden !important;
}
 
#donor-notification .streamname {
visibility: hidden !important;
}
 
#donor-notification .message {
position: absolute !important;
margin-top: 80px !important;
margin-left: 20px !important;
width: 500px !important;
font-size: 30px !important;
font-weight: normal !important;
font-family: OS !important;
color: blue !important;
text-shadow: 2px 2px black;
-webkit-text-fill-color: red;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 1.5px;
}
#donor-notification .amount {
position: absolute !important;
margin-top: 0px !important;
margin-left: -80px !important;
font-size: 40px !important;
font-weight: normal !important;
font-family: OS !important;
color: blue !important;
text-shadow: 2px 2px black;
-webkit-text-fill-color: red;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 1.5px;
}
#donor-notification .donor {
position: absolute !important;
margin-top: 0px !important;
margin-left: -200px !important;
width: 500px !important;
font-size: 40px !important;
font-weight: normal !important;
font-family: OS !important;
color: blue !important;
text-transform: capitalize;
text-shadow: 2px 2px black;
-webkit-text-fill-color: red;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 1.5px;
}

Preview: (If there is a black background, it is just my background.)

[Graffixg]

I am having trouble getting it to work. The CSS doesn't seem to overwrite what pops up on the website. I am doing the same thing I have done with others you have made. Don't know why these are not working for me.

[TheNumbLock]

Using xsplit or obs?

Also, using the correct URLs that I listed?

Mind screenshotting the general tab of the CLR Properties?

[Graffixg]

Xsplit
yes sir I copy and pasted everything from this post.
I dont know if this was what you wanted screenshotted.

[TheNumbLock]

The CSS has been fixed. Just copy and paste each one and overwrite the old code. xSplit doesn't like ', it prefers ".

[Graffixg]

Sweet!! It works perfect Thanks!!