// TEXT STYLES /
h1, h2, h3, h4, h5, h6 {
font-weight: bold;
}
h3 {
color: black important!;
}
.alertbox {
border: 8px solid #D4281C;
padding: 2rem;
}
/ Display textbox headers in parts /
.part header.textbox__header {
display: block !important;
}
/fix weird bottom margin after images/
.wp-nocaption{
margin-bottom: 9px !important;
}
.part header {
display: none !important;
}
.alert {
margin: -0.5rem auto 0.75rem;
display: block;
width: 6rem;
height: 6rem;
border-radius: 50%;
background-color: #D4281C;
color: #FFF;
font-size: 5rem;
text-align: center;
line-height: 4rem;
font-weight: bold;
}
// PAGE STYLES //
header [data-type="author"] {
display: none !important;
}
/ Rounded Textbox /
.textbox, .textbox p, .bcc-box {
hyphens: none;
border-radius: 1.5em !important;
}
.textboxheader,.bcc-box > h3.title {
border-radius: 1.5em 1.5em 0 0 !important;
}
h2.textboxtitle, h3.textboxtitle, .textboxheader, .textboxheader h3, .textboxheader h4 {
margin: 0;
}
.textbox–learning-objectives .textboxheader::before,
.textbox–exercises .textboxheader::before,
.textbox–examples .textboxheader::before,
.textbox–key-takeaways .textboxheader::before {
content: "";
display: none; / default: block /
float: left;
background-size: 50px 50px !important;
width: 50px;
height: 50px;
margin: -10px 10px 0 0;
}
.textbox h3 {
margin-top: 0;
}
/ Learning Objectives Box /
.textbox–learning-objectives .textbox__header::before {
background: url("IMG_URL_HERE") no-repeat;
}
/ Question/Exercises Box /
.textbox–exercises .textbox__header::before {
background: url("IMG_URL_HERE") no-repeat;
}
/ Examples Box /
.textbox–examples .textbox__header::before {
background: url("IMG_URL_HERE") no-repeat;
}
/ Key Takeaways Box /
.textbox–key-takeaways .textbox__header::before {
background: url("IMG_URL_HERE") no-repeat;
}
/ No-Icon /
.textbox-no-icon::before {
display: none !important;
background: none !important;
}
/ Gallery container /
.gallery {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
grid-gap: 10px;
}
/ Image container /
.gallery-item {
position: relative;
overflow: hidden;
text-align: center;
margin-top: 1em;
}
/ Image /
.gallery-item img {
display: block;
width: 100%;
height: auto;
}
/ Image name /
.gallery-item .image-name {
width: 100%;
margin-top: 0.5em;
padding: 10px;
background-color: rgba(0, 0, 0, 1);
color: #fff;
font-size: 16px;
text-align: center;
}
/ Download links /
.gallery-item .download-links {
position: absolute;
top: 40%;
left: 50%;
transform: translate(-50%, -50%);
display: none;
}
.gallery-item .download-link {
display: block;
margin-bottom: 5px;
color: #FFF;
text-decoration: none;
font-size: 16px;
font-weight: bold;
background-color: #000;
padding: 5px 10px;
transition: background-color 0.3s ease;
}
/ Hover styles for download links /
.gallery-item .download-link:hover {
background-color: #FFF;
color: #000;
}
/ Show download links on hover /
.gallery-item:hover .download-links {
display: block;
}
.gallery-item .download-links br {
display: none;
}
/ Mani’s Customized Accordion /
details {
margin-bottom: -45px;
border-radius: 15px;
border: 1px solid #646469;
padding: 0px;
}
details > summary {
padding: 10px;
font-size: 1.25em;
text-indent: 30px;
background-color: #e2231a;
color: #fff;
border: none;
cursor: pointer;
border-radius: 10px 10px 10px 10px; }
details[open] > summary {
background-color: #e2231a;
color: #fff;
border-radius: 10px 10px 0 0;
}
.collapsed {
/border-radius: 10px;
border: 2px solid #646469;/
padding: 20px;
margin-bottom: 10px; }
/ # The Rotating Marker # /
details summary::marker {
display: none;
content: ""; }
summary::before {
content: "▶";
left: 0.1em;
position: absolute;
transform: rotate();
transform-origin: 70% 50%;
transition: 0.2s transform ease; }
details[open] > summary:before {
transform: rotate(90deg);
transform: ease 1s; }
/ # The Sliding Summary # /
@keyframes details-show {
from {
opacity: 0;
transform: var(–details-translate, translateY(-0.5em)); } }
details[open] > *:not(summary) {
animation: details-show 750ms ease-in-out; }
/ End of Accordion /
/ Wills accordion adjustments /
.accordion-profiles details {
margin-bottom: -20px;
border-radius: 15px;
border: 1px solid #646469;
padding: 0px;
}
.accordion-profiles details > summary {
padding: 10px;
font-size: 1.25em;
text-indent: 60px;
background-color: #e2231a;
color: #fff;
border: none;
cursor: pointer;
border-radius: 10px 10px 10px 10px; }
.accordion-profiles details[open] > summary {
background-color: #e2231a;
color: #fff;
border-radius: 10px 10px 0 0;
}
.accordion-profiles details > summary::before {
content: "▶";
left: 0.1em;
position: absolute;
transform: rotate();
transform-origin: 85% 45%;
transition: 0.2s transform ease; }
// OER STAFF LISTING //
.staff-listing-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.staff-listing {
display: flex;
flex-direction: column;
align-items: center;
margin: 10px;
width: 45%;
background-color: rgba(0,0,0,0.05);
border-radius: 25px;
padding: 1rem;
}
.staff-listing img {
width: 150px;
height: 150px;
object-fit: cover;
border-radius: 50%;
}
.staff-listing p {
margin: 5px;
}
.staff-details {
text-align: center;
}
.staff-name {
font-weight: bold;
font-size: 1.25rem;
margin-bottom: 5px;
}
.staff-position {
font-style: italic;
margin-bottom: 10px;
}
.staff-description {
margin-bottom: 10px;
}
.staff-contact {
font-size: 1rem;
}
/Table Vertical Cell/
.vertical-cell {
writing-mode: vertical-lr !important;
background-color: #5E5E5E;
color: white;
}
figure {
margin-bottom: 9px !important;
}
table li {
font-size: 0.9em !important;
font-weight: normal !important;
line-height: 1 !important;
}
table ul, ol {
margin-top: 1.5em !important;
}
/Team Roster/
.vertical-cell {
writing-mode: vertical-lr !important;
background-color: #5E5E5E;
color: white;
}
.vertical-cell-bottom-up {
writing-mode: vertical-rl !important;
transform: rotate(180deg) !important;
}
.team-roster-header {
background-color: #e2231a;
border: none !important;
color: white;
padding: 2em !important;
border-top-left-radius: 25px;
border-bottom-left-radius: 25px !important;
border-bottom: 6px solid white !important;
}
td.team-roster-cell {
background-color: #eeeeee;
border: none !important;
vertical-align: center;
border-bottom: 6px solid white !important;
padding: 1em;
}
td.team-roster-cell p.quote {
font-style: italic;
}
td.team-roster-cell p.quote:first-of-type:first-letter{
font-size: 28px;
font-weight: bold;
line-height: 0.2em;
}
.team-roster-cell :first-child {
border-top-left-radius: 0px !important;
}
td.team-roster-header p, td.team-roster-header span {
color: #fff !important;
}
td.team-roster-header h3, td.team-roster-header h5 {
font-weight: bold !important!;
font-size: 2em;
margin: 0 !important;
color: #fff !important;
}
th.team-roster-domain-header {
background-color: #5E5E5E;
border-top-left-radius: 25px !important;
border-top-right-radius: 25px !important;
}
.team-roster-domain-header h2 {
color: white !important;
font-weight: bold;
font-size: 2em;
margin: 0.5em;
}
/ End of Team Roster /
/ Table with alternating row colours /
table.alternating tr:nth-child(even){
background: #f5faff !important;
}
table.alternating tr td:first-child{
padding-left: 1em;
}
table.alternating tr:nth-child(odd){
background: #daeaf5 !important;
}table.alternating td {
padding-left: 1em;
}
table.alternating th {
background: #0b6396;
color: #fff;
padding-left: 1em;
}
// Landing Page Styles //
/ Book analytics button /
.book-header__description .call-to-action {
color: var(–header-color);
background-color: var(–header-bg);
text-decoration-line: none;
font-size: 1rem;
margin-top: 2rem;
display: table;
}
/ Book analytics button when hovered /
.book-header__description .call-to-action:hover {
background-color: var(–header-color);
color: var(–header-bg);
}