/**
 * Holds some variables various Bootstrap styles use
 */
/* For extrude */
/**
 * Simply replicating the framework default drop shadow
 */
.img-shadow, .img-frame, .list-item-description img {
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); }

/**
* This replaces the need to wrap a solitary image in div.frame.  Just add this class to the image.
* It provides the same look and feel to an image as the image component.
*/
.img-frame, .list-item-description img {
  padding: 0.35714286em;
  /* pulled from global stylesheet */
  background: white;
  border-radius: 4px; }

/**
 * Adding .frame-snug kills the width, as per: http://stackoverflow.com/questions/12747045/css-shrink-a-parent-div-to-fit-one-childs-width-and-constrain-the-width-of-th
 * Provides the ability to have a captioned image
 */
.frame.frame-snug.pull-right,
.frame.frame-snug.pull-left {
  display: table;
  width: auto; }

/**
 * -- Default override -- 
 * By default .image-shadow is a block level element.  This makes it wrap more nicely around the content
 */
.image-shadow {
  display: inline-block; }

/**
* These allow images to be floated left or right.  .img-top removes the top margin so it can be inline with the top of text
*/
.img-left {
  float: left;
  margin: 10px 10px 10px 0; }

.img-right {
  float: right;
  margin: 10px 0 10px 10px; }

.img-top {
  margin-top: 0; }

/**
 * Images from the news site being displayed in a teaser list
 * By default, the image is not styled and is inline.
 */
.list-item-description img {
  float: left;
  margin: 0 10px 10px 0; }

.list-item-description {
  overflow: auto; }

/**
 * Classes pulled from Bootstrap v4
 */
.w-100 {
  width: 100% !important; }

.w-50 {
  width: 50% !important; }

.m-x-auto {
  margin-right: auto !important;
  margin-left: auto !important; }

.m-a-0 {
  margin: 0 0 !important; }

.m-t-0 {
  margin-top: 0 !important; }

.m-r-0 {
  margin-right: 0 !important; }

.m-b-0 {
  margin-bottom: 0 !important; }

.m-l-0 {
  margin-left: 0 !important; }

.m-x-0 {
  margin-right: 0 !important;
  margin-left: 0 !important; }

.m-y-0 {
  margin-top: 0 !important;
  margin-bottom: 0 !important; }

.m-a-1 {
  margin: 1rem 1rem !important; }

.m-t-1 {
  margin-top: 1rem !important; }

.m-r-1 {
  margin-right: 1rem !important; }

.m-b-1 {
  margin-bottom: 1rem !important; }

.m-l-1 {
  margin-left: 1rem !important; }

.m-x-1 {
  margin-right: 1rem !important;
  margin-left: 1rem !important; }

.m-y-1 {
  margin-top: 1rem !important;
  margin-bottom: 1rem !important; }

.m-a-2 {
  margin: 1.5rem 1.5rem !important; }

.m-t-2 {
  margin-top: 1.5rem !important; }

.m-r-2 {
  margin-right: 1.5rem !important; }

.m-b-2 {
  margin-bottom: 1.5rem !important; }

.m-l-2 {
  margin-left: 1.5rem !important; }

.m-x-2 {
  margin-right: 1.5rem !important;
  margin-left: 1.5rem !important; }

.m-y-2 {
  margin-top: 1.5rem !important;
  margin-bottom: 1.5rem !important; }

.m-a-3 {
  margin: 3rem 3rem !important; }

.m-t-3 {
  margin-top: 3rem !important; }

.m-r-3 {
  margin-right: 3rem !important; }

.m-b-3 {
  margin-bottom: 3rem !important; }

.m-l-3 {
  margin-left: 3rem !important; }

.m-x-3 {
  margin-right: 3rem !important;
  margin-left: 3rem !important; }

.m-y-3 {
  margin-top: 3rem !important;
  margin-bottom: 3rem !important; }

.p-a-0 {
  padding: 0 0 !important; }

.p-t-0 {
  padding-top: 0 !important; }

.p-r-0 {
  padding-right: 0 !important; }

.p-b-0 {
  padding-bottom: 0 !important; }

.p-l-0 {
  padding-left: 0 !important; }

.p-x-0 {
  padding-right: 0 !important;
  padding-left: 0 !important; }

.p-y-0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important; }

.p-a-1 {
  padding: 1rem 1rem !important; }

.p-t-1 {
  padding-top: 1rem !important; }

.p-r-1 {
  padding-right: 1rem !important; }

.p-b-1 {
  padding-bottom: 1rem !important; }

.p-l-1 {
  padding-left: 1rem !important; }

.p-x-1 {
  padding-right: 1rem !important;
  padding-left: 1rem !important; }

.p-y-1 {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important; }

.p-a-2 {
  padding: 1.5rem 1.5rem !important; }

.p-t-2 {
  padding-top: 1.5rem !important; }

.p-r-2 {
  padding-right: 1.5rem !important; }

.p-b-2 {
  padding-bottom: 1.5rem !important; }

.p-l-2 {
  padding-left: 1.5rem !important; }

.p-x-2 {
  padding-right: 1.5rem !important;
  padding-left: 1.5rem !important; }

.p-y-2 {
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important; }

.p-a-3 {
  padding: 3rem 3rem !important; }

.p-t-3 {
  padding-top: 3rem !important; }

.p-r-3 {
  padding-right: 3rem !important; }

.p-b-3 {
  padding-bottom: 3rem !important; }

.p-l-3 {
  padding-left: 3rem !important; }

.p-x-3 {
  padding-right: 3rem !important;
  padding-left: 3rem !important; }

.p-y-3 {
  padding-top: 3rem !important;
  padding-bottom: 3rem !important; }

/**
 * This file contains the Bootstrap 2 offset rules
 */
.row-fluid .offset12 {
  margin-left: 105.12820512820512%;
  *margin-left: 105.02182214948171%; }

.row-fluid .offset12:first-child {
  margin-left: 102.56410256410257%;
  *margin-left: 102.45771958537915%; }

.row-fluid .offset11 {
  margin-left: 96.58119658119658%;
  *margin-left: 96.47481360247316%; }

.row-fluid .offset11:first-child {
  margin-left: 94.01709401709402%;
  *margin-left: 93.91071103837061%; }

.row-fluid .offset10 {
  margin-left: 88.03418803418803%;
  *margin-left: 87.92780505546462%; }

.row-fluid .offset10:first-child {
  margin-left: 85.47008547008548%;
  *margin-left: 85.36370249136206%; }

.row-fluid .offset9 {
  margin-left: 79.48717948717949%;
  *margin-left: 79.38079650845607%; }

.row-fluid .offset9:first-child {
  margin-left: 76.92307692307693%;
  *margin-left: 76.81669394435352%; }

.row-fluid .offset8 {
  margin-left: 70.94017094017094%;
  *margin-left: 70.83378796144753%; }

.row-fluid .offset8:first-child {
  margin-left: 68.37606837606839%;
  *margin-left: 68.26968539734497%; }

.row-fluid .offset7 {
  margin-left: 62.393162393162385%;
  *margin-left: 62.28677941443899%; }

.row-fluid .offset7:first-child {
  margin-left: 59.82905982905982%;
  *margin-left: 59.72267685033642%; }

.row-fluid .offset6 {
  margin-left: 53.84615384615384%;
  *margin-left: 53.739770867430444%; }

.row-fluid .offset6:first-child {
  margin-left: 51.28205128205128%;
  *margin-left: 51.175668303327875%; }

.row-fluid .offset5 {
  margin-left: 45.299145299145295%;
  *margin-left: 45.1927623204219%; }

.row-fluid .offset5:first-child {
  margin-left: 42.73504273504273%;
  *margin-left: 42.62865975631933%; }

.row-fluid .offset4 {
  margin-left: 36.75213675213675%;
  *margin-left: 36.645753773413354%; }

.row-fluid .offset4:first-child {
  margin-left: 34.18803418803419%;
  *margin-left: 34.081651209310785%; }

.row-fluid .offset3 {
  margin-left: 28.205128205128204%;
  *margin-left: 28.0987452264048%; }

.row-fluid .offset3:first-child {
  margin-left: 25.641025641025642%;
  *margin-left: 25.53464266230224%; }

.row-fluid .offset2 {
  margin-left: 19.65811965811966%;
  *margin-left: 19.551736679396257%; }

.row-fluid .offset2:first-child {
  margin-left: 17.094017094017094%;
  *margin-left: 16.98763411529369%; }

.row-fluid .offset1 {
  margin-left: 11.11111111111111%;
  *margin-left: 11.004728132387708%; }

.row-fluid .offset1:first-child {
  margin-left: 8.547008547008547%;
  *margin-left: 8.440625568285142%; }

/**
 * This file adds additional classes to .extrude - allowing for colouration and headers
 */
/**
 * -- Default override --
 * Default is 0.71......em
 */
.extrude {
  background: #fff;
  border: none;
  border-radius: 4px;
  box-shadow: 0 1px 4px rgba(30, 30, 30, 0.2);
  padding: 11px; }

/**
 * -- Default override --
 */
div.extrude p:last-child {
  margin-bottom: 0; }

/**
 * Used to provide a header section to an extrude.  Overridden by all the coloured extrudes
 */
.extrude-header {
  background: white;
  margin: -11px -11px 11px -11px;
  padding: 11px;
  border-radius: 4px 4px 0 0; }

/**
 * Used for drawing attention to an element, and denoting a positive result
 */
.extrude-success {
  background-color: #dff0d8;
  color: #3c763d; }
  .extrude-success .extrude-header {
    background: #d0e9c6; }

/**
 * Used for drawing attention to an element, and denoting supplemental information
 */
.extrude-info {
  background-color: #d9edf7;
  color: #2A6EBB; }
  .extrude-info .extrude-header {
    background: #bcdff1; }

/**
 * Used for drawing attention to an element, and denoting information the user needs to be mindful of
 */
.extrude-warning {
  background-color: #fcf8e3;
  color: #D4BA00; }
  .extrude-warning .extrude-header {
    background: #faf2cc; }

/**
 * Used for drawing attention to an element, and denoting an error, or information that would be hazardous to ignore.
 */
.extrude-danger {
  background-color: #f2dede;
  color: #983222; }
  .extrude-danger .extrude-header {
    background: #ebcccc; }

/**
 * Used to completely remove the title bar.  I don't believe this is ever used on it's own
 */
.sidebar .extrude.no-title-bar {
  padding-top: 0.5em; }
  .sidebar .extrude.no-title-bar .sidebar-title {
    display: none; }

/**
 * Default override.  Default line height site-wide is 1.65px, with a font size of 16px.  Font size in a sidebar is 0.85em though
 * but the line height isn't also shrunk.  This sets the line height a little smaller.
 */
.sidebar-content {
  line-height: 1.5em; }

/**
 * Used on an image inside the sidebar that shouldn't have a shadow, such as a logo
 */
.sidebar .extrude.no-inner-shadow a.image-shadow::before {
  box-shadow: none; }

/**
 * Used on an image in the sidebar that should have no visual styling, such as a logo
 */
.sidebar .extrude.raw-image {
  box-shadow: none;
  background: none; }
  .sidebar .extrude.raw-image .frame {
    background: none; }
  .sidebar .extrude.raw-image a.image-shadow::before {
    box-shadow: none; }
  .sidebar .extrude.raw-image img {
    width: 100%; }

/**
 * For sidebar elements that simply hold an image
 * All occurrences of this class should be replaced by simply using an image component.
 * 
 * -- Default override --
 * There are a bunch of funky styles that add extra padding
 */
.sidebar div.extrude.img-wrapper {
  padding: 0; }
  .sidebar div.extrude.img-wrapper .sidebar-content {
    padding: 0;
    margin: 0;
    line-height: 0; }
  .sidebar div.extrude.img-wrapper .frame {
    margin: 0;
    padding: 10px;
    border-radius: 4px; }

.alert-w-icon {
  display: flex; }
  .alert-w-icon [class^="icon-"], .alert-w-icon [class*=" icon-"] {
    padding-right: 0.5em;
    padding-top: 8px; }
  .alert-w-icon .fa-lg, .alert-w-icon .fa-2x {
    padding-top: 5px; }

/**
 * -- Default override --
 * Default is height of 1em, but since line height is > 1em, text gets cut off
 */
input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
  height: 30px; }

/**
 * -- Default override --
 * Help text gets placed right against a list box by default
 */
.scfListBox + .scfListBoxUsefulInfo {
  padding-top: 0.5em; }

.scfDropList + .scfDropListUsefulInfo {
  padding-top: 0.5em; }

/**
 * -- Default override --
 * By default the icon is partially outside the box.  This centers it.
 * Original rule is just .scfDatePickerGeneralPanel .ui-icon, .ui-icon-calendar was added
 * to increase specificity to override Default.css
 */
.scfDatePickerGeneralPanel .ui-icon.ui-icon-calendar {
  top: -32px;
  right: 5px; }

/**
 * -- Default override --
 * By default the checkboxes are really narrow. and floated left.  Any
 * help text that follows then gets put to the right - terrible usability.  This removes
 * the float and ensures the help text appears below
 */
div.scfCheckBoxListGeneralPanel {
  float: none;
  width: 90%; }

/**
 * -- Default override --
 * By default the label appears only 30% wide.  This isn't needed for
 * checkbox lists because the boxes appear below anyway.
 */
span.scfCheckBoxListLabel {
  width: 100%; }

.text-left {
  text-align: left; }

.text-right {
  text-align: right; }

.text-center {
  text-align: center; }

/**
 * Makes a blockquote actually look like a blockquote and not just indented text
 * Mimics BS4 styles
 */
.blockquote {
  padding: 0.5em 1em;
  margin-bottom: 1em;
  margin-left: 0;
  font-size: 1.25rem;
  border-left: 0.25rem solid #eceeef; }

/**
 * Makes the source of a blockquote styled.  Again, mimics BS4 styles
 */
.blockquote-footer {
  display: block;
  font-size: 80%;
  color: #818a91;
  margin: 0; }
  .blockquote-footer::before {
    content: "\2014 \00A0"; }

.text-danger {
  color: #983222; }

.text-success {
  color: #983222; }

.text-warning {
  color: #D4BA00; }

.text-info {
  color: #2A6EBB; }

/* Use in conjunction with .bg-* class for background and font colour */
.label {
  font-size: 14px;
  padding: 2px 4px;
  border-radius: 3px; }

code {
  padding: 2px 4px;
  background: white;
  border: 1px solid #e1e1e1;
  white-space: nowrap;
  border-radius: 3px; }

/**
 * -- Default override --
 * Default is 2.14... em - way too much
 */
.lead {
  line-height: 1.5em; }

/**
 * Used on the degree programs page to turn the majors into column-ed text
 */
.columns {
  -webkit-column-count: 3;
  -moz-column-count: 3;
  column-count: 3;
  -webkit-column-width: 30%;
  -moz-column-width: 30%;
  column-width: 30%; }
  @media (max-width: 689px) {
    .columns {
      -webkit-column-count: 2;
      -moz-column-count: 2;
      column-count: 2;
      -webkit-column-width: 50%;
      -moz-column-width: 50%;
      column-width: 50%; } }
  @media (max-width: 400px) {
    .columns {
      -webkit-column-count: 1;
      -moz-column-width: 1;
      column-width: 1;
      -webkit-column-width: 100%;
      -moz-column-width: 100%;
      column-width: 100%; } }

/**
 * -- Default override --
 * Default is larger - likely in anticipation of 1 line <li>.  Multiple line <li> looks way too spaced out though
 */
.sidebar ul {
  line-height: 21.5333px; }

/**
 * -- Default override --
 *
 * The initial tab is missing the left border
 *
 * Drop shadows and rounded corners can't be fixed because the parent element will clip them
 */
.nav-tabs {
  padding-left: 1px;
  margin-left: -1px; }

/**
 * Makes a button appear as wide as it's parent element.  I'm not aware of this actually being used anywhere anymore.
 */
a.btn-block,
button.btn-block {
  display: block; }

tr.success {
  background-color: #dff0d8; }

.table:not(.table-bordered):not(.extrude) tr th:first-child,
.table:not(.table-bordered):not(.extrude) tr td:first-child {
  padding-left: 0; }

.table-sm th, .table-sm td {
  padding: 4px; }

/**
 * The jru_map/map.js file adds marker labels to maps & assigns them this class
 */
.map_marker_label {
  position: absolute;
  background: white;
  background: rgba(255, 255, 255, 0.8);
  padding: 0 5px;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3); }

/**
 * These classes are used by the framework when creating a static image featured pane.
 * The styling mimics the styling visible when the carousel is used.
 */
.slide.image-caption-container {
  padding: .35714286em;
  background: #fff;
  border-radius: 4px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
  position: relative; }
  .slide.image-caption-container img {
    width: 100%; }
  .slide.image-caption-container h3 {
    margin: 0; }
  .slide.image-caption-container p:last-child {
    margin-bottom: 0; }
  .slide.image-caption-container .caption {
    padding: 0.9em;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 0 0 4px 4px; }

/**
 * Makes the text beside the profile image move below the image when the screen gets > 1200px
 */
.alumni-profile-card {
  clear: both; }
  .alumni-profile-card img {
    width: 150px;
    height: 200px; }
  @media (max-width: 1200px) {
    .alumni-profile-card h3 {
      clear: left; }
    .alumni-profile-card .btn {
      margin-bottom: 1rem; } }

@media (max-width: 1200px) {
  .alumni-profile-column h3 {
    clear: left; }
  .alumni-profile-column .btn {
    margin-bottom: 1rem; } }

/* This file contains the definitions for the timeline on the https://www.ualberta.ca/augustana/services/academic/resources/welcome page */
.timeline .entry {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  margin-bottom: 2em;
  /* Odd rows, content on left */
  /* Even rows, content on right */ }
  .timeline .entry date {
    font-size: 2em;
    width: 200px;
    order: 1;
    padding: 0 10px;
    text-align: center; }
    .timeline .entry date::after {
      border-bottom: 1px solid #999;
      content: '';
      display: block;
      margin-top: 10px;
      z-index: 0; }
  .timeline .entry div {
    flex: 1;
    z-index: 1;
    margin: 0;
    padding: 10px; }
    .timeline .entry div p:last-child {
      margin-bottom: 0; }
  .timeline .entry:nth-child(2n) date::after {
    transform: translateX(-50%); }
  .timeline .entry:nth-child(2n) div {
    order: 2; }
    .timeline .entry:nth-child(2n) div.happening {
      order: 0; }
  .timeline .entry:nth-child(2n + 1) date::after {
    transform: translateX(50%); }
  .timeline .entry:nth-child(2n + 1) div {
    order: 0; }
    .timeline .entry:nth-child(2n + 1) div.happening {
      order: 2; }
  .timeline .entry div.happening {
    background: white;
    border-radius: 5px; }
    .timeline .entry div.happening.sas {
      background: #DBEBDC; }

@media screen and (max-width: 1400px) {
  .entry div:not(.happening) {
    display: none; } }

@media screen and (max-width: 500px) {
  .timeline .entry {
    flex-direction: column; }
    .timeline .entry date {
      order: 0;
      text-align: left; }
      .timeline .entry date::after {
        visibility: hidden; }
    .timeline .entry div {
      order: 1; } }

/**
 * Used to create the nice little cards like on the Admissions page.
 *
 * Note the drop shadow & border radius is due to .extrude
 */
.card {
  padding: 0;
  margin-bottom: 25px; }
  .card .card-img {
    width: 100%;
    object-fit: cover;
    border-radius: 4px 4px 0 0;
    height: 200px; }
  .card .card-content {
    padding: 1rem; }
  .card .card-heading {
    font-family: 'Din Medium',sans-serif;
    margin-top: 0; }
  .card .card-btn {
    display: block;
    padding: 0.5rem 0.5rem 0.5rem 25px;
    background-color: #f4faf6;
    position: relative;
    border-radius: 0 0 4px 4px;
    border-top: 1px dotted #e0e4e0; }
    .card .card-btn:hover {
      background: #fff5b8;
      border-top: 1px dotted #e1d8a4;
      color: black;
      text-decoration: none; }
      .card .card-btn:hover:after {
        border-left: 0.35em solid black;
        left: 1em; }
    .card .card-btn:after {
      content: '';
      border: 0.35em solid transparent;
      border-left: 0.35em solid #007c41;
      left: 0.8333em;
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      transition: left 0.2s; }

/**
* Clears floated elements.
*/
.clear {
  clear: both; }

/**
 * Causes elements that have floated children, to expand to encompass the children
 */
.float-wrapper {
  overflow: auto; }

/**
 * -- Default override --
 * Default has 2.5em, which causes some items to wrap to more lines.  There is already a visual indicator, so the extra padding is superfluous
 */
/**
 * -- Default override --
 * Apparently there's a Default.css that removes all padding & margin from lists
 * but nothing adds it back.
 */
.second-column ul,
.sidebar ul, .second-column ol,
.sidebar ol {
  margin-left: 25px; }

iframe.borderless {
  border: none; }

/**
 * Contextual background colours
 */
.bg-success {
  color: white;
  background: #5cb85c; }

.bg-info {
  color: white;
  background: #5bc0de; }

.bg-danger {
  color: white;
  background: #d9534f; }

.bg-warning {
  color: white;
  background: #f0ad4e; }

/**
 * Default override
 * By default, ul.data-list in .second-column arbitrarily gets some left margin.  This removes that
 */
.second-column ul.data-list {
  margin-left: 0; }

/**
 * Enforces a 16:9 ratio to an element, so an iframe containing a video inside it
 * can be set to full size.
 *
 * Allows a video to be inline and still proportioned.
 */
.sixteen-nine {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 0px;
  height: 0; }
  .sixteen-nine iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

.navigation-container {
  border-bottom: 1px solid rgba(0, 0, 0, 0.15) !important; }

/*# sourceMappingURL=sitecore.css.map */