#shoutbox {
	margin: 0 auto;
	background-color: #e5e5e5;
	width: 90%;
	border: solid 2px var(--color_main);
	border-radius: 10px;
	padding: 10px;
	color: #000;
	word-wrap: break-word;
	hyphens: auto;
}

#shoutbox .head {
	padding: 10px;
	border: solid 2px #0092C3;
	border-radius: 10px;
	margin-bottom: 6px;
	/* opacity: 0.6; */
}

.shoutbox_on_off {
	background-color: #b5f2ec;
	padding: 2px 6px 2px 6px;
	border: 1px solid #fff;
	border-radius: 10px;
	color: #000;
}

#shoutbox.front .head {
	width: 94.5%;
	cursor: pointer;
	padding: 6px 8px;
	margin: 0 auto;
	margin-top: 2px;
	margin-bottom: 2px;
	border: solid 2px var(--color_main);
	
	font-size: 16px;
}

#shoutbox .head .right {
	float: right;
	margin: 0 -8px 0 0;

	font-size: 16px;
}

#shoutbox .head .right a {
 padding: 8px;
}

#shoutbox.collapsed .head {
	opacity: 1.0 !important;
}

#shoutbox.collapsed .body {
 display: none;
}

#shoutbox .panel {
 	border: solid 2px var(--color_main);
	padding: 5px;
	border-radius: 10px;
	width: 95%;
	margin: 0 auto;
}

#shoutbox input.text {
	width: 100%;
	color: #000000;
	margin: 0;
	padding: 15px 8px;
	box-sizing: border-box;
	border: none;
	border-radius: 10px;
	box-shadow: inset 0 2px 4px rgba(0,0,0,0.08);
	font-family: Snippet;
	font-size: 16px;
}

#shoutbox .minposts, #shoutbox .blocked {
	padding: 6px;

	font-size: 16px;
}

#shoutbox .panel.minposts {
	width: 95%;
	color: #000000;
	word-break: break-all;
	word-wrap: break-word;
}

#shoutbox .panel.blocked {
	color: #543A3A;
}

#shoutbox .panel p {
 margin: 0;
}

#shoutbox .window {
 border-top: solid 2px rgba(0,0,0,0.1); overflow-y: scroll;
}

#shoutbox .data {
	width: 96%;
	display: table;
	border-top: solid 2px var(--color_main);
	font-family: snippet;
	font-size: 16px;
	margin: 1% auto 0 auto;
}

#shoutbox.front .data {
	border: 1px solid var(--color_main);
	border-radius: 7px;
}

#shoutbox .entry {
	width: 96%;
	/* display: table-row !important; */
	transition: background-color 0.2s;
	margin: 1% auto;
	border-radius: 7px;
}

#shoutbox .entry:nth-child(even) {
 background-color: rgba(0,0,0,0.01);
}

#shoutbox .entry.new {
 background-color: rgba(255,255,100,0.1);
}

#shoutbox .entry:target {
 background-color: rgba(50,200,255,0.1);
}

#shoutbox .entry > div {
 border-bottom: dashed 1px rgba(0,0,0,0.05);
}

#shoutbox .entry:last-child > div {
 border-bottom: none;
}

#shoutbox .entry > div {
	display: table-cell; padding: 6px;
	padding: 0px 3px 0px 0px;
}

#shoutbox .avatar {
	height: 40px;
}

#shoutbox .avatar img {
	margin: 0 auto;
	vertical-align: middle;
	max-height: 20px;
	/* max-width: 40px; */
	border: solid 1px rgba(255,255,255,0.1);
	box-shadow: 0 0 2px rgba(0,0,0,0.1);
	cursor: pointer;
}

#shoutbox .user {
 border-right: solid 1px rgba(0,0,0,0.05); text-align: right; white-space: nowrap;
}

#shoutbox .text {
	width: 90%;
	color: #000;
	word-wrap: break-word;
	hyphens: auto;
}

#shoutbox .info {
	white-space: nowrap;
	text-align: right;

	color: #000;
	font-size: 16px;
}

#shoutbox .entry.unread .info:before {
	background: #FF0000;
	width: 5px;
	display: inline-block;
	margin-right: 10px;
	height: 4px;
	content: '';
	border-radius: 10px;
	vertical-align: middle;
}

#shoutbox .info a {
	color: inherit;
}

#shoutbox .mod {
	color: #ffffff;
	padding: 6px 8px;

	text-decoration: none;
	font-size: 16px;
	font-weight: bold;
}

#shoutbox .mod:nth-of-type(2) {
 margin-right: 5px; border-left: solid 1px rgba(0,0,0,0.1);
}

#shoutbox  .ip {
	color: #FF0000;
	margin-right: 10px;
}

/* DVZ Shoutbox-Smilies - START */
.shoutbox_smilies {
	border: 2px solid #b5f2ec;
	border-radius: 10px;
	margin-bottom: 1%;
	padding: 5px;
	background-color: #444;
}

.shoutbox_smilies_button {
	background-color: #b5f2ec;
	padding: 2px 6px 2px 6px;
	border-radius: 10px;
	color: #000;
}

#smilies_box .clickable {
	cursor: pointer
}

#smilies_box {
	text-align: center;
	display: none;
	max-width: 90%;
	border: 2px dotted var(--color_main);
	border-radius: 10px;
	margin: 1% auto 0 auto;
	padding: 1% 1% 0% 1%;
}

.dvz_smilies {
	background-color: var(--color_main);
	padding: 2px 6px 2px 6px;
	border-radius: 10px; color: #FFF;"
}

.smilie {
	vertical-align: middle;
}

.smilie_pointer {
	cursor: pointer;
}

/* DVZ Shoutbox-Smilies - END */ 

dvz_button, input.dvz_button {
    cursor: pointer;
    padding: 6px 8px;
    margin: 2px;
    font-size: 14px;
    /* border: none !important; */
    background: #304066;
    color: #f5f5f5;
    outline: 0;
    border-radius: 0px 0px 0px 0px;
    -moz-border-radius: 0px 0px 0px 0px;
    -webkit-border-radius: 0px 0px 0px 0px;
}

dvz_button:hover,
input.dvz_button:hover {
    color: #c26b75;
    transition: 800ms ease all;
}