.quote {
    padding: 20px 15px 20px 40px;
    background: #eef0ff;
    color: #5d5d5d;
    border-radius: 8px;
    margin-bottom: 10px;
    position: relative;
}

.quote::before {
    content: "";
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg fill='%230d6efd' width='20px' height='20px' viewBox='0 0 32 32' version='1.1' xmlns='http://www.w3.org/2000/svg'%3e%3cg id='SVGRepo_bgCarrier' stroke-width='0'%3e%3c/g%3e%3cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3e%3c/g%3e%3cg id='SVGRepo_iconCarrier'%3e%3ctitle%3equote%3c/title%3e%3cpath d='M9.563 8.469l-0.813-1.25c-5.625 3.781-8.75 8.375-8.75 12.156 0 3.656 2.688 5.375 4.969 5.375 2.875 0 4.906-2.438 4.906-5 0-2.156-1.375-4-3.219-4.688-0.531-0.188-1.031-0.344-1.031-1.25 0-1.156 0.844-2.875 3.938-5.344zM21.969 8.469l-0.813-1.25c-5.563 3.781-8.75 8.375-8.75 12.156 0 3.656 2.75 5.375 5.031 5.375 2.906 0 4.969-2.438 4.969-5 0-2.156-1.406-4-3.313-4.688-0.531-0.188-1-0.344-1-1.25 0-1.156 0.875-2.875 3.875-5.344z'%3e%3c/path%3e%3c/g%3e%3c/svg%3e");
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 15px;
    left: 15px;
}

code { 
    padding: 10px; 
    background: #3c444d;
    border-radius: 4px;
    display: block;
    font-family: Consolas, Arial, monospace, Sans-Serif;
    color: #eee;
    overflow-x: auto;
}