<!DOCTYPE html> <html> <title>W3.CSS Template</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css"> <body class="w3-light-grey w3-content" style="max-width:1600px"> <!-- Overlay effect when opening sidenav on small screens --> <div class="w3-overlay w3-hide-large w3-animate-opacity" onclick="w3_close()" style="cursor:pointer" title="close side menu" id="myOverlay"></div> <!-- !PAGE CONTENT! --> <div class="w3-main" style="margin-left:300px"> <div class="w3-container w3-padding-large" style="margin-bottom:32px"> <!-- Pricing Tables --> <div class="w3-row-padding" style="margin:0 -16px"> <div class="w3-third w3-margin-bottom"> <ul class="w3-ul w3-border w3-white w3-center w3-opacity w3-hover-opacity-off"> <li class="w3-black w3-xlarge w3-padding-32">Basic</li> <li class="w3-padding-16">Web Design</li> <li class="w3-padding-16">Photography</li> <li class="w3-padding-16">1GB Storage</li> <li class="w3-padding-16">Mail Support</li> <li class="w3-padding-16"> <h2>$ 10</h2> <span class="w3-opacity">per month</span> </li> <li class="w3-light-grey w3-padding-24"> <button class="w3-btn w3-teal w3-padding-large w3-hover-black">Sign Up</button> </li> </ul> </div> <div class="w3-third w3-margin-bottom"> <ul class="w3-ul w3-border w3-white w3-center w3-opacity w3-hover-opacity-off"> <li class="w3-teal w3-xlarge w3-padding-32">Pro</li> <li class="w3-padding-16">Web Design</li> <li class="w3-padding-16">Photography</li> <li class="w3-padding-16">50GB Storage</li> <li class="w3-padding-16">Endless Support</li> <li class="w3-padding-16"> <h2>$ 25</h2> <span class="w3-opacity">per month</span> </li> <li class="w3-light-grey w3-padding-24"> <button class="w3-btn w3-teal w3-padding-large w3-hover-black">Sign Up</button> </li> </ul> </div> <div class="w3-third"> <ul class="w3-ul w3-border w3-white w3-center w3-opacity w3-hover-opacity-off"> <li class="w3-black w3-xlarge w3-padding-32">Premium</li> <li class="w3-padding-16">Web Design</li> <li class="w3-padding-16">Photography</li> <li class="w3-padding-16">Unlimited Storage</li> <li class="w3-padding-16">Endless Support</li> <li class="w3-padding-16"> <h2>$ 25</h2> <span class="w3-opacity">per month</span> </li> <li class="w3-light-grey w3-padding-24"> <button class="w3-btn w3-teal w3-padding-large w3-hover-black">Sign Up</button> </li> </ul> </div> </div> </div> <!-- End page content --> </div> </body> </html> |