Блоки как геометрические фигуры

[intman]

Собрал три блока в виде геометрических фигур - сверху и снизу треугольники в середине параллелогамм.   И составил  их в столбец, обернув все в общий блок.

<div class="d4">
<div class="d1"></div>
<div class="d5"></div>
<div class="d3"></div>
</div>

Но в результате получилось, что расстояния между ними большие. Как состывать их вместе, нужно практически вплотную, максимум с отступом в 10 px. Использование padding и margin к желаемому результату не привело.

Код CCS  такой

Треугольник сверху

width: 0; 
height: 0;
border-top: 100px solid #68B8AE;
border-right:425px solid transparent;
	display:inline-block;	
	margin-top:600px;

параллелогамм

-moz-transform: rotate(76deg) skew(7deg, 15deg);
-webkit-transform: rotate(76deg) skew(7deg, 15deg);
-o-transform: rotate(76deg) skew(7deg, 15deg);
-ms-transform: rotate(76deg) skew(7deg, 15deg);
transform: rotate(76deg) skew(7deg, 15deg);
width:250px; 
height:450px;
border:4px solid #8B0000;
background:#7FFF00;
 margin-left:86px;

треугольник снизу

width: 0;
	height: 0;
	border-bottom: 100px solid red ; 
	border-left: 425px solid transparent;
		margin-bottom:700px;
display:inline-block;		
}