* {
	font-family: "Roboto", serif;
	font-size: 0.9rem;
}
/* 
body {
	background-color: #f4f4f4;
} */

:root {
	--bs-primary: #384b70 !important;
	--bs-warning: #b8001f !important;
	--bs-primary-rgb: 56, 75, 112 !important;
	--bs-warning-rgb: 184, 0, 31 !important;
}

.btn {
	border-radius: 8px !important;
	border: none !important;
	transition: all .25s ease-out;
}

.btn-primary {
	background-color: var(--bs-primary) !important;
}

.btn-warning {
	background-color: var(--bs-warning) !important;
}

a {
	text-decoration: none;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Firefox */
input[type="number"] {
	-moz-appearance: textfield;
}

textarea {
	resize: none;
}

p {
	line-height: 2;
	margin: 0;
}

/* Pre-Loader */
.loader {
	display: flex;
	justify-content: center;
	align-items: center;
	background: rgba(255, 255, 255, 1);
	height: 100vh;
	left: 0;
	top: 0;
	position: fixed;
	transition: opacity 0.2s linear;
	width: 100%;
	z-index: 9999;
	opacity: 1;
	transform: opacity 0.5s linear;
}

.lds-roller {
	/* change color here */
	color: var(--bs-primary);
}
.lds-roller,
.lds-roller div,
.lds-roller div:after {
	box-sizing: border-box;
}
.lds-roller {
	display: inline-block;
	position: relative;
	width: 80px;
	height: 80px;
}
.lds-roller div {
	animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
	transform-origin: 40px 40px;
}
.lds-roller div:after {
	content: " ";
	display: block;
	position: absolute;
	width: 7.2px;
	height: 7.2px;
	border-radius: 50%;
	background: currentColor;
	margin: -3.6px 0 0 -3.6px;
}
.lds-roller div:nth-child(1) {
	animation-delay: -0.036s;
}
.lds-roller div:nth-child(1):after {
	top: 62.62742px;
	left: 62.62742px;
}
.lds-roller div:nth-child(2) {
	animation-delay: -0.072s;
}
.lds-roller div:nth-child(2):after {
	top: 67.71281px;
	left: 56px;
}
.lds-roller div:nth-child(3) {
	animation-delay: -0.108s;
}
.lds-roller div:nth-child(3):after {
	top: 70.90963px;
	left: 48.28221px;
}
.lds-roller div:nth-child(4) {
	animation-delay: -0.144s;
}
.lds-roller div:nth-child(4):after {
	top: 72px;
	left: 40px;
}
.lds-roller div:nth-child(5) {
	animation-delay: -0.18s;
}
.lds-roller div:nth-child(5):after {
	top: 70.90963px;
	left: 31.71779px;
}
.lds-roller div:nth-child(6) {
	animation-delay: -0.216s;
}
.lds-roller div:nth-child(6):after {
	top: 67.71281px;
	left: 24px;
}
.lds-roller div:nth-child(7) {
	animation-delay: -0.252s;
}
.lds-roller div:nth-child(7):after {
	top: 62.62742px;
	left: 17.37258px;
}
.lds-roller div:nth-child(8) {
	animation-delay: -0.288s;
}
.lds-roller div:nth-child(8):after {
	top: 56px;
	left: 12.28719px;
}
@keyframes lds-roller {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

#navbar_top {
	height: 100px;
	box-shadow: 0px 1px 1px rgba(3, 7, 18, 0.02), 0px 5px 4px rgba(3, 7, 18, 0.03), 0px 12px 9px rgba(3, 7, 18, 0.05),
		0px 20px 15px rgba(3, 7, 18, 0.06), 0px 32px 24px rgba(3, 7, 18, 0.08);
}

.navbar-brand img {
	width: 280px;
}

.navbar-nav .dropdown-menu {
	border: none;
	margin: 0;
	top: 5rem;
	border-radius: 0;
	width: 250px;
}

.navbar-expand-lg .navbar-nav .nav-link {
	line-height: 60px;
	font-size: 1rem;
	color: #292929;
	padding: 0.5rem 1rem;
}

.navbar-expand-lg .navbar-nav .nav-link:hover {
	color: var(--bs-primary);
	font-weight: 500;
}

.dropdown-menu li a {
	color: #fff;
	white-space: normal;
	padding: 1rem;
}

.navbar .nav-item .dropdown-menu {
	display: block;
	opacity: 0;
	visibility: hidden;
	transition: .3s;
	margin-top: 0;
	background-color: var(--bs-primary);
}

.dropdown-item {
	border-left: none;
	transition: all .2s ease-in;
}

.navbar .dropdown-menu.fade-up {
	top: 180%;
}

.navbar .nav-item:hover > .dropdown-menu {
	transition: .3s;
	opacity: 1;
	visibility: visible;
	top: 100%;
	transform: rotateX(0deg);
}

.dropdown-item:focus,
.dropdown-item:hover {
	color: #fff;
	background-color: unset;
	border-left: 5px solid #b8001f;
}

#toContact {
	cursor: pointer;
}

footer .top-footer {
	background-color: var(--bs-primary);
	color: #fff;
	padding-top: 4rem;
}

footer .copyright-footer {
	margin-top: 4rem;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	background-color: var(--bs-primary);
	color: #fff;
}

footer .logo-holder a img {
	width: 70%;
}

.footer-title-menu {
	font-size: 1.5rem;
	text-transform: uppercase;
	font-weight: 900;
}

.footer-title-menu::after {
	content: '';
	height: 0.2rem;
	background-color: var(--bs-warning);
	width: 15rem;
	display: block;
	margin-bottom: 1rem;
}

ul.footer-menu {
	list-style: none;
	line-height: 3;
	padding: 0;
}

ul.footer-menu li a {
	/* font-size: 1.2rem;
	font-weight: 700; */
	color: #fff;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
}

ul.footer-menu li a i {
	font-size: .5rem;
	font-weight: 700;
	color: #fff;
}

.contact-footer-wrapper {
	display: flex;
	justify-content: flex-start;
	align-items: baseline;
	gap: 10px;
	margin: 10px 0px;
}

.has-after::after {
	content: '';
	height: 0.5rem;
	background-color: var(--bs-warning);
	width: 10rem;
	display: block;
	margin: 0.5rem auto;
}

/* HOME */
.cover-section {
	width: 100%;
}

.cover-section .site-cover img {
	width: 100%;
	height: 550px;
	object-fit: cover;
	object-position: center;
}

.cover-section .site-title {
	position: absolute;
	z-index: 1;
	top: 50%;
	color: #fff;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	text-align: center;
	padding: .5rem;
	text-shadow: 0px 4px 15px #292929;
}

.cover-section .site-title h1 {
	font-size: 4rem;
	font-weight: 900;
}

.cover-section .site-title p {
	font-size: 1.2rem;
}

#start-section h1 {
	font-weight: 900;
	font-size: 3rem;
	/* color: var(--bs-primary); */
	margin-bottom: 1rem;
}

#start-section p {
	padding: 0 1rem;
	text-align: justify;
}

#serve-section {
	text-align: center;
}

.serve-title {
	font-weight: 900;
	font-size: 3rem;
	color: var(--bs-primary);
	text-transform: uppercase;
}

.serve-caption {
	font-size: 1.2rem;
	margin-bottom: 1rem;
}

.card-serve {
	overflow: hidden;
	position: relative;
	transition: all .5s ease;
	background-color: #292929;
	height: 230px;
}

.card-serve .serve-name {
	background: #292929;
	position: absolute;
	padding: .5rem;
	width: 70%;
	top: 50%;
	left: 0;
	text-align: center;
	right: 0;
	margin: 0 auto;
	transform: translate(-0%, -50%);
	transition: all 330ms ease-in-out;
	opacity: 1;
	color: #fff;
	height: 60px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.card-serve .serve-name p {
	font-size: 1rem;
	font-weight: 900;
	margin-bottom: 0;
	text-transform: uppercase;
}

.card-serve img {
	opacity: 1;
	transition: all 330ms ease-in-out;
	object-fit: cover;
	object-position: center;
	height: 100%;
}

.card-serve:hover img {
	opacity: .3;
	transform: scale(1.1);
}

.card-serve:hover .serve-name {
	transform: translateY(-40px);
}

.choose-title {
	font-weight: 900;
	font-size: 3rem;
	color: var(--bs-primary);
	text-transform: uppercase;
	text-align: center;
}

.choose-wrapper {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	gap: 20px;
	width: 80%;
	margin: 0 auto;
}

.choose-wrapper img {
	width: 100px;
}

.choose-wrapper p {
	text-align: justify;
}

.choose-wrapper h6 {
	font-weight: 900;
	font-size: 1.1rem;
	color: var(--bs-warning);
}

/* About US */
.about h5 {
	font-weight: 900;
	margin-bottom: 0;
	text-transform: uppercase;
	color: var(--bs-warning);
}

.about h1 {
	font-weight: 900;
	margin-bottom: .5rem;
	color: var(--bs-primary);
	text-transform: uppercase;
}

.about p {
	text-align: justify;
}

.values-title {
	font-weight: 900;
	text-align: center;
	font-size: 2rem;
	color: var(--bs-primary);
	text-transform: uppercase;
}

.values-wrapper {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	gap: 30px;
	text-align: left;
}

.values-wrapper h5 {
	font-size: 3.5rem;
	color: var(--bs-warning);
	width: 35%;
}

.values-wrapper p {
	width: 50%;
	text-align: justify;
}

/* Services */
.service-title {
	font-weight: 900;
	font-size: 3rem;
	color: var(--bs-primary);
	text-transform: uppercase;
}

.services-list-wrapper {
	display: flex;
	align-items: center;
	gap: 20px;
	margin: 1rem;
	box-shadow: 0px 0px 20px 3px #29292926;
	border: none;
	transition: all 330ms linear;
}

.services-list-wrapper img {
	width: 130px;
}

.services-list-wrapper div {
	text-align: left;
	padding: 10px;
}

.services-list-wrapper p {
	color: #292929;
	font-weight: 700;
	font-size: 1.1rem;
	height: 75px;
	overflow: hidden;
	white-space: break-spaces;
	text-overflow: ellipsis;
}

.services-list-wrapper span {
	color: var(--bs-warning);
	font-size: .9rem;
}

.services-list-wrapper span i {
	transition: all 330ms linear;
	transform: none;
}

.services-list-wrapper:hover {
	border: 1px solid #b8001f;
}

.services-list-wrapper:hover div span i {
	transform: translateX(5px);
}

.service-detail-wrapper {
	display: flex;
	align-items: center;
	gap: 50px;
	padding: 1rem;
	margin: .5rem;
}

.service-detail-wrapper img {
	width: 100px;
}

.service-detail-wrapper div {
	text-align: left;
}

.service-detail-wrapper div h5 {
	font-weight: 900;
	color: var(--bs-warning);
}

/*MEDIA MAX WIDTH ========================== */
@media only screen and(max-width: 320px) {
}

@media only screen and (max-width: 425px) {
	footer img {
		width: 80% !important;
		margin: 1rem auto;
	}
}

@media only screen and (max-width: 768px) {
	#navbar_top {
		height: unset;
		padding: 1rem 0rem !important;
		box-shadow: none;
	}

	.navbar-brand img {
		width: 200px;
	}

	.navbar-expand-lg .navbar-nav .nav-link {
		line-height: 40px;
		font-size: 1rem;
		padding: 0.5rem;
	}

	.navbar-nav .dropdown-menu {
		display: none !important;
		border: none;
		margin: 0;
		top: unset;
		border-radius: 0;
		background-color: unset;
		width: 100%;
	}

	.navbar .nav-item .dropdown-menu.show {
		display: block !important;
	}

	.dropdown-menu li:not(:last-child) {
		border-bottom: 1px solid #f4f4f4;
	}

	.dropdown-menu li {
		position: relative;
		padding: 8px 15px;
	}

	.dropdown-menu li a {
		color: inherit;
		padding: 0;
		margin: 5px 0px;
	}

	footer {
		text-align: center;
	}

	footer img {
		width: 80%;
	}

	.footer-title-menu::after {
		/* display: none; */
		margin: 0 auto;
	}

	ul.footer-menu li a {
		justify-content: center;
	}

	ul.footer-menu li a i {
		display: none;
	}

	.contact-footer-wrapper {
		justify-content: center;
	}

	.contact-footer-wrapper i {
		display: none;
	}

	.cover-section .site-title h1 {
		font-size: 1.5rem;
	}

	.cover-section .site-title p {
		font-size: unset;
	}

	#start-section h1 {
		font-size: 2rem;
		text-align: center;
	}

	.serve-title {
		font-size: 2rem;
	}

	.values-wrapper {
		align-items: flex-start;
		flex-direction: column;
	}

	.values-wrapper h5 {
		font-size: 2.5rem;
		width: 100%;
	}

	.values-wrapper p {
		width: 100%;
	}

	.services-list-wrapper p {
		font-size: .85rem;
		display: flex;
		align-items: center;
		line-height: 1.5;
	}
}

@media only screen and (min-width: 768px) {
}

@media (max-width: 991px) {
	.dropdown-menu .dropdown-menu {
		margin-left: 0.7rem;
		margin-right: 0.7rem;
		margin-bottom: .5rem;
	}
}

@media only screen and (max-width: 1024px) {
}

@media only screen and (max-width: 1330px) {
}

/*END MEDIA MAX WIDTH ========================== */
