/**
 * Call To Action Block - Frontend Styles
 * These styles are loaded on the frontend
 */

.call-to-action-block { position: relative; }
.call-to-action-wrap { padding: 64px 0; max-width: 559px; width: 100%; }
.call-to-action-inner h2 { margin-bottom: 16px; }
.call-to-action-inner p { margin: 0; }
.call-to-action-inner a.btn { margin-top: 48px; }
.call-to-action-bg { width: 50%;height: 100%;position: absolute;right: 0; border-top-left-radius: 400px; border-bottom-left-radius: 400px; background-size: cover;  background-position: center center; top: 0; }
.call-to-action-wrap.without-image { max-width: 559px; margin: 0 auto; text-align: center; }

/*Responsive Css Start Here*/
@media only screen and (max-width: 1280px) {
    
}
@media only screen and (max-width: 1200px) {
    .call-to-action-wrap { max-width: 450px; }
}
@media only screen and (max-width: 1024px) {
     
}
@media only screen and (max-width: 991px) {
    .call-to-action-wrap { max-width: 340px; padding: 48px 0; }
    .call-to-action-bg { width: 53%; background-position: top center; }
    .call-to-action-inner a.btn { margin-top: 32px; }
}
@media only screen and (max-width: 767px) {
    .call-to-action-wrap { max-width: 100%; }
    .call-to-action-bg { width: 100%; position: relative; height: 475px; border-top-left-radius: 400px; border-top-right-radius: 400px; bottom: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-position: center center; }
    .call-to-action-wrap.without-image { max-width: 350px; margin: 0 auto; width: 100%; }
    .call-to-action-inner h2  { margin-bottom: 20px; }
    .call-to-action-inner p { font-size: 18px; line-height: 26px; }
    .call-to-action-inner a.btn { margin-top: 48px; }
}
@media only screen and (max-width: 576px) {
     .call-to-action-wrap { max-width: 100%; }
     .call-to-action-bg { height: 375px; background-position: top center;  }
}