1

css
.spacer-80 { height: 80px; } .single-price-table { position: relative; z-index: 1; overflow: hidden; margin-bottom: 30px; -webkit-transition: all 0.24s ease-in-out; transition: all 0.24s ease-in-out; border: 1px solid #e0e0e0; border-radius: 10px; } .single-price-table .price-design-elemnts { position: absolute; visibility: hidden; -webkit-transition: all 0.24s ease-in-out; transition: all 0.24s ease-in-out; opacity: 0; border-radius: 50%; -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'; filter: alpha(opacity=0); } .single-price-table .price-design-elemnts.one { line-height: 145px; top: -30px; left: -50px; width: 145px; height: 145px; background-color: #346bf0; } .single-price-table .price-design-elemnts.two { line-height: 86px; bottom: 60px; left: -30px; width: 86px; height: 86px; background-color: #eea634; } .single-price-table .price-design-elemnts.three { line-height: 145px; right: -50px; bottom: -30px; width: 145px; height: 145px; background-color: #8543d6; } .single-price-table .price-design-elemnts.four { line-height: 44px; top: 50px; right: 50px; width: 44px; height: 44px; background-color: #31e1a1; } .single-price-table .price-header { padding-top: 40px; padding-bottom: 40px; -webkit-transition: all 0.24s ease-in-out; transition: all 0.24s ease-in-out; border-top-left-radius: 10px; border-top-right-radius: 10px; background-color: #fbfbfb; } .single-price-table .price-header span.package-title { font-size: 30px; font-weight: 600; display: block; margin-bottom: 30px; color: #132150; } .single-price-table .price-header span.package-amount { font-size: 60px; font-weight: 600; color: #684ef6; } .single-price-table .price-header span.package-amount span { font-weight: 400; color: #494a54; } .single-price-table .price-header span.package-amount span:nth-child(1) { font-size: 34px; } .single-price-table .price-header span.package-amount span:nth-child(2) { font-size: 18px; } .single-price-table .price-body { padding-top: 40px; padding-bottom: 30px; } .single-price-table .price-body ul { margin: 0; padding: 0; list-style: none; } .single-price-table .price-body ul li { display: block; padding: 0 0 8px; } .single-price-table .price-body ul li:last-child { padding-bottom: 0; } .single-price-table .price-footer { padding-bottom: 40px; } .single-price-table .price-footer a { padding: 16px 48px; text-transform: uppercase; } .single-price-table:hover { background-color: #31348c; } .single-price-table:hover .price-header { background-color: #31348c; } .single-price-table:hover .price-header span.package-title { color: #fff; } .single-price-table:hover .price-header span.package-amount { color: #fff; } .single-price-table:hover .price-header span.package-amount span { color: #fff; } .single-price-table:hover .price-body ul li { color: #fff; } .single-price-table:hover .price-design-elemnts { visibility: visible; opacity: 1; -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)'; filter: alpha(opacity=100); } .single-price-table:hover .price-design-elemnts.one { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table:hover .price-design-elemnts.three { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table:hover .price-design-elemnts.two { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table:hover .price-design-elemnts.four { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table.active { background-color: #31348c; } .single-price-table.active .price-header { background-color: #31348c; } .single-price-table.active .price-header span.package-title { color: #fff; } .single-price-table.active .price-header span.package-amount { color: #fff; } .single-price-table.active .price-header span.package-amount span { color: #fff; } .single-price-table.active .price-body ul li { color: #fff; } .single-price-table.active .price-design-elemnts { visibility: visible; opacity: 1; -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)'; filter: alpha(opacity=100); } .single-price-table.active .price-design-elemnts.one { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table.active .price-design-elemnts.three { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table.active .price-design-elemnts.two { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table.active .price-design-elemnts.four { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table.layout-two .price-header span.package-amount { color: #0d9ce8; } .single-price-table.layout-two:hover { background-color: transparent; background-image: -webkit-linear-gradient(177deg, #8a8aec 0%, #b6d2f9 100%); background-image: linear-gradient(-87deg, #8a8aec 0%, #b6d2f9 100%); } .single-price-table.layout-two:hover .price-header { background-color: transparent; background-image: -webkit-linear-gradient(177deg, #8a8aec 0%, #b6d2f9 100%); background-image: linear-gradient(-87deg, #8a8aec 0%, #b6d2f9 100%); } .single-price-table.layout-two:hover .price-header span.package-amount { color: #fff; } .single-price-table.layout-two.active { background-color: transparent; background-image: -webkit-linear-gradient(177deg, #8a8aec 0%, #b6d2f9 100%); background-image: linear-gradient(-87deg, #8a8aec 0%, #b6d2f9 100%); } .single-price-table.layout-two.active .price-header { background-color: transparent; background-image: -webkit-linear-gradient(177deg, #8a8aec 0%, #b6d2f9 100%); background-image: linear-gradient(-87deg, #8a8aec 0%, #b6d2f9 100%); } .single-price-table.layout-two.active .price-header span.package-amount { color: #fff; } .single-price-table.layout-three .price-footer a { border-radius: 999px; } .single-price-table.layout-three .price-footer a:after { border-radius: 999px; } .single-price-table.layout-three .price-header span.package-amount { color: #684ef6; } .single-price-table.layout-three:hover { background-color: transparent; background-image: -webkit-gradient(linear, right top, left top, from(#2923e6), to(#6b69fb)); background-image: -webkit-linear-gradient(right, #2923e6, #6b69fb); background-image: linear-gradient(to left, #2923e6, #6b69fb); } .single-price-table.layout-three:hover .price-header { background-color: transparent; background-image: -webkit-gradient(linear, right top, left top, from(#2923e6), to(#6b69fb)); background-image: -webkit-linear-gradient(right, #2923e6, #6b69fb); background-image: linear-gradient(to left, #2923e6, #6b69fb); } .single-price-table.layout-three:hover .price-header span.package-amount { color: #fff; } .single-price-table.layout-three.active { background-color: transparent; background-image: -webkit-gradient(linear, right top, left top, from(#2923e6), to(#6b69fb)); background-image: -webkit-linear-gradient(right, #2923e6, #6b69fb); background-image: linear-gradient(to left, #2923e6, #6b69fb); } .single-price-table.layout-three.active .price-header { background-color: transparent; background-image: -webkit-gradient(linear, right top, left top, from(#2923e6), to(#6b69fb)); background-image: -webkit-linear-gradient(right, #2923e6, #6b69fb); background-image: linear-gradient(to left, #2923e6, #6b69fb); } .single-price-table.layout-three.active .price-header span.package-amount { color: #fff; } @media (max-width: 991.98px) { .price-space.spacer-150 { height: 70px; } .price-area.home-two .spacer-80 { height: 40pxs; } .spacer-80 { height: 80px; } .single-price-table { position: relative; z-index: 1; overflow: hidden; margin-bottom: 30px; -webkit-transition: all 0.24s ease-in-out; transition: all 0.24s ease-in-out; border: 1px solid #e0e0e0; border-radius: 10px; } .single-price-table .price-design-elemnts { position: absolute; visibility: hidden; -webkit-transition: all 0.24s ease-in-out; transition: all 0.24s ease-in-out; opacity: 0; border-radius: 50%; -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'; filter: alpha(opacity=0); } .single-price-table .price-design-elemnts.one { line-height: 145px; top: -30px; left: -50px; width: 145px; height: 145px; background-color: #346bf0; } .single-price-table .price-design-elemnts.two { line-height: 86px; bottom: 60px; left: -30px; width: 86px; height: 86px; background-color: #eea634; } .single-price-table .price-design-elemnts.three { line-height: 145px; right: -50px; bottom: -30px; width: 145px; height: 145px; background-color: #8543d6; } .single-price-table .price-design-elemnts.four { line-height: 44px; top: 50px; right: 50px; width: 44px; height: 44px; background-color: #31e1a1; } .single-price-table .price-header { padding-top: 40px; padding-bottom: 40px; -webkit-transition: all 0.24s ease-in-out; transition: all 0.24s ease-in-out; border-top-left-radius: 10px; border-top-right-radius: 10px; background-color: #fbfbfb; } .single-price-table .price-header span.package-title { font-size: 30px; font-weight: 600; display: block; margin-bottom: 30px; color: #132150; } .single-price-table .price-header span.package-amount { font-size: 60px; font-weight: 600; color: #684ef6; } .single-price-table .price-header span.package-amount span { font-weight: 400; color: #494a54; } .single-price-table .price-header span.package-amount span:nth-child(1) { font-size: 34px; } .single-price-table .price-header span.package-amount span:nth-child(2) { font-size: 18px; } .single-price-table .price-body { padding-top: 40px; padding-bottom: 30px; } .single-price-table .price-body ul { margin: 0; padding: 0; list-style: none; } .single-price-table .price-body ul li { display: block; padding: 0 0 8px; } .single-price-table .price-body ul li:last-child { padding-bottom: 0; } .single-price-table .price-footer { padding-bottom: 40px; } .single-price-table .price-footer a { padding: 16px 48px; text-transform: uppercase; } .single-price-table:hover { background-color: #31348c; } .single-price-table:hover .price-header { background-color: #31348c; } .single-price-table:hover .price-header span.package-title { color: #fff; } .single-price-table:hover .price-header span.package-amount { color: #fff; } .single-price-table:hover .price-header span.package-amount span { color: #fff; } .single-price-table:hover .price-body ul li { color: #fff; } .single-price-table:hover .price-design-elemnts { visibility: visible; opacity: 1; -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)'; filter: alpha(opacity=100); } .single-price-table:hover .price-design-elemnts.one { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table:hover .price-design-elemnts.three { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table:hover .price-design-elemnts.two { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table:hover .price-design-elemnts.four { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table.active { background-color: #31348c; } .single-price-table.active .price-header { background-color: #31348c; } .single-price-table.active .price-header span.package-title { color: #fff; } .single-price-table.active .price-header span.package-amount { color: #fff; } .single-price-table.active .price-header span.package-amount span { color: #fff; } .single-price-table.active .price-body ul li { color: #fff; } .single-price-table.active .price-design-elemnts { visibility: visible; opacity: 1; -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)'; filter: alpha(opacity=100); } .single-price-table.active .price-design-elemnts.one { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table.active .price-design-elemnts.three { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table.active .price-design-elemnts.two { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table.active .price-design-elemnts.four { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; -webkit-animation: zoomIn 400ms ease-in-out; animation: zoomIn 400ms ease-in-out; } .single-price-table.layout-two .price-header span.package-amount { color: #0d9ce8; } .single-price-table.layout-two:hover { background-color: transparent; background-image: -webkit-linear-gradient(177deg, #8a8aec 0%, #b6d2f9 100%); background-image: linear-gradient(-87deg, #8a8aec 0%, #b6d2f9 100%); } .single-price-table.layout-two:hover .price-header { background-color: transparent; background-image: -webkit-linear-gradient(177deg, #8a8aec 0%, #b6d2f9 100%); background-image: linear-gradient(-87deg, #8a8aec 0%, #b6d2f9 100%); } .single-price-table.layout-two:hover .price-header span.package-amount { color: #fff; } .single-price-table.layout-two.active { background-color: transparent; background-image: -webkit-linear-gradient(177deg, #8a8aec 0%, #b6d2f9 100%); background-image: linear-gradient(-87deg, #8a8aec 0%, #b6d2f9 100%); } .single-price-table.layout-two.active .price-header { background-color: transparent; background-image: -webkit-linear-gradient(177deg, #8a8aec 0%, #b6d2f9 100%); background-image: linear-gradient(-87deg, #8a8aec 0%, #b6d2f9 100%); } .single-price-table.layout-two.active .price-header span.package-amount { color: #fff; } .single-price-table.layout-three .price-footer a { border-radius: 999px; } .single-price-table.layout-three .price-footer a:after { border-radius: 999px; } .single-price-table.layout-three .price-header span.package-amount { color: #684ef6; } .single-price-table.layout-three:hover { background-color: transparent; background-image: -webkit-gradient(linear, right top, left top, from(#2923e6), to(#6b69fb)); background-image: -webkit-linear-gradient(right, #2923e6, #6b69fb); background-image: linear-gradient(to left, #2923e6, #6b69fb); } .single-price-table.layout-three:hover .price-header { background-color: transparent; background-image: -webkit-gradient(linear, right top, left top, from(#2923e6), to(#6b69fb)); background-image: -webkit-linear-gradient(right, #2923e6, #6b69fb); background-image: linear-gradient(to left, #2923e6, #6b69fb); } .single-price-table.layout-three:hover .price-header span.package-amount { color: #fff; } .single-price-table.layout-three.active { background-color: transparent; background-image: -webkit-gradient(linear, right top, left top, from(#2923e6), to(#6b69fb)); background-image: -webkit-linear-gradient(right, #2923e6, #6b69fb); background-image: linear-gradient(to left, #2923e6, #6b69fb); } .single-price-table.layout-three.active .price-header { background-color: transparent; background-image: -webkit-gradient(linear, right top, left top, from(#2923e6), to(#6b69fb)); background-image: -webkit-linear-gradient(right, #2923e6, #6b69fb); background-image: linear-gradient(to left, #2923e6, #6b69fb); } .single-price-table.layout-three.active .price-header span.package-amount { color: #fff; } @media (max-width: 991.98px) { .price-space.spacer-150 { height: 70px; } .price-area.home-two .spacer-80 { height: 40pxs; } }