.take_action--wrapper { position: relative; } .take_action--wrapper .take_action--row { background: var(--secondary-color); box-shadow: 15px 20px 50px rgba(0, 0, 0, 0.07); border-radius: 15px; margin: 0; flex-direction: column-reverse; } .take_action--row .take_action_img--wrapper { text-align: center; } .take_action--details { text-align: center; padding: 30px 10px 20px; } .take_action--details .take_action--title { font-family: var(--montserrat); font-style: normal; font-weight: bold; font-size: 30px; line-height: 36px; color: var(--white); margin-bottom: 0; } .take_action--details .take_action--subtitle { font-family: var(--open-sans); font-style: normal; font-weight: normal; font-size: 20px; line-height: 29px; color: var(--white); margin-bottom: 0; padding: 9px 0px; } .take_action--details .take_call { font-family: var(--open-sans); font-style: normal; font-weight: 800; font-size: 30px; line-height: 36px; color: var(--white); display: block; position: relative; } .take_action--details.dotted_map_before::before { z-index: 0; left: 3rem; bottom: -15rem; } @media ( min-width: 576px ) { .take_action--details .take_action--title { font-size: 40px; } .take_action--details .take_action--subtitle { line-height: 40px; } .take_action--details .take_call { font-size: 40px; line-height: 40px; } } @media ( min-width: 768px ) { .take_action--wrapper .take_action--row { flex-direction: inherit; } .take_action--details.dotted_map_before::before { left: 0rem; bottom: -4rem; } .take_action--wrapper { margin-top: 5rem; } } @media ( min-width: 992px ) { .take_action--wrapper { margin-top: 9.375rem; } .take_action--wrapper .take_action--row { height: 17.5rem; } .take_action--wrapper .left_col { position: relative; z-index: 99; } .take_action_img--wrapper { position: absolute; bottom: 0rem; } .take_action--details.dotted_map_before::before { left: -6rem; bottom: -6rem; } .take_action--details { padding: 4.4375rem 0rem 4.5rem; } } @media ( min-width: 1200px ) { .take_action--details { padding: 4.4375rem 9rem 4.5rem 0rem; } .take_action--details.dotted_map_before::before { left: -15rem; bottom: -15rem; } } /* take action */ .take-action-now-wrapper2 { position: relative; z-index: 1000; } .take-action-now-wrapper2 .action-row { position: relative; background: #1267e5; box-shadow: 15px 20px 50px rgba(0, 0, 0, 0.07); border-radius: 15px; margin: 0; } .take-action-now-wrapper2 .action-row:before { content: ""; position: absolute; background: url("../../images/dotted.png") no-repeat 0 0; background-size: 100%; z-index: -1; width: 50rem; height: 40rem; left: -17rem; top: -7px; display: none; } .take-action-now-wrapper2 .action-right-col { position: relative; padding: 1.5rem; } .take-action-now-wrapper2 .action-right-col::before { content: ""; position: absolute; background: url("../../images/dotted.png") no-repeat 0 0; background-size: 100%; z-index: 0; width: 473px; height: 274px; left: -7rem; top: 0px; } .take-action-now-wrapper2 .action-left-col { position: relative; } .take-action-now-wrapper2 .action-left-col .action-img { position: absolute; width: auto; bottom: 0; z-index: 1; margin-top: 1.5rem; margin-bottom: 1.5rem; } .take-action-now-wrapper2 .action-right-col .action-details-wrapper { text-align: center; } .take-action-now-wrapper2 .action-right-col .action-details-wrapper h2 { font-family: var(--montserrat); font-style: normal; font-weight: bold; font-size: 40px; line-height: 36px; color: #ffffff; } .take-action-now-wrapper2 .action-right-col .action-details-wrapper p { font-family: var(--open-sans); font-style: normal; font-weight: normal; font-size: 20px; line-height: 40px; color: #ffffff; } .take-action-now-wrapper2 .action-right-col .action-details-wrapper a { font-family: var(--open-sans); font-style: normal; font-weight: 800; font-size: 40px; line-height: 40px; color: #ffffff; } @media (max-width: 767px) { .take-action-now-wrapper2 { margin-bottom: 5rem; } .take-action-now-wrapper2 .action-left-col .action-img { position: relative; width: auto; top: 0; text-align: center; } .take-action-now-wrapper2 .action-right-col::before { width: 273px; height: 274px; left: 0; } .take-action-now-wrapper2 .action-right-col .action-details-wrapper h2 { font-size: 30px; line-height: 34px; padding-bottom: 5px; } .take-action-now-wrapper2 .action-right-col .action-details-wrapper p { font-size: 16px; line-height: 26px; } .take-action-now-wrapper2 .action-right-col .action-details-wrapper a { font-size: 30px; line-height: 33px; } } @media (min-width: 768px) { .take-action-now-wrapper2 { margin-bottom: -8rem; } .take-action-now-wrapper2 .action-row { margin: 0; } .take-action-now-wrapper2 .action-row::before { display: block; } .take-action-now-wrapper2 .action-right-col { padding: 3rem; } .take-action-now-wrapper2 .action-left-col .action-img { margin-bottom: 0rem; width: 27rem; } } @media (min-width: 992px) { .take-action-now-wrapper2 .action-left-col .action-img { width: 400px; } .take-action-now-wrapper2 .action-right-col { padding: 6rem; align-items: center; display: flex; justify-content: center; } .take-action-now-wrapper2 .action-right-col .action-details-wrapper h2 { font-size: 30px; line-height: 28px; } .take-action-now-wrapper2 .action-right-col .action-details-wrapper p { font-size: 16px; line-height: 33px; } .take-action-now-wrapper2 .action-right-col .action-details-wrapper a { font-size: 30px; line-height: 33px; } .take-action-now-wrapper2 .action-right-col::before { width: 320px; left: 0; } } @media (min-width: 1366px) { .take-action-now-wrapper2 .action-right-col { padding: 7rem; } .take-action-now-wrapper2 .action-right-col .action-details-wrapper h2 { font-size: 40px; line-height: 36px; margin-bottom: 1rem; } .take-action-now-wrapper2 .action-right-col .action-details-wrapper p { font-size: 20px; line-height: 40px; margin-bottom: 1.5rem; } .take-action-now-wrapper2 .action-right-col .action-details-wrapper a { font-size: 40px; line-height: 40px; } .take-action-now-wrapper2 .action-left-col .action-img { left: 8.5rem; } }