/*brand css here*/
.brand_area {
	margin-bottom: 87px;
    @media #{$tablet-device}{
        margin-bottom: 67px;
    }
    @media #{$large-mobile}{
       margin-bottom: 40px;
    }
}
.brand_container{
    & .single_brand{
        & img{
            width: inherit;
            margin: 0 auto;
        }
    }
    &:hover{
        & .owl-nav{
            & div{
                opacity: 1;
                visibility: visible;
                left: 0;
                &.owl-next{
                    right: 0;
                }
            }
        }
    }
    & .owl-nav{
        &.disabled{
            display: block;
        }
        & div{
            position: absolute;
            top: 50%;
            transform: translatey(-50%);
            font-size: 50px;
            left: 15px;
            transition: .3s;
            opacity:0;
            visibility: hidden;
            &:hover{
                color: $secondary_color;
            }
            &.owl-next{
                right: 15px;
                left: auto;
            }
        }
    }
}

/*instragam css here*/
.instragam_thumb{
    position: relative;
    &:hover{
        &::before{
            opacity: 0.7;
        }
        & .instragam_icone{
            opacity: 1;
            visibility: visible;
        }
    }
    & img{
        @media #{$small-mobile2}{
           width: 100%;
        }
    }
    &::before{
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background: $secondary_color;
        opacity: 0;
        transition: .3s;
        pointer-events: none;
    }
}
.instragam_icone {
	position: absolute;
	top: 50%;
	transform: translatey(-50%);
	left: 0;
	right: 0;
	text-align: center;
    opacity: 0;
    visibility: hidden;
    transition: .3s;
    & a{
        font-size: 30px;
        color: #fff;
        display: inline-block;
    }
}

.instragam_button{
    text-align: center;
    margin-top: 30px;
    & a{
        padding: 7px 14px;
        font-size: 13px;
        border-radius: 4px;
        background: #408bd1;
        color: #fff;
        display: inline-block;
        &:hover{
            box-shadow: inset 0 0 10px 20px #359dff;
        }
    }
}


.instragam_four{
    & .section_title{
        margin-bottom: 40px;
        @media #{$large-mobile}{
           margin-bottom: 25px;
        }
    }
    & .instragam_thumb{
        @media #{$large-mobile}{
           margin-bottom: 30px;
        }
    }
    & .instragam_button{
        @media #{$large-mobile}{
           margin-top: 0;
        }
    }
    
}