/*** GENERAL ***/

html, body {
    font-family: easyreading;
    font-size: 18px;
    color: var(--pri-clr);
}

body {
    background: #3B3B3B;

    background-attachment: fixed;
    background-size: cover;
    height: 100%;
}

ul, ol {
    text-align: center;
}

ul {
    list-style-position: inside;
}

a, .button {
    -moz-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
    -webkit-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
    -ms-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
    transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
    border-bottom: 0;
    color: var(--ter-clr);
    text-decoration: none;
    margin: 0 0 1em 0;
    font-weight: 700;
}

a:hover {
    text-decoration: none;
    color: rgba(var(--ter-rgb), 0.35);
    border-color: rgba(var(--ter-rgb), 0.35);
}

form button {
    color: var(--ter-clr)
}

strong, b {
    color: rgba(var(--pri-rgb), 0.9);
}

input, select, textarea {
    font-family: inherit;
    text-align: center;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--pri-clr);
    font-weight: 700;
    letter-spacing: 0.1em;
    margin: 0 0 1em 0;
    text-transform: uppercase;
}

h1 a, h2 a, h3 a {
    border-bottom: dotted 1px rgba(var(--pri-rgb), 0.35);
    color: var(--pri-clr);
    text-decoration: none;
}

form {
    margin: 0 auto 1em;
}

.selector {
    width: 100% !important;
}

.selector-available, .selector-chosen {
    width: 48% !important;
}

.selector select {
    width: 100% !important;
}

.inner h2 {
    margin: 0.5em 0 0.5em 0;
    font-size: 1.5em;
}

.inner h3 {
    margin: 0.5em 0 0.25em 0;
    font-size: 1.3em;
}

h4 {
    margin: 0;
    font-size: 1.3em;
}

#menu .inner {
    background-color: #62c4c9;
}

#menu .inner,
#menu .inner h2 {
    color: #173d3d;
}

#banner {
    margin: 0;
    padding: 0 0 0.2em 0;
}

#banner h1 {
    padding: 0.5em 5em 0.5em 6em;
    height: 2.2em;
    text-align: center;
    line-height: 1.2;
    margin-bottom: 0em;
    font-size: 1.8em;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media screen and (max-width: 736px) {
    #banner h1 {
        font-size: 1.3em;
        height: 2.5em;
    }
}

#header nav {
    top: 1em;
    right: 1.5em;
}

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

  #header nav {
        top: 0.25em;
        right: 1em;
    }

    #menu-open img, #sidebar-open img {
        top: 0.95em;
    }
}

#header {
    background-color: rgba(var(--sec-rgb), 0.7);
    color: var(--pri-clr);
}

#header {
    height: 4em;
}

#header h1 {
    font-size: 1.2em;
    margin: 0.2em;
    text-align: center;
    padding: 0;
}

.header_logo {
    border-radius: 50%;
    height: 2.5em;
    float: left;
    margin: 0.7em;
    margin-right: 1em;
}

.alt .header_logo {
    display: none;
}

.main_logo {
    border-radius: 50%;
    width: 1.1em;
    vertical-align: middle;
    margin-right: 0.5em;
}

#footer {
    margin-top: 3em;
    padding: 0 0 1em 0;
}

#footer .inner {
    text-align: center;
    }

#footer h2 {
    margin: 0 0 0.2em 0;
    padding: 0;
    border: 0;
}

#banner, #one {
    background: none;
}

#footer {
    background: none;
    margin: 0 auto;
}

#banner .inner, #one .inner, #footer .inner {
    background: none;
    width: 100%;
    padding: 0 1em;
}

.staff form {
    margin: 0;
}

h1 {
    font-size:150%;
}

h1, h2, h3, h4 {
    margin: 0.5em;
}

h2 {
    text-align: center;
}

hr {
    clear: both;
    margin: 0.2em 0;
}

.errorlist {
    color: red;
}

th, td {
    vertical-align: middle;
    padding: 0.8em;
    text-align: center !important;
}

.staff .links th {
    text-align: right !important;
}

.staff .links h3 {
    margin-right:2em;
}

form ul {
    margin: 0em;
}

form ul li {
    display: inline-block;
    margin: 0.5em;
}

form ul li input[type="checkbox"] {
    display: inline-block;
}

.c {
    text-align: center;
}

.home {
    text-align: center;
    margin-bottom: 2em;
}

.home a {
    font-size:120%;
    padding: 1em;
    background-color: rgba(var(--pri-rgb), 0.25);
    border: solid 1px rgba(var(--pri-rgb), 0.25);
    border-radius: 1em;
}

.nav a {
    padding: 0.3em 0.5em;
    margin: 0.2em;
    color: var(--pri-clr);
    background-color: rgba(var(--pri-rgb), 0.25);
    border: solid 1px rgba(var(--pri-rgb), 0.25);
    border-radius: 0.5em;
    white-space: nowrap;
    line-height: normal;
    display: inline-block;
}

.nav a.sel {
    color: var(--sec-clr);
    background-color: rgba(var(--pri-rgb), 0.35);
    border: solid 1px rgba(var(--pri-rgb), 0.35);
}

.nav a.nsel {
    color: var(--ter-clr);
    background-color: rgba(var(--sec-rgb), 0.35);
    border: solid 1px rgba(var(--sec-rgb), 0.35);
}


.lm_tooltip .staff {
    color: var(--sec-clr);
    background-color: rgba(var(--pri-rgb), 0.42);
    border: solid 1px rgba(var(--pri-rgb), 0.42);
}

.lm_tooltip .orga {
    color: var(--sec-clr);
    background-color: rgba(var(--pri-rgb), 0.50);
    border: solid 1px rgba(var(--pri-rgb), 0.50);
}

.nav2 a {
    background: none;
    border: none;
}

p {
    margin: 0.5em;
}

label {
    margin: 0;
}

.wrapper {
    margin: 0 auto;
}

.wrapper:before, .wrapper:after {
    height: 0em !important;
}

.wrapper .inner {
    padding: 0;
    text-align: center;
}

.b {
    font-weight: bold;
}

.tox button {
    color: black !important;
}

#menu-open img, #sidebar-open img {
    margin: auto;
    top: 0.3em;
    position: relative;
    display: inline-block;
}

.go-inline b {
    font-size: 110%;
}

.go-inline p {
    display: inline;
    margin-left: 0;
    margin-right: 0;
}

.reveal {
    display: none;
    margin: 1em;
    padding: 1em;
    background-color: rgba(var(--pri-rgb), 0.025);
    border: solid 1px rgba(var(--pri-rgb), 0.125);
    border-radius: 1em;
}

input[type="checkbox"],
input[type="radio"] {
-moz-appearance: checkbox;
-webkit-appearance: checkbox;
-ms-appearance: checkbox;
appearance: checkbox;
display: inline;
float: none;
margin:0;
opacity: 1;
width: 1em;
z-index: -1;
}

input[type="slug"],
input[type="number"],
input[type="date_p"],
input[type="time_p"],
input[type="datetime_p"] {
-moz-appearance: none;
-webkit-appearance: none;
-ms-appearance: none;
appearance: none;
background: rgba(var(--pri-rgb), 0.025);
border-radius: 5px;
border: none;
border: solid 2px rgba(var(--pri-rgb), 0.125);
color: inherit;
padding: 0 1em;
text-decoration: none;
display: block;
margin: 0 auto;
}

input[type="slug"]:invalid,
input[type="number"]:invalid,
input[type="date_p"]:invalid,
input[type="time_p"]:invalid,
input[type="datetime_p"]:invalid {
    box-shadow: none;
}

input[type="slug"]:focus,
input[type="number"]:focus,
input[type="date_p"]:focus,
input[type="time_p"]:focus,
input[type="datetime_p"]:focus {
    border-color: #5b6ba6;
}

    input[type="number"], select {
        width: auto;
        margin: 0 auto;
        padding: 0.5em;
    }

#menu h2 {
    padding-bottom: 0.1em;
    margin-bottom:0.5em;
}

#menu .links {
    margin-bottom: 0em;
    font-weight: 900;
}

#menu li {
    padding: 0.3em;
}

#menu .inner {
    padding:1em;
}

#menu .links li a {
    margin: 0em;
        font-size: 90%;
}

/*** CALENDARIO ***/

.run_list hr {
    margin: 1em 0;
}

.run_list .descr {
    padding-left: 2em;
}

.calendar {
    border-top: solid 1px rgba(var(--pri-rgb), 0.125);
}
.event{
    border-bottom: solid 1px rgba(var(--pri-rgb), 0.125);
    padding: 0.5em 1em;
    display: flex;
}

.calendar .helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.event .img {
    width: 35%;
    text-align: center;
    background: center center no-repeat;
    background-size: contain;
}

.event .text {
    padding-left: 1em;
    float: right;
    width: 69%;
    text-align: center;
}
.event:nth-child(odd) {
    background-color: rgba(var(--pri-rgb), 0.025);
}

.gallery .text {
    width: 100%;
    text-align: left;
    padding: 0 1em;
}

/*** graphite ***/

.graphite-container, .graphite-column-label {
    color: var(--pri-clr) !important;
}

.graphite-container hr {
    margin: 0!important;
}

/*** tooltip ***/

.lm_tooltip {
  position: relative;
  display: inline;
}

.lm_tooltiptext {
    display: none;
}

/*** show_char ***/

.has_show_char {
    display: inline-block;
}

.has_show_char a {
    color: var(--ter-clr);
}

.show_char {
    line-height: 1;
}

.show_char b {
    color: white;
}

.show_char span {
    margin: 0.2em;
    padding: 0.2em;
    display: block;
}

.show_char .teaser {
  font-size: 85%;
  line-height: 1;
  display: block;
}

.show_char .name {
  font-size: 140%;
}

.show_char .title {
  font-size: 120%;
}

.show_char img {
  float: right;
  height: 8em;
  width: 8em;
  margin-left: 1em;
  border-radius: 10%;
}

#main_grid select {
    width: auto;
    background-size: 0.5em;
    height: auto;
    padding-right: 0.5em;
    display: inline;
    margin: 0 0.5em 0 0;
}

#main_casting .NO {
    color: red;
}

#main_casting .MR {
    font-weight: bold;
    color: blue;
}

#main_casting .EP {
    font-weight: bold;
    color: yellow;
}

#main_casting .CH {
    font-weight: bold;
    color: green;
}

#main_grid .sel {
    color: orange;
}

.writing th, .writing td {
    word-wrap: break-word;
}

.writing .name {
    font-size: large;
}

.writing th, .writing td {
    padding: 1em;
}

/*** GALLERY ***/

.title {
    font-size: 200%;
    text-align: center;
    clear: both;
    margin: 0em;
}

.gallery {
    width: 100%;
}

.gallery .el {
    width: 20%;
    float: left;
    margin-bottom: 2em;
    text-align: center;
}

.single .el {
    float: right;
    margin: 0 1em 1em;
    width: 15em;
}

.gallery .badge {
    width: 25%;
    margin: 0.5em 0;
}

.single .badge {
    float: left;
}

.gallery .icon {
    padding: 0.5em;
    background-color: rgba(var(--pri-rgb), 0.025);
    border: solid 1px rgba(var(--pri-rgb), 0.125);
    border-radius:5%;
    height:100%;
    margin: 0 auto;
    position: relative;
    width:95%;
}

.gallery .album-icon {
        height:6em;
}

.gallery .badge .icon {
    width: 90%;
    height: auto;
    font-size: 110%;
    white-space: normal;
}

.gallery .icon .icon-name {
    position: absolute;
    bottom: 0em;
    right: 0;
    left: 0;
    font-size: 140%;
    font-weight: bold;
}

.icon-name p {
    padding: 0.3em;
    background-color: rgba(var(--sec-rgb), 0.7);
    border: solid 1px rgba(var(--pri-rgb), 0.125);
    border-radius:0.5em;
    margin: 2em;
    color: var(--pri-clr);
}

.gallery .icon .icon-name p {
    margin: 1.5em;
}

.gallery .icon img {
    width: 100%;
    border-radius:10%;
    height: 100%;
}

.el .icon a {
    border: none;
}

.gallery .icon .empty {
    border-radius: 1em;
    background-color: rgba(var(--pri-rgb), 0.1);
    margin-bottom: 0.3em;
}

#album .el {
    width: 21%;
    margin: 2%;
}

#album .photo {
    width: 100%;
    height: 10em;
    background-position: center center;
background-repeat: no-repeat;
background-size: cover;
}

.relationships {
    display: flex;
}

.relationships .el {
    text-align:right;
    align-self: center;
    width: 8em !important;
    margin: 0 2em;
}

.relationships .icon {
    width:8em;
    height:8em;
    padding: 0em;
}

.list .el {
    width: 11em;
}

.list .icon {
    width:11em;
    height:11em;
}

.clear {
 clear: both;
 margin:0.5em;
 }

/*** plot ***/

.plot {
    text-align: left !important;
    border-radius: 1em;
    background-color: rgba(var(--pri-rgb), 0.1);
    border: solid 1px rgba(var(--pri-rgb), 0.125);
    max-height: 30em;
       overflow-y:auto;
       overflow-x:hidden;
       width: 100%;
}

form .plot {
    padding: 0.5em;
    margin: 2%;
    width: 96%;
    max-height: 10em;
}

.sheet .plot {
    padding: 1em;
}

.plot-cont {
position: relative;
    height: 8em;
}

.plot p {
    margin: 0.5em 0;
    line-height: 1.1;
}

.diff-version {
    background-color: rgba(var(--pri-rgb), 0.8);
    border: solid 1px rgba(var(--pri-rgb), 0.2);
    padding: 0.5em;
    border-radius: 1em;
    color: var(--sec-clr);
}

/*** MESSAGES ***/

.success {
    font-weight: bold;
    font-size: 120%;
    color: var(--ter-clr);
    margin-bottom:2em;
}

.error {
    font-weight: bold;
    font-size: 120%;
    color: #e36f7d;
    margin-bottom:2em;
}

/*** lm_tooltip ***/

.subl {
    text-decoration: underline;
}

div.ui-lm_tooltip {
    max-width: 90%;
}

/*** MISCELLANEA ***/

.my_pagination td {
    width: 33.3%;
    text-align: center; 1
}

.calendar h3 {
    font-size: 150%;
}

.password_reset {
    float: right;
}

.registration_register {
    float: left;
}

@media(max-width: 480px) {
    .password_reset, .registration_register {
        float: none;
    }
}

.user {
    margin-left: 0 !important;
    margin-right: 30%;
    background-color: rgba(var(--pri-rgb), 0.2);
}

.active a {
    background-color: rgba(var(--pri-rgb), 0.25);
    pointer-events: none;
}

.workshop {
    text-align: center;
}

.workshop p {
    text-align: center;
}

.workshop h2 {
    font-size: 150%;
}

.plot.question {
    padding: 1em;
    width: auto;
    margin-left: 30%;
    margin-top: 1em;
}

.workshop input[type="checkbox"] {
    display: inline-block;
}

.workshop .question {
    padding: 1em;
}

.workshop .option {
    float: left;
    padding: 1em;
    width: 100%;
    background-color: rgba(var(--pri-rgb), 0.2);
    border: 1px solid rgba(var(--pri-rgb), 0.5);
}

.workshop .c {
    padding: 1em;
}

.workshop .fail  {
    color: red;
    font-weight: bolder;
}

.workshop .correct  {
    color: green;
    font-weight: bolder;
}

/*** MENU ***/

#menu ul {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;

  font-weight: 400;
  letter-spacing: 0.1em;
  list-style: none;
  margin-bottom: 0;
  padding: 0;
  text-transform: uppercase; }
  #menu ul a, #menu ul span {
    border-bottom: 0;
    color: inherit;
    cursor: pointer;
    display: block;
    font-size: 0.9em;
    padding: 0.625em 0; }
    #menu ul a:hover, #menu ul span:hover {
      }
    #menu ul a.opener, #menu ul span.opener {
      -moz-transition: color 0.2s ease-in-out;
      -webkit-transition: color 0.2s ease-in-out;
      -ms-transition: color 0.2s ease-in-out;
      transition: color 0.2s ease-in-out;
      text-decoration: none;
      -webkit-tap-highlight-color: rgba(var(--pri-rgb), 0);
      position: relative;
      font-weight: bold; }

      #menu ul a.opener:hover, #menu ul span.opener:hover {
            color: var(--ter-clr) !important;
         }
      #menu ul a.opener.active + ul, #menu ul span.opener.active + ul {
        display: block;
    -webkit-animation: slide-down .5s ease-out;
    -moz-animation: slide-down .5s ease-out;
        }

    #menu ul a.opener .chevron, #menu ul span.opener .chevron {
        height: 0.6em;
        margin-left: 1em;
    }

      #menu ul a.opener.active .chevron, #menu ul span.opener.active .chevron {
        -moz-transform: rotate(-180deg);
        -webkit-transform: rotate(-180deg);
        -ms-transform: rotate(-180deg);
        transform: rotate(-180deg);
        transition-duration: 0.3s; }

@-webkit-keyframes slide-down {
      0% { opacity: 0;
      -webkit-transform: translateY(-50%); }
    100% { opacity: 1; -webkit-transform: translateY(0); }
}
@-moz-keyframes slide-down {
      0% { opacity: 0; -moz-transform: translateY(-50%); }
    100% { opacity: 1; -moz-transform: translateY(0); }
}

  #menu .inner > ul > li > ul {
    display: none;
}

.hideMe {
    display: none;
}

/*** OTHER ***/

.membership_document {
    width: 80%;
}

.membership_request {
    width: 100%;
}

#id_discount {
    width: 50%;
    display: inline;
    margin: 0 2em;
}

.discount_wrp br {
    display: block;
}

/*** LARPMANAGER ***/

#lm table td {
    padding: 1em !important;
    width: 33%;
}

#lm .fa-icon {
    font-family: "Font Awesome 6 Free";
    font-size: 1.5em;
    margin-left: 0.5em;
}

.fade-in {
	opacity: 0;
	animation-name: fadeInOpacity;
	animation-iteration-count: 1;
	animation-timing-function: ease-in;
	animation-duration: 2s;
    animation-delay: 1s;
}

@keyframes fadeInOpacity {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

body.loaded .fade-in {
    opacity: 1;
}

@media(max-width: 480px) {
  #lm tbody {
    display: grid;
  }
  #lm table tr {
    display: contents;
  }
  #lm table td {
    display: block;
    padding: 0.5em !important;
    width: 100%;
    border: solid 1px rgba(var(--pri-rgb), 0.5);
    border-left: 0;
    border-right: 0;
  }
  #lm table tr td + td {
    order: 1;
  }
}

/*** MOBILE ***/

@media screen and (max-width: 1400px) {
    .gallery .el {
        width: 25%;
    }
}

@media screen and (max-width: 1000px) {
    .gallery .el {
        width: 33.3%;
    }
}

@media screen and (max-width: 770px) {
    .gallery .el {
        width: 50%;
    }

    #banner{
        margin-bottom: 0;
    }
}

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

    #header {
        height: 2.8em;
    }

    .header_logo {
        height: 2em;
        margin: 0.5em 0;
    }

    #header h1 {
        font-size: 80%;
        overflow: hidden;
        height: 3.5em;
        width: 70%;
        margin: auto;
    }

    html, body, #page-wrapper, #banner, #one, #footer {
        width: 100%;
    }

    #banner .inner, #one .inner, #footer .inner {
        width: 100%;
        padding: 0 0.5em;
    }

    #banner h1 {
        padding: 0.2em 2em;
        font-size: 1.2em;
        line-height: 1.1;
        min-height: 2em;
    }

    #banner .inner, #one .inner, #footer .inner {
        padding: 0 0.3em;
    }

}

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

    .staff .links h3 {
        margin: 0 auto;
        text-align: center;
    }

    .staff .links td {
        text-align: center !important;
    }

    #profile {
        width: 90%;
    }
}

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

    .sheet .plot {
        padding: 0.5em;
    }

    .gallery .text {
        margin: 0 !important;
        padding: 0 !important;
    }

    .plot {
        padding: 0.5em;
    }

    .calendar .event {
        display: block;
    }

    .event .img {
        height: 10em;
    }

    .event .img, .event .text {
        float:none;
        width: 100%;
        display: inline-block;
    }

    .gallery .el {
        width: 100%;
        float: none;
        margin: 1em auto;
    }

    .gallery .text {
        width: 100%;
        margin: 0 auo;
        padding-right: 1em;
    }

    .gallery .badge .icon-name {
        font-size: 120%;
        bottom: auto;
        top: 1em;
    }

    .relationships {
        display: block;
    }

    .workshop .option {
        width: 100% !important;
    }

     .no-more-tables table,
     .no-more-tables thead,
     .no-more-tables tbody,
     .no-more-tables th,
     .no-more-tables td,
     .no-more-tables tr {
         display: block;
     }

     /* Nasconde le intestazioni della tabella */
     .no-more-tables thead tr {
         position: absolute;
         top:-9999px;
         left:-9999px;
     }

     .no-more-tables tr { border-bottom: 1px solid #ccc; }

     .no-more-tables td {
         /* Inserisce il comportamento come una riga */
         border: none;
         position: relative;
         padding-left: 50%;
         white-space: normal;
         text-align:left;
        padding: 0.5em 0 0 5em !important;
     }

     .no-more-tables td.simple {
        padding: 0.5em !important;
     }

     .no-more-tables td:before {
         /* Inserisce il comportamento come un'intestazione di tabella */
         position: absolute;
         /* I valori top/left agiscono come padding */
         top: 0.5em;
         left: 6px;
         width: 45%;
         padding-right: 10px;
         white-space: nowrap;
         text-align:left;
         font-weight: bold;
     }

     /* Aggiunge l'etichetta ai dati della tabella */
     .no-more-tables td:before { content: attr(data-title); }

 }

#event_cover {
    height: 25em;
    background-position: center center;
    background-size: cover;
    width: 100%;
    background-repeat: no-repeat;
}

@media (max-width: 480px) {
    #event_cover {
        height: 15em;
    }
}

#event_cover a {
    background-color: rgba(0, 0, 0, 0.6);
    padding: 1em;
    border-radius: 0.5em;
    color: var(--pri-clr);
    font-size: 120%;
    position: relative;
    top: 8em;
}

.gall .lang {
    border-radius: 50%;
    width: 2em;
}

.nav2 .lang {
    border-radius: 50%;
    width: 1.5em;
    vertical-align: middle;
}

.nav2 a {
    margin: 0.1em;
    padding: 0.1em;
}

.nav2 a:hover img, .nav2 a.sss img  {
    box-shadow: 0px 0px 20px #fff;
}

.nav2 a:hover.sss img  {
    box-shadow: 0px 0px 0px #fff;
}

@media (max-width: 480px) {
    #register_form img {
        width: 100%;
    }
}

.qtip {
 max-width: 280px !important;
}

.xdsoft_datepicker {
    width: 290px !important;
}

#player_relationships .teas {
    font-size: 80%;
    display: inline-block;
    line-height: 1;
}

#player_relationships td {
    padding: 1em;
    height: 100%;
    position: relative;
}

#player_relationships textarea {
    width:90% !important;
    max-width: 90% !important;
    height:90%;
    resize: none;
    position: absolute;
    top: 5%;
    left:5%;
}

.select2-container--default .select2-results__option {
    color: var(--pri-clr)  !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    color: rgba(var(--pri-rgb), 0.6)  !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--pri-clr)  !important;
    padding: 0.5em;
}

 .select2-container .selection .select2-selection--single {
    background: rgba(var(--sec-rgb), 0.5) !important;
    color: var(--pri-clr)  !important;
    height: 2.5em;
}

.select2-container .select2-search--dropdown .select2-search__field {
    background: rgba(var(--sec-rgb), 0.9) !important;
}

.select2-results__option {
    background: rgba(var(--sec-rgb), 0.95) !important;
}

.select2-results__message {
    background: rgba(var(--sec-rgb), 0.8) !important;
}

input  {
    width: 50%;
}

@media(max-width: 1280px) {

    input {
        width: 75%;
    }

    input[type="submit"], input[type="reset"], input[type="button"], button, .button {
        padding: 0.75em 2em;
    }

}

@media(max-width: 736px) {

    input  {
        width: 100%;
    }

}

input[type="slug"], input[type="text"], input[type="password"], input[type="email"], input[type="number"], input[type="tel"], input[type="date"], input[type="date_p"], input[type="datetime_p"], input[type="time_p"], select, textarea {
    border-color: rgba(var(--ter-rgb), 0.35) !important;
    border-width: 2px !important;
}

input[type="submit"], input[type="reset"], input[type="button"], button, .button {
    width: auto;
    padding: 1em 3em;

    border-color: rgba(var(--ter-rgb), 0.35) !important;
    border-width: 2px !important;
}

@media(max-width: 600px) {
    input {
        width: 100% !important;
    }

    input[type="checkbox"], input[type="radio"] {
        width: auto !important;
    }

    .password_reset, .registration_register {
        float: none;
        margin: 0 0 2em 0;
    }

}

.img_cover {
    width: 100%;
    padding-bottom: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    border-radius: 10%;
}

.member_cover {
    width: 10em;
    min-width: 10em;
}

.go_table {
    margin-top: 2em;
}

.info {
    font-style: italic;
    margin-bottom: 0em;
    border-bottom: solid 2px rgba(var(--pri-rgb), 0.5);
    padding-bottom: 0.4em;
}

.fa-edit {
    font-size: 25px;
}

#sheet_pdf textarea {
    width: 100%;
}

#sheet_pdf th {
    font-size:150%;
}

#sheet_pdf .code {
    font-style: italic;
}

#payment_form {
    width: auto; margin: auto;
}

#payment_form .sel {
    background-color: rgba(var(--pri-rgb), 0.35);
}

.paypal input {
    width: auto;
}

/**** FULLSCREEN *****/

#fullscreen {
    position: absolute;
    bottom: 5%;
    left: 5%;
    width: 90%;
    background-color: rgba(var(--sec-rgb), 0.8);
    border-radius: 5px;
    padding: 1em;
}

@media(max-width: 600px) {

    #fullscreen {
        position: absolute;
        bottom: 1%;
        left: 1%;
        width: 98%;
        font-size: 80%;
    }
}

#fullscreen div {
    margin: 1em;
}

#fullscreen h1 {
    font-size: 150%;
    margin: 0;
    text-align: center;
}

#fullscreen .tagline {
    margin: 0.5em;
    font-style: italic;
    text-align: center;
}

#fullscreen .description_short {
    text-transform: uppercase;
    text-align: center;
    font-weight: bold;
}

#fullscreen .primary {
    margin-left: 2em;
    border-color: rgba(var(--ter-rgb), 0.35) !important;
    border-width: 2px !important;
    box-shadow: inset 0 0 0 2px rgba(var(--pri-rgb), 0.75);
    color: var(--pri-clr);
    background-color: rgba(var(--sec-rgb), 0.35);
}

#fullscreen .buttons {
    text-align: center;
}

#fullscreen .authors {
    margin: 0.5em;
    font-style: italic;
    text-align: center;
}

/**** CAROUSEL ****/

#bgk {
    top: 0px;
    position: fixed;
    width: 100%;
    height: 100%;
    background-size: auto, cover;
    background-attachment: fixed, fixed;
    background-position: center, center;
}

@media(max-width: 600px) {
    #bgk {
        background-size: 50em;
        /* background-attachment: fixed; */
        background-position: top left;
        background-repeat: no-repeat;
    }
}

.carousel {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 2% 0 0 0;
  opacity: 0;

  &.animation-reveal {
    animation: reveal 1s cubic-bezier(0.77, 0, 0.175, 1);
  }

  @keyframes reveal {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
}

.card {
  margin: 0 1rem;
  overflow: hidden;
  box-shadow: 0 10px 20px 0 rgba(0, 0, 35, 0.25);
  border-radius: 8px;
  height: 6em;
  width: 8em;
  display: block;
  position: relative;
  background-position: 50%;
  background-size: cover;
  cursor: pointer;
  transition: width 0.16s ease-in-out, height 0.16s ease-in-out;
}

.card.is-custom-selected {
  width: 10em;
  height: 7.5em;
  display: flex;
  align-items: center;
  justify-content: center;
}

.card-bg {
  height: 100%;
  width: 100%;
  background-position: center;
  background-size: cover;
}

.flickity-enabled {
  position: relative;
}

.flickity-enabled:focus {
  outline: none;
}

.flickity-viewport {
  position: relative;
  height: 100%;
}

.flickity-slider {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 100%;
  height: 100%;
}

.paginate select {
    display: inline-block;
}

.staff-list {
    text-align: center;
    margin: 0;
    padding: 0.3em;
}

.staff-list button, .staff-list .button {
    padding: 0.8em 1.6em;
    margin: 0.5em 0.5em;
}

.staff-list .hide {
    margin: 0em;
}

.staff-list .hide hr {
    margin: 0.5em;
}


/*** POPUP ***/

.popup_text {
    display: none;
}

.popup {
    border-radius: 2em;
    background-color: rgba(var(--sec-rgb), 0.9);
    width: 50em;
    height: 30em;
    padding: 1em;
    -webkit-box-shadow: 0px 0px 39px 12px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 39px 12px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 39px 12px rgba(0,0,0,0.75);
    overflow: scroll;

    scrollbar-width: none;
    -ms-overflow-style: none;

    text-align: center;
}

@media(max-width: 840px) {
    .popup {
    width: 20em;
    }
}

.popup h2 {
    margin: 1em;
}

.popup::-webkit-scrollbar{
    display: none;
  }

.reg_profile {
    width:8em;
}

.popup .reg_profile {
    width:auto;
    height: 90%;
    margin: auto;
}

/** COVER **/

#aspect-ratio {
    position: relative;
    width: 100%;
    padding-bottom: 40%;
}

#aspect-ratio div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.footer-text {
    margin-bottom: 1em;
}

@media(max-width: 840px) {
    .footer-text {
        margin-bottom: 0.5em;
    }
}

.footer-text p {
    margin: 0;
}