
/*** Arabic Fonts ****/

/********************/

#globalnav .globalnav-submenu-list-item-elevated, 
#globalnav .globalnav-submenu-list-item-elevated:lang(ar), 
#ac-localnav .ac-ln-title, 
#ac-localnav .ac-ln-title:lang(ar), 
.typography-eyebrow-elevated, 
.typography-eyebrow-elevated:lang(ar), 
.typography-label, 
.typography-label:lang(ar), 
.typography-tout, 
.typography-tout:lang(ar), 
.typography-callout-tight, 
.typography-callout-tight:lang(ar), 
.typography-hero-headline, 
.typography-hero-headline:lang(ar), 
.typography-hero-intro, 
.typography-hero-intro:lang(ar), 
.typography-headline-elevated-tight, 
.typography-headline-elevated-tight:lang(ar), 
.typography-plan-description, 
.typography-plan-description:lang(ar), 
.typography-products-headline, 
.typography-products-headline:lang(ar), 
.typography-products-overlay-copy, 
.typography-products-overlay-copy:lang(ar), 
.typography-headline-tight, 
.typography-headline-tight:lang(ar), 
.typography-headline-tight-alt, 
.typography-headline-tight-alt:lang(ar), 
.typography-modal-callout, 
.typography-modal-callout:lang(ar), 
.typography-modal-copy, 
.typography-modal-copy:lang(ar) {
    letter-spacing: 0;
    font-family: "SF Pro AR Display", "SF Pro Gulf", "SF Pro Display",
    "SF Pro Icons", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
  
#globalnav .globalnav-link, 
#globalnav .globalnav-link:lang(ar), 
#globalnav .globalnav-link-apple, 
#globalnav .globalnav-link-apple:lang(ar), 
#globalnav .globalnav-submenu-header, 
#globalnav .globalnav-submenu-header:lang(ar), 
#globalnav .globalnav-submenu-list-item, 
#globalnav .globalnav-submenu-list-item:lang(ar), 
#globalmessage-segment, 
#globalmessage-segment:lang(ar), 
#ac-globalfooter, #ac-globalfooter select, #ac-globalfooter button, 
#ac-globalfooter:lang(ar), #ac-globalfooter select:lang(ar), #ac-globalfooter button:lang(ar), 
#ac-globalfooter, 
#ac-globalfooter:lang(ar), 
#ac-globalfooter .ac-gf-sosumi p, #ac-globalfooter .ac-gf-sosumi li, 
#ac-globalfooter .ac-gf-sosumi p:lang(ar), #ac-globalfooter .ac-gf-sosumi li:lang(ar), 
#ac-globalfooter .ac-gf-breadcrumbs-path, 
#ac-globalfooter .ac-gf-breadcrumbs-path:lang(ar), 
#ac-globalfooter .ac-gf-directory, 
#ac-globalfooter .ac-gf-directory:lang(ar), 
#ac-globalfooter .ac-gf-directory-column-section-title-button, #ac-globalfooter .ac-gf-directory-column-section-title > .ac-gf-directory-column-section-title-text, 
#ac-globalfooter .ac-gf-directory-column-section-title-button:lang(ar), #ac-globalfooter .ac-gf-directory-column-section-title > .ac-gf-directory-column-section-title-text:lang(ar), 
#ac-localnav .ac-ln-menu, 
#ac-localnav .ac-ln-menu:lang(ar), 
#ac-localnav .ac-ln-button, 
#ac-localnav .ac-ln-button:lang(ar), 
html, 
[lang]:lang(ar), 
body, 
body:lang(ar), 
.button, 
.button:lang(ar), 
.typography-body-tight, 
.typography-body-tight:lang(ar), 
.typography-caption, 
.typography-caption:lang(ar), 
.typography-plan-copy, 
.typography-plan-copy:lang(ar), 
.typography-products-eyebrow, 
.typography-products-eyebrow:lang(ar), 
.typography-more-to-give-copy, 
.typography-more-to-give-copy:lang(ar), 
.typography-more-to-give-cta, 
.typography-more-to-give-cta:lang(ar), 
.tabnav-link, 
.tabnav-link:lang(ar), 
.archive-headline, 
.archive-headline:lang(ar), 
.section-newsroom .newsroom-grid .newsroom-item-content .newsroom-item-category, 
.section-newsroom .newsroom-grid .newsroom-item-content .newsroom-item-category:lang(ar), 
.section-newsroom .newsroom-grid .newsroom-item-content .newsroom-item-title, 
.section-newsroom .newsroom-grid .newsroom-item-content .newsroom-item-title:lang(ar), 
.section-newsroom .newsroom-grid .newsroom-item-content .newsroom-item-date, 
.section-newsroom .newsroom-grid .newsroom-item-content .newsroom-item-date:lang(ar), 
#ac-localeswitcher, #ac-localeswitcher select, #ac-localeswitcher button, 
#ac-localeswitcher .ac-ls-copy, 
#ac-localeswitcher .ac-ls-continue {
    letter-spacing: 0;
    font-family: "SF Pro AR Text", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons",
    "Helvetica Neue", Helvetica, Arial, sans-serif;
}
  
@media only screen and (max-width: 833px) {
#globalnav .globalnav-link, 
#globalnav .globalnav-link:lang(ar), 
#globalnav .globalnav-link-apple, 
#globalnav .globalnav-link-apple:lang(ar), 
#globalnav .globalnav-submenu-list-item-elevated, 
#globalnav .globalnav-submenu-list-item-elevated:lang(ar) { 
    font-family: "SF Pro AR Display", "SF Pro Gulf", "SF Pro Display",
    "SF Pro Icons", "Helvetica Neue", Helvetica, Arial, sans-serif; 
  }

#globalnav .globalnav-submenu-header, 
#globalnav .globalnav-submenu-header:lang(ar), 
#globalnav .globalnav-submenu-list-item, 
#globalnav .globalnav-submenu-list-item:lang(ar) { 
    font-family: "SF Pro AR Text", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons",
    "Helvetica Neue", Helvetica, Arial, sans-serif; 
  }
}

@media only screen and (max-width: 1068px) {
.typography-eyebrow-elevated, 
.typography-eyebrow-elevated:lang(ar), 
.typography-label, 
.typography-label:lang(ar), 
.typography-callout-tight, 
.typography-callout-tight:lang(ar), 
.typography-hero-headline, 
.typography-hero-headline:lang(ar), 
.typography-hero-intro, 
.typography-hero-intro:lang(ar), 
.typography-headline-elevated-tight, 
.typography-headline-elevated-tight:lang(ar), 
.typography-plan-description, 
.typography-plan-description:lang(ar), 
.typography-headline-tight, 
.typography-headline-tight:lang(ar), 
.typography-headline-tight-alt, 
.typography-headline-tight-alt:lang(ar) { 
    font-family: "SF Pro AR Display", "SF Pro Gulf", "SF Pro Display",
    "SF Pro Icons", "Helvetica Neue", Helvetica, Arial, sans-serif; 
  }

.typography-products-overlay-copy, 
.typography-products-overlay-copy:lang(ar), 
.typography-modal-copy, 
.typography-modal-copy:lang(ar), 
.typography-more-to-give-copy, 
.typography-more-to-give-copy:lang(ar), 
.typography-more-to-give-cta, 
.typography-more-to-give-cta:lang(ar) { 
    font-family: "SF Pro AR Text", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons",
    "Helvetica Neue", Helvetica, Arial, sans-serif; 
  }
}

@media (max-width: 833px) {
#ac-localnav .ac-ln-title, 
#ac-localnav .ac-ln-title:lang(ar) { 
    font-family: "SF Pro AR Display", "SF Pro Gulf", "SF Pro Display",
    "SF Pro Icons", "Helvetica Neue", Helvetica, Arial, sans-serif; 
  }

#ac-localnav .ac-ln-menu, 
#ac-localnav .ac-ln-menu:lang(ar) { 
    font-family: "SF Pro AR Text", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons",
    "Helvetica Neue", Helvetica, Arial, sans-serif; 
  }
}

@media only screen and (max-width: 734px) {
.typography-eyebrow-elevated, 
.typography-eyebrow-elevated:lang(ar), 
.typography-callout-tight, 
.typography-callout-tight:lang(ar), 
.typography-hero-intro, 
.typography-hero-intro:lang(ar), 
.typography-headline-elevated-tight, 
.typography-headline-elevated-tight:lang(ar), 
.typography-plan-description, 
.typography-plan-description:lang(ar), 
.typography-products-headline, 
.typography-products-headline:lang(ar), 
.typography-headline-tight, 
.typography-headline-tight:lang(ar), 
.typography-headline-tight-alt, 
.typography-headline-tight-alt:lang(ar), 
.story-card .story-headline, 
.story-card .story-headline:lang(ar) { 
    font-family: "SF Pro AR Display", "SF Pro Gulf", "SF Pro Display",
    "SF Pro Icons", "Helvetica Neue", Helvetica, Arial, sans-serif; 
  }

.typography-plan-copy, 
.typography-plan-copy:lang(ar), 
.typography-products-eyebrow, 
.typography-products-eyebrow:lang(ar), 
.typography-products-overlay-copy, 
.typography-products-overlay-copy:lang(ar), 
.section-values-router .item-container .gallery-item .item-copy, 
.section-values-router .item-container .gallery-item .item-copy:lang(ar) { 
    font-family: "SF Pro AR Text", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons",
    "Helvetica Neue", Helvetica, Arial, sans-serif; 
  }
}

@media only screen and (max-width: 734px) and (max-width: 1068px) {
.story-card .story-headline, 
.story-card .story-headline:lang(ar) { 
    font-family: "SF Pro AR Display", "SF Pro Gulf", "SF Pro Display",
    "SF Pro Icons", "Helvetica Neue", Helvetica, Arial, sans-serif; 
  }

}

@media only screen and (max-width: 734px) and (max-width: 734px) {
.story-card .story-headline, 
.story-card .story-headline:lang(ar) { 
    font-family: "SF Pro AR Display", "SF Pro Gulf", "SF Pro Display",
    "SF Pro Icons", "Helvetica Neue", Helvetica, Arial, sans-serif; 
  }

}

@media only screen and (min-width: 735px) {
.section-you .tile.tile-trade-in .tile-copy, 
.section-you .tile.tile-trade-in .tile-copy:lang(ar) { 
    font-family: "SF Pro AR Display", "SF Pro Gulf", "SF Pro Display",
    "SF Pro Icons", "Helvetica Neue", Helvetica, Arial, sans-serif; 
  }

}

@media only screen and (min-width: 735px) and (max-width: 734px) {
.section-you .tile.tile-trade-in .tile-copy, 
.section-you .tile.tile-trade-in .tile-copy:lang(ar) { 
    font-family: "SF Pro AR Display", "SF Pro Gulf", "SF Pro Display",
    "SF Pro Icons", "Helvetica Neue", Helvetica, Arial, sans-serif; 
  }

}


/********************/

/*** Arabic Fonts ****/



#plan-gallery {
    direction: ltr;
}

.plan-item-copy {
    direction: rtl;
    text-align: right;
}

.svg-chevron {
    transform: rotate(180deg);
}

.additional-resources-blocks {
  text-align: right;
}

.section-hero .hero-headline .lottie {
  top: 0.1em;
}

.plan-gallery .controls{
  right: 0;
}

@media only screen and (min-width: 1069px) {
.section-products .tile-enclosure .tile-media .overview_card_enclosure_text .sosumi-container{
        --image-word-offset: 163px;
        top: 55px;
        right: 159px;
    
    }

}

@media only screen and (min-width: 735px) and (max-width: 1068px) {
  .section-products .tile-enclosure .tile-media .overview_card_enclosure_text .sosumi-container{
  --image-word-offset: 115px;
  top: 51px;
  right: 114px;
}
}

@media only screen and (max-width: 734px) {
  .section-products .tile-enclosure .tile-media .overview_card_enclosure_text .sosumi-container{
  --image-word-offset: 83px;
  top: 33px;
  right: 83px;
}
}

.reports-list-item,
.progress-reports-item {
  text-align: right;
}


.section-hero .hero-product-macmini {
  display: block;
  grid-row-start: watch;
  grid-column-start: watch;

  transform: translate(-50%, -90%);
}

.section-products .tile-enclosure .tile-copy {
  top: 251px;
  left: 131px;
}

.section-products .tile-enclosure .tile-media .overview-card-enclosure-text {
  margin-inline-start: 0;
}

.overview_card_recover_text {
    margin-inline-start: 30%!important;

}

@media only screen and (min-width: 735px) and (max-width: 1068px) {
  .overview_card_recover_text {
    margin-inline-start: 30%!important;

}
}

.section-products .tile-recovery .overview-card-recover-text img {
  margin-block-start: -20px;
}

.overview-plan-text-use {
  --p-width: unset;
}

#band .overview-card-enclosure-arrow {
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  margin-right: 70px;
  margin-top: 18px;
}

@media only screen and (max-width: 734px) {
#band .overview-card-enclosure-arrow {
    margin-right: 45px;
    margin-top: 18px;

}
}

.archive-headline {
  text-align: right;
}

.section-products .scroll-container .tile .tile-overlay-copy > ul {
    list-style-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='8' viewBox='0 0 31 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%2300D959' d='M10.055 5.518c.405-.222.673-.382.953-.52.9-.444 1.84-.823 2.702-1.33 1.441-.849 1.39-2.344-.02-3.23-.87-.545-1.68-.596-2.575-.07-.66.388-1.365.705-2.065 1.02-1.865.836-3.66 1.79-5.347 2.948-.384.264-.842.424-1.273.618-.242.11-.5.182-.744.286-1.913.813-2.232 2.346-.783 3.821.265.27.578.51.904.705a10.416 10.416 0 002.328 1.891c1.448 1.578 3.182 2.8 4.952 3.978.804.534 1.672.473 2.277-.126.615-.609.666-1.563.096-2.34-.402-.547-.916-.998-1.414-1.458-.712-.66-1.438-1.305-2.2-1.995.335-.27.698-.167 1.02-.168 4.231-.009-.22.151 4.007.295 5.735.196 6.456.534 12.197.56a48.628 48.628 0 011.685-.02c.385-.012.78-.036 1.12-.232.424-.243.88-.33 1.356-.359a2.035 2.035 0 01.35-.051C30.442 9.533 31.009 8.856 31 8.052c-.008-.78-.535-1.428-1.368-1.633-.312-.077-.643-.097-.966-.11-10.374-.42-7.062-.797-17.448-.662-.334.004-.683.057-1.163-.129'/%3E%3C/svg%3E");

}

.section-products .tile-recovery .lottie-with-picture {
    position: absolute;
    top: 50px;
    left: 35px;
}

@media only screen and (max-width: 734px) {
.section-products .tile-recovery .lottie-with-picture {
    position: absolute;
    top: 25px;
    left: 25px;
}
}

@media only screen and (min-width: 735px) and (max-width: 1068px) {
.section-products .tile-recovery .lottie-with-picture {
    position: absolute;
    top: 45px;
    left: 45px;
}
}

#band .tile-media [role="img"] {
  direction: ltr;
}

.section-products .tile-enclosure .tile-media .lottie-with-picture {
    margin: -10px 0 0 116px;
}

[role="presentation"] .tabnav-link {
  direction: ltr;
}

.tablist {
  direction: rtl;
}

@media only screen and (min-width: 1069px) {
  .section-products .tile-image-sosumi .sosumi-container {
    top: 70px;
    right: 108px;
  }
}

@media only screen and (min-width: 735px) and (max-width: 1068px) {
  .section-products .tile-image-sosumi .sosumi-container {
    top: 61px;
    right: 98px;
  }
}

@media only screen and (max-width: 734px) {
  .section-products .tile-image-sosumi .sosumi-container {
    top: 29px;
    right: 140px;
  }
}

.section-you .typography-headline-elevated-tight {
  line-height: 1.1498;
}

.section-plan .hero-hardware-small .overview-hero-hero-ipad {
  margin-inline-end: auto;
  margin-inline-start: 0;
}

#modal-clean-water-program .typography-modal-callout {
  line-height: 1.35;
}

#layer_svg {
		width: 163.25px;
		transform: translateY(20px);
    margin-top: -27px;
	}
  .section-hero .hero-headline {
		transform: translateY(-15px);
	}

	.section-hero .hero-headline .lottie {
		height: 85px;
	}

@media only screen and (min-width: 735px) and (max-width: 1068px) {
  #layer_svg {
		width: 122.44px;
		height: 64px;
		transform: translateY(15px);
     margin-top: -19px;
	}
  .section-hero .hero-headline .lottie {
		height: 64px;
	}
}

@media only screen and (max-width: 734px) {
  	#layer_svg {
		width: 122.44px;
		height: 64px;
		transform: translateY(15px);
    margin-top: -13px;
    margin-right: -7px;
	}
}

@media only screen and (max-width: 1068px) {
    .section-hero .hero-intro {
        max-width: 41ch;
    }
}

@media only screen and (max-width: 734px) {
  .section-hero .hero-intro {
    max-width: 30ch;
  }
}

@media only screen and (min-width: 1069px) {
  .section-progress .tile-materials .progress-copy {
    max-width: 34ch;
  }
}

#packaging-shipping .typography-products-headline {
  line-height: 1.2928571429;
}

@media only screen and (min-width: 1069px) {
  .section-products .tile-recovery .products-headline {
    max-width: 20ch;
  }
}

.typography-modal-callout {
  line-height: 1.27;
}

.story-card-power .story-headline {
  max-width: 23ch;
}

@media only screen and (min-width: 1587px) {
  .section-values-router .paddlenav {
    display: none;
  }
}

@media only screen and (min-width: 735px) and (max-width: 1068px) {
  .section-people .story-card-restore-fund .story-headline {
    max-width: 16ch; 
  }
}

@media only screen and (max-width: 734px) {
    .section-hero .hero-headline {
        margin-block: 18px 40px;
        max-width: 17ch;
    }
}


@media only screen and (max-width: 734px) {
    .plan-gallery .plan-item-description-product-use .plan-item-description-copy {
        max-width: 18ch;
    }
}

@media only screen and (max-width: 734px) {
  .newsroom-header {
    line-height: 1.17;
  }
}

.section-products .tile-media .inline-video .frame-start {
  left: auto;
  right: 0;
}

@media only screen and (min-width: 1069px) {
.section-plan {
    margin-block-start: 393px;
}
}

@media only screen and (min-width: 1069px) {
  .section-people .story-card-restore-fund .story-headline {
    max-width: 17ch;
  }
}

@media only screen and (min-width: 735px) and (max-width: 1068px) {
  .section-products .tile-packaging-shipping .lottie-arrow {
    left: 60px;
    bottom: 116px;
  }
}

@media only screen and (max-width: 734px) {
  .overview_card_mac_mini_illustration,
  .overview_card_mac_mini_text {
    margin-top: 15px;
  }
}

@media only screen and (max-width: 734px) {
  .section-people .story-card-clean-water-program .story-headline {
    max-width: 12ch;
  }
}

@media only screen and (max-width: 734px) {
  .section-people .story-card-restore-fund .story-headline {
    max-width: 11ch;
  }
}

.section-products .tile-recovery .overview_card_recover {
    align-self: start;
}

@media only screen and (max-width: 734px) {
  .section-products .tile-packaging-shipping .products-headline {
    max-width: 16ch;
  }
}

@media only screen and (max-width: 734px) {
  .hero-hardware-small-container {
    direction: ltr;
  }
}

.section-values-router .tile {
  margin-inline-start: 0;
  margin-inline-end: 0;
}