//COMMON IMPORTS
@import "../config/imports";

a, span, p, b, strong, li, h1, h2, h3, h4, h5, h6 {
	font-family: 'Poppins', sans-serif;
}

.custom-font-primary {
	font-family: 'Poppins', sans-serif !important;
}

.custom-font-secondary {
	font-family: 'Montserrat', sans-serif !important;
}

.custom-negative-margin-top {
	margin-top: -150px;
}

.custom-box-shadow-1 {
	box-shadow: 0px 0px 100px -27px rgba(0,0,0,0.2);
}

.custom-btn-pos-1 {
	transform: translate3d(0, 100%, 0);
    margin-top: -37px;
}

.custom-text-size-1 {
	font-size: 6.4em;
}

.custom-text-color-grey-1 {
	color: #777 !important;
}

.custom-border-color-grey {
	border-color: #43474A !important;
}

.custom-transition-1 {
	rect {
		transition: ease all 3s !important;
	}
}

// Custom Responsive Text Size
@media (min-width: 1200px) and (max-width: 1530px) {
	.custom-responsive-text-size-1 {
		font-size: 0.8rem !important;
	    line-height: 1.5 !important;
	}
}

// Custom Responsive Margin and Padding Horizontal
@media(min-width: 1440px) {
	.custom-responsive-m-p-x {
		margin-right: 3rem !important;
		margin-left: 3rem !important;
		padding-right: 3rem !important;
		padding-left: 3rem !important;
	}
}

// Custom Plus
.custom-plus {
	position: relative;
	&:before {
	    content: '+';
	    position: absolute;
	    top: 30px;
	    right: -23px;
	    font-size: 0.4em;
	    font-weight: 400;
	}
}

// Custom Square Style
.custom-square-1 {
	position: absolute;
	top: -10px;
	left: -10px;
	rect {
		fill-opacity: 0;
		stroke-dasharray: 1550;
		stroke-dashoffset: 1550;
		transition: ease all 2000ms;
		&.appear-animation-visible {
			stroke-dashoffset: 0;
		}
	}
	&.custom-square-top-right {
		right: -10px;
		left: auto;
	}
	&.custom-square-1-no-pos {
		top: 0;
		left: 0;
		rect {
			&.appear-animation-visible {
				fill-opacity: 1;
			}
		}
	}
}

@media(max-width: 575px) {
	.custom-mobile-square-thickness {
		rect {
			stroke-width: 15px;
		}
	}
}

@keyframes lineProgress {
	from {
	    stroke-dashoffset: 1550;
	}

	to {
	    stroke-dashoffset: 0;
	}
}

.lineProgress {
	animation-name: lineProgress;
}

@keyframes lineProgressAndFill {
	0% {
	    stroke-dashoffset: 1550;
	    fill-opacity: 0;
	}

	75% {
		stroke-dashoffset: 300;
		fill-opacity: 0;
	}

	100% {
	    stroke-dashoffset: 300;
	    fill-opacity: 1;
	}
}

.lineProgressAndFill {
	animation-name: lineProgressAndFill;
}

// Custom Button
.custom-btn-color-1 {
	border-color: #43474A !important;
	&:hover {
		border-color: $color-dark !important;
	}
}

.custom-btn-style-1.btn-dark {
	background: #FFF !important;
	&:hover {
		background: $color-dark !important;
	}
}

// Rev Slider
.active-revslide {
	.custom-square-1 {
		rect {
			stroke-dashoffset: 0;
		}
	}
}

// Custom Featured Boxes Style
.custom-featured-boxes-style-1 {
	.featured-box {
		.box-content {
		    padding: 3.8rem 1.8rem;
			border: 7px solid #43474A;
			transition: ease border-color 300ms;
			svg {
				width: 88px;
				height: auto;
				fill: #FFF;
				transition: ease fill 300ms;
			}
		}
	}
}

// Custom Thumb Info Style
.custom-thumb-info-style-1 {
	&.thumb-info-bottom-info-dark-linear .thumb-info-title {
		background: transparent;
	}
	&.thumb-info-bottom-info .thumb-info-title {
		padding: 2.3rem;
	}
}

// Owl Carousel
.owl-carousel {
	&.custom-nav-size-1 {
		.owl-nav {
			.owl-prev, .owl-next {
				font-size: 1.4rem;
			}
		}
	}
}

// Card
.card {
	&:hover {
		.custom-square-1 {
			rect {
				stroke-dashoffset: 0;
			}
		}
	}

	&.custom-card-style-1 {
		background: transparent;
		border: 7px solid #43474A;
	}
}

// Inner Page
.inner-page {
	.main {
		padding-top: 100px;
	}
}