@import url('https://fonts.googleapis.com/css2?family=Commissioner:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.0/font/bootstrap-icons.css");
@charset "UTF-8";

html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

body {
    display:flex;
    font-family: 'Commissioner', sans-serif;
    margin: 0 auto;
    width: 100%;
    height: 100%;
    background: url('../../assets/img/tex2res5.png') repeat center center;
}


/* Custom page CSS
-------------------------------------------------- */
/* Not required for template or sticky footer method. */

main > .container-h {
  padding-top: 85px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;
}

.bd-placeholder-img {
        font-size: 1.125rem;
        text-anchor: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
      }

      @media (min-width: 768px) {
        .bd-placeholder-img-lg {
          font-size: 3.5rem;
        }
      }

.footer {background-color: #f5f5f5;}
.footer > .container {padding-right: 15px; padding-left: 15px;}

.pepyd > h1 {text-shadow: 3px 3px #FF0000; font-weight: 800; letter-spacing: 8px;}

hr.pepyd {border: 0; height: 0; /* Firefox... */ box-shadow: 0 0 5px 1px red; }
hr.pepyd:after {  /* Not really supposed to work, but does */ content: "\00a0";  /* Prevent margin collapse */}

/* --------------------------------------------- INFORMATION MODAL ------------------------------------------------------ */
.tr-info {
    height: 40px;
}

.td-info {
    font-weight: 600;
    color: #0000ff;
}

.headeffect {
    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

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

        .pepyd > h1 {font-size:30px; letter-spacing: 4px;}
        .pepyd > .lead {font-size:14px;}
        main > .container-h {padding-top: 40px;}
     


    }