/*------------- SPINNER-------------------*/
.spinner {
	width: 50px;
	height: 50px;
  
	position: relative;
	margin: 10px 10px 10px 15px;
  }
  
  .double-bounce1 {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background-color: white;
	opacity: 0.7;
	position: absolute;
	top: 0;
	left: 0;
	
	-webkit-animation: sk-bounce 2.0s infinite ease-in-out;
	animation: sk-bounce 2.0s infinite ease-in-out;
  }

 .double-bounce2 {
	width: 100%;
	height: 100%;
	border-radius: 50%;
background-color: white;
	opacity: 1;
	position: absolute;
	top: 0;
	left: 0;
	
	-webkit-animation: sk-bounce 2.0s infinite ease-in-out;
	animation: sk-bounce 2.0s infinite ease-in-out;
  }
  
  .double-bounce2 {
	-webkit-animation-delay: -1.0s;
	animation-delay: -1.0s;
  }
  
  @-webkit-keyframes sk-bounce {
	0%, 100% { -webkit-transform: scale(0.0) }
	50% { -webkit-transform: scale(1.0) }
  }
  
  @keyframes sk-bounce {
	0%, 100% { 
	  transform: scale(0.0);
	  -webkit-transform: scale(0.0);
	} 50% { 
	  transform: scale(1.0);
	  -webkit-transform: scale(1.0);
	}
  }
/*--------------------------------------------*/

@font-face {
	font-family: 'Titillium Web';
	src: URL('/font/TitilliumWeb-Light.ttf') format('truetype');
}

.logoBG {
	border-radius: 30px;
	padding: 40px;
	background-color: rgba(0, 0, 0, 0.4);
	width:fit-content;

}

.modal-scrollbar-measure {
	overflow: hidden !important;
}

/*/////////// TOOLTİP //////////////////////////*/

.tooltip {
	position: relative;
	display: inline-block;
	border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
	visibility: hidden;
	width: 120px;
	background-color: #555;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px 0;
	position: absolute;
	z-index: 1;
	bottom: 125%;
	left: 50%;
	margin-left: -60px;
	opacity: 0;
	transition: opacity 0.3s;
}

.tooltip .tooltiptext::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: #555 transparent transparent transparent;
}

.tooltip:hover .tooltiptext {
	visibility: visible;
	opacity: 1;
}

/* ///////////////////////////////////////////////////7 */

.hoverEffect:hover {
	cursor: pointer;
	opacity: 0.8;
}

body {
	font-size: 1rem !important;
	font-weight: 400;
	overflow-x: hidden;
	touch-action: pan-y;
	-ms-touch-action: pan-y;
}

.padding-x-25 {
	padding-left: 12.5%;
	padding-right: 12.5%;
}

.padding-x-33 {
	padding-left: 16.66666%;
	padding-right: 16.66666%;
}

.padding-x-35 {
	padding-left: 17.5%;
	padding-right: 17.5%;
}

.padding-x-58 {
	padding-left: 29.16666%;
	padding-right: 29.16666%;
}

.padding-x-75 {
	padding-left: 37.5%;
	padding-right: 37.5%;
}

.fixed-right {
	position: fixed;
	margin-top: 20px;
	right: 30px;
	width: 20%;
	z-index: 1030;
}

.wordwrap {
	overflow-wrap: break-word;
	word-wrap: break-word;
	hyphens: auto;
}

.dik-flex {
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
}

.iyzico {
	display: -ms-flexbox !important;
	display: flex !important;
}

.anton {
	font-family: "Anton", Times, serif;
}

.roboto {
	font-family: 'Roboto', sans-serif;
}

.arial {
	font-family: "Arial", Times, serif;
}

.alex {
	font-family: "Alex Brush", cursive;
	font-size: 2rem;
}

.open_sans {
	font-family: 'Open Sans', sans-serif;
}

.adetBildirim {
	position: absolute;
	margin-left: 8px;
	margin-top: -8px;
	font-size: 70%;
}

.adetSepet {
	position: absolute;
	margin-left: 12px;
	margin-top: -8px;
	font-size: 70%;
}

.badge-sepet {
	display: inline-block;
	padding: 0.25em 0.4em;
	font-size: 100% !important;
	font-weight: 400 !important;
	line-height: 1;
	text-align: center;
	white-space: nowrap;
	vertical-align: baseline;
	border-radius: 50%;
	color: white;
	background-color: #E7463F;
}

/* Chrome, Safari, Edge, Opera */

input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Firefox */

input[type=number] {}

input[type=radio] {
	cursor: pointer
}


textarea:focus {
	background-color: rgba(255, 255, 255, 0.8) !important;
	border-color: rgba(119, 146, 60, 0.5) !important;
	box-shadow: 0 0 0 0.01rem rgba(119, 146, 60, 0.25) !important;
}

.bg-siparisOzet {
	background-color: rgba(235, 235, 235, 1) !important;
}

.adet {
	position: absolute;
	margin-left: 8px;
	margin-top: -8px;
	font-size: 70%;
}

.adet span {
	font-weight: 500;
}

.noselect {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.tableEdit tr td {
	color: gray !important;
	font-size: 0.9rem !important;
	padding: 0.2rem !important;
}

.editInput {
	font-size: 1rem;
	color: #948362 !important;
	background-color: white !important;
	border: none !important;
	padding: 0.2rem 0.4rem !important;
	width: 100%;
	border-radius: 3px;
	font-weight: 300;
}

.searchInput {
	font-size: 1.5rem;
	color: #948362 !important;
	background-color: white !important;
	border: none !important;
	padding: 0.4rem 0.8rem !important;
	width: 100%;
	border-radius: 3px;
	font-weight: 300;
}

.searchFilter {
	font-size: 1.5rem;
	color: #948362 !important;
	background-color: white !important;
	border: none !important;
	padding: 0.2rem 0.4rem !important;
	width: 100%;
	border-radius: 3px;
	font-weight: 300;
}

.searchFilter:hover {
	color: #948362 !important;
	background-color: #ece9e2 !important;
	border: none !important;
	cursor: pointer;
}

.searchInput:focus {
	box-shadow: 0 0 0 0.01rem rgba(119, 146, 60, 0) !important;
	border: none !important;
	outline: none;
}

.searchInput ::placeholder {
	color: #948362 !important;
}

.prolistInput {
	font-size: 1rem;
	color: #948362 !important;
	background-color: #f6f3ec !important;
	border: 1.5px solid #948362 !important;
	padding: 0.2rem 0.4rem !important;
	width: 2.5rem;
	border-radius: 3px;
	font-weight: 300;
	text-align: right;
}

.prolistInput:focus {
	box-shadow: 0 0 0 0.01rem rgba(119, 146, 60, 0) !important;
	border: 1.5px solid #948362 !important;
	outline: none;
}

.prolistInput ::placeholder {
	color: #948362 !important;
}

.pricelistSlct {
	font-size: 1rem;
	color: #948362 !important;
	background-color: #f6f3ec !important;
	border: 1.5px solid #948362 !important;
	padding: 0.2rem 0.4rem !important;

	border-radius: 3px;
	font-weight: 300;
	text-align: right;
}

.pricelistSlct:focus {
	box-shadow: 0 0 0 0.01rem rgba(119, 146, 60, 0) !important;
	border: 1.5px solid #948362 !important;
	outline: none;
}

.pricelistSlct ::placeholder {
	color: #948362 !important;
}

.pricelistInput {
	font-size: 1rem;
	color: #948362 !important;
	background-color: #f6f3ec !important;
	border: 1.5px solid #948362 !important;
	padding: 0.2rem 0.4rem !important;
	width: 4rem;
	border-radius: 3px;
	font-weight: 300;
	text-align: right;
}

.pricelistInput:focus {
	box-shadow: 0 0 0 0.01rem rgba(119, 146, 60, 0) !important;
	border: 1.5px solid #948362 !important;
	outline: none;
}

.pricelistInput ::placeholder {
	color: #948362 !important;
}

.catSelect {
	font-size: 1.5rem;
	color: #948362 !important;
	background-color: white !important;
	border: none !important;
	padding: 0.4rem 0.8rem !important;
	width: 100%;
	border-radius: 3px;
	font-weight: 300;
}

.catSelect optgroup {
	font-weight: 300;
	text-decoration: underline;
}

.catSelect option {
	font-weight: 200;
}

.catSelect:focus {
	box-shadow: 0 0 0 0.01rem rgba(119, 146, 60, 0) !important;
	border: none !important;
	outline: none;
}

.catSelect ::placeholder {
	color: #948362 !important;
}

select:focus {
	border-color: rgba(119, 146, 60, 0.5) !important;
	box-shadow: 0 0 0 0.05rem rgba(190, 204, 159, 0.25) !important;
}

.form-control::-webkit-input-placeholder {
	color: #c1c7cc !important;
	opacity: 1 !important;
	;
}

.form-control::-moz-placeholder {
	color: #c1c7cc !important;
	;
	opacity: 1 !important;
	;
}

.form-control:-ms-input-placeholder {
	color: #c1c7cc !important;
	;
	opacity: 1 !important;
	;
}

.form-control::-ms-input-placeholder {
	color: #c1c7cc !important;
	;
	opacity: 1 !important;
	;
}

.form-control::placeholder {
	color: #c1c7cc !important;
	;
	opacity: 1 !important;
	;
}

.o-1 {
	opacity: 0.1;
}

.o-2 {
	opacity: 0.2;
}

.o-3 {
	opacity: 0.3;
}

.o-4 {
	opacity: 0.4;
}

.o-5 {
	opacity: 0.5;
}

.o-6 {
	opacity: 0.6;
}

.o-7 {
	opacity: 0.7;
}

.o-8 {
	opacity: 0.8;
}

.o-9 {
	opacity: 0.9;
}

.yanayasla-0 {
	padding-right: 0px;
	padding-left: 0px;
}

.yanayasla-1 {
	padding-right: 5px;
	padding-left: 5px;
}

.yanayasla-2 {
	padding-right: 10px;
	padding-left: 10px;
}

.yanayasla-3 {
	padding-right: 15px;
	padding-left: 15px;
}

button:focus {
	outline: none;
	outline: none -webkit-focus-ring-color;
}

.table-sm th, .table-sm td {
	padding: 0px;
}

.bildirim-adet {
	position: absolute;
	margin-left: 8px;
	margin-top: -8px;
	font-size: 70%;
}

.bildirim-adet span {
	font-weight: 500;
}

#sepetEfekt {
	position: fixed;
	left: 48vw;
	top: 48vh;
}

.iletisimLogo {
	width: 100%;
}

.buttonWidth {
	width: 60%;
}

#kahveCerceve {
	position: absolute;
	left: 35%
}

.parallax-window {
	min-height: 1200px;
	background: transparent;
}

.parallax-window1 {
	min-height: 1000px;
	background: transparent;
}

.parallax {
	/* The image used */
	background-image: url("https://teapp.com.tr/img/anasayfa/pic_8.jpg");
	/* Create the parallax scrolling effect */
	background-attachment: fixed;
	background-position: left;
	background-repeat: no-repeat;
	background-size: cover;
}

.parallax1 {
	/* The image used */
	background-image: url("https://teapp.com.tr/img/anasayfa/pic_1.jpg");
	min-height: 700px;
	/* Create the parallax scrolling effect */
	background-attachment: fixed;
	background-position: left;
	background-repeat: no-repeat;
	background-size: cover;
}

.ustBanner {
	width: 100%;
	height: auto;
}

@media only screen and (min-width: 300px) {
	.row {
		width: 100% !important;
		margin-left: 0%;
		margin-right: 0%;
	}

	.sticky-top {
		width: 100% !important;
		margin-left: 0%;
		margin-right: 0%;
	}

	.fixed-bottom {
		width: 100% !important;
		margin-left: 0%;
		margin-right: 0%;
	}

	.resimTek {
		width: 50%;
	}

	.resimlerBlok {
		display: -ms-flexbox !important;
		display: flex !important;
	}

	.iyzico {
		display: block !important;
	}

	.sip-align {
		-ms-flex-direction: column !important;
		flex-direction: column !important;
	}

	.sip-ml {
		margin-left: auto;
		margin-top: 0.25rem;
		margin-bottom: 0.25rem;
	}

	.sip-ml-fiyat {
		margin-left: auto;
	}

	.sip-ml-2 {
		margin-left: auto;
	}

	.sip-mx {
		margin-left: auto;
		margin-top: 0.25rem;
		margin-bottom: 0.25rem;
	}

	.sip-resim {
		width: 75px !important;
		height: 75px !important;
	}

	.sip-resim-plus {
		width: 75px !important;
		height: 75px !important;
		padding-top: 24px;
	}

	.sip-resim-detay {
		width: 75px !important;
		height: 75px !important;
	}

	.padding-x-20 {
		padding-left: 5%;
		padding-right: 5%;
	}

	.padding-x-25 {
		padding-left: 5%;
		padding-right: 5%;
	}

	.padding-x-33 {
		padding-left: 5%;
		padding-right: 5%;
	}

	.padding-x-35 {
		padding-left: 0%;
		padding-right: 0%;
	}

	.padding-x-58 {
		padding-left: 5%;
		padding-right: 5%;
	}

	.padding-x-75 {
		padding-left: 5%;
		padding-right: 5%;
	}

	.ustBanner {
		width: 100%;
		object-fit: cover;
		object-position: left;
		height: 150px;
	}
}

@media only screen and (min-width: 768) {
	.row {
		width: 100% !important;
		margin-left: 0%;
		margin-right: 0%;
	}

	.sticky-top {
		width: 100% !important;
		margin-left: 0%;
		margin-right: 0%;
	}

	.fixed-bottom {
		width: 100% !important;
		margin-left: 0%;
		margin-right: 0%;
	}

	.resimTek {
		width: 50%;
	}

	.resimlerBlok {
		display: -ms-flexbox !important;
		display: flex !important;
	}

	.iyzico {
		display: block !important;
	}

	.sip-align {
		-ms-flex-direction: column !important;
		flex-direction: column !important;
	}

	.sip-ml {
		margin-left: auto;
		margin-top: 0.25rem;
		margin-bottom: 0.25rem;
	}

	.sip-ml-fiyat {
		margin-left: auto;
	}

	.sip-ml-2 {
		margin-left: auto;
	}

	.sip-mx {
		margin-left: auto;
		margin-top: 0.25rem;
		margin-bottom: 0.25rem;
	}

	.sip-resim {
		width: 75px !important;
		height: 75px !important;
	}

	.sip-resim-plus {
		width: 75px !important;
		height: 75px !important;
		padding-top: 24px;
	}

	.padding-x-20 {
		padding-left: 5%;
		padding-right: 5%;
	}

	.padding-x-25 {
		padding-left: 5%;
		padding-right: 5%;
	}

	.padding-x-33 {
		padding-left: 5%;
		padding-right: 5%;
	}

	.padding-x-35 {
		padding-left: 0%;
		padding-right: 0%;
	}

	.padding-x-58 {
		padding-left: 5%;
		padding-right: 5%;
	}

	.padding-x-75 {
		padding-left: 5%;
		padding-right: 5%;
	}

	.ustBanner {
		width: 100%;
		object-fit: initial;
		height: auto;
	}
}

@media only screen and (min-width: 1000px) {
	.row {
		width: 100% !important;
		margin-left: 0%;
		margin-right: 0%;
	}

	.sticky-top {
		width: 100% !important;
		margin-left: 0%;
		margin-right: 0%;
	}

	.fixed-bottom {
		width: 100% !important;
		margin-left: 0%;
		margin-right: 0%;
	}

	.resimTek {
		width: 100%;
	}

	.resimlerBlok {
		display: -ms-block !important;
		display: block !important;
	}

	.iyzico {
		display: -ms-flexbox !important;
		display: flex !important;
	}

	.sip-align {
		-ms-flex-direction: row !important;
		flex-direction: row !important;
		-ms-flex-pack: justify !important;
		justify-content: space-between !important;
	}

	.sip-ml {
		margin-left: 120px;
	}

	.sip-ml-fiyat {
		margin-left: auto;
	}

	.sip-ml-2 {
		margin-left: 0.5rem;
	}

	.sip-mx {
		margin-left: auto;
		margin-right: auto;
	}

	.sip-resim {
		width: 50px !important;
		height: 50px !important;
	}

	.sip-resim-plus {
		width: 50px !important;
		height: 50px !important;
		padding-top: 12px;
	}

	.padding-x-20 {
		padding-left: 10%;
		padding-right: 10%;
	}

	.padding-x-25 {
		padding-left: 12.5%;
		padding-right: 12.5%;
	}

	.padding-x-33 {
		padding-left: 16.66666%;
		padding-right: 16.66666%;
	}

	.padding-x-35 {
		padding-left: 17.5%;
		padding-right: 17.5%;
	}

	.padding-x-58 {
		padding-left: 29.16666%;
		padding-right: 29.16666%;
	}

	.padding-x-75 {
		padding-left: 37.5%;
		padding-right: 37.5%;
	}

	.ustBanner {
		width: 100%;
		object-fit: initial;
		height: auto;
	}
}

/*
@media only screen and (min-width: 1024px) {
	.row{
		width:50% !important;
		margin-left:25%;
		margin-right:25%;
	}
	.sticky-top{
		width:50% !important;
		margin-left:25%;
		margin-right:25%;
	}
	.fixed-bottom{
		width:50% !important;
		margin-left:25%;
		margin-right:25%;
	}
}

@media only screen and (min-width: 1280px) {
	.row{
		width:40% !important;
		margin-left:30%;
		margin-right:30%;
	}
	.sticky-top{
		width:40% !important;
		margin-left:30%;
		margin-right:30%;
	}
	.fixed-bottom{
		width:40% !important;
		margin-left:30%;
		margin-right:30%;
	}
}

*/

.imageSlider {
	overflow-x: scroll;
}

.imageSlides {
	-webkit-clip-path: inset(0% 100%, 0% 0%);
}

/* Hide scrollbar for Chrome, Safari and Opera */

.imageSlider::-webkit-scrollbar {
	display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */

.imageSlider {
	-ms-overflow-style: none;
	/* IE and Edge */
	scrollbar-width: none;
	/* Firefox */
}

.scrollRight {
	color: rgb(220, 220, 220);
	font-size: 3rem;
	margin: 0px 0px;
	padding-left: 0px;
	transform: scale(.5, 1);
	position: absolute;
	height: 100%;
	right: 0;
	/*background-image: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1));*/
}

.scrollLeft {
	color: rgb(220, 220, 220);
	font-size: 3rem;
	margin: 0px 0px;
	padding-right: 0px;
	transform: scale(.5, 1);
	position: absolute;
	height: 100%;
	left: 0;
	/*background-image: linear-gradient(to left, rgba(255,255,255,0), rgba(255,255,255,1));*/
}

@media only screen and (max-device-width: 1366px) {
	.parallax {
		background-attachment: scroll;
	}
}