@charset "UTF-8";
@import url('style0.css');
@import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,200;0,400;0,700;0,900;1,400;1,900&display=swap');

:root{
  --r1:#3771c3;--r2:#04b2a6;--r3:#71a2e7;--r4:#0dc;--r5:#fa0;--r6:#fc0;--r7:#d33;
  --rgf:linear-gradient(0deg, #ffffff99, #ffffffee 40%,var(--rf));--ra007:#00000007;
  --rg1:linear-gradient(135deg, var(--r1), #ffffffcc 70%);
  --font1:'Poppins', sans-serif;
  }
body{
    overflow-x:hidden;
}

#cosmos{position:relative;z-index:2;padding-top:100px;max-width:100%}
#cosmos::before{content:"";position:absolute;z-index:-1;width:100vw;height:100vw;left:0;top:0;margin:-30vw auto auto -75vw;
background:radial-gradient(circle, var(--r3), var(--rf) 70%);opacity:.5}
#cosmos::after{content:"";position:absolute;z-index:-1;width:100vw;height:100vw;right:0;top:0;margin:-400px -75vw auto auto;
background:radial-gradient(circle, var(--r3), var(--rf) 70%);opacity:.8}

#tepe{display:flex;width:100%;position:fixed;top:0;z-index:999}
.kaykay #tepe{background:var(--rgf);border-bottom:1px solid #fff}
#logo{max-width:250px;width:100%;flex-shrink:0}
.linkler{flex:1;min-width:0;display:flex;justify-content:center}
.giris{max-width:250px;width:100%;flex-shrink:0;display:flex;justify-content:right}
.logo a{display:block;height:60px;margin:20px}
.logo img{display:block;max-width:100%;max-height:100%}
.linkler a{display:block;line-height:100px;font-size:18px;padding:0 20px;color:var(--r1);position:relative;z-index:2}
.linkler a:before{content:"";position:absolute;z-index:-1;inset:100px 10px;background:var(--r3);border-radius:10px;opacity:0}
.linkler a:hover:before{inset:20px 10px;opacity:.2}
.giris a{display:block;flex:1;margin:30px 10px;background:var(--r1);color:var(--rf);border-radius:10px;text-align:center;line-height:40px}
.giris a:first-child{background:var(--r3)}
.giris a:hover{background:var(--r2)}

#Slogan{display:flex;width:100%;height:calc(100vh - 100px)}
#Slogan .metin{width:50%;padding:50px;display:flex;flex-direction:column;justify-content:center}
#Slogan .resim{width:50%;display:flex;justify-content:center;align-items:center}
#Slogan .m1{font-size:5.5em;color:var(--r1);font-weight:500;line-height:1.1em}
#Slogan .m2{font-size:1.3em;color:var(--r03);margin:30px 0}
#Slogan .l1 a{display:inline-block;font-size:1.5em;background:var(--r2);color:var(--rf);padding:10px 20px;border-radius:10px}
#Slogan .l1 a:hover{background:var(--r5)}
#Slogan .resim img{display:block;max-width:75%;max-height:75%;object-fit:contain}

#Solutions{display:flex;width:100%;padding:20px}
#Solutions .oge{position:relative;z-index:2;padding:20px;margin:10px;
  display:grid;grid-template-columns:1fr auto;grid-template-areas:"baslik resim" "metin  metin"}
#Solutions .oge::after{content:"";position:absolute;z-index:-1;inset:0px;border-radius:15px;background:var(--rg1);opacity:.15}
#Solutions .baslik{grid-area:baslik;font-size:1.5em;padding-bottom:10px;text-shadow:none;font-weight:700;line-height:1.2em;color:var(--r2)}
#Solutions .metin{grid-area:metin;line-height:1.5em;color:var(--r02);padding-top:10px}
#Solutions .resim{grid-area:resim;display:flex;flex-direction:column;justify-content:center}
#Solutions img{display:block;width:70px;margin:5px 15px 5px 30px}

#About{display:flex}
#About .sol,#About .sag{width:40%;padding:20px;display:flex;flex-direction:column;justify-content:center}
#About .sol{text-align:center}#About .sag{width:60%;font-size:1.3em;color:var(--r03);padding:5vw}
#About .baslik{font-size:3em;color:var(--r1);font-weight:700}

#goygoy{position:relative;z-index:2;padding:20px;margin:auto;width:80%}
#goygoy .baslik{font-size:4em;text-align:center;color:var(--r2);padding-top:20px}
#goygoy .resim{width:40%;margin:auto;position:relative;top:-2.5vw;z-index:-1;transform:rotate(44deg);}
#goygoy .metin{width:90%;margin:auto;text-align:center;color:var(--r02)}
#goygoy .metin strong{color:var(--r2);font-size:1.4em}
#goygoy .metin a,.tip a{display:inline-block;background:var(--r3);color:var(--rf);font-size:1.2em;padding:10px 20px;border-radius:5px;margin:50px auto}
#goygoy .metin a:hover,.tip a:hover{background:var(--r5)}

#Sectors{width:90%;margin:auto;position:relative;z-index:2}
#Sectors .baslik{font-size:4em;text-align:center;color:var(--r1);padding:25px}
#Sectors .metin{font-size:1.5em;text-align:center;color:var(--r02);padding:0 25px 25px}
#Sectors ul{list-style:none;padding:0;margin:40px 0 0 0;display:flex;flex-wrap:wrap;justify-content:center;gap:20px}
#Sectors li{max-width:250px;position:relative;overflow:hidden;border-radius:10px;min-height:100px;padding:20px;color:var(--rf);
  display:flex;align-items:center;justify-content:center;text-align:center;font-weight:700;text-shadow:1px 1px 5px #06062c}
#Sectors li img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
#Sectors li::after{content:"";position:absolute;inset:0;background:var(--r1);z-index:-1;opacity:.7;}
#Sectors li:hover::after{background:var(--r5)}

#Pricing{max-width:950px;margin:100px auto;text-align:center}
#Pricing .baslik{padding:20px 0;font-size:4em;line-height:1.1em;color:var(--r1)}
#Pricing .baslik strong{color:var(--r2);font-weight:normal;}
#Pricing .altbaslik{font-size: 1.5em;color: var(--r02);padding: 0 25px 75px;}
.fiyatlar {display:grid;grid-template-columns:repeat(3, 1fr);margin:0 auto;border:1px solid #ddd;border-radius:10px;overflow:hidden}
.fiyatlar div{border-bottom:1px solid #ddd;padding:1.2em 0}
.fiyatlar > :nth-child(-n+3){background-color:var(--r1);color:var(--rf);font-weight:bold;font-size:1.2em}
.fiyatlar > :nth-child(n+4):nth-child(6n+4),.fiyatlar > :nth-child(n+4):nth-child(6n+5),.fiyatlar > :nth-child(n+4):nth-child(6n+6){background-color:var(--ra007)}
.fiyatlar > :nth-last-child(-n+3) {border-bottom:none}

.tipler{display:flex;max-width:90%;padding:50px 10px 0;margin:auto;text-align:left;}
.tip{flex:1;margin:20px;position:relative;z-index:1;border-radius:10px;overflow:hidden;padding:20px}
.tip::after{content:"";position:absolute;z-index:-1;inset:0;background:var(--r1);opacity:.2}
.tbaslik{display:inline-block;padding:10px 15px;border-radius:5px;color:var(--r1);background:var(--rf);color:var(r1)}
.tfiyat{font-size:4em;color:var(--ra0c)}.tfiyat::before{content:"€ ";color:var(--r1)}
.tfee{border-bottom:1px solid var(--ra03);padding-bottom:20px;margin-bottom:20px}
.tip ul{margin:10px 0}
.tip li{list-style:none;line-height:2em}
.tip li::before{content: "\2713";margin-right:10px}

.ayrac{position: relative;z-index:-1;margin-bottom:15vw;}
.ayrac::after{content:"";background:url(../images/b1.jpg) center center;background-size:contain;position:absolute;width:100vw;height:55vw;margin-top:-35vw}


#Faq{position:relative;width:90%;margin:auto;padding:50px}
#Faq .baslik{font-size:4em;color:var(--r2)}
#Faq .altmetin{padding:0 0 25px 25px;font-size:2em;color:var(--r02)}
.sorular{padding:10px}.sor{margin:10px;cursor:zoom-in}
.soru{position:relative;font-size:2em;color:var(--r2);padding:10px 20px 10px 10px;background:linear-gradient(0deg, #00000033,#00000011);border-radius:5px}
.cevap{font-size:1.25em;color:var(--rf);background:var(--r2);margin:0 10px;max-height:0px;overflow:hidden}.cevap p{padding:20px;text-indent:0}
.soru::after{content:"+";position:absolute;right:20px;top:20px;margin:-10px -10px 0 0;transform:rotate(0deg)}
.sor.ac{cursor:zoom-out}.sor.ac .soru::after{transform:rotate(45deg)}.sor.ac .cevap{max-height:500px}

#alt{margin-top:50px;display:grid;grid-template-columns:1fr auto;grid-template-areas:"altlogo altlink" "not  not" "icon  icon"}
#altlogo{grid-area:altlogo;width:fit-content}
#altlogo img{height:50px;margin-left:50px}
#altlinkler{grid-area:altlink;text-align:right;margin-right:50px}
#altlinkler a{display:inline-block;line-height:50px;padding:0 15px;}
#dipnot{grid-area:not;padding:25px;border-top:1px solid var(--r03);margin-top:25px;text-align:center;color:var(--r02)}
#alticons{grid-area:icon}#alticons img{display:block;margin:0 auto 50px auto}

[id]{scroll-margin-top:75px}

/******* animasyon *******/	
.anim02,.linkler a:before,.giris a{transition:.2s all;-webkit-transition:.2s all;-o-transition:.2s all;-moz-transition:.2s all;-ms-transition:.2s all}
.anim02,.soru::after{transition:.5s all;-webkit-transition:.5s all;-o-transition:.5s all;-moz-transition:.5s all;-ms-transition:.5s all}
.anim1,.sor .cevap,#tepe{transition:1s all;-webkit-transition:1s all;-o-transition:1s all;-moz-transition:1s all;-ms-transition:1s all}
.anim2{transition:2s all;-webkit-transition:2s all;-o-transition:2s all;-moz-transition:2s all;-ms-transition:2s all}

@keyframes blink{0%{filter:blur(3px)}100%{filter:blur(0px)}}

/******* uyum *******/

@media only screen and (max-width:800px){

#cosmos::after,#cosmos::before{display:none}

#tepe{display:block;height:100px;overflow:hidden}
#tepe.ac{height:100vh;background: var(--rf)}
#logo{max-width:66%;padding-top:20px}
.linkler{display:block}.linkler::before{content:"";position:fixed;z-index:1000;right:20px;top:30px;width:40px;height:40px;background:var(--r3);border-radius:5px}
.linkler::after{content:"";position:fixed;z-index:1001;right:30px;top:45px;width:0px;height:0px;border:10px solid transparent;border-top: 13px solid var(--rf)}
.linkler a{line-height:60px}.giris{display:block;margin:auto}
#Slogan{display:flex;width:100%;height:auto;padding:20px 0;overflow: hidden}
#Slogan .metin{width:66%;padding:15px}#Slogan .resim{width:33%}#Slogan .l1 a{font-size:1.3em}
#Slogan .m1{font-size:2.5em}#Slogan .m2{font-size:1em;line-height:1.7em}
#Slogan .resim img{transform:scale(3.5) rotate(60deg) translate(0vw, -7vw);}
#Solutions{flex-wrap:wrap;padding:0px}
#Solutions .metin{display:none}
#About{display:block}#About .baslik{font-size:2.5em;padding:20px;line-height:1.2em}
#About .sol,#About .sag{width:100%;padding:10px}#About .sag{font-size:1.2em;padding:10px}
#goygoy{width:100%}
#goygoy .resim{width:55%}#goygoy .metin{width:100%}#goygoy .p{display:none}
#goygoy .baslik,#Pricing .baslik,#Sectors .baslik{font-size:3em}
.fiyatlar{margin:0 10px}.fiyatlar div{padding:1.2em 5px;line-height:1.2em}
.tipler{max-width:100%;padding:50px 5px 0}.tip{margin:5px;padding:5px}.tfiyat{font-size:2em}
.tfee{border-bottom:1px solid var(--ra03);padding-bottom:20px;margin-bottom:20px}.tip a{margin:10px 0}
.ayrac::after{margin-top:-40vw}
#Faq{width:100%;padding:10px}
#Faq .baslik{font-size:2.5em;line-height:1.2em;font-weight:700;text-align:center;padding:50px 0 0}
#Faq .altmetin{padding:10px;font-size:1.5em;text-align:center;color:var(--r03)}
#Faq .soru{font-size:1.5em;line-height:1.3em}
#alt{display:block;text-align:center}#altlogo{width:auto;margin-bottom:25px}#altlogo img{margin:auto}
#altlinkler{text-align:center;margin:auto;padding:25px;background:#00000011}#altlinkler a{line-height:25px}
#dipnot{margin:0}#alticons img{width:80%;margin-bottom:25px}
}