@import "../components/Headers/defaultHeader.css";

header .header-content-small img {
    height: 43.78vh;
    min-height: 400px;
}

.news-stripe .col-content-info {
    gap: 1vw;
    margin-bottom: 0.885vw;
}
.news-stripe .col-content-info > * {
    line-height: 1;
}

/* Big Laptops - Ok until 1441 px
------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1620px) {

}

/* Standard Laptops - Ok until 1281px
------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1440px) {

}

/* Small Laptops - Ok until 1150px
------------------------------------------------------------------------------------------------*/
    @media screen and (max-width: 1280px) {
		.news-stripe .col-content-info {
		    gap: 20px;
		    margin-bottom: 15px;
		}
		#news .four-col-grid {
		    grid-template-columns: 1fr 1fr 1fr;
		}
    }


/* Ok until 993px
------------------------------------------------------------------------------------------------*/
    @media screen and (max-width: 1150px) {

    }


/* Mobile Start ok until 768px
------------------------------------------------------------------------------------------------*/
	@media screen and (max-width: 992px) {
	    .news-stripe .col-content-info {
	        margin-bottom: 10px;
	    }
		#news .four-col-grid {
		    grid-template-columns: 1fr 1fr;
		}	    
	}



/* Mobile All
------------------------------------------------------------------------------------------------*/
	@media screen and (max-width: 767px) {
		header .header-content-small img {
		    height: 37.78vh;
		    min-height: 315px;
		}
		
		/* General Preview
		-------------------------------------------------------*/
			.news-stripe .col-content-info {
			    gap: 12px;
			}
	}

/* Mobile Landscape only
------------------------------------------------------------------------------------------------*/
	@media screen and (max-width: 767px) and (orientation: landscape) {

	}

/* Mobile port
------------------------------------------------------------------------------------------------*/
	@media screen and (max-width: 600px) {
		#news .four-col-grid {
		    grid-template-columns: 1fr;
		}
		.four-col-grid .content-sp {
		    padding: 1.5em .5em;
		}
	}