ptut-vhost/webpack/scss/container.scss

@import 'constants';


#CONTAINER{

	display: block;
	position: absolute;
		top: $header-height;
		left: $menu-width;
		height: calc( 100% - #{$header-height} );
		width: calc( 100% - #{$menu-width} );


	background-color: $bg-color;

	overflow: hidden;
	overflow-y: auto;

	z-index: 100;


	// card container
	&.card{
		display: flex;

		flex-direction: row;
		justify-content: flex-start;
		flex-wrap: wrap;
	}

}



/* [1] List style
---------------------------------*/
#CONTAINER > div.list{
	display: flex;

	// flex properties
	flex-direction: column;
	justify-content: flex-start;

	& > *:first-child{ margin-top: 1em; }
	& > *:last-child{ margin-bottom: 3em; }

	/* (1) List element */
	& > section{

		display: block;

		margin: .3em 1em;
		padding: .8em 1em;

		border-radius: 5px / 5px;

		background-color: #fff;

	}

	/* (2) List title */
	& > h1{
		display: inline-block;

		margin: 0 1.2em;
		margin-top: .8em;

		font-size: inherit;
		color: darken($secondary-color, 5%);

	}

	/* (3) List separator */
	& > hr{
		display: block;
		position: relative;

		margin: 1em 1.5em;

		border: 0;
		border-bottom: 2px solid darken($bg-color, 5%);
	}

}







@import 'container/card';