Bootstrap templates

- event mockup
- login page
This commit is contained in:
Martin Bauer 2013-06-02 16:00:01 +02:00
parent d29100a692
commit a923ecea6f
346 changed files with 62898 additions and 11 deletions

Binary file not shown.

View File

@ -120,6 +120,16 @@ TEMPLATE_DIRS = (
# Don't forget to use absolute paths, not relative paths.
)
TEMPLATE_CONTEXT_PROCESSORS = (
'django.contrib.auth.context_processors.auth',
'django.core.context_processors.i18n',
'django.core.context_processors.request',
'django.core.context_processors.media',
'django.core.context_processors.static',
'sekizai.context_processors.sekizai',
)
INSTALLED_APPS = (
'django.contrib.auth',
'django.contrib.contenttypes',
@ -132,7 +142,11 @@ INSTALLED_APPS = (
# Uncomment the next line to enable admin documentation:
'django.contrib.admindocs',
'crispy_forms',
'musicians'
'musicians',
'eventplanner',
'locpick',
'sekizai',
'intern_area',
)
CRISPY_TEMPLATE_PACK = 'bootstrap'
@ -186,4 +200,7 @@ LOGGING = {
'level': 'DEBUG',
},
}
}
}
GEOS_LIBRARY_PATH = PROJECT_PATH + '/libgeos_c.so.1.7.8'

View File

@ -2,9 +2,6 @@
<!DOCTYPE html>
<html>
<head>
@ -13,7 +10,6 @@
<link rel="stylesheet" type="text/css" href="{% static "css/bootstrap.min.css" %}" media="screen">
<title>{% block title %}Title{% endblock %}</title>
</head>

View File

@ -5,6 +5,7 @@ from django.contrib import admin
from musicians.views import MusicianList, MusicianUpdate
from musicians.views import user_edit
import intern_area.views
admin.autodiscover()
@ -21,4 +22,5 @@ urlpatterns = patterns('',
url(r'^musicians/$', MusicianList.as_view() ),
url(r'^musicians/(?P<username>[\w]+)$', user_edit ),
url(r'^admin_area/$', intern_area.views.login_site ),
)

View File

@ -0,0 +1,22 @@
Clean Canvas Bootstrap Theme
Credits:
- Macbook, iPad, iPhone, images
http://medialoot.com/item/free-responsive-screen-mockup-pack/
http://pixeden.com/psd-web-elements/responsive-showcase-psd
- Lato Google webfont http://www.google.com/webfonts/specimen/Lato
- Social icons from http://medialoot.com/item/round-social-media-icons/
- Icons by Brankic1979 http://www.brankic1979.com/icons/
- Isotope commercial license
Changelog:
Version 1.0.0
- Initial release
Version 1.2.0
- Updated Bootstrap version to 2.3.2
- Fixed bug with index banner slides
- Added jquery.countdown on coming soon

View File

@ -0,0 +1,315 @@
<!DOCTYPE html>
<html>
<head>
<title>Business Template</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Styles -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-responsive.min.css" rel="stylesheet">
<link href="css/bootstrap-overrides.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/theme.css">
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,900,300italic,400italic,700italic,900italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/lib/animate.css" media="screen, projection">
<link rel="stylesheet" href="css/about.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/lib/flexslider.css" type="text/css" media="screen" />
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-inverse navbar-static-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="index.html">
<strong>CLEAN CANVAS</strong>
</a>
<div class="nav-collapse collapse">
<ul class="nav pull-right">
<li><a href="index.html">HOME</a></li>
<li><a href="about-us.html" class="active">ABOUT US</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
PAGES
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="features.html">Features</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="portfolio-item.html">Portfolio Item</a></li>
<li><a href="coming-soon.html">Coming Soon</a></li>
<li><a href="sign-in.html">Sign in</a></li>
<li><a href="sign-up.html">Sign up</a></li>
<li><a href="backgrounds.html">Backgrounds</a></li>
</ul>
</li>
<li><a href="pricing.html">PRICING</a></li>
<li><a href="contact.html">CONTACT US</a></li>
<li><a href="blog.html">BLOG</a></li>
<li><a class="btn-header" href="sign-up.html">Sign up</a></li>
<li><a class="btn-header" href="sign-in.html">Sign in</a></li>
</ul>
</div>
</div>
</div>
</div>
<div id="aboutus">
<div class="container">
<div class="section_header">
<h3>About Us</h3>
</div>
<div class="row">
<div class="span6 intro">
<h6>There are many variations of passages Lorem Ipsum available, injected generators on the hidden.</h6>
<p>
There are many variations of passages of Lorem Ipsum available, injected
generators on the embarrassing hidden in the middle all the dictionary making it look like readable English. Many desktop publishing packages and web page editors.
<br /><br />
There are many variations of passages of Lorem Ipsum available, but the ndictionary of over 200 Latin words, combined with a handful of models The generated Lorem Ipsum is therefore always free from repetition, the injected humour, or non-characteristic words etc.</p>
</div>
<div class="span6 flexslider">
<ul class="slides">
<li>
<img src="img/about_slide1.jpg" />
</li>
<li>
<img src="img/about_slide1.jpg" />
</li>
<li>
<img src="img/about_slide1.jpg" />
</li>
</ul>
</div>
</div>
</div>
</div>
<div id="team">
<div class="container">
<div class="section_header">
<h3>Meet our Team</h3>
</div>
<div class="row people">
<div class="row row1">
<div class="span6 bio_box">
<img src="img/ale.png" alt="">
<div class="info">
<p class="name">Alejandra Galvan Castillo</p>
<p class="area">Creative Director</p>
<a href="#" class="facebook">
<span class="socialicons ico1"></span>
<span class="socialicons_h ico1h"></span>
</a>
<a href="#" class="twitter">
<span class="socialicons ico2"></span>
<span class="socialicons_h ico2h"></span>
</a>
<a href="#" class="flickr">
<span class="socialicons ico4"></span>
<span class="socialicons_h ico4h"></span>
</a>
<a href="#" class="dribble">
<span class="socialicons ico6"></span>
<span class="socialicons_h ico6h"></span>
</a>
</div>
</div>
<div class="span6 bio_box bio_boxr">
<img src="img/ale.png" alt="">
<div class="info">
<p class="name">Alejandra Galvan Castillo</p>
<p class="area">Creative Director</p>
<a href="#" class="facebook">
<span class="socialicons ico1"></span>
<span class="socialicons_h ico1h"></span>
</a>
<a href="#" class="twitter">
<span class="socialicons ico2"></span>
<span class="socialicons_h ico2h"></span>
</a>
<a href="#" class="flickr">
<span class="socialicons ico4"></span>
<span class="socialicons_h ico4h"></span>
</a>
<a href="#" class="dribble">
<span class="socialicons ico6"></span>
<span class="socialicons_h ico6h"></span>
</a>
</div>
</div>
</div>
<div class="row row1">
<div class="span6 bio_box">
<img src="img/ale.png" alt="">
<div class="info">
<p class="name">Alejandra Galvan Castillo</p>
<p class="area">Creative Director</p>
<a href="#" class="facebook">
<span class="socialicons ico1"></span>
<span class="socialicons_h ico1h"></span>
</a>
<a href="#" class="twitter">
<span class="socialicons ico2"></span>
<span class="socialicons_h ico2h"></span>
</a>
<a href="#" class="flickr">
<span class="socialicons ico4"></span>
<span class="socialicons_h ico4h"></span>
</a>
<a href="#" class="dribble">
<span class="socialicons ico6"></span>
<span class="socialicons_h ico6h"></span>
</a>
</div>
</div>
<div class="span6 bio_box bio_boxr">
<img src="img/ale.png" alt="">
<div class="info">
<p class="name">Alejandra Galvan Castillo</p>
<p class="area">Creative Director</p>
<a href="#" class="facebook">
<span class="socialicons ico1"></span>
<span class="socialicons_h ico1h"></span>
</a>
<a href="#" class="twitter">
<span class="socialicons ico2"></span>
<span class="socialicons_h ico2h"></span>
</a>
<a href="#" class="flickr">
<span class="socialicons ico4"></span>
<span class="socialicons_h ico4h"></span>
</a>
<a href="#" class="dribble">
<span class="socialicons ico6"></span>
<span class="socialicons_h ico6h"></span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="process">
<div class="container">
<div class="section_header">
<h3>Our Process</h3>
</div>
<div class="row services_circles">
<div class="span4 description">
<div class="text active">
<h4>Plan what you need.</h4>
<p>
There are many variations of passages of this suffered alteration in some form, by injected look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to making this the first true generator Internet.</p>
</div>
<div class="text">
<h4>Develop your product or service.</h4>
<p>
There are many variations of passages of this suffered alteration in some form, by injected look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to
making this the first true generator Internet.</p>
</div>
<div class="text">
<h4>Design this theme to your needs.</h4>
<p>
There are many variations of passages of this suffered alteration in some form, by injected look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to making this the first true generator Internet.</p>
</div>
</div>
<div class="span7 areas">
<div class="circle active">
<img src="img/plan.png" />
<span>Plan</span>
</div>
<div class="circle">
<img src="img/develop.png" />
<span>Develop</span>
</div>
<div class="circle last_circle">
<img src="img/design.png" />
<span>Design</span>
</div>
</div>
</div>
</div>
</div>
<!-- starts footer -->
<footer id="footer">
<div class="container">
<div class="row info">
<div class="span6 residence">
<ul>
<li>2301 East Lamar Blvd. Suite 140. City, Arlington.</li>
<li>United States, Zip Code TX 76006.</li>
</ul>
</div>
<div class="span5 touch">
<ul>
<li><strong>P.</strong> 1 817 274 2933</li>
<li><strong>E.</strong><a href="#"> bootstrap@twitter.com</a></li>
</ul>
</div>
</div>
<div class="row credits">
<div class="span12">
<div class="row social">
<div class="span12">
<a href="#" class="facebook">
<span class="socialicons ico1"></span>
<span class="socialicons_h ico1h"></span>
</a>
<a href="#" class="twitter">
<span class="socialicons ico2"></span>
<span class="socialicons_h ico2h"></span>
</a>
<a href="#" class="gplus">
<span class="socialicons ico3"></span>
<span class="socialicons_h ico3h"></span>
</a>
<a href="#" class="flickr">
<span class="socialicons ico4"></span>
<span class="socialicons_h ico4h"></span>
</a>
<a href="#" class="pinterest">
<span class="socialicons ico5"></span>
<span class="socialicons_h ico5h"></span>
</a>
<a href="#" class="dribble">
<span class="socialicons ico6"></span>
<span class="socialicons_h ico6h"></span>
</a>
<a href="#" class="behance">
<span class="socialicons ico7"></span>
<span class="socialicons_h ico7h"></span>
</a>
</div>
</div>
<div class="row copyright">
<div class="span12">
© 2013 Clean Canvas. All rights reserved. Theme by Detail Canvas.
</div>
</div>
</div>
</div>
</div>
</footer>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/theme.js"></script>
<script type="text/javascript" src="js/flexslider.js"></script>
</body>
</html>

View File

@ -0,0 +1,234 @@
<!DOCTYPE html>
<html>
<head>
<title>Business Template</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Styles -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-responsive.min.css" rel="stylesheet">
<link href="css/bootstrap-overrides.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/theme.css">
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,900,300italic,400italic,700italic,900italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/backgrounds.css" type="text/css" media="screen" />
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-inverse navbar-static-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="index.html">
<strong>CLEAN CANVAS</strong>
</a>
<div class="nav-collapse collapse">
<ul class="nav pull-right">
<li><a href="index.html">HOME</a></li>
<li><a href="about-us.html">ABOUT US</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle active" data-toggle="dropdown">
PAGES
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="features.html">Features</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="portfolio-item.html">Portfolio Item</a></li>
<li><a href="coming-soon.html">Coming Soon</a></li>
<li><a href="sign-in.html">Sign in</a></li>
<li><a href="sign-up.html">Sign up</a></li>
<li><a href="backgrounds.html">Backgrounds</a></li>
</ul>
</li>
<li><a href="pricing.html">PRICING</a></li>
<li><a href="contact.html">CONTACT US</a></li>
<li><a href="blog.html">BLOG</a></li>
<li><a class="btn-header" href="sign-up.html">Sign up</a></li>
<li><a class="btn-header" href="sign-in.html">Sign in</a></li>
</ul>
</div>
</div>
</div>
</div>
<div id="backgrounds">
<div class="container">
<div class="section_header">
<h3>
Includes these beautiful backgrounds for slide banners, sign up, coming soon, etc.
</h3>
</div>
<!-- Row -->
<div class="row">
<div class="span6 photo">
<div class="circle">
<span>Aqua</span>
</div>
<img src="img/backgrounds/aqua_thumb.jpg">
</div>
<div class="span6 photo right">
<div class="circle">
<span class="doble">Color splash</span>
</div>
<img src="img/backgrounds/color_splash_thumb.jpg">
</div>
</div>
<!-- Row -->
<div class="row">
<div class="span6 photo">
<div class="circle">
<span>Indigo</span>
</div>
<img src="img/backgrounds/indigo_thumb.jpg">
</div>
<div class="span6 photo right">
<div class="circle">
<span class="doble">Deep<br />green</span>
</div>
<img src="img/backgrounds/deep_green_thumb.jpg">
</div>
</div>
<!-- Row -->
<div class="row">
<div class="span6 photo">
<div class="circle">
<span>Black</span>
</div>
<img src="img/backgrounds/black_thumb.jpg">
</div>
<div class="span6 photo right">
<div class="circle">
<span>Silver</span>
</div>
<img src="img/backgrounds/silver_thumb.jpg">
</div>
</div>
<!-- Row -->
<div class="row">
<div class="span6 photo">
<div class="circle">
<span>Ocean</span>
</div>
<img src="img/backgrounds/ocean_thumb.jpg">
</div>
<div class="span6 photo right">
<div class="circle">
<span>Mint</span>
</div>
<img src="img/backgrounds/mint_thumb.jpg">
</div>
</div>
<!-- Row -->
<div class="row">
<div class="span6 photo">
<div class="circle">
<span>Water</span>
</div>
<img src="img/backgrounds/water_thumb.jpg">
</div>
<div class="span6 photo right">
<div class="circle">
<span class="doble">Baby<br />blue</span>
</div>
<img src="img/backgrounds/baby_blue_thumb.jpg">
</div>
</div>
<!-- Row -->
<div class="row">
<div class="span6 photo">
<div class="circle">
<span>Mango</span>
</div>
<img src="img/backgrounds/mango_thumb.jpg">
</div>
<div class="span6 photo right">
<div class="circle">
<span>Flower</span>
</div>
<img src="img/backgrounds/flower_thumb.jpg">
</div>
</div>
</div>
</div>
<!-- starts footer -->
<footer id="footer">
<div class="container">
<div class="row info">
<div class="span6 residence">
<ul>
<li>2301 East Lamar Blvd. Suite 140. City, Arlington.</li>
<li>United States, Zip Code TX 76006.</li>
</ul>
</div>
<div class="span5 touch">
<ul>
<li><strong>P.</strong> 1 817 274 2933</li>
<li><strong>E.</strong><a href="#"> bootstrap@twitter.com</a></li>
</ul>
</div>
</div>
<div class="row credits">
<div class="span12">
<div class="row social">
<div class="span12">
<a href="#" class="facebook">
<span class="socialicons ico1"></span>
<span class="socialicons_h ico1h"></span>
</a>
<a href="#" class="twitter">
<span class="socialicons ico2"></span>
<span class="socialicons_h ico2h"></span>
</a>
<a href="#" class="gplus">
<span class="socialicons ico3"></span>
<span class="socialicons_h ico3h"></span>
</a>
<a href="#" class="flickr">
<span class="socialicons ico4"></span>
<span class="socialicons_h ico4h"></span>
</a>
<a href="#" class="pinterest">
<span class="socialicons ico5"></span>
<span class="socialicons_h ico5h"></span>
</a>
<a href="#" class="dribble">
<span class="socialicons ico6"></span>
<span class="socialicons_h ico6h"></span>
</a>
<a href="#" class="behance">
<span class="socialicons ico7"></span>
<span class="socialicons_h ico7h"></span>
</a>
</div>
</div>
<div class="row copyright">
<div class="span12">
© 2013 Clean Canvas. All rights reserved. Theme by Detail Canvas.
</div>
</div>
</div>
</div>
</div>
</footer>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/theme.js"></script>
</body>
</html>

View File

@ -0,0 +1,355 @@
<!DOCTYPE html>
<html>
<head>
<title>Business Template</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Styles -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-responsive.min.css" rel="stylesheet">
<link href="css/bootstrap-overrides.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/theme.css">
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,900,300italic,400italic,700italic,900italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/blog.css" type="text/css" media="screen" />
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-inverse navbar-static-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="index.html">
<strong>CLEAN CANVAS</strong>
</a>
<div class="nav-collapse collapse">
<ul class="nav pull-right">
<li><a href="index.html">HOME</a></li>
<li><a href="about-us.html">ABOUT US</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
PAGES
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="features.html">Features</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="portfolio-item.html">Portfolio Item</a></li>
<li><a href="coming-soon.html">Coming Soon</a></li>
<li><a href="sign-in.html">Sign in</a></li>
<li><a href="sign-up.html">Sign up</a></li>
<li><a href="backgrounds.html">Backgrounds</a></li>
</ul>
</li>
<li><a href="pricing.html">PRICING</a></li>
<li><a href="contact.html">CONTACT US</a></li>
<li><a href="blog.html" class="active">BLOG</a></li>
<li><a class="btn-header" href="sign-up.html">Sign up</a></li>
<li><a class="btn-header" href="sign-in.html">Sign in</a></li>
</ul>
</div>
</div>
</div>
</div>
<div id="blog">
<div class="container">
<div class="section_header">
<h3>Blog</h3>
<input type="text" class="input-large search-query" placeholder="Search">
</div>
<!-- Post Row -->
<div class="row post_row">
<!-- Post -->
<div class="span4 post">
<div class="img">
<a href="blogpost.html">
<img src="img/blog1.png" alt="">
</a>
</div>
<div class="text">
<h5><a href="blogpost.html">Clean Canvas beautiful responsive theme.</a></h5>
<span class="date">Wed, 12 Dec.</span>
<p>
There are many variations of passages of generators on the embarrassing hidden in slightly distracted by these distribution of letters, as opposed.</p>
</div>
<div class="author_box">
<h6>Alejandra Galvan</h6>
<p>Creative Director</p>
</div>
<a class="plus_wrapper" href="blogpost.html">
<span>&#43;</span>
</a>
</div>
<!-- Post -->
<div class="span4 post">
<div class="img">
<a href="blogpost.html">
<img src="img/blog2.png" alt="">
</a>
</div>
<div class="text">
<h5><a href="blogpost.html">Clean Canvas beautiful responsive theme.</a></h5>
<span class="date">Wed, 12 Dec.</span>
<p>
There are many variations of passages of generators on the embarrassing hidden in slightly distracted by these distribution of letters, as opposed.</p>
</div>
<div class="author_box">
<h6>Alejandra Galvan</h6>
<p>Creative Director</p>
</div>
<a class="plus_wrapper" href="blogpost.html">
<span>&#43;</span>
</a>
</div>
<!-- Post -->
<div class="span4 post last">
<div class="img">
<a href="blogpost.html">
<img src="img/blog3.png" alt="">
</a>
</div>
<div class="text">
<h5><a href="blogpost.html">Clean Canvas beautiful responsive theme.</a></h5>
<span class="date">Wed, 12 Dec.</span>
<p>
There are many variations of passages of generators on the embarrassing hidden in slightly distracted by these distribution of letters, as opposed.</p>
</div>
<div class="author_box">
<h6>Alejandra Galvan</h6>
<p>Creative Director</p>
</div>
<a class="plus_wrapper" href="blogpost.html">
<span>&#43;</span>
</a>
</div>
</div>
<!-- Post Row -->
<div class="row post_row">
<!-- Post -->
<div class="span4 post">
<div class="img">
<a href="blogpost.html">
<img src="img/blog1.png" alt="">
</a>
</div>
<div class="text">
<h5><a href="blogpost.html">Clean Canvas beautiful responsive theme.</a></h5>
<span class="date">Wed, 12 Dec.</span>
<p>
There are many variations of passages of generators on the embarrassing hidden in slightly distracted by these distribution of letters, as opposed.</p>
</div>
<div class="author_box">
<h6>Alejandra Galvan</h6>
<p>Creative Director</p>
</div>
<a class="plus_wrapper" href="blogpost.html">
<span>&#43;</span>
</a>
</div>
<!-- Post -->
<div class="span4 post">
<div class="img">
<a href="blogpost.html">
<img src="img/blog2.png" alt="">
</a>
</div>
<div class="text">
<h5><a href="blogpost.html">Clean Canvas beautiful responsive theme.</a></h5>
<span class="date">Wed, 12 Dec.</span>
<p>
There are many variations of passages of generators on the embarrassing hidden in slightly distracted by these distribution of letters, as opposed.</p>
</div>
<div class="author_box">
<h6>Alejandra Galvan</h6>
<p>Creative Director</p>
</div>
<a class="plus_wrapper" href="blogpost.html">
<span>&#43;</span>
</a>
</div>
<!-- Post -->
<div class="span4 post last">
<div class="img">
<a href="blogpost.html">
<img src="img/blog3.png" alt="">
</a>
</div>
<div class="text">
<h5><a href="blogpost.html">Clean Canvas beautiful responsive theme.</a></h5>
<span class="date">Wed, 12 Dec.</span>
<p>
There are many variations of passages of generators on the embarrassing hidden in slightly distracted by these distribution of letters, as opposed.</p>
</div>
<div class="author_box">
<h6>Alejandra Galvan</h6>
<p>Creative Director</p>
</div>
<a class="plus_wrapper" href="blogpost.html">
<span>&#43;</span>
</a>
</div>
</div>
<!-- Post Row -->
<div class="row post_row lastpost_row">
<!-- Post -->
<div class="span4 post">
<div class="img">
<a href="blogpost.html">
<img src="img/blog1.png" alt="">
</a>
</div>
<div class="text">
<h5><a href="blogpost.html">Clean Canvas beautiful responsive theme.</a></h5>
<span class="date">Wed, 12 Dec.</span>
<p>
There are many variations of passages of generators on the embarrassing hidden in slightly distracted by these distribution of letters, as opposed.</p>
</div>
<div class="author_box">
<h6>Alejandra Galvan</h6>
<p>Creative Director</p>
</div>
<a class="plus_wrapper" href="blogpost.html">
<span>&#43;</span>
</a>
</div>
<!-- Post -->
<div class="span4 post">
<div class="img">
<a href="blogpost.html">
<img src="img/blog2.png" alt="">
</a>
</div>
<div class="text">
<h5><a href="blogpost.html">Clean Canvas beautiful responsive theme.</a></h5>
<span class="date">Wed, 12 Dec.</span>
<p>
There are many variations of passages of generators on the embarrassing hidden in slightly distracted by these distribution of letters, as opposed.</p>
</div>
<div class="author_box">
<h6>Alejandra Galvan</h6>
<p>Creative Director</p>
</div>
<a class="plus_wrapper" href="blogpost.html">
<span>&#43;</span>
</a>
</div>
<!-- Post -->
<div class="span4 post last">
<div class="img">
<a href="blogpost.html">
<img src="img/blog3.png" alt="">
</a>
</div>
<div class="text">
<h5><a href="blogpost.html">Clean Canvas beautiful responsive theme.</a></h5>
<span class="date">Wed, 12 Dec.</span>
<p>
There are many variations of passages of generators on the embarrassing hidden in slightly distracted by these distribution of letters, as opposed.</p>
</div>
<div class="author_box">
<h6>Alejandra Galvan</h6>
<p>Creative Director</p>
</div>
<a class="plus_wrapper" href="blogpost.html">
<span>&#43;</span>
</a>
</div>
</div>
<div class="pagination">
<ul>
<li><a href="#">Prev</a></li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">Next</a></li>
</ul>
</div>
</div>
</div>
<!-- starts footer -->
<footer id="footer">
<div class="container">
<div class="row info">
<div class="span6 residence">
<ul>
<li>2301 East Lamar Blvd. Suite 140. City, Arlington.</li>
<li>United States, Zip Code TX 76006.</li>
</ul>
</div>
<div class="span5 touch">
<ul>
<li><strong>P.</strong> 1 817 274 2933</li>
<li><strong>E.</strong><a href="#"> bootstrap@twitter.com</a></li>
</ul>
</div>
</div>
<div class="row credits">
<div class="span12">
<div class="row social">
<div class="span12">
<a href="#" class="facebook">
<span class="socialicons ico1"></span>
<span class="socialicons_h ico1h"></span>
</a>
<a href="#" class="twitter">
<span class="socialicons ico2"></span>
<span class="socialicons_h ico2h"></span>
</a>
<a href="#" class="gplus">
<span class="socialicons ico3"></span>
<span class="socialicons_h ico3h"></span>
</a>
<a href="#" class="flickr">
<span class="socialicons ico4"></span>
<span class="socialicons_h ico4h"></span>
</a>
<a href="#" class="pinterest">
<span class="socialicons ico5"></span>
<span class="socialicons_h ico5h"></span>
</a>
<a href="#" class="dribble">
<span class="socialicons ico6"></span>
<span class="socialicons_h ico6h"></span>
</a>
<a href="#" class="behance">
<span class="socialicons ico7"></span>
<span class="socialicons_h ico7h"></span>
</a>
</div>
</div>
<div class="row copyright">
<div class="span12">
© 2013 Clean Canvas. All rights reserved. Theme by Detail Canvas.
</div>
</div>
</div>
</div>
</div>
</footer>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/theme.js"></script>
</body>
</html>

View File

@ -0,0 +1,347 @@
<!DOCTYPE html>
<html>
<head>
<title>Business Template</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Styles -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-responsive.min.css" rel="stylesheet">
<link href="css/bootstrap-overrides.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/theme.css">
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,900,300italic,400italic,700italic,900italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/lib/animate.css" media="screen, projection">
<link rel="stylesheet" href="css/blogpost.css" type="text/css" media="screen" />
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-inverse navbar-static-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="index.html">
<strong>CLEAN CANVAS</strong>
</a>
<div class="nav-collapse collapse">
<ul class="nav pull-right">
<li><a href="index.html">HOME</a></li>
<li><a href="about-us.html">ABOUT US</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
PAGES
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="features.html">Features</a></li>
<li><a href="pricing.html">Pricing</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="coming-soon.html">Coming Soon</a></li>
<li><a href="sign-in.html">Sign in</a></li>
<li><a href="sign-up.html">Sign up</a></li>
<li><a href="backgrounds.html">Backgrounds</a></li>
</ul>
</li>
<li><a href="services.html">SERVICES</a></li>
<li><a href="contact.html">CONTACT US</a></li>
<li><a href="blog.html" class="active">BLOG</a></li>
<li><a class="btn-header" href="sign-up.html">Sign up</a></li>
<li><a class="btn-header" href="sign-in.html">Sign in</a></li>
</ul>
</div>
</div>
</div>
</div>
<div id="blog_post">
<div class="container">
<div class="section_header">
<h3>Blog Post</h3>
<input type="text" class="input-large search-query" placeholder="Search">
</div>
<div class="row">
<div class="span8">
<img class="post_pic" src="img/blog_post.jpg" />
<div class="post_content">
<h2>Clean Canvas beautiful responsive theme.</h2>
<span class="date">Wed, 12 Dec.</span>
<p>
There are many variations of passages of Lorem Ipsum available, injected generators on the embarrassing hidden in the middle all the dictionary of randomised words which dont look even slightly distracted by these distribution of letters, as opposed to using Content here, content here making it look like readable English. Many desktop publishing packages and web page editors.
</p>
<p>
There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which dont look even slightly believable. If you are anything embarrassing hidden in the middle of text. All the Lorem Ipsum necessary, making this the first true generator on the Internet. It uses an dictionary of over 200 Latin words, combined with a handful of non-characteristic words There are many variations necessary, making this the first true generator on the Internet. It uses a dictionary of over 200 Ipsum available, injected generators on the embarrassing hidden distribution of letters, as opposed to using Content here, content here making it look like readable English. Many desktop publishing packages and web page editors.</p>
<p>
There are many variations of passages of Lorem Ipsum available, injected generators on the embarrassing hidden in the middle all the dictionary of randomised words which dont look even slightly distracted by these distribution of letters, as opposed to using Content here, content here making it look like readable English. Many desktop publishing packages and web page editors.</p>
<div class="author_box">
<div class="author">Alejandra Galvan</div>
<div class="area">Creative Director</div>
</div>
</div>
<div class="comments">
<h4>Comments</h4>
<div class="comment">
<div class="row">
<div class="span1">
<img src="img/user-display.png" class="img-circle author_pic" />
</div>
<div class="span7">
<div class="name">
Alejandra Galvan
<a href="#" class="reply">Reply</a>
</div>
<div class="date">
Oct 12, 2012
</div>
<div class="response">
There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.
</div>
</div>
</div>
</div>
<div class="comment">
<div class="row">
<div class="span1">
<img src="img/user-display.png" class="img-circle author_pic" />
</div>
<div class="span7">
<div class="name">
Alejandra Galvan
<a href="#" class="reply">Reply</a>
</div>
<div class="date">
Oct 12, 2012
</div>
<div class="response">
There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.
</div>
</div>
</div>
</div>
<div class="comment reply_to">
<div class="row">
<div class="span1 offset1">
<img src="img/user-display.png" class="img-circle author_pic" />
</div>
<div class="span6">
<div class="name">
Alejandra Galvan
<a href="#" class="reply">Reply</a>
</div>
<div class="date">
Oct 12, 2012
</div>
<div class="response">
There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.
</div>
</div>
</div>
</div>
<div class="comment">
<div class="row">
<div class="span1">
<img src="img/user-display.png" class="img-circle author_pic" />
</div>
<div class="span7">
<div class="name">
Alejandra Galvan
<a href="#" class="reply">Reply</a>
</div>
<div class="date">
Oct 12, 2012
</div>
<div class="response">
There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.
</div>
</div>
</div>
</div>
</div>
<div class="new_comment">
<h4>Add Comment</h4>
<form>
<div class="row">
<div class="span4">
<input type="text" placeholder="Name" name="name" />
</div>
<div class="span4">
<input type="text" placeholder="Email" name="email" />
</div>
</div>
<div class="row">
<div class="span8">
<textarea placeholder="Comments" rows="7"></textarea>
</div>
</div>
<div class="row">
<div class="span8">
<a href="#" class="btn send">Add comment</a>
</div>
</div>
</form>
</div>
</div>
<!-- SideBar -->
<div class="span3 sidebar offset1">
<div class="box">
<div class="sidebar_header">
<h4>Menu</h4>
</div>
<ul class="sidebar_menu">
<ul>
<li><a href="#">Coffee</a></li>
<li><a href="#">Design</a></li>
<li><a href="#">Music</a></li>
<li><a href="#">Photography</a></li>
<li><a href="#">Packaging </a></li>
</ul>
</ul>
</div>
<div class="box box2">
<div class="sidebar_header">
<h4>Recent Posts</h4>
</div>
<div class="recent">
<span>
<img src="img/recent_photos.jpg" alt="">
</span>
<p>There are many embarrassing hidden in the middle of text.</p>
</div>
<div class="recent">
<span>
<img src="img/recent_photos.jpg" alt="">
</span>
<p>There are many embarrassing hidden in the middle of text.</p>
</div>
</div>
<div class="box">
<div class="sidebar_header">
<h4>Popular photos</h4>
</div>
<ul class="recent_photos">
<li>
<a href="#"><img src="img/recent_photos.jpg"></a></li>
<li>
<a href="#"><img src="img/recent_photos.jpg"></a></li>
<li>
<a href="#"><img src="img/recent_photos.jpg"></a></li>
<li>
<a href="#"><img src="img/recent_photos.jpg"></a></li>
<li>
<a href="#"><img src="img/recent_photos.jpg"></a></li>
<li>
<a href="#"><img src="img/recent_photos.jpg"></a></li>
<li>
<a href="#"><img src="img/recent_photos.jpg"></a></li>
<li>
<a href="#"><img src="img/recent_photos.jpg"></a></li>
<li>
<a href="#"><img src="img/recent_photos.jpg"></a></li>
</ul>
</div>
<div class="box last">
<div class="sidebar_header">
<h4>Archives</h4>
</div>
<ul class="sidebar_menu">
<ul>
<li><a href="#">January 2012</a></li>
<li><a href="#">May 2012</a></li>
<li><a href="#">August 2011</a></li>
<li><a href="#">October 2011</a></li>
</ul>
</ul>
</div>
</div>
</div>
</div>
<!-- starts footer -->
<footer id="footer">
<div class="container">
<div class="row info">
<div class="span6 residence">
<ul>
<li>2301 East Lamar Blvd. Suite 140. City, Arlington.</li>
<li>United States, Zip Code TX 76006.</li>
</ul>
</div>
<div class="span5 touch">
<ul>
<li><strong>P.</strong> 1 817 274 2933</li>
<li><strong>E.</strong><a href="#"> bootstrap@twitter.com</a></li>
</ul>
</div>
</div>
<div class="row credits">
<div class="span12">
<div class="row social">
<div class="span12">
<a href="#" class="facebook">
<span class="socialicons ico1"></span>
<span class="socialicons_h ico1h"></span>
</a>
<a href="#" class="twitter">
<span class="socialicons ico2"></span>
<span class="socialicons_h ico2h"></span>
</a>
<a href="#" class="gplus">
<span class="socialicons ico3"></span>
<span class="socialicons_h ico3h"></span>
</a>
<a href="#" class="flickr">
<span class="socialicons ico4"></span>
<span class="socialicons_h ico4h"></span>
</a>
<a href="#" class="pinterest">
<span class="socialicons ico5"></span>
<span class="socialicons_h ico5h"></span>
</a>
<a href="#" class="dribble">
<span class="socialicons ico6"></span>
<span class="socialicons_h ico6h"></span>
</a>
<a href="#" class="behance">
<span class="socialicons ico7"></span>
<span class="socialicons_h ico7h"></span>
</a>
</div>
</div>
<div class="row copyright">
<div class="span12">
© 2013 Clean Canvas. All rights reserved. Theme by Detail Canvas.
</div>
</div>
</div>
</div>
</div>
</footer>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/theme.js"></script>
</body>
</html>

View File

@ -0,0 +1,251 @@
<!DOCTYPE html>
<html>
<head>
<title>Business Template</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Styles -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-responsive.min.css" rel="stylesheet">
<link href="css/bootstrap-overrides.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/theme.css">
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,900,300italic,400italic,700italic,900italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/lib/animate.css" media="screen, projection">
<link rel="stylesheet" href="css/coming-soon.css" type="text/css" media="screen" />
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-inverse navbar-static-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="index.html">
<strong>CLEAN CANVAS</strong>
</a>
<div class="nav-collapse collapse">
<ul class="nav pull-right">
<li><a href="index.html">HOME</a></li>
<li><a href="about-us.html">ABOUT US</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle active" data-toggle="dropdown">
PAGES
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="features.html">Features</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="portfolio-item.html">Portfolio Item</a></li>
<li><a href="coming-soon.html">Coming Soon</a></li>
<li><a href="sign-in.html">Sign in</a></li>
<li><a href="sign-up.html">Sign up</a></li>
<li><a href="backgrounds.html">Backgrounds</a></li>
</ul>
</li>
<li><a href="pricing.html">PRICING</a></li>
<li><a href="contact.html">CONTACT US</a></li>
<li><a href="blog.html">BLOG</a></li>
<li><a class="btn-header" href="sign-up.html">Sign up</a></li>
<li><a class="btn-header" href="sign-in.html">Sign in</a></li>
</ul>
</div>
</div>
</div>
</div>
<!-- Sign In Option 1 -->
<div id="coming_soon">
<div class="head">
<div class="container">
<div class="span6 text">
<h4>We are launching very soon</h4>
<p>
We are currently working on an awesome new site. <span>STAY TUNED!</span>
<br />
Please don´t forget to check out our tweets and subscribe to be notified.</p>
</div>
<div class="span6 count" id="clock">
<div class="box last">
<div class="circle">
<span id="seconds"></span>
</div>
<p>Seconds</p>
</div>
<div class="box">
<div class="circle">
<span id="minutes"></span>
</div>
<p>Minutes</p>
</div>
<div class="box">
<div class="circle">
<span id="hours"></span>
</div>
<p>Hours</p>
</div>
<div class="box">
<div class="circle">
<span id="days"></span>
</div>
<p>Days</p>
</div>
<!-- <div class="box">
<div class="circle">
<span id="weeks"></span>
</div>
<p>Weeks</p>
</div> -->
</div>
</div>
</div>
<div class="email_wrapp">
<div class="container">
<div class="span11 wrapp">
<p><strong>Sign up here</strong> to be one of the first to know when it´s ready</p>
<input type="text" placeholder="Email address...">
<a href="#" class="btn send">ok</a>
</div>
</div>
</div>
<div class="social">
<div class="container">
<p>Follow us</p>
<a href="#" class="facebook">
<span class="icons ico1"></span>
<span class="iconsh ico1h"></span>
</a>
<a href="#" class="twitter">
<span class="icons ico2"></span>
<span class="iconsh ico2h"></span>
</a>
<a href="#" class="gplus">
<span class="icons ico3"></span>
<span class="iconsh ico3h"></span>
</a>
<a href="#" class="flickr">
<span class="icons ico4"></span>
<span class="iconsh ico4h"></span>
</a>
<a href="#" class="pinterest">
<span class="icons ico5"></span>
<span class="iconsh ico5h"></span>
</a>
<a href="#" class="dribble">
<span class="icons ico6"></span>
<span class="iconsh ico6h"></span>
</a>
<a href="#" class="behance">
<span class="icons ico7"></span>
<span class="iconsh ico7h"></span>
</a>
</div>
</div>
</div>
<!-- starts footer -->
<footer id="footer">
<div class="container">
<div class="row info">
<div class="span6 residence">
<ul>
<li>2301 East Lamar Blvd. Suite 140. City, Arlington.</li>
<li>United States, Zip Code TX 76006.</li>
</ul>
</div>
<div class="span5 touch">
<ul>
<li><strong>P.</strong> 1 817 274 2933</li>
<li><strong>E.</strong><a href="#"> bootstrap@twitter.com</a></li>
</ul>
</div>
</div>
<div class="row credits">
<div class="span12">
<div class="row social">
<div class="span12">
<a href="#" class="facebook">
<span class="socialicons ico1"></span>
<span class="socialicons_h ico1h"></span>
</a>
<a href="#" class="twitter">
<span class="socialicons ico2"></span>
<span class="socialicons_h ico2h"></span>
</a>
<a href="#" class="gplus">
<span class="socialicons ico3"></span>
<span class="socialicons_h ico3h"></span>
</a>
<a href="#" class="flickr">
<span class="socialicons ico4"></span>
<span class="socialicons_h ico4h"></span>
</a>
<a href="#" class="pinterest">
<span class="socialicons ico5"></span>
<span class="socialicons_h ico5h"></span>
</a>
<a href="#" class="dribble">
<span class="socialicons ico6"></span>
<span class="socialicons_h ico6h"></span>
</a>
<a href="#" class="behance">
<span class="socialicons ico7"></span>
<span class="socialicons_h ico7h"></span>
</a>
</div>
</div>
<div class="row copyright">
<div class="span12">
© 2013 Clean Canvas. All rights reserved. Theme by Detail Canvas.
</div>
</div>
</div>
</div>
</div>
</footer>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.countdown.min.js"></script>
<script src="js/theme.js"></script>
<script type="text/javascript">
$(function () {
var currentDate = new Date(),
finished = false,
availiableExamples = {
set35daysFromNow: 35 * 24 * 60 * 60 * 1000,
set5minFromNow : 5 * 60 * 1000,
set1minFromNow : 1 * 60 * 1000
};
function callback(event) {
$this = $(this);
$this.find('span#'+event.type).html(event.value);
switch(event.type) {
case "seconds":
case "minutes":
case "hours":
case "days":
case "weeks":
case "daysLeft":
case "finished":
}
}
$('div#clock').countdown(availiableExamples.set35daysFromNow + currentDate.valueOf(), callback);
});
</script>
</body>
</html>

View File

@ -0,0 +1,199 @@
<!DOCTYPE html>
<html>
<head>
<title>Business Template</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Styles -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-responsive.min.css" rel="stylesheet">
<link href="css/bootstrap-overrides.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/theme.css">
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,900,300italic,400italic,700italic,900italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/lib/animate.css" media="screen, projection">
<link rel="stylesheet" href="css/contact.css" type="text/css" media="screen" />
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-inverse navbar-static-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="index.html">
<strong>CLEAN CANVAS</strong>
</a>
<div class="nav-collapse collapse">
<ul class="nav pull-right">
<li><a href="index.html">HOME</a></li>
<li><a href="about-us.html">ABOUT US</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
PAGES
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="features.html">Features</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="portfolio-item.html">Portfolio Item</a></li>
<li><a href="coming-soon.html">Coming Soon</a></li>
<li><a href="sign-in.html">Sign in</a></li>
<li><a href="sign-up.html">Sign up</a></li>
<li><a href="backgrounds.html">Backgrounds</a></li>
</ul>
</li>
<li><a href="pricing.html">PRICING</a></li>
<li><a href="contact.html" class="active">CONTACT US</a></li>
<li><a href="blog.html">BLOG</a></li>
<li><a class="btn-header" href="sign-up.html">Sign up</a></li>
<li><a class="btn-header" href="sign-in.html">Sign in</a></li>
</ul>
</div>
</div>
</div>
</div>
<div id="contact">
<div class="container">
<div class="section_header">
<h3>Get in touch</h3>
</div>
<div class="row contact">
<p>
Wed love to hear from you. Interested in working together? Fill out the form below with some info about your project and I will get back to you as soon as I can. Please allow a couple days for me to respond.</p>
<form>
<div class="row form">
<div class="span6 box">
<input class="name" type="text" placeholder="Name">
<input class="mail" type="text" placeholder="Email">
<input class="phone" type="text" placeholder="Phone">
</div>
<div class="span6 box box_r">
<textarea placeholder="Type a message here..."></textarea>
</div>
</div>
<div class="row submit">
<div class="span5 box">
<label class="checkbox">
<input type="checkbox"> Sign up for newsletter
</label>
</div>
<div class="span3 right">
<input type="submit" value="Send your message">
</div>
</div>
</form>
</div>
</div>
<div class="row map">
<div class="container">
<div class="span5 box_wrapp">
<div class="box_cont">
<div class="head">
<h6>Contact</h6>
</div>
<ul class="street">
<li>2301 East Lamar Blvd. Suite 140.</li>
<li>City, Arlington. United States,</li>
<li>Zip Code, TX 76006.</li>
<li class="icon icontop">
<span class="contacticos ico1"></span>
<span class="text">1 817 274 2933</span>
</li>
<li class="icon">
<span class="contacticos ico2"></span>
<a class="text" href="#">bootstrap@twitter.com</a>
</li>
</ul>
<div class="head headbottom">
<h6>Work with us</h6>
</div>
<p>Weve prepared a simple project planner to get to know you and your project better.</p>
<a href="#" class="btn">Let's get started</a>
</div>
</div>
</div>
<iframe width="100%" height="600" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com.mx/?ie=UTF8&amp;ll=64.089157,-21.816616&amp;spn=0.045157,0.15398&amp;t=m&amp;z=13&amp;output=embed"></iframe>
</div>
</div>
<!-- starts footer -->
<footer id="footer" style="margin-top:0;">
<div class="container">
<div class="row info">
<div class="span6 residence">
<ul>
<li>2301 East Lamar Blvd. Suite 140. City, Arlington.</li>
<li>United States, Zip Code TX 76006.</li>
</ul>
</div>
<div class="span5 touch">
<ul>
<li><strong>P.</strong> 1 817 274 2933</li>
<li><strong>E.</strong><a href="#"> bootstrap@twitter.com</a></li>
</ul>
</div>
</div>
<div class="row credits">
<div class="span12">
<div class="row social">
<div class="span12">
<a href="#" class="facebook">
<span class="socialicons ico1"></span>
<span class="socialicons_h ico1h"></span>
</a>
<a href="#" class="twitter">
<span class="socialicons ico2"></span>
<span class="socialicons_h ico2h"></span>
</a>
<a href="#" class="gplus">
<span class="socialicons ico3"></span>
<span class="socialicons_h ico3h"></span>
</a>
<a href="#" class="flickr">
<span class="socialicons ico4"></span>
<span class="socialicons_h ico4h"></span>
</a>
<a href="#" class="pinterest">
<span class="socialicons ico5"></span>
<span class="socialicons_h ico5h"></span>
</a>
<a href="#" class="dribble">
<span class="socialicons ico6"></span>
<span class="socialicons_h ico6h"></span>
</a>
<a href="#" class="behance">
<span class="socialicons ico7"></span>
<span class="socialicons_h ico7h"></span>
</a>
</div>
</div>
<div class="row copyright">
<div class="span12">
© 2013 Clean Canvas. All rights reserved. Theme by Detail Canvas.
</div>
</div>
</div>
</div>
</div>
</footer>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/theme.js"></script>
</body>
</html>

View File

@ -0,0 +1,316 @@
#aboutus{
margin-bottom: 90px;
margin-top: 70px;
}
#aboutus .intro h6{
font-size: 21px;
font-style: italic;
color: #252526;
line-height: 29px;
font-weight: normal;
margin: 0 0 16px 0;
}
#aboutus .intro p{
color: #3F3F3F;
line-height: 24px;
}
#aboutus .flexslider{
float: right;
box-shadow: none;
margin: 0;
border:0 none;
}
#aboutus .flex-control-paging li a{
background: #666666;
box-shadow: none;
width: 5px;
height: 5px;
border: 3px solid #E6E6E6;
}
#aboutus .flex-control-paging li a.flex-active{
box-shadow: none;
background: #2894DC;
border-color: #2894DC;
}
#aboutus .flex-control-nav{
bottom: -30px;
}
#team{
padding: 35px 0 25px;
margin: 0;
background: #252528;
margin-bottom: 90px;
}
#team .section_header{
margin-bottom: 60px;
}
#team .section_header h3{
color: #9D9D9E;
border-color: #9D9D9E;
margin: 0;
}
#team .people{
margin: 0;
}
#team .people .row1{
margin: 0 0 50px 0;
}
#team .people .bio_box{
margin: 0;
}
#team .people .bio_boxr{
float: right;
}
#team .people .bio_box img{
float: left;
}
#team .people .bio_boxr img{
margin-left: 38px;
}
#team .people .bio_box .info{
float: left;
margin: 38px 0 0 30px;
}
#team .people .bio_box .info p{
margin-bottom: 0;
}
#team .people .bio_box .info p.name{
color: #fff;
font-style: italic;
margin-bottom: 4px;
font-size: 21px;
}
#team .people .bio_box .info p.area{
color: #98989A;
font-style: italic;
font-style: 16px;
margin-bottom: 18px;
}
#team .people .bio_box .info a {
margin-right: 10px;
}
#team .people .bio_box .info a span{
display: inline-block;
width: 33px;
height: 33px;
}
#team .people .bio_box .info span.ico1,
#team .people .bio_box .info span.ico1h{
background-position: 0px 0px;
}
#team .people .bio_box .info span.ico2,
#team .people .bio_box .info span.ico2h{
background-position: -37px 0px;
}
#team .people .bio_box .info span.ico3,
#team .people .bio_box .info span.ico3h{
background-position: -75px 0px;
}
#team .people .bio_box .info span.ico4,
#team .people .bio_box .info span.ico4h{
background-position: -112px -1px;
}
#team .people .bio_box .info span.ico5,
#team .people .bio_box .info span.ico5h{
background-position: -151px 0px;
}
#team .people .bio_box .info span.ico6,
#team .people .bio_box .info span.ico6h{
background-position: -188px -1px;
}
#team .people .bio_box .info span.ico7,
#team .people .bio_box .info span.ico7h{
background-position: -226px 0px;
}
#team .people .bio_box .info a:hover span.socialicons{
display: none;
}
#team .people .bio_box .info a:hover span.socialicons_h{
display: inline-block !important;
}
.socialicons{
background: url('../img/socialicons.png') no-repeat;
width: 265px;
height: 36px;
}
.socialicons_h{
background: url('../img/socialicons_h.png') no-repeat;
width: 265px;
height: 36px;
display: none !important;
}
#process{
min-height: 350px;
}
#process .section_header{
margin-bottom: 60px;
}
#process .section_header h3{
margin: 0;
}
#process .description{
position: relative;
}
#process .description .text{
position: absolute;
display: none;
}
#process .description .text.active {
display: block;
}
#process .description h4{
font-size: 31px;
line-height: 35px;
margin-bottom: 20px;
}
#process .description p{
font-size: 15px;
color: #3F3F3F;
line-height: 26px;
}
#process .areas{
margin-left: 0;
float: right;
}
#process .areas .circle{
height: 210px;
cursor: pointer;
float: left;
margin-right: -45px;
text-align: center;
width: 210px;
background: rgba(37, 37, 40, 0.9);
border-radius: 100%;
-webkit-transition: all .3s;
-moz-transition: all .3s;
-ms-transition: all .3s;
transition: all .3s;
}
#process .areas .first{
margin-left: 0;
}
#process .areas .circle img{
margin-top: 56px;
}
#process .areas .circle span{
font-weight: 700;
font-size: 22px;
color: #fff;
display: block;
margin-top: 21px;
}
#process .areas .circle:hover,
#process .areas .circle.active {
background: rgba(17, 137, 217, 1);
}
/* Responsive
-------------------------------------------------- */
/* Large desktop */
@media (min-width: 1200px) {
}
@media (min-width: 980px) {
}
@media (max-width: 979px) {
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
#team .people .bio_box{
text-align: center;
}
#team .people .bio_box img{
float: none;
margin-bottom: 25px;
margin-left: 0;
}
#process .areas{
text-align: center;
}
#team .people .bio_box .info{
margin: 0;
float: none;
}
#process .areas .last_circle{
float: none;
display: inline-block;
margin-left: -75px;
margin-top: -54px;
}
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#team{
margin-right: -20px;
margin-left: -20px;
}
#team .container{
padding: 0px 20px;
}
#team .people .row1{
margin: 0;
}
#team .people .bio_box{
overflow: hidden;
margin-bottom: 35px;
}
#team .people .bio_boxr img{
margin: 0;
}
#aboutus .intro{
margin-bottom: 45px;
}
#aboutus{
margin-bottom: 75px;
}
#process .areas{
margin-top: 193px;
margin-bottom: 0px;
text-align: center;
}
#process .areas .circle{
float: none;
display: inline-block;
margin: 0;
}
#process .areas .last_circle{
margin-top: -23px;
}
}
/* Landscape phones and down */
@media (max-width: 480px) {
#team .people .bio_box{
text-align: center;
}
#team .people .bio_box img{
float: none;
margin-bottom: 18px;
}
#aboutus .intro{
margin-bottom: 30px;
}
#team .people .bio_box .info{
float: none;
margin: 0;
}
#process .areas{
margin-top: 250px;
}
#process .areas .circle{
width: 100px;
height: 100px;
}
#process .areas .last_circle{
margin-top: 0;
}
#process .areas .circle img{
margin-top: 22px;
}
#process .areas .circle span{
display: none;
}
}

View File

@ -0,0 +1,72 @@
#backgrounds{
margin-top:70px;
}
#backgrounds .row{
margin-bottom: 30px;
}
#backgrounds .photo{
position: relative;
}
#backgrounds .photo .circle{
position: absolute;
text-align: center;
border-radius: 100%;
background: rgba(0,0,0,0.5);
height: 82px;
width: 82px;
left: 41%;
top: 25%;
}
#backgrounds .photo .circle span{
font-size: 18px;
font-style: italic;
color: #fff;
margin-top: 29px;
display: inline-block;
}
#backgrounds .photo .circle span.doble{
margin-top: 19px;
}
/* Responsive
-------------------------------------------------- */
/* Large desktop */
@media (min-width: 1200px) {
}
@media (min-width: 980px) {
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
#backgrounds .photo .circle{
top:12%;
}
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#backgrounds .row{
margin-bottom: 0;
}
#backgrounds .photo{
text-align: center;
margin-bottom: 30px;
}
#backgrounds .photo .circle{
top: 23%;
}
}
/* Landscape phones and down */
@media (max-width: 480px) {
#backgrounds .row{
margin-bottom: 0;
}
#backgrounds .photo{
text-align: center;
margin-bottom: 30px;
}
#backgrounds .photo .circle{
top: 23%;
}
}

View File

@ -0,0 +1,240 @@
#blog{
margin-top: 70px;
}
#blog .header{
margin-left: 0;
margin-bottom: 56px;
margin-top: 30px;
}
#blog .section_header input[type="text"]{
float: right;
margin-top: 9px;
background: url('../img/search.png') #fff no-repeat 5px;
padding-left: 28px;
width: 18%;
border-radius: 5px;
}
#blog .post_row{
margin-left: 0;
margin-bottom: 40px;
height: 495px;
}
#blog .lastpost_row{
margin-bottom: 0;
}
#blog .post_row .post{
background: #fff;
margin-left: 0;
margin-right: 20px;
border-radius: 4px;
box-shadow: 1px 1px 2px 0px #E0E0E0;
}
#blog .post_row .last{
margin-right: 0;
}
#blog .post_row .post .img{
position: relative;
}
#blog .post_row .post .img .date{
background: #E8554E;
position: absolute;
padding: 2px 5px;
top: 0;
left: 11px;
}
#blog .post_row .post .img .date p{
color: #fff;
font-size: 14px;
font-weight: bold;
font-style: italic;
margin:0;
}
#blog .post_row .post .img img {
min-height: 186px;
}
#blog .post_row .post .text{
margin: 18px auto 0;
width: 83%;
}
#blog .post_row .post .text h5 {
margin: 0 0 8px 0;
font-size: 20px;
line-height: 23px;
}
#blog .post_row .post .text h5 a {
color: #333;
}
#blog .post_row .post .text span.date{
color: #9F9F9F;
display: block;
margin-bottom: 12px;
font-style:italic;
font-size: 13px;
}
#blog .post_row .post .text p{
margin: 0;
line-height: 21px;
font-size: 14px;
}
#blog .post_row .post .author_box{
margin: 12px auto 20px;
border-top: 1px solid #EDEDED;
overflow: hidden;
text-align: left;
width: 85%;
padding-top: 12px;
}
#blog .post_row .post .author_box h6{
margin: 0 0 3px 0;
font-size: 13px;
line-height: 15px;
font-style: italic;
font-weight: normal;
color: #B2B2B2;
}
#blog .post_row .post .author_box p{
color: #B2B2B2;
font-style: italic;
font-size: 13px;
line-height: 14px;
margin: 0;
}
#blog .post_row .post .author_box img{
float: right;
}
#blog .post_row .post a.plus_wrapper{
width: 99%;
text-align: center;
background: #fff;
display: none;
border-radius: 0px 0px 4px 4px;
padding: 6px 0px 2px;
margin: 0 auto 1px;
}
#blog .post_row .post a.plus_wrapper span{
color: #1189D9;
font-size: 30px;
font-weight: bold;
}
/*#blog .post_row .post a.plus_wrapper,
#blog .post_row .post a.plus_wrapper span{
-webkit-transition: all .1s linear;
-moz-transition: all .1s linear;
-ms-transition: all .1s linear;
-o-transition: all .1s linear;
transition: all .1s linear;
}*/
#blog .post_row .post:hover a.plus_wrapper{
display: block;
}
/*#blog .post_row .post a.plus_wrapper:hover{
background: #1189D9;
}
#blog .post_row .post a.plus_wrapper:hover span{
color: #fff;
}*/
#blog .post_row .post:hover{
box-shadow: 0px 1px 5px 1px rgb(216, 216, 216);
}
#blog .post_row .post:hover .text h5 a{
color: #1189D9;
}
/*pagination*/
#blog .pagination {
margin: 35px auto 0;
width: 26%;
}
/* Responsive
-------------------------------------------------- */
/* Large desktop */
@media (min-width: 1200px) {
}
@media (min-width: 980px) {
}
@media (max-width: 979px) {
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
#blog .pagination{
width: 36%;
}
#blog .post_row{
height: 545px;
}
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#blog .post_row{
height: auto;
margin-bottom: 0;
}
#blog .post_row .post{
width: 65%;
margin: 0 auto;
margin-bottom: 50px;
}
#blog .post_row .post .img {
float: left;
margin-bottom: 16px;
}
#blog .post_row .post .author_box{
display: none;
}
#blog .post_row .post .text {
overflow: hidden;
width: 81%;
margin: 0 auto 20px;
margin-top: 7px;
}
#blog .post_row .post a.plus_wrapper{
display: inline-block;
margin: 0;
width: 100%;
}
/*#blog .post_row .post:hover a.plus_wrapper{
display: inline-block;
background: #1189D9;
}
#blog .post_row .post:hover a.plus_wrapper span{
color: #fff;
}*/
#blog .pagination {
width: 55%;
}
}
/* Landscape phones and down */
@media (max-width: 480px) {
#blog .post_row{
height: auto;
margin-bottom: 0px;
}
#blog .post_row .post{
margin: 0 auto 50px;
width: 72%;
}
#blog .post_row .post .img {
float: none;
margin: 0;
}
#blog .post_row .post .text {
float: none;
margin: 24px auto 0;
width: 86%;
}
#blog .post_row .post .author_box {
margin: 30px auto 15px;
}
#blog .post_row .post a.plus_wrapper{
display: block;
padding: 10px 0 8px;
}
#blog .pagination {
width: 72%;
}
}

View File

@ -0,0 +1,293 @@
#blog_post{
margin-top: 70px;
}
#blog_post .section_header input[type="text"]{
float: right;
margin-top: 9px;
background: url('../img/search.png') #fff no-repeat 5px;
padding-left: 28px;
width: 18%;
border-radius: 5px;
}
#blog_post .post_pic {
border: 7px solid #fff;
border-radius: 5px;
box-shadow:1px 1px 2px 0px rgb(207, 207, 207);
}
#blog_post .post_content {
margin-top: 40px;
padding-bottom: 90px;
border-bottom: 1px solid rgb(202, 202, 202);
box-shadow: 0px 1px 0px 0px white;
}
#blog_post .post_content h2 {
font-size: 32px;
color: #3F3F3F;
margin-bottom: 15px;
}
#blog_post .post_content span.date{
width: 100%;
font-size: 14px;
font-style: italic;
margin-bottom: 42px;
display: block;
color: #9C9C9C;
}
#blog_post .post_content p {
line-height: 24px;
margin-bottom: 15px;
}
#blog_post .post_content .author_box {
margin-top: 50px;
}
#blog_post .post_content .author_box .author {
margin-top: 45px;
font-weight: bold;
font-size: 15px;
color: #1189D9;
}
#blog_post .post_content .author_box .area {
font-size: 15px;
font-style: italic;
margin-top: 5px;
color: #9C9C9C;
}
#blog_post .comments {
margin-top: 3px;
padding-top: 50px;
border-bottom: 1px solid rgb(202, 202, 202);
box-shadow: 0px 1px 0px 0px white;
padding-bottom: 3px;
}
#blog_post .comments h4{
font-size: 23px;
margin-top: 0;
margin-bottom: 25px;
}
#blog_post .comments .comment {
margin-bottom: 60px;
margin-top: 30px;
}
#blog_post .comments .comment.reply_to {
margin-top: -10px;
}
#blog_post .comments .comment .author_pic {
max-width: 55px;
float: right;
}
#blog_post .comments .comment .name {
font-weight: bold;
color: #3F3F3F;
font-size: 14px;
}
#blog_post .comments .comment a.reply {
color: #1189D9;
text-decoration: underline;
margin-left: 20px;
font-size: 14px;
-webkit-transition: color .2s;
-moz-transition: color .2s;
-ms-transition: color .2s;
transition: color .2s;
}
#blog_post .comments .comment a.reply:hover{
color: #252528;
}
#blog_post .comments .comment .date {
font-size: 13px;
font-weight: bold;
color: #747B85;
}
#blog_post .comments .comment .response {
margin-top: 10px;
line-height: 22px;
font-size: 14px;
}
/* new comment */
#blog_post .new_comment {
padding-top: 30px;
margin-top: 3px;
}
#blog_post .new_comment h4{
font-size: 23px;
color: #3F3F3F;
}
#blog_post .new_comment form {
margin-top: 35px;
}
#blog_post .new_comment form input[type="text"] {
height: 25px;
border-radius: 3px;
width: 95.7%;
}
#blog_post .new_comment form textarea {
margin-top: 10px;
width: 97.9%;
}
#blog_post .new_comment form a.send{
float: right;
color: #fff;
border: 0 none;
background: #187CCC;
text-shadow: none;
padding: 4px 15px 4px;
box-shadow: none;
text-transform: uppercase;
font-size: 15px;
font-weight: bold;
margin-top: 8px;
-webkit-transition: background linear .2s, box-shadow linear .2s;
-moz-transition: background linear .2s, box-shadow linear .2s;
-o-transition: background linear .2s, box-shadow linear .2s;
transition: background linear .2s, box-shadow linear .2s;
}
#blog_post .new_comment form a.send:hover{
background: #252528;
}
#blog_post .sidebar{
margin: 0;
padding: 40px 19px 40px 28px;
background: #fff;
border-radius: 4px;
box-shadow:1px 1px 2px 0px rgb(207, 207, 207);
float: right;
}
#blog_post .sidebar .box{
padding-bottom: 30px;
overflow: hidden;
margin-bottom: 40px;
border-bottom: 1px solid rgb(216, 216, 216);
}
#blog_post .sidebar .last{
border: 0 none;
padding: 0;
margin-bottom: 0;
}
#blog_post .sidebar .box .recent{
width: 100%;
margin-bottom: 20px;
float: left;
}
#blog_post .sidebar .box .recent span img{
float: left;
margin-right: 10px;
}
#blog_post .sidebar .box .recent p{
margin: 0;
line-height: 18px;
font-size: 14px;
}
#blog_post .sidebar .sidebar_header {
margin-bottom: 20px;
}
#blog_post .sidebar .sidebar_header h4{
font-size: 19px;
margin: 0;
}
#blog_post .sidebar .sidebar_menu {
list-style-type: none;
margin-left: 0px;
}
#blog_post .sidebar .sidebar_menu ul{
margin: 0;
padding: 0;
list-style: none;
}
#blog_post .sidebar .sidebar_menu li {
margin-bottom: 6px;
}
#blog_post .sidebar .sidebar_menu li a {
color: #333;
font-size: 14px;
-webkit-transition: color .2s;
-moz-transition: color .2s;
-ms-transition: color .2s;
transition: color .2s;
}
#blog_post .sidebar .sidebar_menu li a:hover {
color: #1187D8;
}
#blog_post .sidebar .recent_posts {
list-style-type: none;
margin-top: 30px;
margin-left: 0px;
}
#blog_post .sidebar .recent_posts li {
margin-bottom: 20px;
font-size: 15px;
}
#blog_post .sidebar .recent_posts .thumb {
border: 3px solid #fff;
box-shadow: 0px 0px 1px 1px #bdbdbd;
}
#blog_post .sidebar .recent_posts a.link {
color: #333;
display: block;
margin-top: 10px;
}
#blog_post .sidebar .recent_posts a:hover {
color: #87a46e;
text-decoration: underline;
}
#blog_post .sidebar ul.recent_photos{
list-style-type: none;
margin-left: 0px;
padding-top: 18px;
}
#blog_post .sidebar ul.recent_photos li{
list-style: none;
display: inline-block;
margin-right: 6px;
margin-bottom: 11px;
}
#blog_post .sidebar ul.recent_photos li a img {
max-width: 55px;
margin-right: 9px;
border-radius: 3px;
}
/* Responsive
-------------------------------------------------- */
/* Landscape phones and down */
@media (max-width: 480px) {
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#blog_wrapper .header hr {
width: 70%;
}
#blog_wrapper .post .main_pic {
display: block;
margin: 0 auto;
}
#blog_wrapper .sidebar .recent_posts .thumb {
max-width: 100px;
}
}
@media (min-width: 768px) {
#blog_wrapper .sidebar .search-query {
width: 85%;
}
#blog_post .sidebar .box .recent p{
font-size: 13px;
}
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
}
@media (max-width: 979px) {
}
@media (min-width: 980px) {
}
/* Large desktop */
@media (min-width: 1200px) {
#blog_wrapper .post .info {
width: 420px;
}
}

View File

@ -0,0 +1,279 @@
/*
Override .container and .span sizes on 1200px media query to be like a 980 screen size for design purposes.
This override is useful when changing the bootstrap files version instead of editing directly on the
included bootstrap file.
*/
@media (min-width: 1200px) {
.row {
margin-left: -20px;
*zoom: 1;
}
.row:before,
.row:after {
display: table;
line-height: 0;
content: "";
}
.row:after {
clear: both;
}
[class*="span"] {
float: left;
min-height: 1px;
margin-left: 20px;
}
.container,
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 940px;
}
.span12 {
width: 940px;
}
.span11 {
width: 860px;
}
.span10 {
width: 780px;
}
.span9 {
width: 700px;
}
.span8 {
width: 620px;
}
.span7 {
width: 540px;
}
.span6 {
width: 460px;
}
.span5 {
width: 380px;
}
.span4 {
width: 300px;
}
.span3 {
width: 220px;
}
.span2 {
width: 140px;
}
.span1 {
width: 60px;
}
.offset12 {
margin-left: 980px;
}
.offset11 {
margin-left: 900px;
}
.offset10 {
margin-left: 820px;
}
.offset9 {
margin-left: 740px;
}
.offset8 {
margin-left: 660px;
}
.offset7 {
margin-left: 580px;
}
.offset6 {
margin-left: 500px;
}
.offset5 {
margin-left: 420px;
}
.offset4 {
margin-left: 340px;
}
.offset3 {
margin-left: 260px;
}
.offset2 {
margin-left: 180px;
}
.offset1 {
margin-left: 100px;
}
.row-fluid {
width: 100%;
*zoom: 1;
}
.row-fluid:before,
.row-fluid:after {
display: table;
line-height: 0;
content: "";
}
.row-fluid:after {
clear: both;
}
.row-fluid [class*="span"] {
display: block;
float: left;
width: 100%;
min-height: 30px;
margin-left: 2.127659574468085%;
*margin-left: 2.074468085106383%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.row-fluid [class*="span"]:first-child {
margin-left: 0;
}
.row-fluid .controls-row [class*="span"] + [class*="span"] {
margin-left: 2.127659574468085%;
}
.row-fluid .span12 {
width: 100%;
*width: 99.94680851063829%;
}
.row-fluid .span11 {
width: 91.48936170212765%;
*width: 91.43617021276594%;
}
.row-fluid .span10 {
width: 82.97872340425532%;
*width: 82.92553191489361%;
}
.row-fluid .span9 {
width: 74.46808510638297%;
*width: 74.41489361702126%;
}
.row-fluid .span8 {
width: 65.95744680851064%;
*width: 65.90425531914893%;
}
.row-fluid .span7 {
width: 57.44680851063829%;
*width: 57.39361702127659%;
}
.row-fluid .span6 {
width: 48.93617021276595%;
*width: 48.88297872340425%;
}
.row-fluid .span5 {
width: 40.42553191489362%;
*width: 40.37234042553192%;
}
.row-fluid .span4 {
width: 31.914893617021278%;
*width: 31.861702127659576%;
}
.row-fluid .span3 {
width: 23.404255319148934%;
*width: 23.351063829787233%;
}
.row-fluid .span2 {
width: 14.893617021276595%;
*width: 14.840425531914894%;
}
.row-fluid .span1 {
width: 6.382978723404255%;
*width: 6.329787234042553%;
}
.row-fluid .offset12 {
margin-left: 104.25531914893617%;
*margin-left: 104.14893617021275%;
}
.row-fluid .offset12:first-child {
margin-left: 102.12765957446808%;
*margin-left: 102.02127659574467%;
}
.row-fluid .offset11 {
margin-left: 95.74468085106382%;
*margin-left: 95.6382978723404%;
}
.row-fluid .offset11:first-child {
margin-left: 93.61702127659574%;
*margin-left: 93.51063829787232%;
}
.row-fluid .offset10 {
margin-left: 87.23404255319149%;
*margin-left: 87.12765957446807%;
}
.row-fluid .offset10:first-child {
margin-left: 85.1063829787234%;
*margin-left: 84.99999999999999%;
}
.row-fluid .offset9 {
margin-left: 78.72340425531914%;
*margin-left: 78.61702127659572%;
}
.row-fluid .offset9:first-child {
margin-left: 76.59574468085106%;
*margin-left: 76.48936170212764%;
}
.row-fluid .offset8 {
margin-left: 70.2127659574468%;
*margin-left: 70.10638297872339%;
}
.row-fluid .offset8:first-child {
margin-left: 68.08510638297872%;
*margin-left: 67.9787234042553%;
}
.row-fluid .offset7 {
margin-left: 61.70212765957446%;
*margin-left: 61.59574468085106%;
}
.row-fluid .offset7:first-child {
margin-left: 59.574468085106375%;
*margin-left: 59.46808510638297%;
}
.row-fluid .offset6 {
margin-left: 53.191489361702125%;
*margin-left: 53.085106382978715%;
}
.row-fluid .offset6:first-child {
margin-left: 51.063829787234035%;
*margin-left: 50.95744680851063%;
}
.row-fluid .offset5 {
margin-left: 44.68085106382979%;
*margin-left: 44.57446808510638%;
}
.row-fluid .offset5:first-child {
margin-left: 42.5531914893617%;
*margin-left: 42.4468085106383%;
}
.row-fluid .offset4 {
margin-left: 36.170212765957444%;
*margin-left: 36.06382978723405%;
}
.row-fluid .offset4:first-child {
margin-left: 34.04255319148936%;
*margin-left: 33.93617021276596%;
}
.row-fluid .offset3 {
margin-left: 27.659574468085104%;
*margin-left: 27.5531914893617%;
}
.row-fluid .offset3:first-child {
margin-left: 25.53191489361702%;
*margin-left: 25.425531914893618%;
}
.row-fluid .offset2 {
margin-left: 19.148936170212764%;
*margin-left: 19.04255319148936%;
}
.row-fluid .offset2:first-child {
margin-left: 17.02127659574468%;
*margin-left: 16.914893617021278%;
}
.row-fluid .offset1 {
margin-left: 10.638297872340425%;
*margin-left: 10.53191489361702%;
}
.row-fluid .offset1:first-child {
margin-left: 8.51063829787234%;
*margin-left: 8.404255319148938%;
}
}

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,313 @@
#coming_soon {
margin-top: -35px;
}
#coming_soon .head{
background: url("../img/backgrounds/color-splash.jpg") no-repeat;
display: block;
padding-top: 160px;
height: 288px;
width: 100%;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#coming_soon .head .line{
margin-left: 0;
}
#coming_soon .text h4{
margin: 0 0 35px 0;
color: #fff;
font-size: 35px;
font-weight: normal;
line-height: 38px;
text-shadow: 1px 1px 0px #2A284D;
}
#coming_soon .text p{
color: #fff;
font-size: 16px;
font-style: italic;
line-height: 24px;
}
#coming_soon .text p span{
font-style: normal;
text-transform: uppercase;
}
#coming_soon .count{
margin: 0;
float: right;
}
#coming_soon .count .box{
text-align: center;
float: right;
margin-left: -10px;
}
#coming_soon .count .first{
margin: 0 0 0 90px;
}
#coming_soon .count .circle{
height: 98px;
width: 98px;
text-align: center;
border-radius: 100%;
margin-bottom: 8px;
background: rgba(0,0,0,0.5);
}
#coming_soon .count .circle span{
color: #fff;
display: inline-block;
font-size: 33px;
margin-top: 36px;
font-weight: bold;
}
#coming_soon .count p{
color: #fff;
margin: 0;
text-transform: uppercase;
font-size: 13px;
}
#coming_soon .email_wrapp .wrapp{
background: #fff;
width: 98%;
margin: 0 auto 60px;
padding: 32px 0 21px;
height: 50px;
float: none;
border-radius: 0 0 4px 4px;
box-shadow: 1px 1px 2px 0px rgb(206, 206, 206);
}
#coming_soon .email_wrapp .line{
margin-left: 0;
}
#coming_soon .email_wrapp .wrapp p{
float: left;
font-size: 17px;
margin: 8px 0px 0px 48px;
}
#coming_soon .email_wrapp .wrapp input[type="text"]{
float: left;
font-size: 16px;
border-radius: 3px;
height: 27px;
margin-bottom: 0;
width: 31.5%;
margin-left: 30px;
}
#coming_soon .email_wrapp .wrapp a.send{
text-transform: uppercase;
color: #fff;
border: 0 none;
box-shadow: none;
margin: 0px 70px 0 0;
background: #1189D9;
font-weight: bold;
text-shadow: none;
padding: 8px 10px;
font-size: 14px;
float: right;
-webkit-transition: background linear .2s, box-shadow linear .2s;
-moz-transition: background linear .2s, box-shadow linear .2s;
-o-transition: background linear .2s, box-shadow linear .2s;
transition: background linear .2s, box-shadow linear .2s;
}
#coming_soon .email_wrapp .wrapp a.send:hover{
background: #252528;
}
#coming_soon .social{
text-align: center;
margin: 0px;
}
#coming_soon .social p{
display: inline-block;
font-weight: bold;
font-size: 21px;
margin: 0 10px 0 0;
bottom: 9px;
position: relative;
}
#coming_soon .social a {
margin-left: 10px;
display: inline-block;
}
#coming_soon .social a span{
display: inline-block;
width: 33px;
height: 33px;
}
#coming_soon .social span.ico1,
#coming_soon .social span.ico1h{
background-position: 0px 0px;
}
#coming_soon .social span.ico2,
#coming_soon .social span.ico2h{
background-position: -37px 0px;
}
#coming_soon .social span.ico3,
#coming_soon .social span.ico3h{
background-position: -75px 0px;
}
#coming_soon .social span.ico4,
#coming_soon .social span.ico4h{
background-position: -112px -1px;
}
#coming_soon .social span.ico5,
#coming_soon .social span.ico5h{
background-position: -151px 0px;
}
#coming_soon .social span.ico6,
#coming_soon .social span.ico6h{
background-position: -188px -1px;
}
#coming_soon .social span.ico7,
#coming_soon .social span.ico7h{
background-position: -226px 0px;
}
#coming_soon .social a:hover span.icons{
display: none;
}
#coming_soon .social a:hover span.iconsh{
display: inline-block;
}
#coming_soon .social span.iconsh{
display: none;
}
#coming_soon .icons{
background: url('../img/socialicons2.png') no-repeat;
width: 265px;
height: 36px;
}
#coming_soon .iconsh{
background: url('../img/socialicons_h.png') no-repeat;
width: 265px;
height: 36px;
}
/* Responsive
-------------------------------------------------- */
/* Large desktop */
@media (min-width: 1200px) {
}
@media (min-width: 980px) {
}
@media (max-width: 979px) {
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
#coming_soon .head{
padding-top: 80px;
height: 310px;
}
#coming_soon .count{
text-align: center;
width: 37%;
}
#coming_soon .count .box{
margin: 0 0 13px 0;
}
#coming_soon .count .first{
margin: 0;
}
#coming_soon .count .circle{
float: none;
display: inline-block;
}
#coming_soon .email_wrapp .wrapp{
text-align: center;
height: auto;
padding: 30px 0 30px;
}
#coming_soon .email_wrapp .wrapp p{
float: none;
margin: 0 0 19px 0;
}
#coming_soon .email_wrapp .wrapp input[type="text"]{
float: none;
width: 43%;
margin: 0 1px 0 0;
}
#coming_soon .email_wrapp .wrapp a.send{
float: none;
margin: 0 0 0 7px;
}
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#coming_soon .head{
text-align: center;
background: none;
margin-bottom: 80px;
padding-top: 70px;
height: auto;
}
#coming_soon .text{
margin-bottom: 20px;
}
#coming_soon .text h4{
color: #333;
text-shadow:none;
}
#coming_soon .text p{
color: #333;
}
#coming_soon .count .first{
margin: 0;
}
#coming_soon .count .box{
float: none;
display: inline-block;
}
#coming_soon .count .circle{
background: rgba(0,0,0,0.8);
width: 100px;
height: 100px;
}
#coming_soon .count .circle span{
font-size: 35px;
margin-top: 39px;
}
#coming_soon .count p{
color: #333;
}
#coming_soon .email_wrapp .wrapp{
background: transparent;
box-shadow: none;
padding: 0;
width: 100%;
}
#coming_soon .email_wrapp .wrapp p{
float: none;
margin: 0 0 20px 0;
}
#coming_soon .email_wrapp .wrapp input[type="text"]{
float: left;
width: 77%;
margin-left: 0;
}
#coming_soon .email_wrapp .wrapp a.send{
float: left;
margin-left: 22px;
margin-right: 0;
}
}
/* Landscape phones and down */
@media (max-width: 480px) {
#coming_soon .count .circle{
height: 73px;
width: 73px;
}
#coming_soon .count .circle span{
margin-top: 26px;
font-size: 30px;
}
#coming_soon .email_wrapp .wrapp input[type="text"]{
width: 70%;
}
#coming_soon .social p{
display: block;
margin: 16px 0 3px 0;
}
#coming_soon .social a{
margin-left: 0px;
}
}

View File

@ -0,0 +1,239 @@
#contact {
margin-top: 70px;
}
#contact .contact{
margin: 40px 0 100px 0;
}
#contact .contact p{
color: #939394;
font-size: 19px;
margin-bottom: 47px;
font-style: italic;
line-height: 24px;
}
#contact .form{
margin: 0;
}
#contact .contact form{
margin: 0;
}
#contact .form .box{
margin: 0;
}
#contact .form .box input[type="text"]{
padding-left: 39px;
margin-bottom: 10px;
color: black;
height: 29px;
border-radius: 3px;
width: 89%;
}
#contact .form .box input.name{
background: url('../img/formname.png') #fff no-repeat 5px;
}
#contact .form .box input.mail{
background: url('../img/formmail.png') #fff no-repeat 5px;
}
#contact .form .box input.phone{
background: url('../img/formphone.png') #fff no-repeat 5px;
}
#contact .form .box_r{
float: right;
}
#contact .form .box textarea{
padding: 11px;
width: 94%;
margin: 0;
border-radius: 3px;
height: 113px;
}
#contact .contact .submit{
margin: 0;
}
#contact .contact .submit .box{
margin: 0
}
#contact .contact .submit label.checkbox{
color: #394350;
font-style: 14px;
}
#contact .contact .submit .right{
float: right;
}
#contact .contact .submit .right input[type="submit"]{
float: right;
text-transform: uppercase;
color: #fff;
background: #187CCC;
font-size: 15px;
padding: 4px 12px;
border: 0 none;
border-radius: 3px;
-webkit-transition: background linear .2s, box-shadow linear .2s;
-moz-transition: background linear .2s, box-shadow linear .2s;
-o-transition: background linear .2s, box-shadow linear .2s;
transition: background linear .2s, box-shadow linear .2s;
}
#contact .contact .submit .right input[type="submit"]:hover{
background: #252528;
}
#contact .map{
margin: 0;
}
#contact .map iframe{
display: block;
}
#contact .map .box_wrapp{
position: absolute;
margin: 0;
box-shadow: 0 0 7px 0 rgba(26, 26, 26, 0.4);
padding: 33px 0 33px;
background: white;
top: 41%;
border-radius: 4px;
}
#contact .map .box_wrapp .box_cont{
margin: 0 auto;
width: 76%;
}
#contact .map .box_wrapp .head{
width: 100%;
margin-bottom: 17px;
overflow: hidden;
}
#contact .map .box_wrapp .head h6{
font-size: 24px;
margin: 0;
font-style: italic;
float: left;
padding-bottom: 2px;
border-bottom: 1px solid;
font-weight: normal;
}
#contact .map .box_wrapp ul.street{
list-style: none;
margin: 0;
padding:0;
}
#contact .map .box_wrapp ul.street li{
color: #777777;
font-size: 14px;
}
#contact .map .box_wrapp ul.street li.icon{
margin-top: 3px;
}
#contact .map .box_wrapp ul.street li.icon span.ico1{
float: left;
height: 20px;
}
#contact .map .box_wrapp ul.street li.icon span.ico2{
float: left;
height: 20px;
background-position: 0px -23px;
}
#contact .map .box_wrapp ul.street li.icon .text{
font-size: 15px;
color: #777777;
margin-left: 6px;
}
#contact .map .box_wrapp ul.street li.icon a:hover{
color: #187CCC;
-webkit-transition: all .2s;
-moz-transition: all .2s;
-ms-transition: all .2s;
transition: all .2s;
}
#contact .map .box_wrapp ul.street li.icontop{
margin-top: 13px;
}
#contact .map .box_wrapp .headbottom{
margin-top: 42px;
}
#contact .map .box_wrapp p{
color: #777777;
font-size: 14px;
margin-bottom: 32px;
}
#contact .map .box_wrapp a.btn{
text-transform: uppercase;
color: #fff;
font-size: 15px;
background: #187CCC;
text-shadow: none;
padding: 6px 0 6px;
font-weight: bold;
border: 0 none;
box-shadow: none;
border-radius: 3px;
margin: 0 auto;
display: block;
width: 56%;
-webkit-transition: background linear .2s, box-shadow linear .2s;
-moz-transition: background linear .2s, box-shadow linear .2s;
-o-transition: background linear .2s, box-shadow linear .2s;
transition: background linear .2s, box-shadow linear .2s;
}
#contact .map .box_wrapp a.btn:hover{
background: #252528;
}
.contacticos{
background: url('../img/contact_icos.png') no-repeat;
width: 24px;
height: 44px;
}
/* Responsive
-------------------------------------------------- */
/* Large desktop */
@media (min-width: 1200px) {
}
@media (min-width: 980px) {
}
@media (max-width: 979px) {
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#contact .contact .submit .box{
margin: 10px 0 24px;
}
#contact .form .box input[type="text"]{
width: 87%;
}
#contact .contact .submit .right input[type="submit"]{
margin: 0 auto;
float: none;
width: 53%;
display: block;
padding: 7px;
}
#contact .map .box_wrapp{
width: 90%;
position: relative;
margin: 0 auto 80px;
}
#contact .map .box_wrapp .box_cont{
}
#contact .map iframe{
display: none;
}
#contact .map .box_wrapp a.btn{
width: 65%;
}
}
/* Landscape phones and down */
@media (max-width: 480px) {
#contact .contact .submit .right input[type="submit"]{
width: 60%;
}
#contact .map .box_wrapp{
width: 100%;
}
}

View File

@ -0,0 +1,232 @@
#features .subtitle h2{
margin: 0;
font-style: italic;
font-size: 24px;
font-weight: normal;
margin-bottom: 70px;
line-height: 35px;
text-align: center;
}
/* features */
#features {
margin-top: 70px;
}
#features .section_header h3 span{
font-size: 18px;
line-height: 20px;
}
#features .option1{
margin-bottom: 70px;
}
#features .option1 .feature {
border-bottom: 1px solid #e0e0e0;
margin-bottom: 65px;
}
#features .option1 .feature .info h3 {
font-size: 21px;
margin-top: 35px;
}
#features .option1 .feature.ss h3 {
margin-top: 45px;
}
#features .option1 .feature .info h3 img {
margin-right: 18px;
position: relative;
top: -10px;
}
#features .option1 .feature .info p {
margin-top: 15px;
}
#features .option2{
margin-bottom: 70px;
}
#features .option2 .feature {
margin-bottom: 70px;
}
#features .option2 .feature .box{
text-align: center;
float: left;
width: 16%;
height: 77px;
}
#features .option2 .feature .box img.one{
margin-top: 18px;
}
#features .option2 .feature .box img.two{
margin-top: 20px;
}
#features .option2 .feature .text{
float: left;
width: 76%;
margin-top: 17px;
margin-left: 23px;
}
#features .option2 .feature .text h6{
margin: 0 0 8px 0;
font-size: 20px;
}
#features .option2 .feature .text p{
margin: 0;
font-size: 14px;
line-height: 23px;
}
#features .option2 .right{
float: right;
}
#features .option3 .feature{
padding-bottom: 38px;
background: white;
box-shadow: 1px 1px 2px 0px #E0E0E0;
border-radius: 4px;
cursor: pointer;
/*border:1px solid #fff;*/
}
#features .option3 .feature .img{
text-align: center;
margin: 42px auto 37px;
}
#features .option3 .feature .text{
margin: 0 auto;
width: 87%;
}
#features .option3 .feature .text h6{
margin: 0 0 9px 0;
font-size: 20px;
text-align: center;
}
#features .option3 .feature .text p{
margin: 0 auto;
font-size: 14px;
line-height: 23px;
text-align: center;
width: 90%;
margin-top: 18px;
}
#features .option3 .feature:hover{
border-color: #B1B1B1;
box-shadow: 0px 0px 6px -1px #B4B4B4;
-webkit-transition: all .2s ease;
-moz-transition: all .2s ease;
-ms-transition: all .2s ease;
-o-transition: all .2s ease;
transition: all .2s ease;
}
#features .option1 .last{
margin-bottom: 0;
}
/* Responsive
-------------------------------------------------- */
/* Large desktop */
@media (min-width: 1200px) {
}
@media (min-width: 980px) {
}
@media (max-width: 979px) {
#features .features_op1_row .feature .img_box span.circle{
top: 35%;
}
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#features .features_op1_row .feature {
margin-bottom: 60px;
}
#features .features_op1_row .last{
margin-bottom: 0;
}
#features .features_op1_row .feature .img_box{
text-align: center;
}
#features .features_op1_row .feature .text{
}
#features .features_op1_row .feature .text h6{
text-align: center;
}
#features .features_op1_row .feature .img_box span.circle{
top: 38%;
left: 48%;
}
#features .features_op1_row .feature:hover .img_box{
box-shadow:none;
}
#features .option2 {
margin-bottom: 60px;
}
#features .option2 .feature {
float: left;
width: 100%;
margin-bottom: 60px;
}
#features .option2 .right{
/*margin-bottom: 0;*/
}
#features .option2 .feature .text{
margin-top: 0;
}
#features .option3 .feature {
margin-bottom: 60px;
overflow: hidden;
}
}
/* Landscape phones and down */
@media (max-width: 480px) {
#features .subtitle h2 {
font-size: 22px;
line-height: 30px;
}
#features .features_op1_row .feature {
margin-bottom: 60px;
}
#features .features_op1_row .last{
margin-bottom: 0;
}
#features .features_op1_row .feature .img_box{
text-align: center;
}
#features .features_op1_row .feature .text{
}
#features .features_op1_row .feature .text h6{
text-align: left;
}
#features .features_op1_row .feature .img_box span.circle{
left: 44%;
}
#features .features_op1_row .feature:hover .img_box{
box-shadow:none;
}
#features .option2 {
margin-bottom: 60px;
}
#features .option2 .feature {
float: left;
width: 100%;
margin-bottom: 60px;
}
#features .option2 .right{
/*margin-bottom: 0;*/
}
#features .option2 .feature .text{
margin-top: 0;
}
#features .last {
margin-bottom: 0;
}
#features .option3 .feature {
margin-bottom: 60px;
}
}

View File

@ -0,0 +1,627 @@
/* Main Slider
-------------------------------------------------- */
#feature_slider {
height:720px;
height: 480px;
background: #262626;
z-index: 1;
margin-bottom: 40px;
}
#feature_slider h1 {
font-weight: 100;
color: #ccc;
font-size: 60px;
line-height: 66px;
text-align: center;
position: absolute;
top: 180px;
width: 100%;
}
#feature_slider h1 strong {
text-transform: uppercase;
font-size: 14px;
margin: 0 0 20px;
}
#pagination {
position: absolute;
top: 505px;
z-index: 3;
margin: 0;
padding: 0;
display: none;
list-style-type: none;
}
#pagination li {
text-indent: -99999em;
float: left;
padding: 0 6px;
cursor: pointer;
}
#pagination li a {
width: 7px;
height: 7px;
box-shadow: 0px 0px 1px 2px #ccc;
background: rgb(0, 0, 0);
border-radius: 10px;
display: block;
/*border: 1px solid #fff;*/
opacity: .7;
-webkit-transition: opacity .1s linear;
-moz-transition: opacity .1s linear;
transition: opacity .1s linear;
}
#pagination li.active a {
background: rgb(46, 92, 177);
box-shadow: none;
width: 8px;
height: 8px;
}
#pagination li:hover a {
opacity: 1;
}
.slide {
width: 100%;
/*height: 720px;*/
height: 480px;
position: absolute;
display: none;
overflow: hidden;
z-index: 1;
-webkit-background-size: cover !important;
-moz-background-size: cover !important;
-o-background-size: cover !important;
background-size: cover !important;
}
.slide.previous {
z-index: 1;
}
.slide.active {
z-index: 2;
}
.slide.hiddden {
display: none;
}
/* Custom styles for each slide */
/* Slide 1 */
.slide#showcasing .info {
position: absolute;
top: 160px;
left: 13%;
width: 30%;
display: none;
z-index: 10;
}
.slide#showcasing .info h2 {
color: #fff;
font-size: 50px;
font-weight: normal;
line-height: 56px;
text-shadow: 1px 1px 1px rgb(49, 57, 61);
}
/* Slide 2 */
.slide#ideas .info {
position: relative;
top: 110px;
text-align: center;
}
.slide#ideas .info h2 {
color: #fff;
font-weight: normal;
}
/* Slide 3 */
.slide#tour .info {
position: absolute;
top: 150px;
right: 6%;
width: 24%;
}
.slide#tour .info h2 {
color: #fff;
font-size: 45px;
font-weight: normal;
text-shadow: 1px 1px 1px #3b3262;
line-height: 57px;
}
.slide#tour .info a {
color: #fff;
font-weight: bold;
background-color: #2a205d;
padding: 13px 30px;
font-size: 19px;
border-radius: 5px;
margin-top: 40px;
display: inline-block;
-webkit-transition: opacity .1s linear;
-moz-transition: opacity .1s linear;
transition: opacity .1s linear;
}
.slide#tour .info a:hover { }
/* Slide 4 */
.slide#responsive .info {
position: absolute;
top: 170px;
right: 9%;
width: 25%;
}
.slide#responsive .info h2 {
color: #fff;
font-size: 47px;
font-weight: normal;
text-shadow: 1px 1px 1px #3b3262;
line-height: 56px;
}
.slide#responsive .info h2 strong {
font-size: 42px;
}
.slide .info h2 { }
.slide .info {
display: none;
z-index: 10;
}
.slide .info a:hover {
opacity: .8;
}
.asset,
.fade {
position: absolute;
display: none;
}
#slide-left,
#slide-right {
width: 31px;
height: 37px;
display: block;
position: absolute;
top: 250px;
left: 0;
background: url(../img/leftright-arrows.png) no-repeat;
opacity: .5;
-webkit-transition: opacity .1s linear;
-moz-transition: opacity .1s linear;
transition: opacity .1s linear;
display: none;
z-index: 2;
}
#slide-right {
left: auto;
right: 0;
background-position: -31px 0;
}
#slide-left:hover,
#slide-right:hover {
opacity: 1;
}
/* Showcase services
-------------------------------------------------- */
#showcase {
margin-top: 70px;
}
#showcase .container {
/*width: 980px;*/
}
#showcase .image img {
box-shadow: 3px 3px 5px 0px #B7B6B7;
}
#showcase .info {
margin-top: 30px;
}
#showcase .info h4 {
font-size: 17px;
}
#showcase .info p {
color: #333333;
line-height: 21px;
font-size: 13px;
}
#showcase .features_op1_row .last{
margin-right: 0;
}
#showcase .features_op1_row .feature .text{
margin: 32px auto 0;
width: 87%;
}
#showcase .features_op1_row .feature .text h6{
margin: 0 0 14px 0;
font-size: 20px;
}
#showcase .features_op1_row .feature .text p{
margin: 0;
font-size: 14px;
line-height: 23px;
}
#showcase .features_op1_row .feature .img_box{
position: relative;
border-radius: 5px;
}
#showcase .features_op1_row .feature .img_box img {
border-radius: 5px;
max-width: 95%;
margin: 0 auto;
display: block;
}
#showcase .features_op1_row .feature .img_box span.circle{
background: rgba(17, 137, 217, 0.8);
width: 48px;
height: 48px;
display: none;
text-align: center;
position: absolute;
top: 36%;
left: 42%;
border-radius: 100%;
}
#showcase .features_op1_row .feature .img_box span.circle span.plus{
display: inline-block;
margin-top: 13px;
font-weight: bold;
color: white;
font-size: 32px;
}
#showcase .features_op1_row .feature .img_box:hover span.circle{
display: block;
}
#showcase .features_op1_row .feature .img_box:hover .img_box{
box-shadow: 0px 0px 1px 100px black inset;
}
#showcase .features_op1_row .feature .img_box:hover img{
box-shadow: 1px 1px 6px 0px #888;
border-radius: 5px;
opacity: 0.9;
filter:alpha(opacity=90);
}
/* Features
-------------------------------------------------- */
#features {
margin-top: 70px;
margin-bottom: -20px;
}
#features .feature {
border-bottom: 1px solid #e0e0e0;
margin-bottom: 65px;
}
#features .feature .info h3 {
font-size: 21px;
margin-top: 35px;
}
#features .feature.ss h3 {
margin-top: 45px;
}
#features .feature .info h3 img {
margin-right: 18px;
position: relative;
top: -10px;
}
#features .feature .info p {
margin-top: 15px;
}
/* Pricing charts
-------------------------------------------------- */
#in_pricing{
margin-top: 30px;
margin-bottom: 100px;
}
#in_pricing .head h6{
font-size: 18px;
margin: 0;
color: #8E8E8F;
font-weight: normal;
}
#in_pricing .charts_wrapp{
margin-left: -20px;
margin-bottom: 40px;
}
#in_pricing .charts_wrapp .plan{
border-radius: 6px;
box-shadow: 2px 2px 2px -1px rgb(214, 214, 214);
background-color: #fff;
width: 95%;
position: relative;
}
#in_pricing .plan .wrapper{
padding: 33px 30px 26px 30px;
}
#in_pricing .plan h3{
color: rgb(83, 83, 83);
font-weight: normal;
font-style: italic;
font-size: 28px;
margin: 0 0 5px 0;
line-height: 25px;
}
#in_pricing .plan .price{
font-size: 17px;
color: #1189D9;
margin-top: 16px;
}
#in_pricing .plan .price span.dollar{
font-size: 32px;
position: relative;
top: -6px;
margin-right: 3px;
}
#in_pricing .plan .price span.qty{
font-size: 47px;
margin-right:4px;
position: relative;
top: 2px;
}
#in_pricing .plan .price span.month{
font-style: italic;
font-weight: 300;
font-size: 15px;
}
#in_pricing .plan .features{
margin-top: 30px;
}
#in_pricing .plan .features p{
color: #838385;
margin-bottom: 5px;
font-size: 14px;
}
#in_pricing .plan a.order{
background-color: #2190DB;
text-align: center;
margin: 25px auto 0;
width: 48%;
display: block;
padding: 3px 0;
color: #fff;
font-size: 13px;
font-weight: bold;
border-radius: 5px;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
}
#in_pricing .plan a.order:hover,
#in_pricing2 .plan a.order:hover{
background: #252528;
}
#in_pricing .pro .plan{
width: 100%;
top: -20px;
box-shadow: 0px 0px 7px -1px rgb(214, 214, 214);
border: 1px solid #d9d9d9;
}
#in_pricing .pro .plan .wrapper{
padding:36px 30px 35px 30px;
}
#in_pricing .pro .plan img.ribbon{
position: absolute;
top: 0;
right: 0;
}
#in_pricing .pro .plan a.order{
margin-top: 35px;
}
#in_pricing .standar .plan{
float: right;
}
#in_pricing .start{
width: 100%;
text-align: center;
}
#in_pricing .start p{
font-size: 24px;
display: inline-block;
color: #5B5B5D;
font-style: italic;
line-height: 26px;
margin: 0 18px 0 0;
}
#in_pricing .start a{
text-transform: uppercase;
color: #fff;
font-weight: bold;
border-radius: 4px;
padding: 7px 17px;
font-size: 17px;
background: #252528;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
}
#in_pricing .start a:hover{
background: #2190DB;
}
/* Call to Action
-------------------------------------------------- */
#call_action {
margin-top: 50px;
text-align: center;
}
#call_action p {
font-size: 24px;
color: #3F3F3F;
font-style: italic;
display: inline-block;
}
#call_action a {
background-color: #282828;
color: #fff;
padding: 9px 17px;
font-weight: bold;
border-radius: 4px;
font-size: 17px;
margin-left: 20px;
position: relative;
top: -5px;
-webkit-transition: background-color .2s linear;
-moz-transition: background-color .2s linear;
}
#call_action a:hover {
background-color: rgb(103, 118, 177);
}
#call_action a:active {
box-shadow: rgba(255,255,255,0.2) 0 1px 0,inset rgba(0,0,0,0.95) 0 1px 4px;
}
/* Clients
-------------------------------------------------- */
#clients {
margin-top: 75px;
}
#clients .client .img {
height: 76px;
width: 138px;
}
#clients .client .client1 {
background: url('../img/client1.png') 0 -75px;
}
#clients .client .client1:hover {
background-position: 1px 0px;
}
#clients .client .client2 {
background: url('../img/client2.png') 0 -75px;
}
#clients .client .client2:hover {
background-position: -1px 0px;
}
#clients .client .client3 {
background: url('../img/client3.png') 0 -76px;
}
#clients .client .client3:hover {
background-position: 0px 0px;
}
#clients .client .img{
cursor: pointer;
-webkit-transition: box-shadow .1s linear;
-moz-transition: box-shadow .1s linear;
transition: box-shadow .1s linear;
}
#clients .client .img:hover{
cursor: pointer;
/*box-shadow: 0px 0px 2px 0px rgb(155, 155, 155);*/
border-radius: 8px;
}
/* Responsive
-------------------------------------------------- */
/* Large desktop */
@media (min-width: 1200px) {
}
@media (min-width: 980px) {
}
@media (max-width: 979px) {
#showcase .features_op1_row .feature .img_box span.circle{
top: 35%;
}
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
#in_pricing .plan a.order{
width: 64%;
}
.slide .info h2,
.slide .info h2 * {
font-size: 30px !important;
}
.slide#responsive .info {
position: absolute;
top: 170px;
right: 6%;
width: 25%;
}
.slide#responsive .info
.slide#tour .info a {
font-size: 15px;
}
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#partner-slider,
#feature_slider {
display: none;
}
#showcase .features_op1_row .feature {
margin-bottom: 60px;
}
#showcase .features_op1_row .last{
margin-bottom: 0;
}
#showcase .features_op1_row .feature .img_box{
text-align: center;
}
#showcase .features_op1_row .feature .text h6{
text-align: center;
}
#showcase .features_op1_row .feature .img_box span.circle{
top: 38%;
left: 48%;
}
#showcase .features_op1_row .feature:hover .img_box{
box-shadow:none;
}
#in_pricing .charts_wrapp{
margin-left: 0;
}
#in_pricing .charts_wrapp .plan{
margin: 0 auto 30px;
width: 95%;
}
#in_pricing .plan .wrapper{
margin: 0 auto;
text-align: center;
}
#in_pricing .pro .plan{
top: 0;
width:95%;
}
#in_pricing .standar .plan{
float: none;
}
#in_pricing .start p{
margin-bottom: 20px;
}
#in_pricing .start a{
display: block;
width: 50%;
margin: 0 auto;
}
#clients .row{
text-align: center;
}
#clients .client{
text-align: center;
margin-bottom: 15px;
display: inline-block;
margin-right: 10px;
width: auto;
}
}
/* Landscape phones and down */
@media (max-width: 480px) {
#showcase .features_op1_row .feature {
margin-bottom: 60px;
}
#showcase .features_op1_row .last{
margin-bottom: 0;
}
#showcase .features_op1_row .feature .img_box{
text-align: center;
}
#showcase .features_op1_row .feature .text h6{
text-align: left;
}
#showcase .features_op1_row .feature .img_box span.circle{
left: 44%;
}
#showcase .features_op1_row .feature:hover .img_box{
box-shadow:none;
}
}

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,76 @@
/*
* jQuery FlexSlider v2.0
* http://www.woothemes.com/flexslider/
*
* Copyright 2012 WooThemes
* Free to use under the GPLv2 license.
* http://www.gnu.org/licenses/gpl-2.0.html
*
* Contributing author: Tyler Smith (@mbmufffin)
*/
/* Browser Resets */
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}
/* FlexSlider Necessary Styles
*********************************/
.flexslider {margin: 0; padding: 0;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {width: 100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;}
/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .slides {display: block;}
* html .slides {height: 1%;}
/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
* include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}
/* FlexSlider Default Theme
*********************************/
.flexslider {margin: 0 0 60px; background: #fff; border: 4px solid #fff; position: relative; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; box-shadow: 0 1px 4px rgba(0,0,0,.2); -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.2); -moz-box-shadow: 0 1px 4px rgba(0,0,0,.2); -o-box-shadow: 0 1px 4px rgba(0,0,0,.2); zoom: 1;}
.flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}
.loading .flex-viewport {max-height: 300px;}
.flexslider .slides {zoom: 1;}
.carousel li {margin-right: 5px}
/* Direction Nav */
.flex-direction-nav {*height: 0;}
.flex-direction-nav a {width: 30px; height: 30px; margin: -20px 0 0; display: block; background: url(../../img/bg_direction_nav.png) no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 0; -webkit-transition: all .3s ease;}
.flex-direction-nav .flex-next {background-position: 100% 0; right: -36px; }
.flex-direction-nav .flex-prev {left: -36px;}
.flexslider:hover .flex-next {opacity: 0.8; right: 5px;}
.flexslider:hover .flex-prev {opacity: 0.8; left: 5px;}
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity: 1;}
.flex-direction-nav .flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;}
/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center;}
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; box-shadow: inset 0 0 3px rgba(0,0,0,0.3);}
.flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); }
.flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; }
.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .flex-active {opacity: 1; cursor: default;}
@media screen and (max-width: 860px) {
.flex-direction-nav .flex-prev {opacity: 1; left: 0;}
.flex-direction-nav .flex-next {opacity: 1; right: 0;}
}

View File

@ -0,0 +1,62 @@
/**** Isotope Filtering ****/
.isotope-item {
z-index: 2;
}
.isotope-hidden.isotope-item {
pointer-events: none;
z-index: 1;
}
/**** Isotope CSS3 transitions ****/
.isotope,
.isotope .isotope-item {
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
-ms-transition-duration: 0.8s;
-o-transition-duration: 0.8s;
transition-duration: 0.8s;
}
.isotope {
-webkit-transition-property: height, width;
-moz-transition-property: height, width;
-ms-transition-property: height, width;
-o-transition-property: height, width;
transition-property: height, width;
}
.isotope .isotope-item {
-webkit-transition-property: -webkit-transform, opacity;
-moz-transition-property: -moz-transform, opacity;
-ms-transition-property: -ms-transform, opacity;
-o-transition-property: -o-transform, opacity;
transition-property: transform, opacity;
}
/**** disabling Isotope CSS3 transitions ****/
.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
-webkit-transition-duration: 0s;
-moz-transition-duration: 0s;
-ms-transition-duration: 0s;
-o-transition-duration: 0s;
transition-duration: 0s;
}
/* End: Recommended Isotope styles */
/* disable CSS transitions for containers with infinite scrolling*/
.isotope.infinite-scrolling {
-webkit-transition: none;
-moz-transition: none;
-ms-transition: none;
-o-transition: none;
transition: none;
}

View File

@ -0,0 +1,110 @@
#portfolio_tem{
margin-top: 70px;
}
#portfolio_tem .left_box{
margin-left: 0;
}
#portfolio_tem .left_box .big{
margin-bottom: 40px;
position: relative;
height: 431px;
}
#portfolio_tem .left_box .big img{
position: absolute;
border-radius: 5px;
}
#portfolio_tem .thumbs .thumb{
float: left;
position: relative;
margin-right: 30px;
cursor: pointer;
margin-bottom: 10px;
}
#portfolio_tem .thumbs .thumb.last{
margin: 0;
}
#portfolio_tem .thumbs .thumb:hover .mask {
display: block;
opacity: 1;
filter: alpha(opacity = 100);
}
#portfolio_tem .thumbs .thumb .mask {
position: absolute;
opacity: 0;
filter: alpha(opacity = 0);
box-shadow: 0px 1px 6px 2px #b1b1b1;
top: 0px;
left: 0px;
border-radius: 5px;
height: 100%;
width: 100%;
background: rgba(17, 137, 217, 0.5);
-webkit-transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-in-out;
}
#portfolio_tem .thumbs .thumb .mask .more {
color: #fff;
font-size: 30px;
font-weight: bold;
position: absolute;
bottom: 40%;
left: 43%;
}
#portfolio_tem .right_box{
float: right;
margin-top: 14px;
}
#portfolio_tem .right_box h2{
font-size: 28px;
line-height: 27px;
margin: 0 0 25px 0;
}
#portfolio_tem .right_box p{
font-size: 14px;
line-height: 24px;
margin-bottom: 18px;
color: #3F3F3F;
}
/* Responsive
-------------------------------------------------- */
/* Large desktop */
@media (min-width: 1200px) {
}
@media (min-width: 980px) {
}
@media (max-width: 979px) {
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
#portfolio_tem .left_box .big{
height: 372px;
}
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#portfolio_tem .left_box{
margin-bottom: 50px;
}
#portfolio_tem .left_box .thumbs{
overflow: hidden;
}
}
/* Landscape phones and down */
@media (max-width: 480px) {
#portfolio_tem .left_box .big {
max-height: 350px;
}
#portfolio_tem .left_box .big img {
margin-bottom: 10px;
max-height: 350px;
}
#portfolio_tem .thumbs .thumb{
margin-right: 5px;
}
}

View File

@ -0,0 +1,124 @@
#portfolio {
margin-top: 60px;
}
#portfolio #filters {
list-style-type: none;
height: 30px;
margin-bottom: 40px;
text-align: center;
margin-top: -20px;
}
#portfolio #filters li {
display: inline-block;
font-size: 20px;
margin: 0px 6px;
}
#portfolio #filters li.separator {
color: #c0c0c0;
font-weight: lighter;
}
#portfolio #filters li a {
color: #3f3f3f;
font-style: italic;
-webkit-transition: color .2s;
-moz-transition: color .2s;
-ms-transition: color .2s;
transition: color .2s;
}
#portfolio #filters li a:hover,
#portfolio #filters li a.active {
color: #1189d9;
}
#portfolio #gallery_container {
margin-bottom: 50px;
}
#portfolio #gallery_container .photo {
width: 285px;
margin: 5px;
float: left;
position: relative;
}
#portfolio #gallery_container .photo:hover .mask {
display: block;
opacity: 1;
filter: alpha(opacity = 100);
}
#portfolio #gallery_container .photo img { }
#portfolio #gallery_container .photo .mask {
position: absolute;
opacity: 0;
filter: alpha(opacity = 0);
box-shadow: 0px 1px 6px 2px #b1b1b1;
top: 0px;
left: 0px;
border-radius: 5px;
height: 100%;
padding: 0px 20px;
width: 245px;
background: rgba(17, 137, 217, 0.5);
-webkit-transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-in-out;
}
#portfolio #gallery_container .photo .mask h3 {
color: #fff;
font-size: 22px;
position: relative;
top: 39%;
}
#portfolio #gallery_container .photo .mask small {
color: rgb(240, 240, 240);
font-size: 15px;
font-style: italic;
position: relative;
top: 35%;
display: block;
}
#portfolio #gallery_container .photo .mask .more {
color: #fff;
font-size: 30px;
font-weight: bold;
position: absolute;
bottom: 7%;
left: 47%;
}
/* Responsive
-------------------------------------------------- */
/* Large desktop */
@media (min-width: 1200px) {
}
@media (min-width: 980px) {
}
@media (max-width: 979px) {
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
}
/* Landscape phones and down */
@media (max-width: 480px) {
#portfolio #filters li{
margin: 0px 4px;
}
#portfolio #filters li a{
font-size: 18px;
}
#portfolio #gallery_container .photo{
margin-left: 35px;
}
#portfolio #gallery_container .photo img{
left: 10%;
}
}

View File

@ -0,0 +1,285 @@
/*Pricing Option 1*/
#in_pricing{
margin-bottom: 100px;
margin-top: 70px;
}
#in_pricing .head{
text-align: center;
margin-bottom: 70px;
}
#in_pricing .head h3{
font-size: 35px;
font-style: italic;
font-weight: normal;
margin: 0 0 20px 0;
color: #252528;
}
#in_pricing .head h6{
font-size: 18px;
margin: 0;
color: #8E8E8F;
font-weight: normal;
}
#in_pricing .charts_wrapp,
#in_pricing2 .charts_wrapp{
margin-left: -20px;
margin-bottom: 40px;
}
#in_pricing .charts_wrapp .plan,
#in_pricing2 .charts_wrapp .plan{
border-radius: 6px;
box-shadow: 2px 2px 2px -1px rgb(214, 214, 214);
background-color: #fff;
width: 95%;
position: relative;
}
#in_pricing .plan .wrapper,
#in_pricing2 .plan .wrapper{
padding: 33px 30px 26px 30px;
}
#in_pricing .plan h3,
#in_pricing2 .plan h3 {
color: rgb(83, 83, 83);
font-weight: normal;
font-style: italic;
font-size: 28px;
margin: 0 0 5px 0;
line-height: 25px;
}
#in_pricing .plan .price,
#in_pricing2 .plan .price {
font-size: 17px;
color: #1189D9;
margin-top: 16px;
}
#in_pricing .plan .price span.dollar,
#in_pricing2 .plan .price span.dollar {
font-size: 32px;
position: relative;
top: -6px;
margin-right: 3px;
}
#in_pricing .plan .price span.qty,
#in_pricing2 .plan .price span.qty {
font-size: 47px;
margin-right:4px;
position: relative;
top: 2px;
}
#in_pricing .plan .price span.month{
font-style: italic;
font-weight: 300;
font-size: 15px;
}
#in_pricing .plan .features,
#in_pricing2 .plan .features {
margin-top: 30px;
}
#in_pricing .plan .features p,
#in_pricing2 .plan .features p {
color: #838385;
margin-bottom: 5px;
font-size: 14px;
}
#in_pricing .plan a.order,
#in_pricing2 .plan a.order {
background-color: #2190DB;
text-align: center;
margin: 25px auto 0;
width: 48%;
display: block;
padding: 3px 0;
color: #fff;
font-size: 13px;
font-weight: bold;
border-radius: 5px;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
}
#in_pricing .plan a.order:hover,
#in_pricing2 .plan a.order:hover{
background: #252528;
}
#in_pricing .pro .plan{
width: 100%;
top: -20px;
box-shadow: 0px 0px 7px -1px rgb(214, 214, 214);
border: 1px solid #d9d9d9;
}
#in_pricing .pro .plan .wrapper{
padding:36px 30px 35px 30px;
}
#in_pricing .pro .plan img.ribbon{
position: absolute;
top: 0;
right: 0;
}
#in_pricing .pro .plan a.order{
margin-top: 35px;
}
#in_pricing .standar .plan{
float: right;
}
#in_pricing .start{
width: 100%;
text-align: center;
}
#in_pricing .start p{
font-size: 24px;
display: inline-block;
color: #5B5B5D;
font-style: italic;
line-height: 26px;
margin: 0 18px 0 0;
}
#in_pricing .start a{
text-transform: uppercase;
color: #fff;
font-weight: bold;
border-radius: 4px;
padding: 7px 17px;
font-size: 17px;
background: #252528;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
}
#in_pricing .start a:hover{
background: #2190DB;
}
/*Frequent Questions*/
#faq{
margin-bottom: 50px;
}
#faq .block .box{
margin-bottom: 50px;
}
#faq .block .box p.title{
font-size: 20px;
margin-bottom: 10px;
font-style: italic;
}
#faq .block .box p.answ{
font-size: 14px;
line-height: 22px;
}
#faq .right{
float: right;
}
/* Pricing Option 2 */
#in_pricing2{
margin-bottom: 40px;
}
#in_pricing2 .section_header h3 span{
font-size: 18px;
line-height: 20px;
}
#in_pricing2 .charts_wrapp .plan{
width: 100%;
}
#in_pricing2 .plan a.order{
width: 66%;
}
#in_pricing2 .plan .price span.month{
font-weight: bold;
font-size: 17px;
}
#in_pricing2 .ultra .plan{
top: -13px;
box-shadow: 0px 0px 7px -1px rgb(214, 214, 214);
border: 1px solid #d9d9d9;
}
#in_pricing2 .ultra .plan .wrapper img.ribbon{
position: absolute;
right: 0;
top: 0;
}
#in_pricing2 .black .plan{
background: #252528;
box-shadow: none;
}
#in_pricing2 .black .plan .wrapper{
padding: 38px 30px 31px 30px;
}
#in_pricing2 .black .plan h3{
color: #fff;
}
#in_pricing2 .black .plan h6{
color: #fff;
font-size: 20px;
font-weight: normal;
font-style: italic;
}
#in_pricing2 .black .plan p{
font-size: 16px;
color: rgb(173, 173, 173);
margin: 20px 0 38px;
line-height: 23px;
}
#in_pricing2 .black a.order{
background: #535356;
color: #fff;
width: 87%;
padding: 6px 0;
}
#in_pricing2 .black a.order:hover{
background: #2190DB;
}
/* Responsive
-------------------------------------------------- */
/* Large desktop */
@media (min-width: 1200px) {
}
@media (min-width: 980px) {
}
@media (max-width: 979px) {
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
#in_pricing .plan a.order, #in_pricing2 .plan a.order{
width: 64%;
}
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#in_pricing .charts_wrapp, #in_pricing2 .charts_wrapp{
margin-left: 0;
}
#in_pricing .charts_wrapp .plan, #in_pricing2 .charts_wrapp .plan{
margin: 0 auto 30px;
width: 95%;
}
#in_pricing .plan .wrapper,
#in_pricing2 .plan .wrapper{
margin: 0 auto;
text-align: center;
}
#in_pricing .pro .plan{
top: 0;
width:95%;
}
#in_pricing .standar .plan{
float: none;
}
#in_pricing .start p{
margin-bottom: 20px;
}
#in_pricing .start a{
display: block;
width: 50%;
margin: 0 auto;
}
#in_pricing2 .ultra .plan{
top: 0;
}
}
/* Landscape phones and down */
@media (max-width: 480px) {
}

View File

@ -0,0 +1,100 @@
.reset_page .box_wrapper p.already{
text-align: center;
font-style: 15px;
color: #454B52;
}
.reset_page .box_wrapper p.already a{
color: #454B52;
margin-left: 3px;
}
.reset_page .box{
background-color: white;
border-radius: 6px;
float: none;
margin: 60px auto 0;
padding-bottom: 26px;
width: 38%;
margin-bottom: 25px;
box-shadow: 2px 2px 3px 0px #DEDDDD;
}
.reset_page .box .head{
background-color: #faf9f9;
border-radius: 4px 4px 1px 0;
display: inline-block;
margin-bottom: 37px;
padding: 25px 0 25px;
text-align: center;
width: 100%;
box-shadow: inset 2px 2px 3px 0px white;
}
.reset_page .box .head h4{
color: #333;
font-size: 16px;
margin: 0px;
text-shadow: 1px 1px 1px white;
}
.reset_page .box .head .line {
height: 3px;
border-top: 1px solid #ebebeb;
border-bottom: 1px solid #ebebeb;
position: relative;
top: 30px;
}
.reset_page .box .form{
margin: 0 auto;
text-align: center;
width: 83%;
}
.reset_page .box .form input[type="text"]{
border-color: #DBDBDB #EAEAEA #EAEAEA #DBDBDB;
border-left: 1px solid #DBDBDB;
border-style: solid;
border-width: 1px;
font-size: 16px;
height: 30px;
margin-bottom: 35px;
width: 95%;
}
.reset_page .box .form input[type="submit"]{
border-color: #CCCCCC;
border-radius: 7px 7px 7px 7px;
color: #394350;
font-size: 15px;
font-weight: bold;
padding: 5px 18px;
}
.reset_page form{
margin: 0px;
}
.reset_page .already a {
text-decoration: underline;
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
.reset_page .box{
width: 54%;
}
}
@media (max-width: 979px) {
.reset_page .box{
width: 48%;
}
}
@media (min-width: 980px) {
.reset_page .box{
width: 40%;
}
}
@media (max-width: 480px) {
.reset_page .box{
width: 100%;
}
}

View File

@ -0,0 +1,265 @@
/*Service Option 1*/
#service_1{
margin-top: 70px;
margin-bottom: 115px;
}
#service_1 .section_header h3 span,
#service_2 .section_header h3 span{
font-size: 18px;
line-height: 20px;
}
#service_1 .service_wrapper .feature{
margin-right: 0px;
}
#service_1 .service_wrapper .last{
margin-right: 0;
}
#service_1 .service_wrapper .feature .text{
margin: 23px auto 0;
width: 92%;
}
#service_1 .service_wrapper .feature .text h6{
color: #3F3F3F;
margin: 0 0 14px 0;
font-size: 20px;
}
#service_1 .service_wrapper .feature .text p{
margin: 0;
font-size: 14px;
line-height: 22px;
}
#service_1 .service_wrapper .feature .img_box{
position: relative;
border-radius: 5px;
}
#service_1 .service_wrapper .feature .img_box img {
border-radius: 6px;
position: relative;
}
#service_1 .service_wrapper .feature .img_box span.circle{
background: rgba(17, 137, 217, 0.8);
width: 48px;
height: 48px;
display: none;
text-align: center;
position: absolute;
top: 37%;
left: 43%;
border-radius: 100%;
}
#service_1 .service_wrapper .feature .img_box span.circle span.plus{
display: inline-block;
margin-top: 13px;
font-weight: bold;
color: white;
font-size: 32px;
}
#service_1 .service_wrapper .feature:hover span.circle{
display: block;
}
#service_1 .service_wrapper .feature:hover .img_box{
box-shadow: 0px 0px 1px 100px black inset;
}
#service_1 .service_wrapper .feature:hover img{
box-shadow: 1px 1px 6px 0px #888;
border-radius: 5px;
opacity: 0.9;
filter:alpha(opacity=90);
}
/*Service Option 2*/
#service_2{
margin: 40px 0 115px;
}
#service_2 .perk{
margin-bottom: 82px;
margin-left: 0;
}
#service_2 .circle{
background: #1189D9;
text-align: center;
border-radius: 100%;
margin: 14px 0 0 0;
width: 136px;
height: 136px;
box-shadow: 1px 1px 2px 0px #E0E0E0;
}
#service_2 .circle img{
margin-top: 42px;
}
#service_2 .circle1 img{
margin-top:49px;
}
#service_2 .description_wrapper{
float: right;
}
#service_2 .description_wrapper h5{
font-size: 20px;
margin: 5px 0 10px 0;
}
#service_2 .description_wrapper p{
font-size: 14px;
line-height: 24px;
color: #3F3F3F;
margin-bottom: 0;
}
#service_2 .last{
margin-bottom: 0;
}
/*Service Option 3*/
#process{
min-height: 350px;
}
#process .section_header h3{
margin:0;
}
#process .description{
position: relative;
}
#process .description .text{
position: absolute;
display: none;
}
#process .description .text.active {
display: block;
}
#process .description h4{
font-size: 32px;
line-height: 35px;
font-weight: normal;
margin-bottom: 20px;
}
#process .description p{
font-size: 15px;
color: #3F3F3F;
line-height: 26px;
}
#process .areas{
margin-left: 0;
float: right;
}
#process .areas .circle{
height: 210px;
cursor: pointer;
float: left;
margin-right: -45px;
text-align: center;
width: 210px;
background: rgba(37, 37, 40, 0.9);
border-radius: 100%;
-webkit-transition: all .3s;
-moz-transition: all .3s;
-ms-transition: all .3s;
transition: all .3s;
}
#process .areas .first{
margin-left: 0;
}
#process .areas .circle img{
margin-top: 56px;
}
#process .areas .circle span{
font-weight: 700;
font-size: 22px;
color: #fff;
display: block;
margin-top: 21px;
}
#process .areas .circle:hover,
#process .areas .circle.active {
background: rgba(17, 137, 217, 1);
}
/* Responsive
-------------------------------------------------- */
/* Large desktop */
@media (min-width: 1200px) {
}
@media (min-width: 980px) {
}
@media (max-width: 979px) {
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
#service_2 .description_wrapper{
width: 77%;
}
#process .areas{
text-align: center;
}
#team .people .bio_box .info{
margin: 0;
float: none;
}
#process .areas .last_circle{
float: none;
display: inline-block;
margin-left: -75px;
margin-top: -54px;
}
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#service_1 .service_wrapper .feature .img_box{
text-align: center;
}
#service_1 .service_wrapper .feature:hover .img_box{
box-shadow: none;
}
#service_1 .service_wrapper .feature{
text-align: center;
margin-bottom: 60px;
}
#service_2 .perk{
text-align: center;
margin-bottom: 70px;
}
#service_2 .circle{
float: none;
margin-bottom: 20px;
display: inline-block;
}
#service_2 .description_wrapper h5{
margin-bottom: 15px;
}
#process .areas{
margin-top: 193px;
margin-bottom: 0px;
text-align: center;
}
#process .areas .circle{
float: none;
display: inline-block;
margin: 0;
}
#process .areas .last_circle{
margin-top: -23px;
}
}
/* Landscape phones and down */
@media (max-width: 480px) {
#service_1 .service_wrapper .feature .img_box{
width: 100%;
}
#service_1 .service_wrapper .feature .text p{
text-align: left;
}
#process .areas{
margin-top: 250px;
}
#process .areas .circle{
width: 100px;
height: 100px;
}
#process .areas .last_circle{
margin-top: 0;
}
#process .areas .circle img{
margin-top: 22px;
}
#process .areas .circle span{
display: none;
}
}

View File

@ -0,0 +1,512 @@
/* Sign In Option 1 */
#sign_in1{
background: url("../img/backgrounds/aqua.jpg") no-repeat;
display: block;
height: 540px;
margin-bottom: 90px;
margin-top: -35px;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#sign_in1 .header{
text-align: center;
margin: 0;
color: #fff;
margin-top: 85px;
padding-left: 20px;
}
#sign_in1 .header h4{
font-size: 38px;
margin-top: 0;
margin-bottom: 25px;
line-height: 38px;
font-weight: 300;
text-shadow: 1px 1px 0px #143C4E;
}
#sign_in1 .header p{
font-style: italic;
font-size: 17px;
margin: 0 0 40px 0;
}
#sign_in1 .header .social{
margin: 0 auto 28px;
float: none;
text-align: center;
}
#sign_in1 .header .social a.circle{
text-align: center;
width: 56px;
height: 56px;
border-radius: 100%;
margin-right: 25px;
display: inline-block;
-webkit-transition: border-color ease-in .1s;
-moz-transition: border-color ease-in .1s;
-o-transition: border-color ease-in .1s;
transition: border-color ease-in .1s;
}
#sign_in1 .header .social a.circle img{
display: inline-block;
margin-top: 15px;
}
#sign_in1 .header .social a.facebook{
border:2px solid #233678;
background: #233678;
}
#sign_in1 .header .social a.twitter{
border:2px solid #54AEE1;
background: #54AEE1;
}
#sign_in1 .header .social a.gplus{
border:2px solid #292929;
background: #292929;
margin: 0;
}
#sign_in1 .header .social a.circle:hover{
border-color: rgb(255, 255, 255);
}
#sign_in1 .division{
margin: 0 auto 50px;
float: none;
left: -6px;
overflow: hidden;
position: relative;
text-align: center;
}
#sign_in1 .division .line{
border-top: 1px solid rgb(104, 167, 196);
width: 34%;
top: 10px;
position: absolute;
}
#sign_in1 .division .l{
left: 0;
}
#sign_in1 .division .r{
right: 0;
}
#sign_in1 .division span{
color: #fff;
font-size: 17px;
}
#sign_in1 .proof{
display: block;
overflow: hidden;
margin: 0 auto;
width: 78%;
float: none;
}
#sign_in1 .footer{
text-align: center;
margin-left: 0;
}
#sign_in1 .footer form{
margin: 0 0 46px 0;
}
#sign_in1 .footer input[type="text"],
#sign_in1 .footer input[type="password"] {
border-radius: 3px;
font-size: 16px;
height: 25px;
margin: 0 10px 0px 0;
color: black;
width: 31%;
}
#sign_in1 .footer input[type="submit"]{
text-transform: uppercase;
color: #fff;
background: #187CCC;
font-size: 15px;
padding: 8px 18px;
border: 0 none;
border-radius: 3px;
-webkit-transition: background linear .2s, box-shadow linear .2s;
-moz-transition: background linear .2s, box-shadow linear .2s;
-o-transition: background linear .2s, box-shadow linear .2s;
transition: background linear .2s, box-shadow linear .2s;
}
#sign_in1 .footer input[type="submit"]:hover{
background: #252528;
}
#sign_in1 .remember{
margin: 0;
}
#sign_in1 .remember label.checkbox{
float: left;
font-weight: bold;
width: 30%;
font-size: 14px;
color: #fff;
}
#sign_in1 .remember a{
color: #fff;
font-size: 14px;
border-bottom: 1px solid white;
font-weight: bold;
-webkit-transition: all .2s;
-moz-transition: all .2s;
-ms-transition: all .2s;
transition: all .2s;
}
#sign_in1 .dosnt{
text-align: center;
color: #fff;
float: right;
font-size: 14px;
margin: 0 18px 0 0;
}
#sign_in1 .dosnt span{
margin-right: 8px;
}
#sign_in1 .dosnt a{
color: #fff;
border-bottom: 1px solid white;
-webkit-transition: all .2s;
-moz-transition: all .2s;
-ms-transition: all .2s;
transition: all .2s;
}
#sign_in1 .dosnt a:hover,
#sign_in1 .remember a:hover{
color:#252528;
border-color: #252528;
}
/* Sign In Option 2 */
#sign_in2 .section_header{
margin-bottom: 50px;
}
#sign_in2 .section_header h3{
margin: 0;
}
#sign_in2 .section_header h3 span{
font-size: 18px;
line-height: 20px;
}
#sign_in2 .left_box{
color: #252527;
}
#sign_in2 .left_box h4{
margin: 20px 0 40px 0;
line-height: 43px;
font-size: 40px;
font-weight: 300;
}
#sign_in2 .left_box .perk_box{
float: left;
width: 100%;
}
#sign_in2 .left_box .perk_box .perk{
width: 100%;
color: #727276;
margin-bottom: 31px;
}
#sign_in2 .left_box .perk_box .perk .icos{
float: left;
margin-right: 16px;
width: 28px;
height: 46px;
}
#sign_in2 .left_box .perk_box .perk .ico1{
background-position: 4px 6px;
}
#sign_in2 .left_box .perk_box .perk .ico2{
background-position: -35px 14px;
}
#sign_in2 .left_box .perk_box .perk .ico3{
background-position: -69px 7px;
}
#sign_in2 .left_box .perk_box .perk p{
font-size: 15px;
}
#sign_in2 .left_box .perk_box .perk p strong{
color: #333;
}
#sign_in2 a.btn_sign{
text-transform: uppercase;
color: #FDFDFD;
font-size: 15px;
border-radius: 4px;
background: #333333;
font-weight: bold;
text-align: center;
margin: 0 auto;
width: 25%;
display: block;
padding: 6px 0 6px;
-webkit-transition: background linear .2s, box-shadow linear .2s;
-moz-transition: background linear .2s, box-shadow linear .2s;
-o-transition: background linear .2s, box-shadow linear .2s;
transition: background linear .2s, box-shadow linear .2s;
}
#sign_in2 a.btn_sign:hover{
background: #252528;
}
#sign_in2 .icos{
background: url('../img/signin_icos.png') no-repeat;
width: 96px;
height: 30px;
}
#sign_in2 .signin_box{
float: right;
}
#sign_in2 .signin_box .box{
float: right;
box-shadow: 0 0 5px 0 rgb(238, 238, 238);
background: white;
border:1px solid #DFDFDF;
border-radius: 5px;
width: 90%;
padding: 35px 0 30px;
}
#sign_in2 .signin_box .box .box_cont{
margin: 0 auto;
width: 77%;
}
#sign_in2 .signin_box .box .social{
margin: 0 auto 20px;
float: none;
text-align: center;
}
#sign_in2 .signin_box .box .social a.circle{
text-align: center;
width: 56px;
height: 56px;
border-radius: 100%;
margin-right:34px;
display: inline-block;
-webkit-transition: border-color ease-in .1s;
-moz-transition: border-color ease-in .1s;
-o-transition: border-color ease-in .1s;
transition: border-color ease-in .1s;
}
#sign_in2 .signin_box .box .social a.circle img{
display: inline-block;
margin-top: 15px;
}
#sign_in2 .signin_box .box .social a.facebook{
background: #233678;
border:2px solid #233678;
}
#sign_in2 .signin_box .box .social a.twitter{
background: #54AEE1;
border:2px solid #54AEE1;
}
#sign_in2 .signin_box .box .social a.gplus{
background: #292929;
border:2px solid #292929;
margin: 0;
}
#sign_in2 .signin_box .box .social a.circle:hover{
border-color: rgba(0,0,0,0.7);
}
#sign_in2 .signin_box .box .division{
margin: 0 auto 18px;
float: none;
overflow: hidden;
width: 100%;
position: relative;
text-align: center;
}
#sign_in2 .signin_box .box .division .line{
border-top: 1px solid #DFDFDF;
width: 34%;
top: 10px;
position: absolute;
}
#sign_in2 .signin_box .box .division .l{
left: 0;
}
#sign_in2 .signin_box .box .division .r{
right: 0;
}
#sign_in2 .signin_box .box .division span{
color: rgb(66, 66, 66);
font-size: 17px;
}
#sign_in2 .signin_box .box .form form{
margin: 0;
}
#sign_in2 .signin_box .box .form input[type="text"]{
border-radius: 3px;
font-size: 16px;
width: 96%;
margin-bottom: 16px;
height: 27px;
color: black;
}
#sign_in2 .signin_box .box .form .forgot{
margin-left: 0;
margin-bottom: 20px;
width: 100%;
color: #797979;
text-align: center;
overflow: hidden;
}
#sign_in2 .signin_box .box .form .forgot span{
margin-right: 5px;
}
#sign_in2 .signin_box .box .form .forgot a{
color: #797979;
font-size: 13px;
border-bottom: 1px solid #797979;
font-weight: bold;
-webkit-transition: color .2s;
-moz-transition: color .2s;
-ms-transition: color .2s;
transition: color .2s;
}
#sign_in2 .signin_box .box .form .forgot a:hover{
color: #187CCC;
border-color: #187CCC;
}
#sign_in2 .signin_box .box .form input[type="submit"]{
text-transform: uppercase;
color: #fff;
background: #187CCC;
font-size: 15px;
margin: 0 auto;
display: block;
padding: 6px 19px;
border: 0 none;
border-radius: 3px;
-webkit-transition: background linear .2s, box-shadow linear .2s;
-moz-transition: background linear .2s, box-shadow linear .2s;
-o-transition: background linear .2s, box-shadow linear .2s;
transition: background linear .2s, box-shadow linear .2s;
}
#sign_in2 .signin_box .box .form input[type="submit"]:hover{
background: #252528;
}
/* Responsive
-------------------------------------------------- */
/* Large desktop */
@media (min-width: 1200px) {
}
@media (min-width: 980px) {
}
@media (max-width: 979px) {
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
#sign_in1 .header .social{
width: 35%;
}
#sign_in1 .footer input[type="text"],
#sign_in1 .footer input[type="password"]{
width: 25%;
}
#sign_in1 .remember{
width: 60%;
}
#sign_in1 .dosnt{
width: auto;
}
#sign_in2 .left_box .perk_box .perk .icos{
height: 66px;
}
#sign_in2 .signin_box .box .social a.circle{
margin-right: 10px;
}
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#sign_in1{
background: none;
height: auto;
}
#sign_in1 .header h4{
color: #333;
line-height: 35px;
text-shadow:none;
}
#sign_in1 .header p{
line-height: 24px;
}
#sign_in1 .header p,
#sign_in1 .division span{
color: #333;
}
#sign_in1 .division .line{
border-color: #333;
}
#sign_in1 .footer input[type="text"],
#sign_in1 .footer input[type="password"]{
font-size: 13px;
width: 97%;
margin-bottom: 12px;
}
#sign_in1 .footer input[type="submit"]{
margin: 10px auto 0;
display: block;
}
#sign_in1 .proof{
width: 100%;
}
#sign_in1 .remember{
width: 60%;
overflow: hidden;
margin: 0 0 12px 0;
}
#sign_in1 .remember a{
color: #333;
float: left;
border-color: #333;
}
#sign_in1 .remember label.checkbox{
margin-right: 15px;
color: #333;
margin-bottom: 0;
width: 100px;
}
#sign_in1 .dosnt{
float: left;
margin: 0 0 0 22px;
}
#sign_in1 .dosnt span{
margin-left: 0;
margin-right: 20px;
}
#sign_in1 .dosnt span,
#sign_in1 .dosnt a{
color: #333;
border-color: #333;
float: left;
}
#sign_in1 .dosnt a{
float: left;
}
#sign_in1 .dosnt a:hover{
color: #187CCC;
border-color: #187CCC;
}
#sign_in2 .left_box h4{
text-align: center;
margin-bottom: 30px;
}
#sign_in2 .left_box{
overflow: hidden;
margin-bottom: 70px;
}
#sign_in2 .signin_box{
float: none;
}
#sign_in2 .signin_box .box{
float: none;
margin: 0 auto;
width: 100%;
}
}
/* Landscape phones and down */
@media (max-width: 480px) {
#sign_in1 .remember{
width: 100%;
}
}

View File

@ -0,0 +1,462 @@
/* Sign Up Option 1 */
#sign_up1{
background: url("../img/backgrounds/ocean.jpg") no-repeat;
display: block;
height: 540px;
margin-bottom: 90px;
margin-top: -35px;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#sign_up1 .header{
text-align: center;
margin: 0;
color: #fff;
margin-top: 85px;
padding-left: 20px;
}
#sign_up1 .header h4{
font-size: 38px;
margin-top: 0;
margin-bottom: 25px;
line-height: 38px;
font-weight: 300;
text-shadow: 1px 1px 0px #143C4E;
}
#sign_up1 .header p{
font-style: italic;
font-size: 17px;
margin: 0 0 40px 0;
}
#sign_up1 .header .social{
margin: 0 auto 28px;
float: none;
text-align: center;
}
#sign_up1 .header .social a.circle{
text-align: center;
width: 56px;
height: 56px;
border-radius: 100%;
margin-right: 25px;
display: inline-block;
-webkit-transition: border-color ease-in .1s;
-moz-transition: border-color ease-in .1s;
-o-transition: border-color ease-in .1s;
transition: border-color ease-in .1s;
}
#sign_up1 .header .social a.circle img{
display: inline-block;
margin-top: 15px;
}
#sign_up1 .header .social a.facebook{
border:2px solid #233678;
background: #233678;
}
#sign_up1 .header .social a.twitter{
border:2px solid #54AEE1;
background: #54AEE1;
}
#sign_up1 .header .social a.gplus{
border:2px solid #292929;
background: #292929;
margin: 0;
}
#sign_up1 .header .social a.circle:hover{
border-color: rgb(255, 255, 255);
}
#sign_up1 .division{
margin: 0 auto 50px;
float: none;
left: -6px;
overflow: hidden;
position: relative;
text-align: center;
}
#sign_up1 .division .line{
border-top: 1px solid rgb(104, 167, 196);
width: 34%;
top: 10px;
position: absolute;
}
#sign_up1 .division .l{
left: 0;
}
#sign_up1 .division .r{
right: 0;
}
#sign_up1 .division span{
color: #fff;
font-size: 17px;
}
#sign_up1 .footer form{
margin: 0 0 46px 0;
}
#sign_up1 .footer input[type="text"],
#sign_up1 .footer input[type="password"] {
border-radius: 3px;
font-size: 16px;
height: 25px;
margin: 0 10px 0px 0;
color: black;
width: 27%;
}
#sign_up1 .footer input[type="submit"]{
text-transform: uppercase;
color: #fff;
background: #187CCC;
font-size: 15px;
padding: 8px 18px;
border: 0 none;
border-radius: 3px;
-webkit-transition: background linear .2s, box-shadow linear .2s;
-moz-transition: background linear .2s, box-shadow linear .2s;
-o-transition: background linear .2s, box-shadow linear .2s;
transition: background linear .2s, box-shadow linear .2s;
}
#sign_up1 .footer input[type="submit"]:hover{
background: #252528;
}
#sign_up1 .remember label.checkbox{
float: left;
font-weight: bold;
width: 30%;
font-size: 14px;
color: #fff;
}
#sign_up1 .remember a{
color: #fff;
font-size: 14px;
border-bottom: 1px solid white;
font-weight: bold;
}
#sign_up1 .dosnt{
text-align: center;
color: #fff;
font-size: 14px;
}
#sign_up1 .dosnt span{
margin-right: 8px;
}
#sign_up1 .dosnt a{
color: #fff;
border-bottom: 1px solid white;
}
#sign_up1 .dosnt a:hover,
#sign_up1 .remember a:hover{
color:#252528;
border-color: #252528;
-webkit-transition: all .2s;
-moz-transition: all .2s;
-ms-transition: all .2s;
transition: all .2s;
}
/* Sign Up Option 2 */
#sign_up2 .section_header{
margin-bottom: 50px;
}
#sign_up2 .section_header h3{
margin: 0;
}
#sign_up2 .section_header h3 span{
font-size: 18px;
line-height: 20px;
}
#sign_up2 .left_box{
color: #252527;
}
#sign_up2 .left_box h4{
margin: 20px 0 40px 0;
line-height: 43px;
font-size: 40px;
font-weight: 300;
}
#sign_up2 .left_box .perk_box{
float: left;
width: 100%;
}
#sign_up2 .left_box .perk_box .perk{
width: 100%;
color: #727276;
margin-bottom: 31px;
}
#sign_up2 .left_box .perk_box .perk .icos{
float: left;
margin-right: 16px;
width: 28px;
height: 46px;
}
#sign_up2 .left_box .perk_box .perk .ico1{
background-position: 4px 6px;
}
#sign_up2 .left_box .perk_box .perk .ico2{
background-position: -35px 14px;
}
#sign_up2 .left_box .perk_box .perk .ico3{
background-position: -69px 7px;
}
#sign_up2 .left_box .perk_box .perk p{
font-size: 15px;
}
#sign_up2 .left_box .perk_box .perk p strong{
color: #333;
}
#sign_up2 a.btn_sign{
text-transform: uppercase;
color: #FDFDFD;
font-size: 15px;
border-radius: 4px;
background: #333333;
font-weight: bold;
text-align: center;
margin: 0 auto;
width: 25%;
display: block;
padding: 6px 0 6px;
-webkit-transition: background linear .2s, box-shadow linear .2s;
-moz-transition: background linear .2s, box-shadow linear .2s;
-o-transition: background linear .2s, box-shadow linear .2s;
transition: background linear .2s, box-shadow linear .2s;
}
#sign_up2 a.btn_sign:hover{
background: #252528;
}
#sign_up2 .icos{
background: url('../img/signin_icos.png') no-repeat;
width: 96px;
height: 30px;
}
#sign_up2 .signin_box{
float: right;
}
#sign_up2 .signin_box .box{
float: right;
box-shadow: 0 0 5px 0 rgb(238, 238, 238);
background: white;
border:1px solid #DFDFDF;
border-radius: 5px;
width: 90%;
padding: 35px 0 30px;
}
#sign_up2 .signin_box .box .box_cont{
margin: 0 auto;
width: 77%;
}
#sign_up2 .signin_box .box .social{
margin: 0 auto 20px;
float: none;
text-align: center;
}
#sign_up2 .signin_box .box .social a.circle{
text-align: center;
width: 56px;
height: 56px;
border-radius: 100%;
margin-right:34px;
display: inline-block;
-webkit-transition: border-color ease-in .1s;
-moz-transition: border-color ease-in .1s;
-o-transition: border-color ease-in .1s;
transition: border-color ease-in .1s;
}
#sign_up2 .signin_box .box .social a.circle img{
display: inline-block;
margin-top: 15px;
}
#sign_up2 .signin_box .box .social a.facebook{
background: #233678;
border:2px solid #233678;
}
#sign_up2 .signin_box .box .social a.twitter{
background: #54AEE1;
border:2px solid #54AEE1;
}
#sign_up2 .signin_box .box .social a.gplus{
background: #292929;
border:2px solid #292929;
margin: 0;
}
#sign_up2 .signin_box .box .social a.circle:hover{
border-color: rgba(0,0,0,0.7);
}
#sign_up2 .signin_box .box .division{
margin: 0 auto 18px;
float: none;
overflow: hidden;
width: 100%;
position: relative;
text-align: center;
}
#sign_up2 .signin_box .box .division .line{
border-top: 1px solid #DFDFDF;
width: 34%;
top: 10px;
position: absolute;
}
#sign_up2 .signin_box .box .division .l{
left: 0;
}
#sign_up2 .signin_box .box .division .r{
right: 0;
}
#sign_up2 .signin_box .box .division span{
color: rgb(66, 66, 66);
font-size: 17px;
}
#sign_up2 .signin_box .box .form form{
margin: 0;
}
#sign_up2 .signin_box .box .form input[type="text"]{
border-radius: 3px;
font-size: 16px;
width: 96%;
margin-bottom: 16px;
height: 27px;
color: black;
}
#sign_up2 .signin_box .box .form .forgot{
margin-left: 0;
margin-bottom: 20px;
width: 100%;
color: #797979;
text-align: center;
overflow: hidden;
}
#sign_up2 .signin_box .box .form .forgot span{
margin-right: 5px;
}
#sign_up2 .signin_box .box .form .forgot a{
color: #797979;
font-size: 13px;
border-bottom: 1px solid #797979;
font-weight: bold;
-webkit-transition: all .2s;
-moz-transition: all .2s;
-ms-transition: all .2s;
transition: all .2s;
}
#sign_up2 .signin_box .box .form .forgot a:hover{
color: #187CCC;
border-color: #187CCC;
}
#sign_up2 .signin_box .box .form input[type="submit"]{
text-transform: uppercase;
color: #fff;
background: #187CCC;
font-size: 15px;
margin: 0 auto;
display: block;
padding: 6px 19px;
border: 0 none;
border-radius: 3px;
-webkit-transition: background linear .2s, box-shadow linear .2s;
-moz-transition: background linear .2s, box-shadow linear .2s;
-o-transition: background linear .2s, box-shadow linear .2s;
transition: background linear .2s, box-shadow linear .2s;
}
#sign_up2 .signin_box .box .form input[type="submit"]:hover{
background: #252528;
}
/* Responsive
-------------------------------------------------- */
/* Large desktop */
@media (min-width: 1200px) {
}
@media (min-width: 980px) {
}
@media (max-width: 979px) {
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
#sign_up1 .header .social{
width: 35%;
}
#sign_up1 .footer input[type="text"],
#sign_up1 .footer input[type="password"]{
width: 25%;
}
#sign_up2 .left_box .perk_box .perk .icos{
height: 66px;
}
#sign_up2 .signin_box .box .social a.circle{
margin-right: 10px;
}
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#sign_up1{
background: none;
height: auto;
}
#sign_up1 .header h4{
color: #333;
line-height: 35px;
text-shadow:none;
}
#sign_up1 .header p{
line-height: 24px;
}
#sign_up1 .header p,
#sign_up1 .division span{
color: #333;
}
#sign_up1 .division .line{
border-color: #333;
}
#sign_up1 .footer input[type="text"],
#sign_up1 .footer input[type="password"]{
font-size: 13px;
width: 97%;
margin-bottom: 12px;
}
#sign_up1 .footer input[type="submit"]{
margin: 10px auto 0;
display: block;
}
#sign_up1 .dosnt{
float: left;
}
#sign_up1 .dosnt span{
margin-left: 0;
}
#sign_up1 .dosnt span,
#sign_up1 .dosnt a{
color: #333;
border-color: #333;
float: left;
}
#sign_up1 .dosnt a{
float: left;
}
#sign_up1 .dosnt a:hover{
color: #187CCC;
border-color: #187CCC;
}
#sign_up2 .left_box h4{
text-align: center;
margin-bottom: 30px;
}
#sign_up2 .left_box{
overflow: hidden;
margin-bottom: 70px;
}
#sign_up2 .signin_box{
float: none;
}
#sign_up2 .signin_box .box{
float: none;
margin: 0 auto;
width: 100%;
}
}
/* Landscape phones and down */
@media (max-width: 480px) {
}

View File

@ -0,0 +1,460 @@
html {
margin: 0;
}
body {
position: relative;
background: #DDDCE2 url(../img/body_bg.jpg) repeat left top;
-webkit-font-smoothing: antialiased;
font-family: 'Lato', sans-serif !important;
padding-top: 107px;
}
@media (max-width: 979px) {
body { padding-top: 0 !important; }
}
a:hover {
text-decoration: none;
}
input[type="text"],
input[type="password"],
input[type="submit"],
textarea {
font-family: 'Lato', Helvetica;
}
/* Navbar
-------------------------------------------------- */
body.pull_top {
padding-top: 0px !important;
}
header {
background: rgba(0,0,0,.6) !important;
}
.navbar.navbar-static-top {
margin-bottom: 35px;
}
.navbar.transparent.navbar-inverse .navbar-inner {
background: rgba(0,0,0,0.4);
border-bottom: 1px solid rgb(88, 88, 88);
}
.navbar.transparent.navbar-inverse .navbar-inner .container {
margin-top: 10px;
margin-bottom: 10px;
-webkit-transition: margin .2s ease-in-out;
-moz-transition: margin .2s ease-in-out;
transition: margin .2s ease-in-out;
}
.navbar.navbar-inverse .navbar-inner {
padding: 10px 0px 10px 0px;
background: #252528;
}
.navbar.navbar-inverse .navbar-inner.sticky {
background: rgba(0,0,0,0.8);
border-bottom: 1px solid #252525;
}
.navbar-inverse .navbar-inner.sticky .container {
margin-top: 0px !important;
margin-bottom: 0px !important;
}
.navbar-inverse .brand {
color: #fff;
}
.navbar-inverse .nav > li > a {
/*color: rgb(177, 177, 177);*/
font-size: 13px;
font-weight: bold;
color: #fff;
text-shadow: 0 1px 0 rgba(0,0,0,.5);
opacity: .6;
filter: alpha(opacity=60);
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
transition: all .2s linear;
}
.navbar-inverse .nav > li > a:hover,
.navbar-inverse .nav > li > a.active {
color: #fff;
opacity: 1;
filter: alpha(opacity=100);
}
.navbar-inverse .dropdown-menu {
background: #252528;
}
.navbar-inverse .nav > li > .dropdown-menu::after {
border-bottom: 6px solid #252528;
}
.navbar-inverse .dropdown-menu li > a {
color: #fff;
}
.dropdown-menu li > a:hover,
.dropdown-menu li > a:focus,
.dropdown-submenu:hover > a {
text-decoration: none;
}
.section_header {
width: 100%;
margin-bottom: 60px;
}
.section_header h3 {
color: rgb(100, 100, 100);
font-weight: 300;
font-style: italic;
font-size: 27px;
border-bottom: 1px solid #b3b3b3;
padding-bottom: 0px;
display: inline-block;
margin:0;
}
/* Footer
-------------------------------------------------- */
#footer {
min-height: 260px;
margin-top: 140px;
background-color: #252528;
color: #fff;
padding-top: 35px;
}
#footer .footer_header {
color: rgb(196, 196, 196);
font-style: italic;
font-weight: 300;
font-size: 25px;
margin-bottom: 40px;
margin-left: 15px;
}
/* recent posts */
#footer .recent_posts {
margin-left: 0px;
}
#footer .recent_posts .post {
margin-bottom: 70px;
width: 93%;
}
#footer .recent_posts .post img {
float: left;
margin-right: 20px;
}
#footer .recent_posts .post .date {
font-weight: bold;
font-style: italic;
}
#footer .recent_posts .post .title {
display: block;
color: #b5b5b6;
font-size: 14px;
}
/* testimonials */
#footer .testimonials .wrapper {
margin: 0 auto;
width: 82%;
}
#footer .testimonials .footer_header {
margin-left: 30px;
}
#footer .testimonials .quote {
color: rgb(191, 191, 192);
}
#footer .testimonials .quote span {
font-size: 32px;
font-style: italic;
position: relative;
top: 5px;
font-family: Georgia !important;
float: left;
margin-right: 8px;
}
#footer .testimonials .author {
margin-top: 40px;
}
#footer .testimonials .author img {
float: left;
margin-right: 15px;
position: relative;
top: -6px;
}
#footer .testimonials .name {
font-size: 13px;
font-weight: bold;
}
#footer .testimonials .info {
font-style: italic;
color: #ccc;
}
/* contact */
#footer .contact {
text-align: right;
margin-left: 35px;
}
#footer .contact .footer_header {
text-align: left;
margin-left: 35px;
}
#footer .contact input[type="text"],
#footer .contact textarea {
border: none;
background-color: #1f1f21;
padding: 8px 20px;
border-radius: 3px;
font-size: 14px;
font-family: Lato !important;
width: 80%;
-webkit-transition: background-color .2s linear;
-moz-transition: background-color .2s linear;
}
#footer .contact input[type="text"]:focus,
#footer .contact textarea:focus {
border: none;
box-shadow: none;
background-color: #000;
}
#footer .contact input[type="text"]:-moz-placeholder,
#footer .contact textarea:-moz-placeholder {
color: #868687;
}
#footer .contact input[type="text"]::-webkit-input-placeholder,
#footer .contact textarea::-webkit-input-placeholder {
color: #868687;
}
#footer .contact input[type="text"]:-ms-input-placeholder,
#footer .contact textarea:-ms-input-placeholder {
color: #868687;
}
#footer .contact input[type="submit"] {
background-color: #3e3e40;
border: none;
color: #fff;
border-radius: 4px;
padding: 5px 20px;
font-size: 14px;
font-weight: bold;
-webkit-transition: background-color .2s linear;
-moz-transition: background-color .2s linear;
}
#footer .contact input[type="submit"]:hover {
background-color:#2190DB;
}
#footer .credits {
border-top: 1px solid #343437;
padding: 10px 0px 60px 0px;
}
#footer .credits .social {
margin-top: 30px;
text-align: center;
}
#footer .credits .social a {
margin: 10px;
}
#footer .credits .copyright {
color: #a6a6a7;
font-style: italic;
text-align: center;
margin-top: 30px;
}
#footer .credits .social a {
margin: 10px;
}
#footer .credits .social a span{
display: inline-block;
width: 33px;
height: 33px;
}
#footer .credits .social span.ico1,
#footer .credits .social span.ico1h{
background-position: 0px 0px;
}
#footer .credits .social span.ico2,
#footer .credits .social span.ico2h{
background-position: -37px 0px;
}
#footer .credits .social span.ico3,
#footer .credits .social span.ico3h{
background-position: -75px 0px;
}
#footer .credits .social span.ico4,
#footer .credits .social span.ico4h{
background-position: -112px -1px;
}
#footer .credits .social span.ico5,
#footer .credits .social span.ico5h{
background-position: -151px 0px;
}
#footer .credits .social span.ico6,
#footer .credits .social span.ico6h{
background-position: -188px -1px;
}
#footer .credits .social span.ico7,
#footer .credits .social span.ico7h{
background-position: -226px 0px;
}
#footer .credits .social a:hover span.socialicons{
display: none;
}
#footer .credits .social a:hover span.socialicons_h{
display: inline-block !important;
}
#footer .credits .social span.socialicons_h{
display: none;
}
.socialicons{
background: url('../img/socialicons.png') no-repeat;
width: 265px;
height: 36px;
}
.socialicons_h{
background: url('../img/socialicons_h.png') no-repeat;
width: 265px;
height: 36px;
}
/*Inner Footer*/
#footer .info{
margin-bottom: 10px;
margin-left: 0;
}
#footer .info .residence{
margin-left: 0;
}
#footer .info ul{
margin: 0;
padding: 0;
}
#footer .info ul li{
list-style: none;
font-size: 16px;
color: #777E83;
line-height: 23px;
}
#footer .info ul a{
color: #777E83;
-webkit-transition: color .2s;
-moz-transition: color .2s;
-ms-transition: color .2s;
transition: color .2s;
}
#footer .info ul a:hover{
color: #A9B4BB;
}
#footer .info .touch{
float: right;
}
#footer .info .touch ul li{
display: inline-block;
margin-left: 30px;
}
/* Global
-------------------------------------------------- */
.page_header {
background-color: #000;
color: #fff;
font-size: 23px;
display: inline-block;
padding: 0px 18px;
}
.social_icon{
background: url("../img/social_icons.png") no-repeat;
width: 110px;
height: 18px;
}
.contact_social{
background: url("../img/contact_social.png") no-repeat;
width: 180px;
height: 34px;
}
/* Responsive
-------------------------------------------------- */
/* Large desktop */
@media (min-width: 1200px) {
#footer .sections .contact > *{
/*margin-left: 80px;*/
}
}
@media (min-width: 980px) {
}
@media (max-width: 979px) {
.navbar.transparent.navbar-fixed-top,
.navbar.home.navbar-fixed-top{
margin-bottom: 0px;
}
.navbar.transparent.navbar-inverse .navbar-inner {
background: #252528;
}
.navbar-inverse .nav-collapse .nav > li > a,
.navbar-inverse .nav-collapse .dropdown-menu a {
color: #fff;
opacity: 0.7;
}
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
.navbar.transparent.navbar-fixed-top,
.navbar.home.navbar-fixed-top{
margin-bottom: -70px;
position: relative;
top: 999;
}
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
footer {
margin-right: -20px;
margin-left: -20px;
}
#footer{
margin-right: -20px;
margin-left: -20px;
}
#footer .container{
padding: 0px 20px;
}
/*Index Footer*/
#footer .footer_header {
margin-left: 0;
}
#footer .footer_header h3{
margin-left: 0;
}
#footer .testimonials{
overflow: hidden;
margin-bottom: 40px;
}
#footer .testimonials .footer_header{
margin-left: 0;
}
#footer .testimonials .wrapper{
float: left;
width: 100%;
}
#footer .contact{
margin: 0;
}
#footer .contact .footer_header{
margin-left: 0;
}
#footer .contact input[type="text"], #footer .contact textarea{
float: left;
width: 92%;
}
/*Inner Footer*/
#footer .info .touch ul li{
margin: 0 30px 0 0;
}
#footer .info .touch ul{
margin:15px 0 15px;
}
}
/* Landscape phones and down */
@media (max-width: 480px) {
}
/* Icons
-------------------------------------------------- */

View File

@ -0,0 +1,283 @@
<!DOCTYPE html>
<html>
<head>
<title>Business Template</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Styles -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-responsive.min.css" rel="stylesheet">
<link href="css/bootstrap-overrides.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/theme.css">
<link rel="stylesheet" type="text/css" href="css/lib/animate.css">
<link rel="stylesheet" type="text/css" href="css/features.css">
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,900,300italic,400italic,700italic,900italic' rel='stylesheet' type='text/css'>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-inverse navbar-static-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="index.html">
<strong>CLEAN CANVAS</strong>
</a>
<div class="nav-collapse collapse">
<ul class="nav pull-right">
<li><a href="index.html">HOME</a></li>
<li><a href="about-us.html">ABOUT US</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle active" data-toggle="dropdown">
PAGES
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="features.html">Features</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="portfolio-item.html">Portfolio Item</a></li>
<li><a href="coming-soon.html">Coming Soon</a></li>
<li><a href="sign-in.html">Sign in</a></li>
<li><a href="sign-up.html">Sign up</a></li>
<li><a href="backgrounds.html">Backgrounds</a></li>
</ul>
</li>
<li><a href="pricing.html">PRICING</a></li>
<li><a href="contact.html">CONTACT US</a></li>
<li><a href="blog.html">BLOG</a></li>
<li><a class="btn-header" href="sign-up.html">Sign up</a></li>
<li><a class="btn-header" href="sign-in.html">Sign in</a></li>
</ul>
</div>
</div>
</div>
</div>
<div id="features" class="features_page">
<div class="container">
<!-- Feature Wrapper -->
<div class="feature_wrapper option1">
<div class="section_header">
<h3>Features <span>(Option 1)</span></h3>
</div>
<div class="row subtitle">
<h2>
There are many variations of passages of available, but the majority have suffered alteration in some on form, by injected humour, or randomised words which look even slightly believable.
</h2>
</div>
<div class="row feature">
<div class="span6">
<img src="img/showcase1.png" />
</div>
<div class="span6 info">
<h3>
<img src="img/features-ico1.png" />
Beautiful on all devices
</h3>
<p>
There are many variations of passages of Lorem Ipsum available, but the randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text.
</p>
</div>
</div>
<div class="row feature ss last">
<div class="span6 info">
<h3>
<img src="img/features-ico2.png" />
Blog page included
</h3>
<p>
There are many variations of passages of Lorem Ipsum available, but the randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text.
</p>
</div>
<div class="span6">
<img src="img/showcase2.png" class="pull-right" />
</div>
</div>
</div>
<!-- Feature Wrapper -->
<div class="feature_wrapper option2">
<div class="section_header">
<h3>Features <span>(Option 2)</span></h3>
</div>
<!-- Features Row -->
<div class="row">
<!-- Feature -->
<div class="span6 feature">
<div class="box">
<img class="one" src="img/features-ico4.png" />
</div>
<div class="text">
<h6>Desktop publishing packages </h6>
<p>
There are many variations of passages of generators on the embarrassing hidden in randomised words which don't look even by these distribution of letters, as opposed to using content here, content here making.</p>
</div>
</div>
<!-- Feature -->
<div class="span6 feature right">
<div class="box">
<img class="two" src="img/features-ico5.png" />
</div>
<div class="text">
<h6>Desktop publishing packages </h6>
<p>
There are many variations of passages of generators on the embarrassing hidden in randomised words which don't look even by these distribution of letters, as opposed to using content here, content here making.</p>
</div>
</div>
</div>
<!-- Features Row -->
<div class="row last">
<!-- Feature -->
<div class="span6 feature">
<div class="box">
<img class="one" src="img/features-ico6.png" />
</div>
<div class="text">
<h6>Desktop publishing packages </h6>
<p>
There are many variations of passages of generators on the embarrassing hidden in randomised words which don't look even by these distribution of letters, as opposed to using content here, content here making.</p>
</div>
</div>
<!-- Feature -->
<div class="span6 feature right">
<div class="box">
<img class="two" src="img/features-ico7.png" />
</div>
<div class="text">
<h6>Desktop publishing packages </h6>
<p>
There are many variations of passages of generators on the embarrassing hidden in randomised words which don't look even by these distribution of letters, as opposed to using content here, content here making.</p>
</div>
</div>
</div>
</div>
<!-- Feature Wrapper -->
<div class="feature_wrapper option3">
<div class="section_header">
<h3>Features <small>(Option 3)</small></h3>
</div>
<!-- Features Row -->
<div class="row">
<!-- Feature -->
<div class="span4 feature">
<div class="img">
<img src="img/features-ico6.png" />
</div>
<div class="text">
<h6>Plan</h6>
<p>
There are many variations passages generators on the embarrassing hidden in randomised words which don't look even slightly distracted content here making it look like.
</p>
</div>
</div>
<!-- Feature -->
<div class="span4 feature">
<div class="img">
<img src="img/features-ico5.png" />
</div>
<div class="text">
<h6>Design</h6>
<p>
There are many variations passages generators on the embarrassing hidden in randomised words which don't look even slightly distracted content here making it look like.
</p>
</div>
</div>
<!-- Feature -->
<div class="span4 feature last">
<div class="img">
<img src="img/features-ico7.png" />
</div>
<div class="text">
<h6>Develop</h6>
<p>
There are many variations passages generators on the embarrassing hidden in randomised words which don't look even slightly distracted content here making it look like.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- starts footer -->
<footer id="footer">
<div class="container">
<div class="row info">
<div class="span6 residence">
<ul>
<li>2301 East Lamar Blvd. Suite 140. City, Arlington.</li>
<li>United States, Zip Code TX 76006.</li>
</ul>
</div>
<div class="span5 touch">
<ul>
<li><strong>P.</strong> 1 817 274 2933</li>
<li><strong>E.</strong><a href="#"> bootstrap@twitter.com</a></li>
</ul>
</div>
</div>
<div class="row credits">
<div class="span12">
<div class="row social">
<div class="span12">
<a href="#" class="facebook">
<span class="socialicons ico1"></span>
<span class="socialicons_h ico1h"></span>
</a>
<a href="#" class="twitter">
<span class="socialicons ico2"></span>
<span class="socialicons_h ico2h"></span>
</a>
<a href="#" class="gplus">
<span class="socialicons ico3"></span>
<span class="socialicons_h ico3h"></span>
</a>
<a href="#" class="flickr">
<span class="socialicons ico4"></span>
<span class="socialicons_h ico4h"></span>
</a>
<a href="#" class="pinterest">
<span class="socialicons ico5"></span>
<span class="socialicons_h ico5h"></span>
</a>
<a href="#" class="dribble">
<span class="socialicons ico6"></span>
<span class="socialicons_h ico6h"></span>
</a>
<a href="#" class="behance">
<span class="socialicons ico7"></span>
<span class="socialicons_h ico7h"></span>
</a>
</div>
</div>
<div class="row copyright">
<div class="span12">
© 2013 Clean Canvas. All rights reserved. Theme by Detail Canvas.
</div>
</div>
</div>
</div>
</div>
</footer>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/theme.js"></script>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 59 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 44 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 287 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 370 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 536 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 338 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 301 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 354 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 37 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 388 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 43 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 374 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 348 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 635 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 359 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 39 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 379 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 340 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 383 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 104 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 128 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 206 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 664 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 762 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 479 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 730 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 852 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 401 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 759 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 617 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 271 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 372 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 483 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 529 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 481 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 772 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 400 B

Some files were not shown because too many files have changed in this diff Show More