/* STANDARD CSS OVERRIDES */
body {
    overflow: auto;
    overflow: initial;
}

/* SILVERROCK PROPRIETARY CSS */

.article-image {
    max-width: 100%;
    min-height: 1;
    width: auto;
    height: auto;
}

.silverrock-logo {
    margin-right: 25px;
}

.silverrock-shield {
    background: url(../images/silverrockinc-white-shield-shadow.png) 100% no-repeat;
    background-size: cover;
    width: 250px;
    height: 283px;
    margin: auto auto 10px;
    -ms-interpolation-mode: bicubic;
}

.silverrock-shield-small {
    background: url(../images/silverrockinc-white-shield-shadow.png) 100% no-repeat;
    background-size: cover;
    width: 66px;
    height: 75px;
    margin: auto auto 10px;
    -ms-interpolation-mode: bicubic;
}

.silverrock-logo-row {
    min-height: 335px;
    padding: 0;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.silverrock-logo-row-alt {
    min-height: 275px;
    padding: 0;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: url(../images/hero2.jpg) center / cover;
}

.silverrock-header {
    background-image: url(../images/hero.jpg);
    background-size: 100%;
    -ms-interpolation-mode: bicubic;
}

.silverrock-header.is-compact {
    background: #1e75bc;
}
.no-bg{
    background-color: #1e75bc !important;
}

.alt-page-card {
    position: relative;
    top: -200;
    margin-bottom: -150px;
}

.info-max-width {
    max-width: 1200px;
    margin: auto;
    text-align: center
}

.phoneHeader {
    background-image: url(../images/hero.jpg) center / cover;
    background-size: 100%;
}

.insurance-card {
    background: url(../images/insuranceCard2.jpg) center / cover;
    height: 350px;
    color: white;
    width: 100%
}

.gps-card {
    background: url(../images/gpsCard.jpg) center / cover;
    height: 350px;
    color: white;
}

.warranty-card {
    background: url(../images/warrantyCard.jpg) center / cover;
    height: 350px;
    color: white;
}

.contact {
    width: 100%;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}

.vsc-card {
    background: url(../images/vscCard.jpg) center / cover;
    height: 350px;
    color: white;
}

.send-button {
    margin: 15px 0 15px 25px; 
    float: left;
}

.silverrock-footer {
    position: relative;
    bottom: 0;
}

.gap-card {
    background: url(../images/gapCard.jpg) center / cover;
    height: 350px;
    color: white;
}

.contactForm {
    width: 100% !important;
}

.call-us {
    margin: 0px 20px 5px 0px;
}

.is-compact .hide {
    display: inherit;
}

.hide {
    display: none;
}

.card {
    max-width: 1400px;
    position: relative;
    margin: auto;
}

.wordNav {
    text-decoration: none;
    color: black;
}

.product-fab-group {
    padding-top: 20px;
    /*margin-left: -34px;*/
    position: fixed;
    width: 100%;
    background: white;
    z-index: 5;
}

.fab-offset {
    margin-top: 180px;
}

.drawer-icon { 
    display: flex; 
    justify-content: center;
    align-items: center;
}

.product-section {
    padding: 100px 0 100px 0;
    width: 100%
}

.product-section.dark {
    background: rgba(92, 102, 112, 0.1)
}

/* this offsets *Card ids so the scrollTo work */
a.anchor {
    display: block;
    position: relative;
    top: -50px;
    visibility: hidden;
}

.products-fab {
    height: 75px !important;
    width: 75px !important;
}

.material-icons.products-icon {
    font-size: 40px;
    margin-left: -7.5px;
}

.products-col {
    text-align: center;
}

.hover-white {
    color: rgba(255, 255, 255, 0.87);
}


.sm-map:hover {
    background: url(../images/hatsm_gray.png) center / cover;
}

/* MEDIA QUERIES*/
@media screen and (max-width: 1024px) {
    .product-fab-group {
        display: none !important;
    }
    .fab-offset {
        margin-top: 0px;
    }
}

@media screen and (max-width: 694px) {
    #failedContent {
        font-size: 16px;
    }
}

@media screen and (max-width: 450px) {
    .vsc-card {
        background: url(../images/vscCard_sm.jpg) center / cover;
    }
    .warranty-card {
        background: url(../images/warrantyCard_sm.jpg) center / cover;
    }
    .gps-card {
        background: url(../images/gpsCard_sm.jpg) center / cover;
    }
    .insurance-card {
        background: url(../images/insuranceCard2_sm.jpg) center / cover;
    }
}

@media screen and (max-width: 515px) {
    .mdl-typography--title {
        font-size: 10px;
    }
    .mdl-typography--display-3 {
        font-size: 45px;
    }
    .email-address {
        font-size: 12px;
    }
    .mdl-menu__item {
        font-size: 12px !important;
    }
    .mdl-menu--bottom-left {
        width: 250px;
    }
}

@media screen and (min-width: 1024px) {
    .small-header {
        display: none;
    }
}

@media screen and (max-width: 375px) {
    h3 {
        font-size: 24px;
    }
}

/* MDL OVERRIDES */
.mdl-button--colored {
    background-color: #76b5e9 !important;
}

.mdl-menu--bottom-left {
    width: 330px;
}

.log-in-button {
    float: left;
    margin-right: 10px;
    background-color: #fff !important;
}

.mdl-button--fab.mdl-button--colored { 
    background: #2196f3 !important;
    transition: all 0.5s ease;
}

.mdl-button--fab.mdl-button--colored:hover {
    background-color: #165487;
    box-shadow: 0 16px 24px 2px rgba(0,0,0,.14),0 6px 30px 5px rgba(0,0,0,.12),0 8px 10px -5px rgba(0,0,0,.2);
}

/* changes tab underline from blue which is hard to see against background */
.mdl-tabs.is-upgraded .mdl-tabs__tab.is-active:after {
    background: rgba(255, 255, 255, 0.87);
}

.mdl-layout__content {
    background: #f2f2f2;
}

.mdl-tabs__tab {
    color: rgba(255, 255, 255, 0.54);
}

.mdl-tabs.is-upgraded .mdl-tabs__tab.is-active {
    color: rgba(255, 255, 255, 0.87);
}

.mdl-tabs__tab {
    cursor: pointer;
}

.mdl-tabs__tab:hover {
    color: white;
    
}

.divider {
    margin: 20px 0px 10px 0px;
    padding: 0 0 0 0;
}

.form-line {
    margin: 25px;
}

.form-line .mdl-button--icon {
    margin-right: 15px;
}

footer .row {
	margin-bottom: 0;
}

footer p {
	margin: 0;
}

footer a {
	margin-right: 20px;
}

footer ul {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	justify-content: space-between;
}

footer ul li {
	display: block;
	flex: 0 1 auto;
}

.footerText {
	font-size: 10pt;
}