:root{

--color1: #2B3467;
--colorText1: #000;
--colorText2: #D84040;
--colorText3: #BAD7E9;

--maincolor: var(--color1);
--bordercl:var(--color1);
--callouctcolor:var(--color1);
--hovercolor:var(--color1);
--darkMaincolor: var(--color1);
--background: #fff
}

html {
  background: var(--background);
	color: var(--colorText1);
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
  font-size: 16px;
  line-height: 1.5em;
}

@media screen and (max-width: 600px) {
  html {  
		font-size: 14px;  
	}	
}

body{
  display: block;
  margin: 8px;
}

::selection {
  background: var(--maincolor);
  color: #fff;
}

a {
	color: inherit;
}

ul {  
  padding-left: 2ch;
}


img {
  border: 1px solid var(--bordercl);
  max-width: 100%;
	border-radius: 10px;
}

figure {
  display: flex;  
}

figure img {
  max-height: 500px;
  margin: auto;
}

figcaption {
	text-align: center;
}

figcaption p {
	margin-top: 5px;
	font-size: 0.9rem;
}

.content {
  margin-bottom: 4em;
  margin-left: auto;
  margin-right: auto;
  max-width: 800px;
  padding: 0 1ch;
  word-wrap: break-word;
}

header {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;  
  margin-top: 1em;
  line-height: 2.5em;
  column-gap:30px;		
  padding-bottom: 0.5em;
}

header .main {
  font-size: 1.2rem;
	font-weight: bold;	
	color: var(--maincolor);
  text-transform: uppercase;	
}

header a {    
  text-decoration: none;
}

header a:hover {
    opacity: 0.7;		
}


header nav {
	font-weight: bold;
	text-transform: uppercase;
	font-size: 0.95em;
}

header nav a {
	margin-right: 10px;
	text-decoration: underline;
	color: var(--maincolor);		
}

header nav a:last-child {
	margin-right: 0px;
}

.title h1 {  
	font-size: 2rem;
	line-height: 2.6rem;
	font-weight: 600;	
	color: var(--colorText2);
	
}

h1, h2, h3, h4, h5, h6 {
  color: var(--maincolor);
}

h1 {
	font-size: 1.6rem;
	font-weight: 600;	
}

h2 {
  font-size: 1.4rem;  	
	font-weight: 600;	
}

h3, h4, h5, h6 {
  font-size: 1.2rem;  	
	font-weight: normal;
}

code {
  white-space: pre-wrap;
  word-break: break-word;
}

.menu {
   color: var(--colorText1);
}

.posts {
	padding-left: 0px;
	list-style: none;
	font-size: 1.2em;
}	

.post a {
	text-decoration: underline;	
}

.post .title {
	margin-left: 10px;
}

.pagination {
	display: flex;
	justify-content: space-between;
	padding-left: 0px;
}

.meta {
	font-size: 0.9em;
	font-weight: bold;
	margin-top: 8px;	
}

.title h1, h1.title {
  margin-bottom: 0;	
}

.tags a {
	text-decoration: underline;
  text-transform: capitalize;
}

.tag-title {
	text-transform: capitalize;
}

table {
  border-spacing: 0;
  border-collapse: collapse;
}

table th{
  padding: 6px 13px;
  border: 1px solid var(--bordercl);
  font-size: large;
}

table td{
  padding: 6px 13px;
  border: 1px solid var(--bordercl);
}

.image-gallery li
{
  display: block;
}