/*-----------------Principal section------------------*/
/*--------------Category image---------------*/
#catImg_section{
    width: 100%;
    margin-bottom: 1%;
    display: none;

    background-image: linear-gradient(to bottom, #f0f8ff 0%, #3688a8 100%);
}

#catImg_link{
    width: 100%;
    height: 100%;
    opacity: 0.8;
    
}
/*--End category image--*/

/*--------------Category section---------------*/
#category_section{
    display: flex;
    flex-direction: column;
}

.container{
    margin-top: 4%;
    width: 100%;
}
#category_title{
    padding: 0.6em 0em 0.6em 0.3em;
    margin-bottom: 0%;
}
.container .ul{
    padding: 0em;
    margin:0;
}
.container .li{
    list-style: none;
    padding: 3%;
}
.container .li h3{
    margin: 0;
    position: relative;
}
.container .li.active{
    background-color:#3688a8;
    color: aliceblue;
}
.container .li.active h3{
    color: aliceblue;
}
.container .subcont{
    min-height: 20vh;
    width: 100%;
}

/*-------Underline effect-------*/
.container .li h3::before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    background:#005B7F;
    transition: all 0.5s;
}
.container .li.active h3::before{
    background:aliceblue;
}

.container .li h3:hover::before{
    width: 100% !important;
}
.container .li:hover{
    cursor: pointer;
}
/*--End underline effect--*/

.container .block{
    display: none;
    transition: all .5s ease;
}
.container .block.active{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

/*-----------Product section------------*/
.cat_products{
    width: 95%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-around;
}

.cat_product_itemLink{
    width: 100%;
    text-decoration: none;
    padding: 4% 0% 4% 0%;
    margin-top:2.5rem;

    display: flex;
    flex-direction: column;
    align-items: center;
}
.cat_product_img{
    width: 90%;
    margin: 0;
}
.cat_product_imgLink{
    width: 100%;
}
.cat_product_text{
    width: 90%;
}
.cat_product_title h4{
    margin: 2%;
    margin-left: 0;
}
.cat_product_desc{
    margin: 0;
}
.subcat_desc{
    margin: 0 1em 0 1em;
}
/*--End product section--*/

/*--End category section--*/
/*--End principal section--*/

/*--------------------------Media queris----------------------------*/
/*Medium screens (tablets larger than 768px)*/
@media screen and (min-width:768px) {
    /*--------------Category image---------------*/
    #catImg_section{
        display: flex;
        width: 100%;
        margin: 1% 0% 4% 0%;
    }
    #catImg{
        margin: 0;
    }
    #catImg_link{
        width: 100%;
    }

    #catContent{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }
    #category_list{
        background-color: white;
        width: 30%;
    }

    .container{
        margin-top: 0;
        display: flex;
        justify-content: space-between;
    }
    #category_title{
        padding: 0.3em;
        margin-bottom: 0%;
    }
    #category_title h2{
        margin: 0;
        margin-bottom: 4%;
    }
    .container .li{
        padding: 0.6rem;
    }
    .container .subcont{
        width: 67%;
    }
    .container .block{
        margin: 0em;
        padding: 0em;
    }
    /*-----------Product section------------*/
    .cat_products{
        width: 100%;
        justify-content: space-between;
    }
    .cat_product_itemLink{
        margin-bottom:3%;

        padding: 3%;
        margin-top:0;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
    .cat_product_img{
        width: 40%;
        margin: 0;
        display: flex;
        align-items: center;
    }

    .cat_product_imgLink{
        width: 100%;
    }
    .cat_product_text{
        width: 50%;
        
    }
    .cat_product_title h4{
        margin: 0em 0em 1em 0em;
    }
    .cat_product_desc{
        margin: 0;
    }
}