@import url('https://fonts.googleapis.com/css2?family=Comfortaa&display=swap');

html, body, h1, h2, h3, h4, h5, h6, a, p, span, b, div, u, li {
font-family: 'Comfortaa' !important;
}


@media (max-width: 767px){
    .flex {
        flex-direction: column;
    }
        .items-center{
            align-items: start!important;
        }
    }
    
.slide-price{

}


@media(max-width:767px){
    .image{
    max-width:200px!important;
}
}
.image{
    max-width:300px;
}

.navbar{
    border:0px!important;
}

.footer{
    border:0px ;;}



div.footer{
background-color: #55585a!important;
}


.owl-stage > div > div> a> div> span{

    display:none;

}
.post-container > div > a > div > span{
   display:none;
}
.post-info > div > h6{
    display:none;
} 


/* Image Hover Effects*/
    .container1{

    text-align: center;
    width: 100%;
    box-sizing: border-box;
}
.container1 .box1{
    position: relative;
    display: inline-block;
    margin: 10px;
    overflow: hidden;
}
.container1 .box1 img{
    position: relative;
    width: 100%;  
    height: 100%;
    transition: 5s;
}
.container1 .box1:hover img{
    transform: scale(2);
}


.container1 .box1::before,.container1 .box1::after{
    content: '';
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    transition: 1s;
    z-index: 2;
}
.container1 .box1::before{
    transform: scale(1,0); 
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
}
.container1 .box1::after{
    transform: scale(0,1);
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
.container1 .box1:hover::before,.container1 .box1:hover::after{
    transform: scale(1,1);
}


.container1 .box1 .content1{
    position: absolute;
    top: 0;  left: 0;
    width: 100%;  height: 100%;
    background: rgba(0,0,0,0);
    display: flex;
    justify-content: center;   
    align-items: end;
    padding-bottom: 20px;
    transition: 1s;

}
.container1 .box1:hover .content1{
    background: rgba(0,0,0,31%);
}
.container1 .box1 .content1 .wrap{
    box-sizing: border-box;
    padding: 20px;
    color: #fff;
    z-index: 3;
}
.container1 .box1 .content1 .wrap i{
    position: relative;
    font-size: 20px;
    margin-bottom: 10px;
    transform: translateY(-80px);
    opacity: 0;
    transition: 1s;
}
.container1 .box1:hover .content1 .wrap i{
    transform: translateY(0);
    opacity: 1;
}
.container1 .box1 .content1 .wrap p{
    position: relative;
    font-size: 15px;
    transform: translateY(170px);
    opacity: 0;
    transition: .5s;
}
.container1 .box1:hover .content1 .wrap p{
    transform: translateY(0px);
    opacity: 1;
}
/**end of hove***/

@media (min-width: 768px) {
    .navbar-nav>li>a {
        padding-top: 14px;
        padding-bottom: 14px;
        color: #000;
    }
}


 @media(max-width: 767px) {

    .reverse-mobile {
        display: flex;
        flex-direction: column;
    }

    .reverse-mobile #mob-1 {
        order: 1;
    }

    .reverse-mobile #mob-2 {
        order: 2;
    }

}

.special:hover{
 transform: scale(1.05)!important;
 transition: 0.5s!important;
}


 @media(max-width: 768px) {

    .reverse-mobile {
        display: flex;
        flex-direction: column;
    }

    .reverse-mobile #mob-1 {
        order: 1;
    }

    .reverse-mobile #mob-2 {
        order: 2;
    }

}