:root {
  --bs-secondary: #701335!important;
  --bs-success: #124039!important;
  --bs-info: #77aa00!important;
  --bs-danger: rgba(194,4,136,1)!important;
  --heightA: 250px;
  --heightB: calc(var(--heightA) * 2);
  /*--heightC: calc(var(--heightB) + 25px);*/
  /*--widthA: 250px;*/
  /*--widthB: calc(var(--widthA) * 2);*/
  /*--widthC: calc(var(--widthB) + 5px);*/
}

@media (min-width: 300px) and (max-width: 991px) {
  :root {
    --heightC: 250px;
  }
}

@media (min-width: 992px) {
  :root {
    --heightC: calc(var(--heightB) + 25px);
  }
}

::selection {
  background: var(--bs-primary);
  color: white;
}

a {
  transition: .3s ease;
}

.c-1 {
  position: relative;
  z-index: 2;
}

.sewing-kepforras div, .sewing-kepforras2 div, .sewing-kepforras3 div {
  transition: transform 1.0s;
}

.sewing-kepforras:hover div, .sewing-kepforras2:hover div, .sewing-kepforras3:hover div {
  transform: scale(1.2);
  transition: transform 1.0s;
}

.sewing-kep .logo {
  width: 100px;
  position: absolute;
  right: -58px;
  top: 160px;
  z-index: 2;
}

.sewing-kep .feher-karika {
  width: 105px;
  height: 105px;
  position: absolute;
  right: -60px;
  top: 156px;
  z-index: 2;
  background: white;
  border-radius: 50%;
}

.sewing-kepforras {
  width: 100%;
  height: 680px;
}

.sewing-kepforras2 {
  position: absolute;
  bottom: -90px;
  right: -40px;
  width: 390px;
  height: 195px;
  overflow: hidden;
}

.sewing-kepforras3 {
  position: absolute;
  top: -55px;
  right: -45px;
  width: 195px;
  height: 120px;
  overflow: hidden;
}

.sewing-kepforras div {
  background: url('services_nagykep.jpg');
  width: 100%;
  height: 100%;
  background-position: right top;
}

.sewing-kepforras2 div {
  background: url('services_kiskep.jpg') center / cover;
  width: 100%;
  height: 100%;
}

.sewing-kepforras3 div {
  background: url('services_kisebbkep.jpg') center / cover;
  width: 100%;
  height: 100%;
}

.sewing-kep-keret2 {
  position: absolute;
  bottom: -85px;
  right: -50px;
  width: 340px;
  height: 200px;
  border: 1px dashed #77aa00;
  z-index: -1;
}

.sewing-kep-keret3 {
  position: absolute;
  top: -65px;
  right: -55px;
  width: 195px;
  height: 120px;
  border: 1px dashed #77aa00;
  z-index: -1;
}

.references {
  line-height: 0;
  text-align: center;
  color: var(--bs-primary);
}

.references span {
  display: inline-block;
  position: relative;
}

.references span:before, .references span:after {
  content: "";
  position: absolute;
  height: 5px;
  border-bottom: 1px solid rgba(0,0,0,0.2);
  border-top: 1px solid rgba(0,0,0,0.2);
  top: 0;
  width: 35vw;
}

@media (min-width: 300px) and (max-width: 767px) {
  .references span:before, .references span:after {
    /*content: "";*/
    /*position: absolute;*/
    /*height: 5px;*/
    /*border-bottom: 1px solid black;*/
    /*border-top: 1px solid black;*/
    /*top: 0;*/
    width: 0;
  }
}

@media (min-width: 992px) {
  .references span:before, .references span:after {
    /*content: "";*/
    /*position: absolute;*/
    /*height: 5px;*/
    /*border-bottom: 1px solid black;*/
    /*border-top: 1px solid black;*/
    /*top: 0;*/
    width: 35vw;
  }
}

.references span:before {
  right: 100%;
  margin-right: 15px;
}

.references span:after {
  left: 100%;
  margin-left: 15px;
}

.table > :not(caption) > * > * {
  padding: 10px !important;
}

.bg::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: inherit;
  background-size: cover;
  transform-origin: center;
  transition: transform 0.4s ease-in-out;
  overflow: hidden;
}

.bg:hover::after {
  overflow: hidden;
  transform: scale(1.1);
}

.dark-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 1;
  transition: background .25s;
  background: rgba(0,0,0,0.1);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}

@media (min-width: 300px) and (max-width: 767px) {
  .tabla td .dark-overlay span {
    font-size: 12pt;
  }
}

@media (min-width: 992px) {
  .dark-overlay span {
    font-size: 14pt;
  }
}

.dark-overlay span {
  /*text-shadow: 1px 1px 3px black;*/
  position: absolute;
  z-index: 3;
  font-family: 'Libre Baskerville';
  /*font-size: 14pt;*/
  background-color: var(--bs-dark);
  bottom: 0px;
  left: 0px;
}

.navbar .navbar-nav img {
  width: 35px;
}

.navbar .navbar-nav .nav-item a:hover {
  color: var(--bs-primary)!important;
  transition: .3s ease;
}

.navbar .navbar-nav .nav-item a {
  transition: .3s ease;
  /*border-bottom: 3px solid transparent;*/
}

@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes rotating-inverse {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(-360deg);
    -moz-transform: rotate(-360deg);
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}

.rotating {
  -webkit-animation: rotating 10s linear infinite;
  -moz-animation: rotating 10s linear infinite;
  -ms-animation: rotating 10s linear infinite;
  animation: rotating 10s linear infinite;
}

.rotating-inverse {
  -webkit-animation: rotating-inverse 15s linear infinite;
  -moz-animation: rotating-inverse 15s linear infinite;
  -ms-animation: rotating-inverse 15s linear infinite;
  animation: rotating-inverse 15s linear infinite;
}

.fejlec-mobil {
  width: 100%;
  height: 80vh;
  background: linear-gradient(rgba(0,0,0,.5), rgba(0,0,0,.5)), url('sewing-thread-and-buttons-PKYLTLH.jpg');
  background-position: center;
  background-size: cover;
}

.fejlec-mobil h1 {
  color: white;
  text-shadow: 0px 3px 5px rgba(0, 0, 0, 1);
}

.fejlec-mobil img {
  width: 120px;
}

.fejlec-mobil .felsoresz {
  background: rgba(255,255,255,0.65);
}

.fejlec-mobil .cim {
  margin-top: 55px;
}

.navbar-toggler:hover, .navbar-toggler:focus {
  outline: none!important;
  box-shadow: none!important;
}

.features i, .features img {
  /*border: 1px solid;*/
  /*padding: 4px;*/
}

.bemutatkozo-szoveg {
  font-size: 13pt;
}

.form-control:focus {
  box-shadow: none !important;
  border-color: var(--bs-primary) !important;
}

.item.adatvedelem a {
  border-bottom: 1px solid transparent!important;
  padding: 5px;
}

.item.adatvedelem a:hover {
  border-bottom: 1px solid white!important;
}

#references table {
  overflow-x: hidden;
}

.icon-mobile {
  filter: invert(11%) sepia(89%) saturate(2300%) hue-rotate(319deg) brightness(90%) contrast(97%);
}

.proud {
  width: 100%;
  height: 340px;
  background: linear-gradient(rgba(0,0,0,.7), rgba(0,0,0,.7)), url('sewing-machine-presser-foot-PSC44M3.jpg');
  background-size: 100%;
  background-attachment: fixed;
  color: white;
  text-shadow: 0px 3px 5px black;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
}

@media (min-width: 300px) {
  .proud {
    background-attachment: scroll;
  }
}

@media (min-width: 768px) {
  .proud {
    background-attachment: fixed;
  }
}

.proud .horizontal_dashed_line_top {
  width: 100%;
  height: 1px;
  background: repeating-linear-gradient(to right,#F42D3E 0, #F42D3E 10px,transparent 10px,transparent 12px);
  position: absolute;
  top: 10px;
  left: 0;
  z-index: 1;
}

.proud .horizontal_dashed_line_bottom {
  width: 100%;
  height: 1px;
  background: repeating-linear-gradient(to right,#F42D3E 0, #F42D3E 10px,transparent 10px,transparent 12px);
  position: absolute;
  bottom: 10px;
  left: 0;
  z-index: 1;
}

.kiemeles {
  background: var(--bs-primary);
}

.kiemeles2 {
  background: var(--bs-secondary);
}

