1  /* ==========================================================================
  2   Forms
  3   ========================================================================== */
  4  .staticman-comments form {
  5    margin: 0 0 5px 0;
  6    padding: 1em;
  7    background-color: #f2f3f3;
  8  }
  9  .staticman-comments form p {
 10    margin-bottom: 2.5px;
 11  }
 12  .staticman-comments form br {
 13    display: none;
 14  }
 15  .staticman-comments label, .staticman-comments input, .staticman-comments button, .staticman-comments textarea {
 16    vertical-align: baseline;
 17    vertical-align: middle;
 18  }
 19  .staticman-comments input, .staticman-comments button, .staticman-comments textarea {
 20    box-sizing: border-box;
 21  }
 22  .staticman-comments label {
 23    display: block;
 24    margin-bottom: 0.25em;
 25    color: #494e52;
 26    cursor: pointer;
 27  }
 28  .staticman-comments label small {
 29    font-size: 0.75em;
 30  }
 31  .staticman-comments label input, .staticman-comments label textarea {
 32    display: block;
 33  }
 34  .staticman-comments input, .staticman-comments textarea {
 35    display: inline-block;
 36    width: 100%;
 37    padding: 0.25em;
 38    margin-bottom: 0.5em;
 39    color: #494e52;
 40    background-color: #fff;
 41    border: #f2f3f3;
 42    border-radius: 4px;
 43    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.125);
 44  }
 45  .staticman-comments .input-mini {
 46    width: 60px;
 47  }
 48  .staticman-comments .input-small {
 49    width: 90px;
 50  }
 51  .staticman-comments input[type="button"], .staticman-comments input[type="reset"], .staticman-comments input[type="submit"] {
 52    width: auto;
 53    height: auto;
 54    cursor: pointer;
 55    overflow: visible;
 56  }
 57  .staticman-comments textarea {
 58    resize: vertical;
 59    height: auto;
 60    overflow: auto;
 61    vertical-align: top;
 62  }
 63  .staticman-comments input[type="hidden"] {
 64    display: none;
 65  }
 66  .staticman-comments .form {
 67    position: relative;
 68  }
 69  /*
 70   Focus & active state
 71   ========================================================================== */
 72  .staticman-comments input:focus, .staticman-comments textarea:focus {
 73    border-color: #7a8288;
 74    outline: 0;
 75    outline: thin dotted \9;
 76    box-shadow: inset 0 1px 3px rgba(73, 78, 82, 0.06), 0 0 5px rgba(122, 130, 136, 0.7);
 77  }
 78  .staticman-comments input[type="file"]:focus, .staticman-comments input[type="radio"]:focus, .staticman-comments input[type="checkbox"]:focus:focus {
 79    box-shadow: none;
 80  }
 81  /*
 82   Help text
 83   ========================================================================== */
 84  .staticman-comments .form-text {
 85    color: #898c8e;
 86  }
 87  .staticman-comments .form-text {
 88    display: block;
 89    margin-bottom: 1em;
 90    line-height: 1em;
 91  }
 92  /*
 93   .form-group
 94   ========================================================================== */
 95  .staticman-comments .form-group {
 96    margin-bottom: 5px;
 97    padding: 0;
 98    border-width: 0;
 99  }
100  /*
101   Comments
102   ========================================================================== */
103  .staticman-comments .page__comments {
104    float: left;
105    margin-left: 0;
106    margin-right: 0;
107    width: 100%;
108    clear: both;
109  }
110  .staticman-comments .page__comments-title {
111    margin-top: 2rem;
112    margin-bottom: 10px;
113    padding-top: 2rem;
114    border-top: 1px solid #f2f3f3;
115  }
116  .staticman-comments .page__comments-form {
117    -webkit-transition: all 0.2s ease-in-out;
118    transition: all 0.2s ease-in-out;
119  }
120  .staticman-comments .page__comments-form.disabled input, .staticman-comments .page__comments-form.disabled button, .staticman-comments .page__comments-form.disabled textarea, .staticman-comments .page__comments-form.disabled label {
121    pointer-events: none;
122    cursor: not-allowed;
123    filter: alpha(opacity=65);
124    box-shadow: none;
125    opacity: 0.65;
126  }
127  .staticman-comments .comment {
128    margin: 1em 0;
129  }
130  .staticman-comments .comment:not(:last-child) {
131    border-bottom: 1px solid #f2f3f3;
132  }
133  .staticman-comments .comment__avatar-wrapper {
134    float: left;
135    width: 60px;
136    height: 60px;
137  }
138  .staticman-comments .comment__avatar {
139    width: 40px;
140    height: 40px;
141    border-radius: 50%;
142  }
143  .staticman-comments .comment__content-wrapper {
144    width: calc(100% - 60px);
145  }
146  .staticman-comments .comment__author {
147    margin: 0;
148  }
149  .staticman-comments .comment__author a {
150    text-decoration: none;
151  }
152  .staticman-comments .comment__date {
153    margin: 0;
154  }
155  .staticman-comments .comment__date a {
156    text-decoration: none;
157  }
158  /* ==========================================================================
159   PRINT STYLES
160   ========================================================================== */
161  .staticman-comments @media print {
162    /*
163     Hide the following elements on print
164     ========================================================================== */
165  .staticman-comments [hidden] {
166      display: none;
167    }
168  .staticman-comments .masthead, .staticman-comments .toc, .staticman-comments .page__share, .staticman-comments .page__related, .staticman-comments .pagination, .staticman-comments .ads, .staticman-comments .page__footer, .staticman-comments .page__comments-form, .staticman-comments .author__avatar, .staticman-comments .author__content, .staticman-comments .author__urls-wrapper, .staticman-comments .nav__list, .staticman-comments .sidebar, .staticman-comments .adsbygoogle {
169      display: none !important;
170      height: 1px !important;
171    }
172  }
173  /*
174   Post pagination navigation links
175   ========================================================================== */
176  .staticman-comments .page__comments + .staticman-comments .pagination {
177    margin-top: 2em;
178    padding-top: 2em;
179    border-top: 1px solid #f2f3f3;
180  }