@font-face {
  font-family: "Apercu Pro";
  src: url(./fonts/apercu_light_pro.woff);
}

.clear {
  clear: both;
}

/* base template */

body {
  /*font-family: 	'Apercu Pro', arial;*/
  font-family: 	arial;
}

h2 {
  font-family: 	'Apercu Pro', arial;
}

.subtitle {
  font-family: 	'Apercu Pro', arial;
  font-size: 16px;
}


.row {
  margin: 0px -15px;
}
.row div[class^="col-"] {
  padding: 0 15px;
}

.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-15 {
    width: 20%;
    float: left;
}

@media (min-width: 768px) {
    .col-sm-15 {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
}


.dph-login-as {
  line-height: 50px;
  padding-right: 10px;
}

.dev-page .dev-page-header {
  z-index: 4;
  border: 0;
}

.dev-page .dev-page-container {
  top: 50px;
  padding-top: 0;
  background: #fff;
}
@media all and (max-width: 992px) {
  .dev-page .dev-page-container {
    top: 0px;
    padding-top: 0;
  }
}


.dev-page-footer {
  visibility: hidden;
}
.dev-page-footer .wrapper {
  padding: 0 30px;
}
@media all and (max-width: 992px) {
  .dev-page-footer .wrapper {
    padding: 0 15px;
  }
}
.dev-page-footer span {
  line-height: 40px;
}



/* login page */
.dev-page.dev-page-login .dev-page-login-block__logo {
  background: url('../img/USydLogo.svg') top center no-repeat;
  background-size: auto 100%;
}
.dev-page.dev-page-login .dev-page-login-block__form .form-group.remember label{
  font-weight: normal;
  color: #333;
  text-transform: none;
  font-size: 12px;
}
.dev-page.dev-page-login .dev-page-login-block__form .form-group{
  margin: 10px 0 0;
}
.dev-page.dev-page-login.dev-page-login-v2 .dev-page-login-block__form .form-group.has-error {
  border-color: #C9302C;
}


/**
* navigation
**/

.site-nav {
  background: #34495d;
  height: 50px;
}
.site-nav ul{
  list-style: none;
  padding: 0;
  margin: 0;
}
.site-nav ul li{
  list-style: none;
  float: left;
  padding: 18px 20px;
  font-size: 14px;
  color: #fff;
  height: 50px;
  letter-spacing: 2px;
  border-right: 1px solid #5C6F7E;
}
.site-nav ul li.active {
  background: #E13D22;
}
.site-nav ul li.cohort {
  padding: 10px 20px;
  background: #B13321;
  font-family: 'Apercu Pro', arial;
  font-size: 20px;
  letter-spacing: 0;
  border-right: none;
}
.site-nav ul li:first-child{
  padding: 10px 20px;
  font-size: 20px;
  width: 55px;
  text-align: center;
  border-right: none;
}
.site-nav ul li a{
  color: #fff;
}

/**
* index page
*/
.bg-gray .dev-page-container {
  background: #D9E1E9;
}

.section-summary h1{
  margin-bottom: 10px;
}

.section-summary .subtitle{
  margin-bottom: 2em;
}

.index-header {
  background: #AD3120;
  padding: 5px 50px;
  color: #fff;
  margin-bottom: 50px;
  letter-spacing: 2px;
}

.index-content {
  padding: 5px 50px;
}

.index-content .card-white {
  border-radius: 5px;
  padding: 15px 20px;
  color: #333;
  margin-bottom: 15px;
  font-size: 14px;
  font-weight: bold;
}

.index-content .card-white .fa-arrow-right {
  color: #E13D22;
}

/** dashboard page **/
.section-summary-wrapper {
  background: #E13D22;
}

.section-summary {
  padding: 50px 50px 20px;
  color: #fff;
}

.section-summary h1 {
  font-size: 3em;
  font-weight: bold;
  line-height: 1.1em;
}

.section-summary .details {
  text-align: center;
}

.section-summary .details > div > div:first-child{
  font-size: 50px;
  font-weight: bold;
}
.section-summary .details > div > div:first-child > span{
  font-size: 30px;
  position: relative;
  top: -14px;
  left: 2px;
}
.section-summary .details > div > div:nth-child(2){
  font-size: 10px;
  letter-spacing: 2px;
}

@media all and (min-width: 768px) and (max-width: 992px) {
  .section-summary .details > div {
    margin-bottom: 30px;
  }
  .section-summary .details > div > div:first-child{
    font-size: 30px;
  }
  .section-summary .details > div > div:first-child > span{
    font-size: 20px;
  }
}

@media all and (min-width: 992px) and (max-width: 1200px) {
  .section-summary .details > div > div:first-child{
    font-size: 30px;
  }
  .section-summary .details > div > div:first-child > span{
    font-size: 20px;
  }
}


.container .wrapper-gray{
  background: #D9E1E9;
}

.container .wrapper-gray.first{
  padding-top: 70px;
}

@media all and (min-width: 768px) {
  .container .wrapper-gray.hours{
    margin-bottom: 30px;
  }
}

.card-white {
  background: #fff;
  padding: 15px 20px 0px;
  -webkit-box-shadow: 8px 8px 1px -3px rgba(185,193,200,1);
  -moz-box-shadow: 8px 8px 1px -3px rgba(185,193,200,1);
  box-shadow: 8px 8px 1px -3px rgba(185,193,200,1);
  margin-bottom: 30px;
}






/** charts **/

div.dc-chart {
    float: none;
}

.dc-chart g.chart-body {
    clip-path: none;
}
.dc-chart g.chart-body {
    clip-path: none;
}
.dc-chart rect.stack-deselected {
    opacity: 0.2;
}

.dc-chart .axis text {
  font-size: 14px;
}

.section-callout {
  background: #E13D22;
  color: #fff;
}
.section-callout .col-sm-4 div:first-child{
  font-size: 40px;
  font-weight: bold;
}
.section-callout .col-sm-4 div:first-child > span {
	font-size: 25px;
	position: relative;
	top: -14px;
	left: 2px;
}

.section-callout .col-sm-4 div:nth-child(2) {
	font-size: 10px;
}

/** response normalized row chart **/

svg.normalized-row rect {
  cursor: pointer;
}
svg.normalized-row rect:hover {
  opacity: 0.5;
}
svg.normalized-row rect.inactive {
  fill: gray;
  opacity: 0.3;
}



/** row chart **/

.with-row-chart h2 {
  margin-bottom: 10px;
}

.chart-row {
  padding-bottom: 10px;
}

.chart-row .grid-line {
  display: none;
}

.chart-row g.row text{
  fill: #333;
  font-weight: bold;
  text-transform: uppercase;
  font-size: 14px;
}

.chart-row g.row rect.deselected{
  fill: gray;
  opacity: 0.5;
}

.chart-row g.row rect {
  fill-opacity: 1;
}
.chart-row g.row rect:hover {
  fill-opacity: 0.7;
}


/** pie chart **/
.d3-tip {
  z-index: 10;
  font-size: 16px;
  font-weight: normal;
}


.dc-chart .pie-slice {
  fill: #333;
}

.dc-chart .pie-label-group {
  /*display: none;*/
  visibility: hidden;
}

.dc-chart .selected circle, .dc-chart .selected path {
  stroke-width: 0;
}

.pie-legend {
  padding: 30px 0 50px;
}
.pie-legend .legends {
  padding: 7px 15px;
  border-radius: 16px;
  display: inline-block;
  color: #fff;
  font-size: 11px;
  font-weight: bold;
  cursor: pointer;
  margin-bottom: 10px;
}
.pie-legend .legends:hover {
  opacity: 0.8;
}
.pie-legend .legends:nth-child(2) {
  float: right;
}
@media all and (min-width:768px) {
  .pie-legend .legends {
    width: 120px;
  }
}

.pie-legend .legends span {
  float: right;
}
.pie-legend .legends.inactive {
  background: #A4AFB6 ! important;
}
.pie-legend .legends.active {
  -webkit-box-shadow: 0px 2px 2px 1px rgba(135,143,150,1);
  -moz-box-shadow: 0px 2px 2px 1px rgba(135,143,150,1);
  box-shadow: 0px 2px 2px 1px rgba(135,143,150,1);
}


/** tag chart **/

.wrapper-gray.first h2 {
  margin: 0 0 0 0;
}

.wrapper-gray.first .heading-help {
  margin-bottom: 15px;
}

.card-white.red-border {
  border-left: 10px solid #E23D22;
  padding-bottom: 15px;
}

.card-white.red-border h2 a{
  display: block;
  color: #333;
  text-decoration: none;
  cursor: pointer;
}

.sign-minus,
.sign-plus {
  float:right;
  font-size: 30px;
  border: 1px solid #E23D22;
  color: #E23D22;
  border-radius: 15px;
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 23px;
}

.sign-plus{
  display: none;
}

.sign-minus{
  color: #ffffff;
  background: #E23D22;
}

a.collapsed .sign-minus{
  display: none;
}

a.collapsed .sign-plus{
  display: inline-block;
}



.chart-tag {
  padding-bottom: 15px;
}
.chart-tag .tag {
  display: inline-block;
  padding: 3px 3px 3px 10px;
  border-radius: 18px;
  border: 1px solid #2E4052;
  margin: 0 8px 8px 0;
  color: #2E4052;
  font-weight: bold;
  cursor: pointer;
}
.chart-tag .tag.active {
  background: #2E4052;
  color: #ffffff;
  -webkit-box-shadow: 0px 2px 2px 1px rgba(135,143,150,1);
  -moz-box-shadow: 0px 2px 2px 1px rgba(135,143,150,1);
  box-shadow: 0px 2px 2px 1px rgba(135,143,150,1);
}
.chart-tag .tag.disabled {
  opacity: 0.3;
  cursor: default;
}
.chart-tag .tag span {
  display: inline-block;
  padding: 3px 10px;
  border: 1px solid #E23D22;
  border-radius: 13px;
  margin-left: 10px;
  color: #E23D22;
}
.chart-tag .tag.active span {
  background: #E23D22;
  color: #ffffff;
}

.chart-tag.center{
  width: 80%;
  margin: 0 auto;
  text-align: center;
}

/** Answers **/

.section-question p {
  font-size: 14px;
  margin-bottom: 2em;
}

.section-question h2 {
  margin: 15px 0 0 0;
}

.question-heading {
  font-size: 26px;
  font-weight: bold;
  color: #000;
}

.heading-help {
  font-size: 11px;
  font-style: italic;
  color: #E23D22;
}

.question-title {
  font-weight: bold;
  font-size: 14px;
  color: #E23D22;
}

.section-question .col > .row > .col-sm-6 {
  padding-left: 45px;
}


/** wrapper reset **/

.wrapper-reset {
  background: #2D4053;
  height: 50px;
  position: fixed;
  bottom: 0px;
  width: 100%;
  min-width: 768px;
  color: #fff;
  overflow-x: scroll;
}

.wrapper-reset .content{
  padding: 15px 30px;
}

.wrapper-reset.active {
  background: #E23D22;
}

.dc-data-count-b.dc-chart {
  float: none;
  text-align: center;
  font-size: 14px;
  margin-top: 0;
  margin-left: 10px;
  margin-right: 10px;
}

.dc-data-count-b.dc-chart a {
  display: inline-block;
  margin-left: 5px;
  padding: 5px 10px;
  text-transform: uppercase;
  color: #fff;
  font-size: 10px;
  line-height: 18px;
  letter-spacing:1px;
  background: #2D4053;
  border-radius: 15px;
}
.dc-data-count-b.dc-chart a:hover {
  text-decoration: none;
  background: #566675;
}

.wrapper-reset.active .dc-data-count-b.dc-chart{
  float: right;
}

.wrapper-reset .btn-filter-save,
.wrapper-reset .btn-filter-compare,
.wrapper-reset.active .btn-filter-compare-toolkit{
  display: none;
}

.wrapper-reset.active .btn-filter-save,
.wrapper-reset.active .btn-filter-compare {
  display: inline;
}


a.btn-filter {
  background: #E13D22;
  color: #fff;
  letter-spacing: 2px;
  border-radius: 15px;
  padding: 5px 10px;
  font-size: 9px;
  text-decoration: none;
  cursor: pointer;
}

.wrapper-reset.active a.btn-filter {
  background: #2D4053;
}

@media all and (min-width: 768px) {
  .wrapper-reset {
    height: 80px;
  }
  .wrapper-reset .content{
    padding: 25px 30px;
  }
  .dc-data-count.dc-chart  {
    font-size: 16px;
  }
  .dc-data-count.dc-chart a {
    margin-left: 15px;
    padding: 5px 20px;
    font-size: 12px;
    letter-spacing:2px;
    border-radius: 20px;
  }
  a.btn-filter {
    font-size: 12px;
  }
}

/** wrapper reset2 **/

.wrapper-reset2 {
  display: none;
}
.compare-mode .wrapper-reset2 {
  display: block;
}

.wrapper-reset2 {
  text-align: center;
  font-size: 16px;
}

.wrapper-reset2 .col:first-child {
  padding: 0 0 0 30px;
  height: 100%;
}

.wrapper-reset2 .col:nth-child(2) {
  padding: 0 30px 0 0;
  height: 100%;
}

.wrapper-reset2 .col > div {
  height: 100%;
}

.wrapper-reset2 a.btn-filter {
  font-size: 20px;
}

.wrapper-reset2 .dark-shadow{
  background: #AD3120;
  box-shadow: inset 0 50px 20px -15px hsla(0,0%,0%,.25);
}

.wrapper-reset2 .dark{
  background: #AD3120;
}

.wrapper-reset2 .content {
  padding: 30px 0 0 0;
}

.wrapper-reset2 .col-sm-4.dark-shadow .content {
  padding: 20px 0 0 0;
}

.wrapper-reset2 .preset-name {
  font-weight: bold;
}

.wrapper-reset2 .dc-data-count-s {
  font-size: 12px;
}

.wrapper-reset2 a.btn-filter.btn-filter-close {
  font-size: 14px;
}


/** MODAL **/


.modal .modal-backdrop.in {
  opacity: 0.7;
  background-color: #2D4053;
}

.modal .modal-content{
  background: #DCE1E8;
  border-radius: 0;
  font-size: 14px;
  -webkit-box-shadow: 0px 0px 1px 3px rgba(0,0,0,0.2);
  -moz-box-shadow: 0px 0px 1px 3px rgba(0,0,0,0.2);
  box-shadow: 0px 0px 1px 3px rgba(0,0,0,0.2);
}

.modal .modal-content .modal-header{
  border: 0;
}

.modal .modal-content .close {
  right: 15px;
  top: 10px;
  background: #E13D22;
  border: 0;
  -webkit-box-shadow: 0px 1px 1px 1px rgba(0,0,0,0.3);
  -moz-box-shadow: 0px 1px 1px 1px rgba(0,0,0,0.3);
  box-shadow: 0px 1px 1px 1px rgba(0,0,0,0.3);
}

.modal .modal-content .modal-footer{
  border: 0;
  text-align: center;
}

.modal .modal-content .modal-footer button{
  font-size: 10px;
  letter-spacing: 2px;
  border-radius: 15px;
  padding: 2px 10px;
  text-decoration: none;
  margin-bottom: 0;
}

.modal-content .form-group .text-danger{
  display: none;
}

.modal-content .form-group.has-error .text-danger{
  display: inline;
}

.modal-content .form-group input[type=text]{
  -webkit-box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.2);
  -moz-box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.2);
  box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.2);
}

.modal .modal-content .card-white {
  position: relative;
  margin-bottom: 5px;
  padding: 10px;
  border-radius: 5px;
  -webkit-box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.2);
  -moz-box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.2);
  box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.2);
  cursor: pointer;
}

.modal .modal-content .card-white input[type=text]{
  width: 400px;
}

.modal .modal-content .card-white .fa-edit {
  position: absolute;
  right: 40px;
  top: 12px;
  color: #333;
}

.modal .modal-content .card-white .fa-trash {
  position: absolute;
  right: 15px;
  top: 10px;
  color: #E13D22;
}


/**
* compare
*/
.lhs {
  width: 100%;
  float: left;
}

.lhs.active {
  width: 50%;
  -webkit-animation: narrow-down .3s;
  -moz-animation: narrow-down .3s;
}

@-webkit-keyframes narrow-down {
      0% { width: 100%; }
    100% { width: 50%; }
}
@-moz-keyframes narrow-down {
      0% { width: 100%; }
    100% { width: 50%; }
}

.rhs {
  width: 50%;
  float: left;
  display: none;
  box-shadow: -5px 0 5px -5px #333;
}

.rhs.active {
  display: block;
  -webkit-animation: slide-in .3s ease-out;
  -moz-animation: slide-in .3s ease-out;
}

@-webkit-keyframes slide-in {
      0% { opacity: 1; -webkit-transform: translateX(-100%); }
    100% { opacity: 1; -webkit-transform: translateX(0); }
}
@-moz-keyframes slide-in {
      0% { opacity: 1; -moz-transform: translateX(-100%); }
    100% { opacity: 1; -moz-transform: translateX(0); }
}


/** compare-mode **/


.col-container {
    clear: both;
    width: 100%;
}

.col-container:after {
  content: "";
  display: table;
  clear: both;
}

.col-container.grey {
  background: #D9E1E9;
}

.col {
  padding: 30px;
}

.compare-mode .col{
  /*width: 50%;*/
  float: left;
}

.compare-mode .col-container .col:first-child {
  box-shadow: inset -10px 0 5px -5px hsla(0,0%,0%,.25);
}

.col:nth-child(2) {
  width: 50%;
  display: none;
}

.compare-mode .col:nth-child(2) {
  /*display: block;*/
}

.modified-l,
.modified-r {
  display: none;
}

.section-preset .modified-l,
.section-preset .modified-r{
  position: absolute;
  top: 10px;
  right: 10px;
  font-weight: bold;
  font-size: 14px;
}

/** preset **/

.section-preset {
  display: none;
}

.compare-mode .section-preset{
    /*display: block;*/
}

.section-preset h2 {
  font-family: arial;
  font-size: 30px;
  font-weight: bold;
  margin-bottom: 15px;
}

.section-preset .col{
  text-align: center;
  padding-bottom: 0;
  position: relative;
}

.section-preset .btn-filter-holder {
  margin: 10px 0;
}

.section-preset .btn-filter-holder .btn-filter{
  background: #2D4053;
  margin: 0 5px;
  font-size: 10px;
  width: 100px;
  text-align: center;
  display: inline-block;
}

.section-preset .btn-filter-holder .btn-filter span{
  font-size: 12px;
}

.section-preset .dc-data-count {
  font-size: 14px;
  font-weight: bold;
}


/** charts **/

.section-chart {
  display: block;
}
.section-chart .col{
  padding-bottom: 0;
}

@media all and (min-width: 768px) {
  .compare-mode .section-chart .col-md-3{
    width: 50%;
  }
  .compare-mode .section-chart .col-md-6{
    width: 100%;
  }
}


/** survey question **/

.compare-mode .section-question .col-sm-6{
  width: 100%;
}

.compare-mode .section-question .col:nth-child(2) .col-sm-6:first-child,
.compare-mode .section-question .col:nth-child(2) .col-sm-12{
  visibility: hidden;
}

.compare-mode .section-question .col-sm-6 .question-title{
  margin-top: 10px;
}
.compare-mode .section-question .col-sm-6 p{
  margin-bottom: 10px;
}


/** hours **/

.compare-mode .section-hour .col-sm-6{
  width: 100%;
}


/** compare toolkit **/

.compare-wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;

  display: flex;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;

  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.compare-wrapper .compare-col{
  width: 50%;
  padding: 0;
}

.compare-wrapper .compare-col:first-child,
.compare-wrapper .compare-col:first-child .section-summary-wrapper > .section-summary,
.compare-wrapper .compare-col:first-child .section-chart > .col,
.compare-wrapper .compare-col:first-child .section-tag > .col,
.compare-wrapper .compare-col:first-child .section-hour > .col{
  box-shadow: inset -10px 0 5px -5px hsla(0,0%,0%,.25);
}

.compare-col .wrapper-reset {
  width: 50%;
}

.compare-col .wrapper-reset .btn-filter-compare-toolkit,
.compare-col .wrapper-reset .btn-filter-compare,
.compare-col .wrapper-reset .btn-filter-export {
  display: none;
}

@media all and (min-width: 768px) {
  .compare-wrapper .section-summary .col-md-15 {
    width: 50%;
  }
  .compare-wrapper .section-chart .col-md-3{
    width: 50%;
  }
  .compare-wrapper .section-chart .col-md-6{
    width: 100%;
  }
}

.compare-col .sortable .row {
  cursor: move;
}