/* ------------ Layout ------------ */

html, body {
	min-height: 100%;
	height: 100%;
}

body {
	background: #eee;
	font-size: 13px;
}

.container {
}

a, a:hover, a:active, a:visited, *:focus {
	outline: 0;
	-moz-outline-style: 0;
}
/* --------- Modal window --------- */

.modal-dialog {
	margin: 100px auto;
}

.modal-body h1 {
	margin: 10px 0 20px;
	font-size: 2.0em;
}

.modal-body p {
	text-align: center;
}

.modal-body .cta {
	margin: 30px 0 10px;
}

/* ---------- Typography ---------- */

h1, h2, h3 {
	font-family: "Roboto Light", Arial, Helvetica sans-serif;
}

h1 {
	text-align: center;
	font-weight: 300;
	font-size: 2.6em;
}

h2 {
	font-weight: 300;
	font-size: 1.4em;
}

h3 {
	font-weight: 300;
}

.cta {
	text-align: center;
}

.btn {
	padding: 10px 20px;
	border-radius: 4px;
	background-color: #ddd;
	color: #444;
	font-size: 1.0em;
	-webkit-transition: all 0.1s ease-in;
	-moz-transition: all 0.1s ease-in;
	-o-transition: all 0.1s ease-in;
	transition: all 0.1s ease-in;
}

.btn:hover {
	background-color: #eee;
	color: #333;
}

.btn-dark {
	background-color: #333;
	color: #fff;
}

.btn-dark:hover {
	background-color: #222;
	color: #fff;
}

.btn-dark:hover, 
.btn-dark:focus {
	color: #fff;
}

/* ------------ Navbar ------------ */

.navbar {
	position: fixed;
	top: -80px;
	z-index: 9999;
	width: 100%;
	-webkit-transition: top 0.3s ease-in;
	-moz-transition: top 0.3s ease-in;
	-o-transition: top 0.3s ease-in;
	transition: top 0.3s ease-in;
}

.navbar.affix {
	top: 0;
}

.navbar-inverse {
	border: none;
	background: #080808;
	box-shadow: 0 0 10px rgba(0,0,0,1);
}

.navbar .navbar-brand {
	margin-top: -4px;
}

.navbar .navbar-nav > li > a {
	border-bottom: 2px solid transparent;
}

.navbar .navbar-nav > .active > a, 
.navbar .navbar-nav > .active > a:hover, 
.navbar .navbar-nav > .active > a:focus {
	border-bottom-color: #fff;
}

.navbar.affix {
	display: block;
	border-radius: 0;
}

.navbar .nav > li:first-child > a {
	display: none;
	padding: 0;
}

.navbar .navbar-nav a span {
	display: none;
}

/* ------------ Header ------------ */

header {
	min-height: 500px;
	width: 100%;
	height: 100%;
	background: #080808;
}

header:before,
header:after {
	display: table;
	clear: both;
	content: '';
}

/* Brand */

header .brand {
	position: absolute;
	top: 15%;
	left: 50%;
	margin-left: -164px;
}


.scroll-right,
.scroll-left {
	display: block;
	width: 47px;
	height: 47px;
	background: transparent url(../img/sprite.png);
	background-repeat: no-repeat;
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
}

.scroll-right {
	background-position: -278px 0;
}

.scroll-left {
	background-position: -231px 0;
}

/* Slide down button */

header .scroll-page {
	position: absolute;
	bottom: 50px;
	left: 50%;
	display: block;
	margin-left: -23px;
	width: 47px;
	height: 47px;
	background: transparent url(../img/sprite.png) 0 0 no-repeat;
	opacity: .2;
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
}



header .container {
	position: relative;
	height: 100%;
}

header .scroll-page:hover {
	opacity: .6;
	cursor: pointer;
}

header .scroll-page:active {
	opacity: 1;
}



/* Statement */

header .statement {
	position: absolute;
	top: 45%;
}

header .statement .nav-statement {
	display: none;
}

header .statement h2 {
	margin: 0 0 20px;
	color: #fff;
	font-size: 2.0em;
	font-family: "Roboto Light", Arial, "Helvetica Neue", Helvetica, sans-serif;
}

header .statement p {
	margin-right: 20px;
	color: #666;
}

header .app-store{
         position: absolute;
         top: 45%;
         left: 37%;
         
}

header .app-store a: hover{color:grey;}



header:after {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 100;
	width: 100%;
	height: 30px;
	background: transparent url(../img/shadow.png) center top no-repeat;
	content: '';
}



.mobile_text {
    display: none;
}

.brand.mobile {
    display: none;
    }

/* ------------ Footer ------------ */

footer {
	height: auto;
	background: #333 url(../img/shadow.png) center top no-repeat;
	color: #fff;
}

footer .container {
	padding-top: 60px;
}

footer .copyright {
	margin-top: 30px;
	padding: 20px 0 10px;
	background: #2a2a2a;
	color: #666;
	text-align: center;
}

footer .copyright p {
	color: #777;
}

/* ------------- About ------------ */

.about {
	padding: 60px 0;
	background: #fafafa;
}

.about h1 {
	margin: 0 0 60px;
	font-size: 2.0em;
	font-family: "Roboto Light", Arial, Helvetica sans-serif;
}

.about .content {
	display: none;
}

.about .content.active {
	display: block;
}

.about nav {
	font-size: 1.2em;
	font-family: "Roboto Light", Arial, Helvetica sans-serif;
}

.about nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.about nav ul li {
	margin-bottom: 5px;
}

.about nav li a,
.about nav li a:link,
.about nav li a:visited {
	display: block;
	padding: 5px 10px;
	border-radius: 4px;
	color: #666;
	text-decoration: none;
	-webkit-transition: all 0.1s ease-in;
	-moz-transition: all 0.1s ease-in;
	-o-transition: all 0.1s ease-in;
	transition: all 0.1s ease-in;
}

.about nav li.active a:hover,
.about nav li.active a,
.about nav li.active a:link,
.about nav li.active a:visited {
	background: #3a3a3a;
	color: #fff;
}

.about nav li a:hover {
	background: #eee;
	color: #333;
	text-decoration: none;
	cursor: pointer;
}

.about p {
	margin-bottom: 15px;
	color: #333;
	font-size: 1.0em;
	line-height: 1.8em;
}

.about p a,
.about p a:link,
.about p a:visited,
.about p a:hover {
	color: #333;
	text-decoration: underline;
	cursor: pointer;
}

.about .truncated {
	display: none;
}

/* ----------- Features ----------- */

.features {
	position: relative;
	height: 700px;
	background: #111;
	background-position: center;
	background-repeat: no-repeat;
	color: #fff;
}

.features .tap-to-zoom {
	display: none;
}

.features .nav-features {
	display: none;
}

.features .crt-feature {
	display: none;
}

.bg-primary,
.bg-secondary,
.features-wrapper {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: transparent;
	background-position: center;
	background-size: auto 100%;
	background-repeat: no-repeat;
}

.features .container {
	padding-top: 60px;
	padding-bottom: 60px;
}

.features .image-credit {
	position: absolute;
	right: 15px;
	bottom: 10px;
	color: rgba(255,255,255,.5);
	font-size: .85em;
}

.features .image-credit a,
.features .image-credit a:link,
.features .image-credit a:visited {
	color: #fff;
	color: rgba(255,255,255,.5);
	text-decoration: none;
}

.features .image-credit a:hover {
	color: #fff;
}

.bg-primary.diary,
.bg-secondary.diary {
	background-image: url(../img/features-bg/diary-bg.jpg);
}

.bg-primary.voyeur,
.bg-secondary.voyeur {
	background-image: url(../img/features-bg/voyeur-bg.jpg);
}

.bg-primary.capturing-moment,
.bg-secondary.capturing-moment {
	background-image: url(../img/features-bg/capturing-moment-bg.jpg);
}

.bg-primary.know-yourself,
.bg-secondary.know-yourself {
	background-image: url(../img/features-bg/know-yourself-bg.jpg);
}

.bg-primary.remix,
.bg-secondary.remix {
	background-image: url(../img/features-bg/remix-bg.jpg);
}

.bg-primary.connection,
.bg-secondary.connection {
	background-image: url(../img/features-bg/connection-bg.jpg);
}

.features h1 {
	margin: 0 0 60px;
	text-shadow: 0 2px 4px rgba(0,0,0,.7);
	font-size: 2.0em;
	font-family: "Roboto Light", Arial, Helvetica sans-serif;
}

/* Feature list */

.feature {
	margin-top: 20px;
	padding: 20px;
	cursor: pointer;
	-webkit-transition: all 0.1s ease-in;
	-moz-transition: all 0.1s ease-in;
	-o-transition: all 0.1s ease-in;
	transition: all 0.1s ease-in;
}

.feature:first-child {
	margin-top: 50px;
}

.feature:hover {	
	background: rgba(0,0,0,.05);
}

.feature.active {
	background: rgba(0,0,0,.2);
}

.features [class*="col-"]:first-child .feature {
	margin-right: -100px;
	padding-right: 40px;
	border-radius: 6px 0 0 6px;
}

.features [class*="col-"]:last-child .feature {
	margin-left: -99px;
	padding-left: 40px;
	border-radius: 0 6px 6px 0;
}

.feature h2 {
	margin: 0 0 10px;
	text-shadow: 0 2px 4px rgba(0,0,0,.7);
}

.feature p {
	margin-bottom: 0;
	color: rgba(255,255,255,.5);
}

/* Showcases */

.feature-showcases {
	margin: 0 auto;
	padding-top: 71px;
	width: 233px;
	height: 498px;
	background: transparent url(../img/sprite.png) 0 -47px no-repeat;
}

.feature-showcases .cliping-mask {
	width: 200px;
	height: 360px;
}

.feature-showcases .screen,
.feature-showcases .screen .background,
.feature-showcases .screen .controls {
	width: 200px;
	height: 360px;
}

.feature-showcases .screen {
	position: relative;
	overflow: hidden;
	margin: 0 0 0 18px;
}

.feature-showcases .screen .screen-bg-primary,
.feature-showcases .screen .screen-bg-secondary {
	position: absolute;
	top: 0;
	left: 0;
	width: 200px;
	height: 360px;
	background-color: transparent;
	background-position: center;
	background-repeat: no-repeat;
}

.feature-showcases .screen .screen-bg-secondary {
	left: 100%;
	display: none;
}

.feature-showcases .screen .screen-bg-primary.diary,
.feature-showcases .screen .screen-bg-secondary.diary {
	background-image: url(../img/features/diary-screen.jpg);
}

.feature-showcases .screen .screen-bg-primary.voyeur,
.feature-showcases .screen .screen-bg-secondary.voyeur {
	background-image: url(../img/features/voyeur-screen.jpg);
}

.feature-showcases .screen .screen-bg-primary.capturing-moment,
.feature-showcases .screen .screen-bg-secondary.capturing-moment {
	background-image: url(../img/features/capturing-moment-screen.jpg);
}

.feature-showcases .screen .screen-bg-primary.know-yourself,
.feature-showcases .screen .screen-bg-secondary.know-yourself {
	background-image: url(../img/features/know-yourself-screen.jpg);
}

.feature-showcases .screen .screen-bg-primary.remix,
.feature-showcases .screen .screen-bg-secondary.remix {
	background-image: url(../img/features/remix-screen.jpg);
}

.feature-showcases .screen .screen-bg-primary.connection,
.feature-showcases .screen .screen-bg-secondary.connection {
	background-image: url(../img/features/connection-screen.jpg);
}

.feature-showcases .screen .controls {
	position: absolute;
	top: 0;
	left: 0;
	background: transparent url(../img/sprite.png) -233px -47px no-repeat;
}

.feature-showcases .screen .screen-content {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 200px;
}

.feature-showcases .screen .screen-content .visual-hashtags {
	margin: 0 0 0 2px;
	width: 100px;
	height: 30px;
	background-image: url(../img/sprite.png);
	background-position: -233px -437px;
	background-repeat: no-repeat;
}

.feature-showcases .screen .screen-content.diary .visual-hashtags {
	background-position: -233px -407px;
}

.feature-showcases .screen .screen-content.voyeur .visual-hashtags {
	background-position: -233px -437px;
}

.feature-showcases .screen .screen-content.capturing-moment .visual-hashtags {
	background-position: -233px -467px;
}

.feature-showcases .screen .screen-content.remix .visual-hashtags {
	background-position: -233px -497px;
}

.feature-showcases .screen .screen-content.remix.remix-toggle .visual-hashtags {
	background-position: -233px -527px;
}

.feature-showcases .screen .screen-content.connection .visual-hashtags {
	background-position: -233px -557px;
}

.feature-showcases .screen .screen-content .caption {
	display: block;
	margin: 5px 10px 10px;
	padding: 10px;
	background: rgba(0,0,0,.5);
	text-align: left;
	font-size: 11px;
}

.feature-showcases .screen .screen-content.know-yourself .visual-hashtags,
.feature-showcases .screen .screen-content.know-yourself .caption {
	display: none;
}

.feature-showcases.know-yourself .controls {
	background-position: -433px -47px;
}

/* Icons */

.icon {
	float: left;
	margin: -3px 5px 0 0;
	width: 25px;
	height: 25px;
	background-color: transparent;
	background-image: url(../img/sprite.png);
	background-repeat: no-repeat;
}

.icon-feather {
	background-position: -47px 0;
}

.icon-rocket {
	background-position: -72px 0;
}

.icon-aperture {
	background-position: -97px 0;
}

.icon-person {
	background-position: -123px 0;
}

.icon-remix {
	background-position: -150px 0;
}

.icon-link {
	background-position: -175px 0;
}

/* ------------ Invest ------------ */

.invest {
	padding: 60px 0;
	border-top: 1px solid #ddd;
	background: #eee;
}

.invest h1 {
	margin: 0 0 60px;
	font-size: 2.0em;
}

.invest p {
	margin-bottom: 50px;
	padding: 0 150px;
	text-align: center;
	line-height: 1.8em;
}

/* --------- Get in touch --------- */

.contact-form {
	margin: 0 auto;
	width: 500px;
}

.contact-form:before,
.contact-form:after {
	display: table;
	clear: both;
	content: '';
}

.contact-form h2 {
	margin: 0px 0 30px;
	color: #fff;
	text-align: center;
	font-size: 1.8em;
}

.contact-form .form-group {
	position: relative;
	margin: 0;
	border-bottom: 1px solid #555;
}

.contact-form .form-group.form-submit {
	margin-top: 20px;
	border-bottom: none;
	text-align: center;
}

.contact-form .form-group.safety {
	display: none;
}

.contact-form input,
.contact-form textarea{
	margin: 13px 0;
	padding: 0;
	height: auto;
	border: none;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: #999;
	font-size: 1.0em;
	resize: none;
}

.expanding-wrapper {
	margin: 13px 0;
}

.contact-form label {
	position:absolute;
	top: 3px;
	left:0;
	color:#999;
	font-weight: normal;
	font-size: 1.0em;
	cursor: text;
	transition: all 0.1s linear;
}

.contact-form label.show {
	top:-10px;
	color:#fff;
	font-size: .8em;
}

.contact-form .form-control {
	padding: 0;
}

.contact-form .form-control:focus {
	outline: 0;
	border: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}

.contact-form .error.form-control,
.contact-form .has-error .form-control,
.contact-form .error.form-control:focus,
.contact-form .has-error .form-control:focus {
	border: none;
	-webkit-box-shadow: none;
	box-shadow: none;
	color: #f36b6b;
}

.contact-form label.error {
	position: absolute;
	top: 3px;
	right: 0;
	color: #f36b6b;
	text-align: right;
}

.contact-form .form-submit {
	padding: 20px 0;
	text-align: center;
}

.contact-form .form-submit .btn {
	display: inline-block;
}

/* ---------- Newsletter ---------- */

.newsletter {
	padding: 30px 0;
	border-bottom: 1px solid #ddd;
}

.newsletter h1{
	margin: 0 0 20px;
	font-size: 2.0em;
}

.newsletter form {
	margin: 0;
	text-align: center;
}

.newsletter .form-group {
	margin: 0;
}

.newsletter input[type="email"] {
	display: inline-block;
	width: 200px;
	border: none;
	border-radius: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
	-webkit-transition: all 0.1s ease-in;
	-moz-transition: all 0.1s ease-in;
	-o-transition: all 0.1s ease-in;
	transition: all 0.1s ease-in;
}

.newsletter input[type="email"]:focus {
	width: 300px;
	outline: 0;
	border-color: #ccc;
	-webkit-box-shadow: none;
	box-shadow: none;
}

.newsletter input[type="email"].error {
	background: #e2b9b9;
	color: #cb4040;
}

.newsletter p {
	margin-bottom: 20px;
	padding: 0 150px;
	text-align: center;
	line-height: 1.8em;
}

.newsletter .btn {
	display: inline-block;
	margin: -3px 0 0 -4px;
	padding: 0 15px;
	height: 34px;
	border-radius: 4px;
	border-radius: 0 4px 4px 0;
	line-height: normal;
}

.newsletter .response {
	margin-top: 10px;
}

.newsletter .response.response-error {
	color: #f36b6b;
}

.newsletter .response.response-success {
	color: #6fad76;
}

.newsletter .device-type {
	display: inline-block;
	margin-right: -4px;
}

.newsletter .device-type .device {
	display: inline-block;
	margin: 0 0 -12px 0px;
	padding: 5px 15px 3px 15px;
	background: #f9f9f9;
	border-right: 1px solid #eee;
	float: left;
}

.newsletter .device-type .device:first-child {
	border-radius: 4px 0 0 4px;
}

.newsletter .device-type input {
	margin-right: 5px;
	cursor: pointer;
}

.newsletter .device-type label {
	font-weight: normal;
	cursor: pointer;
	color: #333;
}




/* Video */

.video_container {
    background-color: #000;
	width: 100%; 
	height: 100%; 
	top: 0; 
	left: 0px;
	right:0; 
	bottom:0; 
	display: block;
	margin:0;
	position:relative;
    
	}




.scroll-page-first {
	position: absolute;
	bottom: 18px;
	left: 50%;
	display: block;
	margin-left: -24px;
	width: 48px;
	height: 48px;
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;croll 0px 0px transparent;
}

.pause {
    position:absolute; 
    bottom:18px; 
    right:110px;
    cursor:pointer;
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
}

.play {
    position:absolute; 
    bottom:18px; 
    right:165px;
    cursor:pointer;
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
}

.center_play {
	position:absolute; 
    top:50%; 
    left:50%;
    margin-left:  -64px;
    margin-top:  -64px;
    cursor:pointer;
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
	}

.social {
    position:absolute; 
    bottom:25px;
    left:110px;
}

.facebook {
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
	}
	
.twitter {
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
	}

.pause:hover {
    opacity: 0.6; 
	filter: alpha(opacity=60);
    }

.play:hover {
    opacity: 0.6; 
	filter: alpha(opacity=60);
    }

.facebook:hover {
    opacity: 0.6; 
	filter: alpha(opacity=60);
    }
	
.twitter:hover {
    opacity: 0.6; 
	filter: alpha(opacity=60);
    }	

	
.scroll-page-first:hover {
	opacity: 0.6; 
	filter: alpha(opacity=60);
	}




/* ------------- Deskstop large ---------- */

@media screen and (min-width: 1200px) {
            	 .fa  {
color:black;
}
         .fa:hover{
color:gray;}

.like  .fa {color:white;}
.like  .fa:hover{color:gray;}

	.features .container {
		padding-left: 0;
		padding-right: 0;
	}

 


    .pause {
        position:absolute; 
        bottom:18px; 
        right:110px;
        cursor:pointer;
        -webkit-transition: all 0.2s ease-in;
        -moz-transition: all 0.2s ease-in;
        -o-transition: all 0.2s ease-in;
        transition: all 0.2s ease-in;
    }

    .play {
        position:absolute; 
        bottom:18px; 
        right:165px;
        cursor:pointer;
        -webkit-transition: all 0.2s ease-in;
        -moz-transition: all 0.2s ease-in;
        -o-transition: all 0.2s ease-in;
        transition: all 0.2s ease-in;
        }

    .social {
        position:absolute; 
        bottom:25px;
        left:110px;
        }

    .facebook {
        -webkit-transition: all 0.2s ease-in;
        -moz-transition: all 0.2s ease-in;
        -o-transition: all 0.2s ease-in;
        transition: all 0.2s ease-in;
        }

    .twitter {
        -webkit-transition: all 0.2s ease-in;
        -moz-transition: all 0.2s ease-in;
        -o-transition: all 0.2s ease-in;
        transition: all 0.2s ease-in;
        }

    .pause:hover {
        opacity: 0.6; 
        filter: alpha(opacity=60);
        }

    .play:hover {
        opacity: 0.6; 
        filter: alpha(opacity=60);
        }

    .facebook:hover {
        opacity: 0.6; 
        filter: alpha(opacity=60);
        }

    .twitter:hover {
        opacity: 0.6; 
        filter: alpha(opacity=60);
        }	


    .scroll-page-first:hover {
        opacity: 0.6; 
        filter: alpha(opacity=60);
        }



    
    
    
    
}

/* --------------- Desktop -------------- */

@media screen and (min-width: 992px) and (max-width: 1199px) {

	.feature:first-child {
		margin-top: 40px;
	}

	.feature {
		padding: 10px;
	}

	.features [class*="col-"]:first-child .feature {
		margin-right: -60px;
		padding-right: 20px;
	}

	.features [class*="col-"]:last-child .feature {
		margin-left: -60px;
		padding-left: 20px;
	}
     .fa  {
color:black;
}

 
 	.fa  :hover{
color:gray;
}
	
	
}

/* ----------------- Tablet ------------- */

@media screen and (min-width: 768px) and (max-width: 991px) {


	
	
	header .brand {
		top: 10%;
	}

	header .statement {
		top: 25%;
	}

	header .statement h2 {
		text-align: center;
		margin: 30px 0;
	}

	header .statement p {
		font-size: 1.1em;
		text-align: center;
		padding: 0 150px;
	}

	.invest p {
		font-size: 1.1em;
		padding: 0 20px;
	}

	.about p {
		font-size: 1.1em;
	}

	.newsletter p {
		font-size: 1.1em;
		padding: 0 20px;
	}

	/*Features*/

	.features {
		height: auto;
	}

	.features h1 {
		margin: 0 0 50px;
	}

	.features * {
		position: relative;
	}

	.features .container {
		padding-bottom: 40px;
	}

	.features:before,
	.features:after {
		display: table;
		clear: both;
		content: '';
	}

	.features .image-credit {
		position: relative;
		right: 0;
		bottom: 0;
		margin-top: 40px;
		text-align: center;
		font-size: .9em;
	}

	.features .bg-secondary {
		display: none;
	}

	.features .feature {
		display: none;
	}

	.features .nav-features {
		display: block;
		position: absolute;
		top: 220px;
		z-index: 100;
		width: 100%;
	}

	.features .nav-features .scroll-left,
	.features .nav-features .scroll-right {
		opacity: .3;
		position: absolute;
		top: 0;
	}

	.features .nav-features .scroll-left {
		left: -55px;
	}


	.features .nav-features .scroll-right {
		right: -55px;
	}

	.features .crt-feature {
		display: block;
	}

	.features .crt-feature h2 {
		margin: 30px 0 20px;
		text-align: center;
		font-size: 1.8em;
	}

	.features .crt-feature h2 .icon {
		float: none;
		display: inline-block;
		margin-right: 0;
		margin-bottom: -4px;
	}

	.features .crt-feature p {
		text-align: justify;
		line-height: 1.86em;
		margin: 0 auto 30px;
		font-size: 1.1em;
		max-width: 80%;
	}

	.bg-primary.diary,
	.bg-secondary.diary {
		background-image: url(../img/features-bg-mobile/diary-bg-mobile.jpg);
	}

	.bg-primary.voyeur,
	.bg-secondary.voyeur {
		background-image: url(../img/features-bg-mobile/voyeur-bg-mobile.jpg);
	}

	.bg-primary.capturing-moment,
	.bg-secondary.capturing-moment {
		background-image: url(../img/features-bg-mobile/capturing-moment-bg-mobile.jpg);
	}

	.bg-primary.know-yourself,
	.bg-secondary.know-yourself {
		background-image: url(../img/features-bg-mobile/know-yourself-bg-mobile.jpg);
	}

	.bg-primary.remix,
	.bg-secondary.remix {
		background-image: url(../img/features-bg-mobile/remix-bg-mobile.jpg);
	}

	.bg-primary.connection,
	.bg-secondary.connection {
		background-image: url(../img/features-bg-mobile/connection-bg-mobile.jpg);
	}
	
	

}

/* ------------- Smartphone ------------- */

@media screen and (max-width: 767px) {

	body {
		font-size: 16px;
	}

	.features h1,
	.contact-form h1,
	.newsletter h1,
	.about h1,
	.invest h1 {
		font-size: 1.6em;
	}


	/*Header*/
	
	header .brand {
		position: relative;
		top: 0;
		left: 0;
		margin: 70px 0;
		text-align: center;
	}

	header img.img-responsive {
		display: inline-block;
		max-width: 60%;
	}

	header .statement {
		position: relative;
		top: 0;
		padding: 0 10px;
	}

	header .statement h2 {
		display: none;
	}

	header .statement .nav-statement {
		display: block;
		margin-bottom: 40px;
	}

	header .statement .nav-statement ul {
		margin: 0;
		padding: 0;
		list-style: none;
		text-align: center;
	}

	header .statement .nav-statement ul li {
		text-align: center;
		display: inline-block;
		font-size: 1.2em;
	}

	header .statement .nav-statement li a,
	header .statement .nav-statement li a:link,
	header .statement .nav-statement li a:visited {
		display: block;
		padding: 0 5px;
		color: #666;
		text-decoration: none;
		line-height: normal;
	}

	header .statement .nav-statement li.active a {
		color: #fff;
	}

	header .statement .nav-statement li a:after {
		content: '·';
		display: inline-block;
		margin-left: 15px;
		color: #666;
	}

	header .statement .nav-statement li:last-child a:after {
		display: none;
	}

	header .statement p {
		display: none;
		margin: -2px 0 20px;
		color: #ddd;
	}

	header .statement p.active {
		display: block;
	}

	header .scroll-page {
		bottom: 20px;
		opacity: .4;
	}

	/*Footer*/

	footer .container {
		padding-top: 50px;
	}

	/*Navbar*/

	.navbar {
		font-size: 1.2em;
	}

	.navbar .navbar-nav > .active > a, 
	.navbar .navbar-nav > .active > a:hover, 
	.navbar .navbar-nav > .active > a:focus,
	.navbar .navbar-nav > li > a {
		border-bottom: 1px dashed #444;
		margin: 0 20px;
		padding: 15px 0;
	}

	.navbar .navbar-nav > .active:last-child > a, 
	.navbar .navbar-nav > .active:last-child > a:hover, 
	.navbar .navbar-nav > .active:last-child > a:focus,
	.navbar .navbar-nav > li:last-child > a {
		border-bottom: none;
	}

	.navbar .navbar-nav a span {
		display: inline;
		color: #555;
		font-size: .9em;
	}

	/*Contact form*/

	.contact-form {
		padding: 0 10px;
		width: 100%;
	}

	.contact-form h2 {
		margin-bottom: 40px;
	}

	.contact-form label {
	}

	.contact-form label.show {
		top: -12px;
		font-size: .9em;
	}

	.contact-form input, 
	.contact-form textarea {
	}

	.contact-form .form-submit {
		padding-bottom: 10px;
	}

	/*Invest*/

	.invest {
		padding: 50px 10px;
	}

	.invest h1 {
		margin-bottom: 40px;
	}

	.invest p {
		margin-bottom: 40px;
		padding: 0;
		text-align: justify;
	}

	/*About us*/

	.about {
		padding: 50px 10px 40px;
	}

	.about h1 {
		margin-bottom: 45px;
	}

	.about p {
		text-align: justify;
	}

	.about nav li a, 
	.about nav li a:link, 
	.about nav li a:visited {
		border-radius: 0;
	}

	.about nav ul li {
		margin-bottom: 0;
		border: 1px solid #ddd;
		border-bottom: none;
	}

	.about nav ul li.active {
		border-color: #3a3a3a;
	}
	
	.about nav ul li:first-child {
		border-radius: 6px 6px 0 0;
	}

	.about nav ul li:last-child {
		border-bottom: 1px solid #ddd;
		border-radius: 0 0 6px 6px;
	}

	.about nav ul li:first-child a {
		border-radius: 5px 5px 0 0;
	}
	
	.about nav ul li:last-child a {
		border-radius: 0 0 5px 5px;
	}

	.about nav {
		margin-bottom: 20px;
	}

	/*Newsletter*/

	.newsletter {
		padding: 40px 10px;
	}

	.newsletter p {
		padding: 0;
		text-align: justify;
	}

	.newsletter input[type="email"],
	.newsletter input[type="email"]:focus {
		width: 55%;
		border-radius: 4px 0 0 4px;
	}

	.newsletter .btn {
		width: 45%;
	}

	.newsletter .device-type {
		display: block;
		margin-right: -4px;
	}

	.newsletter .device-type .device {
		width: 50%;
		display: inline-block;
		margin: 0 0 10px 0px;
		padding: 5px 15px 2px 15px;
		background: #f9f9f9;
		border-right: 1px solid #eee;
		float: left;
	}

	.newsletter .device-type .device:first-child {
		border-radius: 4px 0 0 4px;
	}

	.newsletter .device-type .device:last-child {
		border-radius: 0 4px 4px 0;
	}

	.newsletter .device-type input {
		margin-right: 5px;
		cursor: pointer;
	}

	.newsletter .device-type label {
		font-weight: normal;
		cursor: pointer;
		color: #333;
	}

	/*Features*/

	.features {
		height: auto;
	}

	.features h1 {
		margin: 0 0 50px;
	}

	.features * {
		position: relative;
	}

	.features .container {
		padding-bottom: 40px;
	}

	.features:before,
	.features:after {
		display: table;
		clear: both;
		content: '';
	}

	.features .image-credit {
		position: relative;
		right: 0;
		bottom: 0;
		text-align: center;
		font-size: .8em;
	}

	.features .bg-secondary {
		display: none;
	}

	.features .feature {
		display: none;
	}

	.features .nav-features {
		display: block;
		position: absolute;
		top: 220px;
		z-index: 100;
		width: 100%;
	}

	.features .nav-features .scroll-left,
	.features .nav-features .scroll-right {
		opacity: .3;
		position: absolute;
		top: 0;
	}

	.features .nav-features .scroll-left {
		left: -55px;
	}


	.features .nav-features .scroll-right {
		right: -55px;
	}

	.features .tap-to-zoom {
		display: block;
		z-index: 99;
		width: 100%;
		top: 330px;
		position: absolute;
		background: rgba(0,0,0,.5);
		left: 0;
		padding: 10px 0;
	}

	.features .tap-to-zoom p {
		text-align: center;
		margin: 0 0 5px 0;
		text-transform: uppercase;
	}

	.features .tap-to-zoom .icon {
		width: 60px;
		height: 60px;
		background: transparent url(../img/sprite.png) no-repeat;
		background-position: -334px -407px;
		margin: 0 auto;
		float: none;
	}

	/* Popup navigation buttons */

	.mfp-bg {
		opacity: 1;
		background-color: #111;
	}

	.mfp-bottom-bar {
		display: none;
	}

	button.mfp-arrow {
		display: block;
		width: 47px;
		height: 47px;
		top: 55%;
		opacity: .3;
		border-radius: 50%;
		background: #111 url(../img/sprite.png);
		background-repeat: no-repeat;
		-moz-transition: all 0.2s ease-in;
		-o-transition: all 0.2s ease-in;
		-webkit-transition: all 0.2s ease-in;
		transition: all 0.2s ease-in;
	}

	button.mfp-arrow.mfp-arrow-right {
		background-position: -278px 0;
	}

	button.mfp-arrow.mfp-arrow-left {
		background-position: -231px 0;
	}

	button.mfp-arrow:before,
	button.mfp-arrow:after {
		display: none;
	}

	.features .crt-feature {
		display: block;
	}

	.features .crt-feature h2 {
		margin: 30px 0 20px;
		text-align: center;
		font-size: 1.4em;
	}

	.features .crt-feature h2 .icon {
		float: none;
		display: inline-block;
		margin-right: 0;
		margin-bottom: -4px;
	}

	.features .crt-feature p {
		text-align: justify;
		line-height: 1.6em;
		margin-bottom: 30px;
	}

	.bg-primary.diary,
	.bg-secondary.diary {
		background-image: url(../img/features-bg-mobile/diary-bg-mobile.jpg);
	}

	.bg-primary.voyeur,
	.bg-secondary.voyeur {
		background-image: url(../img/features-bg-mobile/voyeur-bg-mobile.jpg);
	}

	.bg-primary.capturing-moment,
	.bg-secondary.capturing-moment {
		background-image: url(../img/features-bg-mobile/capturing-moment-bg-mobile.jpg);
	}

	.bg-primary.know-yourself,
	.bg-secondary.know-yourself {
		background-image: url(../img/features-bg-mobile/know-yourself-bg-mobile.jpg);
	}

	.bg-primary.remix,
	.bg-secondary.remix {
		background-image: url(../img/features-bg-mobile/remix-bg-mobile.jpg);
	}

	.bg-primary.connection,
	.bg-secondary.connection {
		background-image: url(../img/features-bg-mobile/connection-bg-mobile.jpg);
	}
    
	
	
	.social {
	display:none;
	}
	
	.pause {
	display: none;	
	}
	
	
	
	.play {
	display: none;
	}
	
    .center_play {
    display: none;
    }
    
    .mobile_text {
    position: absolute;
    display: block;
    color: #fff;
    width: 320px;
    font-size: 14px;
    font-weight: 100;
    left: 50%;
    top: 50%;
    margin-left: -160px;
    text-align: center;
    }
	
	iframe {
    display: none;
    }
    
    .brand.mobile {
    display: block;
    position: absolute;
    left: 50%;
    margin-left: -164px;
    top: 10%;
    
    
    }



    


}