.container {
  width: 400px;
  height: 190px;
  padding: 55px 0;
  background: #eae6dd;
  background: -moz-linear-gradient(top,  #eae6dd 0%, #cac5c2 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eae6dd), color-stop(100%,#cac5c2));
  background: -webkit-linear-gradient(top,  #eae6dd 0%,#cac5c2 100%);
  background: -o-linear-gradient(top,  #eae6dd 0%,#cac5c2 100%);
  background: -ms-linear-gradient(top,  #eae6dd 0%,#cac5c2 100%);
  background: linear-gradient(to bottom,  #eae6dd 0%,#cac5c2 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eae6dd', endColorstr='#cac5c2',GradientType=0 );
  margin: 0 auto;
  background-repeat: no-repeat;
}

.cell {
  position: relative;
  background: #f69844;
  background: -moz-linear-gradient(top,  #f69844 0%, #d94911 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f69844), color-stop(100%,#d94911));
  background: -webkit-linear-gradient(top,  #f69844 0%,#d94911 100%);
  background: -o-linear-gradient(top,  #f69844 0%,#d94911 100%);
  background: -ms-linear-gradient(top,  #f69844 0%,#d94911 100%);
  background: linear-gradient(to bottom,  #f69844 0%,#d94911 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f69844', endColorstr='#d94911',GradientType=0 );
  width: 190px;
  height: 190px;
  margin: 0px auto;
  border-radius: 30px;
  border: 1px solid #c9400e;
  box-shadow: 
    inset 0 -4px 5px 2px rgba(171,55,9,.7),
    0 15px 10px -10px rgba(145,84,52,.4),
    0 30px 20px -20px rgba(145,84,52,.4),
    0 45px 30px -30px rgba(145,84,52,.4),
    0 60px 40px -40px rgba(145,84,52,.4),
    0 75px 50px -50px rgba(145,84,52,.4);
    color: white;
    line-height: 190px;
    text-align: center;
  font-size: 140px;
}

.cell:before {
  content: "";
  position: absolute;
  width: 188px;
  height: 180px;
  top: 2px;
  left: 2px;
  border-radius: 30px;
  border-top: 3px solid #fcb76b;
  border-bottom: 2px solid #e25a0c;
}

.dots {
  display: block;
  position: relative;
}

.dots:before, .dots:after {
  content: "";
  position: absolute;
  width: 33px;
  height: 26px;
  top: 126px;
  left: 42px;
  border-radius: 50%;
  background: #fff9e9;
background: -moz-radial-gradient(40% -40%, ellipse cover,  #fff9e9 0%, #fff2db 62%, #ffe9c8 62%, #feba8c 90%, #fff9e9 94%, #feba8c 100%);
background: -webkit-gradient(radial, 40% -40%, 0px, center -10px, 100%, color-stop(0%,#fff9e9), color-stop(62%,#fff2db), color-stop(62%,#ffe9c8), color-stop(90%,#feba8c), color-stop(94%,#fff9e9), color-stop(100%,#feba8c));
background: -webkit-radial-gradient(40% -40%, ellipse cover,  #fff9e9 0%,#fff2db 62%,#ffe9c8 62%,#feba8c 90%,#fff9e9 94%,#feba8c 100%);
background: -o-radial-gradient(40% -40%, ellipse cover,  #fff9e9 0%,#fff2db 62%,#ffe9c8 62%,#feba8c 90%,#fff9e9 94%,#feba8c 100%);
background: -ms-radial-gradient(40% -40%, ellipse cover,  #fff9e9 0%,#fff2db 62%,#ffe9c8 62%,#feba8c 90%,#fff9e9 94%,#feba8c 100%);
background: radial-gradient(ellipse at 40% -40%,  #fff9e9 0%,#fff2db 62%,#ffe9c8 62%,#feba8c 90%,#fff9e9 94%,#feba8c 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff9e9', endColorstr='#feba8c',GradientType=1 );
  background-size:;
  background-repeat: no-repeat;
}

.dots:after {
  top: 120px;
  left: 105px;
}

.note path {
  path: ;
}

#SVGID_1_ {
  box-shadow: 10px 10px #000;
}