@charset "utf-8";

/*HORIZONTAL*/
.gradient-line-black-dashed{
    height: 1px; width:100%;  background-image: repeating-linear-gradient(
 to right,
    black,
    black 1px,
    transparent 2px,
    transparent 3px,
    
    orange 1px,
    orange 2px,
    transparent 3px,
    transparent 4px,
    
    black 1px,
    black 2px,
    transparent 3px,
    transparent 4px
  );
}
.gradient-line-black-dashed-style2 {
  height: 4px;
  width: 100%;
  background: linear-gradient(to right, black, transparent);
  -webkit-mask-image: repeating-linear-gradient(
    to right,
    black 0 10px,
    transparent 10px 20px
  );
  mask-image: repeating-linear-gradient(
    to right,
    black 0 10px,
    transparent 10px 20px
  );
}
.gradient-line-black-dashed-style3 {
  height: 1px;
  width: 100%;
  background: linear-gradient(
    to right,
    transparent,
    white 50%,
    transparent
  );
  -webkit-mask-image: repeating-linear-gradient(
    to right,
    black 0 2px,
    transparent 2px 4px
  );
  mask-image: repeating-linear-gradient(
    to right,
    black 0 2px,
    transparent 2px 4px
  );
}

/*VERTICAL*/
.vertical-dashed-line-with-dot {
  width: 2px;
  height: 32px;
  background: whitesmoke;
  background: repeating-linear-gradient(
    to bottom,
    whitesmoke 0px 2px,
    transparent 2px 4px
  );
  position: relative;
  margin: 0px;
}

.dashed-circle {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translate(-50%, 0);
}

.dashed-gradient-border { padding: 20px;
  background-image: repeating-linear-gradient(
    -45deg,
    rgba(60, 59, 110, 1) 0px,
    rgba(60, 59, 110, 1) 40px,         /* mavi 10px */
    transparent 40px,
    transparent 80px,                   /* boşluk 10px */
    rgba(178, 34, 52, 1) 80px,
    rgba(178, 34, 52, 1) 120px,         /* kırmızı 10px */
    transparent 120px,
    transparent 160px                   /* boşluk 10px */
  );
  
background-size: auto;/* veya hiç yazma */
  /*animation: dashShift  6s ease-in-out infinite;*/
  /*opacity: 1;*/
}

@keyframes dashShift {
  0% {

/*background-size: 100% 100%;*/ opacity: 0;
  }

  50% {

/*background-size: 110% 110%;*/ opacity: 1;
  }

    100% {

/*background-size: 100% 100%;*/ opacity: 0;
  }
}

.letter_style_contact_form{
    border: 10px solid rgba(0, 0, 255, .8);
  border-image: repeating-linear-gradient( -45deg, rgba(0, 0, 255, .8), rgba(0, 0, 255, .8) 5px, transparent 6px, transparent 10px, rgba(255, 0, 0, .8) 11px, rgba(255, 0, 0, .8) 15px, transparent 16px, transparent 20px) 12/10px;
}