@import url('https://fonts.googleapis.com/css?family=Fira Sans');
@import url('https://fonts.googleapis.com/css?family=PT Mono');



.yukiEevee
{
background: -webkit-linear-gradient(top, #E28BF3 0%, #7F54D7 100%);
color: #FEF; text-shadow: 1px 1px rgba(20, 0, 20, 0.5);
font: 9pt 'Fira Sans', sans-serif;
}

.yukiEevee-m
{
background:
url('https://boxed.muncher.se/file_bin/layouts/eevee/eevee_noise.png') top left repeat,
url('https://boxed.muncher.se/file_bin/layouts/eevee/eevee_circles.png') top left repeat;
min-height: 270px;
padding: 25px 275px 25px 25px;
overflow: hidden;
position: relative;
}

.yukiEevee-s
{
background: url('https://boxed.muncher.se/file_bin/layouts/eevee/eevee_yuki.png') bottom right no-repeat;
height: 100%; min-height: 500px; width: 280px;
right: 0; top: 2px; pointer-events: none;
position: absolute;
}

.yukiEevee-p
{
background: rgba(100, 80, 100, 0.2);
border: 1px solid #757;
box-shadow: inset 1px 1px 0px rgba(255, 255, 255, 0.4), 1px 1px 0px rgba(255, 255, 255, 0.4);
border-radius: 4px;
padding: 4px;
}

.yukiEevee-f
{
padding: 0px 15px;
}

.yukiEevee .quote, .yukiEevee .code
{
position: relative; margin: 0px 4px;
}

.yukiEevee .quote:before
{
content: '"'; font-size: 20pt; position: absolute; top: -6px; left: 4px;
}

.yukiEevee .quote:after
{
content: '"'; font-size: 20pt; position: absolute; bottom: -24px; right: 8px;
}

.yukiEevee .quote > .box, .yukiEevee .code > .box
{
background: rgba(100, 80, 100, 0.3);
border: 1px solid #757;
box-shadow: inset 1px 1px 0px #CAC, 1px 1px 0px #CAC;
border-radius: 5px;
padding: 20px 4px 3px;
color: #FEF;
}

.yukiEevee .code > .box
{
font: 9.5pt 'PT Mono', monospace;
}

.yukiEevee .quote > .boxhead, .yukiEevee .code > .boxhead
{
position: absolute; top: 0px; left: 18px;
background: #757;
border: 1px solid #757;
box-shadow: inset 1px 1px 0px #CAC, 1px 1px 0px #CAC;
border-radius: 0px 0px 5px 5px;
padding: 2px 4px 0px;
font-size: 7.5pt;
color: #FEF;
}

.yukiEevee .code:before
{
content: '<'; font-size: 14pt; position: absolute; top: -10px; left: 4px;
}

.yukiEevee .code:after
{
content: '>'; font-size: 14pt; position: absolute; bottom: -9px; right: 4px;
}

.yukiEevee a
{
font-weight: bold; color: #FA9; transition: color .25s ease;
}

.yukiEevee a:hover, .yukiEevee a:active
{
color: #FCB; text-decoration: none;
}