[Summary view] [Print] [Text view]

   1  /*
   2  Theme Name: Twenty Eleven
   3  
   4  Adding support for language written in a Right To Left (RTL) direction is easy -
   5  it's just a matter of overwriting all the horizontal positioning attributes
   6  of your CSS stylesheet in a separate stylesheet file named rtl.css.
   7  
   8  https://codex.wordpress.org/Right_to_Left_Language_Support
   9  
  10  */
  11  
  12  /* =Reset reset
  13  ----------------------------------------------- */
  14  
  15  caption, th, td {
  16      text-align: right;
  17  }
  18  
  19  /* =Structure
  20  ----------------------------------------------- */
  21  
  22  body {
  23      direction:rtl;
  24      unicode-bidi:embed;
  25  }
  26  
  27  /* Showcase */
  28  .page-template-showcase-php section.recent-posts {
  29      float: left;
  30      margin: 0 31% 0 0;
  31  }
  32  .page-template-showcase-php #main .widget-area {
  33      float: right;
  34      margin: 0 0 0 -22.15%;
  35  }
  36  
  37  /* One column */
  38  
  39  .one-column article.feature-image.small .entry-summary a {
  40      left: auto;
  41      right: -9%;
  42  }
  43  
  44  /* Simplify the pullquotes and pull styles */
  45  .one-column.singular .entry-meta .edit-link a {
  46      right: 0;
  47      left: auto;
  48  }
  49  /* Make sure we have room for our comment avatars */
  50  .one-column .commentlist > li.comment {
  51      margin-left: 0;
  52      margin-right: 102px;
  53  }
  54  /* Make sure the logo and search form don't collide */
  55  .one-column #branding #searchform {
  56      right: auto;
  57      left: 40px;
  58  }
  59  /* Talking avatars take up too much room at this size */
  60  .one-column .commentlist > li.comment {
  61      margin-right: 0;
  62  }
  63  .one-column .commentlist > li.comment .comment-meta,
  64  .one-column .commentlist > li.comment .comment-content {
  65      margin-right: 0;
  66      margin-left: 85px;
  67  }
  68  .one-column .commentlist .avatar {
  69      right: auto;
  70      left: 1.625em;
  71  }
  72  .one-column .commentlist .children .avatar {
  73      left: auto;
  74      right: 2.2em;
  75  }
  76  
  77  /* =Global
  78  ----------------------------------------------- */
  79  
  80  /* Text elements */
  81  p {
  82      margin-bottom: 1.625em;
  83  }
  84  ul, ol {
  85      margin: 0 2.5em 1.625em 0;
  86  }
  87  .ltr ul, .ltr ol {
  88      margin: 0 0 1.625em 2.5em;
  89  }
  90  blockquote {
  91      font-family: Arial, sans-serif;
  92  }
  93  blockquote em, blockquote i, blockquote cite {
  94      font-style: normal;
  95  }
  96  
  97  /* Forms */
  98  textarea {
  99      padding-left: 0;
 100      padding-right: 3px;
 101  }
 102  input#s {
 103      background-position: 97% 6px;
 104      padding: 4px 28px 4px 10px;
 105  }
 106  #respond #wp-comment-cookies-consent {
 107      margin: 0 0 0 10px;
 108  }
 109  
 110  /* Assistive text */
 111  a.assistive-text:focus {
 112      left: auto;
 113      right: 6px;
 114  }
 115  
 116  /* =Header
 117  ----------------------------------------------- */
 118  
 119  #site-title {
 120      margin-right: 0;
 121      margin-left: 270px;
 122  }
 123  
 124  #site-description {
 125      margin: 0 0 3.65625em 270px;
 126  }
 127  
 128  /* =Menu
 129  -------------------------------------------------------------- */
 130  
 131  #access {
 132      float: right;
 133  }
 134  #access ul {
 135      margin: 0 -0.8125em 0 0;
 136      padding-right: 0;
 137  }
 138  #access li {
 139      float: right;
 140  }
 141  #access ul ul {
 142      float: right;
 143      left: auto;
 144      right: 0;
 145  }
 146  #access ul ul ul {
 147      left: auto;
 148      right: 100%;
 149  }
 150  
 151  /* Search Form */
 152  #branding #searchform {
 153      right: auto;
 154      left: 7.6%;
 155      text-align: left;
 156  }
 157  #branding #s {
 158      float: left;
 159  }
 160  #branding .only-search + #access div {
 161      padding-right: 0;
 162      padding-left: 205px;
 163  }
 164  
 165  
 166  /* =Content
 167  ----------------------------------------------- */
 168  .entry-title,
 169  .entry-header .entry-meta {
 170      padding-right: 0;
 171      padding-left: 76px;
 172  }
 173  .entry-content td,
 174  .comment-content td {
 175      padding: 6px 0 6px 10px;
 176  }
 177  .page-link span {
 178      margin-right: 0;
 179      margin-left: 6px;
 180  }
 181  .entry-meta .edit-link a {
 182      float: left;
 183  }
 184  /* Images */
 185  
 186  .wp-caption .wp-caption-text,
 187  .gallery-caption {
 188      font-family: Arial, sans-serif;
 189  }
 190  .wp-caption .wp-caption-text {
 191      padding: 10px 40px 5px 0;
 192  }
 193  .wp-caption .wp-caption-text:before {
 194      margin-right: 0;
 195      margin-left: 5px;
 196      left: auto;
 197      right: 10px;
 198  }
 199  #content .gallery-columns-4 .gallery-item {
 200      padding-right:0;
 201      padding-left:2%;
 202  }
 203  
 204  /* Author Info */
 205  .singular #author-info {
 206      margin: 2.2em -35.4% 0 -35.6%;
 207  }
 208  #author-avatar {
 209      float: right;
 210      margin-right: 0;
 211      margin-left: -78px;
 212  }
 213  #author-description {
 214      float: right;
 215      margin-left: 0;
 216      margin-right: 108px;
 217  }
 218  /* Comments link */
 219  .entry-header .comments-link a {
 220      background-image: url(images/comment-bubble-rtl.png);
 221      right: auto;
 222      left: 0;
 223  }
 224  
 225  /*
 226      Post Formats Headings
 227  */
 228  .singular .entry-title,
 229  .singular .entry-header .entry-meta {
 230      padding-left: 0;
 231  }
 232  .singular .entry-meta .edit-link a {
 233      left: auto;
 234      right: 50px;
 235  }
 236  
 237  
 238  /* =Gallery
 239  ----------------------------------------------- */
 240  
 241  .format-gallery .gallery-thumb {
 242      float: right;
 243      margin: .375em 0 0 1.625em;
 244  }
 245  
 246  
 247  /* =Status
 248  ----------------------------------------------- */
 249  
 250  .format-status img.avatar {
 251      float: right;
 252      margin: 4px 0 2px 10px;
 253  }
 254  
 255  
 256  /* =Image
 257  ----------------------------------------------- */
 258  
 259  .indexed.format-image div.entry-meta {
 260      float: right;
 261  }
 262  /* =error404
 263  ----------------------
 264  ------------------------- */
 265  .error404 #main .widget {
 266      float: right;
 267      margin-right: auto;
 268      margin-left: 3.7%;
 269  }
 270  .error404 #main .widget_archive {
 271      margin-left: 0;
 272  }
 273  .error404 #main .widget_tag_cloud {
 274      margin-left: 0;
 275  }
 276  
 277  /* =Showcase
 278  ----------------------------------------------- */
 279  
 280  article.intro .edit-link a {
 281      right: auto;
 282      left: 20px;
 283  }
 284  
 285  /* Featured post */
 286  section.featured-post {
 287      float: right;
 288  }
 289  
 290  /* Small featured post */
 291  section.featured-post .attachment-small-feature {
 292      float: left;
 293      margin: 0 0 1.625em -8.9%;
 294      right: auto;
 295      left: -15px;
 296  }
 297  article.feature-image.small {
 298      float: right;
 299  }
 300  article.feature-image.small .entry-summary p a {
 301      left:auto;
 302      right: -23.8%;
 303      padding: 9px 85px 9px 26px;
 304  }
 305  
 306  /* Large featured post */
 307  section.feature-image.large .hentry {
 308      left:auto;
 309      right: 9%;
 310      margin: 1.625em 0 0 9%;
 311  }
 312  /* Featured Slider */
 313  .featured-posts .showcase-heading {
 314      padding-left: 0;
 315      padding-right: 8.9%;
 316  }
 317  .featured-posts section.featured-post {
 318      left: auto;
 319      right: 0;
 320  }
 321  #content .feature-slider {
 322      right: auto;
 323      left: 8.9%;
 324  }
 325  .feature-slider li {
 326      float: right;
 327  }
 328  /* Recent Posts */
 329  section.recent-posts .other-recent-posts a[rel="bookmark"] {
 330      float: right;
 331  }
 332  section.recent-posts .other-recent-posts .comments-link a,
 333  section.recent-posts .other-recent-posts .comments-link > span {
 334      padding: 0.3125em 1em 0.3125em 0;
 335      right: auto;
 336      left: 0;
 337      text-align: left;
 338  }
 339  
 340  /* =Attachments
 341  ----------------------------------------------- */
 342  
 343  /* =Navigation
 344  -------------------------------------------------------------- */
 345  
 346  .nav-previous {
 347      float: right;
 348  }
 349  .nav-next {
 350      float: left;
 351      text-align: left;
 352  }
 353  
 354  /* Singular navigation */
 355  #nav-single .nav-next {
 356      padding-left: 0;
 357      padding-right: .5em;
 358  }
 359  
 360  
 361  /* =Widgets
 362  ----------------------------------------------- */
 363  
 364  .widget ul ul {
 365      margin-left: 0;
 366      margin-right: 1.5em;
 367  }
 368  
 369  /* Twitter */
 370  .widget_twitter .timesince {
 371      margin-right: 0;
 372      margin-left: -10px;
 373      text-align: left;
 374  }
 375  .widget_text ul,
 376  .widget_text ol {
 377      margin: 0 2.5em 1.625em 0;
 378  }
 379  
 380  /* =Comments
 381  ----------------------------------------------- */
 382  
 383  .commentlist .children li.comment {
 384      border-left: none;
 385      border-right: 1px solid #ddd;
 386      -moz-border-radius: 3px 0 0 3px;
 387      border-radius: 3px 0 0 3px;
 388  }
 389  .commentlist .children li.comment .comment-meta {
 390      margin-left: 0;
 391      margin-right: 50px;
 392  }
 393  .commentlist .avatar {
 394      left: auto;
 395      right: -102px;
 396  }
 397  .commentlist > li:before {
 398      content: url(images/comment-arrow-rtl.png);
 399      left:auto;
 400      right: -21px;
 401  }
 402  .commentlist > li.pingback:before {
 403      content: '';
 404  }
 405  .commentlist .children .avatar {
 406      left: auto;
 407      right: 2.2em;
 408  }
 409  
 410  /* Post author highlighting */
 411  .commentlist > li.bypostauthor:before {
 412      content: url(images/comment-arrow-bypostauthor-rtl.png);
 413  }
 414  
 415  /* sidebar-page.php comments */
 416  /* Make sure we have room for our comment avatars */
 417  .page-template-sidebar-page-php .commentlist > li.comment,
 418  .page-template-sidebar-page-php.commentlist .pingback {
 419      margin-left: 0;
 420      margin-right: 102px;
 421  }
 422  
 423  /* Comment Form */
 424  #respond .comment-form-author label,
 425  #respond .comment-form-email label,
 426  #respond .comment-form-url label,
 427  #respond .comment-form-comment label {
 428      left: auto;
 429      right: 4px;
 430  }
 431  #respond .comment-form-author label,
 432  #respond .comment-form-email label,
 433  #respond .comment-form-url label,
 434  #respond .comment-form-comment label {
 435      -webkit-box-shadow: -1px 2px 2px rgba(204,204,204,0.8);
 436      -moz-box-shadow: -1px 2px 2px rgba(204,204,204,0.8);
 437      box-shadow: -1px 2px 2px rgba(204,204,204,0.8);
 438  }
 439  #respond .comment-form-author .required,
 440  #respond .comment-form-email .required,
 441  #respond .comment-form-url .required,
 442  #respond .comment-form-comment .required {
 443      float: left;
 444      margin-left: 0;
 445      margin-right: 4px;
 446  }
 447  #respond .form-submit {
 448      float: left;
 449  }
 450  #respond input#submit {
 451      left: auto;
 452      right: 30px;
 453      padding: 5px 22px 5px 42px;
 454  }
 455  #respond #cancel-comment-reply-link {
 456      margin-left: 0;
 457      margin-right: 10px;
 458  }
 459  #cancel-comment-reply-link {
 460      right: auto;
 461      left: 1.625em;
 462  }
 463  
 464  /* =Footer
 465  ----------------------------------------------- */
 466  
 467  /* Two Footer Widget Areas */
 468  #supplementary.two .widget-area {
 469      float: right;
 470      margin-right: 0;
 471      margin-left: 3.7%;
 472  }
 473  #supplementary.two .widget-area + .widget-area {
 474      margin-left: 0;
 475  }
 476  
 477  /* Three Footer Widget Areas */
 478  #supplementary.three .widget-area {
 479      float: right;
 480      margin-right: 0;
 481      margin-left: 3.7%;
 482  }
 483  #supplementary.three .widget-area + .widget-area + .widget-area {
 484      margin-left: 0;
 485  }
 486  
 487  /* Site Generator Line */
 488  #site-generator .sep {
 489      background-position: right center;
 490  }
 491  
 492  
 493  /* =Responsive Structure
 494  ----------------------------------------------- */
 495  
 496  @media (max-width: 800px) {
 497      /* Simplify the showcase template when small feature */
 498      section.featured-post .attachment-small-feature,
 499      .one-column section.featured-post .attachment-small-feature {
 500          float: right;
 501      }
 502      article.feature-image.small {
 503          float: left;
 504      }
 505      article.feature-image.small .entry-summary p a {
 506          right: 0;
 507      }
 508      .singular .entry-meta .edit-link a {
 509          left: auto;
 510          right: 0;
 511      }
 512      .singular #author-info {
 513          margin: 2.2em -8.8% 0;
 514      }
 515      /* Make sure we have room for our comment avatars */
 516      .commentlist > li.comment,
 517      .commentlist .pingback {
 518          margin-left: 0;
 519          margin-right: 102px;
 520      }
 521      /* No need to float footer widgets at this size */
 522      #colophon #supplementary .widget-area {
 523          margin-left: 0;
 524      }
 525      /* No need to float 404 widgets at this size */
 526      .error404 #main .widget {
 527          margin-left: 0;
 528      }
 529  }
 530  @media (max-width: 650px) {
 531      /* @media (max-width: 650px) Reduce font-sizes for better readability on smaller devices */
 532      #site-title,
 533      #site-description {
 534          margin-left: 0;
 535      }
 536      /* Talking avatars take up too much room at this size */
 537      .commentlist > li.comment,
 538      .commentlist > li.pingback {
 539          margin-right: 0 !important;
 540      }
 541      .commentlist .children .avatar {
 542          left: auto;
 543          right: 2.2em;
 544      }
 545      #content .gallery-columns-3 .gallery-item {
 546          padding-right: 0;
 547          padding-left:2%;
 548      }
 549  }
 550  @media (max-width: 450px) {
 551      #content .gallery-columns-2 .gallery-item {
 552          padding-right:0;
 553          padding-left:4%;
 554      }
 555  }
 556  
 557  /* =Print
 558  ----------------------------------------------- */
 559  
 560  @media print {
 561      #primary {
 562          float: right;
 563      }
 564      /* Comments */
 565      .commentlist .avatar {
 566          left: auto;
 567          right: 2.2em;
 568      }
 569      .commentlist li.comment .comment-meta {
 570          margin-left: 0;
 571          margin-right: 50px;
 572      }
 573  }
 574  
 575  /* =IE7
 576  ----------------------------------------------- */
 577  
 578  #ie7 section.recent-posts {
 579      margin-right: 0;
 580      margin-left: 7.6%;
 581  }