/**
 * Plugin styles
 */

.dynamic-height-wrap {
  overflow: hidden;
  position: relative;
  -webkit-transition: max-height 0.5s ease-in-out;
  -moz-transition: max-height 0.5s ease-in-out;
  -o-transition: max-height 0.5s ease-in-out;
  transition: max-height 0.5s ease-in-out;
  width: 100%;
}

/* Bottom gradient (optional, but recommended)*/
.dynamic-height-active .dynamic-height-wrap:before {

  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00f0f9ff', endColorstr='#ffffff',GradientType=0 );
  bottom: 0;
  content:'';
  height: 30px;
  left: 0;
  position: absolute;
  right: 0;
  z-index: 1;
}

.dynamic-height-active .dynamic-show-more {
  display: inline-block;
}
.dynamic-show-more {
  display: none;
}


/**
 * Demo styles
 */




a {
  color:#2980b9;
}

h1 {
  font-size: 28px;
  margin-bottom: 1em;
  line-height: 1.3em;
}

h1 span {
  color: #b0b0b0;
  font-size: .8em;
  font-weight: normal;
}

.section {
  margin-bottom: 30px;
}
pre {
  background: #ecf0f1;
  border-radius: 4px;
  margin: 10px 0;
  padding: 5px 10px;
}

.button {
  color: #fff;
  background: #27ae60;
  border: none;
  border-radius: 4px;
  font-size: 13px;
  outline: none;
  padding: 2px 15px;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .2);
}
button.button{
  background:#2980b9;
}

li {
  list-style: none;
  margin-top: 0px;
}

li strong {
  color: #27ae60;
}

.dynamic-height-wrap {
  margin-bottom: 20px;
}

.buttons-wrap{
  display: flex;
  margin-top: 20px;
}

.button {
  flex: 1;
  text-align:center;
  text-decoration: none;
}

.button + .button{
  margin-left:10px;
}