* {
  margin:0px;
  padding:0px;
  display:border-box;
}

$gray: #989A8F;
$border-color:#dddcd8;
$bc-white: #f7eec7;
$bc-purple:#5d4660;

@import url(http://fonts.lug.ustc.edu.cn/css?family=Droid+Sans:400,700|Droid+Serif:400,700);

html,body {
  height:100%;
}

body {
  font-family:'Droid Sans';
  text-align:center;
  background-color:$bc-purple;
  @include filter-gradient($bc-purple, $bc-white, vertical);
  $experimental-support-for-svg:true;
  @include background-image(linear-gradient(top, $bc-purple 0%, $bc-white 100%));
  background-repeat: no-repeat;
}

ul {
  display:flex;
}

ul li {
  flex:1;
  border-left:1px solid $border-color;
}

.wrap {
  max-width:800px; 
  margin:50px auto 0 auto;
  color:$gray;
}

.table {
  background-color:white;
  height:325px;
}

.top {
  background-color:#EAE9E4;
  height:75px;
  h1 {
    padding-top:20px;
  }
}

.circle {
  width:60px;
  height:60px;
  border-radius:60px;
  font-size:20px;
  line-height:60px;
  text-align:center;
  margin:10px auto 0 auto;
  color:white;
  background:$gray;
}

.bottom {
  margin-top:50px;
  p {
    font-size:13px;
    font-family:'Droid Serif';
    padding:5px;
    span {
      font-weight:bold;
    }
  }
}

.sign {
  display:border-box;
  margin-top:50px;
  .button {
    border:1px solid $gray;
    padding:10px 40px;
    border-radius:6px;
    color:$gray;
    font-size:14px;
    text-decoration:none;
    font-size:17px;
  }
  
  .button-selected {
    color:white;
    background-color:$bc-purple;   
  }
}

.purple {
  background-color:$bc-purple;   
}

.white {
   color:white; 
}

.pink {
  background-color:#BC9B94;
}