#c_submitButton {
	position: relative;
	display: inline-block;
	cursor: pointer;
	outline: none;
	border: 0;
	vertical-align: middle;
	text-decoration: none;
	font-size: inherit;
	font-family: inherit;
	font-weight: bold;
	letter-spacing: .05rem;
	color: rgb(var(--content-bg));
	text-transform: uppercase;
	padding: .25rem .5rem;
	background: rgb(var(--color-link));
	border-radius: 0.5em;
	transition: transform .2s cubic-bezier(0, 0, 0.58, 1), background .2s cubic-bezier(0, 0, 0.58, 1);

	&:hover,
	&:focus {
		transform: translate(0, 0.25em);
	}

	&:active {
		transform: translate(0, 0.75em);
	}
}

#c_widget {
	box-sizing: border-box;
	height: 100%;
	padding: 1em 0;
	background-attachment: fixed;
	font-family: var(--main-font);
	color: rgb(var(--main-text));
	text-align: right;
}

#c_widget button:disabled,
#c_widget input[type=submit]:disabled {
	opacity: 60%;
}

#c_widget button:disabled:hover,
#c_widget input[type=submit]:disabled:hover {
	color: rgb(var(--content-bg));
	border: var(--border) rgb(var(--content-bg));
}

/* Input section */

#c_widgetTitle {
	margin-bottom: 1rem;
}

.c-inputWrapper {
	display: block;
	text-align: left;
}

#c_nameWrapper {
	width: 49%;
	float: left;
}

#c_websiteWrapper {
	width: 49%;
	float: right;
}

.c-input {
	padding: .2rem;
	margin-bottom: .5rem;
	color: rgb(var(--main-text));
	border: var(--border) rgb(var(--color-code));
	outline: none;
	background-color: rgba(var(--color-code), 0.15);
	text-align: left;
	font-family: var(--main-font);
	font-size: var(--main-size);
	width: 100%;
	border-radius: .5rem;
	transition: .2s cubic-bezier(0, 0, 0.58, 1);
}

.c-input:focus {
	box-shadow: 0.5em 0.5em 0 0 rgb(var(--color-link));
}

.c-textInput {
	width: 100%;
	resize: none;
}

#c_submitButton {
	display: block;
	margin-left: auto;
	margin: .5em 0 3em auto;
}

#c_replyingText {
	color: rgb(var(--main-text));
	float: right;
}

.c-label {
	text-transform: uppercase;
	font-family: var(--head-font);
	font-weight: var(--bold-weight);
	display: block;
	font-size: var(--small-size);
}

/* Comment section */
.c-comment {
	--color: var(--color-code);

	margin-bottom: 15px;
	padding: 10px;
	text-align: left;
	border-radius: .5em;

	.c-replyButton {
		background-color: rgb(var(--color));
	}
}

.c-reply {
	display: block;
	width: 90%;
	margin-bottom: 10px;
	margin-left: auto;
	margin-right: 0;
	padding: 10px;
}

.c-reply:last-child {
	margin-bottom: 0;
}

.c-replyContainer {
	margin: -10px;
	margin-top: 10px;
	padding: 10px;
}

.c-name {
	display: inline-block;
	margin: 0;
	margin-right: .75rem;
	font-size: var(--main-size);
}

.c-site {
	text-transform: lowercase;
	text-decoration: none;
}

.c-timestamp {
	float: right;
	opacity: 75%;
}

.c-text {
	padding: .5rem;
	color: rgb(var(--main-text));
	border: var(--border) rgb(var(--color));
	background-color: rgba(var(--color), 0.15);
	border-radius: .5rem;
}

/* Pagination */
#c_pagination {
	text-align: center;
}

.c-replyButton,
.c-expandButton,
.c-paginationButton {
	margin-top: 1rem;
	margin-right: .25rem;
}