/* CSS declarations go here */
body
	padding: 10px
	font-family: sans-serif
	background-attachment: fixed
	position: absolute
	top: 0
	bottom: 0
	left: 0
	right: 0
	padding: 0
	margin: 0
	font-size: 14px

//.container
//	max-width: 600px
//	margin: 0 auto
//	min-height: 100%
//	background: white

header
	background: #d2edf4
	background-image: linear-gradient(to bottom, #d0edf5, #e1e5f0 100%)
	padding: 20px 15px 15px 15px
	position: relative

#login-buttons
	display: block

h1
	font-size: 1.5em
	margin: 0 0 1rem 0
	display: inline-block

form
	margin-top: 10px
	margin-bottom: -10px
	position: relative

.new-task input
	box-sizing: border-box
	padding: 10px 0
	background: transparent
	border: none
	width: 100%
	padding-right: 80px
	font-size: 1em

.new-task input:focus
	outline: 0

ul
	margin: 0
	padding: 0
	background: white

.delete
	float: right
	font-weight: bold
	background: none
	font-size: 1em
	border: none
	position: relative

li
	position: relative
	list-style: none
	padding: 15px
	border-bottom: #eee solid 1px

li .text
	margin-left: 10px

li.checked
	color: #888

li.checked .text
	text-decoration: line-through

li.private
	background: #eee
	border-color: #ddd

header .hide-completed
	float: right

.toggle-private
	margin-left: 5px

@media (max-width: 600px)
	li
		padding: 12px 15px

	.search
		width: 150px
		clear: both

	.new-task input
		padding-bottom: 5px

@import "./simple-grid.sass"