@media (max-width: 479px) { html { background: #FFF; } .tg_page_head .navbar > .container .navbar-brand { padding-left: 9px; } .im_history_panel_edit_link { margin-right: 0; } .navbar-header { float: none; } .navbar-toggle-wrap { float: right; display: block; margin: 5px; } .navbar-toggle-wrap .navbar-toggle { float: none; display: block; margin: 0; padding: 6px 10px; } .navbar_peer_not_selected .navbar-toggle-wrap .navbar-toggle { padding: 9px 10px; } .navbar-toggle-wrap .navbar-toggle .icon-bar { width: 4px; height: 4px; border-radius: 0; margin-left: 6px; margin-right: 6px; } .navbar_peer_not_selected .navbar-toggle-wrap .navbar-toggle .icon-bar { width: 22px; height: 2px; border-radius: 1px; margin-left: 0; margin-right: 0; } .navbar-toggle .dropdown-toggle { display: block; } .navbar-toggle-wrap .dropdown-menu { margin-top: 4px; right: -49px; left: auto; } .navbar_peer_not_selected .navbar-toggle-wrap .dropdown-menu { right: 0; } .navbar-search-wrap { display: none; float: right; margin: 5px 0 5px 5px; padding: 5px 5px 1px; border: 1px solid transparent; border-radius: 4px; } .navbar-search-wrap:link, .navbar-search-wrap:active { background-color: rgba(255,255,255,0.1); } .icon-search { display: inline-block; width: 21px; height: 21px; background: url(../img/icons/MobileIcons_2x.png) 0 0 no-repeat; background-size: 21px 52px; } .is_1x .icon-search { background-image: url(../img/icons/MobileIcons_1x.png); } .tg_page_head .navbar_peer_not_selected .navbar-search-wrap { display: block; } .tg_page_head .navbar-quick-nav { display: block; margin: 0; } .tg_page_head .navbar-quick-nav li { float: left; } .tg_page_head .navbar-quick-nav a { padding-top: 15px; padding-bottom: 15px; } .icon-back { display: inline-block; width: 10px; height: 18px; vertical-align: text-top; background: url(../img/icons/IconsetW.png) -15px -419px no-repeat; background-size: 42px 710px; opacity: 0.8; } .is_1x .icon-back { background-image: url(../img/icons/IconsetW_1x.png); } .tg_page_head .navbar-quick-nav a:active .icon-back { opacity: 1; } .tg_page_head .navbar > .container .navbar-brand { display: none; } .tg_page_head .navbar_peer_not_selected > .container .navbar-brand { display: block; } .tg_page_head .navbar-inverse .navbar-quick-nav > li > a { padding-left: 15px; padding: 6px 10px 2px 25px; color: #b9cfe3; font-size: 13px; height: 44px; } .tg_page_head .navbar-inverse .navbar-quick-nav > li > a:hover { color: #b9cfe3; } .tg_page_head .navbar-inverse .navbar-quick-nav > li > a:active { background-color: rgba(255,255,255,0.1); } .navbar-quick-nav .icon-back { position: absolute; margin-left: -15px; margin-top: 9px; } .navbar-quick-nav h4 { font-size: 14px; color: #FFF; white-space: nowrap; overflow: hidden; margin: 0; } .navbar-quick-media-back h4 { margin: 9px 0 12px 0; } .navbar-quick-profile-back small, .navbar-quick-group-back small { white-space: nowrap; overflow: hidden; margin-left: 0; } .navbar-menu { display: none; } .navbar_offline .navbar-menu { display: block; } .navbar_offline .navbar-offline { float: left; margin: 0; } .navbar-offline > li > a { padding-right: 0; padding-left: 0; } .navbar_offline .tg_head_logo_text { display: none; } .navbar-offline-text { padding-left: 0px; } .tg_page_head .navbar_offline > .container .navbar-brand { margin-right: 0; } .navbar_offline .navbar-quick-nav li > a > h4, .navbar_offline .navbar-quick-nav li > a > small, .navbar_offline .im_head_attach, .navbar_offline .navbar-search-wrap { display: none; } .navbar-peer-wrap { display: block; float: right; width: 44px; height: 44px; } .navbar-peer-wrap img { width: 44px; height: 44px; } .navbar_peer_not_selected .navbar-peer-wrap { display: none; } .login_form_wrap { border-radius: 0; max-width: auto; box-shadow: none; -webkit-box-shadow: none; margin: 30px auto 20px; } .im_page_wrap { background: none; box-shadow: none; border: 0; overflow: hidden; } .im_page_footer { display: none; } .im_panel_own_photo, .im_panel_peer_photo { display: none; } .im_history_panel_wrap { display: none; margin: 0 15px; } .im_send_panel_wrap { padding: 10px 5px; } .icon-select-tick { margin: 10px 0 0 -24px } .im_history { position: static; } .im_message_wrap { padding: 0 10px; } .im_content_message_wrap { margin-left: 0; font-size: 1.2em; } .form-control { font-size: 1.2em; } .im_history_typing { padding: 0 15px 0 56px; } .im_history_panel_info_link { display: none; } .im_send_form { left: 0; right: 0; max-width: none; } .im_edit_flush_link, .im_edit_cancel_link, .im_edit_delete_btn, .im_edit_forward_btn { padding-left: 5px; padding-right: 5px; margin: 6px 4px; } .im_edit_panel_border { margin: 0 18px 22px 3px; } .im_edit_panel_wrap { margin: 0 5px; padding-bottom: 18px; } .im_history_col .nano > .pane { top: 3px; right: 3px; width: 6px; } .im_history_col .nano > .pane > .slider, .contacts_modal_col .nano > .pane > .slider, .im_dialogs_modal_col .nano > .pane > .slider { background : rgba(3,46,79,0.22); border-radius: 3px; margin: 0; } .im_dialogs_col_wrap { border: 0; padding-bottom: 0; } .im_dialogs_col_wrap, .im_history_col_wrap { float: none; width: auto; max-width: auto; min-width: auto; } .im_dialogs_col_wrap, .im_page_peer_not_selected .im_history_col_wrap { display: none; } .im_page_peer_not_selected .im_dialogs_col_wrap { display: block; } .im_dialogs_col { margin-right: 0; } .im_page_peer_not_selected .im_dialogs_col_wrap .pane { width: 6px; right: 3px; } .im_page_peer_not_selected .im_dialogs_col_wrap .pane > .slider { background : rgba(3,46,79,0.22); border-radius: 3px; margin: 0; } .im_dialogs_panel { display: none; padding-left: 9px; padding-right: 9px; } .im_dialogs_panel_search.im_dialogs_panel { display: block; } .im_dialogs_panel_dropdown { display: none; } .im_page_split .im_dialogs_search { margin-right: 0; } .im_dialogs_modal_col .im_dialogs_scrollable_wrap, .im_dialogs_scrollable_wrap { padding: 0; } .im_dialogs_scrollable_wrap a.im_dialog { border-bottom: 1px solid #e3e3e3; border-top: 1px solid #e3e3e3; margin-top: -1px; border-radius: 0 !important; } .im_dialog_wrap:last-child a.im_dialog { border-bottom: 0; } .im_dialog_photo { width: 45px; height: 45px; margin-right: 12px; } .im_dialog_peer, .im_dialog_message { font-size: 1.2em; } .im_dialog_peer { margin-bottom: 5px; } .im_dialogs_scrollable_wrap .active a.im_dialog { border-top-color: #6490b1; border-bottom-color: #6490b1; } .im_dialogs_scrollable_wrap .active + li a.im_dialog { margin-top: 0; border-top: 0; } .peer_select_modal_wrap .modal-body { padding-left: 0; padding-right: 0; } .modal.page_modal { background: #FFF; } .page_modal .modal-content { border-radius: 0; box-shadow: none; } .page_modal .modal-dialog { margin: 0; } .page_modal .modal-content .modal-body { padding-left: 0; padding-right: 0; } .user_modal_other_btn button { padding-right: 0; } .user_modal_other_btn .dropdown-menu { left: auto; right: -9px; } .chat_modal_actions_wrap { clear: both; } .chat_modal_other_btn button { padding-right: 0; } .chat_modal_other_btn .dropdown-menu { left: auto; right: -9px; } .photo_modal_window .modal-content, .video_modal_window .modal-content { border-radius: 0; } .media_modal_wrap .modal-body { padding: 0 0 0; } .media_modal_actions, .media_modal_info{ margin: 10px; } .im_send_form { position: relative; } .im_send_field_wrap { margin-right: 50px; margin-left: 42px; } .im_media_attach, .im_attach { display: none; } .im_submit { background: none; border: 0; color: #1877c3; font-weight: bold; font-size: 15px; padding: 0 6px; position: absolute; right: 0; top: 0; width: 45px; min-width: 0; line-height: 32px; } .im_submit:hover { color: #1877c3; background: none; } .im_submit:active { box-shadow: none; } .im_emoji_btn { position: absolute; left: 7px; top: -1px; } .emoji-wysiwyg-editor { min-height: 32px; max-height: 150px; } .emoji-menu { margin-left: -19px; margin-top: -257px; } .im_edit_panel_wrap { padding-top: 2px; padding-bottom: 4px; } .im_edit_panel_border { margin-bottom: 3px; } .im_head_attach { display: block; float: right; cursor: pointer; overflow: hidden; position: relative; margin: 5px 0 5px 5px; height: 34px; border-radius: 4px; padding: 3px 7px; border: 1px solid #497495; } .navbar_peer_not_selected .im_head_attach { display: none; } .im_head_attach:active { background-color: rgba(255,255,255,0.1); } .im_head_attach .icon-paperclip { display: inline-block; width: 21px; height: 22px; vertical-align: text-top; opacity: 0.8; background: url(../img/icons/MobileIcons_2x.png) 0 -30px no-repeat; background-size: 21px 52px; } .is_1x .im_head_attach .icon-paperclip { background-image: url(../img/icons/MobileIcons_1x.png); } .im_head_attach:active .icon-paperclip { opacity: 1; } }