@charset "UTF-8";
* { margin: 0; padding: 0; } 
body{background-image: url("../Images/Background.jpg");
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	text-align: center;
}

/* format the header */
.Header{height: 50px;
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	text-align: center;
	color: solid black;
}
	
#Top{display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 10px;
  grid-auto-rows: minmax(100px, auto);
	font-family: "American Typewriter";
}

#Column1{width:300px;
	position: left}

#Column2 nav ul li{list-style: none;
	padding: 10px;
}

#Column2 nav ul li:before{content: '';
   display: inline-block;
   height: 12px;
   width: 20px;
   background-image: url("../Images/USA.png");
	background-size:contain;
	background-repeat: no-repeat;
}

#Column2 nav ul li a{color: solid black;
	text-decoration: none;
}

#Column2{padding-top: 20px;
}

#Column2 ul li:hover{text-decoration: underline}
#Column2 ul li:active{font-weight: bold}
#Column2 ul li:visited{color: solid black;
}

#Column3 nav ul li{display: inline;
	padding-left: 10px;
}

#Column3 nav ul li a{color: solid black;
	text-decoration: none;
}

#Column3{padding-top: 20px;
}

#Column3 ul li:hover{text-decoration: underline}
#Column3 ul li:active{font-weight: bold}
#Column3 ul li:visited{color: solid black}


#MainTitle{text-align: center;
	text-decoration: none;
	font-weight:normal;
	letter-spacing: 10px;
	color: #D79F10;
}

#Intro{font-size: 20px; 
	margin: 50px;
	font-family: "American Typewriter";
	text-align: justify;
}

.PubTitles{text-align: center;
	text-decoration: none;
	font-weight:normal;
	color: #D79F10;
}

#Publications{display: grid;
	grid-column-gap: 50px;
	grid-template-columns: 1fr 1fr;
	font-family: "American Typewriter";
	margin-left: 50px;
	margin-right: 50px;
}

.covers{padding: 20px;
	padding-top: 50px;
}

.papertit{font-size: 20px;
	font-weight: bold;
	padding-bottom: 20px;
}

.Authors{padding-bottom: 20px;
}

.editorial{padding-bottom: 20px;
text-align: left;
}

.Abstract{padding-bottom: 20px;
	text-indent: 40px;
}

#allpubs{margin-left: 50px;
	margin-right: 50px;
	margin-bottom: 25px;
	text-align: left;
	font-family: "American Typewriter";
	font-size: 20px;
	padding-top: 20px;
}

#Portocols p{margin-left: 50px;
	margin-right: 50px;
	margin-bottom: 25px;
	margin-top: 25px;
	text-align: left;
	font-family: "American Typewriter";
	font-size: 20px;
	text-align: justify;
}

#book p{margin-left: 50px;
	margin-right: 50px;
	margin-bottom: 25px;
	margin-top: 25px;
	text-align: left;
	font-family: "American Typewriter";
	font-size: 20px;
	padding-bottom: 80px;
	text-align: justify;
}

@media only screen and (max-width: 600px) {
	#Top{display: grid;
  grid-template-columns: repeat(2, 1fr);}
	#Column3 {grid-column: 2; grid-column-start: 1; grid-column-end: span col2-start;}
}

@media only screen and (max-width: 768px) {
	#Publications{grid-template-columns: 2fr;
	grid-column-gap: 20px;
	margin-left: 20px;
	margin-right: 20px;}
	.Header{height: 120px;}
	#Column3 {grid-column; 2; grid-row: }
	
}

@media only screen and (max-width: 420px) {
	.Header{height: 170px}
	#Column1{margin: auto}
	#Publications{grid-template-columns: 1fr;
	margin-left: 10px;
	margin-right: 10px;}
	#allpubs{margin-left: 10px;
	margin-right: 10px;
	padding-top: 20px;}
	#Portocols p{margin-left: 10px;
	margin-right: 10px;}
	#book p{margin-left: 10px;
	margin-right: 10px;}
	#MainTitle{padding: none;
	margin:auto}
	#Intro{margin: 20px;}
	#Top{display: grid;
  grid-template-columns: repeat(1, 1fr);}
}