@charset "utf-8";
/* Was margin-top:50px, which floated the week banner below a 50px band of the
   Blackboard page background. ESPT has no such offset and its banner meets the
   top of the frame; matched here. */
#globalNavPageContentArea {margin-top: 0;}
#pageTitleBar {width:100%; line-height:0px;}
/*=====Brett's starter stylings for Blackboard Courses=====
=======v.9========
=======To Do:=====
============develop table of contents after reorganizing==============
============remove any remaining redundancies=========================
============notate Blackboard UI items better, find ways to avoid=====
======================================================================*/

/*====double-check accessibility concerns - this may need to be=======
======targeted more accurately or simply removed======================
======================================================================*/
/* Removed: a:focus{outline:0!important;} stripped the focus ring from every link
   in the course. Focus styling lives in the Revamp additions at the end of this file. */

/*====vtbe is visual text based editor, or the TinyMCE editor that Blackboard employs=================
======these styles could be worked out in a typography section, perhaps ==============================
======targeting vtbe was just to avoid affecting typography outside of the content display ===========
======================================================================================================*/
.vtbegenerated {line-height: 1.4; font-size: 1.1em;}
.vtbegenerated p{margin-bottom: .5em;}
.contentListPlain>li {
	border-top-color: transparent;
}
.item {padding-bottom: 0px;}
.localViewToggle ul {box-shadow: none;}
.liItem:hover, .buildList>li:hover {
	background: white;
}
.noteditmode .listCm .courseMenu a:hover span, .noteditmode .listCm .courseMenu a:focus span {
	color: inherit!important;
}

/* ====Blackboard Learn 9.1 get rid of extra space above Page Title ====
======================================================================== */
.pageTitle {margin: 0px 0px !important}
.contentPane .shadow {border-top: none;}
.breadcrumbs {border:none!important;}

/*====may wish to remove and add this inline when needed - was thinking==============
======to add these sort of pieces to the basic framework to keep builders focused====
======on classes and not inline stylings, but not sure===============================
======how much this would be used - will consider more closely=======================
=====================================================================================*/
.pad {margin: 0px 25px 10px 25px;}
@media only screen and (max-width: 1200px){
.pad {float:none!important;}
}

/*====Announcements page =======
================================*/
.helphelp {display:none;} /*==double-check for any accessibility concerns in hiding these items==*/
.announcementInfo {display: none;}
.localViewToggle a.active {display:none;}
#announcementList .details {margin-right: 0px;}

/* ====Page Title styling =======
================================= */
#pageTitleDiv {
    display: block;
    padding: 10px 0px;
    text-align: center;
    font-family: arial;
    background: #4b367c!important;
    text-decoration: none;
    width: 100%;
    box-shadow: 0px 5px 12px -3px black;
}
#pageTitleDiv, #pageTitleDiv span {
    background: #4b367c;
    color: white!important;
    font-size: 45px;
}

/*====styling for ordered lists =========================
======future updates in CSS will hopefully negate these==
=========================================================*/
ol.upper-alpha {
    margin: 0 0 1.5em;
    padding: 0;
    position: relative;
}
ol.upper-alpha li {
    margin:0;
    padding: 0 0 20px 3em;
    list-style-type: none;
    list-style-position: outside;
    counter-increment: item;
    line-height: normal;
}
ol.upper-alpha > li:before {
    display: block;
    width: 1em;
    padding: .5em;
    color: white;
    margin-right: .75em;
    margin-top: -7px;
    text-align: center;
    font-weight: bold;
    content: counter(item, upper-alpha);
    border: solid 2px white;
    border-radius: 50%;
    position: absolute;
    left:0;
    line-height: 1;
    background-color: #E59400;
    box-shadow: 2px 2px 6px 0px black;
}
ol.numberme {
    margin: 0 0 1.5em;
    padding: 0;
    position: relative;
	counter-reset: item;
	list-style:none;
}
ol.numberme li.numbered {
    margin:0;
    padding: 0 0 20px 3em;
    list-style-position: outside;
    counter-increment: item;
    line-height: normal;
}
ol.numberme > li:before {
    display: block;
    width: 1em;
    padding: .5em;
    color: white;
    margin-right: .75em;
    margin-top: -7px;
    text-align: center;
    font-weight: bold;
    content: counter(item, decimal);
    border-radius: 50%;
    position: absolute;
    left:0;
    line-height: 1;
    background-color: #4b367c;
    box-shadow: 2px 2px 6px 0px black;

}

/*====border and hover effect for links ======
==============================================*/
.readingbutton {
	display:inline-block;
	font-size: 16px;
	padding: 15px;
	margin: 5px;
        border: solid 1px #4b367c;
        color: #4b367c;
        text-decoration: none!important;
	transition:all .5s ease;
}
.readingbutton:hover {
	background:#4b367c;
	color:white;
}

/*====use this with Javascript in equalHeight columns==
======to place button at bottom center of box =========
=======================================================*/
.readingbuttonbottom {
	display:inline-block;
	font-size: 16px;
	padding: 15px;
	margin: 5px;
	border: solid 1px #4b367c;
	color: #4b367c;
 	text-decoration: none!important;
	transition:all .5s ease;
	position:absolute;
	bottom: 5px;
	left: 50%;
	transform: translatex(-50%);
}
.readingbuttonbottom:hover {
	background:#4b367c;
	color:white;
}

/*===heading styles================
====================================*/
h5 {
    font-family: 'Linux Libertine','Georgia','Times',serif;
    font-size: 22px!important;
    margin-bottom: .25em!important;
    font-weight: normal!important;
    border-bottom: 1px solid #ccc;
    line-height: 1.4em;
}
h3, ul#content_listContainer h3 {
    width: 100%;
}
hr {
    margin-top: -1px!important;
    border: 1px solid #ccc;
}
.item_icon {
    display: none;
}
.contentList .item {
    padding-left: 0px;
}
#content_listContainer h3 {
    font-family: 'Linux Libertine','Georgia','Times',serif;
    font-size: 40px!important;
    margin-bottom: .25em!important;
    font-weight: normal!important;
    border-bottom: 1px solid #ccc;
    line-height: 1.4em;
}

/*====Clickable Item Titles like Discussion Boards or Course Links =======
==========================================================================*/
#content_listContainer h3 a span, #content_listContainer.contentList.staffInfoList h3 a {
    display: block;
    padding: 10px 10px 10px 35px;
    text-align: left;
    background: #4b367c;
    font-family: arial;
    font-size: 25px;
    font-weight: normal;
    color: white!important;
    text-decoration: none!important;
    transition: all .3s ease;
}
#content_listContainer h3 a span:hover, #content_listContainer.contentList.staffInfoList h3 a:hover {
    background: #33254f;
}
#content_listContainer h3 a span img.item-icon {
	margin: 0 .55rem 0 0;
}

/*====Flashing "next week" Banners=============
===============================================*/
span.bannernext {
    display: block;
    padding: 10px 0px;
    text-align: center;
    font-family: arial;
    font-size: 25px;
    font-weight: normal;
    background: #4b367c;
    color: white;
    text-decoration: none;
}
span.bannernext:hover {
    background-color: #4F3674;
    animation: none;
}
span.bannernext {
    animation:2s blinker linear infinite;
    -webkit-animation:2s blinker linear infinite;
    -moz-animation:2s blinker linear infinite;
    color: white;
    }

    @-moz-keyframes blinker {
     0% { opacity: 1.0; }
     25% { opacity: 0.5; }
     50% { opacity: 1.0; }
     }

    @-webkit-keyframes blinker {
     0% { opacity: 1.0; }
     25% { opacity: 0.5; }
     50% { opacity: 1.0; }
     }

    @keyframes blinker {
     0% { opacity: 1.0; }
     25% { opacity: 0.5; }
     50% { opacity: 1.0; }
}
/*==== this gets rid of the link icon on the flashing next banner =====
=======================================================================*/
img[title="linked item"] {display: none;}

/*==== Program Banner ===============
=====================================*/
#pageBanner {
	max-height: 400px;
        height:400px;
        display:block;
        position:relative;
}

#pageBanner img {
	width:100%;
	display:inline-block;
	position:absolute;
	left:0;
	top:50%;
	transform:translateY(-50%);
}

/* ==== Blockquote styling ===================
==============================================*/
blockquote {
    font-family: Georgia, serif;
    font-size: 18px;
    font-style: italic;
    max-width: 500px;
    margin: 0.25em 0;
    padding: 0.35em 40px;
    line-height: 1.45;
    position: relative;
    color: #383838;
}
blockquote:before {
    display: block;
    padding-left: 10px;
    content: "\201C";
    font-size: 80px;
    position: absolute;
    left: -20px;
    top: -20px;
    color: #4b367c;
}
blockquote cite {
    color: #999999;
    font-size: 14px;
    display: block;
    margin-top: 5px;
}
blockquote cite:before {
    content: "\2014 \2009";
}

/*====Submission/Objectives Box================
===============================================*/
.boxtwo {
    box-shadow: 0px 2px 12px 2px;
	border-radius: 4px 4px 4px 4px;
	background-color: rgba(248,248,248,0.8);
	position: relative;
	height: 100%;
	padding: 10px;
}
.boxtwo-title {
	background-color: #4b367c;
	font-size: 1.2em;
	color: white;
	border-radius: 3px 3px 0px 0px;
	padding: 5px 0 5px 10px;
	margin: -10px -10px 10px -10px;
}

/*====Grid =========================
==================================== */
.grid-container{
        width: 100%;
        max-width: 1900px;
	    box-sizing: border-box!important;
	    height: 100%;
    }
.grid-container:after{
    content:".";
    clear:both;
    display:block;
    visibility:hidden;
}

/*-- clearfix -- */
    .row:before,
    .row:after {
        content:".";
        clear:both;
	display: block;
	visibility: hidden;
	font-size: 5px;
    }
    [class*='col-'] {
	float: left;
        min-height: 1px;
        width: 16.66%;
        /*-- gutter -- */
        padding: 0px 12px 15px 12px;
	height: 100%;
	display: block;
	vertical-align: top;
    }

    .col-1{ width: 16.66%; box-sizing: border-box;}
    .col-2{ width: 33.33%; box-sizing: border-box;}
    .col-3{ width: 50%; box-sizing: border-box;}
    .col-4{ width: 66.66%; box-sizing: border-box;}
    .col-5{ width: 83.33%; box-sizing: border-box;}
    .col-6{ width: 100%; box-sizing: border-box;}
 @media all and (max-width:1000px){
        .col-1{ width: 33.33%; display: block;}
        .col-2{ width: 50%; display: block;}
        .col-3{ width: 100%; display: block;}
        .col-4{ width: 100%; display: block;}
        .col-5{ width: 100%; display: block;}
        .col-6{ width: 100%; display: block;}
        .row .col-5 ~ .col-1{
            width: 100%; display: block;
        }
    }
 @media all and (max-width:650px){
        .col-1{ width: 50%; display: block;}
        .col-2{ width: 100%; display: block;}
        .col-3{ width: 100%; display: block;}
        .col-4{ width: 100%; display: block;}
        .col-5{ width: 100%; display: block;}
        .col-6{ width: 100%; display: block;}
    }

/* ===="responsive" 16:9 iframes============
======= padding-bottom: 56.25% for 16:9=====
============================================*/
.iframefix {
	position: relative;
	height: 0;
	padding-bottom: 56.25%;
	overflow: hidden;
}
.iframefix::after {
	content:".";
	visibility: hidden;
}
/* .iframefix builds a fluid aspect-ratio box, but nothing made the iframe inside it
   fill that box. The Kaltura embed in week7 carried a fixed width="400" height="285"
   and so sat in the top-left corner of a much wider container. */
.iframefix > iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/*=====scroll-up button == clean up stylings===
===============================================*/
.scrolltool1 {
    display: inline-block;
    position: fixed;
    right:0px;
	bottom:-30px;
    color: #fff;
    font-size: 16px;
    text-decoration: none;
    z-index: 9999!important;
    outline: none;
    border: solid black;
    border-width: 0px 3px 3px 0px;
    padding: 10px;
    transition: all .3s ease;
}
.scrolltool1:after {
    content: "";
    display: block;
    position: absolute;
    height: 40px;
    background: rgba(0,0,0,.3);
    width: 40px;
    border-radius: 50%;
    z-index: -1;
    top: -5px;
    left: -5px;
    transition: all .3s ease;
}
.scrolltool1:hover {
	transform:rotate(-135deg) translateX(55px) scale(1.2) !important;
}

/* ==== modal-for use with javascript modal as in NFT ========
==============================================================*/
img[onclick="openModal(this)"]{
	cursor:pointer;
}
.overlays {
	position:relative;
	display: inline-block;
	text-align: center;
}
.overlays:before{
  position: absolute;
  content:"Click to Open Pop-Up";
  color: transparent;
  font-size: 20px;
  display: block;
  top:0;
  left:0;
  width:100%;
  height:100%;
  visibility: hidden;
  z-index:0;
  pointer-events:none;
  background-color: transparent;
  transition: all .2s ease-in-out;
  -webkit-transition: all .2s ease-in-out;
}
.overlays:hover:before{
	background-color:rgba(0,0,0,0.8)!important;
	visibility: visible;
	color: white;
}
#modal {
  opacity: 0;
  position: fixed;
  z-index: 999999;
  padding-top: 130px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,0.8);
 -webkit-transition: opacity 0.2s ease-in-out;
 -moz-transition: opacity 0.2s ease-in-out;
 -o-transition: opacity 0.2s ease-in-out;
}
#modal img {
	max-width: 60vw;
	margin: 0 auto;
	max-height: 60vh;
	width: auto;
	height: auto;
	transform: scale(1.5)
}
#modal.active {
	opacity: 1!important;
}
#captionModal {
	color: white;
	margin-top: 10px;
}
/*==== Modal Content ===========
================================*/
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  max-width: 90%;
  max-width: 1200px;
}

/*====Modal Close Button ========
=================================*/
.close {
  color: white;
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

/*====Expandable Box ===============
====================================*/
input.togglemeinput {
  display: none;
  visibility: hidden;
}
label.toggleme {
  display: inline-block;
  padding: 15px;
  font-size: 16px;
  text-align: left;
  border: 1px solid #4b367c;
  color: #4b367c;
  transition: all .3s ease;
}
label.toggleme:hover {
  color: white;
  background: #2f1a45;
}
label.toggleme::before {
  font-family: Consolas, monaco, monospace;
  font-weight: bold;
  font-size: 20px;
  content: "+";
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 3px;
}
#expand {
  height: 0;
  overflow: hidden;
  opacity:0;
  transition: all 0.5s ease;
}
#toggle:checked ~ #expand {
  height: auto;
  opacity:1;
}
#toggle:checked ~ label::before {
  content: "-";
}

/*====Table Style =========
===========================*/
.table-fill {
  background: white;
  border-radius:3px;
  border-collapse: collapse!important;
  margin-left: 10px;
  margin-bottom: 10px;
  padding:5px;
  width: 98%;
  box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.6);
  animation: float 5s infinite;
}
.table-fill th {
  color:#D5DDE5;;
  background:#1b1e24;
  border-bottom:4px solid #9ea7af;
  font-weight: 100!important;
  font-size: 1.3em;
  padding:10px;
  text-align:center;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  vertical-align:middle;
}
.table-fill th.column-alt {
	background: #777;
	border-bottom:1px solid #9ea7af;
	border-right: 4px solid #343a45;
	font-size: 16px;
	font-weight: normal!important;
}
.table-fill th:first-child {
  border-top-left-radius:3px;
}
.table-fill th:last-child {
  border-top-right-radius:3px;
  border-right:none;
}
.table-fill tr {
  border-top: 1px solid #C1C3D1;
  border-bottom: 1px solid #C1C3D1;
  color:#2f1a45;
  font-weight:normal;
  text-shadow: 0 1px 1px rgba(256, 256, 256, 0.1);
}
.table-fill tr:hover td {
  background:#4b367c!important;
  color:#FFFFFF;
  border-top: 1px solid #22262e;
}
.table-fill tr:first-child {
  border-top:none;
}
.table-fill tr:last-child {
  border-bottom:none;
}
.table-fill tr:nth-child(odd) td {
  background:#ddd;
}
.table-fill tr:nth-child(odd):hover td {
  background:#4b367c;
}
.table-fill tr:last-child td:first-child {
  border-bottom-left-radius:3px;
}
.table-fill tr:last-child td:last-child {
  border-bottom-right-radius:3px;
}
.table-fill td {
  background:#FFFFFF;
  padding:10px;
  text-align:left;
  vertical-align:top;
  font-weight:300;
  text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.1);
  border-right: 1px solid #C1C3D1;
}
.table-fill td:last-child {
  border-right: 0px;
}
.table-fill th.text-left {
  text-align: left;
}
.table-fill th.text-center {
  text-align: center;
}
.table-fill th.text-right {
  text-align: right;
}
.table-fill td.text-left {
  text-align: left;
}
.table-fill td.text-center {
  text-align: center;
}
.table-fill td.text-right {
  text-align: right;
}

/*====Drop caps======
=====================*/
p.dropsmall:first-child:first-letter {
  color: #4f3674;
  float: left;
  font-family: Georgia;
  font-size: 2.8em;
  line-height: 1em;
  padding-right: 5px;
  padding-left: 3px;
}
p.drop:first-child:first-letter {
  color: #4f3674;
  float: left;
  font-family: Georgia;
  font-size: 65px;
  line-height: 50px;
  padding-right: 5px;
  padding-left: 3px;
}

/*====Tabs=======
=================*/
.tab_container *,
.tab_container *:after,
.tab_container *:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.tab_container {
	width: 100%;
	margin: 0 auto;
	position: relative;
}
.tab_container input, .tab_container section {
  clear: both;
  padding-top: 10px;
  display:none;
}
.tab_container label {
  font-weight: 700;
  font-size: 18px;
  display: block;
  float: left;
  width: 20%;
  padding: 1.5em 0 1.5em 0;
  color: #757575;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  background: #ddd;
  transition: all .3s ease;
}
.tab_container label:hover {background:#4b367c; color: white;}
#tab1:checked ~ #content1,
#tab2:checked ~ #content2,
#tab3:checked ~ #content3,
#tab4:checked ~ #content4,
#tab5:checked ~ #content5 {
  display: block;
  padding: 20px;
  background: #fff;
  color: #000;
}
.tab_container .tab-content p,
.tab_container .tab-content h5,
.tab_container .tab-content li,
.tab_container .tab-content img {
  -webkit-animation: fadeInScale 0.5s ease-in-out;
  -moz-animation: fadeInScale 0.5s ease-in-out;
  animation: fadeInScale 0.5s ease-in-out;
}
.tab_container [id^="tab"]:checked + label {
  background: #fff;
  color:#757575;
  box-shadow: inset 0 8px #4b367c;
}
.tab_container [id^="tab"]:checked + label .fa {
  color: #4b367c;
}
.tab_container label .fa {
  font-size: 1.3em;
  margin: 0 0.4em 0 0;
}
@media only screen and (max-width: 930px) {
 .tab_container label span {
    font-size: 14px;
  }
}


/*====Print Button======
========================*/
button.prints-button {
  width: 100px;
  height: 100px;
}
p.prints-icon, p.prints-icon::before, p.prints-icon::after, button.prints-button:hover .prints-icon::after {
  border: solid 4px #333;
}
p.prints-icon::after {
  border-width: 2px;
}
button.prints-button {
  position: relative;
  padding: 0;
  border: 0;

  border: none;
  background: transparent;
}
p.prints-icon, p.prints-icon::before, p.prints-icon::after, button.prints-button:hover .prints-icon::after {
  box-sizing: border-box;
  background-color: #fff;
}
p.prints-icon {
  position: relative;
  display: inline-block;
  padding: 0;
  margin-top: 20%;
  width: 60%;
  height: 35%;
  background: #fff;
  border-radius: 20% 20% 0 0;
}
p.prints-icon::before {
  content: " ";
  position: absolute;
  bottom: 100%;
  left: 12%;
  right: 12%;
  height: 110%;

  transition: height .2s .15s;
}
p.prints-icon::after {
  content: " ";
  position: absolute;
  top: 55%;
  left: 12%;
  right: 12%;
  height: 0%;
  background: #fff;
  background-repeat: no-repeat;
  background-size: 70% 90%;
  background-position: center;
  background-image: linear-gradient(
    to top,
    #fff 0, #fff 14%,
    #333 14%, #333 28%,
    #fff 28%, #fff 42%,
    #333 42%, #333 56%,
    #fff 56%, #fff 70%,
    #333 70%, #333 84%,
    #fff 84%, #fff 100%
  );
  transition: height .2s, border-width 0s .2s, width 0s .2s;
}
button.prints-button:hover {
  cursor: pointer;
}
button.prints-button:hover .prints-icon::before {
  height:0px;
  transition: height .2s;
}
button.prints-button:hover .prints-icon::after {
  height:120%;
  transition: height .2s .15s, border-width 0s .16s;
}
button:focus {outline:0;}

.hamburger {
  z-index: 1500;
  cursor: pointer;
  z-index: 100;
  position: absolute;

  right: 0;
  padding: 25px;
  -webkit-transition: all 0.3s cubic-bezier(0.7, 0.01, 0.3, 1);
  -moz-transition: all 0.3s cubic-bezier(0.7, 0.01, 0.3, 1);
  -o-transition: all 0.3s cubic-bezier(0.7, 0.01, 0.3, 1);
  transition: all 0.3s cubic-bezier(0.7, 0.01, 0.3, 1);
	display:none;
}
.hamburger .patty {
  position: relative;
  width: 32px;
  height: 4px;
  margin: 10px 0;
  background: white;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}
.hamburger .patty:before,
.hamburger .patty:after {
  content: "";
  display: block;
  width: 32px;
  height: 4px;
  background: #fff;
  position: absolute;
  z-index: -1;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}
.hamburger .patty:before {
  top: -12px;
}
.hamburger .patty:after {
  top: 12px;
}
.hamburger.open .patty {
  height: 0;
}
.hamburger.open .patty:before,
.hamburger.open .patty:after {
  top: 0;
  background: white;
  -webkit-transition: all 0.3s cubic-bezier(0.7, 0.01, 0.3, 1);
  -moz-transition: all 0.3s cubic-bezier(0.7, 0.01, 0.3, 1);
  -o-transition: all 0.3s cubic-bezier(0.7, 0.01, 0.3, 1);
  transition: all 0.3s cubic-bezier(0.7, 0.01, 0.3, 1);
}
.hamburger.open .patty:before {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.hamburger.open .patty:after {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
@media screen and (max-width:767px){
	.hamburger {
		display:block;
	}
}

/*==================================================================================================
  Revamp additions
==================================================================================================*/

/*--- Item icons ----------------------------------------------------------------------------------
Replaces three animated GIFs (chatgif.gif 198KB, lightbulbgif2.gif 200KB, assignments.gif 64KB)
that were dropped inline into item titles with `align="left"` and a hardcoded white border. The
replacements are flat SVGs in assets/icons/. */
.item-icon {
    vertical-align: middle;
    width: 3.1rem;
    height: 3.1rem;
    margin-right: .55rem;
    flex: none;
}
/* On the purple title bar the icon is a plain white glyph with no disc behind it,
   matching how ESPT draws its section-title icons. The disc-backed variants are
   only for icons that sit in body copy on a white ground. */
.item-icon--onbar {
    width: 2.1rem;
    height: 2.1rem;
    margin-right: .75rem;
}
.item-icon--float {
    float: left;
    width: 3.6rem;
    height: 3.6rem;
    margin: 0 .9rem .5rem 0;
}
#content_listContainer h3 a span {
    display: flex;
    align-items: center;
    gap: .1rem;
}

/*--- Page title ----------------------------------------------------------------------------------
The title was a bare <span> after an orphaned </h1> whose opening tag the export had dropped, so no
page had a valid heading. Now a real <h1>; these rules re-apply the sizing that #pageTitleDiv span
used to carry, and clear the default heading margin that #pageTitleBar's line-height:0 would clip. */
#pageTitleDiv h1,
#pageTitleDiv h1#pageTitleText {
    background: transparent;
    color: #fff !important;
    font-size: clamp(1.8rem, 4vw, 2.6rem);
    font-weight: 400;
    line-height: 1.2;
    margin: 0;
}
#pageTitleBar { line-height: normal; }

/*--- Box titles ----------------------------------------------------------------------------------
These were <h1>, so a single page carried up to ten top-level headings and the document outline
said nothing. Demoted to <h2>; this keeps the visual weight they had. */
h2.boxtwo-title {
    font-size: 1.28rem;
    font-weight: 600;
    line-height: 1.3;
}

/*--- Keyboard focus ------------------------------------------------------------------------------
Nothing in the export drew a focus ring. */
#courseMenuPalette_contents a:focus,
.readingbutton:focus,
.readingbuttonbottom:focus,
#content_listContainer h3 a:focus {
    outline: 3px solid #d6a800;
    outline-offset: 2px;
}

/*--- Current week --------------------------------------------------------------------------------
The export had no current-page state, so all eight weeks looked identical. */
#courseMenuPalette_contents a[aria-current="page"] span {
    font-weight: 700;
    box-shadow: inset 3px 0 0 #d6a800;
    padding-left: 6px;
}

/*--- LMS-side placeholders -----------------------------------------------------------------------
Links with no href that still carried cursor:pointer and a target attribute, so they read as live
controls and did nothing. Marked aria-disabled and styled as unavailable. */
.readingbutton.is-lms-placeholder,
.readingbuttonbottom.is-lms-placeholder {
    background: transparent !important;
    color: #6b6b6b !important;
    border: 1px dashed #b3b3b3;
    cursor: not-allowed;
}
a.is-lms-placeholder { cursor: not-allowed; }
#content_listContainer h3 a.is-lms-placeholder span { cursor: not-allowed; }

/*--- Leadership diagrams -------------------------------------------------------------------------
Shared styling for the inlined Blake-Mouton grid and Full Range model. */
.leadership-figure { margin: 0; }
.leadership-figure svg { width: 100%; height: auto; display: block; }
.leadership-figure figcaption {
    font-size: .88rem;
    color: #5b5464;
    margin-top: .5rem;
    font-style: italic;
}
.lz-hit { cursor: pointer; }
.lz-hit:focus { outline: none; }
.lz-hit:focus-visible > rect:first-of-type,
.lz-hit:focus-visible > path:first-of-type { stroke: #d6a800; stroke-width: 6px; }

/*--- Weekly objectives ---------------------------------------------------------------------------
The course listed its topics but never stated what a student should be able to DO by the end of a
week. Each week now opens with measurable objectives instead; the topic list it replaced was a
table of contents that mostly restated the page below it. .boxtwo sets height:100% for the
equal-height columns, relaxed here so the box sizes to its own content. */
.boxtwo--stack {
    height: auto;
    margin-bottom: 22px;
}
.objectives-lead {
    font-style: italic;
    color: #4f4a58;
    margin: 0 0 .5em;
}
.boxtwo--stack ul { margin-bottom: 0; }