/*

Template Name: Businx | IT Solutions & Business Website Template

Author: Pillarix

Author URI: https://wrapbootstrap.com/user/pillarix

Version: 1.0

*/

/*

-- Body

-- Custom Bootstrap

-- Index

-- Navbar

-- Back To Top

-- Mobile Sidebar

-- Page Loading

*/



@import url("../../../../cdn.jsdelivr.net/npm/bootstrap-icons%401.11.2/font/bootstrap-icons.min.css");

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&family=Syne:wght@600;700;800&display=swap');



/* Body */

body {

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

	font-size: 14px;

}

.h1,

.h2,

.h3,

.h4,

.h5,

.h6,

h1,

h2,

h3,

h4,

h5,

h6 {

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

}

a {

	text-decoration: none;

	color: #1b1b1b;

	-webkit-transition: all 0.3s ease 0s;

	-moz-transition: all 0.3s ease 0s;

	-o-transition: all 0.3s ease 0s;

	transition: all 0.3s ease 0s;

}

a:hover {

	color: #F54A01;

}



/* Custom Bootstrap */

.btn {

	font-size: 14px;

	padding: 12px 30px !important;

	font-weight: 600;

}

.btn-primary {

	background: hsla(18, 99%, 48%, 1);

	background: linear-gradient(135deg, hsla(18, 99%, 48%, 1) 0%, hsla(25, 100%, 50%, 1) 100%);

	background: -moz-linear-gradient(135deg, hsla(18, 99%, 48%, 1) 0%, hsla(25, 100%, 50%, 1) 100%);

	background: -webkit-linear-gradient(135deg, hsla(18, 99%, 48%, 1) 0%, hsla(25, 100%, 50%, 1) 100%);

	filter: progid: DXImageTransform.Microsoft.gradient( startColorstr="#F54A01", endColorstr="#FF6A00", GradientType=1 );

	border-color: #F54A01 !important;

	color: #fff;

}

.btn-primary:hover {

	background: hsla(18, 99%, 48%, 1);

	background: linear-gradient(360deg, hsla(18, 99%, 48%, 1) 0%, hsla(25, 100%, 50%, 1) 100%);

	background: -moz-linear-gradient(360deg, hsla(18, 99%, 48%, 1) 0%, hsla(25, 100%, 50%, 1) 100%);

	background: -webkit-linear-gradient(360deg, hsla(18, 99%, 48%, 1) 0%, hsla(25, 100%, 50%, 1) 100%);

	filter: progid: DXImageTransform.Microsoft.gradient( startColorstr="#F54A01", endColorstr="#FF6A00", GradientType=1 );

	border-color: #F54A01 !important;

	color: #fff;

}

.btn-outline-primary {

	border-color: #F54A01 !important;

	color: #F54A01;

}

.btn-outline-primary:hover {

	background-color: #F54A01 !important;

	border-color: #F54A01 !important;

	color: #fff;

}

.bg-primary {

	background-color: #F54A01 !important;

}

.shadow {

  box-shadow: 0 10px 40px 0 rgba(47,47,47,.1) !important;

}

.bg-light {

	background-color: #fef5e3 !important;

}

.text-primary {

	color: #F54A01 !important;

}



/* Index */

.bg-homepage {

	background-image: url(../img/bg-home3.jpg);

	background-position: right center;

	background-repeat: no-repeat;

	background-size: cover;

    height: 300px;

}


/* Mobile/Tablet: hide image, show only orange */
@media (max-width: 991.98px) {
    .bg-homepage {
        background-image: url(/assets/img/bg-home3.jpg); 
        background-position: left center;
        background-repeat: no-repeat;

    }
}

.play-button {

	left: 44%;

	top: 38%;

}

.logo{
	max-width: 84px;
}

.people-img {

	width: 70px;

}

.some-insight-video {

	margin-bottom: -18rem;

}

.some-insight-video-play-button {

	left: 46%;

}

.build-something-together {

	background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../img/build-something-together.jpg);

	background-position: top;

	background-repeat: no-repeat;

	background-size: cover;

	margin-bottom: -10rem;

}

.box:hover {

	background-color: #F54A01;

	border-color: #F54A01 !important;

	color: #fff;

	transition: ease .5s;

}

.box:hover i {

	color: #fff !important;

}

.design:hover .overlay {

	opacity: 0.9 !important;

	transition: ease .5s;

}

.credit-profile-img {

	width: 40px;

}

.posted-profile {

	width: 22px;

}

.transition-3d-hover {

  transition: all 0.2s ease-in-out;

}

.transition-3d-hover:hover {

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

  transform: translateY(-3px);

}

.gradient-text{

	color: #000000;

}

.icon {

	height: 70px;

	width: 70px;

	display: flex;

	align-items: center;

	justify-content: center;

}

.user-img {

	width: 40px;

}

.admin-icon {

	height: 25px;

	width: 25px;

	display: flex;

	align-items: center;

	justify-content: center;

}

.social-icon {

	height: 40px;

	width: 40px;

	display: flex;

	align-items: center;

	justify-content: center;

}

.icon-sm {

	height: 30px;

	width: 30px;

	display: flex;

	align-items: center;

	justify-content: center;

}

.footer-icon {

	width: 50px;

	height: 50px;

	display: flex;

	align-items: center;

	justify-content: center;

}



/* Navbar */

.app-nav  a.nav-link.py-4 {

	padding-top: 35px !important;

	padding-bottom: 35px !important;

	color: #000;

	font-size: 15px;

}

.app-nav .navbar-nav .nav-link:hover {

	color: #F54A01;

}

.app-nav .navbar-nav .nav-link.active {

	color: #F54A01;

}

.osahan-header-logo .logo {

	height: 30px;

}

.navbar-nav .dropdown-menu {

  box-shadow: 0px 24px 21px rgb(0 0 0 / 11%) !important;

}

.dropdown:hover>.dropdown-menu {

  display: block;

  animation: dropdown-show 0.25s cubic-bezier(0.68, -0.55, 0.265, 1.55);

}

@keyframes dropdown-show {

  from {

    opacity: 0;

    transform: scale(0.9);

  }

  to {

    opacity: 1;

    transform: scale(1);

  }

}

.dropdown-menu:hover .dropdown-item{

  opacity: 0.6;

}

.dropdown-menu .dropdown-item:hover{

  opacity: unset;

  font-weight: 500;

}

.dropdown-item{

  transition: all 0.2s ease-in-out;

  padding-right: 40px;

}

.dropdown-item:hover{

  -webkit-transform: translateX(3px);

  transform: translateX(3px);

}

.dropdown-item:after {

  content: "\ea6c";

  font-family: remixicon!important;

  font-style: normal;

  position: absolute;

  right: 0;

  font-size: 14px;

  line-height: 24px;

  opacity: 0;

	-webkit-transition: all 0.3s ease 0s;

	-moz-transition: all 0.3s ease 0s;

	-o-transition: all 0.3s ease 0s;

	transition: all 0.3s ease 0s;

}

.dropdown-item:hover:after{

  opacity: unset;

	-webkit-transition: all 0.3s ease 0s;

	-moz-transition: all 0.3s ease 0s;

	-o-transition: all 0.3s ease 0s;

	transition: all 0.3s ease 0s;

}

.dropdown-item {

  position: relative;

}



/* Back To Top */

#back-to-top {

	display: none;

	position: fixed;

	bottom: 20px;

	right: 20px;

	box-shadow: 0 10px 40px 0 rgba(47,47,47,.1) !important;

	background-color: #fff;

	color: #2d2a3e;

	width: 50px;

	border-radius: 100px;

	cursor: pointer;

	height: 50px;

	border: 3px solid #ebebeb;

	text-transform: uppercase;

	font-weight: bold;

	font-size: 14px;

}

#back-to-top:hover {

	box-shadow: 0 10px 40px 0 rgba(47,47,47,.1) !important;

	background-color: #2d2a3e;

	color: #ffffff;

}



/* Mobile Sidebar */

#sidebar .offcanvas-header .link-light {

    color: #000 !important;

}

#sidebar .offcanvas-body .nav-item .nav-link {

    text-align: center;

    padding: 15px 20px !important;

}

#sidebar .offcanvas-body .nav-item.dropdown {

    position: unset !important;

}

#sidebar .offcanvas-body .dropdown-menu {

    position: relative !important;

    transform: unset !important;

    box-shadow: none !important;

}

#sidebar .offcanvas-body .dropdown-menu .dropdown-mega-content .col-lg-3 {

    border: none !important;

    padding: 15px 15px !important;

    text-align: center;

}



/* Page Loading */

.page-loading {

	position: fixed;

	top: 0;

	right: 0;

	bottom: 0;

	left: 0;

	width: 100%;

	height: 100%;

	-webkit-transition: all .4s .2s ease-in-out;

	transition: all .4s .2s ease-in-out;

	background-color: #fff;

	opacity: 0;

	visibility: hidden;

	z-index: 9999;

}

[data-bs-theme="dark"] .page-loading {

	background-color: #121519;

}

.page-loading.active {

	opacity: 1;

	visibility: visible;

}

.page-loading-inner {

	position: absolute;

	top: 50%;

	left: 0;

	width: 100%;

	text-align: center;

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

	transform: translateY(-50%);

	-webkit-transition: opacity .2s ease-in-out;

	transition: opacity .2s ease-in-out;

	opacity: 0;

}

.page-loading.active > .page-loading-inner {

	opacity: 1;

}

.page-loading-inner > span {

	display: block;

	font-family: "Inter", sans-serif;

	font-size: 1rem;

	font-weight: normal;

	color: #6f788b;

}

[data-bs-theme="dark"] .page-loading-inner > span {

	color: #fff;

	opacity: .6;

}

.page-spinner {

	display: inline-block;

	width: 2.75rem;

	height: 2.75rem;

	margin-bottom: .75rem;

	vertical-align: text-bottom;

	background-color: #d7dde2; 

	border-radius: 50%;

	opacity: 0;

	-webkit-animation: spinner .75s linear infinite;

	animation: spinner .75s linear infinite;

}

[data-bs-theme="dark"] .page-spinner {

	background-color: rgba(255,255,255,.25);

}

@-webkit-keyframes spinner {

	0% {

		-webkit-transform: scale(0);

		transform: scale(0);

	}

	50% {

		opacity: 1;

		-webkit-transform: none;

		transform: none;

	}

}

@keyframes spinner {

	0% {

		-webkit-transform: scale(0);

		transform: scale(0);

	}

	50% {

		opacity: 1;

		-webkit-transform: none;

		transform: none;

	}

}