:root {
    --font: 'Yanone Kaffeesatz';
    --weight: 700;
    --light-color-one: darkturquoise;
    --light-color-two: gold;
    --dark-color-one: darkcyan;
    --dark-color-two: darkgoldenrod;
}

nav {
    background-image: linear-gradient(to right, var(--light-color-one), var(--light-color-two));
    border-bottom: 1px solid white;
}

.name {
    font-size: 4.5em;
    font-family: var(--font);
    font-weight: var(--weight);
    color: transparent;
    background-clip: text;
    background-image: linear-gradient(to right, var(--dark-color-one), var(--dark-color-two));
}

.bright {
    background-image: linear-gradient(to left, cyan, var(--light-color-two)) !important;
}

.smallName {
    font-family: var(--font);
    font-weight: var(--weight);
    font-size: 3em;
    color: transparent;
    background-clip: text;
    background-image: linear-gradient(to left, var(--dark-color-one), var(--dark-color-two));
}

.action {
    font-size: 3em;
    font-family: var(--font);
    font-weight: var(--weight);
    color: transparent;
    background-clip: text;
    background-image: linear-gradient(to left, var(--dark-color-one), var(--dark-color-two));
}

p {
    font-size: 2em;
    font-family: 'Dosis';
    color: white;
}

textarea {
    font-size: 1.5em;
    font-family: 'Dosis';
    background-color: transparent !important;
    color: black;
}

input {
    color: transparent;
    background-clip: text;
    background-image: linear-gradient(to left, cyan, var(--light-color-two));
    font-family: var(--font);
    font-weight: var(--weight);
    font-size: 0.75em;
    background-color: #1a1a1a;
    border: 1px solid white;
    caret-color: white;
    outline-color: white;
}

button {
    font-family: var(--font);
    font-size: 3.5em;
    background-color: transparent;
    border: 1px solid white;
    font-weight: var(--weight);
    color: transparent;
    background-clip: text;
    background-image: linear-gradient(to left, cyan, var(--light-color-two));
}

.dark {
    background-image: linear-gradient(to left, var(--dark-color-one), var(--dark-color-two)) !important;
}

img {
    font-family: 'Dosis';
    color: white;
    border: 1px solid white;
}

.text {
    background-image: linear-gradient(to right, var(--light-color-one), var(--light-color-two)) !important;
    border: 1px solid white;
}

body {
    background-image: linear-gradient(to right, var(--dark-color-one), var(--dark-color-two)) !important;
}

.border {
    border: 1px solid white;
}

.title {
    font-size: 5em;
}

i {
    background-image: linear-gradient(to right, var(--light-color-one), var(--light-color-two));
}

.eye {
    border: none !important;
    font-size: 0.5em !important;
}