/*
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = =  
=     00   00 00 00   00 00 00   00 00 00   00 00 00   00 00    =
=     00   00    00        00    00    00   00    00   00       =
=     00   00    00      00      00    00   00    00   00       =
=     00   00    00    00        00    00   00    00   00       =
=  00 00   00 00 00   00 00 00   00 00 00   00 00 00   00       =
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = =
*/

/* using standard base style by Skeleton and adding another new codes */

/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/


/* Table of Content
==================================================
	#Reset & Basics
	#Basic Styles
	#Main Fonts
	#Main Colors & Backgrounds
	#Aligns
	#Typography
	#Links
	#Images
	#Forms */

/* Reset & Basics (Inspired by E. Meyers)
================================================== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block; 
}
body {
	line-height: 1; 
}
ol, ul {
	list-style: none; 
}
blockquote, q {
	quotes: none; 
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none; 
}
table {
	border-collapse: collapse;
	border-spacing: 0; 
}



/* Typography
================================================== */
h1, h2, h3, h4, h5, h6 {
	font-weight: normal; 
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }
h1 { font-size: 27px; line-height: 30px; }
h2 { font-size: 20px; line-height: 30px; }
h3 { font-size: 17px; line-height: 34px; }
h4 { font-size: 16px; line-height: 30px; }
h5 { font-size: 14px; line-height: 24px; }
h6 { font-size: 12px; line-height: 21px; }

p, blockquote { line-height:25px; }

em { font-style: italic; }
strong { font-weight: bold; }
small { font-size: 80%; }

/*	Blockquotes  */
blockquote{  }

hr { border: solid #eaeaea; border-width: 1px 0 0; clear: both; margin: -1px 0 0 0; height: 0; }


/* Links
================================================== */
a, input.subscribe-submit, .team .item span.social, .share-icons span.social, .button { 
	-webkit-transition: all 0.3s ease-in;  
    -moz-transition: all 0.3s ease-in;  
    -ms-transition: all 0.3s ease-in;  
    -o-transition: all 0.3s ease-in;  
    transition: all 0.3s ease-in;
}

a { 
   text-decoration:none;
	color:#585858;
}



/* Images
================================================== */
img {
	max-width: 100%;
	height: auto; 
}

/* Forms
================================================== */


/* Basic Styles
================================================== */
html {
	-webkit-text-size-adjust: none;
}

body {
	-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
	-webkit-text-size-adjust: 100%;
	background:#fff;
}
 
.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

::-moz-selection {
    color: #fff;
	text-shadow:none;
}

::selection {
    color: #fff;
	text-shadow:none;
}

.google-map iframe {
	width:100%;
	min-height:400px;
}

/* Main Fonts
================================================== */
body {
	font-family: 'TeXGyreHerosRegular', Arial, sans-serif ;
}

h1, h2, h3, h4, h5, h6, .navigation, .welcome, #main-services, #services, .head-title, .recent-work .item h4, .recent-blog h2, .recent-blog .more, h3.title, footer, input.subscribe-mail, input.subscribe-submit, #slide .about, .recent-blog .item p, .how-work .item h2, .how-work .item p, .team .item, .features-list .item h2, .features-list .item p, .get-in-touch, #options, .pagination, .share-icons h3, .theme-links, .about-project p, .blog-content .post, input.search, .widget, .comment, .comment-form, .comment-form .button, .comment-form input.text, .comment-form textarea, .contact-form h2.title, .contact-form, .contact-form .button, .contact-form input.text, .contact-form textarea {
	font-family: 'TeXGyreHerosBold', Arial, sans-serif ;
}


/* Font Size */
body, .navigation ul li ul li a {
	font-size:13px;
}

#main-services .more, .recent-work .item p, .recent-blog, footer .copyright, .team .item p, .comment span {
	font-size:14px;
}

.team .item span.position, .blog-content .post .post-meta, .comment p {
	font-size:15px;
}

.navigation ul li a, #main-services p, #services p, footer p, #tweets-footer, input.subscribe-mail, input.subscribe-submit, .how-work .item, .features-list .item p, .pagination, .about-project p, .blog-content .post p, .button, input.search, .widget li, .comment-form input.text, .comment-form textarea, .contact-form input.text, .contact-form textarea {
	font-size:16px;
}

#options, .comment h3, .comment-form, .contact-form  {
	font-size:18px;
}

.head-title p {
	font-size:19px;
}

.recent-work .item h4, .share-icons h3, h2.num-comments {
	font-size:20px;
}

.recent-blog h2, .features-list .item h2 {
	font-size:21px;
}

.about.single-post a.view-online, .theme-links a.view-online, .widget h2 {
	font-size:22px;
}

.get-in-touch p, .about-project h2 {
	font-size:23px;
}

h3.title, #slide .about p, .how-work .item h2, .get-in-touch a.contact, .contact-form h2.title {
	font-size:24px;
}

.blog-content .post h2.title {
	font-size:30px;
}

#slide .about h2, .get-in-touch h2 {
	font-size:36px;
}

.head-title h2 {
	font-size:38px;
}

.welcome p {
	font-size:59px;
}

.welcome h2 {
	font-size:88px;
}



/* Main Colors & Backgrounds
================================================== */
/* bachground */
header, #main-services .circle, #main-services .more {
	background:#282828;
}

.js .selectnav {
	background:#181818;
}

.recent-work .item, .team .item, .get-in-touch {
	background:#f9f9f9;
}

.down-footer {
	background:#2f2f2f;
}

#options li a:hover, #options li a.selected, .team .item span.social, #services .circle, .features-list .item:hover .circle, .get-in-touch a.contact:hover, .pagination li a:hover, .pagination li a.current, #slide .about.single-post a.view-online:hover, #slide .about.single-post a.view-online.demo, .share-icons span.social, .theme-links a.view-online:hover, .theme-links a.view-online.demo, .button.color:hover, .button.black {
	background:#434343;
}

.flex-direction-nav li .next:hover, .flex-direction-nav li .prev:hover {
	background-color:#434343;
}

/* color */
body {
	color:#6a6a6a;
}

.js .selectnav, #main-services h1 a, #main-services p, #main-services .more:hover, .recent-work .item .desc:hover p, .recent-work .item .desc:hover a, footer h3, .tweet.footer .tweet_list li a, input.subscribe-submit, footer .copyright, .get-in-touch a.contact, #options li a:hover, #options li a.selected, .pagination li a:hover, .pagination li a.current, #slide .about.single-post a.view-online, .theme-links a.view-online, .button, a.button, .button:hover, a.button:hover, .comment-form .button, .contact-form .button,
.blog-content .post a.button, .blog-content .post a.button:hover  {
	color:#fff;
}

.navigation ul li a, #main-services .more{
	color:#dfdfdf;
}

.welcome p {
	color:#222222;
}

.head-title h2, .recent-blog .item h2 a, #slide .about p, .how-work .item h2, .team .item h2, #services p, .features-list .item h2, .get-in-touch h2, .pagination, #options, .how-work .item p, .share-icons h3, .about-project h2, .blog-content .post, .blog-content .post h2 a, .widget h2, h2.num-comments, .comment h3, .comment h3 a, .comment p, h2.add-comment, .comment-form input.text, .comment-form textarea, .contact-form h2.title, .contact-form input.text, .contact-form textarea {
	color:#434343;
}

.recent-blog .item .more {
	color:#a2a1a1;
}

.recent-blog .item p{
	color:#3f3f3f;
}

.top-footer p, #tweets-footer {
	color:#e0e0e0;
}

input.subscribe-mail {
	color:#ADADAD;
}

.blog-content .post .post-meta, .blog-content .post .post-meta a, .blog-content .post p a:hover, input.search, .comment p a:hover{
	color:#707070;
}

.comment span, .comment span a {
	color:#9E9D9D;
}

.comment-form, .contact-form {
	color:#6f6f6f;
}


/* Aligns
================================================== */
.head-title, .recent-work .item, .get-in-touch {
	text-align:center;
}


