body{
    background-color: #edf1f7;
    font-family: kanit;
}
h1, h2, h3, h4, h5{
    color: #2e3a59;
    font-weight: bold;
}
.header{
    height: 130px;
}

/*Override bootstrap*/
.btn-primary{
    background-color: #00a0df;
    border-color: #00a0df;
}
.btn-secondary{
    background-color: #f7f9fc;
    border-color: #f7f9fc;
    color: #2e3a59;
}
.card {
    border-radius: 0.85rem;
}
.card-header:first-child{
    border-radius: 0.85rem 0.85rem 0 0;
}
/*Generici*/
.vertical-item{
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.spaced-title{
    padding-top: 50px;
    padding-bottom: 50px;
}
.spaced-title .subtitle{
    color: #8f9bb3;
    margin-top: 10px;
}
.sei-question{
    max-width: 30px;
    margin-right: 13%;
}
.bottone-indietro{
    text-align: center;
    min-width: 200px;
    margin: 0 20px 0 0;
    font-weight: bold;
    text-transform: uppercase;
    display: inline-block;
}
/*Pagina copertina*/
.box-img-copertina{
    background: rgb(254,218,218);
    background: linear-gradient(135deg, rgb(133, 210, 234) 0%, rgb(24, 58, 68) 100%);
    padding: 30px;
    display: inline-block;
}
.box-testi-copertina{
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.editore{
    color: #00a0df;
    font-weight: bold;
}
.autori{
    color: #8f9bb3;
    font-weight: bold;
    font-size: 23px;
}
.bottone-copertina{
    text-align: center;
    min-width: 300px;
    margin: 25px 0 0 0;
    font-weight: bold;
    font-size: 13px;
    text-transform: uppercase;
}
/*PAGINE CONTENUTI E MATERIALI (e misti secondo livello)*/
.lista-primo-livello .copertina-in-lista{
    width: 70%;
    max-width: 134px;
    transform: rotate(-5deg);
    position: absolute;
    top: -15px;
    left: 51px;
    box-shadow:0 .5rem 1rem rgba(0,0,0,.15) !important;
}
.lista-primo-livello .card{
    min-height: 200px;
    margin-bottom: 30px;
}
.lista-primo-livello .card-body{
    height: 160px;
    min-height: 160px;
}
.lista-secondo-livello .card-title,
.lista-primo-livello .card-title{
    font-weight: bold;
    font-size: 1.2rem;
    color: #2e3a59;
}
.lista-primo-livello .card-header{
    min-height: 40px;
}
.lista-primo-livello .testo-unita{
    color: #8f9bb3;
    font-weight: bold;
    font-size: 18px;
}
.lista-primo-livello .bottone-apri{
    font-weight: bold;
    font-size: 13px;
    text-transform: uppercase;
    padding-right:25px;
    padding-left:25px;
}
/*PAGINA TILES*/
.lista-secondo-livello .tile-icon{
    width: 30px;
}

/* transition */
.slide-fade-enter-active {
    transition: all .3s ease;
}
.slide-fade-leave-active {
    transition: all .3s cubic-bezier(1.0, 0.5, 0.8, 1.0);
}
.slide-fade-enter, .slide-fade-leave-to
    /* .slide-fade-leave-active below version 2.1.8 */ {
    transform: translateX(10px);
    opacity: 0;
}

/*PERSONALIZZAZIONE 2022*/


.copertina-ddi-docente{
  width:100%;
text-align: center;
}

.copertina-ddi-docente img{
  width:241px;
margin-top: 36px;
}

.icon-ddi{width: 27px;margin-left:10px}
.icon-ddi-share{width: 30px;}
.logo{width:230px;margin-top:7px}
.card {flex-direction: ;}
.lista-secondo-livello .card-title,
.lista-primo-livello .card-title{
    font-weight: bold;
    font-size: 1rem;
    color: #2e3a59;
}
.header{
    height: 75px;
}
.sfondo-cover{
background: linear-gradient(135deg, rgb(237, 246, 250) 0%, rgb(186, 218, 234) 100%);
display: flex;
top: 47px;
margin-bottom: -157px;
}
h1{font-size:1.6em;color:#2E3A59}
h2{font-size:1.6em;color:#2E3A59}
.spaced-title .subtitle{font-size:1.6em;color:#2E3A59}
p{font-size: 0.9em;color:#2E3A59}
.autori{font-size: 17px;}
.box-img-copertina{
  background:none;
transform: rotate(3deg);
width:80%;
position: absolute;
top: -29px;
left:54px;
box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
padding:0;
}
.breadcrumb-demo{
background-color:none;
color:#8F9BB3;
text-decoration:none;
}
a:hover.breadcrumb-demo{
text-decoration:none;
}
.card-title{text-align:left;padding-top: 0.7em;}
h5.card-title{text-align:center;}
.lista-primo-livello .card-header{min-height:29px}
.lista-primo-livello .card {min-height: 131px;height: 131px;}
.lista-primo-livello .testo-unita{display:none}
a:hover.ddi-link{text-decoration: none;}
.vertical-item-ddi{
    position: relative;
    top: 31%;
    transform: translateY(-50%);
}
img.tile-icon {fill: green;}
.card-title-ddi{font-weight: bold;
font-size: 1rem;
color: #fff!important;
padding-top: 2em;
text-align:left;}

/* DIMENSIONE LOGO DDI */
.dimensione-ddi {height: 20px}

/* RESPONSIVE */
.home-demo-mb{}

  .bottone-copertina {
  min-width:240px
}

@media screen and (max-width: 995px) {
  #copertina-dsk{display:none;}
  #copertina-mob{display:block;}


  .sfondo-cover{
  display: none;
  }

  .sfondo-cover-mb{
  background: linear-gradient(135deg, rgb(237, 246, 250) 0%, rgb(186, 218, 234) 100%);
  height: 167px;
      margin-top: 25px;
  }

  h2,.autori{text-align: center;}
  h2,.editore{text-align: center;}


    .box-img-copertina {
        width: 163%;
        position: relative;
        top: 26px;
        left: 0px;
        margin-bottom: 35px;
    }



    .sfondo-cover-mb {
    background: linear-gradient(135deg, rgb(237, 246, 250) 0%, rgb(186, 218, 234) 100%);
    height: 183px;
    margin-top: 78px;
    position: absolute;
    top: 133px;
    left: 0px;
    width: 100%;
    display:none;
}

#copertina-mob.col-6 {max-width:60%;margin-left: 7%;}

.bottoni{text-align:center}


.copertina-ddi-docente{
text-align: center;
position: initial;

}

.copertina-ddi-docente img{
  margin-top:30px;
  width: 280px;
}

.bottone-indietro{min-width: auto;margin:0 25px 0 -10px}
.col-sm-8{width:66%}

}

@media screen and (min-width: 994px) {
  #copertina-dsk{display:block;}
  #copertina-mob{display:none;}

}

/* POSIZIONE SFOGLIA VOLUME */
.posizione-sfoglia-il-volume{top: 18%!important;left: -20%;}

.posizione-sfoglia-il-volume2 {
top: 23%!important;
left: -20%;
font-size: 14px!important;
}

/* Tooltip condivisione */
.tooltip {
    position: relative;
    display: contents;
}

.tooltip .tooltiptext {

  max-width: 226px;
padding: 12px;
min-height: 30px;
background: #000c;
visibility: hidden;
border: 1px solid black;
color: #fff;
text-align: center;
border-radius: 10px;
position: absolute;
z-index: 1;
top: -15px;
left: -209px;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}