/*********************
* Responsive
**********************/
/* responsive menu */
.mobile-menu {
  display: none;
  z-index: 100;
  position: absolute;
  top: 100px;
  left: 0;
  width: 50px;
}
.mobile-menu.opened {
  width: 75%;
  /*height: 100%;*/
  height: calc(100% - 10px);
  overflow-x: auto;
  background:white;
}
  .mobile-menu button {
    display: block;
    margin: 12px 0 0 16px;
    padding: 0;
    outline: none;
    z-index: 2;
    background: none;
    color: #999;
    font-size: 21px;
    border: none;
  }
  @media (max-width: 767px) {
    .mobile-menu button {
      margin: 24px 0 0 16px;
    }
  }
  .mobile-menu.opened button {}
  .mobile-menu nav > ul.menu {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    top: 39px;
    left: 0;
    width: 100%;
    height: auto;
    background: white;
    z-index: 1;
    border-right: 1px solid black;
    border-top: 1px solid black;
  }
  .fa-navicon:before,
  .fa-reorder:before,
  .fa-bars:before {
    color:#000;
  }
  .mobile-menu.opened nav > ul.menu {
    visibility: visible;
    opacity: 1;
  }
    .mobile-menu ul.menu li {
      border-top: 1px solid black;
    }
    .mobile-menu ul.menu li:first-child {
      border-top: none;
    }
      .mobile-menu ul.menu li ul {
        display: none;
        padding-left: 2em;
      }
      .mobile-menu ul.menu li.active-trail ul {
        display: block;
      }
        .mobile-menu ul.menu li.active-trail ul li {

        }
        .mobile-menu ul.menu li a {
          display: block;
          font-size: 1.3em;
          text-align: left;
          padding: .6em;
          line-height: 1.4;
        }

@media
only screen and (min-device-pixel-ratio: 1.5),
only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
only screen and (min-resolution: 144dpi){
  .icon, .arrow,
  #block-search-form [data-action="open"],
  #block-search-form [data-action="close"],
  article.node > header [data-action="back"],
  article.node-exhibition .image-gallery .full-image:before,
  article.node-exhibition-field > .image-gallery [data-action="back"],
  .calendar-filters button[data-action="reset-filters"],
  .calendar-filters input[type="submit"],
  .item-list ul.pager > li.pager-last a,
  .owl-buttons > div {
    background-image: url("../images/sprite@2x.png")!important;
    background-size: 400px 250px;
  }
  #block-search-form [data-action="open"] {
    background-image: url("../images/sprite.png")!important;
  }

  #site-logo a[rel="home"] {
    background: url("../logo@2x-2023.png") no-repeat 0 0;
/*    background-size: 155px 60px;*/
    background-size: 280px 60px;
  }
  header[role="banner"][data-mini-logo="true"] #site-logo a[rel="home"] {
    background: url("../logo_mini@2x.png") no-repeat 0 0;
    background-size: 257px 30px;
  }
    #site-logo a[rel="home"] img {
      display: none;
    }
}

@media all and (max-width: 1024px){
  #brand.v2013 .brand-wrapper .main,
  #page,
  header[role="banner"][data-no-diagonal="true"],
  .cookies-message p {
    width: 95%;
  }

  #block-system-main-menu nav > ul.menu > li a {
    font-size: 1.6em;
    padding: .4em .4em .5em .4em;
  }

  article.node .main-content.col-container {
    height: 39vw;
  }
  article.node .image-gallery .full-image {
    height: 27vw;
  }
  article.node-page.visit-pages .main-content.col-container,
  article.node-collection .main-content.col-container {
    height: 62vw;
  }
  article.node-exhibition .main-content.col-container {
    height: 51vw;
  }
  article.node-page.visit-pages .image-gallery .full-image,
  article.node-collection .image-gallery .full-image {
    height: 50vw;
  }
  article.node-exhibition .image-gallery .full-image {
    height: 40vw;
  }

  article.node-collection .col-container .col-description .text-container {
    height: 86%;
  }
  article.node-exhibition .col-container .col-description .text-container {
    height: 82%;
  }

  #main .pane-omitsis-museudiss-calendar h2.pane-title {
		height: 3.5em;
		max-height: none;
	}
	.pane-omitsis-museudiss-calendar .calendar-filters {
		top: -8.5em;
	}
	.pane-omitsis-museudiss-calendar .calendar-filters .selector {
  	z-index: 2;
	}
  .pane-omitsis-museudiss-calendar .calendar-filters .day-selector {
  	top: 30px;
		right: auto;
		left: 6px;
		z-index: 1;
	}
	.calendar-filters .day-selector button {
		font-size: 1.2em;
		line-height: 1.5;
		padding: 0 .6em;
	}

  .cookies-message {
    height: auto;
  }

  .view-home-highlighted .node-highlighted .image-and-content .image img {
    width: 100%;
    max-width: none;
  }
}

@media all and (max-width: 890px){
  .mobile-menu {
    display: block;
  }
  #block-system-main-menu,
  #block-locale-language {
    display: none;
  }

	.museu-disseny-home-quarters-column-content > .museu-disseny-home-column {
		width: 50%;
	}
	.museu-disseny-home-halves-column-content .panel-pane .pane-content, .museu-disseny-home-quarters-column-content .panel-pane .pane-content {
		height: 388px;
		padding-bottom: 10px;
	}
	.museu-disseny-home-quarters-column-content .museu-disseny-home-column2 > .panel-panel-inner {
		padding-right: 0;
		border-right: none;
	}

	#content-header h1, article .panel-pane h2.pane-title,
	body.node-type-exhibition .panel-pane h2.pane-title,
	body.front .panel-pane h2.pane-title,
	.pane-contact h2.pane-title,
	article > header h1 {
		font-size: 3em;
	}
	.view-home-highlighted .node-highlighted .image-and-content .content h2 {
		font-size: 3.5em;
	}

  .view-collections .item-list {}
  .view-collections .item-list .node > header h2 {
    font-size: 1.8em;
  }

  .view-collections .item-list > ul > li,
  .view-page-list .item-list > ul > li {
    height: 48vw;
  }

  .view-exhibitions .item-list > ul > li {
    height: 60vw;
  }
}

@media all and (max-width: 770px){
  article .col-container > .col,
  body.node-type-exhibition .sutro-double-second-column-content .sutro-double-column {
    float: none;
    width: 100%;
    height: auto;
    margin-right: 0;
    margin-left: 0;
  }
  article .col-container > .col,
  body.node-type-exhibition .sutro-double-second-column-content .panel-panel > .panel-panel-inner {
    padding: 0 0 15px 0;
    margin: 0 0 10px;
    border-right: none;
    border-left: none;
    border-bottom: 1px solid black;
  }

  article.node .main-content.col-container,
  article.node-page.visit-pages .main-content.col-container,
  article.node .image-gallery .full-image,
  article.node-page.visit-pages .image-gallery .full-image,
  body.node-type-exhibition .sutro-double-second-column-content {
    height: auto;
  }
  article.node .image-gallery .full-image {
    margin-bottom: 10px;
  }
  article.node .col-container .col-description .share-links,
  article.node-exhibition .col-info a[data-action="buy-tickets"], article.node-exhibition .col-info .free-entrance {
    position: static;
    top: auto;
    bottom: auto;
    left: auto;
    right: auto;
    margin: 10px 0;
  }

  article.node-collection .collection-publications .col-container {
    height: 60vw;
  }
}

@media all and (max-width: 639px){
  .mobile-menu {
    top: 86px;
  }

  body.not-front header[role="banner"] #site-logo a[rel="home"] {
  	/*left: 26px;*/
  }
  .region-header {
		border-bottom: none;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		box-shadow: none;
	}
  /*#block-search-form {
    display: none;
  }*/

  .pane-omitsis-museudiss-calendar .calendar-filters {
    top: -6.5em;
  }
  .nice-calendar[data-js="true"] .calendar-filters .day-selector {
    display: none;
  }

  #content-header h1, article .panel-pane h2.pane-title,
  body.node-type-exhibition .panel-pane h2.pane-title,
  body.front .panel-pane h2.pane-title,
  .pane-contact h2.pane-title,
  article > header h1 {
    font-size: 2.4em;
  }

  .view-collections .item-list > ul > li,
  .view-page-list .item-list > ul > li {
    width: 50%;
    height: 83vw;
  }

  .view-exhibitions .item-list > ul > li {
    width: 50%;
    height: 95vw;
  }

  .view-activities .item-list > ul > li {
    width: 50%;
    height: 67vw;
  }

  .view-press .item-list > ul > li {
    width: 50%;
    height: 43vw;
  }

  #site-map .site-map-menus > div {
    width: 50%;
  }
}

@media all and (max-width: 600px){
  /* disabling the heights */
  #content .text-container, .pane-disqus-disqus-comments {
    height: auto!important;
  }
}

@media all and (max-width: 580px){
  .view-home-highlighted {
    height: 58vw;
  }
	.view-home-highlighted > .view-content {
		width: 50%;
	}
	.view-home-highlighted > .nav-list {
		width: 50%;
	}
	.view-home-highlighted .node-highlighted .image-and-content .content h2 {
		font-size: 2.5em;
	}
}

@media all and (max-width: 479px){
  .mobile-menu {
    top: 96px;
  }
  .mobile-menu.fixed {
    top: 10px;
  }
  .mobile-menu button {
    margin: 6px 0 0 9px;
  }
  .mobile-menu.fixed button {
    margin-top: 7px;
  }

	.view-home-highlighted > .view-content,
	.museu-disseny-home-column,
  .museu-disseny-home-column2,
  .museu-disseny-home-quarters-column-content > .museu-disseny-home-column,
  body.node-type-exhibition .sutro-double-second-column-content .sutro-double-column1 .panel-pane,
  #block-menu-menu-secondary,
  div#block-omitsis_museudiss-museum_address,
  #block-omitsis_museudiss-creativecommons,
  #block-menu-menu-tertiary-menu,
  .view-page-list .item-list > ul > li,
  .view-collections .item-list > ul > li,
  .view-exhibitions .item-list > ul > li,
  .view-activities .item-list > ul > li,
  .view-press .item-list > ul > li,
  #site-map .site-map-menus > div {
	  float: none;
    width: 100%;
    height: auto;
    margin-right: 0;
    margin-left: 0;
	}
  .museu-disseny-home-halves-column-content,
  article.node-collection .collection-publications .col-container,
  body.node-type-exhibition .sutro-double-first-column-content, body.node-type-exhibition .sutro-double-second-column-content,
  .museu-disseny-home-halves-column-content .panel-pane .pane-content, .museu-disseny-home-quarters-column-content .panel-pane .pane-content,
  .node-activity.node-teaser > .content {
    height: auto;
  }

  body.node-type-exhibition .sutro-double-second-column-content .sutro-double-column1 .panel-pane,
  .museu-disseny-home-column > .panel-panel-inner, .sutro-double-column > .panel-panel-inner {
    padding: 0 0 15px 0!important;
    margin: 0 0 10px;
    border-right: none;
    border-left: none;
    border-bottom: 1px solid black;
  }

  #brand.v2013 .brand-wrapper .navigation {
    width: 55%;
  }
  #brand.v2013 .brand-wrapper .navigation ul.languages {
    padding: 15px 0;
  }

	.view-home-highlighted > .view-content {
		height: 100%;
	}
	.view-home-highlighted > .nav-list {
		display: none;
	}

	footer[role="contentinfo"] {
		padding-bottom: 15px;
	}
}

/*********************
* Wireframes
**********************/
.wireframe-mode header[role="banner"],
.wireframe-mode #content-top,
.wireframe-mode #content-top > *,
.wireframe-mode #content-header,
.wireframe-mode #content-header > *,
.wireframe-mode #content-area,
.wireframe-mode #content-area > *,
.wireframe-mode #content-bottom,
.wireframe-mode #content-bottom > *,
.wireframe-mode #primary,
.wireframe-mode #secondary,
.wireframe-mode #sidebar-left-inner,
.wireframe-mode #sidebar-right-inner,
.wireframe-mode .block {
  padding: 2px;
  border: 1px solid #bbbbbb;
}
.wireframe-mode .node {
  border-bottom: 1px solid #bbbbbb;
  margin-bottom: 10px;
}
.wireframe-mode .block {
  margin-bottom: 3px;
}
.wireframe-mode #content-top,
.wireframe-mode #content-header,
.wireframe-mode #content-area,
.wireframe-mode #content-bottom {
  margin: 0 3px 3px;
}
.wireframe-mode footer[role="contentinfo"] {
  margin-top: 3px;
  padding: 2px;
  border: 1px solid #cccccc;
}
.wireframe-mode .with-navigation #content,
.wireframe-mode .with-navigation .sidebar {
  margin-top: 50px;
}
.wireframe-mode #navigation {
  height: 50px;
}

/*********************
* Print
**********************/
@media print {
  * {
    background: transparent !important;
    color: black !important;
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
    -ms-filter: none !important;
  }

  a, a:visited {
    text-decoration: underline;
  }

  a[href]:after {
    content: " (" attr(href) ")";
  }

  abbr[title]:after {
    content: " (" attr(title) ")";
  }

  .ir a:after,
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: "";
  }

  pre, blockquote {
    border: 1px solid #999999;
    page-break-inside: avoid;
  }

  thead {
    display: table-header-group;
  }

  tr, img {
    page-break-inside: avoid;
  }

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

  @page {
    margin: 0.5cm;
}

  p, h2, h3 {
    orphans: 3;
    widows: 3;
  }

  h2, h3 {
    page-break-after: avoid;
  }

  .sidebar,
  #navigation,
  #header-region,
  #search-theme-form,
  footer[role="contentinfo"],
  .breadcrumb,
  .tabs,
  .feed-icon,
  .links {
    display: none;
  }

  #page {
    width: 100%;
  }

  #content,
  #content #content-inner,
  .content,
  .title {
    margin: 20px 0;
    width: auto;
  }

  a:hover, a:active, a:link, a:visited {
    color: black;
  }

  #content a:link:after, #content a:visited:after {
    content: " (" attr(href) ") ";
    font-size: 11px;
    line-height: 16.5px;
    font-size: 1.1rem;
    line-height: 1.65rem;
    font-weight: normal;
  }
}
