/************************1. Default css***********************/

body {
	color: #000000!important;
	background-color: #000000!important;
	font: 400 14px/22px'Montserrat', sans-serif;
}

html {
	scroll-behavior: smooth;
}

h1,
h3,
h4,
h5,
h6 {
	color: #000000;
}

h1 {
	font-size: 48px;
	line-height: 44px;
	font-weight: 900;
}

h2 {
	font-size: 48px;
	line-height: 44px;
	color: #f78d2b;
}

h3 {
	color: #000000;
	font-size: 30px;
}

h4 {
	font-size: 24px;
}

h5 {
	font-size: 20px;
}

h5 {
	font-size: 16px;
}

p {
	font-family:  "Nunito Sans", sans-serif;
	color: #999999;
	font-size: 14px;
	letter-spacing: 0.5px;
	text-rendering: optimizeLegibility;
}

a {
	color: #999999;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
	text-decoration: none !important;
	font-family:  "Nunito Sans", sans-serif;
	outline: none;
}

img {
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	-ms-transition: 0.4s ease-in-out;
	-o-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
	display: inline-block !important;
}

ul {
	margin-bottom: 0px;
}

li {
	list-style: none;
}

a:hover {
	color: #f78d2b;
}

span {
	color: #999999;
	font-size: 14px;
}

#wrap {
	overflow: hidden;
	position: relative;
}

.container-fluid {
	padding: 0;
}

.form-control:focus {
	border: none;
	outline: 0;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}

.margin-top {
	margin-top: 110px;
}

.padding {
	padding: 80px 0;
}

.sticky {
	position: fixed;
	top: 0;
	width: 100%
}

.btn.focus,
.btn:focus {
	background-color: #000000;
	border: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	outline: none;
}

.pr_padding {
	padding: 100px 0;
}

.pr_mtop_40 {
	margin-top: 40px;
}

.pr_mtop_100 {
	margin-top: 100px;
}

.font_weight_6 {
	font-weight: 600;
}

.font_weight_5 {
	font-weight: 500;
} 
       
.font_weight_3 {
	font-weight: 300;
}



/************************ loader ***********************/


.loader-container { 
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	/* Align to the center */
	justify-content: center;
	background-color: #000000;
	opacity: 1;
	transition: opacity 700ms ease-in-out;
}

@media(min-width:700px){
	.loader {
		width: 100px;
		height: auto;
		overflow: hidden;
		animation: zoomAndFade 1.5s ease-in-out;
	}
}

@media(max-width:500px){
	.loader {
		width: 100px;
		height: auto;
		overflow: hidden;
		animation: zoomAndFade2 2s ease-in-out;
	}
}
.loader img {
	width: 100%;
	height: auto;
	object-fit: cover;
}

.logo-text{
	color: #ffff;
	font-weight: 700;
}

.logo-text::first-letter{
	color: #f78d2b;
}


@media (min-width:600px){
	.hero--section{
		display: grid;
		grid-template-columns: repeat(3,1fr);
	}
	
	.hero--section>:first-child{
			position: relative;
			bottom: 0;
			transform: translateY(30%);
	}
	
	.hero--section>:nth-child(2){
		grid-column: 2/4;
		
	}

	.carousel-video{
		object-fit: cover;
		height: 100%;
		width: 100%;
		border-radius: 1rem;
	}

	.carousel-section{
		width: 1200px;
		/* height: 100%; */
		margin-inline: auto;
	}
}

@media (max-width:500px){

	#Home{
		padding: 140px 0px 0px!important;
	}
	.navbar-nav li::after{
		display: none;
	}
	
	.hero--section>:nth-child(2){
		
		
	}

	.tr-contentDesc{
		padding: 0!important;
	}

	.footer-bottom h2{
		font-size: 1.5rem !important;
	}

	.footer-bottom .tr-contentDesc{
		font-size: .8rem !important;
	}

	.Footer-copylink  span{
		font-size: .8rem !important;
	}

	.about.fix > h1{
		font-size: 1.8rem;
	} 

	.tr-contentDesc{
		padding: 0;
	}

	.carousel-section{
		padding-inline: 1rem;
	}

	.carousel-video{
		object-fit: cover;
		height: 250px;
		width: 100%;
		border-radius: 1rem;
	}

	.siider-content h1{
		text-align: center!important;
		padding-right: 0!important;
	}

	.siider-content p{
		text-align: center!important;
		padding-inline: 2rem!important;
	}

	.contact_box{
		margin:0 5px 15px 5px !important;
	}
}


@keyframes zoomAndFade {
	0% {
		width: 100px;
		height: 100px;
		transform: scale(1) translateY(0);
		opacity: 1;
	}

	100% {
		width: 100vw;
		height: 500vh;
		transform: scale(1) translateY(0);
		opacity: 0;
		margin-top: 170%;
	}
}

@keyframes zoomAndFade2 {
	0% {
		width: 100px;
		height: 100px;
		/* transform: scale(1) translateY(0); */
		opacity: 1;
	}

	100% {
		position:absolute;
		z-index: 1000;
		width: 100%;
		height: 100%;
		transform: scale(1) translateY(0);
		opacity: 0;
	}
}


/* 
#landing-page {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	display: none;
	background-color: #ffffff;
} */














.btn {
	background: #f78d2b;
	display: inline-block;
	font-size: 16px;
	text-transform: capitalize;
	padding: 10px 30px;
	font-weight: normal;
	border-radius: 0px;
	color: #fff;
	position: relative;
	overflow: hidden;
	border: none;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}

.btn:hover {
	color: #fff;
	background: #000000;
}

/************************ 3. Preloader ***********************/

.preloader {
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0;
	bottom: 0;
	background: #fff;
	z-index: 800;
	text-align: center;
	overflow: hidden;
	display: flex;
}

.main-circle {
	width: 80px;
	height: 80px;
	/* border: 3px solid #ffffff;
	border-top: 3px solid transparent;
	border-right: 3px solid transparent; */
	position: relative;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	left: 0;
	right: 0;
	margin: auto;
	top: 0;
	bottom: 0;
	-webkit-animation: zoom 2s infinite;
	-moz-animation: zoom 2s infinite;
	-ms-animation: zoom 2s infinite;
	-o-animation: zoom 2s infinite;
	animation: zoom 2s infinite;
}

.second-circle {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 60px;
	height: 60px;
	border: 3px solid #ffffff;
	border-top: 3px solid transparent;
	border-right: 3px solid transparent;
	transform: rotate(-20deg);
	-webkit-transform: rotate(-20deg);
	-moz-transform: rotate(-20deg);
	-ms-transform: rotate(-20deg);
	-o-transform: rotate(-20deg);
	border-radius: 50%;
	position: relative;
	-webkit-animation: rotate 2s infinite .4s;
	-moz-animation: rotate 2s infinite .4s;
	-ms-animation: rotate 2s infinite .4s;
	-o-animation: rotate 2s infinite .4s;
	animation: rotate 2s infinite .4s;
}

.third-circle {
	width: 40px;
	height: 40px;
	border: 3px solid #ffffff;
	border-top: 3px solid transparent;
	border-right: 3px solid transparent;
	-webkit-transform: rotate(-20deg);
	-moz-transform: rotate(-20deg);
	-ms-transform: rotate(-20deg);
	-o-transform: rotate(-20deg);
	transform: rotate(-20deg);
	border-radius: 50%;
	-webkit-animation: rotate 2s infinite .6s;
	-moz-animation: rotate 2s infinite .6s;
	-ms-animation: rotate 2s infinite .6s;
	-o-animation: rotate 2s infinite .6s;
	animation: rotate 2s infinite .6s;
}

@keyframes rotate {
	from {}

	to {
		-webkit-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}


/************************ 4. Animation ***********************/

@-moz-keyframes preloader {
	17% {
		border-bottom-right-radius: 3px;
	}

	25% {
		-moz-transform: translateY(9px) rotate(22.5deg);
		transform: translateY(9px) rotate(22.5deg);
	}

	50% {
		-moz-transform: scale(1, 0.9) translateY(18px) rotate(45deg);
		transform: scale(1, 0.9) translateY(18px) rotate(45deg);
		border-bottom-right-radius: 40px;
	}

	75% {
		-moz-transform: translateY(9px) rotate(67.5deg);
		transform: translateY(9px) rotate(67.5deg);
	}

	100% {
		-moz-transform: translateY(0) rotate(90deg);
		transform: translateY(0) rotate(90deg);
	}
}

@-webkit-keyframes preloader {
	17% {
		border-bottom-right-radius: 3px;
	}

	25% {
		-webkit-transform: translateY(9px) rotate(22.5deg);
		transform: translateY(9px) rotate(22.5deg);
	}

	50% {
		-webkit-transform: scale(1, 0.9) translateY(18px) rotate(45deg);
		transform: scale(1, 0.9) translateY(18px) rotate(45deg);
		border-bottom-right-radius: 40px;
	}

	75% {
		-webkit-transform: translateY(9px) rotate(67.5deg);
		transform: translateY(9px) rotate(67.5deg);
	}

	100% {
		-webkit-transform: translateY(0) rotate(90deg);
		transform: translateY(0) rotate(90deg);
	}
}

@keyframes preloader {
	17% {
		border-bottom-right-radius: 3px;
	}

	25% {
		-moz-transform: translateY(9px) rotate(22.5deg);
		-ms-transform: translateY(9px) rotate(22.5deg);
		-webkit-transform: translateY(9px) rotate(22.5deg);
		transform: translateY(9px) rotate(22.5deg);
	}

	50% {
		-moz-transform: scale(1, 0.9) translateY(18px) rotate(45deg);
		-ms-transform: scale(1, 0.9) translateY(18px) rotate(45deg);
		-webkit-transform: scale(1, 0.9) translateY(18px) rotate(45deg);
		transform: scale(1, 0.9) translateY(18px) rotate(45deg);
		border-bottom-right-radius: 40px;
	}

	75% {
		-moz-transform: translateY(9px) rotate(67.5deg);
		-ms-transform: translateY(9px) rotate(67.5deg);
		-webkit-transform: translateY(9px) rotate(67.5deg);
		transform: translateY(9px) rotate(67.5deg);
	}

	100% {
		-moz-transform: translateY(0) rotate(90deg);
		-ms-transform: translateY(0) rotate(90deg);
		-webkit-transform: translateY(0) rotate(90deg);
		transform: translateY(0) rotate(90deg);
	}
}

@-moz-keyframes preloader-shadow {
	50% {
		-moz-transform: scale(1.2, 1);
		transform: scale(1.2, 1);
	}
}

@-webkit-keyframes preloader-shadow {
	50% {
		-webkit-transform: scale(1.2, 1);
		transform: scale(1.2, 1);
	}
}

@keyframes preloader-shadow {
	50% {
		-moz-transform: scale(1.2, 1);
		-ms-transform: scale(1.2, 1);
		-webkit-transform: scale(1.2, 1);
		transform: scale(1.2, 1);
	}
}

@keyframes shadow-pulse {
	0% {
		box-shadow: 0 0 0 0px hsla(255, 255%, 255%, 0.4);
	}

	100% {
		box-shadow: 0 0 0 15px rgba(255, 255, 255, 0.01);
	}
}

@-webkit-keyframes shadow-pulse {

	0% {
		-webkit-box-shadow: 0 0 0 0px hsla(255, 255%, 255%, 0.4);
		box-shadow: 0 0 0 0px hsla(255, 255%, 255%, 0.4);
	}

	100% {
		-webkit-box-shadow: 0 0 0 15px rgba(255, 255, 255, 0.01);
		box-shadow: 0 0 0 15px rgba(255, 255, 255, 0.01);
	}
}

@-o-keyframes shadow-pulse {
	0% {
		-webkit-box-shadow: 0 0 0 0px hsla(255, 255%, 255%, 0.4);
		box-shadow: 0 0 0 0px hsla(255, 255%, 255%, 0.4);
	}

	100% {
		-webkit-box-shadow: 0 0 0 15px rgba(255, 255, 255, 0.01);
		box-shadow: 0 0 0 15px rgba(255, 255, 255, 0.01);
	}
}

@keyframes shadow-pulse {
	0% {
		-webkit-box-shadow: 0 0 0 0px hsla(255, 255%, 255%, 0.4);
		box-shadow: 0 0 0 0px hsla(255, 255%, 255%, 0.4);
	}

	100% {
		-webkit-box-shadow: 0 0 0 15px rgba(255, 255, 255, 0.01);
		box-shadow: 0 0 0 15px rgba(255, 255, 255, 0.01);
	}
}


/*Fade*/

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


/*scale*/



@-webkit-keyframes scale {
	50% {
		-webkit-transform: scale(1.04) translateY(5px);
		-moz-transform: scale(1.04) translateY(5px);
		-ms-transform: scale(1.04) translateY(5px);
		-o-transform: scale(1.04) translateY(5px);
		transform: scale(1.04) translateY(5px);
	}
}


@-o-keyframes scale {
	50% {
		-webkit-transform: scale(1.04) translateY(5px);
		-moz-transform: scale(1.04) translateY(5px);
		-ms-transform: scale(1.04) translateY(5px);
		-o-transform: scale(1.04) translateY(5px);
		transform: scale(1.04) translateY(5px);
	}
}


@keyframes scale {
	50% {
		-webkit-transform: scale(1.04) translateY(5px);
		-moz-transform: scale(1.04) translateY(5px);
		-ms-transform: scale(1.04) translateY(5px);
		-o-transform: scale(1.04) translateY(5px);
		transform: scale(1.04) translateY(5px);
	}
}


/*scrolltop*/
@keyframes scrolltop {
	0% {
		box-shadow: 0 0 0 0px hsla(247, 41%, 39%, 0.6);
	}

	100% {
		box-shadow: 0 0 0 15px rgba(67, 58, 139, 0.01);
	}
}

@-webkit-keyframes scrolltop {

	0% {
		-webkit-box-shadow: 0 0 0 0px hsla(247, 41%, 39%, 0.6);
		box-shadow: 0 0 0 0px hsla(247, 41%, 39%, 0.6);
	}

	100% {
		-webkit-box-shadow: 0 0 0 15px rgba(67, 58, 139, 0.01);
		box-shadow: 0 0 0 15px rgba(67, 58, 139, 0.01);
	}
}

@-o-keyframes scrolltop {
	0% {
		-webkit-box-shadow: 0 0 0 0px hsla(247, 41%, 39%, 0.6);
		box-shadow: 0 0 0 0px hsla(247, 41%, 39%, 0.6);
	}

	100% {
		-webkit-box-shadow: 0 0 0 15px rgba(67, 58, 139, 0.01);
		box-shadow: 0 0 0 15px rgba(67, 58, 139, 0.01);
	}
}

@keyframes scrolltop {
	0% {
		-webkit-box-shadow: 0 0 0 0px hsla(247, 41%, 39%, 0.6);
		box-shadow: 0 0 0 0px hsla(247, 41%, 39%, 0.6);
	}

	100% {
		-webkit-box-shadow: 0 0 0 15px rgba(67, 58, 139, 0.01);
		box-shadow: 0 0 0 15px rgba(67, 58, 139, 0.01);
	}
}





.bal-container {
	position: relative;
	width: 100%;
	height: 100%;
	cursor: grab;
	overflow: hidden;
}

.bal-after {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.bal-before {
	display: block;
	position: absolute;
	top: 0;
	/* right: 0; */
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 15;
	overflow: hidden;
}

.bal-before-inset {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
}

.bal-after img,
.bal-before img {
	object-fit: cover;
	position: absolute;
	width: 100%;
	height: 100%;
	object-position: 50% 50%;
	top: 0;
	bottom: 0;
	left: 0;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
}

.bal-beforePosition {
	background: #121212;
	color: #fff;
	left: 0;
	pointer-events: none;
	border-radius: 0.2rem;
	padding: 2px 10px;
}

.bal-afterPosition {
	background: #121212;
	color: #fff;
	right: 0;
	pointer-events: none;
	border-radius: 0.2rem;
	padding: 2px 10px;
}

.beforeLabel {
	position: absolute;
	bottom: 0;
	margin: 1rem;
	font-size: 1em;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
}

.afterLabel {
	position: absolute;
	bottom: 0;
	margin: 1rem;
	font-size: 1em;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
}

/************************ 5. Background Shape Image css ***********************/

.shape-image-one img {
	position: absolute;
	top: -5px;
	left: 0;
	z-index: -1;
	-webkit-animation: scale 3s linear infinite;
	-moz-animation: scale 3s linear infinite;
	-ms-animation: scale 3s linear infinite;
	-o-animation: scale 3s linear infinite;
	animation: scale 3s linear infinite;
}

.shape-image-two img {
	position: absolute;
	top: -17%;
	left: 7%;
	z-index: -1;
}

.shape-image-three img {
	position: absolute;
	top: 20px;
	z-index: -1;
	right: 8%;
}

.shape-image-four img {
	position: absolute;
	bottom: -100px;
	z-index: -1;
	right: 0;
	-webkit-animation: scale 3s linear infinite;
	-moz-animation: scale 3s linear infinite;
	-ms-animation: scale 3s linear infinite;
	-o-animation: scale 3s linear infinite;
	animation: scale 3s linear infinite;
}

.shape-image-five img {
	position: absolute;
	top: -50%;
	z-index: -1;
	left: 0;
}

.shape-image-six img {
	position: absolute;
	top: -10%;
	z-index: -1;
	right: -15%;
}

.shape-image-seven img {
	position: absolute;
	top: 20px;
	z-index: -1;
	left: 55px;
}

.shape-image-eight img {
	position: absolute;
	bottom: 0;
	z-index: -1;
	left: 5%;
	-webkit-transform: scale(0.89);
	-moz-transform: scale(0.89);
	-ms-transform: scale(0.89);
	-o-transform: scale(0.89);
	transform: scale(0.89);
}

.footershape-image-1 img {
	position: absolute;
	top: -40px;
	z-index: -1;
	left: 6%;
	-webkit-animation: scale 3s linear infinite;
	-moz-animation: scale 3s linear infinite;
	-ms-animation: scale 3s linear infinite;
	-o-animation: scale 3s linear infinite;
	animation: scale 3s linear infinite;
}

.footershape-image-3 img {
	position: absolute;
	bottom: -70px;
	z-index: -1;
	right: -60px;
	-webkit-animation: scale 3s linear infinite;
	-moz-animation: scale 3s linear infinite;
	-ms-animation: scale 3s linear infinite;
	-o-animation: scale 3s linear infinite;
	animation: scale 3s linear infinite;
}

/************************ 6. Backgeound-parralex image css ***********************/
.parallax {
	background-repeat: no-repeat;
	/* background-attachment: fixed; */
}

/* .parallax-image-1 {
	background-image: url(../images/background-shape/round3.svg);
} */

/* .parallax-image-2 {
	background-image: url(../images/background-shape/aboutj.png);
	background-size: cover;
} */

.parallax-image-3 {
	background-attachment: scroll;
	background-image: url(../images/background-shape/round3.svg) no-repeat right right;

}







.article-container {
	width: 100%;
	height: 80vh;
	margin-top:10rem

}

.article-img-holder {
	width: 100%;
	height: 100%;
	background: url(../images/background-shape/aboutj.png);
	background-position: bottom;
	background-size: cover;
	background-repeat: no-repeat;
	transition: all 1s;
}

.article-title-link {
	position: absolute;
	bottom: 0;
	padding: 0px;
	text-decoration: none;
}

.article-title-link:hover {
	text-decoration: underline;
}


.zoom-in-zoom-out {
	margin: 24px;
	width: 50px;
	height: 50px;
	animation: zoom-in-zoom-out 2s ease-out infinite;
}

@keyframes zoom-in-zoom-out {
	0% {
		transform: scale(1, 1);
	}

	50% {
		transform: scale(1.5, 1.5);
	}

	100% {
		transform: scale(1, 1);
	}
}

/* .parallax-image-4 {
	background-attachment: inherit;
	background-position: bottom;
	background-image: url(../images/background-shape/round2.svg);
} */

/* .parallax-image-5 {
	background-position: right;
	background-image: url(../images/background-shape/round1.svg);
} */





/* ///// inputs /////*/

input:focus~label,
textarea:focus~label,
input:valid~label,
textarea:valid~label {
	font-size: 0.75em;
	color: #999;
	top: -5px;
	-webkit-transition: all 0.225s ease;
	transition: all 0.225s ease;
}

.styled-input {
	float: left;
	width: 293px;
	margin: 1rem 0;
	position: relative;
	border-radius: 4px;
}

@media only screen and (max-width: 768px) {
	.styled-input {
		width: 100%;
	}
}

.styled-input label {
	color: #999;
	padding: 1.3rem 30px 1rem 30px;
	position: absolute;
	top: 10px;
	left: 0;
	-webkit-transition: all 0.25s ease;
	transition: all 0.25s ease;
	pointer-events: none;
}

.styled-input.wide {
	width: 650px;
	max-width: 100%;
}

input,
textarea {
	padding: 30px;
	border: 0;
	width: 100%;
	font-size: 1rem;
	background-color: #2d2d2d;
	color: white;
	border-radius: 4px;
}

input:focus,
textarea:focus {
	outline: 0;
}

input:focus~span,
textarea:focus~span {
	width: 100%;
	-webkit-transition: all 0.075s ease;
	transition: all 0.075s ease;
}

textarea {
	width: 100%;
	min-height: 15em;
}

.input-container {
	width: 650px;
	max-width: 100%;
	margin: 20px auto 25px auto;
}

.submit-btn {
	float: right;
	padding: 7px 35px;
	border-radius: 60px;
	display: inline-block;
	background-color: #4b8cfb;
	color: white;
	font-size: 18px;
	cursor: pointer;
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.06),
		0 2px 10px 0 rgba(0, 0, 0, 0.07);
	-webkit-transition: all 300ms ease;
	transition: all 300ms ease;
}

.submit-btn:hover {
	transform: translateY(1px);
	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.10),
		0 1px 1px 0 rgba(0, 0, 0, 0.09);
}

@media (max-width: 768px) {
	.submit-btn {
		width: 100%;
		float: none;
		text-align: center;
	}
}

input[type=checkbox]+label {
	color: #ccc;
	font-style: italic;
}

input[type=checkbox]:checked+label {
	color: #f00;
	font-style: normal;
}














/************************ 7. Slick slider nav css ***********************/

.slick-prev,
.slick-next {
	height: 40px;
	width: 40px;
	line-height: 40px;
	margin: 0 10px;
	background-color: transparent;
	text-align: center;
	border: 2px solid rgb(153, 153, 153);
}

.slick-prev:hover,
.slick-next:hover,
.slick-prev:focus,
.slick-next:focus {
	background-color: #f78d2b;
	border-radius: 0px;
	border: 2px solid #f78d2b;
}



.slick-prev:before,
.slick-next:before {
	font-family: "Font Awesome 5 Free";
	font-weight: 600;
	font-size: 18px;
	color: #999999;
	line-height: 36px;
}

.slick-prev:before {
	content: "\f060";
}

.slick-next:before {
	content: "\f061";
}

.slick-prev:hover:before,
.slick-next:hover:before,
.slick-prev:focus:before,
.slick-next:focus:before {
	color: #ffffff;
}

/************************ 8. Header ***********************/

.header {
	padding: 30px 0;
	position: absolute;
	width: 100%;
	top: 0;
	background: transparent;
	z-index: 99;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}

.header.sticky {
	padding: 15px 0;
	position: fixed;
	top: 0;
	/* background-color: #f6f6f64b; */
	-webkit-box-shadow: 3px 3px 25px 0px rgba(1, 2, 2, 0.06);
	-moz-box-shadow: 3px 3px 25px 0px rgba(1, 2, 2, 0.06);
	box-shadow: 3px 3px 25px 0px rgba(1, 2, 2, 0.06);
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
	-webkit-animation-name: animationFade;
	-o-animation-name: animationFade;
	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;
}

.header .logo {
	float: left;
}

.logo img {
	float: left;
	width: 170px;
}

.loading {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	border: 0px solid #764237;
	border-radius: 50%;
	animation: zoom 1s linear infinite alternate-reverse;
}

@keyframes zoom {
	0% {
		width: 100%;
		height: 100%;
		border-color: rgba(118, 66, 55, 1);
	}

	25% {
		width: 100%;
		height: 100%;
		border-color: rgba(118, 66, 55, 0.8);
	}

	50% {
		width: 100%;
		height: 100%;
		border-color: rgba(118, 66, 55, 0.6);
	}

	75% {
		width: 100%;
		height: 100%;
		border-color: rgba(118, 66, 55, 0.5);
	}

	100% {
		width: 100%;
		height: 100%;
		border-color: rgba(118, 66, 55, 0.4);
	}
}


.entry-title {
	background: linear-gradient(to right, rgba(255, 255, 255, 0) 50%, #16a085 50%);
	background-size: 200%;
	background-position: 0 0;
	display: inline;
	transition: 0.5s ease-in-out;
	font-family: raleway, arial, sans-serif;
	text-transform: uppercase;
}

.entry-title a {
	color: white;
	text-decoration: none;
}

small {
	margin-top: 20px;
	display: block;
	font-family: raleway, arial, sans-serif;
	color: white;
	text-transform: uppercase;
}

small a {
	font-weight: 700;
	color: white;
	text-decoration: none;
}

span {
	display: block;
	margin-top: 10px;
	font-family: raleway, arial, sans-serif;
	font-weight: 700;
	color: #16a085;
}

span a {
	color: white;
}

.iklan {
	position: fixed;
	bottom: 0;
	right: 0;
	z-index: 99999999;
	box-shadow: 0 3px 10px rgba(0, 0, 0, .3);

	background: rgba(255, 255, 255, 0.351);
	border-radius: 20px;
	width: auto;
	margin-bottom: 5%;
}

.videoBox {
	width: auto;
	height: auto;
	padding: 5px;
	margin: 0px;
	border-radius: 20px;
}

.videoBox video {
	width: 250px;
	height: auto;
	border-radius: 20px;
}

.feedback-input {

	font-family: Helvetica, Arial, sans-serif;
	font-weight: 500;
	font-size: 18px;
	border-radius: 20px;
	line-height: 22px;
	background-color: transparent;
	border: 2px solid #f78d2b;
	transition: all 0.3s;
	padding: 13px;
	margin-bottom: 15px;
	width: 100%;
	box-sizing: border-box;
	outline: 0;
}

.feedback-input:focus {
	border: 2px solid #f78d2b;
}

textarea {
	height: 150px !important;
	line-height: 100%;
	min-height: 200px;
	resize: vertical;
}




[type="submit"] {
	font-family:  "Nunito Sans", sans-serif;
	width: 100%;
	background: #f78d2b;
	border-radius: 55px;
	border: 0;
	cursor: pointer;
	color: white;
	font-size: 24px;
	padding-top: 10px;
	padding-bottom: 10px;
	transition: all 0.3s;
	margin-top: -4px;
	font-weight: 700;
}

[type="submit"]:hover {
	background: #f78d2b;
}

























.listnone::after {
	height: 0px !important;
	width: 0px !important;


}


.navbar-nav li::after {
	content: "";
	position: absolute;
	top: 50%;
	left: -45px;
	height: 1px;
	width: 90px;
	/* Adjust the width of the line */
	background-color: #fff;
	/* Adjust the color of the line */
	transform: translateY(-50%);
}


.header.sticky {

	.tr-nabar-collapse .navbar-nav {
		align-self: baseline;
		color: #000;
		/* border: solid 4px #f78d2b; */
		padding: 16px;
		width: 100%;
		/* border: solid 4px #fff; */
		/* background: #f78d2b; */

		/* margin-left: 50px; */
		/* background-color: #f78e2b00; */
		border-radius: 20px;

	}



	.tr-nav-item .nav-link {
		padding: 0 10px 0px !important;
		color: #fff;
		font-weight: 800;
		z-index: 3;

		font-size: 18px;
		position: relative;
	}

	.tr-nav-item:after {
		position: absolute;
		left: 0px;
		bottom: 30px;
		height: 0px;
		width: 100%;
		background: #ffb1684d;
		content: "";
		border-radius: 16px;
		-webkit-transition: 0.2s ease-in-out;
		-moz-transition: 0.2s ease-in-out;
		-ms-transition: 0.2s ease-in-out;
		-o-transition: 0.2s ease-in-out;
		transition: 0.2s ease-in-out;
	}

	.tr-nav-item .nav-link:hover {
		color: #fff !important;
	}

	.navbar-nav li {
		display: inline-block;
		position: relative;
		margin: 0px;
	}

	.navbar-nav li::after {
		content: "";
		position: absolute;
		top: 50%;
		left: -45px;
		height: 1px;
		width: 90px;
		/* Adjust the width of the line */
		background-color: #fff;
		/* Adjust the color of the line */
		transform: translateY(-50%);
	}

	/* Remove the line from the last list item */
	.navbar-nav li:last-child::after {
		display: none;
	}
}


.tr-nav-item .nav-link {
	padding: 0 10px 0px !important;
	margin: 0 55px;
	color: #fff;
	font-weight: 800;
	z-index: 3;

	font-size: 18px;
	position: relative;


}

.tr-nav-item:after {
	position: absolute;
	left: 0px;
	bottom: 31px;
	height: 0px;
	width: 100%;
	background: #e8e8e8;
	content: "";
	border-radius: 16px;
	-webkit-transition: 0.2s ease-in-out;
	-moz-transition: 0.2s ease-in-out;
	-ms-transition: 0.2s ease-in-out;
	-o-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}

.navbar-nav li {
	display: inline-block;
	position: relative;
	margin-right: 0px;
}

.navbar-nav li::after {
	content: "";
	position: absolute;
	top: 50%;
	left: -45px;
	height: 1px;
	width: 90px;
	/* Adjust the width of the line */
	background-color: #fff;
	/* Adjust the color of the line */
	transform: translateY(-50%);
}

/* Remove the line from the last list item */
.navbar-nav li:last-child::after {
	display: none;
}

/* 
.tr-nav-item .nav-link:after {
	position: absolute;
	left: 110px;
	bottom: 10px;
	height: 3px;
	width: 100%;
	background: #fff;
	content: "";
	opacity: 0;
	border-radius: 16px;
	-webkit-transition: 0.2s ease-in-out;
	-moz-transition: 0.2s ease-in-out;
	-ms-transition: 0.2s ease-in-out;
	-o-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
} */

.tr-nav-item .nav-link.active:after,
.tr-nav-item .nav-link:hover:after {
	width: 100%;
	opacity: 1;
	-webkit-transition: 0.2s ease-in-out;
	-moz-transition: 0.2s ease-in-out;
	-ms-transition: 0.2s ease-in-out;
	-o-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}

.tr-nav-item .nav-link:hover {
	color: #f78e2b !important;
}

.tr-nabar-collapse .navbar-nav {
	align-self: baseline;
	color: #fff;
	/* border: solid 4px #fff; */
	padding: 16px;
	width: 100%;
	/* border: solid 4px #fff; */
	/* background: #ffffff3a; */

	/* margin-left: 50px; */
	/* background-color: #f78e2b00; */
	border-radius: 20px;

}

.navbar-nav .nav-link.active{
	color: #fff !important;
}

.btn_center {
	display: inline-block !important;
	text-align: center;
	margin: auto;
	float: none;
	text-align: center;
	width: 100%;
	position: relative;
	top: -25px;
	z-index: 100;

}


.btn_submit {
	display: inline-block !important;
	text-align: center;
	margin: auto;
	float: none;
	text-align: center;
	width: 100%;
	position: relative;
	top: 5px;
}

.header-button .btn {
	padding: 13px 30px;
	color: #ffffff;
	background-color: transparent;
	min-width: 200px;
	text-align: center;
	border-radius: 55px;
	border: solid 3px #ffffff;
	font-weight: 500;
}

.header-button .btn:hover {
	background-color: #f78d2b;
	color: #ffffff;
}

.header-button2 .btn{
padding: 13px 30px;
color: #000;
background-color: #fff;
min-width: 200px;
text-align: center;
border-radius: 55px;
border: solid 3px #ffffff;
font-weight: 500;
}

.header-button2 .btn:hover {
border: solid 3px #f78d2b;
background-color: #fff;
/* color: #ffffff; */
}

/************************ TAB ***********************/




.bg-color {
	transition-duration: 0.5s;
	box-shadow: 0 3px 10px rgba(0, 0, 0, .3);

}

.text-color {
	transition-duration: 0.5s;
}


.tabs {
	display: table;
	table-layout: fixed;
	width: auto;
	margin: auto;
	text-align: center;
	margin-bottom: 20px;
	border-spacing: 10px;
	-webkit-transform: translateY(5px);
	transform: translateY(5px);
}

/* .tabs {
		display: table;
		table-layout: fixed;
	width: 100%; 
margin-bottom: 20px;

-webkit-transform: translateY(5px);
transform: translateY(5px);
}

*/
.tabs>li {
	transition-duration: 0.25s;
	display: table-cell;
	list-style: none;
	text-align: center;
	padding: 10px 20px 10px 20px;
	position: relative;
	overflow: hidden;
	cursor: pointer;
	border: solid 1px #fff;
	font-size: larger;
	background-color: #f0f0f0;
	border-radius: 35px;
	color: rgb(88, 88, 88);

}

.tabs>li:before {
	z-index: -1;
	position: absolute;
	content: "";
	width: 100%;
	height: 120%;
	top: 0;
	left: 0;
	background-color: rgba(255, 255, 255, 0.3);
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	transition-duration: 0.25s;
	border-radius: 5px 5px 0 0;
}

.tabs>li:hover:before {
	-webkit-transform: translateY(70%);
	transform: translateY(70%);
}

.tabs>li.active {
	color: #fff;
	font-size: larger;
	background-color: #f78e2b;

}

.tabs>li.active:before {
	transition-duration: 0.5s;
	background-color: white;
	-webkit-transform: translateY(0);
	transform: translateY(0);
}

.tab__content {
	background-color: rgba(255, 255, 255, 0);
	position: relative;
	width: 100%;
	/* box-shadow: 0 3px 10px rgba(0, 0, 0, .3); */

	border-radius: 5px;
}

.tab__content>li {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	display: none;
	list-style: none;
}

.tab__content>li .content__wrapper {
	text-align: center;
	border-radius: 5px;
	width: 100%;
	padding: 5px 4px 4px 4px;
	
}

.content__wrapper h2 {
	width: 100%;
	text-align: center;
	padding-bottom: 20px;
	font-weight: 300;
}

.content__wrapper img {
	width: 100%;
	height: auto;
	border-radius: 25px;
}

.colors {
	text-align: center;
	padding-top: 20px;
}

.colors>li {
	list-style: none;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	border-bottom: 5px solid rgba(0, 0, 0, 0.1);
	display: inline-block;
	margin: 0 10px;
	cursor: pointer;
	transition-duration: 0.2s;
	box-shadow: 0 2px 1px rgba(0, 0, 0, 0.2);
}

.colors>li:hover {
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
	border-bottom: 10px solid rgba(0, 0, 0, 0.15);
	box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
}

.colors>li.active-color {
	-webkit-transform: scale(1.2) translateY(-10px);
	transform: scale(1.2) translateY(-10px);
	box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
	border-bottom: 20px solid rgba(0, 0, 0, 0.15);
}

.colors>li:nth-child(1) {
	background-color: #2ecc71;
}

.colors>li:nth-child(2) {
	background-color: #d64a4b;
}

.colors>li:nth-child(3) {
	background-color: #8e44ad;
}

.colors>li:nth-child(4) {
	background-color: #46a1de;
}

.colors>li:nth-child(5) {
	background-color: #bdc3c7;
}






*,
*::before,
*::after {
	box-sizing: border-box;
}

img {
	display: block;
}

.gallery {
	position: relative;
	z-index: 2;
	padding: 10px;
	display: grid;
	/* flex-flow: row wrap; */
	grid-template-columns: repeat(3,1fr);
	justify-content: space-between;
	transition: all 0.5s ease-in-out;
	transform: translateZ(0);
}

@media (max-width:500px){
	.gallery{
		grid-template-columns: repeat(2,1fr);
	}
}

.gallery.pop {
	filter: blur(10px);
}

.gallery figure {
	flex-basis: 33.333%;
	padding: 10px;
	overflow: hidden;
	cursor: pointer;
}

.gallery figure img {
	width: 100%;
	transition: all 0.3s ease-in-out;
}

.gallery figure figcaption {
	display: none;
}



.popup {
	position: fixed;
	z-index: 2;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: #fff;
	opacity: 0;
	transition: opacity 0.5s ease-in-out 0.2s;
}


.popup.pop {
	opacity: 1;
	transition: opacity 0.2s ease-in-out 0s;
}

.popup.pop figure {
	margin-top: 0;
	opacity: 1;
}

.popup figure {
	position: absolute;
	top: 60%;
	left: 50%;
	transform: translate(-50%, -50%);
	transform-origin: 0 0;
	margin-top: 30px;
	opacity: 0;
	-webkit-animation: poppy 500ms linear both;
	animation: poppy 500ms linear both;
}

.popup figure img {
	position: relative;
	z-index: 2;
}

.popup figure figcaption {
	position: absolute;
	bottom: 50px;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.78));
	z-index: 2;
	width: 100%;
	padding: 100px 20px 20px 20px;
	color: #fff;
	font-family: "Open Sans", sans-serif;
	font-size: 32px;
}

.popup figure figcaption small {
	font-size: 11px;
	display: block;
	text-transform: uppercase;
	margin-top: 12px;
	text-indent: 3px;
	opacity: 0.7;
	letter-spacing: 1px;
}

.popup figure .shadow {
	position: relative;
	z-index: 1;
	top: -56px;
	margin: 0 auto;
	background-position: center bottom;
	background-repeat: no-repeat;
	width: 98%;
	height: 50px;
	opacity: 0.9;
	filter: blur(16px) contrast(1.5);
	transform: scale(0.95, -0.7);
	transform-origin: center bottom;
}

.popup .close {
	position: absolute;
	z-index: 3;
	top: 10px;
	right: 10px;
	width: 25px;
	height: 25px;
	cursor: pointer;
	background: url(#close);
	border-radius: 25px;
	background: rgba(0, 0, 0, 0.1);
	box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
}

.popup .close svg {
	width: 100%;
	height: 100%;
}

@-webkit-keyframes poppy {
	0% {
		transform: matrix3d(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}

	3.4% {
		transform: matrix3d(0.316, 0, 0, 0, 0, 0.407, 0, 0, 0, 0, 1, 0, -94.672, -91.573, 0, 1);
	}

	4.3% {
		transform: matrix3d(0.408, 0, 0, 0, 0, 0.54, 0, 0, 0, 0, 1, 0, -122.527, -121.509, 0, 1);
	}

	4.7% {
		transform: matrix3d(0.45, 0, 0, 0, 0, 0.599, 0, 0, 0, 0, 1, 0, -134.908, -134.843, 0, 1);
	}

	6.81% {
		transform: matrix3d(0.659, 0, 0, 0, 0, 0.893, 0, 0, 0, 0, 1, 0, -197.77, -200.879, 0, 1);
	}

	8.61% {
		transform: matrix3d(0.82, 0, 0, 0, 0, 1.097, 0, 0, 0, 0, 1, 0, -245.972, -246.757, 0, 1);
	}

	9.41% {
		transform: matrix3d(0.883, 0, 0, 0, 0, 1.168, 0, 0, 0, 0, 1, 0, -265.038, -262.804, 0, 1);
	}

	10.21% {
		transform: matrix3d(0.942, 0, 0, 0, 0, 1.226, 0, 0, 0, 0, 1, 0, -282.462, -275.93, 0, 1);
	}

	12.91% {
		transform: matrix3d(1.094, 0, 0, 0, 0, 1.328, 0, 0, 0, 0, 1, 0, -328.332, -298.813, 0, 1);
	}

	13.61% {
		transform: matrix3d(1.123, 0, 0, 0, 0, 1.332, 0, 0, 0, 0, 1, 0, -336.934, -299.783, 0, 1);
	}

	14.11% {
		transform: matrix3d(1.141, 0, 0, 0, 0, 1.331, 0, 0, 0, 0, 1, 0, -342.273, -299.395, 0, 1);
	}

	17.22% {
		transform: matrix3d(1.205, 0, 0, 0, 0, 1.252, 0, 0, 0, 0, 1, 0, -361.606, -281.592, 0, 1);
	}

	17.52% {
		transform: matrix3d(1.208, 0, 0, 0, 0, 1.239, 0, 0, 0, 0, 1, 0, -362.348, -278.88, 0, 1);
	}

	18.72% {
		transform: matrix3d(1.212, 0, 0, 0, 0, 1.187, 0, 0, 0, 0, 1, 0, -363.633, -267.15, 0, 1);
	}

	21.32% {
		transform: matrix3d(1.196, 0, 0, 0, 0, 1.069, 0, 0, 0, 0, 1, 0, -358.864, -240.617, 0, 1);
	}

	24.32% {
		transform: matrix3d(1.151, 0, 0, 0, 0, 0.96, 0, 0, 0, 0, 1, 0, -345.164, -216.073, 0, 1);
	}

	25.23% {
		transform: matrix3d(1.134, 0, 0, 0, 0, 0.938, 0, 0, 0, 0, 1, 0, -340.193, -210.948, 0, 1);
	}

	28.33% {
		transform: matrix3d(1.075, 0, 0, 0, 0, 0.898, 0, 0, 0, 0, 1, 0, -322.647, -202.048, 0, 1);
	}

	29.03% {
		transform: matrix3d(1.063, 0, 0, 0, 0, 0.897, 0, 0, 0, 0, 1, 0, -318.884, -201.771, 0, 1);
	}

	29.93% {
		transform: matrix3d(1.048, 0, 0, 0, 0, 0.899, 0, 0, 0, 0, 1, 0, -314.277, -202.202, 0, 1);
	}

	35.54% {
		transform: matrix3d(0.979, 0, 0, 0, 0, 0.962, 0, 0, 0, 0, 1, 0, -293.828, -216.499, 0, 1);
	}

	36.74% {
		transform: matrix3d(0.972, 0, 0, 0, 0, 0.979, 0, 0, 0, 0, 1, 0, -291.489, -220.242, 0, 1);
	}

	39.44% {
		transform: matrix3d(0.962, 0, 0, 0, 0, 1.01, 0, 0, 0, 0, 1, 0, -288.62, -227.228, 0, 1);
	}

	41.04% {
		transform: matrix3d(0.961, 0, 0, 0, 0, 1.022, 0, 0, 0, 0, 1, 0, -288.247, -229.999, 0, 1);
	}

	44.44% {
		transform: matrix3d(0.966, 0, 0, 0, 0, 1.032, 0, 0, 0, 0, 1, 0, -289.763, -232.215, 0, 1);
	}

	52.15% {
		transform: matrix3d(0.991, 0, 0, 0, 0, 1.006, 0, 0, 0, 0, 1, 0, -297.363, -226.449, 0, 1);
	}

	59.86% {
		transform: matrix3d(1.006, 0, 0, 0, 0, 0.99, 0, 0, 0, 0, 1, 0, -301.813, -222.759, 0, 1);
	}

	61.66% {
		transform: matrix3d(1.007, 0, 0, 0, 0, 0.991, 0, 0, 0, 0, 1, 0, -302.102, -222.926, 0, 1);
	}

	63.26% {
		transform: matrix3d(1.007, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, -302.171, -223.276, 0, 1);
	}

	75.28% {
		transform: matrix3d(1.001, 0, 0, 0, 0, 1.003, 0, 0, 0, 0, 1, 0, -300.341, -225.696, 0, 1);
	}

	83.98% {
		transform: matrix3d(0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -299.61, -225.049, 0, 1);
	}

	85.49% {
		transform: matrix3d(0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -299.599, -224.94, 0, 1);
	}

	90.69% {
		transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, -299.705, -224.784, 0, 1);
	}

	100% {
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -300, -225, 0, 1);
	}
}

@keyframes poppy {
	0% {
		transform: matrix3d(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}

	3.4% {
		transform: matrix3d(0.316, 0, 0, 0, 0, 0.407, 0, 0, 0, 0, 1, 0, -94.672, -91.573, 0, 1);
	}

	4.3% {
		transform: matrix3d(0.408, 0, 0, 0, 0, 0.54, 0, 0, 0, 0, 1, 0, -122.527, -121.509, 0, 1);
	}

	4.7% {
		transform: matrix3d(0.45, 0, 0, 0, 0, 0.599, 0, 0, 0, 0, 1, 0, -134.908, -134.843, 0, 1);
	}

	6.81% {
		transform: matrix3d(0.659, 0, 0, 0, 0, 0.893, 0, 0, 0, 0, 1, 0, -197.77, -200.879, 0, 1);
	}

	8.61% {
		transform: matrix3d(0.82, 0, 0, 0, 0, 1.097, 0, 0, 0, 0, 1, 0, -245.972, -246.757, 0, 1);
	}

	9.41% {
		transform: matrix3d(0.883, 0, 0, 0, 0, 1.168, 0, 0, 0, 0, 1, 0, -265.038, -262.804, 0, 1);
	}

	10.21% {
		transform: matrix3d(0.942, 0, 0, 0, 0, 1.226, 0, 0, 0, 0, 1, 0, -282.462, -275.93, 0, 1);
	}

	12.91% {
		transform: matrix3d(1.094, 0, 0, 0, 0, 1.328, 0, 0, 0, 0, 1, 0, -328.332, -298.813, 0, 1);
	}

	13.61% {
		transform: matrix3d(1.123, 0, 0, 0, 0, 1.332, 0, 0, 0, 0, 1, 0, -336.934, -299.783, 0, 1);
	}

	14.11% {
		transform: matrix3d(1.141, 0, 0, 0, 0, 1.331, 0, 0, 0, 0, 1, 0, -342.273, -299.395, 0, 1);
	}

	17.22% {
		transform: matrix3d(1.205, 0, 0, 0, 0, 1.252, 0, 0, 0, 0, 1, 0, -361.606, -281.592, 0, 1);
	}

	17.52% {
		transform: matrix3d(1.208, 0, 0, 0, 0, 1.239, 0, 0, 0, 0, 1, 0, -362.348, -278.88, 0, 1);
	}

	18.72% {
		transform: matrix3d(1.212, 0, 0, 0, 0, 1.187, 0, 0, 0, 0, 1, 0, -363.633, -267.15, 0, 1);
	}

	21.32% {
		transform: matrix3d(1.196, 0, 0, 0, 0, 1.069, 0, 0, 0, 0, 1, 0, -358.864, -240.617, 0, 1);
	}

	24.32% {
		transform: matrix3d(1.151, 0, 0, 0, 0, 0.96, 0, 0, 0, 0, 1, 0, -345.164, -216.073, 0, 1);
	}

	25.23% {
		transform: matrix3d(1.134, 0, 0, 0, 0, 0.938, 0, 0, 0, 0, 1, 0, -340.193, -210.948, 0, 1);
	}

	28.33% {
		transform: matrix3d(1.075, 0, 0, 0, 0, 0.898, 0, 0, 0, 0, 1, 0, -322.647, -202.048, 0, 1);
	}

	29.03% {
		transform: matrix3d(1.063, 0, 0, 0, 0, 0.897, 0, 0, 0, 0, 1, 0, -318.884, -201.771, 0, 1);
	}

	29.93% {
		transform: matrix3d(1.048, 0, 0, 0, 0, 0.899, 0, 0, 0, 0, 1, 0, -314.277, -202.202, 0, 1);
	}

	35.54% {
		transform: matrix3d(0.979, 0, 0, 0, 0, 0.962, 0, 0, 0, 0, 1, 0, -293.828, -216.499, 0, 1);
	}

	36.74% {
		transform: matrix3d(0.972, 0, 0, 0, 0, 0.979, 0, 0, 0, 0, 1, 0, -291.489, -220.242, 0, 1);
	}

	39.44% {
		transform: matrix3d(0.962, 0, 0, 0, 0, 1.01, 0, 0, 0, 0, 1, 0, -288.62, -227.228, 0, 1);
	}

	41.04% {
		transform: matrix3d(0.961, 0, 0, 0, 0, 1.022, 0, 0, 0, 0, 1, 0, -288.247, -229.999, 0, 1);
	}

	44.44% {
		transform: matrix3d(0.966, 0, 0, 0, 0, 1.032, 0, 0, 0, 0, 1, 0, -289.763, -232.215, 0, 1);
	}

	52.15% {
		transform: matrix3d(0.991, 0, 0, 0, 0, 1.006, 0, 0, 0, 0, 1, 0, -297.363, -226.449, 0, 1);
	}

	59.86% {
		transform: matrix3d(1.006, 0, 0, 0, 0, 0.99, 0, 0, 0, 0, 1, 0, -301.813, -222.759, 0, 1);
	}

	61.66% {
		transform: matrix3d(1.007, 0, 0, 0, 0, 0.991, 0, 0, 0, 0, 1, 0, -302.102, -222.926, 0, 1);
	}

	63.26% {
		transform: matrix3d(1.007, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, -302.171, -223.276, 0, 1);
	}

	75.28% {
		transform: matrix3d(1.001, 0, 0, 0, 0, 1.003, 0, 0, 0, 0, 1, 0, -300.341, -225.696, 0, 1);
	}

	83.98% {
		transform: matrix3d(0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -299.61, -225.049, 0, 1);
	}

	85.49% {
		transform: matrix3d(0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -299.599, -224.94, 0, 1);
	}

	90.69% {
		transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, -299.705, -224.784, 0, 1);
	}

	100% {
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -300, -225, 0, 1);
	}
}

/************************ 9. Slider-content ***********************/


@media all and (max-width: 599px) {


	.popup.pop {
		opacity: 1;
		transition: opacity 0.2s ease-in-out 0s;
		width: 100%;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}

	.popup.pop figure img {

		display: block;
		margin-left: auto;
		margin-right: auto;
	}

	.popup.pop figure {
		margin-top: 0;
		opacity: 1;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}

	.popup figure {
		position: absolute;
		top: 80%;
		left: 81%;
		transform: translate(-50%, -50%);
		transform-origin: 0 0;
		margin-top: 30px;
		opacity: 0;
		display: block;
		margin-left: auto;
		margin-right: auto;
		-webkit-animation: poppy 500ms linear both;
		animation: poppy 500ms linear both;
	}

	.popup figure img {
		position: relative;
		z-index: 2;
		width: 360px;
		display: block;
		/* margin-left: auto; */
		margin-right: auto;

	}

	.popup figure figcaption {

		font-size: 20px;
	}

	.tabs>li {
		padding: 5px !important;
		border-radius: 11px;
		font-size: small;
	}

	.tabs>li.active {
		padding: 5px !important;
		border-radius: 11px;
		font-size: small;
	}
}



/* .testimonial-wrapper{
	display: grid;
	grid-template-columns: .7fr 1fr .7fr;
	gap: 1rem;
} */


.brand-marque{
	-moz-animation: marquee 17s linear infinite;
    -webkit-animation: marquee 17s linear infinite;
    animation: marquee 17s linear infinite;
}
.brand-grid{
	display: flex;
	flex-wrap: nowrap;
	
	gap: 1rem;
}

.brand-grid >*{
	flex-shrink: 0;
	flex-basis: 15rem;
}

@-moz-keyframes marquee {
    0% {
      transform: translateX(100%);
    }
    100% {
      transform: translateX(-100%);
    }
  }
  @-webkit-keyframes marquee {
    0% {
      transform: translateX(100%);
    }
    100% {
      transform: translateX(-100%);
    }
  }
  @keyframes marquee {
    0% {
      -moz-transform: translateX(100%);
      -webkit-transform: translateX(100%);
      transform: translateX(100%)
    }
    100% {
      -moz-transform: translateX(-100%);
      -webkit-transform: translateX(-100%);
      transform: translateX(-100%);
    }
  }

.brand-grid .brand-card{
	background: #fff;
	box-shadow: 0 8px 32px 0 rgba(16, 16, 17, 0.37);
	backdrop-filter: blur( 4px );
	-webkit-backdrop-filter: blur( 4px );
	border-radius: 10px;
	border: 1px solid rgba( 255, 255, 255, 0.18 );
	padding-block: 1rem;
}

.brand-grid .brand-card img{
	width: 100%;
	height: 4rem;
	object-fit: cover;
}

.testimonial-card{
	background: rgba(61, 60, 60, 0.4);
	box-shadow: 0 8px 32px 0 rgba(16, 16, 17, 0.37);
	backdrop-filter: blur( 4px );
	-webkit-backdrop-filter: blur( 4px );
	border-radius: 10px;
	border: 1px solid rgba( 255, 255, 255, 0.18 );
	padding-inline:3rem;
	padding-block: 3rem;
}

@media (max-width:600px){
	.testimonial-wrapper{
		grid-template-columns: 1fr;
	}

	.brand-grid{
		grid-template-columns: repeat(2,1fr);
	}
}


.trtop-baner-content {
	padding-top: 1px;
}


.trmain-slider {
	padding: 150px 0 200px 0;
	position: relative;
}

.tr-slider-image {
	position: absolute;
	right: 0;
	top: 0;
}

.siider-content p {
	font-size: 16px;
	color: #ffffff;
	text-align: right;
	font-weight: 400;
	/* padding-right: 70px; */
}

.siider-content h1 {
	font-size: 35px;
	font-weight: 700;
	color: #ffffff;
	/* padding-right: 70px; */
	margin-bottom: 10px;
	text-align: right;
}

.tr-form-button {
	position: absolute;
	right: 0;
	top: 0;
	min-width: 226.5px;
	font-size: 24px;
	padding: 17px 15px;
}

.trform-control {
	font-size: 18px;
	padding: 0 226px 0 40px;
	height: 70px;
	border: none !important;
	-webkit-box-shadow: 3px 3px 24px 0px rgba(1, 2, 2, 0.02);
	-moz-box-shadow: 3px 3px 24px 0px rgba(1, 2, 2, 0.02);
	box-shadow: 3px 3px 24px 0px rgba(1, 2, 2, 0.02);
}

.contact_box {
	padding: 2%;
	margin-top: 3%;
	/* border: solid 5px #f78d2b; */
	border-radius: 40px;
	color: #ffffff;
	background-color: #272829;
}

.contact_box p {
	padding-top: 3%;
	color: #ffffff;
	font-weight: 600;
}


/************************ 10. Heading-title ***********************/
.about h3 {
	color: #ffffff;
	text-align: center;
	/* font-size: 45px; */
	font-weight: 600;
	line-height: 58px;
	margin-bottom: 10px;
}

.about p {
	font-size: 16px;
	line-height: 26px;
	font-weight: 600;

	color: #ffffff;
	margin: 0px 0 50px 0;
	padding-bottom: 30%;
}

/************************ 10. Heading-title ***********************/
.trheading h2 {
	color: #ffffff;
	text-align: center;
	font-size: 45px;
	font-weight: 600;
	line-height: 58px;
	margin-bottom: 10px;
}

.trsubHeading p {
	font-size: 14px;
	line-height: 26px;
	color: #ffffff;
	margin: 30px 0 50px 0;
}

/************************ 11. Image with title-block ***********************/

.tr-image-class {
	cursor: pointer;
	overflow: hidden;
	-webkit-box-shadow: 3px 3px 25px 0px rgba(1, 2, 2, 0.06);
	-moz-box-shadow: 3px 3px 25px 0px rgba(1, 2, 2, 0.06);
	-o-box-shadow: 3px 3px 25px 0px rgba(1, 2, 2, 0.06);
	-ms-box-shadow: 3px 3px 25px 0px rgba(1, 2, 2, 0.06);
	box-shadow: 3px 3px 25px 0px rgba(1, 2, 2, 0.06);
}

.tr-image-class img {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}

.tr-image-class:hover img {
	-webkit-transform: scale(1.07);
	-moz-transform: scale(1.07);
	-ms-transform: scale(1.07);
	-o-transform: scale(1.07);
	transform: scale(1.07);
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}

.tr-image-content {
	margin-top: 25px;
}

.tr-contentTitle {
	font-size: 24px;
	color: #000000;
	font-weight: 600;
	margin-bottom: 10px;
	cursor: pointer;
	letter-spacing: 0.4px;
}

.tr-contentTitle:hover {
	color: #f78d2b;
}

.tr-contentDesc {
	font-size: 16px;
	color: #ffffff;
	padding: 0% 20% 5% 20%;
	line-height: 18px;
	margin-top: 1%;
	text-align: center;
	font-weight: 600;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/************************ 12. Category-slider ***********************/
.category-slider {
	margin: 0 -15px;
}

.trCategoryItem {
	padding: 30px 15px;
	overflow: hidden;
}

.trCategoryButton {
	position: absolute;
	right: 0;
	top: 0;
}

.trCategoryItem .tr-image-class {
	position: relative;
}

.trCategoryButton a {
	line-height: 40px;
	color: #ffffff;
	background-color: rgba(67, 58, 139, 0.85);
	min-width: 150px;
	padding: 0 15px;
	font-size: 16px;
	display: inline-block;
	text-align: center;
}

.category-slider .slick-prev,
.category-slider .slick-next {
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
	top: -20%;
}

.category-slider .slick-prev {
	right: 25%;
	left: auto;
}

.category-slider .slick-next {
	left: auto;
	right: 20%;
}

/************************ 13. Trip slider ***********************/
.Trip-slider {
	margin: 0 -30px;
}

.trTripItem {
	padding: 30px;
}

.trTripContent-image {
	position: relative;
	width: 100%;
	height: 600px;
	-webkit-box-shadow: 3px 3px 24px 0px rgba(1, 1, 1, 0.1);
	-moz-box-shadow: 3px 3px 24px 0px rgba(1, 1, 1, 0.1);
	box-shadow: 3px 3px 24px 0px rgba(1, 1, 1, 0.1);
}

.trTripContent-image iframe {
	height: 100%;
}

.trTripContent-image video {
	height: auto;
}

.trTripContent-image iframe,
.trTripContent-image video {
	width: 100%;
	display: none;
	border: none;
}


.play-button {
	border-radius: 50%;
	background-color: #ffffff;
	position: absolute;
	width: 90px;
	height: 90px;
	left: 0;
	right: 0;
	top: 50%;
	margin: 0 auto;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	display: inline-block;
	vertical-align: middle;
	text-align: center;
	line-height: 100px;
	cursor: pointer;
	-webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	-webkit-animation: shadow-pulse 3s infinite;
	-moz-animation: shadow-pulse 3s infinite;
	-ms-animation: shadow-pulse 3s infinite;
	-o-animation: shadow-pulse 3s infinite;
	animation: shadow-pulse 3s infinite;
}

.play-button:hover {
	background-color: #f78d2b;
}

.play-button:hover i {
	color: #ffffff;
}

.play-button i {
	font-size: 24px;
	color: #f78d2b;
}

@-webkit-keyframes btnIconRipple {
	0% {
		border-width: 5px;
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);
		-webkit-transition: 0.3s;
		-moz-transition: 0.3s;
		-ms-transition: 0.3s;
		-o-transition: 0.3s;
		transition: 0.3s;
	}

	80% {
		border-width: 1px;
		-webkit-transform: scale(1.35);
		-moz-transform: scale(1.35);
		-ms-transform: scale(1.35);
		-o-transform: scale(1.35);
		transform: scale(1.35);
		-webkit-transition: 0.3s;
		-moz-transition: 0.3s;
		-ms-transition: 0.3s;
		-o-transition: 0.3s;
		transition: 0.3s;
	}

	100% {
		opacity: 0;
		-webkit-transition: 0.3s;
		-moz-transition: 0.3s;
		-ms-transition: 0.3s;
		-o-transition: 0.3s;
		transition: 0.3s;
	}
}

.Trip-slider .slick-prev,
.Trip-slider .slick-next {
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
	top: -20%;
}

.Trip-slider .slick-prev {
	/* right: 25%; */
	left: auto;
}

.Trip-slider .slick-next {
	left: auto;
	/* right: 20%; */
}


/*********************** 14. Testimonial ********************/

.testimonial-bg {
	position: relative;
	padding-top: 60px;
}

.testimonial-bg {
	background-image: url(../images/background-shape/Shape-9.png);
	background-repeat: no-repeat;
	background-position: center 2%;
}

.trtestimonial-nav {
	position: relative;
	background-position: center;
	background-image: url(../images/background-shape/testimonial--shapeEllipse.png);
	background-repeat: no-repeat;
	background-size: contain;
}

.trtestimonial-nav:after {
	position: absolute;
	content: "";
	height: 1px;
	width: 100%;
	top: 50%;
	left: 0;
	z-index: -1;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	background-color: #e4e3eb;
}

.testimonial-slider-img {
	height: 200px;
	display: flex !important;
	align-items: center;
}

.testimonial-slider-img:focus,
.trtestimonial-nav .slick-slide:focus {
	border: none;
	outline: none;
}

.slick-slide .testimonial-slider-img img {
	border-radius: 100%;
	height: 50px;
	width: 50px;
	margin: 0 auto;
	cursor: pointer;
	-webkit-box-shadow: 3px 4px 32px 0px rgba(67, 57, 139, 0.15);
	-moz-box-shadow: 3px 4px 32px 0px rgba(67, 57, 139, 0.150);
	box-shadow: 3px 4px 32px 0px rgba(67, 57, 139, 0.15);
}

.slick-slide.intro-prev .testimonial-slider-img img,
.slick-slide.intro-next .testimonial-slider-img img {
	height: 100px;
	width: 100px;
}

.slick-slide.intro-prev .testimonial-slider-img img {
	margin-right: auto;
	margin-left: 15px;
}

.slick-slide.intro-next .testimonial-slider-img img {
	margin-left: auto;
	margin-right: 15px;
}

.slick-slide.slick-center .testimonial-slider-img img {
	height: 200px;
	width: 200px;
}

.slick-slide .testimonial-slider-img img .slick-slide {
	text-align: center;
}

.testimonial-slider .slider-for .slick-slide {
	padding: 0;
}

.testimonial-slider .slick-prev,
.testimonial-slider .slick-next {
	height: 40px;
	width: 40px;
	border-radius: 100%;
	background-color: #f78d2b;
	line-height: 40px;
	text-align: center;
	color: #ffffff;
	border-color: #f78d2b;
	z-index: 9;
}

.testimonial-slider .slick-prev:hover,
.testimonial-slider .slick-next:hover,
.testimonial-slider .slick-next:focus,
.testimonial-slider .slick-prev:focus {
	background-color: #000000;
	color: #ffffff;
	border-color: #000000;
}

.testimonial-slider .slick-prev:before,
.testimonial-slider .slick-next:before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 20px;
	color: #ffffff;
	opacity: 1;
	line-height: 36px;
}

.testimonial-slider .slick-prev:before {
	content: "\f104";
}

.testimonial-slider .slick-next:before {
	content: "\f105";
}

.tr-testimonial-desc p {
	margin-bottom: 0;
}

.tr-testimonial-desc h3 {
	font-size: 30px;
	color: #000000;
	font-weight: 500;
	margin: 30px 0;
}

.trtestimonial-nav .slick-track {
	padding: 30px 0;
}

/*********************** 15. Footer ********************/
footer {
	overflow: hidden;
}

.footer-top {
	padding: 170px 0;
	/* margin-top: 10rem; */
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	/* background-image: url('../images/background-shape/email-bg-pattern.png'); */
}

.trFooter-Form .form-control {
	width: 100%;
	font-size: 24px;
	color: #999999;
	padding: 21px 40px;
	height: auto;
	border: solid 3px #000 !important;
	border-radius: 50px;
	border: none;
}

.trFooter-Form .form-inline input:placeholder {
	font-size: 24px;
	color: #999999;
}

.trFooter-Form .trFooter-Form-button {
	background-color: #f78d2b;
	position: absolute;
	min-width: 250px;
	line-height: 60px;
	color: #ffffff;
	font-size: 24px;
	border-radius: 30px;
	padding: 0 15px;
	right: 24px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}

.trFooter-Form .trFooter-Form-button:hover {
	background-color: #000000;
}

.trPosition-Title h3 {
	font-size: 30px;
	color: #ffffff;
	font-weight: 700;
	text-transform: uppercase;
	margin: 0;
}

.trPosition-Title {
	/* position: absolute; */
	left: 0;
	right: 0;
	bottom: 125px;
	padding-bottom: 5%;
	margin: 0 auto;
	text-align: center;
	z-index: 1;
}

.footer-bottom {
	padding: 90px 0 50px 0;
}

.trFooter-logo img {
	margin-bottom: 30px;
}

.trFooter-conatct,
.trFooter-conatct a {
	font-size: 16px;
	color: #ffffff;
	line-height: 30px;
}

.trFooter-conatct a:hover {
	color: #f78d2b;
}

.Footer-socialicon>ul>li {
	display: inline-block;
	vertical-align: middle;
	margin-right: 25px;
}

.Footer-socialicon {
	margin-top: 20px;
}

.trSocial-icon>i {
	font-size: 18px;
	color: #999999;
}

.trSocial-icon>i:hover {
	color: #f78d2b;
}

.footerTitle {
	font-size: 24px;
	color: #ffffff;
	margin-bottom: 60px;
	font-weight: 700;
}

.trFooter-link>a {
	display: inline-block;
	vertical-align: middle;
	font-size: 16px;
	color: #ffffff;
	padding-left: 0;
}

.trFooter-link>a:hover {
	color: #f78d2b;
	padding-left: 10px;
}

.trFooter-link {
	margin-bottom: 20px;
}

.Footer-copylink {
	padding: 30px 0;
	text-align: center;
	border-top: 1px solid #e3e3e3;
}

.Footer-copylink span {
	font-size: 14px;
	color: #ffffff;
	text-align: center;
	margin: 0;
	font-weight: 600;
}

.scroll-top {
	display: none;
	position: fixed;
	bottom: 20px;
	right: 30px;
	z-index: 99;
	font-size: 18px;
	border: none;
	outline: none;
	/* background-color: #fff; */
	color: #f78d2b;
	cursor: pointer;
	padding: 8px 15px;
	border-radius: 100px;
	-webkit-transition: all 0.2s ease 0s;
	-moz-transition: all 0.2s ease 0s;
	-ms-transition: all 0.2s ease 0s;
	-o-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
	-webkit-animation: scrolltop 2s infinite;
	-moz-animation: scrolltop 2s infinite;
	-ms-animation: scrolltop 2s infinite;
	-o-animation: scrolltop 2s infinite;
	animation: scrolltop 2s infinite;
	border: 3px solid #f78d2b;
}

.scroll-top:hover {
	/* background-color: #f78d2b; */
	color: #ffffff;
}

/*********************** 16. Preview Page CSS ********************/
.pr_features {
	margin-top: 100px;
	font-family: 'Jost', sans-serif;
}

.pr_features h4 {
	color: #11204d
}

.pr_features p {
	font-size: 17px;
	line-height: 20px;
	font-weight: 400;
	color: #a4a6b3;
	letter-spacing: 0px;
	font-family: 'Jost', sans-serif;
}

.pr_features_list li {
	margin-bottom: 12px;
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 0.1px;
	position: relative;
	padding-left: 25px;
	color: rgba(17, 32, 77, 0.7);
	text-transform: capitalize;
	font-family: 'Jost', sans-serif;
}

.pr_features_list li:before {
	content: "\f30b";
	left: 0;
	top: 0;
	color: rgba(17, 32, 77, 0.7);
	font-size: 14px;
	position: absolute;
	font-weight: 900;
	font-family: "Font Awesome 5 Free";
}

.view_site_img {
	border-radius: 10px;
	-webkit-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.10);
	-moz-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.10);
	box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.10);
}

.desktop_view_img {
	border-radius: 10px;
	position: relative;
	background-color: #ffffff;
}

.view_demo_btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	right: 0;
	margin: 0 auto;
	max-width: 200px;
	opacity: 0;
	visibility: hidden;
}

.desktop_view_img:hover .view_demo_btn {
	opacity: 1;
	visibility: visible;
}

.desktop_view_img:hover img {
	opacity: 0.4;
}

.pr_shape_2 {
	position: absolute;
	top: 30%;
	z-index: -1;
	right: 5%;
	opacity: 0.7;
	-webkit-animation: scale 4s linear infinite;
	-moz-animation: scale 4s linear infinite;
	-ms-animation: scale 4s linear infinite;
	-o-animation: scale 4s linear infinite;
	animation: scale 4s linear infinite;
}

.pr_shape_3 {
	position: absolute;
	bottom: 30%;
	z-index: -1;
	left: 5%;
}

.pr_shape_4 {
	position: absolute;
	bottom: 12%;
	z-index: -1;
	right: 0;
	left: 0;
	margin: 0 auto;
	text-align: center;
	-webkit-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	transform: rotate(-90deg);
}

.thumb img {
	width: 50px;
}

@media (max-width:500px){
	.thumb img {
		width: 25px;
	}

	.single-service-inner .details p{
		font-size: .8rem;
	}

	.about.fix{
		transform: translateY(-20rem);
		padding-inline: 1rem;
	}

	.about.fix h3{
		font-size: 22px;
		line-height: 30px;
		margin-bottom: 30px;
	}

	.about.fix p{
		font-size: 14px;
	}
}


/* Top Animation */

.hidden {
	opacity: 0;
	filter: blur(5px);
	/* translate: -100% 0;
	translate: translateY(-50%); */
	transition: all 1s;
}

.show {
	opacity: 1;
	filter: blur(0);
	translate: 0 0;
}


.shadow {
	box-shadow: 0 30px 70px cyan;
	transition: box-shadow 700ms ease 500ms;
}



.logo:nth-child(2) {
	transition-delay: 200ms;
}

.logo:nth-child(3) {
	transition-delay: 400ms;
}

.logo:nth-child(4) {
	transition-delay: 600ms;
}

.logo:nth-child(5) {
	transition-delay: 800ms;
}

.say-hello {
	position: fixed;
	top: 0;
	display: flex;
	justify-content: center;
	padding: 1.3rem 0;
	z-index: 9;
	width: 100%;
	text-transform: uppercase;
	border: none !important;
	backdrop-filter: blur(12px);
	transition: all 1s;
}

::-webkit-scrollbar {
	width: 8px;
	background: #000a2d;
}

::-webkit-scrollbar-thumb {
	background: #ff6f00;
	border-radius: 12px;
}


.togit:hover {
	scale: 1.1;
	transition: all 400ms ease;
}

.togit:active {
	scale: 0.9;
}

::-webkit-scrollbar-track {
	background-color: transparent;
}