/** PLEASE COPY AND PASTE THIS INTO A FILE EVERY TIME BEFORE MAKING CHANGES. **/

/**
 * Images
 */
img {
  max-width: 100%;
}

/**
 * Links
*/
a, a:hover, a:focus,
.Product__AssociatedProductsList--below-the-fold>li>a,
.Product__AssociatedProductsList--below-the-fold>li>a:focus,
.btn-link, .btn-link:hover, .btn-link:active, .btn-link:focus {
  color: #600;
}

/**
 * Forms
*/
.Form__RadioWrapper input[type="radio"]:checked+span {
  color: #600;
}
/**
 * Buttons
 */

/** Maroon radio buttons **/
@supports (-webkit-mask-image: url("")) or (mask-image: url("")) {
  .Form__RadioOption--checked .Form__RadioLabel:before {
    -webkit-mask-image: url('https://msuextension.pdx.catalog.canvaslms.com/assets/filled-radio.svg');
    mask-image: url(/assets/filled-radio.svg);
    background: #600;
  }
}

/**
 * Skip Navigation
*/
#skip_navigation_link:focus {
  border-radius: .25rem;
  padding: .375rem .75rem;
  width: auto;
  height: auto;
  clip: auto !important;
  overflow: visible;
  text-decoration: none;
  color: #fffeff;
  background-color: #320000;
  top: 3px;
  left: 3px;
}

/**
* Header
*/
html {
  overflow-x: hidden; /* get rid of horizontal scrollbars on header */
}
#app-header {
  background-color: #600;
  padding: 0;
}
.header-branding h1 {
  margin: 0;
}

/** Carousel **/
.carousel-inner>.item>img, .carousel-inner>.item>a>img {
  width: 100%;
}

/** Sticky Header **/
.StickyHeader {
  padding-top: 1rem;
  padding-bottom: 1rem;
  min-height: auto;
}

/** User Nav **/
#user-nav > a {
  color: #fff;
}
.AccountDropdown--margin-top {
  margin-top:  0;
}
#user-nav {
  margin-top:  1.4rem; /* 20.16px */
}
#user-nav.dropdown { /* signed in */
  margin-top:  1rem; /* 14px */
}
.Dropdown__Toggle--header, .Dropdown__Toggle--header:hover, .Dropdown__Toggle--cog:hover, .Dropdown__Toggle--header:focus, .Dropdown__Toggle--cog:focus {
  color: #fff;
}
.Dropdown__Menu {
  background: #fff;
}

/** Header Nav **/
.header-nav {
  color: #fff;
  padding-top: 0;
}
.header-nav ul {
  margin-left: 0;
}
.header-nav li a {
  padding: 16px 15px;
}
@supports (width: 100vw) {
  #app-header .row > .col-xs-12:nth-child(3) {
    background: #222;
    width: 100vw;
    margin-left: -50vw;
    margin-right: -50vw;
    left: 50%;
    right: 50%;
    position: relative;
    clear: both;
  }
 @media (min-width: 1200px) {
  .header-nav {
    width: 1170px;
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
    float: none;
  }
 }
}
.header-nav > .navbar {
  margin-bottom: 0;
  min-height: auto;
  border: none;
}
@media (max-width: 991px) {
  /* Horizontal scroll the admin nav for small screens... */
  #app-header .row > .col-xs-12:nth-child(3) {
    overflow-x: auto;
  }
}

/** Search Form **/
#search-form.callout-region {
  background-color: #222;
}
/** Refine **/
@media (max-width: 575px) {
  #search-form .search-refine-button .search-refine-button__contents .search-refine-button__text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    border: 0;
  }
}


/**
 * Feature Region
 */
.feature-region {
  background: #440000;
  min-height: 0px;
}

/**
 * Content
*/
#main .container > h2 {
  padding-top: 2.2rem;
  padding-bottom: 2.2rem;
}
#main > .ember-view > .container {
  padding-bottom: 2rem;
}

/**
 * Products (Courses)
*/
#product-page #feature {
  padding-top: 0;
}
.product-flag-free {
  background-color: #008a14;
}
.ProductIcon__SmallCircle--course, .ProductIcon__LargeCircle--course {
  background: #600;
}
.product-results .product-tile:hover {
  box-shadow: inset 0 -5px 0 #600;
}
.product-tile .product-footer {
  color: #600;
}