#aeu-emulator {
    display: flex;
    justify-content: center;

    .emulator-frame {
        display: flex;
        flex-direction: row;
        position: relative;


        .left-frame {
            display: flex;
            flex-direction: column;
            width: 898px;
            height: 714px;
            padding: 10px;

            .cpc-bezel {
                position: absolute;
                display: flex;
                padding: 0px 10px 0px 10px;
                width: 868px;
                height: 694px;
                background-image: url(images/cpc_bezel.png);
                background-repeat: no-repeat;
                user-select: none;
                pointer-events: none;
                z-index: 2;
            }

            .cpc-screenshot {
                position: absolute;
                display: none;
                top: 86px;
                left: 113px;
                width: 672px;
                height: 476px;
                overflow: hidden;
                background-size: cover;
                background-repeat: no-repeat;
                background-position: 0px 0px;
                z-index: 1;
            }

            .cpc-power {
                display: flex;
                position: absolute;
                left: 803px;
                top: 630px;
                width: 60px;
                height: 60px;
                cursor: pointer;
                z-index: 3;
            }

            iframe {
                display: flex;
                position: relative;
                top: 76px;
                margin-left: auto;
                margin-right: auto;
                width: 672px;
                height: 476px;
            }
        }
        .right-frame {
            display: flex;
            flex-direction: column;
            width: 350px;
            padding: 10px;
            padding-top: 20px;

            input {
                display: flex;
                width: 100%;
                height: 40px;
                margin-bottom: 5px;
                background-color: #282828 !important;
                border: 1px solid #bbbbbb;
            }

            ul {
                display: flex;
                flex-direction: column;
                margin:0px;
                padding: 0px;
                border-radius: 5px;
                list-style-type: none;
                border: 1px solid #999999;
                max-height: 634px;
                overflow-y: auto;
                scrollbar-width: thin;
                scrollbar-color: #282828 #181818;
                li {
                    display: flex;
                    padding: 5px;
                    border-bottom: 1px solid #999999;
                    justify-items: center;
                    user-select: none;
                    cursor: pointer;

                    .text {
                        display: inline;
                        justify-self: center;
                    }

                    .icon {
                        display: inline-flex;
                        width: 32px;
                        height: 32px;
                        margin-right: 5px;
                        background-size: 32px 32px;
                        background-repeat: no-repeat;
                        background-position: center;
                    }
                    .dsk {
                        background-image: url(images/dsk_64x64.png);
                    }
                    .sna {
                        background-image: url(images/sna_64x64.png);
                    }

                    &:last-child {
                        border: none;
                    }

                    &:hover {
                        color: #222222;
                        background-color: #999999;
                    }

                }
            }

        }
    }
}