.servicesTitle {
   display: flex;
   justify-content: right;
   margin-top: -20px;
   height: 80px;
   background: linear-gradient(to right, rgba(230, 233, 235, 0.7), rgb(172, 34, 107, 1.0));
}

.servicesTitle h2 {
   color: #E7E7E7;
   font-weight: bold;
   letter-spacing: 2px;
   font-size: 180%;
   margin-top: 34px;
   margin-right: 60px;
}

.serviceContainer {
   display: flex;
   justify-content: center;
   align-items: center;
   flex-wrap: wrap;
}

.serviceGoldBg {
   background-image: url(/images/ServicesBgTextureGold.jpg);
}

.announcementContainer {
   display: flex;
   justify-content: center;
   color: #49748e;
   padding: 4%;
   color: #49748e;
   background-color: #f2f2f2;
   width: 100%;
}

.announcement {
   max-width: 90%;
   font-family: Arial;
   font-style: oblique;
   font-size: 150%;
   text-align: center;
}

#lessonsImage {
   max-width: 1120px;
}

#longImage {
   width: 100%;
}

#subscribeCont {
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 20px;
   padding: 3%;
   font-size: 90%;
   color: #545454;
}

#subscribeCont a:link {
   color: #49748E;
}

#blueButton {
   max-width: 150px;
   cursor: pointer;
   margin-bottom: 25%;
}

#comingSoonContainer {
   max-width: 50%;
   padding: 4%;
}

.dropShadowBlue {
   filter: drop-shadow(0px 0px 6px #226AAB);
}

@media screen and (max-width: 850px) and (min-width: 619px) {

   .servicesTitle h2 {
      margin-right: 40px;
   }

   #subscribeCont {
      font-size: 85%;
   }
   
}

@media screen and (max-width: 618px) {

   .servicesTitle h2 {
      font-size: 160%;
      margin-top: 36px;
      margin-right: 20px;
   }

   .announcementContainer {
      padding: 12%;
   }

   .announcement {
      max-width: 100%;
      font-size: 130%;
   }

   #subscribeCont {
      font-size: 80%;
   }

   #blueButton {
      max-width: 120px;
   }

}