@import url('_variables.css');

@import url('_scrollbar.css');



html {

  overflow-y: scroll !important;

  scroll-behavior: smooth;

  background: transparent;

  border: 0;

  margin: 0;

  outline: none;

  padding: 0;

  vertical-align: baseline;

  font-size: 14px;

}



body {

  font-family: -apple-system, BlinkMacSystemFont, "Josefin Sans", "Segoe UI",

    Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji",

    "Segoe UI Emoji", "Segoe UI Symbol";

  font-size: 1rem;

  font-weight: 300;

  line-height: 1.5;

  text-align: center;

  letter-spacing: 0;

  text-transform: none;

  color: #ffffff;

  background-color: #0b1315;

  -webkit-font-smoothing: antialiased;

  overflow-x: hidden !important;

}



a {

  color: #fff;

  list-style: none;

  text-decoration: none;

  -webkit-transition: color 0.2s ease-out;

  -o-transition: color 0.2s ease-out;

  transition: color 0.2s ease-out;

  cursor: pointer;

}



h1 {

  display: block;

  font-size: 1.4em;

  margin-block-start: 0em;

  margin-block-end: 0em;

  margin-inline-start: 0px;

  margin-inline-end: 0px;

  font-weight: bold;

  text-transform: uppercase;

  color: #c9ab81;

}



img {

  max-width: 100%;

}



.clearfix:before,

.clearfix:after {

  content: " ";

  display: table;

}



.clearfix:after {

  clear: both;

}



.clearfix {

  zoom: 1;

}



/* =========  Back to Top styles - start */

.container {

  /* width: 100vw; */

}



.back_to_top {

  position: fixed;

  right: 33px;

  bottom: 33px;

  margin: 0;

  z-index: 10000;

  opacity: 0;

  visibility: hidden;

}



.go_top_on {

  opacity: 1;

  visibility: visible;

  -webkit-transition: opacity 0.3s ease;

  -o-transition: opacity 0.3s ease;

  transition: opacity 0.3s ease;

}



.back_to_top svg circle {

  stroke-width: 1.4;

}



.back_to_top svg circle.popout {

  stroke-dashoffset: 101;

  stroke-dasharray: 101;

  stroke-linejoin: round;

  stroke-miterlimit: 10;

  stroke-linecap: butt;

  -webkit-transform: rotate(-90deg);

  -ms-transform: rotate(-90deg);

  transform: rotate(-90deg);

  -webkit-transform-origin: center;

  -ms-transform-origin: center;

  transform-origin: center;

  -webkit-transition: all 0.7s ease;

  -o-transition: all 0.7s ease;

  transition: all 0.7s ease;

}



.back_to_top svg polyline {

  stroke-width: 1.4;

}



.back_to_top:hover .popout {

  stroke-dashoffset: 0;

  stroke-dasharray: 101;

  -webkit-transition: all 0.7s ease;

  -o-transition: all 0.7s ease;

  transition: all 0.7s ease;

}



/* ===========  #Back to Top styles - end */



/* mobile menu =================== HEADER */

.benito_container {

  width: 100%;

  top: 0;

}



.benito-container:before {

  content: " ";

}



.benito-container:after {

  clear: both;

  content: " ";

}



.mobile {

  display: none;

}



.side_container {

  display: none;

}





.mobile {

  display: contents;

}



.mobile_menu_header {

  display: flex;

  flex-basis: 100%;

  align-items: center;

  padding: 0 10px;

  box-sizing: border-box;

}



.mobile_logo {

  margin: auto;

}



.mobile_gallery {

  margin-left: auto;

  margin-top: 2em;

}



.mobile_gallery_button {

  position: absolute;

  font-weight: 600;

  margin-top: 1.5em;

  margin-left: auto;

  margin-right: auto;

  width: 100px;

}



.mobile_gallery_button span {

  padding-inline: 6px;

}



.hamburger_icon {

  cursor: pointer;

  margin-top: 0em;

  margin-right: 1em;

  padding: 0!important;

  cursor: pointer;

  z-index: 100;

  min-height: 44px;

  min-width: 44px;

  display: flex;

  align-items: center;

  justify-content: center;

}



.mobile_logo img {

  width: 60px;

  height: 60px;

  box-shadow: 1px 1px 6px rgba(201, 171, 129, 0.4),

    14px 14px 14px rgba(0, 0, 0, 0.7);

}



.hamburger_icon_svg {

  width: 37px;

  height: 25px;

  fill: none;

  color: #c9ab81;

}



.hamburger_icon_svg line {

  fill: none;

  stroke: currentColor;

}



.lanauge {

  display: flex;

  flex-direction: column;

  gap: 10px;

  width: auto;

  padding-top: 10px;

}



.lanauge button {

  padding: 5px 20px !important;

  margin-bottom: 0;

  width: 60px !important;

  min-width: 25% !important;

  border-radius: 20px;

}



/* mobile menu ========= NAV MOBILE BOX */

.nav_mobile_box {

  background: #0f1d22;

  padding: 5% 10%;

  display: none;

}



.mobile_menu_active {

  display: block;

}



.mobile_relative {

  position: relative;

}



.mobile_taskak li {

  position: relative;

}



.nav_mobile_box>li>a {

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

  display: flex;

  justify-content: left;

  text-transform: uppercase;

  color: #c9ab81;

  font-size: 1.1rem;

  font-weight: 900;

  letter-spacing: 0.1em;

  padding: 10px 0px;

}



/* menü elemek aláhúzása aktív és hover eseményre */

a .mobile_hover {

  position: relative;

}



/* border-top lesz az aláhúzás és balra 0-ra kicsinyitve*/

a .mobile_hover:before,

a .mobile_hover:after {

  content: "";

  display: block;

  position: absolute;

  left: -0.5%;

  bottom: -0.5em;

  width: 97%;

  height: 1px;

  border-top: 1px solid #c9ab81;

  -webkit-transform: scale(0, 1);

  -ms-transform: scale(0, 1);

  transform: scale(0, 1);

  -webkit-transform-origin: 0 50%;

  -ms-transform-origin: 0 50%;

  transform-origin: 0 50%;

  -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: -webkit-transform 0.8s cubic-bezier(0.28, 0.38, 0, 0.81);

  -o-transition: transform 0.8s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: transform 0.8s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: transform 0.8s cubic-bezier(0.28, 0.38, 0, 0.81),

    -webkit-transform 0.8s cubic-bezier(0.28, 0.38, 0, 0.81);

}



/* hoverre a lekicsinyített aláhúzást vissza állítja 1-re */

a:hover .mobile_hover:before,

a:hover .mobile_hover:after {

  -webkit-transform: scale(1, 1);

  -ms-transform: scale(1, 1);

  transform: scale(1, 1);

  -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: -webkit-transform 0.8s cubic-bezier(0.28, 0.38, 0, 0.81);

  -o-transition: transform 0.8s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: transform 0.8s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: transform 0.8s cubic-bezier(0.28, 0.38, 0, 0.81),

    -webkit-transform 0.8s cubic-bezier(0.28, 0.38, 0, 0.81);

}



/*  4px feltolja az aláhúzást és lgyorsabb mint az alsó */

a .mobile_hover:after,

a:hover .mobile_hover:after {

  padding-bottom: 4px;

  -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: -webkit-transform 0.4s cubic-bezier(0.28, 0.38, 0, 0.81);

  -o-transition: transform 0.4s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: transform 0.4s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: transform 0.4s cubic-bezier(0.28, 0.38, 0, 0.81),

    -webkit-transform 0.4s cubic-bezier(0.28, 0.38, 0, 0.81);

}



/* === aláhuzza a aktuális oldal linkjét kell hozzá a java */

.mobile_active {

  position: relative;

}



.mobile_active:before,

.mobile_active:after {

  content: "";

  display: block;

  position: absolute;

  left: -0.5%;

  bottom: -0.5em;

  width: 97%;

  height: 1px;

  border-top: 1px solid #c9ab81;

}



/*  4px feltolja az aláhúzást */

.mobile_active:after {

  padding-bottom: 4px;

}



/* Updated mobile navigation category styles */

.mobile_category > a {

  font-weight: 600;

  color: #c9ab81;

  position: relative;

}



.mobile_category > a:before {

  content: "";

  margin-right: 8px;

  font-size: 0.9em;

}



/* Mobile subcategory styling */

.mobile_sub_category {

  padding: 12px 0 8px 0;

  border-bottom: 1px solid #3a474f;

  margin-bottom: 8px;

  pointer-events: none;

}



.mobile_sub_category span {

  color: #c9ab81;

  font-size: 0.9rem;

  font-weight: 600;

  text-transform: uppercase;

  letter-spacing: 0.1em;

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

}



.mobile_taskak,

.mobile_penztarcak,

.mobile_handbags,

.mobile_backpacks,

.mobile_wallets,

.mobile_dog_show,

.mobile_special {

  position: relative;

}



.mobile_arrow {

  position: absolute;

  top: 0;

  right: 0;

  width: 50px;

  height: auto;

  padding: 11px 0;

  line-height: inherit;

  text-align: right;

  box-sizing: border-box;

}



.mobile_arrow_svg {

  position: absolute;

  top: 10px;

  right: 0;

  width: 12px;

  height: 12px;

  display: inline-block;

  vertical-align: middle;

  stroke: #c9ab81;

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

  -o-transition: transform 0.3s ease;

  transition: transform 0.3s ease;

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

}



.mobile_arrow_svg_roate {

  -webkit-transform: rotate(90deg);

  -ms-transform: rotate(90deg);

  transform: rotate(90deg);

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

  -o-transition: transform 0.3s ease;

  transition: transform 0.3s ease;

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

}



/* mobile menu ========== NAV SUB MOBILE BOX */

.nav_sub_mobile_box {

  padding-left: 3%;

  display: none;

  background-color: rgba(15, 29, 34, 0.8);

  border-radius: 8px;

  margin: 10px 0;

}



.visuallyhidden {

  transition: all 0.5s linear;

  opacity: 0;

}



.nav_sub_mobile_box>li {

  padding: 5px 0;

  font-size: 1.1rem;

}



.nav_sub_mobile_box>li:not(.mobile_sub_category) {

  padding-left: 15px;

  position: relative;

}



.nav_sub_mobile_box>li:not(.mobile_sub_category):before {

  content: "•";

  position: absolute;

  left: 5px;

  color: #c9ab81;

  font-size: 0.8em;

}



.nav_sub_mobile_box>li a {

  transition: color 0.3s ease, padding-left 0.3s ease;

  display: block;

  padding: 8px 0;

  border-radius: 4px;

}



.nav_sub_mobile_box>li a:hover {

  color: #c9ab81;

  padding-left: 10px;

  background-color: rgba(36, 48, 57, 0.5);

}



.nav_sub_mobile_box>li>a>span {

  letter-spacing: 0.1em;

}



.sub_nav_mobile_box_toggle {

  transition: all 0.3s ease;

  display: block;

  animation: slideDownMobile 0.3s ease-out;

}



@keyframes slideDownMobile {

  from {

    opacity: 0;

    transform: translateY(-10px);

    max-height: 0;

  }

  to {

    opacity: 1;

    transform: translateY(0);

    max-height: 500px;

  }

}



.mobile_arrow {

  min-height: 44px;

  min-width: 44px;

  display: flex;

  align-items: center;

  justify-content: center;

}



/* Accessibility improvements */

@media (prefers-reduced-motion: reduce) {

  .sub_nav_mobile_box_toggle,

  .mobile_search_input,

  .mobile_search_btn {

    transition: none;

    animation: none;

  }

}



/* Mobile Search Interface */

.mobile_search {

  padding: 15px 20px;

  background-color: #0f1d22;

  border-bottom: 1px solid #2d3a42;

}



.mobile_search_container {

  position: relative;

  width: 100%;

}



.mobile_search_input {

  width: 100%;

  padding: 12px 45px 12px 15px;

  font-size: 1rem;

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

  color: #ffffff;

  background-color: #1a2830;

  border: 1px solid #c9ab81;

  border-radius: 25px;

  outline: none;

  transition: all 0.3s ease;

  box-sizing: border-box;

  -webkit-appearance: none;

  -moz-appearance: none;

  appearance: none;

}



.mobile_search_input:focus {

  border-color: #c9ab81;

  box-shadow: 0 0 0 2px rgba(226, 171, 93, 0.2);

  background-color: #243039;

}



.mobile_search_input::placeholder {

  color: #9ca3af;

  font-style: italic;

}



.mobile_search_btn {

  position: absolute;

  right: 8px;

  top: 50%;

  transform: translateY(-50%);

  background: none;

  border: none;

  cursor: pointer;

  padding: 10px;

  color: #c9ab81;

  transition: color 0.3s ease;

  min-height: 44px;

  min-width: 44px;

  display: flex;

  align-items: center;

  justify-content: center;

}



.mobile_search_btn:hover,

.mobile_search_btn:focus {

  color: #c9ab81;

  outline: 2px solid #c9ab81;

  outline-offset: 2px;

}



.mobile_search_results {

  position: absolute;

  top: 100%;

  left: 0;

  right: 0;

  background-color: #1a2830;

  border: 1px solid #c9ab81;

  border-top: none;

  border-radius: 0 0 15px 15px;

  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);

  z-index: 1000;

  max-height: 300px;

  overflow-y: auto;

}



.mobile_search_results .search_result_item {

  padding: 15px 20px;

  cursor: pointer;

  transition: background-color 0.2s ease;

  border-bottom: 1px solid #2d3a42;

  min-height: 44px;

  display: flex;

  align-items: center;

}



.mobile_search_results .search_result_item:last-child {

  border-bottom: none;

}



.mobile_search_results .search_result_item:hover,

.mobile_search_results .search_result_item.selected {

  background-color: #243039;

}



.mobile_search_results .search_result_item a {

  display: block;

  color: inherit;

  text-decoration: none;

  width: 100%;

}



.mobile_search_results .search_result_content {

  display: flex;

  flex-direction: column;

  gap: 4px;

}



.mobile_search_results .search_result_name {

  color: #ffffff;

  font-weight: 600;

  font-size: 1rem;

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

  text-transform: uppercase;

  letter-spacing: 0.1em;

}



.mobile_search_results .search_result_category {

  color: #c9ab81;

  font-size: 0.85rem;

  font-weight: 300;

}



.mobile_search_results .search_no_results {

  padding: 20px;

  text-align: center;

  color: #9ca3af;

  font-style: italic;

}



/* =========================== MOBILE TOUCH ENHANCEMENTS */

.touch-device .touch-active {

  background-color: rgba(201, 171, 129, 0.2) !important;

  transform: scale(0.98);

  transition: all 0.1s ease;

}



.touch-device .btn-touch-active {

  background-color: rgba(201, 171, 129, 0.3) !important;

  transform: scale(0.96);

}



.touch-device .form-group-focused {

  background-color: rgba(201, 171, 129, 0.05);

  border-radius: 4px;

  padding: 8px;

  margin: -8px;

}



.touch-device .mobile-enhanced {

  transform: scale(1.1);

  transition: transform 0.2s ease;

}



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





  .touch-device .mobile_arrow {

    min-height: 44px;

    min-width: 44px;

    display: flex;

    align-items: center;

    justify-content: center;

  }



  .touch-device .hamburger_icon {

    min-height: 44px;

    min-width: 44px;

    padding: 8px;

  }

}



/* MENU ============================ END */



/* ======================== Button begin */

.side_gallery {

  padding-inline: 10px;

}



.benito_btn_outline {

  position: relative;

  display: inline-block;

  width: 100%;

  padding: 5px 0px;

  color: #ffffff;

  vertical-align: middle;

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

  font-size: 14px;

  font-weight: 300;

  letter-spacing: 0.36em;

  text-align: center;

  text-transform: uppercase;

  cursor: pointer;

  background-color: #0f1d22;

  border: 1px solid #c9ab81;

  box-shadow: 6px 6px 10px rgba(0, 0, 0, 0.7);

}



.benito_btn_outline:before,

.benito_btn_outline:after {

  content: "";

  display: flex;

  position: absolute;

  -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: -webkit-transform 0.5s cubic-bezier(0.28, 0.38, 0, 0.81);

  -o-transition: transform 0.5s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: transform 0.5s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: transform 0.5s cubic-bezier(0.28, 0.38, 0, 0.81),

    -webkit-transform 0.5s linear-bezier(0.28, 0.38, 0, 0.81);

}



.benito_btn_outline:before {

  left: 50px;

  top: -1px;

  width: 53px;

  border-top: 1px solid #c9ab81;

  -webkit-transform: rotate(160deg) scale(0, 1);

  -ms-transform: rotate(160deg) scale(0, 1);

  transform: rotate(160) scale(0, 1);

  -webkit-transform-origin: 0 50%;

  -ms-transform-origin: 0 50%;

  transform-origin: 0 50%;

}



.benito_btn_outline:after {

  right: -3px;

  bottom: -1px;

  width: 53px;

  border-top: 1px solid #c9ab81;

  -webkit-transform: rotate(-20deg) scale(0, 1);

  -ms-transform: rotate(-20deg) scale(0, 1);

  transform: rotate(-20deg) scale(0, 1);

  -webkit-transform-origin: 0 50%;

  -ms-transform-origin: 0 50%;

  transform-origin: 0 50%;

}



.benito_btn_outline:hover:before,

.benito_btn_outline:hover:after {

  -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: -webkit-transform 0.5s cubic-bezier(0.28, 0.38, 0, 0.81);

  -o-transition: transform 0.5s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: transform 0.5s cubic-bezier(0.28, 0.38, 0, 0.81);

  transition: transform 0.5s cubic-bezier(0.28, 0.38, 0, 0.81),

    -webkit-transform all 0.5s cubic-bezier(0.28, 0.38, 0, 0.81);

}



.benito_btn_outline:hover:before {

  -webkit-transform: rotate(160deg) scale(1, 1);

  -ms-transform: rotate(160deg) scale(1, 1);

  transform: rotate(160deg) scale(1, 1);

}



.benito_btn_outline:hover:after {

  -webkit-transform: rotate(-20deg) scale(1, 1);

  -ms-transform: rotate(-20deg) scale(1, 1);

  transform: rotate(-20deg) scale(1, 1);

}



/* BUTTON =========================== END */



.benito:silder {

  position: absolute;

}



.content {

  padding: 0;

}



.benito_main_text_box {

  text-align: center;

  display: flex;

  flex-direction: column;

  margin-top: 10px;

}



.main_text {

  font-family: mrs saint delafield;

  font-size: 10rem;

  color: #c9ab81;

}



.benito_text {

  display: flex;

  justify-content: center;

  font-size: 9rem;

}



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



  .benito_text,

  span.main_text {

    font-size: 5rem;

  }



  .benito_main_text_box .main_text_h1,

  .main_text_box .main_text_h1 {

    margin-top: -30px;

    opacity: .7;

    font-size: .8em;

  }

}



.prev_next {

  position: relative;

  width: 100%;

  height: 50px;

}



.prev,

.next {

  position: absolute;

}



.prev_btn h4,

.next_btn h4 {

  position: absolute;

  top: -7px;

  color: #c9ab81;

  font-weight: 300;

}



.prev_btn h4 {

  left: 35px;

}



.next_btn h4 {

  right: 35px;

}



.prev a,

.next a {

  background-color: transparent;

  background-repeat: no-repeat;

  border: none;

  cursor: pointer;

  overflow: hidden;

  outline: none;

}



.prev a:hover h4,

.next a:hover h4 {

  font-weight: 400;

}



.prev a svg,

.next a svg {

  stroke: #c9ab81;

  stroke-width: 2px;

}



.prev a svg .popout {

  stroke-dashoffset: 43;

  stroke-dasharray: 43;

  stroke-linejoin: round;

  stroke-miterlimit: 10;

  stroke-linecap: butt;

  -webkit-transform: rotateX(180deg);

  transform: rotateX(180deg);

  -webkit-transform-origin: center center;

  -ms-transform-origin: center center;

  transform-origin: center center;

  -webkit-transition: stroke-dashoffset 0.5s cubic-bezier(0.48, 0.57, 0.33, 0.89);

  -o-transition: stroke-dashoffset 0.5s cubic-bezier(0.48, 0.57, 0.33, 0.89);

  transition: stroke-dashoffset 0.5s cubic-bezier(0.48, 0.57, 0.33, 0.89);

}



.prev a:hover svg .popout {

  -webkit-transform: translateX(0) rotateX(180deg);

  transform: translateX(0) rotateX(180deg);

  stroke-dashoffset: 0;

  stroke-dasharray: 43;

  -webkit-transition: stroke-dashoffset 0.5s cubic-bezier(0.48, 0.57, 0.33, 0.89);

  -o-transition: stroke-dashoffset 0.5s cubic-bezier(0.48, 0.57, 0.33, 0.89);

  transition: stroke-dashoffset 0.5s cubic-bezier(0.48, 0.57, 0.33, 0.89);

}



.next {

  right: 0;

}



a svg .popout {

  stroke-dashoffset: 43;

  stroke-dasharray: 43;

  stroke-linejoin: round;

  stroke-miterlimit: 10;

  stroke-linecap: butt;

  -webkit-transform: rotateX(180deg);

  transform: rotateX(180deg);

  -webkit-transform-origin: center center;

  -ms-transform-origin: center center;

  transform-origin: center center;

  -webkit-transition: stroke-dashoffset 0.5s cubic-bezier(0.48, 0.57, 0.33, 0.89);

  -o-transition: stroke-dashoffset 0.5s cubic-bezier(0.48, 0.57, 0.33, 0.89);

  transition: stroke-dashoffset 0.5s cubic-bezier(0.48, 0.57, 0.33, 0.89);

}



.next a:hover svg .popout {

  -webkit-transform: translateX(0) rotateX(180deg);

  transform: translateX(0) rotateX(180deg);

  stroke-dashoffset: 0;

  stroke-dasharray: 43;

  -webkit-transition: stroke-dashoffset 0.5s cubic-bezier(0.48, 0.57, 0.33, 0.89);

  -o-transition: stroke-dashoffset 0.5s cubic-bezier(0.48, 0.57, 0.33, 0.89);

  transition: stroke-dashoffset 0.5s cubic-bezier(0.48, 0.57, 0.33, 0.89);

}



.circle_btn {

  position: absolute;

  top: calc(0% + 7px);

  left: calc(50% - 10px);

  cursor: pointer;

}



.circle_btn a {

  position: relative;

  display: flex;

  -ms-flex-wrap: wrap;

  flex-wrap: wrap;

  width: 30px;

  vertical-align: middle;

  cursor: pointer;

}



.circle_btn a div {

  width: 11px;

  height: 12px;

  border-radius: 50%;

  border: 1px solid #c9ab81;

  -webkit-box-sizing: border-box;

  box-sizing: border-box;

}



.circle_btn a div:nth-of-type(2n + 1) {

  margin-right: 8px;

}



.circle_btn a div:first-of-type {

  margin-bottom: 8px;

}





.main_text_h1 {

  display: flex;

  justify-content: center;

  letter-spacing: 2px;

  margin-top: -4.5rem;

  opacity: .7;

}



.content_comment_btn {

  font-weight: 300;

  display: flex;

  margin-right: auto;

  margin-bottom: 5%;

  margin-left: auto;

  align-items: center;

  position: relative;

  display: inline-block;

  width: 100%;

  padding: 5px 0px;

  color: #ffffff;

  vertical-align: middle;

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

  font-size: 14px;

  font-weight: 300;

  letter-spacing: 0.36em;

  text-align: center;

  text-transform: uppercase;

  cursor: pointer;

  background-color: #0f1d22;

  border: 1px solid #c9ab81;

  box-shadow: 6px 6px 10px rgba(0, 0, 0, 0.7);

}



.content_comment_btn a {

  margin-left: auto;

  margin-right: auto;

}



/* =============================== CONTENTEK */

.index_content {

  width: 100%;

  margin-top: 20px;

}



.index_content_inner {

  display: flex;

  margin-bottom: 20px;

}



.index_con_left {

  top: 0;

  left: 0;

  font-size: 20px;

  width: 50%;

}



.index_hand_made {

  display: flex;

  justify-content: center;

  font-family: Miniver, sans-serif;

  font-weight: 400;

  line-height: 28px;

  letter-spacing: 0.1em;

  text-transform: none;

  -webkit-font-smoothing: antialiased;

  color: #c9ab81;

  margin: 5% 0 0;

  font-size: 1.2rem;

}



.product_name {

  display: flex;

  justify-content: center;

  align-items: center;

}



.product_name_text {

  font-family: "caviar_dreamsbold", sans-serif;

  font-size: 1.2rem;

  font-weight: 700;

  letter-spacing: 0.3em;

  text-transform: uppercase;

  text-align: center;

  color: #c9ab81;

  margin: 10px 25px;

  -ms-word-wrap: break-word;

  word-wrap: break-word;

}



.product_show {

  display: flex;

  justify-content: center;

}



.product_text {

  display: flex;

  justify-content: center;

  font-family: Miniver, sans-serif;

  font-weight: 400;

  line-height: 28px;

  letter-spacing: 0.1em;

  text-transform: none;

  -webkit-font-smoothing: antialiased;

  color: #c9ab81;

  font-size: 1.2rem;

  margin: -5px 0 25px;

}



.index_con_right {

  position: relative;

  width: auto;

}



.fade {

  -webkit-animation-name: fade;

  -webkit-animation-duration: 1.5s;

  animation-name: fade;

  animation-duration: 1.5s;

  margin-top: 3%;

  margin-right: 3%;

}



@-webkit-keyframes fade {

  from {

    opacity: 0.8;

  }



  to {

    opacity: 1;

  }

}



@keyframes fade {

  from {

    opacity: 0.8;

  }



  to {

    opacity: 1;

  }

}



.product_too {

  position: relative;

  cursor: pointer;

  width: 100%;

  margin-bottom: 3%;

}



.product_too_text {

  position: relative;

  display: flex;

  gap: 20px;

  justify-content: space-evenly;

  align-items: center;

}



.product_too_inner {

  position: relative;

  display: flex;

  justify-content: center;

  gap: 10%;

}



.racs_sub {

  width: 260px;

  z-index: 1;

}



.racs_sub_img {

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  margin: auto;

  width: 260px;

  z-index: 2;

}



.quad {

  position: absolute;

  top: 0;

  z-index: -1;

}



.quad_img {

  -webkit-filter: drop-shadow(15px 15px 6px #000);

  filter: drop-shadow(15px 15px 6px #000);

}



/*  */

/*  */

/*  */

.text_align_center {

  margin-bottom: 0;

  padding-bottom: 0;

  text-align: center;

}



.text_align_center img {

  margin-top: -3rem;

}



.content_text_right .text_align_center span {

  letter-spacing: 0px !important;

}





.text_align_center span {

  letter-spacing: 0px;

}



.text_align_center span {

  margin: auto;

}



.text_align_center span:nth-child(6),

.text_align_center span:nth-child(8),

.text_align_center span:nth-child(10) {

  font-weight: 300;

}



.text_align_center.p_tag p {

  display: inline-block;

  margin: 0;

  padding: 0 10px;

}

#span_ar {

  font-size: 1.2rem;

}



/* =============================  FORM PANEL */

.form_panel {

  width: 100%;

}



.form_decor {

  display: flex;

  gap: 20px;

  justify-content: space-evenly;

  align-items: center;

  height: 25px;

}



.lined_heading {

  font-family: "caviar_dreamsbold", sans-serif;

  font-weight: 400;

  font-size: 1rem;

  letter-spacing: 4px;

  text-transform: uppercase;

  text-align: center;

  color: #c9ab81;

  -ms-word-wrap: break-word;

  word-wrap: break-word;

}



.contactform {

  width: 100%;

}



.personal {

  display: flex;

  width: 100%;

}



.name,

.email,

.comments,

.verify {

  margin-bottom: 20px;

}



.name,

.email {

  display: flex;

  width: 49%;

}



.email {

  left: 2%;

}



.comments,

.verify {

  display: flex;

  width: 100%;

}



input[type="search"],

input[type="text"],

textarea {

  position: relative;

  -webkit-box-sizing: border-box;

  box-sizing: border-box;

  padding: 7px 23px 3px;

  color: #dbdbdb;

  background-color: #0b1315;

  border: 1px solid #715b3e;

  /* border-radius: 0px; */

  font: 300 1.2rem Josefin Sans;

}



input[type="text"] {

  -webkit-appearance: none;

  line-height: calc(50px - (14px - 2px));

  outline: 0;

  cursor: pointer;

}



textarea {

  display: inline-block;

  -webkit-writing-mode: horizontal-tb !important;

  text-rendering: auto;

  letter-spacing: normal;

  word-spacing: normal;

  text-transform: none;

  text-indent: 0px;

  text-align: start;

  appearance: textarea;

  -webkit-rtl-ordering: logical;

  lex-direction: column;

  cursor: text;

  white-space: pre-wrap;

  overflow-wrap: break-word;

  border-image: initial;

  resize: none;

}



input[type="search"],

textarea:focus {

  outline: none;

}



.alert {

  position: relative;

  padding: 0.75rem 1.25rem;

  margin-bottom: 1rem;

  border: 1px solid transparent;

  border-radius: 0.25rem;

}



.alert-danger {

  color: #721c24;

  background-color: #f8d7da;

  border-color: #f5c6cb;

  padding-top: 14px;

  font-size: 1.3rem;

}



.close {

  float: right;

  font-size: 1.7rem;

  font-weight: 700;

  line-height: 1;

  color: #f5c6cb !important;

  text-shadow: 0 1px 0 #fff;

  opacity: 0.7;

}



button.close {

  padding: 0;

  background-color: transparent;

  border: 0;

  -webkit-appearance: none;

  cursor: pointer;

}



/* ================================= FOOTER */

footer {

  margin-top: 60px;

}



.kapcsolat,

.velem,

.telefon,

.footer_social,

.website,

.jog {

  display: flex;

  justify-content: center;

}



.kapcsolat,

.velem,

.telefon {

  font-family: Miniver, sans-serif;

  font-size: 1.6rem;

  font-weight: 400;

  line-height: 28px;

  letter-spacing: 0.04em;

  text-transform: none;

  -webkit-font-smoothing: antialiased;

  color: #c9ab81;

  margin-bottom: 2%;

}



.kapcsolat_span {

  font-size: 3rem;

  margin: 0 20px;

}



.telefon {

  font-size: 1.6rem;

  text-align: center;

}



.footer_social span {

  margin: 0 20px;

}



.website {

  flex-direction: row;

  font-size: 1.4rem;

}



.jog {

  flex-direction: column;

  font-family: Miniver, sans-serif;

  font-size: 1.2rem;

  color: #c9ab81;

  margin-top: 50px;

  text-align: center;

}



.side_social {

  display: flex;

  justify-content: space-evenly;

}



.side_social_face,

.side_social_insta {

  width: 40px;

  height: 40px;

}



.benito_footer_social {

  display: flex;

  justify-content: center;

}



.benito_footer_social .side_social_face,

.benito_footer_social .side_social_insta {

  margin: 0 10px;

}



/* =============================================================  MODAL */

.fade {

  opacity: 1;

  transition: opacity 0.15s linear;

}



.fade.show {

  opacity: 0;

}



.btn_benito_close,

.btn_benito_close2 {

  float: right;

  font-size: 1.2rem;

  font-weight: 300;

  letter-spacing: 1px;

  line-height: 1;

  color: #c9ab81;

  background-color: #6c757d;

  border: 1px solid #c9ab81;

  border-radius: 5px;

  padding: 8px 16px;

  margin-left: 40px;

  box-shadow: 6px 6px 10px rgba(0, 0, 0, 0.7);

}



.btn_benito_close:hover,

.btn_benito_close2:hover {

  box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.9);

  background-color: #5b606f;

}



.btn_benito_close:focus,

.btn_benito_close2:focus {

  color: #e2ab5d;

  box-shadow: 1px 1px 3px rgba(0, 0, 0, 1);

}



.btn_benito_close:not(:disabled):not(.disabled),

.btn_benito_close2:not(:disabled):not(.disabled) {

  cursor: pointer;

}



.modal_open {

  overflow: hidden;

}



.modal {

  position: relative;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 1050;

  display: none;

  overflow: hidden;

  outline: 0;

}



.modal_open .modal {

  overflow-x: hidden;

  overflow-y: auto;

}



.modal_dialog {

  position: relative;

  width: auto;

  margin: 0.5rem;

  pointer-events: none;

}



.modal.fade .modal_dialog {

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

  transform: translate(0, 0);

}



.modal_dialog_centered {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  min-height: calc(100% - (0.5rem * 2));

  max-width: 75%;

  margin: 1.75rem auto;

}



.modal_dialog_centered {

  max-width: 98%;

}



.modal_content {

  position: relative;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-orient: vertical;

  -webkit-box-direction: normal;

  -ms-flex-direction: column;

  flex-direction: column;

  width: 100%;

  pointer-events: auto;

  background-color: #0f1d22;

  background-clip: padding-box;

  border: 1px solid rgba(0, 0, 0, 0.2);

  border-radius: 0.3rem;

  outline: 0;

  text-align: justify;

  box-shadow: 3px 3px 30px rgba(0, 0, 0, 0.99);

}



.modal_header {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: start;

  -ms-flex-align: start;

  align-items: flex-start;

  -webkit-box-pack: justify;

  -ms-flex-pack: justify;

  justify-content: space-between;

  padding: 1rem;

  border-bottom: 1px solid #c9ab81;

  border-top-left-radius: 0.3rem;

  border-top-right-radius: 0.3rem;

  text-align: left;

}



.modal_header .close {

  padding: 1rem;

  margin: -1rem -1rem -1rem auto;

}



.modal_title {

  margin-bottom: 0;

  line-height: 1.5;

  font-family: "caviar_dreamsbold", sans-serif;

  font-size: 2rem;

  font-weight: 700;

  text-transform: none;

  letter-spacing: 6px;

  color: #c9ab81;

  -ms-word-wrap: break-word;

  word-wrap: break-word;

}



.modal_body {

  position: relative;

  -webkit-box-flex: 1;

  -ms-flex: 1 1 auto;

  flex: 1 1 auto;

  padding: 1rem;

  text-align: justify;

  font-size: 1.4rem;

  line-height: 1.5;

}



.modal_body img {

  width: 45%;

  padding-right: 2%;

  padding-bottom: 1%;

  float: left;

}



.modal_footer {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  -webkit-box-pack: end;

  -ms-flex-pack: end;

  justify-content: flex-end;

  padding: 1rem;

  border-top: 1px solid #c9ab81;

}



/* ================================================ index SLIDER */

.content-slider {

  width: 100%;

  height: 250px;

}



.slider {

  height: 250px;

  width: 250px;

  margin: 30px auto 0;

  overflow: visible;

  position: relative;

  transform: scale(1.2);

}



.mask {

  overflow: hidden;

  height: 250px;

}



.slider ul {

  margin: 0;

  padding: 0;

  position: relative;

}



.slider li {

  width: 250px;

  height: 250px;

  position: absolute;

  right: -250px;

  list-style: none;

}



.slider .anim1 {

  animation: cycle 15s linear infinite;

}



.slider li.anim2 {

  animation: cycle2 15s linear infinite;

}



.slider li.anim3 {

  animation: cycle3 15s linear infinite;

}



.slider li.anim4 {

  animation: cycle4 15s linear infinite;

}



.slider li.anim5 {

  animation: cycle5 15s linear infinite;

}



.slider:hover li {

  animation-play-state: paused;

}



@keyframes cycle {

  0% {

    right: 0px;

  }



  4% {

    right: 0px;

  }



  16% {

    right: 0px;

    opacity: 1;

    z-index: 0;

  }



  20% {

    right: 250px;

    opacity: 0;

    z-index: 0;

  }



  21% {

    right: -250px;

    opacity: 0;

    z-index: -1;

  }



  50% {

    right: -250px;

    opacity: 0;

    z-index: -1;

  }



  92% {

    right: -250px;

    opacity: 0;

    z-index: 0;

  }



  96% {

    right: -250px;

    opacity: 0;

  }



  100% {

    right: 0px;

    opacity: 1;

  }

}



@keyframes cycle2 {

  0% {

    right: -250px;

    opacity: 0;

  }



  16% {

    right: -250px;

    opacity: 0;

  }



  20% {

    right: 0px;

    opacity: 1;

  }



  24% {

    right: 0px;

    opacity: 1;

  }



  36% {

    right: 0px;

    opacity: 1;

    z-index: 0;

  }



  40% {

    right: 250px;

    opacity: 0;

    z-index: 0;

  }



  41% {

    right: -250px;

    opacity: 0;

    z-index: -1;

  }



  100% {

    right: -250px;

    opacity: 0;

    z-index: -1;

  }

}



@keyframes cycle3 {

  0% {

    right: -250px;

    opacity: 0;

  }



  36% {

    right: -250px;

    opacity: 0;

  }



  40% {

    right: 0px;

    opacity: 1;

  }



  44% {

    right: 0px;

    opacity: 1;

  }



  56% {

    right: 0px;

    opacity: 1;

    z-index: 0;

  }



  60% {

    right: 250px;

    opacity: 0;

    z-index: 0;

  }



  61% {

    right: -250px;

    opacity: 0;

    z-index: -1;

  }



  100% {

    right: -250px;

    opacity: 0;

    z-index: -1;

  }

}



@keyframes cycle4 {

  0% {

    right: -250px;

    opacity: 0;

  }



  56% {

    right: -250px;

    opacity: 0;

  }



  60% {

    right: 0px;

    opacity: 1;

  }



  64% {

    right: 0px;

    opacity: 1;

  }



  76% {

    right: 0px;

    opacity: 1;

    z-index: 0;

  }



  80% {

    right: 250px;

    opacity: 0;

    z-index: 0;

  }



  81% {

    right: -250px;

    opacity: 0;

    z-index: -1;

  }



  100% {

    right: -250px;

    opacity: 0;

    z-index: -1;

  }

}



@keyframes cycle5 {

  0% {

    right: -250px;

    opacity: 0;

  }



  76% {

    right: -250px;

    opacity: 0;

  }



  80% {

    right: 0px;

    opacity: 1;

  }



  84% {

    right: 0px;

    opacity: 1;

  }



  96% {

    right: 0px;

    opacity: 1;

    z-index: 0;

  }



  100% {

    right: 250px;

    opacity: 0;

    z-index: 0;

  }

}



.article {

  display: flex;

  justify-content: center;

}



.article_inner {

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

}



.article_box {

  position: relative;

  width: 200px;

  height: 200px;

}



.article_img {

  position: absolute;

}



.ariticle_tooltip {

  position: absolute;

  width: 150px;

  height: 150px;

  margin-top: 10px;

  margin-left: 25px;

  background: #0f1d22;

  opacity: 0;

  z-index: 10;

  transition: opacity 0.4s ease-out;

  -webkit-transition: opacity 0.4s ease-out;

  -moz-transition: opacity 0.4s ease-out;

}



.ariticle_tooltip:hover {

  opacity: 0.7;

  transform: translateY(0px);

}



.ariticle_tooltip_link,

.article_price,

.article_ktg {

  position: absolute;

  text-align: center;

  width: 150px;

  height: 150px;

}



.article_price {

  margin-top: 60px;

  font-size: 1.6rem;

}



.article_ktg {

  margin-top: 100px;

  font-size: 1.2rem;

  font-weight: 500;

  color: #c9ab81;

}



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

  .article_inner {

    padding-left: 0;

  }



  .article_box {

    position: relative;

    width: 40vw;

    height: 160px;

  }

}



.rating {

  position: relative;

  direction: rtl;

  width: 100%;

  margin: 10px 0 1.5%;

  unicode-bidi: bidi-override;

  font-size: 2em;

  text-align: center;

}



.sub-rating {

  position: relative;

  direction: rtl;

  width: 100%;

  margin: 10px 0 1.5%;

  unicode-bidi: bidi-override;

  font-size: 2em;

  text-align: center;

}



#average-content,

#average-rating {

  margin: 0;

}



#average-rating{

  margin-bottom: 3%;

}



.rating-text {

  direction: ltr;

  font-size: 1.5rem;

}



.star {

  cursor: pointer;

  color: transparent;

  -webkit-text-stroke: 1px #c9ab81;

  text-stroke: 1px #c9ab81;

  transition: all .5s;

}



.star:hover,

.star:hover~.star {

  color: #c9ab81;

}



.star.selected {

  color: #c9ab81;

}



.message-Container,

.thank-you-message {

  position: absolute;

  display: none;

  width: max-content;

  left: 50%;

  transform: translateX(-50%);

  padding: 20px 15px;

  background: #0b1315;

  box-shadow: 10px 40px 20px 15px rgba(0, 0, 0, 0.7);

  border: 1px solid #c9ab81;

  color: #fff;

  font-size: 1.5em;

  opacity: 0;

  transition: opacity 0.5s ease;

  z-index: 999;

}



/* ============================================================================= MOBILE SEARCH STYLES */

.mobile_search {

  padding: 15px 20px;

  background-color: #0f1d22;

  border-bottom: 1px solid #2d3a42;

}



.mobile_search_container {

  position: relative;

  width: 100%;

}



.mobile_search_input {

  width: 100%;

  padding: 12px 45px 12px 15px;

  font-size: 1rem;

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

  color: #ffffff;

  background-color: #1a2830;

  border: 1px solid #c9ab81;

  border-radius: 25px;

  outline: none;

  transition: all 0.3s ease;

  box-sizing: border-box;

  -webkit-appearance: none;

  -moz-appearance: none;

  appearance: none;

}



.mobile_search_input:focus {

  border-color: #c9ab81;

  box-shadow: 0 0 0 2px rgba(226, 171, 93, 0.2);

  background-color: #243039;

}



.mobile_search_input::placeholder {

  color: #9ca3af;

  font-style: italic;

}



.mobile_search_btn {

  position: absolute;

  right: 8px;

  top: 50%;

  transform: translateY(-50%);

  background: none;

  border: none;

  cursor: pointer;

  padding: 10px;

  color: #c9ab81;

  transition: color 0.3s ease;

  min-height: 44px;

  min-width: 44px;

  display: flex;

  align-items: center;

  justify-content: center;

}



.mobile_search_btn:hover,

.mobile_search_btn:focus {

  color: #c9ab81;

  outline: 2px solid #c9ab81;

  outline-offset: 2px;

}



.mobile_search_results {

  position: absolute;

  top: 100%;

  left: 0;

  right: 0;

  background-color: #1a2830;

  border: 1px solid #c9ab81;

  border-top: none;

  border-radius: 0 0 15px 15px;

  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);

  z-index: 1000;

  max-height: 300px;

  overflow-y: auto;

}



.mobile_search_results .search_result_item {

  padding: 15px 20px;

  cursor: pointer;

  transition: background-color 0.2s ease;

  border-bottom: 1px solid #2d3a42;

  min-height: 44px;

  display: flex;

  align-items: center;

}



.mobile_search_results .search_result_item:last-child {

  border-bottom: none;

}



.mobile_search_results .search_result_item:hover,

.mobile_search_results .search_result_item.selected {

  background-color: #243039;

}



.mobile_search_results .search_result_item a {

  display: block;

  color: inherit;

  text-decoration: none;

  width: 100%;

}



.mobile_search_results .search_result_content {

  display: flex;

  flex-direction: column;

  gap: 4px;

}



.mobile_search_results .search_result_name {

  color: #ffffff;

  font-weight: 600;

  font-size: 1rem;

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

  text-transform: uppercase;

  letter-spacing: 0.1em;

}



.mobile_search_results .search_result_category {

  color: #c9ab81;

  font-size: 0.85rem;

  font-weight: 300;

}



.mobile_search_results .search_no_results {

  padding: 20px;

  text-align: center;

  color: #9ca3af;

  font-style: italic;

}



/* =========================== MOBILE TOUCH ENHANCEMENTS */

.touch-device .touch-active {

  background-color: rgba(201, 171, 129, 0.2) !important;

  transform: scale(0.98);

  transition: all 0.1s ease;

}



.touch-device .btn-touch-active {

  background-color: rgba(201, 171, 129, 0.3) !important;

  transform: scale(0.96);

}



.touch-device .form-group-focused {

  background-color: rgba(201, 171, 129, 0.05);

  border-radius: 4px;

  padding: 8px;

  margin: -8px;

}



.touch-device .mobile-enhanced {

  transform: scale(1.1);

  transition: transform 0.2s ease;

}



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



  .touch-device .mobile_arrow {

    min-height: 44px;

    min-width: 44px;

    display: flex;

    align-items: center;

    justify-content: center;

  }



  .touch-device .hamburger_icon {

    min-height: 44px;

    min-width: 44px;

    padding: 8px;

  }

}

.mobil_nezet_price {

  display: flex;

  flex-wrap: wrap;

  text-align: center;

  justify-content: center;

  align-items: center;

  width: fit-content;

  margin: auto;

}


.mobil_nezet_price span {
color: #c9ab81;
font-weight: 500;
}



ul, ol {

  list-style: none;     /* jelölő ki */

  margin: 0;            /* böngésző alap margó ki */

  padding-left: 0;      /* bal behúzás ki */

}