/*** ==================================================================== Price Page Section ==================================================================== ***/ .price-page-section { padding: 30px 0 0 0; position: relative; @include media-breakpoint-up(lg) { padding-top: 140px; } h4 { font-weight: 400; } .sec-title .theme-btn .txt { @include media-breakpoint-down(sm) { font-size: 18px; } } } .price-block { margin-bottom: 30px; position: relative; } .price-block .inner-box { position: relative; border-radius: 7px; box-shadow: 0 0 0 1px var(--brand-gray); } .price-block .inner-box .title { display: block; padding: 24px 15px; position: relative; text-align: center; text-transform: capitalize; color: var(--brand-secondary); border-bottom: 1px solid #f2f2f2; font-family: $font-family-non-content; font-size: 28px; font-weight: 700; line-height: 1.3em; } .price-block .inner-box .content-box { padding: 30px 28px; position: relative; text-align: center; } .price-block .inner-box .content-box .price-box { position: relative; color: var(--brand-primary); font-family: $font-family-non-content; font-size: 28px; font-weight: 700; } .price-block .inner-box .content-box .price-box .icon { display: inline-block; position: relative; color: #a163f5; font-weight: 400; line-height: 1em; } .price-block .inner-box .content-box .price-box .price-title { display: block; margin-top: 18px; position: relative; color: var(--brand-secondary); font-size: 18px; font-weight: 400; } .price-block .inner-box .content-box .text { margin-top: 20px; margin-bottom: 30px; position: relative; text-align: center; color: var(--brand-secondary); font-size: 16px; line-height: 1.8em; } .price-block .inner-box .content-box .start-btn { display: flex; justify-content: center; padding: 13px 20px; position: relative; color: var(--brand-primary); border: 1px solid var(--brand-primary); border-radius: 50px; font-family: $font-family-non-content; font-size: 18px; font-weight: 400; } .price-block .inner-box .content-box .start-btn:hover { color: #ffffff; background-color: var(--brand-primary); } .price-block .inner-box .price-list { margin-top: 35px; margin-left: 15px; position: relative; text-align: left; } .price-block .inner-box .price-list li { margin-bottom: 8px; padding-left: 15px; position: relative; color: var(--brand-secondary); font-family: $font-family-non-content; font-size: 14px; font-weight: 500; } .price-block .inner-box .price-list li:before { width: 6px; height: 6px; position: absolute; top: 7px; left: 0; content: ''; border-radius: 50px; background-color: var(--brand-primary); } /* Price Block Two */ .price-block-two { margin-bottom: 30px; position: relative; } .price-block-two .inner-box { position: relative; box-shadow: 0 0 10px rgba(0, 0, 0, 0.10); } .price-block-two .inner-box .upper-box { position: relative; background-repeat: no-repeat; background-position: center center; } .price-block-two .inner-box .upper-box:before { position: absolute; z-index: -1; top: 0; right: 0; bottom: 0; left: 0; content: ''; background-image: linear-gradient(to bottom, #6a15d0, #5d2ec3, #543ab4, #4f42a3, #4d4891); } .price-block-two .inner-box .upper-box .title { display: block; padding: 24px 15px; position: relative; text-align: center; text-transform: capitalize; color: #ffffff; border-bottom: 1px solid rgba(255, 255, 255, 0.10); font-family: $font-family-non-content; font-size: 36px; font-weight: 700; line-height: 1.3em; } .price-block-two .inner-box .upper-box .price-box { display: block; padding: 44px 0 24px; position: relative; text-align: center; color: var(--brand-primary); font-family: $font-family-non-content; font-size: 66px; font-weight: 700; line-height: 35px; } .price-block-two .inner-box .upper-box .price-box .price-title { display: block; margin-top: 18px; position: relative; color: #ffffff; font-size: 18px; font-weight: 400; } .price-block-two .inner-box .lower-content { padding: 40px 35px 50px; position: relative; text-align: center; } .price-block-two .inner-box .lower-content:before { width: 100%; height: 0; position: absolute; top: 0; left: 0; content: ''; /* transition:all 500ms ease; */ /* -moz-transition:all 500ms ease; */ /* -webkit-transition:all 500ms ease; */ /* -ms-transition:all 500ms ease; */ /* -o-transition:all 500ms ease; */ background-image: linear-gradient(to bottom, #4c4891, #4c4891, #4c4891, #4c4891, #4c4891); } .price-block-two .inner-box:hover .lower-content:before { height: 100%; } .price-block-two .inner-box .lower-content .start-btn { padding: 13px 80px; position: relative; color: var(--brand-primary); border: 1px solid var(--brand-primary); border-radius: 50px; font-family: $font-family-non-content; font-size: 18px; font-weight: 400; /* transition:all 500ms ease; */ /* -moz-transition:all 500ms ease; */ /* -webkit-transition:all 500ms ease; */ /* -ms-transition:all 500ms ease; */ /* -o-transition:all 500ms ease; */ } .price-block-two .inner-box:hover .lower-content .start-btn { color: var(--brand-primary); border-color: #ffffff; background-color: #ffffff; } .price-block-two .inner-box .lower-content .start-btn:hover { color: #ffffff; background-color: var(--brand-primary); } .price-block-two .inner-box .lower-content .price-list { margin-bottom: 30px; margin-left: 15px; position: relative; text-align: left; } .price-block-two .inner-box .lower-content .price-list li { margin-bottom: 10px; padding-left: 15px; position: relative; color: var(--brand-secondary); font-family: $font-family-non-content; font-size: 15px; font-weight: 500; /* transition:all 500ms ease; */ /* -moz-transition:all 500ms ease; */ /* -webkit-transition:all 500ms ease; */ /* -ms-transition:all 500ms ease; */ /* -o-transition:all 500ms ease; */ } .price-block-two .inner-box .lower-content .price-list li.check:after { position: absolute; right: 0; content: "\f1d1"; color: #c194f5; font-family: "Flaticon"; font-size: 10px; font-weight: 700; line-height: 1em; } .price-block-two .inner-box .lower-content .price-list li.cross:after { position: absolute; right: 0; content: "\f144"; color: var(--brand-primary); font-family: "Flaticon"; font-size: 10px; font-weight: 700; line-height: 1em; } .price-block-two .inner-box:hover .lower-content .price-list li { color: #ffffff; } .price-block-two .inner-box .lower-content .price-list li:before { width: 6px; height: 6px; position: absolute; top: 7px; left: 0; content: ''; border-radius: 50px; background-color: var(--brand-primary); }