@import url('https://fonts.cdnfonts.com/css/911-porscha');

#imgLogoProtopos{
    width: 100%;
    padding-top: 80px;
}

#mk2putter{
    padding-top: 60%;
    padding-left: 2%;
    font-family: '911 Porscha';
}

#c12putter{
    padding-top: 60%;
    padding-left: 2%;
    font-family: '911 Porscha';
}

.imgNavbarClass{
    display: block;
}

#risultatiOttenuti{
    border-right: 5px solid black;
}

.zoomCard{
    transition: transform .2s;
}

.zoomCard:hover{
    transform: scale(1.05);
    z-index: 90;
}

#titleLineDetail{
    background-image: url(../imgComp/c12draw.jpeg); 
    background-position: center; 
    height: 250px;
    align-items: center; 
    text-align: center;
}

#titleLineDetailMK2{
    background-image: url(../imgComp/protoposmk2draw.jpg); 
    background-position: center; 
    height: 250px;
    align-items: center; 
    text-align: center;
}

.btnCustom{
    background-color:white; 
    height: 45px; 
    color: black; 
    width: 145px;
    border: 2px solid black;
    box-shadow: 0 5px #999;
    font-weight: 450;
}

.btnCustom:hover{
    background-color:black; 
    color:white;
    border: 2px solid black;
}

.btnCustom:active{
    background-color:white; 
    color:black;
    border: 2px solid black;
}

.selectColumn{
    padding: 20px;
    width: 30%;
    margin: 10px;
    border-radius: 10px;
}

.imgConfiguratore{
    max-width: 70%;
    height: 300px;
}

.titleConfiguratore{
    color: black;
}

.buttonConfiguratore{
    display: none;
}

.colBtnConf{
    width: 100%;
}

#descrizioneRisultatiOttenuti{
    margin: 10px;
}

#chiSiamoText{
    height: 450px;
}

@media screen and (max-width: 600px )  {
    #imgLogoProtopos{
        width: 100%;
        padding-top: 60px;
    }

    .imgNavbarClass{
        display: none;
    }

    #mk2putter{
        padding-top: 50%;
        padding-left: 2%;
    }

    #c12putter{
        padding-top: 50%;
        padding-left: 2%;
    }

    #risultatiOttenuti{
        border-right: 0px;
    }

    .zoomCard:active{
        transform: scale(1.05);
        z-index: 90;
    }

    #chiSiamoText{
        text-align: center;
        height: auto;
    }

    #titleLineDetail{
        background-image: url(../imgComp/c12draw.jpeg); 
        background-position: center; 
        background-size: cover;
        height: 250px;
        align-items: center; 
        text-align: center;
    }

    #titleLineDetailMK2{
        background-image: url(../imgComp/protoposmk2draw.jpeg); 
        background-position: center; 
        background-size: cover;
        height: 250px;
        align-items: center; 
        text-align: center;
    }

    .selectColumn{
        width: 80%;
        margin-left: 30px;
    }

    .imgConfiguratore{
        max-width: 100%;
    }

    .colBtnConf{
        width: 50%;
    }

    #descrizioneRisultatiOttenuti{
      margin: 0px;
    }
}

@media screen and (min-width: 768px ) and (max-width: 995px) {
    #imgLogoProtopos{
        width: 100%;
        padding-top: 70px;
    }

    .imgNavbarClass{
        display: none;
    }

    #mk2putter{
        padding-top: 50%;
        padding-left: 2%;
    }

    #c12putter{
        padding-top: 50%;
        padding-left: 2%;
    }

    #risultatiOttenuti{
        border-right: 0px;
    }

    .zoomCard:active{
        transform: scale(1.05);
        z-index: 90;
    }

    #chiSiamoText{
        text-align: center;
        height: auto;
    }

    #titleLineDetail{
        background-image: url(../imgComp/c12draw.jpeg); 
        background-position: center; 
        background-size: cover;
        height: 250px;
        align-items: center; 
        text-align: center;
    }

    #titleLineDetailMK2{
        background-image: url(../imgComp/protoposmk2draw.jpeg); 
        background-position: center; 
        background-size: cover;
        height: 250px;
        align-items: center; 
        text-align: center;
    }

    .selectColumn{
        width: 80%;
        margin-left: 30px;
    }

    .imgConfiguratore{
        max-width: 100%;
    }

    .colBtnConf{
        width: 50%;
    }

    #descrizioneRisultatiOttenuti{
      margin: 5px;
    }
}