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

	Theme Name: Focus by FutureBuilding

	Description: An Effective Theme for Creative People & Agencies.
	
	Author: FutureBuilding
	Author URI:http://themeforest.net/user/futurebuilding
	Theme Developer: FutureBuilding (http://themeforest.net/user/futurebuilding)
	
	Tags: business, clean, flat, fullscreen, ipad, iphone, minimal, one page, parallax, personal, portfolio, responsive, resume, retina
	
	License: GNU General Public License version 3.0
	License URI: http://www.gnu.org/licenses/gpl-3.0.html
	Version: 1.0
	
	All files, unless otherwise stated, are released under the GNU General Public License
	version 3.0 (http://www.gnu.org/licenses/gpl-3.0.html)

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


/* Table of contents

	Basics
	1.1 Basic Styling
	1.2 Typography
	1.3 Links
	1.4 Buttons and Icons
	1.5 Forms
	1.6 Other General Elements

	Main Page
	2.1 Navigation
	2.2 Home
	2.3 Introduction
	2.4 Services
	2.5 Process
	2.6 Portfolio
	2.7 Call to Action
	2.8 About Us
	2.9 About Me
	2.10 Resume
	2.11 Quote
	2.12 Contact

	Portfolio Detail Page
	3.1 Portfolio Header
	3.2 Portfolio Introduction
	3.3 Portfolio Images slider
	3.4 Portfolio Details
	3.5 Portfolio Gallery
	3.6 Portfolio Navigation

	Responsive Settings
	4.1 Tablet Portrait
	4.2 Mobile Landscape
	4.3 Mobile Portrait

*/

/*--------------------------------------------------------------------- */
/*   Import Skin */
/*--------------------------------------------------------------------- */

@import url('css/color.php');

/* ==================== 1.1 Basic Styling ==================== */

*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
			box-sizing: border-box;
}

html {
	height: 100%;
}

body {
	height: 100%;
	color: #5c5c5c;
	background: #ffffff;
	font-family: 'Raleway', Helvetica, Arial, sans-serif;
	font-size: 15px;
	text-align: center;
}

::selection {
	background: #1a1a1a;
	color: #ffffff;
}

::-moz-selection {
	background: #1a1a1a;
	color: #ffffff;
}


/* ==================== 1.2 Typography ==================== */

p {
	font-size: 15px;
	line-height: 25px;
	margin-bottom: 25px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	color: #1a1a1a;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

h1 {
	font-size: 24px;
	line-height: 30px;
}

h2 {
	font-size: 24px;
	line-height: 30px;
}

h3 {
	font-size: 16px;
	line-height: 25px;
}

h4 {
	font-size: 15px;
	line-height: 25px;
}

h5 {
	font-size: 14px;
	line-height: 25px;
}

h6 {
	font-size: 12px;
	line-height: 25px;
}


h1.dark,
h2.dark,
h3.dark,
h4.dark,
h5.dark,
h6.dark,
p.dark,
span.dark {
	color: #1a1a1a;
}

h1.grey,
h2.grey,
h3.grey,
h4.grey,
h5.grey,
h6.grey,
p.grey,
span.grey {
	color: #c0c0c0;
}

h1.white,
h2.white,
h3.white,
h4.white,
h5.white,
h6.white,
p.white,
span.white {
	color: #ffffff;
}

a.normal,
span.normal {
	color: #1a1a1a;
}

b,
strong {
	font-weight: 900;
}

em {
	font-style: italic;
}

small {
	font-size: 80%;
}

ol,
ul {
	line-height: 25px;
	margin-bottom: 25px;
}

.script {
	font-family: 'Volkhov', Georgia, Times, serif;
	font-style: italic;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
}

.text-left {
	text-align: left;
}

.text-right {
	text-align: right;
}

.text-center {
	text-align: center;
}

h1.fittext {
	margin-bottom: 10px;
	font-size: 80px;
	font-weight: 700;
	line-height: 100%;
}

h1.hugetext {
	margin-bottom: 10px;
	font-size: 180px;
	font-weight: 700;
	line-height: 100%;
}

p.uppercase {
	font-size: 16px;
	margin-bottom: 0;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.type-2 h1.fittext {
	font-size: 60px !important;
	line-height: 60px;
	font-weight: bold;
	margin: -22px 0 0 0;
}


/* ==================== 1.3 Links ==================== */

a,
a:hover,
a:focus {
	text-decoration: none;
	outline: 0;
}


a:hover {
	color: #1a1a1a;
}
a img {
	text-decoration: none;
	vertical-align: bottom;
}

a.inverted {
	color: #1a1a1a;
}



/* ==================== 1.4 Buttons and Icons ==================== */

.button {
	color: #ffffff;
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: 8px 14px 7px;
	border-radius: 0;
	margin: 25px 5px;
}

.button-large {
	color: #ffffff;
	display: inline-block;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: 10px 18px 9px;
	border-radius: 0;
	margin: 25px 5px;
}

.button.border,
.button.white-border,
.button.dark-border {
	padding: 6px 12px 5px;
}

.button-large.border,
.button-large.white-border,
.button-large.dark-border {
	padding: 8px 16px 7px;
}

.button:hover,
.button-large:hover {
	color: #ffffff;
			box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	   -moz-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	-webkit-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
}

.button i.icon-left,
.button-large i.icon-left {
	margin-right: 8px;
}

.button i.icon-right,
.button-large i.icon-right {
	margin-left: 8px;
}

/* Fixing the broken box model for input / buttons */
input[type="button"].button,
input[type="submit"].button,
button.button {
	padding: 13px 14px 13px;
}

input[type="button"].button-large,
input[type="submit"].button-large,
button.button-large {
	padding: 13px 18px 12px;
}

input[type="button"].button.border,
input[type="button"].button.white-border,
input[type="button"].button.dark-border,
input[type="submit"].button.border,
input[type="submit"].button.white-border,
input[type="submit"].button.dark-border,
button.button.border,
button.button.white-border,
button.button.dark-border {
	padding: 11px 12px 11px;
}

input[type="button"].button-large.border,
input[type="button"].button-large.white-border,
input[type="button"].button-large.dark-border,
input[type="submit"].button-large.border,
input[type="submit"].button-large.white-border,
input[type="submit"].button-large.dark-border,
button.button-large.border,
button.button-large.white-border,
button.button-large.dark-border {
	padding: 11px 18px 10px;
}

/* Icons */
i.small-icon {
	color: #ffffff;
	display: inline-block;
	vertical-align: middle; 
	text-align: center;
	width: 24px;
	height: 24px;
	font-size: 14px;
	line-height: 24px;
	margin: 25px 2px;
	border-radius: 50%;
}

i.medium-icon {
	color: #ffffff;
	display: inline-block;
	vertical-align: middle; 
	text-align: center;
	width: 40px;
	height: 40px;
	font-size: 18px;
	line-height: 38px;
	margin: 25px 5px;
	border-radius: 50%;
}

i.column-icon {
	color: #ffffff;
	display: inline-block;
	vertical-align: middle; 
	text-align: center;
	width: 60px;
	height: 60px;
	font-size: 28px;
	line-height: 60px;
	border-radius: 50%;
	margin-bottom: 25px;
}

i.column-icon:hover {
	font-size: 36px;
}

/* Styling for Buttons and Icons */
.white-bg {
	background: #ffffff!important;
	color: #1a1a1a;
}

.white-bg:hover {
	color: #1a1a1a;
			box-shadow: inset 0px 0px 100px rgba(0,0,0,0.2);
	   -moz-box-shadow: inset 0px 0px 100px rgba(0,0,0,0.2);
	-webkit-box-shadow: inset 0px 0px 100px rgba(0,0,0,0.2);
}

.dark-bg {
	background: #1a1a1a!important;
	color: #ffffff;
}

.dark-bg:hover {
	color: #ffffff;
			box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	   -moz-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	-webkit-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
}

.border {
	background: 0!important;
}

.border:hover {
			box-shadow: inset 0px 0px 100px rgba(0,0,0,0.2);
	   -moz-box-shadow: inset 0px 0px 100px rgba(0,0,0,0.2);
	-webkit-box-shadow: inset 0px 0px 100px rgba(0,0,0,0.2);
}

.white-border {
	background: 0!important;
	color: #ffffff;
	border: 2px solid #ffffff;
	outline: -2px;
}

.white-border:hover {
	color: #ffffff;
			box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	   -moz-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	-webkit-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
}

.dark-border {
	background: 0!important;
	color: #1a1a1a;
	border: 2px solid #1a1a1a;
}

.dark-border:hover {
	color: #1a1a1a;
			box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	   -moz-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	-webkit-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
}


/* ==================== 1.5 Forms ==================== */

form {
	margin: 0;
	padding: 0;
	display: block;
}

input[type=text],
input[type=url],
input[type=tel],
input[type=number],
input[type=email],
textarea {
	width: 100%;
	height: 40px;
	display: block;
	border: 2px solid #ffffff;
	background: #ffffff;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 15px;
	padding-left: 6px;
	border-radius: 0;
	margin: 0 0 10px 0;
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}

textarea {
	padding-top: 9px;
	overflow: auto;
	vertical-align: top;
	resize: none;
}

.placeholder {
	color: #808080;
}

:-moz-placeholder {
	color: #808080;
}

::-moz-placeholder {
	color: #808080;
}

:-ms-input-placeholder {
	color: #808080;
}

::-webkit-input-placeholder {
	color: #808080;
}

input:focus,
textarea:focus {
	border-color: #c0c0c0;
	outline: 0;
	color: #1a1a1a;
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}

input.error,
textarea.error {
	border-color: #e53a2e;
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}


/* ==================== 1.6 Other General Elements ==================== */

hr {
	border-top: 1px solid #c0c0c0;
	border-right: 0;
	border-bottom: 1px solid #c0c0c0;
	border-left: 0;
	margin: 60px 0;
}

img {
	max-width: 100%;
	height: auto;
}

.image-center {
	margin: 0 auto;
	text-align: center;
}

.image-circle {
	border-radius: 50%;
}

.column-border {
	border-left: 2px solid #d6d6d6;
	padding-left: 20px;
}

/* More control over margins */
.margin {
	margin-top: 25px!important;
	margin-bottom: 25px!important;
}
.margin-top {
	margin-top: 25px!important;
}

.margin-bottom {
	margin-bottom: 25px!important;
}

.no-margin {
	margin: 0!important;
}

.no-margin-top {
	margin-top: 0!important;
}

.no-margin-bottom {
	margin-bottom: 0!important;
}

/* Title settings */
.title h1 {
	font-size: 14px;
	color: #c0c0c0;
}

.title hr {
	width: 60px;
	margin: 20px auto 30px;
	border: 1px solid #c0c0c0;
}

/* Headers */
.header {
	position: relative;
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
	background-position: center bottom;
	width: 100%;
	height: 480px;
}

.header.type-2 {
	height: 477px;
}

.header-inherited {
	position: inherited;
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
	background-position: center center;
	width: 100%;
	height: 480px;
}

.header-center {
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
	display: inline-block;
	width: auto;
}

/* Animation of the content inside the header */
.header-center.fade-in {
	zoom: 1;
	animation: fadeit 1s ease-out forwards;
	animation-iteration-count: 1;
	-webkit-animation: fadeit 1s;
	-webkit-animation-iteration-count: 1;
}

@keyframes fadeit {
	from { top:46%; filter: alpha(opacity=0); opacity: 0; }
	to { top:50%; filter: alpha(opacity=100); opacity: 1; }
}

@-webkit-keyframes fadeit
{
	from { top:46%; filter: alpha(opacity=0); opacity: 0; }
	to { top:50%; filter: alpha(opacity=100); opacity: 1; }
}

/* Text ticker */
.text-ticker {
	width: 100%;
	height: 50px;
	margin: 0 auto;
	overflow: hidden;
	position: absolute;
	top: 40%;
}

.text-ticker ul {
	-webkit-animation: ticker 5s cubic-bezier(1, 0, .5, 0) infinite;
	   -moz-animation: ticker 5s cubic-bezier(1, 0, .5, 0) infinite;
		-ms-animation: ticker 5s cubic-bezier(1, 0, .5, 0) infinite;
			animation: ticker 5s cubic-bezier(1, 0, .5, 0) infinite;
}

/* Uncomment this if you want to pause the text on hover 
.text-ticker ul:hover {
	-webkit-animation-play-state: paused;
	   -moz-animation-play-state: paused;
		-ms-animation-play-state: paused;
			animation-play-state: paused;
}*/

.text-ticker li {
	font-weight: 700;
	color: #ffffff;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	line-height: 50px;
}


/* Smooth hovers */
a,
a:hover,
i,
i:hover,
a img,
a img:hover,
input[type="button"],
input[type="submit"],
button {
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}

a i,
a i:hover {
	-webkit-transition: none;
	   -moz-transition: none;
		-ms-transition: none;
		 -o-transition: none;
			transition: none;
}

/* Pace loading bar */
.business .pace .pace-progress {
	position: fixed;
	z-index: 2000;
	top: 0;
	left: 0;
	height: 3px;

	-webkit-transition: width 1s;
	-moz-transition: width 1s;
	-o-transition: width 1s;
	transition: width 1s;
}

.personal .pace .pace-progress {
	background: #3CAEC3;
	position: fixed;
	z-index: 2000;
	top: 0;
	left: 0;
	height: 3px;

	-webkit-transition: width 1s;
	-moz-transition: width 1s;
	-o-transition: width 1s;
	transition: width 1s;
}

.pace-inactive {
	display: none;
}

/* SoundCloud iframe popup */
.soundcloud-popup .mfp-iframe {
	height: 182px;
}


/* ==================== 2.1 Navigation ==================== */

.menu {
	position: fixed;
	right: -200px;
	width: 260px;
	height: 100%;
	top: 0;
	z-index: 10;
	text-align: left;
}

.menu-left {
	position: fixed;
	left: -200px;
	width: 260px;
	height: 100%;
	top: 0;
	z-index: 10;
	text-align: left;
}

.menu.menu-open {
	right: 0px;
}

.menu-left.menu-open {
	left: 0px;
}

.menu-wrap {
	position: absolute;
	top: 0;
	left: 60px;
	background: #1a1a1a;
	width: 200px;
	height: 100%;
}

.menu-left .menu-wrap {
	left: 0!important;
}

.menu h1.logo a,
.menu-left h1.logo a {
	font-family: 'Raleway', Helvetica, Arial, sans-serif;
	font-size: 16px;
	font-weight: 800;
	letter-spacing: 0.15em;
	line-height: 40px;
	text-transform: uppercase;
	color: #ffffff;
	margin-top: 20px;
}

.menu img.logo,
.menu-left img.logo {
	margin: 20px 0;
	max-width: 160px;
}

.menu a,
.menu-left a  {
	margin-left: 20px;
	color: #808080;
	display: block;
	font-size: 12px;
	font-weight: 700;
	line-height: 40px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.menu a:hover,
.menu-left a:hover {
	color: #ffffff;
}

.menu a:active,
.menu-left a:active {
	color: #ffffff;
}

.menu a > i,
.menu-left a > i  {
	float: left;
	display: inline-block;
	vertical-align: middle; 
	text-align: left;
	width: 25px;
	font-size: 14px;
	line-height: 40px;
	margin: 25px 2px;
}

.menu-left .menu-close {
	display: none;
}

.menu-close,
.menu-close-left {
	cursor: pointer;
	display: block;
	position: absolute;
	font-size: 14px;
	color: #808080;
	width: 40px;
	height: 40px;
	line-height: 40px;
	top: 20px;
	right: 5px;
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}

.menu-close:hover,
.menu-close-left:hover {
	color: #ffffff;
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}

/* Push the body after clicking the menu button */
.body-push {
	overflow-x: hidden;
	position: relative;
	left: 0;
}

.body-push-toright {
	left: 200px;
}

.body-push-toleft {
	/*left: -200px;*/
	margin-right:200px !important;
}

.menu,
.menu-left,
.body-push {
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
		-ms-transition: all .3s ease;
		 -o-transition: all .3s ease;
			transition: all .3s ease;
}

#menuToggle {
	position: absolute;
	top: 20px;
	left: 0;
	z-index: 11;
	display: block;
	text-align: center;
	font-size: 14px;
	color: #ffffff;
	width: 40px;
	height: 40px;
	line-height: 40px;
	cursor: pointer;
	background: rgba(0,0,0,0.25);
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}

#menuToggleLeft {
	position: absolute;
	top: 20px;
	right: 0;
	z-index: 11;
	display: block;
	text-align: center;
	font-size: 14px;
	color: #ffffff;
	width: 40px;
	height: 40px;
	line-height: 40px;
	cursor: pointer;
	background: rgba(0,0,0,0.25);
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}

#menuToggle:hover,
#menuToggleLeft:hover {
	color: #ffffff;
	background: rgba(0,0,0,0.2);
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}


/* ==================== 2.2 Home ==================== */

/* Slides css */
#slides {
	position: relative;
}

#slides .slides-container {
	/*display: none;*/
	margin: 0;
}

#slides .scrollable {
	*zoom: 1;
	position: relative;
	top: 0;
	left: 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	height: 100%;
}

#slides .scrollable:after {
	content: "";
	display: table;
	clear: both;
}

/* Slides navigation arrows */
.slides-navigation {
	margin: 0 auto;
	position: absolute;
	z-index: 21;
	width: 100%;
}

.slides-navigation a {
	position: absolute;
	font-size: 28px;
	line-height: 28px;
	bottom: 21px;
	color: #ffffff;
	zoom: 1;
	filter: alpha(opacity=50);
	opacity: 0.5;
}

.slides-navigation a.prev {
	left: 20px;
}

.slides-navigation a.next {
	right: 20px;
}

.slides-navigation a.prev:hover,
.slides-navigation a.next:hover {
	filter: alpha(opacity=100);
	opacity: 1;
}

/* Slides pagination indicators */
.slides-pagination {
	position: absolute;
	z-index: 20;
	bottom: 30px;
	text-align: center;
	width: 100%;
}

.slides-pagination a {
	color: #ffffff;
	background: #ffffff;
	filter: alpha(opacity=50);
	opacity: 0.5;
	width: 30px;
	height: 4px;
	display: -moz-inline-stack;
	display: inline-block;
	vertical-align: middle;
	*vertical-align: auto;
	zoom: 1;
	*display: inline;
	margin: 2px;
	overflow: hidden;
	text-indent: -100%;
}

.slides-pagination a:hover,
.slides-pagination a.current {
	filter: alpha(opacity=100);
	opacity: 1;
}

/* Fullscreen fixed background */
.fullscreen-image {
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
	background-position: center center;
	width: 100%;
	height: 100%;
}


/* ==================== 2.3 Introduction ==================== */

.introduction {
	background: #ffffff;
	width: 100%;
	padding-top: 60px;
	padding-bottom: 80px;
}


/* ==================== 2.4 Services ==================== */

.services {
	padding-top: 60px;
	padding-bottom: 80px;
	background: #f7f7f7;
}

/* Services slider */
#services-slider .servicesLink {
	zoom: 1;
	visibility: visible!important;
	filter: alpha(opacity=100);
	opacity: 1!important;
}

/* Arrow controls */
.services-arrow-prev,
.services-arrow-next {
	display: block;
	width: 40px;
	height: 40px;
	color: #ffffff;
	font-size: 28px;
	line-height: 38px;
	position: absolute;
	bottom: 44%;
	z-index: 24;
}

.services-arrow-prev {
	text-indent: -2px;
	left: 0;
}

.services-arrow-next {
	text-indent: 2px;
	right: 0;
}

.services-arrow-prev:hover,
.services-arrow-next:hover {
	color: #ffffff;
	-webkit-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	   -moz-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
			box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
}

/* Circle controls */
.services-buttons {
	margin: 0 auto;
}

.services-buttons a {
	display: inline-block;
	vertical-align: middle; 
	text-align: center;
	width: 140px;
	height: 140px;
	font-size: 56px;
	line-height: 136px;
	margin: 20px 10px;
	color: #c0c0c0;
	border: 2px solid #c0c0c0;
	border-radius: 50%;
}

.services-buttons a i {
	display: inline-block;
	vertical-align: middle;
	text-align: center;
	width: 140px;
	height: 140px;
	line-height: 136px;
	margin-bottom: 15px;
}

.services-buttons a:hover {
	font-size: 70px;
}



/* ==================== 2.5 Process ==================== */

.process {
	color: #ffffff;
	width: 100%;
	padding-top: 60px;
	padding-bottom: 105px;
	display: none;
}

.process .title hr {
	border: 1px solid #ffffff;
}

.process h1,
.process h2,
.process h3,
.process h4,
.process h5,
.process h6,
.process p {
	color: #ffffff;
}

.process h3 {
	margin-top: 0;
}

.process p {
	font-size: 13px;
	margin-bottom: 0;
}

i.process-icon {
	display: inline-block;
	vertical-align: middle; 
	text-align: center;
	width: 140px;
	height: 140px;
	font-size: 56px;
	line-height: 136px;
	margin-top: 35px;
	margin-bottom: 15px;
	color: #ffffff;
	border: 2px solid #ffffff;
	border-radius: 50%;
}

i.process-icon:hover {
	font-size: 70px;
}


/* ==================== 2.6 Portfolio ==================== */

.portfolio {
	padding-top: 60px;
	padding-bottom: 80px;
}

/* Styles for the textual navigation */
a.filter {
	cursor: pointer;
	color: #1a1a1a;
}

a.filter.light {
	color: #c0c0c0;
}

a.filter.light.active {
	color: #c0c0c0;
}

[data-filter="all"],
.filtered [data-filter="all"].active {
	display: none;
}

.filtered [data-filter="all"] {
	display: inline;
}

/* Portfolio items */
#portfolio-grid .mix{
	zoom: 1;
	filter: alpha(opacity=0);
	opacity: 0;
	display: none;
}

.project-item {
	position: relative;
	color: #ffffff;
	line-height: 0;
	margin-top: 10px;
	margin-bottom: 10px;
	-webkit-transition: all .3s ease-in-out;
	   -moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		 -o-transition: all .3s ease-in-out;
			transition: all .3s ease-in-out;
}

.project-hover {
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
	color: rgba(255,255,255,0.0);
	background: rgba(0,0,0,0.0);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.1em;
	line-height: 20px;
	text-transform: uppercase;
	visibility: visible;
	-webkit-transition: all .3s ease-in-out;
	   -moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		 -o-transition: all .3s ease-in-out;
			transition: all .3s ease-in-out;
}

.project-item a:hover > .project-hover {
	color: rgba(255,255,255,1);
	background: rgba(0,0,0,0.5);
	-webkit-transition: all .3s ease-in-out;
	   -moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		 -o-transition: all .3s ease-in-out;
			transition: all .3s ease-in-out;
}

.project-hover span {
	display: inline-block;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
}

.project-hover b {
	color: rgba(255,255,255,0.0);
	font-family: 'Volkhov', Georgia, Times, serif;
	font-size: 14px;
	font-style: italic;
	font-weight: normal;
	letter-spacing: 0;
	text-transform: none;
	padding-top: 0;
	display: inline-block;
	-webkit-transition: all .3s ease-in-out;
	   -moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		 -o-transition: all .3s ease-in-out;
			transition: all .3s ease-in-out;
}

.project-hover span.plus {
	font-size: 120px;
	font-weight: 100;
}

.project-item a:hover > .project-hover b {
	color: rgba(255,255,255,0.5);
	-webkit-transition: all .3s ease-in-out;
	   -moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		 -o-transition: all .3s ease-in-out;
			transition: all .3s ease-in-out;
}

/* ==================== 2.7 Call to Action ==================== */

.call-to-action {
	color: #ffffff;
	width: 100%;
	padding-top: 60px;
	padding-bottom: 60px;
}

.call-to-action h1,
.call-to-action h2,
.call-to-action h3,
.call-to-action h4,
.call-to-action h5,
.call-to-action h6 {
	color: #ffffff;
}

.call-to-action p,
.call-to-action .button,
.call-to-action .button-large {
	margin-bottom: 0;
}


/* ==================== 2.8 About Us ==================== */

.about-us {
	background: #f7f7f7;
	width: 100%;
	padding-top: 0px;
	padding-bottom: 80px;
}

.about-us .header {
	margin-bottom: 50px;
}

/* Avatars */
.row.avatars {
	margin: 25px auto;
}

.avatars > .columns {
	margin-bottom: 20px;
	background: #ffffff;
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}

.avatars > .columns:hover {
	margin-top: -25px;
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}

.avatars img {
	margin-bottom: 10px;
}

.avatars p.script {
	font-size: 14px;
	line-height: 20px;
	color: grey;
	margin: 0 20px;
}

.avatars p {
	font-size: 13px;
	line-height: 20px;
	margin: 0 20px;
}

.avatars i {
	color: #ffffff;
	background: #c0c0c0;
}



/* ==================== 2.9 About Me ==================== */

.about-me {
	padding-top: 0;
	padding-bottom: 80px;
}

.about-me .header {
	margin-bottom: 50px;
}

.avatar-about-me {
	margin-bottom: 25px;
}


/* ==================== 2.10 Resume ==================== */

.resume {
	background: #f7f7f7;
	width: 100%;
	padding-top: 60px;
	padding-bottom: 80px;
}

.resume h1,
.resume h2,
.resume h3,
.resume h4,
.resume h5,
.resume h6 {
	margin-top: 25px;
}

.resume .title h1,
.resume .title h2 {
	margin-top: 0;
}

h1.years,
h2.years,
h3.years,
h4.years,
h5.years,
h6.years {
	font-size: 24px;
	font-weight: 300;
	letter-spacing: 0;
	line-height: 25px;
	color: #c0c0c0;
	margin-top: 22px;
}


/* ==================== 2.11 Quote ==================== */

.quote {
	color: #c0c0c0;
	background: #333333;
	width: 100%;
	padding-top: 40px;
	padding-bottom: 50px;
}

.quote p.quote-symbol {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 120px;
	line-height: 120px;
	font-weight: 400;
	color: #595959;
	margin-bottom: -80px!important;
}

.quote h1,
.quote h2,
.quote h3,
.quote h4,
.quote h5,
.quote h6 {
	font-size: 24px;
	font-weight: 700;
	color: #c0c0c0;
	letter-spacing: 0.1em;
	line-height: 30px;
	text-transform: uppercase;
	margin-top: 15px;
}

.quote p {
	color: #808080;
}

i.rating {
	font-size: 14px;
	line-height: 40px;
	color: #f7b736;
}

/* Arrow controls */
.quote-arrow-prev,
.quote-arrow-next {
	display: block;
	width: 40px;
	height: 40px;
	color: #ffffff;
	font-size: 28px;
	line-height: 38px;
	position: absolute;
	bottom: 46%;
	z-index: 211;
}

.quote-arrow-prev {
	text-indent: -2px;
	left: 0;
}

.quote-arrow-next {
	text-indent: 2px;
	right: 0;
}

.quote-arrow-prev:hover,
.quote-arrow-next:hover {
	color: #ffffff;
			box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	   -moz-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	-webkit-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
}


/* ==================== 2.12 Contact ==================== */

.contact {
	color: #ffffff;
}

.contact .header-inherited {
	padding-top: 80px;
}

.contact h1,
.contact h2,
.contact h3,
.contact h4,
.contact h5,
.contact h6,
.contact p,
.contact a {
	color: #ffffff;
	margin-top: 0;
	margin-bottom: 0;
}

.contact a {
	color: #ffffff;
}

.contact p.script {
	font-size: 14px;
}

a.contactLink {
	cursor: pointer;
	margin: 0;
}

/* Contact form */
.contact-form textarea {
	height: 140px;
	float: none;
}

.contact-form .form-column {
	width: 300px;
	float: left;
}

.contact-form .form-column:first-child {
	margin-right: 20px;
}

/* Credits and back to top button */
.contact-bottom {
	position: relative;
}

.credit {
	color: #ffffff;
	font-size: 11px;
	line-height: 25px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	position: absolute;
	bottom: 25px;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
}

.credit a {
	color: #ffffff;
}

.back-to-top {
	display: block;
	width: 40px;
	height: 40px;
	color: #ffffff;
	font-size: 28px;
	line-height: 38px;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}

.back-to-top:hover {
	color: #ffffff!important;
			box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	   -moz-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	-webkit-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
}

.modal {
	width: 460px;
	background: #fff;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-left: -230px;
	z-index: 1000;
	-webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);
	border: 0;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 40px 0 70px 0;
	text-align: center;
	height: 228px;
	margin-top: -114px;
	display: none;
}

.modal h1 {
	margin: 0 0 30px 0;
	color: #333333;
}

.modal p {
	margin-bottom: 8px;
	line-height: 16px;
	font-size: 16px;
}

.modal p.modal-close {
	color: #b2b2b2;
	cursor: pointer;
}

.modal p.modal-close:hover {
	color: #333;
}

.modal-overlay {
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.4);
	z-index: 999;
	display: none;
}

#loader {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #212121;
	color: #fff;
	z-index: 1999;
}

#loader p {
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.15em;
	text-align: center;
	text-transform: uppercase;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -11px 0 0 -40px;
}

#loader img {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -25px;
	margin-left: -25px;
	zoom: 1;
	animation: loader 2s linear;
	animation-iteration-count: infinite;
	-webkit-animation: loader 2s linear;
	-webkit-animation-iteration-count: infinite;
}

@keyframes loader {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

@-webkit-keyframes loader
{
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(360deg); }
}


/* ==================== 3.1 Portfolio Header ==================== */

/* Special settings here */


/* ==================== 3.2 Portfolio Introduction ==================== */

.portfolio-introduction {
	padding-top: 60px;
	padding-bottom: 80px;
}

.projectdata-ul {
	display: inline-block;
	color: #c0c0c0;
	text-align: left;
}

.projectdata-ul i {
	margin-right: 1em;
}

.projectdata-ul a {
	color: #c0c0c0;
}

.projectdata-ul a:hover {
	color: #1a1a1a;
}


/* ==================== 3.3 Portfolio Images Slider ==================== */

.portfolio-images {
	background: #f7f7f7;
	width: 100%;
	padding-top: 60px;
	padding-bottom: 60px;
}

#portfolio-slider ul li {
	border-left: 1px solid #ffffff;
	border-right: 1px solid #ffffff;
}

/* Arrow controls */
.portfolio-arrow-prev,
.portfolio-arrow-next {
	display: block;
	width: 40px;
	height: 40px;
	color: #ffffff;
	font-size: 28px;
	line-height: 38px;
	position: absolute;
	bottom: 50%;
	z-index: 33;
}

.portfolio-arrow-prev {
	text-indent: -2px;
	left: 0;
}

.portfolio-arrow-next {
	text-indent: 2px;
	right: 0;
}

.portfolio-arrow-prev:hover,
.portfolio-arrow-next:hover {
	color: #ffffff;
			box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	   -moz-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	-webkit-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
}

/* Indicators below the slider */
ol.controls {
	line-height: 0;
	margin-bottom: 0;
}

ol.controls li {
	text-indent: -9999em;
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 10px 3px 0;
	background: #c0c0c0;
	cursor: pointer;
}



/* ==================== 3.4 Portfolio Details ==================== */

.portfolio-details {
	padding-top: 60px;
	padding-bottom: 60px;
}


/* ==================== 3.5 Portfolio Gallery ==================== */

.portfolio-gallery {
	padding-top: 60px;
	padding-bottom: 60px;
	background: #f7f7f7;
}


/* ==================== 3.6 Portfolio Navigation ==================== */

.portfolio-navigation {
	position: relative;
	padding-top: 40px;
	padding-bottom: 80px;
	background: #333333;
}

p.back-to-projects,
p.prev-project,
p.next-project {
	position: absolute;
	z-index: 35;
}

p.back-to-projects {
	left: 50%;
	margin-left: -20px;
}

p.prev-project {
	left: 0;
}

p.next-project {
	right: 0;
}

p.prev-project span,
p.next-project span {
	font-size: 16px;
	vertical-align: text-bottom;
	color: #c0c0c0;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

p.prev-project span:hover,
p.next-project span:hover {
	color: #ffffff;
}

.back-to-projects i,
.prev-project i,
.next-project i {
	display: inline-block;
	width: 40px;
	height: 40px;
	color: #c0c0c0;
	background: #444444;
	font-size: 28px;
}

.back-to-projects i {
	font-size: 14px;
	line-height: 40px;
}

.prev-project i {
	text-indent: -2px;
	left: 0;
	margin-right: 10px;
	line-height: 38px;
}

.next-project i {
	text-indent: 2px;
	right: 0;
	margin-left: 10px;
	line-height: 38px;
}

.back-to-projects i:hover,
.prev-project i:hover,
.next-project i:hover {
	color: #ffffff;
			box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	   -moz-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
	-webkit-box-shadow: inset 0px 0px 100px rgba(255,255,255,0.2);
}

.grey-bg {
	background: #efefef;
	margin: -82px 0 0 0;
	padding: 60px 0 0 0;
}

.grey-dark-bg {
	background: #d6d6d6;
	margin: -64px 0 0 0;
	padding: 72px 0 0 0;
}

.container {
	width: 940px;
	margin: auto;
}

.features {
	position: relative;
}

.features h2 {
	position: absolute;
	color: #fff;
	font-size: 60px;
	font-weight: bold;
	line-height: 60px;
	top: 170px;
	left: 100px;
	right: 100px;
}

.container.type-2 {
	width: 780px;
	margin: auto;
}

.content {
	overflow: hidden;
}

.content.no-ow {
	margin: -2px 0 0 0;
	padding: 13px 0 0 0;
}

.content .top-bar {
	overflow: hidden;
	padding: 13px 0 9px 0;
	margin: 0 0 13px 0;
	border-bottom: 2px solid #f0f0f0;
}

.content .top-bar li {
	float: left;
	padding: 0 43px 0 20px;
	font-size: 12px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 1px;
	position: relative;
}
.content .top-bar a ,.content .top-bar li{
	color: #bfbfbf;
}


.content .top-bar li:after {
	position: absolute;
	background: url(images/ico_sprite.png) no-repeat;
	height: 13px;
	width: 20px;
	top: 5px;
	left: 0;
	content: "";
}

.content .top-bar .date:after {
	background-position: -20px 0;
}

.content .top-bar .ilustration:after {
	background-position: -40px 0;
}

.content .top-bar .comments:after {
	background: url(images/ico_comment.png) no-repeat 0 1px;
}

.content .main-content {
	width: 620px;
}

.content .title {
	color: #1a1919;
	font-size: 36px;
	line-height: 42px;
	font-weight: bold;
	padding: 76px 0 72px 0;
}

.content .title h1 {
	display: inline-block;
	position: relative;
	color: #1a1919;
	font-size: 36px;
	line-height: 42px;
	font-weight: bold;
}

.content .title h1:after {
	height: 2px;
	width: 80px;
	display: block;
	content: "";
	background: #c0c0c0;
	position: absolute;
	bottom: -14px;
	left: 50%;
	margin: 0 0 0 -40px;
}

.content .post {
	padding: 0 0 62px 0;
	overflow: hidden;
}

.content .post img {
	display: block;
}

.content .post-info {
	overflow: hidden;
	margin: 0 0 -2px 0;
}

.content .post-info p {
	float: left;
	color: #bfbfbf;
	line-height: 32px;
	margin: 0;
	font-size: 13px;
}
.content .post-info p a{
	text-transform:capitalize;
	color:#BFBFBF;
}
.content .post-info .comment {
	float: right;
	color: #bfbfbf;
	font-size: 12px;
	line-height: 28px;
	font-weight: bold;
	padding: 0 0 0 20px;
	background: url(images/ico_comment.png) no-repeat 0 8px;
}

.content .post-title {
	text-align: left;
	border-bottom: 2px solid #d6d6d6;
	padding: 0 0 10px 0;
	margin: 0 0 13px 0;
}

.content .post-title h2 {
	font-size: 24px;
	line-height: 24px;
	font-weight: bold;
}
.content .post-title h2 a{
	color:#1a1a1a;
}
.content .post-title h2 a:hover{
	color:#F75B37;
}
.content .post-title h4 {
	color: #bfbfbf;
	font-size: 12px;
	line-height: 24px;
	font-weight: bold;
}

.content .post-title h4 {
	color: #bfbfbf;
	font-size: 12px;
	line-height: 24px;
	font-weight: bold;
}

.content .tags {
	overflow: hidden;
	padding: 12px 0 37px 0;
}
.content .tags a {
	color: #7f7f7f;
	font-size: 10px;
	line-height: 18px;
	background: #f0f0f0;
	padding: 0 8px;
	display: block;
	text-transform: uppercase;
	text-decoration: none;
	float: left;
	margin: 0 5px 10px 0;
}

.content .tags a:hover {
	color: #fff;
}

.content .person {
	border-bottom: 2px solid #d6d6d6;
	border-top: 2px solid #d6d6d6;
	padding: 38px 0;
	text-align: left;
}

.content .person h3 {
	padding: 2px 0 1px 0;
}

.content .person .social {
	margin: -8px 0 0 0;
	overflow: hidden;
}

.content .person .social li {
	float: left;
	padding: 0 10px 0 0;
}

.content .person .social a {
	height: 30px;
	width: 30px;
	display: block;
	border-radius: 40px;
	background: #c0c0c0 url(images/ico_social.png) no-repeat;
}

.content .person .social .google-plus a {
	background-position: -30px 0;
}

.content .person .social .ball a {
	background-position: -60px 0;
}
.content .person .profile_pic {
  float: left;
  margin: 0 20px 0 0;
}
.content .person .profile_pic img{
  border-radius: 50%;
}
.content .posts-nav {
	text-align: left;
	padding: 40px 0 80px 0;
	overflow: hidden;
}

.content .posts-nav .prev {
	float: left;
	width: 48%;
}

.content .posts-nav .next {
	float: right;
	width: 48%;
}

.content .posts-nav span {
	color: #bfbfbf;
	display: block;
	letter-spacing: 1px;
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
}

.content .posts-nav .pos-title {
	font-size: 16px;
	line-height: 20px;
	padding: 3px 0;
}

.content .posts-nav .prev img {
	float: left;
	margin: 0 20px 0 0;
	width: auto;
}

.content .posts-nav .next {
	text-align: right;
}
.content .posts-nav .next img {
	float: right;
	width: auto;
	margin: 0 0 0 20px;
}
.content .posts-nav .next img,.content .posts-nav .prev img{
	border-radius:50%;
}

.content .comments {
	overflow: hidden;
}

.content .comments .head-comments {
	border-bottom: 2px solid #d6d6d6;
	overflow: hidden;
	padding: 0 0 6px 0;
}

.grey-bg .content .comments .head-comments {
	border-bottom: 2px solid #efefef;
}

.content .comments .head-comments h2 {
	color: #1f1f1f;
	font-size: 16px;
	font-weight: bold;
	line-height: 30px;
	float: left;
}

.content .comments .head-comments .add {
	color: #bfbfbf;
	font-size: 12px;
	font-weight: bold;
	line-height: 32px;
	float: right;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.content .comments .comment-holder {
	border-bottom: 2px solid #f0f0f0;
	text-align: left;
	padding: 40px 0 23px 0;
	overflow: hidden;
}

.grey-bg .content .comments .comment-holder {
	border-bottom: 2px solid #d6d6d6;
}

.content .comments .commentlist .depth-2 {
	padding-left: 80px;
}

.content .comments .comment-info {
	margin: 0 0 2px 0;
	overflow: hidden;
}

.content .comments .comment-info .photo {
	float: left;
}
.content .comments .comment-info .photo img{
	border-radius:50%;
	margin: 0 20px 0 0;
}
.content .comments .comment-info .info {
	padding: 9px 0 0 0;
}

.content .comments .comment-info .info p {
	color: #a6a6a6;
	font-family: "Times New Roman", Times, serif;
	font-style: italic;
	font-size: 13px;
	line-height: 20px;
}

.content .comments .comment-info .info a {
	font-size: 16px;
	line-height: 22px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 1px;
}

.type-2 .content .comments .comment-holder p {
	margin: 0 0 0 80px;
}

.content .comments .comment-reply-link {
	font-size: 12px;
	line-height: 27px;
	text-transform: uppercase;
	font-weight: bold;
	color: #bfbfbf;
	letter-spacing: 1px;
}

.type-2 .content .comments .comment-reply-link {
	margin: 25px 0 0 80px;
	float: left;
}

.content #respond {
	overflow: hidden;
	padding: 0 0 18px 0;
	text-align: left;
}

.content #respond fieldset {
	padding: 0 20px 0 0;
	margin: 0;
	float: left;
}

.type-2 .content #respond {
	text-align: center;
}

.type-2 .content #respond fieldset {
	padding: 0 5px;
	display: inline-block;
	float: none;
	vertical-align: top;
}

.content #respond fieldset.space {
	padding: 0;
}

.content #respond form {
	margin: 0;
	width: 100%;
	padding: 23px 0 0 0;
}

.content #respond textarea,
.content #respond input {
	border: 2px solid #d6d6d6;
	width: 300px;
	padding: 8px 9px;
	color: #333333;
	font-family: "Arial";
	font-size: 15px;
	margin: 0 0 10px 0;
	line-height: 20px;
	height: 40px;
}

.type-2 .content #respond textarea,
.type-2 .content #respond input {
	border: 2px solid #fff;
}

.content #respond input[type=submit] {
	border: none;
	width: 170px;
	margin: 20px 0 0 0;
	color: #fff;
	font-family: "Raleway";
	font-size: 12px;
	font-weight: bold;
	letter-spacing: 1px;
	padding: 2px 0 0 0;
	text-transform: uppercase;
}

.type-2 .content #respond input[type=submit] {
	border: 2px solid #1a1a1a;
	background: #d6d6d6;
	color: #1a1a1a;
	margin-bottom: 83px;
}

.content #respond textarea:focus,
.content #respond input:focus {
	border: 2px solid #333333;
}

.content #respond textarea {
	height: 140px;
}

.content #respond textarea::-webkit-input-placeholder,
.content #respond input::-webkit-input-placeholder {
	color:#d6d6d6;
}
.content #respond textarea::-moz-placeholder,
.content #respond input::-moz-placeholder {
	color:#d6d6d6;
}

#reply-title a{font-size:16px}

p.nocomments{border-top:1px solid #EEE;color:#444444;font-weight:bold;margin-left:190px;padding-top:10px}
span.grey{color:#AAAAAA!important;font-size:11px;line-height:18px}
em.moderation{color:#CCCCCC;display:inline-block}
.cancel-comment-reply{display:inline-block;margin-top:30px;width:100%}






.content .pagination {
	overflow: hidden;
	margin: -13px 0 60px 0;
	display: block;
	float: left;
	clear: left;
}
.wp-pagenavi a:hover{
	color: #fff;
}
.wp-pagenavi span.current {
	color: #333;
	background: #f0f0f0;
	font-weight:normal !important;
}
.wp-pagenavi .pages,.wp-pagenavi .nextpostslink,.wp-pagenavi .previouspostslink{
	display:none !important;
}
.wp-pagenavi a, .wp-pagenavi span {
	color: #b3b3b3;
	font-family: "Raleway";
	font-size: 14px;
	height: 40px;
	width: 40px;
	line-height: 40px;
	text-align: center;
	display: block;
    border:none !important;
    margin:0 !important;
    text-decoration: none;
	float: left;
	padding: 0 5px 0 0 !important;
}
.content .pagination.center a,.content .pagination.center{
	float:none;
	display:inline-block;
}

.content .sidebar {
	float: right;
	width: 300px;
}
.content .sidebar .widget ul li{padding:0 0 5px; text-align:left;}
.content .sidebar .widget {
	padding: 0 0 50px 0;
	clear: both;
	overflow: hidden;
}
.content .sidebar .widget-title {
  border-bottom: 2px solid #D6D6D6;
  font-weight: bold;
  margin-bottom: 10px;
  padding: 0 0 8px;
  text-align: left;
}
.content .sidebar .widget-title h3 {
	color: #191919;
	font-size: 16px;
	font-weight: bold;
	line-height: 30px;
}

.content .sidebar .widget_search fieldset {
	background: #f0f0f0;
	margin: 0;
	padding: 0;
}

.content .sidebar .widget_search input {
	background: none;
	border: none;
	font-size: 14px;
	margin: 0;
	width: 250px;
	padding: 0 10px 2px 10px;
	height: 40px;
	line-height: 38px;
	float: left;
}

.content .sidebar .widget_search input[type=submit] {
	height: 40px;
	width: 40px;
	padding: 0;
	float: right;
	background: url(images/ico_search.png) no-repeat 14px 13px;
}

.content .sidebar .widget_categories a {
	/*color: #7f7f7f;
	font-size: 13px;
	line-height: 44px;
	padding: 4px 0 0 0;
	display: block;
	text-align: left;
	border-bottom: 2px solid #f0f0f0;
	position: relative;*/
}
.content .sidebar .widget {
	padding: 0 0 25px 0;
}

.content .sidebar .widget_categories a:after {
	position: absolute;
	background: url(images/ib_arrow_side.png) no-repeat;
	height: 8px;
	width: 5px;
	display: block;
	top: 21px;
	right: 1px;
	content: "";
}

.content .sidebar .widget_categories a:hover:after {
	background-position: 0 -8px;
}

.content .sidebar .widget-comments {
	padding: 0 0 23px 0;
}

.content .sidebar .widget-comments li {
	border-bottom: 2px solid #f0f0f0;
	padding: 18px 0 18px 0;
}

.content .sidebar .widget-comments a {
	color: #7f7f7f;
	font-size: 13px;
	display: inline-block;
	line-height: 20px;
	text-align: left;
}

.content .sidebar .widget-comments img {
	float: left;
	margin: 2px 10px 0 0;
}

.content .sidebar .widget_tag_cloud {
	padding: 0 0 41px 0;
}

.content .sidebar .widget_tag_cloud div {
	margin: 0px 5px 10px 0;
}

.content .sidebar .widget_tag_cloud div a {
	color: #7f7f7f;
	font-size: 10px !important;
	line-height: 18px;
	background: #f0f0f0;
	padding: 0 7px;
	display: block;
	text-transform: uppercase;
	float: left;
	margin: 0 5px 10px 0;
}

.content .sidebar .widget_tag_cloud div a:hover {
	color: #fff;
	text-decoration: none;
}

#calendar_wrap {
	border: 2px solid #f0f0f0;
	color: #666;
	font-family: "Raleway";
	font-size: 12px;
	text-transform: uppercase;
}
#wp-calendar {
	width: 100% !important;
}
#wp-calendar caption {
	font-weight: bold;
	background: #f0f0f0;
	line-height: 28px;
	position: relative;
	margin: 0 0 17px;
}
#wp-calendar thead th{
	padding: 0 0 9px 0;
}
#wp-calendar tbody td{text-align:center;padding:8px}
#wp-calendar tbody td a{font-weight:bold}
#wp-calendar tfoot #next{font-size:10px;text-transform:uppercase;text-align:right}
#wp-calendar tfoot #prev{font-size:10px;text-transform:uppercase;padding-top:10px}


.btn-holer {
	text-align: center;
	padding: 0 0 18px 0;
}

a.btn-red {
	display: inline-block;
	font-size: 12px;
	font-weight: bold;
	line-height: 36px;
	height: 40px;
	text-transform: uppercase;
	letter-spacing: 1px;
	float: left;
	padding: 0 19px;
	text-decoration: none !important;
}

.btn-holer .btn-red {
	float: none;
	letter-spacing: 2px;
	margin: 12px 0 0 0;
}

/*
Theme Name: Amix Framework 3.5
Theme URI: http://www.crazyxhtml.com
Author: <a href="http://www.crazyxhtml.com">CrazyXhtml</a>
Author URI: http://www.crazyxhtml.com
Description: Designed by <a href="http://www.crazyxhtml.com">CrazyXhtml</a>.
Version: 3.5
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: white, light
Text Domain: am
*/

.textwidget p{ padding: 0 0 10px 0; }

/* Respond */
#respond{
	margin:20px 0 20px 0;
	overflow:hidden;
}
#respond .comment-reply-title{
	margin: 0 0 5px 0;
}
#respond .comment-reply-title small{
	font-size: 12px;
	font-weight: normal;
}
#commentform p{
	width:100%;
	overflow:hidden;
	padding: 0 0 10px;
	margin: 0;
}
#commentform p label{
	display: block;
	padding: 0 0 5px;
}
#commentform p textarea{
	width: 98%;
}

/* Comments*/
#comments{
	margin: 0 0 5px 0;
}
.commentlist{
	padding: 0;
	text-align: justify;
	line-height:1.6em;
}
.commentlist .entry-comment p{
	margin: 10px 0 10px 0;
}
.commentlist .children{ padding: 0; }

/* Typography */

.entry{
	color: #7f7f7f;
	font-size: 15px;
	text-align: left;
}
.entry a{
	text-decoration:underline;
}
.entry a:hover{
	text-decoration:none;
}
.entry p{
	margin:0 0 12px 0;
}
.entry h1{}  .entry h2{}  .entry 
h3.space{
	margin: 0 0 1px 0;
}  .entry h4{}  .entry h5{}  .entry h6{}
.entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6{line-height:1.5em; margin: 0 0 15px 0; }

.entry ul{ margin: -13px 0 24px 2px; padding: 0 0 0 18px; }
.entry ul li{padding: 0 0 3px 0; }
.entry ul ul, .entry ul ol{ margin: 0; }
.entry ul li{	list-style-type: disc;  line-height: 1.5em;}
.entry ul ul li{ list-style-type: circle; }
.entry  ul li ol li{ list-style-type: decimal; }

.entry ol{ margin: -13px 0 24px 0; padding: 0 0 0 20px; }
.entry ol ol, .entry ol ul{ margin: 0; }
.entry  ol li{ list-style-type: decimal;  line-height: 1.5em;
padding: 0 0 3px;}
.entry  ol li ol li{ list-style-type: lower-alpha; }
.entry  ol li ul li{ list-style-type: disc; }

.entry table{
	width: 100%;
	border: 1px solid #ccc;
	border-collapse: collapse;
	margin: 0 0 15px 0;
}
.entry table td, .entry table th{
	border: 1px solid #ccc;
	padding: 5px;
}
.entry table th{
	background: #eee;
}

/* Calendar */
#wp-calendar{width:95%;margin-bottom:15px;clear:both;padding:0;}
#wp-calendar caption{padding:10px;}
#wp-calendar th,#wp-calendar td{text-align:center;padding:3px 0;}
#wp-calendar td{background:transparent;}

/* Begin Images */
img{
	max-width: 100%;
}
img.wp-smiley{ padding: 0; border: none; }
.alignnone {
    margin: 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 20px auto;
}

.alignright {
    float:right;
    margin: 2px 0 0 20px;
	padding: 0 0 28px 0;
	width: auto !important;
}

.alignleft {
    float: left;
    margin: 2px 20px 0 0;
	padding: 0 0 28px 0;
	width: auto !important;
}

.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.wp-caption {
    background: #fff;
    border: 1px solid #f0f0f0;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 5px 0 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text, .entry .wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 5px 4px 0;
}

.al{
	float: left;
}
.ar{
	float: right;
}

/* Various Tags & Classes */
.entry acronym, .entry abbr, .entry span.caps{
	cursor: help;
}
.entry acronym, .entry abbr{
	border-bottom: 1px dashed #dfcfba;
}
.entry blockquote{
	margin: 32px 0 33px 0;
	padding: 82px 30px 59px 30px;
	background: #f0f0f0;
	font-size: 13px;
	line-height: 25px;
	text-align: center;
	position: relative;
}
.entry blockquote:after{
	position: absolute;
	content: "";
	background: url(images/bg_quate.png) no-repeat;
	width: 32px;
	height: 29px;
	top: 41px;
	left: 50%;
	margin: 0 0 0 -16px;
	font-size: 120px;
	display: block;
}
.entry blockquote p{
	text-transform: uppercase;
	font-size: 16px;
	letter-spacing: 1px;
	margin: 0;
	font-weight: bold;
	color: #191919;
}
.center{
	text-align: center;
}
.hidden{
	display: none;
}
.entry pre, .entry code{
	font-family:mono-space,monospace;
	border: 1px solid #eee;
	padding: 20px;
	display: block;
	margin: 0 0 20px 0;
	overflow: auto;
	white-space: pre;
	font-size: 12px;
	line-height:20px;
}
.entry code{
	padding:1px 20px 0 20px;
	background:#f6f6f6 url(images/bgr_code.gif) repeat scroll 0 0;
	border-top: 0;
	border-bottom: 0;
}
sup{
	position: relative;
	top: -5px;
}
sub{
	position: relative;
	top: 5px;
}
code br{
	display: none;
}
.last{
	margin-right:0 !important;
	clear:right;
}
.clear{
	clear: both;
	line-height: 0;
}
.sticky{}
.bypostauthor{}
.page-link{
	padding: 0 0 15px;
}


/* pagination */

.single .pagination{
}
.pagination a{
}
/* ==================== 4.1 Tablet Portrait ==================== */

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

	i.column-icon {
		width: 40px;
		height: 40px;
		font-size: 20px;
		line-height: 40px;
	}

	i.column-icon:hover {
		font-size: 24px;
	}

	.header-center {
		left: 50%;
	}

	.avatars > .columns:hover {
		margin-top: 0;
	}

	.contact-form .form-column {
		width: 220px;
	}

}


/* ==================== 4.2 Mobile Landscape ==================== */

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

	.fullscreen-image,
	.header,
	.header-inherited	{
		background-attachment: scroll;
	}

	.text-left,
	.text-right {
		text-align: center;
	}

	.column-border {
		border-left: 0;
		padding-left: 0;
	}

	.header-center {
		
	}
	
	.services-arrow-prev,
	.services-arrow-next {
		bottom: -80px;
	}

	.services-arrow-prev {
		left: 0;
	}

	.services-arrow-next {
		right: 0;
	}

	.services-buttons a {
		width: 80px;
		height: 80px;
		font-size: 30px;
		line-height: 78px;
		margin: 20px 5px;
	}

	.services-buttons a i {
		width: 80px;
		height: 80px;
		line-height: 80px;
	}

	.services-buttons a:hover {
		font-size: 40px;
	}

	.project-item {
		margin-top: 5px;
		margin-bottom: 5px;
	}

	.avatars > .columns {
		margin-bottom: 10px;
	}

	.avatars > .columns:hover {
		margin-top: 0;
	}

	.quote-arrow-prev,
	.quote-arrow-next {
		bottom: 30px;
	}
	
	.quote-arrow-prev {
		left: 140px;
	}
	
	.quote-arrow-next {
		right: 140px;
	}

	.contact-form .form-column {
		width: 230px;
	}

	.contact-form .form-column:first-child {
		margin-right: 10px;
	}
	
	.portfolio-images {
		padding-top: 60px;
		padding-bottom: 100px;
	}
	
	.portfolio-arrow-prev,
	.portfolio-arrow-next {
		bottom: -42px;
	}

	.portfolio-arrow-prev {
		left: 195px;
	}

	.portfolio-arrow-next {
		right: 195px;
	}

	ol.controls li {
		display: none;
	}
	
	p.back-to-projects span,
	p.prev-project span,
	p.next-project span {
		display: none;
	}
	
	p.prev-project{
		left: 170px;
		margin-right: 0;
	}

	p.next-project {
		right: 170px;
		margin-left: 0;
	}

}


/* ==================== 4.3 Mobile Portrait ==================== */

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

	.fullscreen-image,
	.header,
	.header-inherited	{
		background-attachment: scroll;
	}

	.text-left,
	.text-right {
		text-align: center;
	}

	.column-border {
		border-left: 0;
		padding-left: 0;
	}

	.header-center {
		
	}
	
	.services {
		padding-bottom: 100px;
	}
	
	.services-arrow-prev,
	.services-arrow-next {
		bottom: -40px;
	}

	.services-arrow-prev {
		left: 105px;
	}

	.services-arrow-next {
		right: 105px;
	}

	.services-buttons {
		display: none;
	}

	.project-item {
		margin-top: 5px;
		margin-bottom: 5px;
	}

	.avatars > .columns {
		margin-bottom: 10px;
	}

	.avatars > .columns:hover {
		margin-top: 0;
	}

	.quote-arrow-prev,
	.quote-arrow-next {
		bottom: 30px;
	}
	
	.quote-arrow-prev {
		left: 50px;
	}
	
	.quote-arrow-next {
		right: 50px;
	}

	.contact .header-inherited {
		height: 600px;
	}

	.contact-form .form-column {
		width: 300px;
	}

	.contact-form .form-column:first-child {
		margin-right: 0;
	}
	
	.portfolio-images {
		padding-top: 60px;
		padding-bottom: 100px;
	}
	
	.portfolio-arrow-prev,
	.portfolio-arrow-next {
		bottom: -42px;
	}

	.portfolio-arrow-prev {
		left: 105px;
	}

	.portfolio-arrow-next {
		right: 105px;
	}

	ol.controls li {
		display: none;
	}
	
	p.back-to-projects span,
	p.prev-project span,
	p.next-project span {
		display: none;
	}
	
	p.prev-project{
		left: 80px;
		margin-right: 0;
	}

	p.next-project {
		right: 80px;
		margin-left: 0;
	}

}


/* ==================== 4.4 Modernizr-Assisted Fixes ==================== */

html.touch .fullscreen-image,
html.touch .header,
html.touch .header-inherited {
	background-attachment: scroll;
}



@media screen and (max-width: 900px) {
		
	.container.type-2 {
		width: 100%;
	}

	body {
		min-width: 320px;
	}	

	.content .title {
		padding: 36px 0 42px 0;
	}
	
	.container {
		width: 100%;
		padding: 0 20px;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	
	.content .main-content {
		width: auto;
	}
	
	.content .post img {
		width: 100%;
	}
		
	.content .sidebar {
		width: 200px;
		margin: 0 0 0 15px;
	}
	
	.type-2 .content .leave-comment fieldset {
		clear: both;
		float: left;
		clear: both;
		padding: 0;
	}

	.type-2 .content .sidebar .widget-search input,
	.content .sidebar .widget-search input {
		width: 100%;
		padding-right: 60px;
	}
	.type-2 .content .sidebar .widget-search input[type=submit],
	.content .sidebar .widget-search input[type=submit] {
		margin: -40px 0 0 0;
	}
	
	.features h2 {
		font-size: 30px;
		line-height: 30px;
		top: 50%;
		margin: -30px 0 0 0;
	}

} 

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

	.content .title {
		padding: 20px 0 40px 0;
	}
	
	.content .main-content {
		width: auto;
	}
	
	.content .sidebar {
		width: 100%;
		margin: 0;
	}
	
	.type-2 .content .leave-comment textarea,
	.type-2 .content .leave-comment input,
	.content .leave-comment textarea,
	.content .leave-comment input {
		width: 100%;
		clear: both;
	}
		
	.type-2 .content .leave-comment fieldset,
	.content .leave-comment fieldset {
		padding: 0;
		float: none;
	}
	
	.content .posts-nav .next,
	.content .posts-nav .prev {
		width: 100%;
		clear: both;
		margin: 0 0 10px 0;
	}
	
	.type-2 .content .leave-comment fieldset {
		float: none;
		width: 100%;
	}

	.alignright,
	.alignleft {
		width: 100% !important;
	}
	
	.features h2 {
		font-size: 24px;
		line-height: 24px;
		margin: -36px 0 0 0;
		left: 20px;
		right: 20px;
	}


}

.gallery dl {}
.gallery dt {}
.gallery dd {}
.gallery dl a {}
.gallery dl img {}
.gallery-caption {}

.wp-caption{background:#EEEEEE;padding-top:5px;text-align:center}
.wp-caption-text{line-height:22px}
.admin-bar #blog {
	padding-top: 30px;
}

.widget_categories select,
.widget_archive select,
.widget select {
	width: 100%;
}

.widget_rss li {
	margin-bottom: 15px;
}

.widget_rss img {
	vertical-align: middle;
}

.widget_rss li a.rsswidget {
	width: 100%;
}

.widget ul {
	margin-bottom: 0;
}

.widget {
	margin-bottom: 25px;
}