.sticky_note {
    width: max(90%, calc(100% - 16px));
    margin: 24px auto;
    height: calc(100vw / 6);
    max-width: 800px;
    max-height: 130px;
    box-shadow: 1px 2px 4px var(--shd);

    -moz-box-sizing: border-box;
    box-sizing: border-box;
    transition: box-shadow .5s;
}

.sticky_note_outer {
    position: relative;
}

.sticky_note .sticky_note_inner {

    width: 100%;
    height: 100%;
    
    text-align: start;
    display: flex;
    align-items: center;
}

.sticky_note a {
    width: 100%;
    height: 100%;
}

.sticky_note:hover {
    box-shadow: 6px 12px 12px var(--shd);
    
    display: flex;
    align-items: center;

    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.sticky_note .edge {
    display: inline-block;
    width: 20px;
    height: 100%;
}
.sticky_note .sticky_note_title {
    text-align: center;
    padding: 0 20px;
    min-width: 40%;
}
.sticky_note .sticky_note_title .subTitle {
    font-size: min(1em, 1.5vw);
}
.sticky_note .sticky_note_title .title {
    font-size: min(1.2em, 2.5vw);
    font-weight: bold;
}

.sticky_note img {
    height: 100%;
    flex-grow: 1;
    object-fit: cover;
}