/*
 * Name: 
 * Author: 
 * Website: 
 */
/*
 * Name: Floette
 * Author: Azure
 * Website: https://ballonlea.net/
 */

@import url("https://fonts.upset.dev/css2?family=Chewy:wght@400&display=swap");

::selection {
background: #ffb9df;
color: white;
}

body {
background: repeating-linear-gradient(
45deg,
#ffe3ec,
#ffe3ec 10px,
#ffffff 10px,
#ffffff 20px
);
}

main {
margin: 10px;
background-color: white;
border: 4px dashed #a6e266;
border-radius: 5px;
width: 50rem !important;
}

a {
color: #6f9744;
transition: 0.3s ease;
}

a:hover {
color: #d8a9c3 !important;
}

.column1 {
background-image: radial-gradient(rgb(255, 229, 238) 30%, transparent 30%);
background-position: 4px 4px;
background-size: 8px 8px;
}

.column2 {
padding: 20px;
}

.column2 h3,
.column2 h4,
.column2 h5 {
font-family: "Chewy", system-ui !important;
color: #c37e8f;
font-weight: 100 !important;
}

nav {
margin: 10px;
}

nav ul li a {
transition: 0.3s ease;
color: #5c5346;
text-decoration: none;
}

nav ul li a:hover {
color: #b8677c !important;
text-decoration: underline;
}

.column2 ul {
list-style: none;
}

.column2 ul li:before {
content: "\2665";
color: #f7adbf;
padding-right: 5px;
}

.dropdown-content a:hover {
color: #b8677c !important;
}

.header h1 {
font-family: "Chewy", system-ui !important;
}

h1 a {
color: #deffa2 !important;
text-decoration: none;
font-family: "Chewy", system-ui !important;
text-shadow: 1px 1px #6f9744, -1px 1px #6f9744, 1px -1px #6f9744,
-1px -1px #6f9744;
filter: drop-shadow(2px 0 0 white) drop-shadow(0 2px 0 white)
drop-shadow(-2px 0 0 white) drop-shadow(0 -2px 0 white)
drop-shadow(0px 1px 1px #b76479) drop-shadow(0px 1px 1px #b76479);
}

h1 a:hover {
color: #deffa2 !important;
font-family: "Chewy", system-ui !important;
}

h2 {
font-family: "Chewy", system-ui !important;
background: linear-gradient(#f7adbf, #cc788d);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
filter: drop-shadow(0px 1px black) drop-shadow(0 -1px black)
drop-shadow(1px 0 black) drop-shadow(-1px 0 black);
}

#footer a:hover {
color: #d8a9c3 !important;
text-decoration: underline !important;
}

pre {
background: #f1ffd7;
color: #6f9744;
padding: 15px;
overflow: auto;
margin: 10px;
}

img {
filter: grayscale(100%) sepia(100%) hue-rotate(-80deg) contrast(90%);
transition: 0.3s ease;
}

img:hover {
filter: none;
}

@media screen and (min-width: 950px) {
.container {
position: static !important;
transform: translate(0) !important;
width: 70rem !important;
max-width: 100%;
padding: 10px;
margin: 0 auto;
}
}