.shadow {
  -webkit-box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
  box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
}
.blackButton {
  display: inline-block;
  font-size: 16px;
  font-weight: 600;
  color: #ffdd00;
  background-color: #111111;
  text-align: center;
  padding: 8px 32px;
  -webkit-border-radius: 18px;
  -moz-border-radius: 18px;
  border-radius: 18px;
  text-decoration: none;
  -webkit-box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
  box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
  margin: 4px 4px 4px 0;
}
.yellowButton {
  display: inline-block;
  font-size: 16px;
  font-weight: 600;
  color: #ffdd00;
  background-color: #111111;
  text-align: center;
  padding: 8px 32px;
  -webkit-border-radius: 18px;
  -moz-border-radius: 18px;
  border-radius: 18px;
  text-decoration: none;
  -webkit-box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
  box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
  margin: 4px 4px 4px 0;
  color: black;
  background-color: #ffdd00;
}
.yellowButton:hover {
  color: #333333;
}
.blackBox {
  background-color: #111111;
  padding: 24px;
  display: inline-block;
  position: relative;
  margin: 8px;
  color: white;
  -webkit-box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
  box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  border-radius: 16px;
}
body {
  background-color: #111111;
}
.container {
  width: 100%;
  max-width: 480px;
  min-width: 300px;
  position: relative;
  margin: 0px auto;
  background: white;
  padding: 0;
  padding-bottom: 54px;
}
.headerBg {
  position: absolute;
  background-color: #ffdd00;
  height: 73px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url(../img/app-logo-d.png);
  background-repeat: no-repeat;
  /*background-size: contain;*/
  background-size: 80px;
  background-position: left;
  z-index: 90;
  -webkit-box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
  box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
}
/*.headerBg {
  position: absolute;
  background-color: #393939;
  height: 62px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url(../img/club-log.jpg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left;
  z-index: 90;
  -webkit-box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
  box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
}*/
header {
  overflow: auto;
  display: block;
  padding: 16px 0;
  border-bottom: 0px #222222 solid;
}
.mainmenu hr {
  height: 1px;
  border: none;
  background: #222;
}
.mainHeader {
  padding: 25px 16px 20px;
  position: relative;
  z-index: 99;
}
.burger {
  display: block;
  text-align: right;
  z-index: 100;
}
.burger #nav-icon3 {
  transform: none;
  margin: 0;
}
.burger #nav-icon3 span {
  background-color: #373741;
}
.burger #nav-icon3.open span {
  background-color: #ffdd00;
}
#menu {
  position: absolute;
  padding-top: 100px;
  top: 0;
  left: 0;
  width: 100%;
  min-height: 100vh;
  display: none;
  opacity: 0;
  z-index: 98;
  background-color: #000000;
  text-align: center;
  font-size: 24px;
}
#menu a,
#menu a:focus {
  font-weight: 600;
  margin-bottom: 16px;
  display: block;
  color: #cccccc;
  text-decoration: none;
}
#menu a.social {
  font-weight: 600;
  margin-bottom: 16px;
  display: inline-block;
  color: #ffdd00;
  text-decoration: none;
  padding: 0 10px;
}
#menu.open {
  display: block;
  opacity: 1;
  transition: opacity 0.5s ease;
}
.content {
  opacity: 1;
}
.graybg,
.AppCont {
  min-height: 90vh;
}
.notificaciones-slider {
  overflow: hidden;
  /*-webkit-border-radius: 24px;
  -moz-border-radius: 24px;
  border-radius: 24px;*/
  height: 390px;
}
.notificaciones-slider h2 {
  font-size: 18px;
  color: #000;
}
.notificaciones-slider b {
  color: #ffdd00;
}
.notificaciones-slider .blackBox {
  inset: 0;
  min-width: 95%;
  background-size:  100%!important;
  min-height: 80%!important;
  background-repeat: no-repeat;
  background-color: #f7de4d;
}

 
.notificaciones-slider .box-content-bottom {
  /*position: absolute;
  left: 16px;
  bottom: 16px;*/
  position: absolute;
    left: 0;
    bottom: 0;
    background: #FFF;
    right: 0;
    padding: 8px 16px;
    -webkit-border-radius: 0px 0px 20px 20px;
    -moz-border-radius: 0px 0px 20px 20px;
    border-radius: 0px 0px 16px 16px;
}
.dash-boxes {
  display: flex;
  align-items: flex-start;
}
.dash-boxes > div {
  flex: 1;
  padding: 8px 8px;
  text-align: center;
  margin: 0 auto;
}
.dash-boxes .blackBox {
  width: 100%;
  min-width: 110px;
  max-width: 180px;
  padding: 16px 8px;
  margin: 0 auto;
  background-color: #ffdd00;
  font-size: 14px;
  font-weight: 600;
  color: #111111;
  text-align: center;
}
.dash-boxes .blackBox svg path {
  fill: #111111;
}
.dash-boxes .blackBox img {
  margin: 0 0 8px;
  width: 54px;
  height: 54px;
}
.itemNovedades {
  display: flex;
  align-items: center;
  margin: 8px 0;
  padding: 0;
  background: #fafafa;
  cursor: pointer;
}
.itemNovedades > div {
  flex: 3;
  padding: 16px;
}
.itemNovedades > div h3 {
  font-size: 20px;
  margin: 0;
}
.itemNovedades > div span {
  font-size: 14px;
  color: #888888;
}
.itemNovedades > div.itemNovedadesImg {
  padding: 0px;
  flex: none;
  width: 100px;
  overflow: hidden;
  max-height: 100px;
}
.itemNovedades > div.itemNovedadesImg img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  transition: filter 0.4s;
}
.itemNovedades:hover {
  background: #efefef;
  transition: background 0.4s;
}
.itemNovedades:hover img {
  filter: brightness(1.2) contrast(1) saturate(1.9);
  transition: filter 0.4s;
}
.NSelector {
  margin: 8px auto 16px;
  position: relative;
  text-align: left;
  font-size: 16px;
}
.NSelector .NSelector-label {
  background-color: white;
  color: black;
  padding: 8px 24px;
  -webkit-border-radius: 18px;
  -moz-border-radius: 18px;
  border-radius: 18px;
  border: 1px solid #111111;
  cursor: pointer;
  font-weight: 600;
  background-image: url(../img/caret.svg);
  background-repeat: no-repeat;
  background-position: right center;
}
.NSelector .NSelector-label.opened {
  background-image: url(../img/caretUp.svg);
  background-color: #ffdd00;
}
.NSelector .NSelector-list {
  left: 0;
  right: 0;
  top: 40px;
  position: absolute;
  z-index: 2;
  display: none;
  background-color: white;
  padding: 4px;
  -webkit-box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
  box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
}
.NSelector .NSelector-item {
  background-color: #f6f6f6;
  margin: 2px 0;
  padding: 8px;
  cursor: pointer;
}
.NSelector .NSelector-item:hover {
  background-color: #efefef;
}
.footer-div {
  position: fixed;
  width: 100%;
  max-width: 480px;
  bottom: 0px;
  z-index: 100;
}
.footer-div > div {
  display: flex;
  align-items: center;
  -webkit-border-radius: 24px;
  -moz-border-radius: 24px;
  border-radius: 24px;
  background: black;
  margin: 4px;
  height: 48px;
  color: #ffdd00;
}
.footer-div > div > div {
  flex: 1;
  text-align: center;
  position: relative;
}
.footer-div > div > div a {
  display: inline-block;
}
#notificaciones-alert {
  display: none;
  position: absolute;
  top: -8px;
  left: 55%;
  color: white;
  background-color: red;
  font-weight: 600;
  font-size: 11px;
  text-align: center;
  width: 18px;
  height: 18px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
}
.nodrag {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
  user-select: none;
}
#initButton {
  position: absolute;
  bottom: 24px;
  left: 0;
  right: 0;
  z-index: 300;
  display: block;
  text-align: center;
  font-size: 24px;
  color: #ffdd00;
}
#SplashSlider {
  width: 100%;
  height: 100vh;
  max-width: 480px;
  margin: 0 auto;
}
.ImageGallery {
  overflow: hidden;
  position: relative;
  width: 100%;
}
.ImageGallery .paginador-dots {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  opacity: 0.7;
  text-align: center;
}
.ImageGallery .paginador-dots span {
  border: 1px solid #ffdd00;
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: 4px 6px;
  cursor: pointer;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.2);
}
.ImageGallery .paginador-dots span.active {
  background-color: #ffdd00;
}
.ImageGallery .paginador-dots.vertical {
  left: auto;
  width: auto;
  right: 0;
  top: 40%;
}
.ImageGallery .paginador-dots.vertical span {
  display: block;
  margin: 20px 12px;
}
.ImageGallery .gallery-line {
  display: flex;
  font-size: 0;
  align-items: center;
}
.ImageGallery .gallery-line.anim {
  transition: transform 0.5s ease;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
  user-select: none;
}
.ImageGallery .gallery-line .imagen {
  flex: 1;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
  user-select: none;
  position: relative;
}
.ImageGallery .gallery-line .imagen img {
  transition: all 0.5s ease;
  object-fit: cover;
  width: 100%;
  height: 100%;
  padding: 0;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
  user-select: none;
  opacity: 0.4;
  transform: scale(0.9, 0.9);
}
.ImageGallery .gallery-line .imagen .imageTxt {
  position: absolute;
  top: 0;
  left: 0;
  margin: 120px 32px;
  color: #efefef;
  opacity: 0.1;
  transition: opacity 0.5s ease;
}
.ImageGallery .gallery-line .imagen .imageTxt h2 {
  font-size: 48px;
  margin: 0;
  font-weight: 400;
}
.ImageGallery .gallery-line .imagen .imageTxt p {
  font-size: 18px;
  margin: 0;
}
.ImageGallery .gallery-line .imagen.active .imageTxt {
  transition: opacity 0.5s ease;
  opacity: 0.85;
}
.ImageGallery .gallery-line .imagen.active img {
  opacity: 1;
  transition: all 0.5s ease;
  transform: scale(1, 1);
}
.caja {
  width: 100%;
  border: 0px solid #cccccc;
  margin: 4px 0 24px;
  position: relative;
  padding: 16px;
  background-color: #ffffff;
  border-radius: 12px;
  -webkit-box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
  box-shadow: 2px 5px 16px 0px #00000066, 2px 5px 16px 1px rgba(0, 0, 0, 0);
  text-decoration: none;
}
.caja .title {
  display: block;
  font-size: 16px;
  font-weight: 600;
}
.caja .icon {
  position: absolute;
  top: -6px;
  right: -6px;
  width: 68px;
}
.caja .mas-info {
  display: inline-block;
  padding: 2px 4px;
  color: #777777;
  font-weight: bold;
}
.caja .asd {
  display: flex;
  padding: 0;
  align-items: flex-start;
}
.caja .asd > div {
  flex: 1;
  list-style: none;
  font-size: 12px;
  font-weight: 600;
  padding: 8px;
}
.caja .materiales {
  display: none;
  margin: 16px 0;
}
.caja .material-item {
  padding: 8px 0;
  border-top: 1px solid #555555;
  font-size: 12px;
}
.caja .material-item span {
  font-weight: 600;
}
.caja .ver-materiales {
  width: 100%;
  display: block;
  background-color: #dddddd;
  color: black;
  padding: 6px 30px 6px 12px;
  font-weight: 600;
  background-image: url(../img/caret.svg);
  background-repeat: no-repeat;
  background-position: right center;
}
.caja .ver-materiales::before {
  content: 'Ver materiales';
  text-decoration: none;
}
.caja .ver-materiales.opened {
  background-image: url(../img/caretUp.svg);
}
.caja .ver-materiales.opened::before {
  content: 'Ocultar materiales';
  text-decoration: none;
}
.caja:focus,
.caja:active {
  text-decoration: none;
}