@media screen {    
    /* Glass */

    body {
        margin: 20px;
        font-family: 'Segoe UI', Calibri, Arial, FreeSans, 'Lucida Grande', Verdana, Helvetica, sans-serif;
        cursor: default;
        font-size: 0.9em;
    }

    a {
        outline-style: none;
    }

    #main {
        width: 908px;
        margin: 0px auto;
    }

    #top-glass > div.c, #bottom-glass > div.c {
        background-repeat: repeat-x;
        height: 24px;
        margin: 0px 24px 0px 24px;
    }

    #top-glass > div.r, #top-glass > div.l, #bottom-glass > div.r , #bottom-glass > div.l  {
        background-repeat: no-repeat;
        width: 24px;
        height: 24px;
    }

    #top-glass > div.c {
        background-image: url('glass-t.png');
    }

    #top-glass > div.r {
        background-image: url('glass-tr.png');
        float: right;
    }

    #top-glass > div.l {
        background-image: url('glass-tl.png');
        float: left;
    }

    #bottom-glass > div.c {
        background-image: url('glass-b.png');
    }

    #bottom-glass > div.r {
        background-image: url('glass-br.png');
        float: right;
    }

    #bottom-glass > div.l {
        background-image: url('glass-bl.png');
        float: left;
    }

    #glass-mid div.r, #glass-mid div.l {
        background-repeat: repeat-y;
    }

    #glass-mid div.r {
        background-image: url('glass-r.png');
        background-position: right top;
    }

    #glass-mid div.l {
        background-image: url('glass-l.png');
        background-position: left top;
    }

    #glass-mid  #content {
        margin-left: 4px;
    }

    #menu {
        width: 868px;
        height: 48px;
        margin: -4px 0px 0px 16px;
        position: absolute;
    }

    #menu ul {
        margin: 0px;
        list-style-type: none;
        padding: 0px;
    }

    #menu > #primary li {
        float: left;
    }

    #menu > #primary li > a {
        background-repeat: no-repeat;
        background-position: center top;
        height: 48px;
        display: block;
        font-size: 1.3em;
        color: #303030;
        text-decoration: none;
        text-indent: 8px;
        line-height: 44px;
        text-shadow: 0px 1px 0px #d0d0d0;
    }

    #menu > #primary li > a:hover {
        background-position: center bottom;
        color: #ffffff;
        text-shadow: 0px 1px 1px #808080;
    }

    #menu > #primary li a.l {
        background-image: url('menu-l.png');
        width: 176px;
        text-indent: 12px;
    }

    #menu > #primary li a.r {
        background-image: url('menu-r.png');
        width: 176px;
    }

    #menu > #primary li a.n {
        background-image: url('menu-c.png');
        width: 172px;
    }

    #menu #secundary {
        margin-left: -4px;
        display: none;
        position: relative;
        z-index: 2;
    }

    #menu #secundary a {
        background-image: url('menu-s.png');
        background-repeat: no-repeat;
        width: 181px;
        margin-left: -1px;
        margin-top: -4px;
        height: 39px !important;
        line-height: 33px !important;
        text-shadow: none !important;
    }

    #menu > #primary > #expand:hover ul {
        display: inherit;
    }

    #content > #ms {
        height: 40px;
    }

    #content > #theme {
        background-repeat: no-repeat;
        margin-left: 20px;
        width: 860px;
        height: 220px;
    }

    #content-top {
        background-image: url('content-top.png');
        background-repeat: repeat-x;
        height: 15px;
        width: 860px;
        margin-left: 20px;
    }

    #content-main {
        width: 860px;
        margin-left: 20px;
        background-color: #ffffff;
    }

    #content-bottom {
        clear: both;
        width: 860px;
        margin-left: 20px;
    }

    #content-bottom > div.r, #content-bottom > div.l {
        background-repeat: no-repeat;
        width: 15px;
        height: 15px;
    }

    #content-bottom > div.c {
        background-image: url('content-b.png');
        background-repeat: repeat-x;
        margin: 0px 15px 0px 15px;
        height: 15px;
    }

    #content-bottom > div.r {
        background-image: url('content-r.png');
        float: right;
    }

    #content-bottom > div.l {
        background-image: url('content-l.png');
        float: left;
    }

    #column {
        width: 200px;
        float: right;
        margin-bottom: 30px;
    }

    .rightColumn .col-t, .rightColumn .col-b {
        background-repeat: no-repeat;
        height: 37px;
        width: 12px;
        position: absolute;
        margin-left: -10px; /* !TODO příčina?? */
    }

    .rightColumn .col-t {
        background-image: url('splitter-t.png');
        background-position: left top;
    }

    .rightColumn .col-b {
        background-image: url('splitter-b.png');
        background-position: left bottom;
        margin-top: -37px;
    }

    h1 {
        margin: 0px;
        text-shadow: 0px 2px 4px #dddddd;
        font-size: 1.4em;
    }

    h2 {
        margin: 0px;
        text-shadow: 0px 2px 4px #dddddd;
        font-size: 1em;
    }

    span.date {
        font-size: 0.8em;
        color: #303030;
    }

    p {
        margin: 0px;
        padding: 5px 0px 5px 0px;
        text-align: justify;
        line-height: 1.3em;
        -ms-hyphens: auto;
        -ms-hyphenate-limit-chars: 2 2 2;
        -ms-hyphenate-limit-lines: 3;
    }

    a.article {
        text-decoration: none;
        color: inherit;
        display: block;
        width: 620px;
    }

    a.column-article {
        text-decoration: none;
        color: inherit;
        display: block;
    }

    /* Článek */

    article {
        display: block;
        padding: 0px 10px 0px 10px;
    }

    article > h1 {
        font-size: 1.3em;
        margin: 0px 0px 2px 0px;
        padding: 0px;
        text-shadow: 0 2px 4px #dddddd;
    }

    article > h2 {
        font-size: 1.2em;
        margin: 4px 0px 2px 0px;
        padding: 0px;
    }

    article > p {
        padding-bottom: 10px;
        font-style: normal;
    }

    article > pre {
        margin: 0px;
        padding-bottom: 10px;
        font-family: Consolas, sans-serif;
        font-size: 0.9em;
    }

    article > img {
        clear: both;
        float: right;
        margin-left: 15px;
    }

    article > p > em {
        font-style: italic;
    }

    article > p > code {
        font-family: Consolas, Monaco, 'Lucida Console', Monospace;
        font-size: 0.9em;
    }

    .center {
        text-align: center;
    }

    p.maintained {
        font-size: 0.75em;
        float: right;
        padding-right: 10px;
    }

    p.maintained > abbr {
        font-style: normal;
        color: #333333;
        cursor: default;
    }

    p.maintained > abbr:hover {
        color: #333333;
    } 

    p.vcard {
        font-size: 0.75em;
    }

    p.vcard > abbr {
        cursor: default;
        border-style: none;
    }

    p.vcard > abbr:hover {
        color: #333333;
    }

    p.vcard a {
        font-style: normal;
        color: #333333;
        text-decoration: none;
    }

    p.vcard a:hover {
        text-decoration: none;
    }

    article > p > abbr {
        cursor: pointer;
        border-style: none;
    }

    article > p > abbr:hover {
        color: #ab1b0b;
    }

    article a {
        color: #335599;
        text-decoration: none;
    }

    article a:hover {
        text-decoration: underline;
    }

    article > h3 {
        font-size: 1em;
        margin: 0px;   
        padding: 0px;
    }

    article > h4 {
        font-size: 1em;
        font-weight: normal;
        font-style: italic;
        margin: 0px;   
        padding: 0px;
    }

    article ul, article ol {
        margin: 0px 0px 0px 4em;
        padding: 0px 0px 10px 0px;
    }

    article table {
        border-collapse: collapse;
        border-style: solid;
        border-width: 1px;
        border-color: Gray;
        margin: 15px auto;
    }

    article th {
        background-color: #e5e5e5;
        text-align: left;
        text-indent: 10px;
    }

    article td {
        padding: 2px 4px 2px 4px;
        border-style: solid;
        border-width: 1px;
        border-color: Gray;
    }

    .center {
        text-align: center;
    }

    figure {
        display: block;
        background-color: #f7f7f7;
        border: solid 1px #d4d5d5;
        text-align: center;
        padding: 10px 0px 10px 0px;
        margin: 10px auto;
        font-size: 0.8em;
        color: #606060;
        border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
    }

    figure > img {
        padding-bottom: 5px;
    }

    ::selection {
        background: #add6ff;
    }

    article > iframe {
        margin-left: -10px;
        border-width: 4px 3px 4px 4px;
        border-style: solid;
        border-color: #555555;
    }

    /* Tagy pod článkem */

    div.tags {
        color: #0066dd;
        margin-left: 50px; 
        padding-left: 30px; 
        background-image: url('label.png'); 
        background-repeat: no-repeat; 
        background-position: 0 15px; 
        padding-top: 20px; 
        padding-bottom: 5px;
    }

    div.tags a {
        color: #0066dd; 
        text-decoration: none;
    }

    div.tags a:hover {
        text-decoration: underline;
    }

    /* Tag - seznam článků patřící k tagu */

    div.tag h1 {
        font-size: 1.5em;
        margin: 0;
        padding: 0 0 5px 15px;
    }

    div.tag {
        padding-top: 15px;
        padding-bottom: 15px;
    }

    div.tag ul {
        margin: 0 0 0 3em;
        padding: 0;
    }
          
    div.tag li {
        margin: 0;
        padding: 0;
    }
          
    div.tag a {
        color: #333333;
        text-decoration: none;
    }

    div.tag a:hover {
        text-decoration: underline;
        cursor: pointer;
    }

    div.tag div.col {
        float: right;
        width: 30%;
        padding-top: 5px;
    }

    div.tag div.col h2 {
        font-size: 1.2em;
        margin: 0;
        padding: 0 0 5px 15px;
    }

    /* Titulka - hlavní články */

    .leftColumn div.hentry {
        padding: 0px 5px 5px 5px;
        -ms-hyphens: auto;
    }

    .leftColumn .border {
        cursor: pointer;
    }

    .leftColumn span.updated {
        color: #13558f;
    }

    .leftColumn h1.entry-title {
        font-size: 1.3em;
        margin: 5px 0px 0px 0px;
        text-shadow: 0 2px 4px #dddddd;
    }

    .leftColumn h1.entry-title a {
        color: #333333;
        text-decoration: none;
        outline-style: none;
    }

    .leftColumn h1.entry-title a:hover {
        color: #333333;
        text-decoration: underline;
    }

    .leftColumn div.hentry a {
        display: block;
        text-decoration: none;
        color: #333333;
    }

    .leftColumn div.hentry img {
        border-style: none;
    }

    .leftColumn abbr.published {
        display: none;
    }

    .leftColumn abbr.updated {
        font-size: 0.75em;
        text-decoration: none;
        border-style: none;
    }
    
    .leftColumn div.hentry img {
        float: right;
        margin-left: 10px;
    }

    /* Titulka - sloupek */

    .leftColumn {
        width: 625px;
        float: left;
    }

    .rightColumn {
        position: absolute;
        width: 200px;
        float: right;
        padding-left: 20px;
        margin-bottom: 10px;	
        background-image: url('splitter-l.png');
        background-repeat: repeat-y;
        background-position: 10px;
        margin-left: 625px;
    }

    .rightColumn div.centry {
        padding: 0px 5px 5px 5px;
    }

    .rightColumn .border {
        cursor: pointer;
    }

    .rightColumn h1 {
        font-size: 1.0em;
        margin: 5px 0px 0px 0px;
        text-shadow: 0 2px 4px #eeeeee;
    }

    .rightColumn h1 a {
        color: #333333;
        text-decoration: none;
        outline-style: none;
    }

    .rightColumn h1 > a:hover {
        color: #333333;
        text-decoration: underline;
    }

    .rightColumn div.centry a {
        display: block;
        text-decoration: none;
        color: #333333;
    }

    .rightColumn div.centry img {
        border-style: none;
    }

    .rightColumn p {
        font-size: 0.9em;
        text-align: justify;
        -ms-hyphens: manual;
    }

    /* Feedback */

    div.feedback {
        clear: both;
        color: #0066dd;
        text-align: center;
        background-repeat: no-repeat;
    }

    span.feedback {
    
    }

    /* Citace */
  
    ul.references {
        clear: both;
        font-family: 'Segoe UI', Verdana;
        font-size: 0.85em;
        color: #353535;
        list-style-type: none;
        margin: 0px 0px 10px 0px;
        padding: 0px;
    }
    
    ul.references > li {
        margin: 0px;
        padding: 0px;
    }
    
    ul.references > li > cite {
        font-style: normal;
    }
    
    ul.references > li > cite > span {
        text-transform: uppercase;
    }
    
    ul.references > li > a {
        text-decoration: none;
        color: #353535;
    }
}

@media screen and (max-width: 950px) {
    body {
        background-color: #000000 !important;
        background-image: none !important;
        margin: 0px !important;
    }

    #top-glass, #bottom-glass, #content-bottom {
        display: none;
    }

    #glass-mid div.l, #glass-mid div.r {
        background-image: none !important;
    }

    #content, #content-top, #content-main, #content-bottom, #theme {
        margin-left: 0px !important;
    }

    #menu {
        margin-left: -4px !important; /* proč? */
    }
}

@media print {
    
    body, p {
        background-color: #ffffff;
        color: #000000;
        font-family: 'Segoe UI', Calibri, Arial, FreeSans, 'Lucida Grande', Verdana, Helvetica, sans-serif;
    }

    code {
        font-family: Consolas, Monaco, 'Lucida Console', Monospace;
        font-size: 0.9em;
    }

    a {
        text-decoration: none;
        color: Black;
    }

    #menu, #feedback, div.button {
        display: none;
    }

    h1 {
        font-size: 1.3em;    
    }

    .page {
        margin-left: 0px !important;
    }
    
}
