/****** FILE: themes/mpi/css/small.css *****/
/*
  ==========================
  general page structure
  ==========================
*/
body
{
  padding-top: 13.4rem;
}

.wrapper
{
  width: 32rem !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}


/*
  ==========================
  page head
  ==========================
*/

#page-head
{
  height: 13.4rem;
  background: url(../../../themes/mpi/images/page-head-bg-tablet.png) 0 8.8rem no-repeat #323232;
}

/* sticky styling */
/* -------------- */
#page-head.sticky
{
  position: fixed;
  top: -8.8rem;
}

/* organisation logo / tag line */
/* ---------------------------- */
#page-head h1
{
  width: 100%;
  height: 6rem;
  margin: 1rem auto 1.8rem auto;
}

#page-head h1 a
{
  width: 100%;
  height: 6rem;
}

/* header utilities */
/* ---------------- */
#page-head-utilities
{
  display: block;
}

/* page search */
/* ----------- */
#page-head-search{display: none;}


/* primary navigation */
/* ------------------ */

#primary-nav
{
  position: relative;
}

#primary-nav > ul
{
  text-align: right;
}

#primary-nav > ul *
{
  text-align: left;
}

#primary-nav > ul > li
{
  float: none;
  display: inline-block;
  position: static;
}

#primary-nav > ul > li + li
{
  margin-left: 1.4rem;
}

#primary-nav > ul > li#home-nav,
#primary-nav > ul > li#menu-nav
{
  float: left;
}

#login-nav > a > span,
#contact-nav > a > span
{
  display: none;
}

#login-nav > a:after,
#contact-nav > a:after
{
  padding-right: 10px;
  padding-left: 10px;
  padding-top: 10px;
}

#primary-nav > ul > li.social
{
  display: none;
}

#primary-nav > ul > li.checkout.active
{
  display: inline-block;
}

.primary-nav-drop-down:hover:before,
.primary-nav-drop-down.active:before
{
  display: none;
}

.primary-nav-drop-down:hover > a,
.primary-nav-drop-down.active > a
{
  color: #fff !important;
}

.primary-nav-drop-down > ul
{
  position: fixed;
  top: 13.4rem;
  left: 0;
  right: 0;
  bottom: 0;
  width: auto;
  height: auto;
  max-height: -webkit-calc(100% - 13.4rem);
  max-height: -moz-calc(100% - 13.4rem);
  max-height: calc(100% - 13.4rem);
  overflow: auto;
  z-index: 20 !important;
  border: none;
  margin: 0;

  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;

  -webkit-transform: translate3d(-110%,0,0);
  -moz-transform: translate3d(-110%,0,0);
  transform: translate3d(-110%,0,0);

  -webkit-transition: -webkit-transform 0.6s;
  -moz-transition: -moz-transform 0.6s;
  transition: transform 0.6s;
}

.sticky .primary-nav-drop-down > ul
{
  top: 4.6rem;
  max-height: -webkit-calc(100% - 4.6rem);
  max-height: -moz-calc(100% - 4.6rem);
  max-height: calc(100% - 4.6rem);
}

.primary-nav-drop-down.active > ul
{
  z-index: 20 !important;

  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

/* menu nav */
/* -------- */
#menu-nav a:after
{
  content: '';
  display: none;
}

#menu-nav > ul li
{
  padding-right: 0;
}

#menu-nav > ul ul li
{
  margin-right: 0;
}

/* contact nav styling */
/* ------------------- */
#contact-nav > a:hover,
/*#contact-nav > a:focus*/
{
  color: #006699 !important;
}

#contact-nav > ul
{
  left: 0;
  right: 0;
  width: auto;
  font-size: 90%;
}

#contact-nav-follow-list li a span
{
  text-align: center;
}

/* search nav styles */
/* ----------------- */
#primary-nav #search-nav
{
  display: inline-block;
}

#primary-nav #search-nav span
{
  display: none;
}

#primary-nav #search-nav a:after
{
  display: inline;
  font-family: 'font_icon';
  content: '\e800';
  font-size: 2rem;
  padding: 0 0 0 0.6rem;
}

/* back to top */
/* ----------- */
.back-to-top
{
  top: 12.4rem;
}


/* page banner */
/* ----------- */
#page-banner header
{
  padding: 1rem 0 0.7rem 0;
}

#page-banner header .wrapper
{
  padding: 0 !important;
}

#page-banner header .wrapper > h2
{
  padding-top: 0;
  font-size: 2.2rem;
}

#page-banner header .wrapper *:not(h2)
{
  display: none;
}

/* quick finder */
/* ------------ */
#quick-finder
{
	display:none;	
}

#quick-finder form,
#quick-finder form .column
{
  float: none;
  display: block;
  width: 100%;
}

#quick-finder form .column + .column
{
  margin: 0;
}

#quick-finder:hover .show-hide,
#quick-finder.active .show-hide
{
  height: 21.8rem;
}

/* alert / crisis banner */
/* --------------------- */

div.alert .wrapper
{
  padding: 2.3rem 0 2.2rem 4.8rem !important;
  font-size: 1.5rem;
}

div.alert .wrapper:before
{
  top: 1.2rem;
  left: 0rem;
  width: 3.8rem;
  height: 3.8rem;
  font-size: 2.2rem;
}

div.alert h2
{
  font-size: 1.8rem;
}

div.alert h2 + *
{
  margin-top: 0.4rem;
}

/*
  ==========================
  main body
  ==========================
*/
#main-page
{
  padding-bottom: 15rem;
}

#main-page aside
{
  padding-top: 2.4rem;
  margin-top: 2rem;
}

/*
  ==========================
  footer
  ==========================
*/
#page-foot
{
  margin-top: -12rem;
  height: 12rem;
}

#footer-nav,
#footer-contacts,
#page-foot-upper hr,
#page-foot-upper section h2:first-of-type,
#page-foot-upper section ul:first-of-type
{
  display: none;
}

#page-foot-upper,
#page-foot-upper .wrapper.table
{
  height: auto;
  min-height: 0;
}

#page-foot-upper
{
  padding: 1rem 0 0.8rem 0;
  background-image: none;
}

#page-foot-upper .wrapper.table .table-cell
{
  border: none;
}

#page-foot-upper .wrapper.table .table-cell > *
{
  margin: 0;
}

#page-foot-upper section h2
{
  display: block;
  float: left;
  padding: 0.6rem 0 0 0;
}

#page-foot-upper section ul
{
  display: block;
  float: right;
}

#page-foot-lower p
{
  display: none;
}

#page-foot-lower #nz-govt-footer-link
{
  display: block;
}

/*
===============================================================================
TYPOGRAPHY
===============================================================================
*/

/*
  ==========================
  default text
  ==========================
*/

main
{
  font-size: 1.4rem;
}

/*
  ==========================
  headings / titles
  ==========================
*/

h1#page-title
{
  font-size: 3.2rem;
}

/* heading */
/* ------- */
h2
{
  font-size: 2.8rem;
  font-weight: normal;
  color: #00849f;
}

/* sub-heading */
/* ----------- */
h3
{
  font-size: 2.2rem;
  font-weight: normal;
  color: #333;
}

/* minor heading */
/* ------------- */
h4
{
  font-size: 1.7rem;
  font-weight: normal;
  color: #133d5f;
}

/* minor heading 2 */
/* --------------- */
h5
{
  font-size: 1.4rem;
  font-weight: normal;
  color: #00849f;
}

/*
==========================
paragraphs
==========================
*/

main .intro *
{
  font-size: 1.8rem;
  line-height: 2.2rem;
}

/*
==========================
main content imagery
==========================
*/

main figure
{
  width: 12rem;
}

main figure img
{
  display: block;
  min-width: 12rem;
}

main figure figcaption
{
  padding: 1rem 0.7rem;
  font-size: 1.2rem;
  line-height: 1.5rem;
}


/*
==========================
forms
==========================
*/

main form
{
  padding: 1.2rem;
  font-size: 1.4rem;
}

/* general form inner styles */
/* ------------------------- */
main form input,
main form select,
main form textarea
{
  width: 100%;
  max-width: none;
  font-size: 1.4rem;
}

main form .field + .field
{
  margin-top: 1rem;
}

.Actions
{
  margin-top: 1.6rem;
  padding-top: 1.6rem;
}

.document-filter-tips {
  width: 40%;
}

main form .columns .column
{
  float: none;
  margin-left: 0 !important;
  width: 100% !important;
}

main form .columns .column + .column
{
  margin-top: 1rem;
}

main form span.helper
{
  left: auto;
  right: 0;
}

main form span.extra.popup
{
  left: auto;
  right: 2.4rem;
  max-width: 24rem;
}


/*
==========================
tables
==========================
*/

main table
{
  position: relative;
  font-size: 1.2rem;
  line-height: 1.2;
}

main table th
{
  padding: 0.4rem 0.4rem 0.3rem 0.4rem;
  font-size: 1.3rem;
  line-height: 1.2;
}

main table td
{
  padding: 0.4rem;
}

main table td img
{
  width: 12rem;
  margin: 0 0.8rem 0.5rem 0;
}

main .table-wrapper
{
  overflow-y: hidden;
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
}


/*
  ==========================
  bookmarks
  ==========================
*/

main ul.bookmarks
{
  font-size: 1.3rem;
}


/*
  ==========================
  page info and feedback
  ==========================
*/

/* main content feedback */
/* --------------------- */
.page-info-feedback
{
  font-size: 1.2rem;
  line-height: 1.4;
}

.page-info-feedback span:last-child
{
  margin-left: 0;
  display: block;
}



/*
==========================
quotes
==========================
*/

main blockquote
{
  padding: 2.2rem 3.6rem;
  font-size: 1.8rem;
  line-height: 2.4rem;
}

main blockquote:before
{
  top: 4.6rem;
  left: -0.8rem;
  font-size: 8rem;
}

main blockquote:after
{
  bottom: 0rem;
  right: 0.8rem;
  font-size: 8rem;
}


/*
==========================
document sets - simple and dynamic
==========================
*/

ul.simple-document-list
{
  font-size: 1.4rem;
}

ul.simple-document-list li
{
  padding: 0.6rem 1rem;
}

/*
  ==========================
  document / link highlight
  ==========================
*/
main .feature-doc,
main .feature-link
{
  padding: 0.8rem 0.8rem 0.8rem 4.8rem;
  font-size: 1.4rem;
  line-height: 1.8rem;
}

main .feature-doc a,
main .feature-link a
{
  padding-left: 0.6rem;
  font-size: 1.5rem;
}

main .feature-doc a:after,
main .feature-link a:after
{
  font-size: 1.4rem;
}

main .feature-doc:before,
main .feature-link:before
{
  margin: 0;
  margin-left: -4rem;
  -webkit-border-radius: 2rem;
  -moz-border-radius: 2rem;
  border-radius: 2rem;
  font-size: 2.6rem;
}

main .feature-doc:before
{
  width: 4rem;
  height: 3.3rem;
  padding: 0.7rem 0 0 0;
}

main .feature-link:before
{
  width: 3.8rem;
  height: 3.4rem;
  padding: 0.6rem 0 0 0.2rem;
}


/*
  ==========================
  special feature box
  ==========================
*/

main .special-feature
{
  font-size: 1.4rem;
}

main .special-feature h2
{
  font-size: 2.2rem;
}

main .special-feature h3
{
  font-size: 1.5rem;
}

.column-layout-style
{
  -webkit-columns: 1;
  -moz-columns: 1;
  columns: 1;
}


/*
  ==========================
  simple highlight question text
  ==========================
*/
.highlight-question
{
  padding: 0.8rem 1rem 0.8rem 4rem;
  font-size: 1.4rem;
}

.highlight-question:before
{
  margin-left: -3rem;
}


/*
==========================
common tiles
==========================
*/
#main-page .tile
{
  width: 100% !important;
  height: auto !important;
  margin-left: 0 !important;
}

#main-page .tile a
{
  height: auto;
  overflow: hidden;
  font-size: 1.5rem;
}

#main-page .tile h2
{
  text-align: left;
  padding-bottom: 0.4rem;
}

#main-page .tile figure
{
  width: 15rem;
  height: 14rem;
  margin: 0 1rem 0 0 !important;
}

#main-page .tile figure + *
{
  margin-top: 0 !important;
}

/* promo tile variation */
/* -------------------- */
#main-page .tile.promo
{
  height: auto;
  margin-bottom: 2rem;
  font-size: 1.5rem;
}

#main-page .tile.promo a
{
  height: auto;
}

#main-page .tile.promo figure
{
  float: left;
  width: 8rem;
  height: auto !important;
}

#main-page .tile.promo h2
{
  font-size: 1.8rem;
  clear: none !important;
}


/*
  ==========================
  feature list / what's popular list
  ==========================
*/
.column + .feature-list.column,
.feature-list
{
  margin: 0 !important;
  width: 100% !important;
}

#main-page * + .feature-list
{
  margin-top: 1rem !important;
}

.feature-list h2
{
  font-size: 2.2rem;
}



/*
  ==========================
  article lists (with tags)
  ==========================
*/

/* tag list filter */
/* --------------- */
.tag-list
{
  font-size: 1.3rem;
}

/* article styling */
/* --------------- */
.article-list article
{
  font-size: 1.3rem;
}

.article-list article + article
{
  margin-top: 1rem;
}

.article-list article h2
{
  font-size: 1.4rem;
}

.article-list article h3
{
  font-size: 1.3rem;
}

/* attributes - such as news tags / info */
/* ------------------------------------- */
.article-list article .article-attributes
{
  float: none;
  width: auto;
  margin-right: 0;
  margin-bottom: 0.6rem;
}

.article-list article .article-attributes > *
{
  display: inline-block;
}

.article-list article .article-attributes > * + *
{
  margin-top: 0;
}

/* article thumbnail */
/* ----------------- */
.article-list article .article-thumbnail
{
  display: none;
}

/* article info */
/* ------------- */
.article-list article .article-info
{
  overflow: hidden;
  margin-top: 0.6rem;
}

.article-list article .article-info .columns .column
{
  float: none;
  width: auto;
  margin-left: 0;
}

.article-list article .article-info .columns .column + .column
{
  margin-top: 0.4rem;
}


/*
==========================
modal pop ups
==========================
*/
.modal
{
  top: 4rem;
  right: 0;
  margin-right: 0;
  width: 100%;
  min-height: 6rem;
  padding: 1rem;
}


/*
  ==========================
  home page
  ==========================
*/

.sticky-margin {
	margin-top: -8.8rem;
}

.home #page-banner
{
  background-position: center -webkit-calc(100% - 20rem);
  background-position: center -moz-calc(100% - 20rem);
  background-position: center calc(100% - 2rem);
  min-height: 30em;
}

.home #page-banner header
{
  padding: 1rem 0;
}

.home #page-banner header .wrapper,
.home #page-banner .wrapper
{
  padding: 0 !important;
}

.home #page-banner header .wrapper > h2
{
  font-size: 1.8rem;
}

/* home banner alerts */
/* ------------------ */
.home #page-banner.alert div.alert .columns
{
  overflow: visible;
  padding: 2.5rem 1rem 1rem 5rem !important;
}

.home #page-banner.alert div.alert .columns .column
{
  float: none;
  width: auto;
  margin-right: 0;
}

.home #page-banner.alert div.alert .columns #alert-contact-info
{
  padding: 0.8rem 0 0 0;
  margin-top: 1rem;
  font-size: 1.5rem;
}

.home #page-banner.alert div.alert .columns #alert-contact-info:before
{
  right: 5rem;
}

.home #page-banner.alert div.alert .columns #alert-contact-info h4 + *
{
  margin-top: 0.2rem;
}

.home #page-banner.alert div.alert .columns #alert-contact-info p
{
  width: 100%;
}

.home #page-banner.alert div.alert .columns #alert-contact-info p span
{
  padding-bottom: 0.1rem;
}

/* nav tags */
/* -------- */
ul#home-nav-tags li
{
  margin: 0 0.3rem 0.5rem 0;
}

ul#home-nav-tags li a
{
  height: 3rem;
  padding: 0 1rem;
  font-size: 1.4rem;
  line-height: 3.2rem;
}

.home #quick-finder
{
  width: 100%;
  margin-top: 2rem;
}

/* home and landing pages */
/* ---------------------- */
.home #main-page .wrapper,
.landing #main-page .wrapper
{
  width: 32rem !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

.home #main-page .tile,
.landing #main-page .tile
{
  float: none;
  margin-left: 0;
}

.home #main-page .tile:nth-child(4n+1),
.landing #main-page .tile:nth-child(4n+1)
{
  margin-left: 0;
}

.home #main-page .feature-list.column,
.landing #main-page .feature-list.column
{
  margin-left: 0;
  width: 100%;
}

.home #main-page * + .feature-list.column,
.landing #main-page * + .feature-list.column
{
  margin-top: 0;
}


/*
  ==========================
  landing page
  ==========================
*/
.landing main .upper article
{
  font-size: 1.4rem;
}

.landing main .upper article figure
{
  width: 8rem;
}


/*
  ==============================
  process page & expandable page
  ==============================
*/

.process-flow .process-show
{
  position: static;
}

.process-flow h2.process-title
{
  width: 100%;
  clear: both;
}

/* process steps */
/* ------------- */
.process-step + .process-step
{
  margin-top: 2.6rem;
}

/* header */
.process-step header > a
{
  min-height: 8rem;
  padding: 0.8rem 1.2rem;
  border-left: solid 4.8rem #4A8416;
  font-size: 1.4rem;
  line-height: 1.3;
}

/* header */
.process-step.non-numbered header > a
{
    min-height: 4.3rem;
    border-left: solid 2.4rem #4A8416;
}

.process-step header > a:after
{
  left: -3.6rem;
}

.process-step.non-numbered header > a:after
{
    left: -1.9rem;
}

.process-step header h3
{
  width: 4.8rem;
  margin-left: -6rem;
  margin-top: 0.2rem;
  font-size: 1.4rem;
}

.process-step header h3 span
{
  width: 3.2rem;
  height: 3.2rem;
  -webkit-border-radius: 2rem;
  -moz-border-radius: 2rem;
  border-radius: 2rem;
  font-size: 2.3rem;
  line-height: 3.4rem;
}

.process-step header h4
{
  font-size: 1.7rem;
  margin-top: 0 !important;
}

/* detail */
.process-detail
{
  margin-top: 1.6rem;
}

/*
==========================
search page
==========================
*/

#search-page-form .form-group
{
  white-space: nowrap;
}

#search-page-form .form-group .text-input
{
  width: -webkit-calc(100% - 3.8rem);
  width: -moz-calc(100% - 3.8rem);
  width: calc(100% - 3.8rem);
}

main .search-results-summary
{
  font-size: 1.8rem;
}


/*
  ==========================
  glossary page
  ==========================
*/

#glossary-search-form form
{
  padding-top: 0.8rem;
}

#glossary-search-form .form-group .text-input
{
  width: -webkit-calc(100% - 3.8rem);
  width: -moz-calc(100% - 3.8rem);
  width: calc(100% - 3.8rem);
}


/*
  ==========================
  document cart
  ==========================
*/

/* cart icon */
/* --------- */

.doc-cart-tab
{
  display: none;
}


/*
  ==========================
  book page(s)
  ==========================
*/

* + .book-navigation
{
  margin-top: 1.6rem;
}

.book-navigation > li > a
{
  padding-left: 1.4rem;
  padding-right: 1.4rem;
}

.book-navigation > li > a > span
{
  display: none;
}

.book-navigation > li > a:before,
.book-navigation > li.nav-control > a.next:after
{
  margin-right: 0;
}

.book-navigation > li.nav-control > a.next:after
{
  margin-left: 0;
}

/* menu drop down */
/* -------------- */
.book-navigation .menu ul
{
  left: 0;
  width: 30rem;
}


/*
  ==========================
  decision support tool (DST)
  ==========================
*/

/* stages of DST progress */
/* ---------------------- */
.dst-with-outcomes #dst-header #dst-outcomes-wrapper,
.dst-outcome #dst-header #dst-print
{
  display: inline-block;
}

/* common dst header */
/* ----------------- */
#dst-header
{
  display: block;
  width: auto;
}

#dst-header > *
{
  display: block;
  vertical-align: middle;
}

#dst-outcomes-wrapper,
#dst-print
{
  display: inline-block;
  padding: 0;
  margin: 0.2rem 0 0.2rem 1rem;
  width: auto;
}

#dst-journeys-list-inner > table th
{
  font-size: 1.5rem;
}

#dst-journeys-list-inner > table td
{
  font-size: 1.4rem;
}

#dst-journeys-list-inner > table td a.dst-saved-edit:before,
#dst-journeys-list-inner > table td a.dst-saved-save:before,
#dst-journeys-list-inner > table td a.dst-saved-cancel:before,
#dst-journeys-list-inner > table td a.dst-saved-delete:before
{
  font-size: 1.8rem;
}

#dst-journeys-list-inner > table td a.dst-saved-save
{
  margin-right: 1rem;
}

#dst-journeys-list-inner > table tr td input.dst-saved-input-name
{
  width: 10rem;
}


/* start page */
/* ---------- */
#dst-start-options
{
  padding: 1.2rem;
}

#dst-start-options hr
{
  margin-left: -1.2rem;
  margin-right: -1.2rem;
}

ul.dst-start-list
{
  -webkit-column-count: 1;
  -moz-column-count: 1;
  -ms-column-count: 1;
  column-count: 1;
}


/* question page */
/* ------------- */
h2.dst-section-title
{
  font-size: 3.2rem;
}

.dst-question-content
{
  padding: 1.2rem;
  font-size: 1.6rem;
}

.dst-question-content hr
{
  margin-left: -1.2rem;
  margin-right: -1.2rem;
}

.dst-question-label
{
  font-size: 1.6rem;
}

.dst-question-intro,
.dst-question-heading
{
  font-size: 2.2rem;
}

.dst-answer-options
{
  font-size: 2.8rem;
}

.dst-answer-options > *
{
   padding: 0 1.6rem;
}

.dst-answer-options > * + *:before
{
  left: -1.6rem;
  height: 8rem;
}

.dst-answer-options a
{
  width: 10rem;
  height: 10rem;
  padding: 0 1.2rem;
  line-height: 3.6;
}

/* dst outcomes page */
/* ----------------- */
#dst-outcome-wrapper
{
  padding: 1.2rem;
}

#dst-back-to-start-btn
{
  padding: 0 2.4rem;
}

#dst-answer-list-wrapper h4
{
  font-size: 1.6rem;
}

#dst-answer-list-wrapper h4:before
{
  padding-right: 0.6rem;
}

.dst-answer-list table td
{
  padding: 1rem !important;
}

.dst-answer-list table td.dst-result-question
{
  padding-left: 1rem !important;
  font-size: 1.4rem;
}

.dst-result-question .dst-original-question,
.dst-result-answer
{
  font-size: 1.6rem;
}

figure.standard-image img {
  max-width: 100% !important;
  height: auto !important;
}