* {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}

body {
	margin: 0;
}

.content {
	margin: 10px;
}

.topbar {
	position: relative;
	padding:  8px;
}

.title {
	padding-left: 20px;
}

#page-name {
	padding-top:    20px;
	padding-bottom: 20px;
}

#logo {
	width:     100%;
	max-width: 100px;
}

#logo img {
	width: 100%;
}

.left {
	width: 49%;
	float: left;
}

.right {
	width: 49%;
	float: right;
}

footer, .boundary {
	clear: both;
}

section {
	padding:       14px;
	margin-top:    10px;
	margin-bottom: 10px;
}

header {
	margin-bottom: 8px;
}

.inline {
	display:       inline-block;
	padding-right: 0.5rem;
}

.inline + input {
	width: 66%;
}

input, textarea, select {
	width:         100%;
	max-width:     400px;
	margin-top:    5px;
	margin-bottom: 5px;
}

input[type='checkbox'] {
	width: auto;
}

fieldset {
	padding: 50px 14px 14px 14px;
	margin:  20px -14px -14px -14px;
}

legend {
	margin-bottom: -50px;
}

button {
	padding: 8px;
}

button.small {
	padding: 5px;
}

li {
	margin-bottom: 10px;
}

.button-bar {
	text-align: right;
	margin-top: 20px;
	max-width:  400px;
}

.input-width {
	max-width: 400px;
}

.grid > .span1 {
	display: inline-block;
	width:   8.3333%;
}
.grid > .span2 {
	display: inline-block;
	width:   16.6666%;
}
.grid > .span3 {
	display: inline-block;
	width:   24.9999%;
}
.grid > .span4 {
	display: inline-block;
	width:   33.3332%;
}
.grid > .span5 {
	display: inline-block;
	width:   41.6665%;
}
.grid > .span6 {
	display: inline-block;
	width:   49.9998%;
}
.grid > .span7 {
	display: inline-block;
	width:   58.3331%;
}
.grid > .span8 {
	display: inline-block;
	width:   66.6664%;
}
.grid > .span9 {
	display: inline-block;
	width:   74.9997%;
}
.grid > .span10 {
	display: inline-block;
	width:   83.333%;
}
.grid > .span11 {
	display: inline-block;
	width:   91.6663%;
}
.grid > .span12 {
	display: inline-block;
	width:   100%;
}

.btn-box {
	padding-left: 5px;
}

.btn-box > button {
	width: 100%;
}

.close-button {
	text-align:    right;
	padding-right: 5px;
}

.failure.msg, .success.msg {
	display: table;
	width:   100%;
}

.failure.msg > div,
.success.msg > div {
	display:        table-cell;
	vertical-align: top;
	height:         100%;
}

.failure.msg > .span11,
.success.msg > .span11 {
	padding: 10px;
}

.group {
	margin-bottom: 15px;
}

.invert-group {
	margin-top: 15px;
}

.hole-width {
	width: 100%;
}

.small-form {
	position:    absolute;
	width:       280px;
	height:      210px;
	top:         50%;
	left:        50%;
	margin-top:  -105px;
	margin-left: -140px;
	padding:     10px;
}

.small-form button {
	position: absolute;
	top:      165px;
	right:    10px;
}

@media (min-width:800px) {
	section.do-not-adapt {
		width:        800px;
		margin-left:  auto;
		margin-right: auto;
	}
}

@media (min-width:1500px) {
	section:not(.do-not-adapt) {
		width:        32%;
		margin-left:  0.5%;
		margin-right: 0.5%;
	}
}

.label+div {
	padding-left: 10px;
}

div.success, div.failure {
	margin-bottom: 10px;
}