<!doctype html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
    <meta charset="utf-8">
    <title>Shanna Cote - Creative Visionary</title>
    <meta name="description" content="shanna cote designer developer"/>
    <meta name="keywords" content="shanna, cote, portfolio, justshan "/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />

    <!-- Loading Bootstrap CSS -->
    <link href="assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css">
    
    <!-- Loading Font Icons -->
    <link href="assets/plugins/icomoon/style.css" rel="stylesheet" type="text/css">
    <link href="assets/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
    
    <!-- Include all css plugins (below), or include individual files as needed -->
    <link href="assets/plugins/animate-css/animate.min.css" rel="stylesheet" type="text/css">
    <link href="assets/plugins/jpreloader/css/jpreloader.css" rel="stylesheet" type="text/css">
    <link href="assets/plugins/magnific-popup/magnific-popup.css" rel="stylesheet" type="text/css">
    <link href="assets/plugins/flexslider/flexslider.css" rel="stylesheet" type="text/css">
    <link href="assets/plugins/chartist-js/chartist.min.css" rel="stylesheet" type="text/css">
    <link href="assets/plugins/flickity/flickity.css" rel="stylesheet" type="text/css">
    
    <!-- Main CSS -->
    <link href="assets/css/styles.css" rel="stylesheet" type="text/css">
    
    <!-- Color CSS -->
    <!--<link href="assets/css/colors/blue.css" rel="stylesheet" type="text/css">-->
    
    <!-- Modernizr JS for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 8]>
    <script src="assets/plugins/modernizr/modernizr.min.js"></script>
    <![endif]-->
</head>

<body id="page-top">
    <!--[if lt IE 8]>
        <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
    <![endif]-->
    
    
    <!-- PRELOADER START -->
    <div id="jSplash" class="background-gray-light position-fixed top-0 width-100 height-100">
        <div class="background-grid">
            <div class="column"></div>
            <div class="column"></div>
            <div class="column"></div>
            <div class="column"></div>
            <div class="column"></div>
            <div class="column"></div>
        </div>
        <!-- //.background-grid -->
        
        
    </div>
    <!-- //PRELOADER END -->
    
    
    
    <!-- BORDER SITE START -->
    <div class="border-site bs-top"></div>
    <div class="border-site bs-right"></div>
    <div class="border-site bs-left"></div>
    <div class="border-site bs-bottom"></div>
    <!-- //BORDER SITE END -->
    
    
    
    <!-- NAV TRIGGER START -->
    <div class="nav-trigger nav-trigger-open">
        <div class="nav-toggle">
            <span></span>
            <span></span>
            <span></span>
        </div>
        <!-- //.nav-toggle -->
    </div>
    <!-- //NAV TRIGGER END -->
    
    
    
    <!-- NAVIGATION START -->
    <nav id="navigation" class="navbar navbar-fixed-top" role="navigation">
        <div class="container-fluid display-table height-100 width-100">
            <div class="display-table-cell vertical-align-middle width-100">
                <div class="nav-trigger nav-trigger-close">
                    <span></span>
                    <span></span>
                </div>
                <!-- //.nav-trigger -->

                <ul class="nav navbar-nav font-family-alt text-extra-large text-uppercase">
                    <li class="page-scroll">
                        <a href="http://shannacote.com">Home</a>
                    </li>

                    <li class="page-scroll">
                        <a href="#introduction">Intro</a>
                    </li>

                    <li class="page-scroll">
                        <a href="#profile">Profile</a>
                    </li>

                    <li class="page-scroll">
                        <a href="#collaboration">Collaboration</a>
                    </li>

                    <li class="page-scroll">
                        <a href="#project">Projects</a>
                    </li>

                    <li class="page-scroll">
                        <a href="#studio">Photography</a>
                    </li>

                    <li class="page-scroll">
                        <a href="#contact">Contact</a>
                    </li>
                </ul>
                <!-- //.navbar-nav -->

                <div class="nav-social no-padding-rl no-padding-bottom padding-15">
                    <div class="inner-content">
                        <ul class="list-unstyled list-inline font-family-alt no-letter-spacing text-extra-large">
                            <li>
                                <a href="http://instagram.com/justshan" target="_blank"><i class="fa fa-instagram"></i></a>
                            </li>

                            <li>
                                <a href="http://www.dribbble.com/shan" target="_blank"><i class="fa fa-dribbble"></i></a>
                            </li>

                            <li>
                                <a href="http://www.linkedin.com/in/justshan" target="_blank"><i class="fa fa-linkedin"></i></a>
                            </li>
                        </ul>
                        <span class="display-inline-block font-family-alt text-large">
                            shan@justshan.com
                        </span>
                    </div>
                    <!-- //.inner-content -->
                </div>
                <!-- //.nav-social -->
            </div>
            <!-- //.display-table-cell -->
        </div>
        <!-- //.container-fluid -->
    </nav>
    <!-- //NAVIGATION END -->
    
    
    
    <!-- HEADER START -->
    <header class="header">
        <div class="logo">
            <a href="http://shannacote.com">
                <img src="assets/images/logo.png" alt="logo" class="img-responsive"/>
            </a>
        </div>
        <!-- //.logo -->
    </header>
    <!-- //HEADER END -->
  
    
    
    <!-- BACKGROUND GRID START -->
    <div class="background-grid">
        <div class="column"></div>
        <div class="column"></div>
        <div class="column"></div>
        <div class="column"></div>
        <div class="column"></div>
        <div class="column"></div>
    </div>
    <!-- //BACKGROUND GRID END -->
    
    
    
    <!-- SECTION - HERO START -->
    <section id="hero" class="section fourohfour background-cover background-gray background-position-center height-100 no-padding-tb">
        <div class="section-content display-table width-100 height-100">
            <div class="container display-table-cell vertical-align-middle text-center">
                <div class="skrollable skrollable-between" data-0="opacity: 1; transform: translate3d(0px, 0px, 0px);" data-top-bottom="opacity: 0; transform: translate3d(0px, 300%, 0px);">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="hero-title display-inline-block position-relative">
                                
                            </div>
                            <!-- //.hero-title -->
                        </div>
                        <!-- //.col-md-12 -->
                    </div>
                    <!-- //.row -->
                </div>
                <!-- //.skrollable -->
            </div>
            <!-- //.container -->
        </div>
        <!-- //.section-content -->

        <div class="scroll-down skrollable skrollable-between width-100" data-0="opacity: 1; transform: translate3d(0px, 0px, 0px);" data-top-bottom="opacity: 0; transform: translate3d(0px, 300%, 0px);">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="page-scroll text-center">
                            <a href="#introduction"><i class=" icon-Arrow-Down icon-medium"></i></a>
                            <span class="display-block text-uppercase">Scroll Down</span>
                        </div>
                        <!-- //.page-scroll -->
                    </div>
                    <!-- //.col-md-12 -->
                </div>
                <!-- //.row -->
            </div>
            <!-- //.container -->
        </div>
        <!-- //.scroll-down -->
    </section>
    <!-- //SECTION - HERO END -->
    
    
    <!-- Loading jQuery -->
    <script src="assets/plugins/jquery/jquery.min.js"></script>
    
    <!-- Loading Bootstrap JS -->
    <script src="assets/plugins/bootstrap/js/bootstrap.min.js"></script>
    
    <!-- Include all js plugins (below) -->
    <script src="assets/plugins/debouncer/debouncer.js"></script>
    <script src="assets/plugins/jpreloader/js/jpreloader.min.js"></script>
    <script src="assets/plugins/easing/jquery.easing.min.js"></script>
    <script src="assets/plugins/skrollr/skrollr.min.js"></script>
    <script src="assets/plugins/chartist-js/chartist.min.js"></script>
    <script src="assets/plugins/isotope/isotope.pkgd.min.js"></script>
    <script src="assets/plugins/magnific-popup/jquery.magnific-popup.min.js"></script>
    <script src="assets/plugins/flexslider/jquery.flexslider-min.js"></script>
    <script src="assets/plugins/tiny-scrollbar/jquery.tinyscrollbar.min.js"></script>
    <script src="assets/plugins/flickity/flickity.pkgd.min.js"></script>
    
    <!-- Loading Theme JS -->
    <script src="assets/js/main.js"></script>
    <script src="assets/js/text-rotator.js"></script>
    <script src="assets/js/project.js"></script>

    
</body>
</html>