body {
direction: rtl
}
form {
direction: rtl;
color: inherit !important
}
ul,
ol li {
margin: 0 20px 0 0
}
select {
background-position-x: 18px
}
form input[type=checkbox], 
form input[type=radio],
input[type=checkbox], 
input[type=radio] {
margin: 0 0 0 10px !important
}
dd {
margin: 0 220px 10px 0
}
.col {
float: right;
margin-left: 0;
margin-right: 4%
}
.col:first-child, 
.col_first {
margin-right: 0
}
.col_not_first {
margin-left: 0;
margin-right: 4%
}
.cz_elm_center {
right: 50%;
transform: translateX(50%)
}
.elms_left > div,
.sf-menu > .cz,
.cz_helm_pos_left {
float: right
}
.elms_right > div,
.cz_helm_pos_right {
float: left
}
.cz_info_content {
margin: 0 20px 0 0
}
.logo_hover_tooltip {
left: 0;
right: 0
}
.sf-menu {
margin: 0
}
.sf-menu > .cz > a {
margin: 0 0 0 30px
}
.sf-menu .cz a span > i {
margin-right: 0;
margin-left: 8px
}
.sf-menu > .cz:after {
right: auto;
left: 0;
transform: translate(-50%, -50%)
}
.cz_submenu_fx_rotate4 .sub-menu {
transform-origin: right;animation: MenuRotateDRTL .4s cubic-bezier(.180, .890, .330, 1.270)
}
@keyframes MenuRotateDRTL {
0% {transform: rotateY(-10deg)}
100% {transform: rotateY(0)}
}
.sf-menu .sub-menu {
text-align: right;
left: auto;
right: -20px
}
.sf-menu .sub-menu .sub-menu {
left: auto;
right: 200px
}
.sf-menu .cz .cz a{
text-align: right
}
a.sf-with-ul .cz_indicator.fa {
margin: 0 4px 0 0
}
ul.offcanvas_area a.sf-with-ul .cz_indicator.fa {
right: auto !important;
left: 0;
border: 0;
border-right: 1px solid rgba(167,167,167,.2)
}
.sub-menu a.sf-with-ul .cz_indicator {
right: auto;
left: 10px;
transform: rotate(180deg);
margin-top: -8px
}
.sf-menu .cz .cz:hover > a .cz_indicator {
right: auto;
left: 7px
}
.cz_parent_megamenu > [class^='cz_megamenu_'] > .cz, 
.cz_parent_megamenu > [class*=' cz_megamenu_'] > .cz {
float: right;
margin: 0 -1px 0 0;
border-left: 0;
border-right: 1px solid rgba(167, 167, 167, 0.2)
}
.cz_megamenu_width_full_row > .sub-menu {
left: auto;
right: auto;
margin-right: 0 !important;
margin-left: 0 !important
}
.fullscreen_menu {
left: -20px
}
.fullscreen_menu > .cz {
float: none
}
.outer_search form button {
left: 16px;
right: auto
}
div i.icon_plus_text:before {
margin-right: 0;
margin-left: 10px
}
.search_style_icon_full form > span,
.cz_posts_template_8 .cz_post_title {
right: 0;
left: auto
}
.cz_cart_items {
transform: translateX(63px)
}
.inview_right .cz_cart_items {
transform: translateX(6px)
}
.cz_cart_buttons a:first-child {
border-right: 0;
border-left: 1px solid rgba(167, 167, 167, .2)
}
.cz_cart .remove,
.cz_cart a.remove, 
.cz_cart_edd .remove,
.cz_cart_edd a.remove {
left: 20px;
right: auto
}
.cz_cart_edd a.remove i {
font-size: 12px
}
.cz_cart_count,
.cz_wishlist_count {
right: auto;
left: 20px;
transform: translateX(-70%);
}
.item_small > a {
float: right;
margin: 0 0 0 20px
}
ul.offcanvas_area .cz a,
ul.offcanvas_area .cz h6 {
margin: 0
}
.cz_helm_pos_right.dropdown_menu {
left: 0 !important;
right: auto !important
}
.cz_helm_pos_right.dropdown_menu {
left: 0;
right: auto;
text-align: left
}
.search-form .search-submit {
margin: 0 10px 0 0
}
.cz_subscribe button#submit {
right: auto;
left: 10px
}
.cz_btn_header_icon_before {
margin: 0 0 0 10px
}
.cz_btn_header_icon_after {
margin: 0 10px 0 0
}
.shop_icon span {
margin: 0 8px 0 0
}
.widget > h4:before,
.widget > h4:after,
.footer_widget > h4:before,
.footer_widget > h4:after,
#comments > h3:before,
#comments > h3:after,
.content.cz_related_posts > h4:before,
.content.cz_related_posts > h4:after,
.cz_author_box h4:before,
.cz_author_box h4:after,
.related.products > h2:before,
.related.products > h2:after,
.upsells.products > h2:before,
.up-sells.products > h2:before,
.up-sells.products > h2:after {
left: auto;
right: 0
}
.widget_nav_menu .menu-item-has-children > a > i {
right: auto;
left: 10px
}
.cz_readmore,
.more-link {
padding: 4px 4px 4px 16px
}
.cz_post_content ol,
article.post ol {
margin-left: 0;
margin-right: 20px
}
.cz_post_content ol ol,
article.post ol ol {
margin: 0
}
.comment-content ol {
margin: 0 26px 30px 0;
padding: 0
}
.comment-content ol ol {
margin-bottom: 0
}
.cz_post_content ul,
article.post ul, 
.comment-content ul {
margin: 0 40px 30px 0;
padding: 0
}
.cz_post_content ul ul,
.cz_post_content ol ul,
article.post ul ul,
article.post ol ul,
.comment-content ul ul {
padding: 0 20px 0 0
}
.cz_post_image {
float: right;
margin: 0 0 20px 50px
}
.cz_default_loop_right .cz_post_image {
float: left;
margin: 0 50px 20px 0
}
.cz_post_author_avatar {
margin: 0 0 0 14px
}
.cz_posts_template_6 .cz_post_image {
margin-bottom: 0
}
.cz_posts_gallery_mode .cz_post_title {
left: auto;
right: 0
}
.cz_posts_gallery_mode .cz_post_meta {
left: auto;
right: 30px
}
.cz_posts_template_13 article,
.cz_posts_template_14 article {
float: right
}
.cz_view_author_posts {
right: auto;
left: 20px
}
.right_br_full_container .breadcrumbs {
float: left;
text-align: left
}
div.wpcf7 .wpcf7-form .ajax-loader {
left: 0;
right: auto
}
.wpcf7 input[type="url"], 
.wpcf7 input[type="email"], 
.wpcf7 input[type="tel"] {
direction: ltr;
text-align: right
}
.wpcf7 input[type="email"] {
text-align: left
}
.wpcf7 input[type="email"]::placeholder {
text-align: right
}
.wpcf7 input[type="email"]::-moz-placeholder {
text-align: right
}
.wpcf7 input[type="email"]::-ms-input-placeholder {
text-align: right
}
.wpcf7 input[type="email"]::-webkit-input-placeholder {
text-align: right
}
.cz_flickr .flickr_badge_image, 
.cz_instagram li, 
.cz_portfolio_widget a {
float: right !important
}
.righter {
float: left
}
.widget_archive li span, 
.widget_categories li span {
left: 0;
right: auto
}
.tagcloud, 
.cz_post_cat,
.lefter,
.cz_post_views {
float: right
}
.codevz-widget-custom-menu a:hover {
transform: translateX(-5px)
}
.codevz-widget-custom-menu a:before {
content: "\f104";
padding: 0 0 0 10px
}
.codevz-widget-custom-nav-menu ul ul {
margin: 0 10px 0 0
}
.mr4 {margin-right: 0;margin-left: 4px}
.mr8 {margin-right: 0;margin-left: 8px}
.mr10 {margin-right: 0;margin-left: 10px}
.mr20 {margin-right: 0;margin-left: 20px}
.ml4 {margin-left: 0;margin-right: 4px}
.ml8 {margin-left: 0;margin-right: 8px}
.ml10 {margin-left: 0;margin-right: 10px}
.ml20 {margin-left: 0;margin-right: 20px}
.widget {
text-align: right
}
.search_404 button {
right: auto;
left: 20px
}
i.xtra-close-icon {
left: 70px;
right: auto
}
.wpcf7-spinner {
left: 0
}
@media screen and (max-width:480px) {
.sf-menu > .cz {
width: 100%
}
.center_on_mobile .search-field {
text-align: right !important
}
i.cz_close_popup {
right: auto;
left: 20px
}
}.pageloader {
background: #000;
position: fixed;
top: 0;
left: 0;
z-index: 9999999;
height: 100%;
width: 100%;
display: block;
opacity: 1;
visibility: visible;
transition: all .3s ease-in-out
}
.pageloader > * {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transition: all .3s ease-in-out
}
.pageloader_percentage {
font-size: 100px;
color: #a7a7a7;
font-weight: 100
}
.pageloader_done {
opacity: 0;
visibility: hidden
}
.pageloader_left, .pageloader_right,
.pageloader_down, .pageloader_up,
.pageloader_circle, .pageloader_pa,
.pageloader_pb, .pageloader_pc,
.pageloader_pd, .pageloader_pe,
.pageloader_center_h, .pageloader_center_v {
opacity: 1;
visibility: visible;
clip-path: inset(0% 0% 0% 0%);
-webkit-clip-path: inset(0% 0% 0% 0%);
animation-duration: 650ms;
animation-fill-mode: forwards;
animation-timing-function: cubic-bezier(.77, 0, .175, 1)
}
.pageloader_down.pageloader_click {
animation-name: loadingDown
}
@keyframes loadingDown {
0% {
clip-path: inset(0% 0% 100% 0%);
-webkit-clip-path: inset(0% 0% 100% 0%)
}
100% {
clip-path: inset(0% 0% 0% 0%);
-webkit-clip-path: inset(0% 0% 0% 0%)
}
}
.pageloader_down.pageloader_done {
animation-name: loadingDownDone
}
@keyframes loadingDownDone {
0% {
clip-path: inset(0% 0% 0% 0%);
-webkit-clip-path: inset(0% 0% 0% 0%)
}
100% {
clip-path: inset(100% 0% 0% 0%);
-webkit-clip-path: inset(100% 0% 0% 0%)
}
}
.pageloader_up.pageloader_click {
animation-name: loadingUp
}
@keyframes loadingUp {
0% {
clip-path: inset(100% 0% 0% 0%);
-webkit-clip-path: inset(100% 0% 0% 0%)
}
100% {
clip-path: inset(0% 0% 0% 0%);
-webkit-clip-path: inset(0% 0% 0% 0%)
}
}
.pageloader_up.pageloader_done {
animation-name: loadingUpDone
}
@keyframes loadingUpDone {
0% {
clip-path: inset(0% 0% 0% 0%);
-webkit-clip-path: inset(0% 0% 0% 0%)
}
100% {
clip-path: inset(0% 0% 100% 0%);
-webkit-clip-path: inset(0% 0% 100% 0%)
}
}
.pageloader_left.pageloader_click {
animation-name: loadingLeft
}
@keyframes loadingLeft {
0% {
clip-path: inset(0% 100% 0% 0%);
-webkit-clip-path: inset(0% 100% 0% 0%)
}
100% {
clip-path: inset(0% 0% 0% 0%);
-webkit-clip-path: inset(0% 0% 0% 0%)
}
}
.pageloader_left.pageloader_done {
animation-name: loadingLeftDone
}
@keyframes loadingLeftDone {
0% {
clip-path: inset(0% 0% 0% 0%);
-webkit-clip-path: inset(0% 0% 0% 0%)
}
100% {
clip-path: inset(0% 0% 0% 100%);
-webkit-clip-path: inset(0% 0% 0% 100%)
}
}
.pageloader_right.pageloader_click {
animation-name: loadingRight
}
@keyframes loadingRight {
0% {
clip-path:inset(0% 0% 0% 100%);
-webkit-clip-path:inset(0% 0% 0% 100%)
}
100% {
clip-path: inset(0% 0% 0% 0%);
-webkit-clip-path: inset(0% 0% 0% 0%)
}
}
.pageloader_right.pageloader_done {
animation-name: loadingRightDone
}
@keyframes loadingRightDone {
0% {
clip-path: inset(0% 0% 0% 0%);
-webkit-clip-path: inset(0% 0% 0% 0%)
}
100% {
clip-path: inset(0% 100% 0% 0%);
-webkit-clip-path: inset(0% 100% 0% 0%)
}
}
.pageloader_circle.pageloader_click {
animation-name: loadingCircle
}
@keyframes loadingCircle {
0% {
clip-path: circle(0%);
-webkit-clip-path: circle(0%)
}
100% {
clip-path: circle(100%);
-webkit-clip-path: circle(100%)
}
}
.pageloader_circle.pageloader_done {
animation-name: loadingCircleDone
}
@keyframes loadingCircleDone {
0% {
clip-path: circle(100%);
-webkit-clip-path: circle(100%)
}
100% {
clip-path:circle(0%);
-webkit-clip-path:circle(0%)
}
}
.pageloader_center_h, .pageloader_center_v {animation-duration: 800ms;animation-timing-function: cubic-bezier(.25,.1,.25,1)}
.pageloader_center_h.pageloader_done, .pageloader_center_v.pageloader_done {animation-duration: 1.5s}
.pageloader_center_h.pageloader_click {
animation-name: loadingCenter
}
@keyframes loadingCenter {
0% {
clip-path:inset(0 100% 0 100%);
-webkit-clip-path:inset(0 100% 0 100%)
}
100% {
clip-path: inset(0% 0% 0% 0%);
-webkit-clip-path: inset(0% 0% 0% 0%)
}
}
.pageloader_center_h.pageloader_done {
animation-name: loadingCenterDone
}
@keyframes loadingCenterDone {
0% {
clip-path: inset(0% 0% 0% 0%);
-webkit-clip-path: inset(0% 0% 0% 0%)
}
100% {
clip-path:inset(0 100% 0 100%);
-webkit-clip-path:inset(0 100% 0 100%)
}
}
.pageloader_center_v.pageloader_click {animation-name: loadingCenterV}
@keyframes loadingCenterV {
0% {
clip-path:inset(100% 0 100% 0);
-webkit-clip-path:inset(100% 0 100% 0)
}
100% {
clip-path: inset(0% 0% 0% 0%);
-webkit-clip-path: inset(0% 0% 0% 0%)
}
}
.pageloader_center_v.pageloader_done {animation-name: loadingCenterVDone}
@keyframes loadingCenterVDone {
0% {
clip-path: inset(0% 0% 0% 0%);
-webkit-clip-path: inset(0% 0% 0% 0%)
}
100% {
clip-path:inset(100% 0 100% 0);
-webkit-clip-path:inset(100% 0 100% 0)
}
}
.pageloader_pa.pageloader_click {animation-name: loadingPA}
@keyframes loadingPA {
0% {
clip-path:polygon(0 0, 100% 100%, 100% 100%, 0 0);
-webkit-clip-path:polygon(0 0, 100% 100%, 100% 100%, 0 0)
}
100% {
clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%);
-webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%)
}
}
.pageloader_pa.pageloader_done {animation-name: loadingPADone}
@keyframes loadingPADone {
0% {
clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%);
-webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%)
}
100% {
clip-path:polygon(0 0, 100% 100%, 100% 100%, 0 0);
-webkit-clip-path:polygon(0 0, 100% 100%, 100% 100%, 0 0)
}
}
.pageloader_pb.pageloader_click {animation-name: loadingPB}
@keyframes loadingPB {
0% {
clip-path:polygon(0 0, 100% 0, 0% 0%, 0% 100%);
-webkit-clip-path:polygon(0 0, 100% 0, 0% 0%, 0% 100%)
}
100% {
clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%);
-webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%)
}
}
.pageloader_pb.pageloader_done {animation-name: loadingPBDone}
@keyframes loadingPBDone {
0% {
clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%);
-webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%)
}
100% {
clip-path:polygon(100% 100%, 100% 0, 100% 100%, 0% 100%);
-webkit-clip-path:polygon(100% 100%, 100% 0, 100% 100%, 0% 100%)
}
}
.pageloader_pc.pageloader_click {animation-name: loadingPC}
@keyframes loadingPC {
0% {
clip-path:polygon(0 0, 100% 0, 51% 0, 49% 0);
-webkit-clip-path:polygon(0 0, 100% 0, 51% 0, 49% 0)
}
100% {
clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%);
-webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%)
}
}
.pageloader_pc.pageloader_done {animation-name: loadingPCDone}
@keyframes loadingPCDone {
0% {
clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%);
-webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%)
}
100% {
clip-path:polygon(49% 100%, 51% 100%, 100% 100%, 0% 100%);
-webkit-clip-path:polygon(49% 100%, 51% 100%, 100% 100%, 0% 100%)
}
}
.pageloader_pd.pageloader_click {animation-name: loadingPD}
@keyframes loadingPD {
0% {
clip-path:polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%);
-webkit-clip-path:polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%)
}
100% {
clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%);
-webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%)
}
}
.pageloader_pd.pageloader_done {animation-name: loadingPDDone}
@keyframes loadingPDDone {
0% {
clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%);
-webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%)
}
100% {
clip-path:polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%);
-webkit-clip-path:polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%)
}
}
.pageloader_pe.pageloader_click {animation-name: loadingPE}
@keyframes loadingPE {
0% {
clip-path:polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%);
-webkit-clip-path:polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%)
}
50% {
clip-path:polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
-webkit-clip-path:polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%)
}
100% {
clip-path:polygon(50% 0%, 100% 0, 100% 100%, 50% 100%, 0 100%, 0 0);
-webkit-clip-path:polygon(50% 0%, 100% 0, 100% 100%, 50% 100%, 0 100%, 0 0)
}
}
.pageloader_pe.pageloader_done {animation-name: loadingPEDone}
@keyframes loadingPEDone {
0% {
clip-path:polygon(50% 0%, 100% 0, 100% 100%, 50% 100%, 0 100%, 0 0);
-webkit-clip-path:polygon(50% 0%, 100% 0, 100% 100%, 50% 100%, 0 100%, 0 0)
}
50% {
clip-path:polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
-webkit-clip-path:polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%)
}
100% {
clip-path:polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%);
-webkit-clip-path:polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%)
}
}
.pageloader_done_all {
opacity: 0;
visibility: hidden
}