.mobile-only { display: none; }
.only-responsive,
.only-responsive-inline,
.only-responsive-tablerow { display: none; }

/*****************************************************************
Emoikkunan ylläpitoelementit. 
Linkattu myös ylläpidon popup-ikkunoiden headiin. Esimerkiksi
yläpalkin tyyliluokat ovat käytössä myös popup-headissa.

Huom! Muutokset myös cui/styles_print_common.css:ään!

MP101008: styles_updateform-mukaan, jos emoikkunassa käytetään
admin-tallennuslomakkeen input-makroja.
******************************************************************/

@import url(/common_ui/embed_ui/styles_updateform.css);

div.foggy { overflow: hidden; }

.admin-linkset {
 background-color:#ffffdd;
 white-space:nowrap;
 border:1px solid #808080;
 padding:4px;
 padding-bottom:2px;
 font-weight:normal;
 -moz-box-shadow: 2px 2px 5px  #cccccc;
 -webkit-box-shadow: 2px 2px 5px  #cccccc;
 box-shadow: 2px 2px 5px  #cccccc;
 /* For IE 8 */
 -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#aaaaaa')";
 /* For IE 5.5 - 7 */
 filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#aaaaaa');
}

img.admin-icon {
 margin:0 0 3px 0; 
 vertical-align:middle;
}

.admin-linkset a, a.admin, a.admin:visited,
.admin-link-like,
.box-tr, .box-info, .box-att,
.box-tr a, .box-info a, .box-att a,
.box-tr a:visited, .box-info a:visited, .box-att a:visited {
 color:black !important;
 font-size:9pt;
 font-family: verdana, arial, helvetica, Sans-serif; 
 text-decoration:none;
}

.box-tr a, .box-info a, .box-att a,
.box-tr a:visited, .box-info a:visited, .box-att a:visited {
 text-decoration:underline !important;
}


/*****************************************************************
MP030608: Yleiskäyttöinen laatikko, aikasemmin "kehys" ja "huomio".
tr = transparent, ei taustaväriä
info = harmaa laatikko
att = attention (keltainen laatikko)
Käytössä sekä emoikkunassa että popupissa.

MP211008: Lisäsin tr-boxiin valkoisen taustavärin, se on siis
admin-poppareissa edelleen "läpinäkyvä", kun siellä taustaväri on
valkoinen. Emossa sitä ei ole käytettykään, vaan siellä on käytössä
(tätä kirjoittaessa) -att -luokka.
Muutos tuli tarpeeseen lomake-editorin input_updateform.inc:ssä
kenttätyyppien wysiwyg-valintaan, joka näytetään keltaisen
divin päällä.
Lisäsin samalla kaikkiin boxeihin mustan tekstivärin, niin ei
teeman väriasetukset tee vaikutusta.

MP061108: Box-luokkien värit ja fontit ylimäritellään styles_admin.css:ssä.

Nimesin hiukan laatikoita uusiksi, kun adminin taustaväri ei olekaan
enää valkoinen, vaan sisältö ympyröidään box-luokalla (aiemmin box-att).
Eli aiemmin box-tr oli valkoipohjainen, mutta nyt se ei tietysti enää
ole läpinäkyvä, kun adminin tausta on harmaa.

Lisäsin adminin headissa olevalle wrapperille oman luokan. Koska
templaateissa käytetään suoraan näitä luokkia, niin on parempi, että
se on omansa -> jos tulee joskus muuteltua leiskaa, niin saa muutettua
headinb wrapperia riippumattomana templaattien laatikoista.

box-admin-wrapper > admin-css
******************************************************************/

.box-tr {
 border:1px solid #808080;
 padding:6px;
 color:black;
}

.box-info {
 border:1px solid #808080;
 background-color:white;
 padding:6px;
 color:black;
}

.box-att {
 border:1px solid #808080;
 background-color:#ffffdd;
 padding:6px;
 color:black;
 -moz-box-shadow: 2px 2px 5px  #cccccc;
 -webkit-box-shadow: 2px 2px 5px  #cccccc;
 box-shadow: 2px 2px 5px  #cccccc;
 /* For IE 8 */
 -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#aaaaaa')";
 /* For IE 5.5 - 7 */
 filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#aaaaaa');
}

.box-tr.small, .box-info.small, .box-att.small,
.box-tr.small a, .box-info.small a, .box-att.small a,
.box-tr.small a:visited, .box-info.small a:visited, .box-att.small a:visited {
 font-size:8pt; 
}

.shadow {
 -moz-box-shadow: 2px 2px 5px  #cccccc;
 -webkit-box-shadow: 2px 2px 5px  #cccccc;
 box-shadow: 2px 2px 5px  #cccccc;
 /* For IE 8 */
 -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#aaaaaa')";
 /* For IE 5.5 - 7 */
 filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#aaaaaa');
}

/*****************************************************************
MP030608: Ylläpitopalkki (emoikkunan toolbar ja yp-popupin head)
toolbar-thememenu* -> yläpalkin teemalinkkivalikko
MP231008: Samoja taustoja ja värejä käytössä myös login/logout!
******************************************************************/

div.toolbarWrapper {
 width:100%;
 position:absolute;
 z-index:10000;
 text-align:right;
 top:-45px;
 left:0px; 
}

div.toolbarWrapper.visible {
 top:0px;
 left:0px;
}

table.toolbarContainer {
 width:100%;
 height:44px;
 font-family: verdana, arial, helvetica, Sans-serif; 
 border-top: 1px solid #808080;
/*  border-top:3px solid #efefef; //#246cb4; //#1062B1; */
}

/*modal layout -> admin-head-inc */

table.toolbarContainer.modal {
 border-top:0;
 margin-top:-6px;
}

/* Sama taustakuva -> style_thickbox_admin.css */

td.toolbarData {
 height:44px;
 background:#efefef left bottom repeat-x url(/common_ui/embed_ui/img/toolbar/bg.gif);
 color:black;
}

td.toolbarData.left {
 text-align:left;
 /* padding-top: 2px; */
 /* padding-bottom: 2px; */
 padding-left: 10px;
}

td.toolbarData.right {
 text-align:right;
 padding-right: 10px;
}

div#toolbarButtonWrap {
 position:absolute;
 top:45px;
 right:20px;
}

div#toolbarButton {
 width:45px;
 height:21px;
 cursor:pointer;
 background:transparent top left no-repeat url(/common_ui/embed_ui/img/toolbar/show_hor.gif);
}

div#toolbarButton.hide {
 background-image:url(/common_ui/embed_ui/img/toolbar/hide_hor.gif);
}

td.toolbarItem {
 text-align: center;
 padding: 2px 10px;
 text-transform: uppercase;
 white-space: nowrap;
 border-top: 1px solid transparent;
 border-bottom: 1px solid transparent;
}

td.toolbarItemSmall.link { height: 35px; }

td.toolbarItemSmall {
 text-align: center;
 padding: 0 10px;
 text-transform: uppercase;
 white-space: nowrap;
}

td.toolbarItemSmall div#passwd_fields {
 white-space: normal;
}

td.toolbarItemSmall div#passwd_fields td {
 padding-right: 6px !important;
}

td.toolbarItem,
td.toolbarItem a,
td.toolbarItem a:visited,
td.toolbarItemSmall,
td.toolbarItemSmall a,
td.toolbarItemSmall a:visited {
 font-size: 10px;
}

td.toolbarItem:hover {
 background-color: #f1f1f1;
 text-decoration: none;
 border: 1px solid #bbbbbb;
}

td.toolbarItemSmall.link:hover {
 background-color: #f1f1f1;
 text-decoration: none;
 border-top: 1px solid #bbbbbb;
 border-bottom: 1px solid #bbbbbb;
}

td.toolbarItem a:hover,
td.toolbarItemSmall a:hover { text-decoration: none; }

td.toolbarItem.left,
td.toolbarItemSmall.left { border-right: 1px solid #f1f1f1; }

td.toolbarItem.mid,
td.toolbarItemSmall.mid {
 border-left: 1px solid #bbbbbb;
 border-right: 1px solid #f1f1f1;
}

td.toolbarItemSmall.right { border-left: 1px solid #bbbbbb; }

td.toolbarItem.right {
 border-left: 1px solid #bbbbbb;
 border-right: 1px solid transparent;
 width: 90px;
}

table.toolbar-dropmenu-wrapper,
div.toolbar-dropmenu-wrapper-passwd {
 position: absolute;
 left:-10px;
 border-bottom:1px solid #808080;
 background-color:#f1f1f1;
 text-align:left;
}

table.toolbar-dropmenu-wrapper {
 top: 36px;
 z-index:10;
}

div.toolbar-dropmenu-wrapper-passwd div#passwd_changed { display: none; }

div.toolbar-dropmenu-wrapper-passwd {
 z-index:5000 !important;
 top: 38px;
 width: 390px;
 border-left:1px solid #808080;
 border-right:1px solid #808080;
 border-bottom:1px solid #808080;
 padding:10px;
 background-color:#f1f1f1;
 text-transform: none;
 font-family: verdana, arial, helvetica, sans-serif;
 font-size: 12px;
 color: black;
 white-space:normal;
 position: absolute;
}

div.toolbar-dropmenu-wrapper-passwd.fbinfo {
 display:none;
 z-index:5000;
 padding:0;
 width:450px;
}

div.toolbar-dropmenu-wrapper-passwd.fbinfo .fbinfo-title {
 background: #F1F1F1;
 text-transform: uppercase;
 font-size: 10px;
 color:#333333; 
 padding: 10px 10px 0 10px;
}

div.toolbar-dropmenu-wrapper-passwd.fbinfo .fbinfo-content {
 padding: 10px;
}

div.toolbar-dropmenu-wrapper-passwd.fbinfo .fbinfo-content table {
 margin-bottom: 10px;
}

div.toolbar-dropmenu-wrapper-passwd.fbinfo .fbinfo-content table td.fbuser-info {
 line-height: 17px;
 padding-left: 10px;
 color: #333333;
}

div.toolbar-dropmenu-wrapper-passwd.fbinfo .fbinfo-content table td.fbuser-info a.fbdata-name {
 color: #3B5998; 
 text-decoration: none;
 font-size:14px;
 font-weight: bold;
}

div.toolbar-dropmenu-wrapper-passwd .passwdTitleWrap { margin-bottom:10px; }

div.toolbar-dropmenu-wrapper-passwd .passwdTitle {
 float:left;
 width:150px;
 font-size: 10px;
}

td.toolbar-dropmenu-data {
 min-width: 140px;
 border:1px solid #808080;
 padding:5px;
 background-color:#f1f1f1;
 text-transform: none;
}

td.toolbar-dropmenu-data:hover { background-color:#e4e4e4; }

table#usermenu td.toolbar-dropmenu-data {
 min-width: 195px;
}

/* Yläpalkin lomakepainikkeet (salasanan vaihto) */

.button_admin {
 padding-top: 1px;
 padding-bottom: 1px;
 background:#f1f1f1; 
 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f1f1f1', endColorstr='#cccccc');
 background: -webkit-gradient(linear, center center, center bottom, from(#f1f1f1), color-stop(50%,f1f1f1), to(#cccccc));
 background: -moz-linear-gradient(90deg, #cccccc, #f1f1f1 55%, #f1f1f1);
 border:1px solid #808080; 
 -moz-border-radius: 3px;
 border-radius: 3px;
 cursor:pointer;
 color:black;
 font-family: verdana, arial, helvetica, sans-serif;
 font-size: 11px;
}

.button_admin:hover {
 background:#70a1d0; 
 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e7f3ff', endColorstr='#b7dcff');
 background: -webkit-gradient(linear, center center, center bottom, from(#e7f3ff), color-stop(50%,e7f3ff), to(#b7dcff));
 background: -moz-linear-gradient(90deg, #b7dcff, #e7f3ff 55%, #e7f3ff);
 border:1px solid #4f8ac3; 
 text-decoration:none;
 color:#0257a4; 
}


/* Develin debug-infolaatikko, toolbar.inc */

div#debugInfo {
 display:none;
 position:absolute;
 top:50px;
 left:15px;
 margin:0;
 width:220px;
 padding:10px;
 z-index:1000;
 line-height:140%;
}

/* Ohjeartikkeli-laatikko, toolbar.inc */

div#helpTexts {
 text-align: left;
 display: none;
 position: absolute;
 top: 50px;
 right: 10px;
 margin: 0;
 width: 450px;
 padding: 0;
 z-index: 99999;
 line-height: 140%;
 border-top: 3px solid #059;
 background: #eaeaea left bottom repeat-x url(/common_ui/embed_ui/img/toolbar/bg.gif);
}

div#quickHelp {
 text-align: left;
 display: block;
 position: absolute;
 top: 150px;
 left: 50%;
 margin-left: -225px;
 width: 450px;
 z-index: 1000;
 line-height: 140%;
 border-top: 3px solid #059;
 border-left: 1px solid #808080;
 border-right: 1px solid #808080;
 background: #eaeaea left bottom repeat-x url(/common_ui/embed_ui/img/toolbar/bg.gif);
}

div#quickHelp a,
div#quickHelp a:visited,
div#quickHelp p {
  font-family: verdana,arial,helvetica,Sans-serif;
  font-size: 9pt;
}

div.helptext_group {
 border-bottom: 1px solid #cccccc !important;
 background-color: #f1f1f1;
 padding: 0;
}

div.helptext_group_title {
 background-color: #e4e4e4;
 padding: 10px;
}

div.helptext_group a.groupLink {
 font-size: 80%;
 text-decoration: none !important;
}

div.helptext_group div.groupCont { display: none; }

div.helptext_group div.articleLink { 
 margin: 0 !important;
 padding: 7px 10px 7px 25px; 
 border-top: 1px dashed #cccccc;
}

div.helptext_group div.articleLink a { text-decoration: none !important; }

div.helptext_group div.articleLink a,
div.helptext_group div.articleLink a:visited {
 color: #059 !important;
}

div.helptext_group div.articleLink a:hover { text-decoration: underline !important; }

div.helptext_group div.articleCont {
 display: none;
 margin: 0 10px 0 25px;
}

div#quickhelp_content div.helptext_group div.articleCont { margin: 0 10px 0 10px; }

div#quickhelp_content div.helptext_group div.articleLink { padding: 7px 10px 7px 10px; }


/*************** Passiiviset/julkaisemattomat tietueet (esim. kpalsta + sivulista) *******************/

/* MP270907: IE7 vaatii läpinäkyvälle elementille height tai width -määrityksen
-> selvitän myöhemmin */

.passive-data,.passiivinen {
 filter:alpha(opacity=50);
 -moz-opacity:.50;
 opacity:.50;
}


/*****************************************************************
MP130608: Teeman esikatselusivun maskaus 
******************************************************************/

div#theme-preview-mask {
 width:100%;
 height:100%;
 position:absolute;
 top:0;
 left:0;
 z-index:50;
 background-color:white;
 filter:alpha(opacity=0);
 -moz-opacity:.0;
 opacity:.0;
}


/*****************************************************************
MP130608: Teemaeditorin (iframen) asemointi esikatselusivulla.
Itse teemaeditorin luokat -> style_admin.css -> te* -luokat.
******************************************************************/

div.themebarWrapper {
 width:651px;
 position:absolute;
 top:55px;
 left:-630px;
 height:88%;
 z-index:5000;
}

div.themebarWrapper.visible { left:0px; }


/*rt#190*/

.jqToggle { cursor:pointer; }


iframe.themebarContainer {
 border:0;
 height:100%;
 width:628px;
 border:0 solid #808080;
 border-width:0 2px 2px 0;
 overflow:auto;
 float:left;
 background-color: #ffffff;
}

td#themebarButtonWrap {
 vertical-align:top;
 width:21px;
 padding-top:12px;
}

div#themebarButton {
 width:21px;
 height:45px;
 cursor:pointer;
 background:transparent top left no-repeat url(/common_ui/embed_ui/img/toolbar/show_ver.gif);
}

div#themebarButton.hide { background-image:url(/common_ui/embed_ui/img/toolbar/hide_ver.gif); }

body.body-teeman-muokkaus .jPicker.Container {
 position: fixed !important;
 top: 10px !important;
 left: 35px !important;
}

/*****************************************************************
TO291010: Tooltipin muotoilut.
******************************************************************/
.toolTip {
    cursor: help; 
    position: relative;
}
 
.toolTipWrapper {
    width: auto;
    min-width: 250px;
    position: absolute;
    top: 10px;
    display: none;
    color: #FFF;
    font-weight: normal;
    border: 1px solid #888888;
    -moz-box-shadow: 0 0 10px #000;
    -webkit-box-shadow: 0 0 10px #000;
    z-index: 9999;

}

.toolTipContent {
    font-size: 12px; 
    margin: 2px;
    padding: 5px 10px;
    background-color: #000000;
    border: 1px solid #000000;
    color: white;
    opacity: .8;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter: alpha(opacity=80);
    text-align: left;
}



/*****************************************************************
TO091110: jQueryn Tools-tooltipin muotoilut.
******************************************************************/
.jqTip:hover,
.jqTipLayout:hover {
    cursor: help;
}

.jqTipLayout {
    background-color: #ffffff;
    padding: 10px;
    width: auto;
    display: none;
    border: 1px solid #888888;
    -moz-box-shadow: 0 0 5px #888;
    -webkit-box-shadow: 0 0 5px #888;
    background-color: white;
    color: black;
    opacity: .9;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    filter: alpha(opacity=90);
    z-index: 99999;
}


/*****************************************************************
TO28082015: Tooltipsterin oletusmuotoilu
******************************************************************/

.tooltipster-netland-theme {
border-radius: 5px; 
border: 1px solid #aaaaaa;
box-shadow: 2px 2px 2px 0 #cccccc;
background: #ffffff;
color: #000000;
margin: 10px;
}
/* Use this next selector to style things like font-size and line-height: */
.tooltipster-netland-theme .tooltipster-content {
font-family: Arial, sans-serif;
font-size: 13px;
line-height: 1.2em;
padding: 15px;
}

/*****************************************************************
TO030212: koko sivun kokoinen modaali
******************************************************************/
#pagemask-white {
 display: none;
 position: fixed;
 left: 0px;
 top: 45px;
 width: 100%;
 height: 100%;
 z-index: 9000;
 background-color: #ffffff;
 opacity:0.7;
 filter:alpha(opacity=70);
}

#pagemask-black {
 display: none;
 position: fixed;
 left: 0px;
 top: 45px;
 width: 100%;
 height: 100%;
 z-index: 12000;
 background-color: #000000;
 opacity:0.7;
 filter:alpha(opacity=70);
}


/*****************************************************************
TO27092012: autocomplete-muotoilut
******************************************************************/
.autocomplete_input {
 outline: none;
}

.autocomplete-results ul.ui-menu {
 border: 1px solid #c8c8c8;
 width: auto !important;
 text-align: left;
 z-index: 100 !important;
}

.autocomplete-results ul.ui-menu,
.autocomplete-results ul.ui-menu li.ui-menu-item {
 background: #ffffff;
 font-size: 100%;
}

.autocomplete-results ul.ui-menu li.ui-menu-item a {
 border: 1px solid transparent;
}

.autocomplete-results ul.ui-menu li.ui-menu-item a:hover {
 border: 1px solid transparent;
}

.autocomplete-results ul.ui-menu .ui-menu-item:hover {
 background: #aaaaaa;
 cursor: pointer;
}

.autocomplete-results ul.ui-menu .ui-menu-item a {
 color: #666666;
}

.autocomplete-results ul.ui-menu .ui-menu-item a b {
 color: #222222;
}

.autocomplete-results ul.ui-menu .ui-menu-item a.ui-state-hover,
.autocomplete-results ul.ui-menu .ui-menu-item a.ui-state-active {
 font-weight: normal;
 margin: 0;
 color: #000000;
}

.ui-autocomplete-loading {
  background-image: url('/common_ui/embed_ui/img/loader/indicator.gif');
  background-position: right;
  background-repeat: no-repeat;
}

.autocomplete-results .ac-no-results {
 display: none;
 color: black;
 border: 1px solid #C8C8C8 !important;
 background-color: white;
 -moz-border-radius: 5px;
 -webkit-border-radius: 5px;
 -khtml-border-radius: 5px;
 border-radius: 5px;
 line-height: 1.5;
 padding: 5px;
}

.ac-search-help,
.autocomplete-no-results {
 display: none;
 margin-right: 4px;
 left: 0;
 float: right;
 text-align: left;
 padding: 2px 5px;
 color: black;
 border: 1px solid #C8C8C8;
 width: 200px;
 background-color: white;
 line-height: 1.5;
 position: absolute;
 z-index: 100000;
 -moz-border-radius: 5px;
 -webkit-border-radius: 5px;
 -khtml-border-radius: 5px;
 border-radius: 5px;
}

.ac-search-help p {
 margin-top: 0;
}

.ui-datepicker-trigger {
 margin-top: 7px;
}


/*****************************************************************
HW131113: lomakkeiden tyhjennä-rasti
******************************************************************/
img.clearvalue {
 cursor: pointer;
 position: absolute;
 top: 3px;
 right: 5px;
 display: block;
}

/*****************************************************************
TO20150513: Jos Flexsliderissa vain yksi kuva, niin näytetään se.
******************************************************************/
div.flexslider ul.slides.onlyone li { display: block; }


div#search-wrap input { outline: none; }