/*This is the main catalog background*/
#main.product-results { 
    background-image: linear-gradient(to bottom, #e7e7e7, #f2f2f2 50%, #ffffff);
} 


/*This is the catalog tile*/
.product-tile { 
 box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
} 

/*This is the course logo on the catalog tile */
.ProductIcon__LargeCircle--course {
background: #66c398;
color: #ffffff;
}

/* Hover effect on course listings */
.product-link:hover {
transform: scale(1.05);
color: #102748
}

.product-link {
transition: transform 0.5s ease;
transform: none;
color: #000000;
}

/* Underline when hover over listings */
.product-results .product-tile:hover {
    box-shadow: inset 0px -5px 0px #0C4C91;
}

/* end hover effect on course listings */
/*This is the line at the top of the catalog*/
.feature-region { 
background: #102649; 
} 

/*This is the typically large white block at the top of the catalog*/
#app-header { 
background: #102649; 
} 

/*Ensure login link is visible against blue background*/
.css-1cps253-view-link:-webkit-any(a), .css-1cps253-view-link:-webkit-any(button) {
color: #ffffff !important;
}

/*Ensure Admin Panel links are visible*/
.css-1cps253-view-link:-webkit-any(a), .css-1cps253-view-link:-webkit-any(button), .css-1fahbk2-baseButton__content {
color: #ffffff !important;
}

/*This is the search bar at the top of the catalog*/
#search-form.callout-region { 
background: #102649; 
} 

/*This is the text color in the search bar at the top of the catalog*/
.search-refine-button__contents { 
color: #ffffff; 
}

/*This is the filter bar -- this should match the search-form bar above*/
#search-form .search-form-filters { 
background: #102649;