/*#####################################################################################

  CSS tweaks for Version 2 Summary Pages on the Web

  Version Date: 17-Sep-2018

  NOTE
  ----
  This simply tweaks summary page styles, e.g., fonts to fit in with the Web version.
/*#####################################################################################

/*
 =======
 General
 =======
*/
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600,700);

/* Use Web font and sizing */
html.is-summarypage-2,
div.is-summarypage-2,
button
{
  font-family:'Open Sans', Sans-serif, 'Helvetica Neue', Helvetica, Verdana, Arial;
  font-size:12.5px;
  -webkit-overflow-scrolling: touch;
}

/* iOS Safari (stop page being able to be dragged which sometimes interferes with scrollable divs) */
html, body
{
  bottom:0;
  left:0;
  position:fixed;
  right:0;
  top:0;
  overflow:auto;
  -webkit-overflow-scrolling: touch;
}

/* Body will have no padding or margin so add some to the surrounding div */
body > div.is-summarypage-2
{
  padding:4px;
}

/* Allow photos to be collapsed */
.is-summarypage-2 div.is-photo
{
  border:0;
  box-shadow:none;
  padding:0;
}
.is-summarypage-2 div.is-photo > img
{
  border:0;
  padding:0;
  margin:0;
  vertical-align: middle;
}

/* Blocks */
div.is-summarypage-2 div.is-summarypage-block {
  border-radius:4px !important;
  overflow:hidden;
}


/*
  ==========
  Responsive
  ==========
*/

/* Make columns stack rather than be side-by-side and restrict blocks to 100% width */
.is-container-small div.is-summarypage-2 div.is-summarypage-section-columns,
.is-container-small div.is-summarypage-2 div.is-summarypage-section-columns > div
{
  display:block !important;
  max-width:100% !important;
  position:relative;
}
.is-container-small div.is-summarypage-2 div.is-summarypage-section-columns > div > div
{
  display:block !important;
  max-width:100% !important;
  position:relative;
  width:100% !important;
}
.is-container-small div.is-summarypage-2 div.is-summarypage-block-body
{
  overflow-x:auto;
  max-width:100% !important;
  position:relative;
  width:100% !important;
  -webkit-overflow-scrolling:touch;
}



/*
  ======
  Tables
  ======
*/

/* Table columns */
.is-container-small .is-summarypage-2 .hidden-800 {display:none; visibility:hidden}
.is-container-small .is-summarypage-2 .hidden-640 {display:none; visibility:hidden}
.is-container-small .is-summarypage-2 .hidden-500 {display:none; visibility:hidden}
.is-container-small .is-summarypage-2 .hidden-400 {display:none; visibility:hidden}
/*
.is-container-small .is-summarypage-2 .hidden-320 {display:none; visibility:hidden}
.is-container-small .is-summarypage-2 .hidden-240 {display:none; visibility:hidden}
*/


/*
=======
Buttons
=======
*/
.is-summarypage-2 button.is-template-button
{
  background-color:#f4f4f4 !important;
  border:1px solid rgba(0, 0, 0, 0.1) !important;
  border-radius:12px !important;
  display:inline-block;
  margin:0 2px 0 2px;
  cursor:pointer;
  font-family:'Open Sans', Sans-serif, 'Helvetica Neue', Helvetica, Verdana, Arial !important;
  font-weight:normal;
  font-size:12px !important;
  height:32px;
  min-width:80px;
  outline:none;
  padding:0 8px 0 8px;
}

.is-summarypage-2 button.is-template-button:hover
{
  background-color:#e8e8e8 !important;
  border:1px solid rgba(0, 0, 0, 0.2) !important;
}

.is-summarypage-2 button.is-template-button > img
{
  margin-top:-2px;
}

.is-summarypage-2 div.is-table-actions > ul.is-actions > li > a {
  border-radius:12px !important;
  font-size:11px !important;
  line-height:20px !important;
}

/*
======================
Sectioned Page Support
======================
*/
h1.is-section-heading {
  color:#0000A0;
  font-weight:bold;
  padding:0;
  font-size:14.375px;
  margin-top:0.85em;
  margin-bottom:0.1em;
}