html {
    scroll-behavior: smooth;
}

body {
    /*padding-top: 80px;*/
    padding-top: 128px;
}

#learning {
    /*padding-top: 60px;*/
    padding-top: 108px;
}

#quoting {
    padding-top: 0;
}

h1, h2 {
    font-family: Hind, sans-serif;
}

.material-icons {
    font-size: 18px;
}

.logo {
    width:220px;
}

.navbar-light .navbar-nav .nav-link {
    font-family: 'Hind', sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: #474a4e;
    white-space: nowrap;
}

.aarp-links {
    font-family: Hind, arial, helvetica, sans-serif;
    font-weight: 700;
    font-size: 13px;
    line-height: 30px;
    text-decoration: none;
    color: #FFFFFF;
}

.pipe {
    margin: 0 10px 0 10px;
}

.white {
    color: #FFFFFF;
}


a.aarp-links:link {
    color: #FFFFFF;
}

a.aarp-links:visited {
    color: #FFFFFF;
}

a.aarp-links:hover {
    color: #CCCCCC;
    text-decoration: underline
}

a.aarp-links:active {
    color: #CCCCCC !important;
    text-decoration: underline
}

.dropdown-menu {
    background: #fff;
    border: 1px solid #e1251b;
}



.dropdown-item:focus, .dropdown-item:hover {
    color: #16181b;
    text-decoration: underline;
    background-color: transparent;
}



footer {
    background: #005cb9;
    color: #fff;
}

footer a, footer a:hover {
    color: #fff;;
}


footer h3 {
font: 600 15px 'Hind', sans-serif;
}



.footer-links strong a {
    font: 600 14px 'Hind', arial, sans-serif;
}

footer p {
    font-family: 'Hind', sans-serif;
    font-size: 14px;

    font-weight: 300;
}


footer li {
    font-size: 13px;
}

.fb-btn {
    font: 600 15px 'Hind', sans-serif;
}

footer .small-print p {
    font: 11px arial, helvetica, sans-serif !important;
}

footer .small-print a {
    text-decoration: underline;
}

footer .border-top {
border-top: 1px solid #4a8bcd !important;
}



h1 { font-size: 2rem; }
h2 { font-size: 1.5rem; }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.0rem; }


.text-red {
    color: #e1251b !important;
}

.btn-dark.btn-red {
    background-color: #e1251b;
    border-color: #e1251b;
}

.btn-dark.btn-red:hover,
.btn-dark.btn-red:focus,
.btn-dark.btn-red:focus:not(:disabled):not(:disabled):active {
        background-color: #9e090a;
        border-color: #9e090a;
    }

.btn-outline-dark.btn-red {
    color: #e1251b;
    background-color: #fff;
    border-color: #e1251b;
}


.btn-outline-dark.btn-red:hover,
.btn-outline-dark.btn-red:focus,
.btn-outline-dark.btn-red:focus:not(:disabled):not(:disabled):active {
    background-color: #e1251b;
    border-color: #e1251b;
    color: #fff;
}




.btn-dark.btn-blue {
    background-color: #007AC1;
    border-color: #007AC1;
}

.btn-red:hover,
.btn-dark.btn-blue:focus,
.btn-dark.btn-blue:focus:not(:disabled):not(:disabled):active {
        background-color: #007AC1;
        border-color: #007AC1;
    }




.card.border-blue {
    border-width: 4px;
    border-color: #005cb9;
    border-radius: 0;
}


.border-right {
    border-right: none !important;
}

.lc-image {
    width: 100%;
}

main a,
.sr-only.sr-only-focusable {
    /*color: #6a5eff; */
	color: #0000EE;
}


.bullet-red {
  list-style-image: url('data:image/svg+xml,<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 10 10" width="10" height="10"><rect fill="red" x="0" y="0" height="10" width="10"/></svg>');
}


.text-ellipsis-2 {
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
  }


.text-ellipsis-3 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;  
}


.text-ellipsis-4 {
    display: -webkit-box !important;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    white-space: normal;
  }


.jumbotron-fluid {
    position: relative;
    width: 100%;
    height: 540px;
    /*
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    */
    display: flex;
    justify-content: center;
    align-items: center; 
    justify-content: space-around;
}




/*
.jumbotron-fluid:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #212529;
    opacity: 0.6;
}
*/

/*
.jumbotron-fluid .lead {
    text-shadow: 2px 2px 8px #000;
}
*/

.jumbotron-fluid  h1 {
    font-size: 1.75rem;

}


@media (min-width: 768px) {

    .card-title {
        height: 50px;
    }


    .jumbotron-fluid {
        position: relative;
        width: 100%;
        height: 380px;
    }

    .jumbotron-fluid  h1 {
        font-size: 2.5rem;
    }
    


}



.btn-banner { background: #007AC1; }
      
.btn-banner a { font: 20px Hind, arial, helvetica, sans-serif; }

.bg-light-blue { background: #d8e8f5;}


/* product pages */

.card[role=banner] {
    background-color: #007AC1; 
    background-image: url(../images/banner-mh.png);
    background-repeat: no-repeat;
    background-position: 383px top;
    color: #fff;
    line-height: 1.4;
  }

  .card[role=banner].mc {
    background-image: url(../images/banner-mc.png);
  }


  .card[role=banner].flood {
    background-image: url(../images/banner-flood.png);
  }

  .card[role=banner] h1 {
    color: #fff;
    font: 20px Hind, sans-serif;
  }

  .card[role=banner] .card-footer {
    font: 14px Hind-italic, sans-serif;
      color: #fff;
    background: #002850;
    opacity: 0.8;
  }

  .quote-box {
    background-color: #e9eaeb;
    line-height: 1.4;
  }


  .comparison td,
  .comparison th {
      border: 1px #000 solid !important;
  }


  .start-quote {
      font-size: 40px;
      color: #0065a8;
      transform: rotate(180deg);
  }



@media (min-width: 768px) {
    .border-right {
        border-right: 1px solid #dee2e6!important;
    }

    .lc-image {
    /*  width: auto; */
        width: 325px;
    }

    .w-40 {
        width: 40%;
    }

    .w-30 {
        width: 30%;
    } 
    

}


@media (min-width: 576px) {
    
    .aarp-links {
        font-family: Hind, arial, helvetica, sans-serif;
        font-weight: 700;
        font-size: 15px;
        line-height: 30px;
        text-decoration: none;
        color: #FFFFFF;
    }

    body {
        padding-top: 158px;
    }

}

@media (min-width: 1120px) {
    .logo {
        width: 360px;
    }
}