/* Wishlists */

.item-lists { }
.item-lists h2 { position: relative; display: flex; flex-direction: column; align-items: center; margin: 40px 20px 20px 20px; font-size: 20px; font-weight: lighter; line-height: 1.4em; text-align: center; }
.item-lists h2:before,
.item-lists h2:after { content: ""; position: absolute; z-index: -1; top: 25px; height: 10px; background: var(--background-alt-color); border-radius: 5px; }
.item-lists h2:before { left: 0; right: calc(50% + 50px); }
.item-lists h2:after { left: calc(50% + 50px); right: 0; }
.item-lists h2 i { margin-bottom: 10px; background: var(--main-color); color: var(--background-color); width: 60px; height: 60px; border-radius: 50%; font-size: 24px; text-align: center; line-height: 60px; display: block; }
.item-lists h2 span {  }
.item-lists nav { display: flex; flex-direction: row; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; margin: auto; padding: 20px 9px; }
.item-lists nav a { position: relative; z-index: 1; width: 374px; height: 290px; margin: 10px; padding: 0; cursor: pointer; }
.item-lists nav a .wrapper { position: relative; display: flex; flex-direction: column; width: 100%; height: 100%; }
.item-lists nav a.add-item-list { opacity: .5; }
.item-lists nav a .items { position: relative; display: flex; flex-direction: row; justify-content: center; }
.item-lists nav a .items .last-items { width: 374px; height: 250px; padding: 1px; display: flex; flex-direction: column; flex-wrap: wrap; border-radius: 7px; overflow: hidden; background: var(--background-alt-color); }
.item-lists nav a.add-item-list .items .last-items { justify-content: center; align-items: center; }
.item-lists nav a.add-item-list .items .last-items i { font-size: 42px; color: var(--main-color); }
.item-lists nav a .nb-items { position: absolute; z-index: 2; top: 0; left: 0; right: 0; height: 250px; display: flex; justify-content: center; align-items: center; }
.item-lists nav a .nb-items:not(.empty) { margin-left: 33%; }
.item-lists nav a h3 { color: var(--heading-color); padding: 2px 30px 0 10px; text-transform: uppercase; font-weight: lighter; line-height: 40px; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-lists nav a h3 i { margin: 0 5px 0 0; color: #ccc; }
.item-lists nav a .edit { position: absolute; right: 0; bottom: 0; padding: 10px; line-height: 20px; color: #ccc; cursor: pointer; }

@media (hover: hover) {
	.item-lists nav a:before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 0; border: solid 1px transparent; border-radius: 3px; transition: all .1s ease-in-out; }
	.item-lists nav a:hover:before { top: -10px; bottom: -10px; left: -10px; right: -10px; border-color: var(--main-color); }
	.item-lists nav a .edit { opacity: 0; }
	.item-lists nav a:hover .edit { opacity: 1; }
	.item-lists nav a .edit:hover { color: var(--main-color); }
}

@media screen and (max-width:1200px){
	.item-lists .wrapper { display: flex; flex-direction: row; justify-content: center; }
	.item-lists nav { width: 1000px; padding: 5px; }
	.item-lists nav a { margin: 20px; }
}

@media screen and (max-width:800px){
	.item-lists .wrapper { flex-direction: column; }
	.item-lists { width: auto; padding: 10px; }
	.item-lists h2 { margin: 20px 0 0 0; font-size: 18px; }
	.item-lists nav { width: auto; padding: 0; flex-direction: column; flex-wrap: nowrap; align-items: center; }
	.item-lists nav a { width: auto; height: auto; margin: 10px 0; order: 1; }
	.item-lists nav a:before { display: none; }
	.item-lists nav a:not(:first-of-type) { margin-top: 15px; }
	.item-lists nav a .edit { opacity: 1; }
	.item-lists nav a .items { margin-bottom: 0; }
	.item-lists nav a .items:after { top: -10px; bottom: auto; }
	.item-lists nav a .items .last-items { width: calc((100vw / 3 - 10px) * 3); height: calc((100vw / 3 - 10px) * 2); }
	.item-lists nav a .nb-items { height: calc((100vw / 3 - 10px) * 2); }
	.item-lists nav a.add-item-list { height: 60px; opacity: 1; order: 0; margin-top:10px; }
	.item-lists nav a.add-item-list:not(:first-of-type) { margin-bottom: 0; }
	.item-lists nav a.add-item-list .items { display: none; }
}