/* @import url(backgrounds01.css) not all and (hover: none); */
/* @import url(backgrounds01.css); */
@font-face {
    font-family:Cookie;
    src:url('res/cookie-regular.ttf');
}
body, html {
    padding:0;
    margin:0;
    border:0;
}
body{
    font-family: 'Cookie', sans-serial;
    color:#B7C0EC;
    background-image: linear-gradient(to bottom,#121642 0%, #243790 50%, #121642 100%);
    background-repeat:no-repeat;
    /* overflow-y: scroll; */
}

@media (min-width: 648px){
    
body, html {
    height: 100%;
}

#left, #textbox{
    height: 100%;
    display: inline-flex;
    box-sizing: border-box;
}
#left{width: 70%;
    justify-content: center;
    align-items: center;
}
#textbox{width: 30%;
    position:absolute; top:0;
    justify-content: center;
    align-items: end;
    flex-direction: column;
    font: 32px 'Cookie';
    color:#ffb;
    text-align:right;
    padding-right: 2%;
}

#textbox img{
    border-radius: 10px;
}
#flower{
    position:relative;
    aspect-ratio: 1.08/1;
    width: 98%;
    max-width:calc( 100vh - 24px );
}
#flower a {
    background-size:100% 100%;
    height:16.6666%;
    width:18%;
    border-radius:50%;
    display:inline-block;
    position:absolute;
}
div#links{
    position:absolute;
    bottom:2%;
    right:2%;
    cursor:pointer;
}

a div{
    width:100%;
    height:100%;
    opacity:.5;
    border-radius:50%;
}

#links > a > svg{
    width:5.2vw;
    min-width:48px;
    max-width:60px;
    height:2.6vw;
    min-height:24px;
    max-height:30px;
}
a#f11{top:0; left:41%;}
a#f12{top:8.3333%; left:57%;}
a#f13{top:25%; left:57%;}
a#f14{top:33.3333%; left:41%;}
a#f15{top:25%; left:25%;}
a#f16{top:8.3333%; left:25%;}
a#f17{top:16.6666%; left:41%;}
a#f21{top:50%; left:66%;}
a#f22{top:58.3333%; left:82%;}
a#f23{top:75%; left:82%;}
a#f24{top:83.3333%; left:66%;}
a#f25{top:75%; left:50%;}
a#f26{top:58.3333%; left:50%;}
a#f27{top:66.6666%; left:66%;}
a#f31{top:50%; left:16%;}
a#f32{top:58.3333%; left:32%;}
a#f33{top:75%; left:32%;}
a#f34{top:83.3333%; left:16%;}
a#f35{top:75%; left:0;}
a#f36{top:58.3333%; left:0;}
a#f37{top:66.6666%; left:16%;}
}