Posted By

robnilas on 01/21/17


Tagged

box-css css-box


Versions (?)

Testimonial Box 3


 / Published in: CSS
 

  1. .testimonial {
  2. padding-left: 10px;
  3. padding-right: 10px;
  4. }
  5. .testimonial {
  6. padding-bottom: 30px;
  7. }
  8. .testimonial .bubble:after {
  9. content: "";
  10. position: absolute;
  11. bottom: -10px;
  12. left: 30px;
  13. border-width: 10px 10px 0;
  14. border-style: solid;
  15. border-color: #c9c7c7 transparent;
  16. display: block;
  17. width: 0;
  18. }
  19.  
  20. .testimonial .bubble.hitch {
  21. margin-top: 0;
  22. opacity: 1;
  23. }
  24. .testimonial .bubble {
  25. position: relative;
  26. padding: 20px;
  27. color: #656565;
  28. background: #f3961c;
  29. margin-bottom: 20px;
  30. border: 1px solid #c9c7c7;
  31. border-radius: 5px;
  32. box-shadow: inset 0 1px 3px #ccc;
  33. background: rgba(0,0,0,.02);
  34. text-align: center;
  35. opacity: 0;
  36. margin-top: 10px;
  37. -webkit-transition: opacity .4s linear,margin-top .3s linear;
  38. -moz-transition: opacity .4s linear,margin-top .3s linear;
  39. }
  40. .testimonial span {
  41. font-size: .8em;
  42. padding-left: 50px;
  43. display: block;
  44. padding-bottom: 30px;
  45. }
  46. .testimonial span strong {
  47. color: #4289ba;
  48. font-weight: 400;
  49. }

Report this snippet  

You need to login to post a comment.