/* Main frame of website */

.mframe {
    display: grid;
    /* Left border width, fluid center content, right border width */
    grid-template-columns: 24px 1fr 24px;
    /* Top border height, fluid center content, bottom border height */
    grid-template-rows: 22px auto 6px;
    width: 100%;
}

/* 1. Fixed Corners (No Repeating) */
.mframe-tl {
    background-image: url('data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAHgAA/+4ADkFkb2JlAGTAAAAAAf/bAIQAEAsLCwwLEAwMEBcPDQ8XGxQQEBQbHxcXFxcXHx4XGhoaGhceHiMlJyUjHi8vMzMvL0BAQEBAQEBAQEBAQEBAQAERDw8RExEVEhIVFBEUERQaFBYWFBomGhocGhomMCMeHh4eIzArLicnJy4rNTUwMDU1QEA/QEBAQEBAQEBAQEBA/8AAEQgAFgAYAwEiAAIRAQMRAf/EAHEAAQADAQEAAAAAAAAAAAAAAAABAwQCBgEBAQEAAAAAAAAAAAAAAAAAAQIDEAABBAABCwUAAAAAAAAAAAABABECAxIxQSJScpKy0hNDBCFRYbFCEQABBAICAwAAAAAAAAAAAAABABFBEiFRccGxAkL/2gAMAwEAAhEDEQA/APayBnbY8paMgABKUQ2GJzEe6dMa09+fMp7t20OCKr8m7owEsjlnyt8rEtknZW4csBoeF30xrT358yLP4fkWWYhYXD6Mmb6RFhWzKq+1qvlae7dtDgiotwYD1PSOd0RUZ5KjXAVdUawQ0nH5ADBERER0n6ntf//Z');
}
.mframe-tr {
    background-image: url('data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAHgAA/+4ADkFkb2JlAGTAAAAAAf/bAIQAEAsLCwwLEAwMEBcPDQ8XGxQQEBQbHxcXFxcXHx4XGhoaGhceHiMlJyUjHi8vMzMvL0BAQEBAQEBAQEBAQEBAQAERDw8RExEVEhIVFBEUERQaFBYWFBomGhocGhomMCMeHh4eIzArLicnJy4rNTUwMDU1QEA/QEBAQEBAQEBAQEBA/8AAEQgAFgAYAwEiAAIRAQMRAf/EAGgAAQEBAQEAAAAAAAAAAAAAAAACAwEGAQADAQAAAAAAAAAAAAAAAAABAgMAEAACAQIEBwEAAAAAAAAAAAABAgAxAxEhEhNhUnKSstIEcREBAAICAwAAAAAAAAAAAAAAACFBEVFhgUL/2gAMAwEAAhEDEQA/APa7Y5n739o2xzP3v7TH6bv02iDbUOhwFCSCfwze3uaBu4azULQcKmRjS07SQUKsrPjrQZuxGBYA5ExO3KL1p5rE1jWeVxEQlRcovWnmsREFm89v/9k=');
}
.mframe-bl {
    background-image: url('data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAPAAA/+4ADkFkb2JlAGTAAAAAAf/bAIQABgQEBAUEBgUFBgkGBQYJCwgGBggLDAoKCwoKDBAMDAwMDAwQDA4PEA8ODBMTFBQTExwbGxscHx8fHx8fHx8fHwEHBwcNDA0YEBAYGhURFRofHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8f/8AAEQgABgAYAwERAAIRAQMRAf/EAGgAAAMAAAAAAAAAAAAAAAAAAAABCAEAAwAAAAAAAAAAAAAAAAAAAAEEEAACAQIHAQAAAAAAAAAAAAACAwEABBEhEtMUVJQTEQABAgQHAQAAAAAAAAAAAAABAAIRYRJSMVGR0SKS0qH/2gAMAwEAAhEDEQA/AKRcgpvbokXYBJGMtWaTORP5BGRQYRhp0zUjm8jA/JBWtfwbFpwzmZFLj3fdT52btKg3DQ7p1ttPYeUce77qfOzdooNw0O6K22nsPK//2Q==');
}
.mframe-br {
    background-image: url('data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAPAAA/+4ADkFkb2JlAGTAAAAAAf/bAIQABgQEBAUEBgUFBgkGBQYJCwgGBggLDAoKCwoKDBAMDAwMDAwQDA4PEA8ODBMTFBQTExwbGxscHx8fHx8fHx8fHwEHBwcNDA0YEBAYGhURFRofHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8f/8AAEQgABgAYAwERAAIRAQMRAf/EAGkAAAMAAAAAAAAAAAAAAAAAAAACCAEAAwAAAAAAAAAAAAAAAAAAAAEEEAACAQMFAQAAAAAAAAAAAAABAwIAEQQS0xRUlDERAAECAwgDAAAAAAAAAAAAAAEAAhESUiExQXGR0ZLSUWFC/9oADAMBAAIRAxEAPwCkOPl91PnZu1HIahod1dO2k8h1Rx8vup87N2iQ1DQ7onbSeQ6pZ489SjkZqysOUdMETiTIMiYC5ZK15WHylLaIuxGHvNMPvg0xgfoeMl//2Q==');
}

/* 2. Horizontal Borders (Repeat X) */
.mframe-t {
    background-image: url('data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAHgAA/+4ADkFkb2JlAGTAAAAAAf/bAIQAEAsLCwwLEAwMEBcPDQ8XGxQQEBQbHxcXFxcXHx4XGhoaGhceHiMlJyUjHi8vMzMvL0BAQEBAQEBAQEBAQEBAQAERDw8RExEVEhIVFBEUERQaFBYWFBomGhocGhomMCMeHh4eIzArLicnJy4rNTUwMDU1QEA/QEBAQEBAQEBAQEBA/8AAEQgAFgAEAwEiAAIRAQMRAf/EAFcAAQEBAAAAAAAAAAAAAAAAAAACBgEAAwAAAAAAAAAAAAAAAAAAAAEDEAEAAQUAAAAAAAAAAAAAAAAAAgFSktITEQEBAQEAAAAAAAAAAAAAAAAAARFR/9oADAMBAAIRAxEAPwDa86XTznsLEsi23oACf//Z');
    background-repeat: repeat-x;
}
.mframe-b {
    background-image: url('data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAPAAA/+4ADkFkb2JlAGTAAAAAAf/bAIQABgQEBAUEBgUFBgkGBQYJCwgGBggLDAoKCwoKDBAMDAwMDAwQDA4PEA8ODBMTFBQTExwbGxscHx8fHx8fHx8fHwEHBwcNDA0YEBAYGhURFRofHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8f/8AAEQgABgAKAwERAAIRAQMRAf/EAFoAAQEAAAAAAAAAAAAAAAAAAAAIAQEBAAAAAAAAAAAAAAAAAAAABBAAAQUBAAAAAAAAAAAAAAAAAwDTBBRUlBEAAQMFAAAAAAAAAAAAAAAAAQASUpHRApLS/9oADAMBAAIRAxEAPwCkK8vaHnI6o2GQobq5+MTsOUry9oecjqMMhQ3R+MTsOV//2Q==');
    background-repeat: repeat-x;
}

/* 3. Vertical Borders (Repeat Y) */
.mframe-l {
    background-image: url('data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAPAAA/+4ADkFkb2JlAGTAAAAAAf/bAIQABgQEBAUEBgUFBgkGBQYJCwgGBggLDAoKCwoKDBAMDAwMDAwQDA4PEA8ODBMTFBQTExwbGxscHx8fHx8fHx8fHwEHBwcNDA0YEBAYGhURFRofHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8f/8AAEQgABAAYAwERAAIRAQMRAf/EAFwAAAMAAAAAAAAAAAAAAAAAAAADCAEBAQEAAAAAAAAAAAAAAAAAAAQBEAABBAMAAAAAAAAAAAAAAAAAAQIDc7MENBEAAgIDAQAAAAAAAAAAAAAAAAFxAsEyQsL/2gAMAwEAAhEDEQA/AKQTv37m4IiN7WnCLuKx6Y0GAAf/2Q==');    background-repeat: repeat-y;
}
.mframe-r {
    background-image: url('data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAPAAA/+4ADkFkb2JlAGTAAAAAAf/bAIQABgQEBAUEBgUFBgkGBQYJCwgGBggLDAoKCwoKDBAMDAwMDAwQDA4PEA8ODBMTFBQTExwbGxscHx8fHx8fHx8fHwEHBwcNDA0YEBAYGhURFRofHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8f/8AAEQgACAAYAwERAAIRAQMRAf/EAFsAAAMAAAAAAAAAAAAAAAAAAAADCAEAAwAAAAAAAAAAAAAAAAAAAAIEEAABBQEAAAAAAAAAAAAAAAAAAjIDswR0EQACAgMBAAAAAAAAAAAAAAAAAUECcbFysv/aAAwDAQACEQMRAD8ApUjLQABGtsPRnvQLaMraHpPNvLP/2Q==');
    background-repeat: repeat-y;
}

/* 4. Center Content Box */
.mframe-content {
    background-color: #fcecdd;
    padding: 10px;             /* Padding so text doesn't touch the borders */
}
.mframe-content p {
    font-size: 115%;
}

/* Frame for Sidebar */
.bframe {
    display: grid;
    /* Left border width, fluid center content, right border width */
    grid-template-columns: 21px 1fr 4px;
    /* Top border height, fluid center content, bottom border height */
    grid-template-rows: 28px auto 5px;
    background-color: #fcecdd;
    width: 100%;
}

/* 1. Fixed Corners (No Repeating) */
.bframe-tl {
    background-image: url('data:image/gif;base64,R0lGODlhFQAcALMAAP/h0v+zjv/XxP/Ru//dzP+0kP/Zx//g0P+yjP/Tvv+2k//byv/ezv/Vwf/6+PajeyH5BAAAAAAALAAAAAAVABwAAASW8MlJqwU4682P/2AoMmRpniihrmzrLnAsz7Rh33iuC3zv/8CGcEgsGhPIpHLJHDif0Kh0OkBIEFSqQlGQBLLRhwIwuGoHCnR5a3181em0Wm1RJObxPLqSXmzjaH+BbAVpAmt/gIJbTgmHEoqJkpATkpaTE4WXm5ydnn8FoaKjpKUBp6ipqqsIra6vsLEWs7QOtre4uboRADs=');
}
.bframe-tr {
    background-image: url('data:image/gif;base64,R0lGODlhFAAcALMAAP/h0v+zjv+4lv/XxP/Aov/Ru//dzP+0kP/Zx//g0P+yjP/Tvv+8nP+6mP+2k/ajeyH5BAAAAAAALAAAAAAUABwAAAR/8MlJawU4672T/2AYGmRpnmiqruyJvHAsy0Nt33iu7/fi/8BgsEAsGo/IomWSPC4xSUJBSrgAENMsYautSqDc8HY8fmAGU7JaXQCs3/C4XM6o2+94fGPP7/v9AoGCg4SEDoeIiYqKB42Oj5CQAZOUlZaWCpmam5ycS59WHKIbEQA7');
}
.bframe-bl {
    background-image: url('data:image/gif;base64,R0lGODlhBAAFAJEAAPrJsfaje//6+P///yH5BAAAAAAALAAAAAAEAAUAAAIIXCSGmhAx4igAOw==');
}
.bframe-br {
    background-image: url('data:image/gif;base64,R0lGODlhBAAFAJEAAPrJsfaje//6+P///yH5BAAAAAAALAAAAAAEAAUAAAIIlDKGOhEwYiwAOw==');
}

/* 2. Horizontal Borders (Repeat X) */
.bframe-t {
    background-image: url('data:image/gif;base64,R0lGODlhlQAcALMAAP/h0v/KsP+zjv/PuP+4lv/XxP/Aov/Ms//Ru//dzP+0kP/Zx//Cpf/g0P+yjPajeyH5BAAAAAAALAAAAACVABwAAAT/8MlJq7046827/2AHjGRpnmiqrmzrvnDsNnRt33iu73zv/8Cg8JcoGo/IpHLJbDqf0Kh0Sq1ar9isdsvter/g52JMLpvP6LR6zW673/C4u0Cv2+/4vH7P7/v/gIGCg4SFhoeIiYgIjI2Oj5CRkpOUlZaXmJmam5ydnp+goaADpKWmp6ipqqusra6vsLGyrwe1tre4ubq7vL2+v8DBwsPAAcbHyMnKy8zNzs/Q0dLT1NXW19jZ2tvaDN7f4OHi4+Tl5ufo6err7O3u7/Dx8vPyBvb3+Pn6+/z9/v8AAwocSLCgwYMIEypcqJCAAYcQH0qMSHGixYoYL2rMyHGjx44gcz+KDEmRgMmTKFOqXMmypcuXMGPKnEmzps2bOHPq3Mmzp8+fQIPCVEC0qNGjSJMqXcq0qdOnUKNKfSqgqtWrWLNq3cq1q9evYMOKHQvWgdmzaNOqXcu2rdu3cOPKnUs3boi7ePPq3cs3g4y/gAMLHkxYRQQAOw==');
    background-repeat: repeat-x;
}
.bframe-b {
    background-image: url('data:image/gif;base64,R0lGODlhaQAFAJEAAPaje//////6+AAAACH5BAAAAAAALAAAAABpAAUAAAIklI+py+0Po5y02ouz3nyCD4biSJbmiabqGrTuC8fyTNf2jecFADs=');
    background-repeat: repeat-x;
}

/* 3. Vertical Borders (Repeat Y) */
.bframe-l {
    background-image: url('data:image/gif;base64,R0lGODlhBAAKAJEAAP////aje//6+AAAACH5BAAAAAAALAAAAAAEAAoAAAIKRCSGmtfrmIyuAAA7');
    background-repeat: repeat-y;
}
.bframe-r {
    background-image: url('data:image/gif;base64,R0lGODlhBAAKAJEAAP////aje//6+AAAACH5BAAAAAAALAAAAAAEAAoAAAIKlAKGmtfrmIyuAAA7');
    background-repeat: repeat-y;
}

/* 4. Center Content Box */
.bframe-content {
    background-color: #fcecdd; /* Or match your layout's body background */
    padding: 10px 10px 10px 0;             /* Padding so text doesn't touch the borders */
}