cr anastasia 3

--- USERNAME TEXT ---

#elementID {
font-family: 'gothik steel';
position: absolute;
z-index: 50;
left: 0.13em;
top: -2.35em;
}

--- ALL FONTS ---

@font-face {
font-family: 'gothik steel';
src: url(https://dl.dropbox.com/s/q85sqq5r38eahmn/Gothik%20Steel.ttf);
}

@font-face {
font-family: minecraftia;
src: url(https://dl.dropbox.com/s/qrro6u0lx00x66j/Minecraftia-Regular.ttf);
}

@font-face {
font-family:'fenotype';
src: url(https://dl.dropbox.com/s/klo6yfrf62916qp/02.10FEN.TTF);
}

@font-face {
font-family: B;
src: url(https://dl.dropbox.com/s/pefk842bs1sgr4w/04B_30__.TTF);
}

--- TOP LEFT CONTAINER ---

#elementID > .wrapper {
box-shadow: inset 13px 0px 6px -10px rgb(66 66 66 / 56%), inset -13px 0px 6px -10px rgb(66 66 66 / 56%), inset 0px 13px 6px -10px #ffffff, inset 0px -13px 6px -10px rgb(66 66 66 / 38%);
-webkit-filter: drop-shadow(0px 0px 3px #424242);
border-radius: 30px 0px;
height: 8em;
width: 10em;
overflow: auto;
z-index: 50;
position: absolute;
left: -3.15em;
bottom: -1em;
}

@media only screen and (max-width: 600px) {
#elementID > .wrapper {
left: -1.05em;
}
}

--- ABOUT & LIKES TEXTS ---

#elementID {
font-family: minecraftia;
background: #FFFFFFD1;
padding: 12px;
border-radius: 30px 0px;
}

--- BOTTOM LEFT CONTAINER ---

#elementID > .wrapper {
box-shadow: inset 13px 0px 6px -10px rgb(66 66 66 / 56%), inset -13px 0px 6px -10px rgb(66 66 66 / 56%), inset 0px 13px 6px -10px #ffffff, inset 0px -13px 6px -10px rgb(66 66 66 / 38%);
-webkit-filter: drop-shadow(0px 0px 3px #424242);
border-radius: 0px 30px;
height: 8em;
width: 10em;
overflow: auto;
z-index: 50;
position: absolute;
left: -3.15em;
top: 1.5em;
}

@media only screen and (max-width: 600px) {
#elementID > .wrapper {
left: -1.05em;
}
}

--- LINKS TEXT ---

#elementID {
font-family: minecraftia;
background: white;
padding: 12px;
border-radius: 0px 30px;
height: 3.5em;
}

--- BUTTONS ---

#elementID li a {
box-shadow: inset 7px 0 7px -7px white, inset -7px 0 7px -7px white, inset 0 -7px 7px -7px white;
border: 1px solid white;
font-family: B;
font-size: 0.7em;
}

--- TOP RIGHT CONTAINER ---

#elementID > .wrapper {
box-shadow: inset 13px 0px 6px -10px rgb(66 66 66 / 56%), inset -13px 0px 6px -10px rgb(66 66 66 / 56%), inset 0px 13px 6px -10px #ffffff, inset 0px -13px 6px -10px rgb(66 66 66 / 38%);
-webkit-filter: drop-shadow(0px 0px 3px #424242);
border-radius: 0px 30px;
height: 8em;
width: 10em;
overflow: auto;
z-index: 50;
position: absolute;
right: -3.7em;
bottom: -1em;
}

@media only screen and (max-width: 600px) {
#elementID > .wrapper {
right: -1.55em;
}
}

--- RULES TEXTS ---

#elementID {
font-family: minecraftia;
background: white;
padding: 12px;
border-radius: 0px 30px;
}

#elementID mark {
border-radius: 20px;
margin-left: -0.75em;
padding-left: 10px;
padding-right: 10px;
font-family: 'fenotype';
font-size: 12px;
}

@media only screen and (max-width: 600px) {
#elementID mark {
font-size: 9px;
}
}

--- BOTTOM RIGHT CONTAINER ---

#elementID > .wrapper {
box-shadow: inset 13px 0px 6px -10px rgb(66 66 66 / 56%), inset -13px 0px 6px -10px rgb(66 66 66 / 56%), inset 0px 13px 6px -10px #ffffff, inset 0px -13px 6px -10px rgb(66 66 66 / 38%);
-webkit-filter: drop-shadow(0px 0px 3px #424242);
border-radius: 30px 0px;
height: 8em;
width: 10em;
overflow: auto;
z-index: 50;
position: absolute;
right: -3.7em;
top: 1.5em;
}

@media only screen and (max-width: 600px) {
#elementID > .wrapper {
right: -1.55em;
}
}

--- FLOATING IMAGE ---

#elementID .frame {
animation-name: floating;
animation-duration: 3s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
position: absolute;
z-index: 50;
left: 5.5em;
bottom: -10.25em;
}

@media only screen and (max-width: 600px) {
#elementID .frame {
left: 7.8em;
bottom: -10.15em;
}
}

@keyframes floating {
0% {
transform: translate(0, 0px);
}
50% {
transform: translate(0, 15px);
}
100% {
transform: translate(0, -0px);
}
}

--- CREDITS TEXT ---

#elementID {
font-family: minecraftia;
position: absolute;
z-index: 50;
top: 14.35em;
left: 1.3em;
}