/*...........................................

Media Queries   320 to 568 / smartphones landscape and portrait

...........................................*/

/*  general */

html {
  /*font-size:90%*/
}

body {
    /*overflow-y:hidden;*/
}

article * {
    text-align:left;
}

/*  menu left and right */

.menu.open nav {
    width:300px;
    padding:20px 10px 20px 10px;
}

.menu {
    width: 30px;
    left: -31px;
    overflow: visible;
}

.menu .icons LI:first-child:before, .user .icons LI:first-child:before {
  font-family: 'iebicon';
  font-style: normal;
  speak: none;
  content: "\e0d3";
  display:block;
  width:25px;
  height:36px;
  padding-top:8px;
  position:fixed;
  top:0px;
  z-index:50000;
  /*background-color:#ccc;*/
  color:#444;
  text-align:center;
  /*border-top-right-radius: 0px;
  border-bottom-right-radius: 10px;*/
}

.menu.open .icons LI:first-child:before {
    display:none;
}

.user .icons LI:first-child:before {
  right:0px;
}

.menu .icons LI:first-child:before {
  left: 0px;
}

.menu.open {
    left: 0px;
    z-index:2300;
    box-shadow: none;
}


.user .icons {
    right: -31px;
    overflow: visible;
}

.user.open .icons LI:first-child:before {
    display:none;
}

.user.open {
    left:0px;
    z-index:2300
}

.user.open .icons {
    right: 0px;
}

.user #usercontents {
    width: 100%;
}

.publi_logo {
  background-image:none !important;
}

/*  main page , article and page header */

.main-container {
    width: 90%;
    padding: 0px 20px 40px 20px;
}

.main-container.withleftcolumn {
    padding-left:20px;
}
.main-container.withleftcolumn .leftcolumn {
    display:none;
}

.main-container header {
  padding-top: 30px;
}


article > header, article > section, article > footer {
    width:100%;
    float:none;
}

article .rightcolumn, header .rightcolumn {
    clear:both;
    width:100%;
    float:none;
}

header .rightcolumn {
    /* display:none; */
}
H1.title_document {width:100%;}
H1.title_document .title {width:100%;}

.home section section {
    margin-top:-30px !important;
    margin-left:-10px !important;
    margin-bottom:20px !important;
    width:285px !important;
}

.home section.maincover {
    height:auto;
    min-height:0px;
    overflow:hidden;
}

.homeitem {
    margin:0px 0px 10px 0px;
}

/*  toc  */

#toc-content {
    z-index:1300;
}
.toc-container {
    right:0px;
    box-shadow: 0px 0px 0px;
    width:100%;
    overflow:hidden;
}

.toc-container.open {
  overflow-x: auto;
  overflow-y: auto;
}

#toc .chapter figure.chaptercover {
    float:none;
    margin-bottom: 10px;
}

#toc H2 {
    min-height: 50px;
}

#toc H2 .number {
    font-size: 3rem;
    line-height: 3rem;
}

/* footer and topheader */

#sibilings  {
  max-width:100%;
}

#sibilings th {
  display:block;
  min-width: 30px;
  float:left;  
}

footer .pathsection {
    margin-left: 0px;
}

footer .pathsection .iebicon {
    float:none
}

footer .pathsection .sdrm {
    margin-left: 0px;
}

footer .titlesrow {
  display:none
}

H1.title_subchapter .number:empty {
  margin-top:-50px;
}

h1.title_subchapter {
   margin-top:1em;
}

.u_footer .rightcolumn > div {
    width:100%; 
}   

.cat_footer .rightcolumn > div {
    width:100%;
}

.tophead {
    width:100%;
    position: absolute;
    margin-bottom:0px;
    height:45px;
    left:0px;
    top: -25px;
    margin-top: 0px;
    padding-right:30px;
    text-align:center;
    background-color:#FFF;
}

.tophead .pagesmenu {
  /* margin:0 auto; */
  text-align: center;
  display: inline-block;
}

.tophead .pagesmenu A.sibiling {
    clear:both;
    display:none;
}

.tophead .pagesmenu A {
    padding:5px;
}

.tophead .pagesmenu .pub {
  border-left:0px !important;
  padding:10px 10px 0px 0px;
  height:45px;
}

.tophead .pagesmenu A.chapter {
  border-right: 0px solid red !important;
  display: block;
}

.tophead .pagesmenu A.bookmarksign {
  font-size:28px;
  margin-top:4px;
}

.status_offline #reader .menu:after {
  left: 35px;
  top: 30px;
}

#toc .u_intro .update {
  /*margin-top: -280px !important;*/
}

.menu .icons > LI {
  margin-right:0px;
}


/* QUESTION */

.questionnaire .question .rightcolumn {
  width: 100%;
}

.question .rightcolumn ~ .description, .question .rightcolumn ~ .answers {
  width: 100%;
}

.qsubmit button, .qreset button, input[type=submit] {
  width: 100%;
}


/* MESSAGES */

.modalMessage .modalMessagecontent {
  top: 20px !important;
  left: 20px !important;
  right: 20px !important;
  bottom: 20px !important;
  
  margin: 0 !important;
  width: auto !important;
  max-width: 1024px !important;
  min-height: 0 !important;
  height: auto !important;
}

.modalMessage .modalMessagecontent:before {
  display: none;
}

.modalMessage .modalMessagecontent.north, .modalMessage .modalMessagecontent.south {
  margin-left: -150px;
}

.modalMessage.alert, .modalMessage.confirm{
  background-color: rgba(0,0,0,0.75); 
}

/* SHELF */

#catalog.expand {
  padding-top: 249px
}

.shelf header {
  min-height:90px;
  padding:5px 10px;
  overflow:hidden;
  width: 100%;
  padding-bottom:0px;
}

.shelf header img {
  width: 240px;
}

.status_offline .shelf header:after {
  right:10px;
}


.shelf #usercontrol {
  margin:15px 0px 0px 0px;
}

.shelf #ieb_owner {
  line-height:1.2rem;
  font-size: 1rem;
}

#catalog {
  padding-top: 94px;
}

.shelf .bookshelf.reading, .shelf .bookshelf.available, .shelf section#varia {
  padding: 0px;
}

.shelf .label {
  width: 100%;
  padding: 5px 0px 5px 10px;
  margin: 0px;
}

.shelf .filter-box {
  width: 100%;
  margin: 0px 0 10px 0px;
}

.shelf .bookshelf LI {
  float: left;
  clear: both;
  margin:0px 0px 20px 10px;
  height: auto;
}

.shelf .bookshelf .menucover {
  margin: 0px 10px 0px 0px;
  float:left;
}

.shelf .bookshelf LI .info {
  padding: 5px 0 0 0;
  display:table-cell;
}

.shelf section#varia > div > * {
  margin: 0px 0px 40px 10px;
}

.shelf section#varia A, .shelf section#varia .utilita A {
  margin-right: 0px;
  margin-bottom: 20px;
}

.shelf footer {
  height: 30px;
  line-height: 28px;
  background-color: #FF0000;
}

.shelf footer .logos img:nth-child(2), .shelf footer .logos .iconieb-footer {display:none !important;}

footer .logos img {
  height:30px !important;
  margin:-5px 0px 0px 0px !important
}

footer .logos {
  display:block;
}

#login {
  padding-top: 20px;
  padding-left: 10px;
  background-color: #bdca77;
}

#login .signin {
  width: 100%;
  max-width: 300px;
  margin-top:0px !important;
}

@media only screen and (min-width: 568px) {
  .shelf section#myshelf LI {
    width:270px;
  }
  .shelf .maino.open {
    padding-top: 178px;
  }
}

/* disabilitazioni */

.user .icons LI A.draw, .user .icons LI A.classroom, .user .icons LI A.copybook {
  display:none
}
.pagecontributes {
 display:none
}


/* notes */

section .collapsed_note {
  left: -26px;
}

.popcontainer {
  width:320px;
}

.notecontainer {
  
  margin:0px;
  padding:0px;
}

.notecontainer .note {
  width:280px;
}

.dragHandler.note-drag {
  
}

.notecontainer .commands tr td:nth-child(4) {
  display:none !important;
}

/* zantip */

.modal.zantip {
  top: -20px;
}

.modal.zantip .modalcontent {
  width: 100%;
  height:100%;
}

.modal.zantip header {
  width: 280px;
  padding-top:50px;
}

/* glossary */

.minimodal.glossary {
  left:0px !important;
  width: 100%;
}

/* news */

#news > div {
  padding-left:0px !important;
}

#news > div .news {
  padding-left:10px !important;
  padding-right:0px !important;
  /*border-bottom:1px solid #dedede;*/
  margin-bottom:10px;
}

#news > div .news:last-child {
 border-bottom:0px solid #dedede;
}

.formula {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  display: inline-block;
  vertical-align: middle;
}

.spreadsheet {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

table.dittico, table.trittico {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  display:block;
  white-space: nowrap;
}

table.dittico td {
  width:240px;
  display:inline-table;
  white-space: normal;
  vertical-align:top;
  height:100%;
}

table.trittico td {
  width:160px;
  display:inline-table;
  white-space: normal;
  vertical-align:top;
  height:100%;  
}

.mediabox.spreadsheet.zoomed .zoomlevel {
    border-bottom: solid 30px transparent;
}

article.cat section.body {
  width: 100%;
}

.mediabox.placeholded img {
  max-width: 100% !important;
}

.zoomed .caption {
	max-height: 20%;
  overflow-y: auto;
}