Merge pull request #65 from raziraz/master

Faq page added

app/controllers/HomeController.php

@@ -33,6 +33,15 @@ class HomeController extends BaseController {
 	{
 		return View::make('public.terms');
 	}
+    	public function showFaq()
+	{
+		return View::make('public.faq');
+	}
+	public function showFeatures()
+	{
+		return View::make('public.features');
+	}
+
 
 	public function doContactUs()
 	{

app/routes.php

@@ -29,6 +29,8 @@ Route::get('/about', 'HomeController@showAboutUs');
 Route::get('/terms', 'HomeController@showTerms');
 Route::get('/contact', 'HomeController@showContactUs');
 Route::post('/contact', 'HomeController@doContactUs');
+Route::get('/faq', 'HomeController@showFaq');
+Route::get('/features', 'HomeController@showFeatures');
 
 Route::get('log_error', 'HomeController@logError');
 Route::post('get_started', 'AccountController@getStarted');

app/views/public/faq.blade.php

@@ -0,0 +1,203 @@
+@extends('public.header') 
+
+@section('content')
+
+    
+<section class="hero background hero5" data-speed="2" data-type="background">
+  <div class="caption-side"></div>
+  <div class="container">
+    <div class="row" style="margin:0;">
+      <div class="caption-wrap">
+        <div class="caption">
+          <h1>THE <span style="color:#2299c0">Faq's</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+    <section class="faq">
+        <div class="container">
+            <div class="row">
+                <div class="col-md-7">
+                    <div class="question">
+                        <a class="expander" href="#">I know it isn’t standard
+                        ninja practice to reveal too many identity details, but
+                        who are you guys exactly?</a>
+
+                        <div class="content">
+                            <p>We’re a small team of highly skilled digital
+                            journeymen based in Israel. We love open source, we
+                            love disrupting the big business status quo, and we
+                            love building helpful tools that are easy to use.
+                            We believe that everyone else’s web-based cash flow
+                            tools are unnecessarily expensive, clunky and
+                            complicated - and we’re bent on proving these
+                            beliefs with Invoice Ninja.</p>
+                        </div>
+                    </div>
+
+                    <div class="question">
+                        <a class="expander" href="#">How do I get started using
+                        Invoice Ninja?</a>
+
+                        <div class="content">
+                            <p>Just click on the big, yellow “Invoice Now”
+                            button on our homepage!</p>
+                        </div>
+                    </div>
+
+                    <div class="question">
+                        <a class="expander" href="#">Do you offer customer
+                        support?</a>
+
+                        <div class="content">
+                            <p>We sure do. Support is super important to us.
+                            Feel free to email us at <a href=
+                            "mailto:support@invoiceninja.com">support@invoiceninja.com</a>
+                            with any questions you might have. We almost always
+                            reply within one business day.</p>
+                        </div>
+                    </div>
+
+                    <div class="question">
+                        <a class="expander" href="#">Is Invoice Ninja really
+                        free? For how long?</a>
+
+                        <div class="content">
+                            <p>Yes, it is 100% free. Forever and ever. For
+                            real.</p>
+                        </div>
+                    </div>
+
+                    <div class="question">
+                        <a class="expander" href="#">How is Invoice Ninja able
+                        to offer this all for free? How are you making any
+                        money?</a>
+
+                        <div class="content">
+                            <p>We’re mostly in this line of work because we
+                            believe it’s high time that a good electronic
+                            invoicing tools be available for free. There isn’t
+                            much money in it - yet. When our users open up new
+                            accounts with payment processor gateways by
+                            clicking on links from our site, we make modest
+                            commissions as a gateway affiliate. So if zillions
+                            of freelancers and small businesses start running
+                            credit card charges through Invoice Ninja, there’s
+                            a decent chance we might recover our investment.
+                            Maybe not.</p>
+                        </div>
+                    </div>
+
+                    <div class="question">
+                        <a class="expander" href="#">Really? So does that mean
+                        you’re not collecting information about me so you can
+                        sell me stuff or so that some other company can spam me
+                        according to my interests?</a>
+
+                        <div class="content">
+                            <p>No way. We’re not mining your data, and we’re
+                            not selling you out. That wouldn’t be very ninja of
+                            us, would it?</p>
+                        </div>
+                    </div>
+
+                    <div class="question">
+                        <a class="expander" href="#">But don’t you have access
+                        to my merchant and banking accounts?</a>
+
+                        <div class="content">
+                            <p>Actually, we don’t. When you link an account at
+                            a third party financial institution with your
+                            Invoice Ninja account, you’re essentially giving
+                            our app permission to send money to you and nothing
+                            more. This is all managed by the tech teams at your
+                            financial service providers, who go to great
+                            lengths to ensure their integrations can’t be
+                            exploited or abused.</p>
+                        </div>
+                    </div>
+
+                    <div class="question">
+                        <a class="expander" href="#">Given that Invoice Ninja
+                        is an open source app, how can I be sure that my
+                        financial information is safe with you?</a>
+
+                        <div class="content">
+                            <p>There’s a big difference between “open source”
+                            and “open data.” Anyone who wants to use the code
+                            that drives Invoice Ninja to create their own
+                            products or to make improvements to ours can do so.
+                            It’s available for anyone who wants to download and
+                            work with. But that’s just the source code -
+                            totally separate from what happens with that code
+                            on the Invoice Ninja servers. You’re the only one
+                            who has full access to what you're doing with our
+                            product. For more details on the security of our
+                            servers and how we handle our users’ information,
+                            please read the next question.</p>
+                        </div>
+                    </div>
+
+                    <div class="question">
+                        <a class="expander" href="#">So just how secure is this
+                        app?</a>
+
+                        <div class="content">
+                            <p>Extremely. Data uploaded by our users runs
+                            through connections with 256-bit encryption, which
+                            is twice as many encryption bits that most bank
+                            websites use. We use the TLS 1.0 cryptographic
+                            protocol, AES_256_CBC string encryption, SHA1
+                            message authentication and DHE_RSA key exchanges.
+                            It’s fancy stuff that we put in place to make sure
+                            no one can gain access to your information except
+                            you.</p>
+                        </div>
+                    </div>
+
+                    <div class="question">
+                        <a class="expander" href="#">I’m interested in removing
+                        the small "Created by Invoice Ninja” image from the
+                        bottom of my invoices. Will you one day offer a
+                        premium, non-branded or otherwise white label-able
+                        version of Invoice Ninja?</a>
+
+                        <div class="content">
+                            <p>We are considering one day exploring optional
+                            features like this and will be happy to hear from
+                            you with any suggestions.</p>
+                        </div>
+                    </div>
+
+                    <div class="question">
+                        <a class="expander" href="#">My question wasn’t covered
+                        by any of the content on this FAQ page. How can I get
+                        in touch with you?</a>
+
+                        <div class="content">
+                            <p>Please email us at <a href=
+                            "mailto:contact@invoiceninja.com">contact@invoiceninja.com</a>
+                            with any questions or comments you have. We love
+                            hearing from the people who use our app! We’ll do
+                            our best to reply to your email within the business
+                            day.</p>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="col-md-4 col-md-offset-1">
+                    <div class="contact-box">
+                        <h2>Did we miss something?</h2>
+
+                        <p>Please email us at <a href=
+                        "mailto:contact@invoiceninja.com" style=
+                        "font-weight: bold">contact@invoiceninja.com</a> with
+                        any questions or comments you have. We love hearing
+                        from the people who use our app! We’ll do our best to
+                        reply to your email within the business day.</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>@stop

app/views/public/header.blade.php

@@ -7,11 +7,13 @@
 <link href="{{ asset('images/apple-touch-icon-114x114-precomposed.png') }}" rel="apple-touch-icon-precomposed" sizes="114x114">
 <link href="{{ asset('images/apple-touch-icon-72x72-precomposed.png') }}" rel="apple-touch-icon-precomposed" sizes="72x72">
 <link href="{{ asset('images/apple-touch-icon-57x57-precomposed.png') }}" rel="apple-touch-icon-precomposed">
+<script src="{{ asset('js/simpleexpand.js') }}" type="text/javascript"></script>
 @stop
 
 @section('body')
 
 <div id="fb-root"></div>
+   
 <script>(function(d, s, id) {
   var js, fjs = d.getElementsByTagName(s)[0];
   if (d.getElementById(id)) return;
@@ -135,6 +137,9 @@
 </div>
 </div>
 </footer><script src="{{ asset('/js/retina-1.1.0.min.js') }}" type="text/javascript"></script>
+<script type="text/javascript">
+    $('.expander').simpleexpand();
+</script>
 
 
 

app/views/public/splash.blade.php

@@ -3,7 +3,7 @@
 @section('content') 
 
 
-<section class="hero background" data-speed="2" data-type="background">
+<section class="hero background hero1" data-speed="2" data-type="background">
   <div class="caption-side"></div>
 
   <div class="container">

public/css/splash.css

@@ -3,33 +3,45 @@ body {
     line-height: 1.6;
 }
 
-.center-block { margin: 0 auto!; float: none; }
+.center-block {
-
+    margin: 0 auto!;
-h1, h2, .btn {
+    float: none;
-font-family: 'Roboto', sans-serif;
-font-weight: 900;
-line-height: 1.1;
-text-transform: uppercase;
-color: #1a1818;
 }
+
+h1,h2,.btn {
+    font-family: Roboto, sans-serif;
+    font-weight: 900;
+    line-height: 1.1;
+    text-transform: uppercase;
+    color: #1a1818;
+}
+
 h1 {
-font-size: 45px;
+    font-size: 45px;
 }
-h2 {
-font-size: 20px;
-}
-a, a .cta h2, .socicon, .btn {
--webkit-transition: all 0.3s ease-in-out;
-  -moz-transition: all 0.3s ease-in-out;
-  -o-transition: all 0.3s ease-in-out;
-  transition: all 0.3s ease-in-out;
-}
-a:hover {
-text-decoration: none;
-}
-.center { text-align:center; }
 
-.white-bg { background-color:#fff; }
+h2 {
+    font-size: 20px;
+}
+
+a,a .cta h2,.socicon,.btn {
+    -webkit-transition: all .3s ease-in-out;
+    -moz-transition: all .3s ease-in-out;
+    -o-transition: all .3s ease-in-out;
+    transition: all .3s ease-in-out;
+}
+
+a:hover {
+    text-decoration: none;
+}
+
+.center {
+    text-align: center;
+}
+
+.white-bg {
+    background-color: #fff;
+}
 
 .navbar {
     background: #2e2b2b;
@@ -37,6 +49,7 @@ text-decoration: none;
     border: none;
     border-radius: 0;
 }
+
 ul.navbar-list {
     float: right;
     list-style-type: none;
@@ -44,26 +57,31 @@ ul.navbar-list {
     margin: 0;
     padding: 0;
 }
+
 ul.navbar-list li {
     display: inline;
-	font-family: 'Roboto', sans-serif;
+    font-family: Roboto, sans-serif;
     font-weight: 700;
     margin: 40px 0;
 }
+
 ul.navbar-list li a {
     color: #fff;
     padding-left: 20px;
     margin-left: 20px;
     border-left: 1px solid #4f4b4b;
 }
-ul.navbar-list li:last-child a{
+
+ul.navbar-list li:last-child a {
     color: #ebbe09;
 }
-ul.navbar-list li:first-child a{
+
+ul.navbar-list li:first-child a {
     border-left: none;
     margin: 0;
     padding: 0;
 }
+
 ul.navbar-list li a:hover {
     color: #ebbe09;
     text-decoration: none;
@@ -80,6 +98,7 @@ a .cta h2 {
     float: left;
     margin: 0;
 }
+
 a .cta h2 span {
     width: 63px;
     height: 63px;
@@ -90,12 +109,13 @@ a .cta h2 span {
     float: right;
     font-weight: 700;
     font-size: 20px;
-	font-family: 'Roboto', sans-serif;
+    font-family: Roboto, sans-serif;
-	-webkit-transition: all 0.1s ease-in-out;
+    -webkit-transition: all .1s ease-in-out;
-  -moz-transition: all 0.1s ease-in-out;
+    -moz-transition: all .1s ease-in-out;
-  -o-transition: all 0.1s ease-in-out;
+    -o-transition: all .1s ease-in-out;
-  transition: all 0.1s ease-in-out;
+    transition: all .1s ease-in-out;
 }
+
 a .cta:hover span {
     font-size: 40px;
     background: #f2c40a;
@@ -104,7 +124,30 @@ a .cta:hover span {
 .hero {
     background-image: url(/images/hero-bg-1.jpg);
 }
+
 .hero .caption-side {
+    background: #fff;
+    width: 50%;
+    padding-right: 15px;
+    position: absolute;
+    left: 0;
+    height: 109px;
+    
+}
+
+.hero .caption {
+    width: 61.5%;
+    background: #fff;
+    padding-right: 15px;
+    position: relative;
+    padding: 10px 35px 20px;
+    height: 109px;
+    border-left: 1px dotted #ccc;
+   
+}
+
+
+.hero1 .caption-side {
     background: #fff;
     width: 50%;
     padding-right: 15px;
@@ -114,16 +157,17 @@ a .cta:hover span {
     margin-top: 100px;
 }
 
-.hero .caption {
+.hero1 .caption {
     width: 61.5%;
     background: #fff;
     padding-right: 15px;
     position: relative;
-	padding: 10px 35px 20px 35px;
+    padding: 10px 35px 20px;
     height: 212px;
     border-left: 1px dotted #ccc;
     margin-top: 100px;
 }
+
 .hero2 {
     text-align: center;
     background-image: url(/images/hero-bg-2.jpg);
@@ -132,6 +176,7 @@ a .cta:hover span {
     background-position: bottom center;
     background-size: cover;
 }
+
 .hero3 {
     text-align: center;
     background-image: url(/images/hero-bg-3.jpg);
@@ -140,6 +185,7 @@ a .cta:hover span {
     background-position: center center;
     background-size: cover;
 }
+
 .hero4 {
     text-align: center;
     background-image: url(/images/hero-bg-4.jpg);
@@ -148,54 +194,81 @@ a .cta:hover span {
     background-position: center center;
     background-size: cover;
 }
-.hero2 h1, .hero3 h1, .hero4 h1 {
+.hero5 {
+    text-align: center;
+    background-image: url(/images/hero-bg-3.jpg);
+    padding: 150px 0;
+    background-repeat: no-repeat;
+    background-position: center center;
+    background-size: cover;
+}
+
+.hero2 h1,.hero3 h1,.hero4 h1 {
     color: #fff;
     margin: 0;
 }
-.background {
+
+.hero1.background {
     background-repeat: no-repeat;
     background-position: center center;
     background-attachment: static;
     background-size: cover;
     min-height: 500px;
 }
-section.features, section.upper-footer { 
+
-margin: 60px 0;
+section.features,section.upper-footer {
+    margin: 60px 0;
 }
+
 section.upper-footer.white-bg {
-margin: 0;
+    margin: 0;
-padding: 60px 0;
+    padding: 60px 0;
 }
-section.features .col-md-3  .box{
+
+section.features .col-md-3 .box {
     padding: 20px;
     background: #ebbe09;
     text-align: center;
     color: #fff;
 }
-section.features .col-md-3.two .box{ background: #36c157; }
-section.features .col-md-3.three .box{ background: #e27329; }
-section.features .col-md-3.four .box{ background: #2299c0; }
-section.features h2 { 
-margin: 30px 0 15px; 
-color: #fff; 
-}
-section.features .col-md-3  .box .icon {
-margin-left: -20px;
-margin-top: -20px;
 
-text-align: left;
+section.features .col-md-3.two .box {
+    background: #36c157;
 }
+
+section.features .col-md-3.three .box {
+    background: #e27329;
+}
+
+section.features .col-md-3.four .box {
+    background: #2299c0;
+}
+
+section.features h2 {
+    margin: 30px 0 15px;
+    color: #fff;
+}
+
+section.features .col-md-3 .box .icon {
+    margin-left: -20px;
+    margin-top: -20px;
+    text-align: left;
+}
+
 section.blue {
     display: none;
     background: #2299c0;
     color: #fff;
 }
+
 section.blue .col-md-6 {
     text-align: center;
 }
+
 section.blue .col-md-6:last-child h1 {
     border-left: none;
 }
+
 section.blue .col-md-6 h1 {
     border-left: 1px dotted #46b9df;
     border-right: 1px dotted #46b9df;
@@ -204,6 +277,7 @@ section.blue .col-md-6 h1 {
     padding: 100px 0;
     margin: 0;
 }
+
 section.blue .col-md-6 h1 span {
     font-size: 36px;
     font-weight: 100;
@@ -211,10 +285,20 @@ section.blue .col-md-6 h1 span {
     text-transform: lowercase;
 }
 
-section.about { padding: 70px 0; }
+section.about {
-section.about h2 { margin: 0 0 25px 0; font-size: 25px; text-transform:none;}
+    padding: 70px 0;
-section.about .screendump { background-color:#ccc; height:220px;}
+}
 
+section.about h2 {
+    margin: 0 0 25px;
+    font-size: 25px;
+    text-transform: none;
+}
+
+section.about .screendump {
+    background-color: #ccc;
+    height: 220px;
+}
 
 section.contact .address .glyphicon {
     background: #edd71e;
@@ -226,136 +310,181 @@ section.contact .address .glyphicon {
     color: #1a1818;
     margin-right: 15px;
 }
+
 section.contact .address p {
     margin-bottom: 20px;
 }
+
 section.contact .address span.push {
     margin-left: 55px;
     line-height: 25px;
 }
 
 section.contact .form-control {
-display: block;
+    display: block;
-width: 100%;
+    width: 100%;
-height: 40px;
+    height: 40px;
-padding: 6px 12px;
+    padding: 6px 12px;
-font-size: 14px;
+    font-size: 14px;
-line-height: 1.42857143;
+    line-height: 1.42857143;
-color: #555;
+    color: #555;
-background-color: #fff;
+    background-color: #fff;
-background-image: none;
+    background-image: none;
-border: none;
+    border: none;
-border-radius: 0;
+    border-radius: 0;
--webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
+    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
+    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
--webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
+    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
+    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
 }
 
 section.contact textarea.form-control {
-height: auto;
+    height: auto;
+}
+
+section.faq {
+    padding: 70px 0;
+}
+
+section.faq a.expander {
+    display: block;
+    font-size: 18px;
+    font-family: Roboto, sans-serif;
+    font-weight: 700;
+    margin-bottom: 10px;
+}
+
+section.faq .question {
+    padding-bottom: 20px;
+    margin-bottom: 30px;
+    border-bottom: 1px solid #e0e0e0;
+}
+
+section.faq .content {
+}
+
+section.faq .contact-box {
+    padding: 20px;
+    text-align: center;
+    color: #fff;
+    background: #2299c0;
+}
+
+section.faq .contact-box h2 {
+    margin: 30px 0 15px;
+    color: #fff;
+}
+
+section.faq .contact-box a {
+    color: #2e2b2b;
+}
+
+section.faq .contact-box p {
+    margin-bottom: 30px;
 }
 
 .btn-primary {
-color: #fff;
+    color: #fff;
-background-color: #2299c0;
+    background-color: #2299c0;
-border: none;
+    border: none;
-text-align: center;
+    text-align: center;
     border-radius: 0;
     height: 63px;
-line-height: 63px;
+    line-height: 63px;
     padding: 0;
     width: 100%;
     text-align: center;
 }
-.btn-primary:hover {background-color: #2299c0;}
+
+.btn-primary:hover {
+    background-color: #2299c0;
+}
+
 section.contact button span.glyphicon {
     background-color: transparent;
     color: #fff;
     float: right;
 }
+
 section.contact .btn span.glyphicon {
     background-color: #1e84a5;
     height: 63px;
     line-height: 63px;
     width: 63px;
     margin-top: -1px;
-    -webkit-transition: all 0.1s ease-in-out;
+    -webkit-transition: all .1s ease-in-out;
--moz-transition: all 0.1s ease-in-out;
+    -moz-transition: all .1s ease-in-out;
--o-transition: all 0.1s ease-in-out;
+    -o-transition: all .1s ease-in-out;
-transition: all 0.1s ease-in-out;
+    transition: all .1s ease-in-out;
 }
+
 section.contact .btn:hover span.glyphicon {
     font-size: 25px;
 }
 
-
+section.contact textarea:focus,input[type=text]:focus,input[type=password]:focus,input[type=datetime]:focus,input[type=datetime-local]:focus,input[type=date]:focus,input[type=month]:focus,input[type=time]:focus,input[type=week]:focus,input[type=number]:focus,input[type=email]:focus,input[type=url]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=color]:focus,.uneditable-input:focus {
-section.contact textarea:focus,
+    border-color: rgba(0,0,0,0.8);
-input[type="text"]:focus,
-input[type="password"]:focus,
-input[type="datetime"]:focus,
-input[type="datetime-local"]:focus,
-input[type="date"]:focus,
-input[type="month"]:focus,
-input[type="time"]:focus,
-input[type="week"]:focus,
-input[type="number"]:focus,
-input[type="email"]:focus,
-input[type="url"]:focus,
-input[type="search"]:focus,
-input[type="tel"]:focus,
-input[type="color"]:focus,
-.uneditable-input:focus {
-  border-color: rgba(0, 0, 0, 0.8);
     outline: 0;
     outline: thin dotted \9;
-  /* IE6-9 */
+/* IE6-9 */
-
     -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0), 0 0 8px rgba(0,0,0,.2) !important;
     -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0), 0 0 8px rgba(0,0,0,.2) !important;
     box-shadow: inset 0 1px 1px rgba(0,0,0,0), 0 0 8px rgba(0,0,0,.2) !important;
 }
-section.contact address { display: inline-block;}
+
+section.contact address {
+    display: inline-block;
+}
 
 footer .navbar-inner {
     float: right;
 }
+
 footer ul.navbar-list {
     clear: both;
 }
+
 footer ul.navbar-list:last-child {
     margin-top: 5px;
 }
+
 footer ul.navbar-list:last-child li {
     font-size: 12px;
 }
+
 footer ul.navbar-list:last-child li {
     font-size: 12px;
 }
-footer ul.navbar-list:last-child li:last-child a{
+
+footer ul.navbar-list:last-child li:last-child a {
     color: #fff;
 }
+
 footer .social {
     float: left;
 }
+
 footer .social .socicon {
-    font-family: 'socicon' !important;
+    font-family: socicon !important;
     font-size: 25px;
     margin-right: 8px;
 }
+
 footer .social .socicon {
     color: #fff;
 }
+
 footer .social .socicon:hover {
     color: #edd71e;
 }
+
 footer .social p {
     font-size: 12px;
-	font-family: 'Roboto', sans-serif;
+    font-family: Roboto, sans-serif;
     margin: 0;
 }
 
-@media (min-width: 768px) and (max-width: 1200px) { 
+@media min-width 768px and max-width 1200px {
     .hero .caption-side {
         background: #fff;
         width: 50%;
@@ -364,70 +493,75 @@ footer .social p {
         left: 0;
         height: 283px;
         margin-top: 70px;
-}
+    }
     
-.hero .caption {
+    .hero .caption {
         width: 61.3%;
         background: #fff;
         padding-right: 15px;
         position: relative;
-	padding: 10px 35px 20px 35px;
+        padding: 10px 35px 20px;
         height: 283px;
         border-left: 1px dotted #ccc;
         margin-top: 70px;
-}
+    }
+
 }
 
-@media (min-width: 768px) and (max-width: 992px) { 
+@media min-width 768px and max-width 992px {
-.features .col-md-3 {
+    .features .col-md-3 {
-width: 50%;
+        width: 50%;
-float: left;
+        float: left;
-margin-bottom: 10px;
+        margin-bottom: 10px;
-}
-.hero .caption-side {
-		display:none;
     }
+    
+    .hero .caption-side {
+        display: none;
+    }
+    
     .hero .caption {
         width: 100%;
         background: #fff;
-		padding: 10px 35px 20px 35px;
+        padding: 10px 35px 20px;
         height: auto;
         border-left: none;
         margin-bottom: 10px;
         text-align: center;
     }
+
 }
 
-
+@media max-width 768px {
-@media (max-width: 768px) {
-    
     h1 {
         font-size: 30px;
     }
     
     .navbar {
         text-align: center;
-		padding: 25px 0 18px 0;
+        padding: 25px 0 18px;
     }
+    
     ul.navbar-list {
         float: none;
         margin-top: 10px;
     }
     
     .hero .caption-side {
-		display:none;
+        display: none;
     }
+    
     .hero .caption {
         width: 100%;
         background: #fff;
-		padding: 10px 35px 20px 35px;
+        padding: 10px 35px 20px;
         height: auto;
         border-left: none;
-		margin-top: 0px;
+        margin-top: 0;
         margin-bottom: 10px;
         text-align: center;
     }
-	.hero2, .hero3, .hero4 {
+    
+    .hero2,.hero3,.hero4 {
         padding: 50px 0;
     }
     
@@ -439,86 +573,112 @@ margin-bottom: 10px;
         min-height: 1px;
         padding: 50px 0;
     }
-	section.features, section.upper-footer { 
+    
+    section.features,section.upper-footer {
         margin: 30px 0;
     }
+    
     section.upper-footer.white-bg {
         padding: 30px 0;
     }
     
-section.features .col-md-3  .box{
+    section.features .col-md-3 .box {
-margin-bottom: 10px;
+        margin-bottom: 10px;
-}
+    }
-section.blue .col-md-6 h1 {
+    
+    section.blue .col-md-6 h1 {
         border-left: none;
         border-right: none;
         border-top: 1px dotted #46b9df;
         padding: 30px 0;
-}
+    }
-section.blue .col-md-6 h1 span {
+    
+    section.blue .col-md-6 h1 span {
         font-size: 25px;
         font-weight: 100;
         display: block;
         text-transform: lowercase;
-}
+    }
-section.about {
+    
+    section.about {
         padding: 30px 0;
         text-align: center;
-}
+    }
-section.about.contact {
+    
-    padding: 30px 0 0 0;
+    section.about.contact {
-}
+        padding: 30px 0 0;
-section.contact .address {margin: 0;}
+    }
-section.contact .address p {text-align:center;}
+    
-section.contact .address .glyphicon {
+    section.contact .address {
-display:block;
+        margin: 0;
-margin: 0 auto 7px auto;
+    }
+    
+    section.contact .address p {
+        text-align: center;
+    }
+    
+    section.contact .address .glyphicon {
+        display: block;
+        margin: 0 auto 7px;
         float: none;
-}
+    }
-section.contact .address span.push {
+    
-margin-left: 0;
+    section.contact .address span.push {
-}
+        margin-left: 0;
-section.contact .btn { margin-bottom: 5px; }
+    }
-section.about p {
+    
+    section.contact .btn {
+        margin-bottom: 5px;
+    }
+    
+    section.about p {
         margin-bottom: 0;
         margin-top: 10px;
-}
+    }
-section.about .screendump {
+    
+    section.about .screendump {
         margin-top: 25px;
-}
+    }
-section.about.white-bg .screendump {
+    
+    section.about.white-bg .screendump {
         margin-top: 0;
         margin-top: 0;
         margin-bottom: 20px;
-}
+    }
-section.about h2 {
+    
-    margin: 0 0 15px 0;
+    section.about h2 {
-}
+        margin: 0 0 15px;
-#contact_form {
+    }
+    
+    #contact_form {
         margin: 0;
     }
-#feedbackForm {
+    
+    #feedbackForm {
         margin-top: 15px;
-}
+    }
-footer .navbar-inner {
+    
+    footer .navbar-inner {
         float: none;
-}
+    }
-footer ul.navbar-list:last-child {
+    
+    footer ul.navbar-list:last-child {
         height: auto;
-}
+    }
-footer .social {
+    
+    footer .social {
         float: none;
         margin-bottom: 10px;
-}
+    }
-footer .social .socicon {
-	margin-right: 8px;
-}
     
+    footer .social .socicon {
+        margin-right: 8px;
+    }
 
 }
 
 .github {
-    background-image: url('../images/GitHub.png');    
+    background-image: url(../images/GitHub.png);
     background-size: contain;
     background-repeat: no-repeat;
     width: 40px;
@@ -531,23 +691,25 @@ footer .social .socicon {
 div.fb_iframe_widget {
     display: inline;
 }
+
 div.fb_iframe_widget > span {
     vertical-align: top !important;
 }
 
-
-
-
 @font-face {
-    font-family: 'socicon';
+    font-family: socicon;
-    src: url('/fonts/socicon-webfont.eot');
+    src: url(/fonts/socicon-webfont.eot);
-    src: url('/fonts/socicon-webfont.eot?#iefix') format('embedded-opentype'),
+    src: url(/fonts/socicon-webfont.eot?#iefix) format(embedded-opentype), url(/fonts/socicon-webfont.woff) format(woff), url(/fonts/socicon-webfont.ttf) format(truetype), url(/fonts/socicon-webfont.svg#sociconregular) format(svg);
-         url('/fonts/socicon-webfont.woff') format('woff'),
+    font-weight: 400;
-         url('/fonts/socicon-webfont.ttf') format('truetype'),
-         url('/fonts/socicon-webfont.svg#sociconregular') format('svg');
-    font-weight: normal;
     font-style: normal;
 }
 
-::selection {color:#fff;background:#2e2b2b;}
+::selection {
-::-moz-selection {color:#fff;background:#2e2b2b;}
+    color: #fff;
+    background: #2e2b2b;
+}
+
+::-moz-selection {
+    color: #fff;
+    background: #2e2b2b;
+}

public/js/simpleexpand.js

@@ -0,0 +1,4 @@
+/* Copyright (C) 2012 Sylvain Hamel
+Project: https://github.com/redhotsly/simple-expand
+MIT Licence: https://raw.github.com/redhotsly/simple-expand/master/licence-mit.txt */
+(function($){"use strict";function SimpleExpand(){var that=this;that.defaults={hideMode:"fadeToggle",defaultSearchMode:"parent",defaultTarget:".content",throwOnMissingTarget:true,keepStateInCookie:false,cookieName:"simple-expand"};that.settings={};$.extend(that.settings,that.defaults);that.findLevelOneDeep=function(parent,filterSelector,stopAtSelector){return parent.find(filterSelector).filter(function(){return!$(this).parentsUntil(parent,stopAtSelector).length})};that.setInitialState=function(expander,targets){var isExpanded=that.readState(expander);if(isExpanded){expander.removeClass("collapsed").addClass("expanded");that.show(targets)}else{expander.removeClass("expanded").addClass("collapsed");that.hide(targets)}};that.hide=function(targets){if(that.settings.hideMode==="fadeToggle"){targets.hide()}else if(that.settings.hideMode==="basic"){targets.hide()}};that.show=function(targets){if(that.settings.hideMode==="fadeToggle"){targets.show()}else if(that.settings.hideMode==="basic"){targets.show()}};that.checkKeepStateInCookiePreconditions=function(){if(that.settings.keepStateInCookie&&$.cookie===undefined){throw new Error("simple-expand: keepStateInCookie option requires $.cookie to be defined.")}};that.readCookie=function(){var jsonString=$.cookie(that.settings.cookieName);if(jsonString===null||jsonString===""){return{}}else{return JSON.parse(jsonString)}};that.readState=function(expander){if(!that.settings.keepStateInCookie){return expander.hasClass("expanded")}var id=expander.attr("Id");if(id===undefined){return}var cookie=that.readCookie();var cookieValue=cookie[id];if(typeof cookieValue!=="undefined"){return cookie[id]===true}else{return expander.hasClass("expanded")}};that.saveState=function(expander,isExpanded){if(!that.settings.keepStateInCookie){return}var id=expander.attr("Id");if(id===undefined){return}var cookie=that.readCookie();cookie[id]=isExpanded;$.cookie(that.settings.cookieName,JSON.stringify(cookie),{raw:true,path:window.location.pathname})};that.toggle=function(expander,targets){var isExpanded=that.toggleCss(expander);if(that.settings.hideMode==="fadeToggle"){targets.fadeToggle(150)}else if(that.settings.hideMode==="basic"){targets.toggle()}else if($.isFunction(that.settings.hideMode)){that.settings.hideMode(expander,targets,isExpanded)}that.saveState(expander,isExpanded);return false};that.toggleCss=function(expander){if(expander.hasClass("expanded")){expander.toggleClass("collapsed expanded");return false}else{expander.toggleClass("expanded collapsed");return true}};that.findTargets=function(expander,searchMode,targetSelector){var targets=[];if(searchMode==="absolute"){targets=$(targetSelector)}else if(searchMode==="relative"){targets=that.findLevelOneDeep(expander,targetSelector,targetSelector)}else if(searchMode==="parent"){var parent=expander.parent();do{targets=that.findLevelOneDeep(parent,targetSelector,targetSelector);if(targets.length===0){parent=parent.parent()}}while(targets.length===0&&parent.length!==0)}return targets};that.activate=function(jquery,options){$.extend(that.settings,options);that.checkKeepStateInCookiePreconditions();jquery.each(function(){var expander=$(this);var targetSelector=expander.attr("data-expander-target")||that.settings.defaultTarget;var searchMode=expander.attr("data-expander-target-search")||that.settings.defaultSearchMode;var targets=that.findTargets(expander,searchMode,targetSelector);if(targets.length===0){if(that.settings.throwOnMissingTarget){throw"simple-expand: Targets not found"}return this}that.setInitialState(expander,targets);expander.click(function(){return that.toggle(expander,targets)})})}}window.SimpleExpand=SimpleExpand;$.fn.simpleexpand=function(options){var instance=new SimpleExpand;instance.activate(this,options);return this}})(jQuery);