/* Bootstrap Icon */
.bi--xs { font-size:0.5em!important; }
.bi--sm { font-size:0.75em!important; }
.bi--md { font-size:1em!important; }
.bi--lg { font-size:1.25em!important; }
.bi--xl { font-size:1.5em!important; }
.bi--2xl { font-size:2em!important; }
.bi--3xl { font-size:2.5em!important; }
.bi--4xl { font-size:3em!important; }
.bi--5xl { font-size:3.5em!important; }
.bi--6xl { font-size:4em!important; }
.bi--7xl { font-size:4.5em!important; }
.bi--8xl { font-size:5em!important; }
.bi--spin { -webkit-animation:bi--spin 2s infinite linear;animation:bi--spin 2s infinite linear; }

@import url('https://fonts.googleapis.com/css?family=Lato');
::-webkit-scrollbar { width:12px; }
::-webkit-scrollbar-track { background-color:#2c2c34; }
::-webkit-scrollbar-thumb { background-color:#88adbd; }
::-webkit-scrollbar-thumb:hover { box-shadow:0 0 30px 0 #000; }

:root {
	//--anketrenk: #0DFF92;
	//--anketrenk: #16bdf0;
	--header:radial-gradient(circle farthest-corner at 20% 40%,#12448d 15%,#8a1529 80%);
	//--footer:radial-gradient(circle farthest-corner at 20% 40%,#12448d 15%,#8a1529 80%);
	--footer:radial-gradient(circle farthest-corner at 50% 50%,#8a1529 15%,#12448d 80%);
	//--kategori:radial-gradient(circle farthest-corner at 40% 40%,#12448d 15%,#8a1529 80%);
	--kategori:radial-gradient(circle farthest-corner at 20% 40%,#12448d 15%,#8a1529 80%);
	--anketrenk:radial-gradient(circle farthest-corner at 20% 40%,#12448d 15%,#8a1529 80%);
	--text:#16DDF0;
	--butonbg:#436BA5;
	--butontxt:#ccc;
	--sonuc:#16DDF0;
}
body, html { font-family:'Lato',sans-serif; }
a { text-decoration:none; }
h1 { color:#ccc; }
h2 { color:#AAAAAA; }
header { background:var(--header);background-color:rgba(131,13,46,.7)!important;border-bottom:3px solid #0c63e4!important; }
footer { color:#fff!important;background:var(--footer);background-color:rgba(18,68,141,.7)!important;border-top:3px solid #0c63e4!important; }

.kategoriler { background-image:var(--kategori); }
.kategoriler li { display:flex;list-style:none;padding:0 5px;float:left }
.kategoriler li a { padding:15px 5px;color:#fff; }
.kategoriler li a:hover,
.kategoriler li.aktif a:hover { background:radial-gradient(rgba(255,255,255,.25),transparent); }
.kategoriler li.aktif a { text-decoration:underline;background:radial-gradient(rgba(255,255,255,.15),transparent); }

ul.anket { list-style:none;margin:0px 0px 20px 0px;padding:0;overflow:auto; }
ul.anket li { color:#AAAAAA;display:block;position:relative;float:left;width:100%;border-bottom:1px solid #333; }
ul.anket li input[type=radio] { position:absolute;visibility:hidden; }
ul.anket li label { display:block;position:relative;font-weight:300;font-size:1.15em;padding:5px 0 23px 61px;margin:4px auto;height:10px;z-index:9;cursor:pointer;-webkit-transition:all 0.25s linear; }
ul.anket li:hover label { color:#FFFFFF; }
ul.anket li .check { display:block;position:absolute;border:5px solid #AAAAAA;border-radius:100%;height:25px;width:25px;top:10px;left:20px;z-index:5;transition:border .25s linear;-webkit-transition:border .25s linear; }
ul.anket li:hover .check  { border:5px solid #FFFFFF; }
ul.anket li .check::before  { display:block;position:absolute;content:'';border-radius:100%;height:10px;width:10px;top:3px;left:3px;margin:auto;transition:background 0.25s linear;-webkit-transition:background 0.25s linear; }
ul.anket input[type=radio]:checked ~ .check { border:5px solid var(--text); }
ul.anket input[type=radio]:checked ~ .check::before { background:var(--text); }
ul.anket input[type=radio]:checked ~ label { color:var(--text); }

.anketliste ul.anket li a { font-size:1.1rem;color:#AAAAAA; }
.anketliste ul.anket li a:hover { color:#ccc; }


.sButton { padding:10px 30px 10px 30px;border-radius:30px;border:1px solid var(--butonbg);font-size:20px;background-color:transparent;color:#AAAAAA;transition:all 0.35s linear;-webkit-transition:all 0.35s linear; }
.sButton:hover { padding:10px 30px 10px 30px;border-radius:30px;transition:0.4s;font-size:20px;border:1px solid var(--buton);background-color:var(--butonbg);color:var(--butontxt);box-shadow:1px 1px 10px var(--buton);transition:all 0.35s linear;-webkit-transition:all 0.35s linear; }
.sButton:focus { outline:none; }
.soru { color:#aaa;text-shadow:2px 1px 1px #fff;font-weight:300;letter-spacing:2px; }
.secenek>div { margin:4px; }
.baslik { padding:2px 0;color:#AAA; }
.oy { display:block;color:#FFF;text-align:right; }
.progress { background-color:#7a7a7a7a;color:#FFF;width:100%;display:flex; }
.progress>div>sub { font-size:12px; }
.progress-bar { background-color:var(--sonuc);text-align:center;transition:4s;max-width:100%;display:flex; }
@media screen and (max-width:900px) { 
	.progress { background-color:#7a7a7a7a;color:#FFF;width:100%;display:flex;max-width:120%;grid-column:1/3; }
}

.swal2-popup { background:#212529!important;color:rgba(232,230,227)!important;border:3px solid #0c63e4!important; }
.swal2-title { color:rgba(255,255,255,.8)!important; }
.swal2-content { color:rgba(255,255,255,.6)!important; }
