@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins: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');

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
}
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
		img
		{
			cursor: pointer;
		}
.urunler-form
{
  width: 100%;
  display: flex;
  justify-content: center;
  border-bottom: 1px solid;
  border-color: hsla(0, 0%, 100%, .3);
  flex-direction:column;
  height:max-content;
}
.urunler-form-inputs
{
  width:100%;
}
.form-header {
    width: 100%;
    height: max-content;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.input-group {
  font-size: 1.25rem;
  position: relative;
  --primary: #2196f3;
  margin:35px 0;
}
.form
{
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
	border-bottom: 1px solid;
    border-color: hsla(0, 0%, 100%, .3);
}
.form-inputs
{
  width:50%;
}
.input-group {
  font-size: 1.25rem;
  position: relative;
  --primary: #2196f3;
  margin:35px 0;
}

.input {
  all: unset;
  color: #fff;
  padding: 1rem;
  border: 1px solid #9e9e9e;
  border-radius: 10px;
  transition: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  width:90%;
	background: -webkit-linear-gradient(right, rgb(5, 38, 87) 0%, rgba(0, 0, 0, 0) 100%, rgba(0, 0, 0, 0) 40%, rgb(5, 38, 87) 75%), -webkit-linear-gradient(left, rgb(5, 38, 87) 0%, rgb(77 111 151) 50%);
}

.label {
  position: absolute;
  top: 1rem;
  left: 1rem;
  color: #d4d4d4;
  pointer-events: none;
  transition: 150ms cubic-bezier(0.4, 0, 0.2, 1);
	display: flex;
    align-items: center;
    justify-content: center;
}

.input:focus {
  border: 1px solid var(--primary);
}
.textarea:focus {
  border-width:1px !important;
	border-style:solid !important;
	border-color:var(--primary) !important;
}
.input:is(:focus, :valid) ~ label,
.input-group .filled {
  /*transform: translateY(-130%) scale(0.7);*/
  background-color: transparent;
  padding-inline: 0.3rem;
  color: var(--primary);
  transform: translate(-40px, -130%) scale(0.7);
}
header{
  width: 100%;
  height: 50px;
  border-bottom: 2px solid #e5e5e5;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
header ul li{
  list-style: none;
  padding: 20px;
  margin: 10px;
  float: left;
  font-size: 14px;
  border-radius: 35px;
  /*background: red;*/

}
header ul li a{
  color: inherit;
  text-decoration: none;
}
header ul li:hover{
  background: -webkit-linear-gradient(left, #4be1ec, #cb5eee);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
header ul li.active{
  background: -webkit-linear-gradient(left, #4be1ec, #cb5eee);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
	font-size: 15px;
	color: #f27a1a;
    font-weight: 600;
    position: relative;
}
header ul li.active:after
{
    background: #f27a1a;
    bottom: 5px;
    content: "";
    height: 4px;
    left: 0;
    position: absolute;
	width: 100%;
}
header ul li.active a{
  color: white;
  font-weight: bold;
}
.mobile .search2
{
	display:none;
}
.mobile .search
{
	position: inherit;
    width: 100%;
}
.mobile .search-input
{
	width:100%;
}
.mobile .search-button
{
	margin-left:0px;
}
	.search
	{
		display:flex;
		top:15px;
		right:15px;
		position:absolute;
	}
	.search2
	{
		display:flex;
		top:-10px;
		right:15px;
		position:relative;
		align-items:center;
		justify-content:center;
	}
	.search-input, .search-input2
	{
		padding: 0 0 0 15px;
		line-height: normal;
		border: 0;
		height: 50px;
		float: none;
		font-size: medium;
		background: transparent;
		min-width: 250px;
		-webkit-box-shadow: none;
		box-shadow: none;
		display: inline-block;
		vertical-align: middle;
		border: 1px solid #E0E6EA;
		border-radius: 50px;
		
	}
	.search-button, .search-button2
	{
		background:transparent;
		border:none;
		margin-left:35px;
	}

.filter-condition{
  padding: 20px;
  height: 100px;
  font-size: 20px;
  font-weight: bold;
}
.filter-condition select{
  width: 120px;
    padding: 0 0 0 10px;
    border: none;
    outline: none;
    font-weight: bold;
    color: purple;
    background: transparent;
    cursor: pointer;
}
.send
{
    display:flex;
    position:absolute;
    margin:10px 0 ;
}
.send span {
    display: flex;
    position: absolute;
    height:110px;
    /* top: 50%; */
    /* left: 50%; */
    /* --rotate: 50deg; */
    transform: translate(-50%, -50%) rotate(var(--rotate));
    text-transform: uppercase;
    color: #000000;
    font-size: small;
    left: 35px;
    top: -15px;
}
.button {
  --default: #cacdcd;
  --active: #00fffc;
  position: relative;
  border: none;
  outline: none;
  background: none;
  padding: 0;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  cursor: pointer;
  transform: scale(var(--s, 1));
  transition: transform 0.2s;
  transform: rotate(270deg);
  margin:15px 0;
}

.button:active {
  --s: .96;
}
.button svg {
  display: block;
  fill: none;
  stroke-width: var(--sw, 3px);
  stroke-linecap: round;
  stroke-linejoin: round;
}
.button .circle {
  width: 76px;
  height: 76px;
  transform: rotate(-90deg);
}

.button .circle circle.default {
  stroke: var(--default);
}
.button .circle circle.active {
  stroke: var(--active);
  stroke-dasharray: 227px;
  stroke-dashoffset: var(--active-offset, 227px);
  transition: stroke-dashoffset var(--all-transition, 4s) ease var(--all-delay, 0.8s);
}
.button span {
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
  bottom: 13px;
  font-weight: 500;
  font-size: 10px;
  color: var(--active);
  opacity: var(--count-opacity, 0);
  transform: translateY(var(--count-y, 4px));
  -webkit-animation: var(--count, none) 0.3s ease forwards var(--all-delay, 4.6s);
          animation: var(--count, none) 0.3s ease forwards var(--all-delay, 4.6s);
  transition: opacity 0.2s ease 0.6s, transform 0.3s ease 0.6s;
}
.button .icon {
  --sw: 2px;
  width: 24px;
  height: 40px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -20px 0 0 -12px;
}


.button .icon svg.line {
  width: 4px;
  height: 37px;
  stroke: var(--active);
  position: absolute;
  left: 10px;
  top: 0;
  stroke-dasharray: 0 33px var(--line-array, 33px) 66px;
  stroke-dashoffset: var(--line-offset, 33px);
  transform: translateY(var(--line-y, 0));
  opacity: var(--line-opacity, 1);
  transition: stroke-dasharray 0.2s, stroke-dashoffset 0.2s, transform 0.32s ease var(--all-delay, 0.25s);
}
.button .icon div {
  width: 40px;
  height: 32px;
  position: absolute;
  overflow: hidden;
  left: 50%;
  bottom: 1px;
  margin-left: -20px;
  transform: translate(var(--icon-x, 0), var(--icon-y, 0));
  transition: transform 0.3s ease var(--all-delay, 4.8s);
  -webkit-animation: var(--overflow, none) 0s linear forwards var(--all-delay, 4.8s);
          animation: var(--overflow, none) 0s linear forwards var(--all-delay, 4.8s);
}
.button .icon div:before, .button .icon div:after {
  content: "";
  position: absolute;
  z-index: 1;
  height: 2px;
  left: var(--l, 0);
  top: 15px;
  width: var(--w, 16px);
  background: var(--active);
  border-radius: 1px;
  transform-origin: var(--tx, 15px) 1px;
  transform: rotate(var(--before-rotate, 0deg));
  opacity: var(--tick-opacity, 0);
  transition: transform 0.4s ease var(--all-delay, 4.8s), opacity 0s linear var(--all-delay, 4.8s);
}
.button .icon div:after {
  --l: 14px;
  --w: 26px;
  --tx: 1px;
  transform: rotate(var(--after-rotate, 0deg));
}
.button .icon div svg {
  stroke: var(--active);
}
.button .icon div svg.arrow {
  width: 40px;
  height: 32px;
  opacity: var(--arrow-opacity, 1);
  transition: opacity 0s linear var(--all-delay, 1s);
}

.arrow 
{
	color:white;
}
.button .icon div svg.progress {
  width: 444px;
  height: 10px;
  position: absolute;
  left: 0;
  top: 11px;
  transform: translateX(var(--progress-x, 0));
  opacity: var(--progress-opacity, 0);
  transition: transform var(--all-transition, 4.4s) ease var(--all-delay, 0.4s), opacity 0s linear var(--all-delay, 1s);
  -webkit-animation: var(--hide, none) 0s linear forwards var(--all-delay, 4.8s);
          animation: var(--hide, none) 0s linear forwards var(--all-delay, 4.8s);
}
.button.loading:not(.reset) {
  --line-y: -36px;
  --line-array: 0;
  --line-offset: 15px;
  --active-offset: 0;
  --arrow-opacity: 0;
  --progress-opacity: 1;
  --progress-x: -400px;
  --tick-opacity: 1;
  --before-rotate: 47deg;
  --after-rotate: -46deg;
  --hide: hide;
  --overflow: overflow;
  --icon-x: 2px;
  --icon-y: 7px;
  --count-opacity: 1;
  --count-y: 0;
  --count: count;
  transform: rotate(0deg);
}
.button.reset {
  --all-delay: 0s;
  --all-transition: .3s;
}

@-webkit-keyframes hide {
  to {
    opacity: 0;
  }
}

@keyframes hide {
  to {
    opacity: 0;
  }
}
@-webkit-keyframes count {
  to {
    transform: translateY(4px);
    opacity: 0;
  }
}
@keyframes count {
  to {
    transform: translateY(4px);
    opacity: 0;
  }
}
@-webkit-keyframes overflow {
  to {
    overflow: visible;
  }
}
@keyframes overflow {
  to {
    overflow: visible;
  }
}
@keyframes stuckMoveDown {
    0% {
        transform: translateY(-100%)
    }

    to {
        transform: translateY(0)
    }
}
.stuck {
    animation: stuckMoveDown .6s;
}
.stuck2 {
    animation: stuckMoveDown .6s;
}
.stuck {
    left: 0;
    margin: 0 auto;
    position: fixed;
    right: 0;
    top: 0;
}
.stuck2 {
    left: 0;
    margin: 0 auto;
    position: fixed;
    right: 0;
    top: 92px;
	height:max-content;
	z-index:1001;
	background: -webkit-linear-gradient(bottom, rgb(5, 38, 87) 0%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 0%, rgb(5, 38, 87) 50%), -webkit-linear-gradient(bottom, rgb(5, 38, 87) 0%, rgb(77 111 151) 0%);
    color: white;
}
.notification {
    width: 80%;
    height: max-content;
    background-color: var(--primary);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 35px;
    text-align: justify;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
  }

ul.indicator, .mobile ul.indicator
  {
    list-style: none;
    padding: 0;
    margin: 0;
    white-space: nowrap;
    overflow-x: auto;
    display: flex;
  }
        .card-container 
        {
            position: fixed;
            bottom: 0;
            display: none;
            z-index: 1;
            width: 100%;
        }
        .card {
            border: 1px solid #ccc;
            padding: 20px;
            background-color: #fff;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            width: 100%;
            text-align: center;
            color: #333; /* Kart içindeki metnin rengi */
            position: relative;
        }
        .close-button, .select-button {
            position: absolute;
            top: 10px;
            cursor: pointer;
        }
        .close-button {
            left: 10px;
        }
        .select-button {
            right: 10px;
        }
        .map-options {
            margin-top: 20px;
            display: flex;
            flex-direction: column;
            align-items: center;
            overflow: hidden; /* Taşmayan kısmın gizlenmesi */
            height: 150px; /* Seçeneklerin görünen alan yüksekliği */
            touch-action: pan-y; /* Dokunmatik kaydırmayı yalnızca y ekseninde etkinleştir */
            position: relative;
        }
        .map-options-inner {
            display: flex;
            flex-direction: column;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            transition: top 0.3s ease; /* Animasyonlu geçiş için */
        }
        .map-option {
            padding: 10px;
            margin: 5px;
            
            cursor: pointer;
            width: 100%;
            box-sizing: border-box;
        }
        .map-option.selected {
            background-color: rgba(244, 244, 244, 1);
        }

.map-option.selected .selection-indicator {
    top: 0; /* Seçenek seçildiğinde indicator'ı en üste getir */
    transition: top 0.3s ease;
}



:root {
    --primary: #933ded;
    --dark: #232323;
    --pure: #fff;
    --smoke: whitesmoke;
    --dark-gray: #999;
	--transparent:transparent;
	--black:black;
	--white:white;
	--rgbablack05:rgba(0,0,0,0.5);
	--rgbawhite07:rgba(255,255,255,0.7);
	--cyan:#45f3ff;
	--e-global-color-accent: #0074B6;
    --e-global-color-6f26552: #00C676;
}


body {
    font-family: "Poppins", sans-serif;
    /*background: var(--black);*/
	background:#fff;
	/*background:url("https://www.armeelektronik.com/s/img/armesan-background.gif");*/
   /* color: var(--white);*/
	color:black;
}

.container {
    width: 100%;
    
    margin: 0 auto;
}

nav {
  position: relative;
  /*background: var(--rgbablack05);*/
	background:hsla(0, 0%, 100%, .9);
  z-index: 9999;
  width: 100%;
	height:92px;
}
lord-icon
{
    margin-right: 5px;
}
.nav-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 92px;
    font-size: 15px;
    /* background: var(--rgbablack05); */
    /* background: black; */
    transition: background-color .3s, opacity .3s;
    border-bottom: 1px solid #9b9b41ee;
	background: -webkit-linear-gradient(top, rgb(5, 38, 87) 0%, rgba(0, 0, 0, 0) 100%, rgba(0, 0, 0, 0) 40%, rgb(5, 38, 87) 75%), -webkit-linear-gradient(top, rgb(5, 38, 87) 0%, rgb(77 111 151) 100%);
}
.mobile .nav-wrapper ul.dropdown-list li 
{
    margin-left: 0px !important;
	padding:5px !important;
}
.brand {
    display: flex;
    align-items: center;
}

.brand svg {
    height: 30px;
    margin-right: 10px;
}

.brand svg path {
    fill: var(--pure);
}
.brand img
{
    width: 300px;
    height: 100px;
    margin-top: 5px;
    object-fit: cover;
}

.mobil-talep
{
	display:none;
}
.talep-container
{
	display:flex;
	width:100%;
	justify-content:center;
	align-items:center;
}
.talep {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 85%;
    height: 250px;
    margin-top: 15px;
    background: midnightblue;
    flex-direction: row;
	background: url(https://armeelektronik.com/img/armesanelektroniktamir.jpg);
    background-repeat: no-repeat;
    background-position: center 70%;
    background-size: cover;
	position: relative; 
}

.talep::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4); /* Koyu bir şeffaf zemin ekler */
    z-index: 1;
}
.talep a
{
	text-decoration:none;
	color:white;
	font-size:17px;
	display:flex;
	justify-content:center;
	align-items:center;
	text-align:center;
	
	
}
.talep-left 
{
	width:50%;
	display:flex;
	justify-content:center;
	text-align:center;
	align-items:center;
	
	
}
.mobile .talep 
{
	flex-direction:column;
	width:95% !important;
	height:150px;
}
.mobile .talep-left
{
	width:100%;
	height:50%;
	
}
.mobile .talep-left a
{
	font-size: larger;
    font-weight: 300;
    text-transform: none;
    text-decoration: none;
    line-height: 1.5em;
    letter-spacing: 0.5px;
    padding: 10px 10px 10px 10px;
    height: 100%;
    width: 100%;
}
.mobile .talep-right
{
	width: 100%;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
	height:35%;
	flex-direction:row;
}

.talep-left a
{
	font-size:25px;
	font-weight:600;
	text-transform: none;
    text-decoration: none;
    line-height: 1.5em;
    letter-spacing: 0.5px;
	padding:10px 10px 10px 10px;
	z-index: 2; /* Yazıyı öne çıkarır */
}

.talep-right
{
	width: 50%;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
	z-index: 2; /* Yazıyı öne çıkarır */
}


.destek
{
	display:flex;
	justify-content:center;
	align-items:center;
	
	width:50%;

}
.destek a
{
	display:flex;
	justify-content:center;
	align-items:center;
	
    color: #FFFFFF;
    background-color: transparent;
    background-image: linear-gradient(320deg, var(--e-global-color-6f26552) 0%, var(--e-global-color-accent) 50%);
    border-style: solid;
    border-width: 0px 0px 0px 0px;
    border-radius: 0px 0px 0px 0px;
    padding: 15px 30px 15px 30px;
	z-index: 2; /* Butonları öne çıkarır */
    transition: background-color 0.3s ease-in-out;
}

.mobile .destek a
{
	padding: 10px 15px 10px 15px !important; 
}


.iletisime-gec
{
	display:flex;
	justify-content:center;
	align-items:center;
	margin-left:15px;
	
}
/*.mobile .talep
{
	display:none;
}
.mobile .mobil-talep
{
	display:flex;
	justify-content:center;
	align-items:center;
	text-align:center;
	width:100%;
	height:100px;
	margin-top:15px;
	background:midnightblue;
	
}
.mobile .mobil-talep a
{
	text-decoration:none;
	color:white;
	font-size:17px;
	display:flex;
	justify-content:center;
	align-items:center;
	text-align:center;
	
	
}
*/
.nav-wrapper ul.nav-list {
    list-style-type: none;
    display: flex;
    align-items: center;
	margin-right: 10px;
}
.nav-wrapper ul.nav-list li {
    margin-left: 15px;
    padding: 20px 0;
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.nav-wrapper ul.nav-list li a {
    color: white;
    text-decoration: none;
    letter-spacing: 1px;
    transition: all .5s ease-in-out;
}

.nav-wrapper ul.nav-list li a:hover, .nav-wrapper ul.nav-list li.active a {

background: -webkit-linear-gradient(left, #4be1ec, #cb5eee);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
	
/*background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, #4be1ec 50%, #cb5eee 100%);
background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%, #4be1ec 50%, #cb5eee 100%);
background: linear-gradient(to right, rgba(0,0,0,0) 0%, #4be1ec 50%, #cb5eee 100%);*/



}
.nav-wrapper ul.nav-list li.notactive a {
background:var(--dark);
color:var(--white);


}
.btnpdf {
    background: var(--primary);
    color: var(--pure);
    outline: none;
    padding: 8px 20px;
    font-size: 14px;
    cursor: pointer;
    letter-spacing: 1px;
    border: 1px solid transparent;
    transition: all .5s ease-in-out;
}

.btnpdf:hover {
    background: transparent;
    border-color: var(--pure);
}
.btn {
    background: var(--primary);
    color: var(--pure);
    outline: none;
    padding: 8px 20px;
    font-size: 14px;
    cursor: pointer;
    letter-spacing: 1px;
    border: 1px solid transparent;
    transition: all .5s ease-in-out;
}

.btn:hover {
    background: transparent;
    border-color: var(--pure);
}
main section.header {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-top: 160px;
}

main section.header h1 {
    font-size: 36px;
    font-weight: 100;
    text-transform: capitalize;
    margin-bottom: 20px;
}

main section.header h4 {
    font-size: 18px;
    font-weight: 400;
    color: var(--dark-gray);
    margin-bottom: 20px;
}
nav ul.dropdown-list {
    list-style-type: none;
    display: flex;
    background: var(--dark);
    padding: 6px 16px;
    position: absolute;
    width: max-content;
    z-index: 9999;
    left: 80%;
    transform: translateX(-50%);
    opacity: 0;
    pointer-events: none;
    flex-direction: column;
    top:30px;
	
}

.nav-wrapper ul.dropdown-list li {
    margin-left: 0;
    padding: 5px 0;
}

.nav-wrapper ul.dropdown-list  li a {
    color:var(--white);
} 
.nav-wrapper ul.dropdown-list li.notactive a {

background:var(--dark);
-webkit-background-clip: text;
-webkit-text-fill-color: white;
	
/*background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, #4be1ec 50%, #cb5eee 100%);
background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%, #4be1ec 50%, #cb5eee 100%);
background: linear-gradient(to right, rgba(0,0,0,0) 0%, #4be1ec 50%, #cb5eee 100%);*/



}
.nav-wrapper ul.nav-list li:hover .dropdown-list {
    opacity: 1;
    pointer-events: auto;
    animation: moveUp .5s ease-in-out forwards;
    
}
.dropdown-list li a:hover{
background-color: var(--primary);
    
}

@keyframes moveUp {
    0% {
        opacity: 0;
        transform: translateX(-50%) translateY(50px);
    }
    100% {
        opacity: 1;
        transform: translateX(-50%) translateY(20px); 
    }
}
@keyframes moveUpReverse {
    0% {
        opacity: 1;
        transform: translateX(-50%) translateY(20px);
    }
    100% {
        opacity: 0;
        transform: translateX(-50%) translateY(50px); 
    }
}

.hamburger {
    display: none;
}

.mobile .hamburger {
    display: flex;
    flex-direction: column;
    padding: 20px 0;
    cursor: pointer;margin-right: 20px;
}

.mobile .hamburger span {
    background: white;
    width: 28px;
    height: 2px;
    margin-bottom: 8px;
}

.mobile ul.nav-list {
    background: -webkit-linear-gradient(45deg, #434343, #000000);
    background: linear-gradient(45deg, #434343, #000000);
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    /*padding-top: 60%;*/
    opacity: 0;
    pointer-events: none;
    transition: all .3s ease-in-out;
    align-items: flex-start;
    justify-content: center;
}

.hamburger, .brand {
    z-index: 9999;
}

.mobile ul.nav-list.open {
    opacity: 1;
    pointer-events: auto;  
    z-index: 1;
}

.mobile .hamburger span {
    transform-origin: left;
    transition: all .3s ease-in-out;
}

.mobile ul.nav-list li a {
    font-size: 20px;
	color:hsla(0, 0%, 80%, 1) !important;
}

.mobile ul.dropdown-list {
    /*position: relative;
    background: transparent;
    text-align: center;
    height: 0;
    overflow-y: hidden;
    transition: opacity 1s ease-in-out;
    padding-top: 0;*/
}

.mobile .nav-wrapper ul li:hover .dropdown-list {

    /*height: max-content;
    padding-top: 6px;
    display: flex;
    position: fixed;
    top: 220px;
    left: 300px;*/
}


.mobile ul.nav-list li {
    margin-left: 45px;
    text-align: center;
    padding: 15px 0;
}

.mobile .nav-wrapper ul.dropdown-list li a {
    color: var(--dark-gray);
}
.maps {
    display: flex;
    justify-content: space-evenly;
    width: 100%;
    flex-direction: row;
    height : 75px;
    margin: 0 auto;
    align-items: center;
    margin-top: 15px;
	color:#bfbfbf;
}
.armesanelektronik, .hizmetbaslik, .ürünlerimiz {
    display: flex;
    justify-content: center;
    height: 100px;
    align-items: center;
    text-align: center;
    margin-top:50px;
}
.icon, .footer-col-baslik
{
    display: flex;
    align-items: center;
    justify-content: center;
}
.googlemaps {
    height: 550px;
    overflow: hidden;
    width: 100%;
    display:flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}
i.fa-brands.fa-apple.fa-2xl {
    font-size: 3em;
}
i.fa-brands.fa-android.fa-2xl {
    font-size: 3em;
}
.ios, .android {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    height: 100px;
	cursor:pointer;
}
.logo {
    width: 100%;
    align-items: center;
    display: flex;
    justify-content: center;
    height: 200px;
}

.sosyalmedya {
    /* background-color: red; */
    display: inline-flex;
    position: fixed;
    bottom: 0;
    right: 15px;
    width: 200px;
    height: 130px;
    flex-direction: column;
    justify-content: space-around;
    align-items: end;
    z-index: 9999999;
    margin-bottom: 30px;
    gap: 1em;
}

.fa-whatsapp:before {
    content: "\f232";
    font-size: 0.9em;
}
.facebook, .instagram, .whatsapp, .telegram, .phone
{
    padding: 20px 20px 20px 20px;
    border: 1px solid black;
    border-radius: 15px;
    background: rgba(0,255,100,0.5);
    color: white;
}
.mobile .sosyalmedya {
    margin-right: -5px;
    
}
.swiper
{
    width: 100%;
    height:500px;
    background-color: #000000;
}


.banner{
    height: 100vh;
    position: relative;
    overflow: hidden;
}
.banner .bg{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
   /* background-size: auto 100%;*/
    background-position: center bottom;
    transition: 0.1s;
}
.banner .bg-1{ 
    background-image: url(img/bggif.png);
    background-repeat: no-repeat;
    background-size: cover;
}
.mobile .bg-1
{
	    background-image: url(img/bggif.png);
    background-repeat: no-repeat;
    background-size: cover;
	background-position: center;
}
.mobile .banner {
    /* height: 100vh; */
    position: relative;
    overflow: hidden;
    height: 300px;
    width: 100%;
}
/*.banner  h1.top{
    position: absolute;
    top: 25%;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 7rem;
    font-weight: 100;
    font-style: normal;
    font-family: 'Dancing Script', cursive;
    color :moccasin;
    filter: drop-shadow(0px 0px 9px rgba(0,252,255,255));
}
.banner  h2.center{
    position: absolute;
    top: 40%;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 7rem;
    font-family: 'Dancing Script', cursive;
    font-weight: bolder;
    color: #c19f61;
    color :moccasin;
    filter: drop-shadow(0px 0px 9px rgba(0,252,255,255));
}
.banner  h2.bottom{
    position: absolute;
    top: 55%;
    left: 0;
    width: 100%;
    text-align: center;
    font-weight: 300;
    font-size: 7rem;
    font-family: 'Dancing Script', cursive;
    color :moccasin;
    filter: drop-shadow(0px 0px 9px rgba(0,252,255,255));
}
.mobile  h1.top{
    position: absolute;
    top: 20%;
    left: 0;
    width: 100%;
    text-align: center;

    font-weight: 100;
    font-style: normal;
    font-family: 'Dancing Script', cursive;
    color :moccasin;
    filter: drop-shadow(0px 0px 9px rgba(0,252,255,255));
}
.mobile  h2.center{
    position: absolute;
    top: 30%;
    left: 0;
    width: 100%;
    text-align: center;

    font-family: 'Dancing Script', cursive;
    font-weight: bolder;
   color: #c19f61;
    color :moccasin;
    filter: drop-shadow(0px 0px 9px rgba(0,252,255,255));
}
.mobile  h2.bottom{
    position: absolute;
    top: 40%;
    left: 0;
    width: 100%;
    text-align: center;
    font-weight: 300;

    font-family: 'Dancing Script', cursive;
    color :moccasin;
    filter: drop-shadow(0px 0px 9px rgba(0,252,255,255));
}*/
.intro{
    min-height: 50vh;
    color: #eee;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.intro img{
    width: 130px;
    height: 130px;
    border-radius: 50%;
}
.intro p{
    width: 700px;
    max-width: 100%;
    text-align: center;
}
.intro button{
    background-color: #FD0003;
    padding: 10px 50px;
    border: 1px solid #591F1D;
    border-radius: 5px;
    color: #fff;
    font-family: Poppins;
    font-weight: 500;
}
.animation-show2{
    transform: translateY(50px);
    opacity: 0;
    transition: 0.7s;
	display:flex;
	justify-content:center;
    
}
.animation-show{
    transform: translateY(50px);
    opacity: 0;
    transition: 0.7s;
    
}
.animation-show p 
{
	font-size:larger;
	margin-top:8px;
	color:black;
}
.mobile .animation-show p 
{
	font-size:medium;
}
.tab.library.active .animation-show {
    /*filter: drop-shadow(1px 1px 20px rgba(255,255,255,1));*/
	filter:drop-shadow(1px 1px 5px rgba(0, 0, 0, .5));
}
.active .animation-show{
    transform: translateY(0);
    opacity: 1;
	width:100%;
}
.active .animation-show2{
    transform: translateY(0);
    opacity: 1;
}
.animation-show:nth-child(2){
    transition-delay: 0.3s;
}
.animation-show:nth-child(3){
    transition-delay: 0.6s;
}
.animation-show:nth-child(4){
    transition-delay: 0.9s;
}
.library{
    
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    text-align: center;
    color: #fff;
    margin-bottom:25px;
}
.hizmetlerimiz {
   
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    text-align: center;
    color: #fff;
    margin-bottom: 25px;
    height: 300px;
    gap: 15px;
    justify-items: center;
	margin-left:10px;
		margin-right:10px;
}
.library img{
    width: 80%;
    height: 500px;
    object-fit: cover;
    border-radius: 30px;
    margin-top: 25px;
}
.is-divider {
    background-color: rgba(0,0,0,.1);
    display: block;
    height: 3px;
    margin: 1em 0;
    
    width: 100%;
    background-color: hsla(0,0%,100%,.3);
    
    margin: 0.66em auto;
}
.haritada-goster
{
	color:cyan;
	text-decoration:none;
	display:flex;
}

.footer {
    /*position: absolute;
    top: 50%;
    left: 50%;*/
   /* transform: translate(-50%, -50%);
    max-width: 1280px;*/
    width: 100%;
    /*background: #10182F;*/
	background:midnightblue;
    border-radius: 6px;

  }

  .footer .footer-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 3.5rem;
    padding: 60px;
  }
.mobile .footer .footer-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 3.5rem;
    padding: 40px;
  }
  .footer-col
  {
    min-width: 300px;
  }
  .footer-row .footer-col h4 {
    color: #fff;
    font-size: 1.2rem;
    font-weight: 400;
  }
  
  .footer-col .links {
    margin-top: 20px;
  }
  
  .footer-col .links li {
    list-style: none;
    margin-bottom: 10px;
  }
  
  .footer-col .links li a {
    text-decoration: none;
    color: #bfbfbf;
  }
  
  .footer-col .links li a:hover {
    color: #fff;
  }
  
  .footer-col p {
    margin: 20px 0;
    color: #bfbfbf;
    max-width: 300px;
    text-align: center;
  }
  .linkler, .adress {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}
  .footer-col form {
    display: flex;
    gap: 5px;
  }
  
  .footer-col input {
    height: 40px;
    border-radius: 6px;
    background: none;
    width: 100%;
    outline: none;
    border: 1px solid #7489C6 ;
    caret-color: #fff;
    color: #fff;
    padding-left: 10px;
  }
  
  .footer-col input::placeholder {
    color: #ccc;
  }
  
   .footer-col form button {
    background: #fff;
    outline: none;
    border: none;
    padding: 10px 15px;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 500;
    transition: 0.2s ease;
  }
  
  .footer-col form button:hover {
    background: #cecccc;
  }
  
  .footer-col .icons {
    display: flex;
    margin-top: 30px;
    gap: 50px;
    cursor: pointer;
    justify-content: center;
    align-items: center;
  }
  
  .footer-col .icons i {
    color: #afb6c7;
  }
  
  .footer-col .icons i:hover  {
    color: #fff;
  }
.mobile .icons {
    display: grid;
    grid-template-columns: repeat(3, .1fr);
}
  .poweredby {
    display: flex;
    height: 70px;
    justify-content: center;
    text-align: center;
    align-items: center;
    background-color: #151515;
    /* position: fixed; */
    width: 100%;
    z-index: 9999;
    top: 0;
	flex-direction:column;
}
a.link.external {
    color: #09C36A;
    text-decoration: none;
}
li.header-divider {
    border-left: 1px solid rgba(0,0,0,.1);
    height: 30px;
    margin: 0 auto;
    position: relative;
    vertical-align: middle;
    background-color: #fff;
}
.mobile ul.nav-list li.header-divider {
    display: none;
}
.hizmetler {
   /* background: repeating-linear-gradient(240deg, rgba(0,128,128,.2), transparent 100px);*/
	background:whitesmoke;
	border:1px solid #cecece;
    justify-content: center;
    display: flex;
    align-items: center;
    flex-direction: column;
    text-align: center;
    width: 100%;
    height: 100%;
    /* padding: 30px 30px; */
    margin: 0 auto;
    border-radius:30px;
}
.mobile .hizmetler lord-icon {
    width: 75px !important;
    height: 75px !important;
}
.quantity-control {
    display: flex;
    align-items: center;
    margin: 20px 0;
	border:1px solid #cecece;
	border-radius:36px;
}

.quantity-control button {
    background-color: transparent;
    color: #09c36a;
    border: none;
    padding: 0;
    width: 40px;
    height: 40px;
    font-size: 18px;
    transition: background-color 0.3s;
    border-radius: 0;
}
.description {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    text-align: justify;
    flex-direction: column;
    color: slategray;
    text-indent: 25px;
    font-style: italic;
	font-size:medium;
}
.mobile .description
{
	font-size:10px;
	padding:10px;
	overflow:scroll;
	justify-content:flex-start;
	
}
/*.mobile .description p:nth-child(2)
{
	display:none;
}
.mobile .description p:nth-child(3)
{
	display:none;
}*/
.quantity-control input {
    width: 60px;
    height: 40px;
    text-align: center;
    margin: 0;  
    padding: 0 5px;
    border: none;
    background-color: transparent;
    font-size: 18px;
    outline: none;
}
.main
{
	display:grid;
	grid-template-columns: repeat(2, 1fr);
	width:100%;
	height:max-content;
	justify-items: center
}
.mobile .main {
	grid-template-columns: repeat(1, 1fr) !important;
}
.mobile .urunler {
    display: flex;
    width: 100%;
    height: 100%;
     padding: 10px; 
    gap: 1.5rem;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	margin-top:15px;
   
  }
.urunler {
    display: flex;
    width: 100%;
    height: 100%;
    padding: 30px;
    gap: 1.5rem;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    justify-items: center;
}
  .mobile .urunler-card
{
    width: 100%;
    display: flex;
    background: white;
    box-shadow: 0 0 8px #000;
    border-radius: 20px;
	transition: 0.5s all;
	height:max-content;
	
	
  }
   .urunler-card
{
    width: 100%;
    display: flex;
    background: white;
    box-shadow: 0 0 8px #000;
    border-radius: 20px;
	transition: 0.5s all;
	height:max-content;
	flex-direction:column;
  }
  .urunler-card .left-column {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
	 
  }
.mobile .left-column
{
	height:50%;
}
.pdf {
    display: flex;
    text-wrap: nowrap;
    position: relative;
	justify-content:center;
	align-items:center;
	text-align:center;
}
  .urunler-card .left-column .share ,
  .urunler-card .left-column .heart {
    position: absolute;
    top: 8px;
    font-size: 1.5rem;
    cursor: pointer;
    color: #FFF;
    text-shadow: 0 0 2px #000;
    transition: 0.3s ease;
  }
  .urunler-card .left-column .share {
    left: 10px;
  }
  .urunler-card .left-column .heart {
    right: 10px;
	transition: background-color 0.3s ease; /* Geçiş efekti */
  }
.heart.clicked {
    color: #C50000; /* Tıklanıldığında arka plan kırmızı olacak */
}
  .urunler-card .left-column .share:hover {
    color: rgb(145,145,145);
  }
  .urunler-card .left-column .heart:hover {
    color: #C50000;
  }
  .urunler-card .left-column img {
    width: 100%;
    transition: 0.3s ease;
    border-radius:20px;
	  height:100%;
  }
  .urunler-card .right-column {
    width: 100%;
    position: relative;
    overflow: hidden;
    padding: 2rem 1rem;
    display: flex;
    flex-direction: column;
    color: var(--dark);
    justify-content: space-between;
	
  }

.mobile .urunler-card .right-column
{
	padding:3px;
	height:50%;
}
  .urunler-card .right-column .logo {
    width: 50px;
    position: absolute;
    top: 10px;
    right: 10px;
  }
  .urunler-card .right-column .product-name {
    text-transform: uppercase;
    font-weight: bold;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;

  }
  .urunler-card .right-column .product-name h1 {
    font-size: 2vw;
	  text-align:center;
  }
.mobile .urunler-card .right-column .product-name h1, .urunler-card .right-column .product-name p
{
	font-size:larger !important;
}
  .urunler-card .right-column .product-name p {
    font-style: italic;
  }
  .urunler-card .right-column .price {
    font-size: 2rem;
    font-weight: bold;
    align-items: center;
    display: flex;
    justify-content: center;
  }
  .urunler-card .right-column .colors {
    display: flex;
  }
  .urunler-card .right-column .colors span:not(:last-child) {
    width: 20px;
    height: 20px;
    display: inline-block;
    border-radius: 50%;
    cursor: pointer;
    border: solid 2px #cacaca;
    transition: 0.3s ease;
    margin: 10px 5px;
  }
  .urunler-card .right-column .colors .darkblue {
    background: rgb(5,38,87);
  }
  .urunler-card .right-column .colors .darkblue:hover {
    border: solid 2px rgb(5,38,87);
  }
  .urunler-card .right-column .colors .green {
    background: rgb(0,214,132);
  }
  .urunler-card .right-column .colors .green:hover {
    border: solid 2px rgb(0,214,132);
  }
  .urunler-card .right-column .colors .purple {
    background: purple;
  }
  .urunler-card .right-column .colors .purple:hover {
    border: solid 2px purple;
  }
  .urunler-card .right-column .colors .black {
    background: #000;
  }
  .urunler-card .right-column .colors .black:hover {
    border: solid 2px #000;
  }
  .urunler-card .right-column .colors .quantity {
    font-size: 1.3rem;
    font-weight: bold;
    align-self: center;
    margin-left: 100px;
  }
  .urunler-card .right-column .colors .quantity input {
    border: none;
    outline: none;
    font-size: 1.3rem;
    font-weight: bold;
  }
  .urunler-card .right-column .btn {
    
    cursor: pointer;
    background: linear-gradient(to right , #1bbeb4,#49af84);
    color: #fff;
    border: none;
    outline: none;

    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
  }
  .urunler-card .right-column .btn:hover {
    box-shadow: 0 0 6px #000;
  }
  .urunler-card .right-column .btnpdf {
    
    cursor: pointer;
    background: linear-gradient(to right , #1bbeb4,#49af84);
    color: #fff;
    border: none;
    outline: none;

    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
	  text-decoration:none;
  }
  .urunler-card .right-column .btnpdf:hover {
    box-shadow: 0 0 6px #000;
  }
.mobile .cards {
    display: flex;
    width: 100%;
    height: 100%;
     padding: 10px; 
    gap: 1.5rem;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	margin-top:15px;
   
  }
.cards {
    display: flex;
    width: 100%;
    height: 100%;
    padding: 30px;
    gap: 1.5rem;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    justify-items: center;
}
  .mobile .product-card
{
    width: 50%;
    display: flex;
    background: white;
    box-shadow: 0 0 8px #000;
    border-radius: 20px;
	transition: 0.5s all;
	height:600px;
	
	
  }
   .product-card
{
    width: 100%;
    display: flex;
    background: white;
    box-shadow: 0 0 8px #000;
    border-radius: 20px;
	transition: 0.5s all;
	   height:600px;
  }  
  .product-card .left-column {
    width: 50%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
	 
  }
.mobile .left-column
{
	height:50%;
}
.pdf {
    display: flex;
    text-wrap: nowrap;
    position: relative;
	justify-content:center;
	align-items:center;
	text-align:center;
}
  .product-card .left-column .share ,
  .product-card .left-column .heart {
    position: absolute;
    top: 8px;
    font-size: 1.5rem;
    cursor: pointer;
    color: #FFF;
    text-shadow: 0 0 2px #000;
    transition: 0.3s ease;
  }
  .product-card .left-column .share {
    left: 10px;
  }
  .product-card .left-column .heart {
    right: 10px;
  }
  .product-card .left-column .share:hover {
    color: rgb(145,145,145);
  }
  .product-card .left-column .heart:hover {
    color: #C50000;
  }
  .product-card .left-column img {
    width: 100%;
    transition: 0.3s ease;
    border-radius:20px;
	  height:100%;
  }
  .product-card .right-column {
    width: 50%;
    position: relative;
    overflow: hidden;
    padding: 2rem 1rem;
    display: flex;
    flex-direction: column;
    color: var(--dark);
    justify-content: space-between;
	
  }

.mobile .product-card .right-column
{
	padding:3px;
	height:50%;
}
  .product-card .right-column .logo {
    width: 50px;
    position: absolute;
    top: 10px;
    right: 10px;
  }
  .product-card .right-column .product-name {
    text-transform: uppercase;
    font-weight: bold;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;

  }
  .product-card .right-column .product-name h1 {
    font-size: 2vw;
	  text-align:center;
  }
  .product-card .right-column .product-name p {
    font-style: italic;
  }
  .product-card .right-column .price {
    font-size: 2rem;
    font-weight: bold;
    align-items: center;
    display: flex;
    justify-content: center;
  }
  .product-card .right-column .colors {
    display: flex;
  }
  .product-card .right-column .colors span:not(:last-child) {
    width: 20px;
    height: 20px;
    display: inline-block;
    border-radius: 50%;
    cursor: pointer;
    border: solid 2px #cacaca;
    transition: 0.3s ease;
    margin: 10px 5px;
  }
  .product-card .right-column .colors .darkblue {
    background: rgb(5,38,87);
  }
  .product-card .right-column .colors .darkblue:hover {
    border: solid 2px rgb(5,38,87);
  }
  .product-card .right-column .colors .green {
    background: rgb(0,214,132);
  }
  .product-card .right-column .colors .green:hover {
    border: solid 2px rgb(0,214,132);
  }
  .product-card .right-column .colors .purple {
    background: purple;
  }
  .product-card .right-column .colors .purple:hover {
    border: solid 2px purple;
  }
  .product-card .right-column .colors .black {
    background: #000;
  }
  .product-card .right-column .colors .black:hover {
    border: solid 2px #000;
  }
  .product-card .right-column .colors .quantity {
    font-size: 1.3rem;
    font-weight: bold;
    align-self: center;
    margin-left: 100px;
  }
  .product-card .right-column .colors .quantity input {
    border: none;
    outline: none;
    font-size: 1.3rem;
    font-weight: bold;
  }
  .product-card .right-column .btn {
    
    cursor: pointer;
    background: linear-gradient(to right , #1bbeb4,#49af84);
    color: #fff;
    border: none;
    outline: none;

    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
  }
  .product-card .right-column .btn:hover {
    box-shadow: 0 0 6px #000;
  }
  .product-card .right-column .btnpdf {
    
    cursor: pointer;
    background: linear-gradient(to right , #1bbeb4,#49af84);
    color: #fff;
    border: none;
    outline: none;

    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
	  text-decoration:none;
  }
  .product-card .right-column .btnpdf:hover {
    box-shadow: 0 0 6px #000;
  }
.sensorlist {
	display:block !important;
	all: unset;
    color: black;
    padding: 1rem;
    border: 1px solid #9e9e9e;
    border-radius: 10px;
    transition: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    width: 90%;
    background: -webkit-linear-gradient(right, rgb(5, 38, 87) 0%, rgba(0, 0, 0, 0) 100%, rgba(0, 0, 0, 0) 40%, rgb(5, 38, 87) 75%), -webkit-linear-gradient(left, rgb(5, 38, 87) 0%, rgb(77 111 151) 50%);
}

.sensorlist-select {
  color: #d4d4d4;
  
  border-radius: 4px;
  background-color: transparent;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 1.25rem;
  cursor: pointer;
  border-radius: 10px;
}
.sensorlist-select .select {
    display: flex;
    align-items: center;
}
.sensorlist-list {
	color: black;
    border-radius: 4px;
    background-color: #fffdfa;
    position: absolute;
    top: 90%;
    left: 0;
    right: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s linear, visibility 0.2s linear;
    transform: translateY(5px);
    z-index: 9999;
    border: 1px solid #9e9e9e;
    border-radius: 10px;
    width: 92%;
}

.sensorlist-list.show {
  opacity: 1;
  visibility: visible;
}

.sensorlist-list:before {
  content: "";
  width: 100%;
  height: 10px;
  background-color: transparent;
  position: absolute;
  top: 0;
  left: 0;
  transform: translateY(-100%);
}
.table-fullscreen {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
	margin:50px 0;
	
}
.table-inner {
    width: 99%;
    display: flex;
    justify-content: center;
    padding-left: 20px;
    padding-right: 20px;
}
.table-main {
    display: flex;
    flex-direction: column;
    width: 85%;
    height: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
    border: solid transparent;
    box-sizing: content-box;
    padding: 0px 20px;
    /* display: none; */
    overflow: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    transition: padding .2s ease-in-out;
    background: #f8f8f8;
}

.table {
    width: 100%;
    margin-bottom: 20px;
    border: 1px solid #e9e9e9;
    border-collapse: collapse;
    border-spacing: 0;
}
.table-main h4 {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
    height: 50px;
}
tbody, td, tr 
{
	border: 1px solid #e9e9e9;
    line-height: 1.42857;
    padding: 5px;
    vertical-align: middle;
    text-align: center;
	font-size:14px;
	color:#777777;
}
.sensorlist-list__item {
	display: flex;
    justify-content: center;
  padding: 0.5rem;
  font-size: 1rem;
	border-bottom: 1px solid #9e9e9e;
    border-radius: 10px;
}
	.sensorlist-list__item:hover
	{
		background-color:#00b2ee;
	}
.katalog-fullscreen, .sertifikalarimiz-fullscreen
{
    width: 100%;
    height: 550px;
}

.katalog-header, .sertifikalarimiz-header 
{
    width: 100%;
    display: flex;
    height: 50px;
    justify-content: flex-start;
    align-items: center;
}

.katalog-main, .sertifikalarimiz-main 
{
    width: 100%;
    height: 150px;
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
}
.katalog-main h4, h2.katalog-title 
{
	margin-left:50px;
    margin-top: 50px;	
}
.mobile .katalog-main h4 
{
	margin-left:20px;
}
.breadcrumb {
    list-style: none;
    display: flex;
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    align-items: center;
    margin-left: 25px;
    font-size: 14px;
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}

.breadcrumb li {
    margin-right: 10px;
}

.breadcrumb li+li:before {
    content: ">";
    margin-right: 10px;
}

.breadcrumb a {
    text-decoration: none;
    color: #0275d8;
}

.breadcrumb a:hover {
     background: -webkit-linear-gradient(left, #4be1ec, #cb5eee);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.breadcrumb li:last-child
		{
    color: #555;
    pointer-events: none;
		}
.breadcrumb-fullscreen {
    width: 100%;
    height: max-content;
}
.hakkimizdabaslik, .vizyonumuzbaslik, .misyonumuzbaslik, .sertifikalarimizbaslik, .entegre-politikamizbaslik, .insan-kaynaklaribaslik, .bilgi-toplumu-hizmetleribaslik, .kataloglarbaslik, .iletisimbaslik, .arm15baslik, .arm25baslik, .arm30baslik, .kasa-banko-motorubaslik
{
	display: flex;
	justify-content: space-evenly;
	height: 175px;
	align-items: center;
	text-align: center;
	flex-direction:column;
}
.hakkimizda-header, .vizyonumuz-header, .misyonumuz-header, .sertifikalarimiz-header, .entegre-politikamiz-header, .insan-kaynaklari-header, .bilgi-toplumu-hizmetleri-header, .kataloglar-header, .iletisim-header, .arm15-header, .arm25-header, .arm30-header, .kasa-banko-motoru-header
{
	width: 100%;
    height: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
  @media (max-width: 768px) {
    .footer {
      position: relative;
      bottom: 0;
      left: 0;
      transform: none;
      width: 100%;
      border-radius: 0;
    }
    .footer .footer-row {
      
      gap: 4rem;
    }
    .footer-col form {
      display: block;
    }
    .footer-col form :where(input, button) {
      width: 100%;
    }
    .footer-col form button {
      margin: 10px 0 0 0;
    }
  }
@media only screen and (min-width: 1120px)
{
.talep
	{
		top:5px;
	}
.talep p 
	{
		font-size:0.75em;
		padding:3px;
	}
	
}
@media only screen and (min-width: 1550px)
{
.talep
	{
		top:5px;
	}
.talep p 
	{
		font-size:1em;
		padding:10px;
	}	
}
@media screen and (max-width: 992px)/* TABLETE KADAR */
{
	.banner h1
	{
        font-size: 5rem;
    }
    .banner h2.center
	{
        font-size: 4.5rem;
    }
    .banner h2.bottom
	{
        font-size: 5rem;
    }
	/*.banner .bg
	{
    	background-size: auto 100%;
	}*/

}
@media screen and (max-width: 768px) /* TELEFONA KADAR */
{
    .banner h1.top{
        font-size: 2.5rem;
    }
    .banner h2.center{
        font-size: 2.1rem;
    }
    .banner h2.bottom{
        font-size: 2.5rem;
    }
    .library{
        grid-template-columns: repeat(2, 1fr);
    }
    .hizmetlerimiz
    {
        grid-template-columns: repeat(2, 1fr);
    }
    .library img{
        height: 200px;
    }
}

@media screen and (max-width: 300px){
    .banner h1{
        font-size: 2rem;
    }
    .banner h2{
        font-size: 2rem;
    }
    .banner h2.bottom{
        font-size: 2rem;
        top:50%
    }
    .library{
        grid-template-columns: repeat(2, 1fr);
    }
    .library img{
        height: 300px;
    }
}
@media screen and (max-width:1120px) 
{
    .product-card {
      width:100% !important;
      flex-direction: column;
      text-align: center;
      justify-content: center;
      align-items: center;
    }
    .product-card .left-column {
      width: 100%;
    }
    .product-card .right-column {
      width: 100%;
    }
    .product-card .right-column .product-name h1 ,
    .product-card .right-column .btn {
      font-size: 1.2rem;
    }
    .product-card .right-column .colors .quantity {
      margin-left: 50px;
    }
	    .orderproduct-card {
      width:100% !important;
      flex-direction: column !important;
      text-align: center !important;
      justify-content: center !important;
      align-items: center !important;
    }
    .orderproduct-card .left-column {
      width: 100% !important;
    }
    .orderproduct-card .right-column {
      width: 100% !important;
	position: relative !important;
    overflow: hidden !important;
    padding: 2rem 1rem !important;
    display: flex !important;
    flex-direction: column !important;
    color: var(--dark) !important;
    justify-content: space-evenly !important;
    }
    .orderproduct-card .right-column .product-name h1 ,
    .orderproduct-card .right-column .btn {
      font-size: 1.2rem !important;
    }
    .orderproduct-card .right-column .colors .quantity {
      margin-left: 50px !important;
    }
	.orderproduct-card .left-column img {
    width: 100% !important;
    transition: 0.3s ease !important;
    border-radius: 20px !important;
}
}
@media screen and (max-width:830px) {

  .form-inputs
  {
    width: 100% !important;
  }
    .product-card {
      width:100% !important;
      flex-direction: column;
      text-align: center;
      justify-content: center;
      align-items: center;
    }
    .product-card .left-column {
      width: 100%;
    }
    .product-card .right-column {
      width: 100%;
    }
    .product-card .right-column .product-name h1 ,
    .product-card .right-column .btn {
      font-size: 1.2rem;
    }
    .product-card .right-column .colors .quantity {
      margin-left: 50px;
    }
	    .orderproduct-card {
      width:100% !important;
      flex-direction: column !important;
      text-align: center !important;
      justify-content: center !important;
      align-items: center !important;
    }
    .orderproduct-card .left-column {
      width: 100% !important;
    }
    .orderproduct-card .right-column {
      width: 100% !important;
	position: relative !important;
    overflow: hidden !important;
    padding: 2rem 1rem !important;
    display: flex !important;
    flex-direction: column !important;
    color: var(--dark) !important;
    justify-content: space-evenly !important;
    }
    .orderproduct-card .right-column .product-name h1 ,
    .orderproduct-card .right-column .btn {
      font-size: 1.2rem !important;
    }
    .orderproduct-card .right-column .colors .quantity {
      margin-left: 50px !important;
    }
	.orderproduct-card .left-column img {
    width: 100% !important;
    transition: 0.3s ease !important;
    border-radius: 20px !important;
}
  }
  @media screen and (max-width:400px) {
    .product-card {
      width:100% !important;
        flex-direction: column;
        text-align: center;
        justify-content: center;
        align-items: center;
      }
    .product-card .right-column .colors .quantity {
      margin-left: 20px;
    }
  }
  
  @media screen and (max-width:320px) {
    .product-card {
      width:100% !important;
        flex-direction: column;
        text-align: center;
        justify-content: center;
        align-items: center;
      }
  }