.account-container {
	background: $white;
	position: relative;
	
	@include border-radius($border-radius-lg);
	
	& .account-sidebar {
		width: rem(300px);
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		padding: rem(30px) rem(30px);
		overflow: hidden;
		
		@include border-radius($border-radius-lg 0 0 $border-radius-lg);
		@include media-breakpoint-down(lg) {
			width: rem(240px);
		}
		@include media-breakpoint-down(md) {
			width: auto;
			position: relative;
			padding: rem(15px);
			
			@include border-radius($border-radius-lg $border-radius-lg 0 0);
		}
		
		& + .account-body {
			margin-left: rem(300px);
			
			@include media-breakpoint-down(lg) {
				margin-left: rem(240px);
			}
			@include media-breakpoint-down(md) {
				margin-left: 0;
			}
		}
		& .account-sidebar-cover {
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background-position: center;
			background-size: cover;
			background-repeat: no-repeat;
			
			@include media-breakpoint-down(md) {
				@include display-flex();
				@include flex-align(center);
			}
			
			& img {
				max-height: 100%;
				
				@include media-breakpoint-down(md) {
					max-width: 100%;
					max-height: inherit;
				}
			}
			&:before {
				content: '';
				position: absolute;
				top: 0;
				left: 0;
				bottom: 0;
				right: 0;
				background: rgba($dark, 0.9);
			}
		}
		& .account-sidebar-content {
			position: relative;
			color: $white;
			
			& h4 {
				font-size: rem(20px);
				font-weight: 600;
				margin: 0 0 rem(15px);
			}
			& p {
				color: rgba($white, .75);
			}
		}
	}
	& .account-body {
		padding: rem(30px) rem(30px);
		
		@include media-breakpoint-down(md) {
			padding: rem(15px);
		}
		
		& h4 {
			font-weight: 600;
			font-size: rem(20px);
			margin: 0 0 rem(15px);
		}
		& .nav.nav-list {
			margin-bottom: rem(30px);
			display: block;
			
			& > li {
				& > a {
					padding: 0;
					color: $dark;
					
					&:hover,
					&:focus {
						background: none;
						color: $dark;
						text-decoration: none;
					}
				}
				& + li {
					margin-top: rem(5px);
				}
			}
		}
	}
}