@import url('cer.content.desktop.css');
@import url('cer.content.tablet.css');
@import url('cer.content.phone.css');

div#sideNavBox
{
    display: block !important;
    visibility: visible !important;
}
div#s4-bodyContainer, div#contentRow {
    background-color: white;
}
div#contentRow {
   background-image: url("/Style%20Library/Images/background-menuShadow.png");
   background-repeat: repeat-x;
}

div.contentPage-content-area {
    display: inline-block;
    width: 73%;
    margin-left: 1%;
    margin-right: 1%;
}


div#s4-workspace div.cer-contentPage-suggestedReading-block div > ul {
    padding-left: 0;
}
div.contentPage-content-area div.cer-contentPage-innerContent ul {
    padding-left: auto;
}
/*2017-10-03 | ST: Added this to fix up spacing with all list items :: Part 1 */
#s4-workspace div.contentPage-content-area ul > li,
div.contentPage-content-area ul > li {
   /* line-height: 26px !important; 2017-09-27 | ST: Removed as this has been interfering with every list forever! */
   line-height: 1.5;
   margin-top: 6px;
}
/*2017-10-03 | ST: Added this to fix up spacing with all list items :: Part 2 */
#s4-workspace div.contentPage-content-area ul {
    margin-top: 10px;
}
div.contentPage-content-area h1 {
    font-weight: bold;
    margin-top: 5px;
    margin-bottom: 20px;
}
div.contentPage-content-area h2 {
    font-size: 24px;
    line-height: normal;
    font-family: MuseoSans500;
    margin-bottom: 5px !important;
}
div.contentPage-content-area h2 > img {
    margin-top: 0 !important;
}
div.cer-contentPage-innerContent-wrapper p {
    font-size: 13px;
}

div.cer-contentPage-dateAndTagsHeader {
    width: 100%;
    border-top: 1px solid #DFE0DE;
    border-bottom: 1px solid #DFE0DE;
    padding-top: 7px;
    padding-bottom: 7px;
}
div.dateLastModified-timestamp
{
    display: inline-block;
    padding-right: 10px;
    height: 18px;
    border-right: 1px solid #DFE0DE;
    margin-right: 10px;
}
div.cer-contentPage-innerContent-wrapper {
    border-top: 1px solid #DFE0DE;
}
div.cer-contentPage-tagsHeader {
    display: inline-block;
}
div.cer-contentPage-innerContent-wrapper {
    width: 100%;
}
div#s4-workspace div.cer-contentPage-innerContent-header,
div#s4-workspace div.cer-contentPage-suggestedReading-header {
    border-bottom: 1px solid #DFE0DE;
    margin-bottom: 10px;
    min-height: 70px;
    padding-top: 12px;
}
div#s4-workspace div.cer-contentPage-suggestedReading-header h2 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
div#s4-workspace div.cer-contentPage-suggestedReading-block {
    float: right;
    width: 295px;
    padding-left: 15px;
    margin-bottom: 10px;
}
div#s4-workspace div.cer-contentPage-suggestedReading-block ul {
    margin-bottom: 0;
}
div#s4-workspace div.cer-contentPage-suggestedReading-block li {
    list-style-position: inside;
    border-top: 1px solid #DFE0DE;
    padding-top: 5px;
    padding-bottom: 5px;
    /*width: 100%;*/
}
div#s4-workspace div.cer-contentPage-suggestedReading-block li:first-child {
    border: none !important;
    padding-top: 0 !important;
}
div#s4-workspace div.cer-contentPage-suggestedReading-block li a,
div#s4-workspace div.cer-contentPage-suggestedReading-block li a:visited,
div#s4-workspace div.cer-contentPage-suggestedReading-block li a:active {
    font-size: 14px;
    line-height: 20px;
    font-family: MuseoSans500;
    text-decoration: underline;
}
div#s4-workspace div.cer-contentPage-suggestedReading-block li a:hover {
    text-decoration: underline;
}
div#s4-workspace div.cer-contentPage-suggestedReading-block > div {
    width: 100%;
    border-bottom: 4px solid #9FD1E0;
}
div.cer-contentPage-innerContent-header {
    display: inline-block;
    width: calc(100% - 300px);
}
div.cer-contentPage-innerContent-header > div {
    margin-top: 20px;
}
div.cer-contentPage-innerContent {
    width: auto;
    border-bottom: 4px solid #9FD1E0;
}
div.electronicBook-outer,
div.cer-contentPage-similarPages-block {
    width: 100%;
    border-bottom: 4px solid #9FD1E0;
}
div.cer-contentPage-similarPages-header {
    display: block;
    width: 100%;
}
div.cer-contentPage-similarPages-cell h3 > a,
div.cer-contentPage-similarPages-cell h3 > a:link,
div.cer-contentPage-similarPages-cell h3 > a:visited {
    font-family: MuseoSans500;
    font-size: 17px;
    line-height: 20px;
    color: #005773;
    text-decoration: none;
}
div.cer-contentPage-similarPages-cell h3 > a:active,
div.cer-contentPage-similarPages-cell h3 > a:hover {
    color: #18B0DF; /*sic*/
    text-decoration: underline;
}

div.cer-contentPage-similarPages-cells {
    width: 100%;
}




div.cer-contentPage-similarPages-cell {
    display: inline-block;
    width: 31%;
    border-top: 1px solid #DFE0DE;
    padding-right: 5px;
}



div.cer-contentPage-similarPages-spacerCell {
    display: inline-block;
    width: 3%;
}

/* Patch for editing webpart in article page [TFS 9771] */
form#aspnetForm[enctype="multipart/form-data"] table td div#MSOTlPn_WebPartPageDiv{
    max-width: 1000px !important;
}

/* Update for SRES media tables */
/* Table-wide styles */

.sres-summary-table,.sres-key-table{
	border-collapse: collapse;
	border: 2px solid #333740;
	margin-left: auto;
	margin-right: auto;
}

.sres-summary-table td, .sres-summary-table th {
	padding: 5px;
	border: 2px solid #333740;
}

.sres-summary-table caption,.sres-key-table caption{
	background-color: #333740;
	text-align: center;
	color: white;
	font-size: x-large;
}



/* Key table */
.sres-key-table{
	margin-bottom: 20px;
}

.sres-key-table img{
	width: 44px;
	margin: 5px 10px 5px 10px;
}

.sres-key-table td{
	padding: 5px;

}

.sres-key-table .icon-label{
	display: inline-block;
	width: 120px;
	vertical-align: middle;
}



/* Values row styles */
.sres-summary-table .values th, .sres-summary-table .totals{
	background-color: #a3a6a9;
}

.sres-summary-table .values th{
	font-size: large;
	font-weight: normal;
}

.sres-summary-table .values th div{
	font-weight: bold;
}

.sres-summary-table .values td{
	color: #2696a9;
	text-align: center;
	font-size: x-large;
	font-weight: bold;
	width: 78px;
}

.sres-summary-table .values td .icon{
	padding: 10px 0px 10px 0px;
}

.sres-summary-table .values td .icon img{
	width: 44px;
}

/* Totals row styles */

.sres-summary-table .totals th{
	font-size: large;
	text-align: center;
}

.sres-summary-table .totals td{
	font-size: large;
	text-align: center;
	color: white;
	font-weight: bold;
}

/* Update for ERF media Fund facts */

.fund-fact{
	max-width: 800px;
	min-width: 350px;
	border: 2px solid #005776;
}

.fund-fact .banner{
	height: 86px;
	padding: 0px;
	margin: 0px;
	background-image: url('/PublishingImages/ERF%20media%20resources/Emissions%20position/fund-facts_no-title.png');
	background-color: #DFE1DF;
	background-position: top left;
	background-repeat: no-repeat;
}

.fund-fact .banner h3{
	margin: 0px;
	padding: 20px 0px 0px 10px;
	color: white !important;
}

.fund-fact .banner .month{
	font-size: x-large;
}

.fund-fact .content{
	padding: 10px;
}

/* NGER 14-15 highlights */

.nger14-15-highlights {
	background-color: #383A42;
	padding:5px;
	max-width: 855px;
}

.nger14-15-highlights .nger-row {
	text-align: center;
   margin:0px;
}

.nger14-15-highlights .cell-a1 {
	margin: 5px 25px 5px 5px;
	display: inline-block;
}

.nger14-15-highlights .simple-cells{
	margin: 5px; display: inline-block;
}

.nger14-15-highlights .cell-b1 {
	margin: 5px 24px 5px 5px;
	display: inline-block;
}

@media only screen and (max-width: 1150px){
	.nger14-15-highlights .cell-b1, .nger14-15-highlights .cell-a1{
		margin: 0px;
		display: block;
		text-align: center;
	}

	.nger14-15-highlights .simple-cells{
		display: block;
		text-align: center;
	}

	.nger-row img{
		margin-left: auto;
		margin-right: auto;
	}
}

/* Change default CSS for Search Results Footer Links as Per CO5577 / 17787 */
.ms-srch-resultFooter, .ms-srch-resultFooter a {
    color: #005773;
    font-family: MuseoSans500;
}

.ms-srch-resultFooter a:hover {
	color: #005773;
    background-color: #E7EBE7;
    text-decoration: underline;
}

.ms-srch-resultHeader ul#ResultHeader {
	margin-left:-40px;
	margin-top:0px;
}

.ms-srch-resultHeader a {
    color: #005773;
    font-family: MuseoSans500;
}

.ms-srch-resultHeader a:hover {
	    background-color: #E7EBE7;
    text-decoration: underline;

}
div#ResultCount {
	color: #777;
	font-family:MuseoSans300;
}

/* Custom css for quick reference guide column templates */

.col-md-2 > h3:nth-child(2) {
	/* Doing nth child because headings generate an anchor tag before them */
	margin-top: 0;
}

/*****************************************************/
/*****  The code below is for the ERF Schematic ******/


    .erf-schematic h1,
    .erf-schematic h2,
    .erf-schematic h3,
    .erf-schematic h4,
    .erf-schematic h5,
    .erf-schematic h6 {
        margin: 0px !important;
        padding: .5em 0em !important;
        font-family: MuseoSans500 !important;
    }
    .erf-schematic .title h1,
    .erf-schematic .title h2,
    .erf-schematic .title h3,
    .erf-schematic .title h4,
    .erf-schematic .title h5,
    .erf-schematic .title h6 {
      color:#eee !important;
    }
    .erf-schematic .title h2 {
      font-size: 30pt !important;
      font-weight: 900;
      line-height: 30pt !important;
    }
    .erf-schematic .title h3 {
      font-size: 20pt !important;
      font-weight: 300;
      line-height: 20pt !important;
    }
    .erf-schematic .title .second-title {
      font-size: 20pt !important;
      font-weight: 300;
      line-height: 20pt !important;
      color:#eee !important;
      padding:.5em 0em !important;
      display: inline-block;
    }
    .erf-schematic h5 {
      font-size: 12pt !important;
      font-weight: 600;
      line-height: 12pt !important;
    }
    .erf-schematic .darkborder h4 {
         font-size:18pt !important;
         line-height:18pt !important;
         padding: 0px !important;
     }
     @media (max-width: 749px) {
        .erf-schematic .darkborder h4 {
             font-size:12pt !important;
             line-height:12pt !important;
         }
      }
    .erf-schematic hr {
     border-bottom: #999 1px solid;
    }
    .erf-schematic .backdrop {
     width:100vw;
     height:100vh;
     position: fixed;
     z-index: -9999;
    }
    .erf-schematic .backdrop-black {
     width:40%;
     height:100%;
     background-color:#383A42;
     float:left;
    }
    .erf-schematic .black {
     background-color:#383A42;
    }
    .erf-schematic .backdrop-blue {
     width:60%;
     height:100%;
     background-color:#00A7D3;
     float:right;
    }
    .erf-schematic .blue {
     background-color:#00A7D3;
    }
    .erf-schematic .container {
     //background-color:#eee;
    }
    .erf-schematic .light {
     background-color: #eee;
     color:#333;
     margin-bottom:0;
     border:none;
     border-left: 30px solid #383A42;
    }
    .erf-schematic .light p:nth-child(1) {
         padding-top:15px;
    }
    .erf-schematic .dark {
         height:80px;
         padding:10px;
         background-color: #383A42;
         color:#eee;
         margin-bottom:0px;
         text-align: center;
         font-size: 120%;
    }
    .erf-schematic .darkborder {
        border-left: 30px solid #383A42;
        border-top: 30px solid #383A42;
        background: #eee;
    }
    .erf-schematic .arrow::after {
        margin-left: -10px;
        border-left: 25px solid transparent;
        border-right: 25px solid transparent;
        border-top: 25px solid #383A42;
        content: " ";
    }

    @media (max-width: 749px) {
        .erf-schematic .plus {
            font-size: 16pt;
            margin-top: 36px;
        }
    }
    @media (min-width: 750px) and (max-width: 991px) {
        .erf-schematic .plus {
            font-size: 20pt;
            margin-top: 34px;
        }
    }
    @media (min-width: 992px) {
        .erf-schematic .plus {
            font-size: 26pt;
            margin-top: 26px;
        }
    }

    .erf-schematic .plus {
      display:block;
      transform: rotate(-45deg);
      transition: all 0.2s ease-in-out;
    }
    .erf-schematic .minus {
      transform: rotate(0deg) !important;
      transition: all 0.2s ease-in-out;
    }
    .erf-schematic .angle-box {
        width:100%;
    }
    .erf-schematic .invert {
        transform: scaleY(-1);
        filter: FlipV;
        -ms-filter: "FlipV";
    }
    .erf-schematic .accordianSlice {
      padding-top:15px;
      padding-bottom:15px;
    }
    .erf-schematic .accordian1 {
      margin: -15px;
      padding: 30px;
    }
   @media (min-width: 749px) {
        .erf-schematic .accordian1 {
           border-left: 15px solid #00A7D3;
           border-right: 15px solid #383A42;
        }
    }
    .erf-schematic .accordian2 {
      margin: -15px;
      padding: 30px;
    }
   @media (min-width: 749px) {
        .erf-schematic .accordian2 {
           border-right: 15px solid #00A7D3;
           border-left: 15px solid #383A42;
        }
    }

    .erf-schematic .light>ul {
       padding-left:0;
    }
    .erf-schematic .light>ul>li {
        list-style-type: none;
        border-bottom: 1px solid black;
        margin-bottom: 30px;
    }

/* Questionnaire CSS */
.question-viewer {
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.4);
	margin: 10px;
	padding: 10px 20px 30px;
	border-radius: 3px;
}

.question-viewer .row {
  margin: 0 !important;
}

.question-viewer div#context-container span.label{
	font-size: small;
}

.question-viewer .label {
	font-size: inherit;
	float: none;
	width: auto;
	margin: auto;
}

.question-viewer .todo-label{
	margin-bottom: 10px;
}

.question-viewer .info-panel {
	border-left:5px solid #82c5d8;
	border-bottom:1px solid #ddd;
}

.question-viewer .answer-panel {
	border-left:5px solid #005874;
}

.question-viewer .questionnaire-signpost{
	padding: 10px;
	font-size: large;
	text-align: center;
}

.question-viewer table.helpful-signs td{
	border: none !important;
}

.question-viewer .history-panel .answer{
	margin-top: 10px;
}

.question-viewer .buttons{
	clear: both;
}

.question-viewer .buttons .second{
	text-align: right;
}
/* END Questionnaire CSS */

/* ERF delivery schedule calculator */
   .interactiveCalculator {
   display:block;
   max-width:600px;
   margin:10px auto 40px;
   box-shadow:0px 4px 8px 4px rgba(0,0,0,0.3);
   border-radius:7px;
   }

   .interactiveCalculator .panel-heading{
     border-radius:7px 7px 0 0 !important;
   }

   .interactiveCalculator .panel-heading h2{
     font-size: x-large;
   }

   .interactiveCalculator .form-horizontal well {
     padding-top:0px;
     padding-bottom:0px;
   }

   #timelines {
     margin: 0;
     height: 600px;
   }

   .calcSummary h3, .calcSummary h4 {
     margin-top: 10px;
   }

   .interactiveCalculator .form-control-feedback{
     pointer-events: auto;
   }

   .alert h3 {
     margin-top: 0;
   }

   .form-horizontal .form-group{
     margin-left: 0px;
     margin-right: 0px;
   }

   #calculatorSummaryBox hr{
     width: 70%;
     margin: 5px auto 5px auto;
     border-top: 1px solid #DDDDDD !important;
   }

   #calculatorSummaryBox{
     page-break-after: always;
   }

   /* term lookup  */
   .interactiveCalculator .term-help{
     cursor: help;
     border-bottom: dotted 1px #A0A0A0;
   }

   .interactiveCalculator .term-help .glyphicon{
     color: #A0A0A0;
   }


   /* custom popovers */
   .popover.cer-popover h3{
     margin: 0;
     padding: 8px 14px;
     font-size: 14px;
     background-color: #f7f7f7;
     border-bottom: 1px solid #ebebeb;
     border-radius: 5px 5px 0 0;
     font-weight: bold;
   }

   .popover.cer-popover .popover-title{
     margin: 0;
     padding: 0;
     border: none;
   }

   .popover.cer-popover .popover-close-container{
     padding-left: 5px;
     padding-bottom: 5px;
     margin-right: -5px;
     margin-top: -5px;
   }

   .popover.cer-popover .popover-close{
     padding: 5px;
     border-radius: 5px 5px 5px 5px;
     cursor: pointer;
   }

   .popover.cer-popover .popover-close:hover{
     background-color: black;
     color: white;
   }

   /* SharePoint CSS fixes */

   .interactiveCalculator .label, #calculatorSummaryBox .label{
     float: inherit;
     word-wrap: normal;
   }
/* END ERF Delivery schedule calculator */

/* ******************************
NGER Schematic
2017-10-05
The CSS below is for the NGER schematic
********************************* */

.ngerSchematic {
  border-left: 15px solid;
  position: relative;
  padding-left: 15px;
  margin-bottom: 20px;
  width: calc(100% - 20px);
}

.ngerSchematic::after {
  content: "";
  position: absolute;
  left: -15px;
  bottom: 0;
  border-top: 8px solid;
  border-right: 8px solid;
  border-left: 8px solid white;
  border-bottom: 8px solid white;
  width: 15px;
  height: 15px;
}

.ngerSchematic ul li {
   list-style-type: none;
}

.ngerSchematic ul li::before {
   font-family: fontAwesome;
   content: "\f105";
   padding-right: 8px;
}

/* This can be removed if it starts to interfere - However, another container format may need to be used. */
.ngerSchematic .row > .row {
  margin: 0;
}

.ngerSchematic #accordian.row {
  margin-left: -15px;
  margin-right: -15px;
}

.ngerSchematic .title,
.ngerSchematic .subtitle {
  text-align: center;
  position: relative;
  margin-bottom: 8%;
  margin-left: -15px;
  padding-left: 5%;
  margin-right: -15px;
  padding-right: 5%;
}

.ngerSchematic .title h1,
.ngerSchematic .title h2,
.ngerSchematic .title h3,
.ngerSchematic .title h4,
.ngerSchematic .title h5,
.ngerSchematic .subtitle h1,
.ngerSchematic .subtitle h2,
.ngerSchematic .subtitle h3,
.ngerSchematic .subtitle h4,
.ngerSchematic .subtitle h5 {
   line-height: 1.5 !important;
}

.ngerSchematic .title {
  background-color: #dfe0de;
  padding-top: .5em;
}

.ngerSchematic .title::after {
   background-image: url(/PublishingImages/ngerSchematic-titleShadow.png);
   width: 100%;
   content: "";
   height: 60px;
   background-size: 100%;
   position: absolute;
   background-repeat: no-repeat;
   left: 0;
   top: 100%;
}

.ngerSchematic .subtitle::after {
   background-image: url(/PublishingImages/ngerSchematic-subtitleShadow.png);
   width: 100%;
   content: "";
   height: 60px;
   background-size: 100%;
   position: absolute;
   background-repeat: no-repeat;
   left: 0;
   top: 100%;
}

.ngerSchematic .subtitle h2 {
  margin-bottom: 10px;
  box-sizing: 100%;
  line-height: 1.2 !important;
}

.ngerSchematic .dark h1,
.ngerSchematic .dark h2,
.ngerSchematic .dark h3,
.ngerSchematic .dark h4,
.ngerSchematic .dark h5,
.ngerSchematic .medium h1,
.ngerSchematic .medium h2,
.ngerSchematic .medium h3,
.ngerSchematic .medium h4,
.ngerSchematic .medium h5,
.ngerSchematic .light h1,
.ngerSchematic .light h2,
.ngerSchematic .light h3,
.ngerSchematic .light h4,
.ngerSchematic .light h5{
  color: white !important;
}

.ngerSchematic .collapsed .colourBar h3::after {
  font-family: FontAwesome;
  content: "\f067";
  font-size: 22pt;
  color: inherit;
  position: absolute;
  right: 5px;
  top: 15px;
  transition: .5s;
  transform: rotate(0deg);
  z-index: 5;
}

.ngerSchematic .colourBar h3::after {
  font-family: FontAwesome;
  content: "\f067";
  font-size: 22pt;
  color: inherit;
  position: absolute;
  right: 15px;
  top: 15px;
  transition: .5s;
  transform: rotate(45deg);
  z-index: 5;
}

.ngerSchematic .colourBar {
  width: 100%;
  position: relative;
  padding-right: 65px;
  transition: .5s;
  z-index: 4;
  border-right: 0px solid white !important;
}

.ngerSchematic .colourBar::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -23.5px;
  width:50px;
  height:inherit;
  border-top: 25px solid;
  border-color: inherit;
  border-left: 25px solid transparent;
  border-right: 25px solid transparent;
  transition: .5s;
  z-index: 3;
}


.ngerSchematic .colourBar::before {
  content: "";
  position: absolute;
  right:-50px;
  top:0;
  width:50px;
  height:inherit;
  border-left: 0 solid;
  border-color: inherit;
  border-top: 25px solid transparent;
  border-bottom: 25px solid transparent;
  transition: .5s;
  z-index: 3;
}

.ngerSchematic .collapsed .colourBar {
  width: calc(100% - 5px);
  position: relative;
  padding-right: 35px;
  transition: .5s;
  z-index: 4;
  border-right: 25px solid white !important;
}

.ngerSchematic .collapsed .colourBar::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 2px;
  width:50px;
  height:inherit;
  border-top: 0 solid;
  border-color: inherit;
  border-left: 25px solid transparent;
  border-right: 25px solid transparent;
  transition: .5s;
  z-index: 3;
}


.ngerSchematic .collapsed .colourBar::before {
  content: "";
  position: absolute;
  right:-50px;
  top:0;
  width:50px;
  height:inherit;
  border-left: 25px solid;
  border-color: inherit;
  border-top: 25.5px solid transparent;
  border-bottom: 25.5px solid transparent;
  transition: .5s;
  z-index: 3;
}

.ngerSchematic .dark,
.ngerSchematic .medium,
.ngerSchematic .light {
  margin-top: 15px;
}

.ngerSchematic .light {
  background-color: #00a7d3;
  border-color: #00a7d3;
  color: white;
}

.ngerSchematic .medium {
  background-color: #005874;
  border-color: #005874;
  color: white;
}

.ngerSchematic .dark {
  background-color: #003d4c;
  border-color: #003d4c;
  color: white;
}

.ngerSchematic .textBox {
  width: calc(100% - 15px);
  box-shadow: 0 1px 4px rgba(0,0,0,0.3);
}

.ngerSchematic .textBox h4 {
  clear: both;
}

.ngerSchematic .textBox h4:nth-child(n+3) {
  border-top: 1px solid;
  padding-top: 20px;
}

.ngerSchematic .textBox .readMore {
  padding: 5px;
  border: 2px solid;
  text-decoration: none;
  float: right;
  margin-right: 0;
  margin-bottom: 10px;
  clear: right;
  transition: .1s;
}

/* Removed to fix issues with javascript applied iconography.
.ngerSchematic .textBox .readMore::after {
  font-family: FontAwesome;
  content: "\f08e";
  margin-left: 5px;
}
*/
.ngerSchematic .textBox .readMore:hover,
.ngerSchematic .textBox .readMore:active {
    background-color: #005874;
    border: 2px solid #005874;
    color: white !important;
    transition: .1s;
}

.ngerSchematic .textBox .readMore:visited {
   color: #63666a;
}

/* ******************************
Reduce list padding
2017-10-17
Reduce padding for lists in a specific edge case, where the content is also aligned to the top
********************************* */

.cer-table.align-top td {
   vertical-align: top;
}

.cer-table.align-top ul {
   padding-left: 20px;
}

/* ******************************
Detailed list view colour
2018-03-09
Styling to colour the columns and rows of the detailed list view page for registers
********************************* */

.cer-registerItem-table th{
	background-color: #E8EAE8;
	border: 1px solid white;
	padding: 10px !important;
}

.cer-registerItem-table tr td {
	border: 1px solid white;
	padding: 10px !important;
}

/* ******************************
LRET power station steps
Author: Scott
2018-04-26
Styling for the HTML replacement of the LRET steps image map.
********************************* */

.boxOfSteps {
    display: inline-block;
    width:calc(100% - 300px);
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}
@media (max-width: 518px) {
   .boxOfSteps {
       width: 100%;
   }
}
.boxOfSteps a {
    text-decoration: none !important;
}
.boxOfSteps .small {
   font-size: 11px;
}
.boxOfSteps> .row {
    background: #ededed;
    border-radius: 15px 15px 0 0;
}
.boxOfSteps .stepsHeading {
    text-align: center;
    font-size: 25px !important;
    font-family: Museosans700;
    background-color: #383a42;
    color: white;
    border-radius: 15px 15px 15px 0px;
    margin: 0 -15px;
    padding: 5px;
}
.boxOfSteps .stepBox {
    position: relative;
    background: white;
    border-radius: 10px 10px 10px 0px;
    margin: 10px -5px;
    padding: 10px 4px;
    transition: .07s ease-in-out;
    min-height: 100px;
    text-align: center;
}
/* 2018-07-10 || Added extra styling for non-stepped boxes. */
.boxOfSteps.fullWidth {
   display: block;
   width: 80%;
}
.boxOfSteps .infoBox {
    position: relative;
    background: white;
    border-radius: 10px 10px 10px 0px;
    margin: 10px -5px;
    padding: 10px;
    transition: .07s ease-in-out;
    height: auto;
    text-align: left;
}
.boxOfSteps h3 {
    color: #006884 !important;
}
.boxOfSteps .stepBox.active {
    background: #005874;
}
.boxOfSteps .stepBox.active * {
    color: white;
}
@media (max-width: 992px) {
    .boxOfSteps .stepBox {
      height: auto;
    }
}
@media (max-width: 768px) {
    /* Use the below selector if we want to move the anchor from the outside of the .stepBox, to inside it.
    .boxOfSteps :nth-child(1n) :nth-child(n+2):nth-last-child(n+2) :nth-child(1n)::after {
       Use the below selector if we want to move the anchor from the col-* to outside of the .stepBox.
   .boxOfSteps :nth-child(1n) :nth-child(n+2):nth-last-child(n+3) :nth-child(1n) > :nth-child(1n)::after {
   */
   /*
      .boxOfSteps .row [class^="col"]:nth-child(n+2):nth-last-child(n+3)::after {
   */
   .boxOfSteps .nextLine {
        content: "";
        position: absolute;
        left: 50%;
        top: 100%;
        z-index: 1;
        border-left: 2px solid black;
        height: 20px;
    }
    /* 2018-07-10 || Added extra styling for non-stepped boxes. */
    .boxOfSteps.fullWidth {
      width: 100%;
   }
}
.boxOfSteps a .stepBox:hover {
    background: #82C5D8;
}
.boxOfSteps a .stepBox:hover * {
    color: #072B31;
}
.boxOfSteps .stepBox * {
    font-size: 12px !important;
    line-height: 1.3 !important;
    color: rgb(56, 58, 66);
}
.boxOfSteps .stepBox strong {
    font-size: 14px;
    font-family: museosans500;
    margin: 4px 0 2px;
    display: inline-block;
    color: #006884;
}
