/* CSS HEX *
    --cultured: #f2f2f2;
    --medium-candy-apple-red: #df1a2d;
    --bordeaux: #95010f;
    --gainsboro: #dddddd;
    --eerie-black: #191919;

    gallery under15: #3097c2;
    gallery under17: #29b529;
    gallery generali: #df1a2d;
    gallery under19: #dc0edc;
    gallery cgold: #c8a900;

     SCSS RGB
    $cultured: rgba(242, 242, 242, 1);
    $medium-candy-apple-red: rgba(223, 26, 45, 1);
    $bordeaux-dark: rgba(60, 5, 5, 1);
    $gainsboro: rgba(221, 221, 221, 1);
    $eerie-black: rgba(25, 25, 25, 1);

    font-family: 'Scarecrow';
    font-family: 'Poppins';
    font-family: 'Raleway';

    */
    .nav-link-gallery {
        font-size: 16px !important;
        font-weight: 600 !important;
    }
    .page-header {
        background: rgb(218,218,218);
        background: -moz-linear-gradient(270deg, rgba(218,218,218,0.6) 5%, rgba(154,8,22,0.6) 49%, rgba(34,0,3,0.6) 100%) !important;
        background: -webkit-linear-gradient(270deg, rgba(218,218,218,0.6) 5%, rgba(154,8,22,0.6) 49%, rgba(34,0,3,0.6) 100%) !important;
        background: linear-gradient(270deg, rgba(218,218,218,0.6) 5%, rgba(154,8,22,0.6) 49%, rgba(34,0,3,0.6) 100%) !important;
    }
    .page-header .bgimg{
        background-image: url(../img/gallery/bg-gallery.jpg);
        position: fixed;
        background-position: top;
    }
    .gallery-body {
        position: relative;
        padding-bottom: 2rem;
       background: rgb(218,218,218);
        background: -moz-linear-gradient(270deg, rgba(218,218,218,0.6) 5%, rgba(154,8,22,0.6) 49%, rgba(34,0,3,0.6) 100%);
        background: -webkit-linear-gradient(270deg, rgba(218,218,218,0.6) 5%, rgba(154,8,22,0.6) 49%, rgba(34,0,3,0.6) 100%);
        background: linear-gradient(270deg, rgba(218,218,218,0.6) 5%, rgba(154,8,22,0.6) 49%, rgba(34,0,3,0.6) 100%);
    }

    .category-container {
        background-color: #252525;
    }

    .gallery-container {
        min-height: 100vh;
        background-color: #252525;
    }
    .gallery-body .row-category{
        padding-top: 2rem;
        padding-bottom: 2rem;
   }
   .gallery-body .row-category .category {
        max-width: 20%;
        color: #f2f2f2;
        text-align: center;
        cursor: pointer;
    }
    .gallery-body .row-category .category h6 {
        font-size: 20px;
    }
    .gallery-body .row-category .category h6::before{
        font-size: 20px;
    }

    .gallery-body .row-category .gold h6 {
        color: #f2f2f2;
        font-family: 'poppins';
        text-transform: uppercase;
        text-align: center;
        cursor: pointer;
        position: relative;
    }
    .gallery-body .row-category .gold h6::before{
        content: 'c gold';
        text-transform: uppercase;
        color: #c8a900;
        position: absolute;
        transform: translate(1px,-1px);
    }
    .gallery-body .row-category .u19 h6{
        color: #f2f2f2;
        font-family: 'poppins';
        text-transform: uppercase;
        text-align: center;
        cursor: pointer;
        position: relative;
    }
    .gallery-body .row-category .u19 h6::before{
        content: 'Under 19';
        text-transform: uppercase;
        color: #dc0edc;
        position: absolute;
        transform: translate(1px,-1px);
    }

    .gallery-body .row-category .generali h6{
        color: #f2f2f2;
        font-family: 'poppins';
        text-transform: uppercase;
        text-align: center;
        cursor: pointer;
        position: relative;
    }
    .gallery-body .row-category .generali h6::before{
        content: 'Tutte le Foto';
        text-transform: uppercase;
        color: #df1a2d;
        position: absolute;
        transform: translate(1px,-1px);
    }

    .gallery-body .row-category .u17 h6{
        color: #f2f2f2;
        font-family: 'poppins';
        text-transform: uppercase;
        text-align: center;
        cursor: pointer;
        position: relative;
    }
    .gallery-body .row-category .u17 h6::before{
        content: 'Under 17';
        text-transform: uppercase;
        color: #29b529;
        position: absolute;
        transform: translate(1px,-1px);
    }

    .gallery-body .row-category .u15 h6{
        color: #f2f2f2;
        font-family: 'poppins';
        text-transform: uppercase;
        text-align: center;
        cursor: pointer;
        position: relative;
    }
    .gallery-body .row-category .u15 h6::before{
        content: 'Under 15';
        text-transform: uppercase;
        color: #3097c2;
        position: absolute;
        transform: translate(1px,-1px);
    }
    .gallery-body .row-gallery {
        justify-content: center;
        column-gap: 2rem;
        row-gap:2rem;
    }
    .gallery-body .row-gallery {
        justify-content: center;
        column-gap: 2rem;
        row-gap:2rem;
    }

    .gallery-body .row-gallery .gallery-box{
        min-height: 20rem;
        position: relative;
        background-color: transparent;
        color: #f2f2f2;
        overflow: hidden;
        transition: 0.4s ease all;
        padding-left: 0;
    }
    .gallery-body .row-gallery .gallery-box:hover{
        cursor: pointer;
    }
    .gallery-body .row-gallery .gallery-box .gallery-content{
        z-index: 2;
        position: absolute;
        top: 40%;
        left: 50%;
        transform: translate(-50%,-50%);
        transition: 0.5s ease all;

    }
    .gallery-body .row-gallery .gallery-box .gallery-content h4 {
        text-transform: uppercase;
        font-size: 16px;
        font-family: 'Poppins';
        background-color: rgba(242, 242, 242, 0.8);
        padding: 0.25rem 1rem;
        display: table;
        margin:auto;
    }
    .gallery-body .row-gallery .box-gold h4{
        color: #c8a900 ;
            }
    .gallery-body .row-gallery .box-u19 h4{
        color: #dc0edc ;
            }
    .gallery-body .row-gallery .box-generali h4{
        color: #df1a2d ;
            }
    .gallery-body .row-gallery .box-u17 h4{
        color: #29b529 ;
            }
    .gallery-body .row-gallery .box-u15 h4{
        color: #3097c2 ;
    }
    .gallery-body .row-gallery .box-gold {
        transition: 0,5s ease all;
        transition-delay: 0,2s;
    }
    .gallery-body .row-gallery .box-u19 {
        transition: 0,5s ease all;
        transition-delay: 0,2s;
    }
    .gallery-body .row-gallery .box-generali {
        transition: 0,5s ease all;
        transition-delay: 0,2s;
    }
    .gallery-body .row-gallery .box-u17 {
        transition: 0,5s ease all;
        transition-delay: 0,2s;
    }
    .gallery-body .row-gallery .box-u15h4{
        transition: 0,5s ease all;
        transition-delay: 0,2s;
    }


    .gallery-body .row-gallery .gallery-box .gallery-content h1 {
        color: #f2f2f2;
        text-transform: uppercase;
        margin-top: 3rem;
        font-family: 'Poppins';
        text-align: left;
        max-width: 50%;
    }
    .gallery-body .row-gallery .gallery-box .bg-h1 {
        background: rgb(149,1,15);
        background: -moz-linear-gradient(90deg, rgba(149,1,15,1) 0%, rgba(149,1,15,1) 46%, rgba(149,1,15,0.2511379551820728) 62%, rgba(149,1,15,0) 70%);
        background: -webkit-linear-gradient(90deg, rgba(149,1,15,1) 0%, rgba(149,1,15,1) 46%, rgba(149,1,15,0.2511379551820728) 62%, rgba(149,1,15,0) 70%);
        background: linear-gradient(90deg, rgba(149,1,15,1) 0%, rgba(149,1,15,1) 46%, rgba(149,1,15,0.2511379551820728) 62%, rgba(149,1,15,0) 70%);
        min-width: 100%;
        min-height: 35%;
        position: absolute;
        z-index: 1;
        top: 50%;
        transform: translateY(-50%);
        transition: 0.5s ease all;
        transition-delay: 0.2s;

    }
    .gallery-body .row-gallery .gallery-box .img-gallery{
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: 0;
        top: 0;
        left: 0;
        filter: blur(3px);
        transition: 0.5s ease all;

    }
    .gallery-body .row-gallery .gallery-box .img-gallery-effect{
        background-color: rgba(242,242,242,0.25);
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: 0;
        top: 0;
        left: 0;
        transition: 0.5s ease all;
    }
    .gallery-body .row-gallery .gallery-box .gallery-content-active{
        position: absolute;
        top: 50%;
        right: 50%;
        transform: translate(200%, -50%);
        z-index: 1;
        transition: 0.5s ease all;
        transition-delay: 0.2s;
    }
    .gallery-body .row-gallery .gallery-box .gallery-content-active h1{
        font-family: 'Poppins';
        text-align: center;
        margin: auto;
        text-transform: uppercase;
        color: #f2f2f2;

    }
    .gallery-body .row-gallery .gallery-box .gallery-content-active h4{
        font-family: 'Poppins';
        text-align: center;
        margin: auto;
        text-transform: uppercase;
        color: #f2f2f2;
    }
    .gallery-body .row-gallery .gallery-box .gallery-content-active hr{
        opacity: 1;
    }
    .gallery-body .row-gallery .box-gold .gallery-content-active hr {
        color: #c8a900;
    }
    .gallery-body .row-gallery .box-u19 .gallery-content-active hr {
        color: #dc0edc;
    }
    .gallery-body .row-gallery .box-generali .gallery-content-active hr {
        color: #df1a2d;
    }
    .gallery-body .row-gallery .box-u17 .gallery-content-active hr {
        color: #29b529;
    }
    .gallery-body .row-gallery .box-u15 .gallery-content-active hr {
        color: #3097c2;
    }


    /* ANIMAZIONI EFFETTI HOVER */
    .gallery-body .row-gallery .gallery-box:hover .img-gallery-effect {
        background-color: rgba(25,25,25,0.45);
    }
    .gallery-body .row-gallery .gallery-box:hover .img-gallery {
        filter:blur(1px);
    }
    .gallery-body .row-gallery .gallery-box:hover .gallery-content {
        transform: translate(-200%, -50%);
    }
    .gallery-body .row-gallery .gallery-box:hover .bg-h1 {
        transform: translate(-200%, -50%);
    }
    .gallery-body .row-gallery .gallery-box:hover .gallery-content-active{
        transform: translate(50%, -50%);
    }

    /* ANIMAZIONI BORDI EFFETTI HOVER */
    .gallery-body .row-gallery .box-gold:hover {
        border:1px solid #c8a900;
    }
    .gallery-body .row-gallery .box-u19:hover {
        border:1px solid #dc0edc;
    }
    .gallery-body .row-gallery .box-generali:hover {
        border:1px solid #df1a2d;
    }
    .gallery-body .row-gallery .box-u17:hover {
        border:1px solid #29b529;
    }
    .gallery-body .row-gallery .box-u15:hover {
        border:1px solid #3097c2;
    }


    .gallery-body .more-gallery {
        text-transform:uppercase;
        margin:auto;
        margin-top: 3rem;
        text-align: center;
        background-color: transparent;
        border: 2px solid red;
        color: #f2f2f2;
        cursor: pointer;
        transition: 0.5s ease all;
        font-family: 'Poppins';
        justify-content: center;
        display: block;
        border-radius: 15px;
        padding: 0.35rem    1rem;
    }