//COMMON IMPORTS
@import "../config/imports";

h1, h2, h3, h4, h5, h6 {
	font-family: 'Oswald', sans-serif;
}

p, a, span, li, strong, b {
	font-family: 'Montserrat', sans-serif;
}

.custom-primary-font {
	font-family: 'Oswald', sans-serif !important;
}

.custom-secondary-font {
	font-family: 'Montserrat', sans-serif !important;
}

.custom-tertiary-font {
	font-family: 'Playfair Display', sans-serif !important;
}

.custom-padding-1 {
    padding: 0.7rem 0.8rem !important;
}

.custom-font-weight-medium {
	font-weight: 500 !important;
}

.custom-font-weight-extra-light {
	font-weight: 200 !important;
}

.custom-fs-1 {
	font-size: 1.3em !important;
}

.text-3 {
	font-size: 1.1em !important;
}

.custom-btn-style-1 {
	background-color: #000 !important;
    border-color: #000 !important;
    font-family: 'Oswald', sans-serif;
    font-size: 1.1rem;
    color: #FFF !important;
    padding: 0.5rem 1.5rem !important;
}

@media(max-width: 575px) {
	.custom-mobile-scale-1 {
		transform: scale(0.6);
	}
}

// Animations
@keyframes lineProgress {
	from {
	    stroke-dashoffset: 1550;
	}

	to {
	    stroke-dashoffset: 0;
	}
}

.lineProgress {
	animation-name: lineProgress;
}

@keyframes lineProgressAndFill {
	0% {
	    stroke-dasharray: 1440;
	    stroke-dashoffset: 1440;
	    fill-opacity: 0;
	}

	75% {
		fill-opacity: 0.5;
	}

	90% {
		stroke-dasharray: 1440;
		stroke-dashoffset: 0;
		fill-opacity: 0.5;
	}

	100% {
		stroke-dasharray: 1440;
	    stroke-dashoffset: 0;
	    fill-opacity: 1;
	}
}

.lineProgressAndFill {
	animation-name: lineProgressAndFill;
}

// Custom Side Dots
.custom-side-dots {
	position: relative;
	padding-left: 1.2rem;
    padding-right: 1.2rem;
	&:before {
		content: '';
	    position: absolute;
	    top: 50%;
	    #{$left}: 0;
	    background-color: #CCC;
	    width: 8px;
	    height: 8px;
	    border-radius: 100%;
	    transform: translate3d(0, -50%, 0);
	}
	&:after {
		content: '';
	    position: absolute;
	    top: 50%;
	    #{$right}: 0;
	    background-color: #CCC;
	    width: 8px;
	    height: 8px;
	    border-radius: 100%;
	    transform: translate3d(0, -50%, 0);
	}

	&.custom-side-dots-rm-right {
		padding-#{$right}: 0;
		&:after {
			content: none;
		}
	}

	&.custom-side-dots-rm-left {
		padding-#{$left}: 0;
		&:before {
			content: none;
		}
	}

	&.custom-side-dots-at-top {
		padding-left: 15px;
		padding-right: 15px;
		&:before, &:after {
			top: 44px;
			transform: none;
		}
	}

	&.custom-side-dots-big {
		&:before, &:after {
			width: 14px;
			height: 14px;
		}
	}

	&.custom-side-dots-outside {
		&:before {
			#{$left}: -20px;
		}
		&:after {
			#{$right}: -20px;
		}
	}
}

@media(max-width: 767px) {
	.custom-side-dots {
		&.custom-side-dots-rm-sm {
			&:before, &:after {
				content: none;
			}
		}
	}
}

// Custom Images Position
.custom-images-position-1 {
	div {
		&:nth-child(2) {
			transform: translate3d(-50%, -30%, 0);
		}
		&:nth-child(3) {
			transform: translate3d(76%, 30%, 0);
		}
		&:nth-child(4) {
			transform: translate3d(-13%, 147%, 0);
		}
	}
}

// Custom Circles Position
.custom-circle-pos-1 {
    top: -170px !important;
}

.custom-circle-pos-2 {
    bottom: -210px !important;
    right: -170px !important;
}

// Header
#header {
	.header-nav-main {
		nav {
			> ul {
				> li {
					> a {
					    font-family: 'Oswald', sans-serif;
					    font-size: 0.96rem;
					    font-weight: 400;
					    letter-spacing: 0;
					}
				}
			}
		}
	}
}

@media(min-width: 992px) {
	#header {
		.header-nav-main {
			nav {
				> ul {
					> li {
						> a {
							padding: 0 1.2rem !important;
							&:before {
								content: '';
							    position: absolute;
							    top: 50.7%;
							    #{$right}: -5px;
							    background-color: #FFF !important;
							    width: 6px;
							    height: 6px;
							    border-radius: 100%;
							    transform: translate3d(0, -50%, 0);
							}
						}
						&:last-child {
							> a {
								&:before {
									content: none;
								}
							}
						}
					}
				}
			}
		}
	}
}

// Custom Blockquote Styles
.custom-blockquote-style-1 {
    position: relative;
    border: 0;
    padding: 0.5rem 2.8rem;
	&:before {
	    content: if-ltr("\201C", "\201D");
	    position: absolute;
	    #{$left}: -2px;
	    top: -24px;
	    font-size: 75px;
	    font-style: normal;
	    font-family: 'Playfair Display', sans-serif;
	    line-height: 1;
	    color: #777;
	}
	p {
		font-family: 'Playfair Display', sans-serif;
	    font-size: 1.3rem;
	    line-height: 1.6;
	}
}

// Custom Testimonial Styles
.custom-testimonial-style-1 {
	.custom-testimonial-quote {
		> span {
		    font-family: 'Playfair Display', sans-serif;
		    font-size: 12rem;
		    line-height: 1;
		    display: block;
		    max-height: 5.9rem;
		}
	}
}

// Custom Working Hours
.custom-working-hours {
	display: flex;
	.custom-working-hours-item {
	    flex-basis: 14.2857%;
	    max-width: 14.2857%;
	    text-align: center;
	    box-shadow: 0px 0px 38px -3px rgba(111, 111, 111, 0.15);
	    margin-left: 7px;
	    margin-right: 7px;
	    padding: 2.5rem 0.5rem;
	    transition: ease all 300ms;
	    &:first-child {
	    	margin-left: 0;
	    }
	    &:last-child {
	    	margin-right: 0;
	    }

	    &:hover,
	    &.active {
	    	background-color: #CCC;
	    	* {
	    		color: #FFF !important;
	    	}
	    }
	}
}

@media(max-width: 991px) {
	.custom-working-hours {
		flex-wrap: wrap;
		justify-content: center;
		.custom-working-hours-item {
			flex-basis: 23.1857%;
		    max-width: 23.1857%;
		    &:nth-child(5), &:nth-child(6), &:nth-child(7) {
		    	margin-top: 15px;
		    }
		}
	}
}

@media(max-width: 767px) {
	.custom-working-hours {
		.custom-working-hours-item {
			flex-basis: 30.4857%;
		    max-width: 30.4857%;
		    &:nth-child(4) {
		    	margin-top: 15px;
		    }
		}
	}
}

@media(max-width: 575px) {
	.custom-working-hours {
		.custom-working-hours-item {
			flex-basis: 44.9857%;
		    max-width: 44.9857%;
		    &:nth-child(3) {
		    	margin-top: 15px;
		    }
		}
	}
}



// Custom Menu Item
.custom-menu-item {
	.custom-menu-item-details {
		display: flex;
		justify-content: between;
		.custom-menu-item-title,
		.custom-menu-item-price {
			white-space: nowrap;
		}
		.custom-menu-item-price {
			strong {
				font-size: 1.3rem;
				> span {
					font-size: 0.6em;
				}
			}
		}
		.custom-menu-item-line {
			width: 100%;
			border-bottom: dashed 1px #777;
		}
	}
}

// Custom Instagram Feed
.custom-instagram-feed {
	display: flex;
	.custom-instagram-feed-title {
	    flex-basis: 12.5%;
	    max-width: 12.5%;
	    text-align: center;
	    padding: 0 2rem;
	    display: flex;
	    flex-direction: column;
	    justify-content: center;
	}
	.custom-intagram-feed-content {
		flex-basis: 87.5%;
		max-width: 87.5%;
	}
}

@media(max-width: 1440px) {
	.custom-instagram-feed {
		.custom-instagram-feed-title {
		    flex-basis: 32.5%;
		    max-width: 32.5%;
		}
		.custom-intagram-feed-content {
			flex-basis: 67.5%;
			max-width: 67.5%;
		}
	}
}

@media(max-width: 575px) {
	.custom-instagram-feed {
		.custom-instagram-feed-title {
		    flex-basis: 50%;
		    max-width: 50%;
		}
		.custom-intagram-feed-content {
			flex-basis: 50%;
			max-width: 50%;
		}
	}
}

// Custom Form Style
.custom-form-style-1 {
	.form-control {
		&::-webkit-input-placeholder {
		  color: #777;
		}
		&::-moz-placeholder {
		  color: #777;
		}
		&:-ms-input-placeholder {
		  color: #777;
		}
		&:-moz-placeholder {
		  color: #777;
		}
	}
}