@charset "utf-8";
@import "fonts/stylesheet.css";
/*
font-family:'Neusa';
font-weight: normal; //400
font-weight: 500; //medium
font-weight: 600; //semibold
font-weight: bold; /700
*/

body {background:#eee; font-size:13px; font-weight:normal; font-family: 'Neusa', Arial, Helvetica, sans-serif; margin:0px; padding:0px;}

*:focus {outline:none;}
*, *:before, *:after {box-sizing:border-box;}
form {display:inline;}
img {border:none;}
sub, sup {font-size:80%; line-height:0; position: relative; vertical-align: baseline;}
sup {top:-0.3em;}
sub {bottom:-0.3em;}
table, td {border-collapse:collapse;}
ol {margin:0px; padding:0px; list-style-position:inside}

.container {display:flex; width:100%; max-width:1400px; margin:0 auto; position:relative; background:#fff;}
.container:after, .content:after, .subfooter:after, .tayburn:after {content:""; clear:both; display:block;}
.main-wrapper {min-height:500px; min-height:calc(100vh - 8em);}

aside {flex: 0 0 250px; min-height:100%; border-right:1px solid #000; padding:2em;}
main {flex: 1;}

img.home {width:100%; max-width:150px; height:auto; display:block; margin-bottom:2em;}

header {display:flex; justify-content:space-between; align-items:flex-end; padding:2em 2em; background:#EAF1FA; position:relative;}
.header > div > img {width:100;}
.logo-otokoc {width:40%; max-width:200px;}
.logo-yuvamdunya {width:25%; max-width:126px;} /* Otokoç logosunun %63'ü */
.title {position:absolute; bottom:20%; width:40%; left:30%; font-weight:500; text-align:center; font-size:20px; line-height:110%;}

.links {display:flex; flex-direction:column; gap:1em; justify-content:center; align-items:center; position:fixed; right:1em; top:calc(50vh - 105px); top:calc(50dvh - 105px); width:40px; z-index:100;}
.download {width:40px; height:auto; display:block;}
.social {width:25px; height:25px; display:block;}
.lang {font-size:1.3rem; text-decoration:none; color:#fff; font-weight: 600; background:#6da4d8; padding:3px 5px; margin-bottom:1rem;}

.subfooter {display:flex; justify-content:space-between; font-weight:500; font-size:14px; color:#6f6f6f; margin-bottom:25px; padding:2em 1em;}
.subfooter > div {display:flex; align-items:center; flex-grow:1; Xoutline:1px solid red;}
.subfooter a {text-decoration:none; color:#6f6f6f;}
.copyright {justify-content:flex-end;}
.yasal {justify-content:center;}

.content p {font-size:18px; font-weight:500; margin-bottom:1em; line-height:120%;}
.content p strong, .content li strong {font-weight:600;}
.content ul {padding-left:15px; list-style:disc outside; margin:1em 0 1em 0;}
.content ol {padding-left:15px; list-style-type:decimal; margin:1em 0 1em 0;}
.content li {margin-bottom:5px; font-weight:500; font-size:18px; line-height:120%;}
.content em {font-style:italic;}

.tepe {border-bottom:1px solid #000; padding:2em 0; margin:0 auto 2em 0;}
.tepe img {width:50%; min-width:330px; display:block; margin:0 auto;}
.rounded {display:flex; flex-direction:row; flex-wrap:wrap; gap:2%; justify-content:space-between;}
.rounded > div {border-radius:15px; padding:1em; flex:0 1 32%; margin-bottom:2em; text-align:center; display:flex; align-items:center;}
.turuncu > div {background:#FC9E24; color:#fff;}
.turkuaz > div {background:#6DA4D8; color:#fff;}
.kahve > div {background:#A59082; color:#fff;}
.mor> div {background:#6A729F; color:#fff;}
.turkuaz > div.ghost, .kahve > div.ghost {background:none;}

.spot {border-top:1px solid #000; border-bottom:1px solid #000; padding:1em 0; color:#d2232a;}

.prev-next > div {display:none;}
.prevLink, .nextLink {display:inline-flex; margin-right:2rem; align-items:center; gap:0.5em; text-decoration:none; color:inherit; font-size: 1rem;}
.prevLink img, .nextLink img {height:2rem;}

@media screen and (max-width: 900px) {/* Mobil */
	.nomobile {display:none;}
	.mobile {display:block;}
	aside {display:none;}
	.content {padding:2em 1em;}
	.links {right:0.3em; opacity:.65;}
	.download {width:28px;}
	.social {width:22px; height:22px;}
	.rounded > div {flex:0 1 49%;}
	header {padding:3em 2em 1em 2em;}
	.title {top:12%; width:65%; left:20%; font-size:15px;}
}

@media screen and (max-width: 400px) { /* dar mobil ekrana özel */
	.rounded > div {flex:0 1 90%; flex-grow:1;}
}

@media screen and (min-width: 901px) {/* Masaüstü */
	.mobile {display:none;}
	.content {padding:2em 2em;}
}