/* GENERAL TAGS*/
body{
    background-color: rgb(0, 0, 0);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: RandyGG, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

hr{
    height: 1px;
    background-color: #f02140;
    border: none;
}
p{
    font-family: Consolas, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;;
}

a {
    font-weight:500;
    color: #008cff;
}

a:hover {
    text-decoration: none;
    color: rgb(255, 255, 255);
}


/* IDS */
#background-video {
    object-fit: cover;
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    display: none;
}

#bgfooter {
    background-color: transparent;
    height: 35vh;
}

#transition1 {
    background-color: rgba(0, 0, 0, 0.8);
    height: 40px;
    max-width: 50%;
}

#transition2 {
    background-color: rgba(0, 0, 0, 0.644);
    height: 30px;
    max-width: 30%;
}

#transition3 {
    background-color: rgba(0, 0, 0, 0.397);
    height: 20px;
    max-width: 20%;
}

/* CLASSES */
.p-rel{
    position: relative;
}

.tf-rgg{
    font-family: RandyGG, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  }

.bg-container {
    background-color: rgba(0, 0, 0, 0.8);
}

.button-st {
    color:white;
    background: rgba(218, 165, 32, 0.1) ;
    border: rgba(218, 165, 32, 0.8) solid 1px ;
}

.button-st:hover {
    color:white;
    background: rgba(218, 153, 32, 0.5) ;
    border: rgb(255, 183, 0) solid 1px;
}

.button-gh {
    color:white;
    background: rgba(218, 165, 32, 0.1) ;
    border: rgba(218, 165, 32, 0.8) solid 1px ;
}

.button-gh:hover {
    color:white;
    background: rgba(64, 120, 192, 0.5) ;
    border: rgb(0, 132, 255) solid 1px;
}

.button-art {
    color:white;
    background: rgba(218, 165, 32, 0.1) ;
    border: rgba(218, 165, 32, 0.8) solid 1px ;
}

.button-art:hover {
    color:white;
    background: rgba(192, 64, 64, 0.5);
    border: rgb(255, 0, 0) solid 1px;
}

.button-ch {
    color:white;
    background: rgba(218, 165, 32, 0.1) ;
    border: rgba(218, 165, 32, 0.8) solid 1px ;
}

.button-ch:hover {
    color:white;
    background: rgba(11, 65, 134, 0.774) ;
    border: rgb(2, 82, 156) solid 1px;
}

.footer {
    background-color: rgba(0, 0, 0, 0.8);
}

.project-card {
    border: rgba(218, 165, 32, 0.8) solid 1px ;
    background: transparent;
}

.project-image {
    min-width: 200px;
    max-width: 30%;
}

.project-image-vertical{
    min-width: 30%;
}

.hovering {
    transition: transform .1s;
    border: rgba(150, 114, 24, 0.8) solid 1px;
}

.hovering:hover {
    border: rgb(255, 183, 0) solid 1px;
    transform: scale(1.05);
}

.project-section > article {
    width: 49%;
}

.footer-item{
    border-bottom: rgb(255, 183, 0) solid 1px;
}

.footer-item:hover{
    border-bottom: rgb(255, 255, 255) solid 1px;
}

.linked-badge:hover{
    background-color: white;
    color: black;
}


/* SCROLL BAR*/
/* width */
::-webkit-scrollbar {
    width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    background: rgb(0, 0, 0);
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: rgb(255, 183, 0);
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: rgb(255, 183, 0);
}


/* @s*/
@media (max-width: 999px) {
    .footer-item-center {
      display: none !important;
    }

    .footer-item-center-hidden {
      display: block !important;
    }
    
    canvas {
        display: none !important;
    }

}

@media (max-width: 1199px) {

    .project-section > article {
        width: auto !important;
    }

}

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

@font-face {
    font-family: RandyGG;
    src: url("../assets/generic/fonts/RandyGGRegular.ttf");
}