- Store
- Mac
- iPad
- iPhone
- Watch
- AirPods
- TV & Home
- Entertainment
- Accessories
- Support
<li><a class='list' href='#'><svg height="44" viewBox="0 0 14 44" width="14" xmlns="http://www.w3.org/2000/svg">
<path d="m11.3535 16.0283h-1.0205a3.4229 3.4229 0 0 0 -3.333-2.9648 3.4229 3.4229 0 0 0 -3.333 2.9648h-1.02a2.1184 2.1184 0 0 0 -2.117 2.1162v7.7155a2.1186 2.1186 0 0 0 2.1162 2.1167h8.707a2.1186 2.1186 0 0 0 2.1168-2.1167v-7.7155a2.1184 2.1184 0 0 0 -2.1165-2.1162zm-4.3535-1.8652a2.3169 2.3169 0 0 1 2.2222 1.8652h-4.4444a2.3169 2.3169 0 0 1 2.2222-1.8652zm5.37 11.6969a1.0182 1.0182 0 0 1 -1.0166 1.0171h-8.7069a1.0182 1.0182 0 0 1 -1.0165-1.0171v-7.7155a1.0178 1.0178 0 0 1 1.0166-1.0166h8.707a1.0178 1.0178 0 0 1 1.0164 1.0166z"></path>
</svg>
</li>
</ul>
</div>
</nav>
<div class='content-wrapper'>
<h2 class='hero1-heading'>iPhone 14 Pro</h2>
<h3 class='hero1-subheading'>Pro. Beyond.</h3>
<div class='a-container'>
<a class='link' href=''>Learn More
<svg class='right-chevron' xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
</svg></a>
<a class='link' href=''>Buy
<svg class='right-chevron' xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
</svg></a>
</div>
</div>
</div>
Wonderfull
<div class='tag-container flex'>
<div class='a-containter'>
<a class='Learnlink' href=''>Learn More
<svg class='right-chevron' xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
</svg></a>
<a class='Buylink' href=''>Buy
<svg class='right-chevron' xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
</svg></a>
</div>
</div>
</div>
<div class="card1">
<h2 class='card1-heading'>iPad</h2>
<h3 class='card1-subheading'>Lovable.Drawable.Magical</h3>
<div class='ipad-heading-wrapper'>
<a class='link' href=''>Learn More
<svg class='right-chevron' xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
</svg></a>
<a class='link' href=''>Buy
<svg class='right-chevron' xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
</svg></a>
</div>
</div>
<div class="card2">
<h2 class='card2-heading'>Macbook Pro</h2>
<h3 class='card2-subheading'>Supercharged by M2 Pro and M2 Max</h3>
<div class='a-container'>
<a class='link' href=''>Learn More
<svg class='right-chevron' xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
</svg></a>
<a class='link' href=''>Apply Now
<svg class='right-chevron' xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
</svg></a>
</div>
</div>
<div class="card4">
<h2 class='card4-heading'>Apple Card</h2>
<h3 class='card4-subheading'>Get up to 3% Daily Cash Back with every purchase</h3>
<div class='a-container'>
<a class='link' href=''>Learn More
<svg class='right-chevron' xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
</svg></a>
<a class='link' href=''>Apply Now
<svg class='right-chevron' xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
</svg></a>
</div>
</div>
<div class="card3">
<h2 class='card3-heading'>HomePod</h2>
<h3 class='card3-subheading'>Profound Sound</h3>
<div class='a-container'>
<a class='link' href=''>Learn More
<svg class='right-chevron' xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
</svg></a>
<a class='link' href=''>Buy
<svg class='right-chevron' xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
</svg></a>
</div>
- 1. Trade-in values will vary based on the condition, year, and configuration of your eligible trade-in device. Not all devices are eligible for credit. You must be at least 18 years old to be eligible to trade in for credit or for an Apple Gift Card. Trade-in value may be applied toward qualifying new device purchase, or added to an Apple Gift Card. Actual value awarded is based on receipt of a qualifying device matching the description provided when estimate was made. Sales tax may be assessed on full value of a new device purchase. In-store trade-in requires presentation of a valid photo ID (local law may require saving this information). Offer may not be available in all stores, and may vary between in-store and online trade-in. Some stores may have additional requirements. Apple or its trade-in partners reserve the right to refuse or limit quantity of any trade-in transaction for any reason. More details are available from Apple’s trade-in partner for trade-in and recycling of eligible devices. Restrictions and limitations may apply.
- To access and use all the features of Apple Card, you must add Apple Card to Wallet on an iPhone or iPad with the latest version of iOS or iPadOS. Update to the latest version by going to Settings > General > Software Update. Tap Download and Install.
- Available for qualifying applicants in the United States.
- Apple Card is issued by Goldman Sachs Bank USA, Salt Lake City Branch.
- Learn more about how Apple Card applications are evaluated at support.apple.com/kb/HT209218.
- A subscription is required for Apple TV+.
- Major League Baseball trademarks and copyrights are used with permission of MLB Advanced Media, L.P. All rights reserved.
<ul class='directory-section-list'>
<li><h4>Account</h4></li>
<li class='directory'> <a href="">Manage Your Apple ID</a> </li>
<li class='directory'> <a href="">Apple Store Account</a> </li>
<li class='directory'><a href="">iCloud.com</a> </li>
</ul>
</div>
<div class='directory-section'>
<ul class='directory-section-list'>
<li><h4>Entertainment</h4></li>
<li class='directory'> <a href="">Apple One</a> </li>
<li class='directory'><a href="">Apple TV+ </a> </li>
<li class='directory'> <a href="">Apple Music</a> </li>
<li class='directory'> <a href="">Apple Arcade</a> </li>
<li class='directory'> <a href="">Apple Fitness+</a> </li>
<li class='directory'> <a href="">Apple News+</a> </li>
<li class='directory'> <a href="">Apple Podcasts</a> </li>
<li class='directory'> <a href="">Apple Books</a> </li>
<li class='directory'> <a href="">App Store</a> </li>
</ul>
</div>
</div>
<div class='directory-wrapper'>
<div class='directory-section'>
<ul class='directory-section-list'>
<li ><h4>Apple Store</h4></li>
<li class='directory'> <a href="">Find a Store</a> </li>
<li class='directory'> <a href="">Genius Bar</a> </li>
<li class='directory'> <a href="">Today at Apple</a> </li>
<li class='directory'> <a href="">Apple Camp</a> </li>
<li class='directory'> <a href="">Apple Store App</a> </li>
<li class='directory'> <a href="">Certified Refurbished</a> </li>
<li class='directory'> <a href="">Apple Trade In</a> </li>
<li class='directory'> <a href="">Financing</a> </li>
<li class='directory'> <a href="">Carrier Deals at Apple</a> </li>
<li class='directory'> <a href="">Order Status</a> </li>
<li class='directory'> <a href="">Shopping Help</a> </li>
</ul>
</div>
</div>
<div class='directory-wrapper'>
<div class='directory-section'>
<ul class='directory-section-list'>
<li><h4>For Business</h4></li>
<li class='directory'> <a href="">Apple and Business</a> </li>
<li class='directory'> <a href="">Shop for Business</a> </li>
</ul>
</div>
<div class='directory-section'>
<ul class='directory-section-list'>
<li><h4>For Education</h4></li>
<li class='directory'> <a href="">Apple and Education</a> </li>
<li class='directory'> <a href="">Shop for K-12</a> </li>
<li class='directory'> <a href="">Shop for College</a> </li>
</ul>
</div>
<div class='directory-section'>
<ul class='directory-section-list'>
<li><h4>For Healthcare</h4></li>
<li class='directory'> <a href="">Apple in Healthcare</a> </li>
<li class='directory'> <a href="">Health on Apple Watch</a> </li>
<li class='directory'> <a href="">Health Records on iPhone</a> </li>
</ul>
</div>
<div class='directory-section'>
<ul class='directory-section-list'>
<li><h4>For Government</h4></li>
<li class='directory'> <a href="">Shop for Government</a> </li>
<li class='directory'> <a href="">Shop for Veterans and Military</a> </li>
</ul>
</div>
</div>
<div class='directory-wrapper'>
<div class='directory-section'>
<ul class='directory-section-list'>
<li><h4>Apple Values</h4></li>
<li class='directory'> <a href="">Accessibilty</a> </li>
<li class='directory'> <a href="">Education</a> </li>
<li class='directory'> <a href="">Environment</a> </li>
<li class='directory'> <a href="">Inclusion and Diversity</a> </li>
<li class='directory'> <a href="">Privacy</a> </li>
<li class='directory'> <a href="">Racial Equity and Justice</a> </li>
<li class='directory'> <a href="">Supplier Responsibility</a> </li>
</ul>
</div>
<div class='directory-section'>
<ul class='directory-section-list'>
<li><h4>About Apple</h4></li>
<li class='directory'> <a href="">Newsroom</a> </li>
<li class='directory'> <a href="">Apple Leadership</a> </li>
<li class='directory'> <a href="">Career Opportunities</a> </li>
<li class='directory'> <a href="">Investors</a> </li>
<li class='directory'> <a href="">Ethics & Compliance</a> </li>
<li class='directory'> <a href="">Events</a> </li>
<li class='directory'> <a href="">Contact Apple</a> </li>
</ul>
</div>
</div>
</nav>
</section>
}
main{ max-width:100%; margin: 0; padding: 0;
} .hero1-wrapper{ background-image: url('https://www.apple.com/v/home/az/images/heroes/iphone-14-pro/hero_iphone14pro_spring__9xo85pm6sbmm_large_2x.jpg'); background-size: cover; background-repeat: no-repeat; background-position: center; display: flex-column; height: 800px; align-items: center; padding-top: 40px;
}
.hero2{ background-image: url(https://www.apple.com/v/home/az/images/heroes/iphone-14/hero_iphone14_yellow__eun20sn4imi6_medium_2x.jpg); background-size: cover; background-position: center; height:800px;} .hero3{ height: 800px; line-height: 0.5em; padding-top: 40px; padding-bottom: 100px;
} .hero3{ background-image: url(https://www.apple.com/v/home/az/images/heroes/apple-watch-series-8/hero_apple_watch_series_8_spring__b1y8wb7xjc9y_medium_2x.jpg); background-size: cover; background-repeat: no-repeat; background-position: center;
}
.hero4{background-image: url(https://www.apple.com/v/home/az/images/promos/iphone-tradein/iphone_tradein_promo__d5au3rkw5kuq_large.jpg); background-size: cover; background-position: center; width:100%; }
.hero5{ background-image: url(https://www.apple.com/v/home/az/images/promos/wwdc23-announce/promo_wwdc23__b68ptht3mro2_medium_2x.jpg); background-size: cover; display: flex-column; direction: flex-start; width:100%; padding-top: 50px; }
.card1{ background-image: url(https://www.apple.com/v/home/az/images/promos/ipad/promo_ipad__fioegapg12qi_medium_2x.jpg); background-position: center; background-repeat: no-repeat; }
.card2{ background-image: url(https://www.apple.com/v/home/az/images/promos/macbook-pro-14-and-16/promo_mbp__ek7p477bkp6q_medium_2x.jpg); background-position: center; display: flex-column; width:100%;}
.card3{ background-image: url(https://www.apple.com/v/home/az/images/promos/homepod/promo_homepod__f7jnolq94m2y_medium_2x.jpg); background-position: center; background-repeat: no-repeat;}
.card4{ background-image: url(https://www.apple.com/v/home/az/images/promos/apple-card/tile__cauwwcyyn9hy_medium_2x.jpg); background-position: center; background-repeat: no-repeat;
}
.navbar-container1{ position: sticky; top: 0; } .navbar-links{ display: flex; justify-content: space-evenly; align-items: center; list-style: none; background-color:rgb(22,22,23,.8); margin: 0 auto; } .list{ color: white; text-decoration: none; } span{ color: black; } .subheader-container{ display: flex; justify-content: center; align-items:center; height: 50px; color: black; }
.hero3-heading,.hero3-subheading,.hero5-heading,.hero5-subheading,.card2-heading,.card2-subheading{ color:white; display: flex; align-items: center; justify-content: center; } .hero2-heading,.hero2-subheading,.hero4-heading,.hero4-subheading{ display: flex; align-items: center; justify-content: center; font-size: 1em; }
.card1-heading,.card1-subheading,.card4-heading,.card4-subheading,.card3-heading{ display: flex; align-items: center; justify-content: center; }
.hero2-heading{ font-size: 2em; } .hero2-subheading{ font-size: 2em; }
.grid-container{ display: grid; justify-content: center; grid-template-rows: 600px 600px 600px; grid-template-columns: 50% 50%; gap: 10px; padding-bottom: 10px;
} .link{ display: flex; justify-content: center; color: blue; text-decoration: none; } h2, .hero3-heading{ margin: 0px; padding-top: 55px; font-size: 2em; line-height: 1em; } .hero3-subheading,.hero4-heading{ padding-bottom: 30px; } .heading-wrapper{ line-height: 1em; }
.hero1-heading,.hero1-subheading,.card3-heading,.card3-subheading{ display: flex; color: white; align-items: center; justify-content: center; }
.right-chevron{ width: 15px; } .a-container{ display: flex; justify-content: center; } .apple{ width: 20px; background-color: white; }
.nav-directory{ font-size: 1em; line-height:inherit; display: flex; flex-wrap: nowrap; justify-content: space-around; } .directory,h4{ list-style:none; margin: 0px; line-height: 1.5em; } .hero1-heading{ font-size:2em;
} .hero1-subheading{ font-size: 1.5em; } .footer-div{ list-style: none;
} .footer-content{ width: 50%; margin-left: 400px; } .nav-directory{ width: 50%; margin-left: 400px; padding: 0; } .directory-section-list{ list-style: none } .hero4-heading,.hero4-subheading,.hero5-heading,.hero5-subheading,.card1-heading,.card1-subheading,.card-2heading,.card2-subheading,.card4-heading,.card4-subheading,.card3-heading,.card3-subheading{ padding: 0; margin: 0; } .tradein{ height: 30px; } .hero4{ padding: 35px; } .a-container,.tag-container{ display: flex; justify-content: center; flex-wrap: nowrap;
} .Buylink,.Learnlink{ color: blue; text-decoration: none; } .card1-heading,.card2-heading,.card4-heading,.card3-heading{ padding-top: 30px; }
.ipad-heading-wrapper{ display: flex; justify-content: center; } </style>