/* <uniquifier>: Use a unique and descriptive class name
// <weight>: Use a value from 300 to 700

.quicksand-<uniquifier > {
  font-family: "Quicksand", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
*/


html,
body {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: "Quicksand", sans-serif;
  color: #4d4d4d;
font-size: 18px;
	overflow-x: hidden;
}

.article-section{
	width: 80%;
	padding-left:10%;
	padding-top:40px;
	padding-bottom:70px;
}
.article-intro{
	padding-bottom: 50px;
}

.latest-article p, .article-intro, .info-date-1, .author{
	font-size:28px;
	line-height:1.7;
	font-weight:350;
	width:100%;
}
.textlink-style{
	color: #4d4d4d;
}
.textlink-style:hover{
	color: #002528;
	font-size:29px;
	background-color:#E1DEDB;
}
.info-date-1{
	padding-top: 20px; 
}
.article-gallery-intro{
	display:flex;
	flex-direction: row;
	width:100%;
	justify-content: flex-start;
	align-items:flex-end;
}
/* Tvinga själva HTML-bilden att lyda sin behållare */
.gallery-item-intro img {
  	display: block;
	margin: 0;
}


.article-gallery-1, .article-gallery-broad{
	display:flex;
	flex-direction: row;
	justify-content: center;
	width: 100%;
}
.gallery-item img {
  display: block;
  width: 100%;  /* Bilden fyller ut sina 45% av flexboxen */
  height: auto; /* Behåller bildens rätta proportioner */
}

figcaption{
	font-size: 24px;
	line-height: 1.7;
	font-weight:300;
}

h4{
	font-style: normal;
	font-size: 30px;
	letter-spacing: 3pt;
	font-weight: 400;
	font-variant: small-caps;
	margin-top:0;
	margin-bottom: 0;
}
h5{
	font-style: normal;
	font-size: 35px;
	letter-spacing: 2.5pt;
	font-weight: 400;
	font-variant: small-caps;
	margin-top:0;
	margin-bottom: 0;
}
.textlink-style-capt{
	color: #4d4d4d;
}
.textlink-style-capt:hover{
	color: #002528;
	font-size:25px;
	background-color:#E1DEDB;
}
@media screen and (max-width: 1440px){


.latest-article p, .article-intro, .info-date-1, .author{
	font-size:22px;
	line-height:1.5;
	font-weight:300;
}
	.textlink-style:hover{
	color: #002528;
	font-size:23px;
	background-color:#E1DEDB;
}
.article-intro{
	padding-bottom: 40px;
}
figcaption{
	font-size: 20px;
	line-height: 1.5;
	font-weight:250;
}
	.textlink-style-capt:hover{
	color: #002528;
	font-size:21px;
	background-color:#E1DEDB;
}
h4{
	font-style: normal;
	font-size: 30px;
	letter-spacing: 2.5pt;
	font-weight: 400;
	font-variant: small-caps;
	margin-top:0;
	margin-bottom: 0;
}
h5{
	font-style: normal;
	font-size: 26px;
	letter-spacing: 2pt;
	font-weight: 400;
	font-variant: small-caps;
	margin-top:0;
	margin-bottom: 0;
}
}

/* RESPONSIV DESIGN FÖR IPHONE (max-width: 1024px) */
@media screen and (max-width: 1024px) {
	.article-section{
	width:90%;
	padding-left:5%;
	padding-top: 25px;
	padding-bottom: 50px;
}
	.article-intro{
	padding-bottom: 30px;
}
	.latest-article p, .article-intro, .info-date-1, .author{
	font-size:18px;
	line-height:1.5;
	font-weight:300;
}
	.textlink-style:hover{
	color: #002528;
	font-size:19px;
	background-color:#E1DEDB;
}
	figcaption{
	font-size: 16px;
	line-height: 1.5;
	font-weight:250;
}
	.textlink-style-capt:hover{
	color: #002528;
	font-size:17px;
	background-color:#E1DEDB;
}
	h4{
	font-style: normal;
	font-size: 26px;
	letter-spacing: 2pt;
	font-weight: 400;
	font-variant: small-caps;
	
}
	h5{
	font-style: normal;
	font-size: 22px;
	letter-spacing: 1.5pt;
	font-weight: 400;
	font-variant: small-caps;
	
}	

	

/*__________________________________________________________________________________________________*/
/*__________________________________________________________________________________________________*/
/*__________________________________________________________________________________________________*/
	
@media screen and (max-width: 834px){
	
	.article-section{
	width: 96%;
	padding-left:2%;
	padding-top: 20px;
	padding-bottom: 40px;
}
	.article-intro{
	padding-bottom: 20px;
}
	.latest-article p, .article-intro, .info-date-1, .author{
	font-size:16px;
	line-height:1.5;
	font-weight:300;
}
	.textlink-style:hover{
	color: #002528;
	font-size:17px;
	background-color:#E1DEDB;
}
	.article-gallery-intro{
	display:flex;
	flex-direction: column;
	width:100%;
	justify-content: flex-start;
	align-items:flex-end;
}
	.article-gallery-1, .article-gallery-broad{
	display:flex;
	flex-direction: column;
	width:100%;
	justify-content: flex-start;
	align-items:flex-end;
}
	
figcaption{
	font-size: 15px;
	line-height: 1.5;
	font-weight:250;
}
	.textlink-style-capt:hover{
	color: #002528;
	font-size:16px;
	background-color:#E1DEDB;
}
	
h4{
	font-style: normal;
	font-size: 22px;
	letter-spacing: 2.5px;
	font-weight: 350;
	font-variant: small-caps;
}
h5{
	font-style: normal;
	font-size: 20px;
	letter-spacing: 2.5px;
	font-weight: 350;
	font-variant: small-caps;
}
}
@media screen and (max-width: 500px){
	.article-intro{
	padding-bottom: 15px;
}
	.latest-article p, .article-intro, .info-date-1, .author{
	font-size:16px;
	line-height:1.5;
	font-weight:300;
	width: 96%;
	padding-left:2%;
}
	.textlink-style:hover{
	color: #002528;
	font-size:17px;
	background-color:#E1DEDB;
}
	.gallery-item-intro img {
  	display: block;
	margin: 0;
	width: 100%;
	max-width:510px;
	height: auto;
}
}
	
	

/*__________________________________________________________________________________________________*/
/*__________________________________________________________________________________________________*/
/*__________________________________________________________________________________________________*/


}
