//COMMON IMPORTS
@import "../config/imports";

// Container
@media(min-width: 1440px) {
	.container {
		max-width: 1440px !important;
	}
}

body {
	font-size: 18px;
}

// Hero
.hero {
	background-size: cover;
	max-width: 1100px;
	width: 100%;
	max-height: 770px;
	height: 100%;	
	position: absolute;
	right: 0;
	top: 0;
	@media (max-width: 1800px) {
		right: -13%;	
	}
}

// Custom Position
.custom-el-pos-1 {
	left: 15%;
	top: 17%;
}

.custom-el-pos-2 {
	right: 11%;
	top: 17%;
}

@media (min-width: 992px) {
	.custom-el-pos-3 {
		margin-top: -100px;
	}
}

// Custom Col
@media (max-width: 991px) {
	.custom-col-1 {
		padding-top: 120px;
		margin-bottom: 50px;
	}
}

@media (min-width: 992px) and (max-width: 1399px) {
	.custom-col-1 {
		padding-top: 500px;
		margin-bottom: 50px;
	}
}

// Custom Wrapper
.custom-wrapper-1 > .container > .row {
	min-height: 935px;
}

// Headings
h3 {
	text-transform: none;
	font-size: 2.4em;
	font-weight: 600;
	line-height: 1.1em;
	margin-bottom: 20px;
}

// Paragraph
p {
	line-height: 1.6em;
}

// Max Width
@media (max-width: 991px) {
	.max-width-custom-1 {
		max-width: 485px !important;
	}
}

// Buttons
@keyframes btnDashEffect {
	0% {
		transform: translateX(0);
	}
	51% {
		transform: translateX(20px);
		opacity: 1;
	}
	52% {
		opacity: 0;
		transform: translateX(-20px);
	}
	53% {
		opacity: 0;
	}
	54% {
		opacity: 1;
	}
	100% {
		transform: translateX(0);
	}
}

.btn-dash {
	&:before {
		content: "";
		width: 20px;
		height: 2px;
		display: inline-block;
		background: var(--light);
		margin-right: 10px;
		position: relative;
		top: -3px;
	}
	&:hover {
		&:before {
			animation: btnDashEffect ease-out .3s;
		}
	}
}

.btn-dash {
	&.text-color-primary {
		&:before {
			background: var(--primary);
		}
	}
}

// Header
#header .header-container {
	min-height: 100px;
}

@media (min-width: 992px) {
	#header {
		.header-nav-main {
			nav {
				> ul {

					> li {
						> a {
							font-size: 18px;
							margin-left: 6px !important;
							margin-right: 6px !important;
						}
					}
					> li.dropdown-mega {
						.dropdown-mega-content {
							font-size: 20px;
						}
					}
				}
			}
		}
	}
}

@media (max-width: 1480px) {
	#header {
		.header-nav-main {
			nav {
				> ul {
					> li {
						> a {
							font-size: 16px;
							margin-left: 0px !important;
							margin-right: 0px !important;
						}
					}
				}
			}
		}
	}
}

// Tabs
.tabs-navigation-custom {
	.nav-tabs {
		.nav-item {
			position: relative;
			.nav-link {
				border: 0 !important;
				font-size: 18px;
				padding-left: 25px !important;
				&:not(.active) {
					color: var(--dark);
				}
				&:before {
					content: "";
					width: 20px;
					height: 2px;
					display: inline-block;
					background: var(--dark);
					margin-right: 10px;
					position: relative;
					top: -3px;
					left: 0;
				}
				&.active {
					&:before {
						background: var(--primary);
					}
				}
			}
		}
	}
}

// Marquee
.custom-marquee {
	bottom: -30%;
	p {
		font-size: 500px;
		font-weight: 600;
	}
}

// Outline
.custom-outline-text-style-1 {
	text-shadow: -1px 1px 0 #000,
	              1px 1px 0 #000,
	             1px -1px 0 #000,
	            -1px -1px 0 #000;
	letter-spacing: 0;
	color: var(--light);
	opacity: 0.08;
}