/*VARIABILI--------------------------------------------------------------*/

@white: #FFFFFF;
@black: #222732;
@gray:#868D9E;
@violet:#78246A;
@violetDark:#5f1954;
@green:#127242;
@greenDark:#0b5c34;
@gold:#89734C;
@goldDark:#77623d;
@bgBeige:#FFF8F0;
@bgGray:#D5D5D5;
@bgLightGray:#F2F2F2;
@red: #E94B4D;
@placeholder: #BFBFBF;



@font-family: 'Roboto', sans-serif;

.gradientBlackViolet{
    background: rgb(34,39,50);
    background: linear-gradient(90deg, rgba(34,39,50,1) 45%, rgba(120,36,106,1) 100%);
}

.gradientBlackViolet2{
    background: rgb(34,39,50);
    background: linear-gradient(-90deg, rgba(34,39,50,1) 45%, rgba(120,36,106,1) 100%);
}

.gradientBlackGreen{
    background: rgb(34,39,50);
    background: linear-gradient(270deg, rgba(34,39,50,1) 45%, rgba(10,96,53,1) 100%);
}

.gradientBlackGreen2{
    background: rgb(34,39,50);
    background: linear-gradient(-270deg, rgba(34,39,50,1) 45%, rgba(10,96,53,1) 100%);
}


.boxShadow {
    -webkit-box-shadow: 0 3px 14px 0 rgba(0,0,0,0.05);
    -moz-box-shadow: 0 3px 14px 0 rgba(0,0,0,0.05);
    box-shadow: 0 3px 14px 0 rgba(0,0,0,0.05);
}

.radius9 {
    -webkit-border-radius: 9px;
    -moz-border-radius: 9px;
    border-radius: 9px;
}

.radius15 {
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}

.radius50 {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

.appearanceNone {
    -webkit-appearance: none;
    -moz-appearance: none;
}

.transition03 {
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.transition07 {
    -webkit-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

.absoluteCenter {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: center;
    transform: translateY(-50%);
}

.bgCenterCover {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.inlineMiddle {
    display: inline-block;
    vertical-align: middle;
}


/*GENERALE--------------------------------------------------------------------------------------------------------*/

body {
    font-family: @font-family;
    line-height: 1;
    color: @black;
    font-weight: 400;
    width: 100%;
    overflow-x: hidden !important;
    background-color: @white;
}

.contenitore{
    width: 100vw;
    overflow-x: hidden !important;
}

::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

/* Track */
::-webkit-scrollbar-track {
    border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: @black;
    border-radius: 10px;
}

.div1600{
    width:1600px;
    margin:0 auto;
}

#debug {
    position: fixed;
    bottom: 0px;
    right: 20px;
    background-color: rgba(0, 0, 0, 0.68);
    color: @white;
    padding: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    font-size: 10pt;
    display: block;
    z-index: 9;
}

.clear {
    clear: both;
}

.fancybox-container {
    z-index: 99999999 !important;
}

h1 {
    font-size:59px;
    color:@white;
    font-weight:500;
    line-height:1.2;
}

h2 {
    font-size:53px;
    font-weight:500;
}

h3 {
    font-size:25px;
    color:@gold;
    font-weight:500;
    text-transform:uppercase;
    line-height:1.3;
}

p {
    padding:0 !important;
    margin:0 !important;
    font-size:19px;
    color:@gray;
    font-weight:400;
    line-height: 1.6;
}

a{
    text-decoration:none;
    .transition03;
}

.button {
    padding: 15px 27px;
    .radius9;
    font-size:17px;
    color:@white;
    .transition03;
    text-decoration: none;
    display: inline-block;
    cursor:pointer;
    i{
        font-size:39px;
        margin-right:19px;
        .inlineMiddle;
    }
    span{
        .inlineMiddle;
    }
}

.buttonGold {
    background-color: @gold;
    &:hover{
        background-color:@goldDark;
        color:@white;
    }
}

.buttonViolet {
    background-color: @violet;
    &:hover{
        background-color:@violetDark;
        color:@white;
    }
}

.buttonGreen {
    background-color: @green;
    &:hover{
        background-color:@greenDark;
        color:@white;
    }
}

.title{
    h3{
        margin-bottom:9px;
    }
    h2{
        color:@white;
    }
    h1{
        font-size:50px;
        color:@black;
    }
}

/*TOP--------------------------------------------------------------------------------------------------------*/
.top{
    position:absolute;
    top:0;
    left:0;
    right:0;
    margin:0 auto;
    text-align:left;
    z-index:9;
    background-color: transparent;
    transition:all 450ms ease-in-out;
    height:130px;
    .topContainer{
        width:1600px;
        position:relative;
        margin:0 auto;
        .linkProdotti{
            position:relative;
        }
        .triangle{
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 0 15px 15px 15px;
            border-color: transparent transparent #ffffff transparent;
            position:fixed;
            bottom:-67px;
            left:19px;
        }
        .logo{
            position:absolute;
            top:15px;
            left:0;
            img{
                width:165px;
            }
        }
        .nav{
            position:absolute;
            top:55px;
            right:190px;
            a{
                font-size:19px;
                color:@white;
                font-weight:500;
                margin-left:35px;
                cursor:pointer;
                &:hover{
                    color:@gold;
                }
            }
        }
        .buttonGold {
            position:absolute;
            top:40px;
            right:0;
            &:hover{
                background-color:@goldDark;
                color:@white;
            }
        }
    }
}

.topBarBlack{
    width:100%;
    height:130px;
    background-color:@black;
}

.top.scrolled{
    position:fixed;
    background-color:@white;
    height:80px;
    .boxShadow;
    .logo{
        top:10px;
        img{
            width:unset;
            height:60px;
        }
    }
    .nav{
        top:30px;
        a{
            font-size:19px;
            color:@black;
            margin-left:35px;
            &:hover{
                color:@gold;
            }
        }
    }
    .buttonGold {
        top:17px;
        color:@white;
        &:hover{
            background-color:@goldDark;
            color:@white;
        }
    }
}

.hamburger{
    display:none;
}

/*MENU--------------------------------------------------------------------------------------------------------*/
.menu{
    position:fixed;
    top:140px;
    left:0;
    width:100%;
    padding:70px 0;
    background-color:@white;
    display:none;
    z-index: 9;
    text-align:center;
    .boxShadow;
    ul.tabs {
        margin:0 auto;
        text-align:center;
        list-style: none;
        padding: 0;
        li {
            display: inline-block;
            overflow: hidden;
            position: relative;
            box-sizing: border-box;
            position: relative;
            margin:0 13px;
            a {
                text-decoration: none;
                display: block;
                outline: none;
                transition: all 0.5s ease 0s;
                cursor:pointer;
                padding: 11px 27px;
                background-color:@bgGray;
                color:@gray;
                i{
                    font-size:30px;
                }
                span{
                    font-size:16px;
                }
            }
        }
        li.active{
            a{
                background-color:@green;
                color:@white;
            }
        }
        .tabLinkCat.active{
            a{
                background-color:@violet;
            }
        }
    }
    
    .tabContainer {
        position: relative;
        margin: 90px auto 0 auto;
    }
    .menuBoxProdotto{
        display:inline-block;
        width:calc(25% - 5px);
        text-align:center;
        top: 0;
        .transition07;
        position:relative;
        img{
            height:145px;
            .transition03;
        }
        h3{
            font-size:19px;
            color:@black;
            text-transform:unset;
            margin-top:25px;
        }
        &:hover{
            opacity:0.7;
            transform:scale(1.05);
        }
    }
}

.menu.show {
    display: block;
    -webkit-animation: fade-in .3s ease 1, move-up .3s ease-out 1;
    animation: fade-in .3s ease 1, move-up .3s ease-out 1;
}

.menu.scrolled{
    top:80px;
    padding:30px 0;
}

@-webkit-keyframes fade-in {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fade-in {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-webkit-keyframes move-up {
    from {
        margin-top: 10px;
    }

    to {
        margin-top: 0;
    }
}

@keyframes move-up {
    from {
        margin-top: 10px;
    }

    to {
        margin-top: 0;
    }
}

/*HEADER--------------------------------------------------------------------------------------------------------*/
.header{
    width:100%;
    height:100vh;
    background-color:@black;
    position: relative;
    z-index:1;
    .headerText{
        .absoluteCenter;
        top:60%;
        transform:translateY(-60%);
        width:790px;
        h1{
            margin:19px 0 35px 0;
        }
        p{
            font-size:17px;
            display:block;
            padding-bottom:65px !important;
        }
        .button{
            margin:0 15px;
            span{
                font-size:21px;
            }
        }
    }
    .headerCat{
        position:absolute;
        bottom:0;
        left:0;
        z-index:3;
        width:430px;
    }
    .headerDog{
        position:absolute;
        bottom:0;
        right:0;
        z-index:3;
        width:430px;
    }
}
/*INTRO--------------------------------------------------------------------------------------------------------*/
.intro{
    padding:230px 0;
    .introText{
        float:left;
        width:45%;
        margin-right:5%;
        position:relative;
        img{
            position:absolute;
            top:-140px;
            right:50px;
            width:130px;
        }
        h2{
            padding-right:110px;
        }
        h3{
            font-size:27px;
            text-transform:unset;
            margin:35px 0;
        }
        p{
            font-size:17px;
            display:block;
            margin-bottom:35px !important;
        }
    }
    .introImage{
        float:left;
        width:50%;
        img{
            width:100%;
        }
    }
}

/*CAT BOX--------------------------------------------------------------------------------------------------------*/
.petBox{
    padding:150px 0;
    position:relative;
    .petBoxBg{
        position:absolute;
        z-index:3;
    }
    .petBoxContainer{
        .petBoxImage{
            float:left;
            position:relative;
            z-index:5;
            img{
                width:100%;
            }
        }
        .petBoxText{
            /* float:left; */
            box-sizing:border-box;
            position:relative;
            text-align: left;
            margin:0 auto;
            position:relative;
            z-index:7;
            width:1300px;
            box-sizing: border-box;
            h2{
                line-height:1.1;
            }
            p{
                font-size:17px;
                color:@white;
                display:block;
                margin-top:25px !important;
                b{
                    display:block;
                }
            }
            ul {
                margin-top: 30px;
                list-style: none;
                padding: 0;
                li{
                    display: block;
                    margin-bottom: 5px;
                    line-height: 1.7;
                    padding-left: 35px;
                    font-size:23px;
                    color:@white;
                    font-weight:500;
                    &:before {
                        font-family: icomoon;
                        content: "\e907"; /* FontAwesome Unicode */
                        margin-left: -35px; /* same as padding-left set on li */
                        width: 35px; /* same as padding-left set on li */
                        color: @gold;
                        font-size: 25px;
                        margin-top: 0;
                        .inlineMiddle;
                    }
                }
            }
           
            
        }
    }
}

.catBox{
    .gradientBlackViolet;
    .petBoxBg{
        bottom:0;
        left:0;
        /* width:590px; */
    }
    .petBoxContainer{
       /*  .petBoxImage{
            width:430px;
        } */
        .petBoxText{
            /* width:calc(100% - 430px);
            padding-left:70px; */
            padding-left:350px;
        }
    }
}

.dogBox{
    .gradientBlackGreen;
    .petBoxBg{
        bottom:0;
        right:0;
        /* width:470px; */
    }
    .petBoxContainer{
        /* .petBoxImage{
            width:700px;
            margin-top:90px;
        } */
        .petBoxText{
            padding-right:350px;
            
        }
    }
}

/*GAMME--------------------------------------------------------------------------------------------------------*/
.gamme{
    padding:110px 0 10px 0;
    .gammeBox{
        float:left;
        width:50%;
        margin-bottom:100px;
        text-align:center;
        box-sizing:border-box;
        img{
            height:270px;
            .transition07;
            &:hover{
                opacity:0.7;
                transform:scale(1.05);
            }
        }
        .gammeBoxText{
            margin:0 7% 30px 7%;
            padding:0 15%;
            height:160px;
            h3{
                font-size:33px;
                color:@black;
                text-transform:none;
                margin:15px 0 19px 0;
            }
            p{
                font-size:15px;
            }
        }
    }
}

.gammeIcon{
    height:73px;
    text-align:center;
    width:60px;
    margin:0 auto;
    i{
        font-size:43px;
        color:@gray;
        display:block;
        margin:25px auto 13px auto;
    }
    .icon-200{
        font-size:33px;
        padding-top:10px;
    }
    .icon-85b, .icon-70{
        font-size:23px;
        padding-top:19px;
    }
    label{
        padding:4px 15px;
        background-color:@bgLightGray;
        .radius15;
        font-size:13px;
        color:@gray;
        font-weight:700;
    }
}

/*GARANZIA--------------------------------------------------------------------------------------------------------*/
.garanzia{
    padding:130px 0 70px 0;
    width:100%;
    background-color:@black;
    position:relative;
    .garanziaDog{
        position:absolute;
        bottom:0;
        left:0;
        z-index:3;
        width:650px;
    }
    .garanziaContainer{
        padding-left:630px;
        text-align:center;
        .title{
            margin-bottom:80px;
        }
        .garanziaContainerBox{
            padding:0 50px;
            .garanziaBox{
                float:left;
                width:33.3%;
                padding:0 8%;
                box-sizing:border-box;
                margin:0 0 30px 0;
                text-align:center;
                i{
                    font-size:55px;
                    color:@gold;
                }
                h4{
                    font-size:21px;
                    color:@white;
                    line-height:1.3;
                    padding:15px 0 11px 0;
                }
                p{
                    font-size:14px;
                    color:@gray;
                }
            }
        }
    }
}

/*CHI SIAMO--------------------------------------------------------------------------------------------------------*/
.chiSiamo{
    padding:130px 0;
    text-align:center;
    .chiSiamoContainer{
        width:1050px;
        margin:0 auto;
        .title{
            margin-bottom:70px;
        }
    }
}

.contattaci{
    width:100%;
    height:550px;
    background-color:@black;
    position:relative;
    .contattaciImgCat{
        position:absolute;
        bottom:0;
        left:0;
        z-index:3;
        height:550px;
    }
    .contattaciImgDog{
        position:absolute;
        bottom:0;
        right:0;
        z-index:3;
        height:550px;
    }
    .contattaciTextContainer{
        .absoluteCenter;
        width:650px;
        h2{
            font-size:49px;
            color:@white;
            margin-bottom:45px;
        }
        .button{
            padding: 23px 35px;
            font-size:21px;
        }
    }
}

/*RIVENDITORI--------------------------------------------------------------------------------------------------------*/
.rivenditori{
    padding:130px 0;
    h2{
        font-size:33px;
        color:@gold;
        margin-bottom:30px;
        border-bottom:solid 1px @bgLightGray;
        padding-bottom:15px;
    }
    .title{
        text-align:center;
        margin-bottom:70px;
    }
    .thCell {
        font-size: 19px;
        font-weight:700;
        padding: 0 0 5px 0;
        float: left;
        position: relative;
        box-sizing: border-box;
        text-align: left;
    }
    .td {
        text-align: left;
        /* border-bottom:solid 1px @bgLightGray; */
        a {
            color: @gold;
            text-decoration: none;
            font-weight:700;
            &:hover{
                color:@goldDark;
            }
        }
    }
    .tdTitle {
        display: none;
    }
    .tdCell {
        font-size: 16px;
        padding: 15px 0;
        float: left;
        box-sizing: border-box;
    }
    .thlast {
        padding-right: 0 !important;
    }
    .th1 {
        width: 35%;
        box-sizing:border-box;
        padding-right:25px !important;
    }
    .th2 {
        width: 200px;
    }
    .th3 {
        width: 65%;
    }
    .h3punti{
        margin:50px 0 15px 0;
        font-size:23px;
        text-transform:unset;
    }
}

.riventidoriOnline{
    padding:90px 0;
    /* margin-top:50px; */
    /* background-color:@black;
    background-image: url('../Gfx/bg-rivenditori-online.jpg');
    background-position:bottom right;
    background-repeat:no-repeat;
    background-size:contain; */
    .rivenditoriOnlineContainer{
        width:50%;
        h3{
            font-size:21px;
        }
        .th{
            margin-bottom:15px;
        }
        .tdCell{
            font-weight:700;
            padding:7px 0 !important;;
        }
        .td{
           padding:0 !important;   
        }
        .th3{
            text-align:right;
        }
    }
}

/*CONTATTI--------------------------------------------------------------------------------------------------------*/
.contatti{
    padding:130px 0;
    .contattiContainer{
        width:550px;
        margin:0 auto;
        text-align:center;
        .title{
            margin-bottom:50px;
        }
        span{
            color:@black;
        }
        a{
            color:@gold;
            font-weight:700;
            &:hover{
                color:@goldDark;
            }
        }
    }
    .contattiText{
        margin:0 auto;
        line-height:1.6;
        font-size:16px;
        margin-top:70px;
        h2{
           font-size:30px;
        }
        h3{
           font-size:23px;
           margin-top:25px;
           text-transform:unset;
        }
        a{
           color:@gold !important;
        }
        a:hover{
           color:@goldDark !important;
        }
        p{
            font-size:16px;
            color:@black;
            line-height:1.6;
        }
    }
}

.contattiFormBox{
    padding:110px 0;
    background-color:@black;
    background-image: url('../Gfx/bg-contatti-form.png');
    background-position:bottom left;
    background-repeat:no-repeat;
    background-size:contain;
    .contattiFormContainer{
        width:800px;
        margin:0 auto;
        input[type=text] {
            background-color: transparent;
            padding: 15px 30px;
            width: 46%;
            border: solid 1px @white;
            display: inline-block;
            margin: 1%;
            box-sizing: border-box;
            font-size: 17px;
            color: @white;
            font-family: @font-family;
        }
        span {
            display: inline-block;
        }
        .textareaContainer {
            background-color: transparent;
            height: 160px;
            width: 95%;
            border: solid 1px @white;
            color: @white;
            margin: 1%;
            display: inline-block;
            box-sizing: border-box;
            textarea {
                width: 100%;
                height: 160px;
                border: 0px;
                background-color: transparent;
                font-size: 17px;
                color: @white;
                font-family: @font-family;
                padding:15px 30px;
                box-sizing:border-box;
            }
        }
    }
    .validator {
        height: 3px;
        color: @red;
        display: inline-block;
        margin-left:-30px;
        position:relative;
        z-index:9999;
    }
    .privacy
    {
        font-size:13px;
        color:@gray;
        line-height: 20px;
        margin: 30px 0;
    }
    .informativa {
        height: 95px;
        overflow-y: scroll;
        width: 95%;
        margin: 0 1%;
        display:inline-block;
        &::-webkit-scrollbar-track {
            border-radius: 9px;
            background-color: @gray;
        }
        &::-webkit-scrollbar {
            width: 7px;
            background-color: @gold;
             border-radius: 9px;
        }
        &::-webkit-scrollbar-thumb {
            border-radius: 9px;
            background-color: @gold;
        }
    }
    .privacy_testo
    {
        font-size: 11px;
        color:@gray;
        line-height: 1.2;
        text-align:left;
        b
        {
            font-size: 11px;
        }
        h2 {
            font-weight: bold;
            font-size: 13px;
            margin-bottom: 15px;
            margin-top: 15px;
        }
        td
        {
            padding: 5px;
        }
        a
        {
            color: @gold;
        }
    }
    .privacyContainer {
        text-align: left;
        width: 95%;
        margin: 0 1%;
        display:inline-block;
        font-size:14px;
        color:@white;
        b{
            display:block;
        }
        i{
            display:block;
            margin:7px 0 15px 0;
            font-style:normal;
        }
        input{
            width:30px;
            .inlineMiddle;
            margin:3px 0;
        }
        label{
            width:calc(100% - 45px);
            .inlineMiddle;
            line-height:1.3;
            margin:3px 0;
        }
    }
    .alertTitle {
        color: @gray;
        font-size: 15pt;
        font-weight: bold;
        padding-left: 10px;
        padding-top: 10px;
    }
    .alertBody {
        margin-top: 10px;
        font-size: 11pt;
        line-height: 25px;
    }
    .button{
        padding: 23px 35px;
        font-size:21px;
        margin:65px auto 0 auto;
        display: block;
        width:210px;
        text-align:center;
    }
}

.fnb{
    padding:50px !important;
    font-size:17px;
    text-align:center !important;
    line-height:1.1;
    b{
        font-size:21px;
        color:@gold;
        display:block;
    }
}

/*PRODOTTO--------------------------------------------------------------------------------------------------------*/
.prodotto{
    .prodottoNavBar{
        padding:50px 0;
        text-align:center;
        font-size:17px;
        color:@black;
        font-weight:500;
        a{
            color:@gray;
            font-weight:400;
            line-height:1.3;
            &:hover{
                color:@gold;
            }
        }
        span{
            color:@gray;
            font-weight:300;
            margin:0 9px;
            line-height:1.3;
        }
    }
    .prodottoBox{
        margin-top:110px;
        position:relative;
        .titleTop{
            display:none;
        }
        .mig{
            position:absolute;
            top:-50px;
            left:90px;
            z-index:7;
        }
        .prodottoBoxImage{
            float:left;
            width:50%;
            text-align:center;
            height:500px;
            position: relative;
            img{
                .absoluteCenter;
                width:90%;
            }
        }
        .prodottoBoxText{
            float:left;
            width:50%;
            .title{
                margin-bottom:35px;
                h1{
                    font-size:59px;
                }
            }
            p{
                width:510px;
                font-size:17px;
                line-height:1.5;
                display:block;
                margin-bottom:35px !important;
            }
            .gammeIcon{
                margin:0;
            }
        }
    }
}

.prodottoDetails{
    .prodottoDetailsContainer{
        padding:130px 0 130px 0;
        margin-top:170px;
        position:relative;
        text-align:center;
        img{
            position:absolute;
            bottom:0;
            left:0;
            z-index:3;
            /* width:550px; */
        }
        .prodottoDetailsBox{
            margin:80px 15% 0 15%;
            position:relative;
            z-index:5;
            text-align:left;
            color:@white;
            .prodottoDetailsItem{
                float:left;
                width:21%;
                h4{
                    font-size:25px;
                    font-weight:500;
                    margin-bottom:30px;
                    span{
                        display:block;
                        font-size:15px;
                        margin-top:9px;
                    }
                }
                p{
                    font-size:17px;
                    color:@white;
                }
                label{
                    display:block;
                    font-size:0;
                    margin:3px 0;
                }
                .prodottoRazioneGiornaliera{
                    margin-bottom:15px;
                    i{
                        font-size:25px;
                        .inlineMiddle;
                        width:75px;
                    }
                    i.medium{
                        font-size:31px;
                    }
                    i.big{
                        font-size:41px;
                    }
                    span{
                        font-size:15px;
                        font-weight:500;
                        .inlineMiddle;
                    }
                }
            }
            .prodottoDetailsItem2{
                float:unset !important;
                width:100% !important;
                margin-top:70px;
            }
            .prodottoDetailsValori{
                width:40%;
                margin:0 9%;
                table{
                    width:100%;
                    td{
                        border: 1px solid rgba(255, 255, 255, 0.48);
                        -webkit-background-clip: padding-box; /* for Safari */
                        background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
                        padding:13px 17px;
                    }
                    .tdRight{
                        text-align:right;
                    }
                }
            }
        }
    }
}

.gatto{
    .prodottoBox{
        .prodottoBoxText{
            .title{
                h3{
                    color:@violet;
                }
            }
        }
    }
    .prodottoDetailsContainer{
        .gradientBlackViolet;
        img{
            opacity:0.51;
        }
        .prodottoDogBg{
            display:none;
        }
        .prodottoDetailsBox{
            .prodottoDetailsItem{
                .prodottoRazioneGiornaliera{
                    .icon-dogfood{
                        display:none;
                    }
                }
            }
        }
    }
    .prodottoItem{
        .prodottoItemTitle{
            span{
                color:@violet;
            }
        }
    }
    .buttonGreen{
        display:none;
    }
    .gammaCorrelati{
        .gradientBlackViolet2;
    }
    .gammaIngredientiText, .titleTop h3{
        color:@violet;
    }
    .gamma{
        .gradientBlackViolet;
    }
    .gammaBoxBgCane, .gammaListBgCane{
        display:none;
    }

}

.cane{
    .prodottoBox{
        .prodottoBoxText{
            .title{
                h3{
                    color:@green;
                }
            }
        }
    }
    .prodottoDetailsContainer{
        .gradientBlackGreen2;
        img{
            opacity:0.51;
            /* width:450px; */
        }
        .prodottoCatBg{
            display:none;
        }
        .prodottoDetailsBox{
            .prodottoDetailsItem{
                .prodottoRazioneGiornaliera{
                    .icon-catfood{
                        display:none;
                    }
                }
            }
        }
    }
    .prodottoItem{
        .prodottoItemTitle{
            span{
                color:@green;
            }
        }
    }
    .buttonViolet{
        display:none;
    }
    .gammaCorrelati{
        .gradientBlackGreen;
    }
    .gammaIngredientiText, .titleTop h3{
        color:@green;
    }
    .gamma{
        .gradientBlackGreen2;
    }
    .gammaBoxBgGatto, .gammaListBgGatto{
        display:none;
    }
}

.prodottiCorrelatiBox{
    padding:110px 0 170px;
    text-align:center;
    h2{
        font-size:33px;
        margin-bottom:90px;
    }
}

.prodottoItem{
    padding:0 50px;
    box-sizing:border-box;
    text-align:center;
    display: block;
    .prodottoItemImage{
        position:relative;
        width:100%;
        /* height:330px; */
        img{
            /* position:absolute;
            bottom:0;
            left:0;
            right:0; */
            margin:0 auto;
            text-align:center;
            max-width:90%;
            max-height:330px;
            .transition07;
            &:hover{
                opacity:0.7;
                transform:scale(1.05);
            }
        }
    }
    .prodottoItemTitle{
        margin-top:15px;
        text-align:center;
        span{
            font-size:15px;
            font-weight:500;
            text-transform:uppercase;
            margin-bottom:5px;
            display:block;
        }
        h3{
            font-size:29px;
            color:@black;
            text-transform:unset;
            line-height:1.1;
            height:65px;
        }
    }
    .prodottoItemP{
        display: block;
        margin:13px 0 19px 0 !important;
        -webkit-line-clamp: 5;
        -webkit-box-orient: vertical;
        overflow: hidden;
        overflow-y: hidden !important;
        text-overflow: ellipsis;
        display: -webkit-box;
        height: 91px;
        p{
            font-size:14px;
            line-height:1.3;
        }
    }

    label{
        padding:4px 15px;
        background-color:@bgLightGray;
        .radius15;
        font-size:13px;
        color:@gray;
        font-weight:700;
        display:block;
        width:35px;
        margin:0 auto 15px auto;
    }
}

/*GAMMA--------------------------------------------------------------------------------------------------------*/
.gamma{
    padding:190px 0 70px 0;
    position:relative;
    .gammaBoxBg{
        position:absolute;
        bottom:0;
        left:0;
        height:600px;
        z-index:3;
    }
    .gammaBoxContainer{
        width:1300px;
        margin:0 auto;
        .gammaBoxImage{
            float:left;
            width:45%;
            margin-right:5%;
            position:relative;
            z-index:5;
            height:450px;
            text-align:center;
            img{
                .absoluteCenter;
                width:90%;
            }
        }
        .gammaBoxText{
            float:left;
            width:50%;
            box-sizing:border-box;
            position:relative;
            height:450px;
            .title{
                .absoluteCenter;
                right:unset;
                text-align:left;
                h1{
                    font-size:59px;
                    color:@white;
                }
            }
            p{
                color:@gray;
                display:block;
                margin:35px 0 50px 0 !important;
                b{
                    display:block;
                }
            }
        }
    }
}

.catBox{
    
}

.dogBox{
    .gradientBlackGreen;
}

.gammaIngredienti{
    padding:130px 0;
    background-color:@bgBeige;
    text-align:center;
    .title{
        h2{
            font-size:49px;
            color:@black;
        }
    }
    .gammaIngredientiContainer{
        position:relative;
        text-align:center;
        .gammaIngredientiImage{
            width:870px;
            margin:150px auto 0 auto;
            position:relative;
            .imgIngredienti{
                width:100%;
            }
            .piatto{
                width:100%;
            }
            .line1{
                position:absolute;
                top:-50px;
                left:-50px;
            }
            .line2{
                position:absolute;
                top:210px;
                left:-50px;
                transform:rotate(-30deg);
            }
            .line3{
                position:absolute;
                top:-50px;
                right:70px;
                transform:rotate(-10deg);
                width:270px;
            }
            .line4{
                position:absolute;
                top:230px;
                right:-150px;
                transform:rotate(30deg);
                width:230px;
            }
        }
        .gammaIngredientiText{
            position:absolute;
            width:350px;
            text-align:left;
            h4{
                font-size:25px;
                font-weight:500;
                margin-bottom:15px;
            }
            p{
                font-size:15px;
                color:@black;
                line-height:1.3;
            }
        }
        .gammaIngredientiTextL1{
            top:70px;
            left:0;
        }
        .gammaIngredientiTextL2{
            bottom:30px;
            left:70px;
        }
        .gammaIngredientiTextR1{
            top:30px;
            right:0;
        }
        .gammaIngredientiTextR2{
            bottom:-30px;
            right:0;
        }
    }
}

.gammaListContainer{
    padding:130px 0 0 0;
    .prodottoItem{
        float:left;
        width:33.3%;
        padding:0 80px;
        margin-bottom:130px;
        .button{
            padding:17px;
        }
    }
}

.gammaCorrelati{
    padding:110px 0;
    text-align:center;
    position:relative;
    .gammaListBg{
        position:absolute;
        bottom:0;
        right:0;
        z-index:3;
    }
    .gammaListBgCane{
        opacity:0.51;
    }
    .gammaCorrelatiContainer{
        position:relative;
        z-index:5;
        .title{
            margin-bottom:90px;
            h2{
                font-size:45px;
            }
        }
        .gammaCorrelatiItem{
            float:left;
            width:33.3%;
            img{
                height:170px;
                .transition07;
                &:hover{
                    opacity:0.7;
                    transform:scale(1.05);
                }
            }
            h3{
                font-size:27px;
                color:@white;
                text-transform:unset;
                margin:35px 0 25px 0;
            }
        }
    }
}

/*FOOTER --------------------------------------------------------------------------------------------------------*/
.footer {
    padding:110px 0;
    .footerLogo{
        float:left;
        img{
            width:219px;
        }
    }
    .footerRecapiti{
        float:right;
        font-size:17px;
        text-align:right;
        line-height:1.5;
        b{
            font-size:21px;
            color:@gold;
        }
        a{
            color:@black;
            &:hover{
                color:@gold;
            }
        }
    }
}

/*FOOTER INFO --------------------------------------------------------------------------------------------------------*/
.footerInfo {
    width: 100%;
    background-color: @black;
    padding: 15px 0;
    font-size: 13px;
    color: @white;
    box-sizing: border-box;
    text-align:center;
    span {
        display: inline-block;
        vertical-align: middle;
    }
    a {
        color: @white;
        &:hover {
            color: @gold;
        }
    }
    .footerSep {
        margin: 0 9px;
        color: @white;
    }
}


/*PRIVACY COOKIE--------------------------------------------------------------------------------------------------------*/
.privacy_info {
    text-align: left !important;
    display: none;
    font-size: 13px;
    line-height: 20px;
    width: 70%;
    padding: 90px !important;

    h3 {
        font-size: 33px !important;
        margin-bottom: 15px;
    }

    strong {
        font-size: 13px !important;
    }

    b {
        font-size: 19px !important;
        display: block;
        margin-bottom: 10px;
        margin-top: 20px;
    }

    a {
        color: @black;
        font-weight: 700;
        text-decoration: underline;
    }
}



.bannerCookie {
    position: fixed;
    bottom: 0px;
    left: 0px;
    width: 100%;
    background-color: @white;
    padding: 15px 2%;
    z-index: 99999 !important;
    font-size: 12px;
    -webkit-text-size-adjust: none;
    .boxShadow;
    box-sizing: border-box;

    a {
        color: @black;
        font-weight: bold;

        &:hover {
            color: @black;
        }
    }

    .bannerCookieClose {
        background-color: @black;
        padding: 5px;
        border-radius: 3px;
        color: @white !important;
        margin-left: 20px;
        display: inline-block;
        margin-top: 5px;
        text-decoration: none;

        &:hover {
            background-color: @black;
        }
    }
}

.pOffTesto a {
    text-decoration: none;
    font-weight: bold;
    color: inherit;
}

.nessuno{
    text-align:center;
    padding:90px;
    font-size:25px;
    font-weight:700;
}