/*
* mico-prod-override.css
* Add AFTER base-mico.css in the
*
* Gotham font substitute — add this before this stylesheet:
*
*/
/* 1. COLOUR VARIABLES */
:root {
--color-primary: #0a5bab;
--color-primary-dark: #0035af;
--color-secondary: #0177c0;
--color-accent: #cb0432;
--color-text: #444444;
--color-surface: #eaedf5;
--mico-border: #eaedf5;
}
/* 2. BODY */
body {
background: #f7f7f7 !important;
color: #444 !important;
font-size: 15px !important;
line-height: 1.5em !important;
}
/* 3. NAVBAR — solid blue */
#header.navbar,
#header .navbar,
#header .navbar.bg-light,
#header .navbar-light,
.navbar {
/* background: #0a5bab !important;
border-bottom: 2px solid #fff !important;
box-shadow: none !important;
border-radius: 0 !important;*/
}
/* 4. NAV LINKS — white text */
#header .nav-link,
#header .navbar-nav .nav-link,
.navbar-nav > li > a {
color: #fff;
font-weight: 600 !important;
text-transform: uppercase !important;
font-size: 0.8125rem !important;
letter-spacing: 0.04em !important;
}
#header .navbar-nav > li > a.nav-link:not(.nav-link-color) {
/*color: #fff !important;*/
color: #222;
font-weight: 900 !important;
}
#header .nav-item-active > .nav-link,
#header .nav-item:has(.dropdown-menu .nav-item-active > .nav-link) > .nav-link,
#header .nav-link:hover,
#header .navbar-nav .nav-link:hover,
#header .nav-link:focus,
.navbar-nav > li > a:hover,
.navbar-nav > li > a:focus {
background: var(--color-primary);
color: #fff;
}
a#lnkLogin {
color: #fff !important;
font-weight: bold !important;
text-transform: uppercase !important;
}
a#lnkLogin:hover {
background: #0035af !important;
}
/* Hamburger */
#header .navbar-toggler,
.navbar-toggle {
border-color: #fff !important;
}
#header .navbar-toggler-icon {
filter: invert(1) !important;
}
.navbar-toggle .icon-bar {
background: #fff !important;
}
/* 5. DROPDOWN — white bg, blue hover */
.navbar-nav .dropdown-menu,
#header .dropdown-menu {
background: #fff !important;
border: none !important;
border-radius: 0 !important;
box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
padding: 0 !important;
margin-top: 0 !important;
}
.navbar-nav .dropdown-menu .nav-link,
.navbar-nav .dropdown-menu .dropdown-item,
#header .dropdown-menu a,
.dropdown-menu > li > a {
color: #444 !important;
text-transform: none !important;
letter-spacing: normal !important;
font-weight: normal !important;
font-size: 14px !important;
padding: 10px 20px !important;
}
.navbar-nav .dropdown-menu .nav-link:hover,
.navbar-nav .dropdown-menu .dropdown-item:hover,
#header .dropdown-menu a:hover,
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
background: #0a5bab !important;
color: #fff !important;
}
/* Mobile nav */
@media (max-width: 767px) {
.navbar-collapse .navbar-nav .nav-link,
.navbar-collapse .nav > li > a {
/*color: #0a5bab !important;*/
color: #fff !important;
border-bottom: 1px solid #0a5bab !important;
}
}
@media (max-width: 991px) {
.navbar-collapse .navbar-nav .nav-link,
.navbar-collapse .nav > li > a {
/*color: #0a5bab !important;*/
color: #fff !important;
border-bottom: 1px solid #0a5bab !important;
}
}
/* 6. HEADINGS */
h1, .h1, .heading, .jumbotron h1 {
color: #0a5bab !important;
font-weight: 900 !important;
font-size: 40px !important;
text-transform: uppercase !important;
font-family: 'Montserrat', 'Gotham', 'Open Sans', sans-serif !important;
}
h2, .h2, .featuredRewards h3 {
color: #0a5bab !important;
font-weight: bold !important;
font-size: 32px !important;
text-transform: uppercase !important;
font-family: 'Montserrat', 'Gotham', 'Open Sans', sans-serif !important;
}
h3, h4, h5, h6,
.h3, .h4, .h5, .h6 {
color: inherit !important;
}
.panel-heading {
color: #0a5bab !important;
font-family: 'Montserrat', 'Gotham', 'Open Sans', sans-serif !important;
text-transform: uppercase !important;
font-weight: bold !important;
}
/* 8. PANELS & CARDS */
.panel-heading, .card-header {
background: #eaedf5 !important;
color: #0a5bab !important;
border-bottom: 1px solid transparent !important;
}
.panel, .card {
border-color: #ddd !important;
border-radius: 0 !important;
box-shadow: none !important;
}
/* 9. TABLE HEADERS */
.table > thead > tr > th,
table.table thead th {
background: #eaedf5 !important;
color: #0a5bab !important;
border: none !important;
}
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > td {
border-color: #eaedf5 !important;
}
/* 10. BUTTONS */
.btn {
border-radius: 0 !important;
text-transform: uppercase !important;
font-weight: bold !important;
}
.btn-primary, .btn-blue, a.btn-blue {
background: #0a5bab !important;
border-color: #0a5bab !important;
color: #fff !important;
}
.btn-primary:hover, .btn-blue:hover, a.btn-blue:hover, .btn-primary:focus {
background: #0177c0 !important;
border-color: #0177c0 !important;
color: #fff !important;
}
/* 11. MISC */
.pre-footer-break {
background: #f7f7f7 !important;
}
.text-primary {
color: #0a5bab !important;
}
.bg-primary {
background-color: #0a5bab !important;
}
.offer-quantity-modifier {
background: #cb0432 !important;
}
.featuredRewards a.more {
color: #cb0432 !important;
}
.current-points-badge {
color: #023671 !important;
}
.jumbotron {
background: #fff !important;
border-radius: 0 !important;
margin: 0 !important;
}
.dashboardlinks {
background: #0a5bab !important;
}
.dashboardlinks .dashboardlink, .dashboardlinks a {
color: #0a5bab !important;
}
.container22 {
max-width: 1024px !important;
margin-right: auto !important;
margin-left: auto !important;
}
.hero-img{
width:99%;
}