#shoutbox {margin-bottom: 10px; border: solid 2px var(--main); border-radius: 10px;}
#shoutbox .head {padding: 8px; font-size: 14px; background: #f6f6f6; border-radius: 10px 10px 0px 0px; border-bottom: 1px solid var(--main);}
#shoutbox.front .head {cursor: pointer;}
#shoutbox .head .right {float: right; margin: 0 -8px 0 0; font-size: 12px;}
#shoutbox .head .right a { padding: 8px;}
#shoutbox.collapsed .head {opacity: 0.6; border-bottom-left-radius: 10px !important; border-bottom-right-radius: 10px !important;}
#shoutbox.collapsed .body {display: none;}
#shoutbox .panel {border-top: solid 2px var(--main); border-bottom: solid 2px var(--main); background-color: #999;}
#shoutbox input.text {margin: 10px 1% 0% 1% !important; padding: 10px 8px; box-sizing: border-box; border: 1px solid #00f; box-shadow: inset 0 2px 4px rgba(0,0,0,0.08); font-family: Arial, sans-serif; font-size: 12px; color: #000; width: 98%; background-color: #f9f9f9;}
#shoutbox .minposts, #shoutbox .blocked {padding: 6px; font-size: 11px;}
#shoutbox .panel.minposts {background: #FFFED8; color: #727250;}
#shoutbox .panel.blocked {background: #FCEFEF; color: #543A3A;}
#shoutbox .panel p {margin: 0;}
#shoutbox .window {border-top: solid 2px rgba(0,0,0,0.1); overflow-y: scroll; background: #fff;}
#shoutbox .data {display: table; width: 100%; border-top: solid 2px rgba(0,0,0,0.1); font-family: Arial, sans-serif; font-size: 12px;}
#shoutbox .front .data {border-top: none;}
#shoutbox .edit {color: #8080ff !important;}
#shoutbox .del {color: #ff6262 !important;}
#shoutbox .entry {display: table-row !important; width: 50%; transition: background-color 0.2s;}
#shoutbox .entry:nth-child(even) {background-color: rgba(0,0,0,0.04);}
#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;}
#shoutbox .avatar {height: 20px;}
#shoutbox .avatar img {margin: 0 auto; vertical-align: middle; max-height: 20px; max-width: 20px; 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: 100%; color: #555;}
#shoutbox .info { font-size: 11px; color: #828282; white-space: nowrap; text-align: right;}
#shoutbox .entry.unread .info:before {display: inline-block; margin-right: 10px; height: 4px; width: 4px; content: ''; background: rgba(255,100,0,0.8); border-radius: 10px; vertical-align: middle;}
#shoutbox .info a {color: inherit;}
#shoutbox .mod {padding: 6px 8px; font-size: 9px; font-weight: bold; color: #AAA; text-decoration: none;}
#shoutbox .mod:nth-of-type(2) {margin-right: 5px; border-left: solid 1px rgba(0,0,0,0.1);}
#shoutbox  .ip {margin-right: 10px; color: #a2a2a2;}
/* DVZ Shoutbox-Smilies - START */
#smilies_box .clickable {cursor: pointer}
#smilies_box {background-color: #ccc; text-align: center; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 2px 0 12px 0;}
#clickable_smilies_wrapper {height: 200px; overflow-y: scroll;	width: 160px;}
/* DVZ Shoutbox-Smilies - END */
/* DVZ Shoutbox-Smilies-PopUp - END */
.smilie_popup {margin-top: 55px !important; top: 879px; left: 50%; transform: translate(-50%, -50%); background: #fff; border-radius: 10px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); max-width: 300px; position: absolute;}
.smilie_popup .smilie_container_inside {display: grid; grid-template-columns: repeat(1, 1fr); gap: 10px; padding: 10px; overflow-y: scroll; max-height: 200px;}
.smilie_container_outside {width: 101%; display: inline-block; background-color: #f9f9f9;}
.smilie_container_inside {width: 93%; max-height: 100px; display: flex; justify-content: center; align-items: center; background-color: #f9f9f9; border: 2px solid #ccc;}
.smilie_popup:nth-child(odd) {background-color: #f9f9f9;}
.smilie_container_inside:nth-child(even) {background-color: #e0e0e0;}
#smilies_box .clickable {margin: 0 auto !important;}
.tborder {-moz-border-radius: 10px !important; -webkit-border-radius: 10px !important; border-radius: 10px !important;}
.table_innert {border-radius: 10px; text-align: center; width: 95.5%; padding-right: 7px;}
.thead_inline_top, .thead_inline_bottom {display: inline-block; width: 96.8%;}
.thead_inline_top {font-size: 14px; border-radius: 10px 10px 0px 0px !important;}
.thead_inline_bottom {font-size: 10px; border-radius: 0px 0px 10px 10px !important;}
.tcat_innert {display: inline-block; width: 98%;}
.smilie_popup img {cursor: pointer; margin: 0 auto;}
.smilie_popup_innert {display: inline-block; width: 100%; border-radius: 10px;}
.close-modal {position: absolute; top: -10px; right: -11px; width: 30px; height: 30px; background: url(../../../images/close.png) no-repeat center center; background-size: contain; cursor: pointer; z-index: 10001;}
.close-modal:hover {opacity: 0.8;}
.l-no-horizontal-scroll {overflow-x: hidden;}
/* DVZ Shoutbox-Smilies-PopUp - END */