/**
 *    [Table of contents]
 *
 *    [&. Content / #key]
 *    [Let press Ctrl + f and type of paste the key, then press Enter to search the content ]
 *
 *    Summary:
 *
 *    0. VARIABLE LESS
 *        - 0.1. Color
 *    1. RESPONSIVE SCREEN
 		  - 1.0. Responsive for layout boxed style
 *        - 1.1. Media screen max width 1024px
 *        - 1.2. Media screen max width 768px
 *        - 1.3. Media screen max width 767px
 *        - 1.4. Media screen max width 600px
 *        - 1.5. Media screen max width 480px
 *        - 1.6. Media screen max width 414px
 *        - 1.7. Media screen max width 375px
 *        - 1.8. Media screen max width 320px
 */

/*
=====================================
=            VARIABLE LESS          =
=====================================
*/

/*
 *
 *    [Table of contents]
 *
 *    [&. Content / #key]
 *    [Let press Ctrl + f and type of paste the key, then press Enter to search the content ]
 *
 *    Summary:
 *
 *    0. VARIABLE LESS
 *        - 0.1. Color
 *        - 0.2. Font
 *    1. MIXINS


/*
=============================
====    VARIABLE LESS    ====
=============================
*/

/*
----------  0.1. Color  ----------
*/

/*
----------  0.2. Font  ----------
*/

/*
=============================
===   END VARIABLE LESS   ===
=============================
*/

/*
=============================
====        MIXINS       ====
=============================
*/

/*
=============================
===       END MIXINS      ===
=============================
*/

/*
----------  0.1. Color  ----------
*/

/*
=====  End of VARIABLE LESS  ======
*/

/*
=========================================
=            RESPONSIVE SCREEN          =
=========================================
*/


/*----------  1.1. Media screen max width 1024px  ----------*/


@media screen and (max-width: 1024px) {
	
	/*----------  post grid  ----------*/
	.slz-block-grid.style-1 .small-block .block-title{
		font-size: 24px;
	}
	.slz-block-grid.style-1 .small-block.block-element-2{
		width:50%;
	}
	.slz-block-grid.style-1 .small-block.block-element-3,
	.slz-block-grid.style-1 .small-block.block-element-4,
	.slz-block-grid.style-1 .small-block.block-element-5{
		width:33.3333%;
	}
	.slz-block-grid.style-1 .small-block.block-element-3 .block-title,
	.slz-block-grid.style-1 .small-block.block-element-4 .block-title,
	.slz-block-grid.style-1 .small-block.block-element-5 .block-title{
		font-size: 18px;
	}
	.slz-block-grid.style-1 .small-block.block-element-2 .block-info{
		display: block;
	}
	.slz-block-grid.style-1 .block-text{
		display: none;
	}
	.slz-block-grid.style-1 .big-block .block-image:before{
		padding-top: 67%;
	}
	.slz-block-grid.style-3 .small-block .block-title{
		font-size: 14px;
	}
	.slz-block-grid.style-6 .small-block{
		width: 33.3333%;
	}
	.slz-block-grid.style-6 .small-block .block-title{
		font-size: 18px;
	}
	.slz-block-grid.style-7 .block-element .block-text{
		display: none;
	}
	.slz-block-grid.style-7 .small-block .block-info{
		display: none;
	}
	/*----------  Project Carousel  ----------*/
	.slz-carousel-wrapper .slick-arrow.btn-prev{
		left: -5px;
	}
	.slz-carousel-wrapper .slick-arrow.btn-next{
		right: -5px;
	}
	/*----------  title command  ----------*/
    .header-absolute{
    	padding-top: 40px;
    }
    .slz-sub-header.slz-main-menu {
    	display: block; 
	}
	.slz-post-mansory-layout-1 .slz-isotope-grid .slz-block-item-01 .block-text:not(:empty){
		margin-bottom: 20px;
	}
	.slz-post-mansory-layout-1 .slz-isotope-grid .slz-block-item-01 .block-content-wrapper >.block-info,
	.slz-post-mansory-layout-1 .slz-isotope-grid .slz-block-item-01 .block-content-wrapper >.date{
		font-size: 12px;
		display: inline-block;
		width: auto;
		float: none;
		left: auto;
		right: auto;
		margin-right: 10px;
		position: relative;
		line-height: 1.5;
	}
	.slz-post-mansory-layout-1 .slz-isotope-grid .slz-block-item-01 .block-content-wrapper >.block-info .link{
		font-size: 12px;
		line-height: 1.5;
	}
	.slz-post-mansory-layout-2 .slz-block-item-01 .block-text:not(:empty){
		display: block;
	}

}

@media screen and (max-width: 1000px) {
	.slz_col-md-12{
		width:100%;
		float: none;
	}
}
/*----------  1.2. Media screen max width 768px  ----------*/

@media screen and (max-width: 768px) {
	
	/*----------  Post grid  ----------*/
	.slz-block-grid.style-1 .small-block.block-element-3, 
	.slz-block-grid.style-1 .small-block.block-element-4, 
	.slz-block-grid.style-1 .small-block.block-element-5{
		width:50%;
	}
	.slz-block-grid.style-1 .small-block.block-element-2 .block-title, 
	.slz-block-grid.style-1 .small-block.block-element-3 .block-title, 
	.slz-block-grid.style-1 .small-block.block-element-4 .block-title, 
	.slz-block-grid.style-1 .small-block.block-element-5 .block-title{
		font-size: 18px;
	}
	.slz-block-grid.style-1 .small-block .block-info{
		display: block;
		bottom: 10px;
	}

	.slz-block-grid.style-2 .small-block .block-info{
		display: block;
		bottom: 10px;
	}
	.slz-block-grid.style-3 .big-block,
	.slz-block-grid.style-3 .medium-block{
		width:50%;
	}
	.slz-block-grid.style-3 .big-block .block-image:before,
	.slz-block-grid.style-3 .medium-block .block-image:before{
		padding-top: 67%;
	}
	.slz-block-grid.style-3 .block-element .block-text{
		display: none;
	}
	.slz-block-grid.style-3 .block-element.small-block .block-title,
	.slz-block-grid.style-3 .block-element.medium-block .block-title,
	.slz-block-grid.style-3 .block-element.big-block .block-title{
		font-size: 18px;
	}
	.slz-block-grid.style-3 .medium-block .block-info,
	.slz-block-grid.style-3 .small-block .block-info{
		display: block;
	}
	.slz-block-grid.style-4 .block-element .block-text{
		display: none;
	}
	.slz-block-grid.style-4 .slz-block-item-01 .block-title{
		font-size: 18px;
	}
	.slz-block-grid.style-6 .block-element .block-text{
		display: none;
	}
	.slz-block-grid.style-6 .slz-block-item-01 .block-title{
		font-size: 18px;
	}
	.slz-block-grid.style-6 .block-element.block-element-3,
	.slz-block-grid.style-6 .block-element.block-element-4{
		width: 50%;
	}
	.slz-block-grid.style-6 .small-block  .block-content{
		text-align: left;
	}
	.slz-block-grid.style-6 .block-element .block-info{
		display: none;
	}
	.slz-block-grid.style-6 .small-block  .block-content .block-content-wrapper{
		top: auto;
		bottom: 0;
		transform: translate(0%,0%);
		-webkit-transform: translate(0%,0%);
		-moz-transform: translate(0%,0%);
		-o-transform: translate(0%,0%);
	}
	.slz-block-grid.style-6 .small-block .block-content:before{
		height: 200%;
	    background: rgba(0,0,0,0.5);
		background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 100%);
	    background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.7) 100%);
	    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.7) 100%);
	    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#80000000',GradientType=0 );
	}
	.slz-block-grid.style-6 .small-block .slz-block-item-01:hover .block-content:before{
		-moz-transform: translateY(-40%);
	    -webkit-transform: translateY(-40%);
	    -o-transform: translateY(-40%);
	    -ms-transform: translateY(-40%);
	    transform: translateY(-40%);
	}
	.slz-block-grid.style-7 .block-element .block-info{
		display: none;
	}
	.slz-block-grid.style-7 .big-block,
	.slz-block-grid.style-7 .medium-block,
	.slz-block-grid.style-7 .small-block{
		width: 50%;
	}
	.slz-block-grid.style-7 .small-block .slz-block-item-01 .block-title,
	.slz-block-grid.style-7 .block-element  .block-title{
		font-size: 18px;
	}
	/*----------  Isotope Grid  ----------*/
    
	.slz-footer-main .col-md-3 {
		margin-top: 50px;
	}

	.slz-footer-main .col-md-3:first-child {
		margin-top: 0;
	}
	.slick-slide, 
	.slz-carousel-wrapper .slick-slide{
		height: auto;
	}
	.slz_col-md-12{
		width:100%;
		float: none;
	}
	/*----------  post marsory  ----------*/
	
	.slz-isotope-grid .slz-block-item-01 .block-text:not(:empty){
		margin-bottom: 20px;
	}
	.slz-isotope-grid .slz-block-item-01 .block-content-wrapper >.block-info,
	.slz-isotope-grid .slz-block-item-01 .block-content-wrapper >.date{
		font-size: 12px;
		display: inline-block;
		width: auto;
		float: none;
		left: auto;
		right: auto;
		margin-right: 10px;
		position: relative;
		line-height: 1.5;
	}
	.slz-isotope-grid .slz-block-item-01 .block-content-wrapper >.block-info .link{
		font-size: 12px;
		line-height: 1.5;
	}
	.slz-post-mansory-layout-1 .slz-block-item-01 .block-content{
		padding-bottom: 20px;
	}
	.comments-area .comment-metadata{
		float: none;
		display: block;
		padding-left: 100px;

	}
	.slz_col-sm-12{
		width: 100%;
		float: none;
	}

	
	.slz-isotope-grid-2 .grid-item .block-content .block-text{
		max-height: 50px;
		overflow: hidden;
	}

	.portfolio_slide_slick .feature-image + .slz-block-item-03.portfolio-item .block-text {
		padding-bottom: 50px;
	}
}	

/*----------  1.3. Media screen max width 767px  ----------*/

@media screen and (max-width: 767px) {
	.slz_col-sm-12{
		width: 100%;
		float: none;
	}
	.comments-area .comment-metadata{
		padding-left: 80px;
	}
	.slz_col-xs-4{
		width: 33.3333%;
		float: left;
	}

	.portfolio_slide_slick .feature-image {
		display: none;
	}

	.portfolio_slide_slick .feature-image + .slz-block-item-03.portfolio-item {
		width: 100%;
		padding: 0;
	}

	.slz-pricing-plan-01 .col-md-4,
	.slz-pricing-plan-01 .col-md-3,
	.slz-pricing-plan-01 .col-md-6 {
		margin-top: 30px;
	}

	.slz-pricing-plan-01 .col-md-3:first-child,
	.slz-pricing-plan-01 .col-md-4:first-child,
	.slz-pricing-plan-01 .col-md-6:first-child {
		margin-top: 0;
	}

	.slz-posts-mansory .slz-isotope-grid-2 .grid-item:before, 
	.slz-posts-mansory .slz-isotope-grid-2 .grid-item-width-2:before {
		padding-top: 150%;
	}
}
/*----------  1.4. Media screen max width 600px  ----------*/

@media screen and (max-width: 600px) {
	.slz-block-grid .block-element .block-title,
	.slz-isotope-grid-2 .grid-item .block-title {
		font-size: 18px!important;
	}
	.slz-block-grid .block-element {
		width: 100%!important;
	}
	.slz-block-grid .block-element .block-info{
		display: none!important;
	}
	.slz-block-grid .block-element .block-text{
		display: none!important;
	}
	.header-absolute{
		padding-top: 20px;
	}
	.slz-title-command .title-command-wrapper  .title{
		font-size: 36px;
	}
	.slz-footer-bottom .item-wrapper {
		display: block;
		width: 100%;
	}

	.slz-footer-bottom .item-wrapper:last-child {
		text-align: left;
		margin-top: 10px;
	}

	.navbar-footer {
		padding-left: 0 !important;
	}
	.comments-area .comment-form-email,
	.comments-area .comment-form-author{
		display: block;
		width:100%;
		float: none;
		padding-right: 0px;
		padding-left: 0px;
	}

	
}

/*----------  1.5. Media screen max width 480px  ----------*/

@media screen and (max-width: 480px) {
	/*----------  Isotope Grid  ----------*/
	.slz-btn {
		margin-right: auto;
		margin-left: auto;
		display: block;
		max-width: 200px;

	}

    .slz-btn + .slz-btn {
    	margin: 0 auto;
    	margin-top: 20px;
    }

    .sc-image-carousel-layout-2 .slider-mockup, .sc_gallery_carousel .slz-carousel-mockup .slider-mockup {
    	width: 100%;
    }
	
    .slz-isotope-grid.column-2 .grid-item {
    	width: 100%;
    }
    .slz-carousel-wrapper .slz-carousel{
    	margin-left: 0px;
    	margin-right: 0px;
    }
    .slz-carousel-wrapper .slz-carousel .slick-slide{
    	padding-left: 0px;
    	padding-right: 0px;
    }
    
    .slz-block-grid .slz-block-item-01 .block-content {
    	padding: 10px 15px 50px 15px;
    }

    .slz-block-grid.style-5 .block-image:before {
    	padding-top: 120%;
    }
	
   	.slz-blog-author .media-left {
   		display: block;
   	}
   	.slz-blog-author .media-right {
   		display: block;
   		padding-left: 0;
   		padding-top: 15px;
   	}
}
/*----------  1.6. Media screen max width 414px  ----------*/
@media screen and (max-width: 414px) {
	/*----------  Isotope Grid  ----------*/
	.slz-isotope-grid-2.column-4 .grid-item {
        width: calc(100% - 20px);
    }

    .slz-sub-header .slz-block-item-03.style-2 .block-image {
    	width: 100%;
    	padding-left: 0;
    	padding-top: 20px;
    }
    .comments-area .comment-metadata{
        padding-left: 60px;
    }

    .slz-block-item-01 .block-read-more {
    	max-width: 140px;
    	display: block;
    }

    .content-wrapper-404 .slz-group-btn  .slz-btn {
		display: block;
		margin-left: auto !important;
		margin-right: auto !important;
    }



	.slz-posts-mansory .slz-isotope-grid-2 .grid-item:before, 
	.slz-posts-mansory .slz-isotope-grid-2 .grid-item-width-2:before {
		padding-top: 120%;
	}
}

/*----------  1.8. Media screen max width 320px  ----------*/
@media screen and (max-width: 320px) {

}

/*
=====  End of RESPONSIVE SCREEN  ======
*/
