/* Lets start defining some predefined classes */

body.box-layout .km_container_big,
body.box-layout .km_container {

    background:$white;
    padding-left:30px;
    padding-right:30px;
}

.km_container {
    
    position:relative;
    max-width:100%;
    width:1200px;
    padding-right:15px;
    padding-left: 15px;
    margin:0 auto;

}

.page_wrap {
    
    margin:0 auto;
    background:$white;
    width:1200px;
    max-width:100%;
}

body.custom-background .page_wrap {

    padding: 0 15px;
}

body {

    line-height:$body_line_height;
    font-weight:$body_font_weight; 
    font-size:$body_font_size;
    color:$primary_color;
    font-family:$secondary_font_family;
    letter-spacing:$letter_spacing_body;
}

a {

	color:$primary_color;
    text-decoration: none;
	 -webkit-transition: all 0.7s ease;
    transition: all 0.7s ease;

}

a:hover {

	color:$secondary_color;
}


img {

	vertical-align: middle;
	max-width: 100%;
    height:auto;
}


.mask {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1;
}

.if_trending {
    display:inline-block;
    position: absolute;
    left: 0;
    top: 0;
    background:#ff1f32;
    text-align:center;
    z-index:9999;
    width: 35px;
    height: 35px;
    line-height: 35px;
    border-radius: 2px;
}

.if_trending::before {
    
    content:'\f003';
    font-family:'icofont';
    color:$white;
    font-size:24px;
    font-weight:normal;
}


.img_hover_animation {

    position:relative;
    overflow:hidden;
}

.img_hover_animation img {

   -webkit-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.img_hover_animation:hover img {

    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}


.section_title,
.widget_title {

    position: relative;
    margin-bottom:30px;

    h2,h3,h4 {
        
    display: inline-block;
    position: relative;
    z-index: 1;
    margin: 0;
    padding-right: 20px;
    padding-left: 15px;
    border-left:7px solid $secondary_color;
    text-transform: uppercase;
    font-size: 24px;
    font-weight: bold;
    background-color: $white;
    letter-spacing: 1px;
    line-height: 1;
    }

}

.section_title::after,
.widget_title::after {

    position: absolute;
    z-index: 0;
    top: 5px;
    left: 0;
    width: 100%;
    height: 13px;
    background-color: #f5f5f5;
    content: "";

}

.advertisement {

    text-align:center;
}