body {
    opacity: 0;
    animation: fadeInBody 1s ease-in-out forwards;
}
@keyframes fadeInBody {
    to {
        opacity: 1;
    }
}
#uyeolgiris{position:fixed;overflow:auto;margin-bottom:0;width:100%;height:100%;bottom:0px;  background-size: 100%;}
#uyeolgirisbody .footer{display:none}
.uyeol{position:absolute;width:50%;border-radius:0;margin-bottom:0px;right:0;top:0;bottom:0}
.uyeolgirisslogan{float:left;width:50%;text-align:left;margin-top:0;}
.uyeolgirishead{text-align:center;width:100%;margin-top:5%;margin-bottom:0;float:none; -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;}
.padding30{padding:10px 30px}
.uyeolgirishead h1{display:none}
.logo{float:none;margin-top:0px;margin-bottom:40px;position:relative}
.uyeolgirisyap .gonderbtn{margin-top:30px}
.logo img{width:200px}
.uyeolgirisslogan h4{width:80%}
.uyeolgirisyap .btn{width:200px;background:transparent;    padding: 12px 0px;}
.clientcopyright{width:100%;text-align:center;font-size:13px;margin-top:15px;margin-bottom:30px;color:#b4b4b4;display:inline-block}
.clientcopyright a{color:#b4b4b4}
.footsosyal{margin-top:15px}
.footsosyal a{color:#a1a1a1}
.footsosyal a:hover{background:#eee}
#girisyapright h4{display:none}
.footsosyal{display:none}
.createnewaccountlink{color:rgba(255,255,255,0.58);font-weight:600;margin-bottom:10px;display:inline-block}
.createnewaccountlink:hover{color:rgba(255,255,255,1.58)}
.country-name{color:#999}
.uyeolgirisslogan-con{width:70%;margin:auto;margin-top:35%;}
.uyeolgirisslogan-con .gonderbtn{color:#fff;border:2px solid #fff;margin-top:35px;background: transparent;}
.uyeolgirisslogan-con .gonderbtn:hover{color:#fff;background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); border:2px solid transparent;}
.signupcon{padding:20px;    background: white;}
.signinsignup-title{display:inline-block;font-size:28px;font-weight:600;margin-top:12px}
::-webkit-input-placeholder{color:#7898ae}
:-moz-placeholder{color:#7898ae}
::-moz-placeholder{color:#7898ae}
:-ms-input-placeholder{color:#7898ae}
#uyeolgiris input{border-radius:5px;padding-left: 7px;}
.signup-stages-block.active{color:white}
.clean-theme-signup-box .yuzde50{width:47%}
.signin-signup-foot-btn{text-align:center;margin-top: 25px;}
.signin-signup-foot-btn button {
    font-family:'Titillium Web',sans-serif;
    float:none;
    width:250px;
    cursor:pointer;
    outline:none;
    -webkit-transition:all 0.3s ease-out;
    -moz-transition:all 0.3s ease-out;
    -ms-transition:all 0.3s ease-out;
    -o-transition:all 0.3s ease-out;
    transition:all 0.3s ease-out;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border: none;
    color: white;
    position: relative;
    overflow: hidden;
}
.signin-signup-foot-btn button:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(255,255,255,0.3);
    transition: width 0.6s, height 0.6s;
    transform: translate(-50%, -50%);
}
.signin-signup-foot-btn button:hover:before {
    width: 300px;
    height: 300px;
}
.signin-signup-foot-btn button:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(102,126,234,0.4);
}
.signup-stages{float:left;margin-bottom:20px;width:100%;text-align:center}
.signup-stages-block{background:#eee;width:85px;height:85px;display:inline-block;border-radius:100%;text-align:center;line-height:85px;margin:0px 7%;font-weight:300;font-size:32px}
.signup-stage-line{width:100%;height:10px;background:#eee;margin-top:50px;float:left;margin-bottom:-55px;border-radius:3px}
#Signin_Form{width:70%;margin:auto;margin-top:105px}
#Signin_Form input{margin-bottom:20px}
#Signforget_Form{width:70%;margin:auto;margin-top:105px}
#Signforget_Form input{margin-bottom:20px}
.clientloginheadinfo { margin-bottom: 20px;    font-size: 20px;}
.captcha-content {margin-top:10px;}
.abcRioButton{border-radius:1px;box-shadow:0 2px 4px 0 rgba(0,0,0,.25);-moz-box-sizing:border-box;box-sizing:border-box;-webkit-transition:background-color .218s,border-color .218s,box-shadow .218s;transition:background-color .218s,border-color .218s,box-shadow .218s;-webkit-user-select:none;-webkit-appearance:none;background-color:#fff;background-image:none;color:#262626;cursor:pointer;outline:none;overflow:hidden;position:relative;text-align:center;vertical-align:middle;white-space:nowrap;width:auto}.abcRioButton:hover{box-shadow:0 0 3px 3px rgba(66,133,244,.3)}.abcRioButtonBlue{border:none;color:#fff}.abcRioButtonBlue,.abcRioButtonBlue:hover{background-color:#4285f4}.abcRioButtonBlue:active{background-color:#3367d6}.abcRioButtonLightBlue{background-color:#fff;color:#757575}.abcRioButtonLightBlue:active{background-color:#eee;color:#6d6d6d}.abcRioButtonIcon{float:left}.abcRioButtonBlue .abcRioButtonIcon{background-color:#fff;border-radius:1px}.abcRioButtonSvg{display:block}.abcRioButtonContents{font-family:Roboto,arial,sans-serif;font-size:14px;font-weight:500;letter-spacing:.21px;margin-left:6px;margin-right:6px;vertical-align:top}.abcRioButtonContentWrapper{height:100%;width:100%}.abcRioButtonBlue .abcRioButtonContentWrapper{border:1px solid transparent}.abcRioButtonErrorWrapper,.abcRioButtonWorkingWrapper{display:none;height:100%;width:100%}.abcRioButtonErrorIcon,.abcRioButtonWorkingIcon{margin-left:auto;margin-right:auto}.abcRioButtonErrorState,.abcRioButtonWorkingState{border:1px solid #d5d5d5;border:1px solid rgba(0,0,0,.17);box-shadow:0 1px 0 rgba(0,0,0,.05);color:#262626}.abcRioButtonErrorState:hover,.abcRioButtonWorkingState:hover{border:1px solid #aaa;border:1px solid rgba(0,0,0,.25);box-shadow:0 1px 0 rgba(0,0,0,.1)}.abcRioButtonErrorState:active,.abcRioButtonWorkingState:active{border:1px solid #aaa;border:1px solid rgba(0,0,0,.25);box-shadow:inset 0 1px 0 #ddd;color:#262626}.abcRioButtonWorkingState,.abcRioButtonWorkingState:hover{background-color:#f5f5f5}.abcRioButtonWorkingState:active{background-color:#e5e5e5}.abcRioButtonErrorState,.abcRioButtonErrorState:hover{background-color:#fff}.abcRioButtonErrorState:active{background-color:#e5e5e5}.abcRioButtonErrorState .abcRioButtonErrorWrapper,.abcRioButtonWorkingState .abcRioButtonWorkingWrapper{display:block}.abcRioButtonErrorState .abcRioButtonContentWrapper,.abcRioButtonErrorState .abcRioButtonWorkingWrapper,.abcRioButtonWorkingState .abcRioButtonContentWrapper{display:none} .-webkit-keyframes abcRioButtonWorkingIconPathSpinKeyframes {0% {-webkit-transform: rotate(0deg)}}
.uyesol {
    width: 46%;
    height: 100%;
}
#uyeolgirisbody {
    background: #fff0;
}
a.cd-top.cd-is-visible.cd-fade-out {
    display: none;
}
.grsbtncs {
    margin-bottom: 48px;
    border-bottom: 1px solid #dfd8d8;
}
.uyeol h4 {
    border-bottom: 0px solid #ccc;
    padding-bottom: 0px;
}

.uyesol {
    width: 46%;
    height: 100%;
    width: 46%;
    height: 100vh;
    background: linear-gradient(135deg, #0a0a2a 0%, #1a0033 50%, #000000 100%);
    position: relative;
    overflow: hidden;
    float: left;
}
.uyesol::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 200%;
    height: 200%;
    background: 
        radial-gradient(ellipse at 20% 80%, rgba(0, 255, 255, 0.15) 0%, transparent 40%),
        radial-gradient(ellipse at 80% 20%, rgba(255, 0, 255, 0.15) 0%, transparent 40%),
        radial-gradient(ellipse at 60% 60%, rgba(102, 126, 234, 0.1) 0%, transparent 50%),
        radial-gradient(ellipse at 30% 30%, rgba(118, 75, 162, 0.1) 0%, transparent 45%);
    animation: nebulaFloat 30s ease-in-out infinite alternate;
    z-index: 0;
}
@keyframes nebulaFloat {
    0% { 
        opacity: 0.6; 
        transform: translate(0, 0) scale(1); 
    }
    50% { 
        opacity: 0.8; 
        transform: translate(-5%, -5%) scale(1.05); 
    }
    100% { 
        opacity: 1; 
        transform: translate(-10%, -10%) scale(1.1); 
    }
}
.stars {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 1;
}
.star {
    position: absolute;
    background: white;
    border-radius: 50%;
    box-shadow: 0 0 6px rgba(255,255,255,0.8);
}
.star.front {
    animation: twinkle 3s ease-in-out infinite, moveFront 20s ease-in-out infinite;
}
.star.back {
    animation: twinkle 5s ease-in-out infinite, moveBack 40s ease-in-out infinite;
    opacity: 0.6;
}
.star:nth-child(odd) {
    animation-delay: 1s, 0s;
}
.star:nth-child(even) {
    animation-delay: 2s, 5s;
}
@keyframes twinkle {
    0%, 100% { opacity: 0.4; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.3); }
}
@keyframes moveFront {
    0% { transform: translate(0, 0); }
    25% { transform: translate(15px, -10px); }
    50% { transform: translate(5px, -20px); }
    75% { transform: translate(-10px, -5px); }
    100% { transform: translate(0, 0); }
}
@keyframes moveBack {
    0% { transform: translate(0, 0); }
    25% { transform: translate(5px, -3px); }
    50% { transform: translate(2px, -8px); }
    75% { transform: translate(-5px, -2px); }
    100% { transform: translate(0, 0); }
}
.galaxy {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 500px;
    height: 500px;
    background: 
        radial-gradient(ellipse at center, rgba(102, 126, 234, 0.15) 0%, transparent 60%),
        radial-gradient(ellipse at center, rgba(118, 75, 162, 0.1) 0%, transparent 70%);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    animation: rotateGalaxy 60s linear infinite;
    z-index: 0;
}
@keyframes rotateGalaxy {
    from { transform: translate(-50%, -50%) rotate(0deg); }
    to { transform: translate(-50%, -50%) rotate(360deg); }
}
.shooting-star {
    position: absolute;
    width: 100px;
    height: 2px;
    background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1));
    border-radius: 50%;
    animation: shootingStar 6s ease-in-out infinite;
    z-index: 2;
}
.shooting-star:nth-child(1) { top: 15%; left: -100px; animation-delay: 0s; }
.shooting-star:nth-child(2) { top: 45%; left: -100px; animation-delay: 2s; }
.shooting-star:nth-child(3) { top: 75%; left: -100px; animation-delay: 4s; }
@keyframes shootingStar {
    0% { transform: translateX(0) translateY(0) rotate(-45deg); opacity: 0; }
    5% { opacity: 1; }
    30% { opacity: 1; }
    35% { transform: translateX(600px) translateY(200px) rotate(-45deg); opacity: 0; }
    100% { transform: translateX(600px) translateY(200px) rotate(-45deg); opacity: 0; }
}
body.font-lato {
    display: none;
}
.line {
    background-color: #fff;
    float: left;
    height: 0.5px;
    width: 100%;
    margin-top: 15px;
    margin-bottom: 15px;
}
#Signin_Form input {
    margin-bottom: 35px;
    padding-left: 40px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
    border: 1px solid #ddd;
    background: #f9f9f9;
}
#Signin_Form input:focus {
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
    outline: none;
    border-color: #a8edea;
    background: #fff;
    transform: translateY(-2px);
}
svg.w-6.h-6 {
    width: 26px;
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
    color: #a8edea;
    transition: color 0.3s ease;
}
#Signin_Form input:focus + svg.w-6.h-6 {
    color: #fed6e3;
}
.uyeolgirisslogans {
    width: 500px;
    padding: 45px;
    background: #00bcb6;
    border-radius: 20px;
    float: right;
    margin-top: 12%;
}
.zipwebg-logo {
    width: 200px;
    margin-bottom: 20px;
}
.zipwebg-logo img {
    filter: drop-shadow(0 0 15px rgba(102, 126, 234, 0.8)) drop-shadow(0 0 30px rgba(118, 75, 162, 0.6));
    transition: filter 0.3s ease;
}
.zipwebg-logo img:hover {
    filter: drop-shadow(0 0 20px rgba(102, 126, 234, 1)) drop-shadow(0 0 40px rgba(118, 75, 162, 0.8));
}
.mesaj-karsilama {
    font-size: 18px;
    color: rgba(255, 255, 255, 0.85);
    font-weight: 200;
    margin-bottom: 20px;
    letter-spacing: 1px;
    font-family: 'Poppins', 'Titillium Web', sans-serif;
}
.mesaj-karsilama span {
    font-size: 32px;
    line-height: 40px;
    font-weight: 300;
    display: block;
    margin-top: 8px;
    background: linear-gradient(135deg, #ffffff 0%, #a8edea 50%, #fed6e3 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.link-geri {
    color: rgba(255, 255, 255, 0.7);
    font-size: 13px;
    font-weight: 400;
    text-decoration: none;
    margin-top: 25px;
    display: inline-block;
    transition: all 0.3s ease;
    padding: 8px 0;
}
.link-geri:hover {
    color: rgba(255, 255, 255, 1);
    transform: translateX(-5px);
}
.link-geri i {
    margin-right: 8px;
    transition: transform 0.3s ease;
}
.link-geri:hover i {
    transform: translateX(-3px);
}
/* Eski mesaj-yenihesap stili override */
.login-mobil-uygulama ul li {
    list-style: none;
    float: left;
    margin: 10px 15px 0px 0px;
    padding: 0px 0px 0px 0px;
}
.login-mobil-uygulama ul li img {
    width: 140px;
    height: auto;
    transition: all 0.3s ease;
    filter: drop-shadow(0 4px 10px rgba(0,0,0,0.3));
}
.login-mobil-uygulama ul li img:hover {
    transform: scale(1.08) translateY(-3px);
    filter: drop-shadow(0 8px 20px rgba(0,0,0,0.4));
}
.login-mobil-uygulama {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.login-mobil-uygulama span {
    color: rgba(255, 255, 255, 0.7);
    font-size: 12px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 2px;
    display: block;
    margin-bottom: 15px;
}
body.font-lato, html.font-lato {
    font: 400 16px Lato,sans-serif!important;
    display: none;
}
.uyeol {
    position: absolute;
    width: 96% !important;
    border-radius: 0;
    margin-bottom: 0px;
    right: 0;
    top: 0;
    bottom: 0;
    -webkit-transform: skewX(10deg);
    -moz-transform: skewX(-10deg);
    -ms-transform: skewX(-10deg);
    -o-transform: skewX(-10deg);
    /* transform: skewX(-10deg); */
}
.mesaj-yenihesap span {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 28px;
    font-weight: 300;
}
.mesaj-yenihesap a {
    background: linear-gradient(135deg, rgba(102, 126, 234, 0.9) 0%, rgba(118, 75, 162, 0.9) 100%);
    color: #ffffff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    display: inline-block;
    padding: 12px 28px;
    border-radius: 30px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
    margin-top: 10px;
}
.mesaj-yenihesap a:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(102, 126, 234, 0.5);
    background: linear-gradient(135deg, rgba(102, 126, 234, 1) 0%, rgba(118, 75, 162, 1) 100%);
}
#q4003urusmrg1667480999441.widget-visible {
    display: none !important;
}
span.mbuy {
    position: relative;
    left: -32px;
}
.mesaj-yenihesap a:hover {
    opacity: 0.7;
}
#Signin_Form {
    width: 70%;
    margin: auto;
    margin-top: 91px !important;
}
.kart-genel {
    width: 420px;
    padding: 30px;
    padding-left: 40px;
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 24px;
    float: right;
    margin-top: 12%;
    box-shadow: 
        0 8px 32px rgba(0, 0, 0, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    transition: all 0.4s ease;
    z-index: 10;
    position: relative;
}
.kart-genel::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
}
.kart-genel:hover {
    transform: translateY(-8px);
    box-shadow: 
        0 20px 50px rgba(0, 0, 0, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.25);
}
div#uyeolgirisx {
    width: 54%;
    -webkit-transform: skewX(10deg);
    -moz-transform: skewX(-10deg);
    -ms-transform: skewX(-10deg);
    -o-transform: skewX(-10deg);
    transform: skewX(-10deg);
    background-color: #ffffff;
    height: 100vh;
    right: 90px;
    position: absolute;
    z-index: 999;
}
.tawk-min-container .tawk-button-circle.tawk-button-large {
    width: 60px;
    height: 60px;
    opacity: 0;
    display: none;
}
@media only screen and (min-width:320px) and (max-width:1024px){
    div#uyeolgirisx {
    width: 100%;
    -webkit-transform: skewX(10deg);
    -moz-transform: skewX(0deg);
    -ms-transform: skewX(0deg);
    -o-transform: skewX(0deg);
    transform: skewX(0deg);
    background-color: #ffffff;
    height: auto;
    right: 0px;
    position: relative;
    z-index: 999;
}
.signupcon p {
    font-size: 16px !important;
    line-height: 0px;
}
.grsbtncs {
    margin-bottom: 40px;
    border-bottom: 0px solid #dfd8d8;
}
button.tawk-custom-color.tawk-custom-border-color.tawk-button.tawk-button-circle.tawk-button-large {
    display: none !important;
}
.signupcon {
   padding: 0px; 
    background: white;
    padding-left: 0px !important;
}
.uyesol {
    width: 46%;
    height: 100%;
    width: 100%;
    height: 35vh;
    background: linear-gradient(135deg, #0a0a2a 0%, #1a0033 50%, #000000 100%);
    position: relative;
    overflow: hidden;
    float: none;
}
.link-geri {
    color: #ffffff;
    font-size: 15px;
    font-weight: 400;
    text-decoration: none;
    margin-top: 40px;
    display: inline-block;
    position: absolute;
    top: -4px;
    right: 4%;
}
.zipwebg-logo img {
    width: 131px;
}
.mesaj-karsilama span {
    font-size: 40px;
    line-height: 35px;
}
#Signin_Form {
    width: 70%;
    margin: auto;
    margin-top: 50px !important;
}


.tawk-min-container .tawk-button-circle.tawk-button-large {
    width: 60px;
    height: 60px;
    opacity: 0;
    display: none;
}
.kart-genel {
    width: 360px;
    padding: 13px;
    background: rgba(168, 237, 234, 0.9);
    border-radius: 20px;
    float: right;
    margin-top: 0%;
    padding-left: 34px;
    height: 252px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}
#Signin_Form input {
    margin-bottom: 20px;
    padding-left: 10px;
}
.uyeol h4 {
    border-bottom: 0px solid #ccc;
    padding-bottom: 10px;
}
svg.w-6.h-6 {
    width: 22px;
    position: absolute;
    margin-top: 10px;
    margin-left: -2px;
    float: right;
    right: 0;
}
.uyeol {
    position: absolute;
    width: 93% !important;
    border-radius: 0;
    margin-bottom: 0px;
    margin-top: 20px;
    right: 19px;
    top: 0;
    bottom: 0;
    -webkit-transform: skewX(0deg);
    -moz-transform: skewX(0deg);
    -ms-transform: skewX(0deg);
    -o-transform: skewX(0deg);
}
.uyeolgirishead{width:100%;margin-top:15%}
.uyeolgirishead .logo {    margin-bottom: 25px;}
.uyeolgirisyap{width:100%}
#wrapper{width:90%}
.uyeol{width:100%;position:relative;border-right:none}
.signupcon{position:relative;}
#uyeolgiris{overflow-x:auto;background-size:auto 120%;background-position:center}
.uyeolgirisslogan{text-align:center;width:100%}
.uyeolgirisslogan h4{width:90%;font-size:17px;margin:auto;margin-top:25px}
.uyeolgirisslogan-con{width:90%;margin:auto;margin-top:55px}
.signupcon .padding30 {    padding:7px;}
.signup-stages-block{width:75px;height:75px;line-height:75px;margin:0px 4%;font-size:28px}
.signup-stage-line {    margin-bottom: -45px;}
.clean-theme-signup-box .yuzde50 {    width: 46%;}
#Signin_Form {      margin-top: 60px;  width: 100%;}
#Signforget_Form{width:100%;margin-top: 60px;}
.captcha-content{width:310px;transform:scale(0.8);margin-left:auto;margin-top:20px;margin-bottom:10px}
.signin-signup-foot-btn{text-align:center;margin-top:20px;margin-bottom:30px}

.socialconnect {
    margin-bottom: 20px;
    width: 100%;
    text-align: center;
}
.socialconnect a {
    display: inline-block;
    margin: 0 10px;
    padding: 10px;
    border-radius: 50%;
    background: #f0f0f0;
    transition: all 0.3s ease;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}
.socialconnect a:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
}
}
