/* Shared */
.button {
  border-radius: 100px;
}
.body {
background-color: #fff;
}

hr.thin1 {
  border-top: 1px solid #fff; }

/* Sections */
.section {
  padding: 8rem 0 7rem;
  text-align: center;
}
.section-heading,
.section-description {
  margin-bottom: 1.2rem;
}
.footer {
  text-align: center;
  background-color: #000;
  color: #fff;
}

/* Hero */
.phones {
  position: relative;
}
.phone {
  position: relative;
  max-width: 80%;
  margin: 3rem auto -12rem;
}
.phone + .phone {
  display: none;
}

/* Header */
.header {
  background-image: url('../images/top001b.jpg');
  background-size: cover;
  background-color: #fff;
  vertical-align: bottom;
  text-align: left;
}
.crttech-heading {
  font-size: 2.6rem;
}

/* Header small */
.headersmall {
  background-image: url('../images/top001b.jpg');
  background-size: cover;
  background-color: #fff;
  vertical-align: bottom;
  text-align: left;
}

/* Values */
.values {
  background-image: url('../images/blur001.jpg');
  background-size: cover;
  background-color: #a2a2a2;
  background-color: #093d4b;
  color: #fff;
  padding-bottom: 5rem;
}
.value-multiplier {
  margin-bottom: .5rem;
  color: #11DFC7;
}
.value-heading {
  margin-bottom: .3rem;
}
.value-description {
  opacity: .8;
  font-weight: 300;
}

/* Quote */
.quote {
  font-size: 5rem;
  color: #fff;
}

/* Addr */
.addr {
  font-size: 1.2rem;
  color: #ffcc00;
  background: #000000;
  border: 1px solid #616161;
  border-radius: 6px;
  padding: .6rem .8rem;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  cursor: pointer; /* To show it's clickable */
  max-width: 250px; /* Adjust as needed */
}

/* Help */
.get-help {
  background-image: url('../images/waves002.jpg');
  background-size: cover;
  /* border-bottom: 1px solid #ddd; */
  background-color: #e3a3a3;
}

/* Categories */
.categories {
  background-image: url('../images/waves001.jpg');
  background-size: cover;
  background-color: #a2e2e2;
  color: #fff;
  border-top: 0px solid white;
}
.categories .section-description {
  margin-bottom: 4rem;
}

/* About */
.about {
  background-image: url('../images/waves001.jpg');
  background-size: cover;
  background-color: #003351;
  color: #fff;
  border-top: 0px solid white;
}

/* How it works */
.howitworks {
  background-color: #001023;
  color: #fff;
  border-top: 0px solid white;
}

/* What we deliver */
.whatwedeliver {
  background-color: #313131;
  color: #fff;
  border-top: 0px solid white;
}

/* Agency */
.agency {
  background-size: cover;
  background-color: #313131;
  color: #fff;
  border-top: 0px solid white;
}
.agency .section-description {
  margin-bottom: 4rem;
}

.underl {
  text-decoration: underline;
}

/* Form */
.formtextblack {
  color: #000;
}

/* Bigger than 300 */
@media (min-width: 300px) {
  .section {
    padding: 4rem 0 4rem;
  }
  .footer {
    padding: 2rem 0 1rem;
  }
  .hero {
    padding-bottom: 7rem;
    text-align: left;
    height: 100px;
  }
  .header {
    background-image: url('../images/top001b.jpg');
    background-size: cover;
  }
  .headerlogopic {
    width:100%;
    max-width:200px;
  }
  .crttech-heading {
    font-size: 2.6rem;
  }
  .phone {
    position: absolute;
    top: -7rem;
    right: 3rem;
    max-height: 362px;
    z-index: 3;
  }
  .phone + .phone {
    top: -6rem;
    display: block;
    max-width: 73.8%;
    right: 0;
    z-index: 2;
    max-height: 338px;
  }
  .hero-heading {
    font-size: 4rem;
    color: #fff;
  }
  .quote {
    font-size: 4rem;
    color: #fff;
  }
  .headersmall-heading {
    font-size: 2rem;
    color: #000;
  }
}

/* Bigger than 400 */
@media (min-width: 400px) {
  .section {
    padding: 4rem 0 4rem;
  }
  .footer {
    padding: 2rem 0 1rem;
  }
  .hero {
    padding-bottom: 7rem;
    text-align: left;
    height: 100px;
  }
  .header {
    background-image: url('../images/top001b.jpg');
    background-size: cover;
  }
  .headerlogopic {
    width:100%;
    max-width:200px;
  }
  .crttech-heading {
    font-size: 2.6rem;
  }
  .phone {
    position: absolute;
    top: -7rem;
    right: 3rem;
    max-height: 362px;
    z-index: 3;
  }
  .phone + .phone {
    top: -6rem;
    display: block;
    max-width: 73.8%;
    right: 0;
    z-index: 2;
    max-height: 338px;
  }
  .hero-heading {
    font-size: 4rem;
    color: #fff;
  }
  .quote {
    font-size: 4rem;
    color: #fff;
  }
  .headersmall-heading {
    font-size: 2rem;
    color: #000;
  }
}

/* Bigger than 550 */
@media (min-width: 550px) {
  .section {
    padding: 4rem 0 4rem;
  }
  .footer {
    padding: 2rem 0 2rem;
  }
  .hero {
    padding-bottom: 4rem;
    text-align: left;
    height: 100px;
  }
  .header {
    background-image: url('../images/top001b.jpg');
    background-size: cover;
  }
  .crttech-heading {
    font-size: 2.6rem;
  }
  .value-heading {
    font-size: 2.3rem;
  }
  .phone {
    position: absolute;
    top: -7rem;
    right: 3rem;
    max-height: 362px;
    z-index: 3;
  }
  .phone + .phone {
    top: -6rem;
    display: block;
    max-width: 73.8%;
    right: 0;
    z-index: 2;
    max-height: 338px;
  }
  .hero-heading {
    font-size: 4.4rem;
    color: #fff;
  }
  .quote {
    font-size: 4.4rem;
    color: #fff;
  }
  .headersmall-heading {
    font-size: 2rem;
    color: #000;
  }
}

/* Bigger than 750 */
@media (min-width: 750px) {
  .hero {
    padding: 10rem 0 8rem;
  }
  .hero-heading {
    font-size: 4.6rem;
    color: #fff;
  }
  .quote {
    font-size: 4.6rem;
    color: #fff;
  }
  .headersmall-heading {
    font-size: 2rem;
    color: #000;
  }
  .header {
    background-image: url('../images/top001b.jpg');
    background-size: cover;
  }
  .crttech-heading {
    font-size: 3.6rem;
  }
  .section {
    padding: 6rem 0 6rem;
  }
  .footer {
    padding: 4rem 0 3rem;
  }
  .section-description {
    max-width: 80%;
    margin-left: auto;
    margin-right: auto;
  }
  .phone {
    top: -14rem;
    right: 5rem;
    max-height: 510px;
  }
  .phone + .phone {
    top: -12rem;
    max-height: 472px;
  }
  .categories {
    padding: 15rem 0 8rem;
  }
}

/* Bigger than 1000 */
@media (min-width: 1000px) {
  .section {
    padding: 6rem 0 6rem;
  }
  .footer {
    padding: 4rem 0 3rem;
  }
  .hero {
    padding: 4rem 0 14rem;
  }
  .hero-heading {
    font-size: 5rem;
    color: #fff;
  }
  .quote {
    font-size: 5rem;
    color: #fff;
  }
  .headersmall-heading {
    font-size: 2rem;
    color: #000;
  }
  .header {
    background-image: url('../images/top001b.jpg');
    background-size: cover;
  }
  .crttech-heading {
    font-size: 4.0rem;
  }
  .phone {
    top: -16rem;
    max-height: 615px;
  }
  .phone + .phone {
    top: -14rem;
    max-height: 570px;
  }
}
