@charset "UTF-8";
/* Color and variables */
:root{
	--darkrid-primary-1: #71041b;
	--bs-primary: #71041b;
	--bs-primary-rgb: 113, 4, 27;
	--darkrid-primary-2: #600517;
	--darkrid-secondary-1: #fba721;
	--bs-primary-bg-subtle: #fba721;
	--darkrid-success-1: #e6ffe9;
	--darkrid-success-2: #4db721;
	--bs-success: #4db721;
	--bs-success-rgb: 77, 183, 33;
	--darkrid-success-3: #0E8D10;
	--darkrid-warning-1: #fff3e0;
	--bs-warning-bg-subtle: #fff3e0;
	--darkrid-warning-2: #fb9516;
	--bs-warning: #fb9516;
	--bs-warning-rgb: 251, 149, 22;
	--darkrid-warning-3: #B36800;
	--darkrid-danger-1: #fee5e6;
	--bs-danger-bg-subtle: #fee5e6;
	--darkrid-danger-2: #d32f2f;
	--bs-danger: #d32f2f;
	--bs-danger-rgb: 211, 47, 47;
	--darkrid-danger-3: #c22b2b;
	--darkrid-greys-1: #f2f2f2;
	--darkrid-greys-2: #ccd4e0;
	--darkrid-greys-3: #666a87;
	--darkrid-color-light: #fff;
	--darkrid-loader-background: rgb(255 255 255 / 70%);
	--bs-border-radius: 8px;
	--bs-pagination-border-radius: 8px;
	--darkrid-box-shadow-color: #000000b0;
}

:root{
	--bs-body-color: var(--darkrid-greys-3);
	--bs-emphasis-color: var(--darkrid-primary-1);
	--bs-border-color: var(--darkrid-greys-2);
	--darkrid-grey-4: var(--darkrid-greys-1);
}

/* Buttons */
.btn-primary {
	--bs-btn-color: #fff;
	--bs-btn-bg: var(--darkrid-secondary-2);
	--bs-btn-border-color: var(--darkrid-secondary-2);
	--bs-btn-hover-color: var(--darkrid-secondary-2);
	--bs-btn-hover-bg: var(--darkrid-secondary-3);
	--bs-btn-hover-border-color: var(--darkrid-secondary-3);
	--bs-btn-focus-shadow-rgb: 49,132,253;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: var(--darkrid-secondary-3);
	--bs-btn-active-border-color: var(--darkrid-secondary-3);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #fff;
	--bs-btn-disabled-bg: var(--darkrid-greys-2);
	--bs-btn-disabled-border-color: var(--darkrid-greys-2);
}
.btn-secondary {
	--bs-btn-color: var(--darkrid-primary-1);
	--bs-btn-bg: var(--darkrid-secondary-1);
	--bs-btn-border-color: var(--darkrid-secondary-1);
	--bs-btn-hover-color: var(--darkrid-primary-1);
	--bs-btn-hover-bg: var(--darkrid-secondary-1);
	--bs-btn-hover-border-color: var(--darkrid-secondary-1);
	--bs-btn-focus-shadow-rgb: 49,132,253;
	--bs-btn-active-color: var(--darkrid-primary-1);
	--bs-btn-active-bg: var(--darkrid-secondary-2);
	--bs-btn-active-border-color: var(--darkrid-secondary-2);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: var(--darkrid-primary-1);
	--bs-btn-disabled-bg: var(--darkrid-greys-2);
	--bs-btn-disabled-border-color: var(--darkrid-greys-2);
}
.btn-primary, .btn-secondary, .btn-success, .btn-danger, .btn-warning, .btn-info, .btn-light, .btn-dark, .btn-link {
	--bs-btn-disabled-bg: var(--darkrid-greys-1);
	--bs-btn-disabled-border-color: var(--bs-border-color);
	--bs-btn-disabled-color: var(--darkrid-greys-2);
	--bs-btn-disabled-opacity: 1;
}

/* Background Colors */
.--darkrid-bg-gradient {
	background: linear-gradient(to right, var(--darkrid-primary-1), var(--darkrid-primary-2));
}
.--darkrid-bg-primary-1{
	background: var(--darkrid-primary-1)!important;
}
.--darkrid-bg-primary-2{
	background: var(--darkrid-primary-2)!important;
}
.--darkrid-bg-primary-3{
	background: var(--darkrid-primary-3)!important;
}
.--darkrid-bg-secondary-1{
	background: var(--darkrid-secondary-1)!important;
}
.--darkrid-bg-secondary-2{
	background: var(--darkrid-secondary-2)!important;
}
.--darkrid-bg-secondary-3{
	background: var(--darkrid-secondary-3)!important;
}
.--darkrid-bg-greys-1{
	background: var(--darkrid-greys-1)!important;
}
.--darkrid-bg-greys-2{
	background: var(--darkrid-greys-2)!important;
}
.--darkrid-bg-greys-3{
	background: var(--darkrid-greys-3)!important;
}
.--darkrid-bg-success-1{
	background: var(--darkrid-success-1)!important;
}
.--darkrid-bg-success-2{
	background: var(--darkrid-success-2)!important;
}
.--darkrid-bg-success-3{
	background: var(--darkrid-success-3)!important;
}
.--darkrid-bg-warning-1{
	background: var(--darkrid-warning-1)!important;
}
.--darkrid-bg-warning-2{
	background: var(--darkrid-warning-2)!important;
}
.--darkrid-bg-warning-3{
	background: var(--darkrid-warning-3)!important;
}
.--darkrid-bg-danger-1{
	background: var(--darkrid-danger-1)!important;
}
.--darkrid-bg-danger-2{
	background: var(--darkrid-danger-2)!important;
}
.--darkrid-bg-danger-3{
	background: var(--darkrid-danger-3)!important;
}
.--darkrid-bg-white{
	background: var(--darkrid-color-light)!important;
}

/* Border Colors */
.--darkrid-border-primary-1{
	border-color: var(--darkrid-primary-1)!important;
}
.--darkrid-border-primary-2{
	border-color: var(--darkrid-primary-2)!important;
}
.--darkrid-border-primary-3{
	border-color: var(--darkrid-primary-3)!important;
}
.--darkrid-border-secondary-1{
	border-color: var(--darkrid-secondary-1)!important;
}
.--darkrid-border-secondary-2{
	border-color: var(--darkrid-secondary-2)!important;
}
.--darkrid-border-secondary-3{
	border-color: var(--darkrid-secondary-3)!important;
}
.--darkrid-border-greys-1{
	border-color: var(--darkrid-greys-1)!important;
}
.--darkrid-border-greys-2{
	border-color: var(--darkrid-greys-2)!important;
}
.--darkrid-border-greys-3{
	border-color: var(--darkrid-greys-3)!important;
}
.--darkrid-border-success-1{
	border-color: var(--darkrid-success-1)!important;
}
.--darkrid-border-success-2{
	border-color: var(--darkrid-success-2)!important;
}
.--darkrid-border-success-3{
	border-color: var(--darkrid-success-3)!important;
}
.--darkrid-border-warning-1{
	border-color: var(--darkrid-warning-1)!important;
}
.--darkrid-border-warning-2{
	border-color: var(--darkrid-warning-2)!important;
}
.--darkrid-border-warning-3{
	border-color: var(--darkrid-warning-3)!important;
}
.--darkrid-border-danger-1{
	border-color: var(--darkrid-danger-1)!important;
}
.--darkrid-border-danger-2{
	border-color: var(--darkrid-danger-2)!important;
}
.--darkrid-border-danger-3{
	border-color: var(--darkrid-danger-3)!important;
}

/* Background Hover Colors */
.--darkrid-bg-hover-primary-1:hover{
	background: var(--darkrid-primary-1)!important;
}
.--darkrid-bg-hover-primary-2:hover{
	background: var(--darkrid-primary-2)!important;
}
.--darkrid-bg-hover-primary-3:hover{
	background: var(--darkrid-primary-3)!important;
}
.--darkrid-bg-hover-secondary-1:hover{
	background: var(--darkrid-secondary-1)!important;
}
.--darkrid-bg-hover-secondary-2:hover{
	background: var(--darkrid-secondary-2)!important;
}
.--darkrid-bg-hover-secondary-3:hover{
	background: var(--darkrid-secondary-3)!important;
}
.--darkrid-bg-hover-greys-1:hover{
	background: var(--darkrid-greys-1)!important;
}
.--darkrid-bg-hover-greys-2:hover{
	background: var(--darkrid-greys-2)!important;
}
.--darkrid-bg-hover-greys-3:hover{
	background: var(--darkrid-greys-3)!important;
}

/* Text Colors */
.--darkrid-color-white, .--darkrid-color-white a{
	color: #fff!important;
}
.--darkrid-color-primary-1, .--darkrid-color-primary-1 a{
	color: var(--darkrid-primary-1)!important;
}
.--darkrid-color-primary-2, .--darkrid-color-primary-2 a{
	color: var(--darkrid-primary-2)!important;
}
.--darkrid-color-primary-3, .--darkrid-color-primary-3 a{
	color: var(--darkrid-primary-3)!important;
}
.--darkrid-color-success-1, .--darkrid-color-success-1 a{
	color: var(--darkrid-success-1)!important;
}
.--darkrid-color-success-2, .--darkrid-color-success-2 a{
	color: var(--darkrid-success-2)!important;
}
.--darkrid-color-success-3, .--darkrid-color-success-3 a{
	color: var(--darkrid-success-3)!important;
}
.--darkrid-color-danger-1, .--darkrid-color-danger-1 a{
	color: var(--darkrid-danger-1)!important;
}
.--darkrid-color-danger-2, .--darkrid-color-danger-2 a{
	color: var(--darkrid-danger-2)!important;
}
.--darkrid-color-danger-3, .--darkrid-color-danger-3 a{
	color: var(--darkrid-danger-3)!important;
}
.--darkrid-color-secondary-1, .--darkrid-color-secondary-1 a{
	color: var(--darkrid-secondary-1)!important;
}
.--darkrid-color-secondary-2, .--darkrid-color-secondary-2 a{
	color: var(--darkrid-secondary-2)!important;
}
.--darkrid-color-secondary-3, .--darkrid-color-secondary-3 a{
	color: var(--darkrid-secondary-3)!important;
}
.--darkrid-color-greys-1, .--darkrid-color-greys-1 a{
	color: var(--darkrid-greys-1)!important;
}
.--darkrid-color-greys-2, .--darkrid-color-greys-2 a{
	color: var(--darkrid-greys-2)!important;
}
.--darkrid-color-greys-3, .--darkrid-color-greys-3 a, .--darkrid-color-greys-3:before {
	color: var(--darkrid-greys-3)!important;
}
.--darkrid-color-greys-4, .--darkrid-color-greys-4 a, .--darkrid-color-greys-4:before {
	color: var(--darkrid-grey-4)!important;
}
.--darkrid-color-trandarkridarent, .--darkrid-color-trandarkridarent a {
	color: transparent!important;
}

/* Text Hover Colors */
.--darkrid-color-hover-white:hover, .--darkrid-color-hover-white:hover a, .--darkrid-color-hover-white a:hover{
	color: #fff!important;
}
.--darkrid-color-hover-primary-1:hover, .--darkrid-color-hover-primary-1:hover a, .--darkrid-color-hover-primary-1:hover a{
	color: var(--darkrid-primary-1)!important;
}
.--darkrid-color-hover-primary-2:hover, .--darkrid-color-hover-primary-2:hover a, .--darkrid-color-hover-primary-2:hover a{
	color: var(--darkrid-primary-2)!important;
}
.--darkrid-color-hover-primary-3:hover, .--darkrid-color-hover-primary-3:hover a, .--darkrid-color-hover-primary-3:hover a{
	color: var(--darkrid-primary-3)!important;
}
.--darkrid-color-hover-secondary-1:hover, .--darkrid-color-hover-secondary-1:hover a, .--darkrid-color-hover-secondary-1:hover a{
	color: var(--darkrid-secondary-1)!important;
}
.--darkrid-color-hover-secondary-2:hover, .--darkrid-color-hover-secondary-2:hover a, .--darkrid-color-hover-secondary-2:hover a{
	color: var(--darkrid-secondary-2)!important;
}
.--darkrid-color-hover-secondary-3:hover, .--darkrid-color-hover-secondary-3:hover a, .--darkrid-color-hover-secondary-3:hover a{
	color: var(--darkrid-secondary-3)!important;
}
.--darkrid-color-hover-greys-1:hover:hover, .--darkrid-color-hover-greys-1:hover:hover a, .--darkrid-color-hover-greys-1:hover a{
	color: var(--darkrid-greys-2)!important;
}
.--darkrid-color-hover-greys-2:hover:hover, .--darkrid-color-hover-greys-2:hover:hover a, .--darkrid-color-hover-greys-2:hover a{
	color: var(--darkrid-greys-2)!important;
}
.--darkrid-color-hover-greys-3:hover:hover, .--darkrid-color-hover-greys-3:hover:hover a, .--darkrid-color-hover-greys-3:hover a{
	color: var(--darkrid-greys-3)!important;
}
.--darkrid-hover-weight-600:hover{
	font-weight: 600!important;
}

/* Utility classes */
.fs-7 {
	font-size: 0.875rem;
}
.fs-8 {
	font-size: 0.75rem;
}
.hover-underline:hover {
    text-decoration: underline;
}
.container-smaller {
    max-width: 800px;
}
.text-justify {
	text-align: justify;
}
.btn {
	transition: all .2s linear;
}
img {
    max-width: 100%;
    height: auto;
}
body {
	overflow-x: hidden;
}

/* Global Link Rules */
a{
	text-decoration: none;
}

/* Body rules */
body {
	font-family: "Comfortaa", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	background-color: var(--darkrid-primary-1);
}
.comfortaa-semibold {
	font-family: "Comfortaa", sans-serif;
	font-weight: 600;
	font-style: normal;
}
.comfortaa-bold {
	font-family: "Comfortaa", sans-serif;
	font-weight: 700;
	font-style: normal;
}
.kurale-regular {
	font-family: "Kurale", serif;
	font-weight: 400;
	font-style: normal;
  }
.logo img {
    height: 45px;
}
.bg-img {
	background-image: url('/template/assets/images/bg.webp');
	background-size: cover;
}
.header-bar {
    line-height: 8px;
    box-shadow: 0px 1px 3px #000000ba;
}
.heading::after {
    display: block;
    background-image: url('/template/assets/images/logo-element-red.webp');
    content: ' ';
    width: 100%;
    background-repeat: no-repeat;
    height: 25px;
    background-position: center;
    background-size: 60px;
}

/* Homepage */
img.hero-img {
    width: 600px;
}
section.hero {
    position: relative;
}
.hero .container {
    position: relative;
}
img.about-img {
    height: 50px;
}
.hero-icon {
    position: absolute;
}
.hero-icon img {
    width: 20px; /* Adjust size as needed */
    height: 20px; /* Adjust size as needed */
}
/* Products */
.product-item {
    position: relative;
    transition: all 0.2s linear;
}
img.product-item {
    background: linear-gradient(135deg, #ffffff, #9a9a9a, #3c3c3c);
}

img.product-item:hover {
    background: linear-gradient(125deg, #ffffff, #b0b0b0, #808080, #4d4d4d);
}

.product-item::before {
    content: '';
    position: absolute;
    right: 4px;
    top: 17px;
    width: 60px;
    height: 12px;
    background-image: url('/template/assets/images/logo-element.webp');
    background-size: 55px;
    background-repeat: no-repeat;
    transform: rotate(15deg);
}

.product-item:not(.active):not(.card-title):hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 10px 0 var(--darkrid-box-shadow-color);
}

.list-group .product-item::before {
    right: -15px;
    background-size: 40px;
}

.list-group .product-item.active::before,
.list-group .product-item:hover::before {
    background-image: url('/template/assets/images/logo-element-red.webp');
}

.product-image {
    height: 130px;
}

.products-list .product-item::before {
    right: -20px;
}

/* PhotoSwipe */
.pswp:not(.pswp--open) {
    display: none;
}

/* Owl Carousel */
#gallery .owl-nav button {
    position: absolute;
    top: calc( 50% - 90px);
    font-size: 80px;
    color: var(--darkrid-primary-1);
    display: none;
}

#gallery .owl-nav button.owl-prev {
    left: 0;
}

#gallery .owl-nav button.owl-next {
    right: 0;
}

.owl-theme .owl-nav [class*=owl-]:hover {
    background: transparent;
}

#gallery:hover > .owl-nav button {
    display: block;
}

#gallery .owl-dots {
    margin-top: -15px;
}

#gallery .owl-dots .owl-dot {
    color: #fff;
}

#gallery .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background: var(--darkrid-primary-1);
}

/* Tabs */
.tab-content h1, .tab-content h2, .tab-content h3, .tab-content h4, .tab-content h5, .tab-content h6 {
    color: var(--darkrid-primary-1);
	font-family: "Kurale", serif;
	font-weight: 400;
	font-style: normal;
}
.nav-tabs .nav-link {
    font-family: 'Kurale Regular';
    font-size: 1.3rem;
}

/* Blockquote */
blockquote {
	background-color: var(--darkrid-greys-1);
    padding: 40px;
    border-radius: var(--bs-border-radius);
    position: relative;
    font-weight: bold;
    font-size: 1.1rem;
}

blockquote p {
    margin: 0;
}
blockquote::before,
blockquote::after {
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	display: inline-block;
	vertical-align: middle;
	color: var(--darkrid-secondary-1);
    position: absolute;
	font-size: 1.5rem;
}

blockquote::before {
	content: "\f10d";
	left: 15px;
	top: 5px;
}

blockquote::after {
    content: "\f10e";
    right: 15px;
    bottom: 5px;
}

@media (max-width: 1024px) {
	/* Tabs */
	.nav-tabs .nav-item {
		width: 100%;
	}
	
	.nav-tabs .nav-link, .nav-tabs .nav-link.active {
		width: 100%;
		border: 1px solid var(--darkrid-primary-1);
		border-radius: var(--bs-border-radius);
		margin-bottom: 7px;
	}
	
	.nav-tabs .nav-link.active {
		background-color: var(--darkrid-primary-1);
		color: var(--darkrid-color-light)!important;
	}
	
	.tab-content {
		border: none;
		border-radius: var(--bs-border-radius);
		border: 1px solid;
		border-color: var(--darkrid-primary-1);
	}
	
	.nav-tabs {
		border: none;
	}
	/* Mobile menu toggle */
	.menu-toggle {
		width: 39px;
		height: 33px;
		padding: 10px;
	}

	.menu-toggle span {
		display: block;
		position: relative;
		height: 2px;
		width: 17px;
		background: var(--darkrid-secondary-1);
		border-radius: 1px;
		opacity: 1;
		left: 1px;
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
		-webkit-transition: .25s cubic-bezier(.68,-.55,.27,1.55);
		-moz-transition: .25s cubic-bezier(.68,-.55,.27,1.55);
		-o-transition: .25s cubic-bezier(.68,-.55,.27,1.55);
		transition: .25s cubic-bezier(.68,-.55,.27,1.55)
	}

	.menu-toggle span:nth-child(1) {
		top: 0
	}

	.menu-toggle span:nth-child(2) {
		top: 3px
	}

	.menu-toggle span:nth-child(3) {
		top: 1px
	}

	.menu-toggle span:nth-child(4) {
		top: 4px
	}

	.menu-toggle.open span:nth-child(1) {
		top: 2px;
		width: 0%;
		left: 50%
	}

	.menu-toggle.open span:nth-child(2) {
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		transform: rotate(45deg)
	}

	.menu-toggle.open span:nth-child(3) {
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		transform: rotate(-45deg)
	}

	.menu-toggle.open span:nth-child(4) {
		top: 8px;
		width: 0%;
		left: 50%
	}

}

@media (min-width: 1025px) {
	.w-md-auto {
		width: auto !important;
	}
}

.hover-lift {
    transition: all 0.2s linear;
}
.hover-lift:hover {
    box-shadow: 0 5px 10px 0 var(--darkrid-box-shadow-color);
    transform: translateY(-5px);
}
.hover-lift-sm:hover {
    box-shadow: 0 3px 5px 0px var(--darkrid-box-shadow-color);
    transform: translateY(-2px);
}