@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,600;1,700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400;1,500&display=swap');

@import url('../vendor/css/bundle.min.css');

@import url('../vendor/css/jquery.fancybox.min.css');

@import url('../vendor/css/owl.carousel.min.css');

@import url('../vendor/css/wow.css');

@import url('tootik.min.css');

@import url('line-awesome.min.css');

@import url('jquery.pagepiling.css');

 

 

 



.main-font {

	font-family: 'Playfair Display', serif;

	font-weight:400 !important

}

.alt-font {

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

}

/* ===================================

    General

====================================== */



body {

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

	font-size: 18px;

	color: #ffffff!important;

	font-weight:300;

	line-height:25px;

	width: 100%;

	overflow-x: hidden

}

a, input, button, .navbar, .fixedmenu, .tp-bullet, .owl-dot, .owl-prev, .owl-next {

	transition: ease-in-out 0.2s;

	-webkit-transition: ease-in-out 0.2s;

	-moz-transition: ease-in-out 0.2s;

	-ms-transition: ease-in-out 0.2s;

	-o-transition: ease-in-out 0.2s;

}

section, .section-padding {

	position: relative;

	overflow: hidden;

}

a {

	color:inherit;

	text-decoration: none;

}

a:active, a:hover {

	color: #ffcc29 !important;

	text-decoration: none;

}

.btn.focus, .btn:focus {

	-webkit-box-shadow: none;

	box-shadow: none;

}

p:last-child {

	margin-bottom: 0 !important;

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

}

.fa, .far, .fas {

	display: inline;

}

li {

	list-style: none;

	text-decoration: none;

}

blockquote {

	border-left: 2px solid;

	padding: 10px 15px 10px 35px;

	margin: 25px 0;

	font-size: 18px;

	line-height: 28px;

}

blockquote > cite {

	font-weight: 400;

	font-size: 14px;

	display: block;

}

.hidden {

	display: none;

}

section {

	padding: 0;

}

/* transition none */

.no-transition * {

	transition-timing-function:initial;

	-moz-transition-timing-function:initial;

	-webkit-transition-timing-function:initial;

	-o-transition-timing-function:initial;

	-ms-transition-timing-function:initial;

	transition-duration: 0s;

	-moz-transition-duration: 0s;

	-webkit-transition-duration: 0s;

	-o-transition-duration: 0s;

	-ms-transition-duration: 0s;

}

/* overlay */

.bg-overlay {

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

}

/* opacity */

.opacity-full {

	opacity: 1;

}

.opacity-1 {

	opacity: .1;

}

.opacity-2 {

	opacity: .2;

}

.opacity-3 {

	opacity: .3;

}

.opacity-4 {

	opacity: .4;

}

.opacity-5 {

	opacity: .5;

}

.opacity-6 {

	opacity: .6;

}

.opacity-7 {

	opacity: .7;

}

.opacity-8 {

	opacity: .8;

}

.opacity-9 {

	opacity: .9;

}

/*font-weight*/

.font-weight-100 {

	font-weight: 100;

}

.font-weight-200 {

	font-weight: 200;

}

.font-weight-300 {

	font-weight: 300;

}

.font-weight-500 {

	font-weight: 500;

}

.font-weight-600 {

	font-weight: 600;

}

.font-weight-700 {

	font-weight: 700;

}

/* button */

.btn {

	-webkit-appearance: initial;

	overflow: hidden;

	position: -webkit-sticky;

	position: sticky;

	z-index: 2;

	display:inline-block;

	font-size: 20px;

	border:2px solid transparent;

	letter-spacing: .5px;

	line-height: inherit;

	border-radius: 0;

	text-transform:capitalize;

	width: auto;

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

	font-weight: bold;

-webkit-transition: all .5s ease;

-o-transition: all .5s ease !important;

transition: all .5s ease !important;

}

/* Transparent button */

.btn.btn-trans {

	background: transparent;

	border-color: #ffffff;

	color: #ffffff;

	text-decoration: none;

}

.btn.btn-trans:hover {

	background: #ffffff !important;

	border-color: #ffffff;

	color: #232728 !important

}

/* White button */

.btn.btn-white {

	background: transparent;

	border-color: #ffffff;

	color: #ffffff;

	text-decoration: none;

}

.btn.btn-white:hover {

	background: #ffffff !important;

	border-color: #ffffff;

	color: #232728 !important

}

/* button size */

.btn.btn-small {

	font-size:12px;

	padding: 4px 1.8em;

}

.btn.btn-medium {

	font-size:16px;

	padding: 10px 48px;

	line-height: 1.8em

}

.btn.btn-large {

	font-size:16px;

	padding: 14px 30px;

	line-height: 1.8em;

}

.btn.btn-rounded {

	border-radius: 50px;

}

/* Text color */

.text-grey {

	color: #a6a6a6;

}

.text-white {

	color: #ffffff;

}

.text-light-black {

	color: #232728;

}

/* Background color */

.bg-green {

	background: #000000;

}

.bg-pink {

	background: #000000;

}

.bg-yellow {

	background: #000000;

}

.text-light-black {

	background: #232728;

}

.bg-blue {

	background: #000000;

}

.bg-red {

	background: #000000;

}

.bg-transparent {

	background: transparent;

}

/* Social Icons Background */

.facebook-bg-hvr:hover {

	background:#4267B2 !important;

	color: #fff !important;

	border: 1px solid #4267B2 !important;

}

.twitter-bg-hvr:hover {

	background:#1DA1F2 !important;

	color: #fff !important;

	border: 1px solid #1DA1F2 !important;

}

.instagram-bg-hvr:hover {

	background:#C32AA3 !important;

	color: #fff !important;

	border: 1px solid #C32AA3 !important;

}

.linkedin-bg-hvr:hover {

	background:#0077B5 !important;

	color: #fff !important;

	border: 1px solid #0077B5 !important;

}

.pinterest-bg-hvr:hover {

	background:#BD081C !important;

	color: #fff !important;

	border: 1px solid #BD081C !important;

}

.google-bg-hvr:hover {

	background:#DB4437 !important;

	color: #fff !important;

	border: 1px solid #DB4437 !important;

}

.rss-bg-hvr:hover {

	background:#ee802f !important;

	color: #fff !important;

	border: 1px solid #DB4437 !important;

}

/* ===================================

   Page Piling

====================================== */



#pp-nav li .active span, .pp-slidesNav .active span {

	background-color: #ffffff;

	z-index: 9999;

}

 #pp-nav li .active span::before {

 content: "";

 height: 2px;

 width: 12px;

 background: #535353;

 display: block;

 transform: translate(-17.5px, 6.5px);

 animation: fadeIn 1.6s;

 opacity: 1;

 transition: opacity 1s;

 -webkit-transition: opacity 1s;

}

 #pp-nav li span::before {

 content: "";

 height: 2px;

 width: 12px;

 background: #535353;

 display: block;

 transform: translate(-17.5px, 6.5px);

 opacity: 0;

 transition: opacity 1s;

 -webkit-transition: opacity 1s;

 animation: zoomOut 1.6s;

}

 #pp-nav li .active span::after {

 content: "";

 height: 2px;

 width: 12px;

 background: #535353;

 display: block;

 transform: translate(19px, 5px);

 animation: fadeIn 1.6s;

 opacity: 1;

 transition: opacity 1s;

 -webkit-transition: opacity 1s;

}

 #pp-nav li span::after {

 content: "";

 height: 2px;

 width: 12px;

 background: #535353;

 display: block;

 transform: translate(19px, 5px);

 opacity: 0;

 transition: opacity 1s;

 -webkit-transition: opacity 1s;

 animation: zoomOut 1.6s;

}

#pp-nav span, .pp-slidesNav span {

	top: 2px;

	left: 2px;

	width: 18px;

	height: 18px;

	box-shadow: inset 0 0 0 7px transparent;

	background: transparent;

	border-radius: 50%;

	border-color: #ffcc29 !important;

	position: absolute;

	z-index: 1;

	-webkit-transition: -webkit-transform 0.3s, box-shadow 0.3s;

	transition: transform 0.3s, box-shadow 0.3s;

}

#pp-nav li, .pp-slidesNav li {

	display: block;

	width: 12px;

	height: 12px;

	margin: 16px 8px 16px 8px;

	position: relative;

}

.pp-tooltip {

	color: #ffffff;

	background-color: #232728;

	margin-left: 25px;

	padding: 2px 8px;

	border-radius: 2px;

	z-index: 9999;

}

.pp-tooltip:after {

	content: " ";

	width: 0;

	height: 0;

	border-left: 6px solid transparent;

	border-right: 6px solid #232728;

	border-bottom: 6px solid transparent;

	border-top: 6px solid transparent;

	position: absolute;

	right: 100%;

	top: 50%;

	margin-top: -6px;

}

/* ===================================

    Sidebar Toggle Btn

====================================== */



.my_tog {

	padding: 20px;

	margin-top: 20px;

	margin-right: 10px;

	cursor: pointer;

 transition: .8s ease;

	display: inline-block;

	float: right;

}

.my_tog:hover span:first-child {

	width: 16px;

}

.my_tog:hover span:last-child {

	width: 16px;

}

.my_tog span {

	display: block;

	height: 2px;

	width: 25px;

	background-color: #232728;

	margin-bottom: 4px;

 transition: .7s ease;

}

/* ===================================

    SideNav

====================================== */

.side_nav {

	display: block;

	background-color: #f2f2f2;

	width:15%;

	float: left;

	height: auto;

	box-shadow: 1px 1px 10px #535353;

 transition: .5s ease;

	position: relative;

}

.side_nav {

	position: fixed;

	top:0;

	left:0%;

	z-index: 11;

	bottom: 0;

}

.brand-logo {

	display: inline-block;

	padding-top: 13px;

	margin-top: 20px;

	padding-left:25px;

 transition: .6s ease;

}

.sticky-logo {

	position: absolute;

	right: -5px;

	bottom: 15px;

}

.brand-logo span {

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

	font-weight: bolder;

}

.my_nav_tog {

	cursor:pointer;

	width:10%;

}

.my_nav_tog span {

	display: block;

	margin-bottom: 6px;

	height: 2px;

	background-color: #444444;

	width: 30px;

}

.side-nav-menu .nav-menu {

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

	padding-left: 35px;

	padding-top: 60px;

}

.broad .side-nav-menu ul {

	padding-top: 130px;

}

.side-nav-menu .nav-menu li, .broad .side-nav-menu ul li {

	list-style: none;

	font-size:15px;

	font-weight: 600;

	transition: 1s ease;

	overflow: hidden;

	box-sizing: border-box;

	text-align: left !important;

}

.side-nav-menu .nav-menu li a, .broad .side-nav-menu ul li a {

	display: inline-block;

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

	text-transform: uppercase;

	text-decoration: none;

	color: #232728;

 transition: .1s ease;

	overflow: hidden;

	position: relative;

	width: 70%;

	top: 7px;

	padding: 0;

	text-align: left;

}

.line:after {

	-webkit-backface-visibility: hidden;

	backface-visibility: hidden;

	border: 1px solid rgba(255, 255, 255, 0);

	bottom: 0;

	content: " ";

	display: block;

	position: relative;

	-webkit-transition: all 280ms ease-in-out;

	transition: all 280ms ease-in-out;

	width: 0;

}

.line:hover:after, .line.active:after {

	-webkit-backface-visibility: hidden;

	backface-visibility: hidden;

	border-color: #ffcc29;

	-webkit-transition: width 350ms ease-in-out;

	transition: width 350ms ease-in-out;

	width: 100%;

}

.side-nav-menu .nav-menu li a {

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

	text-decoration: none;

	color: #000000;

 transition: .5s ease;

	width: auto;

}

/*broad nav*/

.side-nav-menu .side-icons ul {

	padding-top: 0 !important;

	padding-left: 21px !important;

}

.side-nav-menu .side-icons ul li {

	margin-bottom: 0 !important;

	list-style: none;

	display: inline-block;

	padding-right: 10px;

}

.side-nav-menu .side-icons ul li a {

	color: #000000;

}

.side_nav.expand_nav .sticky-logo {

	opacity: 0;

 transition: .5s ease;

}

.side_nav .nav-item {

	display: block;

	margin: 5px 0;

	padding: 0 !important;

	opacity: 0;

	-webkit-transition: all 0.8s ease 500ms;

	-o-transition: all 0.8s ease 500ms;

	transition: all 0.8s ease 500ms;

	-webkit-transform: translateY(60px);

	-ms-transform: translateY(60px);

	transform: translateY(60px);

}

.side_nav.expand_nav .nav-item:first-child {

 -webkit-transition-delay: .1s;

 -o-transition-delay: .1s;

 transition-delay: .1s;

}

.side_nav.expand_nav .nav-item:nth-child(2) {

 -webkit-transition-delay: .2s;

 -o-transition-delay: .2s;

 transition-delay: .2s;

}

.side_nav.expand_nav .nav-item:nth-child(3) {

 -webkit-transition-delay: .3s;

 -o-transition-delay: .3s;

 transition-delay: .3s;

}

.side_nav.expand_nav .nav-item:nth-child(4) {

 -webkit-transition-delay: .4s;

 -o-transition-delay: .4s;

 transition-delay: .4s;

}

.side_nav.expand_nav .nav-item:nth-child(5) {

 -webkit-transition-delay: .5s;

 -o-transition-delay: .5s;

 transition-delay: .5s;

}

.side_nav.expand_nav .nav-item:nth-child(6) {

 -webkit-transition-delay: .6s;

 -o-transition-delay: .6s;

 transition-delay: .6s;

}

.side_nav.expand_nav .nav-item:nth-child(7) {

 -webkit-transition-delay: .7s;

 -o-transition-delay: .7s;

 transition-delay: .7s;

}

.side_nav.expand_nav .nav-item:nth-child(8) {

 -webkit-transition-delay: .8s;

 -o-transition-delay: .8s;

 transition-delay: .8s;

}

.side_nav.expand_nav .nav-item:nth-child(9) {

 -webkit-transition-delay: .9s;

 -o-transition-delay: .9s;

 transition-delay: .9s;

}

.side_nav.expand_nav .nav-item {

	-webkit-transform: translateY(0);

	-ms-transform: translateY(0);

	transform: translateY(0);

	opacity: 1;

}

/* ===================================

    Nav-Bar css

====================================== */



.navbar {

	padding-top: 30px;

	padding-bottom: 30px;

	background-color: #ffffff !important;

}

.navbar-brand {

	text-decoration: none;

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

	font-weight:normal;

	font-size: 30px;

}

.navbar-brand span {

	font-weight:bolder;

}

.side-nav-menu .social-icons span:hover i {

	cursor: pointer;

}

.social-icons span a {

	color: #202020;

}

.social-icons span i {

	font-size: 13px;

	margin-left: 0;

	background-color: transparent;

	height: 30px;

	width: 30px;

	border-radius: 50%;

	text-align: center;

	padding-top: 8px;

 transition: .5s ease;

}

.social-icons span:last-child {

	margin-right: 70px;

}

/* ===================================

    Broad Nav-bar css

====================================== */



.broad {

	visibility: hidden;

	opacity: 0;

	transform: rotate(0deg);

}

.broad .side-nav-menu {

	display: none;

}

.broad-nav {

 transition: .5s ease-in-out;

	background-color: white;

	display: block;

	visibility: visible;

	position: fixed;

	overflow: hidden;

	z-index: 111111;

	top:0;

	bottom: 0;

	right: 0;

	left:0;

	opacity: 1;

}

.margin-manage {

	margin-top: 100px;

}

.broad-nav .side-nav-menu {

	display: block;

}

.broad-nav .side-nav-menu ul {

	position: relative;

	left: 20%;

	transform: translate(-20px, 0);

}

.broad-nav .side-nav-menu .social-icons span {

	display: inline-block;

	height: 35px;

	width: 35px;

	border-radius: 50%;

	position: relative;

}

.broad-nav .side-nav-menu .nav-menu li a span, .broad .side-nav-menu ul li a span {

	display: inline-block;

	height: 2px;

	width: 0;

	background-color: #f73859;

 transition: .8s ease;

	position: absolute;

	top: 13px;

	margin-left: 9px;

}

.broad .side-nav-menu ul li a {

	margin-left: 9px;

}

.broad-nav .side-nav-menu ul li a.active span {

	width: 75%;

	display: inline-block;

 transition: .5s ease;

}

.fix-top {

	animation-name: animationFade;

	-webkit-animation-duration: 1s;

	-o-animation-duration: 1s;

	animation-duration: 1s;

	-webkit-animation-fill-mode: both;

	-o-animation-fill-mode: both;

	animation-fill-mode: both;

}

 @-webkit-keyframes animationFade {

 from {

 opacity: 0;

 -webkit-transform: translate3d(0, -100%, 0);

 transform: translate3d(0, -100%, 0);

}

to {

	opacity: 1;

	-webkit-transform: none;

	transform: none;

}

}

 @-o-keyframes animationFade {

 from {

 opacity: 0;

 -webkit-transform: translate3d(0, -100%, 0);

 transform: translate3d(0, -100%, 0);

}

to {

	opacity: 1;

	-webkit-transform: none;

	-o-transform: none;

	transform: none;

}

}

 @keyframes animationFade {

 from {

 opacity: 0;

 -webkit-transform: translate3d(0, -100%, 0);

 transform: translate3d(0, -100%, 0);

}

to {

	opacity: 1;

	-webkit-transform: none;

	-o-transform: none;

	transform: none;

}

}

.broad-nav .side-nav-menu .social-icons span i {

	position: absolute;

	top: -1px;

	left: -5px;

 transition: .8s ease;

}

.broad-nav .side-nav-menu .social-icons span .fa-facebook-f {

	left: -5px;

}

.broad-nav .side-nav-menu .social-icons {

	transition: all 1s ease 500ms;

	animation-duration: 2s;

	font-size: 14px;

	animation-name: myan;

 animation-delay: .7s;

	animation-fill-mode: both;

	color: #d6d6d6;

	margin-top: -89px !important;

}

.broad-nav .side-nav-menu ul {

	position: relative;

	left: 15%;

	transform: translate(-25px, -91px);

}

.broad .side-nav-menu ul li {

	transition: all 2s ease 500ms;

	animation-duration: 1s;

}

/*side close btn*/

.broad .btn-close {

	height: 33px;

	width: 33px;

	display: inline-block;

	text-align: center;

	position: absolute;

	top: 20px;

	right: 8px;

	cursor: pointer;

	color: #444444;

	z-index: 111;

 transition: .5s ease;

}

.broad.before-side .btn-close {

	display: none;

}

 .broad .btn-close::before, .broad .btn-close::after {

 position: absolute;

 left: 16px;

 content: ' ';

 height: 24px;

 width: 2px;

 background: black;

 top: 5px;

 transition: 0.5s ease;

}

 .broad .btn-close:hover::before, .broad .btn-close:hover::after {

 height: 28px;

}

.broad .btn-close:before {

	-webkit-transform: rotate(45deg);

	-ms-transform: rotate(45deg);

	-o-transform: rotate(45deg);

	transform: rotate(45deg);

}

.broad .btn-close:after {

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

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

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

	transform: rotate(-45deg);

}

.broad.right-btn .btn-close {

	right: 47px;

	left: auto;

}

.broad .side-nav-menu ul li span {

	font-size: 30px;

	color: #d9d9d9;

}

.broad .social-icons i {

	font-size: 16px;

}

.broad .brand-logo {

	padding-top: 0;

	padding-left: 70%;

}

.rites-res {

	position: absolute;

	bottom: 20px;

	padding-left: 30px;

	color:#000 !important;

	font-size:14px !important;

}

.rites-res a {

	display:block;

	margin-top:10px;

	font-size:13px;

	font-weight:bold

}

.broad .rites-res {

	margin-top: 28px;

	width: 85%;

	margin-left: 49px;

}

/* ===================================

    Expand Nav bar & body Shrink

====================================== */



.expand_nav {

	left:0;

}

.close_nav {

	padding-top: 25px;

}

 .close_nav span:nth-child(2) {

 display: none;

}

.close_nav span:first-child {

	margin-left: auto;

	transform: rotate(45deg);

	margin-bottom: -2px;

}

.close_nav span:last-child {

	margin-top: 0;

	transform: rotate(130deg);

}

.close_nav:hover span:first-child, .close_nav:hover span:last-child {

	width: 25px;

}

/* ===================================

   Banner

====================================== */



.slider-area {

	background-image: url("../images/banner.jpg");

	height: 100vh;

	background-repeat: no-repeat;

	background-size: cover;

	width: 85%;

	margin-left: 15%;

}

.slider-image {

	position: relative;

	margin: 0 auto -80px auto;

	top: 100px;

}

.slider-image img {

	top: -90px;

	width: 100%;

	position: relative;

}

.slider-text {

	background-color: #ffffff;

	;

	color: #2b3033;

}

.slider-area h1 {

	font-size: 50px;

	line-height: 1.3;

}

.slider-area h1 span {

	display:block;

	color:#ffcc29 !important;

	font-size: 60px;

	line-height: 1.2;

}

.slider-area p {

	font-size: 16px;

	font-weight: normal;

}

.headings h1 {

	font-size: 50px;

	line-height: 1.3;

	text-transform:uppercase

}

.headings h1 span {

	display:block;

	color:#ffcc29 !important;

	font-size: 60px;

	line-height: 1.2;

}

.headings p {

	font-size: 16px;

	font-weight: normal;

}

.slider-area {

	align-items: center;

	display: flex;

	position: relative;

}

.slider-copyright {

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

	font-size: 15px;

	position: absolute;

	bottom: 15px;

	left: 35vh;

	/* right: 15px;  */

	z-index: 1111;

}

.slider-bottom .slider-social {

	position: absolute;

	top: 15px;

	right: 15px;

	z-index: 1111;

}

.slider-bottom .slider-social a {

	color: #ffffff;

}

.fixed {

	position: fixed;

}

/*slider social*/

.side-nav-menu .slider-social {

	position: absolute;

	right: 50px;

	top: auto;

	z-index: 111;

}

.side-nav-menu .slider-social {

	right: auto;

	bottom: 5px;

}

.slider-social ul>li {

	float: left;

}

.slider-social a {

	display: block;

	width: 30px;

	height: 30px;

	text-align: center;

	line-height: 30px;

	border-radius: 50px;

	color: #000000;

	font-size: 16px;

	margin: 2px;

	border: 1px solid transparent;

 -webkit-transition: background-color .2s ease-in-out;

 -moz-transition: background-color .2s ease-in-out;

 -o-transition: background-color .2s ease-in-out;

 transition: background-color .2s ease-in-out;

}

svg.slider-shape {

	overflow: visible;

}

/* ===================================

   About

====================================== */



.about {

	height: 100vh;

	width: 85%;

	margin-left: 15%;

}

.about.slider-1 {

	background-image: url("../images/banner-2.jpg");

	background-repeat: no-repeat;

	background-size: cover;

}

.about.slider-2 {

	background-image: url("../images/about-project-1.jpg");

	background-repeat: no-repeat;

	background-size: cover;

}

.about.slider-3 {

	background-image: url("../images/about-project-2.jpg");

	background-repeat: no-repeat;

	background-size: cover;

}

.about.slider-4 {

	background-image: url("../images/banner-2.jpg");

	background-repeat: no-repeat;

	background-size: cover;

}

.about.slider-5 {

	background-image: url("../images/banner-5.jpg");

	background-repeat: no-repeat;

	background-size: cover;

}

.about.slider-7 {

	background-image: url("../images/banner-7.jpg");

	background-repeat: no-repeat;

	background-size: cover;

}

.about.slider-8 {

	background-image: url("../images/banner-8.jpg");

	background-repeat: no-repeat;

	background-size: cover;

}

.about h2 {

	font-size: 48px;

	font-weight: bold;

}

.section-heading {

	margin-bottom: 1.5rem;

}

.feature-item .title {

	color: #ffffff;

 transition: .8s ease;

	font-size: 16px;

	font-weight: bold;

}

.feature-item p {

	color: #ffffff;

	font-weight: 300;

	font-size: 18px;

	line-height:1.3

}

.feature-item .r-icon {

	font-size: 25px;

	font-weight: 900;

	display: block;

	text-align: right;

	color: #d5d3d3;

}

.feature-item > i.f-icon {

	font-size: 42px;

	line-height: 55px;

	color: #fff;

 transition: .8s ease;

	height: 55px;

	width: 55px;

	display: flex;

	justify-content: center;

}

.feature-item:hover > i.f-icon {

	background-color: #ffffff;

	color: #232728;

	text-align: center;

	border-radius: 50px;

	height: 55px;

	width: 55px;

 transition: .8s ease;

}

.about .box {

	padding: 30px;

}

.about .box h2 {

	font-size: 30px;

	font-weight: bold;

}

.about .box-overlay {

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

	opacity: .6;

	background-color: rgba(255, 255, 255, 0.2);

}

/* ===================================

   Our Team

====================================== */



.team {

	background-image: url("../images/banner-4.jpg");

	height: 100vh;

	background-repeat: no-repeat;

	background-size: cover;

	width: 85%;

	margin-left: 15%;

}

.team h2 {

	font-size: 48px;

	font-weight: bold;

}

.parallax-box {

	text-align: center;

}

.parallax-box h2 {

	font-size: 2.5rem;

	margin-bottom: 10px;

	font-weight: bold;

}

.parallax-box h5 {

	font-weight: normal;

	font-size: 16px;

}

#team-slider {

	text-align: center;

}

.team-box {

	text-align: center;

	display: inline-block;

	width: 100%;

	padding: 10px;

	background-color:#ffffff;

 

	-webkit-transition: 0.5s ease;

	-o-transition: 0.5s ease;

	transition: 0.5s ease;

	position: relative;

	-webkit-transform: scale(0.7);

	-ms-transform: scale(0.7);

	transform: scale(0.7);

}

.team-box .team-image {

	position: relative;

	overflow: hidden;

}

.team-box .team-text {

	text-align: center;

	font-size: 14px;

	padding: 1.3rem 0 0 0;

}

.team-box .team-text span, .team-box .team-text .team-social {

	opacity: 0;

 transition: .25ms;

}

.team-box .team-text h5 {

	font-size: 22px;

	color: #232728;

	font-weight: normal;

}

.team-box .team-text span {

	color: #212331;

	font-size: 14px;

	font-weight: normal;

}

#team-slider .owl-item.center .item {

	height: auto;

	transform: scale(1.0);

}

#team-slider .owl-item.center .team-box .team-text h5 {

	font-size: 24px;

}

#team-slider .owl-item.center .item .team-text span, #team-slider .owl-item.center .item .team-text .team-social {

	opacity: 1;

 transition: .5s ease;

}

.team-social ul {

	margin: 0;

}

.team-social li {

	display: inline-block;

}

.team-social a {

	display: flex;

	align-items: center;

	justify-content: center;

	width: 30px;

	height: 30px;

	text-align: center;

	line-height: 40px;

	border-radius: 50px;

	font-size: 15px;

	margin: 5px 0;

	color: #232728;

	border: 1px solid transparent;

 -webkit-transition: background-color .2s ease-in-out;

 -moz-transition: background-color .2s ease-in-out;

 -ms-transition: background-color .2s ease-in-out;

 -o-transition: background-color .2s ease-in-out;

 transition: background-color .2s ease-in-out;

}

/* ===================================

   Portfolio

====================================== */



.portfolio-bg {

	background-image: url("../images/banner-3.jpg");

	height: 100vh;

	background-repeat: no-repeat;

	background-size: cover;

	width: 85%;

	margin-left: 15%;

}

.main-heading h2 {

	font-size: 48px;

	font-weight: bold;

}

.team-classic .item {

	text-align: left;

}

.team-data-img {

	overflow: inherit;

}

.portfolio-content {

	background: transparent;

	margin-top: 2rem;

}

.portfolio-content h5 {

	font-size: 18px;

	font-weight: normal;

	text-align: center;

}

.portfolio-content p {

	font-size: 16px;

	font-weight: normal;

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

}

.search-icon {

	border: 1px solid white;

	border-radius: 50%;

	display: inline-block;

	color: #ffffff;

	padding: 14px 14px;

	margin-bottom: 20px;

}

.single-work {

	overflow: hidden;

	position: relative;

	padding: 15px;

	background-color: #ffffff;

 transition: all .3s ease 0s;

}

.single-work img {

	width: 100%;

	height: auto;

}

.single-work .title {

	width: 80%;

	font-weight: normal;

	color: #ffffff;

	margin: 0 0 15px 0;

	position: absolute;

	top: 50%;

	left: 50%;

	transform: translate(-50%, -50%);

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

}

.single-work .overlay-text {

	width: 100%;

	height: 100%;

	font-size: 26px;

	color: #fff;

	background-color: transparent;

 -webkit-transition: opacity .4s;

 transition: opacity .4s;

	text-align: center;

	opacity: 0;

	position: absolute;

	top: 0;

	left: 0;

}

.cases-image-inner {

	position: relative;

	padding: 0 15px;

	width: 100%;

	height: 100%;

	display: flex;

	align-items: center;

	justify-content: center;

	z-index: 1111;

}

.cases-line {

	position: absolute;

	background: #ffffff;

}

.top {

	top: 15px;

	right: 15px;

	width: 100px;

	height: 2px;

}

.top-right {

	top: 15px;

	right: 15px;

	height: 100px;

	width: 2px;

}

.bottom {

	top: unset;

	bottom: 15px;

	left: 15px;

	width: 100px;

	height: 2px;

}

.bottom-left {

	top: unset;

	bottom: 15px;

	left: 15px;

	height: 100px;

	width: 2px;

}

.single-work .overlay-text:before, .single-work .overlay-text:after {

	opacity: 0.6;

	position: absolute;

	top: 0;

	content: "";

	width: 0;

	height: 100%;

	background-color: #000;

	-webkit-transition: all 0.45s ease-in-out 0s;

	transition: all 0.45s ease-in-out 0s;

	z-index: -1;

	-webkit-transform: skewX(-25deg);

	transform: skewX(-25deg);

}

.single-work .overlay-text:before {

	right: 0;

}

.single-work .overlay-text:after {

	left: 0;

}

.item:hover .overlay-text {

	opacity: 1;

}

.item:hover .overlay-text:before, .item:hover .overlay-text:after {

	width: 100%;

	transform: skewX(0);

	-webkit-transform: skewX(0);

	-moz-transform: skewX(0);

	-ms-transform: skewX(0);

	-o-transform: skewX(0);

	z-index: 1;

}

.item .img-responsive {

	max-width: 100%;

 transition: all .5s ease 0.2s;

}

.item:hover .img-responsive {

	transform: scale(1.2);

 transition: all .5s ease 0.2s;

}

.circle {

	position: relative;

	z-index: 1111;

	height: 42px;

	width: 42px;

	display: flex;

	justify-content: center;

	align-items: center;

	cursor: pointer;

}

.circle i {

	transition: 0.5s ease;

}

#team-circle-right {

	top: 40%;

	right: -8%;

 transition: .5s ease;

	position: absolute;

}

#team-circle-left {

	top: 40%;

	left: -8%;

 transition: .5s ease;

	position: absolute;

}

.circle i {

	font-size: 42px;

	color: #706f6f;

}

/* ===================================

   Blog

====================================== */



.blog-bg {

	background-image: url("../images/banner.jpg");

	height: 100vh;

	background-repeat: no-repeat;

	background-size: cover;

	width: 85%;

	margin-left: 15%;

}

.icon-quotes-left, .icon-quotes-right {

	color: #ffffff;

	font-size: 14px;

 -webkit-transition: .2s ease;

 -o-transition: .2s ease;

 transition: .2s ease;

	cursor: pointer;

	line-height: 1.3;

}

.icon-quotes-right {

	text-align: right;

}

.icon-quotes-left {

	padding-left: 10px;

}

.news-item {

	position: relative;

	overflow: hidden;

	text-align: left;

	cursor: pointer;

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

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

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

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

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

}

.news-item img {

	width: 100%;

 transition: all .5s ease 0.2s;

}

.news-item:hover {

	transform: translateY(-10px);

}

.image-holder-gallary {

	overflow: hidden;

	background-color:#f8f8f8;

	padding:2px;

}

.news-item:hover img {

	transform: scale(1.2);

 transition: all .5s ease 0.2s;

}

.news-item .news-text-box {

	padding: 20px 0;

	background-color: transparent;

}

.news-item .news-title {

	margin: 14px 0;

	font-size: 18px;

	font-weight: bold;

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

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

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

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

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

}

.news-item .news-title:hover {

	color: #ffffff;

}

.para {

	font-size: 18px;

	font-weight: 200;

}

.testimonial-img {

	display: flex;

	justify-content: center;

}

.testimonial-img img {

	border-radius: 50%;

	display: inline-block;

}

/* ===================================

   Contact

====================================== */



.contact-sec {

	background-image: url("../images/banner-5.jpg");

	height: 100vh;

	background-repeat: no-repeat;

	background-size: cover;

	width: 85%;

	margin-left: 15%;

}

.contact-sec .heading {

	color: #ffffff;

	font-size: 16px;

	line-height:1.5;

	margin-bottom: 40px;

 

}

.contact-sec .contact-form input {

	color: #ffffff;

	font-size: 16px;

	height: 40px;

	padding: 25px 0;

	background: transparent;

}

.contact-sec .contact-form .form-control {

	border: none;

	border-radius: 0;

	padding-left: 0;

	border-bottom: 1px solid rgba(255, 255, 255, 0.3);

}

.contact-sec .contact-form .form-control:focus {

	box-shadow: none;

	border-bottom: 1px solid #ffffff;

}

 .contact-sec .contact-form input::placeholder, .contact-sec .contact-form textarea::placeholder {

 color: #ffffff;

 font-size: 14px;

}

.contact-sec .contact-form textarea {

	padding-top: 20px;

	height: 70px;

	color: #ffffff;

	font-size: 16px;

	resize: none;

	background: transparent;

	margin-bottom: 40px;

}

.contact-sec .contact-form .purple-btn {

	margin-top: 15px;

}

.contact_btn {

	font-size: 16px;

	font-weight: 600;

	text-transform: uppercase;

}

/*contact details*/

.contact-sec .contact-background {

	position: absolute;

	right: 0;

	top: -35px;

	z-index: -1;

}

.contact-sec .contact-details {

	font-family: Roboto, sans-serif;

	width: 90%;

	margin-left: 20px;

	padding-top: 20%;

}

.contact-sec .contact-details .heading {

	margin-bottom: 35px;

	font-size: 30px;

	font-weight: normal;

}

.contact-sec .contact-details .text {

	color: #ffffff;

	font-size: 17px;

	font-weight: normal;

}

.contact-sec .contact-details ul {

	padding-left: 0;

	margin-bottom: 0;

	margin-top: 50px;

}

.contact-sec .contact-details ul li {

	color: #ffffff;

	list-style: none;

	margin-bottom: 22px;

	font-size: 16px;

	display: flex;

	align-items: start;

	font-weight: normal;

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

}

.contact-sec .contact-details ul li:first-child {

	width: 60%;

}

.contact-sec .contact-details ul li span {

	display: inline-block;

	padding-right: 30px;

}

.contact-sec .contact-details ul li span:last-child {

	padding-right: 0;

}

.contact-sec .contact-details ul li i {

	font-size: 30px;

	margin-right: 20px;

	margin-top: 5px;

	color: #ffffff;

}

/* ===================================

    Cursor

====================================== */



#animated-cursor {

	position: absolute;

	left: 0;

	display: none;

	top: 0;

	width: 30px;

	height: 30px;

	pointer-events: none;

	z-index: 10000;

	-webkit-transition: opacity 0.2s ease-in-out 0.5s;

	transition: opacity 0.2s ease-in-out 0.5s;

}

 .cursor-light:hover ~ #animated-cursor {

 display: inline-block;

}

#cursor {

	position: fixed;

	transform: translate(-50%, -50%);

	width: 25px;

	height: 25px;

	border: 2px solid #ffffff;

	border-radius: 50%;

	pointer-events: none;

	opacity: 1;

	box-sizing: border-box;

}

#cursor:before {

	font-family: themify;

	content: "\e649";

	font-size: 6px;

	width: 4px;

	height: 8px;

	line-height: 8px;

	text-align: center;

	position: absolute;

	left: -12px;

	top: 9px;

	color: #ffffff;

	opacity: 0;

	transition: all 0.1s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;

}

#hold-event {

	width: 26px;

	height: 26px;

	position: absolute;

	top: 0;

	left: 0;

	border-radius: 100%;

	background: rgba(255, 255, 255, 0);

}

#cursor-loader {

	width: 40px;

	height: 40px;

	position: absolute;

	background-color: transparent;

	border-right: 2px solid transparent;

	border-bottom: 2px solid #ffffff;

	border-left: 2px solid transparent;

	border-top: 2px solid transparent;

	border-radius: 50px;

	box-sizing: border-box;

	opacity: 0;

	transform: translate(-9px, -9px) rotate(0deg);

	-webkit-animation: rotating 0.8s ease-in-out infinite;

	animation: rotating 0.8s ease-in-out infinite;

	-webkit-transition: opacity 0s ease-in-out 0s;

	transition: opacity 0s ease-in-out 0s;

}

#cursor:after {

	font-family: themify;

	content: "\e649";

	font-size: 6px;

	width: 4px;

	height: 8px;

	line-height: 8px;

	text-align: center;

	position: absolute;

	right: -10px;

	top: 9px;

	color: #ffffff;

	opacity: 0;

	transition: all 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;

}

 @keyframes rotating {

 0% {

 -webkit-transform: translate(-7px, -7px) rotate(0deg);

 transform:  translate(-7px, -7px) rotate(0deg);

}

 95% {

 -webkit-transform:  translate(-7px, -7px) rotate(350deg);

 transform:  translate(-7px, -7px) rotate(350deg);

}

 100% {

 -webkit-transform:  translate(-7px, -7px) rotate(360deg);

 transform:  translate(-7px, -7px) rotate(360deg);

}

}

 .header-appear.cursor-light:hover ~ #animated-cursor {

 display: none;

}

.header-appear .animated-wrap, .header-appear .animated-element {

	transform: none !important;

}

/* ===================================

        Preloader

   ====================================== */



.loader {

	background: #fff;

	text-align: center;

	height: 100vh;

	z-index: 9999;

	position: fixed;

	width: 100%;

	display: flex;

	justify-content: center;

	align-items: center;

}

.linear-activity {

	overflow: hidden;

	width: 100%;

	height: 4px;

	background-color: transparent;

	margin: 20px auto;

}

.determinate {

	position: relative;

	max-width: 100%;

	height: 100%;

	-webkit-transition: width 500ms ease-out 1s;

	-moz-transition: width 500ms ease-out 1s;

	-o-transition: width 500ms ease-out 1s;

	transition: width 500ms ease-out 1s;

	background-color: #03A9F4;

}

.indeterminate {

	position: relative;

	width: 100%;

	height: 100%;

}

.indeterminate:before {

	content: '';

	position: absolute;

	height: 100%;

	background-color: #ffcc29;

	animation: indeterminate_first 1.5s infinite ease-out;

}

.indeterminate:after {

	content: '';

	position: absolute;

	height: 100%;

	background-color: #ffcc29;

	animation: indeterminate_second 1.5s infinite ease-in;

}

 @keyframes indeterminate_first {

 0% {

 left: -100%;

 width: 100%;

}

 100% {

 left: 100%;

 width: 10%;

}

}

 @keyframes indeterminate_second {

 0% {

 left: -150%;

 width: 100%;

}

 100% {

 left: 100%;

 width: 10%;

}

}

.my_tog {

	display:none

}

/* ===================================

   Media Queries

====================================== */



@media (min-width: 1800px) {

 .expand-container {

 max-width: 1300px;

}



    /* Side Nav */

    #pp-nav.left {

 left: 26px;

}

 .sticky-logo {

 right: 2px;

}

 .my_tog {

 margin-right: 18px;

}



    /* About */

    .about .section-heading {

 margin-bottom: 3rem;

}

 .about .box {

 margin-top: 2rem;

}



    /* Team */

    .team .section-heading {

 margin-bottom: 5rem !important;

}

 .team-box {

 height: 480px;

 padding: 16px;

}



    /* Portfolio */

    .portfolio-bg .section-heading {

 margin-bottom: 5rem;

}

 .portfolio-content {

 margin-top: 5rem;

}



    /* Blog */

    .blog-bg .section-heading {

 margin-bottom: 5rem;

}



    /* Contact */

    .contact-sec .contact-form textarea {

 margin-bottom: 60px;

}

}

 @media (max-width: 1280px) and (min-width: 1210px) {

 .my_tog {

 margin-right: 0;

}

 .sticky-logo {

 right: -15px;

}

}

 @media (max-width: 1200px) and (min-width: 992px) {

 .h1, h1 {

font-size: 60px;

}

 section {

padding: 10rem 0;

}

 html {

scroll-behavior: smooth;

}

 .section-heading {

margin-bottom: 3.5rem;

}

 .about, .team, .portfolio-bg, .blog-bg, .contact-sec {

height: auto;

}



    /* Side Nav */

    .my_tog {

 padding: 20px 5px;

}

 .sticky-logo {

 display: none !important;

}

 .side-nav-menu .nav-menu {

 padding-left: 35px;

 padding-top: 350px;

}

 .rites-res {

 bottom: 0;

}



    /* Banner */

    .slider-area h1 {

 font-size: 54px;

}



    /* About */

    .about h2 {

 font-size: 38px;

}



    /* Team */

    .team h2 {

 font-size: 42px;

}

 .team-social a {

 height: 36px;

 width: 36px;

}

 .team-box {

 height: 370px;

}



    /* Portfolio */

    .main-heading h2 {

 font-size: 42px;

}



    /* Contact */

    .contact-sec .heading {

 font-size: 42px;

}

 .btn.btn-medium {

 padding: 10px 42px;

}

}

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

 .h1, h1 {

font-size: 58px;

}

 .h3, h3 {

font-size: 32px;

}

 section {

padding: 7.5rem 0;

}

 p {

font-size: 14px;

}

 html {

scroll-behavior: smooth;

}

 .about, .team, .portfolio-bg, .blog-bg, .contact-sec {

height: auto;

}

 .section-heading {

margin-bottom: 3rem;

}



    /* Side Nav */

    .my_tog {

 padding: 20px 0;

 margin-right: 8px;

}

 .sticky-logo {

 display: none !important;

}

 .side-nav-menu .nav-menu {

 padding-left: 35px;

 padding-top: 220px;

}



    /* Banner */

    .slider-area h1 {

 font-size: 42px;

}

 .slider-area p {

 font-size: 16px;

}



    /* About */

    .about h2 {

 font-size: 36px;

}

 .feature-item p {

 font-size: 14px;

}



    /* Team */

    .team h2 {

 font-size: 36px;

}

 .team-box {

 height: 290px;

}



    /* Portfolio */

.main-heading h2 {

 font-size: 36px;

}



    /* Blog */

    .news-item .news-title {

 font-size: 22px;

}

 .para {

 font-size: 16px;

}



    /* Contact */

    .contact-sec .heading {

 font-size: 42px;

}

 .contact-sec .contact-details .text {

 text-align: left;

}

}

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

 body {

text-align: center;

overflow-y: hidden!important;

}

 html {

scroll-behavior: smooth;

}

 section {

padding: 5rem 0;

}

 .h1, h1 {

font-size: 36px;

}

 .h2, h2 {

font-size: 36px;

}

 .h3, h3 {

font-size: 24px;

}

 p {

font-size: 14px;

line-height: 20px;

}

 .about, .team, .portfolio-bg, .blog-bg, .contact-sec {

width: 100%;

margin-left: 0;

background-size:cover;

background-position:bottom;

align-items: flex-start;

}

 .slider-area {

width: 100%;

margin-left: 0;

background-repeat: no-repeat;

background-size:cover;

background-position:bottom;

 align-items: center;

 

}

 .pp-tableCell {

 display: table-cell;

 vertical-align: middle;

 width: 100%;

 height: 100%;

 

}

 

    /* Side Nav */

	.my_tog {

display:block

}

 .side_nav {

 display: none;

}

 .navbar-brand {

 margin-right: 0;

}

header {

position:fixed;

left:0;

right:0;

top:0;

width:100%;

display: block;

 z-index: 999;

}

    /* Nav-Bar */

    .navbar {

 padding: 6px 10px;

}

 .navbar .navbar-brand {

height:70px;

}



    /* Banner */

    .slider-bottom .slider-social, .slider-copyright {

 display: none !important;

}

 .slider-area h1 {

 font-size: 36px;

}

 .slider-area p {

 font-size: 14px;

}

#pp-nav {

    position: fixed;

    z-index: 100;

    margin-top: -32px;

     top: inherit;

	 bottom:2%;

    opacity: 1;

	left:0;

	right:0;

	margin:0 auto;

}

#pp-nav li, .pp-slidesNav li {

    display: inline-block;

    width: 12px;

    height: 12px;

    margin: 16px 8px 16px 8px;

    position: relative;

}

    /* About */

    .about h2 {

 font-size: 26px;

}

 .feature-item p {

 font-size: 16px;

}

 .feature-item {

 padding: 20px 0;

}

 .feature-item > i.f-icon {

 margin: 0 auto;

}

 .about .box h2 {

 font-size: 26px;

}

 .team-box {

 height: auto;

}



    /* Team */

    .team h2 {

 font-size: 26px;

}



    /* Portfolio */

    .main-heading h2 {

 font-size: 26px;

}

 .parallax-box {

 padding: 10px;

}

 .parallax-box h2 {

 font-size: 1.375rem;

}

 .circle {

 display: none;

}

 .single-work {

 padding: 10px;

}



    /* Blog */

    .news-item {

 padding: 20px 0;

}

 .icon-quotes-left {

 text-align: left;

}

 .news-item .news-text-box {

 text-align: center;

}

 .para {

 font-size: 14px;

}

 .testimonial-img {

 margin: 15px 0 0 0;

}



    /* Contact */

    .contact-sec .heading {

 font-size: 26px;

}

 .contact-sec .contact-details {

 margin: 40px auto 0 auto;

}

 .contact-sec .contact-details .text {

 font-size: 14px;

}

 .contact-sec .contact-form {

 width: 100%;

 margin-left: 0;

}

 .contact-sec .contact-details {

 width: 100%;

 margin-left: 0;

 margin-top:0px;

}

 .contact-sec .contact-details ul li:first-child {

 width: 100%;

}

 .contact-sec .contact-details ul li {

 display: block;

 margin-bottom: 30px;

}

 .contact-sec .contact-details ul li i {

 margin-right: 0;

 margin-bottom: 15px;

 display: block;

}

}

 @media (max-width: 575.98px) {

 .h1, h1 {

 font-size: 30px;

}

 p {

 font-size: 12px;

 line-height: 18px;

}

 .btn.btn-medium {

 font-size: 11px;

    border-radius: 0 !important;

    padding: 5px;

}

    /* Banner */

    .slider-area h1, .headings h1 {

 font-size: 30px;

}

 .slider-area h1 span, .headings h1 span {

 font-size: 45px;

 display:block

}

 .slider-area p {

 font-size: 12px;

}

.headings h1 { padding-top:100px;}

.headings p {

    font-size: 12px;

    font-weight: normal;

}

    /* About */

    .about h2 {

 font-size: 22px;

}

.section-heading {

    margin-bottom: 0rem;

}

 .feature-item p {

 font-size: 14px;

 line-height:1.5

}

 .about .box h2 {

 font-size: 22px;

}

    /* Team */

    .team h2 {

 font-size: 22px;

}

    /* Portfolio */

    .main-heading h2 {

 font-size: 22px;

}

    /* Contact */

    .contact-sec .heading {

 font-size: 16px;

}

 .contact-sec .contact-details .heading {

 font-size: 24px;

}

.news-item .news-title {

    margin: 14px 0;

    font-size: 14px;

	line-height:1.4;

    font-weight: bold;

     

}

}