<!-- include sections/checkout  -->
<section class="cart checkout cart-variation-3">
	<div class="container">
		<div class="section-header">
			<ul class="nav nav-tabs nav-cart-steps">
				<li class="nav-item">
					<a class="nav-link passed" aria-current="page" href="#">
						<span class="no">1</span>
						<strong>Shopping bag</strong>
					</a>
				</li>
				<li class="nav-item">
					<a class="nav-link active" href="#">
						<span class="no">2</span>
						<strong>Shipping</strong>
					</a>
				</li>
				<li class="nav-item">
					<a class="nav-link" href="#">
						<span class="no">3</span>
						<strong>Payment</strong>
					</a>
				</li>
			</ul>
		</div>
		<div class="section-content">
			<div class="cart-checkout-form">
				<form class="form-checkout">
					<h3 class="section-title">Shipping</h3>
					<div class="form-checkout-section">
						<div class="form-checkout-section-header">
							<h5>Contact</h5>
							<a href="#link">Login</a>
						</div>
						<div class="form-checkout-section-content">
							<div class="form-group">
								<input type="email" class="form-control form-control-lg" placeholder="Your email" />
							</div>
							<div class="form-check">
								<input type="checkbox" class="form-check-input" id="email-me">
								<label class="form-check-label" for="email-me">Email me with news and offers</label>
							</div>
						</div>
					</div>
					<div class="form-checkout-section">
						<div class="form-checkout-section-header">
							<h5>Delivery</h5>
						</div>
						<div class="form-checkout-section-content">
							<div class="form-group">
								<select class="form-select form-select-lg">
									<option disabled selected="">Country/ Region</option>
									<option value="USA">USA</option>
									<option value="ID">Indonesia</option>
								</select>
							</div>
							<div class="row">
								<div class="col-md-6">
									<div class="form-group">
										<input type="text" class="form-control form-control-lg" placeholder="First name" />
									</div>
								</div>
								<div class="col-md-6">
									<div class="form-group">
										<input type="text" class="form-control form-control-lg" placeholder="Last name" />
									</div>
								</div>
							</div>
							<div class="form-group">
								<input type="text" class="form-control form-control-lg" placeholder="Address" />
							</div>
							<div class="form-group">
								<input type="text" class="form-control form-control-lg" placeholder="Apartment, suite, etc (optional)" />
							</div>
							<div class="row">
								<div class="col-md-4">
									<div class="form-group">
										<input type="text" class="form-control form-control-lg" placeholder="City" />
									</div>
								</div>
								<div class="col-md-4">
									<div class="form-group">
										<select class="form-select form-select-lg">
											<option>State</option>
											<option value="Alabama">Alabama</option>
											<option value="Alaska">Alaska</option>
										</select>
									</div>
								</div>
								<div class="col-md-4">
									<div class="form-group">
										<input type="text" class="form-control form-control-lg" placeholder="ZIP Code" />
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="form-checkout-section">
						<div class="form-checkout-section-header">
							<h5>Shipping method</h5>
						</div>
						<div class="form-checkout-section-content">
							<div class="form-group form-group-radio">
								<div class="form-check">
									<input class="form-check-input" type="radio" name="shipping" id="shipping-1">
									<label class="form-check-label" for="shipping-1">
										<div class="radio-label">
											<strong>Free Shipping</strong>
											<span>Delivery in 5 - 7 working days</span>
										</div>
										<strong class="shipping-price">Free</strong>
									</label>
								</div>
								<div class="form-check">
									<input class="form-check-input" type="radio" name="shipping" id="shipping-2">
									<label class="form-check-label" for="shipping-2">
										<div class="radio-label">
											<strong>Standard Shipping</strong>
											<span>Delivery in 5 - 7 working days</span>
										</div>
										<strong class="shipping-price">$11.00</strong>
									</label>
								</div>
								<div class="form-check">
									<input class="form-check-input" type="radio" name="shipping" id="shipping-3">
									<label class="form-check-label" for="shipping-3">
										<div class="radio-label">
											<strong>Express Shipping</strong>
											<span>Delivery in 3 - 5 working days</span>
										</div>
										<strong class="shipping-price">$18.00</strong>
									</label>
								</div>
								<div class="form-check">
									<input class="form-check-input" type="radio" name="shipping" id="shipping-4">
									<label class="form-check-label" for="shipping-4">
										<div class="radio-label">
											<strong>Same-Day Delivery</strong>
											<span>Arrived on the same day as ordered</span>
										</div>
										<strong class="shipping-price">$24.00</strong>
									</label>
								</div>
							</div>
						</div>
					</div>
					<div class="form-checkout-footer">
						<a class="btn-back" href="cart.html"><i class="ic ic-caret-left dark-1"></i> Return</a>
						<a class="btn btn-xl btn-brand-primary" href="payment.html">CONTINUE</a>
					</div>
				</form>
			</div>
			<div class="cart-summary">
				<div class="cart-summary-header">
					<h4>Summary</h4>
				</div>
				<div class="cart-summary-content">
					<div class="cart-item-row">
						<div class="cart-item-image">
							<img src="assets/images/cosmetics-product-details-2.png" class="product-category-bg" />
						</div>
						<div class="cart-item-content">
							<div class="cart-item-content-top">
								<strong class="product-category">Skincare</strong>
								<h4>Virena Smoothing Starter Set</h4>
								<div class="col-right">
									<div class="col-item">
										<div class="form-group input-qty">
											<label>QTY</label>
											<select class="form-control">
												<option>1</option>
												<option>2</option>
												<option>3</option>
											</select>
										</div>
									</div>
									<span class="col-item cart-item-subtotal">$320.00</span>
								</div>
							</div>
						</div>
					</div>
					<div class="cart-item-row">
						<div class="cart-item-image">
							<img src="assets/images/cosmetics-product-list-9.png" class="product-category-bg" />
						</div>
						<div class="cart-item-content">
							<div class="cart-item-content-top">
								<strong class="product-category">Skincare</strong>
								<h4>Advanced Super Revitalizing Cream</h4>
								<div class="col-right">
									<div class="col-item">
										<div class="form-group input-qty">
											<label>QTY</label>
											<select class="form-control">
												<option>1</option>
												<option>2</option>
												<option>3</option>
											</select>
										</div>
									</div>
									<span class="col-item cart-item-subtotal">$18.00</span>
								</div>
							</div>
						</div>
					</div>
					<div class="cart-summary-item strong">
						<strong>Total</strong>
						<span>$500.00</span>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>