"Home Page"
Bootstrap 3.3.0 Snippet by pindipoluravikumar

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <style> /************************** DEFAULT BOOTSTRAP STYLES **************************/ .btn { display: inline-block; padding: 6px 12px; margin-bottom: 0; font-size: 14px; font-weight: normal; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid transparent; border-radius: 4px; padding: 10px 16px; background-color:#e6e6e6 !important; } .btn-lg { font-size: 18px; line-height: 1.33; border-radius: 6px; } .btn-primary { color: #fff; background-color: #428bca; border-color: #357ebd; } .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary { color: white !important; background-color: white !important; border-color: #285e8e; } /*********************** ROUND BUTTONS ************************/ .round { border-radius: 24px; } /*********************** CUSTON BTN VALUES ************************/ .btn { padding: 14px 24px; border: 0 none; font-weight: 700; letter-spacing: 1px; } .btn:focus, .btn:active:focus, .btn.active:focus { outline: 0 none; color: white !important; background-color: blue !important; border-color: #285e8e; } .btn-primary { background: #0099cc; color: #ffffff; } .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary { color: white !important; background-color: white !important; border-color: #285e8e; } .btn-primary:active, .btn-primary.active { background: #007299; box-shadow: none; } .select-plan{ height: 60px; width: 200px; background: #f8f8f8; color: white; padding: 0 28px; text-align: center; font-family: calibri; } </style> <script> function vidplay() { var video = document.getElementById("advideo"); if (video.paused){ video.controls = true; video.play(); } else { video.controls = false; video.pause(); } } function promoplay() { var video = document.getElementById("promovideo"); if (video.paused){ video.controls = true; video.play(); } else { video.controls = false; video.pause(); } } </script> <div ng-include="'views/components/Header.html'"></div> <div class="homePageBackGroundImage1" style="height: 400px; background-image: url('../images/NewHome1.png');" > <div style="margin-left: 200px;"> <div style="font-size: 28px; padding-top: 100px; font-family: calibri;">Check my watches value</div> <div ><select style=" background: white; width: 160px; font-family: calibri; padding: 3px 10px;"> <option>Watch model</option> </select></div> <div style="margin-top: 125px;"> <button type="button" class="btn btn-default btn-m round"><a href="#/signup" style="text-decoration: none; color: black"> Get Certified </a></button> <button type="button" class="btn btn-default btn-m round" style="margin-left:5%"><a onclick="javascript:vidplay();" style="text-decoration: none; color: black"> Watch Video <a/></button> </div> </div> </div> <div style="width: 100%; background-color: #68ceee; height: 60px;"> </div> <div class="homePageContentBox"> <div style=" border: 2px solid lightgrey; width: 415px; float: left; font-family: Calibri; text-align: center; margin-right: 25px; padding: 10px; font-size: 12px; border-radius: 5px;"> <div style="background: #68ceee; height: 50px; width: 50px; color: white; border-radius: 30px; padding-top: 10px; margin-top: -40px; z-index: 1000; position: absolute; text-align: center; margin-left: 150px; font-size: 20px;"><img src="../images/globe.png"></div> <p style="font-family: calibri; font-size: 20px; margin-top: 25px;"> WHY CERTIFY WITH LUXE? </p> <p style=" font-family: calibri; font-size: 14px; margin-top: 25px; height: 175px; padding: 10px;">Retailers, Wholesalers and consumers can now submit a timepiece for grading and authentication and receive a certified report detailing the three most important criteria for a timepiece's assessment: authenticity, aesthetic condition and accuracy. Luxe Certified does not grade counterfeits or aftermarket watches or parts to insure onlu authenticated timepieces carry the Luxe Certified certification. By taking the fear of the unknown out of the used watch market we hope to maximize the transaction value of all our customers</p> </div> <div style="border: 2px solid lightgrey; width: 415px; float: left; font-family: Calibri; text-align: center; margin-right: 25px; padding: 10px; font-size: 12px; border-radius: 5px;"> <div style="background: #68ceee; height: 50px; width: 50px; color: white; border-radius: 30px; padding-top: 10px; margin-top: -40px; z-index: 1000; position: absolute; text-align: center; margin-left: 150px; font-size: 20px;"><img src="../images/settings.png"></div> <p style="font-family: calibri; font-size: 20px; margin-top: 25px;"> HOW DOES IT WORK? </p> <p style=" font-family: calibri; font-size: 14px; margin-top: 25px; height: 175px; padding: 10px;">Luxe Certified Customers submit their watches to one of our authorized Luxe Certified Retail Partners. Once inside our retail partner's salon one of their sales associates will assist you in completing the order process. Your timepiece will be insured and shipped to our secure facilities. Upon completion of grading and authentication Luxe certified will send you a copy of the certificate detailing the watch's authenticity, timekeeping accuracy and aesthetic condition.</p> </div> <div style="clear: both"></div> </div> <div class="clear"></div> <div style="width: 100%; background-color: #68ceee; height: 100px;color: white; font-family: calibri; text-align: center; padding: 10px;margin-top:70px;"> <span style="font-size: 40px;">Partner with us</span> <span style="font-size: 14px;">  Learn how a partnership with Luxe Certified can help enhance your pre-owned watch business. <button type="button" class="btn btn-default btn-m round"><a href="#/dealerRegistration" style="text-decoration : none"> Join luxe </a></button> </div> <div class="homePageBackGroundImage1" style="height: 500px; background-image: url('../images/NewHome2.png');" > <div style="font-family: Calibri; font-size: 27px;text-align: center; padding-top: 50px;">Check out our Videos</div> <div style="font-family: Calibri; font-size: 13px;text-align: center;">To learn more about Luxe process and advantages of using our service, watch the videos below</div> <div style="padding-top: 60px; width: 600px; margin: 0 auto;"> <div style="float: left;"> <div style="height: 199px; width: 260px; border: 5px solid #e5e5e5; background: #f8f8f8; float: left;"> <video class="videoCss" id="advideo" style="width: 100%;height:190px;"> <source src="http://lcc.dotcmscloud.com/staging/videos/process1.mp4" type="video/mp4" > </video> </div> <div style="text-align: center;width: 260px; font-size: 15px; color: black; font-family: calibri; top: 20px; position: relative;">Luxe Process</div> <button type="button" class="btn btn-default btn-m round" onclick="vidplay();"> Watch Video</button> </div> <div style="float: left; margin-left: 50px;"> <div style="height: 199px; width: 260px; border: 5px solid #e5e5e5; background: #f8f8f8; float: left;"> <video class="videoCss" id="promovideo" style="width: 100%;height:190px; "> <source src="http://lcc.dotcmscloud.com/staging/videos/promo.mp4" type="video/mp4" > </video> </div> <div style="text-align: center;width: 260px; font-size: 15px; color: black; font-family: calibri;top: 20px; position: relative;">Luxe Promo</div> <button type="button" class="btn btn-default btn-m round" onclick="promoplay();"> Watch Video</button> </div> <div class="clear"></div> </div> <div class="container" style="margin-top: 60px;"> <div class="row marketing"> <div class="clear"></div> <h2 style="font-family : calibri; text-align: center;">Service Options</h2> <div class="clear"></div> <div style="margin: 0 auto; text-align: center; width: 70%; margin-top: 40px;"> <div style="float: left;margin-left: 50px;"> <div style="height: 100px; width: 200px; background: #68ceee; color: white;padding:10px; text-align: center; font-family: calibri; "> <p style="font-size: 14px;">Basic</p> <p><span font-size: 12px;>$</span> <span style="font-size: 27px;">299</span> </div> <div style="width: 200px; font-family: calibri; font-size: 13px; margin-top: 15px; height: 170px; background: #f8f8f8; padding: 10px; text-align: left;"> The watch will be analyzed and graded by one of our professional watchmakers. Due to demand, completion of grading currently takes two to three weeks from receipt of the watch. </div> <div class="select-plan"> <button type="button" class="btn btn-default btn-m round"><a href="#/underconstruction" style="text-decoration: none; color: black"> Select Plan </a></button> </div> </div> <div style="float: left;margin-left: 50px;"> <div style="height: 100px; width: 200px; background: #68ceee; color: white;padding:10px; text-align: center; font-family: calibri; "> <p style="font-size: 14px;">Premium</p> <p><span font-size: 12px;>$</span> <span style="font-size: 27px;">379</span> </div> <div style="width: 200px; font-family: calibri; font-size: 13px; margin-top: 15px; height: 170px; background: #f8f8f8; padding: 10px; text-align: left;"> Our premium package includes the services in our Basic Package as well as expedited fulfillment. Each watch is returned via overnight delivery and we guarantee completion of grading within 7 business days from receipt of the watch. </div> <div class="select-plan"> <button type="button" class="btn btn-default btn-m round"><a href="#/underconstruction" style="text-decoration: none; color: black"> Select Plan </a></button> </div> </div> <div style="float: left;margin-left: 50px;"> <div style="height: 100px; width: 200px; background: #68ceee; color: white;padding:10px; text-align: center; font-family: calibri; "> <p style="font-size: 14px;">Luxe</p> <p><span font-size: 12px;>$</span> <span style="font-size: 27px;">499</span> </div> <div style="width: 200px; font-family: calibri; font-size: 13px; margin-top: 15px; height: 170px; background: #f8f8f8; padding: 10px; text-align: left;"> Our Luxe Package includes the services in our Premium Package as well as our Refinishing Service. Each watch is returned via overnight delivery and we guarantee completion of grading and polishing within 7 business days from receipt of the watch. </div> <div class="select-plan"> <button type="button" class="btn btn-default btn-m round"><a href="#/underconstruction" style="text-decoration: none; color: black"> Select Plan </a></button> </div> </div> <div style="margin: 0 auto; text-align: center; width: 60%; padding-top: 50px; clear: both"> <div style="float: left; margin-left: 100px;"> <div style="height: 100px; width: 200px; background: #68ceee; color: white;padding:10px; text-align: center; font-family: calibri; "> <p style="font-size: 14px;">Finishing</p> <p><span font-size: 12px;>$</span> <span style="font-size: 27px;">149</span> </div> <div style="width: 200px; font-family: calibri; font-size: 13px; margin-top: 15px; height: 170px; background: #f8f8f8; padding: 10px; text-align: left;"> Refinishing : Luxe Certified will refinish a users watch to improve its appearance if necessary. Luxe Certified will repair the movement if necessary. Crystal Replacement : Luxe Certified will repair or replace the crystal if necessary. </div> <div class="select-plan"> <button type="button" class="btn btn-default btn-m round"><a href="#/underconstruction" style="text-decoration: none; color: black"> Select Plan </a></button> </div> </div> <div style="float: left; margin-left: 50px;"> <div style="height: 100px; width: 200px; background: #68ceee; color: white;padding:10px; text-align: center; font-family: calibri; "> <p style="font-size: 14px;">Repair</p> <p><span font-size: 12px;>$</span> <span style="font-size: 27px;">99</span> </div> <div style="width: 200px; font-family: calibri; font-size: 13px; margin-top: 15px; height: 170px; background: #f8f8f8; padding: 10px; text-align: left;"> Our Luxe Package includes the services in our Premium Package as well as our Refinishing Service. Each watch is returned via overnight delivery and we guarantee completion of grading and polishing within 7 business days from receipt of the watch. </div> <div class="select-plan"> <button type="button" class="btn btn-default btn-m round"><a href="#/underconstruction" style="text-decoration: none; color: black"> Select Plan </a></button> </div> </div> </div> </div> <div class="clear"></div> </div> <div style="margin-bottom : 50px;"> <div style="width: 100%; background-color: #68ceee; height: 50px;"> </div> <div class="homePageBackGroundImage1" style="height: 500px; background-image: url('../images/NewHome3.png');" > <div style="font-family: Calibri; font-size: 27px;text-align: center; padding-top: 50px;">What our customer say?</div> <div style="padding-top: 100px; width: 65%; margin: 0 auto;"> <div style="width: 270px; float: left"> <div style=" height: 170px; width: 270px; background: #e5e5e5; font-family: calibri; float: left; padding: 20px; text-align: center; border-radius: 5px;">"Aenean dapibus facilisis urna lacinia bibendum. Maeceans sit amet lacinia dui. Donec vitae egestas ipsum, sit amet egestas nulla. Maecenas consectetur est ac ipsum porta tincidunt."</div> <div style="font-family: calibri; top: 20px; text-align: center; position: relative;"> John Doe</div> <div style="font-family: calibri; top: 20px; text-align: center; position: relative; color: #68ceee"> Watch Collector</div> </div> <div style="width: 290px; float: left"> <div style=" height: 170px; width: 270px; background: #e5e5e5; font-family: calibri; float: left; margin-left: 50px; padding: 20px; text-align: center; border-radius: 5px;">"Aenean dapibus facilisis urna lacinia bibendum. Maeceans sit amet lacinia dui. Donec vitae egestas ipsum, sit amet egestas nulla. Maecenas consectetur est ac ipsum porta tincidunt."</div> <div style="font-family: calibri; top: 20px; text-align: center; position: relative;"> Jim Doe</div> <div style="font-family: calibri; top: 20px; text-align: center; position: relative; color: #68ceee">Jeweller</div> </div> <div style="width: 290px; float: left"> <div style=" height: 170px; width: 270px; background: #e5e5e5; font-family: calibri; float: left; padding: 20px;margin-left: 50px; text-align: center; border-radius: 5px;"> "Aenean dapibus facilisis urna lacinia bibendum. Maeceans sit amet lacinia dui. Donec vitae egestas ipsum, sit amet egestas nulla. Maecenas consectetur est ac ipsum porta tincidunt."</div> <div style="font-family: calibri; top: 20px; text-align: center; position: relative;"> Jane Doe</div> <div style="font-family: calibri; top: 20px; text-align: center; position: relative; color: #68ceee"> Watch Collector</div> </div> <div class="clear"></div> </div> <div class="clear"></div> </div> <div style="width: 100%; background-color: #68ceee; height: 50px;"> </div> </div> <div ng-include="'views/components/homePageFooter.html'"></div>

Related: See More


Questions / Comments: