article {
    margin-left: 1rem;
}

header {
    font-size: 2.0rem;
    font-weight: bold;
    margin-left: -1rem;
    padding-bottom: 10px;
}

/* dodawanie gwiazdki 16x16px za obiektem */

.star:before {
    content: url('/sysImg/star.png');
}

#editable_content a[href^="/"]:before {
    height: 16px;
    width: 16px;
    background: url('/sysImg/favicon-16x16.png');
    display: inline-block;
    content: '';
    margin-right: 5px;
    margin-bottom: middle;
}

a[href*="github.com/"]:before,
a[href*="github.io/"]:before {
    height: 20px;
    width: 20px;
    background: url('/sysImg/linkIcons/github20x20.png');
    display: inline-block;
    content: '';
    margin-right: 5px;
    margin-bottom: -4px;
}

a[href*="youtube.com/"]:before {
    height: 20px;
    width: 28px;
    background: url('/sysImg/linkIcons/youtube20x28.png');
    display: inline-block;
    content: '';
    margin-right: 5px;
    margin-bottom: -4px;
}

a[href*="google.com/"]:before {
    height: 20px;
    width: 20px;
    background: url('/sysImg/linkIcons/google20x20.png');
    display: inline-block;
    content: '';
    margin-right: 5px;
    margin-bottom: -4px;
}

a[href*="instagram.com/"]:before {
    height: 20px;
    width: 20px;
    background: url('/sysImg/linkIcons/instagram20x20.png');
    display: inline-block;
    content: '';
    margin-right: 5px;
    margin-bottom: -4px;
}

a[href*="facebook.com/"]:before {
    height: 20px;
    width: 20px;
    background: url('/sysImg/linkIcons/facebook20x20.png');
    display: inline-block;
    content: '';
    margin-right: 4px;
    margin-bottom: -4px;
}

a[href*="allegro.pl/"]:before {
    height: 20px;
    width: 15px;
    background: url('/sysImg/linkIcons/allegro20x17.png');
    display: inline-block;
    content: '';
    margin-right: 5px;
    margin-bottom: -4px;
}

a[href*="aliexpress.com/"]:before {
    height: 20px;
    width: 20px;
    background: url('/sysImg/linkIcons/aliexpress24x24.png');
    display: inline-block;
    content: '';
    margin-right: 5px;
    margin-bottom: -4px;
    background-size: 100%;
}

/* dodawanie ikon do PDF */
a[href$=".pdf"]:before {
    height: 20px;
    width: 20px;
    background: url('/sysImg/linkIcons/pdf20x20.png') no-repeat left center;
    display: inline-block;
    content: '';
    margin-right: 5px;
    margin-bottom: -4px;
}

/* dodawanie ikon do doc i docx */
a[href$=".doc"]:before,
a[href$=".docx"]:before {
    height: 20px;
    width: 20px;
    background: url('/sysImg/linkIcons/word24x24.png') no-repeat left center;
    display: inline-block;
    content: '';
    margin-right: 5px;
    margin-bottom: -4px;
}

/* github.com/ */

pre {
    font-family: "Courier New,Courier,Lucida Sans Typewriter,Lucida Typewriter,monospace";
    font-size: 12px;
    line-height: 18px;
    tab-size: 8;
    min-width: 50%;
    background: #f4f4f4;
    color: #393052;
    letter-spacing: 1px;
    padding: 4px;
    margin: 5px 0;
    display: inline-block;
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word;
}

code {
    cursor: pointer;
}

code:before {
    height: 16px;
    width: 16px;
    background: url('/sysImg/copy-icon.svg');
    display: inline-block;
    content: '';
    margin-right: 5px;
    margin-bottom: -4px;
}

/* klasy dla kolorowania składni skrptem js */

.code_cpp {
    border-left: 3px solid DodgerBlue;
}

.code_php {
    border-left: 3px solid MediumSeaGreen;
}

.code_css {
    border-left: 3px solid Yellow;
}

.code_matlab {
    border-left: 3px solid Orange;
}

.code_asm {
    border-left: 3px solid LightGray;
}

.code_asmAVR {
    border-left: 3px solid Tomato;
}

/* klasy które wykorzystuje skrypt zmieniający kolory kodu */

.c_green {
    color: #09ae00;
}

.c_blue {
    color: DODGERBLUE;
}

.c_skyblue {
    color: DEEPSKYBLUE;
}

.c_red {
    color: red;
}

.c_grey {
    color: grey;
}

.c_pink {
    color: SALMON;
}

.c_orange {
    color: orange;
}

.c_khaki {
    color: khaki;
}