body
{	padding:3px;
	font-family:Verdana;
	color:#375730;
	background:#DFE3DE;
}

.hidden
{
    display: none;
}

a
{   color:#C32A2C;
	font-weight:bold;
	text-decoration:none;
}

a:hover
{   text-decoration:underline;
}

a:visited
{   color:#C32A2C;
}

h1
{	font-size:140%;
	font-weight:bold;
}

a.back-arrow {
    font-size: 20px;
}

div.logo {
	border: 10px solid #375730;
	border-radius: 25px;
	text-shadow: 10px 10px #CDD3CB;
	font-size: 50pt;
	color: #375730;
	font-weight: bold;
    padding: 10px 20px 15px 5px;
    margin-bottom: 20px;
	float:left;
	clear: both;
}

div.logo a, div.logo a:visited, div.logo a:hover {
	color: #375730;
	text-decoration: none;
}

div.logo:hover {
	background-color: #CDD3CB;
}

div.content {
	float: left;
	background: #ffffff;
	border: 2px solid #375730;
	border-radius: 10px;
	padding: 10px;
	clear: both;
	min-width: 555px;
}

div.group {
	border: 1px solid #cdd3cb;
	padding: 5px;
	border-radius: 5px;
	margin-bottom: 5px;
}

button{
	display: inline;
	color: #c32a2c;
	font-weight: bold;
	text-decoration: none;
	border: none;
	background: transparent;
	padding: 0px;
	font-size: 17px;
	cursor: pointer;
}

button:hover {
	text-decoration: underline;
}

ul li {
	border: 1px solid transparent;
}

ul li.view:hover {
	background-color: #eeeeee;
}

ul li i:hover {
	background-color: #eeeeee;
}

ul li.view span.edit,
ul li.edit span.view {
	display: none;
	visibility: hidden;
}

ul li.view span.view,
ul li.edit span.edit {
	display: inline;
	visibility: visible;
}

ul li.edit span.edit{
	background-color:#dddddd;
	padding:3px;
	display:inline-block;
}

.float-right {
	float: right;
}

.inline {
	display: inline;
}

.inline-block {
	display: inline-block;
}

form.inline, form.inline-block {
	margin: 0px;
}

.gift-controls {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 0.75em;
}

.gift-list
{
    padding-inline-start: 0;

    &:not( .editing-on ) .edit-control {
        visibility: hidden;
    }
}

.person-list-item
{
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.75em;
}

.add-item-container
{
    margin-top: 2em;

    .add-item-input-container {
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 0.5em;
    }

    button:not( .hidden ) {
        display: block;
        margin: 0.5em auto;
    }
}