/* --------------------------------------------

	

	main.css : main style file

	Project : cvCard

	version : 1.2.1

	Author : pixelwars 

	

	---

	

	CONTEXT:

	

	1. BASE

		1.1 ELEMENTS

		1.2 FONTS

		1.3 TYPOGRAPHY

	2. FORMS

	3. COMMON

	4. LAYOUT

	5. MODULES

	7. MEDIA QUERIES

	8. THEME

	

   -------------------------------------------- */

   

   

   

/*  --------------------------------------------



	1. BASE (@base) - base html elements

	

    -------------------------------------------- */



/* ----- 1.1 ELEMENTS ----- */   

*,

*:after,

*::before {

	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;

	}

html {

	font-size: 100%; -webkit-font-smoothing: antialiased;

	}

html,

body {

 	position: relative; width: 100%; height: 100%;

	}

body {

 	 font-size: 1em; line-height: 1.66; -webkit-text-size-adjust: none;

	}

a {

 	color: #096; text-decoration: none; outline: none;

	}

a:hover,

a:focus {

	text-decoration: none; outline: none;

	}

a:hover {

 	color: #5BCF80

	}

iframe {

 	border: none

	}

ul {

 	list-style: square

	}

img {

 	max-width: 100%; height: auto;

	}



/* ----- 1.2 FONTS ----- */ 

/* BODY */

body,

input,

textarea,

select,

button {

 	font-family: Lato, Arial, serif

	}

/* FONT AWESOME chrome svg hack for smooth icons : 

   http://www.adtrak.co.uk/blog/font-face-chrome-rendering/#fix */

@media screen and (-webkit-min-device-pixel-ratio:0) { 

	@font-face {

		font-family: 'FontAwesome'; src: url('fonts/font-awesome/fonts/fontawesome-webfont.svg') format('svg');

		}

	}

/* FONT AWESOME ICONS */

.fancy-ico:before,

#fancybox-close:before,

.icon,

.icon:before,

.mask:before,

.widget-twitter ul:before,

.widget-twitter ul li:before,

.alert:before,

.site-alert:before,

blockquote:before,

.testo:before,

.post-format:before,

.flex-direction-nav a:before,

.toggle h4:before,

dd:before,

.portfolio-nav .back:before,

.process:before {

 	font-family: FontAwesome; font-weight: normal; text-align: left; font-style: normal; display: inline-block; text-decoration: inherit;

	}

	

/* ----- 1.3 TYPOGRAPHY ----- */

/* headings and paragraphs  */

h1 {

 	font-size: 2.20em; margin: 0.8em 0 0.4em 0;

	}

h2 {

 	font-size: 1.50em; margin: 1.0em 0 0.6em 0; font-weight: 800;

	}

h3 {

 	font-size: 1.20em; margin: 1.0em 0 .6em 0;

	}

h4 {

 	font-size: 1.00em; margin: 2.0em 0 .6em 0;

	}

h5 {

 	font-size: 1.00em; margin: 1.0em 0 .8em 0;

	}

h6 {

 	font-size: 0.90em; margin: 1.0em 0 .8em 0;

	}

p {

 	margin: 1.2em 0

	}

/* blockquote  */

blockquote {

 	position: relative; margin: 2em 0; padding: .3em 2em 1em 2.0em; font-size: 1.6em; font-family: Georgia, "Times New Roman", Times, serif; font-weight: 300; font-style: italic;

	}

blockquote:before {

 	display: block; content: "\f10d"; line-height: 1; font-size: 1.2em; position: absolute; left: 0; top: -0.1em; color: #DDE4E6;

	}

blockquote cite {

 	display: block; font-size: 14px; letter-spacing: .04em; text-align: right; padding-right: 1em; margin-top: 12px; font-style: normal; font-weight: 400; color: #B7C6C9;

	}

blockquote cite:before {

 	content: "\2014 \2009"

	}

hr {

 	padding: .6em 0 1em 0; margin-bottom: 3em; outline: 0; border-width: 0 0 1px 0; border-style: solid; border-color: #eee;

	}

/* tables  */

table {

 	font-size: .9em; margin-bottom: 3em; text-align: center;

	}

tr th {

 	padding: .8em 2em .8em 2em; font-weight: 800; border-bottom: 2px solid #DDE4E6; text-transform: uppercase;

	}

tr td {

 	color: #6A7686; padding: .8em 1em .6em 1em; border-bottom: 1px solid #eee;

	}

tfoot tr td {

 	border-bottom: 0

	}

tr:nth-child(odd) td {

 	background: #FAFCFD;

	}

/* code and pre  */

code,

pre {

 	padding: 0 3px 2px; margin-bottom: 4em; font-family: Monaco, Menlo, Consolas, "Courier New", monospace; font-size: 12px; color: #333333; white-space: pre; overflow: auto;

	}

code {

 	display: inline-block; margin: 0 .4em; padding: 1px 6px; background: #fff; border: 1px solid #DDE4E6; box-shadow: 1px 1px 0 #fff, 2px 2px 0 #DDE4E6;

	}

/* lists  */

ol,

ul {

 	margin: .2em 0 1em 0; line-height: 1.8;

	}

ul {

 	list-style: circle

	}

dt {

 	margin-bottom: .4em;

	}

dd {

	padding-bottom: 1em; margin-left: 1.4em;

	}

dd:before {

 	content: "\f0a4"; font-size: 14px; margin-right: 12px; color: #B7C6C9;

	}





/*  --------------------------------------------



	2. FORMS (@forms) - form elements

	

    -------------------------------------------- */

form p {

 	position: relative; margin: 1.6em 0;

	}

label {

 	display: block; font-size: 10px; margin-bottom: .2em; letter-spacing: 1px; color: #6A7686; text-transform: uppercase;

	}

::-webkit-input-placeholder { 

	color: rgba(106, 118, 134, 0.4);

	}

::-moz-placeholder { 

	color: rgba(106, 118, 134, 0.4);

	} 

:-ms-input-placeholder { 

	color: rgba(106, 118, 134, 0.4);

	}

input:not([type=submit]):not([type=button]):not([type=file]):not([type=radio]):not([type=checkbox]),

textarea,

select {

 	padding: .8em; width: 262px; max-width: 100%; font-size: 1em; color: #6A7686; border: 2px solid #e9eeee; border-radius: 4px; background: #fff; -webkit-appearance: none; -webkit-tap-highlight-color: transparent; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;

	}

input:not([type=submit]):not([type=button]):not([type=file]):not([type=radio]):not([type=checkbox]):focus,

textarea:focus,

input:focus,

select:focus,

div.uploader:hover {

 	border-color: #b7c6c9; outline: 0;

	}

select {

 	min-width: 262px

	}

textarea {

 	width: 50%; min-width: 262px; min-height: 11em;

	}

.inline-label {

 	display: inline-block; margin-right: 2em; font-weight: 400; color: #6A7686; letter-spacing: 0;

	}

/* uniform  */

div.selector.disabled,

div.checker.disabled,

div.radio.disabled {

 	opacity: .4

	}

div.selector {

 	font-size: .9em; padding: .4em; width: 262px !important; line-height: 55px; height: 55px; padding-left: 1em; background: #fff; border: 2px solid #e9eeee; border-radius: 4px;

	}

div.selector:before,

div.checker span:before,

div.radio span:before,

div.uploader 

span.action:before {

 	font-family: FontAwesome; font-weight: normal; font-size: 9px; width: 1.8em; text-align: right; font-style: normal; display: inline-block; text-decoration: inherit;

	}

div.selector:before {

 	position: absolute; top: 0; right: 15px; font-size: 26px; color: #b7c6c9; content: "\f107";

	}

div.selector.focus {

 	border-color: #b7c6c9

	}

div.selector.focus:before {

 	color: #6A7686

	}

div.selector.focus,

div.selector.hover,

div.selector:hover {

 	border-color: #b7c6c9

	}

div.selector span {

 	padding-top: 8px; padding-left: 0; color: #6A7686; background: none;

	}

div.selector select {

 	width: 98% !important; left: 1% !important; height: auto; min-height: 53px; line-height: 53px; font-size: 1em; -webkit-tap-highlight-color: transparent;

	}

.android div.selector select {

 	font-size: 2em

	}

/* checkboxes  */

div.checker,

div.radio {

 	width: 20px; height: 29px; margin-right: 7px;

	}

	div.checker span,

	div.radio span {

 	background: none

		}

	div.checker span:before,

	div.radio span:before {

 	text-align: left; position: absolute; top: 0; left: 0; font-size: 22px; line-height: 120%; color: #6A7686; content: "\f096";

		}

	div.checker span.checked:before,

	div.radio span.checked:before {

 	content: "\f046"

		}

	div.radio span:before {

 	content: "\f10c"

		}

	div.radio span.checked:before {

 	content: "\f111"

		}

/* file upload  */

div.uploader {

 	width: 262px; height: 55px; background: #fff; border: 2px solid #e9eeee; border-radius: 4px;

	}

	div.uploader input {

 	width: 100%; z-index: 100; line-height: 55px; min-height: 55px;

		}

	div.uploader span.filename {

 	padding: 0 12px; width: 100%; 100; line-height: 50px; min-height: 55px; border-left: 0; font-size: 13px; color: #6A7686;

		}

	div.uploader span.action {

 	width: 10px; text-indent: -999em; background: #fff; padding: 8px 16px 8px 36px; position: absolute; top: 0; right: 0; font-size: 13px; border-left: 2px solid #e9eeee; height: 100%;

		}

	div.uploader:hover span.action {

 		border-left-color: #b7c6c9;

		}

	div.uploader span.action:before {

 	text-indent: 0; content: "\f0ee"; color: #b7c6c9; font-size: 22px; text-align: center; position: absolute; top: 15px; left: 7px;

		}

/* contact form 7 compatibility  */

.wpcf7 {

 	padding: 0

	}

	.wpcf7 input[type=submit] {

 	margin-top: 1.4em

		}

	.wpcf7 label {

 	display: inline-block; margin-right: 2em;

		}

	.wpcf7 div.checker,

	.wpcf7 div.radio {

 	margin-right: 0px

		}

/* validation  */

label.error {

 	position: absolute; bottom: -20px; left: 0; min-width: 180px; font-size: 13px; font-weight: 800; text-transform: uppercase; padding: .2em .8em; border-radius: 3px; background-color: #DA4842; color: #fff; letter-spacing: 0;

	}

label.error:after {

 	content: " "; position: absolute; left: 1.6em; bottom: 100%; pointer-events: none; width: 0; height: 0; border-bottom: 8px solid #DA4842; border-right: 8px solid transparent;

	}







/*  --------------------------------------------



	3. COMMON (@common) - common and helper classes

	

    -------------------------------------------- */

.cf:before,

.cf:after {

 	content: " "; display: table;

	}

.cf:after {

 	clear: both

	}

.center {

 	text-align: center

	}

.easing,

.media-box .mask,

.client img {

 	-webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out;

	}

.easing-short,

input,

textarea,

.social li a,

#fancybox-close,

.classic-layout .vs-nav li a,

.latest-posts article header a,

.button,

.portfolio-nav a.button,

.fancy-ico,

.single-page-layout .vs-nav li i,

.entry-title a,

a.more-link,

.format-link .link-content > a:first-child,

.flex-control-paging li a,

.navigation a,

.pagination a,

.entry-meta a,

.nav-single a,

.comment a,

.filters li a,

.entry-title a {

 	-webkit-transition: color 0.1s, background-color .2s, border-color .2s; transition: color 0.1s, background-color .2s, border-color .2s;

	}

.no-csstransitions #nprogress .spinner {

	display: none !important;

	}



/*  --------------------------------------------



	4. LAYOUT (@layout) : layout styles

	

    -------------------------------------------- */

.container {

	position: relative; width: 100%; padding-left: 0; padding-right: 0;

	}

.container:before,

.container:after {

	display: none;

	}

.no-touch .container {

	overflow-x: hidden

	}

.content {

	position: relative; padding: 1em 2em; margin: auto; width: 100%; text-align: left;

	}

.readable-content {

	width: 90%; max-width: 740px; margin-left: auto; margin-right: auto;

	}

.full-width-content {

	max-width: 90%; margin-left: auto; margin-right: auto;

	}

.hentry {

 	padding: 0.25em 0 2.5em 0

	}

.entry-title {

 	margin-top: 0; font-size: 3.0em; line-height: 1.2; font-weight: 800; text-align: center;

	}

.entry-content {

	padding: 0.25em 0 1.250em 0

	}



/* ----- 4.1 HEADER ----- */

.header {

 	z-index: 200; margin: 0 auto; padding: 2em; width: 100%; text-align: center; -webkit-backface-visibility: hidden;

	}

	.header h1 {

 	margin: .9em 0 0 0; padding: 0; font-weight: 300; font-size: 1.4em; line-height: 1.4; -webkit-backface-visibility: hidden;
color: #000000

		}

	.header img {

 	max-height: 160px; border-radius: 50%;

		}

	.header p {

 	font-size: 1em; margin: .1em 0 .6em; display: inline-block; font-style: italic; padding: 6px 10px; background: #ef9f50; color: #345; color: rgb(255, 255, 255); border-radius: 4px; line-height: 1;

		}

/* single page menu  */

.single-page-layout .vs-nav li a {

 	letter-spacing: -1px; margin: 0 4px; padding: 0;

	}

.single-page-layout .vs-nav li i {

 	font-size: 17px; display: inline-block; width: 58px; line-height: 53px; text-align: center; border-radius: 50%; color: #6A7686; border: 2px solid #ECF0F1; background: #fff;

	}

.single-page-layout .vs-nav li i:hover,

.single-page-layout .vs-nav li i.active {

 	color: #fff; border-color: transparent;

	}

	

/* TRIPLE LAYOUT */

.vs-nav {

 	position: relative; display: block; margin: .9em auto 0 auto; padding: 0; list-style: none;

	}

.vs-triplelayout .vs-nav {

 	width: 33.33%; max-width: 360px; height: 60px;

	}

.vs-nav li {

 	display: inline-block; margin-bottom: 10px; text-align: center; text-decoration: none;

	}

.vs-triplelayout .vs-nav li {

 	position: absolute; visibility: hidden; width: 100%;

	}

.vs-nav li a {

 	font-family: Arial, Helvetica, sans-serif; position: relative; color: #990C42; letter-spacing: -2px; text-decoration: none; font-weight: 700; font-size: 2.7em;

	}

.vs-nav li a:hover {

	color: #BECACC;

	}

.vs-nav li a:focus,

.vs-triplelayout .vs-nav .vs-nav-current a,

.vs-nav li.current_page_item a,

.container.vs-move-left .vs-nav-right a,

.container.vs-move-right .vs-nav-left a {

 	color: #FFFFFF;

	}

.container.vs-move-left .vs-nav-current a,

.container.vs-move-right .vs-nav-current a {

 	color : #D0DADC

	}

.vs-triplelayout .vs-nav .vs-nav-left,

.vs-triplelayout .vs-nav .vs-nav-right,

.vs-triplelayout .vs-nav .vs-nav-left-outer,

.vs-triplelayout .vs-nav .vs-nav-right-outer,

.vs-triplelayout .vs-nav .vs-nav-current {

 	visibility: visible

	}

.vs-triplelayout .vs-nav .vs-nav-current {

 	left: 0%

	}

	.vs-triplelayout .vs-nav .vs-nav-current a {

 		cursor: default

		}

.vs-triplelayout .vs-nav .vs-nav-left {

 	left: -100%

	}

.vs-triplelayout .vs-nav .vs-nav-right {

 	left: 100%

	}

.vs-triplelayout .vs-nav .vs-nav-right-outer {

 	left: 200%

	}

.vs-triplelayout .vs-nav .vs-nav-left-outer {

 	left: -200%

	}

.container.vs-move-left .vs-nav-left,

.container.vs-move-left .vs-nav-left-outer,

.container.vs-move-left .vs-nav-current,

.container.vs-move-left .vs-nav-right,

.container.vs-move-left .vs-nav-right-outer {

 	-webkit-transition: -webkit-transform 0.5s, opacity 0.5s; transition: transform 0.5s, opacity 0.5s; -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0);

	}

.container.vs-move-right .vs-nav-left,

.container.vs-move-right .vs-nav-left-outer,

.container.vs-move-right .vs-nav-current,

.container.vs-move-right .vs-nav-right,

.container.vs-move-right .vs-nav-right-outer {

 	-webkit-transition: -webkit-transform 0.5s, opacity 0.5s; transition: transform 0.5s, opacity 0.5s; -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0);

	}

.container.vs-move-left .vs-nav-left,

.container.vs-move-right .vs-nav-right {

 	opacity: 0

	}

.wrapper {

 	position: relative; display: block; overflow: hidden; width: 100%;

	}

.vs-triplelayout .wrapper {

 	min-height: 100%

	}

.wrapper > section {

 	z-index: 1; min-height: 100%; margin: 0 auto; padding: 0 0 30px; width: 100%; background: #fff;

	}

.vs-triplelayout .wrapper > section {

 	position: absolute; top: 0; left: 0%; margin: 0; visibility: hidden; -webkit-backface-visibility: hidden;

	}

.vs-triplelayout .wrapper > section:not(.vs-current) {

 	overflow: hidden; height: 100%;

	}

.vs-triplelayout .wrapper .vs-left,

.vs-triplelayout .wrapper .vs-left-outer,

.vs-triplelayout .wrapper .vs-current,

.vs-triplelayout .wrapper .vs-right,

.vs-triplelayout .wrapper .vs-right-outer {

 	visibility: visible

	}

.vs-triplelayout .wrapper .vs-left {

 	left: -100%;

	}

.vs-triplelayout .wrapper .vs-left-outer {

 	left: -200%;

	}

.vs-triplelayout .wrapper .vs-current {

 	position: relative; z-index: 100;

	}

.vs-triplelayout .wrapper .vs-right {

 	left: 100%;

	}

.vs-triplelayout .wrapper .vs-right-outer {

 	left: 200%;

	}

	

.container.vs-move-left .vs-left,

.container.vs-move-left .vs-current,

.container.vs-move-left .vs-right,

.container.vs-move-left .vs-right-outer {

 	-webkit-transition: -webkit-transform 0.5s; transition: transform 0.5s; -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0);

	}

.container.vs-move-right .vs-left,

.container.vs-move-right .vs-left-outer,

.container.vs-move-right .vs-current,

.container.vs-move-right .vs-right {

 	-webkit-transition: -webkit-transform 0.5s; transition: transform 0.5s; -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0);

	}

/* FAST NAVIGATE MODE */

.fast-navigate .container.vs-move-left .vs-left,

.fast-navigate .container.vs-move-left .vs-current,

.fast-navigate .container.vs-move-left .vs-right,

.fast-navigate .container.vs-move-left .vs-right-outer {

 	-webkit-transition: -webkit-transform 0.1s; transition: transform 0.1s; -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0);

	}

.fast-navigate .container.vs-move-right .vs-left,

.fast-navigate .container.vs-move-right .vs-left-outer,

.fast-navigate .container.vs-move-right .vs-current,

.fast-navigate .container.vs-move-right .vs-right {

 	-webkit-transition: -webkit-transform 0.1s; transition: transform 0.1s; -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0);

	}

.fast-navigate .container.vs-move-left .vs-nav-left,

.fast-navigate .container.vs-move-left .vs-nav-left-outer,

.fast-navigate .container.vs-move-left .vs-nav-current,

.fast-navigate .container.vs-move-left .vs-nav-right,

.fast-navigate .container.vs-move-left .vs-nav-right-outer {

 	-webkit-transition: -webkit-transform 0.1s, opacity 0.1s; transition: transform 0.1s, opacity 0.1s; -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0);

	}

.fast-navigate .container.vs-move-right .vs-nav-left,

.fast-navigate .container.vs-move-right .vs-nav-left-outer,

.fast-navigate .container.vs-move-right .vs-nav-current,

.fast-navigate .container.vs-move-right .vs-nav-right,

.fast-navigate .container.vs-move-right .vs-nav-right-outer {

 	-webkit-transition: -webkit-transform 0.1s, opacity 0.1s; transition: transform 0.1s, opacity 0.1s; -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0);

	}

/* Page Opacity Effect */

.vs-triplelayout .vs-right,

.vs-triplelayout .vs-left,

.vs-triplelayout .vs-left-outer,

.vs-triplelayout .vs-right-outer,

.container.vs-triplelayout.vs-move-left .vs-current,

.container.vs-triplelayout.vs-move-right .vs-current {

 	opacity: .3

	}

.container.vs-triplelayout.vs-move-left .vs-right,

.container.vs-triplelayout.vs-move-right .vs-left {

 	opacity: 1

	}

.vs-sidenav {

	display: none;

	}

.vs-sidenav div {

 	position: fixed; top: 0; z-index: 500; width: 10%; height: 100%; cursor: pointer;

	}

.vs-sidenav .vs-sidenav-left {

 	left: 0px

	}

.vs-sidenav .vs-sidenav-right {

 	right: 0px

	}

/* classic layout : for mobile and non supported browsers */

.classic-layout .wrapper {

	max-width: 1440px; margin-left: auto; margin-right: auto;

	}

	.classic-layout .vs-nav {

		margin-top: 2em; 

		}

	.classic-layout .vs-nav li a {

		font-size: 13px; font-weight: 400; display: inline-block; margin: 0 4px; padding: 6px 8px; color: #6A7686; letter-spacing: 0; border: 2px solid #DDE4E6; border-radius: 4px; line-height: 1;

		}

	/* Classic Layout Nav Active Item */

	.classic-layout .vs-nav li a:hover,

	.classic-layout .vs-nav li.current_page_item a {

	 	color: #fff; background: #345; border-color: transparent;

		}

	

/* SEARCH */

.header-search { 

	display: none; padding: 1.4em 0;

	}

.search-link { 

	cursor: pointer; 

	} 

.search-link:hover, 

.search-link.active { 

	border-color: rgba(0, 0, 0, 0) !important; background: #456 !important; 

	} 

#search-form { 

	position:relative; margin-left: -14px; 

	}

#search-form #search { 

	width: 280px; padding-right: 36px; outline: 0; 

	}

#search-form #search:focus { 

	color:#333; 

	}

#search-submit { 

	margin: 0 0 0 -40px; font-size:17px; text-shadow:none; color:#444; border:0; outline:0; padding:0; background:none; 

	}





/*  --------------------------------------------



	5. MODULES @modules : reusable styles

	

    -------------------------------------------- */



/* HEADING WITH ICON */

h2 i[class^="icon-"], h2 i[class*=" icon-"], h2 i.fa {

	font-size: 16px; margin-right: 14px; line-height: 39px; text-align: center; color: #B7C6C9; background: #fff; border-radius: 50%; border: 4px solid #F4F6F7; display: inline-block; width: 47px;

	}

	h2 i[class^="icon-"]:before, h2 i[class*=" icon-"]:before, h2 i.fa:before {

		display: inline; margin-left: 0; margin-right: 0;

		}



/* SECTION-TITLE */

.section-title { 

	position: relative; margin-bottom: 1em; font-size: 12px; letter-spacing: 1px; font-weight: 700; 

	}

.section-title:before { 

	content: ""; position:absolute; top: 50%; left: 0; margin-top: 3px; width: 100%; border-bottom: 4px solid #F4F6F7; 

	}

.section-title span { 

	position:relative; display: inline-block; padding-right: 1.4em; background: #fff; 

	}

.row + .section-title {

	margin-top: 3em;

	}

.section-title + p {

	margin-top: 2em;

	}



/* INTRO */

.intro {

	text-align: center; padding: 0 0 1em 0;

	}

	.intro h2 {

	    font-size: 2.0em; font-weight: 300; line-height: 1.4;

		}

	.intro h2 strong {

		letter-spacing: -1px; font-weight: 800;

		}



/* ROTATE WORDS */

.rotate-words {

	display: inline-block; min-width: 180px; min-height: 34px; text-align: left; text-indent: 4px;

	}

.rotate-words span {

	position: absolute; opacity: 0; font-weight: 800; letter-spacing: -1px;

	}

.rotate-words span.rotate-in {

	animation: rotateInWord .5s linear forwards;

	-webkit-animation: rotateInWord .5s linear forwards;

	}

.rotate-words span.rotate-out {

	animation: rotateOutWord .5s linear forwards;

	-webkit-animation: rotateOutWord .5s linear forwards;

	}

.rotate-words span:first-child {

	opacity: 1; 

	}

.no-csstransforms .rotate-words span {

	display: none; opacity: 1;

	}



@-webkit-keyframes rotateInWord {

    0% { opacity: 0; -webkit-transform: translateY(-30px); }

	100% { opacity: 1; -webkit-transform: translateY(0px); }

}

@-webkit-keyframes rotateOutWord {

    0% { opacity: 1; -webkit-transform: translateY(0px); }

	100% { opacity: 0; -webkit-transform: translateY(30px); }

}

@keyframes rotateInWord {

    0% { opacity: 0; transform: translateY(-30px); }

	100% { opacity: 1; transform: translateY(0px); }

}

@keyframes rotateOutWord {

    0% { opacity: 1; transform: translateY(0px); }

	100% { opacity: 0; transform: translateY(30px); }

}



/* TWITTER WIDGET */

.widget-twitter ul {

 	list-style: none; padding: 0;

	}

	.widget-twitter li {

 		position: relative; margin-bottom: .2em; padding-top: .1em; font-size: 14px;

		}

	.widget-twitter li:before {

 		content: "\f099"; position: absolute; top: -12px; left: 50%; font-size: 36px; color: #567; margin-left: -16px;

		}

	.widget-twitter .tweet {

		padding: 1.5em 2.4em; color: #6A7686; background: #E4F1F6; border-radius: 4px;

	}

	.widget-twitter .timePosted {

 		font-size: 10px; color: #B7C6C9; margin-top: -12px; text-align: center; letter-spacing: 1px; text-transform: uppercase;

		}

	.widget-twitter .timePosted a {

		color: #ccc;

		}

	.widget-twitter .interact {

		display: none; 

		}

	.widget-twitter ul li span + a {

 		float: right; margin-top: .4em; color: #aaa;

		}



/* SERVICE */

.service {

 text-align: center; padding: 1.6em 0 2em 0;

	}

.service:last-child:after {

 display: none;

	}

	.service i { 

		display: inline-block; width: 86px; line-height: 86px; font-size: 32px; color: #fff; border-radius: 50%; text-align: center; background: #5BCF80;

		}

	.service i:before { 

		margin: 0 .2em; display: inline-block; 

		}

	.service p {

		font-size: 15px; margin-top: .4em; color: #96A5A8;

		}

	.service h4 {

	 	font-size: 13px; letter-spacing: 1px; text-transform: uppercase; font-weight: 800;

		}

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

   .col-sm-6:nth-child(2n+1) {

       clear: left;

   }

}



/* PROCESS */

.process { 

	position: relative; text-align: center; 

	}

.process:before { 

	content: "\f178"; position:absolute; top: 50%; margin-top: -10px; right: -30px; 

	}

.process .process-box { 

	width: 120px; height: 120px; padding: 24px 10px; margin: 1em auto 3em; background: #EAEEEF; border-radius: 50%; 

	}

.process-box i { 

	font-size: 38px; width: 52px; line-height: 52px; 

	}

.process-box h4 { 

	margin: 0; font-weight: 400; font-size: 11px; letter-spacing: .07em;

	}

.row [class^="col-"]:last-child .process:before { 

	display: none; 

	}

		

/* FUN FACT */

.fun-fact { 

	padding: 2em .2em 4em 0; 

	}

	.fun-fact i { 

		display: block; float: left; margin-bottom: 12px; width: 82px; line-height: 64px; font-size: 61px; border-radius: 50%; text-align: center; 

		}

	.fun-fact i:before { 

		margin: 0 .2em; display: inline-block; 

		}

	.fun-fact h4 { 

		margin: 5px 0 0 96px; font-size: 24px; letter-spacing: 1px; line-height: 1.2; font-weight: 300; 

		}



/* CLIENT */

.client { 

	margin: 1em 0; text-align: center; 

	}

.client img { 

	max-width:90%; max-height: 64px; opacity: .4; 

	}

.client a:hover img { 

	opacity: 1; 

	}



/* TIMELINE */

.timeline {

 	position: relative; padding-left: 112px; padding-bottom: 8px;

	}

	.timeline h2 {

 		position: relative; margin-bottom: 2em; font-size: 19px; font-weight: 300; letter-spacing: 1px;

		}

		.timeline h2 [class^="icon-"], .timeline h2 [class*=" icon-"], .timeline h2 .fa {

			display: block; font-size: 28px; position: absolute; top: -27px; left: -112px; width: 86px; line-height: 78px; margin: 0;  z-index: 120;

			}

		.timeline h2 [class^="icon-"]:before, .timeline h2 [class*=" icon-"]:before, .timeline h2 i.fa:before {

			margin:0; 

			}		

.event {

	position: relative; padding: 26px 32px; margin-bottom: 3em; background: #ffffff; border: 3px solid #EDF1F3; border-radius: 6px;

	}

.event:after,

.event:before {

 	right: 100%; top: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none;

	}

.event:after {

 	border-right-color: #ffffff; border-width: 10px; margin-top: -10px;

	}

.event:before {

 	border-right-color: #EDF1F3; border-width: 15px; margin-top: -15px;

	}

	.event .date {

		position: absolute; top: 45%; margin-top: -24px; left: -106px; width: 68px; line-height: 58px; text-align: center; background: #5BCF80; display: block; z-index: 120; color: #fff; border-radius: 50%; border: 5px solid #FFF; font-family: Oswald; font-weight: 400; font-size: 11px; letter-spacing: 1px;

		}

	.event.current .date {

		border-color: #345; outline: 5px solid #FFF; background-color: #345;

		}

	.timeline + .timeline .event:last-child p:before {

		height: 76%

		}

	.event h4 {

		margin: 0; padding: 0;

		}

	.event h5 {

		margin: 0; padding: 0 0 .3em 0; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; font-weight: 700; color: #C9D5D6;

		}

	.event p {

		margin: .6em 0 .2em 0; font-size: 14px; letter-spacing: .02em;

		}

	.event p:before {

		display: block; content: ""; position: absolute; top: -30px; left: -72px; height: 160%; width: 4px; background: #F4F6F7;

		}



/* SKILLS */

.skillset {

 	padding: 0 0 3.2em 0

	}

.skill-unit {

 	padding-bottom: 0

	}

	.skill-unit h4 {

 		margin-bottom: -26px; font-weight: 800; font-size: 11px; letter-spacing: 1px; color: #fff; position: relative; z-index: 100; padding-left: 14px; text-transform: uppercase;

		}

	.skill-unit .bar {

		position: relative; width: 100%; height: 36px;

		}

		.skill-unit .bar .progress {

	 		position: absolute; top: 0; left: 0; width: 0; height: 100%; border-radius: 4px; background : #5BCF80; /*box-shadow: 4px 4px 0 #e7e7e7;*/

			}



/* TESTIMONIAL */

.testo-group {

	padding: 1em 0 2em 0;

	}

.testo {

 position: relative; padding: 1.4em 2.2em; margin: 0 16px 40px 0; background: #EFF4F5; border-radius: 6px;

	}

.testo:before {

 	display: block; content: "\f10d"; line-height: 1; font-size: 14px; position: absolute; left: 10px; top: 12px; color: #fff; border: 3px solid #FFF; padding: 4px 6px; border-radius: 50%;

	}

	.testo img {

 		display: block; float: right; max-width: 100px; border-radius: 50%; margin: -40px -60px 10px 20px; border: 8px solid #fff;

		}

	.testo h4 {

		position: relative; margin: 0; font-weight: 700; color: #6A7686; font-size: 16px;

		}

		.testo h4 span {

			display: inline-block; font-size: 11px; letter-spacing: .04em; font-weight: 700; margin-left: 1em; color: #BFC5CD; text-transform: uppercase; 

			}

	.testo p {

		position: relative; margin: .6em 0 0.2em 0; font-size: 14px; line-height: 150%; color: #6A7686;

		}

		

/* DOWNLOAD BUTTON */		

.download-button { 

	margin-bottom: 4em; 

	}

	.download-button .button { 

		padding: 1.7em 3em; margin-top: 1em;

		}

		

/* STAMP */

.stamp {

 	position: relative; float: left; margin-right: 1.6em; width: 114px; height: 134px; background: url(../images/bckg/stamp.png) 0 0 no-repeat;

	}

.stamp:after {

 	content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/bckg/stamp-mask.png) 0 0 no-repeat;

	}

	.stamp img {

		display: block; width: 94px; height: 114px; position: absolute; top: 10px; left: 10px;

		}

		

/* LETTER */		

.letter {

 	padding: 1.0em 0 3em 0; overflow: auto;

	}

.letter-title {

 	margin: 0 0 .6em 0; font-size: 3em; font-weight: 400; line-height: 120%; font-family: 'Tangerine', serif; color: #D0DADC;

	}

.letter-info {

 	margin-left: 130px;

	}

	.letter-info p i {

 		display: inline-block; padding: 7px 9px; font-size: 15px; color: #fff; background: #5BCF80; margin: 0 14px 10px 0; border-radius: 50%;

		}

.letter-info p {

 	margin: 0; font-size: 14px;

	}



/* SOCIAL LINKS */

.social {

 	padding: 0; margin: 2em 0 4em 0; list-style: none;

	}

	.social li {

 		display: inline-block; padding: 0; margin-bottom: -3px;

		}

		.social li a {

 			display: block; float: left; margin: 0 .4em .3em 0; text-align: center; font-size: 14px; font-family: "fontello"; width: 42px; line-height: 40px; color: #516075; border-radius: 4px; border: 1px solid #dde4e6;

			}

		.social li a.facebook:before {

 			content: '\e800'

			}

		.social li a.twitter:before {

 			content: '\e801'

			}

		.social li a.flickr:before {

 			content: '\e810'

			}

		.social li a.rss:before {

 			content: '\e80b'

			}

		.social li a.dribbble:before {

 			content: '\e806'

			}

		.social li a.lastfm:before {

 			content: '\e80a'

			}

		.social li a.linkedin:before {

 			content: '\e802'

			}

		.social li a.vimeo:before {

 			content: '\e80c'

			}

		.social li a.forrst:before {

 			content: '\e80d'

			}

		.social li a.skype:before {

 			content: '\e812'

			}

		.social li a.picasa:before {

 			content: '\e8e0'

			}

		.social li a.tumblr:before {

 			content: '\e815'

			}

		.social li a.behance:before {

 			content: '\e868'

			}

		.social li a.blogger:before {

 			content: '\e80f'

			}

		.social li a.delicious:before {

 			content: '\e818'

			}

		.social li a.digg:before {

 			content: '\e807'

			}

		.social li a.friendfeed:before {

 			content: '\e867'

			}

		.social li a.github:before {

 			content: '\e805'

			}

		.social li a.wordpress:before {

 			content: '\e816'

			}

		.social li a.google-plus:before {

 			content: '\e803'

			}

		.social li a.youtube:before {

 			content: "\e813"

			}

		.social li a.pinterest:before {

 			content: "\e804"

			}

		.social li a.instagram:before {

 			content: "\e8c2"

			}

		.social li a.stack-overflow:before {

 			content: "\e817"

			}

		.social li a.foursquare:before {

 			content: "\e80e"

			}

		.social li a.xing:before {

 			content: "\e809"

			}

		.social li a.weibo:before {

 			content: "\e811"

			}
		.social li a.soundcloud:before {

 			content: "\e814"

			}

		.social li a.fivehundredpx:before {

 			content: "\e856"

			}

		.social li a.slideshare:before {

 			content: "\e8db"

			}	

		.social li a.deviantart:before {

			content: "\e8e6";

			}

		.social li a:hover {

 			color: #fff !important; background-color: #333; border-color: transparent;

			}

		.social li a.facebook:hover {

 			background-color: #3c5fac

			}

		.social li a.twitter:hover {

 			background-color: #5ec3df

			}

		.social li a.flickr:hover {

 			background-color: #FF0084

			}

		.social li a.rss:hover {

 			background-color: #ff9900

			}

		.social li a.dribbble:hover {

 			background-color: #EA4C89

			}

		.social li a.lastfm:hover {

 			background-color: #D51007

			}

		.social li a.linkedin:hover {

 			background-color: #2089b5

			}

		.social li a.vimeo:hover {

 			background-color: #0dadd6

			}

		.social li a.google-plus:hover {

 			background-color: #c63d2d

			}

		.social li a.forrst:hover {

 			background-color: #5b9a68

			}

		.social li a.skype:hover {

 			background-color: #00aff0

			}

		.social li a.picassa:hover {

 			background-color: #ffd34e

			}

		.social li a.youtube:hover {

 			background-color: #c8312b

			}

		.social li a.pinterest:hover {

 			background-color: #cb2027

			}

		.social li a.tumblr:hover {

			background-color: #2C4762

			}

		.social li a.behance:hover {

 			background-color: #3878F6

			}

		.social li a.blogger:hover {

 			background-color: #fc9947

			}

		.social li a.delicious:hover {

 			background-color: #3274d1

			}

		.social li a.digg:hover {

 			background-color: #205891

			}

		.social li a.friendfeed:hover {

 			background-color: #2f72c4

			}

		.social li a.github:hover {

 			background-color: #222

			}

		.social li a.wordpress:hover {

 			background-color: #0083b3

			}

		.social li a.instagram:hover {

 			background-color: #3f729b

			}

		.social li a.stack-overflow:hover {

 			background-color: #F90

			}

		.social li a.foursquare:hover {

 			background-color: #009FE0

			}

		.social li a.xing:hover {

 			background-color: #006567

			}

		.social li a.weibo:hover {

 			background-color: #E64141

			}

		.social li a.soundcloud:hover {

 			background-color: #FA3219

			}

		.social li a.fivehundredpx:hover {

 			background-color: #222

			}

		.social li a.slideshare:hover {

 			background-color: #ED9D2C

			}

		.social li a.deviantart:hover {

			background-color: #506256;

			}

			

/* MAP */

.map {

 	margin: 1.6em 0 3em 0; line-height: 0; padding: 8px; border: 1px solid #E9EEEE; 

	}

	.map iframe {

 		width: 100%; border-width: 0; outline: none; height: 350px; border-radius: 4px;

		}

.map-canvas {

	height: 342px; margin: 0px; padding: 0px; line-height: 1.6;

	}

	.map-canvas img { 

		max-width: none; 

	}



/* FILTERS */

.filters {

 	list-style: none; padding: 0; margin: 2em 0; text-align: center;

	}

	.filters li {

 		display: inline-block; margin: .6em .4em;

		}

		.filters li a {

 			color: #b8c7ca; font-size: 11px; letter-spacing: .1em; padding: 7px 12px; border: 1px solid #DDE4E6; border-radius: 4px;

			}

		.filters li a:hover {

 			color: #345; border-color: #345;

			}

	.filters .current a,

	.filters .current a:hover {

 		color: #fff; background: #345; border-color: transparent;

		}

		

/* MEDIA GRID */

.media-grid {

 	min-height: 200px; width: 102.8%; margin-left: -1.4%;

	}

	.media-grid .media-cell {

 		float: left; width: 25%; padding: 10px 20px; margin-bottom: 20px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;

		}

	.media-grid .media-cell.x2 {

 		width: 50%

		}

	.media-grid .media-box {

		margin-bottom: 0; 

		}

		

/* MEDIA CELL DESC */

.media-cell-desc {

 	padding: 28px 40px; border-style: solid; border-width: 1px; background: #fff; border-color: #EAEDEF; border-radius: 0 0 4px 4px;

	}

.media-cell-desc h3 {

 	text-transform: uppercase; padding: 0; margin: 0px; font-weight: 700; font-size: 14px; letter-spacing: .03em;

	}

	.media-cell-desc h3 a {

		color: #444; border-bottom: 2px solid #FFF;

		}

		.media-cell-desc h3 a:hover {

			border-color: #ddd

			}

		.media-cell-desc h3 a:active {

			border-color: #555

			}

	.media-cell-desc p {

		font-size: 13px; letter-spacing: .04em; margin: 0; color: #a7b6b9;

		}

	.media-cell-desc .date {

		float: left; margin-right: 16px; padding: 6px 7px; text-align: center; font-size: 14px; line-height: 1; color: #fff; border-radius: 2px; margin-top: -66px; position: relative; background: #FFF; margin-left: 0%; background: #5BCF80;;

		}

		.media-cell-desc .date .day {

			display: block; font-size: 26px; letter-spacing: -1px; font-weight: 800; color: #fff;

			}

.portfolio-items .media-cell-desc {

	text-align: center; 

	}



/* MEDIA BOX */

.media-box {

 	position: relative; margin-bottom: 30px; background-color: #fff;

	}

	.media-box a {

		position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #fff; opacity: 0; filter: alpha(opacity = 0);

		}

	.media-box img {

		display: block; width: 100%;

		}	

	.media-box:hover img {

		-webkit-filter: saturate(20%); filter: saturate(20%);

		}

	.media-box .mask {

		opacity: 0; filter: alpha(opacity = 0); position: absolute; width: 100%; height: 100%; top: 0; left: 0; bottom: 0; right: 0; text-align: center; overflow: hidden; background: #33475D; background: rgba(51, 71, 93, 0.6);

		}

	.media-box:hover .mask {

		opacity: 1; filter: alpha(opacity = 100);

		}

	.media-box .mask:before {

		position: absolute; left: 50%; top: 50%; margin: -38px 0 0 -38px; width: 76px; line-height: 76px; font-size: 18px; text-align: center; content: "\f0ca"; color: #fff; background: #096; border-radius: 50%; 

		}

	.hentry.video .mask:before {

		content: "\f03d"

		}

	.hentry.audio .mask:before {

		content: "\e888"; font-family: Fontello;

		}

	.hentry.image .mask:before {

		content: "\f03e"

		}

	.hentry.url .mask:before {

		content: "\e86c"; font-family: Fontello;

		}

	.latest-posts .mask:before {

		content: "\f040"

		}



/* LATEST POSTS */

.latest-posts {

	margin-top: 2em;

	}



/* MEDIA WRAP */

.media-wrap iframe {

	width: 100%; 

	}



/* HTTP ALERT */

.http-alert {

 	text-align: center

	}

	.http-alert h1 {

 		margin: 0 0 .1em 0; font-size: 9em; letter-spacing: .03em; line-height: 1; color: #eee; text-shadow: 11px 12px 12px rgba(0, 0, 0, 0.2), -1px -1px 1px #345, 1px 1px 0 #345, 3px 3px 0 #345, 4px 4px 0 #345, 5px 5px 0 #345, 6px 6px 0 #345, 7px 7px 0 #345, 8px 8px 0 #345, 9px 9px 0 #345, 10px 10px 0 #345, 11px 11px 0 #345;

		}

	.http-alert p {

 		font-style: italic

		}



/* TAGLINE */

.tagline {

 	margin: 2em 0; padding: 1em 2em;

	}

	.tagline *:first-child {

		margin-top: 0

		}

	.tagline * {

 		padding-bottom: 0; margin-bottom: 0;

		}

	.tagline h3 {

 	 	font-size: 2em; padding: 0; line-height: 1.4; font-weight: 300; color: #6A7686;

		}

		

/* DROP CAP */

.drop-cap:first-letter {

 	font-size: 50px; font-weight: 800; line-height: .8; float: left; padding: 4px 16px 0px 0;

	}

	

/* ICON LIST */

.icon-list {

 	list-style: none; padding-left: 12px;

	}

	.icon-list i {

 		padding-right: 0; color: #B7C6C9; font-size: 14px; line-height: 23px; width: 27px; text-align: center; display: inline-block; margin-right: 12px;

		}



/* BUTTONS */

input[type=submit],

input[type=button],

button,

a.button {

 	display: inline-block; position: relative; padding: 1.3em 2.6em; font-size: 11px; letter-spacing: 1px; font-weight: 800; text-transform: uppercase; line-height: 1.2; border: 0; outline: 0; background: #fff; border: 2px solid #6A7686; color: #6A7686; text-shadow: none; border-radius: 4px;

	}

input[type=submit]:hover,

input[type=button]:hover,

button:hover,

a.button:hover,

input[type=submit].colored,

input[type=button],

button.colored,

a.button.colored {

 	color: #fff; background-color: #096; border-color: transparent;

	}

input[type=submit].colored:hover,

input[type=button]:hover,

button.colored:hover,

a.button.colored:hover {

	background: #085; 

	}

input[type=submit].colored:active,

input[type=button]:active,

button.colored:active,

a.button.colored:active {

	background: #074; 

	}

input[type=submit]:active,

input[type=button]:active,

button:active,

a.button:active {

 	color: #eee;

	}

/* Large Buttons */

input[type=submit].big,

input[type=button].big,

button.big,

a.button.big {

	padding: 1.8em 3.6em;

	}

/* Small Buttons */

input[type=submit].small,

input[type=button].small,

button.small,

a.button.small {

	font-size: 10px; padding: .8em 1.6em;

	}

/* blue buttons  */

input[type=submit].blue:hover,

input[type=button].blue:hover,

button.blue:hover,

a.button.blue:hover,

input[type=submit].blue.colored,

input[type=button].blue.colored,

button.blue.colored,

a.button.blue.colored {

 	background: #7DB7CE

	}

input[type=submit].blue.colored:hover,

input[type=button].blue.colored:hover,

button.blue.colored:hover,

a.button.blue.colored:hover {

 	background: #70ADC5

	}

input[type=submit].blue:active,

input[type=button].blue:active,

button.blue:active,

a.button.blue:active,

input[type=submit].blue.colored:active,

input[type=button].blue.colored:active,

button.blue.colored:active,

a.button.blue.colored:active {

 	background: #5E9BB3

	}

/* red buttons  */

input[type=submit].red:hover,

input[type=button].red:hover,

button.red:hover,

a.button.red:hover,

input[type=submit].red.colored,

input[type=button].red.colored,

button.red.colored,

a.button.red.colored {

 	background: #BE3C3A

	}

input[type=submit].red.colored:hover,

input[type=button].red.colored:hover,

button.red.colored:hover,

a.button.red.colored:hover {

 	background: #AD2B29

	}

input[type=submit].red:active,

input[type=button].red:active,

button.red:active,

a.button.red:active,

input[type=submit].red.colored:active,

input[type=button].red.colored:active,

button.red.colored:active,

a.button.red.colored:active {

 	background: #9B2A28

	}

/* green buttons  */

input[type=submit].green:hover,

input[type=button].green:hover,

button.green:hover,

a.button.green:hover,

input[type=submit].green.colored,

input[type=button].green.colored,

button.green.colored,

a.button.green.colored {

 	background: #63C76F

	}

input[type=submit].green.colored:hover,

input[type=button].green.colored:hover,

button.green.colored:hover,

a.button.green.colored:hover {

 	background: #4FAA5A

	}

input[type=submit].green:active,

input[type=button].green:active,

button.green:active,

a.button.green:active,

input[type=submit].green.colored:active,

input[type=button].green.colored:active,

button.green.colored:active,

a.button.green.colored:active {

 	background: #3F964A

	}

/* yellow buttons  */

input[type=submit].yellow:hover,

input[type=button].yellow:hover,

button.yellow:hover,

a.button.yellow:hover,

input[type=submit].yellow.colored,

input[type=button].yellow.colored,

button.yellow.colored,

a.button.yellow.colored {

 	background: #F5CA2B

	}

input[type=submit].yellow.colored:hover,

input[type=button].yellow.colored:hover,

button.yellow.colored:hover,

a.button.yellow.colored:hover {

 	background: #EBC22B

	}

input[type=submit].yellow:active,

input[type=button].yellow:active,

button.yellow:active,

a.button.yellow:active,

input[type=submit].yellow.colored:active,

input[type=button].yellow.colored:active,

button.yellow.colored:active,

a.button.yellow.colored:active {

 	background: #DFBB38

	}

/* Buttons with icons */

input[type=submit].button-icon,

input[type=button].button-icon,

button.button-icon,

a.button.button-icon {

	 padding-left: 2.8em

	}

input[type=submit].button-icon.big,

input[type=button].button-icon.big,

button.button-icon.big,

a.button.button-icon.big {

 	padding-left: 5em

	}

input[type=submit] i,

input[type=button] i,

button i,

a.button i {

 	position: absolute; top: .45em; left: 1.2em; line-height: 1; font-size: 1.4em; margin-right: .4em; margin-left: -0.35em; margin-bottom: -1em; color: #B7C6C9;

	}

input[type=submit].big i,

input[type=button].big i,

button.big i,

a.button.big i {

 	top: .7em; left: 1.1em; font-size: 23px;

	}

input[type=submit]:hover i,

input[type=button]:hover i,

button:hover i,

a.button:hover i,

input[type=submit].colored i,

input[type=button].colored i,

button.colored i,

a.colored i {

 	color: #fff; color: rgba(255, 255, 255, 0.9);

	}

/* Colored Buttons */

input[type=submit].colored,

input[type=button].colored,

button.colored,

a.button.colored {

 	color: #fff; border-color: transparent;

	}



/* TABS */

.tabs {

 	font-size: 1em; margin-bottom: 2em;

	}

	.tabs .tab-titles {

 		padding: 0; margin: 0 0 -2px 0;

		}

		.tabs .tab-titles li {

 			display: inline-block

			}

			.tabs .tab-titles li a {

 				display: inline-block; padding: 1em 2em; font-size: 12px; letter-spacing: .06em; font-weight: 400; border: 0; cursor: pointer;

				}

			.tabs .tab-titles li a.active {

 				font-weight: 700; background-color: #fff; border-bottom-color: #fff; border: 2px solid #EAEEEF; border-bottom: none; border-radius: 6px 6px  0 0;

				}

	.tabs .tab-content {

 		margin-top: -1px; border: 2px solid #EAEEEF; border-radius: 0 6px 6px 6px;

		}

		.tabs .tab-content > div {

 			padding: 2em; font-size: 15px; display: none;

			}

			

/* TOGGLES */

.toggle-group {

	margin-bottom: 2em;

	}

.toggle {

 	font-size: 1em;

	}

	.toggle h4 {

 	position: relative; font-size: 1em; font-weight: 300; border-left: 0; padding: .8em 1em .8em 1.8em; margin: 0; cursor: pointer; border-bottom: 1px solid #EAEEEF;

		}

	.toggle h4.active {

 		border-bottom: 0; font-weight: 600;

		}

	.toggle h4:before {

 		content: "\f067"; color: #B7C6C9; position: absolute; top: 1.7em; left: 0.4em; font-size: 12px; line-height: 1;

		}

	.toggle h4.active:before {

 		content: "\f068";

		}

	.toggle .toggle-content {

 		display: none; padding: .2em 0 1em 1.8em; border-bottom: 1px solid #eee;

		}

		

/* ALERTS */

.alert {

 	position: relative; padding: 1.2em 1em 1em 4.4em; margin-bottom: 2em; font-size: 15px; border-radius: 6px; border: 3px solid #EAEEEF;

	}

.alert:before {

 	content: "\f0c6"; color: #B7C6C9; position: absolute; top: 0.6em; left: .9em; font-size: 27px; line-height: 1;

	}

.alert.success {

 	border-color: #AEE2A3

	}

.alert.success:before {

 	content: "\f087"

	}

.alert.info {

 	border-color: #E4E6C4

	}

.alert.info:before {

 	content: "\f05a"

	}

.alert.error {

 	border-color: #EE8F8F

	}

.alert.error:before {

 	content: "\f06a"

	}

.alert strong {

 	font-weight: 800

	}



/* CTA */

.cta,

.project-action {

 	margin: 2em 0; padding: 2em 0; border-style: solid; border-width: 5px 0; border-color: #EAEEEF;

	}

	.cta h3,

	.cta p {

		margin: 0

		}

	.cta .cta-button {

		text-align: right

		}

	.cta p {

		font-size: .9em

		}

	

/* PROJECT ACTION */

.project-action {

 	padding: 2em 0 0 0; text-align: center;

	}

	.project-action .button {

 		margin-right: 1em; margin-bottom: 3.2em

		}

	.project-action .button:last-child {

 		margin-right: 0

		}	

	

/* LAUNCH */

.launch {

 text-align: center; padding: 2.6em 0;

	}

	.launch .button {

  padding: 1.8em 3.6em; line-height: 1;

		}	

	

/* SITE ALERT */

.site-alert {

 	display: none; position: fixed; z-index: 9900; top: 50%; left: 50%; margin: -80px 0 0 -80px; font-size: 6em; line-height: 1; padding: .4em .5em; color: #fff; text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.1); background: #264150; background: rgba(38, 65, 80, 0.4); border-radius: 20px;

	}

.site-alert:before {

 	content: "\f14a"

	}

.site-alert.error {

 	background: #F30; background: rgba(206, 78, 62, 0.6);

	}

.site-alert.error:before {

 	content: "\f00d"

	}	



/* CONTACT FORM */

.contact-form {

 	margin: 1.6em 0 3em 0; overflow: auto;

	}

	.contact-form p {

		margin: 0 0 1.8em 0; width: 50%; float: left;

		}

	.contact-form p:nth-of-type(1) {

		padding-right: 32px;

		}

	.contact-form p:nth-of-type(3), 

	.contact-form p:nth-of-type(4) {

		 width: 100%

		}	

	.contact-form input:not([type=submit]):not([type=button]):not([type=file]):not([type=radio]):not([type=checkbox]),

	.contact-form textarea {

		width: 100%; display: block; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;

		}

	.contact-form textarea {

		height: 100px

		}

	

/* ISOTOPE FILTERING */

.isotope-item {

 	z-index: 2

	}

.isotope-hidden.isotope-item {

 	pointer-events: none; z-index: 1;

	}

.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;

		}

.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;

	}



/* GRID PAGE */

.show-grid div {

 	font-size: .8em; padding-top: .9em; padding-bottom: .9em; text-align: center; margin-bottom: 1.4em; border: 1px solid #EAEEEF; border-radius: 4px;

	}

	

/* SHORTCODES PAGE */

.show-buttons .button {

 	margin: 0 1em 1em 0

	}



/* FANCYBOX STYLES */

#fancybox-tmp, 

#fancybox-loading, 

#fancybox-overlay, 

#fancybox-wrap {

	z-index: 5000;

	}

.lightbox-active .container {

 	-webkit-filter: saturate(10%); filter: saturate(10%);

	}

.lightbox.hidden {

 	display: none

	}

#fancybox-loading {

 	display: none !important

	}

.fancy-ico {

 	padding: 16px 16px 13px 16px; line-height: 100%; font-size: 8px; color: #333; background: #fff; border-radius: 4px;

	}

#fancybox-left:hover .fancy-ico,

#fancybox-right:hover .fancy-ico {

 	color: #fff; background: #333;

	}

#fancybox-close:before,

.fancy-ico:before {

 	display: inline

	}

#fancybox-close:before {

 	content: "\f00d"; font-size: 1em;

	}

.fancy-ico:before {

 	font-size: 3em

	}

#fancybox-right-ico:before {

 	content: "\f105"

	}

#fancybox-left-ico:before {

 	content: "\f104"

	}

.fancy-ico,

#fancybox-close {

 	display: inline-block; cursor: pointer;

	}

.fancy-ico:hover,

#fancybox-close:hover {

 	opacity: 1

	}

#fancybox-close {

 	padding: 26px; line-height: 80%; font-size: 16px; opacity: 1; color: #fff; background: #5BCF80; border-radius: 50%;

	}

#fancybox-close:hover {

 	background: #D4643E

	}

	

/* PORTFOLIO DETAILS */

.p-overlay-on #container {

 	position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: -1; -webkit-filter: saturate(10%); filter: saturate(10%);

	}

.p-overlay {

 	display: none; position: absolute; z-index: 3000; top: 0; left: 0; width: 100%; height: auto; min-height: 100%; min-height: 100vh; overflow: auto; background: #fff;

	}

.portfolio-single {

 	margin: 0 auto; width: 90%; max-width: 1440px;

	}

.single-page-layout .portfolio-single {

 	padding-top: 2em

	}

.one-page-layout .portfolio-single {

 	padding-top: 3em

	}

.portfolio-field {

 	padding-bottom: 2em

	}

	.portfolio-field p {

 		margin-top: 0

		}

	.portfolio-field img,

	.portfolio-field .fluid-width-video-wrapper,

	.portfolio-field .media-wrap {

 		margin-bottom: 50px

		}

	.portfolio-field .flexslider .slides img {

		margin-bottom: 0; 

		}

.portfolio-title h2 {

 	margin: 0; font-size: 2em;

	}

.portfolio-field h3 {

 	margin: 2em 0 .6em 0; font-size: 13px; letter-spacing: .09em; text-transform: uppercase; font-weight: 800; color: #d2252b;

	}

.portfolio-field h3:first-child {

 	margin-top: 0

	}

.portfolio-field .btn {

 	margin: 2em auto 2em

	}

.portfolio-field .launch {

 	text-align: left;

	}

/* TAGS  */

.tags {

 	margin: 0 0 1em 0; padding: 5px; list-style: none;

	}

	.tags li {

 		display: inline-block

		}

	.tags a {

 		display: inline-block; line-height: 30px; font-size: 12px; position: relative; margin: 0 14px 8px 6px; padding: 0 10px 0 12px; background: #EAEEEF; text-transform: uppercase; color: #6A7686; border-radius: 0 2px 2px 0;

		}

	.tags a ,

	.tags a:hover {

		color: #345;

		}

	.tags a:before {

 		content: ""; float: left; position: absolute; top: 0px; left: -11px; width: 0; height: 0; border-color: transparent; border-right-color: #EAEEEF; border-style: solid; border-width: 15px 11px 15px 0;

		}

	.tags a:after {

 		content: ""; position: absolute; top: 11px; left: 0; float: left; width: 6px; height: 6px; border-radius: 50%; background: #fff;

		}

/* portfolio details nav  */

.portfolio-nav {

 	text-align: right

	}

.portfolio-nav.bottom {

 	margin-bottom: 40px

	}

.portfolio-nav .button {

 	display: inline-block; text-align: center; padding: 0; line-height: 33px; width: 40px; font-size: 18px; color: #B7C6C9; border: 3px solid #DDE4E6; cursor: pointer; border-radius: 50%;

	}

.portfolio-nav a.button:hover {

	color: #096; border-color: #096; background: none;

	}

.icon.prev:before {

 	content: "\f104"

	}

.icon.next:before {

 	content: "\f105"

	}

.portfolio-nav a.button.back {

 	display: none; margin-left: 34px; border-width: 0; line-height: 70px; width: 70px; font-size: 16px; color: #fff; background: #5BCF80; border-radius: 50%;

	}

.portfolio-nav a.button.back:before {

 	display: inline; content: "\f00d"; font-size: 1em;

	}

.portfolio-nav a.button.back:hover {

 	color: #fff; background: #D4643E

	}

.one-page-layout .portfolio-nav a.button.back {

 	display: inline-block

	}



/* BLOG */

.blog-posts .entry-title {

 	margin: 6px 0 0 0; font-size: 1.8em; text-align: left;

	}

.entry-title a {

 	color: #345

	}

.entry-title a:hover {

 	color: #096

	}

/* entry-meta */

.blog-posts .entry-meta {

 	float: left; width: 66px; font-weight: 400; font-size: 0.750em;

	}

	.blog-posts .entry-meta > span {

	 	display: block; margin: 0 auto 14px auto; max-width: 55px; min-height: 20px; text-align: center;

		}

.entry-meta .post-format {

    display: inline-block; font-size: 17px; width: 53px; line-height: 46px; padding: 0; background: #fff; color: #6A7686; border: 3px solid #DDE4E6; border-radius: 50%;

	}

	.hentry .entry-date .day, .hentry .entry-comment .count  {

 		display: block; margin: 0; line-height: 1; font-size: 32px; font-weight: 800;

		}

.entry-meta {

 	color: #BFC5CD; font-weight: 400; font-size: 0.750em;

	}

	.entry-meta span {

		display: inline-block; margin-right: 8px; margin-bottom: 12px;

		}

	.entry-meta a,

	.post-pagination li a {

		padding: 4px 10px; margin: 0 2px; border: 1px solid #DDE4E6; border-radius: 4px; text-transform: uppercase; font-size: 11px; letter-spacing: .03em; font-weight: 800;

		}

.entry-meta a,

.nav-single a,

.comment-meta a,

.comment-reply-link,

.navigation a,

.post-pagination a,

.related-posts a,

.archives a,

.tabs .tab-titles li a {

	color: #6A7686

	}

.entry-meta a:hover,

.nav-single a:hover,

.navigation a:hover,

.post-pagination a:hover,

.archives a:hover,

.entry-content a.more-link:hover,

.archives-tag.post-list a:hover,

.tagcloud a:hover {

	color: #fff; border-color: transparent;

	}

.entry-meta a:active,

.nav-single a:active,

.comment-meta a:active,

.comment-reply-link:active,

.navigation a:active,

.post-pagination a:active,

.related-posts a:active,

.archives a:active,

.entry-content a.more-link:active {

	color: #eee

	}

	.entry-meta .edit-link {

		float: right

		}

.entry-content .media-wrap, .entry-content .flexslider {

	margin-top: 22px; 

	}

/* more link */

a.more-link {

	display: block; max-width: 17em; text-align: center; margin: 2em 0 0 0; padding: 1.4em 0; color: #6A7686; font-weight: 400; font-size: 12px; letter-spacing: .03em; background: none; border: 2px solid #DDE4E6; border-radius: 4px; text-transform: uppercase; font-weight: 800;

	}

a.more-link:hover {

 	background: #096

	}

/* featured image */

.featured-image {

 	margin-top: 26px

	}

	.featured-image img {

 		display: block; margin: 0 auto;

		}

	.featured-image .media-wrap {

		margin-bottom: 1.4em; 

		}

.blog-posts .featured-image,

.blog-posts .entry-header,

.blog-posts .entry-content {

 	margin-left: 90px

	}

	

/* POST FORMATS */

.format-status .post-format:before,

.format-aside .post-format:before,

.format-link .post-format:before,

.format-chat .post-format:before,

.format-audio .entry-meta .post-format:before,

.format-image .entry-meta .post-format:before,

.format-gallery .entry-meta .post-format:before {

 	font-family: Fontello

	}

/* standart  */

.hentry .post-format:before {

 	content: "\f040"

	}

/* sticky  */

.hentry.sticky .post-format:before {

 	content: "\f08d"

	}

/* quote  */

.format-quote .post-format:before {

 	content: "\f10d"

	}

.format-quote blockquote {

 	font-size: 2em; margin: 0; font-weight: 300; padding: 0 0 2em 0; line-height: 1.5; margin-top: -8px;

	}

.format-quote blockquote:before {

 	content: ""

	}

/* link  */

.format-link .post-format:before {

 	content: "\e86c"

	}

.format-link .link-content > a:first-child {

 	font-size: 1.5em; font-weight: 300; word-break: break-all; text-transform: uppercase; padding: .4em 1.2em; margin-top: 1em; border-radius: 8px; color: #456; display: inline-block; border: 2px dashed #DDE4E6; 	

	}

.format-link .link-content > a:first-child:hover {

 	border-color: #096

	}

.format-link header {

 	text-align: center

	}

/* status  */

.format-status .post-format:before {

 	content: "\e87d"

	}

.format-status .entry-content > p:first-child {

 	padding: .5em 1em; border: 1px solid #DDE4E6; border-radius: 4px; font-size: 1.6em; line-height: 1.5; font-weight: 300;

	}

/* chat  */

.format-chat .post-format:before {

 	content: "\e87b"

	}

.chat-transcript {

	margin-top: 1.2em; 

	}

.chat-row:after {

 	display: table; content: ""; line-height: 0;

	}

.chat-author {

 	float: left; width: 88px; text-transform: uppercase;

	}

.chat-text {

 	padding-left: 100px

	}

	.chat-text p {

		margin-top: 0

		}

.chat-author cite {

 	display: inline-block; min-width: 80%; margin-right: .1em; font-size: 0.9em; font-weight: 800;

	}

/* video  */

.format-video .entry-meta .post-format:before {

 	content: "\f008"

	}

/* audio  */

.format-audio .entry-meta .post-format:before {

 	content: "\e888"

	}

.mejs-audio {

 	margin: 0 0 2em 0; 

	}

/* image  */

.format-image .entry-meta .post-format:before {

 	content: "\e8c4"

	}

.format-image .entry-content {

 	margin-bottom: 1em

	}

/* gallery  */

.format-gallery .entry-meta .post-format:before {

 	content: "\e8c4"

	}

.format-gallery .flexslider {

 	margin-bottom: 50px

	}

.flex-direction-nav a {

 	text-align: center; color: #fff;

	}

.flex-direction-nav a:hover {

 	color: #fff

	}

.flex-direction-nav a:before {

 	display: block; width: 100%; text-align: center; font-size: 20px; line-height: 37px;

	}

.flex-direction-nav .flex-next:before {

 	content: "\f105"

	}

.flex-direction-nav .flex-prev:before {

 	content: "\f104"

	}

.flex-title {

 	position: absolute; bottom: 20px; left: 20px; margin: 0; padding: .5em 1em; font-size: 14px; color: #333; background: #fff; background: rgba(255, 255, 255, 0.95);

	}

.flex-control-nav {

 	bottom: -46px

	}

.flex-control-paging li a {

 	width: 12px; height: 12px; border: 2px solid #DDE4E6; background: none;

	}

.flex-control-paging li a:hover {

 	border-color: #096; background: none;

	}

.flex-control-paging li a.flex-active {

 	border-color: transparent; background: #096;

	}

/* aside  */

.format-aside .post-format:before {

 	content: "\e86d"

	}

.format-aside .entry-content .aside-content {

 	position: relative; padding: .2em 2em .2em 3.7em; margin: 0 0 2em 0; border-radius: 4px; line-height: 1.9; font-style: italic; font-family: Georgia, "Times New Roman", Times, serif; color: #5a4f43; text-shadow: 0 1px 0 white; background: #FFFFF4; border: 1px solid #E0DACE;

	}

.format-aside .entry-content .aside-content:before {

 	content: ''; position: absolute; top: 0; bottom: 0; left: 2em; width: 4px; border: solid #efcfad; border-color: rgba(239, 207, 173, 0.9); border-width: 0 1px;

	}



/* PAGINATION */

.navigation,

.post-pagination {

 	padding: 3em 0

	}

	.navigation > div {

 		width: 50%; float: left;

		}

	.navigation a {

 		display: inline-block; padding: 1.6em 2.2em; border: 2px solid #DDE4E6; border-radius: 4px; font-size: 11px; letter-spacing: .06em; font-weight: 800; text-transform: uppercase;

		}

	.navigation .nav-next {

 		text-align: right

		}

	.navigation .meta-nav {

 		margin-right: .5em

		}

	.navigation .nav-next .meta-nav {

 		margin-left: .5em; margin-right: 0;

		}

/* NUMBERED PAGINATION */

	.post-pagination ul {

 		list-style: none; text-align: center; padding: 0;

		}

	.post-pagination li {

 		display: inline-block; font-size: .9em; margin: .3em .1em;

		}

		.post-pagination li a {

 			display: inline-block; padding: .5em 1.2em; margin: 0 4px; font-weight: 400; border-width: 2px;

			}

	.post-pagination li.current a,

	.post-pagination li.current a:hover {

 		border-color: #6A7686; font-weight: 800; background: #fff; color: #6A7686; cursor: default;

		}

.related-posts li a:hover,

.nav-single a:hover {

 	text-decoration: underline

	}

/* MEDIA ELEMENT PLAYER STYLES */

.mejs-container {

 	background: none

	}

	.mejs-container .mejs-controls,

	.mejs-controls .mejs-volume-button .mejs-volume-slider {

 	background: #25313C

		}

.mejs-container.mejs-audio .mejs-controls {

 	border-radius: 4px

	}

.mejs-controls .mejs-button button:focus {

 	outline: none

	}

.mejs-container .mejs-controls {

 	height: 50px

	}

	.mejs-container .mejs-controls div {

 	width: 50px; height: 50px;

		}

.mejs-controls .mejs-button button {

 	margin: 17px 17px

	}

.mejs-controls .mejs-time-rail .mejs-time-total {

 	margin: 15px 5px

	}

.mejs-container .mejs-controls .mejs-time {

 	height: 41px

	}

	.mejs-container .mejs-controls .mejs-time span {

 	margin-top: 11px

		}

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total,

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {

 	top: 21px

	}

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {

 	width: 62px

	}

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total,

.mejs-controls .mejs-time-rail .mejs-time-total,

.mejs-controls .mejs-time-rail .mejs-time-loaded {

 	background: #565C61

	}

.mejs-controls div.mejs-horizontal-volume-slider {

 	height: 50px; width: 80px;

	}

.mejs-container .mejs-controls .mejs-time {

 	padding-left: 8px

	}

.mejs-controls .mejs-volume-button .mejs-volume-slider {

 	left: 10px; border-radius: 4px 4px 0 0;

	}

.mejs-controls .mejs-time-rail .mejs-time-current,

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {

 	background: #096

	}

.mejs-overlay-loading {

	background: rgba(0, 0, 0, 0.6); border-radius: 8px;

	}



/* BLOG SINGLE */

.blog-single .entry-content p {

	font-size: 18px; line-height: 29px;

	}

.blog-single .entry-meta {

 	line-height: 1.9; text-align: center; padding-bottom: 20px;

	}

.nav-single,

.navigation {

 	font-size: .8em; overflow: auto;

	}

.nav-single {

	padding: 3em 0; 

	}

	.nav-single a {

 		font-size: 1.4em; text-transform: uppercase; font-weight: 300; line-height: 1.4;

		}

	.nav-single .meta-nav {

 		margin-right: .6em

		}

	.nav-single .nav-next .meta-nav {

 		margin-left: .6em; margin-right: 0;

		}

	.nav-single .nav-next {

 		text-align: right

		}

.nav-single h4,

.related-posts h3,

.about-author > h3,

.entry-meta h3 {

	font-size: 12px; font-weight: 900; letter-spacing: .15em; color: #DDE4E6;

	}

	

/* COMMENTS */

.comments-title,

#reply-title {

	font-size: 18px; font-weight: 400;

	}

.comments-area {

 	padding: 2em 0

	}

.commentlist {

 	padding: .5em 0 1.5em 0

	}

.comments-area ol {

 	list-style: none; padding-left: 0;

	}

	.comments-area ol li {

 		padding-top: 1em

		}

	.comments-area ol ol {

 		margin-left: 13%

		}

		.comments-area ol ol li {

 			padding-top: 0

			}

		.comments-area ol ol ol {

 			margin-left: 15%

			}

.comments-area article {

 	position: relative; margin-left: 105px; margin-bottom: 2em; padding: 1em 1.6em; border: 2px solid #EAEEEF; border-radius: 8px;

	}

.comments-area article:after,

.comments-area article:before {

 	top: 37px; right: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none;

	}

.comments-area article:after {

 	border-color: rgba(255, 255, 255, 0); border-right-color: #ffffff; border-width: 10px; margin-top: -10px;

	}

.comments-area article:before {

 	border-color: transparent; border-right-color: #EAEEEF; border-width: 13px; margin-top: -13px;

	}

.comment-meta img {

 position: absolute; top: 0; left: -105px; border-radius: 50%;

	}

.comments-area ol ol .comment-meta img {

 	width: 65px; left: -95px;

	}

.comments-area ol ol article {

 	position: relative; margin-left: 95px;

	}

.comment-meta .fn,

.comment-reply-link {

 	font-size: 13px; font-style: normal; font-weight: 800; text-transform: uppercase;

	}

	.comment-meta .fn + a {

 		float: right; font-size: .8em; color: #D1DCDE; border-bottom: 0;

		}

.comment-content {

 	font-size: .9em;

	}

	.comment-content p {

 		margin: .8em 0 .2em 0

		}

.comment .reply {

 	text-align: right

	}

.comment-reply-link {

 	font-weight: normal; font-size: 11px; letter-spacing: 1px; font-weight: 800;

	}

.comment-meta a:hover,

.comment-meta .fn + a:hover,

.comment-reply-link:hover {

 	color: #096

	}

/* comment by post author  */

.bypostauthor > article {

 	border-color: #096

	}

.bypostauthor > article:before {

 	border-right-color: #096

	}

	

/* COMMENT FORM */

#respond {

 	padding: 0 0 1em 0

	}

	#respond h3 {

 		font-size: 1.6em; font-weight: 900;

		}

#reply-title {

	margin-bottom: 1.5em; 

	}

	#reply-title small {

		padding-left: 14px; text-transform: uppercase; font-size: 16px;

		}

.form-allowed-tags,

.comment-notes {

 	display: none; font-size: .9em;

	}

	.form-allowed-tags code {

 		margin-top: 1em

		}

.form-submit {

 	margin-top: 2em

	}

	

/* ABOUT THE AUTHOR */

.about-author {

 	padding: 1em 0

	}

.author-bio {

 	padding: 1.4em 0; border: 1px solid #EAEEEF; border-right: 0; border-left: 0; overflow: hidden;

	}

.author-img {

 	width: 126px; float: left;

	}

	.author-img img {

		display: block; margin-top: 6px; max-width: 96px; border-radius: 50%;

		}

.author-info .author-name {

 	text-transform: uppercase; font-weight: 800;

	}

.author-info p {

 	font-size: .9em; margin: .4em 0;

	}

.author-info *:first-child {

 	margin-top: 0

	}

/* RELATED POSTS */

.related-posts {

 	padding: 2em 0 0; text-align: center;

	}

	.related-posts ol {

 		list-style: none; padding-left: 0;

		}

		.related-posts ol li a {

			display: inline-block; margin-bottom: .4em; line-height: 1.2; font-size: 1.2em; text-transform: uppercase; font-weight: 300;

			}		

/* TAGS  */

.blog-single footer.entry-meta {

 	position: relative; padding-bottom: 1em;

	}







/*  --------------------------------------------



	7. MEDIA QUERIES - responsive layouts

	

    -------------------------------------------- */

	

/* DESKTOPS MEDIUM */

@media screen and (min-width: 1200px) { 

	

	 /* increase column gutter on large screens */

	 .row {

		margin-left: -20px;

		margin-right: -20px;

		}

	.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {

		padding-left: 20px; padding-right: 20px;

		}

	

	.vs-triplelayout .wrapper > section {

	 	width: 90%; left: 5%;

		}

	.vs-triplelayout .wrapper .vs-left {

		left: -85%; /* 90 - 5 */

		}

	.vs-triplelayout .wrapper .vs-left-outer {

		left: -175%; /* - 85 - 90 */

		}

	.vs-triplelayout .wrapper .vs-current {

		position: relative; z-index: 100;

		}

	.vs-triplelayout .wrapper .vs-right {

		left: 95%; /* 90 + 5 */

		}

	.vs-triplelayout .wrapper .vs-right-outer {

		left: 185%; /* 95 + 90 */

		}

	.vs-sidenav {

	 	display: block;

		}

		

	/* CLASIC LAYOUT */

	.classic-layout .wrapper > section {

	 	width: 100%;

		}

	}

	

/* DESKTOPS LARGE */	

@media screen and (min-width: 1400px) { 



	.content {

	 	padding: 1em 3em;

		}

	.vs-triplelayout .wrapper > section {

		width: 80%; left: 10%;

		}

	.vs-triplelayout .wrapper .vs-left {

		left: -70%; /* 80 - 10 */
		}

	.vs-triplelayout .wrapper .vs-left-outer {

		left: -150%; /* - 70 - 80 */

		}

	.vs-triplelayout .wrapper .vs-right {

		left: 90%; /* 80 + 10 */

		}

	.vs-triplelayout .wrapper .vs-right-outer {

		left: 170%; /* 90 + 80 */

		}

	}

	

/* DESKTOPS XLARGE */	

@media screen and (min-width: 1600px) { 

	/* increase column gutter on large screens */

	 .row {

		margin-left: -40px;

		margin-right: -40px;

		}

	.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {

		padding-left: 40px; padding-right: 40px;

		}

	.content {

	 	padding: 1em 4em;

		}

	}

	

/* TABLETS */

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

	

	/* LAYOUT */

	.header {

		width: 100%;

		}

	.vs-nav li a {

	 	font-size: 2.4em

		}

	.content {

		padding: 1em 3em; 

		}

		

	/* PORTFOLIO SINGLE */

	.portfolio-single {

		width: 80%;

		}

	.portfolio-field {

	 	padding: 0 0 1em 0;

		}

		

		.portfolio-field img,

		.portfolio-field .fluid-width-video-wrapper,

		.portfolio-field .media-wrap {

			margin-bottom: 1.8em

			}

	.portfolio-nav,

	.portfolio-title {

	 	text-align: center

		}

	.portfolio-nav {

	 	padding-bottom: 1.5em

		}

	.portfolio-title h2 {

	 	font-size: 1.5em; padding-left: 0;

		}

	.portfolio-field h3 {

	 	margin-top: 1em

		}

	.portfolio-field .launch {

		text-align: center;

		}

		

	/* PROCESS */

	.row [class^="col-"]:nth-child(3n) .process:before { 

		display: none; 

		}

		

	}

	

/* SMARTPHONES */

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



	/* MOBILE LAYOUT : more space for content */

	.content {

		padding: 1em;

		}

	.header {

	 	width: 100%; padding: 1.4em 1em .2em 1em;

		}

		.header img {

	 		max-height: 120px;

			}

	.single-page-layout .vs-nav {

	 	margin-top: 0;

		}

	.vs-triplelayout .vs-nav {

	 	height: 40px;

		}

	.vs-triplelayout .vs-nav li a {

		width: auto; font-size: 130%; letter-spacing: -1px;

		}

	.classic-layout .vs-nav {

		margin-top: 1em; 

		}

		

	/* page title */

	.entry-title {

		font-size: 1.6em; margin-top: .6em;

		}

	 .entry-content {

		 padding-top: 0; 

		 }

	

	/* intro text */

	.intro h2 {

		font-size: 1.6em; 

		}

	.rotate-words {

		min-height: 28px; min-width: 166px;

		}

	

	/* timeline */

	.timeline {

		padding-left: 0; 

		}

	.timeline h2 [class^="icon-"], .timeline h2 [class*=" icon-"], .timeline h2 .fa {

		position: relative; top: auto; left: auto; margin: -12px auto 6px auto; border: 0; line-height: 1;

		}

	.event {

		padding: 16px; margin-top: 104px;

		}

	.event:first-of-type {

		margin-top: 116px; 

		}

	.event:first-of-type .date {

		top: -74px; 

		}

	.event:before, .event:after {

		display: none; 

		}

	.event .date {

		top: -64px; left: 50%; margin-left: -32px; 

		}

	.timeline h2, .event h4, .event h5 {

		text-align: center; 

		}

	.event p:before {

		left: 50%; z-index: -1; 

		}

	.timeline .event:last-child p:before {

		height: 100%;

		}

	

	/* PROCESS */

	.row [class^="col-"]:nth-child(3n) .process:before { 

		display: inline-block; 

		}

	.row [class^="col-"]:nth-child(2n) .process:before { 

		display: none; 

		}

	

	/* testomonial */

	.testo {

		padding: 1.0em 1.4em; margin: 50px 0 90px 0;

		}

	.testo:last-of-type {

		margin-bottom: 20px; 

		}

	.testo img {

		float: none; margin: -80px auto 10px auto; max-width: 88px; border-width: 0px;

		}

	.testo h4 {

		text-align: center;

		}

	.testo h4 span {

		display: block; margin-left: 0;

		}

	

	/* skills */

	.skill-unit h4 {

		font-size: 14px; margin: 1em 0 0 0; color: #345; padding: 0; font-weight: 400;

		}

	.skill-unit .bar {

		height: 6px;

		}

	

	/* download button */

	.download-button {

		text-align: center;

		}

	

	/* tagline */

	.tagline {

		padding: .2em 1em; 

		}

	.tagline h3 {

		font-size: 1.4em;

		}

	

	/* blockquotes */

	blockquote {

		padding-left: 1em; padding-right: 1em; font-size: 1.3em; 

		}

	blockquote:before {

		top: -0.6em; font-size: 1em;

		}

	

	/* tabs */

	.tabs .tab-content > div {

		padding: .8em 1.2em; 

		}

	.tabs .tab-titles li a {

		padding: .7em 0.8em; 

		}

	

	/* cta */

	.cta,

	.cta .cta-button {

	 	text-align: center

		}

		.cta .cta-button {

	 		margin-top: 1em

			}

	

	/* project-action */

	.project-action {

	 	padding-top: 1.2em

		}

		.project-action .button {

	 		margin-bottom: 1.2em

			}

			

	/* letter */

	.letter-title {

		text-align: center; font-size: 2.2em;

		}

	.stamp {

    	float: none; margin: 0 auto 16px auto;

		}

	.letter-info {

		margin-left: 0;

	}

	

	/* contact form */

	.contact-form p {

		width: 100%; padding-right: 0 !important;

		}

	

	/* BLOG INDEX */

	.blog-posts .entry-meta {

	 	float: none; width: 100%; margin-bottom: 14px;

		}

		.blog-posts .entry-meta .entry-date {

	 		display: none

			}

	.blog-posts .featured-image,

	.blog-posts .entry-header,

	.blog-posts .entry-content {

	 	margin-left: 0

		}

	.blog-posts .entry-title {

	 	font-size: 1.2em; text-align: center

		}

	.blog-posts .hentry {

		padding-bottom: 1em; 

		}

	.entry-meta .post-format {

		font-size: 19px; width: 44px; line-height: 34px;

		}

	a.more-link {

		padding: 1em; max-width: none;

		}

	.format-quote blockquote {

		padding-bottom: 1em; font-size: 1.4em; text-align: center;

		}

	.format-quote blockquote cite { 

		text-align: center; margin: 8px 0 0;

		}

	.format-link .link-content > a:first-child {

		font-size: 1.2em;

		}

	.link-content {

		text-align: center;

		}

	.format-status .entry-content > p:first-child {

		font-size: 1.3em;

		}

	.navigation, .post-pagination {

		padding-top: 0; 

		}

	.navigation a {

		padding: 1em; 

		}

	   

	/* BLOG SINGLE */

	.blog-single .entry-content p {

		line-height: 29px;

		}

	.related-posts ol li a {

		margin-bottom: .8em; 

		}

	.comments-area h2,

	#respond h2 {

		font-size: 1.2em; 

		}

	.comments-title span {

	 	display: block

		}

	.comment-meta .fn + a {

	 	display: block; float: none;

		}

	.comments-area ol ol {

	 	margin-left: 5%

		}

		.comments-area ol ol ol {

	 		margin-left: 8%

			}

	.comment-meta img {

	 	position: static; top: auto; left: auto; float: left; margin: 0 1em .6em 0;

		}

	.comment-meta .fn {

	 	display: block;

		}

	.comments-area article,

	.comments-area ol ol article {

	 	margin-left: 0

		}

	.comment-content {

	 	clear: left

		}

	.about-author {

	 	text-align: center

		}

	.author-img {

		float: none; width: auto;

		}

		.author-img img {

			margin: 0 auto 1em auto

			}

	

	/* PORTFOLIO SINGLE */

	.one-page-layout .portfolio-single {

 		padding-top: 1.4em;

		}

	

	}	

	

	

	

/*  --------------------------------------------



	8. THEME - customize colors etc...

	

    -------------------------------------------- */

body {

 	color: #345;

	}

/* Links */

a {

 	color: #096;

	}

a:hover {

 	color: #5BCF80;

	}



/* Text Selection */

::selection {

 	text-shadow: none; color: #333; background: #FFFFCF;

	}

::-moz-selection {

 	text-shadow: none; color: #333; background: #FFFFCF;

	}



/* Service Icons */	

.color1 i { 

	background: #F8CB30; 

	}

.color2 i { 

	background: #74BADE; 

	}

.color3 i { 

	background: #5BCF80; 

	}

.color4 i { 

	background: #E25E5B; 

	}	

	

/* PRIMARY COLOR : #21B572

   ================================================== */

.navigation a:hover,

.pagination a:hover,

.entry-meta a:hover,

.single-page-layout .vs-nav li i:hover,

.media-box .mask:before,

.button.primary:hover,

a.more-link:hover,

.flex-control-paging li a.flex-active,

.mejs-controls .mejs-time-rail .mejs-time-current,

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {

 	background: #21B572

	}

.entry-title a:hover,

.portfolio-nav a.button:hover,

.related-posts li a:hover,

.nav-single a:hover,

.comment-meta a:hover, 

.comment-meta .fn + a:hover, 

.comment-reply-link:hover {

 	color: #21B572

	}

.portfolio-nav a.button:hover,

.format-link .link-content > a:first-child:hover,

.flex-control-paging li a:hover,

.bypostauthor > article {

	border-color: #21B572

	}

	

/* SECONDARY COLOR : #5BCF80 - lighter than primary color

   ================================================== */	

.skill-unit .bar .progress,

.event .date,

.letter-info p i,

.media-cell-desc .date,

#nprogress .bar,

#fancybox-close,

.portfolio-nav a.button.back {

	background: #5BCF80;

	}

#nprogress .spinner-icon {

  border-top-color: #5BCF80; border-left-color: #5BCF80;

	}



/* FIX FOR CHROME FULSCREEN VIDEO ISSUE */

:-webkit-full-screen-ancestor:not(iframe) *:not(video) {

    animation: none; -webkit-animation: none;

    }