body { margin: 0; padding: 0; font-family: Open Sans, Everson Mono, Helvetica; } .grade1 { font-size: 200%; margin-bottom: 0; margin-top: 0; display: block; color: #00bcd4; text-align: center; } .grade2 { font-size: 150%; margin-bottom: 0; margin-top: 20px; display: block; color: #00bcd4; text-align: center; } .grade3 { font-size: 120%; margin-bottom: 0; margin-top: 20px; display: block; color: #00bcd4; text-align: center; } .ircclient { position: absolute; width: 100%; height: 100%; background: #fff; background: -moz-linear-gradient(top, #fff 0%, #e5e5e5 100%); background: -webkit-linear-gradient(top, #fff 0%, #e5e5e5 100%); background: linear-gradient(to bottom, #fff 0%, #e5e5e5 100%); } .ircclient .coverwindow { position: absolute; width: 100%; height: 100%; } .ircclient .coverwindow#authdialog { z-index: 100; } .ircclient .coverwindow .wrapper { width: 320px; margin: auto; margin-top: 5%; padding: 15px; background-color: #f7f7f7; border: 1px solid #dadada; -webkit-box-shadow: 4px 4px 18px #d6d6d6; -moz-box-shadow: 4px 4px 18px #d6d6d6; box-shadow: 4px 4px 18px #d6d6d6; } .ircclient .coverwindow .wrapper .msg.error { color: #f00; } .ircclient .coverwindow .wrapper label { display: block; font-size: 80%; margin-top: 5px; color: #2196f3; } .ircclient .coverwindow .wrapper label.autosize { width: auto; display: inline-block !important; font-size: 90% !important; margin-bottom: 10px; } .ircclient .coverwindow .wrapper input[type=text], .ircclient .coverwindow .wrapper input[type=number], .ircclient .coverwindow .wrapper input[type=password] { padding: 8px; width: 300px; border-radius: 5px; border: 1px solid #d2d2d2; -webkit-box-shadow: inset 2px 2px 4px #dcdcdc; -moz-box-shadow: inset 2px 2px 4px #dcdcdc; box-shadow: inset 2px 2px 4px #dcdcdc; } .ircclient .coverwindow .wrapper input[type="submit"] { width: 318px; padding: 12px; margin-top: 20px; display: block; background: #87e0fd; background: -moz-linear-gradient(top, #87e0fd 0%, #53cbf1 40%, #05abe0 100%); background: -webkit-linear-gradient(top, #87e0fd 0%, #53cbf1 40%, #05abe0 100%); background: linear-gradient(to bottom, #87e0fd 0%, #53cbf1 40%, #05abe0 100%); border: 1px solid #2196f3; border-radius: 4px; color: #fff; font-size: 120%; font-weight: bold; text-transform: uppercase; cursor: pointer; } .ircclient .coverwindow .wrapper input[type="submit"]:hover { background: #c4effc; background: -moz-linear-gradient(top, #c4effc 0%, #7fd5ef 40%, #39b7dd 100%); background: -webkit-linear-gradient(top, #c4effc 0%, #7fd5ef 40%, #39b7dd 100%); background: linear-gradient(to bottom, #c4effc 0%, #7fd5ef 40%, #39b7dd 100%); } .ircclient #chat { overflow: hidden; } .ircclient #chat .ircwrapper { position: absolute; width: 100%; height: 100%; } .ircclient #chat .ircwrapper .toolbar { height: 56px; background-color: #00c7e0; position: relative; z-index: 15; -webkit-box-shadow: 2px 2px 4px #cecece; -moz-box-shadow: 2px 2px 4px #cecece; box-shadow: 2px 2px 4px #cecece; } .ircclient #chat .ircwrapper .toolbar .open_settings { width: 36px; height: 36px; display: inline-block; position: absolute; right: 10px; top: 10px; cursor: pointer; background-image: url("../image/settings.svg"); background-repeat: no-repeat; background-size: contain; -webkit-transition: transform 0.2s linear; -moz-transition: transform 0.2s linear; -ms-transition: transform 0.2s linear; -o-transition: transform 0.2s linear; transition: transform 0.2s linear; } .ircclient #chat .ircwrapper .toolbar .open_settings:hover { transform: rotateZ(-90deg); } .ircclient #chat .ircwrapper .toolbar .tabby { display: inline-block; height: 56px; position: absolute; right: 45px; left: 0; white-space: nowrap; overflow-x: auto; overflow-y: hidden; } .ircclient #chat .ircwrapper .toolbar .tabby .tab { display: inline-block; min-width: 60px; height: 25px; margin: 5px; margin-right: 0; padding: 10px; line-height: 25px; background-color: #29e1ff; -webkit-transition: background-color 0.2s linear; -moz-transition: background-color 0.2s linear; -ms-transition: background-color 0.2s linear; -o-transition: background-color 0.2s linear; transition: background-color 0.2s linear; border-radius: 5px; border: 1px solid #00d0ea; -webkit-box-shadow: inset 4px 4px 8px #44ebff; -moz-box-shadow: inset 4px 4px 8px #44ebff; box-shadow: inset 4px 4px 8px #44ebff; color: #fff; cursor: pointer; font-weight: 600; } .ircclient #chat .ircwrapper .toolbar .tabby .tab #unread { display: inline-block; min-width: 18px; height: 18px; background-color: #bf0000; border: 1px solid #b00; -webkit-box-shadow: inset 2px 2px 3px #f00; -moz-box-shadow: inset 2px 2px 3px #f00; box-shadow: inset 2px 2px 3px #f00; text-align: center; font-size: 12px; margin: 0 5px; line-height: 20px; border-radius: 100%; } .ircclient #chat .ircwrapper .toolbar .tabby .tab #unread.none { display: none; } .ircclient #chat .ircwrapper .toolbar .tabby .tab #close { display: inline-block; width: 12px; text-align: center; color: #ff3d3d; margin-left: 5px; } .ircclient #chat .ircwrapper .toolbar .tabby .tab:hover { background-color: #63e9ff; -webkit-box-shadow: inset 4px 4px 8px #86f2ff; -moz-box-shadow: inset 4px 4px 8px #86f2ff; box-shadow: inset 4px 4px 8px #86f2ff; } .ircclient #chat .ircwrapper .toolbar .tabby .tab.active { background-color: #00b9d8; border: 1px solid #009aad; -webkit-box-shadow: inset 4px 4px 8px #009caf; -moz-box-shadow: inset 4px 4px 8px #009caf; box-shadow: inset 4px 4px 8px #009caf; color: #fff; } .ircclient #chat .ircwrapper .toolbar .tabby .tab.active:hover { background-color: #00c7e8; } .ircclient #chat .ircwrapper .chatarea { position: absolute; top: 56px; width: 100%; bottom: 46px; } .ircclient #chat .ircwrapper .chatarea .smsc-nicklistbtn { background-image: url("../image/users.svg"); background-repeat: no-repeat; background-size: contain; width: 46px; height: 46px; position: absolute; top: 16px; right: 16px; background-color: #00bcd4; border-radius: 100%; border: 5px solid #389dbb; display: none; opacity: 0.5; cursor: pointer; } .ircclient #chat .ircwrapper .chatarea .topicbar { position: absolute; top: 0; height: 20px; right: 0; left: 0; background-color: #fff; border-bottom: 1px solid #ddd; padding: 12px; display: none; overflow: hidden; z-index: 10; } .ircclient #chat .ircwrapper .chatarea .topicbar:hover { height: auto; max-height: 100px; overflow: auto; word-wrap: break-word; } .ircclient #chat .ircwrapper .chatarea .letterbox { position: absolute; top: 0; bottom: 0; left: 0; right: 0; overflow-y: auto; white-space: pre-wrap; word-wrap: break-word; padding: 5px; } .ircclient #chat .ircwrapper .chatarea .nicklist { width: 280px; position: absolute; right: 0; border-left: 1px solid #ddd; padding: 10px; top: 0; bottom: 0; display: none; z-index: 11; background-color: #fff; overflow: auto; } .ircclient #chat .ircwrapper .chatarea .nicklist .nick { cursor: pointer; } .ircclient #chat .ircwrapper .chatarea .nicklist .nick:hover { background-color: #aeebff; } .ircclient #chat .ircwrapper .chatarea .nicklist .nick .nickname { font-size: 120%; } .ircclient #chat .ircwrapper .chatarea .nicklist .nick .prefix { width: 16px; height: 16px; line-height: 16px; padding: 2px; display: inline-block; background-color: #05abe0; border-radius: 4px; color: #fff; text-align: center; margin-right: 5px; font-weight: bold; } .ircclient #chat .ircwrapper .chatarea .nicklist .nick .no-prefix { width: 25px; display: inline-block; } .ircclient #chat .ircwrapper .chatarea .settings { position: absolute; top: 0; bottom: 0; left: 0; right: 0; padding: 20px; width: 60%; min-width: 360px; margin: auto; overflow: auto; } .ircclient #chat .ircwrapper .chatarea .settings .grade1, .ircclient #chat .ircwrapper .chatarea .settings .grade2, .ircclient #chat .ircwrapper .chatarea .settings .grade3 { text-align: left; } .ircclient #chat .ircwrapper .chatarea.vnicks .nicklist { display: block; } .ircclient #chat .ircwrapper .chatarea.vnicks .letterbox { right: 301px; } .ircclient #chat .ircwrapper .chatarea.vnicks .topicbar { right: 301px; } .ircclient #chat .ircwrapper .chatarea.vtopic .topicbar { display: block; } .ircclient #chat .ircwrapper .chatarea.vtopic .letterbox { top: 45px; } .ircclient #chat .ircwrapper .input { position: absolute; bottom: 0; height: 46px; width: 100%; background-color: #00c7e0; } .ircclient #chat .ircwrapper .input .my_nickname { background-color: #00efef; margin: 5px; padding: 7px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; padding-right: 20px; margin-right: 0; width: 183px; overflow: hidden; } .ircclient #chat .ircwrapper .input .inputwrapper { display: inline-block; position: absolute; margin: 5px 0; left: 210px; right: 55px; top: 0; } .ircclient #chat .ircwrapper .input .inputwrapper input { width: 100%; padding: 6px; font-size: 120%; border: 1px solid #929292; border-left: 0; -webkit-box-shadow: inset 4px 4px 8px #d8d8d8; -moz-box-shadow: inset 4px 4px 8px #d8d8d8; box-shadow: inset 4px 4px 8px #d8d8d8; } .ircclient #chat .ircwrapper .input .sendbutton { background-image: url("../image/send.svg"); background-repeat: no-repeat; background-size: contain; width: 32px; position: absolute; height: 32px; float: right; top: 5px; right: 5px; cursor: pointer; } .message.type_simple.mentioned { background-color: #aeebff; } .message.type_simple .timestamp { color: #696969; } .message.type_simple .timestamp:before { color: #607d8b; content: "["; } .message.type_simple .timestamp:after { color: #607d8b; content: "]"; } .message.type_simple .sender { color: #3f51b5; } .message.type_simple .sender:before { content: "<"; } .message.type_simple .sender:after { content: ">"; } .message.type_simple .arrowin, .message.type_simple .arrowout { font-weight: bolder; } .message.type_simple .channel { font-weight: bold; color: #a0a0a0; } .message.type_simple .m_listentry .channel { min-width: 120px; display: inline-block; } .message.type_simple .m_listentry .usercount { display: inline-block; min-width: 45px; text-align: center; } .message .reason:before, .message .hostmask:before { content: "("; } .message .reason:after, .message .hostmask:after { content: ")"; } .message .reason:before, .message .hostmask:before, .message .reason:after, .message .hostmask:after { color: #009606; font-weight: bold; } .message .reason { color: #bf0000; } .message .hostmask { color: #004c88; } .message .arrowin { color: #00ab00; } .message .arrowout { color: #dc0f00; } .message.m_quit, .message.m_part, .message.m_kick { color: #f00; } .message.m_join { color: #008000; } .message.m_topic .content, .message.m_names .content { color: #03a9f4; font-weight: bold; } .message.m_motd .content { font-family: monospace; } .message.m_nick .content, .message.m_notice .content { color: #ff9800; font-weight: bold; } .message.m_action .actionee { color: #3f51b5; } .message.m_action .asterisk { color: #e4c000; } .message.m_mode .content { font-style: italic; } .message.m_mode .mode { color: #008000; } .message.m_mode .asterisk { color: #05abe0; } .message.m_error .content { color: #f00; font-weight: bold; } .message.m_help .content { color: #008000; font-weight: bold; } .message .irc-bg00, .topicbar .irc-bg00, .message .irc-bg0, .topicbar .irc-bg0 { background-color: #fff; } .message .irc-bg01, .topicbar .irc-bg01, .message .irc-bg1, .topicbar .irc-bg1 { background-color: #000; } .message .irc-bg02, .topicbar .irc-bg02, .message .irc-bg2, .topicbar .irc-bg2 { background-color: #000080; } .message .irc-bg03, .topicbar .irc-bg03, .message .irc-bg3, .topicbar .irc-bg3 { background-color: #008000; } .message .irc-bg04, .topicbar .irc-bg04, .message .irc-bg4, .topicbar .irc-bg4 { background-color: #f00; } .message .irc-bg05, .topicbar .irc-bg05, .message .irc-bg5, .topicbar .irc-bg5 { background-color: #a52a2a; } .message .irc-bg06, .topicbar .irc-bg06, .message .irc-bg6, .topicbar .irc-bg6 { background-color: #800080; } .message .irc-bg07, .topicbar .irc-bg07, .message .irc-bg7, .topicbar .irc-bg7 { background-color: #ffa500; } .message .irc-bg08, .topicbar .irc-bg08, .message .irc-bg8, .topicbar .irc-bg8 { background-color: #ff0; } .message .irc-bg09, .topicbar .irc-bg09, .message .irc-bg9, .topicbar .irc-bg9 { background-color: #0f0; } .message .irc-bg10, .topicbar .irc-bg10 { background-color: #008080; } .message .irc-bg11, .topicbar .irc-bg11 { background-color: #0ff; } .message .irc-bg12, .topicbar .irc-bg12 { background-color: #00f; } .message .irc-bg13, .topicbar .irc-bg13 { background-color: #ffc0cb; } .message .irc-bg14, .topicbar .irc-bg14 { background-color: #808080; } .message .irc-bg15, .topicbar .irc-bg15 { background-color: #d3d3d3; } .message .irc-fg00, .topicbar .irc-fg00, .message .irc-fg0, .topicbar .irc-fg0 { color: #fff; } .message .irc-fg01, .topicbar .irc-fg01, .message .irc-fg1, .topicbar .irc-fg1 { color: #000; } .message .irc-fg02, .topicbar .irc-fg02, .message .irc-fg2, .topicbar .irc-fg2 { color: #000080; } .message .irc-fg03, .topicbar .irc-fg03, .message .irc-fg3, .topicbar .irc-fg3 { color: #008000; } .message .irc-fg04, .topicbar .irc-fg04, .message .irc-fg4, .topicbar .irc-fg4 { color: #f00; } .message .irc-fg05, .topicbar .irc-fg05, .message .irc-fg5, .topicbar .irc-fg5 { color: #a52a2a; } .message .irc-fg06, .topicbar .irc-fg06, .message .irc-fg6, .topicbar .irc-fg6 { color: #800080; } .message .irc-fg07, .topicbar .irc-fg07, .message .irc-fg7, .topicbar .irc-fg7 { color: #ffa500; } .message .irc-fg08, .topicbar .irc-fg08, .message .irc-fg8, .topicbar .irc-fg8 { color: #dcdc00; } .message .irc-fg09, .topicbar .irc-fg09, .message .irc-fg9, .topicbar .irc-fg9 { color: #00e600; } .message .irc-fg10, .topicbar .irc-fg10 { color: #008080; } .message .irc-fg11, .topicbar .irc-fg11 { color: #00d2d2; } .message .irc-fg12, .topicbar .irc-fg12 { color: #00f; } .message .irc-fg13, .topicbar .irc-fg13 { color: #ffc0cb; } .message .irc-fg14, .topicbar .irc-fg14 { color: #808080; } .message .irc-fg15, .topicbar .irc-fg15 { color: #d3d3d3; } .message .irc-bold, .topicbar .irc-bold { font-weight: bold; } .message .irc-italic, .topicbar .irc-italic { font-style: italic; } .message .irc-underline, .topicbar .irc-underline { text-decoration: underline; } @media all and (max-width: 600px) { .vnicks .nicklist { display: none !important; } .vnicks .letterbox { right: 0 !important; } .vnicks .topicbar { right: 0 !important; } .vnicks.vopentrig .nicklist { display: block !important; } .vnicks.vopentrig .topicbar { right: 45px; } .vnicks .smsc-nicklistbtn { z-index: 12; display: block !important; } .my_nickname { display: none; } .inputwrapper { left: 38px !important; } }