@font-face {
    font-family: "Choplin";
    src: url("fonts/Rene Bieder - Choplin Book.otf");
    font-style: normal;
}
body {
    background-image: url(pic/starring.png);
    background-color: #292a23;
    color: #214247;
    font-size: 15px;
    word-break: break-word;
    font-family: monospace;
}

.mainframe {
    display:flex column;
    padding: 20px 0 0 0;
    margin: 6% auto 0 auto;
    width: 600px;
    z-index: 1;
}

::selection {
  color: #7363bd;
  background: #5db372;
} 

.footer {
    flex: 1 1 100%;
    z-index: 20;
    transform: rotate(-4deg);
    background-image: url('ibanner.png');
    background-size: cover;
    background-position:right;
    height:130px;
    margin-bottom:7px;
}
.header {
    flex: 1 1 100%;
     z-index: 20;
    transform: rotate(-2deg);
    background-size: cover;
    background-position:left;
    height:130px;
    margin-bottom:-15px;
}
.boxone {
    
    flex: 1;
    border-radius:5px;
    background-color:#fffbd8;
    box-sizing: border-box;
    padding:25px;
}
.footer img:hover {
  filter: drop-shadow(10px 2px 0px #e3ff79);
  transform: rotate(5deg) scale(1.1);
  transition: 0.1s;
}

map {padding-left:65%;}

@media (max-width: 900px) {
    .mainframe {
        flex-direction: column;
        width: 90%;
    }
    
}