:root {
    --border-color: #173943;
    --color-bg: #003a4460;
    --dark-bg: rgba(0, 0, 0, 0.8);
    --light-blue: #2486cc;
    --light-yellow: #f0a63b;
    --dark-yellow: #48320b;

}

* {
    box-sizing: border-box;
}

body {
	padding: 15px 0;
	background-image: linear-gradient(to top, var(--dark-bg), var(--dark-bg)), url("../media/identity/mewts_back_image.jpg");
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
    color: var(--light-blue);
    font-family: Arial, Helvetica, sans-serif;
    width: 100%;
}

#content {
	background: var(--color-bg);
  padding-right: 35px;
}

#content a {
	text-decoration: underline;
}

img {
	width: 100%;
}

#navigation h1.nav-header {
	padding: 0 15px;
	margin-bottom: 0;
}

#navigation a.nav-header {
	padding: 5px 15px;
	font-weight: bold;
}

#navigation ul.uk-nav {
	padding: 15px 0;
}

#navigation p {
	padding-bottom: 10px;
}

#content h2 {
	font-family: Arial, Helvetica, sans-serif;
   
}

#content img.header {
	margin-bottom: 20px;
}

#content ul {
	list-style-type: square;
}

hr {
 margin: 30px 0 30px 0;
}

#content li.done {
	color: #008000;
	text-decoration: line-through;
}

#content div.images div {
	padding-bottom: 25px;
}

#content p.images-text {
	margin-top: -15px;
}

#content .iframe-container {
	position: relative;
	/* Magic! Makes sure the container is high enough to show the entire iframe 
	 * Thanks to http://andmag.se/2011/11/responsive-embeds/ */
	padding-bottom: 56.5%;
}

#content iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

h1, h2, h3, h4, h5, h6 {
  margin: 40px 0 20px 0;
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight: normal;
  color: var(--light-yellow);
  text-transform: none;
}

.uk-nav-side>li>a {
    color: #b7b7b7;
}

.uk-nav-side>li>a:hover,
.uk-nav-side>li>a:focus {
  background:rgba(0,0,0,0.03);
  color:#ffffff;
  outline:0;
  box-shadow:inset 0 0 1px rgba(92, 92, 92, 0.1);
  text-shadow:0 -1px 0 #fff
}

.uk-alert {
  background: #16465e;
  color: #c5e6f6;
  text-shadow: 0 1px 0 #1e1d4a;
}

b, strong {
	color: var(--light-yellow);
}

@media (max-width: 767px) {
	h2 {
		margin-top: 25px;
	}
}