rtl.css 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756
  1. /*
  2. Theme Name: Twenty Sixteen
  3. Description: Adds support for languages written in a Right To Left (RTL) direction.
  4. It's easy, just a matter of overwriting all the horizontal positioning attributes
  5. of your CSS stylesheet in a separate stylesheet file named rtl.css.
  6. See: https://codex.wordpress.org/Right_to_Left_Language_Support
  7. */
  8. /**
  9. * Table of Contents:
  10. *
  11. * 1.0 - Normalize
  12. * 2.0 - Typography
  13. * 3.0 - Elements
  14. * 4.0 - Forms
  15. * 5.0 - Navigations
  16. * 6.0 - Accessibility
  17. * 7.0 - Widgets
  18. * 8.0 - Content
  19. * 8.1 - Header
  20. * 8.2 - Posts and pages
  21. * 8.3 - Comments
  22. * 8.4 - Footer
  23. * 9.0 - Multisites
  24. * 10.0 - Media Queries
  25. * 10.1 - >= 710px
  26. * 10.2 - >= 910px
  27. * 10.3 - >= 985px
  28. * 10.4 - >= 1200px
  29. */
  30. /**
  31. * 1.0 - Normalize
  32. */
  33. body {
  34. direction: rtl;
  35. unicode-bidi: embed;
  36. }
  37. input[type="checkbox"],
  38. input[type="radio"] {
  39. margin-right: auto;
  40. margin-left: 0.4375em;
  41. }
  42. /**
  43. * 2.0 - Typography
  44. */
  45. body,
  46. button,
  47. button[disabled]:hover,
  48. button[disabled]:focus,
  49. input[type="button"],
  50. input[type="button"][disabled]:hover,
  51. input[type="button"][disabled]:focus,
  52. input[type="reset"],
  53. input[type="reset"][disabled]:hover,
  54. input[type="reset"][disabled]:focus,
  55. input[type="submit"],
  56. input[type="submit"][disabled]:hover,
  57. input[type="submit"][disabled]:focus,
  58. input,
  59. select,
  60. textarea,
  61. .post-password-form label,
  62. .main-navigation,
  63. .post-navigation,
  64. .post-navigation .post-title,
  65. .pagination,
  66. .image-navigation,
  67. .comment-navigation,
  68. .site .skip-link,
  69. .logged-in .site .skip-link,
  70. .widget .widget-title,
  71. .widget_recent_entries .post-date,
  72. .widget_rss .rss-date,
  73. .widget_rss cite,
  74. .tagcloud a,
  75. .site-title,
  76. .entry-title,
  77. .entry-footer,
  78. .sticky-post,
  79. .page-title,
  80. .page-links,
  81. .comments-title,
  82. .comment-reply-title,
  83. .comment-metadata,
  84. .pingback .edit-link,
  85. .comment-reply-link,
  86. .comment-form label,
  87. .no-comments,
  88. .required,
  89. .site-footer .site-title,
  90. .site-footer .site-title:after,
  91. .widecolumn label,
  92. .widecolumn .mu_register label,
  93. .site-footer span[role=separator] {
  94. font-family: Arial, Tahoma, sans-serif;
  95. }
  96. ::-webkit-input-placeholder {
  97. font-family: Arial, Tahoma, sans-serif;
  98. }
  99. :-moz-placeholder {
  100. font-family: Arial, Tahoma, sans-serif;
  101. }
  102. ::-moz-placeholder {
  103. font-family: Arial, Tahoma, sans-serif;
  104. }
  105. :-ms-input-placeholder {
  106. font-family: Arial, Tahoma, sans-serif;
  107. }
  108. blockquote {
  109. border-right-width: 4px;
  110. border-left-width: 0;
  111. padding-right: 1.263157895em;
  112. padding-left: 0;
  113. }
  114. .entry-content h1,
  115. .entry-content h2,
  116. .entry-content h3,
  117. .entry-content h4,
  118. .entry-content h5,
  119. .entry-content h6,
  120. .entry-summary h1,
  121. .entry-summary h2,
  122. .entry-summary h3,
  123. .entry-summary h4,
  124. .entry-summary h5,
  125. .entry-summary h6,
  126. .comment-content h1,
  127. .comment-content h2,
  128. .comment-content h3,
  129. .comment-content h4,
  130. .comment-content h5,
  131. .comment-content h6,
  132. .textwidget h1,
  133. .textwidget h2,
  134. .textwidget h3,
  135. .textwidget h4,
  136. .textwidget h5,
  137. .textwidget h6,
  138. .entry-content .author-title,
  139. .widget_calendar caption,
  140. .widecolumn h2 {
  141. font-weight: 700;
  142. }
  143. /**
  144. * 3.0 - Elements
  145. */
  146. ul,
  147. ol {
  148. margin: 0 1.25em 1.75em 0;
  149. }
  150. ol {
  151. margin-right: 1.5em;
  152. margin-left: 0;
  153. }
  154. caption,
  155. th,
  156. td {
  157. text-align: right;
  158. }
  159. /**
  160. * 4.0 - Forms
  161. */
  162. input[type="search"].search-field {
  163. border-radius: 0 2px 2px 0;
  164. }
  165. .search-submit:before {
  166. left: 1px;
  167. }
  168. .search-submit {
  169. border-radius: 2px 0 0 2px;
  170. left: 0;
  171. right: auto;
  172. }
  173. /**
  174. * 5.0 - Navigation
  175. */
  176. .main-navigation ul ul {
  177. margin-right: 0.875em;
  178. margin-left: auto;
  179. }
  180. .main-navigation .menu-item-has-children > a {
  181. margin-right: auto;
  182. margin-left: 56px;
  183. }
  184. .dropdown-toggle {
  185. left: 0;
  186. right: auto;
  187. }
  188. .dropdown-toggle:after {
  189. border-right-width: 1px;
  190. border-left-width: 0;
  191. left: auto;
  192. right: 1px;
  193. }
  194. .social-navigation li {
  195. float: right;
  196. margin: 0 0 0.4375em 0.4375em;
  197. }
  198. .pagination:before {
  199. left: 0;
  200. right: auto;
  201. }
  202. .pagination:after {
  203. left: 54px;
  204. right: auto;
  205. }
  206. .pagination .nav-links {
  207. padding-right: 0;
  208. padding-left: 106px;
  209. }
  210. .pagination .nav-links:before {
  211. content: "\f430";
  212. left: -1px;
  213. right: auto;
  214. }
  215. .pagination .nav-links:after {
  216. content: "\f429";
  217. left: 55px;
  218. right: auto;
  219. }
  220. .pagination .page-numbers {
  221. margin: 0 -0.7368421053em 0 0.7368421053em;
  222. }
  223. .pagination .prev,
  224. .pagination .next {
  225. margin: 0;
  226. }
  227. .pagination .prev {
  228. left: 54px;
  229. right: auto;
  230. }
  231. .pagination .prev:before {
  232. content: "\f429";
  233. left: auto;
  234. right: -1px;
  235. }
  236. .pagination .next {
  237. left: 0;
  238. right: auto;
  239. }
  240. .pagination .next:before {
  241. content: "\f430";
  242. left: -1px;
  243. right: auto;
  244. }
  245. .comment-navigation {
  246. margin-right: 0;
  247. margin-left: 0;
  248. }
  249. /**
  250. * 6.0 - Accessibility
  251. */
  252. .site .skip-link {
  253. left: auto;
  254. right: -9999em;
  255. }
  256. .site .skip-link:focus {
  257. left: auto;
  258. right: 6px;
  259. }
  260. /**
  261. * 7.0 - Widgets
  262. */
  263. .tagcloud a {
  264. margin-right: 0;
  265. margin-left: 0.1875em;
  266. }
  267. .tagcloud ul {
  268. margin-right: 0;
  269. }
  270. /**
  271. * 8.0 - Content
  272. */
  273. /**
  274. * 8.1 - Header
  275. */
  276. .site-branding {
  277. margin-right: 0;
  278. margin-left: auto;
  279. }
  280. /**
  281. * 8.2 - Posts and pages
  282. */
  283. .author-avatar .avatar {
  284. float: right;
  285. margin-right: 0;
  286. margin-left: 1.75em;
  287. }
  288. .entry-footer .avatar {
  289. margin-right: 0;
  290. margin-left: 0.5384615385em;
  291. }
  292. .page-links a,
  293. .page-links > span {
  294. margin-right: auto;
  295. margin-left: 0.3076923077em;
  296. }
  297. .page-links > .page-links-title {
  298. padding-right: 0;
  299. padding-left: 0.6153846154em;
  300. }
  301. body:not(.search-results) .entry-summary .alignright {
  302. margin: 0.2631578947em 0 1.4736842105em 1.4736842105em;
  303. }
  304. body:not(.search-results) .entry-summary .alignleft {
  305. margin: 0.2631578947em 1.4736842105em 1.4736842105em 0;
  306. }
  307. /**
  308. * 8.3 - Comments
  309. */
  310. .comment-list .children > li {
  311. padding-right: 0.875em;
  312. padding-left: 0;
  313. }
  314. .comment-author .avatar {
  315. float: right;
  316. margin-right: auto;
  317. margin-left: 0.875em;
  318. }
  319. .bypostauthor > article .fn:after {
  320. left: auto;
  321. right: 3px;
  322. }
  323. .comment-content ul,
  324. .comment-content ol {
  325. margin: 0 1.25em 1.5em 0;
  326. }
  327. .comment-reply-title small a {
  328. float: left;
  329. }
  330. .comment-form #wp-comment-cookies-consent {
  331. margin: 0 0 0 10px;
  332. }
  333. .comment-form .comment-form-cookies-consent label {
  334. font-family: Arial, Tahoma, sans-serif;
  335. }
  336. /**
  337. * 9.0 - Multisites
  338. */
  339. .widecolumn .mu_register label {
  340. margin-right: 0;
  341. margin-left: 0.7692307692em;
  342. }
  343. /**
  344. * 10.0 - Media Queries
  345. */
  346. /**
  347. * 10.1 - >= 710px
  348. */
  349. @media screen and (min-width: 44.375em) {
  350. .pagination {
  351. margin: 0 7.6923% 4.421052632em 23.0769%;
  352. }
  353. .entry-header,
  354. .post-thumbnail,
  355. .entry-content,
  356. .entry-summary,
  357. .entry-footer,
  358. .comments-area,
  359. .image-navigation,
  360. .post-navigation,
  361. .page-header,
  362. .page-content,
  363. .content-bottom-widgets {
  364. margin-right: 7.6923%;
  365. margin-left: 23.0769%;
  366. }
  367. .entry-content blockquote:not(.alignright):not(.alignleft),
  368. .entry-summary blockquote,
  369. .comment-content blockquote {
  370. margin-right: -1.473684211em;
  371. margin-left: auto;
  372. }
  373. .entry-content blockquote blockquote:not(.alignright):not(.alignleft),
  374. .entry-summary blockquote blockquote,
  375. .comment-content blockquote blockquote {
  376. margin-right: 0;
  377. margin-left: auto;
  378. }
  379. .entry-content ul,
  380. .entry-summary ul,
  381. .comment-content ul,
  382. .entry-content ol,
  383. .entry-summary ol,
  384. .comment-content ol {
  385. margin-right: 0;
  386. margin-left: auto;
  387. }
  388. .entry-content li > ul,
  389. .entry-summary li > ul,
  390. .comment-content li > ul,
  391. .entry-content blockquote > ul,
  392. .entry-summary blockquote > ul,
  393. .comment-content blockquote > ul {
  394. margin-right: 1.25em;
  395. margin-left: auto;
  396. }
  397. .entry-content li > ol,
  398. .entry-summary li > ol,
  399. .comment-content li > ol,
  400. .entry-content blockquote > ol,
  401. .entry-summary blockquote > ol,
  402. .comment-content blockquote > ol {
  403. margin-right: 1.5em;
  404. margin-left: auto;
  405. }
  406. .comment-list .children > li {
  407. padding-right: 1.75em;
  408. padding-left: 0;
  409. }
  410. .sidebar,
  411. .widecolumn {
  412. padding-right: 7.6923%;
  413. padding-left: 23.0769%;
  414. }
  415. body:not(.search-results) .entry-summary li > ul,
  416. body:not(.search-results) .entry-summary blockquote > ul {
  417. margin-right: 1.157894737em;
  418. margin-left: auto;
  419. }
  420. body:not(.search-results) .entry-summary li > ol,
  421. body:not(.search-results) .entry-summary blockquote > ol {
  422. margin-right: 1.473684211em;
  423. margin-left: auto;
  424. }
  425. }
  426. /**
  427. * 10.2 - >= 910px
  428. */
  429. @media screen and (min-width: 56.875em) {
  430. .main-navigation .primary-menu > li {
  431. float: right;
  432. }
  433. .main-navigation ul ul {
  434. left: auto;
  435. margin: 0;
  436. right: -999em;
  437. }
  438. .main-navigation ul ul:before {
  439. left: 9px;
  440. right: auto;
  441. }
  442. .main-navigation ul ul:after {
  443. left: 11px;
  444. right: auto;
  445. }
  446. .main-navigation li:hover > ul,
  447. .main-navigation li.focus > ul {
  448. left: 0;
  449. right: auto;
  450. }
  451. .main-navigation ul ul li:hover > ul,
  452. .main-navigation ul ul li.focus > ul {
  453. left: 100%;
  454. right: auto;
  455. }
  456. .main-navigation .menu-item-has-children > a {
  457. margin: 0;
  458. padding-right: 0.875em;
  459. padding-left: 2.25em;
  460. }
  461. .main-navigation .menu-item-has-children > a:after {
  462. left: 0.625em;
  463. right: auto;
  464. }
  465. .main-navigation ul ul .menu-item-has-children > a {
  466. padding-right: 0.875em;
  467. padding-left: 2.0625em;
  468. }
  469. .main-navigation ul ul .menu-item-has-children > a:after {
  470. left: 0.5625em;
  471. right: auto;
  472. top: 0.8125em;
  473. -webkit-transform: rotate(-90deg);
  474. -moz-transform: rotate(-90deg);
  475. -ms-transform: rotate(-90deg);
  476. transform: rotate(-90deg);
  477. }
  478. .content-area {
  479. float: right;
  480. margin-right: auto;
  481. margin-left: -100%;
  482. }
  483. .entry-header,
  484. .post-thumbnail,
  485. .entry-content,
  486. .entry-summary,
  487. .entry-footer,
  488. .comments-area,
  489. .image-navigation,
  490. .post-navigation,
  491. .pagination,
  492. .page-header,
  493. .page-content,
  494. .content-bottom-widgets {
  495. margin-right: 0;
  496. margin-left: 0;
  497. }
  498. .sidebar {
  499. float: right;
  500. margin-right: 75%;
  501. margin-left: auto;
  502. padding: 0;
  503. }
  504. .widget blockquote {
  505. padding-right: 1.0625em;
  506. padding-left: 0;
  507. }
  508. .widget .alignright {
  509. margin: 0.2307692308em 0 1.6153846154em 1.6153846154em;
  510. }
  511. .widget .alignleft {
  512. margin: 0.2307692308em 1.6153846154em 1.6153846154em 0;
  513. }
  514. .tagcloud a {
  515. margin: 0 0 0.5384615385em 0.2307692308em;
  516. }
  517. .content-bottom-widgets .widget-area:nth-child(1):nth-last-child(2),
  518. .content-bottom-widgets .widget-area:nth-child(2):nth-last-child(1) {
  519. float: right;
  520. margin-right: auto;
  521. margin-left: 7.1428571%;
  522. }
  523. .content-bottom-widgets .widget-area:nth-child(2):nth-last-child(1):last-of-type {
  524. margin-right: auto;
  525. margin-left: 0;
  526. }
  527. .site-info {
  528. margin: 0.538461538em 0 0.538461538em auto;
  529. }
  530. .no-sidebar .entry-header,
  531. .no-sidebar .entry-content,
  532. .no-sidebar .entry-summary,
  533. .no-sidebar .entry-footer,
  534. .no-sidebar .comments-area,
  535. .no-sidebar .image-navigation,
  536. .no-sidebar .post-navigation,
  537. .no-sidebar .pagination,
  538. .no-sidebar .page-header,
  539. .no-sidebar .page-content,
  540. .no-sidebar .content-bottom-widgets {
  541. margin-right: 15%;
  542. margin-left: 15%;
  543. }
  544. .no-sidebar .post-thumbnail {
  545. margin-right: 0;
  546. margin-left: 0;
  547. }
  548. .widecolumn {
  549. padding-right: 15%;
  550. padding-left: 15%;
  551. }
  552. }
  553. /**
  554. * 10.3 - >= 985px
  555. */
  556. @media screen and (min-width: 61.5625em) {
  557. body:not(.search-results) article:not(.type-page) .entry-content {
  558. float: left;
  559. }
  560. body:not(.search-results) article:not(.type-page) .entry-content > blockquote.alignleft.below-entry-meta {
  561. margin-right: 1.473684211em;
  562. margin-left: 0;
  563. width: -webkit-calc(50% - 0.736842105em);
  564. width: calc(50% - 0.736842105em);;
  565. }
  566. body:not(.search-results) article:not(.type-page) .entry-content > blockquote.alignright.below-entry-meta {
  567. margin-right: -40%;
  568. margin-left: 1.473684211em;
  569. width: -webkit-calc(60% - 1.4736842105em);
  570. width: calc(60% - 1.4736842105em);
  571. }
  572. body:not(.search-results) article:not(.type-page) img.below-entry-meta,
  573. body:not(.search-results) article:not(.type-page) figure.below-entry-meta {
  574. margin-right: -40%;
  575. margin-left: 0;
  576. }
  577. body:not(.search-results) article:not(.type-page) .entry-footer {
  578. float: right;
  579. }
  580. body.no-sidebar:not(.search-results) article:not(.type-page) .entry-content {
  581. float: right;
  582. margin-right: 34.99999999%;
  583. margin-left: -100%;
  584. }
  585. body.no-sidebar:not(.search-results) article:not(.type-page) .entry-footer {
  586. margin-right: 15%;
  587. margin-left: -100%;
  588. }
  589. }
  590. /**
  591. * 10.4 - >= 1200px
  592. */
  593. @media screen and (min-width: 75em) {
  594. body:not(.search-results) .entry-summary li > ul,
  595. body:not(.search-results) .entry-summary blockquote > ul {
  596. margin-right: 0.956521739em;
  597. margin-left: auto;
  598. }
  599. body:not(.search-results) .entry-summary li > ol,
  600. body:not(.search-results) .entry-summary blockquote > ol {
  601. margin-right: 1.52173913em;
  602. margin-left: auto;
  603. }
  604. body:not(.search-results) .entry-summary blockquote {
  605. padding-right: 1.347826087em;
  606. padding-left: 0;
  607. }
  608. body:not(.search-results) .entry-summary blockquote:not(.alignright):not(.alignleft) {
  609. margin-right: -1.52173913em;
  610. margin-left: auto;
  611. }
  612. body:not(.search-results) .entry-summary blockquote blockquote:not(.alignright):not(.alignleft) {
  613. margin-right: 0;
  614. margin-left: auto;
  615. }
  616. body:not(.search-results) .entry-summary .alignright {
  617. margin: 0.2608695652em 0 1.5217391304em 1.5217391304em;
  618. }
  619. body:not(.search-results) .entry-summary .alignleft {
  620. margin: 0.2608695652em 1.5217391304em 1.5217391304em 0;
  621. }
  622. }