/* --- PIXELATE BIRD S'IL VOUS PLAIT --- */

#melonGuild-7 .melonGuild-links img {
	image-rendering: pixelated;
}

/* --- SIZING & RESPONSIVENESS --- */

#melonGuild-7.melonGuild {
	width: 310px;
	max-width: calc(100% - 12px);
	margin: 10px auto;
	flex-flow: row;
	word-break: break-word;
	gap: 5px;
	justify-content: center;
	container-type: inline-size;
	container-name: natureguild;
}

@container natureguild (width < 310px) {
	#melonGuild-7 .melonGuild-info b,
	#melonGuild-7 .melonGuild-info a,
	#melonGuild-7 .melonGuild-prev,
	#melonGuild-7 .melonGuild-next {
		font-size: 12px;
	}
}

/* --- CHANGING DISPLAY TEXT --- */

#melonGuild-7 .melonGuild-info span {
    display: none;
}

#melonGuild-7 .melonGuild-info b::after {
    content: ' Webring';
}

/* --- BIG ARROWS --- */

#melonGuild-7 .melonGuild-prev,
#melonGuild-7 .melonGuild-next {
    font-size: 0;
	text-decoration: none;
}

#melonGuild-7 .melonGuild-prev::before,
#melonGuild-7 .melonGuild-next::after {
    font-size: 2.75rem; 
}

#melonGuild-7 .melonGuild-prev::before {
	content: '\25C0';
	margin-right: 0;
}

#melonGuild-7 .melonGuild-next::after {
  content: '\25B6';
  margin-left: 0;
}

/* --- STYLE FOR TITLE --- */

#melonGuild-7 .melonGuild-info b {
    margin-bottom: 2px; 
    letter-spacing: 1px;
    font-style: italic;
}

/* --- COLORS --- */

#melonGuild-7.melonGuild {
	border: 1px solid darkgreen;
	background-image: url("https://textures.neocities.org/textures/nature-and-earth/073C.jpg");
	background-size: 150px;
	padding: 5px;
	font-family: Times New Roman, serif;
	color: black;
}

#melonGuild-7 .melonGuild-info {
    background: #c8daa6;
    padding: 5px 7px;
    border: 3px solid yellowgreen;
    font-size: 16px;
}

#melonGuild-7 .melonGuild-links a {
    color: darkgreen; 
}

#melonGuild-7 .melonGuild-links a:hover,
#melonGuild-7 .melonGuild-links a:focus {
    color: purple; 
    text-decoration-thickness: 2px;
    text-decoration-color: yellow;
}

#melonGuild-7 .melonGuild-prev,
#melonGuild-7 .melonGuild-next {
    color: #c8daa6;
}

#melonGuild-7 .melonGuild-prev:hover,
#melonGuild-7 .melonGuild-prev:focus,
#melonGuild-7 .melonGuild-next:hover,
#melonGuild-7 .melonGuild-next:focus {
    color: yellow;
}