Custom Follower Notification Gallery

[emrerocky]

Hey folks, this is a little gallery of some different styles of CSS for you to choose from for your notification!

1.

Requested by: mrrugerb

Link : http://deepbot.tv/notifications/follownotification1.htm?dur=10000
Width: 460
Height: 240

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 460px !important;
height: 240px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/z5tGMuA.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 88px !important;
margin-left: 35px !important;
text-align: center !important;
width: 380px !important;
font-size: 44px !important;
font-weight: normal !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 3px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #fdbb30;


}
Preview:


2.

Requested by: AFS_Smokes

Link : http://deepbot.tv/notifications/follownotification1.htm?dur=10000
Width: 500
Height: 100

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 500px !important;
height: 100px !important;
border-radius: 0px !important;
background-image: url('http://i1143.photobucket.com/albums/n631/MGC_Smokes/14_zps9f48d697.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 10px !important;
margin-left: 15px !important;
text-align: center !important;
width: 430px !important;
font-size: 32px !important;
font-weight: normal !important;
font-family: Comic Sans MS !important;
color: white !important;
}
Preview:


3.

Requested by: gh0sthound

Link : http://deepbot.tv/notifications/follownotification1.htm?dur=10000
Width: 950
Height: 270


CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 950px !important;
height: 265px !important;
border-radius: 10px;
background-image: url('http://i.imgur.com/fPkqo5Q.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 88px !important;
margin-left: 180px !important;
text-align: center !important;
width: 600px !important;
font-size: 52px !important;
font-weight: normal !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 3px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #00fdbd;


}
Preview:


4.

Requested by: xxPam

Link : http://deepbot.tv/notifications/follownotification1.htm?dur=10000
Width: 440
Height: 160

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 440px !important;
height: 160px !important;
border-radius: 1px!important;
background-image: url('http://i.imgur.com/Rx73FLr.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 30px !important;
margin-left: 0px !important;
text-align: center !important;
width: 440px !important;
font-size: 38px !important;
font-weight: normal !important;
font-family: Algerian !important;
color: #FFFFFF !important;
-webkit-text-stroke: 0.5px;
-webkit-text-stroke-color: #000
}
Preview:


5.

Requested by: dominerar

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

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 600px !important;
height: 220px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/5L3gkpu.png') !important;
background-repeat: no-repeat !important;
overflow: hidden !important;
}
#follow-notification .followname {
margin-top: 42px !important;
margin-left: 200px !important;
text-align: center !important;
width: 400px !important;
font-size: 48px !important;
font-weight: bold !important;
font-family: Impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 5px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #FFFFFF;
}
Preview:


6.

Requested by: Taintedh

Link : http://deepbot.tv/notifications/follownotification1.htm
Width: 1080
Height: 275

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 1080px !important;
height: 275px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/veKUdJB.png') !important;
background-repeat: no-repeat;
overflow: hidden !important;
}
#follow-notification .followname {
position: absolute !important;
margin-top: 60px !important;
margin-left: 330px !important;
text-align: center !important;
width: 260px !important;
font-size: 26px !important;
font-weight: bold !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #FFFFFF;


}
Preview:


7.

Requested by: dominerar

Link : http://deepbot.tv/notifications/follownotification.htm
Width: 510
Height: 110

CSS Code:

Code: [Select]

#follow-notification {
position: absolute;
width: 500px !important;
height: 110px !important;
background-color: transparent !important;
border-radius: 0px !important;
background-image: url('http://i5.photobucket.com/albums/y158/adira_tyree/snake/snakebar.jpg') !important;
background-repeat: no-repeat !important;
}
#follow-notification .leftimage {
position: absolute !important;
width: 243px !important;
background-repeat: no-repeat !important;
background-image: url('http://i.giphy.com/nOFWb50JcTgAw.gif') !important;
background-size: 243px !important;
border-radius: 0px !important;
z-index: 0 !important;
}
#follow-notification .followname {
position: absolute !important;
margin-left: 0px !important;
padding-top: 20px !important;
text-align: center !important;
width: 500px !important;
font-size: 32px !important;
font-family: Algerian !important;
text-shadow: 2px 2px 1px #000 !important;
color: #ffffff !important;
}

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


8. 

Requested by: Cuerdas

Link: http://deepbot.tv/notifications/follownotification1.htm?dur=10000
Width: 460
Height: 140

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 453px !important;
height: 135px !important;
border-radius: 10px;
background-image: url('http://i.imgur.com/yMAJt0L.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 35px !important;
margin-left: 50px !important;
text-align: center !important;
width: 450px !important;
font-size: 34px !important;
font-weight: bold !important;
font-family: Algerian !important;
color: #FFFFFF !important;
-webkit-text-stroke: 0.3px;
-webkit-text-stroke-color: #000
}
Preview:


9.

Requested by: PowerwalkXD

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

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 500px !important;
height: 125px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/0bPrSEm.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 42px !important;
margin-left: 100px !important;
text-align: center !important;
width: 380px !important;
font-size: 32px !important;
font-weight: bold !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #FFFFFF;


}
Preview:


10.

Requested by: Yawn_Gaming

Link : http://deepbot.tv/notifications/follownotification1.htm?dur=10000
Width: 600
Height: 145

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 600px !important;
height: 145px !important;
border-radius: 10px;
background-image: url('http://i.imgur.com/A9waiZn.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 35px !important;
margin-left: 0px !important;
text-align: center !important;
width: 600px !important;
font-size: 38px !important;
font-weight: bold !important;
font-family: Verdana !important;
color: #FF0000 !important;
-webkit-text-stroke: 1px;
-webkit-text-stroke-color: #000
}
Preview:


11.

Requested by: MrL3x

Link : http://deepbot.tv/notifications/follownotification.htm
Width: 590
Height: 120

CSS Code:

Code: [Select]

#follow-notification {
position: absolute !important;
width: 590px !important;
height: 120px !important;
background-color: transparent !important;
border-radius: 10px !important;
background-image: url('http://i.imgur.com/uvwaYra.png') !important;
background-repeat: no-repeat !important;
}
#follow-notification .leftimage {
position: absolute !important;
visibility: hidden !important;
}
#follow-notification .followname {
position: absolute !important;
margin-left: 0px  !important;
padding-top: 45px !important;
text-align: center !important;
width: 580px !important;
font-size: 32px !important;
font-family: Algerian !important;
text-shadow: 2px 2px 1px #000 !important;
color: #ffffff !important;
}

#follow-notification .header {
visibility: hidden !important;
}
Preview:


12.

Requested by: Silent

Link : http://deepbot.tv/notifications/follownotification1.htm?dur=10000
Width: 600
Height: 145

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 360px !important;
height: 75px !important;
border-radius: 10px;
background-image: url('http://img4.hostingpics.net/pics/533358D3Ticker.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
position: absolute !important;
margin-top: -10px !important;
padding-top: 0px !important;
margin-left: 0px !important;
text-align: center !important;
width: 350px !important;
font-size: 29px !important;
font-weight: normal !important;
font-family: Algerian !important;
color: #f5f214 !important;
-webkit-text-stroke: 0.2px;
-webkit-text-stroke-color: #000
}
Preview:


13.

Requested by: HayZ

Link : http://deepbot.tv/notifications/follownotification1.htm?dur=10000
Width: 600
Height: 120

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 590px !important;
height: 115px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/7XcUztQ.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 13px !important;
margin-left: 0px !important;
text-align: center !important;
width: 590px !important;
font-size: 42px !important;
font-weight: bold !important;
font-family: Calibri !important;
color: #00cebb !important;
-webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #d6d6d6;


}
Preview:


14.

Requested by: bluemurdergaming

Link : http://deepbot.tv/notifications/follownotification1.htm
Width: 1920
Height: 120

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 1920px !important;
height: 120px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/5iDt0tK.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 18px !important;
margin-left: 820px !important;
text-align: center !important;
width: 350px !important;
font-size: 32px !important;
font-weight: bold !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #FFFFFF;


}
Preview:


15.

Requested by: andshelikedit

Link : http://deepbot.tv/notifications/follownotification1.htm?dur=10000
Width: 480
Height: 270

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 480px !important;
height: 265px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/IdnOn9x.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 88px !important;
margin-left: 35px !important;
text-align: center !important;
width: 400px !important;
font-size: 52px !important;
font-weight: normal !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 3px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #fdbb30;


}
Preview:


16.

Requested by: red78phoenix

Link : http://deepbot.tv/notifications/follownotification1.htm
Width: 510
Height: 160

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 500px !important;
height: 160px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/OCAhhgO.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 55px !important;
margin-left: 0px !important;
text-align: center !important;
width: 500px !important;
font-size: 32px !important;
font-weight: bold !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #FFFFFF;


}
Preview:


17.

Requested by: Hanger84

Link : http://deepbot.tv/notifications/follownotification1.htm
Width: 800
Height: 600

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 800px !important;
height: 600px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/mjSZPKo.gif') !important;
background-repeat: no-repeat;
background-position-x: center !important;
overflow: hidden !important;

}
#follow-notification .followname {
position: absolute !important;
margin-top: 480px !important;
margin-left: 0px !important;
text-align: center !important;
width: 800px !important;
font-size: 22px !important;
font-family: ethnocentric !important;
color: #00cebb !important;
-webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #FFFFFF;


}
#follow-notification .followname:after {
content: ' has boarded The Mothership';
font-family: !important;
}
Preview:


18.

Requested by: NexusSin

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

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 580px !important;
height: 200px !important;
border-radius: 00px !important;
background-image: url('https://i.imgur.com/6Yd23FN.png') !important;
background-repeat: no-repeat;
}

#follow-notification .followname {
margin-top: 70px !important;
margin-left: 0px !important;
text-align: center !important;
width: 550px !important;
font-size: 60px !important;
font-weight: bold !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 2px;
-webkit-text-stroke-color: #000000;
-webkit-text-fill-color: #FFFFFF;
}
Preview:


19.

Requested by: koruny

Link : http://deepbot.tv/notifications/follownotification1.htm
Width: 510
Height: 100

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 500px !important;
height: 100px !important;
border-radius: 00px !important;
background-image: url('https://i.imgur.com/vPb8fWu.png') !important;
background-repeat: no-repeat;
}
 
#follow-notification .followname {
margin-top: 24px !important;
margin-left: 0px !important;
text-align: center !important;
width: 500px !important;
font-size: 40px !important;
font-weight: bold !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 2px;
-webkit-text-stroke-color: #000000;
-webkit-text-fill-color: #FFFFFF;
}
Preview:


20.

Requested by: sodopestavi

Link: http://deepbot.tv/notifications/follownotification1.htm
Width: 590
Height: 110

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 580px !important;
height: 110px !important;
border-radius: 00px !important;
background-image: url('https://i.imgur.com/GAJEWaz.png') !important;
background-repeat: no-repeat;
overflow: hidden !important;
}
#follow-notification .followname {
position: absolute !important;
margin-top: 21px !important;
margin-left: 0px !important;
text-align: center !important;
width: 580px !important;
font-size: 40px !important;
font-weight: bold !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #FFFFFF;


}
Preview:


21.

Requested by: bond0788

Link: http://deepbot.tv/notifications/follownotification1.htm
Width: 384
Height: 135

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 374px !important;
height: 135px !important;
border-radius: 00px !important;
background-image: url('https://i.imgur.com/J27OdG8.jpg') !important;
background-repeat: no-repeat;
overflow: hidden !important;
}
#follow-notification .followname {
position: absolute !important;
margin-top: 0px !important;
margin-left: 0px !important;
text-align: center !important;
width: 380px !important;
font-size: 40px !important;
font-weight: bold !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #FFFFFF;
}
#follow-notification .followname:before {
content: 'Thanks for Becoming an Agent: ';
font-family: !important;
font-size: 25px !important
}