Please make me new follower/donation CSS

[Vigorousq]

Hey there, could I please get some css for this image please?
in the center of both text.

Thank you!

http://i.imgur.com/NSnK26P.png

http://i.imgur.com/qwEEgwL.png

[ExpertsOnline]

Link : http://deepbot.tv/notifications/follownotification1.htm
Width: 640
Height: 130

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 640px !important;
height: 130px !important;
border-radius: 0px!important;
background-image: url('http://i.imgur.com/NSnK26P.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 5px !important;
margin-left: 100px !important;
text-align: center !important;
width: 470px !important;
font-size: 42px !important;
font-family: Corbel !important;
font-weight: bold !important;
color: #FFF !important;
-webkit-text-stroke-width: 0.5px;
-webkit-text-stroke-color: #000;
text-shadow:3px 3px 5px #000;
     
}
#follow-notification .header {
visibility: hidden !important;
}
Preview:



Link : http://deepbot.tv/notifications/donationnotification2.htm
Width: 640
Height: 130

Code:

Code: [Select]

#donor-notification {
width: 640px !important;
height: 130px !important;
background-color: transparent !important;
background-image:url('http://i.imgur.com/qwEEgwL.png') !important;
background-repeat: no-repeat !important;
background-size: initial !important;
}


#donor-notification .header {
position: absolute !important;
visibility: hidden !important;
}

#donor-notification .streamname {
visibility: hidden !important;
}

#donor-notification .message {
visibility: hidden !important;
}
#donor-notification .amount {
font-size: 40px !important;
font-family: Corbel !important;
color: #FFF !important;
font-weight: bold !important;
-webkit-text-stroke-width: 0.5px;
-webkit-text-stroke-color: #000;
text-shadow:3px 3px 5px #000;
}
#donor-notification .donor {
font-size: 40px !important;
font-family: Corbel !important;
font-weight: bold !important;
color: #FFF !important;
-webkit-text-stroke-width: 0.5px;
-webkit-text-stroke-color: #000;
text-shadow:3px 3px 5px #000;
}
#donor-notification .donor:after {
content: ' - ';
}
#donor-notification .title {
padding-top: 31px !important;
padding-left: 120px !important;
width: 480px !important;
float: left !important;
text-align: center !important;
}

Preview:

[Vigorousq]

Thank you looks great..!

[Vigorousq]

Hi,

Sorry but i have done all tha was request from the guid but when i post this link  http://deepbot.tv/notifications/follownotification1.htm on the add webpage on xplit i get other picture and not mine...?

[ExpertsOnline]

Ah - for XSplit you need to replace single quotes(') with double quotes (")
Weird difference between OBS and XSplit for CSS codes.

[Vigorousq]

  is working now tank you....

[Vigorousq]

hi Expertonline

i was woundring if i can get a new  CSS style sheet  on the donation picture right now when some donate
i can only see how muy the have donate and not the message. So can you plz make one tha the massege the
put when they donate shows in the black bar below the green and if is possible i want it to scroll ,the rest work good

thank you Expertonline

[TheNumbLock]

Took me all day/night to figure this out. But hope it works for you.

Donation: http://deepbot.tv/notifications/donationnotification2.htm

Width: 650
Height: 150

Code: [Select]

#donor-notification {
width: 640px !important;
height: 130px !important;
background-color: transparent !important;
background-image:url('http://i.imgur.com/qwEEgwL.png') !important;
background-repeat: no-repeat !important;
background-size: initial !important;
}


#donor-notification .header {
position: absolute !important;
visibility: hidden !important;
}

#donor-notification .streamname {
visibility: hidden !important;
}

#donor-notification .message {
position: fixed !important;
  margin-top: 106px !important;
font-size: 18px !important;
font-weight: normal !important;
font-family: Corbel !important;
color: white !important;
  overflow: hidden;
  float: none;
  word-wrap: nowrap;               
  display: initial;
  width: 100% !important;                     
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  -moz-animation-name: marquee;
  -webkit-animation-name: marquee;
  -moz-animation-duration: 15s;
  -webkit-animation-duration: 15s;
  -moz-animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -webkit-animation-timing-function: linear;
}
@-webkit-keyframes marquee{
  0% {
    left: 100%;
  }
  100% {
    left: -100%;
  }
}
             
@-moz-keyframes marquee{
  0% {
    left: 100%;
  }
  100% {
    left: -100%;
  }
}
}
#donor-notification .amount {
font-size: 40px !important;
font-family: Corbel !important;
color: #FFF !important;
font-weight: bold !important;
-webkit-text-stroke-width: 0.5px;
-webkit-text-stroke-color: #000;
text-shadow:3px 3px 5px #000;
}
#donor-notification .donor {
font-size: 40px !important;
font-family: Corbel !important;
font-weight: bold !important;
color: #FFF !important;
-webkit-text-stroke-width: 0.5px;
-webkit-text-stroke-color: #000;
text-shadow:3px 3px 5px #000;
}
#donor-notification .donor:after {
content: ' - ';
}
#donor-notification .title {
padding-top: 31px !important;
padding-left: 120px !important;
width: 480px !important;
float: left !important;
text-align: center !important;
}


[Vigorousq]

thank you looks good and it works nice job!

[TheNumbLock]

thank you looks good and it works nice job!

Your welcome. Glad it works.