/* <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{
	width: 80%;
	padding-left:10%;
	padding-top:40px;
	padding-bottom:70px;
}

	p,  .info-date-1, .author{
	font-size:28px;
	line-height:1.7;
	font-weight:350;
	width:100%;
}
.info-date-1{
	padding-top: 20px; 
}

.article-gallery {
	display: flex;
	flex-direction: row;
	gap: 20px; /* Ger ett jämnt och snyggt avstånd mellan bilderna */
	width: 100%;
}

.gallery-item {
	flex: 1; /* Tvingar båda elementen att dela på utrymmet exakt lika (50/50) */
	min-width: 0; /* Förhindrar att lång text eller stora bilder trycker ut flexboxen */
}

.gallery-item img {
	width: 100%;
	height: auto;
	display: block; /* Tar bort det lilla tomrummet som kan uppstå under <img> */
}

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

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;
}

@media screen and (max-width: 1440px){


p, .info-date-1, .author{
	font-size:22px;
	line-height:1.5;
	font-weight:300;
}


figcaption{
	font-size: 20px;
	line-height: 1.5;
	font-weight:250;
	padding-top: 30px;
}

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{
	width:90%;
	padding-left:5%;
	padding-top: 25px;
	padding-bottom: 50px;
}
	p, .info-date-1, .author{
	font-size:18px;
	line-height:1.5;
	font-weight:300;
}
	figcaption{
	font-size: 16px;
	line-height: 1.5;
	font-weight:250;
	padding-top:20px;
}
	
	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{
	width: 96%;
	padding-left:2%;
	padding-top: 20px;
	padding-bottom: 40px;
}
	p, .info-date-1, .author{
	font-size:16px;
	line-height:1.5;
	font-weight:300;
}
	.article-gallery {
	display: flex;
	flex-direction: column;
	gap: 20px; /* Ger ett jämnt och snyggt avstånd mellan bilderna */
	width: 100%;
}
	
figcaption{
	font-size: 15px;
	line-height: 1.5;
	font-weight:250;
}
	
	
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){

	p,  .info-date-1, .author{
	font-size:16px;
	line-height:1.5;
	font-weight:300;
	width: 96%;
	padding-left:2%;
}
}
	
	

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


}
