/*******
********/
.sc-container {
  display:inline-block;
  vertical-align: top;
  width:31%;
  
}  
.pointer {
      width: 100%;
      height: 230px;
      position: relative;
      background: #eeeeee;
     display:inline-block;
     padding:40px 20px 40px 60px;
     text-align:center;
    }
    .pointer:after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 0;
      height: 0;
      border-left: 40px solid white;
      border-top: 115px solid transparent;
      border-bottom: 115px solid transparent;
    }
    .pointer:before {
      content: "";
      position: absolute;
      right: -40px;
      bottom: 0;
      width: 0;
      height: 0;
      border-left: 40px solid #eeeeee;
      border-top: 115px solid transparent;
      border-bottom: 115px solid transparent;
    }
.pointer.one:before {
    content: "";
    position: absolute;
      right: -40px;
      bottom: 0;
      width: 0;
      height: 0;
      border-left: 40px solid #DB2763;
      border-top: 115px solid transparent;
      border-bottom: 115px solid transparent;
}
 .pointer.one:after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 0;
      height: 0;
    border-left: 0px solid white;
      border-top: 115px solid transparent;
      border-bottom: 115px solid transparent;
    }
  .pointer.three:before {
      content: "";
      position: absolute;
      right: -40px;
      bottom: 0;
      width: 0;
      height: 0;
      border-left: 0px solid #eeeeee;
      border-top: 115px solid transparent;
      border-bottom: 115px solid transparent;
    }
.pointer.one {
  z-index:3;
  background-color: #DB2763;
  color: #ffffff;
  padding: 40px 20px 40px 20px;
}
.two {
  z-index:2;
}
.three {
  z-index:1;
}
/* Pointer Content */
.pointer .sc-icon {
  display:block;
  margin-bottom: 10px;
}
.sc-icon img {
  width:200px;
}
.pointer .sc-title {
  display:block;
  font-size: 1.1em;
  font-weight: 700;
}
.pointer .sc-price {
  display:block;
    font-size: 1.1em;
  font-weight: 700;
}
/* Details */
.sc-details {
  padding: 10px 10px 10px 20px;
}
.sc-details span {
  display:block;
}
.sc-details li {
    margin-bottom: 5px !important;
  }

@media screen and (max-width: 1024px) {
  .sc-container {
    width:100%;
  }
  .pointer {
    display:inline-block;
    width:50%;
    margin-top:5px;
    padding: 60px 20px 40px 20px;
  }
  .sc-details {
    display:inline-block;
    max-width: 49%;
  }
  .sc-details li {
    margin-bottom: 5px;
  }
  .pointer.one:before {
    content: url('img/triangle.svg');
    position: absolute;
    right: 0;
    bottom: 0;
    width: 0;
    height: 0;
    border-top: 40px solid #DB2763;
    border-left: 115px solid transparent;
    border-right: 115px solid transparent;
    top: 100%;
}
.pointer.one:after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 0;
      height: 0;
    border-left: 0px solid white;
      border-top: 115px solid transparent;
      border-bottom: 115px solid transparent;
    }
.pointer.three:before {
      content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 0;
    height: 0;
    border-top: 0px solid #eeeeee;
    border-left: 115px solid transparent;
    border-right: 115px solid transparent;
    top: 100%;
}
 .pointer:before {
       content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 0;
    height: 0;
    border-top: 40px solid #eeeeee;
    border-left: 115px solid transparent;
    border-right: 115px solid transparent;
    top: 100%;
    }
   .pointer:after {
     content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-top: 40px solid white;
    border-left: 115px solid transparent;
    border-right: 115px solid transparent;
    bottom: 0;
    right: 0;
    top: 0;
    left:auto;
    }
}

@media screen and (max-width: 768px) {
  .sc-container {
    width:100%;
  }
  .pointer {
    display:inline-block;
    width:100%;
    margin-top:5px;
    padding: 60px 20px 40px 20px;
  }
  .sc-details {
    display:block;
    width: 100%;
    max-width: 100%;
    padding: 10px;
  }
.pointer:before {
      display:none;
    }
   .pointer:after {
    display:none;
    }
}