<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.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 ---------->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>musicianmadness</title>
<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="css/scrolling-nav.css" rel="stylesheet">
<link href="css/effect.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Work+Sans:100,200,300,400,500,600,700" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Oswald:300,400,700" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<!-- The #page-top ID is part of the scrolling feature - the data-spy and data-target are part of the built-in Bootstrap scrollspy function -->
<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
<!-- Navigation -->
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="row">
<div class="col-sm-10 col-md-8 col-xs-12 pull-right">
<div class="hed-search-and-account">
<form action="" method="get" class="search-form">
<input name="" class="form-control search-input" placeholder="Search..." type="text">
<input name="" class="search-btn" type="button">
</form>
<div class="account-menu">
<div class="learning-select">
<div class="btn-group"> <a class="btn dropdown-toggle btn-select" data-toggle="dropdown" href="#"> EN <b class="caret"></b> </a>
<ul class="dropdown-menu">
<li><a href="#"> English</a></li>
<li><a href="#"> Cameroon</a></li>
<li><a href="#"> Sweden</a></li>
<li><a href="#"> Hungary</a></li>
<li><a href="#"> French</a></li>
<li><a href="#"> German</a></li>
<li><a href="#"> Argentina</a></li>
<li><a href="#"> Brazil</a></li>
<li><a href="#"> Jamaica</a></li>
</ul>
</div>
</div>
<div class="header-cart"> <i class="cart-icon"><img src="img/cart.png" alt=""></i><span class="cart-item-number">0</span></div>
</div>
</div>
</div>
<div class="navbar-header page-scroll">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
<a class="navbar-brand page-scroll" href="#page-top"><img class="img-responsive" src="img/logo.png" alt=""></a> </div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="col-md-8 col-sm-10 col-xs-12 navbar-xs pull-right">
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav navbar-right">
<!-- Hidden li included to remove active class from about link when scrolled up past about section -->
<li class="hidden"> <a class="page-scroll" href="#page-top"></a> </li>
<li> <a class="page-scroll" href="#about">Home</a> </li>
<li> <a class="page-scroll" href="#services">Guitar</a> </li>
<li> <a class="page-scroll" href="#about">Bass</a> </li>
<li> <a class="page-scroll" href="#services">Keyboard</a> </li>
<li> <a class="page-scroll" href="#services">Electronics</a> </li>
<li> <a class="page-scroll" href="#services">Accessories</a> </li>
<li> <a class="page-scroll" href="#services">Closeout Deals</a> </li>
<li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" href="#">Drum</a>
<ul class="dropdown-menu">
<li><a class="page-scroll" href="#about">About</a> </li>
<li><a class="page-scroll" href="#about">About</a> </li>
<li><a class="page-scroll" href="#about">About</a> </li>
<li><a class="page-scroll" href="#about">About</a> </li>
<li><a class="page-scroll" href="#about">About</a> </li>
<li><a class="page-scroll" href="#about">About</a> </li>
</ul>
</li>
</ul>
</div>
</div>
<!-- /.navbar-collapse -->
</div>
</div>
<!-- /.container -->
</nav>
<!-- Intro Section -->
<section id="hero-banner">
<div class="banner-caption">
<div class="banner-intro">
<div class="col-md-6 col-md-offset-3 col-xs-12">
<h1>Singing that comes
from soul</h1>
<a href="#" class="btn btn-primary">Shop Now</a>
</div>
</div>
</div>
<img src="img/banner.jpg" class="img-responsive" alt="">
</div>
</section>
<!-- Trending Section -->
<section id="trending-now" class="full-section">
<div class="container">
<div class="section-heading">
<h2>Trending</h2>
<div class="heading-separator"><img src="img/heading-icon.png" class="img-responsive" alt=""></div>
</div>
<div class="row">
<div class="col-md-3 col-sm-6">
<div class="trending-item">
<div class="trending-Intro">
<div class="trending-img"> <img src="img/img001.jpg" class="img-responsive" alt=""> </div>
<div class="trending-text">
<h3>Hand Drums</h3>
<div class="brand-name">Keilwerth</div>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
</div>
<a href="#" class="view-more-btn cbutton--effect-ivana">+</a> </div>
</div>
<div class="col-md-3 col-sm-6">
<div class="trending-item">
<div class="trending-Intro">
<div class="trending-img"> <img src="img/img001.jpg" class="img-responsive" alt=""> </div>
<div class="trending-text">
<h3>Hand Drums</h3>
<div class="brand-name">Keilwerth</div>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
</div>
<a href="#" class="view-more-btn cbutton--effect-ivana">+</a> </div>
</div>
<div class="col-md-3 col-sm-6">
<div class="trending-item">
<div class="trending-Intro">
<div class="trending-img"> <img src="img/img001.jpg" class="img-responsive" alt=""> </div>
<div class="trending-text">
<h3>Hand Drums</h3>
<div class="brand-name">Keilwerth</div>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
</div>
<a href="#" class="view-more-btn cbutton--effect-ivana">+</a> </div>
</div>
<div class="col-md-3 col-sm-6">
<div class="trending-item">
<div class="trending-Intro">
<div class="trending-img"> <img src="img/img001.jpg" class="img-responsive" alt=""> </div>
<div class="trending-text">
<h3>Hand Drums</h3>
<div class="brand-name">Keilwerth</div>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
</div>
<a href="#" class="view-more-btn cbutton--effect-ivana">+</a> </div>
</div>
</div>
</div>
</section>
<!-- Categories Section -->
<section id="trending-now" class="full-section">
<div class="container">
<div class="section-heading">
<h2>Trending</h2>
<div class="heading-separator"><img src="img/heading-icon.png" class="img-responsive" alt=""></div>
</div>
<div class="row">
<div class="col-sm-4 col-md-3">
<div class="special-offer-add-item">
<div class="special-offer-intro">
<h2>Special Offer</h2>
<h2 class="offer-percent">30%</h2>
<div class="offer-img"> <img src="img/offer-img.jpg" class="img-responsive" alt=""> </div>
<div class="offer-pero-Name">guitar with stand</div>
<div class="offer-product-pricing"><span class="pricing-through"> $49.00</span> <span class="current-pricing">$38.00</span></div>
<div class="offer-counter">
<div class="counter-number-time">
<div class="counter-time-col"><span>331</span></div>
<div class="counter-time-col"><span>15</span></div>
<div class="counter-time-col"><span>30</span></div>
<div class="counter-time-col"><span>37</span></div>
</div>
<div class="counter-day-time">
<div class="counter-time-col"> Days </div>
<div class="counter-time-col">Hours</div>
<div class="counter-time-col">Mins</div>
<div class="counter-time-col">Secs </div>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-8 col-md-9">
<div class="categories-tab">
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#new-arrivals" aria-controls="home" role="tab" data-toggle="tab">New Arrivals</a></li>
<li role="presentation"><a href="#guitar" aria-controls="guitar" role="tab" data-toggle="tab">Guitar</a></li>
<li role="presentation"><a href="#drum" aria-controls="drum" role="tab" data-toggle="tab">Drum</a></li>
<li role="presentation"><a href="#sccessories" aria-controls="accessories" role="tab" data-toggle="tab">Accessories</a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="new-arrivals">
<div class="row">
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img005.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img006.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img007.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img008.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img009.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img0010.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane" id="guitar">
<div class="row">
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img006.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img005.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img007.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img008.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img009.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img0010.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane" id="drum">
<div class="row">
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img007.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img005.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img006.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img008.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img009.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img0010.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane" id="sccessories">
<div class="row">
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img008.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img005.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img006.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img007.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img009.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="categories-item">
<div class="categories-item-img"><img src="img/img0010.jpg" class="img-responsive" alt=""></div>
<div class="categories-small-details">
<div class="product-name">Storage Box</div>
<div class="product-pricing"><span class="pricing-through"> $49.00</span> $38.00 </div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="sounboard" class="sounboard-section full-section">
<div class="container">
<div class="section-heading">
<h2>The sounboard</h2>
<div class="heading-separator"><img alt="" class="img-responsive" src="img/heading-icon.png"></div>
</div>
<div class="row">
<div class="col-sm-3">
<div class="sounboard-item">
<div class="sounboard-item-icon"> <img src="img/sounboard_icon001.png" alt=""> </div>
<div class="sounboard-item-name"> Staff Picks </div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam interdum diam tortor, </p>
<a href="#" class="btn btn-primary">view more</a> </div>
</div>
<div class="col-sm-3">
<div class="sounboard-item">
<div class="sounboard-item-icon"> <img src="img/sounboard_icon002.png" alt=""> </div>
<div class="sounboard-item-name"> Staff Picks </div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam interdum diam tortor, </p>
<a href="#" class="btn btn-primary">view more</a> </div>
</div>
<div class="col-sm-3">
<div class="sounboard-item">
<div class="sounboard-item-icon"> <img src="img/sounboard_icon003.png" alt=""> </div>
<div class="sounboard-item-name"> Staff Picks </div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam interdum diam tortor, </p>
<a href="#" class="btn btn-primary">view more</a> </div>
</div>
<div class="col-sm-3">
<div class="sounboard-item">
<div class="sounboard-item-icon"> <img src="img/sounboard_icon004.png" alt=""> </div>
<div class="sounboard-item-name"> Staff Picks </div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam interdum diam tortor, </p>
<a href="#" class="btn btn-primary">view more</a> </div>
</div>
<div class="col-sm-3">
<div class="sounboard-item">
<div class="sounboard-item-icon"> <img src="img/sounboard_icon005.png" alt=""> </div>
<div class="sounboard-item-name"> Staff Picks </div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam interdum diam tortor, </p>
<a href="#" class="btn btn-primary">view more</a> </div>
</div>
<div class="col-sm-3">
<div class="sounboard-item">
<div class="sounboard-item-icon"> <img src="img/sounboard_icon006.png" alt=""> </div>
<div class="sounboard-item-name"> Staff Picks </div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam interdum diam tortor, </p>
<a href="#" class="btn btn-primary">view more</a> </div>
</div>
<div class="col-sm-3">
<div class="sounboard-item">
<div class="sounboard-item-icon"> <img src="img/sounboard_icon007.png" alt=""> </div>
<div class="sounboard-item-name"> Staff Picks </div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam interdum diam tortor, </p>
<a href="#" class="btn btn-primary">view more</a> </div>
</div>
<div class="col-sm-3">
<div class="sounboard-item">
<div class="sounboard-item-icon"> <img src="img/sounboard_icon008.png" alt=""> </div>
<div class="sounboard-item-name"> Staff Picks </div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam interdum diam tortor, </p>
<a href="#" class="btn btn-primary">view more</a> </div>
</div>
</div>
</div>
</section>
<section id="client-says" class="client-says-section full-section">
<div class="container">
<div class="section-heading">
<h2>testimonial</h2>
<div class="heading-separator"><img alt="" class="img-responsive" src="img/heading-icon.png"></div>
</div>
</div>
<div class="col-sm-4">
<div class="owl-item">
<div class="testimonial-image"> <img src="img/img0012.png" alt=""> </div>
<div class="testimonial-info">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam nec libero nulla. Suspendisse malesuada imperdiet mauris a luctus. Cras molestie tincidunt turpis et posuere. Vivamus varius fermentum ornare.</p>
<div class="employee-name">Velit uti</div>
<div class="employee-description">Company inc.</div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="owl-item active">
<div class="testimonial-image"> <img src="img/img0012.png" alt=""> </div>
<div class="testimonial-info">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam nec libero nulla. Suspendisse malesuada imperdiet mauris a luctus. Cras molestie tincidunt turpis et posuere. Vivamus varius fermentum ornare.</p>
<div class="employee-name">Velit uti</div>
<div class="employee-description">Company inc.</div>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="owl-item">
<div class="testimonial-image"> <img src="img/img0012.png" alt=""> </div>
<div class="testimonial-info">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam nec libero nulla. Suspendisse malesuada imperdiet mauris a luctus. Cras molestie tincidunt turpis et posuere. Vivamus varius fermentum ornare.</p>
<div class="employee-name">Velit uti</div>
<div class="employee-description">Company inc.</div>
</div>
</div>
</div>
</section>
<section id="our-brand" class="our-brand-section full-section">
<div class="container">
<div class="section-heading">
<h2>our brand</h2>
<div class="heading-separator"><img alt="" class="img-responsive" src="img/heading-icon.png"></div>
</div>
<div class="our-brand-section-Intro">
<div class="row">
<div class="col-sm-3 col-xs-6">
<div class="brand-item"> <img src="img/our-brand-001.png" class="img-responsive" alt=""></div>
</div>
<div class="col-sm-3 col-xs-6">
<div class="brand-item"> <img src="img/our-brand-002.png" class="img-responsive" alt=""></div>
</div>
<div class="col-sm-3 col-xs-6">
<div class="brand-item"> <img src="img/our-brand-003.png" class="img-responsive" alt=""></div>
</div>
<div class="col-sm-3 col-xs-6">
<div class="brand-item"> <img src="img/our-brand-004.png" class="img-responsive" alt=""></div>
</div>
<div class="col-sm-3 col-xs-6">
<div class="brand-item"> <img src="img/our-brand-005.png" class="img-responsive" alt=""></div>
</div>
<div class="col-sm-3 col-xs-6">
<div class="brand-item"> <img src="img/our-brand-006.png" class="img-responsive" alt=""></div>
</div>
<div class="col-sm-3 col-xs-6">
<div class="brand-item"> <img src="img/our-brand-007.png" class="img-responsive" alt=""></div>
</div>
<div class="col-sm-3 col-xs-6">
<div class="brand-item"> <img src="img/our-brand-008.png" class="img-responsive" alt=""></div>
</div>
</div>
</div>
</div>
</section>
<section id="newsletter" class="newsletter-section full-section">
<div class="container">
<div class="row">
<div class="col-md-10 col-md-offset-1">
<div class="row">
<div class="col-sm-7">
<form action="" method="get" class="newsletter-form">
<input placeholder="Enter your e-mail..." name="" type="text" class="form-control">
<input class="btn btn-primary" value="Subscribe" name="" type="button">
</form>
</div>
<div class="col-sm-5">
<h5>Sign Up for our Newsletter</h5>
<p>Receive email-only deals, special offers & product exclusives </p>
</div>
</div>
</div>
</div>
</div>
</section>
<footer id="footer">
<div class="row">
<div class="col-sm-4">
<div class="copyright">© 2016 musicianmadness.com. All Rights Reserved. </div>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the </p>
<ul class="footer-left-menu">
<li><a href="#">Privacy Policy</a></li>
<li><a href="#">Terms of Use</a></li>
<li><a href="#">View Mobile Site</a></li>
</ul>
</div>
<div class="col-sm-2">
<div class="footer-col-heading">Contact</div>
<div class="email-id"><a href="mailto:matt@daviesis.com">help@harrys.com</a> </div>
<div class="phone-number"><a href="tel:999 324 7769">999 324 7769</a> </div>
<ul class="footer-socil-menu">
<li> <a href="#" class="fb"> </a></li>
<li> <a href="#" class="tw"> </a></li>
<li> <a href="#" class="ins"> </a></li>
<li> <a href="#" class="google"> </a></li>
</ul>
</div>
<div class="col-sm-2">
<div class="footer-col-heading">Information</div>
<ul class="footer-menu">
<li><a href="#">Privacy Statement</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Contact Us</a></li>
<li><a href="#">Shipping & Returns</a></li>
<li><a href="#">RSS Syndication</a></li>
</ul>
</div>
<div class="col-sm-2">
<div class="footer-col-heading">Categories</div>
<ul class="footer-menu">
<li><a href="#">Guitar</a></li>
<li><a href="#">Drum</a></li>
<li><a href="#">Bass</a></li>
<li><a href="#">Keyboard</a></li>
<li><a href="#">Electronics</a></li>
<li><a href="#">Accessories</a></li>
<li><a href="#">Closeout Deals</a></li>
</ul>
</div>
<div class="Join-our-newsletter">
<div class="newsletter-Intro"> <i class="newsletter-icon"> <img src="img/phone-icon.png" alt=""></i>
<div class="newsletter-text"> Receive discounts. Join our
newsletter</div>
<a href="#" class="learn-more">lEARN mORE</a> </div>
</div>
</div>
</footer>
<!-- jQuery -->
<script src="js/jquery.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>
<!-- Scrolling Nav JavaScript -->
<script src="js/jquery.easing.min.js"></script>
<script src="js/scrolling-nav.js"></script>
<script>
$(".dropdown-menu li a").click(function(){
var selText = $(this).text();
$(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="caret"></span>');
});
$("#btnSearch").click(function(){
alert($('.btn-select').text()+", "+$('.btn-select2').text());
});
</script>
</body>
</html>
/*!
* Start Bootstrap - Scrolling Nav (http://startbootstrap.com/)
* Copyright 2013-2016 Start Bootstrap
* Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE)
*/
/*
####### font-family #####
font-family: 'Oswald', sans-serif;
font-family: 'Work Sans', sans-serif;
*/
body {
width: 100%; font-family: 'Work Sans', sans-serif; font-size:14px; font-weight:300;
height: 100%; color:#777777;
}
html {
width: 100%;
height: 100%;
}
.full-section{ padding:60px 0px; }
a{ transition:0.5s;}
a:focus, a:hover {
text-decoration: none;
}
p{ line-height:23px; }
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { font-family: 'Oswald', sans-serif;
margin-top:0px;
}
.section-heading > h2 {
color: #162028;
font-weight: 600;
text-transform: uppercase;
}
@media(min-width:767px) {
.navbar {
padding: 20px 0;
-webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
-moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
transition: background .5s ease-in-out,padding .5s ease-in-out;
}
.top-nav-collapse {
padding: 0;
}
}
/* Demo Sections - You can use these as guides or delete them - the scroller will work with any sort of height, fixed, undefined, or percentage based.
The padding is very important to make sure the scrollspy picks up the right area when scrolled to. Adjust the margin and padding of sections and children
of those sections to manage the look and feel of the site. */
.intro-section {
height: 100%;
padding-top: 150px;
text-align: center;
background: #fff;
}
.about-section {
height: 100%;
padding-top: 150px;
text-align: center;
background: #eee;
}
.services-section {
height: 100%;
padding-top: 150px;
text-align: center;
background: #fff;
}
.contact-section {
height: 100%;
padding-top: 150px;
text-align: center;
background: #eee;
}
.dropdown .dropdown-menu {
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
max-height: 0; height:0px;
display: block; border:none;
overflow: hidden; padding:0px;1
}
.dropdown.open .dropdown-menu {
max-height: 300px;
opacity: 1; height:auto;
}
/*================================================*/
.navbar-brand {
height:auto;
}
.navbar-default {
background-color: #162028;
border: none ; font-family: 'Oswald', sans-serif; color:#5e7587; font-weight:400;
}
.hed-search-and-account{ float:right; }
.hed-search-and-account {
border-bottom: 1px solid #1d2831;
width: 100%;
}
.hed-search-and-account form.search-form {
position: relative;
width: 75%; float:left;
}
.search-form .search-input {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
border: medium none; color:#c4d1dc; text-indent:15px;
}
.search-form .search-input:focus { box-shadow:none; }
.search-form .form-control::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: #5e7587;
}
.search-form .form-control::-moz-placeholder { /* Firefox 19+ */
color: #5e7587;
}
.search-form .form-control:-ms-input-placeholder { /* IE 10+ */
color: #5e7587;
}
.search-form .form-control:-moz-placeholder { /* Firefox 18- */
color: #5e7587;
}
.form-control {
border-radius: 0;
box-shadow: none;
}
.search-form .search-btn {
border: medium none; background:url(../img/search.png) center no-repeat;
bottom: 0;
left: 0; text-indent: 15px;
padding: 0;
position: absolute;
top: 0;
width: 20px;
}
.account-menu {
float: right;
min-width: 95px;
}
.learning-select .caret{ border:none; background: url(../img/down-arrow.png) no-repeat; width:7px; height:12px; margin-left:7px; }
.learning-select .btn-group a {
color: #5e7587;
font-weight: 300;
padding: 0;
}
.header-cart {
float: right; position:relative;
}
.account-menu .learning-select {
float: left;
padding-right: 25px;
}
.header-cart .cart-item-number {
background: #5e7587 none repeat scroll 0 0;
border-radius: 50%;
color: #ffffff;
font-family: "Work Sans",sans-serif;
font-size: 12px;
height: 19px;
position: absolute;
right: -12px;
text-align: center;
top: -6px;
width: 19px;
}
.navbar-default .navbar-nav > li > a {
color: #5e7587;
font-size: 16px;
}
.navbar-fixed-bottom, .navbar-fixed-top {
position: relative; margin-bottom:0px;
}
.trending-item {
color:#fff;
}
.trending-Intro{ position: relative; overflow:hidden;}
.trending-img {
border: 1px solid #cccccc;
}
.trending-text {
background: rgba(22, 32, 40, 0.8) none repeat scroll 0 0;
bottom: -130px;
left: 0;
padding: 24px 20px;
position: absolute;
right: 0;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}
.trending-item:hover .trending-text{ bottom:0px; background: rgba(22, 32, 40, 0.9) none repeat scroll 0 0; }
.trending-text h3{ margin-bottom:11px; }
.trending-text p{ color:#b5bec4;}
.brand-name {
font-size: 18px; font-weight:400; margin-bottom:7px;
}
.view-more-btn {
background: rgb(22, 32, 40) none repeat scroll 0 0;
color: rgb(255, 255, 255);
display: inline-block;
font-size: 32px;
font-weight: normal;
text-align: center; position:relative; overflow:hidden;
width: 100%;
}
.view-more-btn:hover{ text-decoration:none; color:#fff; }
.section-heading {
text-align: center; margin-bottom:35px;
}
.heading-separator {
display: inline-block;
}
.`section-heading h2 {
font-size: 36px; color:#162028;
letter-spacing: 3px;
text-transform: uppercase; margin-bottom:14px;
}
.categories-small-details .product-name {
float: left;
}
.categories-small-details .product-pricing {
float: right;
}
.categories-small-details .product-pricing .pricing-through {
margin-right: 5px;
text-decoration: line-through;
}
.categories-item-img {
margin-bottom: 25px;
}
.categories-item {
display:inline-block;
margin-bottom: 36px;
max-width: 100%;
}
.categories-tab .nav.nav-tabs li {
display: inline-block;
float: none;
margin: 0;
}
.categories-tab .nav.nav-tabs li a {
border: medium none;
border-radius: 0;
color: #777777;
margin: 0;
padding: 0 19.5px 20px;
text-transform: uppercase;
}
.categories-tab .nav.nav-tabs {
border-color: #ededed;
border-width: 2px;
margin-bottom: 47px;
padding-bottom: 0px;
text-align: center;
}
.categories-tab .nav.nav-tabs li.active a::before, .categories-tab .nav.nav-tabs li a:hover::before {
background: #000000 none repeat scroll 0 0;
bottom: -2px;
content: "";
height: 2px;
left: 0;
position: absolute;
right: 0;
width: 100%;
}
.nav > li > a:focus, .categories-tab .nav.nav-tabs li a:hover, .categories-tab .nav.nav-tabs li.active a {
background:none; color:#162028;
}
.special-offer-add-item {
background: #f5f5f5 none repeat scroll 0 0;
padding: 40px 15px;
text-align: center;
}
.special-offer-intro > h2 {
color: #162028;
font-weight: 300;
}
.special-offer-intro > h2.offer-percent {
color: #ef0568;
}
.offer-pero-Name {
font-size: 16px;
text-transform: uppercase; margin-bottom:13px;
}
.offer-img {
margin-bottom: 14px;
}
.offer-product-pricing .pricing-through {
display:inline-block ; margin-right:20px;
font-size: 16px;
}
.offer-product-pricing .current-pricing {
display:inline-block;
font-size:20px; color:#ef0568;
}
.offer-product-pricing {
display: inline-block;
margin-bottom: 35px;
width: 100%;
}
.offer-counter {
display: inline-block;
font-size: 20px;
width: 100%;
}
.offer-counter .counter-time-col {
float: left;
text-align: center;
width: 25%; padding:0 7px;
}
.offer-counter .counter-number-time .counter-time-col span {
background: #ffffff none repeat scroll 0 0;
border-radius: 5px;
display: inline-block;
padding: 10px 0;
width: 100%;
}
.counter-number-time {
margin: 0 -7px;
}
.counter-day-time .counter-time-col {
padding: 0; color:#666666; font-size:14px;
}
.counter-day-time {
display: inline-block;
margin-top: 9px;
width: 100%;
}
.sounboard-item {
border: 3px solid #a9b6bc;
padding: 23px 10px 30px;
text-align: center; margin-bottom:30px;
}
.sounboard-item-name {
font-size: 16px;
font-weight: 700;
margin-bottom: 11px;
text-transform: uppercase;
}
.sounboard-item .sounboard-item-icon {
margin-bottom:28px;
}
.btn-primary {
background-color: #ef0568;
border-color: #ef0568;
color: #ffffff;
}
.btn-primary:hover {
background-color: #d8035d;
border-color: #d8035d;
color: #ffffff;
}
.btn {
border: none;
border-radius: 3px;
padding: 7px 23px;
text-transform:uppercase;
}
.sounboard-item > p {
margin-bottom: 25px;
}
.testimonial-image {
border-radius: 50%;
height: 104px;
overflow: hidden; display:inline-block;
width: 104px; border:2px solid #ccc; margin-bottom:7px;
}
.owl-item {
box-shadow: 0 0 7px rgba(0, 0, 0, 0.58);
padding: 17px;
text-align: center; opacity:0.2; border-bottom:3px solid #ef0568;
}
.owl-item.active {
opacity: 1;
}
.employee-name {
color: #ef0568; margin-bottom:5px;
font-size: 16px;
font-weight: bold;
text-transform: uppercase;
}
.employee-description {
color: #435061; margin-bottom:1px;
text-transform: uppercase;
}
.client-says-section [class*="col-"]{ padding:0px; }
.testimonial-info > p {
margin-bottom: 18px;
}
#client-says.client-says-section {
display: inline-block;
width: 100%;
}
.our-brand-section {
background: #f5f5f5 ;
}
.our-brand-section-Intro {
padding: 0 60px;
}
.our-brand-section-Intro [class*="col-"]{ border-radius:20px; padding:0px; overflow:hidden;}
.brand-item {
border-right: 1px solid #cccccc;
border-top: 1px solid #cccccc;
padding:14px 15px;
text-align: center;
}
.our-brand-section-Intro [class*="col-"]:nth-child(-n+4) .brand-item {
border-top:none;
}
.newsletter-form {
position: relative;
}
.newsletter-form .form-control {
height: 50px;
}
.newsletter-form .btn-primary {
border-radius: 0;
height: 50px;
position: absolute;
right: 0;
top: 0;
}
.newsletter-section h5 {
font-size: 16px;
font-weight: 600;
}
.newsletter-section p {
font-size: 12px;
font-weight: 600;
}
footer#footer{ background:#f0f0f0; }
footer#footer {
background: #f0f0f0 none repeat scroll 0 0;
border-top: 1px solid #a4a4a4;
color: #666666;
font-size: 12px;
padding: 42px 60px 14px;
position: relative;
}
#footer a{ color:#666;}
.copyright {
font-weight: 600;
}
.footer-left-menu {
display: inline-block;
list-style: outside none none;
margin: 0;
padding: 0;
width: 100%;
}
.footer-left-menu > li {
float:left; margin:0 15px;
}
.footer-left-menu > li a {
color: #666666;
}
.footer-left-menu > li:first-child {
margin-left: 0;
}
.footer-socil-menu {
list-style: outside none none;
margin: 0;
padding: 0;
}
.footer-socil-menu li {
float:left; margin:0 4.5px;
}
.footer-socil-menu li:first-child {
margin-left: 0;
}
.footer-socil-menu li a {
background: url(../img/socil-icon.png) no-repeat; height:19px; display:inline-block;
}
.footer-socil-menu li a.fb { background-position:0 top; width:11px;}
.footer-socil-menu li a.tw { background-position:-18px top; width:22px;}
.footer-socil-menu li a.ins { background-position:-49px top; width:22px;}
.footer-socil-menu li a.google { background-position:-76px top; width:22px;}
.footer-socil-menu li:hover a.fb { background-position:0 bottom; width:11px;}
.footer-socil-menu li:hover a.tw { background-position:-18px bottom; width:22px;}
.footer-socil-menu li:hover a.ins { background-position:-49px bottom; width:22px;}
.footer-socil-menu li:hover a.google { background-position:-76px bottom; width:22px;}
.phone-number {
margin-bottom: 29px;
}
.footer-col-heading {
display: inline-block;
font-weight: 600;
margin-bottom: 5px;
text-transform: uppercase;
width: 100%;
}
.footer-menu {
list-style: outside none none;
margin: 0;
padding: 0;
}
.footer-menu li{ margin-bottom: 6px; }
.Join-our-newsletter {
bottom: 0; background:#162028;
position: absolute; font-size:14px; text-align:center; padding:30px; width:244px; color:#fff;
right: 0;
top: 0;
}
#footer .Join-our-newsletter a.learn-more {
border-bottom: 1px solid;
color: #ffffff;
text-transform: uppercase;
}
.Join-our-newsletter .newsletter-icon {
display: inline-block;
margin-bottom: 4px;
}
.newsletter-text {
line-height: 23px;
margin-bottom: 2px;
}
.newsletter-Intro {
position: relative;
top: 50%;
transform: translateY(-50%);
}
.our-brand-section-Intro [class*="col-"]:nth-child(4n+4) .brand-item {
border-right: medium none;
}
.newsletter-section.full-section {
padding: 55px 0;
}
.hero-banner{ color: rgb(255, 255, 255); text-align:center;}
.banner-caption {
padding: 111px 70px;
position: absolute; left:0px; right:0px; top:0px; bottom:0px; background: rgba(22, 32, 40, 0.8) none repeat scroll 0 0;
}
#hero-banner h1 {
color: rgb(255, 255, 255);
font-size: 70px;
margin-bottom: 39px; line-height:101px;
}
section#hero-banner {
position: relative;
}
.banner-intro {
text-align: center;
}
.banner-intro .btn-primary {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
border: 2px solid rgb(255, 255, 255);
border-radius: 0;
font-size: 20px; padding: 8.5px 43px;
font-weight: 400; font-family: 'Oswald', sans-serif;
}
@media (min-width: 250px) and (max-width: 767px) {
.account-menu {
margin-top: 5px;
}
.banner-caption {
padding: 30px 0;
}
#hero-banner h1 {
font-size: 26px;
margin-bottom: 15px; line-height: normal;
}
.banner-intro .btn-primary {
font-size: 16px;
padding: 5.5px 33px;
}
.banner-caption {
padding: 20px 0;
}
.hed-search-and-account form.search-form {
width: 65%;
}
.navbar-default .navbar-brand {
width: 120px;
}
.navbar-default .navbar-toggle {
margin-top: 20px ;
}
.navbar-xs{ padding:0px;}
.trending-item {
color: #ffffff;
margin-bottom: 20px;
}
.full-section {
padding: 30px 0;
}
.special-offer-add-item {
margin-bottom: 30px;
}
.categories-tab .nav.nav-tabs li a {
margin-top: 10px;
padding: 0 5px 4px;
}
.categories-tab .nav.nav-tabs {
margin-bottom: 30px;
}
.categories-tab #new-arrivals {
text-align: center;
}
.our-brand-section-Intro {
padding: 0 15px;
}
.brand-item {
padding: 14px 15px;
}
.our-brand-section-Intro [class*="col-"]:nth-child(-n+4) .brand-item {
border-top: 1px solid #cccccc;
}
.our-brand-section-Intro [class*="col-"]:nth-child(-n+2) .brand-item {
border-top: medium none;
}
.our-brand-section-Intro [class*="col-"]:nth-child(4n+4) .brand-item {
border-right: 1px solid #cccccc;
}
.our-brand-section-Intro [class*="col-"]:nth-child(2n+2) .brand-item {
border-right: medium none;
}
.Join-our-newsletter {
margin: 0 -15px;
padding: 30px;
position: static;
width: auto;
}
footer#footer {
padding: 42px 30px 0;
}
.footer-left-menu {
text-align: center;
}
.footer-left-menu > li {
display: inline-block;
float: none;
margin: 0 15px 8px;
}
.footer-socil-menu {
display: inline-block;
margin: 0 0 20px;
width: 100%;
}
.footer-menu {
margin-bottom: 20px;
}
.newsletter-Intro {
top: 0;
transform: inherit;
}
.footer-left-menu {
border-bottom: 1px solid #dddddd;
margin: 0 0 20px;
padding: 0 0 10px;
}
.newsletter-form {
margin-bottom: 20px;
}
.owl-item {
display: none;
}
.owl-item.active {
display: block;
}
.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {
background-color: rgba(94, 117, 135, 0.2);
color: rgb(255, 255, 255);
}
.nav > li {
border-bottom: 1px solid rgba(94, 117, 135, 0.2);
display: block;
position: relative;
}
.navbar-default .navbar-collapse, .navbar-default .navbar-form {
border-color: rgba(0, 0, 0, 0);
}
}
@media (min-width: 768px) and (max-width:991px) {
.our-brand-section-Intro {
padding: 0;
}
.offer-product-pricing {
margin-bottom: 20px;
}
.special-offer-add-item {
padding: 30px 15px;
}
.offer-pero-Name {
margin-bottom: 8px;
}
.offer-product-pricing {
margin-bottom: 10px;
}
.categories-item-img {
margin-bottom: 15px;
}
.categories-small-details .product-name {
margin-bottom: 7px;
}
.categories-small-details .product-pricing {
float: left;
}
.offer-img {
height: 160px;
overflow: hidden;
}
.offer-img .img-responsive {
max-height: 100%;
}
.trending-item {
color: rgb(255, 255, 255);
margin-bottom: 30px;
}
.navbar-default .navbar-brand {
color: rgb(119, 119, 119);
width: 140px;
}
.nav > li > a {
padding: 15px 12px;
}
.banner-caption {
padding: 50px 70px;
}
#hero-banner h1 {
font-size: 55px;
}
}
/*============== Effect.css=======================*/
/* Ivana */
.cbutton--effect-ivana::before {
position: absolute;
top: 50%;
left: 50%;
margin: -35px 0 0 -35px;
width: 70px;
height: 70px;
border-radius: 50%;
content: '';
opacity: 0;
pointer-events: none;
}
.cbutton--effect-ivana::before,
.cbutton--effect-ivana::after {
box-shadow: 0 0 0 2px rgba(111,148,182,0.5);
}
.cbutton--effect-ivana:hover::before {
-webkit-animation: anim-effect-ivana-1 0.5s forwards;
animation: anim-effect-ivana-1 0.5s forwards;
}
.cbutton--effect-ivana:hover::after {
-webkit-animation: anim-effect-ivana-2 0.5s forwards;
animation: anim-effect-ivana-2 0.5s forwards;
}
@-webkit-keyframes anim-effect-ivana-1 {
0% {
opacity: 1;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1);
}
}
@keyframes anim-effect-ivana-1 {
0% {
opacity: 1;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1);
}
}
@-webkit-keyframes anim-effect-ivana-2 {
0% {
opacity: 1;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
50%, 100% {
opacity: 0;
-webkit-transform: scale3d(1.2, 1.2, 1);
transform: scale3d(1.2, 1.2, 1);
}
}
@keyframes anim-effect-ivana-2 {
0% {
opacity: 1;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
50%, 100% {
opacity: 0;
-webkit-transform: scale3d(1.2, 1.2, 1);
transform: scale3d(1.2, 1.2, 1);
}
}
//jQuery to collapse the navbar on scroll
$(window).scroll(function() {
if ($(".navbar").offset().top > 50) {
$(".navbar-fixed-top").addClass("top-nav-collapse");
} else {
$(".navbar-fixed-top").removeClass("top-nav-collapse");
}
});
//jQuery for page scrolling feature - requires jQuery Easing plugin
$(function() {
$('a.page-scroll').bind('click', function(event) {
var $anchor = $(this);
$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 1500, 'easeInOutExpo');
event.preventDefault();
});
});
/*
* jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
*
* Uses the built in easing capabilities added In jQuery 1.1
* to offer multiple easing options
*
* TERMS OF USE - EASING EQUATIONS
*
* Open source under the BSD License.
*
* Copyright © 2001 Robert Penner
* All rights reserved.
*
* TERMS OF USE - jQuery Easing
*
* Open source under the BSD License.
*
* Copyright © 2008 George McGinley Smith
* All rights reserved.
*
* Redistribution and use in source and binary forms, with or without modification,
* are permitted provided that the following conditions are met:
*
* Redistributions of source code must retain the above copyright notice, this list of
* conditions and the following disclaimer.
* Redistributions in binary form must reproduce the above copyright notice, this list
* of conditions and the following disclaimer in the documentation and/or other materials
* provided with the distribution.
*
* Neither the name of the author nor the names of contributors may be used to endorse
* or promote products derived from this software without specific prior written permission.
*
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
* COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
* EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
* GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
* AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
* NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
* OF THE POSSIBILITY OF SUCH DAMAGE.
*
*/
jQuery.easing.jswing=jQuery.easing.swing;jQuery.extend(jQuery.easing,{def:"easeOutQuad",swing:function(e,f,a,h,g){return jQuery.easing[jQuery.easing.def](e,f,a,h,g)},easeInQuad:function(e,f,a,h,g){return h*(f/=g)*f+a},easeOutQuad:function(e,f,a,h,g){return -h*(f/=g)*(f-2)+a},easeInOutQuad:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f+a}return -h/2*((--f)*(f-2)-1)+a},easeInCubic:function(e,f,a,h,g){return h*(f/=g)*f*f+a},easeOutCubic:function(e,f,a,h,g){return h*((f=f/g-1)*f*f+1)+a},easeInOutCubic:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f*f+a}return h/2*((f-=2)*f*f+2)+a},easeInQuart:function(e,f,a,h,g){return h*(f/=g)*f*f*f+a},easeOutQuart:function(e,f,a,h,g){return -h*((f=f/g-1)*f*f*f-1)+a},easeInOutQuart:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f*f*f+a}return -h/2*((f-=2)*f*f*f-2)+a},easeInQuint:function(e,f,a,h,g){return h*(f/=g)*f*f*f*f+a},easeOutQuint:function(e,f,a,h,g){return h*((f=f/g-1)*f*f*f*f+1)+a},easeInOutQuint:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f*f*f*f+a}return h/2*((f-=2)*f*f*f*f+2)+a},easeInSine:function(e,f,a,h,g){return -h*Math.cos(f/g*(Math.PI/2))+h+a},easeOutSine:function(e,f,a,h,g){return h*Math.sin(f/g*(Math.PI/2))+a},easeInOutSine:function(e,f,a,h,g){return -h/2*(Math.cos(Math.PI*f/g)-1)+a},easeInExpo:function(e,f,a,h,g){return(f==0)?a:h*Math.pow(2,10*(f/g-1))+a},easeOutExpo:function(e,f,a,h,g){return(f==g)?a+h:h*(-Math.pow(2,-10*f/g)+1)+a},easeInOutExpo:function(e,f,a,h,g){if(f==0){return a}if(f==g){return a+h}if((f/=g/2)<1){return h/2*Math.pow(2,10*(f-1))+a}return h/2*(-Math.pow(2,-10*--f)+2)+a},easeInCirc:function(e,f,a,h,g){return -h*(Math.sqrt(1-(f/=g)*f)-1)+a},easeOutCirc:function(e,f,a,h,g){return h*Math.sqrt(1-(f=f/g-1)*f)+a},easeInOutCirc:function(e,f,a,h,g){if((f/=g/2)<1){return -h/2*(Math.sqrt(1-f*f)-1)+a}return h/2*(Math.sqrt(1-(f-=2)*f)+1)+a},easeInElastic:function(f,h,e,l,k){var i=1.70158;var j=0;var g=l;if(h==0){return e}if((h/=k)==1){return e+l}if(!j){j=k*0.3}if(g<Math.abs(l)){g=l;var i=j/4}else{var i=j/(2*Math.PI)*Math.asin(l/g)}return -(g*Math.pow(2,10*(h-=1))*Math.sin((h*k-i)*(2*Math.PI)/j))+e},easeOutElastic:function(f,h,e,l,k){var i=1.70158;var j=0;var g=l;if(h==0){return e}if((h/=k)==1){return e+l}if(!j){j=k*0.3}if(g<Math.abs(l)){g=l;var i=j/4}else{var i=j/(2*Math.PI)*Math.asin(l/g)}return g*Math.pow(2,-10*h)*Math.sin((h*k-i)*(2*Math.PI)/j)+l+e},easeInOutElastic:function(f,h,e,l,k){var i=1.70158;var j=0;var g=l;if(h==0){return e}if((h/=k/2)==2){return e+l}if(!j){j=k*(0.3*1.5)}if(g<Math.abs(l)){g=l;var i=j/4}else{var i=j/(2*Math.PI)*Math.asin(l/g)}if(h<1){return -0.5*(g*Math.pow(2,10*(h-=1))*Math.sin((h*k-i)*(2*Math.PI)/j))+e}return g*Math.pow(2,-10*(h-=1))*Math.sin((h*k-i)*(2*Math.PI)/j)*0.5+l+e},easeInBack:function(e,f,a,i,h,g){if(g==undefined){g=1.70158}return i*(f/=h)*f*((g+1)*f-g)+a},easeOutBack:function(e,f,a,i,h,g){if(g==undefined){g=1.70158}return i*((f=f/h-1)*f*((g+1)*f+g)+1)+a},easeInOutBack:function(e,f,a,i,h,g){if(g==undefined){g=1.70158}if((f/=h/2)<1){return i/2*(f*f*(((g*=(1.525))+1)*f-g))+a}return i/2*((f-=2)*f*(((g*=(1.525))+1)*f+g)+2)+a},easeInBounce:function(e,f,a,h,g){return h-jQuery.easing.easeOutBounce(e,g-f,0,h,g)+a},easeOutBounce:function(e,f,a,h,g){if((f/=g)<(1/2.75)){return h*(7.5625*f*f)+a}else{if(f<(2/2.75)){return h*(7.5625*(f-=(1.5/2.75))*f+0.75)+a}else{if(f<(2.5/2.75)){return h*(7.5625*(f-=(2.25/2.75))*f+0.9375)+a}else{return h*(7.5625*(f-=(2.625/2.75))*f+0.984375)+a}}}},easeInOutBounce:function(e,f,a,h,g){if(f<g/2){return jQuery.easing.easeInBounce(e,f*2,0,h,g)*0.5+a}return jQuery.easing.easeOutBounce(e,f*2-g,0,h,g)*0.5+h*0.5+a}});
