/* CSS per il client mki.js */

/*
questi 2 stili servono per bloccare lo scrolling della pagina: infatti appena
caricata la mia pagina è vuota, e il browser cercherebbe automaticamente di
scrollare alla posizione precedente della pagina, ma quella posizione, finchè la
pagina non viene popolata, non è raggiungibile. allora inibisco lo scroll, in
modo che la pagina resti al top, e lo riabilito solo dopo che i contenuti sono
stati renderizzati.
*/
/*
questo lo commento perche altrimenti ho un problema nei post
per cui ogni volta che apro un'immagine perdo lo scrollbar
*/
/*
html, body {
  overflow: hidden;
  height: 100%;
}
*/
/*
al caricamento il contenuto delle pagine è oscurato,
e comparirà solo runtime dopo il processo di inizio rendering
*/
#cookie-law-info-bar,
.td-main-content-wrap,
.td-footer-wrapper,
.td-sub-footer-container {
  display: none;
}


.mkiWidget {
  display: none; /* al boot il widget non è visibile, lo diventa solo dopo aver letto (e tolto) i tpl dalla pagina. */
  /*height: 250px;*/ /* al boot il widget ha un'altezza di default (per far vedere il waiter, altrimenti avrebbe altezza 0 finchè non viene popolato), poi acquisisce l'altezza del suo contenuto quanto questo è stato renderizzato. */
  position: relative;
}

/*
ora come ora non lo uso: funziona, è attivo, ma non ha elementi visibili
*/
.mkiWidgetWaiter {
  /* le dimensioni vengono impsotate runtime
  width:100%;
  height:100%;
  */
  /*
  background-color:rgba(255,255,255,0.3);
  */
  background-color:rgba(0,0,0,0.2);
  height: 46px;
  /* MEGLIO SENZA?
  border-radius: 25px;
  */

  background-image:url('/wp-content/mu-plugins/mki-client/images/icons/waiter_white.svg');
  background-position: 4px 4px;
  background-repeat: no-repeat;
  background-size: 38px 38px;
  display: block;
  /*
  position: absolute;
  top: 0px;
  left: 0px;
  */
  margin-bottom: 30px;
  z-index:50000;
  opacity: 0;
  pointer-events: none;
}
.mkiFullpageWaiter {
  width:40px;
  height:40px;
  background-image:url('/wp-content/mu-plugins/mki-client/images/icons/waiter_white.svg');
  background-color: #f96850;
  /*
  background-position: 5px 5px;
  */
  background-position: center;
  background-repeat: no-repeat;
  background-size: 34px 34px;
  position: fixed;
  bottom: 4px;
  right: 5px;
  z-index:100000;
  opacity: 0;
  /*
  pointer-events: none;
  */
}
#mkiToastContainer {
  position: fixed;
  bottom: 0px;
  right: 45px;
  z-index:500000;
  /*
  background-color: white;
  */
}
@media (max-width: 767px) {
  #mkiToastContainer {
    right: 0px;
  }
}
.mkiToast {
  opacity: 0; /* viene visualizzato runtime */
  height: 0px; /* viene visualizzato runtime */
  overflow: hidden;
  margin: 4px;
  padding: 2px 24px 2px 6px;
  background-color: #f96850;

  background-image:url('/wp-content/mu-plugins/mki-client/images/icons/arrow-r_white.svg');
  /*
  background-position: 5px 5px;
  */
  background-position: right 4px center;
  background-repeat: no-repeat;
  background-size: 13px 13px;

  color: white;
  text-align: right;

}
.mkiToast:hover {
  color: #f96850;
  background-color: #efefef;
  background-image: url('/wp-content/mu-plugins/mki-client/images/icons/arrow-r_orange.svg');
  cursor: pointer;
}
.mkiToastAge {
  font-weight: bold;
}













/*
forzo il main color al tema.
questa roba viene già fatta in qualche altro css, ma questo css viene caricato
DOPO che la pagina è già stata visualizzata, quindi per un istante si vede la
pagina con il main color di default del tema (azzurro) invece che l'arancione.
*/


/*
.block-title > span,
.block-title > a,
.block-title > label,
.widgettitle,
.widgettitle:after,
.td-trending-now-title,
.td-trending-now-wrapper:hover .td-trending-now-title,
.wpb_tabs li.ui-tabs-active a,
.wpb_tabs li:hover a,
.woocommerce .product .products h2:not(.woocommerce-loop-product__title),
.td-subcat-filter .td-subcat-dropdown:hover .td-subcat-more {
  background-color: #f96850 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  background-color: #f96850 !important;
}
.block-title,
.wpb_tabs .wpb_tabs_nav,
.woocommerce div.product .woocommerce-tabs ul.tabs:before {
  border-color: #f96850 !important;
}
.td_block_wrap .td-subcat-item .td-cur-simple-item {
  color: #f96850 !important;
}
*/














/* css specifici per i template */


/*
listone
*/
.mkiButtonListoneCaricaAltri_Initialized {
  visibility: visible !important;
}
.mkiButtonListoneCaricaAltri_Busy {
  /*
  opacity: 0.5;
  background-position: 5px 5px;
  */
  pointer-events: none;
  color: transparent !important;
  background-color: transparent;
  background-image:url('/wp-content/mu-plugins/mki-client/images/icons/waiter_grey.svg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 20px 20px;
}


/*
widget_spalla_3
*/
div.mkiWidget img.mkiPost_image_td_696x385_attrSrc_0 {
  margin-bottom: 0px;
}

/*
Icona per coontenuti premium.
Devono comparire accanto ai post premium ovvero
Lettera all’Investitore  2
Company Insight  2116
Editoriali  819
Analisi Tecnica  1443
Analisi e Approfondimenti  1206
Risultati Societari  1444
*/
div.premium_icon {
    background-color: transparent;
    background-image: url(/wp-content/mu-plugins/mki-client/images/vip.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    display: none;
    position: absolute;
    width: 20px;
    height: 20px;
    margin-top: -3px;
    margin-left: 8px;
}

div.premium_icon[mki_categories~="2"],
div.premium_icon[mki_categories~="2116"],
div.premium_icon[mki_categories~="819"],
div.premium_icon[mki_categories~="1443"],
div.premium_icon[mki_categories~="1206"],
div.premium_icon[mki_categories~="1444"] {
	display: inline-grid;
}




/*
popup
*/
#mkipopup {
	border-style: dashed;
	border-width: 12px;
	border-color: #f96850;
	text-align: center;
	display:none;
	width:80%;
  margin-top:35px;
	/*max-width:700px;
	min-width:300px;
	min-height:300px;*/
	background-color:#ffffff;
}
#mkipopupInner {
	padding:30px;
	padding-bottom:50px;
	width:100%;
	height:100%;
	background-color: #ffffff;
}
#mkipopupInner h2, #mkipopupInner h3, #mkipopupInner h4{
	color: #0c5561;
}
.button.b-close, .button.bClose {
    border-radius: 25px;
    border:4px solid #fff;
    box-shadow: none;
    font: bold 120% sans-serif;
    padding: 8px 12px;
    position: absolute;
    right: -35px;
    top: -35px;
}
.button {
    background-color: #053942;
    border-radius: 10px;
    box-shadow: 0 2px 3px rgba(0,0,0,0.3);
    color: #fff;
    cursor: pointer;
    display: inline-block;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
}
#mkipopupInner button {
	margin:4px;
}
#gotopromo, #promoremember1 {
	background-color: #f96850;
    color: #fff;
    cursor: pointer;
    border:0px;
    padding: 6px 20px;
    border: 2px solid #f96850;
}
#promoremember1 {
	background-color: #fff;
    color: #053942;
    border: 2px solid #053942;
}
#promoremember90 {
	background-color: transparent;
    border:0px;
    display: block;
    float: right;
    position: absolute;
    right: 15px;
    bottom:10px;
    color: 053942;
    padding: 3px;
    font-size: small;
}
#gotopromo:hover {
	background-color: #053942;
    color: #fff;
    cursor: pointer;
    padding: 6px 20px;
}
#promoremember1:hover {
	background-color: #eaeaea;
    color: #053942;
    cursor: pointer;
    padding: 6px 20px;
}
#promoremember90:hover {
    color: #053942;
}


@media (max-width: 767px) {
	#mkipopup { width:auto; left:0px!important;margin-right: 2px;margin-top:10px;}
	#mkipopupInner {padding:10px; }
  .button.b-close, .button.bClose {
      right: 0px;
      top: 0px;
  }
}