#featured
	display: flex
	flex-direction: row
	height: 300px
	margin: 0 auto 20px
	padding: 5px
	background: none
	
	div
		position: relative
		background: none
		+transition(all, 200ms)
		
		&:hover
			box-shadow: 0 6px 20px 0 rgba(#000, 0.19), 0 8px 17px 0 rgba(#000, 0.2)
		
	.news
		display: block
		+size(420px 100%)
		margin-right: 10px
		background: url(/img/banner/oo-banner.jpg)
		background-size: 100% 100%
		border-radius: 5px
		
	.notes
		height: 100%
		padding: 0
		flex: 1
		
		#twitter-widget-0
			display: block
			width: 100% !important
			height: 100%

#wrapper-home
	display: block
	min-height: 300px
	padding: 0
	
	.content
		margin: 0
		padding: 0
	
	.actions
		#mailing-list
			p
				margin-bottom: 7px
				text-align: center
		
	.card
		display: block
		width: 100%
		height: auto
		margin-bottom: 15px
		padding: 15px 10px
		background: white
		
		.underline
			text-decoration: underline
			
		input[type=text]
			background: none
			border: none
			outline: none
			
		.input-group
			position: relative
			display: block
			width: 100%
			margin: 20px auto 10px
			
			input
				display: inline-block
				width: 100%
				padding: 10px 0
				border-bottom: solid 2px $main-color
				color: rgb(25, 25, 25)
				font-size: 16px
				
				&:focus, &:active
					outline: none
					
			label
				+position(absolute, 50% null null 0)
				+transform(translateY(-50%))
				font-style: italic
				font-size: 16px
				color: #999
				pointer-events: none
				+transition(all, 200ms ease-out 0s)
				
			input:focus + label,
			input.has-value + label
				top: -5px
				font-size: 12px
				color: $main-color