/*
#register {
	width:90%; 
	margin:0px auto!important;
}
*/

#divEnterCode, #divEnterCode .input-wrapper {
	width: 90%;
	margin: 0px auto !important;
	padding: 0px !important;
}

	#divEnterCode .input-wrapper {
		margin-top: 15px !important;
	}

input[type="checkbox"] {
	margin-right: -15px;
	zoom: 1.4;
	z-index: 99;
	margin-left: 10px;
}


input:checked ~ label {
	background-color: #e9ffac;
}

/* S: SEARCH */

.search-item {
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	-ms-border-radius: 20px;
	-o-border-radius: 20px;
	box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25);
	margin-bottom: 20px;
	padding: 15px;
	background-color: #ffffff;
}

	.search-item:last-child {
		margin-bottom: 0;
	}

	.search-item:first-child {
		margin-top: 20px;
	}

.search-product-title {
	font-size: 18px;
	line-height: 22px;
	text-align: center;
	margin-bottom: 15px;
}

	.search-product-title strong {
		font-size: 20px;
		text-align: center;
		font-weight: 700;
	}

/* E: SEARCH */

/* S: FORM CSS */
#kisiselBilgiler {
	margin-top: 15px;
}

.form-outer {
	padding: 10px !important; 
   /* background-color: #f6f6f6;*/
   /* -webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	-ms-border-radius: 25px;
	-o-border-radius: 25px;*/
	/*font-family: proxima-nova, sans-serif;*/
}

	.form-outer.white {
		/*background-color: #ffffff;*/
	}

	.form-outer.mt-20 {
		margin-top: 20px;
	}

	.form-outer.mt-25 {
		margin-top: 25px;
	}

	.form-outer.transparent {
		padding: 0;
		background-color: transparent;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		-ms-border-radius: 0;
		-o-border-radius: 0;
	}

	.form-outer.smaller {
		/*padding-left: 16px;*/
		/*padding-right: 16px;*/
	}

.form-center {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.form-logo {
	margin-bottom: 14px;
}

.form-header {
	font-size: 18px;
	font-weight:bold !important;
	margin-top: 13px;
	text-align: center;
	padding: 10px;
	color: #275A82;
}

	.form-header.password {
		width: 220px;
	}

.form-head {
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 16px;
}

	.form-head.normal {
		font-weight: 400;
	}

.form-text {
	/*margin-bottom: 21px;*/
	line-height: 17px;
	font-weight: 500;
	text-align: center;
	font-size: 13px;
}

	.form-text.mb-0 {
		margin-bottom: 0;
	}

	.form-text.mt-22 {
		margin-top: 22px;
	}

.input-outer {
	width: 100%;
	margin-bottom: 16px;
}

	.input-outer.center {
		text-align: center;
	}

	.input-outer.mb-0 {
		margin-bottom: 0;
	}

.form-data-outer {
	width: 100%;
}

	.form-data-outer.register {
		background-color: #ffffff;
		box-shadow: 0px 1px 15px rgb(17 154 215 / 0.15);
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		-ms-border-radius: 5px;
		-o-border-radius: 5px;
		padding: 10px 0;
	}

		.form-data-outer.register .input-wrapper,
		.form-data-outer.register .button-wrapper {
			padding-left: 16px;
			padding-right: 16px;
		}

.input-wrapper {
	width: 99%;
	padding:0px !important;
	margin:0px auto !important;
} 

	.input-wrapper span {
		color: #000000;
		font-size: 12px;
		font-weight: 300;
		margin:3px !important;
		display:inline-block !important;
		margin-bottom:5px !important;
	}
		.warning{
			color:#e44724 !important;
		}

	.hidden-wrapper {
		display: none !important;
	}

	.input-wrapper:not(.use-mb):last-child {
		margin-bottom: 0;
	}

.two-input-wrapper {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
}

	.two-input-wrapper .input-wrapper {
		flex-basis: calc((100% / 2) - 5px);
		max-width: calc((100% / 2) - 5px);
		width: auto;
	}

.button-wrapper {
	width: 100%;
}

	.button-wrapper.mt-5 {
		margin-top: 5px;
	}

	.button-wrapper.mt-21 {
		margin-top: 21px;
	}

	.button-wrapper.two-col {
		display: flex;
		justify-content: space-between;
	}

.button-col {
	width: 100%;
	display: flex;
}

	.button-col.mt-10 {
		margin-top: 10px;
	}

	.button-col.h-left {
		justify-content: flex-start;
	}

	.button-col.h-center {
		justify-content: center;
	}

	.button-col.h-right {
		justify-content: flex-end;
	}

.button-wrapper.two-col .button-col {
	width: 50%;
}


.form-delete {
	height: 30px;
	background-color: #c40000;
	font-size: 13px;
	font-weight: 500;
	padding: 0 16px;
	display: inline-flex;
	vertical-align: top;
	align-items: center;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	-ms-border-radius: 20px;
	-o-border-radius: 20px;
	transition: all 0.4s ease;
	color: #ffffff;
	cursor: pointer;
	text-decoration: none;
	margin-top: auto;
}

	.form-delete:hover,
	.form-delete:focus {
		box-shadow: 0px 0px 15px rgba(148, 148, 148, 0.25);
		background-color: #840000;
	}

	.form-delete i {
		margin-right: 5px;
	}

.form-input-head {
	padding-left: 18px;
	margin-bottom: 5px;
	display: inline-block;
	vertical-align: top;
}
/*
.form-input {
	width: 88%;
	margin: 0px auto !important;
	//max-width: 318px;
	height: 42px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	-ms-border-radius: 0px;
	-o-border-radius: 0px;
	border: none;
	border-bottom: 1px solid #6f777d;
	padding-left: 18px;
	padding-right: 18px;
	display: inline-flex;
	vertical-align: top;
	font-weight: 500;
	font-size: 15px;
	transition: all 0.4s ease;
	background-color: transparent;
	font-family: proxima-nova, sans-serif;
	color: #222222 !important;
}
*/
	.form-input.circle {
		width: 42px;
		padding-left: 0;
		padding-right: 0;
		text-align: center;
	}

	.form-input.full {
		max-width: 88%;
	}

	.form-input:focus {
		outline: 0;
		/*border-color: #cdeb78;*/
	}

.form-textarea {
	width: 100%;
	height: 75px;
	color: #000000;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	border: 1px solid #000000;
	padding: 18px;
	display: inline-flex;
	vertical-align: top;
	font-weight: 500;
	font-size: 15px;
	transition: all 0.4s ease;
	font-family: proxima-nova, sans-serif;
	resize: none;
}

	.form-textarea:focus {
		outline: 0;
		border-color: #cdeb78;
	}

.reset-password-wrapper {
	width: 100%;
	text-align: center;
	margin-top: 23px;
}

	.reset-password-wrapper a {
		font-weight: 700;
		color: #000000;
		text-decoration: none;
		transition: all 0.4s ease;
	}

/*
.field-error {
	border-color: #ff0000 !important;
}

	.field-error::-webkit-input-placeholder {
		color: #ff0000;
	}

	.field-error:-moz-placeholder {
		color: #ff0000;
	}

	.field-error::-moz-placeholder {
		color: #ff0000;
	}

	.field-error:-ms-input-placeholder {
		color: #ff0000;
	}

	.field-error::placeholder {
		color: #ff0000;
	}
*/
.form-select {
	width: 88%;
	height: 42px;
	border: none;
	border-bottom: 1px solid #6f777d;
   /* padding-left: 18px;
	padding-right: 18px;*/
	font-weight: 500;
	font-size: 15px;
	transition: all 0.4s ease;
	font-family: proxima-nova, sans-serif;
	color: #222222 !important;
}

	.form-select::selection {
		color: #222222 !important;
	}

	.form-select.full {
		max-width: 100%;
	}

	.form-select.smaller {
		height: 30px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		-ms-border-radius: 5px;
		-o-border-radius: 5px;
		padding-left: 10px;
		padding-right: 10px;
	}

	.form-select:focus {
		outline: 0;
	   /* border-color: #cdeb78;*/
	}

.checkbox-container {
	font-weight: 400;
	display: inline-block;
	vertical-align: top;
	margin: 0;
	position: relative;
	cursor: pointer;
}

	.checkbox-container a {
		color: #000000;
	}

		.checkbox-container a:active {
			color: #000000;
		}

	.checkbox-container.agreement {
		background-color: #ffcc7e;
		-webkit-border-radius: 25px;
		-moz-border-radius: 25px;
		-ms-border-radius: 25px;
		-o-border-radius: 25px;
		box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25);
		padding: 10px 20px;
		margin-bottom: 20px;
	}

		.checkbox-container.agreement.clicked {
			background-color: #efffc3;
		}

	.checkbox-container:after {
		content: "";
		display: block;
		clear: both;
	}

	.checkbox-container input {
		position: absolute;
		opacity: 0;
		left: 0;
		top: 0;
		width: 20px;
		height: 20px;
		margin: 0;
		cursor: pointer;
		zoom: 1;
	}



	.checkbox-container .checkbox-span {
		cursor: pointer;
		border: 2px solid rgba(0, 0, 0, 0.5);
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		-ms-border-radius: 100%;
		-o-border-radius: 100%;
		height: 20px;
		width: 20px;
		float: left;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: all 0.4s ease;
		z-index:990 !important;
		background-color:pink !important;
	}

		.checkbox-container .checkbox-span i {
			display: none;
		}

	.checkbox-container input:checked + .checkbox-span i {
		display: block !important;
	}

	.checkbox-container .checkbox-text {
		float: left;
		width: calc(100% - 20px);
		padding-left: 10px;
		color:#000000;
	}

.checkbox-container_ input + label {
	padding-left: 22px;
	padding-right: 22px;
	cursor: pointer;
	transition: all 0.4s ease;
	background-color: transparent !important;
	color: #000000;
	font-size: 12px;
	font-weight: 300;
}


.radio-outer,
.radio-wrapper,
.radio-container {
	width: 100%;
}

.radio-container {
	position: relative;
	padding:0px;
	margin:0px;
}

.radio-outer.two-col {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
}

.radio-outer.two-col .radio-wrapper {
		width: auto;
	}

.faturaRadioRow {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	padding-left: 18px;
	padding-right: 18px;
	margin-bottom: 16px;
}

#faturabilgileri .radio-head {
	font-size: 15px;
	font-weight: 500;
	flex-basis: 100px;
	max-width: 100px;
}

#faturabilgileri .radio-outer {
	flex-basis: calc(100% - 10px);
	max-width: calc(100% - 10px);
}

.form-data-outer.register .radio-outer {
	margin-bottom: 16px;
}

.form-data-outer.register .radio-wrapper {
	border-bottom: 1px solid #a9a9a9;
}

.form-data-outer.register .radio-wrapper:first-child {
		border-top: 1px solid #a9a9a9;
	}


.radio-container input {
	position: absolute;
	opacity: 0;
	left: 0;
	top: 0;
	width: 20px;
	height: 20px;
	margin: 0;
	cursor: pointer;
	zoom: 1;
}

	.radio-container input + label{
		padding-left: 5px;
		padding-right: 16px;
		display: flex;
		align-items: center;
		position: relative;
		cursor: pointer;
		height: 38px;
		transition: all 0.4s ease;
	}

.radio-container.default input + label {
	padding-left: 0;
	padding-right: 0;
	height: auto;
	display: inline-flex;
	vertical-align: top;
}

.radio-container input:checked + label {
	background-color: #e9e9e9;
	color:#000000 !important;
}

.radio-container.default input:checked + label {
	background-color: transparent;
}

.radio-container .radio-span {
	cursor: pointer;
	border: 2px solid rgba(0, 0, 0, 0.5);
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	-ms-border-radius: 100%;
	-o-border-radius: 100%;
	height: 20px;
	width: 20px;
	float: left;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.4s ease;
}

.radio-container.default .radio-span {
	border-color: #000000;
}

.faturaRadioRow.field-error .radio-container.default .radio-span {
	border-color: #ff0000;
}

.radio-container input:checked + label .radio-span {
	border-color: #000000;
}

.radio-container .radio-span i {
	display: none;
}

.radio-container input:checked + label .radio-span i {
	display: block;
}

.radio-container .radio-text {
	float: left;
	width: calc(100% - 20px);
	padding-left: 10px;
	font-size: 16px;
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: #666666;
	transition: all 0.4s ease;
}

.radio-container.default .radio-text {
	color: #000000;
	font-size: 15px;
	font-weight: 500;
}

.faturaRadioRow.field-error .radio-container.default .radio-text {
	color: #ff0000;
}

.radio-container input:checked + label .radio-text {
	color: #275A82;
}

.error-message {
	background-color: #ff0000;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	-ms-border-radius: 25px;
	-o-border-radius: 25px;
	padding: 15px;
	color: #ffffff;
	text-align: center;
	margin-top: 16px;
	font-size: 14px;
}

.error-message.success {
		background-color: #117600;
	}

.error-message.mt-0 {
		margin-top: 0;
	}



/* E: FORM CSS */

.error {
	/*box-shadow: 3px 3px 3px rgb(224 24 24  / 0.25);
	padding: 5px !important;*/
	border-color: rgb(223 43 71) !important;
	background-color:#f5caca !important;
}



#subModal, .modal{
	width:80%;
	max-width:800px;
	margin:0px auto !important;
}


/** float container 
.float-container {
	box-sizing: border-box;
	margin-bottom: 8px;
	padding: 0px !important;
	position: relative;

	width: 88%;
	border: none;
	border-bottom: 1px solid #6f777d;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	-ms-border-radius: 0px;
	-o-border-radius: 0px;
}

	.float-container input {
		border: none;
		outline: 0;
	   padding: 10px 0px 0px 10px;
		width: 100%;

	   
		margin: 0px auto !important;
		height: 42px;

		display: inline-flex;
		vertical-align:text-bottom;
		font-weight: 500;
		font-size: 15px;
		transition: all 0.4s ease;
		background-color: transparent;
		font-family: proxima-nova, sans-serif;
		color: #222222 !important;
	}

	.float-container label {
		font-size: 14px;
		position: absolute;
		transform-origin: top left;
		transform: translate(0, 16px) scale(1);
		transition: all 0.1s ease-in-out;
		color:#222222 !important;
	}

	.float-container.active label {
		transform: translate(0, 4px) scale(0.70);
		color:#0776d9 !important;
	}
	*/



/* ENTER PASS CODE CSS */

.hide {
	display: none;
}

:root {
	/* colors palette */
	--placeholder-color: hsl(240, 54%, 87%);
	--bg-color: hsl(240, 54%, 97%);
	--focus-color: hsla(240, 54%, 61%, 0.6);
	--shadow-color: hsla(240, 54%, 61%, 0.2);
	--text-color: hsl(0, 0%, 20%);
	--text-color-inversed: hsl(0, 0%, 95%);
	--success-color: hsl(145, 63%, 42%);
	--success-color-desaturated: hsl(145, 0%, 42%);
	--failure-color: hsl(0, 79%, 63%);
	/* border-radius */
	--border-radius: 6px;
	/* z-index */
	--z-index-xs: 1;
	--z-index-sm: 10;
	--z-index-md: 100;
	/* easing */
	--easing: cubic-bezier(0.25, 0.01, 0.25, 1);
	/* transition durations */
	--transition-duration-step-1: 450ms;
	--transition-duration-step-2: 300ms;
	--transition-duration-step-3: 300ms;
	/* transition delays */
	--transition-delay-step-2: calc(var(--transition-duration-step-1));
	--transition-delay-step-3: calc( var(--transition-duration-step-1) + var(--transition-duration-step-2) );
	/* transition properties */
	--transition-step-1: var(--transition-duration-step-1) var(--easing);
	--transition-step-2: var(--transition-duration-step-2) var(--easing) var(--transition-delay-step-2);
	--transition-step-3: var(--transition-duration-step-3) var(--easing) var(--transition-delay-step-3);
	/*text-transform:uppercase;*/
}

#divEnterCode .main {
	display: grid;
	justify-content: center;
	margin: 10px !important;
	padding: 10px !important;
	margin-top: 20px !important;
}

#divEnterCode .label {
	font-size: 14px;
	line-height: 15px;
	text-align: center;
	letter-spacing: 0.01em;
	color: var(--text-color);
}

	#divEnterCode .label.is-muted {
		color: #828282;
	}

#divEnterCode .animation-controls {
	margin-top: 55px;
}

#divEnterCode .animation-controls__content {
	display: grid;
	grid-auto-flow: column;
	justify-content: center;
	gap: 6px;
}

#divEnterCode .btn {
	min-width: 90px;
	padding: 9px 0;
	border: 0;
	border-radius: 6px;
	font-size: 14px;
	line-height: 15px;
	letter-spacing: 0.01em;
	font-weight: bold;
	cursor: pointer;
	transition: opacity 150ms ease-in;
}

	#divEnterCode .btn:hover,
	#divEnterCode .btn:focus {
		opacity: 0.7;
	}

	#divEnterCode .btn:active {
		position: relative;
		top: 1px;
	}

	#divEnterCode .btn.success-btn {
		color: #219653;
		background-color: #d3eadd;
	}

	#divEnterCode .btn.failure-btn {
		color: #eb5757;
		background-color: #ffe9e0;
	}

	#divEnterCode .btn.reset-btn {
		color: #6666d1;
		background-color: #f2f2f2;
	}

#divEnterCode .settings-controls {
	margin-top: 130px;
}

#divEnterCode .settings-controls__content {
	display: grid;
	justify-content: center;
	gap: 18px;
}

#divEnterCode .settings-controls__input {
	width: 67px;
	height: 33px;
	border: 0;
	border-radius: 6px;
	font-size: 14px;
	line-height: 15px;
	font-weight: bold;
	letter-spacing: 0.01em;
	color: #828282;
	background-color: #f2f2f2;
	text-align: center;
}

#divEnterCode .settings-controls__label {
	font-size: 14px;
	line-height: 15px;
	letter-spacing: 0.01em;
	font-weight: bold;
	color: #828282;
}

/* SMS Code input styles */
/* base styles */

#divEnterCode .fieldset {
	position: relative;
	display: grid;
	grid-auto-flow: column;
	justify-content: center;
	column-gap: 12px;
	border-radius: 6px;
	overflow: hidden;
	will-change: transform;
	/* make shadows of inner elements visible */
	padding: 6px;
	margin: -6px;
	max-width: 300px
}

	#divEnterCode .fieldset::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		transform: translateX(-100%);
	}

#divEnterCode .box {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 42px;
	/*width: 36px !important;
					max-width: 42px;*/
	border-radius: var(--border-radius);
	box-shadow: 0 0 6px 1px var(--shadow-color);
	overflow: hidden;
	will-change: transform;
}

	#divEnterCode .box:focus-within {
		box-shadow: 0 0 6px 1px var(--shadow-color), 0 0 0 2px var(--focus-color);
	}

	#divEnterCode .box::before,
	#divEnterCode .box::after {
		content: "";
		position: absolute;
		height: 100%;
		width: 100%;
		top: 0;
		left: 0;
		border-radius: var(--border-radius);
		overflow: hidden;
	}

	#divEnterCode .box::before {
		background: var(--bg-color);
		z-index: var(--z-index-xs);
		transition: background-color var(--transition-step-1);
	}

	#divEnterCode .box::after {
		transform: translateY(100%);
		background-color: var(--success-color-desaturated);
		opacity: 0;
		z-index: var(--z-index-sm);
		transition: transform var(--transition-step-1), opacity var(--transition-step-1), background-color var(--transition-step-1);
	}

#divEnterCode .field {
	position: relative;
	border: 0;
	outline: 0;
	font-size: 22px;
	line-height: 42px;
	color: var(--text-color);
	background-color: #666666;
	color: #ffffff;
	text-align: center;
	z-index: var(--z-index-md);
	text-transform: uppercase;
}

	#divEnterCode .field::placeholder {
		color: var(--placeholder-color);
	}

/* animate-success styles  */

#divEnterCode .animate-success.fieldset {
	padding: 0;
	margin: 0;
}

	#divEnterCode .animate-success.fieldset::before {
		background-color: var(--success-color);
		transform: translateX(0);
		transition: transform var(--transition-step-2);
	}

#divEnterCode .animate-success > .box {
	box-shadow: none;
	transition: transform var(--transition-step-3);
}

	#divEnterCode .animate-success > .box:nth-child(1) {
		transform: translateX(24px);
	}

	#divEnterCode .animate-success > .box:nth-child(2) {
		transform: translateX(12px);
	}

	#divEnterCode .animate-success > .box:nth-child(4) {
		transform: translateX(-12px);
	}

	#divEnterCode .animate-success > .box:nth-child(5) {
		transform: translateX(-24px);
	}

	#divEnterCode .animate-success > .box::before {
		background-color: transparent;
	}

	#divEnterCode .animate-success > .box::after {
		background-color: var(--success-color);
		transform: translateY(0);
		opacity: 1;
	}

	#divEnterCode .animate-success > .box > .field,
	#divEnterCode .animate-success > .box > .field::placeholder {
		color: var(--text-color-inversed);
		transition: color var(--transition-step-1);
	}

/* animate-failure styles  */

#divEnterCode .animate-failure.fieldset {
	animation-name: shaking;
	animation-duration: var(--transition-duration-step-2);
	animation-timing-function: var(--easing);
	animation-delay: var(--transition-delay-step-2);
}

#divEnterCode .animate-failure > .box::before {
	background-color: transparent;
}

#divEnterCode .animate-failure > .box::after {
	background-color: var(--failure-color);
	transform: translateY(0);
	opacity: 1;
}

#divEnterCode .animate-failure > .box > .field,
#divEnterCode .animate-failure > .box > .field::placeholder {
	color: var(--text-color-inversed);
	transition: color var(--transition-step-1);
}

@keyframes shaking {
	0%, 100% {
		transform: translateX(0);
	}

	25%, 75% {
		transform: translateX(10px);
	}

	50% {
		transform: translateX(-10px);
	}
}

/* End SMS Code input styles */
