/*
 * Style for dodify template news page.
 */

/* Internal page */
div#blogInternal {
    position: relative;
}

div#blogInternal > div.bg {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
    filter: blur(8px);
}

div#blogInternal section.titleDesc div.left {
    width: 60%;
}

div#blogInternal section.titleDesc div.right {
    width: 35%;
}

section#container .left {
    margin: 3em 12% 4em 7%;
    width: 48%;
}

section#container .right {
    width: 30%;
    margin: 4em 3% 2em 0;
}

section#container nav li {
    cursor: pointer;
}

section#container #newsmenu a {
    color: #000000;
}

section#container #newsmenu a:hover, section#container #newsmenu > li > ul > li a.selected {
    color: #A3437C;
}

section#container nav > ul > li {
    font-size: 1.2em;
}

section#container #newsmenu ul {
    padding-left: 2em;
    margin-top: 1em;
    margin-bottom: 2em;
    list-style-type: disc;
}

section#container #newsmenu > li > ul > li {
    font-size: .8em;
    margin: .5em 0em .5em .5em;
}

section#container .left > h2 {
    font-size: 1.2em;
    font-weight: bold;
    margin-bottom: .5em;
    margin-top: 2em;
}

section#container h3  {
    font-size: 1.1em;
}

section#container p {
    margin: 1em 0;
    font-size: 1em;
    line-height: 1.2em;
}

section#container code {
    font: .95em/1.5 'andale mono', 'lucida console', monospace;
    background-color: #ECECEC;
    text-shadow: 1px 1px #FFFFFF;
    word-break: break-all;
}

section#container .left ul {
    list-style: disc;
    padding-left: 2em;
}

section#container .left ul li {
    margin-bottom: .5em; 
}

section#container .left ol {
    list-style-type: upper-roman;
    padding-left: 2em;
}

section#container .left i {
    font-style: italic;
}

section#container .left img {
    display: block;
    margin: 1em auto;
    max-width: 70%;
}

section#container .left a {
    text-decoration: underline;
    color: #000000;
}

section#container .left a:hover {
    color: #A3437C;
}

/* News archive page */
section#previewBlog {
    margin-top: 2em;
}

div#filter {
    width: 19%;
    padding: 3em 3%;
    position: relative;
}

div#filter.fixed {
    position: fixed;
    top: 4em;
    left: 0;
    width: 17%;
}

div.right.box {
    width: 72%;
    padding-right: 3%;
}

div.right.box > .blogBox {
    width: 27%;
    float: left;
    height: 25em;
    margin-bottom: 2em;
    margin-left: 2%;
}

div.right.box > a.blogBox:hover {
    background-color: #F5F4F4;
}

/* Mobile style */
@media screen and (max-width: 780px) {

    /* Internal style */
    section#header {
        padding-top: 8em;
        padding-bottom: 4em;
    }

    div#blogInternal section.titleDesc div.left, div#blogInternal section.titleDesc div.right {
        width: 100%;
        margin-bottom: 2em;
    }

    section#container .left, section#container .right {
        width: 70%;
        margin: 4em auto;
        float: none;
    }

    section#container .right {
        background-color: #A3437C;
        padding: 4em 15%;
        color: #FFFFFF;
        margin-bottom: 0;
    }

    section#container #newsmenu a, section#container #newsmenu > li > ul > li a.selected {
        color: #FFFFFF;
    }

    /* News archive page */
    div#filter {
        width: 21%;
        padding: 3em 2%;
    }

    div#filter.fixed {
        width: 20%;
    }

    div.right.box > .blogBox {
        width: 44%;
    }
}


/* Mobile style */
@media screen and (max-width: 500px) {

    /* Filter style */
    div#filter {
        display: none;
    }

    div.right.box {
        width: 97%;
    }

    div.right.box > .blogBox {
        width: 96%;
        height: initial;
        margin-bottom: 4em;
    }

    a.blogBox h3 {
        height: initial;
    }

    section#container .left, section#container .right {
        width: 80%;
    }

    section#container .right {
        padding: 4em 10%; 
    }
}