@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap&subset=latin-ext');


body							{background:#f4f4fa; margin:0; padding:0; float:left; width:100%; font-family: 'Jost', sans-serif;, sans-serif; letter-spacing: -0.5px;}
a								{font-family: 'Jost', sans-serif;, sans-serif; text-decoration: none; color:white}
section							{width: 100%; float: left;}
.anaBlok						{position: relative;  background-color: transparent; height: calc(100% - 0px); }
.solBlok						{padding:0; border-right: 2px solid #f4f4f4; background-color: #010210; width: 295px; height: 100%; position: absolute; top: 0px; left: 0px; z-index: 555; box-shadow: 0px 0px 15px rgba(0,0,0,0.20);}
.sagBlok						{z-index: 150; width: 295px; height: 100%; right: 0px; overflow: visible !important; top: 0px; position: absolute; background-color: #fff; border-left: 2px solid #f4f4f4; border-right: 0px solid #bbb; box-shadow: 0px 0px 15px rgba(0,0,0,0.20);}

.ortaBlok .koltuk				{width: calc(100% - 627px); height: 100%; position: absolute; left: 0px; right: 0px; margin-left: auto;  margin-right: auto; overflow: hidden;}
.koltuk_container				{height: 100vh; width: 100vh; margin-left: auto; margin-right: auto; position: relative; display: block; background-image: url(bos.png); background-repeat: no-repeat; background-position: center; background-size: auto 100%;}
.solBlokLogo					{padding:10px 0; text-align:center}
.solBlokLogo img				{height:165px}
.aracSecimAdimlari				{float:left; width:100%;}
.aracSecimButon					{float:left; width:33.3333%; text-align:center}
.aracSecimAdimAciklamalari		{float:left; width:100%; background:#010210; color:#f00; padding:8px 0; text-align:center; min-height: 50px; line-height: 19px;}
.aracSecimAdimAciklamalari p	{ display: inline-block;   vertical-align: middle;}
.aracSecimButon a				{background:#000; color:#f1e2e2; padding:5px 0; text-align:center; display:block; cursor:no-drop}
.aracSecimButon	.active			{background:#f19f0d; color:#ffffff; cursor:context-menu}
.aracSecimButon	.select			{background:#bf851d; color:#fff; cursor:context-menu}
.aracSecimSorgulari 			{float:left; width:96%; margin:0px 2%}
.solScroll						{ width: 100%; float: left; height: calc(100% - 187px);  padding-top: 1%;  margin-top: 0px;  position: relative;}
.sagScroll						{ width: 100%; float: left; height: calc(100% - 250px);  padding-top: 1%;  margin-top: 0px;  position: relative;}
.scrollBar						{ width: 100%; float: left; height: calc(77% - 4%);  padding-top: 1%;  margin-top: 1%;  position: relative;}
.secimScroll					{ width: 100%; float: left; width: calc(100% - 187px);  padding-top: 1%;  margin-top: 0px;  position: relative;}


.koltuk_zoom {position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 250; overflow: hidden;}
.koltuk_zoom img {height: auto; display: none; opacity: 1; width: 100%; }

.canvas-container {width: 100% !important; height: 100% !important; }
#otomCanvas {width: 100% !important; height: 100% !important; float: left; position: relative; }
.upper-canvas	{width: 100% !important; height: 100% !important; display: none !important; }


.magnify								{position: relative;  display: inline-block;}
.magnify .magnify-lens					{position: absolute; width: 250px; height: 250px; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; border: 2px solid #fff; box-shadow: inset 0px 0px 50px rgba(0,0,0,0.5), 0px 0px 50px rgba(0,0,0,0.5);background-color: #fff;  cursor: none;  display: none;  z-index: 100;}
.magnify .magnify-lens.loading			{background: none !important; }
.magnify .magnify-lens.loading:after	{position: absolute;  top: 43%; left: 0; width: 100%; color: #fff; content: 'Loading...'; font: italic normal 16px/1 Calibri, sans-serif; text-align: center; text-shadow: 0 0 2px rgba(51, 51, 51, .8);}


.markaListBox					{width: calc(33.33333% - 10px); height: auto; cursor: pointer; margin-right: 5px; margin-bottom: 5px; border-radius: 2px; border: 1px solid #eee; background-color: #fff; float: left; position: relative; text-align: center; display: flex; align-items: center; justify-content: center; min-height: 75px;}
.markaListBox:hover				{border:1px solid #666}
.markaListBox img				{width:100%; max-height:72px}
.modelListBox a					{float: left; width: 130px; overflow: hidden; height: 60px; border: 1px solid #f2f2f2; border-radius: 2px; margin: 3px; text-align:center; line-height: 60px;}
.modelListBox a:hover			{border:1px solid #666}
.dnone							{display:none}

.yilListBox					{float: left; width: 140px; overflow: hidden; height: 130px; border-bottom: 1px solid #f2f2f2; padding:10px 0}
.yilListBox:hover			{border-bottom: 1px solid #666;}
.yilListImg					{float: left; width: 100%; overflow: hidden; height: 96px; margin-bottom:5px; text-align:center}
.yilListImg	img				{max-width: 125px;}
.yilListInfo				{float: left; width: 100%; text-align:center; padding:5px; font-size:12px}

.kolTipListBox				{float: left; width: 134px; overflow: hidden; height: 185px; border: 1px solid #f2f2f2; border-radius: 2px; margin: 3px;}
.kolTipListBox p			{float: left; width: 100%; overflow: hidden; height: 50px;  font-family:tahoma; font-size:11px; text-align:center; color: white}
.kolTipListBox:hover		{border:1px solid #666}
.kolTipListBox img			{width:100%;}
.grupButon					{width:98%; background:#ebebeb; float:left; margin:2px 1%; color:#333; text-align:center; border-radius:4px; padding:23px 0; font-size: 14px;}
.grupButon:hover			{background:#333; color:#fff; }
#htmlDataImagesData			{display:none}

.imgZoom					{width: 25px; position: absolute;  z-index: 1; margin: 3px 0 0 110px}
.imgZoom img				{width:20px}


.imgZoom2					{width: 25px; position: absolute;  z-index: 1; margin: 10px}
.imgZoom2 img				{width:20px}


.resultDiv					{float:left; width:100%; margin-top:10px; text-align:center}
.resultDiv	p				{font-size:14px}
.resultText					{float:left; width:96px;  font-weight: 300; font-size: 16px; ; text-align:left; color: white}
.resultValue				{float:left; width:198px; ; text-align:left; color: white}
#resultMessage				{float:left; width:100%; color:#06ae47}
#resultMessage	p			{float:left; width:100%; color:#333; font-size:14px; margin:5px 0}

#markaValue		img			{height: 76px; border: 1px solid #ccc;}
#resultKasaType	img			{width:90%}
#resultKasaImg	img			{width:90%}
.imgTextValue				{line-height:76px}

.koltukSecimAdimlari				{float:left; width:100%;}
.koltukSecimButon					{float:left; width:33.3333%; text-align:center}
.koltukSecimAdimAciklamalari		{float:left; width:100%; background:#f0f0f0; color:#333; padding:8px 0; text-align:center}
.koltukSecimButon a					{background:#fff; color:#333; padding:5px 0; text-align:center; display:block; cursor:pointer}
.koltukSecimButon a	span			{display:block; width:100%; text-align:center}
.koltukSecimButon	.active			{background:#f0f0f0; color:#333;}
.koltukSecimButon	.select			{background:#090;}
.koltukSecimAciklamalari			{float:left; width:100%; background:#f0f0f0; color:#f00; padding:8px 0; text-align:center; min-height: 50px;}
.koltukSecimAciklamalari		 p	{display: inline-block;   vertical-align: middle; margin:0}
.koltukecimSorgulari 				{float:left; width:96%; margin:0px 2%}


.koltukSecimButonu					{float:left; width:100%; height:64px; position: absolute;bottom: 0; background:#fff}
.koltukSecimButonu div				{float:left; width:50%; text-align:center; margin-top:10px}
.geriButon							{display:inline-block; width:48px; height:48px; background-image: url(buton-set.png);}
.geriButon:hover					{background-position: 48px 0px;}
.onayButon							{display:inline-block; width:48px; height:48px; background-image: url(buton-set.png); background-position: 0px 48px;}
.onayButon:hover					{background-position: 48px 48px;}



.kumasListeKutu				{float:left; width:88px; height:127px; margin:4px}
.kumasListeKutu img			{width:82px; border-radius:8px; border:4px solid #fff}
.kumasListeKutu:hover img, .kumasListeKutu .select	{border:4px solid #090}
.kumasListeKutu	p			{float:left; width:100%; margin:-7px 0 0 0; font-size: 12px; padding: 0 5px; font-weight:700}
.kumasListeKutu	i			{font-weight:400; font-style:normal; display:block; line-height: 10px;}
.koltukMataryelDiv a		{width:100%; text-align:center; padding:8px 0; background:black; color:#fff; display: inline-block;}



#FiyatBilgisi { position: absolute; right:308px; font-size:32px; bottom:10px}
.FiyatBilgisi {float: left; width: 100%; text-align: center;background: #f00; color: #fff; font-size: 18px; padding: 15px 0;}
.FiyatBilgisi strong { width: 100%; float:left}




.OrderBox								{float:left; width:100%; margin:0; padding:0; background:black}

.OrderBoxDiv2							{float:left; width:400px; margin:10px;}
.OrderBoxDiv							{float:left; width:301px; margin:10px;}
.OrderBoxDiv p, .OrderBoxDiv2 p			{margin:0}
.OrderBoxDivTitle						{float:left; width:100%; margin-bottom:20px; padding:10px 0; text-align:center; background:#dfdfdf;; border:1px solid #fff; font-weight:bold; font-size:18px;  text-shadow: 1px 1px #fff; display: none}
.OrderBoxInfo							{float:left; width:96%; background:#000; padding:2%}
.OrderBoxLine							{float:left; width:92%;  padding:6px 4%; background: rgb(224,224,224); background: linear-gradient(0deg, rgba(224,224,224,1) 0%, rgba(255,255,255,1) 100%); border-bottom:1px solid #ccc}
.OrderBoxLineTitle						{float:left; width:40%; }
.OrderBoxLineInfo						{float:left; width:60%; font-weight:bold}
.OrderBoxLineFullTitle					{float:left; width:100%; }
.OrderBoxLogo					        {float:left; width:100%; display: none}
.OrderBoxLineFullInfo 					{float:left; width:100%; font-weight:bold}
.p15									{padding:15px}
.mb-10									{margin-bottom:10px}
.font-normal							{font-weight:normal; font-size:13px}
.bgwhite								{background:#fff}
.ImgFull								{max-width:100%}
.maxHeight								{max-height: 135px;}
.OrderMateryalBox						{float:left; width:92%;  padding:10px 4%; background: rgb(224,224,224); background: linear-gradient(0deg, rgba(224,224,224,1) 0%, rgba(255,255,255,1) 100%); margin-bottom:15px; height:143px}
.OrderMateryalLeft						{float:left; width:60%; }
.OrderMateryalRight						{float:left; width:30%; background:#fff; margin-left:10%; padding-top:10px}
.OrderMateryalRight		img				{width:100%}
.OrderMateryalTitle						{float:left; width:90%; margin-bottom:15px; background:#000; color:#fff;; padding:10px 5%; font-weight:bold; border-radius:0 6px 6px 0px}
.OrderMateryalCategory					{float:left; width:100%; margin-bottom:10px; font-size:14px}
.OrderMateryalCategoryColor				{float:left; width:30%; height:36px; line-height:36px}
.OrderMateryalCategoryColor	img			{width:40px;}
.OrderMateryalCategoryColorName			{float:left; width:70%; height:36px; line-height:36px}
.Order3DImages							{width:100%; float:left; padding:56px 0; min-height:290px}
.Order3DImages img						{width:100%;}
.OrderBoxBtn							{width:100%; float:left; margin-top:20px}
.OrderBoxBtn2							{width:100%; float:left; margin-top:20px}
.OrderSuccessBtn1						{width:92%; float:left; background: rgb(200,89,9); background: radial-gradient(circle, rgba(200,89,9,1) 0%, rgba(255,205,0,1) 100%); padding:25px 4%; text-align:center; font-size:18px; font-weight:bold; text-shadow: 1px 1px #ad4a02; color:#fff}
.OrderSuccessBtn1:hover					{background: rgb(255,205,0); background: radial-gradient(circle, rgba(255,205,0,1) 0%, rgba(173,74,2,1) 100%);}

.OrderSuccessBtn2						{width:92%; float:left; background: rgb(6,103,212);background: radial-gradient(circle, rgba(6,103,212,1) 0%, rgba(157,222,252,1) 100%); padding:25px 4%; text-align:center; font-size:18px; font-weight:bold; text-shadow: 1px 1px #0450a6; color:#fff; display: none}
.OrderSuccessBtn2:hover					{background: rgb(157,222,252);background: radial-gradient(circle, rgba(157,222,252,1) 0%, rgba(4,80,166,1) 100%);}

.OrderSuccessBtn3						{width:99%; float:left;background: rgb(5,93,9); background: radial-gradient(circle, rgba(5,93,9,1) 0%, rgba(103,228,80,1) 100%); padding:25px 4%; text-align:center; font-size:42px; font-weight:bold; text-shadow: 1px 1px #004604; color:#fff}
.OrderSuccessBtn3:hover					{background: rgb(103,228,80); background: radial-gradient(circle, rgba(103,228,80,1) 0%, rgba(5,93,9,1) 100%);}

.OrderSuccessBtn3	p					{font-size:32px}

.orderPop									{width:100%; z-index: 43999; height: 100%;	background-color: rgba(0,0,0,1);	position: fixed; top: 0px;	left: 0px;	overflow-y: scroll;	display: none;}
.orderPop .orderPopInfo						{width:1385px; height: auto; position: absolute; left:0px; right: 0px;	top: 30px; margin: auto;}





.pageLoading				{float: left; width: 100%; text-align: center;}
.pageLoading img			{width:90%}


.popBox									{width: 100%; z-index: 43999; height: 100%;	background-color: rgba(0,0,0,0.9);	position: fixed; top: 0px;	left: 0px;	overflow-y: scroll;	display: none;}
.popBox .popInfo						{width: auto; max-width: 420px; height: auto; background: #fff; border-radius: 3px; margin-bottom: 30px; position: absolute; left:0px; right: 0px;	top: 30px; margin-left: auto; margin-right: auto;}
.popBox .popInfo .popBody				{float: left; position: relative;	padding:15px;}
.popBox .popInfo .popBtns				{width: 100%; display: inline-block;	text-align: right; position: relative; top:8px; right:3px}
.popCloseBtn							{background:#d73b3b; color:#fff; padding:5px 10px; border-radius: 4px;}


.pasifPencere							{width: 100%; height: 100%; top: 0px; left: 0px; position: absolute; background-color: rgba(0,0,0,0.53); z-index: 554; display: block;}



.loadingDiv								{width: 100%; height: 100%; top: 0px; left: 0px; position: absolute; background-color: rgba(0,0,0,0.53); z-index: 554; display: none;}
.loadingDivIcon							{width:320px; height:320px; top:0px; left:0px; right:0px; bottom:0px;	margin:auto; display:block; position:absolute; 	z-index:5000;	background-image:url(web-loading.gif); background-repeat:no-repeat; background-size:171px; background-position:center;}



#koltuk_fabrikasi {
	width: 100% !important;
	height: 100% !important;
	float: left;
	position: relative;
}



.CallCenter						{float:left; width:96%; height:48px; padding:2%; margin:10px 0; border-radius: 6px; background:#fff }
.CallCenterIcon					{float:left; width:60px; height:48px;}
.CallCenterIcon	img				{height:48px;}
.CallCenterText					{float:left; width:220px; height:48px; text-align:left; font-size:17px; line-height: 24px;}
.CallCenterText	span			{float:left; width:220px; font-size:20px; font-weight: bold;}

.WhatsappSuuport						{float:left; width:100%; height:48px; }
.WhatsappSuuportIcon					{float:left; width:60px; height:48px;}
.WhatsappSuuportIcon	img				{height:48px;}
.WhatsappSuuportText					{float:left; width:220px; height:48px; text-align:left; line-height:48px}
.WhatsappSuuportText a					{font-size:28px; color:#1cac33; }




/* end */