Студия подписей «Helloween»

Bombal Harrison · 2020-10-27T12:00:14+0000

.hdg { font-size: 140px; font-style: oblique; font-variant: small caps; font-family: 'Butcherman'; line-height: 1.1; text-shadow: 3px 2px #d6d6d6; position: relative; left: 0; } .hdg_main > span { display: block; } .pumpkin { margin: 60px auto; width: 360px; height: 280px; border-radius: 220px / 240px; position: relative; background-color: #371D0A; background-image: radial-gradient(ellipse at 300px 10px, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.1) 100%); } .pumpkin:before, .pumpkin:after { content: ''; position: absolute; top: 0; width: 100%; height: 100%; border-radius: 180px / 240px; } .pumpkin:before { left: 18%; border-left: 3px solid rgba(0, 0, 0, 0.1); } .pumpkin:after { right: 18%; border-right: 3px solid rgba(0, 0, 0, 0.1); } .pumpkin-stem { position: absolute; top: -34px; left: 160px; height: 40px; width: 40px; background-color: #194d14; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 23px; border-top-right-radius: 10px; background-image: linear-gradient(to right, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 58%, rgba(0, 0, 0, 0.1) 62%, rgba(0, 0, 0, 0.3) 100%); } .pumpkin-eyebrows { position: absolute; top: 45px; height: 40px; width: 300px; left: 25px; z-index: 100; } .pumpkin-eyebrows-item { margin-left: 0px; position: absolute; border: 4px solid #7B3B0C; background-color: #b65610; width: 85px; height: 9px; transition: border-color 2s ease-out; } .pumpkin-eyebrows-item > * { display: block; position: relative; top: -2px; font-size: 16px; } .pumpkin-eyebrows-item_left { transform: rotate(10deg); background-color: #b65610; transform: skew(30deg, 4deg); top: 15px; left: 40px; -moz-transition: background-color 2s ease-out; transition: background-color 2s ease-out; } .pumpkin-eyebrows-item_right { transform: skew(-30deg, -4deg); background-color: #b65610; top: 15px; left: 165px; -moz-transition: background-color 2s ease-out; transition: background-color 2s ease-out; } .pumpkin-glasses { height: 100px; width: 265px; position: absolute; top: 80px; left: 57px; font-size: 0; } .pumpkin-glasses > * { display: inline-block; width: calc(50% - 20px); height: 90px; box-sizing: border-box; border: 10px solid black; border-radius: 25%; box-shadow: inset 0 0 30px 10px gray; position: relative; z-index: 1; } .pumpkin-glasses > * + * { margin-left: 10px; } /* The glasses connector bar */ .pumpkin-glasses:before { content: ""; width: 18px; height: 10px; border: 7px solid black; border-radius: 50%; position: absolute; left: calc(50% - 30px); top: 20px; clip: rect(0, 30px, 12px, 0px); } .pumpkin-glasses-left:before { content: ""; width: 58px; height: 8px; left: -66px; top: 8px; position: absolute; background-color: black; transform: skew(0deg, 20deg); } .pumpkin-glasses-right:before { content: ""; width: 72px; height: 8px; right: -75px; top: 8px; position: absolute; background-color: black; transform: skew(0deg, -20deg); } .pumpkin-eyes { height: 100px; width: 250px; position: absolute; top: 84px; left: 65px; font-size: 0; } .pumpkin-eyes > * { display: inline-block; width: calc(50% - 10px); height: 100px; box-sizing: border-box; position: relative; z-index: 0; } .pumpkin-eyes-left-outer { width: 60px; height: 30px; position: relative; top: 32px; left: 0; z-index: 10; opacity: 0; } .pumpkin-eyes-right-outer { width: 60px; height: 30px; position: relative; top: 20px; left: 20px; transform: rotate(40deg); z-index: 10; opacity: 0; } .pumpkin:hover .pumpkin-eyes-left-outer, .pumpkin:hover .pumpkin-eyes-right-outer { transition: all 1200ms cubic-bezier(1, 0, 0, 1); animation: spin 2.50s; animation-fill-mode: forwards; } @keyframes spin { 100% { transform: rotate(1235deg); opacity: 1; } } .pumpkin-eyes-left, .pumpkin-eyes-right { content: ""; border: 3px solid #7B3B0C; width: 88px; height: 77px; position: absolute; left: 4px; top: 3px; border-radius: 50%; background-color: #B65610; z-index: 0; -moz-transition: background-color 2s ease-out; transition: background-color 2s ease-out; } .pumpkin:hover .pumpkin-eyes-left, .pumpkin:hover .pumpkin-eyes-right, .pumpkin:hover .pumpkin-eyebrows-item { border-color: #b65610; background-color: #F0DD7A; } @keyframes brighten { 100% { background-color: #F0DD7A; } } .pumpkin-eyes-right { left: 120px; } .pumpkin-eyes > * + * { margin-left: 7px; } .innerEye, .innerEye { content: ""; width: 20px; height: 20px; border: 1px solid black; border-radius: 50%; position: absolute; background-color: black; z-index: 4; } .innerEye:after { content: ""; width: 1px; height: 1px; border: 2px solid white; position: absolute; top: 6px; left: 1px; border-radius: 50%; background-color: white; z-index: 5; } .innerEye_right { right: 0; } .pumpkin-nose { border-bottom: 60px solid #7b3b0c; border-left: 30px solid transparent; border-right: 30px solid transparent; width: 0; height: 0; position: absolute; left: calc(50% - 35px); bottom: 80px; font-size: 0; transition: border-bottom-color 2s ease-out; } .pumpkin-nose-inner { content: ""; border-bottom: 45px solid #B65610; border-left: 22px solid transparent; border-right: 22px solid transparent; position: absolute; left: calc(50% - 22px); bottom: -56px; -moz-transition: border-bottom-color 2s ease-out; transition: border-bottom-color 2s ease-out; } .pumpkin:hover .pumpkin-nose { border-bottom-color: #b65610; } .pumpkin:hover .pumpkin-nose-inner { border-bottom-color: #F0DD7A; } .pumpkin:hover .pumpkin-mouth-tooth { animation: boo 8s; } @keyframes boo { 0% {} 5% {} 50% {} 75% {} 100% { clip: rect(0, 0, 0, 0); } } .pumpkin-mouth { width: 300px; height: 100px; margin: 0 auto; position: absolute; bottom: 50px; left: 20px; z-index: 2; background: transparent; font-size: 0; } .pumpkin-mouth-tooth { border-left: 15px solid transparent; border-right: 15px solid transparent; border-top: 30px solid #7B3B0C; width: 0; height: 0; position: absolute; z-index: 1; transition: border-bottom-color 2s ease-out; } .pumpkin-mouth-tooth-inner { content: ""; border-left: 9px solid transparent; border-right: 9px solid transparent; border-top: 20px solid #A9591E; width: 0; height: 0; -moz-transition: border 2s ease-out; transition: border 2s ease-out; position: absolute; bottom: 7px; left: -9px; } .pumpkin:hover .pumpkin-mouth-tooth { border-top-color: #b65610; } .pumpkin:hover .pumpkin-mouth-tooth-inner { border-top-color: #F0DD7A; } .pumpkin-mouth-tooth1 { bottom: 15px; left: 24px; transform: rotate(46deg); } .pumpkin-mouth-tooth2 { bottom: -17px; left: 57px; transform: rotate(28deg); } .pumpkin-mouth-tooth3 { bottom: -32px; left: 100px; transform: rotate(10deg); } .pumpkin-mouth-tooth4 { bottom: -36px; left: 146px; transform: rotate(-3deg); } .pumpkin-mouth-tooth5 { bottom: -28px; left: 190px; transform: rotate(-18deg); } .pumpkin-mouth-tooth6 { bottom: -12px; left: 227px; transform: rotate(-29deg); } .pumpkin-mouth-tooth7 { bottom: 15px; left: 260px; transform: rotate(-50deg); } .pumpkin:hover .boo { border: 5px solid #b65610; width: 30px; height: 35px; background: #F0DD7A; border-radius: 50%; position: absolute; bottom: -40px; left: 135px; font-size: 0; clip: rect(0, 0, 0, 0); animation: boo-mouth 8s; } .boo { font-size: 0; } .boo-inner { content: ""; display: block; position: absolute; left: 50px; bottom: 0px; color: white; border-radius: 20%; text-shadow: 6px 6px black; font-family: "Creepster"; animation: brighten; } @keyframes boo-mouth { 100% { clip: initial; font-size: 150px; text-indent: 200px; } } .pumpkin:hover .pumpkin-eyebrows { animation: eyebrows 1s; /* IE 10+, Fx 29+ */ } @keyframes eyebrows { 0% { top: 45px; } 25% { top: 25px; } 50% { top: 45px; } 75% { top: 25px; } 100% { top: 45px; } } .sign{ width: 220px; height: 260px; border: 1px solid rgb(32, 32, 32); border-top-left-radius: 50%; border-top-right-radius: 50%; position: relative; left: 40%; bottom: 50px; text-align: center; box-shadow: -20px -5px 0px darkgrey; background-color: rgb(92, 92, 92); z-index: 100; } .sign:before { content: ""; width: 260px; height: 100px; border-top-left-radius: 50%; border-top-right-radius: 50%; border-bottom-left-radius: 50%; border-bottom-right-radius: 50%; position: absolute; right: -15px; bottom: -51px; clip: rect(0, 260px, 50px, 0); background-color: rgb(90, 64, 38); z-index: -1; } .sign:after { } .caption { padding: 0 25px; position: absolute; top: 75px; color: rgb(32, 32, 32); text-shadow: 2px 2px #ffffff; font-family: "Creepster"; font-size: 0px; line-height: 1.2; transition: text-shadow 2s ease-out; } .sign:hover .caption { text-shadow: 0px 7px rgb(124, 20, 20); font-size: 30px; } .arm { width: 60px; height: 100px; position: absolute; bottom: -21px; left: 35%; clip: rect(0, 60px, 79px, 0); overflow: hidden; } .hand { position: absolute; width: 25px; height: 10px; bottom: -10px; left: 50%; background-color: white; border-radius: 20%; transform: bottom 3s ease-out; } @keyframes hand { 90% { bottom: 50px;} 100% { bottom: -10px ;} } .sign:hover .hand { animation: hand 3s ease-out; animation-fill-mode: forwards; } .hand:after { content: ""; width: 7px; height: 40px; position: absolute; left: 4px; background-color: white; border-radius: 10%; transform: rotate(-5deg); } .hand:before { content: ""; width: 5px; height: 40px; position: absolute; left: 16px; background-color: white; border-radius: 10%; transform: rotate(5deg); } .finger { width: 1px; height:25px; position: absolute; background: #000000; border: 2px solid white; border-radius: 20%; } .finger_1 { border: 2px solid white; border-radius: 30%; height: 15px; transform: rotate(-70deg); left: -5px; bottom: 0px; } .finger_2 { height: 20px; bottom: 3px; left: 2px; transform: rotate(-10deg); } .finger_3 { height: 22px; bottom: 5px; left: 10px; } .finger_4 { bottom: 4px; left: 16px; height: 20px; transform: rotate(6deg); } .finger_5 { left: 22px; bottom: 2px; height: 19px; transform: rotate(7deg); } В разработке Boo! ты никОгда не выиграешь

Bombal Harrison

Опубликовано: 27 октября 2020

- Поделиться

Опубликовано: 27 октября 2020

В разработке

Boo!

ты никОгда не выиграешь

Цитата

RP 5:

1 ноября 2020

22:52:45

Админ Daniel_Heartless [2] поднял уровень админки Bombal_Harrison [15616]

27 октября 2020

16:44:55

Админ Daniel_Heartless [2] поднял уровень админки Bombal_Harrison [15616]

4 октября 2020

18:2:44

Админ Daniel_Heartless [2] поднял уровень админки Nick_Bombal [15616]

30 сентября 2020

17:38:10

Админ Daniel_Heartless [2] сделал Nick_Bombal [15616] Helper'ом

30 сентября 2020

17:38:8

Админ Jay_Harrison [4455] снял с Nick_Bombal [15616] лидерство фракции Министерство СМИ

13 июля 2020

14:20:20

Админ Jay_Harrison [4455] назначил Nick_Bombal [15616] лидером фракции Министерство СМИ

13 июля 2020

14:20:10

Админ Jay_Harrison [4455] снял с Nick_Bombal [15616] лидерство фракции Радиоцентр Лос Сантос

13 июня 2020

20:7:13

Админ Jay_Harrison [4455] назначил Nick_Ives [15616] лидером фракции Радиоцентр Лос Сантос

RP 1:

15 ноября 2017

21:24:38

Министр СМИ Adalinda_Harrison [1249021] снял с Nick_Provenzano [2223266] лидерство фракции Радиоцентр Сан Фиерро

15 октября 2017

14:10:0

Админ Sara_Ferron [207519] назначил Nick_Provenzano [2223266] лидером фракции Радиоцентр Сан Фиерро

28 июля 2017

19:33:21

Админ Damien_Tedesco [95580] снял с Oliver_Provenzano [551739] лидерство фракции Мэрия Лас Вентурас

28 июня 2017

20:59:29

Админ Damien_Tedesco [95580] назначил Oliver_Provenzano [551739] лидером фракции Мэрия Лас Вентурас

Ссылка на комментарий

Присоединяйтесь к обсуждению

Вы можете опубликовать сообщение сейчас, а зарегистрироваться позже. Если у вас есть аккаунт, войдите в него для написания от своего имени.
Примечание: вашему сообщению потребуется утверждение модератора, прежде чем оно станет доступным.

Войти

Рекомендованные сообщения

Bombal Harrison

Ссылка на комментарий

Присоединяйтесь к обсуждению

Сейчас на странице 0 пользователей

Сообщество

Активность