Is it allowed for us to have access to the css for the mobile version?  If so, how?

You can modify the mobile version style as you like, you just need to know the Classnames, or Ids of the elements. You can spoof your browser useragent and trick a website into thinking you're on a mobile device. This allows you to modify the style easily.

This is the CSS from the mobile version on my forum :

Code:

/* Version Mobile */
/* CSS Reset */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td, hr {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  text-decoration: none;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

/* remember to define focus styles! */
:focus {
  outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
  text-decoration: none;
}

del {
  text-decoration: line-through;
}

/* tables still need ‘cellspacing=”0?‘ in the markup */table {
  border-collapse: collapse;
  border-spacing: 0;
}

/*Fin CSS Reset */
html,body {
  height: 100%;
}

body {
  font-size: 16px;
  font-family: Helvetica, sans-serif;
}

#page-body {
  position: relative;
  min-height: 100%;
  background: none #c4c4c6;
}

.mobile_title {
  font-size: 0.9em;
  height: 29px;
  position: relative;
  padding: 2px 0;
  line-height: 12px;
  background: none #BECCDD;
  background: -webkit-gradient(linear, left top, left bottom, from(#BECCDD), to(#587397), color-stop(0.48, #8B9DB5), color-stop(0.5, #8195AF));
  background: -moz-linear-gradient(top, #BECCDD, #587397);
  background: -ms-linear-gradient(top, #BECCDD, #587397);
  background: linear-gradient(top, #BECCDD, #587397);
  border-top: 1px solid #D0D9E6;
  border-right: none;
  border-bottom: 1px solid #3F5C80;
  border-left: none;
}

.mobile_title.application_header {
  position: fixed;
  width: 100%;
  z-index: 100;
}

.application_header_spacer {
  height: 33px;
}

.mobile_title_content {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
  font-weight: bold;
  float: none;
  width: auto;
  position: absolute;
  left: 65px;
  right: 65px;
  text-align: center;
  line-height: 34px;
  color: #fff;
  top: 0px;
}

.mobile_set {
  height: 1em;
  padding: 0.5em;
  color: #fff;
  font-size: 0.9em;
  background: none #347DEE;
  background: -webkit-gradient(linear, left top, left bottom, from(#347DEE), to(#24445C), color-stop(0.48, #489CDB), color-stop(0.5, #388CCB));
  background: -moz-linear-gradient(top, #347DEE, #24445C);
  background: -ms-linear-gradient(top, #347DEE, #24445C);
/*background: -o-gradient(linear, left top, left bottom, from(#347DEE), to(#24445C), color-stop(0.48, #489CDB), color-stop(0.5, #388CCB));background: gradient(linear, left top, left bottom, from(#347DEE), to(#24445C), color-stop(0.48, #489CDB), color-stop(0.5, #388CCB));*/;
}

.mobile_set_content {
  float: left;
  width: 80%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
  font-weight: bold;
  line-height: 1.2em;
}

.mobile_item {
  margin: 0;
  border: 1px solid #EEEEEF;
  border-bottom-color: #9C9EA5;
  border-right: 0;
  border-left: 0;
  padding: 0.5em 0;
  font-size: 0.8em;
  background: none #DBDBDD;
  background: -webkit-gradient(linear, left top, left bottom, from(#DBDBDD), to(#B4B4B8), color-stop(1, white));
  background: -moz-linear-gradient(top, #DBDBDD, #B4B4B8);
  background: -ms-linear-gradient(top, #DBDBDD, #B4B4B8);
/*background: -o-gradient(linear, left top, left bottom, from(#DBDBDD), to(#B4B4B8), color-stop(1, white));background: gradient(linear, left top, left bottom, from(#DBDBDD), to(#B4B4B8), color-stop(1, white));*/;
}

.mobile_item:hover {
  background: none #DBDBDD;
  background: -webkit-gradient(linear, left top, left bottom, from(#DBDBDD), to(#FFFFFF), color-stop(0.5, white));
  background: -moz-linear-gradient(top, #DBDBDD, #FFFFFF);
  background: -ms-linear-gradient(top, #DBDBDD, #FFFFFF);
/*background: -o-gradient(linear, left top, left bottom, from(#DBDBDD), to(#FFFFFF), color-stop(0.5, white));background: gradient(linear, left top, left bottom, from(#DBDBDD), to(#FFFFFF), color-stop(0.5, white));*/;
}

.mobile_item_link_content {
  padding: 0 1em 0 45px;
  background: url(http://2img.net/i/fa/mobile/arrow_right.png) no-repeat scroll 100% 50%;
}

.forum_no_new {
  background: url(http://2img.net/i/fa/subsilver/folder_big.gif) no-repeat scroll 0 50%;
}

.forum_new {
  background: url(http://2img.net/i/fa/subsilver/folder_new_big.gif) no-repeat scroll 0 50%;
}

.forum_locked {
  background: url(http://2img.net/i/fa/subsilver/folder_locked_big.gif) no-repeat scroll 0 50%;
}

.cat_no_new {
  background: url(http://2img.net/i/fa/subsilver/category.gif) no-repeat scroll 0 50%;
}

.cat_new {
  background: url(http://2img.net/i/fa/subsilver/category_new.gif) no-repeat scroll 0 50%;
}

.cat_locked {
  background: url(http://2img.net/i/fa/subsilver/category_locked.gif) no-repeat scroll 0 50%;
}

.folder_birthday {
  background: url() no-repeat scroll 10px 50%;
}

.folder_no_new {
  background: url(http://2img.net/i/fa/prosilver/topic_read.gif) no-repeat scroll 10px 50%;
}

.folder_new {
  background: url(http://2img.net/i/fa/prosilver/topic_unread.gif) no-repeat scroll 10px 50%;
}

.folder_global {
  background: url(http://2img.net/i/fa/prosilver/announce_read.gif) no-repeat scroll 10px 50%;
}

.folder_global_new {
  background: url(http://2img.net/i/fa/prosilver/announce_unread.gif) no-repeat scroll 10px 50%;
}

.folder_announce {
  background: url(http://2img.net/i/fa/prosilver/announce_read.gif) no-repeat scroll 10px 50%;
}

.folder_announce_new {
  background: url(http://2img.net/i/fa/prosilver/announce_unread.gif) no-repeat scroll 10px 50%;
}

.folder_sticky {
  background: url(http://2img.net/i/fa/prosilver/sticky_read.gif) no-repeat scroll 10px 50%;
}

.folder_sticky_new {
  background: url(http://2img.net/i/fa/prosilver/sticky_unread.gif) no-repeat scroll 10px 50%;
}

.folder_locked {
  background: url(http://2img.net/i/fa/prosilver/topic_read_locked.gif) no-repeat scroll 10px 50%;
}

.folder_locked_new {
  background: url(http://2img.net/i/fa/prosilver/topic_unread_locked.gif) no-repeat scroll 10px 50%;
}

.folder_hot {
  background: url(http://2img.net/i/fa/prosilver/topic_read_hot.gif) no-repeat scroll 10px 50%;
}

.folder_hot_new {
  background: url(http://2img.net/i/fa/prosilver/topic_unread_hot.gif) no-repeat scroll 10px 50%;
}

.mobile_subtitle {
  color: #000;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  text-shadow: 0 -1px 0 rgba(255, 255, 255, 0.4);
  font-weight: bold;
  line-height: 1.3em;
}

.mobile_comment {
  font-size: 0.8em;
  color: #666;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  text-shadow: 0 -1px 0 rgba(255, 255, 255, 0.4);
  line-height: 1.3em;
}

.block {
  display: block;
}

.mobile_prev_button, .mobile_next_button {
  display: inline-block;
  position: absolute;
  height: 26px;
  -webkit-box-shadow: 0 1px 0 rgba(255,255,255, 0.25), inset 0 1px 1px rgba(0,0,0, 0.2);
  margin: 0;
  padding: 0 5px;
  border: 1px solid rgba(0,0,0, 0.4);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background: none #9fb3cc;
  background: -webkit-gradient(linear, left top, left bottom, from(#9fb3cc), to(#5b80ab), color-stop(0.5, #6b8bb2), color-stop(0.51, #597eaa));
  background: -moz-linear-gradient(top, #9fb3cc, #5b80ab);
  background: -ms-linear-gradient(top, #9fb3cc, #5b80ab);
/*background: -o-gradient(linear, left top, left bottom, from(#9fb3cc), to(#5b80ab), color-stop(0.5, #6b8bb2), color-stop(0.51, #597eaa));background: gradient(linear, left top, left bottom, from(#9fb3cc), to(#5b80ab), color-stop(0.5, #6b8bb2), color-stop(0.51, #597eaa));*/;
}

.mobile_prev_button p, .mobile_next_button p {
  color: #fff;
  font-size: 10px;
  font-weight: bold;
  line-height: 26px;
  margin: 0;
  text-align: center;
  text-shadow: 0 -1px 0 rgba(0,0,0, 0.4);
  z-index: 2;
}

.mobile_prev_button {
  left: 12px;
}

.mobile_next_button {
  right: 12px;
}

.mobile_prev_button p {
  padding: 0 0px 0 15px;
  background: url("http://2img.net/i/fa/mobile/inner-left-arrow.png") no-repeat scroll left center transparent;
}

.mobile_next_button p {
  padding: 0 15px 0 0px;
  background: url("http://2img.net/i/fa/mobile/inner-right-arrow.png") no-repeat scroll right center transparent;
}

.clear {
  clear: both;
  width: 1px;
  font-size: 1px;
  line-height: 1px;
}

blockquote {
  display: inline-block;
  background: none #e5e5e5;
  padding: 0.5em;
  position: relative;
  max-width: 96%;
  margin: 1em auto;
  border: 1px solid #000;
  -webkit-border-radius: 1em;
  -moz-border-radius: 1em;
  border-radius: 1em;
}

blockquote .quote_content {
  display: block;
  padding: 0 1em 1em;
}

blockquote cite {
  background: none white;
  float: left;
  padding: 0.5em;
  margin-bottom: 0.5em;
  -webkit-border-radius: 0.5em;
  -moz-border-radius: 0.5em;
  border-radius: 0.5em;
}

blockquote .open_quote {
  display: block;
  font-weight: bold;
  font-size: 2em;
  height: 0.5em;
  width: 0.5em;
}

blockquote .close_quote {
  display: block;
  height: 0;
  font-weight: bold;
  font-size: 2em;
  padding-bottom: 0.5em;
  position: absolute;
  right: 0.2em;
  bottom: 0;
}

.spoiler .spoiler_content {
  display: none;
}

.spoiler .spoiler_content.hidden {
  display: block;
}

.spoiler {
  display: block;
  background: none #e5e5e5;
  padding: 0.5em;
  position: relative;
  width: 96%;
  margin: 1em auto;
  border: 1px solid #000;
  -webkit-border-radius: 1em;
  -moz-border-radius: 1em;
  border-radius: 1em;
}

.spoiler_content {
  background: none white;
  margin-top: 0.5em;
  display: inline-block;
  padding: 0 1em;
  line-height: 1.3em;
  overflow: auto;
  -webkit-border-radius: 0.5em;
  -moz-border-radius: 0.5em;
  border-radius: 0.5em;
}

.spoiler_title {
  cursor: pointer;
  background: none white;
  padding: 0.5em;
  -webkit-border-radius: 0.5em;
  -moz-border-radius: 0.5em;
  border-radius: 0.5em;
}

.codebox {
  background-color: #e5e5e5;
  padding: 0.5em;
  border: 1px solid #000;
}

.codebox code {
  display: block;
  color: green;
  background-color: white;
  overflow: auto;
}

/* TEMP */
.post {
  padding: 0 0 1em;
  line-height: 1.3em;
  margin: 0;
  font-size: 0.8em;
  background: none #DBDBDD;
  background: -webkit-gradient(linear, left top, left bottom, from(#DBDBDD), to(#B4B4B8), color-stop(1, white));
  background: -moz-linear-gradient(top, #DBDBDD, #B4B4B8);
  background: -ms-linear-gradient(top, #DBDBDD, #B4B4B8);
/*background: -o-gradient(linear, left top, left bottom, from(#DBDBDD), to(#B4B4B8), color-stop(1, white));background: gradient(linear, left top, left bottom, from(#DBDBDD), to(#B4B4B8), color-stop(1, white));*/;
}

.postbody {
  position: relative;
}

.postbody:after {
  width: 50%;
  height: 1px;
  background-color: #fff;
  content: '\00a0';
  position: absolute;
  bottom: -0.5em;
  left: 25%;
  right: 25%;
}

.postbody .post_header {
  margin: 0;
  padding: 0.5em;
  color: #fff;
  font-size: 0.9em;
  background: none #347DEE;
  background: -webkit-gradient(linear, left top, left bottom, from(#347DEE), to(#24445C), color-stop(0.48, #489CDB), color-stop(0.5, #388CCB));
  background: -moz-linear-gradient(top, #347DEE, #24445C);
  background: -ms-linear-gradient(top, #347DEE, #24445C);
/*background: -o-gradient(linear, left top, left bottom, from(#347DEE), to(#24445C), color-stop(0.48, #489CDB), color-stop(0.5, #388CCB));background: gradient(linear, left top, left bottom, from(#347DEE), to(#24445C), color-stop(0.48, #489CDB), color-stop(0.5, #388CCB));*/;
}

.postbody .post_header a {
  color: #fff;
  vertical-align: text-top;
}

.postbody .post_header hr {
  margin: 0.5em 1em;
  height: 1px;
}

.postbody .content {
  position: relative;
  padding: 1em;
  -ms-word-break: break-all;
  word-break: break-all;
  word-break: break-word;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
}

.img_link {
  display: inline-block;
  padding: 0 0.5em;
  white-space: nowrap;
  height: 2.3em;
  font-weight: normal;
}

.img_link:before {
  content: '[';
  font-size: 2em;
  vertical-align: sub;
  line-height: 1em;
}

.img_link:after {
  content: ']';
  font-size: 2em;
  vertical-align: sub;
  line-height: 1em;
}

.application_footer_spacer {
  height: 3em;
}

#page-footer {
  color: #fff;
  padding: 0.5em;
  margin-top: -3em;
  position: relative;
  text-align: center;
  height: 2em;
  background: none #000;
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(black), color-stop(0.05, white), color-stop(0.3, #333), to(black));
  background: -moz-linear-gradient(top, #666, #000);
  background: -ms-linear-gradient(top, #666, #000);
/*background: -o-gradient(linear, 0% 0%, 0% 100%, from(black), color-stop(0.05, white), color-stop(0.3, #333), to(black));background: gradient(linear, 0% 0%, 0% 100%, from(black), color-stop(0.05, white), color-stop(0.3, #333), to(black));*/;
}

#page-footer a {
  color: #fff;
  display: block;
  line-height: 1.3em;
}

.small {
  font-size: 0.9em;
}

.poll {
  padding: 0.5em;
}

.poll .fieldset {
  border: 1px solid #000;
  padding: 0.5em;
}

.poll .legend {
  padding: 0 0 0.5em 0;
}

.poll dl {
  display: table;
  padding: 0 0 1em;
}

.poll dt, .poll dd {
  display: table-cell;
  padding: 0 1em;
}

.poll .table-row {
  display: table-row;
}

.poll .bold {
  font-weight: bold;
}

.attachbox {
  display: inline-block;
  border: 1px solid #000;
  margin-top: 2em;
  -webkit-border-radius: 1em;
  -moz-border-radius: 1em;
  border-radius: 1em;
}

.attachbox .title {
  background-color: #fff;
  display: inline-block;
  padding: 0.2em 0.5em;
  -webkit-border-bottom-right-radius: 1em;
  -webkit-border-top-left-radius: 1em;
  -moz-border-radius: 1em;
  border-bottom-right-radius: 1em;
  border-top-left-radius: 1em;
}

dl.attachments {
  padding: 0 0.5em 0.5em;
}

dl.attachments dt {
  padding-top: 0.5em;
}

.hiddenMsgTitle {
  font-size: 0.9em;
}

.hiddenMsgBody {
  display: none;
  padding-top: 2em;
}

/* NAVIGATION BAR */
div#mToggleContainer {
  float: right;
  margin: 0;
  padding: 0;
  height: 33px;
  margin-top: -2px;
  width: 30px;
  background-color: #333333;
  background-image: none;
  background-repeat: no-repeat;
  background-position: center center;
}

a#mToggleArrow {
  background-color: rgb(51, 51, 51);
  display: block;
  width: 30px;
  height: 33px;
  margin: 0;
  padding: 0;
  text-decoration: none;
  border: none;
}

a#mToggleArrow.hiddenBar {
  background-image: url('http://2img.net/i/fa/i/mobileNavbar/sprite.png');
  background-position: -160px 0;
}

a#mToggleArrow.shownBar {
  background-image: url('http://2img.net/i/fa/i/mobileNavbar/sprite.png');
  background-position: -192px 0;
}

ul#mNavbar {
  display: none;
  background-color: rgb(51, 51, 51);
  height: 50px;
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
}

ul#mNavbar li {
  display: inline-block;
  padding: 0 10px;
  height: 100%;
  min-width: 50px;
  text-align: center;
}

a.navElement {
  text-decoration: none;
  border: none;
  display: block;
}

a.navElement span.navBtnIcon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: transparent url('http://2img.net/i/fa/i/mobileNavbar/sprite.png') no-repeat -224px 0;
}

a.navElement span.navBtnLabel {
  display: inline-block;
  color: #FFFFFF;
  font-weight: bold;
  white-space: nowrap;
}

/* ACTION BAR */
#mobileActionBar {
  text-align: center;
  height: 30px;
  line-height: 30px;
  padding: 0;
  margin: 0;
  background-color: #333333;
  width: 100%;
  position: fixed;
  bottom: 0;
}

#mobileActionBar a.navbar {
  text-decoration: none;
  display: inline-block;
  height: 30px;
  line-height: 30px;
  margin: 0px;
  padding: 0px;
  color: #FFFFFF;
  white-space: nowrap;
}

#mobileActionBar .mobileActionLabel {
  background: transparent url('http://2img.net/i/fa/i/mobileNavbar/ico_page001.png') no-repeat scroll left center;
  display: inline-block;
  line-height: 30px;
  padding-left: 25px;
  font-size: 0.9em;
}

/* MISC */
.inputTxtContainer {
  margin: 20px 0 0 0;
  padding: 5px;
  border: 1px solid #616161;
  background-color: #FFFFFF;
}

.inputTxtContainer .inputTxt {
  color: #606060;
  border: none;
  display: block;
  min-width: 90%;
}

.defaultBtn {
  display: inline-block;
  background: #6586ae url('http://2img.net/i/fa/i/mobileNavbar/bg_btn001.png') repeat-x top left;
  color: #fff;
  border: 1px solid #374d67;
  border-radius: 3px;
  padding: 0 6px;
  height: 26px;
}

.message_die {
  width: 90%;
  padding-top: 20px;
  margin: 0 auto;
  font-size: 0.8em;
}

.message_title {
  font-weight: bold;
  text-align: center;
}

.message_text {
  padding: 16px 0;
  line-height: 1.3em;
  text-align: justify;
}

.message_text a {
  text-decoration: underline;
  font-weight: bold;
  color: #275271;
}

Ange Tuteur wrote:You can modify the mobile version style as you like, you just need to know the Classnames, or Ids of the elements. You can spoof your browser useragent and trick a website into thinking you're on a mobile device. This allows you to modify the style easily.

This is the CSS from the mobile version on my forum :

Code:

/* Version Mobile */
/* CSS Reset */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td, hr {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  text-decoration: none;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

/* remember to define focus styles! */
:focus {
  outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
  text-decoration: none;
}

del {
  text-decoration: line-through;
}

/* tables still need ‘cellspacing=”0?‘ in the markup */table {
  border-collapse: collapse;
  border-spacing: 0;
}

/*Fin CSS Reset */
html,body {
  height: 100%;
}

body {
  font-size: 16px;
  font-family: Helvetica, sans-serif;
}

#page-body {
  position: relative;
  min-height: 100%;
  background: none #c4c4c6;
}

.mobile_title {
  font-size: 0.9em;
  height: 29px;
  position: relative;
  padding: 2px 0;
  line-height: 12px;
  background: none #BECCDD;
  background: -webkit-gradient(linear, left top, left bottom, from(#BECCDD), to(#587397), color-stop(0.48, #8B9DB5), color-stop(0.5, #8195AF));
  background: -moz-linear-gradient(top, #BECCDD, #587397);
  background: -ms-linear-gradient(top, #BECCDD, #587397);
  background: linear-gradient(top, #BECCDD, #587397);
  border-top: 1px solid #D0D9E6;
  border-right: none;
  border-bottom: 1px solid #3F5C80;
  border-left: none;
}

.mobile_title.application_header {
  position: fixed;
  width: 100%;
  z-index: 100;
}

.application_header_spacer {
  height: 33px;
}

.mobile_title_content {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
  font-weight: bold;
  float: none;
  width: auto;
  position: absolute;
  left: 65px;
  right: 65px;
  text-align: center;
  line-height: 34px;
  color: #fff;
  top: 0px;
}

.mobile_set {
  height: 1em;
  padding: 0.5em;
  color: #fff;
  font-size: 0.9em;
  background: none #347DEE;
  background: -webkit-gradient(linear, left top, left bottom, from(#347DEE), to(#24445C), color-stop(0.48, #489CDB), color-stop(0.5, #388CCB));
  background: -moz-linear-gradient(top, #347DEE, #24445C);
  background: -ms-linear-gradient(top, #347DEE, #24445C);
/*background: -o-gradient(linear, left top, left bottom, from(#347DEE), to(#24445C), color-stop(0.48, #489CDB), color-stop(0.5, #388CCB));background: gradient(linear, left top, left bottom, from(#347DEE), to(#24445C), color-stop(0.48, #489CDB), color-stop(0.5, #388CCB));*/;
}

.mobile_set_content {
  float: left;
  width: 80%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
  font-weight: bold;
  line-height: 1.2em;
}

.mobile_item {
  margin: 0;
  border: 1px solid #EEEEEF;
  border-bottom-color: #9C9EA5;
  border-right: 0;
  border-left: 0;
  padding: 0.5em 0;
  font-size: 0.8em;
  background: none #DBDBDD;
  background: -webkit-gradient(linear, left top, left bottom, from(#DBDBDD), to(#B4B4B8), color-stop(1, white));
  background: -moz-linear-gradient(top, #DBDBDD, #B4B4B8);
  background: -ms-linear-gradient(top, #DBDBDD, #B4B4B8);
/*background: -o-gradient(linear, left top, left bottom, from(#DBDBDD), to(#B4B4B8), color-stop(1, white));background: gradient(linear, left top, left bottom, from(#DBDBDD), to(#B4B4B8), color-stop(1, white));*/;
}

.mobile_item:hover {
  background: none #DBDBDD;
  background: -webkit-gradient(linear, left top, left bottom, from(#DBDBDD), to(#FFFFFF), color-stop(0.5, white));
  background: -moz-linear-gradient(top, #DBDBDD, #FFFFFF);
  background: -ms-linear-gradient(top, #DBDBDD, #FFFFFF);
/*background: -o-gradient(linear, left top, left bottom, from(#DBDBDD), to(#FFFFFF), color-stop(0.5, white));background: gradient(linear, left top, left bottom, from(#DBDBDD), to(#FFFFFF), color-stop(0.5, white));*/;
}

.mobile_item_link_content {
  padding: 0 1em 0 45px;
  background: url(http://2img.net/i/fa/mobile/arrow_right.png) no-repeat scroll 100% 50%;
}

.forum_no_new {
  background: url(http://2img.net/i/fa/subsilver/folder_big.gif) no-repeat scroll 0 50%;
}

.forum_new {
  background: url(http://2img.net/i/fa/subsilver/folder_new_big.gif) no-repeat scroll 0 50%;
}

.forum_locked {
  background: url(http://2img.net/i/fa/subsilver/folder_locked_big.gif) no-repeat scroll 0 50%;
}

.cat_no_new {
  background: url(http://2img.net/i/fa/subsilver/category.gif) no-repeat scroll 0 50%;
}

.cat_new {
  background: url(http://2img.net/i/fa/subsilver/category_new.gif) no-repeat scroll 0 50%;
}

.cat_locked {
  background: url(http://2img.net/i/fa/subsilver/category_locked.gif) no-repeat scroll 0 50%;
}

.folder_birthday {
  background: url() no-repeat scroll 10px 50%;
}

.folder_no_new {
  background: url(http://2img.net/i/fa/prosilver/topic_read.gif) no-repeat scroll 10px 50%;
}

.folder_new {
  background: url(http://2img.net/i/fa/prosilver/topic_unread.gif) no-repeat scroll 10px 50%;
}

.folder_global {
  background: url(http://2img.net/i/fa/prosilver/announce_read.gif) no-repeat scroll 10px 50%;
}

.folder_global_new {
  background: url(http://2img.net/i/fa/prosilver/announce_unread.gif) no-repeat scroll 10px 50%;
}

.folder_announce {
  background: url(http://2img.net/i/fa/prosilver/announce_read.gif) no-repeat scroll 10px 50%;
}

.folder_announce_new {
  background: url(http://2img.net/i/fa/prosilver/announce_unread.gif) no-repeat scroll 10px 50%;
}

.folder_sticky {
  background: url(http://2img.net/i/fa/prosilver/sticky_read.gif) no-repeat scroll 10px 50%;
}

.folder_sticky_new {
  background: url(http://2img.net/i/fa/prosilver/sticky_unread.gif) no-repeat scroll 10px 50%;
}

.folder_locked {
  background: url(http://2img.net/i/fa/prosilver/topic_read_locked.gif) no-repeat scroll 10px 50%;
}

.folder_locked_new {
  background: url(http://2img.net/i/fa/prosilver/topic_unread_locked.gif) no-repeat scroll 10px 50%;
}

.folder_hot {
  background: url(http://2img.net/i/fa/prosilver/topic_read_hot.gif) no-repeat scroll 10px 50%;
}

.folder_hot_new {
  background: url(http://2img.net/i/fa/prosilver/topic_unread_hot.gif) no-repeat scroll 10px 50%;
}

.mobile_subtitle {
  color: #000;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  text-shadow: 0 -1px 0 rgba(255, 255, 255, 0.4);
  font-weight: bold;
  line-height: 1.3em;
}

.mobile_comment {
  font-size: 0.8em;
  color: #666;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  text-shadow: 0 -1px 0 rgba(255, 255, 255, 0.4);
  line-height: 1.3em;
}

.block {
  display: block;
}

.mobile_prev_button, .mobile_next_button {
  display: inline-block;
  position: absolute;
  height: 26px;
  -webkit-box-shadow: 0 1px 0 rgba(255,255,255, 0.25), inset 0 1px 1px rgba(0,0,0, 0.2);
  margin: 0;
  padding: 0 5px;
  border: 1px solid rgba(0,0,0, 0.4);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background: none #9fb3cc;
  background: -webkit-gradient(linear, left top, left bottom, from(#9fb3cc), to(#5b80ab), color-stop(0.5, #6b8bb2), color-stop(0.51, #597eaa));
  background: -moz-linear-gradient(top, #9fb3cc, #5b80ab);
  background: -ms-linear-gradient(top, #9fb3cc, #5b80ab);
/*background: -o-gradient(linear, left top, left bottom, from(#9fb3cc), to(#5b80ab), color-stop(0.5, #6b8bb2), color-stop(0.51, #597eaa));background: gradient(linear, left top, left bottom, from(#9fb3cc), to(#5b80ab), color-stop(0.5, #6b8bb2), color-stop(0.51, #597eaa));*/;
}

.mobile_prev_button p, .mobile_next_button p {
  color: #fff;
  font-size: 10px;
  font-weight: bold;
  line-height: 26px;
  margin: 0;
  text-align: center;
  text-shadow: 0 -1px 0 rgba(0,0,0, 0.4);
  z-index: 2;
}

.mobile_prev_button {
  left: 12px;
}

.mobile_next_button {
  right: 12px;
}

.mobile_prev_button p {
  padding: 0 0px 0 15px;
  background: url("http://2img.net/i/fa/mobile/inner-left-arrow.png") no-repeat scroll left center transparent;
}

.mobile_next_button p {
  padding: 0 15px 0 0px;
  background: url("http://2img.net/i/fa/mobile/inner-right-arrow.png") no-repeat scroll right center transparent;
}

.clear {
  clear: both;
  width: 1px;
  font-size: 1px;
  line-height: 1px;
}

blockquote {
  display: inline-block;
  background: none #e5e5e5;
  padding: 0.5em;
  position: relative;
  max-width: 96%;
  margin: 1em auto;
  border: 1px solid #000;
  -webkit-border-radius: 1em;
  -moz-border-radius: 1em;
  border-radius: 1em;
}

blockquote .quote_content {
  display: block;
  padding: 0 1em 1em;
}

blockquote cite {
  background: none white;
  float: left;
  padding: 0.5em;
  margin-bottom: 0.5em;
  -webkit-border-radius: 0.5em;
  -moz-border-radius: 0.5em;
  border-radius: 0.5em;
}

blockquote .open_quote {
  display: block;
  font-weight: bold;
  font-size: 2em;
  height: 0.5em;
  width: 0.5em;
}

blockquote .close_quote {
  display: block;
  height: 0;
  font-weight: bold;
  font-size: 2em;
  padding-bottom: 0.5em;
  position: absolute;
  right: 0.2em;
  bottom: 0;
}

.spoiler .spoiler_content {
  display: none;
}

.spoiler .spoiler_content.hidden {
  display: block;
}

.spoiler {
  display: block;
  background: none #e5e5e5;
  padding: 0.5em;
  position: relative;
  width: 96%;
  margin: 1em auto;
  border: 1px solid #000;
  -webkit-border-radius: 1em;
  -moz-border-radius: 1em;
  border-radius: 1em;
}

.spoiler_content {
  background: none white;
  margin-top: 0.5em;
  display: inline-block;
  padding: 0 1em;
  line-height: 1.3em;
  overflow: auto;
  -webkit-border-radius: 0.5em;
  -moz-border-radius: 0.5em;
  border-radius: 0.5em;
}

.spoiler_title {
  cursor: pointer;
  background: none white;
  padding: 0.5em;
  -webkit-border-radius: 0.5em;
  -moz-border-radius: 0.5em;
  border-radius: 0.5em;
}

.codebox {
  background-color: #e5e5e5;
  padding: 0.5em;
  border: 1px solid #000;
}

.codebox code {
  display: block;
  color: green;
  background-color: white;
  overflow: auto;
}

/* TEMP */
.post {
  padding: 0 0 1em;
  line-height: 1.3em;
  margin: 0;
  font-size: 0.8em;
  background: none #DBDBDD;
  background: -webkit-gradient(linear, left top, left bottom, from(#DBDBDD), to(#B4B4B8), color-stop(1, white));
  background: -moz-linear-gradient(top, #DBDBDD, #B4B4B8);
  background: -ms-linear-gradient(top, #DBDBDD, #B4B4B8);
/*background: -o-gradient(linear, left top, left bottom, from(#DBDBDD), to(#B4B4B8), color-stop(1, white));background: gradient(linear, left top, left bottom, from(#DBDBDD), to(#B4B4B8), color-stop(1, white));*/;
}

.postbody {
  position: relative;
}

.postbody:after {
  width: 50%;
  height: 1px;
  background-color: #fff;
  content: '\00a0';
  position: absolute;
  bottom: -0.5em;
  left: 25%;
  right: 25%;
}

.postbody .post_header {
  margin: 0;
  padding: 0.5em;
  color: #fff;
  font-size: 0.9em;
  background: none #347DEE;
  background: -webkit-gradient(linear, left top, left bottom, from(#347DEE), to(#24445C), color-stop(0.48, #489CDB), color-stop(0.5, #388CCB));
  background: -moz-linear-gradient(top, #347DEE, #24445C);
  background: -ms-linear-gradient(top, #347DEE, #24445C);
/*background: -o-gradient(linear, left top, left bottom, from(#347DEE), to(#24445C), color-stop(0.48, #489CDB), color-stop(0.5, #388CCB));background: gradient(linear, left top, left bottom, from(#347DEE), to(#24445C), color-stop(0.48, #489CDB), color-stop(0.5, #388CCB));*/;
}

.postbody .post_header a {
  color: #fff;
  vertical-align: text-top;
}

.postbody .post_header hr {
  margin: 0.5em 1em;
  height: 1px;
}

.postbody .content {
  position: relative;
  padding: 1em;
  -ms-word-break: break-all;
  word-break: break-all;
  word-break: break-word;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
}

.img_link {
  display: inline-block;
  padding: 0 0.5em;
  white-space: nowrap;
  height: 2.3em;
  font-weight: normal;
}

.img_link:before {
  content: '[';
  font-size: 2em;
  vertical-align: sub;
  line-height: 1em;
}

.img_link:after {
  content: ']';
  font-size: 2em;
  vertical-align: sub;
  line-height: 1em;
}

.application_footer_spacer {
  height: 3em;
}

#page-footer {
  color: #fff;
  padding: 0.5em;
  margin-top: -3em;
  position: relative;
  text-align: center;
  height: 2em;
  background: none #000;
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(black), color-stop(0.05, white), color-stop(0.3, #333), to(black));
  background: -moz-linear-gradient(top, #666, #000);
  background: -ms-linear-gradient(top, #666, #000);
/*background: -o-gradient(linear, 0% 0%, 0% 100%, from(black), color-stop(0.05, white), color-stop(0.3, #333), to(black));background: gradient(linear, 0% 0%, 0% 100%, from(black), color-stop(0.05, white), color-stop(0.3, #333), to(black));*/;
}

#page-footer a {
  color: #fff;
  display: block;
  line-height: 1.3em;
}

.small {
  font-size: 0.9em;
}

.poll {
  padding: 0.5em;
}

.poll .fieldset {
  border: 1px solid #000;
  padding: 0.5em;
}

.poll .legend {
  padding: 0 0 0.5em 0;
}

.poll dl {
  display: table;
  padding: 0 0 1em;
}

.poll dt, .poll dd {
  display: table-cell;
  padding: 0 1em;
}

.poll .table-row {
  display: table-row;
}

.poll .bold {
  font-weight: bold;
}

.attachbox {
  display: inline-block;
  border: 1px solid #000;
  margin-top: 2em;
  -webkit-border-radius: 1em;
  -moz-border-radius: 1em;
  border-radius: 1em;
}

.attachbox .title {
  background-color: #fff;
  display: inline-block;
  padding: 0.2em 0.5em;
  -webkit-border-bottom-right-radius: 1em;
  -webkit-border-top-left-radius: 1em;
  -moz-border-radius: 1em;
  border-bottom-right-radius: 1em;
  border-top-left-radius: 1em;
}

dl.attachments {
  padding: 0 0.5em 0.5em;
}

dl.attachments dt {
  padding-top: 0.5em;
}

.hiddenMsgTitle {
  font-size: 0.9em;
}

.hiddenMsgBody {
  display: none;
  padding-top: 2em;
}

/* NAVIGATION BAR */
div#mToggleContainer {
  float: right;
  margin: 0;
  padding: 0;
  height: 33px;
  margin-top: -2px;
  width: 30px;
  background-color: #333333;
  background-image: none;
  background-repeat: no-repeat;
  background-position: center center;
}

a#mToggleArrow {
  background-color: rgb(51, 51, 51);
  display: block;
  width: 30px;
  height: 33px;
  margin: 0;
  padding: 0;
  text-decoration: none;
  border: none;
}

a#mToggleArrow.hiddenBar {
  background-image: url('http://2img.net/i/fa/i/mobileNavbar/sprite.png');
  background-position: -160px 0;
}

a#mToggleArrow.shownBar {
  background-image: url('http://2img.net/i/fa/i/mobileNavbar/sprite.png');
  background-position: -192px 0;
}

ul#mNavbar {
  display: none;
  background-color: rgb(51, 51, 51);
  height: 50px;
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
}

ul#mNavbar li {
  display: inline-block;
  padding: 0 10px;
  height: 100%;
  min-width: 50px;
  text-align: center;
}

a.navElement {
  text-decoration: none;
  border: none;
  display: block;
}

a.navElement span.navBtnIcon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: transparent url('http://2img.net/i/fa/i/mobileNavbar/sprite.png') no-repeat -224px 0;
}

a.navElement span.navBtnLabel {
  display: inline-block;
  color: #FFFFFF;
  font-weight: bold;
  white-space: nowrap;
}

/* ACTION BAR */
#mobileActionBar {
  text-align: center;
  height: 30px;
  line-height: 30px;
  padding: 0;
  margin: 0;
  background-color: #333333;
  width: 100%;
  position: fixed;
  bottom: 0;
}

#mobileActionBar a.navbar {
  text-decoration: none;
  display: inline-block;
  height: 30px;
  line-height: 30px;
  margin: 0px;
  padding: 0px;
  color: #FFFFFF;
  white-space: nowrap;
}

#mobileActionBar .mobileActionLabel {
  background: transparent url('http://2img.net/i/fa/i/mobileNavbar/ico_page001.png') no-repeat scroll left center;
  display: inline-block;
  line-height: 30px;
  padding-left: 25px;
  font-size: 0.9em;
}

/* MISC */
.inputTxtContainer {
  margin: 20px 0 0 0;
  padding: 5px;
  border: 1px solid #616161;
  background-color: #FFFFFF;
}

.inputTxtContainer .inputTxt {
  color: #606060;
  border: none;
  display: block;
  min-width: 90%;
}

.defaultBtn {
  display: inline-block;
  background: #6586ae url('http://2img.net/i/fa/i/mobileNavbar/bg_btn001.png') repeat-x top left;
  color: #fff;
  border: 1px solid #374d67;
  border-radius: 3px;
  padding: 0 6px;
  height: 26px;
}

.message_die {
  width: 90%;
  padding-top: 20px;
  margin: 0 auto;
  font-size: 0.8em;
}

.message_title {
  font-weight: bold;
  text-align: center;
}

.message_text {
  padding: 16px 0;
  line-height: 1.3em;
  text-align: justify;
}

.message_text a {
  text-decoration: underline;
  font-weight: bold;
  color: #275271;
}

sorry to post here i know its not my topic but i have thing to ask
how can i get my forum mobile CSS like that and when i like to make some changes how it will be
thank you

Use Chrome to inspect the element after changing the user agent.  You don't need special software just chrome on a desktop.  Here are some tips..

http://www.technipages.com/google-chrome-change-user-agent-string

Firefox has no emulation so it takes a little more work.

Address bar > Type about:config > create new string > write general.useragent.override > insert a useragent

Good list of useragents : http://www.useragentstring.com/pages/useragentstring.php

Is this solved for you ?

Michael_vx wrote:sorry to post here i know its not my topic but i have thing to ask
how can i get my forum mobile CSS like that and when i like to make some changes how it will be
thank you

That should* be the complete default mobile CSS. I can't guarantee it comepletely since I did just pull it from the file on my forum. I didn't modify my mobile version though.

Solved!  Thanks so much

You're welcome

Topic archived

Have a nice day.