/*-- ===============================================



Product: 'vertical - One Page Mulitipurpose HTML5 template'

Version: 1.0 dark

Author: Mohammad Ahsan Habib

Date Created: April 8, 2017

Support: ahsanthemes@gmail.com



==================================================== --*/





/*-- == Table of contents =====================



( Example: Type 'ctrl+f' and then '1.example' to jump to the

 "example" section. Click 'find' if needed.)

 

1.reset css

2.custom animations

3.page loader css

4.header css

5.banner css

6.about css

7.services css

8.others css

9.portfolio css

10.subscribe css

11.team css

12.skills css

13.feedback css

14.fun_facts css

15.pricing_table css

16.blog css

17.faq css

18.contact css

19.partners css

20.purchase css

21.footer css

22.media queries / responsive settings





================================================== --*/





/*-- imported files

======================================== --*/

@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,400i,600,700,900');





/*-- 1.reset css

======================================== --*/

body{

	font-family: 'Montserrat', sans-serif;

	margin: 0;

	position: relative;

	font-size: 14px;

	line-height: 1.5;

	font-weight: 400;

	color: #999999;

	letter-spacing: 1px;

	background: #212121;

}

.bg-off{

	background-color: #363636;

}

.bg-black{

	background-color: #555555;

}

.bg-black h2,

.bg-black h3{

	color: #ffffff;

}

.bg-black p{

	color: #999999;

}

::-moz-selection {

	color: #ffffff;

}

::selection {

	color: #ffffff; 

}

h2{

	font-size: 40px;

	line-height: 1.2;

	font-weight: 300;

	color: #ffffff;

	text-transform: uppercase;

	position: relative;

	padding-bottom: 20px;

	margin-bottom: 20px;

}

h3{

	font-size: 15px;

	line-height: 1.6;

	color: #ffffff;

	font-weight: 700;

	letter-spacing: 1px;

	text-transform: uppercase;

	margin-bottom: 10px;

}

p{

	line-height: 30px;

}

.section_title h2::after{

	content: " ";

	width: 50px;

	height: 3px;

	display: block;

	background-color: #ffffff;

	position: absolute;

	left: 0;

	bottom: 0;

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	-ms-border-radius: 5px;

	border-radius: 5px;

}

.bg-black .section_title h2::after{

	background-color: #ffffff;

}

.section_title.text-center h2::after{

	position: absolute;

	left: 50%;

	margin-left: -25px;

}

.section_title p{

	max-width: 800px;

	font-size: 14px;

	position: relative;

	margin: 0 auto 15px;

}

.btn{

	min-width: 150px;

	padding: 0;

	margin-bottom: 20px;

	font-size: 13px;

	line-height: 50px;

	color: #ffffff;

	font-weight: 700;

	border: none;

	border-radius: 0;

	text-transform: uppercase;

	-webkit-transition: all .3s linear;

	-moz-transition: all .3s linear;

	-ms-transition: all .3s linear;

	transition: all .3s linear;

	position: relative;

}

.link{

	min-width: 100px;

	line-height: 45px;

}

.btn:hover{

	color: #ffffff;

	background-color: #00a5e7;

}

.btn.style_2{

	background-color: #ffffff;

}

.btn.style_2:hover{

	background: #e1e1e1;

}

.owl-theme .owl-dots .owl-dot span{

	background-color: #cccccc;

}

.owl-theme .owl-dots .owl-dot.active span,

.owl-theme .owl-dots .owl-dot:hover span{

	background-color: #999999;

}



/*-- 2.custom animations

======================================== --*/

@-webkit-keyframes moveUp{

	0% { transform: translateY(100px); opacity:0; }

	100% { transform: translateY(0); opacity:1; }

}

@keyframes moveUp{

	0% { transform: translateY(100px); opacity:0; }

	100% { transform: translateY(0); opacity:1; }

}

@-webkit-keyframes moveDown{

	0% { transform: translateY(-200px); opacity:0; }

	100% { transform: translateY(0); opacity:1; }

}

@keyframes moveDown{

	0% { transform: translateY(-200px); opacity:0; }

	100% { transform: translateY(0), opacity:1; }

}

@-webkit-keyframes moveDownSmall{

	0% { transform: translateY(-10px); opacity:0; }

	100% { transform: translateY(0); opacity:1; }

}

@keyframes moveDownSmall{

	0% { transform: translateY(-10px); opacity:0; }

	100% { transform: translateY(0); opacity:1; }

}

@-webkit-keyframes slideRight{

	0% { transform: translateX(-200px); opacity:0; }

	100% { transform: translateX(0); opacity:1; }

}

@keyframes slideRight{

	0% { transform: translateX(-200px); opacity:0; }

	100% { transform: translateX(0); opacity:1; }

}

@-webkit-keyframes slideRightSmall{

	0% { transform: translateX(-10px); opacity:0; }

	100% { transform: translateX(0); opacity:1; }

}

@keyframes slideRightSmall{

	0% { transform: translateX(-10px); opacity:0; }

	100% { transform: translateX(0); opacity:1; }

}

@-webkit-keyframes anim1{

	0%{top: 130%; opacity: 0;}

	100%{top: 100%; opacity: 1;}

}

@keyframes anim1{

	0%{top: 130%; opacity: 0;}

	100%{top: 100%; opacity: 1;}

}

@-webkit-keyframes slideInDown {

	0% {

		opacity: 0;

		-webkit-transform: translateY(-2000px);

		transform: translateY(-2000px);

	}

	100% {

		-webkit-transform: translateY(0);

		transform: translateY(0);

	}

}

@keyframes slideInDown {

	0% {

		opacity: 0;

		-webkit-transform: translateY(-200px);

		-ms-transform: translateY(-200px);

		transform: translateY(-200px);

	}

	100% {

		-webkit-transform: translateY(0);

		-ms-transform: translateY(0);

		transform: translateY(0);

	}

}

@-webkit-keyframes spin {

	0% { 

		-webkit-transform: rotate(0deg);

		transform: rotate(0deg);

	 }

	100% { 

		-webkit-transform: rotate(360deg);

		transform: rotate(360deg);

	}

}

@keyframes spin {

	0% { 

		-webkit-transform: rotate(0deg);

		transform: rotate(0deg);

	 }

	100% { 

		-webkit-transform: rotate(360deg);

		transform: rotate(360deg);

	}

}



/*-- 3.page loader css

======================================== --*/

.loader_wrapper{

	width: 100%;

	height: 100%;

	position: fixed;

	left: 0;

	top: 0;

	z-index: 999999;

	background-color: #ffffff;

}

.loader{

	width: 50px;

	height: 50px;

	border-radius: 50%;

	border: 3px solid #eeeeee;

	border-top: 3px solid #212121;

	position: fixed;

	left: 50%;

	top: 50%;

	margin-left: -25px;

	margin-top: -25px;

	-webkit-animation: spin 2s linear infinite;

	animation: spin 2s linear infinite;

}



/*-- 4.header css

======================================== --*/

header{

	width: 100%;

	position: absolute;

	top: 0;

	left: 0;

}

.container-fluid .navbar-header{

	width: 100%;

}

.header_wrapper nav{

	margin: 0 auto;

	background-color: transparent;

	z-index: 99;

	border: none;

	border-radius: 0;

}

.navbar-brand{

	height: auto;

	padding: 10px 15px;

}

.header_wrapper .fixed_top{

	width: 100%;

	position: fixed;

	left: 0;

	top: 0;

	background-color: #444444;

	-webkit-animation: slideInDown 1.5s;

	-moz-animation: slideInDown 1.5s;

	-ms-animation: slideInDown 1.5s;

	animation: slideInDown 1.5s;

	-webkit-box-shadow: 0 0 10px rgba(0,0,0,.1);

	-moz-box-shadow: 0 0 10px rgba(0,0,0,.1);

	-ms-box-shadow: 0 0 10px rgba(0,0,0,.1);

	box-shadow: 0 0 10px rgba(0,0,0,.1);

}

.header_wrapper .fixed_top{

	padding: 0;

}

.navbar-default .navbar-nav > li{

	margin: 0 2px;

}

.navbar-default .navbar-nav > li > a{

	font-size: 12px;

	line-height: 70px;

	color: #ffffff!important;

	text-transform: uppercase;

	font-weight: 600;

	padding: 0 10px;

	letter-spacing: 1px;

	opacity: 0.6;

	-webkit-transition: all .3s linear;

	-moz-transition: all .3s linear;

	-ms-transition: all .3s linear;

	transition: all .3s linear;

}

.navbar-default .navbar-nav > li > a .fa{

	margin-right: 3px;

}

.navbar-default .navbar-nav > li:last-child > a{

	padding-right: 0;

}

.navbar-default .navbar-nav > li > a:focus, 

.navbar-default .navbar-nav > li > a:hover,

.navbar-default .navbar-nav > .open > a,

.navbar-default .navbar-nav > .open > a:focus, 

.navbar-default .navbar-nav > .open > a:hover,

.navbar-default .navbar-nav > li.active > a,

.navbar-default .navbar-nav > li.active > a:hover,

.navbar-default .navbar-nav > li.active > a:focus,

.fixed_top.navbar-default .navbar-nav > li > a:hover,

.fixed_top.navbar-default .navbar-nav > li > a:focus,

.fixed_top.navbar-default .navbar-nav > li.active > a{

	opacity: 1;

	background-color: transparent;

}



/*-- right side menu --*/

.home_style_2 .header_wrapper nav .container{

	position: relative;

}

.side_nav{

	width: 300px;

	height: 100vh;

	position: fixed;

	top: 0;

	right: -350px;

	background: #212121;

	padding-top: 150px;

	box-shadow: 0 -5px 10px rgba(0,0,0,.5);

	z-index: 999;

	-webkit-transition: all .3s ease-in-out;

	-moz-transition: all .3s ease-in-out;

	-ms-transition: all .3s ease-in-out;

	transition: all .3s ease-in-out;

}

.header_wrapper .side_nav .close_nav{

	position: absolute;

	right: 20px;

	top: 20px;

	font-size: 16px;

	color: #ffffff;

	cursor: pointer;

}

.side_nav ul{

	text-align: center;

}

.side_nav .navbar-nav > li{

	width: 100%;

	float: right;

}

.side_nav .nav > li > a{

	font-size: 16px;

	line-height: 40px;

	color: #ffffff;

	font-weight: 300;

	text-transform: uppercase;

	letter-spacing: 2px;

	width: 100%;

	padding: 0 20px;

	display: block;

}

.side_nav .nav > li > a .fa{

	margin-right: 5px;

}



.slide_in.side_nav{

	right: 0;

}

.bar_group{

	float: left;

}

.menu_btn{

	background: transparent;

	border: none;

	float: right;

	margin-top: 20px;

	font-size: 16px;

	font-weight: 400;

	text-transform: uppercase;

	color: #ffffff;

}

.fixed_top .menu_btn{

	color: #212121;

}

.menu_btn .icon-bar{

	width: 25px;

	height: 2px;

	display: block;

	background: #ffffff;

	margin: 5px 0;

	-webkit-transition: all .3s ease-in-out;

	-moz-transition: all .3s ease-in-out;

	-ms-transition: all .3s ease-in-out;

	transition: all .3s ease-in-out;

}

.fixed_top .menu_btn .icon-bar{

	background: #555555;

}

.change.icon-bar:nth-of-type(1){

	-webkit-transform: rotate(45deg) translate(5px , 5px);

	-moz-transform: rotate(45deg) translate(5px , 5px);

	-ms-transform: rotate(45deg) translate(5px , 5px);

	transform: rotate(45deg) translate(5px , 5px);

	background: #ffffff;

}

.change.icon-bar:nth-of-type(2){

	-webkit-transform: translateX(-200px);

	-moz-transform: translateX(-200px);

	-ms-transform: translateX(-200px);

	transform: translateX(-200px);

	opacity: 0;

}

.change.icon-bar:nth-of-type(3){

	-webkit-transform: rotate(-45deg) translate(6px , -6px);

	-moz-transform: rotate(-45deg) translate(6px , -6px);

	-ms-transform: rotate(-45deg) translate(6px , -6px);

	transform: rotate(-45deg) translate(6px , -6px);

	background: #ffffff;

}

.home_style_2 .header_wrapper .fixed_top{

	animation: none;

}



/*-- 5.banner css

======================================== --*/

.banner{

	height: 100vh;

	background-size: cover;

	background-attachment: fixed;

	position: relative;

}

.banner .overlay{

	width: 100%;

	height: 100%;

	position: absolute;

	top: 0;

	left: 0;

	background: rgba(3,3,3,.5);

}

.banner .container{

	position: relative;

	top: 50%;

	left: 0;

	padding: 30px;

	-webkit-transform: translateY(-50%);

	-moz-transform: translateY(-50%);

	-ms-transform: translateY(-50%);

	transform: translateY(-50%);

}

.banner h1{

	font-size: 54px;

	line-height: 1.2;

	color: #ffffff;

	font-weight: 300;

	text-transform: uppercase;

	letter-spacing: 5px;

	margin-bottom: 30px;

}

.banner p{

	max-width: 900px;

	margin: 0 auto 40px;

	font-size: 20px;

	font-weight: 400;

	color: #ffffff;

}

.banner .btn{

	background-color: transparent;

	border: 2px solid #ffffff;

}

.banner .btn:hover{

	background-color: #ffffff;

	color: #212121;

}

.banner .btn.style_2{

	background-color: #ffffff;

	border: 2px solid #ffffff;

	color: #212121;

}

.banner .btn.style_2:hover{

	background-color: transparent;

	color: #ffffff;

}

.bg_2{

	background-size: cover;

}

.bg_3{

	background-size: cover;

}

.no_bg{

	background: none;

}



/*-- youtube video background --*/

.video-section{

	background-size: cover;

}

.video-section .pattern-overlay{

	background-color: rgba(30,30,30,.3);

	padding: 0 15px;

	height: 100vh;

	position: relative;

}

.video-section .buttonBar{display:none;}

.player {font-size: 1px;}

.video-section h1{

	font-size: 36px;

	line-height: 1.5;

}

.video-section h1 span{

	display: block;

	font-weight: 700;

}



/*-- 6.about css

======================================== --*/

.about .img_container{

	position: relative;

	top: -20px;

	left: -20px;

	box-shadow: 0px 2px 20px rgba(0,0,0,.2);

}



/*-- 7.services css

======================================== --*/

.border-right{

	border-right: 1px solid #555555;

}

.border-bottom{

	border-bottom: 1px solid #555555;

}

.services .col-sm-4{

	padding: 0;

}

.services .content{

	padding: 30px;

	cursor: pointer;

	position: relative;

	text-align: center;

	-webkit-transition: all .5s ease;

	-moz-transition: all .5s ease;

	-ms-transition: all .5s ease;

	transition: all .5s ease;

}

.services i{

	background-color: transparent;

	font-size: 36px;

	color: #ffffff;

	line-height: 1;

	-webkit-transition: all .5s ease;

	-moz-transition: all .5s ease;

	-ms-transition: all .5s ease;

	transition: all .5s ease;

	margin-bottom: 30px;

	display: block;

}

.services h3{

	margin-bottom: 15px;

	-webkit-transition: all .5s ease;

	-moz-transition: all .5s ease;

	-ms-transition: all .5s ease;

	transition: all .5s ease;

}

.services .content p{

	margin-bottom: 0;

	-webkit-transition: all .5s ease;

	-moz-transition: all .5s ease;

	-ms-transition: all .5s ease;

	transition: all .5s ease;

}

.services .content:hover{

	color: #ffffff;

}

/*-- 8.others css

======================================== --*/

.others{

	background-size: cover;

	position: relative;

}

.others .overlay{

	width: 50%;

	height: 100%;

	position: absolute;

	top: 0;

	left: 0;

	background-color: #363636;

}

@media (max-width: 767px){

	.others .overlay{

		width: 100%;

	}

} 

.others .content{

	padding-left: 90px;

	position: relative;

	margin-bottom: 30px;

}

.others .content i{

	width: 70px;

	font-size: 24px;

	line-height: 70px;

	color: #ffffff;

	text-align: center;

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	-ms-border-radius: 5px;

	border-radius: 5px;

	position: absolute;

	left: 0;

	top: 0;

}



/*-- 9.portfolio css

======================================== --*/

.portfolio{

	text-align: center;

}

.portfolio .button-group .button{

	background-color: transparent;

	padding: 5px 0;

	font-size: 12px;

	letter-spacing: 1px;

	font-weight: 400;

	color: #a4a4a4;

	box-shadow: none;

	text-shadow: none;

	margin: 0  0 5px 0;

	border: none;

	border-radius: 50px;

	padding: 7px 15px;

	text-transform: uppercase;

	-webkit-transition: all .5s;

	-moz-transition: all .5s;

	-ms-transition: all .5s;

	transition: all .5s;

}

.portfolio .button-group .button:hover,

.portfolio .button-group .button:focus,

.portfolio .button-group .button.is-checked{

	background-color: transparent;

	color: #ffffff;

}

.portfolio .grid{

	margin: 0;

}

.portfolio .grid-item{

	width: 25%;

	padding: 0;

	cursor: pointer;

}

.portfolio .grid-item .img_container{

	position: relative;

	overflow: hidden;

}

.portfolio .grid-item img{

	width: 100%;

}

.portfolio .grid-item .overlay{

	text-align: left;

	width: 100%;

	height: 100%;

	position: absolute;

	top: 0;

	left: 0;

	background: rgba(50,50,50,.95);

	opacity: 0;

	padding: 15px;

	-webkit-transition: opacity .3s;

	-moz-transition: opacity .3s;

	-ms-transition: opacity .3s;

	transition: opacity .3s;

	cursor: url('../images/plus.png'), default;

}

.portfolio .grid-item .overlay .links{

	width: 100%;

	text-align: center;

	position: absolute;

	left: 20px;

	top: 20px;

}

.portfolio .grid-item .overlay .links a{

	width: 40px;

	line-height: 40px;

	display: block;

	font-size: 18px;

	color: #ffffff;

	margin: 5px;

	-webkit-border-radius: 50%;

	-moz-border-radius: 50%;

	-ms-border-radius: 50%;

	border-radius: 50%;

	-webkit-transition: all .5s;

	-moz-transition: all .5s;

	-ms-transition: all .5s;

	transition: all .5s;

}

.portfolio .grid-item h4{

	width: 100%;

	font-size: 13px;

	line-height: 22px;

	font-weight: 700;

	text-transform: uppercase;

	letter-spacing: 1px;

	color: #ffffff;

	position: absolute;

	left: 30px;

	bottom: 30px;

}

.portfolio .grid-item h4 span{

	font-size: 12px;

	font-weight: 400;

	display: block;

	text-transform: capitalize;

}

.portfolio .content a:hover{

	opacity: .7;

}

.portfolio .grid-item:hover .overlay{

	opacity: 1;

}

.portfolio .grid-item:hover .overlay h4{

	-webkit-animation: slideRight .3s ease;

	animation: slideRight .3s ease;

}

.portfolio ul.navi{

	margin: 20px 0;

	display: inline-block;

}

.portfolio .navi li a{

	width: 120px;

	padding: 10px 0;

	-webkit-border-radius: 0;

	-moz-border-radius: 0;

	-ms-border-radius: 0;

	border-radius: 0;

}

.portfolio .navi .fa{

	margin: 3px;

}

.owl-prev,

.owl-next{

	float: left;

	width: 30px;

	line-height: 30px;

	background-color: #e1e1e1;

	color: #555555;

	text-align: center;

	margin-right: 5px;

	-webkit-transition: all .5s;

	-moz-transition: all .5s;

	-ms-transition: all .5s;

	transition: all .5s;

}

.owl-prev:hover,

.owl-next:hover{

	background-color: #cccccc;

}



/*-- 10.subscribe css

======================================== --*/

.subscribe h3{

	font-size: 20px;

}



/*-- 11.team css

======================================== --*/

.team .img_container{

	position: relative;

	margin-bottom: 30px;

	cursor: pointer;

}

.team .img_container img{

	margin: 0 auto;

}

.team .team_info{

	width: calc(100% - 60px);

	background-color: #212121;

	font-size: 14px;

	color: #ffffff;

	padding: 20px 20px;

	margin: 0 30px;

	text-align: center;

	line-height: 1.5;

	-webkit-transition: all .5s;

	-moz-transition: all .5s;

	-ms-transition: all .5s;

	transition: all .5s;

	overflow: hidden;

	position: absolute;

	left: 0;

	bottom: 30px;

}

.team .team_info span{

	font-size: 10px;

	font-weight: normal;

	display: block;

}

.team .social a{

	font-size: 20px;

	color: #ffffff;

	-webkit-transition: all .5s;

	-moz-transition: all .5s;

	-ms-transition: all .5s;

	transition: all .5s;

}



.team .img_container .overlay{

	width: 100%;

	height: 100%;

	background-color: rgba(50,50,50,.95);

	display: block;

	position: absolute;

	left: 0;

	top: 0;

	opacity: 0;

	-webkit-transition: all .5s;

	-moz-transition: all .5s;

	-ms-transition: all .5s;

	transition: all .5s;

}

.team .img_container .overlay .social{

	width: 100%;

	position: absolute;

	left: 0;

	top: 40%;

	text-align: center;

	-webkit-transform: translateY(-50%);

	-moz-transform: translateY(-50%);

	-ms-transform: translateY(-50%);

	transform: translateY(-50%);

}

.team .img_container:hover .overlay{

	opacity: 1;

}

.team .img_container:hover .overlay .social{

	-webkit-animation: moveDown .3s ease;

	animation: moveDown .3s ease;

}



/*-- 12.skills css

======================================== --*/

.skills ul li{

	margin-bottom: 15px;

}

.skills ul li .fa{

	font-size: 30px;

	vertical-align: middle;

	margin-right: 10px;

}

.skills .progress{

	height: 3px;

	margin-bottom: 30px;

	overflow: visible;

}

.skills .progress-bar{

	height: 100%;

	position: relative;

	min-width: 20%;

	transition: all 2s ease;

}

.skills .progress-element p{

	font-size: 13px;

	text-transform: uppercase;

	letter-spacing: 1px;

	color: #ffffff;

	font-weight: 900;

	margin-bottom: 0;



}

.skills .progress-bar span{

	position: absolute;

	right: 0;

	top: -35px;

	display: block;

	color: #ffffff;

	font-size: 12px;

	line-height: 25px;

	border-radius: 20px;

	padding: 2px 10px;

}

.skills .progress-bar span::after{

	content: " ";

	border-left: 5px solid transparent;

	border-right: 5px solid transparent;

	position: absolute;

	bottom: -5px;

	left: 16px;

}



/*-- 13.feedback css

================================== --*/

.feedback i{

	width: 80px;

	height: 80px;

	font-size: 36px;

	line-height: 80px;

	text-align: center;

	background-color: #212121;

	color: #ffffff;

	border-radius: 50%;

	margin-bottom: 20px;

}

.feedback p{

	max-width: 900px;

}

.feedback .item{

	padding: 30px;

	background: #363636;

	margin: 0 20px 50px;

	border-radius: 5px;

}

.feedback .item p{

	margin: 0 auto 10px;

	font-style: italic;

}

.feedback .item h4{

	font-size: 14px;

	line-height: 1.8;

	font-weight: 700;

}

.feedback .item h4 span{

	font-style: normal;

	color: #ffffff;

	display: block;

	font-weight: 400;

}



/*-- 14.fun_facts css

================================== --*/

.fun_facts{

	background-size: cover;

	position: relative;

	padding-top: 150px;

	padding-bottom: 120px;

}

.fun_facts .overlay{

	width: 100%;

	height: 100%;

	position: absolute;

	left: 0;

	top: 0;

	background-color: rgba(0,0,0,.8);

}

.fun_facts .content i{

	font-size: 36px;

	line-height: 1;

	color: #ffffff;

	display: block;

}

.fun_facts .counter{

	font-size: 50px;

	line-height: 1;

	color: #ffffff;

	font-weight: 700;

	margin-bottom: 30px;

}

.fun_facts h4{

	font-size: 16px;

	letter-spacing: 1px;

	color: #ffffff;

}

.fun_facts.bg-black .counter,

.fun_facts.bg-black h4{

	color: #ffffff;

}



/*-- 15.pricing_table css

================================== --*/

.pricing_table .col-sm-6{

	padding: 0 30px;

}

.pricing_table .pricing{

	background: #363636;

	padding: 20px 30px;

	margin-bottom: 30px;

	overflow: hidden;

	position: relative;

}

.pricing_table .pricing li{

	font-size: 14px;

	line-height: 35px;

	text-transform: capitalize;

	color: #ffffff;
	
	list-style-type: none;

}

.pricing_table .pricing .heading{

	font-size: 16px;

	text-transform: uppercase;

	font-weight: 700;

	color: #ffffff;
	
	list-style-type: none;

}

.pricing.recommend .heading::after{

	background: #555555;

	font-size: 10px;

	line-height: 40px;

	padding: 0 40px;

	position: absolute;

	left: -40px;

	top: 20px;

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

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

	-ms-transform: rotate(-45deg);

	transform: rotate(-45deg);

	-webkit-box-shadow: 0 0 10px rgba(0,0,0,.15);

	-moz-box-shadow: 0 0 10px rgba(0,0,0,.15);

	-ms-box-shadow: 0 0 10px rgba(0,0,0,.15);

	box-shadow: 0 0 10px rgba(0,0,0,.15);

}

.pricing_table .pricing .price{

	font-size: 16px;

	line-height: 1.2;

	padding: 20px 0;

	border-top: 1px solid #555555;

	border-bottom: 1px solid #555555;

	margin: 15px 0;
	
	list-style-type: none;

}

.pricing_table.style_2 .pricing .price{

	background-color: #eeeeee;

}



.pricing_table.style_3 .pricing .price,

.pricing_table.style_3 .pricing .price span,

.pricing_table.style_4 .pricing .price{

	color: #ffffff;

}

.pricing_table.style_4 .pricing .price{

	background-color: #363636;

}

.pricing_table .pricing .price span{

	font-size: 40px;

	font-weight: 700;

	display: block;

}

.pricing_table .pricing:hover{

	-webkit-box-shadow: 0 5px 30px rgba(0,0,0,.15);

	-moz-box-shadow: 0 5px 30px rgba(0,0,0,.15);

	-ms-box-shadow: 0 5px 30px rgba(0,0,0,.15);

	box-shadow: 0 5px 30px rgba(0,0,0,.15);

}

.pricing_table .link{

	margin-top: 15px;

	margin-bottom: 20px;

	height: 40px;

	line-height: 40px;

}



/*-- 16.blog css

================================== --*/

.blog .item{

	padding: 0;

	margin: 0 0 50px;

}

.blog .content{

	background-color: #212121;

	padding-top: 20px;

}

.blog .img_container{

	display: block;

}

.blog a{

	font-size: 13px;

	color: #ffffff;

	font-weight: 700;

	text-transform: uppercase;

	text-decoration: none;

}

.blog h3 a{

	font-size: 15px;

	line-height: 1.8;

	color: #ffffff;

}

.blog h6{

	font-size: 11px;

	line-height: 1;

	text-transform: uppercase;

	letter-spacing: 1px;

}

.blog h6 a{

	font-size: 11px;

	color: #999999;

	font-weight: 400;

	border-left: 2px solid #cccccc;

}

.blog a i{

	vertical-align: middle;

}



.blog .owl-theme .owl-nav{

	position: absolute;

	top: -65px;

	right: 0;

}

.blog .owl-theme .owl-nav [class*="owl-"]{

	border-radius: 0;

	font-size: 12px;

	line-height: 25px;

	text-transform: uppercase;

	margin: 1px;

}



/*-- 17.faq css

======================================== --*/

.faq{}

.faq .panel{

	border: none;

	box-shadow: none;

	margin-bottom: 10px;

}

.faq .panel-default > .panel-heading{

	background-color: #555555;

	padding: 0;

}

.faq .panel-default > .panel-heading .panel-title a{

	display: block;

	padding: 15px;

	font-size: 13px;

	line-height: 20px;

	text-transform: uppercase;

	font-weight: 700;

	color: #ffffff;

}

.faq .panel-default > .panel-heading .fa{

	float: right;

	font-size: 14px;

	line-height: 20px;

}

.faq .panel-group .panel-heading + .panel-collapse > .list-group,

.faq .panel-group .panel-heading + .panel-collapse > .panel-body{

	border: none;

	background-color: #444444;

	font-size: 15px;

	line-height: 30px;

}

.collapsed .fa{

	-webkit-transform: rotate(180deg);

	-moz-transform: rotate(180deg);

	-ms-transform: rotate(180deg);

	transform: rotate(180deg);

}

.faq.style_2 .panel-default > .panel-heading{

	background-color: #363636;

}

.faq.style_3 .panel-default > .panel-heading{

	background-color: #eeeeee;

	color: #555555;

	border: 1px solid #e1e1e1;

}

.faq.style_3 .panel-group .panel-heading + .panel-collapse > .list-group,

.faq.style_3 .panel-group .panel-heading + .panel-collapse > .panel-body{

	border: 1px solid #e1e1e1;

}

.faq.style_4 .panel-default > .panel-heading{

	border:none;

}

.faq.style_4 .panel-group .panel-heading + .panel-collapse > .list-group,

.faq.style_4 .panel-group .panel-heading + .panel-collapse > .panel-body{

	border: none;

	border-top: 1px solid #e1e1e1;

}

.faq.style_5 .container{

	max-width: 900px;

}

.widget{

	padding-right: 20px;

}

.search-row{

	position: relative;

}

.search-row .form-control{

	width: 100%;

}

.widget .form-control{

	width: 100%;

	height: 50px;

	border: 1px solid transparent;

	background-color: #555555;

	color: #ffffff;

	border-radius: 0;

	outline: 0;

	box-shadow: none;

	font-size: 13px;

	line-height: 52px;

	padding: 0 20px;

}

.search-row button{

	width: 50px;

	height: 50px;

	background: transparent;

	border: none;

	position: absolute;

	top: 0;

	right: 0;

	color: #999999;

}

.search-row button:hover{

	color: #555555;

}

.widget h5{

	font-size: 14px;

	line-height: 30px;

	color: #ffffff;

	font-weight: 700;

	letter-spacing: 1px;

	position: relative;

}

.widget p{

	font-size: 14px;

}

.widget.quote p{

	font-style: italic;

	color: #a4a4a4;

}

.widget.quote p span{

	display: block;

	font-style: normal;

	font-size: 13px;

	color: #999999;

	text-transform: uppercase;

	font-weight: 700;

	margin: 10px 0;

}

.widget address span{

	color: #ffffff;

	text-transform: uppercase;

	font-size: 13px;

	font-weight: 700;

	margin-right: 10px;

}

.widget-social-link a{

	width: 40px;

	float: left;

	text-align: center;

	padding: 5px 0;

	background-color: #212121;

	border-radius: 20px;

	margin-right: 10px;

	margin-bottom: 5px;

	color: #ffffff;

	-webkit-transition: all .5s;

	-moz-transition: all .5s;

	-ms-transition: all .5s;

	transition: all .5s;

}



/*-- 18.contact css

======================================== --*/

#map {

	width: 100%;

	height: 400px;

}

.form-control,

.contact .widget .form-control{

	height: 50px;

	font-size: 13px;

	line-height: 44px;

	color: #ffffff;

	background-color: #555555;

	border-radius: 0;

	border: 1px solid transparent;

	box-shadow: none;

	-webkit-transition: all .3s;

	-moz-transition: all .3s;

	-ms-transition: all .3s;

	transition: all .3s;

}

.contact textarea.form-control{

	height: auto;

	min-height: 150px;

	resize: vertical;

	line-height: 25px;

	padding-top: 13px;

}

.form-control:hover,

.form-control:focus,

.contact .widget .form-control:hover,

.contact .widget .form-control:focus{

	box-shadow: none;

}



/*-- 19.partners css

======================================== --*/

.partners .item img{

	opacity: .7;

	-webkit-transition: all .3s;

	-moz-transition: all .3s;

	-ms-transition: all .3s;

	transition: all .3s;

}

.partners .item img:hover{

	opacity: 1;

}



/*-- 20.purchase css

======================================== --*/

.purchase h3{

	font-size: 20px;

	color: #ffffff;

}

.purchase p{

	color: #ffffff;

}



/*-- 21.footer css

======================================== --*/

footer{

	font-size: 14px;

	line-height: 30px;

	color: #757575;

}

.footer_top .footer_logo{

	display: block;

	margin-top: -15px;

}

.footer_top h3{

	color: #ffffff;

}

.footer_top li a{

	text-transform: capitalize;

	color: #757575;

	-webkit-transition: all .5s;

	-moz-transition: all .5s;

	-ms-transition: all .5s;

	transition: all .5s;

}

.footer_top .twitter li{

	position: relative;

}

.footer_top .twitter a{

	color: #ffffff;

	text-transform: initial;

}

.footer_top .twitter i{

	position: absolute;

	left: 0;

	top: 7px;

}

.footer_top .newsletter input{

	padding: 0 15px;

	height: 50px;

	line-height: 50px;

	border: none;

	box-shadow: none;

	border-radius: 0;

	margin-bottom: 10px;

}

.footer_top .newsletter .btn{

	width: 100%;

}

.footer_top .footer_menu li a{

	text-transform: capitalize;

	color: #999999;

	-webkit-transition: all .5s;

	transition: all .5s;

}

.footer_top .footer_menu li a:hover{

	color: #ffffff;

}

.footer_bottom p{

	font-size: 12px;

}

.footer_bottom ul li a{

	line-height: 30px;

	padding: 0 5px;

	font-size: 20px;

	color: #999999;

	-webkit-transition: all .5s;

	-moz-transition: all .5s;

	-ms-transition: all .5s;

	transition: all .5s;

}







/*-- 22.media queries

======================================== --*/



/*-- for devices less then 992px wide --*/



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

	body,p{

		font-size: 13px;

		line-height: 24px;

	}

	.navbar-default .navbar-nav > li > a{

		font-size: 11px;

		padding: 0 8px;

	}

	.team .team_info{

		width: 100%;

		margin: 0;

		font-size: 12px;

		padding: 15px;

		bottom: -40px;

	}

	.fun_facts h4{

		font-size: 13px;

	}

	.faq .panel-group .panel-heading + .panel-collapse > .list-group, 

	.faq .panel-group .panel-heading + .panel-collapse > .panel-body{

		font-size: 13px;

		line-height: 24px;

	}

	.widget p{

		font-size: 13px;

	}

	.widget .form-control{

		font-size: 11px;

		padding: 0 10px;

	}

	.faq .panel-default > .panel-heading .panel-title a{

		font-size: 11px;

	}

	#map{

		max-height: 300px;

	}

	footer{

		font-size: 13px;

	}



}

	



/*-- for devices less then 768px wide --*/



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

	header{

		padding-top: 0;

	}

	header .container-fluid{

		padding: 0 15px;

	}

	.navbar-collapse{

		border: none;

		box-shadow: none;

		background: #333333;

		padding: 15px;

	}

	.navbar-default .navbar-nav > li > a{

		line-height: 40px;

		color: #212121;

		text-align: center;

		border-bottom: 1px solid #e1e1e1;

	}

	.header_wrapper .fixed_top .navbar-nav > li > a{

		color: #ffffff!important;

	}

	.navbar-brand{

		padding-bottom: 10px;

	}

	.navbar-toggle{

		margin-top: 19px;

		background: #212121;

		border: none;

		transition: all .3s;

	}

	.navbar-default .navbar-toggle .icon-bar{

		background: #ffffff;

		opacity: 1;

	}

	.navbar-default .navbar-toggle:focus, 

	.navbar-default .navbar-toggle:hover{

		background: #555555;

	}

	h1{

		font-size: 24px!important;

	}

	.banner p{

		font-size: 14px!important;

	}

	.team .col-sm-4{

		width: 50%;

	}

	.team .img_container{

		margin-bottom: 50px;

	}

	.skills .content{

		padding-left: 0;

		padding-bottom: 0;

	}

	.subscribe .text-right,

	.purchase .text-right,

	.startup .text-right{

		text-align: left;

	}

	.border-right,

	.border-bottom{

		border: none;

	}

	.portfolio .grid-item{

		width: 50%;

	}

	.blog .section_title{

		margin-bottom: 70px;

	}

	.footer_bottom p,

	.footer_bottom ul{

		width: 100%;

		float: none;

		text-align: center;

		margin-bottom: 5px;

	}

}



/*-- for devices less then 500px wide --*/



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

	div[class^="col-"],

	.grid-item{

		width: 100%!important;

	}

	.team .img_container img{

		width: 100%;

	}

}