/* ================= CTA start ================= */
.cta-main-container{padding: 35px 0 35px 0;min-height: 238px;}
.cta-main-content h3{width: 400px; font-size: 45px;line-height: 1;font-weight: 700;margin-bottom: 0;color: #fff;}
.cta-main-content p{margin: 0;}
.cta-main-content p a{font-weight: 700;color: var(--teal-color); }
.cta-main-content p a:hover{text-decoration: underline;}
.cta-main-btn{width: 150px; position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
.cta-main-btn .btn{padding: 10px 15px; }
.blue-bg .cta-main-content, .blue-pattern .cta-main-content { color: #fff; }
.gray-bg .cta-main-content h3, .gray-pattern .cta-main-content h3 { color: inherit; }
.orange-bg .cta-main-content p{color: #fff;}
.orange-bg .cta-main-content p a{color: var(--blue-color); }
.blue-bg .cta-main-content p a{color: var(--orange-color); }
.cta-main-text{width:calc(100% - 400px);}
.has-cta .cta-main-text{width:calc(100% - 350px); padding-right: 170px;position: relative;}
.has-cta .cta-main-content h3{width:350px; }
/* ================= CTA End ================= */

/* ========================================== 
! Large devices (desktops, less than 1200px)
=========================================== */
@media (max-width:1199.98px) { }

/*==========================================
! Medium devices (tablets, less than 992px)
========================================== */
@media (max-width:991.98px) {
.cta-main-content h3{font-size: 36px;}
.has-cta .cta-main-content h3, .cta-main-content h3{width: 300px;}
.has-cta .cta-main-text, .cta-main-text{width:calc(100% - 300px);}
 
}

/* =================================================  
 ! Small devices (landscape phones, less than 768px)
 ================================================= */
@media (max-width:767.98px) {
  .cta-main-content{flex-flow: column; text-align: center; }
  .cta-main-container{padding: 44px 0 50px; }
  .cta-main-content h3, .has-cta .cta-main-content h3{font-size: 30px; margin-bottom: 12px; line-height: 40px; width: 100%; }
  .cta-main-content p, .has-cta .cta-main-content p{width: 100%; padding:0;}
  .cta-main-btn{width: 100%;margin-top: 21px;position: relative;top: auto;transform: none;right: auto;}
  .has-cta .cta-main-text, .cta-main-text{width: 100%; padding: 0;}
}

/* ======================================================
 ! Extra small devices (portrait phones, less than 576px)
 ====================================================== */
@media (max-width:575.98px) { }