/*
	Template Name: Barrier - Responsive portfolio and Business Template
	Author: ThemeRox
	Author URI: http://themeforest.net/user/tripples
	Description: BArrier - Responsive portfolio and Business Template
	Version: 1.0
*/

/* Table of Content
==================================================
1.	Global Styles
2. 	Typography
3.	Common styles
4.	Header area
5.	Navbar menu styles
6.	Slider area
7.	RESUME area
8.	skill area
9.	service
10.	Work process 
11.	portfolio area
12.	FEATUREs
13. PRICING
14.	TESTIMONIAL
15.	BLOG
16.	CONTATCT
17.	FOOTER
18.	BAck to TOP
19.	Counter
20.	TEAM
21.	CLIENTS
22.	Video section
23.	Home2 SKILL bar
24.	Parralax

*/


@import url(http://fonts.googleapis.com/css?family=Droid+Serif:400,700);
@import url(http://fonts.googleapis.com/css?family=Lora:400,700,400italic);



@font-face {
	font-family: 'ElegantIcons';
	src:url('fonts/ElegantIcons.eot');
	src:url('fonts/ElegantIcons.eot?#iefix') format('embedded-opentype'),
		url('fonts/ElegantIcons.woff') format('woff'),
		url('fonts/ElegantIcons.ttf') format('truetype'),
		url('fonts/ElegantIcons.svg#ElegantIcons') format('svg');
	font-weight: normal;
	font-style: normal;
}


/* Global styles
================================================== */

html{
	overflow-x: hidden !important;
	width: 100%;
	height: 100%;
	position: relative;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

body{
	border: 0;
	margin: 0;
	padding: 0;
	color: #333333;
	font-size: 14px;
	background: #fff;
	position: relative;
}

a{
	color: #444;

}

a:link,
a:visited{
    text-decoration: none;
}

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

section{
	position: relative;
}

.no-padding{
	padding: 0;
}

.gap-80 {
	clear: both;
	height: 80px;
}

.gap-40 {
	clear: both;
	height: 40px;
}

.gap-30 {
	clear: both;
	height: 30px;
}
.gap-20 {
	clear: both;
	height: 20px;
}

ul{
	list-style-type: none;
}

.m20{
	margin: 20px 0px;
}
.m30{
	margin: 30px 0px;
}
.m40{
	margin: 40px 0px;
}
.ml{
	margin-left: 40px;
}

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

body, p{
	font-family: 'Droid Serif', serif;
	font-weight: 400; 
	font-size: 14px;
	line-height: 20px;
}

h1, h2, h3, h4, h5, h6 {
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
}

h1{
    font-size: 36px;
    line-height: 48px;
}

h2{
    font-size: 32px;
    line-height: 40px;
    font-weight: 700;
}

h3{
    font-size: 24px;
    line-height: 32px;
    font-weight: 400;
}

h4{
	font-size: 18px;
	line-height: 18px;
	font-weight: 700;
}

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

/*Common style
====================================*/

.btn-main{
	padding: 10px 35px;
	font-weight: 700;
	border-radius: 0px;
	-webkit-transition: all .3s ease;
	-o-transition: all .3s ease ;
	transition: all .3s ease-in-out ;
	margin: 10px 0px;
	text-transform: uppercase;
	background: transparent;
	font-size: 16px;
}
.btn-main:hover{
	color: #fff;
}
.btn-primary{
	border: 1px solid#fff;
	padding: 12px 32px;
	font-weight: 700;
	border-radius: 0px;
	-webkit-transition: all .3s ease;
	-o-transition: all .3s ease ;
	transition: all .3s ease-in-out ;
	margin: 10px 0px;
	text-transform: capitalize;
	background: transparent;
	font-size: 16px;
}
.btn-primary:hover{
	background: #fff;
	color: #555;
	border: 1px solid#fff;
}
.btn-black{
	padding: 12px 32px;
	font-weight: 700;
	border-radius: 0px;
	-webkit-transition: all .3s ease;
	-o-transition: all .3s ease ;
	transition: all .3s ease-in-out ;
	margin: 10px 0px;
	text-transform: capitalize;
	background: #555;
	font-size: 16px;
	color: #fff;
}
.btn-black:hover{
	background: #fff;
	color: #555;
	border: 1px solid#555;
}
.btn-white{
	padding: 12px 32px;
	font-weight: 700;
	border-radius: 0px;
	-webkit-transition: all .3s ease;
	-o-transition: all .3s ease ;
	transition: all .3s ease-in-out ;
	margin: 10px 0px;
	text-transform: capitalize;
	background: transparent;
	font-size: 16px;
	color: #fff;
	border: 1px solid#fff;
}
.btn-white:hover{
	background: #fff;
	color: #444;
}

#home,#profile,#resume,#service,#feature,#pricing,#blog,#contact,#work{
	padding-bottom: 70px;
	padding-top: 50px;
}
#process,#skill-bar{
	padding: 70px 0px;
}

/*header title
=========================*/

.header-desc{
	margin-bottom: 60px;
}
.big-title{
	font-size: 30px;
	font-weight: bold;
	line-height: 30px;
	text-transform: uppercase;
	border-right: 1px solid#ccc;
	border-left: 1px solid#ccc;
	width: 35%;
	margin: 0 auto;
	padding: 20px 0px;
}
.sub-title{
	text-transform: uppercase;
	font-weight: 700;
	padding-top: 10px;
	margin-bottom: 25px;
	position: relative;
}
.sub-title:before{
	position: absolute;
	width: 40px;
	height: 2px;
	background: #444;
	left: 0px;
	top: 0px;
	content:"";
}
.header-content {
	border-bottom: 1px solid#ccc;
	margin-bottom: 30px;
	border-top: 1px solid#ccc;
}
.header-content span{
	color: #555;
	display: none;
}


/*NAvbar menu styles
========================================*/

.navbar{
	margin-bottom: 0px;
}

#tf-menu {
	padding: 15px;
	transition: all 0.8s;
}
#tf-menu.navbar-default {
	background-color: rgba(248, 248, 248, 0);
	border-color: rgba(231, 231, 231, 0);
}
#tf-menu a.navbar-brand {
	text-transform: uppercase;
	font-size: 22px;
	color: #fff;
	font-weight: 400;
	border-right: 1px solid#ccc;
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
}

#tf-menu.navbar-default .navbar-nav > li > a {
	text-transform: uppercase;
	color: #FFF;
	font-size: 13px;
	letter-spacing: 1px;
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	font-weight: 700;
}
.on{
	background-color: #222222 !important;
	padding: 0px !important;
}
.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {
	background-color: transparent;
}
.on.navbar-default .navbar-brand{
	margin-left: -90px;
	padding-left: 90px;
}

.navbar-brand > img {
   margin-top: -15px;
}


/*slider
=========================*/

#slider{
	padding: 0px;
	height: 700px;
	overflow: hidden;
	position: relative;
}
.main-slide{
	height: 100%;
}
.main-slide img{
	width: 100%;
}
.overlay {
	position: absolute;
	z-index: 1;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;

	content:"";
}

.slider-content{
	top: 40%;
	margin-top: -70px;
	left: 0px;
	padding: 0px;
	text-align: center;
	position: absolute;
	width: 100%;
	color: #FFF;
	z-index: 2;
}
.slider-content h3{
	font-family: 'Lora', serif;
	line-height: 40px;
}
.slider-content h2{
	font-size: 70px;
	line-height: 70px;
	text-transform: uppercase;
}
.slider-content h5{
	font-family: 'Lora', serif;
	position: relative;
	width: 20%;
	margin: 20px auto;
	font-size: 14px;
	font-weight: 700;
}
.slider-content h5:before{
	content:"";
	position: absolute;
	width: 35px;
	height: 1px;
	background: #fff;
	left: 35px;
	top: 12px;
}
.slider-content h5:after{
	content:"";
	position: absolute;
	width: 35px;
	height: 1px;
	background: #fff;
	right: 35px;
	top: 12px;
}

.slider-content a{
	color: #fff;
	font-size: 30px;
	line-height: 50px;
	padding: 7px 15px;
	border: 1px solid#fff;
	border-radius: 50%!important;
	-webkit-transition: all .3s ease 0s;
	-o-transition: all .3s ease 0s;
	transition: all .3s ease 0s;
	margin-top: 20px;
}
.slider-content a i{
	-webkit-transition: all .3s ease 0s;
	-o-transition: all .3s ease 0s;
	transition: all .3s ease 0s;
	margin-top: 20px;
}

.slider-content a:hover {
	cursor: pointer;
}
.slider-small-text-content{
	margin-bottom: 20px;
}
.slider-small-text-content h4{
	display: inline-block;
	font-family: 'Lora', serif;
	font-size: 14px;
}
.slider-small-text-content h4 i{
	margin-right: 5px;
}
/*carousel slider*/
#main-slide .carousel-indicators{
	top: 20%;
	height: 30px;
}
.carousel-indicators li{
	width: 50px;
}
.carousel-control{
	top: 40%;
	z-index: 2;
	opacity: 1;
}
.carousel-control.left,.carousel-control.right{
	background: transparent;
	background-image: none;
	background-repeat: no-repeat;
	text-shadow: none;
	transition: all 0.25s ease 0s;
	
}
.carousel-control.left span,.carousel-control.right span{
	font-size: 40px;
	color: #fff;
	
}
.carousel-control i{
	background: none;
	color: #fff;
	line-height: 56px;
	width: 56px;
	height: 56px;
	border: 1px solid #fff;
	border-radius: 100%;
	font-size: 36px;
	-moz-transition: all 500ms ease;
	-webkit-transition: all 500ms ease;
	-ms-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
}
.carousel-control.left{
	left: -78px;
	
}
.carousel-control.right{
	right: -76px;
}

/*main slide controls*/

#main-slide .carousel-control.left,
#main-slide .carousel-control.right {
	opacity: 0;
	filter: alpha(opacity=0);
	background-image: none;
	background-repeat: no-repeat;
	text-shadow: none;
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-ms-transition: all .25s ease;
	-o-transition: all .25s ease;
	transition: all .25s ease;
}

#main-slide:hover .carousel-control.left,
#main-slide:hover .carousel-control.right{
	opacity: 1;
	filter: alpha(opacity=100);
	
}
#main-slide:hover .carousel-control.left{
	left: -30px;
}
#main-slide:hover .carousel-control.right{
	right: -30px;
}


/*-- Animation */

.carousel .item.active .animated2{
	-webkit-animation: lightSpeedIn 1s ease-in 200ms both;
	animation: lightSpeedIn 1s ease-in 200ms both;
}

.carousel .item.active .animated3 {
	-webkit-animation: bounceInLeft 2s ease-in-out 800ms both;
	animation: bounceInLeft 1.5s ease-in-out 800ms both;
}

.carousel .item.active .animated4 {
	-webkit-animation: flipInX 2s ease-in 800ms both;
	animation: flipInX 2s ease-in 800ms both;
}

.carousel .item.active .animated5 {
	-webkit-animation: bounceInLeft 1s ease-in-out 100ms both;
	animation: bounceInLeft 1s ease-in-out 100ms both;
}

.carousel .item.active .animated6{
	-webkit-animation: bounceIn 1s ease-in 500ms both;
	animation: bounceIn 1s ease-in 500ms both;
}

.carousel .item.active .animated7{
	-webkit-animation: bounceIn 1s ease-in 500ms both;
	animation: bounceIn 1s ease-in 500ms both;
}

.carousel .item.active .animated8{
	-webkit-animation: bounceInDown 1s ease-in 800ms both;
	animation: bounceInDown 1s ease-in 800ms both;
}

/* Profile section 
======================================*/

.pro-list{}
.pro-list div{
	margin-bottom: 5px;
}
.pro-list div span{
	font-weight: 700;
	font-size: 16px;
	margin-right: 5px;
}
.socail-list a i{
	font-size: 25px;
	border: 1px solid#444;
	width: 45px;
	height: 45px;
	border-radius: 50%;
	padding: 9px 0px 0px 11px;
	-webkit-transition: all .3s ease 0s;
	-o-transition: all .3s ease 0s;
	transition: all .3s ease 0s;
}

.pro-pic img{
	height: 310px;
}


/*RESUME Section
==========================================*/
#resume{
	background: #F8F8F8;
}
.resume-single{
	margin-bottom: 30px;
	border: 1px solid#ccc;
	padding: 30px 0px 20px 20px;
}
.year{
	padding: 15px;
	font-size: 20px;
	font-weight: 700;
	color: #fff;
}
.resume-desc{
	margin: 10px 0px;
	float: left;
}
.resume-single p{
	clear: both;
	margin: 30px 0px;
}
.versity{
	font-style: italic;
}
.grade{
	width: 60px;
	height: 60px;
	border: 1px solid#ccc;
	font-size: 30px;
	font-weight: 700;
	padding-top: 15px;
	padding-left: 15px;
	-webkit-transition: all .3s ease 0s;
	-o-transition: all .3s ease 0s;
	transition: all .3s ease 0s;
	margin: 20px 20px 0px 0px;
}


/*Progress skill
=================*/

.progress {
    height: 12px;
    margin-bottom: 40px;
    overflow: visible;
    border-radius: 0px;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: #eee;
}
.progress label{
	background-color: #262626;
	text-align: center;
	font-size: 13px;
	font-weight: 400;
	line-height: 25px;
	display: inline-block;
	padding: 0px 3px;
	position: relative;
	top: -35px;
	right: 18px;
	border-radius: 4px;
	color: #fff;
}
.progress label:after{
	content: "";
	display: block;
	width: 0px;
	height: 0px;
	border-width: 7px;
	border-style: solid;
	border-color: #262626 transparent transparent;
	position: absolute;
	top: 25px;
	right: 9px;
}
.skill,.experience{
	margin-top: 30px;
}

/*Panel=============
==========================*/

.panel-default.panel-exp{
	border-radius: 0px;
}

h4.panel-title{
	position: relative;
}
h4.panel-title a:after {
    content: "\f106";
    font-family: FontAwesome;
    color: #fff;
    font-size: 16px;
    position: absolute;
    z-index: 111;
    width: 28px;
    height: 28px;
    line-height: 25px;
    top: 5px;
    right: 5px;
    text-align: center;
    border-radius: 100%;
    background: none repeat scroll 0% 0% #AFAFAF;
}
h4.panel-title a.collapsed:after {
    content: "\f107";
    font-family: FontAwesome;
    color: #FFF;
    font-size: 16px;
    position: absolute;
    z-index: 111;
    width: 30px;
    height: 30px;
    line-height: 30px;
    top: 5px;
    right: 5px;
    text-align: center;
}


.panel-default .panel-heading a.collapse.in{
	background: #333;
	color: #fff;
}
.panel-default .panel-heading a{
	background: #333;
	text-transform: uppercase;
	font-weight: 700;
	padding: 12px 35px 12px 15px;
	display: inline-block;
	width: 100%;
	position: relative;
	text-decoration: none;
	color: #fff;
}
.panel-default > .panel-heading {
    padding: 0px;
    outline: medium none;
    border: medium none;
    border-radius: 0px;
    width: 100%;
}
.panel-default.panel-exp{
	border: 1px solid#333;
}
.panel-default.panel-exp:hover{
	background: #333333;
}
.panel-default.panel-exp:hover .panel-title{
	color: #D9534F;
}

.panel-default .panel-body{
	background: #fff;
}

 a.collapsed .panel-heading {
	border: 1px solid#D9534F;
	background: #D9534F!important;
}

.panel-heading a.collapsed {
	color: #FFF;
	background-color: #999;
}

/*service section
=====================================*/
.icon-box .icon{
	font-size: 60px;
}
.service-content{
	margin-bottom: 50px;
}
.service-content h4{
	line-height: 10px;
	margin-top: 20px;
	text-transform: capitalize;
}
.service-content span{
	font-size: 12px;
	color: #ccc;
}
.service-content p{
	margin: 15px 0px;
}


/*Work process 
=========================*/
.sub-heading h4{
	color: #fff;
	font-family: 'Lora', serif;
	font-size: 28px;
	margin-bottom: 25px;
}
.sub-heading p{
	color: #fff;
	font-family: 'Lora', serif;
	margin-top: 20px;
}
.line{
	width: 60px;
	margin: 0 auto;
	height: 1px;
	background: #fff;
}

.process-desc{
	margin-top: 40px;
}
.single-process{
	background: #fff;
	padding: 40px 30px;
	margin-bottom: 20px;
}
.single-process i.big {
    font-size: 	100px;
    margin-bottom: 30px;
    display: block;
    text-align: center;
}
.single-process p{
	margin-top: 20px;
}


.single-process i:hover{
	-webkit-animation:  rotateIn 1.5s ease 0s;
	-o-animation: rotateIn 1.5s ease 0s;
	animation:  rotateIn 1.5s ease 0s;
	cursor: pointer;

}
.circle,.circle1,.circle2{
	margin: 0 auto;
}


/*-- Portfolio page 
====================================--*/

#portfolio{
	padding: 0 0 40px;
}

#portfolio-carousel .thumbnail {
    position:relative;
    overflow:hidden;
    padding: 0;
    border: 0;
    border-radius: 0;
}

#portfolio-carousel .thumbnail .caption .caption-content{
	position: absolute;
	bottom: 25px;
}

#portfolio-carousel .thumbnail .caption i{
	border: 2px solid #FFFFFF;
	border-radius: 100%;
	color: #FFFFFF;
	display: inline-block;
	font-size: 18px;
	height: 46px;
	line-height: 40px;
	position: relative;
	text-align: center;
	top: -40px;
	width: 46px;
	z-index: 8;
	-moz-transition: all 500ms ease;
	-webkit-transition: all 500ms ease;
	-ms-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
}

#portfolio-carousel .thumbnail .caption i.fa-link{
	margin-left: 10px;
}

 
#portfolio-carousel .caption {
	color: #fff;
	padding: 15px;
    position:absolute;
    bottom: -100%;
    right:0;
    background: rgba(0, 0, 0, 0.8);
    width:100%;
    height:100%;
    text-align:left;
    z-index:2;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
#portfolio-carousel .thumbnail:hover .caption {
    bottom: 0%;
}

#portfolio-carousel .caption h3{
	font-size: 22px;
	font-weight: 400;
	text-align: left;
}

.barrier-carousel-controller{
	margin-top: 20px;
	text-align: center;
}

.barrier-carousel-controller .left,
.barrier-carousel-controller .right, 
.owl-controls .owl-prev, 
.owl-controls .owl-next{
	cursor: pointer;
	background: transparent;
	width: 38px;
	height: 38px;
	line-height: 38px;
	color: #989898;
	opacity: 1;
	top: auto;
	text-shadow: none;
	display: inline-block;
	text-align: center;
	border-radius: 100%;
	border: 1px solid#ccc;
}
.owl-controls .owl-next{
	margin-left: 6px;
}

.barrier-carousel-controller.portfolio-control .right {
	position: absolute;
    right: 0px;
    top: 35%;
}
.barrier-carousel-controller.portfolio-control .left {
	position: absolute;
   	left: 0px;
    top: 35%;
}
.barrier-carousel-controller .left:hover,
.barrier-carousel-controller .right:hover,
.owl-controls .owl-prev:hover, 
.owl-controls .owl-next:hover{
	color: #fff;
}

.owl-controls .owl-page, 
.owl-controls .owl-buttons div{
	display: inline-block;
}

#portfolio-carousel .carousel-inner{
	/*overflow: visible;*/
}

/*FEATURE section
===================================*/
#feature{
	background: #F7F7F6;
}
.main-fetaure{
	margin-top: 5px;
}
.feature-desc{
	margin-bottom: 20px;
}

.feature-icon{
	float: left;
	margin-right: 30px;
}
.feature-content p{
	font-size: 14px;
}
.feature-icon i{
	font-size: 40px;
	width: 90px;
	height: 90px;
	background: #fff;
	border-radius: 100%;
	line-height: 87px;
	text-align: center;
	border: 4px solid#F7F7F6;
	-webkit-box-shadow: 0px 0px 0px 3px #fff;
	box-shadow: 0px 0px 0px 3px #fff;
	-webkit-transition: all .3s ease 0s;
	-o-transition: all .3s ease 0s;
	transition: all .3s ease 0s;
}
.feature-desc h4{
	text-transform: uppercase;
	margin: 5px 0px;
}

.feature-desc h4{
	text-transform: capitalize;
	font-weight: 500;
}

.feature-icon i:hover{
	color: #fff;
}


/*PRICING
=======================================*/
.panel-pricing{
	border-radius: 3px;
	-webkit-box-shadow: none;
	box-shadow: none;
}
.panel-pricing .panel-heading .panel-title{
	font-size: 25px;
	text-transform: uppercase;
	margin-bottom: 5px;
}
.panel-pricing .panel-heading{
	border-color: #555;
	padding: 15px 0px;
	background: transparent;
	border-bottom: 1px solid#ccc;
	-webkit-transition: all .3s ease-in 0s;
	-o-transition: all .3s ease-in 0s;
	transition: all .3s ease-in 0s;
}
.plan{
	font-size: 50px;
	padding: 30px 0px 20px 0px;
}
.panel-pricing .panel-body{
}

.panel-pricing .panel-body p{
	font-size: 50px;
}

.plan-desc{
	margin-left: -20px;
}
.plan-desc li{
	text-transform: capitalize;
	font-size: 14px;
	padding: 10px 0px;
}
.plan-desc li:last-child{
	border: 0px;
}
.panel-pricing .panel-footer{
	background: transparent;
	-webkit-transition: all .3s ease-in 0s;
	-o-transition: all .3s ease-in 0s;
	transition: all .3s ease-in 0s;
}

.panel-pricing:hover .panel-heading{
	color: #fff;
}
.panel-pricing:hover .btn-black{
	border-color: #fff;
	background: transparent;
	color: #fff;
}

.panel-heading.featured,.panel-footer.featured{
	color: #fff;
}
.panel-footer.featured .btn-black{
	background: transparent;
	color: #fff;
	border-color: #fff;
}

/*TESTIMONIAL section
====================================*/
#testimonial{
	padding: 60px 0px 110px 0px;
}
#testimonial-carousel{
	color: #fff;
	width: 70%;
	margin: 0px auto;
}
#testimonial-carousel p{
	margin: 30px 0px;
}
#testimonial-carousel h3{
	text-transform: uppercase;
	font-weight: 700;
}
#testimonial-carousel  span{
	font-style: italic;
	color:#ccc;
}
.test-icon i{
	font-size: 40px;
	margin-bottom: 30px;
	background: #fff;
	color: #555;
	padding: 15px;
}

.owl-carousel{
	display: block!important;
}
.testimonial-thumb img{
	border: 1px solid #8E8E8E;
	padding: 3px;
	width: 80px;
	height: 80px;
	border-radius: 100%;
	margin: 0 auto;
}
#testimonial-carousel .carousel-indicators {
    bottom: -70px!important; 
    padding-bottom: 10px;
}



/*BLOG section
================================*/


.blog-content h4.blog-title{
	margin-bottom: 5px;
	text-transform: uppercase;
	font-weight: 600;
	margin-top: 0px;
}
.blog-meta{
	margin: 5px 0px;
}
.blog-meta span{
	margin-right: 10px;
	color: #888;
}
.blog-meta span i{
	padding: 10px;
}

.blog-content p{
	margin: 15px 0px;
}

.blog-social{
	margin-top: 40px;
}
.blog-social h4{
	margin-bottom: 20px;
}
.blog-desc img{
	padding: 5px;
}
.blog-desc{
	position: relative;
}


.blog-overlay{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
    background: rgba(0,0,0,0.5);
    opacity: 0;
    -webkit-transition: all .3s ease 0s;
    -o-transition: all .3s ease 0s;
    transition: all .3s ease 0s;
}
.blog-overlay a{
	color: #fff;
	padding: 15px 18px;
	border: 1px solid#fff;
	border-radius: 100%;
}

.blink{
	top: -20px;
	position: absolute;
	left: 40%;
	-webkit-transition: all .3s ease 0s;
	-o-transition: all .3s ease 0s;
	transition: all .3s ease 0s;
}
.bsearch{
	bottom: -20px;
	position: absolute;
	right: 40%;
	-webkit-transition: all .3s ease 0s;
	-o-transition: all .3s ease 0s;
	transition: all .3s ease 0s;
}
.blog-desc:hover .blog-overlay{
	opacity: 1;
}
.blog-desc:hover .blink{
	top: 40%;
}
.blog-desc:hover .bsearch{
	bottom: 40%;

}

/*CONTATCT section
======================================*/

.parallax4 .header-desc ,#contact-form label{
	color: #fff;
}
#contact-form label{
	margin-bottom: 10px;
}

#contact-form input{
	border-radius: 0px;
	height: 50px;
}
 .form-control{
	-webkit-box-shadow: none!important;
	box-shadow: none!important;
	border-radius: 0px;
}

#contact #contact-form, #contact .header-desc{
	z-index: 3;
	color: #fff;
}


/*MAp wrapper
==============================*/
.map-wrapper{
	position: relative;
}

.map {
	height: 400px;
	z-index: 1;
}

.contact-info-inner h3{
	font-weight: 700;
	margin-bottom: 25px;
	font-size: 24px;
	color: #fff;
}

.contact-info h3{
	margin-top: 42px;
	font-weight: 700;
	font-size: 24px;
}

.contact-info p{
	font-size: 18px;
}

.contact-info i{
	font-size: 18px;
	margin-right: 10px;
}

/* Contact inside Map */
.contact-info-inner {
	position: absolute;
	color: #fff;
	top: 0;
	bottom: 0;
	z-index: 2;
	background: rgba(0,0,0,.7);
	padding: 25px 30px;
	max-width: 400px;
	max-height: 400px;
	text-align: left;
	right: 70px;
}

.contact-info-inner p{
	overflow: hidden;
	margin-bottom: 25px;
}

.contact-info-inner p strong{
	display: block;
}

.contact-info-inner i{
	margin-right: 20px !important;
	font-size: 24px;
	margin-top: 5px;
}


/*FOOTER
==========================*/
#footer{
	padding: 60px 0px;
	background: #333;
}
.footer-desc .logo{
	margin-bottom: 30px;
	font-size: 30px;
	text-transform: uppercase;
	color: #fff;
}
.footer-desc .socail-list a i{
	padding-left: 0px;
	color: #e8e8e8;
	border-color: #e8e8e8;
}
.footer-desc{}
.footer-desc .socail-list{}

.copyright-info {
	color: #e8e8e8;
}
.copyright-info span a{
	color: #fff;
	font-weight: 700;
}


/*BAck to TOP
=====================*/
#back-to-top {
	right: 40px;
	top: auto;
	z-index: 1;
	-webkit-backface-visibility: hidden;
}

#back-to-top.affix {
	bottom: 60px;
}

#back-to-top .btn.btn-primary{
	border-radius: 100%;
	padding: 0;
	font-size: 18px;
	width: 36px;
	height: 36px;
	background: rgba(0,0,0,.3);
	border: 2px solid transparent;
	color: #fff;
	opacity: .5;
}

#back-to-top .btn.btn-primary:hover{
	color: #fff;
	opacity: 1;
}


/*index2 style
====================================*/

#counter-area{
    background: url('../images/bg/bg2.jpg') no-repeat fixed 50% 0px / cover transparent;
    position: relative; 
    margin: 0 auto;
    width: 100%;
    overflow:hidden;
    z-index:2;
    padding:80px 0px 80px 0px;
    color: #fff;
}

.facts-wrap{
    width: 220px;
    margin: 0px auto;
    text-align: left;
}

.facts-wrap h6{
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:2px;
    font-size: 20px; 
    line-height:18px;
}
.facts-wrap-num{
    font-size: 50px; 
    line-height:60px;
    width:100%;
    margin:10px auto;
    position: relative;
}  

.fact-content{
    float: left;
}
.facts-wrap .icon-box{
	width: 16%;
	float: left;
	font-size: 40px;
	padding: 16px 60px 16px 0px;
	margin-right: 25px;
	border-right: 1px solid #CCC;
	margin-top: 20px;
}


/*TEAM members
===========================*/
#team{
	padding-bottom: 70px;
	background: #F6F6F8;
}

.single-member{
	text-align: center;
	position: relative;
}
.single-member img{
	width: 100%;
}
.single-member h4{
	text-transform: uppercase;
	margin-bottom: 20px;
}
.member-content{
	background: #fff;
	padding: 20px 0px;
}
.member-desc h4{
	text-transform: uppercase;
}
.member-desc h5{
	color: #888;
	font-style: italic;
}
.member-socail{
	margin-top: 30px;
}
.member-socail li{
	border-right: 1px solid#ccc;
	padding: 0px 10px;
}
.member-socail li:last-child{
	border: 0px;
}

.form-control{
	background: transparent;
}

.member-overlay{
	position: absolute;
	top: -50px;
	padding: 35px 20px 0px 20px;
	color: #fff;
	opacity: 0;
	-webkit-transition: all .3s ease 0s;
	-o-transition: all .3s ease 0s;
	transition: all .3s ease 0s;
	height: 100%;
}
.member-overlay .member-desc h5{
	color: #fff;
}
.member-overlay p{
	margin: 30px 0px;
}
.single-member:hover .member-socail li i,.single-member:hover .member-socail li{
	color: #fff;
	border-color: #fff;
}
.single-member:hover .member-overlay{
	opacity: 1;
	top: 0px;
}


/*CLIENTS section
=============================*/
#client{
	padding: 60px 0px;
	background: #F6F6F8;
}
.client-desc{
	border-bottom: 1px solid#ccc;
}
.btm-client{
	padding-top: 10px;
}
.client-desc li,.btm-client li{
	padding: 20px 30px;
	border-right: 1px solid#ccc;
	border-left: 1px solid#ccc;
	margin-left: -5px;
}
.client-desc li a img,.btm-client li a img{
	opacity: .6;
}
.client-desc li a img:hover,.btm-client li a img:hover{
	opacity: 1;
}

#client .header-desc{
	width: 50%;
	margin: 20px auto;
	margin-bottom: 50px;
}
#client .header-desc .line{
	width: 50px;
	height: 3px;
}




/*placeholder
======================*/

.form-level ::-webkit-input-placeholder {
   color: #fff;
   text-transform: capitalize;
}

.form-level :-moz-placeholder { /* Firefox 18- */
   color: #fff;  
   text-transform: capitalize;
}

.form-level ::-moz-placeholder {  /* Firefox 19+ */
   color: #fff;  
   text-transform: capitalize;
}

.form-level :-ms-input-placeholder {  
   color: #fff;  
   text-transform: capitalize;
}

/*video section
=============================*/
/*VIDEO*/

#video{
	padding: 70px 0px;
}
.video-background{
    width: 100%;
}
.video-background-container {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
}

.hero-buttons a{
    margin-right: 10px;
}
.hero-content .btn-main{
    background: #E44C4C;
    margin-top: 20px;
    color: #fff;
}
.hero-content .btn-main:hover{
    background: transparent;
    color: #fff;
}
.hero-section {
    height: 100%;
    overflow: hidden;
}
.hero-section .container {
    height: 100%;
}

.hero-content {
    position: relative;
    display: table;
    height: 100%;
    width: 100%;
    vertical-align: middle;
    color: #fff;
}

.hero-content .btn-primary{
	margin: 35px 0px 20px 0px;
}


/*SKILL bar section
=======================================*/

#skill-bar{
	padding: 70px 0px;
}
#skill-bar .sub-heading {
	margin-bottom: 40px;
}
#skill-bar .sub-heading h2{
	color: #fff;
	text-transform: uppercase;
}

.skill-name{
	font-weight: 700;
	text-transform: uppercase;
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	color: #fff;
	font-size: 20px;
}
.skill-content{
	margin-top: -20px;
}
.skill-content p{
	color: #EBEBEB;
}



/*parralax
=============*/

.parallax-overlay{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(../images/overaly.png);
}

.parallax1{
	background: url(../images/bg/bg5.jpg) fixed 50% 50%;
}
.parallax2{
	background: url(../images/parallax/parallax5.jpg) fixed 50% 50%;
}
.parallax3{
	background: url(../images/parallax/parallax2.jpg) fixed 50% 50%;
}
.parallax4{
	background: url(../images/parallax/contact-bg.jpg) fixed 50% 50%;
}

#skill-bar{
	background: url("../images/parallax/parallax6.jpg") no-repeat fixed 50% 50% ;
	-webkit-background-size: cover;
	background-size: cover;
}
.color-overlay{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: .95;
}


/*Nav feature-tab
=========================================*/

#feature-tab .nav-tabs{
	margin-bottom: 70px;
}
#feature-tab .nav-tabs li{
	width: 50%;
	margin: 0 auto;
}
#feature-tab .nav-tabs li a{
	border-radius: 0px;
	font-size: 25px;
	text-transform: uppercase;
	font-weight: 700;
	padding: 50px 0px;
	border-top: 0px;
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	border: 0px;
}
#feature-tab .nav-tabs li:last-child a{
	border-right: 0px;
}
#feature-tab  .nav-tabs > li.active > a{
	background: #fff;
}
.feature-icon i{
	color: #444;
}
.clear{
	float: none;
}

#feature-tab .nav-tabs li a .feature-icon{
	margin-bottom: 20px;
}

#feature-tab  .nav-tabs > li.active > a .feature-icon i{
	color: #fff;
}