/* GENERAL */
html {
  min-height: 100vh;
  height: 100%;

  --textcolor: #444444;
  --bgcolor: #fefefe;
  --sitecolor: #333333;
  --altcolor: #d1c67d;
  --alttextcolor: #333333;
}

html body {
  min-height: 100vh;
  background-color: #fefefe;
  font-family: "Open Sans", sans-serif;
  font-size: 15px;
  color: var(--textcolor);
  -webkit-font-smoothing: antialiased;
  margin: 0;
  line-height: 1.4;
}

body a,
body a:hover {
  color: var(--textcolor);
  text-decoration: none;
}
.relative {
  position: relative;
}
.regular,
light {
  font-weight: 300;
}
.strong,
.text-bold,
.text-strong {
  font-weight: 700;
}

.uppercase {
  text-transform: uppercase;
}

svg {
  max-width: 100%;
  height: auto;
}

label {
  font-weight: bold;
  text-transform: uppercase;
  font-family: "Oswald", sans-serif;
}

.precio-con-descuento {
  text-decoration: line-through;
  font-size: 15px !important;
}

.underline {
  text-decoration: underline;
}

.border-bottom {
  border-bottom: 1px solid lightgray;
}

section {
  position: relative;
}
.container {
  width: 100%;
  max-width: 1200px;
}
img {
  max-width: 100%;
  height: auto;
}
.text-underline {
  text-decoration: underline;
}
.grayscale {
  filter: grayscale(1);
  -webkit-filter: grayscale(1);
}
.thumb-container {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.thumb-container.absolute {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.thumb-container.light-thumb {
  opacity: 0.05;
}

.w-100 {
  width: 100% !important;
}
.min-height-100vh {
  min-height: 100vh;
}
.min-height-100vh.has-header {
  min-height: calc(100vh - 91px);
}
.height-100vh {
  height: 100vh;
}

.scroll-content {
  max-height: 400px;
  overflow: scroll;
}

.scroll-content table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}

.scroll-content table tbody {
  display: block;
  width: 100%;
  overflow: auto;
  height: 259px;
}

.scroll-content table thead tr {
  display: block;
  width: 100%;
}

.scroll-content table tbody tr .td-disponibles,
.scroll-content table thead tr .th-disponibles {
  width: 370px;
}

.scroll-content table tbody tr .td-sector,
.scroll-content table thead tr .th-sector {
  width: 50%;
}

.table-responsive.has-options {
  padding-bottom: 100px !important;
}

/* BUTTONS */
.button,
a.button,
.btn,
a.btn {
  padding: 0.6rem 1.5rem;
  text-align: center;
  outline: none;
  display: inline-block;
  text-decoration: none;
  -webkit-appearance: none;
  border: none;
  cursor: pointer;
  vertical-align: middle;
  line-height: 1.4;
  text-transform: uppercase;
  font-weight: 700;
  background: var(--sitecolor);
  color: #fff;
  transition: all 0.3s;
  font-size: 12px;
  font-family: "Oswald", sans-serif;
}

.btn-outline-primary {
    color: black !important;    
    background: transparent !important;
    border: solid transparent 1px !important;
}

.btn-outline-primary:hover {
    color: var(--sitecolor) !important;
    border: solid var(--sitecolor) 1px !important;
}

.btn-outline-primary.active {
    color: var(--sitecolor) !important;
    border: solid var(--sitecolor) 1px !important;
}

.button:hover {
  text-decoration: none;
  opacity: 0.8;
  outline: none;
  color: #ffffff;
  outline: none;
}

.button > * {
  display: inline-block;
  vertical-align: middle;
}

.button.large-button {
}

.button.small-button {
  font-size: 11px;
  padding: 6px 15px;
}

.button.small-button i {
}

.button.small-button img {
  width: 0.7rem;
}

.button.effect-button {
  position: relative;
  overflow: hidden;
}
.button.effect-button:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  -webkit-transform: scale3d(0, 1, 1);
  transform-origin: left;
}
.button.effect-button:hover {
  -webkit-transform: scale3d(1, 1, 1);
  color: var(--alttextcolor) !important;
  opacity: 1;
}
.button.effect-button > span {
  position: relative;
}
.button.effect-button:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 101%;
  transition: all 0.4s;
  -webkit-transform: scale3d(0, 1, 1);
  transform-origin: left;
  background-color: var(--altcolor) !important;
  color: var(--alttextcolor) !important;
}
.button.effect-button:hover:before {
  -webkit-transform: scale3d(1, 1, 1);
  color: var(--alttextcolor) !important;
}

.button.large-button {
  font-size: 16px;
  padding: 15px 20px;
  min-width: 200px;
}

.button.disabled,
.button:disabled {
  opacity: 0.65;
}

/* COLORS */
.white,
a.white,
.white a {
  color: #fff;
}

.white-content {
  background-color: #fff !important;
  color: var(--textcolor);
}

.white-content a {
  color: var(--textcolor);
}

.white-content .button,
.white-content input[type="submit"] {
  background-color: var(--sitecolor);
  color: #fff;
  border: 1px solid var(--sitecolor);
}

.green,
a.green,
.green a {
  color: green;
}

.sitecolor-content {
  background-color: var(--sitecolor);
  color: #fff;
}
.sitecolor-content a {
  color: #fff;
}

.main-color-content a {
  color: #fff;
}

.dark-content {
  background-color: #4c4c45 !important;
  color: #fff !important;
}

.gray {
  color: #4c4c45;
}

.gray-content {
  background-color: #aaa !important;
  color: #fff !important;
}

.gray-content .card {
  color: black !important;
}

.lightgray-content {
  background-color: #ededed;
}

.lightgray2-content {
  background-color: #ededed !important;
  border: 1px solid #ddd;
}

.main-color-content {
  background-color: #c00 !important;
  color: #fff;
}

.black,
a.black,
.black a {
  color: #000;
}

.gradient-color {
  background: linear-gradient(90deg, var(--sitecolor), var(--altcolor));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #fff;
}
.gradient-content {
  background: linear-gradient(
    90deg,
    var(--sitecolor),
    var(--altcolor)
  ) !important;
}

.altcolor {
  color: var(--altcolor) !important;
}
.altcolor-content {
  background-color: var(--altcolor) !important;
  color: var(--alttextcolor) !important;
}

.red {
  color: #cc0000;
}
.red-content {
  background-color: #cc0000;
  color: #ffffff;
}
.blue,
a.blue,
.blue a {
  color: #007cff;
}
.blue-content {
  background-color: #007cff;
}
.orange-content {
  background-color: #ff9900;
}
.green-content {
  background-color: #37ab37;
}

/* TYPOGRAPHY / FONTS /HEADINGS */
body h1,
body .h1,
body h2,
body .h2,
body h3,
body .h3,
body h4,
body .h4,
body h5,
body .h5,
h6,
body .h6,
body .panel-heading,
body .section-title,
body .title {
  font-family: "Oswald", sans-serif;
  font-weight: 700;
}

h1,
.h1 {
  font-size: 30px;
}
h2,
.h2 {
  font-size: 27px;
}
h3,
.h3 {
  font-size: 19px;
}
h4,
.h4 {
  font-size: 20px;
}
h5,
.h5 {
  font-size: 16px;
}
h6,
.h6 {
}

.italic {
  font-style: italic;
}

.regular {
  font-weight: 300 !important;
}
.light {
  font-weight: 100 !important;
}

.oswald {
  font-family: "Oswald", sans-serif;
}

.section-title {
  padding: 30px 0px 30px;
  background-image: url(https://56.dev.sozpic.com/compralaentrada-pre/images/events/event_42.jpg);
  background-blend-mode: multiply;
}
.section-title h1 {
  font-size: 20px;
}
.padding-content {
  padding: 20px 20px;
}
.padding-vertical-content {
  padding: 20px 0px;
}

hr.separator {
  background-image: linear-gradient(
    80deg,
    var(--sitecolor) 60%,
    var(--altcolor)
  );
  height: 5px;
  border: none;
  margin: 3rem 0;
}

.selling-features {
  padding: 0;
  margin: 0;
}
.selling-features > li {
  list-style: none;
  width: 50%;
  padding: 5px;
  border-bottom: 1px solid;
  border-right: 1px solid;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  align-content: center;
}
.selling-features > li:nth-child(1),
.selling-features > li:nth-child(3) {
  border-left: 1px solid;
}
.selling-features > li svg {
  height: 25px;
}
.selling-features > li svg > * {
  /* fill: #ffffff; */
  fill: #ffffff;
  fill: var(--alttextcolor);
}
.selling-features > li span {
  display: block;
  padding: 4px 0px;
  font-weight: bold;
  width: 100%;
  font-size: 11px;
}
.selling-features > li span.icon {
  display: block;
  font-weight: bold;
  font-size: 1.2rem;
  line-height: 1.1;
  height: 25px;
}
/* THECONTENT */
.thecontent {
  font-size: 16px;
}

.thecontent p {
  margin: 0 0 30px;
}

.thecontent ul {
  padding: 0;
}

.thecontent ul > li {
  position: relative;
  list-style: none;
  padding-left: 17px;
  margin: 0 0 10px;
}

.thecontent ul > li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 8px;
  height: 8px;
  background-color: #4c4c45;
  transform: rotate(45deg);
  border-radius: 3px;
}

/* LOGIN SECTION */
form.white-content {
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.98);
  padding: 30px 30px 0;
}

.page-login .panel-heading {
  border: none;
  text-align: center;
  font-size: 30px;
}

.login-section {
  position: relative;
  padding: 20px 0px;
}

.login-section > .thumb-container:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
}

.login-section > .thumb-container.grayscale:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
}

.element-loading:after {
  content: "";
  background-color: #fff;
  opacity: 0.6;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
}

.page-login {
  background-size: 100%;
  height: 100vh;
  padding: 6rem 0;
  background-color: rgba(61, 57, 58, 0.36);
}

.poweredby {
  text-align: center;
  margin-top: 40px;
}

.poweredby a {
  display: inline-block;
  padding: 20px 210px 20px 20px;
  background: url(../images/logo_compralaentrada_dark.png) no-repeat right
    center;
  background-size: 190px;
  color: #4c4c45;
  font-size: 11px;
  font-style: italic;
  text-decoration: none;
  position: relative;
  text-decoration: none;
  font-weight: 700;
}

/* FORMS */

.form-content {
  padding: 15px;
  position: relative;
}
.form-team-content {
  padding: 15px;
}
.form-team-content .thumb-container {
  background-size: auto 80%;
  opacity: 0.05;
  -webkit-filter: grayscale(1);
}

.form-team-content .form-group input {
  background: none;
  border: 1px solid #ccc;
  min-height: 50px;
}
form label {
  font-weight: 700;
  font-size: 12px;
  margin: 0 0 6px;
  text-transform: uppercase;
  display: block;
}

.form-group {
  position: relative;
  margin: 0 0 1rem;
}

.form-group.form-group-search {
  position: relative;
}

.form-group.form-group-search input {
  position: relative;
  padding-right: 50px;
}

.form-group.form-group-search:after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  width: 40px;
  height: 100%;
  background: url(../images/search_gray.svg) no-repeat center center;
  background-size: 20px;
}

.form-group.bordered input {
  font-size: 12px;
  border-radius: 4px;
  border: none;
  background: #ededed;
}

.form-group input.big-input {
  font-size: 13px;
  padding: 18px 11px;
  color: #000;
}

.form-group.bordered input::placeholder {
  color: #999;
  font-style: italic;
}

body .multiselect__tags {
  background-color: #ededed;
  min-height: 43px;
  border-radius: 2px;
  font-size: 12px;
  padding-top: 11px;
}

body .multiselect__input,
body .multiselect__single {
  background-color: transparent;
  font-size: 12px;
  margin: 0;
}

body .custom-control-inline {
  margin-right: 0.4rem;
}

body .custom-control-inline .custom-control-label {
  font-weight: 700;
}

body .custom-control-input:checked ~ .custom-control-label::before {
  color: #fff;
  border-color: #c00;
  background-color: #c00;
}

.form-group-icon {
  padding-left: 2rem;
  background-repeat: no-repeat;
  background-position: 5px center;
  background-size: 1.1rem;
}

input,
textarea,
input.form-control,
textarea.form-control {
  -webkit-appearance: none;
  background: none;
  border: none;
  -webkit-border-radius: 0;
  width: 100%;
  outline: none;
  background: none;
  border: none;
  border-bottom: 1px solid #4c4c45;
  color: #666;
  line-height: 1.5;
  background: #fff;
  padding: 11px 10px;
  font-size: 14px;
  height: auto;
  outline: none;
  box-shadow: none;
}

.white-content input,
.white-content textarea,
.white-content input.form-control,
.white-content textarea.form-control {
  background-color: #f1f1f1;
  border-color: #ccc;
}

.form-control.bordered {
  border: 1px solid #ededed;
}

.form-control.small-input {
  padding: 10px;
  font-size: 14px;
}

.form-group textarea {
  min-height: 140px;
  background-color: #ededed;
  border-radius: 3px;
  font-size: 14px;
  border-bottom: none;
}

.form-group input + label {
  top: 100%;
  width: 100%;
  height: 1px;
  left: 0;
  font-weight: 400;
  text-transform: none;
}

.form-group input + label a {
  font-weight: bold;
  text-decoration: underline;
}

.form-control.is-invalid + .error,
.form-control.is-invalid ~ .error {
  background-color: #dc3545;
  color: #ffffff;
  font-size: 11px;
  padding: 5px 10px;
}

.checkbox-container + .error {
  background-color: #dc3545;
  color: #ffffff;
  font-size: 11px;
  padding: 5px 10px;
}

input#concepto {
  background-color: #ededed;
}

.form-group .input-error-msg {
  position: absolute;
  top: calc(100% + 1px);
  right: 0;
  background: #b76b72;
  color: #fff;
  font-size: 0.6rem;
  z-index: 1;
  line-height: 2;
  padding: 0 6px;
}

.checkbox-container .input-error-msg {
  position: absolute;
  top: calc(100% - 15px);
  right: 0;
  background: #b76b72;
  color: #fff;
  font-size: 0.6rem;
  z-index: 1;
  line-height: 2;
  padding: 0 6px;
}

.form-group input:focus {
  border-color: #c00;
}

.form-group.form-group-small {
  padding: 4px 0 0;
  margin: 0;
}

.form-group.form-group-small label {
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 700;
  margin: 6px 0 2px;
}

.form-group.form-group-small input[type="text"],
.form-group.form-group-small input[type="email"],
.form-group.form-group-small input[type="password"] {
  font-size: 11px;
}

.form-group .multiselect__content .multiselect__element {
  font-size: 11px;
}

.results {
  padding-left: 0;
}

/* A  LA MIERDER */
/*
.results > li:first-child:before{
	content: 'RESULTADOS ENCONTRADOS';
	font-weight: bold;
	margin: 0 0 6px;
	display: block;
	width: 100%;
	font-size: 17px;
	padding-bottom: 8px;
}
*/
.results > li {
  font-size: 13px;
  padding: 6px 0;
  border-bottom: 1px solid #ededed;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  position: relative;
  line-height: 1.4;
  align-items: center;
}

.results > li:first-child {
  padding-top: 0;
}

.results > li .text-success {
  font-size: 14px;
}

.results > li .button {
}

.results > li .text-danger {
}

.multiselect__tag {
  background-color: #000;
  color: #fff;
  border-radius: 0;
}

.multiselect__tag-icon:after {
  color: #fff;
  font-size: 18px;
}

.multiselect__tag-icon:focus,
.multiselect__tag-icon:hover {
  background-color: transparent;
}

form.white-content.rounded input,
form.white-content.rounded textarea {
  border-radius: 4px;
  border: none;
  background-color: hsla(50, 42%, 81%, 0.5);
  border: 1px solid #ddd;
}

form.white-content.rounded .button {
  border-radius: 4px;
}

.event-list {
  padding: 0;
  margin: 0;
  list-style: none;
}

.event-list-item {
  padding: 20px 10px;
  background-color: #fff;
  border: 3px solid #dfdfdf;
  transition: 0.2s all;
  -webkit-transition: 0.2s all;
  -moz-transition: 0.2s all;
  cursor: pointer;
  position: relative;
}

.event-list-item-content {
  margin-left: 60px;
}

.event-list-item-title {
  font-size: 1.3rem;
  text-transform: uppercase;
  font-weight: 700;
  font-family: "EffraBoldItalic";
}

.event-list-item:hover {
}

.calendar-icon {
  position: absolute;
  top: 20%;
  font-size: 3rem;
}

.sesion-list {
  margin: 0;
  list-style: none;
}

.sesion-list-item {
  padding: 15px 0;
}

/* CHECKBOX CONTAINER */
.checkbox-container {
  position: relative;
  vertical-align: top;
  margin: 0;
}

.checkbox-container input[type="checkbox"],
.checkbox-container input[type="radio"] {
  opacity: 0;
  position: absolute;
  visibility: hidden;
}

.checkbox-container input[type="checkbox"] + label,
.checkbox-container input[type="radio"] + label {
  margin: 0 0 1rem;
  cursor: pointer;
  line-height: 1.5;
  padding-left: 41px;
  font-size: 13px;
  position: relative;
  padding-top: 6px;
}

.checkbox-container input[type="checkbox"] + label:before,
.checkbox-container input[type="radio"] + label:before {
  content: "";
  background: #ededed;
  display: inline-block;
  width: 31px;
  height: 31px;
  margin-bottom: 0;
  cursor: pointer;
  position: absolute;
  max-width: none;
  vertical-align: top;
  left: 0;
  top: 0;
}
.lightgray-content .checkbox-container input[type="checkbox"] + label:before,
.lightgray-content .checkbox-container input[type="radio"] + label:before {
  background: #ffffff;
}

.checkbox-container.squared input[type="checkbox"] + label:before,
.checkbox-container.squared input[type="radio"] + label:before {
  border-radius: 4px;
}

.checkbox-container input[type="checkbox"] + label:after,
.checkbox-container input[type="radio"] + label:after {
  content: "";
  position: absolute;
  width: 21px;
  /* border-radius:50%; */
  left: 5px;
  top: 4px;
  height: 23px;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.checkbox-container.squared input[type="checkbox"] + label,
.checkbox-container.squared input[type="radio"] + label {
  border-radius: 4px;
  margin: 0;
  width: 17px;
  height: 19px;
}

.checkbox-container.squared
  input[type="checkbox"]
  + label:before
  .checkbox-container.squared
  input[type="radio"]
  + label:before {
  border-radius: 0;
}

.checkbox-container.squared input[type="checkbox"] + label:after,
.checkbox-container.squared input[type="radio"] + label:after {
  border-radius: 4px;
  margin: 0;
  width: 10px;
  height: 10px;
}

.checkbox-container input[type="checkbox"] + label + label,
.checkbox-container input[type="radio"] + label + label {
  display: inline-block;
  vertical-align: middle;
  padding: 0 4px;
  line-height: 1.5;
  font-size: 0.9rem;
}

.checkbox-container + label {
  margin: 0 0 10px;
  font-size: 12px;
  max-width: calc(100% - 50px);
  line-height: 1.1;
}

.checkbox-container + label a {
  color: #c00;
  text-decoration: underline;
}

.checkbox-container input[type="checkbox"]:checked + label:after,
.checkbox-container input[type="radio"]:checked + label:after {
  background: #555;
}

/* TABLE WITH DEATAILS */
.b-table-has-details {
  background-color: #ededed;
  outline: none;
}

/* CUSTOM CSS SNOTIFY */
.snotifyToast {
  border-radius: 0;
  background-color: #89a767;
  color: #fff;
  font-weight: 700;
  text-transform: uppercase;
  font-family: "EffraBoldItalic";
}

.snotifyToast__body {
  color: #fff !important;
}

.snotifyToast__inner {
  min-height: 48px;
}

.snotify-icon {
  display: none;
}

/* MENU */
aside {
  position: fixed;
  left: 0;
  background-color: #4c4c45;
  width: 200px;
  padding-top: 9rem;
  height: 100%;
  z-index: 100;
}

aside .menu {
  list-style: none;
  padding: 0;
  margin: 0;
}

aside .menu li {
  padding: 0;
  border-bottom: 1px solid #f5f5f5;
  display: block;
  cursor: pointer;
}

aside .menu li a {
  font-size: 16px;
  text-transform: uppercase;
  padding: 15px 10px;
  display: block;
  text-decoration: none;
  color: #fff;
  font-weight: 700;
  transition: all 0.4s;
  display: flex;
  line-height: 1.3;
}

aside .menu li:hover a {
  background-color: rgba(255, 255, 255, 0.1);
}

aside .menu li.router-link-active a {
  background-color: #fff;
  color: #4c4c45;
}

aside .menu li.logout a,
aside .menu li.logout:hover a {
  color: #fff;
}

aside .menu li a i {
  padding-right: 8px;
  padding-top: 4px;
}

aside .menu li .fa {
  margin-left: 5px;
}

/* MAIN CONTENT */
#main-content {
  margin: 40px 0;
}

/* TABLES */

.scroll-table-content {
  max-height: 293px;
  overflow: auto;
}
.scroll-table-content thead th {
  position: sticky;
  top: 0;
}

.lightgray-content .table thead,
.lightgray-content .table thead tr,
.lightgray-content .table thead th {
  background-color: #ededed;
}

body .table th body .table td {
  padding: 9px;
  vertical-align: middle;
  font-size: 13px;
  border-bottom: 1px solid #ccc;
}

body .table td {
  font-size: 11px;
  text-transform: uppercase;
  vertical-align: middle;
  padding: 12px 7px;
}

body .table th {
  font-size: 15px;
  text-transform: uppercase;
}

body .table th,
body .table tr:last-child td {
  border-bottom: none;
}

body .table thead th {
  border-top: none;
  text-align: left;
  padding: 9px;
  font-family: "Oswald", sans-serif;
  font-size: 12px;
}

body .table td.availability {
  padding: 0;
  border-right: 1px solid #dee2e6;
}
body .table td.availability:before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #28a644;
  display: block;
  margin: 5px auto;
  border-radius: 50%;
}
body .table td.availability.not-available:before {
  background-color: #cc0000;
}
body .table.main-table {
}

body .table.main-table > tbody > tr {
  cursor: pointer;
  transition: all 0.4s;
}

body .table.main-table > tbody > tr:not(.b-table-has-details):hover {
  background-color: #fff;
}

body .table.main-table tr:focus {
  box-shadow: none;
  outline: none;
}

body .table .options,
body .table.main-table th:last-child,
body .table.main-table > tbody > tr:not(.b-table-details) > td:last-child {
  width: 250px;
  text-align: center;
}

body .table th:last-child .button,
body .table td:last-child .button,
body .table .options .button {
}

.b-table.table > tbody > tr.b-table-details > td {
  border-top: none !important;
  padding: 0;
}

.b-table.table > tbody > tr.b-table-details > td .table-responsive {
  background-color: #ededed;
}

.b-table.table > tbody > tr.b-table-details > td .table-responsive .table {
  font-size: 12px;
  margin: 0;
}

.b-table.table > tbody > tr.b-table-details > td .table-responsive tr th,
.b-table.table > tbody > tr.b-table-details > td .table-responsive tr td {
  font-size: 12px;
}

/* pagination */
ul.pagination {
  margin: 40px 0;
}

ul.pagination li {
  margin: 5px 5px;
}

ul.pagination li .page-link,
ul li.page-item:last-child .page-link {
  color: #4c4c45;
  min-width: 40px;
  text-align: center;
  border-color: #dee2e6;
  border-radius: 0;
  background-color: #ededed;
}

ul.pagination li.active .page-link {
  background-color: #4c4c45;
  border-color: #4c4c45;
}

/* Single event */
#svg-wrapper {
}

/*
.event-info {
	background-color:#eee;
	border:1px solid #ededed;
	color:#4c4c45;
	font-weight:700;
	margin:0 0 20px;
	padding:30px 9px 23px;
}

.event-info > * {
	margin:0 0 10px;
	border-bottom:1px solid #4c4c45;
	padding-bottom:16px;
	display:flex;
	justify-content:flex-start;
	align-items:center;
	text-transform:uppercase;
	color:#555;
}

.event-info > :last-child {
	margin:0 0 10px;
	padding-bottom:0;
	border:none;
}

.event-info strong {
	font-size:30px;
	line-height:30px;
	margin-left:10px;
}

.event-info i {
	margin-right:3px;
	font-size:23px;
}
*/

/* ABONOS */
.table-zonas {
  font-size: 12px;
}

.table-zonas > tr {
  cursor: pointer;
  transition: all 0.3s;
}

.table-zonas > tr {
}

.table-zonas > tr th {
}

.table-zonas > tr td {
  font-size: 11px;
  padding: 11px;
}

.table-zonas > tr:hover {
  background-color: rgba(255, 0, 0, 0.3);
}

div.info-zone ul {
  padding: 10px 10px 5px;
  background: #fff;
  margin-top: 20px;
  margin: 0;
}

div.info-zone ul > li {
  list-style: none;
  border-bottom: 1px solid #ddd;
  padding: 4px 0;
  font-size: 11px;
}

div.info-zone ul > li .title {
  font-size: 14px;
}

div.info-zone ul > li:last-child {
  border: none;
}

.info-zone img {
  max-width: 230px;
}

.info-zone .info-price {
}

.info-zone .info-price i {
  width: 17px;
  height: 17px;
  background-color: #c00;
  color: #fff;
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  line-height: 17px;
  font-size: 14px;
}

.button.panzoom-button {
  margin: 10px 10px 20px;
  font-size: 26px;
  width: 40px;
  height: 40px;
  padding: 0px;
  line-height: 40px;
}

.place-wrapper img {
  max-width: 250px;
}

.place-wrapper .button {
  font-size: 20px;
  line-height: 1;
}

.selected-seats {
  padding: 10px;
  background-color: #fafafa;
  min-height: 110px;
  border: 1px solid #eee;
}

.selected-seats ol {
  padding-left: 12px;
  margin: 0 0 30px;
}

.selected-seats ol > li {
  border-bottom: 1px solid #ccc;
  padding: 8px 0;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
}

.selected-seats ol > li:last-child {
  border: none;
}

.selected-seats ol > li > div {
}

.selected-seats ol > li > div * {
  font-size: 11px;
}

.new-subscribers {
  min-height: 200px;
  background-color: #ededed;
}

.new-subscriber {
  padding-bottom: 21px;
  width: 33.333%;
  min-width: 290px;
}

.new-subscriber .info {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  line-height: 1.3;
}

.new-subscriber .info .number {
  padding: 5px 10px;
  font-size: 47px;
  line-height: 1;
  font-weight: 700;
  height: 100%;
  margin: 0 0 0 1px;
}

.new-subscriber .info > :not(.number) {
  padding: 4px 10px 4px 0;
  line-height: 1;
  font-size: 14px;
}

/* HOLI */
.new-subscriber-horizontal {
  width: 100%;
}

.new-subscriber-horizontal .form-group {
  display: inline-block;
  width: 32.233%;
}

.new-subscriber-horizontal .form-group.w-100 {
  min-width: 100%;
}

#card-payment {
  background: url(https://dev.sozpic.com/compralaentrada-teatros/images/visa_mastercard.png)
    no-repeat right top;
  background-size: 59px;
}

/* PANZOOM */

.svg-container {
  min-height: 300px;
}

.svgpanzoom-container {
  height: 0;
  padding-bottom: 100%;
  position: relative;
}
.svgpanzoom-container > svg {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  left: 0;
}

/* INFO ABONADO */
ul.info-abonado {
  padding: 0;
}

ul.info-abonado > li {
  list-style: none;
  padding: 8px 0;
  border-bottom: 1px solid #ededed;
}

ul.info-abonado > li:last-child {
  border: none;
}

/* NEW SUBSCRIBER CONFIRMATION */
.new-subscriber-confirmation {
  width: 100%;
  font-size: 14px;
}

.new-subscriber-confirmation label {
  font-size: 11px;
  margin: 0;
  padding: 0;
}

.new-subscriber-confirmation input,
.new-subscriber-confirmation textarea {
  background: none !important;
  border: none;
  font-size: 18px;
  padding: 0;
  margin: 0 0 7px;
}

.new-subscriber.new-subscriber-confirmation .info > :not(.number) {
  font-size: 18px;
}

.custom-popup {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(204, 0, 0, 0.7);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.custom-popup > div {
  padding: 60px 20px;
  background: #fff;
  box-shadow: 1px 1px 1px 1px #777;
  width: 470px;
  max-width: calc(100% - 40px);
}

.custom-popup > div .title {
}

.custom-popup > div .button {
  min-width: 140px;
  padding: 11px;
  font-size: 13px;
  margin: 0 10px;
}

.table-zonas {
}

.table-zonas th.th-color,
.table-zonas td.td-color {
  position: relative;
  width: 40px;
}

.table-zonas td.td-color:before {
  content: "";
  top: 50%;
  left: 50%;
  position: absolute;
  width: 30%;
  height: 30%;
  transform: translate(-50%, -50%);
  opacity: 1;
}

.table-zonas td.td-color.color-brown:before {
  background-color: #868565;
}

.table-zonas td.td-color.color-purple:before {
  background-color: #835b99;
}

.table-zonas td.td-color.color-blue:before {
  background-color: #2271b8;
}

.table-zonas td.td-color.color-red:before {
  background-color: #e84139;
}

.table-zonas tbody tr {
  transition: all 0.1s;
}

.table-zonas tbody tr:hover {
  cursor: pointer;
  background-color: #ededed;
}

/* HOLI */
.renovado {
  width: 20px;
  height: 20px;
}

.renovado-true {
  background-color: green;
}

.renovado-false {
  background-color: red;
}

.texto-descuento {
  text-decoration: line-through;
  font-size: 18px;
}

.recinto-zona * {
  transition: 0.2s;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  cursor: pointer;
}

.recinto-zona:not(.no-disponible):not(.plaza_ocupada):hover * {
  fill: green;
}

.recinto-zona.seleccionada * {
  fill: rgba(0, 128, 0, 0.404);
}

.recinto-zona.plaza_ocupada * {
    fill: rgba(255, 0, 0, 0.418);
    cursor: not-allowed;
}

.recinto-zona.plaza_bloqueada * {
  fill: rgba(255, 56, 56, 0.664);
  stroke: black;
  stroke-width: .3px;
}

.recinto-zona.no-disponible {
  opacity: 0.2;
  cursor: not-allowed;
}

/* NEW HEADER */
#preheader {
  margin-bottom: 0;
  padding: 2px 0px;
  font-size: 14px;
  min-height: 40px;
}

#header {
  padding: 0;
  position: relative;
  z-index: 4;
  position: fixed;
  width: 100%;
  left: 0;
  top: 0;
}

#header .logo {
  text-transform: uppercase;
  padding-left: 45px;
  display: flex;
  background-repeat: no-repeat;
  background-size: 40px;
  min-height: 40px;
  background-position: 0px center;
  align-items: center;
  color: #ffffff;
}

#header .logo .h4 {
  font-size: 13px;
}

#header .logo img {
}

#header ul.menu {
}

#header ul.menu {
  padding: 0;
}

#header ul.menu > li {
  list-style: none;
  margin: 0 0 0 30px;
  font-weight: 700;
  color: #555;
  font-size: 15px;
  text-transform: uppercase;
}

#header ul.menu > li > a {
  font-weight: 700;
  color: #555;
  font-size: 15px;
  text-transform: uppercase;
}

#header ul.menu > li:hover > a,
#header ul.menu > li.active > a {
  color: #cd362c;
  background: linear-gradient(90deg, var(--sitecolor), var(--altcolor));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#main {
  padding-top: 44px;
}

/* ASIDE */
#aside {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 3;
  visibility: hidden;
  -webkit-transition: opacity 0.5s, visibility 0.5s, -webkit-transform 0.5s;
  transition: opacity 0.5s, visibility 0.5s, -webkit-transform 0.5s;
  -o-transition: opacity 0.5s, visibility 0.5s, -o-transform 0.5s;
  transition: transform 0.5s, opacity 0.5s, visibility 0.5s;
  transition: transform 0.5s, opacity 0.5s, visibility 0.5s,
    -webkit-transform 0.5s, -o-transform 0.5s;
  will-change: transform, opacity, visibility;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  opacity: 0;
  padding: 70px 0px;
  width: 100%;
}

#aside:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #ededed;
  transition: all 0.5s;
  transform: translate3d(0, -100%, 0);
}

.menu-active #aside:before {
  transform: translate3d(0, 0%, 0);
}

#aside:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  background-image: url(img/bg_menu.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  transition: all 0.5s;
  background-position: center center;
}

.menu-active #aside:after {
  opacity: 0.08;
}

.menu-active #aside {
  opacity: 1;
  visibility: visible;
}

#aside > div {
  height: 100%;
  position: relative;
  z-index: 1;
}

#aside ul.menu {
  margin: 0 auto;
  list-style: none;
  overflow-x: hidden;
  padding: 70px 0 20px;
  text-align: right;
  background: url(../images/escudo.png) no-repeat center top;
  background-size: 50px;
}

#aside ul.menu > li {
  position: relative;
  margin: 0 0 28px;
  opacity: 0;
  transform: translate3d(0, -50px, 0);
  text-align: center;
}

.menu-active #aside ul.menu > li {
  transition: all 0.7s;
  opacity: 1;
  transform: translate3d(0, 0px, 0);
}

#aside ul.menu > li > a,
#aside ul.menu > li > del {
  display: inline-block;
  font-size: 23px;
  letter-spacing: 1px;
  padding: 2px 0;
  line-height: 1.1;
  font-family: "Oswald", sans-serif;
  outline: none;
}

#aside ul.menu > li > a {
}

#aside ul.menu > li.menu-item-has-children > a {
  padding-right: 20px;
}

#aside ul.menu > li ul {
  margin: 0;
  padding-left: 23px;
  display: none;
}

#aside ul.social-links {
}

#aside ul.social-links li {
  list-style: none;
  margin: 0 0 14px;
}

#aside ul.social-links li a {
  color: #1b1f28;
  font-size: 17px;
}

#aside ul.social-links li a i {
  min-width: 20px;
}

.hamburger-inner,
.hamburger-inner:after,
.hamburger-inner:before {
  background-color: #fff;
  width: 35px;
}
.hamburger-box {
  width: 35px;
}

.menu-active .hamburger .hamburger-inner,
.menu-active .hamburger .hamburger-inner:after,
.menu-active .hamburger .hamburger-inner:before,
.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner:after,
.hamburger.is-active .hamburger-inner:before {
  background-color: #fff;
}

/* FOOTER */
#footer {
  padding: 10px 0 20px;
  line-height: 1.3;
  margin-top: 0;
  font-family: "Oswald", s;
}

.prefooter {
  margin: 0 0 20px;
}

.prefooter ul.partners {
  padding: 0;
  display: flex;
  flex-wrap: wrap;
}
.prefooter ul.partners > li {
  list-style: none;
  padding: 0px 20px;
  width: 50%;
  margin: 0 0 20px;
}
.prefooter ul.partners > li a {
}
.prefooter ul.partners > li a img {
  filter: grayscale(1);
  width: 100px;
}

#footer .logo {
  margin: 0 0 10px;
  width: 160px;
  display: inline-block;
}

#footer .logo img {
  width: 100%;
}

#footer ul.menu {
  padding: 10px 0;
  text-align: center;
  display: flex;
  justify-content: center;
  margin: 0;
}

#footer ul.menu li {
  margin: 0 4px;
  list-style: none;
}

#footer ul.menu li a {
}

#footer .h3 {
  margin: 20px 0;
}

#footer ul.social-links {
  padding: 0;
}

#footer ul.social-links > li {
  list-style: none;
  margin: 0 0 5px;
}

#footer ul.social-links > li a {
  text-transform: uppercase;
}

/* TIMER */
.timer {
  position: fixed;
  font-weight: 700;
  text-align: center;
  background-color: var(--altcolor);
  color: var(--alttextcolor);
  border-bottom: 1px solid var(--alttextcolor);
  font-size: 30px;
  padding: 5px 0;
  line-height: 1;
  left: 0;
  bottom: 0;
  width: 100%;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 4;
}

.timer:before {
  content: "Entradas disponibles durante:";
  display: block;
  font-size: 16px;
  margin: 4px 5px 4px 0;
  text-align: right;
  font-family: "Oswald", sans-serif;
  text-transform: uppercase;
}

ul.legend {
}

ul.legend > li {
}

ul.legend > li:before {
}

ul.legend > li.green-content:before {
}

/* COOKIES */
.Cookie.Cookie--bottom {
  background: rgba(255, 255, 255, 0.8);
  max-width: 210px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  left: 50%;
  transform: translateX(-50%);
  color: #000;
  text-align: center;
  padding-bottom: 0;
  font-size: 12px;
}

.Cookie.Cookie--bottom .Cookie__content {
  line-height: 1.1;
  font-size: 10px;
}

.Cookie.Cookie--bottom .Cookie__buttons .Cookie__button {
  background: var(--altcolor);
  color: var(--alttextcolor);
  margin: 20px 0;
}

.map-wrapper {
  background: #ededed;
  padding: 10px;
}

.small-map {
}
.small-map .svgpanzoom-container {
  height: 200px !important;
}
.small-map .svgpanzoom-container svg {
  height: 200px !important;
}

.small-map .button.panzoom-button {
  margin: 5px;
  font-size: 15px;
  width: 25px;
  height: 25px;
  padding: 5px;
}

.popover {
  max-width: 350px !important;
}
.popover .arrow,
.popover .arrow:before,
.popover .arrow:after {
  display: none !important;
}

/* DATETIME */
.datetime {
}

.datetime .time {
}

.datetime {
  font-weight: 700;
  font-size: 1rem;
  line-height: 1;
  color: gray;
  margin: 1rem 0;
}

/* GRID */

ul.grid {
  /* padding:0; */
  /* display:
    flex; */
  /* flex-wrap:
    wrap; */
  padding-left: 0;
}

ul.grid > li {
  list-style: none;
  /*    align-content:flex-start;*/
  position: relative;
  /*    display:flex;*/
  background-color: #ededed;
  width: 100%;
  margin: 0 0 1rem;
}

ul.grid > li .thumb-container {
  min-width: 35%;
  position: relative;
  background-size: contain;
  min-height: 150px;
}
ul.grid > li.soldout .thumb-container:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  /*background: rgb(255 255 255 / 50%) url(../img/soldout.png) no-repeat center center;
    background-size: 100px;*/
}

ul.grid > li .content {
  width: 100%;
  /* display: flex; */
  /* flex-wrap: wrap; */
  padding: 10px;
}

ul.grid > li .content > * {
  padding: 0;
}
ul.grid > li .content footer {
  align-items: center;
}

ul.grid > li .author {
}

ul.grid > li .title {
  margin: 0;
  font-size: 17px;
  /* display:flex; */
  /* align-items:center; */
  /* justify-content:center; */
  margin: 0 0 8px;
}

ul.grid > li .content .price {
  width: 100%;
  margin: 0 0 10px;
  font-size: 12px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

ul.grid > li .datetime {
  font-size: 12px;
  margin: 0 0 1rem;
}

ul.grid > li .button {
  font-size: 0.6rem;
  padding: 0.4rem 0.8rem;
}

ul.grid > li .address {
}

.circulo {
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 20px;
}

.circulo.disponible {
  background-color: green;
}

.circulo.no-disponible {
  background-color: red;
}

.info-container {
  background-color: lightgray;
  display: inline-block;
  width: 20px;
  height: 20px;
  border-radius: 20px;
  text-align: center;
}

/* MATCHES */

ul.matches {
  padding: 0;
}
ul.matches > li {
  margin: 0rem 0 1rem;
  border-bottom: 1px solid #ccc;
  padding: 1rem 0;
}
ul.matches > li:last-child {
  border-bottom: none;
}
ul.matches > li > * {
  margin: 0 0 0.9em;
}
ul.matches > li .vs {
  font-weight: bold;
  font-size: 2rem;
  line-height: 1;
  margin: 0;
  color: #555555;
  background: none;
  -webkit-text-fill-color: #555555;
  -webkit-background-clip: inherit;
}
ul.matches > li .team {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  flex-direction: column-reverse;
  width: calc(50% - 70px);
}
ul.matches > li .team > * {
}
ul.matches > li .team .shield img {
  width: 3.2rem;
  height: auto;
  margin: 0 0 0.5rem;
}
ul.matches > li .team .title {
}
ul.matches > li .info {
  width: 140px;
  font-family: "Oswald", sans-serif;
}
ul.matches > li .info .date {
  font-weight: bold;
  font-size: 0.7rem;
}
ul.matches > li .info .time {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 1.1;
}
ul.matches > li .info small {
  max-width: 100px;
  line-height: 1.1;
}
ul.matches > li .info .competition {
  width: 100%;
}
ul.matches > li .info .competition img {
  width: 3.5rem;
  display: block;
  margin: 0 auto 0.2rem;
}
ul.matches > li .actions {
  width: 100%;
  margin: 0.9rem 0px;
  gap: 5px;
}
ul.matches > li .actions .button {
  min-width: 0px;
  width: 100%;
}

/* SINGLE MATCH  */

.match-info-section {
  max-width: 100%;
  position: relative;
  margin: -30px auto 30px;
}
.match-info-section .match-info {
  max-width: 570px;
  margin: auto;
  background: #ffffff;
  padding: 30px 10px;
  border: 1px solid #eeeeee;
}
.match-info-section .match-info .team {
  width: 100px;
  padding: 0 10px;
}
.match-info-section .match-info .team .title {
  font-size: 15px;
}
.match-info-section .match-info .team .shield {
  background-color: white;
  width: 100%;
  display: block;
}
.match-info-section .match-info .team .shield img {
  width: 100%;
}
.match-info-section .match-info .info {
}
.match-info-section .match-info .competition {
  margin: 10px 0px 0px;
}
.match-info-section .match-info .competition img {
  display: block;
  margin: 0 auto 7px;
  width: 50px;
}
.match-info-section .match-info .date {
  font-weight: bold;
}
.match-info-section .match-info .time {
  font-size: 22px;
  line-height: 1;
  font-weight: bold;
}
.match-info-section .match-info small {
}

/* EVENT SINGLE */

.single-event .section-title {
  padding-top: 150px;
  background-color: rgba(0, 0, 0, 0.2);
}

.info-section {
  max-width: 100%;
  position: relative;
  margin: -30px auto 10px;
}

.info-section .event-info {
  max-width: 570px;
  margin: auto;
  background: #ffffff;
  padding: 20px 10px;
  border: 1px solid #eeeeee;
}
.info-section .event-info .content {
}
.info-section .event-info .content .title {
}
.info-section .event-info .content .subtitle {
}

/* RESUMEN DE COMPRA */

ul.resumen {
  margin: 0 0 20px;
  font-size: 12px;
  display: flex;
  flex-wrap: wrap;
  padding: 00;
}

ul.resumen > li {
  list-style: none;
  margin: 0px 0 15px;
  padding-bottom: 14px;
  border-bottom: 1px solid #dddddd;
  display: flex;
  width: 50%;
  background: #ededed;
  padding: 7px;
  margin: 0;
  align-items: center;
  flex-wrap: wrap;
}
ul.resumen > li:last-child {
  /* border-bottom: none; */
}
ul.resumen > li label {
}
ul.resumen > li label:after {
  content: ":";
  margin-right: 10px;
}

.price.price-large {
  font-family: "Oswald", sans-serif;
  font-size: 60px;
  font-weight: bold;
}

.home-links {
  padding: 0;
  display: flex;
  flex-wrap: wrap;
}
.home-links > div {
  list-style: none;
  width: calc(50% - 20px);
  margin: 0 0px 20px;
  display: flex;
}
.home-links > div > a {
  padding: 20px;
  background-color: transparent;
  display: block;
  text-align: center;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  color: var(--alttextcolor);
}

.home-links > div.disabled > a {
  cursor: not-allowed;
}

.home-links > div.disabled > a:hover .thumb-container {
  opacity: 0.8;
}
.home-links > div > a .thumb-container {
  background-image: none !important;
  opacity: 1 !important;
}
.home-links > div > a .thumb-container:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transition: all 0.4s;
  background-color: var(--altcolor);
  opacity: 0.6;
}
.home-links > div > a:hover .thumb-container:before {
  opacity: 1;
}
.home-links > div > a span {
  font-family: "Oswald";
  font-size: 13px;
  font-weight: bold;
  position: relative;
  text-transform: uppercase;
}
.home-links > div > a:hover span {
}

.title-content {
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 210px;
  min-height: 100px;
  padding: 150px 0 0;
  margin: 10px auto 70px;
  text-align: center;
  color: #fff;
}
.title-content .title {
  font-size: 27px;
}
.title-content .subtitle {
  /* font-weight: bold; */
  max-width: 300px;
  margin: auto;
  font-size: 14px;
  background-color: rgba(0, 0, 0, 0.2);
  padding: 20px;
}

.club-title-content {
  background-repeat: no-repeat;
  background-size: 60px;
  min-height: 100px;
  padding-left: 70px;
  margin: 10px auto 30px;
  display: inline-block;
  text-align: left;
}
.club-title-content .title {
  line-height: 1.1;
  text-transform: uppercase;
}

.by-cle {
  display: block;
  text-decoration: none;
  margin-top: 30px;
  text-align: center;
}
.by-cle span {
  display: block;
  margin: 0 0 12px;
  font-family: "Oswald", sans-serif;
  font-size: 16px;
}
.by-cle img {
  width: 280px;
}

.selected-tickets {
  text-align: left;
  margin: 20px 0px;
}
.selected-tickets ul {
  padding: 0;
  border: 1px solid #cccccc;
  border-bottom: none;
}
.selected-tickets li {
  padding: 0;
  list-style: none;
  border-bottom: 1px solid #ccc;
  padding: 10px 5px;
  font-size: 14px;
}

/* SVG */

#cesped-recinto {
  position: relative;
  padding: 20px 10px;
  background: #a8d192;
  color: #ffffff;
  margin: 10px 0px 20px;
  border: 3px solid green;
  /* border-radius: 0 0 20px 20px; */
  border-top: none;
  font-size: 41px;
  letter-spacing: 0;
  font-weight: bold;
  min-height: 100px;
  font-size: 22px;
  text-align: center;
  font-weight: bold;
}
.butaca.libre {
  background: rgb(169, 209, 146);
}
.butaca {
  width: 18px;
  height: 18px;
  margin-right: 3px;
  margin-bottom: 1px;
  line-height: 2.3;
  border-radius: 50%;
  cursor: pointer;
  text-align: center;
  display: inline-block;
  font-size: 8px;
  min-width: 20px;
  -webkit-font-smoothing: initial;
}
.butaca.ocupada {
  background-color: #cc0000;
  color: #ffffff;
}

.butaca.columna {
  background-color: #ffffff;
  color: #ffffff;
  visibility: hidden;
  opacity: 0;
  touch-action: none;
}

.butaca.columna_n {
  background-color: #ffffff;
  color: #ffffff;
  visibility: hidden;
  opacity: 0;
  touch-action: none;
}

.hidden-seats .butaca.oculto {
  background-color: #d2d3d4;
  color: #000000;
}

.hidden-seats .butaca.columna {
  background-color: #343deb;
  color: #ffffff;
  visibility: visible;
  opacity: 1;
  touch-action: auto;
}

.hidden-seats .butaca.columna_n {
  background-color: #b30202;
  color: #ffffff;
  visibility: visible;
  opacity: 1;
  touch-action: auto;
}
.butaca.seleccionada {
  background-color: #8ca9d9;
}

.fila {
  font-size: 11px;
  display: inline-block;
  text-align: right;
  vertical-align: middle;
  color: #444;
  position: absolute;
  left: -20px;
  top: 4px;
}
.container-butacas {
  display: inline-block;
  position: relative;
  padding: 0;
  overflow-x: visible;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  margin: 0 0 0px;
}
.container-butacas.text-align-right {
  text-align: right;
}

/*
.container-butacas.text-align-right {
    padding: 0 20px 20px 0px;
}

.container-butacas.text-align-right .fila{
	left: inherit;
	right: -20px;
}

.container-butacas.text-align-right > * {
    justify-content: flex-end;
}*/

.container-butacas-wrapper {
  overflow: hidden;
  position: relative;
  display: block;
  position: relative;
  padding: 10px 10px 10px 25px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  margin: 0 0 20px;
  background-image: /* Shadows */ linear-gradient(to right, white, white),
    linear-gradient(to right, white, white),
    /* Shadow covers */
      linear-gradient(to right, rgba(0, 0, 0, 0.25), rgba(255, 255, 255, 0)),
    linear-gradient(to left, rgba(0, 0, 0, 0.25), rgba(255, 255, 255, 0));
  background-position: left center, right center, left center, right center;
  background-repeat: no-repeat;
  background-color: white;
  background-size: 20px 100%, 20px 100%, 10px 100%, 10px 100%;

  /* Opera doesn't support this in the shorthand */
  background-attachment: local, local, scroll, scroll;
  border: 1px solid #ededed;
}
/*.container-butacas-wrapper:after {
    content: "";
    display: block;
    height: 100%;
    position: absolute;
    top: 0;
    width: 25px;
    z-index: 2;
}
.container-butacas-wrapper:after {
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, #fff 100%);
    right: 0;
}

.container-butacas-wrapper > *{
	padding-left: 20px;
	padding-right: 20px;
}*/

/*
.container-butacas:before {
    content: "";
    display: block;
    height: 100%;
    position: absolute;
    top: 0;
    width: 25px;
    z-index: 2;
}
.container-butacas:before {
    background: linear-gradient(to left, rgba(255,255,255,0) 0%, #fff 100%);
    left: 0;
}*/

.container-butacas > * {
  position: relative;
  display: inline-block;
  width: 100%;
  justify-content: flex-start;
  white-space: pre;
}
.container-butacas > * > span:last-child {
  margin-right: 40px;
}

/* INFOLIST */

ul.info-list {
}
ul.info-list > li {
  border-bottom: 1px solid #ccc;
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  padding-bottom: 9px;
  margin-bottom: 9px;
  align-items: center;
}
ul.info-list > li label {
  margin-right: 10px;
  margin: 0 10px 0 0;
}

/* LOADER */

.custom-loader {
  background-color: #ffffff;
  position: fixed;
  height: 100%;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 5;
}

.custom-loader-absolute {
  position: absolute !important;
  z-index: 3;
}
.custom-loader > div {
}
.custom-loader > div .escudo {
  width: 90px;
}
.custom-loader > div .oval {
  display: block;
  margin: auto;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 110px;
}

body .VueCarousel {
}
body .VueCarousel .VueCarousel-slide {
}
body .VueCarousel .VueCarousel-slide a {
  display: block;
  padding: 10px;
}
body .VueCarousel .VueCarousel-slide a img {
  max-height: 130px;
  width: auto;
}

body .VueCarousel .VueCarousel-dot-container {
  margin-top: 0;
}

.toast {
  flex-basis: unset;
}

.scroll-smooth {
  scroll-behavior: smooth;
}

/* RESPONSIVE (768, 992, ..) */

@media (min-width: 992px) {
  /* general */

  html body {
  }

  body .table thead th {
    font-size: 14px;
  }

  body .table thead td {
    font-size: 12px;
  }

  /* aside */

  #aside {
    display: none;
  }

  #main {
    padding-top: 92px;
  }
  .timer {
    padding: 0px;
    bottom: inherit;
    top: 0;
  }

  /* forms */

  input,
  textarea,
  input.form-control,
  textarea.form-control {
    padding: 20px;
  }

  .form-control .error {
    background-color: red;
  }

  /* buttons */

  .button.large-button {
    font-size: 16px;
    padding: 12px 30px;
    min-width: 200px;
  }

  /* head */
  #head.logged .logo {
  }

  .form-content {
    padding: 40px 30px;
  }
  .form-content .button {
    font-size: 13px;
    padding: 10px 20px;
    min-width: 115px;
  }

  .form-content.form-team-content .thumb-container {
  }

  #header {
    margin: 0;
    border-bottom: 1px solid #ededed;
    background-color: #ffffff;
    padding: 0;
  }

  #header .logo {
    background-size: auto 60px;
    min-height: 60px;
    padding-left: 70px;
    color: var(--sitecolor);
  }

  #preheader {
    min-height: 0px;
    margin: 0;
  }

  /* fonts headings titles */

  h1,
  .h1 {
    font-size: 40px;
  }
  h2,
  .h2 {
    font-size: 35px;
  }
  h3,
  .h3 {
    font-size: 28px;
  }
  h4,
  .h4 {
  }
  h5,
  .h5 {
  }
  h6,
  .h6 {
  }

  .section-title {
  }

  .section-title h1 {
    font-size: 42px;
  }
  .pagel-login .panel-heading,
  .pagel-login .section-title {
    font-size: 40px;
    margin: 30px 0 20px;
    text-shadow: 1px 1px 16px #4c4c45;
  }

  .search-form {
  }

  .search-active .search-form {
  }

  .search-form > div {
  }

  .search-form .form-group {
    margin: 0;
  }

  .search-form .form-group input {
    padding: 1.2rem;
  }

  .search-form input[type="submit"] {
    font-size: 1.2rem;
  }

  /* user content */
  .user-content > div {
    width: 100%;
    top: 43px;
    max-width: 350px;
  }

  .user-content > div > div {
    height: 250px;
  }

  .user-content > a span.user-name {
    font-size: 13px;
    padding-right: 1.3rem;
    padding-top: 0.1rem;
  }

  /* main content */
  #app:not(.page-login) #main-content {
    margin: 20px 0 30px 210px;
    background-color: rgba(255, 255, 255, 0.98);
    padding: 20px 30px;
    min-height: calc(100vh - 60px);
    border-radius: 3px;
    max-width: calc(100% - 220px);
  }

  #home-section .home-link > * {
    font-size: 53px;
  }

  #home-section:before {
    width: 140px;
    height: 238px;
  }

  .post-title-section {
    max-width: 1500px;
    position: relative;
    transform: translate(-50%, -50%);
    left: 50%;
  }

  .selling-features {
    padding: 0.4rem 0;
    margin: 0;
    justify-content: center;
  }
  .selling-features > li {
    list-style: none;
    width: auto;
    padding: 0.3rem 1rem;
    border-bottom: none;
    border-right: 1px solid;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
  }
  .selling-features > li:nth-child(1),
  .selling-features > li:nth-child(3) {
    border-left: none;
  }
  .selling-features > li:last-child {
    border-right: none;
  }
  .selling-features > li svg {
    height: 28px;
  }
  .selling-features > li svg > * {
    /* fill: #ffffff; */
    fill: var(--alttextcolor);
  }
  .selling-features > li span {
    display: block;
    padding: 5px 9px 0;
    font-size: 0.85rem;
  }
  .selling-features > li span.icon {
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 1.1;
    height: 36px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* GRID */

  ul.grid {
    /* display:
        flex; */
    /* flex-wrap:
        wrap; */
    /* align-content:
        flex-start; */
    margin: 0 -10px;
    columns: 2 400px;
    column-gap: 1rem;
  }

  ul.grid > li {
    max-width: none;
    margin: 0 0 15px;
    position: relative;
    /* min-height: 210px; */
  }
  ul.grid > li .content {
    padding: 15px;
    flex: 1;
    display: flex;
    flex-wrap: wrap;
    align-content: space-between;
  }

  ul.grid > li .content > * {
    width: 100%;
  }
  ul.grid > li .thumb-container {
    width: 100%;
    padding-bottom: 34%;
  }
  ul.grid > li.soldout .thumb-container:before {
    background-size: 200px;
  }
  ul.grid > li .title {
    font-size: 32px;
    margin: 0 0 6px;
  }
  ul.grid > li .datetime {
    font-size: 16px;
  }
  ul.grid > li .content .price {
    margin: 0 0 10px;
    font-size: 14px;
    -webkit-line-clamp: 3;
  }
  ul.grid > li .button {
    font-size: 15px;
    padding: 9px 30px;
  }

  ul.grid > li .content footer {
  }

  /* MATCHES */

  ul.matches {
  }
  ul.matches > li {
    padding: 0rem 0 2rem;
    margin: 0 0 2rem;
  }
  ul.matches > li .team {
    align-items: center;
    margin: 0;
    padding: 0 1rem;
    width: 22%;
  }
  ul.matches > li .team > * {
  }
  ul.matches > li .team .shield {
  }
  ul.matches > li .team .shield img {
    margin: 0;
    width: 5.3rem;
  }
  ul.matches > li .team .title {
    font-size: 1.1rem;
    margin: 0 5px;
  }
  ul.matches > li .info {
    min-width: 230px;
    width: auto;
    margin: 0;
  }
  ul.matches > li .info .date {
    font-size: 1.1rem;
    text-align: center;
  }
  ul.matches > li .info .time {
    font-size: 2.8rem;
    line-height: 1;
  }
  ul.matches > li .info small {
    font-size: 0.87rem;
    text-align: center;
  }

  ul.matches > li .info .competition {
    border-left: 1px solid #cccccc;
    border-right: 1px solid #ccc;
    width: auto;
    padding: 0 1rem;
    margin: 0 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  ul.matches > li .info .competition img {
    width: 3.7rem;
  }
  ul.matches > li .competition img {
  }
  ul.matches > li .actions {
    width: auto;
    min-width: 232px;
    margin-top: 2.6rem;
  }
  ul.matches > li .actions .button {
    margin-left: 0.5rem;
    margin-bottom: 0.4rem;
  }

  /* search form */
  .search-form > div .title {
    font-size: 2.4rem;
    margin-top: 3rem;
  }

  /* main section */
  /* USERS */
  ul.users {
  }

  ul.users > li {
    width: 33.333%;
    max-width: 230px;
  }

  ul.users > li > div {
  }

  ul.users > li > div .thumb-container {
    width: 80px;
    height: 80px;
    left: calc(50% - 40px);
    top: -40px;
  }

  ul.users > li > div .title {
  }

  ul.users > li > div .subtitle {
  }

  ul.users > li > div .button {
  }

  ul.grid > li {
    margin: 0 10px 20px;
    /* min-height: 300px; */
    /* width: calc(50% - 20px); */
    /* display: flex; */
    flex-wrap: wrap;
    /* align-items: stretch; */
    /* align-content: space-between; */
    /* flex-direction: column; */
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* single match  */

  .match-info-section {
    max-width: 100%;
    margin: -60px auto 30px;
  }
  .strech + .match-info-section {
    margin: -40px auto 0px;
  }
  .match-info-section .match-info {
    max-width: 600px;
    padding: 30px 10px;
  }
  .match-info-section .match-info .team {
    width: 220px;
    padding: 0 10px;
  }
  .match-info-section .match-info .team .title {
    font-size: 21px;
  }
  .match-info-section .match-info .team .shield {
    width: 150px;
  }
  .match-info-section .match-info .team .shield img {
  }
  .match-info-section .match-info .info {
    width: 200px;
    padding: 0 20px;
  }
  .match-info-section .match-info .competition {
    margin: 10px 0px 0px;
  }
  .match-info-section .match-info .competition img {
    width: 70px;
    margin: 0 auto 16px;
  }
  .match-info-section .match-info .date {
    font-size: 20px;
    line-height: 1;
  }
  .match-info-section .match-info .time {
    font-size: 42px;
  }
  .match-info-section .match-info small {
    font-size: 13px;
  }

  /* single event */

  .single-event .section-title {
    padding-top: 280px;
    background-color: rgba(0, 0, 0, 0.2);
    max-width: 1140px;
    margin: auto;
  }

  .info-section {
    margin: -100px auto 30px;
  }

  .info-section .event-info {
    max-width: 570px;
    margin: auto;
    background: #ffffff;
    padding: 20px 10px;
    border: 1px solid #eeeeee;
  }
  .info-section .event-info .content {
  }
  .info-section .event-info .content .title {
    font-size: 53px;
  }
  .info-section .event-info .content .subtitle {
    font-size: 24px;
  }

  /* resumen */

  ul.resumen {
    font-size: 14px;
  }

  #paso3 .resumen {
  }

  ul.resumen > li {
    width: 25%;
    padding: 20px 10px;
  }
  ul.resumen > li.white-content {
    border-bottom: none;
  }

  ul.resumen > li label {
    /* width: 100%; */
  }
  ul.resumen > li:last-child {
    /* border-bottom: none; */
  }
  ul.resumen > li label {
    margin: 0;
  }
  ul.resumen > li label:after {
    content: ":";
    margin-right: 10px;
  }

  .price.price-large {
    font-family: "Oswald", sans-serif;
    font-size: 80px;
    line-height: 1;
    font-weight: bold;
  }

  /* HOME */

  .title-content {
    background-size: 320px;
    min-height: 100px;
    padding: 200px 0 0;
    margin: 10px auto 40px;
    text-align: center;
    color: #fff;
  }
  .title-content .title {
    font-size: 46px;
  }
  .title-content .subtitle {
    max-width: 590px;
    font-size: 17px;
  }

  .club-title-content {
    background-size: 100px;
    min-height: 110px;
    padding-left: 100px;
    margin: 0px auto 0px;
  }
  .club-title-content .title {
    font-size: 56px;
    line-height: 1;
    text-transform: uppercase;
  }

  .club-title-content .subtitle {
    font-size: 28px;
    margin: 0 0 20px;
    text-transform: initial;
  }

  .home-links {
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
  }
  .home-links > div {
    list-style: none;
    /* width: calc(25% - 20px); */
    margin: 0 0px 20px;
  }
  .home-links > div > a {
    min-height: 179px;
  }
  .home-links > div > a .thumb-container {
  }
  .home-links > div > a span {
    font-size: 40px;
  }
  .home-links > div > a:hover span {
  }

  .prefooter ul.partners > li {
    width: auto;
  }
  .prefooter ul.partners > li {
  }

  /* PANZOOM */

  .svg-container {
    min-height: 500px;
  }

  .svgpanzoom-container {
    padding-bottom: 65%;
  }
  .svgpanzoom-container svg {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    left: 0;
  }

  /* popover */

  .popover .arrow,
  .popover .arrow:before,
  .popover .arrow:after {
    display: none !important;
  }
}

@media (min-width: 1200px) {
  .padding-vertical-content {
    padding: 40px 0px;
  }
  .panel-heading,
  .section-title {
    padding: 70px 0px 100px;
  }
  .panel-heading,
  .section-title.strech {
    padding: 40px 0px;
  }

  .padding-vertical-content.right-background .thumb-container {
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
    height: 100%;
    left: inherit;
    opacity: 1;
    filter: grayscale(0.2);
  }

  ul.users > li {
    width: 20%;
    max-width: none;
  }

  ul.tree {
    width: 320px;
  }

  .new-subscribers {
    display: flex;
    flex-wrap: wrap;
  }

  .new-subscribers {
  }
}