.pricing-container ol,
ul {
list-style: none;
}
.pricing-container ul li {
margin-bottom: 0px;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: '';
content: none;
}
.pricing-container {
width: 90%;
max-width: 1170px;
margin: 3em auto;
}
.pricing-container.full-width {
width: 100%;
max-width: none;
}
.pricing-switcher {
text-align: center;
width: 360px;
margin-left: auto;
margin-right: auto;
max-width: 360px;
}
.pricing-switcher .fieldset {
display: inline-block;
position: relative;
padding: 2px;
border-radius: 50em;
border: none;
background-color: #b6f0f2;
color: #fff;
margin-right: 11px;
}
.pricing-switcher input[type="radio"] {
position: absolute;
opacity: 0;
}
.pricing-switcher label {
position: relative;
z-index: 1;
display: inline-block;
float: left;
width: 90px;
height: 40px;
line-height: 40px;
cursor: pointer;
font-size: 1.4rem;
color: #2b2a29;
margin-bottom: 1px;
}
.pricing-switcher .switch {
position: absolute;
top: 2px;
left: 2px;
height: 40px;
width: 90px;
background-color: #ea638c;
color: #fff;
border-radius: 50em;
-webkit-transition: -webkit-transform 0.5s;
-moz-transition: -moz-transform 0.5s;
transition: transform 0.5s;
}
.pricing-switcher input[type="radio"]:checked+label+.switch,
.pricing-switcher input[type="radio"]:checked+label:nth-of-type(n)+.switch {
-webkit-transform: translateX(90px);
-moz-transform: translateX(90px);
-ms-transform: translateX(90px);
-o-transform: translateX(90px);
transform: translateX(90px);
}
.no-js .pricing-switcher {
display: none;
}
.pricing-list {
margin: 2em 0 0;
}
.pricing-list>li {
position: relative;
margin-bottom: 0;
}
@media only screen and (min-width:768px) {
.pricing-list {
margin: 3em 0 0;
}
.pricing-list:after {
content: "";
display: table;
clear: both;
}
.pricing-list>li {
width: 25%;
float: left;
padding-left: 5px;
padding-right: 5px;
}
.has-margins .pricing-list>li {
width: 25%;
float: left;
margin-right: 1.5%;
}
.has-margins .pricing-list>li:last-of-type {
margin-right: 0;
}
}
.pricing-wrapper {
position: relative;
}
.touch .pricing-wrapper {
-webkit-perspective: 2000px;
-moz-perspective: 2000px;
perspective: 2000px;
}
.pricing-wrapper.is-switched .is-visible {
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
-ms-transform: rotateY(180deg);
-o-transform: rotateY(180deg);
transform: rotateY(180deg);
-webkit-animation: rotate 0.5s;
-moz-animation: rotate 0.5s;
animation: rotate 0.5s;
}
.pricing-wrapper.is-switched .is-hidden {
-webkit-transform: rotateY(0);
-moz-transform: rotateY(0);
-ms-transform: rotateY(0);
-o-transform: rotateY(0);
transform: rotateY(0);
-webkit-animation: rotate-inverse 0.5s;
-moz-animation: rotate-inverse 0.5s;
animation: rotate-inverse 0.5s;
opacity: 0;
}
.pricing-wrapper.is-switched .is-selected {
opacity: 1;
}
.pricing-wrapper.is-switched.reverse-animation .is-visible {
-webkit-transform: rotateY(-180deg);
-moz-transform: rotateY(-180deg);
-ms-transform: rotateY(-180deg);
-o-transform: rotateY(-180deg);
transform: rotateY(-180deg);
-webkit-animation: rotate-back 0.5s;
-moz-animation: rotate-back 0.5s;
animation: rotate-back 0.5s;
}
.pricing-wrapper.is-switched.reverse-animation .is-hidden {
-webkit-transform: rotateY(0);
-moz-transform: rotateY(0);
-ms-transform: rotateY(0);
-o-transform: rotateY(0);
transform: rotateY(0);
-webkit-animation: rotate-inverse-back 0.5s;
-moz-animation: rotate-inverse-back 0.5s;
animation: rotate-inverse-back 0.5s;
opacity: 0;
}
.pricing-wrapper.is-switched.reverse-animation .is-selected {
opacity: 1;
}
.pricing-wrapper>li {
background-color: #fff;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
outline: 1px solid transparent;
}
.pricing-wrapper>li::after {
content: '';
position: absolute;
top: 0;
right: 0;
height: 100%;
width: 50px;
pointer-events: none;
/*
background:-webkit-linear-gradient( right , #fff, rgba(255, 255, 255, 0));
background:linear-gradient(to left, #fff, rgba(255, 255, 255, 0));
*/
}
.pricing-wrapper>li.is-ended::after {
display: none;
}
.pricing-wrapper .is-visible {
position: relative;
z-index: 5;
border: solid 1px #11b8bb;
border-radius: 5px;
}
.pricing-wrapper .is-hidden {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 1;
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
-ms-transform: rotateY(180deg);
-o-transform: rotateY(180deg);
transform: rotateY(180deg);
}
.pricing-wrapper .is-selected {
z-index: 3 !important;
}
@media only screen and (min-width:768px) {
.pricing-wrapper>li::before {
content: '';
position: absolute;
z-index: 6;
left: -1px;
top: 50%;
bottom: auto;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
height: 50%;
width: 1px;
background-color: #b1d6e8;
}
.pricing-wrapper>li::after {
display: none;
}
.exclusive .pricing-wrapper>li {
/*box-shadow:inset 0 0 0 8px #EA638C;*/
}
.has-margins .pricing-wrapper>li,
.has-margins .exclusive .pricing-wrapper>li {
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
}
:nth-of-type(1)>.pricing-wrapper>li::before {
display: none;
}
.has-margins .pricing-wrapper>li {
border-radius: 4px 4px 6px 6px;
}
.has-margins .pricing-wrapper>li::before {
display: none;
}
}
@media only screen and (min-width:1500px) {
.full-width .pricing-wrapper>li {
padding: 2.5em 0;
}
}
.no-js .pricing-wrapper .is-hidden {
position: relative;
-webkit-transform: rotateY(0);
-moz-transform: rotateY(0);
-ms-transform: rotateY(0);
-o-transform: rotateY(0);
transform: rotateY(0);
margin-top: 1em;
}
@media only screen and (min-width:768px) {
.exclusive .pricing-wrapper>li::before {
display: none;
}
.exclusive+li .pricing-wrapper>li::before {
display: none;
}
}
.pricing-header h2 {
padding: 0.9em 0 0.4em;
font-weight: 400;
margin-bottom: 30px;
margin-top: 0px;
text-transform: uppercase;
text-align: center;
}
.pricing-header {
height: auto;
padding: 0 0 1em;
pointer-events: auto;
text-align: center;
color: #2b2a29;
background-color: transparent;
}
.exclusive .pricing-header {
color: #fff;
background-color: #ea638c;
}
.exclusive .pricing-footer {
color: #fff;
background-color: #ea638c;
}
.pricing-header h2 {
/* font-size:2.8rem;*/
font-size: 24px;
letter-spacing: 2px;
}
.currency,
.value {
font-size: 3rem;
font-weight: 300;
}
.duration {
font-weight: 700;
font-size: 1.3rem;
color: #2b2a29;
text-transform: uppercase;
}
.exclusive .duration {
color: #fff;
}
.duration::before {
content: '/';
margin-right: 2px;
}
.value {
font-size: 4rem;
font-weight: 300;
}
.currency,
.duration {
color: #2b2a29;
}
.exclusive .currency,
.exclusive .duration {
color: #fff;
}
.currency {
display: inline-block;
margin-top: 10px;
vertical-align: top;
font-size: 2rem;
font-weight: 700;
}
.duration {
font-size: 1.4rem;
}
.pricing-body {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.is-switched .pricing-body {
overflow: hidden;
}
.pricing-body {
overflow-x: visible;
}
.pricing-features {
width: 600px;
}
.pricing-features:after {
content: "";
display: table;
clear: both;
}
.pricing-features li {
width: 100px;
float: left;
padding: 1.6em 1em;
font-size: 1.5rem;
text-align: center;
/*white-space:nowrap;*/
overflow: hidden;
text-overflow: ellipsis;
}
.pricing-features em {
display: block;
margin-bottom: 5px;
font-weight: 600;
}
.pricing-features {
width: auto;
}
.pricing-features li {
float: none;
width: auto;
padding: 1em;
padding-top: 0.1em;
text-align: left;
}
.exclusive .pricing-features li {
margin: 0 3px;
}
.pricing-features em {
display: inline-block;
margin-bottom: 0;
}
.has-margins .exclusive .pricing-features li {
margin: 0;
}
.pricing-footer {
position: absolute;
z-index: 1;
top: 0;
left: 0;
height: 80px;
width: 100%;
}
.pricing-footer {
position: relative;
height: auto;
padding: 1em 0;
text-align: center;
}
.pricing-footer::after {
display: none;
}
.has-margins .pricing-footer {
padding-bottom: 0;
}
.select {
position: relative;
z-index: 1;
display: block;
height: 100%;
overflow: hidden;
text-indent: 100%;
white-space: nowrap;
color: transparent;
}
.select {
position: static;
display: inline-block;
height: auto;
padding: 0.5em 2em;
color: #000;
border-radius: 8px;
border: 2px solid #11b8bb;
font-size: 1.4rem;
text-indent: 0;
text-transform: uppercase;
letter-spacing: 2px;
transition: all .6s;
width: 75%;
cursor: pointer;
}
.select:hover {
text-decoration: none;
color: #000;
}
.no-touch .select:hover {
background-color: #11b8bb;
color: #fff;
}
.exclusive .select {
background-color: transparent;
color: #fff;
border: 2px solid #fff;
}
.no-touch .exclusive .select:hover {
background-color: #24e0ba;
}
.secondary-theme .exclusive .select {
background-color: #11b8bb;
}
.no-touch .secondary-theme .exclusive .select:hover {
background-color: #112e3c;
}
.has-margins .select {
display: block;
padding: 1.7em 0;
border-radius: 0 0 4px 4px;
}
.fieldset1 {
float: left;
background-color: #b6f0f2;
padding: 6px;
border-radius: 7px;
height: 44px;
position: relative;
}
.fieldset1:before {
border: transparent solid 9px;
border-left-color: #b6f0f2;
content: "";
height: 0;
position: absolute;
top: 13px;
width: 0;
transform: rotate(180deg);
-webkit-transform: rotate(180deg);
left: -18px;
}
.fieldset {
float: left;
}
.paketler_ust_aciklama {
text-align: center;
font-size: 36px;
line-height: 42px;
margin-top: 30px;
}
.exclusive .pricing-wrapper li {
color: #fff;
background-color: #ea638c;
}
.paket1 {
background-color: #f5f6f8!important;
}
.paket2 {
background-color: #f3f9fe!important;
}
.paket3 {
border-radius: 5px;
border: 1px solid #ea638c!important;
}
.paket4 {
background-color: #f6fcff!important;
}
.hr {
width: 90%;
margin: auto;
border-top: 1px solid #11b8bb;
margin-top: 30px;
}
.exclusive .hr {
width: 90%;
margin: auto;
border-top: 1px solid #fff;
margin-top: 30px;
}
.price_bottom {
text-align: center;
font-size: 18px;
margin-top: 30px;
}
.price_bottom span {
font-size: 16px;
}
.price {
margin-top: 62px;
}
.ilkli {
text-align: center!important;
font-size: 20px!important;
font-weight: 500;
}
aylık
yıllık
%30'a varan indirim
Dilediğin Kadar Ücretsiz Kullan
Sonra Dilediğin Paketi Seç Devam Et
$(document).ready(function($){
$('.content').attr('class','content col-sm-12 col-md-12');
$('.sidebar').remove();
bouncy_filter($('.pricing-container'));
});
function bouncy_filter(container) {
container.each(function(){
var pricing_table = $(this);
var filter_list_container = pricing_table.children('.pricing-switcher'),
filter_radios = filter_list_container.find('input[type="radio"]'),
filter_labels = filter_list_container.find('.labels'),
pricing_table_wrapper = pricing_table.find('.pricing-wrapper');
var table_elements = {};
filter_radios.each(function(){
var filter_type = $(this).val();
table_elements[filter_type] = pricing_table_wrapper.find('li[data-type="'+filter_type+'"]');
});
filter_labels.each(function(){
$('#lmonthly-1').attr('style','color:#fff;');
$('#lyearly-1').attr('style','color:#2b2a29;');
});
filter_radios.on('change', function(event){
var selected_filter = $(event.target).val();
var a=$(event.target).attr('id');
if(a=='yearly-1'){
$('#lmonthly-1').attr('style','color:#2b2a29;');
$('#lyearly-1').attr('style','color:#fff;');
// $('#paket1y').attr('class','is-visible yrly paket1');
// $('#paket2y').attr('class','is-visible yrly paket2');
// $('#paket3y').attr('class','is-visible yrly paket3');
// $('#paket4y').attr('class','is-visible yrly paket4');
$('#paket1').attr('class','is-hidden yrly paket1');
$('#paket2').attr('class','is-hidden yrly paket2');
$('#paket3').attr('class','is-hidden yrly paket3');
$('#paket4').attr('class','is-hidden yrly paket4');
}
if(a=='monthly-1'){
$('#lmonthly-1').attr('style','color:#fff;');
$('#lyearly-1').attr('style','color:#2b2a29;');
// $('#paket1y').attr('class','is-hidden yrly paket1');
// $('#paket2y').attr('class','is-hidden yrly paket2');
// $('#paket3y').attr('class','is-hidden yrly paket3');
// $('#paket4y').attr('class','is-hidden yrly paket4');
$('#paket1').attr('class','is-visible yrly paket1');
$('#paket2').attr('class','is-visible yrly paket2');
$('#paket3').attr('class','is-visible yrly paket3');
$('#paket4').attr('class','is-visible yrly paket4');
}
});
});
}
function satinal(ctxt){
$('#'+ctxt).submit();
}