.comments {
  color:#3d3d3d;
  font-size:17px;
  font-family:arial,verdana,tahoma;
  max-width:700px;
  text-align:left;
}

.comments textarea {
  outline:none;
  border:1px solid #e6e6e6;
  width:100%;
  appearance:none;
  -webkit-appearance:none;
  margin:0px;
  height:80px;
  margin-bottom:5px;
  resize:none;
  box-sizing:border-box;
  padding:5px;
  font-size:16px;
  font-family:arial,verdana,tahoma;
}
.comments input[type=button] {
  appearance:none;
  -webkit-appearance:none;
  border:1px solid #e6e6e6;
  padding:7px;
  padding-right:15px;
  padding-left:15px;
  margin:0px;
  color:#3d3d3d;
  background-color:#e6e6e6;
  font-size:16px;
  font-family:arial,verdana,tahoma;
  cursor:pointer;
}

.comments .input input[type=button] {
  float:right;
}

.comments .top {
  border-bottom:1px solid #e6e6e6;
  margin-bottom:10px;
  padding-bottom:5px;
}

.comments .number {
  
}

.comments .container {
  overflow:hidden;
}

.comments .comment {
  position:relative;
  margin-bottom:10px;
  padding-top:10px;
  line-height:150%;
}

.comments .comment .author {
  font-weight:bold;
}
.comments .comment .content {
  white-space:pre-wrap;
  word-wrap:break-word;
  max-width:100%;
  width:auto;
  text-align:left;
  display:block;
  margin:0px;
  padding:0px;
  height:auto;
  font-size:17px;
}

.comments .comment .tools {
}

.comments .comment .tools > div {
  display:inline-block;
  font-weight:bold;
  margin-right:10px;
  color:#666666;
  cursor:pointer;
}

.comments .comment .tools > div.active {
  color:#2e63bc;
}

.comments .comment .tools .score {
  font-weight:normal;
  color:#888888;
  cursor:default;
}

.comments .comment .replies {
  border-left:1px solid #e6e6e6;
  padding-left:10px;
}

.comments .comment .hidden {
  cursor:pointer;
  color:#aaa7a7;
}

.comments .more {
  -moz-box-shadow:inset 0px -70px 50px rgba(255,255,255,1);
  -webkit-box-shadow:inset 0px -70px 50px rgba(255,255,255,1);
  box-shadow:inset 0px -70px 50px rgba(255,255,255,1);
  position:relative;
  text-align:center;
  margin-top:-40px;
  padding-top:37px;
  margin-bottom:10px;
}

.comments .more > div {
  cursor:pointer;
  border:1px solid #e6e6e6;
  background-color:#ffffff;
  line-height:40px;
  border-radius:5px;
}

.comments .loading {
  background-image:url(data:image/gif;base64,R0lGODlhKwALAPEAAP///wAAAIKCggAAACH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAKwALAAACMoSOCMuW2diD88UKG95W88uF4DaGWFmhZid93pq+pwxnLUnXh8ou+sSz+T64oCAyTBUAACH5BAkKAAAALAAAAAArAAsAAAI9xI4IyyAPYWOxmoTHrHzzmGHe94xkmJifyqFKQ0pwLLgHa82xrekkDrIBZRQab1jyfY7KTtPimixiUsevAAAh+QQJCgAAACwAAAAAKwALAAACPYSOCMswD2FjqZpqW9xv4g8KE7d54XmMpNSgqLoOpgvC60xjNonnyc7p+VKamKw1zDCMR8rp8pksYlKorgAAIfkECQoAAAAsAAAAACsACwAAAkCEjgjLltnYmJS6Bxt+sfq5ZUyoNJ9HHlEqdCfFrqn7DrE2m7Wdj/2y45FkQ13t5itKdshFExC8YCLOEBX6AhQAADsAAAAAAAAAAAA=);
  background-position:center;
  background-repeat:no-repeat;
  min-height:11px;
}

.comments .clear {
  clear:both;
}

.comments_container {
}

.comments_container.modal {
  transform:translateY(120%);
  -webkit-transform:translateY(120%);
  position:fixed;
  left:0px;
  top:0px;
  right:0px;
  bottom:0px;
  z-index:100000;
  background-color:rgba(0,0,0,0.5);
  
  animation-duration: 0.4s;
  -webkit-animation-duration: 0.4s;
  animation-name: slidedownoff;
  -webkit-animation-name: slidedownoff;
  animation-timing-function: cubic-bezier(0,0,0.1,1);
  -webkit-animation-timing-function: cubic-bezier(0,0,0.1,1);
  animation-fill-mode: backwards;
  -webkit-animation-fill-mode: backwards;
}


.comments_container.modal.visible {
  transform:translateY(0%);
  -webkit-transform:translateY(0%);
  
  animation-duration: 0.4s;
  -webkit-animation-duration: 0.4s;
  animation-name: slideup;
  -webkit-animation-name: slideup;
  animation-timing-function: cubic-bezier(0,0,0.1,1);
  -webkit-animation-timing-function: cubic-bezier(0,0,0.1,1);
  animation-fill-mode: backwards;
  -webkit-animation-fill-mode: backwards;
}


.comments_container.modal.initial, .comments_container.modal.instant {
  animation:none;
  -webkit-animation:none;
}

.comments_container.modal.instant .comments_container_inner {
  position:absolute;
  left:100px;
  top:100px;
  right:100px;
  bottom:100px;
  border:1px solid #e6e6e6;
}


.comments_container .comments_title {
  display:none;
}

.comments_container.modal .comments_title {
  display:block;
  height:50px;
  line-height:50px;
  width:100%;
  position:absolute;
  top:0px;
  left:0px;
  right:0px;
  background-color:#e6e6e6;
  font-size:1.1em;
  font-style:italic;
  text-align:left;
  box-sizing:border-box;
  padding-left:10px;
  padding-right:50px;
  overflow:hidden;
  text-overflow:ellipsis;
}

.comments_container.modal .comments_close {
  cursor:pointer;
  font-size:40px;
  position:absolute;
  right:10px;
  top:0px;
  bottom:0px;
}

.comments_container .comments_content {
}

.comments_container.modal .comments_content {
  position:absolute;
  left:0px;
  right:0px;
  top:50px;
  bottom:0px;
  width:100%;
  height:auto;
  overflow:auto;
  overflow-scrolling:touch;
  -webkit-overflow-scrolling:touch;
  background-color:#ffffff;
}

.comments_container.modal .comments_content .comments {
  max-width:none;
  margin:5px;
  font-size:0.95em;
}

.comments_container.modal .comments_content .top {
  display:none;
}

.comments_container.modal .comments_content .more {
  display:none;
}

.comments_container.modal .comments_content .container {
  max-height:none !important;
}

.comments_button {
  cursor:pointer;
  display:inline-block;
}


@-webkit-keyframes slideup {
  0% {
    -webkit-transform: translateY(120%);
  }

  100% {
    -webkit-transform: translateY(0%);
  }
}

@keyframes slideup {
  0% {
    transform: translateY(120%);
  }

  100% {
    transform: translateY(0%);
  }
}

@-webkit-keyframes slidedownoff {
  0% {
    -webkit-transform: translateY(0%);
  }

  100% {
    -webkit-transform: translateY(100%);
  }
}

@keyframes slidedownoff {
  0% {
    transform: translateY(0%);
  }

  100% {
    transform: translateY(100%);
  }
}