/*!
 * 
 * Navara v.1.0.0
 * 
 */

/*
[Table of contents]

1. General Styles
2. Heading style
3. Filter Tabs
4. Carousel Styling
5. Main Slider Section
6. Image Hover Styles
7. Portfolio Section
8. Social Links
9. Services Section
10. Team Section
12. Blog Section
13. Contact Section
14. Site Bottom Section
*/
 
/*** General Styles
----------------------------------------------------------------- ***/

::selection {
	color:#fff;
}
::-moz-selection {
	color:#fff;
}

.scroll-button.navbar {
    background: none repeat scroll 0 0 transparent;
    margin: 0 0 0 -22px !important;
    padding: 0 !important;
}
.scroll-button.navbar > a, .scroll-button.navbar > a:hover, .scroll-button.navbar > a:focus {
    color: #fff;
}

.image-hover img,
.image img {
	width:100%;
}
.section .heading-upper {
	padding:50px 0px 35px 0px;
}
.section .heading-upper-dark {
	padding:50px 0px 35px 0px;
	margin-bottom:60px;
	background-color:rgba(0,0,0,0.7);
}
.section .content-section {
	padding-bottom:30px;
}
.section-parallax .content-section {
	padding-bottom:50px;
}
.social-section {
	padding:45px 0px 40px 0px;
}

/*** section-parallax ***/

.section-parallax {
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	-moz-background-size:cover;
	-webkit-background-size:cover;
	background-attachment:fixed;
	color:#fff;
}
.section-parallax .heading h2:before,
.section-parallax .heading h2:after {
	border-color:#fff;
}
.section-parallax .heading h2 span:before,
.section-parallax .heading h2 span:after {
	background-color:#fff;
}
.section-parallax .form-control,
.section-parallax .form-wrap:before,
.section-parallax .form-wrap:after {
	border-color:#fff;
}
.section-parallax .form-wrap:before,
.section-parallax .form-control,
.section-parallax a {
	color:#fff;
}
.section-parallax .form-control::-moz-placeholder {
  color:#fff;
}
.section-parallax .form-control:-ms-input-placeholder {
  color:#fff;
}
.section-parallax .form-control::-webkit-input-placeholder {
  color:#fff;
}

.no-padding-bottom {
	padding-bottom:0px !important;
}
.no-padding-top {
	padding-top:0px !important;
}

#map-canvas {
	width:100%;
	height:300px;
}

#preloader {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#fff; /* change if the mask should have another color then white */
    z-index:9999999; /* makes sure it stays on top */
}
#status {
    width:200px;
    height:200px;
    position:absolute;
    left:50%; /* centers the loading animation horizontally one the screen */
    top:50%; /* centers the loading animation vertically one the screen */
    background-image:url(../images/preloader.GIF); /* path to your loading animation */
    background-repeat:no-repeat;
    background-position:center;
    margin:-100px 0 0 -100px; /* is width and height divided by two */
}


/*** Heading style
------------------------------------------------------------ ****/
.heading {
	width:90%;
	margin:auto;
	text-align:center;
	position:relative;
}
.heading h2 {
	display:inline-block;
	padding-bottom:38px;
	margin-bottom:20px;
	position:relative;
}
.heading h2 span:before,
.heading h2 span:after {
	width:88px;
	max-width:100%;
	height:2px;
	display:block;
	content:'';
	
	position:absolute;
	bottom:-1px;
	left:50%;
}
.heading h2 span:before {
	margin-left:-110px;
}
.heading h2 span:after {
	margin-left:12px;
}
.heading h2:before,
.heading h2:after {
	display:block;
	content:'';
	border:2px solid transparent;
	
	transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	
	position:absolute;
	bottom:-14px;
	left:50%;
}
.heading h2:before {
	width:28px;
	height:28px;
	margin-left:-19px;
}
.heading h2:after {
	width:10px;
	height:10px;
	margin-left:-10px;
	margin-bottom:9px;
}
.heading h2 + h4 {
	margin-top:25px;
}
.heading p {
	font-size:18px;
	line-height:1.75em;
}
.heading p:last-of-type {
}


/*** Filter Tabs
------------------------------------------------------------ ***/
.filter-tabs,
.filter-list,
.social-links,
.options {
	padding:0px;
	margin:0px;
	list-style:none;
	text-align:center;
}

.filter-tabs {
	margin-bottom:50px;
	text-align:center;
}
.filter-tabs li {
	padding:5px 18px;
	display:inline-block;
	color:#7e7e7e;
	font-size:15px;
	line-height:32px;
	border:2px dashed transparent;
	cursor:pointer;
	
	transition:border-color 0.6s ease-out;
}
.filter-tabs li.active {
	border-color:#ededed;
}
.filter-list {
	margin-left:-20px;
}
.filter-list > li {
	width:50%;
	padding-left:20px;
	margin-bottom:20px;
	float:left;
}
.filter-list li.mix {
	display:none;
}


/*** Carousel Styling
------------------------------------------------------------- ***/
.owl-buttons:before,
.owl-buttons:after {
	display:table;
	content:'';
}
.owl-buttons:after {
	clear:both;
}
.owl-buttons {
	margin-bottom:20px;
}
.owl-buttons > div {
	width:55px;
	height:55px;
	line-height:55px;
	margin-top:0px;
	text-align:center;
	font-size:32px;
	border-top:1px solid;
	text-indent:-9999px;
	position:relative;
	overflow:hidden;
}
.owl-buttons > div:before {
	width:55px;
	height:55px;
	line-height:55px;
	display:block;
	content:'';
  font-family: FontAwesome;
	font-size:32px;
	line-height:55px;
	text-indent:0px;
}
.owl-buttons > div.owl-prev:before {
	content:'\f0a8';
}
.owl-buttons > div.owl-next:before {
	content:'\f0a9';
}

.owl-buttons > div.owl-prev {
	border-left:1px solid;
	float:left;
}
.owl-buttons > div.owl-next {
	border-right:1px solid;
	float:right;
}


.owl-pagination {
	padding-top:30px;
	text-align:center;
}
.owl-pagination > div {
	width:16px;
	height:16px;
	margin:0 5px;
	background-color:transparent;
	border:1px solid;
	display:inline-block;
	
	border-radius:50%;
	-moz-border-radius:50%;
	-webkit-border-radius:50%;
	-o-border-radius:50%;
}


/***** Main Slider Section
------------------------------------------------------------- ****/
.diamond-box {
	width:420px;
	height:420px;
	padding:130px 0px;
	text-align:center;
	color:#ffffff;
	/* border:6px solid #ffffff; */
	position:relative;
	
	transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
}
.diamond-box .diamond-inner {
	transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
}
.slider-slogan {
	margin-bottom:0px;
	letter-spacing:-0.04em;
}
.img-holder img {
	width:auto !important;
	height:auto !important;
}

.diamond-box .scroll-button {
	width:60px;
	height:60px;
	line-height:60px;
	margin-left:-22px;
	font-size:22px;
	text-align:center;
	border:6px solid #ffffff;
	cursor:pointer;
	display:block;

	position:absolute;
	bottom:-229px;
	left:50%;

	transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
}
.diamond-box .scroll-button span {
	width:60px;
	height:60px;
	margin-top:-5px;
	margin-left:-5px;
	line-height:60px;
	display:block;

	transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
}

.page-wraper .tp-leftarrow.default,
.page-wraper .tp-rightarrow.default {
	width:30px;
	height:30px;
	margin:0px !important;
	background-image:none;
	border-style:solid;
	border-color:#fff;

	transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-webkit-transition:all 0.4s ease;
	
	transform:translate(0px, 0px);
}
.page-wraper .tp-leftarrow.default {
	border-width:0px 0px 3px 3px;
	top:auto !important;
	bottom:20px !important;
	left:20px !important;
}
.page-wraper .tp-leftarrow.default:hover {
	transform:translate(-10px, 10px);
}
.page-wraper .tp-rightarrow.default {
	top:20px !important;
	border-width:3px 3px 0px 0px;
	right:20px !important;
}
.page-wraper .tp-rightarrow.default:hover {
	transform:translate(10px, -10px);
}


/*** Image Hover Styles
------------------------------------------------------------- ***/

.image-hover {
	position:relative;
}
.image-hover figcaption,
.image-hover figcaption a.portfolio-link {
	color:#fff;
	text-align:center;
	display:block;
	
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
}
.image-hover figcaption {
	background-color:rgba(0,0,0,0.6);
}


/*** Portfolio Section
------------------------------------------------------------ ***/
.portfolio-list {
	overflow:hidden;
}
.image-hover figcaption,
.portfolio-box .image-hover figcaption:before,
.portfolio-box .image-hover figcaption:after,
.portfolio-box .image-hover figcaption a.portfolio-link:before,
.portfolio-box .image-hover figcaption a.portfolio-link:after,
.portfolio-box .image-hover figcaption .h4,
.portfolio-box .image-hover figcaption p {
	visibility:hidden;
	opacity:0;
	filter:alpha(opacity=0);

	transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
}
.image-hover:hover figcaption,
.portfolio-box .image-hover:hover figcaption .h4,
.portfolio-box .image-hover:hover figcaption p {
	visibility:visible;
	opacity:1;
	filter:alpha(opacity=100);
}
.portfolio-box .image-hover figcaption:before,
.portfolio-box .image-hover figcaption:after,
.portfolio-box .image-hover figcaption a.portfolio-link:before,
.portfolio-box .image-hover figcaption a.portfolio-link:after {
	display:block;
	content:'';
	position:absolute;
	background-color:#fff;
	
	transition-delay:0.3s;
	-moz-transition-delay:0.3s;
	-webkit-transition-delay:0.3s;
}
.portfolio-box .image-hover figcaption:before,
.portfolio-box .image-hover figcaption:after {
	width:1px;
	top:20px;
	bottom:20px;
}
.portfolio-box .image-hover figcaption a.portfolio-link:before,
.portfolio-box .image-hover figcaption a.portfolio-link:after {
	height:1px;
	left:20px;
	right:20px;
}
.portfolio-box .image-hover figcaption:before {
	left:0px;
}
.portfolio-box .image-hover figcaption:after {
	right:0px;
}
.portfolio-box .image-hover:hover figcaption:before {
	left:40px;
}
.portfolio-box .image-hover:hover figcaption:after {
	right:40px;
}
.portfolio-box .image-hover figcaption a.portfolio-link:before {
	top:0px;
}
.portfolio-box .image-hover figcaption a.portfolio-link:after {
	bottom:0px;
}
.portfolio-box .image-hover:hover figcaption a.portfolio-link:before {
	top:40px;
}
.portfolio-box .image-hover:hover figcaption a.portfolio-link:after {
	bottom:40px;
}
.portfolio-box .image-hover figcaption .h4,
.portfolio-box .image-hover figcaption p {
	position:absolute;
	top:50%;
	left:0px;
	right:0px;
}
.portfolio-box .image-hover figcaption .h4 {
	font-size:16px;
	margin-top:-30px;
	
	transform:scale(2);
	-moz-transform:scale(2);
	-webkit-transform:scale(2);
	
	transition-delay:0.6s;
	-moz-transition-delay:0.6s;
	-webkit-transition-delay:0.6s;
}
.portfolio-box .image-hover:hover figcaption .h4 {
	transform:scale(1);
	-moz-transform:scale(1);
	-webkit-transform:scale(1);
}
.portfolio-box .image-hover figcaption p {
	font-size:12px;
	margin-bottom:-30px;
	
	transform:translateY(40px);
	-moz-transform:translateY(40px);
	-webkit-transform:translateY(40px);

	transition-delay:0.8s;
	-moz-transition-delay:0.8s;
	-webkit-transition-delay:0.8s;
}
.portfolio-box .image-hover:hover figcaption p {
	transform:translateY(0px);
	-moz-transform:translateY(0px);
	-webkit-transform:translateY(0px);
}


/*** Social Links
------------------------------------------------------------ ***/
.social-links li,
.options li [class^="icon-"] {
	width:50px;
	height:50px;
	margin-right:28px;
	font-size:20px;
	display:inline-block;
	border:1px solid transparent;
	overflow:hidden;
	
	transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
}
.social-links li a,
.options li [class^="icon-"]:before {
	width:68px;
	height:68px;
	line-height:68px;
	margin-left:-10px;
	margin-top:-10px;
	text-align:center;
	color:inherit;
	display:block;
	background-color:#fff;

	transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-webkit-transform:rotate(45deg);

	transition:all 0.4s ease-in;
	-moz-transition:all 0.4s ease-in;
	-webkit-transition:all 0.4s ease-in;
}
.social-links li,
.options li {
	margin-bottom:20px;
}
.social-links li:hover a {
	color:#fff;
}

/*** Services Section
------------------------------------------------------------ ***/

.service-box {
	width:200px;
	height:200px;
	padding:40px 6px;
	margin-left:auto;
	margin-right:auto;
	margin-top:25px;
	margin-bottom:120px;

	text-align:center;
	background-color:transparent;
	border:2px solid transparent;
	position:relative;

	transform:rotate(-45deg);	
	-moz-transform:rotate(-45deg);	
	-webkit-transform:rotate(-45deg);	

	transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-webkit-transition:all 0.4s ease;
}
.service-box:before {
	display:block;
	content:'';
	border:2px solid transparent;
	position:absolute;
	left:-20px;
	right:20px;
	top:20px;
	bottom:-20px;

	transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-webkit-transition:all 0.4s ease;
}
.service-box:hover:before {
	left:0px;
	right:0px;
	top:0px;
	bottom:0px;
}
.service-box .service-matter {
	padding-left:15px;
	transform:rotate(45deg);	
	-moz-transform:rotate(45deg);	
	-webkit-transform:rotate(45deg);	

	transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-webkit-transition:all 0.4s ease;
}
.service-box:hover .service-matter {
	color:#fff;
}

.service-box .iconic {
	margin-bottom:20px;
	font-size:42px;
	line-height:.5em;
	display:inline-block;
}
.service-box h5 {
	text-transform:uppercase;
	letter-spacing:-0.03em;
}
.service-box .service-matter h5,
.service-box .service-matter p {
	margin-bottom:1px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}

.section-parallax .service-box,
.section-parallax .service-box:before {
	border-color:#fff;
}
.section-parallax .service-box:hover,
.section-parallax .service-box:hover:before {
	border-color:transparent;
}
.section-parallax .service-box:hover {
	background-color:#fff;
}


/*** Team Section
----------------------------------------------------------- ***/

.team-box {
	margin-bottom:30px;
}
.team-box .image-hover,
.blog-box .image {
	margin-bottom:30px;
}
.team-box .detail h4 {
	padding-bottom:17px;
	margin-bottom:16px;
	position:relative;
}
.team-box .detail h4:before {
	width:50px;
	height:1px;
	display:block;
	content:'';
	
	position:absolute;
	left:0px;
	bottom:0px;
}
.team-box .detail .designation {
	margin-bottom:10px;
	font-weight:bold;
	color:#acacac;
	font-family:'Montserrat', sans-serif;
	letter-spacing:0.08em;
}

.team-box .social-links {
	margin-left:8px;
	text-align:left;
}
.team-box .social-links li,
.options li [class^="icon-"] {
	width:36px;
	height:36px;
	margin-right:18px;
	font-size:14px;
}
.team-box .social-links li a,
.options li [class^="icon-"]:before {
	width:50px;
	height:50px;
	line-height:50px;
	margin-left:-8px;
	margin-top:-8px;
}
.team-box .image-hover figcaption {
	background-color:rgba(255,255,255,0.9);
	overflow:hidden;
}
.team-box:hover .image-hover figcaption {
	visibility:visible;
	opacity:1;
	filter:alpha(opacity=100);
}


.progress-strip-vertical {
	height:100%;
	margin:0px 15px;
	position:relative;
	float:left;
}
.progress-strip-vertical p {
	padding:0px 30px;
	margin-bottom:0px;
	font-family:'Montserrat', sans-serif;
	font-weight:bold;
	font-size:16px;
	
	position:absolute;
	left:24px;
	bottom:0px;
	
	transform:rotate(-90deg);
	-moz-transform:rotate(-90deg);
	-webkit-transform:rotate(-90deg);

	transform-origin:left bottom 0;
	-moz-transform-origin:left bottom 0;
	-webkit-transform-origin:left bottom 0;
}
.progress-strip-vertical .progress {
	height:100%;
	width:10px;
	margin-bottom:0px;
	margin-left:25px;
	position:relative;
}
.progress-strip-vertical .progress .progress-bar {
	width:100%;
	position:absolute;
	left:0px;
	bottom:0px;

	transform:scaleY(0);
	-moz-transform:scaleY(0);
	-webkit-transform:scaleY(0);

	transition:all 0.4s ease-in-out 0.2s;
	-moz-transition:all 0.4s ease-in-out 0.2s;
	-webkit-transition:all 0.4s ease-in-out 0.2s;
}
.team-box:hover .progress-strip-vertical .progress .progress-bar {
	transform:scaleY(1);
	-moz-transform:scaleY(1);
	-webkit-transform:scaleY(1);
}

/*** Blog Section
----------------------------------------------------------- ***/

.blog-box {
	margin-bottom:30px;
}
.blog-box a:hover {
	color:#808080;
}
.blog-box .detail {
	padding-left:82px;
}
.blog-box .detail .date-block {
	margin-left:-82px;
}
.date-block {
	width:62px;
	padding:2px 8px;
	display:inline-block;
	float:left;
	font-size:11px;
	text-align:center;
	color:#808080;
	position:relative;
	
	border-width:0px 1px 0px 1px;
	border-style:solid;

	transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-webkit-transition:all 0.4s ease;
}
.blog-box:hover .date-block {
	padding-top:5px;
	padding-bottom:5px;
}
.date-block:before,
.date-block:after {
	width: 0; 
	height: 0;
	content:'';
	border-top: 31px solid transparent;
	border-left: 31px solid transparent; 
	border-right: 31px solid transparent;


	position:absolute;
	bottom:-31px;
	left:-1px;
}
.date-block:after {
	border-top: 30px solid transparent;
	border-left: 30px solid transparent; 
	border-right: 30px solid transparent;
	z-index:10;
	
	border-top-color:#fff;
	left:0px;
	bottom:-30px;
}

.date-block span {
	font-family:'Montserrat', sans-serif;
	font-size:27px;
	font-weight:700;
	display:block;
	
}

.options {
	text-align:left;
}
.options li {
	margin-right:15px;
	display:inline-block;
}
.options li [class^="icon-"] {
	vertical-align:middle;
}

.brows-posts {
	padding:10px;
	position:relative;
	
	transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-webkit-transition:all 0.4s ease;
}
.brows-posts a {
	padding:16px;
	font-family:'Montserrat', sans-serif;
	font-size:16px;
	letter-spacing:0.15em;
	position:relative;
	display:block;
	text-align:center;

	transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-webkit-transition:all 0.4s ease;
}
.brows-posts:before,
.brows-posts a:before {
	width:100%;
	height:100%;
	display:block;
	content:'';
	border:1px solid;
	opacity:.2;
	filter:alpha(opacity=20);
	
	position:absolute;
	top:0px;
	left:0px;

	transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-webkit-transition:all 0.4s ease;
}
.brows-posts:before {
	opacity:.1;
	filter:alpha(opacity=10);
}

.brows-posts:hover {
	padding:6px;
}
.brows-posts:hover a {
	padding:20px;
}
.brows-posts:hover a:before {
	border-width:5px;

	opacity:.8;
	filter:alpha(opacity=80);
}

.client-slider .item {
	margin:20px;
}
.client-slider .item a {
	display:block;
}
.client-slider .item img {
	width:100%;
}

/**** Contact Section 
------------------------------------------------------------ ***/

.contact-form ul {
	padding:0px;
	margin-bottom:0px;
	list-style:none;
}
.form-wrap {
	position:relative;
}
.form-wrap:before,
.form-wrap:after {
	content:'';
	font-family:'FontAwesome';
	pointer-events:none;
	text-align:center;
	
	position:absolute;
}
.form-wrap:before {
	width:60px;
	height:60px;
	line-height:60px;
	border-width:0 1px 0px 0px;
	border-style:solid;
	
	top:0px;
	left:0px;
}
.form-wrap:after {
	width:32px;
	height:32px;
	border:2px solid transparent;
	
	border-radius:50%;
	-moz-border-radius:50%;
	-webkit-border-radius:50%;

	top:14px;
	left:13px;
}
.form-wrap .form-control {
	padding-left:78px;
}
.form-wrap.user:before {
	content:'\f007';
}
.form-wrap.envelope:before {
	content:'\f0e0';
}
.form-wrap.link:before {
	content:'\f0c1';
}

.contact-form .form-control {
	margin-bottom:30px;
}
.contact-form textarea.form-control {
	height:150px;
}

.contact-info {
	font-size:15px;
	font-family:'Montserrat', sans-serif;
}
.contact-info [class^="icon-"] {
	margin-right:20px;
	font-size:30px;
	vertical-align:middle;
}


/**** Site Bottom Section 
------------------------------------------------------------ ***/
.site-btm {
	padding:20px 0px;
	text-align:center;
	font-size:15px;
	border-top:1px solid rgba(0,0,0,0.2);
}
.site-btm p {
	margin-bottom:0px;
}