html{height:100%}body#shoutbox{height:100%}body#messages{padding:10px 10px 0}#container{display:grid;grid-template-rows:1fr auto;grid-template-areas:"messages" "form";grid-gap:10px;width:100%;height:100%;background-color:#fff}#message-frame{grid-area:messages}iframe{width:100%;height:100%;border:0;border-bottom:1px solid #fafafa}#form{grid-area:form}form{overflow:hidden}input:nth-of-type(3){float:left}form div input{width:100%}input:nth-of-type(2){float:right}form div{overflow:hidden}input#id_nickname{margin-right:5px;width:72px}#btn-shout,#btn-show-agreement,#btn-accept-agreement{border:0;color:inherit;background:0;cursor:pointer;display:inline-block;text-transform:uppercase;letter-spacing:1px;font-weight:700;outline:0;position:relative;-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s}#btn-shout,#btn-show-agreement,#btn-accept-agreement{background:#acd037;color:#343434;box-shadow:0 3px #8dac28;-webkit-transition:none;-moz-transition:none;transition:none;border-radius:5px;padding-top:7px;padding-bottom:2px;margin-bottom:3px}#btn-shout:hover,#btn-show-agreement:hover,#btn-accept-agreement:hover{box-shadow:0 2px #8dac28;top:1px;color:#343434}#btn-shout:active,#btn-show-agreement:active,#btn-accept-agreement:active{box-shadow:0 0 #8dac28;top:3px;color:#343434}#btn-show-agreement{grid-area:form;display:none}#agreement{grid-row:1 / -1;grid-column:1 / -1;color:white;display:none;justify-content:center;align-items:center;z-index:1}#agreement div{background-color:#0072bc;padding:20px;margin:20px;display:flex;flex-direction:column}#agreement div p{max-width:60ex}input[type=submit]{margin-left:5px}.date{font-size:12px;text-transform:uppercase;line-height:13px;font-weight:700;color:#acd037;border-bottom:1px solid #ddd;margin-bottom:5px}.message time,.placeholder_message time,.track time{font-weight:700;color:#acd037;font-style:normal}.message .nickname,.placeholder_message .nickname{font-weight:700;color:#0072bc}.message .nickname.from-studio,.placeholder_message .nickname.from-studio{color:white;background-color:#0072bc;border-radius:3px;padding:2px}.message .nickname.from-telegram img.producer-icon{width:16px;height:16px;vertical-align:middle;margin-right:2px;position:relative;top:-1px}p.message,p.track,p.placeholder_message{margin-bottom:3px;word-wrap:break-word}p.message:last-child,p.placeholder_message:last-child{margin-bottom:0}.track{color:#555;font-style:italic}