/*! HTML5 Boilerplate v7.3.0 | MIT License | https://html5boilerplate.com/ */

/* main.css 2.0.0 | MIT License | https://github.com/h5bp/main.css#readme */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
  color: #222;
  font-size: 1em;
  line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 *
 * Customize the background color to match your design.
 */

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
  resize: vertical;
}

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

  /* Components */

  * { outline: none; }

  .cta-orange { color: #010101; font-size: 20px; font-weight: bold; display: inline-flex; height: 58px; max-width: 270px; align-items: center; padding-left: 75px; padding-right: 30px; position: relative; transition: color .6s; }
  .cta-orange.long-text { max-width: 580px; }
  .cta-orange span.orange-style {  display: block; width:100%; height: 58px; max-width: 58px; border-radius: 29px; background-color: #ee4136; color: #fff; position: absolute; top: 0; left: 0; z-index: -1; transition: all .2s; background-image: -moz-linear-gradient( 90deg, rgb(232,52,41) 1%, rgb(248,106,78) 99%); background-image: -webkit-linear-gradient( 90deg, rgb(232,52,41) 1%, rgb(248,106,78) 99%); background-image: -ms-linear-gradient( 90deg, rgb(232,52,41) 1%, rgb(248,106,78) 99%); }
  .cta-orange::before { content: '\f054'; font-family: "Font Awesome 5 Free"; color: #fff; width: 58px; height: 58px; display: inline-flex; align-items: center; justify-content: center; position: absolute; left: 0; top: 0; transition: all .4s; }
  .cta-orange:hover, .cta-orange:focus { color: #fff; }
  .cta-orange:hover span.orange-style, .cta-orange:focus span.orange-style { max-width: inherit; color: #fff;  }
  .cta-orange:hover::before { content: '\f061'; }
  .cta-orange.cta-gray { max-width: 290px; }
  .cta-orange.cta-gray span.orange-style { background: #b3b4b5; }

  .select-insurance { max-width: 525px; }
  .select-insurance h3 { text-align: center; font-weight: bold; font-family: 'Open Sans', 'Helvetica', 'Arial', sans-serif; margin-bottom: 30px; font-size: 18px; }
  .select-insurance ul { list-style: none; display: flex; flex-wrap: wrap; padding: 0; margin: 0; }
  .select-insurance ul li { max-width: 33.33%; text-align: center; margin-right: 20px; margin-bottom: 20px; }
  .select-insurance a.insurance-circle { display: flex; flex-direction: column; transition: ease all .2s; align-items: center; justify-content: center; width: 155px; height: 155px; border-radius: 50%; background-color: #f2f2f2; color: #010101; text-decoration: none; }
  .select-insurance a.insurance-circle svg { fill: #ee4136; transition: ease all .2s; }
  .select-insurance a.insurance-circle span { display: block; font-weight: bold; font-size: 18px; line-height: 1; margin-top: 10px; transition: ease all .2s; }
  .select-insurance a.insurance-circle:hover { background-color: #ee4136; }
  .select-insurance a.insurance-circle:hover svg { fill: #fff; }
  .select-insurance a.insurance-circle:hover span { color: #fff; }
  .select-insurance.select-insurance--footer { margin: 0 auto; }
  .select-insurance.select-insurance--footer h3 { color: #fff; }


	/* All sites */
	html, body { font-family: 'Open Sans', 'Helvetica', 'Arial', sans-serif; color: #010101; }
	h1, h2, h3, h4, h5, h6 { font-family: 'Source Sans Pro', sans-serif; font-weight: bold; }
  .container { max-width: 1335px; }
	a:hover { text-decoration: none; }
  img { max-width: 100%; height: auto; }

  #page { overflow: hidden; }

  #masthead { min-height: 100vh; background-color: #fff; background-image: url('../images/hero-img.jpg'); background-repeat: no-repeat; background-position: 800px center; }

  #main-header { padding: 30px 0; position: relative; z-index: 2; }
  #main-header.header-shadow { box-shadow: 0px 6px 29px 0px rgba(2, 2, 2, 0.07); }
  

	#main-header .main-header__container { display: flex; justify-content: space-between; align-items: center; }
	#site-branding { margin: 0; }
	#main-menu { display: flex; align-items: center; list-style: none; margin: 0; padding: 0; }
	#main-menu li { font-weight: bold; font-size: 18px; line-height: 1; }
	#main-menu li:not(:first-child) { margin-left: 25px; }
	#main-menu li a { color: #000; transition: ease all .3s; }
	#main-menu li a:hover { color: #003e7b; }
	#main-menu li.main-menu--phone { font-size: 21px; }
  #main-menu li.main-menu--phone a { color: #003e7b; }
  
  #hero-content { position: relative; z-index: 2;  }
  #hero-content .hero-content__main { position: relative; z-index: 2; }
  #hero-content .hero-content__heading { font-size: 70px; font-weight: 900; line-height: 1; margin: 60px 0 20px; }
  #hero-content .hero-content__text { font-size: 18px; color: #818181; margin-bottom: 65px; }
  #hero-content .hero-content__text span { border-bottom: 2px solid #818181;  }

  .m-only { display: none; }
  #hero-content a.hero-content__call { display: inline-block; font-weight: bold; color: #003e7b; padding: 10px; border: 1px solid #003e7b; margin-top: 15px; }
  #hero-content a.hero-content__call img { position: relative; top: -2px; }

  #shop-for-best-section { padding: 100px 0 0; }
  /* #shop-for-best-section .container { max-width: 1175px; } */
  #shop-for-best-section h2 { font-size: 70px; color: #003e7b; font-weight: bold; line-height: 1; margin: 0 0 180px; }
  #shop-for-best-section h2 span { font-weight: normal; display: block; }
  #shop-for-best-section .sfbc__contents { position: relative; }
  #shop-for-best-section .sfbc__contents h3 { font-size: 42px; font-weight: bold; margin-bottom: 20px; }
  #shop-for-best-section .sfbc__contents p { font-size: 18px; margin-bottom: 30px; color: #0d1131; }
  #shop-for-best-section .sfbc__contents .cta-wrapper { position: relative; z-index: 4; }
  #shop-for-best-section .sfbc__content-1 { margin-bottom: 360px; }
  #shop-for-best-section .sfbc__content-1 .graphic-img { position: absolute; top: 0; right: 200px; z-index: -1; }
  #shop-for-best-section .sfbc__content-1 .graphic-img::before { content: url('../images/line-style-1.svg'); position: absolute; top: 0; left: 0; z-index: 3; transform: translate(170px, -50px); }
  #shop-for-best-section .sfbc__content-1 .graphic-img img { transform: translate(230px, -320px); }
  #shop-for-best-section .sfbc__content-2 { margin-bottom: 150px; z-index: 2; }
  #shop-for-best-section .sfbc__content-2 .graphic-img { position: absolute; top: 0; right: 100px; z-index: -1; }
  #shop-for-best-section .sfbc__content-2 .graphic-img::before { content: url('../images/line-style-2.svg'); position: absolute; top: 0; left: 0; z-index: 3; transform: translate(-290px, -70px); }
  #shop-for-best-section .sfbc__content-2 .graphic-img img { transform: translate(-90px, -400px); }
  #shop-for-best-section .sfbc__content-3 { margin-bottom: 180px; }
  #shop-for-best-section .sfbc__content-3 .graphic-img { position: absolute; top: 0; right: 200px; z-index: -1; }
  #shop-for-best-section .sfbc__content-3 .graphic-img::before { content: url('../images/line-style-3.svg'); position: absolute; top: 0; left: -100px; z-index: 3; transform: translate(350px, 230px); }
  #shop-for-best-section .sfbc__content-3 .graphic-img img { transform: translate(320px, -420px); }

  #why-choose-section { padding: 100px 0 130px; background-color: #fff; background-image: url('../images/why-choose-bg.jpg'); background-position: center; background-repeat: no-repeat; background-size: contain; }
  #why-choose-section h2 { font-size: 70px; font-weight: 900; line-height: 1; margin: 0 0 60px; }
  #why-choose-section h2 span { font-weight: normal; display: block; }
  #why-choose-section .wcs__list { list-style: none; padding: 0; margin: 0; }
  #why-choose-section .wcs__list li { padding-left: 30px; font-size: 18px; margin-bottom: 30px; position: relative; }
  #why-choose-section .wcs__list li::before { content: '\f00c'; font-family: "Font Awesome 5 Free"; font-weight: 900; color: #003e7b; position: absolute; top: 0; left: 0; font-size: 18px; }
  #why-choose-section .wcs__box-list { list-style: none; padding: 35px; border-radius: 10px; background-color: rgba(255,255,255,.9); box-shadow: 0px 4px 18px 0px rgba(2, 2, 2, 0.1); }
  #why-choose-section .wcs__box-list li { display: flex; align-items: center; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #dcdcdc; font-size: 18px; font-weight: bold; }
  #why-choose-section .wcs__box-list li:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }
  #why-choose-section .wcs__box-list li a { color: #000; }
  #why-choose-section .wcs__box-list li svg { margin-right: 20px; fill: #ee4136; }  

  #easy-insured-section { background-color: #f1523d; padding: 115px 0; color: #fff; }
  #easy-insured-section h2 { font-size: 70px; font-weight: bold; line-height: 1; margin-bottom: 60px; }
  #easy-insured-section .es__steps { list-style: none; padding: 0; margin: 0; display: flex; }
  #easy-insured-section .es__steps li { max-width: 33.33%; padding-right: 120px; position: relative; }
  #easy-insured-section .es__steps li::before { content: ''; width: calc(100% - 52px); display: block; border-top: 1px solid #fff; position: absolute; left: 52px; top: 25px; }
  #easy-insured-section .es__steps li:last-child::before { content: none; }
  #easy-insured-section .es__steps li span { display: inline-flex; align-items: center; justify-content: center; font-weight: bold; font-size: 30px; width: 52px; height: 52px; border: 3px solid #fff; border-radius: 50%; }
  #easy-insured-section .es__steps li h6 { margin: 15px 0; font-weight: bold; font-size: 21px; }
  #easy-insured-section .es__steps li p { font-size: 18px; }
  #easy-insured-section .cta-wrapper { padding: 30px 0; }
  #easy-insured-section .cta-wrapper a { display: inline-flex; width: 225px; justify-content: center; align-items: center; background-color: #fff; color: #f1523d; height: 77px; font-weight: bold; font-size: 20px; border-radius: 38px; transition: ease all .3s; }
  #easy-insured-section .cta-wrapper a:hover { width: 260px; }

  #testimonial-section { padding: 125px 0 70px; background-color: #fcfcfc; background: #ffffff; background: -moz-linear-gradient(top,  #ffffff 0%, #ededed 100%); background: -webkit-linear-gradient(top,  #ffffff 0%,#ededed 100%); background: linear-gradient(to bottom,  #ffffff 0%,#ededed 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); }
  #testimonial-section h2 { font-size: 42px; margin-bottom: 30px; font-weight: bold; }
  #testimonial-section .ts__testimony p { font-size: 32px; font-weight: 300; }
  #testimonial-section .ts__testimony .name { font-size: 18px; color: #f1523d ; }
  #testimonial-section .ts__testimony .name span { text-transform: uppercase; color: #010101; display: block; font-weight: bold; }
  #testimonial-section .img-wrapper { margin-bottom: -145px; position: relative; }

  #testimonial-section .cta-wrapper { position: relative; z-index: 4; padding: 30px 0; }
  #testimonial-section .img-wrapper img { border-radius: 50%; }

  #testimonial-section .testimonial-section__row { align-items: flex-end; }

  #get-a-quote-section { padding: 100px 0; }
  #get-a-quote-section h2 { font-size: 42px; margin-bottom: 30px; font-weight: bold; }

  #footer-insurance-type { min-height: 100vh; background: url('../images/footer-insurance-type-bg.jpg') center top no-repeat; background-size: cover; display: flex; flex-direction: column; margin-top: 70px; padding-bottom: 30px; }
  #footer-insurance-type:before { content: ''; display: block; background: #000; width: 1px; height: 28vh; margin: 0 auto 80px; }
  #footer-insurance-type .footer-insurance-type__container h2 { font-weight: bold; color: #fff; font-size: 42px; }
  #footer-insurance-type .footer-insurance-type__container p { color: #fff; margin-bottom: 65px; }

  #footer { background-color: #003e7c; padding: 30px 0 60px; }
  #footer .footer__top { display: grid; grid-template-columns: 1fr auto; grid-column-gap: 50px; grid-row-gap: 75px; }
  #footer .footer__call { align-self: center; display: flex; align-items: center; }
  #footer .footer__call p { text-transform: uppercase; color: #fff; font-size: 18px; font-weight: bold; line-height: 1; margin-bottom: 0; }
  #footer .footer__call a { background-color: #fff; display: inline-block; padding: 20px; border-radius: 30px; color: #003e7b; margin-left: 15px; }
  #footer .footer__call a:hover { background: #f0f0f0; }
  #footer .footer__about p { color: #fff; }
  #footer .footer__about p a { color: #fff; }
  #footer .footer__about p a:hover { color: #ee4136; }
  #footer .footer__nav { display: flex; justify-content: space-between; }
  #footer .footer__nav h3 { font-size: 18px; color: #fff; font-weight: bold; margin-bottom: 20px; font-size: 18px; text-transform: uppercase; }
  #footer .footer__nav .footer-menu { padding: 0; margin: 0; list-style: none; }
  #footer .footer__nav .footer-menu li { margin-bottom: 15px; font-size: 18px;; }
  #footer .footer__nav .footer-menu li a { color: #fff; }
  #footer .footer__nav .footer-menu li a:hover { color: #ee4136; }
  #colophon { padding-top: 40px; margin-top: 40px; border-top: 1px dotted #0364c4; }
  #colophon p { color: #509eeb; font-size: 15px; margin-bottom: 40px; }
  #colophon p:last-child { margin-bottom: 0; }

  /* Pages Styles */
  #main { color: #0d1131; font-size: 18px; }
  #main .page-title { font-size: 70px; margin: 60px 0; }
  #main .inner-page-container { max-width: 970px; }

  #about-us-section .about-us-section__content h3 { font-size: 44px; margin-bottom: 30px; }
  #team-section .team-section__container { max-width: 560px; }
  #team-section .team-member { margin-top: 60px; }
  #team-section .team-member__name { font-size: 44px; color: #003e7b; margin-top: 40px; }
  #team-section .team-member__position { text-transform: uppercase; font-size: 18px; color: #818181; }
  #team-section .team-member__img-container img { width: 328px; height: 328px; object-fit: contain; border-radius: 50%; box-shadow: 0px 12px 49px 0px rgba(2, 2, 2, 0.24); }

  #contact-us h2 { font-size: 44px; margin-bottom: 30px; font-family: 'Open Sans'; }
  #contact-us h2:not(:first-child) { margin-top: 70px; }
  #contact-us .contact-us__link { font-size: 20px; }
  #contact-us .contact-us__link a { color: #0d1132; }
  #contact-us .contact-us__link img { margin-right: 10px; }
  #contact-us .contact-us__form { max-width: 360px; margin: 0 auto; text-align: left; }
  #contact-us .contact-us__form label { font-size: 18px; font-weight: bold; }
  #contact-us .contact-us__form label.error { font-size: 14px; color: red; font-weight: normal; }
  #contact-us .contact-us__form input,
  #contact-us .contact-us__form textarea { width: 100%; border: none; padding: 20px; background-color: #f2f2f2; border-radius: 5px; font-size: 16px; }
  #contact-us .contact-us__form input { height: 50px; }
  #contact-us .contact-us__form textarea { height: 150px; }
  #contact-us .contact-us__form button { width: 100%; height: 60px; font-size: 20px; font-weight: bold; color: #fff; border: 0; border-radius: 30px; background-image: -moz-linear-gradient( 90deg, rgb(232,52,41) 1%, rgb(248,106,78) 99%); background-image: -webkit-linear-gradient( 90deg, rgb(232,52,41) 1%, rgb(248,106,78) 99%); background-image: -ms-linear-gradient( 90deg, rgb(232,52,41) 1%, rgb(248,106,78) 99%); outline: none; font-family: 'Source Sans Pro'; transition: ease all .3s; }
  #contact-us .contact-us__form button:hover { opacity: .8;; }
  
  #testimonials .testimonials__row { align-items: center; }
  #testimonials .testimonials__row:nth-child(even) { flex-direction: row-reverse; }
  #testimonials .testimonials__testimony p { font-size: 32px; font-weight: 300; }
  #testimonials .testimonials__testimony .name { font-size: 18px; color: #f1523d ; }
  #testimonials .testimonials__testimony .name span { text-transform: uppercase; color: #010101; display: block; font-weight: bold; }
  #testimonials .img-wrapper { position: relative; }
  #testimonials .img-wrapper img { border-radius: 50%; overflow: hidden; }

  @media (max-width: 1750px) {
    #masthead { background-position: 600px 90px; }
  }

  @media (max-width: 1600px) {
    
    #masthead { background-position: 500px 90px; }
    #hero-content .hero-content__heading { font-size: 60px; margin: 40px 0 20px; }
    #hero-content .hero-content__text { margin-bottom: 40px; }

    #shop-for-best-section h2 { font-size: 60px; margin: 0 0 100px; }
    #shop-for-best-section .sfbc__content-1 { margin-bottom: 150px; }
    #shop-for-best-section .sfbc__content-1 .graphic-img { max-width: 720px; right: 0; }
    #shop-for-best-section .sfbc__content-1 .graphic-img img { transform: translate(0px, -230px); }
    #shop-for-best-section .sfbc__content-1 .graphic-img::before { transform: translate(-230px, -50px); }

    #shop-for-best-section .sfbc__content-2 { margin-bottom: 60px; }
    #shop-for-best-section .sfbc__content-2 .graphic-img { max-width: 520px; right: 0; }
    #shop-for-best-section .sfbc__content-2 .graphic-img img { transform: translate(-110px, -330px); }
    #shop-for-best-section .sfbc__content-2 .graphic-img::before { transform: translate(-390px, -70px); }

    #shop-for-best-section .sfbc__content-3 { margin-bottom: 90px; }
    #shop-for-best-section .sfbc__content-3 .graphic-img { max-width: 620px; right: 0; }
    #shop-for-best-section .sfbc__content-3 .graphic-img img { transform: translate(0px, -240px); }
    #shop-for-best-section .sfbc__content-3 .graphic-img::before { transform: translate(-120px, 230px); }

    #why-choose-section h2 { font-size: 60px; }
    #easy-insured-section h2 { font-size: 60px; }
    

  }

  @media (max-width: 1500px) {
    
    #masthead { background-position: 450px 90px; }

  }

  @media (max-width: 1400px) {

    .container { max-width: 1075px; }

    .select-insurance { max-width: 450px; }
    .select-insurance a.insurance-circle { width: 130px; height: 130px; }
    .select-insurance a.insurance-circle svg { width: 35px; height: 35px; }
    .select-insurance a.insurance-circle span { font-size: 15px; }

    #masthead { background-size: 800px; background-position: 520px 120px; min-height: inherit; padding-bottom: 30px; }
    #hero-content .hero-content__heading { font-size: 50px; margin: 40px 0 20px; }

    #shop-for-best-section h2 { font-size: 50px; }
    #why-choose-section h2 { font-size: 50px; }
    #easy-insured-section h2 { font-size: 50px; }
    #easy-insured-section { padding: 60px 0; }

  }

  @media (max-width: 1199px) {
    #masthead { background-size: 850px; background-position: 320px 70px;  }

    #shop-for-best-section { padding: 30px 0; }
    #shop-for-best-section h2 { text-align: center; font-size: 42px; margin-bottom: 60px; }
    #shop-for-best-section .sfbc__contents { display: flex; flex-direction: row-reverse; align-items: center; justify-content: space-between; margin-bottom: 30px; }
    #shop-for-best-section .sfbc__contents > div { max-width: 50%; }
    #shop-for-best-section .sfbc__contents h3 { font-size: 32px; }
    #shop-for-best-section .sfbc__contents p br { display: none; }
    #shop-for-best-section .sfbc__contents .graphic-img { position: static; margin-right: 60px; text-align: center; max-width: 50%; }
    #shop-for-best-section .sfbc__contents .graphic-img img { transform: none; width: 100%; object-fit: cover; }
    #shop-for-best-section .sfbc__contents .graphic-img::before { content: none; }

    #why-choose-section h2 { font-size: 42px; text-align: center; }
    #why-choose-section h2 span > br { display: none; }

    #easy-insured-section h2 { font-size: 42px; }

    #testimonial-section .ts__testimony p { font-size: 24px; }

    #get-a-quote-section h2 { font-size: 32px; }
    #get-a-quote-section h2 br { display: none; }
    

  }

  @media (max-width: 991px) {
    #masthead { background-position: 150px 70px; position: relative; }
    #masthead::after { content: ''; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.4); position: absolute; top: 0; left: 0; }
    #hero-content .hero-content__heading { font-size: 50px; margin: 40px 0 20px; }

    #shop-for-best-section h2 span { display: inline; }
    #shop-for-best-section .sfbc__contents .graphic-img { margin-right: 30px; }

    #why-choose-section { padding: 30px 0; } 

    #easy-insured-section .es__steps li { padding-right: 30px; }
    
    #testimonial-section .img-wrapper { margin-bottom: 0; transform: inherit; }
    #testimonial-section { padding: 60px 0; }
    #get-a-quote-section { padding: 60px 0; }

    /* Page Styles */
    #testimonials .testimonials__testimony p { font-size: 26px; }

  }

	@media (max-width: 767px) {

    #shop-for-best-section h2 { font-size: 32px; }
    #shop-for-best-section .sfbc__contents { flex-direction: column-reverse; margin-bottom: 40px; }
    #shop-for-best-section .sfbc__contents > div { max-width: 100%; text-align: center; }
    #shop-for-best-section .sfbc__contents .graphic-img { margin-right: 0; margin-bottom: 30px; max-width: 360px; }
    #shop-for-best-section .sfbc__contents h3 { font-size: 24px; }
    #shop-for-best-section .sfbc__contents p { font-size: 16px; }

    .cta-orange { font-size: 18px; }

    #masthead { background-position: -100px 120px; background: transparent; }
    #masthead::after { background-color: rgba(255, 255, 255, 0.8); }
    #site-branding { max-width: 195px; }
    #hero-content .hero-content__heading { text-align: center; font-size: 42px; margin: 15px 0; }
    #hero-content .hero-content__text { text-align: center; margin-bottom: 20px; }

    .m-only { display: block; text-align: center; }

    #main-header { padding: 15px; }
    #main-menu li { font-size: 16px; }
    #main-menu li.main-menu--phone { font-size: 16px; }

    .select-insurance { margin: 0 auto; }
    .select-insurance ul { justify-content: center; }
    .select-insurance ul li { margin: 10px; max-width: 40%; }

    #why-choose-section { padding: 0 0 30px; }
    #why-choose-section h2 { font-size: 32px; }
    #why-choose-section .wcs__box-list { padding: 20px; }
    #why-choose-section .wcs__box-list li svg { width: 35px; height: 35px; }
    #why-choose-section .wcs__box-list li { margin-bottom: 10px; padding-bottom: 10px; font-size: 15px; }

    #easy-insured-section h2 { font-size: 32px; text-align: center; }
    #easy-insured-section .es__steps li span { font-size: 24px; width: 42px; height: 42px; }
    #easy-insured-section .es__steps li { padding: 0; }
    #easy-insured-section .es__steps { text-align: center; }
    #easy-insured-section .es__steps li::before { left: 117px; }
    #easy-insured-section .cta-wrapper { text-align: center; }

    #testimonial-section { padding-top: 160px; }
    #testimonial-section h2 { position: absolute; top: -100px; left: 0; padding: 0 15px; text-align: center; font-size: 32px; width: 100%; }
    #testimonial-section .testimonial-section__row { flex-direction: column-reverse; position: relative; }
    #testimonial-section .testimonial-section__row > div { position: static; }
    #testimonial-section .img-wrapper { max-width: 360px; margin: 0 auto 30px; transform: none; }

    #get-a-quote-section .img-wrapper { max-width: 360px; margin: 0 auto 30px; }
    #get-a-quote-section { padding-top: 0; }

    #footer .footer__top { grid-row-gap: 30px; grid-template-columns: 180px auto; }
    .footer__about { grid-column: 1 / 3; }
    #footer .footer__nav { grid-column: 1 / 3; }
    #footer .footer__call { justify-content: flex-end; }
    #footer .footer__call p { text-align: right; display: flex; flex-direction: column; }
    #footer .footer__call a { margin: 15px 0 0; max-width: 190px; }

    /* Page Styles */
    #main .page-title { font-size: 42px; margin: 40px 0; }
    
    #contact-us h2 { font-size: 26px; }

    #testimonials .testimonials__row, #testimonials .testimonials__row:nth-child(2) { flex-direction: column-reverse; text-align: center; margin-bottom: 30px; }
    #testimonials .img-wrapper { margin-bottom: 20px; }
    #testimonials .img-wrapper img { max-width: 400px; width: 100%; }

  }
  
  @media (max-width: 575px) {
    #main-header .main-header__container { flex-direction: column; }
    #site-branding { margin-bottom: 15px; }
    #hero-content .hero-content__heading { font-size: 28px; }
    #hero-content .hero-content__text { font-size: 16px; }

    #easy-insured-section .es__steps { display: block; }
    #easy-insured-section .es__steps li { max-width: inherit; padding: 0 30px; margin-bottom: 60px; }
    #easy-insured-section .es__steps li::before { content: none; }
    #easy-insured-section .es__steps li::after { content: ''; height: 60px; border-right: 1px solid #fff; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); }

    #footer .footer__top { grid-template-columns: 1fr; }
    #footer .footer__logo { grid-column: 1 / 2; }
    #footer .footer__call { grid-column: 1 / 2; justify-content: flex-start; }
    .footer__about { grid-column: 1 / 2; }
    #footer .footer__nav { grid-column: 1 / 2; flex-direction: column; }
    #footer .footer__nav-col:not(:last-child) { margin-bottom: 20px; }
    
  }

  /* * { border: 1px solid red; } */

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden {
  display: none !important;
}

/*
* Hide only visually, but have it available for screen readers:
* https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
*
* 1. For long content, line feeds are not interpreted as spaces and small width
*    causes content to wrap 1 word per line:
*    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
*/

.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
  /* 1 */
}

/*
* Extends the .sr-only class to allow the element
* to be focusable when navigated to via the keyboard:
* https://www.drupal.org/node/897638
*/

.sr-only.focusable:active,
.sr-only.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  white-space: inherit;
  width: auto;
}

/*
* Hide visually and from screen readers, but maintain layout
*/

.invisible {
  visibility: hidden;
}

/*
* Clearfix: contain floats
*
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
*    `contenteditable` attribute is included anywhere else in the document.
*    Otherwise it causes space to appear at the top and bottom of elements
*    that receive the `clearfix` class.
* 2. The use of `table` rather than `block` is only necessary if using
*    `:before` to contain the top-margins of child elements.
*/

.clearfix:before,
.clearfix:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}

.clearfix:after {
  clear: both;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}

@media print,
  (-webkit-min-device-pixel-ratio: 1.25),
  (min-resolution: 1.25dppx),
  (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   https://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important;
    /* Black prints faster */
    box-shadow: none !important;
    text-shadow: none !important;
  }
  a,
  a:visited {
    text-decoration: underline;
  }
  a[href]:after {
    content: " (" attr(href) ")";
  }
  abbr[title]:after {
    content: " (" attr(title) ")";
  }
  /*
     * Don't show links that are fragment identifiers,
     * or use the `javascript:` pseudo protocol
     */
  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: "";
  }
  pre {
    white-space: pre-wrap !important;
  }
  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }
  /*
     * Printing Tables:
     * https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
     */
  thead {
    display: table-header-group;
  }
  tr,
  img {
    page-break-inside: avoid;
  }
  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }
  h2,
  h3 {
    page-break-after: avoid;
  }
}