
//Brand Color

$line-color:	   #dfdedf; 
$brand-gold:	   #D1B786;
$brand-grey:	   #898483;
$brand-hovergrey:  #cccccc;

//Color
$color-lightgrey:  #F6F6F6;
$color-midgrey:	   #9B9B9B;
$color-darkgrey:   #494949;
$color-black:      #333;
$color-white:      #fff;
$content-color:	   #231916;
$footer-background:#393939;
//Font-size
$font-size-xs:		10px;
$font-size-sm:		14px;
$font-size-base:	16px;
$font-size-md:		18px;
$font-size-lg:		24px;
$font-size-xl:		30px;
$font-size-xml:		36px;
$font-size-xxl:		40px;


$title: 'MSung HK Medium', sans-serif;
$elletitle: 'MElle HK Light', sans-serif;

@mixin background-img($image-png, $image-svg){
	background-image:($image-png);
	background:linear-gradient(transparent, transparent),($image-svg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center center;
}
@mixin divider($height, $color){
	height: ($height);
	width: 1px;
	background-color: ($color);
	display: inline-block;
	margin: 0 5px;
	
}

@mixin gold-btn($size){
	color: $brand-gold;
    font-size: $size;
    padding:5px 30px;
    border: 1px solid $brand-gold;
    display: inline-block;
    letter-spacing: 1px;
    transition:0.5s;
    &:hover{
		background-color: $brand-gold;
		color:$color-white;
    }
}

@mixin ent-title($fontsize){
    font-family: $elletitle;
    font-size: $fontsize; 
    display: inline-block;
    letter-spacing: 1px;
    color:$brand-grey;
    transition:0.5s;
    &:before{
         content: "";
        background-image: url('../images/title-decor1.png');
        background-position: left bottom;
        background-repeat:no-repeat;
        background-size: 40px;
        width: 60px;
        display: inline-block;
        height:30px;
    }
    &:after{
         content: "";
        background-image: url('../images/title-decor2.png'); 
        background-position: right bottom;
        background-repeat:no-repeat;
        background-size: 40px;
        width: 55px;
        display: inline-block; 
        height:30px;
    }

}


@mixin ent-title-sm($fontsize){
    font-family: $elletitle;
    font-size: $fontsize; 
    display: inline-block;
    letter-spacing: 1px;
    color:$brand-grey;
    transition:0.5s;
    &:before{
         content: "";
        background-image: url('../images/title-decor1.png');
        background-position: left bottom;
        background-repeat:no-repeat;
        background-size: 30px;
        width: 30px;
        display: inline-block;
        height:30px;
    }
    &:after{
         content: "";
        background-image: url('../images/title-decor2.png'); 
        background-position: right bottom;
        background-repeat:no-repeat;
        background-size: 30px;
        width: 25px;
        display: inline-block; 
        height:30px;
    }

}


@mixin underline-title-sm($color){
	color:($color);
    font-weight:700;
    font-family: $title;
    padding-bottom:5px;
    border-bottom:2px solid ($color);
            display: inline-block;
            margin-bottom:20px;
}