@font-face {
  font-family: 'Chiron';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(https://cdn.jsdelivr.net/fontsource/fonts/chiron-goround-tc@latest/latin-400-normal.woff2) format('woff2'),
       url(https://cdn.jsdelivr.net/fontsource/fonts/chiron-goround-tc@latest/latin-400-normal.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

.fixed-action-btn-owl {
    position: fixed;
    left: calc(50% - 30px);
    right: 50%;
    bottom: 23px;
    padding-top: 15px;
    margin-bottom: 0;
    z-index: 997;
}

.fixed-action-btn-owl ul {
    /*left: 10px !important;*/
}

.btn-floating-owl {
    width: 60px !important;
    height: 60px !important;
    border-radius: 10%;
}

.container-center-owl {
  display: flex;
  justify-content: center; /* Centra orizzontalmente */
  align-items: center;     /* Centra verticalmente */
  height: 100vh;           /* Opzionale: rende il contenitore alto quanto lo schermo */
}

.center-owl {
    text-align: center;
}

.comfortaa-owl {
  font-family: "Comfortaa", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

.poppins-owl {
  font-family: "Poppins", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
#owlpups-logo-svg {
    width: 15vh;
}
#overlay-owl {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;

  background: rgba(0, 0, 0, 0.6); /* trasparenza */
  
  z-index: 9999; /* sopra tutto */
  
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;
}

/* stato attivo */
#overlay-owl.active {
  opacity: 1;
  visibility: visible;
}

.nav-owl {
    background-color: transparent !important;
    box-shadow: unset !important;
    padding: 20px 15px 0 15px;
}

#owlpups-logo-header-svg {
    height: auto;
    width: 15vh;
}
#owlpups-logo-header-page {
    height: auto;
    width: 5vh;
}

ul#nav-mobile {
    margin: -7px 0px 0 0;
}

.pink {
    background-color: #ff305c !important
}

.pink-text {
    color: #ff305c !important
}
.home-payoff-1 {
    margin-top: 150px;
    margin-bottom: -10px;
    color: white;
}
.home-payoff-2 {
    color: white;
}

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

body {
  /*min-height: 100vh;*/
  /*background: linear-gradient(rgba(0,0,0,.7), rgba(0,0,0,0),rgba(0,0,0,.7));*/
  background-repeat: no-repeat;
  text-shadow: 0 0.05rem 0.1rem rgba(0, 0, 0, .5);
  zoom: 1.1;
  /*background-attachment: fixed !important;*/

}

#owlpups-logo-button {
    height: auto;
    width: 3.5vh;
}

svg#footer_button_menu_pups {
    width: auto;
    height: 2.2vh;
    margin-top: 10px;
}

svg#google-icon {
    width: auto;
    height: 20px;
    margin: 7px 15px 0 0;
    float: left;
}

.btn {
    border-radius: 6px !important;
}

.card.owl {
    border-radius: 6px !important;
    margin-top: 20px;
}

.card.owl > .card-image {
    border-radius: 6px !important;
    height: 120px;
    /*background: url(../img/wallpapers/owlpups-desk3.jpg);*/
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;

}

.card-title.owl {
    padding: 0px 0px 26px 12px !important;
}

.card-subtitle {
    position: absolute;
    bottom: 0;
    color: white;
    left: 0;
    padding: 12px;
}

.carousel-item > .card.owl {
    margin: 15px;
}

.tabs .tab a:hover, .tabs .tab a.active {
    font-weight: bold;
    background-color: #ff305c;
    color: white;
    font-size: 20px;
}

.tabs .tab a:focus, .tabs .tab a:focus.active {
    font-weight: bold;
    background-color: #ff305c;
    color: white;
}

.tabs .indicator {
    display: none;
}

.tabs .tab a {
    font-size: 20px;
    font-weight: bold;
}

#owlpups-certificate {
    width: 16px;
    height: 16px;
}

.badge-owl {
    background-color: white;
    color: black;
    border-radius: 10px;
    padding: 1px 10px 2px 10px;
    font-weight: bold;
    font-size: 12px;
}

.description-pup {
    color: white;
    font-size: 15px;
    line-height: 16px;
    background-color: #0000003d;
    border-radius: 10px;
    padding: 15px;
}

.card-creator {
    padding: 10px;
}

.row .col {
    padding: 0 !important;
}

.pup-title {
    font-size: 2rem !important;
    font-family: 'Chiron';
    font-weight: bold;
    color: white;        
}

.pup-subtitle {
    font-size: 1.5rem !important;
    font-family: 'Chiron';
    font-weight: bold;
    color: white;        
}

.pup-description {
    font-size: 1rem !important;
    font-family: 'Chiron';
    /*font-weight: bold;*/
    color: white;        
}

.pup-expired  {
    color: white;
    font-weight: bold;
}

.input-field {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.input-field.col label {
    left: 0.75rem;
}
.pup-label {
    color: white !important;
}


input:not([type]):focus:not([readonly]),
input[type=text]:not(.browser-default):focus:not([readonly]),
input[type=password]:not(.browser-default):focus:not([readonly]),
input[type=email]:not(.browser-default):focus:not([readonly]),
input[type=url]:not(.browser-default):focus:not([readonly]),
input[type=time]:not(.browser-default):focus:not([readonly]),
input[type=date]:not(.browser-default):focus:not([readonly]),
input[type=datetime]:not(.browser-default):focus:not([readonly]),
input[type=datetime-local]:not(.browser-default):focus:not([readonly]),
input[type=tel]:not(.browser-default):focus:not([readonly]),
input[type=number]:not(.browser-default):focus:not([readonly]),
input[type=search]:not(.browser-default):focus:not([readonly]),
textarea.materialize-textarea:focus:not([readonly]) {
  border-bottom: 1px solid #ff305c;
  -webkit-box-shadow: 0 1px 0 0 #ff305c;
          box-shadow: 0 1px 0 0 #ff305c;
}

input:not([type]):focus:not([readonly]) + label,
input[type=text]:not(.browser-default):focus:not([readonly]) + label,
input[type=password]:not(.browser-default):focus:not([readonly]) + label,
input[type=email]:not(.browser-default):focus:not([readonly]) + label,
input[type=url]:not(.browser-default):focus:not([readonly]) + label,
input[type=time]:not(.browser-default):focus:not([readonly]) + label,
input[type=date]:not(.browser-default):focus:not([readonly]) + label,
input[type=datetime]:not(.browser-default):focus:not([readonly]) + label,
input[type=datetime-local]:not(.browser-default):focus:not([readonly]) + label,
input[type=tel]:not(.browser-default):focus:not([readonly]) + label,
input[type=number]:not(.browser-default):focus:not([readonly]) + label,
input[type=search]:not(.browser-default):focus:not([readonly]) + label,
textarea.materialize-textarea:focus:not([readonly]) + label {
  color: white;
}

input:not([type]),
input[type=text]:not(.browser-default),
input[type=password]:not(.browser-default),
input[type=email]:not(.browser-default),
input[type=url]:not(.browser-default),
input[type=time]:not(.browser-default),
input[type=date]:not(.browser-default),
input[type=datetime]:not(.browser-default),
input[type=datetime-local]:not(.browser-default),
input[type=tel]:not(.browser-default),
input[type=number]:not(.browser-default),
input[type=search]:not(.browser-default),
textarea.materialize-textarea {

    margin: 0 !important;

}
.me-character-counter.me-character-counter_valid, .me-character-counter.me-character-counter_invalid {
    text-align: right;
}

.dropdown-content li > a, .dropdown-content li > span {
    color: #ff305c;
}

.datepicker-table abbr {
    text-decoration: none;
    color: #ff305c;
}

button.btn-flat.datepicker-cancel.waves-effect {
    font-size: 20px;
}

button.btn-flat.datepicker-done.waves-effect {
    font-size: 20px;
    font-weight:bold;
}

.datepicker-cancel, .datepicker-clear, .datepicker-today, .datepicker-done {
    color: #ff305c;
}

.datepicker-table td.is-selected {
    background-color: #ff305c;
}

.datepicker-date-display {
    background-color: #ff305c;
}

tr.datepicker-row {
    color: black;
    font-weight: bold;
}

tr {
    border-bottom: unset;
}
td {
    padding: 0;
}

.pup-tag-key {
    color: white;
}

label.pup-label.active {
    color: white;
}

.pup-tag-value {
    color: white;
    text-align: right;
    font-weight: bold;
    font-size: 1em;
}

.progress {
    margin: 0 !important;
    height: 8px !important;
    background-color: pink !important;
    position: fixed !important;
}

.progress .indeterminate {
    background-color: #ff305c !important;
}
.toast {
    background-color: #ff305c !important;
}
.floating-back {
    position: fixed;
    bottom: 20px;
    margin-bottom: 0;
    left: 20px;
    color: #ffffff30;
    border-radius: 6px;
    padding: 0 0 0 15px;
    width: 66px;
}

.collapsible-header {
    color: black;
}
.collapsible.popout>li {
    margin: 0;
}