/*!
 * 
 * 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
----------------------------------------------------------------- ***/

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

.scroll-button.navbar {
    background: none repeat scroll 0 0 transparent;
}

.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:#0db1fd;
}
#contact .section .heading-upper-dark {
	background: none;
}
.section .content-section {
	padding-bottom:30px;
}
.section-parallax .content-section {
	padding-bottom:50px;
}
.social-section {
	padding:45px 0px 40px 0px;
}

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

/*** 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:16px;
	line-height:1.75em;
}
.heading p:last-of-type {
}
.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;
}


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


/*** Filter Tabs
---------------------------------------------------------------------- ***/

.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 {
	background:#0db1fd;
	color:#fff!impo;
}
.filter-list {
	margin-left:-20px;
}
.filter-list > li {
	width:50%;
	padding-left:20px;
	margin-bottom:20px;
	float:left;
}
.filter-list li.mix {
	display:none;
}


/***** Main Slider section ****/
.diamond-box {
	width:420px;
	height:420px;
	padding:130px 0px;
	text-align:center;
	color:#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%;
	border-radius: 50%;
}
.diamond-box .scroll-button span {
	width:60px;
	height:60px;
	margin-top:-5px;
	margin-left:-5px;
	line-height:60px;
	display:block;
}

.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:#0db1fd;
}


/*** 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.2s ease;
	-moz-transition:all 0.2s ease;
	-webkit-transition:all 0.2s 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;

}
.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:#0db1fd;
	transition:all 0.4s ease-in;
	-moz-transition:all 0.4s ease-in;
	-webkit-transition:all 0.4s ease-in;
	color:#fff;
}
.options li [class^="icon-"]:before {
	border-radius: 200px;
}
.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;
}


/*** Services 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:#0db1fd;
	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;
	background: #fff!important;
	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);
}
.progress-strip-vertical p {color:#fff!important;}
/*** slider 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';
	color:#0db1fd;
}
.owl-buttons > div.owl-next:before {
	content:'\f0a9';
	color:#0db1fd;
}

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


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


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

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

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

.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;
	background: #a6987e;
}

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

.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;
	background: #a6987e;

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


/*** 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:'Raleway', 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);border-color:#0db1fd!important;
	
	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);
}
#loading {
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  position: fixed;
  display: block;
  opacity: 0.7;
  background-color: #fff;
  z-index: 99;
  text-align: center;
}

#loading-image {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 100;
}

#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 */
}

#about ul {
	text-align: left;
	font-size: inherit;
	font-size: 16px;
}