img {border: none; max-width:100%;}
.opera .hide {display: none;}
/* =========================================
 ОСНОВНОЙ КОНТЕЙНЕР (Чат и Форма)
 ========================================= */

/* Блок с историей сообщений (iframe) */
#mchatIfm2 {
 max-width: 900px !important; /* Сохраняем ширину, но делаем её максимальной */
 width: 100% !important;
 height: 400px !important;
 display: block;
 margin: 0 auto 1rem auto !important; /* Отступ снизу 16px */
 background-color: #FAFAFA;
 border: 1px solid #E5E7EB; /* Светлая рамка */
 border-radius: 0.75rem; /* Скругление 12px */
 box-sizing: border-box;
}

/* Форма отправки */
#MCaddFrm {
 max-width: 900px !important;
 width: 100% !important;
 margin: 0 auto !important;
 padding: 1rem; /* 16px */
 background: #FFFFFF;
 border: none;
 border-radius: 0.75rem; /* 12px */
 box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05); /* Мягкая тень */
 box-sizing: border-box;
 display: block;
 position: relative;
 overflow: visible; /* Чтобы тени не обрезались */
}

/* Тело чата внутри iframe */
.mchat-body {
 background-color: #FAFAFA;
 margin: 0;
 padding: 0.5rem;
}

/* =========================================
 СООБЩЕНИЯ (Список)
 ========================================= */

/* Блоки сообщений (убираем старые цвета, делаем чистый список) */
.chat-block1, .chat-block2 {
 display: flex;
 align-items: flex-start;
 gap: 0.75rem; /* Отступ 12px между аватаром и текстом */
 padding: 0.75rem 0.5rem;
 background-color: transparent;
 border-bottom: 1px solid #F3F4F6; /* Легкий разделитель */
 color: #1F2937;
 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
 font-size: 0.875rem; /* 14px */
 line-height: 1.5;
 overflow: visible; /* Исправляет обрезку теней или элементов */
}

/* Аватар */
.chat-avatar {
 width: 2.25rem; /* 36px */
 height: 2.25rem;
 min-width: 2.25rem; /* Защита от сплющивания */
 border-radius: 50%; /* Круг */
 object-fit: cover;
 margin: 0;
 float: none; /* Убираем старый float */
}

/* Обертка для текста сообщения (для правильного переноса) */
.message-content {
 display: flex;
 flex-direction: column;
 flex-grow: 1;
 min-width: 0; /* Критично для Flexbox переносов */
}

/* Шапка сообщения (Ник и Дата) */
.message-header {
 display: flex;
 justify-content: space-between;
 align-items: baseline;
 margin-bottom: 0.25rem;
}

/* Никнейм */
.chat-message a b, .chat-message b {
 color: #111827;
 font-weight: 600;
 font-size: 0.875rem;
}

/* Дата */
.chat-date {
 color: #9CA3AF;
 font-size: 0.75rem; /* 12px */
 float: none; /* Убираем float */
 white-space: nowrap;
}

/* Текст сообщения */
.chat-message, .chat-message-text {
 color: #374151;
 padding: 0;
 word-wrap: break-word;
 /* Убираем старые padding */
}

/* =========================================
 ФОРМА ВВОДА (Интерфейс)
 ========================================= */

/* Верхняя панель (Обновить, Управление) */
.form-controls {
 display: flex;
 justify-content: space-between;
 margin-bottom: 0.5rem;
 font-size: 0.75rem;
 color: #6B7280;
}

/* Контейнер для поля ввода (позиционируем кнопку внутри) */
.chat-textarea {
 position: relative;
 width: 100%;
 float: none;
 display: block;
 margin-bottom: 0.5rem;
}

/* Поле ввода текста */
#mchatMsgF {
 width: 70% !important;
 height: 3rem !important; /* 48px высота */
 min-height: 3rem !important;
 padding: 0.75rem 4rem 0.75rem 1rem; /* Справа отступ 4rem под кнопку OK */
 background-color: #F9FAFB;
 border: 1px solid #E5E7EB;
 border-radius: 1.5rem; /* Полное скругление (капсула) */
 font-size: 0.875rem;
 color: #111;
 box-sizing: border-box;
 outline: none;
 margin: 0;
 resize: none; /* Запрет растягивания мышкой */
 font-family: inherit;
 transition: all 0.2s ease;
}

#mchatMsgF:focus {
 background-color: #FFF;
 border-color: #5596e6; /* Синяя рамка при фокусе */
 box-shadow: 0 0 0 3px rgba(85, 150, 230, 0.1);
}

/* Кнопка отправки "OK" */
.chat-send {
 position: absolute;
 right: 0.25rem; /* Отступ справа внутри поля */
 top: 0.25rem;
 width: 2.5rem !important; /* 40px */
 height: 2.5rem !important; /* 40px */
 border-radius: 50%; /* Круглая кнопка */
 background-color: #5596e6;
 color: #FFF;
 border: none;
 font-size: 0.75rem;
 font-weight: bold;
 cursor: pointer;
 margin: 0;
 float: none;
 transition: background-color 0.2s;
 z-index: 2;
}

.chat-send:hover {
 background-color: #2563EB;
}

/* Нижняя панель (Счетчик, Смайлы) */
.chat-helper-row {
 display: flex;
 justify-content: space-between;
 align-items: center;
 font-size: 0.75rem; /* 12px */
 color: #9CA3AF;
 padding: 0 0.5rem;
}

.chat-helper a, .chat-reload a {
 color: #5596e6;
 text-decoration: none;
 margin-left: 0.5rem;
}

.chat-helper a:hover {
 text-decoration: underline;
}

/* Убираем старые классы, если они где-то всплывут */
.chat-length, .chat-reload, .chat-helper {
 padding: 0;
 float: none;
 text-align: inherit;
}

/* Адаптивность для телефонов */
@media (max-width: 640px) {
 #mchatIfm2 {
 height: 70vh !important; /* На телефоне чат выше */
 border-radius: 0;
 border-left: none;
 border-right: none;
 }
 
 #MCaddFrm {
 padding: 0.75rem;
 border-radius: 0;
 box-shadow: 0 -2px 10px rgba(0,0,0,0.05); /* Тень сверху */
 }

 .chat-send {
 width: 2.5rem !important;
 }
}
a:link {
 color: #648ACD;
 text-decoration: none;
}
a:active {
 color: #648ACD;
 text-decoration: none;
}
a:visited {
 color: #648ACD;
 text-decoration: none;
}
a:hover {
 color: #570188;
 text-decoration: underline;
}
form {
 margin: 0;
 padding: 0;
}
input, textarea, select {
 font-size: 8pt;
 vertical-align: middle;
}
hr {
 color: #C7B7D5;
 height: 1px;
}
label {
 cursor: pointer;
}
.blocktitle {
 color: #695492;
 font-family: Verdana,Sans-Serif;
 font-size: 1em;
}
.mframe {
 border-left: 1px solid #E5E7EA;
 border-right: 1px solid #E5E7EA;
}
.colgray {
 border-right: 1px solid #E5E7EA;
}
.colwhite {
 border-right: 1px solid #FAFAFA;
}
.msep {
 border-top: 1px solid #FAFAFA;
}
ul.uz {
 list-style: none outside none;
 margin: 0;
 padding-left: 0;
}
.m {
 font-weight: normal;
}
.catsTable {
}
.catName {
 font-family: Tahoma,Arial,Sans-Serif;
 font-size: 11px;
}
.catNameActive {
 font-family: Tahoma,Arial,Sans-Serif;
 font-size: 11px;
}
.catNumData {
 color: #966DB5;
 font-size: 7pt;
}
.catDescr {
 font-size: 7pt;
 padding-left: 10px;
}
a.catName:link {
 color: #C6DAFF;
 text-decoration: none;
}
a.catName:visited {
 color: #C6DAFF;
 text-decoration: none;
}
a.catName:hover {
 color: #FFFFFF;
 text-decoration: none;
}
a.catName:active {
 color: #C6DAFF;
 text-decoration: none;
}
a.catNameActive:link {
 color: #FFFFFF;
 text-decoration: none;
}
a.catNameActive:visited {
 color: #FFFFFF;
 text-decoration: none;
}
a.catNameActive:hover {
 color: #FFFFFF;
 text-decoration: none;
}
a.catNameActive:active {
 color: #FFFFFF;
 text-decoration: none;
}
.eBlock {
}
.eDetails {
 border-bottom: 1px dashed #DDDDDD;
 border-top: 1px dashed #DDDDDD;
 color: #9C559A;
 font-family: Tahoma,Arial,Sans-Serif;
 font-size: 7pt;
 padding-bottom: 5px;
 padding-top: 3px;
 text-align: left;
}
.eDetails1 {
 border-bottom: 1px dashed #DDDDDD;
 border-top: 1px dashed #DDDDDD;
 color: #9C559A;
 font-family: Tahoma,Arial,Sans-Serif;
 font-size: 8pt;
 padding-bottom: 5px;
 padding-top: 3px;
 text-align: left;
}
.eDetails2 {
 border-bottom: 1px dashed #DDDDDD;
 color: #9C559A;
 font-family: Tahoma,Arial,Sans-Serif;
 font-size: 8pt;
 padding-bottom: 5px;
 padding-top: 3px;
 text-align: left;
}

.eRating {
 font-size: 7pt;
}
.eAttach {
 background: url("/.s/t/997/12.gif") no-repeat scroll 0 0 transparent;
 margin: 16px 0 0;
 opacity: 0.5;
 padding: 0 0 0 15px;
}
.manTable {
 width: 98%;
}
.manTable td {
 text-align: left;
}
.manTdError {
 color: #FF0000;
}
.manTd1 {
}
.manTd2 {
}
.manTd3 {
}
.manTdSep {
}
.manHr {
}
.manTdBrief {
}
.manTdText {
}
.manTdFiles {
}
.manFlFile {
}
.manTdBut {
}
.manFlSbm {
}
.manFlRst {
}
.manFlCnt {
}
.cMessage {
 clear: both;
 padding: 4px;
 text-align: left;
}
.cAnswer {
 font-style: italic;
 padding-left: 15px;
 padding-top: 4px;
}
.cAvatarka {
 border: medium none;
 float: left;
 margin-right: 10px;
 width: 40px;
}
.cBlock1 {
 background: none repeat scroll 0 0 #FAFAFA;
 border: 1px solid #A782A6;
}
.cBlock2 {
 background: none repeat scroll 0 0 #FAFAFA;
 border: 1px solid #A782A6;
}
#allEntries div {
 width: auto !important;
}
.commTable {
 width: 98%;
}
.commTd1 {
 color: #000000;
}
.commTd2 {
}
.commFl {
 background: none repeat scroll 0 0 #FDFAFE;
 border: 1px solid #C7B7D5;
 color: #744D91;
 font-family: Verdana,Arial,Helvetica,sans-serif;
 width: 100%;
}
.smiles {
 background: none repeat scroll 0 0 #FFFFFF;
 border: 1px inset;
}
.commReg {
 text-align: center;
}
.commError {
 color: #FF0000;
}
#subcomment {
 height: 115px;
 width: 98% !important;
}
.securityCode {
 background: none repeat scroll 0 0 #FDFAFE;
 border: 1px solid #C7B7D5;
 color: #744D91;
}
.codeButtons {
 background: url("http://www.spyro-realms.com/img/button/button_bg.gif") repeat-x scroll 0 0 #FDFAFE;
 border: 1px solid #744D91;
 border-radius: 3px 3px 3px 3px;
 font-family: Verdana,Arial,Helvetica,sans-serif;
 font-size: 7pt;
 line-height: 15px;
}
input.codeButtons:hover {
 background: url("http://www.spyro-realms.com/img/button/button_bg_hover.gif") repeat-x scroll 0 0 #FDFAFE;
 border: 1px solid #744D91;
 border-radius: 3px 3px 3px 3px;
 font-family: Verdana,Arial,Helvetica,sans-serif;
 font-size: 7pt;
 line-height: 15px;
}
.archLi {
 background: url("http://src.ucoz.ru/t/461/24.gif") no-repeat scroll 0 4px transparent;
 font-family: Tahoma,Arial,Sans-Serif;
 padding: 0 0 3px 10px;
}
a.archLink:link {
 color: #744D91;
 text-decoration: underline;
}
a.archLink:visited {
 color: #744D91;
 text-decoration: underline;
}
a.archLink:hover {
 color: #000000;
 text-decoration: none;
}
a.archLink:active {
 color: #000000;
 text-decoration: none;
}
.archiveCalendars {
 color: #0000FF;
 text-align: center;
}
.archiveDateTitle {
 color: #744D91;
 font-weight: bold;
 padding-top: 15px;
}
.archEntryHr {
 color: #DDDDDD;
 width: 250px;
}
.archiveeTitle li {
 background: url("http://src.ucoz.ru/t/461/25.gif") no-repeat scroll 0 4px transparent;
 margin-bottom: 0.6em;
 margin-left: 15px;
 padding: 0 0 0 15px;
}
.archiveEntryTime {
 font-style: italic;
 width: 65px;
}
.archiveEntryComms {
 color: #C3C3C3;
 font-size: 9px;
}
a.archiveDateTitleLink:link {
 color: #744D91;
 text-decoration: none;
}
a.archiveDateTitleLink:visited {
 color: #744D91;
 text-decoration: none;
}
a.archiveDateTitleLink:hover {
 color: #744D91;
 text-decoration: underline;
}
a.archiveDateTitleLink:active {
 color: #744D91;
 text-decoration: underline;
}
.archiveNoEntry {
 color: #0000FF;
 text-align: center;
}
.calWday {
 background: none repeat scroll 0 0 #8E8FB2;
 color: #FFFFFF;
 width: 18px;
}
.calWdaySe {
 background: none repeat scroll 0 0 #494791;
 color: #FFFFFF;
 width: 18px;
}
.calWdaySu {
 background: none repeat scroll 0 0 #494791;
 color: #FFFFFF;
 font-weight: bold;
 width: 18px;
}
.calMday {
 background: none repeat scroll 0 0 #8E8FB2;
 border: 1px solid #8E8FB2;
}
.calMdayA {
 background: none repeat scroll 0 0 #0A0852;
 color: #FFFFFF;
 font-weight: bold;
}
.calMdayIs {
 background: none repeat scroll 0 0 #FFFFFF;
 font-weight: bold;
}
.calMdayIsA {
 background: none repeat scroll 0 0 #FFFFFF;
 border: 1px solid #001EF9;
 font-weight: bold;
}
a.calMonthLink:link, a.calMdayLink:link {
 color: #648ACD;
 text-decoration: none;
}
a.calMonthLink:visited, a.calMdayLink:visited {
 color: #648ACD;
 text-decoration: none;
}
a.calMonthLink:hover, a.calMdayLink:hover {
 color: #FF00F9;
 text-decoration: underline;
}
a.calMonthLink:active, a.calMdayLink:active {
 color: #648ACD;
 text-decoration: underline;
}
.calTable {
 display: table;
 font-size: 0.9em;
 margin: 0 auto;
}
.calTable td {
 display: table-cell;
 padding: 3px;
}
.pollBut {
 width: 110px;
}
.pollBody {
 background: none repeat scroll 0 0 #743572;
 margin: 0;
 padding: 7px;
}
.textResults {
 background: none repeat scroll 0 0 #E8E0EB;
}
.textResultsTd {
 background: none repeat scroll 0 0 #FFFFFF;
}
.pollNow {
 border-bottom: 1px solid #E8E0EB;
 border-left: 1px solid #E8E0EB;
 border-right: 1px solid #E8E0EB;
}
.pollNowTd {
}
.totalVotesTable {
 border-bottom: 1px solid #E8E0EB;
 border-left: 1px solid #E8E0EB;
 border-right: 1px solid #E8E0EB;
}
.totalVotesTd {
 background: none repeat scroll 0 0 #FFFFFF;
}
a.groupModer:link, a.groupModer:visited, a.groupModer:hover {
 background: url("http://www.spyro-realms.com/img/button/mini_blue.gif") no-repeat scroll right center transparent;
 color: #4455FF;
 padding-right: 15px;
}
a.groupModer:hover, a.groupModer:active {
 text-decoration: underline;
}
a.groupAdmin:link, a.groupAdmin:visited, a.groupAdmin:hover {
 background: url("http://www.spyro-realms.com/img/button/mini_red.gif") no-repeat scroll right center transparent;
 color: #FF0000;
 padding-right: 15px;
}
a.groupAdmin:hover, a.groupAdmin:active {
 color: #FF0000;
 text-decoration: underline;
}
a.groupVerify:link, a.groupVerify:visited {
 color: #C46FDF;
}
a.groupVerify:hover, a.groupVerify:active {
 text-decoration: underline;
}
a.groupUser:link, a.groupUser:visited {
 color: #648ACD;
}
a.groupUser:hover, a.groupUser:active {
 color: #648ACD;
 text-decoration: underline;
}
a.groupBanned:link, a.groupBanned:visited, a.groupBanned:hover, a.groupBanned:active {
 color: #648ACD;
 text-decoration: line-through;
}
a.groupFriends:link, a.groupFriends:visited {
 color: #FFA500;
}
a.groupFriends:hover, a.groupFriends:active {
 color: #FFA500;
 text-decoration: underline;
}
a.groupFriends:link, a.groupFriends:visited {
 color: #FFA500;
}
a.groupOther4:hover, a.groupOther4:active {
 color: #FFA500;
 text-decoration: underline;
}a.groupOther4:link, a.groupOther4:visited {
 color: #FFA500;
}
a.groupFriends:hover, a.groupFriends:active {
 color: #FFA500;
 text-decoration: underline;
}
a.groupOther2:link, a.groupOther2:visited {
 color: #00AA00;
}
a.groupOther2:hover, a.groupOther2:active {
 color: #00AA00;
 text-decoration: underline;
}
a.groupOther1:link, a.groupOther1:visited {
 color: #FFFFFF;
}
a.groupOther1:hover, a.groupOther1:active {
 color: #FFFFFF;
 text-decoration: underline;
}
.replaceTable {
 background: none repeat scroll 0 0 #FFFFFF;
 border: 1px solid #390137;
 font-family: Verdana,Arial,Helvetica,sans-serif;
 font-size: 8pt;
 height: 100px;
 width: 300px;
}
.replaceBody {
 background: none repeat scroll 0 0 #4A335D;
}
.legendTd {
 font-size: 7pt;
}
td .queryField {
 width: 300px !important;
}
#uNetRegF td {
 text-align: left !important;
}
.myWinCont {
 text-align: left;
}
#message {
 font-family: Verdana,Arial,Helvetica,sans-serif;
}
.u-star-rating {
 list-style: none outside none !important;
}