/*

Theme Name: Momentum
Theme URI: http://themeforest.net
Description: Responsive One Page Portfolio
Version: 1.1.0
Author: bitfade
Author URI: http://themeforest.net/user/bitfade
License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: photoblogging

*/

/*

	Style.css

	01. Basics
	02. Top bar
	03. Home
	04. Intro
	05. Work
	06. Call to action
	07. Services
	08. Process
	09. About
	10. Contact
	11. Footer
	12. 404 Page
	13. Responsive settings

*/


/* ==================== 01. Basics ==================== */
body {
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: 13px;
	font-weight: 400;
	line-height: 25px;
	color: #777777;
}

p {
	margin-bottom: 25px;
}

/* Headings */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif;
	font-style: normal;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #111111;
}

h1, .h1 {
	font-size: 30px;
	line-height: 1.5em;
	margin-bottom: 25px;
}

h2, .h2 {
	font-size: 24px;
	line-height: 1.5em;
	margin-bottom: 25px;
}

h3, .h3 {
	font-size: 16px;
	line-height: 25px;
	margin-bottom: 0;
}

h4, .h4 {
	font-size: 14px;
	line-height: 25px;
	margin-bottom: 0;
}

h5, .h5 {
	font-size: 13px;
	line-height: 25px;
	margin-bottom: 0;
}

h6, .h6 {
	font-size: 13px;
	line-height: 20px;
	margin-bottom: 0;
}

/* Responsive headings */
.bigtext h1, h1.bigtext,
.bigtext h2, h2.bigtext,
.bigtext h3, h3.bigtext,
.bigtext h4, h4.bigtext,
.bigtext h5, h5.bigtext,
.bigtext h6, h6.bigtext {
	margin-bottom: 10px;
}

.bigtext h1, h1.bigtext {
	font-size: 90px;
	line-height: 1em;
}

.bigtext h2, h2.bigtext {
	font-size: 75px;
	line-height: 1em;
}

.bigtext h3, h3.bigtext {
	font-size: 60px;
	line-height: 1em;
}

.bigtext h4, h4.bigtext {
	font-size: 48px;
	line-height: 1.25em;
}

.bigtext h5, h5.bigtext {
	font-size: 36px;
	line-height: 1.25em;
}

.bigtext h6, h6.bigtext {
	font-size: 24px;
	line-height: 1.5em;
}

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

	/* Responsive headings */
	.bigtext h1, h1.bigtext {
		font-size: 60px;
	}

	.bigtext h2, h2.bigtext {
		font-size: 48px;
	}

	.bigtext h3, h3.bigtext {
		font-size: 36px;
	}

	.bigtext h4, h4.bigtext {
		font-size: 30px;
	}

	.bigtext h5, h5.bigtext {
		font-size: 24px;
	}

	.bigtext h6, h6.bigtext {
		font-size: 18px;
	}

}

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

	/* Responsive headings */
	.bigtext h1, h1.bigtext {
		font-size: 36px;
	}

	.bigtext h2, h2.bigtext {
		font-size: 30px;
	}

	.bigtext h3, h3.bigtext {
		font-size: 24px;
	}

	.bigtext h4, h4.bigtext {
		font-size: 18px;
	}

	.bigtext h5, h5.bigtext {
		font-size: 16px;
	}

	.bigtext h6, h6.bigtext {
		font-size: 14px;
	}

}

/* Links */
a {
	color: inherit;
	text-decoration: none;
}

a:hover {
	color: #111111;
}

/* Smooth hover effects */
a,
a i,
button,
input[type="submit"] {
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

a:hover,
a i:hover,
button:hover,
input[type="submit"]:hover {
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

/* Cursor styling for icons */
i {
	cursor: default;
}

a i {
	cursor: pointer;
}

/* Lists */
.ol {
	list-style-type: decimal-leading-zero;
	list-style-position: outside;
	margin-left: 2em;
	margin-bottom: 25px;
}

.ol ol,
.ul ol {
	list-style-type: decimal-leading-zero;
	list-style-position: outside;
}

.ul {
	list-style-type: disc;
	list-style-position: outside;
	margin-left: 1em;
	margin-bottom: 25px;
}

.ol ul,
.ul ul {
	list-style-type: disc;
	list-style-position: outside;
}

.ol ol,
.ol ul,
.ul ol,
.ul ul {
	margin-left: 2em;
}

/* Typographic styles */
.italic, em {
	font-style: italic;
}

.bold, b, strong {
	font-weight: 600;
}

.thin {
	font-weight: 300;
}

.x-thin {
	font-weight: 100;
}

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

.uber {
	font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif;
	font-style: normal;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Text colors */
.text-color {
	color: #ff4800;
}

.text-light {
	color: #bbbbbb;
}

.text-dark {
	color: #111111;
}

.text-white {
	color: #ffffff;
}

/* Dropcap */
.dropcap {
	float: left;
	color: #111111;
	font-size: 50px;
	line-height: 50px;
	padding-right: 8px;
	padding-left: 3px;
}

/* Quotes */
blockquote {
	font-family: Georgia, serif;
	font-style: italic;
	font-weight: 400;
	font-size: 1.25em;
	padding: 25px;
	background: #fafafa;
	border-left: 5px solid #eeeeee;
	margin-bottom: 25px;
}

blockquote small {
	display: block;
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: 0.75em;
	font-weight: 400;
	font-style: normal;
}

blockquote small:before {
	content: '\2014 \00A0';
}

q {
	quotes: "\"" "\"" """ """;
}

q:before {
	content: '\201C';
}

q:after {
	content: '\201D';
}

/* Buttons */
/* Reset */
button,
input[type="submit"] {
	-webkit-appearance: none;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	padding: 0;
}

input[type="submit"] {
	border: 0;
	width: auto;
}

/* Fixing the broken lineheight model in FF */
input::-moz-focus-inner { 
	border: 0; 
	padding: 0; 
	margin-top: 5px; 
	margin-bottom: 5px; 
}

/* Buttons styling */
.btn,
button,
input[type="submit"] {
	display: inline-block;
	font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 25px;
	padding: 12px 25px;
	color: #ffffff;
	background: #111111;
	text-decoration: none;
	-webkit-border-radius: 5px;
			border-radius: 5px;
}

a.btn:hover,
button:hover,
input[type="submit"]:hover,
a .icon:hover {
	color: #ffffff;
	background: #ff4800;
	text-decoration: none;
}

button:hover,
input[type="submit"]:hover,
a i:hover {
	cursor: pointer;
}

/* Icon inside a button */
.btn > i {
	font-size: 14px;
	margin-right: 0.5em;
}

/* Button outline style */
.btn.outline {
	color: #111111;
	background: none;
	border: 2px solid #111111;
	padding: 10px 23px;
}

a.btn.outline:hover,
button.outline:hover,
input[type="submit"].outline:hover {
	color: #ffffff;
	background: #ff4800;
	border: 2px solid #ff4800;
	border: 2px solid rgba(255,72,0,1);
}

/* Button colors */
.btn.color {
	background: #ff4800;
}

.btn.outline.color {
	color: #ff4800;
	background: none;
	border: 2px solid #ff4800;
}

.btn.light {
	color: #ffffff;
	background: #cccccc;
	background: rgba(255,255,255,0.3);
}

.btn.outline.light {
	color: #ffffff;
	background: none;
	border: 2px solid #cccccc;
	border: 2px solid rgba(255,255,255,0.3);
}

.btn.dark {
	color: #111111;
	background: #aaaaaa;
	background: rgba(17,17,17,0.3);
}

.btn.outline.dark {
	color: #111111;
	background: none;
	border: 2px solid #aaaaaa;
	border: 2px solid rgba(17,17,17,0.3);
}

.btn.white {
	color: #111111;
	background: #ffffff;
}

.btn.outline.white {
	color: #ffffff;
	background: none;
	border: 2px solid #ffffff;
}

/* Headers */
.header {
	position: relative;
	display: block;
	width: 100%;
	height: 640px;
}

.header.large {
	height: 745px;
}

.header.medium {
	height: 480px;
}

.header.small {
	height: 320px;
}

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

	.header,
	.header.large {
		height: 480px;
	}
	
	.header.medium {
		height: 320px;
	}

}

/* Header with centered content */
.header-inner {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	   -moz-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		 -o-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
	width: 100%;
	max-width: 740px;
	min-width: 300px;
	text-align: center;
	z-index: 60; /* Should be 50+ because of the bxSlider */
}

/* Background image */
.bg-img {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}

/* Fixed backgrounds only on non-touch devices */
.bg-img.fixed {
	background-attachment: scroll;
}

.no-touch .bg-img.fixed {
	background-attachment: fixed;
}

/* Title */
.title {
	text-align: center;
}

.title h1,
.title h2 {
	font-size: 16px;
	line-height: 25px;
	margin-bottom: 15px;
}

.title hr {
	display: inline-block;
	width: 40px;
	height: 2px;
	background: #cccccc;
	margin-bottom: 75px;
}

.title.title-light h1,
.title.title-light h2 {
	color: #ffffff;
}

.title.title-light hr {
	background: #555555;
}

/* Title on headers */
.header hr {
	display: inline-block;
	width: 40px;
	height: 2px;
	background: #ffffff;
	filter: alpha(opacity=50);
	opacity: 0.5;
	margin-bottom: 25px;
}

/* Underline link */
a.underline {
	padding-bottom: 1px;
	border-bottom: 1px dotted #cccccc;
}

a.underline:hover {
	border-bottom: 1px dotted #111111;
}

/* Links for dark backgrounds */
a.inverted:hover {
	color: #ffffff;
}

a.inverted.underline {
	padding-bottom: 1px;
	border-bottom: 1px dotted #555555;
}

a.inverted.underline:hover {
	border-bottom: 1px dotted #ffffff;
}

/* Arrow link */
a.arrow-link {
	font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #111111;
}

a.arrow-link:before {
	font-family: 'FontAwesome';
	content: '\f054';
	color: #aaaaaa;
	margin-right: 7px;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

a.arrow-link:hover,
a.arrow-link:hover:before {
	color: #ff4800;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

/* Positioning for the owlCarousel controls (oc) */
.oc-left,
.oc-right {
	position: absolute;
	top: 50%;
	margin-top: -30px;
}

.oc-left {
	left: 0;
	margin-left: -60px;
}

.oc-right {
	right: 0;
	margin-right: -60px;
}

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

	.oc-left,
	.oc-right {
		top: 100%;
		margin-top: 20px;
	}

	.oc-left {
		left: 50%;
		margin-left: -40px;
	}

	.oc-right {
		right: 50%;
		margin-right: -40px;
	}

}

/* Styling for the owlCarousel icon controls */
.oc-left i,
.oc-right i {
	display: inline-block;
	width: 60px;
	height: 60px;
	line-height: 60px;
	font-size: 42px;
	text-align: center;
	color: #cccccc;
}

.oc-left i:hover,
.oc-right i:hover {
	color: #aaaaaa;
}

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

	.oc-left i,
	.oc-right i {
		width: 40px;
		height: 40px;
		line-height: 40px;
		font-size: 28px;
	}

}

/* Overlay item that is used for portfolio thumbnails and employee images */
.overlay-item {
	position: relative;
	color: #ffffff;
	line-height: 0;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

/* The hover effect */
.o-hover {
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
	color: rgba(255,255,255,0.0);
	background: rgba(0,0,0,0.0);
	visibility: visible;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.overlay-item:hover > .o-hover,
.overlay-item a:hover > .o-hover {
	color: rgba(255,255,255,1);
	background: rgba(0,0,0,0.5);
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

/* The information inside the hover */
.o-hover span {
	font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif;
	font-style: normal;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-align: center;
	line-height: 20px;
	display: inline-block;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
}

.o-hover em {
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-style: normal;
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: rgba(255,255,255,0);
	display: inline-block;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.overlay-item:hover > .o-hover em,
.overlay-item a:hover > .o-hover em {
	color: rgba(255,255,255,1);
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.o-hover i {
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: rgba(255,255,255,0);
	display: inline-block;
	width: 30px;
	height: 30px;
	line-height: 30px;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.overlay-item:hover > .o-hover i,
.overlay-item a:hover > .o-hover i {
	color: rgba(255,255,255,1);
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.overlay-item:hover > .o-hover i:hover,
.overlay-item a:hover > .o-hover i:hover {
	color: #111111;
	background: #ffffff;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.o-hover i.fa-2x {
	font-size: 2em;
}

.overlay-item:hover > .o-hover i.fa-2x:hover,
.overlay-item a:hover > .o-hover i.fa-2x:hover {
	color: #ffffff;
	background: none;
}

/* Extra info below images used for portfolio thumbnails and employee images */
.e-info {
	position: relative;
	display: block;
	background: #ffffff;
	padding: 15px 15px 25px;
	text-align: center;
}

.e-info h3 {
	font-size: 13px;
	line-height: 20px;
	margin-bottom: 0;
}

.e-info p {
	color: #aaaaaa;
	line-height: 20px;
	margin-bottom: 0;
}


/* ==================== 02. Top bar ==================== */
.top-bar {
	position: fixed;
	top: 0;
	display: block;
	width: 100%;
	background: #111111;
	background: rgba(7,7,7,0.9);
	z-index: 99;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

/* Typographic logo for the top bar */
.tb-logo {
	margin-left: 20px;
}

.tb-logo h1 {
	float: left;
	text-align: left;
	font-size: 13px;
	line-height: 25px;
	color: #ffffff;
	margin-top: 15px;
	margin-bottom: 0;
}

.tb-logo h1 a {
	text-decoration: none;
	color: #ffffff;
}

.tb-logo h1 a:hover {
	color: #ffffff;
}

/* Image logo for the top bar */
.tb-logo img {
	float: left;
	text-align: left;
	width: auto;
	max-height: 30px;
	margin: 10px 10px 0 0;
}

/* Hiding the the toggle */ 
#toggle,
.toggle {
	display: none;
}

/* Hiding and showing the submenu items */
.top-bar .menu ul ul {
	display: none;
}

.top-bar .menu ul li:hover > ul {
	display: block;
}

/* Styling for the main menu items */
.top-bar .menu {
	float: right;
	text-align: left;
	font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 25px;
}

.menu ul {
	position: relative;
	display: table-cell;
	list-style: none;
}

.top-bar .menu ul:after {
	content: "";
	clear: both;
	display: block;
}

.top-bar .menu ul li {
	float: left;
}

/* Hover effect */
.top-bar .menu ul li:hover a {
	color: #ffffff;
}

.top-bar .menu ul li a {
	display: block;
	padding: 15px 20px;
	color: #777777;
	text-decoration: none;
}

/* Less padding on smaller screens */
@media only screen and (max-width: 1024px){

	.top-bar .menu ul li a {
		padding: 15px 10px;
	}

}

/* Styling for the sub menu items */
.top-bar .menu ul ul {
	position: absolute;
	top: 100%;
	background: #111111;
	background: rgba(7,7,7,0.9);
	padding: 0 0 10px 0;
	min-width: 180px;
}

.top-bar .menu ul ul li {
	float: none; 
	position: relative;
}

.top-bar .menu ul ul li a {
	padding: 10px 20px;
	color: #777777!important;
}

.top-bar .menu ul ul li a:hover {
	color: #ffffff!important;
}

.top-bar .menu ul ul ul {
	position: absolute;
	top: 0;
	left: 100%;
}

/* Responsive settings for the menu */
@media only screen and (max-width: 768px) {

	.top-bar {
		padding-top: 0;
	}

	/* The toggle */
	.toggle {
		display: block;
		position: relative;
		cursor: pointer;
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		user-select: none;
		color: #777777;
		float: right;
		font-family: 'FontAwesome';
		text-align: center;
		font-size: 14px;
		width: 50px;
		height: 50px;
		line-height: 50px;
		-webkit-transition: all .2s;
		   -moz-transition: all .2s;
			-ms-transition: all .2s;
			 -o-transition: all .2s;
				transition: all .2s;
	}

	.toggle:hover {
		color: #ffffff;
		-webkit-transition: all .2s;
		   -moz-transition: all .2s;
			-ms-transition: all .2s;
			 -o-transition: all .2s;
				transition: all .2s;
	}

	.toggle:after {
		content: '\f0c9';
	}

	#toggle:checked ~ .menu {
		display: block;
		filter: alpha(opacity=100);
		opacity: 1;
	}

	#toggle:checked + .toggle:after {
		content: '\f077';
	}

	/* The menu items */
	.top-bar .menu {
		display: none;
		filter: alpha(opacity=0);
		opacity: 0;
		margin-top: 50px;
		width: 100%;
		position: absolute;
		right: 0;
		height: auto;
		text-align: left;
		background: #111111;
		background: rgba(7,7,7,0.9);
		padding-bottom: 10px;
		padding-left: 30px;
	}

	.top-bar .menu ul li {
		display: block;
		width: 100%;
		line-height: 30px;
		margin: 0;
	}

	.top-bar .menu ul li a {
		display: block;
		width: 100%;
		padding: 0;
	}

	/* Styling for the sub menu items */
	.top-bar .menu ul ul {
		display: block;
		position: relative;
		top: 0;
		background: none;
		padding: 0;
	}

	.top-bar .menu ul ul li a {
		padding: 0;
	}

	.top-bar .menu ul ul ul {
		position: relative;
		top: 0;
		left: 0;
	}

}

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

	.tb-logo {
		margin-left: 5px;
	}

	.toggle {
		margin-right: -10px;
	}

	.top-bar .menu {
		padding-left: 15px;
	}

}

/* Dynamic height of the menu */
.tb-large {
	padding-top: 25px;
	padding-bottom: 25px;
}

.tb-small {
	padding-top: 0;
	padding-bottom: 0;
}

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

	.tb-large {
		padding-top: 0;
		padding-bottom: 0;
	}

}

/* Transparent top bar */
.top-bar.tb-transp {
	background: #none;
	background: rgba(7,7,7,0.0);
}

.tb-transp .top-bar .menu ul li a {
	color: #ffffff;
	color: rgba(255,255,255,0.5);
}

.tb-transp .top-bar .menu ul li:hover a {
	color: #ffffff;
}

.tb-small.tb-transp {
	background: #111111;
	background: rgba(7,7,7,0.9);
}

/* Responsive settings for the transparent top bar */
@media only screen and (max-width: 768px) {

	.top-bar.tb-transp {
		background: #111111;
		background: rgba(7,7,7,0.9);
	}

}


/* ==================== 03. Home ==================== */
.home {
	z-index: 1;
}

.topspace {
	padding-top: 105px;
	background: #111111;
}

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

	.topspace {
		padding-top: 50px;
	}
	
	.home .bx-wrapper .bx-controls-direction a {
		top: 100%;
		margin-top: -53px;
	}

}


/* ==================== 04. Introduction ==================== */
.intro {
	background: #ffffff;
	padding-top: 100px;
	padding-bottom: 100px;
}

/* Icon navigation */
.icon-nav {
	text-align: center;
	margin-bottom: 25px;
}

.icon-nav a {
	display: inline-block;
}

.icon-nav i {
	display: block;
	margin: 0 auto 10px;
	width: 100px;
	height: 100px;
	line-height: 100px;
	text-align: center;
	font-size: 36px;
	color: #cccccc;
	background: none;
	-webkit-border-radius: 50px;
	   -moz-border-radius: 50px;
			border-radius: 50px;
}

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

	.icon-nav i {
		width: 80px;
		height: 80px;
		line-height: 80px;
		font-size: 24px;
		-webkit-border-radius: 40px;
		   -moz-border-radius: 40px;
				border-radius: 40px;
	}

}

.icon-nav a:hover > i {
	color: #ffffff;
	background: #ff4800;
}

.icon-nav b {
	font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif;
	font-style: normal;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 20px;
	color: #111111;
	display: block;
}

.icon-nav em {
	font-style: normal;
	font-size: 13px;
	font-weight: 400;
	line-height: 20px;
	color: #aaaaaa;
	display: block;
}


/* ==================== 05. Work ==================== */
.work {
	background: #f4f4f4;
	padding-top: 100px;
	padding-bottom: 100px;
}

/* Positioning for the arrow controls for the work slider */
.work .oc-left,
.work .oc-right {
	margin-top: -65px;
}

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

	.work .oc-left,
	.work .oc-right {
		margin-top: 20px;
	}

}


/* ==================== 06. Call to action ==================== */
.cta {
	padding-top: 100px;
	padding-bottom: 100px;
}


/* ==================== 07. Services ==================== */
.services {
	background: #ffffff;
	padding-top: 100px;
	padding-bottom: 100px;
}

/* Service item */
.service-item {
	position: relative;
	display: block;
	text-align: center;
	background: #ffffff;
	padding-bottom: 35px;
}

.service-item .subline {
	font-style: normal;
	font-size: 13px;
	font-weight: 400;
	line-height: 20px;
	color: #aaaaaa;
}

.service-item .serif {
	color: #aaaaaa;
}

.service-item hr {
	display: inline-block;
	width: 30px;
	height: 2px;
	background: #cccccc;
	margin-bottom: 20px;
}

.service-item ul {
	margin-bottom: 25px;
}

.service-item i {
	display: inline-block;
	width: 80px;
	height: 80px;
	line-height: 80px;
	text-align: center;
	font-size: 48px;
	color: #cccccc;
	-webkit-border-radius: 40px;
	   -moz-border-radius: 40px;
			border-radius: 40px;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.service-item:hover > i {
	color: #ff4800;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.service-item:hover > a.arrow-link:before {
	color: #ff4800;
}

/* Positioning for the arrow controls for the services slider */
.services .oc-left,
.services .oc-right {
	top: 70px;
	margin-top: 0;
}

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

	.services .oc-left,
	.services .oc-right {
		top: 100%;
		margin-top: 0;
	}

}


/* ==================== 08. Process ==================== */
.process {
	background: #222222;
	padding-top: 100px;
	padding-bottom: 100px;
}

/* Icon circles */
.icon-circle {
	display: block;
	text-align: center;
	margin-bottom: 50px;
}

.icon-circle i {
	display: block;
	margin: 0 auto 20px;
	width: 80px;
	height: 80px;
	line-height: 80px;
	text-align: center;
	font-size: 36px;
	color: #555555;
	background: none;
	-webkit-border-radius: 40px;
	   -moz-border-radius: 40px;
			border-radius: 40px;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.icon-circle:hover > i {
	font-size: 48px;
	color: #ffffff;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.icon-circle p {
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.icon-circle:hover > p {
	color: #aaaaaa;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}


/* ==================== 09. About ==================== */
.about {
	background: #f4f4f4;
	padding-top: 100px;
	padding-bottom: 100px;
}

.bg-white {
	background: #ffffff;
}

.bg-padding {
	padding: 75px 20px;
}

/* Quote slider */
.qs-wrap p {
	color: #aaaaaa;
}

.qs-wrap {
	margin-top: 2px;
}

.qs-wrap .bx-wrapper .bx-pager {
bottom: -25px;
}

/* Styling for the pagination for the quote slider */
.qs-wrap .bx-wrapper .bx-pager.bx-default-pager a {
	border: 1px solid #cccccc;
	filter: alpha(opacity=100);
	opacity: 1;
}

.qs-wrap .bx-wrapper .bx-pager.bx-default-pager a.active,
.qs-wrap .bx-wrapper .bx-pager.bx-default-pager a:hover {
	background: #cccccc;
	filter: alpha(opacity=100);
	opacity: 1;
}

/* Positioning for the arrow controls for the employee slider */
.about .oc-left,
.about .oc-right {
	margin-top: -50px;
}

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

	.about .oc-left,
	.about .oc-right {
		margin-top: 20px;
	}

}


/* ==================== 10. Contact ==================== */
.contact {
	background: #ffffff;
	padding-top: 100px;
	padding-bottom: 100px;
}

/* Contact form */
.c-form {
	margin-top: -15px;
	text-align: left;
}

/* Contact form feedback messages */
.c-message {
	text-align: left;
}

.error_message {
	text-align: left;
	color: tomato;
	margin-bottom: 10px;
}

/* Loader image */
.loader {
	margin-left: 10px;
}

/* Contact details */
.c-details a {
	color: #777777;
	display: inline-block;
}

.c-details a:hover,
.c-details a:hover i {
	color: #ff4800;
}

.c-details i {
	float: left;
	width: 15px;
	line-height: 25px;
	font-size: 14px;
	text-align: center;
	color: #111111;
}

.c-details span {
	display: block;
	width: auto;
	margin-bottom: 25px;
	margin-left: 30px;
}


/* ==================== 11. Footer ==================== */
/* Back to top button */
.back-top-wrap {
	text-align: center;
	height: 0;
}

.back-top {
	position: relative;
	top: -25px;
	display: inline-block;
	width: 50px;
	height: 50px;
	line-height: 48px;
	text-align: center;
	font-size: 14px;
	color: #ffffff;
	background: #ff4800;
	background: rgba(255,72,0,0.9);
	-webkit-border-radius: 25px;
	   -moz-border-radius: 25px;
			border-radius: 25px;
	z-index: 2;
}

.back-top:hover {
	background: rgba(255,72,0,1);
}

/* Social footer */
.social-footer {
	background: #111111;
	padding-top: 75px;
	padding-bottom: 50px;
	text-align: center;
	border-bottom: 1px solid #292929;
}

/* Social icons */
.sf-icons {
	width: 100%;
	position: relative;
	text-align: center;
	margin-bottom: 25px;
}

.sf-icons i {
	display: inline-block;
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	font-size: 28px;
	color: #888888;
	margin: 10px;
}

.sf-icons i:hover {
	color: #ffffff;
}

.sf-icons p {
	margin-top: 15px;
	margin-bottom: 0;
}

/* Footer */
.footer {
	background: #111111;
	padding-top: 60px;
	padding-bottom: 60px;
	text-align: center;
}

/* Footer promo */
.footer-promo {
	display: none;
	background: #111111;
	padding-top: 60px;
	padding-bottom: 60px;
	text-align: center;
}

.promo-control {
	position: relative;
	top: -25px;
	text-align: center;
	height: 0;
}

.promo-control a {
	padding-top: 10px;
	cursor: pointer;
	color: #333333;
}

.promo-control a:hover {
	color: #777777;
}


/* ==================== 12. 404 Page ==================== */
.fourofour {
	height: 100%;
}

.fourofour .header {
	height: 100%;
}

.error-circle {
	display: inline-block;
	margin: 0 auto;
	width: 300px;
	height: 300px;
	border-radius: 150px;
	background: #ffffff;
	padding: 25px;
}

.error-circle h1 {
	font-size: 90px;
	line-height: 1em;
	margin-top: 30px;
	margin-bottom: 15px;
}

.error-circle h5 {
	margin-bottom: 15px;
}

.error-circle hr {
	display: inline-block;
	width: 40px;
	height: 2px;
	background: #cccccc;
	margin-bottom: 10px;
}


/* ==================== 13. Responsive settings ==================== */
/* Tablet portrait - Medium */
@media only screen and (max-width: 768px) {

	.title hr {
		margin-bottom: 50px;
	}

	.bg-padding {
		padding: 50px 15px;
	}

	.intro,
	.work,
	.cta,
	.services,
	.process,
	.about,
	.contact,
	.social-footer {
		padding-top: 75px;
		padding-bottom: 75px;
	}

	.process,
	.social-footer {
		padding-top: 75px;
		padding-bottom: 50px;
	}

	.footer,
	.footer-promo {
		padding-top: 40px;
		padding-bottom: 40px;
	}

	.section-slider {
		padding-top: 75px;
		padding-bottom: 100px;
	}

	.c-form {
		margin-bottom: 25px;
	}

}

/* Smartphone landscape - Small */
@media only screen and (max-width: 480px) {

	.title hr {
		margin-bottom: 25px;
	}

	.bg-padding {
		padding: 25px 10px;
	}

	.intro,
	.work,
	.cta,
	.services,
	.process,
	.about,
	.contact {
		padding-top: 50px;
		padding-bottom: 50px;
	}

	.social-footer {
		padding-top: 50px;
		padding-bottom: 25px;
	}

	.footer,
	.footer-promo {
		padding-top: 25px;
		padding-bottom: 25px;
	}

	.section-slider {
		padding-top: 50px;
		padding-bottom: 100px;
	}

	.error-circle {
		width: 220px;
		height: 220px;
		border-radius: 110px;
		padding: 15px;
	}

	.error-circle h1 {
		font-size: 60px;
		line-height: 1em;
		margin-top: 25px;
		margin-bottom: 10px;
	}

	.error-circle h5 {
		font-size: 12px;
		margin-bottom: 5px;
	}

	.error-circle hr {
		display: inline-block;
		width: 40px;
		height: 2px;
		background: #cccccc;
		margin-bottom: 5px;
	}

}