﻿@font-face {
    font-family: 'Source Sans Pro DataBaseReader';
    src: url('../font/Source-Sans-Pro-regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto Slab DataBaseReader';
    src: url('../font/Roboto-Slab-regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

body, html {
    /*font-family: Open Sans, Arial, Helvetica, Sans-Serif;*/
    font-family: 'Source Sans Pro DataBaseReader', Arial, Helvetica, Sans-Serif;
    font-size: 14px;
    margin: 0;
    padding: 0;
    background: #fff;
}

form {
    margin: 0;
    padding: 0;
}

input {
    outline: none !important;
}

img {
    border: none;
}

.fleximg {
    width: 100%;
    height: auto;
}

a {
    /*color:#0896d3;*/
    color: #006789;
}

    a:hover {
        /*color:#0b6aaa;*/
        color: #41bbba;
    }

.disabled {
    display: none;
}

.bgfade {
    transition: background-color .25s ease-in-out, border .25s ease-in-out, color .25s ease-in-out;
    -moz-transition: background-color .25s ease-in-out, border .25s ease-in-out, color .25s ease-in-out;
    -webkit-transition: background-color .25s ease-in-out, border .25s ease-in-out, color .25s ease-in-out;
    -o-transition: background-color .25s ease-in-out, border .25s ease-in-out, color .25s ease-in-out;
}

.container {
    /*position:absolute;
	top:10px;left:10px;right:10px;bottom:10px;
	-webkit-box-shadow: 0px 0px 6px #888;
	-moz-box-shadow: 0px 0px 6px #888;
	box-shadow: 0px 0px 6px #888;
	*/
}

.mainarea {
    background-color: #ffffff;
}

#artContainer {
	position:relative;
}

.textinput {
    height: 14px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 3px;
    padding-right: 35px;
    width: 240px;
    font-size: 14px;
    line-height: 14px;
    border: 2px solid #006789;
    background: #ffffff;
    color: #606060;
    margin: 0;
    /*iOS-kulmanpyöristysesto*/
    -webkit-appearance: none;
    -webkit-border-radius: 0;
}

.searchbutton {
    display: inline-block;
    vertical-align: bottom;
    margin: 0;
    border: 2px solid #006789;
    border-left: none;
    /*iOS-kulmanpyöristysesto*/
    -webkit-appearance: none;
    -webkit-border-radius: 0;
}

/*SVG-toteutus, ei mennyt heittämällä, joten jäi myöhemmäksi*/
/*
.dk-searchbutton
{
	display: inline-block;
	vertical-align: bottom;
	margin: 0;
	border: 2px solid #006789;
	border-left: none;

	-webkit-appearance: none;
	-webkit-border-radius: 0;

	width: 34px;
	height: 34px;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url(../pics/dk/navi-haku.svg), none;
	background-size: 25px 25px;
	background-color: #006789;
	cursor: default;
}
*/

ul.tabs li.searchtab {
    position: relative;
    padding: 10px;
    padding-bottom: 11px;
    height: auto !important;
}

ul.tabs li.searchactive {
    cursor: pointer;
}

ul.tabs li.searchtabactive {
}

.searchtab a {
    display: none;
}

.searchactive {
    position: relative;
}

    /*
.searchactive a
{
	display:block;
	position:absolute;
	top:22px;
	right:60px;
	width:12px;
	height:12px;
	background: url(../pics/ico-remove-search-12-12.png) no-repeat;
}
*/

    .searchactive input + a {
        display: inline-block;
        position: relative;
        margin-left: -60px;
        width: 12px;
        height: 12px;
        background: url(../pics/ico-remove-search-12-12.png) no-repeat;
    }



ul.tabs, .actions > ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

    ul.tabs li {
        float: left;
        -moz-transition: -moz-box-shadow 0.5s;
        -webkit-transition: -webkit-box-shadow 0.5s;
        transition: box-shadow 0.5s;
    }

        ul.tabs li.textico, ul.tabs li.tocico, ul.tabs li.indexico, ul.tabs li.linkmapico, ul.tabs li.scrapbookico {
            width: 56px;
            height: 57px;
            border-right: 1px solid #e1f1f6;
            background: url(../pics/ico-toc.png) 0px 0 no-repeat;
            cursor: pointer;
        }

        ul.tabs li.tocactiverumarautalanka {
            background: url(../pics/ico-toc.png) -56px 0 no-repeat;
        }

        ul.tabs li.scrapbookico {
            background-position: 0px -224px;
        }



        ul.tabs li.indexico {
            background: url(../pics/ico-indexwords.png) 0px 0 no-repeat;
        }

        ul.tabs li.linkmapico {
            background: url(../pics/ico-linkmap.png) 0px 0px no-repeat;
        }


        ul.tabs li.active {
            background-color: #ffffff;
            background-position: -56px 0px;
            cursor: default;
            height: 57px;
        }







        ul.tabs li.tocico:hover, ul.tabs li.indexico:hover, ul.tabs li.linkmapico:hover {
            background-position: -112px 0;
        }

        ul.tabs li.active:hover {
            background-position: -56px 0;
        }

        ul.tabs li.scrapbookico.active {
            background-position: -56px -224px;
        }





.linkmap-node0, .linkmap-node1, .linkmap-node2 {
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-shadow: 0px 1px 0px #ffffff, 0px -1px 0px #ffffff, 1px 0px 0px #ffffff, -1px 0px 0px #ffffff;
    background: rgba(255,255,255,0.6);
    border: 1px solid #d4eaf0;
    padding-left: 3px;
    padding-right: 3px;
    -webkit-box-shadow: 0 7px 4px -5px rgba(0,0,0,0.1);
    -moz-box-shadow: 0 7px 4px -5px rgba(0,0,0,0.1);
    box-shadow: 0 7px 4px -5px rgba(0,0,0,0.1);
}

.linkmap-node0 {
    text-shadow: none;
    border-color: rgba(38,149,182,0.8);
    background: rgba(38,149,182,0.8);
    color: #ffffff;
    font-size: 1.167em;
    max-width: 250px;
}

.linkmap-node1 {
    font-size: 1.167em;
    color: #5cb0c8;
    max-width: 150px;
}

.linkmap-node2 {
    font-size: .833em;
    color: #92cada;
    max-width: 100px;
}

.linkmap-opennode {
    display: inline-block;
    padding: 0px;
    padding-left: 3px;
    padding-right: 3px;
    font-size: .833em;
    background-color: #2695b6;
    color: #ffffff;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.linkmap-typeinfo {
    display: none;
    position: absolute;
    top: 100%;
    margin-top: 1px;
    right: 0;
    left: 0;
    font-size: .833em;
    height: 16px;
    line-height: 16px;
    background-color: rgba(248,248,248,0.85);
    color: #808080;
    text-align: center;
    min-width: 100px;
    -webkit-box-shadow: inset 0 8px 8px -8px rgba(0,0,0,0.15);
    -moz-box-shadow: inset 0 8px 8px -8px rgba(0,0,0,0.15);
    box-shadow: inset 0 8px 8px -8px rgba(0,0,0,0.15);
}

.nonVisible {
    visibility: hidden;
    height: 0px;
    width: 0px;
    overflow: hidden;
}

.actions, .actionscontainer, .actionscontainerinner, .navicontainer {
    height: 56px;
    float: right;
}

    .actionscontainerinner > a, .actionscontainerinner ul > li, .actionscontainerinner > #hideableactions > a, .actionscontainerinner > #gotosite_wrapper > a, .navicontainer > a {
        display: block;
        width: 56px;
        height: 56px;
        float: right;
        background: url(../pics/ico-actions-56x2-56x7.png) no-repeat;
        position: relative;
        -moz-transition: -moz-box-shadow 0.5s;
        -webkit-transition: -webkit-box-shadow 0.5s;
        transition: box-shadow 0.5s;
    }

        .actionscontainerinner > a:hover, .actionscontainerinner ul > li:hover, .actionscontainerinner > #hideableactions > a:hover, .actionscontainerinner > #gotosite_wrapper > a:hover, ul.tabs > li:hover {
            -moz-box-shadow: inset 0px 45px 45px -45px rgba(255,255,255,0.5);
            -webkit-box-shadow: inset 0px 45px 45px -45px rgba(255,255,255,0.5);
            box-shadow: inset 0px 45px 45px -45px rgba(255,255,255,0.5);
        }


    .actionscontainerinner li.optionsmenu {
        background-position: 0px -504px !important;
    }

        .actionscontainerinner li.optionsmenu:hover {
            background-position: -56px -504px !important;
        }


    .actionscontainerinner a.print {
        background-position: 0px 0px !important;
    }

        .actionscontainerinner a.print:hover {
            background-position: -56px 0px !important;
        }

    .actionscontainerinner > a.linkmap {
        background-position: 0px -112px;
    }

        .actionscontainerinner > a.linkmap:hover {
            background-position: -56px -112px;
        }


    /*.navicontainer > a.prevpage
{
	background-position:0px -168px;
}

.navicontainer > a.prevpage:hover
{
	background-position:-56px -168px;
}

.navicontainer > a.nextpage
{
	background-position:0px -224px;
}

.navicontainer > a.nextpage:hover
{
	background-position:-56px -224px;
}*/

    .actionscontainerinner > a.sizesmaller {
        background-position: 0px -280px;
    }

        .actionscontainerinner > a.sizesmaller:hover {
            background-position: -56px -280px;
        }

    .actionscontainerinner > a.sizebigger {
        background-position: 0px -336px;
    }

        .actionscontainerinner > a.sizebigger:hover {
            background-position: -56px -336px;
        }

    .actionscontainerinner > #gotosite_wrapper > a {
        background-position: 0px -448px;
    }

        .actionscontainerinner > #gotosite_wrapper > a:hover {
            background-position: -56px -448px;
        }

    .actionscontainerinner .divider, .actionscontainerinner .subdivider {
        float: right;
        width: 1px;
        height: 57px;
        background-color: #e1f1f6;
    }

    .actionscontainerinner .divider {
        background-position: -1px 0px;
    }

    /*
.actions a.nextpage, .actions a.prevpage
{
	margin:10px;
	float:right;
	display:block;
	text-decoration:none;
	line-height:36px;
	color:#e1f1f6;
	background:transparent;
}

.actions a.nextpage:hover, .actions a.prevpage:hover
{
	color:#ffffff;
}

.actions a.prevpage
{
	background-position:0px 0px;
}
*/

    /*
.actionscontainerinner .pageinput
{
	float:right;
	width:85px;
	border-right:1px solid #e1f1f6;
	padding-right:10px;
	margin-left:10px;
	height:57px;
}

.actionscontainerinner .pageinput .textinput
{
	
	background-color:#ffffff;
	padding:0px;
	height:36px;
	line-height:36px;
	margin-top:10px;
	margin-right:0;
	width:40px;
	text-align:center;
	float:left;
	display:block;
	border:none;
	margin:0;
	margin-top:10px;
	-webkit-box-shadow:inset 8px 8px 8px -8px rgba(0,0,0,0.2);
	-moz-box-shadow:inset 8px 8px 8px -8px rgba(0,0,0,0.2);
	box-shadow:inset 8px 8px 8px -8px rgba(0,0,0,0.2);
}
*/

    .actionscontainerinner .lastpagenumber {
        text-align: center;
        margin-left: 0px;
        margin-top: 10px;
        line-height: 36px;
        height: 36px;
        float: right;
        display: block;
        color: #ffffff;
        font-size: 1.167em;
        width: 44px;
    }

.searchresultscontainer {
}

.searchresultsinfo {
    font-family: 'Source Sans Pro DataBaseReader', Arial, Helvetica, Sans-Serif;
    font-size: 1.25em;
    color: #505050;
    margin-bottom: 10px;
}

.searchresults a, .searchdocumentresults a {
    display: block;
    position: relative;
    padding: 15px;
    /*padding-right:40px;*/
    /*color: #141414;*/
    color: #000;
    text-decoration: none;
    background: #fff;
    border-top: 10px solid #eee;
}

    .searchresults a:first-child,
    .searchdocumentresults a:first-child {
        margin-top: 0;
    }

    .searchresults a b, .searchdocumentresults a b {
        font-weight: normal;
        display: block;
        margin-top: 0.833em;
    }

    .searchresults a.odd, .searchdocumentresults a.odd {
        /*background-color:rgba(38, 149, 182, 0.1);*/
    }

    .searchresults a i, .searchdocumentresults a i {
        /*Edita Digikirja: hakutuloksen prosentteja ei näytetä*/
        display: none;
        position: absolute;
        width: 30px;
        height: 15px;
        right: 8px;
        top: 8px;
        font-size: 1em;
        font-weight: bold;
        color: #505050;
        text-align: right;
        font-style: normal;
    }

.searchresults .path {
    /*color: #0896d3;*/
    color: #006789;
}

/*hakutulossanan korostus*/
.searchresults a .hl, .searchdocumentresults a .hl {
    /*color:#4aa917;*/
    /*haluttu osumalle taustaväri*/
    background: #e6c7c7;
    display: inline-block;
    line-height: 20px;
}


.searchresults a u, .searchdocumentresults a u {
    /*color:#0896d3;*/
    color: #006789;
    text-decoration: none;
    font-weight: bold;
}





#resizebar {
    position: fixed;
    left: 282px;
    width: 18px;
    top: 57px;
    bottom: 0px;
    border-right: 1px solid #d8d8d8;
    -webkit-box-shadow: 8px 0 8px -8px rgba(0,0,0,0.3);
    -moz-box-shadow: 8px 0 8px -8px rgba(0,0,0,0.3);
    box-shadow: 8px 0 8px -8px rgba(0,0,0,0.3);
    cursor: w-resize;
    z-index: 3;
    background-color: #ffffff;
}

.resizehandle {
    position: absolute;
    top: 50%;
    left: 8px;
    margin-top: -10px;
    width: 4px;
    height: 20px;
    background: url(../pics/resize-handle.png) no-repeat;
}

.resizefader {
    position: absolute;
    top: -57px;
    left: 0px;
    right: 0px;
    height: 113px;
    background: url(../pics/resizefader.png) repeat-x;
    background-position: left bottom;
}

.resizefaderfiller {
    position: absolute;
    top: 0px;
    height: 25px;
    left: 0px;
    right: 0px;
    background-color: #ffffff;
}



.partialmatches {
    /*Edita DK: "katso myös" -otsikkoa ei näytetä*/
    display: none;
    margin-top: 20px;
    margin-bottom: 12px;
    color: #464646;
    font-size: 1.167em;
    font-weight: bold;
}




#tabsearchresults {
    display: none;
    position: absolute;
    top: 170px;
    left: 0px;
    bottom: 0px;
    width: 26px;
    height: 128px;
    background: url(../pics/tab-searchresults-i.png) no-repeat;
}

.tabcontent {
    padding: 10px;
    color: #ffffff;
    overflow: auto;
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    bottom: 0px;
}

    .tabcontent h3 {
        margin: 0;
        margin-bottom: 10px;
        font-size: 1em;
        font-weight: normal;
        color: #ffffff;
    }

.othersearchresults {
    position: absolute;
    height: 86px;
    right: 8px;
    left: 8px;
    bottom: 8px;
    overflow: auto;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border-bottom: 1px solid #f0f5f7;
    color: #000000;
    padding: 8px;
}

/*Ilmeisesti poistunut käytöstä*/
/*.searchresultslist
{
	position:absolute;
	top:81px;
	left:0px;
	right:0px;
	bottom:0px;
	padding:3px;
	padding-bottom:0px;
	padding-top:0px;
	overflow:auto;
	display:none;
}*/

.mainareafull {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: -10px;
}

.articlearea {
    margin-left: 330px;
}

.controlarea {
    position: fixed;
    left: 0px;
    top: 57px;
    bottom: 0px;
    width: 285px;
    z-index: 2;
    background-color: #ffffff;
}

    .controlarea .hid {
        display: none !important;
    }

.tocselector {
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    height: 18px;
    overflow: hidden;
    background-color: #000000;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    color: #ffffff;
    font-size: 1.083em;
    line-height: 18px;
    padding: 3px;
    padding-left: 8px;
    border-bottom: 1px solid #d0d0d0;
}

.toccontainer {
    position: absolute;
    left: 0px;
    top: 0px;
    bottom: 9px;
    right: 0px;
    background-color: #ffffff;
    border-left: 3px solid #ffffff;
    border-right: 3px solid #ffffff;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.toca a {
    line-height: 12px;
    padding: 2px;
}

    .toca a:hover {
        text-decoration: underline;
    }

.toca img {
    margin-right: 3px;
}

.closed {
    background: #ffffff;
}

.toc img {
    border: none;
}

a.open {
    background: #ffffff;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border-bottom: 1px solid #ccdee7;
    padding-bottom: 2px;
}

.chosen {
    background-color: #0074b5;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    color: #ffffff;
}

/*Edita DK: Mikä tämä on? Sotkee kuvien kokoruututilan*/
/*.final
{
	margin-left:51px;
}*/

.toparea {
    height: 25px;
    background-color: #ffffff;
}

#closebutton {
    padding: 0px;
    display: block;
    float: right;
    margin-right: 20px;
    height: 20px;
    width: 200px;
    text-align: right;
}

.header {
    position: fixed;
    left: 0px;
    right: 0px;
    top: 0px;
    overflow: visible;
    height: 57px;
    background-color: #2695b6;
    min-width: 562px;
    -moz-box-shadow: inset 0 -1px 0 0 #2695b6, inset 0 -13px 13px -13px rgba(0,0,0,0.25);
    -webkit-box-shadow: inset 0 -1px 0 0 #2695b6, inset 0 -13px 13px -13px rgba(0,0,0,0.25);
    box-shadow: inset 0 -1px 0 0 #2695b6, inset 0 -13px 13px -13px rgba(0,0,0,0.25);
    z-index: 4;
    transition: top 0.25s;
}

.hideActions .header {
    /*height:10px;*/
    top: -47px;
    -moz-box-shadow: inset 0 -5px 0 0 #ffffff;
    -webkit-box-shadow: inset 0 -5px 0 0 #ffffff;
    box-shadow: inset 0 -5px 0 0 #ffffff;
}

.header .actions, .header #searchform {
    opacity: 1;
    transition: opacity 0.25s, margin-top 0.25s;
    margin-top: 0px;
}

.hideActions .header .actions, .hideActions .header #searchform {
    opacity: 0;
    margin-top: -10px;
}

.showActions .header {
    height: 57px;
    top: 0;
    background-color: #2695b6;
    -moz-box-shadow: inset 0 -1px 0 0 #2695b6, inset 0 -13px 13px -13px rgba(0,0,0,0.25);
    -webkit-box-shadow: inset 0 -1px 0 0 #2695b6, inset 0 -13px 13px -13px rgba(0,0,0,0.25);
    box-shadow: inset 0 -1px 0 0 #2695b6, inset 0 -13px 13px -13px rgba(0,0,0,0.25);
}

    .showActions .header .actions, .showActions .header #searchform {
        opacity: 1;
        margin-top: 0;
    }

.hideActions .controlarea {
    top: 6px;
    transition: top 0.25s;
}

.showActions .controlarea {
    top: 57px;
}

.hideActions #artContainer {
    padding-top: 8px;
    transition: padding-top 0.25s;
}

.showActions #artContainer {
    padding-top: 60px;
}


.searcharea {
    float: left;
    left: 220px;
    height: 34px;
    padding-top: 8px;
    width: 364px;
}

#searchareanavi {
    float: right;
    width: 100px;
}

.searchareanavioff {
    display: none;
}

.searchareanavion {
    display: block;
}

#searchareanavi a {
    margin-top: 8px;
    float: left;
    display: block;
    margin-left: 8px;
    width: 16px;
    text-align: center;
    padding-left: 0px;
    padding-right: 0px;
}


.headerlogout {
    position: absolute;
    margin-left: 557px;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    background: url(../pics/header-right-bg.png) 100% 0px no-repeat;
    overflow: hidden;
}

.patharea {
    padding: 10px;
}

    .patharea a {
        float: left;
        margin-right: 5px;
        overflow: hidden;
        display: block;
        text-decoration: none;
        color: #aaa;
    }

    .patharea span {
        font-size: 1em;
        font-weight: bold;
        display: block;
        float: left;
        margin-right: 4px;
        color: #aaa;
    }

    .patharea a:hover {
    }

    .patharea a.pathlastnode {
        color: #006789;
    }

.pathselector {
    margin-top: 2px;
    height: 12px;
    width: 12px;
    background: url(../pics/pathselector.png) no-repeat;
    display: block;
    float: left;
}



.articleareacontent {
    /*position:absolute;
	left:0px;top:0px;bottom:9px;right:0px;*/
    position: relative;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-color: #ffffff;
}

.fullscreen {
    left: 0px !important;
}

.artnavi {
    position: absolute;
    right: 30px;
    top: 48px;
    height: 19px;
    width: 43px;
    z-index: 1;
    background: url(../pics/bg-a50white.png);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #e0e0e0;
}

    .artnavi a.naviforward, .artnavi a.navibackward {
        margin-right: 2px;
        margin-top: 2px;
        display: block;
        float: right;
        height: 15px;
        width: 15px;
        background: url(../pics/artnavi-next.png) 0px 0px no-repeat;
    }

    .artnavi a.navibackward {
        background: url(../pics/artnavi-back.png) 0px 0px no-repeat;
        margin-right: 8px;
    }

    .artnavi a.off {
        background-position: -15px 0px;
        cursor: default;
    }

/*#artContainer
{
	padding:40px;
	padding-right:40px;
	padding-left:40px;
	padding-top:60px;
}*/

/*.article
{
	font-size:1em;
}*/

.article .th-pagenum {
    margin-right: -30px !important;
    float: right;
    text-align: right;
    font-size: 1rem !important;
    font-weight: normal !important;
    text-decoration: none !important;
    background: none !important;
    color: #808080;
}

/*Edita-DK: taulukkotyylit ovat datassa*/
/*.article table {
	color:#666;
	margin:5px;
	border-collapse:collapse;
	max-width:100%;
	border:#e0e0e0;
	margin:0;
}
.article table th {
	padding:10px 15px 10px 15px;
	border:#e0e0e0;
	background: #ededed;
	-webkit-box-shadow: inset 0 1px 0 0 #fff;
	-moz-box-shadow: inset 0 1px 0 0 #fff;
	box-shadow: inset 0 1px 0 0 #fff;
}
.article table th:first-child{
	text-align: left;
	padding-left:20px;
}
.article table tr{
	padding-left:20px;
}
.article table tr td:first-child{
	text-align: left;
	padding-left:20px;
}
.article table tr td {
	padding:10px;
	border: 1px solid #e0e0e0;
	vertical-align:top;
}
.article table tr:nth-child(odd) td{
	background: #f6f6f6;
	-webkit-box-shadow: inset 0 1px 0 0 #fff;
	-moz-box-shadow: inset 0 1px 0 0 #fff;
	box-shadow: inset 0 1px 0 0 #fff;
}
*/

/*#article a
{
}

#article a:hover
{
}*/

/*vanha versio: .article b*/
.article span.TBSearchResult {
    /*background-color:#c8e5b9;*/
    background-color: #e6c7c7;
    font-weight: inherit;
}

/*lisätty nohilite koskemaan myös uutta versiota*/
.article.nohilite span.TBSearchResult {
    color: inherit;
    background-color: inherit;
    font-weight: inherit;
}

.size1 {
    font-size: 50% !important;
}

.size2 {
    font-size: 60% !important;
}

.size3 {
    font-size: 70% !important;
}

.size4 {
    font-size: 80% !important;
}

.size5 {
    font-size: 90% !important;
}

.size6 {
    font-size: 100% !important;
}

.size7 {
    font-size: 110% !important;
}

.size8 {
    font-size: 120% !important;
}

.size9 {
    font-size: 130% !important;
}

.size10 {
    font-size: 140% !important;
}

.size11 {
    font-size: 150% !important;
}

.size12 {
    font-size: 165% !important;
}

.size13 {
    font-size: 185% !important;
}

.size14 {
    font-size: 210% !important;
}

.size15 {
    font-size: 230% !important;
}

.size16 {
    font-size: 250% !important;
}

.size17 {
    font-size: 280% !important;
}

.size18 {
    font-size: 310% !important;
}

.size19 {
    font-size: 340% !important;
}

.size20 {
    font-size: 370% !important;
}

.size21 {
    font-size: 400% !important;
}

.size22 {
    font-size: 430% !important;
}

.size23 {
    font-size: 460% !important;
}

.size24 {
    font-size: 490% !important;
}

.size25 {
    font-size: 520% !important;
}

.size26 {
    font-size: 550% !important;
}

.size27 {
    font-size: 580% !important;
}

.size28 {
    font-size: 610% !important;
}

.useractions {
    display: block;
    height: 12px;
    width: 12px;
    position: absolute;
    top: 5px;
    left: -14px;
    background: url(../pics/useraction.gif) no-repeat;
}

.useractionscount {
    line-height: 11px;
    display: block;
    height: 12px;
    width: 12px;
    position: absolute;
    top: 18px;
    left: -14px;
    text-align: center;
    color: #1393d9;
    font-size: 0.917em;
    text-decoration: underline;
}

.articlefunctions {
    padding-left: 8px;
    left: 0px;
    right: 0px;
    top: 0px;
    height: 22px;
    border-bottom: none;
    border: 1px solid #000000;
    background-color: #000000;
    position: absolute;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

    .articlefunctions a {
        line-height: 14px;
        color: #ffffff;
        display: block;
        float: left;
        padding: 3px;
    }

.articleprevious {
    padding-left: 10px !important;
    background: url(../pics/article-lt.png) 0px 7px no-repeat;
}

.articlenext {
    padding-right: 10px !important;
    background: url(../pics/article-gt.png) 100% 7px no-repeat;
}

.articleareafunctions {
    display: block;
    position: absolute;
    right: 13px;
    top: 5px;
    height: 22px;
    width: 130px;
}

    .articleareafunctions a {
        display: block;
        height: 22px;
        width: 22px;
        float: right;
        margin-left: 8px;
        background: url(../pics/ico-print.png) 0px 0px no-repeat;
    }

        .articleareafunctions a:hover {
            background-position: 0px -22px;
        }

a.showactions {
    background-image: url(../pics/ico-showactions.png);
}

a.showactionson {
    background-image: url(../pics/ico-showactions.png);
    background-position: -22px 0px;
}

    a.showactionson:hover {
        background-position: -22px -22px;
    }

a.pdf {
    background-image: url(../pics/ico-pdf.png);
}

a.uimode {
    background-image: url(../pics/ico-uimode.png);
}

a.uimodefull {
    background: url(../pics/ico-uimode.png) -22px 0px no-repeat;
}

    a.uimodefull:hover {
        background-position: -22px -22px;
    }

a.print span, a.pdf span, a.showactions span {
    display: block;
    width: 22px;
    height: 22px;
    background: url(../pics/ico-disabled-66.png) 0px 0px;
}


.toca {
    background: #e8e8e8;
    padding: 7px;
    padding-top: 14px;
    padding-bottom: 14px;
}

.tocamain {
    color: #000000;
    font-weight: bold;
    padding: 0px !important;
    margin-bottom: 14px !important;
}

.toci {
    display: block;
    text-align: left;
    padding: 7px;
    padding-top: 14px;
    padding-bottom: 14px;
    background: #d4d4d4 url(../pics/toc-i-bg.png) repeat-x;
    color: #000000;
    font-weight: bold;
    border-bottom: 1px solid #e8e8e8;
}

    .toci img, .toca img {
        margin-right: 3px;
    }

.tocarea {
    overflow: auto;
    /*Edita Digikirja*/
    /*position:absolute;
	bottom:10px;
	top:10px;
	left:10px;
	right:10px;*/
}

    .tocarea .pagenumber {
        display: none;
    }

    /*piilotetaan otsikko*/
    .tocarea h1 {
        display: none;
    }
/*myös haun otsikko piilotettu*/
#searchresults.tocarea h1 {
    display: block;
}

/*piilotetaan otsikkolinkki aina*/
.tocarea h1 a, #searchresults h1 a {
    display: none;
}

.tocarea h1, #searchresults h1 {
    /*color:#0896d3;*/
    color: #006789;
    font-size: 1em;
    margin-top: 20px;
    margin-bottom: 10px;
}

.tocareashadow {
    z-index: 2;
    position: absolute;
    top: 60px;
    left: 0px;
    right: 0px;
    height: 3px;
    overflow: none;
}

    .tocareashadow img {
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

#scrapbookarea {
    display: none;
}

.useractionspanel {
    padding: 5px;
    display: none;
    position: fixed;
    -webkit-box-shadow: 0px 0px 15px #aaa;
    -moz-box-shadow: 0px 0px 15px #aaa;
    box-shadow: 0px 0px 15px #aaa;
    width: 250px;
    height: 307px;
    z-index: 1002;
    background-color: #f1f2f3;
    color: #999999;
    border-bottom: 1px solid #dadada;
}

    .useractionspanel i {
        float: right;
        position: relative;
        width: 18px;
        height: 18px;
        line-height: 36px;
        text-decoration: none;
        color: #ffffff;
        font-weight: bold;
        font-size: 1em;
        /*font-family:Open Sans;*/
        /*background:url(../pics/arrow-36x4-36x3.png) -81px -45px no-repeat;*/
        background-repeat: no-repeat;
        background-position: center;
        background-image: url(../pics/dk/symboli-nuoli-sivulle-turkoosi.svg), none;
        background-size: 16px 16px;
        cursor: default;
    }

.useractionsheader {
    text-align: left;
    color: #808080;
    font-size: 1.167em;
    line-height: 16px;
    height: 16px;
    text-shadow: 0px 1px 1px #ffffff;
    cursor: default;
}

.useractionsaction {
    padding-top: 5px;
}

.useractionscontent {
    position: relative;
}

    .useractionscontent textarea {
        border: 1px solid #d8d8d8;
        background-color: #f8f8f8;
        width: 243px;
        height: 260px;
        margin: none;
        margin-bottom: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        outline: none !important;
    }

    .useractionscontent a:hover {
        background-color: #f6f6f6;
    }

.useractionsdate {
    height: 20px;
    overflow: hidden;
    line-height: 20px;
    color: #808080;
    font-size: .833em;
}

.closebutton {
    display: block;
    position: absolute;
    top: 0px;
    right: 5px;
    width: 200px;
    height: 24px;
    text-align: right;
    font-size: 1em;
}

.chooseaction {
    display: block;
    height: 50px;
    clear: both;
}

    .chooseaction i {
        border-right: 1px solid #e8e8e8;
        display: block;
        width: 49px;
        height: 50px;
        background-color: #ffffff;
        text-align: center;
        overflow: visible;
        line-height: 50px;
    }

    .chooseaction span {
        display: block;
        margin-left: 50px;
        height: 50px;
        background-color: #ffffff;
        line-height: 50px;
        text-align: center;
        height: 0px;
        overflow: visible;
    }

    .chooseaction:hover {
        background-color: #ffffff;
    }

.rounded-button, .rounded-button-green {
    display: block;
    padding-left: 12px;
    padding-right: 12px;
    float: right;
    height: 28px;
    line-height: 28px;
    border: 1px solid #505050;
    background: #c7c7c7 url(../pics/button-gray.gif) repeat-x;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    color: #fff;
    font-size: 1em;
    text-align: center;
    text-decoration: none !important;
}

.rounded-button-green {
    background-image: url('../pics/button-green.gif');
}

#logininfo {
    margin-top: 26px;
    padding-right: 32px;
    float: right;
    height: 30px;
    color: #ffffff;
    font-size: 0.917em;
}

    #logininfo:hover {
        text-decoration: underline;
    }




/* TOC -puu... */

#toc {
    /*margin-left:-22px;*/
}

ul.toc {
    margin-top: 0px;
    list-style-type: none;
    margin-left: 0px;
    padding: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
}

    /*#toc > ul.toc > li
{
	margin-left: 4px;
}*/

    ul.toc i {
        font-size: 0.833em;
        color: #ce4f4f;
        font-style: normal;
        font-weight: normal;
    }

div.SelectedLastNode i {
    color: #aedaf2;
}

div > ul.toc > li {
    min-height: 12px;
    padding-left: 4px;
}

    div > ul.toc > li.opened {
        /*padding-left:1px;*/
    }

a.Expand, a.Collapse {
    position: absolute;
    right: 9px;
    top: 10px;
    display: inline-block;
    width: 16px;
    height: 16px;
}

    a.Expand:hover, a.Collapse:hover {
        text-decoration: none;
    }

    a.Expand:after {
        content: "+";
    }

    a.Collapse:after {
        content: "-";
    }

/*Alempien tasojen expand/collapse*/
div > ul.toc ul.toc a.Expand,
div > ul.toc ul.toc a.Collapse {
    /* Edita Digikirja: avauspainike näkyy vain päätasolla*/
    display: none !important;
}

/*Päätason expand/collapse*/
div > ul.toc > li > div > a.Expand,
div > ul.toc > li > div > a.Collapse {
}

div > ul.toc > li > div > a.Expand {
    /*background: url(../pics/dk/symboli-nuoli-alas-musta.png) center no-repeat;*/
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../pics/dk/symboli-nuoli-alas-musta.svg), none;
    background-size: 100% 100%;
}

    div > ul.toc > li > div > a.Expand:after {
        content: "";
    }


div > ul.toc > li > div > a.Collapse {
    /*background: url(../pics/dk/symboli-ruksi-musta.png) center no-repeat;*/
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../pics/dk/symboli-ruksi-musta.svg), none;
    background-size: 100% 100%;
}

    div > ul.toc > li > div > a.Collapse:after {
        content: "";
    }

div > ul.toc > li > div.Selected,
div > ul.toc > li > div.SelectedLastNode {
    border: none;
}

/*alatasojen sisennys*/
ul.toc > li {
    /*margin-left:13px;*/
    position: relative;
}

    /*kaikki tasot*/
    ul.toc > li > div > a {
        text-decoration: none;
        font-size: 1.083rem;
    }

        ul.toc > li > div > a:hover {
            /*text-decoration: underline;*/
        }

div > ul > .tocseparator {
    /*Edita Digikirja*/
    /*display:block;*/
    display: none;
    background-color: #ffffff;
    height: 3px;
    overflow: hidden;
}

#toc, .toc div {
    /*padding-left:14px;
	margin-bottom:1px;*/
}

.toc div {
    padding-right: 20px;
    /*margin-bottom: 5px;*/
}

div.Selected > a,
div.SelectedLastNode > a {
    /*color:#000000 !important;*/
    /*color: #006789 !important;*/
    /*color: #41bbba !important;*/
}

    div.Selected > a.Expand,
    div.SelectedLastNode > a.Expand,
    div.Selected > a.Collapse,
    div.SelectedLastNode > a.Collapse {
        color: #ffffff !important;
    }

div.SelectedLastNode {
}

    div.SelectedLastNode > a {
    }

/* ...TOC -puu */


span .hl {
    background-color: rgba(140,204,106,0.5);
}

.nohilite .hl {
    color: inherit !important;
}

.ul {
    -moz-box-shadow: inset 0 0 0 300px rgba(112,223,224,0.5);
    -webkit-box-shadow: inset 0 0 0 300px rgba(112,223,224,0.5);
    box-shadow: inset 0 0 0 300px rgba(112,223,224,0.5);
}

a.ulListItem {
    display: block;
    padding: 2px;
    /*background-color:#f4f4f4;
	color:#484848;
	font-size:1.083rem;
	padding:10px;
	max-height:80px;	
	margin-top:10px;*/
    overflow: auto;
    text-decoration: none;
    margin-bottom: 0;
}

/*a.ulListItem {
	margin-top:0;
}*/

#asiahakemistocontainer {
    position: absolute;
    right: 20px;
    left: 20px;
    top: 95px;
    bottom: 20px;
    /*rajoitetaan leveys linkkiboksin vuoksi*/
    max-width: 500px;
    /*display:none;*/
}

#asiahakemistofunctions {
    position: absolute;
    top: 0px;
    height: 32px;
    left: 0px;
    right: 0px;
}

#jumptoindexwordlistindex {
    /*padding-left: 3px;
	border: 1px solid #c8c8c8;
	background: #fff;*/
}

#indexwordlistjump {
    /*width: 100%;
	height: 30px;
	line-height: 30px;
	border: none !important;
	background-color: transparent;*/
}

/*Edita Digikirja: muutetaan linkkiboksin sijaintia pakotetusti*/
#indexwordtargetspanel {
    position: absolute;
    left: 50px !important;
}

/* -- asiasanahakemisto: loppu --- */

#asiahakemistocontainer select {
    display: none;
}

#asiahakemistocontainer.has-indexwordlists select {
    display: inline-block;
}

#asiahakemistocontainer.has-indexwordlists #asiahakemistofunctions {
    height: 70px;
}

#asiahakemistolist {
    position: absolute;
    right: 0;
    left: 0;
    top: 60px;
    bottom: 0;
    overflow: auto;
    border: 1px solid transparent;
}

#asiahakemistocontainer.has-indexwordlists #asiahakemistolist {
    top: 70px;
}

#asiahakemistocontainer .dropdown {
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 0.2em;
}

    #asiahakemistocontainer .dropdown li, #asiahakemistocontainer .dropdown .selected {
        font-size: 1em !important;
        line-height: 1em;
    }


#asiahakemisto a {
}

#asiahakemisto {
    overflow: hidden;
}

.ajaxlistcontent {
    overflow: hidden;
    display: none;
}

.ajaxlistscrollheight {
    overflow: hidden;
}

.ajaxlistcontent a {
    font-size: 1em;
    display: block;
    padding-left: 15px;
    padding-right: 15px;
    background-color: #ffffff;
    /*margin-bottom:2px;*/
    margin-bottom: 10px;
    clear: both;
    height: 48px;
    line-height: 48px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-decoration: none;
    /*color:#474747;*/
    color: #41bbba;
    font-weight: bold;
}

#asiahakemistolist a.asiasana {
    font-size: 1em;
    display: block;
    padding: 15px;
    background-color: #fff;
    margin-bottom: 10px;
    clear: both;
    height: auto;
    line-height: 1.429em; /*20px*/
    overflow: hidden;
    text-decoration: none;
}

    #asiahakemistolist a.asiasana span.asiasana-title {
        color: #41bbba;
        font-weight: bold;
    }

    #asiahakemistolist a.asiasana span.asiasana-desc {
        font-weight: normal;
        color: #000;
        margin-top: 5px;
    }

.ajaxlistcontent a.odd {
    /*background-color:#f7f7f7;
	-webkit-box-shadow:inset -55px 0 50px -50px #ffffff;
	-moz-box-shadow:inset -55px 0 50px -50px #ffffff;
	box-shadow:inset -55px 0 50px -50px #ffffff;*/
}

.ajaxlistcontent a:hover {
    /*color:#0c6aaa;*/
}

.ajaxlistcontent i,
#asiahakemistolist a.asiasana i {
    /* Edita Digkirja: ei näytetä osumien kappalemäärää*/
    display: none;
    font-style: normal;
    font-size: 0.8em;
    margin-left: 4px;
    color: #808080;
}

#indexwordtargetscontent a {
    display: block;
    padding: 5px;
    text-decoration: none;
}

#StructurePath {
    display: none;
}

#printareaheader {
    display: none;
}

.printmode .header, .printmode #controlarea, .printmode #resizebar, .printmode #indexwordtargetspanel, .printmode .indexwordtargetspanel #context, .printmode #pageBottom, .printmode #scrapbook-commands {
    display: none;
}

.printmode #printareaheader {
    display: block;
}

.printmode .articlearea {
    margin-left: 0px !important;
}

.printmode.scrapbook-printmode #controlarea {
    display: block;
    position: relative;
    width: auto !important;
    bottom: auto;
    top: auto;
    right: auto;
    left: auto;
}

.printmode.scrapbook-printmode #scrapbookarea {
    position: relative;
    width: auto;
    height: auto;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
}

    .printmode.scrapbook-printmode #scrapbookarea > div {
        display: none;
    }

    .printmode.scrapbook-printmode #scrapbookarea > #scrapbook-book {
        display: block;
        position: relative;
        width: auto;
        height: auto;
        left: auto !important;
        right: auto;
        bottom: auto;
        top: auto;
        background-color: transparent;
        padding: 0;
        box-shadow: none;
    }

.printmode.scrapbook-printmode .articlearea, .printmode.scrapbook-printmode #printareapath, .printmode.scrapbook-printmode .scrapbook-scrap-header {
    display: none;
}

.printmode.scrapbook-printmode #printareaheader {
    height: 24px;
}


#printarea {
    position: relative;
    display: none;
    background-color: #ffffff;
    overflow: visible;
    z-index: 5;
}

#printareaheader {
    background-color: #eeeeee;
    font-weight: bold;
    line-height: 20px;
    font-size: 1.167em;
    color: #404040;
    padding-left: 10px;
    overflow: hidden;
}

#printareapath {
    font-size: 1em;
    margin-right: 150px;
}

#printareapath span {
    font-size: 0.833em;
    color: #808080;
}

#printareacontent {
    padding: 20px;
    margin-top: 30px;
    position: inherit !important;
    overflow: visible !important;
}

@media print {
    /* Edita Digikirja */
    .dk-header,
    .dk-action-layer,
    #read_progress,
    #dk_light_box,
    #index_word_hover_box,
    .patharea-wrapper,
    #notification,
    #context,
    #editbmContext,
    .bookmark-link-wrapper,
    #index_word_hover_box,
    .navlink {
        display: none !important;
    }

    #artContainer {
        padding-top: 0 !important;
    }
    /* Edita Digikirja: loppu */


    .closebutton, #sizelimiter, #headerstripe, #pageBottom {
        display: none !important;
    }

    .header, #controlarea, #resizebar, #indexwordtargetspanel, .indexwordtargetspanel #context, #pageBottom, #scrapbook-commands {
        display: none;
    }

    #printareaheader {
        display: block;
    }

    .articlearea {
        margin-left: 0px !important;
    }

    .scrapbook-printmode #controlarea {
        display: block;
        position: relative;
        width: auto !important;
        bottom: auto;
        top: auto;
        right: auto;
        left: auto;
    }

    .scrapbook-printmode #scrapbookarea {
        position: relative;
        width: auto;
        height: auto;
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
    }

        .scrapbook-printmode #scrapbookarea > div {
            display: none;
        }

        .scrapbook-printmode #scrapbookarea > #scrapbook-book {
            display: block;
            position: relative;
            width: auto;
            height: auto;
            left: auto !important;
            right: auto;
            bottom: auto;
            top: auto;
            background-color: transparent;
            padding: 0;
            box-shadow: none;
        }

    .scrapbook-printmode .articlearea, .scrapbook-printmode #printareapath, .scrapbook-printmode .scrapbook-scrap-header {
        display: none;
    }

    .scrapbook-printmode #printareaheader {
        height: 24px;
    }

    .print-hide-headers #printareaheader {
        display: none;
    }
}

.defaultseparator {
    margin-top: 15px;
    margin-bottom: 10px;
    display: block;
    background-color: #cfcfcf;
    height: 1px;
    overflow: hidden;
}

.verticalmargin {
    margin-top: 10px;
    margin-bottom: 10px;
}

/* autocomplete */
.ui-autocomplete {
    z-index: 50000;
}

    .ui-autocomplete.ui-menu.ui-widget.ui-widget-content.ui-corner-all {
        background-image: none;
        background-color: #f3f7f9;
        border: none !important;
        margin: 0px;
        padding: 4px;
        filter: alpha(opacity=100);
        opacity: 1;
        width: 241px;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        border-radius: 0px;
    }

.ui-menu-item, a.ui-corner-all {
    color: #0997d4 !important;
    border-color: #ffffff;
}

    .ui-menu-item:hover, a.ui-corner-all:hover {
        color: #0c6aaa !important;
        border-color: #ffffff;
        background: #ffffff;
    }

ul.ui-autocomplete.ui-menu.ui-widget.ui-widget-content.ui-corner-all li.ui-menu-item a.ui-corner-all {
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
}





.searchdocument {
    background: #ffffff url(../pics/tocroot-bg.png) no-repeat 0px 100%;
    /*background:#dee9f2 url('../pics/blue-bg.png') repeat-x;
	background:#d8d8d8 url('../pics/patharea-bgg.png') repeat-x;*/
    /*border-bottom:1px solid #e8e8e8;
	border:1px solid #d6e8f1;
	border-bottom:1px solid #bedbeb;*/
    margin-bottom: 1px;
    position: relative;
}

.searchdocumentodd {
}

a.searchdocumentname {
    display: block;
    color: #ffffff;
    font-weight: normal;
    background: #2695b6;
    overflow: hidden;
    padding: 1em;
    padding-right: 50px;
    text-decoration: none;
}

    a.searchdocumentname:hover {
        text-decoration: underline;
    }

    a.searchdocumentname .maximized {
        background: url('../pics/toc-mainopened.png') no-repeat 2px 11px;
    }

    a.searchdocumentname span {
        font-size: 0.833em;
        color: #e1f1f6;
        font-style: normal;
        font-weight: normal;
        margin-left: 0.5em;
        display: inline-block;
    }

    a.searchdocumentname:after {
        content: "";
        position: absolute;
        display: block;
        right: 0;
        width: 40px;
        top: 0;
        bottom: 0;
        background: rgba(255,255,255,0.25);
    }

a.searchdocumentstart {
    height: 16px;
    width: 16px;
    padding: 0px !important;
    line-height: 16px;
    text-align: center;
    position: absolute;
    right: 1em;
    top: 12px;
    display: block;
}

.searchdocumentresultscontainer {
    display: none;
    background-color: #ffffff;
    padding: 0em;
    box-shadow: inset 0 0 0 1px #2695b6;
}

ul.searchrelevancetabs {
    /* Edita Digikirja: relevanssi/dokumentti -valintaa ei haluta näkyviin. Relevanssi on ainoa vaihtoehto.*/
    display: none;
    list-style: none;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid #2695b6;
}

    ul.searchrelevancetabs li {
        text-transform: uppercase;
        display: inline-block;
        margin-left: 1em;
        background-color: #e1f1f6;
        color: #000000;
        cursor: pointer;
        padding: 1em;
        box-shadow: inset 0 -1em 1em -1em rgba(38, 149, 182, 0.7), 0 -1px 0px 0px rgba(38, 149, 182, 0.22);
        border-top-left-radius: 2px;
        border-top-right-radius: 2px;
    }

        ul.searchrelevancetabs li.chosensort {
            box-shadow: none;
            cursor: default;
            background-color: #2695b6;
            color: #ffffff;
        }

        ul.searchrelevancetabs li:first-child {
            margin-left: 0;
        }





a.bluebutton, a.greenbutton, a.redbutton, a.whitebutton {
    background: #006789;
    font-size: 1em;
    display: inline-block;
    padding: 0 10px;
    height: 28px;
    line-height: 28px;
    text-decoration: none;
    cursor: pointer;
    background: #006789;
    color: #fff;
    text-transform: uppercase;
    box-sizing: border-box;
}

    a.bluebutton:hover {
        background: #006789;
        color: #fff;
    }

a.greenbutton {
    background: #29c504;
    border: 1px solid #29c504;
}

    a.greenbutton:hover {
        color: #169400;
        background: #e3efdd;
    }

a.redbutton {
    background: #c53004;
    border: 1px solid #c53004;
}

    a.redbutton:hover {
        color: #941d00;
        background: #efe3dd;
    }

a.whitebutton {
    color: #2695b6;
    background: #ffffff;
    border: 1px solid #ffffff;
}

    a.whitebutton:hover {
        background: #ffffff;
    }

a.bluebuttondisabled, a.bluebuttondisabled:hover {
    background: #0a4a6d;
    color: #85a5b6;
    border-color: #0a4a6d;
}

.blueseparator {
    display: block;
    border-top: 1px solid #e0f0ff;
    background-color: #ffffff;
    height: 1px;
    overflow: hidden;
}

.backtofrontpage {
    clear: both;
    float: right;
    margin-right: 10px;
}

#logoutdialog a.bluebutton {
    float: right;
    margin-left: 8px;
}

.ui-dialog-titlebar {
    background: #000000;
    color: #ffffff;
    border: none;
}

.ui-widget-overlay {
    background: #000000;
}

.ui-dialog {
    font-family: Arial, Sans-Serif;
}



/*#article div
{

}

.article div div
{
	
}
*/

.article div div {
    position: relative;
}

#article span i.tab {
    display: inline-block;
    width: 30px;
}

#article span img, #printareacontent span img {
    /*width:100%;
	height:auto;*/
}



#loadani {
    color: #808080;
    font-size: 1.167em;
    z-index: 999;
    background-color: #fff;
    display: none;
    position: fixed;
    top: 100px;
    height: 0;
    left: 0px;
    right: 0px;
    text-align: center;
}

    #loadani img {
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        -webkit-box-shadow: 0 15px 20px -10px rgba(0,0,0,0.3);
        -moz-box-shadow: 0 15px 20px -10px rgba(0,0,0,0.3);
        box-shadow: 0 15px 20px -10px rgba(0,0,0,0.3);
    }

.artlist {
    position: absolute;
    top: 60px;
    bottom: 3px;
    left: 0px;
    right: 0px;
    overflow: auto;
}

.artlistf a {
    height: 34px;
    line-height: 34px;
    display: block;
    margin: 0px;
}

a.linkIn {
    display: inline-block !important;
    background: transparent url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMDcuNjAxIiBoZWlnaHQ9IjI1Ni43NCIgdmlld0JveD0iMCAwIDMwNy42MDEgMjU2Ljc0MiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMzA3LjYwMSAyNTYuNzQyIj48cGF0aCBmaWxsPSIjMGI5NmQzIiBkPSJtMjUxLjY0IDBoLTE0NC44MmMtMzAuOTA1IDAtNTUuOTYzIDI1LjA2LTU1Ljk2MyA1NS45NjN2NDMuNDg0aDgzLjgxdi02MC41MWwxMzkuOTUgOTAuNjctMTM5Ljk1IDkwLjY4di02MC41MWgtODMuODF2NDFjMCAzMC45MDQgMjUuMDYgNTUuOTYzIDU1Ljk2MyA1NS45NjNoMTQ0LjgyYzMwLjkwNCAwIDU1Ljk2My0yNS4wNiA1NS45NjMtNTUuOTYzdi0xNDQuODJjMC0zMC45MDUtMjUuMDYtNTUuOTYzLTU1Ljk2My01NS45NjMiLz48cGF0aCBmaWxsPSIjZmZmIiBkPSJtMTI5LjY3IDE2My43OGwtMTE2LjY3LjAwMmMtNC45NjIgMC05LTQuMDQtOS05di01MC4zM2MwLTQuOTYyIDQuMDQtOSA5LTlsMTE2LjY3LjAwMDF2LTYzLjg3bDE1MS4zMSA5OC4wMy0xNTEuMzEgOTguMDR2LTYzLjg3MiIvPjxwYXRoIGZpbGw9IiMwZDk1ZDIiIGQ9Im0xMzMuNjcgMzguOTM2bDEzOS45NSA5MC42Ny0xMzkuOTUgOTAuNjh2LTYwLjUxaC04My44MXYuMDAyaC0zNi44NThjLTIuNzYyIDAtNS0yLjIzOS01LTV2LTUwLjMzYzAtMi43NjEgMi4yMzgtNSA1LTVoMzYuODU4di4wMDAxaDgzLjgxdi02MC41MW0tOC0xNC43MTZ2MTQuNzE1IDUyLjUxaC03NS44MWwtMzYuODU4LS4wMDAxYy03LjE2OCAwLTEzIDUuODMyLTEzIDEzdjUwLjMzYzAgNy4xNjggNS44MzIgMTMgMTMgMTNoMzYuODU4IDh2LS4wMDJoNjcuODExdjUyLjUxIDE0LjcxN2wxMi4zNS04IDEzOS45NS05MC42OCAxMC4zNjEtNi43MTQtMTAuMzYyLTYuNzEzLTEzOS45NS05MC42Ny0xMi4zNS04eiIvPjwvc3ZnPg==") no-repeat bottom !important;
    background-size: contain !important;
    width: 18px !important;
    height: 18px !important;
    margin-right: 5px;
}

.bc {
    margin-top: 57px;
    background-color: #ffffff;
    color: #404040;
    min-height: 326px;
    font-size: 1.583em;
    min-width: 500px;
    position: relative;
    overflow: auto;
}

.bcimage {
    min-height: 257px;
    min-width: 174px;
    background-color: #0997d4;
    position: absolute;
    left: 30px;
    top: 30px;
}

.bcinfo {
    margin-left: 234px;
    padding-top: 30px;
    max-width: 520px;
}

    .bcinfo table {
        border-collapse: collapse;
        empty-cells: hide;
    }

        .bcinfo table td, .bcinfo div {
            border: none;
            padding: 4px;
            background-color: #ffffff;
            font-size: 1em;
            color: #404040;
        }

    .bcinfo .bcheader {
        /*font-family:Open Sans;*/
        font-size: 1.917em;
        font-weight: normal;
        padding-top: 0px;
    }

.bcauthor {
    color: #808080;
}

#bclongtext {
    display: none;
}

    #bcshorttext a, #bclongtext a {
        padding-left: 9px;
        display: inline-block;
        height: 13px;
        line-height: 13px;
        overflow: visible;
        position: relative;
        text-decoration: none;
        margin-left: 5px;
    }

        #bcshorttext a i, #bclongtext a i {
            display: block;
            position: absolute;
            left: 0px;
            top: 0px;
            height: 11px;
            width: 6px;
            background: url(../pics/arrow-36x4-36x3.png) -88px -48px no-repeat;
        }

.shadow {
    background: url(../pics/shadow-down.png) no-repeat center top;
    height: 11px;
    overflow: hidden;
}

table.bookPreview td, table.bookPreview th {
    text-align: left;
    vertical-align: top;
}

.defaultTextActive {
    color: #a1a1a1;
    font-style: italic;
}

#article div.bwrapper {
    display: block !important;
    position: relative !Important;
    left: 0;
    top: 0;
}

.binfo {
    background-color: #ff0000 !important;
    color: #ffffff;
}

.nextframepage {
    display: block;
    font-size: 1.5em;
    background-color: #2695b6 !important;
    color: #ffffff !important;
    padding: 10px;
    text-align: center;
    text-decoration: none;
}

/*EDITA demon vaatimat jutskat alkaa*/
/*
.box-style1 {
	padding:20px;
	background-color:#ffe490 !important;
	color:#000000;
	margin-top:0px;
}

.box-style1 span {
	font-style:normal !important;
}

.box-style2 {
	padding:20px;
	background-color:#f0b9db !important;
	color:#000000;
	margin-top:20px;
}

.imgcontainer {
	display:block;
	background-color:#ececec;
	padding:20px;
	color:#888888 !important;
	margin-bottom:40px;
	-webkit-box-shadow:inset 0 0 30px 0 rgba(255,255,255,0.7);
	-moz-box-shadow:inset 0 0 30px 0 rgba(255,255,255,0.7);
	box-shadow:inset 0 0 30px 0 rgba(255,255,255,0.7);
}

.imgcontainer img {
	border:15px solid #ffffff;
	margin-bottom:10px;
	-webkit-box-shadow:0 15px 20px -10px rgba(0,0,0,0.3);
	-moz-box-shadow:0 15px 20px -10px rgba(0,0,0,0.3);
	box-shadow:0 15px 20px -10px rgba(0,0,0,0.3);
	max-width:75%;
	height:auto !important;
	float:left;
	margin-right:20px;
}

.imgcontainer br {
	display:none;
}

.imgcontainer {
	text-shadow:0 1px #ffffff;
	overflow:hidden;
}

.imgcaption {
	display:none;
}

#article h1 {
	font-size:200% !important;
	color:#de068c;
}

#article h2 {
	font-size:150% !important;
	color:#de068c;
}

.nobr{
	padding-bottom:0 !important;
}

.nobr br{
	display:none;
}

.headerimg {

	border-bottom:2px solid #de068c !important;
}
*/
/*EDITA demon vaatimat jutskat loppuu*/


/* Kirjanmerkit */



.actionscontainerinner ul {
    margin: 0 !important;
    padding: 0 !important;
    width: 56px;
    float: right;
    list-style-type: none;
    margin: 0;
    cursor: pointer;
}

    .actionscontainerinner ul > li {
        background-position: 0px -56px;
        /*
	padding-top:3px;
	padding-left:3px;
	*/
        width: 56px;
        height: 56px;
        text-decoration: none;
        margin: 0;
    }

.actionscontainerinner a.onoff {
    display: inline-block;
    width: 13px;
    height: 13px;
    background: url(../pics/checkmark.png) no-repeat;
}

.actionscontainerinner li.off > a.onoff {
    background: rgba(255,255,255,0.3);
}

.actionscontainerinner ul > li.showbookmarks:hover {
    background-position: -56px -56px;
}

.actionscontainerinner ul > li.highlight {
    background-position: 0px -392px;
}

    .actionscontainerinner ul > li.highlight:hover {
        background-position: -56px -392px;
    }

.actionscontainerinner ul > li:hover, .actions > a:hover {
    background-color: #2695b6;
}

/* -- muistilappuikoni ja lista lukualueella ---------- */

/*Edita DK:n kirjanmerkit eroaa reilusti tältä osin pohjatoteutuksesta*/
.bookmark-link-wrapper {
    position: relative !important;
    display: inline-block !important;
    list-style-type: none !important;
    font-family: 'Source Sans Pro DataBaseReader', Arial, Helvetica, Sans-Serif !important;
    /*ikonin positiointi*/
    width: 17px !important;
    height: 17px !important;
    margin: 0 !important;
    padding: 0 !important;
    margin-right: 5px !important;
    margin-left: 3px !important;
    padding: 0 0 !important;
}

.bookmark-link {
    /*ikonin positiointi*/
    position: absolute !important;
    top: 2px !important;
    left: 2px !important;
    padding: 0 0 !important;
    list-style-type: none !important;
    list-style-position: outside !important;
    width: 17px !important;
    height: 17px !important;
    /*background: url(../pics/dk/symboli-muistilappu.png) 0px 0px no-repeat;*/
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-image: url(../pics/dk/symboli-muistilappu.svg), none !important;
    background-size: 100% 100% !important;
    cursor: pointer !important;
    z-index: 1 !important;
    /*opacity: 0.7;*/
}

#bookmark_link_hover_list {
    display: none;
    position: fixed;
    /*position asetetaan scriptillä*/
    top: 100px;
    left: 100px;
    z-index: 4;
    text-align: left;
    background-color: #eee;
    width: 290px;
    padding: 10px;
    height: 220px;
    box-shadow: 0 0 10px 1px rgba(0,0,0,0.3);
    box-sizing: border-box;
}

    #bookmark_link_hover_list a.bookmark-link-hover-list-close {
        width: 16px;
        height: 16px;
        position: absolute;
        right: 15px;
        top: 14px;
        background-repeat: no-repeat;
        background-position: center;
        background-image: url(../pics/dk/symboli-ruksi-musta.svg), none;
        background-size: 100% 100%;
    }

    #bookmark_link_hover_list .bookmark-link-hover-list-items {
        height: 170px;
        margin-top: 30px;
        overflow: auto;
    }

        #bookmark_link_hover_list .bookmark-link-hover-list-items a {
            display: block;
            text-decoration: none;
            color: #000;
            font-size: 1rem;
            font-weight: normal;
            background-color: rgba(255,255,255,0.5);
            padding: 0 10px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            height: 40px;
            line-height: 40px;
            box-sizing: border-box;
            margin-top: 10px;
        }

            #bookmark_link_hover_list .bookmark-link-hover-list-items a:first-child {
                margin-top: 0;
            }

            #bookmark_link_hover_list .bookmark-link-hover-list-items a span {
                /*piilotetaan aikaleima*/
                display: none;
            }

/* -- muistilappuikoni ja lista lukualueella: loppu ---------- */

.bmitemselected .bmtext {
    color: #ffffff;
    background: #0896d3;
    /*cursor:text;*/
}

.bmitem {
    position: relative; /*poista napin vuoksi*/
    margin-top: 10px;
    clear: both;
    background: #fff;
    /*oikea padding enemmän poista-napin vuoksi*/
    /*padding: 15px 55px 15px 15px;*/
    /*share lisätty*/
    padding: 15px 80px 15px 15px;
}

    .bmitem:first-child {
        margin-top: 0;
    }

.bmpath {
    margin-bottom: 5px;
}

.bmcount, .hlcount {
    font-size: 1em;
}

.bmpath a, .bmpath .text {
    text-decoration: none;
    color: #006789 !important;
    font-weight: bold;
}

    .bmpath a:hover {
        text-decoration: none;
    }

.bmcreated {
    /*Edita Digikirja*/
    /*display:inline-block;*/
    display: none;
    margin-right: 10px;
    color: #808080;
}

.bmpath a.bmdelete-optional {
    display: block;
    width: 20px;
    height: 20px;
    /*background: url(../pics/dk/symboli-ruksi-musta.png) center no-repeat;*/
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../pics/dk/symboli-roskakori.svg), none;
    background-size: 100% 100%;
    background-color: transparent;
    text-decoration: none;
    position: absolute;
    top: 5px;
    right: 8px;
    margin-top: 5px !important;
}

.bmpath a.bmedit-optional {
    display: block;
    width: 20px;
    height: 20px;
    /*background: url(../pics/dk/symboli-ruksi-musta.png) center no-repeat;*/
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../pics/dk/symboli-kyna-pyorea.svg), none;
    background-size: 100% 100%;
    background-color: transparent;
    text-decoration: none;
    position: absolute;
    top: 5px;
    right: 33px;
    margin-top: 5px !important;
}

.bmpath a.bmshare-optional {
    display: block;
    width: 20px;
    height: 20px;
    /*background: url(../pics/dk/symboli-ruksi-musta.png) center no-repeat;*/
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../pics/dk/symboli-sharenuoli.svg?v=2), none;
    background-size: 100% 100%;
    background-color: transparent;
    text-decoration: none;
    position: absolute;
    top: 5px;
    right: 58px;
    margin-top: 5px !important;
}

#notes_tabs_4 .bmpath a.bmedit-optional {
    right: 8px;
}

/* Kirjanmerkin linkify-muotoilu käyttöliittymässä */
.bmtext,
.bmtext-clone-linkify {
    min-height: 17px;
    margin-top: 5px;
    color: #000;
    /*annetaan kirjanmerkin tekstin rivittyä*/
    white-space: pre-wrap;
}

/* Kirjanmerkin linkify-muotoilu käyttöliittymässä */
/*bmtext:n sijaa näytetään muotoiltu klooni, .bmtext-clone-linkify*/
.bmtext {
    display: none !important;
}

.bmitem.edit-mode .bmtext-clone-linkify {
    display: none;
}

/* rivitetään kirjanmerkkitekstien pitkät sanat/linkit */
.bmtext,
.bmtext-clone-linkify,
#editbmPreview {
    word-wrap: break-word;
}

.bmedit {
    padding: 0;
    margin: 0;
    border: none;
    height: 100px;
    width: 100%;
    outline: none;
}

#showbmcontent {
    /*font-size:1.083em;*/
}

/* -- Muistilapun muokkaus, modataan painikkeita -- */
a.bluebutton.bmdelete,
a.bluebutton.bmcancel,
a.bluebutton.bmmodify {
    display: inline-block;
    padding: 0 10px;
    height: 28px;
    line-height: 28px;
    text-decoration: none;
    cursor: pointer;
    background: #006789;
    color: #fff;
    text-transform: uppercase;
    box-sizing: border-box;
    /*piilotetaan teksti ja korvataan se uudella (after)*/
    font-size: 0;
}

    a.bluebutton.bmdelete:after,
    a.bluebutton.bmcancel:after,
    a.bluebutton.bmmodify:after {
        display: inline-block;
        content: 'Poista';
        font-size: 1rem;
    }

    a.bluebutton.bmdelete:after {
        content: 'Poista';
    }

    a.bluebutton.bmcancel:after {
        content: 'Peru';
    }

    a.bluebutton.bmmodify:after {
        content: 'Tallenna';
    }
/* -- Muistilapun muokkaus, modataan painikkeita: loppu -- */

/* Kirjanmerkit loppuu */

.slidemenu {
    position: absolute;
    bottom: -2px;
    right: 0px;
    width: 1px;
    height: 1px;
    overflow: visible;
    z-index: 10000;
    width: 447px;
    clip: rect(0px,5000px,5000px,-5000px);
    opacity: 0;
    display: none;
    /*transition:all 0.4s;*/
}

    .slidemenu.open {
        display: block;
        opacity: 1;
    }

    .slidemenu > div:first-child {
        float: none;
        background-color: #ffffff;
        -webkit-box-shadow: 0 0 10px 0px rgba(0,0,0,0.45);
        -moz-box-shadow: 0 0 10px 0px rgba(0,0,0,0.45);
        box-shadow: 0 0 10px 0px rgba(0,0,0,0.45);
        z-index: 10000;
        width: 447px;
        /*border:1px solid #c0c0c0;*/
        border-top: none;
        background: #2695b6;
        border-top: 1px solid rgba(255,255,255,0.5);
        border-bottom: 1px solid #2695b6;
        max-height: 0px;
        overflow: hidden;
        -webkit-transition: all 0.5s;
        -moz-transition: all 0.5s;
        transition: all 0.5s;
        cursor: auto;
    }

    .slidemenu.open > div:first-child {
        overflow: hidden;
        max-height: 500px;
    }


    .slidemenu .tabscontainer {
        border-bottom: 1px solid rgba(255,255,255, 0.4);
        margin-left: 10px;
        margin-right: 10px;
    }



    .slidemenu a.bmtab {
        display: inline-block;
        float: left;
        position: relative;
        background: rgba(255,255,255,0.93);
        display: block;
        padding: 10px;
        color: #1393d9;
        font-size: 1.083em;
        text-decoration: none;
        text-align: center;
        border-bottom: none;
        margin-top: 10px;
        margin-left: 10px;
        -webkit-box-shadow: inset 0 -6px 6px -6px rgba(0,0,0,0.4);
        -moz-box-shadow: inset 0 -6px 6px -6px rgba(0,0,0,0.4);
        box-shadow: inset 0 -6px 6px -6px rgba(0,0,0,0.4);
        margin-bottom: -1px;
        -webkit-border-top-left-radius: 2px;
        -webkit-border-top-right-radius: 2px;
        -moz-border-radius-topleft: 2px;
        -moz-border-radius-topright: 2px;
        border-top-left-radius: 2px;
        border-top-right-radius: 2px;
    }

        .slidemenu a.bmtab:first-child {
            margin-left: 0px;
        }

    .slidemenu a.selected {
        border-bottom: 1px solid #ffffff;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        color: #404040;
        background-color: #ffffff;
    }

.slidemenucontent {
    margin: 10px;
    margin-top: 0px;
    padding: 10px;
    border: 1px solid #ffffff;
    border-top: none;
    background: #ffffff;
    overflow: auto;
    max-height: 400px;
}

.clearboth {
    clear: both;
}

.slidemenuborder {
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    width: 56px;
    height: 1px;
    overflow: hidden;
    background: #3da0bd;
    z-index: 10001;
}

.modalwindow {
    -webkit-box-shadow: 0 0 15px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0 0 15px 0px rgba(0,0,0,0.25);
    box-shadow: 0 0 15px 0px rgba(0,0,0,0.25);
    position: fixed;
}

    .modalwindow h2 {
        margin: 10px;
        font-size: 1em;
        color: #a0a0a0;
        font-weight: normal;
    }

    .modalwindow p {
        padding: 10px 15px;
    }

.modalbuttons {
    position: absolute;
    bottom: 15px;
    height: 40px;
    left: 15px;
    right: 15px;
    text-align: right;
}

    .modalbuttons > a {
        display: inline-block;
        margin-left: 0.7em;
        height: 40px;
        line-height: 38px;
    }

        .modalbuttons > a:first-child {
            margin-left: 0;
        }

/* Muistilapun poisto -dialogi */
.modalwindow.bookmark-delete-confirm {
    background: #fff !important;
    height: 110px !important;
}

    .modalwindow.bookmark-delete-confirm h2 {
        display: none;
    }

    .modalwindow.bookmark-delete-confirm p {
        margin-top: 5px;
    }

    .modalwindow.bookmark-delete-confirm .modalbuttons {
        text-align: left;
    }

        .modalwindow.bookmark-delete-confirm .modalbuttons > a.alert-close,
        .modalwindow.bookmark-delete-confirm .modalbuttons > a.alert-cancel {
            border: solid 2px #006789;
        }

        .modalwindow.bookmark-delete-confirm .modalbuttons > a.alert-cancel {
            background: #fff;
            color: #006789;
        }
/* Muistilapun poisto -dialogi: loppu */

#context {
    display: none;
    /*width:250px;*/
    width: 290px;
    height: 1px;
    overflow: visible;
    position: fixed;
    left: 150px;
    top: 150px;
    z-index: 5;
}

    #context .contextcontainer {
        background-color: #ffffff;
        box-shadow: 0 0 10px 1px rgba(0,0,0,0.3);
        padding: 0px;
        position: relative;
    }

    #context .contexttitle {
        display: none;
        padding: 10px;
        padding-right: 35px;
        margin-bottom: 0;
        background-color: rgba(38, 149, 182, 0.13);
        font-size: 1.167em;
        /*color: #141414;*/
        color: #000;
        cursor: move;
    }

    #context .contextclose {
        width: 16px;
        height: 16px;
        position: absolute;
        right: 15px;
        top: 14px;
        /*background:url(../pics/close.png) no-repeat;*/
        /*background: url(../pics/dk/symboli-ruksi-musta.png) no-repeat;*/
        background-repeat: no-repeat;
        background-position: center;
        background-image: url(../pics/dk/symboli-ruksi-musta.svg), none;
        background-size: 100% 100%;
    }

    #context .contextitems {
        padding: 15px;
        padding-top: 0;
        background-color: #ffffff;
    }

        #context .contextitems li,
        .add-bookmark-button {
            display: inline-block;
            margin-top: 15px;
            /*color:#2695b6;*/
            padding: 0px 10px;
            text-decoration: none;
            cursor: pointer;
            /*background-color:rgba(38, 149, 182, 0.06);*/
            background: #006789;
            color: #fff;
            text-transform: uppercase;
            font-size: 1em;
            box-sizing: border-box;
            margin-right: 7px;
            line-height: 28px;
            min-width: 24px;
        }

            #context .contextitems li:first-child {
                margin-top: 0;
            }

/*muistilapun lisäys*/
.add-bookmark-button {
    float: right;
    margin-right: 0;
}

    .add-bookmark-button:hover {
        color: #fff;
    }

#context .contextcontainer #addbmcontent {
    padding: 0 15px 15px 15px;
}

.add-bookmark-textarea {
    width: 100%;
    height: 100px;
    padding: 5px;
    border: 1px solid #eee;
    font-family: Arial, sans-serif;
    box-sizing: border-box;
}


/*muistilapun lisäys: loppu*/

/*#context .contextitems li:hover {
	background-color:rgba(38, 149, 182, 0.12);
}*/
/*
#context .contextitems li:before {
	display:inline-block;
	width:15px;
	height:12px;
	text-decoration: none;
	content: "";
	background: url(../pics/ico-linkinner.png) no-repeat;
}
*/

.option {
    margin-top: 20px;
    box-shadow: 0 1px 0px 0px rgba(0,0,0,0.1);
    padding-bottom: 20px;
}

    .option:first-child {
        margin-top: 10px;
    }

.optiontitle {
    margin-bottom: 5px;
    color: #606060;
}

.optionvalue {
    font-weight: bold;
    color: #000000;
}

#searchinput::-ms-clear {
    display: none;
}


/* jQuery */

.ui-autocomplete.ui-widget-content {
    background: #fff !important;
    padding: 5px !important;
    border: none !Important;
    -webkit-box-shadow: 0 0 15px 0 rgba(0,0,0,0.15);
    -moz-box-shadow: 0 0 15px 0 rgba(0,0,0,0.15);
    box-shadow: 0 0 15px 0 rgba(0,0,0,0.15);
    clip: rect(0px,5000px,5000px,-5000px);
}

.ui-autocomplete .ui-menu-item {
    color: #0997d4 !important;
    padding: 5px !important;
    font-size: 1rem;
}

.ui-autocomplete .ui-widget, .ui-widget:hover {
    font-family: 'Source Sans Pro DataBaseReader', Arial, Helvetica, Sans-Serif;
    font-weight: normal !important;
}

.ui-autocomplete ui-widget:hover .ui-widget-content a, .ui-widget-content a {
    color: #333 !important;
    font-family: 'Source Sans Pro DataBaseReader', Arial, Helvetica, Sans-Serif;
    font-weight: normal !important;
}

.ui-autocomplete .ui-widget-content a:hover {
}

.ui-slider-handle {
    outline: none;
}

#notification {
    display: none;
    position: fixed;
    top: 46px;
    height: 46px;
    left: 0;
    right: 0;
    background-color: #41bbba;
    overflow: hidden;
    /*box-shadow:0 1px 0 0px rgba(38, 149, 182, 0.1), inset 0 -30px 30px -30px #e9f1f5;*/
    border: 1px solid rgba(38, 149, 182, 0.30);
    z-index: 11000;
    -webkit-box-shadow: 0px 5px 5px 0px rgba(100, 100, 100, 0.3);
    -moz-box-shadow: 0px 5px 5px 0px rgba(100, 100, 100, 0.3);
    box-shadow: 0px 1px 5px 0px rgba(100, 100, 100, 0.3);
}

    #notification .notification-text {
        padding-left: 5px;
        padding-right: 5px;
        color: #fff;
        text-align: center;
        font-size: 2em;
        line-height: 46px;
    }

#pageBottom {
    display: block;
    margin-top: 4em;
    padding: 4em;
    background-color: #2695b6;
    color: #ffffff;
    text-align: center;
    font-size: 1.3em;
    text-decoration: none;
    box-shadow: inset 0 10px 10px -10px rgba(0,0,0,0.35);
}

    #pageBottom:after {
        content: "Jatka lukemista";
    }

    #pageBottom:before {
        font-family: Arial;
        display: inline-block;
        -webkit-transform: rotate(-90deg);
        -moz-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        -o-transform: rotate(-90deg);
        transform: rotate(-90deg);
        content: "«";
        font-size: 1.5em;
        margin-right: 0.5em;
        vertical-align: middle;
    }

/*Responsive stuff goes here*/
#screen-specs {
    width: 100px;
    display: none;
}

#pixel-ratio {
    width: 100px;
    display: none;
    height: 0px;
}

.desktophide {
    display: none;
}

/*ei ilmeisesti tarvita enää*/
/*
@media only screen and (min-width: 320px) {
}

@media 
(-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi){
	#pixel-ratio {
		width:125px;
	}

	#artContainer {
		font-size:115%;
	}

	
}
@media 
(-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi){ 
   #pixel-ratio {
		width:150px;
	}

	#artContainer {
		font-size:125%;
	}
}
@media 
(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { 
     #pixel-ratio {
		width:200px;
	}

	#artContainer {
		font-size:100%;
	}
}
*/

#toc {
    display: block;
}

#minifiedtocscrollareacontainer {
    display: none;
}

/*keskikokoinen ruutu*/
@media screen and (max-width: 50em), handheld and (max-width: 50em), tv and (max-width: 50em) {
    /*#article {
		font-size:8px;
	}*/
    .mobilehide {
        display: none !important;
    }

    #pixel-ratio {
        height: 50px;
    }

    .header, .bc {
        min-width: 0 !important;
    }

    #resizebar {
        display: none;
    }

    /*Edita-DK: taulukkotyylit ovat datassa*/
    /*
	.article table {
		max-width:100%;
	}
	*/

    /*#artContainer {
		
		padding-left:0;
		padding-right:0;
		padding-bottom:0;
	}*/

    /*#artContainer .article {
		padding-left:1em;
		padding-right:1em;
	}*/

    /* Edita Digikirja: hakukenttää ei piiloteta missään vaiheessa, mutta kentän pituutta lyhennetään*/
    #searchinput {
        /*display:none;*/
    }

    .textinput {
        width: 160px;
    }

    .actionscontainer {
        display: none;
    }



    #linkmap {
        display: none;
    }

    #maincontainer {
        overflow-x: hidden;
    }

    .controlarea .searchtab {
        padding-top: 1em;
        padding-bottom: 1em;
    }

    .enable-mobiletoc #toc {
        display: none;
    }

    .enable-mobiletoc #minifiedtocscrollareacontainer {
        display: block;
    }

    #tocarea, .tocarea {
        /*width:auto;
		left:auto;
		right:auto;
		top:auto;
		bottom:auto;
		position:static;
		z-index:1001;*/
    }

    .controlarea {
        position: relative;
        padding-top: 70px;
        top: auto;
        left: auto;
        bottom: auto;
        right: auto;
        height: auto;
        width: auto;
        overflow: auto;
        background-color: #ffffff;
        z-index: 1000;
        display: none;
    }

        .controlarea > div {
            padding-left: 1em;
            padding-right: 1em;
        }

    .menuactive .controlarea {
        display: block;
        overflow: auto;
        overflow-x: hidden;
    }

    .menuactiveindex .controlarea {
        position: fixed;
        top: 70px;
        left: 0;
        right: 0;
        bottom: 0;
    }



    .articlearea {
        width: auto;
        margin-left: 0;
        /*animaatiota varten*/
        width: 100%;
        overflow: hidden;
        overflow-x: hidden;
    }

    /*Edita DK*/
    /*.menuactive .articlearea {
		display:none;
	}
	
	#searchtab > * {
		display:none;
		
	}*/

    #mobilemenu {
        background: url(../pics/ico-toc.png) 0 -168px no-repeat;
        width: 56px;
        height: 56px;
        cursor: pointer;
    }

        #mobilemenu.active {
            background: #ffffff url(../pics/ico-toc.png) -56px -168px no-repeat;
        }

            #mobilemenu.active .actionscontainer {
                display: block;
                position: fixed;
                top: 56px;
                height: auto;
                bottom: 0px;
                left: 0;
                right: 0;
                float: none;
                overflow: auto;
                z-index: 61002;
            }

    .slidemenu {
        position: fixed;
        top: 112px;
        bottom: 0;
        height: auto;
        left: 0;
        right: 0;
        background-color: rgba(255,255,255,0.7);
        z-index: 61003;
        width: auto;
    }

    .header {
        z-index: 10001;
    }

    .slidemenu > div:first-child {
        width: auto;
        border-top: 1px solid transparent;
    }

    .showbookmarks textarea {
        width: 100% !important;
    }

    #hideableactions, .navicontainer, #toggleHighlightMode {
        display: none;
    }

    .actionscontainerinner {
        height: 56px;
        float: none;
        overflow: visible;
        background-color: #e1f1f6;
        box-shadow: inset 0 1px 0px 0px #ffffff, inset 0 30px 30px -30px rgba(255,255,255,1),inset 0 1px 0px 0px #ffffff, inset 0 30px 30px -30px rgba(255,255,255,1), inset 0 30px 30px -30px rgba(255,255,255,1), inset 0 30px 30px -30px rgba(255,255,255,1), inset 0 30px 30px -30px rgba(255,255,255,1), 0 1em 1em -1em rgba(0,0,0,0.3);
    }

    ul.tabs li.textico {
        background: url(../pics/ico-toc.png) 0 -112px no-repeat;
    }



    ul.tabs li.searchtab {
        background: url(../pics/ico-toc.png) 0 -56px no-repeat;
        width: 56px;
        padding: 0;
        height: 57px !important;
        border-right: 1px solid #e1f1f6;
        cursor: pointer;
    }

    ul.tabs li.textico.active {
        background-position: -56px -112px;
        background-color: #ffffff;
        cursor: pointer;
    }

    ul.tabs li.searchtab.active {
        background-position: -56px -56px;
        background-color: #ffffff;
    }

    ul.tabs li.mobilemenumarker {
        background-color: rgba(255,255,255,0.6) !important;
    }

    .desktophide {
        display: block;
    }

    /*Edita-DK: taulukkotyylit ovat datassa*/
    /*table {
		max-width:100%;
	}*/

    .actionscontainerinner ul > li:hover, .slidemenuborder {
        background-color: transparent;
    }



    /*mobile submenu*/
    .actionscontainerinner ul > li.showbookmarks, .actionscontainerinner ul > li.showbookmarks:hover {
        background-position: -112px -56px;
    }

    .actionscontainerinner ul > li.highlight, .actionscontainerinner ul > li.highlight:hover {
        background-position: -112px -392px;
    }


    /*
	.actionscontainerinner > a:hover, .actionscontainerinner ul > li:hover, .actionscontainerinner > #hideableactions > a:hover, .actionscontainerinner > #gotosite_wrapper > a:hover, .actionscontainerinner ul.tabs > li:hover
	{
		box-shadow:inset 0 -20px 20px -20px #2695b6, inset 0 -20px 20px -20px #2695b6;
	}
	*/




    .actionscontainerinner li.optionsmenu {
        background-position: -112px -504px !important;
    }

        .actionscontainerinner li.optionsmenu:hover {
            background-position: -112px -504px !important;
        }


    .actionscontainerinner a.print {
        background-position: -112px 0px !important;
    }

        .actionscontainerinner a.print:hover {
            background-position: -112px 0px !important;
        }

    .actionscontainerinner > a.linkmap {
        background-position: -112px -112px;
    }

        .actionscontainerinner > a.linkmap:hover {
            background-position: -112px -112px;
        }


    /*.navicontainer > a.prevpage
	{
		background-position:-112px -168px;
	}

	.navicontainer > a.prevpage:hover
	{
		background-position:-112px -168px;
	}

	.navicontainer > a.nextpage
	{
		background-position:-112px -224px;
	}

	.navicontainer > a.nextpage:hover
	{
		background-position:-112px -224px;
	}*/

    .actionscontainerinner > a.sizesmaller {
        background-position: -112px -280px;
    }

        .actionscontainerinner > a.sizesmaller:hover {
            background-position: -112px -280px;
        }

    .actionscontainerinner > a.sizebigger {
        background-position: -112px -336px;
    }

        .actionscontainerinner > a.sizebigger:hover {
            background-position: -112px -336px;
        }

    .actionscontainerinner > #gotosite_wrapper > a {
        background-position: -112px -448px;
    }

        .actionscontainerinner > #gotosite_wrapper > a:hover {
            background-position: -112px -448px;
        }

    .actionscontainerinner .divider, .actionscontainerinner .subdivider {
        float: right;
        width: 1px;
        height: 57px;
        background-color: #2695b6;
    }

    .actionscontainerinner .divider {
        background-position: -1px 0px;
    }

    .actionscontainerinner ul > li {
        box-shadow: none;
    }

    .actionscontainerinner .openedslidemenu {
        box-shadow: inset 0 -20px 20px -20px #2695b6, inset 0 -20px 20px -20px #2695b6 !important;
    }

    /*
	.searchactive a
	{
		top:22px;
		right:90px;
	}
	*/

    .toc .Collapse {
        /*display:none !important;*/
    }

    /*a.Expand, a.Collapse
	{
		position: initial;
		right: auto;
		top: auto;
		margin-right: 10px;
	}*/

    ul.toc > li {
        margin-left: 2px;
    }
}

/*pienin ruutu*/
@media screen and (max-width: 25em), handheld and (max-width: 25em), tv and (max-width: 25em) {
    #pixel-ratio {
    }
}

.drag-target-ready {
    background-color: #2695b6 !important;
}

    .drag-target-ready > div {
        display: none;
    }

    .drag-target-ready:after {
        content: "Pudota tekstileikkeet tähän";
        display: block;
        position: absolute;
        border: 0.5em dotted #ffffff;
        color: #ffffff;
        font-size: 2em;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        text-align: left;
        padding: 2em;
        background-color: #2695b6;
        opacity: 0.8;
        text-align: center;
    }

.dropping:after {
    opacity: 1;
}

.selectedForDrag {
    box-shadow: inset 0 0 50px 50px rgba(255,255,0,0.5);
}

#draggingContainer {
    background-color: #2695b6;
    box-shadow: 0 0 15px 0 rgba(0,0,0,0.2);
    max-width: 30em;
    max-height: 15em;
    font-size: 75%;
    color: rgba(255,255,255,0.8) !important;
    border: 7px dotted rgba(255,255,255,0.8);
    overflow: hidden;
    padding: 2em;
    position: absolute;
    text-shadow: none;
}

    #draggingContainer:after {
        content: "";
        display: block;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        box-shadow: inset 0 -60px 40px -40px #2695b6, inset 0 -60px 40px -40px #2695b6, inset 0 -60px 40px -40px #2695b6;
    }

    #draggingContainer.over {
        border: 7px dotted #ffffff;
        color: #ffffff !important;
    }

    #draggingContainer > span {
        display: block;
    }

#scrapbook-book {
    position: fixed;
    bottom: 0;
    right: 0;
    height: 0;
    left: 0;
    background-color: #e1f1f6;
    box-shadow: 0 -10px 20px -10px rgba(0,0,0,0.3);
    z-index: 8999;
    -webkit-transition: height 0.5s, opacity 0.5s;
    -moz-transition: height 0.5s, opacity 0.5s;
    -ms-transition: height 0.5s, opacity 0.5s;
    -o-transition: height 0.5s, opacity 0.5s;
    transition: height 0.5s, opacity 0.5s;
    overflow: auto;
    padding: 0em;
    opacity: 0;
}

    #scrapbook-book.scrapbookisselected {
        padding: 1em;
        height: 200px;
        opacity: 1;
    }

    #scrapbook-book:empty:after {
        content: "Valitse haluamasi tekstikohdat napauttamalla. Sen jälkeen vedä ja pudota ne tähän.";
    }

#artContainer.scrapbookmode {
    padding-bottom: 220px;
}

    #artContainer.scrapbookmode span {
        cursor: cell;
    }

.selectedForDrag {
    cursor: copy !important;
}


.dragging {
    cursor: move !important;
}

#scrapbook-book.drag-target-ready {
    background-color: #ffffff;
}

.scrapbook-book {
    color: #474747;
    padding: 1em;
    cursor: pointer;
    overflow: hidden;
}

.scrapbook-book-actions {
    margin-top: 1em;
    display: none;
}

    .scrapbook-book-actions > a {
        float: right;
        margin-left: 0.5em;
    }

.scrapbook-book-remove:after {
    content: "Poista";
}

.scrapbook-book-rename:after {
    content: "Uudelleennimeä";
}

.scrapbook-book:nth-child(even) {
    background: #f7f7f7;
}

.scrapbook-book-date {
    display: inline-block;
    float: right;
    margin-left: 5px;
    color: #2695b6;
}

#scrapbook-createnew {
    float: right;
    margin-top: 1em;
    font-size: 1em;
}

    #scrapbook-createnew:after {
        content: "» Lisää uusi leikekirja";
    }

.scrapbook-book-selected {
    background-color: #2695b6 !important;
    color: #ffffff;
    cursor: auto;
}

    .scrapbook-book-selected > .scrapbook-book-date {
        color: rgba(255,255,255,0.8);
    }

    .scrapbook-book-selected > .scrapbook-book-actions {
        display: block;
    }

.scrapbook-createnew-container {
    margin-top: 2em;
    padding: 1em;
    background-color: #e1f1f6;
    overflow: hidden;
}

#scrapbook-createnew-name, #scrapbook-change-name-new-name {
    width: 100%;
    box-sizing: border-box;
    padding: 0.5em;
    border: 1px solid #2695b6;
}

.scrapbook-scrap {
    padding: 1em;
    background-color: #ffffff;
}

    .scrapbook-scrap:nth-child(even) {
        background: #f7f7f7;
    }

.tbpath {
    display: block;
    color: #2695b6;
}

.scrapbook-scrap-header {
    overflow: hidden;
}

.scrapbook-scrap-path {
    text-decoration: none;
}

.scrapbook-scrap-path-not-found > .scrapbook-scrap-path {
    color: #a0a0a0;
}

.scrapbook-scrap-has-changed > .scrapbook-scrap-path {
    color: #a00000;
}

.scrapbook-scrap-created {
    display: block;
    color: #2695b6;
    float: left;
}

.scrapbook-scrap-remove {
    display: block;
    color: #c04040;
    float: right;
    text-decoration: none;
}

    .scrapbook-scrap-remove:after {
        content: "» Poista leike";
    }


/*kk*/
.searchAllLink {
    display: block;
    margin-top: 5px;
    margin-bottom: 5px;
    font-size: 1em;
}

#minifiedtocscrollareacontainer a.Expand {
    /*display:none !important;*/
}

.mtocprevlevel {
    font-weight: bold;
    color: #000000;
    margin-left: 7px;
    position: relative;
    padding-left: 15px;
    padding-bottom: 10px;
    display: block;
    overflow: hidden;
}

    .mtocprevlevel:before {
        display: block;
        font-weight: bold;
        content: "«";
        font-size: 1.4em;
        margin-left: 0px;
        position: absolute;
        left: 0;
        top: -4px;
        width: 10px;
        text-align: left;
    }



/* -- Edita Digikirja --------- */

/*piilotetaan tarpeettomat elementit*/
#header {
    display: none;
}

.controlarea {
    display: none;
}

#resizebar {
    display: none;
}

/*yliajot windowresizen päätteeksi*/
.articlearea-override {
    margin-left: 0 !important;
    /*background: pink;*/
}

/*lukutila.js yrittää piilottaa tiettyjä elementtejä. Estetään tämä.*/
#tocarea,
#asiahakemistocontainer {
    display: block !important;
}

/*lukualueen padding*/
#artContainer {
    /*padding sisältyy sisältöön*/
    /*padding-top: 200px;*/ /*tämä on kinkkinen, jos kappale alkaa isolla kuvalla, tämä ei ole hyvä, muuten on ihan tarpeellinen...*/
    margin-top: 54px; /*siirretään yläpalkin verran alaspäin*/
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
	
}
/*keskikokoinen ruutu*/
@media screen and (max-width: 50em), handheld and (max-width: 50em), tv and (max-width: 50em) {
    #artContainer .article {
        padding-left: 0;
        padding-right: 0;
    }
}


.clear-end:after {
    content: "";
    display: block;
    clear: both;
}

.width-limit {
    position: relative;
    /*height: 100%;*/
    max-width: 960px;
    min-width: 290px;
    margin: 0 auto;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.dk-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 46px;
    background: #141414;
    z-index: 4;
    /*ettei yläpalkki hajoa kavannettaessa silloin kun erillinen korostusnappi on näkyvissä*/
    min-width: 310px;
}

    .dk-header a {
        position: relative;
        float: left;
        display: block;
        height: 46px;
        width: 46px;
        margin-left: 1px;
        color: #fff;
        cursor: pointer;
        /*background-color: pink;*/
        background-repeat: no-repeat;
        background-position: center;
        /*background: url(../pics/ico-toc.png) 0 0 no-repeat;*/
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        /*temp kunnes kuvat*/
        text-align: center;
        text-decoration: none;
        line-height: 46px;
    }

        .dk-header a.active,
        .dk-header a:hover {
            background-color: #41bbba;
        }
            /*kolmio*/
            .dk-header a.active:after {
                position: absolute;
                top: 46px;
                left: 15px;
                content: '';
                display: block;
                width: 0;
                height: 0;
                border-left: 8px solid transparent;
                border-right: 8px solid transparent;
                border-top: 10px solid #41bbba;
            }

.dk-ico-exit {
    margin-left: 0 !important;
    /*background-image: url(../pics/dk/navi-symboli-home.png);*/
    background-image: url(../pics/dk/navi-home.svg), none;
    background-size: 30px 26px;
}

.dk-ico-toc {
    /*background-image: url(../pics/dk/navi-symboli-sisalto.png);*/
    background-image: url(../pics/dk/navi-sisis.svg), none;
    background-size: 30px 26px;
}

.dk-ico-sound {
    /*background-image: url(../pics/dk/navi-symboli-aanikirja-kiinni.png);*/
    background-image: url(../pics/dk/navi-aanikirja-kiinni.svg), none;
    background-size: 31px 26px;
}

    .dk-ico-sound.sound-active {
        /*background-image: url(../pics/dk/navi-symboli-aanikirja-auki.png);*/
        background-image: url(../pics/dk/navi-aanikirja-auki.svg), none;
        background-size: 33px 26px;
    }

.dk-ico-ope {
    /*background-image: url(../pics/dk/navi-symboli-ope.png);*/
    background-image: url(../pics/dk/navi-opeaineisto.svg), none;
    background-size: 30px 26px;
}

.dk-header a.dk-ico-ope {
    display: none; /*oletuksena piilossa, käyttöoikeus tarkistetaan*/
}

.dk-ico-search {
    /*background-image: url(../pics/dk/navi-symboli-haku.png);*/
    background-image: url(../pics/dk/navi-haku.svg), none;
    background-size: 25px 26px;
}

.dk-ico-notes {
    /*background-image: url(../pics/dk/navi-symboli-muistilappu.png);*/
    background-image: url(../pics/dk/navi-muistiinpanot-korotukset.svg), none;
    background-size: 22px 26px;
}

.dk-ico-user {
    position: relative;
    /*background-image: url(../pics/dk/navi-symboli-asetukset.png);*/
    background-image: url(../pics/dk/navi-omat-asetukset.svg), none;
    background-size: 21px 26px;
}

    .dk-ico-user .number-tag,
    .dk-ico-notes .notes-number-tag {
        display: none;
        position: absolute;
        top: 21px;
        right: 5px;
        width: 12px;
        height: 12px;
        line-height: 12px;
        border-radius: 6px;
        font-size: 8px;
    }

/* -- sivusiirtymä --- */
.dk-navicontainer {
    float: left;
    height: 46px;
    margin-left: 70px;
}

    .dk-navicontainer .pageinput {
        float: left;
        width: 85px;
        height: 100%;
        margin-left: 1px;
    }

        .dk-navicontainer .pageinput input {
            float: left;
            display: block;
            width: 40px;
            height: 36px;
            line-height: 36px;
            border: none;
            margin: 0;
            margin-top: 5px;
            padding: 0;
            padding-top: 2px;
            text-align: center;
            font-size: 1.167em;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            -webkit-box-shadow: inset 8px 8px 8px -8px rgba(0,0,0,0.2);
            -moz-box-shadow: inset 8px 8px 8px -8px rgba(0,0,0,0.2);
            box-shadow: inset 8px 8px 8px -8px rgba(0,0,0,0.2);
            /*iOS-kulmanpyöristysesto*/
            -webkit-appearance: none;
            -webkit-border-radius: 0;
        }

    .dk-navicontainer #lastpagenumber {
        float: left;
        display: block;
        width: 45px;
        height: 36px;
        line-height: 36px;
        text-align: center;
        margin-left: 0;
        margin-top: 5px;
        font-size: 1.167em;
        /*color: #141414;*/
        color: #000;
        background: #e3e3e3;
    }

    .dk-navicontainer .prevpage,
    .dk-navicontainer .nextpage {
        font-size: 2em;
    }

    .dk-navicontainer .prevpage {
        text-align: right;
        padding-right: 10px;
    }

    .dk-navicontainer .nextpage {
        text-align: left;
        padding-left: 10px;
    }

    .dk-navicontainer .prevpage:after {
        content: '‹';
    }

    .dk-navicontainer .nextpage:after {
        content: '›';
    }

@media screen and (max-width: 40em), handheld and (max-width: 40em), tv and (max-width: 40em) {
    /*tiivistetään ikoneita*/
    .dk-navicontainer {
        margin-left: 0;
    }
}

@media screen and (max-width: 35em), handheld and (max-width: 35em), tv and (max-width: 35em) {
    /*piilotetaan sivusiirtymä*/
    .dk-navicontainer {
        display: none;
    }
}

/* -- sivusiirtymä: loppu --- */

.dk-header-actions-left {
    float: left;
}

.dk-header-actions-right {
    float: right;
}

.dk-action-layer {
    display: none;
    position: fixed;
    top: 46px;
    /*bottom: 30px;*/ /*vaihdettu dynaamiseen korkeussäätöön*/
    height: 1px; /*ei tarvita leveyttä rajoittavaan wrapperiin enempää korkeutta, muuten tämä läpinäkyvä layer tulisikin lukualueen päälle häiritsemään*/
    left: 0;
    right: 0;
    background: none;
    z-index: 3;
}

    .dk-action-layer .width-limit {
        height: 100%;
    }

    .dk-action-layer .action-layer-inner {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        /*bottom: 0;*/ /*vaihdettu dynaamiseen korkeussäätöön*/
        height: 500px; /*tämä korkeus asetetaan aina dynaamisesti scriptillä*/
        overflow: auto;
        padding: 30px 20px 20px 20px;
        background: #eee;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-box-shadow: 0px 0px 6px #888;
        -moz-box-shadow: 0px 0px 6px #888;
        box-shadow: 0px 0px 6px #888;
    }

    .dk-action-layer.mid-size-layer .action-layer-inner {
        left: auto;
        width: 550px;
    }

    .dk-action-layer.small-size-layer .action-layer-inner {
        left: auto;
        width: 260px;
        background: #fff;
        padding: 0;
        height: auto !important; /*estetään omat tiedot -layerin dynaaminen korkeussäätö kokonaan*/
        /*bottom: auto;*/ /*vaihdettu dynaamiseen korkeussäätöön*/
    }

    .dk-action-layer .action-layer-inner > div {
        display: none;
    }

#dk_action_layer_user > div,
#dk_action_layer_user > a {
    position: relative;
    display: block;
    height: 40px;
    line-height: 40px;
    border-top: 2px solid #eee;
    /*color: #141414;*/
    color: #000;
    padding: 0 12px;
}

#dk_action_layer_user > a {
    border-top: 2px solid #eee;
    text-decoration: none;
}

    #dk_action_layer_user > a .number-tag {
        position: absolute;
        top: 8px;
        right: 12px;
    }

.number-tag,
.notes-number-tag {
    display: inline-block;
    width: 24px;
    height: 24px;
    line-height: 24px;
    border-radius: 12px;
    overflow: hidden;
    background: #f76464;
    color: #fff !important;
    font-size: 14px;
    text-align: center;
}
/*fonttikoon säätö*/
.ui-slider.ui-slider-horizontal {
    margin-top: 18px;
    height: 4px;
    border: none;
    background: #eee;
}

.ui-slider .ui-slider-handle {
    background: #41bbba;
    border-color: #41bbba;
    border-radius: 10px;
    top: -.43em;
    height: 1em;
    width: 1em;
}


/*äänikirja: jatka tästä*/
#dk_action_layer_sound {
    padding: 12px;
    background: pink;
}


/*opettajan aineisto: jatka tästä*/
#dk_action_layer_ope > div,
#dk_action_layer_ope > a {
    background: pink;
    text-align: center;
    display: block;
    height: 40px;
    line-height: 40px;
    border-top: 2px solid #eee;
    /*color: #141414;*/
    color: #000;
    padding: 0 12px;
}

#dk_action_layer_ope > a {
    border-top: 2px solid #eee;
    text-decoration: none;
}


/*keskikokoinen ruutu*/
@media screen and (max-width: 50em), handheld and (max-width: 50em), tv and (max-width: 50em) {
    .dk-action-layer.mid-size-layer .action-layer-inner {
        left: 80px !important;
        right: 0 !important;
        width: auto !important;
    }
}
/*pienin ruutu*/
@media screen and (max-width: 25em), handheld and (max-width: 25em), tv and (max-width: 25em) {
    /*vaihdettu dynaamiseen korkeussäätöön*/
    /*layer alas asti*/
    /*.dk-action-layer
	{
		bottom: 0;
	}*/

    /* kavennetaan ikoneita hieman, jotta mahtuvat kaikki myös pienimmällä näytöllä */
    .dk-header a {
        width: 43px;
    }

    .dk-action-layer.mid-size-layer .action-layer-inner {
        left: 0 !important;
        right: 0 !important;
        width: auto !important;
    }

    /*lisätty, jotta opevalikko ei menisi reunan yli pienellä näytöllä*/
    .dk-action-layer.small-size-layer .action-layer-inner {
        right: 0 !important;
    }
}


.my-tabs > ul {
    list-style: none;
    padding: 0;
    margin: 0 0 20px 0;
    height: 38px;
    overflow: hidden;
}

    .my-tabs > ul:after {
        content: '';
        display: block;
        clear: both;
    }

    .my-tabs > ul li a {
        float: left;
        display: block;
        height: 38px;
        line-height: 38px;
        padding: 0 10px;
        margin-bottom: 6px;
        background: #fff;
        /*color: #141414;*/
        color: #000;
        text-decoration: none;
        text-transform: uppercase;
        text-align: center;
        font-weight: bold;
        margin-left: 6px;
    }

    .my-tabs > ul li:first-child a {
        margin-left: 0;
    }

    .my-tabs > ul li a.active {
        background: #006789;
        color: #fff;
    }

.my-tabs > div {
    display: none;
}

/*ikonitabit*/
.my-tabs > ul li a.tab-ico {
    position: relative;
}

    .my-tabs > ul li a.tab-ico:before {
        content: '';
        display: block;
        position: absolute;
        left: 10px;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
    }

.tab-ico-sisalto {
    padding-left: 41px !important;
}

.tab-ico-hakemisto {
    padding-left: 45px !important;
}

.tab-ico-tehtavat {
    padding-left: 45px !important;
}

.tab-ico-media {
    padding-left: 43px !important;
}

.tab-ico-aanikirja {
    padding-left: 41px !important;
}

.tab-ico-sisalto:before {
    width: 22px;
    height: 20px;
    top: 9px;
    /*background-image: url(../pics/dk/tab-sisalto.png);*/
    background-image: url(../pics/dk/tab-sisalto.svg), none;
}

.tab-ico-sisalto.active:before {
    background-image: url(../pics/dk/tab-sisalto-v.svg), none;
}

.tab-ico-hakemisto:before {
    width: 25px;
    height: 24px;
    top: 7px;
    /*background-image: url(../pics/dk/tab-hakemisto.png);*/
    background-image: url(../pics/dk/tab-hakemisto.svg), none;
}

.tab-ico-hakemisto.active:before {
    background-image: url(../pics/dk/tab-hakemisto-v.svg), none;
}

.tab-ico-tehtavat:before {
    width: 28px;
    height: 24px;
    top: 7px;
    /*background-image: url(../pics/dk/tab-tehtavat.png);*/
    background-image: url(../pics/dk/tab-tehtavat.svg), none;
}

.tab-ico-tehtavat.active:before {
    background-image: url(../pics/dk/tab-tehtavat-v.svg), none;
}

.tab-ico-media:before {
    width: 24px;
    height: 24px;
    top: 7px;
    /*background-image: url(../pics/dk/tab-media.png);*/
    background-image: url(../pics/dk/tab-media.svg), none;
}

.tab-ico-media.active:before {
    background-image: url(../pics/dk/tab-media-v.svg), none;
}

/*keskikokoinen ruutu*/
@media screen and (max-width: 50em), handheld and (max-width: 50em), tv and (max-width: 50em) {
    /* Vain ikonit jäävät näkyviin*/
    .my-tabs > ul li a.tab-ico > span {
        display: none;
    }

    .my-tabs > ul li a.tab-ico {
        padding-left: 33px !important;
    }
}

/*pikkutabit*/
.my-tabs.small-tabs > ul li a {
    height: 28px;
    line-height: 28px;
    text-transform: none;
    margin-top: 10px;
}

/* Muistiinpanon share-tabit */
.my-tabs.bm-share-ui-tabs > ul {
    margin-bottom: 10px;
}

    .my-tabs.bm-share-ui-tabs > ul li a {
        border: 1px solid #006789;
        font-weight: normal;
        /* fixattu korkeus aiheuttaa alaosan reunaviivan piiloon jäämisen, korjataan box-sizingilla */
        box-sizing: border-box;
        line-height: 26px;
    }

/*napit*/
.action-button-small {
    display: inline-block;
    height: 28px;
    line-height: 28px;
    padding: 0 10px;
    margin-top: 10px;
    margin-right: 6px;
    background: #fff;
    /*color: #141414;*/
    color: #000;
    text-decoration: none;
    text-align: center;
}

    .action-button-small:hover {
        /*color: #141414;*/
        color: #000;
    }

/* -- Lukuedistyminen--- */
#read_progress {
    position: fixed;
    left: 0;
    right: 0;
    top: 46px;
    height: 8px;
    z-index: 2;
    background: #e3e3e3;
}

    #read_progress .progress {
        display: block;
        width: 0;
        height: 100%;
        background: #41bbba;
    }

    #read_progress .block-mark {
        position: absolute;
        top: 0;
        left: 0;
        width: 2px;
        height: 100%;
        background: #41bbba;
        border-left: 2px solid #e3e3e3;
    }

        #read_progress .block-mark.passed {
            background: #e3e3e3;
            border-left: none;
            border-right: 2px solid #41bbba;
        }
/* -- Lukuedistyminen: loppu --- */

.patharea-wrapper {
    display: none;
    position: fixed;
    top: 54px;
    left: 0;
    right: 0;
    overflow: hidden;
    z-index: 2;
    background: #fff;
    -webkit-box-shadow: 0px 5px 5px 0px rgba(100, 100, 100, 0.3);
    -moz-box-shadow: 0px 5px 5px 0px rgba(100, 100, 100, 0.3);
    box-shadow: 0px 1px 5px 0px rgba(100, 100, 100, 0.3);
    font-size: 14px; /*sama fonttikoko kuin bodyssa, lisätty artContainer:n fonttikokohäkkäyksen vuoksi*/
}

/* -- siirtymänappulat lukualueen päällä --- */
.navlink {
    display: none;
    position: fixed;
    z-index: 1;
    top: 50%;
    margin-top: -20px;
    width: 70px;
    height: 70px;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: center;
    /*nappi saa olla kuvaa isompi*/
    background-size: 45px 45px;
    border-radius: 50%;
}
/*pienin ruutu*/
@media screen and (max-width: 25em), handheld and (max-width: 25em), tv and (max-width: 25em) {
    .navlink {
        /*pienellä näytöllä napit ovat pienemmät*/
        width: 50px;
        height: 50px;
        background-size: 25px 25px;
        background-position: 20px center;
    }
}

.navlink-left {
    left: 0;
    background-image: url(../pics/dk/symboli-nuoli-sivulle-musta.svg), none;
    /*käytetään samaa kuvaa käännettynä*/
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.navlink-right {
    right: 0;
    background-image: url(../pics/dk/symboli-nuoli-sivulle-musta.svg), none;
}
/* -- siirtymänappulat lukualueen päällä: loppu --- */

/* -- toc --- */
#toc {
    /*position: absolute;
	right: 20px;
	left: 20px;
	top: 80px;
	bottom: 20px;
	overflow: auto;*/
}

    #toc > ul.toc > li {
        width: 33.33333%;
        margin: 0;
        padding: 0;
        display: block;
        float: left !important;
        overflow: hidden;
        padding: 0;
        margin: 0;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        margin-top: 18px;
        border-right: 15px solid #eee;
        /*tasojen välistykset*/
        padding-bottom: 9px;
        background: #fff;
    }

    #toc > ul.toc:after {
        content: '';
        display: block;
        clear: both;
    }

    /*päätaso*/
    #toc > ul.toc > li > div {
        padding: 6px 30px 6px 10px; /*margin-right avaus-napin vuoksi*/
        background: #006789;
        font-family: 'Roboto Slab DataBaseReader', serif;
        /*tasojen välistykset*/
        border-bottom: 9px solid #fff;
    }

        #toc > ul.toc > li > div > a {
            color: #fff;
            /*font-weight: bold;*/
            font-size: 1.2em;
        }
    /*toka taso*/
    #toc > ul.toc > li > ul > li > div {
        padding: 0px 5px;
        background: #fff;
        /*tasojen välistykset*/
        /*border-top: 3px solid #fff;*/
    }

    #toc > ul.toc > li > ul > li:first-child > div {
    }

    #toc > ul.toc > li > ul > li > div > a {
        font-size: 1em;
        /*color: #141414;*/
        color: #000;
        padding: 2px 5px;
        display: block;
    }
    /*kolmas taso*/
    #toc > ul.toc > li > ul > li > ul {
        /*tasojen välistykset*/
        border-bottom: 10px solid #fff;
    }

        #toc > ul.toc > li > ul > li > ul > li > div {
            padding: 0px 0px 0px 5px;
            background: #fff;
        }

        #toc > ul.toc > li > ul > li > ul > li:first-child > div {
            padding-top: 5px;
        }

        #toc > ul.toc > li > ul > li > ul > li > div > a {
            font-size: 0.9em;
            padding: 2px 5px;
            display: block;
        }

    /* -- valitut tasot --*/

    /*päätaso*/
    #toc > ul.toc > li > div.Selected,
    #toc > ul.toc > li > div.SelectedLastNode {
        background: #41bbba;
    }

    /*toka taso*/
    #toc > ul.toc > li > ul > li > div.Selected > a,
    #toc > ul.toc > li > ul > li > div.SelectedLastNode > a {
        background: #eee;
    }

    /*kolmas taso*/
    #toc > ul.toc > li > ul > li > ul > li > div.Selected > a,
    #toc > ul.toc > li > ul > li > ul > li > div.SelectedLastNode > a {
    }

/* -- valitut tasot: loppu --*/

#toc_toggle_all {
    position: absolute;
    top: 25px;
    right: 20px;
    text-decoration: none;
    color: #000;
}

    #toc_toggle_all:after {
        content: 'Avaa kaikki';
        display: inline-block;
        height: 30px;
        line-height: 30px;
        padding-left: 20px;
    }

    #toc_toggle_all:before {
        content: '';
        display: block;
        position: absolute;
        top: 7px;
        left: 0;
        width: 16px;
        height: 16px;
        /*line-height: 20px;
	background: #41bbba;
	border-radius: 10px;
	color: #fff !important;
	font-size: 14px;
	text-align: center;
	text-decoration: none;
	font-weight: normal;*/
        /*margin-right: 5px;*/
        /*background: url(../pics/dk/symboli-nuoli-alas-musta.png) center no-repeat;*/
        background-repeat: no-repeat;
        background-position: center;
        background-image: url(../pics/dk/symboli-nuoli-alas-musta.svg), none;
        background-size: 100% 100%;
    }

    #toc_toggle_all.active:after {
        content: 'Sulje kaikki';
    }

    #toc_toggle_all.active:before {
        /*background: url(../pics/dk/symboli-ruksi-musta.png) center no-repeat;*/
        background-image: url(../pics/dk/symboli-ruksi-musta.svg), none;
    }

/*keskikokoinen ruutu*/
@media screen and (max-width: 50em), handheld and (max-width: 50em), tv and (max-width: 50em) {
    /*#toc > ul.toc
	{
		background:red;
	}*/
    #toc > ul.toc > li {
        width: 50%;
    }

    /*toc: kaksi palstaa*/
    #toc_clear_every_third {
        display: none !important;
    }

    #toc_clear_every_other {
        display: block !important;
    }
}
/*pienin ruutu*/
@media screen and (max-width: 25em), handheld and (max-width: 25em), tv and (max-width: 25em) {
    /*#toc > ul.toc
	{
		background:blue;
	}*/
    #toc > ul.toc > li {
        width: 100%;
    }

    /*toc: yksi palsta*/
    #toc_clear_every_third {
        display: none !important;
    }

    #toc_clear_every_other {
        display: none !important;
    }
}

.symboli-suoritettu {
    display: block;
    width: 16px;
    height: 16px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../pics/dk/symboli-suoritettu.svg), none;
    background-size: 100% 100%;
}
/* -- toc: loppu --- */

/* -- hahmoteltu light-boksia -- */
#dk_light_box {
    display: none;
    position: fixed;
    top: 20px;
    left: 20px;
    right: 20px;
    bottom: 20px;
    background: #fff;
    z-index: 5;
    padding: 20px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: 0px 0px 6px #888;
    -moz-box-shadow: 0px 0px 6px #888;
    box-shadow: 0px 0px 6px #888;
}
/* -- hahmoteltu light-boksia: loppu -- */

/* -- tekstikorostukset -- */

/* Edita Digikirja */

.tocarea-wrapper,
.searchresultlist,
.bookmarks-and-highlights-combo-list,
.bmcontent-wrapper,
.hllistcontent-wrapper {
    position: absolute;
    right: 20px;
    left: 20px;
    top: 85px;
    bottom: 20px;
    overflow: auto;
}

    .bmcontent-wrapper .bmitem:first-child {
        margin-top: 10px;
    }

/*näytä vain tämän teoksen korostukset -täppä*/
#hllistcontent > div:first-child {
    display: none;
}

.hllistlist > div,
#bookmarks_and_highlights_combo_list > div /*molemmat*/ {
    display: block;
    position: relative;
    /*oikea padding enemmän poista-napin vuoksi*/
    padding: 15px 55px 15px 15px;
    color: #000;
    background: #fff;
    margin-top: 10px;
}

    #bookmarks_and_highlights_combo_list > div.bm {
        /*share lisätty*/
        padding-right: 80px;
    }

    .hllistlist > div > a,
    #bookmarks_and_highlights_combo_list > div > a, /*hl*/
    #bookmarks_and_highlights_combo_list > div.bmpath a /*bm*/ {
        color: #000;
        text-decoration: none;
        margin-top: 10px;
    }

        .hllistlist > div > a:first-child,
        #bookmarks_and_highlights_combo_list > div > a:first-child, /*hl*/
        #bookmarks_and_highlights_combo_list > div.bmpath a:first-child /*bm*/ {
            color: #006789;
            font-weight: bold;
            margin-top: 0;
        }
        /*Poista-painike*/
        .hllistlist > div > a.bluebutton,
        #bookmarks_and_highlights_combo_list > div a.bluebutton /*molemmat*/ {
            display: block;
            width: 20px;
            height: 20px;
            /*background: url(../pics/dk/symboli-ruksi-musta.png) center no-repeat;*/
            background-repeat: no-repeat;
            background-position: center;
            background-image: url(../pics/dk/symboli-roskakori.svg), none;
            background-size: 100% 100%;
            background-color: transparent;
            color: #ffffff;
            -moz-border-radius: 0;
            -webkit-border-radius: 0;
            border-radius: 0;
            padding: 0;
            border: none;
            font-size: 0;
            text-decoration: none;
            position: absolute;
            top: 5px;
            right: 8px;
        }

/*#hllistlist > div a.bluebutton:hover
{
	background: url(../pics/dk/symboli-ruksi-musta.png) center no-repeat;
}*/

#showbmcontent {
    display: block !important;
}

.contextMenuHLButton,
.contextMenuEditBMButton {
    width: 28px !important;
    height: 28px !important;
}

.contextMenuEditBMButton {
    /*nappi näkyvissä vain pienellä näytöllä*/
    display: none !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-image: url(../pics/dk/symboli-kyna-nelio.svg), none !important;
    background-size: 100% 100% !important;
}

.contextMenuHLButton {
    background: none !important;
}

    /*tässä eroteltu kaikki tapaukset, sillä yleispätevää värimääritelmää oli hankalampi tehdä*/
    .ul.HLColor1, /*väri tekstissä*/
    .contextMenuHLButton.HLColor1, /*väri kontekstivalikon painikkeessa*/
    .hllistlist > div.HLColor1 a.ulListItem, /*väri korostukset-listalla*/
    #bookmarks_and_highlights_combo_list > div.HLColor1 a.ulListItem /*väri yhdistelmälistalla*/ {
        /*background: #bedfe0 !important;*/
        -moz-box-shadow: inset 0 0 0 300px rgba(112,221,224,0.5);
        -webkit-box-shadow: inset 0 0 0 300px rgba(112,221,224,0.5);
        box-shadow: inset 0 0 0 300px rgba(112,221,224,0.5);
    }

    .ul.HLColor2,
    .contextMenuHLButton.HLColor2,
    .hllistlist > div.HLColor2 a.ulListItem,
    #bookmarks_and_highlights_combo_list > div.HLColor2 a.ulListItem {
        /*background: #e0cece !important;*/
        -moz-box-shadow: inset 0 0 0 300px rgba(224,112,112,0.5);
        -webkit-box-shadow: inset 0 0 0 300px rgba(224,112,112,0.5);
        box-shadow: inset 0 0 0 300px rgba(224,112,112,0.5);
    }

    .ul.HLColor3,
    .contextMenuHLButton.HLColor3,
    .hllistlist > div.HLColor3 a.ulListItem,
    #bookmarks_and_highlights_combo_list > div.HLColor3 a.ulListItem {
        /*background: #efe7b4 !important;*/
        -moz-box-shadow: inset 0 0 0 300px rgba(240,224,120,0.5);
        -webkit-box-shadow: inset 0 0 0 300px rgba(240,224,120,0.5);
        box-shadow: inset 0 0 0 300px rgba(240,224,120,0.5);
    }

    /*jostain syystä napit, joissa ei ole tekstiä, tipahtavat eri linjaan mobiilissa*/
    /*korjataan lisäämällä dummy-teksti nappien sisään*/
    .contextMenuHLButton:after,
    .contextMenuEditBMButton:after {
        content: '.';
        color: transparent;
    }

/*keskikokoinen ruutu*/
@media screen and (max-width: 50em), handheld and (max-width: 50em), tv and (max-width: 50em) {
    /*pienennetään kaikki poplayereitä*/
    #context,
    #editbmContext,
    #bookmark_link_hover_list {
        width: 260px !important;
    }
    /*tästä leveydestä eteenpäin tekstiboksi avataan muokkausnapilla*/
    .contextMenuEditBMButton {
        display: inline-block !important;
    }

    #context .contextcontainer #addbmcontent {
        display: none;
        padding: 0 15px 15px 15px;
    }

        #context .contextcontainer #addbmcontent.visible-on-mobile {
            display: block;
        }

    .add-bookmark-textarea {
        height: 60px;
    }
}

/* kun kyseessä on korostuksen poisto -popup, */
/* piilotetaan muistilapun lisäys -tekstikenttä ja tekstinkentän esiintuova painike kapealla näytöllä */
#context[data-state-id=hlremove] .contextcontainer #addbmcontent,
#context[data-state-id=hlremove] .contextcontainer .contextMenuEditBMButton {
    display: none !important;
}

/* -- tekstikorostukset: loppu -- */

/*kaikki textareat*/
textarea {
    font-family: Arial, sans-serif;
}

/* -- muistiinpanot -- */
#editbmContext {
    display: none;
    width: 290px;
    height: 1px;
    overflow: visible;
    position: fixed;
    left: 150px;
    top: 150px;
    z-index: 5;
}

    #editbmContext .editbmContextContainer {
        background-color: #ffffff;
        box-shadow: 0 0 10px 1px rgba(0,0,0,0.3);
        padding: 40px 15px 15px 15px;
        position: relative;
    }

    #editbmContext .editbmContextClose {
        width: 16px;
        height: 16px;
        position: absolute;
        right: 15px;
        top: 14px;
        background-repeat: no-repeat;
        background-position: center;
        background-image: url(../pics/dk/symboli-ruksi-musta.svg), none;
        background-size: 100% 100%;
    }

    #editbmContext .editbmEditButton {
        display: block;
        width: 16px;
        height: 16px;
        /*background: url(../pics/dk/symboli-ruksi-musta.png) center no-repeat;*/
        background-repeat: no-repeat;
        background-position: center;
        background-image: url(../pics/dk/symboli-kyna-pyorea.svg), none;
        background-size: 100% 100%;
        background-color: transparent;
        text-decoration: none;
        position: absolute;
        top: 14px;
        right: 37px;
    }

    #editbmContext .editbmShareButton {
        /* oletuksena piilossa, aktivoidaan, jos käyttäjä kuuluu johonkin ryhmään */
        display: none;
        width: 16px;
        height: 16px;
        background-repeat: no-repeat;
        background-position: center;
        background-image: url(../pics/dk/symboli-sharenuoli.svg?v=2), none;
        background-size: 100% 100%;
        background-color: transparent;
        text-decoration: none;
        position: absolute;
        top: 14px;
        right: 60px;
    }

    #editbmContext .editbmContextContent {
        overflow: hidden;
    }

        #editbmContext .editbmContextContent #editbmPreview {
            min-height: 20px;
            /*annetaan kirjanmerkin tekstin rivittyä*/
            white-space: pre-wrap;
        }

        /*muokkaus*/
        #editbmContext .editbmContextContent .bmitem {
            padding: 0;
        }

            #editbmContext .editbmContextContent .bmitem > div {
                margin: 0 !important;
            }

        #editbmContext .editbmContextContent .bmpath {
            display: none;
        }

        #editbmContext .editbmContextContent .bluebutton {
            display: block !important;
            float: none !important;
            margin-top: 5px;
            margin-right: 0 !important;
        }

/*#editbmContext textarea#editbmContextText
{
	width: 210px;
	height: 130px;
	padding: 5px;
	border: none;
}*/
/* -- muistiinpanot: loppu -- */

/* -- asiasanojen leijuboksi -- */
/*merkatun asiasanan ulkoasu*/
*[data-idw-desc] {
    color: #41bbba !important;
    cursor: pointer;
}

.index-word-hover-box {
    display: none;
    position: absolute;
    top: 100px;
    left: 100px;
    width: 300px;
    padding: 15px;
    padding-right: 35px;
    background: #fff;
    box-shadow: 0 0 10px 1px rgba(0,0,0,0.3);
    z-index: 1002;
}
/*pienin ruutu*/
@media screen and (max-width: 25em), handheld and (max-width: 25em), tv and (max-width: 25em) {
    .index-word-hover-box {
        max-width: 15em;
    }
}

.index-word-hover-box-title {
    color: #41bbba;
    font-weight: bold;
}

.index-word-hover-box-desc {
    margin-top: 5px;
    color: #000;
}

.index-word-hover-box-close {
    width: 16px;
    height: 16px;
    position: absolute;
    right: 15px;
    top: 14px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../pics/dk/symboli-ruksi-musta.svg), none;
    background-size: 100% 100%;
}
/* -- asiasanojen leijuboksi: loppu -- */

/* -- Edita Digikirja: loppu --------- */






/*
#dk_action_layer_ope ul {
	padding:0;
	margin:0;
	margin-bottom:10px;
	list-style:none;
}
*/

#dk_action_layer_ope ul {
    margin: 0;
    padding: 0;
}

    #dk_action_layer_ope ul li {
        display: block;
        padding: 0;
        /*box-shadow:inset 0 0 0 1px rgba(0,0,0,0.15), 0 0 10px 0 rgba(0,0,0,0.15);*/
        margin-left: 0;
        list-style: none outside none;
        position: relative;
    }





#dk_action_layer_ope > ul > li > a {
    display: block;
    background-color: #ffffff;
    color: #8d8b8b;
    padding: 10px;
    text-decoration: none;
    font-weight: bold;
    text-transform: uppercase;
    border-top: 1px dotted #d0d0d0;
    -webkit-transition: background-color 0.5s;
    transition: all 0.5s;
}

#dk_action_layer_ope ul li.open > a {
    background-color: #006789;
    color: #ffffff;
    border-top: 1px solid transparent;
}

#dk_action_layer_ope ul li:first-child > a {
    border-top: none;
}

#dk_action_layer_ope > ul > li:first-child {
}

#dk_action_layer_ope > ul > li > div {
    background-color: #ffffff;
}

#dk_action_layer_ope .catFiles {
    display: none;
}

    #dk_action_layer_ope .catFiles a {
        text-decoration: none;
    }

    #dk_action_layer_ope .catFiles ul li {
        padding: 15px;
    }

#dk_action_layer_ope .nodeTitle {
    box-sizing: border-box;
    width: 100%;
    padding: 0;
}

#dk_action_layer_ope .catFiles ul li {
    padding: 15px;
}

    #dk_action_layer_ope .catFiles ul li:last-child {
        border: none;
    }

#dk_action_layer_ope .attTitle {
    display: block;
    background-color: transparent;
    color: #0e4562;
    font-size: 12px;
}

    #dk_action_layer_ope .attTitle:before {
        display: inline-block;
        content: "▶";
        margin-right: 6px;
        font-size: 16px;
    }

#dk_action_layer_ope .hideCat {
    display: none;
}





/*audioplayer*/
.audioplayer {
    background-color: #f0f0f0;
    padding: 10px;
}

.button-play {
    display: inline-block;
    background-color: #f0f0f0;
    width: 25px;
    height: 25px;
    position: relative;
    vertical-align: middle;
}

    .button-play:hover {
        text-decoration: none;
    }

    .button-play:after {
        display: block;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        content: "";
        background: url(/pages/TeachingMaterial/pics/audioplayer.png) 0px 0 no-repeat;
    }

    .button-play.playing:after {
        background-position: -25px 0;
    }

.seekbarcontainer {
    background-color: #e0e0e0;
    padding-right: 5px;
    padding-left: 5px;
    display: inline-block;
    margin-left: 10px;
    position: relative;
    vertical-align: middle;
}

.seekbar {
    height: 1em;
    width: 150px;
}

.ui-widget-content {
}

.audioplayer * {
    border: none !important;
}

.audioplayer .ui-slider-horizontal {
    height: 1em;
    margin-top: 0px;
}

.audioplayer .ui-slider {
    position: relative;
    text-align: left;
    background: #e0e0e0;
}

.audioplayer .ui-state-default, .audioplayer .ui-widget-content .ui-state-default, .audioplayer .ui-widget-header .ui-state-default {
    /*border: 1px solid #aed0ea;*/
    font-weight: bold;
    color: #2779aa;
    background: #004966;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.audioplayer .ui-slider-horizontal .ui-slider-handle {
    top: 0;
    margin-left: -.6em;
}

.audioplayer .ui-slider .ui-slider-handle {
    position: absolute;
    z-index: 2;
    width: 1em;
    height: 1em;
    cursor: default;
    -ms-touch-action: none;
    touch-action: none;
}

.audioplayer .ui-slider-handle {
    outline: none;
}

.ui-menu-item span {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/*Edita DK: piilotetaan kpl-tiedot haun sanaehdotuslistalta*/
#searchform .ui-autocomplete .ui-menu-item a div small {
    display: none;
}

/*viewers*/
#modallayer {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.8);
    z-index: 1000;
    display: block;
}

#imagecontainer {
    position: fixed;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 2000;
    display: none;
    transition: all 0.5s;
    text-align: center;
    /*Edita-DK: kuvalle speksattu maksimileveys*/
    max-width: 1500px;
    margin: 0 auto;
}

    #imagecontainer.final {
        left: 40px !important;
        right: 40px !important;
        top: 40px !important;
        bottom: 40px !important;
    }

/*keskikokoinen ruutu*/
@media screen and (max-width: 50em), handheld and (max-width: 50em), tv and (max-width: 50em) {
    #imagecontainer.final {
        left: 1em !important;
        right: 1em !important;
        top: 1em !important;
        bottom: 1em !important;
    }
}

#imagecontainer.fullscreen {
    left: 0px !important;
    right: 0px !important;
    top: 0px !important;
    bottom: 0px !important;
    background-color: #000000;
}

    #imagecontainer.fullscreen #viewer-actions {
        top: 0;
        right: 0;
    }

#imagecontainer canvas {
    z-index: 2001;
}




.viewer img {
    display: none;
}

#viewer-actions {
    position: absolute;
    display: none;
    top: -40px;
    height: 33px;
    width: 123px;
    right: -20px;
    background-color: #0e4562;
    text-align: right;
    box-shadow: 0 0 10px 0 rgba(0,0,0,1);
    border-left: 1px solid rgba(255,255,255,0.3);
    border-bottom: 1px solid rgba(255,255,255,0.3);
    border-right: 1px solid rgba(255,255,255,0.3);
}

    #viewer-actions a {
        display: inline-block;
        text-decoration: none;
        height: 33px;
        width: 40px;
        border-left: 1px solid rgba(255,255,255,0.5);
        background: url(/pages/TeachingMaterial/pics/picviewer.png);
    }

        #viewer-actions a.viewer-full.option-on {
            background-position: 0px -33px;
            background-color: #ffffff;
        }

        #viewer-actions a:hover {
            background-color: #1a6481;
        }

        #viewer-actions a:first-child {
            border-left: 1px solid transparent;
        }

        #viewer-actions a.viewer-draw {
            background-position: -40px 0;
        }

        #viewer-actions a.viewer-close {
            background-position: -80px 0;
        }

        #viewer-actions a.viewer-draw.option-on {
            background-position: -40px -33px;
            background-color: #ffffff;
        }

#viewer-prev, #viewer-next {
    position: fixed;
    top: 50%;
    margin-top: -50px;
    width: 150px;
    left: 40px;
    text-align: left;
    font-size: 100px;
    line-height: 100px;
    height: 100px;
    color: #ffffff;
    opacity: 0.4;
    text-shadow: 0 0 10px 0 rgba(0,0,0,0.3);
    text-decoration: none;
    transition: opacity 0.5s;
    font-weight: normal;
}


    #viewer-prev:hover, #viewer-next:hover {
        opacity: 1;
    }

#viewer-next {
    right: 40px;
    left: auto;
    text-align: right;
}

#img {
    display: inline-block;
    box-shadow: 0 0 0 5px #e8e8e8;
    position: relative;
}

#alertdialog, #uploadprogress, #videocontainer, #htmlcontainer {
    position: fixed;
    left: 50%;
    margin-left: -175px;
    top: 50%;
    margin-top: -125px;
    width: 350px;
    height: 250px;
    z-index: 1001;
    background-color: #f0f0f0;
    box-shadow: inset 0 0 0 1px rgba(0,0,0,0.3), 0 0 20px 0 rgba(0,0,0,0.3);
    color: #000000;
    padding: 10px;
}

#htmlcontainer {
    left: 50px;
    top: 50px;
    right: 50px;
    bottom: 50px;
    width: auto;
    height: auto;
    margin-left: 0;
    margin-top: 0;
}

#videocontainer {
    width: 500px;
    height: 281px;
    margin-left: -250px;
    margin-top: -140px;
}

#modallayer > div a.closeButton {
    background: #004764;
    width: 50px;
    height: 45px;
    position: absolute;
    right: 0;
    top: -45px;
    color: #ffffff;
    text-align: center;
    line-height: 45px;
    text-decoration: none;
}

    #modallayer > div a.closeButton:after {
        content: "✖";
        font-weight: normal;
    }

.modal #modallayer, .uploading #modallayer, .viewvideo #modallayer, .viewhtml #modallayer {
    display: block;
}

.attIcon {
    display: inline-block;
    margin-bottom: 5px;
    padding-left: 20px;
    position: relative;
    color: #0a4966;
    font-size: 12px;
    text-decoration: none;
    line-height: 17px;
}

    .attIcon:before {
        content: "AVAA LINKKI";
    }

    .attIcon:after {
        display: block;
        content: "";
        width: 17px;
        height: 17px;
        position: absolute;
        left: 0;
        top: 0;
        background: url(/pages/TeachingMaterial/pics/attachment-icons.png) no-repeat;
    }

.attHtmlPackage.attIcon:before {
    content: "AVAA";
}

.attHtmlPackage.attIcon:after {
    background-position: -17px 0;
}

.attHtml.attIcon:before {
    content: "AVAA SIVU";
}

.editMode .attHtml.attHtml:before {
    content: "MUOKKAA SIVUA";
}

.attHtml.attIcon:after {
    background-position: -17px 0;
}

.attDownload.attIcon:before {
    content: "LATAA TIEDOSTO";
}

.attDownload.attIcon:after {
    background-position: -51px 0;
}

.attVimeo.attIcon:before {
    content: "NÄYTÄ VIDEO";
}

.attVimeo.attIcon:after {
    background-position: -85px 0;
}

.attVideosync.attIcon:before {
    content: "NÄYTÄ VIDEO";
}

.attVideosync.attIcon:after {
    background-position: -85px 0;
}

/*AUDIOBOOK*/


#audiobook, #audiobook ul {
    list-style: none;
    padding: 0;
    margin: 0;
    padding-left: 20px;
    background-color: #fff;
}

#audiobook {
    margin-left: 0px;
    margin-top: 10px;
    padding-left: 0;
}

    #audiobook ul {
        display: none;
    }

    #audiobook li {
        padding-top: 5px;
        padding-bottom: 5px;
        color: #333;
        position: relative;
        cursor: pointer;
    }

    #audiobook ul.opened {
        display: block;
    }

.toggleNode {
    display: inline-block;
    color: #000;
    width: 1em;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
}

    .toggleNode:before {
        content: "+";
    }

    .toggleNode.minimize:before {
        content: "-";
    }

.nodeless:before {
    display: inline-block;
    content: "+";
    opacity: 0;
    width: 1em;
}

#player-container {
    position: fixed;
    bottom: 0;
    height: 40px;
    left: 0;
    right: 0;
    background-color: #000000;
    z-index: 10002;
}

#player {
    margin-top: 10px;
    max-width: 960px;
    min-width: 290px;
    margin-left: auto;
    margin-right: auto;
}

    #player ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    #player > ul {
        margin-left: 10px;
        margin-right: 10px;
    }

    #player ul > li {
        float: left;
        margin-left: 20px;
        line-height: 23px;
        color: #ffffff;
    }

        #player ul > li:first-child {
            margin-left: 0;
        }

.player-button {
    position: relative;
    cursor: pointer;
    width: 23px;
    height: 23px;
}

    .player-button.audiobook-navi-disabled {
        opacity: 0.3;
        cursor: default;
    }

#player-button-play {
    background: url(../pics/dk/audio-player-play.svg) no-repeat;
}

    #player-button-play.playing {
        background: url(../pics/dk/audio-player-pause.svg) no-repeat;
    }

#player-button-volume {
    background: url(../pics/dk/audio-player-mute.svg) no-repeat;
}

    #player-button-volume.active {
        background: url(../pics/dk/audio-player-volume.svg) no-repeat;
    }



#player-button-volume-slider {
    margin-top: 9px !important;
    display: block;
    height: 1em;
    width: 90px;
    margin-left: 13px !important;
    background: #c0c0c0;
}

#player-button-volume.active > #player-button-volume-slider {
    display: block;
}

#player-button-previous {
    background: url(../pics/dk/audio-player-previous.svg) no-repeat;
}

#player-button-next {
    margin-left: 10px !important;
}

#player-button-next {
    background: url(../pics/dk/audio-player-next.svg) no-repeat;
}

#player-title {
    max-width: 200px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

#seekbar {
    background-color: #e3e3e3;
    padding-right: 5px;
    padding-left: 5px;
    display: inline-block;
    margin-left: 13px !important;
    position: relative;
    vertical-align: middle;
    margin-top: 9px !important;
}

.seekbar-handle {
    height: 4px;
    width: 180px;
}

#player-container * {
    border: none !important;
}

#player-container .ui-slider-horizontal {
    height: 4px;
}

#player-container .ui-slider {
    position: relative;
    text-align: left;
    background: #ffffff;
}

#player-container .ui-widget-header {
    background: rgba(65, 187, 186, 1);
}

    #player-container .ui-state-default, #player-container .ui-widget-content .ui-state-default, #player-container .ui-widget-header .ui-state-default {
        /*border: 1px solid #aed0ea;*/
        font-weight: bold;
        color: #2779aa;
        background: #004966;
    }

#player-container .ui-corner-all {
    border-radius: 0;
}

#player-container .ui-slider-horizontal .ui-slider-handle {
    top: 0;
    margin-left: -.6em;
}

/*
#player-container .ui-slider.ui-slider-horizontal {
	margin-top:0 !Important;
}
*/

#player-container .ui-slider .ui-slider-handle {
    position: absolute;
    z-index: 2;
    width: 20px;
    height: 20px;
    margin-top: -8px;
    cursor: default;
    -ms-touch-action: none;
    touch-action: none;
    background-color: rgba(65, 187, 186, 1) !important;
    border-radius: 10px;
}

#player-container .ui-slider-handle {
    outline: none;
}

.hasaudio .hasaudio-icon {
    display: inline-block;
    margin-left: 5px;
    background: url(../pics/dk/audio-player-toc-play.svg) no-repeat;
    opacity: 0.5;
    width: 11px;
    height: 11px;
}


#audiobook li.activeaudio {
    opacity: 1;
}

.activeaudio.hasaudio > .hasaudio-icon {
    opacity: 1;
}

.activeaudio.hasaudio:not(.paused) > .hasaudio-icon {
    background: url(../pics/dk/audio-player-toc-pause.svg) no-repeat;
}

#audiobook li.activeaudio li .hasaudio-icon {
    opacity: 0.5;
}

#dk_action_layer_sound {
    background-color: #fff;
}


#player-button-play.playing:after {
}

.inActiveLevel {
    display: none !important;
}

.emptyCats:after {
    padding: 20px;
    display: block;
    font-weight: bold;
    font-size: 1.167em;
    content: "Siirry lukuun, jonka opeaineistoa haluat tarkastella.";
}

@media screen and (max-width: 40em), handheld and (max-width: 40em), tv and (max-width: 40em) {
    #player > ul > li {
        display: inline-block;
        float: none;
        vertical-align: middle;
    }

    #player-button-volume, #player-button-volume-slider, #player-time, #player-title {
        display: none !important;
    }

    #player > ul {
        text-align: center;
    }

    #seekbar {
        margin-top: 0 !important;
    }
}

/* -- Merkitse luetuksi --------- */
span.HasBeenRead {
    display: block;
    margin-top: 1em;
    height: 30px;
    line-height: 30px;
    background-repeat: no-repeat;
    background-position: left center;
    background-image: url(../pics/dk/symboli-ei-suoritettu.svg), none;
    background-size: 30px 30px;
    cursor: pointer;
}

    span.HasBeenRead.selected {
        background-image: url(../pics/dk/symboli-suoritettu.svg), none;
    }

    span.HasBeenRead:after {
        content: 'Merkitse luetuksi';
        color: #ccc;
        text-transform: uppercase;
        font-size: 0.75em;
        font-weight: bold;
        margin-left: 40px;
    }

    span.HasBeenRead.selected:after {
        content: 'Merkitse lukemattomaksi';
        color: #41bbba;
    }

#toc ul.toc li.has-been-read > div:after {
    position: absolute;
    right: 9px;
    top: 3px;
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../pics/dk/symboli-suoritettu.svg), none;
    background-size: 100% 100%;
}

#toc ul.toc li.has-been-read > div a {
    padding-right: 25px;
}
/* Päätaso */
#toc > ul.toc > li.has-been-read > div:after {
    top: 10px;
    right: 3px;
}
/* -- Merkitse luetuksi: loppu --------- */

/* Läksynappi, aktiivinen */
#article a.HomeworkButton.selected {
    background: #f76464;
    color: #fff;
}

/* -- Video ja ThingLink--------- */
.embed-ThingLink-container,
.embed-video-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    max-width: 100%;
    height: auto;
    margin: 2em 0;
}
    .embed-ThingLink-container iframe,
    .embed-ThingLink-container object,
    .embed-ThingLink-container embed,
    .embed-video-container iframe,
    .embed-video-container object,
    .embed-video-container embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
/* -- Video ja ThingLink: loppu --------- */

/*estetään ios:ää zoomaamasta automaattisesti, kun tekstikenttään kohdistetaan (mm. muistilapun lisäys)*/
/*fonttikoko tulee olla vähintään 16px zoomauksen estämiseksi*/
@media screen and (max-width: 50em), handheld and (max-width: 50em), tv and (max-width: 50em) {
    .textinput,
    .textinput:focus,
    .bmedit,
    .bmedit:focus,
    .add-bookmark-textarea,
    .add-bookmark-textarea:focus {
        font-size: 16px;
    }
}

/*iOS piilottaa scrollbarin oletuksena absolute-elementeiltä, vaikka scrollattavaa olisi (esim. hakutulokset)*/
/*pakotetaan näyttämään kustom-scrollbar*/
/*sivuvaikutuksena tämä muuttaa scrollbarin ulkoasua myös Chromen desktop-versiossa*/
/*vaikutusta desktopiin, voidaan yrittää poistaa tarpeen vaatiessa*/
.dk-action-layer ::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
}

.dk-action-layer ::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: rgba(0,0,0,.5);
    -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}

.notebook-linkified-area:empty:after {
    /* content:"Muistioon voi tallentaa kirjakohtaisia muistiinpanoja, jotka eivät kohdistu mihinkään tiettyyn kohtaan kirjassa toisin kuin muistilaput."; */
}

/*-- Kirjanmerkin share-toiminto ---------*/
.bm-share-ui-wrapper {
    margin-top: 15px;
}

.bm-share-ui-title {
    color: #006789;
    font-size: 1.1em;
    font-weight: bold;
    text-transform: uppercase;
}

.bm-share-ui-select-list {
    border: 1px solid #c7c7c7;
    padding: 5px 10px;
    max-height: 190px;
    background-color: #fff;
    cursor: pointer;
    overflow: auto;
    /*margin-top: 10px;*/
}

.bm-share-ui-list-item {
    padding: 5px 0;
}

    .bm-share-ui-list-item .share-item-select {
        display: inline-block;
        color: #cd1a1d;
        text-transform: uppercase;
        text-decoration: none;
        font-size: 0.83rem;
        vertical-align: baseline;
        width: 10px;
        height: 10px;
        border: 1px solid #a0a0a0;
        border-radius: 10px;
        position: relative;
        top: 2px;
    }

    .bm-share-ui-list-item.selected .share-item-select {
        background-color: #a0a0a0;
    }

    .bm-share-ui-list-item .share-item-group-name,
    .bm-share-ui-list-item .share-item-last-name {
        margin-left: 10px;
    }

    .bm-share-ui-list-item .share-item-first-name,
    .bm-share-ui-list-item .share-item-type-tag {
        margin-left: 5px;
    }

    .bm-share-ui-list-item .share-item-type-tag {
        font-style: italic;
    }

.bm-share-ui-buttons {
    margin-top: 10px;
}

.bm-share-ui-share-button {
    margin-right: 10px;
}

.bm-share-tag-wrapper {
    margin-top: 15px;
}

    .bm-share-tag-wrapper .shared-by-tag,
    .bm-share-tag-wrapper .edited-tag {
        display: inline-block;
        padding: 3px 6px;
        color: #fff !important;
        font-size: 0.9em;
        text-transform: uppercase;
        margin-right: 7px;
    }

    .bm-share-tag-wrapper .shared-by-tag {
        background: #f76464;
    }

    .bm-share-tag-wrapper .edited-tag {
        background: #888;
    }

/*-- Kirjanmerkin share-toiminto: loppu ---------*/


















/*AO äänikirja*/
#player-container-new {
	display:none;
    position: fixed;
    bottom: 0;
    height: 40px;
    left: 0;
    right: 0;
    background-color: #000000;
    z-index: 99999;
}



body.audiobook-active .controlarea-inner {
	bottom:40px;
}

   

#player-new {
    margin-top: 10px;
    max-width: 1250px;
    min-width: 290px;
    margin-left: auto;
    margin-right: auto;
	position:relative;
}

/*DK*/
#player-new {
	margin-top: 10px;
	max-width: 960px;
	min-width: 290px;
	margin-left: auto;
	margin-right: auto;
}

#player-new ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

#player-new > ul {
    margin-left: 10px;
    margin-right: 10px;
}

#player-new ul > li {
    float: left;
    margin-left: 20px;
    line-height: 23px;
    color: #ffffff;
}

#player-new ul > li:first-child {
    margin-left: 0;
}

.player-button {
    position: relative;
    cursor: pointer;
    width: 23px;
    height: 23px;
}

    .player-button.audiobook-navi-disabled {
        opacity: 0.3;
        cursor: default;
    }

#player-button-play-new {
    background: url(../pics/dk/audio-player-play.svg) no-repeat;
}

    #player-button-play-new.playing {
        background: url(../pics/dk/audio-player-pause.svg) no-repeat;
    }

#player-button-volume-new {
    background: url(../pics/dk/audio-player-mute.svg) no-repeat;
}

    #player-button-volume-new.active {
        background: url(../pics/dk/audio-player-volume.svg) no-repeat;
    }



#player-button-volume-slider-new {
    margin-top: 9px !important;
    display: block;
    height: 1em;
    width: 90px;
    margin-left: 13px !important;
    background: #c0c0c0;
}

#player-button-volume.active-new > #player-button-volume-slider-new {
    display: block;
}

#player-button-previous-new {
    background: url(../pics/dk/audio-player-previous.svg) no-repeat;
	display:none !important;
}

#player-button-next-new {
    margin-left: 10px !important;
	display:none !important;
}

#player-button-next-new {
    background: url(../pics/dk/audio-player-next.svg) no-repeat;
}

#player-title-new {
    max-width: 200px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

#seekbar-new {
    background-color: #e3e3e3;
    padding-right: 5px;
    padding-left: 5px;
    display: inline-block;
    margin-left: 13px !important;
    position: relative;
    vertical-align: middle;
    margin-top: 9px !important;
}

.seekbar-handle-new {
    height: 4px;
    width: 180px;
}

#player-container-new * {
    border: none !important;
}

#player-container-new .ui-slider-horizontal {
    height: 4px;
}

#player-container-new .ui-slider {
    position: relative;
    text-align: left;
    background: #ffffff;
}

#player-container-new .ui-widget-header {
    background: rgba(65, 187, 186, 1);
}

#player-container-new .ui-state-default, #player-container-new .ui-widget-content .ui-state-default, #player-container-new .ui-widget-header .ui-state-default {
    font-weight: bold;
    color: #2779aa;
    background: #004966;
}

#player-container-new .ui-corner-all {
    border-radius: 0;
}

#player-container-new .ui-slider-horizontal .ui-slider-handle {
    top: 0;
    margin-left: -.6em;
}



#player-container-new .ui-slider .ui-slider-handle {
    position: absolute;
    z-index: 2;
    width: 20px;
    height: 20px;
    margin-top: -8px;
    cursor: default;
    -ms-touch-action: none;
    touch-action: none;
    background-color: rgba(65, 187, 186, 1) !important;
    border-radius: 10px;
}

#player-container-new .ui-slider-handle {
    outline: none;
}

.hasaudio .hasaudio-icon {
    display: inline-block;
    margin-left: 5px;
    background: url(../pics/dk/audio-player-toc-play.svg) no-repeat;
    opacity: 0.5;
    width: 11px;
    height: 11px;
}
/*

#audiobook li.activeaudio {
    opacity: 1;
}

.activeaudio.hasaudio > .hasaudio-icon {
    opacity: 1;
}

.activeaudio.hasaudio:not(.paused) > .hasaudio-icon {
    background: url(../pics/audio-player-toc-pause.svg) no-repeat;
}

#audiobook li.activeaudio li .hasaudio-icon {
    opacity: 0.5;
}
*/

@media screen and (max-width: 770px), handheld and (max-width: 770px), tv and (max-width: 770px) {
	
	#player-title-new, #player-button-volume-new, #player-button-volume-slider-new {
		display:none !important;
	}
	
}

#audiobookplayer-close-new {
	display:block;
	position:absolute;
	right:10px;
	top:0;
	height:20px;
	width:20px;
	color:#fff;
	font-weight:bold;
	font-size:20px !important;
	line-height:20px;
	text-align:right;
	text-decoration:none;
}

#audiobookplayer-close-new:after {
	content:"×";
}

/* rikkinäiset korostukset ja kirjanmerkit */
#HLBroken {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	overflow:visible;
	cursor:pointer;
}

#HLBroken.isempty {
	display:none;
}
	
.HLBroken-container {
	width: 33%;
	position: absolute;
	right: 0;
	bottom: 0;
	overflow: visible;
	background-color: #41bbba;
	padding: 5px;
	color: #fff;
	text-align: center;
	height: 30px;
}

.HLBroken-container:before {
	height: 20px;
	width: 20px;
	display: block;
	content: "";
	position: absolute;
	left: 10px;
	bottom: 10px;
	background: url(../pics/dk/alert-icon.svg) no-repeat;
	background-size: contain;
	border-radius: 20px;
}

.HLBroken-container-toggle {
	cursor:pointer;
	line-height:30px;
}

.HLBroken-list-container {
	position: absolute;
	display: none;
	bottom: 100%;
	margin-top: -1px;
	height: 300px;
	overflow: auto;
	left: 0;
	right: 0;
	background-color: #eeeeee;
	color: #404040;
	padding-top: 5px;
	padding-bottom: 15px;
	padding-left: 15px;
	padding-right: 15px;
}

.HLBroken-list-container::-webkit-scrollbar {
	-webkit-appearance: none;
	width: 7px;
}
	
#HLBroken.active .HLBroken-list-container {
	display: block;
}

#HLBroken.active .HLBroken-container:after {
	position: absolute;
	z-index:99999;
	top: 0;
	margin-top:-10px;
	left: 50%;
	margin-left:-4px;
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 10px solid #41bbba;
}

.HLBroken-full-text {
	display:none;
}

#HLBroken .ulListItem {
	cursor:default;
	
}

#HLBroken .hllistlist {
	text-align: left;
}

.ulListItem.full-text .HLBroken-full-text {
	display: inline;
}

.ulListItem.full-text .HLBroken-cropped-text {
	display: none;
}

.HLBroken-toggle-full-text {
	font-weight:bold;
	color: #006789;
	cursor:pointer;
}

/*keskikokoinen ruutu*/
@media screen and (max-width: 50em), handheld and (max-width: 50em), tv and (max-width: 50em) {
	.HLBroken-container {
		left: 80px !important;
		right: 0 !important;
		width: auto !important;
	}
}
/*pienin ruutu*/
@media screen and (max-width: 25em), handheld and (max-width: 25em), tv and (max-width: 25em) {


	.HLBroken-container {
		left: 0 !important;
		right: 0 !important;
		width: auto !important;
	}
}

.pathlost {
	color:#ff0000;
}

.pathlostinfo:after {
	margin-left: 5px;
	background-color: #ff0000;
	border-radius: 30px;
	display: inline-block;
	width: 1em;
	height: 1em;
	color: #fff;
	text-align: center;
	line-height: 1em;
	content: "!";
}

#article a > img {
	width: 100%;
}
/*
#dk_ico_notes {
	display:none;
}

.mainarea {
	margin-bottom:30px;
}

.mainarea:after {
	display: block;
	color: #fff;
	content: "Kasvaneen käytön aiheuttamista suorituskykyongelmista johtuen merkintöjen tekeminen on estetty toistaiseksi. Korjaamme ongelman mahdollisimman pikaisesti.";
	background-color: #404040;
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	text-align:center;
	line-height:30px;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
	height:30px;
}*/