/* Banner Image at top */

.header-branding {
    width: 150px;
}

#home-page .feature-region {
    background: url(https://aws-canvas-media-rm.s3.us-east-2.amazonaws.com/ProLearn+Catalog/prolearn-catalog-banner-1.png)
        no-repeat center center;
    min-height: 295px;
    background-size: cover;
    text-align: center;
}



/* semi-transparent header text box */

.general-header-bg {
    background: rgba(25, 75, 94, .9);
    display: inline-block;
    padding: 20px 65px 15px 65px;
    border-radius: 10px;
    border: 2px solid #d64605;
    margin-top: 60px;
}

.general-header {
    font-size: 40px;
    font-weight: 900;
    font-family: Georgia, serif;
    color: #ffffff;
    padding: 0;
    margin: 0;
}
.general-subhead {
    font-size: 16px;
    font-weight: 100;
    font-family: Geneva, Verdana, sans-serif;
    color: #ffffff;
    padding-top: 0;
    margin-top: 0;
}



/* Search bar ribbon underneath banner/header image - background color, top border color, and text color */

#search-form.callout-region {
    background-color: #156380;
    border-top: 4px solid #f68e20;
    color: #F2F8FA;
    padding: 0;
    text-align: left;
}



/*Refine button hover and focus colors */

#search-form.callout-region button:hover {
    background-color: #156380;
    color: #F2F8FA;
}

#search-form .search-refine-button:focus {
    background-color: #287a9f;
    color: #f5f5f5;
    padding: 5;
}



/*  Login/name at top right - link color and hover color */

.btn-link {
    color: #0097d3;
    font-weight: bold;
    cursor: pointer;
    border-radius: 0;
}

.btn-link:hover {
    color: #39b7d7;
    font-weight: bold;
    cursor: pointer;
    border-radius: 0;
}



/* Listing footer text and button */

.product-tile .product-footer {
    color: #0097d3;
}



/* Circle icon on listing image for course listings*/

.ProductIcon__LargeCircle--course {
    background: #39b7d7;
}



/* Circle icon on listing image for program listings  */

.ProductIcon__LargeCircle--program {
    background: #43ca9e;
}



/* Bottom border of listing tile when hovering */

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



/* Background of page section where the listings are located */

#main.product-results {
    background: none;
    background-color: #F2F8FA;
}



/* Background of dropdown menu at top right */

.Dropdown__Menu.dropdown-menu {
    background-color: #f2f2f2;
}



/* Background of search form for categories */

#search-form .search-categories ul {
    background-color: #FFFFFF;
}



/*Main footer at the bottom */

#app-footer {
    background-color: #ffffff;
    color: #156380;
    padding: 5px 0 10px;
    text-align: center;
    margin-top: auto;
}







/* Need to figure out */

.btn-info {
    color: #ffffff;
    background-color: #000000;
}

/* Need to figure out */

.btn-info:active {
    color: #ffffff;
    background-color: #000000;
}

/* Need to figure out */

.btn-info:hover {
    color: #ffffff;
    background-color: #000000;
}