Файл: Boomchat 7.1/css/responsive.css
Строк: 394
@media only screen and (max-width : 320px) {
#container_chat,
#menu_container_inside, #inner_header
{
width:98%;
padding-left:1%;
padding-right:1%;
}
.panelone
{
width:100%;
margin-right:-100%;
box-shadow:none;
}
.paneltwo
{
width:100%;
margin-right:-100%;
box-shadow:none;
}
.panelthree
{
width:100%;
}
}
@media only screen and (min-width : 321px) and
(max-width : 479px) {
#container_chat, #menu_container_inside,
#inner_header
{
width:98%;
padding-left:1%;
padding-right:1%;
border:none;
}
.panelone
{
width:320px;
margin-right:-320px;
}
.paneltwo
{
width:100%;
margin-right:-100%;
}
.panelthree
{
width:320px;
}
}
@media only screen and (min-width : 480px) and
(max-width : 768px) {/*--- tablet portrait ---*/
#container_chat,
#menu_container_inside, #inner_header
{
width:98%;
padding-left:1%;
padding-right:1%;
border:none;
}
.panelone
{
width:320px;
margin-right:-320px;
}
.paneltwo
{
width:75%;
margin-right:-75%;
}
.panelthree
{
width:320px;
}
}
@media only screen and (min-width : 768px) and
(max-width : 1024px) {/*--- tablet landscape ---*/
#container_chat,
#menu_container_inside,
#inner_header{
width:98%;
padding-left:1%;
padding-right:1%;
border:none;
}
.panelone
{
width:320px;
margin-right:-320px;
}
.paneltwo
{
width:500px;
margin-right:-500px;
}
.panelthree
{
width:320px;
}
}
@media only screen and (min-width : 1025px) and
(max-width : 1099px) {/*--- tablet landscape ---*/
#container_chat,
#menu_container_inside, #inner_header
{
width:65%;
float:left;
}
.panelone
{
width:32%;
margin-right:-32%;
}
.paneltwo
{
width:500px;
margin-right:-500px;
}
.panelthree
{
width:32%;
}
}
@media only screen and (min-width : 1100px) and
(max-width : 1224px) {/*--- tablet landscape ---*/
#container_chat,
#menu_container_inside, #inner_header
{
width:750px;
float:right;
margin-right:340px;
}
.panelone
{
width:320px;
margin-right:-320px;
}
.paneltwo
{
width:500px;
margin-right:-500px;
}
.panelthree
{
width:320px;
}
}
@media only screen and (min-width : 1225px) and
(max-width : 1300px) {/*--- pc small screen---*/
#container_chat,
#menu_container_inside, #inner_header
{
width:770px;
float:left;
margin-left:125px;
}
.panelone
{
width:320px;
margin-right:-320px;
}
.paneltwo
{
width:500px;
margin-right:-500px;
}
.panelthree
{
width:320px;
}
}
@media only screen and (min-width : 1301px) and
(max-width : 1440px) {/*--- pc small screen---*/
#container_chat,
#menu_container_inside, #inner_header
{
width:820px;
float:right;
margin-right:340px;
}
.panelone
{
width:320px;
margin-right:-320px;
}
.paneltwo
{
width:500px;
margin-right:-500px;
}
.panelthree
{
width:320px;
}
}
@media only screen and (min-width : 1441px) and
(max-width : 1540px) {
#container_chat, #menu_container_inside,
#inner_header
{
width:900px;
float:right;
margin-right:340px;
}
.panelone
{
width:320px;
margin-right:-320px;
}
.paneltwo
{
width:500px;
margin-right:-500px;
}
.panelthree
{
width:320px;
}
}
@media only screen and (min-width : 1541px)
and (max-width : 1880px) {
#container_chat, #menu_container_inside,
#inner_header {
width:900px;
}
.panelone
{
width:320px;
margin-right:-320px;
}
.paneltwo
{
width:600px;
margin-right:-600px;
}
.panelthree
{
width:320px;
}
}
@media only screen and (min-width : 1880px)
{
#container_chat, #menu_container_inside, #inner_header
{
width:1000px;
margin:0 auto;
}
.panelone
{
width:400px;
margin-right:-400px;
}
.paneltwo
{
width:600px;
margin-right:-600px;
}
.panelthree
{
width:400px;
}
}
@media screen and
(max-width:360px){
#container_login, #container_kicked, #inner_header
{
width:100%;
height:100%;
min-width:300px;
z-index:15;
top:0;
left:0;
margin:0
auto;
padding:0;
box-shadow:none;
border:none;
}
#header_login
{
margin-top:20px;
}
}
@media screen and
(max-height:360px){
#container_login, #container_kicked, #inner_header
{
width:100%;
height:100%;
z-index:15;
top:0;
left:0;
margin:0
auto;
padding:0;
box-shadow:none;
border:none;
}
#main_emoticon
{
border:none !important;
}
}
@media screen and
(max-height:480px){
#main_emoticon {
border:none
!important;
}
#room_topic {
display:none;
}
}
@media screen and
(max-height:600px){
#private_chat ul {
height:200px;
}
.panelthree
{
padding-bottom:12px;
}
}
@media screen and
(max-width:480px){
.hide_mobile {
display:none;
}
.addon_button,
.test_button, .other_panels {
margin-right:3px;
}
}
@media only
screen and (max-device-width: 1024px) and (max-device-height: 768px)
{
#show_chat li, #show_private li {
font-size:1.2em;
}
}
@media
screen and (max-width:1024px){
.panelone, .paneltwo
{
box-shadow:none;
}
#header {
height:40px;
}
#inner_header
{
width:95%;
}
#container_chat
{
border-radius:0px;
}
#login_button, #register_button,
#recovery_button, #newpass_button, #back_login, #guest_button, #guest_ok,
.forgot_password, #login_welcome, .fbl_button, #login_register,
#login_login {
font-size:1.2em !important;
}
}
@media screen and
(max-width:480px){
.private_friend .hide_private_title
{
display:none;
}
#header {
height:30px;
}
}
@media screen
and (max-width:660px){
#container_login
{
width:100%;
max-width:100%;
margin:0
auto;
top:0;
left:0;
min-height:100%;
height:auto;
padding:0;
padding-bottom:50px;
border:none;
}
#header_login,
#content_login, #content_kicked
{
width:86%;
max-width:320px;
}
#content_login_right,
#content_login_left, #fsubmit_control, #fsubmit_rules
{
width:100%;
float:none;
margin:0
auto;
display:block;
}
#login_welcome
{
margin-top:30px;
}
}
@media screen and
(max-height:360px){
#container_login
{
width:100%;
max-width:100%;
margin:0
auto;
top:0;
left:0;
min-height:100%;
height:auto;
padding:0;
padding-bottom:50px;
border:none;
}
#header_login,
#content_login
{
width:86%;
max-width:320px;
}
#content_login_right,
#content_login_left, #fsubmit_control, #fsubmit_rules
{
width:100%;
float:none;
margin:0
auto;
display:block;
}
#login_welcome
{
margin-top:30px;
}
}
@media screen and
(max-height:650px){
#header {
display:none !important;
}
}