/*=============================================================================*/
/* Your custom styles below */
/*===============================================================================*/



.box {
  -webkit-box-shadow: 0px 12px 6px -6px rgba(41,41,41,0.25);
  -moz-box-shadow: 0px 12px 6px -6px rgba(41,41,41,0.25);
  box-shadow: 0px 12px 6px -6px rgba(41,41,41,0.25);  padding: 0;
}

.step1 {
  z-index: 999;
}

.step2 .animated {
  -webkit-animation-delay: 1s; 
  animation-delay: 1s;
  position: relative;
  top: -6px;
}

.step3 .animated {
  -webkit-animation-delay: 2s; 
  animation-delay: 2s;
  z-index: -3;
  position:relative;
  top: -12px;
}

.step4 .animated {
  -webkit-animation-delay: 3s; 
  animation-delay: 3s;
  z-index: -5;
  position: relative;
  top: -18px;
}

.shape {
	width: 150px;
	height: 120px;
	-webkit-transform: skew(20deg);
  -moz-transform: skew(20deg);
  -o-transform: skew(20deg);
  -webkit-box-shadow: 0px 12px 30px -6px rgba(41,41,41,0.25);
  -moz-box-shadow: 0px 12px 30px -6px rgba(41,41,41,0.25);
  box-shadow: 0px 12px 30px -6px rgba(41,41,41,0.25);
  top: 10px;
  left: 8px;
  text-align: center;
}

.shape-1 .shape{
  background: #e74c3c;
}

.shape-1 .material-icons {
  color: #e74c3c;
}

.shape-2 .shape{
  background: #34495e;
}

.shape-2 .material-icons { 
  color: #34495e;
}

.shape-3 .shape {
  background: #f39c12;
}

.shape-3 .material-icons { 
  color: #f39c12;
}

.shape-4 .shape {
  background: #3498db;
}

.shape-4 .material-icons { 
  color: #3498db;
}

.number {
  -webkit-transform: skew(-20deg);
	-moz-transform: skew(-20deg);
  -o-transform: skew(-20deg);
}



.box p {
  font-weight: 300;
  padding-top: 25px;
}