@media (min-width: 200px) and (max-width: 800px) {
    .containerDetailProduct{
        display:flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 95%;
        height: auto;
        min-height: 400px;
        margin-top: 10%;
        margin-bottom: 15%;
        /* border: 1px solid red; */
    }

    .containerDetail{
        display:flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        width: 90%;
        height: auto;
        min-height: 400px;
        margin-right: 2%;
        /* background-color: white; */
        padding-top: 2%;

        box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
    }

    .containerDetail >h4{
        display:flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: auto;
        color: #eb0079;
        font-weight: bolder;

        color: #eb0079;
        font-family: 'Courier', monospace;
        text-align: center;
        margin-bottom: 10%;
        /* font-family: 'Notera', sans-serif; */
        
    }

    .containerDetail >div{
        display:flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: auto;
    }

    .containerDetail > div > figure{
        display:flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 300px;
        margin-top: 4%;
        margin-bottom: 4%;
    }

    .imgCoverPage{
        width: 100%; 
        height:300px;
        object-fit: contain;
        transition: transform .2s;
        /*border: 1px dotted #00ae42;*/
    }

    .imgCoverPage:hover{
        width: 100%; 
        height:300px;
        object-fit: contain;
        /*border: 1px dotted #00ae42;*/
        transform: scale(1.1); 
    }

    .containerDetail > div > span{
        display: flex;
        flex-direction: row;
        justify-content:center;
        width: 100%;
        margin-top:2px;
    }

    .containerDetail > div > span > img{
        width: 100px; 
        height:100px;
        border: 1px solid black;
        border: 1px solid #f3d5dd;
        margin-right:2px;
        object-fit: contain;
    }

    .containerDetailText{
        width: 95%;
        height: auto;
        /* border:1px solid green; */
        margin-top: 2%;
    }



    .containerShopProduct{
        display:flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-end;
        width: 90%;
        height: auto;
        min-height: 250px;
        background-color: white;
        padding-top: 2%;
        padding-left: 2%;
        padding-right: 2%;
        box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
        margin-top: 10%;
    }

    .containerShopProduct > h4 {
        display:flex;
        flex-direction: row;
        justify-content: flex-end;
        align-items: flex-end;
        width: 100%;
        margin-bottom: 4%;
        /* border: 1px solid red; */
        border-bottom: 1px solid #F5F5F5;
        font-size: 1.5em;
        font-weight: bold;
        color: #eb0079;
        font-family: 'Notera', sans-serif;

        color: #eb0079;
        font-family: 'Courier', monospace;
    }


    .containerShopProduct > span {
        display:flex;
        flex-direction: row;
        justify-content: flex-end;
        align-items: flex-end;
        width: 100%;
        margin-bottom: 4%;
        border-bottom: 1px solid #F5F5F5;
        font-family: 'Courier', monospace;
        text-align: right;
    }

    .containerShopProduct > form{
        display:flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: flex-end;
        text-align: right;
        width: 100%;
        /* border:1px solid red; */
        margin-bottom: 5%;
    }

    .containerShopProduct > form > p> input {
        display:flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        text-align: right;
        width: 100%;
        margin-top: 4%;
        margin-bottom: 4%;
        border:none;
        border-bottom: 2px solid #F5F5F5;
        font-weight: bold;
    }

    .containerShopProduct > form >p> label {
        font-size: 1.2em;
        font-weight: bold;
    }

    .containerShopProduct > form >p>input[type="number"] {
        text-align: right;
    }

    .containerShopProduct > button {
        display:flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        /* width: 50%; */
        margin-top: 4%;
        margin-bottom: 4%;
    }

    .contactWhatsApp{
        display: table; 
        font-family: sans-serif; 
        text-decoration: none; 
        margin: 1em auto; 
        color: #fff; 
        font-size: 0.9em; 
        /* padding: 1em 2em 1em 3.5em;  */
        padding: 0.9;
        /* border-radius: 2em;  */
        font-weight: bold;
        background: #25d366 url('https://tochat.be/click-to-chat-directory/css/whatsapp.svg') no-repeat 1.5em center;
        background-size: 1.6em;
    }

}