@CHARSET "UTF-8";
/*
    @import url('https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css');
    @import url('/portal/service/themes/common/jq/jquery-ui-1.12.1/jquery-ui.css');
*/
@import url('//www.transliteral.org/portal/service/themes/silver/clean.css');
@import url('//www.transliteral.org/portal/service/themes/silver/font-awesome.css');


.row {
}

.column {
    padding: 5px;
}



/*Header*/
.header {
    background-color: #CC0000;
    font-family: Calibri, Tahoma, "Trebuchet MS", Helvetica, sans-serif;
}

    .header .content {
        color: white;
    }
        .header .content .sitelogo {
        }
        .header .content .siteheader .sitetitle {
            font-size: x-large;
        }
        .header .content .siteheader .siteslogan {
            font-size: x-small;
            font-weight:normal;
            line-height:22px;
        }
    .header a, .header a:visited {
        text-decoration: none;
        color: white;
    }

/*nav*/

.nav {
    background-color: #CC0000;
}

    .nav .menu {
        margin: auto;
        align-content: center;
        text-align: center;
        color: white;
        align-items: center;
    }

        .nav .menu ul {
            list-style-type: none;
            padding: 0;
            margin: 0;
        }

        .nav .menu li {
            float: left;
        }

            .nav .menu li a {
                color: #4D545E;
                text-decoration: none;
                 padding: 5px 15px 5px 15px;
                margin-right: 3px;
                background-color: #d8d4d4;
                -webkit-border-top-left-radius: 3px;
                -webkit-border-top-right-radius: 3px;
                -moz-border-radius-topleft: 3px;
                -moz-border-radius-topright: 3px;
                border-top-left-radius: 3px;
                border-top-right-radius: 3px;
                font-size: 16px;
            }

        .nav .menu a.current, .nav .menu a.hover {
            color: #CC0000;
            background-color: white;
        }

/*Main Content*/
.middle {
    margin: auto;
}

.article {
    text-align: left;
    align-content: center;
    border: 1px #e3e3e3 dotted;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

    .article .maincontent, .article .comments {
        align-items: center;
        padding: 5px;
        word-break: break-word;
    }
/*Footer*/
.footer {
    font-family: Calibri, Tahoma, "Trebuchet MS", Helvetica, sans-serif;
    padding-bottom:10px;
}

.showcase {
    margin: auto;
}

    .showcase .bar {
        padding: 10px;
    }

    .showcase .panel {
    }

.copyright {
    background-image: url(//www.transliteral.org/portal/service/themes/silver/images/icons_v.gif);
    background-position: 0px -529px;
    color: #878787;
    line-height: 13px;
}

    .copyright .center {
        padding-top: initial;
        font-family: Syncopate;
        margin: auto;
    }

    .copyright .footer-flag {
        padding: 12px 25px 0px;
        background-image: url(//www.transliteral.org/portal/service/themes/silver/images/footer_flag.gif);
        background-repeat: no-repeat;
    }

    .copyright .center .footer-flag a {
        color: #878787;
        text-decoration: none;
        font-size: 13px;
    }

        .copyright .center .footer-flag a.red ::before {
            padding: 0px 2px 0px 12px;
            background-image: url(//www.transliteral.org/portal/service/themes/silver/images/icons.gif);
            background-repeat: no-repeat;
            background-position: 0px -242px;
        }

    .copyright .center .footer-flag div.copy a {
        padding: 0px;
    }

    .copyright .center .footer-flag div.copy {
    }

    .copyright .center .footer-flag a {
        color: #878787;
        text-decoration: none;
        font-size: 13px;
    }

        .copyright .center .footer-flag a.red {
            padding: 0px 2px 0px 12px;
            background-image: url(//www.transliteral.org/portal/service/themes/silver/images/icons.gif);
            background-repeat: no-repeat;
            background-position: 0px -242px;
        }


    .copyright .stext .big {
        font-size: 13px;
    }

    .copyright .stext .small {
        font-size: 11px;
    }

    .copyright .stext a {
        text-decoration: none;
    }

    .copyright .stext p {
        margin: 0px;
    }

    .copyright .stext {
        font-size: 11px;
        line-height: 140%;
        text-align: center;
    }


.panel {
    padding: 10px;
    text-align: left;
    align-content: center;
    margin: 10px 5px;
    border: 1px #e3e3e3 dotted;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
/*Left bar*/
.leftbar {
    position: fixed;
    width: 0px;
    left: 0px;
    top: 0px;
    height: 0px;
    float: left;
    visibility: hidden;    
    display: none;
}

    .leftbar .panel {
    }
/*right bar*/
.rightbar {
}

    .rightbar .content {
    }



/*#Mobile (Portrait)
================================================== */

/* Note: Design for a width of 320px */

@media (min-width:320px) { /* smartphones, iPhone, portrait 480x320 phones */
    .container {
    }

    .body {
        font-size: 14px;
    }

    .panel {
        padding: 5px;
        text-align: left;
        align-content: center;
        margin: 5px;
        border: 1px #e3e3e3 dotted;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;
    }
    /*Header*/
    .header {
        width: 100%;
    }

        .header .content {
        }

        .header .banner {
            width: auto;
            margin: auto;
        }

        .header .content .sitelogo {
            margin: 0 10px 0 0;
            width: 60px;
            height: 60px;
            float: left;
        }

        .header .content .siteheader {
            padding: 10px;
        }

            .header .content .siteheader .sitetitle {
            }

            .header .content .siteheader .siteslogan {
            }

        .header a, .header a:visited {
        }

    /*nav*/

    .nav {
        width: auto;
        margin: auto;
    }

        .nav .menu {
            margin: auto;
            align-content: center;
            text-align: center;
            color: white;
            align-items: center;
            display: grid;
        }

            .nav .menu ul {
                list-style-type: none;
                padding: 0;
                margin: 0;
            }

            .nav .menu li {
                float: left;
            }

                .nav .menu li a {
                    color: #4D545E;
                    text-decoration: none;
                    font-weight: normal;
                    padding: 3px;
                    margin-right: 2px;
                    background-color: #d8d4d4;
                    -webkit-border-top-left-radius: 3px;
                    -webkit-border-top-right-radius: 3px;
                    -moz-border-radius-topleft: 3px;
                    -moz-border-radius-topright: 3px;
                    border-top-left-radius: 3px;
                    border-top-right-radius: 3px;
                    font-size: 14px;
                }

            .nav .menu a.current, .nav .menu a.hover {
                color: #CC0000;
                background-color: white;
            }

    /*Main Content*/
    .middle {
        width: 99%;
    }

    .article {
        width: 95%;
        float: left;
    }

        .article .maincontent, .article .comments {
        }
    /*Footer*/
    .footer {
        width: 100%;
        display:grid;
    }

    .showcase {
        width: 100%;
        margin: auto;
    }

        .showcase .bar {
            display: grid;
            grid-template-columns: 100%;
            grid-gap: 10px;
            padding: 10px;
            max-width:95%;
        }

        .showcase .panel {
        }

    .copyright {
        height: 131px;
    }

        .copyright .center {
            width: 98%;
            font-family: unset;
            margin: auto;
        }

        .copyright .footer-flag {
            padding: 12px 5px 0px;
            height: 20px;
        }

        .copyright .center .footer-flag a {
        }

            .copyright .center .footer-flag a.red {
            }

        .copyright .center .footer-flag div.copy a {
            padding: 0px 6px 10px 10px;
        }

        .copyright .center .footer-flag div.copy {
            float: right;
        }

        .copyright .center .footer-flag a {
        }

            .copyright .center .footer-flag a.red {
            }


        .copyright .stext .big {
        }

        .copyright .stext .small {
        }

        .copyright .stext a {
        }

        .copyright .stext p {
        }

        .copyright .stext {
        }


    .panel {
    }
    
    /*right bar*/
    .rightbar {
        width: 100%;
        float: left;
    }

        .rightbar .content {
        }

        .rightbar .panel {
            width: auto;
        }
}

@media (min-width:481px) { /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */
}

@media (min-width:641px) { /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */
}

@media (min-width:961px) { /* tablet, landscape iPad, lo-res laptops ands desktops */
}

@media (min-width:1025px) { /* big landscape tablets, laptops, and desktops */
}

@media (min-width:1281px) { /* hi-res laptops and desktops */

    .body {
        width: 100% !important;
    }

    .container {
        display: flex;
        flex-direction: column;
    }
    /*Header*/
    .header {
        width: 100%;
    }

        .header .content {
        }

        .header .banner {
            width: 1200px;
            margin: auto;
        }

        .header .content .sitelogo {
            margin: 0 10px 0 0;
            width: 60px;
            height: 60px;
            float: left;
        }

        .header .content .siteheader {
            padding: 10px;
        }

            .header .content .siteheader .sitetitle {
            }

            .header .content .siteheader .siteslogan {
            }

        .header a, .header a:visited {
        }

    /*nav*/

    .nav {
        width: 1200px;
        margin: auto;
        visibility: visible;
    }

        .nav .menu {
        }

            .nav .menu ul {
            }

            .nav .menu li {
            }

                .nav .menu li a {
                    color: #4D545E;
                    text-decoration: none;
                    padding: 5px 15px 5px 15px;
                    margin-right: 3px;
                    background-color: #d8d4d4;
                    -webkit-border-top-left-radius: 3px;
                    -webkit-border-top-right-radius: 3px;
                    -moz-border-radius-topleft: 3px;
                    -moz-border-radius-topright: 3px;
                    border-top-left-radius: 3px;
                    border-top-right-radius: 3px;
                    font-size: 16px;
                    float: left;
                }

            .nav .menu a.current, .nav .menu a.hover {
            }

    /*Main Content*/
    .middle {
        width: 1200px;
        display: flex;
        flex-direction: row;
    }

    .article {
        width: 780px;
        float: left;
    }

        .article .maincontent, .article .comments {
        }
    /*Footer*/
    .footer {
        width: 100%;
    }

    .showcase {
        width: 1200px;
        margin: auto;
    }

        .showcase .bar {
            display: grid;
            grid-template-columns: auto auto auto auto;
            grid-gap: 10px;
        }

            .showcase .bar .panel {
                max-width: 260px;
                min-width: 265px;
                display:inline-table;
            }

    .copyright {
        height: 131px;
    }

        .copyright .center {
            width: 90%;
        }

        .copyright .footer-flag {
            height: 20px;
        }

        .copyright .center .footer-flag a {
        }

            .copyright .center .footer-flag a.red {
            }

        .copyright .center .footer-flag div.copy a {
        }

        .copyright .center .footer-flag div.copy {
            float: right;
        }

        .copyright .center .footer-flag a {
        }

            .copyright .center .footer-flag a.red {
            }


        .copyright .stext .big {
        }

        .copyright .stext .small {
        }

        .copyright .stext a {
        }

        .copyright .stext p {
        }

        .copyright .stext {
        }


    .panel {
    }
   
    /*right bar*/
    .rightbar {
        width: 400px;
        float: left;
    }

        .rightbar .content {
        }
}
@media (min-width:1500px) { /* big landscape tablets, laptops, and desktops */
   
}
@media (min-width:1650px) { /* big landscape tablets, laptops, and desktops */
    /*Left bar*/
    .leftbar {
        position: fixed;
        width: 175px;
        left: 45px;
        top: 100px;
        height: auto;
        float: left;
        visibility: visible;
        display:unset;
    }
        .leftbar .panel {
        }
}