@import 'blog.css'; 
@import 'about.css';
@import 'images.css';
@import url('https://fonts.googleapis.com/css2?family=Caveat&family=Neonderthaw&family=Open+Sans:ital,wght@1,300&family=Roboto+Mono:ital,wght@0,100;1,100&display=swap');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css')

:root{
	--primary:  #e6e6fa;
	--pri-dark: #cec8ef;
	--dark:  #333;
	--light: #ffffe0;
	--shadow:  0 1px 5px rgba(104, 104, 104, 0.8);
	font-family: 'Open Sans', sans-serif;

}


html {
	box-sizing: border-box;
	box-shadow: var(--shadow);
	font-family: "sans-serif" , sans-serif;
	color:  var(--dark);

}

body {
	box-sizing: border-box;
	box-shadow: var(--shadow);
	background: var(--primary);
	margin: 5px 25px;
	line-height: 2rem;
	
}

#home-title {
	display: flex;
	justify-content: center;
	font-size: 50px;
	margin: 5px;
	margin-top: 15px;
	padding: 5px;
}

#title-description {
	display: flex;
	justify-content: center;
	font-size: 30px;
}

body * {
	background: var(--primary)!important;
}


.main-nav ul{
	display: grid;
	background: var(--pri-dark) !important;
	grid-gap: 20px;
	padding: 20px;
	list-style: none;
	grid-template-columns: repeat(4,1fr);
	

}

.main-nav a{
	background:  var(--pri-dark);
	color: var(--dark);
	display:  flex;
	padding:  0.1 rem;
	justify-content: center;
	align-items: center;
	text-decoration: none;
	text-transform: uppercase;
	box-shadow: var(--shadow);
}



.size{
	display: grid;
	grid-template-columns: 1fr  0.1in [start] 0in 8.3in 0in [end] 0.1in 1fr;
	height: fit-content;
	padding: 2px 50px;
	box-shadow: var(--shadow);
	border-color: var(--dark);
	justify-items: center;

}

img.size {

	width: 40%;
	display: grid;
	margin-left: 25%;
	margin-right: 25%;
	align-items: center;
}


figcaption p{
	display: flex;
	font-weight: 400 1.rem/1.5 "Open Sans"; color: hsl(000, 000%, 33%);
	justify-content: center;
	align-items: center;
	font-size: 25px;
}

.fa {
  padding: 20px;
  font-size: 30px;
  width: 50px;
  text-align: center;
  text-decoration: none;
}

.fa:hover {
  opacity: 0.7;
}

/* Facebook */
.fa-facebook {
  background: #3B5998;
  color: white;
}

/* Twitter */
.fa-twitter {
  background: #55ACEE;
  color: white;
}

.fa-linkedin {
  background: #55ACEE;
  color: white;
}
blockquote {
    margin: 0;
}

blockquote p {
    padding: 15px;
    background: #eee;
    border-radius: 5px;
}

blockquote p::before {
    content: '\201C';
}

blockquote p::after {
    content: '\201D';
}


footer {
	box-sizing: border-box;
	box-shadow: var(--shadow);
	font-family: "sans-serif" , sans-serif;
	color:  hsl(000, 000%, 33%);
	display: flex;
	align-items: center;
	justify-content: center;
}