Помогите с :hover и :transition

Общее
1

Люди добрые, помогите разобраться, весь день пытаюсь понять почему у меня не получается.
Вообщем идея была сделать одну красную кнопку, чтобы при наведении появлялось еще 4 зеленых.
Реализовать попытался 2мя очень похожими способами, через div и через список.

https://codepen.io/lokonaft/pen/GXqBBP - в данном случае почему то не работает transition
https://codepen.io/lokonaft/pen/qMNMVL - в данном случае я то ли не могу правильно задать hover, то ли я чего то не понимаю

2
Так? 
body {
  font-size: 12px;
  font-family: 'Pacifico';
  font-style: normal;
  font-weight: normal;
  src: local('Pacifico'), url('http://themes.googleusercontent.com/font?kit=fKnfV28XkldRW297cFLeqfesZW2xOQ-xsNqO47m55DA') format('truetype');
}
div {
	padding: 0;
	margin: 0;
}
.container {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 50px;
	height: 50px;
}
.fight{
	display: block;
	position: absolute;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	border: 1px solid transparent;
}
.fight-button{
	background-color: red;
	z-index: 2;
	top: 0;
	left: 0;
	box-shadow: 3px 3px 10px rgb(0,0,0,0.5);
	border: 1px solid white;
}

i.ra {
	font-size: 34px;
	color: white;
	position: absolute;
	top: 8px;
	left: 8px;
}

.fight-button:hover .skill {
	background-color: green;
	box-shadow: 3px 3px 10px rgb(0,0,0,0.5);
	border-color: white;
  transition-property: background-color, box-shadow, border-color;
  transition-duration: 1s, 1s, 1s;
}

.fight-button:hover .skill:nth-of-type(1) {
	top: -75px;

}
.fight-button:hover .skill:nth-of-type(2) {
	top: -50px;
	left: 50px;
}
.fight-button:hover .skill:nth-of-type(3) {
	left: 75px;
}
.fight-button:hover .skill:nth-of-type(4) {
	top: 50px;
	left: 50px;
}
3

Спасибо, hover теперь работает как надо, но transition по прежнему не реагирует(

4

Как должно быть?

5

transition стоит 1s, но по факту замедления в появлении зеленых кнопок нет

6

У меня сейчас при наведении на красную кнопку зелёные появляются плавно.
Вы весь CSS заменили, или только некоторые правила?

7

Спасибо, разобрался) главное уловил суть)