/* Extra small <576px
Small ≥576px
Medium ≥768px
Large ≥992px
Extra large ≥1200px */

.pic-01-adaptive {
	background: #fff url(images/pic-01-adaptive.jpg) no-repeat center top;
	background-size: contain;
	height: 350px;
}

.pic-03-adaptive {
	background: #fff url(images/pic-03.jpg) no-repeat center top;
	background-size: contain;
	height: 220px;
}

.pic-04-adaptive {
	background: #fff url(images/pic-04-adaptive.jpg) no-repeat center center;
	background-size: cover;
	margin-left: -15px;
	margin-right: -15px;
	height: 200px;
}

.pic-05-adaptive {
	background: #fff url(images/pic-05-adaptive.jpg) no-repeat center top;
	background-size: contain;
	height: 300px;
}

/* xs + sm + md + lg */

@media (max-width: 1199px) {
	.h4, h4 {
		font-size: 1.4rem;
	}
	.pic-05 {
		background-position: right -100px top;
	}
}

/* xs + sm + md */

@media (max-width: 991px) {
	header>.container {
		padding-top: 10px;
		padding-bottom: 10px;
	}
	.menu {
		width: initial;
		position: absolute;
		z-index: 100;
		top: 0;
		right: 0;
		padding-top: 10px;
		display: flex;
		flex-direction: column;
		align-items: flex-end;
		background: none;
		transition: background 0.15s ease-out;
	}
	.menu .nav, .menu .nav a {
		color: white;
	}
	.menu .nav hr {
		border-color: #fff;
	}
	.menu:hover, .menu:focus {
		background: #000;
		transition: background 0.25s ease-in;
	}
	.menu .nav {
		margin-top: 10px;
		margin-bottom: 10px;
		flex-direction: column;

		/* align-items: flex-start; */
		overflow: hidden;
		max-height: 0;
		max-width: 0;
		transition: max-height 0.15s ease-out, max-width 0.15s ease-out;
	}
	.menu:hover .nav, .menu .nav:hover, .menu:focus .nav, .menu .nav:focus {
		max-height: 500px;
		max-width: 290px;
		transition: max-height 0.25s ease-in, max-width 0.25s ease-in;
	}
	.menu:hover .icon, .menu:focus .icon {
		display: none;
	}
	.menu .nav-link {
		padding: .2rem 0;
		white-space: nowrap;
	}
	.menu .nav-link, .menu .nav-item {
		display: inline-block!important;
	}
	.pic-01 {
		background: none;
	}
	.pic-03 {
		min-height: 0;
	}
	.pic-05 {
		background: none;
	}
}

/* xs + sm */

@media (max-width: 767px) {
	h1, .h1 {
		font-size: 1.8rem;
	}
	.h3, h3 {
		font-size: 1.3rem;
	}
	.h4, h4 {
		font-size: 1.2rem;
	}
	.font-25 {
		font-size: 20px;
	}
	.pic-01 {
		background: none;
	}
	.pic-01-adaptive {
		height: 250px;
	}
	.pic-02 {
		background-position: center top -150px;
		padding-top: 200px;
	}
	.pic-04-adaptive {
		height: 150px;
	}
	.pic-05-adaptive {
		height: 250px;
	}
	.pic-06 {
		margin-right: -15px;
	}
	.address {
		padding: 1rem 2rem;
		font-size: 1.4rem;
		line-height: 1.6rem;
	}

}

/* xs */

@media (max-width: 575px) {
	header .menu {
		right: -15px;
	}
	.menu .nav {
		max-height: 100vh!important;
		max-width: calc(100vw - 100px)!important;
		height: 0;
		width: 0;
		transition: height 0.15s ease-out, width 0.15s ease-out;
	}
	.menu:hover .nav, .menu .nav:hover, .menu:focus .nav, .menu .nav:focus {
		height: 100vh;
		width: calc(100vw - 100px);
		transition: height 0.25s ease-in, width 0.25s ease-in;
	}
	h1, .h1 {
		font-size: 1.7rem;
	}
	.h1.e1-small {
		font-size: 1.3rem;
	}
	.h3, h3 {
		font-size: 1.2rem;
	}
	.h4, h4 {
		font-size: 1.1rem;
	}
	.font-25 {
		font-size: 18px;
	}
	.pic-01-adaptive {
		height: 200px;
	}
	.pic-04-adaptive {
		margin-left: -15px;
		margin-right: -15px;
		height: 120px;
	}
	.pic-05-adaptive {
		height: 200px;
	}
}