#categories{
    text-align: center;
    padding: 2% 0;
}

#categories-links{
    margin: 2% 0;
}

#categories-links a{
    border: 1px solid #223866;
    color: rgb(53, 111, 182);
    padding: 0.5% 0.8%;
    border-radius: 5px;
    margin: 0 2%;
    text-decoration: none;
}

.categorie-title{
    text-align: center;
    text-decoration: underline;
}

.product{
    width: 60%;
    margin: 2% auto;
    border: 2px solid darkblue;
    transition: 0.2s ease all;
}

.product:hover{
    box-shadow: 0px 0px 10px #303133;
    transition: 0.2s ease all;
}

.product img{
    float: right;
    max-width: 27%;
    max-height: 350px;
}

.product .text-medium{
    background-color: #2941BD;
    text-align: center;
    padding: 1% 0;
}

.product-info{
    width: 70%;
    display: inline-block;
}

.product-info-txt{
    margin: 3% 0;
    padding: 0 2%;
    text-align: center;
}

.product-info-data{
    background-color: #1831AF;
    border: 1px solid rgb(84, 104, 201);
}

.product-info-data-caption{
    text-align: center;
    padding: 2% 0;
}

.product-data{
    border-top: 1px solid rgb(84, 104, 201);
    padding: 1% 0;
    display: table;
    vertical-align: central;
    width:100%;
}

.product-data:hover{
    background-color: rgb(51, 76, 201);
}

.product-data p{
    display: inline-block;

}

.product-data p:first-child{
    display: table-cell;
    vertical-align: middle;
    width: 40%;
    padding: 2% 1%;
}

.product-data p:last-child{
    display: table-cell;
    vertical-align: middle;
    width: 56%;
    text-align: right;
    padding: 2% 1%;
}

#sennheiserinfo{
    padding: 2% 0;
    text-align: center;
    text-decoration: none;
}

#sennheiserinfo a{
    text-decoration: none;
    color: #303133;
}


/*1025 to 1440*/
@media only screen and (min-width: 1024px) and (max-width: 1439px){
    .product{
        width: 80%;
        margin: 3% auto;
    }

    .product img{
        max-width: 25%;
        max-height: 280px;
    }
}

/*768 to 1024*/
@media only screen and (min-width: 768px) and (max-width: 1023px){
    .product{
        width: 80%;
        margin: 3% auto;
    }

    .product img{
        max-width: 25%;
        max-height: 280px;
    }
}

/*425 to 767*/
@media only screen and (min-width: 425px) and (max-width: 767px){
    #categories-links{
        margin: 4% auto;
        width: 80%;
    }

    #categories-links a{
        margin: 2% 4%;
        padding: 0.7% 1%;
        display: inline-block;
    }
    
    .product{
        width: 90%;
        margin: 4% auto;
    }

    .product-info{
        width: 90%;
        margin: 0 auto;
        display: block;
    }

    .product img{
        max-width: 30%;
        max-height: 230px;
        float: none;
        text-align: center;
        margin: 0 auto;
        display: block;
    }
}

/*375 to 424*/
@media only screen and (min-width: 375px) and (max-width: 424px){
    #categories-links{
        margin: 4% auto;
        width: 80%;
    }

    #categories-links a{
        margin: 2% 4%;
        padding: 0.7% 1%;
        display: inline-block;
    }
    
    .product{
        width: 90%;
        margin: 4% auto;
    }

    .product-info{
        width: 90%;
        margin: 0 auto;
        display: block;
    }

    .product img{
        max-width: 30%;
        max-height: 150px;
        float: none;
        text-align: center;
        margin: 0 auto;
        display: block;
    }
}

/*320 to 374*/
@media only screen and (min-width: 320px) and (max-width: 374px){
    #categories-links{
        margin: 4% auto;
        width: 80%;
    }

    #categories-links a{
        margin: 2% 4%;
        padding: 0.7% 1%;
        display: inline-block;
    }
    
    .product{
        width: 90%;
        margin: 4% auto;
    }

    .product-info{
        width: 90%;
        margin: 0 auto;
        display: block;
    }

    .product img{
        max-width: 30%;
        max-height: 150px;
        float: none;
        text-align: center;
        margin: 0 auto;
        display: block;
    }
}

/*1 to 319*/
@media only screen and (min-width: 1px) and (max-width: 319px){

}

