.header {
	height: 94vh;
	min-height: 650px;
	border-bottom: 1px solid $border-color;

	.container {
		height: 100%;
		@include d-flex;
		align-items: center;

		.infos {
			margin-top: 120px;

			.subtitle {
				margin-bottom: 0;
				font-size: 25px;
				font-weight: 500;
			}

			.title {
				margin-bottom: 0px;
				font-size: 74px;
				font-weight: bold;
			}

			p {
				margin-top: -5px;
				font-size: 22px;
			}

			.btn {
				display: inline-block;
				margin: 0 2px;
			}
		}

		.img-holder {
			height: 100%;
			align-self: flex-end;
			flex-grow: 1;
			@include d-flex;
			align-items: flex-end;
			padding-left: 0px; 

			img {
				width: 100%;
				max-width: 620px;
				filter: drop-shadow(0 -4px 20px rgba($gray-400,.4));
				margin-left: auto;
				margin-right: -2rem;

			}
		}

		@include media-breakpoint-down(md) {
			justify-content: center;

			.infos {
				margin-top: 0;
			}
			.img-holder {
				display: none;
			}
		}
	}

	// header widget
	.widget {
		position: relative;
		max-width: 650px;
		width: 95%;
		margin: 0 auto;
		border-radius: 50px;
		@include d-flex;
		border: 1px solid $border-color;
		padding: 20px 0;
		margin-top: -50px;
		z-index: 999;
		background: $white;
		box-shadow: 0 0 30px rgba($gray-500,.4);

		.widget-item{
			flex-grow: 1;
			flex-basis: 0;
			text-align: center;
			border-right: 1px solid $border-color;

			&:last-child {
				border-right: 0;
			}

			h2,p {
				margin: 0;
			}

			p {
				opacity: .7;
				font-size: 14px;
			}
		}

		@include media-breakpoint-down(sm) {
			padding: 10px;
			margin-top: -32px;

			.widget-item {

				h2 {
					font-size: 20px;
				}

				p {
					font-size: 13px;
				}
			}
		}
	}

	// header title
	&-title {
		font-size: 2.4rem;
		font-weight: bold;
		opacity: .8;
	}

	// header mini
	&-mini {
		min-height: 24rem;
		height: 24rem;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		text-align: center;
		padding: 1rem;
		background: lighten($primary, 20%);
	}
} 
	

