/* Fixes column width issue with logo and login/account dropdown  */
.col-xs-12 {
    width: 100%;
    margin: 0 auto;
    float: none;
}

@media (min-width: 768px) {
    .col-xs-12 {
        width: 50%;
        float: left;
    }
    
}

.col-xs-12#header-menu {
    padding-left: 0;
}

/* Changes all body copy to brand body font */
body {
    font-family: sans-serif;
}

/* Creates the top red bar */
.top-nav {
    background: #d00d2c;
}

.top-nav .container  {
  padding-left: 15px;
  padding-right: 15px;
}

.top-bar-left ul, .top-bar-right ul {
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.top-bar-left li a, .top-bar-right li a {
    line-height: 1;
    text-decoration: none;
    display: block;
    padding: 1rem 1rem;
  color: white;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
}

.top-bar-left li a:hover, .top-bar-right li a:hover {
    color: #d00d2c;
    background-color: #ffffff;
    text-decoration: none;
}

.top-bar-right {
float: right;
}

.top-bar-left {
float: left;
}

/* Removes padding above top nav */
#app-header {
  padding-top: 0;
   padding: 0 0 8px;
}

@media (min-width: 768px) {
#app-header {
    padding: 0 0 20px;
}
}

/* Creates the bottom header gradient */
#app-header:after {
    content: "";
    height: 5px;
    width: 100%;
    position: absolute;
    top: 248px;
    background: #b19844;
    background: linear-gradient(90deg,#b19844 0,#97a05c 33%,#6fac7f 64%,#17c7d0);
}

@media (min-width: 768px) {
#app-header:after {
    top: 158px;
}
}

.row {
    margin-left: -15px;
    margin-right: -15px;
    margin: 0 auto;
}

@media (min-width: 768px) {
.row {
    margin-left: -15px;
    margin-right: -15px;
}
}

/* centering logo on mobile*/
.header-branding {
float: none;
}

/* left aligning logo at tablet*/
@media (min-width: 768px) {
.header-branding {
float: left;
}
}

/* Adjusts height of logo - Mobile */
.header-branding h1 a img {
    height: 100%;
}

/* Adjusts top and bottom margin around logo - Mobile */
h1.logo-customized {
    margin-bottom: 8px;
    margin-top: 20px;
    text-align: center;
}

/* aligning logo at tablet*/
@media (min-width: 768px) {
h1.logo-customized {
    margin-left: 0;
margin-bottom: 16px;
margin-top: 21%;
}
}


/* Optically aligns the Account dropdown to the center of the navigation */
#header-menu {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    display: block;
}
@media (min-width: 768px) {
    #header-menu {
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        display: flex;
    }
}
.AccountDropdown--margin-top {
    margin: 20px auto;
    padding-right: 0;
    float: none;

}

@media (min-width: 768px) {
    .AccountDropdown--margin-top {
        margin-top: 40px;
    padding-right: 27px;
    float: right;
    }
}

.Dropdown__Wrapper.dropdown.pull-right {
    margin-top: 1rem!important;
}

@media (min-width: 768px) {
.Dropdown__Wrapper.dropdown.pull-right {
    margin-top: -5px!important;
}
}

/* Corrects the link color for LOGIN - note this is not after logged in Account */
a, .Product__AssociatedProductsList--below-the-fold>li>a {
    color: #d00d2c;
}

/* Corrects the link color hover state for LOGIN - note this is not after logged in Account */
a:hover, .Product__AssociatedProductsList--below-the-fold>li>a:hover, a:focus, .Product__AssociatedProductsList--below-the-fold>li>a:focus {
   color: #40040e;
}

/* Optically aligns the Account dropdown */
.Dropdown__Wrapper.dropdown.pull-right {
  margin-top: -5px;
}

/* Corrects the link color for ACCOUNT - note this is not for LOGIN */
.btn-link {
  color: #d00d2c;
}

/* Corrects the link color hover for ACCOUNT - note this is not for LOGIN */
.Dropdown__Toggle--header:hover, .Dropdown__Toggle--cog:hover, .Dropdown__Toggle--header:focus, .Dropdown__Toggle--cog:focus {
    color: #40040e;
}

/* Removes rounded corners from dropdown */
.dropdown-menu {
  border-radius: 0;
}

/* Places background image - note: this image needs to be housed and published somewhere - currently this is in ITS Sitecore Media Library*/
.bg-image {
  background: grey no-repeat center center; 
  background-image: url('https://nebraska.edu/-/media/projects/ITS/Images/canvas-catalog/canvas-catalog-hero.jpg');
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 13rem;
}

/* Styles for the heading container  */
.hero-text {
  padding-top: 10%;
}

/* Font styles for the heading */
.hero-text h1 {
  font-family:  sans-serif;
  font-size: 2.5rem;
  color: white;
  font-weight: 700;
}

/* Underline style for the heading */
.hero-text h1 span {
    border-bottom: 4.5px solid #ffffff;
}

/* Adds red background to search bar/filter bar */
#search-form.callout-region {
   background-color: #d00d2c;
}

/* Removes rounded corners on search box */
#search-form .search-box {
  border-radius: 0;
}

/* Modify the search box submit icon*/
.search-form .search-submit {
color: #282728;
}

/* Font styles for search/filter text */
#search-form .search-refine-button .search-refine-button__contents .search-refine-button__text {
    font-family: sans-serif;
    font-weight: 500;
    font-size: 1.25rem;
}

/* Added underline to search/filter on hover */
.btn:hover, .btn:focus {
    text-decoration: underline;
}

/* Search form field focus state */
.form-control:focus {
    outline: none;
   border: 1px solid #6ecb98;
    background-color: #fefefe;
    box-shadow: 0 0 5px #cacaca;
    transition: box-shadow .5s,border-color .25s ease-in-out;
}

/* Removes rounded corners on filter buttons */
#search-form .search-categories ul {
  border-radius: 0;
}

/* Removes rounded corners on filter buttons */
.btn-lg, .btn-group-lg>.btn {
  border-radius: 0;
}

/* Changes background color to brand black on filter buttons */
#search-form .search-refine .btn-enabled {
  background-color: #282728;
}

/* Card logo max-width */
.product-account-image-wrapper {
    max-width: 80%;
}

/* Product Page - Remove extra padding */
#product-page #feature {
    padding-top: 0;
}

.jqFlag {
    border-top: 71px solid rgb(177, 152, 68)!important;
}

.product-flag-free {
    background-color:  transparent !important;
}

.product-tile .product-footer {
    color: #d00d2c;
}

.product-results .product-tile:hover {
    box-shadow: inset 0px -5px 0px #d00d2c;
}

.ProductIcon__LargeCircle--course {
    background: #17c7d1;
}

.hero-region h1, .hero-region .h1, .hero-region .AdminSynopsis__Title {
     font-family: sans-serif;
}

.ProductEnrollment__Notice {
    color: #d00d2c;
    font-weight: 500;
    font-style: italic;
}

#user-nav.pull-right {
 padding-top: 4rem;
    float: none !important;
    padding-left: 5rem;
}

@media (min-width: 768px) {
#user-nav.pull-right {
    padding-top: 0;
    float: right !important;
    padding-left: 3rem;
}
}

#user-nav.Dropdown__Wrapper.dropdown.pull-right {
    padding-left: 32%;
    margin-top: -7px !important;
}

@media (min-width: 768px) {
#user-nav.Dropdown__Wrapper.dropdown.pull-right {
    padding-left: 2rem;
margin-top: 0 !important;
}
#user-nav.Dropdown__Wrapper.dropdown.pull-right + .menu-link {
    margin-left: 2rem;
}
}

.btn.btn-link.dropdown-toggle.Dropdown__Toggle--header {
padding: 0;
}

.btn.btn-link.dropdown-toggle.Dropdown__Toggle--header .Dropdown__ToggleTextWrapper {
    vertical-align: text-bottom;
}

.menu-link {
  margin-top: 1rem;
}

@media (min-width: 768px) {
.menu-link {
    margin-top: 0;
    margin-left: 4rem;
    float: right;
}
}

/*Button in nav*/
.button-primary {
    background-color: #d00d2c;
    color: #fff;
    width: auto;
    padding: 10px 20px;
    font-weight: 600;
    letter-spacing: normal;
    font-size: 14px;
    text-transform: uppercase;
    display: inline-block;
    border: none;
    line-height: 20px;
}

.button-primary.menu-link {
    margin-top: 15px;
}

@media (min-width: 768px) {
.button-primary.menu-link {
    margin-top: 0;
}
}

.button-primary a {
color: #ffffff;
}

/* Tablet Styles */
@media (min-width: 768px) {

/* Hero text container styles */
.hero-text {
  padding-top: 1%;
  padding-right: 25rem;
}
}


/* Desktop Styles */
@media (min-width: 992px) {

/* Hero Image height  */
.bg-image {
  height: 30rem;
}

/* Hero text container */
.hero-text {
  padding-top: 5%;
  padding-right: 33rem;
}

/* Hero text font style */
.hero-text h1 {
  font-size: 4.5rem;
}

#app-header:after {
    top: 160px;
}

.header-branding h1 a img {
    height: 115%;
}

h1.logo-customized {
    margin-bottom: 22px;
    margin-top: 15%;
}
}

/* Giant  */
@media (min-width: 1980px) {

/* Hero Image height  */
.bg-image {
  height: 30rem;
}

/* Hero text container  */
.hero-text {
  padding-top: 5%;
}



}

.ProductIcon__LargeCircle--course {
    background: #d00d2c;
    }