This repository has been archived by the owner on Jul 22, 2021. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 7
/
Copy pathindex.html
1 lines (1 loc) · 7.77 KB
/
index.html
1
<!DOCTYPE html><html lang="en" prefix="og: http://ogp.me/ns#"><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="description" content="Cozy house is a static website template on the theme of pet adoption made with pure HTML and CSS"> <meta name="keywords" content="website template,cozy house,hmtl,css,cozy,web design,inspiration,"> <meta name="author" content="Arnol Fokam"/> <meta name="robots" content="index, follow"/> <meta property="og:site_name" content="Cozy house - Website template"/> <meta property="og:title" content="Cozy house - Website template made with pure html and css"/> <meta property="og:type" content="website"/> <meta property="og:image" content="https://raw.githubusercontent.com/ArnolFokam/cozy-house-website-template/master/cozy_house_website_template.png"/> <meta property="og:image:type" content="image/png"/> <meta property="og:image:width" content="1668"/> <meta property="og:image:height" content="690"/> <meta property="og:image:alt" content="The banner and naigation menu of cozy website template"/> <meta property="og:image" content="https://raw.githubusercontent.com/ArnolFokam/cozy-house-website-template/master/cozy_house_website_template_small.png"/> <meta property="og:image:type" content="image/png"/> <meta property="og:image:width" content="400"/> <meta property="og:image:height" content="400"/> <meta property="og:description" content="Cozy house is a static website template on the theme of pet adoption made with pure HTML and CSS"/> <meta property="og:locale" content="en_US"/> <meta property="og:url" content="https://arnolfokam.github.io/cozy-house-website-template/"/> <link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png"> <link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png"> <link rel="manifest" href="site.webmanifest"> <title>Cozy house - Website template</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" as="style" type="text/css" media="screen" href="css/main.min.css"></head><body> <header id="header"> <div class="container"> <div class="row" id="navbar"> <input type="checkbox" id="mobile-toggle"> <label class="hamburger" id="mobile-toggle-btn" for="mobile-toggle"> <span></span> <span></span> <span></span> </label> <div class="nav-brand"> <h1><a href="/index.html" title="cozy house website template">Cozy House</a></h1> <h5>Shelter for pets in Boston</h5> </div><nav class="nav_menu"> <ul> <li><a title="About the shelter">About the Shelter</a></li><li><a title="Our pets" class="active">Our pets</a></li><li><a title="To help the shelter">To help the shelter</a></li><li><a title="Contacts">Contacts</a></li></ul> </nav> </div></div></header> <div id="banner" class="flex"> <div class="container"> <div> <h1>Not only people need a house</h1> <p>Cozy house is a website template in html and css made on the theme of animal adoption where pet lovers can adopt lovely animals to squeeze and love them.The website template is available on github. </p><a href="https://github.com/ArnolFokam/cozy-house-website-template" title="get the codes of cozy house website template" target="_blank">Get the code</a> </div></div></div><section id="about" class="py-100"> <div class="container"> <div class="row justify-content-center"> <div class="image_container col-lg-5"> <figure> <img src="images/Pets.png" alt="a dog and a cat siting next to each other" class=""> </figure> </div><div class="about_text col-lg-5"> <h2>About the shelter<br>“Cozy House”</h2> <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Tenetur, maxime voluptates. Animi eaque cupiditate facilis provident nam necessitatibus, recusandae dignissimos laborum labore. </p><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Tenetur, maxime voluptates. Animi eaque cupiditate facilis provident nam necessitatibus, recusandae dignissimos laborum labore eos vel. Animi nihil voluptas perspiciatis doloribus eaque? Lorem ipsum dolor sit amet consectetur adipisicing elit. Tenetur, maxime voluptates. Animi eaque. </p></div></div></div></section> <section class="py-50" id="pets"> <div class="container"> <h2>Our freinds who<br>are looking for a house</h2> <div class="slider_wrapper"> <div class="pets_slider"> <div class="slide" id="Katrine"> <figure> <img src="images/Katrine.png" width="270"/> </figure> <p>Katrine</p><a>Learn more</a> </div><div class="slide" id="Jennifer"> <figure> <img src="images/Jennifer.png" width="270"/> </figure> <p>Jennifer</p><a>Learn more</a> </div><div class="slide" id="Woody"> <figure> <img src="images/Woody.png" width="270"/> </figure> <p>Woody</p><a>Learn more</a> </div></div><div class="slider_nav"> <a title="See Katrine" alt="a grey female cat standing" href="#Katrine"></a> <a title="See Jennifer" alt="a white female puppy with brown ears sitting" href="#Jennifer"></a> <a title="See Woody" alt="a big brown dog sitting" href="#Woody"></a> </div><a title="see more pets" href="">Get to know the rest</a> </div></div></section> <section id="help" class="py-50"> <div class="container"> <h2>Than you can help<br>our shelter</h2> <div class="row justify-content-center"> <a href="." class="help_service"> <figure> <img src="images/SVG Icon/cat-food.svg" alt="cat food"> <p>Pet food</p></figure> </a> <a href="." class="help_service"> <figure> <img src="images/SVG Icon/ambulance.svg" alt="transport"> <p>Transportation</p></figure> </a> <a href="." class="help_service"> <figure> <img src="images/SVG Icon/ball.svg" alt="ball"> <p>Toys</p></figure> </a> <a href="." class="help_service"> <figure> <img src="images/SVG Icon/bowl.svg" alt="bowl"> <p>Bowls and cups</p></figure> </a> <a href="." class="help_service"> <figure> <img src="images/SVG Icon/shampoo.svg" alt="shampoo"> <p>shampoos</p></figure> </a> <a href="." class="help_service"> <figure> <img src="images/SVG Icon/pills.svg" alt="pills"> <p>Vitamins</p></figure> </a> <a href="." class="help_service"> <figure> <img src="images/SVG Icon/syringe.svg" alt="syringe"> <p>Medecines</p></figure> </a> <a href="." class="help_service"> <figure> <img src="images/SVG Icon/leash.svg" alt="leash"> <p>Collars/leashes</p></figure> </a> <a href="." class="help_service"> <figure> <img src="images/SVG Icon/cat.svg" alt="cat house"> <p>Sleeping area</p></figure> </a> </div></div></section> <section id="donation" class="py-50"> <div class="container"> <div class="row justify-content-center"> <div class="image_container col-lg-5"> <figure> <img src="images/Dog_donate.png" alt="a brown dog lying on the floor"> </figure> </div><div class="donation_text col-lg-5"> <h2>In addition, you<br>can make a donation</h2> <p>Name of the bank / Type of bank account</p><button class="card_number"><img src="images/SVG Icon/credit-card (1).svg" alt="credit-card">8380 2880 8028 8791 7435</button> <h6>Legal information and Lorem ipsum dolor sit amet consectetur adipisicing elit. Tenetur, maxime voluptates. Animi eaque cupiditate facilis provident nam necessitatibus, recusandae dignissimos laborum labore eos vel. Animi nihil voluptas perspiciatis doloribus eaque? Lorem ipsum dolor sit amet consectetur adipisicing elit. Tenetur, maxime voluptates. Animi eaque. </h6> </div></div></div></section> <footer id="footer" class="py-50"> <div class="container"> <div class="row justify-content-center"> <div class="col-md-4 col-xs-6"> <h2>For questions<br>and suggestions</h2> <ul> <li><img src="images/SVG Icon/envelope.svg">[email protected]</li><li><img src="images/SVG Icon/telephone.svg">+13 674 567 75 54</li></ul> </div><div class="col-md-4 col-xs-6"> <h2>We are waiting<br>for your visit</h2> <ul> <li><img src="images/SVG Icon/pin.svg">Boston, Central Street, 1st (Entrance from the store) </li><li><img src="images/SVG Icon/pin.svg">London, South Park, 18st</li></ul> </div></div></div></footer></body></html>