aegis

[nobr]
[class=variables]
	--color: #b7cfda;
	cursor: url('http://i.imgur.com/ZOrzC.png'), auto !important
[/class]

[class=container]
	width: 530px;
	height: 300px;
	display: flex;
	margin: auto;
	flex-wrap: wrap;
[/class]

[class name=container maxWidth=450px]
	width: 300px;
	height: 100%;
	align-items: center;
	justify-content: center;
[/class]

[class=left]
	height: 300px;
	width: 220px;
	padding: 15px;
	box-sizing: border-box;
	font-size: 13px;
	overflow: hidden;
[/class]

[class=name]
	font-weight: 900;
	text-align: center;
	border-bottom: 4px solid var(--color);
	width: 120px;
	display: block;
	margin: 10% auto;
	font-size: 18px;
	position: relative;
[/class]

[class=imgContainer]
	width: 100%;
	height: 90px;
	display: flex;
	justify-content: space-between;
	margin: 10px auto;
[/class]

[class=img]
	width: 90px;
	height: 90px;
	background-size: cover;
	background-position: 50% 50%;
	filter: saturate(70%);
[/class]

[class=tag]
	display: inline-block;
	border-bottom: 1px solid var(--color);
	height: 15px;
	font-size: 10px;
	text-transform: uppercase;
[/class]

[class=right]
	width: 280px;
	height: 300px;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	font-size: 12px;
	text-align: justify;
	padding: 10px;
	box-sizing: border-box;
[/class]

[class=leftTagContainer]
	width: 100%;
	height: 100px;
[/class]

[class=scroll]
	width: 100%;
	padding-right: 50px;
	height: 100%;
	overflow-y: scroll;
[/class]

[div class=variables]
[div class=container]
	[div class=left]
		[div class=imgContainer]
			[div class=img style="background-image: url('https://66.media.tumblr.com/e9091855654b087fbd71451efd42d5e0/tumblr_inline_p2nvv5YUPv1rbm3wd_500.gif')"][/div]
			[div class=img style="background-image: url('https://66.media.tumblr.com/8a4cb62f9175e9d26014d9ac0a56913d/tumblr_inline_p2nvwc7n2H1rbm3wd_500.gif')"][/div]
		[/div]

		[div class=name][font=Playfair Display SC]NAME HERE.[/font][/div]

		[div class=leftTagContainer]
		[div class=scroll]
			[div class=tag]location[/div] a cool place (this will scroll if it has to)
				[br][/br]
			[div class=tag]interacts[/div] n/a.
				[br][/br]
			[div class=tag]tags[/div] n/a.
				[br][/br]
			[div class=tag]outfit[/div] here.
		[/div]
		[/div]
	[/div]

	[div class=right]
		[div class=scroll]
		Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent hendrerit pulvinar sem, eget eleifend lacus porta convallis. Vivamus vel sapien libero. Duis efficitur eu arcu quis consectetur. Morbi id urna id felis aliquet scelerisque. Nulla sodales ligula a metus consequat, ac viverra lacus auctor. Morbi vulputate interdum convallis. Donec consequat maximus magna, at tincidunt mauris gravida vel. Nunc eu interdum urna. Pellentesque blandit ipsum eget urna venenatis, vitae molestie orci aliquet. Suspendisse potenti. Mauris tellus nunc, viverra eget sem ac, pharetra ornare odio. Duis dapibus velit sit amet arcu consequat posuere. Ut tempor quam turpis, at dictum dui interdum eu. Phasellus quis viverra quam. Maecenas eros turpis, semper vel enim vel, fermentum semper lectus.

Aliquam erat volutpat. Sed mattis mi vitae justo interdum, in placerat orci venenatis. Praesent porta et quam nec venenatis. Etiam tempor faucibus lorem vitae posuere. Mauris sit amet metus maximus, vulputate tortor eget, condimentum nibh. Vivamus efficitur libero at malesuada euismod. Curabitur congue lorem in leo aliquam feugiat. Ut a porta lorem. Sed condimentum neque nisi, sit amet finibus lorem dapibus a. In in quam sit amet ipsum varius pellentesque vitae ut mauris. In hendrerit mi ante, sed pharetra turpis fringilla eu. Phasellus non volutpat dolor. Donec et efficitur nibh. Mauris congue consequat commodo. Praesent in tellus posuere, volutpat massa id, dapibus erat.

Etiam ultricies massa metus. Nunc in elementum quam. In hac habitasse platea dictumst. Maecenas fringilla eu nisi sed elementum. Aliquam dictum pretium commodo. Suspendisse aliquet nisl eu justo pellentesque, eu suscipit arcu tempor. Suspendisse tincidunt sed lorem id gravida. Praesent aliquet dolor a nibh tristique luctus. Vivamus porttitor viverra erat quis gravida. Morbi a turpis et tortor imperdiet cursus. Aliquam tempus orci erat, in lacinia mauris cursus in. Curabitur dapibus rutrum rutrum. Nullam porttitor ipsum fringilla quam vehicula fermentum. Quisque vulputate metus sem, sit amet pulvinar diam congue vitae. Interdum et malesuada fames ac ante ipsum primis in faucibus.

Suspendisse sed lorem eget est vestibulum accumsan scelerisque vitae nulla. Vestibulum vestibulum rhoncus sodales. Mauris vitae facilisis nisi. Vivamus non tincidunt turpis, eget faucibus est. Suspendisse erat neque, finibus ultrices metus eget, suscipit finibus magna. Integer dignissim eros sem, et dapibus dui vulputate quis. Donec augue metus, scelerisque nec commodo et, egestas sit amet nulla. Integer vel nisi ullamcorper nunc euismod egestas in blandit nulla. Vestibulum id hendrerit nulla.

Nulla facilisi. Nullam tempor consectetur sem tincidunt ornare. Integer dapibus sodales ante, a cursus urna dignissim sed. Nullam blandit leo id risus congue blandit. In feugiat accumsan elit ac finibus. In auctor lobortis sem quis iaculis. Mauris at vehicula ipsum. Curabitur eu rhoncus magna, ut accumsan metus. Fusce imperdiet, orci vitae egestas maximus, tortor felis sagittis velit, id pharetra dolor sapien a augue. Etiam posuere sit amet arcu ut sollicitudin. Praesent cursus scelerisque augue, in tincidunt quam malesuada at. Curabitur eget aliquam ex. Proin ut tempus tellus, sit amet imperdiet diam.
		[/div]
	[/div]
[/div]
[/div]
[div=font-size: 9px; text-align: center; opacity: 0.7;]coded by [user=26242]shady[/user].[/div]
[/nobr]