App.module.scss

.container {
	display: flex;
}

.body {
	width: 100%;
	overflow: hidden;
}

/* Created an animated css class */
.animated_padding_in {
	padding-left: 292px;
	transition: all 2s ease-out;
}
.animated_padding_out {
	padding-left: 0;
	transition: all 0.5s ease-out;
}

.sidebar {
	background: #2C3137;
	padding: 24px 18px;
	width: 256px;
	height: 100vh;
	position: fixed;
}

.navbar {
	width: 100%;
	max-width: 1440px;
	z-index: 10;
}



//MEDIA QUERY FOR 1024px
@media screen and (max-width: 1024px) {
	.sidebar {
		box-sizing: border-box;
		width: 96px;
		padding: 24px 4px;
	}
	.animated_padding_in {
		padding-left: 96px;
		transition: all .2s ease-out;
	}
}