html{
 overflow:hidden;
}

body {
  color:#444;
  font-family:"Helvetica Neue",arial,sans-serif;
  font-size:14px;
  -webkit-font-smoothing:antialiased
}
body,
.comments-page section {
  text-align:left !important;
  background:transparent !important;
  max-width: 100vw;
  word-wrap: break-word;
}

html, body {
  margin:0;
  padding:0;
}

h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,cite,code,del,dfn,em,
img,q,s,samp,small,strike,strong,sub,sup,tt,var,dd,dl,dt,li,ol,ul,fieldset,
form,label,legend,button,table,caption,tbody,tfoot,thead,tr,th,td {
 border:0;
 font-family:inherit;
 font-size:100%;
 font-style:normal;
 font-weight:normal;
 line-height:1;
 margin:0;
 padding:0;
}
a, .text-link {
  color: #555;
  text-decoration: none;
  transition: color 0.1s linear;
}
a:focus{
 outline:thin dotted
}
a:hover,
a:active{
 outline:0
}
.pull-right{
 float:right!important
}
.pull-left{
 float:right!important
}

*, ::after, ::before {
  box-sizing: border-box;
}

/* Alert rules -------------------------------------------------------------- */
.alert {
  display:none;
}
.alert {
  border: 1px solid transparent;
  border-radius: .25rem;
  font-size: .9em;
  margin-bottom: 1rem;
  padding: .5rem .9rem;
  position: relative;
}
.alert-danger {
  background-color: #f8d7da;
  border-color: #f5c6cb;
  color: #721c24;
}
.alert-warning {
  background-color: #fff3cd;
  border-color: #ffeeba;
  color: #856404;
}
.alert-success {
  background-color: #d4edda;
  border-color: #c3e6cb;
  color: #155724;
}
.alert-info {
  background-color: #d1ecf1;
  border-color: #bee5eb;
  color: #0c5460;
}

/* Buttons  ----------------------------------------------------------------- */
.btn:not(:disabled):not(.disabled) {
  cursor: pointer;
}
[type=reset],
[type=submit],
button,
html [type=button] {
  -webkit-appearance: button;
}
.btn-dark {
  background-color: #343a40;
  border-color: #343a40;
  color: #fff;
}
.btn {
  border: 1px solid transparent;
  border-radius: .25rem;
  display: inline-block;
  font-size: .9rem;
  font-weight: 400;
  line-height: 1.5;
  padding: .375rem .75rem;
  text-align: center;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  user-select: none;
  vertical-align: middle;
  white-space: nowrap;
}
button, select {
  text-transform: none;
}
button, input {
  overflow: visible;
}
button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  margin: 0;
}
button {
  border-radius: 0;
}
.btn-primary {
  background-color: #545b62;
  border-color: #4e555b;
  color: #fff;
}
.btn-primary.focus,
.btn-primary:focus {
  box-shadow: 0 0 0 0.2rem rgba(52,58,64,.5);
}


/* Form elements ------------------------------------------------------------ */

button,
input,select,
textarea{
  font-size:100%;
  margin:0;
  outline:0 none;
  vertical-align:baseline;
}
button,input{
  line-height:normal;
}
button::-moz-focus-inner,input::-moz-focus-inner{
  border:0;
  padding:0
}
button,input[type="button"],input[type="reset"],input[type="submit"]{
  -webkit-appearance:button;
  cursor:pointer;
}
textarea{
  overflow:auto;
  vertical-align:top
}

/* Header ------------------------------------------------------------------- */
.post-count h4 {
  color:#333;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.2;
  margin:10px 0 15px 0;
}

/* Form ------------------------------------------------------------------- */
.comment-form-wrapper {
  position:relative;
}

.avatar {
  position:absolute;
  top:0;
}
.avatar .user img {
  border-radius: 3px;
  display: block;
  height: 36px;
  width: 36px;
}
.avatar .user {
  display: block;
  position: relative;
  z-index: 100;
}

.comment-form {
  margin-bottom: 18px;
  position: relative;
}

.textarea-wrapper {
  background-color:rgba(255,255,255,0.45);
  border:1px solid #c0c8d2;
  margin:0 0 0 48px;
  outline:0 none;
  position:relative;
  transition:all .2s linear;
}
.textarea-wrapper .textarea{
  background:0;
  border:0;
  color:#444;
  color:rgba(0,0,0,0.8);
  cursor:text;
  display:block;
  font-family:"Helvetica Neue",helvetica,arial,sans-serif;
  font-size:14px;
  height:auto;
  line-height:1.4;
  margin:0;
  min-height:29px;
  overflow-y:scroll;
  padding:5px 8px;
  resize:none;
  transition:all .15s ease-in-out;
  width:100%;
}

.input-wrapper {
  margin-bottom:10px;
}

.input-wrapper input{
  background:rgba(255,255,255,0.85);
  border:1px solid #c0c8d2;
  font-size:13px;
  margin:0;
  padding:8px;
  transition:all .2s ease-in-out;
  width:100%;
}
.input-wrapper input:focus{
  border-color:#a9b3c0;
  outline:0;
}

.auth {
  /*border-left: 1px dotted #cfd5dc;*/
  margin: 10px 0 0 48px;
  max-height:500px;
  opacity:1;
  /*padding-left:10px;*/
  position: relative;
  transition-duration: .5s;
  transition-property: all;
  transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
}

.auth.hidden {
  max-height: 0;
  opacity:0;
}

.auth .proceed {
  font-size: 12px;
  position: absolute;
  right: 0;
  top: 0;
}

.guest {
  width:70%;
}

.guest .proceed .btn {
  height: 32px;
  padding: 9px 30px;
}

/* Conversation ------------------------------------------------------------- */
#no-posts {
 line-height:107px;
 opacity:.6;
 text-align:center;
}

.post-list .post {
  border-bottom: 1px solid rgba(0,0,0,0.1);
  margin:15px 0;
  margin-bottom:25px;
  position:relative;
}
.post-list .post:last-child {
  border-bottom:0 none;
}

.post-list .post .post-body {
  margin-bottom:15px;
  margin-left:50px;
}

.post-list .post .post-info {
  cursor:pointer;
  font-size:.9em;
}

.post-list .post .post-info .comment-author-name {
  font-weight: bold;
}
.post-list .post .post-info .time-ago {
  opacity:.8;
}
.post-list .post .post-info .time-ago:hover{
  opacity:1;
}

.post-list .post .post-info,
.post-list .post .post-message,
.post-list .post .post-voting {
  margin-bottom:5px;
}

.post-list .post .post-message,
.post-list .post .post-message p {
  line-height: 1.5em;
}
.post-voting {
  border-radius:3px;
  position:relative;
  transition:opacity .3s;
}
.post-voting a{
  color:inherit;
  display:inline-block;
  font-size: .8em;
  height:11px;
  line-height:.85;
  padding:0 4px;
  position:relative;
  vertical-align:middle;
}
.post-voting a:after{
  bottom:-10px;
  content:"";
  display:block;
  left:0;
  position:absolute;
  right:-6px;
  top:-10px;
}
.post-voting .control{
  border-left:0 solid transparent;
  border-right:0 solid transparent;
  font-size:13px;
  opacity:.7;
  transition:opacity .2s linear;
  vertical-align:middle
}
a.vote-up,
a.vote-down {
  color: #777;
  font-size:.9em;
}
.vote-up:before,
.vote-down:before {
  content: "";
  font-family: Fontawesome;
}
.vote-up:before {
  content: "\f106";
}
.vote-down:before {
  content: "\f107";
}
.post-voting .vote .control {
  display:none;
}
.post-voting .vote-up:hover .control,
.post-voting .vote-down:hover .control{
  opacity:1
}
.post-voting .vote-up{
    padding-left:0
}
.post-voting .vote-up .control {
  border-bottom:0 solid #495e6f;
}
.post-voting .vote-down{
  border-left:1px dotted rgba(75,83,94,0.36);
  padding-left:6px;
  padding-right:0;
}
.post-voting .vote-down .count.count-0{
  display:none
}
.post-voting .vote-down .control{
  border-top:0 solid #495e6f
}
.post-voting .vote-up.upvoted .count{
  color:#2e9fff
}
.post-voting .vote-up.upvoted .control {
  color:#2e9fff;
  opacity:1;
}
.post-voting .vote-down.downvoted .count{
  color:#ff2e35
}
.post-voting .vote-down.downvoted .control{
  color:#ff2e35;
  opacity:1;
}

.load-more{
  margin:1.5em 0
}
.load-more.hidden {
  display:none;
}

.load-more .btn {
  background:#ccc;
  color:#333;
  display:block;
  font-size:13px;
  font-weight:500;
  padding:8px 14px !important;
  text-align:center;
}