/* general */

body {
    font-family: Helvetica, Arial, sans-serif;
    margin: 0;
    font-size: 14px;
    background-color: #f6f6f6;
}
a, a:hover {
    text-decoration: none;
}
a, a:visited {
    color: #076acd;
}
a:hover {
    color: #f83c3c;
}
.nowrap {
    white-space: nowrap;
}
.inline-block {
    display: inline-block;
}
.smaller {
    font-size: smaller;
}

/* header */

header {
    padding-top: 1px;
    margin-bottom: -2px;
    text-align: center;
    font-style: italic;
}


header h1 {
    font-size: 21px;
    font-weight: 400;
    margin-bottom: 0.25em;
    font-family: 'Sanchez', 'Arial';
    margin-left: -32px;
}

.wypadki, .drogowe, .com {
    font-size: 42px;
}

header h1 img {
    width: 64px;
    height: 64px;
    vertical-align: -18px;
}

header h2 {
    font-size: 24px;
    margin-top: 0.25em;
    margin-bottom: 0.5em;
    font-weight: normal;
    font-family: 'Bitter', 'Arial';
}

h2 .inline-block:first-child {
    margin-left: 6px;
}

h2 .inline-block:last-child {
    margin-right: 6px;
}

header h1 .wypadki {
    color: #5757e8;
}

header h1 .drogowe {
    color: #ff5757;
}

header h1 .com, header h2 {
    color: #373737;
}

@media (max-width: 650px) { header h2 { font-size: 23px; } }
@media (max-width: 623px) { header h2 { font-size: 22px; } }
@media (max-width: 596px) { header h2 { font-size: 21px; } }
@media (max-width: 569px) { header h2 { font-size: 20px; } }
@media (max-width: 542px) { header h2 { font-size: 19px; } }
@media (max-width: 515px) { header h2 { font-size: 18px; } }
@media (max-width: 488px) { header h2 { font-size: 17px; } }
@media (max-width: 461px) { header h2 { font-size: 16px; } }
@media (max-width: 434px) { header h2 { font-size: 15px; } }


@media (max-width: 550px) {
    .header-color { display: block; }
    header h1 { margin-left: auto; }
}

@media (max-width: 480px) { .wypadki, .drogowe, .com { font-size: 41px; } }
@media (max-width: 468px) { .wypadki, .drogowe, .com { font-size: 40px; } }
@media (max-width: 455px) { .wypadki, .drogowe, .com { font-size: 39px; } }
@media (max-width: 443px) { .wypadki, .drogowe, .com { font-size: 38px; } }
@media (max-width: 430px) { .wypadki, .drogowe, .com { font-size: 37px; } }
@media (max-width: 418px) { .wypadki, .drogowe, .com { font-size: 36px; } }
@media (max-width: 405px) { .wypadki, .drogowe, .com { font-size: 35px; } }
@media (max-width: 393px) { .wypadki, .drogowe, .com { font-size: 34px; } }
@media (max-width: 380px) { .wypadki, .drogowe, .com { font-size: 33px; } }
@media (max-width: 368px) { .wypadki, .drogowe, .com { font-size: 32px; } }
@media (max-width: 356px) { .wypadki, .drogowe, .com { font-size: 31px; } }
@media (max-width: 343px) { .wypadki, .drogowe, .com { font-size: 30px; } }
@media (max-width: 331px) { .wypadki, .drogowe, .com { font-size: 29px; } }
@media (max-width: 318px) { .wypadki, .drogowe, .com { font-size: 28px; } }
@media (max-width: 306px) { .wypadki, .drogowe, .com { font-size: 27px; } }
@media (max-width: 293px) { .wypadki, .drogowe, .com { font-size: 26px; } }
@media (max-width: 281px) { .wypadki, .drogowe, .com { font-size: 25px; } }
@media (max-width: 268px) { .wypadki, .drogowe, .com { font-size: 24px; } }
@media (max-width: 256px) { .wypadki, .drogowe, .com { font-size: 23px; } }
@media (max-width: 244px) { .wypadki, .drogowe, .com { font-size: 22px; } }

#contact {
    text-align: center;
    margin-bottom: 5px;
}

#contact #mail {
    vertical-align: -2px;
}

#contact svg {
    margin: 9px;
}

#contact a {
    color: black;
    font-size: 0;
}

/* general page-container */

#page-container {
    display: flex;
    width: 95%;
    min-height: 400px;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
}
#page-container main {
    flex-grow: 1;
}

/* left nav */

nav .main-link, nav p {
    display: block;
    padding-top: 7px;
    padding-bottom: 7px;
    font-weight: bold;
    margin-top: 0;
    margin-bottom: 0;
    text-decoration: none;
}
nav .main-link {
    color: #337ab7;
}
nav .main-link:hover {
    background-color: #e0e0e0;
    text-decoration: none;
    color: #23527c;
}
nav .main-link:focus {
    text-decoration: underline;
}
nav ul {
    margin-top: 0;
    margin-bottom: 0;
}
nav li {
    list-style-type: none;
    line-height: 2em;
}

/* media */

@media (max-width: 597px) {
    #page-container {
        flex-direction: column;
        width: 100%;
    }
}

/* expanding */

.fade-out, .expand-button {
    display: none;
}


/* main */

main {
    color: #3a3a3a;
}

.najnowsze-informacje .add-date, .post .add-date, .sprawa-medialna .ostatnia-aktualizacja {
    font-size: smaller;
    font-style: italic;
    color: darkgray;
}

@media (max-width: 879px) {
    main h1 {
        font-size: 36px;
    }
}
@media (max-width: 779px) {
    main h1 {
        font-size: 32px;
    }
}
@media (max-width: 679px) {
    main h1 {
        font-size: 28px;
    }
}
main h2, main h3 {
    margin-top: 10px;
    margin-bottom: 10px;
    color: #444;
    font-weight: 300;
}
main h2 {
    font-size: 24px;
}
main h3 {
    font-size: 18px;
}
.h-underline {
    border-bottom: 1px solid gray;
    padding-bottom: 5px;
}

@media (max-width: 350px) { main h2 { font-size: 22px; } }
@media (max-width: 300px) { main h2 { font-size: 20px; } }
@media (max-width: 250px) { main h2 { font-size: 18px; } }

.najnowsze-informacje hr, .post hr, .dodatkowe-informacje hr {
    border: none;
    height: 2px;
    background-image: repeating-linear-gradient( to right, #b6b6b6 0, #b6b6b6 2px, transparent 2px, transparent 8px );
    display: block;
}

img.pdf_icon {
    height: 14px;
}

img.hammer_icon {
    height: 16px;
    vertical-align: -3px;
}

/* footer */

footer {
    color: #585858;
    font-size: 10px;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px;
}
footer p {
    margin-top: 0;
    margin-bottom: 0;
}