@font-face { font-family: 'ChevySansBold'; src: url(/public/vw/font/ChevySans-Bold.otf) format('opentype'); }
@font-face { font-family: 'ChevySansDemi'; src: url(/public/vw/font/ChevySans-Demi.otf) format('opentype'); }
@font-face { font-family: 'ChevySansMedium'; src: url(/public/vw/font/ChevySans-Medium.otf) format('opentype'); }

body { font-family: 'ChevySansMedium'; }
h1, h2, h3, h4, h5, h6 { font-family: 'ChevySansBold'; }
button { font-family: 'ChevySansDemi'; }
p, span, div, a, li { font-family: 'ChevySansMedium'; }

@keyframes fadeToWhite { from { background-color: rgba(0, 0, 0, 0.7); } to {background-color: rgba(255, 255, 255, 1); } }
.gh-fade-to-white { animation: fadeToWhite 2s forwards; }

/* TRANSITIONS */
.gh-opacy-0{ opacity: 0; /*transition: opacity 3s ease;*/ }
.gh-opacy-1{ opacity: 1; transition: opacity 1.5s ease; }

/* BACKGROUND GRAY */
.gh-bg-fnr-gray{ background: #F1F1F1 !important; }

/* RANGE BAR */
.range-bar{ background-color: #0077D9 !important; height: 500px !important; width: 14px !important; }
.range-handle{ width: 36px !important; height: 36px !important; background-color: #0077D9 !important; border: 5px solid white !important; cursor: none !important; left: -11px !important; }

/* CIRCLE INTO NAV */
.gh-circle-into-nav::after { content: ''; display: block; width: 24px; height: 24px; background-color: white; border-radius: 50%; position: absolute; top: 8px; left: 8px; }

/* CIRCLE INTO NAV */
.slick-slide.slick-active.is-active-- .gh-cursor::after {
  content: '';
  display: block;
  width: 24px;
  height: 24px;
  background-color: white;
  border-radius: 50%;
  position: absolute;
  top: 8px;
  left: 8px;
}

/* MENU MODEL */
#gh_menu_model { width: 350px; overflow: hidden; transition: width 0.3s ease; }

/* BTN */
.gh-btn-inactive{ background: #ACACAC; color: white; }
/* BTN BLUE */
.gh-btn-blue-active{ background: #0077D9; color: white !important; }
/* BTN YELLOW */
.gh-btn-yellow-active{ background: #F2BC18; color: black !important; }
/* BTN WHITE */
.gh-btn-white-active{ background: white; color: #0077D9 !important; }

/* TEXT SHADOW*/
.gh-text-shadow { text-shadow: 2px 2px 4px rgba(0,0,0,.45); }

/* VIDEO FULL*/
.gh-video-full{ width: 100% !important; height: 100% !important; object-fit: cover !important; }

.gh-obj-full{ width: 100% !important; height: 100vh !important; object-fit: cover !important; }

.gh-gallery-video { position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover; }

/* GALLERY */
#gh_gallery_slider_nav .slick-slide.slick-active img { opacity: 0.8 !important; filter: grayscale(100%) !important; transition: opacity 0.3s ease, filter 0.3s ease !important; }
#gh_gallery_slider_nav .slick-slide.slick-active.is-active img { opacity: 1 !important; filter: none !important; }

/* NAVS FOR ACCESORIES */
.nav-tabs .nav-item .nav-link { color: white !important;}
.nav-tabs .nav-item .nav-link.active{ background: #F2BC18 !important; color: black !important; }

/* BTN START */
.gh-btn-start-animation{ position: absolute; }
.gh-btn-start-animation::after,
.gh-btn-start-animation::before { content: '';   box-sizing: border-box; width: 330px; height: 330px; border-radius: 60%; background: #04D1E4; transform: scale(0); opacity: 0; position: absolute; left: 0; top: 0; animation: animloader 2s linear infinite; }
.gh-btn-start-animation::after { animation-delay: 2s; }
@keyframes animloader { 0% { transform: scale(0); opacity: 0.2; } 100% { transform: scale(1); opacity: 0.2; } }

/* Estilos para los checkboxes */
.checkbox-container { display: inline-block; margin-right: 10px; }
.checkbox-container input[type="checkbox"] { display: none; }
/* Estilo para el label del checkbox */
.checkbox-label {
  display: inline-block;
  cursor: pointer;
  padding: 10px 20px;
  border: 2px solid #ccc;
  border-radius: 5px;
  background-color: #f1f1f1;
  color: #333;
}
/* Estilo para cuando el checkbox está seleccionado */
.checkbox-label.checked { background-color: #4CAF50; color: white; }
.roulette-wheel {
  max-width: 100%;
  width: 300px;
  height: auto;
  margin: 20px auto;
  cursor: pointer;
}
svg { max-width: 100%; height: auto; }
text { font-size: 6px; fill: #000000; text-anchor: middle; dominant-baseline: middle; }
/* Deshabilitar la selección de texto */
.roulette-wheel, .roulette-wheel * {
  user-select: none;
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* Internet Explorer/Edge */
}

/* UN MAXIMO DE 1200px */
@media (max-width:1200px) {
  .range-bar{ height: 100% !important; }

  /* MENU MODEL */
  #gh_menu_model { width: 220px; }

  /* CIRCLE INTO NAV */
  .gh-circle-into-nav::after { width: 17px; height: 17px; top: 4px; left: 4px; }
}