li{

  text-transform: lowercase;

}

/* index php css starts here */


.slideryazi{

  color:white;

  font-size:20px;

}

.or-boyut{

  font-size: 11px;

  font-weight: 700;

  margin-top:10%;

}


/* slider */

.flexbox-slide:hover .imghover{

  visibility:hidden;

  z-index:0;

}

.mr-40-px{

  margin-right:40px;

}


.link {/* 

  display: flex;

  justify-content: center;

  width: 800px;

  margin: 30px auto 0;*/

}

.link a {

  transition-property: all;

  transition-duration: 0.2s;

  transition-timing-function: linear;

  transition-delay: 0s;

  display: flex;

  align-items: center;

  flex-shrink: 0;

  margin-right: 40px;

  color: inherit;

  font-size: inherit;

  text-decoration: none;

}

.link a:hover {

  color: #CA9CE1;

}

.link a:last-child {

  margin-right: 0;

}

.link a i {

  color: #CA9CE1;

  margin-right: 9px;

  font-size: 30px;

}


.slider-contaainers {

  width: 100%;

  margin-top: 60px;

}


.slider-contaainer {

  margin-bottom: 60px;

}

.slider-contaainer h2 {

  text-align: center;

}


.flexbox-slider {

  
}


.slidebrightness{

  filter: brightness(55%);

}

.ad-align{

margin-left:-2.9%;

}


.detay-resim{

  border:3px solid #00b3b2;

  padding:20px;

  background-color:white;

}


.categorysecondbg{

  background:#00b3b2;;

}

.categorythirdbg{

  background:#474747;

}


.sektordiv{

  min-width:20%;

  min-height:200px;

  color:white;

}


.profile__stats, .social {

  padding-left: 0;

  list-style: none inside;

}

.profile__stats > li, .social > li {

  display: inline-block;

  vertical-align: top;

}


.button {

  display: inline-block;

  color: #f2f2f2;

  font-weight: 700;

  text-decoration: none;

}


.button:after {

  width: 3.5em;

  height: 3.5em;

  margin-left: 1em;

  display: inline-block;

  vertical-align: middle;

  background-size: cover;

}


kbd {

  display: inline-block;

  font-family: inherit;

  font-size: 0.875em;

  vertical-align: 0.125em;

  color: slategray;

}

.navbar2{

  max-height:20px;

  font-size:10px;

  padding:0px;

}

.navbar2 li a{

  padding:0px;

  padding-right:160px;

  margin-right:200px;

  margin-left:-100px;

}

.profile__image {

  width: 50%;

  height:40%;

  float:left;

  border: 0.125em solid black;

  background-color: #000;

  display: block;

}

@media screen and (min-width: 30em) {

  .profile__image {

    display: inline-block;

    margin: 0 3em 0 2em;

  }

}


.profile__details {

  margin: 0 2em 0 0;

  text-align: left;

  float:right;

}

@media screen and (min-width: 30em) {

  .profile__details {

    display: inline-block;

    vertical-align: top;

    text-align: left;

    float:right;

  }

}


.profile__stats {

  margin: 0 0 1rem 0;

}

.profile__stats > li {

  text-align: left;

  border-right: 1px solid lightgray;

  padding: 0 0.5em;

  line-height: 1.1;

}

.profile__stats > li:first-child {

  padding-left: 0;

}

.profile__stats > li:last-child {

  border-right: none;

  padding-right: 0;

}


.profile_stat__heading {

  font-weight: 300;

  text-transform: capitalize;

  font-size: 0.875em;

  margin: 0 0 0.25em 0;

  color: slategray;

}


.profile_stat__number {

  font-size: 1.75em;

  color: slategray;

}


.profile__name {

  font-weight: 700;

  margin: 0 0 1rem 0;

}


.social {

  margin-bottom: 0;

  margin-left: 0;

}

.social > li:not(:last-child) {

  margin-right: 0.5em;

}

.social .location {

  margin-left: 1em;

}

.social .location, .social .location .fa {

  color: darkgreen;

}

.social .location span {

  font-size: 0.875em;

  display: inline-block;

  vertical-align: middle;

  margin-left: 0.25em;

}

.social a {

  display: block;

  line-height: 1.1;

}

.social .fa {

  font-size: 1.25em;

  color: slategray;

}

.social .fa-github:hover {

  color: #171515;

}

.social .fa-instagram:hover {

  color: #3f729b;

}

.social .fa-twitter:hover {

  color: #00acee;

}

.social .fa-bitbucket:hover {

  color: #205081;

}


.modal-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

}

.modal-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal-window > div {

  width: 100%;

  height:150%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal-window header {

  font-weight: bold;

}

.modal-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal-close:hover {

  color: black;

}


.modal2-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal2-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal2-window > div {

  width: 100%;

  height:250%;

  position: absolute;

  padding: 2em;

  overflow-y: scroll;

  background: #29282873;

}

.modal2-window header {

  font-weight: bold;

}

.modal2-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal2-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal2-close:hover {

  color: black;

}


.modal3-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal3-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal3-window > div {

  width: 100%;

  height:250%;

  position: absolute;

  padding: 2em;

  overflow-y: scroll;

  background: #29282873;

}

.modal3-window header {

  font-weight: bold;

}

.modal3-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal3-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal3-close:hover {

  color: black;

}


.modal4-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal4-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal4-window > div {

  width: 100%;

  height:150%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal4-window header {

  font-weight: bold;

}

.modal4-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal4-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal4-close:hover {

  color: black;

}


.modal5-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal5-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal5-window > div {

  width: 100%;

  height:250%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;     

}

.modal5-window header {

  font-weight: bold;

}

.modal5-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal5-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal5-close:hover {

  color: black;

}


.modal6-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal6-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal6-window > div {

  width: 100%;

  height:150%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal6-window header {

  font-weight: bold;

}

.modal6-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal6-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal6-close:hover {

  color: black;

}


.modal7-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

}

.modal7-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal7-window > div {

  width: 100%;

  height:150%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal7-window header {

  font-weight: bold;

}

.modal7-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal7-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal7-close:hover {

  color: black;

}


.modal8-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

}

.modal8-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal8-window > div {

  width: 100%;

  height:150%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal8-window header {

  font-weight: bold;

}

.modal8-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal8-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal8-close:hover {

  color: black;

}


.modal9-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal9-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal9-window > div {

  width: 100%;

  height:250%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal9-window header {

  font-weight: bold;

}

.modal9-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal9-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal9-close:hover {

  color: black;

}


.modal10-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal10-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal10-window > div {

  width: 100%;

  height:250%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal10-window header {

  font-weight: bold;

}

.modal10-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal10-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal10-close:hover {

  color: black;

}


.modal11-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal11-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal11-window > div {

  width: 100%;

  height:250%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal11-window header {

  font-weight: bold;

}

.modal11-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal11-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal11-close:hover {

  color: black;

}


.modal12-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal12-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal12-window > div {

  width: 100%;

  height:200%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal12-window header {

  font-weight: bold;

}

.modal12-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal12-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal12-close:hover {

  color: black;

}


.modal13-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

}

.modal13-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal13-window > div {

  width: 100%;

  height:150%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal13-window header {

  font-weight: bold;

}

.modal13-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal13-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal13-close:hover {

  color: black;

}


.modal14-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

}

.modal14-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal14-window > div {

  width: 100%;

  height:150%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal14-window header {

  font-weight: bold;

}

.modal14-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal14-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal14-close:hover {

  color: black;

}


.modal15-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal15-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal15-window > div {

  width: 100%;

  height:250%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal15-window header {

  font-weight: bold;

}

.modal15-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal15-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal15-close:hover {

  color: black;

}


.modal16-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal16-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal16-window > div {

  width: 100%;

  height:250%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal16-window header {

  font-weight: bold;

}

.modal16-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal16-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal16-close:hover {

  color: black;

}


.modal17-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal17-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal17-window > div {

  width: 100%;

  height:200%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal17-window header {

  font-weight: bold;

}

.modal17-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal17-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal17-close:hover {

  color: black;

}


.modal18-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal18-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal18-window > div {

  width: 100%;

  height:200%;

  overflow-y: scroll;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal18-window header {

  font-weight: bold;

}

.modal18-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal18-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal18-close:hover {

  color: black;

}


.modal19-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal19-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal19-window > div {

  width: 100%;

  height:250%;

  position: absolute;

  padding: 2em;

  overflow-y: scroll;

  background: #29282873;

}

.modal19-window header {

  font-weight: bold;

}

.modal19-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal19-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal19-close:hover {

  color: black;

}


.modal20-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal20-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal20-window > div {

  width: 100%;

  height:250%;

  position: absolute;

  padding: 2em;

  overflow-y: scroll;

  background: #29282873;

}

.modal20-window header {

  font-weight: bold;

}

.modal20-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal20-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

  font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal20-close:hover {

  color: black;

}


.modal21-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal21-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal21-window > div {

  width: 100%;

  height:250%;

  position: absolute;

  padding: 2em;

  overflow-y: scroll;

  background: #29282873;

}

.modal21-window header {

  font-weight: bold;

}

.modal21-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal21-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

  font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal21-close:hover {

  color: black;

}


.modal22-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal22-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal22-window > div {

  width: 100%;

  height:250%;

  position: absolute;

  padding: 2em;

  overflow-y: scroll;

  background: #29282873;

}

.modal22-window header {

  font-weight: bold;

}

.modal22-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal22-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

  font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal22-close:hover {

  color: black;

}


.modal23-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

}

.modal23-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal23-window > div {

  width: 100%;

  height:150%;

  position: absolute;

  padding: 2em;

  overflow-y: scroll;

  background: #29282873;

}

.modal23-window header {

  font-weight: bold;

}

.modal23-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal23-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

  font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal23-close:hover {

  color: black;

}


.modal24-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal24-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal24-window > div {

  width: 100%;

  height:250%;

  position: absolute;

  padding: 2em;

  background: #29282873;

}

.modal24-window header {

  font-weight: bold;

}

.modal24-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal24-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

  font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal24-close:hover {

  color: black;

}


.modal25-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

  overflow-y: scroll;

}

.modal25-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal25-window > div {

  width: 100%;

  height:250%;

  position: absolute;

  padding: 2em;

  overflow-y: scroll;

  background: #29282873;

}

.modal25-window header {

  font-weight: bold;

}

.modal25-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal25-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

  font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal25-close:hover {

  color: black;

}


.modal26-window {

  position: fixed;

  background-color: rgba(255, 255, 255, 0.507);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 999;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;
  overflow-y:scroll;
  overflow-x:hidden;

}

.modal26-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal26-window > div {

  width: 100%;

  height:2300px;

  position: absolute;

  padding: 2em;

  overflow-y: scroll;

  background: #29282873;

}

.modal26-window header {

  font-weight: bold;

}

.modal26-window h1 {

  font-size: 150%;

  margin: 0 0 15px;

}


.modal26-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

  font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;  

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  text-decoration: none;

}

.modal26-close:hover {

  color: black;

}


.modal27-window {

  position: fixed;

  background-color: rgba(124, 122, 122, 0.685);

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

  transition: all 0.3s;

}

.modal27-window:target {

  visibility: visible;

  opacity: 1;

  pointer-events: auto;

}

.modal27-window > div {

  width: 100%;

  height:100%;

  position: absolute;

  padding: 2em;

  overflow:scroll;

  background: #ffffff00;

}

.modal27-window header {

  font-weight: bold;

}

.modal27-window h1 {

  font-size: 150%;

}

.modal27-close {

  color: rgb(122, 1, 1);

  line-height: 50px;

    font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  width: 70px;

  
  text-decoration: none;

}

.modal27-close:hover {

  color: black;

}


.popup-a:hover{

  color:black;

}


.popup-div{

  background-color:white;

  width:100%;

  height:70%;

  padding-top:60px;

  padding-left:10px;

}

.popup-div-ic{

  width:25%;

  height:100px;

  margin-left:60px;

  background-color: #474747;

  border-radius: 7px;

  padding-top: 2%;
  margin-top:2%;

}
.sektor-con-1{
  max-height:600px;
  margin-bottom: 5%;
}
.popup-a{

  font-size:19px;

  font-weight: 700;

  color:rgb(255, 255, 255);

  cursor: pointer;

  font-family: 'Mitr', sans-serif;

}

.ilgili-resimler-baslik{

  font-size: 25px;

  width:100%;

  font-family: 'Mitr', sans-serif;

  color:black;

  font-weight: 700;

}
.sektor-col{
  margin-left:45px;
}
.sektor-aciklama{
  font-size: 16px;
  font-weight: 700;
  font-family: 'Mitr', sans-serif;
  color:black;
}
.sektor-baslik{
  font-size: 30px;
  font-weight: 700;
  font-family: 'Mitr', sans-serif;
  color:black;
  margin-bottom:2%;
}
.sektor-resim{
  border:3px solid #242529;
  border-radius:7px;
}

.aciklama-col{
  margin-left:-60px;
  padding-left:50px;
}
.resim-galeri{

  width:110px;

  height:110px;

  border: 2px solid gray;

  float: left;
  margin-top:4%;

  margin-left:60px;

  border-radius: 7px;

  background-color: gray;

  background-position: center center;

  background-size: cover;

  background-repeat: no-repeat;

}
.a-linkleri table{
  border: 0px;
}
.a-linkleri table tr{
  border:0px;
}
.a-linkleri table tr td{
  border:0px;
}
.a-linkleri table tr td a{
  text-align: center;
  height:100px;
  padding-top: 35px;
  font-weight: 600;
  border-radius: 7px;
  display: block;
  background-color: #212529;
  color:white;
}
.a-linkleri table tr td img{
  border:3px solid #242529;
  border-radius:7px;
  cursor:pointer;
  overflow: scroll;
  max-width: 350px;

  display: block;
  transition: 2s, 4s,3s;
}


/*slide styles !!!YOU NEED THEM */

.flexbox-slider {

  display: flex;

  width: 100%;

  height: 550px;

}

.flexbox-slider .flexbox-slide {

  transition-property: all;

  transition-duration: 0.2s;

  transition-timing-function: inherit;

  transition-delay: 0.1s;

  width: 30%;

  height: 100%;

  position: relative;

  overflow: hidden;

  z-index:50;

  border-bottom:2px solid white;

  border-left:2px solid white;

}

.flexbox-slider .flexbox-slide:after {

  position: absolute;

  top: 0;

  left: 0;

  content: "";

  display: block;

  width: 30%;

  height: 100%;

  z-index: 2;

  opacity: 0;

}

.slider-baslik{

  position: absolute;

  opacity:1;

  font-family: 'Mitr', sans-serif;

  z-index:24;

  font-size:25px;

  color:white;

  padding-top:400px;

  padding-left:20px;

  font-weight: 700;

}

.flexbox-slide:hover .slider-baslik {

  position: absolute;

  opacity: 0;

  font-family: 'Mitr', sans-serif;

  z-index:24;

}

.flexbox-slider .flexbox-slide img {

  position: absolute;

  top: 50%;

  left: 50%;

  height: auto;

  width: auto;

  min-width: 100%;

  min-height: 100%;

  -webkit-transform: translate(-50%, -50%);

          transform: translate(-50%, -50%);

  z-index: 1;

  filter: brightness(55%);

}

.flexbox-slider .flexbox-slide .text-block {

  position: absolute;

  max-width:100%;

  height:0px;

  min-width:100%;

  padding: 20px;

  margin-top:350px;

  border-radius: 5px;

  background-color: rgba(0, 0, 0, 0);

  color: #fff;

  z-index: 4;

  font-family: 'Mitr', sans-serif;

  visibility: hidden;

  opacity: 0;

}

.flexbox-slider .flexbox-slide .text-block h3 {

  font-size: 20px;

  font-weight: 700;

}

.flexbox-slider:hover .flexbox-slide:hover {

  flex-shrink: 0;

  width: 50%;

}


/* effect 1 styles */

.flexbox-slider.flexbox-slider-1 .flexbox-slide .text-block {

}

.flexbox-slider.flexbox-slider-1:hover .flexbox-slide:hover .text-block {

  transition-property: all;

  transition-duration: 0.2s;

  transition-timing-function: linear;

  transition-delay: 0.2s;

  font-family: 'Mitr', sans-serif;

  opacity: 1;

  max-width:800px;

  visibility: visible;

}


/* slider eds here */


/* slider altındaki kartlar başlar */

.tanitimkart{

  max-width: 18rem;

  border-style: none; 

  min-height:16rem;

}

.tanitimkarttext{

  color:#263F54;

  opacity:100;

  font-weight:500;

  font-family: 'Mitr', sans-serif;

}

.tanitimkartbaslik{

  color:#212529;

  font-weight:700;

  font-family: 'Mitr', sans-serif;

}


/* slider altındaki kartlar biter */


.ml-80-px{

  margin-left:80px;

}

.ml-10-px{

  margin-left:10px;

}

.mr-10-px{

  margin-right:10px;

}

.ml-25-px{

  margin-left:25px;

}
.ml-15-px{
  margin-left:15px;
}
.ml-12-px{
  margin-left:12px;
}
.ml-40-px{

  margin-left:40px;

}

.f-7{

  font-weight:700;

}

.hr-100-lb{

  width:100%;

  background:#0d96f2;

}

.mw-mn-800{

  max-width:800px;

  min-width:800px;

}

.hr-70-lb{

  width:70%;

  background:#0d96f2;

  margin-left:15px;

}

.pr-mt-3{

  position:relative;

  margin-top:3%;

}

.mc-span{

  font-size: 25px; 

  color:#263F54; 

  line-height: 34px; 

  font-weight: 700; 

}

.mc-span-emp{

  font-size: 25px; 

  line-height: 34px; 

  font-weight: 700;

}

.mc-span-lw{

  font-size:16px; 

  color:#263F54; 

  font-weight: 500;

}

.mt-2{

  margin-top:2%;

}

.mt-5{

  margin-top:5%;

}


.mt-50-fs-30-px{

  margin-left:50px;

  font-size:30px;

}

.fs-18{

  font-size:18px;

}

.fs-20-fw-600{

  font-size: 20px;

  font-weight: 600;

}

.p-h2{

  color:white;

  padding-top:50px;

}

.pd-60-px{

  padding-top:60px;

}

.color-w{

  color:white;

}

.mt-80-px{

  margin-top:80px;

}

.pa{

  position:absolute;

}

.pd-t-3{

  padding-top:3%;

}

.pd-t-2{

  padding-top:2%;

}

.pd-l-11{

  padding-left:11%;

}

.fs-35{

  font-size:35px;

}

.m-50-px{

  margin:50px;

}

.mt-20-px{

  margin-top:20px;

}

.mt-15-px{

  margin-top:15px;

}

.mt-12-px{

  margin-top:12px;

}

.mt-10-px{

  margin-top:10px;

}

.mb-10-px{

  margin-bottom:10px;

}


/* certificates starts here */


.caard{

  position: relative;

  width: 250px;

  height: 400px;

  background: #fff;

  border-radius: 4px;

  box-shadow:0 2px 10px rgba(0,0,0,.5);

}

.caard:before,

.caard:after

{

  content:"";

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  border-radius: 4px;

  background: #fff;

  transition: 0.5s;

  z-index:-1;

}

/* .caard:hover:before{

transform: rotate(20deg);

box-shadow: 0 2px 20px rgba(0,0,0,.2);

}

.caard:hover:after{

transform: rotate(10deg);

box-shadow: 0 2px 20px rgba(0,0,0,.2);

} */

.caard .imgBx{

position: absolute;

top: 10px;

left: 10px;

bottom: 10px;

right: 10px;

background: #222;

transition: 0.5s;

z-index: 1;

}


.caard:hover .imgBx

{

  bottom: 80px;

}


.caard .imgBx img{

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    object-fit: cover;

}


.caard .details{

    position: absolute;

    left: 10px;

    right: 10px;

    bottom: 10px;

    height: 60px;

    text-align: center;

    font-family: 'Mitr', sans-serif;

    
}


.caard .details h2{

 margin: 0;

 padding: 0;

 font-weight: 600;

 font-size: 20px;

 color: #777;

 font-family: 'Mitr', sans-serif;

} 


.caard .details h2 span{

font-weight: 500;

font-size: 16px;

color: #f38695;

display: block;

margin-top: 5px;

font-family: 'Mitr', sans-serif;

 } 

.anafont{

  font-family: 'Mitr', sans-serif;


}


/* certificates eds here */


/* products starts here */


#hero-slides {

  --page: 0;

  height: 100vh;

  overflow: hidden;

}

#hero-slides #header {

  height: 12vh;

  line-height: 12vh;

  padding: 0 3vw;

  position: relative;

}

#hero-slides #header #logo {

  font-size: 2.5vh;

  font-style: italic;

}

#hero-slides #header #logo:before {

  text-transform: uppercase;

  font-weight: 100;

  margin-right: 0.4em;

}

#hero-slides #header #logo:after {

  content: '';

  text-transform: uppercase;

  font-weight: 800;

}

#hero-slides #header #menu {

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  cursor: pointer;

  padding: 0 3vw;

}

#hero-slides #header #menu:before {

  font-size: 1.75vh;

  margin-right: 0.5em;

  text-transform: uppercase;

}

#hero-slides #header #menu #hamburger {

  display: inline-block;

}

#hero-slides #header #menu #hamburger .slice {

  background: white;

  height: 0.2vh;

  width: 1vw;

}

#hero-slides #header #menu #hamburger .slice:not(:last-child) {

  margin-bottom: 0.5vh;

}

#hero-slides #slides-cont {

  position: relative;

  --button-height: 6vh;

  --button-spacing: 0.2vh;

}

#hero-slides #slides-cont .button {

  width: 5vw;

  height: var(--button-height);

  background: #0d96f2;

  position: absolute;

  right: 5.375vw;

  top: 38vh;

  z-index: 100;

  cursor: pointer;

}

#hero-slides #slides-cont .button:before, #hero-slides #slides-cont .button:after {

  line-height: var(--button-height);

  position: relative;

  margin-left: -0.25vw;

  pointer-events: none;

  -webkit-transform: scale(0.75, 1.5);

          transform: scale(0.75, 1.5);

  transition: 125ms ease-in-out;

}

#hero-slides #slides-cont .button:before {

  left: 30%;

}

#hero-slides #slides-cont .button:after {

  opacity: 0;

}

#hero-slides #slides-cont .button:hover:before, #hero-slides #slides-cont .button:hover:after {

  transition: 250ms ease-in-out;

}

#hero-slides #slides-cont .button:hover:before {

  opacity: 0;

}

#hero-slides #slides-cont .button:hover:after {

  left: 100% !important;

  opacity: 1;

}

#hero-slides #slides-cont #next {

  margin-top: calc(-1 * (var(--button-height) + var(--button-spacing)));

}

#hero-slides #slides-cont #next:before, #hero-slides #slides-cont #next:after {

  content: '>';

}

#hero-slides #slides-cont #next:after {

  left: 100%;

}

#hero-slides #slides-cont #next:hover:before {

  left: 100%;

}

#hero-slides #slides-cont #prev {

  margin-top: var(--button-spacing);

  opacity: calc(var(--page) + 2);

  transition: 500ms opacity;

}

#hero-slides #slides-cont #prev:before, #hero-slides #slides-cont #prev:after {

  content: '<';

}

#hero-slides #slides-cont #prev:after {

  left: 70%;

}

#hero-slides #slides-cont #prev:hover:before {

  left: 50%;

}

#hero-slides #slides-cont #next-catch,

#hero-slides #slides-cont #prev-catch {

  width: 10vw;

  height: 76vh;

  position: absolute;

  top: 0;

  z-index: 90;

}

#hero-slides #slides-cont #next-catch {

  right: 0;

}

#hero-slides #slides-cont #prev-catch {

  left: 0;

}

#hero-slides #slides {

  --slides-height: 60vh;

  width: auto;

  height: var(--slides-height);

  padding: 0 10vw;

  font-size: 0;

  white-space: nowrap;

  position: relative;

  -webkit-transform: translate3D(calc(var(--page) * -80vw), 0, 0);

          transform: translate3D(calc(var(--page) * -80vw), 0, 0);

  transition: 1500ms -webkit-transform cubic-bezier(0.7, 0, 0.3, 1);

  transition: 1500ms transform cubic-bezier(0.7, 0, 0.3, 1);

  transition: 1500ms transform cubic-bezier(0.7, 0, 0.3, 1), 1500ms -webkit-transform cubic-bezier(0.7, 0, 0.3, 1);

}

#hero-slides #slides .slide {

  display: inline-block;

  font-size: 1.5vw;

  width: 25em;

  height: var(--slides-height);

  margin: 0 1.333em;

  background: #10141900;

  box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.2);

  color: white;

  background-size: contain;

  background-repeat: no-repeat;

  background-position: center;

  object-fit: contain;

  white-space: normal;

  word-break: break-word;

  position: relative;

  border-radius: 25px;

}

#hero-slides #slides .slide:before {

  content: '';

  display: block;

  opacity: 0;

  position: relative;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

}

#hero-slides #slides .slide .number {

  position: relative;

  top: 2em;

  left: 2em;

  -webkit-filter: drop-shadow(0 2px 1px rgba(0, 0, 0, 0.5));

          filter: drop-shadow(0 2px 1px rgba(0, 0, 0, 0.5));

}

#hero-slides #slides .slide .number, #hero-slides #slides .slide .number:before, #hero-slides #slides .slide .number:after {

  vertical-align: middle;

}

#hero-slides #slides .slide .number:before, #hero-slides #slides .slide .number:after {

  display: inline-block;

  content: '';

  height: 0.133em;

  margin-top: -0.2em;

  background: white;

}

#hero-slides #slides .slide .number:before {

  width: 0;

  margin-left: 0;

}

#hero-slides #slides .slide .number:after {

  width: 3em;

  margin-left: 1em;

}

#hero-slides #slides .slide .body {

  position: relative;

  bottom: 2em;

  left: 2em;

  right: 2em;

}

#hero-slides #slides .slide .location,

#hero-slides #slides .slide .headline {

  position: relative;

  bottom: 0;

  cursor: default;

}

#hero-slides #slides .slide:before,

#hero-slides #slides .slide .number:before,

#hero-slides #slides .slide .number:after,

#hero-slides #slides .slide .location,

#hero-slides #slides .slide .headline,

#hero-slides #slides .slide .link {

  transition: 375ms cubic-bezier(0.7, 0, 0.3, 1);

}

#hero-slides #slides .slide .location {

  font-weight: 100;

  margin-bottom: 1.5em;

  transition-delay: 60ms;

}

#hero-slides #slides .slide .headline {

  font-size: 2.667em;

  font-weight: 900;

  transition-delay: 50ms;

}

#hero-slides #slides .slide .link {

  display: inline-block;

  background: #0d96f2;

  padding: 0.5em 1.25em;

  font-size: 1.33em;

  opacity: 0;

  position: relative;

  bottom: -2em;

  pointer-events: none;

}

#hero-slides #slides .slide.hover:before, #hero-slides #slides .slide:hover:before {

  opacity: 1;

}

#hero-slides #slides .slide.hover:before,

#hero-slides #slides .slide.hover .number:before,

#hero-slides #slides .slide.hover .number:after,

#hero-slides #slides .slide.hover .location,

#hero-slides #slides .slide.hover .headline,

#hero-slides #slides .slide.hover .link, #hero-slides #slides .slide:hover:before,

#hero-slides #slides .slide:hover .number:before,

#hero-slides #slides .slide:hover .number:after,

#hero-slides #slides .slide:hover .location,

#hero-slides #slides .slide:hover .headline,

#hero-slides #slides .slide:hover .link {

  transition: 500ms cubic-bezier(0.7, 0, 0.3, 1);

}

#hero-slides #slides .slide.hover .number:before, #hero-slides #slides .slide:hover .number:before {

  width: 3em;

  margin-right: 1em;

}

#hero-slides #slides .slide.hover .number:after, #hero-slides #slides .slide:hover .number:after {

  width: 0;

  margin-right: 0;

}

#hero-slides #slides .slide.hover .location, #hero-slides #slides .slide:hover .location {

  transition-delay: 0;

  bottom: 4em;

}

#hero-slides #slides .slide.hover .headline, #hero-slides #slides .slide:hover .headline {

  transition-delay: 100ms;

  bottom: 1.5em;

}

#hero-slides #slides .slide.hover .link, #hero-slides #slides .slide:hover .link {

  bottom: 0;

  opacity: 1;

  transition-delay: 250ms;

  pointer-events: auto;

}

#hero-slides #footer {

  height: 12vh;

  font-size: 1vh;

}


#hero-slides #footer #dribbble:after {

  content: '';

  display: inline-block;

  width: 4vh;

  height: 4vh;

  margin-left: 1vh;

  background-position: center;

}

#hero-slides #footer #dribbble.hover, #hero-slides #footer #dribbble:hover {

  background: #e94e89;

}

#hero-slides #footer #dribbble.hover:before, #hero-slides #footer #dribbble:hover:before {

  opacity: 1;

  -webkit-transform: translate3D(0, 0, 0);

          transform: translate3D(0, 0, 0);

  transition-delay: 50ms;

}

#hero-slides #footer #dribbble.hover:after, #hero-slides #footer #dribbble:hover:after {

  -webkit-filter: saturate(0%) contrast(200%) brightness(200%) invert(100%);

          filter: saturate(0%) contrast(200%) brightness(200%) invert(100%);

}


@media (min-width: 1200px) and (max-width: 1699px) {

  body {

    --slides-per-page: 2;

  }


  #hero-slides #slides .slide {

    font-size: 1vw;

  }

}

@media (min-width: 1700px) {

  body {

    --slide-per-age: 4;

  }


  #hero-slides #slides .slide {

    font-size: 0.75vw;

  }

}


/* products eds here */


/* referances grayscale effect starts here */

.filtre img{

  -webkit-filter: grayscale(100%);

    filter:grayscale(100%);

}

.filtre img:hover{

  -webkit-transition: .4s ease-in-out;

  -o-transition: .4s ease-in-out;

  transition: .4s ease-in-out;

  filter:grayscale(0%);

  cursor:pointer;

}

/* referances grayscale effect eds here*/

  
/* css kartlar starts here */


.card{

  background-color:rgb(218, 211, 226);

  transition:1s ease;

  
}

.card:hover {

    background-color: white;

    box-shadow: 5px 5px 30px 15px rgba(128, 127, 127, 0.404), 

    -5px -5px 30px 15px rgba(121, 120, 120, 0.377);

    transition:1s ease;

}


.title-black {

  color: black;

}

.card-header:hover{

  background-color:white,

}


@media all and (max-width: 1139px) {

  .card-list {

    /* On small screens, we are no longer using row direction but column */

    flex-direction: column;

  }

}


/* Some custom styles to beautify this example */

.main-content{

min-height: 230px;

background: #dbdfe5;

}

.sidebar-content{

min-height: 100px;

margin-bottom: 30px;

background: #b4bac0;

z-index:4;

}


a {

  text-decoration: none;

}


h1 {

  font-family: "Open Sans", sans-serif;

  font-weight: 300;

}


.card .menu-content {

  margin: 0;

  padding: 0;

  list-style-type: none;

}

.card .menu-content::before, .card .menu-content::after {

  content: '';

  display: table;

}

.card .menu-content::after {

  clear: both;

}

.card .menu-content li {

  display: inline-block;

}

.card .menu-content a {

  color: rgb(0, 0, 0);

}

.card .menu-content span {

  position: absolute;

  left: 50%;

  top: 0;

  font-size: 10px;

  font-weight: 700;

  font-family: 'Open Sans';

  -webkit-transform: translate(-50%, 0);

          transform: translate(-50%, 0);

}

.card .wrapper {

  background-color: #fff;

  min-height: 350px;

  position: relative;

  overflow: hidden;

  box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.2);

}

.card .wrapper:hover .data {

height: 100%;

  -webkit-transform: translateY(0);

          transform: translateY(0);

          background-color: #fff;

}

.card .data {

  position: absolute;

  bottom: 0;

  width: 100%;

  -webkit-transform: translateY(calc(70px + 1em));

          transform: translateY(calc(70px + 1em));

  transition: -webkit-transform 0.3s;

  transition: transform 0.3s;

  transition: transform 0.3s, -webkit-transform 0.3s;

}

.card .data .content {

  padding: 1em;

  position: relative;

  z-index: 1;

}

.card .author {

  font-size: 12px;

}

.card .title {

  margin-top: 10px;

}

.card .text {

  height: 70px;

  margin: 0;

}

.card input[type='checkbox'] {

  display: none;

}

.card input[type='checkbox']:checked + .menu-content {

  -webkit-transform: translateY(-60px);

          transform: translateY(-60px);

}

/* css kartlar eds here */


/* index php css eds here */


/* header php css starts here */


.div.navbar ul{

  overflow:visible;

}

.h-logo{

  -webkit-box-shadow: 32px -6px 87px 20px rgba(0,0,0,0.75);

    -moz-box-shadow: 32px -6px 87px 20px rgba(0, 0, 0, 0.75);

    box-shadow: 32px -6px 87px 20px rgba(0,0,0,0.75);

    border-right:2px solid white;

    margin-left:-33px;

}

.li-1{

  margin-top:18px;

  margin-left:15px;

  font-weight:500;

}

.li-2{

  margin-top:18px;

  margin-left:15px;

  font-size:15px;

  font-weight:500;

}

.on-katalog-navbar{

  background-color: #00b3b2;

  border-radius: 5px;

}


.on-odeme-navbar{

  margin-top:18px;

  margin-left:15px;

  font-size:15px;

  font-weight:500;

  background-color: #00b3b2;

  border-radius: 5px;

}

.li-3{

  margin-top:18px;

  margin-left:20px;

}

.li-b-r{

  border-right:1px solid white;

}

/* header php css eds here */

/* footer css starts here */

.footer-sh{

  box-shadow: inset 0 -8px 16px 8px rgba(0, 0, 0, 0.4);

  box-shadow: inset 0 w8px 16px -8px rgba(0,0,0,0.4);

}

/* footer css eds here */

/* products css starts here */

.cf-alignment{

  max-height: 80px; 

  overflow: visible; 

  margin-top:135px;

}

.fl-r{

  float:right;

}

.bg-color-lb{

  background-color:#00b3b2; 

  border-radius:7px;

}

.w-400-px{

  width:400px;

}

.fixed-160-px{

  max-width:160px;

  min-width:160px;

  width:160px;

  max-height:160px;

  min-height:160px;

  height:160px;

}

.color-b{

  color:black;

}

.z-99999{

  z-index:99999;

}

.z-1{

  z-index:1;

}


 /* Hide Play button + controls on iOS */

 
/* products css eds here */

/* kurumsal css starts here */

.mx-h-300-px{

  max-height:300px;

}

.mx-w-300-px{

  max-width:300px;

}

.fixed-300-px{

  max-height:300px;

  max-width:300px;

}

.k-cf-alignment{

  max-height: 80px; 

  overflow: visible; 

  z-index: 20;

}

.k-cf-alignment2{

  max-height: 80px; 

  overflow: visible; 

  z-index: 20;

  margin-top:160px;

}

.hak-h3{

  font-family: 'Mitr', sans-serif;

  font-size: 25px; 

  color:gray; 

  line-height: 34px; 

  font-weight: 700;

}

.bg-color-w{

  background:white;

}

/* kurumsal css eds here */

/* insan kaynakları css starts here */

.ik-mc-p{

  font-family: Arial, Helvetica, sans-serif;

  font-size:15px; 

  color:cadetblue;

  font-weight: 700;

}

/* insan kaynakları css eds here */

/* media css starts here */


/* media css eds here */

/* iletisim css starts here */

.pd-10-px{

  padding:10px;

}

.pd-l-10-px{

  padding-left:10px;

}

/* iletisim css eds here */

/* online katalog css starts here */

.cat-par-h{

  max-height:330px;

  margin-bottom:-25px;

}

.mx-h-330-px{

  max-height:330px;

}

.cat-cf-alignment{

  max-height: 60px; 

  overflow: visible; 

  z-index: 20;

}

.mn-h-200-px{

  min-height:200px;

}

.mt-5-px{

  margin-top:5px;

}

.mx-w-250-px{

  max-width:250px;

}

.ml-18-px{

  margin-left:18px;

}

.cat-btn-alignment{

  margin:10px;

  padding-left:17px

}

/* online katalog css eds here */

::-webkit-scrollbar-track {

  background:white;;

}

::-webkit-scrollbar {

  width: 15px;

}

::-webkit-scrollbar-thumb {

  background:#474747;

}


html {

  scroll-behavior: smooth;

}

body{

    -webkit-font-smoothing: antialiased;

    overflow-x:hidden;

    background-color:#d8d4db;

}


/* slider altındaki kartlar */

.about-us{

    font-family: Arial, Helvetica, sans-serif;

}

.about-us p{

    right:0px;

    color:#777;

}


.about-us img{

    float:left;

}


.about-us-title{

    background-color:#222;

}

.about-us h2{

    background-color:#222;

}

.mapa-different{

    background-color: #ffffff;

}

.mapa-different ul li{

    list-style-type: none;

}

  
  /*  my codes  */

  
  @import url(https://fonts.googleapis.com/css?family=Roboto:400,500,700);

@import url(https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic,700italic);

* {

  margin: 0;

}


.title-content {

  text-align: center;

  margin: 70px 0 0 0;

  z-index: 20;

  width: 100%;

  top: 0;

  left: 0;

}


h3 {

  font-size: 20px;

  font-weight: 500;

  letter-spacing: 2px;

  color: #9CC9E3;

  font-family: 'Roboto', sans-serif;

  margin-bottom: 0;

}


hr {

  width: 50px;

  height: 2px;

  border: 0;

  background: #D0BB57;

}


/* news starts here */


.iletisimdivmedia{

  margin-top:-60px;

  width:47%;

  height:110px;

  background-color: #00b3b2;

  z-index: 21;

  overflow: visible;

  padding-left:15px;

  padding-top:10px; 

  font-family: Arial; 

  font-size: 30px;

  font-weight: 700;

  color:white;

  border-radius:7px;

}

.egitimtalepdivmedia{

  margin-top:-60px;

  width:47%;

  height:110px;

  background-color: #00b3b2;

  z-index: 21;

  overflow: visible;

  padding-left:15px; 

  padding-top:10px; 

  font-family: Arial; 

  font-size: 30px;

  font-weight: 700;

  color:white;

  border-radius:7px;

}

.kurumsaldivmedia{

  margin-top:-60px;

  width:47%;

  height:110px;

  background-color: #00b3b2;

  z-index: 21;

  overflow: visible;

  padding-left:15px; 

  padding-top:10px; 

  font-family: Arial; 

  font-size: 30px;

  font-weight: 700;

  color:white;

  border-radius:7px;

}

.medyadivmedia{

  margin-top:-60px;

  width:47%;

  height:110px;

  background-color: #00b3b2;

  z-index: 21;

  overflow: visible;

  padding-left:15px; 

  padding-top:10px;

  margin-left:-50px;

  font-family: Arial;

  font-size: 30px;

  font-weight: 700;

  color:white;

  border-radius:7px;

}

.ikdivmedia{

  margin-top:-60px;

  width:47%;

  height:110px;

  background-color: #00b3b2;

  z-index: 21;

  overflow: visible;

  padding-left:15px;

  padding-top:10px;

  font-family: Arial;

  font-size: 30px;

  font-weight: 700;

  color:white;

  border-radius:7px;

}

.urunlerdivmedia{

  margin-top:-60px;

  width:47%;

  height:110px;

  background-color: #00b3b2;

  z-index:2;

  overflow: visible;

  padding-left:15px;

  padding-top:10px;

  margin-left:10px;

  padding-right:10px;

  font-family: Arial; 

  font-size: 30px;

  font-weight: 700;

  color:white;

  border-radius:7px;

}

.urunler-ml{

  margin-left:55px;

}

.urundetaydivmedia{

  width:100%;

  background-color: #00b3b2;

  z-index:2;

  overflow: visible;

  padding-left:15px;

  padding-top:10px;

  padding-bottom:10px;

  font-family: Arial; 

  font-size: 30px;

  font-weight: 700;

  color:white;

}

.border-rd-15{

border-radius:15px;

}

.bg-color-gre{

  background-color:green;

}


.mobil-i{

  display:block;

}

@media only screen and (max-width: 600px) {

 .ilgili-resimler-baslik{

   margin-left:-50px;

 }

 .h-logo{

    box-shadow: none;

    margin-left:-33px;

    border: none;

}

 .resim-galeri{

   margin-left:25px;

 }

  td img{

    width:370px;

  }

  table{

    overflow-x: scroll;

    max-width:300px;

  }

  div.row div.overflow-scroll{

    max-width:300px;

    overflow-x: scroll;

  }

  .modal27-window {

    position: fixed;

    background-color: rgba(255, 255, 255, 0.507);

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    z-index: 999;

    visibility: hidden;

    opacity: 0;

    pointer-events: none;

    transition: all 0.3s;

  }

  .modal27-window:target {

    visibility: visible;

    opacity: 1;

    pointer-events: auto;

  }

  .modal27-window > div {

    max-width: 350px;

    max-height:500px;

    position: absolute;

    margin-left:-15px;

    padding: 2em;

    background: #ffffff00;

    overflow:scroll;

  }

  .modal27-window header {

    font-weight: bold;

  }

  .modal27-window h1 {

    font-size: 150%;

  }

  .modal27-close {

    color: rgb(122, 1, 1);

    line-height: 50px;

      font-family: 'Mitr', sans-serif;

  background-color: white;

  font-size: 30px;

    position: absolute;

    right: 0;

    text-align: center;

    top: 0;

    width: 70px;

    text-decoration: none;

  }

  .modal27-close:hover {

    color: black;

  }

  
  .modal-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal2-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;


  }

  .modal3-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal4-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal5-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal6-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal7-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal8-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal9-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal10-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal11-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal12-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal13-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal14-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal15-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal16-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal17-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal18-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal19-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal20-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal21-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal22-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal23-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal24-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal25-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal26-window > div {

    width: 100%;

    height: 100%;

    position: absolute;

    padding: 2em;

  }

  .modal-window:target {

    visibility: visible;

    opacity: 1;

    pointer-events: auto;

  }

  .sektordiv{

    min-width:50%;

    min-height:200px;

    border-radius:7px;

  }

  .popup-div{

    width:100%;

    height:100%;

    overflow-y: scroll;

    overflow-x: hidden;


  }

  .popup-div-ic{

    width:40%;

    height:15%;

    margin:5px;


  }

  .popup-a{

    font-size:13px;

  }

  .profile__details {

    display: inline-block;

    vertical-align: top;

    text-align: left;

    float:left;

    margin-left:15%;

  }

  .profile__image {

    width: 20%;

    height:40%;

    margin: 0 auto 2em;

    border: 0.125em solid black;

    background-color: #000;

    display: block;

  }

  /* slider mobil */

  video{

    visibility: hidden;

  }

  .slider-container{

    padding-bottom:820px;

  }

  .slideryazi{

    color:white;

    font-size:20px;

  }

  .flexbox-slide:hover .imghover{

    visibility:visible;

    z-index:3;

  }

  .flexbox-slider {

    display: block;

    width: 100%;

    height: 200px;

    background-size:cover;

    background-position: center center;

    
  }

  .flexbox-slider .flexbox-slide {

    transition-property: all;

    transition-duration: 0.2s;

    transition-timing-function: inherit;

    transition-delay: 0.1s;

    width: 100%;

    min-width: 100%;

    height: 100%;

    font-size:10px;

    position: relative;

    overflow: hidden;

    z-index:50;

    border-bottom:2px solid white;

    border-left:0px;

    background-size:cover;

    background-position: center center;

  }

  .slider-baslik{

    position: absolute;

    opacity:1;

    font-family: 'Mitr', sans-serif;

    z-index:24;

    font-size:15px;

    color:white;

    padding-top:50px;

    padding-left:20px;

    font-weight: 700;

  }

  .flexbox-slider .flexbox-slide:after {

    position: absolute;

    content: "";

    min-width:100%;

    display: block;

    width: 100%;

    height: 100%;

    z-index: 2;

    opacity: 0;

    background-size:cover;

    background-position: center center;

  }

  .flexbox-slider .flexbox-slide .text-block {

    position: absolute;

    max-width:100%;

    height:0px;

    min-width:100%;

    margin-top:10px;

    font-size:13px;

    border-radius: 5px;

    background-color: rgba(0, 0, 0, 0);

    color: #fff;

    z-index: 4;

    font-family: 'Mitr', sans-serif;

    visibility: hidden;

    opacity: 0;

  }

  .flexbox-slider .flexbox-slide img {

    position: absolute;

    min-width: 100%;

    min-height: 100%;

    z-index: 1;

    filter: brightness(55%);

    background-size:cover;

    background-position: center center;

  }

  
  /* slider mobil bitiş */

  /* üründetay */

  .img-zoom-lens {

    position: absolute;

    /*set the size of the lens:*/

    width: 0px;

    height: 0px;

    cursor:zoom-in;

  }

  .img-zoom-result{

    visibility:hidden;

    position: absolute;

    z-index:9999;

    margin-left:0px;

    margin-top:0px;

    border: 1px solid #d4d4d4;

    /*set the size of the result div:*/

    width: 0px;

    height: 0px;

  }

  .img-zoom-container:hover .img-zoom-result {

    visibility: hidden;

  }

  .img-zoom-container {

    position: relative;

    width:100%;

  }

  /* üründetay */

  .urunlerdivmedia{

    width:400px;

    margin-left:-45px;

  }

  .urunlermedia{

    font-size:20px;

    padding-left:40px;

    padding-top:12px;

  }

  .ikdivmedia{

    width:600px;

    font-size:15px;

    padding-left:35px;

    padding-right:20px;

    margin-bottom:40px;

    margin-top:-90px;

    height:100px;

    
  }

  .responsiveds{

      width:250px;

  }

  .ikmedia{

    font-size:15px;

    padding-left:35px;

}

  .ekmekmedia{

    font-size:15px;

  }

  .medyadivmedia{

    width:400px;

    padding-left:70px;

    font-size:20px;

  }

  .kurumsaldivmedia{

    width:400px;

    font-size:16px;

    padding:20px;

    padding-left:40px;

  }

  .urundetaydivmedia{

    width:100%;

    font-size:20px;

  }

    .egitimtalepdivmedia{

      width:650px;

      font-size:20px;

      padding-left:45px;

    }

  .iletisimdivmedia{

    width:600px;

    font-size:15px;

    padding-left:55px;

    padding-right:20px;

    margin-bottom:40px;

    margin-top:-90px;

    height:100px;

  }

    }


@media only screen and (max-width: 600px) {

.caard{

  min-width:100%;

  min-height:500px;

  
}


.col-6{

    min-width:100%;

    margin-top:20px;

}

.card-header{

  min-width:100%;

}

.card-body{

  min-width:100%;

}

.card{

  margin-left:10%;

}


}


/* footer starts here*/


footer{

	bottom: 0;

  font-family: 'Mitr', sans-serif;

  font-weight:500;

}


@media (max-height:800px){

	footer { position: static; }

	header { padding-top:40px; }

}


.footer-distributed{

	background-color: #2c292f;

	box-sizing: border-box;

	width: 100%;

	text-align: left;

	font: bold 16px sans-serif;

	padding: 50px 50px 60px 50px;

	margin-top: 80px;

  font-family: 'Mitr', sans-serif;

  font-weight:500;

}


.footer-distributed .footer-left,

.footer-distributed .footer-center,

.footer-distributed .footer-right{

	display: inline-block;

	vertical-align: top;

  font-family: 'Mitr', sans-serif;

  font-weight:500;

}


/* Footer left */


.footer-distributed .footer-left{

	width: 30%;

}


.footer-distributed h3{

	color:  #ffffff;

	font: normal 36px 'Cookie', cursive;

	margin: 0;

}


/* The company logo */


.footer-distributed .footer-left img{

	width: 30%;

}


.footer-distributed h3 span{

	color:  #e0ac1c;

}


/* Footer links */


.footer-distributed .footer-links{

	color:  #ffffff;

	margin: 20px 0 12px;

}


.footer-distributed .footer-links a{

	display:inline-block;

	line-height: 1.8;

	text-decoration: none;

	color:  inherit;

}


.footer-distributed .footer-company-name{

	color:  #8f9296;

	font-size: 14px;

	font-weight: normal;

	margin: 0;

}

.footer-distributed .footer-company-name a{

    text-decoration:none;

    color:white;

}


/* Footer Center */


.footer-distributed .footer-center{

	width: 35%;

}


.footer-distributed .footer-center i{

	background-color:  #33383b;

	color: #ffffff;

	font-size: 25px;

	width: 38px;

	height: 38px;

	border-radius: 50%;

	text-align: center;

	line-height: 42px;

	margin: 10px 15px;

	vertical-align: middle;

}


.footer-distributed .footer-center i.fa-envelope{

	font-size: 17px;

	line-height: 38px;

}


.footer-distributed .footer-center p{

	display: inline-block;

	color: #ffffff;

	vertical-align: middle;

	margin:0;

}


.footer-distributed .footer-center p span{

	display:block;

	font-weight: normal;

	font-size:14px;

	line-height:2;

}


.footer-distributed .footer-center p a{

	color:  #e0ac1c;

	text-decoration: none;;

}


/* Footer Right */


.footer-distributed .footer-right{

	width: 30%;

}


.footer-distributed .footer-company-about{

	line-height: 20px;

	color:  #92999f;

	font-size: 13px;

	font-weight: normal;

	margin: 0;

}


.footer-distributed .footer-company-about span{

	display: block;

	color:  #ffffff;

	font-size: 18px;

	font-weight: bold;

    margin-bottom: 20px;

}


.footer-distributed .footer-icons{

    margin-top: 25px;

}


.footer-distributed .footer-icons a{

	display: inline-block;

	width: 35px;

	height: 35px;

	cursor: pointer;

    border-radius: 2px;


	font-size: 20px;

	color: #ffffff;

	text-align: center;

	line-height: 35px;


	margin-right: 3px;

	margin-bottom: 5px;

}


.footer-icons img:hover{

  border-radius:20px;

  background-color:purple;

  opacity:0.2;

}


/* Here is the code for Responsive Footer */

/* You can remove below code if you don't want Footer to be responsive */


@media (max-width: 880px) {


	.footer-distributed .footer-left,

	.footer-distributed .footer-center,

	.footer-distributed .footer-right{

		display: block;

		width: 100%;

		margin-bottom: 40px;

		text-align: center;

	}


	.footer-distributed .footer-center i{

		margin-left: 0;

	}


}


/* footer eds here */


/* main parallax effect starts here */


.index-header-parallax {

  width: 100%;

  height: 900px;

  background-image: url("../img/sliders/paralax.jpg");

  background-size: cover;

  background-position: center center;

  position: relative;

  background-attachment: fixed;

  left: 0;


}


.iletisim-header-parallax {

  width: 100%;

  height: 900px;

  background-image: url("../img/sliders/contact-us.jpg");

  background-size: cover;

  background-position: center center;

  position: relative;

  background-attachment: fixed;

  left: 0;

}


.iletisim-header-parallax .iletisim-header-parallax-mask {

  width: 100%;

  height: 100%;

  background-color: rgba(0, 0, 0, 0.158);

}


.catalog-header-parallax {

  width: 100%;

  height: 900px;

  background-image: url("../img/sliders/catalog.jpg");

  background-size: cover;

  background-position: center center;

  position: relative;

  background-attachment: fixed;

  left: 0;

}


.catalog-header-parallax .catalog-header-parallax-mask {

  width: 100%;

  height: 100%;

  background-color: rgba(0, 0, 0, 0.158);

}


.index-header-parallax .index-header-parallax-mask {

  width: 100%;

  height: 100%;

  background-color: rgba(0, 0, 0, 0.158);

}


.index-header-parallax .index-header-parallax-mask .text-align {

  position: relative;

  display: inline-block;

  padding: 0px 20px;

  text-align: center;

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%);

  -webkit-transform: translate(-50%, -50%);

}


/* main parallax effect eds here */


/* products parallax effect starts here */


.index-products-parallax {

  width: 100%;

  height: 100%;

  background-image: url("../img/sliders/urunlerparalax.png");

  background-size: cover;

  background-position: center center;

  background-attachment: fixed;

  left: 0;

  top: 100px;

}


.kurumsal-header-parallax .kurumsal-header-parallax-mask {

  width: 100%;

  height: 100%;

  background-color: rgba(0, 0, 0, 0.158);

}

.kurumsal-header-parallax {

  width: 100%;

  height: 900px;

  background-image: url("../img/corporate.jpg");

  background-size: cover;

  background-position: center center;

  position: relative;

  background-attachment: fixed;

  left: 0;


}


.ik-header-parallax {

  width: 100%;

  height: 900px;

  background-image: url("../img/human_resoources.jpg");

  background-size: cover;

  background-position: center center;

  position: relative;

  background-attachment: fixed;

  left: 0;


}


.ik-header-parallax .ik-header-parallax-mask {

  width: 100%;

  height: 100%;

  background-color: rgba(0, 0, 0, 0.158);

}


.education-header-parallax {

  width: 100%;

  height: 900px;

  background-image: url("../img/education.jpg");

  background-size: cover;

  background-position: center center;

  position: relative;

  background-attachment: fixed;

  left: 0;


}

.education-header-parallax .education-header-parallax-mask {

  width: 100%;

  height: 100%;

  background-color: rgba(0, 0, 0, 0.158);

}


.products-header-parallax {

  width: 100%;

  height: 350px;

  margin-bottom:-160px;

  background-image: url("../img/sliders/urunlerparalax.png");

  background-size: cover;

  background-position: center center;

  position: relative;

  background-attachment: fixed;

  left: 0;


}

.products-header-parallax .products-header-parallax-mask {

  width: 100%;

  height: 100%;

  background-color: rgba(0, 0, 0, 0);

}


.index-products-parallax .index-products-parallax-mask {

  width: 100%;

  height: 100%;

  background-color: rgba(61, 141, 137, 0.671);

}


.section-one {

  padding-top: 50px;

  position: relative;

  padding-bottom: 50px;

  min-height: 500px;

}


.img-zoom-container {

  position: relative;

  width:300px;

}


.img-zoom-lens {

  position: absolute;

  border: 2px solid #797676;

  /*set the size of the lens:*/

  width: 40px;

  height: 40px;

  background-color: #787a7a67;

  cursor:zoom-in;

}

.img-zoom-result{

  visibility:hidden;

  position: absolute;

  z-index:9999;

  margin-left:400px;

  margin-top:-400px;

  border: 1px solid #d4d4d4;

  /*set the size of the result div:*/

  width: 160%;

  height: 130%;

}

.img-zoom-container:hover .img-zoom-result {

  visibility: visible;

}


.content{

  padding: 0 20px;

}

.content img{

  width: 100%;

  max-width: 700px;

  margin: 20px 0;

}

.content p{

  text-align: justify;

}


@media screen and (max-width:800px) {

  .show-menu-btn,.hide-menu-btn{

    display: block;

    z-index:60;

  }

  .menu{

    position: fixed;

    width: 100%;

    height: 100vh;

    background: #333;

    right: -100%;

    top: 0;

    text-align: center;

    padding: 80px 0;

    line-height: normal;

    transition: 0.7s;

    z-index:60;

  }

  .menu a{

    display: block;

    padding: 20px;

    z-index:60;

  }

  .hide-menu-btn{

    position: absolute;

    top: 40px;

    right: 40px;

  }

  #chk:checked ~ .menu{

    right: 0;

  }

}


/* products parallax effect eds here */


/* slider animation starts here */


/* slider animation eds here */


/* products.html css starts here */


/* left side bar css starts here */


.teknik-bilgi{

  padding:1em;

  border:2px solid #00b3b2;

  background:white;

  font-weight:700;

}

.hovver img{

  background-position: center center;

  background-size:cover;

  object-fit: contain;

  border-radius:7px;

  display: block;

  margin: 0 auto;

  
}

.hovver:hover{

  transition:0.6s ease;

  z-index:50;

  transition: box-shadow 0.5s, transform 0.1s;


}

.hovver:hover a{

  color:white;
  text-align: center;

}

.hovver{

  border:1px solid gray;

  margin:15px;

  border-radius: 7px;

  background-color:white;

  text-align: center;

}


.hovvver img{

  box-shadow: 5px 5px 30px 15px rgba(119, 117, 117, 0.13);

}


.hovvver img:hover{

  border:0px;

  transition:0.4s ease;

  transform: scale(0.95);

  transition: box-shadow 0.5s, transform 0.1s;

  box-shadow: 5px 5px 30px 15px rgba(100, 97, 97, 0);

  cursor:pointer;

}


.downmenu i{

  opacity: 0;

}


.downmenu:hover i{

  opacity:1;

  transition: 1.1s ease;

}


span {

 
  display: block;

}


span::after {

  float: right;

  right: 10%;

}


a:hover{

  color:white;

}


a:hover,a:focus{

  text-decoration: none;

  outline: none;

}


video::-webkit-media-controls {

  display: none;

}


.panel2 {

  padding: 0 18px;

  margin-left:280px;

  margin-top:-150px;

  max-height: 0;

  position:absolute;

  overflow:hidden;

  transition: max-height 0.2s ease-out;

}

.panel2 li{

  list-style-type:none;

  padding:10px;

}

  .panel li{

    list-style-type:none;

    padding:10px;

  }


  .accordion {

    background-color: #414242;

    margin-bottom:10px;

    color: white;

    border-radius: 7px;

    cursor: pointer;

    padding: 18px;

    width: 100%;

    border: none;

    text-align: left;

    outline: none;

    font-size: 16px;

    transition: 0.4s;

    font-weight: 600;

    
  }


  .active, .accordion:hover {

    background-color: #474747;

    color:white;

  }

  
  .accordion:after {

    content: '\002B';

    color: #777;

    font-weight: bold;

    float: right;

    margin-left: 5px;

  }

  
  .active:after {

    content: "\2212";

  }

  
  .panel {

    padding: 0 18px;

    max-height: 0;

    overflow: hidden;

    transition: max-height 0.2s ease-out;

  }


  .accordionchild {

    margin-bottom:10px;

    cursor: pointer;

    padding: 18px;

    width: 100%;

    border: none;

    text-align: left;

    outline: none;

    font-size: 15px;

    transition: 0.4s;

    border-radius: 7px;

    
  }

  .accordionchild div li{

    background: #474747;

  }


  .active, .accordionchild:hover {

    background-color: #474747;

    color:white;

  }

  
  .accordionchild:after {

    content: '\002B';

    color: #777;

    font-weight: bold;

    float: right;

    margin-left: 5px;

  }

  
@media only screen and (max-width: 600px) {

  .kurumsalimg img{

    width:300px;

  }

}


/* contact us css starts here */

@import url('https://fonts.googleapis.com/css?family=Livvic&display=swap');

.contact-title{

  background-color: darkcyan;

  font-family: 'Livvic', sans-serif;

}


.contact-title .container h3{

  font-family: 'Livvic', sans-serif;

 padding:2%;

 color:white;

}


.contact-center p{

  font-family: 'Livvic', sans-serif;

  font-size: 20px;

}


.hr-height{

  height:100px;

  width: 3px;

}


@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro&display=swap');


.ik-card{

  padding:20px;

  margin:30px;

}

.ik-card-title{

  font-family: 'Source Sans Pro', sans-serif;

  color:grey;

}


.bg-colorr{

  background-color:#00b3b2;

}


.cv-upload input{

  background-color:#00b3b2;

}


/* contact us css eds here */


/* corporate css starts here */


@import url('https://fonts.googleapis.com/css?family=Oswald&display=swap');

@import url('https://fonts.googleapis.com/css?family=Anton&display=swap');


.kurumsal-hakkimizda{

    padding:10px;

    font-family: 'Mitr', sans-serif;

}


.hakkimizda-text{

    padding-top:100px;

    font-family: 'Mitr', sans-serif;

}


.hakkimizda-title{

  font-family: 'Mitr', sans-serif;

    color:grey;

    
}

/* corporate css eds here */


/* products */


/* searchbox */


.navbar {

  overflow: visible;

  background: rgb(65, 66, 66);

  z-index:60;

  border-bottom:2px solid white;


}


.navbar a {

  display: block;

  padding: 14px 10px;

  color: #fff;

  text-align: center;

  text-decoration: none;

  font-size:15px;

  margin-bottom:5px;

}


.navbar .active {}/* hover yapıldığında açık olan link değişecek şekli  etc background-color:black;*/


.navbar ul {

  max-width: 100%;

  margin: 0 auto;

  overflow: hidden;

}


.navbar ul li {

  float: left;

  list-style: none;

}


.navbar ul li .fa { padding-left: 4px; }


.navbar .altmenu {

  display: none;

  width: 100%;

  padding: 5px 0;

  position: absolute;

  left: 0;

  right: 0;

  top: inherit;

  background: #474747;

  z-index: 7;

  overflow: hidden;

}


.navbar>ul>li.active {  }/* hover yapıldığında açık olan link değişecek şekli  etc background-color:black;*/

 @media only screen and (min-width: 991px) {


#mobilmenuac { display: none;  }


#mobilmenu { display: block !important; }


.mobilmenubg { display: none !important; }

}

@media screen and (max-width: 990px) {


.navbar ul li { float: none;

  border-bottom:1px solid #1C93CE; margin-bottom:5px; }


.navbar>ul>li { border-bottom: 1px solid #1C93CE;padding-bottom:5px; }


.navbar>ul>li>a { padding: 10px; padding-bottom:5px; margin-bottom:5px; }


.navbar .altmenu {

  position: static;

  background: #474747;

}


#mobilmenuac {

  display: block;

  padding: 14px 10px;

  width: 100%;

  background:#474747;

  
}

.logocenter{

  margin-top:-30px;

}

#mobilmenuac span {

  height: 7px;

  display: block;

  border: 1px solid white;

  padding:10px;

  border-width: 5px 0;

  width:6%;

}

#mobilmenuac span img{

  margin-top:-30px;

}


#mobilmenu {

  display: none;

  width: 85%;

  position: fixed;

  top: 0;

  left: -200px;

  height: 100%;

  z-index: 999999;

  overflow-y: auto;

}


.mobilmenubg {

  display: none;

  position: fixed;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  background: rgba(0,0,0,0.6);

  z-index: 9998;

}

}


h1 { margin:30px auto; text-align:center;}


.navbar li a.li-1:hover {

  -webkit-box-shadow: inset 27px 30px 85px -70px rgb(255, 255, 255);

-moz-box-shadow: inset 27px 30px 85px -70px rgb(255, 255, 255);

box-shadow: inset 27px 30px 85px -70px rgb(250, 245, 245);

background-color:#00b3b2;

opacity:1;

color:white;

border-radius: 5px;

}


.navbar li a.li-2:hover {

  -webkit-box-shadow: inset 27px 30px 85px -70px rgb(255, 255, 255);

-moz-box-shadow: inset 27px 30px 85px -70px rgb(255, 255, 255);

box-shadow: inset 27px 30px 85px -70px rgb(250, 245, 245);

background-color:#00b3b2;

opacity:1;

color:white;

border-radius: 5px;

}

.navbar li a.on-odeme-navbar:hover {

  -webkit-box-shadow: inset 27px 30px 85px -70px rgb(255, 255, 255);

-moz-box-shadow: inset 27px 30px 85px -70px rgb(255, 255, 255);

box-shadow: inset 27px 30px 85px -70px rgb(250, 245, 245);

background-color:rgb(26, 141, 22);

opacity:1;

color:white;

}


.min-width-200{

  min-width:200%;

}


.urun-resim-border{

  border-right:3px solid #00b3b2; 

}

.div-row-border{

  margin-bottom: 3%;

  padding-bottom: 5%;

  border-bottom:3px solid #00b3b2; 

}

.urun-marka{

  font-weight: 600;

  font-size:20px;

  font-family: 'Mitr', sans-serif;

}

.geri-tusu{

  background-color: #00b3b2;

  width: 50px;

  height: 50px;

  border-radius:20px;

  float:right;

  margin-top:-10%;


}

.geri-tusu:hover{

  background-color: #2c292f;

  cursor: pointer;


}

table{

  border:3px solid #00b3b2;

  min-width: 50%;

  padding:1%;

  max-width:1150px;

  overflow: scroll;

}

table tr td{

  padding:1%;

}

table th{

  background-color: #00b3b2;

  text-align: center;

}