/* * Theme Name: OceanWP RTL CSS * Description: Adds support for languages written in a Right To Left (RTL) direction. */ /*------------------------------------* General & Commons *------------------------------------*/ body { direction: rtl; unicode-bidi: embed; } /* Float right */ body .oceanwp-row .col, .top-bar-left { float: right } /* Float left */ .top-bar-right { float: left } /* List */ ul, ol { margin: 15px 20px 15px 0; } /* Tables */ table th, table td, caption, th, td { text-align: right; } /* Theme heading */ .theme-heading .text::before { display: none; } .theme-heading .text::after { content: '\f104'; font-family: 'Font Awesome 5 Free'; font-size: 18px; font-weight: 600; color: #13aff0; padding-left: 6px;} /* Change right position to Left position*/ .site-breadcrumbs, #top-bar-social.top-bar-right, #searchform-dropdown, .current-shop-items-dropdown { right: auto; left: 0; } /* Search form input */ form.oceanwp-searchform input { padding: 0 15px 0 40px; } /* Change left position to right position*/ #top-bar-social.top-bar-left { left: auto; right: 0; } /* Layout */ .content-area { float: right; padding-left: 30px; padding-right: 0; border-left-width: 1px; border-right-width: 0; } .widget-area.sidebar-primary { float: left; padding-right: 30px; padding-left: 0; } .content-left-sidebar .content-area { float: left; padding-right: 30px; padding-left: 0; border-right-width: 1px; border-left-width: 0; } .content-left-sidebar .widget-area.sidebar-primary { float: right; padding-left: 30px; padding-right: 0; } /* Both sidebars */ .content-both-sidebars .content-area { float: left; padding-right: 30px; } .content-both-sidebars .content-area { border-right-width: 1px; } .content-both-sidebars .widget-area.sidebar-primary { padding-right: 0; } /* Boxed layout */ .boxed-layout .site-breadcrumbs { right: auto; left: 30px; } /* Separate layout */ .separate-layout .content-area { border-left-width: 0; border-right-width: 0; } .separate-layout.content-left-sidebar .content-area { border-right-width: 0; border-left-width: 0; } .separate-layout .widget-area.sidebar-primary { padding-right: 20px; padding-left: 0; } .separate-layout.content-left-sidebar .widget-area.sidebar-primary { padding-left: 20px; padding-right: 0; } body.separate-blog.separate-layout .oceanwp-row { margin-left: -20px; margin-right: 0; } body.separate-blog.separate-layout #blog-entries.blog-grid > * { padding: 0 0 0 20px; } /* Blockquote */ blockquote { padding-right: 20px; padding-left: 0; border-right-width: 3px; border-left-width: 0; } /*------------------------------------* Header *------------------------------------*/ #site-logo { float: right; } /* Top Menu header */ #site-header.top-header .header-top .left { float: right; } #site-header.top-header .header-top .right { float: left; } #site-header.top-header #site-navigation-wrap { right: -15px !important; left: auto !important; } /* Full Screen header */ #site-header.full_screen-header #site-navigation-wrap { right: auto; left: 0; } #site-header.full_screen-header .menu-bar { float: left; } #site-header.full_screen-header #full-screen-menu { left: auto; right: 0; } #site-header.full_screen-header .fs-dropdown-menu li > a > .nav-arrow { padding-left: 0; padding-right: 5px; } #site-header.full_screen-header .fs-dropdown-menu > li.search-toggle-li label i { margin-left: 0; margin-right: 3px; } /* Center header */ #site-header.center-header #site-navigation-wrap .left-menu { float: right; } #site-header.center-header #site-navigation-wrap .right-menu { float: left; } #site-header.center-header .wider .left-menu { text-align: right; } #site-header.center-header .wider .right-menu { text-align: left; } #site-header.center-header .closer .left-menu { text-align: left; } #site-header.center-header .closer .right-menu { text-align: right; } /* Medium header */ #site-header.medium-header .oceanwp-social-menu { text-align: left; } #site-header.medium-header #medium-searchform { text-align: right; } #site-header.medium-header #medium-searchform input { padding: 6px 12px 6px 38px; } #site-header.medium-header #medium-searchform label { left: auto; right: 12px; } #site-header.medium-header #medium-searchform button { right: auto; left: 0; } /* Vertical header */ #site-header.vertical-header.left-logo #site-logo { text-align: right; } #site-header.vertical-header.right-logo #site-logo { text-align: left; } #site-header.vertical-header .has-social #site-navigation-wrap { left: auto; } #site-header.vertical-header #site-navigation-wrap { left: auto; } #site-header.vertical-header #site-navigation-wrap .dropdown-menu li > a .dropdown-toggle { left: 0; right: auto; } #site-header.vertical-header #site-navigation-wrap .dropdown-menu li > a .dropdown-toggle:before { right: 50%; left: auto; margin-right: -10px; margin-left: 0; } #site-header.vertical-header #site-navigation-wrap .dropdown-menu .sub-menu { right: 0; left: auto; } #site-header.vertical-header #vertical-searchform form label { right: 12px; left: auto; } #site-header.vertical-header #vertical-searchform form button { left: 0; right: auto; } #site-header.vertical-header .oceanwp-social-menu.simple-social { left: auto; } body.vertical-header-style.left-header #site-header.vertical-header { right: 0; left: auto; } body.vertical-header-style.left-header #site-header.vertical-header .vertical-toggle { left: 0; right: auto; } body.vertical-header-style.left-header #outer-wrap { margin-right: 300px; margin-left: 0; } body.vertical-header-style.right-header #site-header.vertical-header { left: 0; right: auto; } body.vertical-header-style.right-header #site-header.vertical-header .vertical-toggle { right: 0; left: auto; } body.vertical-header-style.right-header #outer-wrap { margin-left: 300px; margin-right: 0; } body.vertical-header-style.has-vh-transparent.left-header #outer-wrap { margin-right: 0; } body.vertical-header-style.has-vh-transparent.right-header #outer-wrap { margin-left: 0; } body.vertical-header-style.vh-closed.left-header #site-header.vertical-header { right: -266px; left: auto; } body.vertical-header-style.vh-closed.left-header #outer-wrap { margin-right: 34px; margin-left: 0; } body.vertical-header-style.vh-closed.right-header #site-header.vertical-header { left: -266px; right: auto; } body.vertical-header-style.vh-closed.right-header #outer-wrap { margin-left: 34px; margin-right: 0; } body.vertical-header-style.vh-closed.vh-opened.left-header #site-header.vertical-header { right: 0; left: auto; } body.vertical-header-style.vh-closed.vh-opened.right-header #site-header.vertical-header { left: 0; right: auto; } body.vertical-header-style.vh-closed.vh-opened #site-header.vertical-header #site-navigation-wrap { padding-left: 0; } body.vertical-header-style.vh-closed #site-header.vertical-header #site-navigation-wrap { padding-left: 34px; padding-right: 0; } /*------------------------------------* Navigation *------------------------------------*/ #site-navigation-wrap { float: left; left: -15px; right: auto; } #site-navigation-wrap .dropdown-menu > li { float: right; } #site-navigation-wrap .dropdown-menu > li > a .nav-arrow { padding-right: 6px; padding-left: 0; } #searchform-header-replace { left: 0; right: auto; } #searchform-header-replace-close { left: 8px; right: auto; } .search-overlay.center-header .search-overlay .search-toggle-li .search-overlay-toggle.exit > span:before { padding-left: 5px; padding-right: 0; } .dropdown-menu .sub-menu { right: 0; left: auto; text-align: right; } .dropdown-menu ul .sub-menu { right: 100%; left: auto; } .dropdown-menu ul li a.menu-link .nav-arrow { left: 15px; right: auto; } .dropdown-menu ul li a.menu-link i { margin-left: 3px; margin-right: 0; } .dropdown-menu li a.menu-link i { padding-left: 5px; padding-right: 0; } .navigation .megamenu { right: auto; } .navigation > ul > li > ul.megamenu.sub-menu > li { float: right; border-right-width: 1px; border-left-width: 0; } .navigation > ul > li > ul.megamenu.sub-menu > li:first-child { border-right: none; } .after-header-content { float: left; } /* If social */ .has-social #site-navigation-wrap { left: 0; right: auto; } /* If left menu */ .minimal-header.left-menu #site-navigation-wrap, .transparent-header.left-menu #site-navigation-wrap { float: right; left: 0; right: auto; } .minimal-header.left-menu #site-logo, .transparent-header.left-menu #site-logo { padding-left: 20px; padding-right: 0; } /* If center menu */ .center-menu #site-navigation-wrap { right: 50%; left: auto; } /* menu icons */ .dropdown-menu li a.menu-link i.after { margin-right: 6px; margin-left: 0; } .dropdown-menu li a.menu-link i.before { margin-left: 6px; margin-right: 0; } .dropdown-menu li a.menu-link img.after { margin-right: 6px; } .dropdown-menu li a.menu-link img.before { margin-left: 6px; } /* Social menu */ .oceanwp-social-menu { float: left; } .oceanwp-social-menu.simple-social { right: auto; left: -8px; } .oceanwp-social-menu.social-with-style { right: auto; left: -2px; } .oceanwp-social-menu ul li { float: right; } /*------------------------------------* Mobile Navigation *------------------------------------*/ a.sidr-class-toggle-sidr-close i { padding-left: 8px; padding-right: 0; } .sidr-class-dropdown-toggle { left: 0; right: auto; } .sidr-class-dropdown-menu li.sidr-class-menu-item-has-children > a { padding-right: 20px; padding-left: 60px; } .sidr-class-dropdown-menu ul a:before { content: '\f104'; } /*------------------------------------* Drop Down Mobile Menu Style *------------------------------------*/ #mobile-dropdown { right: 0; left: auto; } #mobile-dropdown ul li a { text-align: right; } #mobile-dropdown ul li a .dropdown-toggle { left: 0; right: auto; padding-left: 40px; padding-right: 0; } #mobile-dropdown ul li a .dropdown-toggle:before { right: 50%; left: auto; margin-right: -15px; margin-left: 0; } #mobile-dropdown ul li ul { margin-right: 0; } #mobile-dropdown #mobile-menu-search form input { padding: 6px 12px 6px 45px !important; } #mobile-dropdown #mobile-menu-search form button { left: 10px; right: auto; } /*------------------------------------* Full Screen Mobile Menu Style *------------------------------------*/ #mobile-fullscreen { right: 0; left: auto; } #mobile-fullscreen a.close { left: 14px; right: auto; } #mobile-fullscreen .fs-dropdown-menu li .dropdown-toggle { padding-right: 5px; padding-left: 0; } #mobile-fullscreen #mobile-search label i { margin-right: 3px; margin-left: 0; } /*------------------------------------* Breadcrumbs *------------------------------------*/ .site-breadcrumbs ul li:after { content: '\f104'; } /*------------------------------------* Posts *------------------------------------*/ ul.meta li i { padding-left: 5px; padding-right: 0; } .single-post ul.meta li i { padding-left: 9px; padding-right: 0; } .blog-entry ul.meta li i, .blog-entry ul.meta li i, .single-post ul.meta li .owp-icon, .blog-entry ul.meta li .owp-icon { margin-right: 0; margin-left: 8px; } /* Thumbnail style */ .blog-entry.thumbnail-entry .left-position .blog-entry-content { padding-right: 3em; padding-left: 0; } .blog-entry.thumbnail-entry .right-position .blog-entry-content { padding-left: 3em; padding-right: 0; } .blog-entry.thumbnail-entry .blog-entry-comments { float: right; } .blog-entry.thumbnail-entry .blog-entry-comments i { padding-left: 6px; padding-right: 0; } .blog-entry.thumbnail-entry .blog-entry-comments svg.owp-icon { margin-right: 0; margin-left: 0.7rem; } .blog-entry.thumbnail-entry .blog-entry-date { float: left; } /* Readmore button */ .blog-entry.large-entry .blog-entry-readmore a i { margin-right: 8px; margin-left: 0; } .blog-entry .blog-entry-readmore a i:before { content: '\f104'; padding-right: 5px; } /* Link format */ .link-entry i { left: 20px; right: auto; } /* Dropcap */ .dropcap { float: right; margin-left: 10px; margin-right: 0; } /* Next & Prev */ .single-post nav.post-navigation .nav-links .nav-previous { float: right; padding-left: 20px; padding-right: 0; text-align: right; border-left-width: 1px; border-right-width: 0; } .single-post nav.post-navigation .nav-links .nav-previous i { float: right; margin-left: 20px; margin-right: 0; } .single-post nav.post-navigation .nav-links .nav-next { float: left; padding-right: 20px; padding-left: 0; text-align: left; } .single-post nav.post-navigation .nav-links .nav-next i { float: left; margin-right: 20px; margin-left: 0; } /* Related Posts */ #related-posts time.published i { padding-left: 5px; } #related-posts time.published svg.owp-icon { margin-left: 0.7rem; margin-right: 0; } /* Author bio */ #author-bio .author-bio-avatar { margin-left: 30px; margin-right: 0; } /*------------------------------------* Comments *------------------------------------*/ #respond .comment-form-author, #respond .comment-form-email, #respond .comment-form-url { float: right; } #respond .comment-form-author { padding-left: 10px; padding-right: 0; } #respond .comment-form-url { padding-right: 10px; padding-left: 0; } #respond .form-submit { float: left; } #comments ol.children { margin-right: 30px; margin-left: 0; } .comment-body img { float: right; margin-left: 30px; margin-right: 0; } .comment-author .comment-link { float: right; } .comment-author .comment-meta { float: left; text-align: left; } .comment-author .comment-meta .comment-reply-link, .comment-author .comment-meta .comment-edit-link { margin-right: 15px; margin-left: 0; } #respond #cancel-comment-reply-link { float: left; } span.required { margin-right: 3px; margin-left: 0; } .no-comments { text-align: left; } .no-comments i { margin-left: 8px; margin-right: 0; } .comment-navigation .nav-links .nav-previous { float: right; margin-left: 1.5em; margin-right: 0; } .comment-navigation .nav-links .nav-previous i { margin-left: 5px; margin-right: 0; } .comment-navigation .nav-links .nav-next { float: left; margin-left: 1.5em; margin-right: 0; } .comment-navigation .nav-links .nav-next i { margin-right: 5px; margin-left: 0; } /*------------------------------------* Widgets *------------------------------------*/ .widget-title { border-width: 0 3px 0 0; padding-right: 15px; padding-left: 0; } /*------------------------------------* Pagination *------------------------------------*/ ul.page-numbers { text-align: left; } /*------------------------------------* Search Results *------------------------------------*/ .search-results article .thumbnail { margin-left: 20px; margin-right: 0; } /*------------------------------------* Modal *------------------------------------*/ .oceanwp-modal .oceanwp-close-modal { left: 0; right: auto; } /*------------------------------------* Footer *------------------------------------*/ #footer-bottom #copyright { float: right; text-align: right; padding-left: 15px; padding-right: 0; } #footer-bottom #footer-bottom-menu { float: left; text-align: left; padding-right: 15px; padding-left: 0; } #footer-bottom #footer-bottom-menu li { float: right; } #scroll-top { left: 20px; right: auto; } /*------------------------------------* Responsive *------------------------------------*/ .oceanwp-mobile-menu-icon.mobile-right { float: left; } .oceanwp-mobile-menu-icon.mobile-left { float: right; } .oceanwp-mobile-menu-icon a { padding-right: 15px; padding-left: 0; } .oceanwp-mobile-menu-icon a:first-child { padding-right: 0; } .oceanwp-mobile-menu-icon a.mobile-menu .oceanwp-text, .oceanwp-mobile-menu-icon a.mobile-menu .oceanwp-close-text { padding-right: 6px; padding-left: 0 !important; } /*------------------------------------* All Devices under 1280px *------------------------------------*/ @media only screen and (max-width: 1280px) { body.vertical-header-style.left-header #site-header.vertical-header { right: -266px; left: auto; } body.vertical-header-style.left-header #outer-wrap { margin-right: 34px; margin-left: 0; } body.vertical-header-style.right-header #site-header.vertical-header { left: -266px; right: auto; } body.vertical-header-style.right-header #outer-wrap { margin-left: 34px; margin-right: 0; } body.vertical-header-style.vh-opened.left-header #site-header.vertical-header { right: 0; left: auto; } body.vertical-header-style.vh-opened.right-header #site-header.vertical-header { left: 0; right: auto; } body.vertical-header-style.vh-opened #site-header.vertical-header #site-navigation-wrap { padding-left: 0; } #site-header.vertical-header #site-navigation-wrap { padding-left: 34px; padding-right: 0; } } /*------------------------------------* All Devices under 960px *------------------------------------*/ @media only screen and (max-width: 959px) { /* Separate layout */ .separate-layout .widget-area.sidebar-primary { padding-right: 0; } } /*------------------------------------* All Devices under 767px *------------------------------------*/ @media only screen and (max-width: 767px) { #respond .comment-form-author, #respond .comment-form-email, #respond .comment-form-url { float: none; padding: 0; } }