/** ********************************************** **
	@Author			Dorin Grigoras
	@Website		www.stepofweb.com
	@Last Update	1:33 PM Friday, September 26, 2014

	TABLE CONTENTS
	-------------------------------
		01. Globals
		02. Boxed Layout
		03. Callout
		04. Slider
		05. Misc
		06. Maps
		07. Maintenance
		08. Error 404
		09. Coming Soon
		10. Word Rotator
		11. Item Box
		12. Timeline
		13. Portfolio
		14. Contact
		15. Onepage
		16. User Profile
		17. Comments
		18. Responsive
		--. DEMO ONLY

*************************************************** **/


/** 01. Globals
 **************************************************************** **/
html {
	overflow-x: hidden;
	overflow-y: auto;
}

html, body {
	min-height: 100%;
}

body {
	color:#666;
	background-color:#fff;
	font-family:'Open Sans', Arial, sans-serif;

	font-size:14px; line-height:23px;
	margin:0; padding:0 !important;
}
body.grey .divider .fa,
body.grey { /* grey background - YT style */
	background-color:#f1f2f7;
}

section {
	padding-top:60px;
	padding-bottom:60px;
}
	section.alternate .divider .fa,
	section.alternate {
		background-color:#F5F3F4;
	}
	body.grey section.alternate .divider .fa,
	body.grey section.alternate {
		background-color:#e9e9e9;
	}

	section.dark {
		color:#fff;
		background-color:#333;
	}



section header {
	display:block;
	margin-bottom:60px;
}
	section header p {
		margin:0;
		padding:0;
	}
	section header strong {
		font-weight:500;
	}
	section header h1,
	section header h2,
	section header h3 {
		margin-bottom:10px;
	}
figure {
	margin-bottom:20px;
}

input[type="color"], 
input[type="email"], 
input[type="number"], 
input[type="password"], 
input[type="tel"], 
input[type="url"], 
input[type="text"],
textarea, select {
	margin-bottom:10px;
}
.form-group input {
	margin:0;
}

.btn {
	-webkit-border-radius: 0;
	   -moz-border-radius: 0;
			border-radius: 0;
}

/* sticky header using bootstrap affix */
#header.sticky {
	display:block;
	left:0; right:0; 
	z-index:100;
}
#header.sticky.affix #topBar {
	display:none;
}
#header.sticky.affix.has-slider { /* slider above */
	top:0;
	margin-top:0 !important;
}





/** 02. Boxed Layout
 **************************************************************** **/
	body.boxed {
		background-color:#D7D6D6;
	}
	body.boxed #wrapper {
		position:relative;
	}
	body.boxed #wrapper,
	body.boxed #topBar, /* IE BUG */
	body.boxed footer {
		margin:auto;
		max-width:1170px;
	}
	body.boxed #wrapper {
		background-color:#fff;
		margin:30px auto !important;
		overflow:hidden;
		box-shadow:rgba(0,0,0,0.3) 0 0 6px;

		-webkit-border-radius: 6px;
		   -moz-border-radius: 6px;
				border-radius: 6px;
	}
	body.boxed #topBar {
		border-top:#333 4px solid;

		-webkit-border-radius: 6px;
		   -moz-border-radius: 6px;
				border-radius: 6px;	
	}
	body.boxed #header.sticky.affix {
		margin-top:-30px; /* wrapper margin */
	}

	body.boxed #header.sticky.affix #topNav.translucent {
		margin-top:30px !important;
	}

@media only screen and (max-width: 768px) {
	body.boxed #topBar,
	body.boxed #wrapper {
		margin:0 !important;
		-webkit-border-radius: 0;
		   -moz-border-radius: 0;
				border-radius: 0;
	}
}


/** 03. Callout
 **************************************************************** **/
.callout {
	z-index:10;
	background-color:#F6F6F6;
	padding:30px 0;
}
.callout.styleBackgroundColor h2,
.callout.styleBackgroundColor h3,
.callout.styleBackgroundColor h4,
.callout.styleBackgroundColor p {
	color:#fff;
}
.callout.styleBackgroundColor .btn {
	border-color:rgba(255,255,255,0.3);
}
.callout h2,
.callout h3,
.callout h4 {
	font-weight:300;
	margin:0 0 8px 0;
}
.callout p {
	margin:0;
	padding:0;
	font-size:16px;
	font-weight:300;
}
.callout .btn {
	margin-top:0;
}


.callout.dark,
.callout.dark h2,
.callout.dark h3,
.callout.dark h4,
.callout.dark p {
	color:#fff;
	background-color:#252525;
}

.callout.dark p {
	color:#b1b1b1;
	font-size:17px;
	max-width:960px;
	margin:auto;
}
.callout.dark.arrow-up,
.callout.dark.arrow-down {
	position:relative;
	padding:60px 0;
}

.callout.dark.arrow-down:after{
	content:' ';
	position:absolute;
	width: 0; height: 0; 
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-top: 20px solid #252525;
	left:50%; margin-left:-10px;
	bottom:-20px;
}
.callout.dark.arrow-up:after{
	content:' ';
	position:absolute;
	width: 0; height: 0; 
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-bottom: 20px solid #252525;
	left:50%; margin-left:-10px;
	top:-20px;
}

@media only screen and (max-width: 990px) {
	.callout h2,
	.callout h3,
	.callout h4 {
		font-size:18px;
		font-weight:600;
	}
	.callout .btn {
		margin-top:20px;
	}
}




/** 04. Slider
 **************************************************************** **/
div.slider {
	background-color:#171717;
	position:relative;
	z-index:1;

	-webkit-box-shadow: 0 4px 0 rgba(0, 0, 0, 0.04);
	   -moz-box-shadow: 0 4px 0 rgba(0, 0, 0, 0.04);
		 -o-box-shadow: 0 4px 0 rgba(0, 0, 0, 0.04);
			box-shadow: 0 4px 0 rgba(0, 0, 0, 0.04);
}

div.slider a.btn {
	color:#fff;
}
div.slider a.btn-default {
	color:#000;
}


	.tp-bannertimer {
		background:#777 !important;
		background:rgba(0,0,0,0.1) !important;
		height:4px !important;
	  }


	.tparrows.round:before {
		font-family: 'revicons';
		color: #fff;
		font-style: normal;
		font-weight: normal;
		speak: none;
		display: inline-block;
		text-decoration: inherit;
		margin-right: 0;
		margin-top: 9px;
		text-align: center;
		width: 40px;
		font-size: 20px;
	}
		.tparrows {
		
		}
	.tparrows.round {

		cursor: pointer;

		background: rgba(0, 0, 0, 0.5) !important;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		width: 40px !important;
		height: 40px !important;

	}
	.tparrows:hover {
		color: #fff;
	}
	.tp-leftarrow.round:before {
		content: '\e824';
	}
	.tp-rightarrow.round:before {
		content: '\e825';
	}
	.tparrows.tp-rightarrow:before {
		margin-left: 1px;
	}
	.tparrows.round:hover {
		background: rgba(0, 0, 0, 1) !important;
	}


/* CUSTOM TEXT */
.tp-caption.default_white {
	font-size: 18px;
	line-height: 21px;
	font-weight: 300;
	color: #fff;
	text-decoration: none;
	background-color: transparent;
	padding: 0px;
}
.tp-caption.default_black {
	font-size: 18px;
	line-height: 21px;
	font-weight: 300;
	color: #000;
	text-decoration: none;
	background-color: transparent;
	padding: 0px;
}
.tp-caption.block_black {
	background-color:#000;
}
.tp-caption.block_white {
	background-color:#fff;
}
.tp-caption.block_white,
.tp-caption.block_styleColor,
.tp-caption.block_black {
	white-space: nowrap;
	line-height: 34px;
	border-width: 0px;
	margin: 0px;
	padding: 1px 10px;
	letter-spacing: 0px;
	font-size: 22px;
	color:#fff;
}
.tp-caption.block_huge {
	font-size:130px;
	line-height:130px;
}
.tp-caption.block_huge.text-white {
	color:#fff;
}
.tp-caption.block_huge.text-black {
	color:#000;
}

/*
	@Flex Slider
*/
.flexslider.flexFull .flex-direction-nav a, 
.flexslider.flexContent .flex-direction-nav a {
	display: block;
	width: 45px;
	height: 45px;
	margin: -22px 0 0 0;
	background: #333333;
	position: absolute;
	top: 50%;
	z-index: 10;
	cursor: pointer;
	font-size:0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	color: transparent;
	opacity: 1;
	-webkit-transition: all .3s ease;
}
.flexslider.flexFull .flex-direction-nav a.flex-next:after, 
.flexslider.flexContent .flex-direction-nav a.flex-next:after {
	content: "\e080";
}
.flexslider.flexFull .flex-direction-nav a.flex-prev:after, 
.flexslider.flexContent .flex-direction-nav a.flex-prev:after {
	content: "\e079";
}

.flexslider.flexFull .flex-direction-nav a.flex-prev:after, 
.flexslider.flexFull .flex-direction-nav a.flex-next:after, 
.flexslider.flexContent .flex-direction-nav a.flex-prev:after, 
.flexslider.flexContent .flex-direction-nav a.flex-next:after {
	font: 12px/1em 'Glyphicons Halflings';
	left: 16px;
	top: 16px;
	font-style: normal;
	position: absolute;
	display: inline-block;
	color: #fff;
}

/*
	@Layer Slider
*/
div.layerslider div.ls-slide>div.ls-l.fullvideo {
	width:100% !important;
	height:100% !important;
}
.ls-borderlessdark .ls-thumbnail-inner,
div.ls-thumbnail-slide-container {
	background-color:rgba(0,0,0,0.1) !important;
}

/*
	@OWL Slider
*/
#bar {
  width: 0%;
  max-width: 100%;
  height: 4px;
  background: #999;
}
#progressBar{
  width: 100%;
  background: rgba(0,0,0,0.05);
}
div.owl-carousel>div {
	position:relative;
}
div.owl-carousel .caption {
	position:absolute;
	left:0; right:0; bottom:0;
	color:#333; font-size:20px;
	background:rgba(0,0,0,0.2);
	text-shadow:#fff 1px 1px 1px;
	text-align:center;
	padding:3px; margin-right:1px;
	z-index:10;
}




/** 05. Misc
 **************************************************************** **/
#toTop {
	background-color: #333;
	border-radius: 4px 4px 0 0;
	color: #FFF;
	position: fixed;
	height: 35px; width: 48px;
	right: 6px; bottom: 0;
	text-align: center;
	text-transform: uppercase;
	opacity: 0.9;
	padding-top: 7px;
	text-decoration:none;
	display:none;
	z-index: 1000;

	-webkit-transition: all 0.2s;
	   -moz-transition: all 0.2s;
		 -o-transition: all 0.2s;
			transition: all 0.2s;
}
#toTop:before {
	font-family: "fontawesome";
	content: "\f077";
}
span.user-avatar {
	background:#eee;
	width:64px; height:64px;
	float:left;
	margin-right:10px;
}
	section.page-title {
		padding:20px 0 0 0; 
		display:block; 
		position:relative;
		background-color:rgba(0,0,0,0.03);
		border-bottom:rgba(0,0,0,0.03) 1px solid;

		background-repeat: no-repeat;
		background-position: 50% 50%;

		-webkit-background-size: cover;
		   -moz-background-size: cover;
			 -o-background-size: cover;
				background-size: cover;
	}
	body.grey section.page-title {
		background-color:#ddd;
	}
	section.page-title header {
		margin:0;
	}
	section.page-title h1 {
		font-size: 2.2em;
		line-height: 42px;
	}

	section.page-title ul.breadcrumb {
		display:block;
	}
	section.page-title h2 {
		margin:0 0 -1px 0;
		padding-bottom:15px;
		border-bottom:rgba(0,0,0,0.07) 1px solid;
		display:inline-block;
	}

	ul.has-icons>li>i {
		margin-right:6px;
		min-width:15px;
	}
.callout  ul.list-icon li:before {
	font-size:20px;
}

section.brands {
	padding:30px 0;
}

.dropdown-menu .label {
	color:#fff !important;
	margin-top:-2px;
}

/* alert - callout */
.alert-default h4 {
	margin-bottom:3px;
}
.alert-default p:last-child {
	margin:0;
}

/* bootstrap form icons */
.has-feedback .form-control-feedback {
	top:30px;
}

/* range picker buttons */
.range_inputs .btn {
	padding:6px;
}

/* color picker */
.colorpicker.inline:before {
	display:none;
}

/* form slider */
.slider.slider-horizontal,
.slider.slider-vertical {
	background: transparent;
}

/* sidebar */
.tab-post {
	padding-bottom:20px;
	margin-bottom:20px;
	border-bottom:rgba(0,0,0,0.06) 1px solid;
}
.tab-post:last-child {
	border-bottom:0;
	margin-bottom:0;
	padding-bottom:0;
}
.tab-post .tab-post-link {
	font-size:13px;
	line-height:13px;
}
.tab-post small {
	display:block;
	font-size:10px;
}

/* sky-form */
.sky-form {
	margin-bottom:30px;
}

/* parallax */
.parallax {
	padding:60px 0;
	position:relative;
	background-color:rgba(0,0,0,0.8);
}
.parallax-overlay {
	position:absolute;
	left:0; right:0; top:0; bottom:0;
	background-image:url('../images/patterns/parallax_overlay.png');
	background-repeat:repeat;
	background-color:rgba(0,0,0,0.6);
	z-index:1;
}
.parallax .parallax-content {
	z-index:2;
}
@media only screen and (max-width: 1024px) {
	.parallax {
		background-attachment: scroll !important;
		background-position: center !important;
		background-size: 1024px 100% !important;
	}
}

/* footable */
.footable {
	-webkit-border-radius: 2px;
	   -moz-border-radius: 2px;
			border-radius: 2px;
}
.footable > thead > tr > th, .footable > thead > tr > td {
	background-image:none;
	background-color: rgba(0,0,0,0.03) !important;
}

/* search page */
form.search-big {
	margin-bottom:30px;
	margin-top:-30px;
	display:block;
}
form.search-big input {
	height:46px;
	border-width:1px;
	border: #c6c6c6 1px solid;
}
div.search-result {
	padding:20px 0;
	border-bottom:#eee 1px solid;
}
div.search-result h4 {
	margin:0;
	line-height:20px;
	font-weight:400;
}
div.search-result p {
	margin:0; padding:0;
}
div.search-result img {
	float:left; 
	margin-right:10px;
	margin-top:6px;
}
.search-title-aside {
	margin-top:20px;
	font-size:17px;
	line-height: 20px;
	color:#888;
	font-weight:400;
}
ul.search-history {
	border-bottom:#eee 1px solid;
	margin-bottom:0;
	padding-bottom:6px;
}


/* user profile */
.buttons-over-image {
	position:absolute;
	left:23px; top:8px;
}





/**	06. Maps
 *************************************************** **/
/* vectorial map */
#world-map {
	background-color:rgba(0,0,0,0.06);
	padding:0 3px 3px 0;
}

.jvectormap-zoomin, .jvectormap-zoomout {
	background: #333;
	width: 20px; height: 20px;
	padding: 4px 0;

	-webkit-border-radius: 50%;
	   -moz-border-radius: 50%;
			border-radius: 50%;
}

.jvectormap-zoomout {
	top: 40px;
}

/* gmaps.js */
#map, #panorama {
	height: 300px;
}




/**	07. Maintenance
 *************************************************** **/
.maintenance {
	padding: 20px;
	margin-top: 10%;
	background-color: rgba(0,0,0,0.05);
	font-family:'Open Sans';
	font-size:14px; 
	line-height:23px;
	text-align: center;
	font-weight:300;
}
.maintenance h1 {
	font-size:50px;
	line-height:50px;
	font-weight:300;
	margin-bottom:6px;
}
@media only screen and (max-width: 480px) {
	.maintenance h1 {
		font-size:40px;
		line-height:40px;
	}
}




/**	08. Error 404
 *************************************************** **/
.default-404 {
	font-size:170px;
	line-height:170px;
	color:rgba(0,0,0,0.3);
	text-align:center;
	display:block;
	margin-bottom:30px;
}

@media only screen and (max-width: 600px) {
	.default-e404 p {
		margin-bottom:60px;
	}
	.default-404 {
		display:none;
	}
}




/**	09. Coming Soon
 *************************************************** **/
.comingsoon {
	padding: 20px;
	margin-top: 10%;
	background-color: rgba(0,0,0,0.05);
	font-family:'Open Sans';
	font-size:14px; 
	line-height:23px;
	text-align: center;
	font-weight:300;
	color:#000;
}
.comingsoon hr {
	border:0;
	border-bottom:rgba(0,0,0,0.1) 2px solid;
}
.comingsoon h1 {
	font-size:50px;
	line-height:50px;
	font-weight:300;
	margin-bottom:6px;
}

.comingsoon span.countdown_amount {
	font-size: 50px !important;
	padding: 15px;
}
.comingsoon span.countdown_section {
	color: #fff;
	padding: 30px 45px;
	margin-bottom: 2px;
	background: rgba(0,0,0,0.05);
	text-align: center;
}
.comingsoon span.countdown_row span { 
	font-size: 16px;
	line-height: 19px;
	margin-right: 1px;
	text-align: center;
	display: inline-block;
}
.comingsoon .form-control {
	height:38px;
	border:0;

	-webkit-border-radius:0;
	   -moz-border-radius:0;
			border-radius:0;
}

@media only screen and (max-width: 960px) {
	.comingsoon span.countdown_amount {
		font-size:50px !important;
		padding:6px;
	}
	.comingsoon span.countdown_section {
		padding:20px;
	}
	.comingsoon span.countdown_row span {
		font-size:14px;
	}
}
@media only screen and (max-width: 550px) {
	.comingsoon h1 {
		font-size:40px;
		line-height:40px;
	}

	.comingsoon span.countdown_amount {
		font-size:20px !important;
		padding:6px;
	}
	.comingsoon span.countdown_section {
		font-size:12px;
		padding:10px;
	}
	.comingsoon span.countdown_row span {
		font-size:11px;
	}
}




/** 10. Word Rotator
 **************************************************************** **/
.word-rotator {
	visibility: hidden;
	width: 100px;
	height: 0;
	margin-bottom:-11px;
	display: inline-block;
	overflow: hidden;
	text-align: left;
	position: relative;
}
	h2 .word-rotator {
		bottom:2px;
		height: 42px !important;
	}
	h3 .word-rotator {
		bottom:9px;
		height: 24px !important;
	}
	h4 .word-rotator {
		bottom:5px;
		height: 27px !important;
	}
	h5 .word-rotator {
		bottom:7px;
		height: 18px !important;
	}
	p .word-rotator {
		bottom:5px;
	}
	p.lead .word-rotator {
		bottom:4px;
	}
.word-rotator.active {
	visibility: visible;
	width: auto;
}
.word-rotator .items {
	position: relative;
	width: 100%;
}
.word-rotator .items span {
	display:block;
	margin-bottom:0;
}




/** 11. Item Box
 **************************************************************** **/
.item-box {
	background:#f6f6f6;
	overflow:hidden;
	margin:16px 0;
	position:relative;
	display:inline-block;

	-webkit-border-radius:0;
	   -moz-border-radius:0;
			border-radius:0;
}
	.item-box.fullwidth {
		max-width:100%;
	}
	section.alternate .item-box {
		background-color:#fff;
	}


.item-box figure {
	width:100%;
	display:block;
	margin-bottom:0;
	overflow:hidden;
	position:relative;
	text-align:center;
}
	.item-box.fixed-box figure img {
		width:100%;
		height:auto;
	}
.item-box-desc {
	padding:10px 20px;
	overflow:hidden;
}
.item-box-desc p {
	margin-top:20px;
	display:block;
	overflow:hidden; 
	text-overflow:ellipsis;
	/*white-space: nowrap;*/
}
	.item-box.fixed-box .item-box-desc p {
		height:98px;
	}
.item-box-desc h4 {
	padding:0; margin:0;
}
.item-box .item-box-desc small {
	display:block;
}

.item-box.fixed-box .item-box-desc {
	height:256px;
}

.item-box.fixed-box figure {
	max-height:263px;
}
.item-box .socials {
	border-top:#eee 1px solid;
	text-align:center;
	display:block;
}


/* hover */
.item-box .item-hover {
	opacity: 0;
	filter: alpha(opacity=0);
	position:absolute;
	left:0; right:0; top:0; bottom:0;
	text-align:center;
	color:#fff;

	-webkit-transition: all 0.2s;
	   -moz-transition: all 0.2s;
		 -o-transition: all 0.2s;
			transition: all 0.2s;
}
.item-box .item-hover,
.item-box .item-hover button,
.item-box .item-hover a {
	color:#fff;
}
.item-box .item-hover .inner {
	position:absolute;
	display:block;
	left:0; right:0; top:50%;
	margin-top:-10px;
	z-index:100;
}
.item-box:hover .item-hover {
	opacity: 1;
	filter: alpha(opacity=100);
}

.nav-pills>li.active>a, 
.nav-pills>li.active>a:hover, 
.nav-pills>li.active>a:focus {
	color:#333;
	background-color:rgba(0,0,0,0.07);
}
.item-box .item-hover .overlay {
	background-color:rgba(127,127,127,0.6);
}



/** Box Content **/
.box-content.thumbnail {
	position:relative;
	max-width:255px;
	display:inline-block;
	margin-bottom:30px;
	border:0; padding:0;
	background:rgba(0,0,0,0.03);
}
.box-content.thumbnail:hover {
	background:rgba(0,0,0,0.08);
	border:0 !important;
}
.box-content.thumbnail .item-image {
	position:relative;
	display:inline-block;
	overflow:hidden;
}
.box-content.thumbnail  h3 {
	position:absolute;
	bottom:10px; left:0;
	text-align:left;
	font-size:18px;
	line-height:18px;
	color:#fff;
}
	.box-content.thumbnail img {
		width:100%; /* IE fix */
	}
.box-content.thumbnail  h3 span {
	display:inline-block;
	background-color:rgba(0,0,0,0.8);
	padding:10px 10px 20px 10px;
}
.box-content.thumbnail  h3 small {
	display:inline-block; color:#333;
	background:rgba(255,255,255,0.9);
	padding:3px; margin-top:-10px;
	position:absolute; bottom:-10px; left:10px;
}
.box-content.thumbnail p {
	font-size:12px;
	line-height:16px;
	text-align:left;
	height:80px;
	overflow:hidden; 
	text-overflow:ellipsis;
	border-bottom:#eee 1px solid;
	padding-bottom:10px;
	margin-bottom:6px;
}
@media only screen and (max-width: 480px) {
	.box-content.thumbnail  h3 {
		font-size:15px;
		line-height:15px;
	}
}

.box-content .item-image>img {
	-webkit-transition: all .2s ease 0s;
	   -moz-transition: all .2s ease 0s;
		 -o-transition: all .2s ease 0s;
			transition: all .2s ease 0s;
}

.box-content .item-image:hover>img {
	-webkit-transform: scale(1.1, 1.1);
	-moz-transform: scale(1.1, 1.1);
	-ms-transform: scale(1.1, 1.1);
	-o-transform: scale(1.1, 1.1);
	transform: scale(1.1, 1.1);
}





/** 12. Timeline
 **************************************************************** **/
.timeline {
	position:relative;
	margin-bottom:60px;
}


/* left */
.timeline .timeline-left .item {
	background-color: rgba(0,0,0,0.06);
	border-right:rgba(0,0,0,0.06) 3px solid;
	padding:15px;
	margin-left:50px;
	margin-bottom:30px;
	position:relative;
}
.timeline .timeline-left .item:after {
	right: 100%;
	border: solid transparent;
	content: " ";
	width: 0; height: 0;
	position: absolute;
	border-right-color: rgba(0,0,0,0.06);
	border-width: 10px;
	top: 10px; left:-20px;
}
.timeline .timeline-left .item:before {
	right: 100%;
	border: #ddd 5px solid;
	content: " ";
	position: absolute;
	top: 10px; left:-50px;
	background-color:#333;
	width:22px; height:22px;
	z-index:1;

}
.timeline-left:after {
	background: #ddd;
	z-index:0;

	content: "";
	display: block;
	left: 10px; top:0; bottom:0;
	position: absolute;
	width: 4px;
	opacity: 0.35;
}
.timeline  .timeline-left .timeline-centered-title {
	float:right;
	content:' ';
	clear:both;
	font-size:19px;
}

/* right */
.timeline .timeline-right .item {
	background-color: rgba(0,0,0,0.06);
	border-left:rgba(0,0,0,0.06) 3px solid;
	padding:15px;
	margin-right:50px;
	margin-bottom:30px;
	position:relative;
}
.timeline .timeline-right .item:after {
	right: 100%;
	border: solid transparent;
	content: " ";
	width: 0; height: 0;
	position: absolute;
	border-left-color: rgba(0,0,0,0.06);
	border-width: 10px;
	top: 10px; right:-20px;
}
.timeline .timeline-right .item:before {
	right: 100%;
	border: #ddd 5px solid;
	content: " ";
	position: absolute;
	top: 10px; right:-50px;
	background-color:#333;
	width:22px; height:22px;
	z-index:1;

}
.timeline-right:after {
	background: #ddd;
	z-index:0;

	content: "";
	display: block;
	right: 10px; top:0; bottom:0;
	position: absolute;
	width: 4px;
	opacity: 0.35;
}
.timeline .timeline-right .item h4 {
	text-align:right;
}
.timeline .timeline-right .timeline-centered-title {
	float:left;
	content:' ';
	clear:both;
	font-size:19px;
}

/** centered **/
.timeline .timeline-centered .item {
	background-color: rgba(0,0,0,0.06);
	padding:15px;
	margin-bottom:30px;
	position:relative;
	margin-top:100px;
}
.timeline .timeline-centered .item:first-child {
	margin-top:0;
}
.timeline-centered:after {
	background: #ddd;
	z-index:0;

	content: "";
	display: block;
	top:0; bottom:0;
	position: absolute;
	width: 4px;
	opacity: 0.35;

	left: 50%;
	margin-left: 0;
	height:100%;
}
.timeline-centered .item {
	max-width:46%;

}
.timeline .timeline-centered .item.pull-right:after {
	right: 100%;
	border: solid transparent;
	content: " ";
	width: 0; height: 0;
	position: absolute;
	border-right-color: rgba(0,0,0,0.06);
	border-width: 10px;
	top: 10px; left:-20px;
}
.timeline .timeline-centered .item.pull-right:before {
	right: 100%;
	border: #ddd 5px solid;
	content: " ";
	position: absolute;
	top: 10px; left:-43px;
	background-color:#333;
	width:22px; height:22px;
	z-index:1;

}
.timeline .timeline-centered .item.pull-left:after {
	right: 100%;
	border: solid transparent;
	content: " ";
	width: 0; height: 0;
	position: absolute;
	border-left-color: rgba(0,0,0,0.06);
	border-width: 10px;
	top: 10px; right:-20px;
}
.timeline .timeline-centered .item.pull-left:before {
	right: 100%;
	border: #ddd 5px solid;
	content: " ";
	position: absolute;
	top: 10px; right:-46px;
	background-color:#333;
	width:22px; height:22px;
	z-index:1;

}
.timeline .timeline-centered .item.pull-left h4 {
	text-align:right;
}
.timeline .timeline-centered .item.pull-right .timeline-centered-title {
	float:right;
	content:' ';
	clear:both;
	font-size:19px;
}
.timeline .timeline-centered .item.pull-left .timeline-centered-title {
	float:left;
	content:' ';
	clear:both;
	font-size:19px;
}

.timeline  .timeline-centered p {
	content:'';
	clear:both;	
}

@media only screen and (max-width: 768px) {
	.timeline-centered .item {
		width:100% !important;
		max-width:100% !important;
		margin:0 0 30px 0 !important;
	}
	.timeline .timeline-centered .item.pull-left,
	.timeline .timeline-centered .item.pull-right {
		float:none !important;
		display:block !important;
		position:relative !important;
	}
	.timeline .timeline-centered .item.pull-left h4 {
		text-align:left;
	}
	.timeline .timeline-centered .item.pull-right:after,
	.timeline .timeline-centered .item.pull-right:before,
	.timeline .timeline-centered .item.pull-left:after,
	.timeline .timeline-centered .item.pull-left:before,
	.timeline-centered:after {
		display:none;
	}
}



/** 13. Portfolio
 **************************************************************** **/
/* item list */
#portfolio .item-box-desc h4 {
	font-size:17px;
	max-height:32px;
	overflow:hidden;
}
	#portfolio .item-box figure img {
		width:100%;
		margin:auto;
	}

#portfolio .item-box-desc small {
	font-size:12px;
	margin-bottom:0;
}

#portfolio .item-box a {
	text-decoration:none;
}

/* Full Width */
#portfolio ul.fullwidth .isotope-item,
#portfolio ul.fullwidth .item-box {
	margin:0;
}
#portfolio ul.fullwidth .item-box .overlay,
#portfolio ul.fullwidth .item-box {
	-webkit-border-radius: 0;
	   -moz-border-radius: 0;
			border-radius: 0;
}
#portfolio ul.fullwidth .isotope-item {
	width:20%; /* 5 items / row - also, see responsive*/
	float:left;
}

#portfolio .project_quick_info span {
	padding:0 8px;
}
#portfolio .project_quick_info i.fa {
	padding-right:6px;
}


/* Full Center */
#portfolio ul.fullcenter {
	margin-left:15px;
	margin-right:15px;
}
#portfolio ul.fullcenter .isotope-item,
#portfolio ul.fullcenter .item-box {
	margin:0;
}
#portfolio ul.fullcenter .item-box .overlay,
#portfolio ul.fullcenter .item-box {
	-webkit-border-radius: 0;
	   -moz-border-radius: 0;
			border-radius: 0;
}
#portfolio ul.fullcenter .isotope-item {
	width:25%; /* 4 items / row - also, see responsive*/
	float:left;
}

@media only screen and (max-width: 960px) {
	#portfolio ul.fullwidth .isotope-item,
	#portfolio ul.fullcenter .isotope-item {
		width:33.333333333%;  /* 3 items / row */
	}
}
@media only screen and (max-width: 768px) {

}
@media only screen and (max-width: 479px) {
	#portfolio ul.fullwidth .isotope-item,
	#portfolio ul.fullcenter .isotope-item {
		width:100%;  /* 1 item / row */
	}
}




/** 14. Contact
 **************************************************************** **/
#gmap {
	width:100%;
	height:400px;
	display:block;

	z-index:1;
}
#gmap.gmap-half {
	height:250px;
}
#gmap.grayscale {
	-webkit-filter: grayscale(100%);
	   -moz-filter: grayscale(100%);
		-ms-filter: grayscale(100%);
		-o-filter: grayscale(100%);
		   filter: grayscale(100%);
		   filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
		   filter: gray; 
}



/** 15. Onepage
 **************************************************************** **/
.divider.onepage {
	max-width:300px;
}
.divider.onepage.center {
	margin: 60px auto;
}
.divider.half-margins.onepage.center {
	margin: 30px auto;
}
h1.font-dosis,
h2.font-dosis,
h3.font-dosis,
h4.font-dosis,
h5.font-dosis,
h6.font-dosis {
	font-family:'Dosis';
}

form.onepage input[type="text"], 
form.onepage input[type="password"], 
form.onepage input[type="email"], 
form.onepage input[type="phone"], 
form.onepage textarea, 
form.onepage textarea:focus, 
form.onepage select, 
form.onepage select:focus {
	border: #ddd 1px solid;
	margin: 0 !important;
	padding: 16px;
	font-size: 16px;
	box-shadow: none !important;
	background: #fff;
}
form.onepage .row div {
	padding-top: 4px;
	padding-right: 2px;
	padding-left: 2px;
}
form {
	padding-left:15px;
	padding-right:15px;
}
.onepage-slider-offset {
	padding-top:60px;
}
body.boxed .onepage-slider-offset {
	padding-top:30px;
}







/**	16. User Profile
 *************************************************** **/
.profile-buttons {
	background-color:rgba(0,0,0,0.05);
	padding:15px;
}
.profile-buttons h2 {
	margin:0; padding:0;
	font-size:30px;
	line-height:30px;
}
.profile-btn-link {
	padding:4px 10px !important;
	margin:0 !important;
	color:#999;
}
.profile-activity h6 {
	margin-bottom:6px;
	padding-left:15px;
	font-weight:bold;
}
.profile-activity p {
	font-size:13px;
	padding-left:15px;
}

.profile-tabs {
	border-top:rgba(0,0,0,0.1) 1px solid;
	padding-top:30px;
	margin-top:-1px;
}


time.datebox {
	font-size: 14px;
	display: block;
	position: relative;
	width: 35px;
	background-color: #fff;
	margin: 3px auto;
	border:1px solid;
}
time.datebox strong {
	padding: 2px 0;
	color: #fff;
	background-color:rgba(0,0,0,0.7);
	display:block;
	text-align:center;
}
time.datebox span {
	font-size: 15px;
	color: #2f2f2f;
	display:block;
	text-align:center;
}




/** 17. Comments
 *************************************************** **/
#comments {
	margin-top:60px;
}
#comments .comment {
	margin:40px 0;
}
#comments a.replyBtn {
	float:right;
	font-size:11px;
	text-transform:uppercase;
}
#comments span.user-avatar {
	background:#eee;
	width:64px; height:64px;
	float:left;
	margin-right:10px;
}

ul.comment {
	margin-bottom:30px;
}
li.comment {
	position:relative;
	margin-bottom:25px;
	font-size:13px;
}
li.comment p {
	margin:0; padding:0;
}
li.comment img.avatar {
	position:absolute;
	left:0; top:0;
	display:inline-block;
}
li.comment.comment-reply img.avatar {
	left:6px; top:6px;
}
li.comment .comment-body {
	position:relative;
	padding-left:60px;
}
li.comment.comment-reply {
	margin-left:60px;
	background-color:#fafafa;
	padding:6px;
	margin-bottom:6px;
}
li.comment a.comment-author {
	margin-bottom:6px;
	display:block;
}
li.comment a.comment-author span {
	font-size:15px;
}




/** 18. Responsive
 **************************************************************** **/
@media only screen and (max-width: 1216px) {
	.container {
		width:100%;
	}
}

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

@media only screen and (max-width: 768px) {
	#header.sticky #topNav {
		max-height: 300px;
		overflow-y: auto;
		width:100%;
	}
}

@media only screen and (max-width: 480px) {
	.alert-default div.text-right {
		text-align:left;
	}
	.alert-default .btn {
		margin-top:20px;
	}

	/* centered page-title */
	section.page-title h2,
	section.page-title h2 span,
	section.page-title {
		text-align:center;
	}
}




/** --. DEMO ONLY
 **************************************************************** **/
/** feature-icons.html - icon text color - can be removed on production **/
.fa-hover a {
	display:block;
	padding:4px;
	text-decoration:none;
}
.fa-hover a:hover {
	background-color:#f3f3f3;
}
.fa-hover i {
	width:20px;
	margin-right:10px;
}
.fa-hover a span { 
	color:#666;
}
/** *** **/



.bs-glyphicons .glyphicon-class {
	display: block;
	text-align: center;
	word-wrap: break-word;
}
.bs-glyphicons .glyphicon {
	margin-top: 5px;
	margin-bottom: 10px;
	font-size: 24px;
}
.bs-glyphicons li {
	float: left;
	width: 25%;
	height: 115px;
	padding: 10px;
	font-size: 10px;
	line-height: 1.4;
	text-align: center;
	border: 1px solid #fff;
	background-color: #f9f9f9;
	cursor:pointer;
}
.bs-glyphicons li:hover {
	background-color:#f3f3f3;
}
@media (min-width: 768px) {
	.bs-glyphicons li {
		width: 12.5%;
		font-size: 12px;
	}
}

.iconExamples .example {
	text-align: center;
	cursor:pointer;
	padding:6px 3px;
}
.iconExamples .example:hover {
	background-color:#f3f3f3;
}
.iconExamples .example:before, 
.iconExamples .example:after {
	content: " ";
	display: table;
}
.iconExamples .example .icon {
	font-size: 20px;
	float: left;
	width: 35px;
}
.iconExamples .example .class {
	text-align: center;
	font-size: 13px;
	float: left;
	margin-top: 0;
	font-weight: 400;
	margin-left: 10px;
	color: #333;
}



/** *** **/
.grid-color span {
	display:block;
	padding: 10px 0;
	text-align: center;
	background-color:rgba(0,0,0,0.1);
}
.grid-demo [class*="col-"] {
	background: #fafafa;
	border: 1px solid;
	border-color: #ddd;
	padding: 10px;
	text-align: center;
	margin-bottom:20px;
}
.grid-demo .row {
	margin-left:0;
	margin-right:0;
}

/** *** **/
.linecon .icon {
	width: 12.5%;
	float: left;
	height: 115px;
	text-align: center;
	padding: 22px 10px;
	margin: 0 -1px -1px 0;
	border: 1px solid #fff;
	background-color: #f6f6f6;
	word-wrap: break-word;
	cursor:pointer;
}
.linecon .icon:hover {
	background-color:#f3f3f3;
}
.linecon .icon i {
	display: block;
	font-size: 30px;
	margin-bottom: 10px;
}