/*
    Template Name: Probiz- personal portfolio template
    Author: 
    Author URI: 
    Description: 
    Version: 1.0
*/


/* Table of Content
==================================================
1.  Global Styles
2.  Typography
3.  Common styles
4.  Navigation
5.  HEADER AREA
6.  SECTION ABOUT
7.  SECTION SERVICES
8.  SECTION PORTFOLIO
9.  SECTION FEATURES
10. SECTION TESTIMONIAL
11. SECTION CONTACT
12. SECTION FOOTER


*/


/* 1 - Google Font
------------------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Raleway:300,400,600,700|Roboto+Condensed:300,400,700');

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


/* 2 - General styles
------------------------------------------------------------------------*/


/* input palceholder text style*/

:-moz-placeholder {
	color: #FFF;
	letter-spacing: 2px;
	font-size: 12px;
	text-transform: uppercase;
}

::-moz-placeholder {
	/* Firefox 19+ */
	color: #FFF;
	letter-spacing: 2px;
	font-size: 12px;
	text-transform: uppercase;
}

:-ms-input-placeholder {
	color: #FFF;
	font-size: 12px;
	letter-spacing: 2px;
	text-transform: uppercase;
}

::-webkit-input-placeholder {
	color: #FFF;
	font-size: 12px;
	letter-spacing: 2px;
	text-transform: uppercase;
}

body {
	width: 100%;
	height: 100%;
	line-height: 24px;
	color: #6a6a6a;
	font-size: 13px;
	font-family: 'Oxygen', sans-serif;
	font-weight: normal;
	letter-spacing: 1px;
}

html {
	width: 100%;
	height: 100%;
}

.no-padding {
	padding: 0;
}

a,
a:focus,
a:active,
a:link,
img {
	outline: none;
}

a {
	color: #555;
	-webkit-transition: color .2s ease;
	-moz-transition: color .2s ease;
	-ms-transition: color .2s ease;
	-o-transition: color .2s ease;
	transition: color .2s ease;
}

a {
	cursor: pointer;
	text-decoration: none;
	color: #323232;
	transition: all 0.25s ease 0s;
	-moz-transition: all 0.25s ease 0s;
	-webkit-transition: all 0.25s ease 0s;
	-o-transition: all 0.25s ease 0s;
}

a:hover {
	color: #FF7E60;
	text-decoration: none;
	transition: all 0.25s ease 0s;
	-moz-transition: all 0.25s ease 0s;
	-webkit-transition: all 0.25s ease 0s;
	-o-transition: all 0.25s ease 0s;
}

a:focus {
	outline: none;
	outline-offset: 0;
}

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

p {
	line-height: 26px;
	font-size: 14px;
	font-weight: 400;
	color: #666;
}

img {
	height: auto;
	max-width: 100%;
	border: none;
	outline: none;
	transition: all 0.2s ease 0s;
	-moz-transition: all 0.2s ease 0s;
	-webkit-transition: all 0.2s ease 0s;
	-o-transition: all 0.2s ease 0s;
}

iframe,
audio {
	width: 100%;
	height: auto;
	border: none;
}

ul,
li {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}



/* 2.1 - Headings 
--------------------------------------------- */

h1,
h2,
h3,
h4,
h5,
h6 {
	color: #323232;
	font-family: "Roboto Condensed", sans-serif;
	font-weight: 700;
	margin-top: 0px;
	margin-bottom: 10px;
	color: #333;
	text-transform: uppercase;
}

h1 {
	font-size: 43px;
	letter-spacing: 2px;
	line-height: 40px;
}

h2 {
	font-size: 27px;
	line-height: 37px;
	margin-bottom: 20px;
	padding-top: 10px;
}

h3 {
	font-size: 21px;
	line-height: 32px;
}

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

h5 {
	font-size: 15px;
	line-height: 23px;
	font-weight: 600;
}

h6 {
	font-size: 13px;
	line-height: 18px;
	font-weight: 600;
}


/* buttons style */

.btn {
	padding: 14px 40px;
	font-size: 13px;
	font-weight: 700;
	border-radius: 25px;
	text-transform: uppercase;
}

.btn-primary {
	border: 2px solid transparent;
	border-color: #FF7E60;
	background: #FF7E60;
	color: #fff;
	-webkit-transition: all .3s ease 0s;
	-o-transition: all .3s ease 0s;
	transition: all .3s ease 0s;
}

.btn-primary:hover {
	background: #fff;
	border: 2px solid #fff;
	color: #2A2A2A;
}

.btn-black {
	background: transparent;
	border: 2px solid #2A2A2A;
	color: #2A2A2A;
	-webkit-transition: all .3s ease 0s;
	-o-transition: all .3s ease 0s;
	transition: all .3s ease 0s;
}

.btn-black:hover {
	border-color: #2A2A2A;
	background: #2A2A2A;
	color: #fff;
}

.btn-grey {
	border-color: #eee;
	background: #FAFAFA;
	color: #2A2A2A;
	padding: 12px 40px;
	margin-top: 20px;
	-webkit-transition: all .3s ease 0s;
	-o-transition: all .3s ease 0s;
	transition: all .3s ease 0s;
}

.btn-grey:hover {
	background: #2A2A2A;
	color: #fff;
	border-color: #2A2A2A;
}

.btn-feature {
	background: #2A2A2A;
	border: 1px solid#2A2A2A;
	color: #fff;
	-webkit-transition: all .3s ease 0s;
	-o-transition: all .3s ease 0s;
	transition: all .3s ease 0s;
}

.btn-feature:hover {
	background: #fff;
	color: #2A2A2A;
	border-color: #999;
}



/*==================== section heading ========================*/

.section-heading {
	margin-bottom: 70px;
}

.mid-title {
	font-size: 40px;
}

.subtitle {
	font-size: 26px;
	text-transform: uppercase;
	line-height: 36px;
	font-weight: 400;
}

.section-padding {
	padding-bottom: 80px;
}

.parallx-overlay {
	position: absolute;
	content: "";
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	height: 100%;
}

.parallx-overlay.black {
	position: absolute;
	background: rgba(0, 0, 0, 0.95);
}

.parallx-overlay.grey {
	position: absolute;
	background: rgba(255, 255, 255, 0.95);
	background-color: rgba(0, 0, 0, 0.49);
}

.section-padding {
	padding: 90px 0px;
}


/*======================================================
     navigation 
==========================================================*/

.navbar-custom {
	margin-bottom: 0;
	border-bottom: 1px solid rgba(255, 255, 255, .3);
	background: #fff;
	text-transform: uppercase;
	font-family: "Roboto Condensed", sans-serif;
}

.navbar-custom .navbar-brand {
	font-weight: 700;
}

.navbar-custom .navbar-brand:focus {
	outline: 0;
}

.navbar-custom .navbar-brand .navbar-toggle {
	padding: 4px 6px;
	font-size: 16px;
	color: #fff;
}

.navbar-custom .navbar-brand .navbar-toggle:focus,
.navbar-custom .navbar-brand .navbar-toggle:active {
	outline: 0;
}

.navbar-custom a {
	color: #fff;
	font-size: 13px;
	letter-spacing: 3px;
}

.navbar-custom .nav li a {
	-webkit-transition: background .3s ease-in-out;
	-moz-transition: background .3s ease-in-out;
	transition: background .3s ease-in-out;
}

.navbar-custom .nav li a:hover {
	outline: 0;
	color: rgba(255, 255, 255, .8);
	background-color: transparent;
}

.navbar-custom .nav li a:focus,
.navbar-custom .nav li a:active {
	outline: 0;
	background-color: transparent;
}

.navbar-custom .nav li.active {
	outline: 0;
}

@media(min-width:768px) {
	.navbar-custom {
		padding: 20px 0;
		border-bottom: 0;
		letter-spacing: 1px;
		background: 0 0;
		-webkit-transition: background .5s ease-in-out, padding .5s ease-in-out;
		-moz-transition: background .5s ease-in-out, padding .5s ease-in-out;
		transition: background .5s ease-in-out, padding .5s ease-in-out;
	}
	.navbar-custom.top-nav-collapse {
		-webkit-box-shadow: 0px 0px 2px #777;
		box-shadow: 0px 0px 2px #777;
		background-color: rgba(0, 0, 0, 0.97);
		box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.1);
	}
	.navbar-custom.top-nav-collapse .nav li a {
		color: #fff;
	}
	.navbar-custom.top-nav-collapse .nav li.active a {
		background-color: transparent;
		color: #FF7E60!important;
	}
	.navbar-custom.top-nav-collapse .navbar-brand {
		color: #fff;
	}
}


/*============================================
    SLIDER SECTION
===============================================*/

#section-intro {
	height: 100%;
	background: #222 url("../images/bg/banner3.jpg") no-repeat fixed 50% 50% / cover;
	padding: 0px;
	position: relative;
	max-height: 600px;
	overflow: hidden;
}

.intro-caption {
	width: 100%;
	text-align: center;
	position: absolute;
	color: #fff;
	padding-top: 250px;
}

.intro-caption h1 {
	font-size: 40px;
	color: #fff;
	line-height: 50px;
	margin: 30px 0px;
}

.intro-caption .subtitle {
	letter-spacing: 5px;
	margin-bottom: 20px;
}

.intro-caption .btn-container {
	margin-top: 40px;
}


/*================================================================
        section about
===============================================================*/

.about-wrap {}

.about-wrap h4 {
	text-transform: capitalize;
	font-family: "Raleway", sans-serif;
	font-weight: 400;
	font-size: 22px;
	line-height: 34px;
	margin: 20px 0px 40px;
	width: 80%;
}

.about-wrap h4 span {
	font-weight: 700;
}

.about-wrap a {
	margin-top: 40px;
}
.profile {
	margin-top: 90px;
}


/*======================================================
    section service
============================================================*/

#section-services {
	background: #f9f9f9;
}

.section-heading {
	text-align: center;
}

.service-box {
	border-bottom: 5px solid transparent;
	padding: 25px 30px;
}

.service-box i {
	font-size: 50px;
	text-align: center;
	height: 80px;
	padding-top: 10px;
	-webkit-transition: all .3s ease 0s;
	-o-transition: all .3s ease 0s;
	transition: all .3s ease 0s;
}

.service-box:hover i {
	color: #FF7E60;
	padding: 0px;
}

.service-box:hover h4 {
	color: #FF7E60;
}

.service-box h4 {
	margin: 20px 0px;
}

.service-box:hover,
.service-box.active {
	border-bottom: 5px solid#eee;
	background: #fff;
}


/*============================================
   SECTION PORTFOLIO 
===============================================*/

#section-portfolio {}

.project-heading {
	margin: 50px 0px;
}

.img-box {
	overflow: hidden;
	position: relative;
}

.img-overlay {
	background-color: rgba(255, 255, 255, 0.6);
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	transition: all 0.3s ease 0s;
	width: 100%;
}

.img-box:hover .img-overlay {
	opacity: 1;
}

#portfolio-carousel .carousel-indicators {
	bottom: 0px;
}

#portfolio-carousel .carousel-indicators li {
	width: 20px;
	background: #333;
	border-color: #2c2c2c;
	border-radius: 0px;
}

.portfolio-wrap {
	display: block;
	width: 100%;
	padding: 0px;
	margin: 0px;
	transition: height 450ms ease-out 0s;
	-webkit-transition: height 450ms ease-out 0s;
	-o-transition: height 450ms ease-out 0s;
}

.single-portfolio {
	display: block;
	overflow: hidden;
	margin-bottom: 25px;
}

.single-portfolio figure {
	position: relative;
	overflow: hidden;
}

#isotope-filter {
	margin-bottom: 60px;
}

#isotope-filter a {
	font-size: 14px;
	font-weight: 400;
	line-height: 40px;
	border: 1px solid#eee;
	padding: 12px 15px;
	text-transform: uppercase;
}

#isotope-filter a.active,
#isotope-filter a:hover,
#isotope-filter a:focus {
	font-weight: 400;
}

#isotope-filter a:hover,
#isotope-filter a:focus {
	color: #FF7E60;
}

#isotope-filter a:first-child:before {
	content: " ";
}


/* -- Isotope start -- */

#isotope {
	width: 100%;
	margin-top: 0;
}

.isotope-item {
	z-index: 2;
}

.isotope-hidden.isotope-item {
	z-index: 1;
}

.isotope,
.isotope .isotope-item {
	/*transition-duration*/
	-webkit-transition-duration: 1s;
	-moz-transition-duration: 1s;
	-o-transition-duration: 1s;
	transition-duration: 1s;
}

.isotope {
	/*transition-property*/
	-webkit-transition-property: height, width;
	-moz-transition-property: height, width;
	-o-transition-property: height, width;
	transition-property: height, width;
}


/*.isotope .isotope-item{
-webkit-transition-property:0px opacity;
   -moz-transition-property:0px opacity;
     -o-transition-property:0px opacity;
        transition-property:0px opacity;
}*/

#isotope .col-sm-3 {
	width: 24.95%;
}


/* ======================================
 *  06. Classes override
/* ====================================== */

.close {
	font-size: 35px !important;
	z-index: 300;
	position: absolute;
	top: 15px;
	right: 30px;
}

.modal.modal-fullscreen.force-fullscreen .modal-body {
	margin-top: 120px;
}

.modal.modal-fullscreen.force-fullscreen .modal-body a.btn {
	margin-top: 20px;
}

.modal.modal-fullscreen.force-fullscreen .modal-body h3 {
	font-weight: 400;
}


/*====================================================
    section features
==========================================================*/

#section-features {
	padding-bottom: 50px;
	background: #f9f9f9;
}

.feature-heading {
	width: 75%;
	margin: 0 auto;
}

.feature-heading h3 {
	text-transform: capitalize;
	font-family: "Raleway", sans-serif;
	font-weight: 400;
	font-size: 22px;
	line-height: 36px;
	margin-bottom: 60px;
}

.feature-heading h3 span {
	font-weight: 700;
}

.feature-list {
	margin-top: 40px;
}

.feature-box {
	margin-bottom: 60px;
	text-align: center;
	padding: 0px 30px;
}

.feature-icon {
	margin: 0 auto;
	margin-bottom: 20px;
}

.feature-icon i {
	font-size: 70px;
	line-height: 70px;
	color: #FF7E60;
}


/*=====================================================
    SECTION TESTIMONIAL
==========================================================*/

#section-testimonial {
	padding: 80px 0px 95px;
	background: url("../images/bg/bg12.jpg") no-repeat fixed 50% 50%;
	-webkit-background-size: cover;
	background-size: cover;
	position: relative;
}

#testimonial-carousel .item {
	text-align: center;
	color: #fff;
}

#testimonial-carousel .item p,
#testimonial-carousel .item h4,
#testimonial-carousel .item h5 {
	color: #fff;
}

#testimonial-carousel .item p {
	width: 70%;
	margin: 20px auto;
	color: #ccc;
}

#testimonial-carousel .item i {
	font-size: 45px;
	text-align: center;
	line-height: 45px;
	width: 100%;
	margin: 0px auto 30px;
}

#testimonial-carousel .carousel-indicators {
	bottom: -45px;
}

#testimonial-carousel .carousel-indicators li {
	margin: 5px;
	cursor: pointer;
	opacity: 0.4;
	transition: all 0.4s;
	border-color: #fff;
}

#testimonial-carousel .carousel-indicators .active {
	opacity: 1;
	background: #fff;
}


/*=====================================================
    SECTION CONTACT
==========================================================*/

.section-sub-heading {
	padding-top: 80px;
}

#section-contact {
	padding-bottom: 90px;
}

.form-control {
	border-radius: 2px;
	box-shadow: none!important;
	height: 45px;
}

#contactForm .form-group {
	margin-bottom: 30px;
}


/*=====================================================
    SECTION FOOTER
==========================================================*/

#section-footer {
	padding: 70px 0px;
	background: #111;
}

.footer-socail {
	margin: 20px 0px 0px;
}

.footer-socail li a {
	text-transform: uppercase;
	color: #fff;
	font-weight: 700;
}

.footer-socail li a:hover {
	background: #fff;
	color: #FF7E60;
}

.footer-link p {
	width: 70%;
	margin: 10px auto 0px;
	color: #ccc;
}

.copy {
	color: #eee;
	text-transform: capitalize;
}