#ProductDetail {
    padding-top:3%;
    padding-bottom:5%;
}


@media only screen and (max-width: 780px) {


}

    /* ==============  SLIDER  ============== */

    #ProductDetail #ProductSlider .carousel-inner {
        background-color: #fff;
    }


    #ProductDetail #ProductSlider .carousel-item .carousel-caption {
        /* background-color: rgba(0,86,125,0.5);*/
        padding: 30px 70px 30px 0px;
        left: 10% !important;
        bottom: 14rem;
        text-align: left;
        width: 40%;
    }


    #ProductDetail #ProductSlider .carousel-indicators {
        border: none;
        bottom: -70px !important;
    }


        #ProductDetail #ProductSlider .carousel-indicators button {
            background: #CC3333;
            border-color: #CC3333;
            border-radius: 50%;
            width: 20px;
            height: 1px;
            font-size: 0.9em !important;
            margin-right: 10px;
        }


    #ProductDetail #ProductSlider .carousel-inner .carousel-item {
        width: 100%;
        height: 80vh;
        background: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
    }


        #ProductDetail #ProductSlider .carousel-inner .carousel-item img {
            width: auto;
            height: 65%;
        }

    #ProductDetail #ProductSlider .carousel-control-prev {
        width: 4% !important;
        left: 75%;
        top: 90%;
        height: 10%;
    }

        #ProductDetail #ProductSlider .carousel-control-prev span img {
            width: 30px;
            height: 30px;
        }

    #ProductDetail #ProductSlider .carousel-control-next {
        width: 4% !important;
        left: 77%;
        top: 90%;
        height: 10%;
    }

        #ProductDetail #ProductSlider .carousel-control-next span img {
            width: 30px;
            height: 30px;
        }


@media only screen and (max-width: 1460px) {

    #ProductDetail #ProductSlider .carousel-control-next {
        left: 78%;
    }
}


@media only screen and (max-width: 780px) {


    #ProductDetail #ProductSlider {
        padding-bottom:10%;
    }

    #ProductDetail #ProductSlider .carousel-inner .carousel-item {
        height: 50vh;
    }

        #ProductDetail #ProductSlider .carousel-inner .carousel-item img {
            width: auto;
            height: 43%;
        }

        #ProductDetail #ProductSlider .carousel-control-prev {
            left: 40%;
            top: 80%;
        }



        #ProductDetail #ProductSlider .carousel-control-next {
            left: 52%;
            top: 80%;
        }

}



    /* ==============  TITLE  ============== */



#ProductDetail .Title  {
}


    #ProductDetail .Title .ProductImage {
        margin-left: auto;
        margin-right: auto;
    }

        #ProductDetail .Title .ProductImage .Image {
            width: 55%;
            height: auto;
        }

            #ProductDetail .Title .ProductImage .Image img {
                width: 100%;
                height: 100%;
                object-fit:cover;
            }






        #ProductDetail .Title .Line {
            width: 100%;
            height: 2px;
            background: #131414;
        }

        #ProductDetail .Title .Code {
            padding-top: 3%;
            margin: 5px auto 0px auto !important;
        }

        #ProductDetail .Title .Name {
            margin: 12px auto 30px auto !important;
        }


        #ProductDetail .Title .Code h1 {
            font-family: 'Montserrat', sans-serif;
            font-weight: 700;
            font-size: 1.9em;
            color: #131414;
        }

        #ProductDetail .Title .Name h1 {
            font-family: 'Montserrat', sans-serif;
            font-weight: 600;
            font-size: 1.7em;
            color: #5a5756;
        }

@media only screen and (max-width: 780px) {

    #ProductDetail .Title {
        padding-top:8%;
    }

        #ProductDetail .Title .ProductImage .Image {
            width: 95%;
            height: auto;
        }

        #ProductDetail .Title .Code {
            padding-top: 10%;
        }


    #ProductDetail .Title .Code h1 {
        font-size: 1.5em;
    }

    #ProductDetail .Title .Name h1 {
        font-size: 1.4em;
    }

}


    /* ==============  DESCRIPTION  ============== */

#ProductDetail .Description {
    display: flex;
    justify-content: center;
    align-items: center;
}

#ProductDetail .Description .Left {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 4%;
}


        #ProductDetail .Description .Left .Image {
            height: 280px;
            width: auto;
        }

            #ProductDetail .Description .Left .Image img {
                height: 100%;
                width: 100%;
            }




    #ProductDetail .Description .Right {
/*        display: flex;
        justify-content: center;
        align-items: center;*/
        margin-left:auto;
        margin-right:auto;
    }

        #ProductDetail .Description .Right .Text {
            padding: 5%;
            color: #fff;
            column-count: 2;
            column-gap: 40px;
            column-rule: 1px solid #017cba;
        }

            #ProductDetail .Description .Right .Text ul {
                list-style: none; /* Remove default bullets */
            }

                #ProductDetail .Description .Right .Text ul li {
                    padding-bottom: 5px;
                    font-family: 'Montserrat', sans-serif;
                    font-weight: 500;
                    font-size: 0.9em;
                    margin-bottom: 1.5px;
                }



                    #ProductDetail .Description .Right .Text ul li::before {
                        content: "\2022";
                        color: #f5a706;
                        font-weight: 700;
                        display: inline-block;
                        width: 1.2em;
                        margin-left: -1em;
                    }

            #ProductDetail .Description .Right .Text p {
                font-family: 'Montserrat', sans-serif;
                font-size: 1em;
                font-weight:500;
                color: black !important;
            }

        #ProductDetail .Description .Right .Button {
            text-align:center;
            padding:1% 0 4% 0;
        }

            #ProductDetail .Description .Right .Button a {
                font-family: 'Montserrat', sans-serif;
                color: #fff;
                background: #017cba;
                border: 1px solid #017cba;
                font-size: 1.2em;
                font-weight: 500;
                text-decoration: none;
                padding: 8px 30px;
                letter-spacing: 0.75px;
                border-radius: 8px;
                transition: 0.3s ease all;
            }

 



@media only screen and (max-width: 1460px) {

    #ProductDetail .Description .Left {
        min-height: 550px;
    }

    #ProductDetail .Description .Left .Image {
        height: 240px;
        width: auto;
    }
}



@media only screen and (max-width: 1200px) {
    #ProductDetail .Description .Right .Text {
        padding: 1%;
    }
   
}



@media only screen and (max-width: 780px) {

    #ProductDetail .Description .Left {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 4%;
        min-height: 300px;
    }


    #ProductDetail .Description .Left .Image {
        height: 150px;
        width: auto;
    }


    #ProductDetail .Description .Right {
        padding-top: 5%;
        padding-bottom:8%;
    }

    #ProductDetail .Description .Right .Text {
        padding:2%;
        color: #fff;
        column-count: 1;
        column-gap: 0px;
        column-rule: none;
    }
}


    /* ==============  PRODUCT GALLERY  ============== */

    #ProductDetail .Gallery {
        padding-top: 4%;
        padding-bottom: 4%;
    }

        #ProductDetail .Gallery .Title {
            display: flex;
            align-items: center;
            padding-left: 0 !important;
            padding-right: 0 !important;
            padding-bottom: 2%;
        }


            #ProductDetail .Gallery .Title .Line {
                width: 80%;
                height: 2.3px;
                background-color: black;
                opacity: 0.7;
                padding-right: 0 !important;
            }


            #ProductDetail .Gallery .Title h2 {
                color: black;
                padding-left: 15px;
                font-size: 1.8em;
                font-family: 'Montserrat', sans-serif;
                font-weight: 700;
            }



        #ProductDetail .Gallery .col-md-4 {
            padding: 10px 10px !important;
        }



        #ProductDetail .Gallery .Title h1 {
            font-family: 'Montserrat', sans-serif !important;
            font-size: 3.5em;
            font-weight: 300;
            color: #414042;
            letter-spacing: 2px;
        }



        #ProductDetail .Gallery .Card {
            position: relative;
        }

            #ProductDetail .Gallery .Card a {
                text-decoration: none;
            }

            #ProductDetail .Gallery .Card .Image {
                height: 350px;
                width: 100%;
                border-radius: 5px;
                background-color: #414042;
            }

                #ProductDetail .Gallery .Card .Image img {
                    height: 100%;
                    width: 100%;
                    object-fit: cover;
                    border-radius: 5px;
                    opacity: 0.5;
                    transition: 0.5s ease all;
                }


            #ProductDetail .Gallery .Card:hover .Image img {
                opacity: 1;
                transition: 0.5s ease all;
            }

            #ProductDetail .Gallery .Card h3 {
                position: absolute;
                left: 12px;
                bottom: 5px;
                color: #fff;
                font-family: 'Montserrat', sans-serif !important;
                font-size: 1.2em;
                font-weight: 600;
                letter-spacing: 1px;
                transition: 0.5s ease all;
            }

            #ProductDetail .Gallery .Card:hover h3 {
                opacity: 0;
                transition: 0.5s ease all;
            }

            #ProductDetail .Gallery .Card i {
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%,-50%);
                color: #fff;
                font-size: 2em;
                opacity: 1;
                transition: 0.5s ease all;
            }

            #ProductDetail .Gallery .Card:hover i {
                opacity: 0;
                top: 0%;
                transition: 0.5s ease all;
            }


@media only screen and (max-width: 1460px) {

    #ProductDetail .Gallery .Title .Line {
        width: 75%;
    }
}

@media only screen and (max-width: 1200px) {
    #ProductDetail .Gallery .Title .Line {
        width: 65%;
    }


    #ProductDetail .Gallery .Title h1 {
       font-size: 2.7em;
    }

    #ProductDetail .Gallery .Card .Image {
        height: 300px;
        width: 100%;
        border-radius: 5px;
        background-color: #414042;
    }
}



    @media only screen and (max-width: 780px) {

        #ProductDetail .Gallery {
            padding-top:8%;
            padding-bottom:8%;
        }

        #ProductDetail .Gallery .Title .Line {
            width: 35%;
        }


        #ProductDetail .Gallery .Title h2 {
            padding-left: 15px;
            font-size: 1.5em;
        }

        #ProductDetail .Gallery .col-md-12 {
            padding-left: 7px;
        }


        #ProductDetail .Gallery .Title h1 {
            font-size: 2.7em;
            font-weight: 500;
        }

        #ProductDetail .Gallery .col-md-4 {
            padding: 7px 7px !important;
        }

        #ProductDetail .Gallery .Card .Image {
            height: 150px;
            width: 100%;
            border-radius: 0px;
        }

            #ProductDetail .Gallery .Card .Image img {
                height: 100%;
                width: 100%;
                object-fit: cover;
                border-radius: 0px;
                opacity: 0.5;
            }


        #ProductDetail .Gallery .Card h3 {
            opacity: 0 !important;
        }

        #ProductDetail .Gallery .Card i {
            opacity: 0 !important;
        }
    }


    /* ==============  PRODUCT VIDEO  ============== */


#ProductDetail .VideoTitle {
   padding-top:2%;
   padding-bottom:2%;
}

#ProductDetail .VideoTitle .Title {
    display: flex;
    align-items: center;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 2%;
}


    #ProductDetail .VideoTitle .Title .Line {
        width: 80%;
        height: 3px;
        background-color: black;
        opacity: 0.7;
        padding-right: 0 !important;
    }


    #ProductDetail .VideoTitle .Title h2 {
        color: black;
        padding-left: 15px;
        font-size: 1.8em;
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
    }



#ProductDetail .Video {
    width: 100%;
    height: 650px;
}



        #ProductDetail .Video .Icon {
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
        }

            #ProductDetail .Video .Icon a {
                text-decoration: none;
            }


                #ProductDetail .Video .Icon a img {
                    width: 80px;
                    height: 80px;
                }



@media only screen and (max-width: 1460px) {

    #ProductDetail .Video {
        height: 550px;
    }

    #ProductDetail .VideoTitle .Title .Line {
        width: 75%;
    }
}

@media only screen and (max-width: 1200px) {

    #ProductDetail .Video {
        height: 480px;
    }

    #ProductDetail .VideoTitle .Title .Line {
        width: 65%;
    }


}

    @media only screen and (max-width: 780px) {

        #ProductDetail .Video {
            width: 100%;
            height: 250px;
        }

        #ProductDetail .VideoTitle .Title .Line {
            width: 35%;
        }

        #ProductDetail .VideoTitle .Title h2 {
            padding-left: 15px;
            font-size: 1.5em;
        }

    }