/* GOOGLE FONTS */

@import url('https://fonts.googleapis.com/css2?family=Crimson+Text:wght@400;600&family=Fira+Sans:wght@400;500&display=swap');

body{
font-family:'Fira Sans', sans-serif;
background-color:#ffffff;
color:#666666;
text-align:center;
margin:0;
}

/* NAVIGATION  */

nav{
margin:20px 0 60px 0;
}

nav a{
margin:0 100px;
text-decoration:none;
color:#111111;
font-family:'Fira Sans', sans-serif;
font-size: 14px;

}

nav a:hover{
text-decoration:underline;
}

/* HEADINGS */

h1{
font-family:'Crimson Text', serif;
color:#111111;
font-size:32px;
margin-bottom:5px;
margin-top:45px;
}

.subtitle{
color:#111111;
font-size:16px;
margin-bottom:40px;
}

/* HOME PAGE */

/* HERO IMAGE */

main > img{
width:600px;
margin-top:30px;
}

/* BUTTON */

.button-paragraph{
margin-top:15px;
}

.button-link{
background-color:#414141;
color:white;
text-decoration:none;
padding:10px 22px;
display:inline-block;
border-radius:25px;
margin: 10px;
}

.button-link:hover{
opacity:0.8;
}

/* DIGITALS */

.digitals-top{
width:620px;
margin:10px auto 0 auto;
text-align:left;
padding-left:0px;
}

.digitals-top img{
width:260px;
margin:2px;
}

.digitals-bottom{
width:620px;
margin:0 auto;
text-align:left;
padding-left:170px;
}

.digitals-bottom img{
width:260px;
margin:2px;
}

/* MEASUREMENTS */

.measurements{
margin-top:20px;
}

.measurements p{
display:inline-block;
margin:12px;
font-size: 16px;
display:inline-block;

}

.measurements strong{
font-family:'Crimson Text', serif;
color:#111111;
font-size: 14px;
}



/* PORTFOLIO PAGE */

.portfolio-gallery {
margin-top: 40px;
}

.portfolio-gallery img{
width:500px;
display:block;
margin-left:auto;
margin-right:auto;
margin-top:6px;
margin-bottom:6px;

}

/* ABOUT PAGE */

.about-container{
display:flex;
align-items:center;
justify-content:center;
gap:10px;
max-width:600px;
margin:40px auto;
}

.about-text{
width:260px;
line-height:1.6;
text-align: left;
}

.about-photo{
width:400px;
}

/* FOOTER */

footer{
margin-top:60px;
padding:20px;
}

footer a{
text-decoration:none;
display: inline-block;
}

footer img{
width: 40px;
margin:0px;
align-content: center;
}

footer a:hover{
text-decoration: none;
opacity:0.8;
}

/* MOBILE RESPONSIVE */
@media (max-width:768px){

nav{
text-align:center;
margin-top:20px;
margin-bottom:25px;
}

nav a{
display:inline-block;
margin:0 10px;
font-size:12px;
}

main > img{
width:90%;
max-width:90%;
display:block;
margin:20px auto;
}

/* HOME PAGE DIGITALS */
.digitals-top,
.digitals-bottom{
width:90%;
max-width:90%;
display:flex;
gap:8px;
padding-left:0;
margin:8px auto;
}

.digitals-top{
justify-content:flex-start;
}

.digitals-bottom{
justify-content:flex-end;
}

.digitals-top img,
.digitals-bottom img{
width:47%;
height:auto;
display:block;
margin:0;
}

/* DIGITALS ALIGNMENT MOBILE */
.digitals-top img:first-child{
margin-left:-4px;
}

.digitals-bottom img:last-child{
margin-right:-4px;
}

.measurements{
text-align:center;
}

.measurements p{
display:inline-block;
margin:6px 6px;
font-size:12px;
text-align:center;
}

.portfolio-gallery img{
width:90%;
max-width:90%;
display:block;
margin:12px auto;
}

.about-container{
flex-direction:column;
gap:20px;
max-width:90%;
margin:30px auto;
}

.about-text{
width:90%;
text-align:center;
}

.about-photo{
width:90%;
max-width:90%;
}

}