html {
	/* background-color: black; */
	padding: 0px;
	margin:0px;
}

body {
	/* border: 10px solid black; */
	background-color: white;
	padding: 20px;
	font-family: sans-serif;
}


.common_era {
	display: flex;
	flex-direction:column;
}



.title_header {
	display: flex;
	flex-direction: row;
	/* height: 70px; */
	/* background-color: #f1f1f1; */
	/* width: 98%; */
	/* margin: 10px; */
	/* border: 1px solid #ddd; */
	/* background-color: #ddd; */
		justify-content: space-between;

}

.title_info {
	/* align-items: stretch; */
	/* margin-bottom: 50px; */
	/* border-left: 1px solid #ddd; */

	/* background-color: yellow; */
	font-size: 0.7em;
	padding: 10px 0px 0px 20px;
	margin-bottom: 20px;
}

.title_info h1, h2 {
	/* padding: 0px; */
	margin: 8px;
}


.title_info img {
	width: 50px;
	margin-top: -20px;
}

.label {
padding:5px; 
border-radius:5px; 
font-variant:small-caps
}

.lbl_rn {
padding:5px; 
border-radius:5px; 
font-variant:small-caps
}

#mbl_rn {
	display: none;
}


.century_header {
	display: flex;
	flex-direction: row;
	/* height: 90px; */
	/* background-color: #f1f1f1; */
	width: 98%;
    margin:50px 0px 0px 0px;
	/* margin-bottom:  25px; */
	/* border: 1px solid #ddd; */
	/* background-color: #ddd; */
}

.century_info {
	/* align-items: stretch; */
	margin-bottom: 20px;
	/* border-left: 1px solid #ddd; */
    /* border:1px solid black; */
	/* font-size: 0.8em; */
	min-width: 120px;
	padding: 10px 0px 0px 10px;
}

.century_info h1 {
	margin: 0px;
	font-size: 1.2em;
	padding: 0px;
}

.century {
	display: flex;
	flex-direction: row;
	/* background-color: #f1f1f1; */
	width: 98%;
	margin: 10px;
	/* border-top: 1px solid #ddd; */
    /* border-bottom:1px solid #ddd; */
    border-right:1px solid #ddd;
    /* border:1px solid #ddd; */

}

.decade {
align-items: flex-start;
	/* flex-grow: 3; */
	margin-bottom: 50px;
    width:10%;
	border-left: 1px solid #ddd;
	font-size: 0.7em;
	padding: 0px;
    height: auto;
    /* outline:1px solid green */
}

  .decade h1 {
  font-size: 1.2em;
  display: inline-block;
  margin: 0px 0px 5px 0px;
  padding: 0px 10px 0px 5px;
}
 .decade p {
 margin:5px 5px 10px 5px;
  /* outline: 1px solid red; */
 }

 .banner {
background:#eee;
margin:0px 0px 10px 0px !important;
padding:5px;
/* text-align:center; */
}

.banner-30 {
   background:#74b9ff;
margin:0px 0px 10px 0px !important;
padding:5px;
color:white;
}

.banner-eng {
   background:#a29bfe;
margin:10px 0px 10px 0px !important;
padding:5px;
color:white;
}


.highlight {
    background: #D980FA;
    padding:3px;
    color:#fff;
}

 h1 {
  font-family: "proxima-nova";
  font-weight: 900;
  /* text-transform: uppercase; */
  font-variant: small-caps;
}

footer{
	text-align: right;
	font-size: 0.5em;
}

/* /////////////////////////// */
@media screen and (max-width: 985px) {

.lbl_rn {
	display: none;
}

#mbl_rn {
	width:100px; 
	margin-top: -10px;
	height: 35px;
	/* background: red; */
	background: linear-gradient(to right, slategray, gold, gold); 
	text-align: center; 
	/* border:1px solid black;  */
	border-radius: 5px; 
	display:block;
}

}




/* /////////////////////////// */
@media screen and (max-width: 850px) {

.century_header {
	display: flex;
	flex-direction: row;
	/* height: 100px; */
	/* background-color: #f1f1f1; */
	width: 98%;
	margin-bottom: 0px;
	/* margin: 10px; */
	/* border: 1px solid #ddd; */
	/* background-color: #ddd; */
}


.century {
	display: flex;
	flex-direction: column;
	border-top: none;
}

.decade {
	width: 100%;
	border: 1px solid #ddd;
	margin-bottom: 10px;
}

  .decade h1 {
  font-size: 1.2em;
  display: inline-block;
  margin: 5px 0px 5px 0px;
}

.lbl_rn {
	display: none;
}



}

/* /////////////////////////// */
@media screen and (max-width: 420px) {

body {
	width: 130%;
	padding: 0px;
}

.title_info img {
	margin: 10px;
}

.lbl_rn {
	display: none;
}

#mbl_rn {
	width:100px; 
	margin-top: -10px;
	height: 35px;
	/* background: red; */
	background: linear-gradient(to right, slategray, gold, gold); 
	text-align: center; 
	/* border:1px solid black;  */
	border-radius: 5px; 
	display:block;
}

}