.header{
  padding: 30rem 0;
  background-image: radial-gradient(circle at top,rgba(78, 92, 153, 0.5) 0%,rgba(0, 0, 0, 0.9) 94%),url("../img/back1.jpg") !important;
  background-position: 50%;
  background-size: 100%;
  background-size: cover;
  background-attachment: fixed;  
  color: #f7f9ff;
}

/* Detects devices where the primary input mechanism is touch */
@media (hover: none) and (pointer: coarse) {
  .header {
    background-attachment: scroll; /* Overrides to normal scrolling on iOS */
  }
}

.header .col-2-of-3{
  position: relative;
}

.header .col-2-of-3 img{
  position: absolute;
  top: 30%;
  bottom: 0;
  right: -180px;
  width: 150px;
  animation: rotate 10s infinite linear;
}

.heading-large{
  color: #f7f9ff;
  font-weight: 400;
}

.col-2-of-3>p{
  font-size: 1.6rem;
}

.grey{
  background-color: #f7f9ff;
}

.cards{
  margin-top: -35rem;
}

.cards .bubble{
  background-color: #0d0d0d;
  color: #fff;
}

.cards h2{
  font-weight: 700;
  font-size: 5rem;
  color: #fff;
}

section  iframe{
  width: 100%;
  height: 850px;
}

.footer-details{
  background-color: #0c0c0c;
}

.footer-details h2{
  color: #fff;
}

.footer-details p{
  color: #fff;
  font-size: 1.8rem;
}

.icons{
  float: left;
  height: 50px;
  width: 50px;
  padding: 1.4rem;
  border: 2px solid #fff;
  border-radius: 50%;
  margin-right: 2rem;
  cursor: pointer;

  &:hover{
    border: 2px solid #691111;
  }
}

.icons img{
  height: 100%;
}


@media screen and (max-width: 1000px) {
  .header .col-2-of-3 img{
    display: none;
  }

  .footer-details h2{
    color: #fff;
    font-weight: 700;
  }
}

.row video {
  width: 100%;
}

.pb0 {
  position: absolute;
  bottom: 0;
}

.pT0 {
  position: absolute;
  top: 0;
}

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}


.counter{
  font-size: 5rem;
  font-weight: 700;
}